/* Layout: one blueprint column; a home screen chooses between one-phone table play and the live online table: white linework, pale-blue notes, drafting-pencil yellow for the timer and the Best Invention. Single committed look in both app themes. */
:root{
  --paper:#1E4F8F; --grid:rgba(255,255,255,.07); --grid-major:rgba(255,255,255,.14); --card:#18447D; --deep:#123663;
  --ink:#F3F7FC; --graphite:#AFC8E6; --line:#5A82B8;
  --chip:#2B5C9A; --accent:#F5C84A; --accent-soft:#2D5F99; --on-accent:#122C4F; --blue:#F5C84A; --good:#93E6AE; --bad:#FFA392;
  --f-display:"League Spartan","Avenir Next","Helvetica Neue",Arial,sans-serif;
  --f-body:"Crimson Pro",Georgia,"Times New Roman",serif;
  --f-mono:"JetBrains Mono",ui-monospace,Menlo,Consolas,monospace;
  color-scheme:dark;
}
input::placeholder{color:var(--graphite);opacity:.8}

*{box-sizing:border-box}
html,body{min-height:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--f-body);font-size:18px;line-height:1.45;
  background-image:linear-gradient(var(--grid-major) 1px,transparent 1px),linear-gradient(90deg,var(--grid-major) 1px,transparent 1px),
    linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);
  background-size:110px 110px,110px 110px,22px 22px,22px 22px;}
.shell{max-width:620px;margin:0 auto;padding-inline:16px;padding-block:12px 40px;display:flex;flex-direction:column;gap:18px}
button{font:inherit;color:inherit;cursor:pointer}
button:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
input{font:inherit;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;width:100%;min-width:0}
h1,h2,h3{font-family:var(--f-display);text-wrap:balance;margin:0;line-height:1.05}
p{margin:0}
.label{font-family:var(--f-display);font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}

/* Top */
.top{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap}
.mark{display:flex;align-items:baseline;gap:10px;flex-wrap:wrap}
.mark h1{font-size:34px;font-weight:800;letter-spacing:-.01em;text-transform:uppercase}
.mark span{font-style:italic;color:var(--graphite);font-size:16px}
.nav{display:flex;gap:6px}
.nav button{border:1.5px solid var(--line);background:var(--card);border-radius:999px;padding:6px 14px;font-family:var(--f-display);font-weight:600;font-size:14px}
.nav button[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}

/* Generic blocks */
.panel{background:var(--card);border:1.5px solid var(--line);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:14px}
.stack{display:flex;flex-direction:column;gap:10px}
.row{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.muted{color:var(--graphite)}
.small{font-size:15px}
.btn{border:none;border-radius:12px;padding:12px 18px;font-family:var(--f-display);font-weight:700;font-size:16px;letter-spacing:.02em;background:var(--ink);color:var(--paper)}
.btn.big{width:100%;padding:16px 18px;font-size:18px}
.btn.ghost{background:transparent;color:var(--ink);border:1.5px solid var(--line)}
.btn.amber{background:var(--accent);color:var(--on-accent)}
.btn:disabled{opacity:.4;cursor:not-allowed}
.icon-btn{border:1.5px solid var(--line);background:var(--card);border-radius:10px;width:38px;height:38px;display:grid;place-items:center;font-family:var(--f-display);font-weight:700;flex:none}
.icon-btn[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}

/* Flow strip */
.flow{display:grid;grid-template-columns:repeat(6,1fr);gap:4px}
.flow div{display:flex;flex-direction:column;gap:2px;padding:8px 4px;border-top:3px solid var(--line);min-width:0}
.flow b{font-family:var(--f-display);font-size:13px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;overflow-wrap:anywhere}
.flow small{font-family:var(--f-mono);font-size:11px;color:var(--graphite)}
.flow div.on{border-top-color:var(--accent)}
.flow div.done{border-top-color:var(--ink)}
.flow div.done b,.flow div.on b{color:var(--ink)}
.flow div b{color:var(--graphite)}

/* Seats */
.seat{display:flex;align-items:center;gap:8px;padding:8px 0;border-bottom:1px dashed var(--line)}
.seat:last-child{border-bottom:none}
.seat .n{font-family:var(--f-mono);font-size:13px;color:var(--graphite);width:22px;flex:none}
.seat .nm{flex:1;min-width:0;font-weight:600;overflow-wrap:anywhere}
.seat .nm em{font-weight:400;color:var(--graphite);font-size:15px}
.chips{display:flex;flex-wrap:wrap;gap:6px}
.chip{border:1.5px dashed var(--line);background:transparent;border-radius:999px;padding:5px 12px;font-size:16px}

/* Parts */
.parts{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}
.part{background:var(--card);border:1.5px solid var(--line);border-radius:14px;padding:10px 8px;display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center;min-width:0}
.part svg{width:40px;height:40px}
.part b{font-family:var(--f-display);font-size:14px;text-transform:uppercase;letter-spacing:.06em}
.part small{font-size:13px;color:var(--graphite);line-height:1.2}
.part:disabled{opacity:.38;cursor:not-allowed}
.part .who{font-family:var(--f-display);font-size:11px;font-weight:700;color:var(--graphite);text-transform:uppercase;letter-spacing:.06em}
.partline{display:flex;align-items:center;gap:10px;padding:6px 0;border-bottom:1px dashed var(--line)}
.partline:last-child{border-bottom:none}
.partline svg{width:26px;height:26px;flex:none}
.partline .nm{flex:1;min-width:0;font-weight:600}
.partline .pt{font-family:var(--f-display);font-size:13px;text-transform:uppercase;letter-spacing:.06em;color:var(--graphite)}

/* Prompt */
.tabs{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.tab{border:1.5px solid var(--line);background:var(--card);border-radius:12px;padding:10px 6px;display:flex;flex-direction:column;align-items:center;gap:4px;font-family:var(--f-display);font-weight:700;font-size:14px;text-transform:uppercase;letter-spacing:.06em}
.tab svg{width:26px;height:26px}
.tab[aria-pressed="true"]{background:var(--ink);color:var(--paper);border-color:var(--ink)}
.plist{display:flex;flex-direction:column;max-height:340px;overflow-y:auto;border:1.5px solid var(--line);border-radius:12px;background:var(--card)}
.plist button{background:none;border:none;border-bottom:1px solid var(--line);padding:10px 14px;text-align:left;font-size:17px}
.plist button:last-child{border-bottom:none}
.plist button[aria-pressed="true"]{background:var(--accent-soft);font-weight:600}
.promptcard{border-radius:18px;padding:18px;background:var(--deep);color:var(--ink);border:2px solid var(--ink);box-shadow:inset 0 0 0 4px var(--deep),inset 0 0 0 5px var(--line);display:flex;flex-direction:column;gap:8px}
.promptcard .label{color:var(--accent)}
.promptcard h2{font-size:28px;font-weight:700;line-height:1.1}
.kq{margin:0;padding-left:20px;display:flex;flex-direction:column;gap:4px;font-size:17px}

/* Timer */
.timer{display:flex;align-items:center;gap:18px;flex-wrap:wrap;justify-content:center}
.dial{position:relative;width:170px;height:170px;flex:none}
.dial svg{width:100%;height:100%;transform:rotate(-90deg)}
.dial .face{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px}
.dial .face b{font-family:var(--f-mono);font-size:40px;font-weight:700;font-variant-numeric:tabular-nums}
.dial .face small{font-family:var(--f-display);font-size:11px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--graphite)}
.dial.done .face b{color:var(--bad)}
.tctl{display:flex;flex-direction:column;gap:8px;min-width:140px}
@keyframes flash{0%,100%{opacity:1}50%{opacity:.35}}
.dial.done .face b{animation:flash 1s ease-in-out 3}

/* Big name */
.bigname{font-family:var(--f-display);font-size:40px;font-weight:800;line-height:1;overflow-wrap:anywhere}
.handoff{text-align:center;align-items:center;padding-block:34px}

/* Inventions */
.inv{display:flex;align-items:center;gap:12px;padding:12px;border:1.5px solid var(--line);border-radius:14px;background:var(--card);text-align:left;width:100%}
.inv svg{width:30px;height:30px;flex:none}
.inv .t{flex:1;min-width:0;display:flex;flex-direction:column}
.inv .t b{font-family:var(--f-display);font-size:18px;overflow-wrap:anywhere}
.inv .t span{font-size:15px;color:var(--graphite)}
.inv.dq{opacity:.5}
.inv.dq .t b{text-decoration:line-through}
.toggle{border:1.5px solid var(--line);background:transparent;border-radius:999px;padding:5px 10px;font-family:var(--f-display);font-size:12px;font-weight:700;text-transform:uppercase;letter-spacing:.06em;flex:none}
.toggle[aria-pressed="true"]{border-color:var(--bad);color:var(--bad)}

/* Results */
.best{background:var(--accent);color:var(--on-accent);border-radius:18px;padding:18px;display:flex;flex-direction:column;gap:6px}
.best .label{color:var(--on-accent);opacity:.75}
.best h2{font-size:30px;overflow-wrap:anywhere}
.badge{display:inline-block;font-family:var(--f-display);font-weight:800;font-size:12px;letter-spacing:.1em;text-transform:uppercase;padding:3px 8px;border-radius:6px;background:var(--on-accent);color:var(--accent)}
.tablewrap{overflow-x:auto;border:1.5px solid var(--line);border-radius:14px;background:var(--card)}
table{border-collapse:collapse;width:100%;font-size:16px}
th,td{padding:9px 10px;text-align:right;white-space:nowrap;border-bottom:1px solid var(--line)}
th:first-child,td:first-child{text-align:left}
tr:last-child td{border-bottom:none}
th{font-family:var(--f-display);font-size:11px;font-weight:700;letter-spacing:.1em;text-transform:uppercase;color:var(--graphite)}
td.num{font-family:var(--f-mono);font-variant-numeric:tabular-nums;font-size:15px}
td.cq{font-family:var(--f-mono);font-weight:700;font-variant-numeric:tabular-nums}
.pt1{color:var(--good);font-weight:700}

details{border-top:1px dashed var(--line);padding-top:10px}
summary{cursor:pointer;font-family:var(--f-display);font-weight:700;font-size:14px;letter-spacing:.04em}
.tips{margin:8px 0 0;padding-left:20px;font-size:16px;display:flex;flex-direction:column;gap:4px}
.note{font-style:italic;color:var(--graphite);font-size:16px}
.err{color:var(--bad);font-size:15px}
.foot{text-align:center;font-family:var(--f-display);font-size:12px;letter-spacing:.06em;color:var(--graphite)}
.prof{display:flex;flex-direction:column;gap:8px;padding:12px 0;border-bottom:1px dashed var(--line)}
.prof:last-child{border-bottom:none}
.prof .row{justify-content:space-between}
.carry{display:grid;grid-template-columns:1fr 1fr auto;gap:8px;align-items:end}
.carry label{display:flex;flex-direction:column;gap:4px;font-size:14px;color:var(--graphite)}
.log{margin:0;padding:0;list-style:none;font-size:15px;display:flex;flex-direction:column;gap:4px}
@media (prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}
@media (max-width:420px){.bigname{font-size:32px}.promptcard h2{font-size:24px}.dial{width:150px;height:150px}.dial .face b{font-size:34px}}
/* Online additions: presence dots, turn banner, status toast, call link. */
.dot{width:10px;height:10px;border-radius:50%;flex:none;border:1.5px solid var(--graphite);background:transparent}
.dot.on{background:var(--good);border-color:var(--good)}
.you{font-family:var(--f-display);font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--on-accent);background:var(--accent);border-radius:5px;padding:2px 6px;margin-left:6px;vertical-align:2px}
.turn{display:flex;align-items:center;gap:10px;padding:12px 14px;border:1.5px dashed var(--line);border-radius:14px;color:var(--graphite);font-size:17px}
.turn.mine{border:2px solid var(--accent);color:var(--ink);background:var(--deep)}
.turn .pulse{width:10px;height:10px;border-radius:50%;background:var(--accent);flex:none;animation:pulse 1.6s ease-in-out infinite}
@keyframes pulse{0%,100%{opacity:1}50%{opacity:.25}}
.toast{position:fixed;left:50%;transform:translateX(-50%);bottom:calc(14px + env(safe-area-inset-bottom,0px));max-width:min(560px,calc(100% - 32px));background:var(--deep);border:1.5px solid var(--bad);color:var(--ink);border-radius:12px;padding:10px 14px;font-size:16px;display:flex;gap:10px;align-items:center;z-index:5}
.toast button{background:none;border:none;color:var(--graphite);font-family:var(--f-display);font-weight:700}
.calllink{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 14px;border-radius:14px;background:var(--deep);border:1.5px solid var(--line);text-decoration:none;color:var(--ink)}
.calllink b{font-family:var(--f-display);font-size:15px;letter-spacing:.04em}
.calllink span{font-size:14px;color:var(--graphite);overflow-wrap:anywhere;min-width:0}
textarea{font:inherit;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:10px 12px;width:100%;min-width:0;resize:vertical;min-height:84px;font-size:17px}
textarea::placeholder{color:var(--graphite);opacity:.8}
textarea:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.mypart{display:flex;align-items:center;gap:12px}
.mypart svg{width:48px;height:48px;flex:none}
.mypart b{font-family:var(--f-display);font-size:24px;text-transform:uppercase;letter-spacing:.04em}
.pitchtext{white-space:pre-wrap;font-size:18px;border-left:3px solid var(--accent);padding-left:12px}
.inv.mine{border-color:var(--accent);border-width:2px;background:var(--deep)}
.statuschips{display:flex;flex-wrap:wrap;gap:6px}
.sc{font-family:var(--f-display);font-size:13px;font-weight:600;padding:4px 10px;border-radius:999px;border:1.5px solid var(--line);color:var(--graphite)}
.sc.in{border-color:var(--good);color:var(--good)}
.center{text-align:center;align-items:center}
/* Home and Profiles additions */
.modes{display:grid;grid-template-columns:1fr;gap:12px}
.mode{display:flex;flex-direction:column;gap:10px;text-align:left;background:var(--card);border:1.5px solid var(--line);border-radius:18px;padding:18px;color:var(--ink);width:100%}
.mode:hover{border-color:var(--ink)}
.mode .head{display:flex;align-items:center;gap:12px}
.mode .head svg{width:40px;height:40px;flex:none;color:var(--accent)}
.mode h2{font-size:26px}
.mode p{font-size:17px;color:var(--graphite)}
.mode .status{font-family:var(--f-display);font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--ink)}
.mode .status.hot{color:var(--accent)}
.mode .go{align-self:flex-start;margin-top:2px}
.hero{display:flex;flex-direction:column;gap:6px;padding-block:6px}
.hero p{font-size:19px;max-width:34em}
select{font:inherit;font-size:16px;color:var(--ink);background:var(--card);border:1.5px solid var(--line);border-radius:10px;padding:8px 10px;max-width:100%}
select:focus-visible{outline:3px solid var(--blue);outline-offset:2px}
.split{font-size:14px;color:var(--graphite)}
.linkrow{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:15px;color:var(--graphite)}
.modebar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
/* ===== Screenplay skin: Courier on white paper, black ink, one revision-yellow page for the Best Remake ===== */
:root{
  --desk:#E7E3D8; --deep:#F3EFE4; --grid:transparent; --grid-major:transparent; --paper:#FFFEFA; --card:#FFFEFA; --ink:#141414; --graphite:#5E5B55; --line:#CFCAC0; --chip:#EFEBE2;
  --accent:#141414; --accent-soft:#F6EBB8; --on-accent:#FFFEFA; --rev:#F4E08A; --on-rev:#141414; --blue:#2C5A86; --good:#1F6B3F; --bad:#A3271C;
  --f-display:"Courier Prime","Courier New",Courier,monospace; --f-body:"Courier Prime","Courier New",Courier,monospace; --f-mono:"Courier Prime","Courier New",Courier,monospace; color-scheme:light;
}
@media (prefers-color-scheme:dark){:root:not([data-theme="light"]){
  --desk:#0E0E0D; --deep:#24221E; --grid:transparent; --grid-major:transparent; --paper:#1B1A18; --card:#1B1A18; --ink:#ECE7DA; --graphite:#A39E92; --line:#3A3833; --chip:#272521;
  --accent:#ECE7DA; --accent-soft:#3A3420; --on-accent:#1B1A18; --rev:#5A4E1E; --on-rev:#F4ECD0; --blue:#86AEDA; --good:#7CC69A; --bad:#E58A79; color-scheme:dark}}
:root[data-theme="dark"]{
  --desk:#0E0E0D; --deep:#24221E; --grid:transparent; --grid-major:transparent; --paper:#1B1A18; --card:#1B1A18; --ink:#ECE7DA; --graphite:#A39E92; --line:#3A3833; --chip:#272521;
  --accent:#ECE7DA; --accent-soft:#3A3420; --on-accent:#1B1A18; --rev:#5A4E1E; --on-rev:#F4ECD0; --blue:#86AEDA; --good:#7CC69A; --bad:#E58A79; color-scheme:dark}
body{background:var(--desk);background-image:none;font-size:16px;line-height:1.4}
.shell{position:relative;background:var(--paper);max-width:620px;margin:10px auto 24px;padding:26px 16px 36px 30px;box-shadow:0 1px 2px rgba(0,0,0,.12),0 6px 24px rgba(0,0,0,.08);border-radius:2px;gap:20px}
.shell::before{content:"";position:absolute;left:9px;top:0;bottom:0;width:10px;pointer-events:none;
  background:radial-gradient(circle,var(--desk) 3.2px,transparent 3.8px) 0 90px/10px 10px no-repeat,
             radial-gradient(circle,var(--desk) 3.2px,transparent 3.8px) 0 50%/10px 10px no-repeat,
             radial-gradient(circle,var(--desk) 3.2px,transparent 3.8px) 0 calc(100% - 90px)/10px 10px no-repeat}
@media (max-width:420px){.shell{margin:0;border-radius:0;box-shadow:none;padding:20px 12px 32px 24px}.shell::before{left:6px}}
h1,h2,h3{font-weight:700;text-transform:uppercase;letter-spacing:0;line-height:1.15}
h2{font-size:21px!important}
.label{font-size:12.5px;letter-spacing:.04em;font-weight:700}
.mark{flex-direction:column;align-items:flex-start;gap:2px}
.mark h1{font-size:30px;letter-spacing:.02em;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
.mark span{font-style:normal;font-size:13px}
.nav button,.chip,.tab,.icon-btn,.toggle,.btn,.inv,.part,.panel,.plist,.tablewrap,input,.promptcard,.best{border-radius:3px}
.nav button{font-weight:700;font-size:13px;text-transform:uppercase;border-width:1px}
.panel{border-width:1px;background:var(--paper)}
.btn{font-weight:700;text-transform:uppercase;letter-spacing:.02em;font-size:15px}
.btn.amber{background:var(--ink);color:var(--paper)}
.btn.ghost{border-width:1px}
.btn.big{font-size:16px}
.btn.amber.big::before{content:"";}
.promptcard{background:transparent;color:var(--ink);border:2px solid var(--ink);padding:14px 16px}
.promptcard .label{color:var(--graphite)}
.promptcard h2{font-size:22px!important}
.flow div{border-top-width:2px}
.flow b{font-size:11px;letter-spacing:0}
.flow small{font-size:10.5px}
.flow div.on{border-top-color:var(--ink);border-top-style:double;border-top-width:4px}
.part{border-width:1px;background:var(--paper)}
.part b{font-size:12px;letter-spacing:0;font-weight:700}
.part small{font-size:11.5px;line-height:1.25}
.part:not(:disabled):hover{background:var(--chip)}
.partline .pt,.tab,.toggle{letter-spacing:0}
.tab{font-weight:700;border-width:1px}
.plist{border-width:1px}
.plist button{font-size:15px}
.plist button[aria-pressed="true"]{background:var(--rev);color:var(--on-rev)}
.bigname{font-size:30px;font-weight:700;text-transform:uppercase;letter-spacing:.02em}
.dial .face b{font-size:36px}
.dial.done .face b{color:var(--bad)}
.inv{border-width:1px;background:var(--paper)}
.inv .t b{font-size:16px;text-transform:uppercase}
.inv .t span{font-size:13.5px}
.best{background:var(--rev);color:var(--on-rev);border:1px solid rgba(0,0,0,.15)}
.best .label{color:var(--on-rev)}
.best h2{font-size:24px!important}
.badge{background:var(--on-rev);color:var(--rev);border-radius:2px;letter-spacing:.04em}
.tablewrap{border-width:1px}
table{font-size:14px}
th{font-size:11px;letter-spacing:.02em}
td.num,td.cq{font-size:14px}
.kq,.tips{font-size:15px}
.note{font-style:italic;font-size:14px}
.small{font-size:14px}
.foot{font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.trans{display:block;text-align:right;font-weight:700;text-transform:uppercase}

.promptcard{box-shadow:none}
.mode{border-radius:3px;border-width:1px;background:var(--paper)}
.mode h2{font-size:22px}
.mode .head svg{color:var(--ink)}
.mode .status.hot{color:var(--bad)}
.turn{border-radius:3px;border-width:1px;font-size:15px}
.turn.mine{border-width:2px;border-color:var(--ink);background:var(--deep)}
.turn .pulse{background:var(--bad)}
.toast,.calllink,textarea,select{border-radius:3px}
.calllink b{font-size:14px}
.pitchtext{font-size:16px;border-left-color:var(--ink)}
.inv.mine{border-color:var(--ink);background:var(--deep)}
.sc{border-radius:3px;font-size:12.5px}
.you{background:var(--ink);color:var(--paper);border-radius:2px;letter-spacing:.02em}
.mypart b{font-size:20px}
.hero p{font-size:16px}
.mode p{font-size:15px}
.bigname{font-size:26px}
.flow b{font-size:10px;overflow-wrap:normal;word-break:keep-all}
.flow{gap:3px}

/* ===== Editions ===== */
.beta{display:inline-block;margin-left:6px;padding:0 6px;border:1.5px solid currentColor;border-radius:2px;font-weight:700;font-size:10px;letter-spacing:.1em;vertical-align:2px;font-style:normal}
.edcard.here{border-color:var(--ink)}
a.btn{display:inline-block;text-align:center;text-decoration:none}

/* ===== Bible Edition: the screenplay on a torn papyrus fragment, sepia ink, gold rubrics, inscriptional caps; olive = Historical, lapis = Remix ===== */
:root[data-edition="bible"]{
  --desk:#2B2017; --paper:#E9D7AE; --paper-edge:#C9A96A; --fiber:rgba(120,84,36,.07); --card:rgba(255,246,218,.45); --deep:transparent;
  --ink:#2A1C0E; --graphite:#6B5536; --line:rgba(107,78,38,.32); --chip:rgba(255,246,218,.55);
  --rubric:#83600E; --gold:#9A6B12; --gold-soft:#F1DC9C; --gold-fill:#D3A23A; --on-gold:#2A1C0E; --ochre:#56662A; --lapis:#25508C;
  --accent:var(--rubric); --on-accent:#FBF1D6; --accent-soft:rgba(211,162,58,.18); --rev:var(--gold-soft); --on-rev:#2A1C0E;
  --f-display:"Cinzel","Trajan Pro",Georgia,serif;
}
@media (prefers-color-scheme:dark){:root[data-edition="bible"]:not([data-theme="light"]){
  --desk:#120D08; --paper:#3A2C1B; --paper-edge:#22190F; --fiber:rgba(240,210,150,.04); --card:rgba(0,0,0,.18);
  --ink:#EEDDB8; --graphite:#BDA57C; --line:rgba(238,221,184,.22); --chip:rgba(0,0,0,.22);
  --rubric:#E8C066; --gold:#E3B95A; --gold-soft:#5A4419; --gold-fill:#D9AE48; --on-gold:#22190F; --ochre:#B6C77E; --lapis:#93B6EC;
  --on-accent:#22190F; --accent-soft:rgba(217,174,72,.16); --on-rev:#F8EBCB; color-scheme:dark}}
[data-edition="bible"] body{background:var(--desk)}
[data-edition="bible"] .shell{margin:28px auto 40px;border-radius:0;box-shadow:none;
  clip-path:polygon(0.0% 4px,4.5% 6px,9.1% 14px,13.6% 0px,18.2% 3px,22.7% 3px,27.3% 4px,31.8% 0px,36.4% 9px,40.9% 0px,45.5% 3px,50.0% 14px,54.5% 14px,59.1% 3px,63.6% 9px,68.2% 3px,72.7% 14px,77.3% 0px,81.8% 3px,86.4% 9px,90.9% 0px,95.5% 14px,100.0% 0px,calc(100% - 2px) 6.2%,calc(100% - 0px) 12.5%,calc(100% - 3px) 18.8%,calc(100% - 1px) 25.0%,calc(100% - 2px) 31.2%,calc(100% - 4px) 37.5%,calc(100% - 7px) 43.8%,calc(100% - 2px) 50.0%,calc(100% - 3px) 56.2%,calc(100% - 0px) 62.5%,calc(100% - 3px) 68.8%,calc(100% - 4px) 75.0%,calc(100% - 3px) 81.2%,calc(100% - 1px) 87.5%,calc(100% - 9px) 93.8%,100.0% calc(100% - 8px),95.5% calc(100% - 4px),90.9% calc(100% - 13px),86.4% calc(100% - 6px),81.8% calc(100% - 4px),77.3% calc(100% - 4px),72.7% calc(100% - 0px),68.2% calc(100% - 13px),63.6% calc(100% - 22px),59.1% calc(100% - 10px),54.5% calc(100% - 6px),50.0% calc(100% - 22px),45.5% calc(100% - 22px),40.9% calc(100% - 6px),36.4% calc(100% - 18px),31.8% calc(100% - 28px),27.3% calc(100% - 28px),22.7% calc(100% - 30px),18.2% calc(100% - 22px),13.6% calc(100% - 6px),9.1% calc(100% - 22px),4.5% calc(100% - 18px),0.0% calc(100% - 4px),0px 93.8%,2px 87.5%,8px 81.2%,3px 75.0%,1px 68.8%,5px 62.5%,3px 56.2%,8px 50.0%,8px 43.8%,0px 37.5%,10px 31.2%,0px 25.0%,1px 18.8%,2px 12.5%,2px 6.2%);
  background:radial-gradient(ellipse at 50% 45%,transparent 50%,var(--paper-edge) 125%),repeating-linear-gradient(90deg,var(--fiber) 0 2px,transparent 2px 7px),repeating-linear-gradient(0deg,var(--fiber) 0 1px,transparent 1px 5px),var(--paper);
  padding:36px max(26px,env(safe-area-inset-right,0px)) 52px max(26px,env(safe-area-inset-left,0px))}
[data-edition="bible"] .shell::before,[data-edition="bible"] .shell::after{content:none;display:none}
@media (max-width:420px){[data-edition="bible"] .shell{margin:16px 8px 28px;padding:32px 18px 48px}}
[data-edition="bible"] h1,[data-edition="bible"] h2,[data-edition="bible"] h3{font-family:var(--f-display);letter-spacing:.04em}
[data-edition="bible"] .mark h1{font-family:var(--f-display);font-weight:700;color:var(--rubric);text-decoration:none;font-size:32px;letter-spacing:.08em}
[data-edition="bible"] .mark h1::after{content:"";display:block;height:2px;margin-top:4px;background:linear-gradient(90deg,var(--rubric),transparent)}
[data-edition="bible"] .mark span{color:var(--ink);font-family:var(--f-display);font-size:13px;letter-spacing:.14em;text-transform:uppercase;font-style:normal}
[data-edition="bible"] .beta{color:var(--gold);border-color:var(--gold)}
[data-edition="bible"] .label{color:var(--rubric);font-family:var(--f-display);letter-spacing:.1em}
[data-edition="bible"] :is(.panel,.inv,.part,.plist,.tablewrap,input,textarea,select,.nav button,.tab,.chip,.icon-btn,.toggle,.btn.ghost,.mode,.hero){background:var(--card)}
[data-edition="bible"] :is(.nav button,.tab)[aria-pressed="true"]{background:var(--gold-fill);border-color:var(--gold-fill);color:var(--on-gold)}
[data-edition="bible"] .btn{background:var(--ink);color:var(--paper)}
[data-edition="bible"] .btn.amber{background:var(--gold-fill);color:var(--on-gold);font-family:var(--f-display);letter-spacing:.08em}
[data-edition="bible"] .btn.ghost{color:var(--ink)}
[data-edition="bible"] .flow div.on{border-top-color:var(--rubric)}
[data-edition="bible"] .flow div.on b{color:var(--rubric)}
[data-edition="bible"] .promptcard{border:none;border-top:2px solid var(--rubric);border-bottom:2px solid var(--rubric);border-radius:0;background:transparent;box-shadow:none;text-align:center;align-items:center;padding:14px 8px}
[data-edition="bible"] .promptcard .label{color:var(--rubric)}
[data-edition="bible"] .promptcard h2{letter-spacing:.05em}
[data-edition="bible"] .best{background:var(--gold-soft);border:2px solid var(--gold);color:var(--on-rev);border-radius:2px}
[data-edition="bible"] .best .label{color:var(--on-rev)}
[data-edition="bible"] .badge{background:var(--gold);color:var(--on-accent)}
[data-edition="bible"] .dial.done .face b{color:var(--rubric)}
[data-edition="bible"] .edcard.here{border-color:var(--rubric)}
.ang.historical,.aw.historical{color:var(--ochre,#56662A)}
.ang.remix,.aw.remix{color:var(--lapis,#25508C)}

/* ===== Horror Edition: the same screenplay, read by flashlight — near-black page, bone ink, one blood-red accent ===== */
:root[data-edition="horror"],:root[data-edition="horror"][data-theme]{
  --desk:#050404; --deep:#1A1312; --paper:#120E0D; --card:#181211; --ink:#EDE4D8; --graphite:#A3968A; --line:#3B2E2B; --chip:#241A18;
  --accent:#C0161F; --accent-soft:rgba(192,22,31,.18); --on-accent:#FFF4EE; --rev:#4A0D11; --on-rev:#F7E7E2; --blue:#E0636A; --good:#8FCF9F; --bad:#FF7A70;
  color-scheme:dark}
@media (prefers-color-scheme:dark){:root[data-edition="horror"]:not([data-theme="light"]){
  --desk:#050404; --deep:#1A1312; --paper:#120E0D; --card:#181211; --ink:#EDE4D8; --graphite:#A3968A; --line:#3B2E2B; --chip:#241A18;
  --accent:#C0161F; --accent-soft:rgba(192,22,31,.18); --on-accent:#FFF4EE; --rev:#4A0D11; --on-rev:#F7E7E2; --blue:#E0636A; --good:#8FCF9F; --bad:#FF7A70}}
[data-edition="horror"] .shell{box-shadow:0 0 0 1px #2a1d1b,0 10px 40px rgba(0,0,0,.6)}
[data-edition="horror"] .mark h1{font-family:"Creepster","Courier Prime",cursive;font-weight:400;letter-spacing:.06em;color:var(--accent);text-decoration:none;font-size:40px}
[data-edition="horror"] .mark span{color:var(--ink)}
[data-edition="horror"] .beta{color:var(--accent)}
[data-edition="horror"] .label{color:#D9474F}
[data-edition="horror"] .btn.amber{background:var(--accent);color:var(--on-accent)}
[data-edition="horror"] :is(.nav button,.tab)[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
[data-edition="horror"] .flow div.on{border-top-color:var(--accent)}
[data-edition="horror"] .promptcard{border-color:var(--accent);box-shadow:inset 0 0 0 4px var(--deep),inset 0 0 0 5px #5a1a1d}
[data-edition="horror"] .best{background:var(--rev);border:1px solid var(--accent);color:var(--on-rev)}
[data-edition="horror"] .best .label,[data-edition="horror"] .best h2{color:var(--on-rev)}
[data-edition="horror"] .badge{background:var(--accent);color:var(--on-accent)}
[data-edition="horror"] .edcard.here{border-color:var(--accent)}
[data-edition="horror"] .inv svg,[data-edition="horror"] .partline svg,[data-edition="horror"] .mypart svg{color:#E0474F}

/* ===== Spinoff: The Game of TV — a TV Guide page: newsprint, condensed type, the red logo box, listings with times and channels ===== */
:root[data-edition="spinoff"]{
  --desk:#E4DFD3; --deep:#FFFFFF; --paper:#F7F4EC; --card:#FFFFFF; --ink:#141313; --graphite:#5B5852; --line:#D6D0C3; --chip:#EEEAE0;
  --accent:#D62B2B; --on-accent:#FFFFFF; --accent-soft:#FBE3E1; --rev:#D62B2B; --on-rev:#FFFFFF; --blue:#1F4E8C; --good:#1F6B3F; --bad:#B3261E;
  --f-display:"Archivo Black","Arial Black","Helvetica Neue",Arial,sans-serif; --f-body:"Archivo Narrow","Arial Narrow","Helvetica Neue",Arial,sans-serif; --f-mono:"Archivo Narrow","Arial Narrow",Arial,sans-serif;
  color-scheme:light}
@media (prefers-color-scheme:dark){:root[data-edition="spinoff"]:not([data-theme="light"]){
  --desk:#0C0C0D; --deep:#1E1D1F; --paper:#161517; --card:#1E1D1F; --ink:#F1EDE5; --graphite:#A9A49B; --line:#38363A; --chip:#262529;
  --accent:#FF4B45; --on-accent:#140A0A; --accent-soft:#3A1A19; --rev:#C8312C; --on-rev:#FFFFFF; --blue:#8AB4F0; --bad:#FF8A80; color-scheme:dark}}
[data-edition="spinoff"] body{font-size:17px;line-height:1.35}
[data-edition="spinoff"] .shell::before{content:none}
[data-edition="spinoff"] .shell{padding-left:20px;border-top:6px solid var(--accent)}
[data-edition="spinoff"] .mark{flex-direction:row;align-items:center;gap:10px}
[data-edition="spinoff"] .mark h1{display:inline-block;background:#D62B2B;color:#fff;font-family:var(--f-display);font-weight:400;font-size:30px;letter-spacing:-.01em;text-decoration:none;text-transform:uppercase;padding:4px 12px 2px;border-radius:7px;line-height:1.1;box-shadow:inset 0 0 0 2px #fff,0 0 0 1.5px #D62B2B}
[data-edition="spinoff"] .mark span{font-family:var(--f-body);font-weight:700;font-style:italic;font-size:16px;color:var(--ink);text-transform:none;letter-spacing:0}
[data-edition="spinoff"] h1,[data-edition="spinoff"] h2,[data-edition="spinoff"] h3{font-weight:400;letter-spacing:-.005em}
[data-edition="spinoff"] .label{font-family:var(--f-body);font-weight:700;letter-spacing:.06em;color:var(--accent)}
[data-edition="spinoff"] .btn{font-family:var(--f-display);font-weight:400;letter-spacing:.02em;border-radius:4px}
[data-edition="spinoff"] .btn.amber{background:var(--accent);color:var(--on-accent)}
[data-edition="spinoff"] :is(.nav button,.tab)[aria-pressed="true"]{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
[data-edition="spinoff"] .nav button,[data-edition="spinoff"] .tab{font-family:var(--f-display);font-weight:400}
[data-edition="spinoff"] .flow div.on{border-top-color:var(--accent)}
[data-edition="spinoff"] .flow b{font-family:var(--f-body);font-weight:700}
[data-edition="spinoff"] .promptcard{background:var(--card);border:none;border-left:6px solid var(--ink);border-radius:2px;box-shadow:0 1px 0 var(--line),0 -1px 0 var(--line)}
[data-edition="spinoff"] .promptcard .label{color:var(--ink);font-size:13px}
[data-edition="spinoff"] .promptcard h2 i{font-style:normal}
[data-edition="spinoff"] .promptcard p{color:var(--graphite)}
[data-edition="spinoff"] .plist button{font-family:var(--f-body);font-size:17px}
[data-edition="spinoff"] .plist button i{font-style:normal;font-weight:700}
[data-edition="spinoff"] .inv .t b{font-family:var(--f-display);font-weight:400}
[data-edition="spinoff"] .inv svg,[data-edition="spinoff"] .partline svg{color:var(--accent)}
[data-edition="spinoff"] .best{background:var(--rev);color:var(--on-rev);border:none;border-radius:4px}
[data-edition="spinoff"] .best .label,[data-edition="spinoff"] .best h2{color:var(--on-rev)}
[data-edition="spinoff"] .best .label::before{content:"COVER STORY · "}
[data-edition="spinoff"] .badge{background:var(--ink);color:var(--paper)}
[data-edition="spinoff"] .dial .face b{font-family:var(--f-display);font-weight:400}
[data-edition="spinoff"] .edcard.here{border-color:var(--accent)}

/* ===== Editions page: one neutral page from every edition; each card wears its own edition's look ===== */
.edcard{--paper:#FFFEFA;--ink:#141414;--graphite:#5E5B55;--line:#CFCAC0;--accent:#141414;--on-accent:#FFFEFA;--card:transparent;
  position:relative;background:var(--paper);color:var(--ink);border:1px solid var(--line);border-radius:4px;padding:18px;display:flex;flex-direction:column;gap:12px;
  font-family:"Courier Prime","Courier New",monospace;box-shadow:0 2px 10px rgba(0,0,0,.12);color-scheme:light}
.edcard.here{outline:3px solid var(--accent);outline-offset:3px}
.edhead{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.edlogo{display:flex;flex-direction:column;gap:3px}
.edlogo b{font-size:28px;line-height:1.05;text-transform:uppercase}
.edlogo span{font-size:13px}
.edlogo .beta{font-style:normal;vertical-align:1px}
.edtag{font-size:11px;font-weight:700;letter-spacing:.08em;text-transform:uppercase;border:1px solid currentColor;padding:3px 7px;border-radius:2px;color:var(--graphite)}
.edblurb{margin:0;font-size:15px;line-height:1.4}
.edlink{margin:0;font-size:12px;color:var(--graphite);overflow-wrap:anywhere}
.edcard .btn{align-self:flex-start;border-radius:3px}
.edcard .btn.amber{background:var(--accent);color:var(--on-accent)}
.edcard .btn.ghost{background:transparent;color:var(--ink);border:1px solid var(--ink)}
/* Standard: screenplay page */
.ed-standard .edlogo b{font-family:"Courier Prime",monospace;font-weight:700;text-decoration:underline;text-underline-offset:5px;text-decoration-thickness:2px}
.ed-standard .edlogo span{font-style:italic}
/* Bible: papyrus fragment, gold rubrics */
.ed-bible{--paper:#E9D7AE;--ink:#2A1C0E;--graphite:#6B5536;--line:rgba(107,78,38,.4);--accent:#D3A23A;--on-accent:#2A1C0E;
  background:radial-gradient(ellipse at 50% 45%,transparent 55%,#C9A96A 130%),repeating-linear-gradient(90deg,rgba(120,84,36,.07) 0 2px,transparent 2px 7px),repeating-linear-gradient(0deg,rgba(120,84,36,.07) 0 1px,transparent 1px 5px),#E9D7AE;
  border:none;border-radius:0;clip-path:polygon(0 3px,8% 0,17% 5px,26% 1px,38% 6px,49% 0,61% 4px,72% 0,84% 5px,93% 1px,100% 4px,99.4% 30%,100% 62%,99.2% 100%,88% calc(100% - 4px),74% 100%,61% calc(100% - 6px),47% 100%,33% calc(100% - 3px),19% 100%,7% calc(100% - 5px),0 100%,.7% 64%,0 31%)}
.ed-bible .edlogo b{font-family:"Cinzel",Georgia,serif;color:#83600E;letter-spacing:.08em}
.ed-bible .edlogo span{font-family:"Cinzel",Georgia,serif;letter-spacing:.14em;text-transform:uppercase;font-size:12px}
.ed-bible .edtag{color:#83600E}
.ed-bible .btn{font-family:"Cinzel",Georgia,serif;letter-spacing:.06em}
/* Horror: black page, blood red */
.ed-horror{--paper:#120E0D;--ink:#EDE4D8;--graphite:#A3968A;--line:#3B2E2B;--accent:#C0161F;--on-accent:#FFF4EE;color-scheme:dark;box-shadow:0 0 0 1px #2a1d1b,0 6px 24px rgba(0,0,0,.45)}
.ed-horror .edlogo b{font-family:"Creepster","Courier Prime",cursive;font-weight:400;font-size:34px;letter-spacing:.06em;color:#C0161F}
.ed-horror .edtag{color:#D9474F}
/* Spinoff: TV Guide newsprint */
.ed-spinoff{--paper:#F7F4EC;--ink:#141313;--graphite:#5B5852;--line:#D6D0C3;--accent:#D62B2B;--on-accent:#FFFFFF;font-family:"Archivo Narrow","Arial Narrow",Arial,sans-serif;border-top:6px solid #D62B2B}
.ed-spinoff .edlogo{flex-direction:row;align-items:center;gap:10px;flex-wrap:wrap}
.ed-spinoff .edlogo b{font-family:"Archivo Black","Arial Black",sans-serif;font-weight:400;background:#D62B2B;color:#fff;padding:3px 11px 1px;border-radius:7px;font-size:26px;box-shadow:inset 0 0 0 2px #fff,0 0 0 1.5px #D62B2B}
.ed-spinoff .edlogo span{font-weight:700;font-style:italic;font-size:15px}
.ed-spinoff .edblurb{font-size:16px}
.ed-spinoff .btn{font-family:"Archivo Black","Arial Black",sans-serif;font-weight:400}
.ed-spinoff .edtag{color:#D62B2B}

/* Share buttons on the results screen */
.best .share-big{align-self:flex-start;margin-top:6px;background:transparent;color:inherit;border:1.5px solid currentColor}
.inv .toggle[data-act="share"]{margin-left:6px}

/* Tip link */
.popcorn{display:flex;gap:10px;align-items:center;justify-content:center;text-decoration:none;color:var(--ink);border:1.5px dashed var(--line);border-radius:6px;padding:10px 12px;font-size:15px;background:var(--card)}
.popcorn span:first-child{font-size:22px}
.popcorn:hover{border-color:var(--ink)}
/* Nudge button (Anytime rounds) */
.btn.nudge{white-space:normal;text-align:left;line-height:1.2}
/* Poster sketch pad (online games) */
.posterbox{display:flex;flex-direction:column;gap:8px;margin-top:4px}
img.poster{display:block;width:min(100%,240px);aspect-ratio:3/4;object-fit:cover;background:#fff;border:1px solid var(--line);box-shadow:0 4px 14px rgba(0,0,0,.18)}
img.poster.thumb{width:96px}
.best img.poster{margin:6px 0}
.sketch{position:fixed;inset:0;z-index:50;background:rgba(0,0,0,.6);display:grid;place-items:center;padding:12px}
.sk-card{background:var(--paper);color:var(--ink);border:1.5px solid var(--line);border-radius:12px;padding:14px;display:flex;flex-direction:column;gap:10px;width:min(100%,440px);max-height:100%;overflow:auto}
.sk-card canvas{width:100%;max-height:62vh;aspect-ratio:3/4;object-fit:contain;background:#fff;border:1px solid var(--line);border-radius:4px;touch-action:none;cursor:crosshair;align-self:center}
.sk-tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center}
.sk-sw{width:30px;height:30px;border-radius:50%;border:2px solid var(--line);padding:0}
.sk-sw.on{outline:3px solid var(--accent);outline-offset:2px}
.sk-tool{border:1.5px solid var(--line);background:var(--card);color:var(--ink);border-radius:999px;padding:5px 12px;font-size:14px}
.sk-tool.on{background:var(--accent);color:var(--on-accent);border-color:var(--accent)}
