@font-face{font-family:Def;src:url(font0.woff2)}@font-face{font-family:Body;src:url(font2.woff2)}*{box-sizing:border-box}body{margin:0;background:#070b15;color:#fff;font-family:Body,Arial,sans-serif}button,input{font:inherit}button{cursor:pointer;color:white;border:1px solid #5b6788;background:#151e32;border-radius:8px;padding:12px 18px;font-weight:800}button:hover{background:#293c64}button:disabled{opacity:.4;cursor:default}#app{height:100dvh;min-height:540px;display:flex;flex-direction:column;padding:2.2vh 3vw;background:linear-gradient(90deg,#050913d9,#05091355),url(store-night.png) center/cover}header{display:flex;align-items:center;justify-content:space-between;height:8vh}.brand{display:flex;align-items:center;gap:14px;font-weight:900;letter-spacing:2px}.brand img{width:46px;height:60px;object-fit:contain}.brand small{display:block;font-size:10px;color:#b2b9cb;letter-spacing:4px}#mode{font-size:12px;letter-spacing:2px;color:#c5cee0}.title{padding:1vh 0}.eyebrow{letter-spacing:3px;font-size:clamp(11px,1vw,18px);font-weight:900;color:#aebee0}h1{font-family:Def,Impact,sans-serif;font-size:clamp(32px,4.8vw,92px);line-height:1;margin:0 0 2vh;letter-spacing:1px}h1 span{color:#ff234c;text-shadow:3px 3px #153aff}main{flex:1;min-height:0;display:flex;flex-direction:column}.game{display:grid;grid-template-columns:minmax(0,1fr) 28%;gap:2vw;flex:1;min-height:0}#story{border:1px solid #65799e77;background:linear-gradient(130deg,#101726ef,#080d1cdb);border-radius:18px;position:relative;overflow:hidden;text-align:center;padding:2vh 3vw;display:flex;flex-direction:column;justify-content:center;box-shadow:inset 4px 0 #ff234c,inset -4px 0 #315cff}#chapter{margin:0;color:#9cb4ff}#symbol{font-size:clamp(32px,5vw,90px);margin:1vh}h2{font-family:Def,Impact,sans-serif;font-size:clamp(26px,3.1vw,60px);line-height:1.1;margin:1vh 0;overflow-wrap:anywhere}#body{font-size:clamp(17px,2vw,36px);line-height:1.35;margin:1vh 0;overflow-wrap:anywhere}#outcome{color:#b9c8e5;font-size:clamp(13px,1.3vw,24px);margin-top:2vh;font-weight:800}aside{border-radius:16px;background:#090f20eb;border:1px solid #52638a;display:flex;flex-direction:column;min-height:0;padding:1.5vw}.rosterhead{display:flex;justify-content:space-between;font-size:clamp(16px,1.6vw,30px);font-weight:900}.rosterhead b{color:#ff365d}#roster{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.7vh;overflow:hidden}.person{font-size:clamp(14px,1.35vw,26px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding:.7vh 0;border-bottom:1px solid #ffffff16}.pages{display:flex;align-items:center;justify-content:space-between;font-size:13px}.pages button{padding:2px 12px}footer{display:flex;align-items:center;justify-content:space-between;padding:2vh 0 0;gap:10px}.join{font-size:clamp(20px,2.1vw,40px);font-weight:900}footer small{display:block;color:#bdc8df;margin-top:5px}.controls{display:flex;gap:10px}.primary{background:#ee2145;border-color:#ff5270}#notice{font-size:12px;color:#e6c797;height:20px;padding-top:5px}dialog{color:white;background:#0e1729;border:1px solid #687da8;border-radius:18px;max-width:600px;width:90vw;padding:30px}dialog::backdrop{background:#000b}dialog h2{font-size:30px}dialog p{font-size:14px;color:#b8c7e2}label{display:block;margin:16px 0 8px;font-size:13px}input{display:block;width:100%;margin-top:6px;padding:10px;background:#070d19;color:white;border:1px solid #586d94;border-radius:6px}.reveal{animation:reveal .45s ease-out}@keyframes reveal{from{transform:translateY(10px);opacity:.3}to{transform:none;opacity:1}}.winner{box-shadow:inset 4px 0 #ff234c,inset -4px 0 #315cff,0 0 40px #345aff66!important}@media(max-width:750px){#mode{display:none}#app{padding:12px}.game{grid-template-columns:1fr 30%;gap:10px}header button{font-size:10px;padding:8px}.controls button{font-size:10px;padding:9px}footer small{max-width:220px;font-size:10px}.eyebrow{letter-spacing:1px}#symbol{font-size:36px}#body{font-size:18px}}
/* V2: give each story a beginning, reveal and reaction beat. */
[hidden]{display:none!important}.controls{flex-wrap:wrap;justify-content:flex-end}.controls button{padding:10px 13px}#sound{font-size:11px;color:#bacbf2;background:#101a2b}#skip{background:#263f7e;border-color:#668aff}.typing::after{content:'▌';font-weight:400;color:#729bff;animation:cursor .65s steps(1) infinite}.suspense #symbol{animation:suspensePulse .65s ease-in-out infinite alternate}.suspense::after{content:'';position:absolute;inset:0;pointer-events:none;box-shadow:inset 0 0 90px #000b;animation:tension 1.3s ease-in-out infinite}.suspense #headline{letter-spacing:3px;color:#e4ebff}.impact-out #outcome{color:#ff526e;animation:stamp .4s ease-out}.impact-out{animation:impact .3s ease-out}.impact-safe #outcome{color:#8eafff;animation:stamp .35s ease-out}.champion #headline{color:#fff;text-shadow:3px 3px #e8204b,-3px -2px #315cff;animation:champion .65s ease-out}.confetti{position:absolute;inset:0;pointer-events:none;overflow:hidden}.confetti i{position:absolute;top:-25px;left:var(--x);width:9px;height:18px;opacity:0;animation:fall 3s var(--d) ease-in forwards}@keyframes suspensePulse{from{transform:scale(.94)}to{transform:scale(1.08)}}@keyframes tension{50%{box-shadow:inset 0 0 110px #1f3fa144}}@keyframes cursor{50%{opacity:0}}@keyframes stamp{from{opacity:0;transform:scale(1.12) translateY(-8px)}to{opacity:1;transform:none}}@keyframes impact{25%{transform:translateX(-5px)}50%{transform:translateX(4px)}75%{transform:translateX(-2px)}100%{transform:none}}@keyframes champion{from{opacity:0;transform:scale(.82)}70%{transform:scale(1.04)}to{opacity:1;transform:none}}@keyframes fall{0%{opacity:1;transform:translateY(0) rotate(0)}100%{opacity:0;transform:translateY(600px) rotate(var(--r))}}@media(prefers-reduced-motion:reduce){.suspense #symbol,.suspense::after,.impact-out,.champion #headline,.confetti i,.typing::after{animation:none}.confetti{display:none}}
/* V2.1 readability: normal letterforms for everything chat needs to read. */
body,button,input{font-family:Arial,Helvetica,sans-serif}
#headline,dialog h2{font-family:Arial,Helvetica,sans-serif;font-weight:800;letter-spacing:0;line-height:1.14}
#body{font-family:Arial,Helvetica,sans-serif;font-size:clamp(20px,2vw,38px);font-weight:600;line-height:1.4;letter-spacing:.1px}
.person{font-family:Arial,Helvetica,sans-serif;font-weight:700;font-size:clamp(15px,1.4vw,27px);letter-spacing:0}
#outcome{font-weight:700;line-height:1.3;letter-spacing:0}
.eyebrow{letter-spacing:1.4px;font-weight:700}
.suspense #headline{letter-spacing:1px}
.champion #headline{text-shadow:2px 2px #315cff}
footer small{font-size:clamp(12px,.9vw,17px);line-height:1.3}
@media(max-width:750px){#body{font-size:19px;line-height:1.35}footer small{font-size:11px}}