:root{color-scheme:dark;--bg:#101725;--panel:#192234;--muted:#adb9cd;--ink:#f5f6ef;--accent:#ffe08a;--control-size:64px;--control-opacity:.8}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.55 system-ui,-apple-system,Segoe UI,sans-serif}button,a,input,select{font:inherit}button{color:var(--ink);border:1px solid #526079;background:#243149;border-radius:9px;padding:11px 17px;cursor:pointer;min-height:44px;transition:background .15s,transform .15s}button:hover{background:#354767;border-color:#e5ce94}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible{outline:3px solid #8cdbff;outline-offset:3px}button:disabled{opacity:.45;cursor:default}.primary{background:var(--accent);color:#182034;border-color:var(--accent);font-weight:750}.primary:hover{background:#fff0bf}a{color:#acd8ff}.topbar{max-width:1320px;margin:auto;height:88px;padding:16px 32px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff15}.brand{display:flex;gap:10px;align-items:center;color:inherit;text-decoration:none;font-size:12px;letter-spacing:2px}.brand b{display:block;color:#f3d698;font-size:10px}.topbar nav{display:flex;gap:8px}.topbar nav button{border:0;background:transparent;font-size:13px;color:#d5def0}#launcher{max-width:1320px;margin:auto;padding:0 32px}.hero{min-height:485px;position:relative;display:flex;align-items:center;overflow:hidden;margin:22px 0 45px;background:radial-gradient(ellipse at 80% 50%,#343b63 0,transparent 55%);border-bottom:1px solid #ffffff12}.hero-copy{position:relative;z-index:1;padding:35px 0;width:51%;pointer-events:none}.hero-copy button{pointer-events:auto}.eyebrow{font-size:10px;font-weight:750;letter-spacing:3px;color:#e6c384;margin:0 0 12px}h1{font-size:clamp(38px,4.8vw,68px);line-height:.97;letter-spacing:-2px;margin:12px 0;color:#f7f3e6;font-weight:900}h1 span{font-size:1.7em;letter-spacing:6px;color:#ffe090;text-shadow:0 5px 0 #8a6548,0 10px 20px #0004}.edition{font-size:11px;letter-spacing:4px;color:#c6cce2;margin:22px 0}.intro{font-size:18px;color:#c2cde2;max-width:400px}.hero-art{position:absolute;right:-30px;width:64%;height:100%;object-fit:contain}.actions{display:flex;gap:10px;flex-wrap:wrap}.actions span{padding-left:20px}.fine{font-size:11px;letter-spacing:.5px;color:#a1aec5;margin-top:20px}.section-title{display:flex;justify-content:space-between;align-items:end}.section-title h2{font-size:28px;letter-spacing:-.7px;margin:0}.section-title p:last-child{color:#c5cde0;font-size:13px}.order{color:#98a9c0;font-size:12px;margin-bottom:24px}.campaign-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.campaign-card{padding:0;text-align:left;overflow:hidden;border:1px solid #344058;background:#192235;border-radius:13px;display:flex;flex-direction:column;position:relative}.campaign-card:hover{transform:translateY(-4px)}.campaign-card img{width:100%;aspect-ratio:1.55;object-fit:cover;background:#203047}.card-copy{padding:16px 18px;flex:1;display:flex;flex-direction:column}.card-copy .group{font-size:8px;letter-spacing:1.3px;font-weight:800;color:var(--c);min-height:24px}.card-copy h3{font-size:18px;line-height:1.22;margin:7px 0 12px;min-height:44px}.card-copy p{font-size:11px;color:#a7b5cd;margin:auto 0 8px}.progress{height:3px;background:#344158;border-radius:2px;overflow:hidden}.progress i{display:block;height:100%;background:var(--c);width:var(--p)}.number{position:absolute;top:12px;left:12px;font-size:10px;font-weight:800;background:#0b1626d9;border:1px solid #ffffff3a;padding:4px 9px;border-radius:6px;color:#f7e5b0}.collection-note{margin:35px 0 10px;padding:25px 30px;background:#171f2f;border:1px solid #303b50;border-radius:12px}.collection-note h3{margin:0 0 7px}.collection-note p{font-size:13px;color:#b6c0d0;max-width:900px}.collection-note button{font-size:12px}footer{padding:28px 0 35px;text-align:center;color:#7d8ba3;font-size:11px}#mapScreen{max-width:1240px;margin:30px auto;padding:0 28px}.map-head{display:grid;grid-template-columns:1fr 280px;gap:30px;align-items:center}.map-head img{width:100%;border-radius:15px}.map-head h1{font-size:36px;line-height:1.1;letter-spacing:-1px}.map-head p{color:#b8c5d7}.map-trail{position:relative;padding:30px 0;display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.node{border:1px solid #51617b;padding:16px;position:relative;background:linear-gradient(135deg,#23334d,#1b2639);text-align:left;min-height:126px}.node strong{font-size:15px;display:block;margin:4px 0}.node span{font-size:10px;color:#b4c5df}.node.completed{border-color:#79b99c}.node.completed:after{content:'✓';position:absolute;right:10px;top:9px;color:#b4f4cd}.node.locked{opacity:.5}.inventory{display:flex;gap:8px;flex-wrap:wrap;margin-top:18px}.inventory span,.tag{font-size:11px;border:1px solid #64748b;padding:5px 10px;border-radius:20px;color:#d4deec}.map-footer{display:flex;gap:12px;flex-wrap:wrap;margin:0 0 30px}dialog{color:var(--ink);background:#172235;border:1px solid #617491;border-radius:16px;padding:26px;max-width:680px;width:calc(100% - 30px);max-height:90dvh;box-shadow:0 25px 100px #000a}dialog::backdrop{background:#070e1edc;backdrop-filter:blur(5px)}dialog h2{margin:0 0 12px;line-height:1.2;font-size:27px}dialog h3{font-size:16px;color:#e8d4a4}dialog p,dialog li{color:#bac8df;font-size:14px}dialog .actions{margin-top:22px}.settings-grid{display:grid;grid-template-columns:1fr 1fr;gap:15px}.settings-grid label{display:flex;flex-direction:column;gap:6px;font-size:12px;color:#bbc9df}.settings-grid select,.settings-grid input:not([type=checkbox]){width:100%;background:#0e1829;color:#f0f5ff;border:1px solid #596a86;border-radius:6px;min-height:40px;padding:7px}.settings-grid label.check{flex-direction:row;align-items:center}.bindings{display:grid;grid-template-columns:1fr 1fr;gap:8px}.bindings button{font-size:12px}.save-row{padding:14px 0;border-bottom:1px solid #34435b}.save-row input{background:#0d1626;color:#e8f0ff;border:1px solid #5d7391;border-radius:5px;padding:8px;width:55%}.save-row button{font-size:12px;padding:7px 10px;margin-left:5px}.notice{background:#453a28;color:#ffdf9b;border:1px solid #927a46;border-radius:8px;padding:12px;font-size:13px}.table{width:100%;border-collapse:collapse;font-size:12px}.table td,.table th{text-align:left;border-bottom:1px solid #44516a;padding:8px}.table th{color:#ffe3ab}.achievements{display:flex;flex-wrap:wrap;gap:8px}.achievements span{border:1px solid #637450;border-radius:8px;padding:7px 10px;font-size:12px;color:#cbe5ae}
body.playing{overflow:hidden;touch-action:none;background:#080e19}body.playing .topbar{display:none}#playScreen{height:100dvh;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}[hidden]{display:none!important}#hud{min-height:62px;flex:none;padding:8px 18px;background:#111b2e;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid #314058;gap:8px}#hudStage{display:block;font-size:14px;color:#ffe2a0}#hudObjective{font-size:11px;color:#abbcd4}#hudStats{font-size:12px;white-space:pre} .hud-stats{display:flex;align-items:center;gap:8px}.hud-stats button{min-height:36px;padding:5px 12px;font-size:12px}#viewport{position:relative;flex:1;min-height:0;display:flex;justify-content:center;align-items:center;overflow:hidden;background:#0d1320}canvas{display:block;max-width:100%;max-height:100%;outline:none;touch-action:none}#playCaption{background:#111b2e;color:#aabcda;font-size:10px;text-align:center;padding:5px;min-height:24px}#toast{position:absolute;top:12px;left:50%;transform:translateX(-50%);padding:9px 18px;border:1px solid #bba878;background:#102038eb;border-radius:8px;font-size:13px;text-align:center;max-width:80%;pointer-events:none;opacity:0;transition:opacity .15s;z-index:3}#toast.visible{opacity:1}#touchControls{position:absolute;inset:0;pointer-events:none;display:none;align-items:end;justify-content:space-between;padding:12px 16px;gap:12px}#touchControls.show{display:flex}.dpad,.actionpad{display:grid;gap:7px;pointer-events:none;opacity:var(--control-opacity)}.dpad{grid-template-columns:repeat(3,var(--control-size));grid-template-rows:repeat(2,var(--control-size))}.dpad button:first-child{grid-column:2}.dpad button:nth-child(2){grid-row:2;grid-column:1}.dpad button:nth-child(3){grid-row:2;grid-column:2}.dpad button:nth-child(4){grid-row:2;grid-column:3}.actionpad{grid-template-columns:repeat(2,var(--control-size));grid-template-rows:repeat(2,var(--control-size))}#touchControls button{pointer-events:auto;border-radius:18px;background:#17253dcf;backdrop-filter:blur(2px);border:2px solid #c9def78c;padding:0;touch-action:none;user-select:none;-webkit-user-select:none;font-weight:800;font-size:12px}#touchControls button[data-action=jump]{background:#8b663edb;border-color:#ffdf93}#touchControls button.held{background:#c5e0ffa0;color:#101c2f}.retro canvas{image-rendering:pixelated;filter:saturate(.85) contrast(1.08)}body.reduced *{transition:none!important;scroll-behavior:auto!important} @media(max-width:1050px){.campaign-grid{grid-template-columns:repeat(2,1fr)}.hero-copy{width:57%}.hero-art{right:-80px;width:66%}.map-trail{grid-template-columns:repeat(3,1fr)}}@media(max-width:650px){.topbar{height:auto;min-height:72px;padding:12px 16px;gap:12px;align-items:start}.topbar nav{display:grid;grid-template-columns:1fr 1fr;gap:0}.topbar nav button{font-size:10px;padding:4px 8px;min-height:32px}.brand{font-size:9px;letter-spacing:1px}#launcher{padding:0 18px}.hero{min-height:490px;align-items:start;margin-top:10px}.hero-copy{width:100%;padding-top:25px}.hero-copy .intro{max-width:240px;font-size:14px}.hero-art{width:88%;height:70%;top:105px;right:-95px;opacity:.65}.hero-copy .actions{max-width:260px;margin-top:130px}.hero-copy h1{font-size:40px}.hero-copy .fine{font-size:9px}.edition{font-size:9px;letter-spacing:2px}.eyebrow{font-size:8px;letter-spacing:2px}.section-title{display:block}.campaign-grid{gap:12px}.card-copy{padding:12px}.card-copy h3{font-size:15px}.card-copy .group{font-size:7px}.collection-note{padding:18px}.map-head{display:block}.map-head img{display:none}.map-head h1{font-size:27px}.map-trail{grid-template-columns:repeat(2,1fr);gap:10px}.node{padding:12px}.settings-grid{grid-template-columns:1fr 1fr}dialog{padding:20px}.hud-stats{gap:3px}#hud{padding:6px 10px}#hudStage{font-size:11px}#hudObjective{display:none}#hudStats{font-size:10px}.hud-stats button{padding:4px 7px}#playCaption{font-size:8px}.section-title h2{font-size:25px}}@media(pointer:coarse){#playCaption{min-height:18px}.playing #viewport{margin-bottom:140px;overflow:visible}.playing #touchControls{bottom:-140px;top:auto;height:140px;align-items:center}.playing canvas{align-self:center}}@media(pointer:coarse) and (orientation:landscape){.playing #viewport{margin-bottom:90px}.playing #touchControls{height:90px;bottom:-90px}.dpad,.actionpad{grid-template-rows:repeat(2,36px);grid-template-columns:repeat(3,var(--control-size))}.actionpad{grid-template-columns:repeat(2,var(--control-size))}#hud{min-height:42px}#playCaption{display:none}} 

/* The phone camera fills its viewport; controls occupy their own strip. */
.settings-grid .phone-only{display:none}
#walkthroughIndicator{display:inline-block;border:1px solid #8ab7a0;background:#173c36;color:#c0f4d6;border-radius:5px;padding:2px 6px;margin:0 0 3px;font-size:10px;font-weight:700;line-height:1.2}
body.playing dialog{touch-action:pan-y;overscroll-behavior:contain}
body.playing dialog input[type=range]{touch-action:pan-x}
@media(max-width:650px) and (pointer:coarse),(max-width:1100px) and (max-height:650px) and (pointer:coarse){
 .settings-grid .phone-only{display:flex}
 body.playing{--phone-button-size:min(var(--control-size),calc((100vw - env(safe-area-inset-left) - env(safe-area-inset-right) - 52px)/5));--phone-button-height:var(--phone-button-size);--phone-touch-height:calc(var(--phone-button-height)*2 + 22px)}
 #playScreen{height:var(--keen-phone-height,100dvh)}
 .playing #viewport{margin-bottom:0;overflow:visible}
 .playing #viewport:has(#touchControls.show){margin-bottom:var(--phone-touch-height)}
 .playing #touchControls{top:auto;bottom:calc(0px - var(--phone-touch-height));height:var(--phone-touch-height);padding:8px 10px;gap:10px;align-items:center}
 .playing .dpad{grid-template-columns:repeat(3,var(--phone-button-size));grid-template-rows:repeat(2,var(--phone-button-height));gap:6px}
 .playing .actionpad{grid-template-columns:repeat(2,var(--phone-button-size));grid-template-rows:repeat(2,var(--phone-button-height));gap:6px}
 .playing #touchControls button{min-height:44px;min-width:44px;border-radius:12px;font-size:11px}
 .playing canvas{max-width:none;max-height:none;flex:none}
 #hud{padding:5px 8px;min-height:54px;align-items:center}
 #hud>div:first-child{min-width:0}
 #hudStage{font-size:11px;line-height:1.3}
 #hudObjective{display:none}
 #hudStats{font-size:10px;white-space:normal;line-height:1.3}
 .hud-stats{gap:4px;flex-wrap:wrap;justify-content:flex-end;max-width:64%}
 .hud-stats button{min-height:36px;padding:4px 7px;font-size:11px}
 #walkthroughIndicator{font-size:9px;margin-bottom:2px}
 #playCaption{font-size:8px;min-height:18px;line-height:1.3;padding:3px}
}
@media(max-width:1100px) and (max-height:650px) and (pointer:coarse) and (orientation:landscape){
 body.playing{--phone-button-height:clamp(44px,calc(var(--phone-button-size)*.75),56px)}
 #hud{min-height:42px;padding:3px 10px}
 #playCaption{display:none}
}
