:root { color-scheme: light; --paper:#f5eddc; --ink:#211c18; --red:#aa3023; --line:#c9baa3; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:"Noto Serif SC",Georgia,serif; }
a { color:inherit; text-underline-offset:4px; }
button,textarea { font:inherit; }
button { cursor:pointer; }
:focus-visible { outline:3px solid var(--red); outline-offset:3px; }
.site-header { max-width:1080px; margin:auto; padding:22px 24px; display:flex; justify-content:space-between; align-items:center; gap:16px; border-bottom:1px solid var(--line); }
.site-header .brand { font-size:26px; font-weight:900; text-decoration:none; }
.site-header>a:last-child { font:14px/1.5 sans-serif; }
main { max-width:1080px; margin:auto; padding:0 24px 80px; }
.intro { max-width:750px; padding:76px 0 66px; }
.eyebrow { color:var(--red); letter-spacing:.2em; font:700 12px/1.5 sans-serif; }
h1 { font-size:clamp(36px,6vw,64px); line-height:1.3; margin:16px 0 20px; }
h1 em { color:var(--red); font-style:normal; }
.intro>p:last-child { font:17px/1.9 sans-serif; color:#4f463b; }
.section-heading { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px; border-bottom:2px solid var(--ink); }
h2 { font-size:25px; margin:0 0 16px; }
.section-heading a { font:14px/1.6 sans-serif; }
#feedStatus,#submitStatus { min-height:28px; font:14px/1.7 sans-serif; color:#6a5544; }
.quote-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:16px; margin-top:20px; }
.quote-card { background:#fffaf0; border:1px solid var(--line); padding:24px; min-width:0; }
.quote-card p { font-size:21px; line-height:1.8; overflow-wrap:anywhere; white-space:pre-wrap; margin:0 0 24px; }
.quote-actions { display:flex; gap:10px; flex-wrap:wrap; align-items:center; }
.quote-actions button { min-height:40px; padding:7px 14px; border:1px solid var(--ink); background:var(--ink); color:#fffaf0; border-radius:4px; font:14px/1.5 sans-serif; }
.quote-actions button.report { background:transparent; border-color:transparent; color:#6a5544; margin-left:auto; }
.submit { max-width:730px; margin:100px 0 0; padding:32px; border:1px solid var(--line); background:#fffaf0; }
.submit p { font:15px/1.8 sans-serif; color:#51483e; }
.submit form>label:first-child { display:block; font:700 15px/1.6 sans-serif; margin:18px 0 10px; }
.submit textarea { width:100%; min-height:110px; resize:vertical; padding:14px; background:#fff; border:1px solid #998b78; border-radius:4px; font:17px/1.8 sans-serif; }
.count { text-align:right; margin:0; }
.confirm { display:flex; gap:9px; align-items:flex-start; font:14px/1.7 sans-serif; margin:20px 0; }
.confirm input { margin-top:5px; flex:none; }
#communitySubmit { min-height:44px; padding:10px 20px; background:var(--red); color:white; border:0; border-radius:4px; font:700 15px/1.5 sans-serif; }
#communitySubmit:disabled { opacity:.55; cursor:default; }
footer { border-top:1px solid var(--line); text-align:center; padding:28px 24px calc(28px + env(safe-area-inset-bottom)); font:13px/1.8 sans-serif; }
footer a { margin-left:10px; }
@media(max-width:650px) { .intro { padding:52px 0 44px; } .quote-grid { grid-template-columns:1fr; } .quote-card { padding:20px; } .submit { margin-top:64px; padding:20px; } main { padding:0 20px 60px; } .site-header { padding:18px 20px; } }