/* BOB's Yard — After Hours. Atmospheric low-poly noir.
   Layout and interaction rules live in style.css; this layer owns the look. */
:root {
  --bg:#111922;
  --panel:rgba(17,25,33,.94);
  --line:rgba(168,189,204,.23);
  --muted:#b1bec7;
  --orange:#f18a3b;
  --mint:#a9c3b5;
  --ink:#e6e8e2;
}
body {background:#28333f}
#world canvas {width:100%!important;height:100%!important}
#world::after {
  content:"";position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse at 52% 44%,transparent 35%,#08101936 100%);
}
header {background:#101820f5;border-bottom-color:#6d819342}
footer {background:#101820f5;border-top-color:#6d819342}
.brand {font-weight:500;letter-spacing:3px;font-size:21px}
.brand-symbol {
  display:grid;place-items:center;width:36px;height:39px;
  font-size:29px;letter-spacing:0;transform:none;
  border:1px solid #e3a3628f;font-weight:600;
}
.subbrand {letter-spacing:2.3px;color:#99abb9}
.top-status,.eyebrow,.instrument-subhead,.instrument-header #feelState,
.map-caption,.auto-run-state>span,.engine-status {
  font-family:ui-monospace,SFMono-Regular,Consolas,monospace;
}
.live-dot {background:#e5ae78;box-shadow:0 0 8px #e3a56255}
.yard-title {color:#e4e6de;text-shadow:0 2px 16px #0e1724a8}
.yard-title .eyebrow {font-weight:500;color:#cda77f;letter-spacing:2.5px}
.yard-title h1 {font-weight:500;letter-spacing:1px;font-size:44px;margin-top:9px}
.yard-title p {color:#c1cad0;letter-spacing:.3px}
.shift-heading {display:flex;align-items:center;gap:14px}
.shift-toggle {pointer-events:auto;flex:none;padding:8px 10px;font-size:14px;letter-spacing:0;background:#101b24e8;color:#efd3b2;border:1px solid #b1916d8a;white-space:nowrap}
.shift-toggle:hover {background:#263644}
.shift-toggle-mobile {display:none}
body[data-shift="day"] {background:#91aab9}
body[data-shift="day"] #world::after {background:radial-gradient(ellipse at 52% 44%,transparent 45%,#29394512 100%)}
body[data-shift="day"] .yard-title {color:#17232b;text-shadow:0 1px 12px #eff2e68a}
body[data-shift="day"] .yard-title .eyebrow {color:#3b454b}
body[data-shift="day"] .yard-title p {color:#25323b}
@media(max-width:600px) {
  .brand #shiftSubbrand {display:none}
  .brand .shift-toggle-mobile {display:block;font:500 12px/1.2 'DM Sans',sans-serif;padding:4px 6px;margin-top:3px;min-height:24px}
}
button,.panel,.panel-toggle,.tool-chip,.auto-run-state,
.auto-estimate-track,.auto-estimate-track>div {border-radius:2px}
button {transition:background .15s,border-color .15s,transform .15s}
button:hover {background:#b9ccd916;border-color:#8093a2}
button:disabled:hover {border-color:var(--line)}
button:focus-visible {outline:2px solid #ffb673;outline-offset:3px}
kbd {border-radius:2px;box-shadow:none;color:#d7dfe3;background:#9db3c011;border-color:#899eae42;font-family:ui-monospace,SFMono-Regular,Consolas,monospace}
.panel {box-shadow:0 10px 32px #02070d36;backdrop-filter:blur(12px)}
.panel-heading .eyebrow {font-weight:500;letter-spacing:1.4px}
.panel-toggle {border-color:#8297a44a;background:#ffffff03;color:#c7d2d9}
.panel-toggle:hover {background:#b9ccd922}
.mission h2 {font-weight:500;letter-spacing:-.3px}
.mission-tabs button.active,.view-controls button.active {
  background:#dfa06118;color:#f0ba89;border-color:#d6a07180;
}
.progress-track,.pressure-track {border-radius:0;background:#64758530}
.lab-button {border-color:#798d9c!important}
.view-controls button {box-shadow:0 4px 16px #02081022}
#toast {background:#101b24f2;border:1px solid #8a9bab4a;border-left:2px solid var(--orange);border-radius:2px;box-shadow:0 6px 22px #0003;line-height:1.5}
.minimap {background:#111b25f5}
.blue {background:#91b3c3}
.minimap .eyebrow {color:#bac9d4}
.instrument-panel {background:#18232d;color:var(--ink);border:1px solid #798c9b5c;border-radius:2px;box-shadow:0 12px 36px #03090f45}
/* Leave the map's restore control clear even on the taller radio page. */
@media(min-width:801px) {
  .instrument-panel>.panel-content {max-height:calc(100dvh - 415px)}
  body:has(.minimap:not(.is-minimized)) .instrument-panel>.panel-content {max-height:calc(100dvh - 575px)}
}
@media(min-width:801px) and (max-height:760px) {
  .minimap {right:340px;bottom:163px}
  .instrument-panel>.panel-content,
  body:has(.minimap:not(.is-minimized)) .instrument-panel>.panel-content {max-height:calc(100dvh - 315px)}
}
.instrument-header {background:#101922;border-bottom:1px solid #cf955b8a}
.instrument-name {font-weight:500;letter-spacing:2px}
.instrument-name small {color:#9bafbd}
.instrument-subhead {color:#a9bac8;letter-spacing:.5px}
.simulated-label {color:#c6a583}
.dial-tick {stroke:#b7c4ce;stroke-width:1.4}
.dial-warning {stroke:#dc715f;stroke-width:2}
.dial-label {fill:#b4c2cc;font-weight:500;letter-spacing:.35px}
.dial-value {fill:#f0eee5;font-weight:500}
.dial-unit {fill:#9eb1c0}
.rpm-digits {fill:#f3d6b8;font-weight:500;letter-spacing:0}
.rpm-unit,.engine-hour-label {fill:#a4b5c3}
.engine-hours {fill:#d2dbe0}
.avatar-instruments {border-color:#72879840}
.instrument-panel .meter-label {color:#acbdc9;font-weight:500}
.instrument-panel .meter-label b {color:#f0dfcc}
.instrument-panel .pressure-track {background:#8295a12b;border-radius:0}
.instrument-readouts>div+div {border-color:#7e90a13d}
.instrument-readouts>div>span,.instrument-readouts small {color:#b0bec8}
.instrument-readouts strong {color:#e9e8df;font-weight:500}
.instrument-panel .feel-strip {color:#bdc8d0;border-color:#7e90a13d}
.instrument-actions {background:#111c26;border-color:#75899847}
.instrument-actions button {color:#c3ced6;letter-spacing:.3px}
.instrument-actions button+button {border-color:#75899847}
.instrument-actions button>span {color:#dab38d}
.instrument-actions button:hover {background:#8198ac24}
.music-page {background:#17232e;color:#e0e7e9}
.music-heading {color:#c9aa88;font-weight:500}
.music-page button {background:#22323f;border-color:#6f859747;color:#dce4e8}
.music-page button:hover {background:#354857}
.music-now h2 {font-weight:500;letter-spacing:.4px;color:#f0ddc9}
.music-now>span,.music-progress>div,.music-track small,.track-number {color:#b3c1cc}
.music-transport #musicPlay {background:#e1a36a;border-color:#e1a36a;color:#14212b;border-radius:2px}
.music-page input[type=range] {accent-color:#e1a36a}
.track-playing {color:#f2b77f}
.music-page .music-track.selected {background:#dea36c17;border-color:#bc895a91}
.instrument-actions #gaugeSoundBtn.music-playing>span {color:#f2b77f}
.instrument-actions #gaugeSoundBtn.active {background:#dfa0611c;color:#f1c298}
.tach-panel .panel-content>button {background:#24323e;border-color:#788d9f45}
.tach-panel button small {color:#aebec9}
.tach-panel button.active {background:#334840;color:#dae6dd;border-color:#91ad9b77}
.tach-panel button.active small {color:#bdcfc2}
.tool-chip {color:#a7b9c6}
.tool-chip.active {background:#d5955b1f;border-color:#cf955b8a;color:#efc399}
.autonomy-panel {border-color:#b88b5d6b}
.autonomy-panel .eyebrow {color:#dec09f}
.step-number {border-radius:2px;background:#bd926321;color:#dfbb94}
.teach-step button {background:#c4a2770d;border-color:#b3906766}
.auto-run-state {background:#0d1721a3;border-left:1px solid #967552}
.auto-run-state>span {color:#d8b28a}
.auto-actions #autoRun,#autoFinish:enabled {background:#dab087;color:#14202a;border-color:#dab087;font-weight:600}
.auto-actions #autoRun:disabled {background:#536170;color:#c3ced6;border-color:#7f8d9a}
.auto-actions #autoClear {color:#bdc7ce}
.autonomy-panel.is-running {border-color:#e0a468}
.autonomy-panel.is-waiting {border-color:#ffd099}
.auto-estimate-track {background:#53647338}
.auto-estimate-track>div {background:#ff7900}
.auto-estimate strong {color:#e1c2a2}
.auto-fast-forward[aria-pressed="true"] {color:#171f26}
.drawer {background:#111c26f5;border-color:#637b8c80;border-radius:2px;box-shadow:0 20px 80px #03070b55}
.drawer h2 {font-weight:500}
.drawer .eyebrow {color:#cfad89}
.drawer input[type=range] {accent-color:#e1a36a}
.drawer select {background:#223240;color:#e2e8e9;border-color:#657c8e}
.lab-data {background:#0b151e;color:#ccd6dd;border-radius:2px}
.fault-buttons button {border-radius:2px}
.touch-controls button {background:#15222eea;border-color:#7e97aa6b}
.stop-button {border-radius:2px}
#stopOverlay>div {background:#211b1beF;border-radius:2px;border:1px solid #cf705c}
#stopOverlay #rearmBtn {border-radius:2px}
@media(max-width:800px) {
  .brand {font-size:17px;letter-spacing:2px}
  .brand-symbol {width:29px;height:33px;font-size:25px}
  .yard-title h1 {font-size:30px}
}
@media(max-width:600px) {
  .work-panels {width:calc(43vw - 12px);top:148px;bottom:255px}
  .minimap.is-minimized {top:87px;bottom:auto;left:14px}
  .instrument-panel:not(.is-minimized) {width:calc(57vw - 26px)}
  .instrument-panel.is-minimized {width:calc(57vw - 26px)}
  .work-panels .mission,.work-panels .tach-panel,.work-panels .autonomy-panel {padding:10px}
  .panel-heading .eyebrow {letter-spacing:.4px;font-size:10px}
}
@media(prefers-reduced-transparency:reduce) {
  .panel,header,footer,.drawer {background:#14202b;backdrop-filter:none}
}

/* The hydraulic strip matches Bob’s roof light; a small end cap shows idle blue. */
#pressureBar {min-width:4px;background:#258fff}

.auto-actions #autoTightResume {border-color:#ffb35c;color:#ffcf94;background:#38291e;font-weight:600}
/* Backlit physical Bob-Tach rockers. */
.tach-panel .panel-content>button {position:relative;min-height:92px;border:2px solid #151616;border-radius:7px;background:linear-gradient(145deg,#42433b,#262822 65%,#171a16);box-shadow:inset 2px 3px 5px #7b7d6940,inset -3px -4px 5px #0009,0 3px 5px #0008;text-align:center;padding:12px 25px}
.tach-panel button .tach-label {display:block;color:#d0ff6c;font-weight:750;font-size:18px;text-shadow:0 0 7px #b7ff4d55}
.tach-label strong{display:block;font-size:24px;line-height:1.15}
.tach-panel button>kbd{position:absolute;right:8px;top:8px;font-size:11px;color:#aab29c}
.tach-panel button small,.tach-panel button.active small{font-size:11px;color:#a8b396;margin-top:7px}
.tach-panel .panel-content>button.active{background:linear-gradient(145deg,#353b29,#20251b);border-color:#8da853;box-shadow:inset 2px 3px 6px #0008,0 0 7px #b6e36120}
.rear-feed{position:relative;aspect-ratio:3/2;background:#111;overflow:hidden;border:1px solid #52616e}
.rear-feed canvas{width:100%;height:100%;display:block}.rear-feed svg{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}
.rear-caption{font-size:12px;color:#b6c0c7;margin:12px 0}.rear-state{color:#ffc45c}