/* Navy/blue application theme. Dashboard SVG series retain their data colors. */
:root {
  --navy: #182b4d;
  --navy-deep: #12213b;
  --blue: #365e91;
  --blue-soft: #c8e0f4;
  --surface: #edf2f8;
  --text: #203451;
  --muted: #61738b;
  --border: #d6e0ed;
}
html body { background: var(--surface); color: var(--text); }
html body > header { background: linear-gradient(120deg, var(--navy-deep), #243f67); }
html body > header small { color: #c8e0f4; }
html body > header p { color: #cbd8e9; }
html body > header nav a { border-color: #7188a8; color: #e0e9f4; border-radius: 14px; transition: background-color 150ms ease, box-shadow 150ms ease; }
html body > header nav a[aria-current="page"] { background: var(--blue-soft); border-color: var(--blue-soft); color: var(--navy); box-shadow: inset 2px 2px 5px #9ebad3, inset -2px -2px 5px #eaf6ff; }
html body > header nav a:hover { background: #ffffff16; }
html body > header nav a[aria-current="page"]:hover { background: #d6e8f7; }
html body > main .panel, html body > main article, html body > main .card {
  background: #f4f7fb; border-color: var(--border); border-radius: 14px;
  box-shadow: 5px 5px 14px #cdd7e36b, -5px -5px 14px #ffffffbd;
}
html body > main .cards .sales-highlight {
  background: linear-gradient(135deg, #294c78, var(--navy-deep)); border-color: #91b2d5;
  box-shadow: 5px 5px 16px #b5c3d580, -4px -4px 12px #ffffff;
}
html body > main .cards .sales-highlight p,
html body > main .cards .sales-highlight small { color: #d7e6f6; }
html body > main .cards .sales-highlight strong { color: #fff; }
html body > main .sales-badge { background: var(--blue-soft); color: var(--navy); }
html body > main .cards .balance { background: #e3ecf7; border-color: #b4c9e1; }
html body > main article p, html body > main .card p { color: #526985; }
html body > main article small, html body > main .card small,
html body > main .caption, html body > main .dates,
html body > main .original, html body > main .status-line,
html body > main footer { color: var(--muted); }
html body > main .notice { background: #e5edf8; border-color: #c2d2e8; color: #304e73; }
html body > main button, html body > main select {
  color: var(--navy); border-color: #bfcfe1; background: #f0f5fb; border-radius: 14px;
  box-shadow: 2px 2px 5px #cbd6e380, -2px -2px 5px #ffffffb3;
  transition: background-color 150ms ease, box-shadow 150ms ease;
}
html body > main button:hover { background: #e1ebf7; }
html body > main button[aria-pressed="true"] { background: var(--navy); border-color: var(--navy); color: white; box-shadow: inset 2px 2px 4px #0b172d; }
html body > main .period-toggle { background: #dfe8f3; border-color: #bfcee1; }
html body > main button:focus-visible, html body > main select:focus-visible,
html body > header nav a:focus-visible, html body > main .chart-frame:focus-visible {
  outline: 3px solid #739ecf; outline-offset: 3px;
}
html body > main table th { background: #e7eef7; color: #3d5677; }
html body > main table td { color: #526985 !important; border-color: #dce4ef; }
html body > main #withdrawal-table th[scope="row"] { background: #edf2f9 !important; box-shadow: 2px 0 0 #d7e1ee; }
html body > main #withdrawal-table [style*="background:#e4f1eb"] { background: #dce9f8 !important; }
html body > main #withdrawal-table [style*="background:#cce3d7"] { background: #c8ddf2 !important; }
html body > main .rows > div { border-color: #dce4ef; }
html body > main .rows > div:first-child { color: var(--navy); }
html body > main .rank-card:first-child { background: linear-gradient(135deg, #d9f2ff, #bce5fa); border-color: #75c5ed; box-shadow: 5px 5px 16px #b9d7e875, -4px -4px 12px #ffffff; }
html body > main .ranking .bar { background: #d8eaf5; }
html body > main .ranking .bar span { background: #159bd3; }
html body > main .ranking .rank-card:first-child .bar span { background: #008fcb; }
html body > main .amount, html body > main .rank { color: var(--navy); }
html body > main #chart-dialog { color: var(--text); background: #f4f7fb; }
html body > main #chart-dialog::backdrop { background: #10213bb8; }
@media(prefers-reduced-motion:reduce) { html body > main button, html body > header nav a { transition: none; } }
