:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;--viewport-height:100vh;--active-round-gap:clamp(10px, 1.4vw, 18px);--stage-card-padding:clamp(.75rem, 1.3vw, 1rem);--stage-frame-padding:clamp(.35rem, .8vw, .6rem);--bg-deep:#07111f;--bg-panel:#09111fc2;--bg-panel-soft:#ffffff14;--bg-card:#fffaf0e6;--ink-strong:#eef7ff;--ink-body:#15324c;--ink-muted:#13324cb8;--accent:#ff7a2f;--accent-soft:#ff7a2f29;--line:#ffffff24;--shadow-lg:0 28px 80px #0208143d;--shadow-md:0 18px 42px #07111f24;color:var(--ink-body);background:radial-gradient(circle at 0 0,#ff964e52,#0000 30%),radial-gradient(circle at 100% 0,#5eb1ff3d,#0000 26%),linear-gradient(#f7f2e9 0%,#eef5fb 42%,#dfe7f2 100%);font-family:Avenir Next,Segoe UI,sans-serif}@supports (height:100dvh){:root{--viewport-height:100dvh}}*{box-sizing:border-box}html{scrollbar-gutter:stable both-edges}html.no-scroll,body.no-scroll{overflow:hidden}body{min-height:100vh;margin:0;overflow-x:hidden}button,input{font:inherit}button{cursor:pointer;border:0;border-radius:999px;transition:transform .14s,box-shadow .14s,opacity .14s,background .14s}button:hover{transform:translateY(-1px)}button:active{transform:translateY(0)}button.primary,button.secondary,button.ghost,button.tiny-button{padding:.85rem 1.1rem}button.primary{color:#fff8f1;background:linear-gradient(135deg,#ff8d4a 0%,#ff6b2c 100%);box-shadow:0 18px 30px #ff6b2c47}button.secondary{color:#f5fbff;background:linear-gradient(135deg,#112f4a 0%,#28527b 100%);box-shadow:0 16px 28px #112f4a3d}button.ghost,button.tiny-button{color:#dff2ff;background:#ffffff14;border:1px solid #ffffff1f}button.tiny-button{padding:.42rem .7rem;font-size:.8rem}label{gap:.45rem;font-size:.95rem;display:grid}input{background:#ffffffe0;border:1px solid #13314d26;border-radius:16px;width:100%;padding:.92rem 1rem;box-shadow:inset 0 1px #ffffff80}.hidden{display:none!important}.app-shell{width:min(1380px,100vw - 2rem);margin:0 auto;padding:1.25rem 0 2rem}.app-shell.has-session{width:min(1440px,100vw - 1.5rem)}.app-shell.has-session .hero{grid-template-columns:minmax(0,1fr) minmax(240px,320px);align-items:stretch;gap:.75rem;margin-bottom:.85rem}.app-shell.has-session .hero-main{border-radius:24px;padding:.95rem 1.1rem}.app-shell.has-session #title-line{max-width:none;margin-bottom:.2rem;font-size:clamp(1.55rem,3vw,2.35rem);line-height:.98}.app-shell.has-session .hero-copy,.app-shell.has-session .hero-tags{display:none}.app-shell.has-session .hero-status{border-radius:22px;align-items:center;min-height:0;padding:.95rem 1rem;font-size:.95rem;display:flex}.hero{grid-template-columns:minmax(0,1fr) minmax(280px,380px);align-items:end;gap:1rem;margin-bottom:1.25rem;display:grid}.hero-main{box-shadow:var(--shadow-md);background:radial-gradient(circle at 0 0,#ff8e4e33,#0000 28%),linear-gradient(135deg,#ffffffe6,#eef5fcd1);border:1px solid #ffffff85;border-radius:34px;padding:1.4rem 1.5rem 1.3rem;position:relative;overflow:hidden}.hero-main:after{content:"";pointer-events:none;background:radial-gradient(circle,#5eb1ff3d,#0000 66%);border-radius:999px;width:220px;height:220px;position:absolute;bottom:-50px;right:-40px}.eyebrow{text-transform:uppercase;letter-spacing:.18em;color:#d86c2c;margin:0 0 .45rem;font-size:.72rem;font-weight:800}h1,h2,p{margin-top:0}h2{margin-bottom:0}h1{max-width:10ch;margin-bottom:.8rem;font-size:clamp(2.4rem,5vw,4.6rem);line-height:.92}.hero-copy{max-width:52ch;color:var(--ink-muted);font-size:1.05rem}.hero-tags{flex-wrap:wrap;gap:.6rem;margin-top:1rem;display:flex}.hero-tag{color:#17324d;background:#07111f0f;border:1px solid #112f4a14;border-radius:999px;align-items:center;padding:.55rem .8rem;font-size:.86rem;font-weight:700;display:inline-flex}.hero-status{min-height:80px;color:var(--ink-strong);box-shadow:var(--shadow-lg);opacity:0;background:linear-gradient(135deg,#07111fe0,#1d4062d1);border:1px solid #ffffff24;border-radius:26px;padding:1rem 1.1rem}.hero-status.visible{opacity:1}.lobby-shell{grid-template-columns:repeat(auto-fit,minmax(310px,1fr));gap:1rem;display:grid}.lobby-shell.join-only{grid-template-columns:minmax(320px,520px);justify-content:start}.entry-card,.stage-card,.summary-card,.side-panel{box-shadow:var(--shadow-md);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid #fff3}.entry-card{background:linear-gradient(#ffffffe0,#f7f4ecc7);border-radius:34px;gap:1rem;padding:1.5rem;display:grid;position:relative;overflow:hidden}.entry-card.invite-card{max-width:520px}.entry-card h2{margin-bottom:.15rem}.entry-card:before{content:"";width:100%;height:6px;position:absolute;inset:0 auto auto 0}.entry-card-host:before{background:linear-gradient(90deg,#ff8a47,#ffc661)}.entry-card-player:before{background:linear-gradient(90deg,#5db1ff,#82f0d5)}.card-kicker{letter-spacing:.18em;text-transform:uppercase;color:#15324c8a;margin:0;font-size:.78rem;font-weight:800}.session-shell{grid-template-columns:minmax(0,1fr);align-items:start;gap:1rem;min-width:0;display:grid}.side-panel{color:var(--ink-strong);background:linear-gradient(#09111feb,#1a3a5ad6);border-radius:28px;grid-template-columns:repeat(12,minmax(0,1fr));gap:.7rem;min-width:0;padding:.8rem;display:grid}.panel-block{background:#ffffff0f;border:1px solid #ffffff14;border-radius:18px;align-content:start;align-self:start;gap:.55rem;min-width:0;padding:.8rem;display:grid}.panel-block h2{font-size:1.05rem;line-height:1.1}.panel-block-session,.panel-block-status,.panel-block-highlight,.panel-block-controls{grid-column:span 3}.panel-block-participants{grid-column:1/-1}.panel-heading{justify-content:space-between;align-items:baseline;gap:1rem;display:flex}.room-chip{color:#f7fbff;background:#ffffff14;border:1px solid #ffffff1f;border-radius:16px;justify-content:space-between;align-items:center;gap:1rem;padding:.75rem .85rem;display:flex}.room-chip span{font-size:.84rem}.room-chip strong{font-size:1.2rem}.share-link{overflow-wrap:anywhere;color:#bfe4ff;min-width:0;max-width:100%;font-size:.88rem;display:block}.status-copy,.hint{color:#e4f2ffd6;margin:0}.status-copy{font-size:.96rem}.hint{color:#e4f2ffad;font-size:.84rem}.latest-caught-card{background:linear-gradient(#ff9f5629,#ffffff0d);border:1px solid #ffb3763d;border-radius:16px;gap:.55rem;min-height:100%;padding:.8rem .9rem;display:grid}.latest-caught-main{align-items:center;gap:.75rem;display:flex}.latest-caught-main strong,.latest-caught-empty strong{color:#fff7ef;font-size:1rem;display:block}.latest-caught-main p,.latest-caught-empty span{color:#f1f5ffb8;margin:.16rem 0 0;font-size:.84rem}.latest-caught-empty{gap:.2rem;display:grid}.latest-caught-pill{letter-spacing:.08em;text-transform:uppercase;color:#4f2008;background:#ffcc7eeb;border-radius:999px;justify-self:start;align-items:center;padding:.3rem .65rem;font-size:.72rem;font-weight:800;display:inline-flex}.participant-list,.timeline-list{gap:.55rem;margin:0;padding:0;list-style:none;display:grid}.participant-list{grid-template-columns:repeat(auto-fit,minmax(230px,1fr))}.participant-row,.timeline-list li{background:#ffffff14;border:1px solid #ffffff14;border-radius:18px;justify-content:space-between;align-items:center;gap:.7rem;padding:.75rem .85rem;display:flex}.participant-row-host{background:#9572ff1f;border-color:#af94ff3d}.participant-main{align-items:center;gap:.65rem;min-width:0;display:flex}.participant-badge{border-radius:999px;flex:none;width:10px;height:40px;box-shadow:0 0 0 3px #ffffff0d}.participant-main strong{color:#f9fbff;font-size:.98rem}.participant-main p{color:#e2f0ffa8;margin:.15rem 0 0;font-size:.82rem}.participant-meta{flex-direction:column;align-items:flex-end;gap:.35rem;display:flex}.state-pill{border-radius:999px;padding:.28rem .65rem;font-size:.72rem;font-weight:800;display:inline-flex}.state-active{color:#124528;background:#7adf98e6}.state-caught{color:#621b33;background:#ff99b4e0}.state-late_joiner{color:#173f64;background:#9ed3ffe0}.state-disconnected{color:#eff6ff;background:#8596abb3}.state-waiting{color:#65401a;background:#ffcf85e6}.control-stack{gap:.55rem;display:grid}.control-stack button{min-height:0;padding:.72rem .95rem;font-size:.94rem}.stage-shell{gap:1rem;min-width:0;display:grid}.stage-card,.summary-card{padding:var(--stage-card-padding);background:#ffffffc7;border-radius:32px;min-width:0}.stage-card{background:linear-gradient(#ffffffd6,#ebf2fabd)}.summary-card{color:var(--ink-strong);background:linear-gradient(#0c1625f0,#19334ee0)}.stage-header{grid-template-columns:minmax(0,1fr) minmax(220px,32ch);align-items:start;gap:.75rem;margin-bottom:.7rem;display:grid}#stage-title{margin-bottom:.2rem;font-size:clamp(1.3rem,2.2vw,1.8rem)}.stage-subtitle{text-align:right;color:#15324cb8;justify-self:end;max-width:32ch;margin:0}.canvas-wrap{padding:var(--stage-frame-padding);background:linear-gradient(135deg,#0a16251f,#ff8f4f1f);border-radius:32px;place-items:center;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #112f4a14}.stage-card.is-stage-preview-hidden .canvas-wrap{min-height:clamp(140px,20vh,180px);box-shadow:none;background:0 0;padding:0}.stage-card.is-stage-preview-hidden canvas{display:none}.stage-card.is-stage-preview-hidden .stage-overlay{min-height:inherit;position:static;inset:auto}.arena-hud{grid-template-columns:repeat(4,minmax(0,1fr));gap:.65rem;margin-bottom:.85rem;display:grid}.arena-chip{background:#07111f14;border:1px solid #112f4a14;border-radius:18px;gap:.12rem;padding:.8rem .9rem;display:grid}.arena-chip span{color:#15324ca8;font-size:.78rem}.arena-chip strong{font-size:1.05rem}canvas{background:linear-gradient(#0b1a2ceb,#182e48eb);border-radius:28px;width:100%;min-height:380px;display:block;box-shadow:inset 0 0 0 1px #ffffff1f}.stage-overlay{pointer-events:none;place-items:center;padding:clamp(.9rem,2vw,1.4rem);display:grid;position:absolute;inset:0}.overlay-card,.overlay-pill,.overlay-countdown{box-shadow:var(--shadow-lg);color:#f9fbff;border:1px solid #fff3}.overlay-card{text-align:center;background:linear-gradient(#07111fe0,#183654e0);border-radius:28px;max-width:30rem;padding:1.3rem 1.45rem}.overlay-pill{background:#07111fcc;border-radius:999px;padding:.9rem 1.1rem}.overlay-countdown{background:linear-gradient(#07111fe6,#183654e6);border-radius:32px;justify-items:center;gap:.3rem;min-width:min(22rem,100vw - 3rem);padding:clamp(1.4rem,3vw,2rem) clamp(1.8rem,4vw,2.6rem);display:grid}.overlay-countdown span{letter-spacing:.18em;text-transform:uppercase;color:#e0efffbd;font-size:.85rem;font-weight:800}.overlay-countdown strong{font-size:clamp(4.5rem,16vw,8rem);line-height:.9}.overlay-pill.live{color:#311303;background:linear-gradient(135deg,#ff7a2fe6,#ffaf46e0);font-weight:800}.summary-stats{grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:.55rem;margin-bottom:.8rem;display:grid}.stat-card{background:#ffffff14;border:1px solid #ffffff14;border-radius:16px;gap:.2rem;padding:.75rem;display:grid}.stat-card span{color:#dfefffb3;font-size:.8rem}.stat-card strong{font-size:1.2rem}.timeline-list li{justify-content:space-between;font-size:.92rem}.timeline-list span,.timeline-empty{color:#dfefffb3}.app-shell.is-active-round{width:100%;max-width:none;min-height:var(--viewport-height);padding:0}.app-shell.is-active-round .hero{display:none}.session-shell.is-active-round{min-height:var(--viewport-height);height:var(--viewport-height);padding:max(var(--active-round-gap), env(safe-area-inset-top)) max(var(--active-round-gap), env(safe-area-inset-right)) max(var(--active-round-gap), env(safe-area-inset-bottom)) max(var(--active-round-gap), env(safe-area-inset-left));grid-template-columns:minmax(0,1fr);gap:0}.session-shell.is-active-round .side-panel{display:none}.session-shell.is-active-round .stage-shell{gap:0;min-width:0;height:100%;min-height:100%}.session-shell.is-active-round .stage-card{background:radial-gradient(circle at top,#ff7e3e1f,#0000 24%),linear-gradient(#f8fbffd6,#e0ebf6cc);border:0;border-radius:28px;flex-direction:column;height:100%;min-height:100%;padding:0;display:flex;overflow:hidden}.session-shell.is-active-round .stage-header,.session-shell.is-active-round .arena-hud,.session-shell.is-active-round .summary-card{display:none}.session-shell.is-active-round .canvas-wrap{min-height:0;padding:max(var(--active-round-gap), var(--stage-frame-padding));background:0 0;border-radius:0;flex:1}.session-shell.is-active-round canvas{border-radius:32px;height:100%;min-height:0}@media (width<=1080px){.hero,.app-shell.has-session .hero{grid-template-columns:1fr}.side-panel{grid-template-columns:repeat(6,minmax(0,1fr))}.panel-block-session,.panel-block-status,.panel-block-highlight,.panel-block-controls{grid-column:span 3}}@media (width<=760px){.app-shell,.app-shell.has-session{width:min(100vw - 1rem,1480px);padding-top:.75rem}.entry-card,.stage-card,.summary-card,.side-panel{border-radius:26px}.stage-header{grid-template-columns:1fr}.arena-hud{grid-template-columns:repeat(2,minmax(0,1fr))}.side-panel{grid-template-columns:1fr}.panel-block-session,.panel-block-status,.panel-block-highlight,.panel-block-controls,.panel-block-participants{grid-column:1/-1}.stage-subtitle{text-align:left;justify-self:start;max-width:none}.participant-row{align-items:flex-start}.participant-list{grid-template-columns:1fr}.session-shell.is-active-round .stage-card{border-radius:24px;padding:0}.session-shell.is-active-round .canvas-wrap{padding:max(.6rem, env(safe-area-inset-bottom))}.session-shell.is-active-round canvas{border-radius:24px;height:100%}}
