:root{--desk:#1f2a44;--desk-raised:#283559;--desk-line:#3a4870;--desk-muted:#a9b3ce;--ink:#1b1b2f;--paper:#fffdf6;--note:#ffd93d;--yes:#9be564;--no:#ff7a6b;--maybe:#ffd93d;--marker:"Permanent Marker", "Marker Felt", "Arial Black", sans-serif;--ui:"Bricolage Grotesque", system-ui, sans-serif}*{box-sizing:border-box;margin:0}html,body,#root{min-height:100%}body{background:var(--desk);color:var(--paper);font:500 1rem/1.5 var(--ui);-webkit-tap-highlight-color:transparent}button,input{font:inherit;color:inherit}button{cursor:pointer}button:disabled{cursor:default;opacity:.45}:focus-visible{outline:3px solid var(--paper);outline-offset:3px}a{color:inherit}.page{max-width:46rem;padding:max(1.25rem, env(safe-area-inset-top)) max(1rem, env(safe-area-inset-right)) max(1.25rem, env(safe-area-inset-bottom)) max(1rem, env(safe-area-inset-left));flex-direction:column;gap:1.25rem;margin:0 auto;display:flex}.home{justify-content:center;max-width:30rem;min-height:100dvh}.notice{justify-content:center;align-items:flex-start;min-height:100dvh}.title{font:400 clamp(2.5rem, 12vw, 4rem)/1 var(--marker);transform-origin:0;transform:rotate(-2deg)}.title a{text-decoration:none}.lede{color:var(--desk-muted);max-width:38ch}.aside{color:var(--desk-muted);font-size:.95rem}.panel-title{font:800 1.1rem/1.2 var(--ui)}.count{color:var(--desk-muted);font-weight:500}.waiting{color:var(--desk-muted)}.card-panel,.panel{background:var(--desk-raised);border-radius:14px;flex-direction:column;gap:.9rem;padding:1.1rem;display:flex}.field{flex-direction:column;gap:.35rem;font-size:.95rem;font-weight:800;display:flex}.field input,.composer input{background:var(--desk);border:2px solid var(--desk-line);border-radius:10px;min-width:0;padding:.7rem .85rem;font-size:1rem;font-weight:500}.field input:focus,.composer input:focus{border-color:var(--paper);outline:none}.grow{flex:1}.join-row{align-items:flex-end;gap:.6rem;display:flex}.code-input{letter-spacing:.3em;text-transform:uppercase;font-weight:800!important}.form-error{color:#ffb4a8;font-weight:800}.btn{border:2px solid var(--desk-line);background:var(--desk);white-space:nowrap;border-radius:999px;justify-content:center;align-items:center;padding:.65rem 1.2rem;font-weight:800;text-decoration:none;display:inline-flex}.btn.primary{background:var(--paper);color:var(--ink);border-color:var(--paper)}.btn.wide{width:100%;padding:.95rem;font-size:1.15rem}.btn.ghost{background:0 0}.btn.small{padding:.35rem .85rem;font-size:.9rem}.btn.ink{background:var(--ink);color:var(--note);border-color:var(--ink)}.btn.ink-outline{color:var(--ink);border-color:var(--ink);background:0 0}.btn:not(:disabled):active{transform:translateY(1px)}.banner,.toast{z-index:10;text-align:center;border-radius:999px;max-width:calc(100vw - 2rem);padding:.5rem 1.1rem;font-weight:800;position:fixed;left:50%;translate:-50%}.banner{background:var(--maybe);color:var(--ink);top:.75rem}.toast{background:var(--paper);color:var(--ink);bottom:6rem;box-shadow:0 10px 30px #0006}.room-head{flex-wrap:wrap;align-items:center;gap:.75rem;display:flex}.room-code{letter-spacing:.05em;font-weight:800}.room-detail{color:var(--desk-muted);flex-basis:100%;order:3;font-size:.9rem}.room-head .btn{margin-left:auto}.invite{flex-direction:column;align-items:flex-start;gap:.5rem;display:flex}.invite-code{font:400 clamp(3.5rem, 18vw, 5rem)/1 var(--marker);letter-spacing:.08em}.invite-help{color:var(--desk-muted)}.invite-actions{flex-wrap:wrap;gap:.6rem;display:flex}.player-list{flex-wrap:wrap;gap:.5rem;padding:0;list-style:none;display:flex}.player-list li{background:var(--desk);border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .85rem;font-weight:800;display:flex}.player-list li.offline{opacity:.5}.tag{color:var(--desk-muted);font-size:.75rem;font-weight:500}.choice{grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:.6rem;display:grid}.choice-btn{text-align:left;border:2px solid var(--desk-line);background:var(--desk);border-radius:12px;flex-direction:column;gap:.2rem;padding:.75rem .9rem;display:flex}.choice-btn span{color:var(--desk-muted);font-size:.9rem}.choice-btn[aria-checked=true]{border-color:var(--paper);box-shadow:inset 0 0 0 1px var(--paper)}.settings-summary{grid-template-columns:auto 1fr;gap:.3rem 1rem;display:grid}.settings-summary dt{color:var(--desk-muted)}.settings-summary dd{font-weight:800}.start-btn{margin-top:.5rem}.pads{grid-template-columns:repeat(2,1fr);gap:.9rem .8rem;padding:.4rem 0 0;list-style:none;display:grid}.pad{aspect-ratio:2.3;background:var(--c);width:100%;color:var(--ink);font:400 clamp(1rem, 4.6vw, 1.3rem)/1.1 var(--marker);transform:rotate(var(--tilt,-1.5deg));border:0;border-radius:2px 2px 14px;place-items:center;padding:.5rem;transition:transform .16s ease-out,box-shadow .16s ease-out;display:grid;position:relative;box-shadow:0 12px 14px -10px #0000008c}.pads li:nth-child(2n) .pad{--tilt:1.2deg}.pads li:nth-child(3n) .pad{--tilt:-.6deg}.pads li:last-child{grid-column:1/-1}.pads li:last-child .pad{aspect-ratio:4.8}.pad[aria-pressed=true]{box-shadow:0 18px 18px -10px #0009, 0 0 0 3px var(--paper);transform:rotate(0)translateY(-4px)scale(1.03)}.pad[aria-pressed=true]:before,.note-card.turn:before{content:"";background:#ffffff8c;width:46%;height:20px;position:absolute;top:-10px;left:50%;translate:-50%;rotate:-3deg;box-shadow:0 1px 2px #00000026}@media (width>=40rem){.pads{grid-template-columns:repeat(3,1fr)}.pads li:last-child{grid-column:auto}.pads li:last-child .pad{aspect-ratio:2.3}}.notes{scroll-snap-type:x proximity;scrollbar-width:none;gap:.9rem;padding:.8rem .2rem .6rem;list-style:none;display:flex;overflow-x:auto}.note-card{background:var(--note);width:8rem;min-height:5.75rem;color:var(--ink);scroll-snap-align:start;border-radius:2px 2px 12px;flex-direction:column;flex:none;gap:.25rem;padding:.55rem .65rem .7rem;display:flex;position:relative;transform:rotate(-1.2deg);box-shadow:0 12px 14px -10px #0000008c}.note-card:nth-child(2n){transform:rotate(1deg)}.note-card.turn{box-shadow:0 16px 18px -10px #0009, 0 0 0 3px var(--paper);transform:translateY(-4px)}.note-card.offline{opacity:.55}.note-player{justify-content:space-between;gap:.3rem;font-size:.85rem;font-weight:800;display:flex}.rank{background:var(--ink);color:var(--note);border-radius:999px;padding:0 .45rem;font-size:.75rem}.note-name{font:400 1.2rem/1.1 var(--marker);overflow-wrap:anywhere}.note-status{opacity:.7;font-size:.75rem;font-weight:800}.turn-banner{border-left:4px solid var(--desk-line);color:var(--desk-muted);padding:.3rem 0 .3rem .8rem;font-weight:800}.turn-banner.mine{border-color:var(--note);color:var(--paper)}.host-bar{flex-wrap:wrap;justify-content:flex-end;gap:.5rem;display:flex}.chat-panel{gap:.75rem;padding:.75rem}.chat{overscroll-behavior:contain;flex-direction:column;gap:.55rem;max-height:22rem;padding:.2rem;display:flex;overflow-y:auto}.game .chat{flex:1;max-height:none}.entry{max-width:90%}.entry.system{color:var(--desk-muted);text-align:center;align-self:center;max-width:none;font-size:.85rem}.chat-line,.question,.guess{background:var(--desk);border-radius:12px 12px 12px 4px;padding:.5rem .75rem}.entry.mine{border-radius:12px 12px 4px;align-self:flex-end}.who{color:var(--desk-muted);font-size:.85rem;font-weight:800}.question p,.guess p{flex-direction:column;display:flex}.q-text{font-size:1.05rem;font-weight:800}.question{border-left:4px solid var(--note)}.guess{border-left:4px solid var(--paper)}.guess.right{border-color:var(--yes)}.guess.wrong{border-color:var(--no)}.hint{color:var(--desk-muted);margin-top:.3rem;font-size:.9rem}.hint strong{color:var(--paper)}.verdict{margin-top:.2rem;font-size:.85rem;font-weight:800}.guess.right .verdict{color:var(--yes)}.guess.wrong .verdict{color:var(--no)}.answers{flex-wrap:wrap;gap:.3rem;margin-top:.4rem;padding:0;list-style:none;display:flex}.answer-chip{color:var(--ink);border-radius:999px;padding:.1rem .6rem;font-size:.82rem;font-weight:800}.answer-chip.yes,.answer-btn.yes{background:var(--yes)}.answer-chip.no,.answer-btn.no{background:var(--no)}.answer-chip.maybe,.answer-btn.maybe{background:var(--maybe)}.answer-buttons{gap:.45rem;margin-top:.5rem;display:flex}.answer-btn{color:var(--ink);opacity:.8;border:0;border-radius:999px;padding:.45rem 1rem;font-weight:800}.answer-btn[aria-pressed=true]{opacity:1;box-shadow:0 0 0 3px var(--paper)}.composer{gap:.5rem;display:flex}.composer input{flex:1}.composer.turn{flex-direction:column}.turn-actions{gap:.5rem;display:flex}.turn-actions .btn{flex:1}.page.game{min-height:100dvh}.game .chat-panel{flex:1;min-height:16rem}@media (width<=40rem){.page.game{gap:.75rem;height:100dvh}.game .chat-panel{min-height:0}}.results-title{margin-top:.5rem}.results{flex-direction:column;gap:.5rem;padding:0;list-style:none;display:flex}.results li{background:var(--desk);border-radius:12px;grid-template-columns:auto 1fr auto;grid-template-areas:"rank who stat""rank card stat";align-items:center;column-gap:.75rem;padding:.6rem .8rem;display:grid}.results.unsolved li{grid-template-columns:1fr auto;grid-template-areas:"who stat""card stat"}.rank-badge{background:var(--note);width:2.2rem;height:2.2rem;color:var(--ink);border-radius:50%;grid-area:rank;place-items:center;font-weight:800;display:grid}.result-who{grid-area:who;font-weight:800}.result-card{font:400 1.2rem/1.2 var(--marker);grid-area:card}.result-stat{color:var(--desk-muted);grid-area:stat;font-size:.9rem}.local-pick{min-height:100dvh}.sticky-start{bottom:max(1rem, env(safe-area-inset-bottom));margin-top:auto;position:sticky;box-shadow:0 10px 24px -8px #0009}.fullnote{background:var(--note);min-height:100dvh;color:var(--ink);text-align:center;padding:max(1.5rem, env(safe-area-inset-top)) max(1.25rem, env(safe-area-inset-right)) max(1.5rem, env(safe-area-inset-bottom)) max(1.25rem, env(safe-area-inset-left));flex-direction:column;justify-content:center;align-items:center;gap:.5rem;display:flex}.fullnote :focus-visible{outline-color:var(--ink)}.count-num{font:800 min(55vw, 62vh)/1 var(--ui);font-variant-numeric:tabular-nums}.caption{font:800 clamp(1.1rem, 4vw, 1.6rem)/1.2 var(--ui)}.card-stage{height:100dvh;padding-top:max(3.5rem, env(safe-area-inset-top));position:relative}.name-box{flex:1;justify-content:center;align-items:center;width:100%;min-height:0;display:flex}.big-name{width:100%;font-family:var(--marker);overflow-wrap:normal;word-break:keep-all;line-height:1.02}.timer{font:800 clamp(1.5rem, 6vmin, 2.5rem)/1 var(--ui);font-variant-numeric:tabular-nums;opacity:.75}.done{top:max(.75rem, env(safe-area-inset-top));right:max(.75rem, env(safe-area-inset-right));opacity:.55;background:0 0;border:2px solid;border-radius:999px;padding:.3rem .9rem;font-weight:800;position:absolute}.end-title{font:800 clamp(1.4rem, 5vw, 2rem)/1.1 var(--ui)}.you-were{opacity:.7;margin-top:.75rem;font-weight:800}.end-name{font:400 clamp(2.5rem, 12vmin, 5.5rem)/1.05 var(--marker);max-width:18ch;margin-bottom:1.25rem}.actions{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.actions .btn{padding:.85rem 1.6rem;font-size:1.1rem}.slap{animation:.26s cubic-bezier(.2,.9,.3,1.3) slap}@keyframes slap{0%{opacity:.4;transform:scale(1.12)rotate(-3deg)}to{opacity:1;transform:none}}@media (prefers-reduced-motion:reduce){.slap{animation:none}.pad{transition:none}}