:root {
  --chart-series-in: #27c979;
  --chart-series-out: #d7b96b;
  --chart-foreground: #9aafa5;
  --chart-grid: rgba(127, 241, 179, 0.14);
  --chart-tooltip-bg: #07100d;
  --chart-tooltip-border: rgba(127, 241, 179, 0.28);
  --chart-tooltip-text: #edf8f2;
}

html[data-theme="light"] {
  color-scheme: light;
  --light-canvas: #f7f3ea;
  --light-canvas-soft: #f0eadf;
  --light-surface: #fffdf8;
  --light-surface-2: #faf6ed;
  --light-surface-3: #f1e8d8;
  --light-text: #222920;
  --light-muted: #657068;
  --light-dim: #68726b;
  --light-emerald: #1f6b49;
  --light-emerald-strong: #164f37;
  --light-gold: #a87922;
  --light-gold-strong: #805b18;
  --light-gold-bright: #d3ae57;
  --light-champagne: #ead8aa;
  --light-line: rgba(128, 91, 24, 0.18);
  --light-line-strong: rgba(128, 91, 24, 0.34);
  --light-green-line: rgba(31, 107, 73, 0.18);
  --light-shadow: 0 24px 70px rgba(78, 60, 24, 0.13);
  --light-shadow-soft: 0 12px 34px rgba(78, 60, 24, 0.09);
  --chart-series-in: #216747;
  --chart-series-out: #a87922;
  --chart-foreground: #59645d;
  --chart-grid: rgba(89, 100, 93, 0.17);
  --chart-tooltip-bg: #fffdf8;
  --chart-tooltip-border: rgba(128, 91, 24, 0.3);
  --chart-tooltip-text: #222920;
}

/* Shared theme switch */
.theme-toggle {
  display: none;
  align-items: center;
  justify-content: center;
  gap: 9px;
  min-height: 42px;
  padding: 0 12px;
  border: 1px solid rgba(86, 242, 164, 0.2);
  border-radius: 9px;
  background: rgba(8, 20, 14, 0.72);
  color: #cfe0d7;
  font-family: Inter, "Segoe UI", sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: 0.04em;
  line-height: 1;
  white-space: nowrap;
  transition: border-color 0.2s ease, background-color 0.2s ease, color 0.2s ease, transform 0.2s ease;
}

.js .theme-toggle {
  display: inline-flex;
}

.theme-toggle:hover {
  border-color: rgba(215, 185, 107, 0.46);
  background: rgba(86, 242, 164, 0.08);
  color: #fff;
  transform: translateY(-1px);
}

.theme-toggle:focus-visible {
  outline: 2px solid #56f2a4;
  outline-offset: 3px;
}

.theme-toggle-track {
  position: relative;
  display: block;
  width: 48px;
  height: 26px;
  flex: 0 0 48px;
  border: 1px solid rgba(215, 185, 107, 0.3);
  border-radius: 999px;
  background: rgba(2, 8, 5, 0.68);
  box-shadow: inset 0 0 12px rgba(0, 0, 0, 0.24);
}

.theme-toggle-track > i {
  position: absolute;
  z-index: 2;
  top: 50%;
  font-size: 10px;
  transform: translateY(-50%);
  transition: color 0.25s ease;
}

.theme-toggle-moon { left: 8px; color: #f1d994; }
.theme-toggle-sun { right: 7px; color: #687970; }

.theme-toggle-thumb {
  position: absolute;
  z-index: 1;
  top: 3px;
  left: 3px;
  width: 18px;
  height: 18px;
  border: 1px solid rgba(255, 255, 255, 0.18);
  border-radius: 50%;
  background: linear-gradient(145deg, #1d5f42, #0d3625);
  box-shadow: 0 3px 9px rgba(0, 0, 0, 0.32);
  transition: transform 0.3s cubic-bezier(0.2, 0.75, 0.15, 1), background 0.25s ease;
}

html[data-theme="light"] .theme-toggle {
  border-color: var(--light-line-strong);
  background: rgba(255, 253, 248, 0.88);
  color: var(--light-text);
  box-shadow: 0 8px 22px rgba(88, 65, 21, 0.08);
}

html[data-theme="light"] .theme-toggle:hover {
  border-color: rgba(168, 121, 34, 0.52);
  background: #fffdf8;
  color: var(--light-gold-strong);
}

html[data-theme="light"] .theme-toggle:focus-visible {
  outline-color: var(--light-gold);
}

html[data-theme="light"] .theme-toggle-track {
  border-color: rgba(168, 121, 34, 0.38);
  background: #efe5d1;
  box-shadow: inset 0 0 10px rgba(128, 91, 24, 0.1);
}

html[data-theme="light"] .theme-toggle-moon { color: #9b927e; }
html[data-theme="light"] .theme-toggle-sun { color: #805b18; }

html[data-theme="light"] .theme-toggle-thumb {
  border-color: rgba(128, 91, 24, 0.22);
  background: linear-gradient(145deg, #efd78f, #bd8e32);
  box-shadow: 0 3px 9px rgba(128, 91, 24, 0.22);
  transform: translateX(22px);
}

.theme-toggle--compact {
  width: 42px;
  min-width: 42px;
  padding: 0;
}

.theme-toggle--compact .theme-toggle-track {
  width: 30px;
  height: 20px;
  flex-basis: 30px;
}

.theme-toggle--compact .theme-toggle-track > i {
  font-size: 8px;
}

.theme-toggle--compact .theme-toggle-moon { left: 5px; }
.theme-toggle--compact .theme-toggle-sun { right: 4px; }

.theme-toggle--compact .theme-toggle-thumb {
  top: 2px;
  left: 2px;
  width: 14px;
  height: 14px;
}

html[data-theme="light"] .theme-toggle--compact .theme-toggle-thumb {
  transform: translateX(12px);
}

.theme-toggle--compact .theme-toggle-label {
  display: none;
}

.theme-toggle--auth {
  position: absolute;
  z-index: 3;
  top: 24px;
  right: 24px;
}

.public-menu-actions {
  display: flex;
  align-items: center;
  gap: 10px;
}

@media screen {
  /* Application and authentication foundations */
  html[data-theme="light"] body.app-body,
  html[data-theme="light"] body.auth-page {
    --tactical-bg: var(--light-canvas);
    --tactical-bg-soft: var(--light-canvas-soft);
    --tactical-surface: var(--light-surface);
    --tactical-surface-2: var(--light-surface-2);
    --tactical-surface-3: var(--light-surface-3);
    --tactical-text: var(--light-text);
    --tactical-muted: var(--light-muted);
    --tactical-dim: var(--light-dim);
    --tactical-emerald: var(--light-emerald);
    --tactical-emerald-strong: var(--light-emerald-strong);
    --tactical-gold: var(--light-gold);
    --tactical-gold-soft: var(--light-gold-bright);
    --tactical-line: var(--light-line);
    --tactical-line-strong: var(--light-line-strong);
    --tactical-shadow: var(--light-shadow);
    --tactical-shadow-soft: var(--light-shadow-soft);
    --army: var(--light-emerald);
    --army-dark: var(--light-emerald-strong);
    --army-soft: #2f805b;
    --olive: #787340;
    --gold: var(--light-gold);
    --gold-bright: var(--light-gold-bright);
    --red: #9b3f38;
    --cream: var(--light-surface-2);
    --bg-soft: var(--light-canvas);
    --ink: var(--light-text);
    --muted: var(--light-muted);
    --line: var(--light-line);
    --shadow: var(--light-shadow);
    --shadow-sm: var(--light-shadow-soft);
    --ui-army: var(--light-emerald);
    --ui-army-2: var(--light-emerald-strong);
    --ui-army-soft: #edf5f0;
    --ui-olive: #787340;
    --ui-gold: var(--light-gold);
    --ui-gold-soft: #faf1da;
    --ui-ink: var(--light-text);
    --ui-muted: var(--light-muted);
    --ui-line: var(--light-line);
    --ui-bg: var(--light-canvas);
    --ui-card: var(--light-surface);
    --ui-shadow: var(--light-shadow-soft);
    --ui-shadow-hover: var(--light-shadow);
    --bs-body-color: var(--light-text);
    --bs-body-color-rgb: 34, 41, 32;
    --bs-body-bg: var(--light-canvas);
    --bs-body-bg-rgb: 247, 243, 234;
    --bs-emphasis-color: #171c16;
    --bs-emphasis-color-rgb: 23, 28, 22;
    --bs-secondary-color: var(--light-muted);
    --bs-secondary-color-rgb: 101, 112, 104;
    --bs-secondary-bg: var(--light-surface-2);
    --bs-secondary-bg-rgb: 250, 246, 237;
    --bs-tertiary-bg: var(--light-surface-3);
    --bs-tertiary-bg-rgb: 241, 232, 216;
    --bs-border-color: var(--light-line);
    --bs-border-color-translucent: rgba(128, 91, 24, 0.12);
    --bs-link-color: var(--light-emerald);
    --bs-link-hover-color: var(--light-gold-strong);
    --bs-primary-rgb: 31, 107, 73;
    --bs-success-rgb: 31, 107, 73;
    --bs-warning-rgb: 168, 121, 34;
    --bs-danger-rgb: 171, 70, 62;
    --bs-focus-ring-color: rgba(168, 121, 34, 0.25);
    color: var(--light-text);
    color-scheme: light;
    background:
      radial-gradient(circle at 8% 8%, rgba(211, 174, 87, 0.18), transparent 28%),
      radial-gradient(circle at 92% 22%, rgba(31, 107, 73, 0.08), transparent 25%),
      linear-gradient(180deg, #fbf9f4 0%, #f3eee4 52%, #faf8f2 100%) !important;
  }

  html[data-theme="light"] body.app-body::before,
  html[data-theme="light"] body.auth-page::before {
    background-image:
      linear-gradient(rgba(168, 121, 34, 0.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(168, 121, 34, 0.045) 1px, transparent 1px);
    mask-image: linear-gradient(to bottom, #000, transparent 90%);
  }

  html[data-theme="light"] body.app-body ::selection,
  html[data-theme="light"] body.auth-page ::selection {
    background: #d9b964;
    color: #201a0e;
  }

  html[data-theme="light"] body.app-body::-webkit-scrollbar-track,
  html[data-theme="light"] body.auth-page::-webkit-scrollbar-track,
  html[data-theme="light"] body.app-body *::-webkit-scrollbar-track,
  html[data-theme="light"] body.auth-page *::-webkit-scrollbar-track {
    background: #f1eadf;
  }

  html[data-theme="light"] body.app-body::-webkit-scrollbar-thumb,
  html[data-theme="light"] body.auth-page::-webkit-scrollbar-thumb,
  html[data-theme="light"] body.app-body *::-webkit-scrollbar-thumb,
  html[data-theme="light"] body.auth-page *::-webkit-scrollbar-thumb {
    border-color: #f1eadf;
    background: #c0a25d;
  }

  html[data-theme="light"] body.app-body::-webkit-scrollbar-thumb:hover,
  html[data-theme="light"] body.auth-page::-webkit-scrollbar-thumb:hover,
  html[data-theme="light"] body.app-body *::-webkit-scrollbar-thumb:hover,
  html[data-theme="light"] body.auth-page *::-webkit-scrollbar-thumb:hover {
    background: var(--light-gold);
  }

  html[data-theme="light"] body.app-body .v3-noise,
  html[data-theme="light"] body.auth-page .v3-noise {
    opacity: 0.025;
    mix-blend-mode: multiply;
  }

  html[data-theme="light"] body.app-body .v3-cursor-glow,
  html[data-theme="light"] body.auth-page .v3-cursor-glow {
    background: radial-gradient(circle, rgba(211, 174, 87, 0.15), transparent 68%);
  }

  html[data-theme="light"] body.app-body .text-muted,
  html[data-theme="light"] body.auth-page .text-muted,
  html[data-theme="light"] body.app-body .text-secondary,
  html[data-theme="light"] body.auth-page .text-secondary {
    color: var(--light-muted) !important;
  }

  html[data-theme="light"] body.app-body .text-dark,
  html[data-theme="light"] body.auth-page .text-dark,
  html[data-theme="light"] body.app-body .text-body,
  html[data-theme="light"] body.auth-page .text-body {
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.app-body .text-gold,
  html[data-theme="light"] body.auth-page .text-gold {
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] body.app-body .bg-white,
  html[data-theme="light"] body.auth-page .bg-white,
  html[data-theme="light"] body.app-body .bg-light,
  html[data-theme="light"] body.auth-page .bg-light {
    background-color: var(--light-surface) !important;
  }

  html[data-theme="light"] body.app-body .border,
  html[data-theme="light"] body.auth-page .border,
  html[data-theme="light"] body.app-body .border-top,
  html[data-theme="light"] body.auth-page .border-top,
  html[data-theme="light"] body.app-body .border-end,
  html[data-theme="light"] body.auth-page .border-end,
  html[data-theme="light"] body.app-body .border-bottom,
  html[data-theme="light"] body.auth-page .border-bottom,
  html[data-theme="light"] body.app-body .border-start,
  html[data-theme="light"] body.auth-page .border-start {
    border-color: var(--light-line) !important;
  }

  /* Light luxury application shell */
  html[data-theme="light"] body.app-body .sidebar {
    border-right-color: rgba(168, 121, 34, 0.32);
    background:
      linear-gradient(rgba(168, 121, 34, 0.045) 1px, transparent 1px),
      linear-gradient(90deg, rgba(168, 121, 34, 0.045) 1px, transparent 1px),
      linear-gradient(180deg, #fffdf8 0%, #f7f1e5 58%, #f0e7d6 100%) !important;
    background-size: 42px 42px, 42px 42px, auto !important;
    box-shadow: 14px 0 46px rgba(87, 67, 28, 0.1) !important;
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .sidebar::after {
    color: rgba(168, 121, 34, 0.07);
  }

  html[data-theme="light"] body.app-body .sidebar .brand {
    border-bottom-color: var(--light-line) !important;
    background: linear-gradient(90deg, rgba(211, 174, 87, 0.16), transparent);
  }

  html[data-theme="light"] body.app-body .brand-txt strong {
    color: var(--light-emerald-strong) !important;
  }

  html[data-theme="light"] body.app-body .brand-txt small {
    color: var(--light-muted) !important;
  }

  html[data-theme="light"] body.app-body .side-nav .nav-sec {
    color: #746344 !important;
  }

  html[data-theme="light"] body.app-body .side-nav a {
    color: #536159 !important;
    background: transparent !important;
  }

  html[data-theme="light"] body.app-body .side-nav a::before {
    background: linear-gradient(var(--light-gold-bright), var(--light-gold));
    box-shadow: 0 0 10px rgba(168, 121, 34, 0.3);
  }

  html[data-theme="light"] body.app-body .side-nav a:hover {
    border-color: var(--light-line);
    background: rgba(211, 174, 87, 0.12) !important;
    color: var(--light-emerald-strong) !important;
  }

  html[data-theme="light"] body.app-body .side-nav a.active {
    border-color: rgba(168, 121, 34, 0.34);
    background: linear-gradient(90deg, rgba(234, 216, 170, 0.72), rgba(255, 253, 248, 0.4)) !important;
    color: var(--light-emerald-strong) !important;
    box-shadow: inset 0 0 24px rgba(211, 174, 87, 0.08) !important;
  }

  html[data-theme="light"] body.app-body .side-nav a i {
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .sidebar-foot {
    border-top-color: var(--light-line) !important;
    background: rgba(128, 91, 24, 0.035);
  }

  html[data-theme="light"] body.app-body .btn-logout {
    border-color: rgba(171, 70, 62, 0.25) !important;
    background: rgba(171, 70, 62, 0.035) !important;
    color: #85413b !important;
  }

  html[data-theme="light"] body.app-body .btn-logout:hover {
    border-color: rgba(171, 70, 62, 0.42) !important;
    background: rgba(171, 70, 62, 0.1) !important;
    color: #652e2a !important;
  }

  html[data-theme="light"] body.app-body .topbar {
    border-bottom-color: var(--light-line) !important;
    background: rgba(255, 253, 248, 0.88) !important;
    box-shadow: 0 10px 32px rgba(84, 63, 21, 0.08) !important;
  }

  html[data-theme="light"] body.app-body .topbar::after {
    background: linear-gradient(90deg, transparent, var(--light-gold-bright), var(--light-emerald), transparent) !important;
    opacity: 0.55 !important;
  }

  html[data-theme="light"] body.app-body .topbar h1,
  html[data-theme="light"] body.app-body .topbar-profile-text strong {
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.app-body .topbar .sub,
  html[data-theme="light"] body.app-body .topbar-profile-text small {
    color: var(--light-muted) !important;
  }

  html[data-theme="light"] body.app-body .topbar-profile:hover {
    background: rgba(211, 174, 87, 0.11);
  }

  html[data-theme="light"] body.app-body .topbar-profile-photo {
    border-color: rgba(168, 121, 34, 0.48);
    background: linear-gradient(145deg, #f3d887, #b8872e);
    color: #203028;
    box-shadow: 0 0 0 4px rgba(211, 174, 87, 0.09), 0 7px 17px rgba(96, 69, 19, 0.18);
  }

  html[data-theme="light"] body.app-body .topbar-icon,
  html[data-theme="light"] body.app-body .user-menu .chip {
    border-color: var(--light-line);
    background: rgba(255, 253, 248, 0.92);
    color: var(--light-emerald);
    box-shadow: 0 7px 18px rgba(88, 65, 21, 0.06);
  }

  html[data-theme="light"] body.app-body .topbar-icon:hover,
  html[data-theme="light"] body.app-body .user-menu .chip:hover {
    border-color: var(--light-line-strong);
    background: #fffaf0;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .topbar-icon .dot {
    background: var(--light-gold);
    box-shadow: 0 0 9px rgba(168, 121, 34, 0.42);
  }

  html[data-theme="light"] body.app-body .topbar .badge.bg-army.text-gold {
    background: var(--light-emerald-strong) !important;
    color: #fff5d8 !important;
  }

  html[data-theme="light"] body.app-body .topbar-logout {
    border-color: rgba(171, 70, 62, 0.26);
    background: rgba(255, 253, 248, 0.88);
    color: #984b44;
  }

  html[data-theme="light"] body.app-body .topbar-logout:hover {
    border-color: rgba(171, 70, 62, 0.45);
    background: #fbedea;
    color: #702f2a;
  }

  html[data-theme="light"] body.app-body .app-footer {
    border-top-color: var(--light-line);
    background: rgba(255, 253, 248, 0.9);
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body #sidebarBackdrop {
    background: rgba(55, 45, 25, 0.32);
  }

  /* Headings, surfaces, and cards */
  html[data-theme="light"] body.app-body .breadcrumb,
  html[data-theme="light"] body.app-body .breadcrumb-item,
  html[data-theme="light"] body.app-body .breadcrumb-item a {
    color: var(--light-dim);
  }

  html[data-theme="light"] body.app-body .breadcrumb-item.active {
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .breadcrumb-item + .breadcrumb-item::before {
    color: rgba(168, 121, 34, 0.55);
  }

  html[data-theme="light"] body.app-body .page-head h2 {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .section-card,
  html[data-theme="light"] body.app-body .card,
  html[data-theme="light"] body.app-body .page-card,
  html[data-theme="light"] body.app-body .filter-card,
  html[data-theme="light"] body.app-body .table-card,
  html[data-theme="light"] body.app-body .content-card {
    border-color: var(--light-line) !important;
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.16), transparent 42%),
      rgba(255, 253, 248, 0.94) !important;
    box-shadow: var(--light-shadow-soft) !important;
  }

  html[data-theme="light"] body.app-body .section-card:hover,
  html[data-theme="light"] body.app-body .card:hover {
    border-color: var(--light-line-strong) !important;
  }

  html[data-theme="light"] body.app-body .section-card .sc-head,
  html[data-theme="light"] body.app-body .card .card-header {
    border-bottom-color: var(--light-line) !important;
    background:
      linear-gradient(90deg, rgba(234, 216, 170, 0.42), rgba(255, 253, 248, 0.68), transparent),
      #fbf7ee !important;
  }

  html[data-theme="light"] body.app-body .section-card .sc-head h3,
  html[data-theme="light"] body.app-body .card .card-header,
  html[data-theme="light"] body.app-body .card-title {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .section-card .sc-head h3 i {
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] body.app-body .stat-card {
    border-color: var(--light-line) !important;
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.24), transparent 52%),
      rgba(255, 253, 248, 0.96) !important;
    box-shadow: var(--light-shadow-soft) !important;
  }

  html[data-theme="light"] body.app-body .stat-card::after {
    border-color: rgba(168, 121, 34, 0.22);
  }

  html[data-theme="light"] body.app-body .stat-card:hover {
    border-color: var(--light-line-strong) !important;
    box-shadow: var(--light-shadow) !important;
  }

  html[data-theme="light"] body.app-body .stat-card .val,
  html[data-theme="light"] body.app-body .stat-card .lbl {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .stat-card .lbl {
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .stat-icon {
    border-color: var(--light-green-line);
    background: #edf5f0 !important;
    color: var(--light-emerald) !important;
  }

  html[data-theme="light"] body.app-body .stat-ic-gold,
  html[data-theme="light"] body.app-body .stat-ic-olive {
    border-color: var(--light-line);
    background: #faf1da !important;
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] body.app-body .stat-ic-danger {
    border-color: rgba(171, 70, 62, 0.2);
    background: #fbebe8 !important;
    color: #93443d !important;
  }

  html[data-theme="light"] body.app-body .pengguna-name-cell .avatar {
    background: var(--light-emerald-strong) !important;
    color: #fff5d8 !important;
  }

  html[data-theme="light"] body.app-body .quick-act {
    border-color: var(--light-line) !important;
    background: rgba(255, 253, 248, 0.9) !important;
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .quick-act i {
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] body.app-body .quick-act:hover {
    border-color: var(--light-line-strong) !important;
    background: #fbf2dd !important;
    color: var(--light-emerald-strong);
    box-shadow: var(--light-shadow-soft);
  }

  /* Buttons */
  html[data-theme="light"] body.app-body .btn-army,
  html[data-theme="light"] body.auth-page .btn-army {
    border-color: #b8872e !important;
    background: linear-gradient(135deg, #eed582, #bd8c31) !important;
    box-shadow: 0 10px 24px rgba(154, 108, 25, 0.18);
    color: #241c0d !important;
  }

  html[data-theme="light"] body.app-body .btn-army:hover,
  html[data-theme="light"] body.auth-page .btn-army:hover,
  html[data-theme="light"] body.app-body .btn-army:focus,
  html[data-theme="light"] body.auth-page .btn-army:focus {
    border-color: #9f701d !important;
    background: linear-gradient(135deg, #f2dd9a, #c99a3f) !important;
    box-shadow: 0 13px 29px rgba(154, 108, 25, 0.24);
    color: #241c0d !important;
  }

  html[data-theme="light"] body.app-body .btn-gold,
  html[data-theme="light"] body.auth-page .btn-gold {
    border-color: var(--light-gold);
    background: linear-gradient(135deg, #efd990, #bd8c31);
    color: #241c0d;
  }

  html[data-theme="light"] body.app-body .btn-outline-army,
  html[data-theme="light"] body.auth-page .btn-outline-army {
    border-color: rgba(31, 107, 73, 0.4) !important;
    background: rgba(255, 253, 248, 0.72) !important;
    color: var(--light-emerald) !important;
  }

  html[data-theme="light"] body.app-body .btn-outline-army:hover,
  html[data-theme="light"] body.auth-page .btn-outline-army:hover,
  html[data-theme="light"] body.app-body .btn-outline-army:focus,
  html[data-theme="light"] body.auth-page .btn-outline-army:focus {
    border-color: var(--light-emerald) !important;
    background: #e9f3ed !important;
    color: var(--light-emerald-strong) !important;
  }

  html[data-theme="light"] body.app-body .btn-outline-secondary,
  html[data-theme="light"] body.auth-page .btn-outline-secondary {
    border-color: rgba(101, 112, 104, 0.32);
    background: #fffdf8;
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .btn-outline-secondary:hover,
  html[data-theme="light"] body.auth-page .btn-outline-secondary:hover {
    border-color: var(--light-muted);
    background: #f0ece3;
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .btn-outline-danger,
  html[data-theme="light"] body.auth-page .btn-outline-danger {
    border-color: rgba(171, 70, 62, 0.34);
    background: rgba(255, 253, 248, 0.72);
    color: #93443d;
  }

  html[data-theme="light"] body.app-body .btn-outline-danger:hover,
  html[data-theme="light"] body.auth-page .btn-outline-danger:hover,
  html[data-theme="light"] body.app-body .btn-danger:hover,
  html[data-theme="light"] body.auth-page .btn-danger:hover {
    border-color: #a1463f;
    background: #8e3c36;
    color: #fff;
  }

  /* Forms and native controls */
  html[data-theme="light"] body.app-body .form-label,
  html[data-theme="light"] body.auth-page .form-label,
  html[data-theme="light"] body.app-body .form-check-label,
  html[data-theme="light"] body.auth-page .form-check-label {
    color: #3d473f;
  }

  html[data-theme="light"] body.app-body .form-control,
  html[data-theme="light"] body.app-body .form-select,
  html[data-theme="light"] body.auth-page .form-control,
  html[data-theme="light"] body.auth-page .form-select {
    border-color: rgba(128, 91, 24, 0.22) !important;
    background-color: rgba(255, 253, 248, 0.96) !important;
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.app-body .form-control:hover,
  html[data-theme="light"] body.app-body .form-select:hover,
  html[data-theme="light"] body.auth-page .form-control:hover,
  html[data-theme="light"] body.auth-page .form-select:hover {
    border-color: rgba(168, 121, 34, 0.38) !important;
  }

  html[data-theme="light"] body.app-body .form-control:focus,
  html[data-theme="light"] body.app-body .form-select:focus,
  html[data-theme="light"] body.auth-page .form-control:focus,
  html[data-theme="light"] body.auth-page .form-select:focus {
    border-color: var(--light-gold) !important;
    background-color: #fffefa !important;
    box-shadow: 0 0 0 3px rgba(168, 121, 34, 0.12), 0 0 22px rgba(168, 121, 34, 0.06) !important;
  }

  html[data-theme="light"] body.app-body .form-control::placeholder,
  html[data-theme="light"] body.auth-page .form-control::placeholder {
    color: #7b857e;
  }

  html[data-theme="light"] body.app-body .form-control:disabled,
  html[data-theme="light"] body.app-body .form-select:disabled,
  html[data-theme="light"] body.app-body .form-control[readonly],
  html[data-theme="light"] body.auth-page .form-control:disabled,
  html[data-theme="light"] body.auth-page .form-select:disabled,
  html[data-theme="light"] body.auth-page .form-control[readonly] {
    border-color: rgba(128, 91, 24, 0.13) !important;
    background: #f1ede4 !important;
    color: #69736c !important;
  }

  html[data-theme="light"] body.app-body .input-group-text,
  html[data-theme="light"] body.auth-page .input-group-text {
    border-color: rgba(128, 91, 24, 0.22) !important;
    background: #f7f0e2 !important;
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] body.app-body .form-text,
  html[data-theme="light"] body.auth-page .form-text {
    color: var(--light-dim);
  }

  html[data-theme="light"] body.app-body .form-check-input,
  html[data-theme="light"] body.auth-page .form-check-input {
    border-color: rgba(128, 91, 24, 0.36);
    background-color: #fffdf8;
  }

  html[data-theme="light"] body.app-body .form-check-input:checked,
  html[data-theme="light"] body.auth-page .form-check-input:checked {
    border-color: var(--light-gold);
    background-color: var(--light-gold);
  }

  html[data-theme="light"] body.app-body .form-check-input:focus,
  html[data-theme="light"] body.auth-page .form-check-input:focus {
    border-color: var(--light-gold);
    box-shadow: 0 0 0 3px rgba(168, 121, 34, 0.14);
  }

  html[data-theme="light"] body.app-body input[type="date"]::-webkit-calendar-picker-indicator,
  html[data-theme="light"] body.auth-page input[type="date"]::-webkit-calendar-picker-indicator {
    filter: none;
    opacity: 0.68;
  }

  html[data-theme="light"] body.app-body input[type="file"]::file-selector-button,
  html[data-theme="light"] body.auth-page input[type="file"]::file-selector-button {
    border-right-color: var(--light-line);
    background: #f4ecdc;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body option,
  html[data-theme="light"] body.auth-page option {
    background: #fffdf8;
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body input:-webkit-autofill,
  html[data-theme="light"] body.auth-page input:-webkit-autofill {
    -webkit-text-fill-color: var(--light-text) !important;
    box-shadow: 0 0 0 1000px #fffdf8 inset !important;
    caret-color: var(--light-text);
  }

  /* Tables */
  html[data-theme="light"] body.app-body .table {
    --bs-table-color: #39433c;
    --bs-table-bg: transparent;
    --bs-table-border-color: rgba(128, 91, 24, 0.12);
    --bs-table-striped-color: var(--light-text);
    --bs-table-striped-bg: rgba(211, 174, 87, 0.065);
    --bs-table-active-color: var(--light-text);
    --bs-table-active-bg: rgba(211, 174, 87, 0.13);
    --bs-table-hover-color: var(--light-text);
    --bs-table-hover-bg: rgba(211, 174, 87, 0.1);
    color: #39433c !important;
  }

  html[data-theme="light"] body.app-body .table thead th {
    border-color: var(--light-line) !important;
    background: linear-gradient(180deg, #f4ead5, #eee3cf) !important;
    color: #625330 !important;
  }

  html[data-theme="light"] body.app-body .table tbody td {
    border-color: rgba(128, 91, 24, 0.1) !important;
    background: transparent !important;
    color: #39433c;
  }

  html[data-theme="light"] body.app-body .table tbody tr:hover,
  html[data-theme="light"] body.app-body .table tbody tr:hover > * {
    background: rgba(234, 216, 170, 0.32) !important;
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.app-body .table tbody tr.table-danger > td {
    border-color: rgba(171, 70, 62, 0.16) !important;
    background: #fbebe8 !important;
    color: #733832 !important;
  }

  /* Semantic badges */
  html[data-theme="light"] body.app-body .badge.b-label,
  html[data-theme="light"] body.app-body .badge.b-biasa,
  html[data-theme="light"] body.app-body .badge.b-draft,
  html[data-theme="light"] body.app-body .badge.bg-secondary {
    border-color: rgba(101, 112, 104, 0.18);
    background: #edf0ec !important;
    color: #556159 !important;
  }

  html[data-theme="light"] body.app-body .badge.b-masuk,
  html[data-theme="light"] body.app-body .badge.b-diterima,
  html[data-theme="light"] body.app-body .badge.b-selesai,
  html[data-theme="light"] body.app-body .badge.b-aktif {
    border-color: rgba(31, 107, 73, 0.2);
    background: #e5f2e9 !important;
    color: #285e40 !important;
  }

  html[data-theme="light"] body.app-body .badge.b-keluar,
  html[data-theme="light"] body.app-body .badge.b-dikirim,
  html[data-theme="light"] body.app-body .badge.b-penting,
  html[data-theme="light"] body.app-body .badge.b-pimpinan {
    border-color: rgba(168, 121, 34, 0.2);
    background: #f8efd8 !important;
    color: #76571c !important;
  }

  html[data-theme="light"] body.app-body .badge.b-menunggu,
  html[data-theme="light"] body.app-body .badge.b-diproses,
  html[data-theme="light"] body.app-body .badge.b-ajudan {
    border-color: rgba(50, 107, 154, 0.2);
    background: #e7f0f7 !important;
    color: #365f80 !important;
  }

  html[data-theme="light"] body.app-body .badge.b-segera,
  html[data-theme="light"] body.app-body .badge.b-rahasia,
  html[data-theme="light"] body.app-body .badge.b-sangat,
  html[data-theme="light"] body.app-body .badge.b-lewat-batas,
  html[data-theme="light"] body.app-body .badge.b-nonaktif,
  html[data-theme="light"] body.app-body .badge.bg-danger {
    border-color: rgba(171, 70, 62, 0.2) !important;
    background: #fae8e5 !important;
    color: #89413a !important;
  }

  html[data-theme="light"] body.app-body .badge.b-admin,
  html[data-theme="light"] body.app-body .badge.b-staf {
    border-color: rgba(31, 107, 73, 0.2);
    background: #e3f0e8 !important;
    color: #285e40 !important;
  }

  /* Dropdowns, modal, alerts, and pagination */
  html[data-theme="light"] body.app-body .dropdown-menu,
  html[data-theme="light"] body.auth-page .dropdown-menu {
    --bs-dropdown-bg: #fffdf8;
    --bs-dropdown-color: var(--light-text);
    --bs-dropdown-border-color: var(--light-line);
    --bs-dropdown-link-color: #414b44;
    --bs-dropdown-link-hover-color: var(--light-emerald-strong);
    --bs-dropdown-link-hover-bg: #f7efde;
    --bs-dropdown-link-active-color: #241c0d;
    --bs-dropdown-link-active-bg: #e4c978;
    border-color: var(--light-line-strong) !important;
    background: rgba(255, 253, 248, 0.98) !important;
    box-shadow: 0 22px 60px rgba(78, 60, 24, 0.16) !important;
  }

  html[data-theme="light"] body.app-body .dropdown-item {
    color: #414b44;
  }

  html[data-theme="light"] body.app-body .dropdown-item:hover,
  html[data-theme="light"] body.app-body .dropdown-item:focus {
    background: #f7efde;
    color: var(--light-emerald-strong);
  }

  html[data-theme="light"] body.app-body .modal-content,
  html[data-theme="light"] body.auth-page .modal-content {
    --bs-modal-bg: #fffdf8;
    --bs-modal-color: var(--light-text);
    --bs-modal-border-color: var(--light-line-strong);
    border-color: var(--light-line-strong) !important;
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.18), transparent 42%),
      #fffdf8 !important;
    box-shadow: 0 30px 90px rgba(66, 49, 18, 0.24) !important;
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .modal-header,
  html[data-theme="light"] body.app-body .modal-footer,
  html[data-theme="light"] body.auth-page .modal-header,
  html[data-theme="light"] body.auth-page .modal-footer {
    border-color: var(--light-line) !important;
    background: #faf5e9 !important;
  }

  html[data-theme="light"] body.app-body .modal-backdrop.show,
  html[data-theme="light"] body.auth-page .modal-backdrop.show {
    opacity: 0.45;
  }

  html[data-theme="light"] body.app-body .btn-close,
  html[data-theme="light"] body.auth-page .btn-close {
    filter: none;
  }

  html[data-theme="light"] body.app-body .alert-success,
  html[data-theme="light"] body.auth-page .alert-success {
    border-color: rgba(31, 107, 73, 0.2);
    background: #e7f3ea;
    color: #285e40;
  }

  html[data-theme="light"] body.app-body .alert-danger,
  html[data-theme="light"] body.auth-page .alert-danger {
    border-color: rgba(171, 70, 62, 0.2);
    background: #fae9e6;
    color: #7f3b35;
  }

  html[data-theme="light"] body.app-body .alert-warning,
  html[data-theme="light"] body.auth-page .alert-warning {
    border-color: rgba(168, 121, 34, 0.23);
    background: #fbf1d9;
    color: #70521b;
  }

  html[data-theme="light"] body.app-body .alert-info,
  html[data-theme="light"] body.auth-page .alert-info {
    border-color: rgba(50, 107, 154, 0.2);
    background: #e9f2f8;
    color: #365f80;
  }

  html[data-theme="light"] body.app-body .pagination {
    --bs-pagination-color: var(--light-emerald);
    --bs-pagination-bg: #fffdf8;
    --bs-pagination-border-color: var(--light-line);
    --bs-pagination-hover-color: var(--light-gold-strong);
    --bs-pagination-hover-bg: #f8efd9;
    --bs-pagination-hover-border-color: var(--light-line-strong);
    --bs-pagination-focus-color: var(--light-gold-strong);
    --bs-pagination-focus-bg: #f8efd9;
    --bs-pagination-active-color: #241c0d;
    --bs-pagination-active-bg: #dfc16e;
    --bs-pagination-active-border-color: #bd8c31;
    --bs-pagination-disabled-color: #929991;
    --bs-pagination-disabled-bg: #f0ede6;
    --bs-pagination-disabled-border-color: rgba(128, 91, 24, 0.1);
  }

  html[data-theme="light"] body.app-body .page-link {
    border-color: var(--light-line);
    background: #fffdf8;
    color: var(--light-emerald);
  }

  html[data-theme="light"] body.app-body .pagination .page-item.active .page-link {
    border-color: #a87922 !important;
    background: linear-gradient(135deg, #e8cf83, #bd8c31) !important;
    color: #241c0d !important;
  }

  html[data-theme="light"] body.app-body .pagination .page-item.disabled .page-link {
    border-color: rgba(128, 91, 24, 0.1) !important;
    background: #f0ede6 !important;
    color: #7b827c !important;
  }

  html[data-theme="light"] body.app-body .progress {
    background: #eee6d7 !important;
  }

  html[data-theme="light"] body.app-body .progress-bar {
    background: linear-gradient(90deg, var(--light-emerald-strong), var(--light-emerald)) !important;
  }

  html[data-theme="light"] body.app-body .progress-bar.bg-olive,
  html[data-theme="light"] body.app-body .progress-bar[style*="var(--gold)"] {
    background: linear-gradient(90deg, #9b6e1f, #d1ad55) !important;
  }

  html[data-theme="light"] body.app-body .tooltip {
    --bs-tooltip-bg: #4b3d20;
    --bs-tooltip-color: #fffdf8;
  }

  /* Letter lists */
  html[data-theme="light"] body.app-body .letter-list {
    background: rgba(240, 234, 223, 0.55);
  }

  html[data-theme="light"] body.app-body .letter-card {
    border-color: var(--light-line);
    background:
      linear-gradient(135deg, rgba(234, 216, 170, 0.16), transparent 48%),
      rgba(255, 253, 248, 0.96);
    box-shadow: 0 7px 23px rgba(78, 60, 24, 0.07);
  }

  html[data-theme="light"] body.app-body .letter-card:hover {
    border-color: var(--light-line-strong);
    box-shadow: var(--light-shadow-soft);
  }

  html[data-theme="light"] body.app-body .letter-card-head,
  html[data-theme="light"] body.app-body .letter-footer {
    border-color: var(--light-line);
  }

  html[data-theme="light"] body.app-body .letter-index,
  html[data-theme="light"] body.app-body .letter-date,
  html[data-theme="light"] body.app-body .letter-action-label,
  html[data-theme="light"] body.app-body .letter-file-link {
    border-color: var(--light-line);
    background: #f7f0e2;
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .letter-action-label:hover,
  html[data-theme="light"] body.app-body .letter-file-link:hover {
    border-color: var(--light-line-strong);
    background: #f4e6c8;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .letter-type.incoming {
    background: #e5f2e9;
    color: #285e40;
  }

  html[data-theme="light"] body.app-body .letter-type.outgoing {
    background: #f8efd8;
    color: #76571c;
  }

  html[data-theme="light"] body.app-body .letter-agenda,
  html[data-theme="light"] body.app-body .letter-label {
    color: var(--light-dim);
  }

  html[data-theme="light"] body.app-body .letter-number,
  html[data-theme="light"] body.app-body .letter-value,
  html[data-theme="light"] body.app-body .letter-subject,
  html[data-theme="light"] body.app-body .letter-empty h5 {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .letter-empty,
  html[data-theme="light"] body.app-body .letter-pagination {
    border-color: var(--light-line);
    background: rgba(255, 253, 248, 0.92);
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .letter-empty i {
    background: #f7eedb;
    color: var(--light-gold-strong);
  }

  /* Archive */
  html[data-theme="light"] body.app-body .archive-page {
    --archive-border: var(--light-line);
    --archive-soft: var(--light-surface-2);
    --archive-green: var(--light-emerald);
    --archive-green-soft: #e7f2ea;
    --archive-gold: var(--light-gold);
    --archive-text: var(--light-text);
    --archive-muted: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .archive-filter-card,
  html[data-theme="light"] body.app-body .archive-result-card {
    border-color: var(--light-line) !important;
    background: rgba(255, 253, 248, 0.96) !important;
    box-shadow: var(--light-shadow-soft) !important;
  }

  html[data-theme="light"] body.app-body .archive-filter-head,
  html[data-theme="light"] body.app-body .archive-result-head {
    border-color: var(--light-line);
    background:
      linear-gradient(90deg, rgba(234, 216, 170, 0.42), rgba(255, 253, 248, 0.68), transparent),
      #fbf7ee;
  }

  html[data-theme="light"] body.app-body .archive-search .form-control,
  html[data-theme="light"] body.app-body .archive-page .form-select,
  html[data-theme="light"] body.app-body .archive-page input[type="date"] {
    background-color: #fffdf8 !important;
  }

  html[data-theme="light"] body.app-body .archive-count {
    border-color: var(--light-line);
    background: #f8efd8;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .archive-item {
    border-color: var(--light-line);
    background: rgba(255, 253, 248, 0.9);
  }

  html[data-theme="light"] body.app-body .archive-item:hover {
    border-color: var(--light-line-strong);
    box-shadow: var(--light-shadow-soft);
  }

  html[data-theme="light"] body.app-body .archive-type-badge.is-masuk {
    background: #e5f2e9;
    color: #285e40;
  }

  html[data-theme="light"] body.app-body .archive-type-badge.is-keluar {
    background: #f8efd8;
    color: #76571c;
  }

  html[data-theme="light"] body.app-body .archive-type-badge.is-gabungan {
    background: linear-gradient(135deg, #e5f2e9, #f8efd8);
    color: #48544c;
  }

  html[data-theme="light"] body.app-body .archive-meta-value,
  html[data-theme="light"] body.app-body .archive-date {
    color: #4e5952;
  }

  html[data-theme="light"] body.app-body .archive-pagination {
    border-color: var(--light-line);
    background: #fbf8f1;
  }

  /* Agenda and custom select */
  html[data-theme="light"] body.app-body .agenda-tab {
    border-color: var(--light-line);
    background: rgba(255, 253, 248, 0.9);
    color: #4c574f;
  }

  html[data-theme="light"] body.app-body .agenda-tab:hover {
    border-color: var(--light-line-strong);
    background: #f8efd9;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .agenda-tab.active {
    border-color: #b8872e;
    background: linear-gradient(135deg, #e7cb78, #ae7c27);
    box-shadow: 0 12px 26px rgba(128, 91, 24, 0.18);
    color: #241c0d;
  }

  html[data-theme="light"] body.app-body .agenda-tab .agenda-count {
    background: #f4ead5;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .agenda-tab.active .agenda-count {
    background: rgba(255, 255, 255, 0.34);
    color: #241c0d;
  }

  html[data-theme="light"] body.app-body .jenis-surat-trigger {
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.app-body .jenis-surat-menu {
    border-color: var(--light-line-strong);
    background: #fffdf8;
    box-shadow: 0 20px 50px rgba(78, 60, 24, 0.17);
  }

  html[data-theme="light"] body.app-body .jenis-surat-option {
    color: #414b44;
  }

  html[data-theme="light"] body.app-body .jenis-surat-option:hover,
  html[data-theme="light"] body.app-body .jenis-surat-option:focus,
  html[data-theme="light"] body.app-body .jenis-surat-option.active {
    background: #f7efde;
    color: var(--light-gold-strong);
  }

  /* Disposition */
  html[data-theme="light"] body.app-body .disposisi-task-item {
    border-color: var(--light-line);
    background: #fbf7ee;
  }

  html[data-theme="light"] body.app-body .disposisi-task-item strong {
    color: var(--light-emerald);
  }

  html[data-theme="light"] body.app-body .disposisi-target-box,
  html[data-theme="light"] body.app-body .disposisi-instruction-box {
    border-color: var(--light-line-strong) !important;
    background: rgba(250, 246, 237, 0.62) !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-head,
  html[data-theme="light"] body.app-body .disposisi-instruction-head,
  html[data-theme="light"] body.app-body .disposisi-target-footer,
  html[data-theme="light"] body.app-body .disposisi-instruction-footer {
    border-color: var(--light-line) !important;
    background: #f8f1e3 !important;
    color: #424d45 !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-grid,
  html[data-theme="light"] body.app-body .disposisi-instruction-grid {
    background: rgba(255, 253, 248, 0.48) !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-item,
  html[data-theme="light"] body.app-body .disposisi-instruction-item {
    border-color: var(--light-line) !important;
    background: rgba(255, 253, 248, 0.92) !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-item:hover,
  html[data-theme="light"] body.app-body .disposisi-instruction-item:hover {
    border-color: var(--light-line-strong) !important;
    background: #faf1dc !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-item:has(.form-check-input:checked),
  html[data-theme="light"] body.app-body .disposisi-instruction-item:has(.form-check-input:checked) {
    border-color: rgba(168, 121, 34, 0.48) !important;
    background: #f7e9c9 !important;
    box-shadow: inset 0 0 20px rgba(168, 121, 34, 0.05) !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-name,
  html[data-theme="light"] body.app-body .disposisi-instruction-name {
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-check,
  html[data-theme="light"] body.app-body .disposisi-instruction-check,
  html[data-theme="light"] body.app-body .disposisi-target-item .form-check-input:not(:checked) + .disposisi-target-check {
    border-color: rgba(128, 91, 24, 0.34) !important;
    background: #fffdf8 !important;
  }

  html[data-theme="light"] body.app-body .disposisi-target-item .form-check-input:checked + .disposisi-target-check,
  html[data-theme="light"] body.app-body .disposisi-instruction-item:has(.form-check-input:checked) .disposisi-instruction-check {
    border-color: var(--light-gold) !important;
    background: var(--light-gold) !important;
    color: #fffdf8 !important;
  }

  /* Profile and organization */
  html[data-theme="light"] body.app-body .profile-cover {
    background:
      radial-gradient(circle at 78% 22%, rgba(255, 255, 255, 0.32), transparent 26%),
      linear-gradient(135deg, #d8bc69 0%, #aa7d2a 58%, #315c42 100%);
  }

  html[data-theme="light"] body.app-body .profile-photo-large {
    border-color: #fffdf8;
    box-shadow: 0 0 0 1px var(--light-line-strong), 0 13px 28px rgba(78, 60, 24, 0.17);
  }

  html[data-theme="light"] body.app-body .profile-summary h3,
  html[data-theme="light"] body.app-body .profile-info-list strong,
  html[data-theme="light"] body.app-body .profile-readonly-title,
  html[data-theme="light"] body.app-body .profile-readonly-grid strong {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .profile-summary p,
  html[data-theme="light"] body.app-body .profile-save-hint,
  html[data-theme="light"] body.app-body .profile-file-name,
  html[data-theme="light"] body.app-body .profile-readonly-box p {
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .profile-info-list > div,
  html[data-theme="light"] body.app-body .profile-readonly-box,
  html[data-theme="light"] body.app-body .profile-readonly-grid > div {
    border-color: var(--light-line);
    background: #fbf7ee;
  }

  html[data-theme="light"] body.app-body .profile-info-list i {
    background: #f6ebd3;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .profile-info-list small,
  html[data-theme="light"] body.app-body .profile-readonly-grid small {
    color: var(--light-dim);
  }

  html[data-theme="light"] body.app-body .profile-photo-editor,
  html[data-theme="light"] body.app-body .profile-form-actions {
    border-color: var(--light-line);
  }

  html[data-theme="light"] body.app-body .org-chart {
    border-color: var(--light-line);
    background:
      linear-gradient(rgba(168, 121, 34, 0.05) 1px, transparent 1px),
      linear-gradient(90deg, rgba(168, 121, 34, 0.05) 1px, transparent 1px),
      rgba(250, 246, 237, 0.7);
    background-size: 34px 34px, 34px 34px, auto;
  }

  html[data-theme="light"] body.app-body .org-card {
    border-color: var(--light-line-strong);
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.26), transparent 50%),
      rgba(255, 253, 248, 0.96);
    box-shadow: var(--light-shadow-soft);
  }

  html[data-theme="light"] body.app-body .org-jabatan {
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .org-photo {
    border-color: var(--light-line-strong);
    background: #f5ecda;
  }

  html[data-theme="light"] body.app-body .org-nama {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .org-pangkat {
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .org-connector-v {
    background: linear-gradient(var(--light-gold), rgba(168, 121, 34, 0.2));
  }

  html[data-theme="light"] body.app-body .org-connector-h {
    background: linear-gradient(90deg, transparent, var(--light-gold), transparent);
  }

  html[data-theme="light"] body.app-body .org-edit-card {
    border-color: var(--light-line);
    background: #fbf7ee;
  }

  html[data-theme="light"] body.app-body .org-edit-card h4 {
    color: var(--light-gold-strong);
  }

  /* Details and empty states */
  html[data-theme="light"] body.app-body .info-list li {
    border-color: var(--light-line);
  }

  html[data-theme="light"] body.app-body .info-list .k {
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .info-list .v {
    color: var(--light-text);
  }

  html[data-theme="light"] body.app-body .pdf-box {
    border-color: var(--light-line-strong);
    background: #fbf7ee;
  }

  html[data-theme="light"] body.app-body iframe {
    border-color: var(--light-line-strong) !important;
    background: #e8e8e5;
  }

  html[data-theme="light"] body.app-body .empty-state,
  html[data-theme="light"] body.app-body .archive-empty {
    color: var(--light-muted);
  }

  html[data-theme="light"] body.app-body .empty-state i,
  html[data-theme="light"] body.app-body .archive-empty .icon-wrap {
    background: #f6ebd3;
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.app-body .empty-state h5,
  html[data-theme="light"] body.app-body .archive-empty h5 {
    color: var(--light-text);
  }

  /* Authentication keeps photography as a cinematic dark island. */
  html[data-theme="light"] body.auth-page .auth-wrap {
    background: transparent !important;
  }

  html[data-theme="light"] body.auth-page .auth-info {
    background:
      linear-gradient(110deg, rgba(22, 28, 23, 0.9), rgba(45, 51, 37, 0.62)),
      linear-gradient(0deg, rgba(32, 27, 16, 0.68), transparent 54%),
      url('../images/berita/apel-siaga.jpg') center/cover !important;
    color: #fffdf8 !important;
  }

  html[data-theme="light"] body.auth-page .auth-info::before {
    background-image:
      linear-gradient(rgba(234, 216, 170, 0.075) 1px, transparent 1px),
      linear-gradient(90deg, rgba(234, 216, 170, 0.075) 1px, transparent 1px);
  }

  html[data-theme="light"] body.auth-page .auth-info::after {
    color: rgba(234, 216, 170, 0.08);
  }

  html[data-theme="light"] body.auth-page .auth-brand {
    border-color: rgba(234, 216, 170, 0.34);
    background: rgba(40, 35, 23, 0.42);
  }

  html[data-theme="light"] body.auth-page .auth-info h1,
  html[data-theme="light"] body.auth-page .auth-feature b {
    color: #fffdf8;
  }

  html[data-theme="light"] body.auth-page .auth-info p,
  html[data-theme="light"] body.auth-page .auth-feature span {
    color: #ded9cd;
  }

  html[data-theme="light"] body.auth-page .auth-feature {
    border-left-color: rgba(234, 216, 170, 0.64);
    background: linear-gradient(90deg, rgba(234, 216, 170, 0.11), transparent);
  }

  html[data-theme="light"] body.auth-page .auth-feature i {
    color: #f0d98f;
  }

  html[data-theme="light"] body.auth-page .auth-card {
    border-left-color: var(--light-line);
    background:
      radial-gradient(circle at 85% 10%, rgba(211, 174, 87, 0.18), transparent 25%),
      rgba(250, 247, 240, 0.94) !important;
  }

  html[data-theme="light"] body.auth-page .auth-card::before {
    background: linear-gradient(transparent, var(--light-gold-bright), var(--light-emerald), transparent);
  }

  html[data-theme="light"] body.auth-page .auth-card .ac-inner {
    border-color: var(--light-line-strong);
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.22), transparent 42%),
      rgba(255, 253, 248, 0.96);
    box-shadow: var(--light-shadow);
  }

  html[data-theme="light"] body.auth-page .auth-card h2 {
    color: var(--light-text);
  }

  html[data-theme="light"] body.auth-page .auth-card .lead {
    color: var(--light-muted);
  }

  html[data-theme="light"] body.auth-page .back-link {
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] body.auth-page .back-link:hover {
    color: var(--light-emerald);
  }

  /* Light focus treatment */
  html[data-theme="light"] body.app-body :focus-visible,
  html[data-theme="light"] body.auth-page :focus-visible {
    outline-color: var(--light-gold);
    box-shadow: 0 0 0 5px rgba(168, 121, 34, 0.11);
  }

  /* Public portal light luxury theme */
  html[data-theme="light"] {
    --portal-bg: var(--light-canvas);
    --portal-bg-soft: var(--light-canvas-soft);
    --portal-surface: var(--light-surface);
    --portal-surface-2: var(--light-surface-2);
    --portal-surface-3: var(--light-surface-3);
    --portal-text: var(--light-text);
    --portal-muted: var(--light-muted);
    --portal-dim: var(--light-dim);
    --portal-emerald: var(--light-emerald);
    --portal-emerald-strong: var(--light-emerald-strong);
    --portal-gold: var(--light-gold);
    --portal-gold-soft: var(--light-gold-bright);
    --portal-line: var(--light-line);
    --portal-line-strong: var(--light-line-strong);
    --portal-glass: rgba(255, 253, 248, 0.76);
    --portal-shadow: var(--light-shadow);
  }

  html[data-theme="light"] body.public-v3 {
    background:
      radial-gradient(circle at 8% 16%, rgba(211, 174, 87, 0.16), transparent 29%),
      radial-gradient(circle at 92% 42%, rgba(31, 107, 73, 0.07), transparent 24%),
      linear-gradient(180deg, #fbf9f4 0%, #f1eadf 48%, #faf8f2 100%);
    color: var(--light-text);
  }

  html[data-theme="light"] body.public-v3 ::selection {
    background: #d9b964;
    color: #201a0e;
  }

  html[data-theme="light"] .portal-skip-link {
    border-color: var(--light-gold);
    background: #fffdf8;
    box-shadow: var(--light-shadow-soft);
    color: var(--light-text) !important;
  }

  html[data-theme="light"] body.public-v3::-webkit-scrollbar-track {
    background: #f1eadf;
  }

  html[data-theme="light"] body.public-v3::-webkit-scrollbar-thumb {
    border-color: #f1eadf;
    background: #bca15e;
  }

  html[data-theme="light"] body.public-v3::-webkit-scrollbar-thumb:hover {
    background: var(--light-gold);
  }

  html[data-theme="light"] .portal-noise {
    opacity: 0.025;
    mix-blend-mode: multiply;
  }

  html[data-theme="light"] .portal-orb-one {
    background: radial-gradient(circle, rgba(211, 174, 87, 0.2), transparent 68%);
  }

  html[data-theme="light"] .portal-orb-two {
    background: radial-gradient(circle, rgba(31, 107, 73, 0.1), transparent 68%);
  }

  html[data-theme="light"] .portal-cursor-glow {
    background: radial-gradient(circle, rgba(211, 174, 87, 0.15), transparent 68%);
  }

  html[data-theme="light"] .portal-scroll-progress span {
    background: linear-gradient(90deg, var(--light-emerald), var(--light-gold-bright));
    box-shadow: 0 0 13px rgba(168, 121, 34, 0.42);
  }

  /* The navigation remains dark over the photo, then becomes pearl glass. */
  html[data-theme="light"] .public-nav:not(.scrolled):not(.menu-open) .public-brand strong,
  html[data-theme="light"] .public-nav:not(.scrolled):not(.menu-open) .nav-links a {
    color: #edf8f2 !important;
  }

  html[data-theme="light"] .public-nav:not(.scrolled):not(.menu-open) .public-brand small {
    color: #a8b9b0;
  }

  html[data-theme="light"] .public-nav.scrolled,
  html[data-theme="light"] .public-nav.menu-open {
    border-bottom-color: var(--light-line);
    background: rgba(255, 253, 248, 0.9);
    box-shadow: 0 12px 35px rgba(78, 60, 24, 0.1);
    backdrop-filter: blur(18px) saturate(135%);
  }

  html[data-theme="light"] .public-nav.scrolled::after,
  html[data-theme="light"] .public-nav.menu-open::after {
    background: linear-gradient(90deg, transparent, var(--light-gold-bright), var(--light-emerald), transparent);
  }

  html[data-theme="light"] .public-nav.scrolled .public-brand strong,
  html[data-theme="light"] .public-nav.menu-open .public-brand strong,
  html[data-theme="light"] .public-nav.scrolled .nav-links a,
  html[data-theme="light"] .public-nav.menu-open .nav-links a {
    color: var(--light-text) !important;
  }

  html[data-theme="light"] .public-nav.scrolled .public-brand small,
  html[data-theme="light"] .public-nav.menu-open .public-brand small {
    color: var(--light-muted);
  }

  html[data-theme="light"] .nav-links a::before {
    background: linear-gradient(var(--light-gold-bright), var(--light-gold));
  }

  html[data-theme="light"] .public-nav.scrolled .nav-links a:hover,
  html[data-theme="light"] .public-nav.scrolled .nav-links a.active,
  html[data-theme="light"] .public-nav.scrolled .nav-links a[aria-current="location"],
  html[data-theme="light"] .public-nav.menu-open .nav-links a:hover,
  html[data-theme="light"] .public-nav.menu-open .nav-links a.active,
  html[data-theme="light"] .public-nav.menu-open .nav-links a[aria-current="location"] {
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] .public-menu-toggle span {
    background: currentColor;
  }

  html[data-theme="light"] .public-nav:not(.scrolled):not(.menu-open) .public-menu-toggle {
    border-color: rgba(234, 216, 170, 0.32);
    color: #edf8f2;
  }

  html[data-theme="light"] .public-nav.scrolled .public-menu-toggle,
  html[data-theme="light"] .public-nav.menu-open .public-menu-toggle {
    border-color: var(--light-line-strong);
    background: rgba(255, 253, 248, 0.9);
    color: var(--light-text);
  }

  html[data-theme="light"] .v3-nav-action {
    border-color: #b8872e;
    background: linear-gradient(135deg, #efd987, #bd8c31);
    box-shadow: 0 11px 27px rgba(128, 91, 24, 0.2);
    color: #241c0d !important;
  }

  html[data-theme="light"] .v3-nav-action:hover {
    box-shadow: 0 15px 34px rgba(128, 91, 24, 0.28);
  }

  /* Hero and media cards remain cinematic dark islands. */
  html[data-theme="light"] .v3-hero,
  html[data-theme="light"] .v3-hero h1,
  html[data-theme="light"] .v3-hero-side,
  html[data-theme="light"] .v3-live-status,
  html[data-theme="light"] .v3-emblem-card,
  html[data-theme="light"] .v3-fact-strip,
  html[data-theme="light"] .v3-scroll-cue {
    color: #edf8f2;
  }

  html[data-theme="light"] .v3-scroll-cue {
    color: rgba(237, 248, 242, 0.68) !important;
  }

  html[data-theme="light"] .v3-hero-copy {
    color: #bdcec5;
  }

  html[data-theme="light"] .v3-live-status,
  html[data-theme="light"] .v3-emblem-card,
  html[data-theme="light"] .v3-fact-strip {
    border-color: rgba(234, 216, 170, 0.28);
    background: rgba(7, 16, 12, 0.66);
  }

  html[data-theme="light"] .v3-eyebrow,
  html[data-theme="light"] .v3-hero h1 .accent,
  html[data-theme="light"] .v3-hero .v3-data-label,
  html[data-theme="light"] .v3-emblem-copy b,
  html[data-theme="light"] .v3-fact strong {
    color: #f1d994;
  }

  html[data-theme="light"] .v3-btn.primary {
    border-color: #d6b65e;
    background: linear-gradient(135deg, #f0dc96, #c6983e);
    color: #231b0d;
  }

  html[data-theme="light"] .v3-btn.ghost {
    border-color: rgba(255, 255, 255, 0.42);
    background: rgba(7, 16, 12, 0.46);
    color: #fff;
  }

  html[data-theme="light"] .v3-hero-controls {
    border-color: rgba(234, 216, 170, 0.24);
    background: rgba(7, 16, 12, 0.62);
    color: #edf8f2;
  }

  html[data-theme="light"] .v3-marquee {
    border-color: rgba(128, 91, 24, 0.2);
    background: linear-gradient(90deg, #ead59d, #f5e8c2, #d7b968);
    color: #3d3017;
    box-shadow: 0 11px 28px rgba(93, 67, 18, 0.12);
  }

  html[data-theme="light"] .v3-marquee::before {
    background: linear-gradient(90deg, #ead59d, transparent);
  }

  html[data-theme="light"] .v3-marquee::after {
    background: linear-gradient(-90deg, #d7b968, transparent);
  }

  html[data-theme="light"] .v3-section {
    border-bottom-color: var(--light-line);
    background-color: rgba(255, 253, 248, 0.56);
    color: var(--light-text);
  }

  html[data-theme="light"] .v3-section:nth-of-type(even) {
    background-color: rgba(241, 234, 223, 0.72);
  }

  html[data-theme="light"] .v3-section::before {
    background: linear-gradient(180deg, transparent, rgba(168, 121, 34, 0.28) 12%, rgba(168, 121, 34, 0.06) 88%, transparent);
  }

  html[data-theme="light"] .v3-section.v3-grid-bg {
    background-color: #f3ede2;
    background-image:
      linear-gradient(rgba(168, 121, 34, 0.055) 1px, transparent 1px),
      linear-gradient(90deg, rgba(168, 121, 34, 0.055) 1px, transparent 1px),
      radial-gradient(circle at 88% 25%, rgba(31, 107, 73, 0.055), transparent 24%);
  }

  html[data-theme="light"] .v3-section-head h2,
  html[data-theme="light"] .v3-profile-body h3,
  html[data-theme="light"] .v3-timeline-card h3,
  html[data-theme="light"] .v3-service h3,
  html[data-theme="light"] .v3-contact-card h3 {
    color: var(--light-text);
  }

  html[data-theme="light"] .v3-section-head p,
  html[data-theme="light"] .v3-profile-body p,
  html[data-theme="light"] .v3-timeline-card p,
  html[data-theme="light"] .v3-service p {
    color: var(--light-muted);
  }

  html[data-theme="light"] .v3-section-head p {
    border-left-color: var(--light-gold-bright);
  }

  html[data-theme="light"] .v3-kicker,
  html[data-theme="light"] .v3-timeline-card time,
  html[data-theme="light"] .v3-contact-card .v3-data-label {
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] .v3-panel,
  html[data-theme="light"] .v3-timeline-card,
  html[data-theme="light"] .v3-service,
  html[data-theme="light"] .v3-contact-card {
    border-color: var(--light-line);
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.2), transparent 48%),
      rgba(255, 253, 248, 0.94);
    box-shadow: var(--light-shadow-soft);
  }

  html[data-theme="light"] .v3-panel:hover,
  html[data-theme="light"] .v3-timeline-card:hover,
  html[data-theme="light"] .v3-service:hover {
    border-color: var(--light-line-strong);
    box-shadow: var(--light-shadow);
  }

  html[data-theme="light"] .v3-profile-photo::before {
    background:
      linear-gradient(90deg, transparent 55%, rgba(32, 29, 18, 0.46) 100%),
      linear-gradient(0deg, rgba(32, 29, 18, 0.52), transparent 58%);
  }

  html[data-theme="light"] .v3-image-label {
    border-color: rgba(234, 216, 170, 0.28);
    background: rgba(28, 31, 23, 0.7);
    color: #f6e8c3;
  }

  html[data-theme="light"] .v3-mini-fact {
    border-color: var(--light-line);
    background: #f8f1e3;
  }

  html[data-theme="light"] .v3-mini-fact b {
    color: var(--light-text);
  }

  html[data-theme="light"] .v3-mini-fact span {
    color: var(--light-muted);
  }

  html[data-theme="light"] .v3-timeline::before {
    background: linear-gradient(90deg, transparent, var(--light-gold-bright), transparent);
  }

  html[data-theme="light"] .v3-timeline-card .num,
  html[data-theme="light"] .v3-service-number {
    color: rgba(168, 121, 34, 0.1);
  }

  html[data-theme="light"] .v3-service::after {
    background: linear-gradient(90deg, var(--light-gold), transparent);
    box-shadow: 0 0 13px rgba(168, 121, 34, 0.28);
  }

  html[data-theme="light"] .v3-service-icon {
    border: 1px solid rgba(168, 121, 34, 0.24);
    background: linear-gradient(145deg, #f0d78c, #b9872f);
    color: #203028;
    box-shadow: 0 11px 25px rgba(128, 91, 24, 0.17);
  }

  html[data-theme="light"] .v3-service a {
    color: var(--light-emerald) !important;
  }

  html[data-theme="light"] .v3-news,
  html[data-theme="light"] .v3-gallery button,
  html[data-theme="light"] .portal-media-modal .modal-content {
    color: #fff;
  }

  html[data-theme="light"] .v3-news::before {
    background: linear-gradient(0deg, rgba(18, 26, 20, 0.92), rgba(18, 31, 22, 0.08) 68%);
  }

  html[data-theme="light"] .v3-news-tag {
    color: #f1d994;
  }

  html[data-theme="light"] .v3-news h3,
  html[data-theme="light"] .v3-gallery .caption {
    color: #fff;
  }

  html[data-theme="light"] .v3-news small {
    color: rgba(255, 255, 255, 0.68);
  }

  html[data-theme="light"] .v3-contact-row {
    border-bottom-color: var(--light-line);
  }

  html[data-theme="light"] .v3-contact-row i {
    color: var(--light-gold-strong);
  }

  html[data-theme="light"] .v3-contact-row b {
    color: var(--light-text);
  }

  html[data-theme="light"] .v3-contact-row span {
    color: var(--light-muted);
  }

  html[data-theme="light"] a.v3-contact-row:hover {
    background: #f8f1e3;
  }

  html[data-theme="light"] .v3-footer {
    border-top-color: rgba(234, 216, 170, 0.22);
    background:
      linear-gradient(rgba(234, 216, 170, 0.04) 1px, transparent 1px),
      linear-gradient(90deg, rgba(234, 216, 170, 0.04) 1px, transparent 1px),
      #173527;
    color: #edf3ef;
  }

  html[data-theme="light"] .v3-footer h4,
  html[data-theme="light"] .v3-footer a {
    color: #efd892;
  }

  html[data-theme="light"] .v3-footer p,
  html[data-theme="light"] .v3-footer li,
  html[data-theme="light"] .v3-footer small {
    color: rgba(237, 243, 239, 0.68);
  }

  html[data-theme="light"] .v3-footer-bottom {
    border-top-color: rgba(234, 216, 170, 0.18);
    color: rgba(237, 243, 239, 0.52);
  }

  html[data-theme="light"] .portal-media-modal .modal-content {
    border-color: rgba(234, 216, 170, 0.24) !important;
    background: #07100d !important;
  }

  html[data-theme="light"] body.public-v3 :focus-visible {
    outline-color: var(--light-gold);
    box-shadow: 0 0 0 5px rgba(168, 121, 34, 0.12);
  }

  /* Light system loader */
  html[data-theme="light"] {
    --site-system-bg: var(--light-canvas);
    --site-system-surface: var(--light-surface);
    --site-system-text: var(--light-text);
    --site-system-muted: var(--light-muted);
    --site-system-emerald: var(--light-emerald);
    --site-system-gold: var(--light-gold);
  }

  html[data-theme="light"] .site-loader {
    background:
      radial-gradient(circle at 18% 24%, rgba(211, 174, 87, 0.2), transparent 30%),
      radial-gradient(circle at 82% 76%, rgba(31, 107, 73, 0.09), transparent 26%),
      rgba(247, 243, 234, 0.97);
  }

  html[data-theme="light"] .site-loader::before {
    background-image:
      linear-gradient(rgba(168, 121, 34, 0.065) 1px, transparent 1px),
      linear-gradient(90deg, rgba(168, 121, 34, 0.065) 1px, transparent 1px);
  }

  html[data-theme="light"] .site-loader::after {
    background: linear-gradient(180deg, transparent, rgba(211, 174, 87, 0.16), transparent);
  }

  html[data-theme="light"] .site-loader-panel {
    border-color: rgba(168, 121, 34, 0.38);
    background:
      linear-gradient(145deg, rgba(234, 216, 170, 0.28), transparent 42%),
      rgba(255, 253, 248, 0.94);
    box-shadow: 0 32px 90px rgba(78, 60, 24, 0.18), inset 0 0 46px rgba(211, 174, 87, 0.07);
    color: var(--light-text);
  }

  html[data-theme="light"] .site-loader-mark img {
    filter: drop-shadow(0 12px 17px rgba(78, 60, 24, 0.2));
  }

  html[data-theme="light"] .site-loader-orbit {
    border-color: rgba(31, 107, 73, 0.34);
  }

  html[data-theme="light"] .site-loader-orbit::before {
    background: var(--light-emerald);
    box-shadow: 0 0 11px rgba(31, 107, 73, 0.38);
  }

  html[data-theme="light"] .site-loader-orbit.orbit-two {
    border-color: rgba(168, 121, 34, 0.38);
  }

  html[data-theme="light"] .site-loader-orbit.orbit-two::before {
    background: var(--light-gold);
    box-shadow: 0 0 11px rgba(168, 121, 34, 0.4);
  }

  html[data-theme="light"] .site-loader-crosshair {
    border-color: rgba(128, 91, 24, 0.2);
  }

  html[data-theme="light"] .site-loader-crosshair::before,
  html[data-theme="light"] .site-loader-crosshair::after {
    background: rgba(168, 121, 34, 0.25);
  }

  html[data-theme="light"] .site-loader-kicker {
    color: var(--light-emerald);
  }

  html[data-theme="light"] .site-loader-progress {
    background: rgba(168, 121, 34, 0.14);
  }

  html[data-theme="light"] .site-loader-progress span {
    background: linear-gradient(90deg, transparent, var(--light-emerald), var(--light-gold-bright), transparent);
    box-shadow: 0 0 11px rgba(168, 121, 34, 0.32);
  }

  html[data-theme="light"] .site-loader-coordinates {
    color: rgba(101, 112, 104, 0.66);
  }

  /* Theme-specific fine pointer assets */
  @media (hover: hover) and (pointer: fine) {
    html[data-theme="light"] body.public-v3,
    html[data-theme="light"] body.app-body,
    html[data-theme="light"] body.auth-page {
      cursor: url("../images/ui/cursor-default-light.svg") 4 3, auto;
    }

    html[data-theme="light"] body.public-v3 a,
    html[data-theme="light"] body.public-v3 button,
    html[data-theme="light"] body.app-body a,
    html[data-theme="light"] body.app-body button,
    html[data-theme="light"] body.app-body label[for],
    html[data-theme="light"] body.app-body select,
    html[data-theme="light"] body.app-body [role="button"],
    html[data-theme="light"] body.auth-page a,
    html[data-theme="light"] body.auth-page button,
    html[data-theme="light"] body.auth-page label[for],
    html[data-theme="light"] body.auth-page select,
    html[data-theme="light"] body.auth-page [role="button"] {
      cursor: url("../images/ui/cursor-pointer-light.svg") 12 4, pointer;
    }
  }
}

@media (max-width: 1179px) and (min-width: 961px) {
  .theme-toggle--portal {
    width: 42px;
    min-width: 42px;
    padding: 0;
  }

  .theme-toggle--portal .theme-toggle-label {
    display: none;
  }

  .theme-toggle--portal .theme-toggle-track {
    width: 30px;
    height: 20px;
    flex-basis: 30px;
  }

  .theme-toggle--portal .theme-toggle-track > i { font-size: 8px; }
  .theme-toggle--portal .theme-toggle-moon { left: 5px; }
  .theme-toggle--portal .theme-toggle-sun { right: 4px; }
  .theme-toggle--portal .theme-toggle-thumb { top: 2px; left: 2px; width: 14px; height: 14px; }
  html[data-theme="light"] .theme-toggle--portal .theme-toggle-thumb { transform: translateX(12px); }
}

@media (max-width: 960px) {
  .public-menu-actions {
    display: grid;
    grid-template-columns: minmax(0, 1fr) minmax(0, 1.25fr);
    gap: 8px;
  }

  .theme-toggle--portal,
  .public-menu-actions .v3-nav-action {
    width: 100%;
  }

  html[data-theme="light"] .public-menu {
    border-color: var(--light-line-strong);
    background: rgba(255, 253, 248, 0.98);
    box-shadow: 0 28px 75px rgba(78, 60, 24, 0.18), inset 0 0 32px rgba(211, 174, 87, 0.06);
  }

  html[data-theme="light"] .public-menu .nav-links a {
    border-color: transparent;
    background: rgba(234, 216, 170, 0.08);
    color: var(--light-text) !important;
  }

  html[data-theme="light"] .public-menu .nav-links a:hover,
  html[data-theme="light"] .public-menu .nav-links a.active,
  html[data-theme="light"] .public-menu .nav-links a[aria-current="location"] {
    border-color: var(--light-line);
    background: #f8efd9;
    color: var(--light-gold-strong) !important;
  }

  html[data-theme="light"] .public-nav-backdrop {
    background: rgba(66, 50, 22, 0.34);
  }
}

@media (max-width: 520px) {
  .theme-toggle--auth {
    top: 14px;
    right: 14px;
    width: 42px;
    min-width: 42px;
    padding: 0;
  }

  .theme-toggle--auth .theme-toggle-label {
    display: none;
  }

  .theme-toggle--auth .theme-toggle-track {
    width: 30px;
    height: 20px;
    flex-basis: 30px;
  }

  .theme-toggle--auth .theme-toggle-track > i { font-size: 8px; }
  .theme-toggle--auth .theme-toggle-moon { left: 5px; }
  .theme-toggle--auth .theme-toggle-sun { right: 4px; }
  .theme-toggle--auth .theme-toggle-thumb { top: 2px; left: 2px; width: 14px; height: 14px; }
  html[data-theme="light"] .theme-toggle--auth .theme-toggle-thumb { transform: translateX(12px); }

  .public-menu-actions {
    grid-template-columns: 1fr;
  }
}

@media (prefers-reduced-motion: reduce) {
  .theme-toggle,
  .theme-toggle-track > i,
  .theme-toggle-thumb {
    transition-duration: 0.001ms !important;
  }
}

@supports not ((backdrop-filter: blur(1px))) {
  @media screen {
    html[data-theme="light"] body.app-body .topbar,
    html[data-theme="light"] body.app-body .section-card,
    html[data-theme="light"] body.app-body .card,
    html[data-theme="light"] body.auth-page .auth-card,
    html[data-theme="light"] body.auth-page .auth-card .ac-inner,
    html[data-theme="light"] .public-nav.scrolled,
    html[data-theme="light"] .public-nav.menu-open,
    html[data-theme="light"] .public-menu {
      background-color: #fffdf8 !important;
    }
  }
}