:root{color-scheme:dark;--ink:#100e17;--cream:#fff0dc;--quiet:#cbc1cb;--pink:#ff8f9c;--mint:#8af2d8;--edge:#49404e;--prism:linear-gradient(95deg,#ff8c9b,#efb997 46%,#7be9d8);--wide:1380px;--head:76px}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:calc(var(--head) + 14px)}body{margin:0;background:var(--ink);color:var(--cream);font:17px/1.55 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}a{color:inherit}img{display:block;max-width:100%;height:auto}button{font:inherit;color:inherit;cursor:pointer}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}p,h1,h2,h3,figure{margin:0}.wrap{width:min(var(--wide),calc(100% - 104px));margin-inline:auto}.mono{font:600 .72rem/1.45 ui-monospace,SFMono-Regular,Menlo,monospace;letter-spacing:.135em}.skip{position:fixed;z-index:20;left:12px;top:12px;transform:translateY(-150%);background:var(--ink);padding:12px}.skip:focus{transform:none}:focus-visible{outline:2px solid var(--mint);outline-offset:4px}
.top{height:var(--head);display:flex;justify-content:space-between;align-items:center;gap:24px;padding:0 max(26px,calc((100% - var(--wide))/2));position:sticky;top:0;z-index:5;background:#100d17eb;border-bottom:1px solid #fff1;backdrop-filter:blur(14px)}.lockup{display:inline-flex;align-items:center;gap:11px;text-decoration:none;white-space:nowrap;font-size:.88rem;font-weight:900;letter-spacing:.14em}.lockup img{border-radius:10px}.top nav{display:flex;gap:clamp(12px,4vw,52px)}.top nav a,.top-tag{text-decoration:none}.top nav a{font-size:.9rem;color:var(--quiet);padding:10px 0}.top nav a:hover,.top-tag:hover{color:var(--mint)}.top-tag,.chapter{color:var(--mint);font:600 .68rem/1.4 ui-monospace,monospace;letter-spacing:.14em}.top-tag i,.monitor i,.location span{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--mint);margin-right:8px;box-shadow:0 0 12px #72ffde90}
.hero{position:relative;isolation:isolate;min-height:clamp(560px,calc(100svh - var(--head)),900px);display:grid;align-items:stretch;overflow:hidden;background:#170f19}.hero-art,.hero-art::after{position:absolute;inset:0;z-index:-1}.hero-art img{height:100%;width:100%;object-fit:cover;object-position:50% 45%}.hero-art::after{content:"";background:linear-gradient(0deg,#100b16ee,transparent 23%),linear-gradient(90deg,#0c081640,transparent 46%);z-index:0}.hero-layout{display:flex;flex-direction:column;justify-content:flex-end;padding-bottom:22px}.hero-copy{width:max-content;max-width:100%;margin-bottom:clamp(60px,12vh,120px)}.hero-copy h1,.hero-copy .tagline{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.location{position:absolute;top:27px;color:#fae5d1;background:#120d1ab3;padding:9px 13px;border:1px solid #ffccaf2b}.location b{color:var(--pink);padding-inline:5px}.action{display:inline-flex;gap:19px;align-items:center;justify-content:center;min-height:49px;padding:10px 17px;border:1px solid var(--pink);color:var(--cream);background:#17101ce0;text-decoration:none;font-size:.9rem;font-weight:730;box-shadow:0 0 19px #ff85a121;transition:background .2s,transform .2s,border-color .2s}.action:hover{transform:translateY(-2px);border-color:var(--mint);background:#25313a}.hero-end{display:flex;justify-content:space-between;color:#f5d9c9b8;border-top:1px solid #ffdfcc41;padding-top:13px}.ticker{display:flex;flex-wrap:wrap;gap:15px 27px;align-items:center;justify-content:center;background:#201724;border-block:1px solid #644659;padding:15px 22px;font:700 .69rem/1.4 ui-monospace,monospace;letter-spacing:.16em}.ticker i{height:9px;width:2px;transform:skew(-28deg);background:var(--prism)}
.tour{padding-block:clamp(65px,10vw,136px)}.section-head{display:grid;grid-template-columns:1fr .57fr;align-items:end;gap:13px 30px;margin-bottom:34px}.section-head .chapter{grid-column:1/-1}.section-head>p:last-child,.studio-intro,.pro p:not(.chapter){color:var(--quiet);max-width:38ch}.section-head h2,.studio h2,.pro h2{font-size:clamp(55px,8vw,115px);font-weight:920;line-height:.87;letter-spacing:-.075em}.tour-stage{display:grid;grid-template-columns:1fr .9fr;min-height:610px;border-top:1px solid transparent;border-image:var(--prism) 1;border-bottom:1px solid #d0abb032;background:linear-gradient(122deg,#211820,#131522 66%)}.stage-detail{padding:clamp(24px,4.5vw,62px)}.tab-row{display:flex;gap:6px;flex-wrap:wrap;border-bottom:1px solid var(--edge);margin-bottom:35px}.tab-row button{border:0;border-bottom:2px solid transparent;background:transparent;color:var(--quiet);padding:12px 8px;min-height:44px;font:650 .76rem/1.4 ui-monospace,monospace}.tab-row button[aria-selected=true]{color:var(--mint);border-color:var(--mint)}.tab-row button:hover{color:var(--cream)}.stage-detail h3{font-size:clamp(33px,4.4vw,64px);line-height:1;letter-spacing:-.055em;margin:12px 0 18px}.stage-detail p:not(.chapter):not(.mono){color:var(--quiet);max-width:43ch}.demo{padding:15px;margin-top:24px;border:1px solid #72616c82;background:#18151f}.demo .mono{color:var(--mint);display:flex;justify-content:space-between;gap:8px}.demo .mono span{color:var(--cream)}.small{margin:11px 0 5px;padding:6px 12px;min-height:42px}.demo-result{font-size:.85rem}.text-action{display:inline-flex;align-items:center;gap:8px;margin-top:24px;padding:8px 0;border:0;background:transparent;color:var(--mint);font-size:.9rem}.text-action:hover{text-decoration:underline}
.stage-image,.studio-image{display:grid;justify-items:center;align-content:center;position:relative;isolation:isolate;min-width:0;padding:30px 16px}.phone-glow{position:absolute;z-index:-1;width:95%;height:80%;background:radial-gradient(ellipse,#98639454,transparent 64%)}.stage-image img,.studio-image img,.pro img{width:clamp(170px,25vw,285px);max-height:540px;object-fit:contain;border-radius:11%/5.5%;filter:drop-shadow(0 19px 18px #050408b0)}.monitor,.studio-image figcaption{color:var(--quiet);margin-top:12px;font-size:.64rem}.monitor i{background:var(--pink)}
.studio{background:radial-gradient(ellipse at 72% 52%,#254341 0,transparent 46%),radial-gradient(ellipse at 0 20%,#482036,transparent 50%),#14101b;border-block:1px solid #695367;padding-block:clamp(50px,9vw,120px)}.studio-grid,.pro{display:grid;grid-template-columns:1fr .8fr;align-items:center;gap:30px}.studio h2,.pro h2{margin:11px 0 22px}.tool-list{display:grid;gap:7px;margin-top:30px}.tool-list button{display:grid;grid-template-columns:36px 1fr;text-align:left;align-items:center;border:1px solid #6a5b6e85;background:#181621e6;padding:12px 14px}.tool-list button[aria-pressed=true]{border-color:var(--mint);box-shadow:inset 2px 0 var(--mint)}.tool-list button .mono{color:var(--mint)}.tool-list small{display:block;color:var(--quiet);font-size:.83rem}.pro{grid-template-columns:.65fr 1fr;padding-block:clamp(65px,10vw,130px)}.pro img{justify-self:center}.pro .price{color:var(--cream)!important;font-size:1.6rem;font-weight:800;margin:17px 0}.price span{font-size:.82rem;color:var(--quiet);font-weight:500}.site-footer{padding:37px 0;background:#0a080f;border-top:1px solid #50364c}.site-footer p{color:var(--quiet);margin-top:8px}.site-footer .mono,.footer-note{font-size:.69rem}.scroll-progress{position:fixed;z-index:9;top:0;left:0;height:2px;width:100%;background:var(--prism);transform:scaleX(0);transform-origin:left;pointer-events:none}
.swap{animation:enter .23s ease-out}@keyframes enter{from{opacity:.66;transform:translateY(5px)}to{opacity:1;transform:none}}
[hidden]{display:none!important}
@media(max-width:960px){.wrap{width:calc(100% - 60px)}.hero{min-height:clamp(490px,75svh,680px)}.hero-art img{object-fit:cover;object-position:37% center}.hero-copy{margin-bottom:75px}.tour-stage{min-height:520px}.stage-detail{padding:25px}.stage-image img,.studio-image img,.pro img{width:clamp(165px,29vw,255px)}}
@media(max-width:650px){:root{--head:60px}.wrap{width:calc(100% - 34px)}.top{padding:0 14px;gap:9px}.lockup{font-size:.68rem;gap:6px;letter-spacing:.08em}.lockup img{width:29px;height:29px;border-radius:7px}.top nav{gap:12px}.top nav a{font-size:.75rem;white-space:nowrap}.top-tag{display:none}.hero{min-height:clamp(620px,calc(100svh - var(--head)),760px)}.hero-art img{object-position:82% 42%}.hero-art::after{background:linear-gradient(0deg,#120d1c 1%,#130d1de8 18%,#160e1c2b 56%,transparent 73%)}.hero-copy{width:100%;margin-bottom:22px}.hero-copy h1,.hero-copy .tagline{position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal}.hero-copy h1{text-transform:uppercase;font-size:clamp(54px,13vw,90px);line-height:.83;letter-spacing:-.075em;font-style:italic;font-weight:950;color:#ffdfbd;text-shadow:0 0 14px #ff815d90}.hero-copy h1 span{padding-left:12px}.tagline{font-size:1rem;font-weight:750;margin:14px 0}.hero-end{font-size:.56rem;gap:8px}.location{top:15px}.ticker{gap:8px 12px;font-size:.55rem}.section-head,.tour-stage,.studio-grid,.pro{grid-template-columns:1fr}.section-head{gap:13px}.stage-detail{padding:20px 15px 4px}.tab-row{margin-bottom:22px}.tab-row button{padding-inline:6px}.stage-image,.studio-image{padding:20px 10px}.stage-image img,.studio-image img,.pro img{width:clamp(175px,55vw,246px)}.pro img{grid-row:2}.price span{display:block}.site-footer{padding:27px 0}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.swap{animation:none}.action{transition:none}}

@media (min-width:651px) {
  .hero { min-height:0; aspect-ratio:1672 / 941; }
  .hero-art img { object-position:center; }
  .hero-copy { margin-bottom:clamp(24px,6.5vw,112px); }
}

/* City edition */
.city-edition .top { gap:16px }
.route-nav a { display:flex;align-items:center;gap:6px;border-bottom:1px solid transparent }
.route-nav b { color:#eaaeb6;font:700 .69rem ui-monospace,monospace }
.route-nav a[aria-current] { color:var(--cream);border-color:var(--mint) }
.route-nav a[aria-current] b { color:var(--mint) }
.city-edition .hero { aspect-ratio:auto; min-height:clamp(560px,calc(93svh - var(--head)),860px) }
.city-edition .hero-art img { object-position:58% center }
.city-edition .hero-art::after { background:linear-gradient(0deg,#100d17ee,transparent 30%),linear-gradient(90deg,#0c0b16ee,#0c0b1666 44%,transparent 72%) }
.city-edition .hero-layout { justify-content:center;padding-block:90px }
.city-edition .hero-copy { margin:0 }
.city-edition .hero-copy h1,.city-edition .hero-copy .tagline { position:static;width:auto;height:auto;overflow:visible;clip-path:none;white-space:normal }
.city-edition .hero-copy h1 { text-transform:uppercase;font-size:clamp(65px,11vw,175px);line-height:.76;letter-spacing:-.075em;font-style:italic;font-weight:950;color:#ffe7cc;text-shadow:0 0 24px #ff8c6f55;margin:22px 0 }
.city-edition .hero-copy h1 span { padding-left:.23em }
.city-edition .tagline { font-size:clamp(1rem,2vw,1.42rem);font-weight:730;margin:20px 0 }
.hero-icon { width:clamp(40px,5.7vw,75px);border-radius:23%;box-shadow:0 7px 30px #070712be }
.city-edition .hero-end { position:absolute;bottom:23px;width:inherit }
.district { position:relative;isolation:isolate;overflow:hidden;background:#121520;padding-block:clamp(34px,5vw,76px) clamp(54px,7vw,104px);border:0 }
.district-art,.district::after { position:absolute;inset:0;width:100%;height:100%;z-index:-2;object-fit:cover;pointer-events:none }
.district::after { content:"";z-index:-1;background:linear-gradient(0deg,#0c121c 0%,#0c121c86 40%,#0c121c42 100%),linear-gradient(90deg,#0913219e,transparent 85%) }
.mile { border-top:7px double #7ce0c4;--mint:#a6f6df }
.signal { --mint:#ffc2e7; border-top:1px solid #fc88cf }
.signal::after { background:linear-gradient(90deg,#100c19ef,#100c197b 60%,#100c192b),linear-gradient(0deg,#120b19e8,transparent 62%) }
.heights { --mint:#ffd4a9; border-top:2px solid #ffbb8d }
.heights::after { background:linear-gradient(0deg,#170f17ec,transparent 70%),linear-gradient(90deg,#170f171c,#170f17a6 51%,#170f17df) }
.arrival { margin-bottom:clamp(28px,5vw,68px);display:flex;align-items:center;gap:15px;color:var(--mint);font:700 .7rem/1.2 ui-monospace,monospace;letter-spacing:.13em }
.arrival b { display:block;font-size:clamp(.9rem,2vw,1.4rem);color:var(--cream) }
.arrival small { display:block;margin-top:5px;color:var(--mint) }
.road { width:fit-content;padding:10px 15px;background:#0d352fe8;border:2px solid #a6f6df;box-shadow:0 0 0 3px #0d352fe8 }
.route-shield { display:grid;place-items:center;width:38px;height:38px;border:1px solid var(--mint);border-radius:4px 4px 14px 14px;font-size:.9rem }
.splice { padding:14px 18px;justify-content:space-between;background:#241326e8;border-block:1px solid #fc88cf;position:relative }
.splice::before,.splice::after { content:"";width:7px;height:calc(100% + 12px);position:absolute;top:-6px;background:#fc88cf;transform:skew(-25deg) }
.splice::before { left:29% }.splice::after { right:28%;width:2px }
.skyline { display:grid;gap:7px;width:max-content;max-width:100%;padding:13px 50px 13px 15px;border-left:3px solid #ffbb8d;background:linear-gradient(90deg,#2b1619ee,transparent) }
.skyline b { letter-spacing:.19em }
.city-edition .section-head>p:last-child,.city-edition .studio-intro,.city-edition .pro p:not(.chapter) { color:#fff1e0 }
.city-edition .tour-stage { background:linear-gradient(122deg,#111d27f7,#151826d9 70%);border:1px solid #9ee7da65 }
.city-edition .pro { padding-block:0 }
.city-edition .studio-image img,.city-edition .pro img { filter:drop-shadow(0 16px 18px #050408b0) drop-shadow(0 0 38px #fa73b53a) }
@media (max-width:650px) {
 .city-edition .top { gap:6px }
 .city-edition .top .lockup span { display:none }
 .city-edition .top nav { gap:clamp(6px,2vw,14px) }
 .city-edition .top nav a { font-size:clamp(.63rem,2.75vw,.76rem);gap:4px }
 .route-nav b { font-size:.58rem }
 .city-edition .hero { min-height:clamp(565px,90svh,720px) }
 .city-edition .hero-layout { justify-content:end }
 .city-edition .hero-art::after { background:linear-gradient(0deg,#0d0a15fa, #0d0a1580 53%,transparent 82%) }
 .city-edition .hero-art img { object-position:65% center }
 .city-edition .hero-copy h1 { font-size:clamp(58px,17vw,106px) }
 .district-art { object-position:62% center }
 .district::after { background:linear-gradient(0deg,#100e17ed 1%,#100e1770 73%,#100e1777) }
 .splice { flex-wrap:wrap;gap:7px 15px }
 .splice b { order:2; flex-basis:100% }
 .splice::before,.splice::after { display:none }
 .city-edition .pro { gap:24px }
}

/* Route map */
.map-edition .hero-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(350px,.8fr);
  align-items:center;
  gap:clamp(18px,4vw,66px);
  padding-block:84px 100px;
}
.map-edition .hero-copy h1 { font-size:clamp(66px,9vw,154px) }
.map-edition .hero-art img { position:absolute;inset:0; }
.map-edition .hero-art .campaign-art { opacity:0;object-position:center;transition:opacity .62s ease }
.map-edition .hero-art::after { transition:opacity .62s ease }
.map-edition .hero-copy h1,.map-edition .hero-copy .tagline,.hero-icon { transition:opacity .42s ease }
.map-edition .hero[data-art=campaign] .campaign-art { opacity:1 }
.map-edition .hero[data-art=campaign] .hero-art::after { opacity:.3 }
.map-edition .hero[data-art=campaign] :is(h1,.tagline,.hero-icon) { opacity:0 }
.map-edition .hero .hero-end { display:flex;align-items:center;justify-content:space-between;gap:8px }
.hero-switch { display:flex;gap:4px;padding:4px;background:#14121bea;border:1px solid #e3afba55 }
.hero-switch button {
  padding:8px 12px;border:1px solid transparent;background:transparent;color:var(--quiet);font:inherit;letter-spacing:.02em;
}
.hero-switch button[aria-pressed=true] { color:var(--cream);border-color:#eba0ae87;background:#402537 }
.hero-map { background:#0e1521ed;border:1px solid #afddd054;padding:18px;box-shadow:0 22px 45px #03050ac0 }
.map-header,.map-key { display:flex;align-items:center;justify-content:space-between;gap:8px }
.map-header { padding-bottom:13px }
.map-header .mono,.map-key { color:#b0d6cd;font-size:.63rem }
.map-header h2 { margin-top:2px;font-size:clamp(1.15rem,2.1vw,1.8rem);line-height:1.05;letter-spacing:-.04em }
.map-live { width:8px;height:8px;border-radius:50%;background:var(--mint);box-shadow:0 0 14px var(--mint) }
.map-grid { position:relative;aspect-ratio:12 / 7;background:#172631;isolation:isolate;overflow:hidden;border:1px solid #a9d8cb36 }
.map-art { position:absolute;inset:0;width:100%;height:100%;stroke-linecap:round;stroke-linejoin:round }
.map-art .water { fill:#0b1727;stroke:#446577 }
.map-art .blocks { fill:#233841;stroke:#304a52 }
.map-art .streets { stroke:#48616b;stroke-width:2 }
.map-art .road-edge { stroke:#23152b;stroke-width:10 }
.map-art .map-route { stroke:#f494aa;stroke-width:3.5;stroke-dasharray:5 4;animation:route-drive 8s linear infinite }
@keyframes route-drive { to { stroke-dashoffset:-90 } }
.map-grid a {
  position:absolute;left:var(--x);top:var(--y);transform:translate(-50%,-50%);
  min-width:40px;min-height:40px;display:grid;place-items:center;color:#ffe4eb;text-decoration:none;
}
.map-grid b { display:grid;place-items:center;border:1px solid #ffc5d1;border-radius:50%;width:29px;height:29px;background:#291928;font:700 .68rem ui-monospace,monospace;box-shadow:0 0 0 3px #161722b0 }
.map-grid a span { position:absolute;top:calc(100% - 3px);white-space:nowrap;padding:2px 4px;background:#0e1521;font:700 .63rem ui-monospace,monospace }
.map-grid a:is(:hover,:focus-visible,[aria-current]) b { color:#122221;background:#a7f5dd;border-color:#a7f5dd }
.map-key { margin-top:10px }
.terminal { --mint:#ffd29c;border-top:1px solid #ffc586 }
.terminal::after { background:linear-gradient(90deg,#0f131be8,#1516265c 65%,#10131c42),linear-gradient(0deg,#14131be5,transparent 75%) }
.terminal h2 { font-size:clamp(55px,8vw,115px);font-weight:920;line-height:.87;letter-spacing:-.075em;margin:11px 0 22px }
.gate { padding:12px 16px;width:fit-content;border:1px solid #ffbe77;background:#251c1be8 }
.gate span:first-child { border-right:1px solid #ffbe7773;padding-right:12px }
@media(max-width:900px) {
  .map-edition .hero-layout { grid-template-columns:minmax(0,1fr) minmax(290px,.9fr);gap:16px }
  .map-edition .hero-copy h1 { font-size:clamp(54px,9vw,100px) }
}
@media(max-width:700px) {
  .map-edition .hero-layout { grid-template-columns:minmax(0,1fr);padding-top:95px;gap:24px }
  .map-edition .hero-copy h1 { font-size:clamp(56px,15vw,96px) }
  .map-edition .hero-map { max-width:500px;width:100%;padding:12px }
  .map-edition .hero-art .campaign-art { object-position:77% center }
  .map-edition .hero[data-art=campaign] .hero-copy :is(h1,.tagline,.hero-icon) { opacity:1 }
  .map-edition .hero[data-art=campaign] .hero-art::after { opacity:1 }
  .map-edition .hero .hero-end { bottom:18px }
  .map-edition .top nav { gap:6px }
  .map-edition .top nav a { gap:3px }
  .map-edition .route-nav b { display:none }
  .gate { gap:8px;flex-wrap:wrap }
}
@media(prefers-reduced-motion:reduce) {
 .map-edition .hero :is(.campaign-art,h1,.tagline,.hero-icon),.map-edition .hero-art::after { transition:none }
 .map-art .map-route { animation:none }
}
@media(max-width:800px) { .map-edition .top-tag { display:none } }
@media(max-width:360px) { .map-edition .hero-end > span { display:none } }

/* District navigator */
.navigator-edition { --head:68px }
.navigator-edition .top { background:#100e17d9;box-shadow:0 8px 24px #09071055;gap:10px }
.navigator-edition .route-nav { gap:3px;padding:4px;border:1px solid #e5c6d723;border-radius:24px;background:#201927b0 }
.navigator-edition .route-nav a { border:0;border-radius:20px;padding:8px clamp(8px,1.25vw,19px);transition:background .2s,color .2s }
.navigator-edition .route-nav a[aria-current] { background:#29403e;color:#cbffe9 }
.header-map { display:flex;align-items:center;gap:7px;padding:8px 13px;border:1px solid #a6ebd745;border-radius:18px;background:#142323;color:#b3f5dd }
.header-map svg { width:16px;height:16px }
.navigator-edition .hero { min-height:0;aspect-ratio:1672 / 941 }
.navigator-edition .hero-layout { display:flex;justify-content:center;align-items:flex-start;padding-block:76px 80px;gap:0 }
.navigator-edition .hero[data-art=campaign] .campaign-art { object-fit:cover;object-position:center }
.navigator-edition .hero[data-art=campaign] .hero-art::after { opacity:0 }
.navigator-edition .hero[data-art=campaign] .hero-copy :is(h1,.tagline,.hero-icon,.action) { opacity:0;pointer-events:none }
.navigator-edition .hero[data-art=campaign] .hero-copy .action { visibility:hidden }
.navigator-edition .hero-copy .location { top:22px }
.navigator-edition .hero-end { bottom:18px }
.map-dock { padding:clamp(24px,4vw,60px) 0;background:radial-gradient(ellipse at 62% 60%,#1b3c3b,#131523 63%);border-block:1px solid #8af2d849 }
.dock-layout { display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1fr);gap:clamp(20px,6vw,85px);align-items:center }
.dock-copy .mono { color:var(--mint) }
.dock-copy h2 { font-size:clamp(48px,7.8vw,112px);line-height:.86;letter-spacing:-.077em;margin:13px 0 18px }
.dock-copy p:last-child { color:var(--quiet);max-width:34ch }
.navigator-edition .hero-map { width:100%;max-width:620px;justify-self:end }
.route-hud { position:fixed;z-index:8;right:clamp(10px,3vw,40px);bottom:max(12px,env(safe-area-inset-bottom));display:grid;gap:8px;justify-items:end }
.route-pager,.route-popup { border:1px solid #a6ebd76b;background:#111b27f3;box-shadow:0 10px 32px #040509c7;backdrop-filter:blur(16px) }
.route-pager { display:flex;align-items:stretch;padding:4px;border-radius:11px }
.route-pager button,.route-close { background:transparent;border:0 }
.route-pager :is(.route-prev,.route-next),.route-close { display:grid;place-items:center;width:44px;min-height:44px;color:var(--mint) }
.route-pager button:not(:disabled):hover,.route-close:hover { background:#274343 }
.route-pager button:disabled { opacity:.33;cursor:default }
.route-locator { min-width:155px;padding:3px 9px;text-align:left;border-inline:1px solid #a6ebd744!important }
.route-locator .mono { display:block;color:var(--mint);font-size:.57rem }
.route-locator strong { display:block;font-size:.82rem }
.route-popup { width:min(365px,calc(100vw - 30px));border-radius:13px;padding:13px }
.route-popup header { display:flex;align-items:center;justify-content:space-between;gap:9px;margin-bottom:8px }
.route-popup header .mono { font-size:.6rem;color:var(--mint) }
.route-popup h2 { font-size:1.22rem }
.route-popup .map-grid { width:100% }
.navigator-edition .site-footer { padding-bottom:88px }
@media(max-width:800px) {
 .navigator-edition .top .lockup span,.navigator-edition .route-nav b { display:none }
 .navigator-edition .top nav a { font-size:.73rem;padding:7px 8px }
}
@media(max-width:700px) {
 .navigator-edition { --head:58px }
 .navigator-edition .top { padding-inline:10px }
 .navigator-edition .route-nav { gap:0 }
 .navigator-edition .top nav a { font-size:clamp(.59rem,2.4vw,.73rem);padding:7px 5px }
 .header-map { padding:7px }
 .header-map span { display:none }
 .navigator-edition .hero { aspect-ratio:auto;min-height:clamp(400px,116vw,530px) }
 .navigator-edition .hero-layout { padding-block:82px 84px }
 .navigator-edition .hero[data-art=campaign] .campaign-art { object-fit:contain;background:#100e17 }
 .dock-layout { grid-template-columns:1fr }
 .navigator-edition .hero-map { justify-self:start }
 .route-hud { right:10px }
}
@media(prefers-reduced-motion:reduce) { .navigator-edition .route-nav a { transition:none } }

/* Motion pass */
.motion-edition .hero-copy h1 {
  font-weight:850;
  letter-spacing:-.04em;
  line-height:.86;
}
.motion-edition :is(.dock-copy,.section-head,.studio,.terminal,.pro) h2 {
  font-weight:800;
  letter-spacing:-.045em;
  line-height:.97;
}
.motion-edition .stage-detail h3 { font-weight:750;letter-spacing:-.036em }
.phone-rig {
  position:relative;
  width:fit-content;
  margin-inline:auto;
  transform:perspective(950px) translateY(var(--lift,0px))
    rotateX(var(--pitch,0deg)) rotateY(var(--yaw,0deg)) rotateZ(var(--roll,0deg));
  transform-origin:center;
  filter:drop-shadow(0 20px 20px #04050bc9) drop-shadow(0 0 32px #ff8caf45);
}
.motion-edition .phone-rig img {
  filter:none;
  border-radius:0;
  max-width:100%;
}
.phone-rig::after {
  content:"";
  position:absolute;
  inset:2px;
  border-radius:15.5% / 7.5%;
  background:linear-gradient(116deg,transparent 15%,#f1e6ff12 43%,transparent 58%);
  pointer-events:none;
}
.motion-edition .district-art {
  top:-40px;
  height:calc(100% + 80px);
  transform:translateY(var(--city-drift,0px));
}
.motion-edition .city-stop::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  pointer-events:none;
  background:radial-gradient(ellipse 45% 38% at 72% 43%,var(--bloom,#4aa7b536),transparent 82%),
    radial-gradient(ellipse 48% 30% at 30% 74%,var(--bloom-secondary,#b26eac28),transparent 78%);
  mix-blend-mode:screen;
  animation:city-breath 12s ease-in-out infinite alternate;
}
.motion-edition .hero::before { --bloom:#4a9fbb46;--bloom-secondary:#fa795731 }
.motion-edition .hero[data-art=campaign]::before { opacity:0;animation:none }
.motion-edition .terminal { --bloom:#ffc08548;--bloom-secondary:#c5784c34 }
.motion-edition .signal { --bloom:#e67eb954;--bloom-secondary:#5468ed40 }
.motion-edition .heights { --bloom:#fca66a46;--bloom-secondary:#fb7ca82d }
@keyframes city-breath {
  from { opacity:.38; transform:translate(-2%,2%) scale(.98) }
  to { opacity:.88; transform:translate(3%,-3%) scale(1.12) }
}
@media(max-width:650px) {
  .motion-edition .hero-copy h1 { font-size:clamp(53px,14vw,94px) }
  .motion-edition .pro > .phone-rig { grid-row:2 }
}
@media(prefers-reduced-motion:reduce) {
  .phone-rig,.motion-edition .district-art { transform:none }
  .motion-edition .city-stop::before { animation:none;opacity:.5 }
  .motion-edition .hero[data-art=campaign]::before { opacity:0 }
}

/* After dark */
.after-dark .hero-art { overflow:hidden;z-index:-2 }
.after-dark .hero-art .harbor-art {
  transform:translate3d(var(--lean-x,0px),calc(var(--lean-y,0px) + var(--hero-drift,0px)),0) scale(1.16);
  transition:transform .45s ease-out;
}
.atmosphere { position:absolute;inset:0;z-index:-1;overflow:hidden;pointer-events:none }
.atmosphere span { position:absolute;display:block;pointer-events:none;animation-play-state:paused }
.in-scene .atmosphere span { animation-play-state:running }
.atmosphere .vapor {
  inset:-20%;
  background:radial-gradient(ellipse 28% 12% at 32% 76%,var(--mist,#8cb3fa49),transparent 80%),
    radial-gradient(ellipse 38% 13% at 69% 71%,var(--mist,#8cb3fa49),transparent 80%),
    radial-gradient(ellipse 28% 11% at 88% 84%,var(--light,#f36cae3d),transparent 82%);
  mix-blend-mode:screen;
  animation-name:quay-vapor;animation-duration:11s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate;
}
.atmosphere .wash {
  inset:-12%;
  background:radial-gradient(ellipse 27% 45% at 77% 54%,var(--light,#f36cae3d),transparent 82%),
    radial-gradient(ellipse 22% 21% at 39% 34%,var(--mist,#8cb3fa49),transparent 84%);
  mix-blend-mode:screen;
  animation-name:district-wash;animation-duration:7.5s;animation-timing-function:ease-in-out;animation-iteration-count:infinite;animation-direction:alternate;
}
.atmosphere .streaks {
  top:var(--trail-height,75%);left:-45%;width:90%;height:14%;
  background:linear-gradient(0deg,transparent 0 26%,var(--light,#f36cae3d) 34%,transparent 55%),
    linear-gradient(0deg,transparent 51%,var(--mist,#8cb3fa49) 58%,transparent 67%);
  mask-image:radial-gradient(ellipse,black 0,transparent 67%);
  animation-name:passing-lights;animation-duration:var(--trail-speed,9s);animation-timing-function:ease-in-out;animation-iteration-count:infinite;
  mix-blend-mode:screen;
}
.after-dark .hero { --light:#ff946955;--mist:#7dc4ff54;--trail-height:78%;--trail-speed:8s }
.after-dark .hero[data-art=campaign] { --light:#fd9c6560;--mist:#c785ff56 }
.after-dark .hero[data-art=campaign] .vapor { opacity:.55 }
.after-dark .terminal { --light:#ffbf695c;--mist:#a8d7dd43;--trail-speed:11s }
.after-dark .mile { --light:#ff8d786a;--mist:#80ffd45a;--trail-height:62%;--trail-speed:6s }
.after-dark .signal { --light:#f15fce72;--mist:#537aff6a;--trail-height:72%;--trail-speed:7s }
.after-dark .heights { --light:#ffb47860;--mist:#ffd9b549;--trail-height:53%;--trail-speed:14s }
@keyframes quay-vapor { from {transform:translate3d(-14%,2%,0) scale(.89);opacity:.4} to {transform:translate3d(13%,-6%,0) scale(1.12);opacity:.97} }
@keyframes district-wash { from {transform:translate3d(9%,-7%,0) scale(.94);opacity:.42} to {transform:translate3d(-10%,7%,0) scale(1.11);opacity:.95} }
@keyframes passing-lights { 0%,100% {transform:translate3d(0,0,0) skewY(-4deg);opacity:0} 22% {opacity:0} 46% {opacity:.8} 72% {opacity:.22} 84%,100% {transform:translate3d(173%,0,0) skewY(-4deg);opacity:0} }
.motion-toggle { background:#10101cee;border:1px solid #dbc3d655;padding:9px 10px;letter-spacing:0;font:inherit;color:#f4dce4 }
.motion-toggle:hover { border-color:var(--mint) }
.atmosphere-paused .atmosphere span,.atmosphere-paused .city-stop::before { animation-play-state:paused }
.atmosphere-paused .hero-art .harbor-art,.atmosphere-paused .district-art,.atmosphere-paused .phone-rig { transform:none;transition:none }
.session-demo { background:linear-gradient(135deg,#202a36,#141720 70%);border-color:#8af2d869 }
.session-meta { display:flex;justify-content:space-between;gap:8px;color:var(--mint);font-size:.59rem }
.session-meta i { display:inline-block;width:6px;height:6px;background:#b3b9c2;border-radius:50%;margin-right:4px }
.session-demo[data-running=true] .session-meta i { background:#ffa5a8;box-shadow:0 0 10px #ffa5a8 }
.session-controls { display:flex;flex-wrap:wrap;gap:6px;align-items:stretch;margin-bottom:8px }
.session-controls .action { margin:0;padding:5px 9px;font-size:.78rem;min-height:43px }
#timer-toggle { border-color:var(--mint);background:#1c3536 }
.timer-reset { background:#171825;border:1px solid #b7a6be60;padding:4px 9px;font-size:.78rem;min-height:43px }
.session-controls button:disabled { opacity:.45;cursor:default;transform:none }
@media(max-width:500px) { .motion-toggle,.after-dark .hero-switch { font-size:.61rem } .hero-switch button { padding-inline:7px } }
@media(prefers-reduced-motion:reduce) {
 .after-dark .hero-art .harbor-art { transform:none;transition:none }
 .atmosphere span { animation:none }
 .atmosphere .streaks { display:none }
}

/* Paired screens and foldable layout study */
.duo-strip { margin:clamp(48px,8vw,105px) auto 0;max-width:840px;padding:28px clamp(10px,5vw,56px);border-block:1px solid #dfc0db45;background:radial-gradient(ellipse at 50% 64%,#90608a36,transparent 69%),#10131ed9;text-align:center }
.duo-strip h3,.fold-intro h3 { font-weight:800;line-height:1;letter-spacing:-.045em;font-size:clamp(2rem,5vw,4.5rem);margin-bottom:24px }
.phone-pair { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(12px,4vw,52px);max-width:565px;margin:auto;padding:18px 0 }
.phone-pair figure { min-width:0;display:grid;justify-items:center;align-content:start;gap:22px }
.phone-pair figure:nth-child(2) { padding-top:28px }
.phone-pair .phone-rig { width:min(100%,245px) }
.phone-pair img { width:100% }
.phone-pair figcaption { color:var(--quiet);font-size:.65rem }
.fold-lab { display:grid;grid-template-columns:minmax(230px,.55fr) minmax(0,1fr);align-items:center;gap:clamp(16px,4vw,62px);padding:clamp(20px,4vw,55px);margin-top:clamp(48px,8vw,105px);border:1px solid #bba5ce65;background:radial-gradient(ellipse at 75% 55%,#793c775c,transparent 68%),#11121c }
.fold-intro .mono { color:#ffc2e7 }
.fold-intro h3 { margin:14px 0 }
.fold-intro p:not(.mono) { color:var(--quiet);max-width:31ch }
.fold-intro .fold-note { font-size:.56rem;margin-top:13px }
.fold-controls,.duo-tabs { display:flex;gap:4px;flex-wrap:wrap }
.fold-controls { margin-top:22px }
.fold-controls button,.duo-tabs button { background:#201d2b;border:1px solid #a49aad58;padding:8px 10px;border-radius:6px;font-weight:650 }
.fold-controls button[aria-pressed=true],.duo-tabs button[aria-pressed=true] { background:#29413e;color:#c7f8e8;border-color:#a3e7cf }
.fold-device-stage { display:grid;place-items:center;min-width:0;min-height:clamp(250px,36vw,540px) }
.fold-device { width:100%;border-radius:clamp(15px,3vw,32px);padding:clamp(3px,.45vw,6px);background:linear-gradient(155deg,#828c9f,#222537 27%,#606781 56%,#171a28 77%,#727e97);box-shadow:0 21px 35px #06050dcc,0 0 25px #e875c84d }
.fold-device .duo-display { width:100%;border-radius:inherit;padding:clamp(8px,1.5vw,20px);border:2px solid #06070e;background:#111722;container-type:inline-size }
.inner-display { max-width:680px }
.inner-display .duo-display { aspect-ratio:2670/1878;display:grid;grid-template-rows:auto 1fr auto;gap:7px }
.duo-chrome,.duo-transport,.duo-timeline .mono { display:flex;align-items:center;gap:6px;font:700 clamp(.43rem,1.7cqi,.72rem) ui-monospace,monospace;letter-spacing:.08em }
.duo-chrome { color:#ffdfcd;border-bottom:1px solid #ad9aa647;padding-bottom:5px }
.duo-chrome img { width:clamp(12px,5cqi,22px);height:auto;border-radius:4px }
.duo-chrome span { margin-left:auto;color:#a3e7cf }
.duo-editor { display:grid;grid-template-columns:minmax(0,1.55fr) minmax(0,1fr);gap:7px;align-items:start }
.duo-main .mono { color:#a3e7cf;font-size:clamp(.42rem,1.8cqi,.65rem);margin:3px 0 }
.duo-canvas { width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:5px;border:1px solid #c58aab60 }
.duo-transport,.duo-timeline .mono { justify-content:space-between;color:#dec5d9;margin-top:4px }
.duo-inspector { background:#20222f;border:1px solid #a99bab3a;padding:4px;border-radius:6px }
.duo-tabs { gap:2px }
.duo-tabs button { padding:3px;border-radius:3px;font-size:clamp(.43rem,2cqi,.7rem) }
.duo-inspector-body { padding:5px 2px;font-size:clamp(.46rem,2cqi,.72rem);color:#ffdfcd }
.duo-inspector-body p { color:#cfcbda;border-top:1px solid #f1e3f524;padding:3px 0 }
.duo-track { height:clamp(12px,4cqi,30px);margin-top:3px;border-radius:4px;background:linear-gradient(90deg,transparent 40%,#ffc2e7 40% 41%,transparent 41%),repeating-linear-gradient(90deg,#436b74 0 9%,#3e5b72 9% 17%,#171d2b 17% 18%) }
.outer-display { width:min(75%,295px) }
.outer-display .duo-display { aspect-ratio:1398/2034;display:flex;flex-direction:column;justify-content:center;gap:7px;padding:18px }
.outer-display .mono { font-size:clamp(.48rem,3.8cqi,.7rem);color:#a3e7cf }
.outer-display .duo-chrome { margin-bottom:8px }
.cover-clock { font:800 clamp(1rem,16cqi,2.6rem) ui-monospace,monospace;color:#ffdfcd }
.outer-display .action { font-size:.7rem;padding:4px;min-height:32px }
@media(max-width:760px) { .fold-lab { grid-template-columns:minmax(0,1fr) } }
@media(max-width:520px) {
 .phone-pair { grid-template-columns:minmax(0,1fr);max-width:240px;gap:28px }
 .phone-pair figure:nth-child(2) { padding-top:0 }
 .fold-lab { padding-inline:10px }
 .fold-intro { padding-inline:7px }
}

.fold-device-stage { position:relative;isolation:isolate;perspective:1400px }
.fold-device-stage::before {
  content:"";position:absolute;z-index:-1;inset:50% -7% -5%;
  background:radial-gradient(ellipse,#e052a65c,transparent 67%);
  transform:rotate(-7deg);pointer-events:none;
}
.fold-device {
  position:relative;
  padding:clamp(5px,.7vw,10px);
  background:linear-gradient(150deg,#d4dbe5 0%,#485875 12%,#101522 31%,#8895aa 56%,#2f3951 72%,#aeb9c8 92%,#252b3c);
  border:1px solid #c4cad5;
  box-shadow:inset 0 0 0 2px #1c2333,0 3px 0 #272d40,0 6px 0 #0b0e18,0 26px 28px #070511c9,0 0 28px #e875c844;
  transform:rotateX(5deg) rotateY(-7deg) rotateZ(-1.4deg);
}
.fold-device .duo-display { position:relative;overflow:hidden;border:3px solid #070913;border-radius:clamp(10px,2vw,24px) }
.fold-device::before,.fold-device::after {
  content:"";position:absolute;z-index:-1;
  background:linear-gradient(90deg,#353f53,#b1bac6,#30394a);
  width:5px;right:-5px;border-radius:0 3px 3px 0;
}
.fold-device::before { top:20%;height:14% }
.fold-device::after { top:39%;height:8% }
.device-hinge { position:absolute;z-index:1;pointer-events:none }
.inner-display .device-hinge {
  top:-2px;bottom:-4px;left:50%;width:clamp(5px,1.1vw,13px);transform:translateX(-50%);
  background:linear-gradient(90deg,#03050977,transparent 28%,#bac9df17 49%,#d5e1ee38 54%,transparent 70%,#05050946);
}
.inner-display .device-hinge::before,.inner-display .device-hinge::after {
  content:"";position:absolute;left:0;width:100%;height:5px;border:1px solid #b6bfd0;
  background:linear-gradient(90deg,#303a4d,#c5cbd6,#323d52);border-radius:2px;
}
.inner-display .device-hinge::before { top:0 }.inner-display .device-hinge::after { bottom:0 }
.outer-display .device-hinge {
  top:8%;bottom:8%;left:-5px;width:6px;border-radius:3px 0 0 3px;
  background:linear-gradient(90deg,#586478,#c7ccd7 45%,#383f54);
}
.outer-display .duo-display::before {
  content:"";position:absolute;left:50%;top:5px;width:21%;height:8px;
  border-radius:8px;transform:translateX(-50%);background:#05060c;
}
@media(max-width:760px) { .fold-device { transform:rotateX(3deg) rotateY(-4deg) } }

/* Launch device lineup */
.navigator-edition .hero-layout { position:relative;display:grid;grid-template-columns:minmax(280px,.67fr) minmax(0,1fr);align-items:center;gap:clamp(8px,2vw,32px) }
.navigator-edition .hero-copy { width:auto }
.navigator-edition .hero-end { width:100% }
.navigator-edition .hero-copy .location { left:0 }
.navigator-edition .hero-copy h1 { font-size:clamp(61px,8.1vw,147px) }
.hero-release { margin:0 0 18px;padding-left:10px;border-left:2px solid #ffd4b9 }
.hero-release strong,.hero-release span { display:block }
.hero-release strong { font-size:clamp(.9rem,1.45vw,1.22rem);color:#ffeedc }
.hero-release span { font-size:clamp(.73rem,1.15vw,.87rem);color:#f6dbd2 }
.hero-lineup { position:relative;min-width:0;align-self:center;isolation:isolate }
.hero-lineup::before { content:"";position:absolute;inset:20% -6% 0;z-index:-1;background:radial-gradient(ellipse at 48% 73%,#e086864f,transparent 65%),radial-gradient(ellipse at 57% 44%,#53e3f543,transparent 66%);filter:blur(12px) }
.device-cascade { position:relative;aspect-ratio:1.35;perspective:1100px;container-type:inline-size }
.lineup-device { position:absolute;padding:clamp(3px,.75cqi,9px);border:1px solid #b3c3d0;border-radius:clamp(10px,3.1cqi,28px);background:linear-gradient(150deg,#c7d3db,#37485c 12%,#101720 42%,#8a9cac 65%,#252d44 82%,#7c849e);box-shadow:inset 0 0 0 1px #fff5,0 3px 0 #161c2a,0 18px 35px #070711da,0 0 21px #a0cffe55 }
.lineup-glass { position:relative;isolation:isolate;border-radius:calc(clamp(10px,3.1cqi,28px) - 3px);background:linear-gradient(145deg,#1b2533,#0d111b 65%);padding:3%;border:2px solid #080b13;overflow:hidden }
.lineup-tablet { top:2%;left:15%;width:77%;transform:rotateZ(-7deg) rotateY(-10deg) }
.lineup-fold { top:44%;left:3%;width:53%;transform:rotateZ(-5deg) rotateY(7deg);z-index:1 }
.lineup-fold::after { content:"";position:absolute;left:49.5%;top:-1px;bottom:-1px;width:2%;pointer-events:none;background:linear-gradient(90deg,#10121d40,#effbff32,transparent);border-block:1px solid #c9d3dc }
.lineup-phone { position:absolute;right:1%;top:30%;width:24%;height:auto;z-index:2;transform:rotateZ(10deg) rotateY(-7deg);filter:drop-shadow(0 12px 16px #000d) drop-shadow(0 0 9px #f39eb860) }
.lineup-bar,.lineup-tools,.lineup-clip span,.lineup-marks { display:flex;justify-content:space-between;gap:3px;color:#e8dfd5;font:700 clamp(3px,1.6cqi,13px)/1.1 ui-monospace,monospace;letter-spacing:.04em }
.lineup-bar { margin-bottom:3%;color:#a2f1d9 }.lineup-bar b { color:#ffeddb }
.lineup-clip { position:relative;overflow:hidden;border:1px solid #eb9ab870;border-radius:4px }
.lineup-clip img { width:100%;height:auto;aspect-ratio:2.06;object-fit:cover }
.lineup-clip span { position:absolute;left:4%;bottom:6%;background:#100e17d9;padding:2px 3px;font-size:clamp(3px,1.35cqi,11px) }
.lineup-track { display:flex;position:relative;gap:2px;margin-top:3%;height:clamp(6px,3.6cqi,26px) }
.lineup-track i { flex:1;border:1px solid #a4e4d95f;background:linear-gradient(140deg,#426575,#27384d 53%,#6e4469);border-radius:2px }
.lineup-track::after { content:"";position:absolute;left:46%;top:-2px;bottom:-2px;width:1px;background:#ffd2dc;box-shadow:0 0 8px #ffb4cd }
.lineup-tools { margin-top:4%;color:#e3bbd6 }
.lineup-fold-grid { display:grid;grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);gap:3% }
.lineup-fold .lineup-clip img { aspect-ratio:1.3 }
.lineup-fold .lineup-bar,.lineup-marks { font-size:clamp(3px,1.25cqi,10px) }
.lineup-marks { flex-direction:column;justify-content:center;padding:2% 4%;background:#273040;border-radius:3px;line-height:1.3 }
.lineup-marks b { color:#a2f1d9 }.lineup-marks span { border-top:1px solid #fff3 }
.hero-lineup figcaption { display:flex;justify-content:center;align-items:center;gap:8px;color:#fff0dd;letter-spacing:.075em;font-size:clamp(.45rem,1vw,.67rem);white-space:nowrap;text-shadow:0 2px 4px #111 }
.hero-lineup figcaption span { width:4px;height:4px;border-radius:50%;background:#ffc1cd }
.navigator-edition .hero[data-art=campaign] .hero-lineup,.navigator-edition .hero[data-art=campaign] .hero-release { visibility:hidden }
@media(max-width:800px) {
 .navigator-edition .hero-layout { display:grid;grid-template-columns:minmax(0,1fr);padding-block:65px 70px;gap:10px;justify-items:start;align-content:center }
 .navigator-edition .hero-copy h1 { font-size:clamp(48px,13vw,94px);margin:10px 0 }
 .navigator-edition .hero-copy h1 br { display:none }
 .navigator-edition .hero-copy h1 span { padding-left:.12em }
 .navigator-edition .tagline { margin:10px 0 }
 .navigator-edition .hero-icon { width:32px }
 .navigator-edition .hero-release { margin-bottom:10px }
 .navigator-edition .hero-copy .action { min-height:36px;padding-block:5px;font-size:.73rem }
 .hero-lineup { width:min(100%,500px);justify-self:center }
 .navigator-edition .hero[data-art=campaign] .hero-layout { min-height:0;align-content:start }
 .navigator-edition .hero[data-art=campaign] .hero-art .campaign-art { object-fit:contain;background:#100e17 }
}

/* Wide Night Splice workspaces */
.fold-device .duo-display,.lineup-device .duo-display {
  position:relative;display:grid;grid-template-rows:auto minmax(0,1fr) auto;gap:clamp(3px,1.4cqi,11px);
  padding:clamp(5px,2.4cqi,17px);background:linear-gradient(138deg,#222637,#111620 62%);
  border:2px solid #080c15;border-radius:clamp(6px,1.85cqi,21px);
}
.fold-device .duo-display { container-type:normal }
.fold-device,.lineup-device { container-type:inline-size }
.inner-display .duo-display,.lineup-fold .duo-display { aspect-ratio:2670/1878 }
.tablet-display .duo-display,.lineup-tablet .duo-display { aspect-ratio:1.54 }
.outer-display .duo-display { display:flex;flex-direction:column;justify-content:center;padding:18px }
.tablet-display { max-width:715px;transform:rotateX(3deg) rotateY(-4deg) rotateZ(.5deg) }
.lineup-device .duo-chrome { font-size:clamp(3px,2.05cqi,12px) }
.duo-editor { grid-template-columns:minmax(0,1.8fr) minmax(0,1fr);align-items:stretch;gap:clamp(3px,1.5cqi,12px) }
.duo-main { min-width:0 }
.duo-main .duo-canvas { aspect-ratio:1.78;box-shadow:0 0 12px #e458a845 }
.duo-main .duo-transport svg { width:clamp(6px,3cqi,18px);height:auto;fill:#ffc9bf;stroke:none }
.duo-main .duo-transport { color:#9de9d6 }
.duo-inspector { background:linear-gradient(160deg,#2e2637,#191f2c);border-color:#cb8fb251 }
.duo-tabs { align-items:center }
.duo-tabs span { display:inline-block;border:1px solid #a49aad58;padding:2px 3px;border-radius:3px;font-size:clamp(3px,1.9cqi,10px) }
.duo-tabs span.selected { border-color:#a3e7cf;color:#a3e7cf }
.replay-trim,.ipad-toolbar { display:flex;gap:4px;margin-top:clamp(3px,1cqi,8px);font-size:clamp(3px,1.65cqi,10px);letter-spacing:0;color:#f5d6ce }
.replay-trim span,.ipad-toolbar span { padding:3px 4px;background:#2b2434;border:1px solid #e0a3bd50;border-radius:3px }
.replay-trim b { color:#a3e7cf }
.duo-track { display:flex;gap:2px;position:relative;background:#14151f }
.duo-track i { flex:1;background:linear-gradient(#9e53751a,#17212aa0),url("assets/mile-thumb.jpg") center / cover;border:1px solid #8acaba66;border-radius:2px }
.duo-track i:nth-child(even) { background-position:right }
.duo-track::after { content:"";position:absolute;top:-4px;bottom:-4px;left:41%;width:1px;background:#ff9eb6;box-shadow:0 0 6px #ff7db0 }
.ipad-workarea { display:grid;grid-template-columns:minmax(0,.65fr) minmax(0,2.3fr) minmax(0,.9fr);gap:clamp(3px,1.25cqi,9px);min-height:0 }
.ipad-library,.ipad-inspector { min-width:0;background:#1a2130;padding:5%;border:1px solid #b39ac746;border-radius:4px;color:#cfdbe4;font:650 clamp(3px,1.7cqi,11px)/1.18 ui-monospace,monospace }
.ipad-library b,.ipad-inspector b { display:block;margin-bottom:6%;color:#a6f1dc }
.ipad-library div,.ipad-inspector div { padding:5% 1%;border-top:1px solid #abb5cb2d }
.ipad-library img { width:100%;height:auto;aspect-ratio:3/1;object-fit:cover;border-radius:2px;margin-bottom:2px }
.ipad-inspector strong { display:block;color:#f3cad7 }
.ipad-inspector p { margin-top:12%;padding:6%;text-align:center;background:#aa534f;color:#fff1e5;border-radius:3px }
.ipad-timeline .duo-track i { background-image:linear-gradient(#a72a5e10,#270f2d65),url("assets/district-thumb.jpg") }
.ipad-wave { height:clamp(3px,1.3cqi,8px);margin-top:2px;background:repeating-linear-gradient(90deg,#a5dfcf 0 1px,#354e5e 1px 3px);opacity:.66;border-radius:2px }
.ipad-toolbar { justify-content:space-between }
.lineup-device .duo-inspector-body { font-size:clamp(3px,1.95cqi,10px) }
.lineup-device .duo-transport,.lineup-device .duo-timeline .mono,.lineup-device .duo-main .mono { font-size:clamp(3px,1.9cqi,10px) }

/* End slate and cursor */
.navigator-edition .site-footer {
  padding:10px 0;
  border-top-color:#d88ca663;
  background:linear-gradient(106deg,#211421,#0a101a 63%,#111d22);
}
.footer-bar {
  display:flex;
  align-items:center;
  gap:clamp(10px,2vw,28px);
  padding-right:230px;
}
.footer-bar .lockup img { width:28px;height:28px;border-radius:7px }
.footer-bar small { color:#d4bec9;font-size:.7rem }
.footer-credits { position:relative;margin-left:auto }
.footer-credits summary {
  display:flex;align-items:center;gap:7px;
  width:max-content;min-height:40px;list-style:none;cursor:pointer;
  color:#a8f4dd;font-size:.61rem;text-transform:uppercase;
}
.footer-credits summary::-webkit-details-marker { display:none }
.footer-credits summary svg { width:17px;height:17px }
.footer-credits summary:hover,.footer-credits[open] summary { color:#ffd7e4 }
.credits-panel {
  position:absolute;z-index:6;right:0;bottom:calc(100% + 9px);
  width:min(250px,80vw);padding:12px 15px;border:1px solid #f4a9c67c;
  background:#15121def;box-shadow:0 0 24px #f27bb14a;
}
.credits-panel p { margin:5px 0;font-size:.78rem }
.credits-panel p:first-child { color:#ffb6d0;letter-spacing:.15em }
.cursor-trail { position:fixed;inset:0;z-index:12;width:100%;height:100%;pointer-events:none }
.neon-pointer {
  --neon-cursor:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='28' height='28' viewBox='0 0 28 28'%3E%3Cpath d='M5 4l5 19 4-8 8-4z' fill='%23edfff9' stroke='%23131824' stroke-width='4' stroke-linejoin='round'/%3E%3Cpath d='M5 4l5 19 4-8 8-4z' fill='%23edfff9' stroke='%2365f5df' stroke-width='1.5' stroke-linejoin='round'/%3E%3C/svg%3E") 5 4;
  cursor:var(--neon-cursor),auto;
}
.neon-pointer :is(a,button:not(:disabled),summary) { cursor:var(--neon-cursor),pointer }
@media(max-width:650px) {
  .navigator-edition .site-footer { padding-bottom:calc(61px + env(safe-area-inset-bottom)) }
  .footer-bar { padding-right:0;flex-wrap:wrap;gap:3px 11px }
  .footer-bar small { font-size:.61rem }
}

/* Creator Drops */
.creator-jump { margin-top:9px }
.creator-drops {
  --acid:#e1ff79;
  --paper:#fff0df;
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding:clamp(58px,8vw,114px) 0;
  color:var(--paper);
  border-block:2px solid #d971a2;
  background:#18131e;
}
.creator-drops::before {
  content:"";
  position:absolute;
  inset:0;
  z-index:-1;
  background:
    repeating-linear-gradient(121deg,transparent 0 74px,#ffc6db13 75px 76px,transparent 77px 106px),
    radial-gradient(circle at 89% 17%,#ff3a8e5e,transparent 34%),
    radial-gradient(circle at 16% 67%,#a6dd391e,transparent 33%),
    radial-gradient(circle,#fff1 0 1px,transparent 1.4px) 0 0 / 5px 5px;
}
.creator-wrap { max-width:1210px }
.creator-header { position:relative;margin-bottom:clamp(25px,4vw,45px) }
.creator-label { color:var(--acid);letter-spacing:.12em }
.creator-label span { display:inline-block;width:14px;height:7px;margin-right:6px;background:var(--acid);transform:skewX(-23deg) }
.creator-header h2 {
  margin:14px 0 16px;
  font-size:clamp(3.2rem,10vw,9.4rem);
  font-weight:950;
  letter-spacing:-.065em;
  line-height:.88;
  text-transform:uppercase;
}
.creator-header h2 em { color:#ffb3d0;font-style:italic;text-shadow:3px 2px #883059,-2px -1px #412734 }
.creator-header > p:last-child { max-width:53ch;color:#eddae1 }
.creator-stamp {
  position:absolute;top:12px;right:2%;transform:rotate(7deg);
  padding:9px 12px;border:1px dashed #ffb3d0;color:#ffd4e4;text-align:center;
  background:#28182a;
}
.creator-stamp span { display:block;margin-top:3px;font-size:.56rem }
.creator-grid { display:grid;grid-template-columns:minmax(0,.72fr) minmax(0,1.45fr);gap:clamp(16px,3vw,36px);align-items:stretch }
.creator-flyer {
  padding:clamp(16px,3vw,36px);
  color:#231a25;
  background:repeating-linear-gradient(133deg,transparent 0 16px,#64314116 17px 18px,transparent 19px 27px),#ffbad6;
  box-shadow:5px 5px 0 #a84b7b;
}
.creator-flyer > .mono,.creator-bottom .mono { font-size:.66rem }
.creator-flyer h3 { margin:11px 0 14px;font-size:clamp(2.6rem,5.2vw,5.3rem);font-weight:950;line-height:.83;letter-spacing:-.045em;text-transform:uppercase }
.creator-flyer h3 span { display:inline-block;transform:rotate(-3deg);padding:1px 5px 6px;background:#261d2b;color:#fff1e7 }
.creator-flyer > p:not(.mono) { font-size:.88rem;font-weight:650 }
.creator-presets { display:grid;gap:6px;margin-top:16px }
.creator-presets button {
  display:flex;align-items:center;gap:10px;
  min-height:42px;padding:6px 9px;border:1px solid #3f2035;
  color:#251b28;background:#ffdcf0;text-align:left;
}
.creator-presets button span { font:700 .66rem ui-monospace,monospace }
.creator-presets button[aria-pressed=true] { background:#25202b;color:var(--acid);box-shadow:inset 3px 0 var(--acid) }
.creator-presets button:hover { border-color:#832252 }
.creator-drops :focus-visible { outline:3px solid #fff0df;outline-offset:2px }
.creator-monitor { align-self:center;border:1px solid #dc8cb67d;background:#14111a;box-shadow:0 10px 26px #08060a96 }
.creator-monitor-bar { display:flex;justify-content:space-between;gap:8px;padding:10px 12px;color:#c8f38d;font-size:.59rem }
.creator-screen { position:relative;isolation:isolate;overflow:hidden;aspect-ratio:16/9;background:#201529 }
.creator-screen img { width:100%;height:100%;object-fit:cover }
.creator-screen::before,.creator-screen::after { content:"";position:absolute;inset:0;z-index:1;pointer-events:none }
.creator-screen[data-effect=tape] img { filter:saturate(1.6) sepia(.32) contrast(1.12) }
.creator-screen[data-effect=tape]::before { background:linear-gradient(108deg,#ff382d8f,transparent 35% 75%,#ffae4b60);mix-blend-mode:screen }
.creator-screen[data-effect=tape]::after { background:repeating-linear-gradient(0deg,transparent 0 4px,#240b2d67 5px 6px) }
.creator-screen[data-effect=split] img { filter:contrast(1.28) saturate(1.4);transform:scale(1.04) }
.creator-screen[data-effect=split]::before { background:inherit;background-image:url("assets/district.jpg");background-size:cover;background-position:center;clip-path:polygon(0 39%,100% 39%,100% 47%,0 47%,0 63%,100% 63%,100% 69%,0 69%);transform:translateX(9px) scale(1.045);filter:hue-rotate(40deg) saturate(2) }
.creator-screen[data-effect=split]::after { background:linear-gradient(170deg,transparent 31%,#ff438067 31.3%,transparent 32%,transparent 65%,#6ffffc82 65.2%,transparent 66%);mix-blend-mode:screen }
.creator-screen[data-effect=chrome] img { filter:grayscale(1) contrast(1.54) brightness(1.13) }
.creator-screen[data-effect=chrome]::before { background:repeating-linear-gradient(102deg,transparent 0 32px,#fff8 33px,transparent 34px 61px);opacity:.4 }
.creator-screen[data-effect=chrome]::after { background:radial-gradient(circle,#fff5 0 1px,transparent 1.3px) 0 0 / 4px 4px;mix-blend-mode:overlay }
.creator-monitor figcaption { display:flex;align-items:center;justify-content:space-between;gap:8px 14px;padding:12px;flex-wrap:wrap }
.creator-monitor figcaption strong { color:var(--paper) }
.creator-monitor figcaption p { color:#e1cbd9;font-size:.78rem }
.creator-compare { min-height:38px;padding:5px 8px;color:var(--acid);border:1px solid #a6ce7780;background:#232421;font-size:.61rem }
.creator-bottom { display:grid;grid-template-columns:1fr 1fr;gap:18px 36px;margin-top:35px;padding-top:19px;border-top:1px dashed #eba4c18a }
.creator-bottom .mono { color:var(--acid) }
.creator-bottom h3 { margin:4px 0;font-size:clamp(1.2rem,2.6vw,1.8rem) }
.creator-bottom p:not(.mono) { color:#e5d4de;font-size:.88rem;max-width:45ch }
.creator-pitch { display:inline-flex;gap:8px;align-items:center;margin-top:10px;text-underline-offset:4px }
.creator-pitch svg { width:16px;height:16px }
@media(max-width:720px) {
  .creator-grid,.creator-bottom { grid-template-columns:minmax(0,1fr) }
  .creator-stamp { position:static;display:inline-block;margin-top:13px;transform:rotate(-3deg);font-size:.57rem }
  .creator-stamp span { display:inline;margin-left:3px }
}

.header-actions { display:flex;align-items:center;gap:7px }
.header-creator {
  display:flex;align-items:center;gap:6px;
  padding:7px 10px;
  color:#e8ff9d;
  background:#242a1e;
  border:1px solid #d0f17d83;
  border-radius:8px 3px;
  text-decoration:none;
  text-transform:uppercase;
  white-space:nowrap;
  letter-spacing:.06em;
  font-size:.64rem;
  box-shadow:2px 2px 0 #d971a270;
}
.header-creator svg { width:14px;height:14px;stroke-width:2 }
.header-creator:hover,.header-creator[aria-current] {
  color:#1b2017;
  background:#dfff80;
  border-color:#dfff80;
  box-shadow:2px 2px 0 #f0a2c4,0 0 16px #d9ff6e43;
}
@media(max-width:900px) {
  .header-creator { padding:7px 8px }
  .header-actions .header-map span { display:none }
}
@media(max-width:560px) {
  .navigator-edition { --head:92px }
  .navigator-edition .top {
    display:grid;
    grid-template-columns:1fr auto;
    grid-template-rows:auto auto;
    align-content:center;
    gap:5px 7px;
  }
  .navigator-edition .top .lockup span { display:inline }
  .navigator-edition .route-nav { grid-area:2 / 1 / 3 / -1;justify-content:space-around }
  .navigator-edition .top nav a { padding:4px 7px }
  .header-actions { grid-area:1 / 2 / 2 / 3 }
}

/* Night route flyer */
.map-dock {
  position:relative;isolation:isolate;overflow:hidden;
  padding-block:clamp(34px,6vw,83px);
  border-block:2px solid #d971a2;
  background:repeating-linear-gradient(128deg,transparent 0 58px,#ffb5d612 59px 60px,transparent 61px 97px),
    radial-gradient(ellipse at 75% 25%,#71284a 0%,transparent 55%),
    radial-gradient(ellipse at 10% 85%,#343c24,transparent 47%),#15111c;
}
.map-dock::before {
  content:"";position:absolute;z-index:-1;inset:0;pointer-events:none;
  background:radial-gradient(circle,#fff2 0 1px,transparent 1.3px) 0 0 / 5px 5px;
  mask-image:linear-gradient(127deg,#000,transparent 43%,transparent 66%,#000);
}
.dock-copy .mono,.hero-map .mono,.route-popup header .mono { color:#e1ff79 }
.motion-edition .dock-copy h2 { text-transform:uppercase;line-height:.86;font-weight:950 }
.dock-copy h2 em { color:#ffb3d0;text-shadow:3px 2px #883059 }
.navigator-edition .hero-map,.route-popup {
  background:#211725;
  border:1px solid #f1a9c8;
  border-radius:2px;
  box-shadow:5px 5px 0 #9c4873,0 15px 30px #08070c9c;
}
.map-header h2,.route-popup h2 { text-transform:uppercase;font-weight:900;letter-spacing:-.04em }
.map-sticker {
  color:#1d2017;background:#e1ff79;padding:5px 7px;transform:rotate(6deg);
  white-space:nowrap;font-size:.57rem;
}
.hero-map .map-sticker { color:#1d2017 }
.map-grid { border-color:#ed9fc88a;background:radial-gradient(circle,#e4abd820 0 1px,transparent 1.4px) 0 0 / 6px 6px,#241a2d }
.map-art .water { fill:#14121e;stroke:#c16caa }
.map-art .blocks { fill:#392941;stroke:#775267 }
.map-art .streets { stroke:#916b85 }
.map-art .road-edge { stroke:#311b33 }
.map-art .map-route { stroke:#ff9ac7;filter:drop-shadow(0 0 3px #ff3899) }
.map-grid b { border-radius:4px 1px;border-color:#ffabd1;background:#321e34 }
.map-grid a span { background:#251b29 }
.map-grid a:is(:hover,:focus-visible,[aria-current]) b { color:#232619;background:#e1ff79;border-color:#e1ff79;box-shadow:2px 2px #d971a2 }
.map-dock .text-action { color:#ffc8e1 }

/* Back Catalog */
.catalog-jump { margin-top:10px;color:#e1ff79 }
.back-catalog {
  --catalog-acid:#e1ff79;
  padding-block:clamp(48px,7vw,92px);
  background:radial-gradient(ellipse at 10% 0%,#2f3224,transparent 58%),
    repeating-linear-gradient(125deg,transparent 0 47px,#ffd1e011 48px 49px,transparent 50px 82px),#13131c;
  border-block:1px solid #a989a464;
}
.catalog-wrap { max-width:1210px }
.catalog-heading .mono,.catalog-kicker { color:var(--catalog-acid) }
.catalog-heading h2 { font-size:clamp(3.2rem,9vw,8rem);font-weight:950;line-height:.86;letter-spacing:-.062em;text-transform:uppercase;margin:10px 0 15px }
.catalog-heading em { color:#ffb3d0 }
.catalog-heading > p:last-child,.catalog-notes > p:not(.mono),.catalog-compare p { color:#e5d4de }
.catalog-bin { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(8px,2vw,22px);margin:25px 0 21px;padding-bottom:7px }
.catalog-sleeve {
  display:grid;gap:10px;align-content:space-between;text-align:left;min-width:0;
  min-height:clamp(145px,18vw,230px);padding:clamp(9px,2vw,24px);
  border:1px solid #ffd4e4;color:#191720;background:var(--sleeve);box-shadow:4px 4px 0 #121019;
}
.sleeve-damage { --sleeve:repeating-linear-gradient(123deg,#ffbad6 0 15px,#e793b7 16px 17px,#ffbad6 18px 27px) }
.sleeve-chrome { --sleeve:linear-gradient(136deg,#e7e5e8,#919aa4 44%,#f0f0eb 55%,#a8abae) }
.sleeve-pink { --sleeve:radial-gradient(circle,#622a7144 0 1px,transparent 1.6px) 0 0 / 5px 5px,#cfc0f5 }
.catalog-sleeve strong { font-size:clamp(.9rem,3.7vw,3.2rem);line-height:.89;letter-spacing:-.05em;text-transform:uppercase }
.catalog-sleeve .mono { font-size:clamp(.49rem,1.35vw,.7rem);letter-spacing:.055em }
.catalog-sleeve small { font-size:clamp(.62rem,1.35vw,.78rem);line-height:1.15;font-weight:750 }
.catalog-sleeve[aria-pressed=true] { outline:2px solid var(--catalog-acid);outline-offset:2px;box-shadow:5px 5px #a64273 }
.catalog-sleeve:hover { border-color:var(--catalog-acid) }
.catalog-desk { display:grid;grid-template-columns:minmax(0,1.4fr) minmax(0,1fr);gap:clamp(14px,3vw,36px);align-items:start }
.catalog-monitor { margin:0 }
.catalog-notes { padding:clamp(14px,2vw,26px);background:#211a27;border:1px solid #d094b85c }
.catalog-notes h3 { font-size:clamp(1.6rem,3vw,2.6rem);line-height:1.04;margin:7px 0 }
.catalog-notes p { font-size:.83rem }
.catalog-markers,.catalog-compare [role=group] { display:flex;flex-wrap:wrap;gap:7px;margin:11px 0 }
.catalog-markers { border-bottom:1px dashed #d094b880;padding-bottom:8px }
.catalog-markers button,.catalog-compare button {
  padding:6px 8px;min-height:38px;border:1px solid #cf9db778;
  color:#f6dce8;background:#17141d;font:700 .68rem ui-monospace,monospace;
}
.catalog-notes button[aria-pressed=true] { color:#24271b;background:var(--catalog-acid);border-color:var(--catalog-acid) }
.catalog-note-text { min-height:3.2em }
.catalog-compare { border-top:1px solid #d094b85c;margin-top:10px;padding-top:10px }
.catalog-compare h4 { margin:0;font-size:1rem }
@media(max-width:720px) { .catalog-desk { grid-template-columns:minmax(0,1fr) } }
@media(max-width:370px) { .catalog-bin { gap:6px } .catalog-sleeve { padding-inline:6px } }

/* Record shop display */
.catalog-shelf {
  margin:28px 0 24px;
  border:1px solid #a878938c;
  padding:0 clamp(10px,2vw,24px);
  background:linear-gradient(155deg,#49313d,#211a28 38%,#2f2231);
  box-shadow:inset 0 1px #f7b8d854,0 12px 28px #09070cc2;
}
.shelf-header {
  display:flex;
  justify-content:space-between;
  gap:10px;
  padding:11px 0;
  color:#e1ff79;
  font-size:clamp(.49rem,1.2vw,.68rem);
  letter-spacing:.09em;
}
.catalog-shelf .catalog-bin {
  align-items:end;
  margin:0;
  padding:clamp(9px,2vw,24px) clamp(5px,1.4vw,17px) 0;
  gap:clamp(8px,3.4vw,48px);
  border:1px solid #846173;
  border-bottom:0;
  background:repeating-linear-gradient(0deg,transparent 0 17px,#cfa6c00e 18px 19px),
    linear-gradient(#140f1b 0%,#2d202d 90%);
  box-shadow:inset 0 7px 14px #080609a6;
}
.catalog-shelf .catalog-sleeve {
  position:relative;
  z-index:1;
  justify-self:center;
  width:min(100%, 248px);
  min-height:0;
  aspect-ratio:1;
  padding:clamp(8px,1.55vw,19px);
  gap:5px;
  border-color:#fff0dfab;
  box-shadow:inset 0 0 0 1px #1e192029,3px 4px #0d0b11,8px 10px 18px #0a070dba;
  transform:translateY(2px) rotate(var(--lean));
  transform-origin:center bottom;
  transition:transform .2s ease,box-shadow .2s ease;
}
.catalog-shelf .catalog-sleeve::after {
  content:"";
  position:absolute;
  inset:5px;
  border:1px solid #291b2a38;
  pointer-events:none;
}
.catalog-shelf .sleeve-damage { --lean:-3deg }
.catalog-shelf .sleeve-chrome { --lean:2deg }
.catalog-shelf .sleeve-pink { --lean:-2deg }
.catalog-shelf .catalog-sleeve strong { font-size:clamp(.9rem,3vw,2.75rem) }
.catalog-shelf .catalog-sleeve:is(:hover,:focus-visible,[aria-pressed=true]) {
  z-index:3;
  transform:translateY(-7px) rotate(0);
}
.catalog-shelf .catalog-sleeve:focus-visible { outline:3px dashed #fff3e8;outline-offset:3px }
.shelf-rail {
  position:relative;
  z-index:2;
  display:grid;
  grid-template-columns:repeat(3,minmax(0,1fr));
  padding:8px 0 11px;
  border-top:3px solid #9a6e82;
  background:linear-gradient(#483240,#271d2b 70%,#211825);
  box-shadow:0 -2px 10px #0e0a1299;
  color:#f2c6dc;
  font-size:clamp(.46rem,1.15vw,.67rem);
  text-align:center;
  letter-spacing:.065em;
}
.shelf-rail span + span { border-left:1px solid #ac799382 }
@media(max-width:480px) {
  .catalog-shelf .catalog-sleeve { aspect-ratio:auto;min-height:112px }
  .catalog-shelf .catalog-sleeve small { font-size:.58rem }
}
@media(prefers-reduced-motion:reduce) {
  .catalog-shelf .catalog-sleeve { transition:none }
}
.catalog-shelf .catalog-bin {
  background:
    linear-gradient(90deg,transparent 33%,#a8789363 33.15%,#16111c 33.45%,transparent 33.7% 66.3%,#a8789363 66.5%,#16111c 66.75%,transparent 67%),
    repeating-linear-gradient(0deg,transparent 0 17px,#cfa6c00e 18px 19px),
    linear-gradient(#140f1b 0%,#2d202d 90%);
}

/* Monthly Cut */
.liner-notes {
  padding:9px 0;
  border-top:1px dashed #d094b85c;
  color:#e5d4de;
}
.liner-notes summary { color:#ffc8e1;font-weight:800;cursor:pointer }
.liner-notes p { margin-top:5px }
.monthly-cut {
  --monthly-lime:#e1ff79;
  padding-block:clamp(46px,7vw,94px);
  border-block:1px solid #e387a882;
  background:radial-gradient(ellipse at 70% 5%,#68223d88,transparent 58%),
    repeating-linear-gradient(128deg,transparent 0 63px,#ffc6db1a 64px 65px,transparent 66px 97px),#1a141f;
}
.monthly-wrap { max-width:1210px }
.monthly-grid { display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);align-items:center;gap:clamp(15px,4vw,52px) }
.monthly-poster {
  padding:clamp(20px,3vw,36px);
  border:1px solid #fcc1d9;
  background:repeating-linear-gradient(126deg,transparent 0 20px,#65274515 21px 22px,transparent 23px 31px),#ffb3d0;
  box-shadow:5px 6px 0 #a64f79;
  color:#231925;
}
.monthly-poster h2 {
  margin:13px 0;
  font-size:clamp(3.1rem,6.1vw,5.9rem);
  font-weight:950;line-height:.84;letter-spacing:-.068em;text-transform:uppercase;
}
.monthly-poster h2 em { display:inline-block;background:#221826;color:#ffebde;transform:rotate(-3deg);padding:0 .12em .08em }
.monthly-issue,.monthly-kicker,.monthly-format { font-size:.65rem;letter-spacing:.08em }
.monthly-issue { margin:17px 0 6px }
.monthly-poster h3 { font-size:clamp(1.4rem,3vw,2.4rem);line-height:1.05;margin:7px 0 }
.monthly-poster > p:not(.mono) { font-size:.9rem;font-weight:650 }
.monthly-rules { margin:13px 0;padding:0;list-style:none;font-size:.64rem;display:flex;flex-wrap:wrap;gap:5px 10px }
.monthly-rules li { border-top:1px solid #67234b;padding-top:4px }
.monthly-download {
  display:inline-flex;align-items:center;gap:8px;min-height:42px;padding:7px 10px;
  color:#202218;background:var(--monthly-lime);border:1px solid #312821;
  box-shadow:3px 3px #201925;text-decoration:none;font-size:.85rem;font-weight:850;
}
.monthly-download:hover { background:#f0ffa8 }
.monthly-download svg { width:18px;height:18px }
.monthly-format { margin-top:10px }
.replay-wall .monthly-kicker,.open-deck .monthly-kicker { color:var(--monthly-lime) }
.replay-wall h3,.open-deck h3 { font-size:clamp(1.8rem,4vw,3rem);line-height:1;margin:7px 0 }
.replay-wall > p:not(.mono),.open-deck p:not(.mono) { font-size:.88rem;color:#ebd8e4 }
.replay-choices { display:flex;flex-wrap:wrap;gap:6px;margin:14px 0 8px }
.replay-choices button {
  min-height:38px;padding:5px 8px;border:1px solid #d094b885;background:#221a29;color:#ffe9f3;font:700 .7rem ui-monospace,monospace;
}
.replay-choices button[aria-pressed=true] { background:var(--monthly-lime);border-color:var(--monthly-lime);color:#25291b }
.replay-monitor { border:1px solid #d094b86d;background:#13121b }
.replay-picture { overflow:hidden }
.replay-picture video { display:block;width:100%;height:auto;aspect-ratio:16/9;background:#100d17 }
.replay-picture[data-look=tape] video { filter:sepia(.47) saturate(1.68) contrast(1.12) }
.replay-picture[data-look=chrome] video { filter:grayscale(1) contrast(1.5) brightness(1.14) }
.replay-picture[data-look=split] video { filter:saturate(1.65) hue-rotate(24deg) contrast(1.25) }
.replay-monitor figcaption { padding:8px 10px;color:#f5b8d3;font-size:.63rem }
.replay-credit { margin-top:11px }
.open-deck {
  display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:8px 20px;
  padding:16px 20px;margin-top:clamp(27px,5vw,64px);border:1px dashed #df94b8;background:#19151f;
}
.open-deck h3 { font-size:clamp(1.5rem,3vw,2.2rem) }
.open-deck .text-action { margin:0;color:var(--monthly-lime);white-space:nowrap }
@media(max-width:760px) { .monthly-grid { grid-template-columns:minmax(0,1fr) } }

/* Signal Ward gig board */
.monthly-cut {
  --ink-flyer:#221a24;
  --stock:#efe2c9;
  --copy-grain:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 180 180'%3E%3Cfilter id='g'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.94' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' opacity='.32' filter='url(%23g)'/%3E%3C/svg%3E");
  background:radial-gradient(ellipse at 46% 2%,#402331,transparent 66%),#151119;
}
.monthly-wrap {
  padding:clamp(15px,3vw,42px);
  border:1px solid #8b655b;
  background:var(--copy-grain),radial-gradient(ellipse at 45% 30%,#5a4139,#31242b 85%);
  box-shadow:inset 0 0 0 4px #211920,inset 0 0 0 5px #745447,0 18px 36px #090609b8;
}
.notice-board-label {
  display:flex;justify-content:space-between;gap:8px;
  padding:7px 10px;margin-bottom:clamp(19px,3vw,42px);
  background:#261d23;color:#ffe3b9;border:1px solid #9a7760;
  text-transform:uppercase;font-size:.6rem;
}
.monthly-grid { align-items:start;gap:clamp(20px,3vw,46px) }
.monthly-poster,.replay-wall,.open-deck { position:relative }
.monthly-poster {
  padding:clamp(23px,3vw,37px);
  background:var(--copy-grain),linear-gradient(142deg,#f4e7cc,var(--stock) 64%,#d7bb9e);
  border:1px solid #c3a682;
  color:var(--ink-flyer);
  transform:rotate(-1.35deg);
  box-shadow:4px 8px 0 #17101765,7px 13px 20px #170e1495;
}
.monthly-poster::before,.replay-wall::before {
  content:"";
  position:absolute;z-index:1;top:6px;left:50%;
  width:9px;height:9px;border-radius:50%;
  background:radial-gradient(circle at 30% 25%,#ffe3c3,#dc6765 43%,#8a303d);
  box-shadow:2px 3px 3px #10080bb8;
  pointer-events:none;
}
.monthly-poster .monthly-kicker { display:table;padding:4px 6px;background:#241b23;color:#fce4ca }
.monthly-poster h2 { font-family:Impact,"Arial Black",system-ui,sans-serif;font-size:clamp(2.85rem,6.1vw,5.6rem);letter-spacing:-.037em;line-height:.89 }
.monthly-poster h2 em {
  background:#2b1c29;color:#ffb5d3;
  box-shadow:3px 2px #b74073;
  transform:rotate(-4deg);
}
.monthly-issue { font-weight:900;border-bottom:2px solid #a65f75;padding-bottom:6px }
.monthly-rules li { border-top-color:#594243 }
.flyer-tear {
  position:relative;margin:20px -4px -6px;padding:11px 9px 10px;
  border-top:2px dashed #442739;
  background:var(--copy-grain),#f5a7c7;
  box-shadow:2px 3px 0 #7c485d6f;
}
.flyer-tear .monthly-download { color:#f8e8d1;background:#282029;border-color:#241723;box-shadow:2px 2px #a74f79 }
.flyer-tear .monthly-download:hover { color:#22241a;background:var(--monthly-lime) }
.flyer-tear .monthly-format { font-size:.59rem }
.replay-wall {
  margin-top:16px;padding:clamp(15px,2.2vw,25px);
  color:#271d2a;background:var(--copy-grain),#ed9fc4;
  border:1px solid #f1b9cd;box-shadow:5px 8px 0 #1b141f6b,0 12px 20px #1a0c1594;
  transform:rotate(.85deg);
}
.replay-wall::before { left:62%;background:radial-gradient(circle at 30% 25%,#f4ffc9,#acbd5c 43%,#55642c) }
.replay-wall .monthly-kicker { color:#382735 }
.replay-wall h3,.open-deck h3 { font-weight:950;letter-spacing:-.055em }
.replay-wall > p:not(.mono) { color:#30212c }
.replay-monitor { border:5px solid #f5e8d4;box-shadow:1px 3px 0 #522c47 }
.replay-monitor figcaption { background:#f5e8d4;color:#3b2230 }
.open-deck {
  max-width:920px;margin-inline:auto;
  background:var(--copy-grain),#dce1a6;color:#27271e;border:1px solid #a0a56c;
  box-shadow:3px 6px #211820aa;transform:rotate(-.55deg);
}
.open-deck::before {
  content:"";position:absolute;top:-8px;left:49%;width:62px;height:16px;
  background:#f7e3bba3;transform:rotate(-7deg);pointer-events:none;
}
.open-deck .monthly-kicker,.open-deck p:not(.mono),.open-deck .text-action { color:#2e3120 }
.monthly-cut :is(a,button):focus-visible { outline:3px dashed #422343;outline-offset:3px }
@media(max-width:760px) {
  .monthly-grid { gap:18px }
  .monthly-poster,.replay-wall,.open-deck { transform:none }
  .monthly-poster h2 { font-size:clamp(2.55rem,9.4vw,4rem) }
  .replay-wall { margin-top:0 }
  .notice-board-label { padding-inline:6px }
}

/* Torn stage photograph behind the gig flyers */
.monthly-cut {
  position:relative;
  isolation:isolate;
  overflow:hidden;
  padding-top:clamp(88px,13vw,190px);
  background:#101014;
}
.monthly-cut::before {
  content:"";
  position:absolute;
  z-index:-1;
  inset:0;
  background:linear-gradient(0deg,#100e17e6,transparent 29%),var(--board-art,none) center top / cover no-repeat;
  pointer-events:none;
}
.monthly-wrap {
  background:linear-gradient(145deg,#131117a0,#15131b70);
  border-color:#e1d8c475;
  box-shadow:0 18px 36px #09060990;
}
.notice-board-label { background:#15131ae8;border-color:#c4b7a293 }
@media(max-width:760px) {
  .monthly-cut { padding-top:104px }
  .monthly-cut::before { background-size:auto 100%,auto 690px;background-position:center top }
}

/* First impressions and community tools */
.navigator-edition .hero-copy .tagline { font-size:clamp(.9rem,2.2vw,1.38rem);max-width:33ch }
.hero-primary { background:#e1ff79;color:#221a25;border-color:#e1ff79;box-shadow:3px 3px #ad4a7b }
.hero-primary:hover { background:#f0ffab;color:#221a25 }
.front-drop { padding:20px 0;border-block:1px solid #e48ab6;background:linear-gradient(105deg,#2f2030,#191522 62%) }
.front-drop-row { display:grid;grid-template-columns:1fr minmax(110px,.48fr) auto;align-items:center;gap:clamp(8px,2.5vw,34px) }
.front-drop .mono { color:#e1ff79;font-size:.63rem }
.front-drop h2 { font-weight:950;font-size:clamp(1.35rem,4vw,3.4rem);line-height:1;letter-spacing:-.05em }
.front-drop p:last-child { color:#efcfdf;font-size:.78rem;margin-top:4px }
.front-drop .front-screen { width:100%;max-width:240px;border:1px solid #da86b4 }
.front-drop-controls { display:flex;align-items:start;flex-direction:column;gap:4px }
.front-look,.weekly-grid button {
  min-height:40px;padding:5px 9px;border:1px solid #dd89b0;background:#271b2a;color:#ffe4ed;font-weight:750;font-size:.78rem;
}
.front-look:hover,.weekly-grid button:hover { background:#442638 }
.front-drop .text-action,.replay-wall .text-action { margin-top:0 }
.replay-wall .text-action { color:#382735;text-decoration:underline }
.section-head,.studio-grid { color:#fff0df }
.tour-stage,.tool-list button { border-color:#90b7bc57 }
.route-hud.community-visible .route-pager { display:none }
.route-hud.community-visible { pointer-events:none }
.route-hud.community-visible .route-popup { pointer-events:auto }
.cut-card-lab,.weekly-wall {
  margin-top:clamp(22px,4vw,50px);padding:clamp(16px,3vw,35px);
  border:1px solid #cf92ad;background:#1c1723f5;color:#ffede5;
}
.cut-card-lab { display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);align-items:center;gap:clamp(15px,4vw,50px) }
.cut-card-copy h3,.weekly-wall h3 { font-size:clamp(1.6rem,4.2vw,3.45rem);font-weight:950;line-height:.96;letter-spacing:-.05em;margin:8px 0 10px }
.cut-card-copy > p:not(.mono),.weekly-wall p { color:#ebd5e1;font-size:.89rem }
.cut-card-copy .incoming-cut { padding:6px 8px;margin-top:8px;border-left:2px solid #e1ff79;background:#2e2432 }
.cut-fields { display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:15px 0 }
.cut-fields label,.affiliate-pass label { display:grid;gap:5px;color:#f8cedf;font-size:.76rem;font-weight:750 }
.cut-fields :is(input,select),.affiliate-pass input,.cut-card-lab input[readonly],.drop-release input,.weekly-wall input {
  width:100%;min-width:0;border:1px solid #d089af;border-radius:0;background:#171520;color:#fff0e6;font:inherit;padding:7px 8px;
}
.cut-fields .cut-range { grid-column:1/-1;grid-template-columns:1fr auto }
.cut-range input { grid-column:1/-1;padding:4px 0;accent-color:#e1ff79 }
.cut-actions,.drop-actions { display:flex;flex-wrap:wrap;gap:8px;align-items:center }
.share-status,#drop-status,#weekly-status { min-height:1.5em;margin-top:9px;color:#e1ff79;font-size:.66rem }
.cut-card-preview { display:flex;justify-content:center;gap:9px }
.cut-card-preview figure { width:min(100%,220px);min-width:0 }
.cut-card-preview canvas { display:block;width:100%;height:auto;background:#2d2333;box-shadow:4px 5px #111018 }
.cut-card-preview figcaption { color:#e1ff79;font-size:.59rem;margin-top:8px }
.weekly-grid { display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px;margin-top:12px }
.weekly-grid article { background:#2a202e;padding:10px;border-top:2px solid #ed96bf }
.weekly-grid h4 { margin:6px 0;font-size:1rem }
.weekly-grid article a { display:inline-block;margin:7px 5px 7px 0;color:#e1ff79;font-size:.78rem }
.weekly-grid button { font-size:.69rem;min-height:34px }
.release-screen { width:min(100%,600px);margin:15px 0;border:1px solid #da86b4 }
.drop-release .drop-actions .text-action { margin:0 }
.drop-release h2 { font-size:clamp(2.6rem,9vw,7rem);line-height:.9;margin:10px 0 }
.drop-release p { max-width:59ch }
.affiliate {
  position:relative;isolation:isolate;overflow:hidden;padding:clamp(50px,8vw,104px) 0;
  border-block:2px solid #ed80ac;
  background:radial-gradient(ellipse at 78% 28%,#502049 0%,transparent 49%),
    repeating-linear-gradient(0deg,transparent 0 3px,#ff9bd012 4px 5px),#13101b;
}
.affiliate::before {
  content:"";position:absolute;inset:-12% -12%;z-index:-1;pointer-events:none;
  background:repeating-linear-gradient(135deg,transparent 0 60px,#f97cb139 61px 62px,transparent 63px 90px);
  mask-image:linear-gradient(90deg,transparent 40%,#000 100%);
}
.affiliate-wrap { max-width:1210px }
.affiliate-heading .mono,.affiliate-steps .mono { color:#e1ff79;font-size:.67rem }
.affiliate-live { display:inline-block;width:8px;height:8px;margin-right:5px;background:#e1ff79;box-shadow:0 0 14px #e1ff79 }
.affiliate-heading h2 {
  margin:12px 0 15px;font-size:clamp(3rem,9vw,8.2rem);font-weight:950;
  text-transform:uppercase;line-height:.83;letter-spacing:-.06em;color:#ffeadf;
}
.affiliate-heading h2 em { color:#ffb5d3;text-shadow:3px 2px #91365e,-2px -1px #65e6c970 }
.affiliate-heading > p:last-child { color:#f4d6e6;max-width:57ch }
.affiliate-grid { display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);gap:clamp(12px,4vw,50px);align-items:start;margin-top:25px }
.affiliate-steps { list-style:none;padding:0;margin:0;display:grid;gap:8px }
.affiliate-steps li { display:flex;gap:11px;align-items:start;padding:clamp(10px,2vw,19px);background:#22192a;border:1px solid #d878a86a }
.affiliate-steps li svg { flex:0 0 34px;width:34px;height:34px;color:#ffb6d1 }
.affiliate-steps h3 { margin:3px 0;font-size:clamp(1.15rem,2.6vw,1.85rem);line-height:1 }
.affiliate-steps p,.pass-note { color:#ead0df;font-size:.82rem }
.affiliate-pass { border:1px solid #ed9ec6;background:#291d32;padding:clamp(12px,2.5vw,25px);box-shadow:5px 6px #8a4168 }
.pass-band { display:flex;justify-content:space-between;gap:6px;padding:7px 8px;background:#e1ff79;color:#241d2a;font-size:.61rem }
.affiliate-pass > .mono { color:#efb7d5;font-size:.61rem }
.pass-signal { display:block;width:100%;height:58px;color:#ff9fc9;filter:drop-shadow(2px 1px #5bd8c8) }
.affiliate-pass h3 { font-size:clamp(1.3rem,3vw,2.25rem);margin:4px 0 7px }
.affiliate-pass label { margin-bottom:4px }
.pass-code { display:flex;justify-content:space-between;gap:5px;align-items:center;margin:8px 0;padding:5px 7px;background:#14101d;border:1px dashed #eeb5d0 }
.pass-code output { min-width:0;overflow-wrap:anywhere;color:#e1ff79;font:800 clamp(.72rem,2vw,1.1rem) ui-monospace,monospace }
.pass-code button { min-height:34px;color:#251b28;background:#f6afd1;border:0;padding:4px 9px;font-weight:800 }
.pass-barcode { height:17px;margin-top:10px;background:repeating-linear-gradient(90deg,#edafd0 0 2px,transparent 2px 5px,#edafd0 5px 6px,transparent 6px 11px);opacity:.67 }
.affiliate-apply { display:inline-flex;align-items:center;gap:9px;margin-top:21px;padding:10px 14px;color:#252220;background:#e1ff79;font-weight:900;text-decoration:none;box-shadow:3px 3px #db8eb4 }
.affiliate-apply:hover { background:#f2ffa7 }
@media(max-width:760px) {
  .cut-card-lab,.affiliate-grid { grid-template-columns:minmax(0,1fr) }
  .weekly-grid { grid-template-columns:minmax(0,1fr) }
  .front-drop-row { grid-template-columns:1fr minmax(92px,.5fr) }
  .front-drop-controls { grid-column:1/-1;flex-direction:row;align-items:center;gap:8px }
}
@media(max-width:560px) {
  .navigator-edition { --head:58px }
  .navigator-edition .top { display:flex;justify-content:space-between }
  .navigator-edition .route-nav { display:none }
  .navigator-edition .hero-layout { padding-block:35px 64px }
  .navigator-edition .hero-copy .location { display:none }
  .navigator-edition .hero { min-height:0 }
  .navigator-edition .hero-copy h1 { font-size:clamp(2.4rem,10.6vw,3.9rem) }
  .hero-release span { display:none }
  .navigator-edition .hero-end { bottom:12px }
}

/* Site polish */
.top :is(.header-creator,.header-map) { min-height:40px }
.hero-workflow {
  display:table;
  margin-top:11px;
  color:#ffe4de;
  font-size:.82rem;
  text-underline-offset:4px;
}
.navigator-edition .hero[data-art=campaign] .hero-workflow { visibility:hidden }
.navigator-edition .hero-copy .tagline { font-weight:660;line-height:1.25 }
.navigator-edition .hero-primary { min-height:46px }
.hero-lineup figcaption { margin-top:11px;color:#ffe8de }
.front-drop {
  position:relative;
  background:linear-gradient(107deg,#372033 0%,#211b28 56%,#171621);
}
.front-drop-row { grid-template-columns:minmax(0,1fr) minmax(135px,.57fr) auto }
.front-drop h2 { margin-top:3px }
.front-drop .front-screen { max-width:275px;box-shadow:3px 3px #a64b77 }
.front-screen figcaption {
  position:absolute;
  z-index:2;
  left:5px;
  bottom:5px;
  padding:3px 5px;
  color:#e1ff79;
  background:#17131ce8;
}
.front-drop-controls .text-action { padding-block:5px }
.creator-lede { max-width:48ch;color:#eddae1 }
.creator-index { display:flex;flex-wrap:wrap;gap:6px;margin-top:15px }
.creator-index a {
  display:inline-flex;
  align-items:center;
  gap:8px;
  min-height:39px;
  padding:4px 10px;
  border:1px solid #d58cb37d;
  color:#fbe1eb;
  background:#241927;
  font-size:.82rem;
  font-weight:730;
  text-decoration:none;
}
.creator-index a:hover { border-color:#e1ff79;background:#302535 }
.creator-index span { color:#e1ff79;font-size:.6rem }
.creator-header h2,.catalog-heading h2 { text-wrap:balance }
.affiliate-heading h2 { max-width:13ch }
:is(.terminal,.tour,.studio,.heights) .arrival { margin-bottom:clamp(22px,4vw,52px) }
:is(.terminal,.tour,.studio,.heights)::after {
  background:linear-gradient(90deg,#12141eef 0%,#12141eca 44%,#14142148 100%),
    linear-gradient(0deg,#10121bf5 0%,transparent 38%);
}
.city-edition .tour-stage {
  background:linear-gradient(125deg,#171e2af7,#151620fa);
  box-shadow:0 17px 36px #08091175;
}
.terminal .studio-copy,.studio .studio-copy { max-width:620px }
:is(.terminal,.studio) .tool-list button {
  border-color:#9ca5b456;
  background:#171823;
}
:is(.terminal,.studio) .tool-list button[aria-pressed=true] { border-color:var(--mint);background:#262535 }
.footer-top { display:inline-flex;align-items:center;gap:4px;color:#e7bdce;white-space:nowrap;text-underline-offset:4px }
.footer-top svg { width:13px;height:13px }
@media(min-width:1020px) {
  .navigator-edition .hero { aspect-ratio:auto;min-height:clamp(590px,calc(88svh - var(--head)),815px) }
  .navigator-edition .hero[data-art=campaign] { aspect-ratio:1672 / 941;min-height:0 }
}
@media(max-width:760px) {
  .front-drop-row { grid-template-columns:minmax(0,1fr) minmax(92px,.54fr) }
  .cut-fields :is(input,select),.affiliate-pass input { font-size:16px }
  .creator-index a { min-height:44px }
}
@media(max-width:560px) {
  .navigator-edition .hero-layout { padding-top:29px }
  .hero-workflow { margin-top:8px;font-size:.77rem }
  .front-drop { padding-block:13px }
  .front-drop .front-screen { max-width:160px }
  .front-drop-controls .text-action { font-size:.76rem }
  .footer-top { font-size:.58rem }
  .footer-top svg { width:11px;height:11px }
}
@media(max-width:1019px) {
  .navigator-edition .hero { aspect-ratio:auto }
}
@media(max-width:800px) {
  .navigator-edition .hero-layout { padding-bottom:90px }
}

/* Motion between chapters */
.device-cascade .lineup-tablet { translate:calc(var(--settle,0) * 13px) calc(var(--settle,0) * -9px) }
.device-cascade .lineup-fold { translate:calc(var(--settle,0) * -14px) calc(var(--settle,0) * 9px) }
.device-cascade .lineup-phone { translate:calc(var(--settle,0) * 16px) calc(var(--settle,0) * 6px) }
.route-handoff {
  height:32px;overflow:hidden;background:#1d1624;
  box-shadow:inset 0 1px #ff9acd27;
}
.route-handoff svg { display:block;width:100%;height:100%;overflow:visible }
.route-handoff path {
  fill:none;stroke:#ff9ecb;stroke-width:2;vector-effect:non-scaling-stroke;
  stroke-dasharray:1;stroke-dashoffset:calc(1 - var(--splice-travel,0));
  filter:drop-shadow(0 0 4px #ff59a8);
}
.hero-map .map-route { opacity:calc(.28 + var(--map-travel,1) * .72) }
.workflow-story { --workflow-step:0 }
.workflow-rail { display:none }
.workflow-playhead {
  position:relative;height:3px;margin:-23px 0 23px;background:#a0ddd334;
}
.workflow-playhead i {
  position:absolute;top:0;bottom:0;left:0;width:calc(25% * (var(--workflow-step) + 1));
  background:linear-gradient(90deg,#79dcc9,#f2a2c6);
  box-shadow:0 0 7px #88e8d5a3;
  transition:width .28s ease;
}
.workflow-playhead i::after {
  content:"";position:absolute;right:0;top:-3px;width:3px;height:9px;
  background:#fff1e3;
}
#tour { overflow:clip }
.workflow-story.scroll-story {
  --story-stage:clamp(535px,68vh,620px);
  --story-travel:clamp(260px,44vh,410px);
  display:grid;grid-template-columns:minmax(102px,.25fr) minmax(0,1fr);
  gap:clamp(12px,2.4vw,30px);min-height:calc(var(--story-stage) + var(--story-travel));
}
.scroll-story .tour-stage {
  position:sticky;top:calc(var(--head) + 14px);align-self:start;
  min-height:var(--story-stage);
}
.scroll-story .stage-detail { padding:clamp(18px,2.7vw,40px) }
.scroll-story .stage-image img { max-height:min(53vh,490px);width:auto }
.scroll-story .workflow-rail {
  list-style:none;margin:0;padding:18px 0 0 13px;
  display:grid;grid-template-rows:repeat(4,calc(var(--story-travel) / 3));
  color:#d4bfc9;border-left:1px solid #b5b1b858;
}
.workflow-rail li { align-self:start;white-space:nowrap }
.workflow-rail b { display:inline-block;margin-right:4px;color:#f8b3d2 }
.workflow-rail .step-lit { color:#b6ffe7 }
.sleeve-slot { position:relative;min-width:0;display:grid;justify-items:center;isolation:isolate }
.sleeve-vinyl {
  position:absolute;z-index:0;top:7%;right:12%;width:min(62%,168px);aspect-ratio:1;border-radius:50%;
  border:1px solid #b99aa8;
  background:radial-gradient(circle,#130e18 0 4%,#e0ff79 5% 11%,#a65480 12% 16%,transparent 17%),
    repeating-radial-gradient(circle,#322837 0 1px,#18141d 2px 4px);
  box-shadow:3px 5px 10px #0b0711bd;
  transform:translateX(-18%) scale(.88);opacity:0;
  transition:transform .32s ease,opacity .22s ease;
}
.sleeve-slot:has(.catalog-sleeve[aria-pressed=true]) .sleeve-vinyl { transform:translateX(31%) scale(1);opacity:1 }
.sleeve-slot .catalog-sleeve[aria-pressed=true] { transform:translate(-5%,-10px) rotate(-1deg) }
.monthly-poster.flyer-landed { animation:flyer-land .64s cubic-bezier(.23,.68,.31,1) both }
.replay-wall.flyer-landed { animation:flyer-land .54s .12s cubic-bezier(.23,.68,.31,1) both }
@keyframes flyer-land {
  0% { translate:0 -26px;rotate:-2deg;opacity:.68 }
  72% { translate:0 3px;rotate:.5deg }
  100% { translate:0 0;rotate:0deg;opacity:1 }
}
.atmosphere-paused .device-cascade :is(.lineup-device,.lineup-phone) { translate:none }
.atmosphere-paused .route-handoff path { stroke-dashoffset:0 }
.atmosphere-paused .hero-map .map-route { opacity:1;animation:none }
.atmosphere-paused .workflow-playhead i,.atmosphere-paused .sleeve-vinyl,.atmosphere-paused .catalog-sleeve { transition:none }
.atmosphere-paused .flyer-landed { animation:none }
@media(max-width:650px) {
  .workflow-playhead { margin-top:-11px;margin-bottom:14px }
  .device-cascade :is(.lineup-device,.lineup-phone) { translate:0 calc(var(--settle,0) * 4px) }
  .route-handoff { height:23px }
  .sleeve-slot:has(.catalog-sleeve[aria-pressed=true]) .sleeve-vinyl { transform:translateX(24%) }
  .monthly-poster.flyer-landed,.replay-wall.flyer-landed { animation-duration:.34s }
}
@media(prefers-reduced-motion:reduce) {
  .device-cascade :is(.lineup-device,.lineup-phone) { translate:none }
  .route-handoff path { stroke-dashoffset:0 }
  .hero-map .map-route { opacity:1 }
  .workflow-playhead i,.sleeve-vinyl,.catalog-sleeve { transition:none }
  .monthly-poster.flyer-landed,.replay-wall.flyer-landed { animation:none }
}

/* Six-second sample and the final route stop */
.session-picture {
  position:relative;width:100%;aspect-ratio:16 / 9;max-height:155px;margin-top:9px;overflow:hidden;
  border:1px solid #9dc4c740;background:#090a12;
}
.session-picture :is(img,video) { width:100%;height:100%;object-fit:cover;object-position:center }
.session-ruler {
  margin-top:9px;font-size:.68rem;letter-spacing:.06em;font-variant-numeric:tabular-nums;
}
.session-track { height:18px;position:relative;margin:2px 10px 8px;isolation:isolate }
.session-track::before {
  content:"";position:absolute;inset:6px -3px;background:repeating-linear-gradient(90deg,#71959d28 0 1px,transparent 1px 16.67%),#0f1722;
  border-block:1px solid #9bbabc45;
}
.session-fill { position:absolute;top:8px;height:2px;width:var(--session-progress,0%);background:var(--mint);box-shadow:0 0 7px #8af2d885 }
.session-pin {
  position:absolute;left:var(--mark-position);top:50%;transform:translate(-50%,-50%);width:28px;height:28px;
  border:0;background:none;display:grid;place-items:center;
}
.session-pin::before {
  content:"";width:10px;height:10px;transform:rotate(45deg);background:#ffa4c4;border:1px solid #ffe7ee;
  box-shadow:0 0 8px #ff81b8ac;
}
.session-demo .demo-result { min-height:2.7em;margin:0 }
.launch-stop { position:relative;margin-top:clamp(52px,8vw,105px);padding-bottom:clamp(44px,6vw,80px) }
.launch-ticket {
  position:relative;isolation:isolate;display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;
  gap:clamp(15px,3vw,36px);padding:clamp(20px,4vw,50px);border:1px solid #edbdbb72;
  background:radial-gradient(ellipse at 10% 5%,#82504955,transparent 62%),linear-gradient(115deg,#221824,#171622 72%);
  box-shadow:0 16px 38px #08061196;
}
.launch-ticket::before { content:"";position:absolute;inset:0 0 auto;height:2px;background:var(--prism) }
.launch-ticket>img { width:clamp(56px,7vw,82px);border-radius:18%;border:1px solid #ffc3aa80 }
.launch-copy .chapter { color:#ffd2af }
.launch-copy h2 { margin:3px 0 6px;font-size:clamp(1.8rem,4vw,3.4rem);letter-spacing:-.047em;line-height:1.05 }
.launch-copy p:last-child { margin:0;color:var(--quiet);max-width:43ch }
.launch-action { display:grid;justify-items:start;gap:5px }
.launch-action .action { margin:0 }
.launch-action small { color:var(--quiet) }
@media(max-width:720px) {
  .launch-ticket { grid-template-columns:auto minmax(0,1fr);align-items:start }
  .launch-action { grid-column:1/-1 }
}

.hero-art picture { display:block;height:100% }
.scroll-story .stage-detail h3 { font-size:clamp(30px,3.05vw,46px);margin-block:7px 11px }
.scroll-story .stage-detail .tab-row { margin-bottom:18px }
.scroll-story .session-demo { margin-top:16px;padding:12px }
.scroll-story #stage-next { margin-top:12px }

/* Backstage pass in the site navigation */
.header-crew {
  display:inline-flex;align-items:stretch;flex:none;min-height:44px;
  color:#231521;background:linear-gradient(105deg,#f794b8,#ffd0c9 68%,#ffc6db);
  border:1px solid #ffcde3;border-radius:4px 9px 4px 9px;
  text-decoration:none;white-space:nowrap;box-shadow:2px 2px 0 #a84671;
  transition:box-shadow .2s,background-color .2s;
}
.crew-stub {
  position:relative;display:grid;place-items:center;width:31px;
  border-right:1px dashed #59233b9c;
}
.crew-stub::before,.crew-stub::after {
  content:"";position:absolute;right:-4px;width:7px;height:7px;
  border-radius:50%;background:#15101b;
}
.crew-stub::before { top:-4px }
.crew-stub::after { bottom:-4px }
.crew-stub svg { width:17px;height:17px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linejoin:round;stroke-linecap:round }
.crew-label { display:grid;align-content:center;gap:2px;padding:0 11px;line-height:1 }
.crew-label small { font-size:.5rem;letter-spacing:.11em;color:#57263e }
.crew-label strong { font-size:.76rem;font-weight:850 }
.header-crew:is(:hover,:focus-visible,[aria-current]) {
  background:#ffe0d3;box-shadow:2px 2px 0 #d15c8c,0 0 16px #f393bd6b;
}
.header-crew:focus-visible { outline:2px solid var(--cream);outline-offset:3px }
@media(max-width:650px) {
  .crew-label { padding-inline:7px }
  .crew-label small { display:none }
  .crew-label strong { font-size:.7rem }
  .crew-stub { width:25px }
  .crew-stub svg { width:15px;height:15px }
}
@media(max-width:375px) {
  .top .header-creator { min-width:42px;justify-content:center }
  .header-creator span { display:none }
}
@media(prefers-reduced-motion:reduce) {
  .header-crew { transition:none }
}
@media(max-width:350px) {
  .navigator-edition .top .lockup span { display:none }
  .top .header-map { min-width:42px;justify-content:center }
}

/* Light spills from the hero hardware and route markers. */
.hero-lineup::before {
  inset:0 -8% -2%;
  background:
    radial-gradient(ellipse at 29% 30%,#42dcff66 0%,#446eff35 22%,transparent 49%),
    radial-gradient(ellipse at 85% 55%,#ff4b9f68 0%,#d645ab36 22%,transparent 45%),
    radial-gradient(ellipse at 48% 84%,#ff9d7356 0%,transparent 48%);
  filter:blur(12px);
  opacity:.85;
}
.hero.in-scene .hero-lineup::before {
  animation:hero-bloom 7s ease-in-out infinite alternate;
}
@keyframes hero-bloom {
  from { opacity:.76 }
  to { opacity:1 }
}
.hero-energy {
  position:absolute;z-index:-1;inset:0;width:100%;height:100%;
  pointer-events:none;overflow:visible;opacity:.82;
}
.hero-energy path { fill:none;stroke-width:1.5;stroke-linecap:round;vector-effect:non-scaling-stroke }
.energy-cyan { stroke:#98edff;filter:drop-shadow(0 0 4px #35caff) drop-shadow(0 0 10px #35caff) }
.energy-pink { stroke:#ffc3db;filter:drop-shadow(0 0 4px #ff398c) drop-shadow(0 0 10px #ff398c) }
.hero-icon {
  box-shadow:0 7px 30px #070712be,0 0 20px #ff66914d;
}
.hero-primary { box-shadow:3px 3px #ad4a7b,0 0 23px #dfff7942 }
.hero-lineup figcaption span { box-shadow:0 0 8px #ff559c,0 0 15px #ff559c }
.header-crew { box-shadow:2px 2px 0 #a84671,0 0 15px #f393bd3b }
.navigator-edition .hero-map {
  box-shadow:5px 5px 0 #9c4873,0 15px 30px #08070c9c,0 0 33px #ed4e9e36;
}
.hero-map .map-sticker { box-shadow:0 0 13px #ddff7955 }
.launch-ticket::before {
  background:linear-gradient(90deg,#ff80ad 0%,#ffb6a4 15%,#f4c4a128 40%,#68e8ff18 65%,#7be9d8);
  box-shadow:0 0 15px #ff78a866;
}
.atmosphere-paused .hero.in-scene .hero-lineup::before { animation:none }
@media(max-width:800px) {
  .hero-lineup::before { inset:3% -3% 0;filter:blur(9px) }
  .hero-energy { opacity:.6 }
}
@media(prefers-reduced-motion:reduce) {
  .hero.in-scene .hero-lineup::before { animation:none }
}

.motion-edition .city-stop:not(.in-scene)::before,
.hero-map:not(.in-scene) .map-route { animation-play-state:paused }

@media (max-width:800px), (hover:none) and (pointer:coarse) {
  .after-dark .hero-art .harbor-art { transform:scale(1.06);transition:none }
  .motion-edition .district-art,
  .phone-rig { transform:none;transition:none }
  .motion-edition .city-stop::before,
  .atmosphere span,
  .hero.in-scene .hero-lineup::before,
  .map-art .map-route { animation:none }
  .motion-edition .city-stop::before { opacity:.55;mix-blend-mode:normal }
  .motion-edition .hero[data-art=campaign]::before { opacity:0 }
  .atmosphere :is(.vapor,.wash) { opacity:.5;mix-blend-mode:normal }
  .atmosphere .streaks { display:none }
  .device-cascade :is(.lineup-device,.lineup-phone) { translate:none }
  .hero-lineup::before { filter:none }
  .route-handoff path { stroke-dashoffset:0 }
  .hero-map .map-route { opacity:1 }
  .navigator-edition .top,.route-pager,.route-popup { backdrop-filter:none }
  .navigator-edition .top { background:#100e17 }
}

@media(max-width:560px) {
  .navigator-edition { --head:104px }
  .navigator-edition .top {
    display:grid;grid-template-columns:minmax(0,1fr);
    grid-template-rows:29px 44px;gap:8px;
    align-content:center;padding-inline:max(12px,env(safe-area-inset-left)) max(12px,env(safe-area-inset-right));
  }
  .navigator-edition .top .lockup span { display:inline }
  .header-actions {
    grid-area:2 / 1;
    display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 44px;gap:7px;
  }
  .top :is(.header-creator,.header-crew,.header-map) { min-width:0;min-height:44px;justify-content:center }
  .header-creator span { display:inline;white-space:normal;text-align:center;line-height:1.15 }
  .header-creator svg { flex:none }
  .crew-label strong { white-space:normal;line-height:1.1 }
}