@import url('https://fonts.googleapis.com/css2?family=Newsreader:ital,opsz,wght@0,6..72,400;0,6..72,600;0,6..72,700;0,6..72,800;1,6..72,400;1,6..72,600&family=Libre+Franklin:wght@500;600;700;800&family=UnifrakturMaguntia&display=swap');
:root{
  --paper:#F4F1EA; --paper2:#E6E1D5; --ink:#121212; --grey:#6E685D; --hair:#BDB6A8; --red:#B3221B;
  --yellow:#E6E1D5; --blue:#6E685D; --green:#121212;
  --serif:'Newsreader',Georgia,'Times New Roman',serif; --display:var(--serif);
  --mono:'Libre Franklin','Franklin Gothic Medium','Helvetica Neue',Arial,sans-serif; --black:'UnifrakturMaguntia','Old English Text MT',serif;
}
*{box-sizing:border-box;margin:0;padding:0}
html,body{height:100%}
body{background:var(--paper);color:var(--ink);font-family:var(--serif);-webkit-font-smoothing:antialiased;overflow-x:hidden}
button{font:inherit;color:inherit;cursor:pointer;border:0;background:none}
.mono{font-family:var(--mono);font-weight:700;text-transform:uppercase;letter-spacing:.12em}
.display{font-family:var(--serif);font-weight:800;letter-spacing:-.025em;line-height:.98}
.hl{border-bottom:2px solid var(--ink);padding:0 .1em}
.rule{border:0;border-top:1px solid var(--ink);border-bottom:3px solid var(--ink);height:5px}
.stamp{display:inline-block;font-family:var(--mono);font-weight:800;text-transform:uppercase;letter-spacing:.14em;border:4px double currentColor;padding:.2em .6em;line-height:1.1}
.stamp.red{color:var(--red)} .stamp.green{color:var(--ink)} .stamp.blue{color:var(--grey)}
.btn{font-family:var(--mono);font-weight:700;text-transform:uppercase;letter-spacing:.12em;font-size:1rem;background:var(--ink);color:var(--paper);padding:1em 1.6em;transition:background .15s}
.btn:hover{background:#2a2a2a}
.btn:active,.btn.pressed{background:var(--red)}
.btn:disabled{opacity:.3;cursor:default}
.btn.ghost{background:transparent;color:var(--ink);box-shadow:inset 0 0 0 1px var(--ink)}
.chip{display:inline-flex;align-items:center;gap:.4em;font-family:var(--mono);font-weight:700;font-size:.85rem;text-transform:uppercase;letter-spacing:.08em}
.dot{width:.62em;height:.62em;display:inline-block;flex:none}
@keyframes pop{0%{transform:scale(.7);opacity:0}100%{transform:none;opacity:1}}
@keyframes popin{0%{transform:translateY(6px);opacity:0}100%{transform:none;opacity:1}}
@keyframes thud{0%{transform:translateY(-12px);opacity:0}100%{transform:none;opacity:1}}
@keyframes rise{from{transform:translateY(14px);opacity:0}to{transform:none;opacity:1}}
@keyframes slam{0%{transform:scale(1.6);opacity:0}70%{transform:scale(.97);opacity:1}100%{transform:none}}
@keyframes ticker{from{transform:translateX(0)}to{transform:translateX(-50%)}}
.rise{animation:rise .5s cubic-bezier(.2,.8,.3,1) both}
.toast{position:fixed;left:50%;bottom:24px;transform:translateX(-50%);background:var(--ink);color:var(--paper);font-family:var(--mono);font-weight:600;font-size:15px;padding:.9em 1.3em;
  z-index:99;max-width:92vw;text-align:center;animation:rise .3s both;border-top:3px solid var(--red)}

/* ================= HOST ================= */
.host{height:100vh;display:flex;flex-direction:column;overflow:hidden}
.mast{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:2vw;padding:1.4vh 3vw .8vh}
.mast .logo{font-family:var(--black);font-size:7.4vh;line-height:1;text-align:center;white-space:nowrap;font-weight:400}
.ear{border:1px solid var(--ink);padding:.7vh .9vw;text-align:center;width:15vw;line-height:1.25}
.ear.l{justify-self:start;font-style:italic;font-size:1.7vh}
.ear.r{justify-self:end}
.ear .el{font-family:var(--mono);font-weight:700;font-size:1.05vh;letter-spacing:.18em;text-transform:uppercase}
.ear .ec{font-weight:800;font-size:3.8vh;letter-spacing:.1em;line-height:1.05}
.folio{display:flex;justify-content:space-between;margin:0 3vw;border-top:5px double var(--ink);border-bottom:1px solid var(--ink);padding:.6vh 0;
  font-family:var(--mono);font-weight:600;font-size:1.35vh;letter-spacing:.16em;text-transform:uppercase}
.stage{flex:1;position:relative;padding:3vh 4vw 2vh;display:flex;flex-direction:column;min-height:0}
.ticker{border-top:1px solid var(--ink);height:4.8vh;display:flex;align-items:center;overflow:hidden;font-family:var(--serif);font-size:2vh;margin:0 3vw}
.ticker .tag{background:var(--ink);color:var(--paper);height:100%;display:flex;align-items:center;padding:0 1.2vw;font-family:var(--mono);font-weight:800;font-size:1.3vh;letter-spacing:.18em;text-transform:uppercase;flex:none;z-index:1}
.ticker .run{display:flex;white-space:nowrap;animation:ticker 110s linear infinite}
.ticker .run span{padding:0 1.8vw}
.ticker .run span::before{content:"\25A0";color:var(--red);margin-right:1.8vw;font-size:.6em;vertical-align:.2em}
.timer{position:absolute;top:3vh;right:4vw;width:11vh;text-align:center;border:1px solid var(--ink);background:var(--paper);padding-top:1vh}
.timer .n{font-weight:800;font-size:5.6vh;line-height:1;font-variant-numeric:tabular-nums}
.timer .l{font-family:var(--mono);font-weight:700;font-size:1vh;letter-spacing:.2em;text-transform:uppercase;margin:.5vh 0 .9vh}
.timer .bar{height:.6vh;background:var(--paper2)} .timer .bar i{display:block;height:100%;width:100%;background:var(--ink)}
.timer.low .n{color:var(--red)} .timer.low .bar i{background:var(--red)}
.skip{position:fixed;right:3vw;bottom:6.4vh;font-family:var(--mono);font-size:1.25vh;font-weight:700;text-transform:uppercase;letter-spacing:.14em;opacity:.45;
  box-shadow:inset 0 0 0 1px var(--ink);padding:.6em 1em;background:var(--paper)}
.skip:hover{opacity:1}
.kicker{font-family:var(--mono);font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:1.75vh;color:var(--red);display:flex;gap:1em;align-items:center}
.kicker::after{content:"";flex:1;height:1px;background:currentColor;max-width:10vw}
.big-q{font-weight:700;font-size:clamp(28px,6vh,74px);line-height:1.08;letter-spacing:-.02em;max-width:78vw;margin-top:1.6vh}
.big-q .blank{display:inline-block;min-width:4em;border-bottom:.07em solid var(--ink);height:.9em;vertical-align:baseline;margin:0 .1em}
.src{font-style:italic;font-size:2vh;color:var(--grey);margin-top:1.6vh}
.roster{display:flex;flex-wrap:wrap;align-items:baseline;gap:.6vh 1.8vw;margin-top:auto;padding-top:1.2vh;border-top:1px solid var(--ink)}
.tally{font-weight:800;font-size:3.4vh;line-height:1;margin-right:.6vw}
.tally span{font-size:.55em;font-weight:400;font-style:italic;margin-left:.25em}
.roster .chip{font-size:1.6vh;color:var(--hair);transition:color .25s}
.roster .chip.done{color:var(--ink)}
.roster .chip.done::after{content:"\2713";color:var(--red);font-size:1.15em}

/* lobby */
.lobby{display:grid;grid-template-columns:1.4fr 1fr;height:100%;min-height:0}
.lobby .hero{padding-right:3vw;border-right:1px solid var(--ink);display:flex;flex-direction:column;min-height:0}
.lobby .hero h1{font-weight:800;font-size:9vh;line-height:.98;letter-spacing:-.03em;margin-top:1.4vh}
.lobby .hero h1 em{font-weight:600}
.lobby .hero .deck{font-style:italic;font-size:2.5vh;margin-top:1.8vh;max-width:46ch;line-height:1.32;color:#333}
.byline{font-family:var(--mono);font-weight:700;font-size:1.25vh;letter-spacing:.16em;text-transform:uppercase;margin-top:1.6vh;color:var(--grey)}
.joinbox{display:flex;gap:2.4vw;align-items:center;margin-top:auto;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:2.2vh 0}
.joinbox img{width:19vh;height:19vh;display:block;background:#fff;padding:1vh;border:1px solid var(--ink)}
.joinbox .code{font-weight:800;font-size:11vh;line-height:.9;letter-spacing:.05em;margin-top:.8vh}
.joinbox .how{font-family:var(--mono);font-size:1.35vh;font-weight:700;text-transform:uppercase;letter-spacing:.14em;line-height:1.9}
.joinbox .how u{text-decoration:none;font-family:var(--serif);font-style:italic;font-weight:600;text-transform:none;letter-spacing:0;font-size:2.4vh;border-bottom:1px solid var(--ink)}
.press{padding-left:3vw;display:flex;flex-direction:column;min-height:0}
.press h2{font-family:var(--mono);font-weight:800;text-transform:uppercase;letter-spacing:.18em;font-size:1.6vh;display:flex;justify-content:space-between;
  border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:.9vh 0;margin-top:1vh}
.press h2 span{font-weight:600}
.passes{display:flex;flex-direction:column;margin-top:.6vh;flex:1;min-height:0;overflow:hidden}
.pass{display:flex;align-items:baseline;gap:1vw;padding:1vh 2vw 1vh 0;border-bottom:1px dotted var(--hair);position:relative;animation:rise .4s backwards}
.pass .sw{width:1.1vh;height:1.1vh;flex:none;align-self:center}
.pass .nm{font-weight:700;font-size:3vh;line-height:1.1}
.pass .lbl{margin-left:auto;font-style:italic;font-size:1.8vh;color:var(--grey)}
.pass .x{position:absolute;right:0;top:50%;transform:translateY(-50%);font-family:var(--mono);color:var(--hair);font-size:2vh}
.pass .x:hover{color:var(--red)}
.pass.off{opacity:.4}
.empty{font-style:italic;font-size:2.2vh;color:var(--grey);padding:2vh 0}
.startrow{display:flex;gap:1vw;align-items:stretch;margin-top:2vh}
.seg{display:flex;box-shadow:inset 0 0 0 1px var(--ink)}
.seg button{font-family:var(--mono);font-weight:700;text-transform:uppercase;font-size:1.3vh;padding:1.2vh 1vw;letter-spacing:.1em}
.seg button.on{background:var(--ink);color:var(--paper)}
.host .btn{font-size:1.7vh;flex:1}

/* intro */
.intro{margin:auto 0;animation:rise .6s both;text-align:center}
.intro .num{font-family:var(--mono);font-weight:700;font-size:1.9vh;letter-spacing:.26em;color:var(--red);text-transform:uppercase}
.intro h1{font-weight:800;font-size:14vh;line-height:.95;letter-spacing:-.035em;margin:1.6vh 0 2.6vh;padding:2.4vh 0;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink)}
.intro p{font-size:3.1vh;max-width:46ch;line-height:1.35;font-style:italic;margin:0 auto}
.intro .x2{display:block;width:fit-content;margin:2vh auto 0;font-size:.2em;letter-spacing:.2em}

/* options */
.opts{display:grid;grid-template-columns:1fr 1fr;gap:0 3vw;margin-top:3.4vh;max-width:84vw}
.opt{border-top:1px solid var(--ink);padding:1.8vh .2vw;font-weight:700;font-size:4vh;line-height:1.1;letter-spacing:-.01em;animation:rise .45s both;display:flex;align-items:baseline;gap:1.2vw}
.opt .ix{font-family:var(--mono);font-weight:800;font-size:1.7vh;color:var(--red);letter-spacing:.1em}
.opt.right{background:var(--ink);color:var(--paper);padding-left:1vw;padding-right:1vw}
.opt.dim{opacity:.32}
/* reveal */
.reveal{margin-top:3.4vh;display:flex;gap:4vw;align-items:center;min-height:38vh}
.reveal .card{border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:4vh 0 3vh;min-width:50vw;position:relative;animation:rise .4s both}
.reveal .card .t{font-weight:800;font-size:9vh;line-height:1;letter-spacing:-.03em}
.reveal .card .stamp{position:absolute;right:0;top:-2.4vh;font-size:2.4vh;background:var(--paper);animation:slam .4s .9s both}
.reveal .card .who{margin-top:2.2vh;font-style:italic;font-size:2.5vh;animation:rise .4s 1.3s both}
.voters{display:flex;flex-wrap:wrap;gap:.6vh 1.6vw;margin-top:1.6vh}
.voters .chip{font-size:1.8vh;animation:popin .35s both}
.opt .voters .chip{font-size:1.5vh}
.pts{font-weight:800;font-size:7vh;color:var(--red);animation:pop .4s 1.6s both;line-height:1}
.pts .mono{font-size:1.4vh!important;margin-top:.6vh}
.steps{position:absolute;bottom:2vh;left:4vw;font-family:var(--mono);font-weight:700;font-size:1.2vh;color:var(--grey);letter-spacing:.16em}
/* tf */
.tfq{font-weight:700;font-size:clamp(30px,6.4vh,76px);line-height:1.1;max-width:78vw;margin-top:2vh;letter-spacing:-.02em}
.verdict{font-size:9vh;margin-top:3vh;animation:slam .5s both}
.why{font-size:3vh;margin-top:2.6vh;max-width:62ch;font-style:italic;line-height:1.35}
/* draw */
.gallery{display:flex;gap:4vw;align-items:center;margin-top:2vh;flex:1;min-height:0}
.polaroid{flex:none}
.polaroid img{display:block;height:50vh;aspect-ratio:4/3;object-fit:contain;background:#fff;border:1px solid var(--ink)}
.polaroid .cap{font-style:italic;font-size:1.9vh;margin-top:.9vh;padding-bottom:.7vh;border-bottom:1px solid var(--ink);display:flex;justify-content:space-between}
.polaroid .cap b{font-family:var(--mono);font-style:normal;font-size:1.1vh;letter-spacing:.16em;text-transform:uppercase;color:var(--grey);align-self:center}
.gopts{display:flex;flex-direction:column;flex:1}
.gopts .opt{font-size:3vh}
.artists{display:grid;grid-template-columns:repeat(5,1fr);gap:2vh 1.5vw;margin-top:4vh}
.easel{aspect-ratio:4/3;border:1px dashed var(--hair);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1vh;font-weight:700;font-size:2.6vh}
.easel.done{border:1px solid var(--ink);background:#fff}
.easel .pen{font-size:3.6vh;color:var(--hair)}
.easel span[style]{color:var(--ink)!important}
/* number */
.bignum{font-weight:800;font-size:16vh;line-height:1;margin-top:1.6vh;animation:thud .5s both;letter-spacing:-.035em}
.ranklist{display:flex;flex-direction:column;margin-top:2.4vh;max-width:70vw;border-top:3px solid var(--ink)}
.rk{display:grid;grid-template-columns:5vh 1fr auto 10vw;gap:1.5vw;align-items:baseline;padding:1.1vh 0;border-bottom:1px solid var(--hair);font-weight:700;font-size:3vh;animation:rise .4s both}
.rk span:first-child{font-family:var(--mono);font-size:1.8vh;color:var(--grey)}
.rk span:nth-child(2){color:var(--ink)!important}
.rk .g{font-family:var(--mono);font-weight:600;font-size:2vh;font-variant-numeric:tabular-nums}
.rk .p{color:var(--red);text-align:right}
/* scores */
.board{display:flex;flex-direction:column;margin-top:2.4vh;max-width:84vw;border-top:3px solid var(--ink)}
.row{display:grid;grid-template-columns:5vh 22vw 1fr 12vw;align-items:center;gap:1.4vw;padding:1.1vh 0;border-bottom:1px solid var(--hair);animation:rise .45s both}
.row .pl{font-family:var(--mono);font-weight:800;font-size:1.9vh;color:var(--grey)}
.row .nm{font-weight:700;font-size:3.4vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.row .bar{height:2.2vh;background:var(--ink)!important;transition:width 1.2s cubic-bezier(.2,.9,.3,1);min-width:3px}
.row:first-child .bar{background:var(--red)!important}
.row .sc{font-weight:800;font-size:3.4vh;text-align:right;font-variant-numeric:tabular-nums}
.row .gn{font-family:var(--mono);font-size:1.4vh;color:var(--red);font-weight:700;display:block;letter-spacing:.06em}
/* final */
.final{display:grid;grid-template-columns:1.5fr 1fr;height:100%;min-height:0}
.final .lead{padding-right:3vw;border-right:1px solid var(--ink);display:flex;flex-direction:column}
.final .side{padding-left:3vw}
.fh{font-weight:800;font-size:10vh;line-height:.95;letter-spacing:-.035em;margin-top:1.2vh}
.final .deck{font-style:italic;font-size:2.5vh;margin-top:1.6vh;line-height:1.3}
.results{margin-top:3vh;border-top:3px solid var(--ink)}
.res{display:grid;grid-template-columns:4vh 20vw 1fr 10vw;align-items:center;gap:1.2vw;padding:1.2vh 0;border-bottom:1px solid var(--hair);animation:rise .5s both}
.res .ck{color:var(--red);font-size:3vh;font-weight:800;font-family:var(--mono)}
.res .nm{font-weight:700;font-size:3.3vh;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.res .bar{height:2.4vh;background:var(--ink)} .res.win .bar{background:var(--red)}
.res .sc{font-weight:800;font-size:3vh;text-align:right;font-variant-numeric:tabular-nums}
.sect{font-family:var(--mono);font-weight:800;text-transform:uppercase;letter-spacing:.18em;font-size:1.6vh;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:.9vh 0;margin-top:1vh}
.awards{display:flex;flex-direction:column}
.award{padding:1.6vh 0;border-bottom:1px solid var(--hair);animation:rise .5s both}
.award .t{font-family:var(--mono);font-weight:700;font-size:1.3vh;color:var(--red);letter-spacing:.16em;text-transform:uppercase}
.award .n{font-weight:800;font-size:3.6vh;margin-top:.3vh;color:var(--ink)!important;letter-spacing:-.02em}
.award .b{font-style:italic;font-size:2vh}

/* ================= PHONE ================= */
.phone{min-height:100dvh;display:flex;flex-direction:column;max-width:520px;margin:0 auto}
.ptop{display:flex;justify-content:space-between;align-items:center;padding:12px 18px 8px;border-bottom:5px double var(--ink);margin:0 0}
.ptop .logo{font-family:var(--black);font-size:30px;line-height:1}
.ptop .me{display:flex;align-items:center;gap:8px;font-family:var(--mono);font-weight:700;font-size:12px;text-transform:uppercase;letter-spacing:.1em}
.ptop .me b{font-family:var(--serif);font-weight:800;font-size:17px;letter-spacing:0;margin-left:4px;font-variant-numeric:tabular-nums}
.pbody{flex:1;padding:22px 18px 28px;display:flex;flex-direction:column;gap:16px}
.phone .kick{font-family:var(--mono);font-weight:700;text-transform:uppercase;letter-spacing:.16em;font-size:11px;color:var(--red)}
.phone h1{font-weight:800;font-size:44px;line-height:1;letter-spacing:-.03em}
.phone h2{font-weight:700;font-size:23px;line-height:1.2;letter-spacing:-.01em}
.phone p{font-size:17px;line-height:1.45}
.phone .btn{width:100%;font-size:15px;padding:19px}
.field{display:flex;flex-direction:column;gap:4px}
.field label{font-family:var(--mono);font-weight:700;font-size:11px;letter-spacing:.16em;text-transform:uppercase}
.field input{font-family:var(--serif);font-weight:700;font-size:28px;padding:8px 2px;border:0;border-bottom:2px solid var(--ink);background:transparent;border-radius:0;width:100%;outline:none}
.field input#code{text-transform:uppercase;letter-spacing:.24em}
.field input.lie{font-size:24px}
.field input:focus{border-bottom-color:var(--red)}
.field input::placeholder{color:var(--hair);font-weight:400;font-style:italic;letter-spacing:0}
.choices{display:flex;flex-direction:column;border-top:3px solid var(--ink)}
.choice{border-bottom:1px solid var(--ink);padding:16px 4px;font-family:var(--serif);font-weight:700;font-size:22px;text-align:left;line-height:1.15;transition:padding .12s}
.choice:active,.choice.sel{background:var(--ink);color:var(--paper);padding-left:12px}
.choice.small{font-size:18px}
.tfbtns{display:grid;grid-template-rows:1fr 1fr;gap:12px;flex:1;min-height:300px}
.tfbtns button{font-family:var(--serif);font-weight:800;font-size:64px;letter-spacing:-.03em;border:2px solid var(--ink)}
.tfbtns .real{background:var(--ink);color:var(--paper)} .tfbtns .fake{background:transparent;color:var(--red);border-color:var(--red)}
.tfbtns button:active{transform:scale(.98)}
.wait{margin:auto 0;text-align:center;display:flex;flex-direction:column;align-items:center;gap:14px}
.wait .stamp{font-size:26px;animation:pop .4s both}
.wait .eyes{font-weight:700;font-size:34px;line-height:1.05;letter-spacing:-.02em}
.passcard{background:#fff;border:1px solid var(--ink);padding:16px 16px 16px 24px;position:relative}
.passcard .sw{position:absolute;left:0;top:0;bottom:0;width:8px}
.passcard .lbl{font-family:var(--mono);font-weight:700;font-size:10px;letter-spacing:.18em;color:var(--red);text-transform:uppercase}
.passcard .nm{font-weight:800;font-size:44px;line-height:1;margin-top:8px;letter-spacing:-.02em}
.passcard::after{content:"PRESS";position:absolute;right:14px;top:14px;font-family:var(--mono);font-weight:800;font-size:11px;letter-spacing:.3em;border:1px solid var(--ink);padding:3px 4px 3px 7px}
.scorebox{display:flex;justify-content:space-between;align-items:center;border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:10px 0}
.scorebox .v{font-weight:800;font-size:36px;font-variant-numeric:tabular-nums}
.scorebox .l{font-family:var(--mono);font-weight:700;font-size:10px;letter-spacing:.16em;text-transform:uppercase}
.gain{font-weight:800;font-size:64px;color:var(--red);line-height:1}
.assign{font-size:23px;line-height:1.2;border-left:4px solid var(--red);padding-left:12px}
.canvaswrap{background:#fff;border:1px solid var(--ink);touch-action:none;position:relative}
.canvaswrap canvas{display:block;width:100%;aspect-ratio:4/3;touch-action:none}
.tools{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.sw-btn{width:36px;height:36px;border-radius:50%;border:3px solid var(--paper);box-shadow:0 0 0 1px var(--ink)}
.sw-btn.on{box-shadow:0 0 0 3px var(--ink)}
.tool{font-family:var(--mono);font-weight:700;font-size:11px;text-transform:uppercase;letter-spacing:.08em;box-shadow:inset 0 0 0 1px var(--ink);padding:10px 11px;background:#fff}
.tool.on{background:var(--ink);color:var(--paper)}
.muted{color:var(--grey)}
.vipbox{border-top:3px solid var(--ink);border-bottom:1px solid var(--ink);padding:14px 0 16px;display:flex;flex-direction:column;gap:12px}
.vipbox .seg{width:100%}.vipbox .seg button{flex:1;font-size:12px;padding:11px}
