/* Fully Known — design tokens. Generated from tokens.json. Set data-theme="light" | "dark" on <html>. */

@font-face { font-family: 'TAY Birdie'; src: url('../fonts/TAYBirdieRegular.woff2') format('woff2'), url('../fonts/TAYBirdieRegular.otf') format('opentype'); font-weight: 400; font-style: normal; font-display: block; }
@font-face { font-family: 'TAY Wingman'; src: url('../fonts/TAYWingmanRegular.woff2') format('woff2'), url('../fonts/TAYWingmanRegular.otf') format('opentype'); font-weight: 400; font-style: normal; font-display: block; }
@font-face { font-family: 'TAY Sundae'; src: url('../fonts/TAYSundaeRegular.woff2') format('woff2'), url('../fonts/TAYSundaeRegular.otf') format('opentype'); font-weight: 400; font-style: normal; font-display: block; }

:root, [data-theme="light"] {
  --brand-rose: #C89F9C;
  --brand-tan: #C8A795;
  --brand-sand: #CDB1A2;
  --brand-silver: #CAC6BF;
  --brand-ash-blue: #BACAC9;
  --brand-ash-sage: #C2C7BB;
  --brand-snow: #FBF9F7;
  --brand-ink: #1C2120;
  --surface: #FBF9F7;
  --surface-raised: #FFFFFF;
  --surface-sunken: #F2EFEB;
  --line: #E5DDD8;
  --line-strong: #8E8580;
  --ink: #1C2120;
  --ink-muted: #6B6560;
  --action: #1C2120;
  --action-hover: #343B3A;
  --on-action: #FBF9F7;
  --accent: #C89F9C;
  --accent-soft: #F3E7E5;
  --accent-ink: #8A5A56;
  --on-tint: #1C2120;
  --on-aura: #FBF9F7;
  --focus: #1C2120;
  --success: #2F5F73;
  --success-soft: #E3EDF1;
  --danger: #9E3B34;
  --danger-soft: #F6E4E1;
  --shadow-card: 0 1px 2px rgba(28,33,32,0.05), 0 6px 20px rgba(28,33,32,0.06);
  --shadow-sheet: 0 -2px 24px rgba(28,33,32,0.10);
}
[data-theme="dark"] {
  --surface: #1C2120;
  --surface-raised: #252B2A;
  --surface-sunken: #161A19;
  --line: #343B3A;
  --line-strong: #7C8482;
  --ink: #F2EFEB;
  --ink-muted: #A9A5A0;
  --action: #F2EFEB;
  --action-hover: #FFFFFF;
  --on-action: #1C2120;
  --accent: #C89F9C;
  --accent-soft: #3A2E2D;
  --accent-ink: #D9B5B1;
  --on-tint: #1C2120;
  --on-aura: #FBF9F7;
  --focus: #F2EFEB;
  --success: #9CC3D4;
  --success-soft: #1F2E34;
  --danger: #E39A90;
  --danger-soft: #3B2422;
  --shadow-card: 0 1px 2px rgba(0,0,0,0.45);
  --shadow-sheet: 0 -2px 24px rgba(0,0,0,0.6);
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --surface: #1C2120;
    --surface-raised: #252B2A;
    --surface-sunken: #161A19;
    --line: #343B3A;
    --line-strong: #7C8482;
    --ink: #F2EFEB;
    --ink-muted: #A9A5A0;
    --action: #F2EFEB;
    --action-hover: #FFFFFF;
    --on-action: #1C2120;
    --accent: #C89F9C;
    --accent-soft: #3A2E2D;
    --accent-ink: #D9B5B1;
    --on-tint: #1C2120;
    --on-aura: #FBF9F7;
    --focus: #F2EFEB;
    --success: #9CC3D4;
    --success-soft: #1F2E34;
    --danger: #E39A90;
    --danger-soft: #3B2422;
    --shadow-card: 0 1px 2px rgba(0,0,0,0.45);
    --shadow-sheet: 0 -2px 24px rgba(0,0,0,0.6);
  }
}
:root {
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 24px;
  --space-6: 32px;
  --space-7: 48px;
  --space-8: 64px;
  --radius-sm: 8px;
  --radius-md: 14px;
  --radius-lg: 22px;
  --radius-xl: 32px;
  --radius-tile: 20%;
  --radius-pill: 999px;
  --size-control: 48px;
  --size-control-sm: 36px;
  --size-touch: 44px;
  --size-avatar: 44px;
  --size-avatar-lg: 96px;
  --size-content: 560px;
  --font-text: "TAY Birdie", ui-rounded, system-ui, sans-serif;
  --font-caps: "TAY Wingman", ui-rounded, system-ui, sans-serif;
  --font-script: "TAY Sundae", "Snell Roundhand", cursive;
}

.script-hero { font-family: var(--font-script); font-size: 56px; line-height: 60px; font-weight: 400; }
.script-title { font-family: var(--font-script); font-size: 36px; line-height: 42px; font-weight: 400; }
.caps-display { font-family: var(--font-caps); font-size: 32px; line-height: 36px; font-weight: 400; letter-spacing: 0.14em; text-transform: uppercase; }
.eyebrow { font-family: var(--font-caps); font-size: 12px; line-height: 16px; font-weight: 400; letter-spacing: 0.16em; text-transform: uppercase; }
.title-1 { font-family: var(--font-text); font-size: 32px; line-height: 38px; font-weight: 400; letter-spacing: -0.01em; }
.title-2 { font-family: var(--font-text); font-size: 24px; line-height: 30px; font-weight: 400; letter-spacing: -0.005em; }
.title-3 { font-family: var(--font-text); font-size: 19px; line-height: 26px; font-weight: 400; letter-spacing: -0.01em; }
.body { font-family: var(--font-text); font-size: 17px; line-height: 26px; font-weight: 400; letter-spacing: -0.01em; }
.body-sm { font-family: var(--font-text); font-size: 15px; line-height: 22px; font-weight: 400; letter-spacing: -0.01em; }
.caption { font-family: var(--font-text); font-size: 13px; line-height: 18px; font-weight: 400; letter-spacing: 0em; }