:root{--text-12:.75rem;--text-14:.875rem;--text-16:1rem;--text-20:1.25rem;--text-24:1.5rem;--text-30:1.875rem;color-scheme:dark;--bg:#131420;--panel:#1b1c2c;--line:#303044;--text:#ece9f5;--muted:#aaa6be;--mint:#b9f3cf;--gold:#f0d198;--violet:#ae9ada}
*{box-sizing:border-box}
body{font-size:var(--text-14);line-height:1.5;margin:0;background:radial-gradient(ellipse at 50% 35%,#222036 0,transparent 65%),var(--bg);color:var(--text);font-family:system-ui,-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
button,a{-webkit-tap-highlight-color:transparent}
button{font:inherit;cursor:pointer;color:inherit;border:0;background:none}
button:disabled{opacity:.38;cursor:not-allowed}
button:focus-visible,a:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
a{color:inherit;text-decoration:none}
header{height:85px;border-bottom:1px solid #ffffff0c;display:flex;align-items:center;gap:50px;padding:0 max(5%,calc((100vw - 1280px)/2));white-space:nowrap}
.logo{display:flex;gap:9px;align-items:center;font-family:'Trebuchet MS',system-ui,sans-serif;font-weight:700;font-size:var(--text-20);letter-spacing:0}
.logo>span:not(.logo-pixel){color:var(--mint);margin-left:-4px}
.logo-pixel{font-size:var(--text-30);color:var(--mint)}
.logo i{font-size:var(--text-12);letter-spacing:0;font-style:normal;border:1px solid #4c465c;color:#b4a6c9;padding:4px 5px;border-radius:3px;margin-left:6px}
nav{display:flex;gap:28px;height:100%;align-items:center}
nav button{font-size:var(--text-14);color:var(--muted);height:100%;position:relative;padding:0 2px}
nav button.active{color:var(--text)}
nav button.active:after{content:'';position:absolute;height:2px;background:var(--mint);bottom:0;left:0;right:0}
.header-end{display:flex;gap:14px;margin-left:auto;align-items:center}
.header-end button{font-size:var(--text-14);color:var(--muted)}
#help{border:1px solid var(--line);border-radius:50%;height:25px;width:25px}
main{max-width:1280px;margin:auto;padding:35px 30px}
.world-title{display:flex;align-items:center;justify-content:space-between;margin-bottom:25px}
.eyebrow{font-size:var(--text-12);letter-spacing:0;color:var(--violet);font-weight:700;margin:0 0 12px}
h1,h2{line-height:1.2;text-wrap:balance;font-family:'Trebuchet MS',system-ui,sans-serif;font-weight:500;letter-spacing:0}
h1{font-size:var(--text-30);margin:0 0 8px}
.world-title p:not(.eyebrow){font-size:var(--text-14);color:var(--muted);margin:0}
.mobile{display:none}
.source-switch{border:1px solid var(--line);border-radius:7px;background:#10121d;padding:4px;display:flex}
.source-switch button{font-size:var(--text-12);letter-spacing:0;padding:10px 14px;border-radius:4px;color:var(--muted)}
.source-switch .selected{background:#303142;color:var(--text)}
.source-switch i{width:5px;height:5px;display:inline-block;border-radius:50%;background:#7c9c89;margin-left:4px}
.game-shell{border:1px solid #4a425c;border-radius:12px;position:relative;overflow:hidden;background:#1b1931;box-shadow:0 25px 90px #0003}
canvas{display:block;width:100%;height:auto;image-rendering:pixelated}
.top-hud{position:absolute;left:24px;right:24px;top:22px;display:flex;justify-content:space-between;align-items:start;z-index:2;pointer-events:none}
.top-hud button{pointer-events:auto}
.pilot{display:flex;gap:12px;align-items:center}
.avatar{font-size:var(--text-24);background:#28243be8;border:1px solid #61506b;border-radius:9px;padding:8px}
.pilot b{display:block;font-size:var(--text-14);font-family:'Trebuchet MS',system-ui,sans-serif;letter-spacing:0}
.pilot small{display:block;font-size:var(--text-12);color:#b7a9c9;margin-top:4px}
.hud-counters{display:flex;gap:9px;align-items:center}
.hud-counters>div,.hud-counters>button{background:#17182bc9;border:1px solid #81779b38;backdrop-filter:blur(5px);border-radius:7px;padding:10px 12px;display:flex;gap:8px;align-items:center;font-size:var(--text-14)}
.hud-counters b{font-family:'Trebuchet MS',system-ui,sans-serif;font-size:var(--text-20);font-weight:500}
.hud-counters small{font-size:var(--text-12);color:#b2a8c4}
.hud-counters>div>span{color:var(--gold);font-size:var(--text-20)}
.hud-counters>div:first-child>span{color:var(--mint)}
#weather{color:#c6b7df}
.scene-status{position:absolute;top:91px;left:25px;font-size:var(--text-12);letter-spacing:0;color:#a7a6ca;display:flex;gap:7px;align-items:center}
.status-dot{width:5px;height:5px;background:#b4e7c7;border-radius:50%;box-shadow:0 0 8px #b4e7c780}
#rpm{margin-left:5px;color:#c8badb}
.world-hotspot{position:absolute;font-size:var(--text-12);letter-spacing:0;padding:6px 10px;background:#202032c9;border:1px solid #ffffff20;border-radius:4px;color:#d4c5e0;transition:transform .15s}
.world-hotspot:hover{transform:translateY(-3px);background:#333044}
.world-hotspot span{color:var(--gold);padding-left:5px}
.hut-spot{left:7%;top:56%}
.station-spot{left:77%;top:48%}
.hint{position:absolute;top:39%;left:35%;color:#e6d3ed;font-size:var(--text-14);text-shadow:0 2px 5px #0009;transition:opacity .5s}
.control-dock{position:absolute;bottom:22px;left:50%;transform:translateX(-50%);display:flex;gap:9px;align-items:center;background:#12122177;border:1px solid #9e8bb52e;padding:8px;border-radius:10px;backdrop-filter:blur(7px);white-space:nowrap}
.run-button{color:#1c3c32;background:var(--mint);padding:13px 20px;font-size:var(--text-12);letter-spacing:0;font-weight:700;border-radius:5px;box-shadow:0 3px 0 #719c83}
.run-button span{padding-right:7px}
.run-button:hover{background:#d0ffdf}
.run-button.resting{background:#ddc8f1;color:#48395f;box-shadow:0 3px 0 #8b73a3}
.turbo{padding:6px 15px;color:var(--gold);font-size:var(--text-14);letter-spacing:0}
.turbo small{display:block;font-size:var(--text-12);letter-spacing:0;margin-top:5px;color:#b8a3a2}
.icon-btn{color:#bdacd1;border-left:1px solid var(--line);font-size:var(--text-24);padding:0 12px}
.corner-tag{position:absolute;bottom:25px;left:25px;color:#a39ab3;font-size:var(--text-12);letter-spacing:0}
.corner-tag span{display:block;font-size:var(--text-12);letter-spacing:0;margin-top:5px;color:#70647f}
.below{display:grid;grid-template-columns:1.4fr 1fr;gap:20px;margin-top:20px}
.mission-panel,.passport{border:1px solid var(--line);border-radius:10px;background:linear-gradient(120deg,#202131,#1b1c2b);padding:23px}
.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px}
h2{font-size:var(--text-20);margin:0}
.badge{font-size:var(--text-12);color:#b4acbd;letter-spacing:0;border:1px solid #4b4357;border-radius:4px;padding:7px 8px}
.jobs{display:flex;gap:10px;margin:20px 0}
.job{border:1px solid #414052;border-radius:6px;background:#252636;display:flex;align-items:center;text-align:left;padding:14px;gap:12px;flex:1}
.job:hover{border-color:var(--mint);background:#2a303b}
.job-icon{font-size:var(--text-24)}
.job b{font-size:var(--text-14);display:block;font-weight:500}
.job small{font-size:var(--text-12);color:var(--muted);display:block;margin-top:5px}
.job>strong{margin-left:auto;color:var(--gold);font-size:var(--text-14);font-weight:500}
.route-toggle{display:flex;gap:10px;align-items:center;border-top:1px solid var(--line);padding-top:15px}
.route-toggle>span{font-size:var(--text-12);color:var(--muted);letter-spacing:0;margin-right:auto}
.route-toggle button{font-size:var(--text-12);color:var(--muted);padding:6px 8px;border-radius:4px}
.route-toggle button.selected{background:#353449;color:#e8e0ef}
.route-toggle small{font-size:var(--text-12);opacity:.6;margin-left:4px}
.stamp{font-family:'Trebuchet MS',system-ui,sans-serif;font-size:var(--text-24);color:#c4a6da;border:1px solid #51435c;border-radius:50%;padding:9px 11px}
.quest{display:flex;gap:12px;align-items:center;padding:19px 0;border-bottom:1px solid var(--line)}
.quest>span{color:var(--mint);font-size:var(--text-24)}
.quest b{font-size:var(--text-14);font-weight:500}
.quest small{display:block;font-size:var(--text-12);color:var(--muted);margin-top:5px}
.quest>strong{margin-left:auto;font-size:var(--text-12);color:#a6a0b4;white-space:nowrap}
.stats-row{display:flex;justify-content:space-between;margin-top:17px}
.stats-row b{font-family:'Trebuchet MS',system-ui,sans-serif;font-weight:400;font-size:var(--text-24);display:block}
.stats-row small{font-size:var(--text-12);letter-spacing:0;color:var(--muted);display:block;margin-top:4px}
.collection-strip{display:flex;align-items:center;justify-content:space-between;border:1px solid #393347;border-radius:9px;padding:17px 23px;margin-top:20px;background:linear-gradient(110deg,#27223680,#191a26)}
.collection-strip>div{display:flex;gap:15px;align-items:center}
.collection-strip>div>span{font-size:var(--text-30);color:var(--gold)}
.collection-strip p{font-size:var(--text-14);margin:0}
.collection-strip small{display:block;font-size:var(--text-12);color:var(--muted);margin-top:6px}
.collection-strip button{font-size:var(--text-12);color:#c7b9d5}
footer{display:flex;justify-content:space-between;gap:15px;font-size:var(--text-12);color:#6e6c82;padding:25px 0 0}
footer i{font-style:normal;margin:0 10px}
footer button{font-size:var(--text-12);color:#a494b1;text-decoration:underline;margin-left:12px}
.track-progress{height:5px;background:#343347;border-radius:5px;overflow:hidden}
.track-progress i{display:block;height:100%;background:var(--mint);width:0}
.journey-line{display:flex;justify-content:space-between;font-size:var(--text-14);margin:22px 0 12px}
.journey-line span{color:var(--mint)}
#tripInfo{font-size:var(--text-12);color:var(--muted);margin:12px 0 18px}
dialog{background:#202130;color:var(--text);border:1px solid #62506e;border-radius:12px;padding:30px;width:min(720px,94vw);box-shadow:0 30px 150px #0008}
dialog::backdrop{background:#090915b8;backdrop-filter:blur(5px)}
#close{float:right;color:#b6a9c2;font-size:var(--text-20);padding:4px 0 8px 16px}
dialog h2{font-size:var(--text-24);margin-bottom:10px}
dialog p{font-size:var(--text-14);line-height:1.8;color:#aaa2b9}
dialog h3{font-size:var(--text-14)}
dialog a{color:var(--mint);text-decoration:underline}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin-top:25px}
.skin-card{background:#29283c;border:1px solid #464156;border-radius:7px;text-align:center;padding:20px 10px 12px}
.skin-art{font-size:var(--text-30);display:block;height:65px}
.skin-card b{font-family:'Trebuchet MS',system-ui,sans-serif;font-size:var(--text-14);display:block}
.skin-card small{display:block;font-size:var(--text-12);color:#a298b3;margin:8px 0 15px}
.skin-card button{border:1px solid #5e526e;border-radius:4px;padding:9px 5px;width:100%;font-size:var(--text-12)}
.skin-card .chosen{border-color:var(--mint);color:var(--mint)}
.shop-list{margin-top:22px;display:grid;gap:10px}
.shop-item{display:flex;align-items:center;gap:15px;background:#28283c;border:1px solid #3e3b50;border-radius:6px;padding:16px}
.shop-item>span{font-size:var(--text-24);color:var(--gold)}
.shop-item b{font-size:var(--text-14)}
.shop-item small{display:block;font-size:var(--text-12);color:var(--muted);margin-top:5px}
.shop-item button{margin-left:auto;color:var(--mint);border:1px solid #5a6d64;padding:9px 12px;border-radius:4px;font-size:var(--text-14);white-space:nowrap}
.toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);background:#c5f3d5;color:#213d32;font-size:var(--text-14);padding:14px 23px;border-radius:7px;box-shadow:0 8px 40px #0005;opacity:0;pointer-events:none;transition:opacity .2s,transform .2s;z-index:10}
.toast.show{opacity:1;transform:translate(-50%,0)}
.overlay-mode{background:transparent}
.overlay-mode header,.overlay-mode .world-title,.overlay-mode .below,.overlay-mode .collection-strip,.overlay-mode footer,.overlay-mode .control-dock,.overlay-mode .world-hotspot{display:none}
.overlay-mode main{padding:0;max-width:1100px}
.overlay-mode .game-shell{border:0;border-radius:0}
.overlay-mode .hint{display:none}
.overlay-mode .corner-tag{bottom:20px}
.overlay-mode .pilot small{max-width:200px}
@media(max-width:950px){header{padding:0 25px;gap:25px}
nav{gap:16px}
.logo{font-size:var(--text-14)}
.logo i{display:none}
main{padding:27px 22px}
h1{font-size:var(--text-24)}
.corner-tag{display:none}
.hint{font-size:var(--text-12)}
.below{grid-template-columns:1fr 1fr}
.mission-panel,.passport{padding:18px}
.jobs{gap:8px}
.job{padding:10px;gap:7px}
.job>strong{font-size:var(--text-12)}
.route-toggle{gap:4px}
.route-toggle small{display:none}
}
@media(max-width:650px){header{height:65px;padding:0 16px;gap:16px}
.logo{font-size:var(--text-14);gap:5px;letter-spacing:0}
.logo-pixel{font-size:var(--text-24)}
nav{gap:12px}
nav button{font-size:var(--text-12)}
nav button:first-child{display:none}
.header-end{gap:7px}
#sound span{display:none}
main{padding:25px 13px}
.world-title{align-items:start;gap:8px}
.world-title .eyebrow{font-size:var(--text-12);letter-spacing:0}
h1{font-size:var(--text-24);line-height:1.25}
.world-title p:not(.eyebrow){font-size:var(--text-12);line-height:1.6}
.mobile{display:block}
.source-switch{margin-top:20px}
.source-switch button{font-size:var(--text-12);letter-spacing:0;padding:9px}
.game-shell{border-radius:7px}
canvas{width:160%;max-width:none;margin-left:-30%}
.top-hud{left:12px;right:12px;top:12px}
.avatar{font-size:var(--text-20);padding:5px}
.pilot{gap:7px}
.pilot b{font-size:var(--text-14)}
.pilot small{font-size:var(--text-12);max-width:140px}
.hud-counters{gap:5px}
.hud-counters>div,.hud-counters>button{padding:7px;gap:4px}
.hud-counters b{font-size:var(--text-14)}
.hud-counters small{font-size:var(--text-12)}
.hud-counters>button{display:none}
.scene-status{left:12px;top:66px;font-size:var(--text-12);letter-spacing:0}
.hint{top:37%;left:29%;font-size:var(--text-12);max-width:55%}
.world-hotspot{font-size:var(--text-12);padding:5px}
.hut-spot{left:2%;top:57%}
.station-spot{left:80%;top:50%}
.control-dock{bottom:12px;padding:6px;gap:5px;border-radius:7px}
.run-button{font-size:var(--text-12);padding:12px}
.turbo{font-size:var(--text-12);padding:5px 10px}
.turbo small{font-size:var(--text-12)}
.icon-btn{font-size:var(--text-20);padding:0 7px}
.below{grid-template-columns:1fr;gap:13px;margin-top:13px}
.panel-heading h2{font-size:var(--text-20)}
.badge{font-size:var(--text-12)}
.collection-strip{padding:14px;margin-top:13px;gap:15px}
.collection-strip p{font-size:var(--text-12)}
.collection-strip small{font-size:var(--text-12);line-height:1.6}
.collection-strip button{font-size:var(--text-12);white-space:nowrap}
.collection-strip>div>span{display:none}
footer{flex-direction:column;line-height:1.6;padding-top:20px}
.cards{grid-template-columns:repeat(2,1fr)}
dialog{padding:24px}
.shop-item{padding:12px;gap:10px}
.shop-item small{font-size:var(--text-12)}
.shop-item button{font-size:var(--text-12)}
#saveLabel{font-size:var(--text-12)}
}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;transition:none!important}
}

[hidden]{display:none!important}

/* Alpha 03: fleet, rarity, cargo and operations */
header{gap:32px}
nav{gap:22px}
nav button{white-space:nowrap}
#questCount{font-size:var(--text-12);display:inline-block;color:#1b3429;background:var(--mint);border-radius:8px;padding:1px 4px;font-style:normal;margin-left:3px}
#questCount:empty{display:none}
.forage{position:absolute;left:63%;top:60%;background:#1e352bba;border:1px solid #a5c68e70;border-radius:6px;color:#d5f4a9;padding:7px 10px;animation:none}
.forage>span{font-size:var(--text-24);display:block}
.forage small{font-size:var(--text-12);letter-spacing:0}
.forage:disabled{animation:none;opacity:.25}
.cargo-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:22px;font-size:var(--text-12);color:var(--muted);letter-spacing:0}
.cargo-heading span:last-child{font-size:var(--text-12);letter-spacing:0;text-align:right;color:#b7a9c4}
.cargo-picker{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-top:10px}
.cargo-picker button{border:1px solid #3d3b50;border-radius:5px;padding:10px 4px;font-size:var(--text-12);color:#b4a7c3}
.cargo-picker button.selected{border-color:#8da796;color:var(--mint);background:#33403944}
.cargo-picker button span{display:block;font-size:var(--text-20);margin-bottom:5px}
.jobs{display:grid;grid-template-columns:1fr 1fr;margin:14px 0}
.job.locked{opacity:.4}
.job{min-height:70px}
.quest{width:100%;text-align:left;border-bottom:1px solid var(--line);border-radius:0}
.quest:hover b{color:var(--mint)}
.quest.ready{background:#b9f3cf08}
.operations{display:grid;grid-template-columns:1.1fr 1fr 1fr;gap:16px;margin-top:18px}
.resource-box,.expedition-box,.crew-box,.network{border:1px solid var(--line);border-radius:9px;background:linear-gradient(130deg,#252333aa,#1b1d2b);padding:20px}
.resource-values{display:flex;gap:30px}
.resource-values>span{color:var(--gold);font-size:var(--text-16)}
.resource-values b{font-family:'Trebuchet MS',system-ui,sans-serif;font-size:var(--text-24);color:var(--text);font-weight:400;margin-left:7px}
.resource-values small{display:block;font-size:var(--text-12);letter-spacing:0;color:var(--muted);margin-top:5px}
.craft-actions{display:flex;gap:12px;margin-top:17px;padding-top:13px;border-top:1px solid var(--line)}
.craft-actions button{text-align:left;font-size:var(--text-12);color:#d1bfdc}
.craft-actions small{display:block;font-size:var(--text-12);color:var(--muted);margin-top:5px}
.expedition-box h2{font-size:var(--text-20)}
.expedition-box p:not(.eyebrow){font-size:var(--text-12);line-height:1.7;color:var(--muted);min-height:34px}
.expedition-box button,.crew-box>button{font-size:var(--text-12);color:var(--mint);border-bottom:1px solid #69857066;padding:6px 0}
.crew-box>button{margin-top:12px}
.perk{font-size:var(--text-12);line-height:1.6;margin-bottom:10px;display:flex;gap:9px}
.perk small{display:block;color:var(--muted);font-size:var(--text-12)}
.perk b{font-weight:500}
.network{margin-top:18px}
.network-stations{display:grid;grid-template-columns:repeat(5,1fr);margin-top:22px;position:relative;gap:12px}
.network-stations:before{content:'';position:absolute;left:8%;right:8%;top:13px;border-top:2px dashed #4c455c;z-index:0}
.network-stop{position:relative;z-index:1}
.network-stop i{display:block;width:28px;height:28px;border:1px solid #655b75;background:#302b41;border-radius:50%;font-size:var(--text-12);font-style:normal;text-align:center;padding-top:6px;margin-bottom:12px;color:#b9a7ce}
.network-stop.current i{background:var(--mint);color:#29463b;border-color:var(--mint);box-shadow:0 0 18px #b9f3cf30}
.network-stop.locked{opacity:.4}
.network-stop b{font-size:var(--text-12);font-weight:500;display:block}
.network-stop small{display:block;color:var(--muted);font-size:var(--text-12);margin-top:5px}
.rarity{font-size:var(--text-12);letter-spacing:0;font-weight:700;display:inline-block;margin:5px 0 10px;color:#9eaaac}
.rarity.RARE{color:#94c9ec}
.rarity.EPIC{color:#c4a0ea}
.rarity.LEGENDARY{color:#f5d184}
.skin-card.RARE{border-color:#486782;background:linear-gradient(#253a4d44,#252636)}
.skin-card.EPIC{border-color:#74528b;background:linear-gradient(#59347544,#252636)}
.skin-card.LEGENDARY{border-color:#a48646;background:linear-gradient(#805c2144,#252636);box-shadow:inset 0 0 25px #b48a2210}
.cards{grid-template-columns:repeat(3,1fr)}
dialog{width:min(860px,95vw)}
.portrait{width:100%;height:110px;image-rendering:pixelated;display:block;background:radial-gradient(ellipse at center,#ffffff0b,transparent 70%)}
.skin-card{padding:12px;text-align:left;position:relative}
.skin-card b{font-size:var(--text-14)}
.skin-card small{font-size:var(--text-12);min-height:25px;margin:7px 0 10px;line-height:1.6}
.skin-card .ability{color:#c4dbc8;min-height:36px;font-size:var(--text-12);padding:9px 0;border-top:1px solid #ffffff0c}
.skin-card button{padding:10px 5px}
.wallet-line{font-family:'Trebuchet MS',system-ui,sans-serif;font-size:var(--text-14)!important;color:var(--gold)!important}
.modal-note{border-left:2px solid #a48bb3;padding-left:12px}
.quest-list{display:grid;gap:9px;margin-top:22px}
.quest-item{display:flex;align-items:center;gap:15px;background:#29283a;padding:16px;border:1px solid #414054;border-radius:6px}
.quest-item.done{opacity:.55}
.quest-item>span{font-size:var(--text-24);color:var(--gold)}
.quest-item b{font-size:var(--text-14)}
.quest-item small{display:block;font-size:var(--text-12);color:var(--muted);margin-top:5px}
.quest-item button{margin-left:auto;border:1px solid #5c7466;border-radius:4px;padding:10px 13px;font-size:var(--text-12);color:var(--mint);white-space:nowrap}
.quest-item em{font-size:var(--text-12);font-style:normal;color:var(--muted);margin-left:auto;white-space:nowrap}
.expedition-options{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:20px}
.expedition-card{padding:18px;border:1px solid #4c435b;background:#2b273c;border-radius:6px}
.expedition-card h3{font-size:var(--text-16);margin-top:0}
.expedition-card p{font-size:var(--text-12)}
.expedition-card button{padding:10px;border:1px solid #7e708d;border-radius:4px;font-size:var(--text-14);width:100%;color:var(--mint)}
.expedition-select{display:block;background:#302b42;color:var(--text);border:1px solid #655672;border-radius:5px;padding:10px;font:inherit;font-size:var(--text-14);width:100%;margin:12px 0}
.expedition-reward{color:var(--gold)!important}
.shop-item .cost{font-size:var(--text-12);color:var(--gold);display:block}
.export-actions{display:flex;gap:12px;border-top:1px solid var(--line);padding-top:16px;margin-top:20px}
.export-actions button{font-size:var(--text-12);color:var(--mint)}
.overlay-mode .forage,.overlay-mode .operations,.overlay-mode .network{display:none}
@keyframes glimmer{50%{box-shadow:0 0 20px #d1e49733;transform:translateY(-3px)}
}
@media(max-width:1100px){header{gap:20px}
nav{gap:14px}
.operations{grid-template-columns:1fr 1fr}
.crew-box{grid-column:1/-1;display:flex;align-items:center;gap:25px}
.crew-box .eyebrow{display:none}
#activePerks{display:flex;gap:25px}
.crew-box>button{margin-top:0;margin-left:auto}
.perk{margin:0}
}
@media(max-width:750px){header{gap:12px;flex-wrap:wrap;height:auto;min-height:65px;padding-top:10px;padding-bottom:10px}
.logo{margin-right:auto}
.header-end{margin-left:0}
nav{order:3;width:100%;height:33px;justify-content:space-between;gap:12px}
nav button{font-size:var(--text-12);height:33px}
nav button:first-child{display:block}
.cargo-picker button{font-size:var(--text-12)}
.cargo-heading span:last-child{font-size:var(--text-12)}
.operations{grid-template-columns:1fr}
.crew-box{display:block}
.crew-box>button{margin-top:10px}
#activePerks{display:block}
.perk{margin-bottom:10px}
.network{padding:17px}
.network-stations{gap:8px}
.network-stop b{font-size:var(--text-12)}
.network-stop small{font-size:var(--text-12)}
.network .badge{font-size:var(--text-12)}
.network h2{font-size:var(--text-16)}
.forage{left:63%;top:60%;padding:4px 6px}
.forage small{font-size:var(--text-12)}
.forage>span{font-size:var(--text-20)}
.cards{grid-template-columns:repeat(2,1fr)}
.portrait{height:95px}
.expedition-options{grid-template-columns:1fr}
.quest-item{padding:12px;gap:9px}
.quest-item b{font-size:var(--text-14)}
.quest-item small{font-size:var(--text-12)}
.quest-item button{font-size:var(--text-12);padding:9px}
.resource-values{gap:40px}
}

/* Local engineer profiles and rankings */
.welcome{min-height:100dvh;display:flex;align-items:center;justify-content:center;position:relative;overflow:hidden;padding:35px 20px;background:#151523}
.welcome-world{position:absolute;inset:0;opacity:.7;display:flex;align-items:center;justify-content:center;filter:blur(1px)}
.welcome-world canvas{width:100%;min-width:1200px;height:auto;position:absolute;bottom:0;image-rendering:pixelated}
.welcome:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#10111b70,#14142120 60%,#10111b70);pointer-events:none}
.welcome-card{position:relative;z-index:1;width:430px;background:#1d1e2dea;border:1px solid #69607870;border-radius:14px;padding:35px 38px;box-shadow:0 20px 100px #0007;backdrop-filter:blur(12px)}
.welcome-card .logo{justify-content:center;font-size:var(--text-20);margin-bottom:37px}
.welcome-card .eyebrow{font-size:var(--text-12);letter-spacing:0}
.welcome-card h1{font-size:var(--text-30);letter-spacing:0}
.welcome-card>p:not(.eyebrow){font-size:var(--text-14);color:#aca4bd;line-height:1.8;margin:15px 0 25px}
.welcome-card label{font-size:var(--text-12);letter-spacing:0;color:#c9bad6;display:block;margin-bottom:9px}
.welcome-card input{width:100%;background:#151723;border:1px solid #51495f;border-radius:6px;padding:14px;color:var(--text);font:inherit;font-size:var(--text-16)}
.welcome-card input:focus{border-color:var(--mint);box-shadow:0 0 0 3px #b9f3cf10}
.welcome-card input[aria-invalid=true]{border-color:#d88c9a}
.welcome-card form>small{font-size:var(--text-12);display:block;color:#8d839e;margin-top:8px}
.welcome-card .run-button{width:100%;padding:15px;margin-top:6px}
.welcome-note{font-size:var(--text-12);line-height:1.8;text-align:center;color:#9890a7;margin-top:20px}
.welcome-card #profileError{font-size:var(--text-12);line-height:1.5;color:#e3a4b0;min-height:15px;margin:10px 0}
.needs-profile>header,.needs-profile>main{display:none}
.player-tag{display:flex;gap:6px;align-items:center;max-width:130px}
.player-tag span{color:var(--mint)}
.player-tag b{font-weight:500;overflow-wrap:anywhere;white-space:normal}
.player-tag small{font-size:var(--text-14);color:var(--muted)}
.header-end{gap:10px}
.overlay-mode .welcome{display:none}
.welcome-board{display:block;margin:20px auto 0;font-size:var(--text-14);color:#c5b3db}
.board-tabs{display:flex;gap:8px;border-bottom:1px solid var(--line);padding:8px 0 15px}
.board-tabs button{font-size:var(--text-14);padding:9px 15px;border-radius:5px;color:var(--muted)}
.board-tabs button.selected{background:#343449;color:var(--mint)}
.board-scroll{overflow-x:auto}
.ranking-table{width:100%;border-collapse:collapse;margin:15px 0;text-align:left;font-size:var(--text-14);white-space:nowrap}
.ranking-table th{font-size:var(--text-12);color:var(--muted);letter-spacing:0;text-transform:none;font-weight:500;padding:12px}
.ranking-table td{padding:16px 12px;border-top:1px solid var(--line);color:#b8aec7}
.ranking-table td b{font-weight:500;color:var(--text)}
.ranking-table td small{font-size:var(--text-12);margin-left:8px;color:var(--mint);letter-spacing:0}
.ranking-table tr.you{background:#b9f3cf09}
.rank{font-family:'Trebuchet MS',system-ui,sans-serif;color:var(--muted);font-size:var(--text-14)}
.rank-0{color:#f1cf84;font-size:var(--text-24)}
.rank-1{color:#b6cce3;font-size:var(--text-20)}
.rank-2{color:#d0a28a;font-size:var(--text-20)}
.board-empty{padding:45px 15px;text-align:center;color:#dbcee6;font-family:'Trebuchet MS',system-ui,sans-serif;font-size:var(--text-20)}
.board-empty small{display:block;font-family:system-ui,sans-serif;font-size:var(--text-14);color:var(--muted);margin-top:12px;line-height:1.7}
.score-note{font-size:var(--text-12)!important;line-height:1.8!important}
.needs-profile dialog{z-index:4}
header{gap:20px}
nav{gap:16px}
.logo i{display:none}
@media(max-width:1100px){header{gap:12px}
.logo{font-size:var(--text-14)}
nav{gap:12px}
nav button{font-size:var(--text-14)}
.player-tag{max-width:100px}
.player-tag b{max-width:none}
}
@media(max-width:750px){header{flex-wrap:wrap;height:auto;min-height:65px;padding-top:10px;padding-bottom:10px}
.logo{margin-right:auto}
.header-end{margin-left:0}
nav{order:3;width:100%;height:33px;justify-content:space-between;gap:8px}
nav button{font-size:var(--text-12);height:33px}
nav button:first-child{display:none}
.welcome-card{padding:30px 26px}
.welcome-card h1{font-size:var(--text-30)}
.welcome-card .logo{font-size:var(--text-16)}
.header-end{gap:8px}
.player-tag b{max-width:none}
.logo{font-size:var(--text-14)}
.ranking-table th,.ranking-table td{padding:12px 8px}
.ranking-table{font-size:var(--text-14)}
}

/* Keep mode controls beside the engineer name; the game starts below the nav. */
#gameHeader .source-switch{margin:0;flex-shrink:0;padding:3px}

#gameHeader .source-switch button{padding:8px 9px;font-size:var(--text-12);letter-spacing:0}

#gameHeader .header-end{gap:10px}

#gameMain{padding-top:22px}

@media(min-width:1101px){#gameHeader{gap:17px}
#gameHeader nav{gap:14px}
#gameHeader nav button{font-size:var(--text-14)}
}

@media(min-width:751px) and (max-width:1100px){#gameHeader{flex-wrap:wrap;height:auto;padding-top:12px;padding-bottom:8px}
#gameHeader .logo{margin-right:auto}
#gameHeader .header-end{margin-left:0}
#gameHeader nav{order:3;width:100%;height:32px;justify-content:center;gap:28px}
#gameHeader nav button{height:32px}
}

@media(max-width:750px){#gameHeader .source-switch button{font-size:var(--text-12);padding:7px 6px;letter-spacing:0}
#gameHeader .header-end{gap:7px}
#gameHeader .player-tag{max-width:85px}
#gameHeader .player-tag b{max-width:none}
#gameHeader .logo{font-size:var(--text-12);gap:4px}
#gameHeader .logo-pixel{font-size:var(--text-24)}
#gameHeader #help{display:none}
#gameMain{padding-top:14px}
}

@media(max-width:380px){#gameHeader{padding-left:10px;padding-right:10px;gap:6px}
#gameHeader .header-end{gap:4px}
#gameHeader .player-tag b{max-width:none}
#gameHeader .source-switch button{padding:6px 4px}
#gameHeader .logo{font-size:var(--text-12)}
}

/* Release accessibility and reflow: retain the valley art and established palette. */
html{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
h1,h2{letter-spacing:-.02em}
p{max-width:70ch;text-wrap:pretty}
button{min-height:44px;line-height:1.4}
button:not(:disabled):active{transform:scale(.96)}
input:focus-visible,select:focus-visible{outline:2px solid var(--mint);outline-offset:3px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
.skip-link{position:fixed;top:12px;left:12px;z-index:20;transform:translateY(-180%);padding:12px;background:var(--mint);color:#1c3c32}
.skip-link:focus{transform:none}
.needs-profile .skip-link{display:none}
.scene-art{position:relative}
.top-hud{flex-wrap:wrap}
.hud-counters{flex-wrap:wrap;max-width:100%}
.hud-counters b{overflow-wrap:anywhere;max-width:12ch}
.network-stop.current i{box-shadow:none}
.game-shell,.welcome-card,dialog,.skin-card.LEGENDARY{box-shadow:none}
.welcome-card{width:min(460px,100%);background:#1d1e2d;border:0;padding:30px}
.welcome-card .logo{letter-spacing:0;margin-bottom:24px}
.welcome-card h1{font-size:var(--text-30)}
.welcome-card>p:not(.eyebrow){font-size:var(--text-16);line-height:1.5;margin:12px 0 22px}
.welcome-card label{font-size:var(--text-14);letter-spacing:0}
.welcome-card input{font-size:var(--text-16);min-height:48px}
.welcome-card form>small,.welcome-note{font-size:var(--text-12);color:var(--muted);line-height:1.6}
.welcome-card #profileError{font-size:var(--text-12);min-height:20px;margin:8px 0}
.welcome-card .run-button{font-size:var(--text-14);letter-spacing:0}
.welcome-board{font-size:var(--text-14);margin:12px auto 0}
.welcome-note{margin-top:12px}
#gameHeader{height:auto;min-height:85px;flex-wrap:wrap;padding-top:14px;padding-bottom:8px;gap:10px 20px;white-space:normal}
#gameHeader .logo{font-size:var(--text-16);white-space:nowrap;margin-right:auto;letter-spacing:0}
#gameHeader .logo-pixel{font-size:var(--text-24)}
#gameHeader nav{order:3;width:100%;height:auto;min-height:44px;justify-content:center;gap:20px;flex-wrap:wrap}
#gameHeader nav button{font-size:var(--text-14);height:auto;min-height:44px}
#gameHeader .header-end{margin-left:auto;gap:12px;min-width:0}
#gameHeader .source-switch{gap:4px}
#gameHeader .source-switch button{font-size:var(--text-12);letter-spacing:0;min-height:36px;padding:8px 12px}
#gameHeader .player-tag{max-width:none;min-width:0;text-align:left}
#gameHeader .player-tag b{max-width:none;overflow:visible;text-overflow:clip;font-size:var(--text-14);overflow-wrap:anywhere;white-space:normal}
#gameHeader #help{display:block;width:44px;height:44px;flex-shrink:0}
#gameHeader #sound{min-width:44px}
.pilot canvas.avatar{width:44px;height:44px;margin:0;padding:0;max-width:none;flex-shrink:0}
.pilot b,.hud-counters b{font-size:var(--text-16)}
.pilot small{font-size:var(--text-12);line-height:1.4;max-width:220px}
.hud-counters small{font-size:var(--text-12)}
.scene-status{font-size:var(--text-12);letter-spacing:0;line-height:1.5;max-width:calc(100% - 50px);flex-wrap:wrap}
.hint{font-size:var(--text-14);max-width:45%;line-height:1.5}
.world-hotspot{font-size:var(--text-12);letter-spacing:0;min-width:70px}
.run-button{font-size:var(--text-14);letter-spacing:0}
.turbo{font-size:var(--text-14);letter-spacing:0}
.turbo small{font-size:var(--text-12);letter-spacing:0;opacity:1}
.forage small{font-size:var(--text-12);letter-spacing:0}
.forage{min-width:86px;animation:none}
.section-title{font-size:var(--text-20);margin:0 0 16px}
.panel-heading{flex-wrap:wrap;align-items:flex-start}
.badge{letter-spacing:0;max-width:100%;font-size:var(--text-12)}
.job{min-width:0;flex-wrap:wrap}
.job>span:nth-child(2){flex:1;min-width:0}
.job b,.job small{overflow-wrap:anywhere}
.route-toggle{flex-wrap:wrap}
.route-toggle button{font-size:var(--text-12)}
.route-toggle small{opacity:1}
.cargo-heading{flex-wrap:wrap;letter-spacing:0;font-size:var(--text-12)}
.cargo-heading span:last-child{text-align:left;font-size:var(--text-12)}
.cargo-picker button{font-size:var(--text-12)}
.quest{gap:10px}
.quest>div{min-width:0}
.stats-row{gap:12px;flex-wrap:wrap}
.stats-row small,.resource-values small,.network-stop small,.rarity{letter-spacing:0;font-size:var(--text-12)}
.resource-values{justify-content:space-between;gap:12px;flex-wrap:wrap}
.craft-actions{flex-wrap:wrap}
.craft-actions button{flex:1 1 120px}
.expedition-box p:not(.eyebrow){font-size:var(--text-14)}
.crew-box{min-width:0}
.perk{font-size:var(--text-14)}
.perk small{font-size:var(--text-12)}
.rarity{font-weight:500;flex-shrink:0}
.network-stop b{font-size:var(--text-14);overflow-wrap:anywhere}
footer{font-size:var(--text-12);color:var(--muted);flex-wrap:wrap}
footer button,#saveLabel{font-size:var(--text-12)}
dialog{max-height:calc(100dvh - 32px);overscroll-behavior:contain;overflow-y:auto}
dialog h2{font-size:var(--text-24);margin-right:36px}
dialog p{font-size:var(--text-14);line-height:1.6}
dialog h3{font-size:var(--text-16)}
#close{min-width:44px;padding:8px;margin:-8px -8px 0 0}
.portrait{margin:0;max-width:100%}
.shop-item,.quest-item{flex-wrap:wrap;min-width:0}
.shop-item>div,.quest-item>div{flex:1;min-width:120px}
.shop-item button,.quest-item button{white-space:normal}
.quest-item em{white-space:normal}
.ranking-table{font-size:var(--text-14)}
.ranking-table th{font-size:var(--text-12);letter-spacing:0}
.ranking-table td small{font-size:var(--text-12);letter-spacing:0}
.board-scroll{max-width:100%;overscroll-behavior-inline:contain}
.toast{width:max-content;max-width:calc(100vw - 32px);font-size:var(--text-14);padding:12px 16px;line-height:1.5;text-align:center}
@media(max-width:750px){
  #gameHeader{padding:10px 13px 0;gap:8px}
  #gameHeader .logo{font-size:var(--text-14)}
  #gameHeader .header-end{width:100%;display:grid;grid-template-columns:minmax(0,1fr) 44px 44px;gap:4px 8px;align-items:center}
  #gameHeader .source-switch{grid-column:1/-1;justify-self:start}
  #gameHeader .source-switch button{min-height:40px;padding:8px 12px}
  #gameHeader .player-tag{max-width:100%;width:max-content;min-height:44px}
  #gameHeader nav{gap:4px;flex-wrap:nowrap;justify-content:space-between}
  #gameHeader nav button{font-size:var(--text-12);padding:4px 0;min-width:24px}
  #gameHeader #sound span{display:none}
  #gameMain{padding:14px 13px 24px}
  .top-hud{position:relative;inset:auto;padding:12px;gap:10px;align-items:center;background:var(--panel)}
  .pilot{min-width:0;gap:8px;flex:1}
  .pilot small{max-width:140px}
  .hud-counters{gap:6px;flex-shrink:0}
  .hud-counters>div{padding:6px;gap:4px}
  .hud-counters>div>span{display:none}
  .hud-counters>button{display:none}
  .scene-art{overflow:hidden}
  #world{width:100%;max-width:none;margin:0}
  .scene-status{position:relative;inset:auto;max-width:none;padding:8px 12px;margin:0;gap:4px 8px;background:#1b1931}
  .hint{display:none}
  .world-hotspot{padding:4px 8px;min-height:36px}
  .hut-spot{left:10px;top:24%}
  .station-spot{left:auto;right:10px;top:48%}
  .forage{left:58%;top:62%;min-width:70px;padding:4px 6px}
  .control-dock{position:relative;inset:auto;transform:none;margin:4px 12px 12px;padding:0;border:0;background:none;backdrop-filter:none;flex-wrap:wrap;gap:8px;white-space:normal}
  .control-dock .run-button{flex:1 1 100%;padding:12px;min-height:44px;font-size:var(--text-14)}
  .turbo{flex:1;padding:4px 8px;font-size:var(--text-14)}
  .turbo small{font-size:var(--text-12);margin-top:0}
  .icon-btn{min-width:44px}
  .below{grid-template-columns:1fr}
  .cargo-picker{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cargo-picker button{font-size:var(--text-14)}
  .cargo-picker button span{display:inline;margin:0 6px 0 0;font-size:var(--text-16)}
  .jobs{grid-template-columns:1fr}
  .job{padding:12px}
  .job b{font-size:var(--text-14)}
  .job>strong{font-size:var(--text-14)}
  .operations{grid-template-columns:1fr}
  .crew-box{display:block}
  .crew-box>button{margin-left:0}
  .network-stations{grid-template-columns:1fr;gap:16px}
  .network-stations:before{left:14px;right:auto;top:14px;bottom:14px;border-top:0;border-left:2px dashed #4c455c}
  .network-stop{display:grid;grid-template-columns:28px minmax(0,1fr);gap:0 12px}
  .network-stop i{grid-row:1/3;margin:0}
  .network-stop small{grid-column:2;font-size:var(--text-12)}
  .network-stop.locked{opacity:1;color:var(--muted)}
  .network h2{font-size:var(--text-20)}
  .panel-heading h2{font-size:var(--text-20)}
  .quest-item b,.quest-item small,.quest-item button{font-size:var(--text-12)}
  .shop-item small,.shop-item button{font-size:var(--text-12)}
  .welcome{padding:20px 16px}
  .welcome-card{padding:24px}
  .welcome-card .logo{font-size:var(--text-16)}
  .welcome-card h1{font-size:var(--text-30)}
  .overlay-mode .top-hud{position:absolute;left:12px;right:12px;top:12px;padding:0;background:none}
  .overlay-mode #world{width:100%;margin:0}
  .overlay-mode .scene-status{position:absolute;top:90px;left:12px;right:12px;max-width:100%;padding:0;background:none}
  .overlay-mode #gameMain{padding:0}
}
@media(max-width:480px){
  .cards{grid-template-columns:1fr}
  dialog{padding:20px}
  .skin-card{padding:16px}
  .portrait{height:125px}
}
@media(prefers-reduced-motion:reduce){
  *,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}
  button:not(:disabled):active{transform:none}
}
@media(forced-colors:active){
  :focus-visible{outline:2px solid Highlight!important;outline-offset:3px}
}