:root{color-scheme:dark;--a:#f0d5a0;--ink:#edf3e6;--muted:#a4b6b8;--bg:#0d202a}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:system-ui,-apple-system,sans-serif}button,select{font:inherit}button{cursor:pointer;color:inherit;background:#213c47;border:1px solid #92b4af40;border-radius:14px;padding:13px 16px;font-weight:750;min-height:46px}button:focus-visible,select:focus-visible{outline:3px solid #d8efb1;outline-offset:3px}button:disabled{opacity:.4;cursor:default}button.primary{background:var(--a);color:#152d38;border-color:transparent}button:hover:not(:disabled){filter:brightness(1.1)}[hidden]{display:none!important}.lobby{max-width:1050px;margin:auto;padding:24px 22px 40px}.topline{display:flex;align-items:center;justify-content:space-between;gap:12px}.eyebrow{color:var(--a);font-size:11px;letter-spacing:2.5px;font-weight:850;text-transform:uppercase}.wallet{font-size:15px;padding:10px 16px;border:1px solid #b2c6ad38;border-radius:30px}.hero{position:relative;isolation:isolate;overflow:hidden;min-height:360px;border-radius:30px;margin:24px 0;background:#284d5c}.hero canvas{position:absolute;inset:0;width:100%;height:100%;z-index:-2}.hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,#0b2638bb,#0b26381a),linear-gradient(0deg,#0c202aee,transparent 72%)}.hero-copy{padding:170px 28px 28px;max-width:600px}.hero h1{font-size:clamp(36px,7vw,62px);line-height:1.02;margin:12px 0;font-weight:850;letter-spacing:-2px}.hero p{color:#d0ddd6;line-height:1.6;max-width:460px;margin:14px 0 22px}.row{display:flex;gap:10px;flex-wrap:wrap}.row>*{flex:1}.summary{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:20px 0}.summary div{border-left:2px solid #b9cead44;padding:10px 16px}.summary b{display:block;font-size:26px}.summary small{color:var(--muted);font-size:11px}.section-head{display:flex;align-items:center;justify-content:space-between;margin:25px 0 16px}.section-head h2{font-size:20px;margin:0}.mission-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.mission{padding:18px;text-align:left;position:relative;min-height:125px;background:linear-gradient(135deg,#29454e,#172e3a);border:1px solid #86a5a64a}.mission b{display:block;font-size:24px;color:var(--a);margin-bottom:8px}.mission span{font-size:13px;display:block;line-height:1.4}.mission small{color:#d2d4a6;letter-spacing:1px;display:block;margin-top:9px}.mission.current{border-color:var(--a);box-shadow:inset 0 0 0 1px #efd6a533}.lobby footer{font-size:12px;color:#9aaeb4;text-align:center;padding-top:28px;line-height:1.7}.game{height:100dvh;display:flex;flex-direction:column;max-width:1200px;margin:auto;padding:10px 12px 8px;gap:8px;overflow:hidden}.hud{display:grid;grid-template-columns:1fr auto;align-items:center;gap:14px;flex:none}.hud .mission-name{font-size:11px;color:var(--a);letter-spacing:1px;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.hud strong{font-size:17px}.hud button{width:46px;padding:6px;min-height:46px}.vitals{display:grid;grid-template-columns:1fr auto;gap:14px;align-items:center;font-size:12px;color:var(--muted);min-height:19px}.health{height:6px;background:#34464e;border-radius:6px;overflow:hidden}.health i{display:block;height:100%;background:#ace2ba;transition:width .12s}.stage{position:relative;flex:1;min-height:160px;border:1px solid #8fa9a647;border-radius:20px;overflow:hidden;background:#183641;touch-action:none}.stage canvas{display:block;width:100%;height:100%;touch-action:none}.brief{min-height:19px;text-align:center;font-size:12px;color:#c6d6cf;line-height:1.45;flex:none}.controls{display:flex;align-items:stretch;gap:8px;flex:none;touch-action:none;user-select:none;-webkit-user-select:none}.controls button{flex:1;min-width:0;padding:9px 4px;line-height:1.2;font-size:11px;touch-action:none}.controls button b{display:block;font-size:21px;margin-bottom:5px;pointer-events:none}.controls button.active{background:#667e75;border-color:#c9edb5}.stick{position:relative;flex:0 0 94px;border-radius:24px;min-height:94px;border:1px solid #a3c1b747;background:radial-gradient(circle,#335562,#18333e);touch-action:none}.stick:before{content:'✥';position:absolute;inset:0;display:grid;place-items:center;color:#91b3b65c;font-size:60px}.knob{position:absolute;left:29px;top:29px;width:36px;height:36px;border-radius:50%;background:#afd5c5;border:3px solid #d7e7cd;box-shadow:0 4px 14px #071b29;pointer-events:none}.controls .fire{background:#36564d;color:#def1be}.controls .special{background:#645341;color:#fbe0ac}.controls .movement{background:#29434d}.controls .control-group{display:flex;gap:6px;flex:1}.controls .control-group button{min-height:68px}.status{font-size:12px;color:#ffd4a1;margin:8px 0}.dialog{border:1px solid #8bada66a;border-radius:24px;background:#142e3b;color:var(--ink);width:min(480px,94vw);max-height:88dvh;padding:24px;box-shadow:0 30px 90px #0008}.dialog::backdrop{background:#051922b8;backdrop-filter:blur(5px)}.dialog h2{font-size:29px;letter-spacing:-.8px;margin:8px 0 16px}.dialog p{line-height:1.65;color:#b9cbd0}.dialog .x{float:right;min-height:38px;padding:5px 12px}.dialog .settings-row{display:grid;gap:8px;margin:18px 0}.dialog select{width:100%;background:#274450;color:var(--ink);border:1px solid #809c9d;padding:12px;border-radius:10px}.shop-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px}.skin{padding:16px;background:#24414d;border-radius:16px;text-align:center}.swatch{height:54px;border-radius:14px;margin-bottom:12px;box-shadow:inset 0 0 0 7px #ffffff12}.skin small{display:block;margin:8px 0;color:#b6ccc8}.skin button{width:100%;font-size:12px;padding:10px 4px}.result-score{font-size:44px;color:var(--a);font-weight:850}.result-stars{font-size:26px;letter-spacing:8px;color:#f2cf81}.bonus{padding:13px 16px;background:#29463e;border-radius:12px;margin:18px 0;color:#c7edb6}.no-scroll{overflow:hidden}.contract{padding:14px;background:#28434e;border-radius:12px;margin:10px 0}.record{display:flex;justify-content:space-between;border-bottom:1px solid #93b1a329;padding:11px 0}.wg-large-controls .controls button{min-height:82px}@media(min-width:800px){.hero{min-height:420px}.hero-copy{padding-top:200px}.mission-grid{grid-template-columns:repeat(4,1fr)}.game{padding:14px 24px}.controls{max-width:700px;align-self:center;width:100%}.controls button{font-size:12px}.stage{width:100%;align-self:center}}@media(max-width:420px){.lobby{padding:18px 14px 30px}.hero-copy{padding:160px 20px 22px}.hero h1{font-size:40px}.mission-grid{gap:8px}.mission{padding:12px;min-height:126px}.mission span{font-size:11px}.summary div{padding:8px}.game{padding:7px 8px}.controls{gap:5px}.controls button{font-size:10px;border-radius:12px}.stick{flex-basis:86px;min-height:86px}.knob{left:25px;top:25px}.controls .control-group{gap:4px}.dialog{padding:20px}}@media(max-height:480px){.game{padding:4px 10px;gap:3px}.hud .mission-name{display:none}.hud strong{font-size:13px}.hud button{min-height:32px;height:32px;width:42px}.vitals{position:absolute;left:20px;right:80px;top:27px;z-index:1;pointer-events:none}.health{max-width:180px}.stage{min-height:100px}.brief{display:none}.controls{position:absolute;bottom:13px;left:20px;right:20px;width:auto;max-width:none;pointer-events:none;z-index:2;opacity:.88}.controls button,.stick{pointer-events:auto;max-width:90px}.controls .control-group{justify-content:flex-end;pointer-events:none}.controls .control-group:first-child{justify-content:flex-start}.controls button{min-height:52px}.stick{min-height:72px;flex-basis:72px}.knob{left:18px;top:18px}.controls button b{font-size:18px}.controls .control-group button{min-height:52px}}


[data-action][aria-pressed="true"]{background:#a9e5d6!important;color:#123342!important;border-color:#d3f4e8!important;box-shadow:inset 0 -3px 0 #2d807c;}
body[data-action-game="tabletenis"] #controls{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:5px;}
body[data-action-game="tabletenis"] #controls button{min-height:44px;padding:6px 4px;}

@media(max-height:480px){body[data-action-game="tabletenis"] #controls{grid-template-columns:repeat(8,minmax(0,1fr));left:10px;right:10px;}body[data-action-game="tabletenis"] #controls button{max-width:none;min-height:44px;font-size:9px}}

.hud:has(.wg-inline-options){grid-template-columns:minmax(0,1fr) auto auto;gap:6px}.hud>div{min-width:0}.hud .wg-inline-options{pointer-events:auto;width:44px;min-height:44px;padding:6px}

/* Soccer match information stays in the reserved header, outside the pitch. */
body[data-action-game="soccer"] .hud strong{font-variant-numeric:tabular-nums;font-size:clamp(17px,3.8vw,23px);letter-spacing:.06em}
body[data-action-game="soccer"] .vitals{display:block;text-align:center}
body[data-action-game="soccer"] .vitals .health{display:none}
@media(max-height:480px){body[data-action-game="soccer"] .vitals{position:static;min-height:14px;font-size:10px}body[data-action-game="soccer"] .hud strong{font-size:16px}}

/* Visible readiness without moving or disabling the focused control. */
body[data-action-game="skycombat"] #controls button[data-action="roll"],body[data-action-game="skycombat"] #controls button[data-action="bomb"]{position:relative;background-image:linear-gradient(90deg,#68c9b044 var(--ability-ready,100%),#75818c20 var(--ability-ready,100%));background-size:100% 4px;background-position:bottom;background-repeat:no-repeat}
#controls .ability-status{display:block;min-height:1em;font-size:11px;font-weight:700;line-height:1.1}#controls button[aria-disabled="true"]{opacity:.68}

/* Commando: grouped 2×2 controls keep aim and action targets usable on narrow phones. */
body[data-action-game="commando"] #controls .control-group{display:grid;grid-template-columns:repeat(2,minmax(44px,1fr));gap:6px;min-width:0}
body[data-action-game="commando"] #controls .control-group button{min-width:44px;min-height:52px}
@media(max-height:480px){body[data-action-game="commando"] #controls .control-group button{min-height:44px}}
