/* Fahrzeugfunkgerät: querformatiges Bedienteil (Drehknopf und Notruftaste links, Display, Softkeys senkrecht
   rechts daneben, Navigationsring, Tastatur) und Handmikrofon mit Sprechtaste. Maße in --u (≈ 1 mm).
   Auf schmalen Bildschirmen bricht das Bedienteil in zwei Reihen um, damit das Display lesbar bleibt. */
body[data-typ="fahrzeug"] .stage { flex-direction: column; gap: 8px; justify-content: center; }
body[data-typ="fahrzeug"] .beside { order: -1; max-width: none; width: 100%; display: flex; align-items: center; justify-content: space-between; gap: 8px; }
body[data-typ="fahrzeug"] .hint { display: none; }
.radio.fahrzeug { --u: min(calc((100vw - 40px) / 182), calc((100dvh - 80px) / 74), 6px); display: flex; flex-direction: column; align-items: flex-start; gap: calc(2 * var(--u)); flex: none; }
.fahrzeug .konsole { display: flex; gap: calc(3 * var(--u)); align-items: stretch; padding: calc(3 * var(--u)) calc(4 * var(--u)); border-radius: calc(4 * var(--u));
  background: linear-gradient(#2b3137, #1a1e22); box-shadow: 0 calc(2 * var(--u)) calc(8 * var(--u)) #000b, inset 0 0 0 calc(.6 * var(--u)) #3d454d; }
.fahrzeug .f-oben { display: flex; gap: calc(2.5 * var(--u)); align-items: center; }
.fahrzeug .f-links { width: calc(20 * var(--u)); display: flex; flex-direction: column; align-items: center; justify-content: space-between; align-self: stretch; gap: calc(3 * var(--u)); }
.fahrzeug .knob { position: relative; width: calc(17 * var(--u)); height: calc(17 * var(--u)); border-radius: 50%; cursor: grab; touch-action: none; flex: none;
  background: radial-gradient(circle, #3a4046 0 48%, #2a2f34 50% 60%, transparent 61%), repeating-conic-gradient(#16191c 0 6deg, #3a4046 6deg 12deg);
  box-shadow: 0 calc(.6 * var(--u)) calc(1.4 * var(--u)) #000a, inset 0 calc(.4 * var(--u)) 0 #ffffff18; }
.fahrzeug .knob.down { filter: brightness(1.3); }
.fahrzeug .knob-mark { position: absolute; left: 50%; top: 50%; width: calc(1 * var(--u)); height: calc(7 * var(--u)); margin-left: calc(-.5 * var(--u)); transform-origin: 50% 0;
  background: linear-gradient(transparent 55%, #f1f3f5 55%); rotate: calc(45deg + var(--vol, 5) * 27deg); transition: rotate .08s; }
.fahrzeug .f-links-unten { display: flex; gap: calc(2 * var(--u)); align-items: center; }
.fahrzeug .buchse { width: calc(5 * var(--u)); height: calc(5 * var(--u)); border-radius: 50%; background: radial-gradient(circle, #0b0c0d 35%, #50575e 40%, #24292d 70%); }
.fahrzeug .k-notruf { width: calc(9 * var(--u)); height: calc(6 * var(--u)); border: 0; border-radius: calc(1.5 * var(--u)); background: linear-gradient(#ff8787, #e03131); box-shadow: 0 calc(.4 * var(--u)) 0 #000c; touch-action: none; padding: 0; }
.fahrzeug .k-notruf.down { filter: brightness(1.4); }
.fahrzeug .bezel { width: calc(62 * var(--u)); padding: calc(1.6 * var(--u)); border-radius: calc(1.5 * var(--u)); }
.fahrzeug .f-soft { display: flex; flex-direction: column; justify-content: space-between; align-items: center; align-self: stretch; gap: calc(2 * var(--u)); padding: calc(1.6 * var(--u)) 0; }
.fahrzeug .soft { width: calc(10 * var(--u)); height: calc(7 * var(--u)); border-radius: calc(1.5 * var(--u)); }
.fahrzeug .menue { width: calc(10 * var(--u)); height: calc(6 * var(--u)); border-radius: calc(3 * var(--u)); font-size: calc(3 * var(--u)); }
.fahrzeug .f-rechts { display: flex; gap: calc(3 * var(--u)); align-items: stretch; }
.fahrzeug .f-nav { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: calc(2.5 * var(--u)); width: calc(26 * var(--u)); }
.fahrzeug .ring { width: calc(22 * var(--u)); height: calc(22 * var(--u)); }
.fahrzeug .f-ruf { display: flex; gap: calc(3 * var(--u)); }
.fahrzeug .pad { flex: none; width: calc(34 * var(--u)); padding: 0; gap: calc(1.2 * var(--u)) calc(1.6 * var(--u)); grid-auto-rows: calc(7.5 * var(--u)); align-content: center; }
.fahrzeug .f-leiste { display: flex; flex-direction: column; justify-content: space-between; align-items: center; gap: calc(2 * var(--u)); padding: calc(1 * var(--u)) 0; }
.fahrzeug .mini { width: calc(6.5 * var(--u)); height: calc(5.5 * var(--u)); border-radius: calc(1 * var(--u)); }
.fahrzeug .mini svg { width: calc(3.4 * var(--u)); height: calc(3.4 * var(--u)); }
.fahrzeug .mikro { display: flex; align-items: center; margin-left: calc(4 * var(--u)); }
.fahrzeug .kabel { width: calc(16 * var(--u)); height: calc(3 * var(--u)); border-radius: calc(1.5 * var(--u));
  background: repeating-linear-gradient(90deg, #30363c 0 calc(1 * var(--u)), #15181b calc(1 * var(--u)) calc(1.6 * var(--u))); }
.fahrzeug .mikro-koerper { width: calc(56 * var(--u)); height: calc(18 * var(--u)); border-radius: calc(9 * var(--u)); background: linear-gradient(#30363c, #181b1e);
  box-shadow: 0 calc(1.5 * var(--u)) calc(5 * var(--u)) #000b, inset 0 0 0 calc(.5 * var(--u)) #424a52; display: flex; align-items: center; gap: calc(3 * var(--u)); padding: 0 calc(3 * var(--u)); }
.fahrzeug .gitter { width: calc(13 * var(--u)); height: calc(13 * var(--u)); border-radius: 50%; flex: none;
  background: radial-gradient(circle, #0b0c0d 30%, transparent 35%) 0 0 / calc(1.6 * var(--u)) calc(1.6 * var(--u)), #262b30; }
.fahrzeug .k-ptt { flex: 1; height: calc(11 * var(--u)); border: 0; border-radius: calc(5.5 * var(--u)); touch-action: none; padding: 0;
  background: repeating-linear-gradient(90deg, #3c434a 0 calc(1.2 * var(--u)), #2b3136 calc(1.2 * var(--u)) calc(2 * var(--u)));
  color: #ced4da; font: 700 calc(3 * var(--u))/1 Arial, sans-serif; letter-spacing: .15em; box-shadow: 0 calc(.5 * var(--u)) 0 #000c; }
.fahrzeug .k-ptt.down { filter: brightness(1.5); }
@media (max-width: 760px) {
  .radio.fahrzeug { --u: min(calc((100vw - 24px) / 106), calc((100dvh - 60px) / 112), 6px); align-items: center; }
  .fahrzeug .konsole { flex-direction: column; gap: calc(3 * var(--u)); }
  .fahrzeug .f-rechts { justify-content: center; }
  .fahrzeug .mikro { margin-left: 0; }
  .fahrzeug .f-links { width: calc(14 * var(--u)); }
  .fahrzeug .knob { width: calc(14 * var(--u)); height: calc(14 * var(--u)); }
  .fahrzeug .knob-mark { height: calc(5.8 * var(--u)); }
  .fahrzeug .k-notruf { width: calc(8 * var(--u)); }
  .fahrzeug .buchse { display: none; }
  .fahrzeug .bezel { width: calc(68 * var(--u)); }
}
/* Display: dunkles Bild, Softkeys senkrecht am rechten Rand neben den Tasten */
.lcd.fahrzeug { --d-bg: #1b2228; --d-fg: #e9ecef; --d-sb: #11161a; --d-sk: #2b3640; --d-sel: #2f9e44; --d-rand: #6c7a86; --d-box: #232c33; --d-dim: #9aa7b2; --d-stl: #2f9e44; --d-kopf: linear-gradient(#2b3640, #1f272e);
  padding-right: 58px; }
.lcd.fahrzeug:has(.boot), .lcd.fahrzeug.off { padding-right: 0; }
.lcd.fahrzeug .sk { position: absolute; right: 0; top: 0; bottom: 0; width: 56px; height: auto; margin: 0; flex-direction: column; justify-content: space-between; padding: 18px 0 3px; }
.lcd.fahrzeug .sk span { min-width: 0; text-align: center !important; line-height: 24px; font-size: 11.5px; padding: 0 2px; white-space: nowrap; overflow: hidden; border-radius: 4px 0 0 4px; }
.lcd.fahrzeug .over { right: 61px; bottom: 3px; }
.lcd.fahrzeug .sk-over { left: auto; right: -61px; top: -34px; bottom: -3px; }
.lcd.fahrzeug .vol { bottom: 4px; }
.lcd.fahrzeug .warn { width: 58px; height: 50px; }
.lcd.fahrzeug .home { gap: 0; padding-top: 3px; }
.lcd.fahrzeug .row.grp { font-size: 22px; font-weight: 700; }
.lcd.fahrzeug .f-netz { justify-content: space-between; font-size: 13px; color: var(--d-dim); }
.lcd.fahrzeug .f-status { font-size: 12px; color: var(--d-dim); }
.lcd.fahrzeug .f-liste { color: #69db7c; margin-right: 4px; }
.lcd.fahrzeug .raster svg { height: 20px; }