/* All surfaces are CSS geometry. Keep model groups unfiltered to preserve depth. */
.sh-night__skyline { position: absolute; inset: 29% -6% 30%; }
.sh-night__skyline--far { inset: 22% -6% 34%; opacity: .5; }
.sh-night__skyline--far .sh-night__distant-tower { border-top: 0; background: linear-gradient(#141b26, #0f151e); box-shadow: none; }
.sh-night__skyline--far .sh-night__distant-tower::before { display: none; }
.sh-night__distant-tower {
  position: absolute; bottom: 0; border-top: 1px solid #526078;
  background: repeating-linear-gradient(90deg, transparent 0 9px, #161e2a 9px 13px), repeating-linear-gradient(0deg, #1b2533 0 8px, #b9985a24 8px 10px, #1b2533 10px 15px);
  box-shadow: inset -8px 0 #0b111a88;
}
.sh-night__distant-tower::before { content: ''; position: absolute; left: 15%; bottom: 100%; width: 55%; height: 8%; background: #161f2c; }
.sh-night__skyline::after { content: ''; position: absolute; inset: 0; background: linear-gradient(transparent 20%, #121a25cc 76%, #111822); }
.sh-nightfall .sh-model__face::before { opacity: .42; }
.sh-nightfall .sh-model__building--brick { --face-front: #63504a; --face-side: #302e33; --face-left: #493c3a; --face-top: #61616a; }
.sh-nightfall .sh-model__building--stone { --face-front: #8c8c83; --face-side: #4c5660; --face-left: #676e71; --face-top: #8c949c; }
.sh-nightfall .sh-model__building--green { --face-front: #61766c; --face-side: #293e41; --face-left: #3e5652; --face-top: #7b8785; }
.sh-nightfall .sh-model__building--stone > .sh-model__face--front {
  background-image: repeating-linear-gradient(0deg, transparent 0 15px, #282e3a3d 15px 16px), repeating-linear-gradient(90deg, transparent 0 34px, #373d4426 34px 35px);
}
.sh-nightfall .sh-model__building--green > .sh-model__face--front {
  background-image: repeating-linear-gradient(90deg, #a4b4a909 0 1px, transparent 1px 7px), linear-gradient(90deg, #08151c44, transparent 14% 86%, #08151c55);
}
.sh-nightfall .sh-model__coping, .sh-night__stone-ledge { --face-front: #8e948d; --face-side: #4b5862; --face-left: #657572; --face-top: #a0aca7; }
.sh-nightfall .sh-model__cornice { border-bottom-color: #121d2c; box-shadow: 0 4px 5px #07131b66; }
.sh-nightfall .sh-model__floors { gap: 15px 13px; }
.sh-nightfall .sh-model__window { border-color: #687571; border-top-width: 3px; box-shadow: 0 -2px #a5aea166, 0 3px 0 1px #071019bb, 2px 0 2px #09172299, inset 2px 2px 5px #0009; }
.sh-nightfall .sh-model__window::after {
  background: linear-gradient(90deg, transparent 45%, #1c292fe6 46% 52%, transparent 53%), linear-gradient(0deg, transparent 58%, #293735 59% 64%, transparent 65%), linear-gradient(130deg, #9a7650, #ffe2ac);
  box-shadow: 0 0 8px 1px #ebc29033;
}
.sh-nightfall .sh-model__roof-inset { border-color: #3e4e59; background: repeating-linear-gradient(90deg, #3b4750 0 15px, #2c3a45 15px 16px); }
.sh-nightfall .sh-model__roof-light { background: repeating-linear-gradient(90deg, #273944 0 9px, #6c7d82 9px 11px); border-color: #6c797c; }
.sh-night__rear-building { --face-front: #18222d; --face-side: #10171f; --face-left: #141d27; --face-top: #26313d; }
.sh-night__rear-building > .sh-model__face::before { opacity: .12; }
.sh-night__rear-windows { position: absolute; inset: 18px 9px; opacity: .8; background: linear-gradient(180deg, transparent 30%, #18222d 96%), repeating-linear-gradient(90deg, transparent 0 6px, #18222d 6px 14px), repeating-linear-gradient(0deg, #18222d 0 15px, #d9b27a55 15px 22px, #18222d 22px 30px, #18222d 30px 45px, #c9a36a33 45px 52px, #18222d 52px 60px); }
.sh-night__balcony { --face-front: #42525b; --face-side: #202e36; --face-left: #36464d; --face-top: #73817f; }
.sh-night__balcony-rail { position: absolute; left: 0; top: 0; width: 34px; height: 14px; transform-origin: 0 0; border-top: 1.5px solid #8a928a; border-bottom: 1px solid #4f6265; background: repeating-linear-gradient(90deg, #647578 0 1px, transparent 1px 5px); }
.sh-night__roof-vent { --face-front: #4d5a60; --face-side: #2a3944; --face-left: #394a51; --face-top: #708083; }
.sh-night__roof-vent > .sh-model__face--front { background: repeating-linear-gradient(0deg, #485c66 0 2px, #253b46 2px 3px); }
.sh-night__facade-wash { position: absolute; inset: 0; pointer-events: none; background: radial-gradient(ellipse at 20% 100%, #ecc39126, transparent 75%), linear-gradient(100deg, transparent 40%, rgb(83 145 240 / calc(var(--siren) * 24%))); }
.sh-nightfall .sh-model__shop { box-shadow: inset 0 2px 5px #06151c77; border-color: #77847b; }
.sh-nightfall .sh-model__sign { color: #e9d9b2; text-shadow: 0 0 6px #dec38b5c; background: linear-gradient(#101e25, #263a3d); letter-spacing: .7px; }
.sh-nightfall .sh-model__building--green .sh-model__sign { border-color: #bead80; color: #eedeb9; }
.sh-night__interior { position: absolute; inset: 0; overflow: hidden; background: linear-gradient(90deg, #13252b66, transparent 45%), linear-gradient(180deg, #efdbab20, #122129); }
.sh-night__pendant { position: absolute; top: 0; left: 49%; width: 1px; height: 7px; background: #a49f87; }
.sh-night__pendant::after { content: ''; position: absolute; top: 6px; left: -3px; width: 7px; height: 3px; border-radius: 50% 50% 15% 15%; background: #e4cc94; box-shadow: 0 4px 7px 3px #e9cb8838; }
.sh-night__counter { position: absolute; left: 8%; right: 8%; bottom: 3px; height: 7px; border-top: 1px solid #eee0b0; background: linear-gradient(#527174a3 0 55%, #182d33 58%); box-shadow: 0 -3px 8px #dfc89433; }
.sh-night__counter::after { content: ''; position: absolute; left: 30%; top: -5px; width: 3px; height: 4px; background: #ecdaa7; clip-path: polygon(50% 0, 100% 40%, 50% 100%, 0 40%); box-shadow: 7px 0 #f3ddb0; }
.sh-night__door-opening { position: relative; background: linear-gradient(180deg, #09141b, #121f27 70%, #af936133); perspective: 100px; }
.sh-night__door-opening > .sh-model__pane--door { width: 100%; height: 100%; transform-origin: 0 50%; box-sizing: border-box; }
.sh-nightfall .sh-model__road { background: repeating-linear-gradient(4deg, #91a4b405 0 1px, transparent 1px 4px), linear-gradient(110deg, #172934, #0c1c28 50%, #263848); box-shadow: inset 0 9px 12px #0005; }
.sh-nightfall .sh-model__pavement { box-shadow: inset 0 0 0 999px rgb(7 12 19 / 74%); }
.sh-nightfall .sh-model__plinth { display: none; }
.sh-nightfall .sh-model__pavement { left: -380px; width: 1280px; }
.sh-nightfall .sh-model__road { left: -380px; width: 1280px; }
.sh-nightfall .sh-model__crossing { right: 392px; }
.sh-nightfall .sh-model__kerb { left: -380px; }
.sh-nightfall .sh-model__road-lines { opacity: .27; }
.sh-nightfall .sh-model__road-reflection { opacity: .5; }
.sh-night__masonry-pier { --face-front: #718080; --face-side: #22333e; --face-left: #43555e; --face-top: #81918b; }
.sh-night__masonry-pier > .sh-model__face--front { background: repeating-linear-gradient(0deg, transparent 0 10px, #101d2866 10px 11px), var(--face-front); }
.sh-night__weathering { position: absolute; inset: 0; pointer-events: none; background: linear-gradient(90deg, #08131d55, transparent 9% 89%, #08131d55), linear-gradient(0deg, #08131d33, transparent 23% 84%, #07121c44); }
.sh-night__canopy { --face-front: #8a7759; --face-side: #282e30; --face-left: #403e37; --face-top: #62645a; }
.sh-night__canopy > .sh-model__face--roof { background: repeating-linear-gradient(90deg, #61706a 0 13px, #344747 13px 26px); box-shadow: inset 0 -2px #a08e6b; }
.sh-night__bank-column, .sh-night__bank-capital { --face-front: #9b9e94; --face-side: #3e5059; --face-left: #657477; --face-top: #b0b5a5; }
.sh-night__bank-column > .sh-model__face--front { background: repeating-linear-gradient(90deg, #90998e 0 1px, #526366 1px 2px, #a5aa99 2px 3px); }
.sh-night__shop-reflection { position: absolute; height: 112px; opacity: calc(var(--power) * .55); pointer-events: none;
  background: repeating-linear-gradient(0deg, transparent 0 2px, #081623b3 2px 4px), repeating-linear-gradient(90deg, #e8b77888 0 9px, #28414644 9px 13px, #f5d9a077 13px 27px, transparent 27px 38px);
  mask-image: linear-gradient(#0008, #000 10%, transparent 95%); -webkit-mask-image: linear-gradient(#0008, #000 10%, transparent 95%);
}
.sh-night__shop-reflection--1 { height: 75px; opacity: calc(var(--power) * .2); }
.sh-night__shop-reflection--2 { opacity: calc(var(--power) * .37); }
.sh-night__bollard { --face-front: #374853; --face-side: #132530; --face-left: #273d47; --face-top: #84938e; }
.sh-night__bollard > .sh-model__face--front { background: linear-gradient(#52656c 0 12%, #12232e 13% 17%, #354651 18% 78%, #819087 79% 83%, #253640 84%); }
.sh-night__manhole { position: absolute; width: 24px; height: 24px; border-radius: 50%; border: 1px solid #53657099; background: repeating-linear-gradient(90deg, transparent 0 3px, #8a9ba633 3px 4px), repeating-linear-gradient(0deg, #172934 0 3px, #81939d33 3px 4px); box-shadow: 0 1px #a6bbbe22; }
.sh-night__steam { position: absolute; width: 38px; height: 46px; transform-origin: 0 0; pointer-events: none; }
.sh-night__steam-wisp { position: absolute; inset: 0; border-radius: 50%; opacity: .2; background: radial-gradient(ellipse at 50% 80%, #bfd5d84d, transparent 68%); }
.sh-nightfall.is-haunted .sh-night__steam-wisp { animation: sh-steam 7s var(--delay) ease-out infinite; }
@keyframes sh-steam { 0% { opacity: 0; transform: translate(0, 9px) scale(.6); } 25% { opacity: .45; } 100% { opacity: 0; transform: translate(-13px, -19px) scale(1.4); } }
.sh-night__puddle { position: absolute; left: 0; top: 0; border-radius: 50%; border-top: .7px solid #a2bed92e; background: radial-gradient(ellipse, rgb(80 133 186 / calc(.14 + var(--siren) * .2)), #a0b8c110 52%, #040e18aa 72%); }
.sh-night__lamp-reflection { position: absolute; width: 45px; height: 102px; background: repeating-linear-gradient(0deg, transparent 0 3px, #071a2355 3px 5px), radial-gradient(ellipse at 50% 0, #ffe1a989, #9b8e6855 48%, transparent 73%); opacity: var(--power); }
.sh-night__lamp-shaft { position: absolute; width: 58px; height: 105px; transform-origin: 50% 0; clip-path: polygon(46% 0, 54% 0, 100% 100%, 0 100%); background: linear-gradient(#fff1c944, #f3d3a508 85%, transparent); pointer-events: none; }
.sh-night__drain { position: absolute; width: 18px; height: 4px; border: .7px solid #617a85; background: repeating-linear-gradient(90deg, #06151e 0 2px, #485d64 2px 3px); }
.sh-night__rain { position: absolute; inset: 0; z-index: 2; overflow: hidden; pointer-events: none; opacity: .34; transition: opacity var(--sh-dur-3); }
.sh-night__sheet { position: absolute; inset: -40% -10% 0; opacity: .5; background: repeating-linear-gradient(104deg, transparent 0 13px, rgb(199 219 237 / 22%) 13px 14px, transparent 14px 31px, rgb(199 219 237 / 12%) 31px 32px, transparent 32px 57px); -webkit-mask-image: repeating-linear-gradient(180deg, #000 0 26px, transparent 26px 64px); mask-image: repeating-linear-gradient(180deg, #000 0 26px, transparent 26px 64px); }
.sh-night__sheet--far { opacity: .28; transform: scale(.7); }
.sh-nightfall.is-haunted .sh-night__sheet { animation: sh-rain-sheet .9s linear infinite; }
.sh-nightfall.is-haunted .sh-night__sheet--far { animation: sh-rain-far 1.4s linear infinite; }
@keyframes sh-rain-sheet { from { translate: 0 0; } to { translate: -16px 64px; } }
@keyframes sh-rain-far { from { translate: 0 0; } to { translate: -11.2px 44.8px; } }
.sh-night__drop { position: absolute; width: 1px; height: var(--length); background: linear-gradient(transparent, #c7dbed99); transform: rotate(14deg); }
.sh-nightfall.is-haunted .sh-night__drop { animation: sh-night-rain var(--speed) var(--delay) linear infinite; }
@keyframes sh-night-rain { from { transform: translate3d(60px, -120px, 0) rotate(14deg); } to { transform: translate3d(-80px, 380px, 0) rotate(14deg); } }
.sh-nightfall .sh-heist-car--getaway .sh-heist-car__body { --face-front: #233a43; --face-side: #17272e; --face-left: #22333e; --face-top: #586d74; }
.sh-nightfall .sh-heist-car__beam { width: 105px; background: linear-gradient(90deg, #e4edce60, #d2e6e312 60%, transparent); }
.sh-nightfall .sh-heist-car__wheel::after { transform: rotate(var(--wheel-turn, 0deg)); }
.sh-nightfall .sh-heist-car--getaway .sh-heist-car__taillight { box-shadow: 0 0 calc(3px + var(--braking, 0) * 4px) rgb(248 73 52 / 65%); background: #e8664b; }
.sh-nightfall .sh-heist-car--getaway .sh-heist-car__body > .sh-model__face--front { background-image: linear-gradient(0deg, #06141c 0 16%, transparent 22% 55%, #bbcbc138 72%, transparent 78%); }
.sh-nightfall .sh-heist-car--police .sh-heist-car__lightbar > .sh-model__face::after { background: #8dcaff; }
.sh-night__car-wake { position: absolute; width: 80px; height: 33px; pointer-events: none; background: radial-gradient(ellipse at 100% 50%, #becedf33, transparent 70%); }
@media (prefers-reduced-motion: reduce) { .sh-night__drop, .sh-night__steam-wisp, .sh-night__sheet { animation: none !important; } }
.sh-nightfall .sh-model__sign.is-neon-amber { color: #ffe3a8; text-shadow: 0 0 2px #fff4d6, 0 0 7px rgb(255 190 100 / calc(var(--power) * 95%)), 0 0 16px rgb(255 160 70 / calc(var(--power) * 70%)); }
.sh-nightfall .sh-model__sign.is-neon-white { color: #eef3ff; text-shadow: 0 0 2px #fff, 0 0 8px rgb(190 214 255 / calc(var(--power) * 85%)); }
.sh-nightfall .sh-model__sign.is-neon-teal { color: #d8fff6; text-shadow: 0 0 2px #f2fffb, 0 0 8px rgb(95 212 196 / calc(var(--power) * 95%)), 0 0 18px rgb(95 212 196 / calc(var(--power) * 60%)); }
.sh-night__neon { position: absolute; left: 10%; right: 10%; top: 15px; height: 1.5px; border-radius: 2px; opacity: var(--power); }
.sh-night__neon--amber { background: #ffd08a; box-shadow: 0 0 6px 1px rgb(255 176 90 / 80%), 0 0 16px 3px rgb(255 150 60 / 45%); }
.sh-night__neon--white { background: #e8efff; box-shadow: 0 0 6px 1px rgb(200 220 255 / 70%); }
.sh-night__neon--teal { background: #b9fff2; box-shadow: 0 0 6px 1px rgb(95 212 196 / 85%), 0 0 18px 3px rgb(95 212 196 / 45%); }
