:root {
  color-scheme: dark;
  --ink: #ecfbf8;
  --muted: #97b5b2;
  --glass: rgba(4, 19, 24, .72);
  --edge: rgba(151, 240, 225, .18);
  --cyan: #6fffe6;
  --gold: #ffd36f;
  --danger: #ff5f72;
  --good: #6cff9c;
}
* { box-sizing: border-box; }
html, body { width: 100%; height: var(--app-height, 100dvh); min-height: 100%; margin: 0; overflow: hidden; background: #02090c; font-family: Inter, ui-sans-serif, system-ui, -apple-system, Segoe UI, sans-serif; color: var(--ink); }
button, kbd { font: inherit; }
button { color: var(--ink); background: rgba(111,255,230,.1); border: 1px solid rgba(111,255,230,.35); border-radius: 10px; padding: .75rem 1rem; cursor: pointer; letter-spacing: .05em; font-weight: 800; }
button:hover { background: rgba(111,255,230,.2); }
button.danger { border-color: rgba(255,95,114,.4); color: #ffabb5; }
#gameCanvas { position: fixed; inset: 0; width: var(--app-width, 100dvw); height: var(--app-height, 100dvh); outline: none; touch-action: none; }
.hidden { display: none !important; }
.screen { position: fixed; inset: 0; z-index: 30; display: grid; place-items: center; background: radial-gradient(circle at 50% 40%, rgba(16,71,78,.38), rgba(1,8,11,.96) 62%), linear-gradient(160deg, #071a20, #02070a); }
.brand-mark { width: 64px; height: 64px; display: grid; place-items: center; border: 1px solid rgba(111,255,230,.45); border-radius: 50%; color: var(--cyan); font-weight: 900; letter-spacing: -.08em; box-shadow: 0 0 50px rgba(111,255,230,.15); }
#loading h1 { margin: 1rem 0 .05rem; font-size: clamp(1.8rem, 4vw, 3.5rem); letter-spacing: .18em; }
#loading p { margin: 0 0 2rem; color: var(--gold); letter-spacing: .55em; }
.loading-bar { width: min(420px, 72vw); height: 4px; background: rgba(255,255,255,.1); overflow: hidden; }
.loading-bar span { display: block; width: 0; height: 100%; background: linear-gradient(90deg, var(--cyan), var(--gold)); transition: width .4s; }
#loading small { margin-top: .8rem; color: var(--muted); }
.glass { background: linear-gradient(135deg, rgba(8,30,36,.78), rgba(2,13,17,.68)); border: 1px solid var(--edge); box-shadow: 0 12px 40px rgba(0,0,0,.3), inset 0 1px rgba(255,255,255,.025); backdrop-filter: blur(14px); }
.title-card { width: min(720px, calc(100vw - 36px)); padding: clamp(2rem, 7vw, 5rem); text-align: center; border-radius: 22px; position: relative; overflow: hidden; }
.title-card:before { content: ""; position: absolute; inset: -20%; background: radial-gradient(circle at 50% 20%, rgba(111,255,230,.14), transparent 38%); pointer-events: none; }
.eyebrow { font-size: .68rem; letter-spacing: .22em; color: var(--cyan); font-weight: 900; }
.title-card h1 { margin: .65rem 0 0; font-size: clamp(2.5rem, 8vw, 6.5rem); line-height: .86; letter-spacing: -.055em; }
.title-card h2 { margin: .55rem 0 2rem; color: var(--gold); letter-spacing: .55em; font-size: clamp(.85rem, 2vw, 1.25rem); }
.title-card p { max-width: 560px; margin: 0 auto 2rem; color: #bdd0ce; line-height: 1.7; }
.primary { min-width: 240px; padding: 1rem 1.5rem; color: #021216; background: linear-gradient(135deg, var(--cyan), #b8fff1); box-shadow: 0 0 35px rgba(111,255,230,.18); }
.primary:hover { background: #d7fff7; }
.start-meta { margin-top: 1.2rem; display: flex; justify-content: center; gap: 1rem; flex-wrap: wrap; color: #668986; font-size: .68rem; text-transform: uppercase; letter-spacing: .09em; }
#hud { position: fixed; inset: 0; z-index: 10; pointer-events: none; }
.topbar { position: absolute; top: 16px; left: 50%; transform: translateX(-50%); padding: .65rem 1rem; border-radius: 12px; display: flex; gap: 1rem; align-items: center; }
.game-title { font-size: .72rem; font-weight: 900; letter-spacing: .12em; white-space: nowrap; }
.game-title span { color: var(--muted); font-weight: 600; }
.renderer-badge { color: #06161a; background: var(--cyan); border-radius: 5px; padding: .2rem .4rem; font-size: .58rem; font-weight: 950; }
.mission { position: absolute; top: 16px; left: 16px; width: min(340px, calc(100vw - 32px)); padding: 1rem 1.1rem; border-radius: 14px; }
.mission h3 { margin: .35rem 0; font-size: 1.02rem; }
.mission p { margin: 0; color: #aac1be; font-size: .82rem; line-height: 1.45; }
.resource-row { display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .75rem; }
.resource-pill { padding: .3rem .48rem; border-radius: 6px; background: rgba(255,255,255,.055); color: #a8c0bd; font-size: .68rem; }
.resource-pill.ready { color: var(--good); background: rgba(108,255,156,.08); }
.distance { margin-top: .75rem; display: flex; gap: .45rem; color: var(--gold); font-size: .75rem; }
#objectiveBearing { display: inline-block; transition: transform .15s; }
.vitals { position: absolute; left: 16px; bottom: 70px; width: 260px; padding: .75rem; border-radius: 12px; }
.vital { display: grid; grid-template-columns: 60px 1fr 32px; gap: .5rem; align-items: center; margin: .28rem 0; font-size: .6rem; letter-spacing: .08em; }
.vital > div { height: 5px; background: rgba(255,255,255,.09); overflow: hidden; border-radius: 4px; }
.vital i { display: block; width: 100%; height: 100%; background: var(--cyan); transition: width .2s; }
.vital b { text-align: right; font-size: .65rem; }
.vital.karma i { background: var(--good); }
.inventory-strip { position: absolute; left: 50%; bottom: 64px; transform: translateX(-50%); display: flex; gap: .35rem; padding: .45rem; border-radius: 12px; }
.slot { width: 58px; height: 54px; border: 1px solid rgba(255,255,255,.08); border-radius: 8px; background: rgba(0,0,0,.18); padding: .35rem; position: relative; display: grid; place-items: center; color: #9db5b2; }
.slot.active { border-color: var(--gold); color: var(--gold); box-shadow: inset 0 0 18px rgba(255,211,111,.08); }
.slot.locked { opacity: .36; }
.slot .num { position: absolute; top: 3px; left: 5px; font-size: .55rem; }
.slot .icon { font-size: 1.15rem; }
.slot .label { font-size: .48rem; letter-spacing: .05em; text-transform: uppercase; }
.weather { position: absolute; right: 16px; top: 16px; padding: .65rem .85rem; border-radius: 10px; color: #b7cecb; font-size: .65rem; letter-spacing: .1em; }
.save-readout { position: absolute; right: 18px; top: 60px; opacity: 0; color: var(--good); font-size: .62rem; letter-spacing: .08em; transition: opacity .25s; }
.save-readout.show { opacity: 1; }
.controls { position: absolute; left: 50%; bottom: 12px; transform: translateX(-50%); display: flex; gap: .9rem; padding: .55rem .8rem; border-radius: 10px; color: #78918e; font-size: .57rem; white-space: nowrap; }
kbd { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.13); border-bottom-width: 2px; padding: .1rem .28rem; border-radius: 4px; color: #d8ebe8; }
.crosshair { position: absolute; left: 50%; top: 50%; width: 20px; height: 20px; transform: translate(-50%,-50%); }
.crosshair i { position: absolute; background: rgba(226,255,250,.8); box-shadow: 0 0 5px rgba(111,255,230,.5); }
.crosshair i:first-child { width: 10px; height: 1px; top: 9px; left: 5px; }
.crosshair i:last-child { width: 1px; height: 10px; left: 9px; top: 5px; }
.interaction { position: absolute; left: 50%; top: calc(50% + 35px); transform: translateX(-50%); display: flex; gap: .5rem; align-items: center; background: rgba(2,13,17,.85); border: 1px solid rgba(111,255,230,.25); border-radius: 8px; padding: .5rem .7rem; font-size: .75rem; }
.fishing { position: absolute; right: 16px; bottom: 70px; width: 300px; padding: 1rem; border-radius: 14px; }
.fishing h3 { margin: .3rem 0 .8rem; }
.fishing small { color: var(--muted); font-size: .67rem; }
.fish-meter { display: grid; grid-template-columns: 58px 1fr; gap: .5rem; align-items: center; font-size: .58rem; margin: .45rem 0; }
.fish-meter > div { height: 8px; background: rgba(255,255,255,.08); border-radius: 5px; overflow: hidden; }
.fish-meter i { display: block; height: 100%; width: 0; background: var(--gold); }
#landingBar { background: var(--cyan); }
.boss { position: absolute; top: 78px; left: 50%; width: min(520px, calc(100vw - 32px)); transform: translateX(-50%); padding: .7rem .9rem; border-radius: 10px; }
.boss > div:first-child { display: flex; justify-content: space-between; font-size: .68rem; letter-spacing: .11em; color: #ff9aa6; }
.boss-meter { margin-top: .45rem; height: 8px; background: rgba(255,255,255,.08); overflow: hidden; border-radius: 4px; }
.boss-meter i { display: block; height: 100%; width: 100%; background: linear-gradient(90deg, #ff3951, #ff9875); transition: width .18s; }
.menu-panel { position: absolute; pointer-events: auto; left: 50%; top: 50%; transform: translate(-50%,-50%); width: min(840px, calc(100vw - 28px)); max-height: calc(100vh - 40px); overflow: auto; padding: 1.2rem; border-radius: 18px; }
.menu-header { display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--edge); padding-bottom: .8rem; }
.menu-header h2 { margin: .15rem 0 0; }
.icon-button { width: 38px; height: 38px; padding: 0; font-size: 1.4rem; }
.menu-grid { display: grid; grid-template-columns: 1fr 1.2fr; gap: 1.5rem; }
.menu-grid h3 { font-size: .7rem; color: var(--muted); letter-spacing: .12em; }
.inventory-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: .55rem; }
.inventory-item { background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.07); border-radius: 10px; padding: .7rem; }
.inventory-item b { display: block; font-size: 1.15rem; }
.inventory-item span { color: var(--muted); font-size: .65rem; text-transform: uppercase; }
.recipe { display: grid; grid-template-columns: 1fr auto; gap: .7rem; align-items: center; background: rgba(255,255,255,.035); border: 1px solid rgba(255,255,255,.07); padding: .75rem; border-radius: 10px; margin-bottom: .55rem; }
.recipe h4 { margin: 0 0 .2rem; }
.recipe p { margin: 0; color: var(--muted); font-size: .67rem; }
.recipe button:disabled { opacity: .35; cursor: not-allowed; }
.menu-footer { display: flex; justify-content: flex-end; gap: .6rem; margin-top: 1rem; padding-top: .8rem; border-top: 1px solid var(--edge); }
.toast-stack { position: absolute; right: 16px; top: 100px; display: grid; gap: .5rem; width: min(320px, calc(100vw - 32px)); }
.toast { padding: .75rem .85rem; border-radius: 9px; background: rgba(3,17,21,.9); border: 1px solid rgba(111,255,230,.2); box-shadow: 0 12px 30px rgba(0,0,0,.35); animation: toastIn .25s ease-out; }
.toast b { display: block; color: var(--cyan); font-size: .68rem; letter-spacing: .08em; }
.toast span { color: #bfd1cf; font-size: .75rem; }
@keyframes toastIn { from { opacity: 0; transform: translateX(14px); } }
@media (max-width: 820px) {
  .topbar, .controls { display: none; }
  .mission { top: 10px; left: 10px; width: calc(100vw - 20px); }
  .weather { top: auto; right: 10px; bottom: 10px; }
  .vitals { left: 10px; bottom: 10px; width: 220px; }
  .inventory-strip { bottom: 112px; }
  .fishing { right: 10px; bottom: 110px; }
  .menu-grid { grid-template-columns: 1fr; }
}

.runtime-notice {
  position: absolute; right: 16px; top: 78px; max-width: min(420px, calc(100vw - 32px));
  padding: .7rem .85rem; border-radius: 10px; color: #ffd9de; background: rgba(45, 7, 13, .92);
  border: 1px solid rgba(255, 95, 114, .48); box-shadow: 0 12px 32px rgba(0,0,0,.4);
  font-size: .68rem; line-height: 1.45; pointer-events: auto; z-index: 15;
}
.runtime-notice b { display:block; color:#ff9eaa; letter-spacing:.08em; margin-bottom:.2rem; }

.death-row {
  display: grid; grid-template-columns: 60px 1fr 32px; gap: .5rem; align-items: center;
  margin-top: .45rem; padding-top: .45rem; border-top: 1px solid rgba(255,255,255,.07);
  font-size: .6rem; letter-spacing: .08em;
}
.death-row b { text-align: right; font-size: .65rem; color: #ffabb5; }
.death-pips { display: flex; gap: .4rem; }
.death-pips i { display: block; width: 18px; height: 6px; border-radius: 6px; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.08); }
.death-pips i.spent { background: var(--danger); box-shadow: 0 0 12px rgba(255,95,114,.32); }
.base-panel {
  position: absolute; right: 16px; bottom: 70px; width: 320px; padding: .9rem 1rem;
  border-radius: 14px;
}
.base-panel h3 { margin: .32rem 0 .2rem; font-size: .86rem; }
@media (max-width: 820px) {
  .base-panel { right: 10px; bottom: 110px; width: min(320px, calc(100vw - 20px)); }
}

/* v0.3.0 field system */
.menu-panel { width: min(1040px, calc(100vw - 28px)); }
.menu-tabs { display:flex; gap:.5rem; padding:.85rem 0; border-bottom:1px solid var(--edge); position:sticky; top:-1.2rem; z-index:2; background:rgba(3,16,20,.96); }
.menu-tabs button { flex:1; min-height:40px; color:#91aaa7; background:rgba(255,255,255,.035); border-color:rgba(255,255,255,.08); }
.menu-tabs button.active { color:#041619; background:var(--cyan); border-color:var(--cyan); }
.menu-view { margin-top:1rem; }
.section-heading p { margin:.25rem 0 1rem; color:var(--muted); font-size:.72rem; line-height:1.5; }
.weapon-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.75rem; }
.weapon-card { position:relative; border:1px solid rgba(255,255,255,.09); border-left:4px solid var(--weapon-color,#8aa); background:rgba(255,255,255,.035); border-radius:12px; padding:.85rem; }
.weapon-card.active { box-shadow:0 0 0 1px var(--weapon-color,#8aa), inset 0 0 28px rgba(111,255,230,.055); }
.weapon-card h4 { margin:0 0 .18rem; font-size:.92rem; }
.weapon-card .weapon-meta { color:var(--weapon-color,#bcd); font-size:.64rem; text-transform:uppercase; letter-spacing:.08em; }
.weapon-card p { color:var(--muted); font-size:.68rem; line-height:1.45; margin:.55rem 0; }
.weapon-stats { display:flex; flex-wrap:wrap; gap:.35rem; margin:.55rem 0; }
.weapon-stats span { background:rgba(255,255,255,.055); border-radius:5px; padding:.25rem .38rem; font-size:.61rem; }
.weapon-card button { width:100%; }
.journal-columns { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:1rem; }
.journal-columns h3 { font-size:.7rem; color:var(--muted); letter-spacing:.12em; }
.journal-list { display:grid; gap:.55rem; max-height:52vh; overflow:auto; padding-right:.25rem; }
.journal-card { background:rgba(255,255,255,.035); border:1px solid rgba(255,255,255,.075); border-radius:10px; padding:.7rem; }
.journal-card h4 { margin:0 0 .2rem; color:#e6faf6; font-size:.82rem; }
.journal-card b { color:var(--cyan); }
.journal-card p { margin:.25rem 0 0; color:var(--muted); font-size:.65rem; line-height:1.45; }
.empty-journal { color:#6f8985; padding:1rem; text-align:center; border:1px dashed rgba(255,255,255,.1); border-radius:10px; font-size:.68rem; }
.base-tier-badge { display:inline-block; padding:.18rem .34rem; border-radius:4px; margin-right:.35rem; font-size:.58rem; font-weight:900; }
@media (max-width: 900px) {
  .weapon-grid,.journal-columns { grid-template-columns:1fr; }
  .journal-list { max-height:none; }
}


/* v0.3.2 responsive fullscreen field system */
:root { --app-width: 100dvw; --app-height: 100dvh; --safe-top: env(safe-area-inset-top, 0px); --safe-right: env(safe-area-inset-right, 0px); --safe-bottom: env(safe-area-inset-bottom, 0px); --safe-left: env(safe-area-inset-left, 0px); font-size: clamp(12px, calc(.48vw + .45vh), 16px); }
body { width: var(--app-width); height: var(--app-height); overscroll-behavior: none; }
#hud,.screen { width: var(--app-width); height: var(--app-height); min-height: 0; }
.topbar { top: max(10px,var(--safe-top)); }
.mission { top: max(16px,var(--safe-top)); left: max(16px,var(--safe-left)); width: clamp(250px, 20vw, 340px); max-height: min(31vh, 250px); overflow:auto; }
.weather { right: max(16px,var(--safe-right)); top: max(16px,var(--safe-top)); }
.vitals { left: max(16px,var(--safe-left)); bottom: max(16px,var(--safe-bottom)); }
.controls { bottom: max(10px,var(--safe-bottom)); max-width: calc(100vw - 32px); overflow:hidden; }
.inventory-strip { bottom: calc(max(10px,var(--safe-bottom)) + 48px); }
.menu-panel { width:min(1120px,calc(var(--app-width) - 24px)); height:min(820px,calc(var(--app-height) - 24px)); max-height:calc(var(--app-height) - 24px); overflow:hidden; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; padding:clamp(.75rem,1.8vw,1.2rem); }
.menu-tabs { display:grid; grid-template-columns:repeat(6,minmax(0,1fr)); gap:.42rem; overflow-x:auto; top:0; padding:.72rem 0; }
.menu-tabs button { min-width:92px; padding:.62rem .55rem; font-size:.66rem; }
.menu-view { min-height:0; overflow:auto; padding-right:.25rem; margin-top:.75rem; }
.section-heading h3 { margin:.1rem 0 .25rem; letter-spacing:.12em; }
.inventory-grid { display:grid; gap:.85rem; grid-template-columns:1fr; }
.inventory-category { border:1px solid rgba(255,255,255,.075); border-radius:13px; background:rgba(255,255,255,.024); overflow:hidden; }
.inventory-category > header { display:flex; justify-content:space-between; gap:1rem; align-items:center; padding:.65rem .8rem; background:rgba(111,255,230,.045); border-bottom:1px solid rgba(255,255,255,.06); }
.inventory-category > header span { color:var(--cyan); font-size:.65rem; font-weight:900; letter-spacing:.12em; }
.inventory-category > header small { color:var(--muted); font-size:.6rem; }
.inventory-category-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:.55rem; padding:.7rem; }
.inventory-item { min-height:72px; display:flex; align-items:center; gap:.65rem; padding:.62rem; }
.inventory-item b { line-height:1; font-size:1.2rem; }
.inventory-item span:not(.inventory-icon) { display:block; margin-top:.16rem; }
.inventory-icon { width:34px; height:34px; display:grid; place-items:center; border-radius:9px; background:rgba(111,255,230,.07); font-size:1.15rem; flex:none; }
.recipe-group { margin-bottom:1rem; }
.recipe-group > header { position:sticky; top:0; z-index:1; padding:.42rem .2rem; background:rgba(3,16,20,.96); }
.recipe-group > header h3 { margin:0; font-size:.66rem; color:var(--cyan); letter-spacing:.13em; }
.recipe { margin-bottom:.48rem; padding:.72rem .8rem; }
.recipe-kicker { color:var(--gold); font-size:.55rem; font-weight:900; letter-spacing:.12em; text-transform:uppercase; margin-bottom:.18rem; }
.recipe-cost { margin-top:.4rem; color:#c2d7d3; font-size:.62rem; font-weight:800; }
.building-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.build-card { border:1px solid rgba(255,255,255,.09); border-top:4px solid var(--tier-color); border-radius:13px; background:rgba(255,255,255,.035); padding:.9rem; display:flex; flex-direction:column; gap:.65rem; }
.build-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:.5rem; }
.build-card h3 { margin:.1rem 0; }
.build-card strong { color:var(--cyan); }
.build-card p { color:var(--muted); font-size:.68rem; line-height:1.5; margin:0; }
.build-cost { display:flex; flex-wrap:wrap; gap:.35rem; }
.build-cost span { padding:.25rem .4rem; border-radius:5px; background:rgba(255,255,255,.06); color:#8ea7a4; font-size:.6rem; }
.build-cost span.ready { color:#081b14; background:var(--good); }
.build-card button { margin-top:auto; width:100%; }
.options-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.option-card { min-height:210px; border:1px solid rgba(255,255,255,.08); border-radius:14px; padding:1rem; background:rgba(255,255,255,.032); display:flex; flex-direction:column; justify-content:space-between; gap:1rem; }
.option-card h3 { margin:.35rem 0 .45rem; }
.option-card p { margin:0; color:var(--muted); font-size:.7rem; line-height:1.55; }
.option-card button { width:100%; }
.primary.compact { min-width:0; }
.cycle-legend { display:grid; grid-template-columns:7fr 2fr; gap:.35rem; }
.cycle-legend span { padding:.65rem .4rem; border-radius:8px; text-align:center; font-size:.62rem; font-weight:900; background:rgba(255,211,111,.14); color:var(--gold); }
.cycle-legend span:last-child { background:rgba(111,145,255,.14); color:#a9c7ff; }
.menu-footer { margin-top:.65rem; padding-top:.65rem; }
.short-viewport .mission { max-height:26vh; }
.short-viewport .inventory-strip { bottom:50px; transform:translateX(-50%) scale(.86); transform-origin:bottom center; }
.short-viewport .controls { display:none; }
.short-viewport .menu-panel { height:calc(var(--app-height) - 12px); max-height:calc(var(--app-height) - 12px); }
@media (max-width: 900px) {
  .menu-tabs { grid-template-columns:repeat(3,minmax(100px,1fr)); }
  .inventory-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); }
  .building-list,.options-grid { grid-template-columns:1fr; }
}
@media (max-width: 620px) {
  :root { font-size:12px; }
  .mission { width:calc(100vw - 20px); left:10px; top:10px; max-height:25vh; }
  .weather { top:auto; bottom:10px; right:10px; }
  .vitals { left:10px; bottom:10px; width:200px; }
  .inventory-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .menu-header h2 { font-size:1.05rem; }
}

/* v0.4.0 survival stations, vessels, swimming and forge paths */
.swim-panel {
  position:absolute; left:50%; bottom:142px; transform:translateX(-50%); width:min(360px,calc(100vw - 24px));
  padding:.8rem .9rem; border-radius:12px; text-align:center;
}
.swim-panel h3 { margin:.25rem 0 .45rem; font-size:.78rem; letter-spacing:.12em; color:#b9fff2; }
.swim-panel small { display:block; margin-top:.4rem; color:var(--muted); font-size:.61rem; line-height:1.4; }
.swim-meter { height:7px; overflow:hidden; border-radius:6px; background:rgba(255,255,255,.08); }
.swim-meter i { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--cyan),var(--gold),var(--danger)); transition:width .2s; }
.vessel-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.8rem; }
.vessel-card { border:1px solid rgba(255,255,255,.09); border-radius:14px; background:rgba(255,255,255,.035); padding:1rem; display:flex; flex-direction:column; gap:.65rem; }
.vessel-card.hero { border-color:rgba(111,255,230,.28); background:linear-gradient(145deg,rgba(111,255,230,.075),rgba(255,255,255,.025)); }
.vessel-card h3 { margin:.1rem 0; }
.vessel-card p { color:var(--muted); font-size:.7rem; line-height:1.5; margin:0; }
.vessel-actions { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:.4rem; margin-top:auto; }
.vessel-actions button { min-width:0; padding:.65rem .4rem; font-size:.59rem; }
button:disabled { opacity:.34; cursor:not-allowed; filter:saturate(.4); }
.build-section-title { grid-column:1/-1; padding:.55rem .2rem .15rem; color:var(--cyan); font-size:.7rem; font-weight:900; letter-spacing:.14em; border-bottom:1px solid rgba(111,255,230,.12); }
.upgrade-actions { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:.35rem; margin-top:.45rem; }
.upgrade-actions button { min-width:0; padding:.55rem .35rem; font-size:.58rem; }
.menu-tabs { grid-template-columns:repeat(7,minmax(0,1fr)); }
@media (max-width:900px){
  .vessel-grid { grid-template-columns:1fr; }
  .vessel-actions { grid-template-columns:1fr; }
  .menu-tabs { grid-template-columns:repeat(4,minmax(100px,1fr)); }
}
@media (max-width:620px){
  .swim-panel { bottom:116px; }
  .menu-tabs { grid-template-columns:repeat(3,minmax(92px,1fr)); }
}


.cinematic-panel{position:fixed;inset:0;z-index:34;pointer-events:none;display:grid;grid-template-rows:minmax(7vh,11vh) 1fr minmax(7vh,11vh);align-items:center;text-align:center;background:linear-gradient(180deg,rgba(0,0,0,.16),transparent 28%,transparent 72%,rgba(0,0,0,.16));animation:cinematicFade .28s ease-out both}.cinematic-panel.hidden{display:none}.cinematic-bar{height:100%;background:rgba(0,4,7,.9);box-shadow:0 0 40px rgba(0,0,0,.8)}.cinematic-copy{align-self:center;justify-self:center;max-width:min(760px,86vw);padding:20px 28px;text-shadow:0 3px 20px #000}.cinematic-copy span{display:block;color:var(--aqua);font:700 clamp(10px,1vw,14px)/1.2 var(--display);letter-spacing:.28em}.cinematic-copy strong{display:block;margin-top:8px;color:#fff;font:800 clamp(28px,5vw,68px)/.95 var(--display);letter-spacing:.08em}.cinematic-copy small{display:block;margin-top:14px;color:#d8ffff;font:500 clamp(12px,1.4vw,19px)/1.45 var(--body);letter-spacing:.05em}@keyframes cinematicFade{from{opacity:0}to{opacity:1}}

/* v0.4.1 roaming market */
.shop-panel{
  position:fixed;inset:clamp(12px,2.2vw,34px);z-index:30;display:flex;flex-direction:column;
  max-width:1500px;max-height:calc(var(--app-height,100vh) - clamp(24px,4.4vw,68px));margin:auto;
  padding:clamp(14px,1.8vw,26px);overflow:hidden;border:1px solid rgba(101,255,226,.28);
  box-shadow:0 28px 90px rgba(0,8,15,.76),inset 0 0 70px rgba(33,178,163,.05)
}
.shop-panel.hidden{display:none}
.shop-header{display:flex;justify-content:space-between;gap:20px;align-items:flex-start;padding-bottom:14px;border-bottom:1px solid rgba(255,255,255,.09)}
.shop-header h2{margin:.2rem 0;font-size:clamp(1.45rem,2.6vw,2.55rem);letter-spacing:.035em}
.shop-header p{margin:0;color:#71f3d7;font-size:.76rem;letter-spacing:.13em;font-weight:800}
.shop-header-actions{display:grid;grid-template-columns:auto auto auto;gap:10px;align-items:center;text-align:right}
.shop-header-actions strong{color:#ffd76d;font-size:1.1rem}.shop-header-actions small{color:#a8c8c7;min-width:116px}
.shop-tabs{display:flex;gap:8px;overflow-x:auto;padding:12px 0 13px;scrollbar-width:thin}
.shop-tabs button{white-space:nowrap;border:1px solid rgba(255,255,255,.12);background:rgba(3,21,29,.72);color:#a8c6c5;padding:.72rem .9rem;border-radius:8px;font-weight:800;letter-spacing:.06em}
.shop-tabs button.active{color:#071b20;background:linear-gradient(135deg,#5ff0d6,#8fffc9);border-color:transparent}
.shop-columns{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(330px,.75fr);gap:16px;min-height:0;flex:1}
.shop-pane{min-height:0;display:flex;flex-direction:column;background:rgba(0,13,21,.48);border:1px solid rgba(255,255,255,.075);border-radius:12px;padding:13px}
.shop-pane .section-heading{flex:none}.shop-stock-grid,.shop-sell-grid{overflow:auto;min-height:0;padding-right:5px}
.shop-stock-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
.shop-item{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:11px;align-items:center;min-height:116px;padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.09);background:linear-gradient(135deg,rgba(20,54,59,.6),rgba(4,19,28,.84))}
.shop-item.weapon{border-color:rgba(185,111,255,.27);background:linear-gradient(135deg,rgba(54,28,70,.6),rgba(4,19,28,.88))}
.shop-item-icon{font-size:1.8rem;text-align:center;filter:drop-shadow(0 0 9px rgba(105,255,223,.32))}
.shop-item-copy h4{margin:.15rem 0 .28rem;font-size:1rem}.shop-item-copy p{margin:0 0 .3rem;color:#b8cbca;font-size:.78rem;line-height:1.35}.shop-item-copy small{color:#6fd8c8;font-weight:800;letter-spacing:.07em}
.shop-item button,.shop-sell-row button{border:1px solid rgba(102,255,224,.3);background:rgba(39,188,166,.14);color:#8fffdc;border-radius:7px;padding:.64rem .7rem;font-weight:900;white-space:nowrap}.shop-item button:disabled{opacity:.32}
.shop-sell-grid{display:flex;flex-direction:column;gap:8px}.shop-sell-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;gap:8px;align-items:center;padding:10px;border-radius:9px;background:rgba(5,24,31,.7);border:1px solid rgba(255,255,255,.075)}
.shop-sell-row.weapon{border-color:rgba(192,119,255,.2)}.shop-sell-row>span{font-size:1.25rem;text-align:center}.shop-sell-row b{display:block;font-size:.86rem}.shop-sell-row small{display:block;color:#8eaaa9;font-size:.7rem;margin-top:2px}
.shop-footer{display:flex;justify-content:space-between;gap:12px;padding-top:12px;color:#68cbbb;font-size:.67rem;font-weight:900;letter-spacing:.09em}
@media(max-width:980px){.shop-columns{grid-template-columns:1fr}.shop-pane{max-height:42vh}.shop-stock-grid{grid-template-columns:1fr}.shop-header-actions{grid-template-columns:auto auto}.shop-header-actions .icon-button{grid-row:1/3;grid-column:3}.shop-footer{display:none}}
@media(max-width:620px){.shop-panel{inset:6px;padding:10px}.shop-header{gap:8px}.shop-header-actions small{display:none}.shop-item{grid-template-columns:38px minmax(0,1fr);min-height:0}.shop-item button{grid-column:1/3}.shop-sell-row{grid-template-columns:28px minmax(0,1fr) auto}.shop-sell-row button+button{display:none}}

/* v0.4.2 equipment, cargo chest and developer testing controls */
.cheat-card{grid-column:1/-1;min-height:0}.cheat-actions{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:.5rem}.cheat-actions button{min-width:0;padding:.72rem .45rem;font-size:.58rem}.cheat-actions button:last-child{border-color:rgba(255,95,114,.35);color:#ff9aac}
.storage-panel{position:fixed;inset:clamp(12px,3vw,44px);z-index:32;display:flex;flex-direction:column;max-width:1250px;max-height:calc(var(--app-height,100vh) - clamp(24px,6vw,88px));margin:auto;padding:clamp(14px,2vw,26px);overflow:hidden;border:1px solid rgba(111,255,230,.3);box-shadow:0 28px 100px rgba(0,6,12,.82),inset 0 0 75px rgba(62,225,207,.045)}.storage-panel.hidden{display:none}.storage-header{display:flex;justify-content:space-between;gap:18px;align-items:flex-start;padding-bottom:13px;border-bottom:1px solid rgba(255,255,255,.09)}.storage-header h2{margin:.2rem 0;font-size:clamp(1.35rem,2.3vw,2.25rem)}.storage-header p{margin:0;color:#76e7d6;font-size:.74rem;font-weight:800;letter-spacing:.08em}.storage-columns{display:grid;grid-template-columns:1fr 1fr;gap:14px;min-height:0;flex:1;padding-top:14px}.storage-columns>section{min-height:0;display:flex;flex-direction:column;background:rgba(0,15,22,.56);border:1px solid rgba(255,255,255,.075);border-radius:12px;padding:12px}.storage-grid{overflow:auto;display:flex;flex-direction:column;gap:8px;min-height:0}.storage-row{display:grid;grid-template-columns:34px minmax(0,1fr) auto auto;gap:9px;align-items:center;padding:10px;border-radius:9px;background:rgba(6,27,34,.76);border:1px solid rgba(255,255,255,.075)}.storage-row>span{font-size:1.25rem;text-align:center}.storage-row b{display:block;font-size:.86rem}.storage-row small{display:block;color:#8da9a7;font-size:.68rem;margin-top:2px}.storage-row button{min-width:42px;padding:.55rem .45rem;border:1px solid rgba(111,255,230,.28);background:rgba(72,207,189,.12);color:#8fffe0;border-radius:7px;font-weight:900}.storage-row button:disabled{opacity:.28}.boat-engine-card{border:1px solid rgba(111,255,230,.12);border-radius:11px;padding:.8rem;background:rgba(0,18,25,.52);display:flex;flex-direction:column;gap:.55rem}.boat-engine-card.active{border-color:rgba(255,214,111,.4);background:linear-gradient(145deg,rgba(255,214,111,.07),rgba(0,18,25,.6))}.engine-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.4rem}.engine-actions button{min-width:0;padding:.6rem .35rem;font-size:.57rem}.vessel-status-warning{padding:.55rem .65rem;border-radius:8px;background:rgba(255,95,114,.1);border:1px solid rgba(255,95,114,.25);color:#ff9fae;font-size:.68rem;font-weight:800;line-height:1.4}.friend-badge{color:#87ffd4!important}.controls .helm-note{color:#ffd76d}
@media(max-width:980px){.cheat-actions{grid-template-columns:repeat(3,minmax(0,1fr))}.storage-columns{grid-template-columns:1fr}.storage-columns>section{max-height:39vh}}
@media(max-width:620px){.cheat-actions{grid-template-columns:repeat(2,minmax(0,1fr))}.storage-panel{inset:6px;padding:10px}.storage-row{grid-template-columns:28px minmax(0,1fr) auto}.storage-row button+button{display:none}}

/* v0.4.4 modal input lock, incoming-fire feedback, trading beacon and vessel camera recovery pass */
body.ui-input-locked #gameCanvas { pointer-events:none; }
body.ui-input-locked .crosshair,
body.ui-input-locked .interaction { opacity:.18; }
.menu-panel,.shop-panel,.storage-panel { pointer-events:auto; isolation:isolate; }
.damage-flash {
  --hit-strength:1;
  position:fixed; inset:0; z-index:38; pointer-events:none; opacity:0;
  background:
    radial-gradient(circle at center, transparent 36%, rgba(255,72,72,calc(.12 * var(--hit-strength))) 72%, rgba(75,0,8,calc(.72 * var(--hit-strength))) 100%),
    linear-gradient(90deg,rgba(255,65,65,.18),transparent 17%,transparent 83%,rgba(255,65,65,.18));
  mix-blend-mode:screen;
}
.damage-flash.active { animation:damage-flash-pulse .23s ease-out; }
@keyframes damage-flash-pulse { 0%{opacity:.95} 100%{opacity:0} }
.incoming-fire {
  position:fixed; left:50%; top:17%; transform:translate(-50%,-10px); z-index:39; pointer-events:none;
  padding:.42rem .8rem; border:1px solid rgba(255,94,111,.55); border-radius:8px;
  background:rgba(42,2,9,.82); color:#ffb4bd; font-size:.65rem; font-weight:900; letter-spacing:.13em;
  opacity:0; box-shadow:0 0 24px rgba(255,46,80,.2);
}
.incoming-fire.active { animation:incoming-fire-pop .78s ease-out; }
@keyframes incoming-fire-pop { 0%{opacity:0;transform:translate(-50%,-18px) scale(.92)} 18%{opacity:1;transform:translate(-50%,0) scale(1)} 72%{opacity:1} 100%{opacity:0;transform:translate(-50%,8px)} }


/* v0.4.5 focused workflow, universal storage, loot caches and equipment-service UI */
.workflow-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:1rem;flex-wrap:wrap}.workflow-path{display:flex;align-items:center;gap:.45rem;color:#83f4dd;font-size:.62rem;font-weight:900;letter-spacing:.08em}.workflow-path span{padding:.42rem .56rem;border:1px solid rgba(111,255,230,.18);border-radius:7px;background:rgba(111,255,230,.055)}.workflow-path i{font-style:normal;color:#557875}.build-section-title.major{margin-top:1.1rem;padding:.75rem .85rem;border-radius:9px;background:linear-gradient(90deg,rgba(111,255,230,.1),transparent);border-left:3px solid var(--cyan)}
.equipment-service{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;margin-bottom:1rem}.service-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.8rem;border:1px solid rgba(111,255,230,.11);border-radius:11px;background:rgba(2,24,31,.7)}.service-card h4{margin:.16rem 0}.service-card p{margin:0;color:#8ea9a7;font-size:.73rem}.service-card button{padding:.6rem .7rem;font-size:.62rem}.storage-weapon{border-color:rgba(185,111,255,.24);background:linear-gradient(135deg,rgba(67,31,82,.42),rgba(6,27,34,.76))}.storage-weapon small{color:#c2a8d6}.storage-panel .storage-grid{padding-bottom:.35rem}.menu-tabs{grid-template-columns:repeat(6,minmax(0,1fr))}
@media(max-width:850px){.equipment-service{grid-template-columns:1fr}.workflow-heading{align-items:flex-start}.workflow-path{width:100%;overflow-x:auto}.menu-tabs{grid-template-columns:repeat(3,minmax(100px,1fr))}}
.recipe-topline{display:flex;justify-content:space-between;align-items:center;gap:.6rem}.recipe-station{font-size:.56rem;font-weight:900;letter-spacing:.08em;color:#8ba9a6;padding:.26rem .42rem;border-radius:5px;background:rgba(255,255,255,.045)}.recipe-status{display:inline-flex;margin-top:.48rem;padding:.28rem .44rem;border-radius:5px;font-size:.57rem;font-weight:900;letter-spacing:.08em;color:#ff9eaa;background:rgba(255,95,114,.08);border:1px solid rgba(255,95,114,.18)}.recipe-status.ready{color:#7fffd8;background:rgba(89,255,207,.08);border-color:rgba(89,255,207,.2)}.recipe.ready{border-color:rgba(89,255,207,.18);background:linear-gradient(135deg,rgba(33,85,76,.26),rgba(2,20,27,.72))}

/* v0.4.7 station-first UIX, storage quick actions and FPS aiming */
.menu-subtitle{margin:.28rem 0 0;color:#8fb4b1;font-size:.72rem;line-height:1.35}
.menu-tabs{grid-template-columns:repeat(5,minmax(0,1fr))}
.storage-header-buttons{display:flex;align-items:center;justify-content:flex-end;gap:.55rem;flex-wrap:wrap}
.compact-action{border:1px solid rgba(111,255,230,.28);background:rgba(55,198,180,.12);color:#9bffe5;border-radius:8px;padding:.62rem .72rem;font-size:.62rem;font-weight:900;letter-spacing:.06em}
.compact-action.danger{border-color:rgba(255,95,114,.28);color:#ffabb7;background:rgba(255,95,114,.08)}
.compact-action.hidden{display:none}
.station-panel{position:fixed;inset:clamp(12px,3vw,42px);z-index:34;display:flex;flex-direction:column;max-width:1260px;max-height:calc(var(--app-height,100vh) - clamp(24px,6vw,84px));margin:auto;padding:clamp(14px,2vw,25px);overflow:hidden;border:1px solid rgba(111,255,230,.3);box-shadow:0 28px 100px rgba(0,6,12,.84),inset 0 0 75px rgba(62,225,207,.045)}
.station-panel.hidden{display:none}
.station-header{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;padding-bottom:13px;border-bottom:1px solid rgba(255,255,255,.09)}
.station-header h2{margin:.18rem 0;font-size:clamp(1.4rem,2.6vw,2.35rem)}
.station-header p{margin:0;color:#8cb8b3;font-size:.76rem}
.station-tabs{display:flex;gap:.55rem;overflow:auto;padding:12px 0;scrollbar-width:thin}
.station-tabs button{white-space:nowrap;border:1px solid rgba(255,255,255,.1);background:rgba(3,20,27,.78);color:#a7c2c0;border-radius:8px;padding:.7rem .9rem;font-weight:900;letter-spacing:.06em}
.station-tabs button.active{background:linear-gradient(135deg,#5ff0d6,#a5ffd2);color:#061a1f;border-color:transparent}
.station-content{min-height:0;flex:1;overflow:auto;padding-right:5px}
.station-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem}
.station-card{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:.8rem;align-items:center;padding:.9rem;border-radius:11px;border:1px solid rgba(111,255,230,.12);background:linear-gradient(135deg,rgba(19,57,61,.4),rgba(2,18,26,.78))}
.station-card.full{grid-column:1/-1}
.station-card.selected{border-color:rgba(255,211,108,.45);box-shadow:inset 0 0 25px rgba(255,211,108,.05)}
.station-card h3,.station-card h4{margin:.18rem 0 .34rem}
.station-card p{margin:0;color:#9bb5b2;font-size:.74rem;line-height:1.4}
.station-card small{display:block;margin-top:.35rem;color:#6fe5d1;font-size:.66rem;font-weight:800}
.station-actions{display:flex;flex-direction:column;gap:.42rem;min-width:120px}
.station-actions button,.station-card>button{border:1px solid rgba(111,255,230,.28);background:rgba(62,211,190,.12);color:#9effe5;border-radius:8px;padding:.62rem .72rem;font-weight:900;font-size:.62rem}
.station-actions button:disabled,.station-card>button:disabled{opacity:.3}
.station-actions button.danger{border-color:rgba(255,95,114,.3);color:#ffabb7;background:rgba(255,95,114,.08)}
.station-footer{display:flex;justify-content:space-between;gap:12px;padding-top:11px;color:#6bc9bb;font-size:.62rem;font-weight:900;letter-spacing:.08em}
.station-resource-strip{display:flex;flex-wrap:wrap;gap:.42rem;margin:.55rem 0}
.station-resource-strip span{padding:.32rem .46rem;border-radius:6px;background:rgba(255,255,255,.045);border:1px solid rgba(255,255,255,.07);font-size:.64rem;font-weight:800;color:#a7b9b7}
.station-resource-strip span.ready{color:#8effda;border-color:rgba(89,255,207,.22);background:rgba(89,255,207,.07)}
.aiming #crosshair{opacity:.25;transform:scale(.72)}
.aiming .controls{opacity:.35}
.scope-overlay{position:fixed;inset:0;z-index:18;pointer-events:none;display:none;background:radial-gradient(circle at center,transparent 0 31%,rgba(2,12,15,.08) 32% 36%,rgba(2,8,12,.68) 58% 100%);box-shadow:inset 0 0 140px rgba(0,0,0,.42)}
.scope-overlay.active{display:block}
.scope-overlay.lens,.scope-overlay.reflex{background:radial-gradient(circle at center,rgba(70,220,210,.035) 0 17%,rgba(2,12,15,.12) 18% 23%,transparent 24%);box-shadow:none}
.scope-overlay::before,.scope-overlay::after{content:"";position:absolute;left:50%;top:50%;background:rgba(128,255,225,.88);transform:translate(-50%,-50%);filter:drop-shadow(0 0 4px rgba(80,255,220,.65))}
.scope-overlay::before{width:1px;height:34%}.scope-overlay::after{height:1px;width:34%}
.scope-overlay.lens::before,.scope-overlay.reflex::before{height:13%}.scope-overlay.lens::after,.scope-overlay.reflex::after{width:13%}
.scope-overlay.active::marker{display:none}
@media(max-width:850px){.station-grid{grid-template-columns:1fr}.station-card.full{grid-column:auto}.menu-tabs{grid-template-columns:repeat(2,minmax(120px,1fr))}.storage-header-buttons{justify-content:flex-start}.station-footer{display:none}}
@media(max-width:620px){.station-panel{inset:6px;padding:10px}.station-card{grid-template-columns:1fr}.station-actions{min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.storage-header{flex-direction:column}.storage-header-buttons{width:100%}.compact-action{flex:1}}

/* v0.4.8 station interaction recovery */
/* #hud intentionally ignores gameplay clicks. Every modal must explicitly opt back in. */
.station-panel {
  pointer-events: auto;
  isolation: isolate;
}
.station-panel .station-header,
.station-panel .station-tabs,
.station-panel .station-content,
.station-panel .station-footer,
.station-panel button {
  pointer-events: auto;
}
.station-panel button {
  cursor: pointer;
  touch-action: manipulation;
}
.station-panel button:disabled {
  cursor: not-allowed;
}

/* v0.4.9 underwater and equipment systems */
.underwater-overlay{position:fixed;inset:0;z-index:4;pointer-events:none;opacity:0;transition:opacity .25s ease;background:linear-gradient(180deg,rgba(18,122,147,.16),rgba(2,34,49,.38));mix-blend-mode:screen}
.underwater-overlay.active{opacity:1}
.underwater-rays{position:absolute;inset:-20%;background:repeating-linear-gradient(106deg,transparent 0 9%,rgba(134,255,238,.045) 10% 12%,transparent 13% 22%);filter:blur(12px);animation:reefRays 10s linear infinite}
.underwater-vignette{position:absolute;inset:0;background:radial-gradient(circle at 50% 42%,transparent 35%,rgba(0,27,39,.42) 100%)}
@keyframes reefRays{to{transform:translate3d(8%,3%,0)}}
.swim-panel{min-width:min(390px,calc(100vw - 28px))}
.dive-row{display:grid;grid-template-columns:76px 1fr 74px;align-items:center;gap:8px;margin:.38rem 0;font-size:.68rem;letter-spacing:.08em}
.dive-row b{text-align:right;font-size:.68rem;color:#d9fff7}.dive-row.danger{grid-template-columns:76px 1fr}.swim-meter.oxygen i{background:linear-gradient(90deg,#4fd6ff,#8dffe8)}.swim-meter.jet i{background:linear-gradient(90deg,#ffb84d,#ff69ca)}
body.underwater .crosshair{filter:drop-shadow(0 0 6px rgba(112,255,225,.8))}
body.underwater #gameCanvas{filter:saturate(1.12) contrast(1.04)}

/* v0.5.0 unified inventory, grave containers and transactional roaming market */
.inventory-workspace{display:grid;grid-template-columns:minmax(320px,1.15fr) minmax(280px,.85fr);gap:.8rem;min-height:0}
.inventory-list,.inventory-details{min-height:0;max-height:calc(var(--app-height,100vh) - 270px);overflow:auto;border:1px solid rgba(111,255,230,.12);border-radius:12px;background:rgba(2,19,27,.68);padding:.65rem}
.inventory-filters{display:flex;gap:.42rem;flex-wrap:wrap;justify-content:flex-end}.inventory-filters button{border:1px solid rgba(111,255,230,.14);background:rgba(4,26,34,.78);color:#9cbab7;padding:.52rem .66rem;border-radius:7px;font-size:.6rem;font-weight:900;letter-spacing:.06em}.inventory-filters button.active{background:linear-gradient(135deg,#5ff0d6,#b7ffd7);color:#04191e;border-color:transparent}
.inventory-entry{display:grid;grid-template-columns:42px minmax(0,1fr) auto;gap:.7rem;align-items:center;padding:.62rem .68rem;margin-bottom:.45rem;border:1px solid rgba(255,255,255,.07);border-radius:9px;background:rgba(255,255,255,.025);cursor:pointer}.inventory-entry:hover,.inventory-entry.selected{border-color:rgba(111,255,230,.32);background:rgba(72,222,198,.08)}.inventory-entry .inventory-icon{font-size:1.35rem}.inventory-entry h4{margin:0 0 .12rem}.inventory-entry small{color:#87a5a2}.inventory-entry strong{color:#d8fff6;font-size:.78rem}.inventory-entry.weapon{border-left:3px solid var(--entry-color,#9fd)}
.inventory-details{display:flex;flex-direction:column;gap:.7rem}.inventory-detail-hero{padding:.85rem;border-radius:10px;background:linear-gradient(135deg,rgba(37,84,85,.34),rgba(3,19,28,.7));border:1px solid rgba(111,255,230,.12)}.inventory-detail-hero h3{margin:.24rem 0}.inventory-detail-hero p{color:#9db4b2;font-size:.75rem;line-height:1.45}.inventory-detail-stats{display:flex;flex-wrap:wrap;gap:.38rem}.inventory-detail-stats span{padding:.34rem .45rem;border-radius:6px;background:rgba(255,255,255,.045);font-size:.62rem;font-weight:800;color:#b7cfcc}.inventory-detail-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.5rem}.inventory-detail-actions button{padding:.68rem;border:1px solid rgba(111,255,230,.24);border-radius:8px;background:rgba(55,198,180,.1);color:#a0ffe6;font-weight:900;font-size:.62rem}.inventory-detail-actions button.danger{color:#ffabb7;border-color:rgba(255,95,114,.26);background:rgba(255,95,114,.08)}.inventory-detail-actions button:disabled{opacity:.28}
.shop-cart-bar{display:flex;align-items:center;justify-content:space-between;gap:1rem;margin-top:.65rem;padding:.75rem .85rem;border:1px solid rgba(255,103,212,.24);border-radius:10px;background:linear-gradient(90deg,rgba(255,103,212,.09),rgba(5,25,33,.82))}.shop-cart-bar strong{display:block;color:#ffd7f4}.shop-cart-bar small{display:block;color:#bfa5b7;margin-top:.18rem}.shop-cart-actions{display:flex;gap:.5rem}.shop-cart-actions button{padding:.62rem .78rem;border-radius:8px;border:1px solid rgba(255,103,212,.26);background:rgba(255,103,212,.08);color:#ffd4f2;font-weight:900;font-size:.62rem}.shop-cart-actions .primary{background:linear-gradient(135deg,#ff67d4,#ffd36f);color:#231021;border-color:transparent}.shop-cart-actions button:disabled{opacity:.3}
.shop-item button.carted,.shop-sell-row button.carted{background:rgba(255,211,111,.16);border-color:rgba(255,211,111,.42);color:#ffe8ac}
@media(max-width:850px){.inventory-workspace{grid-template-columns:1fr}.inventory-list,.inventory-details{max-height:none}.inventory-filters{justify-content:flex-start}.shop-cart-bar{align-items:flex-start;flex-direction:column}.shop-cart-actions{width:100%}.shop-cart-actions button{flex:1}}


/* v0.7.1 EXP — terrain and axe hotfix */
body::before{content:"";position:fixed;inset:0;pointer-events:none;z-index:2;background:radial-gradient(circle at 50% 42%,transparent 38%,rgba(0,8,11,.18) 74%,rgba(0,5,8,.44) 100%);mix-blend-mode:multiply}
#gameCanvas{filter:saturate(1.04) contrast(1.025)}
.title-card{max-width:760px;background:linear-gradient(145deg,rgba(5,20,25,.91),rgba(5,14,18,.78));border:1px solid rgba(129,225,211,.24);box-shadow:0 30px 90px rgba(0,0,0,.58),inset 0 1px rgba(255,255,255,.06)}
.title-card h1{letter-spacing:.055em;text-shadow:0 5px 28px rgba(0,0,0,.75)}
.title-card h2{letter-spacing:.42em;color:#9ee9dd;text-shadow:0 0 28px rgba(79,227,205,.22)}
.start-meta span{background:rgba(5,22,27,.64);border:1px solid rgba(131,225,211,.15);padding:.48rem .72rem;border-radius:999px}
.renderer-badge{background:linear-gradient(120deg,rgba(21,92,89,.88),rgba(20,54,65,.86));border-color:rgba(133,237,216,.28);box-shadow:0 0 24px rgba(68,222,196,.12)}
.topbar,.mission,.vitals,.inventory-strip,.weather{backdrop-filter:blur(15px) saturate(1.18);-webkit-backdrop-filter:blur(15px) saturate(1.18)}
.crosshair i{box-shadow:0 0 8px rgba(190,255,244,.48)}
@media(max-width:700px){body::before{background:radial-gradient(circle at 50% 42%,transparent 45%,rgba(0,5,8,.28) 100%)}.title-card h2{letter-spacing:.22em}}


/* retained gameplay UI systems */
.equip-inspect,.ground-inspect{position:fixed;right:clamp(16px,2.2vw,34px);width:min(390px,calc(100vw - 32px));z-index:24;border-left:4px solid var(--inspect-color,#6fffe6);padding:14px 16px;pointer-events:none;transition:opacity .18s ease,transform .18s ease}.equip-inspect{top:18%;transform:translateX(0)}.ground-inspect{bottom:18%;transform:translateX(0)}.equip-inspect.hidden,.ground-inspect.hidden{display:block!important;opacity:0;transform:translateX(28px)}.inspect-kicker{font-size:10px;letter-spacing:.18em;color:var(--inspect-color,#6fffe6);font-weight:900}.inspect-title{font-size:18px;margin:4px 0 6px}.inspect-stats{display:flex;flex-wrap:wrap;gap:6px}.inspect-stats span{border:1px solid color-mix(in srgb,var(--inspect-color,#6fffe6) 42%,transparent);background:#041317aa;padding:5px 7px;border-radius:5px;font-size:10px;font-weight:800}.inspect-mods{margin-top:7px;font-size:10px;line-height:1.4;color:#d9f4ed}.boost-readout{position:fixed;left:50%;top:70px;transform:translateX(-50%);z-index:22;background:#031317dd;border:1px solid #6fffe655;border-radius:7px;padding:7px 11px;font-size:10px;letter-spacing:.08em}.boost-readout.hidden{display:none}
.option-control{display:grid;grid-template-columns:1fr auto;gap:8px;align-items:center;margin-top:10px;font-size:11px;font-weight:800}.option-control input[type=range]{grid-column:1/2;width:100%}.option-control output{grid-column:2}.option-control select{min-width:145px;background:#061a20;color:#e9fff9;border:1px solid #527e79;border-radius:5px;padding:8px}.option-toggle{display:flex;align-items:center;gap:9px;margin-top:9px;font-size:11px;font-weight:800}.option-toggle input{width:17px;height:17px;accent-color:#6fffe6}
.mod-lab{display:grid;grid-template-columns:minmax(270px,.8fr) minmax(360px,1.2fr);gap:18px}.jetpack-rig{position:relative;min-height:430px;border:1px solid #6fffe64a;background:radial-gradient(circle at 50% 40%,#17434d77,#041117 68%);border-radius:12px;overflow:hidden}.jetpack-model{position:absolute;left:50%;top:50%;width:180px;height:280px;transform:translate(-50%,-50%)}.jetpack-body{position:absolute;left:50%;top:40px;width:94px;height:160px;transform:translateX(-50%);border:2px solid #8beee0;background:linear-gradient(135deg,#294c53,#0a2026);clip-path:polygon(15% 0,85% 0,100% 18%,88% 100%,12% 100%,0 18%);box-shadow:0 0 30px #52f7dd33 inset}.jetpack-tank{position:absolute;top:66px;width:42px;height:138px;border:2px solid #7cb8bd;background:linear-gradient(90deg,#10272c,#49666b,#10272c);border-radius:18px}.jetpack-tank.left{left:0}.jetpack-tank.right{right:0}.jetpack-nozzle{position:absolute;bottom:18px;width:48px;height:58px;border:2px solid #d5a462;background:linear-gradient(#263238,#0d1214);clip-path:polygon(10% 0,90% 0,100% 100%,0 100%)}.jetpack-nozzle.left{left:12px}.jetpack-nozzle.right{right:12px}.jetpack-flame{position:absolute;bottom:-34px;width:26px;height:58px;background:linear-gradient(#fff1a5,#58e7ff 35%,transparent);clip-path:polygon(50% 100%,0 0,100% 0);filter:drop-shadow(0 0 12px #56e8ff);opacity:.7}.jetpack-flame.left{left:23px}.jetpack-flame.right{right:23px}.rig-slot{position:absolute;width:132px;min-height:56px;border:1px dashed var(--slot-color,#6fffe6);background:#031318df;border-radius:8px;padding:7px;text-align:left;color:#eafff9;cursor:pointer}.rig-slot b{display:block;font-size:10px;color:var(--slot-color,#6fffe6)}.rig-slot small{display:block;margin-top:3px;font-size:9px;color:#b6cbc7}.rig-slot.s0{left:8px;top:18px}.rig-slot.s1{right:8px;top:18px}.rig-slot.s2{left:8px;bottom:18px}.rig-slot.s3{right:8px;bottom:18px}.mod-panel{border:1px solid #6fffe638;background:#041419aa;border-radius:12px;padding:14px}.mod-targets,.module-list{display:flex;flex-wrap:wrap;gap:7px}.mod-targets button,.module-card{border:1px solid #466c69;background:#071b20;color:#dffcf5;border-radius:7px;padding:8px 10px}.mod-targets button.active{border-color:#6fffe6;box-shadow:0 0 14px #6fffe633}.module-card{display:block;width:100%;text-align:left;margin-top:7px;border-left:4px solid var(--module-color,#6fffe6)}.module-card.selected{box-shadow:0 0 0 2px var(--module-color,#6fffe6) inset}.module-card strong,.module-card small{display:block}.module-card small{margin-top:3px;color:#b8cfcb}.mod-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(110px,1fr));gap:7px;margin:12px 0}.mod-summary span{border:1px solid #3f6765;background:#06181d;padding:7px;border-radius:6px;font-size:10px}.fiber-readability{filter:drop-shadow(0 0 6px #b8ff7a)}
@media(max-width:900px){.mod-lab{grid-template-columns:1fr}.jetpack-rig{min-height:360px}.equip-inspect{top:14%}.ground-inspect{bottom:23%}}

@media (max-width: 880px){
  .mod-lab{grid-template-columns:1fr}.jetpack-rig{min-height:390px}.mod-targets{max-height:120px;overflow:auto}.equip-inspect,.ground-inspect{right:10px;width:min(350px,calc(100vw - 20px))}
}
@media (max-height: 700px){.equip-inspect{top:12%}.ground-inspect{bottom:13%}.jetpack-rig{min-height:330px}}


/* v0.8.1e save quota hotfix */
.controls{color:#d8ebe8;font-size:.68rem;line-height:1.25;background:rgba(2,15,20,.9);border-color:rgba(155,255,238,.24);gap:.72rem;padding:.62rem .9rem;text-shadow:0 1px 2px #000;overflow-x:auto;scrollbar-width:none}.controls::-webkit-scrollbar{display:none}.controls kbd{color:#fff;background:rgba(255,255,255,.13);font-size:.65rem}
.inventory-strip{max-width:calc(100vw - 36px);overflow-x:auto;scrollbar-width:none}.inventory-strip::-webkit-scrollbar{display:none}.inventory-strip .slot{min-width:78px}.inventory-strip .slot .label{max-width:108px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.inventory-workspace{grid-template-columns:minmax(0,1.28fr) minmax(300px,.72fr);align-items:start}.inventory-list{overflow:auto}.inventory-details{overflow:hidden!important;max-height:none!important;position:sticky;top:0;align-self:start}.inventory-detail-hero{max-height:none;overflow:visible}.inventory-detail-actions{position:sticky;bottom:0;background:linear-gradient(180deg,rgba(3,18,24,.18),rgba(3,18,24,.98) 25%);padding-top:.55rem;grid-template-columns:repeat(2,minmax(0,1fr))}.inventory-detail-actions button{min-height:42px}.inventory-entry{padding:.52rem .6rem;margin-bottom:.32rem}.inventory-entry small{font-size:.66rem;line-height:1.28}.inventory-entry h4{font-size:.86rem}.inventory-filters{gap:.35rem}.inventory-filters button{padding:.45rem .58rem;font-size:.58rem}
body.fishing-active .base-panel{display:none!important}.fishing{z-index:22}
@media(max-width:980px){.inventory-workspace{grid-template-columns:1fr}.inventory-details{position:relative}.inventory-detail-actions{position:relative}.inventory-strip .slot{min-width:68px}}

/* v0.8.1e MP 0.1.1 — shared harvesting, controller, and touch foundation */
.mp-lobby-card { margin-top: 1rem; padding: .85rem; border: 1px solid rgba(111,255,230,.2); border-radius: 13px; background: rgba(2,15,20,.66); text-align: left; }
.mp-lobby-heading { display:flex; align-items:center; justify-content:space-between; gap:1rem; margin-bottom:.65rem; }
.mp-lobby-heading span,.mp-lobby-heading strong { display:block; }
.mp-lobby-heading span { color:var(--cyan); font-size:.62rem; font-weight:900; letter-spacing:.13em; }
.mp-lobby-heading strong { margin-top:.12rem; font-size:.75rem; letter-spacing:.06em; }
.mp-lobby-heading em { width:18px; height:18px; flex:none; border-radius:50%; background:var(--player-color); box-shadow:0 0 18px var(--player-color); }
.mp-lobby-fields { display:grid; grid-template-columns:1.2fr .8fr auto; gap:.55rem; align-items:end; }
.mp-lobby-fields label { color:#8fa9a6; font-size:.55rem; font-weight:900; letter-spacing:.1em; }
.mp-lobby-fields input { width:100%; margin-top:.25rem; min-height:38px; padding:.5rem .65rem; border-radius:8px; border:1px solid rgba(255,255,255,.12); color:#effffc; background:rgba(0,0,0,.3); text-transform:uppercase; }
.mp-lobby-fields button { min-height:38px; }
.mp-lobby-status { display:flex; gap:.55rem; align-items:center; margin-top:.55rem; padding:.46rem .58rem; border-radius:8px; background:rgba(255,255,255,.035); font-size:.61rem; }
.mp-lobby-status b { color:var(--cyan); letter-spacing:.08em; }
.mp-lobby-status span { color:#9ab1ae; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mp-lobby-status[data-state="OFFLINE"],.mp-lobby-status[data-state="RECONNECTING"] { border:1px solid rgba(255,95,114,.28); }
.mp-lobby-status[data-state="OFFLINE"] b,.mp-lobby-status[data-state="RECONNECTING"] b { color:#ff8f9e; }
.mp-lobby-status[data-state="CONNECTED"] { border:1px solid rgba(112,232,153,.28); }
.mp-lobby-status[data-state="CONNECTED"] b { color:var(--good); }

.mp-roster { position:absolute; right:max(16px,var(--safe-right)); top:max(72px,calc(var(--safe-top) + 62px)); z-index:8; width:min(290px,calc(100vw - 32px)); padding:.7rem; border-radius:12px; pointer-events:none; }
.mp-roster-head { display:flex; justify-content:space-between; align-items:center; gap:.5rem; padding-bottom:.45rem; border-bottom:1px solid rgba(255,255,255,.07); }
.mp-roster-head span { color:#8fa9a6; font-size:.57rem; letter-spacing:.1em; }
.mp-roster-head b { color:var(--cyan); }
.mp-roster-head small { color:#78908d; font-size:.51rem; max-width:155px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mp-roster-head small[data-state="CONNECTED"] { color:var(--good); }
.mp-roster-head small[data-state="RECONNECTING"],.mp-roster-head small[data-state="OFFLINE"] { color:#ff8f9e; }
.mp-player-list { display:grid; gap:.35rem; margin-top:.45rem; max-height:170px; overflow:hidden; }
.mp-player-row { display:grid; grid-template-columns:10px minmax(0,1fr); gap:.48rem; align-items:center; padding:.32rem .4rem; border-radius:7px; background:rgba(255,255,255,.028); }
.mp-player-row.local { background:rgba(111,255,230,.055); }
.mp-player-row i { width:8px; height:24px; border-radius:5px; background:var(--player-color); box-shadow:0 0 12px var(--player-color); }
.mp-player-row b,.mp-player-row small { display:block; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.mp-player-row b { color:#effffc; font-size:.59rem; }
.mp-player-row small { margin-top:.08rem; color:#7f9996; font-size:.5rem; }

.mp-input-badge { position:absolute; right:max(16px,var(--safe-right)); bottom:calc(max(10px,var(--safe-bottom)) + 52px); z-index:9; padding:.38rem .55rem; border-radius:7px; border:1px solid rgba(255,255,255,.1); color:#809794; background:rgba(3,17,21,.78); font-size:.53rem; font-weight:900; letter-spacing:.06em; pointer-events:none; }
.mp-input-badge.connected { color:var(--cyan); border-color:rgba(111,255,230,.25); }

.touch-toggle { position:absolute; right:max(12px,var(--safe-right)); bottom:calc(max(12px,var(--safe-bottom)) + 84px); z-index:31; min-width:58px; min-height:38px; padding:.35rem .55rem; border-radius:9px; border:1px solid rgba(111,255,230,.25); color:var(--cyan); background:rgba(3,17,21,.82); font-size:.58rem; font-weight:900; }
.touch-controls { position:absolute; inset:0; z-index:30; pointer-events:none; touch-action:none; user-select:none; -webkit-user-select:none; }
.touch-controls.hidden { display:none!important; }
.touch-look { position:absolute; left:42%; right:0; top:0; bottom:0; pointer-events:auto; touch-action:none; }
.touch-stick { position:absolute; left:max(18px,var(--safe-left)); bottom:calc(max(18px,var(--safe-bottom)) + 16px); width:132px; height:132px; border-radius:50%; border:2px solid rgba(111,255,230,.26); background:radial-gradient(circle,rgba(111,255,230,.07),rgba(3,17,21,.38)); box-shadow:inset 0 0 30px rgba(0,0,0,.28); pointer-events:auto; touch-action:none; }
.touch-stick::after { content:"MOVE"; position:absolute; left:0; right:0; top:54px; text-align:center; color:rgba(221,255,249,.38); font-size:.52rem; font-weight:900; letter-spacing:.12em; }
.touch-stick span { position:absolute; left:41px; top:41px; width:50px; height:50px; border-radius:50%; border:1px solid rgba(111,255,230,.55); background:rgba(111,255,230,.18); box-shadow:0 0 20px rgba(111,255,230,.18); transition:transform .035s linear; }
.touch-actions { position:absolute; inset:0; pointer-events:none; }
.touch-actions button { position:absolute; display:grid; place-items:center; min-width:58px; min-height:58px; padding:.35rem; border-radius:50%; border:1px solid rgba(255,255,255,.2); color:#effffc; background:rgba(3,17,21,.68); backdrop-filter:blur(5px); font-size:.61rem; font-weight:900; pointer-events:auto; touch-action:none; }
.touch-actions button:active { transform:scale(.94); background:rgba(111,255,230,.23); border-color:var(--cyan); }
.touch-fire { right:max(24px,var(--safe-right)); bottom:calc(max(25px,var(--safe-bottom)) + 18px); width:82px; height:82px; border-color:rgba(255,100,110,.55)!important; background:rgba(80,8,16,.62)!important; }
.touch-aim { right:calc(max(24px,var(--safe-right)) + 88px); bottom:calc(max(25px,var(--safe-bottom)) + 54px); }
.touch-jump { right:calc(max(24px,var(--safe-right)) + 20px); bottom:calc(max(25px,var(--safe-bottom)) + 108px); }
.touch-use { right:calc(max(24px,var(--safe-right)) + 98px); bottom:calc(max(25px,var(--safe-bottom)) + 126px); }
.touch-sprint { left:calc(max(18px,var(--safe-left)) + 38px); bottom:calc(max(18px,var(--safe-bottom)) + 156px); min-width:54px!important; min-height:54px!important; }
.touch-menu { right:max(16px,var(--safe-right)); top:max(14px,var(--safe-top)); min-width:48px!important; min-height:48px!important; }
.touch-small[data-touch-action="grenade"] { right:calc(max(24px,var(--safe-right)) + 168px); bottom:calc(max(25px,var(--safe-bottom)) + 42px); min-width:50px!important; min-height:50px!important; }
.touch-small[data-touch-action="nextEquip"] { right:calc(max(24px,var(--safe-right)) + 174px); bottom:calc(max(25px,var(--safe-bottom)) + 103px); min-width:54px!important; min-height:54px!important; border-radius:14px!important; }
body.ui-input-locked .touch-controls { opacity:.16; pointer-events:none; }
body.ui-input-locked .touch-controls * { pointer-events:none!important; }
#hud.hidden ~ .touch-controls,#hud.hidden ~ .touch-toggle,#hud.hidden ~ .mp-input-badge { display:none; }

@media (max-width: 820px) {
  .mp-lobby-fields { grid-template-columns:1fr 1fr; }
  .mp-lobby-fields button { grid-column:1/-1; }
  .mp-roster { top:112px; right:10px; width:min(250px,62vw); padding:.52rem; }
  .mp-player-list { max-height:105px; }
  .mp-input-badge { display:none; }
  .mission { max-height:94px; }
}
@media (max-width: 540px) {
  .mp-lobby-fields { grid-template-columns:1fr; }
  .mp-lobby-fields button { grid-column:auto; }
  .touch-stick { width:118px;height:118px; }
  .touch-stick span { left:36px;top:36px;width:46px;height:46px; }
  .touch-stick::after { top:48px; }
  .mp-roster { width:min(220px,68vw); }
}
@media (pointer:fine) {
  .touch-toggle { opacity:.72; }
}

/* v0.8.1e MP 0.2.0 — unobtrusive crew roster */
.mp-roster {
  position:fixed!important;
  left:max(14px,var(--safe-left))!important;
  right:auto!important;
  top:auto!important;
  bottom:calc(max(12px,var(--safe-bottom)) + 94px)!important;
  z-index:18!important;
  width:min(280px,calc(100vw - 28px))!important;
  max-height:min(42vh,340px);
  overflow:hidden;
  padding:.42rem!important;
  pointer-events:auto!important;
  border:1px solid rgba(111,255,230,.17);
  background:rgba(2,15,20,.78);
  backdrop-filter:blur(8px);
}
.mp-roster-toggle {
  display:flex;
  width:100%;
  align-items:center;
  justify-content:space-between;
  gap:.6rem;
  min-height:34px;
  padding:.35rem .48rem;
  border:0;
  border-radius:8px;
  color:#dffcf7;
  background:rgba(255,255,255,.035);
  font-size:.58rem;
  font-weight:900;
  letter-spacing:.07em;
  cursor:pointer;
}
.mp-roster-toggle span { color:var(--cyan); }
.mp-roster-toggle small { color:#829b98; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.mp-roster-toggle::after { content:'▾'; color:#91aaa7; }
.mp-roster.collapsed .mp-roster-toggle::after { content:'▸'; }
.mp-roster .mp-player-list { max-height:250px; overflow:auto; scrollbar-width:thin; }
.mp-roster.collapsed .mp-player-list { display:none; }
.mp-player-row.host b::after { content:' HOST'; margin-left:.34rem; color:#ffd56f; font-size:.47rem; letter-spacing:.08em; }
@media (max-width:820px) {
  .mp-roster {
    left:max(8px,var(--safe-left))!important;
    bottom:calc(max(8px,var(--safe-bottom)) + 76px)!important;
    width:min(230px,64vw)!important;
    max-height:34vh;
  }
  .mp-roster:not(.collapsed) .mp-player-list { max-height:122px; }
}
@media (max-width:540px) {
  .mp-roster { width:min(210px,62vw)!important; }
  .mp-roster-toggle { min-height:31px; font-size:.52rem; }
}

/* v0.8.1e MP 0.2.1 — crew roster occupies the lane between objective and vitals */
.mp-roster {
  left:max(16px,var(--safe-left))!important;
  right:auto!important;
  top:calc(max(16px,var(--safe-top)) + min(31vh,250px) + 16px)!important;
  bottom:auto!important;
  width:min(260px,calc(100vw - 32px))!important;
  max-height:calc(100vh - min(31vh,250px) - 190px)!important;
  transform:none!important;
}
@media (max-width:820px) {
  .mp-roster {
    left:auto!important;
    right:max(8px,var(--safe-right))!important;
    top:112px!important;
    bottom:auto!important;
    width:min(220px,58vw)!important;
    max-height:30vh!important;
  }
  .mp-roster:not(.collapsed) .mp-player-list { max-height:112px!important; }
  .toast-stack { top:158px!important; }
}
@media (max-width:540px) {
  .mp-roster { width:min(205px,55vw)!important; }
}


/* v0.8.1e MP 0.2.5 — controlled directors and handheld readiness */
:root { --ui-scale:1; font-size:clamp(calc(12px * var(--ui-scale)),calc((.48vw + .45vh) * var(--ui-scale)),calc(16px * var(--ui-scale))); }
html,body { overscroll-behavior:none; }
.director-diagnostics-panel { position:fixed; right:max(14px,var(--safe-right)); bottom:calc(max(14px,var(--safe-bottom)) + 80px); z-index:19; max-width:min(540px,calc(100vw - 28px)); padding:.55rem .7rem; white-space:pre-line; pointer-events:none; color:#b9fff2; background:rgba(2,14,18,.83); border:1px solid rgba(111,255,230,.22); border-radius:9px; font:700 .55rem/1.45 ui-monospace,SFMono-Regular,Consolas,monospace; letter-spacing:.025em; }
body.controller-input button:focus-visible,body.controller-input input:focus-visible,body.controller-input select:focus-visible,body.controller-input [tabindex]:focus-visible { outline:3px solid var(--cyan)!important; outline-offset:3px; box-shadow:0 0 0 5px rgba(111,255,230,.13)!important; }
body.handheld-hud .controls { max-width:calc(100vw - 20px); overflow-x:auto; scrollbar-width:none; }
body.handheld-hud .mission { max-height:25vh; }
body.handheld-hud .inventory-strip { transform:scale(.92); transform-origin:bottom center; }
body.handheld-hud .mp-roster { max-height:25vh!important; }
@media (max-width:1280px), (max-height:820px) {
  body.handheld-hud .topbar { padding:.45rem .65rem; }
  body.handheld-hud .mission { width:min(300px,42vw); }
  body.handheld-hud .vitals { width:min(280px,40vw); }
  body.handheld-hud .weather { font-size:.56rem; }
  body.handheld-hud .controls span:nth-child(n+9) { display:none; }
  .director-diagnostics-panel { bottom:calc(max(8px,var(--safe-bottom)) + 62px); font-size:.5rem; }
}
@media (max-width:700px) {
  body.handheld-hud .mission { width:min(250px,54vw); }
  body.handheld-hud .vitals { width:min(240px,50vw); }
  .director-diagnostics-panel { left:max(8px,var(--safe-left)); right:max(8px,var(--safe-right)); max-width:none; }
}
