:root{--burnt-oxblood: #85342b;--true-black: #010101;--espresso-charcoal: #201c1b;--dark-walnut: #534331;--champagne-cream: #ebd9b7;--soft-white: #feffff;--bg: var(--true-black);--surface: var(--espresso-charcoal);--surface-2: #2a2422;--border: var(--dark-walnut);--text: var(--champagne-cream);--text-muted: color-mix(in srgb, var(--champagne-cream) 65%, transparent);--accent: var(--burnt-oxblood);--accent-soft: color-mix(in srgb, var(--burnt-oxblood) 35%, var(--espresso-charcoal));--danger: #a33a30;--good: #6b8f71;--evil: #85342b;--neutral: #8a7a5a;--team-good: #3f7a4d;--team-evil: #85342b;--team-neutral: #6a6358;--font: "ruddy", sans-serif;--radius: 4px;--header-h: 64px;--footer-h: 72px;--safe-bottom: env(safe-area-inset-bottom, 0px)}*,*:before,*:after{box-sizing:border-box}html,body,#root{margin:0;min-height:100%;height:100%}body{font-family:var(--font);font-weight:400;background:radial-gradient(120% 80% at 50% -20%,color-mix(in srgb,var(--burnt-oxblood) 28%,transparent),transparent 55%),radial-gradient(90% 60% at 100% 100%,color-mix(in srgb,var(--dark-walnut) 40%,transparent),transparent 50%),var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;overflow:hidden}button,input{font:inherit;color:inherit}button{cursor:pointer;border:none;background:none}.app-shell{--shell-max: 430px;width:100%;max-width:var(--shell-max);margin:0 auto;height:100%;min-height:100dvh;display:flex;flex-direction:column;position:relative;z-index:1;background:linear-gradient(180deg,color-mix(in srgb,var(--espresso-charcoal) 88%,transparent) 0%,var(--true-black) 100%);border-inline:1px solid color-mix(in srgb,var(--dark-walnut) 50%,transparent)}.screen{flex:1;display:flex;flex-direction:column;min-height:0;padding:16px 18px calc(var(--footer-h) + var(--safe-bottom) + 8px);overflow-y:auto}.screen-inner{width:100%;max-width:100%;margin:0 auto;flex:1;display:flex;flex-direction:column;min-height:0}.screen.no-footer{padding-bottom:calc(16px + var(--safe-bottom))}.h-brand{font-weight:700;font-size:clamp(2.4rem,10vw,3.2rem);letter-spacing:.02em;text-align:center;margin:0;color:var(--soft-white)}.h1{font-weight:700;font-size:1.75rem;margin:0 0 8px}.h2{font-weight:700;font-size:1.15rem;margin:0 0 8px}.muted{color:var(--text-muted)}.italic{font-style:italic}.countdown{flex:0 0 auto;display:grid;justify-items:center;gap:6px;margin:0 auto 14px}.countdown-context{color:var(--text-muted);font-size:.8rem;letter-spacing:.06em;text-transform:uppercase}.countdown-ring{--countdown-color: var(--good);position:relative;width:104px;height:104px;display:grid;place-items:center;color:var(--countdown-color);filter:drop-shadow(0 0 8px color-mix(in srgb,var(--countdown-color) 24%,transparent));transition:color .35s linear,filter .35s linear}.countdown-ring svg{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;transform:rotate(-90deg)}.countdown-ring circle{fill:none;stroke-width:7}.countdown-track{stroke:color-mix(in srgb,var(--dark-walnut) 55%,transparent)}.countdown-progress{stroke:var(--countdown-color);stroke-linecap:round;transition:stroke .35s linear,stroke-dashoffset .12s linear}.countdown-time{position:relative;color:currentColor;font-size:1.15rem;font-weight:700;font-variant-numeric:tabular-nums;letter-spacing:.02em;text-shadow:0 1px 10px var(--true-black)}.countdown-compact{position:absolute;left:calc(50% + 52px);top:50%;z-index:1;gap:0;margin:0;transform:translateY(-50%)}.countdown-compact .countdown-context{display:none}.countdown-compact .countdown-ring{width:48px;height:48px;filter:drop-shadow(0 0 5px color-mix(in srgb,var(--countdown-color) 20%,transparent))}.countdown-compact .countdown-ring circle{stroke-width:8}.countdown-compact .countdown-time{font-size:.72rem}.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:48px;padding:12px 20px;border:2px solid var(--champagne-cream);border-radius:var(--radius);font-weight:700;letter-spacing:.03em;transition:transform .15s ease,background .15s ease,border-color .15s ease}.btn:active:not(:disabled){transform:scale(.98)}.btn:disabled{opacity:.4;cursor:not-allowed}.btn-primary{background:var(--accent);border-color:var(--accent);color:var(--soft-white)}.btn-primary:hover:not(:disabled){background:color-mix(in srgb,var(--accent) 85%,white)}.btn-ghost{background:transparent;border-color:var(--border);color:var(--text)}.btn-ghost.selected{background:var(--accent-soft);border-color:var(--champagne-cream)}.btn-block{width:100%}.btn-sm{min-height:36px;padding:6px 12px;font-size:.9rem}.field{width:100%;min-height:48px;padding:12px 14px;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);color:var(--soft-white);outline:none}.field:focus{border-color:var(--champagne-cream)}.panel{background:var(--surface);border:2px solid var(--border);border-radius:6px;padding:16px}.panel-cream{background:color-mix(in srgb,var(--champagne-cream) 92%,white);color:var(--true-black);border-color:var(--champagne-cream)}.role-badge{display:inline-flex;flex-direction:column;align-items:stretch;text-align:center;color:var(--champagne-cream)}.role-badge .name{padding:8px 16px;border:2px solid var(--champagne-cream);font-weight:700;font-size:1.25rem;color:var(--champagne-cream)}.role-badge .team-slot{margin-top:-2px;align-self:center;min-width:60%}.role-badge .team-slot .team-badge{display:block;width:100%;box-sizing:border-box;border-radius:0;border:none;padding:6px 12px;font-size:.95rem}.team-badge,.team-chip{display:inline-flex;align-items:center;justify-content:center;gap:.25em;padding:.15em .55em;border-radius:3px;font-weight:700;line-height:1.25;color:#fff;vertical-align:baseline;white-space:nowrap}.team-badge.team-good,.team-chip.team-good{background:var(--team-good)}.team-badge.team-evil,.team-chip.team-evil{background:var(--team-evil)}.team-badge.team-neutral,.team-chip.team-neutral{background:var(--team-neutral)}.team-chip{font-size:.8em;padding:.1em .45em;text-transform:capitalize}.team-mention{font-weight:700}.team-mention.team-good{color:var(--team-good)}.team-mention.team-evil{color:var(--team-evil)}.team-mention.team-neutral{color:var(--team-neutral)}.vp-mention{display:inline;padding:.05em .35em;border-radius:3px;font-weight:700;line-height:1.25;color:#111;background:#e6c84a;white-space:nowrap;vertical-align:baseline}.icon-btn{width:44px;height:44px;border-radius:50%;border:2px solid var(--champagne-cream);display:grid;place-items:center;background:var(--surface);color:var(--champagne-cream);flex-shrink:0;position:relative;transition:background .15s ease,transform .15s ease}.icon-btn:active{transform:scale(.95)}.icon-btn .badge{position:absolute;top:-4px;right:-4px;min-width:18px;height:18px;padding:0 4px;border-radius:999px;background:var(--accent);color:var(--soft-white);font-size:.7rem;font-weight:700;display:grid;place-items:center;border:1px solid var(--soft-white)}.ui-icon{display:inline-block;flex-shrink:0;background:currentColor;mask-size:contain;mask-repeat:no-repeat;mask-position:center;-webkit-mask-size:contain;-webkit-mask-repeat:no-repeat;-webkit-mask-position:center}.ability-list{display:flex;flex-direction:column;gap:10px;margin-top:8px}.ability-row{display:flex;align-items:flex-start;gap:10px}.ability-row>p{margin:0;flex:1;min-width:0}.ability-icon{position:relative;display:inline-grid;place-items:center;flex-shrink:0;color:var(--champagne-cream)}.ability-icon .ui-icon{grid-area:1 / 1}.ability-icon-mark{grid-area:1 / 1;z-index:1;font-size:.78rem;font-weight:800;line-height:1;color:var(--true-black);pointer-events:none}.icon-btn svg,.icon-btn img,.icon-btn .ui-icon{width:22px;height:22px}.icon-btn.icon-btn-role{overflow:hidden;padding:0}.icon-btn.icon-btn-role>img{position:absolute;top:0;right:0;bottom:0;left:0;width:100%;height:100%;max-width:none;border-radius:50%;object-fit:cover}.icon-btn.lg{width:88px;height:88px}.icon-btn.lg svg,.icon-btn.lg img,.icon-btn.lg .ui-icon{width:48px;height:48px}.role-icon{width:120px;height:120px;border-radius:50%;object-fit:cover;border:3px solid var(--champagne-cream);background:var(--surface);box-shadow:0 8px 24px #00000073}.game-header{position:relative;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:12px 16px 10px;border-bottom:1px solid var(--border);min-height:var(--header-h)}.game-header-right{display:flex;align-items:center;gap:6px;margin-left:auto}.game-header .center{position:absolute;left:50%;transform:translate(-50%);text-align:center;line-height:1.15;white-space:nowrap}.game-header .day{font-size:.95rem;color:var(--text-muted)}.game-header .phase{font-weight:700;font-size:1.15rem}.game-footer{position:absolute;left:0;right:0;bottom:0;padding:10px 18px calc(10px + var(--safe-bottom));display:flex;justify-content:space-between;align-items:center;gap:12px;background:linear-gradient(180deg,transparent,var(--true-black) 30%);pointer-events:none}.game-footer>*{pointer-events:auto}.game-footer .cluster{display:flex;gap:10px}.game-footer .footer-role-cluster{align-items:center}.list{display:flex;flex-direction:column;gap:8px}.list-row{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:10px 14px;border:2px solid var(--border);border-radius:var(--radius);background:var(--surface-2);font-weight:700;text-align:left;width:100%;transition:border-color .15s ease,background .15s ease}.list-row.selected{border-color:var(--champagne-cream);background:var(--accent-soft)}.list-row:disabled{opacity:.7;cursor:not-allowed}.list-row .meta{display:flex;align-items:center;gap:4px;color:var(--text-muted);font-weight:400}.icon-btn.roster-kick-btn{width:28px;height:28px;flex-shrink:0;opacity:.75}.icon-btn.roster-kick-btn svg{width:16px;height:16px}.roster-kick-btn:hover,.roster-kick-btn:focus-visible{opacity:1;border-color:var(--champagne-cream)}.skulls{display:flex;gap:2px}.note-wrap{display:flex;flex-direction:column;align-items:center;gap:16px;margin:auto 0;width:100%}.note-count{font-weight:700;letter-spacing:.05em}.note-card{position:relative;width:100%;min-height:180px;padding:36px 20px 24px;border:2px solid var(--champagne-cream);border-radius:4px;background:color-mix(in srgb,var(--espresso-charcoal) 90%,black);text-align:center;animation:note-in .35s ease}.note-card .tab{position:absolute;top:-14px;left:12px;min-width:36px;height:32px;padding:0 10px;border:2px solid var(--champagne-cream);background:var(--surface);display:inline-flex;align-items:center;justify-content:center;gap:6px;z-index:1}.note-card .note-visibility{font-size:.68rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase;color:var(--champagne-cream);line-height:1}.note-card.is-private .tab{border-color:color-mix(in srgb,var(--burnt-oxblood) 70%,var(--champagne-cream))}.note-card.is-private .note-visibility{color:color-mix(in srgb,var(--champagne-cream) 85%,var(--burnt-oxblood))}.note-card.is-public .note-visibility{color:color-mix(in srgb,var(--champagne-cream) 80%,var(--good))}.note-card.has-label .note-visibility{color:var(--champagne-cream);text-transform:none;letter-spacing:.04em;font-size:.72rem}.match-end{width:100%;flex:1;min-height:0;align-self:stretch}.match-end .help-tabs{width:100%;flex-shrink:0}.match-body-content:has(.match-end){overflow:hidden}.match-end-summary{width:100%;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;gap:12px}.match-end-summary>.h1{flex-shrink:0;margin-block:0}.match-end-player-list,.match-end-log{width:100%;flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;text-align:left;-webkit-overflow-scrolling:touch}.match-end>.btn{flex-shrink:0}.note-card .corner-icon{position:absolute;top:-18px;right:14px;width:48px;height:48px;border-radius:50%;border:2px solid var(--champagne-cream);background:var(--surface);object-fit:cover}.note-card .big-icon{font-size:2.5rem;margin-bottom:12px}.note-card p{margin:0;font-size:1.15rem;line-height:1.35}.sheet{position:absolute;top:0;right:0;bottom:0;left:0;z-index:20;background:var(--true-black);display:flex;flex-direction:column;min-height:0;padding:0;animation:fade-in .2s ease}.sheet-body{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto}.sheet-header{position:sticky;top:0;z-index:1;display:flex;justify-content:space-between;align-items:center;gap:8px;padding:16px 18px 12px;background:linear-gradient(180deg,var(--true-black) 70%,color-mix(in srgb,var(--true-black) 85%,transparent))}.sheet-title-row{display:flex;align-items:center;gap:4px;min-width:0}.sheet-title-row .h2{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.sheet-body-inner{padding:4px 18px calc(16px + var(--safe-bottom))}.help-tabs{display:flex;gap:8px;margin:0 0 16px}.help-tab{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid var(--border);background:transparent;color:var(--champagne-cream);font:inherit;font-weight:700;padding:10px 12px;border-radius:10px;cursor:pointer;opacity:.7}.help-tab.is-active{opacity:1;border-color:var(--champagne-cream);background:color-mix(in srgb,var(--champagne-cream) 12%,transparent)}.role-catalog-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px 10px;padding-bottom:8px}.role-catalog-card{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:none;background:transparent;color:inherit;font:inherit;padding:4px 2px;display:flex;flex-direction:column;align-items:center;gap:8px;cursor:pointer;border-radius:12px;transition:background .15s ease,transform .15s ease}.role-catalog-card:hover,.role-catalog-card:focus-visible{background:color-mix(in srgb,var(--champagne-cream) 10%,transparent);outline:none}.role-catalog-card:active{transform:scale(.97)}.role-catalog-card img{width:72px;height:72px;border-radius:50%;object-fit:cover;border:2px solid var(--champagne-cream);box-sizing:border-box}.role-catalog-card span{font-size:.78rem;font-weight:700;text-align:center;line-height:1.2}.role-team-multi{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;padding:6px 8px;border:2px solid var(--champagne-cream);border-top:none;box-sizing:border-box}.sheet-body-inner .role-reveal-body{padding-inline:0}.sheet-body,.role-reveal-scroll{scrollbar-width:thin;scrollbar-color:color-mix(in srgb,var(--champagne-cream) 35%,transparent) transparent}.sheet-body::-webkit-scrollbar,.role-reveal-scroll::-webkit-scrollbar{width:6px}.sheet-body::-webkit-scrollbar-track,.role-reveal-scroll::-webkit-scrollbar-track{background:transparent}.sheet-body::-webkit-scrollbar-thumb,.role-reveal-scroll::-webkit-scrollbar-thumb{background:color-mix(in srgb,var(--champagne-cream) 28%,transparent);border-radius:999px}.sheet-body::-webkit-scrollbar-thumb:hover,.role-reveal-scroll::-webkit-scrollbar-thumb:hover{background:color-mix(in srgb,var(--champagne-cream) 48%,transparent)}.stack{display:flex;flex-direction:column;gap:12px}.stack-lg{gap:20px}.center-col{display:flex;flex-direction:column;align-items:center;text-align:center;gap:12px}.spacer{flex:1}.hr{border:none;border-top:1px solid var(--border);margin:12px 0}.footer-cta{margin-top:auto;padding-top:16px}.pill{display:inline-block;padding:2px 10px;border:1px solid var(--border);border-radius:999px;font-size:.8rem;color:var(--text-muted)}@keyframes note-in{0%{opacity:0;transform:translateY(12px) scale(.98)}to{opacity:1;transform:none}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}@keyframes fade-out{0%{opacity:1}to{opacity:0}}@keyframes bridge-in{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}@keyframes pulse-soft{0%,to{opacity:1}50%{opacity:.7}}.pulse{animation:pulse-soft 2s ease-in-out infinite}.match-root{display:flex;flex-direction:column;height:100%;min-height:0;position:relative}.match-body{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}.sky-atmosphere{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;overflow:hidden;pointer-events:none}.sky-wash{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity 2.8s ease}.sky-wash-day{background:radial-gradient(70% 55% at 88% 8%,color-mix(in srgb,#f0c36a 50%,transparent),transparent 58%),radial-gradient(55% 45% at 10% 90%,color-mix(in srgb,var(--dark-walnut) 40%,transparent),transparent 55%),linear-gradient(165deg,#4a3428,#2c211c 42%,#120e0c)}.sky-wash-dawn{background:radial-gradient(65% 50% at 12% 88%,color-mix(in srgb,#e8a15a 58%,transparent),transparent 60%),radial-gradient(50% 40% at 90% 12%,color-mix(in srgb,#f3d29a 32%,transparent),transparent 55%),linear-gradient(160deg,#3a241c,#6a3d2c 38%,#120e0c)}.sky-wash-dusk{background:radial-gradient(70% 55% at 90% 85%,color-mix(in srgb,var(--burnt-oxblood) 52%,transparent),transparent 58%),radial-gradient(45% 35% at 12% 10%,color-mix(in srgb,#c47a3a 24%,transparent),transparent 55%),linear-gradient(170deg,#1a1210,#4a2822 48%,#090706)}.sky-wash-night{background:radial-gradient(55% 40% at 50% 0%,color-mix(in srgb,#1c2430 55%,transparent),transparent 55%),radial-gradient(40% 35% at 92% 80%,color-mix(in srgb,var(--dark-walnut) 22%,transparent),transparent 50%),linear-gradient(180deg,#0a0d12,#10141c 45%,#050506)}.sky-day .sky-wash-day,.sky-dawn .sky-wash-dawn,.sky-dusk .sky-wash-dusk,.sky-night .sky-wash-night{opacity:1}.sky-sun,.sky-moon{position:absolute;border-radius:50%;transition:opacity 2.6s ease,transform 2.8s cubic-bezier(.33,.1,.25,1),top 2.8s ease,bottom 2.8s ease,left 2.8s ease,right 2.8s ease,box-shadow 2.6s ease;will-change:opacity,transform}.sky-sun{width:clamp(56px,8vw,96px);height:clamp(56px,8vw,96px);top:4%;left:50%;right:auto;bottom:auto;background:radial-gradient(circle at 35% 35%,#fff6d8 0%,#f0c36a 38%,#c47a3a 72%,transparent 78%);box-shadow:0 0 40px 14px color-mix(in srgb,#f0c36a 45%,transparent),0 0 90px 36px color-mix(in srgb,var(--burnt-oxblood) 22%,transparent);opacity:0;transform:translate3d(-50%,16px,0) scale(.75)}.sky-day .sky-sun{opacity:.95;top:3.5%;transform:translate3d(-50%,0,0) scale(1)}.sky-dawn .sky-sun{opacity:.9;top:5%;transform:translate3d(-50%,6px,0) scale(1.08);filter:saturate(1.15)}.sky-dusk .sky-sun{opacity:.75;top:5%;transform:translate3d(-50%,8px,0) scale(.92)}.sky-night .sky-sun{opacity:0;top:8%;transform:translate3d(-50%,18px,0) scale(.55)}.sky-moon{width:clamp(36px,5vw,56px);height:clamp(36px,5vw,56px);top:4.5%;left:50%;right:auto;bottom:auto;background:radial-gradient(circle at 38% 38%,#f4efe4,#d8c9a8 55%,#9a8b6e);box-shadow:0 0 28px 10px color-mix(in srgb,var(--champagne-cream) 22%,transparent),inset -8px -4px color-mix(in srgb,#1a1f2a 35%,transparent);opacity:0;transform:translate3d(-50%,-10px,0) scale(.85)}.sky-night .sky-moon{opacity:.9;transform:translate3d(-50%,0,0) scale(1)}.sky-dusk .sky-moon{opacity:0}.sky-stars{position:absolute;top:0;right:0;bottom:0;left:0;opacity:0;transition:opacity 2.4s ease}.sky-night .sky-stars{opacity:1}.sky-dusk .sky-stars{opacity:.4}.sky-star{position:absolute;border-radius:50%;background:var(--champagne-cream);opacity:var(--star-o, .7);animation:sky-twinkle 3.6s ease-in-out infinite}@keyframes sky-twinkle{0%,to{opacity:var(--star-o, .7);transform:scale(1)}50%{opacity:calc(var(--star-o, .7) * .35);transform:scale(.85)}}html[data-sky] body{background:var(--true-black)}html[data-sky] .app-shell{background:linear-gradient(180deg,color-mix(in srgb,var(--true-black) 22%,transparent) 0,color-mix(in srgb,var(--espresso-charcoal) 92%,var(--true-black)) var(--header-h),var(--true-black) calc(var(--header-h) + 48px));border-inline-color:color-mix(in srgb,var(--dark-walnut) 65%,transparent)}html[data-sky] .game-header{border-bottom-color:color-mix(in srgb,var(--border) 40%,transparent);background:linear-gradient(180deg,color-mix(in srgb,var(--true-black) 18%,transparent),color-mix(in srgb,var(--true-black) 45%,transparent))}html[data-sky=day] .game-header{background:linear-gradient(180deg,color-mix(in srgb,#f0c36a 14%,transparent),color-mix(in srgb,var(--true-black) 40%,transparent))}html[data-sky=dawn] .game-header{background:linear-gradient(180deg,color-mix(in srgb,#e8a15a 18%,transparent),color-mix(in srgb,var(--true-black) 42%,transparent))}html[data-sky=dusk] .game-header{background:linear-gradient(180deg,color-mix(in srgb,var(--burnt-oxblood) 22%,transparent),color-mix(in srgb,var(--true-black) 48%,transparent))}html[data-sky=night] .game-header{background:linear-gradient(180deg,color-mix(in srgb,#1c2430 35%,transparent),color-mix(in srgb,var(--true-black) 55%,transparent))}@media(prefers-reduced-motion:reduce){.sky-wash,.sky-sun,.sky-moon,.sky-stars{transition-duration:.01ms}.sky-star{animation:none}}.match-body-content{flex:1;min-height:0;display:flex;flex-direction:column;overflow-y:auto}.match-pad{flex:1;display:flex;flex-direction:column;min-height:0;width:100%;padding:16px 18px calc(var(--footer-h) + var(--safe-bottom) + 8px)}.match-pad.no-footer{padding-bottom:calc(16px + var(--safe-bottom))}.match-body-content:has(.role-reveal-pad){overflow:hidden}.role-reveal-pad{overflow:hidden;padding-inline:0}.role-reveal{flex:1;min-height:0;width:100%;display:flex;flex-direction:column}.role-reveal-scroll{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto}.role-reveal-body{width:100%;padding:0 18px 8px;box-sizing:border-box}.role-reveal-cta{flex-shrink:0;width:100%;padding:12px 18px 0;box-sizing:border-box;background:linear-gradient(180deg,transparent,color-mix(in srgb,var(--true-black) 88%,transparent) 28%,var(--true-black) 70%)}.panel.center-panel{margin:auto;width:min(100%,560px)}.phase-stage{position:relative;flex:1;display:flex;flex-direction:column;min-height:0}.night-stage{flex:1;min-height:0}.match-body-content:has(.player-target-panel),.match-pad:has(.player-target-panel){overflow:hidden}.player-target-panel{flex:1;min-height:0;margin-block:0}.player-target-panel>:not(.player-target-scroll){flex-shrink:0}.player-target-scroll{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;-webkit-overflow-scrolling:touch}.player-target-scroll.list>.list-row{flex:0 0 auto}.phase-content{flex:1;display:flex;flex-direction:column;min-height:0;opacity:1}.phase-content.is-fading-out{animation:fade-out .32s ease forwards;pointer-events:none}.phase-content.is-fading-in{animation:fade-in .4s ease}.phase-content.is-hidden{opacity:0;visibility:hidden;pointer-events:none;position:absolute;top:0;right:0;bottom:0;left:0}.phase-bridge{position:absolute;top:0;right:0;bottom:0;left:0;z-index:5;display:flex;align-items:center;justify-content:center;padding:24px 20px;opacity:0;transition:opacity .38s ease;pointer-events:none;background:radial-gradient(90% 70% at 50% 42%,color-mix(in srgb,var(--burnt-oxblood) 18%,transparent),transparent 72%),color-mix(in srgb,var(--true-black) 88%,transparent)}.phase-bridge.is-visible{opacity:1}.phase-bridge-inner{max-width:22rem;text-align:center;display:flex;flex-direction:column;gap:10px}.phase-bridge.is-visible .phase-bridge-inner{animation:bridge-in .45s ease}.phase-bridge-eyebrow{margin:0;font-size:.8rem;letter-spacing:.14em;text-transform:uppercase;color:var(--text-muted)}.phase-bridge-title{margin:0;font-size:clamp(1.45rem,5.5vw,1.85rem);font-weight:700;line-height:1.25;color:var(--soft-white);text-shadow:0 2px 18px color-mix(in srgb,var(--true-black) 70%,transparent)}.phase-bridge-sub{margin:0;font-size:1.05rem;line-height:1.4;color:var(--text-muted)}.lobby{justify-content:flex-start;gap:20px;padding-top:48px}.lobby-hero{display:flex;flex-direction:column;gap:16px;align-items:stretch}.lobby-tagline{text-align:center;margin:0}.lobby-error{color:var(--danger);text-align:center;margin:0}.lobby-actions{margin-top:4px}.lobby-status{text-align:center;font-size:.85rem;margin:10px 0 0}.lobby-rooms .h2{text-align:center}.lobby .rooms-box,.lobby-rooms .rooms-box{flex:1;min-height:200px;overflow-y:auto;border:2px solid var(--border);border-radius:6px;padding:8px;background:color-mix(in srgb,var(--espresso-charcoal) 70%,transparent)}.lobby-rooms{display:flex;flex-direction:column;flex:1;min-height:0;gap:8px}.room-screen{display:flex;flex-direction:column;gap:20px;overflow:hidden}.room-hero{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px}.room-roster{flex:1;min-height:0;display:flex;flex-direction:column;overflow:hidden}.room-roster>.list{flex:1;min-height:0;overflow-x:hidden;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable}.room-roster>.list>.list-row{flex:0 0 auto}.room-side{margin-top:auto;flex:0 0 auto}.room-item{display:grid;grid-template-columns:1fr auto auto;gap:10px;align-items:center;padding:12px;border-bottom:1px solid color-mix(in srgb,var(--border) 60%,transparent)}.room-item:last-child{border-bottom:none}.empty-hint{padding:32px 16px;text-align:center;color:var(--text-muted);font-style:italic;white-space:normal;overflow-wrap:anywhere;line-height:1.4}.devtools{position:absolute;left:10px;right:10px;bottom:calc(12px + var(--safe-bottom));z-index:40;max-height:min(70vh,480px);display:flex;flex-direction:column;background:color-mix(in srgb,var(--espresso-charcoal) 96%,black);border:2px solid var(--burnt-oxblood);border-radius:6px;box-shadow:0 12px 40px #0000008c;animation:note-in .2s ease}.devtools-header{display:flex;align-items:center;gap:10px;padding:10px 12px;border-bottom:1px solid var(--border)}.devtools-header strong{flex:1}.devtools-body{padding:12px;overflow-y:auto}.devtools-section+.devtools-section{margin-top:14px;padding-top:14px;border-top:1px solid var(--border)}.devtools-role-row{display:grid;grid-template-columns:minmax(64px,.8fr) 1.2fr minmax(0,.7fr);gap:6px;align-items:center}.devtools-role-name{font-weight:700;font-size:.85rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.devtools-select{min-height:36px;padding:6px 8px;font-size:.85rem}.skip-link{background:none;border:none;color:var(--text-muted);text-decoration:underline;font-weight:700;padding:8px}.skip-link:disabled{opacity:.4;cursor:not-allowed;text-decoration:none}.skip-link:hover:not(:disabled){color:var(--champagne-cream)}@media(min-width:768px){body{overflow:auto;background:radial-gradient(80% 60% at 10% 0%,color-mix(in srgb,var(--burnt-oxblood) 22%,transparent),transparent 55%),radial-gradient(70% 50% at 90% 100%,color-mix(in srgb,var(--dark-walnut) 35%,transparent),transparent 50%),radial-gradient(40% 40% at 50% 50%,color-mix(in srgb,var(--espresso-charcoal) 50%,transparent),transparent 70%),var(--bg)}#root{min-height:100dvh;display:flex;align-items:center;justify-content:center;padding:24px clamp(20px,3vw,48px)}.app-shell{--shell-max: min(880px, 100%);--header-h: 72px;--footer-h: 80px;width:min(880px,100%);height:min(900px,calc(100dvh - 48px));min-height:min(900px,calc(100dvh - 48px));border:1px solid color-mix(in srgb,var(--dark-walnut) 70%,transparent);border-radius:20px;box-shadow:0 0 0 1px color-mix(in srgb,var(--champagne-cream) 6%,transparent),0 30px 80px #0000008c,0 0 120px color-mix(in srgb,var(--burnt-oxblood) 12%,transparent);overflow:hidden}.screen{padding:28px 40px calc(var(--footer-h) + 16px)}.screen.no-footer{padding-bottom:32px}.h-brand{font-size:clamp(3rem,5vw,3.8rem)}.h1{font-size:2.1rem}.h2{font-size:1.3rem}.btn{min-height:52px;padding:14px 24px}.field{min-height:52px}.panel{padding:22px 24px}.list-row{min-height:56px;padding:14px 18px;font-size:1.05rem}.game-header{padding:16px 28px 14px}.game-header .day{font-size:1.05rem}.game-header .phase{font-size:1.35rem}.countdown-compact{left:calc(50% + 68px)}.countdown-compact .countdown-ring{width:54px;height:54px}.icon-btn{width:52px;height:52px}.icon-btn svg,.icon-btn img,.icon-btn .ui-icon{width:26px;height:26px}.icon-btn.icon-btn-role>img{width:100%;height:100%}.icon-btn.lg{width:112px;height:112px}.icon-btn.lg svg,.icon-btn.lg img,.icon-btn.lg .ui-icon{width:56px;height:56px}.role-icon{width:160px;height:160px}.role-badge .name{font-size:1.5rem;padding:10px 22px}.note-card{max-width:560px;margin-inline:auto;min-height:220px;padding:44px 28px 28px}.note-card p{font-size:1.35rem}.game-footer{padding:14px 28px 18px}.game-footer .cluster{gap:14px}.lobby{padding-top:40px;max-width:640px;margin-inline:auto;width:100%}.lobby-rooms .rooms-box{min-height:280px}.devtools{left:24px;right:24px;bottom:24px;max-width:560px;margin-inline:auto}.sheet-header{padding:28px 36px 16px}.sheet-body-inner{max-width:600px;margin-inline:auto;width:100%;padding:4px 0 28px}.role-catalog-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:18px 14px}.role-catalog-card img{width:88px;height:88px}.center-col{max-width:600px;margin-inline:auto;width:100%}.note-wrap{max-width:560px;margin-inline:auto}.panel.center-panel,.panel.stack{max-width:560px}.match-pad{padding:24px 36px calc(var(--footer-h) + 20px)}}@media(max-height:700px){.match-pad{padding-top:10px;padding-bottom:calc(var(--footer-h) + var(--safe-bottom))}.match-pad.no-footer{padding-bottom:calc(10px + var(--safe-bottom))}.match-pad .stack{gap:8px}.match-pad .stack-lg{gap:12px}.match-pad .list{gap:6px}.match-pad .list-row{min-height:40px;padding:7px 10px}.match-pad .btn{min-height:44px;padding-block:9px}.match-pad .role-icon{width:88px;height:88px}.match-pad .icon-btn.lg{width:68px;height:68px}.match-pad .note-wrap{gap:10px}.match-pad .note-card{min-height:140px;padding-block:28px 18px}}@media(min-width:1100px){#root{padding:32px 56px}.app-shell{--shell-max: min(1120px, 100%);width:min(1120px,100%);height:min(820px,calc(100dvh - 64px));min-height:min(820px,calc(100dvh - 64px))}.screen{padding:32px 48px calc(var(--footer-h) + 20px)}.room-screen{display:grid;grid-template-columns:1.25fr .85fr;grid-template-rows:auto 1fr;gap:24px 40px;align-content:start}.room-screen .room-hero{grid-column:1 / -1;display:flex;flex-direction:column;align-items:flex-start;gap:8px;text-align:left}.room-screen .room-roster{grid-column:1;grid-row:2;min-height:0;overflow:hidden}.room-screen .room-side{grid-column:2;grid-row:2;align-self:start}.lobby{max-width:none;display:grid;grid-template-columns:minmax(280px,.95fr) minmax(320px,1.2fr);gap:36px 48px;align-items:stretch;padding-top:36px;height:100%}.lobby-hero{justify-content:center;gap:18px;padding-right:12px}.lobby-hero .h-brand{text-align:left}.lobby-tagline{text-align:left;font-size:1.1rem}.lobby-actions{margin-top:12px;max-width:360px}.lobby-status{text-align:left}.lobby-rooms{min-height:0}.lobby-rooms .h2{text-align:left;margin-bottom:4px}.lobby-rooms .rooms-box{flex:1;min-height:0}.center-col{max-width:680px}.note-wrap,.panel.center-panel,.panel.stack{max-width:600px}.match-pad{padding-inline:48px}}@media(min-width:1400px){.app-shell{width:min(1200px,100%);height:min(860px,calc(100dvh - 72px));min-height:min(860px,calc(100dvh - 72px))}.screen{padding-inline:56px}}
