@scope (.tas-game-host) {
:scope{color-scheme:dark;--bg:#071426;--panel:#0d2137;--line:#21415e;--fire:#ff6a2a;--water:#2dbbff;--gold:#ffd167;display:flex;justify-content:center;align-items:flex-start;width:100%;max-width:100%;color:#fff;font-family:Inter,"Segoe UI",Arial,sans-serif}
*{box-sizing:border-box}
html,body{margin:0;min-height:100%;background:radial-gradient(circle at 50% -20%,#183b5d 0,#071426 58%,#030914 100%);font-family:Inter,"Segoe UI",Arial,sans-serif;color:#fff;overscroll-behavior:none}
body{display:grid;place-items:center;padding:16px}
button{font:inherit;color:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent}
.game-shell{width:min(1180px,100%,calc((100dvh - 190px)*16/9));margin-inline:auto;background:rgba(7,20,38,.92);border:1px solid #24445f;border-radius:18px;overflow:hidden;box-shadow:0 24px 80px #0009,0 0 60px #2384c414}
.topbar{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--line);background:#0a1a2dcc}
.brand{font-weight:900;letter-spacing:1.8px}.brand b{color:#69839a;margin:0 5px}.fire-dot{color:var(--fire);text-shadow:0 0 14px var(--fire)}.water-dot{color:var(--water);text-shadow:0 0 14px var(--water)}
.actions{display:flex;gap:7px}.actions button,.statusbar button{border:1px solid #294b67;background:#102a42;border-radius:9px;padding:8px 12px}.actions button:hover,.statusbar button:hover{background:#183a56}
.stage-wrap{position:relative;aspect-ratio:16/9;background:#06101e;overflow:hidden}
canvas{display:block;width:100%;height:100%;touch-action:none}
.overlay{position:absolute;inset:0;display:none;place-items:center;background:#03101bd6;backdrop-filter:blur(5px);z-index:5;padding:20px}.overlay.open{display:grid}
.panel{text-align:center;width:min(520px,95%);padding:34px 38px;border-radius:20px;border:1px solid #315472;background:linear-gradient(150deg,#142e48f2,#091828f2);box-shadow:0 20px 55px #0008}.panel.small{width:min(420px,94%)}
.selector-panel{width:min(780px,97%);max-height:calc(100% - 16px);overflow:hidden;padding:9px 18px}.selector-panel .emblem{display:none}.selector-panel h1{font-size:clamp(23px,3.2vw,30px);margin:0 0 2px}.selector-intro{margin:2px 0 7px!important;font-size:13px;line-height:1.3!important}.temple-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px}.temple-card{display:grid;grid-template-columns:31px 1fr;grid-template-rows:auto auto;align-items:center;text-align:left;gap:0 6px;min-height:47px;padding:4px 7px;border:1px solid #31516a;border-radius:9px;background:#0b1c2e}.temple-card>span{grid-row:1/3;font-size:22px;text-align:center}.temple-card b{font-size:12px}.temple-card small{font-size:9px;color:#8eabbf}.temple-card.selected{border-color:#ffd167;background:#17334d;box-shadow:0 0 14px #ffd16733}.temple-card.locked{opacity:.43;cursor:not-allowed}.temple-info{min-height:17px;margin:4px 0!important;color:#ffd98a!important;font-size:11px;line-height:1.25!important}.level-grid{display:grid;grid-template-columns:repeat(10,1fr);gap:5px}.level-choice{min-width:0;height:29px;border:1px solid #31516a;border-radius:7px;background:#0b1c2e;font-size:12px;font-weight:800}.level-choice.selected{border-color:#ff7543;background:#d94c32;box-shadow:0 0 10px #ff5b2855}.level-choice.locked{opacity:.4;cursor:not-allowed}.selector-panel .control-help{margin:6px 0 5px;gap:7px}.selector-panel .control-help span{padding:5px 9px;font-size:11px}.selector-panel .primary{padding:8px 20px;font-size:13px}
.emblem{display:flex;justify-content:center;gap:25px;font-size:55px;filter:drop-shadow(0 0 18px #fff3)}.panel h1,.panel h2{color:#fff}.panel h1{margin:10px 0 8px;font-size:clamp(28px,5vw,46px)}.panel p{color:#b8cad8;line-height:1.55}.control-help{display:flex;justify-content:center;gap:13px;flex-wrap:wrap;margin:20px 0}.control-help span{color:#dceaf4;background:#081727;border:1px solid #26465f;border-radius:10px;padding:9px 14px;font-size:14px}.mobile-help{display:none}.primary{border:0;border-radius:11px;padding:13px 28px;font-weight:900;letter-spacing:.5px;background:linear-gradient(135deg,#ff7b35,#f03e33);box-shadow:0 8px 25px #e6493050}.primary:hover{filter:brightness(1.12);transform:translateY(-1px)}
.big-icon{font-size:54px}.pause-card{font-size:30px;font-weight:900;text-align:center;letter-spacing:2px}.pause-card small{display:block;font-size:13px;font-weight:400;letter-spacing:0;color:#adc1d1;margin-top:10px}
.statusbar{display:grid;grid-template-columns:1fr 1.25fr 1fr 1.25fr auto;gap:8px;align-items:center;padding:12px 18px;border-top:1px solid var(--line);background:#0a1a2d}.statusbar>div{min-width:0;text-align:center}.statusbar small{display:block;color:#7791a6;font-size:10px;letter-spacing:1px}.statusbar strong{font-size:16px}.statusbar .fire strong{color:#ff8d50}.statusbar .water strong{color:#54caff}.statusbar button{font-size:12px;font-weight:800}
.mobile-controls{display:none;padding:10px 14px 14px;background:#081827;border-top:1px solid var(--line)}.mobile-instruction{display:none;margin:0 0 9px;text-align:center;color:#c9d9e6;font-size:12px;line-height:1.4}.mobile-instruction b{color:#fff}.player-select{display:flex;justify-content:center;gap:8px;margin-bottom:10px}.player-select button{border:1px solid #31516a;background:#10263a;border-radius:20px;padding:7px 18px;opacity:.6}.player-select .active{opacity:1;border-color:currentColor}.fire-select{color:#ff8850}.water-select{color:#50c9ff}.pad{display:grid;grid-template-columns:72px 72px 72px;gap:14px;justify-content:center}.pad button{height:54px;border:1px solid #41647d;border-radius:14px;background:linear-gradient(#183b57,#0c2337);font-size:22px;box-shadow:inset 0 1px #ffffff1a,0 5px 12px #0005}.pad button:active,.pad button.pressed{transform:translateY(2px);filter:brightness(1.3)}.pad .jump{background:linear-gradient(#29506a,#123149)}
@media(pointer:coarse),(max-width:820px){:scope{display:block}.game-shell{width:100%;max-width:100%;margin:0;border:0;border-radius:0;min-height:0}.stage-wrap{overflow:visible}.mobile-controls{display:block}.desktop-help{display:none}.mobile-help{display:flex;gap:5px;margin:5px 0}.mobile-instruction{display:block}.topbar{height:48px}.statusbar{padding:8px;grid-template-columns:1fr 1fr 1fr 1fr}.statusbar button{grid-column:1/-1;padding:6px}.statusbar small{font-size:8px}.statusbar strong{font-size:13px}.brand{font-size:14px}.actions{gap:4px}.actions button{padding:6px 8px}.overlay{padding:7px}.overlay.open#startPanel{position:fixed;inset:0;z-index:9999;display:block;min-height:100dvh;overflow-y:auto;padding:10px 6px 24px;background:#03101bf2}.panel{width:min(350px,calc(100% - 8px));padding:14px 10px;border-radius:16px}.panel h1{font-size:clamp(22px,7vw,30px);margin:4px 0}.panel p{font-size:12px;margin:5px 0}.emblem{font-size:30px;gap:18px}.selector-panel{width:min(520px,calc(100% - 4px));max-height:none;overflow:visible;margin:0 auto;padding:9px 8px}.selector-panel h1{font-size:23px;margin:0 0 2px}.selector-intro{font-size:11px!important}.temple-grid{grid-template-columns:repeat(2,1fr);gap:4px}.temple-card{min-height:43px;padding:3px 5px}.temple-card>span{font-size:18px}.temple-card b{font-size:10px}.temple-card small{font-size:8px}.temple-info{margin:3px 0!important;min-height:15px;font-size:10px}.level-grid{grid-template-columns:repeat(5,1fr);gap:4px}.level-choice{height:27px}.control-help span{padding:4px 6px;font-size:10px}.selector-panel .primary{padding:8px 15px;font-size:11px}.primary{padding:9px 18px;font-size:12px}}
@media(max-height:550px) and (orientation:landscape){body{padding:0}.game-shell{display:grid;grid-template-columns:1fr 180px;grid-template-rows:42px auto 50px;border:0;border-radius:0}.topbar{grid-column:1/-1;height:42px}.stage-wrap{grid-column:1;grid-row:2/4}.statusbar{grid-column:2;grid-row:2;display:flex;flex-direction:column;justify-content:center}.mobile-controls{grid-column:2;grid-row:3;padding:4px}.player-select{position:absolute;right:4px;top:47px;z-index:4}.player-select button{padding:4px 9px}.pad{grid-template-columns:48px 48px 48px;gap:5px}.pad button{height:42px}.statusbar button{width:100%}}
}