/* Train Station Builder: HUD + side panels (shared 3D styles: sim3d.css) */
#game-root .sim-controls-help { margin-top: 14px; }
.sb-hud { position: absolute; left: 10px; top: 10px; display: flex; gap: 6px; flex-wrap: wrap; max-width: 70%; }
.sb-hud > div { background: rgba(8, 16, 28, .7); border: 1px solid rgba(255, 255, 255, .15); border-radius: 10px; padding: 5px 10px; font: 800 15px system-ui, sans-serif; color: #fff; }
.sb-rep { position: relative; }
.sb-rep i { position: absolute; left: 6px; right: 6px; bottom: 2px; height: 3px; border-radius: 2px; background: rgba(255, 255, 255, .2); }
.sb-rep u { position: absolute; left: 0; top: 0; bottom: 0; background: #4ade80; }
.sb-rep.is-low { border-color: #fb7185; } .sb-rep.is-low u { background: #fb7185; }
.sb-time:empty { display: none; }
.sb-float { position: absolute; transform: translate(-50%, -50%); font: 900 18px system-ui, sans-serif; color: #fde047; text-shadow: 0 2px 4px #000; animation: sb-up 1.5s ease-out forwards; pointer-events: none; }
@keyframes sb-up { to { transform: translate(-50%, -160%); opacity: 0; } }
.sb-side { display: grid; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); gap: 8px; }
.sb-panel { background: var(--color-bg-alt, #1c1f27); border: 1px solid var(--color-border, #2d3240); border-radius: 12px; padding: 8px; }
.sb-panel h4 { margin: 0 0 6px; font-size: 14px; }
.sb-arr, .sb-build { display: flex; flex-direction: column; gap: 5px; }
.sb-card { position: relative; text-align: left; padding: 6px 8px 6px 12px; border-radius: 9px; border: 2px solid transparent; background: rgba(255, 255, 255, .06); color: inherit; cursor: pointer; font: inherit; }
.sb-card::before { content: ""; position: absolute; left: 0; top: 4px; bottom: 4px; width: 5px; border-radius: 3px; background: var(--c); }
.sb-card b { display: block; font-size: 13px; } .sb-card small { display: block; font-size: 11px; opacity: .8; }
.sb-card em { position: absolute; right: 8px; top: 8px; font-style: normal; font-weight: 800; font-size: 12px; }
.sb-card.is-sel { border-color: #facc15; background: rgba(250, 204, 21, .12); }
.sb-card.is-wait { animation: tk-blink .7s steps(2) infinite; border-color: #fb7185; }
.sb-plats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 5px; }
.sb-plat { padding: 6px 2px; border-radius: 9px; border: 2px solid transparent; font: 800 14px system-ui, sans-serif; cursor: pointer; color: #fff; }
.sb-plat small { display: block; font-size: 10px; font-weight: 700; opacity: .9; }
.sb-plat.is-free { background: #15803d; } .sb-plat.is-res { background: #b45309; } .sb-plat.is-busy { background: #475569; } .sb-plat.is-locked { background: #2b2f38; color: #777; cursor: not-allowed; }
.sb-build button { text-align: left; padding: 6px 8px; border-radius: 9px; border: 1px solid rgba(255, 255, 255, .15); background: rgba(34, 197, 94, .15); color: inherit; font: 700 13px system-ui, sans-serif; cursor: pointer; display: flex; justify-content: space-between; }
.sb-build button.is-dim { opacity: .5; background: rgba(255, 255, 255, .05); }
.sb-goal { font-size: 12px; opacity: .75; padding: 2px 0; } .sb-goal.is-done { opacity: 1; color: #facc15; }
.sb-empty { margin: 0; font-size: 12px; opacity: .7; }
.sb-side button:focus-visible { outline: 3px solid #ffd54a; outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) { .sb-card.is-wait { animation: none; } .sb-float { animation-duration: .01s; } }