@import url("/design-tokens.css");

:root {
  --black: #07090c;
  --panel: #11151a;
  --concrete: #aeb2b6;
  --white: #f3f4f2;
  --orange: var(--bryk-orange);
  --pink: var(--bryk-pink);
  --lime: var(--bryk-lime);
  --cyan: var(--bryk-cyan);
  --line: var(--bryk-line);
  color-scheme: dark;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
#map,#districts,#tour,#collection,#city-wall { scroll-margin-top:126px; }
body {
  margin: 0;
  min-width: 0;
  overflow-x: hidden;
  color: var(--white);
  background: radial-gradient(circle at 72% -8%, rgba(255,106,0,.14), transparent 31rem), linear-gradient(180deg, #0d1115, #06080a 78%);
  font-family: "Arial Narrow", "Roboto Condensed", Impact, system-ui, sans-serif;
  letter-spacing: .035em;
}
button, a { font: inherit; }
button { color: inherit; }
button:focus-visible, a:focus-visible { outline: 2px solid var(--lime); outline-offset: 3px; }
.site-shell { min-height: 100vh; overflow-x:clip; background-image: linear-gradient(rgba(255,255,255,.014) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.014) 1px, transparent 1px); background-size: 24px 24px; }

.cinematic-hero { position:relative; height:calc(100svh - 109px); min-height:560px; overflow:hidden; isolation:isolate; background:#020407; }
.hero-film,.hero-final-frame { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; }
.hero-film { z-index:0; opacity:0; filter:saturate(1.13) contrast(1.04) brightness(1.04); image-rendering:auto; animation:none; transform:none; transition:opacity .8s ease; backface-visibility:hidden; }
.cinematic-hero.is-film-started .hero-film { opacity:1; }
.hero-video-brand { position:absolute; z-index:5; left:50%; top:48%; width:min(352px,34vw); margin:0; opacity:0; pointer-events:none; transform:translate(-50%,-50%) scale(.88) rotate(-1deg); filter:drop-shadow(0 10px 3px rgba(0,0,0,.86)) drop-shadow(0 0 22px rgba(255,106,0,.28)); }
.hero-video-brand img { display:block; width:100%; height:auto; }
.hero-video-brand span { position:absolute; left:50%; top:calc(100% + 4px); width:max-content; padding:6px 9px; color:#07090b; background:rgba(185,242,39,.88); font:1000 7px/1 system-ui,sans-serif; letter-spacing:.13em; transform:translateX(-50%) rotate(-1deg); box-shadow:4px 4px 0 rgba(0,0,0,.72); }
.cinematic-hero.is-film-started .hero-video-brand { animation:videoBrandReveal 2.3s cubic-bezier(.2,.72,.2,1) both; }
.cinematic-hero.is-complete .hero-video-brand { opacity:0; animation:none; }
.hero-wall-intro { position:absolute; z-index:10; inset:0; overflow:hidden; pointer-events:none; background:#080705; perspective:1000px; }
.wall-surface,.wall-piece { position:absolute; inset:-1px; background:url("/assets/brand/bryk-brick-wall-intro-v1.webp") center/cover no-repeat; transform:translate3d(0,0,0); will-change:transform,opacity; }
.wall-surface { z-index:0; }
.wall-piece { z-index:1; }
.wall-piece--1 { clip-path:polygon(0 0,54% 0,51% 29%,45% 49%,0 46%); }
.wall-piece--2 { clip-path:polygon(52% 0,100% 0,100% 46%,58% 49%,50% 30%); }
.wall-piece--3 { clip-path:polygon(0 43%,45% 46%,51% 51%,43% 67%,0 74%); }
.wall-piece--4 { clip-path:polygon(100% 43%,58% 46%,50% 51%,58% 68%,100% 75%); }
.wall-piece--5 { clip-path:polygon(0 71%,44% 64%,51% 50%,53% 100%,0 100%); }
.wall-piece--6 { clip-path:polygon(100% 71%,57% 64%,50% 50%,49% 100%,100% 100%); }
.wall-graffiti-layer { position:absolute; z-index:3; inset:0; overflow:hidden; pointer-events:none; mix-blend-mode:screen; }
.wall-graffiti-layer span { --tag-color:var(--orange); position:absolute; display:block; opacity:0; color:var(--tag-color); font:italic 1000 clamp(18px,2.8vw,44px)/.82 Impact,"Arial Black",system-ui,sans-serif; letter-spacing:-.035em; text-transform:uppercase; -webkit-text-stroke:1px rgba(255,255,255,.1); text-shadow:3px 4px 0 rgba(0,0,0,.78),0 0 15px color-mix(in srgb,var(--tag-color) 38%,transparent); transform:rotate(-8deg) skewX(-8deg); }
.wall-graffiti-layer span::after { content:""; position:absolute; z-index:-1; inset:-.22em -.3em; opacity:.3; background:radial-gradient(circle at 3% 15%,var(--tag-color) 0 2px,transparent 3px),radial-gradient(circle at 92% 83%,var(--tag-color) 0 3px,transparent 4px),linear-gradient(96deg,transparent 0 2%,var(--tag-color) 8% 91%,transparent 98%); clip-path:polygon(0 28%,7% 10%,20% 22%,33% 4%,47% 20%,61% 0,75% 18%,91% 7%,100% 29%,94% 63%,100% 84%,77% 70%,61% 96%,43% 76%,24% 100%,10% 73%,0 88%); filter:blur(1.2px); }
.wall-graffiti-layer span:nth-child(1) { left:5%; top:18%; }
.wall-graffiti-layer span:nth-child(2) { --tag-color:#d4d5cf; right:5%; top:26%; transform:rotate(7deg) skewX(-7deg); }
.wall-graffiti-layer span:nth-child(3) { --tag-color:#ef7518; left:8%; bottom:13%; transform:rotate(4deg) skewX(-10deg); }
.cinematic-hero.is-logo-painting .wall-graffiti-layer span:nth-child(1) { animation:wallGraffitiTag 1.2s steps(10,end) .48s both; }
.cinematic-hero.is-logo-painting .wall-graffiti-layer span:nth-child(2) { animation:wallGraffitiTag 1.15s steps(9,end) 1.15s both; }
.cinematic-hero.is-logo-painting .wall-graffiti-layer span:nth-child(3) { animation:wallGraffitiTag 1.05s steps(8,end) 1.82s both; }
.wall-logo-lockup { position:absolute; z-index:4; left:50%; top:50%; width:min(470px,46vw,54vh); max-width:calc(100vw - 48px); aspect-ratio:1; transform:translate(-50%,-50%); }
.wall-logo-lockup img { display:block; width:100%; height:100%; object-fit:contain; opacity:0; clip-path:inset(0 100% 0 0); filter:contrast(1.04); }
.wall-logo-spray { display:none; position:absolute; left:-37.5%; top:-37.5%; width:175%; height:175%; pointer-events:none; }
.wall-logo-lockup.has-spray-canvas img { visibility:hidden; animation:none; }
.wall-logo-lockup.has-spray-canvas .wall-logo-spray { display:block; }
.cinematic-hero.is-logo-painting .wall-logo-lockup:not(.has-spray-canvas) img { animation:wallLogoPaint 2.15s ease-out .14s both; }
.wall-impact { position:absolute; z-index:3; left:50%; top:50%; width:min(760px,88vw); aspect-ratio:1; border-radius:50%; opacity:0; transform:translate(-50%,-50%) scale(.32); background:repeating-conic-gradient(from 8deg,transparent 0 7deg,rgba(255,255,255,.34) 8deg 8.5deg,transparent 9deg 21deg),radial-gradient(circle,transparent 0 24%,rgba(255,183,99,.28) 25%,transparent 27% 100%); mix-blend-mode:screen; filter:blur(.2px); }
.wall-dust { position:absolute; z-index:7; left:50%; top:50%; width:34vmax; aspect-ratio:1; border-radius:50%; opacity:0; transform:translate(-50%,-50%) scale(.18); background:radial-gradient(circle,rgba(214,178,133,.62),rgba(95,69,48,.34) 36%,transparent 69%); filter:blur(18px); }
.wall-debris { position:absolute; z-index:8; inset:0; }
.wall-debris i { position:absolute; left:50%; top:50%; width:clamp(34px,5vw,94px); aspect-ratio:2.25/1; opacity:0; border-radius:3px; background:url("/assets/brand/bryk-brick-wall-intro-v1.webp") center/480px auto; box-shadow:0 10px 18px rgba(0,0,0,.5); }
.wall-debris i:nth-child(1) { --tx:-48vw;--ty:-33vh;--rr:-120deg; }
.wall-debris i:nth-child(2) { --tx:-29vw;--ty:-48vh;--rr:88deg; width:clamp(28px,4vw,72px); }
.wall-debris i:nth-child(3) { --tx:31vw;--ty:-43vh;--rr:146deg; }
.wall-debris i:nth-child(4) { --tx:47vw;--ty:-19vh;--rr:-82deg; width:clamp(30px,4.5vw,82px); }
.wall-debris i:nth-child(5) { --tx:-45vw;--ty:27vh;--rr:102deg; }
.wall-debris i:nth-child(6) { --tx:-22vw;--ty:48vh;--rr:-155deg; width:clamp(30px,4vw,76px); }
.wall-debris i:nth-child(7) { --tx:27vw;--ty:46vh;--rr:116deg; }
.wall-debris i:nth-child(8) { --tx:49vw;--ty:29vh;--rr:-138deg; width:clamp(26px,3.8vw,68px); }
.cinematic-hero.is-wall-breaking .wall-impact { animation:wallImpactFlash .62s ease-out both; }
.cinematic-hero.is-wall-breaking .wall-surface { animation:wallSurfaceOpen .7s ease-out .08s both; }
.cinematic-hero.is-wall-breaking .wall-logo-lockup { animation:wallLogoImpact .58s cubic-bezier(.2,.8,.2,1) both; }
.cinematic-hero.is-wall-breaking .wall-dust { animation:wallDustBurst 1.3s ease-out both; }
.cinematic-hero.is-wall-breaking .wall-debris i { animation:wallDebrisFly 1.25s cubic-bezier(.18,.65,.18,1) both; }
.cinematic-hero.is-wall-breaking .wall-debris i:nth-child(even) { animation-delay:.05s; }
.cinematic-hero.is-wall-breaking .wall-piece--1 { animation:wallBreak1 1.18s cubic-bezier(.22,.8,.2,1) .08s both; }
.cinematic-hero.is-wall-breaking .wall-piece--2 { animation:wallBreak2 1.24s cubic-bezier(.22,.8,.2,1) .03s both; }
.cinematic-hero.is-wall-breaking .wall-piece--3 { animation:wallBreak3 1.15s cubic-bezier(.22,.8,.2,1) .11s both; }
.cinematic-hero.is-wall-breaking .wall-piece--4 { animation:wallBreak4 1.2s cubic-bezier(.22,.8,.2,1) .07s both; }
.cinematic-hero.is-wall-breaking .wall-piece--5 { animation:wallBreak5 1.28s cubic-bezier(.22,.8,.2,1) .13s both; }
.cinematic-hero.is-wall-breaking .wall-piece--6 { animation:wallBreak6 1.22s cubic-bezier(.22,.8,.2,1) .09s both; }
.cinematic-hero.is-wall-cleared .hero-wall-intro,.cinematic-hero.is-complete .hero-wall-intro { visibility:hidden; }
.stable-city-film .hero-film,.motion-off .stable-city-film .hero-film { inset:0; height:100%; animation:none; transform:none; will-change:auto; }
.hero-final-frame { z-index:-1; opacity:0; background:center/cover no-repeat url("/assets/media/posters/hero.webp"); transition:opacity 1s ease; }
.hero-feather { position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(180deg,rgba(2,4,7,.76) 0%,rgba(2,4,7,.17) 24%,transparent 47%),linear-gradient(90deg,rgba(2,4,7,.7) 0%,rgba(2,4,7,.13) 46%,transparent 72%),linear-gradient(0deg,rgba(2,4,7,.74),transparent 34%); }
.hero-feather::after { content:""; position:absolute; inset:0; opacity:.22; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.08) 4px); mix-blend-mode:overlay; }
.hero-spray { position:absolute; z-index:3; inset:0; pointer-events:none; opacity:0; animation:none; }
.cinematic-hero.is-film-started .hero-spray { animation:heroSpray 2.4s 2.2s both; }
.hero-spray i { position:absolute; left:-20%; top:42%; width:140%; height:18%; transform:rotate(-10deg); background:linear-gradient(90deg,transparent 2%,var(--pink) 12% 28%,var(--orange) 36% 52%,var(--cyan) 61% 75%,var(--lime) 83% 90%,transparent 98%); filter:blur(12px) saturate(1.5); mix-blend-mode:screen; clip-path:polygon(0 35%,8% 48%,15% 12%,21% 68%,29% 23%,39% 78%,47% 31%,59% 88%,69% 17%,79% 75%,89% 26%,100% 58%,97% 75%,88% 51%,78% 93%,67% 46%,57% 100%,46% 58%,34% 90%,23% 55%,12% 87%,0 69%); }
.hero-spray i:nth-child(2) { top:21%; transform:rotate(14deg) scaleY(.5); filter:blur(5px); }.hero-spray i:nth-child(3) { top:68%; transform:rotate(-18deg) scaleY(.28); filter:blur(3px); }
.hero-interface { position:absolute; z-index:7; left:clamp(24px,6vw,110px); top:clamp(76px,13vh,138px); width:min(960px,calc(100% - clamp(48px,12vw,220px))); max-width:960px; opacity:0; pointer-events:none; transform:translateY(18px); transition:opacity .48s ease,transform .48s ease; }
.hero-kicker { position:relative; display:inline-block; margin:0 0 13px; padding:6px 10px 5px; color:#080a0d; background:rgba(255,106,0,.88); font:1000 10px/1 system-ui,sans-serif; letter-spacing:.14em; text-shadow:none; transform:rotate(-1deg); clip-path:polygon(1% 5%,100% 0,96% 90%,3% 100%); }
.hero-kicker::after { content:""; position:absolute; inset:-7px -12px; z-index:-1; opacity:.34; background:radial-gradient(circle at 5% 24%,var(--orange) 0 2px,transparent 3px),radial-gradient(circle at 94% 72%,var(--orange) 0 2px,transparent 3px),linear-gradient(94deg,transparent,var(--orange) 7% 94%,transparent); filter:blur(1px); }
.hero-interface h1 { font-size:clamp(54px,7vw,112px); line-height:.8; text-shadow:none; }
.spray-lettering { overflow:visible; }
.spray-line { position:relative; display:block; width:max-content; max-width:calc(100% - .3em); padding-inline-end:.3em; color:transparent; -webkit-text-stroke:1px rgba(255,255,255,.08); white-space:nowrap; overflow:visible; }
.spray-line::before { content:attr(data-text); position:absolute; inset:0 -.3em 0 0; padding-inline-end:.3em; color:var(--white); -webkit-text-stroke:1px rgba(255,255,255,.24); text-shadow:6px 7px 0 #000,0 0 32px #000; clip-path:inset(0 100% 0 0); }
.spray-line::after { content:""; position:absolute; z-index:-1; inset:-.18em -.15em -.13em; opacity:0; background:radial-gradient(circle at 2% 17%,currentColor 0 .018em,transparent .028em),radial-gradient(circle at 8% 82%,currentColor 0 .026em,transparent .038em),radial-gradient(circle at 47% 6%,currentColor 0 .016em,transparent .026em),radial-gradient(circle at 94% 71%,currentColor 0 .022em,transparent .034em),linear-gradient(96deg,transparent 0 1%,color-mix(in srgb,currentColor 45%,transparent) 4% 96%,transparent 100%); background-size:.19em .21em,.23em .17em,.28em .24em,.31em .27em,100% 100%; filter:blur(.75px); clip-path:polygon(0 28%,7% 10%,18% 22%,31% 2%,45% 19%,59% 0,73% 17%,88% 5%,100% 24%,96% 55%,100% 82%,81% 69%,64% 97%,48% 74%,31% 100%,14% 72%,0 88%); transform:rotate(-.4deg) skewX(-2deg); }
.spray-line--accent { color:transparent; }
.spray-line--accent::before { color:var(--lime); -webkit-text-stroke-color:rgba(185,242,39,.3); }
.spray-line--accent::after { color:var(--lime); }
.spray-line:first-child::after { color:var(--white); }
.cinematic-hero.is-complete .spray-line::before { animation:sprayLetterReveal 1.05s steps(16,end) .12s both; }
.cinematic-hero.is-complete .spray-line::after { animation:sprayMistReveal 1.05s steps(16,end) .12s both; }
.cinematic-hero.is-complete .spray-line--accent::before { animation-delay:.68s; }
.cinematic-hero.is-complete .spray-line--accent::after { animation-delay:.68s; }
.cinematic-hero.is-intro-skipped .spray-line::before { animation:none!important; clip-path:inset(0 0 0 0); }
.cinematic-hero.is-intro-skipped .spray-line::after { animation:none!important; opacity:.18; clip-path:inset(0 0 0 0); }
.hero-deck { position:relative; z-index:7; max-width:820px; margin:19px 0 26px; padding:25px 24px 20px; color:#f4f6f7; font:760 clamp(15px,1.25vw,18px)/1.55 system-ui,sans-serif; letter-spacing:.005em; text-shadow:0 2px 9px #000; isolation:isolate; }
.hero-deck::before { content:""; position:absolute; z-index:-2; inset:-6px -18px -9px -20px; opacity:.93; background:linear-gradient(96deg,rgba(5,6,7,.97) 3%,rgba(5,6,7,.92) 76%,rgba(5,6,7,.48) 100%),radial-gradient(circle at 8% 18%,rgba(255,101,0,.78) 0 2px,transparent 3px),radial-gradient(circle at 92% 70%,rgba(255,101,0,.62) 0 3px,transparent 4px); clip-path:polygon(0 9%,7% 2%,18% 6%,30% 0,45% 7%,59% 2%,71% 8%,84% 3%,100% 12%,96% 91%,84% 96%,69% 91%,55% 100%,42% 93%,28% 99%,14% 91%,2% 96%); transform:rotate(-.6deg) skewX(-1deg); }
.hero-deck::after { content:""; position:absolute; z-index:-1; left:13px; right:22%; bottom:-13px; height:18px; opacity:.7; background:linear-gradient(90deg,var(--orange) 0 72%,transparent 72%),radial-gradient(circle at 12% 100%,var(--orange) 0 3px,transparent 4px),radial-gradient(circle at 51% 100%,var(--orange) 0 2px,transparent 3px); clip-path:polygon(0 0,100% 19%,78% 44%,58% 31%,39% 63%,21% 38%,8% 68%,0 42%); transform:rotate(.8deg); }
.hero-deck-guide { display:block; margin:0 0 7px; color:var(--orange); font:1000 9px/1 system-ui,sans-serif; letter-spacing:.13em; text-transform:uppercase; }
.hero-deck-copy { display:block; }
.hero-concept { position:relative; z-index:8; color:var(--lime); padding:0 .06em; background:linear-gradient(180deg,transparent 60%,rgba(185,242,39,.15) 60%); font-weight:950; text-decoration-line:underline; text-decoration-color:rgba(185,242,39,.65); text-decoration-thickness:2px; text-underline-offset:3px; transition:color .18s ease,text-decoration-color .18s ease,background .18s ease; }
.hero-concept::before { content:"↗"; display:inline-block; margin-right:.12em; color:var(--orange); font-size:.72em; text-decoration:none; transform:translateY(-.08em); }
.hero-concept::after { content:attr(data-tooltip); position:absolute; z-index:20; left:50%; bottom:calc(100% + 10px); width:max-content; max-width:min(290px,72vw); padding:9px 11px; color:#f6f7f5; border:1px solid rgba(185,242,39,.75); background:rgba(5,7,9,.97); box-shadow:5px 5px 0 rgba(0,0,0,.62),0 0 22px rgba(185,242,39,.13); opacity:0; pointer-events:none; transform:translate(-50%,5px); transition:opacity .16s ease,transform .16s ease; font:800 11px/1.45 system-ui,sans-serif; letter-spacing:.015em; text-align:left; text-shadow:none; white-space:normal; }
.hero-concept:hover,.hero-concept:focus-visible,.hero-concept.is-tip-open { color:#fff; background:linear-gradient(180deg,transparent 50%,rgba(255,106,0,.28) 50%); text-decoration-color:var(--orange); }
.hero-concept:hover::after,.hero-concept:focus-visible::after,.hero-concept.is-tip-open::after { opacity:1; transform:translate(-50%,0); }
.hero-nav { position:relative; z-index:8; display:flex; flex-wrap:wrap; gap:7px; margin-top:0; }
.hero-nav a { min-height:48px; display:grid; place-items:center; padding:0 19px; color:white; border:1px solid rgba(255,255,255,.5); background:rgba(4,6,9,.72); backdrop-filter:blur(8px); text-decoration:none; font-size:11px; font-weight:900; letter-spacing:.09em; }
.hero-nav a:first-child { color:#080a0d; border-color:var(--orange); background:var(--orange); }
.hero-nav a:hover { color:#080a0d; border-color:var(--lime); background:var(--lime); }
.hero-signal-runner { position:absolute; z-index:6; left:clamp(24px,6vw,110px); bottom:70px; display:grid; grid-template-columns:repeat(4,minmax(125px,1fr)); gap:6px; width:min(790px,calc(100% - 485px)); opacity:0; pointer-events:none; transform:translateY(18px); transition:opacity .6s ease 1.2s,transform .6s ease 1.2s; }
.hero-signal-runner a { position:relative; display:grid; grid-template-columns:46px 1fr; align-items:center; min-width:0; min-height:62px; overflow:hidden; color:#fff; border:1px solid rgba(255,255,255,.24); background:rgba(5,8,11,.82); box-shadow:5px 5px 0 rgba(0,0,0,.58); text-decoration:none; backdrop-filter:blur(10px); }
.hero-signal-runner a[href*="d-01/"] { --signal-color:#ff6a00; }
.hero-signal-runner a[href*="d-03/"] { --signal-color:#ff3c91; }
.hero-signal-runner a[href*="d-04/"] { --signal-color:#00b8b3; }
.hero-signal-runner a[href*="d-08/"] { --signal-color:#00a8ff; }
.hero-signal-runner a::after { content:""; position:absolute; left:46px; right:0; bottom:0; height:3px; background:var(--signal-color); box-shadow:0 0 13px var(--signal-color); transform:scaleX(.18); transform-origin:left; transition:transform .25s ease; }
.hero-signal-runner img { width:46px; height:100%; object-fit:cover; filter:grayscale(.45) brightness(.64) contrast(1.12); transition:filter .25s ease; }
.hero-signal-runner span { display:grid; min-width:0; gap:5px; padding:8px 23px 8px 8px; }
.hero-signal-runner small { overflow:hidden; color:var(--signal-color); font:900 9px/1 system-ui,sans-serif; letter-spacing:.08em; white-space:nowrap; text-overflow:ellipsis; }
.hero-signal-runner b { overflow:hidden; font:900 11px/1 system-ui,sans-serif; letter-spacing:.035em; white-space:nowrap; text-overflow:ellipsis; }
.hero-signal-runner i { position:absolute; right:7px; top:7px; color:#899198; font:normal 900 8px/1 system-ui,sans-serif; letter-spacing:.07em; writing-mode:vertical-rl; }
.hero-signal-runner a:hover,.hero-signal-runner a:focus-visible { border-color:var(--signal-color); outline:none; }
.hero-signal-runner a:hover::after,.hero-signal-runner a:focus-visible::after { transform:scaleX(1); }
.hero-signal-runner a:hover img,.hero-signal-runner a:focus-visible img { filter:saturate(1.15) brightness(.88) contrast(1.05); }
.hero-tools { position:absolute; z-index:12; right:clamp(16px,3vw,48px); top:24px; display:flex; gap:6px; }
.hero-tools button { min-height:40px; padding:0 14px; border:1px solid rgba(255,255,255,.42); background:rgba(2,4,7,.72); cursor:pointer; font-size:10px; font-weight:900; letter-spacing:.1em; }
#replayIntro { display:none; }
.hero-scroll { position:absolute; z-index:6; right:clamp(22px,5vw,80px); bottom:180px; display:flex; align-items:center; gap:14px; color:#fff; text-decoration:none; font:900 11px/1 system-ui,sans-serif; letter-spacing:.12em; opacity:0; transition:opacity .7s ease; }
.hero-scroll i { display:block; width:44px; height:44px; border:1px solid rgba(255,255,255,.5); border-radius:50%; }
.hero-scroll i::after { content:"↓"; display:grid; place-items:center; height:100%; font-size:15px; }
.cinematic-hero.is-complete .hero-spray { display:none; }
.cinematic-hero.is-static-frame .hero-final-frame { z-index:1; opacity:1; }
.cinematic-hero.is-complete .hero-interface { opacity:1; pointer-events:auto; transform:none; }
.cinematic-hero.is-complete .hero-signal-runner { opacity:1; pointer-events:auto; transform:none; }
.cinematic-hero.is-complete .hero-scroll { opacity:1; }
.cinematic-hero.is-complete #skipIntro { display:none; }.cinematic-hero.is-complete #replayIntro { display:block; }

.topbar { position:sticky; z-index:80; top:0; min-height:78px; display:flex; align-items:center; justify-content:space-between; gap:clamp(12px,2vw,28px); padding:10px clamp(16px,2.4vw,38px); border-bottom:1px solid rgba(255,255,255,.18); background:rgba(7,9,12,.96); box-shadow:0 10px 32px rgba(0,0,0,.34); backdrop-filter:blur(16px); }
.brand { display: inline-flex; gap: 13px; align-items: center; flex: 0 0 auto; color: inherit; text-decoration: none; }
.brand-logo { width:78px; height:58px; object-fit:contain; filter:drop-shadow(3px 4px 0 rgba(255,106,0,.54)); }
.brand-mark { position: relative; width: 44px; height: 38px; transform: skewY(-7deg); }
.brand-mark i { position: absolute; width: 21px; height: 15px; border: 2px solid #090909; background: var(--orange); box-shadow: inset 0 0 0 1px rgba(255,255,255,.2); }
.brand-mark i:nth-child(1) { left: 0; top: 5px; }
.brand-mark i:nth-child(2) { right: 0; top: 0; }
.brand-mark i:nth-child(3) { right: 2px; bottom: 0; }
.brand-copy { display: grid; line-height: 1; }
.brand-copy strong { font-size: 23px; letter-spacing: -.025em; }
.brand-copy small { margin-top:6px; color:#aab0b5; font:700 10px/1 system-ui,sans-serif; letter-spacing:.12em; }
.site-nav { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:4px clamp(12px,1.55vw,24px); margin-left:auto; white-space:nowrap; }
.site-nav a { position:relative; min-height:40px; display:grid; place-items:center; padding:0 2px; color:#d1d5d8; text-decoration:none; font:850 12px/1 system-ui,sans-serif; letter-spacing:.065em; }
.site-nav a::after { content:""; position:absolute; left:-5%; right:-5%; bottom:2px; height:7px; opacity:.55; background:radial-gradient(circle at 4% 55%,var(--orange) 0 1px,transparent 2px),radial-gradient(circle at 95% 38%,var(--orange) 0 1px,transparent 2px),linear-gradient(176deg,transparent 18%,var(--orange) 22% 58%,transparent 62%); transform:rotate(-1deg) scaleX(.42); transform-origin:left center; transition:opacity .18s ease,transform .2s ease; }
.site-nav a:nth-child(2n)::after { --orange:var(--pink); transform:rotate(1.2deg) scaleX(.42); }
.site-nav a:nth-child(3n)::after { --orange:var(--lime); }
.site-nav a:hover::after,.site-nav a:focus-visible::after { opacity:.95; transform:rotate(-1deg) scaleX(1); }
.site-nav a:hover { color: var(--white); }
.topbar-actions { position:relative; display:flex; align-items:center; gap:10px; color:#a4abb0; font:750 11px/1 system-ui,sans-serif; letter-spacing:.09em; }
.member-entry,.site-menu > summary { min-height:42px; display:grid; place-items:center; padding:0 14px; color:#080a0d; border:1px solid var(--orange); background:var(--orange); cursor:pointer; text-decoration:none; font:900 11px/1 system-ui,sans-serif; letter-spacing:.08em; list-style:none; }
.site-menu { display:none; position:relative; }
.site-menu > summary::-webkit-details-marker { display:none; }
.site-menu > nav { position:absolute; z-index:90; top:calc(100% + 8px); right:0; width:min(310px,calc(100vw - 24px)); padding:8px; border:1px solid rgba(255,255,255,.25); background:rgba(7,9,12,.98); box-shadow:0 24px 60px rgba(0,0,0,.55); }
.site-menu > nav a { display:flex; min-height:48px; align-items:center; padding:0 13px; color:#e2e5e7; border-bottom:1px solid rgba(255,255,255,.09); text-decoration:none; font:900 12px/1 system-ui,sans-serif; letter-spacing:.07em; }
.site-menu > nav a:last-child { border-bottom:0; }
.site-menu > nav a:hover { color:#07090c; background:var(--lime); }
.signal { color: #cdd1d4; }
.signal i { display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 12px var(--lime); animation: pulse 2.2s ease-in-out infinite; }

.city-network { display: flex; align-items: stretch; gap: 7px; width: min(1880px,100%); margin: 0 auto; padding: 14px clamp(18px,3vw,48px) 0; }
.network-label { display: grid; place-items: center; padding: 0 13px; color: #656c72; border: 1px solid var(--line); font: 800 8px/1 system-ui,sans-serif; letter-spacing: .15em; }
.city-node { position: relative; display: grid; grid-template-columns: 31px minmax(110px,1fr) 7px; align-items: center; gap: 10px; min-width: 196px; min-height: 55px; padding: 8px 12px; color:inherit; border: 1px solid var(--line); background: #0d1115; text-align: left; text-decoration:none; cursor: pointer; }
.city-node b { color: var(--orange); font-size: 17px; }
.city-node span { display: grid; font-size: 10px; font-weight: 800; }
.city-node small { margin-top: 5px; color: #636a70; font: 700 7px/1 system-ui,sans-serif; letter-spacing: .08em; }
.city-node > i:last-child { width: 7px; height: 7px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 8px var(--lime); }
.city-node.is-active { border-color: rgba(255,106,0,.62); background: linear-gradient(100deg, rgba(255,106,0,.1), #0d1115 60%); }
.city-node:hover { color:white; border-color:rgba(255,255,255,.42); background:linear-gradient(100deg,rgba(185,242,39,.08),#0d1115 60%); }
.city-node.is-locked { opacity: .45; cursor: not-allowed; }
.city-node.is-locked > i:last-child { position: relative; width: 9px; height: 8px; border-radius: 1px; background: #777d82; box-shadow: none; }
.city-node.is-locked > i:last-child::before { content: ""; position: absolute; left: 1px; top: -6px; width: 5px; height: 6px; border: 2px solid #777d82; border-bottom: 0; border-radius: 5px 5px 0 0; }
.network-copy { align-self: center; margin-left: auto; max-width: 220px; color: #52595f; font: 700 7px/1.5 system-ui,sans-serif; letter-spacing: .12em; text-align: right; }

.map-layout { display:grid; grid-template-columns:minmax(0,1fr) minmax(310px,360px); align-items:start; gap:clamp(18px,2vw,34px); width:min(1880px,100%); margin:0 auto; padding:clamp(104px,8vw,132px) clamp(18px,3vw,48px) clamp(26px,3vw,48px); }
.map-column { min-width: 0; }
.map-heading, .section-heading { display: flex; align-items: end; justify-content: space-between; gap: 30px; margin-bottom: 22px; }
.eyebrow { margin: 0 0 8px; color: var(--orange); font: 800 9px/1 system-ui,sans-serif; letter-spacing: .22em; }
h1 { margin: 0; font-size: clamp(40px,5vw,78px); line-height: .88; letter-spacing: -.045em; text-shadow: 4px 4px 0 #000; }
h1 span, .section-heading h2 span { color: var(--orange); }
.map-intro, .section-heading > p { max-width:520px; margin:0; color:#b8bec2; font:500 15px/1.65 system-ui,sans-serif; letter-spacing:.01em; }

.map-start-panel { overflow:hidden; border:1px solid rgba(255,255,255,.2); background:linear-gradient(150deg,rgba(255,106,0,.12),#0b0f13 45%); box-shadow:0 26px 70px rgba(0,0,0,.4); }
.map-start-heading { padding:24px 23px 20px; }
.map-start-heading h2 { margin:8px 0 13px; font-size:clamp(42px,4vw,62px); line-height:.82; letter-spacing:-.045em; }
.map-start-heading h2 span { color:var(--orange); }
.map-start-heading > p:last-child { margin:0; color:#b6bdc2; font:500 13px/1.62 system-ui,sans-serif; letter-spacing:.01em; }
.home-waitlist { display:grid; gap:8px; padding:20px 23px; border-top:1px solid var(--line); border-bottom:1px solid var(--line); background:#090d11; }
.home-waitlist label { color:#899198; font:900 8px/1 system-ui,sans-serif; letter-spacing:.12em; }
.home-waitlist input,.home-waitlist select { width:100%; min-height:44px; padding:0 12px; color:#fff; border:1px solid rgba(255,255,255,.25); background:#05080b; font:700 11px/1 system-ui,sans-serif; }
.home-waitlist button { min-height:46px; margin-top:4px; color:#080a0d; border:0; background:var(--orange); cursor:pointer; font:900 10px/1 system-ui,sans-serif; letter-spacing:.09em; }
.home-waitlist button:hover { background:var(--lime); }
.home-waitlist > p { min-height:18px; margin:0; color:#bfc5c9; font:700 9px/1.4 system-ui,sans-serif; }
.home-waitlist > p.is-error { color:#ff8cab; }
.home-drop-link { display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:64px; padding:12px 18px; color:#f3f4f2; border-bottom:1px solid var(--line); text-decoration:none; }
.home-drop-link span { display:grid; gap:4px; }.home-drop-link small { color:#7e878e; font:800 7px/1 system-ui,sans-serif; letter-spacing:.12em; }.home-drop-link b { font-size:11px; }.home-drop-link > i { display:grid; place-items:center; width:32px; height:32px; color:#080a0d; background:var(--lime); font-style:normal; }
.home-bodega-entry { position:relative; display:block; min-height:270px; overflow:hidden; color:#fff; text-decoration:none; }
.home-bodega-entry::after { content:""; position:absolute; inset:0; background:linear-gradient(0deg,rgba(2,4,7,.96),rgba(2,4,7,.14) 70%); }
.home-bodega-entry > img { position:absolute; inset:0; width:100%; height:100%; object-fit:cover; filter:saturate(1.12) contrast(1.05); }
.home-bodega-entry > span { position:absolute; z-index:2; inset:auto 18px 18px; display:grid; gap:6px; }
.home-bodega-entry small { color:var(--orange); font:900 8px/1 system-ui,sans-serif; letter-spacing:.11em; }.home-bodega-entry b { font-size:21px; line-height:.95; }.home-bodega-entry em { color:#c0c6ca; font:normal 800 8px/1.45 system-ui,sans-serif; letter-spacing:.07em; }
.home-bodega-entry .neon-open { position:absolute; z-index:3; right:12px; top:12px; padding:7px 9px; color:#ff7eb2; border:1px solid #ff3c91; background:rgba(4,6,9,.75); box-shadow:0 0 15px rgba(255,60,145,.66),inset 0 0 10px rgba(255,60,145,.2); font:normal 900 8px/1 system-ui,sans-serif; letter-spacing:.1em; }

.control-rail { position:relative; display: flex; align-items: center; gap: 6px; min-height: 52px; padding: 7px; border: 1px solid var(--line); border-bottom: 0; background: #0d1014; }
.control-label { margin: 0 10px; color: #6e747b; font-size: 8px; letter-spacing: .18em; }
.mode-button, .border-button, .map-tool { border:1px solid transparent; padding:9px 11px; background:transparent; color:#9aa1a7; cursor:pointer; font-size:9px; font-weight:800; letter-spacing:.08em; transition:.18s ease; }
.mode-button:hover, .border-button:hover, .map-tool:hover { color: #fff; background: #171b21; }
.mode-button.is-active { color: #080a0d; background: var(--orange); border-color: #ff8e45; }
.border-button { margin-left: auto; }
.border-button.is-active { color: var(--lime); border-color: rgba(185,242,39,.38); background: rgba(185,242,39,.05); }
.rail-divider { width: 1px; height: 22px; background: var(--line); }
.map-tool { display: grid; place-items: center; min-width: 30px; height: 30px; padding: 0; border-color: var(--line); font-size: 14px; }
.fit-tool { width: 37px; font-size: 7px; }
.zoom-value { min-width: 38px; color: #7e858b; font: 700 8px/1 system-ui,sans-serif; text-align: center; }
.map-control-help { margin-left:auto; padding:0 10px; color:#aeb5ba; font:900 7px/1 system-ui,sans-serif; letter-spacing:.12em; }
.map-display-menu { position:relative; }
.map-display-menu > summary { min-height:32px; display:grid; place-items:center; padding:0 11px; color:#9ba2a8; border:1px solid var(--line); cursor:pointer; font:900 7px/1 system-ui,sans-serif; letter-spacing:.1em; list-style:none; }
.map-display-menu > summary::-webkit-details-marker { display:none; }
.map-display-menu[open] > summary { color:#080a0d; border-color:var(--lime); background:var(--lime); }
.map-display-menu > div { position:absolute; z-index:20; top:calc(100% + 8px); left:0; display:grid; gap:5px; width:210px; padding:10px; border:1px solid rgba(255,255,255,.25); background:#090c10; box-shadow:0 18px 40px rgba(0,0,0,.5); }
@media (max-width:700px) { .map-display-menu > div { left:auto; right:0; max-width:calc(100vw - 32px); } }
.map-display-menu > div > span { padding:4px 5px; color:#6e767c; font:900 7px/1 system-ui,sans-serif; letter-spacing:.12em; }
.map-display-menu .mode-button,.map-display-menu .border-button { width:100%; min-height:34px; margin:0; text-align:left; }

.map-viewport { overflow: auto; border: 1px solid rgba(255,255,255,.22); background: #03070b; box-shadow: 0 28px 70px rgba(0,0,0,.48), inset 0 0 0 5px #080a0d; scrollbar-color: #3e464d #0a0d10; }
.map-stage { position: relative; width: 100%; min-width: 760px; aspect-ratio: 1672/941; overflow: hidden; isolation: isolate; transform-origin: top left; transition: width .25s ease; }
.city-home .map-stage { transform:none!important; transition:width .25s ease!important; will-change:auto!important; }
.city-home .map-image { animation:none!important; transform:none!important; }
.map-image { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(.88) brightness(.72) contrast(1.08); }
.map-vignette { position: absolute; z-index: 1; inset: 0; pointer-events: none; background: radial-gradient(circle at center, transparent 46%, rgba(0,0,0,.3)), linear-gradient(180deg, rgba(0,0,0,.03), rgba(0,0,0,.23)); }
.district-layer { position: absolute; z-index: 2; inset: 0; }
.district { position: absolute; inset: 0; width: 100%; height: 100%; padding: 0; border: 0; clip-path: polygon(var(--shape)); cursor: pointer; background-position: center; background-size: 100% 100%; background-repeat: no-repeat; transition: filter .2s ease, opacity .2s ease; }
.district::after { content:""; position:absolute; inset:-12%; opacity:0; pointer-events:none; background:radial-gradient(circle at var(--cx) var(--cy),rgba(var(--district-rgb),.76),transparent 18%),repeating-linear-gradient(105deg,transparent 0 10%,rgba(var(--district-rgb),.2) 11%,transparent 13%); mix-blend-mode:screen; transform:translateX(-18%); transition:opacity .2s ease; }
.district:hover::after,.district:focus-visible::after { opacity:.82; animation:districtColorSweep 1.8s ease-in-out infinite alternate; }
.district.is-locked { background-image: linear-gradient(rgba(38,42,47,.72),rgba(38,42,47,.72)), url("/assets/bryk-city-map-master-v2.webp"); background-blend-mode: color,normal; filter: grayscale(1) brightness(.45) contrast(.94) drop-shadow(1px 0 0 rgba(238,241,243,.58)) drop-shadow(-1px 0 0 rgba(238,241,243,.58)) drop-shadow(0 1px 0 rgba(238,241,243,.58)) drop-shadow(0 -1px 0 rgba(238,241,243,.58)); }
.district.is-unlocked { background-image: linear-gradient(rgba(var(--district-rgb),.34),rgba(var(--district-rgb),.06)), url("/assets/bryk-city-map-master-v2.webp"); background-blend-mode: screen,normal; filter: saturate(1.35) brightness(1.07) contrast(1.05) drop-shadow(1px 0 0 var(--district-color)) drop-shadow(-1px 0 0 var(--district-color)) drop-shadow(0 1px 0 var(--district-color)) drop-shadow(0 -1px 0 var(--district-color)) drop-shadow(0 0 8px rgba(var(--district-rgb),.58)); }
.district:hover, .district:focus-visible { z-index: 4; outline: none; filter: saturate(1.5) brightness(1.26) contrast(1.04) drop-shadow(2px 0 0 #fff) drop-shadow(-2px 0 0 #fff) drop-shadow(0 2px 0 #fff) drop-shadow(0 -2px 0 #fff) drop-shadow(0 0 18px rgba(var(--district-rgb),.85)); }
.district.is-selected { z-index: 3; animation: selectedGlow 2.4s ease-in-out infinite; }
.borders-off .district { filter: grayscale(1) brightness(.45) contrast(.94); }
.borders-off .district.is-unlocked { filter: saturate(1.35) brightness(1.07) contrast(1.05); }
.district-marker { position: absolute; left: var(--cx); top: var(--cy); display: grid; place-items: center; min-width: 52px; min-height: 43px; padding: 6px 9px; transform: translate(-50%,-50%); color: white; background: rgba(5,7,9,.9); border: 1px solid rgba(255,255,255,.76); box-shadow: 4px 4px 0 rgba(0,0,0,.65); pointer-events: none; }
.district-marker b { font-size: 16px; line-height: 1; }
.district-marker small { margin-top: 4px; color: var(--district-color); font: 800 7px/1 system-ui,sans-serif; letter-spacing: .12em; }
.district-marker em { position:absolute; left:50%; top:calc(100% + 6px); min-width:68px; padding:5px 7px; transform:translateX(-50%); opacity:0; color:#080a0d; background:var(--district-color); font:normal 900 6px/1 system-ui,sans-serif; letter-spacing:.09em; transition:opacity .16s ease; }
.district:hover .district-marker em,.district:focus-visible .district-marker em { opacity:1; }
.district-clue { position:absolute; left:var(--overlay-x); top:var(--overlay-y); width:clamp(120px,12vw,190px); transform:translate(-50%,-50%) rotate(-2deg); opacity:0; padding:9px 11px; color:#080a0d; background:var(--district-color); box-shadow:5px 6px #000; pointer-events:none; transition:opacity .2s ease,transform .2s ease; }
.district-clue b { display:block; font-size:9px; line-height:1; }.district-clue small { display:block; margin-top:5px; font:700 6px/1.35 system-ui,sans-serif; letter-spacing:.04em; }
.district:hover .district-clue,.district:focus-visible .district-clue { opacity:1; transform:translate(-50%,-58%) rotate(1deg); }
.district.is-locked .district-marker b { opacity: .35; }
.lock-mark, .large-lock { position: absolute; width: 17px; height: 14px; border-radius: 2px; background: #aeb3b7; box-shadow: 0 2px 0 #31363b; }
.lock-mark { left: 50%; top: 50%; transform: translate(-50%,-50%); }
.lock-mark::before, .large-lock::before { content: ""; position: absolute; left: 3px; top: -9px; width: 9px; height: 10px; border: 3px solid #aeb3b7; border-bottom: 0; border-radius: 8px 8px 0 0; }
.map-tip { position: absolute; z-index: 10; left: 0; top: 0; display: grid; min-width: 160px; padding: 10px 12px; opacity: 0; pointer-events: none; color: white; background: rgba(6,8,10,.95); border-left: 3px solid var(--orange); box-shadow: 0 12px 28px rgba(0,0,0,.45); transition: opacity .12s ease; }
.map-tip.is-visible { opacity: 1; }
.map-tip small { color: var(--orange); font-size: 8px; }
.map-tip b { margin: 4px 0; font-size: 14px; }
.map-tip span { color: #858c93; font-size: 8px; }
.map-stamp { position: absolute; z-index: 6; left: 16px; bottom: 18px; display: flex; align-items: center; gap: 7px; opacity: .8; pointer-events: none; }
.map-stamp b { display: grid; place-items: center; width: 30px; height: 30px; color: #080a0d; background: var(--orange); font-size: 13px; }
.map-stamp span { color: #9da3a8; font-size: 9px; }
.map-coordinates { position: absolute; z-index: 6; right: 16px; bottom: 18px; color: rgba(255,255,255,.42); font: 700 7px/1 system-ui,sans-serif; letter-spacing: .14em; pointer-events: none; }
.map-legend { display:flex; flex-wrap:wrap; align-items:center; gap:18px; padding:14px 16px; color:#a3aab0; border:1px solid var(--line); border-top:0; background:#0d1014; font-size:9px; font-weight:800; letter-spacing:.08em; }
.legend-swatch { display: inline-block; width: 11px; height: 11px; margin-right: 6px; vertical-align: -2px; border: 1px solid rgba(255,255,255,.4); }
.legend-swatch.unlocked { background: var(--orange); box-shadow: 0 0 7px rgba(255,106,0,.7); }
.legend-swatch.locked { background: #555b61; }
.legend-line { display: inline-block; width: 20px; margin-right: 6px; vertical-align: 2px; border-top: 2px solid #dfe3e6; }
.legend-help { margin-left: auto; color: #d2d6d8; }

.district-panel { position:static; display:grid; grid-template-columns:minmax(340px,.72fr) minmax(0,1.28fr); gap:0 clamp(24px,3vw,48px); width:min(1784px,calc(100% - 36px)); margin:0 auto clamp(54px,7vw,110px); padding:clamp(22px,3vw,42px); border:1px solid rgba(255,255,255,.18); background:linear-gradient(145deg,rgba(22,26,32,.98),rgba(9,11,14,.98)); box-shadow:0 24px 60px rgba(0,0,0,.35); }
.district-panel .panel-kicker,.district-panel .district-visual { grid-column:1; }
.district-panel .district-visual { grid-row:2 / span 8; align-self:start; }
.district-panel h2,.district-panel .district-type,.district-panel .status-line,.district-panel .district-copy,.district-panel .district-actions,.district-panel .district-signals { grid-column:2; }
.district-panel h2 { grid-row:1; margin-top:3px; }
.district-panel .district-index-heading,.district-panel .district-index,.district-panel .panel-note { grid-column:1 / -1; }
.district-panel .district-index { grid-template-columns:repeat(4,1fr); max-height:none; }
.panel-kicker { display: flex; align-items: center; gap: 9px; margin-bottom: 13px; color: #767d84; font: 800 8px/1 system-ui,sans-serif; letter-spacing: .13em; }
.panel-kicker span:first-child { color: var(--orange); }
.panel-kicker i { flex: 1; height: 1px; background: rgba(255,255,255,.17); }
.district-visual { position: relative; margin: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.2); background: #050709; aspect-ratio: 16/10; }
.district-visual img { width: 100%; height: 100%; object-fit: cover; animation:none; transform:none; transition:opacity .22s ease,filter .22s ease; backface-visibility:hidden; }
.district-visual:hover img { transform:none; filter:saturate(1.08) contrast(1.04); }
.district-scanlines { position: absolute; inset: 0; pointer-events: none; opacity: .13; background: repeating-linear-gradient(0deg,transparent 0 3px,#000 4px); }
.district-lock-veil { position: absolute; inset: 0; display: none; place-content: center; justify-items: center; background: rgba(15,18,21,.63); backdrop-filter: grayscale(1) blur(1px); }
.district-lock-veil.is-visible { display: grid; }
.district-lock-veil .large-lock { position: relative; margin-bottom: 17px; transform: scale(1.35); }
.district-lock-veil b { font-size: 13px; letter-spacing: .12em; }
.district-lock-veil small { margin-top: 6px; color: #858b91; font: 700 7px/1 system-ui,sans-serif; letter-spacing: .12em; }
.district-visual figcaption { position: absolute; inset: auto 0 0; display: flex; justify-content: space-between; padding: 8px 10px; background: linear-gradient(transparent,rgba(0,0,0,.88)); color: #8a9197; font: 700 7px/1 system-ui,sans-serif; letter-spacing: .11em; }
.district-panel h2 { margin: 19px 0 2px; font-size: clamp(31px,3vw,48px); line-height: .9; letter-spacing: -.035em; }
.district-type { margin: 7px 0 14px; color: var(--orange); font-size: 11px; font-weight: 800; letter-spacing: .12em; }
.status-line { display: flex; align-items: center; justify-content: space-between; margin: 0 -18px; padding: 9px 18px; border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); color: #777e84; font-size: 8px; font-weight: 800; letter-spacing: .1em; }
.status-pill { padding: 6px 8px; color: #090b0e; }
.status-pill.is-unlocked { background: var(--lime); }
.status-pill.is-locked { color: #d0d4d7; background: #454b52; }
.district-copy { min-height:54px; margin:15px 0; color:#c0c5c9; font:500 14px/1.62 system-ui,sans-serif; letter-spacing:.01em; }
.district-actions { display: grid; grid-template-columns: 1.15fr 1fr; gap: 7px; }
.primary-action, .secondary-action, .preview-action { min-height:44px; border:1px solid var(--orange); padding:10px; font-size:10px; font-weight:900; letter-spacing:.08em; cursor:pointer; }
.primary-action { color: #080a0d; background: var(--orange); }
.primary-action:hover { background: #ff8c40; }
.secondary-action { color: #a4aab0; background: transparent; border-color: rgba(255,255,255,.2); }
.secondary-action:hover { color: white; border-color: white; }
.preview-action { grid-column:1/-1; min-height:32px; color:#747c82; border-color:rgba(255,255,255,.12); background:rgba(255,255,255,.025); }
.preview-action:hover { color:#fff; border-color:rgba(255,255,255,.35); }
.district-signals { display: grid; grid-template-columns: 1fr 1fr; gap: 1px; margin-top: 11px; background: var(--line); border: 1px solid var(--line); }
.district-signals span { display: grid; gap: 5px; padding: 10px; background: #0b0e12; }
.district-signals small { color: #646b72; font: 700 7px/1 system-ui,sans-serif; letter-spacing: .11em; }
.district-signals b { color:#d8dbdd; font-size:10px; letter-spacing:.06em; }
.district-index-heading, .angle-heading { display: flex; justify-content: space-between; align-items: end; margin: 17px 0 9px; color: #e4e7e9; font-size: 9px; font-weight: 800; letter-spacing: .12em; }
.district-index-heading small, .angle-heading small { color: #666d74; font: 700 7px/1 system-ui,sans-serif; letter-spacing: .08em; }
.district-index { display: grid; grid-template-columns: 1fr 1fr; gap: 5px; max-height: 176px; overflow: auto; padding-right: 4px; }
.index-item { display: grid; grid-template-columns: 29px 1fr 7px; align-items: center; gap: 6px; width: 100%; padding: 8px; border: 1px solid transparent; background: rgba(255,255,255,.025); text-align: left; cursor: pointer; transition: .16s ease; }
.index-item:hover, .index-item.is-selected { border-color: rgba(255,255,255,.2); background: rgba(255,255,255,.07); }
.index-number { color: var(--orange); font-size: 8px; font-weight: 800; }
.index-item > span:nth-child(2) { display: grid; }
.index-item b { font-size:9px; }
.index-item small { margin-top:4px; color:#858d93; font:700 8px/1 system-ui,sans-serif; letter-spacing:.04em; }
.index-item i { width: 6px; height: 6px; border-radius: 50%; background: var(--lime); box-shadow: 0 0 7px rgba(185,242,39,.7); }
.index-item.is-locked i { background: #555b61; box-shadow: none; }
.panel-note { margin-top: 14px; padding: 12px; color: #81888f; border-left: 2px solid var(--orange); background: rgba(255,106,0,.055); }
.panel-note b { color: #e0e3e5; font-size: 8px; letter-spacing: .14em; }
.panel-note p { margin:7px 0 0; font:500 11px/1.55 system-ui,sans-serif; letter-spacing:.01em; }

.deeds-launch { display:grid; grid-template-columns:minmax(300px,.72fr) minmax(0,1.28fr); gap:clamp(28px,5vw,84px); width:min(1880px,100%); margin:0 auto; padding:clamp(70px,8vw,120px) clamp(18px,3vw,48px); border-top:1px solid var(--line); background:radial-gradient(circle at 12% 20%,rgba(242,191,50,.1),transparent 34%),linear-gradient(145deg,#101319,#07090c 70%); }
.deeds-launch__copy { align-self:center; max-width:620px; }.deeds-launch__copy h2 { margin:10px 0 20px; font-size:clamp(48px,6vw,100px); line-height:.82; letter-spacing:-.055em; }.deeds-launch__copy h2 span { color:#f2bf32; text-shadow:5px 5px #000; }.deeds-launch__copy > p { max-width:570px; color:#bdc4c8; font:600 15px/1.7 system-ui,sans-serif; }.deeds-launch__copy > small { display:block; margin-top:16px; color:#798188; font:800 10px/1.45 system-ui,sans-serif; letter-spacing:.08em; }
.deeds-launch__actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:24px; }.deeds-launch__actions a { min-height:48px; display:grid; place-items:center; padding:0 18px; color:#080a0d; border:1px solid #f2bf32; background:#f2bf32; text-decoration:none; font:900 11px/1 system-ui,sans-serif; letter-spacing:.09em; }.deeds-launch__actions a + a { color:white; border-color:rgba(255,255,255,.3); background:transparent; }
.deeds-launch__grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; min-width:0; }.deeds-launch__grid a { position:relative; min-height:420px; overflow:hidden; color:white; border:1px solid rgba(255,255,255,.18); background:#05070a; text-decoration:none; }.deeds-launch__grid img { width:100%; height:100%; object-fit:cover; filter:saturate(.85) brightness(.66); transition:filter .25s ease,transform .35s ease; }.deeds-launch__grid a:hover img { filter:saturate(1.08) brightness(.86); transform:scale(1.025); }.deeds-launch__grid span { position:absolute; inset:auto 0 0; display:grid; gap:7px; padding:70px 18px 18px; background:linear-gradient(transparent,rgba(2,4,7,.96)); }.deeds-launch__grid small { color:#f2bf32; font:900 10px/1 system-ui,sans-serif; letter-spacing:.1em; }.deeds-launch__grid b { font-size:clamp(22px,2.5vw,36px); line-height:.92; }.deeds-launch__grid i { color:#dce2e5; font:normal 900 11px/1 system-ui,sans-serif; letter-spacing:.08em; }

.tour-section { width: min(1880px,100%); margin: 0 auto; padding: 68px clamp(18px,3vw,48px) 72px; border-top: 1px solid var(--line); }
.section-heading h2 { margin: 0; font-size: clamp(40px,5vw,72px); line-height: .9; letter-spacing: -.04em; }
.tour-shell { display: grid; grid-template-columns: minmax(0,1fr) 250px; border: 1px solid rgba(255,255,255,.18); background: #080a0d; box-shadow: 0 30px 70px rgba(0,0,0,.42); }
.tour-viewer { position: relative; min-height: 560px; overflow: hidden; background: #05070a; }
.tour-viewer > img,.tour-reel { position:absolute; inset:0; width: 100%; height: 100%; object-fit: cover; transition: opacity .35s ease; animation:none; transform:none; backface-visibility:hidden; }
.tour-reel { z-index:1; opacity:0; pointer-events:none; }
.tour-viewer.is-film-playing .tour-reel { opacity:1; }
.tour-viewer.is-film-playing > img { opacity:0; }
.tour-viewer.is-changing > img { opacity:.16; transform:none; }
.tour-shade { position: absolute; z-index:2; inset: 0; pointer-events: none; background: linear-gradient(90deg,rgba(0,0,0,.75),transparent 54%), linear-gradient(0deg,rgba(0,0,0,.78),transparent 45%); }
.tour-film-badge { position:absolute; z-index:4; top:18px; left:18px; display:flex; align-items:center; gap:8px; padding:8px 10px; color:#d8dde0; border:1px solid rgba(255,255,255,.23); background:rgba(3,6,8,.75); backdrop-filter:blur(8px); font:800 10px/1 system-ui,sans-serif; letter-spacing:.1em; }
.tour-film-badge i { width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 12px var(--lime); }
.tour-progress { position: absolute; z-index:5; inset: 0 auto auto 0; width: 0; height: 3px; background: var(--orange); box-shadow: 0 0 12px var(--orange); }
.tour-viewer.is-playing .tour-progress { animation: tourTimer 6s linear infinite; }
.tour-copy { position: absolute; z-index:3; left: clamp(22px,4vw,62px); bottom: 86px; max-width: 540px; }
.tour-copy span { color: var(--orange); font: 800 9px/1 system-ui,sans-serif; letter-spacing: .17em; }
.tour-copy h3 { margin: 9px 0 5px; font-size: clamp(38px,5vw,70px); line-height: .88; letter-spacing: -.035em; text-shadow: 4px 4px 0 #000; }
.tour-copy p { max-width:520px; margin:0; color:#d2d6d8; font:500 13px/1.55 system-ui,sans-serif; }
.tour-controls { position: absolute; z-index:4; left: clamp(22px,4vw,62px); bottom: 28px; display: flex; gap: 6px; }
.tour-controls button { min-width: 42px; height: 38px; border: 1px solid rgba(255,255,255,.35); background: rgba(5,7,9,.8); cursor: pointer; }
.tour-controls button:hover { border-color: white; background: #161b21; }
.tour-controls .tour-play { min-width: 148px; padding: 0 18px; color: #090b0d; border-color: var(--orange); background: var(--orange); font-size: 8px; font-weight: 900; letter-spacing: .12em; }
.tour-controls .tour-reel-button { min-width:155px; padding:0 16px; color:#06100b; border-color:var(--lime); background:var(--lime); font-size:10px; font-weight:900; letter-spacing:.08em; }
.tour-stops { display: grid; align-content: start; max-height: 560px; overflow: auto; border-left: 1px solid var(--line); }
.tour-stop { display: grid; grid-template-columns: 39px 1fr; align-items: center; gap: 10px; min-height: 70px; padding: 10px 13px; border: 0; border-bottom: 1px solid var(--line); background: #0d1014; text-align: left; cursor: pointer; }
.tour-stop:hover, .tour-stop.is-active { background: linear-gradient(90deg,rgba(255,106,0,.18),#11151a); }
.tour-stop.is-active { box-shadow: inset 3px 0 var(--orange); }
.tour-stop > b { color: var(--orange); font-size: 17px; }
.tour-stop span { display: grid; gap: 4px; }
.tour-stop span b { font-size: 9px; }
.tour-stop small { color: #697178; font: 700 7px/1 system-ui,sans-serif; letter-spacing: .08em; }
.angle-heading { margin-top: 32px; }
.angle-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 10px; }
.angle-card { position: relative; min-height: 240px; padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.17); background: #080a0c; text-align: left; cursor: pointer; }
.angle-card img { width: 100%; height: 100%; object-fit: cover; filter: saturate(.8) brightness(.7); animation:none; transform:none; transition:filter .25s ease; backface-visibility:hidden; }
.angle-card:hover img, .angle-card.is-active img { transform:none; filter:saturate(1.12) brightness(.93); }
.angle-card > span { position: absolute; inset: auto 0 0; display: grid; padding: 35px 16px 14px; background: linear-gradient(transparent,rgba(0,0,0,.9)); }
.angle-card small { color: var(--orange); font: 800 7px/1 system-ui,sans-serif; letter-spacing: .13em; }
.angle-card b { margin-top: 6px; font-size: 15px; }
.angle-card i { margin-top: 5px; color: #777e84; font: normal 700 7px/1 system-ui,sans-serif; letter-spacing: .1em; }

.signal-vault { width:min(1880px,100%); margin:0 auto; padding:clamp(70px,8vw,130px) clamp(18px,3vw,48px); border-top:1px solid var(--line); background:radial-gradient(circle at 18% 20%,rgba(204,255,0,.055),transparent 34%); }
.signal-vault-heading { display:grid; grid-template-columns:1.15fr .85fr; align-items:end; gap:clamp(28px,6vw,100px); margin-bottom:30px; }
.signal-vault-heading h2 { margin:0; font-size:clamp(54px,7vw,118px); line-height:.82; letter-spacing:-.055em; }
.signal-vault-heading h2 span { color:var(--lime); text-shadow:5px 5px #000; }
.signal-vault-intro { max-width:620px; padding:22px; border-left:3px solid var(--lime); background:rgba(255,255,255,.025); }
.signal-vault-intro p { margin:0; color:#aab0b4; font:600 12px/1.7 system-ui,sans-serif; }
.signal-vault-intro span { display:flex; align-items:center; gap:8px; margin-top:15px; color:#dce1e4; font:900 7px/1 system-ui,sans-serif; letter-spacing:.13em; }
.signal-vault-intro i { width:7px; height:7px; border-radius:50%; background:var(--lime); box-shadow:0 0 15px var(--lime); animation:pulse 1.6s steps(2,end) infinite; }
.signal-vault-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:8px; }
.signal-vault-card { min-width:0; overflow:hidden; color:white; border:1px solid rgba(255,255,255,.16); background:#080b0e; text-decoration:none; }
.signal-vault-card figure { position:relative; aspect-ratio:16/10; margin:0; overflow:hidden; isolation:isolate; background:#030609; }
.signal-vault-card figure::after { content:""; position:absolute; z-index:2; inset:0; pointer-events:none; background:linear-gradient(0deg,rgba(2,4,7,.82),transparent 52%),repeating-linear-gradient(0deg,transparent 0 4px,rgba(255,255,255,.035) 5px); }
.signal-vault-card img { width:100%; height:100%; object-fit:cover; filter:saturate(.82) brightness(.72) contrast(1.1); animation:none; transform:none; transition:filter .3s ease; backface-visibility:hidden; }
.signal-vault-card:hover,.signal-vault-card:focus-visible { border-color:var(--signal-color); outline:none; }
.signal-vault-card:hover img,.signal-vault-card:focus-visible img,.signal-vault-card.is-verified img { filter:saturate(1.12) brightness(.9) contrast(1.06); }
.signal-card-scan { position:absolute; z-index:3; left:0; right:0; top:-25%; height:18%; opacity:.55; pointer-events:none; background:linear-gradient(transparent,rgba(var(--signal-rgb),.58),transparent); mix-blend-mode:screen; animation:signalCardScan 4.8s ease-in-out infinite; animation-delay:calc(var(--motion-index,0) * -.4s); }
.signal-card-reticle { position:absolute; z-index:4; left:var(--focus-x); top:var(--focus-y); width:38px; height:38px; transform:translate(-50%,-50%); border:1px solid var(--signal-color); border-radius:50%; box-shadow:0 0 0 5px rgba(var(--signal-rgb),.13),0 0 25px rgba(var(--signal-rgb),.45); animation:signalReticle 2s ease-in-out infinite; }
.signal-card-reticle::before,.signal-card-reticle::after { content:""; position:absolute; background:var(--signal-color); }
.signal-card-reticle::before { left:50%; top:-8px; bottom:-8px; width:1px; }.signal-card-reticle::after { top:50%; left:-8px; right:-8px; height:1px; }
.signal-card-reticle b { position:absolute; inset:11px; border-radius:50%; background:rgba(var(--signal-rgb),.34); box-shadow:0 0 14px var(--signal-color); }
.signal-vault-card.is-verified .signal-card-reticle { border-radius:2px; animation:none; }
.signal-vault-card figure > em { position:absolute; z-index:5; left:12px; bottom:11px; padding:7px 9px; color:#080a0d; background:var(--signal-color); font:normal 900 6px/1 system-ui,sans-serif; letter-spacing:.11em; }
.signal-card-copy { display:grid; min-height:115px; padding:17px; }
.signal-card-copy small { color:var(--signal-color); font:900 6px/1 system-ui,sans-serif; letter-spacing:.13em; }
.signal-card-copy > b { margin-top:9px; font-size:22px; line-height:.95; letter-spacing:-.02em; }
.signal-card-copy > i { align-self:end; margin-top:13px; color:#757e85; font:normal 800 7px/1.35 system-ui,sans-serif; letter-spacing:.08em; }

.collection-section { width:min(1880px,100%); margin:0 auto; padding:clamp(70px,9vw,150px) clamp(18px,3vw,48px); border-top:1px solid var(--line); }
.collection-heading h2 { margin:0; font-size:clamp(46px,6vw,92px); line-height:.87; letter-spacing:-.045em; }
.collection-ledger { display:grid; grid-template-columns:auto minmax(150px,1fr) auto; align-items:center; gap:18px; margin-bottom:20px; padding:12px 14px; border:1px solid var(--line); background:#0c1014; }
.collection-ledger span { display:grid; gap:5px; }.collection-ledger small { color:#687078; font:800 7px/1 system-ui,sans-serif; letter-spacing:.13em; }.collection-ledger b { font-size:18px; }
.collection-ledger > i { height:4px; overflow:hidden; background:#252a2f; }.collection-ledger > i em { display:block; width:0; height:100%; background:linear-gradient(90deg,var(--orange),var(--pink),var(--cyan),var(--lime)); box-shadow:0 0 14px var(--orange); transition:width .55s ease; }
.collection-ledger button { min-height:34px; padding:0 12px; border:1px solid var(--line); background:transparent; cursor:pointer; color:#7b8389; font-size:7px; font-weight:900; letter-spacing:.1em; }
.figure-grid { display:grid; grid-template-columns:repeat(4,1fr); gap:9px; }
.figure-card { position:relative; overflow:hidden; border:1px solid var(--line); background:linear-gradient(150deg,rgba(var(--figure-rgb),.12),#0b0e12 45%); transition:border-color .25s ease; }
.figure-card:hover { z-index:2; transform:none; border-color:var(--figure-color); }
.figure-visual { position:relative; display:block; width:100%; aspect-ratio:4/5; padding:0; overflow:hidden; border:0; border-bottom:1px solid var(--line); background:radial-gradient(circle at 50% 32%,rgba(var(--figure-rgb),.2),transparent 48%),#05070a; cursor:pointer; }
.figure-visual::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(180deg,transparent 55%,rgba(4,6,8,.94)),repeating-linear-gradient(0deg,transparent 0 4px,rgba(255,255,255,.025) 5px); }
.figure-visual img { width:100%; height:100%; object-fit:cover; animation:none; transform:none; transition:filter .35s ease; backface-visibility:hidden; }
.figure-card:hover img { transform:none; filter:saturate(1.07) contrast(1.04); }
.figure-card.is-locked img { filter:grayscale(1) brightness(.31) contrast(1.15); }
.figure-number { position:absolute; z-index:2; left:12px; top:12px; display:grid; place-items:center; width:36px; height:31px; color:#080a0d; background:var(--figure-color); box-shadow:4px 4px #000; font-size:13px; font-weight:900; }
.figure-play { position:absolute; z-index:2; right:11px; top:14px; padding:7px 9px; opacity:0; color:#080a0d; background:var(--figure-color); font:900 6px/1 system-ui,sans-serif; letter-spacing:.08em; transition:opacity .2s ease; }.figure-visual:hover .figure-play { opacity:1; }
.figure-lock { position:absolute; z-index:2; left:12px; right:12px; bottom:13px; color:var(--figure-color); font:normal 900 7px/1.3 system-ui,sans-serif; letter-spacing:.1em; }
.figure-copy { padding:17px; }.figure-copy > span { color:var(--figure-color); font:900 8px/1 system-ui,sans-serif; letter-spacing:.11em; }.figure-copy h3 { margin:8px 0 4px; font-size:clamp(22px,2.4vw,36px); line-height:.9; letter-spacing:-.035em; }.figure-copy p { min-height:30px; color:#a7aeb3; font:700 9px/1.5 system-ui,sans-serif; letter-spacing:.05em; }
.figure-copy dl { display:grid; grid-template-columns:.65fr 1.35fr; gap:1px; margin:14px 0; background:var(--line); }.figure-copy dl div { display:grid; gap:6px; padding:9px; background:#0a0d10; }.figure-copy dt { color:#5f676d; font:700 6px/1 system-ui,sans-serif; letter-spacing:.1em; }.figure-copy dd { margin:0; font:900 7px/1.3 system-ui,sans-serif; }
.figure-copy a { display:grid; place-items:center; min-height:37px; color:#080a0d; background:var(--figure-color); text-decoration:none; font-size:7px; font-weight:900; letter-spacing:.1em; }
.figure-actions { display:grid; grid-template-columns:1fr 1fr; gap:7px; }
.figure-actions a + a { color:#fff; border:1px solid rgba(255,255,255,.24); background:rgba(255,255,255,.035); }

.video-dialog { width:min(1280px,calc(100vw - 26px)); max-width:none; height:min(780px,calc(100vh - 26px)); max-height:none; padding:0; overflow:hidden; color:white; border:1px solid rgba(255,255,255,.34); background:#05070a; box-shadow:0 40px 120px rgba(0,0,0,.85); }
.video-dialog::backdrop { background:rgba(0,0,0,.88); backdrop-filter:blur(10px); }
.video-dialog-player { position:absolute; inset:0; background:#030507; }.video-dialog-player video { width:100%; height:100%; object-fit:cover; }.video-dialog-player::after { content:""; position:absolute; inset:0; pointer-events:none; background:linear-gradient(90deg,rgba(2,4,7,.9),rgba(2,4,7,.18) 55%,transparent),linear-gradient(0deg,rgba(2,4,7,.86),transparent 46%); }
.video-dialog-scan { position:absolute; inset:0; pointer-events:none; opacity:.18; background:repeating-linear-gradient(0deg,transparent 0 3px,rgba(255,255,255,.08) 4px); }
.video-dialog-copy { position:absolute; z-index:3; left:clamp(24px,5vw,72px); bottom:clamp(30px,7vw,88px); max-width:550px; }.video-dialog-copy > span { color:var(--district-color); font:900 8px/1 system-ui,sans-serif; letter-spacing:.15em; }.video-dialog-copy h2 { margin:10px 0 8px; font-size:clamp(50px,8vw,105px); line-height:.8; letter-spacing:-.05em; text-shadow:6px 6px #000; }.video-dialog-copy p { color:#c4c9cc; font:600 11px/1.6 system-ui,sans-serif; }.video-dialog-copy > div { display:flex; gap:6px; margin-top:17px; }.video-dialog-copy button,.video-dialog-copy a { min-height:42px; display:grid; place-items:center; padding:0 16px; border:1px solid rgba(255,255,255,.36); background:rgba(3,5,8,.75); color:white; text-decoration:none; cursor:pointer; font-size:7px; font-weight:900; letter-spacing:.11em; }.video-dialog-copy a { color:#080a0d; border-color:var(--district-color); background:var(--district-color); }
.map-unlock-form { display:grid; gap:7px; margin-top:15px; padding:12px; border:1px solid color-mix(in srgb,var(--district-color) 60%,transparent); background:rgba(2,4,7,.72); backdrop-filter:blur(8px); }
.map-unlock-form label { color:var(--district-color); font:900 7px/1 system-ui,sans-serif; letter-spacing:.13em; }.map-unlock-form > div { display:grid; grid-template-columns:1fr auto; gap:6px!important; margin:0!important; }.map-unlock-form input { min-width:0; height:40px; padding:0 12px; color:white; border:1px solid rgba(255,255,255,.3); background:#05070a; font:900 11px/1 system-ui,sans-serif; letter-spacing:.1em; text-transform:uppercase; }.map-unlock-form button { min-height:40px!important; color:#080a0d!important; border-color:var(--district-color)!important; background:var(--district-color)!important; }.map-unlock-form small { min-height:11px; color:#c7ccd0; font:800 6px/1.3 system-ui,sans-serif; letter-spacing:.08em; }
.video-dialog-close { position:absolute; z-index:5; right:15px; top:15px; width:44px; height:44px; border:1px solid white; background:rgba(0,0,0,.65); cursor:pointer; font-size:25px; }

.district-dialog { width: min(1180px,calc(100vw - 30px)); max-width: none; height: min(760px,calc(100vh - 30px)); max-height: none; padding: 0; overflow: hidden; border: 1px solid rgba(255,255,255,.3); background: #05070a; color: white; box-shadow: 0 35px 100px rgba(0,0,0,.75); }
.district-dialog::backdrop { background: rgba(0,0,0,.83); backdrop-filter: blur(8px); }
.district-dialog > img { width: 100%; height: 100%; object-fit: cover; }
.dialog-shade { position: absolute; inset: 0; background: linear-gradient(90deg,rgba(0,0,0,.86),transparent 60%), linear-gradient(0deg,rgba(0,0,0,.7),transparent 50%); pointer-events: none; }
.dialog-copy { position: absolute; left: clamp(24px,5vw,72px); bottom: clamp(28px,6vw,80px); max-width: 520px; }
.dialog-copy > span { color: var(--orange); font: 800 9px/1 system-ui,sans-serif; letter-spacing: .16em; }
.dialog-copy h2 { margin: 10px 0 7px; font-size: clamp(42px,7vw,84px); line-height: .86; text-shadow: 5px 5px #000; }
.dialog-copy p { color: #d0d3d6; font: 500 12px/1.6 system-ui,sans-serif; }
.dialog-copy button { margin-top: 12px; padding: 12px 16px; border: 1px solid var(--orange); background: var(--orange); color: #090b0d; font-size: 8px; font-weight: 900; letter-spacing: .12em; cursor: pointer; }
.dialog-close { position: absolute; z-index: 3; right: 16px; top: 16px; width: 42px; height: 42px; border: 1px solid white; background: rgba(0,0,0,.6); font-size: 25px; cursor: pointer; }

footer { display:flex; justify-content:space-between; gap:20px; padding:16px clamp(18px,3vw,48px); color:#858d93; border-top:1px solid var(--line); font-size:8px; font-weight:800; letter-spacing:.14em; }
footer a { color:var(--lime); }
.site-shell > footer:last-of-type { min-height:112px; align-items:flex-start; padding-bottom:78px; }

.city-guide { width:min(1180px,calc(100% - 36px)); margin:72px auto; padding:clamp(24px,4vw,52px); border:1px solid var(--line); background:linear-gradient(145deg,rgba(18,22,27,.98),rgba(8,10,13,.98)); color:#c9ced2; box-shadow:0 30px 80px rgba(0,0,0,.35); }
.city-guide h2,.city-guide h3 { color:#f4f5f2; line-height:1.05; text-transform:uppercase; }
.city-guide h2 { margin:8px 0 16px; font-size:clamp(34px,5vw,72px); }
.city-guide h3 { margin:0 0 12px; font-size:clamp(18px,2vw,26px); }
.city-guide p,.city-guide li { font-size:clamp(14px,1.2vw,17px); line-height:1.65; }
.city-guide a { color:#f4ca16; text-decoration-thickness:1px; text-underline-offset:3px; }
.city-guide > section { padding:34px 0; border-top:1px solid var(--line); }
.city-guide__header { max-width:900px; padding-bottom:34px; }
.city-guide__update { margin:0 0 34px; padding:22px 24px; border-left:4px solid var(--orange); background:rgba(255,106,0,.08); }
.city-guide__update ul { margin:12px 0 0; padding-left:20px; }
.city-guide__table-wrap { overflow-x:auto; margin-top:20px; }
.city-guide table { width:100%; min-width:700px; border-collapse:collapse; text-align:left; }
.city-guide caption { padding:0 0 12px; color:#7f878e; font-size:11px; font-weight:800; letter-spacing:.1em; text-align:left; text-transform:uppercase; }
.city-guide th,.city-guide td { padding:14px 16px; border:1px solid var(--line); }
.city-guide thead th { background:#191e24; color:#fff; font-size:11px; letter-spacing:.08em; text-transform:uppercase; }
.city-guide tbody th { color:#fff; }
.city-guide__faq details { border-top:1px solid var(--line); }
.city-guide__faq details:last-child { border-bottom:1px solid var(--line); }
.city-guide__faq summary { padding:18px 0; color:#fff; cursor:pointer; font-size:15px; font-weight:900; text-transform:uppercase; }
.city-guide__faq details p { margin:0; padding:0 0 20px; max-width:900px; }
.city-guide__byline { display:flex; align-items:center; justify-content:flex-start; gap:18px; padding:28px 0 0; color:#92999f; border:0; font-size:inherit; font-weight:400; letter-spacing:0; }
.city-guide__byline img { width:92px; height:auto; }
.city-guide__byline p { margin:0; font-size:13px; line-height:1.45; }

/* Keep the street-system detail while making labels and actions readable at a glance. */
.city-home :is(.eyebrow,.panel-kicker,.district-type,.tour-copy span,.signal-vault-heading > div > p,.collection-heading > div > p) { font-size:11px; line-height:1.25; }
.city-home :is(.home-waitlist label,.home-drop-link small,.home-bodega-entry small,.home-bodega-entry em,.control-label,.map-display-menu > summary,.map-display-menu > div > span,.map-control-help,.district-marker small,.district-clue small,.map-tip small,.map-tip span,.map-coordinates,.district-lock-veil small,.district-visual figcaption,.district-signals small,.district-index-heading small,.angle-heading small,.index-number,.panel-note b) { font-size:10px; line-height:1.35; }
.city-home :is(.mode-button,.border-button,.fit-tool,.zoom-value,.map-legend,.status-line,.district-index-heading,.angle-heading,.index-item b,.primary-action,.secondary-action,.preview-action,.figure-copy a,.collection-ledger button) { font-size:11px; line-height:1.25; }
.city-home :is(.home-drop-link b,.district-signals b,.index-item small,.panel-note p,.figure-copy p,.tour-copy p,.signal-vault-intro p) { font-size:12px; line-height:1.55; }
.city-home :is(button,a,summary,input,select) { text-rendering:optimizeLegibility; }
.intro-running .city-utility-dock,.intro-running .motion-toggle { opacity:0!important; pointer-events:none!important; transform:translateY(12px)!important; }

@keyframes pulse { 0%,100% { opacity: .55; } 50% { opacity: 1; } }
@keyframes selectedGlow { 0%,100% { opacity: .92; } 50% { opacity: 1; } }
@keyframes tourTimer { from { width: 0; } to { width: 100%; } }
@keyframes districtColorSweep { from { transform:translateX(-18%) scale(.98); } to { transform:translateX(18%) scale(1.04); } }
@keyframes heroSpray { 0% { opacity:0; transform:translateX(-16%); } 30%,72% { opacity:.92; } 100% { opacity:0; transform:translateX(13%); } }
@keyframes wallSurfaceOpen { 0%,22% { opacity:1; transform:scale(1); filter:blur(0); } 100% { opacity:0; transform:scale(1.035); filter:blur(10px); } }
@keyframes wallLogoPaint { 0% { opacity:0; clip-path:inset(0 100% 0 0); } 8% { opacity:.9; } 100% { opacity:1; clip-path:inset(0 0 0 0); } }
@keyframes wallImpactFlash { 0% { opacity:0; transform:translate(-50%,-50%) scale(.3) rotate(0); } 28% { opacity:.95; } 100% { opacity:0; transform:translate(-50%,-50%) scale(1.4) rotate(11deg); } }
@keyframes wallLogoImpact { 0% { opacity:1; transform:translate(-50%,-50%) scale(1); } 38% { opacity:1; transform:translate(-50%,-50%) scale(1.08); filter:brightness(1.7); } 100% { opacity:0; transform:translate(-50%,-50%) scale(1.34); filter:brightness(2.2) blur(5px); } }
@keyframes wallDustBurst { 0% { opacity:0; transform:translate(-50%,-50%) scale(.18); } 22% { opacity:.78; } 100% { opacity:0; transform:translate(-50%,-50%) scale(2.5); } }
@keyframes wallDebrisFly { 0% { opacity:0; transform:translate(-50%,-50%) scale(.4) rotate(0); } 13% { opacity:1; } 100% { opacity:0; transform:translate(calc(-50% + var(--tx)),calc(-50% + var(--ty))) scale(1.05) rotate(var(--rr)); } }
@keyframes wallBreak1 { to { opacity:0; transform:translate3d(-35vw,-43vh,180px) rotate(-13deg); } }
@keyframes wallBreak2 { to { opacity:0; transform:translate3d(37vw,-42vh,150px) rotate(14deg); } }
@keyframes wallBreak3 { to { opacity:0; transform:translate3d(-48vw,-4vh,210px) rotate(-10deg); } }
@keyframes wallBreak4 { to { opacity:0; transform:translate3d(49vw,-1vh,200px) rotate(11deg); } }
@keyframes wallBreak5 { to { opacity:0; transform:translate3d(-36vw,45vh,160px) rotate(12deg); } }
@keyframes wallBreak6 { to { opacity:0; transform:translate3d(38vw,44vh,190px) rotate(-13deg); } }
@keyframes sprayLetterReveal { from { clip-path:inset(0 100% 0 0); } to { clip-path:inset(0 0 0 0); } }
@keyframes sprayMistReveal { 0% { opacity:0; clip-path:inset(0 100% 0 0); } 12% { opacity:.72; } 76% { opacity:.5; clip-path:inset(0 0 0 0); } 100% { opacity:.18; clip-path:inset(0 0 0 0); } }
@keyframes signalCardScan { 0%,12% { top:-25%; opacity:0; } 22% { opacity:.6; } 68% { opacity:.34; } 82%,100% { top:108%; opacity:0; } }
@keyframes signalReticle { 0%,100% { opacity:.62; transform:translate(-50%,-50%) scale(.84); } 50% { opacity:1; transform:translate(-50%,-50%) scale(1.12); } }
@keyframes videoBrandReveal {
  0% { opacity:0; transform:translate(-50%,-50%) scale(.78) rotate(-2deg); filter:blur(5px) drop-shadow(0 0 0 rgba(184,255,0,0)); }
  16%,54% { opacity:.92; transform:translate(-50%,-50%) scale(1) rotate(-1deg); filter:blur(0) drop-shadow(0 0 18px rgba(184,255,0,.2)); }
  100% { opacity:0; transform:translate(-50%,-50%) scale(1.05) rotate(1deg); filter:blur(2px) drop-shadow(0 0 0 rgba(184,255,0,0)); }
}
@keyframes wallGraffitiTag {
  0% { opacity:0; clip-path:inset(0 100% 0 0); filter:blur(2px); }
  18% { opacity:.22; }
  68% { opacity:.62; }
  100% { opacity:.44; clip-path:inset(0 0 0 0); filter:blur(.2px); }
}

@media (max-width: 1240px) {
  .topbar { gap:14px; }
  .site-nav { display:flex; gap:12px; }
  .map-layout { grid-template-columns: 1fr; }
  .map-start-panel { display:grid; grid-template-columns:minmax(260px,.8fr) minmax(320px,1.2fr); }
  .map-start-heading { grid-row:1 / span 2; }
  .home-bodega-entry { grid-column:2; min-height:250px; }
  .home-drop-link { grid-column:1; grid-row:3; }
  .home-waitlist { grid-column:2; grid-row:2; }
  .district-panel { position: static; display: grid; grid-template-columns: minmax(280px,.85fr) 1.15fr; gap: 0 24px; }
  .panel-kicker, .district-visual { grid-column: 1; }
  .district-visual { grid-row: 2 / span 8; align-self: start; }
  .district-panel h2, .district-type, .status-line, .district-copy, .district-actions, .district-signals { grid-column: 2; }
  .district-panel h2 { grid-row: 1; margin-top: 3px; }
  .district-index-heading, .district-index, .panel-note { grid-column: 1 / -1; }
  .district-index { grid-template-columns: repeat(4,1fr); max-height: none; }
  .figure-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 1180px) {
  .topbar-actions .signal { display:none; }
  .brand-copy small { display:none; }
}

@media (max-width: 940px) {
  .site-nav { display:none; }
  .site-menu { display:block; }
}

@media (max-width: 850px) {
  .hero-signal-runner { display:none; }
  .topbar-actions .signal, .network-copy { display: none; }
  .city-network { overflow-x: auto; }
  .network-label { display: none; }
  .city-node { min-width: 178px; }
  .map-heading, .section-heading { align-items: start; flex-direction: column; }
  .map-intro, .section-heading > p { max-width: 650px; }
  .tour-shell { grid-template-columns: 1fr; }
  .tour-viewer { min-height: 470px; }
  .tour-stops { grid-template-columns: repeat(4,1fr); max-height: none; border-left: 0; border-top: 1px solid var(--line); }
  .tour-stop { grid-template-columns: 28px 1fr; min-height: 64px; border-right: 1px solid var(--line); }
  .angle-grid { grid-template-columns: 1fr; }
  .angle-card { min-height: 260px; }
  .signal-vault-heading { grid-template-columns:1fr; }
  .signal-vault-grid { grid-template-columns:repeat(2,1fr); }
}

@media (max-width: 980px) {
  .hero-signal-runner { display:none; }
}

@media (max-width: 680px) {
  #map,#districts,#tour,#collection,#city-wall { scroll-margin-top:104px; }
  .cinematic-hero { height:calc(100svh - 93px); min-height:760px; }
  .hero-film { object-position:50% 46%; }
  .hero-final-frame { background-image:url("/assets/media/posters/hero-mobile.webp"); }
  .hero-feather { background:linear-gradient(180deg,rgba(2,4,7,.72),transparent 34%),linear-gradient(0deg,rgba(2,4,7,.86),transparent 68%); }
  .wall-logo-lockup { width:min(68vw,310px,44vh); max-width:calc(100vw - 56px); }
  .hero-video-brand { width:min(51vw,232px,33vh); top:44%; }
  .wall-graffiti-layer span:first-child { top:12%; left:5%; font-size:clamp(13px,4vw,19px); }
  .wall-graffiti-layer span:nth-child(2) { top:16%; right:4%; font-size:clamp(11px,3.4vw,16px); }
  .wall-graffiti-layer span:nth-child(3) { bottom:9%; left:7%; font-size:clamp(12px,3.7vw,17px); }
  .hero-interface { left:18px; right:18px; top:auto; bottom:274px; width:auto; min-width:0; max-width:calc(100% - 36px); }
  .hero-interface h1 { max-width:100%; font-size:clamp(34px,9.5vw,48px); }
  .hero-kicker { max-width:100%; font-size:8px; line-height:1.2; letter-spacing:.1em; white-space:normal; }
  .hero-deck { width:100%; min-width:0; max-width:none; margin:10px 0 12px; padding:19px 14px 13px; font-size:13px; line-height:1.45; overflow-wrap:anywhere; }
  .hero-deck-guide { margin-bottom:6px; font-size:8px; line-height:1.25; }
  .hero-nav { width:100%; min-width:0; display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:5px; }
  .hero-nav a { min-width:0; min-height:48px; padding:0 5px; font-size:9px; line-height:1.2; white-space:normal; text-align:center; }
  .hero-nav a:first-child { grid-column:auto; }
  .hero-concept::after { position:fixed; z-index:120; left:18px; right:18px; bottom:18px; width:auto; max-width:none; transform:translateY(8px); }
  .hero-concept:hover::after,.hero-concept:focus-visible::after,.hero-concept.is-tip-open::after { transform:translateY(0); }
  .hero-tools { right:10px; top:82px; }
  .hero-scroll { display:none; }
  .topbar { min-height:66px; padding:6px 12px; }
  .brand { gap:8px; }
  .brand-logo { width:60px; height:48px; }
  .brand-copy strong { font-size:19px; }
  .brand-copy small,.member-entry { display:none; }
  .site-menu > summary { min-height:40px; padding:0 12px; }
  .map-layout { padding:22px 12px 36px; }
  .deeds-launch { grid-template-columns:1fr; padding:58px 12px; }.deeds-launch__grid { grid-auto-flow:column; grid-auto-columns:minmax(245px,78vw); grid-template-columns:none; overflow-x:auto; scroll-snap-type:x mandatory; padding-bottom:10px; }.deeds-launch__grid a { min-height:360px; scroll-snap-align:start; }
  h1 { font-size:clamp(38px,11vw,44px); overflow:visible; }
  #mapTitle span { display:inline-block; padding-inline-end:.12em; }
  .control-rail { flex-wrap:wrap; overflow:visible; }
  .control-label { display: none; }
  .mode-button, .border-button, .map-tool,.map-display-menu { flex:0 0 auto; }
  .map-control-help { order:5; width:100%; margin:2px 0 0; padding:5px; }
  .map-start-panel { display:block; }
  .map-start-heading { padding:22px 18px 18px; }
  .home-waitlist { padding:18px; }
  .map-stage { min-width:100%; }
  .map-legend { gap: 11px; }
  .legend-help { width: 100%; margin-left: 0; }
  .district-panel { display: block; }
  .district-index { grid-template-columns: 1fr 1fr; }
  .tour-section { padding: 52px 12px; }
  .tour-viewer { min-height: 430px; }
  .tour-copy { bottom: 78px; }
  .tour-copy h3 { font-size: 42px; }
  .tour-stops { grid-template-columns: 1fr 1fr; }
  .tour-controls { right:14px; left:14px; flex-wrap:wrap; }
  .tour-controls .tour-reel-button,.tour-controls .tour-play { flex:1 1 135px; min-width:0; }
  .signal-vault { padding:60px 12px; }.signal-vault-grid { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(255px,82vw); grid-template-columns:none; overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; padding-bottom:12px; }.signal-vault-card { scroll-snap-align:start; }
  .collection-section { padding:60px 12px; }.collection-ledger { grid-template-columns:1fr; }.collection-ledger button { justify-self:start; }.figure-grid { display:grid; grid-auto-flow:column; grid-auto-columns:minmax(245px,78vw); grid-template-columns:none; overflow-x:auto; overscroll-behavior-inline:contain; scroll-snap-type:x mandatory; padding:0 0 12px; }.figure-card { scroll-snap-align:start; }.figure-visual { aspect-ratio:1/1; }.figure-copy h3 { font-size:30px; }
  .video-dialog-copy { left:20px; right:20px; bottom:25px; }.video-dialog-copy h2 { font-size:52px; }.video-dialog-copy p { font-size:9px; }.video-dialog-player video { object-position:center; }
  footer { display: grid; }
  .city-guide { width:calc(100% - 24px); margin:52px auto; padding:24px 18px; }
  .city-guide__byline { display:flex; }
}

@media (min-width:681px) and (max-height:820px) {
  .hero-interface { top:clamp(48px,8vh,72px); }
  .hero-interface h1 { font-size:clamp(46px,5.8vw,82px); }
  .hero-deck { max-width:820px; margin:14px 0 16px; padding:20px 20px 15px; font-size:15px; line-height:1.42; }
  .hero-nav a { min-height:42px; }
  .hero-signal-runner { display:none; }
  .hero-scroll { bottom:34px; }
}

@media (min-width:681px) and (max-height:620px) {
  .cinematic-hero { min-height:590px; }
  .hero-interface { top:28px; width:min(920px,calc(100% - 48px)); }
  .hero-interface h1 { font-size:clamp(42px,6vw,62px); }
  .hero-kicker { margin-bottom:8px; font-size:8px; }
  .hero-deck { max-width:860px; margin:10px 0 14px; padding:20px 18px 14px; font-size:13px; line-height:1.42; }
  .hero-deck-guide { margin-bottom:5px; font-size:8px; }
  .hero-nav a { min-height:38px; font-size:9px; }
  .hero-tools { top:12px; }
  .wall-graffiti-layer span:nth-child(3) { top:67%; bottom:auto; }
}

@media (max-width: 420px) {
  .cinematic-hero { min-height:780px; }
  .hero-interface h1 { font-size:clamp(32px,9.2vw,38px); }
  .hero-nav a { padding-inline:3px; font-size:8.5px; }
  .figure-actions { grid-template-columns:1fr; }
}

@media (prefers-reduced-motion: reduce) {
  html:not(.motion-ready) *, html:not(.motion-ready) *::before, html:not(.motion-ready) *::after { scroll-behavior: auto !important; transition: none !important; animation: none !important; }
  .hero-film,.hero-spray,.hero-video-brand { display:none; }
  .hero-wall-intro { display:none; }
  .cinematic-hero .hero-final-frame { z-index:1; opacity:1; }
  .cinematic-hero .hero-interface,.cinematic-hero .hero-scroll { opacity:1; transform:none; }
  .spray-line::before { clip-path:inset(0 0 0 0); }
  .spray-line::after { opacity:.18; clip-path:inset(0 0 0 0); }
}

/* Readability pass: preserve the display type while making operational text usable. */
.eyebrow,.panel-kicker,.control-label,.tour-kicker,.signal-vault-heading .eyebrow,.collection-heading .eyebrow { font-size:11px; }
.mode-button,.border-button,.map-tool,.map-display-menu summary,.map-display-menu button { font-size:11px; }
.map-control-help,.legend-help,.panel-note,.status-line,.district-actions button,.district-actions a { font-size:11px; line-height:1.45; }
.district-index small,.district-index em,.tour-stop small,.tour-stop em,.angle-card small,.angle-card i { font-size:10px; line-height:1.35; }
.signal-vault-intro span,.signal-vault-card figure > em,.signal-card-copy small { font-size:10px; }
.signal-card-copy > i { color:#aab1b6; font-size:11px; line-height:1.5; }
.collection-ledger small,.collection-ledger button,.figure-play,.figure-lock,.figure-copy dt,.figure-copy dd,.figure-copy a { font-size:10px; line-height:1.35; }
.figure-copy > span { font-size:11px; }.figure-copy p { font-size:12px; line-height:1.55; }
.video-dialog-copy > span,.map-unlock-form label { font-size:11px; }.video-dialog-copy p { font-size:14px; }.video-dialog-copy button,.video-dialog-copy a,.map-unlock-form button { font-size:11px; }.map-unlock-form small { font-size:10px; }
.dialog-copy > span,.dialog-copy button { font-size:11px; }.dialog-copy p { font-size:14px; }
footer { font-size:11px; line-height:1.45; }

/* MASON loads after the page stylesheet, so these accessibility values are explicit. */
.city-home .mason-launcher b { font-size:12px!important; letter-spacing:.075em!important; }
.city-home .mason-launcher small { font-size:9px!important; letter-spacing:.1em!important; }
.city-home .mason-panel header small,.city-home .mason-log article small,.city-home .mason-panel form label { font-size:10px!important; }
.city-home .mason-panel header b { font-size:15px!important; }
.city-home .mason-log article p { font-size:13px!important; line-height:1.58!important; }
.city-home .mason-log article a,.city-home .mason-chips button,.city-home .mason-panel form button { font-size:10px!important; }
.city-home .mason-panel form > small { color:#a2a9ae!important; font-size:10px!important; line-height:1.45!important; }
.city-home .claim-launcher,.city-home .mason-shell,.city-home .motion-toggle { transition:opacity .28s ease,transform .28s ease; }
.city-home.intro-running .claim-launcher,.city-home.intro-running .mason-shell,.city-home.intro-running .motion-toggle { opacity:0; pointer-events:none; transform:translateY(18px); }
@media (max-width:620px) { .city-home .mason-launcher { width:88px; justify-content:center; padding:6px; } }

/* Responsive home shell: safe areas, touch-scale controls, and a readable pannable map. */
.video-dialog { height:min(780px,calc(100dvh - 26px)); }
.district-dialog { height:min(760px,calc(100dvh - 30px)); }

@media (max-width:1240px) {
  .topbar {
    padding-top:max(10px,env(safe-area-inset-top));
    padding-right:max(18px,env(safe-area-inset-right));
    padding-left:max(18px,env(safe-area-inset-left));
  }
  .site-menu > nav {
    max-height:calc(100dvh - 92px - env(safe-area-inset-top));
    padding-bottom:max(8px,env(safe-area-inset-bottom));
    overflow-y:auto;
    overscroll-behavior:contain;
  }
}

@media (max-width:850px) {
  #map,#districts,#tour,#collection,#city-wall { scroll-margin-top:calc(90px + env(safe-area-inset-top)); }
  .district-panel { scroll-margin-top:calc(84px + env(safe-area-inset-top)); }
  .map-layout {
    padding-right:max(18px,env(safe-area-inset-right));
    padding-left:max(18px,env(safe-area-inset-left));
  }
  .map-viewport {
    overflow:auto;
    overscroll-behavior:contain;
    touch-action:pan-x pan-y pinch-zoom;
    -webkit-overflow-scrolling:touch;
  }
  .map-stage { min-width:max(100%,680px); }
  .home-waitlist input,.home-waitlist select,.map-unlock-form input { font-size:16px; }
  .mode-button,.border-button,.map-tool,.map-display-menu > summary,.map-display-menu button { min-height:44px; touch-action:manipulation; }
  .map-tool { min-width:44px; height:44px; }
  .map-display-menu > summary { min-width:76px; }
  .index-item { min-height:50px; touch-action:manipulation; }
  .primary-action,.secondary-action,.preview-action { min-height:48px; touch-action:manipulation; }
}

@media (max-width:680px) {
  .hero-tools { top:max(82px,calc(env(safe-area-inset-top) + 70px)); right:max(10px,env(safe-area-inset-right)); }
  .hero-tools button { min-height:44px; }
  .topbar {
    min-height:66px;
    padding-top:max(6px,env(safe-area-inset-top));
    padding-right:max(12px,env(safe-area-inset-right));
    padding-bottom:6px;
    padding-left:max(12px,env(safe-area-inset-left));
  }
  .site-menu > summary { min-width:48px; min-height:44px; }
  .site-menu > nav {
    width:min(330px,calc(100vw - 24px - env(safe-area-inset-left) - env(safe-area-inset-right)));
    max-height:calc(100dvh - 76px - env(safe-area-inset-top));
  }
  .city-network {
    padding-right:max(12px,env(safe-area-inset-right));
    padding-left:max(12px,env(safe-area-inset-left));
    overscroll-behavior-inline:contain;
  }
  .map-layout {
    padding-right:max(12px,env(safe-area-inset-right));
    padding-left:max(12px,env(safe-area-inset-left));
  }
  .control-rail { gap:5px; }
  .map-stage { min-width:680px; }
  .map-legend { padding:13px 12px; line-height:1.45; }
  .district-actions { grid-template-columns:1fr; }
  .district-actions .preview-action { grid-column:auto; }
  .video-dialog,.district-dialog { width:calc(100vw - 16px); height:calc(100dvh - 16px); }
  .video-dialog-copy,.dialog-copy {
    right:20px;
    left:20px;
    bottom:max(24px,env(safe-area-inset-bottom));
    max-height:calc(100dvh - 92px);
    overflow-y:auto;
    overscroll-behavior:contain;
  }
  .video-dialog-copy > div { display:grid; grid-template-columns:1fr 1fr; }
  .video-dialog-copy button,.video-dialog-copy a,.dialog-copy button,.map-unlock-form button { min-height:48px; }
  .dialog-close { top:10px; right:10px; width:44px; height:44px; }
  footer {
    padding-right:max(14px,env(safe-area-inset-right));
    padding-bottom:max(20px,env(safe-area-inset-bottom));
    padding-left:max(14px,env(safe-area-inset-left));
  }
}

@media (max-width:420px) {
  .map-unlock-form > div,.video-dialog-copy > div { grid-template-columns:1fr; }
  .map-unlock-form button { width:100%; }
}

@media (max-width:960px) and (max-height:600px) and (orientation:landscape) {
  .cinematic-hero { height:auto; min-height:560px; }
  .hero-interface { top:42px; bottom:auto; }
  .hero-tools { top:max(12px,env(safe-area-inset-top)); }
  .video-dialog,.district-dialog { width:calc(100vw - 12px); height:calc(100dvh - 12px); }
  .video-dialog-copy,.dialog-copy {
    top:max(64px,calc(env(safe-area-inset-top) + 54px));
    right:max(76px,calc(env(safe-area-inset-right) + 58px));
    bottom:max(12px,env(safe-area-inset-bottom));
    left:max(18px,env(safe-area-inset-left));
    max-height:none;
    padding-right:8px;
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
  }
  .video-dialog-copy h2 { margin-block:7px; font-size:clamp(36px,6vw,56px); }
  .dialog-copy h2 { margin-block:7px; font-size:clamp(34px,5.5vw,50px); }
  .video-dialog-copy p,.dialog-copy p { margin-block:7px; font-size:12px; line-height:1.45; }
  .map-unlock-form { gap:5px; margin-top:9px; padding:9px; }
  .map-unlock-form input { min-height:44px; font-size:16px; }
  .video-dialog-copy > div { display:grid; grid-template-columns:1fr 1fr; margin-top:9px; }
  .video-dialog-copy button,.video-dialog-copy a,.dialog-copy button,.map-unlock-form button { min-height:44px; }
  .video-dialog-close,.dialog-close { top:max(10px,env(safe-area-inset-top)); right:max(10px,env(safe-area-inset-right)); width:44px; height:44px; }
}

@media (hover:none),(pointer:coarse) {
  button,a,summary { -webkit-tap-highlight-color:transparent; touch-action:manipulation; }
  .site-nav a,.hero-nav a,.hero-tools button,.member-entry,.site-menu > summary,.mode-button,.border-button,.map-tool,.map-display-menu > summary,.map-display-menu button,.collection-ledger button,.tour-controls button { min-height:44px; }
  .map-tool { min-width:44px; height:44px; }
  .home-waitlist input,.home-waitlist select,.map-unlock-form input { font-size:16px; }
  .home-bodega-entry:hover,.deeds-launch__grid a:hover,.signal-vault-card:hover,.figure-card:hover,.angle-card:hover { transform:none; }
  .district:hover::after { opacity:0; animation:none; }
}

/* Production refinement: preserve the street energy while calming the frame. */
body { font-family:var(--bryk-font-ui); }
h1,h2,h3,.site-nav,.hero-nav { font-family:var(--bryk-font-display); }
.map-heading h2 { margin:0; font-size:clamp(40px,5vw,78px); line-height:.88; letter-spacing:-.045em; text-shadow:3px 3px 0 #000; }
.map-heading h2 span { color:var(--orange); }
.map-layout { width:min(var(--bryk-content-max),100%); }
.map-start-panel,.district-panel,.angle-card,.figure-card,.signal-vault-card { border-color:var(--bryk-line); box-shadow:var(--bryk-shadow-soft); }
.hero-signal-runner a { border-color:var(--bryk-line-strong); box-shadow:0 12px 32px rgba(0,0,0,.36); }
.map-intro,.section-heading>p,.map-start-heading>p:last-child { max-width:var(--bryk-reading-width); }
.primary-action,.secondary-action,.preview-action,.site-menu>summary { transition:background-color .2s ease,border-color .2s ease,color .2s ease,transform .2s ease; }
.angle-card:hover,.figure-card:hover,.signal-vault-card:hover { transform:translateY(-3px); }

@media (max-width:760px) {
  .map-heading h2 { font-size:clamp(40px,13vw,58px); }
  .map-layout { padding-inline:max(16px,env(safe-area-inset-left)); }
}

/* Prelaunch information architecture: fewer choices, clearer routes. */
.home-route-list { display:grid; gap:0; border-top:1px solid var(--bryk-line); border-bottom:1px solid var(--bryk-line); }
.home-route-list a { display:grid; grid-template-columns:42px minmax(0,1fr) 34px; gap:13px; align-items:center; min-height:82px; padding:13px 17px; color:#fff; border-bottom:1px solid var(--bryk-line); background:#090d11; text-decoration:none; }
.home-route-list a:last-child { border-bottom:0; }
.home-route-list a:hover,.home-route-list a:focus-visible { background:rgba(255,100,0,.11); }
.home-route-list > a > b { color:var(--orange); font:1000 23px/1 var(--bryk-font-display); }
.home-route-list span { display:grid; gap:6px; min-width:0; }
.home-route-list small { color:#858e95; font:900 9px/1 var(--bryk-font-ui); letter-spacing:.12em; }
.home-route-list strong { font:950 12px/1.2 var(--bryk-font-ui); letter-spacing:.035em; }
.home-route-list i { display:grid; width:32px; height:32px; place-items:center; color:#080a0d; background:var(--lime); font-style:normal; }
.home-route-note { display:flex; flex-wrap:wrap; gap:8px; margin:0; padding:17px 20px; color:#6f7880; font:850 9px/1.4 var(--bryk-font-ui); letter-spacing:.08em; }
.home-route-note a { color:#dce1e4; text-underline-offset:3px; }

.deeds-launch__grid { grid-template-columns:minmax(0,1fr); }
.deeds-launch__grid a { min-height:0; aspect-ratio:16/9; }
.deeds-launch__grid b { max-width:650px; }

.collection-all-link { margin:26px 0 0; text-align:right; }
.collection-all-link a { display:inline-grid; min-height:48px; place-items:center; padding:0 18px; color:#080a0d; background:var(--lime); text-decoration:none; font:950 10px/1 var(--bryk-font-ui); letter-spacing:.1em; }

.collector-guide-launch { position:relative; isolation:isolate; display:grid; grid-template-columns:minmax(0,1.15fr) minmax(360px,.85fr); min-height:620px; width:min(1740px,calc(100% - 48px)); margin:clamp(72px,8vw,128px) auto; overflow:hidden; border:1px solid var(--bryk-line); background:#070a0d; box-shadow:var(--bryk-shadow-soft); }
.collector-guide-launch picture,.collector-guide-launch picture::after,.collector-guide-launch picture img { position:absolute; inset:0; width:100%; height:100%; }
.collector-guide-launch picture img { object-fit:cover; }
.collector-guide-launch picture::after { content:""; background:linear-gradient(90deg,rgba(5,7,9,.98),rgba(5,7,9,.82) 44%,rgba(5,7,9,.18) 72%); }
.collector-guide-launch__copy { position:relative; z-index:2; grid-column:1; align-self:center; padding:clamp(34px,6vw,94px); }
.collector-guide-launch h2 { margin:10px 0 18px; font:1000 clamp(48px,6.4vw,102px)/.8 var(--bryk-font-display); letter-spacing:-.06em; }
.collector-guide-launch h2 span { color:var(--orange); text-shadow:6px 6px 0 #000; }
.collector-guide-launch__copy > p:not(.eyebrow) { max-width:690px; color:#c3c9cd; font:650 clamp(14px,1.2vw,18px)/1.7 var(--bryk-font-ui); }
.collector-guide-launch ol { display:grid; gap:7px; max-width:700px; margin:28px 0; padding:0; list-style:none; }
.collector-guide-launch li { display:grid; grid-template-columns:38px 1fr; gap:12px; align-items:center; min-height:54px; padding:8px 12px; border:1px solid rgba(255,255,255,.15); background:rgba(7,10,13,.72); }
.collector-guide-launch li b { color:var(--orange); font:1000 20px/1 var(--bryk-font-display); }
.collector-guide-launch li span { font:900 10px/1.35 var(--bryk-font-ui); letter-spacing:.06em; }
.collector-guide-launch__copy > div { display:flex; flex-wrap:wrap; gap:8px; }
.collector-guide-launch__copy > div a { min-height:48px; display:grid; place-items:center; padding:0 17px; color:#080a0d; border:1px solid var(--orange); background:var(--orange); text-decoration:none; font:950 10px/1 var(--bryk-font-ui); letter-spacing:.09em; }
.collector-guide-launch__copy > div a + a { color:#fff; border-color:rgba(255,255,255,.38); background:rgba(6,8,11,.7); }
.collector-guide-launch__copy > small { display:block; margin-top:18px; color:#858e95; font:850 9px/1.5 var(--bryk-font-ui); letter-spacing:.09em; }

@media (max-width:1100px) {
  .map-start-panel { display:block; }
  .deeds-launch { grid-template-columns:1fr; }
  .deeds-launch__grid { grid-auto-flow:initial; grid-template-columns:1fr; overflow:visible; }
  .deeds-launch__grid a { min-height:0; aspect-ratio:16/9; }
  .collector-guide-launch { grid-template-columns:1fr; min-height:720px; }
  .collector-guide-launch__copy { max-width:760px; }
}

@media (max-width:720px) {
  .hero-nav { grid-template-columns:1fr; }
  .home-route-list a { min-height:76px; padding-inline:14px; }
  .deeds-launch__grid { grid-auto-flow:initial; grid-auto-columns:initial; grid-template-columns:1fr; overflow:visible; }
  .deeds-launch__grid a { min-height:0; aspect-ratio:4/3; }
  .collector-guide-launch { width:calc(100% - 24px); min-height:760px; margin:58px auto; align-items:end; }
  .collector-guide-launch picture::after { background:linear-gradient(0deg,rgba(5,7,9,.99),rgba(5,7,9,.9) 56%,rgba(5,7,9,.18) 86%); }
  .collector-guide-launch picture img { object-position:center top; }
  .collector-guide-launch__copy { align-self:end; padding:310px 18px 28px; }
  .collector-guide-launch__copy > div { display:grid; grid-template-columns:1fr; }
  .collector-guide-launch__copy > div a { width:100%; }
  .collection-all-link { text-align:left; }
}

/* Keep the requested founding finish visible from the main collector route. */
.gold-signal-launch { width:min(1740px,calc(100% - 48px)); margin:80px auto; display:grid; grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr); align-items:center; border:1px solid var(--bryk-line); background:#090c10; overflow:hidden; }
.gold-signal-launch__image { display:block; min-width:0; }
.gold-signal-launch picture,.gold-signal-launch img { display:block; width:100%; }
.gold-signal-launch img { height:auto; }
.gold-signal-launch > div { padding:clamp(24px,4vw,64px); }
.gold-signal-launch h2 { margin:14px 0 24px; font:1000 clamp(40px,5.5vw,84px)/.9 var(--bryk-font-display); letter-spacing:-.045em; }
.gold-signal-launch h2 span { color:var(--orange); }
.gold-signal-launch p:not(.eyebrow) { color:#c3c9cd; font:500 16px/1.7 var(--bryk-font-ui); }
.gold-signal-launch__link { display:inline-flex; align-items:center; min-height:48px; margin:12px 0 20px; padding:12px 18px; background:var(--orange); color:#080a0d; text-decoration:none; font:850 14px/1.4 var(--bryk-font-ui); }
.gold-signal-launch small { display:block; color:#a4acb2; font:700 12px/1.5 var(--bryk-font-ui); }
@media(max-width:720px) { .gold-signal-launch { width:calc(100% - 24px); grid-template-columns:1fr; margin:58px auto; } }

#playIntroFilm{position:absolute;z-index:25;top:50%;left:50%;transform:translate(-50%,-50%);min-height:52px;padding:14px 22px;background:#ff6818;color:#0a1015;border:2px solid #ffe5c8;border-radius:4px;font-weight:900;font-size:16px;cursor:pointer}#introPlaybackStatus{position:absolute;z-index:25;top:calc(50% + 36px);left:50%;transform:translateX(-50%);width:min(90%,480px);padding:12px;background:#07101ae8;color:#fff;font-size:16px;text-align:center}#playIntroFilm[hidden],#introPlaybackStatus[hidden]{display:none}