html[data-theme=dark] body:has(#homePage:not([hidden])) .shell { width:100%; max-width:none; padding:0; }
html[data-theme=dark] body:has(#homePage:not([hidden])) .shell>header { margin:0; padding:4px clamp(16px,2vw,40px); background:#070c12; }
html[data-theme=dark] body:has(#homePage:not([hidden])) .shell>footer { display:none; }
html[data-theme=dark] #homePage { position:relative; padding:0; margin:0; isolation:isolate; }
html[data-theme=dark] #homePage .city-heading { position:absolute; top:12px; right:16px; z-index:3; padding:0; }
#homePage .city-heading h1,
#homePage .home-city-hit>span { position:absolute; width:1px; height:1px; margin:-1px; overflow:hidden; clip-path:inset(50%); white-space:nowrap; }
html[data-theme=dark] #homePage #homePrimary { padding:7px 10px; font-size:11px; color:#b8c9d5; background:#070e18c9; border-radius:3px; }
#homePage .home-city-stage { position:relative; width:100%; height:calc(100dvh - var(--city-header-height,66px)); min-height:360px; overflow:hidden; background:#02050c; isolation:isolate; }
#homePage .home-intro { position:fixed; inset:0; z-index:100; display:grid; place-items:center; background:#02050c; pointer-events:none; animation:home-intro-out 550ms 1350ms ease-in both; }
#homePage .home-intro-logo { display:block; width:min(68vw,620px); height:auto; animation:home-logo-on 850ms 500ms linear both; }
#homePage .home-city-stage { animation:home-street-in 550ms 1850ms ease-out both; }
@keyframes home-logo-on { 0% { opacity:0; } 1%,8% { opacity:.22; } 20% { opacity:0; } 32% { opacity:.72; } 39% { opacity:.12; } 52% { opacity:1; } 59% { opacity:.55; } 72%,100% { opacity:1; } }
@keyframes home-intro-out { from { opacity:1; visibility:visible; } to { opacity:0; visibility:hidden; } }
@keyframes home-street-in { from { opacity:0; } to { opacity:1; } }
#homePage :is(.home-city-poster,.home-city-world) { position:absolute; inset:0; display:block; width:100%; height:100%; pointer-events:none; }
#homePage .home-city-poster { object-fit:fill; }
#homePage .home-city-world { opacity:0; }
#homePage .home-city-raster { position:absolute; left:0; top:0; display:block; width:100%; height:100%; pointer-events:none; }
#homePage .home-city-raster[hidden] { display:none; }
#homePage .home-city-traffic { contain:strict; }
#homePage.is-city-ready .home-city-world { opacity:1; }
#homePage.is-city-ready .home-city-poster { visibility:hidden; }
#homePage .home-city-entrances { display:contents; }
#homePage .home-city-hit {
  position:absolute; left:var(--sign-x); top:var(--sign-y); width:var(--sign-width); height:var(--sign-height);
  display:block; padding:0; margin:0; min-height:0; border:0; border-radius:0; outline:0;
  background:transparent; box-shadow:none; color:inherit; transform:none; cursor:pointer;
  clip-path:var(--sign-shape,inset(0)); z-index:1; list-style:none;
}
#homePage .home-city-hit::before,
#homePage .home-city-hit::after { display:none; }
#homePage .home-city-hit:is(:hover,:focus-visible,:active) { background:transparent; box-shadow:none; outline:0; transform:none; }
#homePage .home-city-hit svg { display:block; width:100%; height:100%; pointer-events:none; }
#homePage .home-city-hit polygon { fill:none; stroke:transparent; stroke-width:4; vector-effect:non-scaling-stroke; }
#homePage .home-city-hit:focus-visible polygon { stroke:#d5eef0; }
#homePage [data-city-sign=practice] { --sign-x:9.31%; --sign-y:26.37%; --sign-width:20.58%; --sign-height:24.41%; }
#homePage [data-city-sign=record] { --sign-x:77.54%; --sign-y:13.18%; --sign-width:18.03%; --sign-height:34.28%; }
#homePage [data-city-sign=records] { --sign-x:5.40%; --sign-y:68.65%; --sign-width:8.07%; --sign-height:21.09%; }
#homePage [data-city-sign=tuner] { --sign-x:88.35%; --sign-y:68.94%; --sign-width:10.29%; --sign-height:27.54%; }
#homePage [data-city-sign=notice] { --sign-x:32.16%; --sign-y:36.52%; --sign-width:5.27%; --sign-height:32.03%; }
#homePage .neon-part { position:absolute; contain:strict; will-change:opacity; transition:filter 150ms; }
#homePage .neon-part[data-highlight] { filter:brightness(1.22); }
#homePage .neon-part[data-pressed] { filter:brightness(.45); }
#homePage .home-city-billboard { position:absolute; left:47.786%; top:23.242%; width:18.555%; height:20.41%; margin:0; padding:0; pointer-events:none; }
#homePage .home-city-ad-slot { position:absolute; inset:0; }
#homePage :is(.home-city-ad-label,.home-city-ad-caption) { position:absolute; z-index:1; padding:3px 5px; color:#adb8cc; background:#080e1ba8; font-size:clamp(9px,.7vw,12px); line-height:1.4; }
#homePage .home-city-ad-label { top:0; left:0; }
#homePage .home-city-ad-caption { bottom:0; right:0; }
#homePage .home-city-motion { position:absolute; bottom:12px; right:16px; z-index:2; min-width:30px; min-height:30px; padding:4px 8px; border:1px solid #354456; border-radius:3px; background:#070e18d9; color:#b8c9d5; font-size:12px; }
#homePage .home-city-motion:focus-visible { outline:2px solid #acdde4; outline-offset:3px; }
#homePage .home-city-motion:disabled { opacity:.5; cursor:default; }
#homePage .home-city-status { position:absolute; top:56px; right:16px; z-index:3; max-width:300px; padding:10px 14px; background:#070e18ed; color:#becbd7; font-size:12px; }
html[data-theme=dark] #homePage .city-history { position:absolute; bottom:0; left:28%; right:28%; z-index:4; padding:5px 14px; max-height:50%; overflow:auto; border:1px solid #293648; border-bottom:0; border-radius:5px 5px 0 0; background:#080f1cdb; }
html[data-theme=dark] #homePage .city-history>summary { padding:3px 0; font-size:11px; }
@media(prefers-reduced-motion:reduce) {
  #homePage .home-intro { display:none; animation:none; }
  #homePage :is(.home-intro-logo,.home-city-stage) { animation:none; }
  #homePage .neon-part { transition:none; }
}