/* GENERATED – do not edit. Source: packages/design-tokens/tokens.json (run `pnpm tokens`). */

:root {
  color-scheme: light dark;
  --color-night-500: #5A3352;
  --color-night-600: #3B1C35;
  --color-night-700: #2A1726;
  --color-night-800: #1E111B;
  --color-night-900: #140B12;
  --color-night-950: #0C070B;
  --color-mist: #F6EEF1;
  --color-white: #FFFFFF;
  --color-nar-300: #F0587F;
  --color-nar-500: #D6335C;
  --color-nar-700: #B8264B;
  --color-haze: #B79CFF;
  --color-ai-fg: #106D63;
  --color-ai-bg: rgba(19, 122, 112, 0.102);
  --color-ai-border: rgba(19, 122, 112, 0.4);
  --color-brand-100: #FBE4EB;
  --color-brand-500: #D6335C;
  --color-brand-600: #B8264B;
  --color-brand-text: #C22A52;
  --color-brand-fill-end: #B8264B;
  --color-dusk-100: #F0E2EA;
  --color-dusk-700: #3B1C35;
  --color-gold-500: #C08410;
  --color-bg-canvas: #F6EEF1;
  --color-bg-surface: rgba(255, 255, 255, 0.702);
  --color-bg-raised: rgba(255, 255, 255, 0.902);
  --color-bg-sunken: rgba(122, 74, 110, 0.102);
  --color-bg-solid: #FFFFFF;
  --color-bg-sheet: rgba(255, 255, 255, 0.961);
  --color-border-subtle: rgba(122, 74, 110, 0.161);
  --color-border-strong: rgba(106, 58, 94, 0.349);
  --color-text-primary: #22121F;
  --color-text-secondary: #5E4A5A;
  --color-text-tertiary: #786271;
  --color-text-on-brand: #FFFFFF;
  --color-text-on-dusk: #FFFFFF;
  --color-text-on-danger: #FFFFFF;
  --color-text-on-gold: #140B12;
  --color-text-on-night: #F6EEF1;
  --color-success: #1B8A64;
  --color-warning: #A86F00;
  --color-danger: #CF3339;
  --color-verified: #2F7BEB;
  --color-notice-critical-bg: #FAEBEB;
  --color-notice-critical-border: rgba(207, 51, 57, 0.4);
  --color-notice-critical-fg: #B42A30;
  --color-notice-warning-bg: #F5EEE0;
  --color-notice-warning-border: rgba(168, 111, 0, 0.4);
  --color-notice-warning-fg: #8A5A00;
  --color-notice-info-bg: rgba(255, 255, 255, 0.902);
  --color-notice-info-border: rgba(106, 58, 94, 0.349);
  --color-notice-info-fg: #C22A52;
  --color-notice-ai-bg: rgba(19, 122, 112, 0.102);
  --color-notice-ai-border: rgba(19, 122, 112, 0.4);
  --color-notice-ai-fg: #106D63;
  --color-topic-rose-bg: #FAE7EB;
  --color-topic-rose-fg: #C22A52;
  --color-topic-amber-bg: #FDF3E8;
  --color-topic-amber-fg: #A45A12;
  --color-topic-sea-bg: #E6F5F7;
  --color-topic-sea-fg: #1D6F7C;
  --color-topic-lilac-bg: #EADCF0;
  --color-topic-lilac-fg: #3B1C35;
  --color-topic-mint-bg: #DFEFE9;
  --color-topic-mint-fg: #1B6E52;
  --color-overlay-scrim: rgba(28, 23, 51, 0.478);
  --color-skeleton-base: rgba(122, 74, 110, 0.161);
  --color-skeleton-highlight: rgba(122, 74, 110, 0.102);
  --gradient-night: radial-gradient(circle at 50% 32.5%, #FFFFFF 0%, #FAF4F6 55%, #F6EEF1 100%);
  --gradient-accent: linear-gradient(135deg, #3B1C35 0%, #D6335C 100%);
  --gradient-ring: linear-gradient(135deg, #9A5A86 0%, #D6335C 100%);
  --gradient-brand: radial-gradient(circle at 50% 45%, #3B1C35 0%, #140B12 100%);
  --gradient-backdrop: radial-gradient(circle at 50% 19%, #F0D9E4 0%, #F4E8EE 45%, #F6EEF1 100%);
  --gradient-brand-fill: linear-gradient(135deg, #D6335C 0%, #B8264B 100%);
  --gradient-haze: radial-gradient(circle at 50% 50%, rgba(240, 88, 127, 0.349) 0%, rgba(183, 156, 255, 0) 100%);
  --font-display: 'Bricolage Grotesque', 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-ui: 'Plus Jakarta Sans', system-ui, sans-serif;
  --font-mono: 'JetBrains Mono', ui-monospace, monospace;
  --type-display-xl-size: 2.25rem;
  --type-display-xl-line-height: 2.625rem;
  --type-display-xl-weight: 700;
  --type-display-xl-letter-spacing: 0px;
  --type-display-xl-family: var(--font-display);
  --type-display-l-size: 1.75rem;
  --type-display-l-line-height: 2.125rem;
  --type-display-l-weight: 700;
  --type-display-l-letter-spacing: 0px;
  --type-display-l-family: var(--font-display);
  --type-title-l-size: 1.5rem;
  --type-title-l-line-height: 1.875rem;
  --type-title-l-weight: 600;
  --type-title-l-letter-spacing: 0px;
  --type-title-l-family: var(--font-display);
  --type-title-m-size: 1.25rem;
  --type-title-m-line-height: 1.625rem;
  --type-title-m-weight: 600;
  --type-title-m-letter-spacing: 0px;
  --type-title-m-family: var(--font-ui);
  --type-body-l-size: 1.0625rem;
  --type-body-l-line-height: 1.625rem;
  --type-body-l-weight: 400;
  --type-body-l-letter-spacing: 0px;
  --type-body-l-family: var(--font-ui);
  --type-body-m-size: 0.9375rem;
  --type-body-m-line-height: 1.375rem;
  --type-body-m-weight: 400;
  --type-body-m-letter-spacing: 0px;
  --type-body-m-family: var(--font-ui);
  --type-label-m-size: 0.9375rem;
  --type-label-m-line-height: 1.25rem;
  --type-label-m-weight: 600;
  --type-label-m-letter-spacing: 0px;
  --type-label-m-family: var(--font-ui);
  --type-label-s-size: 0.8125rem;
  --type-label-s-line-height: 1.125rem;
  --type-label-s-weight: 600;
  --type-label-s-letter-spacing: 0px;
  --type-label-s-family: var(--font-ui);
  --type-caption-size: 0.75rem;
  --type-caption-line-height: 1rem;
  --type-caption-weight: 500;
  --type-caption-letter-spacing: 0px;
  --type-caption-family: var(--font-ui);
  --type-overline-size: 0.6875rem;
  --type-overline-line-height: 0.875rem;
  --type-overline-weight: 700;
  --type-overline-letter-spacing: 0.8px;
  --type-overline-family: var(--font-ui);
  --type-hook-l-size: 2.75rem;
  --type-hook-l-line-height: 2.625rem;
  --type-hook-l-weight: 800;
  --type-hook-l-letter-spacing: -0.5px;
  --type-hook-l-family: var(--font-display);
  --type-hook-l-variation: var(--font-variation-hook);
  --type-hook-m-size: 2.125rem;
  --type-hook-m-line-height: 2.0625rem;
  --type-hook-m-weight: 800;
  --type-hook-m-letter-spacing: -0.4px;
  --type-hook-m-family: var(--font-display);
  --type-hook-m-variation: var(--font-variation-hook);
  --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;
  --layout-screen-gutter: 16px;
  --layout-screen-gutter-large: 20px;
  --layout-large-phone-min-width: 428px;
  --layout-card-padding: 16px;
  --layout-section-gap: 24px;
  --layout-touch-target-min: 44px;
  --layout-content-max-width: 560px;
  --layout-tablet-min-width: 700px;
  --layout-tablet-page-max-width: 720px;
  --layout-sheet-max-width: 640px;
  --layout-notice-padding-v: 10px;
  --layout-short-screen: 700px;
  --size-icon-s: 16px;
  --size-icon-m: 20px;
  --size-icon-l: 24px;
  --size-icon-xl: 32px;
  --size-button-l: 48px;
  --size-button-m: 40px;
  --size-button-s: 32px;
  --size-list-row: 48px;
  --size-notice: 48px;
  --size-pill: 36px;
  --size-icon-tile: 36px;
  --size-option-tile: 56px;
  --size-scene-max: 280px;
  --size-scene-compact: 200px;
  --size-drop-dial: 200px;
  --size-cover: 136px;
  --size-call-control: 56px;
  --size-icon-button: 44px;
  --size-avatar-xs: 24px;
  --size-avatar-s: 32px;
  --size-avatar-m: 48px;
  --size-avatar-l: 72px;
  --size-avatar-xl: 96px;
  --size-badge-dot: 8px;
  --size-control-toggle-width: 52px;
  --size-control-toggle-height: 32px;
  --size-control-toggle-thumb: 26px;
  --size-control-checkbox: 24px;
  --size-control-slider-thumb: 28px;
  --size-control-slider-track: 4px;
  --size-otp-box-width: 48px;
  --size-otp-box-height: 56px;
  --size-orb-s: 48px;
  --size-orb-m: 144px;
  --size-orb-l: 200px;
  --size-orb-xl: 280px;
  --size-sheet-handle-width: 36px;
  --size-sheet-handle-height: 5px;
  --size-illustration: 120px;
  --border-width-hairline: 1px;
  --border-width-focus: 2px;
  --border-width-strong: 1.5px;
  --opacity-disabled: 0.4;
  --opacity-pressed-overlay: 0.08;
  --opacity-secondary-text: 0.72;
  --opacity-vignette: 0.4;
  --opacity-glow: 0.4;
  --radius-s: 8px;
  --radius-m: 12px;
  --radius-l: 18px;
  --radius-xl: 28px;
  --radius-full: 999px;
  --blur-fog-word: 0.032em;
  --blur-fog-locked: 4px;
  --blur-fog-photo-reference-width: 300px;
  --blur-fog-photo-proposal: 34px;
  --blur-fog-photo-voice: 18px;
  --blur-fog-photo-misted: 7px;
  --blur-fog-photo-revealed: 0px;
  --font-variation-hook: "wght" 800, "wdth" 75, "opsz" 96;
  --echo-ring-count: 5;
  --echo-gap: 0.12;
  --echo-stroke-max: 2;
  --echo-stroke-min: 0.75;
  --echo-opacity-max: 0.9;
  --echo-opacity-min: 0.14;
  --echo-wobble: 0.035;
  --echo-wobble-frequency: 3;
  --echo-phase-step: 0.7;
  --echo-sway-phase: 0.9;
  --echo-launch-intro-rings: 4;
  --echo-launch-breath-depth: 0.04;
  --echo-launch-exit-zoom: 0.06;
  --echo-launch-wobble-share: 0.06;
  --echo-ambient-settle-level: 0.3;
  --echo-field-burst-rings: 3;
  --echo-shape-edge-amplitude: 1.4;
  --echo-shape-edge-wavelength: 84;
  --echo-shape-crest-amplitude: 6;
  --echo-shape-divider-amplitude: 2;
  --echo-shape-reveal-rings: 3;
  --echo-shape-reveal-ring-gap: 18;
  --echo-shape-reveal-wobble: 10;
  --echo-shape-press-gap: 10;
  --echo-shape-cta-pulses: 2;
  --echo-shape-cta-pulse-opacity: 0.4;
  --echo-shape-progress-amplitude: 3;
  --echo-backdrop-rings: 8;
  --echo-backdrop-gap: 0.075;
  --echo-backdrop-opacity: 0.07;
  --echo-backdrop-hero-opacity: 0.16;
  --echo-backdrop-anchor-y: -0.42;
  --echo-backdrop-hero-glow: 1.35;
  --shadow-1: 0px 1px 2px 0px rgba(28, 23, 51, 0.059), 0px 1px 1px 0px rgba(28, 23, 51, 0.039);
  --shadow-2: 0px 8px 24px 0px rgba(28, 23, 51, 0.102);
  --shadow-3: 0px 16px 48px 0px rgba(28, 23, 51, 0.161);
  --motion-duration-instant: 100ms;
  --motion-duration-fast: 180ms;
  --motion-duration-base: 260ms;
  --motion-duration-slow: 420ms;
  --motion-duration-ceremony-min: 900ms;
  --motion-duration-ceremony-max: 1400ms;
  --motion-duration-stagger: 120ms;
  --motion-duration-toast: 3000ms;
  --motion-duration-spinner-delay: 300ms;
  --motion-duration-loading-pulse: 1800ms;
  --motion-duration-orb-breath: 10000ms;
  --motion-duration-orb-ripple: 3200ms;
  --motion-duration-orb-shimmer: 12000ms;
  --motion-duration-orb-turn: 25000ms;
  --motion-duration-echo-cycle: 16000ms;
  --motion-duration-undo-window: 3000ms;
  --motion-duration-drop-arrival-retry: 15000ms;
  --motion-duration-ambient-settle-after: 45000ms;
  --motion-duration-ambient-settle-fade: 3000ms;
  --motion-duration-ambient-settle-wake: 1000ms;
  --motion-duration-launch-intro-first-ring: 120ms;
  --motion-duration-launch-intro-ring-travel: 3600ms;
  --motion-duration-launch-intro-ring-stagger: 600ms;
  --motion-duration-launch-intro-loop-stagger: 1800ms;
  --motion-duration-launch-intro-breath: 2400ms;
  --motion-duration-launch-intro-glow-in: 900ms;
  --motion-duration-launch-intro-total: 1100ms;
  --motion-duration-launch-intro-exit: 300ms;
  --motion-duration-launch-intro-exit-light: 400ms;
  --motion-duration-launch-intro-still-fade: 180ms;
  --motion-duration-echo-field-first-ring: 120ms;
  --motion-duration-echo-field-ring-travel: 11000ms;
  --motion-duration-echo-field-ring-stagger: 600ms;
  --motion-duration-echo-field-loop-stagger: 2800ms;
  --motion-duration-wave-page-reveal: 320ms;
  --motion-duration-wave-page-back: 320ms;
  --motion-duration-wave-tab-switch: 240ms;
  --motion-duration-wave-press-echo: 620ms;
  --motion-duration-wave-cta-idle: 6000ms;
  --motion-duration-wave-cta-pulse: 3200ms;
  --motion-duration-wave-cascade: 300ms;
  --motion-duration-wave-cascade-stagger: 70ms;
  --motion-duration-wave-morph: 280ms;
  --motion-duration-reveal: 600ms;
  --motion-ease-standard: cubic-bezier(0.2, 0, 0, 1);
  --motion-ease-launch-ring: cubic-bezier(0.3, 0.5, 0.4, 1);
  --motion-ease-launch-fade: cubic-bezier(0.4, 0, 0.7, 0.75);
  --motion-ease-wave: cubic-bezier(0.25, 0.8, 0.3, 1);
  --motion-ease-reveal: cubic-bezier(0.215, 0.61, 0.355, 1);
}

@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --color-night-500: #5A3352;
    --color-night-600: #3B1C35;
    --color-night-700: #2A1726;
    --color-night-800: #1E111B;
    --color-night-900: #140B12;
    --color-night-950: #0C070B;
    --color-mist: #F6EEF1;
    --color-white: #FFFFFF;
    --color-nar-300: #F0587F;
    --color-nar-500: #D6335C;
    --color-nar-700: #B8264B;
    --color-haze: #B79CFF;
    --color-ai-fg: #5CD6C8;
    --color-ai-bg: rgba(92, 214, 200, 0.141);
    --color-ai-border: rgba(92, 214, 200, 0.549);
    --color-brand-100: #3A1830;
    --color-brand-500: #F0587F;
    --color-brand-600: #E24A72;
    --color-brand-text: #F47A9A;
    --color-brand-fill-end: #F59AB4;
    --color-dusk-100: #3B1C35;
    --color-dusk-700: #E6C9DC;
    --color-gold-500: #F2B85E;
    --color-bg-canvas: #140B12;
    --color-bg-surface: rgba(185, 138, 174, 0.122);
    --color-bg-raised: rgba(185, 138, 174, 0.2);
    --color-bg-sunken: rgba(10, 9, 14, 0.451);
    --color-bg-solid: #1E111B;
    --color-bg-sheet: rgba(28, 16, 25, 0.949);
    --color-border-subtle: rgba(246, 238, 241, 0.102);
    --color-border-strong: rgba(246, 238, 241, 0.239);
    --color-text-primary: #F6EEF1;
    --color-text-secondary: #C3B2BF;
    --color-text-tertiary: #927D8E;
    --color-text-on-brand: #140B12;
    --color-text-on-dusk: #140B12;
    --color-text-on-danger: #140B12;
    --color-text-on-gold: #140B12;
    --color-text-on-night: #F6EEF1;
    --color-success: #4CC99C;
    --color-warning: #F0B94A;
    --color-danger: #F58A8A;
    --color-verified: #6BA6F7;
    --color-notice-critical-bg: #392636;
    --color-notice-critical-border: rgba(245, 138, 138, 0.4);
    --color-notice-critical-fg: #F58A8A;
    --color-notice-warning-bg: #382D2D;
    --color-notice-warning-border: rgba(240, 185, 74, 0.4);
    --color-notice-warning-fg: #F0B94A;
    --color-notice-info-bg: rgba(185, 138, 174, 0.2);
    --color-notice-info-border: rgba(246, 238, 241, 0.239);
    --color-notice-info-fg: #F47A9A;
    --color-notice-ai-bg: rgba(92, 214, 200, 0.141);
    --color-notice-ai-border: rgba(92, 214, 200, 0.549);
    --color-notice-ai-fg: #5CD6C8;
    --color-topic-rose-bg: #412238;
    --color-topic-rose-fg: #F47A9A;
    --color-topic-amber-bg: #413032;
    --color-topic-amber-fg: #F7C08A;
    --color-topic-sea-bg: #243345;
    --color-topic-sea-fg: #8FD6E1;
    --color-topic-lilac-bg: #423D55;
    --color-topic-lilac-fg: #E6C9DC;
    --color-topic-mint-bg: #23363D;
    --color-topic-mint-fg: #8BE0C0;
    --color-overlay-scrim: rgba(5, 4, 8, 0.722);
    --color-skeleton-base: rgba(246, 238, 241, 0.102);
    --color-skeleton-highlight: rgba(185, 138, 174, 0.2);
    --gradient-night: radial-gradient(circle at 50% 32.5%, #3B1C35 0%, #24121F 55%, #140B12 100%);
    --gradient-accent: linear-gradient(135deg, #F6EEF1 0%, #F0587F 100%);
    --gradient-ring: linear-gradient(135deg, #F6EEF1 0%, #F0587F 100%);
    --gradient-brand: radial-gradient(circle at 50% 45%, #3B1C35 0%, #140B12 100%);
    --gradient-backdrop: radial-gradient(circle at 50% 19%, #3B1C35 0%, #25131F 45%, #140B12 100%);
    --gradient-brand-fill: linear-gradient(135deg, #F0587F 0%, #F59AB4 100%);
    --gradient-haze: radial-gradient(circle at 50% 50%, rgba(240, 88, 127, 0.349) 0%, rgba(183, 156, 255, 0) 100%);
    --shadow-1: none;
    --shadow-2: none;
    --shadow-3: none;
  }
}

:root[data-theme="dark"] {
  --color-night-500: #5A3352;
  --color-night-600: #3B1C35;
  --color-night-700: #2A1726;
  --color-night-800: #1E111B;
  --color-night-900: #140B12;
  --color-night-950: #0C070B;
  --color-mist: #F6EEF1;
  --color-white: #FFFFFF;
  --color-nar-300: #F0587F;
  --color-nar-500: #D6335C;
  --color-nar-700: #B8264B;
  --color-haze: #B79CFF;
  --color-ai-fg: #5CD6C8;
  --color-ai-bg: rgba(92, 214, 200, 0.141);
  --color-ai-border: rgba(92, 214, 200, 0.549);
  --color-brand-100: #3A1830;
  --color-brand-500: #F0587F;
  --color-brand-600: #E24A72;
  --color-brand-text: #F47A9A;
  --color-brand-fill-end: #F59AB4;
  --color-dusk-100: #3B1C35;
  --color-dusk-700: #E6C9DC;
  --color-gold-500: #F2B85E;
  --color-bg-canvas: #140B12;
  --color-bg-surface: rgba(185, 138, 174, 0.122);
  --color-bg-raised: rgba(185, 138, 174, 0.2);
  --color-bg-sunken: rgba(10, 9, 14, 0.451);
  --color-bg-solid: #1E111B;
  --color-bg-sheet: rgba(28, 16, 25, 0.949);
  --color-border-subtle: rgba(246, 238, 241, 0.102);
  --color-border-strong: rgba(246, 238, 241, 0.239);
  --color-text-primary: #F6EEF1;
  --color-text-secondary: #C3B2BF;
  --color-text-tertiary: #927D8E;
  --color-text-on-brand: #140B12;
  --color-text-on-dusk: #140B12;
  --color-text-on-danger: #140B12;
  --color-text-on-gold: #140B12;
  --color-text-on-night: #F6EEF1;
  --color-success: #4CC99C;
  --color-warning: #F0B94A;
  --color-danger: #F58A8A;
  --color-verified: #6BA6F7;
  --color-notice-critical-bg: #392636;
  --color-notice-critical-border: rgba(245, 138, 138, 0.4);
  --color-notice-critical-fg: #F58A8A;
  --color-notice-warning-bg: #382D2D;
  --color-notice-warning-border: rgba(240, 185, 74, 0.4);
  --color-notice-warning-fg: #F0B94A;
  --color-notice-info-bg: rgba(185, 138, 174, 0.2);
  --color-notice-info-border: rgba(246, 238, 241, 0.239);
  --color-notice-info-fg: #F47A9A;
  --color-notice-ai-bg: rgba(92, 214, 200, 0.141);
  --color-notice-ai-border: rgba(92, 214, 200, 0.549);
  --color-notice-ai-fg: #5CD6C8;
  --color-topic-rose-bg: #412238;
  --color-topic-rose-fg: #F47A9A;
  --color-topic-amber-bg: #413032;
  --color-topic-amber-fg: #F7C08A;
  --color-topic-sea-bg: #243345;
  --color-topic-sea-fg: #8FD6E1;
  --color-topic-lilac-bg: #423D55;
  --color-topic-lilac-fg: #E6C9DC;
  --color-topic-mint-bg: #23363D;
  --color-topic-mint-fg: #8BE0C0;
  --color-overlay-scrim: rgba(5, 4, 8, 0.722);
  --color-skeleton-base: rgba(246, 238, 241, 0.102);
  --color-skeleton-highlight: rgba(185, 138, 174, 0.2);
  --gradient-night: radial-gradient(circle at 50% 32.5%, #3B1C35 0%, #24121F 55%, #140B12 100%);
  --gradient-accent: linear-gradient(135deg, #F6EEF1 0%, #F0587F 100%);
  --gradient-ring: linear-gradient(135deg, #F6EEF1 0%, #F0587F 100%);
  --gradient-brand: radial-gradient(circle at 50% 45%, #3B1C35 0%, #140B12 100%);
  --gradient-backdrop: radial-gradient(circle at 50% 19%, #3B1C35 0%, #25131F 45%, #140B12 100%);
  --gradient-brand-fill: linear-gradient(135deg, #F0587F 0%, #F59AB4 100%);
  --gradient-haze: radial-gradient(circle at 50% 50%, rgba(240, 88, 127, 0.349) 0%, rgba(183, 156, 255, 0) 100%);
  --shadow-1: none;
  --shadow-2: none;
  --shadow-3: none;
}

@media (prefers-reduced-motion: reduce) {
  :root {
    --motion-duration-instant: 0ms;
    --motion-duration-fast: 0ms;
    --motion-duration-base: 0ms;
    --motion-duration-slow: 0ms;
    --motion-duration-ceremony-min: 0ms;
    --motion-duration-ceremony-max: 0ms;
    --motion-duration-stagger: 0ms;
    --motion-duration-toast: 0ms;
    --motion-duration-spinner-delay: 0ms;
    --motion-duration-loading-pulse: 0ms;
    --motion-duration-orb-breath: 0ms;
    --motion-duration-orb-ripple: 0ms;
    --motion-duration-orb-shimmer: 0ms;
    --motion-duration-orb-turn: 0ms;
    --motion-duration-echo-cycle: 0ms;
    --motion-duration-undo-window: 0ms;
    --motion-duration-drop-arrival-retry: 0ms;
    --motion-duration-ambient-settle-after: 0ms;
    --motion-duration-ambient-settle-fade: 0ms;
    --motion-duration-ambient-settle-wake: 0ms;
    --motion-duration-launch-intro-first-ring: 0ms;
    --motion-duration-launch-intro-ring-travel: 0ms;
    --motion-duration-launch-intro-ring-stagger: 0ms;
    --motion-duration-launch-intro-loop-stagger: 0ms;
    --motion-duration-launch-intro-breath: 0ms;
    --motion-duration-launch-intro-glow-in: 0ms;
    --motion-duration-launch-intro-total: 0ms;
    --motion-duration-launch-intro-exit: 0ms;
    --motion-duration-launch-intro-exit-light: 0ms;
    --motion-duration-launch-intro-still-fade: 0ms;
    --motion-duration-echo-field-first-ring: 0ms;
    --motion-duration-echo-field-ring-travel: 0ms;
    --motion-duration-echo-field-ring-stagger: 0ms;
    --motion-duration-echo-field-loop-stagger: 0ms;
    --motion-duration-wave-page-reveal: 0ms;
    --motion-duration-wave-page-back: 0ms;
    --motion-duration-wave-tab-switch: 0ms;
    --motion-duration-wave-press-echo: 0ms;
    --motion-duration-wave-cta-idle: 0ms;
    --motion-duration-wave-cta-pulse: 0ms;
    --motion-duration-wave-cascade: 0ms;
    --motion-duration-wave-cascade-stagger: 0ms;
    --motion-duration-wave-morph: 0ms;
    --motion-duration-reveal: 0ms;
  }
}

.night {
  --color-night-500: #5A3352;
  --color-night-600: #3B1C35;
  --color-night-700: #2A1726;
  --color-night-800: #1E111B;
  --color-night-900: #140B12;
  --color-night-950: #0C070B;
  --color-mist: #F6EEF1;
  --color-white: #FFFFFF;
  --color-nar-300: #F0587F;
  --color-nar-500: #D6335C;
  --color-nar-700: #B8264B;
  --color-haze: #B79CFF;
  --color-ai-fg: #5CD6C8;
  --color-ai-bg: rgba(92, 214, 200, 0.141);
  --color-ai-border: rgba(92, 214, 200, 0.549);
  --color-brand-100: #3A1830;
  --color-brand-500: #F0587F;
  --color-brand-600: #E24A72;
  --color-brand-text: #F47A9A;
  --color-brand-fill-end: #F59AB4;
  --color-dusk-100: #3B1C35;
  --color-dusk-700: #E6C9DC;
  --color-gold-500: #F2B85E;
  --color-bg-canvas: #140B12;
  --color-bg-surface: rgba(185, 138, 174, 0.122);
  --color-bg-raised: rgba(185, 138, 174, 0.2);
  --color-bg-sunken: rgba(10, 9, 14, 0.451);
  --color-bg-solid: #1E111B;
  --color-bg-sheet: rgba(28, 16, 25, 0.949);
  --color-border-subtle: rgba(246, 238, 241, 0.102);
  --color-border-strong: rgba(246, 238, 241, 0.239);
  --color-text-primary: #F6EEF1;
  --color-text-secondary: #C3B2BF;
  --color-text-tertiary: #927D8E;
  --color-text-on-brand: #140B12;
  --color-text-on-dusk: #140B12;
  --color-text-on-danger: #140B12;
  --color-text-on-gold: #140B12;
  --color-text-on-night: #F6EEF1;
  --color-success: #4CC99C;
  --color-warning: #F0B94A;
  --color-danger: #F58A8A;
  --color-verified: #6BA6F7;
  --color-notice-critical-bg: #392636;
  --color-notice-critical-border: rgba(245, 138, 138, 0.4);
  --color-notice-critical-fg: #F58A8A;
  --color-notice-warning-bg: #382D2D;
  --color-notice-warning-border: rgba(240, 185, 74, 0.4);
  --color-notice-warning-fg: #F0B94A;
  --color-notice-info-bg: rgba(185, 138, 174, 0.2);
  --color-notice-info-border: rgba(246, 238, 241, 0.239);
  --color-notice-info-fg: #F47A9A;
  --color-notice-ai-bg: rgba(92, 214, 200, 0.141);
  --color-notice-ai-border: rgba(92, 214, 200, 0.549);
  --color-notice-ai-fg: #5CD6C8;
  --color-topic-rose-bg: #412238;
  --color-topic-rose-fg: #F47A9A;
  --color-topic-amber-bg: #413032;
  --color-topic-amber-fg: #F7C08A;
  --color-topic-sea-bg: #243345;
  --color-topic-sea-fg: #8FD6E1;
  --color-topic-lilac-bg: #423D55;
  --color-topic-lilac-fg: #E6C9DC;
  --color-topic-mint-bg: #23363D;
  --color-topic-mint-fg: #8BE0C0;
  --color-overlay-scrim: rgba(5, 4, 8, 0.722);
  --color-skeleton-base: rgba(246, 238, 241, 0.102);
  --color-skeleton-highlight: rgba(185, 138, 174, 0.2);
  --gradient-night: radial-gradient(circle at 50% 32.5%, #3B1C35 0%, #24121F 55%, #140B12 100%);
  --gradient-accent: linear-gradient(135deg, #F6EEF1 0%, #F0587F 100%);
  --gradient-ring: linear-gradient(135deg, #F6EEF1 0%, #F0587F 100%);
  --gradient-brand: radial-gradient(circle at 50% 45%, #3B1C35 0%, #140B12 100%);
  --gradient-backdrop: radial-gradient(circle at 50% 19%, #3B1C35 0%, #25131F 45%, #140B12 100%);
  --gradient-brand-fill: linear-gradient(135deg, #F0587F 0%, #F59AB4 100%);
  --gradient-haze: radial-gradient(circle at 50% 50%, rgba(240, 88, 127, 0.349) 0%, rgba(183, 156, 255, 0) 100%);
  --shadow-1: none;
  --shadow-2: none;
  --shadow-3: none;
  color: var(--color-text-primary);
}
/* Dove landing, v2 "Önce kalbiyle tanış" (docs/v2/marka.md §8). Sizes, radii and durations come from
   packages/design-tokens (tokens.css is concatenated in front of this file at build time), including the v2
   "erik gecesi" palette (docs/v2/marka.md §9, landed in tokens.json).
   Metaphor: buğu → açılış. Something is always misted, something sharp; nar is the one hero colour; leylak only
   inside blur fields; deniz only for the "Yapay zekâ" label and Dove Characters; kehribar only for Gold. */

@font-face {
  font-family: 'Bricolage Grotesque';
  src: url('/assets/fonts/bricolage-grotesque.woff2') format('woff2');
  font-weight: 700 800;
  font-stretch: 75% 100%;
  font-display: swap;
}
@font-face {
  font-family: 'Plus Jakarta Sans';
  src: url('/assets/fonts/plus-jakarta-sans.woff2') format('woff2');
  font-weight: 400 700;
  font-display: swap;
}

/* ---------- v2 palette (docs/v2/marka.md §8.3 + §9) ----------
   The erik-gecesi token values now come from packages/design-tokens (dark block → .night). Left here: the site's
   brand-text choice (full nar instead of the app's softer #F47A9A link pink) and short brand aliases. */
html.night {
  --color-brand-text: #F0587F;
  --nar: #F0587F;
  --nar-deep: #D6335C;
  --leylak: #B79CFF;
  --deniz: #5CD6C8;
  --kehribar: #F2B85E;
  --ink-text: #22121F;
}

:root {
  color-scheme: dark;
  --web-max: calc(var(--layout-content-max-width) * 2);
  --web-text: calc(var(--layout-content-max-width) * 1.3);
  --web-gutter: var(--layout-screen-gutter);
  --web-section: var(--space-16);
  --web-hook: clamp(3.1rem, 1.5rem + 7.2vw, 6.6rem);
  --web-h2: clamp(2.3rem, 1.3rem + 3.8vw, 4.2rem);
  --web-lead: clamp(var(--type-body-l-size), 0.9rem + 0.45vw, var(--type-title-m-size));
  --header-h: calc(var(--size-button-l) + var(--space-4));
  --glass: var(--color-bg-surface);
  --line: var(--color-border-subtle);
  --reveal-time: calc(var(--motion-duration-slow) * 2);
  --open-time: 600ms; /* motion.reveal (marka.md §9): blur lifts in 0.6 s */
}
@media (min-width: 428px) { :root { --web-gutter: var(--layout-screen-gutter-large); } }
@media (min-width: 960px) { :root { --web-gutter: var(--space-10); --web-section: calc(var(--space-16) * 1.5); } }

*, *::before, *::after { box-sizing: border-box; }
html { -webkit-text-size-adjust: 100%; scroll-padding-top: calc(var(--header-h) + var(--space-4)); background: var(--color-bg-canvas); }
@media (prefers-reduced-motion: no-preference) { html { scroll-behavior: smooth; } }
body {
  margin: 0; position: relative;
  background: var(--color-bg-canvas);
  color: var(--color-text-primary);
  font-family: var(--font-ui);
  font-size: var(--type-body-l-size);
  line-height: var(--type-body-l-line-height);
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
  overflow-x: hidden;
}
body.page::before {
  content: ''; position: absolute; z-index: -1; pointer-events: none; inset: 0 0 auto; height: 70vh;
  background: radial-gradient(55% 60% at 18% 0%, color-mix(in srgb, var(--color-night-600) 90%, transparent), transparent 70%),
    radial-gradient(40% 50% at 90% 0%, color-mix(in srgb, var(--nar) 14%, transparent), transparent 70%);
}
img, svg { display: block; max-width: 100%; }
a { color: var(--color-brand-text); text-underline-offset: 0.18em; text-decoration-thickness: var(--border-width-hairline); }
a:hover { text-decoration-thickness: var(--border-width-focus); }
:focus-visible { outline: var(--border-width-focus) solid var(--color-mist); outline-offset: var(--space-1); border-radius: var(--radius-s); }
h1, h2, h3 { font-family: var(--font-display); margin: 0; text-wrap: balance; }
p { margin: 0; }
strong { font-weight: 700; }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.nowrap { white-space: nowrap; }
.disp { font-family: var(--font-display); font-weight: 700; }

.skip {
  position: absolute; left: var(--space-4); top: calc(-1 * var(--space-16)); z-index: 10;
  background: var(--color-bg-solid); color: var(--color-text-primary); padding: var(--space-2) var(--space-4);
  border-radius: var(--radius-full); font-weight: 600;
}
.skip:focus { top: var(--space-2); }

.wrap { width: 100%; max-width: calc(var(--web-max) + 2 * var(--web-gutter)); margin: 0 auto; padding: 0 var(--web-gutter); }
.narrow { max-width: calc(var(--web-text) + 2 * var(--web-gutter)); }

.overline {
  font-family: var(--font-ui); font-size: var(--type-overline-size); line-height: var(--type-overline-line-height);
  font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: var(--space-3);
}
/* Kanca başlığı: Bricolage 800, condensed (wdth 75), tight leading (marka.md §8.4). */
.hook, .hook-h { font-family: var(--font-display); font-weight: 800; font-stretch: 75%; line-height: 0.94; letter-spacing: -0.012em; }
.accent { color: var(--nar); }
/* Buğulu kelime: readable but "not yet"; clears to nar on the açılış (site.js, once, respects reduced motion). */
.fog { display: inline-block; filter: blur(0.032em); opacity: 0.82; transition: filter var(--open-time) cubic-bezier(0.33, 1, 0.68, 1), opacity var(--open-time), color var(--open-time); }
.fog.is-open { filter: none; opacity: 1; color: var(--nar); }
@media (forced-colors: active) { .fog { filter: none; opacity: 1; } }
.lead { font-size: var(--web-lead); line-height: 1.6; color: var(--color-text-secondary); max-width: 60ch; }
.muted { color: var(--color-text-secondary); }
.small { font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); }

/* ---------- header ---------- */
.site-header {
  position: sticky; top: 0; z-index: 5;
  background: color-mix(in srgb, var(--color-bg-canvas) 74%, transparent);
  border-bottom: var(--border-width-hairline) solid var(--line);
  -webkit-backdrop-filter: saturate(1.3) blur(var(--space-4)); backdrop-filter: saturate(1.3) blur(var(--space-4));
}
.site-header .wrap { display: flex; align-items: center; gap: var(--space-4); min-height: var(--header-h); }
.brand { display: inline-flex; align-items: center; gap: var(--space-2); color: var(--color-text-primary); text-decoration: none; min-height: var(--layout-touch-target-min); }
.brand svg { width: calc(var(--size-icon-xl) * 1.1); height: auto; fill: currentColor; }
.brand span { font-family: var(--font-display); font-weight: 700; font-size: var(--type-title-l-size); letter-spacing: -0.01em; line-height: 1; }
.site-nav { display: none; margin-left: auto; gap: var(--space-1); }
.site-nav a {
  color: var(--color-text-secondary); text-decoration: none; font-weight: 600; font-size: var(--type-label-m-size);
  padding: var(--space-2) var(--space-3); border-radius: var(--radius-full); min-height: var(--layout-touch-target-min); display: inline-flex; align-items: center;
}
.site-nav a:hover { color: var(--color-text-primary); background: var(--glass); }
.header-actions { margin-left: auto; display: flex; align-items: center; gap: var(--space-2); }
.site-nav + .header-actions { margin-left: var(--space-2); }
.lang {
  color: var(--color-text-primary); text-decoration: none; font-weight: 700; font-size: var(--type-label-s-size); letter-spacing: var(--type-overline-letter-spacing);
  min-width: var(--layout-touch-target-min); min-height: var(--size-button-m); padding: 0 var(--space-3); display: inline-flex; align-items: center; justify-content: center;
  border-radius: var(--radius-full); border: var(--border-width-hairline) solid var(--line);
}
.lang:hover { background: var(--glass); }
@media (min-width: 1060px) { .site-nav { display: flex; } }

/* ---------- buttons & badges ---------- */
.btn {
  display: inline-flex; align-items: center; justify-content: center; gap: var(--space-2);
  min-height: var(--size-button-l); padding: 0 var(--space-5); border-radius: var(--radius-full);
  font-weight: 700; font-size: var(--type-label-m-size); text-decoration: none; border: 0; cursor: pointer; font-family: var(--font-ui);
}
.btn svg { width: var(--size-icon-m); height: var(--size-icon-m); flex: none; }
.btn-s { min-height: var(--size-button-m); padding: 0 var(--space-4); }
.btn-primary { background: var(--nar); color: var(--color-text-on-brand); }
.btn-primary:hover { filter: brightness(1.06); text-decoration: none; }
.btn-ghost { background: transparent; color: var(--color-text-primary); border: var(--border-width-hairline) solid var(--color-border-strong); }
.btn-ghost:hover { background: var(--glass); }
.badges { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3); }
.badges a { display: inline-block; border-radius: var(--radius-s); line-height: 0; }
.badges img { height: calc(var(--size-button-l) * 1.15); width: auto; }

/* ---------- buğu field (replaces the v1 Yankı rings) ---------- */
.fog-field { position: absolute; inset: 0; overflow: hidden; z-index: -1; pointer-events: none; }
.fog-field i { position: absolute; border-radius: 50%; filter: blur(70px); opacity: 0.55; }
.fog-field i:nth-child(1) { width: 60vmax; height: 60vmax; left: -20vmax; top: -25vmax; background: var(--color-night-600); opacity: 0.9; }
.fog-field i:nth-child(2) { width: 42vmax; height: 42vmax; right: -14vmax; top: 10%; background: var(--nar-deep); opacity: 0.32; }
.fog-field i:nth-child(3) { width: 36vmax; height: 36vmax; left: 20%; bottom: -24vmax; background: var(--leylak); opacity: 0.18; }

/* ---------- hero ---------- */
.hero { position: relative; isolation: isolate; overflow: hidden; }
.hero-photo { position: absolute; inset: 0 0 auto; height: min(70vh, 620px); z-index: -2; }
.hero-photo img { width: 100%; height: 100%; object-fit: cover; object-position: 68% 50%; opacity: 0.6; }
.hero-photo::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, color-mix(in srgb, var(--color-bg-canvas) 35%, transparent) 0%, var(--color-bg-canvas) 100%); }
.hero .fog-field i:nth-child(1) { display: none; }
.hero .fog-field i:nth-child(2) { opacity: 0.22; }
.hero-grid { position: relative; display: grid; gap: var(--space-12); padding-top: var(--space-12); padding-bottom: var(--space-16); }
.hero-copy { position: relative; z-index: 1; display: grid; gap: var(--space-6); align-content: center; }
.hero-copy .overline { margin: 0; color: var(--color-text-secondary); }
.hero h1 { font-size: var(--web-hook); max-width: 11ch; }
.hero-links { display: flex; flex-wrap: wrap; align-items: center; gap: var(--space-3) var(--space-5); }
.hero-note { display: flex; align-items: center; gap: var(--space-2); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); color: var(--color-text-secondary); }
.hero-note svg { width: var(--size-icon-m); height: var(--size-icon-m); color: var(--color-verified); flex: none; }
.hero-stage { margin: 0; display: grid; place-items: center; }
.hero-stage .mock { width: min(78vw, 340px); rotate: -3deg; }
@media (min-width: 960px) {
  .hero-photo { height: 100%; inset: 0; }
  .hero-photo img { opacity: 0.85; }
  .hero-photo::after { background: linear-gradient(90deg, var(--color-bg-canvas) 0%, color-mix(in srgb, var(--color-bg-canvas) 82%, transparent) 42%, color-mix(in srgb, var(--color-bg-canvas) 20%, transparent) 75%, color-mix(in srgb, var(--color-bg-canvas) 55%, transparent) 100%), linear-gradient(180deg, transparent 70%, var(--color-bg-canvas)); }
  .hero-grid { grid-template-columns: 1.15fr 0.85fr; align-items: center; min-height: min(calc(100vh - var(--header-h)), 860px); padding-top: var(--space-10); }
}

/* ---------- code-drawn phone mockups (1em = 16 px at a 390 px wide screen) ---------- */
.mock {
  container-type: inline-size; position: relative; width: min(100%, 340px); margin: 0 auto; padding: 9px;
  border-radius: 46px; background: #07040A;
  box-shadow: 0 0 0 1.5px #3A2A36, 0 50px 90px -30px rgba(0, 0, 0, 0.7), 0 30px 120px -50px color-mix(in srgb, var(--nar) 60%, transparent);
}
.scr {
  position: relative; font-size: calc(100cqw / 24.4); aspect-ratio: 390 / 812; border-radius: 2.35em; overflow: hidden;
  display: flex; flex-direction: column; gap: 0.75em; padding: 3.6em 1.4em 1.4em; line-height: 1.35;
  background: radial-gradient(90% 50% at 10% 0%, #3B1C35, transparent 70%), radial-gradient(60% 40% at 100% 30%, rgba(240, 88, 127, 0.1), transparent), var(--color-bg-canvas);
  color: var(--color-mist); text-align: left;
}
.scr p { margin: 0; }
.scr svg { flex: none; }
.notch { position: absolute; top: 0.7em; left: 50%; translate: -50% 0; width: 7.4em; height: 2.1em; border-radius: 1.05em; background: #000; }
.m-eyebrow { font-size: 0.78em; font-weight: 700; letter-spacing: 0.14em; color: var(--color-text-tertiary); text-transform: uppercase; }
.m-top, .m-row { display: flex; justify-content: space-between; align-items: center; gap: 0.6em; }
.m-row { align-items: flex-end; }
.m-dim { font-size: 0.8em; font-weight: 700; color: var(--color-text-secondary); }
.m-nick { font-family: var(--font-display); font-weight: 700; font-size: 2.1em; line-height: 1; letter-spacing: -0.02em; }
.m-nick.sm { font-size: 1.4em; display: flex; align-items: center; gap: 0.45em; flex-wrap: wrap; }
.m-nick.sm .ai-pill { font-size: 0.5em; }
.m-meta { font-size: 0.85em; color: var(--color-text-secondary); margin-top: 0.3em; }
.m-ver { display: inline-flex; align-items: center; gap: 0.25em; color: var(--color-verified); font-weight: 700; white-space: nowrap; }
.m-ver svg { width: 1.15em; height: 1.15em; }
.m-score { text-align: right; }
.m-score b { display: block; font-family: var(--font-display); font-size: 2.1em; line-height: 1; color: var(--nar); }
.m-score span { font-size: 0.75em; color: var(--color-text-tertiary); font-weight: 600; }
.m-photo, .m-card {
  position: relative; overflow: hidden; border-radius: 1.6em;
  background: radial-gradient(60% 60% at 28% 25%, rgba(240, 88, 127, 0.5), transparent 70%), radial-gradient(60% 60% at 82% 82%, rgba(183, 156, 255, 0.42), transparent 70%), var(--color-night-700);
}
.m-photo { height: 17em; flex: none; }
.m-blur { position: absolute; left: 50%; bottom: -1.2em; width: 72%; translate: -50% 0; filter: blur(var(--b, 20px)); }
.m-blur svg { width: 100%; height: auto; }
.m-pill { position: absolute; left: 0.9em; bottom: 0.9em; display: inline-flex; align-items: center; gap: 0.4em; padding: 0.45em 0.8em; border-radius: 1em; background: rgba(20, 11, 18, 0.58); font-size: 0.8em; font-weight: 600; }
.m-pill svg { width: 1.1em; height: 1.1em; }
.m-reasons { list-style: none; margin: -0.3em 0 0; padding: 0; }
.m-reasons li { display: flex; gap: 0.7em; padding: 0.62em 0; border-top: 1px solid rgba(246, 238, 241, 0.08); font-size: 0.9em; line-height: 1.4; }
.m-reasons svg { width: 1.15em; height: 1.15em; color: var(--nar); margin-top: 0.1em; }
.m-actions { margin-top: auto; display: flex; gap: 0.6em; }
.m-actions.col { flex-direction: column; }
.m-btn {
  flex: 1; min-height: 3.4em; border-radius: 1.7em; display: inline-flex; align-items: center; justify-content: center; gap: 0.45em; padding: 0 1em;
  background: var(--nar); color: var(--color-bg-canvas); font: 700 0.95em/1 var(--font-ui); white-space: nowrap; border: 0;
}
.m-btn svg { width: 1.15em; height: 1.15em; }
.m-btn.ghost { flex: 0 0 30%; background: transparent; border: 1.5px solid rgba(246, 238, 241, 0.22); color: var(--color-mist); }
.m-bar { padding: 0.85em 1em; border-radius: 1.4em; background: rgba(246, 238, 241, 0.05); border: 1px solid rgba(246, 238, 241, 0.08); }
.m-bar-top { display: flex; justify-content: space-between; align-items: baseline; font-size: 0.82em; font-weight: 700; }
.m-bar-top b { font-family: var(--font-display); font-size: 1.5em; color: var(--nar); }
.m-track { height: 0.38em; border-radius: 0.2em; background: rgba(246, 238, 241, 0.12); overflow: hidden; margin: 0.5em 0 0.65em; }
.m-track i { display: block; height: 100%; background: var(--nar); border-radius: inherit; transition: width var(--open-time) ease-out; }
.m-dots { display: flex; justify-content: space-between; }
.m-dots span { width: 1.9em; height: 1.9em; border-radius: 50%; display: grid; place-items: center; border: 1.5px solid rgba(246, 238, 241, 0.13); color: var(--color-text-tertiary); transition: background var(--open-time), color var(--open-time); }
.m-dots span.on { background: var(--nar); border-color: var(--nar); color: var(--color-bg-canvas); }
.m-dots span.next { border-style: dashed; border-color: var(--nar); color: var(--nar); }
.m-dots svg { width: 0.95em; height: 0.95em; }
.m-chips { display: flex; flex-wrap: wrap; gap: 0.5em; }
.m-chip { display: inline-flex; align-items: center; gap: 0.45em; min-height: 2.3em; padding: 0 0.9em 0 0.65em; border-radius: 1.15em; background: rgba(246, 238, 241, 0.06); border: 1px solid rgba(246, 238, 241, 0.14); font-size: 0.88em; font-weight: 600; }
.m-chip svg { width: 1.05em; height: 1.05em; color: var(--color-text-tertiary); }
.m-chip .k { opacity: 0.72; }
.m-chip .v { font-weight: 700; filter: blur(4px); opacity: 0.8; transition: filter var(--open-time), opacity var(--open-time); }
.m-chip.open { background: rgba(240, 88, 127, 0.14); border-color: rgba(240, 88, 127, 0.5); }
.m-chip.open svg { color: var(--nar); }
.m-chip.open .v { filter: none; opacity: 1; }
.m-title { font-family: var(--font-display); font-weight: 700; font-size: 1.85em; line-height: 1.06; letter-spacing: -0.015em; }
.m-sub { display: flex; flex-wrap: wrap; align-items: center; gap: 0.5em; font-size: 0.85em; color: var(--color-text-secondary); }
.m-count { display: inline-flex; align-items: center; gap: 0.35em; padding: 0.35em 0.75em; border-radius: 1em; background: rgba(240, 88, 127, 0.16); border: 1px solid rgba(240, 88, 127, 0.45); color: var(--nar); font-weight: 700; }
.m-count svg { width: 1em; height: 1em; }
.m-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 0.6em; }
.m-card { height: 12.5em; border-radius: 1.3em; }
.m-card .m-blur { width: 88%; }
.m-lock { position: absolute; left: 0.6em; top: 0.6em; display: inline-flex; align-items: center; gap: 0.3em; padding: 0.3em 0.55em; border-radius: 0.9em; background: rgba(20, 11, 18, 0.58); font-size: 0.75em; }
.m-lock svg { width: 1em; height: 1em; }
.m-lock b { font-family: var(--font-display); color: var(--nar); font-size: 1.15em; }
.m-card.empty { background: none; border: 1.5px dashed rgba(246, 238, 241, 0.16); display: grid; place-items: center; }
.m-card.empty svg { width: 40%; fill: rgba(246, 238, 241, 0.16); }

/* "Yapay zekâ" label (marka.md §8.6): deniz pill with the Lucide bot icon, never on a person. */
.ai-pill {
  display: inline-flex; align-items: center; gap: 0.3em; padding: 0.35em 0.7em 0.35em 0.55em; border-radius: 1em;
  background: rgba(92, 214, 200, 0.14); border: 1px solid rgba(92, 214, 200, 0.55); color: var(--deniz);
  font: 700 0.75rem/1 var(--font-ui); letter-spacing: 0.02em; white-space: nowrap; font-stretch: normal;
}
.ai-pill svg { width: 1.2em; height: 1.2em; }
.ai-pill.solid { background: var(--deniz); border-color: var(--deniz); color: var(--color-bg-canvas); }

/* ---------- sections ---------- */
.section { padding: var(--web-section) 0; position: relative; }
.section-head { display: grid; gap: var(--space-4); margin-bottom: var(--space-10); max-width: var(--web-text); }
.section-head .overline { margin: 0; }
.section-head h2 { font-size: var(--web-h2); }
.section-head.center { margin-left: auto; margin-right: auto; text-align: center; justify-items: center; }
.backdrop { background: linear-gradient(to bottom, transparent, color-mix(in srgb, var(--color-night-800) 70%, transparent) 14%, color-mix(in srgb, var(--color-night-800) 70%, transparent) 86%, transparent); }
.card { background: var(--glass); border: var(--border-width-hairline) solid var(--line); border-radius: calc(var(--radius-l) * 1.33); padding: var(--space-6); }
.badge {
  width: calc(var(--size-icon-tile) * 1.22); height: calc(var(--size-icon-tile) * 1.22); border-radius: calc(var(--radius-m) * 1.2);
  display: grid; place-items: center; flex: none; background: color-mix(in srgb, var(--nar) 16%, transparent); color: var(--nar);
}
.badge svg { width: var(--size-icon-m); height: var(--size-icon-m); }
.badge.verified { background: color-mix(in srgb, var(--color-verified) 16%, transparent); color: var(--color-verified); }
.badge.ai { background: rgba(92, 214, 200, 0.14); color: var(--deniz); }

/* how it works: three steps with a small piece of real UI each */
.steps3 { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-4); }
.step3 { display: grid; gap: var(--space-5); align-content: start; padding: var(--space-5); }
.step3-copy { display: grid; gap: var(--space-2); }
.step3 .overline { margin: 0; display: flex; align-items: center; gap: var(--space-2); color: var(--nar); }
.step-no { font-family: var(--font-display); font-weight: 800; font-stretch: 75%; font-size: 1.6em; letter-spacing: 0; color: var(--color-text-primary); }
.step3 h3 { font-size: var(--type-title-l-size); line-height: 1.15; letter-spacing: -0.01em; }
.step3 p:not(.overline) { color: var(--color-text-secondary); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); }
.art {
  min-height: 220px; border-radius: calc(var(--radius-l) * 1.1); display: grid; place-items: center; overflow: hidden; padding: var(--space-5); font-size: 15px;
  background: radial-gradient(60% 70% at 15% 10%, color-mix(in srgb, var(--nar) 22%, transparent), transparent 70%), radial-gradient(60% 70% at 90% 90%, color-mix(in srgb, var(--leylak) 18%, transparent), transparent 70%), var(--color-night-800);
}
.art-portrait .paper { width: min(100%, 300px); padding: 16px 18px; border-radius: 16px; background: var(--color-mist); color: var(--ink-text); rotate: -2deg; box-shadow: 0 20px 40px -12px rgba(0, 0, 0, 0.5); display: grid; gap: 8px; font-size: 13.5px; line-height: 1.45; }
.step3 .art-portrait .paper p { color: var(--ink-text); font-size: 13.5px; line-height: 1.45; }
.art-portrait .lbl { display: inline-flex; align-items: center; gap: 6px; font-weight: 700; color: var(--nar-deep); font-size: 12px; letter-spacing: 0.08em; text-transform: uppercase; }
.art-portrait .lbl svg, .art-portrait .ok svg { width: 15px; height: 15px; }
.art-portrait .ok { justify-self: end; display: inline-flex; align-items: center; gap: 6px; padding: 6px 12px; border-radius: 999px; background: var(--nar-deep); color: #fff; font-weight: 700; font-size: 12.5px; }
.art-discovery { display: grid; gap: 14px; align-content: center; }
.art-discovery .m-bar { width: min(100%, 320px); }
.art-reveal { display: grid; gap: 14px; justify-items: center; }
.ring-face { width: 100%; height: 100%; display: grid; place-items: end center; background: var(--color-night-700); }
.mini-actions { display: flex; gap: 8px; font-size: 12px; width: min(100%, 260px); }
.mini-actions .m-btn { min-height: 34px; }
.mini-actions .m-btn.ghost { flex: 0 0 44%; }
@media (min-width: 960px) { .steps3 { grid-template-columns: repeat(3, 1fr); } }

/* discovery: the ladder + the playable demo */
.disc { display: grid; gap: var(--space-12); align-items: start; }
.ladder { list-style: none; margin: 0; padding: 0; display: grid; position: relative; }
.ladder::before { content: ''; position: absolute; left: 21px; top: 22px; bottom: 22px; width: 2px; background: linear-gradient(var(--nar) 0 22%, rgba(246, 238, 241, 0.12) 22%); }
.ladder li { position: relative; display: grid; grid-template-columns: 44px 1fr; column-gap: var(--space-4); align-items: center; padding: var(--space-2) 0; }
.ladder .dot { grid-row: span 2; width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: var(--color-bg-canvas); border: 1.5px solid rgba(246, 238, 241, 0.16); color: var(--color-text-tertiary); }
.ladder .dot svg { width: 20px; height: 20px; }
.ladder .on .dot { background: var(--nar); border-color: var(--nar); color: var(--color-bg-canvas); }
.ladder .next .dot { border-style: dashed; border-color: var(--nar); color: var(--nar); }
.ladder .l { font-family: var(--font-display); font-weight: 700; font-size: var(--type-title-m-size); line-height: 1.2; }
.ladder .h { color: var(--color-text-secondary); font-size: var(--type-body-m-size); line-height: 1.4; }
.ladder li:last-child .l { color: var(--nar); }
.demo-wrap { display: grid; gap: var(--space-3); justify-items: center; text-align: center; }
.demo-wrap .overline { margin: 0; color: var(--nar); }
.demo-intro { color: var(--color-text-secondary); font-size: var(--type-body-m-size); max-width: 36ch; margin-bottom: var(--space-4); }
.demo .scr { gap: 0.7em; }
.m-chathead { display: flex; align-items: center; gap: 0.7em; }
.m-avatar { flex: none; }
.m-avatar img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.m-log { flex: 1; min-height: 0; overflow-y: auto; display: flex; flex-direction: column; gap: 0.5em; padding: 0.2em 0; scrollbar-width: none; }
.m-log .b { align-self: flex-start; max-width: 86%; padding: 0.62em 0.9em; border-radius: 1.2em 1.2em 1.2em 0.4em; background: rgba(246, 238, 241, 0.08); font-size: 0.9em; line-height: 1.4; }
.m-log .b.me { align-self: flex-end; border-radius: 1.2em 1.2em 0.4em 1.2em; background: var(--nar); color: var(--color-bg-canvas); font-weight: 600; }
.m-log .b.sys { align-self: stretch; max-width: none; text-align: center; border-radius: 1.3em; background: linear-gradient(160deg, rgba(240, 88, 127, 0.2), rgba(183, 156, 255, 0.08)); border: 1px solid rgba(240, 88, 127, 0.5); color: var(--nar); font-weight: 700; }
.m-log .b.sys strong { display: block; font-family: var(--font-display); font-weight: 800; font-stretch: 75%; font-size: 2.6em; line-height: 1; color: var(--color-mist); margin-top: 0.1em; }
.m-log .b.note { align-self: stretch; max-width: none; text-align: center; background: none; color: var(--color-text-secondary); font-size: 0.82em; }
.m-form { display: flex; gap: 0.5em; }
.m-form[hidden] { display: none; }
.m-form input {
  flex: 1; min-width: 0; height: 3.3em; border-radius: 1.65em; padding: 0 1.1em; font: 500 max(16px, 1em) / 1 var(--font-ui);
  color: var(--color-mist); background: rgba(246, 238, 241, 0.07); border: 1.5px solid rgba(246, 238, 241, 0.22);
}
.m-form input::placeholder { color: var(--color-text-tertiary); }
.m-form input:focus { outline: none; border-color: var(--nar); }
.m-form .m-btn { flex: none; min-height: 3.3em; cursor: pointer; }
.m-form .m-btn:focus-visible { outline: 2px solid var(--color-mist); outline-offset: 2px; }
.m-left { font-size: 0.78em; color: var(--color-text-tertiary); text-align: center; min-height: 1.3em; }
.m-reset { align-self: center; background: none; border: 0; color: var(--nar); font: 700 0.85em var(--font-ui); text-decoration: underline; cursor: pointer; padding: 0.4em; }
.m-reset[hidden] { display: none; }
@media (min-width: 960px) { .disc { grid-template-columns: 1fr 1fr; gap: var(--space-16); } .demo-wrap { position: sticky; top: calc(var(--header-h) + var(--space-6)); } }

/* characters */
.chars { display: grid; gap: var(--space-12); align-items: center; }
.char-card { position: relative; margin: 0 auto; width: min(100%, 420px); }
.char-card img { width: 100%; height: auto; aspect-ratio: 720 / 964; object-fit: cover; border-radius: calc(var(--radius-xl) * 1.2); box-shadow: 0 0 0 1px rgba(92, 214, 200, 0.35), 0 40px 90px -30px rgba(0, 0, 0, 0.7); }
.char-card > .ai-pill { position: absolute; right: var(--space-4); top: var(--space-4); font-size: 0.875rem; }
.char-card figcaption { display: grid; gap: 2px; margin-top: var(--space-4); color: var(--color-text-secondary); font-size: var(--type-body-m-size); }
.char-card figcaption .disp { font-size: var(--type-title-l-size); color: var(--color-text-primary); }
.chars .section-head { margin-bottom: var(--space-8); }
.facts { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-3); }
.fact { display: flex; gap: var(--space-3); align-items: flex-start; padding: var(--space-4) var(--space-5); border-radius: calc(var(--radius-l) * 1.1); border: var(--border-width-hairline) solid var(--line); background: var(--glass); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); }
.fact svg { flex: none; width: var(--size-icon-m); height: var(--size-icon-m); margin-top: 1px; }
.fact.ai { border-color: rgba(92, 214, 200, 0.3); background: rgba(92, 214, 200, 0.06); }
.fact.ai svg { color: var(--deniz); }
@media (min-width: 900px) { .chars { grid-template-columns: 0.8fr 1.2fr; gap: var(--space-16); } }

/* plans */
.plans-top { display: grid; gap: var(--space-10); align-items: center; margin-bottom: var(--space-10); }
.plans-top .section-head { margin-bottom: 0; }
.plans-mock { margin: 0; }
.plans-mock .mock { width: min(72vw, 300px); rotate: 3deg; }
@media (min-width: 900px) { .plans-top { grid-template-columns: 1.3fr 0.7fr; } }
.tiers { display: grid; gap: var(--space-4); grid-template-columns: repeat(auto-fit, minmax(min(100%, 280px), 1fr)); align-items: stretch; }
.tier { display: grid; gap: var(--space-4); align-content: start; }
.tier h3 { font-size: var(--type-display-l-size); line-height: var(--type-display-l-line-height); display: flex; align-items: center; gap: var(--space-2); }
.tier h3 svg { width: var(--size-icon-l); height: var(--size-icon-l); color: var(--kehribar); }
.tier .tagline { color: var(--color-text-secondary); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); }
.tier ul { list-style: none; padding: var(--space-4) 0 0; margin: 0; display: grid; gap: var(--space-3); border-top: var(--border-width-hairline) solid var(--line); }
.tier li { display: flex; gap: var(--space-3); align-items: flex-start; font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); }
.tier li svg { flex: none; width: var(--size-icon-m); height: var(--size-icon-m); color: var(--nar); }
.tier.plus { border-color: color-mix(in srgb, var(--nar) 55%, transparent); background: linear-gradient(160deg, color-mix(in srgb, var(--nar) 12%, transparent), var(--glass) 60%); }
.tier.gold { border-color: color-mix(in srgb, var(--kehribar) 55%, transparent); background: linear-gradient(160deg, color-mix(in srgb, var(--kehribar) 9%, transparent), var(--glass) 55%); }
.tier.gold li svg { color: var(--kehribar); }
.unlocks { margin-top: var(--space-8); }
.unlocks ul { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: var(--space-2); }
.unlocks li { display: inline-flex; align-items: center; gap: var(--space-2); min-height: var(--size-pill); padding: 0 var(--space-4); border-radius: var(--radius-full); border: var(--border-width-hairline) solid var(--color-border-strong); font-weight: 600; font-size: var(--type-label-m-size); }
.unlocks li svg { width: var(--size-icon-s); height: var(--size-icon-s); color: var(--nar); }
.plans-note { margin-top: var(--space-6); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); color: var(--color-text-secondary); max-width: 70ch; }

/* safety */
.grid { display: grid; gap: var(--space-4); }
.grid.three { grid-template-columns: repeat(auto-fit, minmax(min(100%, 290px), 1fr)); }
@media (min-width: 640px) { .grid.two { grid-template-columns: repeat(2, 1fr); } }
.feature { display: grid; gap: var(--space-3); align-content: start; }
.feature h3, .feature .h3 { font-family: var(--font-display); font-size: var(--type-title-m-size); line-height: var(--type-title-m-line-height); font-weight: 700; margin-top: var(--space-2); }
.feature p { color: var(--color-text-secondary); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); }
.free-pill {
  display: inline-flex; align-items: center; gap: var(--space-2); padding: var(--space-1) var(--space-3); border-radius: var(--radius-full);
  background: color-mix(in srgb, var(--color-success) 12%, transparent); color: var(--color-success); font-weight: 700; font-size: var(--type-label-s-size); width: fit-content;
}
.free-pill svg { width: var(--size-icon-s); height: var(--size-icon-s); }
.inline-links { display: flex; flex-wrap: wrap; gap: var(--space-3); margin-top: var(--space-8); }

/* faq */
.faq { background: var(--glass); border: var(--border-width-hairline) solid var(--line); border-radius: calc(var(--radius-l) * 1.33); padding: var(--space-1) var(--space-6); }
.faq details { border-bottom: var(--border-width-hairline) solid var(--line); }
.faq details:last-child { border-bottom: 0; }
.faq summary { list-style: none; cursor: pointer; display: flex; align-items: center; justify-content: space-between; gap: var(--space-4); padding: var(--space-4) 0; min-height: var(--size-option-tile); font-weight: 700; }
.faq summary::-webkit-details-marker { display: none; }
.faq summary svg { flex: none; width: var(--size-icon-m); height: var(--size-icon-m); color: var(--nar); transition: transform var(--motion-duration-base) var(--motion-ease-standard); }
.faq details[open] summary svg { transform: rotate(45deg); }
.faq .answer { padding: 0 0 var(--space-5); color: var(--color-text-secondary); max-width: 68ch; }

/* closing CTA */
.cta { position: relative; overflow: hidden; isolation: isolate; text-align: center; border-top: var(--border-width-hairline) solid var(--line); background: var(--color-night-900); }
.cta .fog-field i:nth-child(2) { left: 50%; right: auto; translate: -50% 0; top: 25%; opacity: 0.45; }
.cta .wrap { position: relative; display: grid; gap: var(--space-6); justify-items: center; padding-top: calc(var(--web-section) * 1.1); padding-bottom: calc(var(--web-section) * 1.1); }
.cta h2 { font-size: var(--web-hook); max-width: 12ch; }
.cta .badges { justify-content: center; }
.emblem { width: var(--size-illustration); color: var(--color-text-primary); }
.emblem svg { width: 100%; height: auto; fill: currentColor; }
.cta .emblem { width: calc(var(--size-avatar-l) * 0.9); }

/* footer */
.site-footer { border-top: var(--border-width-hairline) solid var(--line); padding: var(--space-12) 0 var(--space-10); font-size: var(--type-body-m-size); line-height: var(--type-body-m-line-height); background: var(--color-night-950); }
.footer-grid { display: grid; gap: var(--space-8); grid-template-columns: repeat(auto-fit, minmax(calc(var(--size-orb-m) * 1.1), 1fr)); }
.footer-brand { display: grid; gap: var(--space-3); align-content: start; grid-column: 1 / -1; max-width: 34ch; }
.site-footer h2 { font-family: var(--font-ui); font-size: var(--type-overline-size); letter-spacing: 0.14em; text-transform: uppercase; color: var(--color-text-tertiary); margin-bottom: var(--space-3); }
.site-footer ul { list-style: none; margin: 0; padding: 0; display: grid; gap: var(--space-1); }
.site-footer ul a { color: var(--color-text-secondary); text-decoration: none; display: inline-flex; min-height: calc(var(--layout-touch-target-min) * 0.8); align-items: center; }
.site-footer ul a:hover { color: var(--color-text-primary); text-decoration: underline; }
.footer-bottom { margin-top: var(--space-10); padding-top: var(--space-6); border-top: var(--border-width-hairline) solid var(--line); display: flex; flex-wrap: wrap; gap: var(--space-4); justify-content: space-between; color: var(--color-text-tertiary); }
.footer-bottom a { color: inherit; }
@media (min-width: 900px) { .footer-brand { grid-column: auto; } .footer-grid { grid-template-columns: 1.4fr repeat(3, 1fr); } }

/* ---------- inner pages (legal, support, deletion, safety) ---------- */
.page main { padding-bottom: var(--web-section); }
.page-head { padding: var(--space-16) 0 var(--space-10); display: grid; gap: var(--space-4); border-bottom: var(--border-width-hairline) solid var(--line); margin-bottom: var(--space-10); }
.page-head .overline { margin: 0; }
.page-head h1 { font-size: var(--web-h2); line-height: 1; font-weight: 800; font-stretch: 75%; letter-spacing: -0.012em; }
.page-head .lead .accent { color: var(--nar); }
.meta { display: flex; flex-wrap: wrap; gap: var(--space-2) var(--space-4); color: var(--color-text-tertiary); font-size: var(--type-body-m-size); }
.meta span + span::before { content: '·'; margin-right: var(--space-4); }
.prose { max-width: 68ch; }
.prose h2 { font-size: var(--type-title-l-size); line-height: var(--type-title-l-line-height); margin: var(--space-12) 0 var(--space-3); letter-spacing: -0.01em; }
.prose h3 { font-family: var(--font-ui); font-size: var(--type-title-m-size); line-height: var(--type-title-m-line-height); margin: var(--space-6) 0 var(--space-2); }
.prose p, .prose ul, .prose ol { margin: 0 0 var(--space-4); color: var(--color-text-secondary); }
.prose strong { color: var(--color-text-primary); }
.prose ul, .prose ol { padding-left: var(--space-6); }
.prose li { margin-bottom: var(--space-2); }
.prose li::marker { color: var(--nar); }
.prose > :first-child { margin-top: 0; }
.prose .card { margin: var(--space-8) 0; }
.prose .card p { color: var(--color-text-primary); }
nav.prose { margin-top: var(--space-12); padding-top: var(--space-2); border-top: var(--border-width-hairline) solid var(--line); }
.note { background: var(--color-dusk-100); color: var(--color-dusk-700); border-radius: var(--radius-m); padding: var(--space-4) var(--space-5); margin: 0 0 var(--space-6); font-weight: 500; }
.prose .note { color: var(--color-dusk-700); }
.toc { margin: 0 0 var(--space-10); background: var(--glass); border: var(--border-width-hairline) solid var(--line); border-radius: calc(var(--radius-l) * 1.1); padding: var(--space-2) var(--space-5); }
.toc summary { cursor: pointer; font-weight: 700; min-height: var(--layout-touch-target-min); display: flex; align-items: center; }
.toc ol { margin: var(--space-2) 0 var(--space-3); padding-left: var(--space-6); columns: 2 280px; font-size: var(--type-body-m-size); }
.toc li { margin-bottom: var(--space-1); break-inside: avoid; }
.stack { display: grid; gap: var(--space-4); }
.stack .card { display: grid; gap: var(--space-2); }
.stack .card .overline { margin: 0; }
.stack .card p { color: var(--color-text-secondary); }
.kv { display: grid; grid-template-columns: max-content 1fr; gap: var(--space-1) var(--space-4); font-size: var(--type-body-m-size); margin: 0 0 var(--space-6); padding: var(--space-4) var(--space-5); background: var(--glass); border: var(--border-width-hairline) solid var(--line); border-radius: var(--radius-m); width: fit-content; max-width: 100%; }
.kv dt { color: var(--color-text-tertiary); }
.kv dd { margin: 0; font-weight: 600; color: var(--color-text-primary); }
.callout { border: var(--border-width-hairline) solid var(--color-notice-critical-border); background: var(--color-notice-critical-bg); border-radius: var(--radius-m); padding: var(--space-3) var(--space-5); margin: var(--space-6) 0; }
.callout strong { color: var(--color-notice-critical-fg); }

/* invite + 404 */
.center-page { min-height: calc(100vh - var(--header-h)); display: grid; place-items: center; text-align: center; padding: var(--space-12) 0; position: relative; overflow: hidden; isolation: isolate; }
.center-page .inner { position: relative; display: grid; gap: var(--space-5); justify-items: center; max-width: var(--layout-content-max-width); }
.center-page h1 { font-size: var(--web-h2); line-height: 1; font-weight: 800; font-stretch: 75%; }
.center-page .badges { justify-content: center; }
.code-box { display: inline-flex; align-items: center; gap: var(--space-3); padding: var(--space-2) var(--space-2) var(--space-2) var(--space-5); border-radius: var(--radius-full); background: var(--color-bg-raised); border: var(--border-width-hairline) solid var(--color-border-strong); max-width: 100%; }
.code-box code { font-family: var(--font-mono); font-size: var(--type-title-l-size); font-weight: 700; letter-spacing: 0.08em; overflow-wrap: anywhere; }
.code-box[hidden], [data-invite-empty][hidden] { display: none; }

/* ---------- calm reveal on scroll (JS + no reduced motion only; one slow fade) ---------- */
@media (prefers-reduced-motion: no-preference) {
  html.js-reveal [data-reveal] { opacity: 0; translate: 0 var(--space-5); transition: opacity var(--reveal-time) var(--motion-ease-standard), translate var(--reveal-time) var(--motion-ease-standard); }
  html.js-reveal [data-reveal].is-in { opacity: 1; translate: none; }
}
@media (prefers-reduced-motion: reduce) { .fog, .m-chip .v, .m-track i, .m-dots span { transition: none; } }

@media print {
  .site-header, .site-footer, .hero-stage, .hero-photo, .fog-field, .cta, .demo-wrap, .plans-mock { display: none; }
  body { background: none; color: black; }
  body::before { display: none; }
}