@font-face{font-family:Bungee;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/bungee-vietnamese-400-normal-B6gKbkHm.woff2) format("woff2"),url(/assets/bungee-vietnamese-400-normal-CmjDSWyd.woff) format("woff");unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB}@font-face{font-family:Bungee;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/bungee-latin-ext-400-normal-DWzJMwsA.woff2) format("woff2"),url(/assets/bungee-latin-ext-400-normal-DXe9_7Rr.woff) format("woff");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Bungee;font-style:normal;font-display:swap;font-weight:400;src:url(/assets/bungee-latin-400-normal-Dfnurram.woff2) format("woff2"),url(/assets/bungee-latin-400-normal-DA8IEVW_.woff) format("woff");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}@font-face{font-family:Outfit Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/outfit-latin-ext-wght-normal-DdQaqQDo.woff2) format("woff2-variations");unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}@font-face{font-family:Outfit Variable;font-style:normal;font-display:swap;font-weight:100 900;src:url(/assets/outfit-latin-wght-normal-Bc-8i84L.woff2) format("woff2-variations");unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}:root{--ink: #1c1433;--ink-soft: #6b5a8e;--cream: #fff7e6;--cream-2: #f3e8d2;--night: #140d2b;--coral: #ff4d6d;--coral-lip: #b8304a;--gold: #ffd23f;--gold-lip: #c99a12;--mint: #2ee6a6;--green: #17b890;--green-lip: #0d7d60;--violet: #6c5ce7;--violet-lip: #4535b0;--plum: #2a1d4a;--plum-lip: #170f2e;--display: "Bungee", "Arial Black", sans-serif;--body: "Outfit Variable", "Outfit", system-ui, sans-serif;color-scheme:dark}*{box-sizing:border-box}html,body,#app{height:100%;margin:0}body{background:radial-gradient(rgba(255,255,255,.06) 1px,transparent 1.5px) 0 0 / 22px 22px,radial-gradient(ellipse at 15% 0%,#3a1a78 0%,transparent 55%),radial-gradient(ellipse at 90% 30%,#4a1a40 0%,transparent 50%),linear-gradient(160deg,#24124f,#151a3d 70%);background-attachment:fixed;color:var(--cream);font-family:var(--body);font-weight:500;-webkit-tap-highlight-color:transparent;overscroll-behavior:none}button,input{font:inherit}h1,h2,p{margin:0}.screen{min-height:100%;padding:max(16px,env(safe-area-inset-top)) max(16px,env(safe-area-inset-right)) max(16px,env(safe-area-inset-bottom)) max(16px,env(safe-area-inset-left))}.center{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;text-align:center}.row{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;width:100%}.row.small{gap:8px}.grow{flex:1}.logo{font-family:var(--display);font-weight:400;color:var(--cream);line-height:.92;display:flex;flex-direction:column;align-items:center;font-size:clamp(40px,11vw,72px);text-shadow:3px 3px 0 var(--coral),6px 6px 0 var(--violet);transform:rotate(-3deg);letter-spacing:.01em}.logo-mid{font-size:.38em;color:var(--gold);text-shadow:2px 2px 0 var(--coral-lip);margin:4px 0}.logo-small{font-size:clamp(26px,6vw,38px);flex-direction:row;gap:.25em;align-items:baseline}.logo-small .logo-mid{margin:0}.tagline{color:#c9b8ee;font-weight:600;max-width:36ch}.card{position:relative;background:var(--cream);color:var(--ink);border-radius:22px;border-top:10px solid var(--slab, var(--coral));box-shadow:0 10px 0 var(--slab-lip, var(--coral-lip)),0 18px 30px #00000059;padding:18px 20px 20px;display:flex;flex-direction:column;gap:14px;width:min(100%,380px);margin-bottom:10px}.card-coral{--slab: var(--coral);--slab-lip: var(--coral-lip)}.card-violet{--slab: var(--violet);--slab-lip: var(--violet-lip)}.card-mint{--slab: var(--mint);--slab-lip: var(--green-lip)}.card-title{font-family:var(--display);font-size:18px;color:var(--ink);text-align:left}.eyebrow{font-weight:800;text-transform:uppercase;letter-spacing:.12em;font-size:12px;color:var(--ink-soft)}.fine{font-size:13px;color:var(--ink-soft);font-weight:600}.big-name{font-family:var(--display);font-weight:400;font-size:clamp(26px,5vw,36px);line-height:1;color:var(--ink);text-transform:uppercase}.pill{display:inline-block;border-radius:10px;padding:6px 12px;font-weight:800;font-size:14px}.pill-gold{background:var(--gold);color:var(--ink);box-shadow:0 3px 0 var(--gold-lip)}.pill-coral{background:var(--coral);color:#fff}.btn{--bg: var(--coral);--lip: var(--coral-lip);--fg: white;border:0;border-radius:14px;padding:13px 22px;background:var(--bg);color:var(--fg);font-family:var(--display);font-size:16px;letter-spacing:.02em;box-shadow:0 5px 0 var(--lip);cursor:pointer;transition:transform 80ms,box-shadow 80ms,filter .12s;touch-action:manipulation}.btn:hover:not(:disabled){filter:brightness(1.06)}.btn:active:not(:disabled){transform:translateY(4px);box-shadow:0 1px 0 var(--lip)}.btn:disabled{--bg: #cfc4b0;--lip: #a89c86;--fg: #7d7262;cursor:default}.btn-green{--bg: var(--green);--lip: var(--green-lip)}.btn-violet{--bg: var(--violet);--lip: var(--violet-lip)}.btn-gold{--bg: var(--gold);--lip: var(--gold-lip);--fg: var(--ink)}.btn-small{padding:8px 12px;font-size:13px;box-shadow:0 4px 0 var(--lip)}.btn-round{width:44px;height:44px;padding:0;font-size:22px;line-height:1}.link{background:none;border:0;color:#c9b8ee;text-decoration:underline;padding:6px;cursor:pointer;font-weight:600}.join input{text-align:center;font-family:var(--display);font-size:40px;letter-spacing:.25em;padding:8px 8px 8px calc(8px + .25em);border-radius:14px;border:3px solid var(--cream-2);background:#fff;color:var(--ink);text-transform:uppercase;box-shadow:inset 0 3px 0 var(--cream-2)}.join input::placeholder{color:#e2d6c0}.join input:focus{outline:none;border-color:var(--coral)}.stepper{display:flex;align-items:center;gap:12px}.stepper-label{flex:1;text-align:left;font-weight:800;font-size:17px}.stepper-value{min-width:2ch;font-family:var(--display);font-size:26px;text-align:center}.character-card{align-items:center;text-align:center}.avatar{position:relative;flex-shrink:0;display:inline-flex;align-items:center;justify-content:center}.token{width:100%;height:100%;border-radius:50%;display:flex;align-items:center;justify-content:center;border:4px solid white;box-shadow:0 5px #1c143359;line-height:1}.ring{position:absolute;bottom:-12%;left:8%;width:84%;height:24%;border:4px solid var(--coral);border-radius:50%;z-index:-1}.chevron{position:absolute;top:-24px;width:0;height:0;border-left:10px solid transparent;border-right:10px solid transparent;border-top:14px solid var(--coral);animation:bob 1.2s ease-in-out infinite}@keyframes bob{50%{transform:translateY(-5px)}}.avatar .token{animation:idle 2.6s ease-in-out infinite}@keyframes idle{50%{transform:translateY(-3px) scale(1.02,.98)}}.anim-wave .token{animation:wave .9s ease-in-out}.anim-jump .token{animation:jump .6s cubic-bezier(.3,0,.4,1)}.anim-spin .token{animation:spin .8s ease-in-out}@keyframes wave{25%{transform:rotate(-16deg)}50%{transform:rotate(14deg)}75%{transform:rotate(-8deg)}}@keyframes jump{40%{transform:translateY(-32px) scale(1.05,.95)}80%{transform:translateY(0) scale(1.1,.88)}}@keyframes spin{to{transform:rotate(360deg)}}.lobby{display:grid;grid-template-columns:1fr 1fr;gap:20px;align-items:center;justify-items:center}.lobby-me{align-items:center;text-align:center;padding-top:30px}.lobby-room{display:flex;flex-direction:column;align-items:center;gap:12px;width:min(100%,380px)}.code-block{display:flex;align-items:center;gap:14px}.code-tiles{display:flex;gap:6px}.tile{font-family:var(--display);font-size:30px;width:46px;height:54px;display:flex;align-items:center;justify-content:center;background:var(--cream);color:var(--ink);border-radius:12px;box-shadow:0 5px 0 var(--gold-lip);border-top:5px solid var(--gold)}.tile:nth-child(2n){transform:rotate(3deg)}.tile:nth-child(odd){transform:rotate(-2deg)}.qr{width:84px;height:84px;border-radius:12px;border:4px solid var(--cream)}.scoreboard{display:grid;grid-template-columns:1fr 1fr;gap:10px;width:100%}.score{background:#140d2bbf;border-radius:16px;padding:8px 14px;text-align:left;border-bottom:4px solid var(--c);display:flex;flex-direction:column}.score-mint{--c: var(--mint)}.score-coral{--c: var(--coral)}.score-label{font-size:13px;font-weight:700;color:#c9b8ee}.score-value{font-family:var(--display);font-size:30px;color:var(--c);line-height:1.1}.score-value small{font-size:.55em;color:#c9b8ee}.host{gap:10px;padding:12px 16px 16px}.game-start{display:grid;grid-template-columns:3fr 2fr;gap:20px;align-items:center}.section-title{font-family:var(--display);font-weight:400;font-size:24px;margin-bottom:12px;text-shadow:2px 2px 0 var(--coral)}.cast-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:10px}.cast-grid li{display:flex;gap:10px;align-items:center;background:var(--cream);color:var(--ink);border-radius:14px;padding:8px 10px;box-shadow:0 4px 0 var(--cream-2)}.cast-grid li.me{box-shadow:0 4px 0 var(--coral-lip);outline:3px solid var(--coral)}.cast-grid li div{display:flex;flex-direction:column}.cast-grid li strong{font-family:var(--display);font-weight:400;font-size:15px;text-transform:uppercase}.cast-grid li span{color:var(--ink-soft);font-size:12px;font-weight:600}.role-area{display:flex;flex-direction:column;align-items:center;gap:14px;text-align:center}.role-card{width:min(100%,250px);aspect-ratio:3 / 4;border-radius:22px;background:repeating-linear-gradient(45deg,rgba(255,255,255,.07) 0 12px,transparent 12px 24px),var(--violet);border:6px solid var(--cream);box-shadow:0 10px 0 var(--violet-lip),0 18px 30px #0006;color:var(--cream);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:18px;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;touch-action:none;cursor:pointer;transition:transform .12s}.role-card:active{transform:translateY(4px) scale(.99)}.role-q{font-family:var(--display);font-size:84px;line-height:1;text-shadow:4px 4px 0 var(--coral)}.role-hold{font-family:var(--display);font-size:15px}.role-card.shown.mafia{background:var(--coral);box-shadow:0 10px 0 var(--coral-lip)}.role-card.shown.innocent{background:var(--green);box-shadow:0 10px 0 var(--green-lip)}.role-name{font-family:var(--display);font-size:34px;text-shadow:3px 3px 0 rgba(0,0,0,.25)}.role-goal{font-size:15px;font-weight:700}.banner,.toast{position:fixed;left:50%;transform:translate(-50%);padding:10px 18px;border-radius:14px;z-index:10;max-width:calc(100% - 32px);font-weight:800}.banner{top:12px;background:var(--gold);color:var(--ink);box-shadow:0 4px 0 var(--gold-lip)}.toast{bottom:18px;background:var(--coral);color:#fff;box-shadow:0 4px 0 var(--coral-lip)}.rotate{display:none}@media(orientation:portrait)and (pointer:coarse){.rotate{display:flex;position:fixed;inset:0;z-index:20;background:var(--night);align-items:center;justify-content:center;font-family:var(--display);font-size:22px;padding:24px;text-align:center}}@media(max-height:480px){.center{gap:12px}.lobby{gap:14px}.lobby-me{gap:10px;padding:26px 16px 16px}.lobby-room{gap:8px}.tile{width:38px;height:44px;font-size:24px}.qr{width:66px;height:66px}.score{padding:4px 12px}.score-value{font-size:24px}.host{gap:6px;padding:8px 14px 12px}.btn-round{width:36px;height:36px;font-size:18px}.host .btn-green{padding:10px 18px}.stepper-value{font-size:22px}.link{padding:0}.role-q{font-size:64px}}@media(max-width:600px)and (orientation:portrait){.lobby,.game-start{grid-template-columns:1fr}}.animal-token{width:96px;height:96px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:52px;border:4px solid white;box-shadow:0 5px #1c143359}.tap{display:flex;flex-direction:column;gap:10px;height:100%;padding-bottom:max(12px,env(safe-area-inset-bottom))}.tap-board{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.tap-chip{background:var(--cream);color:var(--ink);border-radius:14px;border-bottom:5px solid var(--c);padding:4px 10px;display:flex;align-items:center;gap:8px}.tap-chip.me{outline:3px solid var(--c)}.tap-emoji{font-size:22px}.tap-count{font-family:var(--display);font-size:18px}.tap-arena{flex:1;position:relative;overflow:hidden;border-radius:22px;background:#fff7e612;border:4px dashed var(--c);touch-action:manipulation;user-select:none;-webkit-user-select:none;cursor:pointer}.tap-hint{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:var(--display);font-size:clamp(22px,5vw,36px);color:#fff7e666;pointer-events:none;text-align:center}.tap-hint small{font-family:var(--body);font-size:15px;font-weight:700}.burst{position:absolute;font-size:40px;line-height:1;transform:translate(-50%,-50%);pointer-events:none;animation:burst-up 1.1s ease-out forwards}.burst i{position:absolute;left:50%;top:50%;width:20px;height:20px;margin:-10px;border-radius:50%;border:4px solid var(--c);animation:burst-ring .7s ease-out forwards}@keyframes burst-up{0%{transform:translate(-50%,-50%) scale(.3);opacity:1}25%{transform:translate(-50%,-80%) scale(1.3)}to{transform:translate(-50%,-190%) scale(1);opacity:0}}@keyframes burst-ring{to{transform:scale(7);opacity:0}}.manor{user-select:none;-webkit-user-select:none;position:fixed;inset:0;background:var(--night);touch-action:none}.manor svg{width:100%;height:100%;display:block}.manor .roof-name{font:400 3px var(--display);fill:#8b78c9;opacity:.7}.manor .floor-name{font:400 2px var(--display);fill:#9a8a6a;opacity:.8}.manor .person{font-size:2.7px}.manor .exit{cursor:pointer}.manor .exit circle{fill:var(--gold);stroke:var(--gold-lip);stroke-width:.5}.manor .exit text{font:400 3.3px var(--display);fill:var(--ink)}.manor .hud{position:absolute;left:12px;top:8px;display:flex;gap:10px;align-items:center;pointer-events:none}.manor .hud-zone{font-family:var(--display);color:var(--cream);text-shadow:2px 2px 0 var(--coral);font-size:20px}.manor .hud-note{color:var(--cream-2);font-weight:600}.manor .role-peek{position:absolute;right:12px;top:8px;font-family:var(--display);font-size:14px;padding:8px 12px;border-radius:12px;border:0;background:var(--plum);color:var(--cream);box-shadow:0 4px 0 var(--plum-lip);user-select:none;-webkit-user-select:none}.manor .role-peek.innocent{background:var(--green);box-shadow:0 4px 0 var(--green-lip)}.manor .role-peek.mafia{background:var(--coral);box-shadow:0 4px 0 var(--coral-lip)}.game-menu{position:fixed;right:12px;bottom:10px;display:flex;gap:8px;z-index:5}.menu-btn{font-family:var(--display);font-size:12px;padding:7px 10px;border-radius:10px;border:0;background:var(--plum);color:var(--cream);box-shadow:0 3px 0 var(--plum-lip)}.menu-btn.danger{background:var(--coral);box-shadow:0 3px 0 var(--coral-lip)}.menu-btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--plum-lip)}.manor .hud-top{position:absolute;top:8px;left:50%;transform:translate(-50%);display:flex;flex-direction:column;align-items:center;gap:6px;pointer-events:none}.manor .counters{display:flex;gap:12px;font-weight:700;font-size:13px;color:var(--cream);background:#140d2bb3;padding:3px 12px;border-radius:999px}.manor .stay{position:relative;width:170px;height:22px;border-radius:999px;background:#140d2bbf;overflow:hidden;border:2px solid var(--plum-lip)}.manor .stay-bar{position:absolute;inset:0 auto 0 0;background:var(--green);transition:width .25s linear}.manor .stay.warn .stay-bar{background:var(--coral)}.manor .stay.warn{animation:pulse .5s infinite alternate}.manor .stay span{position:relative;display:block;text-align:center;font-family:var(--display);font-size:13px;line-height:18px;color:var(--cream)}.manor .ghost-pill{font-weight:700;font-size:13px;color:var(--cream);background:#6c5ce7d9;padding:3px 12px;border-radius:999px}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.06)}}.manor .announce,.manor .notice{position:absolute;top:76px;left:50%;transform:translate(-50%);padding:8px 16px;border-radius:14px;font-weight:700;color:var(--cream);background:var(--plum);box-shadow:0 4px 0 var(--plum-lip);pointer-events:none;text-align:center;max-width:80%}.manor .announce{background:var(--coral);box-shadow:0 4px 0 var(--coral-lip)}.manor .announce .face{font-size:22px;margin-right:6px}.manor .announce:not(.revealed) .face{animation:pulse .4s infinite alternate}.manor .notice{top:120px;background:var(--violet);box-shadow:0 4px 0 var(--violet-lip)}.manor .attack-btn{position:absolute;left:50%;bottom:14px;transform:translate(-50%);font-family:var(--display);font-size:16px;padding:10px 20px;border:0;border-radius:14px;color:var(--cream);background:var(--coral);box-shadow:0 5px 0 var(--coral-lip)}.manor .attack-btn:disabled{background:var(--plum);box-shadow:0 5px 0 var(--plum-lip);opacity:.9}.btn-coral{--bg: var(--coral);--lip: var(--coral-lip)}.btn-plum{--bg: var(--plum);--lip: var(--plum-lip)}.manor .meeting{position:absolute;left:50%;bottom:8px;transform:translate(-50%);width:min(94%,760px);max-height:62%;overflow:auto;padding:10px 14px 12px;border-radius:18px;background:var(--cream);color:var(--ink);box-shadow:0 6px 0 var(--cream-2),0 0 0 4px var(--ink);z-index:4}.manor .meeting header{display:flex;align-items:baseline;gap:14px}.manor .meeting .section-title{margin:0 0 6px;font-size:20px;color:var(--ink)}.manor .meeting-time{font-family:var(--display);font-size:22px;color:var(--coral)}.manor .meeting-count{margin-left:auto;font-weight:700;color:var(--ink-soft)}.manor .meeting-note{margin:4px 0;font-weight:600}.manor .candidates{display:flex;flex-wrap:wrap;gap:6px}.manor .chip{font:700 14px var(--body);padding:8px 10px;border-radius:12px;border:2px solid var(--ink);background:#fff;color:var(--ink)}.manor .chip.on{background:var(--gold);box-shadow:0 0 0 2px var(--coral)}.manor .vote-actions{display:flex;gap:10px;margin-top:8px}.manor .vote-actions .btn{padding:9px 18px;font-size:14px}.manor .tally{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 18px}.manor .tally li{display:flex;gap:8px;font-weight:700}.manor .roles{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:4px 12px;font-weight:700}.manor .roles .mafia{color:var(--coral-lip)}.manor .pacing{display:flex;gap:8px;font-weight:700;font-size:12px;color:var(--cream)}.manor .pacing span{background:#140d2bb3;padding:2px 10px;border-radius:999px}.manor .pacing .nokill{background:var(--violet)}.manor .prop{font-size:4px;opacity:.9;pointer-events:none}.manor .hotspot{cursor:pointer}.manor .hotspot circle{fill:#1c14338c;stroke:#f6c770;stroke-width:.35;stroke-dasharray:1 .8}.manor .hotspot text{font-size:3px}