/*
 * Fall — Graphical theme tokens.
 * Generated from gui/themes/fall.md (light and dark CSS variables). Do not hand-edit values here
 * without updating the theme reference; components consume these names, never literals.
 *
 * Modes: colours that differ between light and dark are light-dark() pairs, resolved by the
 * element's color-scheme. The page follows the system scheme; regions drawn over the dusk
 * wallpaper opt into dark with data-mode="dark".
 *
 * Local customizations (deliberate, by direction — they take precedence over the snapshot):
 *   - Fonts: Söhne (Klim, licensed — see styles.css for adding its webfonts) replaces
 *     GT Standard M / Geist for the ui, brand and editorial roles, with Graphik Web next.
 *     Where neither is available, SF Pro via the system font renders them on Apple devices,
 *     and each platform's UI font elsewhere.
 *   - A "display" text step above xxl, for the landing page headline only.
 *   - Palette colour 5: warm paper, for text and the primary action over the autumn landscape.
 */
:root {
  color-scheme: light dark;
  --theme-name: "Fall";
  --theme-icon-family: "Central";
  --theme-icon-style: "outlined";
  --toolbar-divider-bleed: 1;
  --focus-ring-color: light-dark(color-mix(in srgb, #000000 50%, transparent), color-mix(in srgb, #ffffff 50%, transparent));
  --focus-ring-outline: 2px solid var(--focus-ring-color);
  --icon-stroke-width: 2;
  --icon-light-display: none;
  --icon-regular-display: inline;
  --icon-bold-display: none;
  --motion-duration: 150ms;
  --motion-easing: cubic-bezier(0.2, 0.8, 0.2, 1);
  --motion-type: "easing";
  --motion-visual-duration: 0.15;
  --motion-bounce: 0.2;
  --motion-enabled: 1;
  --motion-small-iterations: infinite;
  --motion-large-duration: 300ms;
  --motion-large-easing: cubic-bezier(0.16, 1, 0.3, 1);
  --motion-large-type: "easing";
  --motion-large-visual-duration: 0.3;
  --motion-large-bounce: 0.2;
  --motion-large-iterations: infinite;
  --motion-popup-scale: 0.96;
  --motion-press-distance: 1px;
  --option-badge-background: color-mix(in srgb, var(--color-1) 10%, transparent);
  --option-badge-foreground: #fe8e3a;
  --navigation-active-foreground: light-dark(#000000, #ffffff);
  --emphasis-chart-fill: #fe8e3a33;
  --emphasis-balance-background: light-dark(#f0f0f0, #2b2b2b);
  --emphasis-rewards-background: light-dark(#f0f0f0, #2b2b2b);
  --emphasis-icon-background: light-dark(#f0f0f0, #2b2b2b);
  --emphasis-icon-foreground: light-dark(#000000, #ffffff);
  --emphasis-type-background: light-dark(#f0f0f0, #2b2b2b);
  --emphasis-type-foreground: light-dark(#000000, #ffffff);
  --navigation-active-background: #fe8e3a33;
  --surface-raised-image: none;
  --surface-raised-shadow: 0 0 0 0 transparent;
  --surface-recessed-image: none;
  --surface-recessed-shadow: 0 0 0 0 transparent;
  --space-zero: 0px;
  --space-xxs: 3px;
  --space-xs: 6px;
  --space-s: 9px;
  --space-m: 12px;
  --space-l: 17px;
  --space-xl: 23px;
  --space-xxl: 35px;
  --tracking-xs: -0.02em;
  --tracking-s: -0.01em;
  --tracking-m: 0em;
  --tracking-l: 0.01em;
  --tracking-xl: 0.02em;
  --size-xxs: 9px;
  --line-xxs: 12px;
  --letter-spacing-xxs: 0.02em;
  --size-xs: 11px;
  --line-xs: 14px;
  --letter-spacing-xs: 0.01em;
  --size-s: 12px;
  --line-s: 18px;
  --letter-spacing-s: 0.01em;
  --size-m: 14px;
  --line-m: 21px;
  --letter-spacing-m: 0em;
  --size-l: 21px;
  --line-l: 28px;
  --letter-spacing-l: -0.01em;
  --size-xl: 32px;
  --line-xl: 36px;
  --letter-spacing-xl: -0.01em;
  --size-xxl: 43px;
  --line-xxl: 46px;
  --letter-spacing-xxl: -0.02em;
  /* Local: display step for the landing headline — Apple-scale, tight tracking, scales with the viewport. */
  --size-display: clamp(44px, 6vw, 80px);
  --line-display: 1.02;
  --letter-spacing-display: -0.032em;
  --radius-zero: 0px;
  --radius-xs: 2px;
  --radius-s: 4px;
  --radius-m: 6px;
  --radius-l: 12px;
  --radius-xl: 18px;
  --radius-full: 9999px;
  --border-none: 0px;
  --border-s: 1px;
  --border-m: 1px;
  --border-l: 2px;
  --border-default-color: rgb(0 0 0 / 0.1);
  --border-shadow-none: 0 0 0 0 transparent;
  --border-shadow-s: 0 0 0 1px rgb(0 0 0 / 0.1);
  --border-shadow-m: 0 0 0 1px rgb(0 0 0 / 0.1);
  --border-shadow-l: 0 0 0 2px rgb(0 0 0 / 0.1);
  --font-ui: "Söhne", "Sohne", "Graphik Web", "Graphik", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
  --weight-ui-regular: 400;
  --weight-ui-medium: 500;
  --weight-ui-heavy: 700;
  --font-brand: "Söhne", "Sohne", "Graphik Web", "Graphik", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif;
  --weight-brand-regular: 400;
  --weight-brand-medium: 500;
  --weight-brand-heavy: 700;
  --font-editorial: "Söhne", "Sohne", "Graphik Web", "Graphik", -apple-system, BlinkMacSystemFont, "SF Pro Display", "Helvetica Neue", sans-serif;
  --weight-editorial-regular: 400;
  --weight-editorial-medium: 500;
  --weight-editorial-heavy: 700;
  --font-data: ui-monospace, "SF Mono", Menlo, monospace;
  --weight-data-regular: 400;
  --weight-data-medium: 500;
  --weight-data-heavy: 700;
  --color-none: transparent;
  --color-1: #fe8e3a;
  --color-1-transparent: #fe8e3a33;
  --color-2: #76ef6b;
  --color-2-transparent: #76ef6b33;
  --color-3: #009ff0;
  --color-3-transparent: #009ff033;
  --color-4: #e864ff;
  --color-4-transparent: #e864ff33;
  /* Local: warm paper. */
  --color-5: #f2e8cf;
  --color-5-transparent: #f2e8cf33;
  --neutral-1: light-dark(#ffffff, #000000);
  --neutral-1-transparent: light-dark(#ffffff33, #00000033);
  --neutral-2: light-dark(#fafafa, #202020);
  --neutral-2-transparent: light-dark(#fafafa33, #20202033);
  --neutral-3: light-dark(#f0f0f0, #2b2b2b);
  --neutral-3-transparent: light-dark(#f0f0f033, #2b2b2b33);
  --neutral-4: light-dark(#dedede, #383838);
  --neutral-4-transparent: light-dark(#dedede33, #38383833);
  --neutral-5: light-dark(#c5c5c5, #505050);
  --neutral-5-transparent: light-dark(#c5c5c533, #50505033);
  --neutral-6: light-dark(#969696, #777777);
  --neutral-6-transparent: light-dark(#96969633, #77777733);
  --neutral-7: light-dark(#6c6c6c, #a3a3a3);
  --neutral-7-transparent: light-dark(#6c6c6c33, #a3a3a333);
  --neutral-8: light-dark(#454545, #c6c6c6);
  --neutral-8-transparent: light-dark(#45454533, #c6c6c633);
  --neutral-9: light-dark(#252525, #e5e5e5);
  --neutral-9-transparent: light-dark(#25252533, #e5e5e533);
  --neutral-10: light-dark(#000000, #ffffff);
  --neutral-10-transparent: light-dark(#00000033, #ffffff33);
  --success: #76ef6b;
  --success-transparent: #76ef6b33;
  --warning: #ffa344;
  --warning-transparent: #ffa34433;
  --error: #ff5263;
  --error-transparent: #ff526333;
  --shadow-none: none;
  --shadow-s: 0px 1px 2px 0px #00000000;
  --shadow-m: 0px 8px 24px 0px #00000000;
  --shadow-l: 0px 12px 30px 0px #00000000;
  --cte-canvas: light-dark(#ffffff, #000000);
  --cte-surface: light-dark(#fafafa, #202020);
  --cte-surface-muted: light-dark(#f0f0f0, #2b2b2b);
  --cte-text: light-dark(#000000, #ffffff);
  --cte-text-muted: light-dark(#6c6c6c, #a3a3a3);
  --cte-border: rgb(0 0 0 / 0.1);
  --cte-accent: #fe8e3a;
  --cte-accent-text: #000000;
  --cte-danger: #ff5263;
  --cte-focus: #fe8e3a;
  --cte-font: "Söhne", "Sohne", "Graphik Web", "Graphik", -apple-system, BlinkMacSystemFont, "SF Pro Text", "Helvetica Neue", sans-serif;
  --cte-font-size: 14px;
  --cte-font-weight: 400;
  --cte-line-height: 21px;
  --cte-letter-spacing: 0em;
  --cte-detail-font-size: 14px;
  --cte-detail-line-height: 21px;
  --cte-detail-letter-spacing: 0em;
}

[data-mode="dark"] { color-scheme: dark; }
[data-mode="light"] { color-scheme: light; }