:root{
  --bg:#E9DFC9; --cream:#F4ECDA; --text:#2E2418; --muted:#5E4F3B;
  --burg:#4A1520; --burg-d:#2E0C14; --burg-m:#7A2230;
  --brown:#5C3E26; --brown-d:#3F2A18; --brown-dd:#2E1D10;
  --gold:#C9A24B; --gold-l:#E7D3A1; --line:#B9A783;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;scrollbar-color:var(--burg-m) var(--bg)}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
::-webkit-scrollbar{width:16px;height:16px}
::-webkit-scrollbar-track{background:var(--bg);border-left:1px solid #C9B993}
::-webkit-scrollbar-thumb{background:var(--burg-m);border-radius:10px;border:4px solid var(--bg);min-height:48px}
::-webkit-scrollbar-thumb:hover{background:var(--burg)}
body{margin:0;background:var(--bg);color:var(--text);font:16px/1.6 Inter,system-ui,sans-serif;position:relative;z-index:0}
[hidden]{display:none !important}
a{color:var(--text)}
h1,h2,h3{font-family:Newsreader,Georgia,serif;font-weight:400;margin:0}
.wrap{max-width:1160px;margin:0 auto;padding:0 24px}
.eyebrow{margin:0 0 16px;font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l)}

/* header */
header.site{background:var(--burg);border-bottom:1px solid var(--burg-d);box-shadow:0 3px 0 var(--gold) inset}
header.site .bar{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:16px;padding-top:18px;padding-bottom:18px}
.brand{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 14px}
.logo{font-family:Newsreader,Georgia,serif;font-style:italic;font-size:30px;font-weight:500;color:var(--cream);text-decoration:none}
.tag{font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--gold-l)}
header.site nav{display:flex;flex-wrap:wrap;align-items:center;gap:20px;font-size:15px}
header.site nav a{color:var(--cream);text-decoration:none}
header.site nav a:hover{color:var(--gold-l)}
.whobox{display:flex;align-items:center;gap:10px;color:var(--cream)}

/* windows */
.win{border-radius:3px;color:var(--cream);box-shadow:0 0 0 3px var(--gold) inset,0 12px 28px rgba(46,12,20,.35)}
.win-burg{background:var(--burg);border:4px solid var(--burg-d)}
.win-brown{background:var(--brown);border:4px solid var(--brown-dd)}
.win p{color:#EDE3CC}
.card{background:var(--cream);border:4px solid var(--brown);border-radius:3px;box-shadow:0 0 0 2px var(--gold) inset,0 14px 36px rgba(63,42,24,.3);padding:28px}

/* buttons */
.btn{display:inline-block;font:600 16px/1.2 Inter,system-ui,sans-serif;padding:14px 26px;min-height:44px;border-radius:3px;cursor:pointer;text-decoration:none;text-align:center}
.btn-gold{background:linear-gradient(#F6E9C4,#D4B060 55%,#EFDDA5);border:1px solid #A8832F;color:var(--text)}
.btn-gold:hover{filter:brightness(1.05)}
.btn-ghost{background:transparent;border:2px solid var(--gold);color:var(--cream)}
.btn-burg{background:var(--burg-m);border:0;color:#fff;box-shadow:0 2px 0 var(--burg)}
.btn-burg:hover{background:var(--burg)}
.btn-sm{padding:8px 16px;font-size:14px;min-height:36px}
.linkbtn{background:none;border:0;padding:0;font:inherit;color:var(--burg-m);text-decoration:underline;cursor:pointer;font-weight:600}
.btn:focus-visible,.linkbtn:focus-visible,input:focus-visible,textarea:focus-visible,select:focus-visible,a:focus-visible,button:focus-visible{outline:3px solid #2E5AAC;outline-offset:2px}

/* forms */
label.lbl{display:block;font-size:13px;font-weight:600;color:var(--muted);margin:16px 0 4px}
input[type=text],input[type=email],input[type=password],textarea,select{width:100%;padding:12px;border:1px solid var(--line);border-radius:3px;background:#FBF7EC;font:16px Inter,system-ui,sans-serif;color:var(--text);min-height:44px}
textarea{resize:vertical;min-height:90px}
.poemfield{font-family:Newsreader,Georgia,serif;font-size:19px;line-height:1.55}
fieldset{border:0;padding:0;margin:20px 0 0}
legend{font-size:13px;font-weight:600;color:var(--muted);margin-bottom:10px;padding:0}
.radios{display:flex;flex-wrap:wrap;gap:8px 22px;font-size:15px}
.radios label{display:flex;align-items:center;gap:8px;cursor:pointer}
.msg{margin:14px 0 0;padding:10px 14px;border-radius:3px;font-size:15px;background:#EFE3C2;border:1px solid var(--line)}
.msg.err{background:#F6DCDC;border-color:#B04A4A;color:#5A1212}
.msg.ok{background:#E1EBD2;border-color:#7C9A5A;color:#2A3F12}
.help{font-size:14px;color:var(--muted);margin:10px 0 0}

/* tabs */
.tabs{display:flex;gap:8px;margin:0 0 8px}
.tab{flex:1;padding:10px;font:600 15px Inter,system-ui,sans-serif;border:1px solid var(--line);background:transparent;color:var(--muted);cursor:pointer;border-radius:3px;min-height:44px}
.tab[aria-selected=true]{background:var(--burg);color:var(--cream);border-color:var(--burg-d)}

/* avatars */
.avbox{display:inline-block;flex:none;border-radius:50%;line-height:0;overflow:hidden}
.av32{width:32px;height:32px}.av28{width:28px;height:28px}.av48{width:48px;height:48px}
.avsvg{width:100%;height:100%;display:block}
.picker{display:flex;flex-wrap:wrap;gap:12px}
.pick{position:relative;cursor:pointer;border-radius:50%;line-height:0;display:block}
.pick input{position:absolute;opacity:0;inset:0;margin:0;cursor:pointer;width:100%;height:100%}
.pick .avbox{border:2px solid var(--cream)}
.pick input:checked+.avbox{outline:3px solid var(--burg-m);outline-offset:2px}
.pick input:focus-visible+.avbox{outline:3px solid #2E5AAC;outline-offset:2px}

/* sections */
.hero{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:48px;align-items:start;padding-top:64px;padding-bottom:64px}
.hero .win{padding:52px 44px}
.hero h1{font-size:clamp(44px,6vw,72px);line-height:1.05;letter-spacing:-.02em;margin:0 0 20px;color:var(--cream)}
.hero .lede{font-size:19px;max-width:480px;margin:0 0 32px}
.row{display:flex;flex-wrap:wrap;gap:12px}
.how{padding:24px 0 40px}
.how .win{padding:56px 48px}
.how h2{font-size:40px;letter-spacing:-.01em;margin:0 0 40px;color:var(--cream)}
.steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:40px}
.steps .n{margin:0 0 8px;font-family:Newsreader,Georgia,serif;font-style:italic;font-size:32px;color:var(--gold-l)}
.steps h3{font:600 19px Inter,system-ui,sans-serif;margin:0 0 8px}
.steps p{margin:0}
.read{padding:48px 0 40px}
.read .head{padding:32px 36px;margin-bottom:32px}
.read .head .top{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:space-between;gap:16px}
.read .head h2{font-size:40px;letter-spacing:-.01em;color:var(--cream)}
.read .head p{margin:12px 0 0;max-width:600px}
.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;align-items:start}
.poem h3{font-size:26px;font-weight:500;margin:0 0 12px}
.poem .body{font-family:Newsreader,Georgia,serif;font-size:19px;color:#3A2E20;white-space:pre-wrap;overflow-wrap:anywhere;margin:0 0 20px}
.byline{display:flex;align-items:center;gap:10px;font-size:14px;color:var(--muted);flex-wrap:wrap}
.byline .sp{flex:1}
.notes{margin-top:20px;padding-top:16px;border-top:1px dashed var(--line)}
.notes h4{margin:0 0 12px;font-size:13px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--burg-m)}
.note{display:flex;gap:10px;margin-bottom:14px;font-size:14px}
.note .who{font-weight:600}
.note .txt{white-space:pre-wrap;overflow-wrap:anywhere;color:#3A2E20}
.note .meta{font-size:12px;color:var(--muted)}
.empty{padding:28px;text-align:center;color:var(--muted)}
.banner{background:var(--burg);border:4px solid var(--burg-d);border-radius:3px;box-shadow:0 0 0 3px var(--gold) inset;color:var(--cream);padding:64px 32px;text-align:center;margin:24px 0 88px}
.banner h2{font-style:italic;font-size:clamp(32px,4vw,44px);margin:0 0 16px}
.banner p{max-width:460px;margin:0 auto 28px}
footer.site{background:var(--brown-d);border-top:4px solid var(--gold);color:#E9DFC9;font-size:14px}
footer.site .bar{display:flex;flex-wrap:wrap;justify-content:space-between;gap:16px;padding-top:32px;padding-bottom:32px}
footer.site a{color:#E9DFC9;margin-left:24px}
footer.site a:first-child{margin-left:0}
.setup{max-width:640px;margin:48px auto;padding:28px}
#captcha{margin-top:12px}
.report{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.report input{flex:1;min-width:160px}
.pending-note{margin-bottom:24px;padding:16px 20px}
.pending-note h3{font:600 16px Inter,system-ui,sans-serif;margin:0 0 6px}
.pending-note ul{margin:6px 0 0;padding-left:20px}

/* admin */
.adm-item{margin-bottom:18px}
.adm-item .txt{white-space:pre-wrap;overflow-wrap:anywhere;font-family:Newsreader,Georgia,serif;font-size:18px;margin:8px 0 12px}
.adm-meta{font-size:13px;color:var(--muted)}
.badge{display:inline-block;font-size:12px;font-weight:600;padding:2px 8px;border-radius:3px;background:var(--burg);color:var(--cream);margin-right:6px}
.adm h2{font-size:30px;margin:36px 0 16px}

/* idle dictator */
.dd{position:fixed;left:0;top:0;z-index:50;pointer-events:none;animation:roam 22s linear infinite}
@keyframes roam{0%{transform:translate(4vw,58vh)}20%{transform:translate(62vw,14vh)}45%{transform:translate(66vw,60vh)}70%{transform:translate(30vw,66vh)}100%{transform:translate(4vw,58vh)}}
.dd .bob{animation:bob .5s ease-in-out infinite alternate}
.dd .ddbtn{pointer-events:auto;cursor:pointer;background:none;border:0;padding:0;display:block;line-height:0}
.dd .ddbtn:focus-visible{outline:3px solid #E7D3A1;outline-offset:2px}
.dd:hover{animation-play-state:paused}
@keyframes bob{from{transform:translateY(0) rotate(-6deg)}to{transform:translateY(-16px) rotate(6deg)}}
.dd .armA{animation:wavA .45s ease-in-out infinite alternate;transform-origin:82px 68px}
@keyframes wavA{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
.dd .armB{animation:wavB .45s ease-in-out infinite alternate;transform-origin:38px 68px}
@keyframes wavB{from{transform:rotate(18deg)}to{transform:rotate(-18deg)}}
.dd .legL{animation:legL .3s ease-in-out infinite alternate;transform-origin:50px 112px}
@keyframes legL{from{transform:rotate(-14deg)}to{transform:rotate(14deg)}}
.dd .legR{animation:legR .3s ease-in-out infinite alternate;transform-origin:70px 112px}
@keyframes legR{from{transform:rotate(14deg)}to{transform:rotate(-14deg)}}
@media (prefers-reduced-motion:reduce){.dd,.dd .bob,.dd .armA,.dd .armB,.dd .legL,.dd .legR{animation:none}.dd{transform:translate(4vw,58vh)}}
@media (prefers-reduced-motion:reduce){.dd,.dd .bob,.dd .armA,.dd .armB,.dd .legL,.dd .legR{animation:none}.dd{transform:translate(4vw,58vh)}}
