@keyframes pilot-blink{0%,to{opacity:1}50%{opacity:.25}}[data-site=city]{--bg:#0a0612;--ink:#f6f0ff;--muted:#f6f0ffb8;--line:#f6f0ff2e;--pink:#ff4f8b;--cyan:#4fd8ff;--gut:clamp(16px, 4vw, 56px);--f-display:var(--font-display), "Syncopate", "Arial Black", sans-serif;--f-mono:var(--font-mono), "JetBrains Mono", ui-monospace, monospace;--f-sans:var(--font-sans), "Manrope", system-ui, sans-serif;background:var(--bg);color:var(--ink);font-family:var(--f-sans);-webkit-font-smoothing:antialiased;line-height:1.55}[data-site=city] :focus-visible{outline:2px solid var(--cyan);outline-offset:3px}[data-site=city] .skip-link{z-index:100;background:var(--ink);color:var(--bg);padding:10px 16px;font-weight:700;position:absolute;top:-60px;left:16px}[data-site=city] .skip-link:focus{top:calc(var(--tabs-h) + 12px)}[data-site=city] .track{position:relative}[data-site=city] .stage{top:var(--tabs-h);height:calc(100svh - var(--tabs-h));background:#000;position:sticky;overflow:hidden}[data-site=city] .film{background:#1a1210 url(/media/city/reel-sm/f-001.webp) 50%/cover no-repeat;width:100%;height:100%;display:block;position:absolute;inset:0}[data-site=city] .bg{opacity:0;--t:0;position:absolute;inset:0;overflow:hidden}[data-site=city] .bg-pan{transform:translateX(calc((.5 - var(--t)) * 9%)) scale(1.04);will-change:transform;position:absolute;inset:0 -7%}[data-site=city] .backdrop,[data-site=city] .bg img{width:100%;height:100%;display:block;position:absolute;inset:0}[data-site=city] .bg img{object-fit:cover}[data-site=city] .walker{aspect-ratio:326/673;opacity:0;pointer-events:none;filter:drop-shadow(0 10px 14px #0000008c);height:min(58%,520px);position:absolute;bottom:3.9rem;left:50%;translate:-50%}[data-site=city] .walker canvas{width:100%;height:100%;display:block}[data-site=city] .walker:after{content:"";z-index:-1;background:radial-gradient(#000000b3,#0000 70%);border-radius:50%;height:5%;position:absolute;bottom:-1.5%;left:4%;right:4%}[data-site=city] .scene{opacity:0;--t:0;position:absolute;inset:0}[data-site=city] .scene.first{opacity:1}[data-site=city] .shade{background:linear-gradient(#0000 52%,#08041059 74%,#080410eb),linear-gradient(90deg,#08041099,#0000 55%),linear-gradient(#08041073,#0000 20%);position:absolute;inset:0}[data-site=city] .content{padding:4.6rem var(--gut) 8.6rem;opacity:clamp(0, min(var(--t) * 7 - .5, (1 - var(--t)) * 8), 1);transform:translateY(calc((1 - min(1, var(--t) * 4)) * 24px));grid-template-columns:minmax(0,1.15fr) minmax(0,.85fr);align-items:center;gap:clamp(1.2rem,4vw,4rem);display:grid;position:absolute;inset:0}[data-site=city] .first .content{opacity:clamp(0, (.72 - var(--t)) * 6, 1);align-items:start;transform:none}[data-site=city] .on-reel.k-name .content{align-items:end;padding-bottom:10.5rem}[data-site=city] .on-reel .shade{background:linear-gradient(#0000 50%,#08041040 70%,#080410e6),linear-gradient(90deg,#0804108c,#0000 50%),linear-gradient(#08041080,#0000 22%)}[data-site=city] .last .content{opacity:clamp(0, var(--t) * 7 - .5, 1)}[data-site=city] .content.has-row{grid-template-columns:minmax(0,1fr);align-content:start;gap:0;padding-top:5.6rem}[data-site=city] .scene:not(.on-reel) .content:not(.has-row){grid-template-columns:minmax(0,1fr) clamp(150px,20vw,300px) minmax(0,1fr)}[data-site=city] .scene:not(.on-reel) .content:not(.has-row) .cards{grid-column:3}[data-site=city] .scene:not(.on-reel) .t-title{overflow-wrap:normal;font-size:clamp(1.3rem,3.1vw,3rem)}[data-site=city] .scene:not(.on-reel) .t-num{font-size:clamp(4rem,10vw,9rem)}[data-site=city] .head{min-width:0;position:relative}[data-site=city] .t-num{font-family:var(--f-display);color:#0000;-webkit-text-stroke:2px var(--ac);opacity:.75;pointer-events:none;filter:drop-shadow(0 0 18px color-mix(in srgb, var(--ac) 60%, transparent));font-size:clamp(5rem,15vw,13rem);font-weight:700;line-height:1;position:absolute;top:-.62em;left:-.06em}[data-site=city] .t-title{font-family:var(--f-display);letter-spacing:.04em;text-transform:uppercase;overflow-wrap:anywhere;text-shadow:0 1px 0 var(--ac), 0 2px 0 var(--ac), 0 3px 0 var(--ac), 0 4px 0 var(--ac), 0 5px 0 color-mix(in srgb, var(--ac) 70%, #000), 0 6px 0 color-mix(in srgb, var(--ac) 50%, #000), 0 0 34px color-mix(in srgb, var(--ac) 70%, transparent);margin:0;font-size:clamp(1.7rem,5.2vw,4.6rem);font-weight:700;line-height:1.05;position:relative}[data-site=city] .k-title .content{grid-template-columns:minmax(0,1fr)}[data-site=city] .k-title .t-title{letter-spacing:.08em;white-space:nowrap;overflow-wrap:normal;font-size:clamp(1.5rem,6.6vw,6.4rem)}[data-site=city] .t-sub{font-family:var(--f-mono);letter-spacing:.3em;text-transform:uppercase;color:var(--muted);margin:1rem 0 0;font-size:clamp(.66rem,1.1vw,.86rem)}[data-site=city] .mail{border:1px solid var(--ac);color:var(--ink);font-family:var(--f-mono);overflow-wrap:anywhere;box-shadow:0 0 24px color-mix(in srgb, var(--ac) 45%, transparent);background:#0a0612b3;border-radius:8px;margin-top:1.6rem;padding:.9rem 1.4rem;font-size:clamp(.82rem,1.4vw,1.05rem);text-decoration:none;transition:background-color .2s,transform .2s;display:inline-block}[data-site=city] .mail:hover{background:color-mix(in srgb, var(--ac) 30%, #0a0612);transform:translateY(-2px)}[data-site=city] .cards{align-content:center;gap:.9rem;min-width:0;margin:0;padding:0;list-style:none;display:grid}[data-site=city] .cards.row{grid-template-columns:minmax(0,1fr) clamp(150px,20vw,300px) minmax(0,1fr);align-items:start;margin-top:1.6rem}[data-site=city] .cards.row .card:nth-child(odd){grid-column:1}[data-site=city] .cards.row .card:nth-child(2n){grid-column:3}[data-site=city] .cards.row .card p{font-size:.8rem}[data-site=city] .card{border:1px solid color-mix(in srgb, var(--ac) 70%, transparent);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 0 0 1px #0006, 0 0 26px color-mix(in srgb, var(--ac) 28%, transparent);background:#0c0818c7;border-radius:6px;min-width:0;padding:1rem 1.15rem}[data-site=city] .card-tag{font-family:var(--f-mono);letter-spacing:.22em;text-transform:uppercase;color:var(--ac);margin-bottom:.45rem;font-size:.6rem;display:block}[data-site=city] .card b{font-family:var(--f-display);letter-spacing:.04em;text-transform:uppercase;font-size:clamp(.78rem,1.25vw,1rem);font-weight:700;line-height:1.35;display:block}[data-site=city] .card p{color:var(--muted);margin:.5rem 0 0;font-size:.86rem}[data-site=city] .hud{z-index:20;pointer-events:none;font-family:var(--f-mono);position:absolute;inset:0}[data-site=city] .hud button{pointer-events:auto;font:inherit;color:inherit;cursor:pointer}[data-site=city] .pilot{right:var(--gut);border:1px solid var(--line);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.2em;text-transform:uppercase;background:#0a061299;border-radius:999px;align-items:center;gap:.55rem;min-height:40px;padding:.5rem .95rem;font-size:.62rem;transition:border-color .2s,background-color .2s;display:inline-flex;position:absolute;top:1.1rem}[data-site=city] .pilot:hover{border-color:var(--cyan)}[data-site=city] .pilot i{background:var(--muted);border-radius:50%;width:8px;height:8px}[data-site=city] .pilot[aria-pressed=true]{border-color:var(--cyan);background:#4fd8ff29}[data-site=city] .pilot[aria-pressed=true] i{background:var(--cyan);box-shadow:0 0 10px var(--cyan);animation:1.1s ease-in-out infinite pilot-blink}[data-site=city] .speed{right:var(--gut);letter-spacing:.22em;text-transform:uppercase;color:var(--muted);align-items:baseline;gap:.5rem;margin:0;font-size:.56rem;display:flex;position:absolute;bottom:5.6rem}[data-site=city] .speed b{letter-spacing:.06em;color:var(--ink);font-variant-numeric:tabular-nums;text-shadow:0 0 14px var(--cyan);font-size:1.5rem}[data-site=city] .keys{left:var(--gut);gap:.9rem;display:flex;position:absolute;bottom:5.4rem}[data-site=city] .keys button{letter-spacing:.24em;text-transform:uppercase;min-height:40px;color:var(--muted);background:0 0;border:0;align-items:center;gap:.55rem;padding:0;font-size:.6rem;transition:color .2s;display:inline-flex}[data-site=city] .keys button:hover:not(:disabled),[data-site=city] .keys button.on{color:var(--ink)}[data-site=city] .keys button:disabled{opacity:.35;cursor:default}[data-site=city] .keys kbd{border:1px solid var(--line);width:30px;height:30px;font:inherit;background:#0a061299;border-radius:6px;place-items:center;font-size:.8rem;transition:border-color .2s,box-shadow .2s,background-color .2s;display:grid}[data-site=city] .keys button.on kbd,[data-site=city] .keys button:hover:not(:disabled) kbd{border-color:var(--cyan);background:#4fd8ff33;box-shadow:0 0 14px #4fd8ff99}[data-site=city] .route{left:var(--gut);right:var(--gut);pointer-events:auto;position:absolute;bottom:1.1rem}[data-site=city] .route-line{background:var(--line);height:2px;position:absolute;top:6px;left:6px;right:6px}[data-site=city] .route-line i{background:linear-gradient(90deg,#ff9a3d,#ff4f8b 45%,#b47cff 70%,#4fd8ff);width:0;height:100%;display:block;box-shadow:0 0 10px #ff4f8bcc}[data-site=city] .route ol{justify-content:space-between;margin:0;padding:0;list-style:none;display:flex;position:relative}[data-site=city] .route li{flex:0 0 14px;justify-content:center;display:flex}[data-site=city] .route button{background:0 0;border:0;width:14px;height:14px;padding:0;display:block;position:relative}[data-site=city] .route button:before{content:"";position:absolute;inset:-14px -10px -26px}[data-site=city] .route button i{border:2px solid var(--ac);background:var(--bg);border-radius:50%;width:10px;height:10px;margin:2px;transition:transform .2s,background-color .2s,box-shadow .2s;display:block}[data-site=city] .route li.done i{background:var(--ac)}[data-site=city] .route li.on i{background:var(--ac);box-shadow:0 0 14px var(--ac);transform:scale(1.5)}[data-site=city] .route button span{white-space:nowrap;letter-spacing:.18em;text-transform:uppercase;color:var(--muted);opacity:.75;font-size:.5rem;transition:color .2s,opacity .2s;position:absolute;top:22px;left:50%;translate:-50%}[data-site=city] .route li:first-child span{left:0;translate:0}[data-site=city] .route li:last-child span{left:auto;right:0;translate:0}[data-site=city] .route li.on span,[data-site=city] .route button:hover span{color:var(--ink);opacity:1}[data-site=city] .footer{padding:1.4rem var(--gut) 2rem;border-top:1px solid var(--line);font-family:var(--f-mono);letter-spacing:.08em;color:var(--muted);flex-wrap:wrap;justify-content:space-between;gap:.5rem 2rem;font-size:.68rem;display:flex}@media (max-width:1099px){[data-site=city] .route li:not(.on) span{display:none}}@media (max-width:899px){[data-site=city] .content,[data-site=city] .content.has-row{padding:4.4rem var(--gut) 9.6rem;grid-template-columns:minmax(0,1fr);align-content:end;align-items:end;gap:1rem}[data-site=city] .first .content{align-content:start}[data-site=city] .scene:not(.on-reel) .content:not(.has-row){grid-template-columns:minmax(0,1fr)}[data-site=city] .scene:not(.on-reel) .content:not(.has-row) .cards{grid-column:1}[data-site=city] .content.has-row{padding-top:4.4rem}[data-site=city] .walker{height:34%;inset:3.4rem 2% auto auto;translate:0}[data-site=city] .t-num{-webkit-text-stroke-width:1.5px;font-size:5.4rem}[data-site=city] .scene:not(.on-reel) .t-title{font-size:1.6rem}[data-site=city] .content.has-row{align-content:end;gap:1rem}[data-site=city] .cards.row{scroll-snap-type:x mandatory;margin-top:0;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);scrollbar-width:none;grid-template-columns:none;display:flex;overflow-x:auto}[data-site=city] .cards.row .card{scroll-snap-align:center;flex:0 0 78%}[data-site=city] .card{padding:.8rem .9rem}[data-site=city] .card p{font-size:.8rem}[data-site=city] .speed{bottom:4.6rem}[data-site=city] .speed b{font-size:1.1rem}[data-site=city] .keys{gap:.6rem;bottom:4.3rem}[data-site=city] .route{bottom:1.6rem}[data-site=city] .shade{background:linear-gradient(#08041026 30%,#08041099 55%,#080410f2),linear-gradient(#08041080,#0000 22%)}}@media (prefers-reduced-motion:reduce){[data-site=city] .bg-pan{inset:0;transform:none}[data-site=city] .content{transform:none}[data-site=city] .pilot{display:none}[data-site=city] .pilot[aria-pressed=true] i{animation:none}}@media print{[data-site=city] .track{height:auto!important}[data-site=city] .stage{background:0 0;height:auto;position:static;overflow:visible}[data-site=city] .scene{position:static;opacity:1!important;visibility:visible!important}[data-site=city] .bg,[data-site=city] .film,[data-site=city] .walker,[data-site=city] .shade,[data-site=city] .hud{display:none}[data-site=city] .content{opacity:1;color:#000;padding:1rem 0;position:static;transform:none}}
