/* Option C · Blueprint: the station as a technical drawing. Deliberately leaves brass for cyanotype blue,
 * keeping brass only as the "selected" accent. No starfield, no bob: almost nothing animates at idle. */
:root{--bp:#0b2a4a; --bp2:#0e3258; --ink:#d6ebff; --ink2:#8fc4ee}
body{background:var(--bp) fixed}
.sky{background:
  linear-gradient(rgba(143,196,238,.16) 1px, transparent 1px) 0 0/120px 120px,
  linear-gradient(90deg, rgba(143,196,238,.16) 1px, transparent 1px) 0 0/120px 120px,
  linear-gradient(rgba(143,196,238,.07) 1px, transparent 1px) 0 0/24px 24px,
  linear-gradient(90deg, rgba(143,196,238,.07) 1px, transparent 1px) 0 0/24px 24px,
  radial-gradient(ellipse at 30% 40%, #10375f, var(--bp) 70%)}
.topbar{background:linear-gradient(rgba(8,30,54,.94),rgba(8,30,54,.8)); border-bottom-color:rgba(143,196,238,.4)}
.panel{background:rgba(9,31,56,.93) !important; border-color:rgba(143,196,238,.45) !important}
#bob{animation:none !important}
/* ring as double outline: light stroke, then a background-coloured stroke inside it */
#rot > circle:nth-of-type(1){stroke:var(--ink); stroke-width:29}
#rot > circle:nth-of-type(2){stroke:var(--bp); stroke-width:26.6}
#rot > circle:nth-of-type(3){stroke:var(--ink2); stroke-width:1; stroke-dasharray:14 4 2 4}
#rot > circle.ticks{stroke:var(--ink2)}
#rot > circle.chase{stroke:#ffd88a; opacity:.9}
#rot > circle:nth-of-type(6){stroke:var(--ink2); stroke-opacity:.6}
#rot > g[stroke]:not(.arrays){stroke:var(--ink)} #rot > g[stroke] + g[stroke]{stroke:var(--bp); stroke-width:7.6}
.arrays rect{stroke:var(--ink); stroke-width:1.2; fill:var(--bp)}
.arrays rect[fill="url(#solar)"]{fill:url(#bpSolar)}
.array{animation:none !important}
.mod[data-mod="hub"] circle:first-child{fill:var(--bp); stroke:var(--ink); stroke-width:1.6}
.mod[data-mod="hub"] .spin{stroke:var(--ink2)}
.mod[data-mod="hub"] path{fill:none; stroke:var(--ink); stroke-width:1.4}
.mod .shell{fill:var(--bp); stroke:var(--ink); stroke-width:1.6}
.mod:hover .shell,.mod:focus-visible .shell{fill:var(--bp2)}
.mod.active .shell{fill:#12406e; stroke:#ffd88a; stroke-width:2}
.mod .glow{stroke:#ffd88a; stroke-width:1; stroke-dasharray:6 4}
.mod .win{fill:none; stroke:var(--ink2); stroke-width:.9; opacity:1}
.mod.active .win{fill:#ffd88a; stroke:none}
.mod text{font-family:var(--mono); fill:var(--ink); font-weight:600; letter-spacing:.16em; font-size:14px}
.mod .sub{fill:var(--ink2); font-weight:400; letter-spacing:.1em; font-size:10px}
.nav.red,.snav.red{fill:#ff8f7d} .beacon{fill:#ffd88a}
#collar rect{fill:var(--bp); stroke:var(--ink)} .jaw{fill:var(--ink)} .portlbl{font-family:var(--mono); fill:#ffd88a}
#shuttle .shipbody path, #shuttle > path{fill:var(--bp); stroke:var(--ink); stroke-width:1}
#shuttle ellipse{fill:none; stroke:#ffd88a}
#shuttle .flame path,#shuttle .rcs path,#shuttle .beam{stroke:none}
#pathA,#pathB{stroke:var(--ink2); stroke-width:1; stroke-dasharray:3 6; opacity:.55}
.anno .cl{fill:none; stroke:var(--ink2); stroke-opacity:.45; stroke-width:.8; stroke-dasharray:22 5 3 5}
.anno .dim,.anno .ext,.anno .lead{fill:none; stroke:var(--ink); stroke-width:.9}
.anno text{font-family:var(--mono); fill:var(--ink); font-size:11px; letter-spacing:.12em}
.anno .callt.sm{font-size:9px; fill:var(--ink2)}
.north circle{fill:none; stroke:var(--ink2)} .north path{fill:var(--ink)}
.sweep{position:absolute; width:var(--sw,300px); height:var(--sw,300px); left:var(--sx,50%); top:var(--sy,50%); margin:calc(var(--sw,300px) / -2) 0 0 calc(var(--sw,300px) / -2);
  border-radius:50%; pointer-events:none; background:conic-gradient(from 0deg, rgba(143,196,238,.0) 0 300deg, rgba(143,196,238,.14) 356deg, rgba(214,235,255,.45) 360deg);
  z-index:0; animation:sweep 7s linear infinite; will-change:transform}
@keyframes sweep{to{transform:rotate(360deg)}}
.titleblock{margin:8px auto 0; border-collapse:collapse; font-family:var(--mono); font-size:.66rem; letter-spacing:.1em; text-transform:uppercase; color:var(--ink2)}
.titleblock td{border:1px solid rgba(143,196,238,.55); padding:4px 8px} .titleblock b{color:var(--ink)}
.hint{color:var(--ink2); font-family:var(--mono); font-size:.72rem}
@media (pointer: coarse){ .hint{display:none} }
@media (max-width: 960px){
  #station{max-height:420px}
  .mod text{font-size:18px} .mod .sub{font-size:12px}
  .anno .callt.sm{display:none}
}
@media (prefers-reduced-motion: reduce){ .sweep{display:none} }
#station{position:relative; z-index:1}
#shuttle,#collar{pointer-events:none}  /* the shuttle and its beam used to swallow clicks on the docked deck */