/* Presentation only. Calculator functions, clinical interpretation and datasets are unchanged. */
:root,
html[data-theme='beige'],
html[data-theme='sepia'],
html[data-theme='dark'],
html[data-theme='system'] {
  color-scheme: light;
  --bg: #fff;
  --surface: #fff;
  --surface-2: #f5f9f9;
  --elevated: #fff;
  --fg: #000;
  --fg-soft: #252525;
  --muted: #4b4e4e;
  --muted-2: #626767;
  --border: #e2e7e7;
  --border-strong: #c7d9d9;
  --ring: rgba(110,192,194,.3);
  --accent: #6ec0c2;
  --accent-hover: #9bd3d4;
  --accent-soft: #edf8f8;
  --accent-fg: #000;
  --shadow-xs: 0 1px 2px rgba(0,0,0,.04);
  --shadow-sm: 0 2px 8px rgba(0,0,0,.05);
  --shadow-md: 0 2px 10px rgba(0,0,0,.07);
  --shadow-lg: 0 3px 16px rgba(0,0,0,.08);
  --shadow-xl: 0 4px 20px rgba(0,0,0,.1);
  --r-sm: 5px;
  --r-md: 5px;
  --r-lg: 8px;
  --r-xl: 8px;
}
html, body {
  color: var(--fg);
  background: var(--bg);
  font-family: 'Montserrat', sans-serif !important;
  font-size: 14px;
  line-height: 1.6;
}
body { -webkit-user-select: auto; user-select: auto; }
button, input, textarea, select,
h1, h2, h3, h4,
.hero-h1, .hero-brand, .topbar-name,
.card-name, .drawer-title, .modal-title {
  font-family: 'Montserrat', sans-serif !important;
}
h1, h2, h3, h4,
.hero-h1, .card-name,
.drawer-title, .modal-title { font-weight: 700; }
.hero-h1 { color: var(--fg); letter-spacing: -.035em; line-height: 1.2; }
.hero-h1 .accent, .hero-brand { color: var(--fg); }
.hero-sub { color: var(--muted); }
.topbar {
  background: var(--surface);
  border-bottom: 1px solid var(--border);
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}
/* The authenticated portal provides identity and navigation. No timed social gate. */
#theme-btn, #welcome-overlay { display: none !important; }
.topbar-title { color: var(--muted); }
.mode-btn, .mode-btn-sm,
.quick-pill, .sys-dropdown-btn,
.search-wrap, .icon-btn,
input, select, textarea { border-radius: 5px; }
.mode-btn.active, .mode-btn-sm.active {
  color: var(--fg);
  background: var(--accent);
  border-color: var(--accent);
}
.mode-btn:hover, .mode-btn-sm:hover { background: var(--accent-soft); color: var(--fg); }
.mode-btn[data-locked='true'], .mode-btn-sm[data-locked='true'] { color: var(--muted); }
input, select, textarea { color: var(--fg); background: var(--surface); }
input::placeholder, textarea::placeholder { color: var(--muted); opacity: 1; }
button, a, input, select, textarea {
  transition-duration: 200ms;
}
button:focus-visible, a:focus-visible, input:focus-visible,
select:focus-visible, textarea:focus-visible {
  outline: 3px solid #145f63;
  outline-offset: 3px;
}
.footer { border-top-color: var(--border); }
.footer-brand, .footer-icon { color: #133b3c; }
/* Clinical success/warning/danger colors remain semantic and are intentionally preserved. */
@media (max-width: 640px) {
  html, body { font-size: 14px; }
  .hero-h1 { font-size: 32px; }
  .hero { padding-right: 18px; padding-left: 18px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { transition: none !important; animation: none !important; scroll-behavior: auto !important; }
}