/* Per-ship pages (/shipyard/<slug>), generated by tools/site/gen_ship_pages.py. Hand-written; same look as the other redesign pages. */
html,body{margin:0;background:#05080b;color:#d9e2e6;font-family:'Titillium Web',system-ui,sans-serif;-webkit-font-smoothing:antialiased}
*{box-sizing:border-box}
a{color:#7fdbe4;text-decoration:none}
a:hover{color:#c4f2f6}
::selection{background:#7fdbe4;color:#05080b}
img{max-width:100%}
:focus-visible{outline:2px solid #7fdbe4;outline-offset:2px}
.page{min-height:100vh;background:#05080b;overflow-x:clip}
main{padding:calc(68px + clamp(20px,3vw,36px)) 0 clamp(48px,7vw,88px)}
.wrap{max-width:1100px;margin:0 auto;padding:0 clamp(16px,4vw,40px)}
.crumbs{display:flex;flex-wrap:wrap;gap:4px 0;margin:0 0 clamp(18px,3vw,30px);font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.14em;text-transform:uppercase;color:#8fa1a8}
.crumbs a{color:#8fa1a8}
.crumbs a:hover{color:#fff}
.crumbs span{margin:0 8px;color:#8fa1a8}
.hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,340px);gap:clamp(20px,4vw,56px);align-items:center;padding:clamp(20px,3vw,36px);border:1px solid #ffffff1f;background:radial-gradient(ellipse at 80% 40%,#12303a 0%,#081419 50%,#04070a 100%)}
.kicker{display:flex;align-items:center;gap:10px;margin:0 0 16px;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.16em;line-height:1.5;color:#7fdbe4;text-transform:uppercase}
.kicker img{flex:none;width:26px;height:26px;border-radius:50%}
.hero h1{margin:0;font-family:'Michroma',sans-serif;font-weight:400;font-size:clamp(28px,4.4vw,52px);line-height:1.12;color:#f2f7f8;text-wrap:balance;overflow-wrap:anywhere}
.sub{margin:14px 0 0;font-family:'JetBrains Mono',monospace;font-size:12px;letter-spacing:.14em;line-height:1.6;color:#c4f2f6;text-transform:uppercase;overflow-wrap:anywhere}
.cta{display:flex;flex-wrap:wrap;gap:10px;margin-top:clamp(20px,3vw,32px)}
.btn{display:inline-flex;justify-content:space-between;align-items:center;gap:18px;min-height:46px;padding:0 18px;border:1px solid #7fdbe466;color:#c4f2f6;font-size:13px;font-weight:600;letter-spacing:.14em;text-transform:uppercase}
.btn:hover{border-color:#7fdbe4;color:#fff}
.btn.primary{background:#7fdbe4;border-color:#7fdbe4;color:#041013;font-weight:700}
.btn.primary:hover{background:#c4f2f6;border-color:#c4f2f6;color:#041013}
.btn .lbl{display:inline-flex;align-items:center;gap:.6em}
.steam-ic{flex:none;width:1.15em;height:1.15em;fill:currentColor}
.art{margin:0;text-align:center}
.art img{display:block;margin:0 auto;width:100%;max-width:300px;height:auto}
.art img.sil{filter:drop-shadow(0 0 24px #7fdbe433)}
.art img.thumb{max-width:328px;aspect-ratio:328/168;background:radial-gradient(ellipse at 50% 55%,#0f2630,#04070a 75%);border:1px solid #ffffff1a}
.art img.portrait{max-width:280px;filter:drop-shadow(0 0 24px #7fdbe426)}
.art img.emblem{max-width:150px;opacity:.55}
.art figcaption{margin-top:8px;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.14em;text-transform:uppercase;color:#8fa1a8}
/* lit render hero (tools/site/gen_ship_renders.py): the render large */
.hero.has-render{grid-template-columns:minmax(0,5fr) minmax(0,8fr)}
.has-render h1{font-size:clamp(26px,3.3vw,44px);overflow-wrap:break-word}
.has-render .art{text-align:left}
.has-render .art img.big{max-width:none;width:100%;height:auto;aspect-ratio:1200/675;border:1px solid #7fdbe42e;border-radius:6px;background:#060b0f}
.has-render .art>figcaption{margin-top:10px;text-align:center}
.block{margin-top:clamp(28px,4vw,48px)}
.block h2{margin:0 0 16px;font-family:'Michroma',sans-serif;font-weight:400;font-size:clamp(17px,2vw,22px);line-height:1.3;color:#f2f7f8}
.lede{margin:0;max-width:72ch;font-size:clamp(16px,1.4vw,18px);line-height:1.7;color:#c3d0d5;font-weight:300;text-wrap:pretty}
.note{margin:0 0 12px;max-width:70ch;font-size:15px;line-height:1.6;color:#8fa1a8}
.facts{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,300px),1fr));gap:1px;margin:24px 0 0;background:#ffffff14;border:1px solid #ffffff14}
.facts>div{background:#060b0f;padding:12px 14px;min-width:0}
.facts dt,.tiles dt,.rows .k{font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.16em;color:#8fa1a8;text-transform:uppercase}
.facts dd{margin:6px 0 0;min-width:0}
.facts dd b{display:block;font-family:'Michroma',sans-serif;font-weight:400;font-size:14px;line-height:1.35;color:#f2f7f8;overflow-wrap:anywhere}
.facts dd span{display:block;margin-top:6px;font-size:14px;line-height:1.5;color:#aebcc2}
.tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,150px),1fr));gap:1px;margin:0;background:#ffffff14;border:1px solid #ffffff14}
.tiles>div{background:#060b0f;padding:12px 14px;min-width:0}
.tiles dd{margin:6px 0 0;font-family:'Michroma',sans-serif;font-size:17px;color:#f2f7f8;overflow-wrap:anywhere}
.tiles dd small{margin-left:6px;font-family:'JetBrains Mono',monospace;font-size:10px;letter-spacing:.1em;color:#8fa1a8;text-transform:uppercase}
.rows{list-style:none;margin:1px 0 0;padding:0;display:grid;gap:1px;background:#ffffff14;border:1px solid #ffffff14}
.tiles+.rows{margin-top:16px}
.rows li{display:grid;grid-template-columns:minmax(0,1fr) auto;column-gap:10px;background:#060b0f;padding:12px 14px;min-width:0}
.rows .k{grid-column:1}
.rows .chip{grid-column:2;grid-row:1;font-family:'JetBrains Mono',monospace;font-size:11px;letter-spacing:.08em;color:#7fdbe4;white-space:nowrap}
.rows b{grid-column:1 / -1;margin-top:6px;font-family:'Michroma',sans-serif;font-weight:400;font-size:14px;line-height:1.35;color:#f2f7f8;overflow-wrap:anywhere}
.rows .sub{grid-column:1 / -1;margin-top:6px;font-size:14px;line-height:1.5;color:#aebcc2;overflow-wrap:anywhere}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0;list-style:none}
.chips li>*{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border:1px solid #ffffff26;background:#060b0f;color:#e6eef0;font-size:13px;font-weight:600;letter-spacing:.06em}
.chips a:hover{border-color:#7fdbe4;color:#fff}
.chips [aria-current]{border-color:#7fdbe4;background:#7fdbe41a;color:#fff}
.pn{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.pn a{display:flex;flex-direction:column;gap:6px;padding:16px 18px;border:1px solid #ffffff1f;background:#060b0f;color:#e6eef0;min-width:0}
.pn a:hover{border-color:#7fdbe466;color:#fff}
.pn small{font-family:'JetBrains Mono',monospace;font-size:10.5px;letter-spacing:.16em;color:#7fdbe4;text-transform:uppercase}
.pn span{font-family:'Michroma',sans-serif;font-size:15px;line-height:1.35;overflow-wrap:anywhere}
.pn em{font-style:normal;font-size:13px;line-height:1.4;color:#8fa1a8;overflow-wrap:anywhere}
.pn .next{text-align:right;grid-column:2}
.links{display:flex;flex-wrap:wrap;gap:10px 28px;margin:20px 0 0;font-size:13px;font-weight:600;letter-spacing:.12em;text-transform:uppercase}
@media (max-width:760px){.hero{grid-template-columns:minmax(0,1fr)}.art{order:-1}.art img{max-width:200px}.hero.has-render{grid-template-columns:minmax(0,1fr)}.cta .btn{flex:1 1 100%}}
@media (max-width:520px){.pn{grid-template-columns:minmax(0,1fr)}.pn .next{text-align:left;grid-column:auto}}