.arcade-scene.digital-city-scene{display:block;padding:0;overflow:hidden;border:1px solid #63d9d2;border-radius:20px;background:#102332;min-height:0}
.city-world{position:relative;isolation:isolate;min-height:420px;background:#163241 url('assets/digital-city/city-v1.png') center 58%/cover;overflow:hidden}
.city-world[data-district="0"]{background-size:145%;background-position:0 65%}.city-world[data-district="1"]{background-size:150%;background-position:0 10%}.city-world[data-district="2"]{background-size:145%;background-position:20% 65%}.city-world[data-district="3"]{background-size:145%;background-position:80% 15%}.city-world[data-district="4"]{background-size:145%;background-position:100% 70%}.city-world[data-district="5"]{background-size:145%;background-position:100% 20%}.city-world.city-victory{background-size:cover;background-position:center}
.city-world:before{content:'';position:absolute;inset:0;background:linear-gradient(#061827ed,transparent 55%,#06182790);z-index:-1}
.city-heading{padding:24px;color:#fff;text-shadow:0 2px 5px #001820}.city-heading small{letter-spacing:2px;color:#a2ffeb;font-size:11px}.city-heading h3{font-size:clamp(25px,3vw,38px);margin:8px 0}.city-heading p{margin:0;max-width:600px;color:#eefcff}
.city-hero{position:absolute;left:5%;bottom:16px;width:135px;filter:drop-shadow(0 8px 6px #001820);animation:city-hover 3s ease-in-out infinite}.city-hero .pet-avatar{width:100%;height:135px}.city-hero strong,.city-hero>span{display:block;text-align:center;background:#0b2638eb;border-radius:9px;padding:4px;color:#fff}.city-hero>span{font-size:12px;color:#aaffdf}.city-repaired .city-hero,.city-victory .city-hero{animation:city-celebrate .8s ease-in-out 3}
.city-glitch{position:absolute;right:13%;top:39%;font-size:65px;color:#eb8fff;text-shadow:0 0 20px #aa4cff;animation:city-hover 3.5s infinite}.city-victory .city-glitch{color:#ffe4a1}.city-sparkles{position:absolute;right:10%;bottom:20%;color:#b4ffed;opacity:0;pointer-events:none}.city-repaired .city-sparkles,.city-victory .city-sparkles{opacity:1;animation:city-hover 2s infinite}
.city-train{position:absolute;bottom:12%;left:45%;font-size:28px;color:#ffd16e;text-shadow:0 0 9px #122;animation:city-train 14s linear infinite}.city-repaired .city-train{animation-duration:3s}.city-skyline{position:absolute;bottom:0;right:2%;height:54px;display:flex;align-items:end;gap:6px}.city-skyline i{width:22px;height:calc(25px + var(--tower)*3px);background:#142c39;border:1px solid #729194}.city-skyline i.lit{background:repeating-linear-gradient(0deg,#ffc45a 0 5px,#207582 5px 9px);box-shadow:0 0 14px #67f4c3}
.city-map{list-style:none;padding:0;margin:16px 0;display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px}.city-map li{padding:10px 5px;border:1px solid #46616b;border-radius:10px;background:#14232e;color:#b0c7ce;text-align:center;font-size:12px}.city-map span{display:block;font-size:19px;font-weight:800;margin-bottom:5px}.city-map .current{border-color:#ffda7f;color:#ffda7f}.city-map .repaired{background:#174c43;color:#acffe1;border-color:#63dfbd}
.city-panel{padding:24px;background:linear-gradient(135deg,#122b39,#14202c);border:1px solid #487480;border-radius:16px;color:#effaff}.city-panel h3{font-size:23px;margin:12px 0}.city-panel p{line-height:1.6}.city-toolbar{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.city-toolbar strong{margin-right:auto;color:#a2ffe6;font-size:14px}.city-panel button{min-height:46px;padding:12px 16px;border:1px solid #5da7b6;background:#173b4c;color:#fff;border-radius:10px;overflow-wrap:anywhere}.city-panel button:hover{background:#255469}.city-panel button[aria-pressed=true]{border-color:#ffd05e;background:#595029}.city-panel button:focus-visible,.city-panel input:focus-visible,.city-panel select:focus-visible{outline:3px solid #ffd16e;outline-offset:3px}.city-panel button:disabled{opacity:.5}.city-actions,.city-destinations,.city-files,.city-belt{display:flex;gap:12px;flex-wrap:wrap;margin:16px 0}.city-destinations button{flex:1;min-width:125px;min-height:70px;border:2px dashed #68cfbf}.city-belt{padding:22px 12px;border-block:6px solid #355864;background:repeating-linear-gradient(90deg,#172d3a 0 18px,#234554 18px 20px);background-size:40px 100%;animation:city-belt 3s linear infinite}.city-belt button{background:#715627;border-color:#f3d18c;cursor:grab}.city-files article{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:12px;border:1px solid #4e7782;border-radius:10px;width:100%}.city-panel form{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:16px 0}.city-panel label{display:grid;gap:8px;flex:1;min-width:180px}.city-panel input,.city-panel select{width:100%;box-sizing:border-box;background:#091d2a;color:#fff;padding:13px;border:1px solid #6b9fae;border-radius:8px;font:inherit}.city-breadcrumb,.city-cargo{padding:15px;background:#0b202c;color:#ffe1a0;border-radius:10px;overflow-wrap:anywhere}.city-vaults{display:grid;grid-template-columns:1fr 1fr;gap:16px}.city-vaults article{padding:18px;border:1px solid #69acb6;border-radius:12px;background:#0b202c}.city-success{padding:20px;background:#174b3f;border:1px solid #7ce5bd;border-radius:12px}.city-success h4{margin:0;font-size:22px}.city-note{font-size:12px;color:#b8ced3}
@keyframes city-hover{50%{transform:translateY(-8px)}}@keyframes city-celebrate{50%{transform:translateY(-20px) rotate(3deg)}}@keyframes city-train{from{transform:translateX(-80px)}to{transform:translateX(400px)}}@keyframes city-belt{to{background-position:40px 0}}
.city-train{width:clamp(160px,24vw,220px);height:83px;font-size:0;border:0;border-radius:0;background:url('assets/digital-city/hover-train-v2.svg') center/contain no-repeat;box-shadow:none;filter:drop-shadow(0 5px 4px #081d3650);pointer-events:none}.city-train:before,.city-train:after{content:none}
.city-glitch{font-size:0;width:52px;height:48px;background:linear-gradient(135deg,#ba6ef3,#5547a0);border:3px solid #dfb9ff;border-radius:12px 8px 16px 5px;box-shadow:0 0 25px #ae7bff80}.city-glitch:before{content:'• •';font:900 25px monospace;position:absolute;color:#d6fff8;inset:0;text-align:center}.city-glitch:after{content:'';position:absolute;left:16px;bottom:8px;width:16px;height:6px;border-bottom:2px solid #fff;border-radius:50%}
[data-city-action="map"]:before{content:'▰';display:block;font-size:42px;color:#ffd16e;filter:drop-shadow(0 0 7px #ffd16e80)}.city-success:before{content:'✦';float:right;color:#ffe390;font-size:35px;animation:city-hover 2s infinite}
.city-world[data-district="3"]:after{content:'';position:absolute;left:63%;top:32%;width:300px;height:90px;background:linear-gradient(90deg,#f6ffdc88,transparent);clip-path:polygon(0 48%,100% 0,100% 100%);transform-origin:left center;animation:city-search 7s ease-in-out infinite;pointer-events:none}@keyframes city-search{50%{transform:rotate(-25deg)}}
@media(max-width:700px){.city-map{grid-template-columns:repeat(4,1fr)}.city-world{min-height:360px}.city-hero{width:105px}.city-hero .pet-avatar{height:110px}.city-panel{padding:15px}.city-heading{padding:18px}.city-vaults{grid-template-columns:1fr}.city-files article{flex-wrap:wrap}}
@media(prefers-reduced-motion:reduce){.city-hero,.city-glitch,.city-train,.city-sparkles,.city-belt,.city-success:before,.city-world:after{animation:none!important}}
