:root{--ink:#0d1412;--panel:#17221e;--line:#34473d;--cream:#f2e3be;--gold:#f2bd4b;--orange:#e76b3f;--mint:#85c77e;--muted:#9aab9d}*{box-sizing:border-box}html,body{min-height:100%;color:var(--cream);background:#09100e;margin:0;font-family:Courier New,ui-monospace,monospace;overflow-x:hidden}body{background-image:radial-gradient(circle at 50% 0,#1b2c25 0,#0000 42%),linear-gradient(#ffffff05 1px,#0000 1px),linear-gradient(90deg,#ffffff05 1px,#0000 1px);background-size:auto,12px 12px,12px 12px}button{font:inherit}.app{flex-direction:column;min-height:100svh;display:flex}.topbar{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);z-index:10;background:#101916e8;border-bottom:1px solid #2b3b34;justify-content:space-between;align-items:center;height:62px;padding:0 max(18px,50vw - 590px);display:flex}.brand{letter-spacing:.14em;align-items:center;gap:12px;font-weight:900;display:flex}.brandMark{background:var(--gold);clip-path:polygon(10% 16%,90% 16%,90% 70%,68% 70%,68% 88%,32% 88%,32% 70%,10% 70%);width:30px;height:30px;box-shadow:inset 0 -7px #bd6e31}.brand small{color:#6f8478;letter-spacing:.25em;margin-top:3px;font-size:8px;display:block}.soundBtn{color:#cad5cc;cursor:pointer;background:#18241f;border:1px solid #3b4d43;padding:8px 12px;box-shadow:3px 3px #080d0b}.soundBtn:hover{border-color:var(--gold);color:var(--gold)}.main{grid-template-columns:minmax(0,860px) 250px;align-items:center;gap:24px;width:min(1180px,100%);margin:auto;padding:24px;display:grid}.cabinet{background:#111a17;border:2px solid #374940;padding:12px;position:relative;box-shadow:0 0 0 5px #0b1210,12px 16px #050907}.screen{aspect-ratio:13/10;background:#050907;justify-content:center;align-items:center;display:flex;position:relative;overflow:hidden}.screen canvas{width:100%;height:100%;image-rendering:pixelated;display:block}.scanlines{pointer-events:none;z-index:4;mix-blend-mode:multiply;background:repeating-linear-gradient(0deg,#0000 0 3px,#050a0824 4px);position:absolute;inset:0}.side{flex-direction:column;gap:14px;display:flex}.card{background:#151f1b;border:1px solid #34463d;padding:16px;box-shadow:5px 5px #070c0a}.cardLabel{color:#70867a;letter-spacing:.2em;margin-bottom:8px;font-size:10px}.bigScore{color:var(--gold);letter-spacing:.06em;font-size:27px;font-weight:900}.keys{grid-template-columns:repeat(3,34px);justify-content:center;gap:5px;margin:12px 0;display:grid}.key{color:#bdcabf;background:#202d27;border:1px solid #4c5e54;justify-content:center;align-items:center;height:32px;font-size:12px;display:flex}.key.up{grid-column:2}.key.left{grid-column:1}.hint{color:#899b90;font-size:11px;line-height:1.8}.mission{border-left:3px solid var(--orange)}.mission b{color:#fff;font-size:13px}.mission p{color:#94a69b;margin:8px 0 0;font-size:11px;line-height:1.6}.legend{color:#97a99e;grid-template-columns:1fr 1fr;gap:8px;font-size:10px;display:grid}.swatch{vertical-align:-2px;width:12px;height:12px;margin-right:6px;display:inline-block}.brick{background:#a94f35}.steel{background:#a7bbb0}.water{background:#3b8191}.forest{background:#396941}.welcome{z-index:6;background:linear-gradient(90deg,#060b09f7,#070d0be3);align-items:center;padding:clamp(24px,7vw,78px);display:flex;position:absolute;inset:0}.welcomeInner{max-width:590px}.eyebrow{color:var(--gold);letter-spacing:.28em;font-size:11px;font-weight:700}.title{letter-spacing:.04em;text-shadow:5px 5px #7b3527;margin:16px 0 18px;font-size:clamp(34px,6.3vw,72px);font-weight:1000;line-height:.98}.title span{color:var(--orange)}.lead{color:#b7c5bc;max-width:500px;font-size:clamp(12px,1.5vw,15px);line-height:1.75}.startRow{flex-wrap:wrap;align-items:center;gap:18px;margin-top:28px;display:flex}.primary{background:var(--gold);color:#17130a;letter-spacing:.12em;cursor:pointer;border:0;padding:14px 24px;font-weight:900;box-shadow:5px 5px #9e532e}.primary:hover{transform:translate(2px,2px);box-shadow:3px 3px #9e532e}.levelPick{gap:6px;display:flex}.levelPick button{color:#82958a;cursor:pointer;background:#17221e;border:1px solid #3c5046;width:34px;height:34px}.levelPick button.active{border-color:var(--gold);color:var(--gold)}.levelPick button:disabled{opacity:.25;cursor:not-allowed}.over{z-index:7;text-align:center;background:#07100de8;justify-content:center;align-items:center;padding:24px;display:flex;position:absolute;inset:0}.overBox{background:#121d18;border:1px solid #4b5d53;padding:34px 50px;box-shadow:8px 8px #020403}.overIcon{font-size:42px}.over h2{color:var(--gold);margin:12px 0 5px;font-size:35px}.over.lose h2{color:var(--orange)}.over p{color:#9eb0a5;font-size:12px;line-height:1.7}.overActions{justify-content:center;gap:10px;margin-top:20px;display:flex}.secondary{color:#c5d0c9;cursor:pointer;background:0 0;border:1px solid #50645a;padding:12px 16px}.mobileControls{z-index:5;pointer-events:none;justify-content:space-between;align-items:flex-end;display:none;position:absolute;inset:auto 10px 10px}.dpad{grid-template-columns:repeat(3,46px);gap:3px;display:grid}.ctrl{color:#fff;pointer-events:auto;touch-action:none;background:#15221db8;border:1px solid #b4c2b36b;width:46px;height:46px}.ctrl.u{grid-column:2}.ctrl.l{grid-column:1}.fire{color:#fff;pointer-events:auto;touch-action:none;background:#bd4e34cc;border:3px solid #f2bd4b99;border-radius:50%;width:74px;height:74px;font-weight:900}.footer{text-align:center;color:#405248;letter-spacing:.15em;padding:8px 20px 18px;font-size:9px}.hide{display:none!important}@media (max-width:900px){.main{grid-template-columns:1fr;padding:14px}.side{grid-template-columns:repeat(2,1fr);display:grid}.controlsCard{display:none}.mobileControls{display:flex}.topbar{height:52px}.cabinet{padding:7px;box-shadow:0 0 0 3px #0b1210,6px 8px #050907}}@media (max-width:560px){.main{align-content:start;gap:12px;margin:0;padding:8px}.screen{aspect-ratio:10/12}.side{grid-template-columns:1fr 1fr;gap:8px}.card{padding:10px}.mission{grid-column:1/-1}.legendCard{display:none}.title{font-size:38px}.welcome{align-items:flex-start;padding:18% 25px 25px}.lead{font-size:11px}.startRow{margin-top:18px}.primary{padding:12px 16px}.brand{font-size:12px}.brand small{display:none}.overBox{width:92%;padding:26px 18px}.over h2{font-size:28px}.dpad{grid-template-columns:repeat(3,42px)}.ctrl{width:42px;height:42px}.fire{width:66px;height:66px}.footer{display:none}}
