/* Practice Hub tokens. The only :root custom-property block.
   Names and values follow practice-hub/DESIGN.md. Legacy names from app.css
   point at the same values so existing var() references keep working. */
@font-face { font-family: "Onest"; src: url("/static/fonts/onest-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }
@font-face { font-family: "Onest"; src: url("/static/fonts/onest-600.woff2") format("woff2"); font-weight: 600; font-display: swap; }
@font-face { font-family: "Onest"; src: url("/static/fonts/onest-700.woff2") format("woff2"); font-weight: 700; font-display: swap; }
@font-face { font-family: "Merriweather"; src: url("/static/fonts/merriweather-400.woff2") format("woff2"); font-weight: 400; font-display: swap; }

:root {
  color-scheme: light;

  /* Colour: brand */
  --ground: #F7F0E4;
  --bg: var(--ground);
  --surface: #FFFBF5;
  --panel: var(--surface);
  --paper: #FFFFFF;
  --on-accent: #FFFFFF;
  --accent-ink: var(--on-accent);
  --sunken: #F2EADC;
  --hover: #EFE6D6;
  --line-soft: var(--hover);
  --line: #E6DAC6;
  --line-strong: #CDBEA4;
  --control-border: #8F7F64;
  --ink: #103E40;
  --body: #3F5655;
  --muted: #566867;
  --client-ink: #4F6665;
  --accent: #185D60;
  --accent-strong: #103E40;
  --accent-soft: #D8EBE7;
  --seafoam: #D8EBE7;
  --aqua: #A9C9C5;
  --side: #103E40;
  --side-ehr: #0B3032;
  --side-text: #E9F2F0;
  --side-muted: #9FC2BC;
  --side-current: #2A5153;
  --focus: #185D60;
  --focus-on-side: #BAD2CE;
  --terracotta: #B94F36;
  --action: var(--terracotta);
  --action-hover: #A9442E;
  --danger: #A9442E;
  --danger-strong: #8E3826;
  --danger-deep: #3A1513;
  --danger-soft: #FBE6E0;
  --ok: #1F5F4A;
  --ok-soft: #DDEFE8;
  --ok-bg: var(--ok-soft);
  --info: #185D60;
  --info-soft: #DCEBEA;
  --warn: #6E4B00;
  --warn-soft: #F6E7C4;
  --neutral: #45595A;
  --neutral-soft: #EDE5D7;
  --error-bg: var(--danger-soft);
  --error-ink: var(--danger-strong);
  --black: #000000;

  /* Client pages keep the public form's ground and washes. */
  --client-ground: #F5F8F7;
  --client-seafoam: #E5F0ED;
  --client-aqua: #BAD2CE;
  --client-wash: #EFE6D6;

  /* Spacing. 4px scale from DESIGN.md, plus 64 where a page already used it. */
  --s1: 4px;
  --s-half: 2px;
  --s2: 8px;
  --s3: 12px;
  --s4: 16px;
  --s5: 20px;
  --s6: 24px;
  --s8: 32px;
  --s10: 40px;
  --s12: 48px;
  --s16: 64px;
  --pull: -1px;

  /* Type */
  --font-sans: "Onest", system-ui, -apple-system, "Segoe UI", sans-serif;
  --serif: "Merriweather", Georgia, serif;
  --t-kicker: 0.6875rem;
  --t-label: 0.75rem;
  --t-meta: 0.8125rem;
  --t-body: 0.875rem;
  --t-body-lg: 0.9375rem;
  --t-control-mobile: 1rem;
  --t-book-head: 1.25rem;
  --t-section: 1rem;
  --t-client: 1.0625rem;
  --t-lead: 1.125rem;
  --t-figure: 1.25rem;
  --t-callout: 1.375rem;
  --t-page: 1.5rem;
  --t-tour-title: 1.375rem;
  --t-tour-title-phone: 1.25rem;
  --t-client-title: 1.625rem;
  --t-client-title-wide: 1.875rem;
  --t-scribe-pause-title: 1.75rem;
  --t-figure-hero: 2rem;
  --t-date: 2.375rem;
  --t-date-big: 2.875rem;
  --t-display: 3rem;

  /* Radius, border, shadow */
  --radius-control: 6px;
  --radius: 10px 10px 10px 3px;
  --radius-client: 14px 14px 14px 5px;
  --radius-client-lg: 22px 22px 22px 7px;
  --radius-pill: 999px;
  --radius-tile: 16px;
  --radius-pass: 18px;
  --radius-input: 14px;
  --radius-client-field: 12px;
  --radius-client-card: 10px;
  --radius-client-tick: 4px;
  --shadow-raised: 0 1px 2px rgb(16 62 64 / 0.08), 0 4px 12px rgb(16 62 64 / 0.10);
  --shadow-overlay: 0 8px 32px rgb(16 62 64 / 0.18);
  --shadow-inset: inset 0 -3px 0 var(--accent);
  --shadow-bar: 0 -4px 16px rgb(16 62 64 / 0.08);
  --shadow-client-card: 0 16px 44px rgb(16 62 64 / 0.045);
  --shadow-pass: 0 1px 2px rgb(16 62 64 / 0.05), 0 10px 24px -16px rgb(16 62 64 / 0.30);
  --shadow-counselor: 0 10px 24px -18px rgb(16 62 64 / 0.35);
  --shadow-chosen: 0 1px 2px rgb(16 62 64 / 0.06), 0 6px 16px -8px rgb(16 62 64 / 0.25);
  --scrim: rgb(16 62 64 / 0.32);

  /* Controls. --ctl and --ctl-row are desktop-only (min-width: 761px). */
  --ctl-touch: 44px;
  --ctl-field-height: 40px;
  --ctl-segment-height: 38px;
  --table-row-height: 40px;
  --ctl-intake-row: 61px;
  --ctl: 32px;
  --ctl-small: 32px;
  --ctl-row: 28px;
  --ctl-time: 90px;
  --ctl-time-group: 248px;
  --ctl-check: 18px;
  --ctl-select: 36px;
  --ctl-count: 40px;
  --ctl-head: 48px;
  --ctl-head-mobile: 54px;
  --ctl-ask-ai-request-two-rows: 62px;
  --ctl-manual-showed-primary: 52px;
  --ctl-booked: 48px;
  --ctl-scribe-pause-secondary: 40px;
  --ctl-panel-note: 57px;
  --ctl-transfer-reason: 72px;
  --ctl-booking-body-top: 32px;
  --ctl-skeleton-label: 14px;
  --ctl-progress: 4px;
  --ctl-fill-progress: 10px;
  --ctl-fill-progress-width: 72px;
  --ctl-fill-place: 26px;
  --ctl-fill-rank: 32px;
  --icon-small: 16px;
  --icon-medium: 24px;
  --icon-pause: 72px;
  --icon-caret: 8px;
  --icon-fold-chevron-width: 7px;
  --icon-fold-chevron-height: 12px;
  --ctl-client: 52px;
  --ctl-field: 48px;
  --ctl-roomy: 56px;
  --ctl-pay-amount: 68px;
  --ctl-pay-medical-choice: 250px;
  --ctl-move-action-min: 4rem;
  --pill: 20px;
  --step: 24px;
  --perf-date-width: 64px;
  --records-date-column: 12.5rem;
  --pay-card-mini-width: 44px;
  --pay-card-tick-size: 20px;
  --pay-card-option-pad-block: 11px;
  --pay-card-default-start: #1B6465;
  --pay-card-default-end: #103E40;
  --pay-card-mastercard-start: #B34832;
  --pay-card-mastercard-end: #9D402E;
  --pay-card-amex-start: #255052;
  --pay-card-amex-end: #103E40;
  --pay-card-default-tag: rgb(255 255 255 / 0.18);
  --pay-card-radius: 12px;
  --pay-card-default-height: 132px;
  --pay-card-small-height: 84px;
  --pay-card-add-height: 48px;
  --pay-card-dialog-width: 480px;
  --pay-card-dialog-gutter: 28px;
  --pay-card-dialog-max-height: 860px;
  --pay-card-dialog-height-ratio: 88vh;
  --pay-card-stripe-height: 40px;
  --pay-card-secure-bg: #EEEDFC;
  --pay-card-secure-ink: #4B44C8;
  --clock-notice-width: 560px;
  --clock-blocked-width: 520px;
  --clock-blocked-button-height: 32px;
  --clock-page-width: 600px;
  --away-check-width: 440px;
  --away-check-radius: 12px;
  --away-check-ring-size: 84px;
  --away-check-ring-inset: 7px;
  --away-check-ring-stroke: 8px;
  --away-check-overlay-layer: 1001;
  --clock-card-padding: 24px;
  --clock-row-icon-size: 22px;
  --clock-status-dot-size: 8px;
  --clock-reason-height: 64px;
  --clock-border-width: 1px;

  /* Layout geometry: reserved space and fixed columns, not spacing. */
  --layout-message-icon-size: 2rem;
  --layout-intake-max: 1100px;
  --layout-client-cost-bar: 40rem;
  --layout-paperwork-gets-width: 15rem;
  --layout-paperwork-field-width: 16rem;
  --layout-paperwork-fields-width: 33rem;
  --layout-ask-ai-rail-min: 17.5rem;
  --layout-ask-ai-rail-width: 21.25rem;
  --layout-close-file-width: 720px;
  --layout-close-file-facts-label: 9.375rem;
  --layout-close-file-note-height: 4.5rem;
  --layout-record-filter-width: 11.25rem;
  --layout-scribe-pause-width: 24rem;
  --layout-scribe-pause-gutter: 2rem;
  --layout-scribe-pause-copy-width: 28rem;
  --layout-scribe-pause-phone-offset: 44px;
  --layout-scribe-intake-review: 55rem;
  --layout-manual-showed-width: 40rem;
  --layout-intake-top-max: 4.5rem;
  --layout-intake-gap-max: 5.5rem;
  --layout-booking-bar-room: 170px;
  --layout-scribe-client-select: 22rem;
  --layout-cal-gutter: 5rem;
  --layout-cal-move-width: 30rem;
  --layout-cal-move-inset: 2rem;
  --layout-cal-move-pad-top: 22px;
  --layout-cal-move-pad-bottom: 18px;
  --layout-cal-move-phone-pad-top: 18px;
  --layout-cal-move-section-gap: 14px;
  --layout-cal-move-title-gap: 6px;
  --layout-cal-move-label-gap: 6px;
  --layout-cal-move-pill-gap: 6px;
  --layout-cal-move-text-gap: 6px;
  --layout-cal-move-warning-pad-block: 10px;
  --layout-cal-move-warning-pad-inline: 12px;
  --layout-cal-move-field-gap: 10px;
  --layout-cal-quick-width: 37.5rem;
  --layout-cal-quick-inset: var(--s8);
  --layout-cal-quick-sheet-height: 92dvh;
  --layout-cal-quick-chip-min: 5.75rem;
  --layout-cal-quick-chip-height: 5.5rem;
  --layout-cal-quick-client-list: 10.5rem;
  --layout-cal-quick-phone-client-list: 21rem;
  --layout-cal-quick-handle-width: 4.5rem;
  --layout-cal-quick-handle-height: 0.5rem;
  --layout-cal-sec-label: 5.5rem;
  --layout-cal-panel-menu-width: 256px;
  --layout-cal-panel-more-toggle-width: 69px;
  --layout-cal-rows-max: 700px;
  --layout-kread-room: 5.5rem;
  --layout-pi-sug-indent: 78px;
  --assessment-drawer-width: 30rem;
  --assessment-drawer-head: 3.5rem;
  --assessment-drawer-head-mobile: 3.5rem;
  --assessment-drawer-footer: 4.5rem;
  --radius-assessment-drawer: 10px 0 0 3px;

  /* Charts */
  --chart-in: #00808B;
  --chart-out: #C35032;
  --chart-grid: #ECE3D4;
  --chart-base: #A9C9C5;
  --chart-band: rgb(16 62 64 / 0.05);
  --chart-payroll-profit: #00909A;
  --chart-payroll-revenue: #5B63B7;
  --chart-payroll-cost: #B8741A;
  --chart-payroll-headway: #2F7FC0;
  --chart-payroll-insurance: #C2577A;
  --chart-payroll-clients: #6F8A2A;
  --chart-phq9: #00808B;
  --chart-gad7: #5B63B7;
  --chart-legend-swatch: 12px;
  --chart-payroll-trend-min-width: 720px;

  /* Calendar place, event, DNS, now, off-hours */
  --cal-loc-online-tint: #DCEAF7;
  --cal-loc-online-edge: #2F6FA8;
  --cal-loc-o1-tint: #D8EBE7;
  --cal-loc-o1-edge: #185D60;
  --cal-loc-o2-tint: #F6E3C4;
  --cal-loc-o2-edge: #A06A12;
  --cal-loc-o3-tint: #F2DDEB;
  --cal-loc-o3-edge: #8C3D74;
  --cal-loc-o4-tint: #F7DADA;
  --cal-loc-o4-edge: #A33A3A;
  --cal-loc-o5-tint: #DDEFD6;
  --cal-loc-o5-edge: #3E7A2F;
  --cal-loc-o6-tint: #E3E8F3;
  --cal-loc-o6-edge: #4F628C;
  --cal-loc-o7-tint: #F3E6D8;
  --cal-loc-o7-edge: #8A5A2B;
  --cal-loc-o8-tint: #DFF0F4;
  --cal-loc-o8-edge: #2A7A8C;
  --cal-loc-unknown-tint: #ECE8E1;
  --cal-loc-unknown-edge: #7A7368;
  --cal-event-tint: #E9E4F7;
  --cal-event-edge: #4C3F91;
  --cal-dns-tint: #E6DED0;
  --cal-dns-edge: #9A8F7E;
  --cal-now: #D93025;
  --cal-off: rgb(16 62 64 / 0.045);
  --cal-grid-line: #ECE4D7;
  --cal-grid-soft: #F5F0E8;
  --cal-stripe: #F1ECE3;

  /* Board field colours */
  --field-teal-bg: #D8EBE7;
  --field-teal-ink: #103E40;
  --field-teal-line: #B9D6D0;
  --field-coral-bg: #FBE9E4;
  --field-coral-ink: #7D3321;
  --field-coral-line: #F0C9BE;
  --field-sand-bg: #EFE6D6;
  --field-sand-ink: #103E40;
  --field-sand-line: #D9CFBC;
  --field-pine-bg: #185D60;
  --field-pine-ink: #FFFFFF;
  --field-pine-line: #134A4C;
  --field-blue-bg: #DBEAFE;
  --field-blue-ink: #1E3A8A;
  --field-blue-line: #BFDBFE;
  --field-violet-bg: #EDE9FE;
  --field-violet-ink: #4C1D95;
  --field-violet-line: #DDD6FE;
  --field-pink-bg: #FCE7F3;
  --field-pink-ink: #831843;
  --field-pink-line: #FBCFE8;
  --field-green-bg: #DCFCE7;
  --field-green-ink: #14532D;
  --field-green-line: #BBF7D0;
  --field-amber-bg: #FEF3C7;
  --field-amber-ink: #78350F;
  --field-amber-line: #FDE68A;
  --find-highlight-bg: rgb(251, 231, 161);
  --find-touch-bg: #F8F4EC;
  --field-indigo-bg: #E0E7FF;
  --field-indigo-ink: #312E81;
  --field-indigo-line: #C7D2FE;
  --field-cyan-bg: #CFFAFE;
  --field-cyan-ink: #164E63;
  --field-cyan-line: #A5F3FC;
  --field-plum-bg: #FAE8FF;
  --field-plum-ink: #701A75;
  --field-plum-line: #F5D0FE;

  /* Avatars. Same six colours avatarColor() already picks, in the same order. */
  --avatar-0: #2F6F62;
  --avatar-1: #4A6FA5;
  --avatar-2: #7A5C8E;
  --avatar-3: #8A5A44;
  --avatar-4: #4F7942;
  --avatar-5: #A05252;

  /* Supporting roles: edges and states the status tones do not cover. */
  --danger-line: #E2B3A5;
  --warn-line: #E3C27A;
  --warn-edge: #C99A2E;
  --disabled-ink: #5C605E;
  --disabled-soft: #E9E6E1;

  /* Overlays: ink veils on light ground, white veils on the dark sidebar. */
  --veil-faint: rgb(16 62 64 / 0.05);
  --veil: rgb(16 62 64 / 0.16);
  --veil-strong: rgb(16 62 64 / 0.35);
  --accent-veil: rgb(24 93 96 / 0.06);
  --accent-veil-strong: rgb(24 93 96 / 0.14);
  --on-dark-veil: rgb(255 255 255 / 0.08);
  --on-dark-veil-strong: rgb(255 255 255 / 0.18);
  --paper-veil: rgb(255 255 255 / 0.55);
  --paper-clear: rgb(255 255 255 / 0);
  --ground-veil: rgb(247 240 228 / 0.2);
}