.vehicle-schematic{background:#020505;border:1px solid #26372f;border-radius:18px;padding:10px 16px 16px;margin:18px 0;color:#a3b4bc}
.vehicle-scan{--scan-height:430px;position:relative;overflow:hidden;border-radius:10px;isolation:isolate}
.vehicle-scan::after{content:"";position:absolute;pointer-events:none;z-index:1;inset:-64px 0 auto;height:64px;border-bottom:1px solid #b9f36b;background:linear-gradient(to bottom,transparent,rgba(185,243,107,.035) 45%,rgba(185,243,107,.16));filter:drop-shadow(0 3px 5px rgba(185,243,107,.35));animation:vehicle-scanner 3.2s ease-in-out infinite alternate;will-change:transform}
.vehicle-scan::before{content:"";position:absolute;pointer-events:none;z-index:2;top:0;bottom:0;left:100%;width:64px;border-left:1px solid #b9f36b;background:linear-gradient(to right,rgba(185,243,107,.16),rgba(185,243,107,.035) 55%,transparent);filter:drop-shadow(-3px 0 5px rgba(185,243,107,.35));animation:vehicle-scanner-sideways 3.2s ease-in-out infinite alternate;will-change:left,opacity}
@keyframes vehicle-scanner{0%{transform:translateY(0);opacity:0}6%,94%{opacity:1}100%{transform:translateY(calc(var(--scan-height) + 64px));opacity:0}}
@keyframes vehicle-scanner-sideways{0%{left:100%;opacity:0}6%,94%{opacity:1}100%{left:-64px;opacity:0}}
.vehicle-plan{display:block;width:100%;height:430px;max-height:none;margin:0 auto}
.vehicle-plan .plan-body{fill:#0a1115;stroke:#7d929f;stroke-width:1.35}
.vehicle-plan .plan-outline{fill:none;stroke:#445966;stroke-width:.8}
.vehicle-plan .plan-tyres rect{fill:#34434d}
.vehicle-plan .plan-glass{fill:#203945;stroke:#527182;stroke-width:.6}
.vehicle-plan .plan-interior>*{fill:#111e26;stroke:#5d7687;stroke-width:1}
.vehicle-plan .plan-mirrors>*{fill:#0d191f;stroke:#78909f;stroke-width:1.2}
.vehicle-plan .plan-component{color:#a5b9c7}
.vehicle-plan .plan-component>rect,.vehicle-plan .plan-component>circle,.vehicle-plan .plan-component>path:not(.plan-wire):not(.plan-pipe){fill:#172730;stroke:#718a9c;stroke-width:1;transition:fill .22s,stroke .22s}
.vehicle-plan .plan-component text{fill:currentColor;stroke:none;font:500 7px ui-sans-serif,system-ui,sans-serif;text-anchor:middle}
.vehicle-plan .plan-component[data-component^="cylinder-"] text{font-size:8px}
.vehicle-plan .plan-component .plan-bolt{fill:#6b7e89}
.vehicle-plan .plan-component>circle.plan-ring,.vehicle-plan .plan-component.is-context>circle.plan-ring,.vehicle-plan .plan-component.is-active>circle.plan-ring{fill:none}
.vehicle-plan .plan-pipe{fill:none;stroke:#6c879b;stroke-width:2.8;stroke-linecap:round}
.vehicle-plan .plan-wire{fill:none;stroke:#708b9b;stroke-width:1.4;stroke-dasharray:4 3}
.vehicle-plan .plan-component.is-context>rect,.vehicle-plan .plan-component.is-context>circle,.vehicle-plan .plan-component.is-context>path:not(.plan-wire):not(.plan-pipe){fill:#44351b;stroke:#d4a348;stroke-width:1.4}
.vehicle-plan .plan-component.is-active{color:#785008}
.vehicle-plan .plan-component[data-component^="cylinder-"].is-active text{fill:#ffd384}
.vehicle-plan .plan-component.is-active>rect,.vehicle-plan .plan-component.is-active>circle,.vehicle-plan .plan-component.is-active>path:not(.plan-wire):not(.plan-pipe){fill:#ffc24d;stroke:#ffd37f;stroke-width:1.8}
.vehicle-plan .plan-component.is-active .plan-wire{stroke:#e99a00;stroke-width:2.8;stroke-dasharray:5 3}
.vehicle-plan .plan-component.is-active .plan-pipe{stroke:#e99a00;stroke-width:4}
.vehicle-plan .plan-direction,.vehicle-plan .plan-side{fill:#8ca3b4;font:7px ui-monospace,Consolas,monospace;letter-spacing:1px}
.vehicle-parts{display:flex;flex-wrap:wrap;gap:7px;min-height:30px;margin-top:4px}
.vehicle-parts span{border:1px solid #85662f;color:#ffd384;border-radius:999px;background:#332811;padding:4px 10px;font-size:11px}
.vehicle-parts .unmapped{background:#14212a;border-color:#496170;color:#a0b2bf}
.plan-key{display:flex;flex-wrap:wrap;align-items:center;gap:7px 14px;font-size:9px;margin-top:14px;color:#95aab8}
.plan-key span{display:inline-flex;align-items:center;gap:5px}
.plan-key i{display:inline-block;width:9px;height:9px;border:1px solid #d78b00;border-radius:2px;background:#ffbd42}
.plan-key i.context-key{background:#44351b;border-color:#d4a348}
@media(max-width:620px){.vehicle-plan{height:395px}.vehicle-scan{--scan-height:395px}.vehicle-schematic{padding:8px 10px 13px}.vehicle-card .vehicle-label{font-size:10px;letter-spacing:.04em;gap:10px}.vehicle-card .vehicle-label b{text-align:right;max-width:70%}}
@media(max-width:620px){
  .vehicle-plan{height:clamp(320px,108vw,395px)}
  .vehicle-scan{--scan-height:clamp(320px,108vw,395px)}
  .vehicle-schematic{padding:6px 4px 10px}
  .vehicle-card .vehicle-label{align-items:flex-start;gap:4px}
  .vehicle-card .vehicle-label b{text-align:left;max-width:100%}
  .vehicle-parts span{max-width:100%;padding:4px 8px;font-size:10px;overflow-wrap:anywhere}
  .plan-key{gap:6px 10px;line-height:1.35}
}
@media(prefers-reduced-motion:reduce){.vehicle-plan .plan-component>*{transition:none}.vehicle-scan::before,.vehicle-scan::after{animation:none;display:none}}

/* 3D-Ansicht */
.view-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;flex-wrap:wrap}
.view-presets{display:flex;gap:2px;background:#0b1512;border:1px solid #26372f;border-radius:999px;padding:3px}
.view-toolbar button{border:0;background:transparent;color:#a3b4bc;font:800 11px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.08em;text-transform:uppercase;padding:7px 11px;border-radius:999px;cursor:pointer;transition:background .2s,color .2s}
.view-toolbar button:hover{color:#f3f1e8;background:#13241e}
.view-toolbar button[aria-pressed=true]{background:#b9f36b;color:#07110e}
.view-toolbar .view-mode{border:1px solid #26372f}
.vehicle-3d{position:relative;height:430px;border-radius:10px;overflow:hidden;background:radial-gradient(ellipse at 50% 42%,#11261f 0%,#061009 55%,#020505 100%)}
.vehicle-3d-stage{position:absolute;inset:0}
.vehicle-3d-stage canvas{display:block;width:100%!important;height:100%!important;cursor:grab;touch-action:none}
.vehicle-3d-stage canvas:active{cursor:grabbing}
.vehicle-3d-labels{position:absolute;inset:0;pointer-events:none;overflow:hidden}
.vehicle-3d-labels span{position:absolute;left:0;top:0;white-space:nowrap;padding:4px 8px;border-radius:6px;background:rgba(255,182,46,.95);color:#1d1200;font:800 11px/1.2 ui-sans-serif,system-ui,sans-serif;box-shadow:0 4px 14px rgba(0,0,0,.45)}
.vehicle-3d-labels span::after{content:"";position:absolute;left:50%;bottom:-5px;width:8px;height:8px;background:inherit;transform:translateX(-50%) rotate(45deg)}
.vehicle-3d-tip{position:absolute;pointer-events:none;padding:5px 9px;border-radius:6px;background:rgba(7,17,14,.94);border:1px solid #2d4a40;color:#e8f2ee;font:600 12px/1.3 ui-sans-serif,system-ui,sans-serif;transform:translate(14px,14px);white-space:nowrap;z-index:2}
.vehicle-3d-hint{position:absolute;left:12px;bottom:10px;font-size:11px;color:#6f8580;pointer-events:none}
@media(max-width:620px){.vehicle-3d{height:395px}.view-toolbar button{padding:7px 8px;letter-spacing:.04em}.vehicle-3d-hint{font-size:10px}}
.layout-pick{display:flex;align-items:center;gap:8px;flex:1 1 100%;margin:0;color:#a3b4bc;font:800 10px/1 ui-sans-serif,system-ui,sans-serif;letter-spacing:.1em;text-transform:uppercase}
.layout-pick select{flex:1;min-width:0;background:#0b1512;color:#e8f2ee;border:1px solid #26372f;border-radius:999px;padding:7px 12px;font:700 12px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:0;text-transform:none;cursor:pointer;outline:none}
.layout-pick select:focus{border-color:#b9f36b}
.layout-pick{min-width:0;max-width:100%}
.vehicle-3d-labels span{max-width:calc(100% - 16px);white-space:normal;text-align:center}
