*,*::before,*::after{box-sizing:border-box}
html,body{margin:0}
[hidden]{display:none!important}
img{max-width:100%}

/* Look: a government basement after hours. Strip-light green, manila case files, typewritten labels and red rubber stamps. One dark look. */
:root{
  --void:#0a0d0c; --hull:#131917; --hull-2:#1b2320; --line:#34413b;
  --text:#e9efe9; --muted:#9fb0a7; --hi:#9fe6bf; --warn:#e8c26a;
  --accent:#7fd9a8; --accent-glow:rgba(127,217,168,.28);
  --stamp:#d8473f; --stamp-glow:rgba(216,71,63,.35);
  --manila:#e9dcb8; --manila-2:#d9c99c; --ink:#2a2418; --ink-soft:#6a5d44;
  --ok:#86d4a4; --bad:#ef7468;
  --f-display:"Special Elite","Courier New",ui-monospace,monospace;
  --f-body:"IBM Plex Sans",system-ui,-apple-system,"Segoe UI",sans-serif;
  --f-mono:"IBM Plex Mono",ui-monospace,Menlo,monospace;
  color-scheme:dark;
}
html,body{height:100%}
body{background:var(--void);color:var(--text);font-family:var(--f-body);font-size:16px;line-height:1.55}
#fog{position:fixed;inset:0;width:100%;height:100%;z-index:0;pointer-events:none}
.wrap{position:relative;z-index:1;max-width:860px;margin:0 auto;padding-block:20px 48px;padding-left:max(16px,env(safe-area-inset-left,0px));padding-right:max(16px,env(safe-area-inset-right,0px));display:flex;flex-direction:column;gap:18px}
.wrap.wide{max-width:1000px}
h1,h2,h3{font-family:var(--f-display);font-weight:400;letter-spacing:.01em;text-wrap:balance;margin:0}
h1{font-size:clamp(30px,6.4vw,50px);line-height:1.08}
.h1s{font-size:clamp(26px,5vw,38px)}
h2{font-size:clamp(21px,3.8vw,27px);line-height:1.2}
h3{font-family:var(--f-body);font-size:12px;letter-spacing:.16em;text-transform:uppercase;color:var(--muted);font-weight:600}
p{margin:0}
.eyebrow{font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.16em;text-transform:uppercase;color:var(--accent)}
.muted{color:var(--muted)}
.note{font-size:13px;color:var(--muted)}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
button,input,select{font:inherit;color:inherit}
:focus-visible{outline:2px solid var(--accent);outline-offset:2px}

/* HUD */
.hud{display:grid;grid-template-columns:1fr auto auto;gap:8px 16px;align-items:center;background:color-mix(in srgb,var(--hull) 92%,transparent);border:1px solid var(--line);border-radius:12px;padding:10px 14px;position:sticky;top:env(safe-area-inset-top,0px);z-index:5;backdrop-filter:blur(6px)}
body::before{content:"";position:fixed;inset:0 0 auto;height:env(safe-area-inset-top,0px);z-index:10;background:var(--void)}
.hud .team{min-width:0;font-weight:600}
.hud .tn{display:block;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-family:var(--f-display);font-size:20px;font-weight:400}
.hud .tn small{display:block;font-family:var(--f-body);font-weight:400;color:var(--muted);font-size:12px}
.stat{font-variant-numeric:tabular-nums;text-align:right;line-height:1.15}
.stat b{display:block;font-size:21px;font-weight:700;font-family:var(--f-mono)}
.stat span{font-size:11px;letter-spacing:.12em;text-transform:uppercase;color:var(--muted)}
.stat.warn b{color:var(--bad)}
.stat.hi b{color:var(--hi)}
.pips{grid-column:1/-1;display:flex;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--muted);letter-spacing:.04em}
.pips span{padding:2px 9px;border:1px solid var(--line);border-radius:4px;white-space:nowrap;font-family:var(--f-mono)}
.pips span.on{color:var(--void);background:var(--accent);border-color:var(--accent);font-weight:600}
.pips span.done{color:var(--text);border-color:color-mix(in srgb,var(--accent) 55%,var(--line))}
.tools{grid-column:1/-1;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.tool{appearance:none;cursor:pointer;border:1px solid var(--line);background:var(--hull-2);color:var(--text);border-radius:8px;padding:6px 12px;font-size:14px;font-weight:600;position:relative}
.tool b{display:inline-grid;place-items:center;min-width:20px;height:20px;margin-left:4px;padding:0 5px;border-radius:10px;background:var(--accent);color:var(--void);font-size:12px}
.tool.on{border-color:var(--accent);box-shadow:0 0 12px var(--accent-glow)}
.tool.ping::after{content:"";position:absolute;top:-4px;right:-4px;width:10px;height:10px;border-radius:50%;background:var(--stamp);box-shadow:0 0 0 0 var(--stamp-glow);animation:ping 1.6s ease-out infinite}
@keyframes ping{0%{box-shadow:0 0 0 0 var(--stamp-glow)}100%{box-shadow:0 0 0 10px rgba(0,0,0,0)}}

/* Panels */
.panel{background:color-mix(in srgb,var(--hull) 94%,transparent);border:1px solid var(--line);border-radius:14px;padding:22px;display:flex;flex-direction:column;gap:16px}
.panel.hero{padding:30px 26px;gap:18px}
.panel.file{position:relative;border-top:6px solid var(--manila-2)}
.panel.file::before{content:"";position:absolute;top:-6px;left:28px;width:120px;height:14px;background:var(--manila-2);border-radius:6px 6px 0 0;transform:translateY(-8px)}
.panel.drawer{border-color:var(--accent);gap:12px}
.panel.dark{background:#050706;border-color:#2a1615;box-shadow:inset 0 0 80px rgba(0,0,0,.8)}
.title{display:flex;align-items:center;gap:16px}
.crest{flex:none;width:58px;height:66px}
.cr-shield{fill:var(--hull-2);stroke:var(--accent);stroke-width:2.5}
.cr-ghost{fill:var(--manila)}
.cr-eye{fill:var(--void)}
.story{font-size:18px;max-width:66ch}
.story em,.story b{color:var(--hi);font-style:normal}
.qhead{display:flex;justify-content:space-between;gap:12px;align-items:center;flex-wrap:wrap}
.tag{font-family:var(--f-mono);font-size:11px;font-weight:600;letter-spacing:.1em;text-transform:uppercase;padding:3px 9px;border-radius:4px;border:1px solid var(--line);color:var(--muted)}
.tag.bonus{color:var(--void);background:var(--warn);border-color:var(--warn)}
.tag.rep{color:#fff;background:var(--stamp);border-color:var(--stamp)}
.prompt{font-size:18px;max-width:66ch}
.prompt b{color:var(--hi)}
.btn{appearance:none;border:1px solid var(--accent);background:transparent;color:var(--text);padding:11px 18px;border-radius:9px;cursor:pointer;font-weight:600;letter-spacing:.01em;transition:background .15s,box-shadow .15s}
.btn:hover{box-shadow:0 0 14px var(--accent-glow)}
.btn.primary{background:var(--accent);color:#06140d}
.btn.blood{background:var(--stamp);border-color:var(--stamp);color:#fff}
.btn.blood:hover{box-shadow:0 0 16px var(--stamp-glow)}
.btn.ghost{border-color:var(--line);color:var(--muted);font-weight:500}
.btn.small{padding:6px 12px;font-size:14px}
.btn[disabled]{opacity:.45;cursor:not-allowed;box-shadow:none}
.row{display:flex;gap:10px;flex-wrap:wrap;align-items:center}
.field{display:flex;flex-direction:column;gap:6px}
.field label{font-size:13px;color:var(--muted)}
input[type=text],input[type=number],input[type=password],input[type=date],select{background:var(--void);border:1px solid var(--line);border-radius:8px;padding:11px 12px;width:100%;min-width:0}
input:focus,select:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px var(--accent-glow)}
.answer-row{display:flex;gap:10px}
.answer-row input{flex:1;letter-spacing:.06em;text-transform:uppercase;font-family:var(--f-mono)}
.feedback{font-weight:600;min-height:1.4em}
.feedback.bad{color:var(--bad)} .feedback.ok{color:var(--ok)}
.taunt{display:block;margin-top:4px;font-family:var(--f-display);font-weight:400;font-size:17px;color:#c9b98f}
.hintbox{border-left:3px solid var(--hi);padding:8px 12px;color:var(--hi);background:color-mix(in srgb,var(--hi) 8%,transparent);border-radius:0 6px 6px 0;display:flex;flex-direction:column;gap:6px}
.hintbox .replay{color:var(--text);font-size:15px}
.hintbox .replay em{color:var(--hi);font-style:normal}
.hintlab{font-family:var(--f-mono);font-size:11px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.briefbox{border-left:3px solid var(--manila-2);padding:10px 14px;background:color-mix(in srgb,var(--manila) 6%,transparent);border-radius:0 6px 6px 0;display:flex;flex-direction:column;gap:6px}
.briefbox .hintlab{color:var(--manila)}
.briefbox em{color:var(--hi);font-style:normal}
.reveal{border:1px solid var(--accent);border-radius:12px;padding:18px;display:flex;flex-direction:column;gap:14px;background:color-mix(in srgb,var(--accent) 6%,transparent)}
.reveal .lab{font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--accent)}
.reveal.missed{border-color:var(--bad);background:color-mix(in srgb,var(--bad) 7%,transparent)}
.reveal.missed .lab{color:var(--bad)}
.reveal b{color:var(--hi)}
.split{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:12px}
.split .note b{color:var(--text)}
.leftover{display:flex;flex-direction:column;gap:4px}
.leftover b{font-family:var(--f-mono);font-size:20px;letter-spacing:.12em;color:var(--hi);word-break:break-word}
.leftover .hintlab{color:var(--muted)}

/* Rubber stamps */
.stamp{display:inline-block;font-family:var(--f-display);font-size:13px;letter-spacing:.1em;text-transform:uppercase;color:var(--stamp);border:2px solid currentColor;border-radius:4px;padding:1px 8px;transform:rotate(-3deg);white-space:nowrap;line-height:1.4}
.stamp.ok{color:var(--ok)}
.stamp.bad{color:var(--bad)}
.stamp.big{font-size:22px;padding:4px 14px;transform:rotate(-8deg)}

/* Evidence (manila cards) and the noticeboard (pinned notes) */
.exhibits,.notices{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}
.exhibit,.exhibits li{position:relative;background:var(--manila);color:var(--ink);border-radius:4px 10px 6px 6px;padding:14px 16px;box-shadow:0 6px 18px rgba(0,0,0,.35);display:flex;flex-direction:column;gap:4px}
.exhibits li.mine{box-shadow:0 0 0 2px var(--accent),0 6px 18px rgba(0,0,0,.35)}
.exhibit .cn,.exhibits .cn,.notices .cn,.notice .cn{font-family:var(--f-mono);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--ink-soft)}
.exhibit .ex,.exhibits .ex{font-family:var(--f-display);font-size:18px;line-height:1.4}
.exhibit b,.exhibits b{color:#8a2018;font-weight:400}
.notices li,.notice{position:relative;background:#f4efd6;color:var(--ink);padding:16px 16px 14px;border-radius:2px;box-shadow:0 8px 18px rgba(0,0,0,.4);transform:rotate(-.6deg);display:flex;flex-direction:column;gap:4px}
.notices li:nth-child(even){transform:rotate(.7deg);background:#eef3dd}
.notices li.mine{background:#e3f2e6}
.notices p,.notice p{font-family:var(--f-display);font-size:17px;line-height:1.4}
.notices b{color:#8a2018;font-weight:400}
.notice .note{color:var(--ink-soft);font-family:var(--f-body);font-size:13px}
.pin{position:absolute;top:-6px;left:50%;width:14px;height:14px;margin-left:-7px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ff8a80,var(--stamp) 60%,#7a1a14);box-shadow:0 2px 3px rgba(0,0,0,.5)}
.ledger{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,230px),1fr));gap:4px 16px;margin-top:10px;padding:12px 14px;background:var(--manila);color:var(--ink);border-radius:6px;font-family:var(--f-mono);font-size:14px}
.ledger b{color:#8a2018!important;font-weight:700;margin-right:6px}
.exhibits li.ledgerdoc .ledger{margin:0;padding:0;background:none}
#toast{position:fixed;left:50%;bottom:20px;transform:translate(-50%,140%);background:#f4efd6;color:var(--ink);padding:10px 16px;border-radius:6px;box-shadow:0 8px 24px rgba(0,0,0,.5);font-weight:600;z-index:20;transition:transform .3s;max-width:calc(100% - 32px)}
#toast.on{transform:translate(-50%,0)}

/* Choices */
.choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,240px),1fr));gap:10px}
.choice{appearance:none;text-align:left;background:var(--hull-2);border:1px solid var(--line);border-radius:10px;padding:14px;cursor:pointer;display:flex;gap:12px;align-items:center;color:var(--text);transition:border-color .15s,transform .1s}
.choice:hover{border-color:var(--accent)}
.choice:active{transform:scale(.99)}
.choice .k{font-weight:700;color:var(--accent);flex:none;width:22px;font-family:var(--f-mono)}
.choice.wrong{border-color:var(--bad);opacity:.55}
.choice[disabled]{cursor:default}

/* Zener cards */
.zwrap{display:flex;flex-wrap:wrap;gap:18px;align-items:center}
.zgrid{display:grid;grid-template-columns:repeat(4,64px);grid-template-rows:repeat(4,64px);gap:6px;padding:10px;background:var(--hull-2);border:1px solid var(--line);border-radius:12px;position:relative}
.zgrid::before,.zgrid::after{content:"";position:absolute;background:var(--accent);opacity:.6}
.zgrid::before{left:50%;top:8px;bottom:8px;width:2px;margin-left:-1px}
.zgrid::after{top:50%;left:8px;right:8px;height:2px;margin-top:-1px}
.zc{appearance:none;display:grid;place-items:center;border:1px solid var(--line);background:#f2ecd8;border-radius:8px;cursor:pointer;padding:0;position:relative;z-index:1}
.zc.given{background:var(--manila-2);cursor:default}
.zc.given .zsym{stroke:#1d3d2c}
.zsym{width:40px;height:40px;fill:none;stroke:#8a2018;stroke-width:3;stroke-linecap:round}
.zgrid.done{grid-template-columns:repeat(4,48px);grid-template-rows:repeat(4,48px)}
.zgrid.done .zsym{width:30px;height:30px}
.zkey{display:flex;flex-direction:column;gap:6px;font-size:14px;color:var(--muted)}
.zkey span{display:flex;align-items:center;gap:8px}
.zkey .zsym{width:24px;height:24px;stroke:var(--manila)}

/* Flowchart */
.flowwrap{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,1fr);gap:18px;align-items:start}
.flow{background:var(--manila);color:var(--ink);border-radius:8px;padding:14px 16px;font-size:14px;display:flex;flex-direction:column;gap:6px}
.flow .hintlab{color:var(--ink-soft)}
.flow ul{list-style:none;margin:4px 0 0;padding:0 0 0 14px;border-left:2px solid #b9a777;display:flex;flex-direction:column;gap:6px}
.flow li{display:flex;flex-direction:column;gap:2px}
.flow .fq{font-weight:700}
.flow .yn{font-family:var(--f-mono);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:#1d6b43}
.flow .yn.no{color:#8a2018}
.flow .leaf{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.flow .stamp{color:#8a2018;font-size:12px}
.cases{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:14px}
.cases li{display:flex;flex-direction:column;gap:6px}
.doneList{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.doneList li{display:flex;gap:12px;align-items:center}

/* EMF sweep */
.emfwrap{display:grid;grid-template-columns:minmax(0,1fr) 190px;gap:18px;align-items:start}
.floor{display:grid;gap:3px;padding:8px;background:#0d1412;border:1px solid var(--line);border-radius:10px}
.floor .cell{appearance:none;aspect-ratio:1;min-width:0;border:none;border-radius:4px;background:#1e2a26;color:var(--text);cursor:pointer;position:relative;padding:3px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between;overflow:hidden}
.floor button.cell:hover{outline:2px solid var(--accent);z-index:1}
.floor .cell small{font-size:10px;line-height:1.1;color:var(--muted);text-align:left}
.floor .cell b{align-self:center;font-family:var(--f-mono);font-size:22px;color:var(--hi);margin:auto}
.floor .cell.read{background:#26443a}
.floor .cell[disabled]{cursor:default}
.floor .room-desks{background:#1f2b28}
.floor .room-manager,.floor .room-meetingroom{background:#232a35}
.floor .room-kitchen{background:#2d2a22}
.floor .room-reception{background:#2a2430}
.floor .room-toilets,.floor .room-lift,.floor .room-stairs{background:#252525}
.floor .room-cupboard{background:#2b2620}
.floor .room-corridor,.floor .room-printer,.floor .room-watercooler{background:#1c2422}
.floor .cell.read{background:#2f5546}
.floor .cell.cold{background:#cfeefa;color:#073344}
.floor .cell.cold small{color:#0a5d80}
.floor .cell.cold b{color:#0a5d80;font-size:15px;letter-spacing:.06em}
.meter{display:flex;flex-direction:column;gap:6px;align-items:center;text-align:center;padding:12px;border:1px solid var(--line);border-radius:10px;background:var(--hull-2)}
.meter svg{width:150px}
.meter .arc{fill:none;stroke:var(--accent);stroke-width:6;stroke-dasharray:4 3}
.meter .needle{stroke:var(--stamp);stroke-width:3;stroke-linecap:round;transition:all .5s}
.meter .pin{fill:var(--text)}
.meter b{font-family:var(--f-mono)}

/* Statements */
.stmwrap{display:grid;grid-template-columns:minmax(0,230px) minmax(0,1fr);gap:18px;align-items:start}
.logbox{background:var(--manila);color:var(--ink);border-radius:8px;padding:12px;display:flex;flex-direction:column;gap:6px;position:sticky;top:150px}
.logbox .hintlab{color:var(--ink-soft)}
.badgelog{border-collapse:collapse;font-family:var(--f-mono);font-size:13px;width:100%}
.badgelog th{text-align:left;font-size:10px;letter-spacing:.1em;text-transform:uppercase;color:var(--ink-soft);padding:2px 4px;border-bottom:1px solid #b9a777}
.badgelog td{padding:3px 4px;border-bottom:1px dashed #cdbd8f}
.stmts{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:12px}
.stmts li{border:1px solid var(--line);border-radius:10px;padding:12px 14px;background:var(--hull-2);display:flex;flex-direction:column;gap:8px}
.stmts .who b{display:block}
.stmts .who small{color:var(--muted)}
.stmts p{font-family:var(--f-display);font-size:17px;line-height:1.4}
.tf{display:flex;gap:8px;flex-wrap:wrap}
.tfb{appearance:none;cursor:pointer;border:1px solid var(--line);background:transparent;color:var(--muted);border-radius:6px;padding:6px 12px;font-weight:600}
.tfb.on.ok{border-color:var(--ok);color:var(--void);background:var(--ok)}
.tfb.on.bad{border-color:var(--bad);color:var(--void);background:var(--bad)}

/* Memo and punched card */
.grillewrap{display:flex;flex-wrap:wrap;gap:16px;align-items:center}
.memo{display:grid;gap:0;background:#f5f0dd;padding:10px;border-radius:4px;box-shadow:0 6px 18px rgba(0,0,0,.35);font-family:var(--f-mono);color:#3a3326;width:min(100%,456px)}
.memo .ml{aspect-ratio:1;display:grid;place-items:center;font-size:clamp(12px,2.6vw,18px);font-weight:600;opacity:.55}
.memo .ml.card{background:#c9b27a;opacity:1}
.memo .ml.hole{background:#f5f0dd;opacity:1;color:#8a2018;box-shadow:inset 0 0 0 2px #c9b27a;border-radius:50%}
.memo .ml.ct{border-top:2px solid #8f7a46}.memo .ml.cb{border-bottom:2px solid #8f7a46}.memo .ml.cl{border-left:2px solid #8f7a46}.memo .ml.cr{border-right:2px solid #8f7a46}
.mover{display:flex;flex-direction:column;align-items:center;gap:6px}

/* Nonogram */
.nonowrap{width:min(100%,460px)}
.nono{display:grid;grid-template-columns:auto repeat(8,minmax(0,1fr));gap:3px;width:100%}
.nono .cc{display:flex;flex-direction:column;justify-content:flex-end;align-items:center;font-family:var(--f-mono);font-size:13px;color:var(--hi);min-height:calc(var(--my) * 17px)}
.nono .rc{display:flex;justify-content:flex-end;align-items:center;gap:5px;padding-right:5px;font-family:var(--f-mono);font-size:13px;color:var(--hi);white-space:nowrap}
.nono i{font-style:normal;line-height:17px}
.nc{appearance:none;aspect-ratio:1;border:1px solid var(--line);background:#e9e3cd;border-radius:3px;cursor:pointer;padding:0;position:relative}
.nc.s1{background:#1e2a26;border-color:#1e2a26}
.nc.s2::before,.nc.s2::after{content:"";position:absolute;left:25%;right:25%;top:50%;height:2px;background:#9a8b66;transform:rotate(45deg)}
.nc.s2::after{transform:rotate(-45deg)}
.nonodone{display:grid;grid-template-columns:repeat(8,26px);gap:2px;padding:8px;background:#e9e3cd;border-radius:6px;width:max-content}
.nonodone span{aspect-ratio:1;background:#f6f2e2}
.nonodone span.on{background:#1e2a26}

/* Acrostic */
.deskhead{display:flex;gap:14px;align-items:center;flex-wrap:wrap}
.kw{display:flex;gap:4px}
.kw b{width:30px;height:36px;display:grid;place-items:center;border:2px dashed var(--line);border-radius:4px;font-family:var(--f-display);font-size:22px;font-weight:400}
.kw b.on{border-style:solid;border-color:var(--accent);color:var(--hi)}
.acro{margin:0;padding-left:22px;display:flex;flex-direction:column;gap:14px}
.acro li{display:flex;flex-direction:column;gap:6px}
.acro li.solved p{color:var(--muted)}
.boxes{display:flex;gap:3px;flex-wrap:wrap}
.boxes i{width:26px;height:30px;border:1px solid var(--line);border-radius:3px;display:grid;place-items:center;font-style:normal;font-family:var(--f-mono);font-weight:700;background:var(--void)}
.boxes i.first{border-color:var(--accent);background:color-mix(in srgb,var(--accent) 16%,var(--void))}
.boxes i.gap{border:none;background:none;width:10px}
.acro li.solved .boxes i{color:var(--hi)}
.acdone{display:flex;flex-direction:column;gap:2px;font-family:var(--f-mono);font-size:18px;letter-spacing:.12em}
.acdone b{color:var(--hi);font-size:22px}

/* Spirit board */
.ouija{max-width:560px}
.ouija svg{width:100%;height:auto;display:block}
.ob{fill:#3b2a1a;stroke:#1a120a;stroke-width:3}
.ob2{fill:none;stroke:#c9a86a;stroke-width:1.2;stroke-dasharray:2 4}
.ouija .bl{font-family:var(--f-display);font-size:22px;fill:#e9d6a8}
.ouija .bw{font-family:var(--f-display);font-size:17px;fill:#e9d6a8;letter-spacing:.1em}
.planch{transition:transform .85s cubic-bezier(.45,.05,.4,1)}
.planch .pl{fill:rgba(240,228,200,.82);stroke:#2b1d10;stroke-width:2}
.planch .pw{fill:rgba(255,255,255,.12);stroke:#2b1d10;stroke-width:2}
.blackout{display:grid;place-items:center;min-height:120px;border-radius:10px;background:radial-gradient(circle,#1a0c0b,#050404 70%);border:1px solid #2a1615}
.flick{font-family:var(--f-display);font-size:22px;color:#c9b98f;animation:flick 2.2s infinite}
@keyframes flick{0%,100%{opacity:.9}8%{opacity:.2}10%{opacity:.85}52%{opacity:.6}54%{opacity:.1}57%{opacity:.8}}

/* Form PA-13 */
.form{position:relative;background:#f4efe0;color:var(--ink);border-radius:4px;padding:18px 20px;box-shadow:0 8px 22px rgba(0,0,0,.4);display:flex;flex-direction:column;gap:12px;background-image:repeating-linear-gradient(transparent 0 31px,#e3dcc6 31px 32px)}
.fhead{display:flex;flex-direction:column;border-bottom:2px solid var(--ink);padding-bottom:8px;font-family:var(--f-mono);font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.fhead b{font-family:var(--f-display);font-size:26px;font-weight:400;letter-spacing:.02em;text-transform:none}
.frow{display:flex;flex-direction:column;gap:4px}
.frow label,.frow span{font-family:var(--f-mono);font-size:12px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;color:var(--ink-soft)}
.form select{background:#fffdf4;border-color:#b9a777;color:var(--ink)}
.form .note{color:var(--ink-soft)}
.form.done .frow b{font-family:var(--f-display);font-size:19px;font-weight:400;color:var(--ink)}
.form.done .stamp{position:absolute;right:18px;bottom:16px;color:var(--stamp)}
.panel.formpanel{border-color:color-mix(in srgb,var(--stamp) 45%,var(--line))}

/* Leaderboard and tables */
.board{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.board th{font-size:11px;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:var(--muted);text-align:left;padding:6px 8px;border-bottom:1px solid var(--line)}
.board td{padding:8px;border-bottom:1px solid color-mix(in srgb,var(--line) 60%,transparent)}
.board td.num{text-align:right}
.board tr.me td{color:var(--accent);font-weight:600}
.board .pill,.pill{font-size:12px;padding:2px 8px;border-radius:20px;border:1px solid var(--line);white-space:nowrap}
.board .pill.fin{border-color:var(--hi);color:var(--hi)}
.tablebox{overflow-x:auto}
.bigboard .board td{font-size:19px;padding:12px 8px}
.tag.live{color:var(--void);background:var(--ok);border-color:var(--ok)}
.winner{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 16px;padding:16px 18px;border:1px solid var(--hi);border-radius:12px;background:color-mix(in srgb,var(--hi) 8%,transparent)}
.winner b{font-family:var(--f-display);font-weight:400;font-size:clamp(24px,4.6vw,36px);color:var(--hi)}
.winner span{color:var(--muted)}
.statgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));gap:10px}
.statgrid div{border:1px solid var(--line);border-radius:10px;padding:12px;background:var(--void)}
.statgrid b{display:block;font-size:23px;color:var(--hi);font-variant-numeric:tabular-nums;font-family:var(--f-mono);word-break:break-word}
.statgrid span{font-size:12px;color:var(--muted);letter-spacing:.04em}

footer{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;align-items:center;color:var(--muted);font-size:13px}
.linkbtn{appearance:none;background:none;border:none;color:var(--muted);text-decoration:underline;cursor:pointer;padding:4px}
.linkbtn:hover{color:var(--text)}
a.btn{text-decoration:none;display:inline-block}
a.linkbtn{color:var(--muted)}

.pulse{display:inline-block;width:8px;height:8px;border-radius:50%;background:var(--accent);margin-right:6px;animation:pulse 1.4s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:.3}50%{opacity:1}}
@keyframes shake{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(6px)}60%{transform:translateX(-4px)}80%{transform:translateX(3px)}}
.shake{animation:shake .35s}
@keyframes rise{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.enter{animation:rise .35s ease-out both}
@media (prefers-reduced-motion:reduce){.enter,.shake,.pulse,.flick,.tool.ping::after{animation:none}.planch{transition:transform .2s}#toast{transition:none}}

@media (max-width:700px){
  .hud{grid-template-columns:1fr auto auto;padding:8px 10px;gap:6px 10px}
  .stat b{font-size:18px}
  .panel{padding:18px}
  .panel.hero{padding:22px 18px}
  .story,.prompt{font-size:17px}
  .flowwrap,.emfwrap,.stmwrap{grid-template-columns:1fr}
  .logbox{position:static}
  .zgrid{grid-template-columns:repeat(4,56px);grid-template-rows:repeat(4,56px)}
  .crest{width:46px;height:52px}
}
