/* Phase F — full sky veil, architectural musical skyline, balanced entrance. */
.city-overture{display:none;position:fixed;inset:0;z-index:10050;overflow:hidden;color:#eef3f6;isolation:isolate;background:#050b16}
.show-overture .city-overture{display:grid;place-items:center}
.city-overture::before{content:"";position:absolute;inset:0;z-index:0;background:radial-gradient(circle at 50% 72%,rgba(63,137,166,.18),transparent 38%),linear-gradient(180deg,#06101f 0%,#09172b 56%,#050a14 100%);transition:opacity .85s ease;pointer-events:none}
.overture-curtain{position:absolute;inset:0 auto 0 0;z-index:2;width:50.1%;overflow:hidden;will-change:transform;backface-visibility:hidden;background:radial-gradient(circle at 75% 21%,rgba(89,151,178,.18),transparent 31%),radial-gradient(ellipse at 35% 76%,rgba(52,76,124,.21),transparent 46%),linear-gradient(180deg,#071426 0%,#0a1a31 52%,#050b18 100%);box-shadow:inset -28px 0 70px rgba(0,0,0,.22);transition:transform 1.55s cubic-bezier(.77,0,.16,1),filter 1.1s ease}
.overture-curtain.right{left:auto;right:0;transform-origin:100% 50%;box-shadow:inset 28px 0 70px rgba(0,0,0,.22)}
.overture-curtain::before{content:"";position:absolute;inset:0;opacity:.76;background-image:radial-gradient(circle at 12% 15%,#dcebee 0 1px,transparent 1.4px),radial-gradient(circle at 66% 10%,rgba(220,235,238,.75) 0 1px,transparent 1.4px),radial-gradient(circle at 38% 43%,rgba(220,235,238,.54) 0 1px,transparent 1.5px),radial-gradient(circle at 84% 65%,rgba(220,235,238,.7) 0 1px,transparent 1.5px),radial-gradient(circle at 21% 81%,rgba(220,235,238,.5) 0 1px,transparent 1.5px);background-size:177px 149px,227px 193px,211px 173px,263px 207px,191px 239px;animation:skyDrift 22s linear infinite}
.overture-curtain::after{content:"";position:absolute;inset:-8%;opacity:.5;filter:blur(25px);background:radial-gradient(ellipse at 60% 28%,rgba(85,137,161,.25),transparent 38%),radial-gradient(ellipse at 40% 73%,rgba(42,62,98,.4),transparent 47%)}
.overture-seam{position:absolute;z-index:3;inset:0 auto 0 50%;width:1px;transform:translateX(-50%);background:linear-gradient(180deg,transparent 4%,rgba(149,197,212,.22) 24%,rgba(239,210,131,.55) 50%,rgba(149,197,212,.2) 76%,transparent 96%);box-shadow:0 0 30px rgba(177,210,218,.35);transition:opacity .45s ease,transform .9s ease}
.overture-content{position:relative;z-index:5;display:grid;justify-items:center;align-content:center;width:min(920px,92vw);min-height:min(760px,92vh);padding:clamp(24px,5vh,58px) clamp(18px,4vw,46px);text-align:center;opacity:0;transform:translateY(10px);transition:opacity .75s ease,transform .9s cubic-bezier(.22,.74,.25,1),filter .65s ease}
.city-overture.is-ready .overture-content{opacity:1;transform:none}
.overture-kicker{display:flex;align-items:center;gap:12px;margin:0 0 14px;color:#8fa8b5;font:600 10px/1.2 'IBM Plex Sans',sans-serif;letter-spacing:.32em;text-transform:uppercase}.overture-kicker::before,.overture-kicker::after{content:"";width:34px;height:1px;background:linear-gradient(90deg,transparent,rgba(145,181,194,.58))}.overture-kicker::after{transform:scaleX(-1)}
.overture-title{margin:0;color:#f0cd6e;font:clamp(38px,7vw,78px)/.98 'Special Elite','Courier New',serif;letter-spacing:.10em;text-shadow:0 0 40px rgba(240,205,110,.17),0 18px 55px rgba(0,0,0,.45)}
.overture-score-wrap{position:relative;width:min(760px,90vw);height:clamp(155px,23vh,215px);margin:clamp(22px,3.7vh,34px) auto 20px;padding:0 14px;display:flex;align-items:flex-end;justify-content:center}
.overture-score-wrap::before{content:"";position:absolute;left:6%;right:6%;bottom:8px;height:42%;background:radial-gradient(ellipse at center bottom,rgba(60,151,174,.18),transparent 67%);filter:blur(7px)}
.city-score{position:relative;z-index:2;display:flex;align-items:flex-end;justify-content:center;gap:clamp(5px,.8vw,11px);width:100%;height:100%;padding:0 8px 15px;border-bottom:1px solid rgba(151,195,207,.26)}
.score-building{--h:55%;--lift:5px;--dur:3.5s;position:relative;display:block;flex:0 1 clamp(28px,4vw,48px);height:var(--h);min-width:20px;transform:translateY(8px);opacity:0;background:linear-gradient(180deg,#27465b 0%,#13273a 45%,#09131f 100%);border:1px solid rgba(145,190,204,.26);border-bottom:0;box-shadow:inset 0 0 20px rgba(105,171,187,.06),0 12px 20px rgba(0,0,0,.22);transition:opacity .7s ease,transform .8s ease;animation:cityBreath var(--dur) ease-in-out infinite alternate}
.city-overture.is-ready .score-building{opacity:1;transform:translateY(0)}
.score-building::before{content:"";position:absolute;left:-1px;right:-1px;top:-10px;height:11px;background:inherit;border:1px solid rgba(145,190,204,.25);border-bottom:0;clip-path:polygon(0 100%,18% 100%,18% 45%,35% 45%,50% 0,65% 45%,82% 45%,82% 100%,100% 100%)}
.score-building::after{content:"";position:absolute;inset:13px 18% 8px;opacity:.75;background:repeating-linear-gradient(180deg,rgba(237,205,119,.78) 0 3px,transparent 3px 13px),repeating-linear-gradient(90deg,transparent 0 6px,rgba(237,205,119,.4) 6px 9px,transparent 9px 15px)}
.score-building b{position:absolute;left:50%;top:-17px;width:1px;height:8px;background:rgba(166,208,218,.55)}
.score-building.b1{--h:42%;--lift:4px;--dur:3.2s}.score-building.b2{--h:63%;--lift:8px;--dur:4.1s}.score-building.b3{--h:50%;--lift:5px;--dur:3.6s}.score-building.b4{--h:79%;--lift:10px;--dur:4.4s}.score-building.b5{--h:58%;--lift:6px;--dur:3.4s}.score-building.b6{--h:91%;--lift:11px;--dur:4.7s}.score-building.b7{--h:67%;--lift:7px;--dur:3.8s}.score-building.b8{--h:84%;--lift:10px;--dur:4.5s}.score-building.b9{--h:55%;--lift:5px;--dur:3.3s}.score-building.b10{--h:76%;--lift:9px;--dur:4.2s}.score-building.b11{--h:48%;--lift:5px;--dur:3.7s}.score-building.b12{--h:88%;--lift:11px;--dur:4.8s}.score-building.b13{--h:61%;--lift:7px;--dur:3.9s}.score-building.b14{--h:72%;--lift:8px;--dur:4.3s}
.score-building:nth-child(3n){background:linear-gradient(180deg,#34405d,#17243b 48%,#0a1320)}.score-building:nth-child(4n){background:linear-gradient(180deg,#2d5456,#173238 48%,#09171e)}.score-building:nth-child(5n){background:linear-gradient(180deg,#513b50,#2a2035 48%,#11121f)}
.score-building:nth-child(2n)::before{clip-path:polygon(0 100%,0 52%,18% 52%,50% 0,82% 52%,100% 52%,100% 100%)}.score-building:nth-child(4n)::before{top:-15px;height:16px;clip-path:polygon(0 100%,20% 100%,20% 35%,42% 35%,50% 0,58% 35%,80% 35%,80% 100%,100% 100%)}
.score-street{position:absolute;z-index:3;left:5%;right:5%;bottom:2px;height:8px;border-radius:50%;background:rgba(25,67,82,.4);filter:blur(4px)}
.overture-slogan{display:grid;gap:4px;max-width:700px;margin:0;color:#cad5da;font:400 clamp(15px,2vw,19px)/1.55 'IBM Plex Serif',serif;letter-spacing:.02em}.overture-slogan strong{color:#e4ebee;font-weight:400}.overture-slogan span{color:#94aab5;font-style:italic}
.overture-enter{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:13px;min-width:min(258px,78vw);margin-top:26px;padding:14px 23px;border:1px solid rgba(240,205,110,.58);border-radius:999px;background:linear-gradient(180deg,rgba(238,205,111,.13),rgba(8,19,34,.68));box-shadow:0 14px 40px rgba(0,0,0,.3),inset 0 1px rgba(255,255,255,.08),0 0 0 7px rgba(240,205,110,.025);color:#f5df9f;font:600 12px/1 'IBM Plex Sans',sans-serif;letter-spacing:.18em;text-transform:uppercase;cursor:pointer;backdrop-filter:blur(12px);transition:transform .22s ease,border-color .22s ease,background .22s ease,box-shadow .22s ease}.overture-enter:hover{transform:translateY(-2px);border-color:rgba(240,205,110,.9);background:linear-gradient(180deg,rgba(238,205,111,.19),rgba(12,25,41,.78));box-shadow:0 18px 50px rgba(0,0,0,.36),0 0 30px rgba(240,205,110,.1)}.overture-enter:focus-visible{outline:2px solid #f0cd6e;outline-offset:5px}.overture-enter:disabled{cursor:default;opacity:.72;transform:none}.overture-enter i{font-style:normal;font-size:17px;transition:transform .25s ease}.overture-enter:hover i{transform:translateX(4px)}
.city-overture.is-committed .overture-content{opacity:0;transform:translateY(14px) scale(.98);filter:blur(3px)}
.city-overture.is-opening::before{opacity:0}.city-overture.is-opening .overture-curtain.left{transform:translateX(-101%) skewX(-2deg);filter:blur(1px)}.city-overture.is-opening .overture-curtain.right{transform:translateX(101%) skewX(2deg);filter:blur(1px)}.city-overture.is-opening .overture-seam{opacity:0;transform:translateX(-50%) scaleY(.2)}.city-overture.is-leaving{pointer-events:none;animation:overtureFade .45s ease forwards}
.house-interior[data-kind="pizza"]{border-color:rgba(232,157,87,.48)}.house-interior[data-kind="steakhouse"]{border-color:rgba(201,156,91,.44)}.house-interior[data-kind="fashion"]{border-color:rgba(220,170,211,.43)}
.house-interior[data-kind="pizza"] .room-plaque{border-color:rgba(232,157,87,.38)}.house-interior[data-kind="steakhouse"] .room-plaque{border-color:rgba(201,156,91,.34)}.house-interior[data-kind="fashion"] .room-plaque{border-color:rgba(220,170,211,.34)}
@keyframes cityBreath{from{translate:0 0;filter:brightness(.86)}to{translate:0 calc(var(--lift) * -1);filter:brightness(1.09)}}@keyframes skyDrift{to{background-position:177px 0,-227px 0,211px 0,-263px 0,191px 0}}@keyframes overtureFade{to{opacity:0;visibility:hidden}}
@media(max-width:700px){.overture-content{min-height:94vh;padding:24px 15px}.overture-kicker{font-size:8px;letter-spacing:.24em}.overture-title{font-size:clamp(35px,11vw,56px);letter-spacing:.06em}.overture-score-wrap{width:96vw;height:160px;margin:18px auto 17px;padding:0 4px}.city-score{gap:4px;padding-inline:3px}.score-building{flex-basis:24px;min-width:15px}.score-building:nth-child(n+12){display:none}.overture-slogan{padding:0 10px;font-size:15px}.overture-enter{margin-top:22px;min-width:228px;padding:13px 18px}}
@media(max-height:650px) and (min-width:701px){.overture-content{min-height:98vh;padding-block:15px}.overture-score-wrap{height:128px;margin:13px auto 12px}.overture-enter{margin-top:17px}}
@media(prefers-reduced-motion:reduce){.overture-curtain,.overture-content,.overture-seam,.overture-enter{transition-duration:.2s}.score-building,.overture-curtain::before{animation:none!important}.city-overture.is-ready .score-building{transform:none}.city-overture.is-leaving{animation-duration:.15s}}