@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Marcellus&display=swap');

:root { --ink:#e9f4ef; --muted:#9bb5b2; --gold:#e9b85a; --teal:#55d2bd; --panel:rgba(5,23,35,.79); }
* { box-sizing:border-box; }
html,body,body * { -webkit-user-select:none; user-select:none; -webkit-touch-callout:none; }
input:not([type]),input[type="text"],input[type="search"],input[type="email"],input[type="password"],input[type="url"],input[type="tel"],textarea,[contenteditable="true"] { -webkit-user-select:text; user-select:text; -webkit-touch-callout:default; }
button,[role="button"] { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
html,body { margin:0; width:100%; height:100%; overflow:hidden; background:#061b2a; color:var(--ink); font-family:"DM Sans",sans-serif; }
#render-stack { position:fixed; inset:0; overflow:hidden; }
#environment,#game { position:absolute; inset:0; width:100%; height:100%; }
#environment { pointer-events:none; }
#game { cursor:crosshair; touch-action:none; }
.glass { background:linear-gradient(145deg,rgba(7,31,45,.88),rgba(4,20,32,.74)); border:1px solid rgba(172,220,211,.16); box-shadow:0 18px 50px rgba(0,8,17,.25),inset 0 1px rgba(255,255,255,.04); backdrop-filter:blur(12px); }
.topbar { position:fixed; top:0; left:0; right:0; height:76px; display:flex; align-items:center; justify-content:space-between; padding:0 28px; background:linear-gradient(180deg,rgba(3,18,29,.88),transparent); pointer-events:none; }
.brand { display:flex; align-items:center; gap:12px; }
.brand-mark { display:grid; place-items:center; width:38px; height:38px; border:1px solid rgba(233,184,90,.45); border-radius:50%; color:var(--gold); }
.brand strong { display:block; font:20px "Marcellus",serif; letter-spacing:.04em; }
.brand small,.eyebrow { color:var(--gold); font-size:9px; font-weight:700; letter-spacing:.2em; }
.status { display:flex;align-items:center;gap:8px;font-size:10px; letter-spacing:.13em; color:var(--muted); }
.status>b{width:1px;height:14px;margin:0 4px;background:rgba(255,255,255,.13)}
.status-dot { display:inline-block; width:6px; height:6px; margin-right:8px; border-radius:50%; background:var(--teal); box-shadow:0 0 10px var(--teal); }
.status-dot.offline{margin-right:0;background:#7d9293;box-shadow:none}.status-dot.connecting{margin-right:0;background:var(--gold);box-shadow:0 0 8px var(--gold)}.status-dot.online{margin-right:0;background:var(--teal);box-shadow:0 0 10px var(--teal)}
.instrument-panel { position:fixed; top:94px; left:24px; width:252px; padding:18px; border-radius:8px; }
.compass-wrap { display:flex; gap:15px; align-items:center; margin-top:15px; }
.compass { position:relative; flex:0 0 106px; height:106px; border:1px solid rgba(222,240,234,.3); border-radius:50%; background:radial-gradient(circle,rgba(84,178,166,.08),transparent 64%); box-shadow:inset 0 0 0 7px rgba(255,255,255,.018); }
.compass::before,.compass::after { content:""; position:absolute; background:rgba(210,232,228,.1); }
.compass::before { left:50%; top:10px; width:1px; height:86px; }.compass::after { top:50%; left:10px; height:1px; width:86px; }
.compass>span { position:absolute; z-index:2; color:#a9c0bd; font-size:8px; }.north{top:5px;left:50%;transform:translateX(-50%)}.south{bottom:5px;left:50%;transform:translateX(-50%)}.east{right:6px;top:50%;transform:translateY(-50%)}.west{left:6px;top:50%;transform:translateY(-50%)}
.wind-arrow { position:absolute; inset:16px; z-index:3; transition:transform .15s linear; transform-origin:center; }
.wind-arrow span { position:absolute; top:-7px; left:50%; color:var(--gold); font-size:18px; transform:translateX(-50%) rotate(-90deg); text-shadow:0 0 12px rgba(233,184,90,.7); }
.ship-arrow { position:absolute; left:50%; top:50%; z-index:4; width:24px; height:34px; color:#f2faf6; transform:translate(-50%,-50%) rotate(0deg); transform-origin:center; transition:transform .15s linear; filter:drop-shadow(0 2px 4px #001); }
.ship-arrow::after { content:""; position:absolute; top:10px; left:50%; width:2px; height:15px; transform:translateX(-50%); border-radius:2px; background:linear-gradient(#f2faf6,rgba(242,250,246,.22)); }
.ship-arrow span { position:absolute; top:2px; left:50%; z-index:1; transform:translateX(-50%); font-size:14px; line-height:12px; text-shadow:0 0 8px rgba(190,235,229,.65); }
.wind-readout span,.wind-readout small { display:block; font-size:9px; color:var(--muted); letter-spacing:.12em; }.wind-readout strong { display:block; margin:3px 0; font:20px "Marcellus",serif; }
.divider { height:1px; margin:16px 0; background:rgba(180,217,210,.1); }
.sailing-state { display:flex; align-items:center; gap:11px; }.state-icon { color:var(--teal); font-size:24px; }.sailing-state small { display:block; color:var(--muted); font-size:8px; letter-spacing:.12em; }.sailing-state strong { display:block; margin-top:3px; color:var(--teal); font-size:12px; letter-spacing:.08em; }
.efficiency-row { display:flex; justify-content:space-between; margin-top:16px; color:var(--muted); font-size:8px; letter-spacing:.1em; }.efficiency-row strong { color:var(--ink); }
.meter,.mission-progress { height:3px; margin-top:7px; overflow:hidden; background:rgba(255,255,255,.08); border-radius:3px; }.meter i,.mission-progress i { display:block; height:100%; width:0; background:linear-gradient(90deg,var(--teal),#a0ead9); box-shadow:0 0 8px var(--teal); transition:width .25s; }
.telemetry { position:fixed; right:24px; top:94px; display:grid; grid-template-columns:repeat(2,126px); padding:5px; border-radius:8px; }.telemetry>div { min-height:66px; padding:10px 14px; border-right:1px solid rgba(255,255,255,.08); border-bottom:1px solid rgba(255,255,255,.08); }.telemetry>div:nth-child(2n){border-right:0}.telemetry>div:nth-child(n+3){border-bottom:0}.telemetry small { display:block; color:var(--muted); font-size:8px; letter-spacing:.14em; }.telemetry strong { display:block; margin-top:4px; font:23px "Marcellus",serif; }.telemetry em { margin-left:3px; color:var(--muted); font:9px "DM Sans",sans-serif; }
.hull-telemetry>i{display:block;width:100%;height:2px;margin-top:4px;overflow:hidden;border-radius:2px;background:rgba(255,255,255,.1)}.hull-telemetry>i b{display:block;width:100%;height:100%;background:var(--teal);transition:width .2s,background .2s}
.telemetry>.reload-telemetry{width:auto}.reload-telemetry-title{display:flex;align-items:center;justify-content:space-between;gap:6px}.telemetry .reload-telemetry-title>strong{display:block;margin:0;color:var(--gold);font:700 7px "DM Sans",sans-serif;letter-spacing:.07em;white-space:nowrap}.telemetry .reload-telemetry-title>strong.empty{color:#e27769}.reload-telemetry>span{display:grid;grid-template-columns:24px 1fr 31px;align-items:center;gap:5px;margin-top:7px}.reload-telemetry>span>b{color:var(--gold);font-size:6px}.reload-telemetry>span>i{height:3px;overflow:hidden;border-radius:3px;background:rgba(255,255,255,.1)}.reload-telemetry>span>i em{display:block;width:100%;height:100%;margin:0;background:var(--teal);transition:width .08s linear}.reload-telemetry>span>strong{margin:0;color:#b9ceca;font:6px "DM Sans",sans-serif;text-align:right;letter-spacing:.05em}
.telemetry .broadside-remaining-label{margin-left:.35em;color:inherit;font:inherit;letter-spacing:inherit}
.weather-status{display:flex;align-items:center;gap:11px;color:var(--ink);white-space:nowrap}.header-weather{position:absolute;left:50%;transform:translateX(-50%)}.weather-current,.weather-forecast{display:flex;align-items:center;gap:8px}.weather-current>span,.weather-forecast>span{display:grid;place-items:center;width:30px;height:30px;border:1px solid rgba(255,255,255,.1);border-radius:50%;color:var(--gold);font-size:18px;transition:.25s}.weather-status strong,.weather-status em{display:block}.weather-status strong{font:12px "Marcellus",serif;letter-spacing:.08em}.weather-status em{margin-top:2px;color:var(--gold);font-size:7px;font-style:normal;letter-spacing:.1em}.weather-arrow,.weather-forecast{opacity:0;max-width:0;overflow:hidden;transform:translateX(-5px);transition:opacity .2s,max-width .25s,transform .2s}.weather-arrow{color:#6f908d;font-size:18px}.weather-arrow.visible{opacity:1;max-width:20px;transform:none}.weather-forecast.visible{opacity:1;max-width:130px;transform:none}.weather-status.warning .weather-current>span{border-color:rgba(233,184,90,.35)}.weather-status.storm .weather-current>span{color:#b5d6df;text-shadow:0 0 9px #b5d6df}.weather-status.calm .weather-current>span{color:#9edbd2}
.mission { position:fixed; left:24px; bottom:27px; width:292px; padding:17px 18px; border-radius:8px; transition:opacity .3s,transform .3s; }.mission.hidden{opacity:0;transform:translateY(15px);pointer-events:none}.mission-head { display:flex; justify-content:space-between; color:var(--gold); font-size:9px; font-weight:700; letter-spacing:.15em; }.mission-head button { border:0; background:none; color:var(--muted); cursor:pointer; font-size:18px; line-height:10px; }.mission h2 { margin:9px 0 5px; font:18px "Marcellus",serif; }.mission p { min-height:34px; margin:0; color:#b9ccca; font-size:11px; line-height:1.55; }.mission small { display:block; margin-top:7px; color:var(--muted); font-size:8px; letter-spacing:.1em; }
.chart { --chart-right:24px; --chart-bottom:27px; --chart-map-size:194px; --chart-slider-space:0px; position:fixed; right:var(--chart-right); bottom:var(--chart-bottom); z-index:10; width:216px; height:calc(var(--chart-map-size) + 53px + var(--chart-slider-space)); padding:10px; border-radius:8px; transform-origin:right bottom; transition:width .24s cubic-bezier(.2,.75,.25,1),height .24s cubic-bezier(.2,.75,.25,1),box-shadow .24s ease; }
.chart-head { display:flex; align-items:center; justify-content:space-between; min-height:24px; color:var(--muted); font-size:7px; letter-spacing:.12em; }.chart-head strong{font-size:7px;color:#c9d9d6}
.chart-actions,.chart-zoom{display:flex;align-items:center;gap:5px}.chart-zoom{display:none}.chart button{display:grid;place-items:center;width:24px;height:24px;padding:0;border:1px solid rgba(166,210,203,.18);border-radius:4px;color:#c9d9d6;background:rgba(255,255,255,.035);font:600 13px "DM Sans",sans-serif;cursor:pointer}.chart button:hover{border-color:rgba(85,210,189,.55);color:var(--teal);background:rgba(85,210,189,.08)}.chart button:disabled{opacity:.3;cursor:default}.chart-toggle span{line-height:1}.chart-collapse-icon{display:none}
.chart-map{position:relative;width:100%;height:auto;aspect-ratio:1;margin:7px auto 0}
#minimap { display:block; width:100%; height:100%; margin:0; border:1px solid rgba(166,210,203,.12); border-radius:3px; background:#071d2c; touch-action:none; }
.minimap-compact-zoom{display:none;align-items:center;gap:6px;width:100%;height:28px;margin:7px auto 0;color:#8faeaa;font:700 12px "DM Sans",sans-serif}.minimap-compact-zoom input{flex:1;min-width:0;height:22px;margin:0;accent-color:var(--teal);cursor:pointer;touch-action:none}.minimap-compact-zoom span:last-child{color:var(--teal)}
.zone-badge { position:fixed; top:248px; right:24px; display:flex; align-items:center; gap:9px; max-width:220px; padding:9px 12px; border-radius:7px; opacity:0; transform:translateX(10px); transition:.3s; pointer-events:none; }.zone-badge.visible{opacity:1;transform:none}.zone-badge>span{color:var(--teal);font-size:14px}.zone-badge small,.zone-badge strong{display:block}.zone-badge small{color:var(--teal);font-size:7px;letter-spacing:.16em}.zone-badge strong{margin-top:2px;font:11px "Marcellus",serif;letter-spacing:.05em}
.shipyard-prompt{position:fixed;left:50%;top:94px;display:flex;align-items:center;gap:9px;padding:9px 14px;border-radius:7px;color:var(--ink);opacity:0;transform:translate(-50%,-8px);pointer-events:none;transition:.25s;cursor:pointer}.shipyard-prompt.visible{opacity:1;transform:translate(-50%,0);pointer-events:auto}.shipyard-prompt span{text-align:left}.shipyard-prompt small,.shipyard-prompt strong{display:block}.shipyard-prompt small{color:var(--teal);font-size:6px;letter-spacing:.14em}.shipyard-prompt strong{margin-top:2px;font-size:9px;letter-spacing:.1em}
.shipyard-overlay{position:fixed;inset:0;z-index:20;display:grid;place-items:center;padding:24px;background:rgba(1,9,16,.76);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .2s}.shipyard-overlay.open{opacity:1;pointer-events:auto}.shipyard-window{width:min(1050px,96vw);max-height:94vh;overflow:auto;border-radius:11px}.shipyard-head{display:flex;justify-content:space-between;align-items:flex-start;padding:22px 25px 17px;border-bottom:1px solid rgba(255,255,255,.09)}.shipyard-head h2{margin:5px 0 2px;font:26px "Marcellus",serif}.shipyard-head p{margin:0;color:var(--muted);font-size:10px}.shipyard-head>button{border:0;background:none;color:var(--muted);font-size:27px;cursor:pointer}.shipyard-body{display:grid;grid-template-columns:1.05fr 1.3fr .72fr;min-height:510px}.ship-preview-panel{display:flex;flex-direction:column;padding:18px;border-right:1px solid rgba(255,255,255,.08);background:radial-gradient(circle at center,rgba(47,139,137,.1),transparent 60%)}#shipPreview{width:100%;height:auto;min-height:300px}.ship-name{margin-top:auto}.ship-name span,.part-controls label>span{display:block;color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.12em}.ship-name input,.part-controls select{width:100%;margin-top:6px;padding:10px;border:1px solid rgba(255,255,255,.13);border-radius:5px;outline:none;color:var(--ink);background:#092536;font:12px "DM Sans",sans-serif}.ship-name input:focus,.part-controls select:focus{border-color:rgba(85,210,189,.55)}.part-controls{padding:18px 22px;border-right:1px solid rgba(255,255,255,.08);overflow:auto}.part-controls h3,.ship-stats h3{margin:2px 0 13px;color:var(--gold);font-size:8px;letter-spacing:.17em}.part-controls h3:not(:first-child){margin-top:21px}.part-controls label{display:grid;grid-template-columns:1fr 1.05fr;align-items:center;gap:13px;margin-bottom:9px}.part-controls label>span small{display:block;margin-top:2px;color:#718f8e;font-size:7px;font-weight:400;letter-spacing:0}.part-controls select{margin:0;padding:8px}.part-controls input[type=range]{width:100%;accent-color:var(--teal)}.toggle-control{position:relative}.toggle-control input{position:absolute;opacity:0}.toggle-control i{justify-self:end;width:34px;height:18px;padding:2px;border-radius:12px;background:#183746;transition:.2s}.toggle-control i::after{content:"";display:block;width:14px;height:14px;border-radius:50%;background:#8ba09e;transition:.2s}.toggle-control input:checked+i{background:#287f72}.toggle-control input:checked+i::after{transform:translateX(16px);background:#d8f4ec}.toggle-control.disabled{opacity:.4}.color-control input{justify-self:end;width:46px;height:27px;padding:2px;border:1px solid rgba(255,255,255,.15);border-radius:4px;background:#092536}.ship-stats{padding:19px}.ship-stats>div{display:flex;justify-content:space-between;align-items:center;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.07)}.ship-stats>div span{color:var(--muted);font-size:8px;letter-spacing:.08em}.ship-stats strong{font:14px "Marcellus",serif}.ship-stats strong b{font-weight:400}.ship-stats>p{margin-top:18px;color:#9eb8b4;font-size:9px;line-height:1.55}.shipyard-actions{display:flex;justify-content:flex-end;gap:9px;padding:14px 22px;border-top:1px solid rgba(255,255,255,.08)}.shipyard-actions button{padding:10px 16px;border:1px solid rgba(255,255,255,.14);border-radius:5px;color:var(--muted);background:rgba(255,255,255,.04);font-size:8px;font-weight:700;letter-spacing:.12em;cursor:pointer}.shipyard-actions .primary{border-color:#55d2bd;color:#05241e;background:#72d8c5}
kbd { display:inline-grid; place-items:center; min-width:21px; height:21px; padding:0 5px; color:#dcebe7; background:rgba(255,255,255,.07); border:1px solid rgba(255,255,255,.18); border-radius:4px; box-shadow:0 2px rgba(0,0,0,.25); font:9px "DM Sans",sans-serif; }
.interaction-input svg{display:none;width:26px;height:26px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}
.layout-phone .interaction-input{width:28px;min-width:28px;height:28px;padding:0;border:0;border-radius:0;color:var(--teal);background:transparent;box-shadow:none}.layout-phone .interaction-input>span{display:none}.layout-phone .interaction-input svg{display:block}
.controls-hint { position:fixed; bottom:27px; left:50%; display:flex; align-items:center; gap:5px; transform:translateX(-50%); padding:9px 12px; border-radius:7px; color:var(--muted); font-size:8px; letter-spacing:.12em; }.controls-hint b{width:1px;height:18px;margin:0 7px;background:rgba(255,255,255,.12)}
.touch-controls { display:none; position:fixed; bottom:max(22px,calc(env(safe-area-inset-bottom) + 12px)); left:50%; align-items:end; gap:10px; transform:translateX(-50%); }.touch-controls div{display:flex;flex-direction:column;gap:5px}.touch-controls button { width:58px; height:52px; border:1px solid rgba(255,255,255,.2); border-radius:9px; color:white; background:rgba(5,25,39,.72); backdrop-filter:blur(9px); font-size:20px; touch-action:none; }.touch-controls button:active,.touch-controls button.active{background:rgba(62,174,157,.45)}
.touch-zoom{display:none;position:fixed;left:max(16px,calc(env(safe-area-inset-left) + 8px));bottom:max(22px,calc(env(safe-area-inset-bottom) + 12px));width:44px;height:109px;padding:7px 6px;flex-direction:column;align-items:center;gap:3px;border-radius:9px;color:#dbeae6}.touch-zoom span{font-size:15px;line-height:15px}.touch-zoom input{flex:1;width:24px;min-height:0;margin:0;accent-color:var(--teal);touch-action:none;writing-mode:vertical-lr;direction:rtl}
.touch-row{display:none;position:fixed;right:max(16px,calc(env(safe-area-inset-right) + 8px));bottom:max(22px,calc(env(safe-area-inset-bottom) + 12px));width:52px;height:52px;border-radius:9px;color:var(--ink);font:700 9px "DM Sans",sans-serif;letter-spacing:.12em;touch-action:none}.touch-row.active{border-color:rgba(85,210,189,.7);color:#d9fff7;background:rgba(38,125,113,.72);box-shadow:0 0 18px rgba(85,210,189,.18)}.touch-row.unavailable{color:#6f8886;border-color:rgba(255,255,255,.1)}
.toast { position:fixed; top:148px; left:50%; padding:9px 16px; opacity:0; transform:translate(-50%,-8px); border-radius:20px; color:#06281f; background:#9de2d1; font-size:10px; font-weight:700; letter-spacing:.08em; transition:.3s; pointer-events:none; }.toast.show{opacity:1;transform:translate(-50%,0)}
#latencyText{color:#789795}#latencyText.degraded{color:#e39a75}
.ship-stats strong.better{color:#67d7c1}.ship-stats strong.worse{color:#e39a75}
.shipyard-actions>span{flex:1}.shipyard-actions .logout{border-color:rgba(226,119,105,.3);color:#c98d80}
.shipyard-wallet{display:flex;gap:18px;margin-left:auto;margin-right:16px}.shipyard-wallet span{min-width:52px;text-align:right}.shipyard-wallet small,.shipyard-wallet strong{display:block}.shipyard-wallet small{color:var(--muted);font-size:7px;letter-spacing:.12em}.shipyard-wallet strong{margin-top:3px;color:var(--gold);font:16px "Marcellus",serif}.shipyard-landing{padding:26px}.shipyard-choice-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.shipyard-choice-grid>button{min-height:210px;padding:28px 22px;border:1px solid rgba(85,210,189,.18);border-radius:10px;color:var(--ink);background:linear-gradient(145deg,rgba(14,55,70,.9),rgba(5,26,39,.9));cursor:pointer;transition:.2s}.shipyard-choice-grid>button:hover{border-color:rgba(85,210,189,.58);transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.25)}.shipyard-choice-grid b,.shipyard-choice-grid strong,.shipyard-choice-grid small{display:block}.shipyard-choice-grid b{margin-bottom:18px;color:var(--teal);font-size:30px}.shipyard-choice-grid strong{color:var(--gold);font:18px "Marcellus",serif;letter-spacing:.08em}.shipyard-choice-grid small{margin-top:9px;color:var(--muted);font-size:10px;line-height:1.5}.dock-storage-card{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:24px;margin-top:18px;padding:18px 20px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(4,29,43,.75)}.dock-storage-card h3{margin:4px 0;font:17px "Marcellus",serif}.dock-storage-card p{margin:0;color:var(--muted);font-size:9px}.dock-storage-items{display:flex;gap:18px}.dock-storage-items span{color:var(--muted);font-size:8px;letter-spacing:.09em}.dock-storage-items b{margin-left:5px;color:var(--ink);font-size:12px}.dock-storage-card>button{padding:10px 14px;border:1px solid var(--gold);border-radius:5px;color:#211708;background:var(--gold);font-size:8px;font-weight:800;cursor:pointer}.dock-storage-card.paid>button{display:none}.dock-storage-card.locked{border-color:rgba(226,119,105,.4)}.shipyard-owned-view{display:grid;grid-template-columns:1.05fr .95fr;min-height:520px}.owned-fleet-list{padding:18px;overflow:auto;border-right:1px solid rgba(255,255,255,.08)}.fleet-card{display:grid;grid-template-columns:106px 1fr auto;align-items:center;gap:15px;margin-bottom:10px;padding:10px;border:1px solid rgba(255,255,255,.09);border-radius:8px;background:rgba(8,37,52,.75);cursor:pointer}.fleet-card.selected{border-color:rgba(85,210,189,.55)}.fleet-card canvas{width:106px;height:82px;border-radius:6px;background:#082b3a}.fleet-card h3{margin:0 0 4px;font:16px "Marcellus",serif}.fleet-card p{margin:0;color:var(--muted);font-size:8px;line-height:1.55}.fleet-card em{align-self:start;padding:4px 6px;border-radius:4px;color:var(--teal);background:rgba(85,210,189,.1);font-size:7px;font-style:normal;letter-spacing:.1em}.owned-ship-detail{padding:22px;overflow:auto}.owned-detail-preview{display:block;width:100%;max-height:260px;border-radius:7px;background:#082b3a}.owned-detail-head{display:flex;justify-content:space-between;align-items:end;margin:15px 0}.owned-detail-head h3{margin:0;font:23px "Marcellus",serif}.owned-detail-head span{color:var(--gold);font-size:9px;letter-spacing:.1em}.owned-detail-stats{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.08)}.owned-detail-stats span{display:flex;justify-content:space-between;padding:10px;background:#092536;color:var(--muted);font-size:8px}.owned-detail-stats b{color:var(--ink);font:13px "Marcellus",serif}.owned-detail-actions{display:flex;gap:8px;margin-top:16px}.owned-detail-actions button{flex:1;padding:10px;border:1px solid rgba(85,210,189,.28);border-radius:5px;color:var(--ink);background:rgba(85,210,189,.08);font-size:8px;font-weight:800;cursor:pointer}.owned-detail-actions .primary{color:#05241e;background:var(--teal)}.shipyard-configurator[hidden],.shipyard-owned-view[hidden],.shipyard-landing[hidden],.shipyard-market-view[hidden]{display:none}.ship-build-quote{padding:12px 22px;border-top:1px solid rgba(255,255,255,.08);color:var(--muted);font-size:10px}.shipyard-market-view{min-height:520px;padding:20px}
.layout-phone .shipyard-wallet{display:none}.layout-phone .shipyard-choice-grid{grid-template-columns:1fr}.layout-phone .shipyard-choice-grid>button{min-height:125px}.layout-phone .dock-storage-card{grid-template-columns:1fr}.layout-phone .dock-storage-items{flex-wrap:wrap}.layout-phone .shipyard-owned-view{grid-template-columns:1fr}.layout-phone .owned-fleet-list{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
.ship-build-quote strong{color:var(--teal)}.ship-build-quote.insufficient{color:#d88f80}.ship-build-quote.insufficient strong{color:#e27769}.shipyard-actions button:disabled{opacity:.35;cursor:not-allowed}
.ship-market-toolbar{display:flex;justify-content:space-between;gap:18px;margin-bottom:15px;color:var(--gold);font-size:9px;letter-spacing:.1em}.ship-market-toolbar small{color:var(--muted);font-size:8px}.ship-market-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;max-height:475px;overflow:auto}.ship-market-card{overflow:hidden;border:1px solid rgba(255,255,255,.09);border-radius:8px;background:rgba(7,34,49,.82)}.ship-market-card canvas{display:block;width:100%;height:auto;aspect-ratio:16/9}.ship-market-card>div{padding:12px}.ship-market-card span{color:var(--teal);font-size:7px;letter-spacing:.11em}.ship-market-card h3{margin:5px 0;font:17px "Marcellus",serif}.ship-market-card p{margin:0;color:var(--muted);font-size:8px;line-height:1.5}.ship-market-card footer{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:10px 12px;border-top:1px solid rgba(255,255,255,.07)}.ship-market-card footer strong{color:var(--gold);font:15px "Marcellus",serif}.ship-market-card button{padding:8px;border:1px solid rgba(85,210,189,.32);border-radius:4px;color:#05241e;background:var(--teal);font-size:7px;font-weight:800;cursor:pointer}.layout-phone .ship-market-grid{grid-template-columns:1fr}.layout-phone .ship-market-toolbar{display:block}.layout-phone .ship-market-toolbar small{display:block;margin-top:5px}
.gold-balance{color:var(--gold);font-size:8px;font-weight:700;letter-spacing:.12em}.gold-balance strong{margin-left:5px;font:14px "Marcellus",serif;letter-spacing:0}
.cargo-balance{color:var(--muted);font-size:8px;font-weight:700;letter-spacing:.12em}.cargo-balance strong{margin-left:5px;color:var(--ink);font:12px "Marcellus",serif;letter-spacing:0;white-space:nowrap}
.vessel-overlay{position:fixed;inset:0;z-index:21;display:grid;place-items:center;padding:24px;background:rgba(1,9,16,.74);backdrop-filter:blur(8px);opacity:0;pointer-events:none;transition:opacity .2s}.vessel-overlay.open{opacity:1;pointer-events:auto}.vessel-window{width:min(860px,96vw);max-height:94vh;overflow:auto;border-radius:11px}.vessel-head{display:flex;align-items:center;gap:22px;padding:20px 24px 16px;border-bottom:1px solid rgba(255,255,255,.09)}.vessel-head>div:first-child{flex:1}.vessel-head h2{margin:0;font:24px "Marcellus",serif}.vessel-head>button{border:0;background:none;color:var(--muted);font-size:27px;cursor:pointer}.vessel-wallet{text-align:right}.vessel-wallet small{display:block;color:var(--muted);font-size:7px;letter-spacing:.13em}.vessel-wallet strong{display:block;margin-top:3px;color:var(--gold);font:22px "Marcellus",serif}.vessel-body{display:grid;grid-template-columns:.9fr 1.1fr;min-height:430px}.vessel-summary{padding:17px;border-right:1px solid rgba(255,255,255,.08);background:radial-gradient(circle at center,rgba(47,139,137,.1),transparent 64%)}#vesselPreview{display:block;width:100%;height:auto;max-height:260px}.vessel-stat-grid{display:grid;grid-template-columns:1fr 1fr;gap:1px;background:rgba(255,255,255,.07)}.vessel-stat-grid span{display:flex;justify-content:space-between;padding:10px;background:#092536;color:var(--muted);font-size:7px;letter-spacing:.08em}.vessel-stat-grid span:last-child{grid-column:1/-1}.vessel-stat-grid strong{color:var(--ink);font:11px "Marcellus",serif;letter-spacing:0}.cargo-manifest{padding:24px}.cargo-title{display:flex;align-items:flex-end;justify-content:space-between}.cargo-title h3{margin:0;font:22px "Marcellus",serif}.cargo-title>strong{color:var(--muted);font-size:10px}.cargo-title>strong b{color:var(--ink);font:16px "Marcellus",serif}.cargo-meter{height:7px;margin:14px 0 20px;overflow:hidden;border-radius:5px;background:rgba(255,255,255,.08)}.cargo-meter i{display:block;width:0;height:100%;background:#50c878;transition:width .2s,background-color .2s}.cargo-row{display:grid;grid-template-columns:38px 1fr 42px 62px;align-items:center;gap:11px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.07)}.cargo-icon{display:grid;place-items:center;width:34px;height:34px;border-radius:7px;font:700 12px "DM Sans",sans-serif}.cargo-icon.wood{color:#e0bd78;background:#5c442a}.cargo-icon.iron{color:#c6d2d0;background:#4c5c5e}.cargo-icon.ammo{color:#c9d3d2;background:#26383f}.cargo-row div strong,.cargo-row div small{display:block}.cargo-row div strong{font-size:10px}.cargo-row div small{margin-top:3px;color:var(--muted);font-size:7px}.cargo-row>b{font:18px "Marcellus",serif;text-align:right}.cargo-row>em{color:var(--muted);font-size:8px;font-style:normal;text-align:right}.vessel-actions{display:flex;gap:9px;padding:13px 22px;border-top:1px solid rgba(255,255,255,.08)}.vessel-actions span{flex:1}.vessel-actions button{padding:10px 15px;border:1px solid rgba(255,255,255,.14);border-radius:5px;color:var(--muted);background:rgba(255,255,255,.04);font-size:8px;font-weight:700;letter-spacing:.1em;cursor:pointer}.vessel-actions .primary{border-color:var(--teal);color:#05241e;background:#72d8c5}.vessel-actions button:disabled{display:none}
.gather-prompt{position:fixed;left:50%;bottom:88px;z-index:8;display:flex;align-items:center;gap:10px;min-width:250px;padding:10px 15px;overflow:hidden;color:var(--ink);opacity:0;transform:translate(-50%,10px);pointer-events:none;transition:.2s}.gather-prompt.visible{opacity:1;transform:translate(-50%,0);pointer-events:auto}.gather-prompt span{flex:1;text-align:left}.gather-prompt small,.gather-prompt strong{display:block}.gather-prompt small{color:var(--gold);font-size:6px;letter-spacing:.14em}.gather-prompt strong{margin-top:3px;font-size:8px;letter-spacing:.08em}.gather-prompt>i{position:absolute;left:0;bottom:0;width:0;height:3px;background:var(--teal)}.touch-vessel{position:fixed;right:15px;bottom:calc(88px + env(safe-area-inset-bottom));z-index:9;display:none;padding:10px;border:0;color:var(--gold);font-size:8px;font-weight:700;letter-spacing:.1em}
.input-touch .controls-hint{display:none}.input-touch .touch-controls,.input-touch .touch-zoom{display:flex}.input-touch .touch-row,.input-touch .touch-vessel{display:block}.input-touch #game{cursor:default}
.layout-tablet .mission{display:none}.layout-tablet .chart{--chart-bottom:max(96px,calc(env(safe-area-inset-bottom) + 86px));bottom:var(--chart-bottom)}
.layout-phone .status{display:none}.layout-phone .topbar{height:62px;padding:0 15px}.layout-phone .brand strong{font-size:16px}.layout-phone .instrument-panel{top:70px;left:10px;width:190px;padding:12px}.layout-phone .compass{flex-basis:82px;height:82px}.layout-phone .compass::before{height:62px}.layout-phone .compass::after{width:62px}.layout-phone .wind-readout strong{font-size:16px}.layout-phone .divider{margin:10px 0}.layout-phone .telemetry{top:auto;right:50%;bottom:calc(145px + env(safe-area-inset-bottom));display:flex;grid-template-columns:none;padding:10px 4px;transform:translateX(50%)}.layout-phone .telemetry>div{width:64px;min-height:0;padding:0 7px;border-right:1px solid rgba(255,255,255,.08);border-bottom:0}.layout-phone .telemetry>div:nth-child(2n){border-right:1px solid rgba(255,255,255,.08)}.layout-phone .telemetry>div:last-child{border-right:0}.layout-phone .telemetry strong{font-size:18px}.layout-phone .mission{display:none}.layout-phone .chart{--chart-right:10px;--chart-top:70px;--chart-map-size:130px;right:var(--chart-right);top:var(--chart-top);bottom:auto;width:150px;height:calc(var(--chart-map-size) + 51px + var(--chart-slider-space));padding:9px;transform-origin:right top}.layout-phone .zone-badge{display:none}.layout-phone .shipyard-prompt{top:auto;bottom:calc(236px + env(safe-area-inset-bottom));transform:translate(-50%,8px)}.layout-phone .shipyard-prompt.visible{transform:translate(-50%,0)}.layout-phone .toast{top:64px}.layout-phone .shipyard-overlay{padding:8px}.layout-phone .shipyard-body{grid-template-columns:1fr}.layout-phone .ship-preview-panel{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}.layout-phone #shipPreview{width:auto;max-width:100%;max-height:320px;align-self:center}.layout-phone .part-controls{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}
.layout-phone .vessel-overlay{padding:8px}.layout-phone .vessel-body{grid-template-columns:1fr}.layout-phone .vessel-summary{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}.layout-phone #vesselPreview{max-height:180px}.layout-phone .touch-vessel{display:block}.layout-phone .gather-prompt{bottom:calc(154px + env(safe-area-inset-bottom));min-width:220px}.layout-phone .vessel-head{padding:15px}.layout-phone .vessel-wallet{display:none}.layout-phone .cargo-manifest{padding:18px}
.layout-phone .telemetry>.reload-telemetry{width:116px}.layout-phone .reload-telemetry>span{grid-template-columns:24px 1fr 27px;gap:3px}.layout-phone .reload-telemetry>span>strong{font-size:5px}
.layout-phone .broadside-remaining-label{display:none}
@media(max-width:340px){.layout-phone .touch-zoom{left:8px}.layout-phone .touch-row{right:8px}.layout-phone .touch-controls{gap:7px}.layout-phone .touch-controls button{width:56px}}
@media(max-height:500px){.layout-phone .topbar{height:48px}.layout-phone .brand-mark{width:32px;height:32px}.layout-phone .brand strong{font-size:14px}.layout-phone .brand small{font-size:7px}.layout-phone .instrument-panel{top:52px;width:174px;padding:9px}.layout-phone .compass-wrap{margin-top:8px}.layout-phone .compass{flex-basis:70px;height:70px}.layout-phone .compass::before{height:50px}.layout-phone .compass::after{width:50px}.layout-phone .divider{margin:6px 0}.layout-phone .efficiency-row{margin-top:8px}.layout-phone .weather-status{display:none}.layout-phone .chart{--chart-top:52px;--chart-map-size:116px;top:var(--chart-top);width:132px;height:calc(var(--chart-map-size) + 47px + var(--chart-slider-space));padding:7px}.layout-phone .telemetry{bottom:calc(128px + env(safe-area-inset-bottom));padding:7px 3px}.layout-phone .shipyard-prompt{bottom:calc(205px + env(safe-area-inset-bottom))}.layout-phone .toast{top:50px}}
.layout-phone .brand>div{display:none}.layout-phone .header-weather{right:15px;left:auto;display:flex;transform:none}
@media(max-width:340px){.layout-phone .weather-status{gap:6px}.layout-phone .weather-current,.layout-phone .weather-forecast{gap:5px}.layout-phone .weather-current>span,.layout-phone .weather-forecast>span{width:26px;height:26px;font-size:15px}.layout-phone .weather-status strong{font-size:10px}.layout-phone .weather-forecast.visible{max-width:92px}.layout-phone .weather-arrow.visible{max-width:14px;font-size:14px}}
.market-overlay{position:fixed;inset:0;z-index:22;display:grid;place-items:center;padding:22px;background:rgba(1,9,16,.78);backdrop-filter:blur(9px);opacity:0;pointer-events:none;transition:opacity .2s}.market-overlay.open{opacity:1;pointer-events:auto}.market-window{width:min(1120px,97vw);max-height:95vh;overflow:auto;border-radius:11px}.market-head{display:flex;align-items:center;gap:22px;padding:19px 24px 15px;border-bottom:1px solid rgba(255,255,255,.09)}.market-head>div:first-child{flex:1}.market-head h2{margin:4px 0 2px;font:25px "Marcellus",serif}.market-head p{margin:0;color:var(--muted);font-size:8px}.market-head>button{border:0;background:none;color:var(--muted);font-size:27px;cursor:pointer}.market-wallet{text-align:right}.market-wallet small{display:block;color:var(--muted);font-size:7px;letter-spacing:.13em}.market-wallet strong{color:var(--gold);font:22px "Marcellus",serif}.market-body{display:grid;grid-template-columns:1.15fr .85fr 1fr;min-height:470px}.market-body>section{padding:21px;border-right:1px solid rgba(255,255,255,.08)}.market-body>section:last-child{border-right:0}.market-section-title h3{margin:4px 0 15px;font:20px "Marcellus",serif}.market-row{display:grid;grid-template-columns:35px 1fr 62px 54px 54px;align-items:center;gap:8px;padding:12px 0;border-bottom:1px solid rgba(255,255,255,.07)}.market-row div strong,.market-row div small{display:block}.market-row div strong{font-size:9px}.market-row div small{margin-top:3px;color:var(--muted);font-size:7px}.market-row>em{color:var(--muted);font-size:6px;font-style:normal;line-height:1.6}.market-row>em b{color:var(--gold);font-size:8px}.market-row button,.service-card button,.contract-card button,.market-actions button{padding:8px 6px;border:1px solid rgba(85,210,189,.25);border-radius:4px;color:#bfe2dc;background:rgba(85,210,189,.07);font-size:6px;font-weight:700;letter-spacing:.07em;cursor:pointer}.market-row button:disabled,.service-card button:disabled,.contract-card button:disabled{opacity:.3;cursor:default}.service-card{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.07)}.service-card>div{flex:1;min-width:130px}.service-card strong,.service-card small{display:block}.service-card strong{font-size:9px}.service-card small{margin-top:4px;color:var(--muted);font-size:7px}.service-card>b{color:var(--gold);font-size:8px}.active-contract{margin-bottom:10px}.contract-card{padding:12px;margin-bottom:8px;border:1px solid rgba(255,255,255,.08);border-radius:6px;background:rgba(255,255,255,.025)}.contract-card.active{border-color:rgba(233,184,90,.35);background:rgba(233,184,90,.05)}.contract-card strong,.contract-card small{display:block}.contract-card strong{font:13px "Marcellus",serif}.contract-card small{margin:5px 0 9px;color:var(--muted);font-size:7px;line-height:1.5}.contract-card b{color:var(--gold)}.contract-card button{width:100%}.market-actions{display:flex;align-items:center;justify-content:space-between;padding:13px 22px;border-top:1px solid rgba(255,255,255,.08);color:var(--muted);font-size:8px;letter-spacing:.08em}.market-actions .primary{padding:10px 15px;border-color:var(--teal);color:#05241e;background:#72d8c5}.layout-phone .market-overlay{padding:7px}.layout-phone .market-body{grid-template-columns:1fr}.layout-phone .market-body>section{border-right:0;border-bottom:1px solid rgba(255,255,255,.08)}.layout-phone .market-head{padding:14px}.layout-phone .market-head p,.layout-phone .market-wallet{display:none}.layout-phone .market-row{grid-template-columns:32px 1fr 52px 47px 47px;padding:10px 0}.layout-phone .market-body>section{padding:16px}
.trade-mission-hud{position:fixed;top:86px;left:50%;z-index:7;min-width:240px;padding:9px 14px;text-align:center;opacity:0;transform:translate(-50%,-7px);pointer-events:none;transition:.2s}.trade-mission-hud.visible{opacity:1;transform:translate(-50%,0)}.trade-mission-hud span,.trade-mission-hud strong,.trade-mission-hud small{display:block}.trade-mission-hud span{color:var(--gold);font-size:6px;letter-spacing:.15em}.trade-mission-hud strong{margin-top:3px;font:12px "Marcellus",serif}.trade-mission-hud small{margin-top:3px;color:var(--muted);font-size:7px}.layout-phone .trade-mission-hud{top:auto;bottom:calc(218px + env(safe-area-inset-bottom));min-width:200px}

/* Readability pass: navigation, header, and telemetry deliberately retain their compact sizing. */
.mission-head{font-size:11px}.mission h2{font-size:22px}.mission p{font-size:14px}.mission small{font-size:10px}
.chart-head,.chart-head strong{font-size:9px}
.zone-badge small{font-size:9px}.zone-badge strong{font-size:14px}
.shipyard-prompt small{font-size:8px}.shipyard-prompt strong{font-size:11px}
kbd{font-size:11px}.controls-hint{font-size:10px}.touch-row,.touch-vessel{font-size:11px}
.toast{font-size:12px}
.shipyard-window .eyebrow,.vessel-window .eyebrow,.market-window .eyebrow{font-size:11px}
.shipyard-head h2{font-size:30px}.shipyard-head p{font-size:12px}.ship-name span,.part-controls label>span{font-size:10px}.part-controls label>span small{font-size:9px}.ship-name input,.part-controls select{font-size:14px}.part-controls h3,.ship-stats h3{font-size:10px}.ship-stats>div span{font-size:10px}.ship-stats strong{font-size:16px}.ship-stats>p{font-size:11px}.shipyard-actions button{font-size:10px}
.vessel-head h2{font-size:28px}.vessel-head p{font-size:11px}.vessel-wallet small{font-size:9px}.vessel-wallet strong{font-size:24px}.vessel-stat-grid span{font-size:9px}.vessel-stat-grid strong{font-size:13px}.cargo-title h3{font-size:25px}.cargo-title>strong{font-size:12px}.cargo-row div strong{font-size:12px}.cargo-row div small{font-size:9px}.cargo-row>em{font-size:10px}.cargo-manifest>p{font-size:10px}.vessel-actions button{font-size:10px}
.gather-prompt small{font-size:8px}.gather-prompt strong{font-size:11px}
.market-head h2{font-size:29px}.market-head p{font-size:10px}.market-wallet small{font-size:9px}.market-wallet strong{font-size:24px}.market-section-title h3{font-size:23px}.market-row div strong{font-size:11px}.market-row div small{font-size:9px;line-height:1.5}.market-row>em{font-size:8px}.market-row>em b{font-size:10px}.market-row button,.service-card button,.contract-card button,.market-actions button{font-size:8px}.service-card strong{font-size:11px}.service-card small{font-size:9px}.service-card>b{font-size:10px}.contract-card strong{font-size:15px}.contract-card small{font-size:9px}.market-actions{font-size:10px}
.trade-mission-hud span{font-size:8px}.trade-mission-hud strong{font-size:14px}.trade-mission-hud small{font-size:9px}

/* The expanded chart becomes a large navigational view without changing the sailing camera. */
.chart.expanded{--chart-slider-space:0px;--chart-map-size:min(760px,calc(100vw - var(--chart-right) - 42px),calc(100vh - var(--chart-bottom) - 73px));left:auto;top:auto;right:var(--chart-right);bottom:var(--chart-bottom);width:calc(var(--chart-map-size) + 26px);height:calc(var(--chart-map-size) + 57px);padding:12px;transform:none;box-shadow:0 24px 80px rgba(0,8,17,.58),inset 0 1px rgba(255,255,255,.04)}
.chart.expanded .chart-zoom{display:flex}.chart.expanded .chart-expand-icon{display:none}.chart.expanded .chart-collapse-icon{display:inline}.chart.expanded #minimap{cursor:grab}.chart.expanded.dragging #minimap{cursor:grabbing}
.layout-phone .chart.expanded{--chart-map-size:min(calc(100vw - var(--chart-right) - 30px),calc(100vh - var(--chart-top) - 61px));left:auto;top:var(--chart-top);right:var(--chart-right);bottom:auto;width:calc(var(--chart-map-size) + 22px);height:calc(var(--chart-map-size) + 53px);padding:10px;transform:none}
.input-touch .chart:not(.expanded){--chart-slider-space:35px}.input-touch .chart:not(.expanded) .minimap-compact-zoom{display:flex}
.minimap-expanded .controls-hint,.minimap-expanded .touch-controls,.minimap-expanded .touch-zoom{visibility:hidden!important;opacity:0!important;pointer-events:none!important}

/* Keep every touch sailing action in one reachable bottom control cluster. */
.touch-controls>.touch-row,.touch-controls>.touch-vessel{position:static;inset:auto;display:block;height:52px;padding:0 8px;font:700 9px "DM Sans",sans-serif;letter-spacing:.08em;touch-action:none}
.touch-controls>.touch-row{width:72px;color:var(--ink)}
.touch-controls>.touch-vessel{z-index:auto;width:88px;color:var(--gold)}
.input-touch .gather-prompt{bottom:calc(154px + env(safe-area-inset-bottom))}
@media(max-width:430px){
  .layout-phone .touch-controls{gap:5px}
  .layout-phone .touch-controls button{width:50px}
  .layout-phone .touch-controls>.touch-row{width:62px;font-size:9px}
  .layout-phone .touch-controls>.touch-vessel{width:78px;font-size:8px;letter-spacing:.04em}
  .layout-phone .touch-zoom{bottom:calc(145px + env(safe-area-inset-bottom))}
}

/* Marketplace quantity matrix: unit prices sit above 1/10/100 transaction buttons. */
.market-trade-head,.market-row{grid-template-columns:35px minmax(92px,1fr) minmax(112px,.9fr) minmax(112px,.9fr)}
.market-trade-head{display:grid;align-items:end;gap:8px;padding:0 0 6px;border-bottom:1px solid rgba(255,255,255,.12)}
.market-trade-head>strong{font-size:10px;letter-spacing:.14em;text-align:center}
.market-trade-head>.market-buy{grid-column:3;color:#69d6a0}
.market-trade-head>.market-sell{grid-column:4;color:#e67d78}
.market-row{gap:8px;padding:13px 0}
.market-trade-cell{text-align:center}
.market-trade-cell>em{display:block;margin-bottom:6px;color:var(--muted);font-size:8px;font-style:normal}
.market-trade-cell>em b{font-size:11px}
.market-trade-cell>div{display:grid;grid-template-columns:repeat(3,1fr);gap:4px}
.market-trade-cell button{min-width:0;padding:7px 2px;font-size:8px}
.market-trade-cell.market-buy>em b{color:#69d6a0}
.market-trade-cell.market-buy button{border-color:rgba(68,203,135,.48);color:#9aefbd;background:rgba(50,180,112,.13)}
.market-trade-cell.market-buy button:active{background:rgba(50,180,112,.3)}
.market-trade-cell.market-sell>em b{color:#e67d78}
.market-trade-cell.market-sell button{border-color:rgba(224,91,84,.48);color:#f0aaa5;background:rgba(190,62,58,.13)}
.market-trade-cell.market-sell button:active{background:rgba(190,62,58,.3)}
@media(max-width:560px){
  .layout-phone .market-trade-head{grid-template-columns:1fr 1fr;gap:8px;padding-top:2px}
  .layout-phone .market-trade-head>.market-buy{grid-column:1}
  .layout-phone .market-trade-head>.market-sell{grid-column:2}
  .layout-phone .market-row{grid-template-columns:32px 1fr;gap:8px}
  .layout-phone .market-row>.market-trade-cell{margin-top:4px}
  .layout-phone .market-row>.market-buy{grid-column:1}
  .layout-phone .market-row>.market-sell{grid-column:2}
}

/* Inventory overview and categorized full-statistics view. */
.vessel-stat-grid span:last-child{grid-column:auto}
.crew-stat{position:relative;cursor:help;outline:none}.crew-tooltip{position:absolute;right:0;bottom:calc(100% + 9px);z-index:8;width:max-content;min-width:205px;padding:10px 12px;border:1px solid rgba(85,210,189,.28);border-radius:6px;color:#edf6f4;background:rgba(4,24,35,.97);box-shadow:0 10px 28px rgba(0,0,0,.36);font:700 9px/1.7 "DM Sans",sans-serif;font-style:normal;letter-spacing:.01em;opacity:0;transform:translateY(5px);pointer-events:none;transition:opacity .15s,transform .15s}.crew-tooltip em{display:block;color:#edf6f4;font-style:normal;white-space:nowrap}.crew-tooltip b{color:#65ddc4}.crew-stat:hover .crew-tooltip,.crew-stat:focus-visible .crew-tooltip,.crew-stat:focus .crew-tooltip{opacity:1;transform:translateY(0)}
.cargo-row{grid-template-columns:38px 1fr 42px}
.full-stats-button{width:100%;margin-top:12px;padding:10px;border:1px solid rgba(85,210,189,.35);border-radius:5px;color:#bfe9e1;background:rgba(85,210,189,.08);font-size:9px;font-weight:700;letter-spacing:.1em;cursor:pointer}
.full-stats-button:hover{border-color:rgba(85,210,189,.65);background:rgba(85,210,189,.14)}
.vessel-stats-view{display:none;padding:22px 24px 26px;background:linear-gradient(180deg,rgba(12,45,58,.28),rgba(3,18,29,.08))}
.vessel-overlay.stats-open .vessel-body{display:none}
.vessel-overlay.stats-open .vessel-stats-view{display:block}
.full-stats-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin-bottom:18px}
.full-stats-head h3{margin:5px 0 0;font:25px "Marcellus",serif}
.full-stats-head>small{max-width:310px;color:var(--muted);font-size:9px;line-height:1.5;text-align:right}
.full-stats-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}
.full-stat-card{overflow:hidden;border:1px solid rgba(255,255,255,.09);border-top:2px solid var(--card-accent,#55d2bd);border-radius:8px;background:linear-gradient(145deg,rgba(10,42,55,.82),rgba(5,25,38,.78));box-shadow:0 10px 24px rgba(0,8,16,.14)}
.full-stat-card.performance{--card-accent:#55d2bd}.full-stat-card.combat{--card-accent:#e5786c}.full-stat-card.navigation{--card-accent:#6ab6dc}.full-stat-card.operations{--card-accent:#e9b85a}.full-stat-card.cargo{--card-accent:#8fcf78}
.full-stat-card>header{display:flex;align-items:center;gap:9px;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.07);background:rgba(255,255,255,.018)}
.full-stat-card>header>i{display:grid;place-items:center;width:25px;height:25px;border-radius:6px;color:var(--card-accent);background:color-mix(in srgb,var(--card-accent) 13%,transparent);font-size:13px;font-style:normal}
.full-stat-card h4{margin:0;color:var(--card-accent);font-size:10px;letter-spacing:.13em;text-transform:uppercase}
.full-stat-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;background:rgba(255,255,255,.055)}
.full-stat{min-width:0;padding:10px 12px;background:#092536}
.full-stat>span,.full-stat>strong,.full-stat>small{display:block}
.full-stat>span{color:var(--muted);font-size:8px;letter-spacing:.06em}
.full-stat>strong{margin-top:4px;color:var(--ink);font:14px "Marcellus",serif;overflow-wrap:anywhere}
.full-stat>small{margin-top:3px;color:#759390;font-size:7px;line-height:1.3}
.vessel-stats-action{display:none}
.vessel-overlay.stats-open .vessel-overview-action,.vessel-overlay.stats-open .vessel-actions>span{display:none}
.vessel-overlay.stats-open .vessel-stats-action{display:block;margin-left:auto}
@media(max-width:650px){
  .full-stats-head{display:block}.full-stats-head>small{display:block;margin-top:7px;text-align:left}
  .full-stats-grid{grid-template-columns:1fr}
  .vessel-stats-view{padding:18px 15px 22px}
}
@media(max-width:380px){.full-stat-list{grid-template-columns:1fr}}

/* Fixed vessel panel with a compact, internally scrollable statistics surface. */
.vessel-window{display:flex;flex-direction:column;height:auto;max-height:94vh;overflow:hidden}
.vessel-overlay.stats-open .vessel-window{height:auto}
.vessel-head,.vessel-actions{flex:0 0 auto}
.vessel-body,.vessel-stats-view{min-height:0;scrollbar-width:none;-ms-overflow-style:none}
.vessel-body::-webkit-scrollbar,.vessel-stats-view::-webkit-scrollbar{display:none}
.vessel-body{flex:0 1 auto;overflow-y:auto}
.vessel-stats-view{flex:1;overflow-y:auto;overscroll-behavior:contain;padding:18px 22px 22px}
.vessel-overlay.stats-open .vessel-stats-view{flex:0 1 auto}
.full-stats-head{margin-bottom:12px}
.full-stats-grid{align-items:start;gap:10px}
.full-stats-column{display:flex;min-width:0;flex-direction:column;gap:10px}
.full-stat-card{border-top:1px solid rgba(255,255,255,.09)}
.full-stat-card>header{padding:9px 12px}
.full-stat-card h4{color:#bfd0cd}
.full-stat-card>header>i{color:var(--card-accent);background:color-mix(in srgb,var(--card-accent) 15%,rgba(255,255,255,.025))}
.full-stat{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:baseline;column-gap:10px;padding:8px 10px}
.full-stat>span,.full-stat>strong{margin:0}
.full-stat>span{font-size:8px}
.full-stat>strong{font-size:12px;text-align:right}
.full-stat>small{grid-column:1/-1;margin-top:2px;text-align:right}
@media(max-width:650px){
  .vessel-overlay.stats-open .vessel-window{height:auto}
  .vessel-stats-view{padding:15px 12px 18px}
}
.dock-storage-items>span{display:grid;grid-template-columns:auto auto;align-items:center;gap:4px}.dock-storage-items i{grid-column:1/-1;display:flex;gap:4px;font-style:normal}.dock-storage-items button{padding:4px 5px;border:1px solid rgba(85,210,189,.22);border-radius:3px;color:var(--muted);background:rgba(85,210,189,.06);font-size:6px;font-weight:700;cursor:pointer}.dock-storage-card.locked .dock-storage-items button{opacity:.35;pointer-events:none}

/* Ship-market scrolling stays available without a visible browser scrollbar. */
.ship-market-grid,.shipyard-market-view{scrollbar-width:none;-ms-overflow-style:none}
.ship-market-grid::-webkit-scrollbar,.shipyard-market-view::-webkit-scrollbar{display:none}
.ship-market-card footer>div{display:flex;gap:6px}.ship-market-card button.inspect{color:var(--teal);background:rgba(85,210,189,.08)}
.ship-market-inspection>button{margin-bottom:12px;padding:8px 11px;border:1px solid rgba(85,210,189,.3);border-radius:5px;color:var(--teal);background:rgba(85,210,189,.07);font-size:8px;font-weight:800;cursor:pointer}
.ship-market-inspection>header{display:grid;grid-template-columns:minmax(260px,.8fr) 1fr;align-items:center;gap:22px;margin-bottom:14px;padding:14px;border:1px solid rgba(255,255,255,.08);border-radius:8px;background:rgba(7,34,49,.82)}
.ship-market-inspection>header canvas{width:100%;height:auto;aspect-ratio:12/7;border-radius:7px;background:#082b3a}.ship-market-inspection>header span{color:var(--teal);font-size:8px;letter-spacing:.11em}.ship-market-inspection>header h3{margin:6px 0;font:25px "Marcellus",serif}.ship-market-inspection>header p{color:var(--muted);font-size:10px}
.owned-detail-actions .currently-active,.owned-detail-actions .currently-active:disabled{border-color:#60d39a;color:#042a18;background:#60d39a;opacity:1;cursor:default}
@media(max-width:650px){.ship-market-inspection>header{grid-template-columns:1fr}.ship-market-card footer{align-items:flex-start;flex-direction:column}.ship-market-card footer>div{width:100%}.ship-market-card footer>div button{flex:1}}

/* Illustrated Harbour Services cards. */
.shipyard-choice-grid>button{position:relative;isolation:isolate;overflow:hidden;background:#082b3a;box-shadow:inset 0 0 0 1px rgba(85,210,189,.04)}
.shipyard-choice-grid>button::before,.shipyard-choice-grid>button::after{content:"";position:absolute;inset:0;z-index:-2;pointer-events:none}
.shipyard-choice-grid>button::before{background-position:center;background-size:cover;filter:saturate(.94) brightness(.88);transform:scale(1.01);transition:filter .25s,transform .35s}
.shipyard-choice-grid>button::after{z-index:-1;background:linear-gradient(180deg,rgba(3,20,31,.2),rgba(3,20,31,.62) 48%,rgba(3,20,31,.82)),radial-gradient(circle at center,rgba(4,28,41,.28),rgba(4,21,32,.03) 68%)}
.shipyard-choice-grid>button[data-shipyard-view="owned"]::before{background-image:url("assets/ui/harbour-owned-ships.webp")}
.shipyard-choice-grid>button[data-shipyard-view="build"]::before{background-image:url("assets/ui/harbour-build-ship.webp")}
.shipyard-choice-grid>button[data-shipyard-view="ship-market"]::before{background-image:url("assets/ui/harbour-ship-market.webp")}
.shipyard-choice-grid>button[data-shipyard-view="owned"]::after{background:linear-gradient(180deg,rgba(1,31,38,.18),rgba(2,37,43,.58) 48%,rgba(2,25,34,.82))}
.shipyard-choice-grid>button[data-shipyard-view="build"]::after{background:linear-gradient(180deg,rgba(35,14,3,.14),rgba(35,17,6,.58) 48%,rgba(22,12,6,.84))}
.shipyard-choice-grid>button[data-shipyard-view="ship-market"]::after{background:linear-gradient(180deg,rgba(43,20,7,.14),rgba(38,20,9,.58) 48%,rgba(24,14,8,.84))}
.shipyard-choice-grid>button:hover::before{filter:saturate(1.04) brightness(.98);transform:scale(1.045)}
.shipyard-choice-grid>button{display:flex;flex-direction:column;align-items:stretch;justify-content:flex-end;padding:0}
.shipyard-choice-icon{position:absolute;top:34%;left:50%;z-index:1;display:grid;width:66px;height:66px;place-items:center;transform:translate(-50%,-50%);filter:drop-shadow(0 3px 7px rgba(0,0,0,.82));transition:transform .2s}
.shipyard-choice-icon img{display:block;width:100%;height:100%;object-fit:contain}
.shipyard-choice-grid>button[data-shipyard-view="build"] .shipyard-choice-icon{width:84px;height:84px}
.shipyard-choice-grid>button:hover .shipyard-choice-icon{transform:translate(-50%,-54%) scale(1.06)}
.shipyard-choice-copy{position:relative;z-index:1;display:block;width:100%;padding:13px 15px 15px;border-top:1px solid rgba(255,255,255,.13);background:linear-gradient(180deg,rgba(3,17,25,.72),rgba(2,13,20,.92));box-shadow:0 -9px 20px rgba(0,0,0,.22);backdrop-filter:blur(2px)}
.shipyard-choice-copy strong,.shipyard-choice-copy small{display:block}
.shipyard-choice-copy strong{text-shadow:0 2px 8px #00111d}
.shipyard-choice-copy small{margin-top:5px;color:#d3dfdd;text-shadow:0 1px 5px #00111d}
.layout-phone .shipyard-choice-icon{top:37%;width:54px;height:54px}.layout-phone .shipyard-choice-grid>button[data-shipyard-view="build"] .shipyard-choice-icon{width:68px;height:68px}.layout-phone .shipyard-choice-copy{padding:9px 12px 10px}
.shipyard-choice-grid{grid-template-columns:repeat(4,1fr)}
.layout-tablet .shipyard-choice-grid{grid-template-columns:repeat(2,1fr)}
.shipyard-choice-grid>button[data-harbour-service="resource-market"]::before{background-image:url("assets/ui/harbour-resource-market.webp");background-position:center}
.shipyard-choice-grid>button[data-harbour-service="resource-market"]::after{background:linear-gradient(180deg,rgba(3,34,30,.12),rgba(4,40,38,.57) 48%,rgba(3,25,29,.86))}
.shipyard-choice-icon svg{display:block;width:100%;height:100%;fill:#fff;stroke:none}