/* Paleta azul de PalControl. Se carga después del estilo base. */
:root {
  --ink: #f2f7ff;
  --muted: #99afd0;
  --bg: #06101f;
  --panel: #0b1729;
  --panel-2: #10213a;
  --line: #1d3659;
  --mint: #4c8dff;
  --cyan: #38bdf8;
  --shadow: 0 24px 80px rgba(1, 7, 18, .42);
}

body {
  background:
    radial-gradient(circle at 76% -18%, rgba(59, 130, 246, .24), transparent 40%),
    radial-gradient(circle at 4% 104%, rgba(14, 165, 233, .10), transparent 32%),
    var(--bg);
}

.brand-mark {
  border-color: rgba(76, 141, 255, .48);
  box-shadow: inset 0 0 22px rgba(76, 141, 255, .14), 0 0 28px rgba(30, 64, 175, .10);
}

.login-shell::before,
.login-shell::after { border-color: rgba(76, 141, 255, .13); }

.login-card { background: linear-gradient(145deg, rgba(16, 33, 58, .97), rgba(6, 16, 31, .99)); }

.password-row input,
.number-wrap,
.text-input,
.select-input {
  background: #071426;
  border-color: #284d7d;
}

.password-row input:focus { box-shadow: 0 0 0 3px rgba(76, 141, 255, .16); }
.secure-note { color: #7f97ba; }
.button.primary { color: #06142a; box-shadow: 0 8px 28px rgba(76, 141, 255, .26); }
.button.ghost { background: rgba(12, 29, 52, .76); }
.sidebar { background: rgba(6, 16, 31, .97); }
.sidebar-brand small { color: #6f87aa; }

.status-dot.online {
  box-shadow: 0 0 0 4px rgba(76, 141, 255, .12), 0 0 15px rgba(76, 141, 255, .55);
}

#category-nav button { color: #8ca4c7; }
#category-nav button span { color: #6687b4; }
#category-nav button.active,
#category-nav button:hover { background: #112540; }

.sidebar-bottom { border-top-color: #172d4c; }
.sidebar-bottom small { color: #58749b; }
.text-button { color: #91a8c8; }
.topbar { background: rgba(6, 16, 31, .89); }
.world-card,
.apply-card { background: linear-gradient(135deg, #102b4d, #08172b 62%); }
.pill { border-color: rgba(76, 141, 255, .34); }

.orb {
  border-color: rgba(76, 141, 255, .30);
  background: radial-gradient(circle, rgba(76, 141, 255, .19), transparent 59%);
}

.orb::before,
.orb::after { border-color: rgba(56, 189, 248, .28); }
.metrics { border-top-color: rgba(125, 171, 235, .20); }
.metrics div { border-right-color: rgba(125, 171, 235, .16); }
.metrics dt,
.last-check { color: #8098ba; }
.preset:hover { border-color: #315f98; background: #10233d; }

.preset.recommended {
  border-color: rgba(76, 141, 255, .43);
  background: linear-gradient(130deg, rgba(25, 64, 121, .78), var(--panel));
}

.preset-icon { background: #142f52; }
.search-box { color: #7291ba; }
.setting-card { background: rgba(11, 23, 41, .86); }
.setting-card.changed { border-color: rgba(76, 141, 255, .55); }
.switch-row { color: #9bb1cf; }
.switch span { background: #263b5b; }
.switch span::before { background: #9aaec7; }

.switch input:checked + span {
  background: rgba(76, 141, 255, .32);
  box-shadow: inset 0 0 0 1px rgba(76, 141, 255, .52);
}

.multi-control label { border-color: #284d7d; color: #91a8c7; }
.multi-control label:has(input:checked) { background: rgba(76, 141, 255, .10); }
.sticky-save { background: rgba(6, 16, 31, .95); }
.toast { background: #102540; }
dialog { background: #0b1b31; }
dialog::backdrop { background: rgba(1, 7, 18, .82); }