@layer game {
:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;--bg:#000;--surface:#111;--ink:#e8e8e6;--muted:#a4a4a4;--line:#333;--accent:#858585}*{box-sizing:border-box}body{background:var(--bg);color:var(--ink);margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;line-height:1.5}main{max-width:600px;margin:0 auto;padding:24px 18px 64px}header{justify-content:space-between;align-items:center;gap:16px;margin-bottom:28px;display:flex}h1{letter-spacing:-.5px;margin:0;font-size:28px}h2{margin:0 0 14px;font-size:21px}h3{margin:0 0 10px;font-size:17px}p{margin:10px 0}.muted,small{color:var(--muted)}small{font-size:13px}.card{background:var(--surface);corner-shape:squircle;border:0;border-radius:22px;margin:14px 0;padding:20px}main.game-playing{position:relative}main.game-day,main.game-compact.game-day,main.game-finished,main.game-compact.game-finished{padding:0}.game-finished>.card,.game-finished>.compact-status,.game-finished>.error,.game-day>.card,.game-day>.wide,.game-day>.compact-status,.game-day>.error{margin-left:24px;margin-right:24px}.game-day>.wide{width:calc(100% - 48px)}.gameplay-screen{min-height:100dvh}.game-playing .private-card,.game-playing .center-stage{width:min(560px,100vw - 36px);margin:0;position:absolute;top:50dvh;left:50%;transform:translate(-50%,-50%)}main.game-status-only,main.game-compact.game-status-only{max-width:none;padding:0}.player-status-screen{text-align:center;place-items:center;min-height:100dvh;display:grid}.player-status-screen h1{color:var(--ink);margin:0}.player-status-screen{animation:.22s cubic-bezier(.23,1,.32,1) both status-arrive}@keyframes status-arrive{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.player-status-screen{animation:none}}.game-status-only>:not(.player-status-screen){max-width:600px;margin-left:auto;margin-right:auto}label{margin:14px 0 6px;font-weight:600;display:block}input:not([type=checkbox]),select{width:100%;font:inherit;corner-shape:squircle;color:var(--ink);background:#191919;border:1px solid #404040;border-radius:15px;padding:13px;font-size:16px}input::placeholder{color:var(--muted)}button{cursor:pointer;touch-action:manipulation;min-height:48px;font:inherit;corner-shape:squircle;color:#f2f2f0;background-color:#4a4a4a;background-image:linear-gradient(#ffffff0d,#00000025),url(/textures/stone-button.webp);background-size:cover,256px 256px;border:0;border-radius:18px;padding:12px 16px;font-weight:600;box-shadow:inset 0 1px #ffffff20,0 2px 8px #0005}button:disabled{opacity:.48;cursor:default}button.secondary{color:var(--ink);background-color:#282828;background-image:linear-gradient(#171717b8,#171717b8),url(/textures/stone-button.webp)}button:focus-visible,input:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #b8b8b8}.wide{width:100%;margin-top:12px}.row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.row>button{flex:1}.check{align-items:center;gap:12px;margin:0;padding:10px 0;display:flex}input[type=checkbox]{width:23px;height:23px;accent-color:var(--accent)}.setting-row{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;gap:16px;min-height:60px;margin:0;padding:8px 0;font-weight:600;display:flex}.setting-row input[type=checkbox]{flex:none;margin:0}.setting-stepper{align-items:center;gap:6px;display:flex}.setting-stepper button{border-radius:12px;place-items:center;width:36px;height:36px;min-height:36px;padding:0;font-size:23px;line-height:1;display:grid}.setting-stepper output{text-align:center;font-variant-numeric:tabular-nums;min-width:24px}ul{margin:0;padding:0;list-style:none}li.player{border-bottom:1px solid var(--line);justify-content:space-between;gap:8px;padding:12px 0;display:flex}li:last-child{border-bottom:0}.badge{background:#272727;border-radius:20px;padding:4px 8px;font-size:12px;display:inline-block}.status{text-align:right;font-size:12px}.dot{background:#b8b8b8;border-radius:50%;width:7px;height:7px;margin-right:5px;display:inline-block}.dot.offline{background:#bb8130}.error{color:#f4c3bc;corner-shape:squircle;background:#2d1c1b;border:0;border-radius:16px;margin:14px 0;padding:12px}.notice{corner-shape:squircle;background:#222;border:0;border-radius:16px;margin:14px 0;padding:14px}.lobby-settings,.lobby-reset .notice,.card[aria-label=Narator]{animation:.22s cubic-bezier(.23,1,.32,1) both panel-arrive}@keyframes panel-arrive{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.lobby-settings,.lobby-reset .notice,.card[aria-label=Narator]{animation:none}}.code{letter-spacing:5px;margin:4px 0;font-size:34px;font-weight:700}.qr{width:100%;height:auto;margin:0;display:block}a{color:#d1d1d1;word-break:break-all}.private-card{margin:20px 0}.secret-panel{corner-shape:squircle;background:0 0;border:0;border-radius:22px;width:100%;padding:16px}button.secret-cover{box-shadow:none;color:var(--ink);text-align:center;-webkit-user-select:none;user-select:none;background:0 0;flex-direction:column;justify-content:center;align-items:center;display:flex;position:relative}.role-reveal-card{position:relative}.role-reveal-card .role-reveal-content{flex-direction:column;justify-content:center;align-items:center;min-height:min(400px,48dvh);display:flex}.role-reveal-card .secret-role{animation:none}.role-reveal-card .role-art{opacity:0;transform:translateY(42px)scale(.3)}.role-reveal-card.role-opening .role-art{opacity:1;animation:.5s cubic-bezier(.22,.8,.25,1) both role-uncover}.role-reveal-card.role-open .role-art{opacity:1;transform:none}@keyframes role-uncover{0%{transform:translateY(42px)scale(.3)}to{transform:translateY(0)scale(1)}}.role-reveal-card:not(.role-open) .secret-role h3,.role-reveal-card:not(.role-open) .role-reveal-content>button{opacity:0}.role-reveal-card.role-open .secret-role h3,.role-reveal-card.role-open .role-reveal-content>button{animation:.22s cubic-bezier(.23,1,.32,1) both role-title-appear}.role-reveal-card button.secret-cover{z-index:2;width:100%;height:100%;position:absolute;inset:0}@media (prefers-reduced-motion:reduce){.role-reveal-card.role-opening .role-art,.role-reveal-card.role-open .secret-role h3,.role-reveal-card.role-open .role-reveal-content>button{animation:none}}button.secret-cover:disabled{opacity:1}.secret{overscroll-behavior:contain;max-height:70dvh;position:relative;overflow-y:auto}.game-playing .private-card:not(.private-action-screen) .secret-panel{flex-direction:column;justify-content:center;align-items:center;min-height:min(400px,48dvh);display:flex}button.secret-cover,.secret-loading{height:min(400px,48dvh)}.secret-role{text-align:center;flex-direction:column;justify-content:center;align-items:center;gap:0;padding:10px 0 8px;display:flex}.secret-role,.secret-action{animation:.24s cubic-bezier(.23,1,.32,1) both role-appear}@keyframes role-appear{0%{opacity:0;transform:translateY(12px)scale(.98)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes role-title-appear{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@media (prefers-reduced-motion:reduce){.secret-role,.secret-action{animation:none}}.role-art{flex:none;width:min(260px,30dvh,70vw);height:auto;display:block}.secret-role h3{margin:0;font-size:28px;line-height:1.2}.secret-action{margin:12px 0}.voting-panel{overscroll-behavior:contain;max-height:70dvh;padding:8px 0;overflow-y:auto}.vote-options{gap:8px;display:grid}button.vote-option{text-align:left;width:100%;min-height:52px;box-shadow:none;background:#242424;font-weight:500}button.vote-option[aria-pressed=true]{background-color:#646464;background-image:linear-gradient(#ffffff0d,#00000025),url(/textures/stone-button.webp);box-shadow:inset 0 1px #ffffff30}button.vote-option:disabled{opacity:1}button.vote-option.self{color:var(--muted)}.progress{background:#292929;border-radius:9px;height:8px;margin:12px 0;overflow:hidden}.progress div{background:#aaa;height:100%}.hero{margin:44px 0 26px}.hero h2{font-size:30px}.hero p{max-width:40ch}.player-controls{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:8px;display:flex}.player-controls button{padding:8px 12px}.lobby-cards{gap:12px;display:grid}.lobby-cards .card{margin:0}.lobby-card-heading{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px;display:flex}.lobby-card-heading h2{margin:0}button.remove-player-button{width:38px;height:38px;min-height:38px;color:var(--muted);box-shadow:none;background:#222;border-radius:12px;flex:none;place-items:center;padding:0;display:grid}.remove-player-button svg{width:17px;height:17px}button.remove-player-button:hover:not(:disabled){color:var(--ink);background:#303030}.lobby-reset{justify-content:flex-end;margin-top:8px;display:flex}.lobby-reset .notice{width:100%}button.lobby-reset-trigger{min-height:36px;box-shadow:none;color:var(--muted);background:0 0;padding:6px 4px;font-size:13px;font-weight:500}button.lobby-reset-trigger:hover:not(:disabled){color:var(--ink)}main.test-table{width:100%;max-width:none}.test-table>header{flex-wrap:wrap}.test-actions{flex-wrap:wrap;align-items:center;gap:16px;display:flex}.test-reset{border-radius:12px;min-height:38px;padding:7px 12px;font-size:14px}.test-grid{grid-template-columns:repeat(auto-fit,minmax(min(100%,360px),1fr));place-items:start center;gap:16px;display:grid}.test-player{width:100%;min-width:0;max-width:393px}.test-player h2{margin:0;padding:0 4px 8px;font-size:17px}.test-phone{aspect-ratio:393/852;background:var(--bg);corner-shape:squircle;border:5px solid #303030;border-radius:36px;width:100%;overflow:hidden;box-shadow:0 8px 24px #0008}.test-phone>p{padding:16px}.test-phone iframe{border:0;width:100%;height:100%;display:block}.share-toolbar{justify-content:space-between;align-items:center;gap:12px;display:flex}.lobby-share{padding:0;overflow:hidden}.lobby-share .share-toolbar{padding:20px max(0px,6% - 10px) 0 6%}.share-toolbar .code{letter-spacing:2px;white-space:nowrap;font-size:clamp(21px,7vw,34px)}.share-actions{gap:8px;display:flex}button.icon-button{width:42px;min-width:42px;height:42px;min-height:42px;color:var(--muted);box-shadow:none;background:0 0;border-radius:14px;justify-content:center;align-items:center;padding:9px;display:inline-flex}.icon-button svg{width:21px;height:21px}button.icon-button:hover:not(:disabled){color:var(--ink);background:0 0}button.narrator-manual{width:100%;min-height:38px;box-shadow:none;color:var(--muted);background:0 0;margin-top:8px;padding:6px;font-size:14px;font-weight:500;display:block}button.narrator-manual:hover:not(:disabled){color:var(--ink)}.invite-intro{margin:22px 0 12px}.guest-entry-hint{color:var(--muted);text-align:center;font-size:13px;line-height:1.6}.guest-join-prompt{flex-wrap:wrap;justify-content:center;align-items:center;gap:0 12px;margin-bottom:8px;display:flex}.guest-join-prompt p{color:var(--muted);margin:0;font-size:12px}.guest-join-prompt button{min-height:44px;box-shadow:none;color:#d8c3a6;text-shadow:none;-webkit-text-fill-color:currentColor;background:0 0;border-radius:6px;padding:6px 4px;font-size:12px;font-weight:500}.compact-status{color:#deb982;margin-bottom:8px;font-size:12px}main.game-compact{padding:10px 10px 28px}.game-compact .card{margin:0 0 12px;padding:14px}.game-compact .lobby-cards .card{margin:0}.game-compact .lobby-share{padding:0}.game-compact .lobby-share .share-toolbar{padding-top:14px}.game-compact .hero{margin:10px 0 14px}.game-compact .invite-intro{margin:8px 0 10px}.game-compact .share-toolbar .code{letter-spacing:1px;font-size:24px}@media (min-width:1800px){.test-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}}
}

@layer game {
button:not(.secret-cover):not(.secret-close):not(.icon-button):not(.remove-player-button):not(.lobby-reset-trigger):not(.vote-option),button.vote-option[aria-pressed=true]{-webkit-text-fill-color:color-mix(in srgb, currentColor 88%, transparent);text-shadow:0 -1px 1px #00000094,0 1px #ffffff29}
}

@layer game {
main.guest-lobby,main.game-compact.guest-lobby{min-height:100dvh;padding:24px 24px calc(116px + env(safe-area-inset-bottom,0px))}.guest-lobby .lobby-players{margin-top:24px}.guest-lobby-ready,.invite-confirm{z-index:2;width:min(600px,100%);padding:20px 24px calc(24px + env(safe-area-inset-bottom,0px));background:linear-gradient(transparent, var(--bg) 20px);position:fixed;bottom:0;left:50%;transform:translate(-50%)}.guest-lobby-ready .wide,.invite-confirm .wide{margin-top:0}
}

@layer game {
main.invite-screen,main.game-compact.invite-screen{min-height:100dvh;padding:24px 24px calc(116px + env(safe-area-inset-bottom,0px));flex-direction:column;display:flex}.invite-screen .invite-intro{text-align:center;margin:8px 0 24px}.invite-screen .invite-intro h2{margin:0}button.setup-back{min-height:44px;box-shadow:none;color:var(--muted);-webkit-text-fill-color:currentColor;text-shadow:none;background:0 0;align-self:flex-start;align-items:center;gap:4px;margin-bottom:8px;padding:8px 0;display:inline-flex}.setup-back svg{width:20px;height:20px}.setup-room-code{font-variant-numeric:tabular-nums;letter-spacing:1px}.invite-form{flex-direction:column;flex:1;display:flex}.invite-name{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:24px;padding:24px 0;display:flex}.invite-name-label{clip-path:inset(50%);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.invite-name .invite-placeholder{object-fit:contain;pointer-events:none;flex:none;width:160px;height:160px}.invite-name input{min-height:72px;box-shadow:none;text-align:center;background:0 0;border:0;border-radius:0;padding:20px;font-size:24px}.invite-name input:focus-visible{box-shadow:0 1px 0 var(--line);outline:none}main.join-reveal-screen,main.game-compact.join-reveal-screen{place-items:center;min-height:100dvh;padding:0;display:grid}.join-reveal{place-items:center;width:100%;min-height:100dvh;display:grid}.join-reveal .invite-placeholder{object-fit:contain;width:160px;height:160px;display:block}.join-reveal .invite-placeholder.invite-placeholder-open{aspect-ratio:5/3;width:min(100vw,400px);height:auto}.lobby-arriving .lobby-cards>:not(.guest-lobby-ready){animation:.38s cubic-bezier(.23,1,.32,1) both lobby-arrive}.lobby-arriving .lobby-cards>:nth-child(2){animation-delay:65ms}.lobby-arriving .lobby-cards>:nth-child(3){animation-delay:.11s}.lobby-arriving .guest-lobby-ready{animation:.26s ease-out .12s both lobby-fade}@keyframes lobby-arrive{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes lobby-fade{0%{opacity:0}to{opacity:1}}@media (prefers-reduced-motion:reduce){.lobby-arriving .lobby-cards>:not(.guest-lobby-ready),.lobby-arriving .guest-lobby-ready{animation:none}}@media (max-height:600px){.invite-name{gap:16px;padding:16px 0}.invite-name .invite-placeholder,.join-reveal .invite-placeholder{width:96px;height:96px}.join-reveal .invite-placeholder.invite-placeholder-open{width:min(100vw,240px);height:auto}}
}

@layer game {
main.entry-screen,main.game-compact.entry-screen{min-height:100svh;padding:24px 24px calc(24px + env(safe-area-inset-bottom,0px));flex-direction:column;display:flex}.entry-art{flex-direction:column;flex:1;justify-content:center;align-items:center;gap:12px;padding:24px 0;display:flex}.entry-title{color:#f2f2f0;letter-spacing:.1em;text-indent:.1em;text-align:center;margin:0;font-size:clamp(26px,7vw,44px);font-weight:800;line-height:1.1}.entry-art img{object-fit:contain;width:100%;height:auto;max-height:40dvh;display:block}.entry-actions{gap:12px;display:grid}@media (prefers-reduced-motion:no-preference){.onboarding-return{animation:.32s cubic-bezier(.23,1,.32,1) both onboarding-home-arrive}}@keyframes onboarding-home-arrive{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}.entry-actions button{min-height:52px}.room-heading{align-items:center;gap:4px;min-width:0;display:flex}.room-heading h1{font-size:clamp(20px,5vw,28px)}button.room-home{width:44px;min-height:44px;box-shadow:none;color:var(--muted);background:0 0;flex:none;place-items:center;margin-left:-8px;padding:8px;display:grid}.room-home svg{width:24px;height:24px}.entry-actions button,button.setup-back,.invite-confirm button{transition:transform .14s cubic-bezier(.23,1,.32,1)}@media (prefers-reduced-motion:no-preference){.entry-actions button:active:not(:disabled):not(:focus-visible),button.setup-back:active:not(:disabled):not(:focus-visible),.invite-confirm button:active:not(:disabled):not(:focus-visible){transform:scale(.97)}}@media (prefers-reduced-motion:reduce){.entry-actions button,button.setup-back,.invite-confirm button{transition:none;transform:none}}
}

@layer game {
.game-playing .private-card.private-action-screen{z-index:10;background:var(--bg);width:min(600px,100%);height:100dvh;margin:0;position:fixed;inset:0 auto 0 50%;transform:translate(-50%)}.private-action-screen .secret-target-panel{border-radius:0;height:100%;max-height:none;padding:0;overflow:hidden}.private-action-screen .secret-target-panel:has(.investigation-result){flex-direction:column;justify-content:center;align-items:center;padding:24px;display:flex}.investigation-result{text-align:center;width:100%;max-width:440px;animation:.23s cubic-bezier(.23,1,.32,1) both investigation-enter}.investigation-result-art{aspect-ratio:1;object-fit:contain;width:min(100%,400px,48dvh);height:auto;margin:0 auto;display:block}.investigation-result p{margin:4px 0 24px;font-size:clamp(23px,6vw,30px);line-height:1.25}@keyframes investigation-enter{0%{opacity:0;transform:translateY(14px)scale(.985)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.investigation-result{animation:none}}.night-action{flex-direction:column;height:100%;min-height:0;display:flex}.night-action-heading{padding:calc(24px + env(safe-area-inset-top,0px)) 24px 20px;text-align:center;flex:none}.night-action-role{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:4px;margin:0 0 12px;font-size:15px;display:flex}.night-action-role-art{flex:none;width:64px;height:64px;display:block}.night-action-heading h3{letter-spacing:-.5px;margin:0;font-size:clamp(24px,6.5vw,28px);line-height:1.2}.night-targets{overscroll-behavior:contain;border:0;flex-direction:column;flex:1;min-width:0;min-height:0;margin:0;padding:0 24px 16px;display:flex;overflow-y:auto}.night-targets:not(.dense) .night-target-item:first-of-type{margin-top:auto}.night-target-item{flex-shrink:0;min-width:0}.night-targets-legend,.night-target input[type=radio]{clip-path:inset(50%);border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.night-target{cursor:pointer;background:#111;border:1px solid #292929;border-radius:12px;justify-content:space-between;align-items:center;gap:10px;min-height:48px;margin:0 0 6px;padding:10px 14px;font-size:16px;font-weight:500;display:flex}.night-target>span:first-of-type{overflow-wrap:anywhere;min-width:0}.night-target.selected{background:#282828;border-color:#777}.night-target:has(input:focus-visible){outline-offset:2px;outline:3px solid #b8b8b8}.night-target:has(input:disabled){cursor:default}.night-target-check{border:1px solid #555;border-radius:50%;flex:none;place-items:center;width:20px;height:20px;display:grid}.night-target.selected .night-target-check{border-color:var(--ink);background:var(--ink);color:#111}.night-target-check svg{opacity:0;width:16px;height:16px}.night-target.selected .night-target-check svg{opacity:1}@media (prefers-reduced-motion:no-preference){.night-target-item{animation:.16s cubic-bezier(.23,1,.32,1) backwards night-target-enter;animation-delay:var(--target-delay,0s)}.night-action[data-selection-motion=pointer] .night-target{transition:background-color .16s,border-color .16s,transform .14s cubic-bezier(.23,1,.32,1)}.night-action[data-selection-motion=pointer] .night-target:active:not(:has(input:disabled)){transform:scale(.97)}.night-action[data-selection-motion=pointer] .night-target-check{transition:background-color .16s,border-color .16s}.night-action[data-selection-motion=pointer] .night-target-check svg{transition:opacity .12s,transform .18s cubic-bezier(.23,1,.32,1)}.night-target-check svg{transform:scale(.65)}.night-target.selected .night-target-check svg{transform:scale(1)}.night-action[data-selection-motion=pointer] .night-action-footer button{transition:transform .14s cubic-bezier(.23,1,.32,1)}.night-action[data-selection-motion=pointer] .night-action-footer button:active:not(:disabled){transform:scale(.97)}}@keyframes night-target-enter{0%{opacity:0;transform:translateY(12px)scale(.99)}to{opacity:1;transform:translateY(0)scale(1)}}@media (prefers-reduced-motion:reduce){.night-target-item{animation:.1s ease-out backwards night-target-fade}}@keyframes night-target-fade{0%{opacity:0}to{opacity:1}}.night-targets.dense{grid-template-columns:repeat(2,minmax(0,1fr));align-content:safe end;gap:6px;display:grid}.night-targets.dense .night-target{margin:0;padding:10px}.night-action-footer{padding:16px 24px calc(24px + env(safe-area-inset-bottom,0px));background:var(--bg);border-top:1px solid #222;flex:none}.night-action-footer .wide{margin:0}.night-mafia-team{margin:16px 0 0;font-size:14px}.night-mafia-team summary{color:var(--muted);cursor:pointer}.night-mafia-team ul{margin-top:8px}.night-mafia-team li{padding:3px 0}@media (max-height:600px){.night-action-heading{padding-top:12px;padding-bottom:16px}.night-action-role{margin-bottom:8px}.night-action-footer{padding-top:12px;padding-bottom:calc(16px + env(safe-area-inset-bottom,0px))}}.night-target-voters{color:var(--muted);margin-top:4px;font-size:12px;font-weight:400;line-height:1.4;display:block}
}

@layer theme,game,components,utilities;