/* Thimbly design tokens – copied from the design system (resources/design-system/tokens.json, generated tokens.css). Do not edit by hand; see docs/design-system.md. */
:root, [data-theme="light"] {
  --bg: #faf7f2;
  --surface: #ffffff;
  --surface-sunken: #f3eee6;
  --border: var(--stone-200);
  --border-strong: var(--stone-500);
  --text: var(--stone-950);
  --text-muted: var(--stone-600);
  --primary: var(--plum-700);
  --primary-hover: var(--plum-800);
  --primary-active: var(--plum-900);
  --on-primary: #ffffff;
  --primary-soft: var(--plum-50);
  --focus: var(--blue-700);
  --platform-accent: var(--petrol-700);
  --on-platform-accent: #ffffff;
  --platform-accent-soft: var(--petrol-50);
  --brand-mark: var(--plum-700);
  --success: var(--green-700);
  --success-soft: var(--green-50);
  --warning: var(--amber-700);
  --warning-soft: var(--amber-50);
  --danger: var(--red-700);
  --danger-hover: var(--red-800);
  --danger-soft: var(--red-50);
  --on-danger: #ffffff;
  --info: var(--blue-700);
  --info-soft: var(--blue-50);
  --color-primary: #262524;
  --color-on-primary: #ffffff;
  --color-bg: #ffffff;
  --color-surface: #f5f4f2;
  --color-text: #1c1b1a;
  --sf-success: var(--green-700);
  --sf-success-soft: var(--green-50);
  --sf-warning: var(--amber-700);
  --sf-warning-soft: var(--amber-50);
  --sf-danger: var(--red-700);
  --sf-danger-soft: var(--red-50);
  --sf-info: var(--blue-700);
  --sf-info-soft: var(--blue-50);
  --plum-50: #fff3f8;
  --plum-100: #fbe4ee;
  --plum-200: #f5ccde;
  --plum-300: #e8aac7;
  --plum-400: #d286ab;
  --plum-500: #b8668e;
  --plum-600: #9a4c74;
  --plum-700: #80385e;
  --plum-800: #67294a;
  --plum-900: #4e1b36;
  --plum-950: #350d23;
  --brass-50: #fcf6ec;
  --brass-100: #f7e9d5;
  --brass-200: #edd5b2;
  --brass-300: #ddb981;
  --brass-400: #c6994d;
  --brass-500: #ac7a1b;
  --brass-600: #8c6104;
  --brass-700: #714e04;
  --brass-800: #593c02;
  --brass-900: #422b00;
  --brass-950: #2a1b01;
  --petrol-50: #eff9fc;
  --petrol-100: #dbeff5;
  --petrol-200: #bce0eb;
  --petrol-300: #91cadb;
  --petrol-400: #62aec3;
  --petrol-500: #3892a9;
  --petrol-600: #12768d;
  --petrol-700: #055f72;
  --petrol-800: #044b5a;
  --petrol-900: #013743;
  --petrol-950: #00232b;
  --stone-50: #f7f6f6;
  --stone-100: #ecebe9;
  --stone-200: #dbd8d5;
  --stone-300: #c3beba;
  --stone-400: #a6a09a;
  --stone-500: #89847d;
  --stone-600: #6f6963;
  --stone-700: #59544f;
  --stone-800: #46423d;
  --stone-900: #33302c;
  --stone-950: #201e1a;
  --green-50: #f0faf2;
  --green-100: #dcf2e1;
  --green-200: #bde5c6;
  --green-300: #93d1a3;
  --green-400: #64b67d;
  --green-500: #3b9a5c;
  --green-600: #167f42;
  --green-700: #026732;
  --green-800: #025126;
  --green-900: #003b1a;
  --green-950: #00260e;
  --amber-50: #fff5eb;
  --amber-100: #fce7d3;
  --amber-200: #f6d2ad;
  --amber-300: #eab479;
  --amber-400: #d59140;
  --amber-500: #b87304;
  --amber-600: #955c04;
  --amber-700: #784904;
  --amber-800: #5f3801;
  --amber-900: #462901;
  --amber-950: #2e1800;
  --red-50: #fef4f3;
  --red-100: #fee4e1;
  --red-200: #ffcbc4;
  --red-300: #ffa398;
  --red-400: #f2776c;
  --red-500: #d85249;
  --red-600: #b8342f;
  --red-700: #9b1e1d;
  --red-800: #7e0e10;
  --red-900: #600407;
  --red-950: #410002;
  --blue-50: #f1f8ff;
  --blue-100: #ddedfe;
  --blue-200: #beddfe;
  --blue-300: #92c4f8;
  --blue-400: #66a6e8;
  --blue-500: #3f89cf;
  --blue-600: #216db2;
  --blue-700: #075796;
  --blue-800: #014478;
  --blue-900: #00315a;
  --blue-950: #001f3c;
  --shadow-sm: 0 1px 2px rgba(32,30,26,0.06);
  --shadow-md: 0 2px 4px rgba(32,30,26,0.05), 0 8px 20px rgba(32,30,26,0.07);
  --shadow-lg: 0 12px 32px rgba(32,30,26,0.14);
}
[data-theme="dark"], .dark {
  --bg: #191715;
  --surface: #23201d;
  --surface-sunken: #121110;
  --border: #3a3632;
  --border-strong: #7d776f;
  --text: #f3efea;
  --text-muted: #b5aea6;
  --primary: var(--plum-300);
  --primary-hover: var(--plum-200);
  --primary-active: var(--plum-100);
  --on-primary: var(--plum-950);
  --primary-soft: #3b1729;
  --focus: var(--blue-300);
  --platform-accent: var(--petrol-300);
  --on-platform-accent: var(--petrol-950);
  --platform-accent-soft: #0b2a31;
  --brand-mark: var(--brass-300);
  --success: var(--green-300);
  --success-soft: #0f2618;
  --warning: var(--amber-300);
  --warning-soft: #2e1d0a;
  --danger: var(--red-300);
  --danger-hover: var(--red-200);
  --danger-soft: #3a1312;
  --on-danger: var(--red-950);
  --info: var(--blue-300);
  --info-soft: #0d2238;
  --shadow-sm: 0 1px 2px rgba(0,0,0,0.4);
  --shadow-md: 0 2px 4px rgba(0,0,0,0.4), 0 8px 20px rgba(0,0,0,0.35);
  --shadow-lg: 0 12px 32px rgba(0,0,0,0.55);
}
:root {
  --space-0: 0px;
  --space-1: 4px;
  --space-2: 8px;
  --space-3: 12px;
  --space-4: 16px;
  --space-5: 20px;
  --space-6: 24px;
  --space-8: 32px;
  --space-10: 40px;
  --space-12: 48px;
  --space-16: 64px;
  --space-24: 96px;
  --radius-none: 0px;
  --radius-sm: 4px;
  --radius-md: 8px;
  --radius-lg: 14px;
  --radius-full: 999px;
  --radius: 6px;
  --duration-fast: 120ms;
  --duration-base: 200ms;
  --duration-slow: 320ms;
  --ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --ease-exit: cubic-bezier(0.4, 0, 1, 1);
  --target-min: 44px;
  --control-h: 44px;
  --control-h-sm: 36px;
  --icon-sm: 20px;
  --icon-md: 24px;
  --content-max: 1200px;
  --prose-max: 68ch;
  --font-display: "Fraunces", "Iowan Old Style", Georgia, serif;
  --font-sans: "Instrument Sans", ui-sans-serif, system-ui, -apple-system, "Segoe UI", Arial, sans-serif;
  --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace;
  --font-body: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}
.display-xl { font-family: var(--font-display); font-size: 56px; line-height: 60px; font-weight: 500; letter-spacing: -0.02em; }
.display-l { font-family: var(--font-display); font-size: 40px; line-height: 46px; font-weight: 500; letter-spacing: -0.015em; }
.display-m { font-family: var(--font-display); font-size: 30px; line-height: 36px; font-weight: 500; letter-spacing: -0.01em; }
.heading-l { font-family: var(--font-sans); font-size: 24px; line-height: 32px; font-weight: 600; letter-spacing: -0.01em; }
.heading-m { font-family: var(--font-sans); font-size: 20px; line-height: 28px; font-weight: 600; }
.heading-s { font-family: var(--font-sans); font-size: 17px; line-height: 24px; font-weight: 600; }
.body-l { font-family: var(--font-sans); font-size: 18px; line-height: 28px; font-weight: 400; }
.body { font-family: var(--font-sans); font-size: 16px; line-height: 24px; font-weight: 400; }
.body-s { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.label { font-family: var(--font-sans); font-size: 14px; line-height: 20px; font-weight: 600; }
.caption { font-family: var(--font-sans); font-size: 13px; line-height: 18px; font-weight: 400; }
.code { font-family: var(--font-mono); font-size: 14px; line-height: 20px; font-weight: 400; }
@font-face { font-family: "Fraunces"; src: url("/fonts/Fraunces-Variable.woff2") format("woff2"); font-weight: 300 700; font-style: normal; font-display: swap; }
@font-face { font-family: "Instrument Sans"; src: url("/fonts/InstrumentSans-Variable.woff2") format("woff2"); font-weight: 400 700; font-style: normal; font-display: swap; }
