@font-face { font-family: 'IBM Plex Mono'; src: url('/app/plex-mono.woff2') format('woff2'); font-weight: 500; font-display: swap; }

:root {
  color-scheme: light;
  --font-sans: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
  --font-mono: 'IBM Plex Mono', monospace;
  --text-label: 11px;
  --text-meta: 12px;
  --text-secondary: 13px;
  --text-ui: 14px;
  --text-note: 15px;
  --text-patient: 16px;
  --text-card: 17px;
  --text-appbar: 20px;
  --text-phone-heading: 22px;
  --text-clock: 24px;
  --text-settings-heading: 26px;
  --text-recorded-heading: 28px;
  --text-visit-heading: 30px;
  --text-page-heading: 32px;
  --text-phone-clock: 64px;
  --accent: #315fe5;
  --accent-hover: #244dc1;
  --accent-tint: #edf2fa;
  --accent-tint-hover: #e3ebf8;
  --accent-surface: #dbe4f5;
  --accent-text: var(--accent);
  --accent-text-hover: var(--accent-hover);
  --accent-strong: #1f47b3;
  --row-highlight: #f4f7fc;
  --level: #7a97c5;
  --recorder: #0f1626;
  --recorder-text: #ced9ec;
  --recorder-muted: #b7c5de;
  --recorder-danger: #ffc0bb;
  --on-accent: #fff;
  --on-accent-muted: #eaf0fd;
  --ink: #26344d;
  --body: #34435c;
  --secondary: #415779;
  --muted: #59677b;
  --hint: #626c7c;
  --disabled: #b3bfd0;
  --app-bg: #f7f9fc;
  --sidebar-bg: #fbfcfe;
  --card: #fff;
  --popover: var(--card);
  --sunken: var(--app-bg);
  --input-bg: var(--card);
  --border: #dfe6f2;
  --table-border: #e4eaf3;
  --row-border: #edf0f6;
  --input-border: #dfe6f2;
  --review-bg: #fdf3e2;
  --review-text: #7d5c13;
  --review-dot: #c98a1e;
  --highlight: #fbeec6;
  --highlight-hover: #f6e4ab;
  --highlight-border: #d8a72c;
  --signed-bg: #edf4ef;
  --signed-text: #2f6b45;
  --signed-dot: #3f8a5b;
  --signed-accent: #87ac9f;
  --recording-bg: #eef1f7;
  --recording-text: #3d5478;
  --recording-dot: #5b77a8;
  --danger: #a5423a;
  --danger-fill: var(--danger);
  --danger-bg: #fff0f0;
  --danger-border: #f4dddd;
  --recording-red: #ff5f57;
  --on-recording-red: var(--on-accent);
  --focus-outline: #90aaff;
  --focus-ring: #315fe52b;
  --backdrop: #26344d66;
  --swatch-light: #f7f9fc;
  --swatch-dark: #07090e;
  --blue: var(--accent);
  --line: var(--border);
  --radius-control: 8px;
  --radius-card: 12px;
  --radius-panel: 14px;
  --radius-dialog: 14px;
  --shadow-popover: 0 8px 30px #273e7010;
  --shadow-primary: 0 4px 10px #315fe51a;
  --shadow-dialog: 0 25px 90px #273e7030;
  --shadow-chip: 0 1px 3px #273e7014;
  --weight-brand: 650;
  --weight-heading: 600;
  --weight-control: 550;
  --track-h1: -0.04em;
  --track-h2: -0.026em;
  --ease: cubic-bezier(.2,.7,.2,1);
  --motion-fast: 150ms;
  --motion-base: 250ms;
  --motion-slow: 400ms;
  --control-height: 40px;
  --control-compact: 32px;
  --control-large: 48px;
  --control-record: 56px;
  --control-line-height: 20px;
  --control-padding-x: 12px;
  --panel-padding: 24px;
  --section-gap: 24px;
  --field-gap: 20px;
  --page-padding-x: 40px;
}
/* Dark theme: theme.js sets data-theme from the saved preference (System follows the OS). Values derive from the
   design's dark file flattened over #07090e; fills keep the #315fe5 accent with white text. */
@media not print { :root[data-theme="dark"] {
  color-scheme: dark;
  --accent: #315fe5;
  --accent-hover: #4a76f0;
  --accent-tint: #13192b;
  --accent-tint-hover: #1b233e;
  --accent-surface: #2a3762;
  --accent-text: #6c8cff;
  --accent-text-hover: #8aa2ff;
  --accent-strong: #b3c2ff;
  --row-highlight: #111318;
  --level: #6c8cff;
  --recorder: #0b1222;
  --recorder-text: #ced9ec;
  --recorder-muted: #a9b4c7;
  --recorder-danger: #ffc0bb;
  --on-accent: #fff;
  --on-accent-muted: #eaf0fd;
  --ink: #e8ecf4;
  --body: #dbe2ee;
  --secondary: #c3ccdd;
  --muted: #98a2b3;
  --hint: #7f8ba0;
  --disabled: #4f5869;
  --app-bg: #07090e;
  --sidebar-bg: #090c12;
  --card: #0d0f14;
  --popover: #141925;
  --sunken: #0a0c11;
  --input-bg: #0a0c11;
  --border: #1b1d21;
  --table-border: #1b1d21;
  --row-border: #16181c;
  --input-border: #25272b;
  --review-bg: #211d17;
  --review-text: #f0d49b;
  --review-dot: #e0b355;
  --highlight: #3d321a;
  --highlight-hover: #4a3d20;
  --highlight-border: #e0b355;
  --signed-bg: #0e2222;
  --signed-text: #8ee6ce;
  --signed-dot: #45d6b4;
  --signed-accent: #2e6f60;
  --recording-bg: #16181c;
  --recording-text: #a9b4c7;
  --recording-dot: #7f8ba0;
  --danger: #efa3a3;
  --danger-fill: #c2503f;
  --danger-bg: #181116;
  --danger-border: #48272b;
  --recording-red: #e08a6f;
  --on-recording-red: #07090e;
  --focus-outline: #8aa2ff;
  --focus-ring: #6c8cff40;
  --backdrop: #04060ab8;
  --swatch-light: #f7f9fc;
  --swatch-dark: #07090e;
  --shadow-popover: 0 8px 30px #00000080;
  --shadow-primary: 0 4px 14px #315fe540;
  --shadow-dialog: 0 25px 90px #000000a6;
  --shadow-chip: 0 1px 3px #0000004d;
} }
/* Printing always uses the light palette; the print styles force black on white. */
@media print { :root { color-scheme: light; } }
@media (max-width: 1250px) { :root { --page-padding-x: 24px; } }
@media (max-width: 760px) {
  :root { --control-height: 44px; --control-compact: 36px; --panel-padding: 20px; --page-padding-x: 20px; }
}