/* Theme palettes */
:root {
  /* defaults act as light theme fallback */
  --bg: #f8fafc;
  --fg: #0f172a;
  --muted: #64748b;
  --accent: #2563eb;
  --panel: #ffffff;
  --panel-bg: var(--panel);
  --panel-bg: color-mix(in srgb, var(--panel) 96%, #ffffff 4%);
  --panel-bg-alt: var(--panel);
  --panel-bg-alt: color-mix(in srgb, var(--panel) 90%, #ffffff 10%);
  --fg-contrast: var(--fg);
  --border: #e2e8f0;
  --bg-muted: #f1f5f9; /* subtle surface for callouts */
  --warning: #f59e0b;  /* amber for warnings/clarifications */
  --header-grad-start: #e2e8f0;
  --header-grad-end: #f8fafc;
  /* derived tokens other modules can rely on */
  --surface-card: var(--panel);
  --surface-card: color-mix(in srgb, var(--panel) 94%, #ffffff 6%);
  --surface-soft: var(--panel);
  --surface-soft: color-mix(in srgb, var(--panel) 86%, #ffffff 14%);
  --surface-muted: var(--panel);
  --surface-muted: color-mix(in srgb, var(--panel) 78%, #ffffff 22%);
  --surface-tint: var(--panel-bg);
  --surface-tint: color-mix(in srgb, var(--accent) 12%, var(--panel-bg) 88%);
  --surface-chip: var(--panel);
  --surface-chip: color-mix(in srgb, var(--panel) 82%, #ffffff 18%);
  --surface-chip-strong: var(--panel);
  --surface-chip-strong: color-mix(in srgb, var(--panel) 74%, #ffffff 26%);
  --border-soft: var(--border);
  --border-soft: color-mix(in srgb, var(--border) 75%, transparent 25%);
  --border-strong: var(--border);
  --border-strong: color-mix(in srgb, var(--border) 60%, var(--fg) 40%);
  --primary: var(--accent);
  --text: var(--fg);
  --text-muted: var(--muted);
  --muted-text: var(--muted);
  --success: #22c55e;
  --danger: #ef4444;
  --shadow: #0f172a;
}

.theme-light {
  --bg: #f8fafc;
  --fg: #0f172a;
  --muted: #64748b;
  --accent: #2563eb;   /* blue */
  --panel: #ffffff;
  --border: #e2e8f0;
  --bg-muted: #f1f5f9;
  --warning: #f59e0b;
  --header-grad-start: #e2e8f0;
  --header-grad-end: #f8fafc;
}

.theme-dark {
  --bg: #0b1220;
  --fg: #e6f1ff;
  --muted: #94a3b8;
  --accent: #06b6d4;   /* cyan */
  --panel: #0e1726;
  --border: #1e293b;
  --bg-muted: #0e1726;
  --warning: #f59e0b;
  --header-grad-start: #0a2540;
  --header-grad-end: #0e1726;
  --shadow: #010817;
}

.theme-rose {
  --bg: #fff1f2;
  --fg: #111827;
  --muted: #6b7280;
  --accent: #ec4899;   /* pink */
  --panel: #ffffff;
  --border: #fecdd3;
  --bg-muted: #ffe4e6;
  --warning: #b45309;
  --header-grad-start: #ffe4e6;
  --header-grad-end: #fff1f2;
}

.theme-forest {
  --bg: #f1f5f3;
  --fg: #0f172a;
  --muted: #466156;
  --accent: #16a34a;   /* green */
  --panel: #ffffff;
  --border: #dbe7e1;
  --bg-muted: #e7f3ec;
  --warning: #b45309;
  --header-grad-start: #e7f3ec;
  --header-grad-end: #f1f5f3;
}

/* Extra themes */
.theme-grape {
  --bg: #1a1027;
  --fg: #f5ecff;
  --muted: #c4b5fd;
  --accent: #8b5cf6; /* violet */
  --panel: #231637;
  --border: #3b2a55;
  --bg-muted: #231637;
  --warning: #f59e0b;
  --header-grad-start: #2a1744;
  --header-grad-end: #1a1027;
}

.theme-amber {
  --bg: #fffbeb;
  --fg: #1f2937;
  --muted: #6b7280;
  --accent: #f59e0b; /* amber */
  --panel: #ffffff;
  --border: #fde68a;
  --bg-muted: #fef3c7;
  --warning: #b45309;
  --header-grad-start: #fef3c7;
  --header-grad-end: #fffbeb;
}

.theme-lavender {
  --bg: #f5f3ff;
  --fg: #1f2937;
  --muted: #6b7280;
  --accent: #7c3aed; /* purple */
  --panel: #ffffff;
  --border: #ddd6fe;
  --bg-muted: #ede9fe;
  --warning: #b45309;
  --header-grad-start: #ede9fe;
  --header-grad-end: #f5f3ff;
}

.theme-aurora {
  --bg: #040b16;
  --fg: #e8f7ff;
  --muted: #7dd3fc;
  --accent: #38bdf8; /* aqua */
  --panel: #081427;
  --border: #123047;
  --bg-muted: #0b1f34;
  --warning: #f59e0b;
  --header-grad-start: #10324b;
  --header-grad-end: #040b16;
}

.theme-monochrome {
  --bg: #0f1114;
  --fg: #f5f6f8;
  --muted: #94a3b8;
  --accent: #38bdf8; /* electric blue */
  --panel: #15181d;
  --border: #1f242b;
  --bg-muted: #1a1d24;
  --warning: #f59e0b;
  --header-grad-start: #181c22;
  --header-grad-end: #0f1114;
}

.theme-glass {
  --bg: #f5f7fa;
  --fg: #111827;
  --muted: #64748b;
  --accent: #5eead4; /* frosted aqua */
  --panel: rgba(255, 255, 255, 0.78);
  --border: rgba(148, 163, 184, 0.28);
  --bg-muted: rgba(236, 242, 255, 0.6);
  --warning: #f59e0b;
  --header-grad-start: rgba(255,255,255,0.85);
  --header-grad-end: rgba(226,232,240,0.65);
}

.theme-nordic {
  --bg: #f4eee4;
  --fg: #1a2539;
  --muted: #747b88;
  --accent: #1d4ed8; /* nordic blue */
  --panel: #ffffff;
  --border: #d6cfc4;
  --bg-muted: #ece4d8;
  --warning: #f59e0b;
  --header-grad-start: #d9cebf;
  --header-grad-end: #f4eee4;
}

.theme-retrowave {
  --bg: #120420;
  --fg: #f8f5ff;
  --muted: #fca5ff;
  --accent: #ff4d8d; /* neon magenta */
  --panel: #1d0834;
  --border: #34144f;
  --bg-muted: #200a3d;
  --warning: #f59e0b;
  --header-grad-start: #341351;
  --header-grad-end: #120420;
}

/* Shared panel headings */
.panel-head {
  display: flex;
  flex-direction: column;
  gap: 4px;
  margin-bottom: 12px;
}

/* Watcher console refinements */
.watcher-connect-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  align-items: end;
}

.watcher-room-hint {
  font-size: 12px;
  grid-column: 1 / -1;
}

.watcher-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  font-weight: 600;
}

.watcher-field-label {
  font-size: 12px;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  color: var(--muted-text, var(--muted));
}

.watcher-input {
  min-height: 36px;
  min-width: 160px;
  width: 100%;
  box-sizing: border-box;
}

.watcher-input-wide {
  min-width: 220px;
}

.watcher-connect-actions {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.watcher-connection-status {
  grid-column: 1 / -1;
  font-size: 13px;
}

.watcher-peers {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  padding: 8px 4px;
}

.watcher-peers button {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 8px;
  min-width: 180px;
}

.watcher-detail-head {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

#watchers-peer-title {
  font-size: 1.1rem;
}

#watchers-summary {
  font-size: 13px;
}

.watcher-detail-actions {
  margin-left: auto;
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  align-items: center;
}

.watcher-detail-actions .link-btn {
  padding: 0;
}

.watcher-scope-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(220px, 1fr));
  gap: 12px;
  margin-top: 8px;
}

.watcher-scope-card {
  border: 1px solid var(--border-soft, var(--border));
  border-radius: 12px;
  background: var(--surface-chip);
  padding: 12px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.watcher-scope-title h4 {
  margin: 0;
  font-size: 1rem;
}

.watcher-scope-title p {
  margin: 0;
  font-size: 13px;
}

.watcher-scope-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.watcher-list-wrapper {
  margin-top: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.watcher-list-head {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
}

.watcher-select-all {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-weight: 600;
  font-size: 13px;
}

.watcher-list-hint {
  font-size: 13px;
}

.watcher-list {
  display: flex;
  flex-direction: column;
  gap: 12px;
  max-height: 520px;
  overflow-y: auto;
  padding-right: 4px;
  scrollbar-gutter: stable both-edges;
}

.watcher-empty {
  padding: 24px;
  text-align: center;
  border: 1px dashed var(--border);
  border-radius: 12px;
  background: var(--surface-muted);
}

.watcher-card {
  border: 1px solid var(--border-soft, var(--border));
  border-radius: 14px;
  background: var(--surface-soft);
  padding: 14px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  box-shadow: 0 1px 2px color-mix(in srgb, var(--shadow, #000) 8%, transparent);
}

.watcher-card-header {
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.watcher-checkbox-inline {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 32px;
  height: 32px;
  border-radius: 8px;
  background: var(--surface-chip);
  flex: 0 0 auto;
}

.watcher-card-title {
  display: flex;
  flex-direction: column;
  gap: 6px;
  flex: 1;
}

.watcher-name {
  font-size: 1rem;
  font-weight: 600;
  word-break: break-word;
}

.watcher-badges {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.watcher-status {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.04em;
  text-transform: uppercase;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--surface-chip);
  color: var(--fg);
}

.watcher-status.is-running {
  background: color-mix(in srgb, var(--success, #22c55e) 20%, transparent);
  color: var(--success, #22c55e);
}

.watcher-status.is-disabled {
  background: color-mix(in srgb, var(--danger, #ef4444) 18%, transparent);
  color: var(--danger, #ef4444);
}

.watcher-status.is-stopped {
  background: var(--surface-chip-strong);
  color: var(--muted-text, var(--muted));
}

.watcher-status.is-protected {
  border: 1px dashed currentColor;
}

.watcher-tag {
  font-size: 12px;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--bg-muted);
  color: var(--muted-text, var(--muted));
}

.watcher-meta-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(140px, 1fr));
  gap: 10px;
  margin: 0;
}

.watcher-meta-item {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 8px;
  border-radius: 8px;
  background: var(--surface-chip);
}

.watcher-meta-item dt {
  font-size: 11px;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--muted-text, var(--muted));
  margin: 0;
}

.watcher-meta-item dd {
  margin: 0;
  font-weight: 600;
  font-size: 14px;
}

.text-positive {
  color: var(--success, #22c55e);
}

.text-warning {
  color: var(--warning, #f59e0b);
}

.text-muted {
  color: var(--text-muted, var(--muted));
}

.watcher-log-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 8px;
}

.watcher-log-head a.secondary {
  text-decoration: none;
  padding: 6px 12px;
}

.watcher-log {
  background: var(--bg-muted);
  border: 1px solid var(--border);
  padding: 12px;
  min-height: 200px;
  max-height: 320px;
  overflow-y: auto;
  font-family: var(--font-mono, monospace);
  font-size: 13px;
}

.theme-sunset {
  --bg: #1b1520;
  --fg: #fde68a;
  --muted: #fca5a5;
  --accent: #fb7185; /* rose */
  --panel: #241826;
  --border: #3f2a3f;
  --bg-muted: #241826;
  --warning: #f59e0b;
  --header-grad-start: #301a2b;
  --header-grad-end: #1b1520;
}

.theme-cyberpunk {
  --bg: #050014;
  --fg: #f4f4ff;
  --muted: #a855f7;
  --accent: #22d3ee; /* neon cyan */
  --panel: #0c0324;
  --border: #2e1a4f;
  --bg-muted: #12082f;
  --warning: #f59e0b;
  --header-grad-start: #26104d;
  --header-grad-end: #050014;
}

/* Avoid excessive page height causing overscroll past bottom */
html, body {
  min-height: 100%;
  height: auto;
  overflow-x: hidden;
  overflow-y: auto;
  /* Prevent rubber-band overscroll past bottom and scroll chaining */
  overscroll-behavior: none;
}
body {
  margin: 0;
  font-family: -apple-system, system-ui, Segoe UI, Roboto, Helvetica, Arial, sans-serif;
  background: var(--bg);
  color: var(--fg);
}
header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  overflow: visible; /* allow dropdowns to render outside header */
  gap: 16px;
  padding: 18px 22px;
  border-bottom: 1px solid var(--border);
  background: linear-gradient(90deg, var(--header-grad-start) 0%, var(--header-grad-end) 100%);
}
header a { color: var(--fg); text-decoration: none; }
header h1 { margin: 0; }
header h1 a { display: inline-flex; align-items: center; height: auto; line-height: 1.2; }
header nav { display: flex; align-items: center; gap: 16px; flex: 1 1 auto; white-space: nowrap; min-width: 0; }
.nav-left { display: flex; align-items: center; gap: 14px; min-width: 0; flex: 1 1 auto; overflow: visible; }
.nav-right { display: flex; align-items: center; gap: 12px; margin-left: auto; flex: 0 0 auto; white-space: nowrap; }
header nav a { margin-left: 0; color: var(--muted); }
header nav a:hover { color: var(--fg); }
/* Active state: underline only for left-side module links */
.module-inline a.active { color: var(--fg); position: relative; }
.module-inline a.active::after {
  content: '';
  position: absolute;
  left: 6px; right: 6px; bottom: 0;
  height: 3px; background: var(--accent); border-radius: 2px;
}
/* Right-side links and admin links use a pill highlight with a slim accent bar instead of underline */
.nav-right > a.active,
.admin-item > a.active {
  color: var(--fg);
  background: rgba(148,163,184,0.15);
  box-shadow: inset 3px 0 0 0 var(--accent);
}
/* Verity 340B: make source selector wider and readable */
#source-select {
  max-width: 95vw;
  font-size: 13px;
}
header .icon-btn {
  background: transparent;
  color: var(--fg);
  border: 1px solid var(--border);
  border-radius: 999px;
  width: 36px; height: 36px;
  display: inline-flex; align-items: center; justify-content: center;
  cursor: pointer; font-size: 16px;
}
header .icon-btn:hover { border-color: #94a3b8; }
.menu-wrap { position: relative; display: inline-block; }
.module-inline { display: flex; gap: 16px; }
.module-inline a { margin-left: 0; }
.module-menu a { margin-left: 0; }
#menu-toggle { display: none; margin-right: 0; }
.menu-wrap.has-overflow #menu-toggle { display: inline-flex; }
/* Menu is hidden by default; toggled via body.menu-open */
.module-menu {
  display: none;
  position: absolute;
  right: 0;
  top: calc(100% + 8px);
  flex-direction: column;
  gap: 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  z-index: 1000;
  min-width: 220px;
  -webkit-backdrop-filter: saturate(1.1) blur(8px);
  backdrop-filter: saturate(1.1) blur(8px);
}
body.menu-open .module-menu { display: flex; }
/* Smooth underline reveal for left nav links */
.module-inline a { position: relative; }
.module-inline a::after {
  content: '';
  position: absolute;
  left: 6px; right: 6px; bottom: 0;
  height: 3px; background: var(--accent); border-radius: 2px;
  transform: scaleX(0);
  transform-origin: left;
  transition: transform .14s ease;
}
.module-inline a:hover::after { transform: scaleX(1); }
.module-inline a.active::after { transform: scaleX(1); }
/* Hidden by default; shown on mobile */
.menu-mobile-only {
  display: none;
}
/* Active item inside dropdown */
.module-menu a[aria-current="page"] {
  position: relative;
  background: rgba(148,163,184,0.12);
  box-shadow: inset 3px 0 0 0 var(--accent);
}
/* Remove bottom underline bar style if any bleeds into menu items */
.module-menu a[aria-current="page"]::after { content: none !important; }

/* Responsive hamburger behavior */
@media (max-width: 1100px) {
  header { position: relative; }
}

/* Force simple mobile header: hide inline links, show hamburger */
@media (max-width: 700px) {
  #module-inline { display: none !important; }
  .menu-wrap #menu-toggle { display: inline-flex !important; }
  .nav-left { overflow: visible; }
  .nav-right { display: none; }
  .menu-mobile-only { display: block; }
}

/* Reserved: nav-tight styles removed to keep admin links fixed to the right on desktop */

/* Menu polish */
#menu-toggle { width: 40px; height: 40px; }
.module-menu a {
  margin-left: 0;
  text-decoration: none;
  color: var(--fg);
  padding: 8px 10px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.2;
}
.module-menu a:hover {
  background: rgba(148,163,184,0.15);
}

/* Admin inline links match left spacing */
.admin-links { display: inline-flex; align-items: center; gap: 16px; flex-wrap: nowrap; }
.admin-inline { display: inline-flex; align-items: center; gap: 16px; flex-wrap: nowrap; }
.admin-item { display: inline-flex; align-items: center; gap: 6px; }
.admin-item > a { display: inline-flex; align-items: center; height: 36px; padding: 0 8px; border-radius: 6px; color: var(--muted); text-decoration: none; }
.admin-item > a:hover { background: rgba(148,163,184,0.15); color: var(--fg); }
.admin-item form { display: inline-flex; align-items: center; margin: 0; }
.admin-item form button.link-btn { height: 36px; padding: 0 8px; border-radius: 6px; color: var(--muted); }
.admin-item form button.link-btn:hover,
.admin-item form button.link-btn:focus { background: rgba(148,163,184,0.15); color: var(--fg); outline: none; }

/* Admin overflow dropdown */
.admin-menu-wrap { position: relative; display: inline-flex; align-items: center; }
.admin-menu { display: none; position: absolute; right: 0; top: calc(100% + 8px); flex-direction: column; gap: 8px; background: var(--panel); border: 1px solid var(--border); border-radius: 8px; padding: 10px 12px; box-shadow: 0 8px 24px rgba(0,0,0,0.12); z-index: 1000; min-width: 220px; -webkit-backdrop-filter: saturate(1.1) blur(8px); backdrop-filter: saturate(1.1) blur(8px); }
.admin-menu .admin-item { padding: 0; }
.admin-menu .admin-item > a { height: auto; padding: 8px 10px; border-radius: 8px; color: var(--fg); }
.admin-menu .admin-item > a:hover { background: rgba(148,163,184,0.15); }
.admin-menu .admin-item form { width: 100%; }
.admin-menu .admin-item form button.link-btn { width: 100%; justify-content: flex-start; padding: 8px 10px; height: auto; color: var(--fg); border-radius: 8px; }
.admin-menu .admin-item form button.link-btn:hover,
.admin-menu .admin-item form button.link-btn:focus { background: rgba(148,163,184,0.15); color: var(--fg); }
body.admin-menu-open .admin-menu { display: flex; }
.admin-menu-wrap.has-overflow { display: inline-flex; }

/* Inline module links look tidy and consistent */
/* Keep inline module links from sliding under the hamburger; JS will move overflow into the menu */
.module-inline { display: flex; gap: 16px; flex-wrap: nowrap; flex: 1 1 auto; min-width: 0; overflow: visible; }
.menu-wrap { flex: 0 0 auto; }
.module-inline a {
  padding: 6px 8px;
  border-radius: 6px;
  text-decoration: none;
  color: var(--muted);
  white-space: nowrap;
}
.module-inline a:hover { background: rgba(148,163,184,0.15); color: var(--fg); }
body.menu-open .module-menu {
  animation: menuPop 140ms ease-out;
  transform-origin: top right;
}
@keyframes menuPop {
  0% { opacity: 0; transform: translateY(-4px) scale(0.98); }
  100% { opacity: 1; transform: translateY(0) scale(1); }
}

/* Normalize header item alignment and heights */
.module-inline a, .nav-right > a {
  display: inline-flex;
  align-items: center;
  height: 36px;
  padding: 0 8px;
  border-radius: 6px;
}
header nav label {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  height: 36px;
  margin: 0;              /* override global label margin */
  font-weight: 500;       /* slightly lighter than 600 */
}
header nav select#theme-select {
  display: inline-block;
  width: auto;
  height: 36px;
  padding: 0 8px;
  line-height: 36px;
  margin: 0;
  vertical-align: middle;
}
header .icon-btn { width: 36px; height: 36px; }
.pill-btn {
  background: transparent;
  color: var(--fg);
  border: 1px solid rgba(148,163,184,0.55);
  border-radius: 999px;
  height: 36px;
  padding: 0 10px;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  cursor: pointer;
  position: relative; /* allow aura ring */
}
.pill-btn:hover { border-color: #94a3b8; background: rgba(148,163,184,0.08); }
.pill-btn.active { background: transparent; border-color: rgba(148,163,184,0.65); }
.pill-btn.active::after {
  content: '';
  position: absolute;
  inset: -2px;
  border-radius: 999px;
  border: 2px solid var(--accent);
  opacity: .35;
  pointer-events: none;
  transition: opacity .14s ease;
}
.pill-btn.active:hover::after,
.pill-btn.active:focus-visible::after { opacity: .55; }
.pill-btn.active:hover, .pill-btn.active:focus-visible { background: rgba(148,163,184,0.08); }
.pill-btn[aria-expanded="true"] { background: rgba(148,163,184,0.12); }
.pill-btn .chev { opacity: 0.8; font-size: 12px; }
.pill-btn .chev { transition: transform .14s ease; }
.pill-btn[aria-expanded="true"] .chev { transform: rotate(180deg); }
.tools-wrap { position: relative; display: inline-flex; align-items: center; }
.pill-btn, .pill-btn.active { transition: border-color .14s ease, background .14s ease; }
body.theme-dark .pill-btn { border-color: rgba(71,85,105,0.65); }
body.theme-dark .pill-btn.active { border-color: rgba(94,106,133,0.75); }

.tools-menu {
  display: none;
  position: absolute;
  left: 0;
  top: 100%;
  flex-direction: column;
  gap: 8px;
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  z-index: 1000;
  min-width: 220px;
  -webkit-backdrop-filter: saturate(1.1) blur(8px);
  backdrop-filter: saturate(1.1) blur(8px);
  opacity: 0;
  transform: translateY(4px) scale(0.98);
  transition: opacity .14s ease, transform .14s ease;
  pointer-events: none;
}
.tools-menu a {
  margin-left: 0;
  text-decoration: none;
  color: var(--fg);
  padding: 8px 10px;
  border-radius: 8px;
  display: flex;
  align-items: center;
  gap: 10px;
  line-height: 1.2;
}
.tools-menu a:hover { background: rgba(148,163,184,0.15); }
.tools-wrap.open .tools-menu { display: flex; opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
.pill-btn[aria-expanded="true"] + .tools-menu { display: flex; opacity: 1; transform: translateY(0) scale(1); pointer-events: auto; }
/* Active item inside tools menu */
.tools-menu a[aria-current="page"] {
  position: relative;
  background: rgba(148,163,184,0.12);
  box-shadow: none; /* no leading accent bar/check inside Tools menu */
}
/* Ensure no leading check/icon for active tools item */
.tools-menu a[aria-current="page"]::before { content: none !important; }
.tools-menu a[aria-current="page"] .check { display: none !important; }
.chip {
  display: inline-block;
  border: 1px solid var(--border);
  border-radius: 999px;
  padding: 3px 7px;
  margin-left: 6px;
  font-size: 12px;
  color: var(--fg);
  background: rgba(148,163,184,0.15);
}
/* Compact chip variant and inline layout helper */
.chip-sm { padding: 2px 6px; font-size: 11px; margin-left: 6px; }
.chips-inline { display: inline-flex; align-items: center; gap: 6px; flex-wrap: wrap; }
/* Inside inline chip rows, don't add the global left margin on each chip */
.chips-inline .chip, .chips-inline .chip-sm { margin-left: 0; }
/* Larger chip variant + no-wrap helper for longer labels */
.chip-lg { font-size: 13px; padding: 5px 10px; }
.chip-nowrap { white-space: nowrap; }
/* Status chip variants */
.chip-ok { background: rgba(16,185,129,0.15); border-color: #10b981; }
.chip-bad { background: rgba(239,68,68,0.15); border-color: #ef4444; }
/* Accent variant for emphasis */
.chip-accent {
  color: var(--fg);
  background: transparent;              /* clean by default */
  border-color: var(--border);
  box-shadow: inset 2px 0 0 0 var(--accent); /* slim accent bar without changing layout */
  padding-left: 10px;                    /* breathing room after the bar */
}
.chip-accent:hover, .chip-accent:focus-visible {
  background: rgba(148,163,184,0.12);   /* subtle tint on hover/focus */
}

/* Strong on-state for toggle chips */
.chip-on {
  background: var(--accent) !important;
  color: #ffffff !important;
  border-color: var(--accent) !important;
  box-shadow: none !important;
}

/* Accessible focus outlines */
a:focus-visible, button:focus-visible, select:focus-visible, .icon-btn:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: 2px;
}

.banner { display: flex; align-items: center; gap: 10px; padding: 8px 20px; border-bottom: 1px solid var(--border); font-size: 13px; }
.banner.public { background: rgba(16,185,129,0.08); }
.banner.local { background: rgba(148,163,184,0.08); color: var(--muted); }
.banner a { color: var(--fg); text-decoration: underline; }
.copy-btn { background: transparent; color: var(--fg); border: 1px solid var(--border); padding: 6px 10px; border-radius: 6px; cursor: pointer; font-size: 12px; }
.copy-btn:hover { border-color: #94a3b8; }

/* Safety: prevent stray selects from appearing under charts section */
#charts-section > select { display: none !important; }

main { max-width: 1100px; margin: 28px auto; padding: 0 20px; }
/* Contain scroll within main content to avoid page bounce */
main { overscroll-behavior: contain; }

.panel { background: var(--panel); padding: 18px; border: 1px solid var(--border); border-radius: 12px; margin-bottom: 22px; box-shadow: 0 2px 12px rgba(0,0,0,0.08); }

/* Home dashboard */
.home-hero {
  position: relative;
  display: grid;
  gap: 22px;
  margin-top: 26px;
  overflow: hidden;
}
.home-hero::before {
  content: "";
  position: absolute;
  inset: -40% -24% 40% 52%;
  background: radial-gradient(ellipse at top left, color-mix(in srgb, var(--accent) 45%, transparent) 0%, transparent 65%);
  opacity: 0.6;
  pointer-events: none;
}
.home-hero > * { position: relative; }
.home-hero-main h2 {
  margin: 0;
  font-size: 26px;
  line-height: 1.2;
  display: flex;
  align-items: center;
  gap: 8px;
  flex-wrap: wrap;
}
.home-hero-main p {
  margin: 10px 0 0;
  font-size: 15px;
  color: color-mix(in srgb, var(--fg) 55%, var(--muted) 45%);
  max-width: 60ch;
}
.home-hero-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin-top: 18px;
}
.home-hero-topics {
  background: var(--bg-muted);
  border: 1px dashed var(--border);
  background: color-mix(in srgb, var(--accent) 10%, transparent 90%);
  border-color: color-mix(in srgb, var(--accent) 45%, var(--border) 55%);
  border-radius: 12px;
  padding: 18px;
  backdrop-filter: blur(8px);
}
.home-hero-topics h3 { margin: 0 0 12px; font-size: 16px; }
.home-hero-topics .chips-inline { gap: 10px; }
.home-admin-controls { border: 1px solid var(--border); border-radius: 10px; padding: 12px 14px; background: var(--bg-muted); }
.home-admin-controls summary { cursor: pointer; font-weight: 600; display: inline-flex; align-items: center; gap: 8px; list-style: none; }
.home-admin-controls summary::-webkit-details-marker { display: none; }
.home-admin-controls[open] { background: var(--panel); box-shadow: 0 8px 20px rgba(0,0,0,0.08); }
.home-admin-controls-body { margin-top: 12px; }
.home-admin-footer { margin-top: 28px; }
.module-groups { display: flex; flex-direction: column; gap: 26px; margin-top: 32px; }
.module-group {
  --group-accent: var(--accent);
  position: relative;
  margin-bottom: 0;
  padding: 24px;
  border-radius: 16px;
  overflow: hidden;
}
.module-group::before {
  content: "";
  position: absolute;
  inset: -50% 55% 35% -35%;
  background: radial-gradient(ellipse at top, color-mix(in srgb, var(--group-accent) 35%, transparent) 0%, transparent 70%);
  pointer-events: none;
  opacity: 0.55;
}
.module-group > * { position: relative; }
.module-group-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 18px;
  margin-bottom: 20px;
}
.module-group-title { display: flex; flex-direction: column; gap: 6px; }
.module-group-kicker {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.12em;
  text-transform: uppercase;
  color: var(--muted);
  color: color-mix(in srgb, var(--muted) 80%, var(--fg) 20%);
}
.module-group-header h2 { margin: 0; font-size: 22px; }
.module-group-header p { margin: 4px 0 0; font-size: 14px; max-width: 60ch; }
.module-group-count {
  background: var(--bg-muted);
  color: var(--fg);
  background: color-mix(in srgb, var(--group-accent) 18%, transparent 82%);
  border-color: transparent;
  color: color-mix(in srgb, var(--group-accent) 60%, var(--fg) 40%);
  white-space: nowrap;
}
.module-grid {
  display: grid;
  gap: 18px;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
}
.module-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 14px;
  height: 100%;
  padding: 18px;
  border: 1px solid var(--border);
  border-color: color-mix(in srgb, var(--group-accent) 14%, var(--border) 86%);
  border-radius: 14px;
  text-decoration: none;
  color: var(--fg);
  background: var(--bg);
  background: color-mix(in srgb, var(--panel) 82%, var(--bg) 18%);
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease;
}
.module-card-body {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px;
}
.module-card-icon {
  flex: none;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  font-weight: 600;
  font-size: 18px;
  color: var(--accent);
  background: rgba(148, 163, 184, 0.16);
  color: color-mix(in srgb, var(--group-accent) 70%, #0f172a 30%);
  background: color-mix(in srgb, var(--group-accent) 18%, transparent 82%);
  text-transform: uppercase;
  letter-spacing: 0.04em;
}
.module-card-content { flex: 1; display: flex; flex-direction: column; gap: 8px; }
.module-card-heading {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
}
.module-card-heading h3 { margin: 0; font-size: 18px; }
.module-card-description {
  margin: 0;
  font-size: 14px;
  color: var(--muted);
  color: color-mix(in srgb, var(--muted) 85%, var(--fg) 15%);
  line-height: 1.5;
}
.module-card-arrow {
  flex: none;
  align-self: center;
  font-size: 18px;
  color: var(--muted);
  color: color-mix(in srgb, var(--fg) 35%, transparent 65%);
  transition: transform .18s ease, color .18s ease;
}
.module-card:hover, .module-card:focus-visible {
  border-color: color-mix(in srgb, var(--group-accent) 55%, var(--border) 45%);
  box-shadow: 0 18px 40px rgba(15, 23, 42, 0.18);
  transform: translateY(-4px);
}
.module-card:hover .module-card-arrow,
.module-card:focus-visible .module-card-arrow {
  transform: translateX(4px);
  color: var(--group-accent);
}
.module-card:focus-visible { outline: none; }

@media (min-width: 820px) {
  .home-hero { grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr); align-items: start; }
}

.module-group-tools { --group-accent: #2563eb; }
.module-group-infosheets { --group-accent: #16a34a; }
.module-group-reports { --group-accent: #f97316; }
.module-group-operations { --group-accent: #8b5cf6; }
.module-group-admin_ops { --group-accent: #0ea5e9; }
.module-group-admin_insights { --group-accent: #ec4899; }

label { display: block; margin-top: 14px; font-weight: 600; }
textarea, select, input[type="text"], input[type="password"] {
  display: block;            /* ensure width applies consistently */
  box-sizing: border-box;    /* include padding/border in width */
  width: 100%;
  background: var(--bg);
  color: var(--fg);
  border: 1px solid var(--border);
  border-radius: 8px;
  padding: 10px 12px;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-size: 14px;
}
/* --- PDF Tools Dropzone --- */
.dropzone { border: 2px dashed var(--border); border-radius: 10px; padding: 24px; text-align: center; background: var(--bg-muted); transition: background .15s, border-color .15s; cursor: pointer; }
.dropzone.highlight { background: var(--bg); border-color: var(--accent); }
.file-list { list-style: none; margin: 8px 0 0 0; padding: 0; }
.file-list li { display: flex; align-items: center; justify-content: space-between; padding: 6px 8px; border: 1px solid var(--border); border-radius: 8px; margin-top: 6px; background: var(--panel); }
.file-list .left { display:flex; align-items:center; gap:8px; overflow:hidden; }
.file-list .name { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.file-list .meta { font-size: 12px; opacity: .8; margin-left: 8px; }
.file-list .actions { display:flex; align-items:center; gap:8px; }
.progress { width: 140px; height: 6px; background: var(--border); border-radius: 999px; overflow: hidden; }
.progress > span { display:block; height:100%; width:0%; background: var(--accent); transition: width .15s; }
.file-list .cancel { background: transparent; color: var(--fg); border: 1px solid var(--border); }
.file-list .cancel:hover { border-color: #ef4444; color: #ef4444; }
.visually-hidden { position: absolute !important; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0, 0, 1px, 1px); white-space: nowrap; border: 0; }
.spinner { width: 16px; height: 16px; border: 2px solid var(--border); border-top-color: var(--accent); border-radius: 50%; display: inline-block; animation: spin 0.8s linear infinite; }
@keyframes spin { to { transform: rotate(360deg); } }
/* Ensure elements with the HTML hidden attribute are actually hidden */
.spinner[hidden], [hidden] { display: none !important; }
/* Comfortable spacing for forms */
textarea { margin-top: 6px; margin-bottom: 14px; resize: none; }
.actions { margin-top: 14px; margin-bottom: 14px; }
.char-count { text-align: right; font-size: 12px; color: var(--muted); margin-top: 4px; }
textarea:focus, select:focus, input[type="text"]:focus { outline: none; border-color: #2dd4bf; box-shadow: 0 0 0 3px rgba(45,212,191,0.15); }
input[type="file"] { margin-right: 10px; }
button, .button { background: var(--accent); color: #ffffff; border: none; padding: 10px 14px; border-radius: 8px; cursor: pointer; font-weight: 600; }
button:hover, .button:hover { filter: brightness(0.97); }
button.secondary, .button.secondary { background: transparent; color: var(--fg); border: 1px solid var(--border); }
button.secondary:hover, .button.secondary:hover { border-color: #334155; }
button, .button { transition: filter .15s ease, border-color .15s ease, transform .15s ease; }
.button { display: inline-flex; align-items: center; justify-content: center; gap: 6px; text-decoration: none; }
/* Disabled button state */
button[disabled], .btn[disabled] {
  opacity: 0.5;
  cursor: not-allowed;
  filter: none;
}

/* Global Combobox Styles (shared across modules) */
/* Menu is rendered as an overlay to avoid clipping within scroll containers */
.combo-menu, .ddi-menu {
  position: fixed; /* overlay appended to body */
  background: var(--panel);
  border: 1px solid var(--border);
  border-radius: 8px;
  box-shadow: 0 8px 24px rgba(0,0,0,0.12);
  max-height: 260px;
  max-width: 96vw; /* keep within mobile viewport */
  overflow: auto;
  z-index: 2000;
  padding: 4px 0;
}
.combo-item, .ddi-item { padding: 8px 10px; cursor: pointer; }
.combo-item:hover, .combo-item:focus, .combo-item.active,
.ddi-item:hover, .ddi-item:focus, .ddi-item.active { background: rgba(148,163,184,0.15); outline: none; }

/* Invalid input state used by combobox validation */
.input-invalid {
  border-color: #ef4444 !important;
  box-shadow: 0 0 0 3px rgba(239,68,68,0.15) !important;
}
.error-text { color: #ef4444; }

.message { color: var(--accent); margin-top: 10px; }
.hint { color: var(--muted); font-size: 13px; margin-top: 6px; }



.table-wrap {
  overflow: auto;
  max-height: 60vh;
  border: 1px solid var(--border);
  border-radius: 8px;
  /* Keep wheel/trackpad hits from bubbling to the page */
  overscroll-behavior: contain;
}
table { width: 100%; border-collapse: collapse; }
th, td { border-bottom: 1px solid var(--border); padding: 8px 10px; text-align: left; font-size: 13px; }
th { position: sticky; top: 0; background: var(--panel); }

/* Charity table: stabilize widths and keep inputs visible */
table.table { table-layout: fixed; }
table.table th { white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* Percentage-based widths to avoid clipping; sums to 100% */
table.table col.col-drug   { width: 28%; }
table.table col.col-dose   { width: 6%; }
table.table col.col-sig    { width: 13%; }
table.table col.col-sched  { width: 9%; }
table.table col.col-days   { width: 7%; }
table.table col.col-mnem   { width: 13%; }
table.table col.col-qty    { width: 6%; }
table.table col.col-unit   { width: 8%; }
table.table col.col-total  { width: 7%; }
/* Ensure remove column always has room for the icon button */
table.table col.col-remove { width: 56px; }
/* Let numeric/text cells with static content truncate gracefully */
table.table td.mnemonic,
table.table td.qty,
table.table td.unit_cost,
table.table td.total_cost { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
/* Form controls in table cells fill available space without overflow */
table.table td input[type="text"],
table.table td input[type="number"],
table.table td select { width: 100%; min-width: 0; max-width: 100%; box-sizing: border-box; }

/* Barcode/Report tables: prevent overlap and keep cells readable */
#report-table { table-layout: fixed; }
#report-table th, #report-table td { overflow: hidden; text-overflow: clip; }
#report-table th { white-space: normal; }
#report-table td { white-space: normal; overflow-wrap: anywhere; }
#report-table td[data-col="medication"] { max-width: 40ch; }
#report-table td[data-col="route"],
#report-table td[data-col="location"],
#report-table td[data-col="nurse"] { max-width: 20ch; }
#report-table td[data-col="med_scan"],
#report-table td[data-col="band_scan"],
#report-table td[data-col="given"],
#report-table td[data-col="compliant"] { text-align: right; }
/* Suggest widths so fixed layout distributes space sanely */
#report-table th[data-col="documentation_date"] { width: 12%; }
#report-table th[data-col="location"]          { width: 16%; }
#report-table th[data-col="nurse"]             { width: 18%; }
#report-table th[data-col="route"]             { width: 10%; }
#report-table th[data-col="medication"]        { width: 30%; }
#report-table th[data-col="med_scan"],
#report-table th[data-col="band_scan"],
#report-table th[data-col="given"],
#report-table th[data-col="compliant"]         { width: 3.5%; text-align: right; }

/* Rows/page slider labels: align evenly under the track */
.pslider-wrap { position: relative; padding: 0 10px; }
.pslider-labels { display: flex; justify-content: space-between; font-size: 12px; color: var(--muted); margin-top: 4px; padding: 0 2px; }
.pslider-labels span[aria-current="true"] { color: var(--fg); font-weight: 600; }
.pslider-wrap::before, .pslider-wrap::after { content:''; position:absolute; top:-6px; bottom:-6px; width:12px; pointer-events:none; }
.pslider-wrap::before { left:0; background: linear-gradient(90deg, var(--panel), rgba(255,255,255,0)); }
.pslider-wrap::after  { right:0; background: linear-gradient(270deg, var(--panel), rgba(255,255,255,0)); }

/* Mobile tweaks: prevent iOS input zoom and cramped fields */
@media (max-width: 640px) {
  input[type="text"],
  input[type="number"],
  select,
  textarea { font-size: 16px; }
  /* Give combobox items larger tap targets */
  .combo-item, .ddi-item { padding: 12px 12px; }
}
/* Keep numeric/compact cells from wrapping weirdly */
table.table td:nth-child(2),
table.table td:nth-child(3),
table.table td:nth-child(4),
table.table td:nth-child(5),
table.table td:nth-child(7),
table.table td:nth-child(8),
table.table td:nth-child(9) { white-space: nowrap; }

/* On narrow screens, allow horizontal scroll by giving the table a minimum width */
@media (max-width: 700px) {
  /* Re-enable pull-to-refresh/scroll chaining on page and inner scrollers */
  html, body, main { overscroll-behavior: auto; }
  .table-wrap { overflow-x: auto; -webkit-overflow-scrolling: touch; overscroll-behavior: auto; }
  table.table { min-width: 980px; }
}

/* Charity Meds inputs sizing */
/* Let inputs grow a bit without forcing the whole column wider */
/* Keep inputs compact; avoid stretching the table */
/* SIG: compact ~half previous width */
/* Global defaults for SIG; overridden inside table to fill cell */
input.sig { width: 8ch; min-width: 60px; max-width: 12ch; box-sizing: content-box; }
/* Dose: numeric, compact */
/* Global defaults for Dose; overridden inside table to fill cell */
input.dose { width: 4ch; min-width: 3ch; max-width: 6ch; box-sizing: content-box; text-align: center; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: 6px 6px; }
/* Schedule: keep compact (SCH/PRN) */
/* Global defaults for Schedule; overridden inside table to fill cell */
select.schedule { width: auto; min-width: 48px; max-width: 64px; box-sizing: content-box; }
/* Days Supply: fit up to 2 digits */
/* Days Supply: compact, at least two digits visible */
/* Inside table cells, inputs are set to width:100% via the scoped rule above */
input.days { text-align: center; font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace; padding: 6px 6px; }

.scalar { font-size: 24px; font-weight: 600; margin: 8px 0 12px; }

/* Interactions (markdown-ish rendering) */
#ddi-answer p { margin: 6px 0; }
#ddi-answer ul, #ddi-answer ol { margin: 8px 0 8px 20px; }
#ddi-answer li { margin: 2px 0; }
#ddi-answer strong { color: var(--accent); }

footer { padding: 16px 20px; color: var(--muted); border-top: 1px solid var(--border); }
.footer-bar { display: flex; justify-content: space-between; align-items: center; gap: 12px; }
@media (max-width: 640px) {
  .footer-bar { flex-direction: column; align-items: flex-start; gap: 6px; }
}

/* Lavender theme enhancements add a soft bloom aesthetic */
body.theme-lavender {
  position: relative;
  background: linear-gradient(155deg, #f7f5ff 0%, #efe9ff 45%, #faf7ff 100%);
  color: var(--fg);
  letter-spacing: 0.005em;
  overflow-x: hidden;
}
body.theme-lavender::before {
  content: '';
  position: fixed;
  inset: -20% -10%;
  background:
    radial-gradient(48% 40% at 20% 18%, rgba(196,181,253,0.35) 0%, rgba(196,181,253,0) 70%),
    radial-gradient(36% 32% at 75% 12%, rgba(165,180,252,0.32) 0%, rgba(165,180,252,0) 75%),
    radial-gradient(42% 42% at 52% 82%, rgba(221,214,254,0.38) 0%, rgba(221,214,254,0) 70%);
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.85;
  z-index: 0;
}
body.theme-lavender header,
body.theme-lavender main,
body.theme-lavender .banner,
body.theme-lavender footer {
  position: relative;
  z-index: 1;
}
body.theme-lavender header { z-index: 20; }
body.theme-lavender .banner { z-index: 12; }
body.theme-lavender main { z-index: 8; }
body.theme-lavender footer { z-index: 6; }
body.theme-lavender header {
  background: linear-gradient(120deg, rgba(236,233,254,0.92) 0%, rgba(196,181,253,0.78) 55%, rgba(167,139,250,0.65) 100%);
  border-bottom: 1px solid rgba(124,58,237,0.22);
  box-shadow: 0 14px 28px rgba(76,43,140,0.12);
}
body.theme-lavender h1 a {
  letter-spacing: 0.015em;
  color: #4c2880;
  text-shadow: 0 2px 8px rgba(167,139,250,0.25);
}
body.theme-lavender a {
  color: rgba(109,76,182,0.9);
  transition: color .16s ease, box-shadow .16s ease, background .16s ease;
}
body.theme-lavender a:hover {
  color: #5b4bb2;
}
body.theme-lavender .module-inline a,
body.theme-lavender .nav-right > a,
body.theme-lavender .admin-item > a {
  background: rgba(237,233,254,0.8);
  border: 1px solid rgba(196,181,253,0.45);
  color: rgba(79,58,143,0.85);
  box-shadow: 0 8px 18px rgba(88,63,139,0.12);
}
body.theme-lavender .module-inline a:hover,
body.theme-lavender .nav-right > a:hover,
body.theme-lavender .admin-item > a:hover {
  background: rgba(209,196,253,0.9);
  color: #402b7a;
  box-shadow: 0 12px 22px rgba(64,43,122,0.16);
}
body.theme-lavender .module-inline a.active,
body.theme-lavender .nav-right > a.active,
body.theme-lavender .admin-item > a.active {
  background: rgba(196,181,253,0.95);
  color: #2f1c6c;
  box-shadow: inset 0 0 0 1px rgba(139,92,246,0.4);
}
body.theme-lavender .module-inline a::after {
  background: rgba(139,92,246,0.75);
}
body.theme-lavender .pill-btn {
  background: rgba(237,233,254,0.82);
  border-color: rgba(196,181,253,0.5);
  color: rgba(79,58,143,0.9);
  box-shadow: 0 12px 22px rgba(76,43,140,0.12);
}
body.theme-lavender .pill-btn:hover,
body.theme-lavender .pill-btn:focus-visible {
  background: rgba(206,196,250,0.94);
  border-color: rgba(139,92,246,0.5);
  box-shadow: 0 14px 28px rgba(76,43,140,0.16);
}
body.theme-lavender .pill-btn.active::after {
  opacity: 0.45;
  border-color: rgba(139,92,246,0.65);
}
body.theme-lavender .tools-menu,
body.theme-lavender .module-menu,
body.theme-lavender .admin-menu {
  background: rgba(246,243,255,0.96);
  border: 1px solid rgba(196,181,253,0.4);
  box-shadow: 0 25px 50px rgba(64,43,122,0.18);
  backdrop-filter: saturate(1.4) blur(14px);
}
body.theme-lavender .tools-menu a,
body.theme-lavender .module-menu a,
body.theme-lavender .admin-menu .admin-item > a {
  color: rgba(68,49,119,0.88);
}
body.theme-lavender .tools-menu a:hover,
body.theme-lavender .module-menu a:hover,
body.theme-lavender .admin-menu .admin-item > a:hover {
  background: rgba(196,181,253,0.3);
  color: #2f1c6c;
}
body.theme-lavender main {
  margin: 32px auto;
  padding: 32px 28px;
  background: rgba(250,248,255,0.92);
  border: 1px solid rgba(196,181,253,0.35);
  border-radius: 22px;
  box-shadow: 0 30px 60px rgba(58,34,110,0.12);
}
body.theme-lavender main::before {
  content: '';
  position: absolute;
  inset: 14px;
  border-radius: 18px;
  border: 1px solid rgba(196,181,253,0.25);
  pointer-events: none;
}
body.theme-lavender .banner {
  background: rgba(236,233,254,0.92);
  border: 1px solid rgba(196,181,253,0.4);
  color: rgba(68,49,119,0.9);
  box-shadow: 0 12px 20px rgba(75,43,140,0.1);
}
body.theme-lavender .banner.public {
  background: rgba(236,252,244,0.92);
  border-color: rgba(34,197,94,0.25);
  color: rgba(40,72,59,0.85);
}
body.theme-lavender .banner.local {
  background: rgba(233,233,245,0.88);
  color: rgba(103,95,146,0.85);
}
body.theme-lavender .panel {
  background: linear-gradient(165deg, rgba(248,246,255,0.98) 0%, rgba(235,229,253,0.96) 100%);
  border: 1px solid rgba(196,181,253,0.4);
  border-radius: 18px;
  box-shadow: 0 18px 36px rgba(67,48,123,0.1);
  overflow: hidden;
}
body.theme-lavender .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(196,181,253,0.18), rgba(255,255,255,0.2));
  pointer-events: none;
  opacity: 0.6;
}
body.theme-lavender .chip {
  background: rgba(237,233,254,0.95);
  border-color: rgba(196,181,253,0.55);
  color: rgba(68,49,119,0.88);
  box-shadow: 0 6px 14px rgba(75,43,140,0.12);
}
body.theme-lavender .chip-ok {
  background: rgba(167,243,208,0.9);
  border-color: rgba(16,185,129,0.4);
}
body.theme-lavender .chip-bad {
  background: rgba(254,226,226,0.92);
  border-color: rgba(248,113,113,0.4);
}
body.theme-lavender textarea,
body.theme-lavender select,
body.theme-lavender input[type="text"],
body.theme-lavender input[type="password"],
body.theme-lavender input[type="number"] {
  background: rgba(248,246,255,0.95);
  border: 1px solid rgba(196,181,253,0.5);
  color: #2f1c6c;
  box-shadow: inset 0 0 0 1px rgba(124,58,237,0.08);
}
body.theme-lavender textarea:focus,
body.theme-lavender select:focus,
body.theme-lavender input[type="text"]:focus,
body.theme-lavender input[type="password"]:focus,
body.theme-lavender input[type="number"]:focus {
  border-color: rgba(139,92,246,0.7);
  box-shadow: 0 0 0 3px rgba(196,181,253,0.35);
}
body.theme-lavender button {
  background: linear-gradient(130deg, rgba(196,181,253,1) 0%, rgba(167,139,250,0.95) 55%, rgba(139,92,246,0.95) 100%);
  border: 1px solid rgba(124,58,237,0.45);
  color: #ffffff;
  box-shadow: 0 16px 32px rgba(88,63,139,0.2);
  transition: transform .16s ease, box-shadow .16s ease;
}
body.theme-lavender button:hover:not([disabled]),
body.theme-lavender button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 18px 38px rgba(76,43,140,0.22);
}
body.theme-lavender button.secondary {
  background: rgba(237,233,254,0.9);
  color: rgba(68,49,119,0.9);
  border: 1px solid rgba(196,181,253,0.45);
  box-shadow: 0 10px 24px rgba(64,43,122,0.12);
}
body.theme-lavender button.secondary:hover:not([disabled]),
body.theme-lavender button.secondary:focus-visible {
  background: rgba(209,196,253,0.94);
  color: #2f1c6c;
}
body.theme-lavender .copy-btn,
body.theme-lavender .icon-btn {
  background: rgba(237,233,254,0.92);
  border: 1px solid rgba(196,181,253,0.45);
  color: rgba(68,49,119,0.88);
  box-shadow: 0 10px 24px rgba(58,34,110,0.12);
}
body.theme-lavender .copy-btn:hover,
body.theme-lavender .icon-btn:hover {
  border-color: rgba(139,92,246,0.45);
  color: #2f1c6c;
}
body.theme-lavender th,
body.theme-lavender td {
  border-bottom-color: rgba(196,181,253,0.35);
}
body.theme-lavender th {
  background: rgba(236,233,254,0.96);
  color: rgba(59,38,117,0.9);
  box-shadow: inset 0 -1px 0 0 rgba(196,181,253,0.25);
}
body.theme-lavender footer {
  background: rgba(238,233,255,0.9);
  border-top: 1px solid rgba(196,181,253,0.4);
  box-shadow: 0 -18px 28px rgba(58,34,110,0.12);
  color: rgba(79,58,143,0.85);
}
body.theme-lavender .muted {
  color: rgba(103,95,146,0.85);
}
@media (max-width: 700px) {
  body.theme-lavender main {
    margin: 26px 12px;
    padding: 26px 20px;
  }
}

/* Aurora theme enhancements deliver a polar-night neon glow */
body.theme-aurora {
  position: relative;
  background: radial-gradient(140% 140% at 18% -10%, rgba(56,189,248,0.24) 0%, rgba(76,29,149,0.28) 35%, rgba(4,11,22,0.96) 60%, rgba(2,6,14,1) 100%);
  color: var(--fg);
  letter-spacing: 0.01em;
  overflow-x: hidden;
}
body.theme-aurora::before,
body.theme-aurora::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
body.theme-aurora::before {
  background:
    radial-gradient(34% 40% at 82% 16%, rgba(129,230,217,0.28) 0%, rgba(129,230,217,0) 70%),
    radial-gradient(30% 36% at 14% 78%, rgba(96,165,250,0.28) 0%, rgba(96,165,250,0) 75%);
  mix-blend-mode: screen;
  opacity: 0.85;
}
body.theme-aurora::after {
  inset: -40%;
  background:
    radial-gradient(60% 60% at 50% 110%, rgba(79,70,229,0.16) 0%, rgba(4,11,22,0) 65%),
    linear-gradient(120deg, rgba(56,189,248,0.12), rgba(192,132,252,0.1));
  opacity: 0.35;
  transform: rotate(-2deg);
}
body.theme-aurora header,
body.theme-aurora main,
body.theme-aurora .banner,
body.theme-aurora footer {
  position: relative;
  z-index: 1;
}
body.theme-aurora header { z-index: 20; }
body.theme-aurora .banner { z-index: 12; }
body.theme-aurora main { z-index: 8; }
body.theme-aurora footer { z-index: 6; }
body.theme-aurora header {
  background: linear-gradient(125deg, rgba(17,38,66,0.95) 0%, rgba(22,47,88,0.9) 45%, rgba(38,26,78,0.85) 100%);
  border-bottom: 1px solid rgba(56,189,248,0.42);
  box-shadow: 0 16px 38px rgba(3,6,15,0.88);
}
body.theme-aurora h1 a {
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-weight: 700;
  text-shadow: 0 0 20px rgba(56,189,248,0.4), 0 0 32px rgba(192,132,252,0.28);
}
body.theme-aurora a {
  color: rgba(191,219,254,0.9);
  transition: color .18s ease, text-shadow .18s ease, box-shadow .18s ease;
}
body.theme-aurora a:hover {
  color: #e0f2ff;
  text-shadow: 0 0 18px rgba(56,189,248,0.45);
}
body.theme-aurora .module-inline a,
body.theme-aurora .nav-right > a,
body.theme-aurora .admin-item > a {
  background: rgba(18,35,61,0.78);
  border: 1px solid rgba(56,189,248,0.3);
  color: rgba(201,228,255,0.88);
  box-shadow: 0 16px 34px rgba(3,6,15,0.82), inset 0 0 0 1px rgba(192,132,252,0.18);
}
body.theme-aurora .module-inline a:hover,
body.theme-aurora .nav-right > a:hover,
body.theme-aurora .admin-item > a:hover {
  background: rgba(56,189,248,0.2);
  color: #f5fbff;
  box-shadow: 0 18px 40px rgba(3,6,15,0.86), 0 0 20px rgba(56,189,248,0.32);
}
body.theme-aurora .module-inline a.active,
body.theme-aurora .nav-right > a.active,
body.theme-aurora .admin-item > a.active {
  background: rgba(79,70,229,0.22);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,0.45), 0 0 24px rgba(129,230,217,0.28);
}
body.theme-aurora .module-inline a::after {
  background: rgba(56,189,248,0.9);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(56,189,248,0.5);
}
body.theme-aurora .pill-btn {
  background: rgba(18,35,61,0.8);
  border: 1px solid rgba(56,189,248,0.32);
  color: rgba(201,228,255,0.92);
  box-shadow: 0 14px 34px rgba(3,6,15,0.82);
}
body.theme-aurora .pill-btn:hover,
body.theme-aurora .pill-btn:focus-visible {
  background: rgba(56,189,248,0.22);
  border-color: rgba(192,132,252,0.52);
  box-shadow: 0 0 22px rgba(56,189,248,0.45);
}
body.theme-aurora .pill-btn.active::after {
  opacity: 0.6;
  border-color: rgba(192,132,252,0.55);
  box-shadow: 0 0 18px rgba(192,132,252,0.45);
}
body.theme-aurora .tools-menu,
body.theme-aurora .module-menu,
body.theme-aurora .admin-menu {
  background: rgba(17,31,55,0.95);
  border: 1px solid rgba(56,189,248,0.28);
  box-shadow: 0 30px 64px rgba(3,6,15,0.9), 0 0 24px rgba(192,132,252,0.22);
  backdrop-filter: saturate(1.55) blur(15px);
}
body.theme-aurora .tools-menu a,
body.theme-aurora .module-menu a,
body.theme-aurora .admin-menu .admin-item > a {
  color: rgba(201,228,255,0.9);
}
body.theme-aurora .tools-menu a:hover,
body.theme-aurora .module-menu a:hover,
body.theme-aurora .admin-menu .admin-item > a:hover {
  background: rgba(56,189,248,0.22);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(192,132,252,0.28);
}
body.theme-aurora main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(9,19,36,0.92);
  border: 1px solid rgba(56,189,248,0.26);
  border-radius: 24px;
  box-shadow: 0 34px 84px rgba(2,6,12,0.85);
  overflow: hidden;
}
body.theme-aurora main::before {
  content: '';
  position: absolute;
  inset: 18px;
  border-radius: 18px;
  border: 1px solid rgba(56,189,248,0.2);
  opacity: 0.55;
  pointer-events: none;
}
body.theme-aurora .banner {
  background: rgba(18,35,61,0.84);
  border: 1px solid rgba(56,189,248,0.3);
  color: rgba(201,228,255,0.88);
  box-shadow: 0 12px 32px rgba(2,6,12,0.72);
}
body.theme-aurora .banner.public {
  background: rgba(22,58,52,0.82);
  border-color: rgba(16,185,129,0.35);
  color: rgba(178,255,234,0.9);
}
body.theme-aurora .banner.local {
  background: rgba(37,25,69,0.82);
  color: rgba(233,213,255,0.88);
}
body.theme-aurora .panel {
  position: relative;
  background: linear-gradient(155deg, rgba(16,30,55,0.95) 0%, rgba(10,18,38,0.95) 100%);
  border: 1px solid rgba(56,189,248,0.3);
  border-radius: 18px;
  box-shadow: 0 24px 52px rgba(2,6,12,0.82);
  overflow: hidden;
}
body.theme-aurora .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(56,189,248,0.22), rgba(192,132,252,0.16));
  pointer-events: none;
}
body.theme-aurora .chip {
  background: rgba(56,189,248,0.22);
  border-color: rgba(192,132,252,0.35);
  color: rgba(201,228,255,0.9);
  box-shadow: 0 0 18px rgba(56,189,248,0.32);
}
body.theme-aurora .chip-ok {
  background: rgba(45,212,191,0.24);
  border-color: rgba(16,185,129,0.45);
  color: rgba(178,255,234,0.9);
}
body.theme-aurora .chip-bad {
  background: rgba(244,63,94,0.24);
  border-color: rgba(248,113,113,0.45);
  color: rgba(255,215,226,0.9);
}
body.theme-aurora textarea,
body.theme-aurora select,
body.theme-aurora input[type="text"],
body.theme-aurora input[type="password"],
body.theme-aurora input[type="number"] {
  background: rgba(10,19,36,0.94);
  border: 1px solid rgba(56,189,248,0.28);
  color: #e6f7ff;
  box-shadow: inset 0 0 0 1px rgba(192,132,252,0.16);
}
body.theme-aurora textarea:focus,
body.theme-aurora select:focus,
body.theme-aurora input[type="text"]:focus,
body.theme-aurora input[type="password"]:focus,
body.theme-aurora input[type="number"]:focus {
  border-color: rgba(129,230,217,0.75);
  box-shadow: 0 0 0 3px rgba(56,189,248,0.35);
}
body.theme-aurora button {
  position: relative;
  background: linear-gradient(125deg, rgba(56,189,248,1) 0%, rgba(129,230,217,0.95) 45%, rgba(192,132,252,0.95) 100%);
  border: 1px solid rgba(56,189,248,0.42);
  color: #051124;
  box-shadow: 0 20px 48px rgba(2,6,12,0.85), 0 0 24px rgba(56,189,248,0.32);
  transition: transform .18s ease, box-shadow .18s ease;
  font-weight: 700;
}
body.theme-aurora button:hover:not([disabled]),
body.theme-aurora button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 24px 58px rgba(2,6,12,0.9), 0 0 30px rgba(129,230,217,0.45);
}
body.theme-aurora button.secondary {
  background: rgba(18,35,61,0.82);
  color: rgba(201,228,255,0.9);
  border: 1px solid rgba(56,189,248,0.35);
  box-shadow: 0 16px 38px rgba(2,6,12,0.82);
}
body.theme-aurora button.secondary:hover:not([disabled]),
body.theme-aurora button.secondary:focus-visible {
  background: rgba(56,189,248,0.24);
  color: #ffffff;
}
body.theme-aurora .copy-btn,
body.theme-aurora .icon-btn {
  background: rgba(18,35,61,0.82);
  border: 1px solid rgba(56,189,248,0.35);
  color: rgba(201,228,255,0.9);
  box-shadow: 0 12px 32px rgba(2,6,12,0.8);
}
body.theme-aurora .copy-btn:hover,
body.theme-aurora .icon-btn:hover {
  border-color: rgba(129,230,217,0.55);
  color: #ffffff;
}
body.theme-aurora th,
body.theme-aurora td {
  border-bottom-color: rgba(56,189,248,0.28);
}
body.theme-aurora th {
  background: rgba(17,31,55,0.94);
  color: rgba(201,228,255,0.9);
  box-shadow: inset 0 -1px 0 0 rgba(56,189,248,0.28);
}
body.theme-aurora footer {
  background: rgba(14,26,44,0.92);
  border-top: 1px solid rgba(56,189,248,0.3);
  box-shadow: 0 -22px 48px rgba(2,6,12,0.82);
  color: rgba(201,228,255,0.82);
}
body.theme-aurora .muted {
  color: rgba(148,197,233,0.78);
}
body.theme-aurora .spinner {
  border-color: rgba(56,189,248,0.3);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-aurora main {
    margin: 28px 12px;
    padding: 28px 20px;
  }
}

/* Monochrome theme focuses on minimal neutrals with electric accents */
body.theme-monochrome {
  position: relative;
  background: radial-gradient(140% 140% at 18% -10%, rgba(56,189,248,0.15) 0%, rgba(15,17,20,0.96) 55%, rgba(10,12,15,1) 100%);
  color: var(--fg);
  letter-spacing: 0.005em;
  overflow-x: hidden;
}
body.theme-monochrome::before {
  content: '';
  position: fixed;
  inset: -40%;
  background:
    radial-gradient(32% 34% at 78% 12%, rgba(148,163,184,0.2) 0%, rgba(148,163,184,0) 70%),
    radial-gradient(28% 30% at 18% 78%, rgba(56,189,248,0.18) 0%, rgba(56,189,248,0) 72%);
  pointer-events: none;
  opacity: 0.65;
  mix-blend-mode: screen;
}
body.theme-monochrome header,
body.theme-monochrome main,
body.theme-monochrome .banner,
body.theme-monochrome footer {
  position: relative;
  z-index: 1;
}
body.theme-monochrome header { z-index: 20; }
body.theme-monochrome .banner { z-index: 12; }
body.theme-monochrome main { z-index: 8; }
body.theme-monochrome footer { z-index: 6; }
body.theme-monochrome header {
  background: linear-gradient(120deg, rgba(24,28,34,0.95) 0%, rgba(17,19,24,0.92) 60%, rgba(11,13,16,0.9) 100%);
  border-bottom: 1px solid rgba(148,163,184,0.25);
  box-shadow: 0 16px 36px rgba(5,6,8,0.85);
}
body.theme-monochrome h1 a {
  letter-spacing: 0.025em;
  font-weight: 700;
  text-transform: uppercase;
  color: #f8fafc;
  text-shadow: 0 0 18px rgba(56,189,248,0.35);
}
body.theme-monochrome a {
  color: rgba(226,232,240,0.88);
  transition: color .16s ease, text-shadow .16s ease, background .16s ease;
}
body.theme-monochrome a:hover {
  color: #60a5fa;
  text-shadow: 0 0 14px rgba(96,165,250,0.38);
}
body.theme-monochrome .module-inline a,
body.theme-monochrome .nav-right > a,
body.theme-monochrome .admin-item > a {
  background: rgba(17,20,24,0.85);
  border: 1px solid rgba(148,163,184,0.18);
  color: rgba(197,203,213,0.86);
  box-shadow: 0 12px 30px rgba(5,6,8,0.65);
}
body.theme-monochrome .module-inline a:hover,
body.theme-monochrome .nav-right > a:hover,
body.theme-monochrome .admin-item > a:hover {
  color: #f8fafc;
  background: rgba(56,189,248,0.18);
  border-color: rgba(56,189,248,0.35);
  box-shadow: 0 14px 34px rgba(5,6,8,0.78);
}
body.theme-monochrome .module-inline a.active,
body.theme-monochrome .nav-right > a.active,
body.theme-monochrome .admin-item > a.active {
  color: #ffffff;
  background: rgba(56,189,248,0.2);
  border-color: rgba(56,189,248,0.4);
  box-shadow: inset 0 0 0 1px rgba(56,189,248,0.35), 0 0 20px rgba(56,189,248,0.28);
}
body.theme-monochrome .module-inline a::after {
  background: rgba(56,189,248,0.85);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 12px rgba(56,189,248,0.45);
}
body.theme-monochrome .pill-btn {
  background: rgba(17,20,24,0.88);
  border: 1px solid rgba(148,163,184,0.2);
  color: rgba(226,232,240,0.9);
  box-shadow: 0 12px 32px rgba(5,6,8,0.7);
}
body.theme-monochrome .pill-btn:hover,
body.theme-monochrome .pill-btn:focus-visible {
  background: rgba(56,189,248,0.16);
  border-color: rgba(56,189,248,0.45);
  box-shadow: 0 0 22px rgba(56,189,248,0.4);
}
body.theme-monochrome .pill-btn.active::after {
  opacity: 0.55;
  border-color: rgba(56,189,248,0.6);
  box-shadow: 0 0 16px rgba(56,189,248,0.4);
}
body.theme-monochrome .tools-menu,
body.theme-monochrome .module-menu,
body.theme-monochrome .admin-menu {
  background: rgba(16,19,24,0.96);
  border: 1px solid rgba(148,163,184,0.24);
  box-shadow: 0 26px 56px rgba(5,6,8,0.85);
  backdrop-filter: saturate(1.3) blur(14px);
}
body.theme-monochrome .tools-menu a,
body.theme-monochrome .module-menu a,
body.theme-monochrome .admin-menu .admin-item > a {
  color: rgba(226,232,240,0.88);
}
body.theme-monochrome .tools-menu a:hover,
body.theme-monochrome .module-menu a:hover,
body.theme-monochrome .admin-menu .admin-item > a:hover {
  background: rgba(56,189,248,0.2);
  color: #ffffff;
}
body.theme-monochrome main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(18,21,26,0.92);
  border: 1px solid rgba(148,163,184,0.22);
  border-radius: 24px;
  box-shadow: 0 36px 80px rgba(5,6,8,0.82);
  overflow: hidden;
}
body.theme-monochrome main::before {
  content: '';
  position: absolute;
  inset: 18px;
  border-radius: 18px;
  border: 1px solid rgba(56,189,248,0.16);
  opacity: 0.4;
  pointer-events: none;
}
body.theme-monochrome .banner {
  background: rgba(17,20,24,0.85);
  border: 1px solid rgba(148,163,184,0.24);
  color: rgba(226,232,240,0.85);
  box-shadow: 0 10px 26px rgba(5,6,8,0.72);
}
body.theme-monochrome .banner.public {
  background: rgba(18,32,28,0.85);
  border-color: rgba(34,197,94,0.32);
  color: rgba(197,253,223,0.9);
}
body.theme-monochrome .banner.local {
  background: rgba(28,22,32,0.85);
  color: rgba(226,180,255,0.88);
}
body.theme-monochrome .panel {
  position: relative;
  background: linear-gradient(155deg, rgba(21,24,29,0.96) 0%, rgba(15,18,23,0.96) 100%);
  border: 1px solid rgba(148,163,184,0.24);
  border-radius: 18px;
  box-shadow: 0 22px 48px rgba(5,6,8,0.78);
  overflow: hidden;
}
body.theme-monochrome .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(56,189,248,0.12), rgba(148,163,184,0.08));
  pointer-events: none;
}
body.theme-monochrome .chip {
  background: rgba(17,20,24,0.9);
  border-color: rgba(148,163,184,0.32);
  color: rgba(226,232,240,0.88);
  box-shadow: 0 0 16px rgba(56,189,248,0.24);
}
body.theme-monochrome .chip-ok {
  background: rgba(34,197,94,0.18);
  border-color: rgba(16,185,129,0.35);
  color: rgba(196,252,225,0.9);
}
body.theme-monochrome .chip-bad {
  background: rgba(248,113,113,0.2);
  border-color: rgba(248,113,113,0.4);
  color: rgba(255,205,205,0.88);
}
body.theme-monochrome textarea,
body.theme-monochrome select,
body.theme-monochrome input[type="text"],
body.theme-monochrome input[type="password"],
body.theme-monochrome input[type="number"] {
  background: rgba(13,15,19,0.94);
  border: 1px solid rgba(148,163,184,0.28);
  color: #f8fafc;
  box-shadow: inset 0 0 0 1px rgba(56,189,248,0.12);
}
body.theme-monochrome textarea:focus,
body.theme-monochrome select:focus,
body.theme-monochrome input[type="text"]:focus,
body.theme-monochrome input[type="password"]:focus,
body.theme-monochrome input[type="number"]:focus {
  border-color: rgba(56,189,248,0.65);
  box-shadow: 0 0 0 3px rgba(56,189,248,0.25);
}
body.theme-monochrome button {
  background: linear-gradient(125deg, rgba(56,189,248,0.95) 0%, rgba(226,232,240,0.95) 80%, rgba(148,163,184,0.95) 100%);
  border: 1px solid rgba(56,189,248,0.42);
  color: #05070a;
  box-shadow: 0 18px 44px rgba(5,6,8,0.78), 0 0 20px rgba(56,189,248,0.3);
  transition: transform .16s ease, box-shadow .16s ease;
  font-weight: 700;
}
body.theme-monochrome button:hover:not([disabled]),
body.theme-monochrome button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 22px 52px rgba(5,6,8,0.82), 0 0 26px rgba(56,189,248,0.42);
}
body.theme-monochrome button.secondary {
  background: rgba(17,20,24,0.9);
  color: rgba(226,232,240,0.88);
  border: 1px solid rgba(148,163,184,0.28);
  box-shadow: 0 14px 34px rgba(5,6,8,0.74);
}
body.theme-monochrome button.secondary:hover:not([disabled]),
body.theme-monochrome button.secondary:focus-visible {
  background: rgba(56,189,248,0.16);
  color: #ffffff;
}
body.theme-monochrome .copy-btn,
body.theme-monochrome .icon-btn {
  background: rgba(17,20,24,0.9);
  border: 1px solid rgba(148,163,184,0.28);
  color: rgba(226,232,240,0.88);
  box-shadow: 0 12px 30px rgba(5,6,8,0.76);
}
body.theme-monochrome .copy-btn:hover,
body.theme-monochrome .icon-btn:hover {
  border-color: rgba(56,189,248,0.45);
  color: #ffffff;
}
body.theme-monochrome th,
body.theme-monochrome td {
  border-bottom-color: rgba(148,163,184,0.24);
}
body.theme-monochrome th {
  background: rgba(17,20,24,0.9);
  color: rgba(226,232,240,0.9);
  box-shadow: inset 0 -1px 0 0 rgba(148,163,184,0.22);
}
body.theme-monochrome footer {
  background: rgba(15,18,23,0.92);
  border-top: 1px solid rgba(148,163,184,0.24);
  box-shadow: 0 -18px 40px rgba(5,6,8,0.78);
  color: rgba(197,203,213,0.82);
}
body.theme-monochrome .muted {
  color: rgba(148,163,184,0.78);
}
body.theme-monochrome .spinner {
  border-color: rgba(148,163,184,0.28);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-monochrome main {
    margin: 28px 12px;
    padding: 28px 20px;
  }
}

/* Glass theme leans into frosted translucency with neutral highlights */
body.theme-glass {
  position: relative;
  background: linear-gradient(135deg, #f8fafc 0%, #eef2f5 50%, #f2f5f9 100%);
  color: var(--fg);
  letter-spacing: 0.003em;
  overflow-x: hidden;
}
body.theme-glass::before {
  content: '';
  position: fixed;
  inset: -25%;
  background:
    radial-gradient(42% 38% at 18% 12%, rgba(203,213,225,0.25) 0%, rgba(255,255,255,0) 72%),
    radial-gradient(48% 42% at 78% 20%, rgba(148,163,184,0.2) 0%, rgba(255,255,255,0) 75%);
  pointer-events: none;
  opacity: 0.7;
  mix-blend-mode: screen;
}
body.theme-glass header,
body.theme-glass main,
body.theme-glass .banner,
body.theme-glass footer {
  position: relative;
  z-index: 1;
}
body.theme-glass header { z-index: 20; }
body.theme-glass .banner { z-index: 12; }
body.theme-glass main { z-index: 8; }
body.theme-glass footer { z-index: 6; }
body.theme-glass header {
  background: linear-gradient(118deg, rgba(255,255,255,0.95) 0%, rgba(244,247,251,0.9) 50%, rgba(236,240,245,0.82) 100%);
  border-bottom: 1px solid rgba(148,163,184,0.28);
  backdrop-filter: blur(18px);
  box-shadow: 0 16px 34px rgba(15,23,42,0.08);
}
body.theme-glass h1 a {
  letter-spacing: 0.018em;
  font-weight: 700;
  color: #0f172a;
  text-shadow: 0 8px 20px rgba(148,163,184,0.16);
}
body.theme-glass a {
  color: rgba(71,85,105,0.85);
  transition: color .16s ease, box-shadow .16s ease;
}
body.theme-glass a:hover {
  color: #0f172a;
}
body.theme-glass .module-inline a,
body.theme-glass .nav-right > a,
body.theme-glass .admin-item > a {
  background: rgba(255,255,255,0.78);
  border: 1px solid rgba(148,163,184,0.25);
  backdrop-filter: blur(18px) saturate(1.12);
  color: rgba(71,85,105,0.86);
  box-shadow: 0 14px 28px rgba(148,163,184,0.2);
}
body.theme-glass .module-inline a:hover,
body.theme-glass .nav-right > a:hover,
body.theme-glass .admin-item > a:hover {
  background: rgba(244,247,251,0.92);
  color: #0f172a;
}
body.theme-glass .module-inline a.active,
body.theme-glass .nav-right > a.active,
body.theme-glass .admin-item > a.active {
  background: rgba(203,213,225,0.22);
  color: #0f172a;
  box-shadow: inset 0 0 0 1px rgba(148,163,184,0.38);
}
body.theme-glass .module-inline a::after {
  background: rgba(148,163,184,0.6);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 10px rgba(148,163,184,0.28);
}
body.theme-glass .pill-btn {
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(148,163,184,0.26);
  color: rgba(71,85,105,0.88);
  backdrop-filter: blur(18px) saturate(1.1);
  box-shadow: 0 12px 26px rgba(148,163,184,0.18);
}
body.theme-glass .pill-btn:hover,
body.theme-glass .pill-btn:focus-visible {
  background: rgba(236,240,245,0.92);
  border-color: rgba(148,163,184,0.34);
}
body.theme-glass .pill-btn.active::after {
  opacity: 0.4;
  border-color: rgba(148,163,184,0.45);
  box-shadow: 0 0 10px rgba(148,163,184,0.28);
}
body.theme-glass .tools-menu,
body.theme-glass .module-menu,
body.theme-glass .admin-menu {
  background: rgba(255,255,255,0.86);
  border: 1px solid rgba(148,163,184,0.28);
  backdrop-filter: blur(20px) saturate(1.18);
  box-shadow: 0 24px 46px rgba(148,163,184,0.18);
}
body.theme-glass .tools-menu a,
body.theme-glass .module-menu a,
body.theme-glass .admin-menu .admin-item > a {
  color: rgba(71,85,105,0.84);
}
body.theme-glass .tools-menu a:hover,
body.theme-glass .module-menu a:hover,
body.theme-glass .admin-menu .admin-item > a:hover {
  background: rgba(244,247,251,0.95);
  color: #0f172a;
}
body.theme-glass main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(255,255,255,0.76);
  border: 1px solid rgba(148,163,184,0.22);
  border-radius: 32px;
  box-shadow: 0 38px 74px rgba(148,163,184,0.18);
  backdrop-filter: blur(26px) saturate(1.15);
  overflow: hidden;
}
body.theme-glass main::before {
  content: '';
  position: absolute;
  inset: 20px;
  border-radius: 26px;
  border: 1px solid rgba(148,163,184,0.28);
  pointer-events: none;
  opacity: 0.32;
}
body.theme-glass .banner {
  background: rgba(255,255,255,0.72);
  border: 1px solid rgba(148,163,184,0.26);
  color: rgba(71,85,105,0.8);
  backdrop-filter: blur(18px) saturate(1.1);
  box-shadow: 0 12px 26px rgba(148,163,184,0.2);
}
body.theme-glass .banner.public {
  background: rgba(244,249,252,0.76);
  border-color: rgba(148,163,184,0.26);
  color: rgba(71,85,105,0.78);
}
body.theme-glass .banner.local {
  background: rgba(249,246,238,0.74);
  color: rgba(107,70,36,0.78);
}
body.theme-glass .panel {
  position: relative;
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(148,163,184,0.24);
  border-radius: 20px;
  box-shadow: 0 22px 44px rgba(148,163,184,0.2);
  backdrop-filter: blur(20px) saturate(1.12);
  overflow: hidden;
}
body.theme-glass .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(244,247,251,0.5), rgba(203,213,225,0.18));
  pointer-events: none;
}
body.theme-glass .chip {
  background: rgba(255,255,255,0.78);
  border-color: rgba(148,163,184,0.26);
  color: rgba(71,85,105,0.82);
  backdrop-filter: blur(16px) saturate(1.08);
  box-shadow: 0 10px 20px rgba(148,163,184,0.18);
}
body.theme-glass .chip-ok {
  background: rgba(226,232,240,0.42);
  border-color: rgba(148,163,184,0.28);
}
body.theme-glass .chip-bad {
  background: rgba(226,232,240,0.35);
  border-color: rgba(148,163,184,0.3);
}
body.theme-glass textarea,
body.theme-glass select,
body.theme-glass input[type="text"],
body.theme-glass input[type="password"],
body.theme-glass input[type="number"] {
  background: rgba(255,255,255,0.84);
  border: 1px solid rgba(148,163,184,0.26);
  color: #0f172a;
  box-shadow: inset 0 0 0 1px rgba(148,163,184,0.12);
  backdrop-filter: blur(16px);
}
body.theme-glass textarea:focus,
body.theme-glass select:focus,
body.theme-glass input[type="text"]:focus,
body.theme-glass input[type="password"]:focus,
body.theme-glass input[type="number"]:focus {
  border-color: rgba(148,163,184,0.45);
  box-shadow: 0 0 0 3px rgba(148,163,184,0.18);
}
body.theme-glass button {
  background: linear-gradient(130deg, rgba(255,255,255,0.92) 0%, rgba(244,247,251,0.88) 50%, rgba(229,234,240,0.85) 100%);
  border: 1px solid rgba(148,163,184,0.26);
  color: #0f172a;
  box-shadow: 0 16px 36px rgba(148,163,184,0.2);
  transition: transform .16s ease, box-shadow .16s ease;
  font-weight: 600;
}
body.theme-glass button:hover:not([disabled]),
body.theme-glass button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 20px 42px rgba(148,163,184,0.24);
}
body.theme-glass button.secondary {
  background: rgba(255,255,255,0.84);
  color: rgba(71,85,105,0.82);
  border: 1px solid rgba(148,163,184,0.24);
  box-shadow: 0 10px 24px rgba(148,163,184,0.18);
}
body.theme-glass button.secondary:hover:not([disabled]),
body.theme-glass button.secondary:focus-visible {
  background: rgba(244,247,251,0.9);
  color: #0f172a;
}
body.theme-glass .copy-btn,
body.theme-glass .icon-btn {
  background: rgba(255,255,255,0.8);
  border: 1px solid rgba(148,163,184,0.24);
  color: rgba(71,85,105,0.8);
  box-shadow: 0 12px 24px rgba(148,163,184,0.18);
}
body.theme-glass .copy-btn:hover,
body.theme-glass .icon-btn:hover {
  border-color: rgba(148,163,184,0.32);
  color: #0f172a;
}
body.theme-glass th,
body.theme-glass td {
  border-bottom-color: rgba(148,163,184,0.24);
}
body.theme-glass th {
  background: rgba(255,255,255,0.82);
  color: rgba(71,85,105,0.82);
  box-shadow: inset 0 -1px 0 0 rgba(148,163,184,0.22);
}
body.theme-glass footer {
  background: rgba(255,255,255,0.84);
  border-top: 1px solid rgba(148,163,184,0.24);
  backdrop-filter: blur(18px) saturate(1.08);
  color: rgba(100,116,139,0.68);
}
body.theme-glass .muted {
  color: rgba(100,116,139,0.64);
}
body.theme-glass .spinner {
  border-color: rgba(148,163,184,0.24);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-glass main {
    margin: 26px 12px;
    padding: 26px 18px;
  }
}

/* Nordic theme adds calm coastal neutrals with clean contrasts */
body.theme-nordic {
  position: relative;
  background: linear-gradient(135deg, #fbf7ef 0%, #eee3d3 45%, #dbe5f2 100%);
  color: var(--fg);
  letter-spacing: 0.002em;
  overflow-x: hidden;
}
body.theme-nordic::before {
  content: '';
  position: fixed;
  inset: -25%;
  background:
    radial-gradient(38% 34% at 18% 16%, rgba(214,205,191,0.35) 0%, rgba(255,255,255,0) 72%),
    radial-gradient(32% 32% at 82% 20%, rgba(147,176,206,0.28) 0%, rgba(255,255,255,0) 75%);
  pointer-events: none;
  opacity: 0.55;
  mix-blend-mode: soft-light;
}
body.theme-nordic header,
body.theme-nordic main,
body.theme-nordic .banner,
body.theme-nordic footer {
  position: relative;
  z-index: 1;
}
body.theme-nordic header { z-index: 20; }
body.theme-nordic .banner { z-index: 12; }
body.theme-nordic main { z-index: 8; }
body.theme-nordic footer { z-index: 6; }
body.theme-nordic header {
  background: linear-gradient(118deg, rgba(255,255,255,0.96) 0%, rgba(245,239,229,0.9) 55%, rgba(227,237,248,0.86) 100%);
  border-bottom: 1px solid rgba(214,207,196,0.7);
  box-shadow: 0 14px 26px rgba(26,36,52,0.1);
}
body.theme-nordic h1 a {
  letter-spacing: 0.02em;
  font-weight: 700;
  color: #1a2539;
  text-shadow: 0 6px 18px rgba(173,181,189,0.22);
}
body.theme-nordic a {
  color: rgba(30,64,80,0.82);
  transition: color .16s ease, box-shadow .16s ease;
}
body.theme-nordic a:hover {
  color: #1a2539;
}
body.theme-nordic .module-inline a,
body.theme-nordic .nav-right > a,
body.theme-nordic .admin-item > a {
  background: rgba(255,255,255,0.95);
  border: 1px solid rgba(214,207,196,0.8);
  color: rgba(42,56,75,0.86);
  box-shadow: 0 12px 22px rgba(182,190,198,0.22);
}
body.theme-nordic .module-inline a:hover,
body.theme-nordic .nav-right > a:hover,
body.theme-nordic .admin-item > a:hover {
  background: rgba(239,234,225,0.95);
  color: #1a2539;
}
body.theme-nordic .module-inline a.active,
body.theme-nordic .nav-right > a.active,
body.theme-nordic .admin-item > a.active {
  background: rgba(29,78,216,0.16);
  color: #1a2539;
  box-shadow: inset 0 0 0 1px rgba(29,78,216,0.45);
}
body.theme-nordic .module-inline a::after {
  background: rgba(29,78,216,0.72);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 10px rgba(29,78,216,0.3);
}
body.theme-nordic .pill-btn {
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(209,213,219,0.7);
  color: rgba(54,65,82,0.88);
  box-shadow: 0 10px 24px rgba(148,163,184,0.18);
}
body.theme-nordic .pill-btn:hover,
body.theme-nordic .pill-btn:focus-visible {
  background: rgba(235,244,250,0.95);
  border-color: rgba(14,165,233,0.35);
}
body.theme-nordic .pill-btn.active::after {
  opacity: 0.45;
  border-color: rgba(14,165,233,0.45);
  box-shadow: 0 0 12px rgba(14,165,233,0.3);
}
body.theme-nordic .tools-menu,
body.theme-nordic .module-menu,
body.theme-nordic .admin-menu {
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(209,213,219,0.7);
  box-shadow: 0 22px 40px rgba(148,163,184,0.18);
}
body.theme-nordic .tools-menu a,
body.theme-nordic .module-menu a,
body.theme-nordic .admin-menu .admin-item > a {
  color: rgba(54,65,82,0.85);
}
body.theme-nordic .tools-menu a:hover,
body.theme-nordic .module-menu a:hover,
body.theme-nordic .admin-menu .admin-item > a:hover {
  background: rgba(235,244,250,0.9);
  color: #1f2933;
}
body.theme-nordic main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(255,255,255,0.97);
  border: 1px solid rgba(214,207,196,0.75);
  border-radius: 28px;
  box-shadow: 0 34px 58px rgba(190,198,206,0.18);
  overflow: hidden;
}
body.theme-nordic main::before {
  content: '';
  position: absolute;
  inset: 18px;
  border-radius: 22px;
  border: 1px solid rgba(214,207,196,0.6);
  pointer-events: none;
  opacity: 0.32;
}
body.theme-nordic .banner {
  background: rgba(255,255,255,0.94);
  border: 1px solid rgba(209,213,219,0.7);
  color: rgba(54,65,82,0.82);
  box-shadow: 0 10px 22px rgba(148,163,184,0.16);
}
body.theme-nordic .banner.public {
  background: rgba(239,248,253,0.9);
  border-color: rgba(148,163,184,0.65);
  color: rgba(30,64,80,0.82);
}
body.theme-nordic .banner.local {
  background: rgba(252,245,232,0.92);
  color: rgba(107,70,36,0.85);
}
body.theme-nordic .panel {
  position: relative;
  background: linear-gradient(140deg, rgba(255,255,255,0.98) 0%, rgba(247,242,234,0.95) 100%);
  border: 1px solid rgba(214,207,196,0.7);
  border-radius: 18px;
  box-shadow: 0 18px 32px rgba(182,190,198,0.18);
  overflow: hidden;
}
body.theme-nordic .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(229,237,246,0.5), rgba(214,207,196,0.14));
  pointer-events: none;
}
body.theme-nordic .chip {
  background: rgba(255,255,255,0.92);
  border-color: rgba(214,207,196,0.68);
  color: rgba(54,65,82,0.8);
  box-shadow: 0 8px 18px rgba(182,190,198,0.16);
}
body.theme-nordic .chip-ok {
  background: rgba(29,78,216,0.14);
  border-color: rgba(29,78,216,0.32);
}
body.theme-nordic .chip-bad {
  background: rgba(209,117,117,0.18);
  border-color: rgba(209,117,117,0.34);
}
body.theme-nordic textarea,
body.theme-nordic select,
body.theme-nordic input[type="text"],
body.theme-nordic input[type="password"],
body.theme-nordic input[type="number"] {
  background: rgba(255,255,255,0.97);
  border: 1px solid rgba(214,207,196,0.75);
  color: #1a2539;
  box-shadow: inset 0 0 0 1px rgba(214,207,196,0.4);
}
body.theme-nordic textarea:focus,
body.theme-nordic select:focus,
body.theme-nordic input[type="text"]:focus,
body.theme-nordic input[type="password"]:focus,
body.theme-nordic input[type="number"]:focus {
  border-color: rgba(29,78,216,0.45);
  box-shadow: 0 0 0 3px rgba(29,78,216,0.18);
}
body.theme-nordic button {
  background: linear-gradient(130deg, rgba(29,78,216,0.95) 0%, rgba(59,130,246,0.9) 50%, rgba(165,180,252,0.88) 100%);
  border: 1px solid rgba(29,78,216,0.4);
  color: #f8fafc;
  box-shadow: 0 18px 38px rgba(29,78,216,0.3);
  transition: transform .16s ease, box-shadow .16s ease;
  font-weight: 600;
}
body.theme-nordic button:hover:not([disabled]),
body.theme-nordic button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 22px 46px rgba(29,78,216,0.34);
}
body.theme-nordic button.secondary {
  background: rgba(255,255,255,0.94);
  color: rgba(42,56,75,0.82);
  border: 1px solid rgba(214,207,196,0.75);
  box-shadow: 0 12px 24px rgba(182,190,198,0.2);
}
body.theme-nordic button.secondary:hover:not([disabled]),
body.theme-nordic button.secondary:focus-visible {
  background: rgba(239,234,225,0.92);
  color: #1a2539;
}
body.theme-nordic .copy-btn,
body.theme-nordic .icon-btn {
  background: rgba(255,255,255,0.92);
  border: 1px solid rgba(214,207,196,0.72);
  color: rgba(54,65,82,0.82);
  box-shadow: 0 12px 24px rgba(182,190,198,0.18);
}
body.theme-nordic .copy-btn:hover,
body.theme-nordic .icon-btn:hover {
  border-color: rgba(29,78,216,0.38);
  color: #1a2539;
}
body.theme-nordic th,
body.theme-nordic td {
  border-bottom-color: rgba(214,207,196,0.7);
}
body.theme-nordic th {
  background: rgba(255,255,255,0.96);
  color: rgba(42,56,75,0.82);
  box-shadow: inset 0 -1px 0 0 rgba(214,207,196,0.6);
}
body.theme-nordic footer {
  background: rgba(255,255,255,0.96);
  border-top: 1px solid rgba(214,207,196,0.65);
  box-shadow: 0 -16px 30px rgba(182,190,198,0.16);
  color: rgba(71,85,105,0.7);
}
body.theme-nordic .muted {
  color: rgba(112,122,134,0.66);
}
body.theme-nordic .spinner {
  border-color: rgba(214,207,196,0.65);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-nordic main {
    margin: 26px 12px;
    padding: 26px 20px;
  }
}

/* Retrowave theme embraces neon sunsets and synth-glow panels */
body.theme-retrowave {
  position: relative;
  background: radial-gradient(125% 125% at 18% -10%, rgba(255,77,141,0.28) 0%, rgba(18,4,32,0.96) 55%, rgba(8,1,16,1) 100%);
  color: var(--fg);
  letter-spacing: 0.01em;
  overflow-x: hidden;
}
body.theme-retrowave::before,
body.theme-retrowave::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
body.theme-retrowave::before {
  background:
    radial-gradient(38% 35% at 82% 18%, rgba(255,200,113,0.32) 0%, rgba(255,200,113,0) 70%),
    radial-gradient(36% 40% at 16% 80%, rgba(152,86,255,0.28) 0%, rgba(152,86,255,0) 72%);
  mix-blend-mode: screen;
  opacity: 0.7;
}
body.theme-retrowave::after {
  inset: -50%;
  background: repeating-linear-gradient(170deg, rgba(255,77,141,0.18) 0 1px, transparent 1px 6px);
  opacity: 0.2;
  transform: rotate(-1.5deg);
}
body.theme-retrowave header,
body.theme-retrowave main,
body.theme-retrowave .banner,
body.theme-retrowave footer {
  position: relative;
  z-index: 1;
}
body.theme-retrowave header { z-index: 20; }
body.theme-retrowave .banner { z-index: 12; }
body.theme-retrowave main { z-index: 8; }
body.theme-retrowave footer { z-index: 6; }
body.theme-retrowave header {
  background: linear-gradient(120deg, rgba(45,8,73,0.95) 0%, rgba(67,11,112,0.9) 45%, rgba(116,25,130,0.85) 100%);
  border-bottom: 1px solid rgba(255,77,141,0.35);
  box-shadow: 0 18px 38px rgba(5,2,12,0.85);
}
body.theme-retrowave h1 a {
  letter-spacing: 0.03em;
  text-transform: uppercase;
  font-weight: 700;
  color: #ffe0f4;
  text-shadow: 0 0 22px rgba(255,77,141,0.5), 0 0 40px rgba(255,200,113,0.32);
}
body.theme-retrowave a {
  color: rgba(255,184,255,0.85);
  transition: color .18s ease, text-shadow .18s ease;
}
body.theme-retrowave a:hover {
  color: #ff97ff;
  text-shadow: 0 0 18px rgba(255,200,113,0.4);
}
body.theme-retrowave .module-inline a,
body.theme-retrowave .nav-right > a,
body.theme-retrowave .admin-item > a {
  background: rgba(29,8,52,0.85);
  border: 1px solid rgba(255,77,141,0.32);
  color: rgba(255,212,255,0.88);
  box-shadow: 0 16px 36px rgba(5,2,12,0.82), inset 0 0 0 1px rgba(152,86,255,0.28);
}
body.theme-retrowave .module-inline a:hover,
body.theme-retrowave .nav-right > a:hover,
body.theme-retrowave .admin-item > a:hover {
  background: rgba(255,77,141,0.2);
  color: #ffffff;
  box-shadow: 0 18px 42px rgba(5,2,12,0.88), 0 0 22px rgba(255,200,113,0.36);
}
body.theme-retrowave .module-inline a.active,
body.theme-retrowave .nav-right > a.active,
body.theme-retrowave .admin-item > a.active {
  background: rgba(152,86,255,0.2);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255,200,113,0.38), 0 0 24px rgba(255,77,141,0.32);
}
body.theme-retrowave .module-inline a::after {
  background: rgba(255,200,113,0.82);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(255,200,113,0.45);
}
body.theme-retrowave .pill-btn {
  background: rgba(29,8,52,0.88);
  border: 1px solid rgba(255,77,141,0.34);
  color: rgba(255,212,255,0.9);
  box-shadow: 0 16px 36px rgba(5,2,12,0.84);
}
body.theme-retrowave .pill-btn:hover,
body.theme-retrowave .pill-btn:focus-visible {
  background: rgba(255,77,141,0.24);
  border-color: rgba(255,200,113,0.45);
  box-shadow: 0 0 22px rgba(255,200,113,0.45);
}
body.theme-retrowave .pill-btn.active::after {
  opacity: 0.55;
  border-color: rgba(255,200,113,0.55);
  box-shadow: 0 0 18px rgba(255,200,113,0.42);
}
body.theme-retrowave .tools-menu,
body.theme-retrowave .module-menu,
body.theme-retrowave .admin-menu {
  background: rgba(21,6,40,0.94);
  border: 1px solid rgba(255,77,141,0.3);
  box-shadow: 0 30px 64px rgba(5,2,12,0.9), 0 0 24px rgba(152,86,255,0.24);
  backdrop-filter: saturate(1.4) blur(14px);
}
body.theme-retrowave .tools-menu a,
body.theme-retrowave .module-menu a,
body.theme-retrowave .admin-menu .admin-item > a {
  color: rgba(255,212,255,0.88);
}
body.theme-retrowave .tools-menu a:hover,
body.theme-retrowave .module-menu a:hover,
body.theme-retrowave .admin-menu .admin-item > a:hover {
  background: rgba(255,77,141,0.22);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(255,200,113,0.32);
}
body.theme-retrowave main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(27,7,48,0.92);
  border: 1px solid rgba(255,77,141,0.28);
  border-radius: 28px;
  box-shadow: 0 42px 96px rgba(5,2,12,0.88);
  overflow: hidden;
}
body.theme-retrowave main::before {
  content: '';
  position: absolute;
  inset: 20px;
  border-radius: 22px;
  border: 1px solid rgba(255,200,113,0.2);
  opacity: 0.45;
  pointer-events: none;
}
body.theme-retrowave .banner {
  background: rgba(29,8,52,0.85);
  border: 1px solid rgba(255,77,141,0.3);
  color: rgba(255,212,255,0.88);
  box-shadow: 0 14px 32px rgba(5,2,12,0.8);
}
body.theme-retrowave .banner.public {
  background: rgba(34,12,64,0.85);
  border-color: rgba(152,86,255,0.35);
  color: rgba(233,213,255,0.9);
}
body.theme-retrowave .banner.local {
  background: rgba(55,10,60,0.82);
  color: rgba(255,210,230,0.88);
}
body.theme-retrowave .panel {
  position: relative;
  background: linear-gradient(150deg, rgba(33,8,54,0.95) 0%, rgba(24,5,41,0.96) 100%);
  border: 1px solid rgba(255,77,141,0.3);
  border-radius: 18px;
  box-shadow: 0 26px 58px rgba(5,2,12,0.82);
  overflow: hidden;
}
body.theme-retrowave .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(255,77,141,0.22), rgba(152,86,255,0.14));
  pointer-events: none;
}
body.theme-retrowave .chip {
  background: rgba(255,77,141,0.2);
  border-color: rgba(255,200,113,0.32);
  color: rgba(255,212,255,0.9);
  box-shadow: 0 0 18px rgba(255,77,141,0.3);
}
body.theme-retrowave .chip-ok {
  background: rgba(59,130,246,0.2);
  border-color: rgba(37,99,235,0.4);
  color: rgba(210,230,255,0.9);
}
body.theme-retrowave .chip-bad {
  background: rgba(255,99,99,0.22);
  border-color: rgba(255,143,143,0.42);
  color: rgba(255,215,215,0.9);
}
body.theme-retrowave textarea,
body.theme-retrowave select,
body.theme-retrowave input[type="text"],
body.theme-retrowave input[type="password"],
body.theme-retrowave input[type="number"] {
  background: rgba(15,3,28,0.92);
  border: 1px solid rgba(255,77,141,0.3);
  color: #f8f5ff;
  box-shadow: inset 0 0 0 1px rgba(152,86,255,0.14);
}
body.theme-retrowave textarea:focus,
body.theme-retrowave select:focus,
body.theme-retrowave input[type="text"]:focus,
body.theme-retrowave input[type="password"]:focus,
body.theme-retrowave input[type="number"]:focus {
  border-color: rgba(255,200,113,0.55);
  box-shadow: 0 0 0 3px rgba(255,77,141,0.24);
}
body.theme-retrowave button {
  position: relative;
  background: linear-gradient(125deg, rgba(255,77,141,1) 0%, rgba(255,154,106,0.95) 55%, rgba(255,224,163,0.92) 100%);
  border: 1px solid rgba(255,200,113,0.45);
  color: #2b052d;
  box-shadow: 0 22px 58px rgba(5,2,12,0.88), 0 0 24px rgba(255,77,141,0.35);
  transition: transform .16s ease, box-shadow .16s ease;
  font-weight: 700;
}
body.theme-retrowave button:hover:not([disabled]),
body.theme-retrowave button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 26px 64px rgba(5,2,12,0.9), 0 0 30px rgba(255,200,113,0.45);
}
body.theme-retrowave button.secondary {
  background: rgba(29,8,52,0.9);
  color: rgba(255,212,255,0.88);
  border: 1px solid rgba(255,77,141,0.34);
  box-shadow: 0 16px 40px rgba(5,2,12,0.84);
}
body.theme-retrowave button.secondary:hover:not([disabled]),
body.theme-retrowave button.secondary:focus-visible {
  background: rgba(255,77,141,0.24);
  color: #ffffff;
}
body.theme-retrowave .copy-btn,
body.theme-retrowave .icon-btn {
  background: rgba(29,8,52,0.86);
  border: 1px solid rgba(255,77,141,0.32);
  color: rgba(255,212,255,0.88);
  box-shadow: 0 14px 34px rgba(5,2,12,0.82);
}
body.theme-retrowave .copy-btn:hover,
body.theme-retrowave .icon-btn:hover {
  border-color: rgba(255,200,113,0.5);
  color: #ffffff;
}
body.theme-retrowave th,
body.theme-retrowave td {
  border-bottom-color: rgba(255,77,141,0.28);
}
body.theme-retrowave th {
  background: rgba(29,8,52,0.9);
  color: rgba(255,212,255,0.88);
  box-shadow: inset 0 -1px 0 0 rgba(255,77,141,0.28);
}
body.theme-retrowave footer {
  background: rgba(23,6,40,0.92);
  border-top: 1px solid rgba(255,77,141,0.3);
  box-shadow: 0 -20px 42px rgba(5,2,12,0.82);
  color: rgba(255,205,240,0.78);
}
body.theme-retrowave .muted {
  color: rgba(255,205,240,0.65);
}
body.theme-retrowave .spinner {
  border-color: rgba(255,77,141,0.3);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-retrowave main {
    margin: 28px 12px;
    padding: 28px 20px;
  }
}

/* Rose theme enhancements deliver a soft neon bloom aesthetic */
body.theme-rose {
  position: relative;
  background: linear-gradient(155deg, #fff1f5 0%, #ffe4ec 45%, #ffe9f4 100%);
  color: var(--fg);
  letter-spacing: 0.005em;
  overflow-x: hidden;
}
body.theme-rose::before {
  content: '';
  position: fixed;
  inset: -18% -8%;
  background:
    radial-gradient(42% 36% at 18% 16%, rgba(251,113,133,0.28) 0%, rgba(251,113,133,0) 70%),
    radial-gradient(36% 34% at 76% 12%, rgba(244,114,182,0.25) 0%, rgba(244,114,182,0) 75%),
    radial-gradient(48% 46% at 52% 80%, rgba(254,205,211,0.35) 0%, rgba(254,205,211,0) 70%);
  mix-blend-mode: screen;
  pointer-events: none;
  opacity: 0.9;
  z-index: 0;
}
body.theme-rose header,
body.theme-rose main,
body.theme-rose .banner,
body.theme-rose footer {
  position: relative;
  z-index: 1;
}
body.theme-rose header { z-index: 20; }
body.theme-rose .banner { z-index: 12; }
body.theme-rose main { z-index: 8; }
body.theme-rose footer { z-index: 6; }
body.theme-rose header {
  background: linear-gradient(120deg, rgba(255,239,242,0.95) 0%, rgba(254,205,211,0.85) 55%, rgba(244,114,182,0.72) 100%);
  border-bottom: 1px solid rgba(244,114,182,0.32);
  box-shadow: 0 14px 28px rgba(186,44,100,0.18);
}
body.theme-rose h1 a {
  letter-spacing: 0.02em;
  color: #be185d;
  text-shadow: 0 4px 12px rgba(244,114,182,0.35);
}
body.theme-rose a {
  color: rgba(190,24,93,0.85);
  transition: color .16s ease, box-shadow .16s ease, background .16s ease;
}
body.theme-rose a:hover {
  color: #9d174d;
}
body.theme-rose .module-inline a,
body.theme-rose .nav-right > a,
body.theme-rose .admin-item > a {
  background: rgba(255,241,245,0.92);
  border: 1px solid rgba(254,205,211,0.55);
  color: rgba(159,18,57,0.86);
  box-shadow: 0 12px 24px rgba(190,24,93,0.18);
}
body.theme-rose .module-inline a:hover,
body.theme-rose .nav-right > a:hover,
body.theme-rose .admin-item > a:hover {
  background: rgba(254,205,211,0.92);
  color: #8a113f;
  box-shadow: 0 16px 28px rgba(190,24,93,0.2);
}
body.theme-rose .module-inline a.active,
body.theme-rose .nav-right > a.active,
body.theme-rose .admin-item > a.active {
  background: rgba(251,113,133,0.9);
  color: #fff1f5;
  box-shadow: inset 0 0 0 1px rgba(190,24,93,0.45);
}
body.theme-rose .module-inline a::after {
  background: rgba(190,24,93,0.8);
}
body.theme-rose .pill-btn {
  background: rgba(255,241,245,0.93);
  border: 1px solid rgba(254,205,211,0.55);
  color: rgba(157,23,77,0.88);
  box-shadow: 0 12px 26px rgba(190,24,93,0.18);
}
body.theme-rose .pill-btn:hover,
body.theme-rose .pill-btn:focus-visible {
  background: rgba(254,205,211,0.94);
  border-color: rgba(236,72,153,0.52);
  box-shadow: 0 16px 30px rgba(190,24,93,0.22);
}
body.theme-rose .pill-btn.active::after {
  opacity: 0.45;
  border-color: rgba(236,72,153,0.65);
}
body.theme-rose .tools-menu,
body.theme-rose .module-menu,
body.theme-rose .admin-menu {
  background: rgba(255,243,248,0.96);
  border: 1px solid rgba(254,205,211,0.5);
  box-shadow: 0 28px 44px rgba(190,24,93,0.24);
  backdrop-filter: saturate(1.45) blur(12px);
}
body.theme-rose .tools-menu a,
body.theme-rose .module-menu a,
body.theme-rose .admin-menu .admin-item > a {
  color: rgba(157,23,77,0.88);
}
body.theme-rose .tools-menu a:hover,
body.theme-rose .module-menu a:hover,
body.theme-rose .admin-menu .admin-item > a:hover {
  background: rgba(254,205,211,0.36);
  color: #8a113f;
}
body.theme-rose main {
  position: relative;
  margin: 32px auto;
  padding: 32px 28px;
  background: rgba(255,243,248,0.94);
  border: 1px solid rgba(254,205,211,0.5);
  border-radius: 22px;
  box-shadow: 0 32px 60px rgba(190,24,93,0.18);
  overflow: hidden;
}
body.theme-rose main::before {
  content: '';
  position: absolute;
  inset: 14px;
  border-radius: 18px;
  border: 1px solid rgba(254,205,211,0.35);
  pointer-events: none;
}
body.theme-rose .banner {
  background: rgba(255,241,245,0.96);
  border: 1px solid rgba(254,205,211,0.5);
  color: rgba(157,23,77,0.88);
  box-shadow: 0 14px 24px rgba(190,24,93,0.18);
}
body.theme-rose .banner.public {
  background: rgba(240,253,244,0.92);
  border-color: rgba(34,197,94,0.28);
  color: rgba(20,83,45,0.85);
}
body.theme-rose .banner.local {
  background: rgba(254,215,170,0.92);
  color: rgba(134,46,12,0.9);
}
body.theme-rose .panel {
  position: relative;
  background: linear-gradient(165deg, rgba(255,245,248,0.98) 0%, rgba(255,232,240,0.96) 100%);
  border: 1px solid rgba(254,205,211,0.5);
  border-radius: 18px;
  box-shadow: 0 20px 36px rgba(190,24,93,0.2);
  overflow: hidden;
}
body.theme-rose .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(254,205,211,0.18), rgba(255,255,255,0.25));
  pointer-events: none;
  opacity: 0.65;
}
body.theme-rose .chip {
  background: rgba(255,241,245,0.96);
  border-color: rgba(254,205,211,0.55);
  color: rgba(157,23,77,0.88);
  box-shadow: 0 6px 14px rgba(190,24,93,0.18);
}
body.theme-rose .chip-ok {
  background: rgba(187,247,208,0.92);
  border-color: rgba(34,197,94,0.38);
}
body.theme-rose .chip-bad {
  background: rgba(254,226,226,0.92);
  border-color: rgba(248,113,113,0.45);
}
body.theme-rose textarea,
body.theme-rose select,
body.theme-rose input[type="text"],
body.theme-rose input[type="password"],
body.theme-rose input[type="number"] {
  background: rgba(255,241,245,0.95);
  border: 1px solid rgba(254,205,211,0.5);
  color: #8a113f;
  box-shadow: inset 0 0 0 1px rgba(236,72,153,0.12);
}
body.theme-rose textarea:focus,
body.theme-rose select:focus,
body.theme-rose input[type="text"]:focus,
body.theme-rose input[type="password"]:focus,
body.theme-rose input[type="number"]:focus {
  border-color: rgba(236,72,153,0.75);
  box-shadow: 0 0 0 3px rgba(254,205,211,0.35);
}
body.theme-rose button {
  background: linear-gradient(135deg, rgba(254,205,211,1) 0%, rgba(251,113,133,0.95) 55%, rgba(244,114,182,0.95) 100%);
  border: 1px solid rgba(236,72,153,0.45);
  color: #4c0519;
  box-shadow: 0 16px 36px rgba(190,24,93,0.24);
  transition: transform .16s ease, box-shadow .16s ease;
  font-weight: 600;
}
body.theme-rose button:hover:not([disabled]),
body.theme-rose button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 20px 46px rgba(190,24,93,0.28);
}
body.theme-rose button.secondary {
  background: rgba(255,241,245,0.94);
  color: rgba(157,23,77,0.88);
  border: 1px solid rgba(254,205,211,0.55);
  box-shadow: 0 12px 24px rgba(190,24,93,0.18);
}
body.theme-rose button.secondary:hover:not([disabled]),
body.theme-rose button.secondary:focus-visible {
  background: rgba(254,205,211,0.96);
  color: #8a113f;
}
body.theme-rose .copy-btn,
body.theme-rose .icon-btn {
  background: rgba(255,241,245,0.94);
  border: 1px solid rgba(254,205,211,0.55);
  color: rgba(157,23,77,0.9);
  box-shadow: 0 10px 22px rgba(190,24,93,0.18);
}
body.theme-rose .copy-btn:hover,
body.theme-rose .icon-btn:hover {
  border-color: rgba(236,72,153,0.52);
  color: #8a113f;
}
body.theme-rose th,
body.theme-rose td {
  border-bottom-color: rgba(254,205,211,0.45);
}
body.theme-rose th {
  background: rgba(255,241,245,0.96);
  color: rgba(157,23,77,0.88);
  box-shadow: inset 0 -1px 0 0 rgba(254,205,211,0.4);
}
body.theme-rose footer {
  background: rgba(255,241,245,0.94);
  border-top: 1px solid rgba(254,205,211,0.5);
  box-shadow: 0 -18px 26px rgba(190,24,93,0.18);
  color: rgba(157,23,77,0.85);
}
body.theme-rose .muted {
  color: rgba(190,24,93,0.72);
}
@media (max-width: 700px) {
  body.theme-rose main {
    margin: 26px 12px;
    padding: 26px 20px;
  }
}

/* Grape theme enhancements bring a neon-violet cityscape vibe */
body.theme-grape {
  position: relative;
  background: radial-gradient(145% 145% at 12% 6%, rgba(139,92,246,0.32) 0%, rgba(26,16,39,1) 55%, rgba(12,6,22,1) 100%);
  color: var(--fg);
  letter-spacing: 0.01em;
  overflow-x: hidden;
}
body.theme-grape::before,
body.theme-grape::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
body.theme-grape::before {
  background:
    radial-gradient(35% 32% at 80% 18%, rgba(236,72,153,0.28) 0%, rgba(236,72,153,0) 70%),
    radial-gradient(30% 38% at 16% 78%, rgba(139,92,246,0.3) 0%, rgba(139,92,246,0) 75%);
  mix-blend-mode: screen;
  opacity: 0.75;
}
body.theme-grape::after {
  inset: -40%;
  background: repeating-linear-gradient(120deg, rgba(139,92,246,0.1) 0 1px, transparent 1px 6px);
  opacity: 0.22;
  transform: rotate(-2deg);
}
body.theme-grape header,
body.theme-grape main,
body.theme-grape .banner,
body.theme-grape footer {
  position: relative;
  z-index: 1;
}
body.theme-grape header { z-index: 20; }
body.theme-grape .banner { z-index: 12; }
body.theme-grape main { z-index: 8; }
body.theme-grape footer { z-index: 6; }
body.theme-grape header {
  background: linear-gradient(125deg, rgba(35,19,54,0.95) 0%, rgba(44,22,66,0.9) 40%, rgba(71,24,71,0.85) 100%);
  border-bottom: 1px solid rgba(139,92,246,0.38);
  box-shadow: 0 16px 36px rgba(10,6,18,0.85);
}
body.theme-grape h1 a {
  letter-spacing: 0.025em;
  text-transform: uppercase;
  font-weight: 700;
  text-shadow: 0 0 24px rgba(139,92,246,0.55), 0 0 36px rgba(236,72,153,0.35);
}
body.theme-grape a {
  color: rgba(233,213,255,0.92);
  transition: color .18s ease, text-shadow .18s ease, box-shadow .18s ease;
}
body.theme-grape a:hover {
  color: #f6edff;
  text-shadow: 0 0 18px rgba(139,92,246,0.55);
}
body.theme-grape .module-inline a,
body.theme-grape .nav-right > a,
body.theme-grape .admin-item > a {
  background: rgba(44,22,66,0.78);
  border: 1px solid rgba(139,92,246,0.28);
  color: rgba(233,213,255,0.88);
  box-shadow: 0 14px 34px rgba(10,6,18,0.8), inset 0 0 0 1px rgba(236,72,153,0.18);
}
body.theme-grape .module-inline a:hover,
body.theme-grape .nav-right > a:hover,
body.theme-grape .admin-item > a:hover {
  background: rgba(139,92,246,0.22);
  color: #ffffff;
  box-shadow: 0 16px 40px rgba(10,6,18,0.85), 0 0 20px rgba(236,72,153,0.32);
}
body.theme-grape .module-inline a.active,
body.theme-grape .nav-right > a.active,
body.theme-grape .admin-item > a.active {
  background: rgba(236,72,153,0.2);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(139,92,246,0.45), 0 0 24px rgba(139,92,246,0.32);
}
body.theme-grape .module-inline a::after {
  background: rgba(139,92,246,0.9);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 14px rgba(139,92,246,0.5);
}
body.theme-grape .pill-btn {
  background: rgba(44,22,66,0.78);
  border: 1px solid rgba(139,92,246,0.3);
  color: rgba(233,213,255,0.9);
  box-shadow: 0 12px 30px rgba(10,6,18,0.78);
}
body.theme-grape .pill-btn:hover,
body.theme-grape .pill-btn:focus-visible {
  background: rgba(139,92,246,0.24);
  border-color: rgba(236,72,153,0.5);
  box-shadow: 0 0 22px rgba(139,92,246,0.5);
}
body.theme-grape .pill-btn.active::after {
  opacity: 0.6;
  border-color: rgba(236,72,153,0.6);
  box-shadow: 0 0 18px rgba(236,72,153,0.45);
}
body.theme-grape .tools-menu,
body.theme-grape .module-menu,
body.theme-grape .admin-menu {
  background: rgba(35,19,54,0.95);
  border: 1px solid rgba(139,92,246,0.28);
  box-shadow: 0 30px 60px rgba(10,6,18,0.88), 0 0 22px rgba(236,72,153,0.24);
  backdrop-filter: saturate(1.6) blur(14px);
}
body.theme-grape .tools-menu a,
body.theme-grape .module-menu a,
body.theme-grape .admin-menu .admin-item > a {
  color: rgba(233,213,255,0.88);
}
body.theme-grape .tools-menu a:hover,
body.theme-grape .module-menu a:hover,
body.theme-grape .admin-menu .admin-item > a:hover {
  background: rgba(139,92,246,0.22);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(236,72,153,0.32);
}
body.theme-grape main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(32,18,48,0.92);
  border: 1px solid rgba(139,92,246,0.28);
  border-radius: 24px;
  box-shadow: 0 34px 84px rgba(6,3,12,0.85);
  overflow: hidden;
}
body.theme-grape main::before {
  content: '';
  position: absolute;
  inset: 18px;
  border-radius: 18px;
  border: 1px solid rgba(236,72,153,0.24);
  opacity: 0.55;
  pointer-events: none;
}
body.theme-grape .banner {
  background: rgba(44,22,66,0.84);
  border: 1px solid rgba(139,92,246,0.28);
  color: rgba(233,213,255,0.88);
  box-shadow: 0 12px 32px rgba(6,3,12,0.72);
}
body.theme-grape .banner.public {
  background: rgba(32,58,48,0.84);
  border-color: rgba(16,185,129,0.35);
  color: rgba(199,255,232,0.9);
}
body.theme-grape .banner.local {
  background: rgba(64,24,54,0.82);
  color: rgba(255,213,238,0.88);
}
body.theme-grape .panel {
  position: relative;
  background: linear-gradient(155deg, rgba(34,20,52,0.95) 0%, rgba(24,14,38,0.95) 100%);
  border: 1px solid rgba(139,92,246,0.32);
  border-radius: 18px;
  box-shadow: 0 24px 52px rgba(6,3,12,0.8);
  overflow: hidden;
}
body.theme-grape .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(139,92,246,0.22), rgba(236,72,153,0.12));
  pointer-events: none;
}
body.theme-grape .chip {
  background: rgba(139,92,246,0.2);
  border-color: rgba(236,72,153,0.38);
  color: rgba(233,213,255,0.88);
  box-shadow: 0 0 18px rgba(139,92,246,0.3);
}
body.theme-grape .chip-ok {
  background: rgba(45,212,191,0.22);
  border-color: rgba(16,185,129,0.4);
  color: rgba(199,255,232,0.9);
}
body.theme-grape .chip-bad {
  background: rgba(244,63,94,0.24);
  border-color: rgba(248,113,113,0.45);
  color: rgba(255,205,214,0.9);
}
body.theme-grape textarea,
body.theme-grape select,
body.theme-grape input[type="text"],
body.theme-grape input[type="password"],
body.theme-grape input[type="number"] {
  background: rgba(22,12,34,0.92);
  border: 1px solid rgba(139,92,246,0.28);
  color: #f4edff;
  box-shadow: inset 0 0 0 1px rgba(236,72,153,0.16);
}
body.theme-grape textarea:focus,
body.theme-grape select:focus,
body.theme-grape input[type="text"]:focus,
body.theme-grape input[type="password"]:focus,
body.theme-grape input[type="number"]:focus {
  border-color: rgba(236,72,153,0.75);
  box-shadow: 0 0 0 3px rgba(139,92,246,0.35);
}
body.theme-grape button {
  position: relative;
  background: linear-gradient(120deg, rgba(236,72,153,1) 0%, rgba(139,92,246,0.95) 60%, rgba(147,197,253,0.95) 100%);
  border: 1px solid rgba(139,92,246,0.45);
  color: #1c0d2a;
  box-shadow: 0 20px 52px rgba(6,3,12,0.85), 0 0 24px rgba(139,92,246,0.36);
  transition: transform .18s ease, box-shadow .18s ease;
  font-weight: 700;
}
body.theme-grape button:hover:not([disabled]),
body.theme-grape button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 24px 60px rgba(6,3,12,0.9), 0 0 30px rgba(236,72,153,0.45);
}
body.theme-grape button.secondary {
  background: rgba(44,22,66,0.8);
  color: rgba(233,213,255,0.9);
  border: 1px solid rgba(139,92,246,0.35);
  box-shadow: 0 14px 38px rgba(6,3,12,0.78);
}
body.theme-grape button.secondary:hover:not([disabled]),
body.theme-grape button.secondary:focus-visible {
  background: rgba(139,92,246,0.24);
  color: #ffffff;
}
body.theme-grape .copy-btn,
body.theme-grape .icon-btn {
  background: rgba(44,22,66,0.84);
  border: 1px solid rgba(139,92,246,0.32);
  color: rgba(233,213,255,0.88);
  box-shadow: 0 14px 34px rgba(6,3,12,0.8);
}
body.theme-grape .copy-btn:hover,
body.theme-grape .icon-btn:hover {
  border-color: rgba(236,72,153,0.55);
  color: #ffffff;
}
body.theme-grape th,
body.theme-grape td {
  border-bottom-color: rgba(139,92,246,0.32);
}
body.theme-grape th {
  background: rgba(32,18,48,0.9);
  color: rgba(233,213,255,0.9);
  box-shadow: inset 0 -1px 0 0 rgba(139,92,246,0.32);
}
body.theme-grape footer {
  background: rgba(28,16,44,0.9);
  border-top: 1px solid rgba(139,92,246,0.32);
  box-shadow: 0 -22px 48px rgba(6,3,12,0.82);
  color: rgba(207,180,255,0.85);
}
body.theme-grape .muted {
  color: rgba(206,161,255,0.78);
}
body.theme-grape .spinner {
  border-color: rgba(139,92,246,0.32);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-grape main {
    margin: 28px 12px;
    padding: 28px 20px;
  }
}

/* Amber theme enhancements add luminous sunset-glow polish */
body.theme-amber {
  position: relative;
  background: linear-gradient(160deg, #fff9eb 0%, #fff4d5 45%, #ffeed0 100%);
  color: var(--fg);
  letter-spacing: 0.005em;
  overflow-x: hidden;
}
body.theme-amber::before {
  content: '';
  position: fixed;
  inset: -18% -8%;
  background:
    radial-gradient(42% 38% at 18% 20%, rgba(254,215,102,0.35) 0%, rgba(254,215,102,0) 70%),
    radial-gradient(35% 30% at 78% 16%, rgba(253,230,138,0.28) 0%, rgba(253,230,138,0) 75%),
    radial-gradient(45% 40% at 54% 82%, rgba(250,204,21,0.26) 0%, rgba(250,204,21,0) 70%);
  pointer-events: none;
  mix-blend-mode: screen;
  opacity: 0.9;
  z-index: 0;
}
body.theme-amber header,
body.theme-amber main,
body.theme-amber .banner,
body.theme-amber footer {
  position: relative;
  z-index: 1;
}
body.theme-amber header { z-index: 20; }
body.theme-amber .banner { z-index: 12; }
body.theme-amber main { z-index: 8; }
body.theme-amber footer { z-index: 6; }
body.theme-amber header {
  background: linear-gradient(120deg, rgba(255,244,214,0.95) 0%, rgba(253,224,138,0.82) 55%, rgba(251,191,36,0.68) 100%);
  border-bottom: 1px solid rgba(234,179,8,0.32);
  box-shadow: 0 14px 28px rgba(120,64,0,0.18);
}
body.theme-amber h1 a {
  letter-spacing: 0.02em;
  color: #a16207;
  text-shadow: 0 4px 10px rgba(234,179,8,0.3);
}
body.theme-amber a {
  color: rgba(146,64,14,0.85);
  transition: color .16s ease, box-shadow .16s ease, background .16s ease;
}
body.theme-amber a:hover {
  color: #9a3412;
}
body.theme-amber .module-inline a,
body.theme-amber .nav-right > a,
body.theme-amber .admin-item > a {
  background: rgba(255,247,223,0.88);
  border: 1px solid rgba(253,224,138,0.55);
  color: rgba(120,64,0,0.86);
  box-shadow: 0 10px 20px rgba(147,85,16,0.16);
}
body.theme-amber .module-inline a:hover,
body.theme-amber .nav-right > a:hover,
body.theme-amber .admin-item > a:hover {
  background: rgba(253,224,138,0.9);
  color: #5f3700;
  box-shadow: 0 14px 26px rgba(147,85,16,0.18);
}
body.theme-amber .module-inline a.active,
body.theme-amber .nav-right > a.active,
body.theme-amber .admin-item > a.active {
  background: rgba(252,211,77,0.95);
  color: #5f3700;
  box-shadow: inset 0 0 0 1px rgba(217,119,6,0.45);
}
body.theme-amber .module-inline a::after {
  background: rgba(217,119,6,0.8);
}
body.theme-amber .pill-btn {
  background: rgba(255,247,223,0.9);
  border: 1px solid rgba(253,224,138,0.55);
  color: rgba(120,64,0,0.9);
  box-shadow: 0 12px 24px rgba(147,85,16,0.18);
}
body.theme-amber .pill-btn:hover,
body.theme-amber .pill-btn:focus-visible {
  background: rgba(253,224,138,0.95);
  border-color: rgba(217,119,6,0.55);
  box-shadow: 0 16px 30px rgba(147,85,16,0.2);
}
body.theme-amber .pill-btn.active::after {
  opacity: 0.45;
  border-color: rgba(217,119,6,0.65);
}
body.theme-amber .tools-menu,
body.theme-amber .module-menu,
body.theme-amber .admin-menu {
  background: rgba(255,250,235,0.96);
  border: 1px solid rgba(253,224,138,0.45);
  box-shadow: 0 28px 44px rgba(147,85,16,0.22);
  backdrop-filter: saturate(1.35) blur(12px);
}
body.theme-amber .tools-menu a,
body.theme-amber .module-menu a,
body.theme-amber .admin-menu .admin-item > a {
  color: rgba(120,64,0,0.88);
}
body.theme-amber .tools-menu a:hover,
body.theme-amber .module-menu a:hover,
body.theme-amber .admin-menu .admin-item > a:hover {
  background: rgba(253,224,138,0.4);
  color: #5f3700;
}
body.theme-amber main {
  position: relative;
  margin: 32px auto;
  padding: 32px 28px;
  background: rgba(255,250,235,0.94);
  border: 1px solid rgba(253,224,138,0.45);
  border-radius: 22px;
  box-shadow: 0 32px 60px rgba(147,85,16,0.16);
  overflow: hidden;
}
body.theme-amber main::before {
  content: '';
  position: absolute;
  inset: 14px;
  border-radius: 18px;
  border: 1px solid rgba(253,224,138,0.3);
  pointer-events: none;
}
body.theme-amber .banner {
  background: rgba(255,247,223,0.96);
  border: 1px solid rgba(253,224,138,0.45);
  color: rgba(120,64,0,0.88);
  box-shadow: 0 14px 24px rgba(147,85,16,0.18);
}
body.theme-amber .banner.public {
  background: rgba(240,253,244,0.92);
  border-color: rgba(34,197,94,0.28);
  color: rgba(20,83,45,0.85);
}
body.theme-amber .banner.local {
  background: rgba(254,249,195,0.9);
  color: rgba(113,63,18,0.88);
}
body.theme-amber .panel {
  position: relative;
  background: linear-gradient(165deg, rgba(255,249,227,0.98) 0%, rgba(255,239,198,0.96) 100%);
  border: 1px solid rgba(253,224,138,0.45);
  border-radius: 18px;
  box-shadow: 0 20px 36px rgba(147,85,16,0.16);
  overflow: hidden;
}
body.theme-amber .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(253,224,138,0.18), rgba(255,255,255,0.25));
  pointer-events: none;
  opacity: 0.65;
}
body.theme-amber .chip {
  background: rgba(255,247,223,0.96);
  border-color: rgba(253,224,138,0.55);
  color: rgba(120,64,0,0.88);
  box-shadow: 0 6px 14px rgba(147,85,16,0.16);
}
body.theme-amber .chip-ok {
  background: rgba(187,247,208,0.92);
  border-color: rgba(34,197,94,0.38);
}
body.theme-amber .chip-bad {
  background: rgba(254,226,226,0.92);
  border-color: rgba(248,113,113,0.45);
}
body.theme-amber textarea,
body.theme-amber select,
body.theme-amber input[type="text"],
body.theme-amber input[type="password"],
body.theme-amber input[type="number"] {
  background: rgba(255,247,223,0.95);
  border: 1px solid rgba(253,224,138,0.5);
  color: #5f3700;
  box-shadow: inset 0 0 0 1px rgba(217,119,6,0.1);
}
body.theme-amber textarea:focus,
body.theme-amber select:focus,
body.theme-amber input[type="text"]:focus,
body.theme-amber input[type="password"]:focus,
body.theme-amber input[type="number"]:focus {
  border-color: rgba(217,119,6,0.7);
  box-shadow: 0 0 0 3px rgba(253,224,138,0.35);
}
body.theme-amber button {
  background: linear-gradient(135deg, rgba(253,224,138,1) 0%, rgba(251,191,36,0.95) 55%, rgba(245,158,11,0.95) 100%);
  border: 1px solid rgba(217,119,6,0.45);
  color: #442103;
  box-shadow: 0 16px 36px rgba(147,85,16,0.2);
  transition: transform .16s ease, box-shadow .16s ease;
  font-weight: 600;
}
body.theme-amber button:hover:not([disabled]),
body.theme-amber button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 20px 44px rgba(147,85,16,0.24);
}
body.theme-amber button.secondary {
  background: rgba(255,247,223,0.94);
  color: rgba(120,64,0,0.88);
  border: 1px solid rgba(253,224,138,0.55);
  box-shadow: 0 12px 24px rgba(147,85,16,0.18);
}
body.theme-amber button.secondary:hover:not([disabled]),
body.theme-amber button.secondary:focus-visible {
  background: rgba(253,224,138,0.96);
  color: #5f3700;
}
body.theme-amber .copy-btn,
body.theme-amber .icon-btn {
  background: rgba(255,247,223,0.94);
  border: 1px solid rgba(253,224,138,0.55);
  color: rgba(120,64,0,0.9);
  box-shadow: 0 10px 22px rgba(147,85,16,0.18);
}
body.theme-amber .copy-btn:hover,
body.theme-amber .icon-btn:hover {
  border-color: rgba(217,119,6,0.55);
  color: #5f3700;
}
body.theme-amber th,
body.theme-amber td {
  border-bottom-color: rgba(253,224,138,0.45);
}
body.theme-amber th {
  background: rgba(255,247,223,0.96);
  color: rgba(120,64,0,0.88);
  box-shadow: inset 0 -1px 0 0 rgba(253,224,138,0.4);
}
body.theme-amber footer {
  background: rgba(255,247,223,0.94);
  border-top: 1px solid rgba(253,224,138,0.45);
  box-shadow: 0 -18px 26px rgba(147,85,16,0.16);
  color: rgba(120,64,0,0.85);
}
body.theme-amber .muted {
  color: rgba(146,64,14,0.7);
}
@media (max-width: 700px) {
  body.theme-amber main {
    margin: 26px 12px;
    padding: 26px 20px;
  }
}

/* Sunset theme enhancements infuse neon-dusk atmosphere */
body.theme-sunset {
  position: relative;
  background: radial-gradient(130% 130% at 12% 5%, rgba(251,113,133,0.22) 0%, rgba(27,21,32,1) 55%, rgba(10,6,14,1) 100%);
  color: var(--fg);
  letter-spacing: 0.01em;
  overflow-x: hidden;
}
body.theme-sunset::before,
body.theme-sunset::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
body.theme-sunset::before {
  background:
    radial-gradient(36% 32% at 78% 18%, rgba(248,113,113,0.28) 0%, rgba(248,113,113,0) 70%),
    radial-gradient(32% 40% at 24% 78%, rgba(251,191,36,0.22) 0%, rgba(251,191,36,0) 72%);
  mix-blend-mode: screen;
  opacity: 0.75;
}
body.theme-sunset::after {
  inset: -40%;
  background: repeating-linear-gradient(160deg, rgba(251,191,36,0.07) 0 1px, transparent 1px 6px);
  opacity: 0.18;
  transform: rotate(2deg);
}
body.theme-sunset header,
body.theme-sunset main,
body.theme-sunset .banner,
body.theme-sunset footer {
  position: relative;
  z-index: 1;
}
body.theme-sunset header { z-index: 20; }
body.theme-sunset .banner { z-index: 12; }
body.theme-sunset main { z-index: 8; }
body.theme-sunset footer { z-index: 6; }
body.theme-sunset header {
  background: linear-gradient(120deg, rgba(36,26,44,0.95) 0%, rgba(50,30,55,0.9) 45%, rgba(88,28,35,0.85) 100%);
  border-bottom: 1px solid rgba(251,113,133,0.35);
  box-shadow: 0 14px 36px rgba(10,6,14,0.8);
}
body.theme-sunset h1 a {
  letter-spacing: 0.025em;
  text-transform: uppercase;
  font-weight: 700;
  text-shadow: 0 0 20px rgba(251,191,36,0.35), 0 0 36px rgba(251,113,133,0.25);
}
body.theme-sunset a {
  color: rgba(255,243,179,0.92);
  transition: text-shadow .18s ease, color .18s ease, box-shadow .18s ease;
}
body.theme-sunset a:hover {
  color: #fff4bf;
  text-shadow: 0 0 16px rgba(251,191,36,0.45);
}
body.theme-sunset .module-inline a,
body.theme-sunset .nav-right > a,
body.theme-sunset .admin-item > a {
  background: rgba(52,32,58,0.72);
  border: 1px solid rgba(251,191,36,0.24);
  color: rgba(255,232,173,0.88);
  box-shadow: 0 12px 28px rgba(10,6,14,0.75), inset 0 0 0 1px rgba(251,113,133,0.16);
}
body.theme-sunset .module-inline a:hover,
body.theme-sunset .nav-right > a:hover,
body.theme-sunset .admin-item > a:hover {
  background: rgba(251,113,133,0.2);
  color: #fff8d5;
  box-shadow: 0 14px 36px rgba(10,6,14,0.82), 0 0 18px rgba(251,191,36,0.32);
}
body.theme-sunset .module-inline a.active,
body.theme-sunset .nav-right > a.active,
body.theme-sunset .admin-item > a.active {
  background: rgba(251,113,133,0.18);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(251,191,36,0.4), 0 0 20px rgba(251,113,133,0.3);
}
body.theme-sunset .module-inline a::after {
  background: rgba(251,191,36,0.85);
  height: 2px;
  border-radius: 999px;
  box-shadow: 0 0 12px rgba(251,191,36,0.5);
}
body.theme-sunset .pill-btn {
  background: rgba(52,32,58,0.74);
  border-color: rgba(251,191,36,0.28);
  color: rgba(255,232,173,0.9);
  box-shadow: 0 12px 28px rgba(10,6,14,0.78);
}
body.theme-sunset .pill-btn:hover,
body.theme-sunset .pill-btn:focus-visible {
  background: rgba(251,113,133,0.24);
  border-color: rgba(251,191,36,0.5);
  box-shadow: 0 0 20px rgba(251,191,36,0.45);
}
body.theme-sunset .pill-btn.active::after {
  opacity: 0.55;
  border-color: rgba(251,191,36,0.7);
  box-shadow: 0 0 18px rgba(251,191,36,0.5);
}
body.theme-sunset .tools-menu,
body.theme-sunset .module-menu,
body.theme-sunset .admin-menu {
  background: rgba(33,22,40,0.96);
  border: 1px solid rgba(251,191,36,0.22);
  box-shadow: 0 28px 60px rgba(10,6,14,0.9), 0 0 22px rgba(251,113,133,0.2);
  backdrop-filter: saturate(1.6) blur(14px);
}
body.theme-sunset .tools-menu a,
body.theme-sunset .module-menu a,
body.theme-sunset .admin-menu .admin-item > a {
  color: rgba(255,232,173,0.88);
}
body.theme-sunset .tools-menu a:hover,
body.theme-sunset .module-menu a:hover,
body.theme-sunset .admin-menu .admin-item > a:hover {
  background: rgba(251,113,133,0.22);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(251,191,36,0.32);
}
body.theme-sunset main {
  position: relative;
  margin: 34px auto;
  padding: 34px 30px;
  background: rgba(36,24,44,0.92);
  border: 1px solid rgba(251,113,133,0.26);
  border-radius: 24px;
  box-shadow: 0 34px 80px rgba(6,3,10,0.85);
  overflow: hidden;
}
body.theme-sunset main::before {
  content: '';
  position: absolute;
  inset: 18px;
  border-radius: 18px;
  border: 1px solid rgba(251,191,36,0.2);
  opacity: 0.55;
  pointer-events: none;
}
body.theme-sunset .banner {
  background: rgba(52,32,58,0.82);
  border: 1px solid rgba(251,191,36,0.22);
  color: rgba(255,232,173,0.85);
  box-shadow: 0 10px 28px rgba(6,3,10,0.68);
}
body.theme-sunset .banner.public {
  background: rgba(40,63,43,0.82);
  border-color: rgba(34,197,94,0.28);
  color: rgba(206,255,214,0.85);
}
body.theme-sunset .banner.local {
  background: rgba(58,32,46,0.8);
  color: rgba(255,211,211,0.82);
}
body.theme-sunset .panel {
  position: relative;
  background: linear-gradient(155deg, rgba(41,28,47,0.95) 0%, rgba(30,18,38,0.95) 100%);
  border: 1px solid rgba(251,113,133,0.28);
  border-radius: 18px;
  box-shadow: 0 22px 48px rgba(6,3,10,0.78);
  overflow: hidden;
}
body.theme-sunset .panel::before {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(140deg, rgba(251,113,133,0.18), rgba(251,191,36,0.08));
  pointer-events: none;
}
body.theme-sunset .chip {
  background: rgba(251,113,133,0.18);
  border-color: rgba(251,191,36,0.35);
  color: rgba(255,232,173,0.88);
  box-shadow: 0 0 16px rgba(251,191,36,0.28);
}
body.theme-sunset .chip-ok {
  background: rgba(45,212,191,0.22);
  border-color: rgba(16,185,129,0.4);
  color: rgba(215,255,246,0.9);
}
body.theme-sunset .chip-bad {
  background: rgba(239,68,68,0.28);
  border-color: rgba(248,113,113,0.5);
  color: rgba(255,220,220,0.88);
}
body.theme-sunset textarea,
body.theme-sunset select,
body.theme-sunset input[type="text"],
body.theme-sunset input[type="password"],
body.theme-sunset input[type="number"] {
  background: rgba(27,19,35,0.9);
  border: 1px solid rgba(251,113,133,0.26);
  color: #fff2c6;
  box-shadow: inset 0 0 0 1px rgba(251,191,36,0.12);
}
body.theme-sunset textarea:focus,
body.theme-sunset select:focus,
body.theme-sunset input[type="text"]:focus,
body.theme-sunset input[type="password"]:focus,
body.theme-sunset input[type="number"]:focus {
  border-color: rgba(251,191,36,0.75);
  box-shadow: 0 0 0 3px rgba(251,191,36,0.35);
}
body.theme-sunset button {
  position: relative;
  background: linear-gradient(120deg, rgba(251,113,133,1) 0%, rgba(251,191,36,0.95) 55%, rgba(253,230,138,0.95) 100%);
  border: 1px solid rgba(251,191,36,0.45);
  color: #311927;
  box-shadow: 0 18px 48px rgba(6,3,10,0.82), 0 0 22px rgba(251,191,36,0.3);
  transition: transform .18s ease, box-shadow .18s ease;
  font-weight: 700;
}
body.theme-sunset button:hover:not([disabled]),
body.theme-sunset button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 22px 56px rgba(6,3,10,0.88), 0 0 28px rgba(251,191,36,0.45);
}
body.theme-sunset button.secondary {
  background: rgba(52,32,58,0.74);
  color: rgba(255,232,173,0.88);
  border: 1px solid rgba(251,113,133,0.35);
  box-shadow: 0 14px 38px rgba(6,3,10,0.78);
}
body.theme-sunset button.secondary:hover:not([disabled]),
body.theme-sunset button.secondary:focus-visible {
  background: rgba(251,113,133,0.24);
  color: #ffffff;
}
body.theme-sunset .copy-btn,
body.theme-sunset .icon-btn {
  background: rgba(52,32,58,0.78);
  border: 1px solid rgba(251,191,36,0.32);
  color: rgba(255,232,173,0.88);
  box-shadow: 0 12px 30px rgba(6,3,10,0.78);
}
body.theme-sunset .copy-btn:hover,
body.theme-sunset .icon-btn:hover {
  border-color: rgba(251,191,36,0.6);
  color: #ffffff;
}
body.theme-sunset th,
body.theme-sunset td {
  border-bottom-color: rgba(251,113,133,0.28);
}
body.theme-sunset th {
  background: rgba(34,24,40,0.92);
  color: rgba(255,232,173,0.88);
  box-shadow: inset 0 -1px 0 0 rgba(251,113,133,0.28);
}
body.theme-sunset footer {
  background: rgba(30,20,38,0.92);
  border-top: 1px solid rgba(251,113,133,0.28);
  box-shadow: 0 -20px 48px rgba(6,3,10,0.82);
  color: rgba(255,232,173,0.82);
}
body.theme-sunset .muted {
  color: rgba(255,203,167,0.8);
}
body.theme-sunset .spinner {
  border-color: rgba(251,113,133,0.26);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-sunset main {
    margin: 28px 12px;
    padding: 28px 20px;
  }
}

/* Cyberpunk theme enhancements go beyond the palette and introduce neon-glow UI polish */
body.theme-cyberpunk {
  position: relative;
  background: radial-gradient(140% 140% at 15% -10%, rgba(168,85,247,0.28) 0%, rgba(5,0,20,0.96) 50%, rgba(2,0,10,1) 100%);
  color: var(--fg);
  letter-spacing: 0.01em;
  overflow-x: hidden;
}
body.theme-cyberpunk::before,
body.theme-cyberpunk::after {
  content: '';
  position: fixed;
  inset: 0;
  pointer-events: none;
  z-index: 0;
}
body.theme-cyberpunk::before {
  background:
    radial-gradient(40% 55% at 85% 15%, rgba(34,211,238,0.3) 0%, transparent 70%),
    radial-gradient(28% 45% at 18% 78%, rgba(168,85,247,0.25) 0%, transparent 75%);
  mix-blend-mode: screen;
  opacity: 0.7;
}
body.theme-cyberpunk::after {
  inset: -60%;
  background: repeating-linear-gradient(180deg, rgba(34,211,238,0.12) 0 1px, transparent 1px 4px);
  opacity: 0.2;
  transform: translateY(-12%);
  animation: cyberpunkScan 18s linear infinite;
}
@keyframes cyberpunkScan {
  0% { transform: translateY(-12%); }
  50% { transform: translateY(10%); }
  100% { transform: translateY(-12%); }
}
body.theme-cyberpunk .banner,
body.theme-cyberpunk header,
body.theme-cyberpunk main,
body.theme-cyberpunk footer {
  position: relative;
  z-index: 1;
}
body.theme-cyberpunk header { z-index: 20; }
body.theme-cyberpunk .banner { z-index: 12; }
body.theme-cyberpunk main { z-index: 8; }
body.theme-cyberpunk footer { z-index: 6; }
body.theme-cyberpunk header {
  background: linear-gradient(115deg, rgba(18,4,52,0.94) 0%, rgba(12,3,36,0.9) 45%, rgba(22,1,58,0.88) 100%);
  border-bottom: 1px solid rgba(34,211,238,0.4);
  box-shadow: 0 8px 28px rgba(5,0,20,0.65), 0 0 24px rgba(34,211,238,0.22);
}
body.theme-cyberpunk header::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 40px;
  right: 40px;
  height: 3px;
  background: linear-gradient(90deg, rgba(34,211,238,0), rgba(34,211,238,0.9), rgba(168,85,247,0));
  box-shadow: 0 0 14px rgba(34,211,238,0.5);
  opacity: 0.7;
  animation: cyberpunkPulse 4s ease-in-out infinite;
}
@keyframes cyberpunkPulse {
  0%, 100% { opacity: 0.4; }
  50% { opacity: 0.95; }
}
body.theme-cyberpunk h1 a {
  letter-spacing: 0.02em;
  text-shadow: 0 0 12px rgba(34,211,238,0.6), 0 0 26px rgba(168,85,247,0.45);
}
body.theme-cyberpunk a {
  color: rgba(109,248,255,0.92);
  transition: text-shadow .18s ease, color .18s ease, box-shadow .18s ease;
}
body.theme-cyberpunk a:hover {
  color: #75fdff;
  text-shadow: 0 0 14px rgba(95,245,255,0.65), 0 0 26px rgba(168,85,247,0.38);
}
body.theme-cyberpunk .module-inline a,
body.theme-cyberpunk .nav-right > a,
body.theme-cyberpunk .admin-item > a {
  background: rgba(12,3,36,0.6);
  border: 1px solid rgba(34,211,238,0.2);
  box-shadow: inset 0 0 0 1px rgba(168,85,247,0.16), 0 0 16px rgba(34,211,238,0.2);
  color: rgba(214,206,255,0.78);
}
body.theme-cyberpunk .module-inline a:hover,
body.theme-cyberpunk .nav-right > a:hover,
body.theme-cyberpunk .admin-item > a:hover {
  color: #f5f5ff;
  background: rgba(34,211,238,0.18);
  box-shadow: inset 0 0 0 1px rgba(34,211,238,0.35), 0 0 24px rgba(34,211,238,0.45);
}
body.theme-cyberpunk .module-inline a.active,
body.theme-cyberpunk .nav-right > a.active,
body.theme-cyberpunk .admin-item > a.active {
  color: #ffffff;
  background: rgba(34,211,238,0.15);
  box-shadow: inset 0 0 0 1px rgba(34,211,238,0.45), 0 0 26px rgba(168,85,247,0.28);
}
body.theme-cyberpunk .module-inline a::after {
  box-shadow: 0 0 12px rgba(34,211,238,0.45);
  height: 2px;
  border-radius: 999px;
}
body.theme-cyberpunk .pill-btn {
  background: rgba(12,3,36,0.68);
  border-color: rgba(34,211,238,0.32);
  box-shadow: 0 8px 24px rgba(5,0,20,0.52), 0 0 16px rgba(34,211,238,0.32);
  color: rgba(215,232,255,0.9);
}
body.theme-cyberpunk .pill-btn:hover,
body.theme-cyberpunk .pill-btn:focus-visible {
  background: rgba(34,211,238,0.18);
  border-color: rgba(34,211,238,0.75);
  box-shadow: 0 0 28px rgba(34,211,238,0.58);
}
body.theme-cyberpunk .pill-btn.active::after {
  opacity: 0.6;
  box-shadow: 0 0 14px rgba(34,211,238,0.45);
}
body.theme-cyberpunk .tools-menu,
body.theme-cyberpunk .module-menu,
body.theme-cyberpunk .admin-menu {
  background: rgba(10,3,30,0.94);
  border-color: rgba(34,211,238,0.22);
  box-shadow: 0 25px 60px rgba(5,0,20,0.85), 0 0 26px rgba(168,85,247,0.28);
  backdrop-filter: saturate(1.75) blur(16px);
}
body.theme-cyberpunk .tools-menu a,
body.theme-cyberpunk .module-menu a,
body.theme-cyberpunk .admin-menu .admin-item > a {
  color: rgba(214,206,255,0.85);
}
body.theme-cyberpunk .tools-menu a:hover,
body.theme-cyberpunk .module-menu a:hover,
body.theme-cyberpunk .admin-menu .admin-item > a:hover {
  background: rgba(34,211,238,0.16);
  color: #ffffff;
  box-shadow: inset 0 0 0 1px rgba(34,211,238,0.28);
}
body.theme-cyberpunk main {
  position: relative;
  margin: 36px auto;
  padding: 36px 32px;
  background: rgba(6,2,26,0.9);
  border: 1px solid rgba(34,211,238,0.2);
  border-radius: 24px;
  box-shadow: 0 30px 90px rgba(2,0,20,0.72);
  overflow: hidden;
}
body.theme-cyberpunk main::before {
  content: '';
  position: absolute;
  inset: 0;
  border-radius: 22px;
  background: linear-gradient(150deg, rgba(34,211,238,0.08), rgba(168,85,247,0.12));
  opacity: 0.65;
  pointer-events: none;
}
body.theme-cyberpunk main::after {
  content: '';
  position: absolute;
  inset: 16px;
  border-radius: 18px;
  border: 1px solid rgba(34,211,238,0.12);
  opacity: 0.5;
  pointer-events: none;
}
body.theme-cyberpunk .banner {
  background: rgba(34,211,238,0.08);
  border: 1px solid rgba(34,211,238,0.28);
  box-shadow: 0 0 18px rgba(34,211,238,0.28);
  color: rgba(215,232,255,0.85);
}
body.theme-cyberpunk .banner.public {
  background: rgba(16,185,129,0.14);
  border-color: rgba(34,211,238,0.28);
  box-shadow: 0 0 18px rgba(16,185,129,0.35);
}
body.theme-cyberpunk .banner.local {
  background: rgba(148,163,184,0.12);
  color: rgba(195,206,255,0.8);
  border-color: rgba(34,211,238,0.2);
}
body.theme-cyberpunk .panel {
  position: relative;
  background: linear-gradient(170deg, rgba(15,5,45,0.95) 0%, rgba(8,3,30,0.96) 100%);
  border: 1px solid rgba(34,211,238,0.26);
  border-radius: 16px;
  box-shadow: 0 20px 40px rgba(2,0,20,0.58), 0 0 26px rgba(168,85,247,0.22);
  overflow: hidden;
}
body.theme-cyberpunk .panel::before {
  content: '';
  position: absolute;
  top: 0;
  left: -25%;
  width: 150%;
  height: 2px;
  background: linear-gradient(90deg, rgba(34,211,238,0), rgba(34,211,238,0.85), rgba(168,85,247,0));
  opacity: 0.75;
  animation: cyberpunkSweep 6s ease-in-out infinite;
}
body.theme-cyberpunk .panel::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(135deg, rgba(34,211,238,0.08), rgba(168,85,247,0));
  pointer-events: none;
}
@keyframes cyberpunkSweep {
  0%, 100% { transform: translateX(-5%); opacity: 0.4; }
  50% { transform: translateX(12%); opacity: 0.8; }
}
body.theme-cyberpunk .chip {
  background: rgba(34,211,238,0.16);
  border-color: rgba(34,211,238,0.35);
  box-shadow: 0 0 14px rgba(34,211,238,0.35);
  color: rgba(215,232,255,0.88);
}
body.theme-cyberpunk .chip-ok,
body.theme-cyberpunk .chip-bad {
  box-shadow: 0 0 16px currentColor;
}
body.theme-cyberpunk textarea,
body.theme-cyberpunk select,
body.theme-cyberpunk input[type="text"],
body.theme-cyberpunk input[type="password"],
body.theme-cyberpunk input[type="number"] {
  background: rgba(5,0,20,0.82);
  border-color: rgba(34,211,238,0.26);
  box-shadow: inset 0 0 0 1px rgba(168,85,247,0.18), 0 0 0 1px rgba(12,3,36,0.8);
  color: #f5f5ff;
}
body.theme-cyberpunk textarea:focus,
body.theme-cyberpunk select:focus,
body.theme-cyberpunk input[type="text"]:focus,
body.theme-cyberpunk input[type="password"]:focus,
body.theme-cyberpunk input[type="number"]:focus {
  border-color: rgba(34,211,238,0.85);
  box-shadow: inset 0 0 0 1px rgba(34,211,238,0.72), 0 0 18px rgba(34,211,238,0.48);
}
body.theme-cyberpunk button {
  position: relative;
  background: linear-gradient(135deg, rgba(34,211,238,0.18) 0%, rgba(168,85,247,0.92) 100%);
  border: 1px solid rgba(34,211,238,0.42);
  color: #ffffff;
  box-shadow: 0 16px 44px rgba(2,0,20,0.72), 0 0 26px rgba(168,85,247,0.32);
  overflow: hidden;
  transition: box-shadow .18s ease, transform .18s ease;
}
body.theme-cyberpunk button::after {
  content: '';
  position: absolute;
  inset: 0;
  background: linear-gradient(90deg, rgba(34,211,238,0), rgba(34,211,238,0.45), rgba(34,211,238,0));
  opacity: 0;
  transition: opacity .2s ease;
  pointer-events: none;
}
body.theme-cyberpunk button:hover:not([disabled]),
body.theme-cyberpunk button:focus-visible {
  transform: translateY(-1px);
  box-shadow: 0 20px 50px rgba(2,0,20,0.82), 0 0 32px rgba(34,211,238,0.6);
}
body.theme-cyberpunk button:hover::after,
body.theme-cyberpunk button:focus-visible::after {
  opacity: 0.9;
}
body.theme-cyberpunk button.secondary {
  background: rgba(12,3,36,0.78);
  color: rgba(215,232,255,0.88);
  border: 1px solid rgba(34,211,238,0.42);
  box-shadow: 0 0 18px rgba(34,211,238,0.35);
}
body.theme-cyberpunk button.secondary:hover:not([disabled]),
body.theme-cyberpunk button.secondary:focus-visible {
  background: rgba(34,211,238,0.22);
  color: #ffffff;
}
body.theme-cyberpunk .copy-btn,
body.theme-cyberpunk .icon-btn {
  background: rgba(12,3,36,0.68);
  border: 1px solid rgba(34,211,238,0.36);
  color: rgba(215,232,255,0.9);
  box-shadow: 0 0 14px rgba(34,211,238,0.36);
}
body.theme-cyberpunk .copy-btn:hover,
body.theme-cyberpunk .icon-btn:hover {
  border-color: rgba(34,211,238,0.72);
  color: #ffffff;
}
body.theme-cyberpunk th,
body.theme-cyberpunk td {
  border-bottom-color: rgba(34,211,238,0.2);
}
body.theme-cyberpunk th {
  background: rgba(12,3,36,0.92);
  color: rgba(215,232,255,0.9);
  box-shadow: inset 0 -1px 0 0 rgba(34,211,238,0.2);
}
body.theme-cyberpunk footer {
  background: rgba(10,3,30,0.92);
  border-top: 1px solid rgba(34,211,238,0.24);
  box-shadow: 0 -16px 40px rgba(2,0,20,0.68), 0 0 24px rgba(168,85,247,0.26);
  color: rgba(195,206,255,0.78);
}
body.theme-cyberpunk .muted {
  color: rgba(167,151,229,0.78);
}
body.theme-cyberpunk .spinner {
  border-color: rgba(34,211,238,0.32);
  border-top-color: var(--accent);
}
@media (max-width: 700px) {
  body.theme-cyberpunk main {
    margin: 28px 12px;
    padding: 28px 20px;
  }
}

/* Restart overlay */
.overlay {
  position: fixed; inset: 0; background: rgba(0,0,0,0.6);
  display: none; align-items: center; justify-content: center; z-index: 9999;
}
.overlay.show { display: flex; }
.overlay .modal {
  background: var(--panel); color: var(--fg); border: 1px solid var(--border);
  padding: 20px; border-radius: 12px; width: 420px; text-align: center;
  box-shadow: 0 10px 30px rgba(0,0,0,0.4);
}
.overlay .modal h3 { margin: 0 0 8px 0; }
.overlay .modal p { margin: 6px 0; color: var(--muted); }
.disabled-area * { pointer-events: none !important; opacity: 0.6; }
.ask-form textarea { margin-bottom: 16px; }
.ask-form .actions { margin-top: 16px; }
.ask-label { display:block; margin-bottom: 16px; }

/* Heparin page helpers */
.form-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 12px 16px;
}
.ig-grid { display: grid; grid-template-columns: 3fr 2fr; gap: 12px 16px; grid-column: 1 / -1; }
.row { display:flex; gap:8px; align-items:center; }
.kv { display:grid; grid-template-columns: 1fr auto; gap: 8px 12px; }
.kv > div { display:flex; justify-content: space-between; gap: 16px; }
.error { color: #ef4444; margin: 8px 0; }
.muted { color: var(--muted); }

/* Heparin input sizing: keep unit pickers visible (scoped in mobile rules below) */

/* Prevent long values from pushing layout wider than viewport */
.heparin .kv > div { min-width: 0; }
.heparin .kv strong, .heparin .kv span { overflow-wrap: anywhere; }

@media (max-width: 800px) {
  .form-grid { grid-template-columns: 1fr; }
  .ig-grid { grid-template-columns: 1fr; }
}

/* Heparin layout refinements */
.heparin #ptt { width: 120px; max-width: 140px; }
.heparin #ptt_row { gap: 10px; }
.heparin #include_bolus_row,
.heparin #cap100_row,
.heparin #dosing_actual_row { margin-top: 6px; }
.heparin #dosing_actual_row { margin-bottom: 10px; }
.heparin .panel-note { margin-top: 12px !important; }
@media (max-width: 800px) {
  .heparin #ptt_row { flex-wrap: wrap; }
  .heparin #ptt { width: 100%; max-width: 180px; }
}

/* Heparin mobile stacking and widths */
@media (max-width: 700px) {
  /* Stack the two main panels vertically */
  .heparin .grid { grid-template-columns: 1fr !important; }
  /* Weight/height row: keep unit dropdowns visible and align to right edge */
  .heparin .row { width: 100%; flex-wrap: nowrap; }
  .heparin input[type="number"], .heparin select { box-sizing: border-box; }
  .heparin .row input[type="number"] { flex: 1 1 auto; min-width: 0; }
  .heparin .row select { flex: 0 0 96px; width: 96px; max-width: 40%; }
  /* Make calculated rows single-column to avoid overflow */
  .heparin .kv { grid-template-columns: 1fr; }
}

/* Respect reduced motion preferences */
@media (prefers-reduced-motion: reduce) {
  * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; transition-duration: 0.001ms !important; scroll-behavior: auto !important; }
  body.theme-cyberpunk::after,
  body.theme-cyberpunk header::after,
  body.theme-cyberpunk .panel::before { animation: none !important; }
}




/* Keep chip rows stable height to avoid layout shift */
.chips-stable { height: 30px; display: inline-flex; align-items: center; }