@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Outfit:wght@400;500;600;700;800;900&display=swap');
:root{color-scheme:dark;--bg:#201a35;--ink:#f9f3e8;--muted:#aaa1b8;--lime:#e1f594;--pink:#eaa2ba}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:'DM Sans',sans-serif}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}button:disabled{opacity:.45;cursor:default}button:focus-visible,a:focus-visible{outline:3px solid var(--lime);outline-offset:4px}.app{max-width:1600px;min-height:100svh;margin:auto;padding:28px 4vw 15px;display:flex;flex-direction:column}header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px}.brand{display:flex;gap:12px;color:inherit;text-decoration:none;align-items:center}.brand-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid #72637f;border-radius:14px;font-size:35px;color:var(--pink)}.brand small{display:block;font-size:8px;font-weight:700;letter-spacing:3px;margin-bottom:3px}.brand strong{font:800 22px 'Outfit',sans-serif;letter-spacing:-.6px}.brand b{color:var(--pink)}.tools{display:flex;gap:10px}.tools button{background:none;border:1px solid #594f69;color:var(--ink);border-radius:50%;width:40px;height:40px;font-size:20px}main{flex:1;display:grid;grid-template-columns:260px minmax(0,1fr);gap:4vw;align-items:center}aside{padding-bottom:10px}.eyebrow{font-size:9px;letter-spacing:2px;color:var(--pink);font-weight:700}h1{font:700 clamp(42px,4.7vw,72px)/1 'Outfit',sans-serif;letter-spacing:-3px;margin:24px 0}h1 em{font-style:normal;color:var(--lime)}.intro{font-size:15px;line-height:1.6;color:var(--muted)}.chapter{border-top:1px solid #4a405d;margin-top:40px;padding-top:25px}.chapter>span{font-size:9px;letter-spacing:1.5px;color:var(--muted)}.chapter strong{display:block;font:600 30px 'Outfit';margin:8px 0 16px}.dots{display:flex;gap:6px}.dots i{width:23px;height:4px;border-radius:5px;background:#4a405d}.dots i.active{background:var(--lime)}.side-note{display:flex;gap:14px;align-items:center;margin-top:25px}.side-note>span{font:36px 'Outfit';color:var(--pink)}.side-note p{font-size:11px;line-height:1.8;color:var(--ink)}.side-note small{font-size:10px;color:var(--muted)}.game{overflow:hidden;border-radius:22px;border:1px solid #61526c;background:#2b233e;box-shadow:0 25px 70px #0c061a55}.game-top{padding:19px 25px;display:flex;align-items:center;justify-content:space-between;gap:10px}.label{display:block;color:var(--muted);font-size:9px;letter-spacing:2px;margin-bottom:5px}.game-top strong{font-size:13px;font-weight:500}.ammo{text-align:right}.ammo #ammo{display:flex;gap:6px;height:15px;align-items:center}.ammo i{width:11px;height:11px;border-radius:50%;background:var(--lime);box-shadow:inset -3px -3px #5d7551}.ammo i.used{background:#51475e;box-shadow:none}.stage{position:relative;background:#ead7be;aspect-ratio:900/570;max-height:65svh}canvas{width:100%;height:100%;display:block;touch-action:none}.hint{position:absolute;bottom:16px;left:50%;transform:translateX(-50%);white-space:nowrap;font-size:11px;font-weight:600;color:#655744;background:#fff4dcdd;padding:10px 16px;border-radius:20px;pointer-events:none}.hint span{margin-left:8px}.game-bottom{padding:19px 24px;display:flex;gap:13px;align-items:center}.progress{flex:1;margin-right:12px}.progress-copy{display:flex;justify-content:space-between;align-items:center;margin-bottom:9px;font-size:9px;letter-spacing:1px}.progress-copy span{color:var(--muted)}.progress-copy strong{color:var(--lime);font-size:12px}.track{height:5px;border-radius:9px;background:#51475e;position:relative}.track>div{background:var(--lime);height:100%;width:0;border-radius:9px;transition:width .3s}.track i{height:9px;position:absolute;left:75%;top:-2px;width:2px;background:#fff8}.primary{background:var(--lime);border:0;color:#283322;font-size:13px;font-weight:700;border-radius:10px;padding:13px 20px;white-space:nowrap}.secondary{border:1px solid #5d506d;background:transparent;color:var(--ink);border-radius:10px;padding:12px 15px}.secondary span{font-size:12px}.overlay{position:absolute;inset:0;display:grid;place-items:center;background:#201a35aa;backdrop-filter:blur(6px)}[hidden]{display:none!important}.result{background:#2b233e;border:1px solid #7c667f;border-radius:20px;text-align:center;padding:25px 35px;box-shadow:0 15px 70px #0005;max-width:90%}#resultIcon{font-size:38px;color:var(--lime);margin-bottom:8px}.result h2{font:600 29px 'Outfit';margin:10px 0}.result p{color:var(--muted);font-size:13px;line-height:1.5}.result .primary{display:block;width:100%}#stars{font-size:30px;color:var(--lime);letter-spacing:7px;margin:10px 0 20px}.text-btn{background:none;border:0;color:var(--muted);font-size:12px;padding:15px 0 0}footer{display:flex;justify-content:space-between;color:#9d92ae;font-size:10px;margin-top:26px;gap:10px}footer a{color:inherit;text-decoration:none}dialog{background:#2b233e;color:var(--ink);border:1px solid #766381;border-radius:20px;padding:32px;max-width:460px;width:92%;line-height:1.7}dialog::backdrop{background:#100b21bb;backdrop-filter:blur(5px)}dialog h2{font:600 30px 'Outfit';line-height:1.1}dialog p{color:#c6bdd1;font-size:13px}.close{float:right;background:none;border:0;color:white;font-size:25px}@media(min-width:1400px){main{grid-template-columns:300px minmax(0,1fr)}}@media(max-width:1000px){main{grid-template-columns:190px minmax(0,1fr);gap:25px}.app{padding:22px 25px 15px}h1{font-size:48px}.game-top{padding:15px}.game-bottom{padding:15px;gap:8px}.primary{padding:12px 15px}.secondary span{display:none}}@media(max-width:700px){.app{padding:15px 12px 12px}header{margin-bottom:18px}.brand strong{font-size:20px}.brand-icon{width:40px;height:40px}.brand small{font-size:7px}main{display:flex;flex-direction:column;gap:15px;justify-content:center}aside{width:100%;display:flex;justify-content:space-between;align-items:center;padding:0 5px}aside>.eyebrow,.intro,.side-note,.dots{display:none}h1{font-size:28px;letter-spacing:-1px;margin:0;line-height:1.1}h1 br{display:none}h1 em{display:block}.chapter{border:0;margin:0;padding:0;text-align:right}.chapter>span{font-size:8px;letter-spacing:.6px}.chapter strong{font-size:25px;margin:4px 0 0}.game{width:100%;border-radius:17px}.stage{aspect-ratio:760/650;max-height:none}.game-top{padding:14px}.game-top strong{font-size:11px}.game-bottom{padding:14px 12px}.hint{font-size:9px;white-space:normal;width:max-content;max-width:95%;padding:9px 12px;bottom:13px}.progress{margin-right:2px}footer{margin-top:18px;font-size:9px;justify-content:center}footer>span:last-child{display:none}.result{padding:20px}.result h2{font-size:26px}.result p{font-size:12px}#stars{margin:5px 0 12px}.result #resultIcon{font-size:25px}.label{font-size:8px}}@media(max-height:550px) and (min-width:701px){.app{padding:10px 20px}header{margin-bottom:10px}.stage{max-height:65svh}main{grid-template-columns:170px 1fr}.game-top,.game-bottom{padding:9px 15px}h1{font-size:38px}.chapter{margin-top:15px;padding-top:15px}.side-note{display:none}footer{margin-top:10px}}
/* Front-facing 3D arena */
.stage{aspect-ratio:1.5;max-height:65svh;background:#e8d7cd;overflow:hidden}.stage canvas{cursor:crosshair}.ammo #ammo{display:block;height:auto;white-space:nowrap}.ammo #ammo strong{font:700 26px 'Outfit';color:var(--lime)}.ammo #ammo span{font-size:12px;color:var(--muted)}#reticle{position:absolute;width:23px;height:23px;border:2px solid #fff;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%);box-shadow:0 0 0 2px #6b477c88}#reticle:before,#reticle:after{content:'';position:absolute;background:white;top:50%;left:50%;transform:translate(-50%,-50%)}#reticle:before{width:9px;height:2px}#reticle:after{width:2px;height:9px}.hint{z-index:1}.game-top{min-height:77px}.progress-copy strong{white-space:nowrap;margin-left:8px}.result h2{font-size:26px}@media(max-width:700px){.stage{aspect-ratio: .86;max-height:64svh}.game-top{min-height:69px}.game-top strong{font-size:11px}.ammo #ammo strong{font-size:24px}.game-bottom{gap:9px}.progress{min-width:80px}.progress-copy{font-size:8px}.hint{font-size:10px;bottom:10px}.chapter>span{font-size:7px}}
/* A brighter arcade palette, with material cues carried into the HUD. */
:root{--bg:#170c45;--ink:#fffaf2;--muted:#b7b4e3;--lime:#edff37;--pink:#ff43b1}body{background:radial-gradient(ellipse at 75% 10%,#34218a 0,#170c45 65%)}.game{background:#2c1670;border-color:#7754e2;box-shadow:0 20px 65px #09002066}.game-top,.game-bottom{background:#2c1670}.brand-icon{border-color:#9658fd;background:#47218a}.tools button{border-color:#8d67c2}.chapter{border-color:#633e99}.track{background:#573393}.primary{box-shadow:0 4px 0 #a6bc19}.secondary{border-color:#9875d2;background:#45218c}.materials{display:flex;justify-content:center;gap:14px;flex-wrap:wrap;padding:9px 12px;background:#211155;font-size:9px;color:#eeebff}.materials span:before{content:'';display:inline-block;width:8px;height:8px;margin-right:5px;border-radius:2px;vertical-align:middle}.materials .wood:before{background:#ff961c}.materials .rubber:before{background:#ff269c}.materials .stone:before{background:#786bff}.materials .metal:before{background:#04cbd4}.stage{background:#4bcaff;max-height:61svh}.hint{background:#fffdf0ef;color:#42316a;box-shadow:0 2px 10px #1d227522}.result{background:#311475;border-color:#9466ed}dialog{background:#291363;border-color:#9466ed}.result #stars{color:#fff135}@media(max-width:700px){.materials{font-size:8px;gap:7px;padding:8px 5px}.materials span:before{width:6px;height:6px;margin-right:3px}.stage{max-height:61svh}}footer{color:#bab0d3}
.stage{width:100%}
.hint{top:16px;bottom:auto}@media(max-width:700px){.hint{top:12px;bottom:auto}}
.materials .glass:before{background:#b8f5ff;box-shadow:inset 0 0 0 1px #f4ffff}.materials .elastic:before{background:#a4ff28}.materials .special{color:#fff;font-weight:600}.materials{row-gap:7px}h1{font-size:clamp(38px,4vw,61px);letter-spacing:-2px}@media(max-width:700px){h1{font-size:25px;letter-spacing:-1px}}