:root{--paper:#e9e5d9;--ink:#242a28;--muted:#72776c;--orange:#d85b30;--line:#cbc9bd}*{box-sizing:border-box}body{margin:0;color:var(--ink);background:var(--paper);font-family:Arial,Helvetica,sans-serif}.page{max-width:1420px;margin:auto;padding:0 64px}button,a{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer}a{color:inherit;text-decoration:none}button:focus-visible,a:focus-visible,canvas:focus-visible{outline:3px solid var(--orange);outline-offset:5px}header{height:110px;display:flex;align-items:center;border-bottom:1px solid var(--line);gap:24px}.brand{font-size:32px;font-weight:900;letter-spacing:-2px}.brand-icon{font-size:43px;vertical-align:-3px;margin-right:9px;font-weight:400}.brand-dot{color:var(--orange);margin-left:5px}.edition{font:10px/1.65 monospace;letter-spacing:1px;border-left:1px solid var(--line);padding-left:22px}.edition b{font-weight:400;color:var(--muted)}.download-top{margin-left:auto;font:11px monospace;letter-spacing:1px}.download-top span{font-size:20px;margin-left:15px}main{display:grid;grid-template-columns:1fr 1fr;gap:64px;padding:65px 0 57px}.intro{padding-top:20px}.eyebrow{font:11px monospace;letter-spacing:1.5px;display:flex;align-items:center;gap:10px}.eyebrow>span{height:7px;width:7px;background:var(--orange);display:block}h1{font-family:Impact,'Arial Narrow',sans-serif;font-stretch:condensed;font-size:clamp(70px,7.9vw,110px);line-height:.89;letter-spacing:-2px;margin:28px 0 27px;font-weight:900}h1>span{color:var(--orange)}h1 sup{display:none}.tagline{font-size:22px;font-weight:700;letter-spacing:-.5px;margin:0 0 17px}.description{font-size:14px;line-height:1.85;color:#666d62;max-width:390px}.actions{display:flex;gap:21px;align-items:center;margin-top:28px}.primary{background:var(--ink);color:var(--paper);border:0;padding:19px 23px;font:11px monospace;letter-spacing:1px;min-width:186px;display:flex;justify-content:space-between;gap:20px}.primary:hover{background:var(--orange)}.primary:disabled{opacity:.55;cursor:wait}.text-button{border:0;background:none;padding:12px 0;font:10px monospace;letter-spacing:.7px}.text-button span{margin-left:9px}.status{font:10px monospace;color:var(--muted);min-height:13px;margin:12px 0 28px}.specs{display:flex;border-top:1px solid var(--line);border-bottom:1px solid var(--line);padding:22px 0;gap:34px;max-width:395px}.specs div{display:flex;flex-direction:column;gap:8px}.specs strong{font:32px Impact,'Arial Narrow',sans-serif}.specs span{font:9px monospace;letter-spacing:.6px}.mission-note{margin-top:24px;display:flex;gap:22px;align-items:start}.mission-note>span{font:9px monospace;color:var(--orange);padding-top:3px;white-space:nowrap}.mission-note p{font-size:11px;line-height:1.7;margin:0;color:var(--muted)}.play-area{max-width:490px;width:100%;justify-self:center}.console-caption{display:flex;justify-content:space-between;font:9px monospace;letter-spacing:1px;margin:0 10px 14px}.console-caption i,.screen-label i{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--orange);margin-right:6px}.console{padding:28px 28px 22px;border:1px solid #c8c9bd;border-radius:13px 13px 65px 13px;background:linear-gradient(130deg,#d8d9ce,#c5c8bc);box-shadow:3px 5px 0 #afb3a5,15px 23px 30px #30382716,inset 2px 2px 2px #ffffff80}.screen-bezel{background:#3a433c;padding:14px 28px 13px;border-radius:9px 9px 30px 9px;box-shadow:inset 0 2px 5px #151e2660}.screen-label{display:flex;justify-content:space-between;color:#b3b9a9;font:8px monospace;letter-spacing:1px;margin-bottom:12px}.screen-label i{background:#b2d769;box-shadow:0 0 6px #b2d76980}canvas{display:block;width:100%;height:auto;aspect-ratio:10/9;image-rendering:pixelated;filter:sepia(.65) saturate(1.1) hue-rotate(22deg) brightness(.93);background:#c4d399;border:5px solid #202b24;box-shadow:0 0 0 1px #57624b;touch-action:none}.screen-bottom{display:flex;justify-content:space-between;color:#b0b8a6;margin-top:12px;font:bold 8px monospace;letter-spacing:1px}.screen-bottom span{font-weight:400;font-size:7px}.console-brand{display:flex;align-items:baseline;margin:17px 3px 20px;font-size:21px;font-weight:900;font-style:italic;letter-spacing:-1px}.console-brand>span{color:#788473;margin:0 8px}.console-brand em{font:9px monospace;letter-spacing:1px}.console-brand button{margin-left:auto;border:1px solid #a7ae9e;background:transparent;font:8px monospace;padding:7px 9px;letter-spacing:.7px;color:#52604e}#controller{position:relative;height:152px;user-select:none;touch-action:none}.dpad{display:grid;grid-template:repeat(3,31px)/repeat(3,31px);position:absolute;left:8px;top:0;filter:drop-shadow(2px 4px 1px #0005)}.dpad button,.dpad>span{background:#303a33;color:#6d796a;border:0}.dpad button{font-size:13px;padding:0;touch-action:none}.dpad button:active,.dpad button.pressed{background:#53634c;color:#c0cead}.up{grid-area:1/2;border-radius:4px 4px 0 0}.left{grid-area:2/1;border-radius:4px 0 0 4px}.dpad>span{grid-area:2/2}.right{grid-area:2/3;border-radius:0 4px 4px 0}.down{grid-area:3/2;border-radius:0 0 4px 4px}.ab{display:flex;gap:17px;position:absolute;right:5px;top:8px;transform:rotate(-18deg)}.ab>div{display:flex;flex-direction:column;align-items:center;gap:8px}.ab button{border:1px solid #963715;background:var(--orange);color:#f1dbc8;font-weight:700;font-size:18px;width:48px;height:48px;border-radius:50%;box-shadow:1px 4px 0 #923b21,0 6px 8px #0002;touch-action:none}.ab button:active,.ab button.pressed{transform:translateY(3px);box-shadow:0 1px 0 #923b21}.ab span{font:8px monospace;letter-spacing:1px}.small-controls{position:absolute;left:39%;bottom:6px;display:flex;gap:17px;transform:translateX(-15%)}.small-controls button{position:relative;background:#818c7b;border:0;border-radius:5px;color:#edf0e4;padding:5px 10px;font:7px monospace;box-shadow:0 2px 0 #697560;touch-action:none}.small-controls span{position:absolute;top:27px;left:50%;transform:translateX(-50%);color:#5c6855;font:6px monospace;white-space:nowrap}.speaker{position:absolute;right:8px;bottom:0;display:flex;gap:5px;transform:rotate(-25deg)}.speaker i{width:4px;height:30px;background:#a3ad9b;border-radius:3px;box-shadow:inset 1px 1px 1px #7a8776}.keyboard-note{text-align:center;color:var(--muted);font:8px monospace;letter-spacing:.5px;margin-top:26px;line-height:2}.keyboard-note span{margin:0 5px}kbd{font:inherit;color:var(--ink)}footer{border-top:1px solid var(--line);padding:25px 0 28px;display:flex;justify-content:space-between;align-items:center;gap:24px;font:9px/1.7 monospace;letter-spacing:.6px}footer>span{color:var(--muted)}footer b{font-weight:400;color:var(--ink)}footer p{color:var(--muted);font:10px/1.6 Arial;letter-spacing:0}footer a{font-size:9px}footer small{display:block;color:var(--muted);font:8px monospace;margin-top:6px}#field-guide{border-top:1px solid var(--line);padding:32px 0}#field-guide[hidden]{display:none}.guide-heading>span{font:10px monospace;color:var(--orange);letter-spacing:1px}h2{font-size:28px;letter-spacing:-1px}.guide-heading{margin-bottom:24px}ol{display:grid;grid-template-columns:repeat(3,1fr);gap:38px;padding-left:20px;font-size:13px;line-height:1.8}li{padding-left:7px;color:#69705f}li b{display:block;color:var(--ink);font-size:15px}#field-guide>p{font-size:12px;line-height:1.9;max-width:820px}button.pressed{filter:brightness(.8)}@media(min-width:1400px){main{gap:110px}.intro{padding-top:38px}}@media(max-width:1050px){.page{padding:0 32px}main{gap:32px}h1{font-size:80px}.console{padding:20px}.screen-bezel{padding:12px 18px}.specs{gap:24px}.actions{gap:14px}.primary{min-width:165px;padding:17px}.screen-bottom{font-size:7px}.screen-bottom span{font-size:6px}.small-controls{left:35%}.speaker{right:0}}@media(max-width:760px){.page{padding:0 22px}header{height:80px;gap:15px}.edition{font-size:8px;padding-left:15px}.download-top{font-size:0}.download-top span{font-size:23px;margin:0}main{grid-template-columns:1fr;padding:32px 0 30px;gap:32px}.intro{padding:0}.eyebrow{font-size:9px}h1{font-size:80px;line-height:.9;margin:20px 0}.tagline{font-size:21px}.description{max-width:100%;font-size:13px;margin-bottom:16px}.actions{margin-top:20px}.status{margin-bottom:0}.specs,.mission-note{display:none}.play-area{max-width:460px}.console{padding:24px 22px 24px}.screen-bezel{padding:13px 22px}.console-brand{margin-bottom:23px}.console-caption{font-size:8px}footer{flex-wrap:wrap;gap:15px}footer p{margin:0}footer a{width:100%;padding-top:15px;border-top:1px solid var(--line)}ol{grid-template-columns:1fr;gap:20px}.keyboard-note{font-size:7px}.speaker{right:5px}}@media(prefers-reduced-motion:no-preference){button{transition:background .15s,opacity .15s}}

/* Larger, separated touch controls on phones. */
@media (max-width:760px) {
  #controller { height:242px; }
  .dpad {
    --direction-size:clamp(44px,12vw,50px);
    grid-template:repeat(3,var(--direction-size))/repeat(3,var(--direction-size));
    left:0;
    top:0;
  }
  .dpad button { font-size:20px; }
  .ab { right:0; top:8px; gap:10px; transform:none; }
  .ab>div:first-child { margin-top:30px; }
  .ab button {
    width:clamp(60px,16vw,68px);
    height:clamp(60px,16vw,68px);
    font-size:25px;
  }
  .ab span { font-size:10px; }
  .small-controls {
    left:50%; bottom:8px; gap:18px;
    transform:translateX(-50%);
  }
  .small-controls button {
    min-width:88px; min-height:48px;
    padding:8px 12px; border-radius:9px;
    font-size:11px;
  }
  .small-controls span {
    position:static; display:block; transform:none;
    margin-top:5px; color:#edf0e4; font-size:8px;
  }
  .console-brand button { min-width:72px; min-height:44px; font-size:10px; }
  .speaker { display:none; }
}
@media (max-width:380px) {
  .page { padding-right:12px; padding-left:12px; }
  .console { padding-right:12px; padding-left:12px; }
}