/* 2E0LXY shared "radio spectrum editorial" design system */
:root {
  color-scheme: dark;
  --radio-bg: #050b18;
  --radio-bg-deep: #020712;
  --radio-surface: #091426;
  --radio-surface-2: #0d1a2e;
  --radio-surface-3: #12213a;
  --radio-line: rgba(135, 168, 211, .26);
  --radio-line-strong: rgba(64, 221, 238, .62);
  --radio-text: #f4f1e9;
  --radio-text-soft: #c8d0df;
  --radio-muted: #8f9ab0;
  --radio-cyan: #3fdaeb;
  --radio-cyan-soft: #79e8f2;
  --radio-violet: #9b82f4;
  --radio-amber: #ffbe4b;
  --radio-coral: #ff6b6b;
  --radio-green: #43d899;
  --radio-radius-sm: 8px;
  --radio-radius: 12px;
  --radio-shadow: 0 18px 54px rgba(0, 0, 0, .28);

  /* Generated home/projects bundles use these tokens. */
  --color-neutral-100: #f4f1e9;
  --color-neutral-200: #e4e7ef;
  --color-neutral-300: #c8d0df;
  --color-neutral-400: #aeb8ca;
  --color-neutral-500: #8f9ab0;
  --color-neutral-600: #727f96;
  --color-neutral-700: #536077;
  --color-neutral-800: #2a3850;
  --color-neutral-900: #101d31;
  --color-accent-100: #eafcff;
  --color-accent-200: #c8f7fb;
  --color-accent-300: #93edf4;
  --color-accent-400: #3fdaeb;
  --color-accent-500: #22bacc;
  --color-accent-600: #198fa2;
  --color-accent-700: #176b7a;
  --color-accent-800: #104a58;
  --color-accent-900: #0a2c38;
  --color-accent-2: #9b82f4;
}

html {
  background: var(--radio-bg-deep) !important;
  accent-color: var(--radio-cyan);
  scrollbar-color: #304561 var(--radio-bg-deep);
}

body {
  color: var(--radio-text) !important;
  background-color: var(--radio-bg) !important;
  background-image:
    radial-gradient(circle at 82% -8%, rgba(63, 218, 235, .09), transparent 31rem),
    radial-gradient(circle at 8% 30%, rgba(155, 130, 244, .07), transparent 28rem),
    linear-gradient(180deg, var(--radio-bg) 0%, var(--radio-bg-deep) 100%) !important;
}

body::selection { color: #001016; background: var(--radio-cyan-soft); }

a { text-underline-offset: .2em; }
a:focus-visible,
button:focus-visible,
input:focus-visible,
select:focus-visible,
textarea:focus-visible,
[tabindex]:focus-visible {
  outline: 3px solid var(--radio-amber) !important;
  outline-offset: 3px !important;
  box-shadow: 0 0 0 1px var(--radio-bg-deep) !important;
}

button,
input,
select,
textarea { font: inherit; }

button:not(:disabled),
select:not(:disabled) { cursor: pointer; }

/* Shared top navigation on Home and Projects. */
#global-site-nav {
  border-color: var(--radio-line) !important;
  border-radius: var(--radio-radius) !important;
  background: rgba(5, 13, 27, .94) !important;
  box-shadow: var(--radio-shadow) !important;
}
#global-site-nav ul { gap: 7px !important; }
#global-site-nav a {
  color: var(--radio-text-soft) !important;
  border-color: rgba(135, 168, 211, .23) !important;
  background: linear-gradient(180deg, rgba(14, 30, 50, .94), rgba(7, 18, 33, .98)) !important;
  font-size: 11px !important;
  letter-spacing: .01em;
}
#global-site-nav a:hover,
#global-site-nav a:focus-visible,
#global-site-nav a[aria-current="page"] {
  color: var(--radio-text) !important;
  border-color: var(--radio-line-strong) !important;
  background: linear-gradient(180deg, rgba(18, 49, 67, .98), rgba(8, 28, 42, .98)) !important;
  box-shadow: inset 0 -3px var(--radio-cyan) !important;
}

.radio-reflection {
  border-left-color: var(--radio-violet) !important;
  background: linear-gradient(90deg, rgba(155, 130, 244, .13), rgba(5, 11, 24, 0)) !important;
}
.radio-reflection__label { color: #bcaafa !important; }
.radio-reflection__quote { color: var(--radio-text-soft) !important; }
.radio-reflection__quote::before,
.radio-reflection__quote::after { color: var(--radio-violet) !important; }

/* Generated home/project content: replace one-off purple surfaces consistently. */
[style*="background:#1a1d2b"],
[style*="background: #1a1d2b"],
[style*="background:#12141f"],
[style*="background: #12141f"] {
  background: var(--radio-surface) !important;
}
[style*="border:1px solid var(--color-neutral-800)"] {
  border-color: var(--radio-line) !important;
}
[style*="background:#1f2233"],
[style*="background: #1f2233"] { background: var(--radio-surface-2) !important; }

/* Portal shell. */
#bg-canvas {
  background:
    radial-gradient(circle at 50% 8%, rgba(63, 218, 235, .09), transparent 34%),
    radial-gradient(circle at 82% 40%, rgba(155, 130, 244, .06), transparent 31%),
    linear-gradient(180deg, var(--radio-bg-deep), var(--radio-bg)) !important;
}
.scanline { opacity: .08 !important; }
.station-bar,
.nav-deck,
.sdr-console,
#info-bar,
.modal-content {
  border-color: var(--radio-line) !important;
  background: rgba(7, 18, 34, .95) !important;
  box-shadow: var(--radio-shadow) !important;
  backdrop-filter: none !important;
}
.brand-wave,
.receiver-state,
.clock-cluster .label,
.telemetry-value.accent,
.footer-signoff { color: var(--radio-cyan) !important; }
.status-lamp { color: var(--radio-green) !important; border-color: rgba(67, 216, 153, .4) !important; }
.nav-link {
  color: var(--radio-text-soft) !important;
  border-color: rgba(135, 168, 211, .23) !important;
  background: linear-gradient(180deg, var(--radio-surface-2), #071221) !important;
}
.nav-link:hover,
.nav-link:focus-visible,
.nav-link.active {
  color: var(--radio-text) !important;
  border-color: var(--radio-line-strong) !important;
  background: linear-gradient(180deg, #123147, #091c2d) !important;
}
.nav-link::after { background: var(--radio-cyan) !important; }
.nav-link:hover svg,
.nav-link:focus-visible svg,
.nav-link.active svg { color: var(--radio-cyan) !important; }
.callsign-container { color: var(--radio-text) !important; text-shadow: 0 12px 34px rgba(63, 218, 235, .2) !important; }
.callsign-char:nth-child(3) { color: var(--radio-cyan) !important; }
body.module-active .nav-deck {
  grid-template-columns: repeat(7, minmax(0, 1fr)) !important;
  overflow: hidden !important;
}
body.module-active .nav-link { min-height: 46px !important; white-space: normal !important; }

/* Loaded radio modules and standalone tools. */
.container { color: var(--radio-text); }
.card,
.glass-card,
.psk-panel,
.status-card,
.info-card,
.panel,
.content-card,
.map-card,
.results-card,
.section-card,
.wu-station-card {
  color: var(--radio-text) !important;
  border-color: var(--radio-line) !important;
  border-radius: var(--radio-radius) !important;
  background: linear-gradient(180deg, rgba(13, 28, 49, .96), rgba(7, 18, 34, .98)) !important;
  box-shadow: 0 12px 38px rgba(0, 0, 0, .2) !important;
  backdrop-filter: none !important;
}
.glass-card:hover { transform: none !important; background: var(--radio-surface-2) !important; }
.card-header,
.panel-header,
.section-header {
  color: var(--radio-text) !important;
  border-color: var(--radio-line) !important;
  background: rgba(3, 10, 22, .48) !important;
}
.card-header h2,
.card h2,
.panel h2,
main h1,
main h2 { color: var(--radio-text) !important; }
.header-title {
  color: var(--radio-text) !important;
  font-size: clamp(2.4rem, 7vw, 4.4rem) !important;
  text-shadow: none !important;
}
.header-title::before,
.header-title::after { display: none !important; animation: none !important; }
.header-subtitle,
.label,
.text-gray-300,
.text-gray-400 { color: var(--radio-muted) !important; }
.status-item,
.bg-white\/5,
.bg-gray-800,
.bg-slate-800,
.bg-slate-900 {
  color: var(--radio-text) !important;
  border-color: var(--radio-line) !important;
  background-color: rgba(15, 31, 53, .82) !important;
}
.status-grid { gap: 1px !important; border-color: var(--radio-line) !important; background: var(--radio-line) !important; }
.warning-box,
.error,
.error-message,
.bg-red-900\/20 {
  color: #ffd8d8 !important;
  border-color: var(--radio-coral) !important;
  background: rgba(255, 107, 107, .09) !important;
}

input,
select,
textarea,
.input-field {
  color: var(--radio-text) !important;
  border: 1px solid var(--radio-line) !important;
  border-radius: var(--radio-radius-sm) !important;
  background: #061122 !important;
}
input::placeholder,
textarea::placeholder { color: #758299 !important; opacity: 1; }
button,
.btn,
.f-btn {
  border-radius: var(--radio-radius-sm) !important;
  border-color: var(--radio-line) !important;
}
button:not(:disabled):hover,
.btn:hover,
.f-btn:hover { border-color: var(--radio-cyan) !important; }

table { color: var(--radio-text-soft) !important; border-color: var(--radio-line) !important; }
thead,
th { color: var(--radio-cyan-soft) !important; background: #071325 !important; }
th,
td { border-color: rgba(135, 168, 211, .18) !important; }
tbody tr:nth-child(even) { background: rgba(18, 33, 57, .34) !important; }
tbody tr:hover { background: rgba(63, 218, 235, .08) !important; }

.text-blue-100,
.text-blue-200,
.text-blue-300,
.text-blue-400,
.text-cyan-300,
.text-cyan-400,
.text-teal-300,
.text-teal-400 { color: var(--radio-cyan-soft) !important; }
.text-purple-300,
.text-purple-400,
.text-violet-300,
.text-violet-400 { color: #bcaafa !important; }
.text-yellow-300,
.text-yellow-400,
.text-amber-300,
.text-amber-400 { color: var(--radio-amber) !important; }
.text-red-300,
.text-red-400 { color: #ff9292 !important; }
.text-green-300,
.text-green-400 { color: #72e5b2 !important; }

/* Weather dashboard: data first, atmospheric colour second. */
#sky-canvas { opacity: .14 !important; filter: saturate(.7) hue-rotate(8deg); }
#sky-scrim {
  background: linear-gradient(180deg, rgba(2, 7, 18, .91), rgba(5, 13, 27, .95)) !important;
}
.glass-card {
  border-radius: var(--radio-radius) !important;
  background: rgba(9, 20, 38, .95) !important;
}
header.glass-card { border-top: 3px solid var(--radio-cyan) !important; }
.tab-btn { color: var(--radio-muted) !important; border-radius: 0 !important; }
.tab-active {
  color: var(--radio-text) !important;
  border-bottom-color: var(--radio-cyan) !important;
  background: rgba(63, 218, 235, .07) !important;
}
#theme-btn,
#refresh-btn {
  color: var(--radio-text) !important;
  border: 1px solid var(--radio-line) !important;
  background: var(--radio-surface-3) !important;
  box-shadow: none !important;
}
[data-theme="cyber"],
[data-theme="cyber"] body { background: var(--radio-bg) !important; }
[data-theme="cyber"]::before { display: none !important; }
[data-theme="cyber"] .glass-card { border-color: var(--radio-line) !important; box-shadow: none !important; }
[data-theme="cyber"] .glass-card:nth-child(n) { border-color: var(--radio-line) !important; box-shadow: none !important; }

@media (max-width: 900px) {
  body.module-active .nav-deck { grid-template-columns: repeat(4, minmax(0, 1fr)) !important; }
}
@media (max-width: 600px) {
  body.module-active .nav-deck { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; }
  #global-site-nav a { font-size: 10px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto !important; }
  *, *::before, *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    transition-duration: .01ms !important;
  }
}
