:root{--bg:#101b2b;--panel:#1c2b3d;--edge:#38516b;--txt:#eef5ed;--muted:#9bb5c2;--lime:#d8ee7d;--mint:#78d4c1;--gold:#f4c977;--red:#fda8b0;--mono:ui-monospace,SFMono-Regular,Consolas,"Liberation Mono",monospace}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(ellipse at 72% 3%,#2d47546e,transparent 43%),#101b2b;color:var(--txt);font:15px/1.55 system-ui,-apple-system,Segoe UI,Arial,sans-serif}a{color:var(--mint);text-decoration:none}button,textarea{font:inherit}button{cursor:pointer;touch-action:manipulation}button:disabled{opacity:.48;cursor:not-allowed}button:focus-visible,textarea:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--mint);outline-offset:3px}code{color:var(--lime);font:.93em var(--mono)}.wrap{max-width:1370px;padding:0 22px;margin:auto}.top{min-height:83px;display:flex;align-items:center;justify-content:space-between;gap:15px;border-bottom:1px solid var(--edge)}.logo{display:flex;align-items:center;gap:12px}.logoicon{font:900 21px var(--mono);background:var(--lime);color:#102030;box-shadow:4px 4px #3e6157;padding:11px 12px}.logo b{font:950 24px var(--mono);letter-spacing:-1.2px;color:var(--txt)}.logo b em{color:var(--lime);font-style:normal}.logo small{display:block;font:800 9px var(--mono);letter-spacing:1.2px;color:#a3bec7}.topnav{display:flex;gap:9px;flex-wrap:wrap}.topnav a{font:800 11px var(--mono);padding:10px 12px;border:1px solid #4a677c;border-radius:6px;white-space:nowrap}.topnav a:hover{border-color:var(--mint)}.hero{padding:28px 0 23px}.eyebrow{font:850 12px var(--mono);color:var(--mint);letter-spacing:1.3px}.hero h1{font-size:clamp(32px,4vw,54px);letter-spacing:-1.9px;line-height:1.12;margin:9px 0}.hero h1 span{color:var(--lime)}.hero p{max-width:890px;color:#b4c9d2;margin:0;line-height:1.7}.layout{display:grid;grid-template-columns:minmax(0,1.26fr) minmax(380px,1fr);gap:16px;align-items:start}.stack{display:grid;gap:16px;min-width:0}.panel{min-width:0;background:var(--panel);border:1px solid var(--edge);border-radius:10px;overflow:hidden;box-shadow:0 10px 24px #050b1520}.panelhead{display:flex;align-items:center;justify-content:space-between;gap:11px;padding:11px 17px;background:#172638;border-bottom:1px solid var(--edge);min-height:45px}.panelhead b{font:900 11px var(--mono);letter-spacing:.7px}.panelhead b:before{content:'■';color:var(--lime);margin-right:9px}.minor{font:800 10px var(--mono);color:#96b3c2}.scene{width:100%;height:auto;display:block;image-rendering:pixelated;background:#bad9cd}.scenestatus{padding:12px 16px;min-height:47px;color:#bbd5ce;font:740 12px var(--mono)}.objectives{padding:5px 17px}.objective{display:flex;align-items:start;gap:12px;border-bottom:1px solid #384d5f;padding:11px 0}.objective:last-child{border:0}.check{display:grid;place-items:center;flex-shrink:0;width:26px;height:26px;border:1px solid #728b9b;border-radius:5px;color:#829bad;font:850 18px var(--mono)}.objective.done .check{background:var(--lime);border-color:var(--lime);color:#162337}.objective b{font:900 13px var(--mono)}.objective.done b{color:var(--lime)}.objective p{color:#a4baca;font-size:12px;margin:4px 0 0}.buttons{padding:14px 16px 17px;display:flex;flex-wrap:wrap;gap:9px}.btn{background:transparent;border:1px solid #55718a;color:#e4efef;border-radius:6px;padding:12px 13px;min-height:44px;font:850 11px var(--mono)}.btn.primary{background:var(--lime);border-color:var(--lime);color:#152332}.btn.secondary{background:var(--mint);border-color:var(--mint);color:#152332}.btn:hover:not(:disabled){filter:brightness(1.1)}.snapshot{margin:0 17px 15px;background:#203348;border-left:3px solid var(--mint);padding:10px 12px;font:12px/1.6 var(--mono);color:#c1d2d5}.intro{font-size:12px;color:#b8cbd3;padding:14px 16px}.pill{font:900 10px var(--mono);background:var(--mint);color:#17312b;border-radius:3px;padding:4px 7px;margin-right:9px}.codebox{margin:0 15px 13px;background:#132136;border:1px solid #3e586f;border-radius:7px;overflow:hidden;font:13px/1.7 var(--mono)}.codewrap{padding:11px 14px;white-space:pre-wrap;color:#b6c9d5;overflow-wrap:anywhere}.codewrap .comment{color:#87a3b6}.editor{min-height:210px;width:100%;display:block;border:0;border-left:3px solid var(--mint);background:#1c3045;resize:vertical;white-space:pre;tab-size:2;padding:12px 14px;color:#e5f6d3;font:13px/1.7 var(--mono)}.api{margin:0 15px 13px;background:#253b51;border:1px solid #48667f;border-radius:6px;padding:12px 13px;color:#c2d6d9;font-size:12px}.api summary{font:800 12px var(--mono);color:var(--mint);cursor:pointer}.api ul{padding-left:19px;margin:9px 0 0}.api li{margin-bottom:6px}.hintbox{margin:0 15px 15px;background:#334659;border-left:3px solid var(--gold);padding:13px;color:#f5e1ba;font-size:12px}.hintbox[hidden]{display:none}.hintbox .btn{margin-top:10px;display:block}.terminal{background:#132136;min-height:150px;max-height:360px;overflow:auto;padding:14px 16px;font:12px/1.75 var(--mono)}.log{overflow-wrap:anywhere}.log.dim{color:#8da4b4}.log.ok{color:#b1eda1}.log.fail{color:#ffaab5}.log.warn{color:var(--gold)}.explorer{white-space:pre-wrap;font:12px/1.85 var(--mono);color:#d9dfb7;padding:15px 18px}.foot{border-top:1px solid var(--edge);padding:19px 0 30px;margin-top:24px;display:flex;justify-content:space-between;flex-wrap:wrap;gap:12px;font:760 10px var(--mono);color:#8da7b8}.winlayer{position:fixed;inset:0;z-index:30;display:grid;place-items:center;padding:19px;background:#081321e5}.winlayer[hidden]{display:none}.win{max-width:540px;width:100%;padding:27px;background:#25384b;border:2px solid var(--lime);box-shadow:10px 10px #08111d}.win .winlabel{color:var(--lime);font:900 11px var(--mono);letter-spacing:1.3px}.win h2{font-size:30px;line-height:1.14;letter-spacing:-.7px;margin:12px 0}.win p{color:#bbd0d2}.quote{background:#182a39;border-left:4px solid var(--gold);padding:13px 15px;font-size:13px;line-height:1.7}.quote b{color:var(--lime)}.win .buttons{padding:17px 0 0}
@media(max-width:1050px){.layout{grid-template-columns:1fr}.wrap{max-width:860px}}@media(max-width:580px){.wrap{padding:0 11px}.top{min-height:74px}.logo b{font-size:19px}.logo small{font-size:7px;letter-spacing:.35px}.logoicon{font-size:16px;padding:8px}.topnav{gap:5px}.topnav a{font-size:10px;padding:8px}.hero{padding:23px 3px}.hero p{font-size:13px}.panelhead{padding:10px 11px}.panelhead b{font-size:10px}.minor{font-size:9px}.objectives{padding:4px 12px}.objective b{font-size:12px}.buttons{padding:12px}.buttons .btn{flex-grow:1}.intro{padding:13px}.codebox{margin:0 9px 12px}.codewrap,.editor{font-size:12px}.api,.hintbox{margin:0 9px 13px}.win{padding:19px}.win h2{font-size:26px}}