:root{color-scheme:light;--paper:#fffaf6;--ink:#182033;--muted:#6e7482;--coral:#ff675d;--red:#ef625b;--blue:#4aa9e8;--navy:#111a2c;--navy-2:#17233a;--line:#e9e3df;--lime:#b9f26c;background:var(--paper);color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Microsoft YaHei,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{background:radial-gradient(circle at 12% 8%, #fff 0, transparent 25%), var(--paper);min-width:320px;margin:0}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible{outline-offset:3px;outline:3px solid #ff675d6b}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.demo-header{grid-template-columns:1fr auto 1fr;align-items:center;width:min(1440px,100% - 48px);height:70px;margin:0 auto;display:grid}.back-link{color:#626876;justify-self:start;align-items:center;gap:8px;font-size:14px;font-weight:650;transition:color .2s,transform .2s;display:inline-flex}.back-link:hover{color:var(--coral);transform:translate(-3px)}.demo-brand{align-items:center;display:flex}.demo-brand-logo{width:150px;height:auto;display:block}.local-badge{color:#777b85;background:#ffffffb8;border:1px solid #e5dfdb;border-radius:999px;justify-self:end;align-items:center;gap:6px;padding:7px 11px;font-size:13px;font-weight:650;display:inline-flex}main{width:min(1440px,100% - 48px);margin:0 auto}.demo-intro{padding:28px 0 30px}.intro-copy{max-width:900px}.eyebrow{color:var(--coral);letter-spacing:.16em;align-items:center;gap:7px;font-size:13px;font-weight:850;display:inline-flex}.intro-copy h1{letter-spacing:-.05em;margin:13px 0 12px;font-size:clamp(34px,3.3vw,48px);line-height:1.12}.intro-copy h1 span{color:var(--coral)}.intro-copy p{max-width:780px;color:var(--muted);margin:0;font-size:16px;line-height:1.7}.game-console{background:var(--navy);color:#f7f9ff;border:1px solid #2d3850;border-radius:22px;overflow:hidden;box-shadow:0 34px 90px #281f2333}.console-topbar{background:linear-gradient(90deg,#111a2c,#0d1626);border-bottom:1px solid #ffffff14;grid-template-columns:1fr auto auto;align-items:center;gap:22px;min-height:68px;padding:0 18px;display:grid}.live-title{color:#e9eff9;align-items:center;gap:11px;display:flex}.live-host-avatar{color:#fff;background:linear-gradient(145deg,#ff746a,#c9527a);border:2px solid #ff7068;border-radius:50%;flex:none;place-items:center;width:40px;height:40px;font-size:15px;font-weight:900;display:grid;box-shadow:0 0 0 3px #ff675d21}.live-host-copy{min-width:0}.live-host-copy strong,.live-host-copy small{align-items:center;display:flex}.live-host-copy strong{font-size:15px}.live-host-copy small{color:#8492a8;gap:6px;margin-top:4px;font-size:12px;font-weight:650}.live-dot{background:#ff6259;border-radius:50%;width:7px;height:7px;animation:1.8s infinite pulse;display:inline-block;box-shadow:0 0 0 4px #ff62591f}.round-status{color:#8f9db2;align-items:center;gap:10px;font-size:13px;display:flex}.status-divider{background:#4f5e75;border-radius:50%;width:3px;height:3px}.topbar-actions{justify-self:end;align-items:center;gap:7px;display:flex}.live-audience{color:#aab5c7;background:#ffffff09;border:1px solid #ffffff14;border-radius:999px;align-items:center;gap:6px;margin-right:3px;padding:7px 10px;font-size:12px;font-weight:650;display:inline-flex}.icon-button{color:#aeb9cb;background:#ffffff0a;border:1px solid #ffffff17;border-radius:9px;place-items:center;width:34px;height:34px;transition:all .2s;display:grid}.icon-button:hover{color:#fff;background:#ffffff14;border-color:#ffffff38}.play-icon,.is-paused .pause-icon{display:none}.is-paused .play-icon{display:block}.console-grid{grid-template-columns:minmax(0,1fr) 340px;display:grid}.battle-column{background:#101a2c;min-width:0}.battle-stage{aspect-ratio:16/9;isolation:isolate;background:#173b51;position:relative;overflow:hidden}#battle-canvas{z-index:2;width:100%;height:100%;image-rendering:pixelated;position:absolute;inset:0}.asset-loader{z-index:12;color:#e9eff9;background:radial-gradient(circle,#23344ce0,#0a111df5);justify-content:center;align-items:center;gap:14px;transition:opacity .35s,visibility .35s;display:flex;position:absolute;inset:0}.asset-loader.is-hidden{opacity:0;visibility:hidden;pointer-events:none}.asset-loader strong,.asset-loader small{display:block}.asset-loader strong{font-size:14px}.asset-loader small{color:#8796ad;margin-top:4px;font-size:11px}.loader-orbit{border:1px solid #ffffff1c;border-radius:50%;width:37px;height:37px;position:relative}.loader-orbit:before,.loader-orbit:after{content:"";border-radius:50%;position:absolute}.loader-orbit:before{border:1px solid #b9f26c40;inset:7px}.loader-orbit:after{background:var(--lime);transform-origin:3px 21px;width:7px;height:7px;animation:1.1s linear infinite orbit;top:-3px;left:15px;box-shadow:0 0 12px #b9f26cb3}.loader-orbit i{background:linear-gradient(135deg, var(--coral), #bd7dff);border-radius:2px;width:7px;height:7px;position:absolute;top:14px;left:14px;transform:rotate(45deg)}.loader-progress{color:#8d9bb0;text-align:center;background:#ffffff09;border:1px solid #ffffff17;border-radius:7px;min-width:47px;padding:5px 7px;font:11px ui-monospace,monospace}.score-hud{z-index:7;pointer-events:none;grid-template-columns:1fr 94px 1fr;align-items:center;gap:10px;width:min(610px,100% - 32px);display:grid;position:absolute;top:15px;left:50%;transform:translate(-50%)}.team-score{backdrop-filter:blur(8px);background:#0a111dbf;border:1px solid #ffffff1f;border-radius:12px;align-items:center;gap:5px 9px;padding:8px 12px;display:grid;box-shadow:0 8px 22px #00000029}.team-score-red{grid-template-columns:1fr auto}.team-score-blue{grid-template-columns:auto 1fr}.team-score-blue span{text-align:right}.team-score span{color:#d6dce7;font-size:12px;font-weight:750}.team-score strong{letter-spacing:-.04em;font-size:19px}.team-score-red strong{color:#ff827a}.team-score-blue strong{color:#65c2ff}.core-health{background:#ffffff1a;border-radius:99px;grid-column:1/-1;height:5px;overflow:hidden}.core-health i{border-radius:inherit;width:100%;height:100%;transition:width .25s;display:block}.team-score-red i{background:linear-gradient(90deg,#bb3737,#ff786e);margin-left:auto}.team-score-blue i{background:linear-gradient(90deg,#51b8ef,#236fb5)}.battle-phase{text-align:center;text-shadow:0 2px 8px #000000a6}.battle-phase small,.battle-phase span{color:#ffffffad;letter-spacing:.06em;font-size:11px;font-weight:800;display:block}.battle-phase strong{margin:2px 0;font:700 18px ui-monospace,monospace;display:block}.battle-phase.is-final small{color:#ffe479}.barrage-layer{z-index:8;pointer-events:none;height:112px;position:absolute;inset:68px 0 auto;overflow:hidden}.barrage{color:#f2f5fb;white-space:nowrap;max-width:320px;animation:barrage-run var(--duration,7s) linear forwards;background:#080e18ba;border:1px solid #ffffff1f;border-radius:999px;align-items:center;gap:7px;padding:7px 11px;font-size:12px;display:inline-flex;position:absolute;right:-340px;box-shadow:0 8px 24px #0000002e}.barrage i{background:var(--barrage-color,#fff);width:7px;height:7px;box-shadow:0 0 8px var(--barrage-color,#fff);border-radius:50%}.stage-live-caption{z-index:7;color:#fff;text-shadow:0 1px 5px #000000b3;pointer-events:none;background:linear-gradient(90deg,#070d17c7,#070d1752);border-radius:10px;flex-direction:column;gap:3px;max-width:280px;padding:8px 11px;display:flex;position:absolute;bottom:17px;left:18px}.stage-live-caption strong{font-size:13px}.stage-live-caption span{color:#ffffffb8;font-size:11px}.event-toast{z-index:9;color:#f4f7fc;opacity:0;pointer-events:none;background:#09101be0;border:1px solid #ffffff1f;border-radius:10px;padding:9px 14px;font-size:13px;font-weight:650;transition:opacity .2s,transform .2s;position:absolute;bottom:18px;left:50%;transform:translate(-50%,18px);box-shadow:0 10px 35px #00000040}.event-toast.is-visible{opacity:1;transform:translate(-50%)}.round-result{z-index:11;text-align:center;backdrop-filter:blur(8px);background:#0a111dc4;align-content:center;place-items:center;position:absolute;inset:0}.round-result:not([hidden]){display:grid}.round-result>span{color:var(--lime);letter-spacing:.2em;font-size:11px;font-weight:900}.round-result h2{margin:10px 0 5px;font-size:34px}.round-result p{color:#a8b4c8;margin:0 0 20px;font-size:14px}.round-result button{color:#111827;background:var(--lime);border:0;border-radius:10px;align-items:center;gap:8px;padding:11px 16px;font-size:14px;font-weight:800;display:inline-flex}.interaction-panel{background:linear-gradient(#111c30,#0f192a);border-top:1px solid #ffffff14;padding:17px 18px 15px}.interaction-heading{justify-content:space-between;align-items:end;gap:16px;margin-bottom:12px;display:flex}.interaction-heading>div:first-child{flex-direction:column;gap:4px;display:flex}.interaction-heading>div:first-child span{color:#ff8078;letter-spacing:.04em;align-items:center;gap:6px;font-size:12px;font-weight:800;display:inline-flex}.interaction-heading>div:first-child strong{color:#eef3fb;font-size:15px}.identity-row{grid-template-columns:minmax(190px,.42fr) minmax(0,1fr);align-items:stretch;gap:10px;display:grid}.identity-field{flex-direction:column;gap:6px;display:flex}.identity-field label{color:#8d9ab0;font-size:12px;font-weight:700}.input-wrap{background:#ffffff0a;border:1px solid #ffffff1c;border-radius:9px;align-items:center;gap:7px;padding:0 10px;display:flex}.input-wrap span{color:#66758e;font-size:12px}.input-wrap input{color:#fff;background:0 0;border:0;outline:0;width:100%;height:52px;padding:0;font-size:14px}.input-wrap:focus-within{border-color:#7086a6;box-shadow:0 0 0 3px #5c7aa421}.team-affinity{color:#8e9cb2;background:#ffffff08;border:1px solid #ffffff14;border-radius:999px;padding:7px 10px;font-size:12px;font-weight:800}.team-affinity.is-red{color:#ff8a82;background:#ef625b14;border-color:#ef625b38}.team-affinity.is-blue{color:#73c7fb;background:#4aa9e814;border-color:#4aa9e838}.action-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px;display:grid}.action-button{color:#e9eef8;text-align:left;background:#ffffff09;border:1px solid #ffffff14;border-radius:12px;grid-template-columns:38px 1fr auto;align-items:center;gap:9px;min-height:78px;padding:10px 11px;transition:transform .15s,border-color .15s,background .15s;display:grid;position:relative}.action-button:hover{background:#fff1;border-color:#ffffff30;transform:translateY(-2px)}.action-button:active{transform:translateY(0)scale(.985)}.action-button:disabled{cursor:not-allowed;opacity:.48;transform:none}.action-icon{border-radius:10px;place-items:center;width:38px;height:38px;display:grid}.action-red .action-icon{color:#ff8179;background:#ff675d1f}.action-blue .action-icon{color:#6ac3ff;background:#43a7ec1f}.action-charge .action-icon{color:#f7cf69;background:#f7cf691a}.action-volley .action-icon{color:#a7c8ff;background:#6da0ff1a}.action-heal .action-icon{color:#9de89b;background:#69da7e1a}.action-reinforce .action-icon{color:#e2b6ff;background:#c074ff1c}.action-button strong,.action-button small{display:block}.action-button strong{font-size:14px}.action-button small{color:#8593a8;margin-top:4px;font-size:12px;line-height:1.35}kbd{color:#6f7e96;background:#ffffff09;border:1px solid #ffffff1a;border-radius:5px;place-items:center;min-width:20px;height:20px;padding:0 5px;font:11px/1 ui-monospace,monospace;display:inline-grid;box-shadow:inset 0 -1px #ffffff0d}.keyboard-hint{color:#728198;text-align:right;margin:10px 0 0;font-size:11px}.keyboard-hint kbd{min-width:16px;height:16px}.data-rail{background:#ffffff14;border-left:1px solid #ffffff14;flex-direction:column;gap:1px;display:flex}.rail-card{background:#111c2f;padding:19px 20px}.room-welcome-card{background:radial-gradient(circle at 100% 0,#ff675d29,#0000 45%),#121d31;padding:22px 20px 20px;position:relative;overflow:hidden}.room-welcome-card:after{content:"";border:1px solid #ff675d2e;border-radius:50%;width:90px;height:90px;position:absolute;bottom:-54px;right:-42px}.room-live-label{color:#ff8179;align-items:center;gap:7px;font-size:12px;font-weight:800;display:flex}.room-live-label i{color:#fff;letter-spacing:.12em;background:#ff6259;border-radius:6px;margin-left:auto;padding:4px 7px;font-size:10px;font-style:normal}.room-welcome-card h2{letter-spacing:-.02em;margin:13px 0 8px;font-size:20px}.room-welcome-card p{color:#8f9db1;margin:0;font-size:14px;line-height:1.65}.room-signal{color:#aeb9c9;align-items:center;gap:7px;margin-top:15px;font-size:12px;display:flex}.room-signal i{background:var(--lime);border-radius:50%;width:7px;height:7px;box-shadow:0 0 10px #b9f26c8c}.leaderboard-card{min-height:240px}.event-card{flex:1;min-height:236px}.rail-heading{justify-content:space-between;align-items:start;margin-bottom:14px;display:flex}.rail-heading span{color:#74859d;letter-spacing:.16em;font-size:11px;font-weight:850}.rail-heading h2{margin:5px 0 0;font-size:17px}.live-pill{background:#b9f26c12;border:1px solid #b9f26c21;border-radius:99px;padding:4px 7px;color:var(--lime)!important;letter-spacing:.05em!important}.leaderboard{margin:0;padding:0;list-style:none}.leaderboard li{border-bottom:1px solid #ffffff0e;grid-template-columns:24px 1fr auto;align-items:center;gap:9px;min-height:44px;display:grid}.leaderboard li:last-child{border-bottom:0}.leaderboard .rank{color:#6f7f96;font:12px ui-monospace,monospace}.leaderboard .player{min-width:0}.leaderboard .player strong,.leaderboard .player span{text-overflow:ellipsis;white-space:nowrap;display:block;overflow:hidden}.leaderboard .player strong{color:#e4ebf6;font-size:13px}.leaderboard .player span{color:#75869e;margin-top:3px;font-size:11px}.leaderboard .points{font-size:13px;font-weight:850}.leaderboard .team-red .points{color:#ff8179}.leaderboard .team-blue .points{color:#64bdfa}.leaderboard .empty-row{color:#738198;text-align:center;border:1px dashed #ffffff14;border-radius:10px;justify-content:center;font-size:12px;display:flex}.event-log{flex-direction:column;display:flex}.log-item{border-bottom:1px solid #ffffff0b;grid-template-columns:39px 1fr;gap:9px;padding:8px 0;animation:.25s log-in;display:grid}.log-item:last-child{border-bottom:0}.log-time{color:#687991;font:11px ui-monospace,monospace}.log-copy{color:#a9b5c7;font-size:12px;line-height:1.5}.log-copy strong{color:#d9e1ee}.ability-card{background:linear-gradient(145deg,#b9f26c1c,#68beff0f),#111c2f;gap:11px;padding:16px 17px;display:flex}.ability-icon{width:34px;height:34px;color:var(--lime);background:#b9f26c14;border-radius:10px;flex:none;place-items:center;display:grid}.ability-card strong{font-size:13px}.ability-card p{color:#8391a7;margin:5px 0 0;font-size:12px;line-height:1.55}.asset-credit{color:#7b8290;margin:16px 4px 0;font-size:12px;line-height:1.65}.asset-credit a{color:#596273;text-underline-offset:3px;font-weight:750;text-decoration:underline #59627359}.asset-credit a:hover{color:var(--coral);text-decoration-color:currentColor}.demo-footer-cta{justify-content:space-between;align-items:center;gap:30px;padding:76px 4px;display:flex}.demo-footer-cta span{color:var(--coral);letter-spacing:.16em;font-size:11px;font-weight:900}.demo-footer-cta h2{letter-spacing:-.045em;margin:8px 0 0;font-size:clamp(26px,3vw,42px)}.demo-footer-cta a{color:#fff;background:var(--coral);border-radius:12px;flex:none;align-items:center;gap:9px;padding:14px 19px;font-size:14px;font-weight:800;transition:transform .2s,box-shadow .2s;display:inline-flex;box-shadow:0 12px 28px #ff675d33}.demo-footer-cta a:hover{transform:translateY(-2px);box-shadow:0 16px 35px #ff675d47}@keyframes barrage-run{to{transform:translate(calc(-100vw - 440px))}}@keyframes pulse{50%{opacity:.55;box-shadow:0 0 0 7px #ff62590d}}@keyframes log-in{0%{opacity:0;transform:translateY(-5px)}}@keyframes orbit{to{transform:rotate(360deg)}}@media (width<=1180px){.console-grid{grid-template-columns:1fr 300px}.action-grid{grid-template-columns:repeat(2,1fr)}}@media (width<=900px){.console-grid{grid-template-columns:1fr}.data-rail{border-top:1px solid #ffffff14;border-left:0;grid-template-columns:1fr 1fr;display:grid}.room-welcome-card,.ability-card{grid-column:1/-1}.leaderboard-card,.event-card{min-height:245px}}@media (width<=640px){.demo-header,main{width:min(100% - 28px,1440px)}.demo-header{grid-template-columns:1fr auto;height:62px}.demo-brand{justify-self:end}.local-badge{display:none}.demo-intro{padding:30px 0 26px}.intro-copy h1{font-size:clamp(34px,10vw,46px)}.intro-copy h1 span{display:block}.intro-copy p{font-size:15px}.game-console{border-radius:18px;margin-inline:-6px}.console-topbar{grid-template-columns:1fr auto;min-height:64px;padding-inline:14px}.round-status,.live-audience{display:none}.battle-stage{aspect-ratio:5/3}.score-hud{grid-template-columns:1fr 64px 1fr;gap:4px;width:calc(100% - 14px);top:8px}.team-score{border-radius:8px;padding:6px 7px}.team-score span{font-size:10px}.team-score strong{font-size:15px}.core-health{height:3px}.battle-phase strong{font-size:13px}.battle-phase small{font-size:10px}.battle-phase span{display:none}.barrage-layer{height:74px;top:54px}.barrage{padding:5px 8px;font-size:11px}.stage-live-caption{max-width:210px;padding:6px 8px;bottom:7px;left:8px}.stage-live-caption strong{font-size:11px}.stage-live-caption span{font-size:10px}.event-toast{white-space:nowrap;max-width:calc(100% - 20px);padding:6px 9px;font-size:11px;bottom:8px}.round-result h2{font-size:26px}.interaction-panel{padding:12px}.interaction-heading{align-items:start}.interaction-heading>div:first-child strong{font-size:14px}.identity-row{grid-template-columns:1fr;gap:8px}.identity-field{grid-template-columns:1fr;gap:6px}.action-scroller{scrollbar-width:none;margin-inline:-12px;padding:0 12px 7px;overflow-x:auto}.action-scroller::-webkit-scrollbar{display:none}.action-grid{gap:7px;width:max-content;display:flex}.action-button{grid-template-columns:34px 1fr;width:174px;min-height:66px;padding:8px 10px}.action-icon{width:30px;height:30px}.action-button kbd,.action-button small,.keyboard-hint{display:none}.data-rail{grid-template-columns:1fr}.room-welcome-card,.ability-card{grid-column:auto}.demo-footer-cta{flex-direction:column;align-items:start;padding:55px 3px}}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}