:root {
  color-scheme: dark;
  --bg: #080b0d;
  --panel: #101519;
  --panel-2: #151b20;
  --line: #263038;
  --line-soft: #1b2329;
  --text: #f1f5f7;
  --muted: #8d9ba4;
  --green: #45d483;
  --green-soft: rgba(69, 212, 131, .12);
  --amber: #f4b950;
  --amber-soft: rgba(244, 185, 80, .12);
  --blue: #62a7ff;
  --blue-soft: rgba(98, 167, 255, .12);
  --red: #fa6b6b;
  --radius: 14px;
  font-family: Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

* { box-sizing: border-box; }
body { margin: 0; background: var(--bg); color: var(--text); min-width: 320px; }
button { font: inherit; }
.hidden { display: none !important; }
.app-shell { min-height: 100vh; display: grid; grid-template-columns: 236px 1fr; }
.sidebar { position: sticky; top: 0; height: 100vh; padding: 24px 18px; border-right: 1px solid var(--line-soft); background: #0b0f12; display: flex; flex-direction: column; }
.brand { height: 54px; display: flex; align-items: center; gap: 12px; padding: 0 10px 20px; border-bottom: 1px solid var(--line-soft); }
.brand strong { display: block; letter-spacing: .18em; font-size: 16px; }
.brand small { display: block; color: var(--muted); font-size: 9px; letter-spacing: .22em; margin-top: 2px; }
.brand-mark { display: flex; align-items: end; gap: 3px; width: 31px; height: 29px; padding: 6px 5px; border: 1px solid #355146; border-radius: 7px; background: #101914; }
.brand-mark span { display: block; width: 3px; background: var(--green); border-radius: 3px; box-shadow: 0 0 7px rgba(69, 212, 131, .4); }
.brand-mark span:nth-child(1) { height: 7px; }.brand-mark span:nth-child(2) { height: 15px; }.brand-mark span:nth-child(3) { height: 11px; }.brand-mark span:nth-child(4) { height: 17px; }
nav { display: grid; gap: 6px; margin-top: 28px; }
.nav-item { border: 0; background: transparent; color: var(--muted); padding: 11px 12px; border-radius: 9px; display: flex; align-items: center; gap: 11px; cursor: pointer; text-align: left; }
.nav-item:hover { background: #11171b; color: var(--text); }
.nav-item.active { color: #dff9ea; background: var(--green-soft); }
.nav-icon { width: 18px; text-align: center; color: currentColor; }
.nav-item b { margin-left: auto; min-width: 21px; height: 20px; line-height: 20px; text-align: center; border-radius: 10px; font-size: 11px; background: #232c32; color: #aab6bd; }
.sidebar-foot { margin-top: auto; padding: 16px 10px 0; border-top: 1px solid var(--line-soft); display: flex; align-items: center; gap: 10px; }
.sidebar-foot strong { display: block; font-size: 12px; }.sidebar-foot small { display: block; color: var(--muted); margin-top: 3px; font-size: 10px; }
.dot { width: 7px; height: 7px; border-radius: 50%; display: inline-block; }.dot.online { background: var(--green); box-shadow: 0 0 0 4px rgba(69,212,131,.08); }.dot.manual { background: var(--blue); }.dot.warning { background: var(--amber); }
main { padding: 28px 36px 48px; max-width: 1580px; width: 100%; margin: 0 auto; }
.topbar { display: flex; align-items: center; justify-content: space-between; gap: 24px; }
.eyebrow { margin: 0 0 6px; color: var(--green); font-weight: 750; font-size: 10px; letter-spacing: .2em; }
h1, h2, p { margin-top: 0; }.topbar h1 { margin-bottom: 0; font-size: 25px; letter-spacing: -.02em; }.top-actions { display: flex; align-items: center; gap: 12px; }
.scan-pill { color: #b7c2c8; font-size: 12px; padding: 10px 14px; border: 1px solid var(--line); border-radius: 99px; background: #0d1215; }.scan-pill b { color: #e7edef; }.pulse { width: 6px; height: 6px; display: inline-block; margin-right: 8px; border-radius: 50%; background: var(--green); box-shadow: 0 0 0 5px rgba(69,212,131,.08); }
.user-button { border: 1px solid var(--line); background: var(--panel); color: var(--text); border-radius: 11px; padding: 7px 9px; display: flex; align-items: center; gap: 10px; cursor: pointer; }.user-button > span { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 8px; background: #21352b; color: #b8f0d0; font-size: 11px; font-weight: 800; }.user-button div { text-align: left; font-size: 12px; }.user-button small { display: block; color: var(--muted); margin-top: 2px; font-size: 9px; }.user-button i { color: var(--muted); font-style: normal; }
.summary { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); gap: 12px; margin: 28px 0 34px; }
.summary article { min-height: 82px; border: 1px solid var(--line-soft); background: var(--panel); border-radius: 12px; padding: 16px; display: flex; align-items: center; gap: 14px; }
.summary-icon { width: 36px; height: 36px; display: grid; place-items: center; border-radius: 10px; font-size: 14px; }.summary-icon.green { color: var(--green); background: var(--green-soft); }.summary-icon.blue { color: var(--blue); background: var(--blue-soft); }.summary-icon.amber { color: var(--amber); background: var(--amber-soft); }.summary-icon.slate { color: #a8b5bd; background: #20282e; }
.summary strong { display: block; font-size: 21px; line-height: 1; }.summary small { display: block; margin-top: 7px; color: var(--muted); font-size: 11px; }
.section-head { display: flex; justify-content: space-between; align-items: end; gap: 18px; margin-bottom: 14px; }.section-head h2, .panel-title h2 { margin-bottom: 5px; font-size: 16px; }.section-head p, .panel-title p { margin-bottom: 0; color: var(--muted); font-size: 11px; }.legend { display: flex; gap: 15px; color: var(--muted); font-size: 10px; }.legend span { display: flex; align-items: center; gap: 7px; }
.device-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.device-card { position: relative; overflow: hidden; border: 1px solid var(--line); background: var(--panel); border-radius: var(--radius); padding: 18px; transition: transform .18s ease, border-color .18s ease; cursor: pointer; }.device-card:hover { transform: translateY(-2px); border-color: #3b4952; }.device-card::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 3px; background: var(--green); }.device-card.warning::before { background: var(--amber); }.device-card.manual::before { background: var(--blue); }
.card-top { display: flex; justify-content: space-between; gap: 18px; align-items: start; }.device-name { display: flex; align-items: center; gap: 10px; }.device-name h3 { margin: 0; font-size: 15px; }.device-name small { color: var(--muted); display: block; font-size: 10px; margin-top: 4px; }.state-badge { padding: 5px 8px; border-radius: 99px; color: var(--green); background: var(--green-soft); font-size: 9px; font-weight: 800; letter-spacing: .08em; }.warning .state-badge { color: var(--amber); background: var(--amber-soft); }.manual .state-badge { color: var(--blue); background: var(--blue-soft); }
.frequency-line { display: flex; align-items: end; justify-content: space-between; gap: 18px; margin: 21px 0 18px; }.frequency strong { font-variant-numeric: tabular-nums; font-size: 31px; line-height: 1; letter-spacing: -.04em; }.frequency strong span { color: var(--muted); font-size: 11px; letter-spacing: 0; margin-left: 4px; }.frequency small { display: block; margin-top: 7px; color: #c7d1d6; font-size: 11px; }.scan-progress { width: 88px; }.scan-progress small { color: var(--muted); font-size: 9px; display: block; text-align: right; margin-bottom: 6px; }.progress-track { height: 3px; background: #222b31; border-radius: 3px; overflow: hidden; }.progress-track i { display: block; width: 62%; height: 100%; background: var(--green); border-radius: 3px; }
.meters { display: grid; grid-template-columns: repeat(4, 1fr); border-top: 1px solid var(--line-soft); padding-top: 14px; }.meter { padding: 0 11px; border-right: 1px solid var(--line-soft); }.meter:first-child { padding-left: 0; }.meter:last-child { border-right: 0; padding-right: 0; }.meter label { color: var(--muted); font-size: 9px; display: block; text-transform: uppercase; letter-spacing: .08em; }.meter strong { display: block; margin-top: 6px; font-size: 14px; font-variant-numeric: tabular-nums; }.meter strong span { color: var(--muted); font-size: 8px; font-weight: 500; margin-left: 2px; }.quality-bars { display: flex; gap: 2px; align-items: end; height: 16px; margin-top: 5px; }.quality-bars i { width: 4px; border-radius: 2px; background: #273139; }.quality-bars i.on { background: var(--green); }.quality-bars i:nth-child(1) { height: 5px; }.quality-bars i:nth-child(2) { height: 8px; }.quality-bars i:nth-child(3) { height: 11px; }.quality-bars i:nth-child(4) { height: 14px; }.quality-bars i:nth-child(5) { height: 16px; }
.card-foot { display: flex; justify-content: space-between; align-items: center; margin-top: 15px; color: var(--muted); font-size: 9px; }.card-foot button { border: 0; background: transparent; color: #bcd0da; font-size: 10px; cursor: pointer; }.card-foot button:hover { color: var(--green); }
.activity-panel { margin-top: 30px; border: 1px solid var(--line-soft); background: var(--panel); border-radius: var(--radius); overflow: hidden; }.panel-title { padding: 17px 19px; display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid var(--line-soft); }.panel-title button { border: 0; background: transparent; color: var(--green); font-size: 10px; cursor: pointer; }.activity-row { display: grid; grid-template-columns: 68px 10px 1fr auto; align-items: center; gap: 12px; padding: 13px 19px; border-bottom: 1px solid var(--line-soft); }.activity-row:last-child { border-bottom: 0; }.activity-row time { color: var(--muted); font-size: 9px; }.activity-row strong { display: block; font-size: 11px; }.activity-row p { margin: 3px 0 0; color: var(--muted); font-size: 10px; }.event-dot { width: 7px; height: 7px; border-radius: 50%; }.event-dot.green { background: var(--green); }.event-dot.amber { background: var(--amber); }.event-dot.blue { background: var(--blue); }.status-tag { padding: 5px 7px; border-radius: 5px; font-size: 8px; font-weight: 800; letter-spacing: .05em; }.status-tag.normal { color: var(--green); background: var(--green-soft); }.status-tag.pending { color: var(--amber); background: var(--amber-soft); }.status-tag.info { color: var(--blue); background: var(--blue-soft); }
.monitor-dialog { width: min(1180px, calc(100vw - 32px)); max-height: calc(100vh - 32px); border: 1px solid #34414a; padding: 0; border-radius: 16px; background: #0e1316; color: var(--text); box-shadow: 0 35px 100px rgba(0,0,0,.65); transition: width .18s ease, height .18s ease; }.monitor-dialog.maximized { width: calc(100vw - 14px); max-width: none; height: calc(100vh - 14px); max-height: none; }.monitor-dialog::backdrop { background: rgba(2,4,5,.75); backdrop-filter: blur(4px); }.dialog-head { padding: 17px 22px; border-bottom: 1px solid var(--line); display: flex; justify-content: space-between; align-items: start; }.dialog-head h2 { margin-bottom: 0; }.dialog-actions { display: flex; gap: 7px; }.icon-button { width: 32px; height: 32px; border-radius: 8px; border: 1px solid var(--line); background: var(--panel-2); color: var(--muted); font-size: 20px; cursor: pointer; }.icon-button:hover { color: var(--text); border-color: #43515a; }.dialog-body { padding: 16px 22px 20px; }.station-tabs { display: flex; gap: 7px; flex-wrap: wrap; }.station-tab { border: 1px solid var(--line); background: #12181c; color: #a9b5bc; border-radius: 8px; padding: 8px 10px; font-size: 10px; cursor: pointer; }.station-tab.active { border-color: #39624e; background: var(--green-soft); color: #dff9ea; }.detail-commandbar { display: flex; justify-content: space-between; align-items: center; gap: 15px; }.manual-status { display: flex; gap: 8px; align-items: center; padding: 7px 8px 7px 11px; border-radius: 9px; background: #0a0f12; color: var(--muted); font-size: 10px; white-space: nowrap; }.manual-status button { padding: 7px 10px; }.primary, .secondary { border-radius: 8px; padding: 10px 12px; cursor: pointer; font-weight: 750; font-size: 10px; }.primary { border: 1px solid #4d8b69; background: #2d6948; color: white; }.secondary { border: 1px solid var(--line); background: #141b1f; color: #c2cdd2; }.detail-tabs { display: flex; gap: 4px; margin: 15px 0 0; padding: 4px; border: 1px solid var(--line-soft); border-radius: 10px 10px 0 0; background: #0a0e11; }.detail-tabs button { border: 0; border-radius: 7px; padding: 9px 14px; background: transparent; color: var(--muted); font-size: 10px; cursor: pointer; }.detail-tabs button:hover { color: var(--text); }.detail-tabs button.active { background: #1b2922; color: #dff9ea; }.detail-tabs button span { margin-left: 5px; padding: 2px 5px; border-radius: 4px; background: #222c32; color: #89969e; font-size: 7px; text-transform: uppercase; letter-spacing: .08em; }.detail-workspace { min-height: 438px; padding: 16px; border: 1px solid var(--line-soft); border-top: 0; border-radius: 0 0 11px 11px; background: #0b1013; }.detail-footer { display: flex; align-items: center; justify-content: space-between; margin-top: 10px; color: var(--muted); font-size: 9px; }.detail-footer button { padding: 7px 10px; }
.measurement-layout { display: grid; grid-template-columns: minmax(0, 1fr) 250px; gap: 14px; }.measurement-main, .measurement-side, .rds-primary, .rds-side, .chart-panel, .listen-panel { border: 1px solid var(--line-soft); border-radius: 11px; background: #10161a; }.metric-ribbon { display: grid; grid-template-columns: 1fr 1.5fr 1.3fr .7fr; border-bottom: 1px solid var(--line-soft); }.metric-ribbon > div { padding: 13px 15px; border-right: 1px solid var(--line-soft); }.metric-ribbon > div:last-child { border-right: 0; }.metric-ribbon label, .rds-identity label, .rds-text label, .rtplus-grid label, .now-playing label { display: block; color: var(--muted); font-size: 8px; letter-spacing: .09em; text-transform: uppercase; }.metric-ribbon strong { display: block; margin-top: 5px; font-size: 14px; }.metric-ribbon small { color: var(--muted); font-size: 8px; }.meter-board { display: grid; grid-template-columns: repeat(2, 1fr); gap: 0 20px; padding: 7px 16px 13px; }.db-meter { padding: 9px 0; border-bottom: 1px solid #1a2328; }.db-meter-head { display: flex; justify-content: space-between; align-items: center; gap: 12px; }.db-meter-head span { color: #b6c1c7; font-size: 9px; }.db-meter-head strong { font-size: 11px; font-variant-numeric: tabular-nums; }.db-meter-head small { color: var(--muted); font-size: 8px; }.db-meter-track { height: 7px; margin-top: 7px; overflow: hidden; border-radius: 3px; background: linear-gradient(90deg,#2a3135 0 74%,#45391f 74% 88%,#432329 88%); }.db-meter-track i { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg,#238d58,var(--green)); box-shadow: 0 0 8px rgba(69,212,131,.18); }.db-meter-track i.blue { background: linear-gradient(90deg,#356cae,var(--blue)); }.db-meter-track i.amber { background: linear-gradient(90deg,#8c6429,var(--amber)); }.measurement-side, .rds-side { padding: 15px; }.measurement-side h3, .rds-side h3 { margin: 0 0 10px; font-size: 11px; }.technical-list { margin: 0; }.technical-list > div { display: flex; justify-content: space-between; gap: 12px; padding: 9px 0; border-bottom: 1px solid var(--line-soft); }.technical-list > div:last-child { border-bottom: 0; }.technical-list dt { color: var(--muted); font-size: 9px; }.technical-list dd { margin: 0; font-size: 9px; font-weight: 750; text-align: right; font-variant-numeric: tabular-nums; }
.rds-layout { display: grid; grid-template-columns: minmax(0, 1fr) 285px; gap: 14px; }.rds-primary { overflow: hidden; }.rds-identity { display: grid; grid-template-columns: .7fr 1fr 1.2fr 1fr; border-bottom: 1px solid var(--line-soft); }.rds-identity > div { min-height: 70px; padding: 14px; border-right: 1px solid var(--line-soft); }.rds-identity > div:last-child { border-right: 0; }.rds-identity strong { display: inline-block; margin-top: 8px; font-size: 17px; }.rds-identity small { color: var(--muted); margin-left: 5px; }.rds-text { padding: 15px; background: #0a130e; border-bottom: 1px solid #1e3528; }.rds-text strong { display: block; margin-top: 7px; color: #83efa9; font-family: ui-monospace,Consolas,monospace; font-size: 15px; letter-spacing: .03em; }.rds-flags { display: flex; flex-wrap: wrap; gap: 6px; padding: 11px 15px; border-bottom: 1px solid var(--line-soft); }.rds-flags span { padding: 5px 7px; border: 1px solid var(--line); border-radius: 5px; color: #647078; font-size: 8px; }.rds-flags span.on { color: #bdf4d2; border-color: #365c47; background: var(--green-soft); }.rds-section { padding: 13px 15px; border-bottom: 1px solid var(--line-soft); }.rds-section:last-child { border-bottom: 0; }.subhead { display: flex; justify-content: space-between; align-items: center; }.subhead h3 { margin: 0; font-size: 10px; }.subhead small { color: var(--muted); font-size: 8px; }.frequency-chips { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 10px; }.frequency-chips span { padding: 5px 7px; border-radius: 5px; background: #1b252b; color: #c5d0d5; font-size: 9px; }.frequency-chips em { color: var(--muted); font-size: 9px; }.rtplus-grid { display: grid; grid-template-columns: repeat(5,1fr); gap: 7px; margin-top: 10px; }.rtplus-grid > div { min-width: 0; padding: 8px; border-radius: 7px; background: #0b1013; }.rtplus-grid strong { display: block; margin-top: 5px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 9px; }.side-heading { margin-top: 17px !important; }.group-grid > div { display: grid; grid-template-columns: 25px 1fr 37px; align-items: center; gap: 7px; margin: 8px 0; color: var(--muted); font-size: 8px; }.group-grid i { height: 4px; border-radius: 3px; background: #273037; overflow: hidden; }.group-grid b { display: block; height: 100%; background: var(--blue); }
.chart-panel { padding: 15px; }.chart-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 12px; padding-bottom: 12px; border-bottom: 1px solid var(--line-soft); }.chart-toolbar > div { display: flex; gap: 5px; align-items: center; }.chart-toolbar span { color: var(--muted); font-size: 8px; margin-left: 9px; }.chip { padding: 5px 8px; border: 1px solid var(--line); border-radius: 5px; background: #11171b; color: var(--muted); font-size: 8px; cursor: pointer; }.chip.active { border-color: #49634f; background: #1b2a21; color: #d9f8e6; }.chart-title { display: flex; align-items: start; justify-content: space-between; margin: 13px 0 6px; }.chart-title h3 { margin: 0 0 4px; font-size: 11px; }.chart-title p { margin: 0; color: var(--muted); font-size: 8px; }.chart-title > strong { color: #f2df38; font-size: 11px; }.chart-title > strong small { color: var(--muted); font-size: 8px; }.signal-chart { display: block; width: 100%; height: 265px; background: #070a0c; border-radius: 7px; }.signal-chart line { stroke: #242b30; stroke-width: 1; }.signal-chart text { fill: #78858d; font-size: 9px; }.chart-legend { display: flex; gap: 18px; margin-top: 10px; color: var(--muted); font-size: 8px; }.chart-legend span { display: flex; align-items: center; gap: 6px; }.chart-legend i { width: 9px; height: 3px; background: var(--green); }.chart-legend i.yellow { background: #f2df38; }.constraint-note, .audio-note { margin: 11px 0 0; padding-top: 10px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 8px; line-height: 1.5; }.modulation-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }.modulation-grid .signal-chart { height: 295px; }
.chip:disabled { opacity: .38; cursor: not-allowed; }.connection-failed .lock-icon { color: #ff7d84; background: rgba(224,74,85,.13); }.connection-failed code { max-width: 520px; margin: -5px 0 14px; padding: 6px 9px; border-radius: 5px; background: #160d10; color: #cf8e93; font-size: 8px; overflow-wrap: anywhere; }.power-wait { min-height: 295px; display: grid; place-content: center; justify-items: center; text-align: center; border-radius: 7px; background: #080d10; }.power-wait > span { display: grid; place-items: center; width: 44px; height: 44px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-size: 11px; font-weight: 850; }.power-wait > .scan-spinner { border-radius: 50%; border: 3px solid #26343c; border-top-color: var(--blue); background: transparent; }.power-wait strong { margin-top: 12px; font-size: 18px; }.power-wait p { max-width: 245px; margin: 7px 0 0; color: var(--muted); font-size: 9px; line-height: 1.5; }.power-wait button { margin-top: 13px; }.power-stats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1px; margin-top: 8px; overflow: hidden; border: 1px solid var(--line-soft); border-radius: 7px; background: var(--line-soft); }.power-stats span { display: flex; justify-content: space-between; padding: 8px 10px; background: #0b1114; color: var(--muted); font-size: 8px; }.power-stats b { color: var(--text); }
.manual-lock { min-height: 405px; display: grid; place-content: center; justify-items: center; text-align: center; }.lock-icon { display: grid; place-items: center; width: 45px; height: 45px; border-radius: 50%; color: var(--blue); background: var(--blue-soft); font-size: 21px; }.manual-lock strong { margin-top: 14px; font-size: 14px; }.manual-lock p { max-width: 440px; margin: 7px 0 16px; color: var(--muted); font-size: 10px; line-height: 1.6; }.listen-panel { min-height: 405px; display: grid; grid-template-columns: 250px 1fr; overflow: hidden; }.onair { display: grid; place-content: center; align-content: center; padding: 24px; text-align: center; background: radial-gradient(circle at center,#153d29,#0a120e 70%); border-right: 1px solid #274232; }.onair span { justify-self: center; padding: 5px 8px; border-radius: 5px; background: #b8313b; color: white; font-size: 8px; font-weight: 900; letter-spacing: .14em; }.onair strong { margin-top: 14px; color: #7af0a7; font-size: 52px; font-variant-numeric: tabular-nums; letter-spacing: -.04em; }.onair small { color: #73a886; font-size: 9px; }.onair p { margin: 10px 0 0; font-size: 11px; }.listen-main { display: grid; align-content: center; padding: 28px; }.now-playing strong { display: block; margin-top: 7px; color: #d8f7e4; font-size: 17px; }.now-playing span { display: block; margin-top: 5px; color: var(--muted); font-size: 10px; }.waveform { height: 56px; margin: 24px 0 18px; display: flex; align-items: center; gap: 3px; overflow: hidden; }.waveform i { flex: 1; max-width: 5px; border-radius: 3px; background: linear-gradient(var(--green),#1f7145); opacity: .75; }.waveform.active i { animation: audio-pulse .7s ease-in-out infinite alternate; }.waveform.active i:nth-child(3n) { animation-delay: -.24s; }.waveform.active i:nth-child(4n) { animation-delay: -.47s; }.player-controls { display: grid; grid-template-columns: 48px 1fr 140px; align-items: center; gap: 15px; }.play-large { width: 48px; height: 48px; border: 0; border-radius: 50%; background: var(--green); color: #062313; cursor: pointer; font-size: 16px; }.play-large.playing { background: var(--red); color: white; }.player-time { display: grid; grid-template-columns: 42px 1fr 76px; align-items: center; gap: 8px; font-size: 8px; }.player-time > div { height: 4px; border-radius: 3px; background: #2c353a; overflow: hidden; }.player-time i { display: block; height: 100%; background: var(--green); }.player-time small { color: var(--muted); white-space: nowrap; }.volume { color: var(--muted); font-size: 8px; }.volume input { width: 100%; margin-top: 5px; accent-color: var(--green); }
@keyframes audio-pulse { from { transform: scaleY(.45); opacity: .45; } to { transform: scaleY(1); opacity: .9; } }
.capability-note { margin: 0; padding: 10px 16px 12px; border-top: 1px solid var(--line-soft); color: var(--muted); font-size: 8px; line-height: 1.55; }.capability-note b { color: #b8c6cc; }
.scan-spinner { width: 44px; height: 44px; border: 3px solid #26343c; border-top-color: var(--blue); border-radius: 50%; animation: scan-spin .8s linear infinite; }.bandscan-wait strong { margin-top: 16px; }.bandscan-panel .signal-chart { height: 235px; }.bandscan-head { display: flex; align-items: center; justify-content: space-between; margin: 12px 0 7px; padding-top: 11px; border-top: 1px solid var(--line-soft); font-size: 9px; }.bandscan-head span { color: var(--muted); font-size: 8px; }.bandscan-peaks { display: grid; grid-template-columns: repeat(5, 1fr); gap: 6px; }.bandscan-peak { display: grid; gap: 3px; padding: 8px; border: 1px solid var(--line-soft); border-radius: 7px; background: #0b1115; color: var(--text); text-align: left; cursor: pointer; }.bandscan-peak:hover { border-color: #3f6b83; background: #101c23; }.bandscan-peak strong { font-size: 10px; }.bandscan-peak span { color: var(--blue); font-size: 9px; }.bandscan-peak em { color: var(--muted); font-size: 7px; font-style: normal; }.bandscan-peaks > p { color: var(--muted); font-size: 9px; }.bandscan-panel .chart-toolbar > .secondary { padding: 6px 9px; }
@keyframes scan-spin { to { transform: rotate(360deg); } }
@media (max-width: 900px) { .bandscan-peaks { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .bandscan-peaks { grid-template-columns: repeat(2, 1fr); }.bandscan-head { align-items: start; gap: 8px; }.bandscan-head span { text-align: right; } }
@media (max-width: 900px) { .station-device-grid { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .station-device > header { align-items: start; }.station-admin-list > div { grid-template-columns: 76px minmax(0, 1fr); }.station-admin-list small { grid-column: 2; }.form-row { grid-template-columns: 1fr; } }
.toast { position: fixed; right: 24px; bottom: 24px; transform: translateY(20px); opacity: 0; background: #182128; color: #eaf0f3; border: 1px solid #34424b; border-radius: 9px; padding: 11px 14px; font-size: 11px; transition: .2s ease; pointer-events: none; }.toast.show { transform: translateY(0); opacity: 1; }
.secondary-view { margin-top: 28px; }.view-header { display: flex; justify-content: space-between; align-items: end; margin-bottom: 16px; }.view-header h2 { margin-bottom: 5px; font-size: 18px; }.view-header p { margin-bottom: 0; color: var(--muted); font-size: 11px; }.config-card { border: 1px solid var(--line-soft); background: var(--panel); border-radius: var(--radius); overflow: hidden; }.config-card + .config-card { margin-top: 14px; }.config-card-head { padding: 16px 18px; border-bottom: 1px solid var(--line-soft); display: flex; align-items: center; justify-content: space-between; }.config-card-head h3 { margin: 0; font-size: 13px; }.config-card-head span { color: var(--muted); font-size: 10px; }.config-table { width: 100%; border-collapse: collapse; }.config-table th { color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .09em; text-align: left; padding: 10px 18px; background: #0c1114; }.config-table td { padding: 12px 18px; border-top: 1px solid var(--line-soft); font-size: 10px; }.config-table td strong { display: block; font-size: 11px; }.config-table td small { color: var(--muted); }.rule-state { display: inline-flex; align-items: center; gap: 7px; }.rule-state i { width: 7px; height: 7px; border-radius: 50%; background: var(--green); }.rule-state.off { color: var(--muted); }.rule-state.off i { background: #465159; }.settings-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 12px; }.setting-tile { border: 1px solid var(--line-soft); background: var(--panel); border-radius: 12px; padding: 16px; }.setting-tile label { color: var(--muted); display: block; font-size: 9px; text-transform: uppercase; letter-spacing: .08em; }.setting-tile strong { display: block; margin-top: 8px; font-size: 17px; }.setting-tile p { color: var(--muted); font-size: 10px; line-height: 1.5; margin: 8px 0 0; }.empty-state { padding: 44px 20px; text-align: center; color: var(--muted); }.empty-state strong { color: var(--text); display: block; margin-bottom: 7px; font-size: 13px; }.empty-state p { font-size: 10px; }
.station-manager { margin-top: 14px; }.config-card-head > div p { margin: 5px 0 0; color: var(--muted); font-size: 9px; }.station-device-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line-soft); }.station-device { min-width: 0; padding: 16px; background: var(--panel); }.station-device > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 12px; }.station-device > header strong, .station-device > header small { display: block; }.station-device > header strong { font-size: 12px; }.station-device > header small { margin-top: 3px; color: var(--muted); font-size: 8px; }.station-device > header button { padding: 7px 9px; }.station-admin-list { border: 1px solid var(--line-soft); border-radius: 8px; overflow: hidden; }.station-admin-list > div { display: grid; grid-template-columns: 82px minmax(0, 1fr) auto; align-items: center; gap: 9px; min-height: 38px; padding: 7px 10px; border-bottom: 1px solid var(--line-soft); }.station-admin-list > div:last-child { border-bottom: 0; }.station-admin-list strong { color: #dff9ea; font-size: 10px; font-variant-numeric: tabular-nums; }.station-admin-list span { overflow: hidden; font-size: 10px; white-space: nowrap; text-overflow: ellipsis; }.station-admin-list small { color: var(--muted); font-size: 8px; white-space: nowrap; }.add-station-form { margin-top: 11px; padding: 13px; border: 1px solid #345c49; border-radius: 9px; background: #0d1712; }.form-title { display: flex; justify-content: space-between; align-items: center; margin-bottom: 11px; }.form-title strong { font-size: 11px; }.form-title button { border: 0; background: transparent; color: var(--muted); cursor: pointer; font-size: 18px; }.add-station-form label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .06em; }.add-station-form input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 7px; padding: 9px 10px; outline: none; background: #080d0f; color: var(--text); font: inherit; font-size: 10px; }.add-station-form input:focus { border-color: #4d8b69; box-shadow: 0 0 0 2px rgba(69,212,131,.08); }.form-row { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; margin-top: 9px; }.form-actions { display: flex; justify-content: flex-end; gap: 7px; margin-top: 12px; }.form-actions button { padding: 8px 11px; }.form-actions button:disabled { opacity: .55; cursor: wait; }.form-hint { margin: 9px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
@media (max-width: 980px) { .app-shell { grid-template-columns: 78px 1fr; }.sidebar { padding: 22px 12px; }.brand > div:last-child, .nav-item:not(.active) b, .nav-item { font-size: 0; }.brand { padding-inline: 9px; }.brand-mark { flex: 0 0 auto; }.nav-item { justify-content: center; }.nav-icon { font-size: 17px; }.sidebar-foot div { display: none; }.sidebar-foot { justify-content: center; }.summary { grid-template-columns: repeat(2,1fr); }.top-actions .scan-pill { display: none; } }
@media (max-width: 900px) { .measurement-layout, .rds-layout, .modulation-grid { grid-template-columns: 1fr; }.measurement-side, .rds-side { max-height: 270px; overflow: auto; }.listen-panel { grid-template-columns: 190px 1fr; }.rtplus-grid { grid-template-columns: repeat(3,1fr); }.detail-commandbar { align-items: start; }.manual-status { white-space: normal; } }
@media (max-width: 720px) { .app-shell { display: block; }.sidebar { position: fixed; z-index: 20; inset: auto 0 0; height: 62px; flex-direction: row; border: 1px solid var(--line); border-width: 1px 0 0; padding: 8px 16px; }.brand, .sidebar-foot { display: none; }.sidebar nav { margin: 0; display: flex; justify-content: space-around; width: 100%; }.nav-item, .nav-item.active { width: 48px; padding: 10px; }.nav-icon { font-size: 18px; } main { padding: 22px 16px 88px; }.user-button div, .user-button i { display: none; }.summary { gap: 8px; margin-top: 22px; }.summary article { padding: 12px; min-height: 70px; }.summary-icon { display: none; }.device-grid { grid-template-columns: 1fr; }.legend { display: none; }.meters { grid-template-columns: repeat(2,1fr); row-gap: 14px; }.meter:nth-child(2) { border-right: 0; }.activity-row { grid-template-columns: 10px 1fr auto; }.activity-row time { display: none; }.monitor-dialog { width: calc(100vw - 12px); max-height: calc(100vh - 12px); }.dialog-body { padding: 12px; }.detail-commandbar { display: block; }.manual-status { margin-top: 10px; justify-content: space-between; }.detail-tabs { overflow-x: auto; }.detail-tabs button { white-space: nowrap; padding: 8px 10px; }.detail-workspace { padding: 9px; }.metric-ribbon { grid-template-columns: 1fr 1fr; }.metric-ribbon > div:nth-child(2) { border-right: 0; }.meter-board { grid-template-columns: 1fr; }.rds-identity { grid-template-columns: 1fr 1fr; }.rds-identity > div:nth-child(2) { border-right: 0; }.rtplus-grid { grid-template-columns: 1fr 1fr; }.chart-toolbar { display: block; }.chart-toolbar > div + div { margin-top: 8px; overflow-x: auto; }.signal-chart { height: 210px; }.listen-panel { grid-template-columns: 1fr; }.onair { padding: 18px; border-right: 0; border-bottom: 1px solid #274232; }.onair strong { font-size: 38px; }.listen-main { padding: 18px; }.player-controls { grid-template-columns: 48px 1fr; }.volume { grid-column: 1 / -1; } }
@media (max-width: 720px) { .settings-grid { grid-template-columns: 1fr; }.config-table th:nth-child(3), .config-table td:nth-child(3) { display: none; }.secondary-view { overflow-x: auto; } }

.rtplus-status { display: inline-flex; align-items: center; gap: 6px; }.rtplus-status i { width: 6px; height: 6px; border-radius: 50%; background: #59656c; }.rtplus-status.live { color: #8fe8b1; }.rtplus-status.live i { background: var(--green); box-shadow: 0 0 0 4px rgba(69,212,131,.08); }
.chart-zoombar { min-height: 38px; display: grid; grid-template-columns: auto minmax(100px, 1fr) auto; align-items: center; gap: 13px; padding: 7px 9px; border: 1px solid var(--line-soft); border-top: 0; border-radius: 0 0 7px 7px; background: #0a0f12; color: var(--muted); font-size: 8px; }.chart-zoombar > span { white-space: nowrap; }.chart-zoombar > span b { color: #bac5ca; }.chart-zoombar input { width: 100%; accent-color: var(--blue); }.chart-zoombar input:disabled { opacity: .3; }.chart-zoom-actions { display: flex; align-items: center; gap: 5px; }.chart-zoom-actions button { min-width: 27px; height: 25px; padding: 0 7px; border: 1px solid var(--line); border-radius: 5px; background: #141b1f; color: #c4cfd4; cursor: pointer; font-size: 9px; }.chart-zoom-actions button:hover { border-color: #4a5c66; color: white; }.chart-zoom-actions strong { min-width: 27px; color: #a9b7be; text-align: center; font-size: 8px; }.zoom-chart .signal-chart { border-radius: 7px 7px 0 0; }
.audio-analysis { margin: 18px 0 15px; padding: 10px; border: 1px solid var(--line-soft); border-radius: 9px; background: #0a0f12; }.audio-analysis-head { display: flex; justify-content: space-between; align-items: start; gap: 15px; margin-bottom: 8px; }.audio-analysis-head strong, .audio-analysis-head small { display: block; }.audio-analysis-head strong { font-size: 10px; }.audio-analysis-head small { margin-top: 3px; color: var(--muted); font-size: 8px; }.audio-analysis-head > span { color: var(--green); font: 8px ui-monospace,Consolas,monospace; }.audio-scope { display: block; width: 100%; height: 92px; border-radius: 6px; background: #070a0c; }.channel-levels { display: grid; grid-template-columns: 1fr 1fr auto; align-items: center; gap: 10px; margin-top: 9px; }.channel-levels > div { display: grid; grid-template-columns: 40px 1fr; align-items: center; gap: 7px; }.channel-levels span { display: flex; justify-content: space-between; gap: 5px; color: #cbd5da; font-size: 8px; }.channel-levels span b { color: var(--blue); }.channel-levels span em { color: var(--muted); font-style: normal; }.channel-levels i { height: 5px; overflow: hidden; border-radius: 3px; background: #283137; }.channel-levels i b { display: block; height: 100%; border-radius: 3px; background: linear-gradient(90deg,#356cae,var(--blue)); }.channel-levels > small { color: var(--muted); font-size: 7px; white-space: nowrap; }
.monitor-dialog.maximized .detail-workspace { min-height: calc(100vh - 255px); }.monitor-dialog.maximized .signal-chart { height: min(42vh, 390px); }.monitor-dialog.maximized .modulation-grid .signal-chart { height: min(45vh, 420px); }
@media (max-width: 720px) { .dialog-actions [data-maximize] { display: none; }.chart-zoombar { grid-template-columns: 1fr auto; }.chart-zoombar > input { grid-column: 1 / -1; grid-row: 2; }.channel-levels { grid-template-columns: 1fr; }.channel-levels > small { white-space: normal; } }
.no-device-access { grid-column: 1 / -1; min-height: 220px; display: grid; place-content: center; justify-items: center; text-align: center; border: 1px dashed #334049; border-radius: var(--radius); background: #0d1215; }.no-device-access strong { font-size: 15px; }.no-device-access p { margin: 7px 0 0; color: var(--muted); font-size: 10px; }
.access-manager { margin-top: 14px; }.access-users { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line-soft); }.access-user { min-width: 0; padding: 15px; background: var(--panel); }.access-user > header { display: grid; grid-template-columns: 34px minmax(0, 1fr) auto; align-items: center; gap: 9px; }.access-user > header > span { width: 34px; height: 34px; display: grid; place-items: center; border-radius: 9px; background: #21352b; color: #b8f0d0; font-size: 9px; font-weight: 850; }.access-user header strong, .access-user header small { display: block; }.access-user header strong { font-size: 11px; }.access-user header small { margin-top: 3px; overflow: hidden; color: var(--muted); font-size: 8px; text-overflow: ellipsis; }.access-user header em { padding: 4px 6px; border-radius: 5px; background: #20292f; color: #9ba8af; font-size: 7px; font-style: normal; font-weight: 800; letter-spacing: .07em; }.access-user header em.admin { color: #bdf4d2; background: var(--green-soft); }.device-permissions { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; margin-top: 13px; }.device-permissions label { min-width: 0; display: flex; align-items: center; gap: 8px; padding: 8px; border: 1px solid var(--line-soft); border-radius: 7px; background: #0c1114; cursor: pointer; }.device-permissions input { accent-color: var(--green); }.device-permissions span, .device-permissions b, .device-permissions small { min-width: 0; display: block; }.device-permissions b { overflow: hidden; font-size: 9px; text-overflow: ellipsis; white-space: nowrap; }.device-permissions small { margin-top: 2px; color: var(--muted); font-size: 7px; }.access-user > footer { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 12px; }.access-user > footer small { color: var(--muted); font-size: 7px; line-height: 1.45; }.access-user > footer button { flex: 0 0 auto; padding: 7px 9px; }.access-user > footer button:disabled { opacity: .6; cursor: wait; }
@media (max-width: 900px) { .access-users { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .device-permissions { grid-template-columns: 1fr; }.access-user > footer { align-items: start; } }
.station-admin-list > .station-admin-row { grid-template-columns: 82px minmax(0, 1fr) minmax(105px, auto) auto; }.station-admin-row small em { display: block; margin-top: 3px; color: #8fe8b1; font-style: normal; }.station-admin-row > button { padding: 6px 8px; }.station-recipient-form { padding: 12px; border-bottom: 1px solid var(--line-soft); background: #0d1712; }.station-recipient-form label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .06em; }.station-recipient-form textarea { width: 100%; resize: vertical; border: 1px solid var(--line); border-radius: 7px; padding: 9px 10px; outline: none; background: #080d0f; color: var(--text); font: 10px/1.5 Inter,ui-sans-serif,system-ui,sans-serif; }.station-recipient-form textarea:focus { border-color: #4d8b69; box-shadow: 0 0 0 2px rgba(69,212,131,.08); }.station-recipient-form > p { margin: 7px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
@media (max-width: 560px) { .station-admin-list > .station-admin-row { grid-template-columns: 76px minmax(0, 1fr) auto; }.station-admin-row small { grid-column: 2; }.station-admin-row > button { grid-column: 3; grid-row: 1 / span 2; } }
.device-manager { margin-top: 14px; }.device-manager .config-card-head button { padding: 8px 10px; }.configured-devices { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1px; background: var(--line-soft); }.configured-devices > div { min-width: 0; display: grid; grid-template-columns: 8px minmax(70px, .7fr) minmax(120px, 1fr) auto; align-items: center; gap: 9px; padding: 11px 15px; background: var(--panel); }.configured-devices strong { font-size: 10px; }.configured-devices small { overflow: hidden; color: #b8c4ca; font: 9px ui-monospace,Consolas,monospace; text-overflow: ellipsis; white-space: nowrap; }.configured-devices em { color: var(--muted); font-size: 8px; font-style: normal; white-space: nowrap; }.add-device-form { padding: 16px; border-top: 1px solid #345c49; background: #0d1712; }.add-device-form > label, .add-device-form .form-row label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .06em; }.add-device-form input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 7px; padding: 9px 10px; outline: none; background: #080d0f; color: var(--text); font: inherit; font-size: 10px; }.add-device-form input:focus { border-color: #4d8b69; box-shadow: 0 0 0 2px rgba(69,212,131,.08); }.device-form-divider { display: flex; align-items: center; gap: 9px; margin: 16px 0 2px; color: #9fadb4; font-size: 8px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }.device-form-divider::after { content: ""; height: 1px; flex: 1; background: #26332c; }.connection-test-status { display: flex; align-items: center; gap: 10px; margin-top: 13px; padding: 10px 11px; border: 1px solid var(--line); border-radius: 8px; background: #0a0f12; }.connection-test-status > span { width: 25px; height: 25px; display: grid; place-items: center; border-radius: 50%; background: #202a30; color: #8d9ba4; font-size: 11px; }.connection-test-status strong, .connection-test-status small { display: block; }.connection-test-status strong { font-size: 9px; }.connection-test-status small { margin-top: 3px; color: var(--muted); font-size: 8px; }.connection-test-status.checking > span { color: var(--blue); animation: scan-spin .8s linear infinite; }.connection-test-status.success { border-color: #315d46; background: #0c1711; }.connection-test-status.success > span { color: var(--green); background: var(--green-soft); }.connection-test-status.failed { border-color: #65343a; background: #180d10; }.connection-test-status.failed > span { color: var(--red); background: rgba(250,107,107,.1); }.add-device-form [type="submit"]:disabled { opacity: .45; cursor: not-allowed; }
@media (max-width: 900px) { .configured-devices { grid-template-columns: 1fr; } }
@media (max-width: 560px) { .configured-devices > div { grid-template-columns: 8px 1fr auto; }.configured-devices small { grid-column: 2; }.configured-devices em { grid-column: 3; grid-row: 1 / span 2; } }
.station-actions { display: flex; gap: 5px; }.station-actions button { padding: 6px 8px; }.station-alarm-form { padding: 13px; border-bottom: 1px solid var(--line-soft); background: #0d1712; }.station-alarm-form .form-title > div strong, .station-alarm-form .form-title > div small { display: block; }.station-alarm-form .form-title > div small { margin-top: 3px; color: var(--muted); font-size: 8px; }.default-alarm-toggle { display: flex; align-items: center; gap: 9px; padding: 10px; border: 1px solid #315d46; border-radius: 8px; background: #0b1410; cursor: pointer; }.default-alarm-toggle input, .alarm-rule-toggle input { accent-color: var(--green); }.default-alarm-toggle span b, .default-alarm-toggle span small { display: block; }.default-alarm-toggle span b { color: var(--text); font-size: 9px; }.default-alarm-toggle span small { margin-top: 3px; color: var(--muted); font-size: 8px; }.alarm-rule-list { display: grid; gap: 6px; margin-top: 10px; transition: opacity .15s ease; }.alarm-rule-list.disabled { opacity: .38; }.alarm-rule-row { display: grid; grid-template-columns: 145px minmax(0, 1fr); align-items: center; gap: 10px; padding: 9px 10px; border: 1px solid var(--line-soft); border-radius: 8px; background: #090f11; }.alarm-rule-toggle { display: flex; align-items: center; gap: 8px; }.alarm-rule-toggle span b, .alarm-rule-toggle span small { display: block; }.alarm-rule-toggle span b { font-size: 9px; }.alarm-rule-toggle span small { margin-top: 2px; color: var(--muted); font-size: 7px; }.alarm-rule-values { display: grid; grid-template-columns: repeat(auto-fit, minmax(94px, 1fr)); gap: 6px; }.alarm-rule-values label { position: relative; display: grid; gap: 4px; color: var(--muted); font-size: 7px; text-transform: uppercase; letter-spacing: .04em; }.alarm-rule-values input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 6px; padding: 7px 25px 7px 8px; outline: none; background: #05090b; color: var(--text); font: 9px ui-monospace,Consolas,monospace; }.alarm-rule-values input:focus { border-color: #4d8b69; box-shadow: 0 0 0 2px rgba(69,212,131,.08); }.alarm-rule-values label em { position: absolute; right: 7px; bottom: 8px; color: #718089; font-size: 7px; font-style: normal; text-transform: none; }.station-alarm-form > p { margin: 9px 0 0; color: var(--muted); font-size: 8px; line-height: 1.45; }
@media (max-width: 720px) { .alarm-rule-row { grid-template-columns: 1fr; }.station-actions { flex-direction: column; } }
.danger { border: 1px solid #62323a; background: #1b0d10; color: #ff9ba4; }.danger:hover { border-color: #a74752; background: #291015; }.device-row-actions { display: flex; gap: 5px; }.device-row-actions button { padding: 6px 8px; }.configured-devices > div[data-device-row] { grid-template-columns: 8px minmax(65px,.6fr) minmax(110px,1fr) auto auto; }.edit-device-form { grid-column: 1 / -1; padding: 14px 16px; border-top: 1px solid #345c49; border-bottom: 1px solid #345c49; background: #0d1712; }.edit-device-form label, .edit-station-form label { display: grid; gap: 5px; color: var(--muted); font-size: 8px; text-transform: uppercase; letter-spacing: .06em; }.edit-device-form input, .edit-station-form input { min-width: 0; width: 100%; border: 1px solid var(--line); border-radius: 7px; padding: 9px 10px; outline: none; background: #080d0f; color: var(--text); font: inherit; font-size: 10px; }.edit-device-form input:focus, .edit-station-form input:focus { border-color: #4d8b69; box-shadow: 0 0 0 2px rgba(69,212,131,.08); }.edit-device-form > p { margin: 9px 0 0; color: var(--muted); font-size: 8px; }.edit-station-form { padding: 12px; border-bottom: 1px solid var(--line-soft); background: #0d1712; }.destructive-split > span { flex: 1; }
@media (max-width: 900px) { .configured-devices > div[data-device-row] { grid-template-columns: 8px minmax(70px,.7fr) minmax(110px,1fr) auto auto; } }
@media (max-width: 560px) { .configured-devices > div[data-device-row] { grid-template-columns: 8px 1fr auto; }.configured-devices > div[data-device-row] .device-row-actions { grid-column: 3; grid-row: 1 / span 2; flex-direction: column; }.station-actions { grid-column: 3; grid-row: 1 / span 2; }.destructive-split { flex-wrap: wrap; }.destructive-split > span { display: none; } }
.setting-action { width: 100%; margin-top: 11px; padding: 8px 10px; }.setting-action:disabled { opacity: .55; cursor: wait; }