/* ED Status v2 theme - borrows the in-game trader screen grammar:
   white section headers with an orange rule, one solid-orange "selected" state, warm dark tiles, translucent panels. */
:root {
  --hud:#ff7100; --hud-hi:#ff8f33; --hud-dim:#b85300; --hud-deep:#552a07; --hud-bg:#321d0b;
  --tile:#2a2522; --tile-hi:#3e332d; --bg:#0b0b0b; --panel:rgba(14,12,10,.82); --line:#4a2a0a;
  --hdr:#f4f4f2; --text:#ffb066; --muted:#b06a2e; --friend:#33c5ff; --hostile:#ff3333; --good:#47eb94; --warn:#ffc233;
  --display:"Michroma","Orbitron","Eurostile","Bank Gothic","Bahnschrift","Segoe UI",Arial,sans-serif;
  --body:"Sintony","Segoe UI",Arial,sans-serif;
  --fs:13px;
}
* { box-sizing:border-box; }
html, body { margin:0; background:var(--bg); color:var(--text); font-family:var(--body); font-size:var(--fs); font-variant-numeric:tabular-nums; }
body { padding:8px 14px 18px; background:
  radial-gradient(1200px 600px at 20% -10%, rgba(255,113,0,.10), transparent 60%),
  radial-gradient(900px 500px at 90% 110%, rgba(51,197,255,.06), transparent 60%),
  var(--bg); min-height:100vh; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; z-index:0;
  background:repeating-linear-gradient(0deg, rgba(255,255,255,.025) 0 1px, transparent 1px 3px); opacity:.6; }
body > * { position:relative; z-index:1; }
a { color:var(--friend); text-decoration:none; }
a:hover { color:#7fdcff; text-decoration:underline; }

/* ---------------- header */
header { display:flex; flex-wrap:wrap; align-items:center; gap:8px 20px; padding:4px 0 8px; margin-bottom:10px; border-bottom:2px solid var(--hud); }
header h1 { font-family:var(--display); font-size:17px; letter-spacing:3px; text-transform:uppercase; color:var(--hdr); margin:0; font-weight:normal; }
header h1 a { color:var(--hdr); }
header h1 .muted { font-family:var(--body); font-size:11px; letter-spacing:1px; color:var(--muted); }
header .kv { color:var(--muted); font-size:11px; letter-spacing:1px; text-transform:uppercase; }
header .kv b { color:var(--text); font-weight:normal; }
header .right { margin-left:auto; display:flex; gap:8px; align-items:center; }
header .right a.kv { padding:4px 2px; border-bottom:2px solid transparent; }
header .right a.kv:hover { color:var(--hud); text-decoration:none; border-bottom-color:var(--hud); }
nav.crumbs { font-family:var(--display); font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--muted); margin:-4px 0 10px; }
nav.crumbs a { color:var(--hud); }
button { background:var(--hud); color:#000; border:0; padding:6px 12px; font:inherit; font-family:var(--display); font-size:10px; letter-spacing:2px; text-transform:uppercase; cursor:pointer; }
button:hover { background:var(--hud-hi); }
button.secondary { background:transparent; color:var(--hud); border:1px solid var(--hud); }
button.secondary:hover { background:var(--hud-bg); }
button:disabled { opacity:.4; cursor:default; }
.live { display:inline-block; width:9px; height:9px; border-radius:50%; background:#444; margin-right:6px; vertical-align:middle; }
.live.on { background:var(--good); box-shadow:0 0 8px var(--good); }

/* ---------------- grid + panels */
.grid { display:grid; gap:12px; align-items:start; }
.grid.main { grid-template-columns:repeat(12, 1fr); }
.c3 { grid-column:span 3; } .c4 { grid-column:span 4; } .c5 { grid-column:span 5; } .c6 { grid-column:span 6; } .c7 { grid-column:span 7; } .c8 { grid-column:span 8; } .c12 { grid-column:span 12; }
@media (max-width:1300px) { .c3,.c4,.c5 { grid-column:span 6; } .c7,.c8 { grid-column:span 12; } }
@media (max-width:800px) { .grid.main > * { grid-column:span 12; } }
.panel { background:var(--panel); border:1px solid rgba(255,113,0,.25); backdrop-filter:blur(6px); position:relative;
  clip-path:polygon(0 0, calc(100% - 14px) 0, 100% 14px, 100% 100%, 14px 100%, 0 calc(100% - 14px)); }
.panel h2 { margin:0; padding:8px 12px 6px; font-family:var(--display); font-size:12px; letter-spacing:3px; text-transform:uppercase; color:var(--hdr); font-weight:normal;
  display:flex; justify-content:space-between; align-items:center; gap:10px; position:relative; }
.panel h2::after { content:""; position:absolute; left:12px; right:12px; bottom:0; height:2px; background:linear-gradient(90deg, var(--hud) 0, var(--hud) 70%, transparent); }
.panel h2 small { font-family:var(--body); font-weight:normal; letter-spacing:0; text-transform:none; color:var(--muted); font-size:11px; }
.panel h2 a { color:var(--hud); text-decoration:none; font-family:var(--body); font-weight:normal; text-transform:none; letter-spacing:0; font-size:11px; }
.panel h2 a:hover { color:var(--hud-hi); }
.body { padding:10px 12px 12px; overflow-x:auto; }
h3 { font-family:var(--display); color:var(--hdr); font-size:11px; letter-spacing:2px; text-transform:uppercase; margin:12px 0 6px; font-weight:normal; position:relative; padding-bottom:4px; }
h3::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg, var(--hud) 0, var(--hud) 55%, transparent); }
p.note { color:var(--muted); font-size:11px; margin:6px 0 0; }

/* ---------------- tables */
table { width:100%; border-collapse:collapse; }
th { text-align:left; color:var(--muted); font-weight:normal; font-size:10px; letter-spacing:1px; text-transform:uppercase; padding:3px 6px; border-bottom:1px solid var(--line); }
td { padding:4px 6px; border-bottom:1px solid rgba(255,113,0,.12); vertical-align:top; }
tr:hover td { background:var(--hud-bg); }
td.num, th.num { text-align:right; white-space:nowrap; }
tr.hl td { color:var(--hud); }

/* ---------------- tiles (stats) */
.tiles { display:grid; grid-template-columns:repeat(auto-fit, minmax(112px, 1fr)); gap:8px; }
.tile { background:var(--tile); border:1px solid rgba(255,113,0,.18); padding:7px 9px 8px; min-width:0; position:relative;
  background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.015) 0 2px, transparent 2px 6px); }
.tile.span2 { grid-column:span 2; }
.tile .l { color:var(--muted); font-size:9.5px; letter-spacing:1.5px; text-transform:uppercase; }
.tile .v { font-family:var(--display); font-size:17px; color:var(--hdr); margin-top:3px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.tile .v.wrap { white-space:normal; font-size:12px; font-family:var(--body); }
.tile .v small { font-family:var(--body); font-size:10px; color:var(--muted); }
.tile .v .ok { color:var(--friend); } .tile .v .short { color:var(--hostile); }

/* ---------------- status chip strip */
.chips { display:flex; flex-wrap:wrap; gap:5px; margin-top:8px; }
.chip { font-family:var(--display); font-size:9px; letter-spacing:1.5px; text-transform:uppercase; padding:3px 8px; border:1px solid var(--hud-dim); color:var(--muted); display:inline-flex; align-items:center; gap:5px; }
.chip svg { width:11px; height:11px; }
.chip.on { background:var(--hud-bg); color:var(--text); border-color:var(--hud); }
.chip.alert { background:var(--hostile); color:#000; border-color:var(--hostile); animation:pulse 1s ease-in-out 8; }
.chip.good { border-color:var(--friend); color:var(--friend); }
@keyframes pulse { 50% { opacity:.55; } }
.stale { opacity:.45; }

/* ---------------- progress */
.bar { height:7px; background:#1a1512; border:1px solid var(--line); position:relative; }
.bar > i { position:absolute; left:0; top:0; bottom:0; background:var(--hud); }
.bar > i.ok { background:var(--friend); }
.seg { display:inline-flex; gap:2px; vertical-align:middle; }
.seg i { width:9px; height:9px; border:1px solid var(--hud-dim); display:inline-block; }
.seg i.done { background:var(--hud); border-color:var(--hud); } .seg i.part { background:linear-gradient(90deg, var(--hud) 50%, transparent 50%); }
.seg.all i.done { background:var(--friend); border-color:var(--friend); }
.next { background:var(--hud); color:#000; padding:3px 8px; font-size:11px; display:inline-block; margin-top:3px; }
.next b { font-family:var(--display); font-size:9px; letter-spacing:2px; margin-right:6px; }
.gtag { color:var(--muted); font-size:10px; font-weight:normal; letter-spacing:.02em; } html.vr .gtag { font-size:15px; }
.short { color:var(--hostile); } .ok { color:var(--friend); } .muted { color:var(--muted); } .warn { color:var(--hostile); } .good { color:var(--good); }
.prog { display:grid; grid-template-columns:1fr 60px 44px; gap:6px; align-items:center; padding:3px 0; border-bottom:1px solid rgba(255,113,0,.12); }
.prog .n { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.prog .n small { color:var(--muted); }

/* ---------------- build items */
.item { display:grid; grid-template-columns:22px 1fr auto; gap:8px; align-items:center; padding:4px 0; border-bottom:1px solid rgba(255,113,0,.12); }
.item .hx { width:16px; height:18px; }
.item .st { font-size:11px; color:var(--muted); white-space:nowrap; }
.item.done span:nth-child(2) { color:var(--muted); }

/* ---------------- materials: tile grid */
.mtoggle { display:flex; gap:6px; align-items:center; font-size:11px; color:var(--muted); }
.mtoggle button { padding:3px 8px; font-size:9px; }
.cols { display:grid; grid-template-columns:repeat(auto-fit, minmax(300px, 1fr)); gap:0 20px; }
.famh { display:flex; align-items:center; gap:10px; cursor:pointer; user-select:none; margin:10px 0 4px; padding-bottom:3px; position:relative; }
.famh::after { content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:linear-gradient(90deg, var(--hud) 0, var(--hud) 60%, transparent); }
.famh .n { font-family:var(--display); font-size:10px; letter-spacing:2px; text-transform:uppercase; color:var(--hdr); }
.famh .counts { color:var(--muted); font-size:11px; letter-spacing:1px; margin-left:auto; }
.famh .counts b { color:var(--text); font-weight:normal; } .famh .counts .short { color:var(--hostile); }
.famh .caret { color:var(--hud); font-size:10px; width:10px; }
.famh.flag .n { color:var(--hud); }
.mgrid { display:grid; grid-template-columns:repeat(5, minmax(0, 1fr)); gap:6px; margin-bottom:6px; }
.mtile { position:relative; background:var(--tile); border:1px solid rgba(255,113,0,.16); padding:6px 4px 6px; text-align:center; cursor:pointer; min-height:104px;
  display:flex; flex-direction:column; align-items:center; justify-content:flex-start; gap:2px; outline:none;
  background-image:repeating-linear-gradient(135deg, rgba(255,255,255,.015) 0 2px, transparent 2px 6px); }
.mtile:hover, .mtile:focus-visible { background-color:var(--tile-hi); border-color:var(--hud-dim); }
.mtile.sel { background:var(--hud); border-color:var(--hud); color:#000; background-image:none; }
.mtile.sel .num, .mtile.sel .nm, .mtile.sel .cap { color:#000; }
.mtile.sel .hex .fill { fill:#000; opacity:.25; } .mtile.sel .hex .outline, .mtile.sel .hex .blade { stroke:#000; fill:#000; }
.mtile .hex { width:34px; height:38px; }
.mtile .hex .outline { fill:none; stroke:var(--hud); stroke-width:1.5; }
.mtile .hex .fill { fill:var(--hud); opacity:.9; }
.mtile .hex .blade { fill:var(--hud); stroke:none; }
.mtile .hex .tick { stroke:var(--hdr); stroke-width:1.2; }
.mtile .num { font-family:var(--display); font-size:15px; color:var(--hdr); line-height:1.1; }
.mtile .num.short { color:var(--hostile); } .mtile .num.full { color:var(--hud); }
.mtile .cap { font-size:9.5px; color:var(--muted); letter-spacing:1px; }
.mtile .nm { font-size:9.5px; line-height:1.15; color:var(--text); text-transform:uppercase; letter-spacing:.3px; margin-top:2px; }
.mtile .badge { position:absolute; top:3px; right:4px; font-size:9.5px; font-weight:bold; padding:0 4px; border:1px solid currentColor; line-height:14px; }
.mtile .badge.short { color:var(--hostile); } .mtile .badge.trade { color:var(--friend); } .mtile .badge.need { color:var(--hud); }
.mtile .ratio { position:absolute; top:3px; left:4px; font-size:9.5px; color:var(--hud); line-height:1; text-align:left; }
.mtile .ratio b { display:block; font-weight:normal; border-top:1px solid var(--hud); }
.mtile.sel .ratio, .mtile.sel .badge { color:#000; border-color:#000; }
/* ladder (compact) */
.fam .n { color:var(--muted); font-size:10px; letter-spacing:1px; text-transform:uppercase; border-bottom:1px solid var(--line); margin:6px 0 2px; }
.mat { display:grid; grid-template-columns:1fr 44px 30px 70px; gap:6px; align-items:center; font-size:12px; padding:1px 0; }
.mat .g { color:var(--muted); font-size:10px; }
.mat .c, .mat .t { text-align:right; } .mat .t { font-size:11px; }
.pills { display:flex; flex-wrap:wrap; gap:4px; margin-top:6px; }
.pill { border:1px solid var(--hud-dim); color:var(--muted); padding:1px 6px; font-size:10px; letter-spacing:1px; text-transform:uppercase; }
.pill.on { border-color:var(--friend); color:var(--friend); } .pill.warn { border-color:var(--hostile); color:var(--hostile); }
select.proj { background:#000; color:var(--hud); border:1px solid var(--hud); font:inherit; font-family:var(--display); font-size:9px; letter-spacing:1px; text-transform:uppercase; padding:2px 4px; }
.panel h2 select.proj { background:#000; }
#setup { border:1px dashed var(--hud); padding:12px; margin-bottom:10px; background:var(--panel); }
#setup p { margin:5px 0; }
.err { color:var(--hostile); }
details summary { cursor:pointer; color:var(--muted); font-size:10px; letter-spacing:1px; text-transform:uppercase; margin:4px 0; }
textarea { width:100%; min-height:120px; background:#000; color:var(--text); border:1px solid var(--line); font:12px monospace; }

/* ---------------- motion */
@media (prefers-reduced-motion: no-preference) {
  #view.enter > * { animation:scanin .28s ease-out both; }
  @keyframes scanin { from { opacity:0; transform:translateY(4px); } to { opacity:1; transform:none; } }
}
/* ---------------- VR mode: bigger, fewer, flatter */
html.vr { --fs:22px; }
html.vr body::before { display:none; }
html.vr .panel { backdrop-filter:none; background:#0e0c0a; clip-path:none; }
html.vr .panel h2 { font-size:18px; } html.vr .panel h2::after, html.vr h3::after { height:3px; }
html.vr .tile .v { font-size:30px; } html.vr .tile .l { font-size:14px; }
html.vr .chip { font-size:14px; padding:6px 12px; }
html.vr .mtile { min-height:170px; } html.vr .mtile .hex { width:56px; height:62px; } html.vr .mtile .num { font-size:26px; } html.vr .mtile .nm, html.vr .mtile .cap { font-size:14px; }
html.vr td, html.vr th { padding:8px 10px; }
html.vr .grid.main > * { grid-column:span 12; }
/* build-item hexagons */
.item .hx .outline { fill:none; stroke:var(--hud-dim); stroke-width:1.5; } .item .hx .fill { fill:var(--hud); opacity:.9; } .item .hx .blade { fill:var(--hud); }
.item.done .hx .outline { stroke:var(--friend); } .item.done .hx .fill { fill:var(--friend); } .item.done .hx .blade { fill:#000; }
.item.todo .hx .outline { stroke:var(--hostile); } .item.todo .hx .blade { fill:var(--hud-dim); }
.item.part .hx .outline { stroke:var(--hud); }

/* ---- plan editor */
.pf, .jf { display:flex; flex-wrap:wrap; gap:8px 12px; align-items:flex-end; }
.pf label, .jf label { display:flex; flex-direction:column; gap:3px; font-size:9.5px; letter-spacing:1.5px; text-transform:uppercase; color:var(--muted); min-width:120px; }
.pf label.wide, .jf label.wide { flex:1 1 260px; }
.jf label small { text-transform:none; letter-spacing:0; }
.pf input, .jf input, .jf select { background:#000; color:var(--text); border:1px solid var(--line); font:inherit; font-size:12px; padding:4px 6px; min-width:0; }
.jf select { max-width:360px; }
.jf input[type=number] { width:64px; }
.jf label.chk { flex-direction:row; align-items:center; gap:6px; min-width:0; }
.pf input:focus, .jf input:focus, .jf select:focus, textarea:focus { outline:1px solid var(--hud); }
.jobs { margin-top:10px; }
.job { border:1px solid var(--line); padding:6px 8px 8px; margin:6px 0; background:rgba(0,0,0,.25); }
.job .jh { display:flex; align-items:center; gap:10px; margin-bottom:6px; }
.job .idx { font-family:var(--display); font-size:11px; color:var(--hud); min-width:18px; }
.job .jh .st { font-size:11px; color:var(--muted); flex:1; }
.tools { display:inline-flex; gap:4px; align-items:center; flex-wrap:wrap; }
.tools button { padding:3px 7px; font-size:9px; }
button.danger { border-color:var(--hostile); color:var(--hostile); }
button.danger:hover { background:rgba(255,51,51,.15); }
.slef { margin-top:10px; border:1px solid var(--line); padding:8px; }
p.note.short { color:var(--hostile); }
.jf label > span { display:block; }
.tile.click { cursor:pointer; } .tile.click:hover { border-color:var(--hud); } .tile.sel { border-color:var(--hud); box-shadow:inset 0 0 0 1px var(--hud); }
.panel h2 a.go { display:inline-block; border:1px solid var(--hud); padding:2px 9px; margin-left:8px; font-family:var(--display); font-size:9px; letter-spacing:1.5px; text-transform:uppercase; color:var(--hud); }
.panel h2 a.go:hover { background:var(--hud); color:#000; }
.shipimg { float:right; max-width:260px; max-height:150px; margin:0 0 8px 12px; object-fit:contain; opacity:.95; }
.pin { font-family:var(--display); font-size:8px; letter-spacing:1px; text-transform:uppercase; border:1px solid var(--friend); color:var(--friend); padding:1px 5px; margin-left:6px; vertical-align:middle; }
.cols label.item input { margin-right:6px; }

.tabs { display:flex; gap:4px; margin:10px 0 4px; border-bottom:1px solid var(--line); }
.tabs a { font-family:var(--display); font-size:10px; letter-spacing:2px; text-transform:uppercase; padding:6px 14px; color:var(--muted); border:1px solid transparent; border-bottom:none; }
.tabs a.on { color:var(--hud); border-color:var(--line); background:rgba(0,0,0,.35); }

/* ---- plan editor: Outfitting-style Build tab (js/outfit.js) */
.osum { margin:8px 0 4px; }
.obar { display:flex; flex-wrap:wrap; gap:6px 18px; align-items:center; margin:6px 0 2px; font-size:11px; }
.obar label.chk { display:inline-flex; gap:6px; align-items:center; color:var(--text); }
.key { display:inline-block; width:10px; height:10px; border:1px solid var(--line); vertical-align:-1px; margin:0 3px 0 8px; }
.key.k-none { background:transparent; } .key.k-todo { border-left:3px solid var(--hud); } .key.k-part { border-left:3px solid var(--hud); background:var(--hud-bg); } .key.k-done { border-left:3px solid var(--friend); }
.obuild { display:grid; grid-template-columns:minmax(0, 1fr) 360px; gap:14px; align-items:start; }
.outfit { display:grid; grid-template-columns:repeat(auto-fit, minmax(290px, 1fr)); gap:0 14px; align-items:start; }
.osec h3 { margin-top:10px; }
.otile { display:grid; grid-template-columns:30px 1fr; border:1px solid var(--line); border-left:3px solid transparent; margin:0 0 4px; background:rgba(0,0,0,.25); cursor:pointer; outline:none; }
.otile:hover, .otile:focus-visible { border-color:var(--hud-dim); background:var(--hud-bg); }
.otile .sz { display:flex; flex-direction:column; align-items:center; justify-content:center; font-family:var(--display); font-size:13px; color:var(--hdr); border-right:1px solid var(--line); line-height:1; }
.otile .sz small { font-size:7px; letter-spacing:1px; color:var(--muted); margin-top:3px; }
.otile .om { min-width:0; }
.otile .r { display:flex; justify-content:space-between; gap:10px; padding:2px 8px; font-size:12px; min-height:19px; align-items:center; }
.otile .r > span { white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.otile .r.m { justify-content:center; color:var(--hdr); border-bottom:1px solid var(--line-n, rgba(255,255,255,.06)); text-align:center; }
.otile .r.e { color:var(--text); }
.otile .r.p { color:var(--hud); background:var(--hud-bg); font-weight:600; }
.otile .r.s > span { white-space:normal; }
.otile .r.s { display:block; font-size:10.5px; color:var(--muted); white-space:normal; padding-top:1px; padding-bottom:3px; }
.otile .r.s .warn { color:var(--warn, #ffc233); } .otile .r.s .short { color:var(--hostile); } .otile .r.s .ok { color:var(--friend); }
.otile .grp { font-size:9px; letter-spacing:1px; text-transform:uppercase; border:1px solid currentColor; padding:0 4px; margin-left:4px; font-weight:normal; }
.otile.none .r.m, .otile.none .r.e { opacity:.62; }
.otile.todo, .otile.part { border-left-color:var(--hud); }
.otile.done { border-left-color:var(--friend); } .otile.done .r.p, .otile .r.p.ok { color:var(--friend); background:transparent; font-weight:normal; }
.otile.sel { border-color:var(--hud); box-shadow:inset 0 0 0 1px var(--hud); background:var(--hud-bg); }
.oed { position:sticky; top:8px; border:1px solid var(--hud-dim); background:var(--panel); padding:10px 12px; max-height:calc(100vh - 16px); overflow:auto; }
.oedh { display:flex; justify-content:space-between; align-items:center; gap:8px; font-family:var(--display); font-size:11px; letter-spacing:2px; text-transform:uppercase; color:var(--hdr); padding-bottom:6px; border-bottom:1px solid var(--hud); }
.oedh button { padding:2px 8px; }
.oed .l { display:block; color:var(--muted); font-size:9.5px; letter-spacing:1.5px; text-transform:uppercase; margin-bottom:3px; }
.oed .l small { text-transform:none; letter-spacing:0; }
.oednow { margin:8px 0; color:var(--hdr); }
.oeds { border-top:1px solid var(--line); padding-top:8px; margin-top:8px; }
.oed .jf { flex-direction:column; align-items:stretch; gap:8px; }
.oed .jf label { min-width:0; }
.oed .jf select { max-width:none; width:100%; }
.oed p.note.warn { color:var(--warn, #ffc233); }
.oedst { margin-top:8px; display:grid; gap:4px; font-size:12px; }
.oedst .l { display:inline; margin-right:6px; }
.onote { display:grid; grid-template-columns:22px 1fr auto; gap:8px; align-items:center; padding:3px 0; border-bottom:1px solid rgba(255,113,0,.12); }
.onote .txt { background:#000; color:var(--text); border:1px solid var(--line); font:inherit; font-size:12px; padding:4px 6px; }
.onote.done .txt { color:var(--muted); text-decoration:line-through; }
.onote button { padding:2px 7px; font-size:9px; }
.oafter { grid-template-columns:3fr 2fr; gap:14px; margin-top:10px; }
@media (max-width:1100px) {
  .obuild { grid-template-columns:1fr; }
  .oed { position:fixed; left:8px; right:8px; bottom:8px; top:auto; max-height:55vh; z-index:20; box-shadow:0 -8px 30px rgba(0,0,0,.6); display:none; }
  .obuild.open .oed { display:block; }
  .obuild.open { padding-bottom:56vh; }
  .oafter { grid-template-columns:1fr; }
}
html.vr .obuild { grid-template-columns:1fr; }
html.vr .outfit { grid-template-columns:1fr; }
html.vr .oed { position:fixed; left:8px; right:8px; bottom:8px; top:auto; max-height:50vh; z-index:20; box-shadow:0 -8px 30px rgba(0,0,0,.6); display:none; }
html.vr .obuild.open .oed { display:block; } html.vr .obuild.open { padding-bottom:52vh; }
html.vr .otile { grid-template-columns:52px 1fr; } html.vr .otile .sz { font-size:24px; } html.vr .otile .r { font-size:20px; min-height:30px; } html.vr .otile .r.s { font-size:17px; }
html.vr .oed .l { font-size:14px; } html.vr .oedh { font-size:16px; }
html.vr .oafter { grid-template-columns:1fr; }
html.vr .oed select, html.vr .oed input, html.vr .onote .txt { font-size:19px; padding:6px 8px; } html.vr .oed p.note, html.vr .oedst, html.vr .oed .jf label { font-size:17px; }

/* ---- ship page (js/fitting.js) */
.outfit { grid-template-columns:repeat(auto-fit, minmax(290px, 460px)); }
.shippage { max-width:1900px; }
.shiptiles { grid-template-columns:repeat(auto-fit, minmax(130px, 1fr)); margin-bottom:6px; }
.shiptop { display:grid; grid-template-columns:minmax(0, 3fr) minmax(300px, 2fr); gap:18px; align-items:start; margin-top:4px; }
@media (max-width:1100px) { .shiptop { grid-template-columns:1fr; } }
h3.big { font-size:12px; margin-top:20px; }
h3.big small label.chk { display:inline-flex; gap:5px; align-items:center; text-transform:none; letter-spacing:0; color:var(--text); }
.otile .sz small + small, .otile .sz small:only-child { margin-top:3px; }
.vcard { border:1px solid var(--line); border-left:3px solid var(--hud); padding:5px 9px 6px; margin:0 0 6px; background:rgba(0,0,0,.25); }
.vcard .vh { display:flex; align-items:baseline; gap:8px; flex-wrap:wrap; }
.vcard .idx { font-family:var(--display); font-size:11px; color:var(--hud); min-width:14px; }
.vcard .vs { margin-left:auto; font-size:11px; }
.vcard .vp { font-size:12px; padding:2px 0 0 22px; color:var(--text); }
.fcards { display:grid; grid-template-columns:repeat(auto-fill, minmax(400px, 1fr)); gap:10px; }
.fcard { border:1px solid var(--line); border-left:3px solid var(--hud); background:rgba(0,0,0,.25); padding:7px 10px 9px; min-width:0; }
.fcard.fc-ok { border-left-color:var(--friend); } .fcard.fc-warn { border-left-color:var(--warn, #ffc233); }
.fcard .fh { display:flex; align-items:center; gap:8px; padding-bottom:5px; margin-bottom:4px; border-bottom:1px solid var(--line); }
.fcard .fh .sz { font-family:var(--display); color:var(--hdr); min-width:16px; text-align:center; }
.fcard .fh b { font-weight:normal; color:var(--hdr); font-family:var(--display); font-size:10.5px; letter-spacing:1.5px; text-transform:uppercase; }
.fcard .fh a { margin-left:auto; font-size:11px; }
.fcard .frow { font-size:12px; padding:2px 0; }
.fcard .l { display:inline-block; min-width:62px; color:var(--muted); font-size:9.5px; letter-spacing:1.5px; text-transform:uppercase; }
.fcard .hud { color:var(--hud); }
.fcard .frec { margin:6px 0 4px; padding:5px 8px; background:var(--hud-bg); color:var(--hdr); font-size:12px; }
.fcard .frec.fc-ok { color:var(--friend); } .fcard .frec.fc-warn { color:var(--warn, #ffc233); }
.fcard table.fsrc td { font-size:11.5px; padding:3px 4px; }
.fcard table.fsrc td:last-child { text-align:right; }
html.vr .shiptop { grid-template-columns:1fr; } html.vr .fcards { grid-template-columns:1fr; }
html.vr .fcard .frow, html.vr .fcard .frec, html.vr .vcard .vp { font-size:19px; } html.vr .fcard table.fsrc td { font-size:17px; } html.vr .fcard .l { font-size:14px; }

.fown { margin-top:6px; }
.fown summary { text-transform:none; letter-spacing:0; font-size:11.5px; color:var(--muted); }
.fown .own { display:inline-block; margin-left:6px; padding:1px 7px; border:1px solid var(--line); color:var(--text); }
.fown .own.ok { border-color:var(--friend); color:var(--friend); }
.fown .own b { font-weight:600; }
.fcard .frec button { margin-left:6px; padding:2px 8px; }
html.vr .fown summary { font-size:17px; }

/* ---- ship page fitting table */
.ftable { display:grid; grid-template-columns:repeat(auto-fit, minmax(620px, 1fr)); gap:0 22px; align-items:start; }
.frw { display:grid; grid-template-columns:30px minmax(0, 1fr) minmax(0, 1.15fr) 118px; gap:0 10px; align-items:start; padding:4px 6px; border-bottom:1px solid rgba(255,113,0,.12); border-left:3px solid transparent; cursor:pointer; }
.frw:hover { background:var(--hud-bg); }
.frw.hd { cursor:default; color:var(--muted); font-size:9.5px; letter-spacing:1.5px; text-transform:uppercase; border-bottom:1px solid var(--line); padding-top:0; }
.frw.hd:hover { background:none; }
.frw.todo { border-left-color:var(--hud); } .frw.done { border-left-color:var(--friend); }
.frw .sz { font-family:var(--display); color:var(--hdr); text-align:center; font-size:13px; display:flex; flex-direction:column; align-items:center; padding-top:2px; }
.frw .sz small { font-size:7px; color:var(--muted); letter-spacing:1px; }
.frw .c { min-width:0; }
.frw .m { color:var(--hdr); font-size:12.5px; } .frw .g { font-size:12px; color:var(--text); }
.frw .hud { color:var(--hud); } .frw .m.muted { color:var(--muted); }
.frw .n { font-size:10.5px; color:var(--muted); margin-top:1px; }
.frw .n button { padding:1px 6px; font-size:8.5px; margin-left:4px; }
.frw .warn2 { color:var(--warn, #ffc233); }
.frw .grp { font-size:9px; letter-spacing:1px; text-transform:uppercase; border:1px solid currentColor; padding:0 4px; margin-left:4px; }
.frw.none .m, .frw.none .g { opacity:.75; }
.elsew { position:relative; font-size:11.5px; }
.elsew summary { list-style:none; cursor:pointer; color:var(--friend); text-transform:none; letter-spacing:0; font-size:11.5px; margin:1px 0; white-space:nowrap; }
.elsew summary::-webkit-details-marker { display:none; }
.elsew summary::after { content:" ▾"; color:var(--muted); }
.elsew[open] summary::after { content:" ▴"; }
.elsew .pop { position:absolute; right:0; top:100%; z-index:15; min-width:280px; max-width:420px; background:var(--bg-1, #15110e); border:1px solid var(--hud-dim); padding:6px 9px; box-shadow:0 8px 24px rgba(0,0,0,.6); }
.elsew .pop div { padding:2px 0; white-space:normal; }
@media (max-width:700px) { .frw { grid-template-columns:26px 1fr 1fr; } .frw .el { grid-column:2 / 4; } .frw.hd div:last-child { display:none; } }
html.vr .ftable { grid-template-columns:1fr; } html.vr .frw { grid-template-columns:48px minmax(0,1fr) minmax(0,1.15fr) 200px; } html.vr .frw .m, html.vr .frw .g { font-size:20px; } html.vr .frw .n, html.vr .elsew summary, html.vr .elsew .pop { font-size:17px; } html.vr .frw .sz { font-size:22px; }

/* ---- engineering page: works on + pins */
.engtab td { vertical-align:top; }
.engtab td.works { max-width:420px; }
.engtab .wk { display:inline-block; border:1px solid var(--line); padding:0 5px; margin:0 3px 3px 0; font-size:10.5px; color:var(--muted); white-space:nowrap; }
.engtab .wk b { font-weight:600; } .engtab .wk.g5 { color:var(--text); border-color:var(--hud-dim); }
select.pinsel { background:#000; color:var(--text); border:1px solid var(--line); font:inherit; font-size:11.5px; padding:2px 4px; width:100%; max-width:340px; }
select.pinsel:disabled { color:var(--muted); opacity:.6; }
select.pinsel.on { color:var(--friend); border-color:var(--friend); }
html.vr .engtab .wk { font-size:16px; } html.vr select.pinsel { font-size:18px; max-width:none; }
.engtab .bestfor { font-size:10.5px; color:var(--hud); opacity:.85; margin-top:1px; }
html.vr .engtab .bestfor { font-size:16px; }
.engtab .getin { font-size:10.5px; color:var(--muted); margin-top:1px; max-width:360px; white-space:normal; }
html.vr .engtab .getin { font-size:16px; }
.engfilter .chk { margin-right:10px; }
.engfilter { display:flex; gap:18px; margin:4px 0 6px; font-size:11.5px; } .engfilter label.chk { display:inline-flex; gap:6px; align-items:center; color:var(--text); }
html.vr .engfilter { font-size:17px; }

/* ---- community goals on the home Missions panel */
.cg { border:1px solid var(--line); border-left:3px solid var(--hud); background:rgba(0,0,0,.25); padding:5px 9px 6px; margin:0 0 6px; }
.cg.done { border-left-color:var(--friend); opacity:.8; }
.cg .cgt { display:flex; gap:8px; align-items:baseline; flex-wrap:wrap; } .cg .cgx { margin-left:auto; font-size:11px; }
.cg .cgs { display:flex; gap:14px; flex-wrap:wrap; font-size:12px; margin-top:2px; } .cg .cgs > span:first-child { color:var(--hud); font-weight:600; }
.cgs-wrap { margin-bottom:8px; }
.sq.off { opacity:.55; } .sq.you { border-left-color:var(--friend); } .sq .cgt .live { display:inline-block; margin-right:2px; }
.squadcfg { display:flex; flex-direction:column; gap:6px; margin:0 0 8px; } .squadcfg label { display:flex; flex-direction:column; font-size:11px; color:var(--muted); gap:2px; } .squadcfg label.chk { flex-direction:row; align-items:center; gap:6px; color:var(--text); font-size:12px; } .squadcfg input[type=text], .squadcfg input[type=password], .squadcfg input:not([type]) { width:100%; box-sizing:border-box; }
html.vr .cg .cgs { font-size:17px; }
/* ---- "Before you go" box on the Materials page */
.sitebox { margin-top:8px; border:1px solid var(--line); border-left:3px solid var(--hud); padding:6px 10px 8px; background:rgba(0,0,0,.25); }
.sitebox summary { cursor:pointer; font-family:var(--display); font-size:11px; letter-spacing:1.5px; text-transform:uppercase; color:var(--hdr); }
.sitebox table { margin-top:6px; }

.job.later { opacity:.75; border-left-color:var(--muted); }