body.city-hub{background:#153d3d;color:#fff}.city-hub>.topbar,.city-hub>.dialog-box,.city-hub>.controls-hint{display:none!important}
.city-shell{position:fixed;inset:0;background:radial-gradient(ellipse at center,#b4ceb4,#264f4d);overflow:hidden;font-family:'Microsoft YaHei',sans-serif}
.city-header{position:absolute;inset:0 0 auto;z-index:5;display:flex;align-items:center;gap:20px;padding:14px 24px;background:linear-gradient(#153a3be8,#153a3b99);backdrop-filter:blur(12px)}
.city-header h1{font-size:24px;letter-spacing:3px;margin:0}.city-header small{font-size:12px;color:#d8e9dc;letter-spacing:2px}.city-header nav{display:flex;gap:8px;margin-left:auto}.city-header a,.city-controls button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 15px;color:#fff;text-decoration:none;border:1px solid #ffffff55;background:#183e3dcc;border-radius:12px;font:inherit;cursor:pointer}
.city-viewport{position:absolute;inset:84px 0 0;overflow:hidden;touch-action:none;cursor:grab;user-select:none}.city-viewport.dragging{cursor:grabbing}.city-plane{position:absolute;left:0;top:0;width:1600px;height:900px;transform-origin:0 0;will-change:transform}.city-plane>img{position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.city-plane svg{position:absolute;inset:0;width:100%;height:100%;overflow:visible}.city-castle{cursor:pointer;outline:none}.city-castle polygon{fill:transparent;stroke:transparent;stroke-width:3;transition:fill .2s,stroke .2s}.city-castle:hover polygon,.city-castle:focus-visible polygon{fill:#ffffff15;stroke:#e9ffffcc;filter:drop-shadow(0 0 8px #fff)}.city-castle text{fill:white;font-size:22px;font-weight:900;letter-spacing:1px;text-anchor:middle;paint-order:stroke;stroke:#163f40;stroke-width:7px;stroke-linejoin:round;pointer-events:none}.city-controls{position:absolute;right:20px;bottom:20px;z-index:6;display:flex;align-items:center;gap:8px;padding:6px;border-radius:16px;background:#153b3dcf;backdrop-filter:blur(10px)}.city-controls button{font-size:22px;min-width:46px;padding:6px 12px}.city-controls output{min-width:52px;text-align:center;font-size:14px}.city-help{position:absolute;bottom:22px;left:20px;pointer-events:none;background:#153b3dd9;padding:10px 16px;border-radius:12px;font-size:13px;line-height:1.7}.city-error{position:absolute;top:45%;left:10%;right:10%;text-align:center;background:#153b3d;padding:24px;border-radius:12px}
@media(max-width:700px){.city-header{gap:10px;padding:8px 10px;flex-wrap:wrap}.city-header h1{font-size:19px}.city-header small{display:none}.city-header nav{gap:4px}.city-header a{font-size:12px;padding:8px}.city-help{bottom:80px;left:12px;font-size:12px}.city-controls{right:12px;bottom:16px}.city-castle text{font-size:26px}}
@media(prefers-reduced-motion:reduce){.city-castle polygon{transition:none}}
.city-mini-person{position:absolute;width:9px;height:9px;border:2px solid white;background:#e6534a;border-radius:50%;transform:translate(-50%,-50%);pointer-events:none;box-shadow:0 1px 4px #0008}.city-controls .city-return-hero{font-size:14px}.city-plane .kw-character{filter:drop-shadow(0 2px 2px #463c2933)}
@media(max-width:700px){.city-controls{gap:3px;right:6px}.city-controls button{min-width:38px;padding:6px 8px}.city-controls .city-return-hero{font-size:12px}.city-help{max-width:230px}}
.city-minimap{position:absolute;right:20px;width:150px;padding:0;border:2px solid #f6e9cd;border-radius:12px;overflow:hidden;z-index:4;background:#eee3ca;cursor:crosshair;box-shadow:0 3px 14px #173e3d55}.city-minimap img{display:block;width:100%;height:100%;pointer-events:none}.city-mini-frame{position:absolute;box-sizing:border-box;border:2px solid #a24536;background:#fff3;pointer-events:none}.city-minimap:focus-visible{outline:3px solid white;outline-offset:3px}.city-locked text{fill:#eee;stroke:#62665a}.city-locked{cursor:help}.city-locked:hover polygon{stroke:transparent;fill:transparent}.city-notice{position:absolute;z-index:7;left:50%;bottom:90px;transform:translateX(-50%);max-width:560px;background:#fff6e5;color:#443d2b;padding:14px 20px;border-radius:12px;box-shadow:0 4px 18px #0003}.city-notice:empty{display:none}
@media(max-width:700px){.city-minimap{right:12px;width:100px}.city-notice{width:75%;bottom:140px}}
.atlas-map .city-castle:hover polygon,.atlas-map .city-castle:focus-visible polygon{stroke:transparent;fill:transparent}.atlas-map .city-castle:hover text,.atlas-map .city-castle:focus-visible text{fill:#ffe6ac}.atlas-map .city-castle text{font-size:32px}
.city-sign{animation:city-sign-float 3.8s ease-in-out infinite;filter:drop-shadow(0 3px 2px #54351c55);transform-box:fill-box;transform-origin:center;cursor:pointer}.city-sign-board{fill:#fff0bf;stroke:#b77b35;stroke-width:2.5}.city-sign-pin{fill:#b77b35;stroke:none}.city-castle .city-sign text{fill:#63401f;stroke:none;font-weight:800;letter-spacing:.5px;pointer-events:none}.city-castle:hover .city-sign-board,.city-castle:focus-visible .city-sign-board{fill:#ffe59a;stroke:#87501e;stroke-width:3.5}.city-castle:hover .city-sign,.city-castle:focus-visible .city-sign{animation-play-state:paused;filter:drop-shadow(0 4px 4px #8b541777)}.city-castle:hover .city-sign text,.city-castle:focus-visible .city-sign text{fill:#6a3514}.city-locked .city-sign{animation:none;filter:drop-shadow(0 2px 2px #0002)}.city-locked .city-sign-board{fill:#e4e0d2;stroke:#969184}.city-locked .city-sign text{fill:#666257}.city-locked .city-sign-pin{fill:#969184}
@keyframes city-sign-float{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media(prefers-reduced-motion:reduce){.city-sign{animation:none}}