/* WebFTR FT8 Frontend Module CSS - v22.06
   Refactor-Schritt 2: erste echte FT8-CSS-Regeln aus index.html ausgelagert.
   Keine Funktionsänderung: diese Datei zentralisiert FT8-spezifische UI-Regeln. */

#card_FT8{
  --webftr-ft8-module-css: "v22.06";
}

#card_FT8 .ft8-table tbody tr,
#card_FT8 .bandActivity tbody tr{
  transition:background .16s ease, box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}

#card_FT8 .ft8-controls,
#card_FT8 .audiofft-wrap,
#card_FT8 .smeter-wrap{
  position:relative;
}

#card_FT8 .ft8-country-badge,
#card_FT8 .decode-source,
#card_FT8 .decode-count-badge{
  text-transform:uppercase;
}


/* v21.95 moved FT8 Band Activity/table/filter CSS from index.html */
.ft8-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}
.ft8-box{border:1px solid rgba(0,232,255,.22);background:rgba(1,9,14,.72);padding:10px;min-height:210px}
.ft8-table-wrap{max-height:430px;overflow-y:auto;overflow-x:auto;border:1px solid rgba(0,232,255,.10);background:rgba(0,0,0,.18)}
.ft8-box h4{margin:0 0 8px;color:var(--cyan);letter-spacing:.08em;font-size:12px}
.ft8-table{width:100%;border-collapse:collapse;font-family:Consolas,monospace;font-size:13px}
.ft8-table th,.ft8-table td{border-bottom:1px solid rgba(0,232,255,.12);padding:5px 6px;text-align:left;white-space:nowrap;vertical-align:top}
.ft8-table th{color:var(--muted);font-size:11px;position:sticky;top:0;background:#020c12;z-index:2}
.ft8-table td.msgcell{white-space:normal;color:#eafff1}
.ft8-table tr.cq-row{background:linear-gradient(90deg,rgba(57,255,20,.20),rgba(57,255,20,.07) 55%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(57,255,20,.85)}
.ft8-table tr.cq-row td.msgcell{color:#d9ffe1;font-weight:800;text-shadow:0 0 7px rgba(57,255,20,.32)}
/* v22.46: Punkt 3 - Signal-Icon im FT8-Decode-Table leicht vom linken Rand lösen. */
.ft8-table.bandActivity th:first-child,
.ft8-table.bandActivity td:first-child{padding-left:14px}
.signal-icon{display:inline-flex;align-items:flex-end;gap:2px;width:32px;height:17px;vertical-align:middle;margin-left:3px}
.signal-icon .bar{display:block;width:4px;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.10);box-shadow:inset 0 0 3px rgba(255,255,255,.08)}
.signal-icon .bar:nth-child(1){height:5px}.signal-icon .bar:nth-child(2){height:8px}.signal-icon .bar:nth-child(3){height:11px}.signal-icon .bar:nth-child(4){height:14px}.signal-icon .bar:nth-child(5){height:17px}
.signal-icon.red .bar.on{background:#ff3154;border-color:#ff6b80;box-shadow:0 0 7px rgba(255,49,84,.58)}
.signal-icon.orange .bar.on{background:#ff8e2a;border-color:#ffc08b;box-shadow:0 0 7px rgba(255,142,42,.55)}
.signal-icon.yellow .bar.on{background:#ffd447;border-color:#ffe58a;box-shadow:0 0 7px rgba(255,212,71,.50)}
.signal-icon.green .bar.on{background:#39ff14;border-color:#93ff81;box-shadow:0 0 8px rgba(57,255,20,.58)}
.snr-value{font-family:Consolas,monospace;font-weight:800;color:#d8eef7}
.decode-source{display:inline-block;border:1px solid rgba(57,255,20,.36);background:rgba(57,255,20,.10);color:#bffff0;font-size:10px;font-weight:1000;padding:2px 6px;border-radius:7px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;box-shadow:0 0 9px rgba(57,255,20,.10),inset 0 0 8px rgba(57,255,20,.035)}
.decode-source.demo{border-color:rgba(255,179,62,.35);background:rgba(255,179,62,.10);color:#ffd18f;box-shadow:0 0 9px rgba(255,179,62,.10),inset 0 0 8px rgba(255,179,62,.035)}
.decode-source.cq{border-color:rgba(57,255,20,.62);background:linear-gradient(180deg,rgba(57,255,20,.18),rgba(8,35,12,.32));color:#cffff0;text-shadow:0 0 7px rgba(57,255,20,.42);box-shadow:0 0 12px rgba(57,255,20,.22),inset 0 0 10px rgba(57,255,20,.07)}
.decode-source.confirmed{border-color:rgba(255,210,66,.78);background:linear-gradient(180deg,rgba(255,179,62,.25),rgba(145,58,0,.34));color:#fff3bd;text-shadow:0 0 8px rgba(255,216,77,.50);box-shadow:0 0 13px rgba(255,179,62,.30),0 0 20px rgba(255,72,22,.12),inset 0 0 10px rgba(255,216,77,.08)}
.ft8-table tr.confirmed-row{background:linear-gradient(90deg,rgba(255,179,62,.20),rgba(255,216,77,.08) 55%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(255,179,62,.95)}
.ft8-table tr.confirmed-row td.msgcell{color:#fff3bd;font-weight:850;text-shadow:0 0 7px rgba(255,179,62,.34)}
.country-cell{font-weight:800}.km-cell{font-family:Consolas,monospace;color:#cceeff}.dt-cell,.hz-cell{font-family:Consolas,monospace;color:#e8f8ff}
/* v23.58: Aufgabenliste Punkt 5 - Flaggen groesser, detailreicher und ohne eigenen Rahmen. */
.ft8-country-badge{display:inline-flex;align-items:center;gap:7px;vertical-align:middle;white-space:nowrap;color:#ffd18f}
.ft8-flag-icon{display:inline-flex;align-items:center;justify-content:center;width:27px;height:22px;border:0;background:transparent;box-shadow:none;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",system-ui,sans-serif;font-size:20px;line-height:1;overflow:visible;text-shadow:none;filter:saturate(1.12) contrast(1.04);transform:translateY(1px)}
.ft8-flag-icon.is-fallback{width:auto;min-width:24px;height:20px;font-family:Consolas,monospace;font-size:11px;color:#ffe2b7;font-weight:900;letter-spacing:.06em;filter:none;transform:none}
.ft8-country-code{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:18px;padding:0 5px;border:1px solid rgba(255,179,62,.32);background:rgba(255,179,62,.07);color:#ffe2b7;font-size:11px;font-weight:1000;letter-spacing:.08em;line-height:1;text-transform:uppercase;box-shadow:inset 0 0 7px rgba(255,179,62,.035)}
 .ft8-box-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.ft8-box-head h4{margin:0;color:var(--cyan);letter-spacing:.08em;font-size:12px}
.ft8-filterbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.ft8-filterbar label{font-size:10px;color:#ffd18f;font-weight:900;letter-spacing:.08em}
.ft8-filterbar input{width:170px;background:#031018;color:#dffbff;border:1px solid rgba(255,179,62,.42);padding:7px 8px;font-family:Consolas,monospace;font-weight:800;outline:none;box-shadow:inset 0 0 10px rgba(0,0,0,.35)}
.ft8-filterbar input:focus{border-color:rgba(255,179,62,.85);box-shadow:0 0 12px rgba(255,179,62,.16), inset 0 0 10px rgba(0,0,0,.35)}
.ft8-filterbar button{border:1px solid rgba(255,179,62,.45);background:linear-gradient(135deg,#351600,#7b2b08);color:#fff1d6;padding:7px 10px;font-weight:400;cursor:pointer}
.ft8-filter-status{display:inline-flex;align-items:center;justify-content:center;min-width:116px;height:30px;padding:0 12px;border:1px solid rgba(255,179,62,.75);background:linear-gradient(180deg,rgba(255,179,62,.24),rgba(122,45,0,.36));color:#fff1d6;font-family:Consolas,monospace;font-size:11px;font-weight:1000;letter-spacing:.045em;text-align:center;text-transform:uppercase;box-shadow:0 0 14px rgba(255,179,62,.28),0 0 22px rgba(255,78,20,.10),inset 0 0 10px rgba(255,216,77,.07);text-shadow:0 0 8px rgba(255,216,77,.42);white-space:nowrap;line-height:1}
.ft8-filter-status.filtered{border-color:rgba(255,210,66,.95);background:linear-gradient(180deg,rgba(255,210,66,.30),rgba(145,58,0,.44));color:#fff7c7;box-shadow:0 0 16px rgba(255,179,62,.36),0 0 24px rgba(255,78,20,.16),inset 0 0 12px rgba(255,216,77,.10)}

/* v24.33: Decode-Anzahl als orange WebFTR-Badge, passend zur neuen gruenen Trennlinie. */
.ft8-decode-count{
  order:99;
  margin-left:auto;
  min-width:126px;
  height:32px;
  border-color:rgba(255,179,62,.82)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.28),rgba(126,48,0,.66))!important;
  color:#fff0cf!important;
  box-shadow:0 0 14px rgba(255,179,62,.28),0 0 22px rgba(255,111,40,.12),inset 0 0 10px rgba(255,216,77,.08)!important;
  text-shadow:0 0 8px rgba(255,179,62,.50)!important;
}
.ft8-decode-count.filtered{
  border-color:rgba(255,214,93,.96)!important;
  background:linear-gradient(180deg,rgba(255,214,93,.34),rgba(145,58,0,.78))!important;
  color:#fff8d7!important;
  box-shadow:0 0 16px rgba(255,179,62,.38),0 0 26px rgba(255,111,40,.16),inset 0 0 11px rgba(255,216,77,.10)!important;
}
.ft8-table tr.prefix-row{background:linear-gradient(90deg,rgba(255,179,62,.22),rgba(0,232,255,.07) 60%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(255,179,62,.9)}
.ft8-table tr.prefix-row td.msgcell{color:#fff2dc;font-weight:850;text-shadow:0 0 7px rgba(255,179,62,.25)}

.ft8-exportbar{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.ft8-exportbar button{font-size:11px;padding:7px 10px;border-radius:8px;border:1px solid rgba(0,232,255,.42);background:rgba(0,232,255,.10);color:#dffcff;font-weight:400;letter-spacing:.04em;cursor:pointer}
.ft8-exportbar button:hover{border-color:rgba(255,179,62,.65);color:#ffd18f;box-shadow:0 0 10px rgba(255,179,62,.12)}
.ft8-session-info{width:30px;height:30px;padding:0!important;border:1px solid rgba(255,179,62,.62)!important;background:linear-gradient(180deg,rgba(255,179,62,.20),rgba(95,35,0,.38))!important;color:#ffd18f!important;font-size:14px!important;font-weight:400!important;font-family:Consolas,monospace!important;line-height:1!important;text-align:center!important;box-shadow:0 0 12px rgba(255,179,62,.18),inset 0 0 8px rgba(255,216,77,.06)!important}
.ft8-session-info:hover{border-color:rgba(255,216,77,.92)!important;color:#fff1d6!important;box-shadow:0 0 14px rgba(255,179,62,.30),inset 0 0 8px rgba(255,216,77,.10)!important}

.ft8-prefix-chip{display:inline-block;border:1px solid rgba(255,179,62,.50);background:rgba(255,179,62,.12);color:#ffd18f;font-size:10px;font-weight:1000;padding:2px 5px;border-radius:6px;margin-right:4px;letter-spacing:.04em}
.ft8-callbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.ft8-callbar label{font-size:10px;color:#9ffcff;font-weight:900;letter-spacing:.08em}
.ft8-callbar input{width:145px;background:#031018;color:#dffbff;border:1px solid rgba(0,232,255,.42);padding:7px 8px;font-family:Consolas,monospace;font-weight:900;text-transform:uppercase;outline:none;box-shadow:inset 0 0 10px rgba(0,0,0,.35)}
.ft8-callbar input:focus{border-color:rgba(0,232,255,.9);box-shadow:0 0 12px rgba(0,232,255,.16), inset 0 0 10px rgba(0,0,0,.35)}
.ft8-callbar button{border:1px solid rgba(0,232,255,.45);background:linear-gradient(135deg,#001b24,#00576a);color:#dffcff;padding:7px 10px;font-weight:400;cursor:pointer}
.ft8-callbar button:hover{border-color:rgba(255,179,62,.65);color:#ffd18f}
.ft8-table tr.call-row{background:linear-gradient(90deg,rgba(0,232,255,.20),rgba(255,179,62,.08) 70%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(0,232,255,.9)}
.ft8-table tr.call-row td.msgcell{color:#e9fdff;font-weight:850;text-shadow:0 0 7px rgba(0,232,255,.25)}
.ft8-countrybar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.ft8-countrybar label{font-size:10px;color:#ffd18f;font-weight:900;letter-spacing:.08em}
.ft8-countrybar input{width:112px;background:#031018;color:#fff1d6;border:1px solid rgba(255,179,62,.46);padding:7px 8px;font-family:Consolas,monospace;font-weight:900;text-transform:uppercase;outline:none;box-shadow:inset 0 0 10px rgba(0,0,0,.35)}
.ft8-countrybar input:focus{border-color:rgba(255,179,62,.9);box-shadow:0 0 12px rgba(255,179,62,.18), inset 0 0 10px rgba(0,0,0,.35)}
.ft8-countrybar button{border:1px solid rgba(255,179,62,.45);background:linear-gradient(135deg,#351600,#7b2b08);color:#fff1d6;padding:7px 10px;font-weight:400;cursor:pointer}
.ft8-countrybar button:hover{border-color:rgba(0,232,255,.65);color:#dffcff}
.ft8-table tr.country-row{background:linear-gradient(90deg,rgba(255,179,62,.18),rgba(255,92,56,.08) 62%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(255,179,62,.85)}
.ft8-table tr.country-row td.country-cell{color:#fff1d6;text-shadow:0 0 8px rgba(255,179,62,.22)}

/* v21.86 FT8 decode row hover */
.ft8-table tbody tr{
  transition:background .16s ease, box-shadow .16s ease, filter .16s ease;
}
.ft8-table tbody tr:hover{
  background:linear-gradient(90deg,rgba(255,179,62,.24),rgba(0,232,255,.10) 52%,rgba(255,92,56,.10))!important;
  box-shadow:inset 0 0 0 1px rgba(255,179,62,.42),inset 4px 0 0 rgba(255,179,62,.95),0 0 16px rgba(255,126,30,.10)!important;
  filter:brightness(1.10);
}
.ft8-table tbody tr:hover td{
  color:#fff7e8;
  text-shadow:0 0 7px rgba(255,179,62,.16);
}
.ft8-table tbody tr.cq-row:hover{
  background:linear-gradient(90deg,rgba(57,255,20,.26),rgba(255,179,62,.13) 55%,rgba(1,9,14,.58))!important;
  box-shadow:inset 0 0 0 1px rgba(57,255,20,.38),inset 4px 0 0 rgba(57,255,20,.95),0 0 16px rgba(57,255,20,.10)!important;
}
.ft8-table tbody tr.confirmed-row:hover{
  background:linear-gradient(90deg,rgba(255,179,62,.30),rgba(255,216,77,.13) 55%,rgba(1,9,14,.58))!important;
  box-shadow:inset 0 0 0 1px rgba(255,216,77,.42),inset 4px 0 0 rgba(255,179,62,.98),0 0 16px rgba(255,179,62,.13)!important;
}

.ft8-diag-toggle{
  border-color:rgba(255,179,62,.38)!important;
  background:linear-gradient(180deg,rgba(80,38,0,.78),rgba(24,10,0,.92))!important;
  color:#ffd18f!important;
}
.ft8-diag-toggle.active{
  border-color:rgba(255,179,62,.70)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.22),rgba(75,28,0,.86))!important;
  color:#fff2dc!important;
  box-shadow:0 0 12px rgba(255,179,62,.18),inset 0 0 8px rgba(255,179,62,.06)!important;
}
.ft8-table tr.diag-row td{
  color:#aeb8bd!important;
  opacity:.72;
  font-family:Consolas,monospace;
  font-size:10px;
  background:rgba(255,179,62,.035)!important;
}
.ft8-call-chip{display:inline-block;border:1px solid rgba(0,232,255,.55);background:rgba(0,232,255,.12);color:#9ffcff;font-size:10px;font-weight:1000;padding:2px 5px;border-radius:6px;margin-right:4px;letter-spacing:.04em}
.ft8-call-link{color:#9ffcff;text-decoration:none;font-weight:1000;letter-spacing:.03em;border-bottom:1px dotted rgba(0,232,255,.55);text-shadow:0 0 7px rgba(0,232,255,.22)}
.ft8-call-link:hover{color:#ffd18f;border-bottom-color:rgba(255,179,62,.85);text-shadow:0 0 9px rgba(255,179,62,.32)}
.ft8-locator-text{color:#b9ffc9;text-decoration:none;font-weight:400;letter-spacing:.03em;border-bottom:1px dotted rgba(110,255,151,.35);text-shadow:0 0 7px rgba(110,255,151,.16)}


/* v21.98: FT8 Audio-FFT base styles moved from index.html.
   Kept inside a cascade layer so the remaining unlayered legacy overrides in index.html
   keep their original priority. Do not add global selectors here. */
@layer webftr-ft8-audiofft-base {
/* FT8 Audio-FFT / dB-Meter */
.audiofft{width:100%;height:130px;background:#01060a;border:1px solid rgba(0,232,255,.22);display:none;margin-top:10px}
.audiofft.on{display:block}
.audiofft-wrap{display:none;margin:18px 0 8px;border:1px solid rgba(255,179,62,.28);background:linear-gradient(180deg,rgba(9,13,16,.92),rgba(0,0,4,.96));padding:8px}
.audiofft-wrap.on{display:block}
.audiofft-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.audiofft-label{font-size:12px;color:#ffd18f;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.audioPeakBadge{font-family:Consolas,monospace;font-size:12px;color:#ffcf9a;border:1px solid rgba(255,94,34,.55);background:rgba(60,14,0,.42);padding:4px 8px;font-weight:900;box-shadow:0 0 12px rgba(255,94,34,.12)}
.audiofft-toggle-row{display:flex;align-items:center;justify-content:flex-start;gap:10px;margin-top:8px;flex-wrap:wrap}
.audiofft-toggle-row .audioBtn{border:1px solid rgba(255,179,62,.55);background:linear-gradient(135deg,#351600,#7b2b08);color:#fff1d6;padding:8px 12px;font-weight:900;cursor:pointer;box-shadow:0 0 12px rgba(255,94,34,.12)}
.audiofft-toggle-row .audioBtn.active{background:linear-gradient(135deg,#7b2b08,#d85b19);color:#fff}
.audiofft-toggle-note{display:none!important;font-size:11px;color:#9fb2bd;font-weight:700}
.speakerBtn{border:1px solid rgba(0,232,255,.42);background:linear-gradient(135deg,#071a24,#0d3340);color:#dffbff;padding:8px 12px;font-size:17px;font-weight:400;cursor:pointer;min-width:48px;text-align:center;box-shadow:0 0 12px rgba(0,232,255,.10)}
.speakerBtn.active{border-color:rgba(255,96,38,.78);background:linear-gradient(135deg,#4a1200,#be3a14);color:#fff4e8;box-shadow:0 0 16px rgba(255,90,30,.26)}
.audioMonitorStatus{font-family:Consolas,monospace;font-size:11px;color:#9fb2bd;min-width:118px;text-align:right}
.audiofft-wrap.audio-muted .audiofft-grid{display:none}
.audiofft-wrap.audio-muted .audioPeakBadge{opacity:.55}
.audiofft-wrap.audio-muted .audiofft-label:after{content:" · AUS";color:#ff9b62}
.audiofft-grid{display:grid;grid-template-columns:62px 1fr;gap:8px;align-items:stretch}
.audioDbScale{height:142px;border-right:1px solid rgba(255,179,62,.22);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;padding:2px 6px 2px 0;color:#b9cbd4;font-family:Consolas,monospace;font-size:10px;line-height:1}
.audioDbScale span{position:relative;text-shadow:0 0 6px rgba(0,0,0,.8)}
.audioDbScale span:after{content:"";position:absolute;left:calc(100% + 5px);top:50%;width:8px;border-top:1px solid rgba(255,179,62,.28)}
.audiofft-wrap canvas.audiofft{margin:0;height:142px;border-color:rgba(255,179,62,.24);background:#000006}

}


/* v21.99: FT8 S-Meter CSS moved from index.html.
   Only .smeter-* selectors are included here. No global .panel/.meta/.slot/button/select selectors.
   v22.48: S-Meter is displayed as a larger top instrument block.
   v22.49: Hintergrund/Übergang weicher in den FT8-Container eingeblendet.
   v22.50: S-/dBm-Instrumentflächen mit durchgehendem Verlauf und S-Skala ohne dBm-Zusatzwerte.
   v22.51: Orange Mini-Badges für S-Wert/dBm und mehr Abstand zur Audio-FFT.
   v22.52: Titel-Badges und gestapeltes Ampel-S-Meter in der linken S-Meter-Spalte.
   v22.53: Linke S-Meter-Spalte vollständig für gestapelte Skala ohne Textkopf genutzt.
   v22.56: Linke S-Wert- und rechte dBm-Treppenanzeige gleich breit, dBm-Innenlabel entfernt, Glow-Politur. */
.smeter-wrap{
  --smeter-pct:0%;
  flex:1 1 100%;
  width:100%;
  min-width:0;
  margin:10px 0 20px;
  display:grid;
  grid-template-columns:126px minmax(300px,1.08fr) 192px minmax(300px,1.08fr) 126px;
  align-items:stretch;
  gap:12px;
  padding:12px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(255,168,91,.58)!important;
  background:
    radial-gradient(circle at 50% -18%,rgba(255,174,82,.18),rgba(255,174,82,.06) 24%,rgba(0,0,0,0) 58%),
    radial-gradient(ellipse at 50% 118%,rgba(0,232,255,.055),rgba(0,0,0,0) 54%),
    linear-gradient(180deg,rgba(1,14,20,.78),rgba(2,10,14,.92) 42%,rgba(8,9,10,.96) 100%);
  box-shadow:0 0 18px rgba(255,120,32,.13),0 0 24px rgba(0,232,255,.035), inset 0 0 0 1px rgba(255,255,255,.026), inset 0 0 30px rgba(255,144,52,.035);
  color:#fff2dc!important;
}
.smeter-wrap:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;
  background:
    linear-gradient(90deg,rgba(0,232,255,.045),rgba(255,179,62,.055) 50%,rgba(0,232,255,.045)),
    repeating-linear-gradient(180deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);
  mix-blend-mode:screen;
}
.smeter-wrap:after{
  content:"";position:absolute;inset:2px;pointer-events:none;
  border:1px solid rgba(255,255,255,.045);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),inset 0 -18px 28px rgba(0,0,0,.16);
}
.smeter-label,.smeter-readout,.smeter-meter,.smeter-center-readout{
  min-height:150px;
  border:1px solid rgba(255,170,92,.26);
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(0,0,0,.12)),linear-gradient(180deg,rgba(8,18,22,.80),rgba(5,8,10,.94));
  box-shadow:inset 0 0 14px rgba(255,165,79,.035), inset 0 0 0 1px rgba(255,255,255,.02), 0 0 12px rgba(0,0,0,.18);
}
.smeter-label{display:flex;align-items:stretch;justify-content:stretch;text-align:center;white-space:nowrap;padding:8px;gap:0;overflow:hidden}
/* v22.53: Linke S-Meter-Spalte ohne Textkopf; die gesamte Box gehört der gestapelten Ampel-/Temperaturskala. */
.smeter-stack-meter{position:relative;display:block;width:100%;height:100%;min-height:132px;margin:0;border:1px solid rgba(255,179,62,.42);background:radial-gradient(circle at 45% 100%,rgba(255,143,47,.12),rgba(0,0,0,0) 56%),linear-gradient(180deg,rgba(5,13,11,.95),rgba(2,5,5,.99));box-shadow:inset 0 0 18px rgba(0,0,0,.58),0 0 14px rgba(255,130,36,.12);overflow:hidden}
.smeter-stack-fill{position:absolute;left:12px;right:43px;bottom:8px;height:var(--smeter-pct);max-height:calc(100% - 16px);background:linear-gradient(0deg,#20ff73 0%,#a8ff45 42%,#ffd84a 62%,#ff9a33 80%,#ff4738 100%);box-shadow:0 0 12px rgba(57,255,108,.30),0 0 18px rgba(255,165,54,.18);z-index:1}
.smeter-stack-grid{position:absolute;left:12px;right:43px;top:8px;bottom:8px;background:repeating-linear-gradient(0deg,rgba(0,0,0,.72) 0 2px,transparent 2px 10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.055);z-index:2}
.smeter-stack-scale{position:absolute;right:6px;top:8px;bottom:8px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;z-index:4;pointer-events:none}
.smeter-stack-scale span{position:relative;min-width:34px;padding-right:2px;color:#ffe2b8;font-family:Consolas,monospace;font-size:10px;font-weight:1000;letter-spacing:-.02em;text-align:right;text-shadow:0 0 8px rgba(255,153,54,.34)}
.smeter-stack-scale span:before{content:'';position:absolute;right:38px;top:50%;width:10px;height:1px;background:rgba(255,210,142,.46);box-shadow:0 0 6px rgba(255,178,85,.20)}
.smeter-stack-meter:before{content:'';position:absolute;left:12px;right:43px;top:8px;bottom:8px;border-left:2px solid rgba(255,226,184,.34);border-right:1px solid rgba(255,226,184,.10);z-index:3;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.smeter-stack-meter:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0) 28%);pointer-events:none;z-index:5}
.smeter-meter{min-width:0;display:grid;grid-template-rows:auto 1fr;gap:5px;padding:7px 8px 8px;position:relative;overflow:hidden}
.smeter-meter-title{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:22px;color:#f6ddb5;font-size:13px;font-weight:1000;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 0 8px rgba(255,178,85,.20)}
/* v22.51: S-Wert-/dBm-Miniwerte als orange WebFTR-Badges statt losem Kleinsttext. */
.smeter-meter-title small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  padding:3px 8px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(255,126,30,.34),rgba(92,35,0,.78));
  color:#ffe2b8;
  box-shadow:0 0 13px rgba(255,126,30,.24),inset 0 0 10px rgba(255,224,168,.055);
  text-shadow:0 0 9px rgba(255,153,54,.38);
  font-size:12px;
  letter-spacing:.08em;
  font-family:Consolas,monospace;
  font-weight:1000;
  text-transform:none;
  white-space:nowrap;
  line-height:1;
}
/* v22.52: Titel links in den beiden Instrument-Spalten ebenfalls als orange WebFTR-Badges; dBm bleibt bewusst korrekt kleingroß geschrieben. */
.smeter-title-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:74px;
  padding:4px 9px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(255,126,30,.34),rgba(92,35,0,.78));
  color:#ffe2b8;
  box-shadow:0 0 13px rgba(255,126,30,.24),inset 0 0 10px rgba(255,224,168,.055);
  text-shadow:0 0 9px rgba(255,153,54,.38);
  font-size:12px;
  letter-spacing:.08em;
  font-family:Consolas,monospace;
  font-weight:1000;
  text-transform:none;
  white-space:nowrap;
  line-height:1;
}
.smeter-title-badge-dbm{min-width:54px;letter-spacing:.05em;text-transform:none}

.smeter-dial{position:relative;display:block;width:100%;min-height:132px;overflow:hidden;background:radial-gradient(circle at 50% 100%,rgba(255,143,47,.10),rgba(0,0,0,0) 42%),linear-gradient(180deg,rgba(25,25,25,.98),rgba(8,8,8,.98));box-shadow:inset 0 0 24px rgba(0,0,0,.55),inset 0 -1px 0 rgba(255,255,255,.04)}
/* v22.50: Den warmen analogen Verlauf über die komplette jeweilige Instrument-Spalte ziehen, nicht nur über den SVG-Dial-Bereich. */
.smeter-meter-s,
.smeter-meter-dbm{
  background:
    radial-gradient(circle at 50% 72%,rgba(255,143,47,.16),rgba(255,143,47,.055) 34%,rgba(0,0,0,0) 62%),
    radial-gradient(ellipse at 50% 10%,rgba(255,221,178,.07),rgba(0,0,0,0) 48%),
    linear-gradient(180deg,rgba(28,22,15,.96),rgba(11,10,9,.98) 58%,rgba(4,5,6,.98));
  box-shadow:inset 0 0 26px rgba(0,0,0,.52),inset 0 0 0 1px rgba(255,211,151,.035),0 0 14px rgba(255,143,47,.10);
}
.smeter-meter-s .smeter-dial,
.smeter-meter-dbm .smeter-dial{
  background:transparent;
  box-shadow:none;
}
.smeter-meter-s .smeter-meter-title,
.smeter-meter-dbm .smeter-meter-title{
  padding:0 2px 2px;
  border-bottom:1px solid rgba(255,179,92,.09);
}

.smeter-dial:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 34%);opacity:.85}
.smeter-svg{width:100%;height:132px;display:block;background:none;shape-rendering:geometricPrecision;text-rendering:geometricPrecision}
.smeter-svg text{font-family:Arial,Helvetica,sans-serif;dominant-baseline:middle;user-select:none}
.smeter-s-needle-group,.smeter-dbm-needle-group{transition:transform .22s ease;transform-origin:220px 112px}
.smeter-center-readout{min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:10px 8px;background:linear-gradient(180deg,rgba(5,18,16,.92),rgba(1,8,9,.98));border:1px solid rgba(57,255,20,.24);box-shadow:inset 0 0 18px rgba(57,255,20,.05),inset 0 0 0 1px rgba(255,255,255,.02),0 0 12px rgba(0,0,0,.16);text-align:center;overflow:hidden}
.smeter-center-head{display:inline-flex;align-items:center;justify-content:center;min-height:20px;padding:3px 8px;border:1px solid rgba(57,255,20,.32);background:rgba(57,255,20,.08);color:#bcffd3;font-family:Consolas,monospace;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;box-shadow:0 0 10px rgba(57,255,20,.10),inset 0 0 8px rgba(57,255,20,.04)}
.smeter-sevenseg{display:flex;align-items:center;justify-content:center;width:100%;max-width:170px;padding:7px 5px 6px;border:1px solid rgba(57,255,20,.46);background:linear-gradient(180deg,rgba(0,16,11,.99),rgba(0,4,3,1));box-shadow:inset 0 0 16px rgba(0,0,0,.74),0 0 14px rgba(57,255,20,.16),inset 0 0 0 1px rgba(145,255,164,.08)}
.smeter-center-mode{display:inline-flex;align-items:center;justify-content:center;min-width:78px;min-height:28px;padding:5px 10px;border:1px solid rgba(57,255,20,.40);background:linear-gradient(180deg,rgba(14,62,34,.54),rgba(0,20,12,.92));color:#d7ffe1;font-family:Consolas,monospace;font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 0 8px rgba(57,255,20,.34),0 0 14px rgba(57,255,20,.16);box-shadow:0 0 14px rgba(57,255,20,.14),inset 0 0 12px rgba(112,255,140,.08),inset 0 0 0 1px rgba(255,255,255,.03)}
.smeter-sevenseg-svg{display:block;width:100%;height:auto;max-width:158px;overflow:visible}
.smeter-sevenseg-svg .smeter-sevenseg-bg{fill:#03120b;stroke:rgba(111,255,134,.22);stroke-width:1.1;filter:drop-shadow(0 0 5px rgba(57,255,20,.12))}
.smeter-sevenseg-svg .seg-on{fill:#86ff6c;filter:drop-shadow(0 0 2px rgba(57,255,20,.75)) drop-shadow(0 0 6px rgba(57,255,20,.30))}
.smeter-sevenseg-svg .seg-off{fill:rgba(68,118,75,.16)}
.smeter-readout{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:8px 12px;line-height:1.02;text-align:center}
.smeter-readout small{font-size:10px;color:#d9b185;letter-spacing:.18em;font-weight:1000;text-shadow:0 0 8px rgba(255,173,96,.16)}
.smeter-s{font-size:36px;color:#f6ddb5;font-weight:1000;letter-spacing:.01em;text-shadow:0 0 10px rgba(255,178,85,.38),0 0 16px rgba(255,126,30,.18)}
.smeter-dbm{font-size:20px;color:#ffb56b;font-family:Consolas,monospace;white-space:nowrap;font-style:normal;text-shadow:0 0 8px rgba(255,160,72,.18)}
.smeter-wrap.smeter-hot{border-color:#ff6f50!important;box-shadow:0 0 22px rgba(255,92,56,.18), inset 0 0 0 1px rgba(255,255,255,.04), inset 0 0 30px rgba(255,92,56,.05)}
.smeter-hidden{display:none!important}
.smeter-toggle-row{display:flex;justify-content:flex-end;align-items:center;margin:-2px 0 10px;gap:8px}
.smeterToggle{min-width:150px}
.smeterToggle.active{letter-spacing:.05em}
.smeterToggle.off{letter-spacing:.05em}
@media(max-width:1280px){.smeter-wrap{grid-template-columns:112px minmax(240px,1fr) 168px minmax(240px,1fr) 112px;gap:9px;padding:10px}.smeter-svg{height:108px}.smeter-dial{min-height:108px}.smeter-label,.smeter-readout,.smeter-meter,.smeter-center-readout{min-height:126px}.smeter-meter-title{font-size:11px}.smeter-meter-title small{min-width:56px;font-size:11px;padding:3px 7px}.smeter-title-badge{min-width:64px;font-size:11px;padding:3px 7px}.smeter-stack-meter{min-height:108px}.smeter-stack-scale span{font-size:9px;min-width:31px}.smeter-stack-scale span:before{right:35px;width:8px}.smeter-s{font-size:31px}.smeter-dbm{font-size:17px}.smeter-sevenseg{max-width:150px;padding:6px 4px 5px}.smeter-sevenseg-svg{max-width:138px}.smeter-center-mode{min-width:70px;font-size:11px;letter-spacing:.14em}}
@media(max-width:900px){.smeter-wrap{grid-template-columns:1fr 1fr;gap:8px}.smeter-label,.smeter-readout,.smeter-center-readout{min-height:110px}.smeter-label{grid-column:1}.smeter-readout{grid-column:2}.smeter-center-readout{grid-column:1 / span 2;order:3}.smeter-stack-meter{min-height:94px}.smeter-meter{min-height:112px}.smeter-dial{min-height:92px}.smeter-svg{height:92px}.smeter-s{font-size:28px}.smeter-dbm{font-size:15px}.smeter-sevenseg{max-width:146px;padding:6px 4px 5px}.smeter-sevenseg-svg{max-width:132px}}
@media(max-width:640px){.smeter-wrap{grid-template-columns:1fr;gap:7px;padding:8px}.smeter-label,.smeter-readout,.smeter-meter,.smeter-center-readout{min-height:94px}.smeter-label,.smeter-readout,.smeter-center-readout{grid-column:auto}.smeter-stack-meter{min-height:78px}.smeter-dial{min-height:82px}.smeter-svg{height:82px}.smeter-meter-title{font-size:9px}.smeter-meter-title small{min-width:50px;font-size:10px;padding:3px 6px}.smeter-title-badge{min-width:56px;font-size:10px;padding:3px 6px}.smeter-s{font-size:24px}.smeter-dbm{font-size:14px}.smeter-sevenseg{max-width:138px;padding:6px 4px 5px}.smeter-sevenseg-svg{max-width:126px}.smeter-center-mode{min-width:66px;font-size:10px}}


/* v22.00: FT8 Waterfall CSS moved from index.html.
   Only .wfScale/.wfAxis/canvas.waterfall/.waterfall-block-hidden selectors are included here. */
.waterfall-block-hidden{display:none!important}
canvas.waterfall{width:100%;height:207px;background:#001018;border:1px solid rgba(0,232,255,.24);display:block}
.wfScale{min-height:34px;height:auto;display:flex;justify-content:space-between;align-items:center;color:#ffd18f;font-size:11px;font-weight:800;line-height:1.2;letter-spacing:.03em;border:1px solid rgba(255,179,62,.24);border-bottom:0;padding:7px 10px 8px;margin-top:16px;margin-bottom:0;background:linear-gradient(180deg,rgba(75,42,0,.22),rgba(0,20,28,.40));overflow:visible;box-sizing:border-box}
.wfScale span{position:relative;white-space:nowrap;text-shadow:0 0 8px rgba(255,179,62,.35);padding-top:1px}
.wfScale span:after{content:"";display:block;width:1px;height:8px;background:rgba(255,179,62,.58);margin:4px auto 0}
.wfAxis{height:20px;display:flex;justify-content:space-between;align-items:center;color:#73eaff;font-size:10px;letter-spacing:.04em;opacity:.82;border-left:1px solid rgba(0,232,255,.18);border-right:1px solid rgba(0,232,255,.18);border-bottom:1px solid rgba(0,232,255,.12);padding:1px 8px 0;margin-bottom:8px;background:rgba(0,20,28,.38);box-sizing:border-box}
/* v23.66: Waterfall scale minor ticks without extra frequency labels. */
.wfScale .wf-tick,.wfAxis .wf-tick{flex:1 1 0;text-align:center;min-width:0}
.wfScale .wf-tick-minor,.wfAxis .wf-tick-minor{font-size:0;color:transparent;opacity:.78}
.wfScale .wf-tick-minor:after{width:1px;height:6px;background:rgba(255,179,62,.38);margin:6px auto 0}
.wfAxis .wf-tick{position:relative;white-space:nowrap}
.wfAxis .wf-tick-minor:after{content:"";display:block;width:1px;height:6px;background:rgba(0,232,255,.38);margin:7px auto 0;box-shadow:0 0 6px rgba(0,232,255,.18)}

canvas.waterfall{
  image-rendering:auto !important;
}
canvas.waterfall{
  contain: layout paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  touch-action: pan-y;
}


/* v22.01: FT8 Live Info / Decode Health CSS moved from index.html.
   Only .ft8-controls/.ft8-live-chip and decoderStatus state selectors are included here. */
/* v21.73: kompaktere FT8 RX/Decode Liveinfos */
.ft8-controls{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(160px,1fr));
  gap:8px!important;
  align-items:stretch!important;
  margin:12px 0 10px!important;
  padding:8px!important;
  border:1px solid rgba(255,179,62,.24);
  background:linear-gradient(180deg,rgba(18,12,8,.84),rgba(0,8,12,.78));
  box-shadow:0 0 16px rgba(255,126,30,.08),inset 0 0 18px rgba(255,179,62,.035);
}
.ft8-live-chip,
.ft8-controls .ft8-clock,
.ft8-controls .decoderStatus,
.ft8-controls .streamStatus{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px;
  padding:6px 9px!important;
  border:1px solid rgba(255,179,62,.32);
  background:linear-gradient(180deg,rgba(255,179,62,.09),rgba(3,14,18,.55));
  color:#ffe2b8!important;
  font-family:Consolas,monospace!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.03em;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  box-shadow:0 0 10px rgba(255,126,30,.08),inset 0 0 8px rgba(255,179,62,.035);
}
.ft8-controls .ft8-clock{
  border-color:rgba(255,179,62,.55);
  color:#ffd18f!important;
  text-shadow:0 0 8px rgba(255,179,62,.22);
}
.ft8-controls .decoderStatus{
  border-color:rgba(0,232,255,.28);
  color:#dffcff!important;
  background:linear-gradient(180deg,rgba(0,232,255,.07),rgba(3,14,18,.55));
}
.ft8-controls .streamStatus{
  border-color:rgba(57,255,20,.24);
  color:#cffff0!important;
  background:linear-gradient(180deg,rgba(57,255,20,.055),rgba(3,14,18,.55));
}
.ft8-controls .ft8-clock:before,
.ft8-controls .decoderStatus:before,
.ft8-controls .streamStatus:before{
  display:inline-block;
  margin-right:7px;
  color:#9fb2bd;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.10em;
}
.ft8-controls .ft8-clock:before{content:"RX";color:#ffd18f}
.ft8-controls .decoderStatus:before{content:"DECODER";color:#9ffcff}
.ft8-controls .streamStatus:before{content:"STREAM";color:#b8ffd0}
.ft8-controls .decoderStatus{font-size:10px!important;letter-spacing:.01em}
@media(max-width:1000px){.ft8-controls{grid-template-columns:1fr}.ft8-controls .ft8-clock,.ft8-controls .decoderStatus,.ft8-controls .streamStatus{justify-content:flex-start!important;text-align:left}}


/* v21.76: FT8 decode health visibility */
.ft8-controls .decoderStatus.decode-ok{
  border-color:rgba(57,255,20,.30)!important;
  color:#d7ffd8!important;
  background:linear-gradient(180deg,rgba(57,255,20,.06),rgba(3,14,18,.55))!important;
}
.ft8-controls .decoderStatus.decode-warn{
  border-color:rgba(255,179,62,.62)!important;
  color:#ffd18f!important;
  background:linear-gradient(180deg,rgba(255,179,62,.13),rgba(28,12,0,.62))!important;
  box-shadow:0 0 13px rgba(255,179,62,.14),inset 0 0 8px rgba(255,179,62,.04)!important;
}
.ft8-controls .decoderStatus.decode-missing{
  border-color:rgba(255,76,76,.62)!important;
  color:#ffd0d0!important;
  background:linear-gradient(180deg,rgba(255,64,64,.14),rgba(26,0,0,.64))!important;
  box-shadow:0 0 13px rgba(255,64,64,.16),inset 0 0 8px rgba(255,64,64,.04)!important;
}



/* v22.02: FT8 controls fallback CSS moved from index.html.
   Scoped to .ft8-controls only; no global button/select rules. */
.ft8-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0}
.ft8-controls button{border:1px solid #168ea2;background:#071a24;color:#eaf7ff;padding:8px 12px;font-weight:400;cursor:pointer}
.ft8-controls button.active{background:linear-gradient(135deg,#125b22,#00a777);color:#fff}
.ft8-clock{font-family:Consolas,monospace;color:var(--orange);font-weight:800}


/* v22.02: FT8 audio/control toggle CSS moved from index.html.
   Only scoped audio/FT8 control selectors: .audioMode*, .audioInfoIcon, .audioFftToggle, .audioBtnText.
   No global .panel/.meta/.slot/.hw/button/select selectors. */
/* v21.31e: Kein Dropdown im Audio-Bereich. Nur echter Toggle-Button: Ges. Bandbreite hören / Peak hören. Preset-Auswahl bleibt unten beim Wasserfall. */
.audioModeSelect{display:none!important}
.audioModeToggle{border:1px solid #d43755!important;padding:8px 14px!important;color:#ffdce2!important;font-weight:400!important;background:linear-gradient(180deg,#a20d2d,#590016)!important;cursor:pointer;text-transform:uppercase;letter-spacing:.04em;box-shadow:0 0 14px rgba(212,55,85,.20), inset 0 0 10px rgba(255,255,255,.03)!important;min-width:218px;height:38px;display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.05}
.audioModeToggle.follow{border-color:#ffb347!important;color:#fff1d6!important;background:linear-gradient(180deg,#a94a07,#641c00)!important;box-shadow:0 0 16px rgba(255,126,30,.26), inset 0 0 10px rgba(255,255,255,.04)!important}
.audioModeToggle:hover{border-color:#ff5c78;box-shadow:0 0 16px rgba(255,64,96,.30), inset 0 0 10px rgba(255,255,255,.04)!important}
.audioInfoIcon{display:inline-flex;align-items:center;justify-content:center;width:25px;height:25px;border:1px solid rgba(159,252,255,.42);color:#9ffcff;background:rgba(0,26,34,.72);font-family:Consolas,monospace;font-size:15px;font-weight:950;border-radius:3px;cursor:help;box-shadow:0 0 10px rgba(0,232,255,.08)}
.audioInfoIcon:hover,.audioInfoIcon:focus{border-color:rgba(255,179,62,.75);color:#ffd18f;outline:0;box-shadow:0 0 12px rgba(255,179,62,.16)}
.audioModeHint{color:#bfefff!important}
@media(max-width:800px){.audiofft-toggle-row{flex-wrap:wrap}.audioModeToggle{font-size:12px;min-width:190px}}


/* v21.61: Audio-FFT Toggle im gleichen Stil wie WF/S-Meter */
.audiofft-toggle-row .audioFftToggle{
  border:1px solid #d43755!important;
  padding:8px 14px!important;
  color:#ffdce2!important;
  font-weight:1000!important;
  background:linear-gradient(180deg,#a20d2d,#590016)!important;
  cursor:pointer!important;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
  box-shadow:0 0 14px rgba(212,55,85,.20), inset 0 0 10px rgba(255,255,255,.03)!important;
  min-width:150px!important;
  text-align:center!important;
}
.audiofft-toggle-row .audioFftToggle.active{
  border-color:#ff5c78!important;
  color:#fff!important;
  background:linear-gradient(180deg,#b91338,#640019)!important;
  box-shadow:0 0 16px rgba(255,64,96,.30), inset 0 0 10px rgba(255,255,255,.04)!important;
}
.audiofft-toggle-row .audioFftToggle.off{
  border-color:#9c243c!important;
  color:#ffccd5!important;
  background:linear-gradient(180deg,#611022,#32000c)!important;
  box-shadow:0 0 10px rgba(212,55,85,.12), inset 0 0 10px rgba(0,0,0,.18)!important;
}


/* v21.62 audio FFT toggle style fix */
.audiofft-toggle-row .audioFftToggle{
  border:1px solid #d43755!important;
  padding:8px 14px!important;
  min-width:124px!important;
  min-height:37px!important;
  color:#ffdce2!important;
  font-weight:1000!important;
  background:linear-gradient(180deg,#a20d2d,#590016)!important;
  cursor:pointer;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
  box-shadow:0 0 14px rgba(212,55,85,.20), inset 0 0 10px rgba(255,255,255,.03)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1.05!important;
  transform:none!important;
  vertical-align:middle!important;
}
.audiofft-toggle-row .audioFftToggle.active{
  border-color:#ff5c78!important;
  color:#fff!important;
  background:linear-gradient(180deg,#b91338,#640019)!important;
  box-shadow:0 0 16px rgba(255,64,96,.30), inset 0 0 10px rgba(255,255,255,.04)!important;
}
.audiofft-toggle-row .audioFftToggle.off{
  border-color:#9c243c!important;
  color:#ffccd5!important;
  background:linear-gradient(180deg,#611022,#32000c)!important;
  box-shadow:0 0 10px rgba(212,55,85,.12), inset 0 0 10px rgba(0,0,0,.18)!important;
}
.audiofft-toggle-row .audioBtnText{
  display:block!important;
  margin:0!important;
  padding:0!important;
  line-height:1.05!important;
  transform:none!important;
}
.audiofft-toggle-row .audioBtn,
.audiofft-toggle-row .speakerBtn{
  transform:none!important;
}

/* v22.03: FT8 export/filter/control corner rules moved from global index reset.
   Keep these scoped to the FT8 module only. */
#card_FT8 .decode-source,
#card_FT8 .ft8-prefix-chip,
#card_FT8 .ft8-call-chip,
#card_FT8 .ft8-exportbar button,
#card_FT8 .ft8-session-info,
#card_FT8 .ft8-diag-toggle,
#card_FT8 .ft8-filter-status{
  border-radius:0!important;
}


/* v22.04: remaining tiny FT8-scoped CSS cleanup.
   Only .ft8-note and .ft8-table responsive rule were moved here.
   No global manager/slot/hardware/button/select selectors. */
.ft8-note{color:var(--muted);font-size:12px;margin-top:8px}
@media(max-width:900px){.ft8-table{font-size:12px}}


/* v22.55/v22.56: S-Meter Treppenanzeigen links/rechts flächig; v22.56 gleich breit, ohne dBm-Innenlabel, mit Glow-Politur. */
.smeter-wrap{--smeter-dbm-pct:0%;}
.smeter-label,.smeter-readout{padding:0;align-items:stretch;justify-content:stretch;}
.smeter-label,.smeter-dbm-stack-wrap{min-width:0;}
.smeter-stack-meter{
  border:0!important;
  min-height:152px;
  box-shadow:inset 0 0 24px rgba(0,0,0,.66),0 0 16px rgba(255,130,36,.12),0 0 22px rgba(32,255,115,.055);
}
.smeter-stack-fill{
  left:6px;right:38px;bottom:6px;max-height:calc(100% - 12px);
  box-shadow:0 0 14px rgba(57,255,108,.36),0 0 22px rgba(255,165,54,.20),inset 0 0 9px rgba(255,255,255,.08);
}
.smeter-stack-grid{left:6px;right:38px;top:6px;bottom:6px;}
.smeter-stack-scale{right:5px;top:6px;bottom:6px;}
.smeter-stack-scale span{min-width:34px;font-size:10px;color:#ffe2b8;text-shadow:0 0 8px rgba(255,153,54,.42),0 0 12px rgba(32,255,115,.10);}
.smeter-stack-scale span:before{right:37px;width:10px;background:rgba(255,210,142,.52);box-shadow:0 0 7px rgba(255,178,85,.28);}
.smeter-stack-meter:before{left:6px;right:38px;top:6px;bottom:6px;border-left:2px solid rgba(255,226,184,.34);border-right:0;box-shadow:none;}
.smeter-stack-meter:after{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,0) 28%),radial-gradient(circle at 50% 50%,rgba(255,179,62,.055),rgba(0,0,0,0) 62%);}
.smeter-dbm-stack-wrap{position:relative;}
.smeter-dbm-stack-meter{
  width:100%;height:100%;
  background:radial-gradient(circle at 50% 100%,rgba(255,143,47,.17),rgba(0,0,0,0) 58%),linear-gradient(180deg,rgba(8,12,12,.96),rgba(2,5,5,.99));
}
.smeter-dbm-stack-meter .smeter-stack-fill{height:var(--smeter-dbm-pct);background:linear-gradient(0deg,#2dff7e 0%,#b3ff4d 38%,#ffd84a 60%,#ff9a33 79%,#ff4738 100%);}
.smeter-dbm-stack-meter .smeter-stack-scale span{min-width:34px;color:#ffe2b8;}
.smeter-dbm-stack-meter .smeter-stack-scale span:before{right:37px;}
.smeter-readout .smeter-dbm{font-size:11px;font-style:normal;}
@media(max-width:1280px){.smeter-stack-meter{min-height:126px}.smeter-stack-scale span{font-size:9px;min-width:32px}.smeter-stack-scale span:before{right:35px;width:8px}.smeter-stack-fill,.smeter-stack-grid,.smeter-stack-meter:before{right:36px}}
@media(max-width:900px){.smeter-stack-meter{min-height:106px}}
@media(max-width:640px){.smeter-stack-meter{min-height:90px}.smeter-stack-scale span{font-size:9px}.smeter-stack-fill,.smeter-stack-grid,.smeter-stack-meter:before{right:35px}}


/* v22.57: letzter Punkt-5-Feinschliff: Treppenmeter ohne interne Linien, sauberer Glow, mehr Abstand zur Audio-FFT. */
.smeter-stack-grid{
  background:none!important;
  box-shadow:none!important;
}
.smeter-stack-meter:before,
.smeter-stack-scale span:before{
  display:none!important;
}
.smeter-stack-meter{
  box-shadow:
    inset 0 0 26px rgba(0,0,0,.66),
    inset 0 0 0 1px rgba(255,179,62,.055),
    0 0 18px rgba(255,130,36,.14),
    0 0 26px rgba(32,255,115,.075)!important;
}
.smeter-stack-fill{
  box-shadow:
    0 0 15px rgba(57,255,108,.42),
    0 0 24px rgba(255,165,54,.22),
    inset 0 0 10px rgba(255,255,255,.10)!important;
}
.smeter-dbm-stack-meter .smeter-stack-fill{
  box-shadow:
    0 0 15px rgba(57,255,108,.38),
    0 0 24px rgba(255,165,54,.20),
    inset 0 0 10px rgba(255,255,255,.09)!important;
}
.smeter-toggle-row{
  margin:-2px 0 24px!important;
}

/* v22.58: Punkt 6 - RX/Gain-Zeile und aktueller Tuner stehen im FT8-Modul gemeinsam in einer Zeile. */
#card_FT8 .ft8-rx-statusline{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin:4px 0 10px;
}
#card_FT8 .ft8-rx-statusline .freq{
  margin-bottom:0;
}
#card_FT8 .ft8-rx-statusline .activeSdrBadge{
  display:inline-flex;
  align-items:center;
  min-height:18px;
  border:1px solid #d43755;
  color:#ffdce5;
  background:linear-gradient(180deg,#8f0b27,#3b0010);
  box-shadow:0 0 14px rgba(212,55,85,.18), inset 0 0 12px rgba(255,255,255,.035);
  text-shadow:0 0 8px rgba(255,120,150,.22);
  padding:9px 12px;
  font-weight:1000;
  letter-spacing:.035em;
  text-transform:uppercase;
}
#card_FT8 .ft8-rx-statusline .tunerBadge{
  white-space:nowrap;
}
@media(max-width:720px){
  #card_FT8 .ft8-rx-statusline{align-items:stretch;}
  #card_FT8 .ft8-rx-statusline .freq,
  #card_FT8 .ft8-rx-statusline .activeSdrBadge{width:100%;justify-content:center;}
}


/* v22.59: Punkt 7 - WF-FPS und WF-SPAN als grüne Glow-Badges in der RX/Gain/Tuner-Zeile. */
#card_FT8 .ft8-waterfall-toggle-row{
  margin:6px 0 8px;
}
#card_FT8 .ft8-rx-statusline .fpsBadge,
#card_FT8 .ft8-rx-statusline .wfSpanBadge,
#card_FT8 .ft8-rx-statusline .ft8WfStatusBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:18px;
  border:1px solid rgba(66,255,138,.78)!important;
  color:#cbffd8!important;
  background:linear-gradient(180deg,rgba(5,78,31,.66),rgba(0,31,25,.88))!important;
  box-shadow:0 0 16px rgba(66,255,138,.24), inset 0 0 14px rgba(66,255,138,.12)!important;
  text-shadow:0 0 9px rgba(66,255,138,.45)!important;
  padding:9px 12px;
  font-weight:1000!important;
  letter-spacing:.035em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT8 .ft8-rx-statusline .wfSpanBadge b{
  color:#39ff7a!important;
  text-shadow:0 0 12px rgba(57,255,122,.62)!important;
}
#card_FT8 .ft8-rx-statusline .fpsBadge::before,
#card_FT8 .ft8-rx-statusline .wfSpanBadge::before{
  content:'';
  width:6px;
  height:6px;
  margin-right:7px;
  background:#39ff7a;
  box-shadow:0 0 10px rgba(57,255,122,.78);
}
@media(max-width:980px){
  #card_FT8 .ft8-rx-statusline .fpsBadge,
  #card_FT8 .ft8-rx-statusline .wfSpanBadge{
    flex:1 1 auto;
  }
}
@media(max-width:720px){
  #card_FT8 .ft8-rx-statusline .fpsBadge,
  #card_FT8 .ft8-rx-statusline .wfSpanBadge{
    width:100%;
  }
}

/* v22.69: FT8 Hz scope icon reference polish: square oscilloscope frame with waveform trace. */
#card_FT8 .ft8-table .hz-head,
#card_FT8 .ft8-table .hz-cell{
  text-align:center;
  vertical-align:middle;
  min-width:74px;
  width:78px;
  padding-left:4px;
  padding-right:4px;
}
#card_FT8 .ft8-table .hz-cell{
  line-height:1;
}
#card_FT8 .ft8-hz-scope{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:23px;
  border:1px solid rgba(57,255,20,.58);
  border-radius:0;
  background:linear-gradient(180deg,rgba(9,70,34,.94),rgba(3,35,18,.98));
  box-shadow:0 0 10px rgba(57,255,20,.20), inset 0 0 12px rgba(57,255,20,.10);
  overflow:hidden;
  vertical-align:middle;
}
#card_FT8 .ft8-hz-scope-svg{
  display:block;
  width:100%;
  height:100%;
}
#card_FT8 .ft8-hz-scope-grid-v line{
  stroke:rgba(0,0,0,.40);
  stroke-width:0.7;
}
#card_FT8 .ft8-hz-scope-grid-h line{
  stroke:rgba(0,0,0,.58);
  stroke-width:0.9;
  stroke-dasharray:1.5 2.4;
  stroke-linecap:round;
}
#card_FT8 .ft8-hz-scope-trace{
  fill:none;
  stroke:rgba(35,200,108,.58);
  stroke-width:1.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#card_FT8 .ft8-hz-scope-trace-hi{
  fill:none;
  stroke:#42ff8a;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 3px rgba(66,255,138,.65));
}
#card_FT8 .ft8-hz-scope.is-empty{
  border-color:rgba(159,185,198,.28);
  background:linear-gradient(180deg,rgba(18,32,28,.96),rgba(8,18,16,.98));
  box-shadow:inset 0 0 8px rgba(159,185,198,.08);
  opacity:.7;
}
#card_FT8 .ft8-hz-scope.is-empty .ft8-hz-scope-grid-v line,
#card_FT8 .ft8-hz-scope.is-empty .ft8-hz-scope-grid-h line{
  stroke:rgba(159,185,198,.18);
}



/* v22.71: FT8 toggle button polish - square Audio-FFT button and WF toggle below waterfall, right aligned. */
#card_FT8 .audiofft-toggle-row .audioFftToggle,
#card_FT8 .audiofft-toggle-row .audioFftToggle .audioBtnText{
  border-radius:0!important;
}
#card_FT8 .ft8-waterfall-toggle-row{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:100%;
  margin:8px 0 12px!important;
  padding:0;
}
#card_FT8 .ft8-waterfall-toggle-row .wfToggle{
  border-radius:0!important;
  min-width:92px;
  text-align:center;
}


/* v22.82: FT8 RX/WF/DEC-BW status line compact single-row polish. */
#card_FT8 .ft8-rx-statusline{
  flex-wrap:nowrap;
  align-items:center;
  gap:6px;
  margin:3px 0 8px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:thin;
}
#card_FT8 .ft8-rx-statusline .freq{
  flex:0 1 auto;
  min-width:0;
  white-space:nowrap;
  padding:7px 9px;
  font-size:12px;
  line-height:1.15;
}
#card_FT8 .ft8-rx-statusline .activeSdrBadge,
#card_FT8 .ft8-rx-statusline .fpsBadge,
#card_FT8 .ft8-rx-statusline .wfSpanBadge,
#card_FT8 .ft8-rx-statusline .ft8WfStatusBadge{
  flex:0 0 auto;
  min-height:14px;
  padding:7px 9px;
  font-size:11px;
  line-height:1.12;
  letter-spacing:.025em;
}
#card_FT8 .ft8-rx-statusline .fpsBadge::before,
#card_FT8 .ft8-rx-statusline .wfSpanBadge::before{
  width:5px;
  height:5px;
  margin-right:5px;
}
#card_FT8 .ft8-rx-statusline .ft8DecodeBwBadge{
  border-color:rgba(255,179,62,.72)!important;
  color:#ffe4b9!important;
  background:linear-gradient(180deg,rgba(92,48,6,.72),rgba(34,18,4,.90))!important;
  box-shadow:0 0 14px rgba(255,179,62,.18), inset 0 0 12px rgba(255,179,62,.08)!important;
  text-shadow:0 0 9px rgba(255,179,62,.34)!important;
}
#card_FT8 .ft8-rx-statusline .ft8DecodeBwBadge::before{
  background:#ffb33e;
  box-shadow:0 0 10px rgba(255,179,62,.70);
}
@media(max-width:720px){
  #card_FT8 .ft8-rx-statusline{align-items:center;}
  #card_FT8 .ft8-rx-statusline .freq,
  #card_FT8 .ft8-rx-statusline .activeSdrBadge,
  #card_FT8 .ft8-rx-statusline .fpsBadge,
  #card_FT8 .ft8-rx-statusline .wfSpanBadge{
    width:auto;
    justify-content:center;
  }
}

/* v22.87: FT8 status badge orange polish - WF-SPAN and DEC-BW stand out like WebFTR action buttons. */
#card_FT8 .ft8-rx-statusline .wfSpanBadge,
#card_FT8 .ft8-rx-statusline .ft8DecodeBwBadge{
  border-color:rgba(255,179,62,.92)!important;
  color:#fff1c9!important;
  background:linear-gradient(180deg,rgba(255,179,62,.34),rgba(103,48,0,.88) 44%,rgba(42,18,0,.96))!important;
  box-shadow:0 0 16px rgba(255,179,62,.34), inset 0 0 15px rgba(255,179,62,.13)!important;
  text-shadow:0 0 10px rgba(255,179,62,.58)!important;
}
#card_FT8 .ft8-rx-statusline .wfSpanBadge b,
#card_FT8 .ft8-rx-statusline .ft8DecodeBwBadge b{
  color:#ffd27e!important;
  text-shadow:0 0 12px rgba(255,179,62,.72)!important;
}
#card_FT8 .ft8-rx-statusline .wfSpanBadge::before,
#card_FT8 .ft8-rx-statusline .ft8DecodeBwBadge::before{
  background:#ffb33e!important;
  box-shadow:0 0 11px rgba(255,179,62,.86)!important;
}


/* v22.89: FT8 preset/WF-FFT toolbar polish under compact RX status line. */
#card_FT8 .preset-row.ft8-preset-toolbar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:6px;
  margin:0 0 8px!important;
  padding:0;
}
/* v23.53: PRESET/WF FFT label height matches the adjacent dropdowns. */
#card_FT8 .preset-row.ft8-preset-toolbar .small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:28px;
  min-height:28px;
  padding:0 8px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92));
  color:#ffe4b9;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08);
  text-shadow:0 0 9px rgba(255,179,62,.34);
  font-size:10px;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT8 .preset-row.ft8-preset-toolbar select{
  min-height:28px;
  max-width:260px;
  padding:6px 28px 6px 9px;
  border:1px solid rgba(255,179,62,.66);
  border-radius:0;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98));
  color:#fff1d6;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07);
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  outline:none;
}
#card_FT8 .preset-row.ft8-preset-toolbar select:focus{
  border-color:rgba(255,209,143,.96);
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10);
}
@media(max-width:720px){
  #card_FT8 .preset-row.ft8-preset-toolbar select{
    max-width:100%;
  }
}

/* v22.95: FT8 Audio-Info button orange polish - align height with Audio-FFT toggle. */
#card_FT8 .audiofft-toggle-row .audioInfoIcon{
  width:38px!important;
  min-width:38px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0!important;
  border-radius:0!important;
  border:1px solid rgba(255,179,62,.88)!important;
  color:#fff1d6!important;
  background:linear-gradient(180deg,#a94a07,#641c00)!important;
  box-shadow:0 0 16px rgba(255,126,30,.28), inset 0 0 10px rgba(255,255,255,.05)!important;
  font-size:16px!important;
  line-height:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  vertical-align:middle!important;
}
#card_FT8 .audiofft-toggle-row .audioInfoIcon:hover,
#card_FT8 .audiofft-toggle-row .audioInfoIcon:focus{
  border-color:rgba(255,216,77,1)!important;
  color:#ffffff!important;
  background:linear-gradient(180deg,#c8610a,#7a2600)!important;
  outline:0!important;
  box-shadow:0 0 20px rgba(255,179,62,.42), inset 0 0 12px rgba(255,216,77,.08)!important;
}


/* v23.55: Aufgabenliste Punkt 3 - FT8-Decode-Liste optisch entrahmen.
   Entfernt nur den blauen Außenrahmen der Decode-Liste und die Rahmen der orangefarbenen Info-Badges darüber.
   Tabellenlinien, Eingabefelder und Funktionslogik bleiben unverändert. */
#card_FT8 .ft8-box{
  border:0!important;
}
#card_FT8 .ft8-table-wrap{
  border:0!important;
}
#card_FT8 .ft8-box-head .ft8-filter-status,
#card_FT8 .ft8-box-head .ft8-session-info{
  border:0!important;
}

/* v23.56: Aufgabenliste Punkt 3 Nacharbeit - Status-/Decode-Bereich bündig zum Wasserfall.
   Entfernt nur den orangefarbenen Außen-/Content-Rahmen um die RX/Decoder/Stream-Statuszeile.
   Die einzelnen Badge-Ränder bleiben erhalten. Band Activity/Decode wird horizontal bündig
   zur Wasserfallbreite gezogen. Keine Decoder-, Stream- oder SDR-Logik geändert. */
#card_FT8 .ft8-controls{
  width:100%!important;
  box-sizing:border-box!important;
  border:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#card_FT8 .ft8-grid{
  width:100%!important;
  box-sizing:border-box!important;
}
#card_FT8 .ft8-box{
  width:100%!important;
  box-sizing:border-box!important;
  padding-left:0!important;
  padding-right:0!important;
}
#card_FT8 .ft8-box-head{
  padding-left:0!important;
  padding-right:0!important;
}

/* v23.57: Aufgabenliste Punkt 4 - RX-Dialfrequenz als gruenes Badge in der Decode-Tabelle. */
#card_FT8 .ft8-table .rx-freq-cell{
  font-family:Consolas,monospace;
  text-align:center;
  vertical-align:middle;
}
#card_FT8 .ft8-rx-freq-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:78px;
  height:20px;
  padding:0 8px;
  border:1px solid rgba(57,255,20,.42);
  border-radius:7px;
  background:linear-gradient(180deg,rgba(57,255,20,.18),rgba(5,44,16,.38));
  color:#cffff0;
  font-family:Consolas,monospace;
  font-size:10px;
  font-weight:900;
  letter-spacing:.035em;
  line-height:1;
  white-space:nowrap;
  text-shadow:0 0 7px rgba(57,255,20,.35);
  box-shadow:0 0 10px rgba(57,255,20,.16),inset 0 0 8px rgba(57,255,20,.055);
}


/* v23.60: Aufgabenliste Punkt 8 - X-Reset-Buttons neben FT8-Filterfeldern exakt auf Eingabehoehe bringen. */
#card_FT8 .ft8-filterbar input,
#card_FT8 .ft8-countrybar input,
#card_FT8 .ft8-callbar input{
  height:30px;
  min-height:30px;
  box-sizing:border-box;
  line-height:1;
}
#card_FT8 .ft8-filterbar button,
#card_FT8 .ft8-countrybar button,
#card_FT8 .ft8-callbar button{
  width:30px;
  height:30px;
  min-width:30px;
  min-height:30px;
  padding:0!important;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  font-size:16px;
  font-weight:800;
}

/* v23.61: Aufgabenliste Punkt 9 - Audio-Monitor Symbol eckig als Badge.
   Nur das hörbare Audio-Symbol im Audio-FFT-Modul wird optisch angepasst. */
#card_FT8 .audiofft-toggle-row .speakerBtn{
  border-radius:0!important;
  width:52px!important;
  min-width:52px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#eafff0!important;
  border:1px solid rgba(57,255,112,.82)!important;
  background:linear-gradient(180deg,rgba(9,104,42,.96),rgba(2,48,20,.98))!important;
  box-shadow:0 0 14px rgba(57,255,112,.22), inset 0 0 10px rgba(255,255,255,.04)!important;
}
#card_FT8 .audiofft-toggle-row .speakerBtn.active{
  color:#fff4ef!important;
  border-color:rgba(255,82,52,.88)!important;
  background:linear-gradient(180deg,rgba(174,34,18,.98),rgba(82,7,3,.99))!important;
  box-shadow:0 0 16px rgba(255,82,52,.28), inset 0 0 10px rgba(255,255,255,.05)!important;
}
#card_FT8 .audiofft-toggle-row .speakerBtn .speakerIcon{
  width:25px!important;
  height:25px!important;
}
#card_FT8 .audiofft-toggle-row .speakerBtn .speakerIcon svg{
  width:25px!important;
  height:25px!important;
  stroke-width:2.15!important;
}

/* v23.62: Aufgabenliste Punkt 10 - Band-Activity-Text durch lokalen UTC-Sync ersetzen.
   Das Widget nutzt das lokale WebFTR-Backend als Zeitquelle und kontaktiert keine externen APIs. */
#card_FT8 .ft8-utc-sync-widget{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 10px;
  border:1px solid rgba(57,255,20,.34);
  background:linear-gradient(180deg,rgba(57,255,20,.075),rgba(2,13,10,.62));
  color:#cffff0;
  font-family:Consolas,monospace;
  font-size:11px;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 0 12px rgba(57,255,20,.10), inset 0 0 9px rgba(57,255,20,.035);
}
#card_FT8 .ft8-utc-sync-widget:before{
  content:"TIME";
  display:inline-block;
  margin-right:7px;
  color:#ffd18f;
  font-size:9px;
  font-weight:900;
  letter-spacing:.10em;
}
#card_FT8 .ft8-utc-sync-widget.is-synced{
  border-color:rgba(57,255,20,.44);
  color:#d9ffe2;
}
#card_FT8 .ft8-utc-sync-widget.is-fallback{
  border-color:rgba(255,179,62,.36);
  color:#ffe2b8;
  background:linear-gradient(180deg,rgba(255,179,62,.075),rgba(14,8,2,.58));
}
@media(max-width:900px){
  #card_FT8 .ft8-utc-sync-widget{width:100%;justify-content:flex-start;white-space:normal;}
}


/* v23.63: Aufgabenliste Punkt 11 - WF EIN/AUS unter dem Wasserfall etwas tiefer setzen.
   Nur Abstand der bestehenden Toggle-Zeile anpassen; keine Wasserfall- oder Button-Logik. */
#card_FT8 .ft8-waterfall-toggle-row{
  margin-top:16px!important;
  margin-bottom:12px!important;
}

/* v23.64: Aufgabenliste Punkt 12 - FT8-spezifische Button-Schriften nicht fett.
   Diese Datei lädt nach index.html, daher hier zusätzlich scoped überschreiben. */
#card_FT8 button,
#card_FT8 button *,
#card_FT8 .wfToggle,
#card_FT8 .audioModeToggle,
#card_FT8 .audioBtnText,
#card_FT8 .speakerBtn,
#card_FT8 .ft8-session-info,
#card_FT8 .ft8-filterbar button,
#card_FT8 .ft8-callbar button,
#card_FT8 .ft8-countrybar button,
#card_FT8 .ft8-exportbar button,
#card_FT8 .ft8-controls button{
  font-weight:400!important;
}

/* v23.65: Aufgabenliste Punkt 13 - CSV/PDF Buttons als EXPORT beschriften
   und hoehenmaessig an die FT8-Filter-/Textfelder angleichen. */
#card_FT8 .ft8-exportbar button:not(.ft8-session-info){
  height:30px;
  min-height:30px;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 11px!important;
  line-height:1;
  white-space:nowrap;
}
#card_FT8 .ft8-exportbar{
  align-items:center;
}



/* v23.70: Aufgabenliste Punkt 18 - finale FT8-Content-Rahmen-Bereinigung.
   Entfernt die restlichen aeusseren Content-Rahmen/Panel-Effekte um die drei
   RX/Decoder/Stream-Badges sowie um den Decode-Tabellenbereich. Einzelne
   Badge-/Button-Raender, Filterfelder, Tabellenzeilen und Export-Controls bleiben erhalten. */
#card_FT8 .ft8-controls{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding-left:0!important;
  padding-right:0!important;
}
#card_FT8 .ft8-grid,
#card_FT8 .ft8-box{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#card_FT8 .ft8-table-wrap{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
#card_FT8 .ft8-box-head{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}


/* v23.72: Neuer FT8-Wasserfall-Kontrollstreifen.
   RX-Frequenz, PRESET, WF FFT, WF-SPAN, DEC-BW und der WF EIN/AUS-Button
   sitzen linksbuendig in einer gemeinsamen Zeile direkt unter dem Wasserfall.
   Nur Layout/CSS; keine SDR-, Wasserfall-, Audio- oder Decoder-Logik. */
#card_FT8 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  display:flex;
  justify-content:flex-start!important;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  width:100%;
  box-sizing:border-box;
  margin-top:12px!important;
  margin-bottom:12px!important;
  padding:0!important;
}
#card_FT8 .ft8-wf-control-row .wfToggle{
  flex:0 0 auto;
  height:28px;
  min-height:28px;
  min-width:78px;
  padding:0 10px!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
#card_FT8 .ft8-wf-control-row .ft8-wf-inline-badge,
#card_FT8 .ft8-wf-control-row .wfSpanBadge,
#card_FT8 .ft8-wf-control-row .ft8WfStatusBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:28px;
  min-height:28px;
  padding:0 9px!important;
  font-size:10.5px!important;
  line-height:1!important;
  letter-spacing:.025em!important;
  white-space:nowrap;
  flex:0 0 auto;
}
#card_FT8 .ft8-wf-control-row .ft8-wf-inline-badge{
  border:1px solid rgba(66,255,138,.72);
  color:#cbffd8;
  background:linear-gradient(180deg,rgba(5,78,31,.62),rgba(0,31,25,.90));
  box-shadow:0 0 14px rgba(66,255,138,.20), inset 0 0 12px rgba(66,255,138,.10);
  text-shadow:0 0 9px rgba(66,255,138,.36);
  text-transform:uppercase;
}
#card_FT8 .ft8-wf-control-row .ft8-wf-inline-badge b{
  color:#39ff7a;
  margin-right:3px;
  text-shadow:0 0 10px rgba(57,255,122,.56);
}
#card_FT8 .ft8-wf-control-row .ft8-wf-inline-badge::before{
  content:'';
  width:5px;
  height:5px;
  margin-right:6px;
  background:#39ff7a;
  box-shadow:0 0 10px rgba(57,255,122,.74);
}
#card_FT8 .ft8-wf-control-row .ft8-inline-select{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  height:28px;
  min-height:28px;
  margin:0;
  flex:0 0 auto;
}
#card_FT8 .ft8-wf-control-row .ft8-inline-select .small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:28px;
  min-height:28px;
  padding:0 7px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92));
  color:#ffe4b9;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08);
  text-shadow:0 0 9px rgba(255,179,62,.34);
  font-size:10px;
  font-weight:400!important;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT8 .ft8-wf-control-row .ft8-inline-select select{
  height:28px;
  min-height:28px;
  max-width:230px;
  padding:4px 24px 4px 8px;
  border:1px solid rgba(255,179,62,.66);
  border-radius:0;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98));
  color:#fff1d6;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07);
  font-size:11px;
  font-weight:400!important;
  letter-spacing:.02em;
  outline:none;
}
#card_FT8 .ft8-wf-control-row .ft8-inline-select select:focus{
  border-color:rgba(255,209,143,.96);
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10);
}
@media(max-width:920px){
  #card_FT8 .ft8-wf-control-row .ft8-inline-select,
  #card_FT8 .ft8-wf-control-row .ft8-inline-select select,
  #card_FT8 .ft8-wf-control-row .ft8-wf-inline-badge,
  #card_FT8 .ft8-wf-control-row .wfSpanBadge,
  #card_FT8 .ft8-wf-control-row .ft8WfStatusBadge{
    flex:1 1 auto;
  }
}
@media(max-width:640px){
  #card_FT8 .ft8-wf-control-row .wfToggle,
  #card_FT8 .ft8-wf-control-row .ft8-inline-select,
  #card_FT8 .ft8-wf-control-row .ft8-wf-inline-badge,
  #card_FT8 .ft8-wf-control-row .wfSpanBadge,
  #card_FT8 .ft8-wf-control-row .ft8WfStatusBadge{
    width:100%;
    justify-content:flex-start;
  }
  #card_FT8 .ft8-wf-control-row .ft8-inline-select select{
    flex:1 1 auto;
    max-width:none;
  }
}

/* v24.24/v24.25: FT8 UI bundle - Dropdowns oberhalb Wasserfall rechts, mehr Abstand zur Decode-Liste und interne Grid-Locator-Karte. */
#card_FT8 .ft8-wf-top-select-row{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:20px 0 7px!important;
  padding:0;
  width:100%;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  height:30px;
  min-height:30px;
  margin:0;
  flex:0 0 auto;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select .small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:30px;
  min-height:30px;
  padding:0 8px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92));
  color:#ffe4b9;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08);
  text-shadow:0 0 9px rgba(255,179,62,.34);
  font-size:10px;
  font-weight:400!important;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select select{
  height:30px;
  min-height:30px;
  max-width:255px;
  padding:4px 26px 4px 8px;
  border:1px solid rgba(255,179,62,.66);
  border-radius:0;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98));
  color:#fff1d6;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07);
  font-size:11px;
  font-weight:400!important;
  letter-spacing:.02em;
  outline:none;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select select:focus{
  border-color:rgba(255,209,143,.96);
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10);
}
#card_FT8 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  margin-bottom:24px!important;
}
#card_FT8 .ft8-grid{
  margin-top:20px!important;
}
/* v24.47: Alte FT8-interne Grid-/Maidenhead-Karten-CSS entfernt. Neue zentrale GridLocator-Plugin-Planung siehe frontend/plugins/gridlocator/README.md. */
/* v24.24: FT8-klickbare Buttons im gleichen Verlauf halten; Badges/Spans bleiben unberuehrt. */
#card_FT8 button,
#card_FT8 .btn{
  border:1px solid rgba(0,232,255,.56)!important;
  color:#f3fdff!important;
  background:radial-gradient(circle at 28% 0,rgba(255,255,255,.18),transparent 38%),linear-gradient(135deg,rgba(0,232,255,.30),rgba(0,80,118,.88) 45%,rgba(18,36,54,.96))!important;
  box-shadow:0 0 16px rgba(0,232,255,.18),inset 0 0 13px rgba(0,232,255,.075)!important;
  text-shadow:0 0 8px rgba(0,232,255,.34)!important;
  cursor:pointer;
  transition:filter .16s ease,transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
#card_FT8 button:hover,
#card_FT8 .btn:hover{
  filter:brightness(1.18);
  transform:translateY(-1px);
  border-color:rgba(255,209,143,.78)!important;
}


/* v24.25: FT8 Dropdown Restore + Decode Badge/Spacing Fix.
   Nur UI/CSS: PRESET/WF FFT bleiben sichtbar oben rechts, mehr Luft vor der Decode-Liste,
   Decode-Anzahl bekommt wieder einen klaren gruenen Neon-Rand trotz alter Rahmen-Cleanup-Regeln. */
#card_FT8 .ft8-wf-top-select-row{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  margin:24px 0 10px!important;
  padding-right:2px!important;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select select{
  display:inline-block!important;
  visibility:visible!important;
  opacity:1!important;
}
#card_FT8 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  margin-bottom:34px!important;
}
#card_FT8 .ft8-controls{
  margin-top:6px!important;
  margin-bottom:14px!important;
}
#card_FT8 .ft8-grid{
  margin-top:28px!important;
}
#card_FT8 .ft8-box-head .ft8-filter-status.ft8-decode-count{
  border:1px solid rgba(255,179,62,.88)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.30),rgba(126,48,0,.72))!important;
  color:#fff0cf!important;
  box-shadow:0 0 15px rgba(255,179,62,.32),0 0 24px rgba(255,111,40,.13),inset 0 0 11px rgba(255,216,77,.09)!important;
  text-shadow:0 0 9px rgba(255,179,62,.54)!important;
}
#card_FT8 .ft8-box-head .ft8-filter-status.ft8-decode-count.filtered{
  border-color:rgba(255,214,93,.98)!important;
  background:linear-gradient(180deg,rgba(255,214,93,.36),rgba(145,58,0,.80))!important;
  color:#fff8d7!important;
  box-shadow:0 0 18px rgba(255,179,62,.40),0 0 28px rgba(255,111,40,.17),inset 0 0 12px rgba(255,216,77,.12)!important;
}
@media(max-width:800px){
  #card_FT8 .ft8-wf-top-select-row{justify-content:flex-start!important;margin-top:18px!important;}
}


/* v24.26: FT8 Aktions-Toggle-Logik.
   Wenn eine Funktion aktiv ist, zeigt der Button die naechste Aktion in Rot: AUS.
   Wenn eine Funktion inaktiv ist, zeigt der Button die naechste Aktion in Gruen: EIN.
   Bewusst nur die echten FT8-Steuerbuttons, keine Badges/Chips. */
#card_FT8 .smeterToggle.active,
#card_FT8 .audiofft-toggle-row .audioFftToggle.active,
#card_FT8 .ft8-wf-control-row .wfToggle.active,
#card_FT8 .audiofft-toggle-row .speakerBtn.active{
  color:#fff6f1!important;
  border-color:rgba(255,82,52,.92)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(180deg,rgba(190,36,18,.98),rgba(88,8,4,.99))!important;
  box-shadow:0 0 18px rgba(255,82,52,.30), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,120,80,.34)!important;
}
#card_FT8 .smeterToggle.off,
#card_FT8 .audiofft-toggle-row .audioFftToggle.off,
#card_FT8 .ft8-wf-control-row .wfToggle.off,
#card_FT8 .audiofft-toggle-row .speakerBtn.off,
#card_FT8 .audiofft-toggle-row .speakerBtn:not(.active){
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
  text-shadow:0 0 9px rgba(57,255,112,.32)!important;
}
#card_FT8 .smeterToggle,
#card_FT8 .audiofft-toggle-row .audioFftToggle,
#card_FT8 .ft8-wf-control-row .wfToggle{
  font-weight:1000!important;
  letter-spacing:.08em!important;
}



/* v24.54: GridLocator MAP Toggle exakt wie die anderen Aktions-Toggles:
   Map sichtbar = rote Aktion MAP AUS, Map verborgen = gruene Aktion MAP EIN. */
#card_FT8 .ft8-gridlocator-toggle-row .gridlocatorToggle.active{
  color:#fff6f1!important;
  border-color:rgba(255,82,52,.92)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(180deg,rgba(190,36,18,.98),rgba(88,8,4,.99))!important;
  box-shadow:0 0 18px rgba(255,82,52,.30), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,120,80,.34)!important;
}
#card_FT8 .ft8-gridlocator-toggle-row .gridlocatorToggle.off{
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
  text-shadow:0 0 9px rgba(57,255,112,.32)!important;
}
#card_FT8 .ft8-gridlocator-toggle-row .gridlocatorToggle{
  font-weight:400!important;
  letter-spacing:.08em!important;
}

/* v24.27: Aufgabe 2 - FT8 Modul-Schliessen bleibt auch nach FT8 Button-Verlaufsregeln klar rot. */
#card_FT8 .close-btn{
  border:1px solid rgba(255,82,88,.92)!important;
  color:#fff4f4!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.18),transparent 38%),
    linear-gradient(180deg,rgba(196,25,42,.98),rgba(76,0,16,.99))!important;
  box-shadow:0 0 18px rgba(255,60,82,.32), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,125,130,.38)!important;
  text-transform:uppercase!important;
  letter-spacing:.055em!important;
  z-index:20;
}
#card_FT8 .close-btn:hover{
  border-color:rgba(255,150,150,.98)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.22),transparent 38%),
    linear-gradient(180deg,rgba(232,42,58,.99),rgba(104,0,20,.99))!important;
  box-shadow:0 0 22px rgba(255,70,90,.44), inset 0 0 13px rgba(255,255,255,.07)!important;
  filter:brightness(1.08);
}

/* v24.28: UI step 3 - FT8 Decode Präfix/Land filter text fields blue border.
   Only the editable text fields are changed; clear buttons and non-clickable badges stay unchanged. */
#card_FT8 .ft8-filterbar input.ft8-prefix-input,
#card_FT8 .ft8-countrybar input.ft8-country-input{
  border-color:rgba(0,186,255,.78)!important;
  box-shadow:0 0 12px rgba(0,186,255,.15), inset 0 0 10px rgba(0,0,0,.35)!important;
}
#card_FT8 .ft8-filterbar input.ft8-prefix-input:focus,
#card_FT8 .ft8-countrybar input.ft8-country-input:focus{
  border-color:rgba(0,232,255,.95)!important;
  box-shadow:0 0 16px rgba(0,232,255,.28), inset 0 0 10px rgba(0,0,0,.35)!important;
}


/* v24.29: UI step 4 - interne FT8 Grid-Locator-Karte mit groben schematischen Kontinent-/Landmassenlinien, ohne externe Tiles/CDNs. */

/* v24.30: UI step 5 - grüne WebFTR-Trennlinien zwischen S-Meter, Audio-FFT, Wasserfall und Decode-Liste. */
#card_FT8 .ft8-section-separator{
  position:relative;
  width:100%;
  height:22px;
  margin:16px 0 18px;
  pointer-events:none;
  user-select:none;
  opacity:.96;
}
#card_FT8 .ft8-section-separator::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(66,255,138,.18) 9%,rgba(66,255,138,.88) 24%,rgba(159,252,255,.58) 50%,rgba(66,255,138,.88) 76%,rgba(66,255,138,.18) 91%,transparent);
  box-shadow:0 0 10px rgba(66,255,138,.28),0 0 20px rgba(66,255,138,.10);
}
#card_FT8 .ft8-section-separator::after{
  content:"";
  position:absolute;
  left:9%;
  right:9%;
  top:50%;
  height:7px;
  transform:translateY(-50%);
  background:repeating-linear-gradient(115deg,transparent 0 16px,rgba(66,255,138,.40) 16px 18px,transparent 18px 34px);
  opacity:.62;
  filter:drop-shadow(0 0 5px rgba(66,255,138,.22));
}
#card_FT8 .ft8-section-separator span{
  position:absolute;
  left:50%;
  top:50%;
  width:78px;
  height:4px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(66,255,138,.62);
  background:linear-gradient(90deg,rgba(0,20,9,.92),rgba(66,255,138,.45),rgba(0,20,9,.92));
  box-shadow:0 0 12px rgba(66,255,138,.34),inset 0 0 8px rgba(66,255,138,.12);
}
#card_FT8 .ft8-section-separator-smeter{margin-top:14px;margin-bottom:18px;}
#card_FT8 .ft8-section-separator-audiofft{margin-top:18px;margin-bottom:22px;}
#card_FT8 .ft8-section-separator-waterfall{margin-top:20px;margin-bottom:18px;}
#card_FT8 .ft8-section-separator-decodes{margin-top:10px;margin-bottom:12px;}
#card_FT8 .smeter-hidden + .smeter-toggle-row + .ft8-section-separator-smeter{
  opacity:.58;
}
@media(max-width:760px){
  #card_FT8 .ft8-section-separator{height:18px;margin:12px 0 14px;}
  #card_FT8 .ft8-section-separator span{width:54px;}
}

/* v24.34: S-Meter layout polish + normal badge/button font weight.
   Outer green S/dBm stacks are slimmer, the center RX-FREQ seven-segment field is wider,
   and RX FREQ + mode badges sit side-by-side above the display. */
#card_FT8 .smeter-wrap{
  grid-template-columns:96px minmax(270px,1fr) 250px minmax(270px,1fr) 96px!important;
  gap:10px!important;
}
#card_FT8 .smeter-label,
#card_FT8 .smeter-readout{
  min-width:0!important;
}
#card_FT8 .smeter-center-readout{
  gap:9px!important;
  padding:10px 10px!important;
  min-width:0!important;
}
#card_FT8 .smeter-center-head-row{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
}
#card_FT8 .smeter-center-head,
#card_FT8 .smeter-center-mode{
  flex:1 1 0!important;
  min-width:0!important;
  max-width:112px!important;
  min-height:24px!important;
  padding:4px 8px!important;
  font-size:10.5px!important;
  font-weight:400!important;
  letter-spacing:.13em!important;
  white-space:nowrap!important;
}
#card_FT8 .smeter-sevenseg{
  max-width:232px!important;
  padding:8px 6px 7px!important;
}
#card_FT8 .smeter-sevenseg-svg{
  max-width:218px!important;
}
@media(max-width:1280px){
  #card_FT8 .smeter-wrap{grid-template-columns:82px minmax(230px,1fr) 222px minmax(230px,1fr) 82px!important;gap:8px!important;}
  #card_FT8 .smeter-sevenseg{max-width:208px!important;}
  #card_FT8 .smeter-sevenseg-svg{max-width:196px!important;}
  #card_FT8 .smeter-center-head,
  #card_FT8 .smeter-center-mode{font-size:10px!important;padding:4px 7px!important;}
}
@media(max-width:900px){
  #card_FT8 .smeter-wrap{grid-template-columns:1fr 1fr!important;}
  #card_FT8 .smeter-center-readout{grid-column:1 / span 2!important;order:3!important;}
  #card_FT8 .smeter-sevenseg{max-width:236px!important;}
  #card_FT8 .smeter-sevenseg-svg{max-width:220px!important;}
}
@media(max-width:640px){
  #card_FT8 .smeter-wrap{grid-template-columns:1fr!important;}
  #card_FT8 .smeter-center-readout{grid-column:auto!important;}
}
#card_FT8 button,
#card_FT8 button *,
#card_FT8 .smeter-title-badge,
#card_FT8 .smeter-meter-title small,
#card_FT8 .smeter-center-head,
#card_FT8 .smeter-center-mode,
#card_FT8 .ft8-filter-status,
#card_FT8 .ft8-decode-count,
#card_FT8 .ft8-wf-inline-badge,
#card_FT8 .wfSpanBadge,
#card_FT8 .fpsBadge,
#card_FT8 .activeSdrBadge,
#card_FT8 .ft8WfStatusBadge,
#card_FT8 .ft8DecodeBwBadge,
#card_FT8 .ft8-session-info,
#card_FT8 .ft8-utc-sync-widget,
#card_FT8 .prefix-chip,
#card_FT8 .call-chip,
#card_FT8 .state-badge,
#card_FT8 .qso-badge,
#card_FT8 .dx-badge{
  font-weight:400!important;
}

/* v24.34 final: explicit normal-weight override for older high-specificity FT8 button/badge rules. */
#card_FT8 .smeterToggle,
#card_FT8 .audiofft-toggle-row .audioFftToggle,
#card_FT8 .ft8-wf-control-row .wfToggle,
#card_FT8 .audiofft-toggle-row .speakerBtn,
#card_FT8 .audiofft-toggle-row .audioBtn,
#card_FT8 .audioModeToggle,
#card_FT8 .close-btn,
#card_FT8 .decode-source,
#card_FT8 .ft8-country-code,
#card_FT8 .ft8-prefix-chip,
#card_FT8 .ft8-call-chip,
#card_FT8 .audioPeakBadge,
#card_FT8 .smeter-stack-scale span,
#card_FT8 .smeter-meter-title,
#card_FT8 .smeter-readout small{
  font-weight:400!important;
}


/* v24.70 FT4 mirrored FT8 CSS scope: FT4 shares the proven FT8 control/table/button styling. */
/* WebFTR FT8 Frontend Module CSS - v22.06
   Refactor-Schritt 2: erste echte FT8-CSS-Regeln aus index.html ausgelagert.
   Keine Funktionsänderung: diese Datei zentralisiert FT8-spezifische UI-Regeln. */

#card_FT4{
  --webftr-ft8-module-css: "v22.06";
}

#card_FT4 .ft8-table tbody tr,
#card_FT4 .bandActivity tbody tr{
  transition:background .16s ease, box-shadow .16s ease, border-color .16s ease, transform .16s ease;
}

#card_FT4 .ft8-controls,
#card_FT4 .audiofft-wrap,
#card_FT4 .smeter-wrap{
  position:relative;
}

#card_FT4 .ft8-country-badge,
#card_FT4 .decode-source,
#card_FT4 .decode-count-badge{
  text-transform:uppercase;
}


/* v21.95 moved FT8 Band Activity/table/filter CSS from index.html */
.ft8-grid{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}
.ft8-box{border:1px solid rgba(0,232,255,.22);background:rgba(1,9,14,.72);padding:10px;min-height:210px}
.ft8-table-wrap{max-height:430px;overflow-y:auto;overflow-x:auto;border:1px solid rgba(0,232,255,.10);background:rgba(0,0,0,.18)}
.ft8-box h4{margin:0 0 8px;color:var(--cyan);letter-spacing:.08em;font-size:12px}
.ft8-table{width:100%;border-collapse:collapse;font-family:Consolas,monospace;font-size:13px}
.ft8-table th,.ft8-table td{border-bottom:1px solid rgba(0,232,255,.12);padding:5px 6px;text-align:left;white-space:nowrap;vertical-align:top}
.ft8-table th{color:var(--muted);font-size:11px;position:sticky;top:0;background:#020c12;z-index:2}
.ft8-table td.msgcell{white-space:normal;color:#eafff1}
.ft8-table tr.cq-row{background:linear-gradient(90deg,rgba(57,255,20,.20),rgba(57,255,20,.07) 55%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(57,255,20,.85)}
.ft8-table tr.cq-row td.msgcell{color:#d9ffe1;font-weight:800;text-shadow:0 0 7px rgba(57,255,20,.32)}
/* v22.46: Punkt 3 - Signal-Icon im FT8-Decode-Table leicht vom linken Rand lösen. */
.ft8-table.bandActivity th:first-child,
.ft8-table.bandActivity td:first-child{padding-left:14px}
.signal-icon{display:inline-flex;align-items:flex-end;gap:2px;width:32px;height:17px;vertical-align:middle;margin-left:3px}
.signal-icon .bar{display:block;width:4px;border:1px solid rgba(255,255,255,.55);background:rgba(255,255,255,.10);box-shadow:inset 0 0 3px rgba(255,255,255,.08)}
.signal-icon .bar:nth-child(1){height:5px}.signal-icon .bar:nth-child(2){height:8px}.signal-icon .bar:nth-child(3){height:11px}.signal-icon .bar:nth-child(4){height:14px}.signal-icon .bar:nth-child(5){height:17px}
.signal-icon.red .bar.on{background:#ff3154;border-color:#ff6b80;box-shadow:0 0 7px rgba(255,49,84,.58)}
.signal-icon.orange .bar.on{background:#ff8e2a;border-color:#ffc08b;box-shadow:0 0 7px rgba(255,142,42,.55)}
.signal-icon.yellow .bar.on{background:#ffd447;border-color:#ffe58a;box-shadow:0 0 7px rgba(255,212,71,.50)}
.signal-icon.green .bar.on{background:#39ff14;border-color:#93ff81;box-shadow:0 0 8px rgba(57,255,20,.58)}
.snr-value{font-family:Consolas,monospace;font-weight:800;color:#d8eef7}
.decode-source{display:inline-block;border:1px solid rgba(57,255,20,.36);background:rgba(57,255,20,.10);color:#bffff0;font-size:10px;font-weight:1000;padding:2px 6px;border-radius:7px;letter-spacing:.06em;text-transform:uppercase;white-space:nowrap;box-shadow:0 0 9px rgba(57,255,20,.10),inset 0 0 8px rgba(57,255,20,.035)}
.decode-source.demo{border-color:rgba(255,179,62,.35);background:rgba(255,179,62,.10);color:#ffd18f;box-shadow:0 0 9px rgba(255,179,62,.10),inset 0 0 8px rgba(255,179,62,.035)}
.decode-source.cq{border-color:rgba(57,255,20,.62);background:linear-gradient(180deg,rgba(57,255,20,.18),rgba(8,35,12,.32));color:#cffff0;text-shadow:0 0 7px rgba(57,255,20,.42);box-shadow:0 0 12px rgba(57,255,20,.22),inset 0 0 10px rgba(57,255,20,.07)}
.decode-source.confirmed{border-color:rgba(255,210,66,.78);background:linear-gradient(180deg,rgba(255,179,62,.25),rgba(145,58,0,.34));color:#fff3bd;text-shadow:0 0 8px rgba(255,216,77,.50);box-shadow:0 0 13px rgba(255,179,62,.30),0 0 20px rgba(255,72,22,.12),inset 0 0 10px rgba(255,216,77,.08)}
.ft8-table tr.confirmed-row{background:linear-gradient(90deg,rgba(255,179,62,.20),rgba(255,216,77,.08) 55%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(255,179,62,.95)}
.ft8-table tr.confirmed-row td.msgcell{color:#fff3bd;font-weight:850;text-shadow:0 0 7px rgba(255,179,62,.34)}
.country-cell{font-weight:800}.km-cell{font-family:Consolas,monospace;color:#cceeff}.dt-cell,.hz-cell{font-family:Consolas,monospace;color:#e8f8ff}
/* v23.58: Aufgabenliste Punkt 5 - Flaggen groesser, detailreicher und ohne eigenen Rahmen. */
.ft8-country-badge{display:inline-flex;align-items:center;gap:7px;vertical-align:middle;white-space:nowrap;color:#ffd18f}
.ft8-flag-icon{display:inline-flex;align-items:center;justify-content:center;width:27px;height:22px;border:0;background:transparent;box-shadow:none;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",system-ui,sans-serif;font-size:20px;line-height:1;overflow:visible;text-shadow:none;filter:saturate(1.12) contrast(1.04);transform:translateY(1px)}
.ft8-flag-icon.is-fallback{width:auto;min-width:24px;height:20px;font-family:Consolas,monospace;font-size:11px;color:#ffe2b7;font-weight:900;letter-spacing:.06em;filter:none;transform:none}
.ft8-country-code{display:inline-flex;align-items:center;justify-content:center;min-width:25px;height:18px;padding:0 5px;border:1px solid rgba(255,179,62,.32);background:rgba(255,179,62,.07);color:#ffe2b7;font-size:11px;font-weight:1000;letter-spacing:.08em;line-height:1;text-transform:uppercase;box-shadow:inset 0 0 7px rgba(255,179,62,.035)}
 .ft8-box-head{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:8px}
.ft8-box-head h4{margin:0;color:var(--cyan);letter-spacing:.08em;font-size:12px}
.ft8-filterbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.ft8-filterbar label{font-size:10px;color:#ffd18f;font-weight:900;letter-spacing:.08em}
.ft8-filterbar input{width:170px;background:#031018;color:#dffbff;border:1px solid rgba(255,179,62,.42);padding:7px 8px;font-family:Consolas,monospace;font-weight:800;outline:none;box-shadow:inset 0 0 10px rgba(0,0,0,.35)}
.ft8-filterbar input:focus{border-color:rgba(255,179,62,.85);box-shadow:0 0 12px rgba(255,179,62,.16), inset 0 0 10px rgba(0,0,0,.35)}
.ft8-filterbar button{border:1px solid rgba(255,179,62,.45);background:linear-gradient(135deg,#351600,#7b2b08);color:#fff1d6;padding:7px 10px;font-weight:400;cursor:pointer}
.ft8-filter-status{display:inline-flex;align-items:center;justify-content:center;min-width:116px;height:30px;padding:0 12px;border:1px solid rgba(255,179,62,.75);background:linear-gradient(180deg,rgba(255,179,62,.24),rgba(122,45,0,.36));color:#fff1d6;font-family:Consolas,monospace;font-size:11px;font-weight:1000;letter-spacing:.045em;text-align:center;text-transform:uppercase;box-shadow:0 0 14px rgba(255,179,62,.28),0 0 22px rgba(255,78,20,.10),inset 0 0 10px rgba(255,216,77,.07);text-shadow:0 0 8px rgba(255,216,77,.42);white-space:nowrap;line-height:1}
.ft8-filter-status.filtered{border-color:rgba(255,210,66,.95);background:linear-gradient(180deg,rgba(255,210,66,.30),rgba(145,58,0,.44));color:#fff7c7;box-shadow:0 0 16px rgba(255,179,62,.36),0 0 24px rgba(255,78,20,.16),inset 0 0 12px rgba(255,216,77,.10)}

/* v24.33: Decode-Anzahl als orange WebFTR-Badge, passend zur neuen gruenen Trennlinie. */
.ft8-decode-count{
  order:99;
  margin-left:auto;
  min-width:126px;
  height:32px;
  border-color:rgba(255,179,62,.82)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.28),rgba(126,48,0,.66))!important;
  color:#fff0cf!important;
  box-shadow:0 0 14px rgba(255,179,62,.28),0 0 22px rgba(255,111,40,.12),inset 0 0 10px rgba(255,216,77,.08)!important;
  text-shadow:0 0 8px rgba(255,179,62,.50)!important;
}
.ft8-decode-count.filtered{
  border-color:rgba(255,214,93,.96)!important;
  background:linear-gradient(180deg,rgba(255,214,93,.34),rgba(145,58,0,.78))!important;
  color:#fff8d7!important;
  box-shadow:0 0 16px rgba(255,179,62,.38),0 0 26px rgba(255,111,40,.16),inset 0 0 11px rgba(255,216,77,.10)!important;
}
.ft8-table tr.prefix-row{background:linear-gradient(90deg,rgba(255,179,62,.22),rgba(0,232,255,.07) 60%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(255,179,62,.9)}
.ft8-table tr.prefix-row td.msgcell{color:#fff2dc;font-weight:850;text-shadow:0 0 7px rgba(255,179,62,.25)}

.ft8-exportbar{display:flex;gap:7px;align-items:center;flex-wrap:wrap}
.ft8-exportbar button{font-size:11px;padding:7px 10px;border-radius:8px;border:1px solid rgba(0,232,255,.42);background:rgba(0,232,255,.10);color:#dffcff;font-weight:400;letter-spacing:.04em;cursor:pointer}
.ft8-exportbar button:hover{border-color:rgba(255,179,62,.65);color:#ffd18f;box-shadow:0 0 10px rgba(255,179,62,.12)}
.ft8-session-info{width:30px;height:30px;padding:0!important;border:1px solid rgba(255,179,62,.62)!important;background:linear-gradient(180deg,rgba(255,179,62,.20),rgba(95,35,0,.38))!important;color:#ffd18f!important;font-size:14px!important;font-weight:400!important;font-family:Consolas,monospace!important;line-height:1!important;text-align:center!important;box-shadow:0 0 12px rgba(255,179,62,.18),inset 0 0 8px rgba(255,216,77,.06)!important}
.ft8-session-info:hover{border-color:rgba(255,216,77,.92)!important;color:#fff1d6!important;box-shadow:0 0 14px rgba(255,179,62,.30),inset 0 0 8px rgba(255,216,77,.10)!important}

.ft8-prefix-chip{display:inline-block;border:1px solid rgba(255,179,62,.50);background:rgba(255,179,62,.12);color:#ffd18f;font-size:10px;font-weight:1000;padding:2px 5px;border-radius:6px;margin-right:4px;letter-spacing:.04em}
.ft8-callbar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.ft8-callbar label{font-size:10px;color:#9ffcff;font-weight:900;letter-spacing:.08em}
.ft8-callbar input{width:145px;background:#031018;color:#dffbff;border:1px solid rgba(0,232,255,.42);padding:7px 8px;font-family:Consolas,monospace;font-weight:900;text-transform:uppercase;outline:none;box-shadow:inset 0 0 10px rgba(0,0,0,.35)}
.ft8-callbar input:focus{border-color:rgba(0,232,255,.9);box-shadow:0 0 12px rgba(0,232,255,.16), inset 0 0 10px rgba(0,0,0,.35)}
.ft8-callbar button{border:1px solid rgba(0,232,255,.45);background:linear-gradient(135deg,#001b24,#00576a);color:#dffcff;padding:7px 10px;font-weight:400;cursor:pointer}
.ft8-callbar button:hover{border-color:rgba(255,179,62,.65);color:#ffd18f}
.ft8-table tr.call-row{background:linear-gradient(90deg,rgba(0,232,255,.20),rgba(255,179,62,.08) 70%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(0,232,255,.9)}
.ft8-table tr.call-row td.msgcell{color:#e9fdff;font-weight:850;text-shadow:0 0 7px rgba(0,232,255,.25)}
.ft8-countrybar{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-left:auto}
.ft8-countrybar label{font-size:10px;color:#ffd18f;font-weight:900;letter-spacing:.08em}
.ft8-countrybar input{width:112px;background:#031018;color:#fff1d6;border:1px solid rgba(255,179,62,.46);padding:7px 8px;font-family:Consolas,monospace;font-weight:900;text-transform:uppercase;outline:none;box-shadow:inset 0 0 10px rgba(0,0,0,.35)}
.ft8-countrybar input:focus{border-color:rgba(255,179,62,.9);box-shadow:0 0 12px rgba(255,179,62,.18), inset 0 0 10px rgba(0,0,0,.35)}
.ft8-countrybar button{border:1px solid rgba(255,179,62,.45);background:linear-gradient(135deg,#351600,#7b2b08);color:#fff1d6;padding:7px 10px;font-weight:400;cursor:pointer}
.ft8-countrybar button:hover{border-color:rgba(0,232,255,.65);color:#dffcff}
.ft8-table tr.country-row{background:linear-gradient(90deg,rgba(255,179,62,.18),rgba(255,92,56,.08) 62%,rgba(1,9,14,.55));box-shadow:inset 3px 0 0 rgba(255,179,62,.85)}
.ft8-table tr.country-row td.country-cell{color:#fff1d6;text-shadow:0 0 8px rgba(255,179,62,.22)}

/* v21.86 FT8 decode row hover */
.ft8-table tbody tr{
  transition:background .16s ease, box-shadow .16s ease, filter .16s ease;
}
.ft8-table tbody tr:hover{
  background:linear-gradient(90deg,rgba(255,179,62,.24),rgba(0,232,255,.10) 52%,rgba(255,92,56,.10))!important;
  box-shadow:inset 0 0 0 1px rgba(255,179,62,.42),inset 4px 0 0 rgba(255,179,62,.95),0 0 16px rgba(255,126,30,.10)!important;
  filter:brightness(1.10);
}
.ft8-table tbody tr:hover td{
  color:#fff7e8;
  text-shadow:0 0 7px rgba(255,179,62,.16);
}
.ft8-table tbody tr.cq-row:hover{
  background:linear-gradient(90deg,rgba(57,255,20,.26),rgba(255,179,62,.13) 55%,rgba(1,9,14,.58))!important;
  box-shadow:inset 0 0 0 1px rgba(57,255,20,.38),inset 4px 0 0 rgba(57,255,20,.95),0 0 16px rgba(57,255,20,.10)!important;
}
.ft8-table tbody tr.confirmed-row:hover{
  background:linear-gradient(90deg,rgba(255,179,62,.30),rgba(255,216,77,.13) 55%,rgba(1,9,14,.58))!important;
  box-shadow:inset 0 0 0 1px rgba(255,216,77,.42),inset 4px 0 0 rgba(255,179,62,.98),0 0 16px rgba(255,179,62,.13)!important;
}

.ft8-diag-toggle{
  border-color:rgba(255,179,62,.38)!important;
  background:linear-gradient(180deg,rgba(80,38,0,.78),rgba(24,10,0,.92))!important;
  color:#ffd18f!important;
}
.ft8-diag-toggle.active{
  border-color:rgba(255,179,62,.70)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.22),rgba(75,28,0,.86))!important;
  color:#fff2dc!important;
  box-shadow:0 0 12px rgba(255,179,62,.18),inset 0 0 8px rgba(255,179,62,.06)!important;
}
.ft8-table tr.diag-row td{
  color:#aeb8bd!important;
  opacity:.72;
  font-family:Consolas,monospace;
  font-size:10px;
  background:rgba(255,179,62,.035)!important;
}
.ft8-call-chip{display:inline-block;border:1px solid rgba(0,232,255,.55);background:rgba(0,232,255,.12);color:#9ffcff;font-size:10px;font-weight:1000;padding:2px 5px;border-radius:6px;margin-right:4px;letter-spacing:.04em}
.ft8-call-link{color:#9ffcff;text-decoration:none;font-weight:1000;letter-spacing:.03em;border-bottom:1px dotted rgba(0,232,255,.55);text-shadow:0 0 7px rgba(0,232,255,.22)}
.ft8-call-link:hover{color:#ffd18f;border-bottom-color:rgba(255,179,62,.85);text-shadow:0 0 9px rgba(255,179,62,.32)}
.ft8-locator-text{color:#b9ffc9;text-decoration:none;font-weight:400;letter-spacing:.03em;border-bottom:1px dotted rgba(110,255,151,.35);text-shadow:0 0 7px rgba(110,255,151,.16)}


/* v21.98: FT8 Audio-FFT base styles moved from index.html.
   Kept inside a cascade layer so the remaining unlayered legacy overrides in index.html
   keep their original priority. Do not add global selectors here. */
@layer webftr-ft8-audiofft-base {
/* FT8 Audio-FFT / dB-Meter */
.audiofft{width:100%;height:130px;background:#01060a;border:1px solid rgba(0,232,255,.22);display:none;margin-top:10px}
.audiofft.on{display:block}
.audiofft-wrap{display:none;margin:18px 0 8px;border:1px solid rgba(255,179,62,.28);background:linear-gradient(180deg,rgba(9,13,16,.92),rgba(0,0,4,.96));padding:8px}
.audiofft-wrap.on{display:block}
.audiofft-head{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.audiofft-label{font-size:12px;color:#ffd18f;font-weight:900;letter-spacing:.06em;text-transform:uppercase}
.audioPeakBadge{font-family:Consolas,monospace;font-size:12px;color:#ffcf9a;border:1px solid rgba(255,94,34,.55);background:rgba(60,14,0,.42);padding:4px 8px;font-weight:900;box-shadow:0 0 12px rgba(255,94,34,.12)}
.audiofft-toggle-row{display:flex;align-items:center;justify-content:flex-start;gap:10px;margin-top:8px;flex-wrap:wrap}
.audiofft-toggle-row .audioBtn{border:1px solid rgba(255,179,62,.55);background:linear-gradient(135deg,#351600,#7b2b08);color:#fff1d6;padding:8px 12px;font-weight:900;cursor:pointer;box-shadow:0 0 12px rgba(255,94,34,.12)}
.audiofft-toggle-row .audioBtn.active{background:linear-gradient(135deg,#7b2b08,#d85b19);color:#fff}
.audiofft-toggle-note{display:none!important;font-size:11px;color:#9fb2bd;font-weight:700}
.speakerBtn{border:1px solid rgba(0,232,255,.42);background:linear-gradient(135deg,#071a24,#0d3340);color:#dffbff;padding:8px 12px;font-size:17px;font-weight:400;cursor:pointer;min-width:48px;text-align:center;box-shadow:0 0 12px rgba(0,232,255,.10)}
.speakerBtn.active{border-color:rgba(255,96,38,.78);background:linear-gradient(135deg,#4a1200,#be3a14);color:#fff4e8;box-shadow:0 0 16px rgba(255,90,30,.26)}
.audioMonitorStatus{font-family:Consolas,monospace;font-size:11px;color:#9fb2bd;min-width:118px;text-align:right}
.audiofft-wrap.audio-muted .audiofft-grid{display:none}
.audiofft-wrap.audio-muted .audioPeakBadge{opacity:.55}
.audiofft-wrap.audio-muted .audiofft-label:after{content:" · AUS";color:#ff9b62}
.audiofft-grid{display:grid;grid-template-columns:62px 1fr;gap:8px;align-items:stretch}
.audioDbScale{height:142px;border-right:1px solid rgba(255,179,62,.22);display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;padding:2px 6px 2px 0;color:#b9cbd4;font-family:Consolas,monospace;font-size:10px;line-height:1}
.audioDbScale span{position:relative;text-shadow:0 0 6px rgba(0,0,0,.8)}
.audioDbScale span:after{content:"";position:absolute;left:calc(100% + 5px);top:50%;width:8px;border-top:1px solid rgba(255,179,62,.28)}
.audiofft-wrap canvas.audiofft{margin:0;height:142px;border-color:rgba(255,179,62,.24);background:#000006}

}


/* v21.99: FT8 S-Meter CSS moved from index.html.
   Only .smeter-* selectors are included here. No global .panel/.meta/.slot/button/select selectors.
   v22.48: S-Meter is displayed as a larger top instrument block.
   v22.49: Hintergrund/Übergang weicher in den FT8-Container eingeblendet.
   v22.50: S-/dBm-Instrumentflächen mit durchgehendem Verlauf und S-Skala ohne dBm-Zusatzwerte.
   v22.51: Orange Mini-Badges für S-Wert/dBm und mehr Abstand zur Audio-FFT.
   v22.52: Titel-Badges und gestapeltes Ampel-S-Meter in der linken S-Meter-Spalte.
   v22.53: Linke S-Meter-Spalte vollständig für gestapelte Skala ohne Textkopf genutzt.
   v22.56: Linke S-Wert- und rechte dBm-Treppenanzeige gleich breit, dBm-Innenlabel entfernt, Glow-Politur. */
.smeter-wrap{
  --smeter-pct:0%;
  flex:1 1 100%;
  width:100%;
  min-width:0;
  margin:10px 0 20px;
  display:grid;
  grid-template-columns:126px minmax(300px,1.08fr) 192px minmax(300px,1.08fr) 126px;
  align-items:stretch;
  gap:12px;
  padding:12px;
  position:relative;
  overflow:hidden;
  isolation:isolate;
  border:1px solid rgba(255,168,91,.58)!important;
  background:
    radial-gradient(circle at 50% -18%,rgba(255,174,82,.18),rgba(255,174,82,.06) 24%,rgba(0,0,0,0) 58%),
    radial-gradient(ellipse at 50% 118%,rgba(0,232,255,.055),rgba(0,0,0,0) 54%),
    linear-gradient(180deg,rgba(1,14,20,.78),rgba(2,10,14,.92) 42%,rgba(8,9,10,.96) 100%);
  box-shadow:0 0 18px rgba(255,120,32,.13),0 0 24px rgba(0,232,255,.035), inset 0 0 0 1px rgba(255,255,255,.026), inset 0 0 30px rgba(255,144,52,.035);
  color:#fff2dc!important;
}
.smeter-wrap:before{
  content:"";position:absolute;inset:0;pointer-events:none;opacity:.12;
  background:
    linear-gradient(90deg,rgba(0,232,255,.045),rgba(255,179,62,.055) 50%,rgba(0,232,255,.045)),
    repeating-linear-gradient(180deg,rgba(255,255,255,.035) 0 1px,transparent 1px 4px);
  mix-blend-mode:screen;
}
.smeter-wrap:after{
  content:"";position:absolute;inset:2px;pointer-events:none;
  border:1px solid rgba(255,255,255,.045);box-shadow:inset 0 1px 0 rgba(255,255,255,.035),inset 0 -18px 28px rgba(0,0,0,.16);
}
.smeter-label,.smeter-readout,.smeter-meter,.smeter-center-readout{
  min-height:150px;
  border:1px solid rgba(255,170,92,.26);
  background:linear-gradient(180deg,rgba(255,255,255,.025),rgba(0,0,0,.12)),linear-gradient(180deg,rgba(8,18,22,.80),rgba(5,8,10,.94));
  box-shadow:inset 0 0 14px rgba(255,165,79,.035), inset 0 0 0 1px rgba(255,255,255,.02), 0 0 12px rgba(0,0,0,.18);
}
.smeter-label{display:flex;align-items:stretch;justify-content:stretch;text-align:center;white-space:nowrap;padding:8px;gap:0;overflow:hidden}
/* v22.53: Linke S-Meter-Spalte ohne Textkopf; die gesamte Box gehört der gestapelten Ampel-/Temperaturskala. */
.smeter-stack-meter{position:relative;display:block;width:100%;height:100%;min-height:132px;margin:0;border:1px solid rgba(255,179,62,.42);background:radial-gradient(circle at 45% 100%,rgba(255,143,47,.12),rgba(0,0,0,0) 56%),linear-gradient(180deg,rgba(5,13,11,.95),rgba(2,5,5,.99));box-shadow:inset 0 0 18px rgba(0,0,0,.58),0 0 14px rgba(255,130,36,.12);overflow:hidden}
.smeter-stack-fill{position:absolute;left:12px;right:43px;bottom:8px;height:var(--smeter-pct);max-height:calc(100% - 16px);background:linear-gradient(0deg,#20ff73 0%,#a8ff45 42%,#ffd84a 62%,#ff9a33 80%,#ff4738 100%);box-shadow:0 0 12px rgba(57,255,108,.30),0 0 18px rgba(255,165,54,.18);z-index:1}
.smeter-stack-grid{position:absolute;left:12px;right:43px;top:8px;bottom:8px;background:repeating-linear-gradient(0deg,rgba(0,0,0,.72) 0 2px,transparent 2px 10px);box-shadow:inset 0 0 0 1px rgba(255,255,255,.055);z-index:2}
.smeter-stack-scale{position:absolute;right:6px;top:8px;bottom:8px;display:flex;flex-direction:column;justify-content:space-between;align-items:flex-end;z-index:4;pointer-events:none}
.smeter-stack-scale span{position:relative;min-width:34px;padding-right:2px;color:#ffe2b8;font-family:Consolas,monospace;font-size:10px;font-weight:1000;letter-spacing:-.02em;text-align:right;text-shadow:0 0 8px rgba(255,153,54,.34)}
.smeter-stack-scale span:before{content:'';position:absolute;right:38px;top:50%;width:10px;height:1px;background:rgba(255,210,142,.46);box-shadow:0 0 6px rgba(255,178,85,.20)}
.smeter-stack-meter:before{content:'';position:absolute;left:12px;right:43px;top:8px;bottom:8px;border-left:2px solid rgba(255,226,184,.34);border-right:1px solid rgba(255,226,184,.10);z-index:3;pointer-events:none;box-shadow:inset 0 0 0 1px rgba(255,255,255,.025)}
.smeter-stack-meter:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,rgba(255,255,255,.08),rgba(255,255,255,0) 28%);pointer-events:none;z-index:5}
.smeter-meter{min-width:0;display:grid;grid-template-rows:auto 1fr;gap:5px;padding:7px 8px 8px;position:relative;overflow:hidden}
.smeter-meter-title{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:22px;color:#f6ddb5;font-size:13px;font-weight:1000;letter-spacing:.12em;text-transform:uppercase;text-shadow:0 0 8px rgba(255,178,85,.20)}
/* v22.51: S-Wert-/dBm-Miniwerte als orange WebFTR-Badges statt losem Kleinsttext. */
.smeter-meter-title small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:64px;
  padding:3px 8px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(255,126,30,.34),rgba(92,35,0,.78));
  color:#ffe2b8;
  box-shadow:0 0 13px rgba(255,126,30,.24),inset 0 0 10px rgba(255,224,168,.055);
  text-shadow:0 0 9px rgba(255,153,54,.38);
  font-size:12px;
  letter-spacing:.08em;
  font-family:Consolas,monospace;
  font-weight:1000;
  text-transform:none;
  white-space:nowrap;
  line-height:1;
}
/* v22.52: Titel links in den beiden Instrument-Spalten ebenfalls als orange WebFTR-Badges; dBm bleibt bewusst korrekt kleingroß geschrieben. */
.smeter-title-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:74px;
  padding:4px 9px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(255,126,30,.34),rgba(92,35,0,.78));
  color:#ffe2b8;
  box-shadow:0 0 13px rgba(255,126,30,.24),inset 0 0 10px rgba(255,224,168,.055);
  text-shadow:0 0 9px rgba(255,153,54,.38);
  font-size:12px;
  letter-spacing:.08em;
  font-family:Consolas,monospace;
  font-weight:1000;
  text-transform:none;
  white-space:nowrap;
  line-height:1;
}
.smeter-title-badge-dbm{min-width:54px;letter-spacing:.05em;text-transform:none}

.smeter-dial{position:relative;display:block;width:100%;min-height:132px;overflow:hidden;background:radial-gradient(circle at 50% 100%,rgba(255,143,47,.10),rgba(0,0,0,0) 42%),linear-gradient(180deg,rgba(25,25,25,.98),rgba(8,8,8,.98));box-shadow:inset 0 0 24px rgba(0,0,0,.55),inset 0 -1px 0 rgba(255,255,255,.04)}
/* v22.50: Den warmen analogen Verlauf über die komplette jeweilige Instrument-Spalte ziehen, nicht nur über den SVG-Dial-Bereich. */
.smeter-meter-s,
.smeter-meter-dbm{
  background:
    radial-gradient(circle at 50% 72%,rgba(255,143,47,.16),rgba(255,143,47,.055) 34%,rgba(0,0,0,0) 62%),
    radial-gradient(ellipse at 50% 10%,rgba(255,221,178,.07),rgba(0,0,0,0) 48%),
    linear-gradient(180deg,rgba(28,22,15,.96),rgba(11,10,9,.98) 58%,rgba(4,5,6,.98));
  box-shadow:inset 0 0 26px rgba(0,0,0,.52),inset 0 0 0 1px rgba(255,211,151,.035),0 0 14px rgba(255,143,47,.10);
}
.smeter-meter-s .smeter-dial,
.smeter-meter-dbm .smeter-dial{
  background:transparent;
  box-shadow:none;
}
.smeter-meter-s .smeter-meter-title,
.smeter-meter-dbm .smeter-meter-title{
  padding:0 2px 2px;
  border-bottom:1px solid rgba(255,179,92,.09);
}

.smeter-dial:before{content:"";position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,rgba(255,255,255,.07),rgba(255,255,255,0) 34%);opacity:.85}
.smeter-svg{width:100%;height:132px;display:block;background:none;shape-rendering:geometricPrecision;text-rendering:geometricPrecision}
.smeter-svg text{font-family:Arial,Helvetica,sans-serif;dominant-baseline:middle;user-select:none}
.smeter-s-needle-group,.smeter-dbm-needle-group{transition:transform .22s ease;transform-origin:220px 112px}
.smeter-center-readout{min-width:0;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:8px;padding:10px 8px;background:linear-gradient(180deg,rgba(5,18,16,.92),rgba(1,8,9,.98));border:1px solid rgba(57,255,20,.24);box-shadow:inset 0 0 18px rgba(57,255,20,.05),inset 0 0 0 1px rgba(255,255,255,.02),0 0 12px rgba(0,0,0,.16);text-align:center;overflow:hidden}
.smeter-center-head{display:inline-flex;align-items:center;justify-content:center;min-height:20px;padding:3px 8px;border:1px solid rgba(57,255,20,.32);background:rgba(57,255,20,.08);color:#bcffd3;font-family:Consolas,monospace;font-size:10px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;box-shadow:0 0 10px rgba(57,255,20,.10),inset 0 0 8px rgba(57,255,20,.04)}
.smeter-sevenseg{display:flex;align-items:center;justify-content:center;width:100%;max-width:170px;padding:7px 5px 6px;border:1px solid rgba(57,255,20,.46);background:linear-gradient(180deg,rgba(0,16,11,.99),rgba(0,4,3,1));box-shadow:inset 0 0 16px rgba(0,0,0,.74),0 0 14px rgba(57,255,20,.16),inset 0 0 0 1px rgba(145,255,164,.08)}
.smeter-center-mode{display:inline-flex;align-items:center;justify-content:center;min-width:78px;min-height:28px;padding:5px 10px;border:1px solid rgba(57,255,20,.40);background:linear-gradient(180deg,rgba(14,62,34,.54),rgba(0,20,12,.92));color:#d7ffe1;font-family:Consolas,monospace;font-size:12px;font-weight:900;letter-spacing:.18em;text-transform:uppercase;text-shadow:0 0 8px rgba(57,255,20,.34),0 0 14px rgba(57,255,20,.16);box-shadow:0 0 14px rgba(57,255,20,.14),inset 0 0 12px rgba(112,255,140,.08),inset 0 0 0 1px rgba(255,255,255,.03)}
.smeter-sevenseg-svg{display:block;width:100%;height:auto;max-width:158px;overflow:visible}
.smeter-sevenseg-svg .smeter-sevenseg-bg{fill:#03120b;stroke:rgba(111,255,134,.22);stroke-width:1.1;filter:drop-shadow(0 0 5px rgba(57,255,20,.12))}
.smeter-sevenseg-svg .seg-on{fill:#86ff6c;filter:drop-shadow(0 0 2px rgba(57,255,20,.75)) drop-shadow(0 0 6px rgba(57,255,20,.30))}
.smeter-sevenseg-svg .seg-off{fill:rgba(68,118,75,.16)}
.smeter-readout{display:flex;flex-direction:column;justify-content:center;align-items:center;padding:8px 12px;line-height:1.02;text-align:center}
.smeter-readout small{font-size:10px;color:#d9b185;letter-spacing:.18em;font-weight:1000;text-shadow:0 0 8px rgba(255,173,96,.16)}
.smeter-s{font-size:36px;color:#f6ddb5;font-weight:1000;letter-spacing:.01em;text-shadow:0 0 10px rgba(255,178,85,.38),0 0 16px rgba(255,126,30,.18)}
.smeter-dbm{font-size:20px;color:#ffb56b;font-family:Consolas,monospace;white-space:nowrap;font-style:normal;text-shadow:0 0 8px rgba(255,160,72,.18)}
.smeter-wrap.smeter-hot{border-color:#ff6f50!important;box-shadow:0 0 22px rgba(255,92,56,.18), inset 0 0 0 1px rgba(255,255,255,.04), inset 0 0 30px rgba(255,92,56,.05)}
.smeter-hidden{display:none!important}
.smeter-toggle-row{display:flex;justify-content:flex-end;align-items:center;margin:-2px 0 10px;gap:8px}
.smeterToggle{min-width:150px}
.smeterToggle.active{letter-spacing:.05em}
.smeterToggle.off{letter-spacing:.05em}
@media(max-width:1280px){.smeter-wrap{grid-template-columns:112px minmax(240px,1fr) 168px minmax(240px,1fr) 112px;gap:9px;padding:10px}.smeter-svg{height:108px}.smeter-dial{min-height:108px}.smeter-label,.smeter-readout,.smeter-meter,.smeter-center-readout{min-height:126px}.smeter-meter-title{font-size:11px}.smeter-meter-title small{min-width:56px;font-size:11px;padding:3px 7px}.smeter-title-badge{min-width:64px;font-size:11px;padding:3px 7px}.smeter-stack-meter{min-height:108px}.smeter-stack-scale span{font-size:9px;min-width:31px}.smeter-stack-scale span:before{right:35px;width:8px}.smeter-s{font-size:31px}.smeter-dbm{font-size:17px}.smeter-sevenseg{max-width:150px;padding:6px 4px 5px}.smeter-sevenseg-svg{max-width:138px}.smeter-center-mode{min-width:70px;font-size:11px;letter-spacing:.14em}}
@media(max-width:900px){.smeter-wrap{grid-template-columns:1fr 1fr;gap:8px}.smeter-label,.smeter-readout,.smeter-center-readout{min-height:110px}.smeter-label{grid-column:1}.smeter-readout{grid-column:2}.smeter-center-readout{grid-column:1 / span 2;order:3}.smeter-stack-meter{min-height:94px}.smeter-meter{min-height:112px}.smeter-dial{min-height:92px}.smeter-svg{height:92px}.smeter-s{font-size:28px}.smeter-dbm{font-size:15px}.smeter-sevenseg{max-width:146px;padding:6px 4px 5px}.smeter-sevenseg-svg{max-width:132px}}
@media(max-width:640px){.smeter-wrap{grid-template-columns:1fr;gap:7px;padding:8px}.smeter-label,.smeter-readout,.smeter-meter,.smeter-center-readout{min-height:94px}.smeter-label,.smeter-readout,.smeter-center-readout{grid-column:auto}.smeter-stack-meter{min-height:78px}.smeter-dial{min-height:82px}.smeter-svg{height:82px}.smeter-meter-title{font-size:9px}.smeter-meter-title small{min-width:50px;font-size:10px;padding:3px 6px}.smeter-title-badge{min-width:56px;font-size:10px;padding:3px 6px}.smeter-s{font-size:24px}.smeter-dbm{font-size:14px}.smeter-sevenseg{max-width:138px;padding:6px 4px 5px}.smeter-sevenseg-svg{max-width:126px}.smeter-center-mode{min-width:66px;font-size:10px}}


/* v22.00: FT8 Waterfall CSS moved from index.html.
   Only .wfScale/.wfAxis/canvas.waterfall/.waterfall-block-hidden selectors are included here. */
.waterfall-block-hidden{display:none!important}
canvas.waterfall{width:100%;height:207px;background:#001018;border:1px solid rgba(0,232,255,.24);display:block}
.wfScale{min-height:34px;height:auto;display:flex;justify-content:space-between;align-items:center;color:#ffd18f;font-size:11px;font-weight:800;line-height:1.2;letter-spacing:.03em;border:1px solid rgba(255,179,62,.24);border-bottom:0;padding:7px 10px 8px;margin-top:16px;margin-bottom:0;background:linear-gradient(180deg,rgba(75,42,0,.22),rgba(0,20,28,.40));overflow:visible;box-sizing:border-box}
.wfScale span{position:relative;white-space:nowrap;text-shadow:0 0 8px rgba(255,179,62,.35);padding-top:1px}
.wfScale span:after{content:"";display:block;width:1px;height:8px;background:rgba(255,179,62,.58);margin:4px auto 0}
.wfAxis{height:20px;display:flex;justify-content:space-between;align-items:center;color:#73eaff;font-size:10px;letter-spacing:.04em;opacity:.82;border-left:1px solid rgba(0,232,255,.18);border-right:1px solid rgba(0,232,255,.18);border-bottom:1px solid rgba(0,232,255,.12);padding:1px 8px 0;margin-bottom:8px;background:rgba(0,20,28,.38);box-sizing:border-box}
/* v23.66: Waterfall scale minor ticks without extra frequency labels. */
.wfScale .wf-tick,.wfAxis .wf-tick{flex:1 1 0;text-align:center;min-width:0}
.wfScale .wf-tick-minor,.wfAxis .wf-tick-minor{font-size:0;color:transparent;opacity:.78}
.wfScale .wf-tick-minor:after{width:1px;height:6px;background:rgba(255,179,62,.38);margin:6px auto 0}
.wfAxis .wf-tick{position:relative;white-space:nowrap}
.wfAxis .wf-tick-minor:after{content:"";display:block;width:1px;height:6px;background:rgba(0,232,255,.38);margin:7px auto 0;box-shadow:0 0 6px rgba(0,232,255,.18)}

canvas.waterfall{
  image-rendering:auto !important;
}
canvas.waterfall{
  contain: layout paint;
  transform: translateZ(0);
  backface-visibility: hidden;
  touch-action: pan-y;
}


/* v22.01: FT8 Live Info / Decode Health CSS moved from index.html.
   Only .ft8-controls/.ft8-live-chip and decoderStatus state selectors are included here. */
/* v21.73: kompaktere FT8 RX/Decode Liveinfos */
.ft8-controls{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(160px,1fr));
  gap:8px!important;
  align-items:stretch!important;
  margin:12px 0 10px!important;
  padding:8px!important;
  border:1px solid rgba(255,179,62,.24);
  background:linear-gradient(180deg,rgba(18,12,8,.84),rgba(0,8,12,.78));
  box-shadow:0 0 16px rgba(255,126,30,.08),inset 0 0 18px rgba(255,179,62,.035);
}
.ft8-live-chip,
.ft8-controls .ft8-clock,
.ft8-controls .decoderStatus,
.ft8-controls .streamStatus{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  min-height:34px;
  padding:6px 9px!important;
  border:1px solid rgba(255,179,62,.32);
  background:linear-gradient(180deg,rgba(255,179,62,.09),rgba(3,14,18,.55));
  color:#ffe2b8!important;
  font-family:Consolas,monospace!important;
  font-size:11px!important;
  font-weight:900!important;
  letter-spacing:.03em;
  text-align:center;
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
  box-shadow:0 0 10px rgba(255,126,30,.08),inset 0 0 8px rgba(255,179,62,.035);
}
.ft8-controls .ft8-clock{
  border-color:rgba(255,179,62,.55);
  color:#ffd18f!important;
  text-shadow:0 0 8px rgba(255,179,62,.22);
}
.ft8-controls .decoderStatus{
  border-color:rgba(0,232,255,.28);
  color:#dffcff!important;
  background:linear-gradient(180deg,rgba(0,232,255,.07),rgba(3,14,18,.55));
}
.ft8-controls .streamStatus{
  border-color:rgba(57,255,20,.24);
  color:#cffff0!important;
  background:linear-gradient(180deg,rgba(57,255,20,.055),rgba(3,14,18,.55));
}
.ft8-controls .ft8-clock:before,
.ft8-controls .decoderStatus:before,
.ft8-controls .streamStatus:before{
  display:inline-block;
  margin-right:7px;
  color:#9fb2bd;
  font-size:9px;
  font-weight:1000;
  letter-spacing:.10em;
}
.ft8-controls .ft8-clock:before{content:"RX";color:#ffd18f}
.ft8-controls .decoderStatus:before{content:"DECODER";color:#9ffcff}
.ft8-controls .streamStatus:before{content:"STREAM";color:#b8ffd0}
.ft8-controls .decoderStatus{font-size:10px!important;letter-spacing:.01em}
@media(max-width:1000px){.ft8-controls{grid-template-columns:1fr}.ft8-controls .ft8-clock,.ft8-controls .decoderStatus,.ft8-controls .streamStatus{justify-content:flex-start!important;text-align:left}}


/* v21.76: FT8 decode health visibility */
.ft8-controls .decoderStatus.decode-ok{
  border-color:rgba(57,255,20,.30)!important;
  color:#d7ffd8!important;
  background:linear-gradient(180deg,rgba(57,255,20,.06),rgba(3,14,18,.55))!important;
}
.ft8-controls .decoderStatus.decode-warn{
  border-color:rgba(255,179,62,.62)!important;
  color:#ffd18f!important;
  background:linear-gradient(180deg,rgba(255,179,62,.13),rgba(28,12,0,.62))!important;
  box-shadow:0 0 13px rgba(255,179,62,.14),inset 0 0 8px rgba(255,179,62,.04)!important;
}
.ft8-controls .decoderStatus.decode-missing{
  border-color:rgba(255,76,76,.62)!important;
  color:#ffd0d0!important;
  background:linear-gradient(180deg,rgba(255,64,64,.14),rgba(26,0,0,.64))!important;
  box-shadow:0 0 13px rgba(255,64,64,.16),inset 0 0 8px rgba(255,64,64,.04)!important;
}



/* v22.02: FT8 controls fallback CSS moved from index.html.
   Scoped to .ft8-controls only; no global button/select rules. */
.ft8-controls{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:12px 0}
.ft8-controls button{border:1px solid #168ea2;background:#071a24;color:#eaf7ff;padding:8px 12px;font-weight:400;cursor:pointer}
.ft8-controls button.active{background:linear-gradient(135deg,#125b22,#00a777);color:#fff}
.ft8-clock{font-family:Consolas,monospace;color:var(--orange);font-weight:800}


/* v22.02: FT8 audio/control toggle CSS moved from index.html.
   Only scoped audio/FT8 control selectors: .audioMode*, .audioInfoIcon, .audioFftToggle, .audioBtnText.
   No global .panel/.meta/.slot/.hw/button/select selectors. */
/* v21.31e: Kein Dropdown im Audio-Bereich. Nur echter Toggle-Button: Ges. Bandbreite hören / Peak hören. Preset-Auswahl bleibt unten beim Wasserfall. */
.audioModeSelect{display:none!important}
.audioModeToggle{border:1px solid #d43755!important;padding:8px 14px!important;color:#ffdce2!important;font-weight:400!important;background:linear-gradient(180deg,#a20d2d,#590016)!important;cursor:pointer;text-transform:uppercase;letter-spacing:.04em;box-shadow:0 0 14px rgba(212,55,85,.20), inset 0 0 10px rgba(255,255,255,.03)!important;min-width:218px;height:38px;display:inline-flex;align-items:center;justify-content:center;text-align:center;line-height:1.05}
.audioModeToggle.follow{border-color:#ffb347!important;color:#fff1d6!important;background:linear-gradient(180deg,#a94a07,#641c00)!important;box-shadow:0 0 16px rgba(255,126,30,.26), inset 0 0 10px rgba(255,255,255,.04)!important}
.audioModeToggle:hover{border-color:#ff5c78;box-shadow:0 0 16px rgba(255,64,96,.30), inset 0 0 10px rgba(255,255,255,.04)!important}
.audioInfoIcon{display:inline-flex;align-items:center;justify-content:center;width:25px;height:25px;border:1px solid rgba(159,252,255,.42);color:#9ffcff;background:rgba(0,26,34,.72);font-family:Consolas,monospace;font-size:15px;font-weight:950;border-radius:3px;cursor:help;box-shadow:0 0 10px rgba(0,232,255,.08)}
.audioInfoIcon:hover,.audioInfoIcon:focus{border-color:rgba(255,179,62,.75);color:#ffd18f;outline:0;box-shadow:0 0 12px rgba(255,179,62,.16)}
.audioModeHint{color:#bfefff!important}
@media(max-width:800px){.audiofft-toggle-row{flex-wrap:wrap}.audioModeToggle{font-size:12px;min-width:190px}}


/* v21.61: Audio-FFT Toggle im gleichen Stil wie WF/S-Meter */
.audiofft-toggle-row .audioFftToggle{
  border:1px solid #d43755!important;
  padding:8px 14px!important;
  color:#ffdce2!important;
  font-weight:1000!important;
  background:linear-gradient(180deg,#a20d2d,#590016)!important;
  cursor:pointer!important;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
  box-shadow:0 0 14px rgba(212,55,85,.20), inset 0 0 10px rgba(255,255,255,.03)!important;
  min-width:150px!important;
  text-align:center!important;
}
.audiofft-toggle-row .audioFftToggle.active{
  border-color:#ff5c78!important;
  color:#fff!important;
  background:linear-gradient(180deg,#b91338,#640019)!important;
  box-shadow:0 0 16px rgba(255,64,96,.30), inset 0 0 10px rgba(255,255,255,.04)!important;
}
.audiofft-toggle-row .audioFftToggle.off{
  border-color:#9c243c!important;
  color:#ffccd5!important;
  background:linear-gradient(180deg,#611022,#32000c)!important;
  box-shadow:0 0 10px rgba(212,55,85,.12), inset 0 0 10px rgba(0,0,0,.18)!important;
}


/* v21.62 audio FFT toggle style fix */
.audiofft-toggle-row .audioFftToggle{
  border:1px solid #d43755!important;
  padding:8px 14px!important;
  min-width:124px!important;
  min-height:37px!important;
  color:#ffdce2!important;
  font-weight:1000!important;
  background:linear-gradient(180deg,#a20d2d,#590016)!important;
  cursor:pointer;
  text-transform:uppercase!important;
  letter-spacing:.05em!important;
  box-shadow:0 0 14px rgba(212,55,85,.20), inset 0 0 10px rgba(255,255,255,.03)!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  line-height:1.05!important;
  transform:none!important;
  vertical-align:middle!important;
}
.audiofft-toggle-row .audioFftToggle.active{
  border-color:#ff5c78!important;
  color:#fff!important;
  background:linear-gradient(180deg,#b91338,#640019)!important;
  box-shadow:0 0 16px rgba(255,64,96,.30), inset 0 0 10px rgba(255,255,255,.04)!important;
}
.audiofft-toggle-row .audioFftToggle.off{
  border-color:#9c243c!important;
  color:#ffccd5!important;
  background:linear-gradient(180deg,#611022,#32000c)!important;
  box-shadow:0 0 10px rgba(212,55,85,.12), inset 0 0 10px rgba(0,0,0,.18)!important;
}
.audiofft-toggle-row .audioBtnText{
  display:block!important;
  margin:0!important;
  padding:0!important;
  line-height:1.05!important;
  transform:none!important;
}
.audiofft-toggle-row .audioBtn,
.audiofft-toggle-row .speakerBtn{
  transform:none!important;
}

/* v22.03: FT8 export/filter/control corner rules moved from global index reset.
   Keep these scoped to the FT8 module only. */
#card_FT4 .decode-source,
#card_FT4 .ft8-prefix-chip,
#card_FT4 .ft8-call-chip,
#card_FT4 .ft8-exportbar button,
#card_FT4 .ft8-session-info,
#card_FT4 .ft8-diag-toggle,
#card_FT4 .ft8-filter-status{
  border-radius:0!important;
}


/* v22.04: remaining tiny FT8-scoped CSS cleanup.
   Only .ft8-note and .ft8-table responsive rule were moved here.
   No global manager/slot/hardware/button/select selectors. */
.ft8-note{color:var(--muted);font-size:12px;margin-top:8px}
@media(max-width:900px){.ft8-table{font-size:12px}}


/* v22.55/v22.56: S-Meter Treppenanzeigen links/rechts flächig; v22.56 gleich breit, ohne dBm-Innenlabel, mit Glow-Politur. */
.smeter-wrap{--smeter-dbm-pct:0%;}
.smeter-label,.smeter-readout{padding:0;align-items:stretch;justify-content:stretch;}
.smeter-label,.smeter-dbm-stack-wrap{min-width:0;}
.smeter-stack-meter{
  border:0!important;
  min-height:152px;
  box-shadow:inset 0 0 24px rgba(0,0,0,.66),0 0 16px rgba(255,130,36,.12),0 0 22px rgba(32,255,115,.055);
}
.smeter-stack-fill{
  left:6px;right:38px;bottom:6px;max-height:calc(100% - 12px);
  box-shadow:0 0 14px rgba(57,255,108,.36),0 0 22px rgba(255,165,54,.20),inset 0 0 9px rgba(255,255,255,.08);
}
.smeter-stack-grid{left:6px;right:38px;top:6px;bottom:6px;}
.smeter-stack-scale{right:5px;top:6px;bottom:6px;}
.smeter-stack-scale span{min-width:34px;font-size:10px;color:#ffe2b8;text-shadow:0 0 8px rgba(255,153,54,.42),0 0 12px rgba(32,255,115,.10);}
.smeter-stack-scale span:before{right:37px;width:10px;background:rgba(255,210,142,.52);box-shadow:0 0 7px rgba(255,178,85,.28);}
.smeter-stack-meter:before{left:6px;right:38px;top:6px;bottom:6px;border-left:2px solid rgba(255,226,184,.34);border-right:0;box-shadow:none;}
.smeter-stack-meter:after{background:linear-gradient(180deg,rgba(255,255,255,.10),rgba(255,255,255,0) 28%),radial-gradient(circle at 50% 50%,rgba(255,179,62,.055),rgba(0,0,0,0) 62%);}
.smeter-dbm-stack-wrap{position:relative;}
.smeter-dbm-stack-meter{
  width:100%;height:100%;
  background:radial-gradient(circle at 50% 100%,rgba(255,143,47,.17),rgba(0,0,0,0) 58%),linear-gradient(180deg,rgba(8,12,12,.96),rgba(2,5,5,.99));
}
.smeter-dbm-stack-meter .smeter-stack-fill{height:var(--smeter-dbm-pct);background:linear-gradient(0deg,#2dff7e 0%,#b3ff4d 38%,#ffd84a 60%,#ff9a33 79%,#ff4738 100%);}
.smeter-dbm-stack-meter .smeter-stack-scale span{min-width:34px;color:#ffe2b8;}
.smeter-dbm-stack-meter .smeter-stack-scale span:before{right:37px;}
.smeter-readout .smeter-dbm{font-size:11px;font-style:normal;}
@media(max-width:1280px){.smeter-stack-meter{min-height:126px}.smeter-stack-scale span{font-size:9px;min-width:32px}.smeter-stack-scale span:before{right:35px;width:8px}.smeter-stack-fill,.smeter-stack-grid,.smeter-stack-meter:before{right:36px}}
@media(max-width:900px){.smeter-stack-meter{min-height:106px}}
@media(max-width:640px){.smeter-stack-meter{min-height:90px}.smeter-stack-scale span{font-size:9px}.smeter-stack-fill,.smeter-stack-grid,.smeter-stack-meter:before{right:35px}}


/* v22.57: letzter Punkt-5-Feinschliff: Treppenmeter ohne interne Linien, sauberer Glow, mehr Abstand zur Audio-FFT. */
.smeter-stack-grid{
  background:none!important;
  box-shadow:none!important;
}
.smeter-stack-meter:before,
.smeter-stack-scale span:before{
  display:none!important;
}
.smeter-stack-meter{
  box-shadow:
    inset 0 0 26px rgba(0,0,0,.66),
    inset 0 0 0 1px rgba(255,179,62,.055),
    0 0 18px rgba(255,130,36,.14),
    0 0 26px rgba(32,255,115,.075)!important;
}
.smeter-stack-fill{
  box-shadow:
    0 0 15px rgba(57,255,108,.42),
    0 0 24px rgba(255,165,54,.22),
    inset 0 0 10px rgba(255,255,255,.10)!important;
}
.smeter-dbm-stack-meter .smeter-stack-fill{
  box-shadow:
    0 0 15px rgba(57,255,108,.38),
    0 0 24px rgba(255,165,54,.20),
    inset 0 0 10px rgba(255,255,255,.09)!important;
}
.smeter-toggle-row{
  margin:-2px 0 24px!important;
}

/* v22.58: Punkt 6 - RX/Gain-Zeile und aktueller Tuner stehen im FT8-Modul gemeinsam in einer Zeile. */
#card_FT4 .ft8-rx-statusline{
  display:flex;
  align-items:center;
  flex-wrap:wrap;
  gap:10px;
  margin:4px 0 10px;
}
#card_FT4 .ft8-rx-statusline .freq{
  margin-bottom:0;
}
#card_FT4 .ft8-rx-statusline .activeSdrBadge{
  display:inline-flex;
  align-items:center;
  min-height:18px;
  border:1px solid #d43755;
  color:#ffdce5;
  background:linear-gradient(180deg,#8f0b27,#3b0010);
  box-shadow:0 0 14px rgba(212,55,85,.18), inset 0 0 12px rgba(255,255,255,.035);
  text-shadow:0 0 8px rgba(255,120,150,.22);
  padding:9px 12px;
  font-weight:1000;
  letter-spacing:.035em;
  text-transform:uppercase;
}
#card_FT4 .ft8-rx-statusline .tunerBadge{
  white-space:nowrap;
}
@media(max-width:720px){
  #card_FT4 .ft8-rx-statusline{align-items:stretch;}
  #card_FT4 .ft8-rx-statusline .freq,
  #card_FT4 .ft8-rx-statusline .activeSdrBadge{width:100%;justify-content:center;}
}


/* v22.59: Punkt 7 - WF-FPS und WF-SPAN als grüne Glow-Badges in der RX/Gain/Tuner-Zeile. */
#card_FT4 .ft8-waterfall-toggle-row{
  margin:6px 0 8px;
}
#card_FT4 .ft8-rx-statusline .fpsBadge,
#card_FT4 .ft8-rx-statusline .wfSpanBadge,
#card_FT4 .ft8-rx-statusline .ft8WfStatusBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:18px;
  border:1px solid rgba(66,255,138,.78)!important;
  color:#cbffd8!important;
  background:linear-gradient(180deg,rgba(5,78,31,.66),rgba(0,31,25,.88))!important;
  box-shadow:0 0 16px rgba(66,255,138,.24), inset 0 0 14px rgba(66,255,138,.12)!important;
  text-shadow:0 0 9px rgba(66,255,138,.45)!important;
  padding:9px 12px;
  font-weight:1000!important;
  letter-spacing:.035em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT4 .ft8-rx-statusline .wfSpanBadge b{
  color:#39ff7a!important;
  text-shadow:0 0 12px rgba(57,255,122,.62)!important;
}
#card_FT4 .ft8-rx-statusline .fpsBadge::before,
#card_FT4 .ft8-rx-statusline .wfSpanBadge::before{
  content:'';
  width:6px;
  height:6px;
  margin-right:7px;
  background:#39ff7a;
  box-shadow:0 0 10px rgba(57,255,122,.78);
}
@media(max-width:980px){
  #card_FT4 .ft8-rx-statusline .fpsBadge,
  #card_FT4 .ft8-rx-statusline .wfSpanBadge{
    flex:1 1 auto;
  }
}
@media(max-width:720px){
  #card_FT4 .ft8-rx-statusline .fpsBadge,
  #card_FT4 .ft8-rx-statusline .wfSpanBadge{
    width:100%;
  }
}

/* v22.69: FT8 Hz scope icon reference polish: square oscilloscope frame with waveform trace. */
#card_FT4 .ft8-table .hz-head,
#card_FT4 .ft8-table .hz-cell{
  text-align:center;
  vertical-align:middle;
  min-width:74px;
  width:78px;
  padding-left:4px;
  padding-right:4px;
}
#card_FT4 .ft8-table .hz-cell{
  line-height:1;
}
#card_FT4 .ft8-hz-scope{
  position:relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:64px;
  height:23px;
  border:1px solid rgba(57,255,20,.58);
  border-radius:0;
  background:linear-gradient(180deg,rgba(9,70,34,.94),rgba(3,35,18,.98));
  box-shadow:0 0 10px rgba(57,255,20,.20), inset 0 0 12px rgba(57,255,20,.10);
  overflow:hidden;
  vertical-align:middle;
}
#card_FT4 .ft8-hz-scope-svg{
  display:block;
  width:100%;
  height:100%;
}
#card_FT4 .ft8-hz-scope-grid-v line{
  stroke:rgba(0,0,0,.40);
  stroke-width:0.7;
}
#card_FT4 .ft8-hz-scope-grid-h line{
  stroke:rgba(0,0,0,.58);
  stroke-width:0.9;
  stroke-dasharray:1.5 2.4;
  stroke-linecap:round;
}
#card_FT4 .ft8-hz-scope-trace{
  fill:none;
  stroke:rgba(35,200,108,.58);
  stroke-width:1.2;
  stroke-linecap:round;
  stroke-linejoin:round;
}
#card_FT4 .ft8-hz-scope-trace-hi{
  fill:none;
  stroke:#42ff8a;
  stroke-width:1.7;
  stroke-linecap:round;
  stroke-linejoin:round;
  filter:drop-shadow(0 0 3px rgba(66,255,138,.65));
}
#card_FT4 .ft8-hz-scope.is-empty{
  border-color:rgba(159,185,198,.28);
  background:linear-gradient(180deg,rgba(18,32,28,.96),rgba(8,18,16,.98));
  box-shadow:inset 0 0 8px rgba(159,185,198,.08);
  opacity:.7;
}
#card_FT4 .ft8-hz-scope.is-empty .ft8-hz-scope-grid-v line,
#card_FT4 .ft8-hz-scope.is-empty .ft8-hz-scope-grid-h line{
  stroke:rgba(159,185,198,.18);
}



/* v22.71: FT8 toggle button polish - square Audio-FFT button and WF toggle below waterfall, right aligned. */
#card_FT4 .audiofft-toggle-row .audioFftToggle,
#card_FT4 .audiofft-toggle-row .audioFftToggle .audioBtnText{
  border-radius:0!important;
}
#card_FT4 .ft8-waterfall-toggle-row{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  width:100%;
  margin:8px 0 12px!important;
  padding:0;
}
#card_FT4 .ft8-waterfall-toggle-row .wfToggle{
  border-radius:0!important;
  min-width:92px;
  text-align:center;
}


/* v22.82: FT8 RX/WF/DEC-BW status line compact single-row polish. */
#card_FT4 .ft8-rx-statusline{
  flex-wrap:nowrap;
  align-items:center;
  gap:6px;
  margin:3px 0 8px;
  overflow-x:auto;
  overflow-y:hidden;
  scrollbar-width:thin;
}
#card_FT4 .ft8-rx-statusline .freq{
  flex:0 1 auto;
  min-width:0;
  white-space:nowrap;
  padding:7px 9px;
  font-size:12px;
  line-height:1.15;
}
#card_FT4 .ft8-rx-statusline .activeSdrBadge,
#card_FT4 .ft8-rx-statusline .fpsBadge,
#card_FT4 .ft8-rx-statusline .wfSpanBadge,
#card_FT4 .ft8-rx-statusline .ft8WfStatusBadge{
  flex:0 0 auto;
  min-height:14px;
  padding:7px 9px;
  font-size:11px;
  line-height:1.12;
  letter-spacing:.025em;
}
#card_FT4 .ft8-rx-statusline .fpsBadge::before,
#card_FT4 .ft8-rx-statusline .wfSpanBadge::before{
  width:5px;
  height:5px;
  margin-right:5px;
}
#card_FT4 .ft8-rx-statusline .ft8DecodeBwBadge{
  border-color:rgba(255,179,62,.72)!important;
  color:#ffe4b9!important;
  background:linear-gradient(180deg,rgba(92,48,6,.72),rgba(34,18,4,.90))!important;
  box-shadow:0 0 14px rgba(255,179,62,.18), inset 0 0 12px rgba(255,179,62,.08)!important;
  text-shadow:0 0 9px rgba(255,179,62,.34)!important;
}
#card_FT4 .ft8-rx-statusline .ft8DecodeBwBadge::before{
  background:#ffb33e;
  box-shadow:0 0 10px rgba(255,179,62,.70);
}
@media(max-width:720px){
  #card_FT4 .ft8-rx-statusline{align-items:center;}
  #card_FT4 .ft8-rx-statusline .freq,
  #card_FT4 .ft8-rx-statusline .activeSdrBadge,
  #card_FT4 .ft8-rx-statusline .fpsBadge,
  #card_FT4 .ft8-rx-statusline .wfSpanBadge{
    width:auto;
    justify-content:center;
  }
}

/* v22.87: FT8 status badge orange polish - WF-SPAN and DEC-BW stand out like WebFTR action buttons. */
#card_FT4 .ft8-rx-statusline .wfSpanBadge,
#card_FT4 .ft8-rx-statusline .ft8DecodeBwBadge{
  border-color:rgba(255,179,62,.92)!important;
  color:#fff1c9!important;
  background:linear-gradient(180deg,rgba(255,179,62,.34),rgba(103,48,0,.88) 44%,rgba(42,18,0,.96))!important;
  box-shadow:0 0 16px rgba(255,179,62,.34), inset 0 0 15px rgba(255,179,62,.13)!important;
  text-shadow:0 0 10px rgba(255,179,62,.58)!important;
}
#card_FT4 .ft8-rx-statusline .wfSpanBadge b,
#card_FT4 .ft8-rx-statusline .ft8DecodeBwBadge b{
  color:#ffd27e!important;
  text-shadow:0 0 12px rgba(255,179,62,.72)!important;
}
#card_FT4 .ft8-rx-statusline .wfSpanBadge::before,
#card_FT4 .ft8-rx-statusline .ft8DecodeBwBadge::before{
  background:#ffb33e!important;
  box-shadow:0 0 11px rgba(255,179,62,.86)!important;
}


/* v22.89: FT8 preset/WF-FFT toolbar polish under compact RX status line. */
#card_FT4 .preset-row.ft8-preset-toolbar{
  display:flex;
  align-items:center;
  justify-content:flex-start;
  flex-wrap:wrap;
  gap:6px;
  margin:0 0 8px!important;
  padding:0;
}
/* v23.53: PRESET/WF FFT label height matches the adjacent dropdowns. */
#card_FT4 .preset-row.ft8-preset-toolbar .small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:28px;
  min-height:28px;
  padding:0 8px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92));
  color:#ffe4b9;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08);
  text-shadow:0 0 9px rgba(255,179,62,.34);
  font-size:10px;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT4 .preset-row.ft8-preset-toolbar select{
  min-height:28px;
  max-width:260px;
  padding:6px 28px 6px 9px;
  border:1px solid rgba(255,179,62,.66);
  border-radius:0;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98));
  color:#fff1d6;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07);
  font-size:11px;
  font-weight:800;
  letter-spacing:.02em;
  outline:none;
}
#card_FT4 .preset-row.ft8-preset-toolbar select:focus{
  border-color:rgba(255,209,143,.96);
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10);
}
@media(max-width:720px){
  #card_FT4 .preset-row.ft8-preset-toolbar select{
    max-width:100%;
  }
}

/* v22.95: FT8 Audio-Info button orange polish - align height with Audio-FFT toggle. */
#card_FT4 .audiofft-toggle-row .audioInfoIcon{
  width:38px!important;
  min-width:38px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0!important;
  border-radius:0!important;
  border:1px solid rgba(255,179,62,.88)!important;
  color:#fff1d6!important;
  background:linear-gradient(180deg,#a94a07,#641c00)!important;
  box-shadow:0 0 16px rgba(255,126,30,.28), inset 0 0 10px rgba(255,255,255,.05)!important;
  font-size:16px!important;
  line-height:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  vertical-align:middle!important;
}
#card_FT4 .audiofft-toggle-row .audioInfoIcon:hover,
#card_FT4 .audiofft-toggle-row .audioInfoIcon:focus{
  border-color:rgba(255,216,77,1)!important;
  color:#ffffff!important;
  background:linear-gradient(180deg,#c8610a,#7a2600)!important;
  outline:0!important;
  box-shadow:0 0 20px rgba(255,179,62,.42), inset 0 0 12px rgba(255,216,77,.08)!important;
}


/* v23.55: Aufgabenliste Punkt 3 - FT8-Decode-Liste optisch entrahmen.
   Entfernt nur den blauen Außenrahmen der Decode-Liste und die Rahmen der orangefarbenen Info-Badges darüber.
   Tabellenlinien, Eingabefelder und Funktionslogik bleiben unverändert. */
#card_FT4 .ft8-box{
  border:0!important;
}
#card_FT4 .ft8-table-wrap{
  border:0!important;
}
#card_FT4 .ft8-box-head .ft8-filter-status,
#card_FT4 .ft8-box-head .ft8-session-info{
  border:0!important;
}

/* v23.56: Aufgabenliste Punkt 3 Nacharbeit - Status-/Decode-Bereich bündig zum Wasserfall.
   Entfernt nur den orangefarbenen Außen-/Content-Rahmen um die RX/Decoder/Stream-Statuszeile.
   Die einzelnen Badge-Ränder bleiben erhalten. Band Activity/Decode wird horizontal bündig
   zur Wasserfallbreite gezogen. Keine Decoder-, Stream- oder SDR-Logik geändert. */
#card_FT4 .ft8-controls{
  width:100%!important;
  box-sizing:border-box!important;
  border:0!important;
  padding:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#card_FT4 .ft8-grid{
  width:100%!important;
  box-sizing:border-box!important;
}
#card_FT4 .ft8-box{
  width:100%!important;
  box-sizing:border-box!important;
  padding-left:0!important;
  padding-right:0!important;
}
#card_FT4 .ft8-box-head{
  padding-left:0!important;
  padding-right:0!important;
}

/* v23.57: Aufgabenliste Punkt 4 - RX-Dialfrequenz als gruenes Badge in der Decode-Tabelle. */
#card_FT4 .ft8-table .rx-freq-cell{
  font-family:Consolas,monospace;
  text-align:center;
  vertical-align:middle;
}
#card_FT4 .ft8-rx-freq-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:78px;
  height:20px;
  padding:0 8px;
  border:1px solid rgba(57,255,20,.42);
  border-radius:7px;
  background:linear-gradient(180deg,rgba(57,255,20,.18),rgba(5,44,16,.38));
  color:#cffff0;
  font-family:Consolas,monospace;
  font-size:10px;
  font-weight:900;
  letter-spacing:.035em;
  line-height:1;
  white-space:nowrap;
  text-shadow:0 0 7px rgba(57,255,20,.35);
  box-shadow:0 0 10px rgba(57,255,20,.16),inset 0 0 8px rgba(57,255,20,.055);
}


/* v23.60: Aufgabenliste Punkt 8 - X-Reset-Buttons neben FT8-Filterfeldern exakt auf Eingabehoehe bringen. */
#card_FT4 .ft8-filterbar input,
#card_FT4 .ft8-countrybar input,
#card_FT4 .ft8-callbar input{
  height:30px;
  min-height:30px;
  box-sizing:border-box;
  line-height:1;
}
#card_FT4 .ft8-filterbar button,
#card_FT4 .ft8-countrybar button,
#card_FT4 .ft8-callbar button{
  width:30px;
  height:30px;
  min-width:30px;
  min-height:30px;
  padding:0!important;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
  font-size:16px;
  font-weight:800;
}

/* v23.61: Aufgabenliste Punkt 9 - Audio-Monitor Symbol eckig als Badge.
   Nur das hörbare Audio-Symbol im Audio-FFT-Modul wird optisch angepasst. */
#card_FT4 .audiofft-toggle-row .speakerBtn{
  border-radius:0!important;
  width:52px!important;
  min-width:52px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  color:#eafff0!important;
  border:1px solid rgba(57,255,112,.82)!important;
  background:linear-gradient(180deg,rgba(9,104,42,.96),rgba(2,48,20,.98))!important;
  box-shadow:0 0 14px rgba(57,255,112,.22), inset 0 0 10px rgba(255,255,255,.04)!important;
}
#card_FT4 .audiofft-toggle-row .speakerBtn.active{
  color:#fff4ef!important;
  border-color:rgba(255,82,52,.88)!important;
  background:linear-gradient(180deg,rgba(174,34,18,.98),rgba(82,7,3,.99))!important;
  box-shadow:0 0 16px rgba(255,82,52,.28), inset 0 0 10px rgba(255,255,255,.05)!important;
}
#card_FT4 .audiofft-toggle-row .speakerBtn .speakerIcon{
  width:25px!important;
  height:25px!important;
}
#card_FT4 .audiofft-toggle-row .speakerBtn .speakerIcon svg{
  width:25px!important;
  height:25px!important;
  stroke-width:2.15!important;
}

/* v23.62: Aufgabenliste Punkt 10 - Band-Activity-Text durch lokalen UTC-Sync ersetzen.
   Das Widget nutzt das lokale WebFTR-Backend als Zeitquelle und kontaktiert keine externen APIs. */
#card_FT4 .ft8-utc-sync-widget{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:28px;
  padding:5px 10px;
  border:1px solid rgba(57,255,20,.34);
  background:linear-gradient(180deg,rgba(57,255,20,.075),rgba(2,13,10,.62));
  color:#cffff0;
  font-family:Consolas,monospace;
  font-size:11px;
  font-weight:800;
  letter-spacing:.045em;
  text-transform:uppercase;
  white-space:nowrap;
  box-shadow:0 0 12px rgba(57,255,20,.10), inset 0 0 9px rgba(57,255,20,.035);
}
#card_FT4 .ft8-utc-sync-widget:before{
  content:"TIME";
  display:inline-block;
  margin-right:7px;
  color:#ffd18f;
  font-size:9px;
  font-weight:900;
  letter-spacing:.10em;
}
#card_FT4 .ft8-utc-sync-widget.is-synced{
  border-color:rgba(57,255,20,.44);
  color:#d9ffe2;
}
#card_FT4 .ft8-utc-sync-widget.is-fallback{
  border-color:rgba(255,179,62,.36);
  color:#ffe2b8;
  background:linear-gradient(180deg,rgba(255,179,62,.075),rgba(14,8,2,.58));
}
@media(max-width:900px){
  #card_FT4 .ft8-utc-sync-widget{width:100%;justify-content:flex-start;white-space:normal;}
}


/* v23.63: Aufgabenliste Punkt 11 - WF EIN/AUS unter dem Wasserfall etwas tiefer setzen.
   Nur Abstand der bestehenden Toggle-Zeile anpassen; keine Wasserfall- oder Button-Logik. */
#card_FT4 .ft8-waterfall-toggle-row{
  margin-top:16px!important;
  margin-bottom:12px!important;
}

/* v23.64: Aufgabenliste Punkt 12 - FT8-spezifische Button-Schriften nicht fett.
   Diese Datei lädt nach index.html, daher hier zusätzlich scoped überschreiben. */
#card_FT4 button,
#card_FT4 button *,
#card_FT4 .wfToggle,
#card_FT4 .audioModeToggle,
#card_FT4 .audioBtnText,
#card_FT4 .speakerBtn,
#card_FT4 .ft8-session-info,
#card_FT4 .ft8-filterbar button,
#card_FT4 .ft8-callbar button,
#card_FT4 .ft8-countrybar button,
#card_FT4 .ft8-exportbar button,
#card_FT4 .ft8-controls button{
  font-weight:400!important;
}

/* v23.65: Aufgabenliste Punkt 13 - CSV/PDF Buttons als EXPORT beschriften
   und hoehenmaessig an die FT8-Filter-/Textfelder angleichen. */
#card_FT4 .ft8-exportbar button:not(.ft8-session-info){
  height:30px;
  min-height:30px;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  padding:0 11px!important;
  line-height:1;
  white-space:nowrap;
}
#card_FT4 .ft8-exportbar{
  align-items:center;
}



/* v23.70: Aufgabenliste Punkt 18 - finale FT8-Content-Rahmen-Bereinigung.
   Entfernt die restlichen aeusseren Content-Rahmen/Panel-Effekte um die drei
   RX/Decoder/Stream-Badges sowie um den Decode-Tabellenbereich. Einzelne
   Badge-/Button-Raender, Filterfelder, Tabellenzeilen und Export-Controls bleiben erhalten. */
#card_FT4 .ft8-controls{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
  padding-left:0!important;
  padding-right:0!important;
}
#card_FT4 .ft8-grid,
#card_FT4 .ft8-box{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}
#card_FT4 .ft8-table-wrap{
  border:0!important;
  outline:0!important;
  box-shadow:none!important;
}
#card_FT4 .ft8-box-head{
  border:0!important;
  outline:0!important;
  background:transparent!important;
  box-shadow:none!important;
}


/* v23.72: Neuer FT8-Wasserfall-Kontrollstreifen.
   RX-Frequenz, PRESET, WF FFT, WF-SPAN, DEC-BW und der WF EIN/AUS-Button
   sitzen linksbuendig in einer gemeinsamen Zeile direkt unter dem Wasserfall.
   Nur Layout/CSS; keine SDR-, Wasserfall-, Audio- oder Decoder-Logik. */
#card_FT4 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  display:flex;
  justify-content:flex-start!important;
  align-items:center;
  flex-wrap:wrap;
  gap:6px;
  width:100%;
  box-sizing:border-box;
  margin-top:12px!important;
  margin-bottom:12px!important;
  padding:0!important;
}
#card_FT4 .ft8-wf-control-row .wfToggle{
  flex:0 0 auto;
  height:28px;
  min-height:28px;
  min-width:78px;
  padding:0 10px!important;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:1;
}
#card_FT4 .ft8-wf-control-row .ft8-wf-inline-badge,
#card_FT4 .ft8-wf-control-row .wfSpanBadge,
#card_FT4 .ft8-wf-control-row .ft8WfStatusBadge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:28px;
  min-height:28px;
  padding:0 9px!important;
  font-size:10.5px!important;
  line-height:1!important;
  letter-spacing:.025em!important;
  white-space:nowrap;
  flex:0 0 auto;
}
#card_FT4 .ft8-wf-control-row .ft8-wf-inline-badge{
  border:1px solid rgba(66,255,138,.72);
  color:#cbffd8;
  background:linear-gradient(180deg,rgba(5,78,31,.62),rgba(0,31,25,.90));
  box-shadow:0 0 14px rgba(66,255,138,.20), inset 0 0 12px rgba(66,255,138,.10);
  text-shadow:0 0 9px rgba(66,255,138,.36);
  text-transform:uppercase;
}
#card_FT4 .ft8-wf-control-row .ft8-wf-inline-badge b{
  color:#39ff7a;
  margin-right:3px;
  text-shadow:0 0 10px rgba(57,255,122,.56);
}
#card_FT4 .ft8-wf-control-row .ft8-wf-inline-badge::before{
  content:'';
  width:5px;
  height:5px;
  margin-right:6px;
  background:#39ff7a;
  box-shadow:0 0 10px rgba(57,255,122,.74);
}
#card_FT4 .ft8-wf-control-row .ft8-inline-select{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  height:28px;
  min-height:28px;
  margin:0;
  flex:0 0 auto;
}
#card_FT4 .ft8-wf-control-row .ft8-inline-select .small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:28px;
  min-height:28px;
  padding:0 7px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92));
  color:#ffe4b9;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08);
  text-shadow:0 0 9px rgba(255,179,62,.34);
  font-size:10px;
  font-weight:400!important;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT4 .ft8-wf-control-row .ft8-inline-select select{
  height:28px;
  min-height:28px;
  max-width:230px;
  padding:4px 24px 4px 8px;
  border:1px solid rgba(255,179,62,.66);
  border-radius:0;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98));
  color:#fff1d6;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07);
  font-size:11px;
  font-weight:400!important;
  letter-spacing:.02em;
  outline:none;
}
#card_FT4 .ft8-wf-control-row .ft8-inline-select select:focus{
  border-color:rgba(255,209,143,.96);
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10);
}
@media(max-width:920px){
  #card_FT4 .ft8-wf-control-row .ft8-inline-select,
  #card_FT4 .ft8-wf-control-row .ft8-inline-select select,
  #card_FT4 .ft8-wf-control-row .ft8-wf-inline-badge,
  #card_FT4 .ft8-wf-control-row .wfSpanBadge,
  #card_FT4 .ft8-wf-control-row .ft8WfStatusBadge{
    flex:1 1 auto;
  }
}
@media(max-width:640px){
  #card_FT4 .ft8-wf-control-row .wfToggle,
  #card_FT4 .ft8-wf-control-row .ft8-inline-select,
  #card_FT4 .ft8-wf-control-row .ft8-wf-inline-badge,
  #card_FT4 .ft8-wf-control-row .wfSpanBadge,
  #card_FT4 .ft8-wf-control-row .ft8WfStatusBadge{
    width:100%;
    justify-content:flex-start;
  }
  #card_FT4 .ft8-wf-control-row .ft8-inline-select select{
    flex:1 1 auto;
    max-width:none;
  }
}

/* v24.24/v24.25: FT8 UI bundle - Dropdowns oberhalb Wasserfall rechts, mehr Abstand zur Decode-Liste und interne Grid-Locator-Karte. */
#card_FT4 .ft8-wf-top-select-row{
  display:flex;
  justify-content:flex-end;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin:20px 0 7px!important;
  padding:0;
  width:100%;
}
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:4px;
  height:30px;
  min-height:30px;
  margin:0;
  flex:0 0 auto;
}
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select .small{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  height:30px;
  min-height:30px;
  padding:0 8px;
  border:1px solid rgba(255,179,62,.72);
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92));
  color:#ffe4b9;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08);
  text-shadow:0 0 9px rgba(255,179,62,.34);
  font-size:10px;
  font-weight:400!important;
  line-height:1;
  letter-spacing:.055em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select select{
  height:30px;
  min-height:30px;
  max-width:255px;
  padding:4px 26px 4px 8px;
  border:1px solid rgba(255,179,62,.66);
  border-radius:0;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98));
  color:#fff1d6;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07);
  font-size:11px;
  font-weight:400!important;
  letter-spacing:.02em;
  outline:none;
}
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select select:focus{
  border-color:rgba(255,209,143,.96);
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10);
}
#card_FT4 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  margin-bottom:24px!important;
}
#card_FT4 .ft8-grid{
  margin-top:20px!important;
}
/* v24.47: Alte FT8-interne Grid-/Maidenhead-Karten-CSS entfernt. Neue zentrale GridLocator-Plugin-Planung siehe frontend/plugins/gridlocator/README.md. */
/* v24.24: FT8-klickbare Buttons im gleichen Verlauf halten; Badges/Spans bleiben unberuehrt. */
#card_FT4 button,
#card_FT4 .btn{
  border:1px solid rgba(0,232,255,.56)!important;
  color:#f3fdff!important;
  background:radial-gradient(circle at 28% 0,rgba(255,255,255,.18),transparent 38%),linear-gradient(135deg,rgba(0,232,255,.30),rgba(0,80,118,.88) 45%,rgba(18,36,54,.96))!important;
  box-shadow:0 0 16px rgba(0,232,255,.18),inset 0 0 13px rgba(0,232,255,.075)!important;
  text-shadow:0 0 8px rgba(0,232,255,.34)!important;
  cursor:pointer;
  transition:filter .16s ease,transform .16s ease,box-shadow .16s ease,border-color .16s ease;
}
#card_FT4 button:hover,
#card_FT4 .btn:hover{
  filter:brightness(1.18);
  transform:translateY(-1px);
  border-color:rgba(255,209,143,.78)!important;
}


/* v24.25: FT8 Dropdown Restore + Decode Badge/Spacing Fix.
   Nur UI/CSS: PRESET/WF FFT bleiben sichtbar oben rechts, mehr Luft vor der Decode-Liste,
   Decode-Anzahl bekommt wieder einen klaren gruenen Neon-Rand trotz alter Rahmen-Cleanup-Regeln. */
#card_FT4 .ft8-wf-top-select-row{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:10px!important;
  flex-wrap:wrap!important;
  margin:24px 0 10px!important;
  padding-right:2px!important;
}
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select{
  display:inline-flex!important;
  visibility:visible!important;
  opacity:1!important;
}
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select select{
  display:inline-block!important;
  visibility:visible!important;
  opacity:1!important;
}
#card_FT4 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  margin-bottom:34px!important;
}
#card_FT4 .ft8-controls{
  margin-top:6px!important;
  margin-bottom:14px!important;
}
#card_FT4 .ft8-grid{
  margin-top:28px!important;
}
#card_FT4 .ft8-box-head .ft8-filter-status.ft8-decode-count{
  border:1px solid rgba(255,179,62,.88)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.30),rgba(126,48,0,.72))!important;
  color:#fff0cf!important;
  box-shadow:0 0 15px rgba(255,179,62,.32),0 0 24px rgba(255,111,40,.13),inset 0 0 11px rgba(255,216,77,.09)!important;
  text-shadow:0 0 9px rgba(255,179,62,.54)!important;
}
#card_FT4 .ft8-box-head .ft8-filter-status.ft8-decode-count.filtered{
  border-color:rgba(255,214,93,.98)!important;
  background:linear-gradient(180deg,rgba(255,214,93,.36),rgba(145,58,0,.80))!important;
  color:#fff8d7!important;
  box-shadow:0 0 18px rgba(255,179,62,.40),0 0 28px rgba(255,111,40,.17),inset 0 0 12px rgba(255,216,77,.12)!important;
}
@media(max-width:800px){
  #card_FT4 .ft8-wf-top-select-row{justify-content:flex-start!important;margin-top:18px!important;}
}


/* v24.26: FT8 Aktions-Toggle-Logik.
   Wenn eine Funktion aktiv ist, zeigt der Button die naechste Aktion in Rot: AUS.
   Wenn eine Funktion inaktiv ist, zeigt der Button die naechste Aktion in Gruen: EIN.
   Bewusst nur die echten FT8-Steuerbuttons, keine Badges/Chips. */
#card_FT4 .smeterToggle.active,
#card_FT4 .audiofft-toggle-row .audioFftToggle.active,
#card_FT4 .ft8-wf-control-row .wfToggle.active,
#card_FT4 .audiofft-toggle-row .speakerBtn.active{
  color:#fff6f1!important;
  border-color:rgba(255,82,52,.92)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(180deg,rgba(190,36,18,.98),rgba(88,8,4,.99))!important;
  box-shadow:0 0 18px rgba(255,82,52,.30), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,120,80,.34)!important;
}
#card_FT4 .smeterToggle.off,
#card_FT4 .audiofft-toggle-row .audioFftToggle.off,
#card_FT4 .ft8-wf-control-row .wfToggle.off,
#card_FT4 .audiofft-toggle-row .speakerBtn.off,
#card_FT4 .audiofft-toggle-row .speakerBtn:not(.active){
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
  text-shadow:0 0 9px rgba(57,255,112,.32)!important;
}
#card_FT4 .smeterToggle,
#card_FT4 .audiofft-toggle-row .audioFftToggle,
#card_FT4 .ft8-wf-control-row .wfToggle{
  font-weight:1000!important;
  letter-spacing:.08em!important;
}



/* v24.54: GridLocator MAP Toggle exakt wie die anderen Aktions-Toggles:
   Map sichtbar = rote Aktion MAP AUS, Map verborgen = gruene Aktion MAP EIN. */
#card_FT4 .ft8-gridlocator-toggle-row .gridlocatorToggle.active{
  color:#fff6f1!important;
  border-color:rgba(255,82,52,.92)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(180deg,rgba(190,36,18,.98),rgba(88,8,4,.99))!important;
  box-shadow:0 0 18px rgba(255,82,52,.30), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,120,80,.34)!important;
}
#card_FT4 .ft8-gridlocator-toggle-row .gridlocatorToggle.off{
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
  text-shadow:0 0 9px rgba(57,255,112,.32)!important;
}
#card_FT4 .ft8-gridlocator-toggle-row .gridlocatorToggle{
  font-weight:400!important;
  letter-spacing:.08em!important;
}

/* v24.27: Aufgabe 2 - FT8 Modul-Schliessen bleibt auch nach FT8 Button-Verlaufsregeln klar rot. */
#card_FT4 .close-btn{
  border:1px solid rgba(255,82,88,.92)!important;
  color:#fff4f4!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.18),transparent 38%),
    linear-gradient(180deg,rgba(196,25,42,.98),rgba(76,0,16,.99))!important;
  box-shadow:0 0 18px rgba(255,60,82,.32), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,125,130,.38)!important;
  text-transform:uppercase!important;
  letter-spacing:.055em!important;
  z-index:20;
}
#card_FT4 .close-btn:hover{
  border-color:rgba(255,150,150,.98)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.22),transparent 38%),
    linear-gradient(180deg,rgba(232,42,58,.99),rgba(104,0,20,.99))!important;
  box-shadow:0 0 22px rgba(255,70,90,.44), inset 0 0 13px rgba(255,255,255,.07)!important;
  filter:brightness(1.08);
}

/* v24.28: UI step 3 - FT8 Decode Präfix/Land filter text fields blue border.
   Only the editable text fields are changed; clear buttons and non-clickable badges stay unchanged. */
#card_FT4 .ft8-filterbar input.ft8-prefix-input,
#card_FT4 .ft8-countrybar input.ft8-country-input{
  border-color:rgba(0,186,255,.78)!important;
  box-shadow:0 0 12px rgba(0,186,255,.15), inset 0 0 10px rgba(0,0,0,.35)!important;
}
#card_FT4 .ft8-filterbar input.ft8-prefix-input:focus,
#card_FT4 .ft8-countrybar input.ft8-country-input:focus{
  border-color:rgba(0,232,255,.95)!important;
  box-shadow:0 0 16px rgba(0,232,255,.28), inset 0 0 10px rgba(0,0,0,.35)!important;
}


/* v24.29: UI step 4 - interne FT8 Grid-Locator-Karte mit groben schematischen Kontinent-/Landmassenlinien, ohne externe Tiles/CDNs. */

/* v24.30: UI step 5 - grüne WebFTR-Trennlinien zwischen S-Meter, Audio-FFT, Wasserfall und Decode-Liste. */
#card_FT4 .ft8-section-separator{
  position:relative;
  width:100%;
  height:22px;
  margin:16px 0 18px;
  pointer-events:none;
  user-select:none;
  opacity:.96;
}
#card_FT4 .ft8-section-separator::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(66,255,138,.18) 9%,rgba(66,255,138,.88) 24%,rgba(159,252,255,.58) 50%,rgba(66,255,138,.88) 76%,rgba(66,255,138,.18) 91%,transparent);
  box-shadow:0 0 10px rgba(66,255,138,.28),0 0 20px rgba(66,255,138,.10);
}
#card_FT4 .ft8-section-separator::after{
  content:"";
  position:absolute;
  left:9%;
  right:9%;
  top:50%;
  height:7px;
  transform:translateY(-50%);
  background:repeating-linear-gradient(115deg,transparent 0 16px,rgba(66,255,138,.40) 16px 18px,transparent 18px 34px);
  opacity:.62;
  filter:drop-shadow(0 0 5px rgba(66,255,138,.22));
}
#card_FT4 .ft8-section-separator span{
  position:absolute;
  left:50%;
  top:50%;
  width:78px;
  height:4px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(66,255,138,.62);
  background:linear-gradient(90deg,rgba(0,20,9,.92),rgba(66,255,138,.45),rgba(0,20,9,.92));
  box-shadow:0 0 12px rgba(66,255,138,.34),inset 0 0 8px rgba(66,255,138,.12);
}
#card_FT4 .ft8-section-separator-smeter{margin-top:14px;margin-bottom:18px;}
#card_FT4 .ft8-section-separator-audiofft{margin-top:18px;margin-bottom:22px;}
#card_FT4 .ft8-section-separator-waterfall{margin-top:20px;margin-bottom:18px;}
#card_FT4 .ft8-section-separator-decodes{margin-top:10px;margin-bottom:12px;}
#card_FT4 .smeter-hidden + .smeter-toggle-row + .ft8-section-separator-smeter{
  opacity:.58;
}
@media(max-width:760px){
  #card_FT4 .ft8-section-separator{height:18px;margin:12px 0 14px;}
  #card_FT4 .ft8-section-separator span{width:54px;}
}

/* v24.34: S-Meter layout polish + normal badge/button font weight.
   Outer green S/dBm stacks are slimmer, the center RX-FREQ seven-segment field is wider,
   and RX FREQ + mode badges sit side-by-side above the display. */
#card_FT4 .smeter-wrap{
  grid-template-columns:96px minmax(270px,1fr) 250px minmax(270px,1fr) 96px!important;
  gap:10px!important;
}
#card_FT4 .smeter-label,
#card_FT4 .smeter-readout{
  min-width:0!important;
}
#card_FT4 .smeter-center-readout{
  gap:9px!important;
  padding:10px 10px!important;
  min-width:0!important;
}
#card_FT4 .smeter-center-head-row{
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  gap:8px!important;
  width:100%!important;
  min-width:0!important;
}
#card_FT4 .smeter-center-head,
#card_FT4 .smeter-center-mode{
  flex:1 1 0!important;
  min-width:0!important;
  max-width:112px!important;
  min-height:24px!important;
  padding:4px 8px!important;
  font-size:10.5px!important;
  font-weight:400!important;
  letter-spacing:.13em!important;
  white-space:nowrap!important;
}
#card_FT4 .smeter-sevenseg{
  max-width:232px!important;
  padding:8px 6px 7px!important;
}
#card_FT4 .smeter-sevenseg-svg{
  max-width:218px!important;
}
@media(max-width:1280px){
  #card_FT4 .smeter-wrap{grid-template-columns:82px minmax(230px,1fr) 222px minmax(230px,1fr) 82px!important;gap:8px!important;}
  #card_FT4 .smeter-sevenseg{max-width:208px!important;}
  #card_FT4 .smeter-sevenseg-svg{max-width:196px!important;}
  #card_FT4 .smeter-center-head,
  #card_FT4 .smeter-center-mode{font-size:10px!important;padding:4px 7px!important;}
}
@media(max-width:900px){
  #card_FT4 .smeter-wrap{grid-template-columns:1fr 1fr!important;}
  #card_FT4 .smeter-center-readout{grid-column:1 / span 2!important;order:3!important;}
  #card_FT4 .smeter-sevenseg{max-width:236px!important;}
  #card_FT4 .smeter-sevenseg-svg{max-width:220px!important;}
}
@media(max-width:640px){
  #card_FT4 .smeter-wrap{grid-template-columns:1fr!important;}
  #card_FT4 .smeter-center-readout{grid-column:auto!important;}
}
#card_FT4 button,
#card_FT4 button *,
#card_FT4 .smeter-title-badge,
#card_FT4 .smeter-meter-title small,
#card_FT4 .smeter-center-head,
#card_FT4 .smeter-center-mode,
#card_FT4 .ft8-filter-status,
#card_FT4 .ft8-decode-count,
#card_FT4 .ft8-wf-inline-badge,
#card_FT4 .wfSpanBadge,
#card_FT4 .fpsBadge,
#card_FT4 .activeSdrBadge,
#card_FT4 .ft8WfStatusBadge,
#card_FT4 .ft8DecodeBwBadge,
#card_FT4 .ft8-session-info,
#card_FT4 .ft8-utc-sync-widget,
#card_FT4 .prefix-chip,
#card_FT4 .call-chip,
#card_FT4 .state-badge,
#card_FT4 .qso-badge,
#card_FT4 .dx-badge{
  font-weight:400!important;
}

/* v24.34 final: explicit normal-weight override for older high-specificity FT8 button/badge rules. */
#card_FT4 .smeterToggle,
#card_FT4 .audiofft-toggle-row .audioFftToggle,
#card_FT4 .ft8-wf-control-row .wfToggle,
#card_FT4 .audiofft-toggle-row .speakerBtn,
#card_FT4 .audiofft-toggle-row .audioBtn,
#card_FT4 .audioModeToggle,
#card_FT4 .close-btn,
#card_FT4 .decode-source,
#card_FT4 .ft8-country-code,
#card_FT4 .ft8-prefix-chip,
#card_FT4 .ft8-call-chip,
#card_FT4 .audioPeakBadge,
#card_FT4 .smeter-stack-scale span,
#card_FT4 .smeter-meter-title,
#card_FT4 .smeter-readout small{
  font-weight:400!important;
}


/* v24.73 FT4 Design Parity Layout Restore
   The v24.72 generated parity layer was intentionally NOT carried forward because
   it flattened media-query rules and stretched FT4 controls/S-Meter vertically.
   FT4 now keeps the stable v24.71 live/audio path and receives only safe visual
   parity rules that do not force controls to 100% width or stack the S-Meter. */
#card_FT4 .smeter-wrap{
  display:grid!important;
  grid-template-columns:96px minmax(270px,1fr) 250px minmax(270px,1fr) 96px!important;
  gap:10px!important;
  align-items:stretch!important;
  overflow-x:auto;
}
#card_FT4 .smeter-label,
#card_FT4 .smeter-meter,
#card_FT4 .smeter-center-readout,
#card_FT4 .smeter-readout{
  width:auto!important;
  max-width:none!important;
}
#card_FT4 .smeter-center-readout{
  grid-column:auto!important;
  order:initial!important;
}
#card_FT4 .smeter-sevenseg{max-width:232px!important;padding:8px 6px 7px!important;}
#card_FT4 .smeter-sevenseg-svg{max-width:218px!important;}
@media(max-width:1280px){
  #card_FT4 .smeter-wrap{grid-template-columns:82px minmax(230px,1fr) 222px minmax(230px,1fr) 82px!important;gap:8px!important;}
  #card_FT4 .smeter-sevenseg{max-width:208px!important;}
  #card_FT4 .smeter-sevenseg-svg{max-width:196px!important;}
}
@media(max-width:900px){
  #card_FT4 .smeter-wrap{grid-template-columns:82px minmax(230px,1fr) 222px minmax(230px,1fr) 82px!important;gap:8px!important;}
  #card_FT4 .smeter-center-readout{grid-column:auto!important;order:initial!important;}
}
#card_FT4 .preset-row.ft8-preset-toolbar,
#card_FT4 .ft8-waterfall-toggle-row,
#card_FT4 .ft8-wf-control-row,
#card_FT4 .ft8-filterbar,
#card_FT4 .ft8-exportbar{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
#card_FT4 .preset-row.ft8-preset-toolbar label,
#card_FT4 .ft8-wf-control-row > *,
#card_FT4 .ft8-waterfall-toggle-row > *,
#card_FT4 .ft8-filterbar > *,
#card_FT4 .ft8-exportbar > *{
  width:auto!important;
  max-width:100%!important;
  flex:0 0 auto!important;
}
#card_FT4 .preset-row.ft8-preset-toolbar select,
#card_FT4 .ft8-inline-select select,
#card_FT4 .wf-resolution-select{
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
}
#card_FT4 .ft8-waterfall-toggle-row .wfToggle,
#card_FT4 .audiofft-toggle-row .audioFftToggle,
#card_FT4 .audiofft-toggle-row .speakerBtn,
#card_FT4 .audioModeToggle,
#card_FT4 .smeterToggle,
#card_FT4 .gridlocatorToggle,
#card_FT4 .ft8-exportbar button,
#card_FT4 .ft8-filterbar button,
#card_FT4 .ft8-countrybar button,
#card_FT4 .ft8-callbar button{
  width:auto!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
#card_FT4 .wfSpanBadge,
#card_FT4 .fpsBadge,
#card_FT4 .activeSdrBadge,
#card_FT4 .ft8WfStatusBadge,
#card_FT4 .ft8DecodeBwBadge,
#card_FT4 .ft8-wf-inline-badge,
#card_FT4 .ft8-filter-status,
#card_FT4 .ft8-decode-count{
  width:auto!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
#card_FT4 button,
#card_FT4 button *,
#card_FT4 .wfSpanBadge,
#card_FT4 .fpsBadge,
#card_FT4 .activeSdrBadge,
#card_FT4 .ft8WfStatusBadge,
#card_FT4 .ft8DecodeBwBadge,
#card_FT4 .ft8-wf-inline-badge,
#card_FT4 .ft8-filter-status,
#card_FT4 .ft8-decode-count{
  font-weight:400!important;
}


/* v24.74 JS8 Message Shell Step 1 */
#card_JS8 .js8-message-shell{
  border:1px solid rgba(0,232,255,.28);
  background:linear-gradient(180deg,rgba(0,20,28,.78),rgba(0,8,12,.92));
  box-shadow:inset 0 0 18px rgba(0,232,255,.06),0 0 18px rgba(0,0,0,.22);
  padding:10px;
  margin:10px 0 12px;
}
#card_JS8 .js8-shell-head{
  display:flex;
  gap:10px;
  align-items:center;
  flex-wrap:wrap;
  border-bottom:1px solid rgba(0,232,255,.18);
  padding-bottom:8px;
  margin-bottom:10px;
}
#card_JS8 .js8-shell-title{
  color:#9ffcff;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#card_JS8 .js8-shell-subtitle{
  color:#b8cbd2;
  font-size:11px;
  font-family:Consolas,monospace;
}
#card_JS8 .js8-shell-count{
  margin-left:auto;
  border:1px solid rgba(255,179,62,.42);
  background:linear-gradient(180deg,rgba(92,42,0,.72),rgba(32,14,0,.95));
  color:#ffd18f;
  padding:5px 10px;
  font-size:11px;
  font-weight:900;
  white-space:nowrap;
}
#card_JS8 .js8-shell-grid{
  display:grid;
  grid-template-columns:minmax(190px,.7fr) minmax(280px,1.4fr) minmax(180px,.7fr);
  gap:10px;
}
#card_JS8 .js8-panel{
  border:1px solid rgba(0,232,255,.22);
  background:rgba(0,10,16,.72);
  min-height:120px;
}
#card_JS8 .js8-panel header{
  color:#9ffcff;
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  padding:7px 8px;
  border-bottom:1px solid rgba(0,232,255,.16);
  background:rgba(0,50,64,.24);
}
#card_JS8 .js8-message-list,
#card_JS8 .js8-heartbeat-list,
#card_JS8 .js8-station-list{
  padding:8px;
  font-family:Consolas,monospace;
  font-size:12px;
  color:#dffbff;
  min-height:82px;
}
#card_JS8 .js8-empty{
  display:block;
  color:#93a7ad;
  opacity:.92;
  line-height:1.5;
}
#card_JS8 .js8-message-item{
  border-left:3px solid rgba(0,232,255,.45);
  background:rgba(0,32,44,.48);
  margin:0 0 7px;
  padding:7px 8px;
}
#card_JS8 .js8-message-item b{color:#9ffcff;margin-right:8px}
#card_JS8 .js8-message-item span{color:#ffd18f;font-size:11px}
#card_JS8 .js8-message-item p{margin:5px 0 0;color:#eaffff;white-space:pre-wrap}
#card_JS8 .js8-station-chip,
#card_JS8 .js8-heartbeat-chip{
  display:inline-flex;
  border:1px solid rgba(0,232,255,.28);
  color:#dffbff;
  background:rgba(0,36,48,.62);
  padding:4px 7px;
  margin:3px;
  font-size:11px;
}
#card_JS8 .ft8-filterbar,
#card_JS8 .ft8-countrybar,
#card_JS8 .ft8-callbar,
#card_JS8 .ft8-exportbar{
  width:auto!important;
  flex:0 0 auto!important;
}
#card_JS8 button,
#card_JS8 select,
#card_JS8 input{
  max-width:100%;
}
@media(max-width:900px){
  #card_JS8 .js8-shell-grid{grid-template-columns:1fr}
  #card_JS8 .js8-shell-count{margin-left:0}
}


/* v24.75 JS8 Style Cleanup / Safe Parity Hotfix
   JS8 keeps its message-oriented shell, but controls/buttons/badges now follow the
   confirmed FT8/FT4 WebFTR visual language. This intentionally mirrors only safe
   compact control/layout styling and does NOT copy broad unsafe parity layers. */
#card_JS8{
  --webftr-js8-style-parity:"v24.75";
}
#card_JS8 .smeter-wrap{
  display:grid!important;
  grid-template-columns:96px minmax(270px,1fr) 250px minmax(270px,1fr) 96px!important;
  gap:10px!important;
  align-items:stretch!important;
  overflow-x:auto;
}
#card_JS8 .smeter-label,
#card_JS8 .smeter-meter,
#card_JS8 .smeter-center-readout,
#card_JS8 .smeter-readout{
  width:auto!important;
  max-width:none!important;
}
#card_JS8 .smeter-center-readout{
  grid-column:auto!important;
  order:initial!important;
}
#card_JS8 .smeter-sevenseg{max-width:232px!important;padding:8px 6px 7px!important;}
#card_JS8 .smeter-sevenseg-svg{max-width:218px!important;}
@media(max-width:1280px){
  #card_JS8 .smeter-wrap{grid-template-columns:82px minmax(230px,1fr) 222px minmax(230px,1fr) 82px!important;gap:8px!important;}
  #card_JS8 .smeter-sevenseg{max-width:208px!important;}
  #card_JS8 .smeter-sevenseg-svg{max-width:196px!important;}
}
@media(max-width:900px){
  #card_JS8 .smeter-wrap{grid-template-columns:82px minmax(230px,1fr) 222px minmax(230px,1fr) 82px!important;gap:8px!important;}
  #card_JS8 .smeter-center-readout{grid-column:auto!important;order:initial!important;}
}
#card_JS8 .ft8-section-separator{
  position:relative;
  width:100%;
  height:22px;
  margin:16px 0 18px;
  pointer-events:none;
  user-select:none;
  opacity:.96;
}
#card_JS8 .ft8-section-separator::before{
  content:"";
  position:absolute;
  left:0;
  right:0;
  top:50%;
  height:1px;
  transform:translateY(-50%);
  background:linear-gradient(90deg,transparent,rgba(66,255,138,.18) 9%,rgba(66,255,138,.88) 24%,rgba(159,252,255,.58) 50%,rgba(66,255,138,.88) 76%,rgba(66,255,138,.18) 91%,transparent);
  box-shadow:0 0 10px rgba(66,255,138,.28),0 0 20px rgba(66,255,138,.10);
}
#card_JS8 .ft8-section-separator::after{
  content:"";
  position:absolute;
  left:9%;
  right:9%;
  top:50%;
  height:7px;
  transform:translateY(-50%);
  background:repeating-linear-gradient(115deg,transparent 0 16px,rgba(66,255,138,.40) 16px 18px,transparent 18px 34px);
  opacity:.62;
  filter:drop-shadow(0 0 5px rgba(66,255,138,.22));
}
#card_JS8 .ft8-section-separator span{
  position:absolute;
  left:50%;
  top:50%;
  width:78px;
  height:4px;
  transform:translate(-50%,-50%);
  border:1px solid rgba(66,255,138,.62);
  background:linear-gradient(90deg,rgba(0,20,9,.92),rgba(66,255,138,.45),rgba(0,20,9,.92));
  box-shadow:0 0 12px rgba(66,255,138,.34),inset 0 0 8px rgba(66,255,138,.12);
}
#card_JS8 .ft8-section-separator-smeter{margin-top:14px;margin-bottom:18px;}
#card_JS8 .ft8-section-separator-audiofft{margin-top:18px;margin-bottom:22px;}
#card_JS8 .ft8-section-separator-waterfall{margin-top:20px;margin-bottom:18px;}
#card_JS8 .preset-row.ft8-preset-toolbar,
#card_JS8 .ft8-wf-top-select-row,
#card_JS8 .ft8-waterfall-toggle-row,
#card_JS8 .ft8-wf-control-row,
#card_JS8 .ft8-filterbar,
#card_JS8 .ft8-countrybar,
#card_JS8 .ft8-callbar,
#card_JS8 .ft8-exportbar,
#card_JS8 .gridlocator-toggle-row,
#card_JS8 .smeter-toggle-row{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:8px!important;
}
#card_JS8 .preset-row.ft8-preset-toolbar label,
#card_JS8 .ft8-wf-top-select-row label,
#card_JS8 .ft8-wf-control-row > *,
#card_JS8 .ft8-waterfall-toggle-row > *,
#card_JS8 .ft8-filterbar > *,
#card_JS8 .ft8-countrybar > *,
#card_JS8 .ft8-callbar > *,
#card_JS8 .ft8-exportbar > *,
#card_JS8 .gridlocator-toggle-row > *,
#card_JS8 .smeter-toggle-row > *{
  width:auto!important;
  max-width:100%!important;
  flex:0 0 auto!important;
}
#card_JS8 .preset-row.ft8-preset-toolbar select,
#card_JS8 .ft8-inline-select select,
#card_JS8 .wf-resolution-select,
#card_JS8 select{
  width:auto!important;
  min-width:0!important;
  max-width:100%!important;
}
#card_JS8 .ft8-waterfall-toggle-row .wfToggle,
#card_JS8 .ft8-wf-control-row .wfToggle,
#card_JS8 .audiofft-toggle-row .audioFftToggle,
#card_JS8 .audiofft-toggle-row .speakerBtn,
#card_JS8 .audioModeToggle,
#card_JS8 .smeterToggle,
#card_JS8 .gridlocatorToggle,
#card_JS8 .ft8-exportbar button,
#card_JS8 .ft8-filterbar button,
#card_JS8 .ft8-countrybar button,
#card_JS8 .ft8-callbar button,
#card_JS8 button{
  width:auto!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
}
#card_JS8 .wfSpanBadge,
#card_JS8 .fpsBadge,
#card_JS8 .activeSdrBadge,
#card_JS8 .ft8WfStatusBadge,
#card_JS8 .ft8DecodeBwBadge,
#card_JS8 .ft8-wf-inline-badge,
#card_JS8 .ft8-filter-status,
#card_JS8 .ft8-decode-count,
#card_JS8 .audioPeakBadge,
#card_JS8 .js8-shell-count{
  width:auto!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
  font-weight:400!important;
}
#card_JS8 button,
#card_JS8 button *,
#card_JS8 .wfSpanBadge,
#card_JS8 .fpsBadge,
#card_JS8 .activeSdrBadge,
#card_JS8 .ft8WfStatusBadge,
#card_JS8 .ft8DecodeBwBadge,
#card_JS8 .ft8-wf-inline-badge,
#card_JS8 .ft8-filter-status,
#card_JS8 .ft8-decode-count,
#card_JS8 .audioPeakBadge,
#card_JS8 .js8-shell-count,
#card_JS8 .js8-panel header{
  font-weight:400!important;
}
#card_JS8 .ft8-inline-select .small,
#card_JS8 .ft8-inline-select b.small{
  border-color:rgba(0,232,255,.42)!important;
  background:linear-gradient(180deg,rgba(0,58,76,.78),rgba(0,20,30,.92))!important;
  color:#9ffcff!important;
  box-shadow:0 0 10px rgba(0,232,255,.13)!important;
}
#card_JS8 .ft8-inline-select select,
#card_JS8 select{
  border-color:rgba(0,232,255,.48)!important;
  background:linear-gradient(180deg,rgba(0,39,52,.96),rgba(0,12,18,.98))!important;
  color:#e8fbff!important;
  box-shadow:inset 0 0 10px rgba(0,232,255,.08),0 0 8px rgba(0,232,255,.08)!important;
}
#card_JS8 .ft8-gain-select .small{
  border-color:rgba(66,214,138,.72)!important;
  background:linear-gradient(180deg,rgba(0,52,28,.78),rgba(0,20,12,.92))!important;
  color:#caffdd!important;
}
#card_JS8 .ft8-gain-select select{
  border-color:rgba(66,214,138,.66)!important;
  background:linear-gradient(180deg,rgba(0,39,22,.96),rgba(0,12,8,.98))!important;
  color:#dfffe9!important;
}
#card_JS8 .ft8-filterbar input,
#card_JS8 .ft8-countrybar input,
#card_JS8 .ft8-callbar input,
#card_JS8 input{
  width:auto!important;
  min-width:120px!important;
  max-width:220px!important;
  border:1px solid rgba(0,186,255,.62)!important;
  background:rgba(0,18,28,.88)!important;
  color:#dffbff!important;
  box-shadow:inset 0 0 10px rgba(0,232,255,.08)!important;
}
#card_JS8 .js8-message-shell{
  border:1px solid rgba(0,232,255,.24);
  background:linear-gradient(180deg,rgba(1,10,16,.74),rgba(0,4,8,.92));
  box-shadow:inset 0 0 18px rgba(0,232,255,.055),0 0 18px rgba(0,0,0,.24);
  padding:10px;
  margin:14px 0 14px;
}
#card_JS8 .js8-shell-head{
  border-bottom:1px solid rgba(66,255,138,.18);
  padding-bottom:8px;
  margin-bottom:10px;
}
#card_JS8 .js8-shell-title{
  color:#9ffcff;
  font-weight:400!important;
  letter-spacing:.12em;
}
#card_JS8 .js8-shell-subtitle{
  color:#9fb2bd;
  font-size:11px;
  font-family:Consolas,monospace;
}
#card_JS8 .js8-shell-count{
  border:1px solid rgba(255,179,62,.42);
  background:linear-gradient(180deg,rgba(92,42,0,.68),rgba(32,14,0,.92));
  color:#ffd18f;
  padding:5px 10px;
  font-size:11px;
}
#card_JS8 .js8-shell-grid{
  display:grid;
  grid-template-columns:minmax(190px,.7fr) minmax(280px,1.4fr) minmax(180px,.7fr);
  gap:10px;
}
#card_JS8 .js8-panel{
  border:1px solid rgba(0,232,255,.18);
  background:rgba(0,8,14,.74);
  min-height:120px;
  box-shadow:inset 0 0 12px rgba(0,232,255,.035);
}
#card_JS8 .js8-panel header{
  color:#9ffcff;
  font-size:11px;
  letter-spacing:.09em;
  padding:7px 8px;
  border-bottom:1px solid rgba(0,232,255,.13);
  background:linear-gradient(180deg,rgba(0,50,64,.26),rgba(0,18,24,.35));
}
#card_JS8 .js8-empty{
  color:#9fb2bd;
  opacity:.92;
}
#card_JS8 .js8-station-chip,
#card_JS8 .js8-heartbeat-chip{
  border:1px solid rgba(0,232,255,.28);
  color:#dffbff;
  background:rgba(0,36,48,.62);
  padding:4px 7px;
  margin:3px;
  font-size:11px;
}
@media(max-width:900px){
  #card_JS8 .js8-shell-grid{grid-template-columns:1fr}
  #card_JS8 .js8-shell-count{margin-left:0}
}


/* v24.76 JS8 Control Style Polish
   Targeted JS8-only control polish after v24.75. This fixes remaining old-style
   AudioFFT, speaker, info, S-Meter, MAP, preset/gain and waterfall controls
   without broad layout mirroring or any live/decoder changes. */
#card_JS8 .audiofft-toggle-row{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:10px!important;
  flex-wrap:wrap!important;
}
#card_JS8 .audioControlPanel{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-end!important;
  gap:10px!important;
  flex-wrap:nowrap!important;
}
#card_JS8 .audiofft-toggle-row .audioFftToggle,
#card_JS8 .audiofft-toggle-row .audioFftToggle .audioBtnText{
  border-radius:0!important;
}
#card_JS8 .audiofft-toggle-row .audioFftToggle{
  width:auto!important;
  min-width:124px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0 14px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  white-space:nowrap!important;
  letter-spacing:.08em!important;
  line-height:1!important;
}
#card_JS8 .audiofft-toggle-row .speakerBtn{
  border-radius:0!important;
  width:52px!important;
  min-width:52px!important;
  max-width:52px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  color:#eafff0!important;
  border:1px solid rgba(57,255,112,.82)!important;
  background:linear-gradient(180deg,rgba(9,104,42,.96),rgba(2,48,20,.98))!important;
  box-shadow:0 0 14px rgba(57,255,112,.22), inset 0 0 10px rgba(255,255,255,.04)!important;
}
#card_JS8 .audiofft-toggle-row .speakerBtn.active{
  color:#fff4ef!important;
  border-color:rgba(255,82,52,.88)!important;
  background:linear-gradient(180deg,rgba(174,34,18,.98),rgba(82,7,3,.99))!important;
  box-shadow:0 0 16px rgba(255,82,52,.28), inset 0 0 10px rgba(255,255,255,.05)!important;
}
#card_JS8 .audiofft-toggle-row .speakerBtn.off,
#card_JS8 .audiofft-toggle-row .speakerBtn:not(.active){
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
}
#card_JS8 .audiofft-toggle-row .speakerBtn .speakerIcon,
#card_JS8 .audiofft-toggle-row .speakerBtn .speakerIcon svg{
  width:25px!important;
  height:25px!important;
  stroke-width:2.15!important;
}
#card_JS8 .audiofft-toggle-row .audioInfoIcon{
  width:38px!important;
  min-width:38px!important;
  max-width:38px!important;
  height:37px!important;
  min-height:37px!important;
  padding:0!important;
  border-radius:0!important;
  border:1px solid rgba(255,179,62,.88)!important;
  color:#fff1d6!important;
  background:linear-gradient(180deg,#a94a07,#641c00)!important;
  box-shadow:0 0 16px rgba(255,126,30,.28), inset 0 0 10px rgba(255,255,255,.05)!important;
  font-size:16px!important;
  line-height:1!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  text-align:center!important;
  vertical-align:middle!important;
}
#card_JS8 .audiofft-toggle-row .audioInfoIcon:hover,
#card_JS8 .audiofft-toggle-row .audioInfoIcon:focus{
  border-color:rgba(255,216,77,1)!important;
  color:#ffffff!important;
  background:linear-gradient(180deg,#c8610a,#7a2600)!important;
  outline:0!important;
  box-shadow:0 0 20px rgba(255,179,62,.42), inset 0 0 12px rgba(255,216,77,.08)!important;
}
#card_JS8 .smeter-toggle-row,
#card_JS8 .gridlocator-toggle-row{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  width:100%!important;
  margin:8px 0 12px!important;
  padding:0!important;
}
#card_JS8 .smeterToggle,
#card_JS8 .gridlocatorToggle,
#card_JS8 .ft8-wf-control-row .wfToggle,
#card_JS8 .audiofft-toggle-row .audioFftToggle{
  border-radius:0!important;
  min-width:92px!important;
  text-align:center!important;
  font-weight:1000!important;
  letter-spacing:.08em!important;
}
#card_JS8 .smeterToggle.active,
#card_JS8 .gridlocatorToggle.active,
#card_JS8 .audiofft-toggle-row .audioFftToggle.active,
#card_JS8 .ft8-wf-control-row .wfToggle.active{
  color:#fff6f1!important;
  border-color:rgba(255,82,52,.92)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(180deg,rgba(190,36,18,.98),rgba(88,8,4,.99))!important;
  box-shadow:0 0 18px rgba(255,82,52,.30), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:0 0 9px rgba(255,120,80,.34)!important;
}
#card_JS8 .smeterToggle.off,
#card_JS8 .gridlocatorToggle.off,
#card_JS8 .audiofft-toggle-row .audioFftToggle.off,
#card_JS8 .ft8-wf-control-row .wfToggle.off{
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
  text-shadow:0 0 9px rgba(57,255,112,.32)!important;
}
#card_JS8 .preset-row.ft8-preset-toolbar{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:6px!important;
  margin:0 0 8px!important;
  padding:0!important;
}
#card_JS8 .preset-row.ft8-preset-toolbar .small,
#card_JS8 .ft8-wf-top-select-row .small,
#card_JS8 .ft8-inline-select .small{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  height:28px!important;
  min-height:28px!important;
  padding:0 8px!important;
  border:1px solid rgba(255,179,62,.72)!important;
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92))!important;
  color:#ffe4b9!important;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08)!important;
  text-shadow:0 0 9px rgba(255,179,62,.34)!important;
  font-size:10px!important;
  line-height:1!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
  font-weight:400!important;
}
#card_JS8 .preset-row.ft8-preset-toolbar select,
#card_JS8 .ft8-inline-select select,
#card_JS8 .wf-resolution-select{
  min-height:28px!important;
  max-width:260px!important;
  padding:6px 28px 6px 9px!important;
  border:1px solid rgba(255,179,62,.66)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98))!important;
  color:#fff1d6!important;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07)!important;
  font-size:11px!important;
  font-weight:800!important;
  letter-spacing:.02em!important;
  outline:none!important;
}
#card_JS8 .ft8-gain-select .small{
  border-color:rgba(66,214,138,.72)!important;
  background:linear-gradient(180deg,rgba(0,52,28,.78),rgba(0,20,12,.92))!important;
  color:#caffdd!important;
  box-shadow:0 0 10px rgba(66,214,138,.16)!important;
}
#card_JS8 .ft8-gain-select select{
  border-color:rgba(66,214,138,.66)!important;
  background:linear-gradient(180deg,rgba(0,39,22,.96),rgba(0,12,8,.98))!important;
  color:#dfffe9!important;
}
#card_JS8 .ft8-rx-statusline{
  flex-wrap:nowrap!important;
  align-items:center!important;
  gap:6px!important;
  margin:3px 0 8px!important;
  overflow-x:auto!important;
  overflow-y:hidden!important;
  scrollbar-width:thin!important;
}
#card_JS8 .ft8-rx-statusline .freq,
#card_JS8 .ft8-rx-statusline .activeSdrBadge,
#card_JS8 .ft8-rx-statusline .fpsBadge,
#card_JS8 .ft8-rx-statusline .wfSpanBadge,
#card_JS8 .ft8-rx-statusline .ft8WfStatusBadge,
#card_JS8 .ft8-rx-statusline .ft8DecodeBwBadge{
  flex:0 0 auto!important;
  min-height:14px!important;
  padding:7px 9px!important;
  font-size:11px!important;
  line-height:1.12!important;
  letter-spacing:.025em!important;
  width:auto!important;
  white-space:nowrap!important;
}
#card_JS8 .ft8-rx-statusline .wfSpanBadge,
#card_JS8 .ft8-rx-statusline .ft8DecodeBwBadge,
#card_JS8 .wfSpanBadge,
#card_JS8 .ft8DecodeBwBadge{
  border-color:rgba(255,179,62,.92)!important;
  color:#fff1c9!important;
  background:linear-gradient(180deg,rgba(255,179,62,.34),rgba(103,48,0,.88) 44%,rgba(42,18,0,.96))!important;
  box-shadow:0 0 16px rgba(255,179,62,.34), inset 0 0 15px rgba(255,179,62,.13)!important;
  text-shadow:0 0 10px rgba(255,179,62,.58)!important;
}
#card_JS8 .ft8-exportbar{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  flex-wrap:wrap!important;
}
#card_JS8 .ft8-exportbar .ft8-session-info{
  min-width:42px!important;
  height:30px!important;
  padding:0 10px!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  border-radius:0!important;
  white-space:nowrap!important;
  color:#fff1d6!important;
  border:1px solid rgba(255,179,62,.72)!important;
  background:linear-gradient(180deg,rgba(92,48,6,.80),rgba(34,18,4,.94))!important;
  box-shadow:0 0 12px rgba(255,179,62,.16), inset 0 0 10px rgba(255,179,62,.08)!important;
}
#card_JS8 .ft8-waterfall-toggle-row.ft8-wf-control-row{
  justify-content:flex-end!important;
  margin-bottom:34px!important;
}
#card_JS8 button,
#card_JS8 button *,
#card_JS8 .ft8-session-info,
#card_JS8 .wfSpanBadge,
#card_JS8 .fpsBadge,
#card_JS8 .activeSdrBadge,
#card_JS8 .ft8WfStatusBadge,
#card_JS8 .ft8DecodeBwBadge,
#card_JS8 .ft8-wf-inline-badge,
#card_JS8 .ft8-filter-status,
#card_JS8 .ft8-decode-count,
#card_JS8 .audioPeakBadge,
#card_JS8 .smeter-title-badge,
#card_JS8 .smeter-meter-title small,
#card_JS8 .smeter-center-head,
#card_JS8 .smeter-center-mode{
  font-weight:400!important;
}


/* v24.77 JS8 Waterfall Badge Row / Gadget Polish
   Final JS8 control polish: waterfall badges left, WF toggle right, gadget-style
   badges, normal button weights, and GridLocator toggle spacing. */
#card_JS8 .ft8-waterfall-toggle-row.ft8-wf-control-row,
#card_JS8 .meta.ft8-waterfall-toggle-row.ft8-wf-control-row{
  display:flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  flex-wrap:wrap!important;
  gap:7px!important;
  width:100%!important;
  margin:8px 0 18px!important;
  padding:0!important;
}
#card_JS8 .ft8-waterfall-toggle-row.ft8-wf-control-row > span,
#card_JS8 .meta.ft8-waterfall-toggle-row.ft8-wf-control-row > span{
  order:1!important;
  flex:0 0 auto!important;
  width:auto!important;
  max-width:100%!important;
  white-space:nowrap!important;
}
#card_JS8 .ft8-waterfall-toggle-row.ft8-wf-control-row > .wfToggle,
#card_JS8 .meta.ft8-waterfall-toggle-row.ft8-wf-control-row > .wfToggle{
  order:9!important;
  margin-left:auto!important;
  flex:0 0 auto!important;
  width:auto!important;
  min-width:86px!important;
  max-width:none!important;
  white-space:nowrap!important;
  font-weight:400!important;
}
#card_JS8 .ft8-wf-inline-badge,
#card_JS8 .ft8-rx-main-badge,
#card_JS8 .fpsBadge,
#card_JS8 .js8-wf-fps-badge,
#card_JS8 .wfSpanBadge,
#card_JS8 .ft8WfStatusBadge,
#card_JS8 .ft8DecodeBwBadge{
  box-sizing:border-box!important;
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  width:auto!important;
  min-height:29px!important;
  padding:6px 10px!important;
  border-radius:0!important;
  flex:0 0 auto!important;
  white-space:nowrap!important;
  font-size:10.5px!important;
  line-height:1.1!important;
  letter-spacing:.045em!important;
  font-weight:400!important;
  text-transform:uppercase!important;
}
#card_JS8 .ft8-rx-main-badge{
  border:1px solid rgba(0,232,255,.58)!important;
  color:#dffcff!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.12),transparent 40%),
    linear-gradient(180deg,rgba(0,76,96,.82),rgba(0,24,36,.96))!important;
  box-shadow:0 0 14px rgba(0,232,255,.16), inset 0 0 12px rgba(0,232,255,.06)!important;
  text-shadow:0 0 9px rgba(0,232,255,.34)!important;
}
#card_JS8 .fpsBadge,
#card_JS8 .js8-wf-fps-badge{
  border:1px solid rgba(66,255,138,.66)!important;
  color:#caffdd!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.13),transparent 40%),
    linear-gradient(180deg,rgba(0,82,38,.82),rgba(0,25,18,.96))!important;
  box-shadow:0 0 14px rgba(66,255,138,.18), inset 0 0 12px rgba(66,255,138,.07)!important;
  text-shadow:0 0 9px rgba(66,255,138,.34)!important;
}
#card_JS8 .wfSpanBadge,
#card_JS8 .ft8WfStatusBadge,
#card_JS8 .ft8DecodeBwBadge{
  border:1px solid rgba(255,179,62,.76)!important;
  color:#fff1c9!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.14),transparent 40%),
    linear-gradient(180deg,rgba(115,56,0,.82),rgba(42,18,0,.96))!important;
  box-shadow:0 0 15px rgba(255,179,62,.22), inset 0 0 13px rgba(255,179,62,.08)!important;
  text-shadow:0 0 9px rgba(255,179,62,.42)!important;
}
#card_JS8 .wfSpanBadge b,
#card_JS8 .ft8WfStatusBadge b,
#card_JS8 .ft8DecodeBwBadge b,
#card_JS8 .ft8-rx-main-badge b{
  font-weight:400!important;
  color:inherit!important;
}
#card_JS8 .ft8-waterfall-toggle-row.ft8-wf-control-row .wfToggle.active,
#card_JS8 .meta.ft8-waterfall-toggle-row.ft8-wf-control-row .wfToggle.active{
  color:#fff6f1!important;
  border-color:rgba(255,82,52,.92)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.16),transparent 38%),
    linear-gradient(180deg,rgba(190,36,18,.98),rgba(88,8,4,.99))!important;
  box-shadow:0 0 18px rgba(255,82,52,.30), inset 0 0 12px rgba(255,255,255,.055)!important;
  text-shadow:none!important;
}
#card_JS8 .ft8-waterfall-toggle-row.ft8-wf-control-row .wfToggle.off,
#card_JS8 .meta.ft8-waterfall-toggle-row.ft8-wf-control-row .wfToggle.off{
  color:#effff2!important;
  border-color:rgba(57,255,112,.86)!important;
  background:
    radial-gradient(circle at 28% 0,rgba(255,255,255,.15),transparent 38%),
    linear-gradient(180deg,rgba(9,126,48,.98),rgba(2,55,23,.99))!important;
  box-shadow:0 0 16px rgba(57,255,112,.26), inset 0 0 12px rgba(255,255,255,.05)!important;
  text-shadow:none!important;
}
#card_JS8 .gridlocator-toggle-row{
  margin:14px 0 0!important;
  padding-top:8px!important;
  justify-content:flex-end!important;
  gap:8px!important;
}
#card_JS8 .gridlocatorToggle{
  font-weight:400!important;
  letter-spacing:.07em!important;
}
#card_JS8 button,
#card_JS8 button *,
#card_JS8 .wfToggle,
#card_JS8 .smeterToggle,
#card_JS8 .gridlocatorToggle,
#card_JS8 .audioFftToggle,
#card_JS8 .speakerBtn,
#card_JS8 .audioModeToggle,
#card_JS8 .audioInfoIcon,
#card_JS8 .ft8-session-info,
#card_JS8 .ft8-wf-inline-badge,
#card_JS8 .fpsBadge,
#card_JS8 .wfSpanBadge,
#card_JS8 .ft8WfStatusBadge,
#card_JS8 .ft8DecodeBwBadge,
#card_JS8 .activeSdrBadge,
#card_JS8 .audioPeakBadge,
#card_JS8 .js8-shell-count{
  font-weight:400!important;
}


/* v24.79 JS8 Message Parser Prep UI details */
#card_JS8 .js8-message-top{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:8px;
  margin-bottom:4px;
}
#card_JS8 .js8-message-top b{
  color:#9ffcff;
  font-weight:400!important;
  letter-spacing:.04em;
}
#card_JS8 .js8-message-top span{
  color:#ffd18f;
  font-size:11px;
  font-family:Consolas,monospace;
  white-space:nowrap;
}
#card_JS8 .js8-message-heartbeat,
#card_JS8 .js8-message-cq{
  border-left-color:rgba(66,255,138,.72)!important;
  background:linear-gradient(90deg,rgba(0,52,28,.48),rgba(0,18,22,.62))!important;
}
#card_JS8 .js8-message-directed{
  border-left-color:rgba(255,179,62,.72)!important;
  background:linear-gradient(90deg,rgba(70,32,0,.42),rgba(0,18,22,.62))!important;
}


/* v25.30/v25.31: JS8 Bridge UI status badge/details only. Anzeige, keine automatische Bridge-Aktivierung. */
#card_JS8 .js8-bridge-status-row{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:10px;
  margin:8px 0 12px;
  padding:8px 10px;
  border:1px solid rgba(0,255,255,.26);
  border-radius:10px;
  background:linear-gradient(90deg,rgba(0,40,48,.68),rgba(34,20,0,.42));
  box-shadow:0 0 14px rgba(0,255,255,.12), inset 0 0 12px rgba(255,170,0,.05);
}
#card_JS8 .js8-bridge-status-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:160px;
  padding:5px 10px;
  border-radius:8px;
  border:1px solid rgba(255,190,70,.75);
  color:#ffe7a3;
  background:linear-gradient(180deg,rgba(90,45,0,.95),rgba(34,20,0,.88));
  font-size:11px;
  font-weight:900;
  letter-spacing:.08em;
  text-transform:uppercase;
  text-shadow:0 0 8px rgba(255,180,40,.65);
  box-shadow:0 0 14px rgba(255,170,0,.18);
}
#card_JS8 .js8-bridge-ready .js8-bridge-status-badge{
  border-color:rgba(68,255,160,.84);
  color:#bffff0;
  background:linear-gradient(180deg,rgba(0,82,55,.95),rgba(0,35,34,.88));
  text-shadow:0 0 9px rgba(50,255,180,.75);
  box-shadow:0 0 16px rgba(0,255,170,.18), inset 0 0 9px rgba(0,255,170,.08);
}
#card_JS8 .js8-bridge-status-text{
  color:#c9faff;
  font-size:11px;
  line-height:1.25;
  text-align:right;
  opacity:.95;
}
@media (max-width: 720px){
  #card_JS8 .js8-bridge-status-row{align-items:flex-start;flex-direction:column;}
  #card_JS8 .js8-bridge-status-text{text-align:left;}
}


/* v25.31: JS8 Bridge Status Detail Anzeige. Reine Anzeige, keine automatische Bridge-Aktivierung. */
#card_JS8 .js8-bridge-detail-row{
  display:flex;
  flex-wrap:wrap;
  align-items:center;
  gap:6px;
  margin:-6px 0 12px;
  padding:6px 8px;
  border:1px solid rgba(0,255,255,.16);
  border-radius:9px;
  background:linear-gradient(90deg,rgba(0,20,26,.56),rgba(0,10,16,.68));
  box-shadow:inset 0 0 10px rgba(0,255,255,.04);
}
#card_JS8 .js8-bridge-detail-chip{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-height:20px;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid rgba(120,220,255,.28);
  color:#c8f9ff;
  background:rgba(0,40,50,.54);
  font-size:10px;
  line-height:1.1;
  letter-spacing:.035em;
  white-space:nowrap;
  font-family:Consolas,monospace;
}
#card_JS8 .js8-bridge-detail-ok{
  border-color:rgba(72,255,170,.50);
  color:#c9ffeb;
  background:rgba(0,72,46,.48);
}
#card_JS8 .js8-bridge-detail-check{
  border-color:rgba(255,190,72,.58);
  color:#ffe4a3;
  background:rgba(70,38,0,.46);
}
#card_JS8 .js8-bridge-detail-safe{
  border-color:rgba(255,190,72,.42);
  color:#ffe7b8;
  background:rgba(56,30,0,.38);
}
#card_JS8 .js8-bridge-detail-device{
  flex:1 1 100%;
  justify-content:flex-start;
  border-color:rgba(0,255,255,.22);
  color:#9ffcff;
  background:rgba(0,24,36,.45);
  overflow:hidden;
  text-overflow:ellipsis;
}
@media (max-width: 720px){
  #card_JS8 .js8-bridge-detail-chip{white-space:normal;justify-content:flex-start;}
}


/* v25.32/v25.33 JS8 Bridge Locked Control / Preflight Prep: visible but disabled control placeholder. */
#card_JS8 .js8-bridge-control-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin:6px 0 8px;
  padding:7px 8px;
  border:1px solid rgba(255,149,54,.35);
  border-radius:10px;
  background:linear-gradient(90deg,rgba(68,28,0,.42),rgba(8,23,26,.36));
  box-shadow:inset 0 0 14px rgba(255,130,32,.10),0 0 12px rgba(255,120,28,.08);
  color:#ffd7a3;
  font-size:11px;
}
#card_JS8 .js8-bridge-control-label{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  padding:4px 9px;
  border-radius:999px;
  border:1px solid rgba(255,149,54,.55);
  background:rgba(93,42,0,.62);
  color:#ffe2b8;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-shadow:0 0 8px rgba(255,139,46,.45);
}
#card_JS8 .js8-bridge-control-text{
  flex:1 1 auto;
  min-width:160px;
  color:#f3cfaa;
  opacity:.92;
}
#card_JS8 .js8-bridge-control-button{
  flex:0 0 auto;
  height:26px;
  padding:0 10px;
  border-radius:7px;
  border:1px solid rgba(255,170,77,.35);
  background:rgba(64,38,20,.65);
  color:#d8aa78;
  font-size:10px;
  font-weight:700;
  letter-spacing:.05em;
  text-transform:uppercase;
  cursor:not-allowed;
  opacity:.78;
}
#card_JS8 .js8-bridge-control-ready{
  border-color:rgba(255,149,54,.42);
}
@media(max-width:760px){
  #card_JS8 .js8-bridge-control-row{align-items:flex-start;flex-direction:column;}
  #card_JS8 .js8-bridge-control-button{align-self:flex-start;}
}


/* v25.33 JS8 Bridge Start Preflight Guard: read-only preflight row, start remains locked. */
#card_JS8 .js8-bridge-preflight-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin:-3px 0 10px;
  padding:6px 8px;
  border:1px solid rgba(0,220,255,.26);
  border-radius:9px;
  background:linear-gradient(90deg,rgba(0,36,48,.40),rgba(8,22,28,.34));
  box-shadow:inset 0 0 12px rgba(0,220,255,.06);
  color:#bffaff;
  font-size:11px;
}
#card_JS8 .js8-bridge-preflight-label{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid rgba(0,220,255,.42);
  background:rgba(0,54,68,.55);
  color:#d9ffff;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  text-shadow:0 0 8px rgba(0,220,255,.35);
}
#card_JS8 .js8-bridge-preflight-ready .js8-bridge-preflight-label{
  border-color:rgba(68,255,170,.55);
  background:rgba(0,72,46,.50);
  color:#caffec;
  text-shadow:0 0 8px rgba(60,255,170,.45);
}
#card_JS8 .js8-bridge-preflight-text{
  flex:1 1 auto;
  min-width:160px;
  color:#c9faff;
  opacity:.92;
}
@media(max-width:760px){
  #card_JS8 .js8-bridge-preflight-row{align-items:flex-start;flex-direction:column;}
}

/* v25.36 JS8 Bridge Manual Test Result Panel Bundle: Dry-run, runtime plan, manual Test-Tools test status, warnings and refresh. */
#card_JS8 .js8-bridge-dryrun-row,
#card_JS8 .js8-bridge-plan-row,
#card_JS8 .js8-bridge-manualtest-row,
#card_JS8 .js8-bridge-manualdetail-row,
#card_JS8 .js8-bridge-warning-row{
  display:flex;
  align-items:center;
  gap:8px;
  margin:-3px 0 8px;
  padding:6px 8px;
  border-radius:9px;
  font-size:11px;
}
#card_JS8 .js8-bridge-dryrun-row{
  border:1px solid rgba(80,255,180,.28);
  background:linear-gradient(90deg,rgba(0,50,38,.36),rgba(8,22,28,.34));
  box-shadow:inset 0 0 12px rgba(80,255,180,.06);
  color:#c9ffe9;
}
#card_JS8 .js8-bridge-dryrun-label,
#card_JS8 .js8-bridge-plan-label,
#card_JS8 .js8-bridge-manualtest-label,
#card_JS8 .js8-bridge-manualdetail-label,
#card_JS8 .js8-bridge-warning-label{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
}
#card_JS8 .js8-bridge-dryrun-label{
  border:1px solid rgba(80,255,180,.50);
  background:rgba(0,72,46,.52);
  color:#caffec;
  text-shadow:0 0 8px rgba(60,255,170,.45);
}
#card_JS8 .js8-bridge-dryrun-text,
#card_JS8 .js8-bridge-plan-text,
#card_JS8 .js8-bridge-manualtest-text,
#card_JS8 .js8-bridge-manualdetail-text,
#card_JS8 .js8-bridge-warning-text{
  flex:1 1 auto;
  min-width:120px;
  opacity:.92;
  line-height:1.25;
}
#card_JS8 .js8-bridge-refresh-button{
  flex:0 0 auto;
  height:24px;
  padding:0 9px;
  border-radius:7px;
  border:1px solid rgba(0,220,255,.36);
  background:linear-gradient(180deg,rgba(0,56,74,.68),rgba(0,28,42,.70));
  color:#bffaff;
  font-size:10px;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  cursor:pointer;
}
#card_JS8 .js8-bridge-refresh-button:hover{box-shadow:0 0 10px rgba(0,220,255,.18);}
#card_JS8 .js8-bridge-plan-row{
  border:1px solid rgba(0,220,255,.20);
  background:linear-gradient(90deg,rgba(0,30,44,.34),rgba(9,18,26,.34));
  color:#c9faff;
}
#card_JS8 .js8-bridge-plan-label{
  border:1px solid rgba(0,220,255,.36);
  background:rgba(0,46,60,.48);
  color:#d9ffff;
}
#card_JS8 .js8-bridge-manualtest-row{
  border:1px solid rgba(180,120,255,.28);
  background:linear-gradient(90deg,rgba(38,20,70,.34),rgba(10,18,28,.34));
  color:#eadbff;
}
#card_JS8 .js8-bridge-manualtest-label{
  border:1px solid rgba(190,130,255,.44);
  background:rgba(55,26,92,.56);
  color:#f2e8ff;
  text-shadow:0 0 8px rgba(170,90,255,.32);
}
#card_JS8 .js8-bridge-manualtest-ok .js8-bridge-manualtest-label{
  border-color:rgba(80,255,180,.52);
  background:rgba(0,72,48,.56);
  color:#caffec;
}
#card_JS8 .js8-bridge-manualtest-check .js8-bridge-manualtest-label{
  border-color:rgba(255,190,72,.50);
  background:rgba(84,45,0,.56);
  color:#ffedbf;
}
#card_JS8 .js8-bridge-warning-row{
  border:1px solid rgba(255,190,72,.34);
  background:linear-gradient(90deg,rgba(66,34,0,.38),rgba(10,20,24,.34));
  color:#ffe2ae;
}
#card_JS8 .js8-bridge-warning-label{
  border:1px solid rgba(255,190,72,.50);
  background:rgba(84,45,0,.56);
  color:#ffedbf;
}
@media(max-width:760px){
  #card_JS8 .js8-bridge-dryrun-row,
  #card_JS8 .js8-bridge-plan-row,
  #card_JS8 .js8-bridge-manualtest-row,
  #card_JS8 .js8-bridge-manualdetail-row,
  #card_JS8 .js8-bridge-warning-row{align-items:flex-start;flex-direction:column;}
  #card_JS8 .js8-bridge-refresh-button{align-self:flex-start;}
}

#card_JS8 .js8-bridge-manualdetail-row{
  border:1px solid rgba(80,255,180,.24);
  background:linear-gradient(90deg,rgba(0,46,36,.32),rgba(8,20,26,.34));
  color:#c9ffe9;
  box-shadow:inset 0 0 12px rgba(80,255,180,.05);
}
#card_JS8 .js8-bridge-manualdetail-label{
  border:1px solid rgba(80,255,180,.50);
  background:rgba(0,72,46,.52);
  color:#caffec;
  text-shadow:0 0 8px rgba(60,255,170,.45);
}
#card_JS8 .js8-bridge-manualdetail-check .js8-bridge-manualdetail-label{
  border-color:rgba(255,185,80,.55);
  background:rgba(94,50,0,.50);
  color:#ffe8b8;
}

/* v25.40 JS8 Bridge Result Detail Chips: compact read-only result metrics for mobile and desktop. */
#card_JS8 .js8-bridge-manualdetail-row{
  flex-wrap:wrap;
  align-items:flex-start;
}
#card_JS8 .js8-bridge-manualdetail-text{
  flex:1 1 360px;
}
#card_JS8 .js8-bridge-manualdetail-chips{
  flex:1 1 100%;
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-left:88px;
  margin-top:2px;
}
#card_JS8 .js8-bridge-metric-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:20px;
  padding:2px 7px;
  border-radius:999px;
  border:1px solid rgba(80,255,180,.22);
  background:rgba(0,34,28,.46);
  color:#d8fff0;
  font-size:10px;
  line-height:1.15;
  box-shadow:inset 0 0 8px rgba(80,255,180,.04);
}
#card_JS8 .js8-bridge-metric-chip strong{
  font-size:9px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#88ffd4;
}
#card_JS8 .js8-bridge-metric-ok{
  border-color:rgba(80,255,180,.42);
  background:linear-gradient(180deg,rgba(0,64,44,.52),rgba(0,28,24,.52));
}
#card_JS8 .js8-bridge-metric-check{
  border-color:rgba(255,185,80,.44);
  background:linear-gradient(180deg,rgba(86,46,0,.50),rgba(36,20,0,.50));
  color:#ffe7bd;
}
#card_JS8 .js8-bridge-metric-check strong{color:#ffd58c;}
#card_JS8 .js8-bridge-manualdetail-source{
  flex:1 1 100%;
  margin-left:88px;
  color:#8be8d6;
  opacity:.80;
  font-size:10px;
  line-height:1.2;
}
@media(max-width:760px){
  #card_JS8 .js8-bridge-manualdetail-text,
  #card_JS8 .js8-bridge-manualdetail-chips,
  #card_JS8 .js8-bridge-manualdetail-source{
    flex-basis:100%;
    margin-left:0;
  }
}


/* v25.42 JS8 RX Decode Watch Bandplan Long Watch: longer RX-only observation plus FREQ/PRESET chips, still Test-Tools only. */
#card_JS8 .js8-rxdecode-watch-row{
  display:flex;
  flex-wrap:wrap;
  align-items:flex-start;
  gap:8px;
  margin:-3px 0 8px;
  padding:7px 8px;
  border-radius:9px;
  font-size:11px;
  border:1px solid rgba(0,220,255,.24);
  background:linear-gradient(90deg,rgba(0,34,50,.36),rgba(8,22,28,.34));
  color:#d6fbff;
  box-shadow:inset 0 0 12px rgba(0,220,255,.05);
}
#card_JS8 .js8-rxdecode-watch-label{
  flex:0 0 auto;
  display:inline-flex;
  align-items:center;
  padding:3px 8px;
  border-radius:999px;
  border:1px solid rgba(0,220,255,.42);
  background:rgba(0,48,72,.52);
  color:#d9ffff;
  font-weight:700;
  letter-spacing:.04em;
  text-transform:uppercase;
  white-space:nowrap;
  text-shadow:0 0 8px rgba(0,220,255,.28);
}
#card_JS8 .js8-rxdecode-watch-activity .js8-rxdecode-watch-label{
  border-color:rgba(80,255,180,.58);
  background:rgba(0,76,46,.58);
  color:#caffec;
  text-shadow:0 0 10px rgba(70,255,180,.45);
}
#card_JS8 .js8-rxdecode-watch-ok .js8-rxdecode-watch-label{
  border-color:rgba(80,255,180,.45);
  background:rgba(0,58,44,.52);
  color:#caffec;
}
#card_JS8 .js8-rxdecode-watch-check .js8-rxdecode-watch-label{
  border-color:rgba(255,185,80,.50);
  background:rgba(84,45,0,.56);
  color:#ffedbf;
}
#card_JS8 .js8-rxdecode-watch-text{
  flex:1 1 360px;
  min-width:120px;
  line-height:1.25;
  opacity:.94;
}
#card_JS8 .js8-rxdecode-watch-chips{
  flex:1 1 100%;
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  margin-left:128px;
  margin-top:2px;
}
#card_JS8 .js8-rxdecode-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:20px;
  padding:2px 7px;
  border-radius:999px;
  border:1px solid rgba(0,220,255,.24);
  background:rgba(0,34,44,.48);
  color:#dffcff;
  font-size:10px;
  line-height:1.15;
  box-shadow:inset 0 0 8px rgba(0,220,255,.04);
}
#card_JS8 .js8-rxdecode-chip strong{
  font-size:9px;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#8eeeff;
}
#card_JS8 .js8-rxdecode-chip-ok{
  border-color:rgba(80,255,180,.42);
  background:linear-gradient(180deg,rgba(0,64,44,.52),rgba(0,28,24,.52));
  color:#d8fff0;
}
#card_JS8 .js8-rxdecode-chip-ok strong{color:#88ffd4;}
#card_JS8 .js8-rxdecode-chip-check{
  border-color:rgba(255,185,80,.42);
  background:linear-gradient(180deg,rgba(86,46,0,.48),rgba(36,20,0,.48));
  color:#ffe7bd;
}
#card_JS8 .js8-rxdecode-chip-check strong{color:#ffd58c;}
#card_JS8 .js8-rxdecode-watch-source{
  flex:1 1 100%;
  margin-left:128px;
  color:#8be8d6;
  opacity:.80;
  font-size:10px;
  line-height:1.2;
}
@media(max-width:760px){
  #card_JS8 .js8-rxdecode-watch-row{align-items:flex-start;flex-direction:column;}
  #card_JS8 .js8-rxdecode-watch-text,
  #card_JS8 .js8-rxdecode-watch-chips,
  #card_JS8 .js8-rxdecode-watch-source{
    flex-basis:100%;
    margin-left:0;
  }
}

/* v25.43 JS8 RX Decode Watch: LEVEL chip uses existing rxdecode-chip styles; no extra CSS required. */

/* v25.45: JS8 Operator UI Cleanup + collapsed diagnostics */
#card_JS8 .js8-message-shell[data-js8-shell="operator-clean"]{
  gap:9px;
}
#card_JS8 .js8-operator-status-row{
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  padding:10px 12px;
  border:1px solid rgba(41,255,178,.34);
  background:linear-gradient(180deg,rgba(3,58,43,.46),rgba(0,24,28,.82));
  box-shadow:0 0 18px rgba(0,255,188,.10), inset 0 0 24px rgba(0,255,188,.045);
  border-radius:10px;
  margin:8px 0 4px;
}
#card_JS8 .js8-operator-status-badge{
  display:inline-flex;
  align-items:center;
  min-height:24px;
  padding:4px 12px;
  border-radius:999px;
  border:1px solid rgba(77,255,187,.68);
  background:linear-gradient(180deg,rgba(0,92,59,.92),rgba(0,45,45,.96));
  color:#c7ffe7;
  font-weight:800;
  font-size:11px;
  letter-spacing:.07em;
  text-transform:uppercase;
  white-space:nowrap;
  text-shadow:0 0 8px rgba(100,255,200,.55);
  box-shadow:0 0 14px rgba(0,255,180,.22);
}
#card_JS8 .js8-operator-status-text{
  flex:1 1 260px;
  color:#dfffee;
  font-size:11.2px;
  line-height:1.35;
  min-width:0;
}
#card_JS8 .js8-operator-status-chips{
  display:flex;
  flex-wrap:wrap;
  gap:5px;
  justify-content:flex-end;
  flex:1 1 320px;
}
#card_JS8 .js8-operator-chip{
  display:inline-flex;
  align-items:center;
  gap:5px;
  min-height:21px;
  padding:3px 7px;
  border-radius:999px;
  border:1px solid rgba(71,226,180,.30);
  background:rgba(0,29,31,.76);
  color:#c8fff0;
  font-size:9.3px;
  line-height:1;
  white-space:nowrap;
}
#card_JS8 .js8-operator-chip strong{
  color:#82ffd0;
  font-size:8.4px;
  letter-spacing:.05em;
}
#card_JS8 .js8-operator-chip-check{
  border-color:rgba(255,188,86,.42);
  color:#ffe2aa;
}
#card_JS8 .js8-operator-chip-check strong{color:#ffd58c;}
#card_JS8 .js8-operator-activity .js8-operator-status-badge{
  border-color:rgba(255,198,70,.78);
  background:linear-gradient(180deg,rgba(139,83,0,.92),rgba(54,30,0,.96));
  color:#fff0bd;
  box-shadow:0 0 16px rgba(255,184,58,.24);
}
#card_JS8 .js8-operator-check .js8-operator-status-badge{
  border-color:rgba(255,163,70,.68);
  background:linear-gradient(180deg,rgba(121,63,0,.82),rgba(42,22,0,.94));
  color:#ffe1af;
}
#card_JS8 .js8-diagnostics-details{
  margin:6px 0 9px;
  border:1px solid rgba(57,153,170,.24);
  border-radius:10px;
  background:linear-gradient(180deg,rgba(0,23,31,.50),rgba(0,13,18,.74));
  overflow:hidden;
}
#card_JS8 .js8-diagnostics-details > summary{
  cursor:pointer;
  user-select:none;
  display:flex;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
  min-height:28px;
  padding:7px 10px;
  color:#b9f6ff;
  list-style:none;
}
#card_JS8 .js8-diagnostics-details > summary::-webkit-details-marker{display:none;}
#card_JS8 .js8-diagnostics-details > summary:before{
  content:'▸';
  color:#4ee6ff;
  transition:transform .15s ease;
}
#card_JS8 .js8-diagnostics-details[open] > summary:before{transform:rotate(90deg);}
#card_JS8 .js8-diagnostics-summary-title{
  font-size:10.5px;
  font-weight:800;
  letter-spacing:.08em;
  text-transform:uppercase;
}
#card_JS8 .js8-diagnostics-summary-text{
  flex:1 1 260px;
  color:#8fc8d4;
  font-size:10px;
}
#card_JS8 .js8-diagnostics-log-link{
  color:#9effff;
  text-decoration:none;
  border:1px solid rgba(66,214,255,.34);
  background:rgba(0,55,76,.48);
  border-radius:6px;
  padding:3px 7px;
  font-size:9.6px;
  font-weight:700;
}
#card_JS8 .js8-diagnostics-log-link:hover{box-shadow:0 0 10px rgba(0,220,255,.18);}
#card_JS8 .js8-diagnostics-body{
  display:grid;
  gap:6px;
  padding:0 8px 8px;
}
@media(max-width:760px){
  #card_JS8 .js8-operator-status-row{align-items:flex-start;flex-direction:column;}
  #card_JS8 .js8-operator-status-chips{justify-content:flex-start;}
  #card_JS8 .js8-diagnostics-details > summary{align-items:flex-start;flex-direction:column;}
}


/* v25.46 UI Cleanup Bundle: applies safely to FT8, FT4 and JS8. */
#card_FT8 .ft8-wf-top-select-row,
#card_FT4 .ft8-wf-top-select-row,
#card_JS8 .ft8-wf-top-select-row{
  display:flex!important;justify-content:flex-end!important;align-items:center!important;gap:14px!important;flex-wrap:wrap!important;margin:18px 0 8px!important;width:100%!important;
}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select,
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select,
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select{display:inline-flex!important;align-items:center!important;gap:8px!important;flex:0 0 auto!important;max-width:100%;}
#card_FT8 .ft8-wf-top-select-row .ft8-inline-select .small,
#card_FT4 .ft8-wf-top-select-row .ft8-inline-select .small,
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select .small{margin-right:4px!important;}
#card_FT8 .ft8-wf-top-select-row select,
#card_FT4 .ft8-wf-top-select-row select,
#card_JS8 .ft8-wf-top-select-row select{min-width:132px;max-width:260px;height:30px;}
#card_FT8 .webftr-waterfall-controls.ft8-wf-control-row,
#card_FT4 .webftr-waterfall-controls.ft8-wf-control-row,
#card_JS8 .webftr-waterfall-controls.ft8-wf-control-row{justify-content:flex-start!important;gap:7px!important;}
#card_FT8 .webftr-waterfall-controls .wfToggle,
#card_FT4 .webftr-waterfall-controls .wfToggle,
#card_JS8 .webftr-waterfall-controls .wfToggle{margin-left:auto!important;order:99!important;}
#card_FT8 .webftr-waterfall-controls .rxFreqBadge,
#card_FT8 .webftr-waterfall-controls .fpsBadge,
#card_FT8 .webftr-waterfall-controls .webftrTuneLockBadge,
#card_FT8 .webftr-waterfall-controls .wfSpanBadge,
#card_FT8 .webftr-waterfall-controls .decodeBwBadge,
#card_FT4 .webftr-waterfall-controls .rxFreqBadge,
#card_FT4 .webftr-waterfall-controls .fpsBadge,
#card_FT4 .webftr-waterfall-controls .webftrTuneLockBadge,
#card_FT4 .webftr-waterfall-controls .wfSpanBadge,
#card_FT4 .webftr-waterfall-controls .decodeBwBadge,
#card_JS8 .webftr-waterfall-controls .rxFreqBadge,
#card_JS8 .webftr-waterfall-controls .fpsBadge,
#card_JS8 .webftr-waterfall-controls .webftrTuneLockBadge,
#card_JS8 .webftr-waterfall-controls .wfSpanBadge,
#card_JS8 .webftr-waterfall-controls .decodeBwBadge{
  display:inline-flex;align-items:center;justify-content:center;height:28px;min-height:28px;padding:0 9px!important;border:1px solid rgba(66,255,138,.76)!important;color:#caffd9!important;background:linear-gradient(180deg,rgba(5,70,28,.58),rgba(0,30,24,.86))!important;box-shadow:0 0 16px rgba(66,255,138,.22), inset 0 0 14px rgba(66,255,138,.10)!important;text-shadow:0 0 8px rgba(66,255,138,.42)!important;text-transform:uppercase;font-size:10px!important;white-space:nowrap;
}
#card_FT8 .webftr-waterfall-controls b,#card_FT4 .webftr-waterfall-controls b,#card_JS8 .webftr-waterfall-controls b{color:#39ff7a!important;text-shadow:0 0 12px rgba(57,255,122,.58)!important;margin-right:3px;}
#card_FT8 .ft8-section-separator-gridmap,
#card_FT4 .ft8-section-separator-gridmap,
#card_JS8 .ft8-section-separator-gridmap{margin:16px 0 12px!important;}
#card_FT8 .ft8-section-separator-gridmap span,
#card_FT4 .ft8-section-separator-gridmap span,
#card_JS8 .ft8-section-separator-gridmap span{width:96px!important;background:linear-gradient(90deg,transparent,#39ff7a,rgba(0,232,255,.48),transparent)!important;box-shadow:0 0 18px rgba(57,255,122,.38)!important;}
#card_FT8 .ft8-prefix-input,#card_FT8 .ft8-country-input,#card_FT8 .ft8-call-input,
#card_FT4 .ft8-prefix-input,#card_FT4 .ft8-country-input,#card_FT4 .ft8-call-input{width:92px!important;max-width:92px!important;min-width:72px!important;}
#card_FT8 .ft8-call-input,#card_FT4 .ft8-call-input{width:112px!important;max-width:112px!important;}
#card_JS8 .ft8-utc-sync-widget,
#card_FT8 .ft8-utc-sync-widget,
#card_FT4 .ft8-utc-sync-widget{display:inline-flex!important;align-items:center!important;justify-content:center!important;min-height:28px!important;padding:0 10px!important;border:1px solid rgba(66,255,138,.68)!important;color:#d6ffe4!important;background:linear-gradient(180deg,rgba(0,58,28,.72),rgba(0,18,12,.94))!important;box-shadow:0 0 15px rgba(66,255,138,.18),inset 0 0 10px rgba(66,255,138,.07)!important;text-shadow:0 0 9px rgba(66,255,138,.34)!important;text-transform:uppercase;letter-spacing:.045em;font-family:Consolas,monospace!important;font-size:10.5px!important;}
#card_FT8 .smeter-center-head-row,#card_FT4 .smeter-center-head-row,#card_JS8 .smeter-center-head-row{gap:6px!important;}
#card_FT8 .smeter-center-head,#card_FT8 .smeter-center-mode,#card_FT8 .smeter-center-module,
#card_FT4 .smeter-center-head,#card_FT4 .smeter-center-mode,#card_FT4 .smeter-center-module,
#card_JS8 .smeter-center-head,#card_JS8 .smeter-center-mode,#card_JS8 .smeter-center-module{flex:0 1 auto!important;min-width:58px!important;max-width:92px!important;padding:4px 7px!important;font-size:9.6px!important;}
#card_FT8 .smeter-center-head,#card_FT4 .smeter-center-head,#card_JS8 .smeter-center-head{min-width:72px!important;}

/* v25.48 Follow-up Polish: S-Meter preset inside center display, compact decode count, stable control heights. */
#card_FT8 .smeter-center-readout,
#card_FT4 .smeter-center-readout,
#card_JS8 .smeter-center-readout{gap:7px!important;}
#card_FT8 .smeter-preset-inline-row,
#card_FT4 .smeter-preset-inline-row,
#card_JS8 .smeter-preset-inline-row{display:grid!important;grid-template-columns:minmax(62px,.28fr) minmax(150px,.72fr)!important;align-items:center!important;gap:7px!important;width:100%!important;max-width:260px!important;margin:2px 0 0!important;}
#card_FT8 .smeter-preset-badge,
#card_FT4 .smeter-preset-badge,
#card_JS8 .smeter-preset-badge{height:24px!important;min-width:0!important;padding:0 7px!important;font-size:9px!important;letter-spacing:.055em!important;}
#card_FT8 .smeter-preset-select,
#card_FT4 .smeter-preset-select,
#card_JS8 .smeter-preset-select{height:24px!important;min-height:24px!important;min-width:0!important;width:100%!important;max-width:none!important;padding:0 8px!important;font-size:9.2px!important;}
#card_FT8 .ft8-box-head .ft8-filter-status.ft8-decode-count,
#card_FT4 .ft8-box-head .ft8-filter-status.ft8-decode-count{height:26px!important;min-height:26px!important;line-height:24px!important;padding:0 9px!important;align-self:center!important;font-size:9.8px!important;}
#card_FT8 .ft8-prefix-input,#card_FT8 .ft8-country-input,#card_FT8 .ft8-call-input,
#card_FT4 .ft8-prefix-input,#card_FT4 .ft8-country-input,#card_FT4 .ft8-call-input{height:26px!important;min-height:26px!important;}
#card_FT8 .audiofft-toggle-row .audioModeToggle,
#card_FT4 .audiofft-toggle-row .audioModeToggle,
#card_JS8 .audiofft-toggle-row .audioModeToggle,
#card_FT8 .audiofft-toggle-row .audioInfoIcon,
#card_FT4 .audiofft-toggle-row .audioInfoIcon,
#card_JS8 .audiofft-toggle-row .audioInfoIcon,
#card_FT8 .audiofft-toggle-row .audioFftToggle,
#card_FT4 .audiofft-toggle-row .audioFftToggle,
#card_JS8 .audiofft-toggle-row .audioFftToggle,
#card_FT8 .audiofft-toggle-row .speakerBtn,
#card_FT4 .audiofft-toggle-row .speakerBtn,
#card_JS8 .audiofft-toggle-row .speakerBtn{height:30px!important;min-height:30px!important;line-height:28px!important;border-radius:0!important;padding-top:0!important;padding-bottom:0!important;align-items:center!important;justify-content:center!important;}
#card_FT8 .audiofft-toggle-row .speakerBtn,
#card_FT4 .audiofft-toggle-row .speakerBtn,
#card_JS8 .audiofft-toggle-row .speakerBtn{width:36px!important;min-width:36px!important;}
#card_FT8 .audiofft-toggle-row .audioModeToggle,
#card_FT4 .audiofft-toggle-row .audioModeToggle,
#card_JS8 .audiofft-toggle-row .audioModeToggle{min-width:116px!important;font-size:9.8px!important;}
#card_FT8 .audiofft-toggle-row .audioFftToggle,
#card_FT4 .audiofft-toggle-row .audioFftToggle,
#card_JS8 .audiofft-toggle-row .audioFftToggle{min-width:98px!important;font-size:9.8px!important;}

/* v25.50: S-Meter Quiet Sidebars Layout Polish.
   Keep the plugin S-Meter stable after v25.49: calm the two outer digital side meters
   and let the center badges/preset select use the same content width as the 7-segment display. */
#card_FT8 .smeter-center-readout,
#card_FT4 .smeter-center-readout,
#card_JS8 .smeter-center-readout{
  align-items:stretch!important;
}
#card_FT8 .smeter-center-head-row,
#card_FT4 .smeter-center-head-row,
#card_JS8 .smeter-center-head-row{
  display:grid!important;
  grid-template-columns:repeat(3,minmax(0,1fr))!important;
  width:100%!important;
  max-width:none!important;
  align-self:stretch!important;
  gap:6px!important;
}
#card_FT8 .smeter-center-head,
#card_FT8 .smeter-center-mode,
#card_FT8 .smeter-center-module,
#card_FT4 .smeter-center-head,
#card_FT4 .smeter-center-mode,
#card_FT4 .smeter-center-module,
#card_JS8 .smeter-center-head,
#card_JS8 .smeter-center-mode,
#card_JS8 .smeter-center-module{
  width:100%!important;
  min-width:0!important;
  max-width:none!important;
  height:24px!important;
  min-height:24px!important;
  justify-content:center!important;
  padding:0 6px!important;
  overflow:hidden!important;
  text-overflow:ellipsis!important;
  white-space:nowrap!important;
}
#card_FT8 .smeter-sevenseg,
#card_FT4 .smeter-sevenseg,
#card_JS8 .smeter-sevenseg{
  width:100%!important;
  max-width:none!important;
  align-self:stretch!important;
}
#card_FT8 .smeter-sevenseg-svg,
#card_FT4 .smeter-sevenseg-svg,
#card_JS8 .smeter-sevenseg-svg{
  max-width:100%!important;
}
#card_FT8 .smeter-preset-inline-row,
#card_FT4 .smeter-preset-inline-row,
#card_JS8 .smeter-preset-inline-row{
  display:block!important;
  width:100%!important;
  max-width:none!important;
  align-self:stretch!important;
  margin:2px 0 0!important;
}
#card_FT8 .smeter-preset-badge,
#card_FT4 .smeter-preset-badge,
#card_JS8 .smeter-preset-badge{
  display:none!important;
}
#card_FT8 .smeter-preset-select,
#card_FT4 .smeter-preset-select,
#card_JS8 .smeter-preset-select{
  width:100%!important;
  max-width:none!important;
  min-width:0!important;
  height:26px!important;
  min-height:26px!important;
  font-size:10px!important;
  text-align:center!important;
  text-align-last:center!important;
}
#card_FT8 .smeter-step-row,
#card_FT4 .smeter-step-row,
#card_JS8 .smeter-step-row,
#card_FT8 .smeter-step-led,
#card_FT4 .smeter-step-led,
#card_JS8 .smeter-step-led{
  transition:opacity .42s ease, filter .42s ease, background .42s ease, border-color .42s ease, box-shadow .42s ease!important;
}
#card_FT8 .smeter-label .smeter-step-meter,
#card_FT8 .smeter-readout .smeter-step-meter,
#card_FT4 .smeter-label .smeter-step-meter,
#card_FT4 .smeter-readout .smeter-step-meter,
#card_JS8 .smeter-label .smeter-step-meter,
#card_JS8 .smeter-readout .smeter-step-meter{
  filter:saturate(.96)!important;
}


/* v25.51: JS8 Waterfall Control Style Parity
   Make the JS8 PRESET / GAIN / WF FFT row above the waterfall visually match
   the proven FT8/FT4 compact operator controls.  This is CSS-only and does
   not touch tuning, decoding, SDR, JS8Call, audio or safety logic. */
#card_JS8 .ft8-wf-top-select-row{
  display:flex!important;
  justify-content:flex-end!important;
  align-items:center!important;
  gap:14px!important;
  flex-wrap:wrap!important;
  margin:20px 0 7px!important;
  padding:0!important;
  width:100%!important;
}
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:flex-start!important;
  gap:8px!important;
  height:30px!important;
  min-height:30px!important;
  margin:0!important;
  flex:0 0 auto!important;
  width:auto!important;
  max-width:100%!important;
}
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select .small,
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select b.small{
  display:inline-flex!important;
  align-items:center!important;
  justify-content:center!important;
  box-sizing:border-box!important;
  height:30px!important;
  min-height:30px!important;
  padding:0 8px!important;
  margin:0 4px 0 0!important;
  border:1px solid rgba(255,179,62,.72)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,rgba(92,48,6,.78),rgba(34,18,4,.92))!important;
  color:#ffe4b9!important;
  box-shadow:0 0 14px rgba(255,179,62,.16), inset 0 0 12px rgba(255,179,62,.08)!important;
  text-shadow:0 0 9px rgba(255,179,62,.34)!important;
  font-size:10px!important;
  font-weight:400!important;
  line-height:1!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  white-space:nowrap!important;
}
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select select,
#card_JS8 .ft8-wf-top-select-row .wf-resolution-select{
  display:inline-flex!important;
  align-items:center!important;
  height:30px!important;
  min-height:30px!important;
  min-width:132px!important;
  max-width:255px!important;
  width:auto!important;
  padding:4px 26px 4px 8px!important;
  border:1px solid rgba(255,179,62,.66)!important;
  border-radius:0!important;
  background:linear-gradient(180deg,rgba(54,28,4,.96),rgba(20,10,3,.98))!important;
  color:#fff1d6!important;
  box-shadow:0 0 12px rgba(255,179,62,.13), inset 0 0 10px rgba(255,179,62,.07)!important;
  font-size:11px!important;
  font-weight:400!important;
  letter-spacing:.02em!important;
  outline:none!important;
}
#card_JS8 .ft8-wf-top-select-row .ft8-inline-select select:focus,
#card_JS8 .ft8-wf-top-select-row .wf-resolution-select:focus{
  border-color:rgba(255,209,143,.96)!important;
  box-shadow:0 0 16px rgba(255,179,62,.26), inset 0 0 12px rgba(255,179,62,.10)!important;
}
#card_JS8 .ft8-wf-top-select-row .ft8-gain-select .small,
#card_JS8 .ft8-wf-top-select-row .ft8-gain-select b.small{
  border-color:rgba(66,214,138,.72)!important;
  background:linear-gradient(180deg,rgba(0,52,28,.78),rgba(0,20,12,.92))!important;
  color:#caffdd!important;
  box-shadow:0 0 14px rgba(66,214,138,.16), inset 0 0 12px rgba(66,214,138,.08)!important;
  text-shadow:0 0 9px rgba(66,214,138,.34)!important;
}
#card_JS8 .ft8-wf-top-select-row .ft8-gain-select select{
  border-color:rgba(66,214,138,.66)!important;
  background:linear-gradient(180deg,rgba(0,39,22,.96),rgba(0,12,8,.98))!important;
  color:#dfffe9!important;
  box-shadow:0 0 12px rgba(66,214,138,.13), inset 0 0 10px rgba(66,214,138,.07)!important;
}
@media(max-width:720px){
  #card_JS8 .ft8-wf-top-select-row{
    justify-content:flex-start!important;
    gap:8px!important;
  }
  #card_JS8 .ft8-wf-top-select-row .ft8-inline-select,
  #card_JS8 .ft8-wf-top-select-row .ft8-inline-select select{
    flex:1 1 auto!important;
    max-width:none!important;
  }
}

/* v25.52: Audio-FFT final green info button and compact monitor widgets.
   These scoped overrides beat older JS8 orange info-button rules. */
#card_FT8 .webftr-plugin-audiofft .audioInfoIcon,
#card_FT4 .webftr-plugin-audiofft .audioInfoIcon,
#card_JS8 .webftr-plugin-audiofft .audioInfoIcon{
  border-color:rgba(66,255,138,.78)!important;
  color:#d6ffe4!important;
  background:linear-gradient(180deg,rgba(0,96,42,.96),rgba(0,39,18,.98))!important;
  box-shadow:0 0 14px rgba(66,255,138,.22), inset 0 0 10px rgba(255,255,255,.04)!important;
}
#card_FT8 .webftr-plugin-audiofft .audioInfoIcon:hover,
#card_FT4 .webftr-plugin-audiofft .audioInfoIcon:hover,
#card_JS8 .webftr-plugin-audiofft .audioInfoIcon:hover,
#card_FT8 .webftr-plugin-audiofft .audioInfoIcon:focus,
#card_FT4 .webftr-plugin-audiofft .audioInfoIcon:focus,
#card_JS8 .webftr-plugin-audiofft .audioInfoIcon:focus{
  border-color:rgba(96,255,164,.96)!important;
  color:#ffffff!important;
  background:linear-gradient(180deg,rgba(0,124,52,.98),rgba(0,52,24,.99))!important;
  box-shadow:0 0 18px rgba(66,255,138,.32), inset 0 0 12px rgba(255,255,255,.06)!important;
  outline:0!important;
}


/* v25.65: FT8/FT4 decoder search placeholders remain normal case, not forced uppercase by surrounding WebFTR UI styles. */
#card_FT8 .ft8-prefix-input,#card_FT8 .ft8-country-input,#card_FT8 .ft8-call-input,
#card_FT4 .ft8-prefix-input,#card_FT4 .ft8-country-input,#card_FT4 .ft8-call-input{
  text-transform:none!important;
}
#card_FT8 .ft8-prefix-input::placeholder,#card_FT8 .ft8-country-input::placeholder,#card_FT8 .ft8-call-input::placeholder,
#card_FT4 .ft8-prefix-input::placeholder,#card_FT4 .ft8-country-input::placeholder,#card_FT4 .ft8-call-input::placeholder{
  text-transform:none!important;
  letter-spacing:.025em!important;
}
/* v25.65: keep the RX decode rail polished even after module CSS loads after index.html. */
#card_FT8 .ft8-decode-progress,#card_FT4 .ft8-decode-progress{
  min-width:164px!important;height:18px!important;border-color:rgba(57,255,122,.48)!important;
  box-shadow:0 0 14px rgba(57,255,122,.20),0 0 22px rgba(0,232,255,.08),inset 0 0 12px rgba(0,0,0,.68),inset 0 0 0 1px rgba(255,255,255,.03)!important;
}
#card_FT8 .ft8-decode-left,#card_FT4 .ft8-decode-left{
  font-size:9.2px!important;letter-spacing:.04em!important;
}


/* v25.66: Mobile Layout Repair Bundle - FT8/FT4 footer + JS8 Diagnose/Decoderliste stabil auf Tablet/Handy. */
html,body{max-width:100%;overflow-x:hidden;}
.footer{max-width:100%;min-width:0;box-sizing:border-box;}
.footer *{max-width:100%;box-sizing:border-box;}
#card_FT8,#card_FT4,#card_JS8{max-width:100%;min-width:0;overflow:hidden;}
#card_FT8 *,#card_FT4 *,#card_JS8 *{box-sizing:border-box;}
#card_FT8 .ft8-box,#card_FT4 .ft8-box,#card_JS8 .ft8-box,
#card_FT8 .ft8-grid,#card_FT4 .ft8-grid,#card_JS8 .ft8-grid,
#card_FT8 .ft8-table-wrap,#card_FT4 .ft8-table-wrap,#card_JS8 .ft8-table-wrap,
#card_FT8 .js8-message-shell,#card_FT4 .js8-message-shell,#card_JS8 .js8-message-shell,
#card_FT8 .webftr-gridlocator-host,#card_FT4 .webftr-gridlocator-host,#card_JS8 .webftr-gridlocator-host{
  min-width:0!important;max-width:100%!important;overflow:hidden;
}
#card_FT8 .ft8-table-wrap,#card_FT4 .ft8-table-wrap{overflow-x:auto!important;-webkit-overflow-scrolling:touch;}
#card_FT8 .ft8-wf-top-select-row,#card_FT4 .ft8-wf-top-select-row,#card_JS8 .ft8-wf-top-select-row{
  min-width:0!important;max-width:100%!important;
}
#card_FT8 .ft8-wf-inline-badge,#card_FT4 .ft8-wf-inline-badge,#card_JS8 .ft8-wf-inline-badge,
#card_FT8 .wfSpanBadge,#card_FT4 .wfSpanBadge,#card_JS8 .wfSpanBadge,
#card_FT8 .ft8WfStatusBadge,#card_FT4 .ft8WfStatusBadge,#card_JS8 .ft8WfStatusBadge,
#card_FT8 .rxFreqBadge,#card_FT4 .rxFreqBadge,#card_JS8 .rxFreqBadge,
#card_FT8 .fpsBadge,#card_FT4 .fpsBadge,#card_JS8 .fpsBadge{
  min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;text-align:center;
}
#card_JS8 .js8-shell-head,
#card_JS8 .js8-operator-status-row,
#card_JS8 .js8-bridge-status-row,
#card_JS8 .js8-bridge-detail-row,
#card_JS8 .js8-bridge-control-row,
#card_JS8 .js8-bridge-preflight-row,
#card_JS8 .js8-bridge-dryrun-row,
#card_JS8 .js8-bridge-plan-row,
#card_JS8 .js8-bridge-manualtest-row,
#card_JS8 .js8-bridge-manualdetail-row,
#card_JS8 .js8-rxdecode-watch-row,
#card_JS8 .js8-bridge-warning-row{
  min-width:0!important;max-width:100%!important;
}
#card_JS8 .js8-operator-status-chips,
#card_JS8 .js8-bridge-detail-row,
#card_JS8 .js8-bridge-manualdetail-chips,
#card_JS8 .js8-rxdecode-watch-chips{
  flex-wrap:wrap!important;min-width:0!important;max-width:100%!important;
}
#card_JS8 .js8-operator-status-text,
#card_JS8 .js8-bridge-status-text,
#card_JS8 .js8-bridge-control-text,
#card_JS8 .js8-bridge-preflight-text,
#card_JS8 .js8-bridge-dryrun-text,
#card_JS8 .js8-bridge-plan-text,
#card_JS8 .js8-bridge-manualtest-text,
#card_JS8 .js8-bridge-manualdetail-text,
#card_JS8 .js8-rxdecode-watch-text,
#card_JS8 .js8-bridge-warning-text,
#card_JS8 .js8-bridge-manualdetail-source,
#card_JS8 .js8-rxdecode-watch-source,
#card_JS8 .js8-diagnostics-summary-text{
  min-width:0!important;max-width:100%!important;white-space:normal!important;overflow-wrap:anywhere!important;
}
#card_JS8 .js8-shell-grid{min-width:0!important;max-width:100%!important;}
#card_JS8 .js8-panel{min-width:0!important;max-width:100%!important;overflow:hidden;}
#card_JS8 .js8-panel .js8-empty,
#card_JS8 .js8-message-item,
#card_JS8 .js8-message-item p{
  white-space:normal!important;overflow-wrap:anywhere!important;word-break:break-word;
}
@media(max-width:760px){
  .wrap{padding-left:8px!important;padding-right:8px!important;}
  .footer{
    display:grid!important;
    grid-template-columns:1fr 1fr!important;
    justify-items:stretch!important;
    align-items:center!important;
    gap:6px!important;
    margin:16px 0 6px!important;
    padding:10px 8px!important;
    text-align:center!important;
    overflow:hidden!important;
  }
  .footer-brand,.footer-dev,.footer-link{grid-column:1/-1!important;width:100%!important;justify-content:center!important;}
  .footer-version,.footer-year{width:100%!important;min-width:0!important;}
  .footer-sep{display:none!important;}
  .footer-dev{font-size:10px!important;line-height:1.15!important;white-space:normal!important;overflow-wrap:anywhere!important;}
  .footer-link{font-size:10px!important;line-height:1.15!important;white-space:normal!important;overflow-wrap:anywhere!important;padding:6px 7px!important;}
  #card_FT8,#card_FT4,#card_JS8{padding:9px!important;margin-left:0!important;margin-right:0!important;}
  #card_FT8 h3,#card_FT4 h3,#card_JS8 h3{font-size:18px!important;line-height:1.1!important;overflow-wrap:anywhere!important;}
  #card_FT8 .close-btn,#card_FT4 .close-btn,#card_JS8 .close-btn{width:100%!important;max-width:100%!important;}
  #card_FT8 .smeter-center-head-row,#card_FT4 .smeter-center-head-row,#card_JS8 .smeter-center-head-row{grid-template-columns:1fr!important;gap:5px!important;}
  #card_FT8 .ft8-wf-top-select-row,#card_FT4 .ft8-wf-top-select-row,#card_JS8 .ft8-wf-top-select-row{
    display:grid!important;grid-template-columns:1fr!important;gap:7px!important;align-items:stretch!important;justify-content:stretch!important;
  }
  #card_FT8 .ft8-inline-select,#card_FT4 .ft8-inline-select,#card_JS8 .ft8-inline-select,
  #card_FT8 .ft8-inline-select select,#card_FT4 .ft8-inline-select select,#card_JS8 .ft8-inline-select select{
    width:100%!important;min-width:0!important;max-width:100%!important;
  }
  #card_FT8 .webftr-waterfall-host,#card_FT4 .webftr-waterfall-host,#card_JS8 .webftr-waterfall-host,
  #card_FT8 .webftr-waterfall-plugin-host,#card_FT4 .webftr-waterfall-plugin-host,#card_JS8 .webftr-waterfall-plugin-host{
    width:100%!important;min-width:0!important;max-width:100%!important;overflow:hidden!important;
  }
  #card_FT8 .webftr-waterfall-canvas,#card_FT4 .webftr-waterfall-canvas,#card_JS8 .webftr-waterfall-canvas,
  #card_FT8 canvas,#card_FT4 canvas,#card_JS8 canvas{max-width:100%!important;}
  #card_FT8 .ft8-wf-control-row,#card_FT4 .ft8-wf-control-row,#card_JS8 .ft8-wf-control-row,
  #card_FT8 .ft8-waterfall-toggle-row,#card_FT4 .ft8-waterfall-toggle-row,#card_JS8 .ft8-waterfall-toggle-row{
    display:grid!important;grid-template-columns:1fr!important;gap:6px!important;align-items:stretch!important;text-align:center!important;
  }
  #card_FT8 .ft8-wf-control-row > *,#card_FT4 .ft8-wf-control-row > *,#card_JS8 .ft8-wf-control-row > *,
  #card_FT8 .ft8-waterfall-toggle-row > *,#card_FT4 .ft8-waterfall-toggle-row > *,#card_JS8 .ft8-waterfall-toggle-row > *{
    width:100%!important;justify-content:center!important;
  }
  #card_FT8 .ft8-controls,#card_FT4 .ft8-controls,#card_JS8 .ft8-controls{
    display:grid!important;grid-template-columns:1fr!important;gap:7px!important;align-items:stretch!important;
  }
  #card_FT8 .ft8-controls > *,#card_FT4 .ft8-controls > *,#card_JS8 .ft8-controls > *{
    width:100%!important;min-width:0!important;justify-content:flex-start!important;white-space:normal!important;overflow-wrap:anywhere!important;
  }
  #card_FT8 .ft8-controls .ft8-clock,#card_FT4 .ft8-controls .ft8-clock{display:flex!important;align-items:center!important;gap:6px!important;}
  #card_FT8 .ft8-decode-progress,#card_FT4 .ft8-decode-progress{flex:1 1 auto!important;min-width:112px!important;max-width:100%!important;}
  #card_FT8 .ft8-clock-times,#card_FT4 .ft8-clock-times{display:none!important;}
  #card_FT8 .ft8-box,#card_FT4 .ft8-box,#card_JS8 .ft8-box{padding:7px!important;}
  #card_FT8 .ft8-box-head,#card_FT4 .ft8-box-head,#card_JS8 .ft8-box-head{
    display:grid!important;grid-template-columns:1fr!important;gap:6px!important;align-items:stretch!important;
  }
  #card_FT8 .ft8-box-head > *,#card_FT4 .ft8-box-head > *,#card_JS8 .ft8-box-head > *{
    margin-left:0!important;width:100%!important;max-width:100%!important;min-width:0!important;justify-content:center!important;
  }
  #card_FT8 .ft8-filterbar,#card_FT8 .ft8-countrybar,#card_FT8 .ft8-callbar,
  #card_FT4 .ft8-filterbar,#card_FT4 .ft8-countrybar,#card_FT4 .ft8-callbar,
  #card_JS8 .ft8-filterbar,#card_JS8 .ft8-countrybar,#card_JS8 .ft8-callbar{
    display:grid!important;grid-template-columns:minmax(0,1fr) 32px!important;gap:5px!important;align-items:center!important;
  }
  #card_FT8 .ft8-filterbar input,#card_FT8 .ft8-countrybar input,#card_FT8 .ft8-callbar input,
  #card_FT4 .ft8-filterbar input,#card_FT4 .ft8-countrybar input,#card_FT4 .ft8-callbar input,
  #card_JS8 .ft8-filterbar input,#card_JS8 .ft8-countrybar input,#card_JS8 .ft8-callbar input{
    width:100%!important;min-width:0!important;max-width:100%!important;
  }
  #card_FT8 .ft8-exportbar,#card_FT4 .ft8-exportbar,#card_JS8 .ft8-exportbar{
    display:grid!important;grid-template-columns:1fr 1fr 34px!important;gap:5px!important;
  }
  #card_FT8 .ft8-exportbar button,#card_FT4 .ft8-exportbar button,#card_JS8 .ft8-exportbar button{width:100%!important;min-width:0!important;padding-left:5px!important;padding-right:5px!important;}
  #card_FT8 .ft8-utc-sync-widget,#card_FT4 .ft8-utc-sync-widget,#card_JS8 .ft8-utc-sync-widget,
  #card_FT8 .ft8-filter-status,#card_FT4 .ft8-filter-status,#card_JS8 .ft8-filter-status{
    width:100%!important;min-width:0!important;white-space:normal!important;overflow-wrap:anywhere!important;text-align:center!important;
  }
  #card_JS8 .js8-message-shell{padding:8px!important;}
  #card_JS8 .js8-shell-head{display:grid!important;grid-template-columns:1fr!important;gap:5px!important;text-align:left!important;}
  #card_JS8 .js8-shell-count{margin-left:0!important;width:100%!important;justify-content:center!important;}
  #card_JS8 .js8-diagnostics-details summary{
    display:grid!important;grid-template-columns:1fr!important;gap:5px!important;align-items:stretch!important;
  }
  #card_JS8 .js8-diagnostics-log-link{width:100%!important;justify-content:center!important;text-align:center!important;}
  #card_JS8 .js8-operator-status-row,
  #card_JS8 .js8-bridge-status-row,
  #card_JS8 .js8-bridge-control-row,
  #card_JS8 .js8-bridge-preflight-row,
  #card_JS8 .js8-bridge-dryrun-row,
  #card_JS8 .js8-bridge-plan-row,
  #card_JS8 .js8-bridge-manualtest-row,
  #card_JS8 .js8-bridge-manualdetail-row,
  #card_JS8 .js8-rxdecode-watch-row,
  #card_JS8 .js8-bridge-warning-row{
    display:grid!important;grid-template-columns:1fr!important;gap:5px!important;align-items:stretch!important;text-align:left!important;
  }
  #card_JS8 .js8-bridge-detail-row,
  #card_JS8 .js8-operator-status-chips,
  #card_JS8 .js8-bridge-manualdetail-chips,
  #card_JS8 .js8-rxdecode-watch-chips{
    display:grid!important;grid-template-columns:1fr!important;gap:5px!important;align-items:stretch!important;
  }
  #card_JS8 .js8-bridge-status-badge,#card_JS8 .js8-bridge-control-label,#card_JS8 .js8-bridge-preflight-label,
  #card_JS8 .js8-bridge-dryrun-label,#card_JS8 .js8-bridge-plan-label,#card_JS8 .js8-bridge-manualtest-label,
  #card_JS8 .js8-bridge-manualdetail-label,#card_JS8 .js8-rxdecode-watch-label,#card_JS8 .js8-bridge-warning-label,
  #card_JS8 .js8-operator-status-badge,#card_JS8 .js8-operator-chip,#card_JS8 .js8-bridge-detail-chip,
  #card_JS8 .js8-bridge-metric-chip,#card_JS8 .js8-rxdecode-chip{
    width:100%!important;min-width:0!important;max-width:100%!important;justify-content:center!important;text-align:center!important;white-space:normal!important;overflow-wrap:anywhere!important;
  }
  #card_JS8 .js8-bridge-control-button,#card_JS8 .js8-bridge-refresh-button{width:100%!important;align-self:stretch!important;}
  #card_JS8 .js8-shell-grid{display:grid!important;grid-template-columns:1fr!important;gap:7px!important;}
  #card_JS8 .js8-panel{padding:7px!important;}
  #card_JS8 .js8-panel header{font-size:10px!important;white-space:normal!important;overflow-wrap:anywhere!important;}
  #card_FT8 .webftr-gridlocator-host,#card_FT4 .webftr-gridlocator-host,#card_JS8 .webftr-gridlocator-host{max-height:360px!important;overflow:hidden!important;}
}
@media(max-width:420px){
  .footer{grid-template-columns:1fr!important;}
  #card_FT8 .ft8-exportbar,#card_FT4 .ft8-exportbar,#card_JS8 .ft8-exportbar{grid-template-columns:1fr!important;}
  #card_FT8 .ft8-session-info,#card_FT4 .ft8-session-info,#card_JS8 .ft8-session-info{height:28px!important;}
  #card_FT8 .ft8-decode-progress,#card_FT4 .ft8-decode-progress{min-width:96px!important;}
}


/* v25.67: Mobile S-Meter + AudioFFT Repair for FT4/JS8.
   Follow-up to v25.66: older FT4/JS8 parity rules still forced wide S-Meter grids
   and compact AudioFFT control rows on phones/tablets. Keep this block late so it
   wins without touching FT8 or any SDR/audio/decoder logic. */
@media(max-width:760px){
  #card_FT4 .smeter-wrap,
  #card_JS8 .smeter-wrap{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
    padding:8px!important;
  }
  #card_FT4 .smeter-wrap > *,
  #card_JS8 .smeter-wrap > *,
  #card_FT4 .webftr-plugin-smeter,
  #card_JS8 .webftr-plugin-smeter,
  #card_FT4 .smeter-label,
  #card_JS8 .smeter-label,
  #card_FT4 .smeter-meter,
  #card_JS8 .smeter-meter,
  #card_FT4 .smeter-center-readout,
  #card_JS8 .smeter-center-readout,
  #card_FT4 .smeter-readout,
  #card_JS8 .smeter-readout{
    grid-column:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  #card_FT4 .smeter-center-readout,
  #card_JS8 .smeter-center-readout{order:1!important;align-items:stretch!important;}
  #card_FT4 .smeter-label,
  #card_JS8 .smeter-label{order:2!important;}
  #card_FT4 .smeter-meter-s,
  #card_JS8 .smeter-meter-s{order:3!important;}
  #card_FT4 .smeter-meter-dbm,
  #card_JS8 .smeter-meter-dbm{order:4!important;}
  #card_FT4 .smeter-dbm-stack-wrap,
  #card_JS8 .smeter-dbm-stack-wrap{order:5!important;}
  #card_FT4 .smeter-center-head-row,
  #card_JS8 .smeter-center-head-row{
    display:grid!important;
    grid-template-columns:1fr 1fr 1fr!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
  }
  #card_FT4 .smeter-center-head,
  #card_JS8 .smeter-center-head,
  #card_FT4 .smeter-center-mode,
  #card_JS8 .smeter-center-mode{
    max-width:none!important;
    min-width:0!important;
    width:100%!important;
    white-space:nowrap!important;
    text-align:center!important;
    justify-content:center!important;
  }
  #card_FT4 .smeter-sevenseg,
  #card_JS8 .smeter-sevenseg,
  #card_FT4 .smeter-sevenseg-svg,
  #card_JS8 .smeter-sevenseg-svg{
    width:100%!important;
    max-width:100%!important;
  }
  #card_FT4 .smeter-dial,
  #card_JS8 .smeter-dial{width:100%!important;max-width:100%!important;min-width:0!important;}
  #card_FT4 .smeter-svg,
  #card_JS8 .smeter-svg{width:100%!important;max-width:100%!important;height:92px!important;}

  #card_FT4 .webftr-audiofft-plugin-host,
  #card_JS8 .webftr-audiofft-plugin-host,
  #card_FT4 .webftr-plugin-audiofft,
  #card_JS8 .webftr-plugin-audiofft{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audiofft-head,
  #card_JS8 .webftr-plugin-audiofft .audiofft-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
    align-items:stretch!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioPeakBadge,
  #card_JS8 .webftr-plugin-audiofft .audioPeakBadge{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    text-align:center!important;
    justify-content:center!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audiofft-grid,
  #card_JS8 .webftr-plugin-audiofft .audiofft-grid{
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioDbScale,
  #card_JS8 .webftr-plugin-audiofft .audioDbScale{
    min-width:0!important;
    width:36px!important;
    padding:3px 2px!important;
    font-size:8px!important;
  }
  #card_FT4 .webftr-plugin-audiofft canvas.audiofft,
  #card_JS8 .webftr-plugin-audiofft canvas.audiofft,
  #card_FT4 .webftr-plugin-audiofft .audiofft,
  #card_JS8 .webftr-plugin-audiofft .audiofft{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:118px!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audiofft-bottom,
  #card_JS8 .webftr-plugin-audiofft .audiofft-bottom,
  #card_FT4 .webftr-plugin-audiofft .audioControlPanel,
  #card_JS8 .webftr-plugin-audiofft .audioControlPanel{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioInfoPanel,
  #card_JS8 .webftr-plugin-audiofft .audioInfoPanel{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioInfoKey,
  #card_JS8 .webftr-plugin-audiofft .audioInfoKey,
  #card_FT4 .webftr-plugin-audiofft .audioInfoValue,
  #card_JS8 .webftr-plugin-audiofft .audioInfoValue{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:center!important;
    justify-content:center!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audiofft-toggle-row,
  #card_JS8 .webftr-plugin-audiofft .audiofft-toggle-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px 36px minmax(0,1fr)!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:stretch!important;
    padding-right:0!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioModeToggle,
  #card_JS8 .webftr-plugin-audiofft .audioModeToggle,
  #card_FT4 .webftr-plugin-audiofft .audioFftToggle,
  #card_JS8 .webftr-plugin-audiofft .audioFftToggle{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:9.3px!important;
    padding-left:5px!important;
    padding-right:5px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioInfoIcon,
  #card_JS8 .webftr-plugin-audiofft .audioInfoIcon,
  #card_FT4 .webftr-plugin-audiofft .speakerBtn,
  #card_JS8 .webftr-plugin-audiofft .speakerBtn{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
}
@media(max-width:420px){
  #card_FT4 .smeter-center-head-row,
  #card_JS8 .smeter-center-head-row,
  #card_FT4 .webftr-plugin-audiofft .audioInfoPanel,
  #card_JS8 .webftr-plugin-audiofft .audioInfoPanel,
  #card_FT4 .webftr-plugin-audiofft .audiofft-toggle-row,
  #card_JS8 .webftr-plugin-audiofft .audiofft-toggle-row{
    grid-template-columns:1fr!important;
  }
  #card_FT4 .webftr-plugin-audiofft .audioDbScale,
  #card_JS8 .webftr-plugin-audiofft .audioDbScale{width:32px!important;font-size:7.5px!important;}
  #card_FT4 .webftr-plugin-audiofft .audiofft-grid,
  #card_JS8 .webftr-plugin-audiofft .audiofft-grid{grid-template-columns:32px minmax(0,1fr)!important;}
}

/* v25.68: Mobile S-Meter + AudioFFT Parity for FT8/FT4/JS8.
   User-approved JS8 mobile schema is now applied to FT8 and FT4 as well.
   CSS/layout only: no SDR, audio backend, decoder, session, preset or JS8Call control changes. */
@media(max-width:760px){
  #card_FT8 .smeter-wrap,
  #card_FT4 .smeter-wrap,
  #card_JS8 .smeter-wrap{
    display:grid!important;
    grid-template-columns:minmax(0,1fr)!important;
    gap:8px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:visible!important;
    padding:8px!important;
    box-sizing:border-box!important;
  }
  #card_FT8 .smeter-wrap > *,
  #card_FT4 .smeter-wrap > *,
  #card_JS8 .smeter-wrap > *,
  #card_FT8 .webftr-plugin-smeter,
  #card_FT4 .webftr-plugin-smeter,
  #card_JS8 .webftr-plugin-smeter,
  #card_FT8 .smeter-label,
  #card_FT4 .smeter-label,
  #card_JS8 .smeter-label,
  #card_FT8 .smeter-meter,
  #card_FT4 .smeter-meter,
  #card_JS8 .smeter-meter,
  #card_FT8 .smeter-center-readout,
  #card_FT4 .smeter-center-readout,
  #card_JS8 .smeter-center-readout,
  #card_FT8 .smeter-readout,
  #card_FT4 .smeter-readout,
  #card_JS8 .smeter-readout{
    grid-column:1!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  #card_FT8 .smeter-center-readout,
  #card_FT4 .smeter-center-readout,
  #card_JS8 .smeter-center-readout{order:1!important;align-items:stretch!important;}
  #card_FT8 .smeter-label,
  #card_FT4 .smeter-label,
  #card_JS8 .smeter-label{order:2!important;}
  #card_FT8 .smeter-meter-s,
  #card_FT4 .smeter-meter-s,
  #card_JS8 .smeter-meter-s{order:3!important;}
  #card_FT8 .smeter-meter-dbm,
  #card_FT4 .smeter-meter-dbm,
  #card_JS8 .smeter-meter-dbm{order:4!important;}
  #card_FT8 .smeter-dbm-stack-wrap,
  #card_FT4 .smeter-dbm-stack-wrap,
  #card_JS8 .smeter-dbm-stack-wrap{order:5!important;}
  #card_FT8 .smeter-center-head-row,
  #card_FT4 .smeter-center-head-row,
  #card_JS8 .smeter-center-head-row{
    display:grid!important;
    grid-template-columns:1fr 1fr 1fr!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
  }
  #card_FT8 .smeter-center-head,
  #card_FT4 .smeter-center-head,
  #card_JS8 .smeter-center-head,
  #card_FT8 .smeter-center-mode,
  #card_FT4 .smeter-center-mode,
  #card_JS8 .smeter-center-mode{
    max-width:none!important;
    min-width:0!important;
    width:100%!important;
    white-space:nowrap!important;
    text-align:center!important;
    justify-content:center!important;
  }
  #card_FT8 .smeter-sevenseg,
  #card_FT4 .smeter-sevenseg,
  #card_JS8 .smeter-sevenseg,
  #card_FT8 .smeter-sevenseg-svg,
  #card_FT4 .smeter-sevenseg-svg,
  #card_JS8 .smeter-sevenseg-svg{
    width:100%!important;
    max-width:100%!important;
  }
  #card_FT8 .smeter-dial,
  #card_FT4 .smeter-dial,
  #card_JS8 .smeter-dial{width:100%!important;max-width:100%!important;min-width:0!important;}
  #card_FT8 .smeter-svg,
  #card_FT4 .smeter-svg,
  #card_JS8 .smeter-svg{width:100%!important;max-width:100%!important;height:92px!important;}

  #card_FT8 .webftr-audiofft-plugin-host,
  #card_FT4 .webftr-audiofft-plugin-host,
  #card_JS8 .webftr-audiofft-plugin-host,
  #card_FT8 .webftr-plugin-audiofft,
  #card_FT4 .webftr-plugin-audiofft,
  #card_JS8 .webftr-plugin-audiofft{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
    box-sizing:border-box!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audiofft-head,
  #card_FT4 .webftr-plugin-audiofft .audiofft-head,
  #card_JS8 .webftr-plugin-audiofft .audiofft-head{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:5px!important;
    align-items:stretch!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioPeakBadge,
  #card_FT4 .webftr-plugin-audiofft .audioPeakBadge,
  #card_JS8 .webftr-plugin-audiofft .audioPeakBadge{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    text-align:center!important;
    justify-content:center!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audiofft-grid,
  #card_FT4 .webftr-plugin-audiofft .audiofft-grid,
  #card_JS8 .webftr-plugin-audiofft .audiofft-grid{
    display:grid!important;
    grid-template-columns:36px minmax(0,1fr)!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    overflow:hidden!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioDbScale,
  #card_FT4 .webftr-plugin-audiofft .audioDbScale,
  #card_JS8 .webftr-plugin-audiofft .audioDbScale{
    min-width:0!important;
    width:36px!important;
    padding:3px 2px!important;
    font-size:8px!important;
  }
  #card_FT8 .webftr-plugin-audiofft canvas.audiofft,
  #card_FT4 .webftr-plugin-audiofft canvas.audiofft,
  #card_JS8 .webftr-plugin-audiofft canvas.audiofft,
  #card_FT8 .webftr-plugin-audiofft .audiofft,
  #card_FT4 .webftr-plugin-audiofft .audiofft,
  #card_JS8 .webftr-plugin-audiofft .audiofft{
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    height:118px!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audiofft-bottom,
  #card_FT4 .webftr-plugin-audiofft .audiofft-bottom,
  #card_JS8 .webftr-plugin-audiofft .audiofft-bottom,
  #card_FT8 .webftr-plugin-audiofft .audioControlPanel,
  #card_FT4 .webftr-plugin-audiofft .audioControlPanel,
  #card_JS8 .webftr-plugin-audiofft .audioControlPanel{
    display:grid!important;
    grid-template-columns:1fr!important;
    gap:6px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioInfoPanel,
  #card_FT4 .webftr-plugin-audiofft .audioInfoPanel,
  #card_JS8 .webftr-plugin-audiofft .audioInfoPanel{
    display:grid!important;
    grid-template-columns:repeat(4,minmax(0,1fr))!important;
    gap:5px!important;
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioInfoKey,
  #card_FT4 .webftr-plugin-audiofft .audioInfoKey,
  #card_JS8 .webftr-plugin-audiofft .audioInfoKey,
  #card_FT8 .webftr-plugin-audiofft .audioInfoValue,
  #card_FT4 .webftr-plugin-audiofft .audioInfoValue,
  #card_JS8 .webftr-plugin-audiofft .audioInfoValue{
    min-width:0!important;
    max-width:100%!important;
    width:100%!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
    text-align:center!important;
    justify-content:center!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audiofft-toggle-row,
  #card_FT4 .webftr-plugin-audiofft .audiofft-toggle-row,
  #card_JS8 .webftr-plugin-audiofft .audiofft-toggle-row{
    display:grid!important;
    grid-template-columns:minmax(0,1fr) 34px 36px minmax(0,1fr)!important;
    gap:5px!important;
    width:100%!important;
    max-width:100%!important;
    min-width:0!important;
    align-items:center!important;
    justify-content:stretch!important;
    padding-right:0!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioModeToggle,
  #card_FT4 .webftr-plugin-audiofft .audioModeToggle,
  #card_JS8 .webftr-plugin-audiofft .audioModeToggle,
  #card_FT8 .webftr-plugin-audiofft .audioFftToggle,
  #card_FT4 .webftr-plugin-audiofft .audioFftToggle,
  #card_JS8 .webftr-plugin-audiofft .audioFftToggle{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
    font-size:9.3px!important;
    padding-left:5px!important;
    padding-right:5px!important;
    white-space:nowrap!important;
    overflow:hidden!important;
    text-overflow:ellipsis!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioInfoIcon,
  #card_FT4 .webftr-plugin-audiofft .audioInfoIcon,
  #card_JS8 .webftr-plugin-audiofft .audioInfoIcon,
  #card_FT8 .webftr-plugin-audiofft .speakerBtn,
  #card_FT4 .webftr-plugin-audiofft .speakerBtn,
  #card_JS8 .webftr-plugin-audiofft .speakerBtn{
    width:100%!important;
    min-width:0!important;
    max-width:100%!important;
  }
}
@media(max-width:420px){
  #card_FT8 .smeter-center-head-row,
  #card_FT4 .smeter-center-head-row,
  #card_JS8 .smeter-center-head-row,
  #card_FT8 .webftr-plugin-audiofft .audioInfoPanel,
  #card_FT4 .webftr-plugin-audiofft .audioInfoPanel,
  #card_JS8 .webftr-plugin-audiofft .audioInfoPanel,
  #card_FT8 .webftr-plugin-audiofft .audiofft-toggle-row,
  #card_FT4 .webftr-plugin-audiofft .audiofft-toggle-row,
  #card_JS8 .webftr-plugin-audiofft .audiofft-toggle-row{
    grid-template-columns:1fr!important;
  }
  #card_FT8 .webftr-plugin-audiofft .audioDbScale,
  #card_FT4 .webftr-plugin-audiofft .audioDbScale,
  #card_JS8 .webftr-plugin-audiofft .audioDbScale{width:32px!important;font-size:7.5px!important;}
  #card_FT8 .webftr-plugin-audiofft .audiofft-grid,
  #card_FT4 .webftr-plugin-audiofft .audiofft-grid,
  #card_JS8 .webftr-plugin-audiofft .audiofft-grid{grid-template-columns:32px minmax(0,1fr)!important;}
}


/* v25.70: JS8 Live Attach Fresh Log Guard - live PCM readiness style, read-only. */
#card_JS8 .js8-rxdecode-watch-row.js8-rxdecode-watch-live{
  border-color:rgba(95,255,218,.42);
  background:linear-gradient(90deg,rgba(0,55,50,.40),rgba(5,26,34,.36));
  box-shadow:inset 0 0 14px rgba(95,255,218,.08),0 0 14px rgba(0,220,255,.05);
}
#card_JS8 .js8-rxdecode-watch-live .js8-rxdecode-watch-label{
  border-color:rgba(95,255,218,.62);
  background:linear-gradient(180deg,rgba(0,88,68,.62),rgba(0,42,46,.58));
  color:#d8fff4;
  text-shadow:0 0 10px rgba(95,255,218,.42);
}
#card_JS8 .js8-rxdecode-watch-live .js8-rxdecode-watch-text{
  color:#e5fff9;
}
#card_JS8 .js8-rxdecode-watch-live .js8-rxdecode-watch-source{
  color:#9dfde5;
}
#card_JS8 .js8-rxdecode-watch-live .js8-rxdecode-chip-ok{
  border-color:rgba(95,255,218,.46);
  background:linear-gradient(180deg,rgba(0,82,64,.54),rgba(0,32,38,.54));
}

/* v25.88: SSTV RX Audio Capture Guard (RX-only, HF/11m, no UKW/FM preset). */
#card_SSTV .ft8-clock{
  border-color:rgba(95,255,218,.38)!important;
  background:linear-gradient(90deg,rgba(0,56,50,.42),rgba(4,22,34,.48))!important;
  color:#dcfff7!important;
}
#card_SSTV .sstv-rx-clock-pill{
  display:inline-flex;align-items:center;justify-content:center;
  min-height:19px;padding:0 9px;margin-right:8px;border:1px solid rgba(95,255,218,.52);
  background:linear-gradient(180deg,rgba(0,84,68,.65),rgba(0,28,34,.72));
  color:#dffff8;font-weight:900;letter-spacing:.09em;text-shadow:0 0 10px rgba(95,255,218,.38);
}
#card_SSTV .sstv-shell{display:grid;gap:13px;margin-top:12px;min-width:0;}
#card_SSTV .sstv-hero{
  display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:stretch;
  border:1px solid rgba(95,255,218,.28);padding:14px;
  background:
    radial-gradient(circle at 16% 0%,rgba(95,255,218,.15),transparent 38%),
    radial-gradient(circle at 90% 20%,rgba(255,179,62,.10),transparent 36%),
    linear-gradient(180deg,rgba(0,13,19,.94),rgba(0,4,10,.98));
  box-shadow:inset 0 0 22px rgba(95,255,218,.045),0 0 18px rgba(0,232,255,.06);
}
#card_SSTV .sstv-stage-badge{
  display:inline-flex;width:max-content;max-width:100%;align-items:center;justify-content:center;
  border:1px solid rgba(255,179,62,.58);background:rgba(83,40,0,.44);color:#ffd69a;
  padding:4px 8px;font-size:9px;font-weight:900;letter-spacing:.10em;text-transform:uppercase;
  box-shadow:0 0 14px rgba(255,179,62,.12);
}
#card_SSTV .sstv-hero h4{margin:8px 0 5px;font-size:19px;letter-spacing:.08em;text-transform:uppercase;color:#e8fff9;text-shadow:0 0 14px rgba(95,255,218,.24);}
#card_SSTV .sstv-hero p{margin:0;color:#bcd8d9;font-size:12px;line-height:1.5;}
#card_SSTV .sstv-mode-stack{display:grid;grid-template-columns:1fr;gap:6px;min-width:148px;align-content:center;}
#card_SSTV .sstv-mode-stack span{
  display:flex;align-items:center;justify-content:center;height:24px;padding:0 8px;
  border:1px solid rgba(66,214,138,.42);background:rgba(0,42,25,.42);color:#d9ffe5;
  font-size:9px;font-weight:900;letter-spacing:.075em;text-transform:uppercase;
}
#card_SSTV .sstv-status-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}
#card_SSTV .sstv-status-card{
  min-height:72px;border:1px solid rgba(95,255,218,.22);background:linear-gradient(180deg,rgba(0,28,36,.52),rgba(0,8,14,.82));
  padding:10px;box-shadow:inset 0 0 14px rgba(95,255,218,.035);
}
#card_SSTV .sstv-status-card b{display:block;color:#9ffcff;font-size:10px;letter-spacing:.10em;text-transform:uppercase;margin-bottom:5px;}
#card_SSTV .sstv-status-card span{display:block;color:#e8fff7;font-size:12px;font-weight:850;}
#card_SSTV .sstv-status-card small{display:block;color:#8fb4b6;font-size:9.5px;margin-top:4px;line-height:1.35;}
#card_SSTV .sstv-preview-card{border:1px solid rgba(255,179,62,.20);background:rgba(0,8,12,.76);padding:12px;}
#card_SSTV .sstv-preview-screen{
  position:relative;overflow:hidden;min-height:260px;display:grid;place-items:center;
  border:1px solid rgba(95,255,218,.28);
  background:
    repeating-linear-gradient(0deg,rgba(255,255,255,.03) 0 1px,transparent 1px 4px),
    linear-gradient(135deg,rgba(0,68,70,.45),rgba(0,8,18,.94) 52%,rgba(70,32,0,.36));
  box-shadow:inset 0 0 32px rgba(0,232,255,.08),0 0 20px rgba(0,232,255,.06);
}
#card_SSTV .sstv-scanline{position:absolute;left:0;right:0;top:-30%;height:26%;background:linear-gradient(180deg,transparent,rgba(95,255,218,.10),transparent);animation:sstvScanV2587 5.8s linear infinite;}
@keyframes sstvScanV2587{0%{transform:translateY(-20%)}100%{transform:translateY(560%)}}
#card_SSTV .sstv-preview-text{text-align:center;position:relative;z-index:1;display:grid;gap:8px;}
#card_SSTV .sstv-preview-text b{font-size:18px;letter-spacing:.13em;color:#eafff9;text-shadow:0 0 16px rgba(95,255,218,.35);}
#card_SSTV .sstv-preview-text span{font-size:11px;color:#ffd69a;letter-spacing:.06em;text-transform:uppercase;}
#card_SSTV .sstv-preview-meta{display:flex;gap:8px;flex-wrap:wrap;margin-top:9px;}
#card_SSTV .sstv-preview-meta span{border:1px solid rgba(95,255,218,.20);background:rgba(0,30,34,.44);color:#bfeff0;padding:5px 8px;font-size:10px;font-weight:800;}
#card_SSTV .sstv-gallery-panel{border:1px solid rgba(66,214,138,.20);background:rgba(0,13,12,.66);padding:12px;}
#card_SSTV .sstv-gallery-head{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:10px;}
#card_SSTV .sstv-gallery-head b{color:#dfffe9;font-size:13px;letter-spacing:.10em;text-transform:uppercase;}
#card_SSTV .sstv-gallery-head span{color:#8fb4b6;font-size:10px;text-align:right;}
#card_SSTV .sstv-gallery-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;}
#card_SSTV .sstv-gallery-item{min-height:112px;display:grid;place-items:center;text-align:center;gap:4px;border:1px dashed rgba(95,255,218,.24);background:linear-gradient(135deg,rgba(0,42,48,.34),rgba(0,8,14,.82));color:#cffff7;}
#card_SSTV .sstv-gallery-item span{font-size:18px;color:#ffd69a;font-weight:900;}
#card_SSTV .sstv-gallery-item b{font-size:11px;letter-spacing:.08em;text-transform:uppercase;}
#card_SSTV .sstv-gallery-item small{font-size:9px;color:#8fb4b6;}
#card_SSTV .sstv-note{border:1px solid rgba(255,179,62,.25);background:rgba(56,28,0,.24);color:#ffd69a;padding:8px 10px;font-size:10px;line-height:1.45;}
#card_SSTV .sstv-capture-guard{
  display:grid;grid-template-columns:auto 1fr;gap:8px;align-items:center;
  border:1px solid rgba(95,255,218,.22);background:linear-gradient(90deg,rgba(0,54,62,.36),rgba(0,10,18,.78));
  color:#dffefa;padding:9px 10px;font-size:10.5px;line-height:1.45;
}
#card_SSTV .sstv-capture-guard b{color:#9ffcff;letter-spacing:.10em;text-transform:uppercase;font-size:10px;}
#card_SSTV .sstv-capture-guard span{color:#bfe7e7;}
@media(max-width:760px){#card_SSTV .sstv-capture-guard{grid-template-columns:1fr;}}

@media(max-width:760px){
  #card_SSTV .sstv-hero{grid-template-columns:1fr!important;}
  #card_SSTV .sstv-mode-stack{grid-template-columns:repeat(2,minmax(0,1fr));min-width:0;}
  #card_SSTV .sstv-status-grid,#card_SSTV .sstv-gallery-grid{grid-template-columns:1fr!important;}
  #card_SSTV .sstv-preview-screen{min-height:210px;}
  #card_SSTV .sstv-gallery-head{display:grid;grid-template-columns:1fr;}
  #card_SSTV .sstv-gallery-head span{text-align:left;}
}
@media(prefers-reduced-motion:reduce){#card_SSTV .sstv-scanline{animation:none;display:none;}}

/* v25.88: SSTV nutzt dasselbe mobile Visual-Plugin-Schema wie FT8/FT4/JS8. */
@media(max-width:760px){
  #card_SSTV .smeter-wrap,
  #card_SSTV .webftr-plugin-smeter,
  #card_SSTV .webftr-plugin-audiofft,
  #card_SSTV .webftr-audiofft-plugin-host,
  #card_SSTV .webftr-waterfall-plugin-host{max-width:100%!important;width:100%!important;min-width:0!important;overflow:hidden!important;box-sizing:border-box!important;}
  #card_SSTV .webftr-plugin-smeter{display:grid!important;grid-template-columns:1fr!important;gap:8px!important;}
  #card_SSTV .smeter-side,
  #card_SSTV .smeter-center{width:100%!important;max-width:100%!important;min-width:0!important;}
  #card_SSTV .smeter-center-head-row{display:grid!important;grid-template-columns:1fr 1fr 1fr!important;width:100%!important;gap:6px!important;}
  #card_SSTV .webftr-plugin-audiofft .audiofft-grid{grid-template-columns:38px minmax(0,1fr)!important;width:100%!important;max-width:100%!important;overflow:hidden!important;}
  #card_SSTV .webftr-plugin-audiofft canvas.audiofft{width:100%!important;max-width:100%!important;min-width:0!important;}
  #card_SSTV .webftr-plugin-audiofft .audioInfoPanel,
  #card_SSTV .webftr-plugin-audiofft .audiofft-toggle-row{display:grid!important;grid-template-columns:repeat(4,minmax(0,1fr))!important;gap:5px!important;width:100%!important;max-width:100%!important;min-width:0!important;}
}
@media(max-width:420px){
  #card_SSTV .smeter-center-head-row,
  #card_SSTV .webftr-plugin-audiofft .audioInfoPanel,
  #card_SSTV .webftr-plugin-audiofft .audiofft-toggle-row{grid-template-columns:1fr!important;}
  #card_SSTV .webftr-plugin-audiofft .audioDbScale{width:32px!important;font-size:7.5px!important;}
  #card_SSTV .webftr-plugin-audiofft .audiofft-grid{grid-template-columns:32px minmax(0,1fr)!important;}
}


/* v25.95: JS8 Suchfelder in normaler Schreibweise anzeigen: "Land suchen" / "Call suchen". */
#card_JS8 .ft8-country-input,
#card_JS8 .ft8-call-input{
  text-transform:none!important;
}
#card_JS8 .ft8-country-input::placeholder,
#card_JS8 .ft8-call-input::placeholder{
  text-transform:none!important;
  letter-spacing:.025em!important;
}

/* v26.02: #-Spalte zeigt kompakt, wie oft ein exakt gleicher Decode empfangen wurde. */
.ft8-table .decode-repeat-cell{
  text-align:center;
  min-width:38px;
  width:42px;
  padding-left:8px;
  padding-right:4px;
}
.ft8-decode-repeat-badge{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  min-width:24px;
  height:22px;
  padding:0 6px;
  border-radius:999px;
  border:1px solid rgba(142,238,255,.36);
  background:linear-gradient(180deg,rgba(5,35,48,.94),rgba(0,10,18,.96));
  color:#dffbff;
  font-family:Consolas,monospace;
  font-size:11px;
  font-weight:1000;
  letter-spacing:.03em;
  text-shadow:0 0 8px rgba(0,232,255,.34);
  box-shadow:inset 0 0 10px rgba(0,232,255,.10),0 0 8px rgba(0,232,255,.10);
}
.ft8-decode-repeat-badge.repeat{
  border-color:rgba(238,252,255,.90);
  background:
    radial-gradient(circle at 50% 22%,rgba(255,255,255,.56),transparent 38%),
    linear-gradient(180deg,rgba(35,180,255,.55),rgba(0,30,80,.96));
  color:#ffffff;
  text-shadow:0 0 6px rgba(255,255,255,.86),0 0 13px rgba(0,174,255,.78);
  box-shadow:0 0 12px rgba(0,180,255,.45),0 0 24px rgba(0,120,255,.24),inset 0 0 12px rgba(255,255,255,.14);
}

/* v26.07: Decode table scrollbar restore for FT8/FT4. */
#card_FT8 .ft8-table-wrap,
#card_FT4 .ft8-table-wrap{
  max-height:430px!important;
  overflow-y:auto!important;
  overflow-x:auto!important;
  scrollbar-width:thin!important;
  scrollbar-color:rgba(255,179,62,.78) rgba(0,18,26,.88)!important;
}
#card_FT8 .ft8-table-wrap::-webkit-scrollbar,
#card_FT4 .ft8-table-wrap::-webkit-scrollbar{width:10px;height:10px;}
#card_FT8 .ft8-table-wrap::-webkit-scrollbar-track,
#card_FT4 .ft8-table-wrap::-webkit-scrollbar-track{background:rgba(0,18,26,.88);}
#card_FT8 .ft8-table-wrap::-webkit-scrollbar-thumb,
#card_FT4 .ft8-table-wrap::-webkit-scrollbar-thumb{background:linear-gradient(180deg,rgba(255,179,62,.88),rgba(0,232,255,.48));border:1px solid rgba(255,255,255,.12);}


/* v26.08: additional S-Meter analog calm override. Keeps analog/digital sync, reduces visible twitch. */
#card_FT8 .smeter-s-needle-group,#card_FT8 .smeter-dbm-needle-group,#card_FT4 .smeter-s-needle-group,#card_FT4 .smeter-dbm-needle-group,#card_JS8 .smeter-s-needle-group,#card_JS8 .smeter-dbm-needle-group{transition:transform .68s cubic-bezier(.18,.72,.18,1)!important;transform-origin:220px 112px!important}


/* v26.12: Decode-list locator opens the central GridLocator station popup.
   Shared for FT8/FT4 and JS8 message/station lists. */
.ft8-locator-popup-link{
  appearance:none;
  border:1px solid rgba(0,232,255,.42);
  background:linear-gradient(180deg,rgba(0,42,54,.88),rgba(0,12,20,.96));
  color:#dffcff;
  padding:2px 6px;
  min-height:20px;
  font:inherit;
  font-family:Consolas,monospace;
  letter-spacing:.04em;
  cursor:pointer;
  box-shadow:0 0 8px rgba(0,232,255,.10);
}
.ft8-locator-popup-link:hover,
.ft8-locator-popup-link:focus{
  border-color:rgba(255,179,62,.70);
  color:#fff3d0;
  box-shadow:0 0 12px rgba(255,179,62,.18), inset 0 0 8px rgba(255,179,62,.045);
  outline:0;
}
#card_JS8 .ft8-locator-popup-link{
  min-height:18px;
  padding:1px 5px;
  font-size:10px;
  vertical-align:middle;
}


/* v26.24: Decode-list clear button and Chrome-safe dark WebFTR select popup polish. */
#card_FT8 .ft8-clear-list-btn,
#card_FT4 .ft8-clear-list-btn,
#card_JS8 .ft8-clear-list-btn{
  border:1px solid rgba(255,92,56,.78)!important;
  background:linear-gradient(180deg,rgba(128,28,8,.96),rgba(58,0,0,.98))!important;
  color:#ffe5d6!important;
  box-shadow:0 0 12px rgba(255,92,56,.20),inset 0 0 10px rgba(255,179,62,.06)!important;
  text-shadow:0 0 8px rgba(255,92,56,.35)!important;
  font-weight:900!important;
  letter-spacing:.055em!important;
  text-transform:uppercase!important;
  cursor:pointer!important;
}
#card_FT8 .ft8-clear-list-btn:hover,
#card_FT4 .ft8-clear-list-btn:hover,
#card_JS8 .ft8-clear-list-btn:hover,
#card_FT8 .ft8-clear-list-btn:focus,
#card_FT4 .ft8-clear-list-btn:focus,
#card_JS8 .ft8-clear-list-btn:focus{
  border-color:rgba(255,179,62,.95)!important;
  color:#fff6dc!important;
  box-shadow:0 0 16px rgba(255,128,48,.34),inset 0 0 12px rgba(255,179,62,.10)!important;
  outline:0!important;
}
#card_FT8 select,
#card_FT4 select,
#card_JS8 select,
#card_FT8 .ft8-wf-top-select-row select,
#card_FT4 .ft8-wf-top-select-row select,
#card_JS8 .ft8-wf-top-select-row select,
#card_FT8 .smeter-preset-select,
#card_FT4 .smeter-preset-select,
#card_JS8 .smeter-preset-select{
  color-scheme:dark!important;
  background-color:#031018!important;
  color:#fff1d6!important;
  border-color:rgba(255,179,62,.60)!important;
  scrollbar-color:rgba(255,179,62,.85) rgba(0,18,26,.95)!important;
}
#card_FT8 select option,
#card_FT4 select option,
#card_JS8 select option,
#card_FT8 .smeter-preset-select option,
#card_FT4 .smeter-preset-select option,
#card_JS8 .smeter-preset-select option{
  background:#031018!important;
  color:#fff1d6!important;
}
#card_FT8 select option:checked,
#card_FT4 select option:checked,
#card_JS8 select option:checked{
  background:#7b2b08!important;
  color:#fff7e8!important;
}


/* v26.25: Decode badge split count + clear button same orange WebFTR badge family. */
#card_FT8 .ft8-clear-list-btn,
#card_FT4 .ft8-clear-list-btn,
#card_JS8 .ft8-clear-list-btn{
  border:1px solid rgba(255,179,62,.88)!important;
  background:linear-gradient(180deg,rgba(255,179,62,.30),rgba(126,48,0,.72))!important;
  color:#fff0cf!important;
  box-shadow:0 0 15px rgba(255,179,62,.32),0 0 24px rgba(255,111,40,.13),inset 0 0 11px rgba(255,216,77,.09)!important;
  text-shadow:0 0 9px rgba(255,179,62,.54)!important;
  border-radius:8px!important;
  min-height:30px!important;
  padding:0 11px!important;
  font-family:Consolas,monospace!important;
  font-size:10px!important;
  line-height:28px!important;
}
#card_FT8 .ft8-clear-list-btn:hover,
#card_FT4 .ft8-clear-list-btn:hover,
#card_JS8 .ft8-clear-list-btn:hover,
#card_FT8 .ft8-clear-list-btn:focus,
#card_FT4 .ft8-clear-list-btn:focus,
#card_JS8 .ft8-clear-list-btn:focus{
  border-color:rgba(255,214,93,.98)!important;
  background:linear-gradient(180deg,rgba(255,214,93,.36),rgba(145,58,0,.80))!important;
  color:#fff8d7!important;
  box-shadow:0 0 18px rgba(255,179,62,.40),0 0 28px rgba(255,111,40,.17),inset 0 0 12px rgba(255,216,77,.12)!important;
}
#card_FT8 .ft8-box-head .ft8-filter-status.ft8-decode-count,
#card_FT4 .ft8-box-head .ft8-filter-status.ft8-decode-count,
#card_JS8 .ft8-box-head .ft8-filter-status.ft8-decode-count{
  min-width:92px!important;
}

/* v26.27: Decode clear button square-edge polish. Future WebFTR buttons should stay more angular. */
#card_FT8 .ft8-clear-list-btn,
#card_FT4 .ft8-clear-list-btn,
#card_JS8 .ft8-clear-list-btn{
  border-radius:0!important;
}