.city-scene{position:relative;isolation:isolate;background:#dfe8fb;overflow:hidden;color:#253666}.city-canvas{display:block;width:100%;height:100%;touch-action:none;outline:none}.city-controls{position:absolute;right:22px;bottom:22px;display:flex;gap:7px;z-index:5;flex-wrap:wrap}.city-controls button,.city-info button,.city-move button{border:1px solid #ffffffb0;border-radius:12px;background:#eef3ffe6;color:#334375;padding:10px 14px;cursor:pointer;backdrop-filter:blur(16px);box-shadow:0 4px 20px #27357515;font:600 12px inherit}.city-controls button:hover{background:white}.city-controls button:focus-visible{outline:3px solid #5987ef}.city-caption{position:absolute;left:24px;bottom:24px;pointer-events:none;font-size:10px;letter-spacing:.13em;color:#52658f}.city-caption strong{display:block;font-size:13px;letter-spacing:.03em;margin-bottom:5px}.city-info{position:absolute;left:50%;top:22%;transform:translateX(-50%);width:min(300px,80%);padding:22px;border:1px solid #ffffffba;border-radius:18px;background:#f4f7fff0;box-shadow:0 20px 60px #28375e30;z-index:8}.city-info h3{margin:0 0 10px}.city-info p{font-size:13px;line-height:1.8}.city-info[hidden],.city-move[hidden]{display:none}.city-move{position:absolute;left:24px;bottom:65px;display:flex;gap:6px;z-index:6}.city-scene[data-night=true]{background:#0b1230}.city-scene[data-night=true] .city-caption{color:#bbcafa}.login-page{padding:0;display:block;min-height:100svh;background:#dfe8fb}.login-page>.city-scene{position:fixed;inset:0}.login-shell{position:relative;pointer-events:none;display:block;width:100%;min-height:100svh;border:0;border-radius:0;background:none;box-shadow:none;padding:5vh 5vw}.login-form-panel{pointer-events:auto;width:365px;max-width:100%;min-height:580px;padding:32px;border:1px solid #fff9;border-radius:25px;background:#f9fbffdc;backdrop-filter:blur(22px);box-shadow:0 25px 90px #52668c24}.login-shell .visual-panel{display:none}.login-main{padding:32px 0}.login-page .city-caption{left:auto;right:26px;bottom:80px;text-align:right}.workspace-page .hero{height:clamp(580px,76vh,880px);padding:30px;background:#dfe8fb;border-radius:25px;display:block}.hero>.city-scene{position:absolute;inset:0}.hero .hero-copy{pointer-events:none;max-width:450px}.hero .hero-actions{pointer-events:auto}.hero .welcome-title{font-size:clamp(28px,3vw,43px)}.hero .welcome-sub{max-width:380px}.hero .hero-panel{position:absolute;left:30px;bottom:75px;max-width:360px;background:#f8faffce;pointer-events:none}.hero .city-caption{bottom:22px}.hero .hero-copy{text-shadow:0 2px 18px #fff}.city-expanded{position:fixed!important;inset:0!important;width:100vw!important;height:100svh!important;z-index:1000!important;border-radius:0!important}.city-expanded~.hero-copy,.city-expanded~.hero-panel{visibility:hidden}.login-page:has(.city-expanded) .login-shell{visibility:hidden}@media(max-width:900px){.login-shell{padding:25px 20px 110px;display:flex;align-items:flex-end;min-height:100svh}.login-form-panel{width:340px;min-height:0;padding:24px}.login-main{padding:24px 0}.login-subtitle{margin-bottom:20px}.login-page .city-caption{display:none}.hero .hero-panel{display:none}}@media(max-width:600px){.login-page>.city-scene{position:fixed;inset:0;height:100svh;min-height:0}.login-shell{min-height:100svh;padding:18px;display:flex;align-items:center;justify-content:center}.login-form-panel{width:100%;max-width:400px;background:#f9fbfff2}.login-page .city-controls{bottom:12px;right:12px}.workspace-page .hero{height:690px;padding:22px}.hero .welcome-title{font-size:29px}.hero .welcome-sub{font-size:12px}.hero .city-caption{bottom:70px;left:18px}.city-controls{right:12px;bottom:15px;gap:4px}.city-controls button{padding:9px 11px}.city-expanded .city-caption{display:none}}

.hero:has(.city-scene[data-night=true]) .welcome-title{color:#eef2ff}.hero:has(.city-scene[data-night=true]) .welcome-sub{color:#c3d0f6}.hero:has(.city-scene[data-night=true]) .hero-copy{text-shadow:none}
/* Let immersive mode escape the hero's stacking context. */
.hero:has(.city-expanded){isolation:auto;z-index:10000;overflow:visible}
body:has(.city-expanded){overflow:hidden}

.city-scene,.workspace-page .hero{background:linear-gradient(130deg,#eef3ff,#f6f5ff 55%,#eee8ff)}
.workspace-page .hero{border:1px solid #ffffffb0;box-shadow:0 18px 50px #8895ce0b}
.city-controls [data-action^="zoom-"]{min-width:35px;padding:9px;font-size:17px;line-height:1}
.city-expanded .city-controls [data-action^="zoom-"]{display:none}
@media(max-width:600px){.city-controls{gap:4px}.city-controls button{padding:8px;font-size:11px}.city-controls [data-action^="zoom-"]{min-width:29px;padding:7px}.login-page .city-controls{left:12px;justify-content:flex-end}}
