/* Hallmark · genre: modern-minimal with atmospheric entry · macrostructure family: Map / Diagram + Workbench
 * theme: custom · design-system: design.md · designed-as-app · anchor hue: cool blue
 * display: Chakra Petch + Sarabun · body: Sarabun · nav: N10 · footer: Ft2 · v1.1.0
 */
/* Hallmark · pre-emit critique: P5 H5 E5 S5 R5 V5 · restrained icon voice · responsive forms · no emoji UI */

:root {
  color-scheme: light;

  --font-display: "Chakra Petch", "Sarabun", ui-sans-serif, sans-serif;
  --font-body: "Sarabun", ui-sans-serif, sans-serif;
  --font-wordmark: "Chakra Petch", "Sarabun", ui-sans-serif, sans-serif;

  --color-paper: oklch(99% 0.006 245);
  --color-surface: oklch(97.5% 0.01 245);
  --color-surface-raised: oklch(99.6% 0.006 245);
  --color-paper-2: var(--color-surface);
  --color-paper-3: oklch(95% 0.014 245);
  --color-ink: oklch(25% 0.035 255);
  --color-ink-muted: oklch(50% 0.03 252);
  --color-ink-2: oklch(34% 0.035 254);
  --color-muted: var(--color-ink-muted);
  --color-neutral: oklch(40% 0.03 253);
  --color-line: oklch(89% 0.018 245);
  --color-line-strong: oklch(76% 0.035 250);
  --color-rule: var(--color-line);
  --color-rule-2: var(--color-line-strong);
  --color-accent: oklch(52% 0.19 258);
  --color-accent-strong: oklch(43% 0.18 258);
  --color-accent-soft: oklch(94% 0.035 250);
  --color-accent-ink: oklch(99% 0.006 245);
  --color-focus: oklch(32% 0.14 258);
  --color-focus-inverse: oklch(99% 0.006 245);
  --color-good: oklch(55% 0.14 155);
  --color-warn: oklch(70% 0.15 75);
  --color-danger: oklch(57% 0.2 25);
  --color-success: var(--color-good);
  --color-warning: var(--color-warn);
  --color-error: var(--color-danger);
  --color-success-soft: oklch(95% 0.035 155);
  --color-warning-soft: oklch(96% 0.04 80);
  --color-error-soft: oklch(96% 0.035 25);
  --color-error-ink: oklch(38% 0.14 25);
  --color-info-soft: oklch(96% 0.025 245);
  --color-brand-line: oklch(74% 0.19 145);
  --color-brand-line-strong: oklch(43% 0.13 150);
  --color-brand-line-ink: var(--color-ink);
  --color-success-strong: oklch(43% 0.12 155);
  --color-success-ink: oklch(36% 0.1 155);
  --color-warning-strong: oklch(52% 0.16 65);
  --color-warning-ink: oklch(38% 0.1 65);
  --color-info: oklch(61% 0.15 235);
  --color-info-strong: oklch(43% 0.14 240);
  --color-finance: oklch(53% 0.18 295);
  --color-finance-strong: oklch(42% 0.15 295);
  --color-finance-soft: oklch(95% 0.035 295);
  --color-market: oklch(65% 0.17 340);
  --color-market-strong: oklch(40% 0.12 335);
  --color-market-soft: oklch(96% 0.03 335);

  --color-hero-surface: oklch(16% 0.014 250);
  --color-hero-ink: oklch(97% 0.008 245);
  --color-hero-muted: oklch(87% 0.014 245);
  --color-glass-dark: oklch(18% 0.014 250);
  --color-glass-light: oklch(98% 0.009 245);
  --color-shadow: oklch(18% 0.025 255);

  --space-3xs: 0.125rem;
  --space-2xs: 0.25rem;
  --space-xs: 0.5rem;
  --space-sm: 0.75rem;
  --space-md: 1rem;
  --space-lg: 1.5rem;
  --space-xl: 2.5rem;
  --space-2xl: 4rem;
  --space-3xl: 6rem;
  --space-4xl: 9rem;

  /* Compatibility aliases used by the existing single-file application. */
  --space-1: var(--space-2xs);
  --space-2: var(--space-xs);
  --space-3: var(--space-sm);
  --space-4: var(--space-md);
  --space-5: 1.25rem;
  --space-6: var(--space-lg);
  --space-8: 2rem;
  --space-10: var(--space-xl);
  --space-12: 3rem;

  --text-xs: 0.75rem;
  --text-sm: 0.875rem;
  --text-base: 1rem;
  --text-md: 1.25rem;
  --text-lg: 1.5625rem;
  --text-xl: clamp(1.25rem, 1rem + 0.8vw, 1.75rem);
  --text-2xl: clamp(1.7rem, 1.25rem + 1.5vw, 2.55rem);
  --text-display-s: clamp(2.25rem, 5vw + 0.5rem, 4rem);
  --text-display: clamp(2.65rem, 6vw + 0.4rem, 5.25rem);

  --size-touch: 2.75rem;
  --size-control: 3rem;
  --size-nav-offset: 4.5rem;
  --size-marker-hit: var(--size-touch);
  --offset-marker-inline: -1.375rem;
  --offset-marker-block: -2.75rem;
  --measure-page-wide: 90rem;
  --measure-copy-min: 14.375rem;
  --measure-map-rail-min: 20rem;
  --measure-map-rail-max: 24.375rem;
  --measure-map-panel-min: 38.75rem;
  --measure-map-panel-max: 45rem;
  --measure-map-thumb: 5.75rem;
  --measure-price-marker: 4.5rem;
  --measure-popup: 13.75rem;
  --measure-dialog: 21.25rem;
  --measure-modal-sm: 26.25rem;
  --measure-modal: 31.25rem;
  --measure-modal-wide: 37.5rem;
  --measure-media: 15rem;
  --measure-thumbnail: 3.75rem;
  --measure-card-action: 7.5rem;
  --measure-toast-offset: 5rem;
  --measure-map-result-min: 7rem;
  --measure-note: 22.5rem;
  --measure-district-control: 10.5rem;
  --measure-picker-map: 17.5rem;
  --measure-password-action-clearance: 5.5rem;
  --measure-mobile-footer-clearance: 6.875rem;

  --radius-sm: 0.55rem;
  --radius-md: 0.8rem;
  --radius-lg: 1.15rem;
  --radius-glass: 1rem;
  --radius-pill: 999px;
  --radius-input: var(--radius-sm);
  --radius-card: var(--radius-md);
  --radius-modal: var(--radius-lg);

  --rule-thin: 1px;
  --rule-strong: 2px;
  --rule-hair: var(--rule-thin);
  --rule-fine: var(--rule-strong);

  --shadow-soft: 0 12px 34px oklch(25% 0.04 255 / 0.1);
  --shadow-map: 0 18px 48px oklch(25% 0.04 255 / 0.14);
  --shadow-nav: 0 14px 36px oklch(18% 0.025 255 / 0.2);
  --shadow-card: 0 8px 24px oklch(25% 0.04 255 / 0.08);
  --shadow-modal: 0 24px 72px oklch(18% 0.025 255 / 0.24);

  --dur-micro: 120ms;
  --dur-short: 220ms;
  --dur-long: 420ms;
  --dur-nav: 520ms;
  --dur-hero-delay: 200ms;
  --dur-hero-letter: 420ms;
  --dur-stagger-step: 26ms;
  --dur-hero-support-delay: 720ms;
  --dur-hero-actions-delay: 940ms;
  --dur-hero-tag-delay: 1080ms;
  --duration-fast: var(--dur-micro);
  --duration-base: var(--dur-short);

  --ease-out: cubic-bezier(0.16, 1, 0.3, 1);
  --ease-in: cubic-bezier(0.7, 0, 0.84, 0);
  --ease-in-out: cubic-bezier(0.65, 0, 0.35, 1);
  --ease-standard: var(--ease-out);

  --z-base: 1;
  --z-raised: 10;
  --z-dropdown: 100;
  --z-sticky: 200;
  --z-modal: 400;
  --z-toast: 500;
  --z-tooltip: 600;
  --z-overlay: 1000;
}
