.demoPage{color:#f4f7ff;background:radial-gradient(circle at 20% 10%,#79f4ff14,#0000 60%),radial-gradient(circle at 85% 80%,#ff6ab814,#0000 65%),#05060d;flex-direction:column;gap:1rem;min-height:100vh;padding:1rem 1rem 1.5rem;font-family:system-ui,-apple-system,Segoe UI,sans-serif;transition:background .6s,color .6s;display:flex;position:relative;overflow-x:hidden}.demoPage[data-day=day]{color:#1b1530;background:radial-gradient(circle at 20% 10%,#ffdc8c2e,#0000 60%),radial-gradient(circle at 85% 80%,#ff9a601f,#0000 65%),#f0e6d2}.demoPage[data-day=day] .demoStageBg{filter:brightness(1.55)contrast(.92)saturate(1.1)hue-rotate(-12deg)sepia(.18);transition:filter .6s}.demoStageBg{transition:filter .6s}.demoPage[data-day=day] .demoAmbient{opacity:.12}.demoPage[data-day=day] .demoBuildingImg{filter:drop-shadow(0 6px 12px #503c1e59)brightness(1.15)saturate(.95)}.demoPage[data-day=day] .demoStage{background:#efe2c4;box-shadow:inset 0 0 0 1px #503c1e1f,0 30px 80px -40px #503c1e66}.demoPage[data-day=day] .demoBrandLogo{filter:drop-shadow(0 0 6px #ff9a6080)invert(.85)hue-rotate(-20deg)}.demoPage[data-day=day] .demoBrandCity{color:#c2185b;text-shadow:0 0 4px #c2185b66}.demoPage[data-day=day] .demoToggle{color:#5a4030;background:#fff5dcd9;border-color:#96643c4d}.demoPage[data-day=day] .demoToggle:hover{color:#c2185b;border-color:#c2185b;box-shadow:0 0 12px #c2185b40}.demoPage[data-day=day] .demoLangChip.isOn{color:#c2185b;text-shadow:0 0 4px #c2185b66}.demoPage[data-day=day] .demoTrayHeading{color:#2b1f3a;text-shadow:0 1px 4px #fff9}.demoPage[data-day=day] .demoTray{background:linear-gradient(#f0e6d200 0%,#f0e6d28c 40%,#f0e6d2eb 100%)}.demoHeader{letter-spacing:.18em;text-transform:uppercase;color:#9aa6c9;justify-content:space-between;align-items:center;font-size:.75rem;display:flex}.demoBrand{align-items:baseline;gap:.5rem;line-height:1;display:flex}.demoBrandLogo{object-fit:contain;filter:drop-shadow(0 0 8px #79f4ff66);width:auto;height:1.6rem}.demoBrandCity{letter-spacing:.42em;text-transform:lowercase;color:#ff6ab8;text-shadow:0 0 6px #ff6ab88c,0 0 14px #ff6ab84d;font-family:JetBrains Mono,Fira Code,ui-monospace,monospace;font-size:.62rem;position:relative;top:-.15rem}.demoSplash{z-index:9999;pointer-events:none;background:radial-gradient(circle,#0f1224f2,#02030a 75%);flex-direction:column;justify-content:center;align-items:center;gap:1.2rem;animation:.42s 2.4s forwards demoSplashOut;display:flex;position:fixed;inset:0;overflow:hidden}.demoSplashScanlines{pointer-events:none;mix-blend-mode:screen;background:repeating-linear-gradient(#79f4ff00 0 2px,#79f4ff0d 3px,#79f4ff00 4px);animation:6s linear infinite demoSplashScan;position:absolute;inset:0}.demoSplashGrid{opacity:.55;pointer-events:none;background:linear-gradient(#79f4ff14 1px,#0000 1px) 0 0/40px 40px,linear-gradient(90deg,#ff6ab80f 1px,#0000 1px) 0 0/40px 40px;animation:5s linear infinite demoSplashGridScroll;position:absolute;inset:-10%;transform:perspective(420px)rotateX(58deg)translateY(18%);-webkit-mask-image:radial-gradient(#000 30%,#0000 70%);mask-image:radial-gradient(#000 30%,#0000 70%)}.demoSplashLogoWrap{justify-content:center;align-items:center;width:8rem;height:8rem;display:flex;position:relative}.demoSplashLogo{object-fit:contain;filter:drop-shadow(0 0 24px #79f4ff8c)drop-shadow(0 0 48px #ff6ab859);width:100%;height:100%;animation:1.6s ease-in-out infinite demoSplashPulse,4s steps(8,end) infinite demoSplashFlicker}.demoSplashGlitch{color:#ff6ab8;opacity:0;mix-blend-mode:screen;text-shadow:0 0 12px #ff6ab8b3;pointer-events:none;justify-content:center;align-items:center;font-family:JetBrains Mono,monospace;font-size:5.5rem;font-weight:800;animation:2.4s steps(2,end) infinite demoSplashGlitch;display:flex;position:absolute;inset:0}.demoSplashLabel{letter-spacing:.5em;text-transform:lowercase;color:#79f4ff;text-shadow:0 0 10px #79f4ff80;opacity:0;font-family:JetBrains Mono,Fira Code,ui-monospace,monospace;font-size:.78rem;animation:.6s .2s forwards demoSplashLabelIn;position:relative}.demoSplashBoot{letter-spacing:.08em;color:#79f4ffbf;text-align:left;flex-direction:column;gap:.18rem;min-width:12rem;font-family:JetBrains Mono,Fira Code,ui-monospace,monospace;font-size:.62rem;display:flex;position:relative}.demoSplashBootLine{opacity:0;animation:.26s forwards demoSplashBootIn;transform:translate(-4px)}.demoSplashBootLine:first-child{animation-delay:.35s}.demoSplashBootLine:nth-child(2){animation-delay:.8s}.demoSplashBootLine:nth-child(3){animation-delay:1.3s}.demoSplashBootLine:nth-child(4){color:#ff6ab8;text-shadow:0 0 6px #ff6ab880;animation-delay:1.9s}.demoSplashBar{background:#79f4ff1f;border-radius:999px;width:14rem;height:4px;position:relative;overflow:hidden;box-shadow:0 0 10px #79f4ff33}.demoSplashBarFill{background:linear-gradient(90deg,#79f4ff,#ff6ab8);width:0%;transition:width .32s cubic-bezier(.4,0,.2,1);position:absolute;top:0;bottom:0;left:0;box-shadow:0 0 10px #79f4ff99,0 0 18px #ff6ab873}@keyframes demoSplashPulse{0%,to{filter:drop-shadow(0 0 24px #79f4ff8c)drop-shadow(0 0 48px #ff6ab859);transform:scale(1)}50%{filter:drop-shadow(0 0 32px #79f4ffbf)drop-shadow(0 0 64px #ff6ab88c);transform:scale(1.04)}}@keyframes demoSplashFlicker{0%,to,92%,96%{opacity:1}93%{opacity:.5}95%{opacity:.85}}@keyframes demoSplashGlitch{0%,to{opacity:0;transform:translate(0)}10%{opacity:.5;transform:translate(-2px,1px)}12%{opacity:0}48%{opacity:0;transform:translate(0)}50%{opacity:.45;transform:translate(2px,-1px)}52%{opacity:0}}@keyframes demoSplashScan{0%{background-position-y:0}to{background-position-y:200px}}@keyframes demoSplashGridScroll{0%{background-position-y:0}to{background-position-y:40px}}@keyframes demoSplashBootIn{to{opacity:1;transform:translate(0)}}@keyframes demoSplashBarFill{0%{width:0%}20%{width:18%}45%{width:42%}72%{width:70%}to{width:100%}}@keyframes demoSplashLabelIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}@keyframes demoSplashOut{to{opacity:0;visibility:hidden}}.demoBadge{background:#79f4ff0f;border:1px solid #79f4ff40;border-radius:999px;padding:.3rem .7rem}.demoToggles{align-items:center;gap:.5rem;display:flex}.demoToggle{color:#c8d1eb;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;background:#080a16b3;border:1px solid #79f4ff40;border-radius:999px;align-items:center;gap:.4rem;padding:.35rem .7rem;font-family:JetBrains Mono,Fira Code,ui-monospace,monospace;font-size:.62rem;transition:all .18s;display:inline-flex}.demoToggle:hover{color:#79f4ff;border-color:#79f4ff;box-shadow:0 0 12px #79f4ff4d}.demoToggleIcon{font-size:.85rem;line-height:1}.demoLangChip{color:#6a7596;padding:0 .2rem;transition:color .18s,text-shadow .18s}.demoLangChip.isOn{color:#79f4ff;text-shadow:0 0 6px #79f4ff8c}.demoStageWrap{justify-content:center;width:100%;display:flex}.demoTray{z-index:800;pointer-events:none;background:linear-gradient(#05060d00 0%,#05060d8c 40%,#05060dd9 100%);flex-direction:column;gap:.45rem;padding:1.6rem .85rem .7rem;display:flex;position:absolute;bottom:0;left:0;right:0}.demoTray>*{pointer-events:auto}.demoTrayHeading{letter-spacing:.22em;text-transform:uppercase;color:#c8d1eb;text-shadow:0 2px 8px #000000b3;margin:0;padding:0 .25rem;font-size:.62rem}.demoCardRailWrap{width:100%;position:relative}.demoCardRailArrow{color:#79f4ff;cursor:pointer;z-index:6;background:#080a16d9;border:1px solid #79f4ff59;border-radius:999px;justify-content:center;align-items:center;width:2.2rem;height:2.2rem;font-size:1.4rem;line-height:1;transition:all .18s;animation:.18s demoArrowFade;display:flex;position:absolute;top:50%;transform:translateY(-50%);box-shadow:0 4px 14px #00000059,0 0 12px #79f4ff40}.demoCardRailArrow:hover{background:#0f1224f2;border-color:#79f4ff;box-shadow:0 4px 18px #0006,0 0 18px #79f4ff80}.demoCardRailArrow.isLeft{left:-.4rem}.demoCardRailArrow.isRight{right:-.4rem}.demoCardRail{scroll-snap-type:x mandatory;scrollbar-width:thin;gap:.65rem;padding:.25rem .25rem .5rem;display:flex;overflow-x:auto}.demoCardRail::-webkit-scrollbar{height:6px}.demoCardRail::-webkit-scrollbar-thumb{background:#79f4ff40;border-radius:999px}.demoCard{scroll-snap-align:start;color:#eef2ff;text-align:left;cursor:pointer;background:linear-gradient(#14182ceb,#0a0d1aeb);border:1px solid #9aa6c91f;border-radius:14px;flex-direction:row;flex-shrink:0;gap:.6rem;width:16rem;min-height:9rem;padding:.7rem .8rem;transition:all .2s;display:flex;position:relative;overflow:hidden}.demoCard:hover{border-color:color-mix(in srgb, var(--card-accent) 55%, transparent);transform:translateY(-2px)}.demoCard.isSelected{border-color:var(--card-accent);box-shadow:0 0 22px color-mix(in srgb, var(--card-glow) 45%, transparent);background:linear-gradient(180deg, color-mix(in srgb, var(--card-accent) 12%, #14182ceb), #0a0d1aeb)}.demoCard.isFeatured{width:18rem}.demoCardText{flex-direction:column;flex:1;gap:.25rem;min-width:0;display:flex}.demoCardTag{letter-spacing:.18em;text-transform:uppercase;color:var(--card-accent);margin:0;font-size:.58rem}.demoCard h2{letter-spacing:.02em;color:#fff;margin:0;font-size:1rem}.demoCardDescription{color:#c0c8e6;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.72rem;line-height:1.35;display:-webkit-box;overflow:hidden}.demoCardFooter{letter-spacing:.12em;text-transform:uppercase;color:#93a0c4;justify-content:space-between;gap:.4rem;margin-top:auto;font-size:.58rem;display:flex}.demoCardFooter span:last-child{color:var(--card-accent)}.demoCardVisual{flex-shrink:0;justify-content:center;align-items:flex-end;width:4.4rem;display:flex}.demoCardVisual img{object-fit:contain;filter:drop-shadow(0 4px 8px #0006);width:100%;height:auto}@keyframes demoArrowFade{0%{opacity:0}to{opacity:1}}.demoStage{background:#0a0d1c;border-radius:18px;width:100%;max-width:1280px;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #79f4ff14,0 30px 80px -40px #000000b3}.demoStageBg{object-fit:cover;pointer-events:none;-webkit-user-select:none;user-select:none}.demoAmbient{pointer-events:none;z-index:50;mix-blend-mode:screen;transition:opacity .32s;position:absolute;inset:0}.demoStage:has(.demoBuilding.isSelected) .demoAmbient{opacity:.45}.demoAmbientLight{opacity:0;will-change:opacity, transform;border-radius:50%;animation-name:demoAmbientFlicker;animation-timing-function:ease-in-out;animation-iteration-count:infinite;position:absolute}.demoAmbientTrail{filter:blur(.5px)drop-shadow(0 0 4px #79f4ff80);opacity:0;background:linear-gradient(90deg,#0000 0%,#79f4ffa6 30%,#fffffff2 55%,#ff6ab88c 75%,#0000 100%);width:6rem;height:1px;animation-name:demoAmbientTrail;animation-timing-function:linear;animation-iteration-count:infinite;position:absolute;left:-10%}.demoAmbientTrail.isReverse{background:linear-gradient(90deg,#0000 0%,#ff6ab88c 25%,#fffffff2 45%,#79f4ffa6 70%,#0000 100%);animation-name:demoAmbientTrailReverse}@keyframes demoAmbientFlicker{0%,to{opacity:.15;transform:scale(1)}20%{opacity:.85;transform:scale(1.4)}35%{opacity:.25}55%{opacity:1;transform:scale(1.6)}75%{opacity:.4;transform:scale(1)}}@keyframes demoAmbientTrail{0%{opacity:0;transform:translate(0)}6%{opacity:.85}90%{opacity:.7}to{opacity:0;transform:translate(120vw)}}@keyframes demoAmbientTrailReverse{0%{opacity:0;transform:translate(120vw)scaleX(-1)}6%{opacity:.85}90%{opacity:.7}to{opacity:0;transform:translate(0)scaleX(-1)}}.demoBuilding{cursor:pointer;will-change:transform, filter;background:0 0;border:0;justify-content:center;align-items:flex-end;margin:0;padding:0;transition:transform .24s,filter .24s,opacity .24s;display:flex;position:absolute}.demoBuildingImg{object-fit:contain;filter:drop-shadow(0 6px 12px #00000073);pointer-events:none;transition:filter .24s}.demoBuildingGlow{background:radial-gradient(ellipse at center, color-mix(in srgb, var(--card-glow) 40%, transparent) 0%, color-mix(in srgb, var(--card-glow) 18%, transparent) 35%, transparent 70%);opacity:0;pointer-events:none;border-radius:50%;transition:opacity .28s;position:absolute;inset:-10% -8% -4%}.demoBuilding:hover{transform:translateY(-4px)scale(1.03)}.demoBuilding:hover .demoBuildingGlow{opacity:.7}.demoBuilding.isSelected{filter:drop-shadow(0 0 18px var(--card-glow));z-index:999!important}.demoBuilding.isSelected .demoBuildingGlow{opacity:1;animation:2.4s ease-in-out infinite demoPulse}.demoBuilding.isSelected .demoBuildingImg{filter:drop-shadow(0 8px 18px #0000008c) drop-shadow(0 0 8px var(--card-glow))}.demoBuilding.isDimmed{opacity:.35;filter:grayscale(.45)brightness(.7)}@keyframes demoPulse{0%,to{opacity:.85;transform:scale(1)}50%{opacity:1;transform:scale(1.08)}}.demoChips{flex-wrap:wrap;justify-content:center;gap:.45rem;padding:0 .5rem;display:flex}.demoChip{color:#c8d1eb;letter-spacing:.16em;text-transform:uppercase;cursor:pointer;background:#0f1224b3;border:1px solid #9aa6c933;border-radius:999px;padding:.45rem .85rem;font-size:.72rem;transition:all .18s}.demoChip:hover{border-color:color-mix(in srgb, var(--card-accent) 50%, transparent);color:var(--card-accent)}.demoChip.isActive{background:color-mix(in srgb, var(--card-accent) 18%, #0f1224b3);border-color:var(--card-accent);color:var(--card-accent);box-shadow:0 0 14px color-mix(in srgb, var(--card-accent) 35%, transparent)}.demoModalLayer{z-index:100;pointer-events:none;justify-content:center;align-items:flex-end;display:flex;position:fixed;inset:0}.demoModalBackdrop{cursor:pointer;pointer-events:auto;background:#02040c8c;border:0;animation:.2s demoFadeIn;position:absolute;inset:0}.demoStage:has(.demoBuilding.isSelected) .demoStageBg{filter:blur(6px)brightness(.65);transition:filter .24s}.demoStage:has(.demoBuilding.isSelected) .demoBuilding.isDimmed{filter:blur(3px)grayscale(.45)brightness(.7)}.demoModal{pointer-events:auto;border:1px solid color-mix(in srgb, var(--card-accent) 30%, transparent);width:min(28rem,100vw - 1.5rem);box-shadow:0 -16px 48px -20px color-mix(in srgb, var(--card-glow) 60%, transparent), 0 24px 48px -24px #000000b3;color:#eef2ff;background:linear-gradient(#14182cf5,#0a0d1af5);border-radius:18px 18px 14px 14px;flex-direction:column;gap:.7rem;margin:0 .75rem .75rem;padding:1.1rem 1.2rem 1.2rem;animation:.28s cubic-bezier(.22,.71,.32,1) demoSlideUp;display:flex;position:relative}.demoModalHeader{justify-content:space-between;align-items:flex-start;gap:.75rem;display:flex}.demoModalTag{letter-spacing:.22em;text-transform:uppercase;color:var(--card-accent);margin:0;font-size:.65rem}.demoModalTitle{letter-spacing:.02em;color:#fff;margin:.2rem 0 0;font-size:1.4rem}.demoModalClose{color:#fff;cursor:pointer;background:#ffffff0a;border:1px solid #ffffff26;border-radius:999px;justify-content:center;align-items:center;width:2rem;height:2rem;font-size:1.1rem;line-height:1;display:flex}.demoModalDescription{color:#d4dbf2;margin:0;font-size:.92rem;line-height:1.45}.demoModalFooter{justify-content:space-between;align-items:center;gap:.75rem;margin-top:.2rem;display:flex}.demoModalProof{letter-spacing:.14em;text-transform:uppercase;color:#aab4d4;font-size:.7rem}.demoModalCta{border:1px solid var(--card-accent);background:color-mix(in srgb, var(--card-accent) 18%, transparent);color:var(--card-accent);letter-spacing:.16em;text-transform:uppercase;cursor:pointer;border-radius:999px;padding:.55rem 1rem;font-size:.72rem;transition:all .18s}.demoModalCta:hover{background:color-mix(in srgb, var(--card-accent) 35%, transparent);color:#fff}.demoModalActions{flex-wrap:wrap;justify-content:flex-end;align-items:center;gap:.5rem;display:flex}.demoModalCta.isSecondary{color:#d4dbf2;background:#9aa6c914;border-color:#9aa6c966;text-decoration:none}.demoModalCta.isSecondary:hover{border-color:var(--card-accent);color:var(--card-accent);background:color-mix(in srgb, var(--card-accent) 14%, transparent)}@keyframes demoFadeIn{0%{opacity:0}to{opacity:1}}@keyframes demoSlideUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@media (min-width:768px){.demoPage{padding:1.4rem 2rem}.demoStage{max-width:1400px}.demoCard{width:17rem}.demoCard.isFeatured{width:19rem}.demoModalLayer{justify-content:flex-end;align-items:center;padding:2rem}.demoModal{border-radius:18px;width:min(24rem,30vw);margin:0}.demoBrandLogo{height:2rem}.demoBrandCity{font-size:.72rem}}@media (max-width:767px){.demoPage{gap:.25rem;min-height:100dvh;padding:.5rem .5rem 10.5rem}.demoStageWrap{flex:auto;justify-content:center;align-items:center;width:100%;min-height:0;display:flex;overflow:hidden}.demoHeader{gap:.5rem;font-size:.62rem}.demoBrandLogo{height:1.25rem}.demoBrandCity{font-size:.58rem}.demoToggles{gap:.35rem}.demoToggle{letter-spacing:.12em;gap:.3rem;padding:.3rem .55rem;font-size:.55rem}.demoToggleIcon{font-size:.78rem}.demoStage{border-radius:12px;flex:none;width:200%;max-width:none;height:auto;margin-left:0}.demoTray{z-index:900;padding:1rem .4rem calc(.55rem + env(safe-area-inset-bottom,0px));background:linear-gradient(#05060d00 0%,#05060d8c 10%,#05060deb 45%,#05060dfa 100%);gap:.35rem;position:fixed;bottom:0;left:0;right:0}.demoTrayHeading{padding:0 .15rem;font-size:.56rem}.demoCardRailArrow{display:none}.demoCardRail{gap:.5rem;padding:.2rem .2rem .4rem;scroll-padding-left:.2rem}.demoCard{gap:.55rem;width:clamp(13rem,78vw,15.5rem);min-height:8rem;padding:.6rem .7rem}.demoCard.isFeatured{width:clamp(13.5rem,80vw,16rem)}.demoCard h2{font-size:.95rem}.demoCardDescription{-webkit-line-clamp:3;font-size:.7rem}.demoCardVisual{width:3.8rem}.demoModalLayer{z-index:9999;padding:0}.demoModal{width:100%;padding:1.3rem 1rem calc(1.4rem + env(safe-area-inset-bottom,0px));border-radius:18px 18px 0 0;max-height:85vh;margin:0;overflow-y:auto}.demoModalHeader{gap:.5rem}.demoModalTitle{font-size:1.2rem}.demoModalDescription{font-size:.86rem;line-height:1.5}.demoModalFooter{flex-direction:column;align-items:stretch;gap:.6rem}.demoModalActions{justify-content:stretch;width:100%}.demoModalActions .demoModalCta{text-align:center;flex:1}.demoModalProof{text-align:center;font-size:.62rem}.demoSplashLogoWrap{width:40vw;max-width:200px}.demoSplashLabel{font-size:.7rem}.demoSplashBoot{font-size:.55rem}}@media (max-width:380px){.demoToggleText,.demoBrandCity{display:none}.demoCard{width:clamp(12rem,82vw,14.5rem)}}@media (prefers-reduced-motion:reduce){.demoBuilding,.demoBuildingImg,.demoBuildingGlow,.demoBuildingLabel,.demoChip,.demoModalCta{transition:none}.demoBuilding.isSelected .demoBuildingGlow,.demoModal,.demoModalBackdrop,.demoSplashLogo,.demoSplashLabel,.demoSplash,.demoAmbientLight,.demoAmbientTrail{animation:none}.demoAmbient{display:none}}
