:root {
	color-scheme: light;
	--page-bg: #F3EFE8;
	--page-veil: #F3EFE8;
	--background-filter: saturate(1) hue-rotate(0deg) brightness(1) contrast(1);
	--background-opacity: 1;
	--ink-strong: #423D41;
	--ink-soft: #655F65;
	--ink-muted: rgba(66, 61, 65, 0.74);
	--ink-subtle: rgba(66, 61, 65, 0.62);
	--ink-faint: rgba(66, 61, 65, 0.48);
	--accent-green: #2F6549;
	--accent-green-soft: rgba(47, 101, 73, 0.14);
	--accent-green-mid: rgba(47, 101, 73, 0.48);
	--accent-glow: rgba(47, 101, 73, 0.18);
	--ending-bloom: rgba(255, 186, 121, 0.2);
	--ending-bloom-shadow: rgba(238, 152, 84, 0.24);
	--glass-fill: rgba(255, 255, 255, 0.56);
	--glass-fill-strong: rgba(255, 255, 255, 0.74);
	--glass-fill-soft: rgba(255, 255, 255, 0.38);
	--glass-border: rgba(66, 61, 65, 0.11);
	--glass-border-strong: rgba(66, 61, 65, 0.16);
	--glass-shadow: 0 1.25rem 4rem rgba(74, 70, 74, 0.08);
	--highlight-fill: rgba(255, 255, 255, 0.34);
	--highlight-border: rgba(74, 70, 74, 0.08);
	--highlight-shadow: 0 1rem 2.5rem rgba(74, 70, 74, 0.08);
	--journey-card-glow-soft: rgba(255, 206, 148, 0.2);
	--journey-card-glow-mid: rgba(98, 131, 112, 0.16);
	--journey-card-surface-fill: rgba(255, 252, 246, 0.76);
	--journey-card-border: rgba(88, 82, 77, 0.16);
	--journey-card-shadow: 0 0.85rem 2.1rem rgba(87, 78, 70, 0.08), 0 0.12rem 0.42rem rgba(87, 78, 70, 0.05);
	--journey-card-shadow-active: 0 1rem 2.45rem rgba(87, 78, 70, 0.11), 0 0 0 1px rgba(255, 255, 255, 0.5);
	--journey-card-atropos-shadow-bg: rgba(102, 97, 94, 0.18);
	--journey-card-atropos-shadow-opacity: 0.09;
	--journey-card-atropos-shadow-opacity-active: 0.14;
	--journey-card-highlight-core: rgba(255, 255, 255, 0.5);
	--journey-card-highlight-sheen: rgba(255, 232, 196, 0.24);
	--journey-card-glare-core: rgba(255, 255, 255, 0.62);
	--journey-card-glare-mid: rgba(255, 255, 255, 0.18);
	--journey-card-glare-trace: rgba(255, 255, 255, 0.055);
	--journey-card-sheen-soft: rgba(255, 255, 255, 0.075);
	--journey-card-sheen-line: rgba(255, 255, 255, 0.28);
	--journey-card-sparkle-core: rgba(255, 255, 255, 0.34);
	--journey-card-foil-glow: rgba(255, 255, 255, 0.28);
	--journey-card-spectrum-a: rgba(255, 189, 112, 0.18);
	--journey-card-spectrum-b: rgba(91, 150, 128, 0.14);
	--journey-card-spectrum-c: rgba(110, 136, 190, 0.13);
	--journey-card-spectrum-d: rgba(219, 130, 175, 0.12);
	--journey-card-overlay-opacity: 0.82;
	--journey-card-sheen-opacity: 0.74;
	--journey-card-foil-opacity: 0.56;
	--journey-card-grain-opacity: 0.18;
	--journey-card-action-accent: rgba(110, 102, 96, 0.56);
	--journey-card-active-ring: rgba(166, 122, 82, 0.22);
	--portrait-ring: rgba(94, 92, 94, 0.188);
	--divider-line: rgba(112, 110, 112, 0.7);
	--ambient-blob-one: rgba(46, 93, 69, 0.14);
	--ambient-blob-two: rgba(112, 110, 112, 0.12);
	--ambient-blob-three: rgba(74, 70, 74, 0.08);
	--ambient-sweep-left: rgba(46, 93, 69, 0.12);
	--ambient-sweep-right: rgba(126, 118, 126, 0.1);
	--ambient-core: rgba(255, 255, 255, 0.12);
	--section-hero-accent: rgba(46, 93, 69, 0.07);
	--section-essence-accent: rgba(46, 93, 69, 0.06);
	--essence-copy-ink: rgba(49, 45, 41, 0.78);
	--essence-copy-strong: rgba(42, 38, 35, 0.9);
	--essence-format-sheen: rgba(47, 101, 73, 0.18);
	--essence-format-glow: rgba(47, 101, 73, 0.14);
	--essence-underline-core: rgba(47, 101, 73, 0.84);
	--essence-underline-sheen: rgba(255, 255, 255, 0.92);
	--section-journey-accent: rgba(74, 70, 74, 0.05);
	--section-projects-accent: rgba(46, 93, 69, 0.05);
	--section-outro-accent: rgba(46, 93, 69, 0.05);
	--section-wash-strong: rgba(255, 255, 255, 0.12);
	--section-wash-soft: rgba(255, 255, 255, 0.04);
	--cue-bg: rgba(255, 255, 255, 0.38);
	--cue-shadow: 0 1rem 2.5rem rgba(74, 70, 74, 0.08);
	--cue-border: rgba(74, 70, 74, 0.16);
	--cue-center: rgba(255, 255, 255, 0.34);
	--cue-ink: rgba(74, 70, 74, 0.7);
	--progress-dot: rgba(112, 110, 112, 0.16);
	--progress-dot-hover: rgba(112, 110, 112, 0.26);
	--progress-dot-halo: rgba(46, 93, 69, 0.16);
	--progress-dot-active: rgba(46, 93, 69, 0.76);
	--progress-dot-glow: rgba(46, 93, 69, 0.18);
	--progress-trigger-bg: rgba(243, 239, 232, 0.56);
	--progress-trigger-border: rgba(72, 62, 54, 0.08);
	--progress-trigger-shadow: none;
	--progress-trigger-ring: rgba(255, 255, 255, 0.08);
	--progress-trigger-text: rgba(66, 61, 65, 0.58);
	--progress-hover-shadow: 0 0.7rem 1.7rem rgba(74, 70, 74, 0.045);
	--progress-card-bg: rgba(243, 239, 232, 0.62);
	--progress-card-border: rgba(74, 70, 74, 0.08);
	--progress-card-shadow: none;
	--progress-kicker: rgba(66, 61, 65, 0.36);
	--progress-label: rgba(66, 61, 65, 0.64);
	--progress-label-active: rgba(66, 61, 65, 0.86);
	--progress-item-hover: rgba(243, 239, 232, 0.46);
	--progress-item-active: rgba(243, 239, 232, 0.66);
	--progress-item-border: rgba(74, 70, 74, 0.07);
	--progress-item-active-border: rgba(47, 101, 73, 0.14);
	--progress-item-shadow: none;
	--soundtrack-card-bg: rgba(255, 255, 255, 0.13);
	--soundtrack-card-border: rgba(255, 255, 255, 0.16);
	--soundtrack-card-shadow: 0 0.85rem 1.8rem rgba(17, 19, 18, 0.12);
	--soundtrack-btn-bg: rgba(255, 255, 255, 0.14);
	--soundtrack-btn-bg-hover: rgba(255, 255, 255, 0.22);
	--soundtrack-btn-border: rgba(255, 255, 255, 0.18);
	--soundtrack-btn-shadow: 0 0.8rem 1.4rem rgba(17, 19, 18, 0.12);
	--soundtrack-track-bg: rgba(255, 255, 255, 0.18);
	--soundtrack-track-fill: rgba(46, 93, 69, 0.5);
	--soundtrack-track-inset: rgba(255, 255, 255, 0.08);
	--soundtrack-thumb-bg: rgba(255, 255, 255, 0.96);
	--soundtrack-thumb-border: rgba(74, 70, 74, 0.1);
	--soundtrack-thumb-shadow: 0 0.4rem 0.9rem rgba(17, 19, 18, 0.18);
	--soundtrack-thumb-glow: 0 0.35rem 1rem rgba(46, 93, 69, 0.18);
	--soundtrack-ring-track: rgba(255, 255, 255, 0.08);
	--soundtrack-ring-fill: rgba(46, 93, 69, 0.5);
	--soundtrack-ring-text: rgba(255, 255, 255, 0.82);
	--soundtrack-shell-ring-one: rgba(255, 255, 255, 0.12);
	--soundtrack-shell-ring-two: rgba(255, 255, 255, 0.08);
	--soundtrack-shell-accent: rgba(46, 93, 69, 0.1);
	--soundtrack-shell-corner-shadow: rgba(17, 19, 18, 0.14);
	--soundtrack-vinyl-highlight: rgba(255, 255, 255, 0.28);
	--soundtrack-vinyl-border: rgba(92, 84, 79, 0.18);
	--soundtrack-vinyl-inset: rgba(255, 255, 255, 0.22);
	--soundtrack-vinyl-groove: rgba(54, 48, 45, 0.085);
	--soundtrack-vinyl-center: rgba(208, 198, 188, 0.98);
	--soundtrack-vinyl-mid: rgba(158, 146, 136, 0.99);
	--soundtrack-vinyl-edge: rgba(112, 102, 96, 1);
	--soundtrack-vinyl-shadow-inset: rgba(74, 70, 74, 0.12);
	--soundtrack-vinyl-shadow-drop: rgba(74, 70, 74, 0.12);
	--soundtrack-label-sheen: rgba(255, 255, 255, 0.34);
	--soundtrack-label-a: rgba(248, 242, 234, 0.98);
	--soundtrack-label-b: rgba(224, 214, 202, 0.98);
	--soundtrack-label-border: rgba(92, 84, 79, 0.12);
	--soundtrack-label-shadow: rgba(255, 255, 255, 0.22);
	--soundtrack-label-text: rgba(88, 80, 76, 0.82);
	--soundtrack-prompt-button-bg: rgba(74, 70, 74, 0.08);
	--soundtrack-prompt-button-border: rgba(74, 70, 74, 0.08);
	--soundtrack-prompt-button-accent-bg: rgba(46, 93, 69, 0.14);
	--soundtrack-prompt-button-accent-border: rgba(46, 93, 69, 0.18);
	--theme-toggle-bg: rgba(243, 239, 232, 0.48);
	--theme-toggle-border: rgba(72, 62, 54, 0.08);
	--theme-toggle-shadow: none;
	--theme-toggle-text: rgba(66, 61, 65, 0.68);
	--theme-toggle-sun-fill: linear-gradient(135deg, #F7DA76, #EDA63A);
	--theme-toggle-sun-glow: rgba(237, 166, 58, 0.28);
	--theme-toggle-ray: rgba(237, 166, 58, 0.72);
	--theme-toggle-moon-fill: #F5EEDF;
	--theme-toggle-moon-shadow: rgba(210, 191, 166, 0.84);
	--theme-toggle-star: rgba(255, 255, 255, 0.94);
	--theme-transition-duration: 2350ms;
	--theme-content-transition-duration: 1840ms;
	--theme-text-transition-duration: 260ms;
	--theme-content-transition-ease: cubic-bezier(0.22, 1, 0.36, 1);
	--theme-transition-origin-x: 2.6rem;
	--theme-transition-origin-y: 2.6rem;
	--theme-transition-pulse-size: clamp(12rem, 28vw, 22rem);
	--theme-transition-sky-top: rgba(157, 196, 255, 0.16);
	--theme-transition-sky-mid: rgba(255, 208, 168, 0.2);
	--theme-transition-sky-bottom: rgba(18, 21, 34, 0.72);
	--theme-transition-horizon-glow: rgba(255, 184, 116, 0.38);
	--theme-transition-pulse-core: rgba(255, 242, 218, 0.72);
	--theme-transition-pulse-ring: rgba(255, 190, 126, 0.24);
	--theme-transition-trail: rgba(255, 214, 165, 0.28);
	--theme-transition-star: rgba(255, 255, 255, 0.92);
	--afterglow-horizon: rgba(255, 188, 132, 0.28);
	--afterglow-core: rgba(255, 161, 92, 0.2);
	--afterglow-haze: rgba(255, 223, 188, 0.24);
	--afterglow-sheen: rgba(255, 246, 225, 0.16);
	--afterglow-filter: saturate(1.08) hue-rotate(-6deg) brightness(1.02) contrast(1);
	--afterglow-dot-filter: saturate(1.08) hue-rotate(-7deg) brightness(1.02) contrast(1);
	--ambient-dawn-horizon: rgba(255, 240, 214, 0.4);
	--ambient-dawn-core: rgba(255, 204, 150, 0.42);
	--ambient-dawn-mist: rgba(255, 180, 126, 0.24);
	--ambient-dawn-trace: rgba(255, 231, 202, 0.24);
	--ambient-sunset-horizon: rgba(255, 208, 166, 0.36);
	--ambient-sunset-core: rgba(239, 154, 110, 0.34);
	--ambient-sunset-mist: rgba(183, 126, 140, 0.18);
	--ambient-sunset-trace: rgba(255, 219, 191, 0.18);
	--ending-ambience-active: 0;
	--ending-ambience-unlock-progress: 0;
	--ending-ambience-energy: 0.28;
	--ending-ambience-low: 0.34;
	--ending-ambience-mid: 0.3;
	--ending-ambience-high: 0.24;
	--ending-ambience-dawn-opacity: 0.42;
	--ending-ambience-dawn-sheen-opacity: 0.18;
	--ending-ambience-sunset-opacity: 0.18;
	--ending-ambience-sunset-sheen-opacity: 0.08;
	--ending-ambience-dawn-x: 0rem;
	--ending-ambience-dawn-y: 0.3rem;
	--ending-ambience-dawn-unlock-y: 0vh;
	--ending-ambience-dawn-scale-y: 1.12;
	--ending-ambience-sunset-x: 0rem;
	--ending-ambience-sunset-y: 0.36rem;
	--ending-ambience-sunset-unlock-y: 0vh;
	--ending-ambience-sunset-scale-y: 1.16;
	--ending-ambience-unlock-scale-y: 1;
	--ending-ambience-blur: 52px;
	--ending-ambience-sheen-blur: 26px;
	--section-padding-x: clamp(2.5rem, 5vw, 7rem);
	--section-padding-y: clamp(4rem, 8vh, 6rem);
	--section-shell-wide-max: min(92rem, calc(100vw - clamp(3rem, 6vw, 8rem)));
	--grid-gap-regular: clamp(0.95rem, 1vw, 1.25rem);
	--grid-gap-tight: clamp(0.85rem, 0.9vw, 1rem);
	--journey-card-min: clamp(19rem, 28vw, 22rem);
	--project-card-min: clamp(17.5rem, 26vw, 20rem);
	--highlight-card-min: clamp(15.5rem, 19vw, 18rem);
	--type-kicker-size: clamp(11px, 0.18vw + 10.4px, 12px);
	--type-meta-size: clamp(11px, 0.24vw + 10.3px, 12.5px);
	--type-note-size: clamp(15px, 0.32vw + 13.75px, 17px);
	--type-body-size: clamp(15px, 0.22vw + 14px, 17px);
	--type-hero-copy-size: clamp(26px, 1.2rem + 1.5vw, 44px);
	--type-hero-title-size: clamp(38px, 2rem + 1.85vw, 60px);
	--type-card-title-size: clamp(22px, 0.8vw + 18px, 30px);
	--type-highlight-title-size: clamp(17px, 0.45vw + 15px, 19px);
	--type-link-size: clamp(15px, 0.2vw + 14px, 16px);
	--type-outro-size: clamp(24px, 1.45vw + 18px, 36px);
	--type-progress-label-size: clamp(14px, 0.26vw + 13px, 15px);
	--type-progress-kicker-size: clamp(10px, 0.16vw + 9.5px, 11px);
}

:root[data-theme="dark"] {
	color-scheme: dark;
	--page-bg: #100A0C;
	--page-veil: #100A0C;
	--background-filter: saturate(0.72) hue-rotate(0deg) brightness(0.42) contrast(1.08);
	--background-opacity: 0.92;
	--ink-strong: #F4EEE4;
	--ink-soft: #C7BEB2;
	--ink-muted: rgba(244, 238, 228, 0.76);
	--ink-subtle: rgba(228, 220, 210, 0.64);
	--ink-faint: rgba(210, 201, 191, 0.5);
	--accent-green: #88B99A;
	--accent-green-soft: rgba(136, 185, 154, 0.18);
	--accent-green-mid: rgba(136, 185, 154, 0.54);
	--accent-glow: rgba(136, 185, 154, 0.22);
	--ending-bloom: rgba(255, 188, 112, 0.28);
	--ending-bloom-shadow: rgba(255, 156, 88, 0.34);
	--glass-fill: rgba(8, 11, 13, 0.68);
	--glass-fill-strong: rgba(10, 14, 16, 0.82);
	--glass-fill-soft: rgba(12, 16, 18, 0.52);
	--glass-border: rgba(244, 238, 228, 0.08);
	--glass-border-strong: rgba(244, 238, 228, 0.12);
	--glass-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.48);
	--highlight-fill: rgba(13, 17, 19, 0.72);
	--highlight-border: rgba(244, 238, 228, 0.08);
	--highlight-shadow: 0 1rem 2.8rem rgba(0, 0, 0, 0.38);
	--journey-card-glow-soft: rgba(244, 238, 228, 0.07);
	--journey-card-glow-mid: rgba(200, 190, 179, 0.18);
	--journey-card-surface-fill: rgba(11, 14, 16, 0.66);
	--journey-card-border: rgba(244, 238, 228, 0.06);
	--journey-card-shadow: 0 0.95rem 2.4rem rgba(0, 0, 0, 0.34);
	--journey-card-shadow-active: 0 1.15rem 2.65rem rgba(0, 0, 0, 0.24);
	--journey-card-atropos-shadow-bg: rgba(0, 0, 0, 0.48);
	--journey-card-atropos-shadow-opacity: 0.22;
	--journey-card-atropos-shadow-opacity-active: 0.28;
	--journey-card-highlight-core: rgba(244, 238, 228, 0.14);
	--journey-card-highlight-sheen: rgba(214, 206, 197, 0.08);
	--journey-card-glare-core: rgba(255, 255, 255, 0.42);
	--journey-card-glare-mid: rgba(255, 255, 255, 0.12);
	--journey-card-glare-trace: rgba(255, 255, 255, 0.025);
	--journey-card-sheen-soft: rgba(255, 255, 255, 0.05);
	--journey-card-sheen-line: rgba(255, 255, 255, 0.2);
	--journey-card-sparkle-core: rgba(255, 255, 255, 0.2);
	--journey-card-foil-glow: rgba(255, 255, 255, 0.2);
	--journey-card-spectrum-a: rgba(244, 238, 228, 0.05);
	--journey-card-spectrum-b: rgba(208, 219, 229, 0.06);
	--journey-card-spectrum-c: rgba(232, 223, 210, 0.06);
	--journey-card-spectrum-d: rgba(202, 196, 206, 0.05);
	--journey-card-overlay-opacity: 0.42;
	--journey-card-sheen-opacity: 0.56;
	--journey-card-foil-opacity: 0.32;
	--journey-card-grain-opacity: 0.12;
	--journey-card-action-accent: rgba(198, 188, 177, 0.58);
	--journey-card-active-ring: rgba(200, 190, 179, 0.14);
	--portrait-ring: rgba(244, 238, 228, 0.18);
	--divider-line: rgba(244, 238, 228, 0.16);
	--ambient-blob-one: rgba(115, 175, 137, 0.16);
	--ambient-blob-two: rgba(140, 130, 147, 0.12);
	--ambient-blob-three: rgba(236, 230, 221, 0.07);
	--ambient-sweep-left: rgba(115, 175, 137, 0.12);
	--ambient-sweep-right: rgba(149, 139, 156, 0.1);
	--ambient-core: rgba(255, 255, 255, 0.05);
	--section-hero-accent: rgba(115, 175, 137, 0.12);
	--section-essence-accent: rgba(115, 175, 137, 0.1);
	--essence-copy-ink: rgba(244, 238, 228, 0.78);
	--essence-copy-strong: rgba(255, 248, 236, 0.92);
	--essence-format-sheen: rgba(136, 185, 154, 0.24);
	--essence-format-glow: rgba(136, 185, 154, 0.18);
	--essence-underline-core: rgba(136, 185, 154, 0.86);
	--essence-underline-sheen: rgba(244, 238, 228, 0.92);
	--section-journey-accent: rgba(236, 230, 221, 0.06);
	--section-projects-accent: rgba(115, 175, 137, 0.09);
	--section-outro-accent: rgba(115, 175, 137, 0.11);
	--section-wash-strong: rgba(255, 255, 255, 0.05);
	--section-wash-soft: rgba(255, 255, 255, 0.015);
	--cue-bg: rgba(11, 15, 17, 0.72);
	--cue-shadow: 0 1rem 2.8rem rgba(0, 0, 0, 0.38);
	--cue-border: rgba(244, 238, 228, 0.14);
	--cue-center: rgba(244, 238, 228, 0.08);
	--cue-ink: rgba(244, 238, 228, 0.72);
	--progress-dot: rgba(244, 238, 228, 0.16);
	--progress-dot-hover: rgba(244, 238, 228, 0.28);
	--progress-dot-halo: rgba(136, 185, 154, 0.18);
	--progress-dot-active: rgba(136, 185, 154, 0.92);
	--progress-dot-glow: rgba(136, 185, 154, 0.26);
	--progress-trigger-bg: rgba(21, 17, 18, 0.52);
	--progress-trigger-border: rgba(244, 238, 228, 0.075);
	--progress-trigger-shadow: none;
	--progress-trigger-ring: rgba(244, 238, 228, 0.055);
	--progress-trigger-text: rgba(244, 238, 228, 0.68);
	--progress-hover-shadow: 0 0.85rem 1.8rem rgba(0, 0, 0, 0.18);
	--progress-card-bg: rgba(21, 17, 18, 0.6);
	--progress-card-border: rgba(244, 238, 228, 0.075);
	--progress-card-shadow: none;
	--progress-kicker: rgba(244, 238, 228, 0.34);
	--progress-label: rgba(244, 238, 228, 0.62);
	--progress-label-active: rgba(244, 238, 228, 0.88);
	--progress-item-hover: rgba(244, 238, 228, 0.045);
	--progress-item-active: rgba(244, 238, 228, 0.07);
	--progress-item-border: rgba(244, 238, 228, 0.075);
	--progress-item-active-border: rgba(136, 185, 154, 0.14);
	--progress-item-shadow: none;
	--soundtrack-card-bg: rgba(10, 14, 16, 0.72);
	--soundtrack-card-border: rgba(244, 238, 228, 0.12);
	--soundtrack-card-shadow: 0 0.85rem 1.8rem rgba(0, 0, 0, 0.32);
	--soundtrack-btn-bg: rgba(17, 23, 25, 0.66);
	--soundtrack-btn-bg-hover: rgba(23, 31, 34, 0.86);
	--soundtrack-btn-border: rgba(244, 238, 228, 0.14);
	--soundtrack-btn-shadow: 0 0.9rem 1.6rem rgba(0, 0, 0, 0.24);
	--soundtrack-track-bg: rgba(244, 238, 228, 0.14);
	--soundtrack-track-fill: rgba(136, 185, 154, 0.72);
	--soundtrack-track-inset: rgba(244, 238, 228, 0.06);
	--soundtrack-thumb-bg: rgba(244, 238, 228, 0.96);
	--soundtrack-thumb-border: rgba(255, 255, 255, 0.12);
	--soundtrack-thumb-shadow: 0 0.45rem 0.95rem rgba(0, 0, 0, 0.4);
	--soundtrack-thumb-glow: 0 0.35rem 1rem rgba(136, 185, 154, 0.24);
	--soundtrack-ring-track: rgba(244, 238, 228, 0.12);
	--soundtrack-ring-fill: rgba(136, 185, 154, 0.68);
	--soundtrack-ring-text: rgba(244, 238, 228, 0.82);
	--soundtrack-shell-ring-one: rgba(244, 238, 228, 0.07);
	--soundtrack-shell-ring-two: rgba(244, 238, 228, 0.04);
	--soundtrack-shell-accent: rgba(136, 185, 154, 0.14);
	--soundtrack-shell-corner-shadow: rgba(0, 0, 0, 0.34);
	--soundtrack-vinyl-highlight: rgba(244, 238, 228, 0.08);
	--soundtrack-vinyl-border: rgba(244, 238, 228, 0.06);
	--soundtrack-vinyl-inset: rgba(244, 238, 228, 0.06);
	--soundtrack-vinyl-groove: rgba(244, 238, 228, 0.045);
	--soundtrack-vinyl-center: rgba(28, 28, 28, 0.97);
	--soundtrack-vinyl-mid: rgba(6, 6, 6, 0.995);
	--soundtrack-vinyl-edge: rgba(1, 1, 1, 1);
	--soundtrack-vinyl-shadow-inset: rgba(0, 0, 0, 0.36);
	--soundtrack-vinyl-shadow-drop: rgba(0, 0, 0, 0.28);
	--soundtrack-label-sheen: rgba(255, 255, 255, 0.1);
	--soundtrack-label-a: rgba(34, 34, 34, 0.96);
	--soundtrack-label-b: rgba(7, 7, 7, 0.99);
	--soundtrack-label-border: rgba(244, 238, 228, 0.12);
	--soundtrack-label-shadow: rgba(244, 238, 228, 0.05);
	--soundtrack-label-text: rgba(244, 238, 228, 0.74);
	--soundtrack-prompt-button-bg: rgba(244, 238, 228, 0.08);
	--soundtrack-prompt-button-border: rgba(244, 238, 228, 0.1);
	--soundtrack-prompt-button-accent-bg: rgba(136, 185, 154, 0.18);
	--soundtrack-prompt-button-accent-border: rgba(136, 185, 154, 0.24);
	--theme-toggle-bg: rgba(21, 17, 18, 0.52);
	--theme-toggle-border: rgba(244, 238, 228, 0.075);
	--theme-toggle-shadow: none;
	--theme-toggle-text: rgba(244, 238, 228, 0.72);
	--theme-toggle-sun-fill: linear-gradient(135deg, #F8E5A5, #DAB16B);
	--theme-toggle-sun-glow: rgba(248, 229, 165, 0.18);
	--theme-toggle-ray: rgba(248, 229, 165, 0.56);
	--theme-toggle-moon-fill: #F7F0E3;
	--theme-toggle-moon-shadow: rgba(7, 9, 11, 0.92);
	--theme-toggle-star: rgba(247, 240, 227, 0.9);
	--afterglow-horizon: rgba(255, 163, 87, 0.3);
	--afterglow-core: rgba(255, 204, 124, 0.22);
	--afterglow-haze: rgba(212, 113, 78, 0.2);
	--afterglow-sheen: rgba(255, 219, 161, 0.15);
	--afterglow-filter: saturate(0.94) hue-rotate(-10deg) brightness(0.62) contrast(1.05);
	--afterglow-dot-filter: saturate(0.92) hue-rotate(-11deg) brightness(0.58) contrast(1.05);
	--ambient-dawn-horizon: rgba(255, 204, 142, 0.38);
	--ambient-dawn-core: rgba(255, 154, 90, 0.42);
	--ambient-dawn-mist: rgba(255, 218, 172, 0.16);
	--ambient-dawn-trace: rgba(255, 236, 206, 0.18);
	--ambient-sunset-horizon: rgba(255, 170, 107, 0.32);
	--ambient-sunset-core: rgba(208, 98, 82, 0.34);
	--ambient-sunset-mist: rgba(124, 92, 158, 0.22);
	--ambient-sunset-trace: rgba(255, 206, 168, 0.16);
	--ending-ambience-dawn-opacity: 0.2;
	--ending-ambience-dawn-sheen-opacity: 0.08;
	--ending-ambience-sunset-opacity: 0.42;
	--ending-ambience-sunset-sheen-opacity: 0.18;
}

@media (prefers-color-scheme: dark) {
	:root:not([data-theme="light"]) {
		color-scheme: dark;
		--page-bg: #100A0C;
		--page-veil: #100A0C;
		--background-filter: saturate(0.72) hue-rotate(0deg) brightness(0.42) contrast(1.08);
		--background-opacity: 0.92;
		--ink-strong: #F4EEE4;
		--ink-soft: #C7BEB2;
		--ink-muted: rgba(244, 238, 228, 0.76);
		--ink-subtle: rgba(228, 220, 210, 0.64);
		--ink-faint: rgba(210, 201, 191, 0.5);
			--accent-green: #88B99A;
			--accent-green-soft: rgba(136, 185, 154, 0.18);
			--accent-green-mid: rgba(136, 185, 154, 0.54);
			--accent-glow: rgba(136, 185, 154, 0.22);
				--ending-bloom: rgba(255, 188, 112, 0.28);
				--ending-bloom-shadow: rgba(255, 156, 88, 0.34);
			--glass-fill: rgba(8, 11, 13, 0.68);
		--glass-fill-strong: rgba(10, 14, 16, 0.82);
		--glass-fill-soft: rgba(12, 16, 18, 0.52);
		--glass-border: rgba(244, 238, 228, 0.08);
		--glass-border-strong: rgba(244, 238, 228, 0.12);
		--glass-shadow: 0 1.5rem 4rem rgba(0, 0, 0, 0.48);
		--highlight-fill: rgba(13, 17, 19, 0.72);
		--highlight-border: rgba(244, 238, 228, 0.08);
		--highlight-shadow: 0 1rem 2.8rem rgba(0, 0, 0, 0.38);
		--journey-card-glow-soft: rgba(244, 238, 228, 0.07);
		--journey-card-glow-mid: rgba(200, 190, 179, 0.18);
		--journey-card-surface-fill: rgba(11, 14, 16, 0.66);
		--journey-card-border: rgba(244, 238, 228, 0.06);
		--journey-card-shadow: 0 0.95rem 2.4rem rgba(0, 0, 0, 0.34);
		--journey-card-shadow-active: 0 1.15rem 2.65rem rgba(0, 0, 0, 0.24);
		--journey-card-atropos-shadow-bg: rgba(0, 0, 0, 0.48);
		--journey-card-atropos-shadow-opacity: 0.22;
		--journey-card-atropos-shadow-opacity-active: 0.28;
		--journey-card-highlight-core: rgba(244, 238, 228, 0.14);
		--journey-card-highlight-sheen: rgba(214, 206, 197, 0.08);
		--journey-card-glare-core: rgba(255, 255, 255, 0.42);
		--journey-card-glare-mid: rgba(255, 255, 255, 0.12);
		--journey-card-glare-trace: rgba(255, 255, 255, 0.025);
		--journey-card-sheen-soft: rgba(255, 255, 255, 0.05);
		--journey-card-sheen-line: rgba(255, 255, 255, 0.2);
		--journey-card-sparkle-core: rgba(255, 255, 255, 0.2);
		--journey-card-foil-glow: rgba(255, 255, 255, 0.2);
		--journey-card-spectrum-a: rgba(244, 238, 228, 0.05);
		--journey-card-spectrum-b: rgba(208, 219, 229, 0.06);
		--journey-card-spectrum-c: rgba(232, 223, 210, 0.06);
		--journey-card-spectrum-d: rgba(202, 196, 206, 0.05);
		--journey-card-overlay-opacity: 0.42;
		--journey-card-sheen-opacity: 0.56;
		--journey-card-foil-opacity: 0.32;
		--journey-card-grain-opacity: 0.12;
		--journey-card-action-accent: rgba(198, 188, 177, 0.58);
		--journey-card-active-ring: rgba(200, 190, 179, 0.14);
		--portrait-ring: rgba(244, 238, 228, 0.18);
		--divider-line: rgba(244, 238, 228, 0.16);
		--ambient-blob-one: rgba(115, 175, 137, 0.16);
		--ambient-blob-two: rgba(140, 130, 147, 0.12);
		--ambient-blob-three: rgba(236, 230, 221, 0.07);
		--ambient-sweep-left: rgba(115, 175, 137, 0.12);
		--ambient-sweep-right: rgba(149, 139, 156, 0.1);
		--ambient-core: rgba(255, 255, 255, 0.05);
		--section-hero-accent: rgba(115, 175, 137, 0.12);
		--section-essence-accent: rgba(115, 175, 137, 0.1);
		--essence-copy-ink: rgba(244, 238, 228, 0.78);
		--essence-copy-strong: rgba(255, 248, 236, 0.92);
		--essence-format-sheen: rgba(136, 185, 154, 0.24);
		--essence-format-glow: rgba(136, 185, 154, 0.18);
		--essence-underline-core: rgba(136, 185, 154, 0.86);
		--essence-underline-sheen: rgba(244, 238, 228, 0.92);
		--section-journey-accent: rgba(236, 230, 221, 0.06);
		--section-projects-accent: rgba(115, 175, 137, 0.09);
		--section-outro-accent: rgba(115, 175, 137, 0.11);
		--section-wash-strong: rgba(255, 255, 255, 0.05);
		--section-wash-soft: rgba(255, 255, 255, 0.015);
		--cue-bg: rgba(11, 15, 17, 0.72);
		--cue-shadow: 0 1rem 2.8rem rgba(0, 0, 0, 0.38);
		--cue-border: rgba(244, 238, 228, 0.14);
		--cue-center: rgba(244, 238, 228, 0.08);
		--cue-ink: rgba(244, 238, 228, 0.72);
		--progress-dot: rgba(244, 238, 228, 0.16);
		--progress-dot-hover: rgba(244, 238, 228, 0.28);
		--progress-dot-halo: rgba(136, 185, 154, 0.18);
		--progress-dot-active: rgba(136, 185, 154, 0.92);
		--progress-dot-glow: rgba(136, 185, 154, 0.26);
		--progress-trigger-bg: rgba(21, 17, 18, 0.52);
		--progress-trigger-border: rgba(244, 238, 228, 0.075);
		--progress-trigger-shadow: none;
		--progress-trigger-ring: rgba(244, 238, 228, 0.055);
		--progress-trigger-text: rgba(244, 238, 228, 0.68);
		--progress-hover-shadow: 0 0.85rem 1.8rem rgba(0, 0, 0, 0.18);
		--progress-card-bg: rgba(21, 17, 18, 0.6);
		--progress-card-border: rgba(244, 238, 228, 0.075);
		--progress-card-shadow: none;
		--progress-kicker: rgba(244, 238, 228, 0.34);
		--progress-label: rgba(244, 238, 228, 0.62);
		--progress-label-active: rgba(244, 238, 228, 0.88);
		--progress-item-hover: rgba(244, 238, 228, 0.045);
		--progress-item-active: rgba(244, 238, 228, 0.07);
		--progress-item-border: rgba(244, 238, 228, 0.075);
		--progress-item-active-border: rgba(136, 185, 154, 0.14);
		--progress-item-shadow: none;
		--soundtrack-card-bg: rgba(10, 14, 16, 0.72);
		--soundtrack-card-border: rgba(244, 238, 228, 0.12);
		--soundtrack-card-shadow: 0 0.85rem 1.8rem rgba(0, 0, 0, 0.32);
		--soundtrack-btn-bg: rgba(17, 23, 25, 0.66);
		--soundtrack-btn-bg-hover: rgba(23, 31, 34, 0.86);
		--soundtrack-btn-border: rgba(244, 238, 228, 0.14);
		--soundtrack-btn-shadow: 0 0.9rem 1.6rem rgba(0, 0, 0, 0.24);
		--soundtrack-track-bg: rgba(244, 238, 228, 0.14);
		--soundtrack-track-fill: rgba(136, 185, 154, 0.72);
		--soundtrack-track-inset: rgba(244, 238, 228, 0.06);
		--soundtrack-thumb-bg: rgba(244, 238, 228, 0.96);
		--soundtrack-thumb-border: rgba(255, 255, 255, 0.12);
		--soundtrack-thumb-shadow: 0 0.45rem 0.95rem rgba(0, 0, 0, 0.4);
		--soundtrack-thumb-glow: 0 0.35rem 1rem rgba(136, 185, 154, 0.24);
		--soundtrack-ring-track: rgba(244, 238, 228, 0.12);
		--soundtrack-ring-fill: rgba(136, 185, 154, 0.68);
		--soundtrack-ring-text: rgba(244, 238, 228, 0.82);
		--soundtrack-shell-ring-one: rgba(244, 238, 228, 0.07);
		--soundtrack-shell-ring-two: rgba(244, 238, 228, 0.04);
		--soundtrack-shell-accent: rgba(136, 185, 154, 0.14);
		--soundtrack-shell-corner-shadow: rgba(0, 0, 0, 0.34);
		--soundtrack-vinyl-highlight: rgba(244, 238, 228, 0.08);
		--soundtrack-vinyl-border: rgba(244, 238, 228, 0.06);
		--soundtrack-vinyl-inset: rgba(244, 238, 228, 0.06);
		--soundtrack-vinyl-groove: rgba(244, 238, 228, 0.045);
		--soundtrack-vinyl-center: rgba(28, 28, 28, 0.97);
		--soundtrack-vinyl-mid: rgba(6, 6, 6, 0.995);
		--soundtrack-vinyl-edge: rgba(1, 1, 1, 1);
		--soundtrack-vinyl-shadow-inset: rgba(0, 0, 0, 0.36);
		--soundtrack-vinyl-shadow-drop: rgba(0, 0, 0, 0.28);
		--soundtrack-label-sheen: rgba(255, 255, 255, 0.1);
		--soundtrack-label-a: rgba(34, 34, 34, 0.96);
		--soundtrack-label-b: rgba(7, 7, 7, 0.99);
		--soundtrack-label-border: rgba(244, 238, 228, 0.12);
		--soundtrack-label-shadow: rgba(244, 238, 228, 0.05);
		--soundtrack-label-text: rgba(244, 238, 228, 0.74);
		--soundtrack-prompt-button-bg: rgba(244, 238, 228, 0.08);
		--soundtrack-prompt-button-border: rgba(244, 238, 228, 0.1);
		--soundtrack-prompt-button-accent-bg: rgba(136, 185, 154, 0.18);
		--soundtrack-prompt-button-accent-border: rgba(136, 185, 154, 0.24);
		--theme-toggle-bg: rgba(21, 17, 18, 0.52);
		--theme-toggle-border: rgba(244, 238, 228, 0.075);
		--theme-toggle-shadow: none;
		--theme-toggle-text: rgba(244, 238, 228, 0.72);
		--theme-toggle-sun-fill: linear-gradient(135deg, #F8E5A5, #DAB16B);
		--theme-toggle-sun-glow: rgba(248, 229, 165, 0.18);
		--theme-toggle-ray: rgba(248, 229, 165, 0.56);
			--theme-toggle-moon-fill: #F7F0E3;
			--theme-toggle-moon-shadow: rgba(7, 9, 11, 0.92);
			--theme-toggle-star: rgba(247, 240, 227, 0.9);
			--afterglow-horizon: rgba(255, 163, 87, 0.3);
			--afterglow-core: rgba(255, 204, 124, 0.22);
			--afterglow-haze: rgba(212, 113, 78, 0.2);
			--afterglow-sheen: rgba(255, 219, 161, 0.15);
			--afterglow-filter: saturate(0.94) hue-rotate(-10deg) brightness(0.62) contrast(1.05);
			--afterglow-dot-filter: saturate(0.92) hue-rotate(-11deg) brightness(0.58) contrast(1.05);
			--ambient-dawn-horizon: rgba(255, 204, 142, 0.38);
			--ambient-dawn-core: rgba(255, 154, 90, 0.42);
			--ambient-dawn-mist: rgba(255, 218, 172, 0.16);
			--ambient-dawn-trace: rgba(255, 236, 206, 0.18);
			--ambient-sunset-horizon: rgba(255, 170, 107, 0.32);
			--ambient-sunset-core: rgba(208, 98, 82, 0.34);
			--ambient-sunset-mist: rgba(124, 92, 158, 0.22);
			--ambient-sunset-trace: rgba(255, 206, 168, 0.16);
				--ending-ambience-dawn-opacity: 0.2;
				--ending-ambience-dawn-sheen-opacity: 0.08;
				--ending-ambience-sunset-opacity: 0.42;
				--ending-ambience-sunset-sheen-opacity: 0.18;
	}
}

html.experience-ready,
html.experience-ready body {
	scroll-snap-type: y proximity;
}

html.experience-ready.is-snap-suspended,
html.experience-ready.is-snap-suspended body {
	scroll-snap-type: none;
}

html,
body {
	background-color: var(--page-bg);
}

body {
	color: var(--ink-soft);
	transition: background-color 0.4s ease, color 0.4s ease;
}

.accent-everglades {
	color: var(--accent-green);
}

.theme-toggle-shell {
	left: clamp(1rem, 2vw, 1.7rem);
	position: fixed;
	top: clamp(1rem, 2vw, 1.7rem);
	z-index: 35;
}

.theme-toggle {
	appearance: none;
	background: var(--theme-toggle-bg);
	border: 1px solid var(--theme-toggle-border);
	border-radius: 999px;
	box-shadow: var(--theme-toggle-shadow);
	color: var(--theme-toggle-text);
	cursor: pointer;
	display: inline-grid;
	height: 3.15rem;
	place-items: center;
	padding: 0;
	position: relative;
	transition: transform 0.22s ease, box-shadow 0.22s ease, background-color 0.22s ease, border-color 0.22s ease;
	width: 3.15rem;
	will-change: transform;
}

.theme-toggle:hover,
.theme-toggle:focus-visible {
	box-shadow: var(--theme-toggle-shadow), 0 0 0 0.12rem var(--accent-green-soft);
	transform: translateY(-1px) scale(1.015);
}

.theme-toggle:disabled {
	cursor: default;
	pointer-events: none;
}

.theme-toggle:focus-visible {
	outline: 2px solid var(--accent-green);
	outline-offset: 3px;
}

.theme-toggle__icon {
	display: inline-block;
	height: 1.5rem;
	position: relative;
	transition: transform 0.42s cubic-bezier(0.22, 1, 0.36, 1), filter 0.32s ease;
	transform-origin: center;
	width: 1.5rem;
}

.theme-toggle__sun,
.theme-toggle__moon,
.theme-toggle__stars {
	inset: 0;
	position: absolute;
	transition:
		opacity 0.38s ease,
		transform 0.48s cubic-bezier(0.22, 1, 0.36, 1),
		box-shadow 0.38s ease,
		background-color 0.38s ease,
		filter 0.38s ease;
	transform-origin: center;
}

.theme-toggle__sun {
	background: var(--theme-toggle-sun-fill);
	border-radius: 50%;
	box-shadow:
		0 0 0 0.22rem var(--theme-toggle-sun-glow),
		0 0 1.25rem var(--theme-toggle-sun-glow);
	left: 0.25rem;
	right: 0.25rem;
	top: 0.25rem;
	bottom: 0.25rem;
}

.theme-toggle__sun::before {
	background: var(--theme-toggle-ray);
	border-radius: 999px;
	content: '';
	height: 0.12rem;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 0.12rem;
	box-shadow:
		0 -0.88rem 0 0 var(--theme-toggle-ray),
		0 0.88rem 0 0 var(--theme-toggle-ray),
		0.88rem 0 0 0 var(--theme-toggle-ray),
		-0.88rem 0 0 0 var(--theme-toggle-ray),
		0.62rem 0.62rem 0 0 var(--theme-toggle-ray),
		-0.62rem 0.62rem 0 0 var(--theme-toggle-ray),
		0.62rem -0.62rem 0 0 var(--theme-toggle-ray),
		-0.62rem -0.62rem 0 0 var(--theme-toggle-ray);
	transition: inherit;
}

.theme-toggle:hover .theme-toggle__icon,
.theme-toggle:focus-visible .theme-toggle__icon {
	transform: rotate(6deg) scale(1.03);
}

.theme-toggle:hover .theme-toggle__sun,
.theme-toggle:focus-visible .theme-toggle__sun {
	box-shadow:
		0 0 0 0.24rem var(--theme-toggle-sun-glow),
		0 0 1.05rem var(--theme-toggle-sun-glow);
	transform: scale(1.05) rotate(8deg);
}

.theme-toggle:hover .theme-toggle__sun::before,
.theme-toggle:focus-visible .theme-toggle__sun::before {
	transform: translate(-50%, -50%) rotate(14deg) scale(1.05);
}

:root[data-theme="light"] .theme-toggle:hover .theme-toggle__sun,
:root[data-theme="light"] .theme-toggle:focus-visible .theme-toggle__sun {
	animation: themeToggleSunFloat 1.6s ease-in-out infinite;
}

:root[data-theme="light"] .theme-toggle:hover .theme-toggle__sun::before,
:root[data-theme="light"] .theme-toggle:focus-visible .theme-toggle__sun::before {
	animation: themeToggleSunRayPulse 1.6s ease-in-out infinite;
}

.theme-toggle__moon {
	border-radius: 50%;
	left: 0.22rem;
	right: 0.22rem;
	top: 0.22rem;
	bottom: 0.22rem;
	opacity: 0;
	transform: translateX(0.26rem) scale(0.62) rotate(16deg);
}

.theme-toggle__moon::before,
.theme-toggle__moon::after {
	border-radius: 50%;
	content: '';
	position: absolute;
}

.theme-toggle__moon::before {
	background: var(--theme-toggle-moon-fill);
	inset: 0;
}

.theme-toggle__moon::after {
	background: var(--theme-toggle-moon-shadow);
	height: 100%;
	right: -0.28rem;
	top: -0.05rem;
	width: 100%;
}

.theme-toggle__stars {
	opacity: 0;
	transform: translateY(0.1rem) scale(0.82);
}

.theme-toggle__stars::before,
.theme-toggle__stars::after {
	background: var(--theme-toggle-star);
	border-radius: 50%;
	content: '';
	position: absolute;
	transform-origin: center;
}

.theme-toggle__stars::before {
	box-shadow:
		0.98rem -0.06rem 0 -0.02rem var(--theme-toggle-star),
		0.35rem 1.08rem 0 -0.01rem var(--theme-toggle-star);
	height: 0.12rem;
	left: 0.08rem;
	top: 0.12rem;
	width: 0.12rem;
}

.theme-toggle__stars::after {
	box-shadow:
		0.78rem 0.92rem 0 -0.01rem var(--theme-toggle-star),
		1.12rem 0.36rem 0 -0.03rem var(--theme-toggle-star);
	height: 0.08rem;
	left: 0.18rem;
	top: 0.72rem;
	width: 0.08rem;
}

@keyframes themeToggleTwinkle {
	0%,
	100% {
		opacity: 0.72;
		transform: scale(1);
	}
	50% {
		opacity: 1;
		transform: scale(1.18);
	}
}

@keyframes themeToggleSunFloat {
	0%,
	100% {
		filter: brightness(1);
		transform: scale(1.05) rotate(8deg);
	}
	50% {
		filter: brightness(1.04);
		transform: translateY(-0.03rem) scale(1.08) rotate(11deg);
	}
}

@keyframes themeToggleSunRayPulse {
	0%,
	100% {
		filter: brightness(1);
		transform: translate(-50%, -50%) rotate(14deg) scale(1.05);
	}
	50% {
		filter: brightness(1.04);
		transform: translate(-50%, -50%) rotate(18deg) scale(1.1);
	}
}

@keyframes themeToggleMoonDrift {
	0%,
	100% {
		filter: drop-shadow(0 0 0.22rem rgba(247, 240, 227, 0.12));
		transform: translateY(-0.02rem) scale(1.04) rotate(-6deg);
	}
	50% {
		filter: drop-shadow(0 0 0.3rem rgba(247, 240, 227, 0.18));
		transform: translateY(-0.08rem) scale(1.06) rotate(-9deg);
	}
}

@keyframes themeToggleIconSwap {
	0%,
	100% {
		transform: rotate(0deg) scale(1);
	}
	45% {
		transform: rotate(-10deg) scale(0.94);
	}
	72% {
		transform: rotate(6deg) scale(1.05);
	}
}

@keyframes themeToggleSunToMoon {
	0% {
		opacity: 1;
		transform: translateX(0) scale(1) rotate(0deg);
	}
	44% {
		opacity: 0.92;
		transform: translate(-0.08rem, 0.02rem) scale(0.72) rotate(-18deg);
	}
	100% {
		opacity: 0;
		transform: translate(-0.22rem, 0.12rem) scale(0.42) rotate(-36deg);
	}
}

@keyframes themeToggleSunFromMoon {
	0%,
	28% {
		opacity: 0;
		transform: translate(-0.16rem, 0.1rem) scale(0.42) rotate(-28deg);
	}
	72% {
		opacity: 1;
		transform: translateY(-0.03rem) scale(1.08) rotate(8deg);
	}
	100% {
		opacity: 1;
		transform: translateY(0) scale(1) rotate(0deg);
	}
}

@keyframes themeToggleRaysOut {
	0% {
		opacity: 1;
		transform: translate(-50%, -50%) rotate(0deg) scale(1);
	}
	100% {
		opacity: 0;
		transform: translate(-50%, -50%) rotate(-28deg) scale(0.36);
	}
}

@keyframes themeToggleRaysIn {
	0%,
	34% {
		opacity: 0;
		transform: translate(-50%, -50%) rotate(-28deg) scale(0.38);
	}
	74% {
		opacity: 1;
		transform: translate(-50%, -50%) rotate(12deg) scale(1.1);
	}
	100% {
		opacity: 1;
		transform: translate(-50%, -50%) rotate(0deg) scale(1);
	}
}

@keyframes themeToggleMoonFromSun {
	0%,
	34% {
		opacity: 0;
		transform: translateX(0.28rem) scale(0.52) rotate(18deg);
	}
	74% {
		opacity: 1;
		transform: translate(-0.03rem, -0.02rem) scale(1.07) rotate(-5deg);
	}
	100% {
		opacity: 1;
		transform: translateX(0) scale(1) rotate(0deg);
	}
}

@keyframes themeToggleMoonToSun {
	0% {
		opacity: 1;
		transform: translateX(0) scale(1) rotate(0deg);
	}
	48% {
		opacity: 0.72;
		transform: translate(0.1rem, 0.02rem) scale(0.78) rotate(14deg);
	}
	100% {
		opacity: 0;
		transform: translateX(0.28rem) scale(0.48) rotate(28deg);
	}
}

@keyframes themeToggleStarsInButton {
	0%,
	42% {
		opacity: 0;
		transform: translateY(0.12rem) scale(0.78);
	}
	76% {
		opacity: 1;
		transform: translateY(-0.02rem) scale(1.08);
	}
	100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes themeToggleStarsOutButton {
	0% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
	100% {
		opacity: 0;
		transform: translateY(0.12rem) scale(0.78);
	}
}

:root[data-theme="dark"] .theme-toggle__sun {
	opacity: 0;
	transform: scale(0.62) rotate(-28deg);
}

:root[data-theme="dark"] .theme-toggle__sun::before {
	box-shadow:
		0 -0.42rem 0 0 var(--theme-toggle-ray),
		0 0.42rem 0 0 var(--theme-toggle-ray),
		0.42rem 0 0 0 var(--theme-toggle-ray),
		-0.42rem 0 0 0 var(--theme-toggle-ray),
		0.3rem 0.3rem 0 0 var(--theme-toggle-ray),
		-0.3rem 0.3rem 0 0 var(--theme-toggle-ray),
		0.3rem -0.3rem 0 0 var(--theme-toggle-ray),
		-0.3rem -0.3rem 0 0 var(--theme-toggle-ray);
}

:root[data-theme="dark"] .theme-toggle__moon {
	opacity: 1;
	transform: translateX(0) scale(1) rotate(0deg);
}

:root[data-theme="dark"] .theme-toggle__stars {
	opacity: 1;
	transform: translateY(0) scale(1);
}

:root[data-theme="dark"] .theme-toggle:hover .theme-toggle__icon,
:root[data-theme="dark"] .theme-toggle:focus-visible .theme-toggle__icon {
	transform: rotate(-6deg) scale(1.03);
}

:root[data-theme="dark"] .theme-toggle:hover .theme-toggle__moon,
:root[data-theme="dark"] .theme-toggle:focus-visible .theme-toggle__moon {
	animation: themeToggleMoonDrift 1.9s ease-in-out infinite;
	filter: drop-shadow(0 0 0.22rem rgba(247, 240, 227, 0.12));
	transform: translateY(-0.02rem) scale(1.04) rotate(-6deg);
}

:root[data-theme="dark"] .theme-toggle:hover .theme-toggle__stars,
:root[data-theme="dark"] .theme-toggle:focus-visible .theme-toggle__stars {
	transform: translateY(-0.04rem) scale(1.06);
}

:root[data-theme="dark"] .theme-toggle:hover .theme-toggle__stars::before,
:root[data-theme="dark"] .theme-toggle:focus-visible .theme-toggle__stars::before {
	animation: themeToggleTwinkle 1.45s ease-in-out infinite;
}

:root[data-theme="dark"] .theme-toggle:hover .theme-toggle__stars::after,
:root[data-theme="dark"] .theme-toggle:focus-visible .theme-toggle__stars::after {
	animation: themeToggleTwinkle 1.45s ease-in-out infinite reverse;
}

.theme-toggle.is-animating {
	box-shadow:
		var(--theme-toggle-shadow),
		0 0 0 0.18rem var(--accent-green-soft),
		0 0 2.6rem var(--theme-transition-pulse-ring);
	transform: translateY(-1px) scale(1.04);
}

:root[data-theme] body.is-theme-transitioning .theme-toggle .theme-toggle__icon {
	animation: themeToggleIconSwap 760ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-dark"].is-theme-transitioning .theme-toggle .theme-toggle__sun {
	animation: themeToggleSunToMoon 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-dark"].is-theme-transitioning .theme-toggle .theme-toggle__sun::before {
	animation: themeToggleRaysOut 520ms ease both;
}

:root[data-theme] body[data-theme-transition="to-dark"].is-theme-transitioning .theme-toggle .theme-toggle__moon {
	animation: themeToggleMoonFromSun 760ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-dark"].is-theme-transitioning .theme-toggle .theme-toggle__stars {
	animation: themeToggleStarsInButton 760ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-light"].is-theme-transitioning .theme-toggle .theme-toggle__sun {
	animation: themeToggleSunFromMoon 760ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-light"].is-theme-transitioning .theme-toggle .theme-toggle__sun::before {
	animation: themeToggleRaysIn 680ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-light"].is-theme-transitioning .theme-toggle .theme-toggle__moon {
	animation: themeToggleMoonToSun 700ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

:root[data-theme] body[data-theme-transition="to-light"].is-theme-transitioning .theme-toggle .theme-toggle__stars {
	animation: themeToggleStarsOutButton 520ms ease both;
}

.theme-transition-layer {
	contain: paint;
	inset: 0;
	isolation: isolate;
	opacity: 0;
	overflow: hidden;
	pointer-events: none;
	position: fixed;
	transition:
		opacity 640ms cubic-bezier(0.16, 1, 0.3, 1),
		visibility 0s linear 640ms;
	visibility: hidden;
	will-change: opacity;
	z-index: 1;
}

.theme-transition-layer::before {
	background:
		radial-gradient(ellipse at 50% 102%, rgba(74, 54, 48, 0.32), transparent 42%),
		linear-gradient(180deg, rgba(16, 10, 12, 0.08), rgba(16, 10, 12, 0.82));
	content: '';
	inset: -8%;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	z-index: 3;
}

body.is-theme-transitioning .theme-transition-layer {
	opacity: 1;
	transition:
		opacity 220ms ease,
		visibility 0s linear 0s;
	visibility: visible;
}

body.is-theme-transitioning::before,
body.is-theme-transitioning.ending-afterglow::before,
body.is-theme-transitioning.ending-afterglow-exit::before {
	filter: var(--theme-transition-frozen-background-filter, var(--background-filter, none));
	opacity: var(--theme-transition-frozen-background-opacity, var(--background-opacity, 1));
	transform: var(--theme-transition-frozen-background-transform, scale(1));
	transition:
		opacity var(--theme-content-transition-duration) var(--theme-content-transition-ease),
		transform var(--theme-content-transition-duration) var(--theme-content-transition-ease);
	will-change: opacity, transform;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer::before {
	animation: themeTransitionDarkVeil var(--theme-transition-duration) cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.is-theme-transitioning {
	transition-delay: 0ms !important;
	transition-duration: var(--theme-content-transition-duration) !important;
	transition-property: background-color !important;
	transition-timing-function: var(--theme-content-transition-ease) !important;
}

html.is-theme-transitioning {
	transition-delay: 0ms !important;
	transition-duration: var(--theme-content-transition-duration) !important;
	transition-property: background-color !important;
	transition-timing-function: var(--theme-content-transition-ease) !important;
}

body.is-theme-transitioning .site-wrapper,
body.is-theme-transitioning .site-wrapper *,
body.is-theme-transitioning .site-wrapper *::before,
body.is-theme-transitioning .site-wrapper *::after,
body.is-theme-transitioning .section-progress,
body.is-theme-transitioning .section-progress *,
body.is-theme-transitioning .section-progress *::before,
body.is-theme-transitioning .section-progress *::after,
body.is-theme-transitioning .soundtrack-shell,
body.is-theme-transitioning .soundtrack-shell *,
body.is-theme-transitioning .soundtrack-shell *::before,
body.is-theme-transitioning .soundtrack-shell *::after {
	transition-delay: 0ms !important;
	transition-duration: var(--theme-content-transition-duration) !important;
	transition-property: background-color, border-color, fill, stroke, outline-color !important;
	transition-timing-function: var(--theme-content-transition-ease) !important;
}

body.is-theme-transitioning .journey-card,
body.is-theme-transitioning .project-card,
body.is-theme-transitioning .outro-panel,
body.is-theme-transitioning .soundtrack-prompt,
body.is-theme-transitioning .journey-highlight__surface,
body.is-theme-transitioning .scroll-cue,
body.is-theme-transitioning .section-progress,
body.is-theme-transitioning .soundtrack-drawer {
	-webkit-backdrop-filter: none !important;
	backdrop-filter: none !important;
}

body.is-theme-transitioning .journey-highlight__surface::before,
body.is-theme-transitioning .journey-highlight__surface::after,
body.is-theme-transitioning .journey-highlight__foil,
body.is-theme-transitioning .journey-highlight__grain,
body.is-theme-transitioning .journey-highlight__atropos .atropos-shadow,
body.is-theme-transitioning .journey-highlight__atropos .atropos-highlight {
	opacity: 0 !important;
}

body.is-theme-transitioning .site-wrapper :is(h1, h2, h3, h4, h5, h6, p, span, a, strong, em, b, i, small, li, dt, dd, blockquote, cite, time, mark),
body.is-theme-transitioning .site-wrapper :is(h1, h2, h3, h4, h5, h6, p, span, a, strong, em, b, i, small, li, dt, dd, blockquote, cite, time, mark)::before,
body.is-theme-transitioning .site-wrapper :is(h1, h2, h3, h4, h5, h6, p, span, a, strong, em, b, i, small, li, dt, dd, blockquote, cite, time, mark)::after,
body.is-theme-transitioning .section-progress__label {
	transition:
		color var(--theme-text-transition-duration) ease,
		text-decoration-color var(--theme-text-transition-duration) ease !important;
}

/* Preserve ending text motion while the global theme color transition is active. */
body.is-theme-transitioning .site-wrapper .outro-copy {
	transition:
		filter 1.35s ease,
		opacity 1.35s ease,
		transform 0.72s cubic-bezier(0.22, 1, 0.36, 1),
		max-height 0.58s cubic-bezier(0.22, 1, 0.36, 1),
		margin 0.58s cubic-bezier(0.22, 1, 0.36, 1),
		padding-bottom 0.58s cubic-bezier(0.22, 1, 0.36, 1),
		color var(--theme-text-transition-duration) ease !important;
}

body.is-theme-transitioning .site-wrapper .outro-copy span.p {
	transition:
		opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1),
		filter 1.4s ease,
		transform 1.55s cubic-bezier(0.22, 1, 0.36, 1),
		color var(--theme-text-transition-duration) ease !important;
}

body.is-theme-transitioning .site-wrapper .outro-copy.is-dissolved span.p:first-child {
	transition-delay: 0.1s !important;
}

body.is-theme-transitioning .site-wrapper .outro-copy.is-dissolved span.p:last-child {
	transition-delay: 0.24s !important;
}

body.is-theme-transitioning .site-wrapper .outro-quote-stage {
	transition:
		opacity 0.4s ease,
		filter 0.52s ease,
		transform 0.58s cubic-bezier(0.22, 1, 0.36, 1),
		color var(--theme-text-transition-duration) ease !important;
}

body.is-theme-transitioning .site-wrapper .outro-quote-stage__quote,
body.is-theme-transitioning .site-wrapper .outro-quote-stage__quote::before,
body.is-theme-transitioning .site-wrapper .outro-quote-stage__quote::after,
body.is-theme-transitioning .site-wrapper .outro-quote-stage__source {
	transition:
		color var(--theme-text-transition-duration) ease,
		text-decoration-color var(--theme-text-transition-duration) ease !important;
}

body.is-theme-transitioning .site-wrapper .outro-quote-stage__next {
	transition:
		background-color 0.25s ease,
		border-color 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.25s ease,
		opacity 0.25s ease,
		color var(--theme-text-transition-duration) ease !important;
}

body[data-theme-transition="to-dark"] {
	--theme-transition-sky-top: rgba(72, 100, 165, 0.22);
	--theme-transition-sky-mid: rgba(138, 82, 110, 0.3);
	--theme-transition-sky-bottom: rgba(8, 11, 18, 0.92);
	--theme-transition-horizon-glow: rgba(255, 161, 99, 0.44);
	--theme-transition-pulse-core: rgba(255, 234, 192, 0.76);
	--theme-transition-pulse-ring: rgba(255, 171, 104, 0.3);
	--theme-transition-trail: rgba(255, 198, 136, 0.28);
	--theme-transition-star: rgba(246, 239, 227, 0.94);
}

body[data-theme-transition="to-dark"] .theme-toggle {
	--theme-toggle-bg: rgba(21, 17, 18, 0.52);
	--theme-toggle-border: rgba(244, 238, 228, 0.075);
	--theme-toggle-shadow: none;
	--theme-toggle-text: rgba(244, 238, 228, 0.72);
	--theme-toggle-sun-fill: linear-gradient(135deg, #F8E5A5, #DAB16B);
	--theme-toggle-sun-glow: rgba(248, 229, 165, 0.18);
	--theme-toggle-ray: rgba(248, 229, 165, 0.56);
	--theme-toggle-moon-fill: #F7F0E3;
	--theme-toggle-moon-shadow: rgba(7, 9, 11, 0.92);
	--theme-toggle-star: rgba(247, 240, 227, 0.9);
}

body[data-theme-transition="to-light"] {
	--theme-transition-sky-top: rgba(177, 216, 255, 0.28);
	--theme-transition-sky-mid: rgba(255, 219, 182, 0.34);
	--theme-transition-sky-bottom: rgba(255, 241, 218, 0.88);
	--theme-transition-horizon-glow: rgba(255, 190, 118, 0.52);
	--theme-transition-pulse-core: rgba(244, 240, 228, 0.74);
	--theme-transition-pulse-ring: rgba(173, 203, 255, 0.24);
	--theme-transition-trail: rgba(255, 221, 176, 0.34);
	--theme-transition-star: rgba(255, 255, 255, 0.84);
}

body[data-theme-transition="to-light"] .theme-toggle {
	--theme-toggle-bg: rgba(243, 239, 232, 0.48);
	--theme-toggle-border: rgba(72, 62, 54, 0.08);
	--theme-toggle-shadow: none;
	--theme-toggle-text: rgba(66, 61, 65, 0.68);
	--theme-toggle-sun-fill: linear-gradient(135deg, #F7DA76, #EDA63A);
	--theme-toggle-sun-glow: rgba(237, 166, 58, 0.28);
	--theme-toggle-ray: rgba(237, 166, 58, 0.72);
	--theme-toggle-moon-fill: #F5EEDF;
	--theme-toggle-moon-shadow: rgba(210, 191, 166, 0.84);
	--theme-toggle-star: rgba(255, 255, 255, 0.94);
}

/* Keep ending ambience colors stable while the layer fades out during theme swaps. */
body[data-theme-transition="to-dark"].is-theme-transitioning:is(.outro-ambience-active, .ending-afterglow) {
	--ambient-blob-one: rgba(46, 93, 69, 0.14);
	--ambient-blob-two: rgba(112, 110, 112, 0.12);
	--ambient-blob-three: rgba(74, 70, 74, 0.08);
	--ambient-sweep-left: rgba(46, 93, 69, 0.12);
	--ambient-sweep-right: rgba(126, 118, 126, 0.1);
	--ambient-core: rgba(255, 255, 255, 0.12);
	--afterglow-horizon: rgba(255, 188, 132, 0.28);
	--afterglow-core: rgba(255, 161, 92, 0.2);
	--afterglow-haze: rgba(255, 223, 188, 0.24);
	--afterglow-sheen: rgba(255, 246, 225, 0.16);
	--afterglow-filter: saturate(1.08) hue-rotate(-6deg) brightness(1.02) contrast(1);
	--afterglow-dot-filter: saturate(1.08) hue-rotate(-7deg) brightness(1.02) contrast(1);
	--ambient-dawn-horizon: rgba(255, 240, 214, 0.4);
	--ambient-dawn-core: rgba(255, 204, 150, 0.42);
	--ambient-dawn-mist: rgba(255, 180, 126, 0.24);
	--ambient-dawn-trace: rgba(255, 231, 202, 0.24);
	--ambient-sunset-horizon: rgba(255, 208, 166, 0.36);
	--ambient-sunset-core: rgba(239, 154, 110, 0.34);
	--ambient-sunset-mist: rgba(183, 126, 140, 0.18);
	--ambient-sunset-trace: rgba(255, 219, 191, 0.18);
}

body[data-theme-transition="to-light"].is-theme-transitioning:is(.outro-ambience-active, .ending-afterglow) {
	--ambient-blob-one: rgba(115, 175, 137, 0.16);
	--ambient-blob-two: rgba(140, 130, 147, 0.12);
	--ambient-blob-three: rgba(236, 230, 221, 0.07);
	--ambient-sweep-left: rgba(115, 175, 137, 0.12);
	--ambient-sweep-right: rgba(149, 139, 156, 0.1);
	--ambient-core: rgba(255, 255, 255, 0.05);
	--afterglow-horizon: rgba(255, 163, 87, 0.3);
	--afterglow-core: rgba(255, 204, 124, 0.22);
	--afterglow-haze: rgba(212, 113, 78, 0.2);
	--afterglow-sheen: rgba(255, 219, 161, 0.15);
	--afterglow-filter: saturate(0.94) hue-rotate(-10deg) brightness(0.62) contrast(1.05);
	--afterglow-dot-filter: saturate(0.92) hue-rotate(-11deg) brightness(0.58) contrast(1.05);
	--ambient-dawn-horizon: rgba(255, 204, 142, 0.38);
	--ambient-dawn-core: rgba(255, 154, 90, 0.42);
	--ambient-dawn-mist: rgba(255, 218, 172, 0.16);
	--ambient-dawn-trace: rgba(255, 236, 206, 0.18);
	--ambient-sunset-horizon: rgba(255, 170, 107, 0.32);
	--ambient-sunset-core: rgba(208, 98, 82, 0.34);
	--ambient-sunset-mist: rgba(124, 92, 158, 0.22);
	--ambient-sunset-trace: rgba(255, 206, 168, 0.16);
}

.theme-transition-layer__sky,
.theme-transition-layer__phase,
.theme-transition-layer__glow,
.theme-transition-layer__stars,
.theme-transition-layer__pulse {
	backface-visibility: hidden;
	position: absolute;
	transform: translateZ(0);
	z-index: 1;
}

.theme-transition-layer__stars,
.theme-transition-layer__pulse {
	z-index: 4;
}

.theme-transition-layer__sky {
	inset: -10%;
	background:
		radial-gradient(ellipse at 50% 108%, var(--theme-transition-horizon-glow), transparent 34%),
		linear-gradient(180deg, var(--theme-transition-sky-top) 0%, var(--theme-transition-sky-mid) 40%, var(--theme-transition-sky-bottom) 100%);
	filter: blur(0.38rem) saturate(1.08);
	opacity: 0;
	transform: scale(1.05) translate3d(0, -4%, 0);
}

.theme-transition-layer__phase {
	display: none;
	inset: -12%;
	filter: saturate(1.04);
	opacity: 0;
	transform: scale(1.045) translate3d(0, 0, 0);
}

body.is-theme-transitioning .theme-transition-layer__phase {
	will-change: opacity;
}

.theme-transition-layer__phase--dawn {
	background:
		radial-gradient(circle at 22% 26%, rgba(255, 204, 172, 0.24), transparent 22%),
		radial-gradient(circle at 68% 76%, rgba(255, 230, 188, 0.18), transparent 26%),
		linear-gradient(180deg, rgba(148, 191, 255, 0.22) 0%, rgba(190, 210, 255, 0.2) 24%, rgba(255, 218, 182, 0.24) 52%, rgba(255, 232, 200, 0.32) 76%, rgba(255, 242, 220, 0.42) 100%);
}

.theme-transition-layer__phase--mist {
	background:
		radial-gradient(circle at 28% 24%, rgba(255, 244, 228, 0.16), transparent 18%),
		radial-gradient(circle at 74% 18%, rgba(185, 212, 255, 0.14), transparent 22%),
		linear-gradient(180deg, rgba(156, 193, 246, 0.14) 0%, rgba(206, 219, 240, 0.16) 28%, rgba(236, 230, 235, 0.18) 56%, rgba(255, 238, 219, 0.24) 100%);
}

.theme-transition-layer__phase--pearl {
	background:
		radial-gradient(circle at 24% 30%, rgba(255, 237, 209, 0.18), transparent 20%),
		radial-gradient(circle at 74% 20%, rgba(201, 225, 255, 0.16), transparent 24%),
		linear-gradient(180deg, rgba(197, 223, 255, 0.2) 0%, rgba(255, 235, 207, 0.26) 48%, rgba(255, 245, 226, 0.34) 100%);
}

.theme-transition-layer__phase--midday {
	background:
		radial-gradient(circle at 78% 18%, rgba(197, 223, 255, 0.18), transparent 24%),
		radial-gradient(circle at 32% 82%, rgba(255, 240, 214, 0.14), transparent 26%),
		linear-gradient(180deg, rgba(189, 220, 255, 0.24) 0%, rgba(248, 238, 220, 0.22) 54%, rgba(255, 246, 230, 0.34) 100%);
}

.theme-transition-layer__phase--golden {
	background:
		radial-gradient(circle at 28% 24%, rgba(255, 214, 148, 0.22), transparent 18%),
		radial-gradient(circle at 70% 78%, rgba(255, 178, 110, 0.16), transparent 22%),
		linear-gradient(180deg, rgba(255, 214, 164, 0.16) 0%, rgba(255, 175, 114, 0.28) 48%, rgba(220, 112, 82, 0.34) 100%);
}

.theme-transition-layer__phase--amber {
	background:
		radial-gradient(circle at 26% 22%, rgba(255, 202, 136, 0.18), transparent 18%),
		radial-gradient(circle at 74% 74%, rgba(227, 126, 94, 0.14), transparent 24%),
		linear-gradient(180deg, rgba(255, 195, 131, 0.14) 0%, rgba(240, 144, 98, 0.24) 46%, rgba(176, 92, 92, 0.3) 100%);
}

.theme-transition-layer__phase--sunset {
	background:
		radial-gradient(ellipse at 22% 22%, rgba(255, 191, 133, 0.13), transparent 28%),
		radial-gradient(ellipse at 76% 76%, rgba(183, 94, 119, 0.12), transparent 34%),
		linear-gradient(180deg, rgba(255, 198, 144, 0.1) 0%, rgba(246, 166, 114, 0.17) 24%, rgba(223, 118, 89, 0.27) 52%, rgba(171, 98, 125, 0.28) 76%, rgba(101, 76, 135, 0.32) 100%);
	filter: saturate(1.08);
}

.theme-transition-layer__phase--rose {
	background:
		radial-gradient(circle at 24% 24%, rgba(255, 187, 152, 0.16), transparent 18%),
		radial-gradient(circle at 74% 74%, rgba(186, 117, 154, 0.16), transparent 24%),
		linear-gradient(180deg, rgba(248, 183, 151, 0.12) 0%, rgba(222, 151, 149, 0.16) 24%, rgba(194, 122, 149, 0.22) 52%, rgba(132, 96, 142, 0.24) 74%, rgba(78, 72, 132, 0.34) 100%);
}

.theme-transition-layer__phase--twilight {
	background:
		radial-gradient(circle at 74% 22%, rgba(255, 168, 116, 0.16), transparent 18%),
		radial-gradient(circle at 18% 72%, rgba(108, 122, 208, 0.18), transparent 24%),
		linear-gradient(180deg, rgba(93, 114, 198, 0.16) 0%, rgba(118, 93, 168, 0.22) 30%, rgba(88, 73, 146, 0.26) 58%, rgba(45, 47, 104, 0.32) 80%, rgba(26, 31, 84, 0.38) 100%);
}

.theme-transition-layer__phase--bluehour {
	background:
		radial-gradient(circle at 28% 24%, rgba(120, 143, 226, 0.14), transparent 18%),
		radial-gradient(circle at 72% 72%, rgba(42, 57, 128, 0.16), transparent 24%),
		linear-gradient(180deg, rgba(71, 93, 182, 0.14) 0%, rgba(46, 57, 128, 0.26) 46%, rgba(15, 22, 58, 0.38) 100%);
}

.theme-transition-layer__phase--indigo {
	background:
		radial-gradient(circle at 30% 20%, rgba(104, 118, 205, 0.12), transparent 18%),
		radial-gradient(circle at 70% 78%, rgba(34, 39, 93, 0.18), transparent 22%),
		linear-gradient(180deg, rgba(56, 68, 146, 0.12) 0%, rgba(28, 34, 96, 0.24) 44%, rgba(9, 13, 38, 0.34) 100%);
}

.theme-transition-layer__phase--moonwash {
	background:
		radial-gradient(circle at 32% 22%, rgba(165, 188, 255, 0.1), transparent 18%),
		radial-gradient(circle at 70% 76%, rgba(80, 92, 166, 0.14), transparent 24%),
		linear-gradient(180deg, rgba(128, 149, 220, 0.1) 0%, rgba(86, 103, 182, 0.12) 28%, rgba(52, 62, 132, 0.16) 56%, rgba(22, 28, 74, 0.22) 78%, rgba(7, 10, 28, 0.3) 100%);
}

.theme-transition-layer__phase--night {
	background:
		radial-gradient(circle at 26% 18%, rgba(86, 105, 176, 0.12), transparent 18%),
		radial-gradient(circle at 72% 82%, rgba(24, 30, 66, 0.2), transparent 26%),
		linear-gradient(180deg, rgba(20, 28, 58, 0.16) 0%, rgba(10, 15, 35, 0.38) 54%, rgba(5, 8, 20, 0.52) 100%);
}

.theme-transition-layer__glow {
	inset: -16%;
	background:
		radial-gradient(circle at var(--theme-transition-origin-x) var(--theme-transition-origin-y), var(--theme-transition-pulse-ring) 0%, transparent 18%),
		radial-gradient(ellipse at 50% 104%, var(--theme-transition-horizon-glow), transparent 32%),
		linear-gradient(118deg, transparent 20%, var(--theme-transition-trail) 50%, transparent 82%);
	filter: blur(32px) saturate(1.16);
	mix-blend-mode: screen;
	opacity: 0;
	transform: scale(0.94) translate3d(0, 2.5%, 0);
}

.theme-transition-layer__stars {
	inset: 0;
	background-image:
		radial-gradient(circle at 12% 22%, var(--theme-transition-star) 0 1.15px, transparent 2.2px),
		radial-gradient(circle at 23% 14%, var(--theme-transition-star) 0 1.1px, transparent 2px),
		radial-gradient(circle at 38% 26%, var(--theme-transition-star) 0 1.3px, transparent 2.35px),
		radial-gradient(circle at 52% 12%, var(--theme-transition-star) 0 1.05px, transparent 2px),
		radial-gradient(circle at 67% 20%, var(--theme-transition-star) 0 1.2px, transparent 2.1px),
		radial-gradient(circle at 82% 16%, var(--theme-transition-star) 0 1.05px, transparent 1.95px),
		radial-gradient(circle at 76% 30%, var(--theme-transition-star) 0 1.25px, transparent 2.25px),
		radial-gradient(circle at 58% 34%, var(--theme-transition-star) 0 0.95px, transparent 1.8px),
		radial-gradient(circle at 29% 32%, var(--theme-transition-star) 0 1.05px, transparent 1.95px);
	filter: drop-shadow(0 0 0.4rem rgba(255, 255, 255, 0.14));
	opacity: 0;
	transform: scale(1.02);
}

.theme-transition-layer__pulse {
	border-radius: 50%;
	height: var(--theme-transition-pulse-size);
	left: var(--theme-transition-origin-x);
	top: var(--theme-transition-origin-y);
	transform: translate(-50%, -50%) scale(0.18);
	width: var(--theme-transition-pulse-size);
	background:
		radial-gradient(circle, var(--theme-transition-pulse-core) 0%, var(--theme-transition-pulse-ring) 26%, rgba(255, 255, 255, 0.06) 42%, transparent 70%);
	filter: blur(0.14rem);
	opacity: 0;
}

body.is-theme-transitioning .theme-transition-layer__pulse {
	animation: themeTransitionPulse var(--theme-transition-duration) cubic-bezier(0.22, 1, 0.36, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__sky {
	animation: themeTransitionSkyFall var(--theme-transition-duration) cubic-bezier(0.22, 1, 0.36, 1) both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__sky {
	animation: themeTransitionSkyRise var(--theme-transition-duration) cubic-bezier(0.22, 1, 0.36, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--midday {
	animation: themeTransitionDarkMidday var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--dawn {
	animation: themeTransitionDarkDawn var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--mist {
	animation: themeTransitionDarkMist var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--pearl {
	animation: themeTransitionDarkPearl var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--golden {
	animation: themeTransitionDarkGolden var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--amber {
	animation: themeTransitionDarkAmber var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--sunset {
	animation: themeTransitionDarkSunset var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--rose {
	animation: themeTransitionDarkRose var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--twilight {
	animation: themeTransitionDarkTwilight var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--bluehour {
	animation: themeTransitionDarkBluehour var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--indigo {
	animation: themeTransitionDarkIndigo var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--moonwash {
	animation: themeTransitionDarkMoonwash var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__phase--night {
	animation: themeTransitionDarkNight var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--night {
	animation: themeTransitionLightNight var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--moonwash {
	animation: themeTransitionLightMoonwash var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--indigo {
	animation: themeTransitionLightIndigo var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--bluehour {
	animation: themeTransitionLightBluehour var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--twilight {
	animation: themeTransitionLightTwilight var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--rose {
	animation: themeTransitionLightRose var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--mist {
	animation: themeTransitionLightMist var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--dawn {
	animation: themeTransitionLightDawn var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--pearl {
	animation: themeTransitionLightPearl var(--theme-transition-duration) linear both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__phase--midday {
	animation: themeTransitionLightMidday var(--theme-transition-duration) linear both;
}

body.is-theme-transitioning .theme-transition-layer__glow {
	animation: themeTransitionGlow var(--theme-transition-duration) cubic-bezier(0.22, 1, 0.36, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning .theme-transition-layer__stars {
	animation: themeTransitionStarsIn var(--theme-transition-duration) ease both;
}

body[data-theme-transition="to-light"].is-theme-transitioning .theme-transition-layer__stars {
	animation: themeTransitionStarsOut var(--theme-transition-duration) ease both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning:not(.outro-ambience-active):not(.outro-ambience-reactive):not(.ending-afterglow):not(.ending-afterglow-exit) .ambient-overlay {
	animation: themeAmbientOverlayToDark var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning:not(.outro-ambience-active):not(.outro-ambience-reactive):not(.ending-afterglow):not(.ending-afterglow-exit) .ambient-overlay::before {
	animation: themeAmbientOverlayBeforeToDark var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning:not(.outro-ambience-active):not(.outro-ambience-reactive):not(.ending-afterglow):not(.ending-afterglow-exit) .ambient-overlay::after {
	animation: themeAmbientOverlayAfterToDark var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-light"].is-theme-transitioning:not(.outro-ambience-active):not(.outro-ambience-reactive):not(.ending-afterglow):not(.ending-afterglow-exit) .ambient-overlay {
	animation: themeAmbientOverlayToLight var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-light"].is-theme-transitioning:not(.outro-ambience-active):not(.outro-ambience-reactive):not(.ending-afterglow):not(.ending-afterglow-exit) .ambient-overlay::before {
	animation: themeAmbientOverlayBeforeToLight var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-light"].is-theme-transitioning:not(.outro-ambience-active):not(.outro-ambience-reactive):not(.ending-afterglow):not(.ending-afterglow-exit) .ambient-overlay::after {
	animation: themeAmbientOverlayAfterToLight var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.outro-ambience-active .ambient-overlay {
	animation: themeEndingAmbienceOverlayReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.outro-ambience-active .ambient-overlay::before {
	animation: themeEndingAmbienceBeforeReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.outro-ambience-active .ambient-overlay::after {
	animation: themeEndingAmbienceAfterReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--dawn {
	animation: themeEndingDawnReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--sunset {
	animation: themeEndingSunsetReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.outro-ambience-active .ambient-overlay__palette::before,
body.is-theme-transitioning.outro-ambience-active .ambient-overlay__palette::after {
	animation-play-state: paused;
}

body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--dawn {
	animation: themeEndingDawnToLight var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--sunset {
	animation: themeEndingSunsetToLight var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--dawn {
	animation: themeEndingDawnToDark var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--sunset {
	animation: themeEndingSunsetToDark var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.ending-afterglow .ambient-overlay__afterglow--bloom {
	animation: themeEndingAfterglowBloomReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-transitioning.ending-afterglow .ambient-overlay__afterglow--sheen {
	animation: themeEndingAfterglowSheenReset var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay,
body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay {
	--theme-ambience-suspend-opacity: var(--ending-ambience-overlay-opacity, var(--theme-ending-ambience-overlay-opacity, 0.6));
	animation: themeEndingAmbienceSuspend var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay::before,
body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay::before {
	--theme-ambience-suspend-opacity: var(--theme-ending-ambience-before-opacity, 0.6);
	animation: themeEndingAmbienceSuspend var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay::after,
body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay::after {
	--theme-ambience-suspend-opacity: var(--theme-ending-ambience-after-opacity, 0.35);
	animation: themeEndingAmbienceSuspend var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--dawn,
body[data-theme-transition="to-dark"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--sunset,
body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--dawn,
body[data-theme-transition="to-light"].is-theme-transitioning.outro-ambience-active .ambient-overlay__palette--sunset {
	--theme-palette-suspend-opacity: var(--ending-ambience-unlock-progress, 1);
	animation: themeEndingPaletteSuspend var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.ending-afterglow .ambient-overlay__afterglow--bloom,
body[data-theme-transition="to-light"].is-theme-transitioning.ending-afterglow .ambient-overlay__afterglow--bloom {
	--theme-afterglow-suspend-opacity: 0.74;
	animation: themeEndingAfterglowSuspend var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body[data-theme-transition="to-dark"].is-theme-transitioning.ending-afterglow .ambient-overlay__afterglow--sheen,
body[data-theme-transition="to-light"].is-theme-transitioning.ending-afterglow .ambient-overlay__afterglow--sheen {
	--theme-afterglow-suspend-opacity: 0.36;
	animation: themeEndingAfterglowSuspend var(--theme-transition-duration) cubic-bezier(0.32, 0, 0.2, 1) both;
}

body.is-theme-ambience-returning.outro-ambience-active .ambient-overlay {
	--theme-ambience-return-opacity: var(--ending-ambience-overlay-opacity, var(--theme-ending-ambience-overlay-opacity, 0.6));
	animation: themeEndingAmbienceReturn 1800ms cubic-bezier(0.23, 1, 0.32, 1) both;
}

body.is-theme-ambience-returning.outro-ambience-active .ambient-overlay::before {
	--theme-ambience-return-opacity: var(--theme-ending-ambience-before-opacity, 0.6);
	animation: themeEndingAmbienceReturn 1800ms cubic-bezier(0.23, 1, 0.32, 1) both;
}

body.is-theme-ambience-returning.outro-ambience-active .ambient-overlay::after {
	--theme-ambience-return-opacity: var(--theme-ending-ambience-after-opacity, 0.35);
	animation: themeEndingAmbienceReturn 1800ms cubic-bezier(0.23, 1, 0.32, 1) both;
}

body.is-theme-ambience-returning.outro-ambience-active .ambient-overlay__palette {
	--theme-palette-return-opacity: var(--ending-ambience-unlock-progress, 1);
	animation: themeEndingPaletteReturn 1800ms cubic-bezier(0.23, 1, 0.32, 1) both;
}

body.is-theme-ambience-returning.ending-afterglow .ambient-overlay__afterglow--bloom {
	--theme-afterglow-return-opacity: 0.74;
	animation: themeEndingAfterglowReturn 1800ms cubic-bezier(0.23, 1, 0.32, 1) both;
}

body.is-theme-ambience-returning.ending-afterglow .ambient-overlay__afterglow--sheen {
	--theme-afterglow-return-opacity: 0.36;
	animation: themeEndingAfterglowReturn 1800ms cubic-bezier(0.23, 1, 0.32, 1) both;
}

@keyframes themeTransitionPulse {
	0% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(0.16);
	}
	14% {
		opacity: 0.8;
	}
	42% {
		opacity: 0.34;
		transform: translate(-50%, -50%) scale(1.72);
	}
	100% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(2.25);
	}
}

@keyframes themeTransitionSkyFall {
	0% {
		opacity: 0;
		transform: scale(1.06) translate3d(0, -4%, 0);
	}
	18% {
		opacity: 0.4;
	}
	34% {
		opacity: 0.66;
		transform: scale(1.01) translate3d(0, 0, 0);
	}
	54%,
	68% {
		opacity: 0.62;
		transform: scale(1.006) translate3d(0, 0.4%, 0);
	}
	82% {
		opacity: 0.34;
		transform: scale(1.002) translate3d(0, 1.1%, 0);
	}
	92% {
		opacity: 0.22;
		transform: scale(1.001) translate3d(0, 1.45%, 0);
	}
	100% {
		opacity: 0;
		transform: scale(1) translate3d(0, 1.7%, 0);
	}
}

@keyframes themeTransitionSkyRise {
	0% {
		opacity: 0;
		transform: scale(1.05) translate3d(0, 4%, 0);
	}
	18% {
		opacity: 0.42;
	}
	34% {
		opacity: 0.64;
		transform: scale(1.008) translate3d(0, 0, 0);
	}
	54% {
		opacity: 0.46;
		transform: scale(1.005) translate3d(0, -0.5%, 0);
	}
	74% {
		opacity: 0.22;
		transform: scale(1.002) translate3d(0, -1.2%, 0);
	}
	100% {
		opacity: 0;
		transform: scale(1) translate3d(0, -2%, 0);
	}
}

@keyframes themeTransitionGlow {
	0% {
		opacity: 0;
		transform: scale(0.92) translate3d(0, 4%, 0);
	}
	18% {
		opacity: 0.32;
	}
	34% {
		opacity: 0.44;
		transform: scale(1.01) translate3d(0, 0, 0);
	}
	54% {
		opacity: 0.3;
		transform: scale(1.018) translate3d(0, -0.3%, 0);
	}
	76% {
		opacity: 0.14;
		transform: scale(1.026) translate3d(0, -0.8%, 0);
	}
	100% {
		opacity: 0;
		transform: scale(1.03) translate3d(0, -1.2%, 0);
	}
}

@keyframes themeTransitionDarkVeil {
	0% {
		opacity: 0;
	}
	20% {
		opacity: 0.12;
	}
	36% {
		opacity: 0.42;
	}
	46% {
		opacity: 0.58;
	}
	58%,
	72% {
		opacity: 0.66;
	}
	88% {
		opacity: 0.56;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkDawn {
	0%,
	8% {
		opacity: 0.22;
		transform: scale(1.045) translate3d(0, 0, 0);
	}
	22% {
		opacity: 0.12;
		transform: scale(1.025) translate3d(0, 1.4%, 0);
	}
	36%,
	100% {
		opacity: 0;
		transform: scale(1.01) translate3d(0, 3.2%, 0);
	}
}

@keyframes themeTransitionDarkMidday {
	0% {
		opacity: 0.18;
	}
	12% {
		opacity: 0.22;
	}
	24% {
		opacity: 0.25;
	}
	40% {
		opacity: 0.16;
	}
	54% {
		opacity: 0.06;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkMist {
	0%,
	4% {
		opacity: 0;
	}
	16% {
		opacity: 0.14;
	}
	30% {
		opacity: 0.18;
	}
	44% {
		opacity: 0.17;
	}
	58% {
		opacity: 0.06;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkPearl {
	0%,
	10% {
		opacity: 0;
	}
	22% {
		opacity: 0.16;
	}
	36% {
		opacity: 0.2;
	}
	50% {
		opacity: 0.18;
	}
	64% {
		opacity: 0.08;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkGolden {
	0%,
	18% {
		opacity: 0;
	}
	32% {
		opacity: 0.2;
	}
	46% {
		opacity: 0.26;
	}
	60% {
		opacity: 0.22;
	}
	74% {
		opacity: 0.08;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkAmber {
	0%,
	24% {
		opacity: 0;
	}
	38% {
		opacity: 0.16;
	}
	52% {
		opacity: 0.27;
	}
	66% {
		opacity: 0.24;
	}
	78% {
		opacity: 0.14;
	}
	90% {
		opacity: 0.05;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkSunset {
	0%,
	22% {
		opacity: 0;
	}
	30% {
		opacity: 0.04;
	}
	38% {
		opacity: 0.11;
	}
	48% {
		opacity: 0.21;
	}
	60% {
		opacity: 0.3;
	}
	72% {
		opacity: 0.31;
	}
	84% {
		opacity: 0.22;
	}
	94% {
		opacity: 0.09;
	}
	98% {
		opacity: 0.03;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkRose {
	0%,
	34% {
		opacity: 0;
	}
	46% {
		opacity: 0.1;
	}
	58% {
		opacity: 0.2;
	}
	70% {
		opacity: 0.25;
	}
	82% {
		opacity: 0.23;
	}
	90% {
		opacity: 0.14;
	}
	97% {
		opacity: 0.06;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkTwilight {
	0%,
	46% {
		opacity: 0;
	}
	58% {
		opacity: 0.12;
	}
	68% {
		opacity: 0.18;
	}
	78% {
		opacity: 0.22;
	}
	86% {
		opacity: 0.2;
	}
	92% {
		opacity: 0.15;
	}
	97% {
		opacity: 0.08;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkBluehour {
	0%,
	54% {
		opacity: 0;
	}
	66% {
		opacity: 0.1;
	}
	76% {
		opacity: 0.16;
	}
	84% {
		opacity: 0.2;
	}
	90% {
		opacity: 0.2;
	}
	96% {
		opacity: 0.06;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkIndigo {
	0%,
	62% {
		opacity: 0;
	}
	74% {
		opacity: 0.09;
	}
	84% {
		opacity: 0.14;
	}
	91% {
		opacity: 0.18;
	}
	96% {
		opacity: 0.13;
	}
	98% {
		opacity: 0.12;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkMoonwash {
	0%,
	70% {
		opacity: 0;
	}
	82% {
		opacity: 0.08;
	}
	90% {
		opacity: 0.12;
	}
	96% {
		opacity: 0.12;
	}
	98% {
		opacity: 0.13;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionDarkNight {
	0%,
	76% {
		opacity: 0;
	}
	88% {
		opacity: 0.12;
	}
	92% {
		opacity: 0.18;
	}
	96% {
		opacity: 0.2;
	}
	98% {
		opacity: 0.22;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightNight {
	0% {
		opacity: 0.15;
	}
	10% {
		opacity: 0.2;
	}
	20% {
		opacity: 0.18;
	}
	32% {
		opacity: 0.12;
	}
	44% {
		opacity: 0.05;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightMoonwash {
	0%,
	6% {
		opacity: 0;
	}
	18% {
		opacity: 0.08;
	}
	28% {
		opacity: 0.12;
	}
	38% {
		opacity: 0.15;
	}
	48% {
		opacity: 0.13;
	}
	58% {
		opacity: 0.08;
	}
	66% {
		opacity: 0.03;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightIndigo {
	0%,
	10% {
		opacity: 0;
	}
	20% {
		opacity: 0.1;
	}
	30% {
		opacity: 0.14;
	}
	40% {
		opacity: 0.18;
	}
	50% {
		opacity: 0.16;
	}
	60% {
		opacity: 0.1;
	}
	70% {
		opacity: 0.04;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightBluehour {
	0%,
	16% {
		opacity: 0;
	}
	26% {
		opacity: 0.12;
	}
	36% {
		opacity: 0.18;
	}
	46% {
		opacity: 0.22;
	}
	56% {
		opacity: 0.2;
	}
	66% {
		opacity: 0.12;
	}
	76% {
		opacity: 0.05;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightTwilight {
	0%,
	22% {
		opacity: 0;
	}
	34% {
		opacity: 0.12;
	}
	46% {
		opacity: 0.18;
	}
	56% {
		opacity: 0.22;
	}
	66% {
		opacity: 0.2;
	}
	76% {
		opacity: 0.12;
	}
	84% {
		opacity: 0.05;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightRose {
	0%,
	28% {
		opacity: 0;
	}
	40% {
		opacity: 0.12;
	}
	52% {
		opacity: 0.18;
	}
	62% {
		opacity: 0.22;
	}
	72% {
		opacity: 0.2;
	}
	82% {
		opacity: 0.12;
	}
	90% {
		opacity: 0.05;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightMist {
	0%,
	34% {
		opacity: 0;
	}
	46% {
		opacity: 0.08;
	}
	58% {
		opacity: 0.17;
	}
	70% {
		opacity: 0.22;
	}
	82% {
		opacity: 0.18;
	}
	90% {
		opacity: 0.09;
	}
	96% {
		opacity: 0.04;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightDawn {
	0%,
	34% {
		opacity: 0;
	}
	44% {
		opacity: 0.07;
	}
	56% {
		opacity: 0.2;
	}
	68% {
		opacity: 0.32;
	}
	78% {
		opacity: 0.35;
	}
	88% {
		opacity: 0.27;
	}
	94% {
		opacity: 0.16;
	}
	98% {
		opacity: 0.06;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightPearl {
	0%,
	48% {
		opacity: 0;
	}
	60% {
		opacity: 0.1;
	}
	72% {
		opacity: 0.2;
	}
	84% {
		opacity: 0.24;
	}
	92% {
		opacity: 0.17;
	}
	98% {
		opacity: 0.06;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionLightMidday {
	0%,
	62% {
		opacity: 0;
	}
	74% {
		opacity: 0.12;
	}
	84% {
		opacity: 0.18;
	}
	92% {
		opacity: 0.22;
	}
	98% {
		opacity: 0.05;
	}
	100% {
		opacity: 0;
	}
}

@keyframes themeTransitionStarsIn {
	0%,
	52% {
		opacity: 0;
		transform: scale(1.04);
	}
	72% {
		opacity: 0.34;
	}
	88% {
		opacity: 0.18;
	}
	100% {
		opacity: 0;
		transform: scale(1);
	}
}

@keyframes themeTransitionStarsOut {
	0% {
		opacity: 0.18;
		transform: scale(1.02);
	}
	28% {
		opacity: 0.08;
	}
	100% {
		opacity: 0;
		transform: scale(0.98);
	}
}

@keyframes themeAmbientOverlayToDark {
	0% {
		opacity: 0.42;
	}
	16% {
		opacity: 0.28;
	}
	32% {
		opacity: 0.2;
	}
	52% {
		opacity: 0.18;
	}
	64% {
		opacity: 0.2;
	}
	74% {
		opacity: 0.24;
	}
	84% {
		opacity: 0.3;
	}
	92% {
		opacity: 0.36;
	}
	100% {
		opacity: 0.42;
	}
}

@keyframes themeAmbientOverlayBeforeToDark {
	0% {
		opacity: 0.6;
		transform: translateY(0) scale(1);
	}
	18% {
		opacity: 0.38;
		transform: translateY(0.16rem) scale(0.986);
	}
	34% {
		opacity: 0.28;
		transform: translateY(0.34rem) scale(0.958);
	}
	52% {
		opacity: 0.24;
		transform: translateY(0.46rem) scale(0.944);
	}
	66% {
		opacity: 0.28;
		transform: translateY(0.42rem) scale(0.95);
	}
	76% {
		opacity: 0.34;
		transform: translateY(0.3rem) scale(0.966);
	}
	86% {
		opacity: 0.42;
		transform: translateY(0.18rem) scale(0.982);
	}
	94% {
		opacity: 0.5;
		transform: translateY(0.07rem) scale(0.994);
	}
	100% {
		opacity: 0.6;
		transform: translateY(0) scale(1);
	}
}

@keyframes themeAmbientOverlayAfterToDark {
	0% {
		opacity: 0.35;
		transform: scale(0.985);
	}
	18% {
		opacity: 0.22;
		transform: translateY(0.08rem) scale(0.972);
	}
	34% {
		opacity: 0.16;
		transform: translateY(0.16rem) scale(0.962);
	}
	52% {
		opacity: 0.14;
		transform: translateY(0.24rem) scale(0.95);
	}
	66% {
		opacity: 0.16;
		transform: translateY(0.2rem) scale(0.956);
	}
	76% {
		opacity: 0.2;
		transform: translateY(0.14rem) scale(0.966);
	}
	86% {
		opacity: 0.26;
		transform: translateY(0.08rem) scale(0.974);
	}
	94% {
		opacity: 0.3;
		transform: translateY(0.03rem) scale(0.982);
	}
	100% {
		opacity: 0.35;
		transform: scale(0.985);
	}
}

@keyframes themeAmbientOverlayToLight {
	0% {
		opacity: 0.42;
	}
	16% {
		opacity: 0.16;
	}
	32% {
		opacity: 0.045;
	}
	52% {
		opacity: 0.02;
	}
	64% {
		opacity: 0.035;
	}
	74% {
		opacity: 0.08;
	}
	84% {
		opacity: 0.18;
	}
	92% {
		opacity: 0.34;
	}
	100% {
		opacity: 0.42;
	}
}

@keyframes themeAmbientOverlayBeforeToLight {
	0% {
		opacity: 0.6;
		transform: translateY(0) scale(1);
	}
	20% {
		opacity: 0.2;
		transform: translateY(0.12rem) scale(0.988);
	}
	36% {
		opacity: 0.05;
		transform: translateY(0.3rem) scale(0.964);
	}
	54% {
		opacity: 0.018;
		transform: translateY(0.42rem) scale(0.95);
	}
	66% {
		opacity: 0.035;
		transform: translateY(0.36rem) scale(0.956);
	}
	76% {
		opacity: 0.1;
		transform: translateY(0.26rem) scale(0.972);
	}
	86% {
		opacity: 0.22;
		transform: translateY(0.14rem) scale(0.986);
	}
	94% {
		opacity: 0.4;
		transform: translateY(0.04rem) scale(0.996);
	}
	100% {
		opacity: 0.6;
		transform: translateY(0) scale(1);
	}
}

@keyframes themeAmbientOverlayAfterToLight {
	0% {
		opacity: 0.35;
		transform: scale(0.985);
	}
	20% {
		opacity: 0.1;
		transform: translateY(0.06rem) scale(0.974);
	}
	36% {
		opacity: 0.03;
		transform: translateY(0.14rem) scale(0.964);
	}
	54% {
		opacity: 0.01;
		transform: translateY(0.18rem) scale(0.954);
	}
	66% {
		opacity: 0.02;
		transform: translateY(0.16rem) scale(0.96);
	}
	76% {
		opacity: 0.06;
		transform: translateY(0.11rem) scale(0.97);
	}
	86% {
		opacity: 0.14;
		transform: translateY(0.06rem) scale(0.978);
	}
	94% {
		opacity: 0.25;
		transform: translateY(0.02rem) scale(0.982);
	}
	100% {
		opacity: 0.35;
		transform: scale(0.985);
	}
}

@keyframes themeEndingAmbienceOverlayReset {
	0% {
		opacity: var(--theme-ending-ambience-overlay-opacity, 0.6);
	}
	18% {
		opacity: 0.18;
	}
	30%,
	62% {
		opacity: 0.025;
	}
	72% {
		opacity: 0.12;
	}
	82% {
		opacity: 0.24;
	}
	92% {
		opacity: 0.38;
	}
	100% {
		opacity: var(--theme-ending-ambience-overlay-opacity, 0.6);
	}
}

@keyframes themeEndingAmbienceBeforeReset {
	0% {
		opacity: var(--theme-ending-ambience-before-opacity, 0.6);
		transform: var(--theme-ending-ambience-before-transform, translateY(0) scale(1));
	}
	22% {
		opacity: 0.1;
		transform: translateY(0.55rem) scale(0.966);
	}
	34%,
	62% {
		opacity: 0.018;
		transform: translateY(0.82rem) scale(0.944);
	}
	72% {
		opacity: 0.08;
		transform: translateY(0.58rem) scale(0.958);
	}
	84% {
		opacity: 0.22;
		transform: translateY(0.34rem) scale(0.974);
	}
	94% {
		opacity: 0.44;
		transform: translateY(0.12rem) scale(0.99);
	}
	100% {
		opacity: var(--theme-ending-ambience-before-opacity, 0.6);
		transform: var(--theme-ending-ambience-before-transform, translateY(0) scale(1));
	}
}

@keyframes themeEndingAmbienceAfterReset {
	0% {
		opacity: var(--theme-ending-ambience-after-opacity, 0.35);
		transform: var(--theme-ending-ambience-after-transform, scale(0.985));
	}
	22% {
		opacity: 0.07;
		transform: translateY(0.32rem) scale(0.972);
	}
	34%,
	62% {
		opacity: 0.012;
		transform: translateY(0.52rem) scale(0.956);
	}
	72% {
		opacity: 0.05;
		transform: translateY(0.36rem) scale(0.962);
	}
	84% {
		opacity: 0.14;
		transform: translateY(0.18rem) scale(0.976);
	}
	94% {
		opacity: 0.26;
		transform: translateY(0.06rem) scale(0.984);
	}
	100% {
		opacity: var(--theme-ending-ambience-after-opacity, 0.35);
		transform: var(--theme-ending-ambience-after-transform, scale(0.985));
	}
}

@keyframes themeEndingAmbienceSuspend {
	0% {
		opacity: var(--theme-ambience-suspend-opacity, 0.6);
	}
	22% {
		opacity: min(var(--theme-ambience-suspend-opacity, 0.6), 0.28);
	}
	38% {
		opacity: min(var(--theme-ambience-suspend-opacity, 0.6), 0.12);
	}
	48%,
	100% {
		opacity: min(var(--theme-ambience-suspend-opacity, 0.6), 0.1);
	}
}

@keyframes themeEndingPaletteSuspend {
	0% {
		opacity: var(--theme-palette-suspend-opacity, 1);
	}
	20% {
		opacity: min(var(--theme-palette-suspend-opacity, 1), 0.46);
	}
	36% {
		opacity: min(var(--theme-palette-suspend-opacity, 1), 0.12);
	}
	46%,
	100% {
		opacity: min(var(--theme-palette-suspend-opacity, 1), 0.08);
	}
}

@keyframes themeEndingAfterglowSuspend {
	0% {
		filter: blur(0);
		opacity: var(--theme-afterglow-suspend-opacity, 0.64);
		transform: translateY(-0.06rem) scale(0.992);
	}
	24% {
		filter: blur(0.12rem);
		opacity: 0.22;
		transform: translateY(0.24rem) scale(0.986);
	}
	42% {
		filter: blur(0.28rem);
		opacity: 0.06;
		transform: translateY(0.6rem) scale(0.976);
	}
	54%,
	100% {
		filter: blur(0.36rem);
		opacity: 0;
		transform: translateY(0.85rem) scale(0.968);
	}
}

@keyframes themeEndingAmbienceReturn {
	0%,
	20% {
		opacity: min(var(--theme-ambience-return-opacity, 0.6), 0.1);
	}
	58% {
		opacity: min(var(--theme-ambience-return-opacity, 0.6), 0.18);
	}
	82% {
		opacity: min(var(--theme-ambience-return-opacity, 0.6), 0.32);
	}
	100% {
		opacity: var(--theme-ambience-return-opacity, 0.6);
	}
}

@keyframes themeEndingPaletteReturn {
	0%,
	24% {
		opacity: min(var(--theme-palette-return-opacity, 1), 0.08);
	}
	58% {
		opacity: min(var(--theme-palette-return-opacity, 1), 0.28);
	}
	82% {
		opacity: min(var(--theme-palette-return-opacity, 1), 0.72);
	}
	100% {
		opacity: var(--theme-palette-return-opacity, 1);
	}
}

@keyframes themeEndingAfterglowReturn {
	0%,
	22% {
		filter: blur(0.34rem);
		opacity: 0;
		transform: translateY(0.7rem) scale(0.972);
	}
	58% {
		filter: blur(0.18rem);
		opacity: 0.18;
		transform: translateY(0.34rem) scale(0.982);
	}
	82% {
		filter: blur(0.06rem);
		opacity: 0.34;
		transform: translateY(0.08rem) scale(0.99);
	}
	100% {
		filter: blur(0);
		opacity: var(--theme-afterglow-return-opacity, 0.64);
		transform: translateY(-0.04rem) scale(0.996);
	}
}

@keyframes themeEndingDawnReset {
	0% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-dawn-x), var(--ending-ambience-dawn-y), 0) scale(1.04, var(--ending-ambience-dawn-scale-y));
	}
	20% {
		opacity: 0.2;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 14vh), 0) scale(1.02, 0.96);
	}
	30%,
	68% {
		opacity: 0;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 24vh), 0) scale(1, 0.9);
	}
	82% {
		opacity: 0.22;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 10vh), 0) scale(1.02, 0.96);
	}
	100% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-dawn-x), var(--ending-ambience-dawn-y), 0) scale(1.04, var(--ending-ambience-dawn-scale-y));
	}
}

@keyframes themeEndingSunsetReset {
	0% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-sunset-x), var(--ending-ambience-sunset-y), 0) scale(1.06, var(--ending-ambience-sunset-scale-y));
	}
	18% {
		opacity: 0.16;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 18vh), 0) scale(1.035, 0.95);
	}
	30%,
	68% {
		opacity: 0;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 30vh), 0) scale(1.01, 0.88);
	}
	80% {
		opacity: 0.14;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 18vh), 0) scale(1.03, 0.94);
	}
	92% {
		opacity: 0.68;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 4vh), 0) scale(1.05, 1.03);
	}
	100% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-sunset-x), var(--ending-ambience-sunset-y), 0) scale(1.06, var(--ending-ambience-sunset-scale-y));
	}
}

@keyframes themeEndingDawnToLight {
	0% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-dawn-x), var(--ending-ambience-dawn-y), 0) scale(1.04, var(--ending-ambience-dawn-scale-y));
	}
	18% {
		opacity: 0.56;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 7vh), 0) scale(1.028, 1.02);
	}
	34% {
		opacity: 0.14;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 18vh), 0) scale(1.012, 0.95);
	}
	46%,
	58% {
		opacity: 0;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 25vh), 0) scale(1, 0.9);
	}
	66% {
		opacity: 0.12;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 18vh), 0) scale(1.01, 0.94);
	}
	76% {
		opacity: 0.3;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 11vh), 0) scale(1.02, 0.98);
	}
	88% {
		opacity: 0.62;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 4.5vh), 0) scale(1.034, 1.04);
	}
	96% {
		opacity: 0.86;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 1.4vh), 0) scale(1.04, 1.08);
	}
	100% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-dawn-x), var(--ending-ambience-dawn-y), 0) scale(1.04, var(--ending-ambience-dawn-scale-y));
	}
}

@keyframes themeEndingSunsetToLight {
	0% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-sunset-x), var(--ending-ambience-sunset-y), 0) scale(1.06, var(--ending-ambience-sunset-scale-y));
	}
	20% {
		opacity: 0.52;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 8vh), 0) scale(1.045, 1.02);
	}
	36% {
		opacity: 0.12;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 20vh), 0) scale(1.022, 0.94);
	}
	46%,
	62% {
		opacity: 0;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 32vh), 0) scale(1.01, 0.88);
	}
	72% {
		opacity: 0.1;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 23vh), 0) scale(1.018, 0.92);
	}
	82% {
		opacity: 0.28;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 14vh), 0) scale(1.03, 0.98);
	}
	92% {
		opacity: 0.62;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 5.5vh), 0) scale(1.046, 1.04);
	}
	98% {
		opacity: 0.9;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 1.2vh), 0) scale(1.056, 1.08);
	}
	100% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-sunset-x), var(--ending-ambience-sunset-y), 0) scale(1.06, var(--ending-ambience-sunset-scale-y));
	}
}

@keyframes themeEndingDawnToDark {
	0% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-dawn-x), var(--ending-ambience-dawn-y), 0) scale(1.04, var(--ending-ambience-dawn-scale-y));
	}
	20% {
		opacity: 0.5;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 8vh), 0) scale(1.026, 1.01);
	}
	36% {
		opacity: 0.12;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 19vh), 0) scale(1.012, 0.94);
	}
	46%,
	62% {
		opacity: 0;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 28vh), 0) scale(1, 0.88);
	}
	72% {
		opacity: 0.08;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 22vh), 0) scale(1.01, 0.91);
	}
	82% {
		opacity: 0.24;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 13vh), 0) scale(1.02, 0.96);
	}
	92% {
		opacity: 0.56;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 5vh), 0) scale(1.032, 1.02);
	}
	98% {
		opacity: 0.86;
		transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + 1.2vh), 0) scale(1.038, 1.07);
	}
	100% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-dawn-x), var(--ending-ambience-dawn-y), 0) scale(1.04, var(--ending-ambience-dawn-scale-y));
	}
}

@keyframes themeEndingSunsetToDark {
	0% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-sunset-x), var(--ending-ambience-sunset-y), 0) scale(1.06, var(--ending-ambience-sunset-scale-y));
	}
	18% {
		opacity: 0.58;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 8vh), 0) scale(1.046, 1.02);
	}
	34% {
		opacity: 0.16;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 20vh), 0) scale(1.022, 0.94);
	}
	46%,
	56% {
		opacity: 0;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 32vh), 0) scale(1.01, 0.88);
	}
	64% {
		opacity: 0.1;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 25vh), 0) scale(1.018, 0.92);
	}
	74% {
		opacity: 0.28;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 18vh), 0) scale(1.03, 0.97);
	}
	84% {
		opacity: 0.52;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 9vh), 0) scale(1.044, 1.02);
	}
	94% {
		opacity: 0.8;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 2.5vh), 0) scale(1.055, 1.07);
	}
	98% {
		opacity: 0.92;
		transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + 0.8vh), 0) scale(1.058, 1.09);
	}
	100% {
		opacity: 1;
		transform: translate3d(var(--ending-ambience-sunset-x), var(--ending-ambience-sunset-y), 0) scale(1.06, var(--ending-ambience-sunset-scale-y));
	}
}

@keyframes themeEndingAfterglowBloomReset {
	0% {
		filter: blur(0);
		opacity: 0.74;
		transform: translateY(-0.08rem) scale(0.992);
	}
	24% {
		filter: blur(0.36rem);
		opacity: 0.12;
		transform: translateY(1.25rem) scale(0.97);
	}
	34%,
	68% {
		filter: blur(0.5rem);
		opacity: 0;
		transform: translateY(2.1rem) scale(0.952);
	}
	84% {
		filter: blur(0.28rem);
		opacity: 0.18;
		transform: translateY(1rem) scale(0.972);
	}
	100% {
		filter: blur(0);
		opacity: 0.74;
		transform: translateY(-0.08rem) scale(0.992);
	}
}

@keyframes themeEndingAfterglowSheenReset {
	0% {
		opacity: 0.36;
		transform: translateY(-0.04rem) scale(0.996);
	}
	24% {
		opacity: 0.08;
		transform: translateY(0.92rem) scale(0.976);
	}
	34%,
	68% {
		opacity: 0;
		transform: translateY(1.6rem) scale(0.958);
	}
	84% {
		opacity: 0.1;
		transform: translateY(0.68rem) scale(0.982);
	}
	100% {
		opacity: 0.36;
		transform: translateY(-0.04rem) scale(0.996);
	}
}

body::before {
	transition: transform 0.75s ease, filter 0.75s ease, opacity 0.75s ease;
}

body.is-page-hidden::before {
	animation-play-state: paused;
}

body.ending-afterglow::before {
	transition:
		transform 6.8s cubic-bezier(0.23, 1, 0.32, 1),
		filter 7.2s cubic-bezier(0.23, 1, 0.32, 1),
		opacity 6.8s ease;
	filter: var(--afterglow-dot-filter);
	opacity: 0.96;
	transform: scale(1.008);
}

body.ending-afterglow-exit::before {
	transition:
		transform 0.82s cubic-bezier(0.4, 0, 0.2, 1),
		filter 0.92s cubic-bezier(0.4, 0, 0.2, 1),
		opacity 0.7s ease;
}

.ambient-overlay {
	inset: 0;
	opacity: 0.42;
	pointer-events: none;
	position: fixed;
	transition: opacity 3.6s cubic-bezier(0.23, 1, 0.32, 1);
	z-index: 1;
}

body.ending-afterglow-exit .ambient-overlay {
	transition: opacity 0.7s ease;
}

.ambient-overlay::before,
.ambient-overlay::after {
	content: '';
	inset: 0;
	position: absolute;
	transition:
		opacity 2.8s cubic-bezier(0.23, 1, 0.32, 1),
		transform 3.1s cubic-bezier(0.23, 1, 0.32, 1);
}

body.ending-afterglow-exit .ambient-overlay::before,
body.ending-afterglow-exit .ambient-overlay::after {
	transition:
		opacity 0.68s ease,
		transform 0.8s cubic-bezier(0.4, 0, 0.2, 1);
}

.ambient-overlay::before {
	background:
		radial-gradient(circle at 15% 15%, var(--ambient-blob-one), transparent 35%),
		radial-gradient(circle at 82% 18%, var(--ambient-blob-two), transparent 32%),
		radial-gradient(circle at 55% 82%, var(--ambient-blob-three), transparent 38%);
	filter: blur(32px);
	opacity: 0.6;
}

.ambient-overlay::after {
	background:
		linear-gradient(90deg, var(--ambient-sweep-left), transparent 28%, transparent 72%, var(--ambient-sweep-right)),
		radial-gradient(circle at center, var(--ambient-core), transparent 54%);
	mix-blend-mode: screen;
	opacity: 0.35;
	transform: scale(0.985);
}

body.ending-afterglow .ambient-overlay {
	opacity: 0.5;
}

body.ending-afterglow .ambient-overlay::before {
	opacity: 0.68;
	transform: translateY(-0.08rem) scale(1.01);
}

body.ending-afterglow .ambient-overlay::after {
	opacity: 0.38;
	transform: translateY(-0.03rem) scale(0.992);
}

.ambient-overlay__palette {
	inset: -10% -9% -16%;
	opacity: 0;
	position: absolute;
	transition:
		opacity 1.15s cubic-bezier(0.23, 1, 0.32, 1),
		transform 1.35s cubic-bezier(0.22, 1, 0.36, 1),
		filter 1.1s ease;
	visibility: hidden;
}

.ambient-overlay__palette::before,
.ambient-overlay__palette::after {
	content: '';
	inset: 0;
	position: absolute;
}

.ambient-overlay__palette--dawn {
	filter: blur(var(--ending-ambience-blur)) saturate(1.1);
	transform: translate3d(var(--ending-ambience-dawn-x), calc(var(--ending-ambience-dawn-y) + var(--ending-ambience-dawn-unlock-y)), 0) scale(1.04, var(--ending-ambience-dawn-scale-y)) scaleY(var(--ending-ambience-unlock-scale-y));
}

.ambient-overlay__palette--dawn::before {
	background:
		radial-gradient(ellipse at 50% 88%, var(--ambient-dawn-horizon), transparent 48%),
		radial-gradient(ellipse at 50% 104%, var(--ambient-dawn-core), transparent 42%),
		radial-gradient(ellipse at 50% 94%, var(--ambient-dawn-mist), transparent 36%);
	opacity: var(--ending-ambience-dawn-opacity);
	transform-origin: 50% 100%;
}

.ambient-overlay__palette--dawn::after {
	background:
		linear-gradient(90deg, transparent 18%, var(--ambient-dawn-trace) 50%, transparent 82%),
		linear-gradient(180deg, transparent 0 54%, rgba(255, 244, 222, 0.14) 76%, transparent 100%);
	filter: blur(var(--ending-ambience-sheen-blur));
	mix-blend-mode: screen;
	opacity: var(--ending-ambience-dawn-sheen-opacity);
}

.ambient-overlay__palette--sunset {
	filter: blur(var(--ending-ambience-blur)) saturate(1.16);
	transform: translate3d(var(--ending-ambience-sunset-x), calc(var(--ending-ambience-sunset-y) + var(--ending-ambience-sunset-unlock-y)), 0) scale(1.06, var(--ending-ambience-sunset-scale-y)) scaleY(var(--ending-ambience-unlock-scale-y));
}

.ambient-overlay__palette--sunset::before {
	background:
		radial-gradient(ellipse at 50% 90%, var(--ambient-sunset-horizon), transparent 46%),
		radial-gradient(ellipse at 50% 104%, var(--ambient-sunset-core), transparent 40%),
		radial-gradient(ellipse at 50% 94%, var(--ambient-sunset-mist), transparent 34%);
	opacity: var(--ending-ambience-sunset-opacity);
	transform-origin: 50% 100%;
}

.ambient-overlay__palette--sunset::after {
	background:
		linear-gradient(90deg, transparent 20%, var(--ambient-sunset-trace) 50%, transparent 80%),
		linear-gradient(180deg, transparent 0 52%, rgba(255, 214, 178, 0.12) 76%, transparent 100%);
	filter: blur(var(--ending-ambience-sheen-blur));
	mix-blend-mode: screen;
	opacity: var(--ending-ambience-sunset-sheen-opacity);
}

body.outro-ambience-active .ambient-overlay {
	--theme-ending-ambience-overlay-opacity: 0.6;
	--theme-ending-ambience-before-opacity: 0.6;
	--theme-ending-ambience-before-transform: translateY(0) scale(1);
	--theme-ending-ambience-after-opacity: 0.35;
	--theme-ending-ambience-after-transform: scale(0.985);
	opacity: var(--ending-ambience-overlay-opacity, var(--theme-ending-ambience-overlay-opacity));
}

body.outro-ambience-active .ambient-overlay__palette {
	opacity: var(--ending-ambience-unlock-progress, 1);
	visibility: visible;
	will-change: opacity, transform, filter;
}

body.outro-ambience-active .ambient-overlay__palette--dawn::before {
	animation: ambientPaletteBloom 21s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate;
}

body.outro-ambience-active .ambient-overlay__palette--dawn::after {
	animation: ambientPaletteSweep 17s ease-in-out infinite alternate;
}

body.outro-ambience-active .ambient-overlay__palette--sunset::before {
	animation: ambientPaletteBloom 24s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate-reverse;
}

body.outro-ambience-active .ambient-overlay__palette--sunset::after {
	animation: ambientPaletteSweep 19s ease-in-out infinite alternate-reverse;
}

body.outro-ambience-reactive .ambient-overlay::before {
	--theme-ending-ambience-before-opacity: 0.74;
	--theme-ending-ambience-before-transform: translateY(-0.14rem) scale(1.018);
	opacity: var(--theme-ending-ambience-before-opacity);
	transform: var(--theme-ending-ambience-before-transform);
}

body.outro-ambience-reactive .ambient-overlay::after {
	--theme-ending-ambience-after-opacity: 0.44;
	--theme-ending-ambience-after-transform: translateY(-0.08rem) scale(0.996);
	opacity: var(--theme-ending-ambience-after-opacity);
	transform: var(--theme-ending-ambience-after-transform);
}

.ambient-overlay__afterglow {
	inset: -10% -8% -12%;
	opacity: 0;
	position: absolute;
	transition:
		opacity 4.8s cubic-bezier(0.23, 1, 0.32, 1),
		transform 5.2s cubic-bezier(0.23, 1, 0.32, 1),
		filter 4.6s ease;
	visibility: hidden;
}

body.ending-afterglow-exit .ambient-overlay__afterglow {
	transition:
		opacity 0.68s ease,
		transform 0.8s cubic-bezier(0.4, 0, 0.2, 1),
		filter 0.78s ease;
}

.ambient-overlay__afterglow::before {
	content: '';
	inset: 0;
	position: absolute;
}

.ambient-overlay__afterglow--bloom {
	filter: blur(0.5rem);
	transform: translateY(0.45rem) scale(0.975);
}

.ambient-overlay__afterglow--bloom::before {
	background:
		radial-gradient(ellipse at 50% 114%, var(--afterglow-horizon), transparent 40%),
		radial-gradient(ellipse at 50% 98%, var(--afterglow-core), transparent 26%),
		radial-gradient(ellipse at 40% 94%, var(--afterglow-haze), transparent 34%);
	filter: blur(60px);
	transform-origin: center bottom;
}

.ambient-overlay__afterglow--sheen {
	transform: translateY(0.3rem) scale(1.018);
}

.ambient-overlay__afterglow--sheen::before {
	background:
		linear-gradient(180deg, transparent 0 56%, var(--afterglow-haze) 76%, transparent 100%),
		linear-gradient(112deg, transparent 18%, var(--afterglow-sheen) 46%, transparent 68%);
	filter: blur(28px);
	mix-blend-mode: screen;
	opacity: 0.78;
}

body.ending-afterglow .ambient-overlay__afterglow--bloom {
	filter: blur(0);
	opacity: 0.74;
	transform: translateY(-0.08rem) scale(0.992);
	visibility: visible;
	will-change: opacity, transform, filter;
}

body.ending-afterglow .ambient-overlay__afterglow--sheen {
	opacity: 0.36;
	transform: translateY(-0.04rem) scale(0.996);
	visibility: visible;
	will-change: opacity, transform, filter;
}

body.ending-afterglow .ambient-overlay__afterglow--bloom::before {
	animation: endingAfterglowBloom 18s ease-in-out infinite alternate;
}

body.ending-afterglow .ambient-overlay__afterglow--sheen::before {
	animation: endingAfterglowSheen 24s cubic-bezier(0.45, 0.05, 0.55, 0.95) infinite alternate;
}

body.ending-afterglow .experience-section--outro::before {
	opacity: 0;
	transform: none;
}

.site-wrapper.cinematic-shell {
	align-items: stretch;
}

.site-main {
	width: 100%;
}

.site-main > .inner.cinematic-inner {
	max-width: none;
	padding: 0;
	width: 100%;
}

.site-main > .inner.cinematic-inner > .experience-section {
	margin: 0 !important;
}

.experience-section {
	align-items: center;
	display: flex;
	min-height: var(--viewport-height);
	padding: var(--section-padding-y) var(--section-padding-x);
	position: relative;
	scroll-snap-align: start;
	scroll-snap-stop: normal;
}

.experience-section::before {
	background: none;
	border: 0;
	border-radius: 0;
	box-shadow: none;
	content: '';
	inset: 0;
	opacity: 0;
	position: absolute;
	transform: none;
	transition: opacity 0.35s ease, transform 0.35s ease;
	z-index: 0;
}

.experience-section.is-current::before {
	opacity: 0;
}

.experience-section--hero::before,
.experience-section--essence::before,
.experience-section--journey::before,
.experience-section--projects::before,
.experience-section--outro::before {
	background: none;
}

.section-shell {
	display: grid;
	gap: clamp(1.75rem, 3vw, 3rem);
	opacity: calc(0.28 + (var(--section-presence, 0) * 0.72));
	position: relative;
	transform: translate3d(0, calc((1 - var(--section-presence, 0)) * 0.7rem), 0);
	transition:
		opacity 0.35s ease,
		transform 0.35s ease;
	width: 100%;
	z-index: 1;
}

.experience-section.is-current .section-shell {
	opacity: 1;
	transform: translate3d(0, 0, 0);
}

.section-shell--hero {
	--hero-cue-reserve: clamp(3.6rem, 6vh, 4.5rem);
	align-items: center;
	box-sizing: border-box;
	justify-items: center;
	min-height: calc(var(--viewport-height) - (var(--section-padding-y) * 2));
	padding-bottom: var(--hero-cue-reserve);
}

.section-shell--outro {
	justify-items: center;
}

.hero-panel {
	display: grid;
	gap: clamp(1.35rem, 2vw, 2rem);
	justify-items: center;
	max-width: min(68rem, 100%);
	text-align: center;
	width: min(68rem, 100%);
}

.hero-panel #image01 {
	isolation: isolate;
	overflow: visible;
	z-index: 3;
}

.hero-panel #text02 {
	font-size: var(--type-hero-copy-size) !important;
	line-height: 1.1 !important;
	max-width: min(58rem, 100%);
}

.hero-panel #text03 {
	font-size: var(--type-hero-title-size);
	line-height: 1.08;
}

.hero-panel #text02 .hero-line {
	margin-top: 0.5rem;
}

.hero-panel #text02 .hero-line:first-child {
	margin-top: 0;
}

.hero-panel #text02 .hero-line--group {
	margin-top: 1rem;
}

.hero-panel #text02 .hero-line--paragraph {
	margin-top: 1.6rem;
}

@media (min-width: 737px) {
	.hero-panel #text02 .hero-line--desktop-nowrap {
		white-space: nowrap;
	}
}

.section-heading {
	display: grid;
	gap: 1rem;
	max-width: 58rem;
}

.section-heading--island-only {
	display: contents;
}

.visually-hidden {
	border: 0 !important;
	clip: rect(0 0 0 0) !important;
	clip-path: inset(50%) !important;
	height: 1px !important;
	margin: -1px !important;
	overflow: hidden !important;
	padding: 0 !important;
	position: absolute !important;
	white-space: nowrap !important;
	width: 1px !important;
}

.section-shell--wide {
	margin: 0 auto;
	max-width: var(--section-shell-wide-max);
	width: 100%;
}

.experience-section--journey .section-shell,
.experience-section--projects .section-shell {
	gap: clamp(1.6rem, 2.4vw, 2.35rem);
	margin: 0 auto;
	max-width: var(--section-shell-wide-max);
}

.experience-section--journey .section-heading,
.experience-section--projects .section-heading {
	max-width: none;
}

.section-note {
	color: var(--ink-muted);
	font-family: 'Solway', serif;
	font-size: var(--type-note-size);
	letter-spacing: 0.02em;
	line-height: 1.7;
	max-width: 42rem;
}

.experience-section--essence {
	align-items: center;
	padding-top: clamp(3.2rem, 6.5vh, 4.75rem);
	padding-bottom: clamp(3.2rem, 6.5vh, 4.75rem);
}

.experience-section--essence .section-shell {
	--essence-copy-size: clamp(20px, min(0.85vw + 13.5px, 1vh + 14px), 25px);
	--essence-copy-leading: 1.2;
	align-items: start;
	align-content: center;
	gap: clamp(1.2rem, 2vw, 1.85rem);
	grid-template-columns: minmax(0, 1fr);
	justify-content: center;
	justify-items: start;
	margin: 0 auto;
	max-width: min(84rem, calc(100vw - 7rem));
	min-height: min(72svh, 46rem);
	width: 100%;
}

.experience-section--essence .section-heading {
	align-content: center;
	gap: 0.75rem;
	justify-items: start;
	max-width: 100%;
	padding-top: 0;
	width: 100%;
}

.section-body--essence {
	max-width: 100%;
	width: 100%;
}

.essence-copy {
	--essence-format-sweep-duration: 1600ms;
	--essence-underline-sweep-duration: 2800ms;
	color: var(--essence-copy-ink);
	font-size: var(--essence-copy-size) !important;
	line-height: var(--essence-copy-leading) !important;
	max-width: min(63rem, 100%);
	text-wrap: pretty;
}

.essence-copy strong {
	color: var(--essence-copy-strong);
}

.essence-copy span.p:nth-child(n + 2) {
	margin-top: 0.54rem !important;
}

.essence-copy span.p:nth-child(n + 5) {
	margin-top: 0.78rem !important;
}

.essence-copy.is-format-primed strong {
	color: var(--essence-copy-strong);
	display: inline-grid;
	grid-template-areas: 'stack';
	position: relative;
	vertical-align: baseline;
}

.essence-copy.is-format-primed strong > .essence-format-base,
.essence-copy.is-format-primed strong > .essence-format-overlay {
	grid-area: stack;
}

.essence-copy.is-format-primed strong > .essence-format-base {
	clip-path: inset(0 0 0 0);
	color: inherit;
	text-decoration: none;
}

.essence-copy.is-format-primed strong > .essence-format-base u,
.essence-copy.is-format-primed strong > .essence-format-overlay u {
	text-decoration: none;
}

.essence-copy.is-format-primed strong > .essence-format-base {
	font-weight: 400;
}

.essence-copy.is-format-primed strong > .essence-format-overlay {
	box-decoration-break: clone;
	clip-path: inset(0 100% 0 0);
	color: inherit;
	pointer-events: none;
	text-decoration: none;
	-webkit-box-decoration-break: clone;
}

.essence-copy.is-format-primed strong > .essence-format-overlay {
	font-weight: bolder;
}

.essence-copy.is-format-primed strong.is-format-revealed > .essence-format-overlay {
	animation: essenceFormatOverlaySweep var(--essence-format-sweep-duration) cubic-bezier(0.16, 0.7, 0.3, 1) 1 both;
}

.essence-copy.is-format-primed strong.is-format-revealed > .essence-format-base {
	animation: essenceFormatBaseSweep var(--essence-format-sweep-duration) cubic-bezier(0.16, 0.7, 0.3, 1) 1 both;
}

.essence-copy.is-underline-primed u[data-underline-target="1"],
.essence-copy.is-underline-primed u:not([data-underline-skip="1"]):not([data-format-clone="1"]) {
	position: relative;
	text-decoration: none;
}

.essence-copy.is-underline-primed u[data-underline-target="1"]::after,
.essence-copy.is-underline-primed u:not([data-underline-skip="1"]):not([data-format-clone="1"])::after {
	background: linear-gradient(90deg, var(--essence-underline-core) 0%, var(--essence-underline-core) 34%, var(--essence-underline-sheen) 58%, var(--essence-underline-core) 100%);
	background-position: 100% 50%;
	background-repeat: no-repeat;
	background-size: 200% 100%;
	border-radius: 999px;
	bottom: 0.02em;
	content: '';
	height: 0.08em;
	left: 0;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	transform: scaleX(0);
	transform-origin: left center;
	width: 100%;
}

.essence-copy.is-underline-primed u[data-underline-target="1"].is-underline-revealed::after,
.essence-copy.is-underline-primed u.is-underline-revealed:not([data-underline-skip="1"]):not([data-format-clone="1"])::after {
	animation: essenceUnderlineSweep var(--essence-underline-sweep-duration) cubic-bezier(0.2, 0.8, 0.2, 1) 1 both;
}

@keyframes essenceFormatOverlaySweep {
	0% {
		clip-path: inset(0 100% 0 0);
		filter: saturate(0.96);
		text-shadow: 0 0 0 rgba(47, 101, 73, 0);
	}
	30% {
		filter: saturate(1.04);
		text-shadow: 0 0 0.35rem var(--essence-format-glow);
	}
	60% {
		filter: saturate(1.02);
		text-shadow: 0 0 0.2rem var(--essence-format-glow);
	}
	100% {
		clip-path: inset(0 0 0 0);
		filter: saturate(1);
		text-shadow: 0 0 0 rgba(47, 101, 73, 0);
	}
}

@keyframes essenceFormatBaseSweep {
	0% {
		clip-path: inset(0 0 0 0);
		opacity: 1;
	}
	100% {
		clip-path: inset(0 0 0 100%);
		opacity: 0;
	}
}

@keyframes essenceUnderlineSweep {
	0% {
		background-position: 100% 50%;
		opacity: 0.22;
		transform: scaleX(0);
	}
	38% {
		opacity: 0.94;
	}
	100% {
		background-position: 0% 50%;
		opacity: 1;
		transform: scaleX(1);
	}
}

.journey-grid,
.project-grid {
	align-items: stretch;
	display: grid;
	gap: var(--grid-gap-regular);
}

.journey-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--journey-card-min)), 1fr));
}

.project-grid {
	grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--project-card-min)), 1fr));
}

.journey-card,
.project-card,
.outro-panel,
.soundtrack-prompt {
	backdrop-filter: blur(18px);
	background: var(--glass-fill);
	border: 1px solid var(--glass-border);
	border-radius: 1.75rem;
	box-shadow: var(--glass-shadow);
}

.journey-card,
.project-card {
	display: grid;
	gap: clamp(0.68rem, 0.55rem + 0.4vw, 0.8rem);
	height: 100%;
	padding: clamp(1.15rem, 0.95rem + 0.7vw, 1.5rem);
}

.journey-card {
	align-content: start;
	grid-template-rows: auto auto auto 1fr;
}

.journey-card__meta {
	align-items: center;
	display: flex;
	flex-wrap: wrap;
	gap: 0.55rem 0.85rem;
}

.journey-card__range,
.project-card__eyebrow,
.soundtrack-meta__label {
	color: var(--ink-subtle);
	font-size: var(--type-kicker-size);
	font-weight: 400;
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.journey-card__location {
	color: var(--ink-faint);
	font-size: var(--type-meta-size);
	letter-spacing: 0.08em;
	line-height: 1.4;
	text-transform: uppercase;
}

.journey-card__title,
.project-card__title {
	color: var(--ink-strong);
	font-family: 'Solway', serif;
	font-size: var(--type-card-title-size);
	font-weight: 300;
	letter-spacing: -0.04em;
	line-height: 1.15;
}

.journey-card__company,
.project-card__copy,
.soundtrack-meta__track {
	color: var(--ink-muted);
	font-family: 'Solway', serif;
	font-size: var(--type-body-size);
	line-height: 1.6;
}

.journey-card__company {
	line-height: 1.45;
}

.journey-card__list {
	color: var(--ink-muted);
	display: grid;
	font-size: var(--type-body-size);
	gap: 0.7rem;
	list-style: none;
	margin: 0;
	padding: 0;
}

.journey-card__list li {
	line-height: 1.55;
	padding-left: 1rem;
	position: relative;
}

.journey-card__list li::before {
	background: var(--accent-green-mid);
	border-radius: 999px;
	content: '';
	height: 0.35rem;
	left: 0;
	position: absolute;
	top: 0.65rem;
	width: 0.35rem;
}

.journey-history,
.journey-highlights {
	display: grid;
	gap: 1.2rem;
}

.journey-history__header,
.journey-highlights__header {
	display: grid;
	gap: 0.45rem;
	max-width: 52rem;
}

.journey-history__eyebrow,
.journey-highlights__eyebrow {
	color: var(--ink-subtle);
	font-size: var(--type-kicker-size);
	letter-spacing: 0.14em;
	text-transform: uppercase;
}

.journey-highlights__note {
	color: var(--ink-muted);
	font-family: 'Solway', serif;
	font-size: var(--type-body-size);
	line-height: 1.6;
}

.journey-highlights__grid {
	align-items: stretch;
	display: grid;
	gap: var(--grid-gap-tight);
	grid-template-columns: repeat(auto-fit, minmax(min(100%, var(--highlight-card-min)), 1fr));
}

.journey-highlight {
	--card-flip-origin-x: 50%;
	--card-flip-origin-y: 50%;
	--card-flip-exit-rotate-x: 0deg;
	--card-flip-exit-rotate-y: 96deg;
	--card-flip-exit-rotate-z: 3deg;
	--card-flip-enter-rotate-x: 0deg;
	--card-flip-enter-rotate-y: -96deg;
	--card-flip-enter-rotate-z: -2deg;
	--card-flip-enter-kick-x: 0px;
	--card-flip-enter-kick-y: 0px;
	--card-flip-kick-x: 0px;
	--card-flip-kick-y: 0px;
	--card-flip-mid-kick-x: 0px;
	--card-flip-mid-kick-y: 0px;
	--card-flip-mid-rotate-x: 0deg;
	--card-flip-mid-rotate-y: 38deg;
	--card-flip-mid-rotate-z: 0deg;
	--card-flip-center-press-x: 0deg;
	--card-flip-center-press-y: 0deg;
	--card-flip-center-enter-press-x: 0deg;
	--card-flip-center-enter-press-y: 0deg;
	--journey-card-glare-x: 54%;
	--journey-card-glare-y: 18%;
	--journey-card-glare-opacity: 0.24;
	--journey-card-copy-lines: 9;
	--journey-card-radius: 1.35rem;
	--journey-card-min-height: clamp(15.15rem, 18.2vw, 16.5rem);
	--journey-card-min-height-expanded: var(--journey-card-min-height);
	--journey-card-sparkle-opacity: 0.18;
	--journey-card-sparkle-x: 68%;
	--journey-card-sparkle-y: 28%;
	display: block;
	height: var(--journey-card-min-height);
	max-height: var(--journey-card-min-height);
	min-height: var(--journey-card-min-height);
	overflow: visible;
	position: relative;
	z-index: 0;
}

.journey-highlight__button {
	-webkit-appearance: none;
	appearance: none;
	background: none;
	border: 0;
	color: inherit;
	cursor: pointer;
	display: block;
	font: inherit;
	height: 100%;
	margin: 0;
	min-height: 100%;
	overflow: visible;
	padding: 0;
	position: relative;
	text-align: left;
	touch-action: manipulation;
	transform: none;
	transform-origin: center bottom;
	transition: none;
	-webkit-touch-callout: none;
	user-select: none;
	width: 100%;
	z-index: 1;
}

.journey-highlight__button:focus {
	outline: none;
}

.journey-highlight__atropos,
.journey-highlight__atropos .atropos-scale,
.journey-highlight__atropos .atropos-rotate,
.journey-highlight__atropos .atropos-inner {
	border-radius: var(--journey-card-radius);
	display: block;
	height: 100%;
	width: 100%;
}

.journey-highlight__atropos .atropos-inner {
	overflow: hidden;
}

.journey-highlight__atropos .atropos-scale,
.journey-highlight__atropos .atropos-rotate,
.journey-highlight__atropos .atropos-inner,
.journey-highlight__atropos .atropos-shadow,
.journey-highlight__atropos .atropos-highlight {
	transition-timing-function: cubic-bezier(0.22, 1, 0.36, 1);
}

.journey-highlight__atropos .atropos-shadow {
	background: var(--journey-card-atropos-shadow-bg);
	border-radius: var(--journey-card-radius);
	filter: blur(22px);
	height: calc(100% - 0.44rem);
	left: 0.22rem;
	opacity: var(--journey-card-atropos-shadow-opacity);
	top: 0.22rem;
	width: calc(100% - 0.44rem);
}

.journey-highlight__atropos .atropos-highlight {
	background-image: radial-gradient(circle at 50%, var(--journey-card-highlight-core), var(--journey-card-highlight-sheen) 20%, transparent 56%);
}

.journey-highlight__atropos.atropos-active .atropos-shadow {
	opacity: var(--journey-card-atropos-shadow-opacity-active) !important;
}

.journey-highlight__surface {
	backdrop-filter: blur(16px);
	background:
		linear-gradient(160deg, color-mix(in srgb, var(--glass-fill-strong) 42%, transparent) 0%, transparent 48%),
		linear-gradient(220deg, color-mix(in srgb, var(--journey-card-glow-soft) 64%, transparent) 0%, transparent 58%),
		var(--journey-card-surface-fill);
	border: 1px solid var(--journey-card-border);
	border-radius: var(--journey-card-radius);
	box-shadow: var(--journey-card-shadow);
	display: grid;
	height: 100%;
	isolation: isolate;
	min-height: 100%;
	overflow: hidden;
	padding: clamp(1rem, 0.85rem + 0.55vw, 1.25rem);
	position: relative;
	transform-style: preserve-3d;
	transition: border-color 260ms ease, box-shadow 320ms ease, filter 300ms ease, padding 320ms cubic-bezier(0.22, 1, 0.36, 1);
}

.journey-highlight__surface::before,
.journey-highlight__surface::after {
	border-radius: inherit;
	content: '';
	inset: 0;
	pointer-events: none;
	position: absolute;
	transition: opacity 240ms ease;
}

.journey-highlight__surface::before {
	background:
		radial-gradient(circle at var(--journey-card-glare-x) var(--journey-card-glare-y), var(--journey-card-glare-core) 0%, var(--journey-card-glare-mid) 15%, transparent 38%),
		linear-gradient(125deg, var(--journey-card-glare-trace) 0%, var(--journey-card-glare-mid) 22%, var(--journey-card-spectrum-b) 36%, var(--journey-card-spectrum-c) 50%, var(--journey-card-spectrum-d) 64%, var(--journey-card-spectrum-a) 80%, var(--journey-card-glare-trace) 100%);
	mix-blend-mode: screen;
	opacity: calc(var(--journey-card-overlay-opacity) * var(--journey-card-glare-opacity));
}

.journey-highlight__surface::after {
	background:
		linear-gradient(115deg, transparent 8%, var(--journey-card-sheen-soft) 26%, var(--journey-card-sheen-line) 42%, var(--journey-card-glare-trace) 56%, transparent 76%),
		radial-gradient(circle at var(--journey-card-sparkle-x) var(--journey-card-sparkle-y), var(--journey-card-sparkle-core) 0%, transparent 30%);
	box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.22), inset 0 -1.3rem 2rem rgba(255, 255, 255, 0.035);
	opacity: var(--journey-card-sheen-opacity);
}

.journey-highlight__foil,
.journey-highlight__grain {
	border-radius: inherit;
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.journey-highlight__foil {
	background:
		radial-gradient(circle at var(--journey-card-glare-x) var(--journey-card-glare-y), var(--journey-card-foil-glow) 0%, transparent 24%),
		conic-gradient(from 160deg at var(--journey-card-glare-x) var(--journey-card-glare-y), rgba(255, 255, 255, 0) 0deg, var(--journey-card-spectrum-a) 54deg, var(--journey-card-spectrum-b) 132deg, var(--journey-card-spectrum-d) 214deg, var(--journey-card-spectrum-c) 284deg, rgba(255, 255, 255, 0) 360deg);
	mix-blend-mode: soft-light;
	opacity: var(--journey-card-foil-opacity);
	transition: opacity 260ms ease;
}

.journey-highlight__grain {
	background-image:
		radial-gradient(circle at var(--journey-card-sparkle-x) var(--journey-card-sparkle-y), rgba(255, 255, 255, 0.52) 0%, rgba(255, 255, 255, 0.52) 0.8px, transparent 2.4px),
		radial-gradient(circle at 18% 28%, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0.34) 0.7px, transparent 2.3px),
		radial-gradient(circle at 42% 72%, rgba(255, 255, 255, 0.26) 0%, rgba(255, 255, 255, 0.26) 0.7px, transparent 2.1px),
		radial-gradient(circle at 78% 58%, rgba(255, 255, 255, 0.3) 0%, rgba(255, 255, 255, 0.3) 0.75px, transparent 2.2px),
		radial-gradient(rgba(255, 255, 255, 0.08) 0.7px, transparent 0.7px);
	background-position: 0 0;
	background-size: 100% 100%, 100% 100%, 100% 100%, 100% 100%, 9px 9px;
	mix-blend-mode: screen;
	opacity: calc(var(--journey-card-grain-opacity) + var(--journey-card-sparkle-opacity));
	transition: opacity 260ms ease;
}

.journey-highlight__inner {
	display: grid;
	gap: clamp(0.45rem, 0.35rem + 0.35vw, 0.6rem);
	height: 100%;
	grid-template-rows: auto auto minmax(0, 1fr) auto;
	min-height: 0;
	position: relative;
	z-index: 1;
}

.journey-highlight__range {
	color: var(--ink-subtle);
	font-size: 0.68rem;
	letter-spacing: 0.14em;
	margin: 0;
	text-transform: uppercase;
}

.journey-highlight__title {
	color: var(--ink-strong);
	font-family: 'Solway', serif;
	font-size: clamp(15px, 0.22vw + 14.2px, 16.8px);
	font-weight: 400;
	line-height: 1.12;
}

.journey-highlight__copy {
	color: var(--ink-muted);
	display: -webkit-box;
	font-family: 'Solway', serif;
	font-size: clamp(12.75px, 0.12vw + 12.5px, 14px);
	line-height: 1.35;
	min-height: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: normal;
	-webkit-box-orient: vertical;
	-webkit-line-clamp: var(--journey-card-copy-lines);
	line-clamp: var(--journey-card-copy-lines);
}

.journey-highlight__action {
	align-self: end;
	align-items: center;
	color: var(--ink-faint);
	display: flex;
	gap: 0.32rem;
	justify-content: flex-end;
	margin-top: 0;
	padding-top: 0.22rem;
}

.journey-highlight__range,
.journey-highlight__title,
.journey-highlight__copy,
.journey-highlight__action {
	position: relative;
}

.journey-highlight__action-label {
	font-size: 0.62rem;
	letter-spacing: 0.12em;
	text-transform: uppercase;
}

.journey-highlight__action-icon {
	color: var(--journey-card-action-accent);
	font-size: 0.95rem;
	line-height: 1;
	transform-origin: center;
	transition: transform 240ms ease;
}

.journey-highlights.is-interactive .journey-highlight {
	cursor: pointer;
}

.journey-highlights.is-interactive .journey-highlight:hover,
.journey-highlights.is-interactive .journey-highlight:focus-within {
	--journey-card-glare-opacity: 0.44;
	--journey-card-sparkle-opacity: 0.26;
	z-index: 2;
}

.journey-highlights.is-interactive .journey-highlight:hover .journey-highlight__surface,
.journey-highlights.is-interactive .journey-highlight:focus-within .journey-highlight__surface {
	box-shadow: var(--journey-card-shadow-active), 0 0 0 1px var(--journey-card-active-ring);
}

.journey-highlights.is-interactive .journey-highlight.is-flipping-out,
.journey-highlights.is-interactive .journey-highlight.is-flipping-in {
	--journey-card-glare-opacity: 0.58;
	--journey-card-sparkle-opacity: 0.34;
	pointer-events: none;
}

.journey-highlights.is-interactive .journey-highlight.is-flipping-out .journey-highlight__surface,
.journey-highlights.is-interactive .journey-highlight.is-flipping-in .journey-highlight__surface {
	transform-origin: var(--card-flip-origin-x) var(--card-flip-origin-y);
}

.journey-highlights.is-interactive .journey-highlight.is-flipping-out .journey-highlight__surface {
	animation: journey-highlight-flip-side-out 230ms cubic-bezier(0.2, 0.76, 0.24, 1) both;
}

.journey-highlights.is-interactive .journey-highlight.is-flipping-in .journey-highlight__surface {
	animation: journey-highlight-flip-side-in 310ms cubic-bezier(0.2, 0.76, 0.24, 1) both;
}

.journey-highlight.is-flipping-out .journey-highlight__foil,
.journey-highlight.is-flipping-in .journey-highlight__foil {
	animation: journey-highlight-foil-flash 230ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.journey-highlight.is-flipping-out .journey-highlight__grain,
.journey-highlight.is-flipping-in .journey-highlight__grain {
	animation: journey-highlight-sparkle-pop 230ms cubic-bezier(0.22, 1, 0.36, 1) both;
}

.journey-highlights.is-interactive .journey-highlight[data-flip-motion="center"].is-flipping-out .journey-highlight__surface {
	animation-name: journey-highlight-flip-center-out;
}

.journey-highlights.is-interactive .journey-highlight[data-flip-motion="center"].is-flipping-in .journey-highlight__surface {
	animation-name: journey-highlight-flip-center-in;
}

.journey-highlights.is-interactive .journey-highlight[data-flip-motion="vertical"].is-flipping-out .journey-highlight__surface {
	animation-name: journey-highlight-flip-vertical-out;
}

.journey-highlights.is-interactive .journey-highlight[data-flip-motion="vertical"].is-flipping-in .journey-highlight__surface {
	animation-name: journey-highlight-flip-vertical-in;
}

.journey-highlights.is-interactive .journey-highlight[data-flip-motion="corner"].is-flipping-out .journey-highlight__surface {
	animation-name: journey-highlight-flip-corner-out;
}

.journey-highlights.is-interactive .journey-highlight[data-flip-motion="corner"].is-flipping-in .journey-highlight__surface {
	animation-name: journey-highlight-flip-corner-in;
}

@keyframes journey-highlight-flip-side-out {
	0% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
	46% {
		filter: saturate(1.18) brightness(1.08);
		opacity: 0.86;
		transform: perspective(920px) translate3d(var(--card-flip-mid-kick-x), var(--card-flip-mid-kick-y), 18px) rotateX(var(--card-flip-mid-rotate-x)) rotateY(var(--card-flip-mid-rotate-y)) rotateZ(var(--card-flip-mid-rotate-z)) scale(1.008);
	}
	100% {
		filter: saturate(1.24) brightness(1.12);
		opacity: 0.24;
		transform: perspective(920px) translate3d(var(--card-flip-kick-x), var(--card-flip-kick-y), -26px) rotateX(var(--card-flip-exit-rotate-x)) rotateY(var(--card-flip-exit-rotate-y)) rotateZ(var(--card-flip-exit-rotate-z)) scale(0.958);
	}
}

@keyframes journey-highlight-flip-side-in {
	0% {
		filter: saturate(1.22) brightness(1.1);
		opacity: 0.2;
		transform: perspective(920px) translate3d(var(--card-flip-enter-kick-x), var(--card-flip-enter-kick-y), -24px) rotateX(var(--card-flip-enter-rotate-x)) rotateY(var(--card-flip-enter-rotate-y)) rotateZ(var(--card-flip-enter-rotate-z)) scale(0.958);
	}
	62% {
		filter: saturate(1.1) brightness(1.04);
		opacity: 0.96;
		transform: perspective(920px) translate3d(0, 0, 14px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1.012);
	}
	100% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
}

@keyframes journey-highlight-flip-center-out {
	0% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
	44% {
		filter: saturate(1.24) brightness(1.12);
		opacity: 0.92;
		transform: perspective(920px) translateZ(-18px) rotateX(var(--card-flip-center-press-x)) rotateY(var(--card-flip-center-press-y)) rotateZ(var(--card-flip-exit-rotate-z)) scale(0.962);
	}
	100% {
		filter: saturate(1.28) brightness(1.16);
		opacity: 0.18;
		transform: perspective(920px) translateZ(-42px) rotateX(0deg) rotateY(0deg) rotateZ(var(--card-flip-exit-rotate-z)) scale(0.88);
	}
}

@keyframes journey-highlight-flip-center-in {
	0% {
		filter: saturate(1.28) brightness(1.14);
		opacity: 0.18;
		transform: perspective(920px) translateZ(-42px) rotateX(0deg) rotateY(0deg) rotateZ(var(--card-flip-enter-rotate-z)) scale(0.88);
	}
	58% {
		filter: saturate(1.18) brightness(1.08);
		opacity: 0.98;
		transform: perspective(920px) translateZ(18px) rotateX(var(--card-flip-center-enter-press-x)) rotateY(var(--card-flip-center-enter-press-y)) rotateZ(0deg) scale(1.016);
	}
	100% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translateZ(0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
}

@keyframes journey-highlight-flip-vertical-out {
	0% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
	42% {
		filter: saturate(1.2) brightness(1.1);
		opacity: 0.88;
		transform: perspective(920px) translate3d(var(--card-flip-mid-kick-x), var(--card-flip-mid-kick-y), 20px) rotateX(var(--card-flip-mid-rotate-x)) rotateY(var(--card-flip-mid-rotate-y)) rotateZ(var(--card-flip-mid-rotate-z)) scale(1.006);
	}
	100% {
		filter: saturate(1.26) brightness(1.14);
		opacity: 0.28;
		transform: perspective(920px) translate3d(var(--card-flip-kick-x), var(--card-flip-kick-y), -20px) rotateX(var(--card-flip-exit-rotate-x)) rotateY(var(--card-flip-exit-rotate-y)) rotateZ(var(--card-flip-exit-rotate-z)) scale(0.962);
	}
}

@keyframes journey-highlight-flip-vertical-in {
	0% {
		filter: saturate(1.24) brightness(1.12);
		opacity: 0.24;
		transform: perspective(920px) translate3d(var(--card-flip-enter-kick-x), var(--card-flip-enter-kick-y), -20px) rotateX(var(--card-flip-enter-rotate-x)) rotateY(var(--card-flip-enter-rotate-y)) rotateZ(var(--card-flip-enter-rotate-z)) scale(0.962);
	}
	60% {
		filter: saturate(1.12) brightness(1.06);
		opacity: 0.98;
		transform: perspective(920px) translate3d(0, 0, 16px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1.012);
	}
	100% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
}

@keyframes journey-highlight-flip-corner-out {
	0% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
	38% {
		filter: saturate(1.22) brightness(1.1);
		opacity: 0.9;
		transform: perspective(920px) translate3d(var(--card-flip-mid-kick-x), var(--card-flip-mid-kick-y), 24px) rotateX(var(--card-flip-mid-rotate-x)) rotateY(var(--card-flip-mid-rotate-y)) rotateZ(var(--card-flip-mid-rotate-z)) scale(1.01);
	}
	100% {
		filter: saturate(1.3) brightness(1.16);
		opacity: 0.26;
		transform: perspective(920px) translate3d(var(--card-flip-kick-x), var(--card-flip-kick-y), -18px) rotateX(var(--card-flip-exit-rotate-x)) rotateY(var(--card-flip-exit-rotate-y)) rotateZ(var(--card-flip-exit-rotate-z)) scale(0.956);
	}
}

@keyframes journey-highlight-flip-corner-in {
	0% {
		filter: saturate(1.28) brightness(1.14);
		opacity: 0.22;
		transform: perspective(920px) translate3d(var(--card-flip-enter-kick-x), var(--card-flip-enter-kick-y), -18px) rotateX(var(--card-flip-enter-rotate-x)) rotateY(var(--card-flip-enter-rotate-y)) rotateZ(var(--card-flip-enter-rotate-z)) scale(0.956);
	}
	60% {
		filter: saturate(1.14) brightness(1.08);
		opacity: 0.98;
		transform: perspective(920px) translate3d(0, 0, 18px) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1.014);
	}
	100% {
		filter: saturate(1) brightness(1);
		opacity: 1;
		transform: perspective(920px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) rotateZ(0deg) scale(1);
	}
}

@keyframes journey-highlight-foil-flash {
	0% {
		opacity: var(--journey-card-foil-opacity);
	}
	44% {
		opacity: 0.72;
	}
	100% {
		opacity: var(--journey-card-foil-opacity);
	}
}

@keyframes journey-highlight-sparkle-pop {
	0% {
		opacity: calc(var(--journey-card-grain-opacity) + var(--journey-card-sparkle-opacity));
	}
	42% {
		opacity: 0.58;
	}
	100% {
		opacity: calc(var(--journey-card-grain-opacity) + var(--journey-card-sparkle-opacity));
	}
}

.project-card__link {
	color: var(--ink-strong);
	font-size: var(--type-link-size);
	margin-top: 0.3rem;
	width: fit-content;
}

.project-card__link:hover {
	color: var(--accent-green);
}

[data-reveal] {
	opacity: 0;
	transform: translateY(1.5rem);
	transition:
		opacity 0.8s ease var(--reveal-delay, 0s),
		transform 0.8s ease var(--reveal-delay, 0s);
}

[data-reveal].is-visible {
	opacity: 1;
	transform: translateY(0);
}

.outro-panel {
	backdrop-filter: none;
	background: transparent;
	border: 0;
	box-shadow: none;
	display: grid;
	gap: 1.25rem;
	isolation: isolate;
	margin-top: clamp(1.25rem, 2vw, 2rem);
	max-width: 38rem;
	padding: 0.5rem 0 0;
	place-items: center;
	position: relative;
}

body.has-outro-return-ui .outro-panel {
	gap: 0;
}

.outro-panel::before {
	background: radial-gradient(circle at center, var(--ending-bloom), transparent 72%);
	content: '';
	height: clamp(8rem, 28vw, 13rem);
	left: 50%;
	opacity: 0;
	pointer-events: none;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%) scale(0.84);
	transition: opacity 0.45s ease, transform 0.7s cubic-bezier(0.22, 1, 0.36, 1);
	width: min(100%, 42rem);
	z-index: -1;
}

body.ending-afterglow .outro-panel::before {
	opacity: 0;
	transform: translate(-50%, -52%) scale(1.28);
}

body.has-outro-return-ui .outro-panel::before {
	opacity: 0;
	transform: translate(-50%, -50%) scale(0.9);
}

.outro-return-layer {
	align-self: stretch;
	display: grid;
	gap: 0.9rem;
	grid-area: 1 / 1;
	justify-items: center;
	margin-top: 0;
	width: min(100%, 44rem);
}

body.has-outro-return-ui .outro-return-layer {
	margin-top: 0;
}

.outro-quote-stage {
	opacity: 0;
	transform: translateY(0.75rem) scale(0.985);
	transition:
		opacity 0.4s ease,
		filter 0.52s ease,
		transform 0.58s cubic-bezier(0.22, 1, 0.36, 1);
}

.outro-quote-stage {
	filter: blur(0.8rem);
	pointer-events: none;
	width: min(100%, 38rem);
}

.outro-quote-stage.is-visible {
	filter: blur(0);
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

.outro-quote-stage__frame {
	align-items: center;
	display: grid;
	gap: 1rem;
	grid-template-columns: minmax(0, 1fr);
	justify-items: center;
	padding: 0;
}

.outro-quote-stage__body {
	display: grid;
	gap: 0.72rem;
	justify-items: center;
	min-width: 0;
	text-align: center;
}

.outro-quote-stage__body.is-swapping {
	animation: outroQuoteSwap 0.56s cubic-bezier(0.22, 1, 0.36, 1);
}

.outro-quote-stage.is-tugging-quote .outro-quote-stage__body {
	animation: endingCopyTension 0.92s cubic-bezier(0.22, 1, 0.36, 1);
}

.outro-quote-stage.is-tugging-quote .outro-quote-stage__quote {
	animation: endingLineTug 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.outro-quote-stage.is-tugging-quote .outro-quote-stage__source {
	animation: endingLineTug 0.88s cubic-bezier(0.22, 1, 0.36, 1) 0.04s;
}

.outro-quote-stage__quote {
	color: var(--ink-strong);
	font-family: 'Solway', serif;
	font-size: clamp(1.35rem, 0.95vw + 1.05rem, 1.95rem);
	line-height: 1.24;
	margin: 0;
	max-width: 28ch;
	position: relative;
	text-align: center;
	text-wrap: balance;
}

.outro-quote-stage__quote::before {
	color: rgba(255, 176, 108, 0.74);
	content: '“';
	font-size: 1.2em;
	line-height: 0;
	margin-right: 0.12em;
	vertical-align: -0.14em;
}

.outro-quote-stage__quote::after {
	color: rgba(255, 176, 108, 0.74);
	content: '”';
	font-size: 1.2em;
	line-height: 0;
	margin-left: 0.08em;
	vertical-align: -0.18em;
}

.outro-quote-stage__source {
	color: var(--ink-subtle);
	font-size: var(--type-meta-size);
	letter-spacing: 0.14em;
	line-height: 1.25;
	margin: 0;
	text-align: center;
	text-transform: uppercase;
}

.outro-quote-stage__next {
	appearance: none;
	background: rgba(255, 255, 255, 0.14);
	border: 1px solid var(--glass-border-strong);
	border-radius: 999px;
	box-shadow: 0 0.7rem 1.6rem rgba(74, 70, 74, 0.08);
	color: inherit;
	cursor: pointer;
	display: grid;
	min-width: 3rem;
	padding: 0;
	place-items: center;
	position: relative;
	transition:
		background-color 0.25s ease,
		border-color 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.25s ease,
		opacity 0.25s ease;
	height: 3rem;
	width: 3rem;
}

.outro-quote-stage__next:hover,
.outro-quote-stage__next:focus-visible {
	background: rgba(255, 255, 255, 0.28);
	border-color: rgba(255, 176, 108, 0.34);
	box-shadow: 0 0.95rem 1.9rem rgba(74, 70, 74, 0.1);
	transform: translateY(-0.05rem);
}

.outro-quote-stage__next:disabled {
	cursor: default;
	opacity: 0.38;
	transform: none;
}

.outro-quote-stage__next[hidden] {
	display: none;
}

.outro-quote-stage__next-icon {
	display: block;
	height: 1.15rem;
	position: relative;
	width: 1.15rem;
}

.outro-quote-stage__next-icon::before,
.outro-quote-stage__next-icon::after {
	content: '';
	position: absolute;
}

.outro-quote-stage__next-icon::before {
	background: currentColor;
	border-radius: 999px;
	height: 1px;
	left: 0.08rem;
	top: 50%;
	transform: translateY(-50%);
	width: 0.82rem;
}

.outro-quote-stage__next-icon::after {
	border-right: 1px solid currentColor;
	border-top: 1px solid currentColor;
	height: 0.52rem;
	right: 0.04rem;
	top: 50%;
	transform: translateY(-50%) rotate(45deg);
	width: 0.52rem;
}

.outro-copy {
	font-size: var(--type-outro-size) !important;
	grid-area: 1 / 1;
	line-height: 1.34 !important;
	margin: 0;
	max-height: 100vh;
	overflow: visible;
	padding-bottom: 0.45rem;
	text-align: center;
	text-wrap: balance;
	transform: translateY(0) scale(1);
	transition:
		filter 1.35s ease,
		opacity 1.35s ease,
		transform 0.72s cubic-bezier(0.22, 1, 0.36, 1),
		max-height 0.58s cubic-bezier(0.22, 1, 0.36, 1),
		margin 0.58s cubic-bezier(0.22, 1, 0.36, 1),
		padding-bottom 0.58s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: filter, opacity, transform;
	width: 100%;
}

.outro-copy span.p:nth-child(n + 2) {
	margin-top: 0.65rem !important;
}

.outro-copy span.p {
	transform-origin: 50% 50%;
	transition:
		opacity 1.4s cubic-bezier(0.22, 1, 0.36, 1),
		filter 1.4s ease,
		transform 1.55s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, filter, transform;
}

.outro-copy span.p:last-child {
	white-space: nowrap;
}

body.has-outro-return-ui .outro-copy,
body.has-outro-intro-complete .outro-copy {
	filter: blur(0.85rem);
	margin: 0;
	max-height: 0;
	opacity: 0;
	overflow: clip;
	padding-bottom: 0;
	pointer-events: none;
	transform: translateY(-0.75rem) scale(0.985);
}

body.has-outro-return-ui .outro-copy span.p,
body.has-outro-intro-complete .outro-copy span.p {
	filter: blur(0.45rem);
	opacity: 0;
	transform: translateY(-0.35rem) scale(0.988);
}

.outro-copy.is-dissolved {
	opacity: 0.22;
	pointer-events: none;
}

.outro-copy.is-dissolved span.p:first-child {
	filter: blur(0.45rem);
	opacity: 0;
	transform: translateY(-0.12rem) scale(0.992);
	transition-delay: 0.1s;
}

.outro-copy.is-dissolved span.p:last-child {
	filter: blur(0.95rem);
	opacity: 0;
	transform: translateY(0.9rem) scale(0.975);
	transition-delay: 0.24s;
}

.outro-copy.is-tugging-copy {
	animation: endingCopyTension 0.92s cubic-bezier(0.22, 1, 0.36, 1);
}

.outro-copy.is-tugging-copy span.p:first-child {
	animation: endingLineTug 0.8s cubic-bezier(0.22, 1, 0.36, 1);
}

.outro-copy.is-tugging-copy span.p:last-child {
	animation: endingLineTug 0.88s cubic-bezier(0.22, 1, 0.36, 1) 0.04s;
}

body.ending-drift::before {
	transition:
		transform 1.45s cubic-bezier(0.22, 1, 0.36, 1),
		filter 1.65s cubic-bezier(0.22, 1, 0.36, 1),
		opacity 1.45s ease;
	filter: var(--afterglow-dot-filter);
	opacity: 0.97;
	transform: scale(1.018);
}

body.ending-drift .ambient-overlay {
	--theme-ending-ambience-overlay-opacity: 0.78;
	--theme-ending-ambience-before-opacity: 0.82;
	--theme-ending-ambience-before-transform: translateY(-0.42rem) scale(1.035);
	--theme-ending-ambience-after-opacity: 0.52;
	--theme-ending-ambience-after-transform: translateY(-0.18rem) scale(1.025);
	opacity: var(--theme-ending-ambience-overlay-opacity);
}

body.ending-drift .ambient-overlay::before {
	opacity: var(--theme-ending-ambience-before-opacity);
	transform: var(--theme-ending-ambience-before-transform);
}

body.ending-drift .ambient-overlay::after {
	opacity: var(--theme-ending-ambience-after-opacity);
	transform: var(--theme-ending-ambience-after-transform);
}

body.ending-drift .experience-section--outro::before {
	opacity: 0;
	transform: none;
}

body.ending-drift .soundtrack-vinyl-wrap {
	animation: endingRecordDrift 1.24s cubic-bezier(0.22, 1, 0.36, 1);
}

body.ending-drift .soundtrack-vinyl {
	box-shadow:
		inset 0 0 0 0.08rem var(--soundtrack-vinyl-inset),
		inset 0 -1rem 1.6rem var(--soundtrack-vinyl-shadow-inset),
		0 1.5rem 2.8rem var(--soundtrack-vinyl-shadow-drop),
		0 0 1.55rem rgba(255, 176, 108, 0.16);
	filter: saturate(1.08) brightness(1.04);
}

body.ending-drift .soundtrack-vinyl__label {
	animation: endingRecordGlow 1.24s ease-in-out 1;
}

.scroll-cue {
	appearance: none;
	backdrop-filter: blur(16px);
	background: var(--cue-bg);
	border: 0;
	bottom: clamp(1.4rem, 3.4vw, 2.6rem);
	border-radius: 999px;
	box-shadow: var(--cue-shadow);
	color: inherit;
	cursor: pointer;
	display: inline-grid;
	height: 3.2rem;
	place-items: center;
	left: 50%;
	opacity: 0;
	padding: 0;
	pointer-events: none;
	position: absolute;
	transform: translate(-50%, 0.9rem);
	transition: opacity 0.45s ease, transform 0.45s ease;
	width: 3.2rem;
	z-index: 2;
}

.scroll-cue.is-visible {
	opacity: 1;
	pointer-events: auto;
	transform: translate(-50%, 0);
}

.scroll-cue__halo,
.scroll-cue__halo::after {
	border: 1px solid var(--cue-border);
	border-radius: 999px;
	inset: 0;
	position: absolute;
}

.scroll-cue__halo {
	animation: cueWave 2.8s ease-out infinite;
	background: radial-gradient(circle at center, var(--cue-center), transparent 62%);
	inset: 0.15rem;
}

.scroll-cue__halo::after {
	animation: cueWave 2.8s ease-out 1.1s infinite;
	content: '';
}

.scroll-cue__icon {
	animation: cueArrowFloat 1.8s ease-in-out infinite;
	display: block;
	height: 1.1rem;
	position: relative;
	width: 1.1rem;
	z-index: 1;
}

.scroll-cue__icon::before,
.scroll-cue__icon::after {
	content: '';
	position: absolute;
}

.scroll-cue__icon::before {
	background: var(--cue-ink);
	border-radius: 999px;
	height: 0.75rem;
	left: 50%;
	top: 0.05rem;
	transform: translateX(-50%);
	width: 1px;
}

.scroll-cue__icon::after {
	border-bottom: 1px solid var(--cue-ink);
	border-right: 1px solid var(--cue-ink);
	height: 0.45rem;
	left: 50%;
	top: 0.45rem;
	transform: translateX(-50%) rotate(45deg);
	width: 0.45rem;
}

.scroll-cue:hover .scroll-cue__icon,
.scroll-cue:focus-visible .scroll-cue__icon {
	animation: cueArrow 0.9s ease;
}

@keyframes cueWave {
	0%,
	100% {
		opacity: 0;
		transform: scale(0.9);
	}
	30% {
		opacity: 0.42;
	}
	70% {
		opacity: 0.14;
	}
	100% {
		opacity: 0;
		transform: scale(1.24);
	}
}

@keyframes cueArrow {
	0%,
	100% {
		transform: translateY(0);
	}
	40% {
		transform: translateY(0.2rem);
	}
}

@keyframes cueArrowFloat {
	0%,
	100% {
		transform: translateY(0);
	}
	50% {
		transform: translateY(0.16rem);
	}
}

@keyframes endingCopyTension {
	0% {
		filter: saturate(1);
		text-shadow: 0 0 0 transparent;
		transform: translateY(0);
	}
	38% {
		filter: saturate(1.05);
		text-shadow: 0 0 0.95rem var(--ending-bloom-shadow);
		transform: translateY(-0.04rem);
	}
	70% {
		text-shadow: 0 0 0.28rem rgba(255, 176, 108, 0.16);
		transform: translateY(0.015rem);
	}
	86% {
		filter: saturate(1.01);
		text-shadow: 0 0 0.08rem rgba(255, 176, 108, 0.08);
		transform: translateY(0.004rem);
	}
	100% {
		filter: saturate(1);
		text-shadow: 0 0 0 transparent;
		transform: translateY(0);
	}
}

@keyframes endingLineTug {
	0%,
	100% {
		filter: blur(0);
		opacity: 1;
		text-shadow: 0 0 0 transparent;
		transform: translateY(0);
	}
	40% {
		filter: blur(0.06rem);
		opacity: 0.97;
		text-shadow: 0 0 1rem var(--ending-bloom-shadow);
		transform: translateY(-0.16rem);
	}
	72% {
		filter: blur(0);
		opacity: 1;
		text-shadow: 0 0 0.24rem rgba(255, 176, 108, 0.18);
		transform: translateY(0.03rem);
	}
	88% {
		text-shadow: 0 0 0.08rem rgba(255, 176, 108, 0.08);
		transform: translateY(0.008rem);
	}
}

@keyframes endingRecordDrift {
	0%,
	100% {
		transform: translate3d(0, 0, 0) rotate(0deg);
	}
	36% {
		transform: translate3d(-0.45rem, 0.34rem, 0) rotate(-3deg);
	}
	68% {
		transform: translate3d(-0.18rem, 0.12rem, 0) rotate(-1deg);
	}
}

@keyframes endingAfterglowBloom {
	from {
		filter: blur(58px) saturate(1);
		opacity: 0.78;
		transform: translate3d(-1.5%, 0, 0) scale(1);
	}
	to {
		filter: blur(66px) saturate(1.06);
		opacity: 1;
		transform: translate3d(1.5%, -1.5%, 0) scale(1.08);
	}
}

@keyframes endingAfterglowSheen {
	from {
		opacity: 0.22;
		transform: translate3d(-4%, 0, 0) scale(1.02);
	}
	to {
		opacity: 0.44;
		transform: translate3d(4%, -1%, 0) scale(1.08);
	}
}

@keyframes ambientPaletteBloom {
	from {
		transform: translate3d(-1.5%, 1.4%, 0) scale(0.98);
	}
	to {
		transform: translate3d(1.8%, -1.8%, 0) scale(1.05);
	}
}

@keyframes ambientPaletteSweep {
	from {
		transform: translate3d(-2%, 0.8%, 0) scale(0.985);
	}
	to {
		transform: translate3d(2.4%, -1.2%, 0) scale(1.03);
	}
}

@keyframes dotFieldDrift {
	from {
		background-position: 0 0, 4.25rem 4.25rem;
	}
	50% {
		background-position: 0.55rem -0.35rem, 3.75rem 4.65rem;
	}
	to {
		background-position: -0.45rem 0.5rem, 4.75rem 3.9rem;
	}
}

@keyframes endingRecordGlow {
	0%,
	100% {
		box-shadow:
			inset 0 0 0 0.08rem var(--soundtrack-label-shadow),
			0 0 0 0.02rem rgba(255, 255, 255, 0.04),
			0 0 0 rgba(255, 176, 108, 0);
		filter: saturate(1) brightness(1);
	}
	50% {
		box-shadow:
			inset 0 0 0 0.08rem var(--soundtrack-label-shadow),
			0 0 0 0.02rem rgba(255, 255, 255, 0.04),
			0 0 1.1rem rgba(255, 176, 108, 0.12);
		filter: saturate(1.08) brightness(1.03);
	}
}

@keyframes outroQuoteSwap {
	0% {
		filter: blur(0.55rem);
		opacity: 0.2;
		transform: translateY(0.5rem) scale(0.985);
	}
	70% {
		filter: blur(0);
		opacity: 1;
		transform: translateY(-0.04rem) scale(1);
	}
	100% {
		filter: blur(0);
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes outroQuoteSheen {
	0% {
		opacity: 0;
		transform: translateX(-115%);
	}
	25% {
		opacity: 0.9;
	}
	100% {
		opacity: 0;
		transform: translateX(115%);
	}
}

body.is-tugging .ambient-overlay::before,
body.is-tugging .ambient-overlay::after {
	opacity: 0.82;
}

body.is-tugging-forward .ambient-overlay::before {
	transform: translateY(-1rem) scale(1.02);
}

body.is-tugging-forward .ambient-overlay::after {
	transform: translateY(-0.45rem) scale(1.015);
}

body.is-tugging-backward .ambient-overlay::before {
	transform: translateY(1rem) scale(1.02);
}

body.is-tugging-backward .ambient-overlay::after {
	transform: translateY(0.45rem) scale(1.015);
}

.experience-section.is-arriving .section-shell,
.experience-section.is-departing .section-shell {
	will-change: opacity, transform;
}

body.is-tugging-forward .experience-section.is-departing .section-shell {
	animation: tugDepartForward 0.85s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.is-tugging-forward .experience-section.is-arriving .section-shell {
	animation: tugArriveForward 0.92s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.is-tugging-backward .experience-section.is-departing .section-shell {
	animation: tugDepartBackward 0.85s cubic-bezier(0.22, 1, 0.36, 1) both;
}

body.is-tugging-backward .experience-section.is-arriving .section-shell {
	animation: tugArriveBackward 0.92s cubic-bezier(0.22, 1, 0.36, 1) both;
}

@keyframes tugDepartForward {
	0% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
	100% {
		opacity: 0.48;
		transform: translateY(-1.6rem) scale(0.986);
	}
}

@keyframes tugArriveForward {
	0% {
		opacity: 0.34;
		transform: translateY(4rem);
	}
	72% {
		opacity: 1;
		transform: translateY(-0.28rem);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes tugDepartBackward {
	0% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
	100% {
		opacity: 0.48;
		transform: translateY(1.6rem) scale(0.986);
	}
}

@keyframes tugArriveBackward {
	0% {
		opacity: 0.34;
		transform: translateY(-4rem);
	}
	72% {
		opacity: 1;
		transform: translateY(0.28rem);
	}
	100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes progressLabelEnter {
	0% {
		filter: blur(0.42rem);
		opacity: 0.18;
		transform: translateY(0.42rem) scale(0.985);
	}
	68% {
		filter: blur(0);
		opacity: 1;
		transform: translateY(-0.05rem) scale(1);
	}
	100% {
		filter: blur(0);
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes progressLabelLeave {
	0% {
		filter: blur(0);
		opacity: 1;
		transform: translateY(0) scale(1);
	}
	100% {
		filter: blur(0.24rem);
		opacity: 0;
		transform: translateY(-0.18rem) scale(0.992);
	}
}

.section-progress {
	-webkit-backdrop-filter: blur(24px) saturate(1.12);
	backdrop-filter: blur(24px) saturate(1.12);
	background: linear-gradient(180deg, var(--progress-trigger-bg), var(--progress-card-bg));
	border: 1px solid var(--progress-trigger-border);
	border-radius: 999px;
	box-shadow: var(--progress-trigger-shadow);
	display: grid;
	gap: 0;
	isolation: isolate;
	left: 50%;
	overflow: clip;
	padding: 0.22rem;
	position: fixed;
	top: calc(0.9rem + env(safe-area-inset-top));
	transform: translateX(-50%);
	transform-origin: top center;
	transition:
		width 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		max-height 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		border-radius 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		border-color 0.32s ease,
		box-shadow 0.34s ease,
		background-color 0.32s ease,
		opacity 0.3s ease,
		filter 0.34s ease,
		transform 0.34s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: width, max-height, transform, border-radius;
	width: min(20rem, calc(100vw - 6rem));
	max-height: 3.34rem;
	z-index: 20;
}

.section-progress.is-edge:not(:hover):not(:focus-within):not(.is-pinned):not(.is-announcing) {
	width: 3.34rem;
}

.section-progress.is-ending-hidden:not(:hover):not(:focus-within):not(.is-pinned):not(.is-announcing) {
	filter: blur(0.4rem);
	opacity: 0;
	transform: translateX(-50%) translateY(-0.72rem) scale(0.9);
}

.section-progress::before,
.section-progress::after {
	content: '';
	pointer-events: none;
	position: absolute;
	transition:
		opacity 0.35s ease,
		transform 0.34s cubic-bezier(0.22, 1, 0.36, 1),
		border-radius 0.34s cubic-bezier(0.22, 1, 0.36, 1);
}

.section-progress::before {
	border: 1px solid var(--progress-trigger-ring);
	border-radius: inherit;
	inset: 0.26rem;
	opacity: 0.95;
}

.section-progress::after {
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.05), rgba(255, 255, 255, 0.015) 46%, transparent 72%);
	border-radius: inherit;
	inset: 0;
	opacity: 0;
	transform: scale(1);
}

.section-progress__trigger {
	appearance: none;
	border-radius: 999px;
	border: 0;
	background: transparent;
	color: inherit;
	cursor: pointer;
	display: flex;
	height: 2.9rem;
	align-items: center;
	justify-content: center;
	min-width: 0;
	padding: 0 1rem;
	position: relative;
	width: 100%;
	transition:
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		padding-inline 0.35s cubic-bezier(0.22, 1, 0.36, 1);
}

.section-progress__trigger-label {
	align-items: center;
	color: var(--progress-trigger-text);
	display: inline-grid;
	font-family: 'Solway', serif;
	font-size: var(--type-progress-label-size);
	letter-spacing: 0.01em;
	line-height: 1.1;
	margin-left: 0;
	max-width: 100%;
	opacity: 1;
	overflow: visible;
	position: relative;
	place-items: center;
	text-align: center;
	transform: none;
	transition:
		opacity 0.28s ease,
		transform 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		max-width 0.35s cubic-bezier(0.22, 1, 0.36, 1),
		margin-left 0.35s cubic-bezier(0.22, 1, 0.36, 1);
	visibility: visible;
	will-change: opacity, transform;
	white-space: nowrap;
	z-index: 1;
}

.section-progress__trigger-stage {
	align-items: center;
	display: inline-flex;
	gap: 0.36rem;
	grid-area: 1 / 1;
	justify-content: center;
	white-space: nowrap;
}

.section-progress__trigger-label.is-swapping .section-progress__trigger-stage {
	pointer-events: none;
}

.section-progress__trigger-stage.is-leaving {
	animation: progressLabelLeave 0.24s cubic-bezier(0.33, 1, 0.68, 1) forwards;
}

.section-progress__trigger-stage.is-entering {
	animation: progressLabelEnter 0.38s cubic-bezier(0.22, 1, 0.36, 1) both;
}

.section-progress__trigger-icon {
	align-items: center;
	display: inline-flex;
	flex: 0 0 auto;
	font-size: 1.08em;
	justify-content: center;
	line-height: 1.15;
	transform: translateY(0.06em);
}

.section-progress__trigger-text {
	display: inline-block;
	white-space: nowrap;
}

.section-progress.is-edge:not(:hover):not(:focus-within):not(.is-pinned):not(.is-announcing) .section-progress__trigger-label {
	transition-delay: 0s;
	transition-duration: 0s;
	max-width: 0;
	opacity: 0;
	overflow: hidden;
	transform: translateX(-0.24rem);
	visibility: hidden;
}

.section-progress__panel {
	display: grid;
	filter: blur(6px);
	gap: 0.3rem;
	opacity: 0;
	padding: 0.18rem 0.24rem 0.28rem;
	pointer-events: none;
	position: relative;
	transform: translateY(-0.45rem) scale(0.985);
	transform-origin: top center;
	transition:
		opacity 0.18s ease 0.08s,
		transform 0.32s cubic-bezier(0.22, 1, 0.36, 1) 0.04s,
		filter 0.32s ease 0.04s;
	width: 100%;
	z-index: 1;
}

.section-progress:hover,
.section-progress:focus-within,
.section-progress.is-pinned,
.section-progress.is-announcing {
	border-color: var(--progress-item-active-border);
	box-shadow: var(--progress-hover-shadow);
	transform: translateX(-50%) translateY(0.02rem);
}

.section-progress:hover,
.section-progress:focus-within,
.section-progress.is-pinned {
	background: linear-gradient(180deg, var(--progress-trigger-bg), var(--progress-card-bg));
	border-radius: 1.32rem;
	max-height: 20rem;
}

.section-progress:hover::after,
.section-progress:focus-within::after,
.section-progress.is-pinned::after {
	opacity: 0.98;
	transform: scale(1.02);
}

.section-progress:hover .section-progress__panel,
.section-progress:focus-within .section-progress__panel,
.section-progress.is-pinned .section-progress__panel {
	filter: blur(0);
	opacity: 1;
	pointer-events: auto;
	transform: translateY(0) scale(1);
}

.section-progress__eyebrow {
	color: var(--progress-kicker);
	font-size: var(--type-progress-kicker-size);
	letter-spacing: 0.18em;
	margin: 0 0 0.25rem;
	padding: 0 0.35rem;
	text-transform: uppercase;
}

.section-progress__item {
	align-items: center;
	appearance: none;
	background: transparent;
	border: 1px solid transparent;
	border-radius: 0.95rem;
	color: inherit;
	cursor: pointer;
	display: grid;
	gap: 0;
	grid-template-columns: minmax(0, 1fr);
	padding: 0.52rem 0.82rem;
	text-align: left;
	transition:
		background-color 0.24s ease,
		border-color 0.24s ease,
		box-shadow 0.24s ease,
		transform 0.24s ease;
	width: 100%;
}

.section-progress__label {
	color: var(--progress-label);
	font-family: 'Solway', serif;
	font-size: var(--type-progress-label-size);
	line-height: 1.15;
	transition: color 0.24s ease;
}

.section-progress__item:hover,
.section-progress__item:focus-visible {
	background: var(--progress-item-hover);
	border-color: var(--progress-item-border);
	transform: translateY(-0.05rem);
}

.section-progress__item.is-active {
	background: var(--progress-item-active);
	border-color: var(--progress-item-active-border);
	box-shadow: var(--progress-item-shadow);
}

.section-progress__item.is-active .section-progress__label {
	color: var(--progress-label-active);
}

.soundtrack-shell {
	--soundtrack-drawer-width: 12.35rem;
	--soundtrack-shell-reserve: 18.9rem;
	position: fixed;
	right: 0;
	top: 0;
	width: calc(var(--soundtrack-drawer-width) + var(--soundtrack-shell-reserve));
	height: 15.75rem;
	isolation: isolate;
	overflow: visible;
	pointer-events: none;
	transition: width 0.62s cubic-bezier(0.22, 1, 0.36, 1);
	z-index: 30;
}

.soundtrack-player {
	position: relative;
	width: 100%;
	height: 100%;
	pointer-events: none;
	transform-origin: top right;
	z-index: 1;
}

.soundtrack-player::before,
.soundtrack-player::after {
	content: '';
	inset: 0;
	pointer-events: none;
	position: absolute;
}

.soundtrack-player::before {
	background:
		radial-gradient(circle at top right, transparent 0 7.95rem, var(--soundtrack-shell-ring-one) 8.03rem 8.15rem, transparent 8.23rem 100%),
		radial-gradient(circle at top right, transparent 0 10.15rem, var(--soundtrack-shell-ring-two) 10.23rem 10.33rem, transparent 10.41rem 100%);
	opacity: 0.7;
}

.soundtrack-player::after {
	background:
		radial-gradient(circle at top right, transparent 0 11.55rem, var(--soundtrack-shell-accent) 11.63rem 11.75rem, transparent 11.83rem 100%),
		radial-gradient(circle at calc(100% - 2rem) 2rem, var(--soundtrack-shell-ring-two) 0 0.16rem, transparent 0.8rem);
	filter: blur(0.18rem);
	opacity: 0.42;
}

/* ── Vinyl Wrapper (handles translation on hover) ── */

.soundtrack-vinyl-wrap {
	--vinyl-size: clamp(15.65rem, 19.4vw, 17.85rem);
	position: absolute;
	right: -2.8rem;
	top: -2.8rem;
	width: var(--vinyl-size);
	height: var(--vinyl-size);
	pointer-events: auto;
	cursor: pointer;
	z-index: 2;
	transition: right 0.55s cubic-bezier(0.33, 1, 0.68, 1), top 0.55s cubic-bezier(0.33, 1, 0.68, 1), transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.soundtrack-shell:has(:hover) .soundtrack-vinyl-wrap,
.soundtrack-shell:has(:focus-within) .soundtrack-vinyl-wrap,
.soundtrack-shell.is-expanded .soundtrack-vinyl-wrap {
	right: -0.08rem;
	top: -0.08rem;
	transform: translate3d(0, 0, 0) scale(1.015);
}

/* ── Vinyl Disc ── */

.soundtrack-vinyl {
	width: 100%;
	height: 100%;
	align-items: center;
	animation: soundtrack-spin 5.8s linear infinite;
	animation-play-state: paused;
	background:
		radial-gradient(circle at 34% 30%, var(--soundtrack-vinyl-highlight) 0 14%, transparent 29%),
		radial-gradient(circle at 72% 72%, rgba(255, 255, 255, 0.03) 0 10%, transparent 24%),
		linear-gradient(145deg, rgba(255, 255, 255, 0.05), transparent 34%, rgba(255, 255, 255, 0.035) 74%, transparent 100%),
		radial-gradient(circle at center, var(--soundtrack-vinyl-center) 0 17%, var(--soundtrack-vinyl-mid) 18% 41%, var(--soundtrack-vinyl-edge) 42% 100%);
	border: 1px solid var(--soundtrack-vinyl-border);
	border-radius: 50%;
	box-shadow:
		inset 0 0 0 0.08rem var(--soundtrack-vinyl-inset),
		inset 0 -0.9rem 1.45rem var(--soundtrack-vinyl-shadow-inset),
		0 1.2rem 2.35rem var(--soundtrack-vinyl-shadow-drop);
	display: grid;
	justify-items: center;
	position: relative;
}

.soundtrack-player.is-playing .soundtrack-vinyl {
	animation-play-state: running;
}

.soundtrack-player.is-muted .soundtrack-vinyl {
	filter: saturate(0.82) brightness(0.94);
}

body.ending-afterglow .soundtrack-vinyl {
	box-shadow:
		inset 0 0 0 0.08rem var(--soundtrack-vinyl-inset),
		inset 0 -0.9rem 1.45rem var(--soundtrack-vinyl-shadow-inset),
		0 1.2rem 2.35rem var(--soundtrack-vinyl-shadow-drop),
		0 0 1.25rem rgba(255, 176, 108, 0.1);
}

.soundtrack-vinyl::before {
	background:
		radial-gradient(circle at center, transparent 0 46%, var(--soundtrack-vinyl-inset) 47% 49%, transparent 50% 100%),
		repeating-radial-gradient(circle at center, transparent 0 0.6rem, var(--soundtrack-vinyl-groove) 0.61rem 0.7rem);
	border-radius: 50%;
	content: '';
	inset: 0.28rem;
	position: absolute;
}

.soundtrack-vinyl::after {
	background:
		radial-gradient(circle at center, rgba(255, 255, 255, 0.36) 0 0.16rem, rgba(13, 15, 15, 0.92) 0.18rem 0.5rem, rgba(255, 255, 255, 0.08) 0.52rem 0.62rem, transparent 0.64rem 100%);
	border-radius: 50%;
	content: '';
	height: 1.35rem;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 1.35rem;
}

.soundtrack-vinyl__groove {
	border: 1px solid var(--soundtrack-vinyl-groove);
	border-radius: 50%;
	position: absolute;
}

.soundtrack-vinyl__groove--outer {
	inset: 0.64rem;
}

.soundtrack-vinyl__groove--inner {
	inset: 3.02rem;
}

.soundtrack-vinyl__label {
	background:
		radial-gradient(circle at 34% 28%, var(--soundtrack-label-sheen) 0 18%, transparent 34%),
		linear-gradient(165deg, color-mix(in srgb, var(--soundtrack-label-a) 84%, rgba(255, 255, 255, 0.1)), var(--soundtrack-label-b));
	aspect-ratio: 1 / 1;
	border: 1px solid var(--soundtrack-label-border);
	border-radius: 50%;
	box-shadow:
		inset 0 0 0 0.08rem var(--soundtrack-label-shadow),
		inset 0 -0.3rem 0.8rem rgba(13, 15, 15, 0.1),
		0 0 0 0.02rem rgba(255, 255, 255, 0.04);
	box-sizing: border-box;
	display: grid;
	height: 6.05rem;
	overflow: hidden;
	place-items: center;
	position: relative;
	width: 6.05rem;
}

body.ending-afterglow .soundtrack-vinyl__label {
	animation: endingRecordGlow 7.4s ease-in-out infinite;
}

.soundtrack-vinyl__label::before {
	background: radial-gradient(circle at center, transparent 0 61%, rgba(255, 255, 255, 0.08) 62% 64%, transparent 65% 100%);
	border-radius: 50%;
	content: '';
	inset: 0.34rem;
	position: absolute;
}

.soundtrack-vinyl__label::after {
	background: radial-gradient(circle at center, rgba(255, 255, 255, 0.26) 0 0.12rem, rgba(47, 44, 40, 0.9) 0.14rem 0.36rem, transparent 0.38rem 100%);
	border-radius: 50%;
	content: '';
	height: 0.7rem;
	left: 50%;
	position: absolute;
	top: 50%;
	transform: translate(-50%, -50%);
	width: 0.7rem;
}

.soundtrack-vinyl__label-content {
	animation: soundtrack-label-counter-spin 5.8s linear infinite;
	animation-play-state: paused;
	box-sizing: border-box;
	display: grid;
	filter: blur(0);
	align-items: stretch;
	justify-items: center;
	grid-template-rows: minmax(0, 1fr) minmax(0, 1fr);
	gap: 0;
	height: 100%;
	opacity: 1;
	padding: 0.6rem 0.72rem;
	position: relative;
	transition:
		opacity 0.24s ease,
		filter 0.34s ease;
	width: 100%;
	z-index: 1;
}

.soundtrack-player.is-playing .soundtrack-vinyl__label-content {
	animation-play-state: running;
}

.soundtrack-vinyl__label-artist,
.soundtrack-vinyl__label-title {
	color: var(--soundtrack-label-text, rgba(255, 255, 255, 0.88));
	display: -webkit-box;
	font-family: 'Solway', serif;
	line-height: 1.14;
	max-width: 100%;
	overflow: hidden;
	text-align: center;
	text-shadow: 0 1px 1px rgba(0, 0, 0, 0.18);
	transform: translate3d(0, 0, 0) scale(1);
	transform-origin: center;
	transition:
		opacity 0.24s ease,
		transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
	-webkit-box-orient: vertical;
	-webkit-line-clamp: 2;
}

.soundtrack-vinyl__label-artist {
	align-self: end;
	font-size: 0.52rem;
	font-weight: 500;
	letter-spacing: 0.08em;
	margin-bottom: 0.5rem;
	opacity: 0.8;
	text-transform: uppercase;
	-webkit-line-clamp: 1;
}

.soundtrack-vinyl__label-title {
	align-self: start;
	font-size: 0.66rem;
	font-weight: 400;
	letter-spacing: 0.01em;
	margin-top: 0.52rem;
	max-width: 84%;
}

.soundtrack-shell:has(:hover) .soundtrack-vinyl__label-content,
.soundtrack-shell:has(:focus-within) .soundtrack-vinyl__label-content,
.soundtrack-shell.is-expanded .soundtrack-vinyl__label-content {
	filter: blur(0.16rem);
	opacity: 0;
}

.soundtrack-shell:has(:hover) .soundtrack-vinyl__label-artist,
.soundtrack-shell:has(:focus-within) .soundtrack-vinyl__label-artist,
.soundtrack-shell.is-expanded .soundtrack-vinyl__label-artist {
	opacity: 0;
	transform: translate3d(0, -0.42rem, 0) scale(0.92);
}

.soundtrack-shell:has(:hover) .soundtrack-vinyl__label-title,
.soundtrack-shell:has(:focus-within) .soundtrack-vinyl__label-title,
.soundtrack-shell.is-expanded .soundtrack-vinyl__label-title {
	opacity: 0;
	transform: translate3d(0, 0.42rem, 0) scale(0.92);
}

/* ── Drawer (slides out on hover) ── */

.soundtrack-drawer {
	--soundtrack-drawer-shift: 1.5rem;
	align-items: center;
	background: var(--soundtrack-card-bg);
	backdrop-filter: blur(18px);
	border: 1px solid var(--soundtrack-card-border);
	border-radius: 1.2rem;
	box-shadow: var(--soundtrack-card-shadow);
	display: flex;
	flex-direction: column;
	gap: 0.7rem;
	opacity: 0;
	padding: 0.85rem 1rem;
	pointer-events: none;
	position: absolute;
	right: 14.65rem;
	top: 2.2rem;
	transform: translate3d(var(--soundtrack-drawer-shift), 0, 0);
	transition:
		opacity 0.35s ease,
		transform 0.45s cubic-bezier(0.33, 1, 0.68, 1),
		width 0.62s cubic-bezier(0.22, 1, 0.36, 1),
		filter 0.4s ease,
		border-radius 0.4s ease;
	width: var(--soundtrack-drawer-width);
	will-change: transform, width, filter;
	z-index: 3;
}

.soundtrack-shell:has(:hover) .soundtrack-drawer,
.soundtrack-shell:has(:focus-within) .soundtrack-drawer,
.soundtrack-shell.is-expanded .soundtrack-drawer {
	opacity: 1;
	pointer-events: auto;
	--soundtrack-drawer-shift: 0rem;
}

/* ── Track Info ── */

.soundtrack-meta {
	display: grid;
	gap: 0.18rem;
	justify-items: center;
	text-align: center;
	width: 100%;
}

.soundtrack-meta__track {
	color: var(--ink-strong);
	display: block;
	font-size: 0.82rem;
	line-height: 1.35;
	margin: 0 auto;
	max-width: 100%;
	min-height: calc(1.35em * 2);
	text-wrap: balance;
}

.soundtrack-meta__track--measure {
	left: -999rem;
	max-width: none !important;
	position: fixed;
	top: -999rem;
	visibility: hidden;
	white-space: nowrap;
	width: auto !important;
}

/* ── Controls Row ── */

.soundtrack-controls {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 0.5rem;
}

.soundtrack-btn {
	appearance: none;
	display: grid;
	place-items: center;
	width: 2.2rem;
	height: 2.2rem;
	padding: 0;
	background: var(--soundtrack-btn-bg);
	border: 1.5px solid var(--soundtrack-btn-border);
	border-radius: 50%;
	box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
	cursor: pointer;
	transform: translate3d(0, 0, 0) scale(1);
	transform-origin: center;
	transition:
		background 0.2s ease,
		box-shadow 0.2s ease,
		border-color 0.2s ease,
		transform 0.14s ease;
	will-change: transform;
}

.soundtrack-btn__icon {
	width: 1rem;
	height: 1rem;
	fill: var(--ink-strong);
	transition: transform 0.14s ease;
}

.soundtrack-btn__vol-wave {
	stroke: var(--ink-strong);
}

/* Play/pause icon toggle */
.soundtrack-btn__pause { display: none; }
.soundtrack-btn--play.is-playing .soundtrack-btn__play { display: none; }
.soundtrack-btn--play.is-playing .soundtrack-btn__pause { display: inline; }

/* Mute icon toggle */
.soundtrack-btn--mute.is-muted .soundtrack-btn__vol-wave { display: none; }

.soundtrack-btn:hover,
.soundtrack-btn:focus-visible {
	background: var(--soundtrack-btn-bg-hover);
	border-color: var(--accent-green-soft);
	box-shadow: 0 2px 12px rgba(0, 0, 0, 0.2), 0 0 0 3px var(--accent-green-soft);
}

.soundtrack-btn:active,
.soundtrack-btn.is-pressed {
	background: var(--soundtrack-btn-bg-hover);
	border-color: var(--accent-green-soft);
	box-shadow:
		inset 0 0.12rem 0.4rem rgba(17, 19, 18, 0.16),
		0 1px 4px rgba(0, 0, 0, 0.14),
		0 0 0 2px var(--accent-green-soft);
	transform: translate3d(0, 0.14rem, 0) scale(0.94);
}

.soundtrack-btn:active .soundtrack-btn__icon,
.soundtrack-btn.is-pressed .soundtrack-btn__icon {
	transform: scale(0.94);
}

.soundtrack-btn--sm {
	width: 1.6rem;
	height: 1.6rem;
	flex-shrink: 0;
}

.soundtrack-btn--sm .soundtrack-btn__icon {
	width: 0.72rem;
	height: 0.72rem;
}

/* ── Volume Slider ── */

.soundtrack-mix {
	display: flex;
	align-items: center;
	gap: 0.4rem;
	justify-content: center;
	position: relative;
	width: 100%;
	z-index: 1;
}

.soundtrack-volume {
	-webkit-appearance: none;
	appearance: none;
	background: transparent;
	cursor: pointer;
	flex: 0 1 7.25rem;
	height: 1.9rem;
	margin: 0;
	max-width: 7.25rem;
	min-width: 0;
	pointer-events: auto;
	position: relative;
	touch-action: manipulation;
	--volume-level: 20%;
	z-index: 1;
}

.soundtrack-volume::-webkit-slider-runnable-track {
	background: linear-gradient(90deg, var(--soundtrack-track-fill) 0 var(--volume-level), var(--soundtrack-track-bg) var(--volume-level) 100%);
	border-radius: 999px;
	box-shadow: inset 0 0 0 1px var(--soundtrack-track-inset);
	height: 0.34rem;
}

.soundtrack-volume::-moz-range-track {
	background: linear-gradient(90deg, var(--soundtrack-track-fill) 0 var(--volume-level), var(--soundtrack-track-bg) var(--volume-level) 100%);
	border-radius: 999px;
	box-shadow: inset 0 0 0 1px var(--soundtrack-track-inset);
	height: 0.34rem;
}

.soundtrack-volume::-webkit-slider-thumb {
	-webkit-appearance: none;
	appearance: none;
	background: var(--soundtrack-thumb-bg);
	border: 1px solid var(--soundtrack-thumb-border);
	border-radius: 999px;
	box-shadow: var(--soundtrack-thumb-shadow);
	height: 1.02rem;
	margin-top: -0.35rem;
	transition: transform 0.22s ease, box-shadow 0.22s ease;
	width: 1.02rem;
}

.soundtrack-volume::-moz-range-thumb {
	background: var(--soundtrack-thumb-bg);
	border: 1px solid var(--soundtrack-thumb-border);
	border-radius: 999px;
	box-shadow: var(--soundtrack-thumb-shadow);
	height: 1.02rem;
	transition: transform 0.22s ease, box-shadow 0.22s ease;
	width: 1.02rem;
}

.soundtrack-volume:hover::-webkit-slider-thumb,
.soundtrack-volume:focus-visible::-webkit-slider-thumb {
	box-shadow: var(--soundtrack-thumb-glow);
	transform: scale(1.06);
}

.soundtrack-volume:hover::-moz-range-thumb,
.soundtrack-volume:focus-visible::-moz-range-thumb {
	box-shadow: var(--soundtrack-thumb-glow);
	transform: scale(1.06);
}

@keyframes soundtrack-spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(360deg);
	}
}

@keyframes soundtrack-label-counter-spin {
	from {
		transform: rotate(0deg);
	}

	to {
		transform: rotate(-360deg);
	}
}

@keyframes soundtrack-prompt-timer {
	from {
		opacity: 1;
		stroke-dashoffset: 0;
	}

	to {
		opacity: 0.45;
		stroke-dashoffset: 100.53;
	}
}

.soundtrack-prompt {
	--prompt-dismiss-duration: 7200ms;
	--prompt-scale: 1;
	background: var(--glass-fill-strong);
	backdrop-filter: blur(20px);
	border: 1px solid var(--glass-border-strong);
	border-radius: 1.38rem;
	box-shadow: var(--highlight-shadow);
	display: grid;
	gap: 0.8rem;
	left: calc(100% + 0.9rem);
	max-width: min(19.5rem, calc(100vw - 4rem));
	min-width: 0;
	opacity: 0;
	overflow: visible;
	padding: 0.95rem 1.35rem 0.9rem 1rem;
	pointer-events: none;
	position: absolute;
	top: 0.2rem;
	filter: blur(0.22rem);
	transform: translate3d(-0.75rem, 0.85rem, 0) scale(calc(0.9 * var(--prompt-scale)));
	transform-origin: left 1.9rem;
	transition:
		opacity 0.32s ease,
		filter 0.42s ease,
		transform 0.52s cubic-bezier(0.22, 1, 0.36, 1);
	will-change: opacity, transform, filter;
	width: max-content;
	z-index: 6;
}

.soundtrack-prompt::after {
	background: var(--glass-fill-strong);
	border-bottom: 1px solid var(--glass-border-strong);
	border-left: 1px solid var(--glass-border-strong);
	content: '';
	height: 0.9rem;
	left: -0.42rem;
	position: absolute;
	top: 1.55rem;
	transform: rotate(45deg);
	width: 0.9rem;
}

.soundtrack-prompt.is-visible {
	filter: blur(0);
	opacity: 1;
	pointer-events: auto;
	transform: translate3d(0, 0, 0) scale(var(--prompt-scale));
}

.soundtrack-prompt__copy {
	color: var(--ink-strong);
	font-family: 'Solway', serif;
	font-size: 0.86rem;
	line-height: 1.42;
	max-width: 100%;
	text-align: left;
	text-wrap: balance;
}

.soundtrack-prompt__actions {
	display: flex;
	justify-content: flex-start;
	width: 100%;
}

.soundtrack-prompt__button {
	align-items: center;
	appearance: none;
	background: var(--soundtrack-prompt-button-accent-bg);
	border: 1px solid var(--soundtrack-prompt-button-accent-border);
	border-radius: 999px;
	color: var(--ink-strong);
	cursor: pointer;
	display: inline-flex;
	font-family: 'Solway', serif;
	font-size: 0.82rem;
	font-weight: 600;
	justify-content: center;
	padding: 0.46rem 0.84rem;
	transition:
		background-color 0.25s ease,
		border-color 0.25s ease,
		box-shadow 0.25s ease,
		transform 0.25s ease;
	width: auto;
}

.soundtrack-prompt__button--primary {
	box-shadow: 0 0.55rem 1.1rem rgba(17, 19, 18, 0.08);
}

.soundtrack-prompt__button-label {
	display: inline-block;
	line-height: 1.1;
}

.soundtrack-prompt__button:hover,
.soundtrack-prompt__button:focus-visible {
	background: var(--accent-green-soft);
	border-color: var(--soundtrack-prompt-button-accent-border);
	box-shadow:
		0 0.7rem 1.35rem rgba(17, 19, 18, 0.1),
		0 0 0 0.16rem rgba(47, 101, 73, 0.08);
	transform: translateY(-1px);
}

.soundtrack-prompt__timer {
	appearance: none;
	background: var(--glass-fill-strong);
	border: 1px solid var(--glass-border-strong);
	border-radius: 999px;
	box-shadow: 0 0.75rem 1.5rem rgba(17, 19, 18, 0.12);
	color: var(--ink-strong);
	cursor: pointer;
	display: grid;
	height: 2.55rem;
	padding: 0;
	place-items: center;
	position: absolute;
	right: 0;
	top: 0;
	transform: translate3d(35%, -35%, 0);
	transition:
		background-color 0.25s ease,
		border-color 0.25s ease,
		transform 0.25s ease;
	width: 2.55rem;
	z-index: 2;
}

.soundtrack-prompt__timer:hover,
.soundtrack-prompt__timer:focus-visible {
	background: var(--accent-green-soft);
	border-color: var(--soundtrack-prompt-button-accent-border);
	transform: translate3d(35%, -35%, 0) scale(1.04);
}

.soundtrack-prompt__timer-svg {
	height: 100%;
	inset: 0;
	position: absolute;
	transform: rotate(-90deg);
	width: 100%;
}

.soundtrack-prompt__timer-track,
.soundtrack-prompt__timer-ring {
	fill: none;
}

.soundtrack-prompt__timer-track {
	opacity: 0.34;
	stroke: var(--glass-border-strong);
	stroke-width: 2;
}

.soundtrack-prompt__timer-ring {
	filter: drop-shadow(0 0 0.38rem var(--accent-glow));
	stroke: var(--accent-green-mid);
	stroke-dasharray: 100.53;
	stroke-dashoffset: 0;
	stroke-linecap: round;
	stroke-width: 2.4;
}

.soundtrack-prompt.is-visible .soundtrack-prompt__timer-ring {
	animation: soundtrack-prompt-timer var(--prompt-dismiss-duration) linear forwards;
}

.soundtrack-prompt__timer-close {
	font-family: 'Times New Roman', serif;
	font-size: 1.2rem;
	line-height: 1;
	position: relative;
	transform: translateY(-0.03rem);
}

@media (prefers-reduced-motion: reduce) {
	html.experience-ready {
		scroll-snap-type: none;
	}

	body::before,
	.ambient-overlay::before,
	.ambient-overlay::after,
	.ambient-overlay__palette,
	.ambient-overlay__palette::before,
	.ambient-overlay__palette::after,
	.ambient-overlay__afterglow,
	.ambient-overlay__afterglow::before,
	.theme-transition-layer,
	.theme-transition-layer__sky,
	.theme-transition-layer__phase,
	.theme-transition-layer__glow,
	.theme-transition-layer__stars,
	.theme-transition-layer__pulse,
	.experience-section::after,
	[data-reveal],
	.phrase,
	.essence-copy.is-format-primed strong > .essence-format-overlay,
	.essence-copy.is-underline-primed u:not([data-format-clone="1"])::after,
	.outro-copy,
	.outro-quote-stage,
	.outro-quote-stage__body,
	.journey-highlight,
	.journey-highlight::before,
	.journey-highlight::after,
	.journey-highlight__button,
	.journey-highlight__surface,
	.journey-highlight__surface::before,
	.journey-highlight__surface::after,
	.journey-highlight__foil,
	.journey-highlight__grain,
	.journey-highlight__inner,
	.journey-highlight__action-icon,
	.theme-toggle,
	.theme-toggle__icon,
	.theme-toggle__sun,
		.theme-toggle__moon,
		.theme-toggle__stars,
		.scroll-cue,
	.section-progress__trigger,
	.section-progress__trigger-label,
	.section-progress__trigger-stage,
	.section-progress__panel,
	.soundtrack-shell,
		.soundtrack-vinyl,
		.soundtrack-vinyl__label,
		.soundtrack-vinyl__label-content,
		.soundtrack-vinyl__label-artist,
		.soundtrack-vinyl__label-title,
		.soundtrack-vinyl-wrap,
		.soundtrack-ring,
		.soundtrack-ring__text-wrap,
	.soundtrack-btn,
	.soundtrack-drawer,
	.soundtrack-prompt {
		animation: none !important;
		transition: none !important;
	}

	.essence-copy.is-format-primed strong > .essence-format-base {
		display: none;
	}

	.essence-copy.is-format-primed strong > .essence-format-overlay {
		clip-path: inset(0 0 0 0);
	}

	.essence-copy.is-format-primed strong > .essence-format-overlay u {
		text-decoration: underline;
	}

	.essence-copy.is-underline-primed u[data-underline-target="1"],
	.essence-copy.is-underline-primed u:not([data-underline-skip="1"]):not([data-format-clone="1"]) {
		text-decoration: underline;
	}

	.essence-copy.is-underline-primed u[data-underline-target="1"]::after,
	.essence-copy.is-underline-primed u:not([data-underline-skip="1"]):not([data-format-clone="1"])::after {
		content: none;
	}
}

@media (max-width: 980px) {
	.experience-section {
		padding: clamp(3.75rem, 9vw, 5rem) clamp(1.6rem, 5vw, 2.75rem);
	}

	.soundtrack-prompt {
		left: 50%;
		max-width: min(16.5rem, calc(100vw - 2.75rem));
		min-width: 0;
		top: auto;
		bottom: calc(100% + 0.95rem);
		transform: translate3d(-50%, 0.7rem, 0) scale(calc(0.88 * var(--prompt-scale)));
		transform-origin: center bottom;
		width: min(16.5rem, calc(100vw - 2.75rem));
	}

	.soundtrack-prompt::after {
		bottom: -0.42rem;
		left: 50%;
		top: auto;
		transform: translateX(-50%) rotate(45deg);
	}

	.soundtrack-prompt.is-visible {
		transform: translate3d(-50%, 0, 0) scale(var(--prompt-scale));
	}

	.experience-section--essence .section-shell {
		align-content: start;
		grid-template-columns: 1fr;
		max-width: min(44rem, 100%);
		min-height: auto;
	}

	.experience-section--essence .section-heading {
		align-content: start;
		padding-top: 0;
	}

	.outro-panel {
		max-width: none;
	}

	.outro-return-layer {
		width: min(100%, 40rem);
	}

	.outro-quote-stage__quote {
		max-width: 24ch;
	}

	.section-shell {
		filter: none;
		opacity: 1;
		transform: none;
	}
}

@media (min-width: 737px) and (max-height: 1060px) {
	.experience-section--hero {
		padding-top: clamp(2.2rem, 4.5vh, 3.05rem);
		padding-bottom: clamp(2.2rem, 4.5vh, 3.05rem);
	}

	.section-shell--hero {
		--hero-cue-reserve: 4.6rem;
	}

	.hero-panel {
		gap: clamp(1rem, 1.6vh, 1.55rem);
		max-width: 59rem;
	}

	.hero-panel #image01 > .frame {
		width: clamp(6.3rem, 8.4vh, 7.25rem);
	}

	.hero-panel #text03 {
		font-size: clamp(2.45rem, min(3.15vw, 5.3vh), 3.15rem);
		line-height: 1.03;
	}

	.hero-panel #text02 {
		font-size: clamp(1.76rem, min(2.2vw, 4vh), 2.14rem) !important;
		line-height: 1.05 !important;
		max-width: 55.5rem;
		text-wrap: balance;
	}

	.hero-panel #text02 .hero-line {
		margin-top: 0.34rem;
	}

	.hero-panel #text02 .hero-line--group {
		margin-top: 0.68rem;
	}

	.hero-panel #text02 .hero-line--paragraph {
		margin-top: 1rem;
	}

	.scroll-cue {
		bottom: 0.72rem;
	}
}

@media (min-width: 737px) and (max-height: 760px) {
	.hero-panel {
		gap: 1rem;
	}

	.hero-panel #text03 {
		font-size: clamp(2.35rem, min(3vw, 5.2vh), 3rem);
	}

	.hero-panel #text02 {
		font-size: clamp(1.68rem, min(2.15vw, 4.2vh), 2.05rem) !important;
		line-height: 1.06 !important;
		max-width: 52rem;
	}

	.hero-panel #text02 .hero-line--group {
		margin-top: 0.62rem;
	}

	.hero-panel #text02 .hero-line--paragraph {
		margin-top: 0.95rem;
	}
}

@media (min-width: 737px) and (max-height: 820px) {
	.section-heading {
		gap: 0.7rem;
	}

	.section-note {
		font-size: 0.92rem;
		line-height: 1.45;
		max-width: 52rem;
	}

	.experience-section--essence {
		padding-top: clamp(2.2rem, 4.8vh, 2.9rem);
		padding-bottom: clamp(2.2rem, 4.8vh, 2.9rem);
	}

	.experience-section--journey,
	.experience-section--projects,
	.experience-section--outro {
		padding: clamp(2rem, 4.5vh, 3rem) clamp(1.75rem, 4vw, 3rem);
	}

	.experience-section--essence .section-shell {
		--essence-copy-size: clamp(18px, min(0.65vw + 12.5px, 0.8vh + 13px), 21.5px);
		--essence-copy-leading: 1.16;
		gap: 0.85rem;
		max-width: min(78rem, calc(100vw - 4rem));
		min-height: auto;
	}

	.essence-copy {
		max-width: min(68rem, 100%);
	}

	.experience-section--journey .section-shell,
	.experience-section--projects .section-shell,
	.section-shell--outro {
		gap: 0.9rem;
	}

	.experience-section--journey .section-shell {
		gap: 1.35rem;
		max-width: min(110rem, calc(100vw - 1.4rem));
	}

	.journey-grid,
	.project-grid,
	.journey-highlights__grid {
		gap: 0.8rem;
	}

	.experience-section--journey .journey-grid,
	.experience-section--journey .journey-highlights__grid {
		gap: 1.32rem;
	}

	.journey-card,
	.project-card {
		border-radius: 1.35rem;
		gap: 0.55rem;
		padding: 1rem 1.05rem;
	}

	.experience-section--journey .journey-card {
		gap: 1rem;
		padding: 1.65rem 1.72rem;
	}

	.journey-card__range,
	.project-card__eyebrow,
	.soundtrack-meta__label,
	.journey-highlights__eyebrow,
	.journey-highlight__range {
		font-size: 0.64rem;
		letter-spacing: 0.12em;
	}

	.journey-card__location {
		font-size: 0.66rem;
	}

	.experience-section--journey .journey-card__range,
	.experience-section--journey .journey-card__location,
	.experience-section--journey .journey-history__eyebrow,
	.experience-section--journey .journey-highlights__eyebrow,
	.experience-section--journey .journey-highlight__range {
		font-size: 0.82rem;
	}

	.journey-card__title,
	.project-card__title {
		font-size: clamp(1.28rem, 1.05vw, 1.58rem);
		line-height: 1.08;
	}

	.experience-section--journey .journey-card__title {
		font-size: clamp(1.95rem, 1.62vw, 2.32rem);
	}

	.journey-card__company,
	.project-card__copy,
	.journey-card__list,
	.journey-highlights__note,
	.journey-highlight__copy {
		font-size: 0.89rem;
		line-height: 1.42;
	}

	.experience-section--journey .journey-card__company,
	.experience-section--journey .journey-card__list,
	.experience-section--journey .journey-highlight__copy {
		font-size: 1.08rem;
		line-height: 1.32;
	}

	.journey-card__list {
		gap: 0.45rem;
	}

	.experience-section--journey .journey-card__list {
		gap: 0.86rem;
	}

	.journey-card__list li {
		line-height: 1.4;
		padding-left: 0.85rem;
	}

	.journey-card__list li::before {
		height: 0.28rem;
		top: 0.52rem;
		width: 0.28rem;
	}

	.journey-highlights {
		gap: 0.7rem;
	}

	.journey-highlights__header {
		gap: 0.28rem;
	}

	.journey-highlight {
		--journey-card-radius: 1.1rem;
		--journey-card-min-height: clamp(14rem, 18.6vw, 15rem);
		--journey-card-min-height-expanded: var(--journey-card-min-height);
		gap: 0.4rem;
		padding: 0;
	}

	.experience-section--journey .journey-highlight {
		--journey-card-min-height: clamp(18.15rem, 22.8vw, 19.65rem);
	}

	.experience-section--journey .journey-highlight__surface {
		padding: 1.22rem 1.32rem;
	}

	.journey-highlight__title {
		font-size: 0.98rem;
		line-height: 1.12;
	}

	.experience-section--journey .journey-highlight__title {
		font-size: 1.26rem;
		line-height: 1.06;
	}

	.journey-highlight__action-label {
		font-size: 0.6rem;
	}

	.project-card__link {
		font-size: 0.88rem;
	}

	.outro-panel {
		margin-top: 0.85rem;
		max-width: 34rem;
	}

	.outro-quote-stage__quote {
		font-size: clamp(1.22rem, 1.1vw + 0.96rem, 1.65rem);
	}

	.outro-copy {
		font-size: clamp(1.4rem, 1.7vw, 1.9rem) !important;
		line-height: 1.26 !important;
	}
}

@media (min-width: 981px) and (min-height: 821px) {
	.experience-section--journey {
		padding-top: clamp(2.85rem, 3.3vh, 4.05rem);
		padding-bottom: clamp(2.65rem, 3.05vh, 3.75rem);
	}

	.experience-section--journey .section-shell {
		gap: clamp(1.35rem, 0.92rem + 0.7vh, 1.9rem);
		max-width: min(110rem, calc(100vw - 1.4rem));
	}

	.experience-section--journey .section-heading {
		display: contents;
	}

	.experience-section--journey .section-note {
		display: none;
	}

	.experience-section--journey .journey-history {
		gap: clamp(0.72rem, 0.48rem + 0.55vh, 1.05rem);
	}

	.experience-section--journey .journey-grid,
	.experience-section--journey .journey-highlights__grid {
		gap: clamp(1.32rem, 0.94rem + 0.45vh, 1.55rem);
	}

	.experience-section--journey .journey-card {
		gap: clamp(1rem, 0.74rem + 0.32vh, 1.16rem);
		padding: clamp(1.65rem, 1.28rem + 0.48vw, 1.86rem);
	}

	.experience-section--journey .journey-card__meta {
		gap: 0.3rem 0.65rem;
	}

	.experience-section--journey .journey-card__range,
	.experience-section--journey .journey-card__location,
	.experience-section--journey .journey-history__eyebrow,
	.experience-section--journey .journey-highlights__eyebrow,
	.experience-section--journey .journey-highlight__range {
		font-size: 0.82rem;
		letter-spacing: 0.12em;
	}

	.experience-section--journey .journey-card__title {
		font-size: clamp(1.95rem, 1.34rem + 0.9vw, 2.36rem);
		line-height: 1.08;
	}

	.experience-section--journey .journey-card__company,
	.experience-section--journey .journey-card__list,
	.experience-section--journey .journey-highlight__copy {
		font-size: clamp(1.2rem, 1.02rem + 0.22vw, 1.3rem);
		line-height: 1.52;
	}

	.experience-section--journey .journey-card__company {
		line-height: 1.32;
	}

	.experience-section--journey .journey-card__list {
		gap: clamp(0.86rem, 0.6rem + 0.34vh, 1rem);
	}

	.experience-section--journey .journey-card__list li {
		line-height: 1.42;
		padding-left: 0.78rem;
	}

	.experience-section--journey .journey-card__list li::before {
		height: 0.24rem;
		top: 0.5rem;
		width: 0.24rem;
	}

	.experience-section--journey .journey-highlights {
		gap: clamp(0.62rem, 0.44rem + 0.4vh, 0.9rem);
		margin-top: clamp(0.5rem, 0.72vh, 0.9rem);
	}

	.experience-section--journey .journey-history__header,
	.experience-section--journey .journey-highlights__header {
		gap: 0.12rem;
	}

	.experience-section--journey .journey-highlight {
		--journey-card-min-height: clamp(18.15rem, 20.8vw, 19.95rem);
		--journey-card-min-height-expanded: var(--journey-card-min-height);
	}

	.experience-section--journey .journey-highlight__surface {
		padding: clamp(1.42rem, 1.08rem + 0.36vw, 1.58rem);
	}

	.experience-section--journey .journey-highlight__inner {
		gap: clamp(0.52rem, 0.42rem + 0.18vh, 0.64rem);
	}

	.experience-section--journey .journey-highlight__title {
		font-size: 1.32rem;
		line-height: 1.06;
	}

	.experience-section--journey .journey-highlight__copy {
		font-size: 1.02rem;
		line-height: 1.3;
	}

	.experience-section--journey .journey-highlight__action {
		gap: 0.24rem;
		padding-top: 0.06rem;
	}

	.experience-section--journey .journey-highlight__action-label {
		font-size: 0.56rem;
	}
}

@media (min-width: 1200px) and (max-height: 1100px) {
	.experience-section--journey {
		padding-top: clamp(2.2rem, 2.45vh, 2.85rem);
		padding-bottom: clamp(2rem, 2.25vh, 2.55rem);
	}

	.experience-section--journey .section-shell {
		gap: clamp(1rem, 0.74rem + 0.3vh, 1.28rem);
	}

	.experience-section--journey .journey-history {
		gap: clamp(0.56rem, 0.34rem + 0.3vh, 0.82rem);
	}

	.experience-section--journey .journey-grid,
	.experience-section--journey .journey-highlights__grid {
		gap: clamp(1rem, 0.74rem + 0.3vh, 1.18rem);
	}

	.experience-section--journey .journey-card {
		gap: clamp(0.8rem, 0.62rem + 0.16vh, 0.95rem);
		padding: clamp(1.3rem, 1.08rem + 0.22vw, 1.5rem);
	}

	.experience-section--journey .journey-card__meta {
		gap: 0.24rem 0.6rem;
	}

	.experience-section--journey .journey-card__range,
	.experience-section--journey .journey-card__location,
	.experience-section--journey .journey-history__eyebrow,
	.experience-section--journey .journey-highlights__eyebrow,
	.experience-section--journey .journey-highlight__range {
		font-size: 0.74rem;
		letter-spacing: 0.11em;
	}

	.experience-section--journey .journey-card__title {
		font-size: clamp(1.68rem, 1.22rem + 0.52vw, 1.96rem);
		line-height: 1.04;
	}

	.experience-section--journey .journey-card__company,
	.experience-section--journey .journey-card__list,
	.experience-section--journey .journey-highlight__copy {
		font-size: clamp(0.98rem, 0.92rem + 0.12vw, 1.04rem);
		line-height: 1.38;
	}

	.experience-section--journey .journey-card__company {
		line-height: 1.26;
	}

	.experience-section--journey .journey-card__list {
		gap: clamp(0.58rem, 0.44rem + 0.16vh, 0.72rem);
	}

	.experience-section--journey .journey-card__list li {
		line-height: 1.34;
		padding-left: 0.74rem;
	}

	.experience-section--journey .journey-card__list li::before {
		height: 0.22rem;
		top: 0.5rem;
		width: 0.22rem;
	}

	.experience-section--journey .journey-highlights {
		gap: clamp(0.45rem, 0.28rem + 0.2vh, 0.64rem);
		margin-top: clamp(0.22rem, 0.28rem + 0.18vh, 0.46rem);
	}

	.experience-section--journey .journey-history__header,
	.experience-section--journey .journey-highlights__header {
		gap: 0.08rem;
	}

	.experience-section--journey .journey-highlight {
		--journey-card-min-height: clamp(15.4rem, 16vw, 17rem);
		--journey-card-min-height-expanded: var(--journey-card-min-height);
	}

	.experience-section--journey .journey-highlight__surface {
		padding: clamp(1.02rem, 0.9rem + 0.14vw, 1.16rem);
	}

	.experience-section--journey .journey-highlight__inner {
		gap: clamp(0.4rem, 0.32rem + 0.14vh, 0.5rem);
	}

	.experience-section--journey .journey-highlight__title {
		font-size: clamp(1.08rem, 0.96rem + 0.2vw, 1.18rem);
		line-height: 1.06;
	}

	.experience-section--journey .journey-highlight__copy {
		font-size: clamp(0.88rem, 0.82rem + 0.08vw, 0.92rem);
		line-height: 1.24;
	}

	.experience-section--journey .journey-highlight__action {
		gap: 0.2rem;
		padding-top: 0;
	}

	.experience-section--journey .journey-highlight__action-label {
		font-size: 0.5rem;
	}

	.experience-section--projects {
		padding-top: clamp(2rem, 2.2vh, 2.5rem);
		padding-bottom: clamp(2rem, 2.2vh, 2.6rem);
	}

	.experience-section--projects .section-shell {
		gap: clamp(1rem, 0.84rem + 0.18vh, 1.2rem);
	}

	.experience-section--projects .project-grid {
		gap: 0.9rem;
	}

	.experience-section--projects .project-card {
		gap: 0.5rem;
		padding: 0.96rem 1rem;
	}

	.experience-section--projects .project-card__title {
		font-size: clamp(1.18rem, 1.04rem + 0.2vw, 1.3rem);
		line-height: 1.08;
	}

	.experience-section--projects .project-card__copy {
		font-size: 0.88rem;
		line-height: 1.4;
	}

	.experience-section--projects .project-card__eyebrow {
		font-size: 0.68rem;
	}

	.experience-section--projects .project-card__link {
		font-size: 0.82rem;
	}
}

@media (min-width: 768px) and (max-width: 980px) and (max-height: 900px) and (orientation: landscape) {
	.experience-section--journey {
		padding: clamp(1.55rem, 3.5vh, 2rem) clamp(1.55rem, 3.5vw, 2.3rem);
	}

	.experience-section--journey .section-shell {
		gap: 0.82rem;
		max-width: min(98rem, calc(100vw - 2.6rem));
	}

	.experience-section--journey .section-heading {
		gap: 0.38rem;
	}

	.experience-section--journey .section-note {
		font-size: 0.82rem;
		line-height: 1.32;
		max-width: 64rem;
	}

	.experience-section--journey .journey-grid,
	.experience-section--journey .journey-highlights__grid {
		gap: 0.84rem;
	}

	.experience-section--journey .journey-card {
		border-radius: 1.18rem;
		gap: 0.5rem;
		padding: 0.95rem 1rem;
	}

	.experience-section--journey .journey-card__meta {
		gap: 0.22rem 0.52rem;
	}

	.experience-section--journey .journey-card__range,
	.experience-section--journey .journey-card__location,
	.experience-section--journey .journey-highlights__eyebrow,
	.experience-section--journey .journey-highlight__range {
		font-size: 0.64rem;
		letter-spacing: 0.11em;
	}

	.experience-section--journey .journey-card__title {
		font-size: clamp(1.18rem, 1.95vw, 1.42rem);
		line-height: 1.06;
	}

	.experience-section--journey .journey-card__company,
	.experience-section--journey .journey-card__list,
	.experience-section--journey .journey-highlight__copy {
		font-size: 0.86rem;
		line-height: 1.36;
	}

	.experience-section--journey .journey-card__company {
		line-height: 1.22;
	}

	.experience-section--journey .journey-card__list {
		gap: 0.38rem;
	}

	.experience-section--journey .journey-card__list li {
		line-height: 1.3;
		padding-left: 0.72rem;
	}

	.experience-section--journey .journey-card__list li::before {
		height: 0.22rem;
		top: 0.46rem;
		width: 0.22rem;
	}

	.experience-section--journey .journey-highlights {
		gap: 0.52rem;
	}

	.experience-section--journey .journey-highlights__header {
		gap: 0.14rem;
	}

	.experience-section--journey .journey-highlight {
		--journey-card-radius: 1rem;
		--journey-card-min-height: clamp(14.2rem, 18.4vw, 15.2rem);
		--journey-card-min-height-expanded: var(--journey-card-min-height);
	}

	.experience-section--journey .journey-highlight__surface {
		padding: 0.88rem 0.94rem;
	}

	.experience-section--journey .journey-highlight__inner {
		gap: 0.34rem;
	}

	.experience-section--journey .journey-highlight__title {
		font-size: 1rem;
		line-height: 1.08;
	}

	.experience-section--journey .journey-highlight__action {
		gap: 0.22rem;
		padding-top: 0.08rem;
	}

	.experience-section--journey .journey-highlight__action-label {
		font-size: 0.54rem;
		letter-spacing: 0.1em;
	}
}

@media (max-width: 736px) {
	html.experience-ready,
	html.experience-ready body {
		scroll-snap-type: y proximity;
		scroll-padding-top: calc(0.35rem + env(safe-area-inset-top));
	}

	/* Let phone layouts read as a continuous page and clear the fixed chrome above. */
	.experience-section {
		align-items: flex-start;
		min-height: 100svh;
		padding-left: clamp(1.05rem, 4.6vw, 1.45rem);
		padding-right: clamp(1.05rem, 4.6vw, 1.45rem);
		padding-top: max(5.15rem, calc(4.45rem + env(safe-area-inset-top)));
		padding-bottom: clamp(2.35rem, 6vw, 3.25rem);
		scroll-snap-align: start;
		scroll-snap-stop: always;
	}

	.experience-section--journey,
	.experience-section--projects {
		scroll-snap-align: none;
		scroll-snap-stop: normal;
	}

	.experience-section--hero {
		align-items: center;
		min-height: 100svh;
		padding-bottom: max(3rem, calc(2.4rem + env(safe-area-inset-bottom)));
		padding-top: max(4.85rem, calc(4.25rem + env(safe-area-inset-top)));
	}

	.experience-section--outro {
		align-items: center;
		justify-content: center;
		padding-bottom: max(3.35rem, calc(2.7rem + env(safe-area-inset-bottom)));
	}

	.experience-section::after {
		background:
			linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.04) 18%, rgba(136, 185, 154, 0.22) 50%, rgba(255, 255, 255, 0.04) 82%, transparent 100%),
			radial-gradient(circle at center, rgba(136, 185, 154, 0.18) 0%, rgba(136, 185, 154, 0.06) 40%, transparent 72%);
		background-position: 0% 50%, center;
		background-size: 240% 100%, 100% 100%;
		content: '';
		height: 1.35rem;
		left: clamp(1rem, 4vw, 1.5rem);
		opacity: 0;
		pointer-events: none;
		position: absolute;
		right: clamp(1rem, 4vw, 1.5rem);
		top: 0.15rem;
		transform: translateY(-0.45rem) scaleX(0.92);
		transform-origin: center top;
		transition: opacity 0.34s ease, transform 0.42s cubic-bezier(0.22, 1, 0.36, 1);
		z-index: 1;
	}

	.experience-section:not(.experience-section--hero)::after {
		opacity: calc(0.08 + (var(--section-presence, 0) * 0.14));
	}

	.experience-section.is-current::after,
	.experience-section.is-mobile-arriving::after {
		animation: mobileSectionGlowSweep 9.4s ease-in-out infinite;
		opacity: calc(0.18 + (var(--section-presence, 0) * 0.24));
		transform: translateY(0) scaleX(1);
	}

	.experience-section.is-mobile-arriving::before {
		opacity: calc(0.16 + (var(--section-presence, 0) * 0.16));
		transform: scale(1.015);
	}

	.section-progress {
		/* iOS Safari can ghost the decorative ring layers while this fixed panel expands. */
		left: auto;
		overflow: hidden;
		right: max(0.85rem, calc(0.85rem + env(safe-area-inset-right)));
		top: calc(0.85rem + env(safe-area-inset-top));
		transform: none;
		transform-origin: top right;
		transition:
			width 0.42s cubic-bezier(0.22, 1, 0.36, 1),
			max-height 0.34s cubic-bezier(0.22, 1, 0.36, 1),
			border-color 0.32s ease,
			box-shadow 0.38s ease,
			background-color 0.32s ease,
			opacity 0.3s ease,
			filter 0.38s ease,
			transform 0.32s cubic-bezier(0.22, 1, 0.36, 1);
		width: min(14rem, calc(100vw - 1.7rem));
	}

	.section-progress::before,
	.section-progress::after {
		display: none;
	}

	.section-progress.is-edge:not(:hover):not(.is-pinned):not(.is-announcing) {
		width: 3.34rem;
	}

	.section-progress.is-edge:not(:hover):not(.is-pinned):not(.is-announcing) .section-progress__trigger-label {
		transition-delay: 0s;
		transition-duration: 0s;
		max-width: 0;
		opacity: 0;
		overflow: hidden;
		transform: translateX(-0.24rem);
		visibility: hidden;
	}

	.section-progress.is-ending-hidden:not(:hover):not(.is-pinned):not(.is-announcing) {
		transform: translateY(-0.72rem) scale(0.9);
	}

	.section-progress:not(.is-pinned) {
		background: linear-gradient(180deg, var(--progress-trigger-bg), var(--progress-card-bg));
		border-radius: 999px;
		max-height: 3.34rem;
	}

	.section-progress:not(.is-pinned)::after {
		opacity: 0;
		transform: scale(1);
	}

	.section-progress:not(.is-pinned) .section-progress__panel {
		filter: blur(6px);
		opacity: 0;
		pointer-events: none;
		transform: translateY(-0.45rem) scale(0.985);
	}

	.section-progress:hover,
	.section-progress:focus-within,
	.section-progress.is-pinned,
	.section-progress.is-announcing {
		transform: translateY(0.02rem);
	}

	.section-progress.is-section-shifting {
		border-color: color-mix(in srgb, var(--progress-item-active-border) 82%, rgba(255, 255, 255, 0.16));
		box-shadow: var(--progress-hover-shadow), 0 0 0 0.08rem var(--accent-green-soft);
	}

	.section-progress.is-section-shifting .section-progress__trigger-label {
		animation: mobileSectionPillPulse 620ms cubic-bezier(0.22, 1, 0.36, 1);
	}

	.theme-toggle-shell {
		left: max(0.72rem, calc(0.72rem + env(safe-area-inset-left)));
		top: calc(0.72rem + env(safe-area-inset-top));
	}

	.theme-toggle {
		height: 2.72rem;
		width: 2.72rem;
	}

	.theme-toggle__icon {
		height: 1.24rem;
		width: 1.24rem;
	}

	.site-main > .inner.cinematic-inner {
		width: 100%;
	}

	.experience-section::before {
		inset: 0;
	}

	.hero-panel {
		gap: 1rem;
		max-width: min(34rem, 100%);
	}

	.section-shell--hero {
		--hero-cue-reserve: 4.35rem;
		min-height: auto;
		width: min(34rem, 100%);
	}

	.section-shell--outro {
		align-content: center;
		justify-items: center;
		min-height: calc(100svh - max(9.5rem, calc(8.25rem + env(safe-area-inset-top) + env(safe-area-inset-bottom))));
		width: min(34rem, 100%);
	}

	.hero-panel #image01 > .frame {
		width: clamp(5.1rem, 22vw, 6.2rem);
	}

	.hero-panel #text02 {
		font-size: clamp(20px, 5.8vw, 27px) !important;
		line-height: 1.08 !important;
		max-width: 100%;
		text-wrap: balance;
	}

	.hero-panel #text03 {
		font-size: clamp(29px, 8vw, 36px);
		line-height: 1.02;
	}

	.hero-panel #text02 .hero-line {
		margin-top: 0.4rem;
	}

	.hero-panel #text02 .hero-line--group {
		margin-top: 0.74rem;
	}

	.hero-panel #text02 .hero-line--paragraph {
		margin-left: auto;
		margin-right: auto;
		margin-top: 0.86rem;
		max-width: 20.5ch;
	}

	.section-heading {
		gap: 0.6rem;
	}

	.experience-section--essence .section-shell {
		--essence-copy-size: clamp(16.5px, 3.9vw, 19.5px);
		--essence-copy-leading: 1.12;
		align-content: center;
		gap: 0.72rem;
	}

	.essence-copy span.p:nth-child(n + 2) {
		margin-top: 0.32rem !important;
	}

	.essence-copy span.p:nth-child(n + 5) {
		margin-top: 0.5rem !important;
	}

	.section-note,
	.journey-card__company,
	.project-card__copy,
	.soundtrack-meta__track,
	.journey-card__list,
	.journey-highlights__note,
	.journey-highlight__copy {
		font-size: 14px;
		line-height: 1.58;
	}

	.journey-card__title,
	.project-card__title {
		font-size: clamp(20px, 5.4vw, 25px);
	}

	.journey-card__range,
	.project-card__eyebrow,
	.soundtrack-meta__label,
	.journey-highlights__eyebrow,
	.journey-highlight__range {
		font-size: 11px;
	}

	.journey-card__location {
		font-size: 11px;
	}

	.journey-highlight__title {
		font-size: clamp(16px, 4.5vw, 19px);
	}

	.journey-highlight__action-label {
		font-size: 10px;
	}

	.journey-grid,
	.project-grid,
	.journey-highlights__grid {
		gap: 0.85rem;
	}

	.journey-card,
	.project-card {
		border-radius: 1.35rem;
		gap: 0.68rem;
		padding: 1.08rem 1rem;
	}

	.journey-card__meta {
		gap: 0.35rem 0.65rem;
	}

	.journey-card__list {
		gap: 0.55rem;
	}

	.journey-card__list li {
		line-height: 1.48;
		padding-left: 0.9rem;
	}

	.journey-card__list li::before {
		height: 0.28rem;
		top: 0.58rem;
		width: 0.28rem;
	}

	.journey-highlights {
		gap: 0.8rem;
	}

	.journey-highlights__header {
		gap: 0.22rem;
	}

	.journey-highlight {
		--journey-card-min-height: clamp(12.85rem, 12.15rem + 1.8vw, 13.7rem);
		--journey-card-min-height-expanded: var(--journey-card-min-height);
		border-radius: 1.15rem;
		gap: 0.45rem;
		padding: 0;
	}

	.journey-highlight__inner {
		gap: 0.52rem;
	}

	.journey-highlight__action {
		align-items: flex-start;
		flex-wrap: wrap;
		gap: 0.4rem;
	}

	.project-card__link {
		margin-top: 0;
	}

	.section-progress__trigger-label,
	.section-progress__label {
		font-size: 14px;
	}

	.section-progress__eyebrow {
		font-size: 10px;
	}

	.scroll-cue {
		bottom: max(1rem, calc(0.78rem + env(safe-area-inset-bottom)));
		height: 2.9rem;
		width: 2.9rem;
	}

	.outro-copy {
		font-size: clamp(24px, 6.4vw, 30px) !important;
		line-height: 1.36 !important;
	}

	.outro-return-layer {
		gap: 0.85rem;
		width: min(100%, 100%);
	}

	.outro-quote-stage {
		width: 100%;
	}

	.outro-quote-stage__frame {
		gap: 0.85rem;
	}

	.outro-quote-stage__quote {
		font-size: clamp(22px, 5vw, 28px);
		max-width: 100%;
	}

	.outro-quote-stage__source {
		font-size: 14px;
	}

	.outro-quote-stage__next {
		align-self: auto;
		justify-self: end;
		min-height: 3rem;
		width: 3rem;
	}

	.soundtrack-shell {
		display: none;
	}

	.soundtrack-ring__text {
		font-size: 6px;
	}

	.experience-section--essence .phrase,
	.experience-section--essence.is-current .phrase {
		animation: none !important;
		filter: none;
		opacity: 1;
		text-shadow: none;
		transform: none;
	}
}

@keyframes mobileSectionPillPulse {
	0% {
		transform: translateY(0) scale(0.985);
	}

	45% {
		transform: translateY(-0.04rem) scale(1.02);
	}

	100% {
		transform: translateY(0) scale(1);
	}
}

@keyframes mobileSectionGlowSweep {
	0% {
		background-position: 0% 50%, center;
	}

	50% {
		background-position: 100% 50%, center;
	}

	100% {
		background-position: 0% 50%, center;
	}
}

@media (max-width: 560px) {
	.experience-section {
		padding-left: 1rem;
		padding-right: 1rem;
		padding-top: max(4.95rem, calc(4.4rem + env(safe-area-inset-top)));
	}

	.experience-section--hero {
		padding-bottom: max(2.9rem, calc(2.25rem + env(safe-area-inset-bottom)));
	}

	.experience-section--outro {
		padding-bottom: max(3.1rem, calc(2.45rem + env(safe-area-inset-bottom)));
	}

	.section-progress {
		right: max(0.65rem, calc(0.65rem + env(safe-area-inset-right)));
		width: min(12.25rem, calc(100vw - 1.25rem));
	}

	.section-progress__trigger {
		height: 2.78rem;
		padding: 0 0.85rem;
	}

	.section-progress__panel {
		padding: 0.14rem 0.18rem 0.24rem;
	}

	.hero-panel {
		gap: 0.88rem;
	}

	.section-shell--outro {
		min-height: calc(100svh - max(8.8rem, calc(7.65rem + env(safe-area-inset-top) + env(safe-area-inset-bottom))));
	}

	.hero-panel #image01 > .frame {
		width: clamp(4.75rem, 23vw, 5.8rem);
	}

	.hero-panel #text03 {
		font-size: clamp(27px, 7.7vw, 33px);
	}

	.hero-panel #text02 {
		font-size: clamp(18px, 5.2vw, 23px) !important;
		line-height: 1.06 !important;
	}

	.hero-panel #text02 .hero-line--paragraph {
		max-width: 21ch;
	}

	.experience-section--essence .section-shell {
		--essence-copy-size: clamp(15.5px, 3.95vw, 18px);
	}

	.journey-card__title,
	.project-card__title {
		font-size: clamp(19px, 5.7vw, 23px);
	}

	.section-note,
	.journey-card__company,
	.project-card__copy,
	.soundtrack-meta__track,
	.journey-card__list,
	.journey-highlights__note,
	.journey-highlight__copy,
	.outro-quote-stage__source {
		font-size: 13px;
	}

	.outro-copy {
		font-size: clamp(22px, 6vw, 27px) !important;
	}
}

@media (max-width: 420px) {
	.section-progress {
		width: min(11.7rem, calc(100vw - 1rem));
	}

	.section-progress__trigger-label,
	.section-progress__label {
		font-size: 13px;
	}

	.hero-panel #text02 .hero-line--paragraph {
		max-width: 20ch;
	}

	.journey-card,
	.project-card {
		padding-left: 0.92rem;
		padding-right: 0.92rem;
	}

	.journey-highlight__surface {
		padding-left: 0.92rem;
		padding-right: 0.92rem;
	}
}