:root{--bg:#10140f;--bg-2:#182019;--panel:#efe5cc0d;--panel-border:#efe5cc21;--text:#f1ead9;--muted:#a7a58f;--paper:#efe5cc;--paper-2:#e2d4b0;--ink:#23201a;--stamp:#e3b23c;--fox:#ff7b39;--owl:#4c8dff;--neutral:#c9ba94;--assassin:#0a0a0a;--red:#ff5a4f;--team:var(--stamp);--display:"Archivo", system-ui, sans-serif;--body:"Archivo", system-ui, sans-serif;--mono:"JetBrains Mono", ui-monospace, monospace;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}html{font-size:clamp(14px,1.1vw,32px)}body{background:radial-gradient(55vw 45vh at 0% 0%, #ff7b391f, transparent 70%), radial-gradient(55vw 45vh at 100% 100%, #4c8dff21, transparent 70%), repeating-linear-gradient(0deg, #efe5cc06 0 1px, transparent 1px 3rem), repeating-linear-gradient(90deg, #efe5cc06 0 1px, transparent 1px 3rem), var(--bg);min-height:100vh;color:var(--text);font-family:var(--body);margin:0;font-weight:500;overflow-x:hidden}h1,h2{font-family:var(--display);margin:0;font-weight:900}kbd{font-family:var(--mono);opacity:.6;border:1px solid;border-radius:.3em;margin-left:.5em;padding:.15em .45em;font-size:.65em}@keyframes pop{0%{opacity:0;transform:scale(.6)}}@keyframes blink{to{opacity:.45}}@keyframes flip{0%{transform:perspective(40rem)rotateX(90deg)}60%{transform:perspective(40rem)rotateX(-12deg)}}@keyframes stamp{0%{opacity:0;transform:scale(2.2)rotate(-18deg)}70%{opacity:1;transform:scale(.92)rotate(-8deg)}}@keyframes rise{0%{opacity:0;transform:translate(-50%,1.5rem)}}@keyframes glow{to{box-shadow:0 0 2.5rem color-mix(in srgb, var(--team) 45%, transparent)}}.btn{font:700 1rem var(--body);color:var(--text);border:1px solid var(--panel-border);cursor:pointer;white-space:nowrap;background:#efe5cc12;border-radius:.5rem;justify-content:center;align-items:center;gap:.4em;padding:.7em 1.4em;transition:transform .12s,background .12s;display:inline-flex}.btn:hover:not(:disabled){background:#efe5cc24}.btn:active:not(:disabled){transform:scale(.96)}.btn:focus-visible{outline:3px solid var(--stamp);outline-offset:3px}.btn:disabled{opacity:.35;cursor:not-allowed}.btn.primary{background:var(--stamp);color:var(--ink);text-transform:uppercase;letter-spacing:.04em;box-shadow:0 .3rem 0 color-mix(in srgb, var(--stamp) 55%, black);border-color:#0000}.btn.primary:hover:not(:disabled){background:color-mix(in srgb, var(--stamp) 85%, white)}.btn.big{padding:.8em 2em;font-size:1.2rem}.btn.small{padding:.45em 1em;font-size:.85rem}.btn.ghost{background:0 0}.logo{font-family:var(--display);letter-spacing:.02em;color:var(--paper);text-align:center;font-size:5.5rem;font-weight:900;font-stretch:70%;line-height:.95}.logo span{color:var(--stamp);letter-spacing:.55em;margin-right:-.55em;font-size:.42em;font-stretch:125%;display:block}.logo.small{align-items:baseline;gap:.4em;font-size:1.4rem;display:flex}.logo.small span{letter-spacing:.3em;margin-right:0;font-size:.6em;display:inline}.hint{color:var(--muted);margin:0;line-height:1.45}.hint.small{font-size:.85rem}.center-text{text-align:center}.muted{color:var(--muted)}.error{color:var(--red);margin:0}.waiting{color:var(--muted);margin:0;animation:1.2s ease-in-out infinite alternate blink}.who{color:var(--team)}.row{flex-wrap:wrap;justify-content:center;gap:1rem;display:flex}.panel{background:var(--panel);border:1px solid var(--panel-border);border-radius:.9rem;flex-direction:column;gap:.8rem;padding:1.1rem 1.3rem;display:flex}.panel h2{font-family:var(--mono);color:var(--muted);text-transform:uppercase;letter-spacing:.12em;font-size:.85rem;font-weight:700}input{width:100%;font:600 1.1rem var(--body);color:var(--text);border:1px solid var(--panel-border);background:#00000059;border-radius:.6rem;padding:.75em .9em}input:focus{outline:2px solid var(--team)}.host-tag,.role{font-family:var(--mono);text-transform:uppercase;letter-spacing:.08em;margin-left:.5em;font-size:.65rem}.host-tag{color:var(--stamp)}.role{color:var(--team)}.segmented{flex-wrap:wrap;gap:.4rem;display:flex}.segmented button{font:600 .85rem var(--body);color:var(--muted);border:1px solid var(--panel-border);cursor:pointer;background:0 0;border-radius:.4rem;padding:.4em .8em}.segmented button.on{color:var(--ink);background:var(--stamp);border-color:#0000}.timer{align-items:center;gap:.8rem;width:min(100%,30rem);display:flex}.timer span{font-family:var(--mono);text-align:right;min-width:4ch;font-weight:700}.timer-bar{background:#efe5cc1a;border-radius:999px;flex:1;height:.5rem;overflow:hidden}.timer-bar div{background:var(--team);height:100%;transition:width .2s linear}.timer.hurry span{color:var(--red)}.timer.hurry .timer-bar div{background:var(--red)}.board{grid-template-columns:repeat(5,minmax(0,1fr));gap:.7rem;width:100%;display:grid}.tile{aspect-ratio:1.55;background:linear-gradient(transparent 62%, #23201a1f 62% 64%, transparent 64%), linear-gradient(160deg, var(--paper), var(--paper-2));color:var(--ink);font:inherit;cursor:default;border:none;border-radius:.5rem;place-items:center;padding:.3rem;transition:transform .15s,box-shadow .15s;display:grid;position:relative;box-shadow:0 .25rem #00000059,inset 0 0 0 1px #23201a26}.tile .word{font-family:var(--display);text-transform:uppercase;letter-spacing:.02em;overflow-wrap:anywhere;text-align:center;font-size:1.55rem;font-weight:800;font-stretch:72%;line-height:1}.board.pickable .tile:not(:disabled){cursor:pointer}.board.pickable .tile:not(:disabled):active{transform:scale(.95)}.tile.selected{outline:.25rem solid var(--team);outline-offset:.15rem;transform:translateY(-.2rem)}.tile.revealed{color:#fff;box-shadow:inset 0 0 0 1px #0003}.tile.revealed .word{opacity:.8;align-self:end;font-size:.95rem}.tile.revealed.kind-fox{background:linear-gradient(160deg, var(--fox), color-mix(in srgb, var(--fox) 70%, black))}.tile.revealed.kind-owl{background:linear-gradient(160deg, var(--owl), color-mix(in srgb, var(--owl) 70%, black))}.tile.revealed.kind-neutral{background:linear-gradient(160deg, var(--neutral), color-mix(in srgb, var(--neutral) 70%, black));color:var(--ink)}.tile.revealed.kind-assassin{background:repeating-linear-gradient(45deg, #ff5a4f2e 0 .4rem, transparent .4rem .8rem), var(--assassin);box-shadow:inset 0 0 0 2px var(--red)}.tile .seal{filter:drop-shadow(0 .1rem .1rem #00000059);font-size:2.2rem;position:absolute;top:50%;left:50%;translate:-50% -62%;rotate:-8deg}.tile.just{animation:.6s cubic-bezier(.2,1.2,.4,1) flip}.tile.just .seal{animation:.5s cubic-bezier(.2,1.4,.4,1) .35s both stamp}.tile.hint,.tile.ghost{box-shadow:0 .25rem 0 #00000059, inset 0 -.55rem 0 var(--hint), inset 0 0 0 .2rem var(--hint)}.tile.hint.kind-fox{--hint:var(--fox);background:linear-gradient(160deg, color-mix(in srgb, var(--fox) 22%, var(--paper)), color-mix(in srgb, var(--fox) 30%, var(--paper-2)))}.tile.hint.kind-owl{--hint:var(--owl);background:linear-gradient(160deg, color-mix(in srgb, var(--owl) 22%, var(--paper)), color-mix(in srgb, var(--owl) 30%, var(--paper-2)))}.tile.hint.kind-neutral{--hint:#9c8f6c}.tile.hint.kind-assassin{--hint:var(--assassin);color:var(--paper);background:linear-gradient(160deg,#57524a,#2d2a25)}.tile.ghost{opacity:.55}.marks{gap:.15rem;display:flex;position:absolute;top:-.45rem;right:-.3rem}.mark{width:1.5rem;height:1.5rem;font:800 .8rem var(--body);color:#fff;background:var(--team);box-shadow:0 0 0 2px var(--bg);border-radius:50%;place-items:center;animation:.3s cubic-bezier(.2,1.6,.4,1) pop;display:grid}.board.compact{gap:.3rem}.board.compact .tile{aspect-ratio:1.15;border-radius:.3rem;padding:.15rem;box-shadow:0 .15rem #00000059}.board.compact .tile.hint{box-shadow:inset 0 -.35rem 0 var(--hint), inset 0 0 0 .15rem var(--hint)}.board.compact .tile .word{font-size:clamp(.55rem,2.75vw,.85rem);font-stretch:62%}.board.compact .tile.revealed .word{font-size:clamp(.45rem,2vw,.6rem)}.board.compact .tile .seal{font-size:1.2rem}.board.compact .mark{width:1.05rem;height:1.05rem;font-size:.6rem}.board.compact .marks{top:-.3rem;right:-.2rem}.results{vertical-align:middle;gap:.2rem;display:inline-flex}.pip{border-radius:2px;width:.65rem;height:.65rem}.pip.kind-fox{background:var(--fox)}.pip.kind-owl{background:var(--owl)}.pip.kind-neutral{background:var(--neutral)}.pip.kind-assassin{background:var(--assassin);box-shadow:0 0 0 1px var(--red)}.clue-tag{background:var(--paper);color:var(--ink);font-family:var(--display);text-transform:uppercase;box-shadow:.25rem .25rem 0 var(--team);border-radius:.4rem;align-items:center;gap:.5em;padding:.15em .2em .15em .7em;display:inline-flex}.clue-tag b{letter-spacing:.03em;font-weight:900;font-stretch:80%}.clue-tag i{font-style:normal;font-family:var(--mono);color:#fff;background:var(--team);border-radius:.25rem;padding:0 .45em;font-weight:700}.loading{min-height:100vh;color:var(--muted);place-items:center;font-size:1.4rem;display:grid}.home{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:1.6rem;min-height:100vh;padding:3rem 2rem;display:flex}.stamp-label{font-family:var(--mono);letter-spacing:.3em;text-transform:uppercase;color:var(--red);border:.18rem solid var(--red);opacity:.85;border-radius:.3rem;padding:.2em .8em;font-size:1rem;font-weight:700;animation:.6s cubic-bezier(.2,1.4,.4,1) .2s both stamp;rotate:-6deg}.tagline{color:var(--paper-2);margin:0;font-size:1.4rem;font-weight:600}.how{grid-template-columns:repeat(auto-fit,minmax(min(100%,16rem),1fr));gap:1rem;width:min(100%,64rem);margin:0;padding:0;list-style:none;display:grid}.how li{background:var(--panel);border:1px solid var(--panel-border);border-top:.3rem solid var(--team);text-align:left;border-radius:.8rem;flex-direction:column;gap:.5rem;padding:1.2rem;display:flex}.how b{font-family:var(--display);font-size:1.1rem}.how span{color:var(--muted);line-height:1.45}.tv{grid-template-rows:auto 1fr;min-height:100vh;display:grid}.topbar{border-bottom:1px solid var(--panel-border);background:#00000040;flex-wrap:wrap;align-items:center;gap:.75rem 2rem;padding:.8rem 2rem;display:flex}.topbar-info{flex:1;justify-content:center;display:flex}.tally{font-family:var(--mono);gap:.6rem;font-size:1.2rem;font-weight:700;display:flex}.tally span[style]{color:var(--team)}.topbar-right{align-items:center;gap:1rem;display:flex}.room-code{color:var(--muted)}.room-code b{font-family:var(--mono);color:var(--text);letter-spacing:.15em}.lead{color:var(--muted);margin:0;font-size:1.2rem}.lobby{grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);align-items:center;gap:3rem;width:min(100%,84rem);margin:0 auto;padding:2rem;display:grid}.lobby-join{text-align:center;flex-direction:column;align-items:center;gap:1rem;display:flex}.lobby-join h1{font-size:2rem}.qr{background:var(--paper);box-shadow:.5rem .5rem 0 var(--stamp);border-radius:.6rem;padding:.75rem;line-height:0}.qr svg{width:min(15rem,60vw);height:auto}.lobby-url{margin:0;font-size:1.2rem;font-weight:700}.lobby-code{color:var(--muted);margin:0;font-size:1.1rem}.lobby-code b{font-family:var(--mono);letter-spacing:.15em;color:var(--stamp);margin-left:.3em;font-size:2.6rem}.lobby-side{flex-direction:column;gap:1rem;display:flex}.lobby-teams{grid-template-columns:1fr 1fr;gap:1rem;display:grid}.team-panel{border-top:.3rem solid var(--team);min-height:12rem}.team-panel h2{font-family:var(--display);color:var(--team);letter-spacing:0;text-transform:none;font-size:1.4rem}.roster{flex-direction:column;gap:.35rem;margin:0;padding:0;list-style:none;display:flex}.roster li{font-size:1.05rem;font-weight:700;animation:.3s cubic-bezier(.2,1.6,.4,1) pop}.roster li.offline{opacity:.4}.roster button{font:inherit;color:inherit;cursor:pointer;text-align:left;background:0 0;border:none;padding:0}.lobby-start{flex-wrap:wrap;justify-content:center;align-items:center;gap:1rem;display:flex}.game{grid-template-columns:minmax(12rem,16rem) minmax(0,1fr) minmax(12rem,16rem);align-items:start;gap:1.5rem;padding:1.25rem 1.5rem;display:grid}.game-center{flex-direction:column;align-items:center;gap:1.1rem;min-width:0;display:flex}.game-center .board{max-width:calc(150vh - 27rem)}.turn-banner{background:color-mix(in srgb, var(--team) 12%, transparent);border:1px solid color-mix(in srgb, var(--team) 45%, transparent);border-radius:.8rem;flex-wrap:wrap;justify-content:center;align-items:center;gap:.6rem 1.4rem;width:100%;padding:.7rem 1.2rem;font-size:1.15rem;display:flex}.turn-team{font-family:var(--display);color:var(--team);font-weight:900}.turn-banner .clue-tag{font-size:1.8rem}.turn-status{color:var(--muted)}.turn-banner .timer{width:14rem}.team-side{background:var(--panel);border:1px solid var(--panel-border);border-top:.35rem solid var(--team);opacity:.6;border-radius:.9rem;flex-direction:column;gap:.9rem;padding:1.1rem;transition:opacity .3s;display:flex}.team-side.active,.team-side.won{opacity:1;animation:1.4s ease-in-out infinite alternate glow}.team-head{align-items:center;gap:.5rem;display:flex}.team-head h2{color:var(--team);font-size:1.4rem}.team-emoji{font-size:1.8rem}.remaining{align-items:baseline;gap:.5rem;display:flex}.remaining b{font-family:var(--display);color:var(--team);font-size:4rem;font-weight:900;line-height:1}.remaining span{color:var(--muted);font-size:.9rem}.clue-log{border-top:1px dashed var(--panel-border);flex-direction:column;gap:.4rem;margin:0;padding:.8rem 0 0;list-style:none;display:flex}.clue-log li{align-items:center;gap:.5rem;font-size:.95rem;display:flex}.clue-log b{text-transform:uppercase;font-stretch:80%}.clue-log i{font-style:normal;font-family:var(--mono);color:var(--muted)}.toast{background:var(--paper);color:var(--ink);z-index:10;border-radius:.8rem;flex-direction:column;align-items:center;gap:.2rem;padding:.9rem 2rem;font-size:1.2rem;animation:.35s cubic-bezier(.2,1.4,.4,1) rise;display:flex;position:fixed;bottom:2rem;left:50%;transform:translate(-50%);box-shadow:0 1rem 3rem #00000080}.toast b{text-transform:uppercase}.toast strong{font-family:var(--display);font-size:1.8rem;font-weight:900}.toast.kind-fox strong{color:color-mix(in srgb, var(--fox) 80%, black)}.toast.kind-owl strong{color:color-mix(in srgb, var(--owl) 80%, black)}.toast.kind-assassin{background:var(--assassin);color:var(--paper);box-shadow:0 0 0 .2rem var(--red)}.finale{background:color-mix(in srgb, var(--team) 14%, transparent);border:1px solid color-mix(in srgb, var(--team) 50%, transparent);border-radius:.8rem;flex-wrap:wrap;justify-content:center;align-items:center;gap:.5rem 1.5rem;width:100%;padding:.6rem 1.2rem;display:flex}.finale-text{flex-direction:column;display:flex}.finale h1{color:var(--team);font-size:2rem;animation:.5s cubic-bezier(.2,1.6,.4,1) pop}@media (width<=1000px){.lobby,.game{grid-template-columns:1fr}.team-side{order:2}.game-center .board{max-width:none}.logo{font-size:3.5rem}}.phone{flex-direction:column;align-items:center;gap:1rem;min-height:100dvh;padding:1rem .75rem 2rem;font-size:16px;display:flex}.phone-game{flex-direction:column;gap:.9rem;width:100%;max-width:30rem;display:flex}.card{background:var(--panel);border:1px solid var(--panel-border);text-align:center;border-radius:.9rem;flex-direction:column;align-items:stretch;gap:.9rem;width:100%;max-width:30rem;padding:1.2rem .9rem;display:flex}.card h1{font-size:1.4rem}.phone p{margin:0}.phone .btn{font-size:1rem}.phone .btn.big{padding:.9em 1.5em;font-size:1.05rem}.join label{text-align:left;color:var(--muted);flex-direction:column;gap:.4rem;font-size:.9rem;display:flex}.code-input{letter-spacing:.3em;text-align:center;text-transform:uppercase;font-family:var(--mono)!important;font-size:1.8rem!important}.phone-me{background:color-mix(in srgb, var(--team) 16%, transparent);border:1px solid color-mix(in srgb, var(--team) 40%, transparent);border-radius:.7rem;align-items:center;gap:.6rem;padding:.6rem 1rem;display:flex}.phone-me b{color:var(--team);flex:1}.phone-role{font-family:var(--mono);text-transform:uppercase;color:var(--muted);font-size:.75rem}.phone-tally{font-family:var(--mono);font-size:.8rem;font-weight:700}.leave{align-self:center;margin-top:.5rem}.team-pick{grid-template-columns:1fr 1fr;gap:.6rem;display:grid}.team-option{border:2px solid color-mix(in srgb, var(--team) 35%, transparent);background:color-mix(in srgb, var(--team) 8%, transparent);color:var(--text);font:inherit;cursor:pointer;border-radius:.8rem;flex-direction:column;align-items:center;gap:.25rem;padding:.9rem .6rem;display:flex}.team-option b{font-family:var(--display);color:var(--team);font-size:1.1rem;font-weight:900}.team-option small{color:var(--muted);font-size:.78rem;line-height:1.3}.team-option.on{border-color:var(--team);background:color-mix(in srgb, var(--team) 22%, transparent)}.host-box{border-top:1px dashed var(--panel-border);flex-direction:column;align-items:center;gap:.4rem;padding-top:.6rem;display:flex}.host-box .segmented{justify-content:center}.turn-line{flex-wrap:wrap;justify-content:center;align-items:center;gap:.4rem .8rem;font-weight:700;display:flex}.turn-line>span:first-child{color:var(--team)}.turn-line .clue-tag{font-size:1.15rem}.turn-line small{width:100%;color:var(--muted);font-weight:500}.turn-line .timer{width:100%}.clue-form{flex-direction:column;gap:.75rem;display:flex}.clue-form .timer{width:100%}.clue-input{text-transform:uppercase;text-align:center;font-family:var(--display)!important;background:var(--paper)!important;color:var(--ink)!important;font-size:1.6rem!important;font-weight:900!important}.counts{grid-template-columns:repeat(6,1fr);gap:.35rem;display:grid}.counts button{font:700 1.1rem var(--mono);color:var(--text);border:1px solid var(--panel-border);cursor:pointer;background:#efe5cc12;border-radius:.4rem;padding:.5em 0}.counts button.on{background:var(--team);color:#fff;border-color:#0000}.action-bar{background:color-mix(in srgb, var(--bg) 85%, transparent);-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);border:1px solid var(--panel-border);border-radius:.8rem;grid-template-columns:auto 1fr;gap:.5rem;padding:.5rem;display:grid;position:sticky;bottom:.75rem}.action-bar .btn.primary{text-overflow:ellipsis;overflow:hidden}
