/* Shared design tokens (same names and values as the owner portal). A soft tinted atmosphere sits behind everything,
   glass is reserved for navigation, and content lives on solid white sheets. Light by default; dark follows the device. */
/* Self-hosted variable font (latin subset). No third-party font requests. */
@font-face { font-family: 'Figtree'; font-style: normal; font-weight: 300 900; font-display: swap; src: url('../assets/fonts/figtree-latin.woff2') format('woff2'); }

:root {
  color-scheme: light dark;
  --bg: #eef1f5;
  --glow-a: #cfe0f5;
  --glow-b: #f6e7cf;
  --surface: #ffffff;
  --surface-2: #f5f7fa;
  --surface-3: #eaeef3;
  --ink: #15202b;
  --ink-2: #3f4a57;
  --ink-3: #5b6573;
  --ink-4: #78818e;
  --line: rgba(21, 32, 43, .08);
  --line-2: rgba(21, 32, 43, .14);
  --tint: rgba(21, 32, 43, .05);
  --tint-2: rgba(21, 32, 43, .08);

  --accent: #b8741a;
  --accent-ink: #8e5713;
  --accent-fill: #9f6210;
  --accent-fill-press: #8a540c;
  --on-accent: #ffffff;
  --accent-soft: #fbf1dd;
  --accent-line: #ecd1a3;
  --green: #1f7a4d;
  --green-soft: #e3f3ea;
  --green-line: #bfe1cd;
  --red: #b3261e;
  --red-soft: #fbe9e7;
  --red-line: #f0c3bf;
  --blue: #2458c5;
  --blue-soft: #e7eefb;
  --blue-line: #c3d3f3;
  --focus: #2458c5;
  --focus-ring: rgba(36, 88, 197, .25);

  --glass: rgba(255, 255, 255, .66);
  --glass-strong: rgba(255, 255, 255, .86);
  --glass-line: rgba(255, 255, 255, .75);
  --glass-highlight: rgba(255, 255, 255, .85);
  --chip-on-photo: rgba(16, 22, 30, .62);
  --overlay: rgba(21, 32, 43, .32);
  --shadow-sheet: 0 1px 2px rgba(21, 32, 43, .04), 0 12px 32px -20px rgba(21, 32, 43, .16);
  --shadow-float: 0 1px 2px rgba(21, 32, 43, .05), 0 18px 48px -24px rgba(21, 32, 43, .28);
  --shadow-pop: 0 24px 64px -24px rgba(21, 32, 43, .35);
  --shadow-ctl: 0 1px 2px var(--tint-2), 0 4px 12px var(--tint-2);
  --ring: 0 0 0 4px var(--focus-ring);
  --shadow-glass: inset 0 1px 0 var(--glass-highlight), var(--shadow-float);
  --photo-scrim: linear-gradient(180deg, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .62) 100%);

  --sans: 'Figtree', -apple-system, BlinkMacSystemFont, 'Segoe UI', system-ui, sans-serif;
  /* Shared reading scale (values agreed with the owner portal): nothing informational below 14px. Pills may use
     --text-pill; --ink-4 is for large or decorative text only. */
  --text-pill: 13px;
  --text-meta: 14px;
  --text-small: 15px;
  --text-body: 16px;
  --text-lead: 18px;
  --text-title: 21px;
  --text-h1: 30px;
  --text-display: 44px;
  --tap: 44px;
  --tap-lg: 48px;

  --r-ctl: 12px;
  --r-tile: 18px;
  --r-sheet: 20px;
  --r-glass: 24px;
  --r-photo: 24px;
  --r-pill: 999px;

  --bar-h: 60px;
  --bar-gap: 12px;
  --page-max: 1200px;
  --gutter: 32px;
  --ease-out: cubic-bezier(.23, 1, .32, 1);
  --ease-move: cubic-bezier(.32, .72, 0, 1);
  --dur-fast: 140ms;
  --dur: 180ms;
}

@media (prefers-color-scheme: dark) {
  :root {
    --bg: #0b1016;
    --glow-a: #16263c;
    --glow-b: #33261a;
    --surface: #151b23;
    --surface-2: #1b222c;
    --surface-3: #222b36;
    --ink: #eef1f5;
    --ink-2: #c3cad3;
    --ink-3: #9aa3ae;
    --ink-4: #717b87;
    --line: rgba(255, 255, 255, .07);
    --line-2: rgba(255, 255, 255, .12);
    --tint: rgba(255, 255, 255, .05);
    --tint-2: rgba(255, 255, 255, .09);
    --accent: #e0a85a;
    --accent-ink: #f0c27a;
    --accent-fill: #e8b05f;
    --accent-fill-press: #f0c27a;
    --on-accent: #1a1407;
    --accent-soft: #2a2114;
    --accent-line: #4d3a1b;
    --green: #5cc088;
    --green-soft: #13241b;
    --green-line: #1f4a31;
    --red: #ef8077;
    --red-soft: #2c1715;
    --red-line: #5a2520;
    --blue: #7ea6f2;
    --blue-soft: #151d2d;
    --blue-line: #273a66;
    --focus: #7ea6f2;
    --focus-ring: rgba(126, 166, 242, .3);
    --glass: rgba(21, 27, 35, .62);
    --glass-strong: rgba(21, 27, 35, .88);
    --glass-line: rgba(255, 255, 255, .10);
    --glass-highlight: rgba(255, 255, 255, .08);
    --overlay: rgba(0, 0, 0, .55);
    --shadow-sheet: 0 1px 2px rgba(0, 0, 0, .45), 0 12px 32px -20px rgba(0, 0, 0, .45);
    --shadow-float: 0 1px 2px rgba(0, 0, 0, .5), 0 18px 48px -24px rgba(0, 0, 0, .55);
    --shadow-pop: 0 24px 64px -24px rgba(0, 0, 0, .65);
  }
}

@media (max-width: 900px) {
  :root {
    --text-body: 17px;
    --text-h1: 28px;
    --text-display: 32px;
    --bar-h: 56px;
    --bar-gap: 10px;
    --gutter: 16px;
  }
}
