@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;600;700&family=Space+Grotesk:wght@400;500;600;700&display=swap');

:root {
  --paper:#fbf7f1; --ink:#24201e; --subtle:#756a62; --line:#dfd5cb;
  --hero:#101010; --hero-ink:#faf5ef; --accent:#cdff64; --quiet:#b5aca5;
  --night:#101010; --night-end:#101010; --night-muted:#bcb2ab;
  --readable:#416214; --node-fill:#cdff64; --plane-hero:#cdff64; --pass-glow:#b7e876;
  --trail-ink:#9f9184; --dawn-span:clamp(540px,85svh,860px);
  --mono:ui-monospace,SFMono-Regular,Consolas,monospace;
  --state-duration:240ms; --ease-soft:cubic-bezier(.4,0,.2,1);
}
* { box-sizing:border-box; }
html { scroll-behavior:auto; scroll-padding-top:0; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:'DM Sans',Arial,sans-serif; font-size:16px; -webkit-font-smoothing:antialiased; }
button,a { -webkit-tap-highlight-color:transparent; }
button { border:0; font:inherit; cursor:pointer; }
a { color:inherit; text-decoration:none; }
.icon-definitions { position:absolute; width:0; height:0; overflow:hidden; pointer-events:none; }
.social-links { display:flex; align-items:center; gap:8px; }
.social-link { display:grid; place-items:center; width:44px; height:44px; flex-shrink:0; border:1px solid transparent; border-radius:50%; color:inherit; transition:color var(--state-duration) var(--ease-soft),background-color var(--state-duration) var(--ease-soft),border-color var(--state-duration) var(--ease-soft),transform var(--state-duration) var(--ease-soft); }
.social-link svg { display:block; width:21px; height:21px; fill:currentColor; }
.social-link:hover,.social-link:focus-visible { color:var(--social-accent,var(--readable)); background:color-mix(in srgb,currentColor 8%,transparent); border-color:color-mix(in srgb,currentColor 30%,transparent); transform:translateY(-2px); }
button:focus-visible,a:focus-visible { outline:3px solid #8296ff; outline-offset:5px; }
h1,h2 { font-family:'Space Grotesk',Arial,sans-serif; font-weight:500; }
h2 { margin:0; font-size:clamp(40px,4.9vw,72px); line-height:1.08; letter-spacing:-.06em; }
h2 em { font-style:normal; color:var(--readable); }

/* Hero and journey share a continuous night sky. */
.hero { position:relative; isolation:isolate; overflow:hidden; display:flex; flex-direction:column; height:100svh; min-height:690px; padding:0 5.5%; background:var(--hero); color:var(--hero-ink); }
.nav { position:relative; z-index:3; display:flex; align-items:center; justify-content:space-between; gap:25px; padding:30px 0 22px; }
.nav-note { font:12px var(--mono); letter-spacing:.08em; color:var(--quiet); margin-right:auto; }
.nav-links { display:flex; align-items:center; gap:25px; margin-left:auto; --social-accent:var(--accent); }
.nav-journey { font-size:14px; border-bottom:1px solid var(--quiet); padding-bottom:5px; }
.hero-content { position:relative; z-index:2; flex:1; display:flex; flex-direction:column; justify-content:center; padding-top:25px; }
.greeting { display:flex; align-items:baseline; gap:18px; font-weight:500; }
.greeting>span:first-child { font-size:clamp(44px,4.5vw,68px); letter-spacing:-.04em; line-height:1; }
.greeting>span:last-child { font-size:25px; color:var(--quiet); }
.hello-dot { color:var(--accent); }
h1 { position:relative; width:max-content; max-width:100%; margin:12px 0 35px; font-size:clamp(76px,12.4vw,190px); line-height:1.02; letter-spacing:-.075em; }
.name-letters { white-space:nowrap; }
.name-letter,.name-space { position:relative; display:inline-block; white-space:pre; }
.name-baseline { display:inline-block; width:0; height:0; vertical-align:baseline; }
.name-fill { opacity:1; }
.name-fill,.name-outline { transition:opacity 320ms var(--ease-soft); }
.name-outline { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; opacity:0; }
.name-outline text { font:inherit; fill:none; stroke:#fff; stroke-width:1.4px; stroke-dasharray:4 3; stroke-linecap:round; stroke-linejoin:round; }
.name-letter.is-outlined .name-fill { opacity:0; }
.name-letter.is-outlined .name-outline { opacity:1; }
.name-star { position:absolute; top:4px; right:-.65em; color:var(--accent); font-size:.33em; letter-spacing:0; }
.hero-bottom { display:grid; grid-template-columns:1.1fr 1fr 1fr; align-items:center; gap:30px; padding:4px 0 32px; }
.hero-bottom p { font-size:20px; line-height:1.45; color:var(--quiet); margin:0; }
.circle-link { border:1px solid var(--quiet); width:128px; height:128px; border-radius:50%; display:flex; align-items:center; justify-content:center; gap:10px; justify-self:center; line-height:1.35; font-size:14px; transition:background-color var(--state-duration) var(--ease-soft),color var(--state-duration) var(--ease-soft),border-color var(--state-duration) var(--ease-soft); }
.circle-link:hover,.circle-link.is-plane-overlap { background:var(--accent); color:var(--hero); border-color:var(--accent); }
.plus { font-size:29px; font-weight:400; }
.hero-index { font:12px/1.8 var(--mono); align-self:end; justify-self:end; color:var(--quiet); padding-bottom:8px; }
.hero-foot { position:relative; z-index:3; display:grid; place-items:center; min-height:112px; padding:22px 0 26px; border-top:1px solid color-mix(in srgb,var(--quiet) 20%,transparent); color:var(--quiet); font:11px var(--mono); letter-spacing:.1em; }
.hero-motion { position:absolute; right:0; bottom:26px; background:none; color:inherit; font:inherit; padding:8px 0; text-decoration:underline; text-underline-offset:4px; }
.take-flight { display:flex; flex-direction:column; align-items:center; gap:9px; color:var(--hero-ink); font-size:11px; }
.take-flight span { font-size:22px; line-height:1; animation:scroll-cue 1.8s ease-in-out infinite; }
body[data-motion-paused="true"] .take-flight span { animation-play-state:paused; }
.orbit-field { position:absolute; z-index:0; width:750px; height:750px; top:20px; right:-165px; transform:translate(var(--mx,0px),var(--my,0px)); transition:transform 1s ease-out; pointer-events:none; }
.orbital-rings { width:100%; height:100%; overflow:visible; }
.orbit { fill:none; stroke:#fff; stroke-width:1; opacity:.32; vector-effect:non-scaling-stroke; }
.satellite { --bead-near:#fff; --bead-far:#555; fill:color-mix(in srgb,var(--bead-near) var(--bead-depth,50%),var(--bead-far)); }
.satellite--green { --bead-near:var(--accent); --bead-far:#3d4b25; }
.crosshair { position:absolute; color:var(--quiet); font:30px var(--mono); bottom:72px; left:210px; }

/* One shared plane; its short wake is clipped to Hero only. */
.flight-overlay { position:fixed; inset:0; width:100vw; height:100vh; z-index:40; pointer-events:none; overflow:visible; transition:opacity var(--state-duration) var(--ease-soft); }
#plane-wake { fill:none; stroke:var(--accent); stroke-width:1.35; stroke-linecap:round; stroke-linejoin:round; }
#plane-base { fill:var(--plane-hero); stroke:var(--plane-hero); stroke-width:1; }
#plane-base,.plane-fold { transition:fill var(--state-duration) var(--ease-soft),stroke var(--state-duration) var(--ease-soft); }
.flight-overlay[data-location="journey"] #plane-base { fill:#faf1e8; stroke:#faf1e8; }
#plane-inverse { fill:var(--night); stroke:var(--night); stroke-width:1; }
#plane-hero-inverse { fill:var(--hero); stroke:var(--hero); stroke-width:1; }
.plane-fold { fill:none; stroke:var(--hero); stroke-width:1; stroke-linecap:round; opacity:.65; }
#plane-inverse .plane-fold,#plane-hero-inverse .plane-fold { stroke:var(--accent); }
.flight-overlay[data-location="journey"] #plane-base .plane-fold { stroke:var(--night); }

/* One pinned camera, one route, and milestones brought into focus by scroll. */
.journey { position:relative; padding:0; background:var(--night); color:var(--hero-ink); --subtle:var(--night-muted); --line:#4e4640; --readable:var(--accent); }
.journey-stage { position:sticky; top:0; width:100%; height:100svh; min-height:480px; overflow:hidden; isolation:isolate; background:var(--night); }
.journey-header { position:absolute; z-index:5; top:33px; left:6%; right:6%; display:flex; justify-content:space-between; gap:30px; align-items:start; }
.journey-header h2 { font-size:clamp(26px,3.4vw,49px); margin-top:12px; }
.journey-header .eyebrow { font-size:12px; }
.journey-options { display:flex; gap:18px; font:12px var(--mono); color:var(--subtle); align-items:center; padding-top:3px; }
.journey-options button { background:none; color:inherit; font:inherit; padding:0; text-decoration:underline; text-underline-offset:5px; }
.journey-stage::before { content:''; position:absolute; z-index:4; left:0; top:0; right:0; height:200px; background:linear-gradient(#10101040,transparent); pointer-events:none; }
.trail { position:absolute; inset:0; margin:0; }
.trail-line { position:absolute; inset:0; width:100%; height:100%; overflow:visible; pointer-events:none; }
.trail-strokes { fill:none; stroke:var(--trail-ink); stroke-width:1.4; stroke-linecap:round; }
.trail-dashes { stroke-dasharray:5 9; }
.trail-solid { stroke-dasharray:none; }
.milestone { position:absolute; left:var(--x); top:var(--y); width:0; height:0; margin:0; padding:0; }
.node { position:absolute; left:0; top:0; width:var(--diameter); height:var(--diameter); transform:translate(-50%,-50%); display:grid; place-items:center; border:1px solid color-mix(in srgb,#a29183,var(--node-fill) var(--node-highlight,0%)); border-radius:50%; background:color-mix(in srgb,var(--night),var(--node-fill) var(--node-highlight,0%)); color:var(--hero-ink); opacity:var(--node-opacity); transition:color var(--state-duration) var(--ease-soft); }
.node::after { content:''; position:absolute; inset:-9px; border:1px solid var(--pass-glow); border-radius:50%; opacity:0; }
.node.is-passing::after { animation:node-flash .7s ease-out; }
.node[aria-current="step"] { color:var(--night); }
.node-number { position:absolute; left:0; top:-25px; font:10px var(--mono); color:var(--subtle); }
.milestone-copy { position:absolute; top:var(--copy-shift,0px); width:min(350px,31vw); padding:0; transform:translateY(-50%) scale(var(--copy-scale)); filter:blur(var(--copy-blur)); opacity:var(--copy-opacity); }
.is-left .milestone-copy { right:92px; left:auto; transform-origin:right center; text-align:right; }
.is-right .milestone-copy { left:92px; right:auto; transform-origin:left center; text-align:left; }
.date { font:11px/1.5 var(--mono); color:var(--readable); letter-spacing:.02em; }
.milestone h3 { font-family:'Space Grotesk',Arial,sans-serif; font-size:clamp(22px,2.6vw,37px); font-weight:500; line-height:1.12; letter-spacing:-.045em; margin:11px 0; }
.milestone p { color:var(--subtle); font-size:15px; line-height:1.55; margin:0 0 10px; }
.institution { color:var(--subtle); font:11px/1.5 var(--mono); }
.milestone p,.milestone .institution { transition:opacity var(--state-duration) var(--ease-soft); }
.journey:not(.list-mode) .milestone:not(.is-current) p,.journey:not(.list-mode) .milestone:not(.is-current) .institution { opacity:0; }
.trail-fog { position:absolute; left:0; bottom:0; right:0; height:24%; z-index:3; background:linear-gradient(transparent,var(--night-end) 82%); backdrop-filter:blur(2px); mask-image:linear-gradient(transparent,#000 76%); pointer-events:none; }
.journey-stage.arrival .journey-header { animation:arrival-settle .55s cubic-bezier(.16,1,.3,1); }
.journey.list-mode { height:auto!important; }
.list-mode .journey-stage { height:auto; position:relative; overflow:visible; padding:158px 7.5% 70px; }
.list-mode .trail { position:relative; inset:auto; }
.list-mode .trail-line,.list-mode .trail-fog,.list-mode .node { display:none; }
.list-mode .milestone { position:relative; inset:auto; width:auto; height:auto; padding:35px 0; border-bottom:1px solid var(--line); }
.journey.list-mode .milestone-copy { position:relative; left:auto; right:auto; top:auto; width:auto; max-width:620px; transform:none; text-align:left; opacity:1; filter:none; }

/* The night opens into a light workbench, with room for the transition to breathe. */
.section { padding:100px 7.5%; }
.section-kicker { font:12px var(--mono); letter-spacing:.08em; display:flex; justify-content:space-between; gap:20px; margin-bottom:52px; color:var(--subtle); }
.work { position:relative; padding-top:calc(var(--dawn-span) + 70px); background-color:var(--paper); background-image:linear-gradient(180deg,var(--night) 0%,#191818 13%,#343130 30%,#77716b 51%,#bbb2a8 72%,#e8e0d7 88%,var(--paper) 100%); background-size:100% var(--dawn-span); background-repeat:no-repeat; }
.journey-bridge { position:absolute; top:0; left:0; right:0; height:var(--dawn-span); display:grid; place-items:center; margin:0; padding:0 6%; color:#fbf7f1c2; font:400 clamp(48px,9vw,144px)/1.1 'Space Grotesk',Arial,sans-serif; letter-spacing:-.065em; white-space:nowrap; pointer-events:none; }
.work h2 { margin-bottom:48px; }
.project-grid { display:grid; grid-template-columns:1fr 1fr; gap:30px; }
.project-art { position:relative; height:365px; overflow:hidden; padding:24px; display:flex; flex-direction:column; justify-content:space-between; }
.art-label,.art-foot { font:10px/1.5 var(--mono); letter-spacing:.05em; }
.art-foot { display:flex; justify-content:space-between; gap:10px; }
.led-art { background:#202020; color:#bcbab4; }
.led-grid { display:grid; grid-template-columns:repeat(12,1fr); gap:10px; width:80%; max-width:345px; align-self:center; transform:perspective(800px) rotateX(22deg) rotateZ(-8deg); }
.led { aspect-ratio:1; border-radius:50%; background:#3b3b38; }
.led.lit { background:var(--accent); box-shadow:0 0 18px #cdff6452; }
.puzzle-art { background:#e8e6e0; color:#68655e; }
.puzzle-grid { width:195px; height:195px; display:grid; grid-template-columns:repeat(5,1fr); gap:4px; align-self:center; transform:rotate(7deg); }
.puzzle-cell { background:#faf8f3; border:1px solid #d2cfc6; }
.puzzle-cell.filled { background:#5d5b54; border-color:#5d5b54; }
.project-caption { display:flex; gap:14px; justify-content:space-between; margin-top:22px; }
.project-caption h3 { font-size:19px; font-weight:500; letter-spacing:-.04em; margin:0 0 7px; }
.project-caption p,.project-caption>span { font:12px/1.6 var(--mono); color:var(--subtle); margin:0; }
.prototype-note { font-size:13px; line-height:1.7; color:var(--subtle); margin:24px 0 0; }
.personal { padding-bottom:125px; }
#pause-motion { background:none; color:var(--subtle); font:12px var(--mono); text-decoration:underline; text-underline-offset:4px; padding:0; }
.personal-layout { display:grid; grid-template-columns:1.3fr 1fr; gap:65px; align-items:center; }
.eyebrow { font:11px var(--mono); color:var(--subtle); }
.personal h2 { margin-top:25px; font-size:clamp(38px,4.9vw,70px); }
#interest-word { color:var(--readable); display:inline-block; }
#interest-word,#interest-caption,#photo-label,#photo-count { opacity:1; transition:opacity 180ms var(--ease-soft); }
.personal.is-switching :is(#interest-word,#interest-caption,#photo-label,#photo-count) { opacity:0; }
.interest-period { color:var(--readable); }
.personal-copy>p { max-width:370px; min-height:58px; line-height:1.7; font-size:16px; color:var(--subtle); margin-top:26px; }
.interest-tabs { display:flex; flex-wrap:wrap; gap:14px; margin-top:28px; }
.interest-tabs button { font:12px var(--mono); padding:8px 0; background:none; border-bottom:1px solid transparent; color:var(--subtle); transition:color var(--state-duration) var(--ease-soft),border-color var(--state-duration) var(--ease-soft); }
.interest-tabs button[aria-pressed="true"] { border-color:var(--readable); color:var(--readable); }
.photo-composition { transform:rotate(4deg); }
.photo-frame { min-height:350px; aspect-ratio:4/5; display:flex; flex-direction:column; justify-content:space-between; gap:20px; padding:25px; border:1px solid #d4cfc6; background:#eeebe5; }
.photo-corner { font:11px var(--mono); color:#77716a; }
.photo-mark { font:64px var(--mono); color:#9d9489; text-align:center; margin-top:auto; margin-bottom:auto; }
.photo-frame>span:nth-last-child(2) { font:13px/1.5 var(--mono); color:#656057; }
.photo-pending { font-size:13px; color:var(--subtle); }
.photo-caption { display:flex; justify-content:space-between; gap:14px; margin-top:17px; font:10px var(--mono); color:var(--subtle); }
.resume-download { text-align:center; padding-top:105px; padding-bottom:100px; }
.resume-download h2 { margin:24px 0; }
.resume-download>p { color:var(--subtle); font-size:18px; line-height:1.65; margin:0 0 32px; }
.resume-button { display:inline-flex; align-items:center; justify-content:center; gap:25px; padding:20px 29px; min-height:64px; border:1px solid var(--accent); border-radius:999px; background:var(--accent); color:var(--night); font-size:17px; font-weight:500; transition:background-color var(--state-duration) var(--ease-soft),transform var(--state-duration) var(--ease-soft),box-shadow var(--state-duration) var(--ease-soft); }
.resume-button svg { width:23px; height:23px; }
.resume-button:hover,.resume-button:focus-visible { background:#dfff9b; transform:translateY(-3px); box-shadow:0 8px 30px #cdff6420; }
.resume-meta { display:block; margin-top:18px; font:11px var(--mono); color:var(--subtle); }
html[data-build="production"] body { background:var(--night); color:var(--hero-ink); --subtle:var(--night-muted); --readable:var(--accent); --line:#ffffff26; }
html[data-build="production"] .resume-download { background:var(--night); }
footer { display:flex; justify-content:space-between; align-items:center; gap:30px; margin:0 7.5%; border-top:1px solid var(--line); padding:35px 0; }
.footer-identity { display:flex; flex-direction:column; gap:8px; }
.footer-name { font-family:'Space Grotesk',Arial,sans-serif; font-size:24px; font-weight:500; letter-spacing:-.04em; }
.footer-email { font:12px/1.7 var(--mono); color:var(--subtle); transition:color var(--state-duration) var(--ease-soft); }
.footer-email:hover,.footer-email:focus-visible { color:var(--readable); }
footer p { font-size:16px; line-height:1.6; }
.footer-meta { display:flex; flex-direction:column; align-items:flex-end; gap:14px; }
.footer-meta>span { font:10px var(--mono); color:var(--subtle); }

@keyframes node-flash { 0% { opacity:1; transform:scale(.8); box-shadow:0 0 30px var(--pass-glow); } 100% { opacity:0; transform:scale(1.6); box-shadow:0 0 0 transparent; } }
@keyframes arrival-settle { 0% { transform:translateY(13px); } 60% { transform:translateY(-3px); } 100% { transform:none; } }
@keyframes scroll-cue { 0%,100% { transform:translateY(0); opacity:.65; } 50% { transform:translateY(6px); opacity:1; } }

@media (min-width:1600px) {
  .hero { min-height:810px; }
  .section { padding-left:max(7.5%,calc((100vw - 1360px)/2)); padding-right:max(7.5%,calc((100vw - 1360px)/2)); }
}
@media (max-height:750px) and (min-width:681px) {
  .journey-header { top:28px; }
  .journey-header h2 { font-size:30px; }
  .milestone h3 { font-size:26px; }
  .milestone p { font-size:14px; }
  .journey-stage::before { height:162px; }
}
@media (max-width:900px) {
  .hero { min-height:660px; }
  .hero-content { padding-top:20px; }
  .name-star { right:-.5em; }
  .hero-bottom { grid-template-columns:1fr 1fr; padding-bottom:30px; }
  .hero-index { display:none; }
  .nav-note { font-size:10px; margin-left:0; }
  .hero-foot { font-size:9px; }
  .section { padding:75px 6%; }
  .work { padding-top:calc(var(--dawn-span) + 70px); }
  .journey-options { flex-direction:column; align-items:end; gap:16px; }
  .is-left .milestone-copy { right:75px; }
  .is-right .milestone-copy { left:75px; }
  .milestone-copy { width:29vw; }
  .milestone h3 { font-size:27px; }
  .milestone p { font-size:14px; }
  .project-art { height:290px; padding:18px; }
  .led-grid { gap:7px; width:90%; }
  .art-label,.art-foot { font-size:9px; }
  .puzzle-grid { width:160px; height:160px; }
  .personal-layout { gap:35px; }
  .personal h2 { font-size:46px; }
  .photo-frame { min-height:330px; }
  .photo-caption { font-size:9px; }
}
@media (max-width:819px) {
  .hero { min-height:630px; }
  .nav { padding-top:28px; }
  .hero-content { padding-top:15px; }
  .hero-bottom { padding-bottom:26px; }
  .hero-foot { padding:22px 0 26px; }
  .journey-header { top:27px; left:117px; right:26px; flex-direction:column; gap:15px; }
  .journey-header h2 { font-size:30px; max-width:230px; line-height:1.08; }
  .journey-header .eyebrow { font-size:10px; }
  .journey-options { flex-direction:row; flex-wrap:nowrap; align-items:center; padding-top:0; font-size:10px; gap:14px; text-align:left; white-space:nowrap; }
  .journey-stage::before { height:195px; }
  .milestone-copy { width:calc(100vw - 143px); max-width:370px; }
  .is-left .milestone-copy,.is-right .milestone-copy { left:calc(117px - var(--x)); right:auto; text-align:left; transform-origin:left center; }
  .milestone h3 { font-size:25px; }
  .milestone p { font-size:14px; line-height:1.5; }
  .date,.institution,.node-number { font-size:10px; }
  .list-mode .journey-stage { padding-top:173px; }
}
@media (max-width:600px) {
  .name-outline text { stroke-width:1px; stroke-dasharray:3 2; }
  .hero { padding:0 6%; }
  .nav { padding-bottom:24px; justify-content:flex-end; }
  .nav-note { display:none; }
  .nav-links { width:100%; justify-content:space-between; gap:18px; }
  .nav-journey { font-size:13px; }
  .greeting>span:first-child { font-size:46px; }
  .greeting>span:last-child { font-size:21px; }
  h1 { font-size:clamp(46px,12vw,72px); margin-top:18px; margin-bottom:42px; }
  .name-star { top:-.48em; right:0; font-size:.36em; }
  .hero-bottom { gap:10px; }
  .hero-bottom p { font-size:16px; }
  .circle-link { width:104px; height:104px; font-size:12px; justify-self:end; }
  .hero-foot { font-size:10px; letter-spacing:.02em; }
  .orbit-field { right:-390px; top:20px; }
  .section { padding:58px 6%; }
  .work { padding-top:calc(var(--dawn-span) + 58px); }
  .section-kicker { font-size:10px; margin-bottom:32px; line-height:1.6; }
  .section-kicker>span:last-child { text-align:right; max-width:150px; }
  h2 { font-size:41px; }
  .prototype-note { font-size:12px; }
  .project-grid { grid-template-columns:1fr; gap:35px; }
  .project-art { height:310px; padding:22px; }
  .led-grid { max-width:285px; width:85%; }
  .art-label,.art-foot { font-size:10px; }
  .project-caption h3 { font-size:18px; }
  .personal-layout { grid-template-columns:1fr; gap:48px; }
  .personal h2 { font-size:54px; }
  .personal-copy>p { min-height:0; }
  .photo-composition { width:86%; justify-self:center; }
  .interest-tabs { gap:20px; }
  .interest-tabs button { min-height:44px; font-size:12px; }
  footer { flex-wrap:wrap; margin:0 6%; padding:24px 0; }
  .footer-meta { width:100%; flex-direction:row; align-items:center; justify-content:space-between; gap:18px; flex-wrap:wrap; }
  .footer-meta>span { max-width:170px; line-height:1.6; }
  #pause-motion { font-size:11px; padding:3px 0; }
}
@media (max-width:680px) and (max-height:650px) {
  .journey-header { top:24px; gap:10px; }
  .journey-header h2 { font-size:24px; margin-top:7px; }
  .journey-options { gap:12px; font-size:9px; }
  .journey-stage::before { height:159px; }
  .milestone h3 { font-size:22px; margin:8px 0; }
  .milestone p { font-size:13px; margin-bottom:7px; }
}
@media (prefers-reduced-motion:reduce) {
  *,*::before,*::after { animation:none!important; transition:none!important; }
  .milestone-copy { filter:none!important; opacity:1!important; }
  .orbit-field { transform:none; }
  .flight-overlay { display:none; }
  .trail-fog { backdrop-filter:none; }
}