/* Four Wood design tokens - GENERATED by tools/build_tokens.py from tools/tokens_source.py. Do not edit by hand.
   Framework-agnostic CSS custom properties. Load after tokens/fonts.css. Layers:
   1 primitives (--fw-forest-950 ...)  2 semantic (--fw-surface, --fw-ink ...)  3 modes:
   [data-surface=forest|green] dark bands, [data-density=operate] staff/admin density.
   Status: PROPOSAL v0.1 (2026-11-05) - not yet adopted by any surface. */

:root {
  /* ---- primitives: colour ---- */
  --fw-forest-950: #0b241a; /* marketing --forest; masthead, dark bands */
  --fw-forest-900: #102118; /* marketing --ink; body text on light */
  --fw-forest-800: #123824; /* marketing --green; raised dark band */
  --fw-green-800: #245c39; /* NEW; success text, readable on green-100 (5.91:1) */
  --fw-green-700: #2d7146; /* marketing --accd; accessible accent text on light (5.18:1 on cream) */
  --fw-green-500: #5fae67; /* NEW; primary button hover (forest label 6.04:1) */
  --fw-green-400: #6ec176; /* marketing --accent; primary fill, accent text on dark */
  --fw-green-100: #cfe5cf; /* member .member-chip; success surface */
  --fw-white: #ffffff; /* fields, raised cards */
  --fw-cream-50: #fbf9f4; /* member #fbf9f4; raised surface / calendar grid */
  --fw-cream-100: #f4f0e7; /* marketing --cream; page surface */
  --fw-cream-200: #e8e1d4; /* marketing --cream2; sunken surface */
  --fw-cream-300: #d6d0c4; /* member row rule; decorative divider */
  --fw-stone-400: #b8b1a4; /* marketing --line; decorative border only (1.87:1 on cream) */
  --fw-stone-600: #857e70; /* NEW; input/control boundary (3.54:1 cream, 4.03:1 white) */
  --fw-sage-200: #c2cec3; /* marketing .muted on dark; ink-muted on forest (10.07:1) */
  --fw-sage-500: #66706a; /* NEW; placeholder (4.51:1 cream, 5.13:1 white) - replaces #7a867e */
  --fw-sage-700: #4c5c52; /* marketing --sub; ink-muted on light (6.24:1 cream) */
  --fw-red-800: #9a281e; /* marketing .error / vault --error */
  --fw-red-100: #f6e4de; /* NEW; danger surface (collapses #f6e9e4, #fae9e2, #fbf1ee) */
  --fw-red-200: #ffd8cc; /* member error on forest (12.44:1) */
  --fw-amber-800: #6b4500; /* NEW; warning text (6.66:1 on amber-100) - darker than #8a5a00 for small text */
  --fw-amber-300: #e3b04b; /* vault --flag; warning text on dark (8.25:1) */
  --fw-amber-100: #efe3c9; /* member missed chip; warning surface */
  --fw-teal-700: #2f6577; /* staff lesson stripe; info */
  --fw-teal-200: #a9cfdb; /* NEW; info text on dark */
  --fw-teal-100: #e4edf0; /* staff --lesson; info surface */
  /* ---- primitives: booking categories (edge = stripe and tag fill, fill = block background) ---- */
  --fw-cat-member-edge: #4d6b3c;
  --fw-cat-member-fill: #e0e9d1;
  --fw-cat-member-key: #c4d2af;
  --fw-cat-guest-edge: #8a5a00;
  --fw-cat-guest-fill: #f7e9cc;
  --fw-cat-guest-key: #ecd19a;
  --fw-cat-lesson-edge: #2f6577;
  --fw-cat-lesson-fill: #e4edf0;
  --fw-cat-lesson-key: #c4dce3;
  --fw-cat-evaluation-edge: #6a4c9c;
  --fw-cat-evaluation-fill: #eee8f6;
  --fw-cat-evaluation-key: #d5c8ea;
  --fw-cat-event-edge: #a3402c;
  --fw-cat-event-fill: #f8e3dc;
  --fw-cat-event-key: #eec2b4;
  --fw-cat-clinic-edge: #2c6e60;
  --fw-cat-clinic-fill: #dcefe9;
  --fw-cat-clinic-key: #a9d6c8;
  --fw-cat-blocked-edge: #4c5c52;
  --fw-cat-blocked-fill: #e8e1d4;
  --fw-cat-blocked-key: #d6d0c4;
  /* edge patterns: colour is never the only cue (pattern + always-visible text label) */
  --fw-cat-member-pattern: linear-gradient(var(--fw-cat-member-edge), var(--fw-cat-member-edge)); /* solid */
  --fw-cat-guest-pattern: repeating-linear-gradient(to bottom, var(--fw-cat-guest-edge) 0 6px, transparent 6px 9px); /* dashed */
  --fw-cat-lesson-pattern: repeating-linear-gradient(to bottom, var(--fw-cat-lesson-edge) 0 3px, transparent 3px 6px); /* dotted */
  --fw-cat-evaluation-pattern: linear-gradient(to right, var(--fw-cat-evaluation-edge) 0 2px, transparent 2px 4px, var(--fw-cat-evaluation-edge) 4px 6px); /* double */
  --fw-cat-event-pattern: repeating-linear-gradient(45deg, var(--fw-cat-event-edge) 0 3px, transparent 3px 6px); /* diagonal */
  --fw-cat-clinic-pattern: linear-gradient(to right, var(--fw-cat-clinic-edge) 0 4px, transparent 4px 5px, var(--fw-cat-clinic-edge) 5px 6px); /* thick-thin */
  --fw-cat-blocked-pattern: repeating-linear-gradient(135deg, var(--fw-cream-100) 0 6px, var(--fw-cream-200) 6px 8px); /* hatch */
  /* ---- status (chip background / text / border); glyph + label always rendered ---- */
  --fw-status-checked-in-bg: #cfe5cf;
  --fw-status-checked-in-fg: #0b241a;
  --fw-status-checked-in-border: #cfe5cf;
  --fw-status-not-checked-in-bg: transparent;
  --fw-status-not-checked-in-fg: #4c5c52;
  --fw-status-not-checked-in-border: #857e70;
  --fw-status-adjustment-bg: #efe3c9;
  --fw-status-adjustment-fg: #6b4500;
  --fw-status-adjustment-border: #efe3c9;
  --fw-status-payment-pending-bg: #e4edf0;
  --fw-status-payment-pending-fg: #2f6577;
  --fw-status-payment-pending-border: #e4edf0;
  --fw-status-payment-failed-bg: #f6e4de;
  --fw-status-payment-failed-fg: #9a281e;
  --fw-status-payment-failed-border: #f6e4de;
  --fw-status-to-confirm-bg: transparent;
  --fw-status-to-confirm-fg: #4c5c52;
  --fw-status-to-confirm-border: #857e70;
  /* ---- semantic colour (light surfaces: cream, white) ---- */
  --fw-surface: var(--fw-cream-100);
  --fw-surface-raised: var(--fw-white);
  --fw-surface-sunken: var(--fw-cream-200);
  --fw-surface-grid: var(--fw-cream-50);
  --fw-surface-inverse: var(--fw-forest-950);
  --fw-ink: var(--fw-forest-900);
  --fw-ink-muted: var(--fw-sage-700);
  --fw-ink-inverse: var(--fw-cream-100);
  --fw-placeholder: var(--fw-sage-500);
  --fw-border: var(--fw-cream-300);
  --fw-border-decorative: var(--fw-stone-400);
  --fw-border-strong: var(--fw-stone-600);
  --fw-focus: var(--fw-forest-950);
  --fw-accent: var(--fw-green-400);
  --fw-accent-hover: var(--fw-green-500);
  --fw-on-accent: var(--fw-forest-950);
  --fw-link: var(--fw-green-700);
  --fw-danger: var(--fw-red-800);
  --fw-danger-surface: var(--fw-red-100);
  --fw-on-danger: var(--fw-white);
  --fw-warning: var(--fw-amber-800);
  --fw-warning-surface: var(--fw-amber-100);
  --fw-success: var(--fw-green-800);
  --fw-success-surface: var(--fw-green-100);
  --fw-info: var(--fw-teal-700);
  --fw-info-surface: var(--fw-teal-100);
  --fw-selected: var(--fw-forest-950);
  --fw-on-selected: var(--fw-cream-100);
  --fw-scrim: rgba(16, 33, 24, 0.5);
  /* ---- type ---- */
  --fw-font-sans: Barlow, system-ui, -apple-system, 'Segoe UI', sans-serif;
  --fw-font-script: Yellowtail, 'Brush Script MT', cursive;
  --fw-font-numeric: Barlow, system-ui, sans-serif;
  --fw-weight-regular: 400;
  --fw-weight-medium: 500;
  --fw-weight-semibold: 600;
  --fw-size-75: 0.6875rem; /* 11px - uppercase tags only */
  --fw-size-100: 0.75rem; /* 12px - operate floor for running text */
  --fw-size-150: 0.8125rem; /* 13px */
  --fw-size-200: 0.875rem; /* 14px */
  --fw-size-250: 0.9375rem; /* 15px */
  --fw-size-300: 1rem; /* 16px */
  --fw-size-350: 1.0625rem; /* 17px */
  --fw-size-400: 1.125rem; /* 18px */
  --fw-size-500: 1.25rem; /* 20px */
  --fw-size-550: 1.375rem; /* 22px */
  --fw-size-600: 1.625rem; /* 26px */
  --fw-size-700: 1.875rem; /* 30px */
  --fw-size-800: clamp(2.25rem, 1.65rem + 2.2vw, 3.25rem); /* 36 -> 52px */
  --fw-size-900: clamp(2.75rem, 1.4rem + 4.6vw, 5.5rem); /* 44 -> 88px */
  /* ---- space (4px base) ---- */
  --fw-space-0: 0;
  --fw-space-1: 4px;
  --fw-space-2: 8px;
  --fw-space-3: 12px;
  --fw-space-4: 16px;
  --fw-space-5: 20px;
  --fw-space-6: 24px;
  --fw-space-8: 32px;
  --fw-space-10: 40px;
  --fw-space-12: 48px;
  --fw-space-16: 64px;
  --fw-space-20: 80px;
  --fw-space-24: 96px;
  /* ---- radius / elevation / motion / focus / targets / z ---- */
  --fw-radius-none: 0;
  --fw-radius-sm: 2px;
  --fw-radius-md: 4px;
  --fw-radius-lg: 8px;
  --fw-radius-pill: 999px;
  --fw-shadow-1: 0 1px 2px rgba(16, 33, 24, 0.10), 0 1px 3px rgba(16, 33, 24, 0.06); /* raised: hovered calendar block, card lift */
  --fw-shadow-2: 0 12px 32px rgba(0, 0, 0, 0.28); /* popover: header account panel, menus (marketing value) */
  --fw-shadow-3: 0 24px 64px rgba(11, 36, 26, 0.32); /* overlay: dialog, drawer, bottom sheet */
  --fw-duration-instant: 80ms;
  --fw-duration-fast: 150ms;
  --fw-duration-base: 220ms;
  --fw-duration-slow: 320ms;
  --fw-ease-out: cubic-bezier(0.2, 0.8, 0.2, 1);
  --fw-ease-in-out: cubic-bezier(0.45, 0, 0.2, 1);
  --fw-ease-in: cubic-bezier(0.4, 0, 1, 1);
  --fw-focus-width: 3px;
  --fw-focus-style: solid;
  --fw-target-min: 44px;
  --fw-bp-xs: 320px; /* reference only: custom properties cannot be used inside @media */
  --fw-bp-sm: 390px; /* reference only: custom properties cannot be used inside @media */
  --fw-bp-md: 768px; /* reference only: custom properties cannot be used inside @media */
  --fw-bp-lg: 1024px; /* reference only: custom properties cannot be used inside @media */
  --fw-bp-xl: 1440px; /* reference only: custom properties cannot be used inside @media */
  --fw-z-header: 10;
  --fw-z-dropdown: 30;
  --fw-z-drawer: 40;
  --fw-z-dialog: 50;
  --fw-z-toast: 60;
}

/* ---- density: brand (default; marketing, member pages) ---- */
:root, [data-density="brand"] {
  --fw-space-inline: var(--fw-space-4);
  --fw-space-stack: var(--fw-space-6);
  --fw-space-inset: var(--fw-space-6);
  --fw-space-section: clamp(48px, 6vw, 80px);
  --fw-gutter: clamp(16px, 5vw, 90px);
  --fw-control-height: 52px;
  --fw-control-height-sm: 44px;
  --fw-control-pad-x: var(--fw-space-6);
  --fw-field-pad-y: 14px;
  --fw-focus-offset: 4px;
  --fw-line-height-body: 1.5;
  --fw-type-display-size: var(--fw-size-900);
  --fw-type-display: 600 var(--fw-size-900)/1.05 var(--fw-font-sans);
  --fw-type-display-tracking: -0.01em;
  --fw-type-h1-size: var(--fw-size-800);
  --fw-type-h1: 600 var(--fw-size-800)/1.1 var(--fw-font-sans);
  --fw-type-h1-tracking: -0.005em;
  --fw-type-h2-size: var(--fw-size-700);
  --fw-type-h2: 600 var(--fw-size-700)/1.15 var(--fw-font-sans);
  --fw-type-h2-tracking: 0;
  --fw-type-h3-size: var(--fw-size-550);
  --fw-type-h3: 600 var(--fw-size-550)/1.25 var(--fw-font-sans);
  --fw-type-h3-tracking: 0;
  --fw-type-h4-size: var(--fw-size-400);
  --fw-type-h4: 600 var(--fw-size-400)/1.3 var(--fw-font-sans);
  --fw-type-h4-tracking: 0;
  --fw-type-lead-size: var(--fw-size-550);
  --fw-type-lead: 400 var(--fw-size-550)/1.5 var(--fw-font-sans);
  --fw-type-lead-tracking: 0;
  --fw-type-body-size: var(--fw-size-400);
  --fw-type-body: 400 var(--fw-size-400)/var(--fw-line-height-body) var(--fw-font-sans);
  --fw-type-body-tracking: 0;
  --fw-type-small-size: var(--fw-size-250);
  --fw-type-small: 400 var(--fw-size-250)/1.45 var(--fw-font-sans);
  --fw-type-small-tracking: 0;
  --fw-type-label-size: var(--fw-size-200);
  --fw-type-label: 600 var(--fw-size-200)/1.3 var(--fw-font-sans);
  --fw-type-label-tracking: 0.08em;
  --fw-type-caption-size: var(--fw-size-150);
  --fw-type-caption: 400 var(--fw-size-150)/1.4 var(--fw-font-sans);
  --fw-type-caption-tracking: 0;
  --fw-type-tag-size: var(--fw-size-150);
  --fw-type-tag: 600 var(--fw-size-150)/1.2 var(--fw-font-sans);
  --fw-type-tag-tracking: 0.06em;
  --fw-type-button-size: var(--fw-size-300);
  --fw-type-button: 600 var(--fw-size-300)/1.2 var(--fw-font-sans);
  --fw-type-button-tracking: 0;
  --fw-type-nav-size: var(--fw-size-200);
  --fw-type-nav: 600 var(--fw-size-200)/1.2 var(--fw-font-sans);
  --fw-type-nav-tracking: 0.08em;
}

/* ---- density: operate (staff schedule, admin, vault tools). Same palette, smaller scale, tighter spacing. ---- */
[data-density="operate"] {
  --fw-space-inline: var(--fw-space-2);
  --fw-space-stack: var(--fw-space-3);
  --fw-space-inset: var(--fw-space-3);
  --fw-space-section: var(--fw-space-6);
  --fw-gutter: var(--fw-space-4);
  --fw-control-height: 44px;
  --fw-control-height-sm: 36px;
  --fw-control-pad-x: var(--fw-space-3);
  --fw-field-pad-y: 8px;
  --fw-focus-offset: 2px;
  --fw-line-height-body: 1.4;
  --fw-type-display-size: var(--fw-size-600);
  --fw-type-display: 600 var(--fw-size-600)/1.05 var(--fw-font-sans);
  --fw-type-display-tracking: -0.01em;
  --fw-type-h1-size: var(--fw-size-600);
  --fw-type-h1: 600 var(--fw-size-600)/1.1 var(--fw-font-sans);
  --fw-type-h1-tracking: -0.005em;
  --fw-type-h2-size: var(--fw-size-500);
  --fw-type-h2: 600 var(--fw-size-500)/1.15 var(--fw-font-sans);
  --fw-type-h2-tracking: 0;
  --fw-type-h3-size: var(--fw-size-300);
  --fw-type-h3: 600 var(--fw-size-300)/1.25 var(--fw-font-sans);
  --fw-type-h3-tracking: 0;
  --fw-type-h4-size: var(--fw-size-250);
  --fw-type-h4: 600 var(--fw-size-250)/1.3 var(--fw-font-sans);
  --fw-type-h4-tracking: 0;
  --fw-type-lead-size: var(--fw-size-300);
  --fw-type-lead: 400 var(--fw-size-300)/1.5 var(--fw-font-sans);
  --fw-type-lead-tracking: 0;
  --fw-type-body-size: var(--fw-size-200);
  --fw-type-body: 400 var(--fw-size-200)/var(--fw-line-height-body) var(--fw-font-sans);
  --fw-type-body-tracking: 0;
  --fw-type-small-size: var(--fw-size-100);
  --fw-type-small: 400 var(--fw-size-100)/1.45 var(--fw-font-sans);
  --fw-type-small-tracking: 0;
  --fw-type-label-size: var(--fw-size-100);
  --fw-type-label: 600 var(--fw-size-100)/1.3 var(--fw-font-sans);
  --fw-type-label-tracking: 0.08em;
  --fw-type-caption-size: var(--fw-size-100);
  --fw-type-caption: 400 var(--fw-size-100)/1.4 var(--fw-font-sans);
  --fw-type-caption-tracking: 0;
  --fw-type-tag-size: var(--fw-size-75);
  --fw-type-tag: 600 var(--fw-size-75)/1.2 var(--fw-font-sans);
  --fw-type-tag-tracking: 0.06em;
  --fw-type-button-size: var(--fw-size-200);
  --fw-type-button: 600 var(--fw-size-200)/1.2 var(--fw-font-sans);
  --fw-type-button-tracking: 0;
  --fw-type-nav-size: var(--fw-size-150);
  --fw-type-nav: 600 var(--fw-size-150)/1.2 var(--fw-font-sans);
  --fw-type-nav-tracking: 0.08em;
}

/* ---- dark surface: forest band. Focus ring flips to cream (marketing rule). ---- */
[data-surface="forest"] {
  --fw-surface: var(--fw-forest-950);
  --fw-surface-raised: var(--fw-forest-800);
  --fw-surface-sunken: var(--fw-forest-900);
  --fw-surface-grid: var(--fw-forest-900);
  --fw-surface-inverse: var(--fw-cream-100);
  --fw-ink: var(--fw-cream-100);
  --fw-ink-muted: var(--fw-sage-200);
  --fw-ink-inverse: var(--fw-forest-900);
  --fw-placeholder: rgba(244, 240, 231, 0.62);
  --fw-border: rgba(244, 240, 231, 0.16);
  --fw-border-decorative: rgba(244, 240, 231, 0.16);
  --fw-border-strong: rgba(244, 240, 231, 0.45);
  --fw-focus: var(--fw-cream-100);
  --fw-accent: var(--fw-green-400);
  --fw-accent-hover: var(--fw-green-500);
  --fw-on-accent: var(--fw-forest-950);
  --fw-link: var(--fw-green-400);
  --fw-danger: var(--fw-red-200);
  --fw-danger-surface: var(--fw-red-100);
  --fw-on-danger: var(--fw-forest-950);
  --fw-warning: var(--fw-amber-300);
  --fw-warning-surface: var(--fw-amber-100);
  --fw-success: var(--fw-green-400);
  --fw-success-surface: var(--fw-green-100);
  --fw-info: var(--fw-teal-200);
  --fw-info-surface: var(--fw-teal-100);
  --fw-selected: var(--fw-cream-100);
  --fw-on-selected: var(--fw-forest-950);
}

/* ---- dark surface: green band. Focus ring flips to cream (marketing rule). ---- */
[data-surface="green"] {
  --fw-surface: var(--fw-forest-800);
  --fw-surface-raised: var(--fw-forest-950);
  --fw-surface-sunken: var(--fw-forest-950);
  --fw-surface-grid: var(--fw-forest-950);
  --fw-surface-inverse: var(--fw-cream-100);
  --fw-ink: var(--fw-cream-100);
  --fw-ink-muted: var(--fw-sage-200);
  --fw-ink-inverse: var(--fw-forest-900);
  --fw-placeholder: rgba(244, 240, 231, 0.62);
  --fw-border: rgba(244, 240, 231, 0.16);
  --fw-border-decorative: rgba(244, 240, 231, 0.16);
  --fw-border-strong: rgba(244, 240, 231, 0.45);
  --fw-focus: var(--fw-cream-100);
  --fw-accent: var(--fw-green-400);
  --fw-accent-hover: var(--fw-green-500);
  --fw-on-accent: var(--fw-forest-950);
  --fw-link: var(--fw-green-400);
  --fw-danger: var(--fw-red-200);
  --fw-danger-surface: var(--fw-red-100);
  --fw-on-danger: var(--fw-forest-950);
  --fw-warning: var(--fw-amber-300);
  --fw-warning-surface: var(--fw-amber-100);
  --fw-success: var(--fw-green-400);
  --fw-success-surface: var(--fw-green-100);
  --fw-info: var(--fw-teal-200);
  --fw-info-surface: var(--fw-teal-100);
  --fw-selected: var(--fw-cream-100);
  --fw-on-selected: var(--fw-forest-950);
}

[data-surface="light"] {
  --fw-surface: var(--fw-cream-100);
  --fw-surface-raised: var(--fw-white);
  --fw-surface-sunken: var(--fw-cream-200);
  --fw-surface-grid: var(--fw-cream-50);
  --fw-surface-inverse: var(--fw-forest-950);
  --fw-ink: var(--fw-forest-900);
  --fw-ink-muted: var(--fw-sage-700);
  --fw-ink-inverse: var(--fw-cream-100);
  --fw-placeholder: var(--fw-sage-500);
  --fw-border: var(--fw-cream-300);
  --fw-border-decorative: var(--fw-stone-400);
  --fw-border-strong: var(--fw-stone-600);
  --fw-focus: var(--fw-forest-950);
  --fw-accent: var(--fw-green-400);
  --fw-accent-hover: var(--fw-green-500);
  --fw-on-accent: var(--fw-forest-950);
  --fw-link: var(--fw-green-700);
  --fw-danger: var(--fw-red-800);
  --fw-danger-surface: var(--fw-red-100);
  --fw-on-danger: var(--fw-white);
  --fw-warning: var(--fw-amber-800);
  --fw-warning-surface: var(--fw-amber-100);
  --fw-success: var(--fw-green-800);
  --fw-success-surface: var(--fw-green-100);
  --fw-info: var(--fw-teal-700);
  --fw-info-surface: var(--fw-teal-100);
  --fw-selected: var(--fw-forest-950);
  --fw-on-selected: var(--fw-cream-100);
}

/* Applying a surface paints it; inherited colour keeps text on-token. */
[data-surface] { background-color: var(--fw-surface); color: var(--fw-ink); }

@media (prefers-reduced-motion: reduce) {
  :root { --fw-duration-instant: 0ms; --fw-duration-fast: 0ms; --fw-duration-base: 0ms; --fw-duration-slow: 0ms; }
}
[data-motion="reduce"] { --fw-duration-instant: 0ms; --fw-duration-fast: 0ms; --fw-duration-base: 0ms; --fw-duration-slow: 0ms; }
