/* Native alpha crops are padded and registered in city-ui-v1/manifest.json.
   Equal source/target corner dimensions preserve every bevel and screw. */
#app{--city-ink:#e3e2d5;--city-muted:#b0b3a5;--city-amber:#d2ad6b;--city-frame:url("production/runtime105/textures/ui.city_hud_panel.png");border-color:#424840}
.hud-top-left,.run-readout,.hud-top-right,.toast,.control-help{--frame-image:var(--city-frame);--frame-slices:149;--frame-width:14px;color:var(--city-ink);text-shadow:0 1px 2px #000}
.ability{--frame-image:url("production/runtime105/textures/ui.city_ability_slot.png");--frame-slices:128;--frame-width:13px}
.hud-top-left::before,.run-readout::before,.hud-top-right::before,.toast::before,.control-help::before,.ability::before{border-image-repeat:stretch;filter:none!important}
.hud-top-left{width:316px;min-height:84px;padding:10px 20px 12px;top:10px;left:16px}
.hud-top-left .stat-line{gap:7px;font-size:13px;line-height:16px;margin:0}
.hud-top-left .label{width:26px;color:var(--city-muted)}
.hud-top-left .meter{--meter-height:40px;width:144px;flex:none}
.hud-top-left .level-line{padding-left:0;gap:8px}
#healthText{font-size:13px;white-space:nowrap}
.meter-badge,.meter::before,.xp-track::before,.xp-track .meter-badge{filter:grayscale(.82) sepia(.15)}
.run-readout{top:10px;width:172px;min-height:84px;padding:10px 18px;letter-spacing:.08em}
.run-readout #waveText{color:var(--city-amber);font-size:11px;line-height:14px}
.run-readout .timer-line{margin:0;font-size:28px;line-height:32px}
.timer-line #timerText{font-size:28px;color:var(--city-ink);font-variant-numeric:tabular-nums}
.hostile-line small{color:var(--city-muted);font-size:10px;line-height:14px}
.hud-top-right{width:268px;min-height:80px;bottom:14px;right:76px;padding:12px 20px;grid-template-columns:94px minmax(0,1fr);grid-template-rows:repeat(3,18px);gap:0 10px}
.hud-top-right .resource-readout{color:var(--city-amber);font-size:11px}
#weaponText{font-size:12px;color:var(--city-ink);max-width:100%;white-space:nowrap}
#weaponMode{font-size:10px;color:var(--city-muted)}
#weaponArt{align-self:center;justify-self:center}
.ability-bar{bottom:16px;left:16px;gap:6px}
.ability,.ability[data-ability="echo"],.ability.aim-mode{width:108px;height:76px;padding:15px 16px 18px}
.ability strong{font-size:12px;line-height:15px;color:var(--city-amber);letter-spacing:.02em}
.ability>span:not(.ability-charge-track):not(.ability-receiver){font-size:11px;line-height:15px;margin-top:5px;color:var(--city-muted);white-space:nowrap}
.ability .ability-icon,.ability .ability-icon.semantic-icon{right:12px;top:12px;width:22px;height:22px;object-fit:contain}
#roleSkillSlot .ability-icon{width:26px;height:26px;right:11px;top:10px}
#roleSkillSlot[data-skill-status="cooldown"] .ability-icon{opacity:.55}
#roleSkillSlot[data-skill-status="active"] .ability-icon{filter:drop-shadow(0 0 3px #dfcc8e)}
#roleSkillSlot[data-skill-status="active"] #overdriveChargeText{color:#eee3bd}
.ability-receiver{right:10px;top:10px}
.ability:has(i)::after,.ability>i{left:16px;right:16px;bottom:13px;height:3px}
.ability-charge-track{left:14px;right:14px;bottom:12px}
.ability .charge-motion{left:13px;bottom:10px;width:calc(100% - 26px);height:16px;opacity:.65}
.ability .ready-motion{opacity:.45}
.ability .relic-motion{right:7px;top:7px;width:29px;height:29px}
.ability .echo-boost-state{left:35px;top:14px}
.xp-wrap{bottom:16px}
.xp-wrap #xpText{font-size:11px;color:var(--city-muted)}
.toast{top:10px;right:76px;left:auto;width:304px;padding:14px 22px;color:var(--city-ink);font-size:12px;line-height:18px}
.sound-button{right:14px;top:14px;padding:5px 8px;color:var(--city-muted);border-color:#62685a;background:#1d211fe8}
.pause-button{right:16px;bottom:28px;width:44px;height:44px;border:2px solid #777b69;border-radius:50%;background:linear-gradient(135deg,#464940,#171b19)!important;box-shadow:inset 0 0 0 3px #191d1a,0 2px 5px #0008;display:grid;place-items:center}
.pause-glyph{position:relative;width:14px;height:17px;display:block}
.pause-glyph::before,.pause-glyph::after{content:"";position:absolute;top:0;bottom:0;width:4px;background:var(--city-amber);border-radius:1px}
.pause-glyph::before{left:0}.pause-glyph::after{right:0}
.pause-button[aria-label="继续战斗"] .pause-glyph::before{width:14px;clip-path:polygon(5% 0,100% 50%,5% 100%)}
.pause-button[aria-label="继续战斗"] .pause-glyph::after{display:none}
.modal-panel{color:var(--city-ink);background:none!important;box-shadow:none}
.modal-panel::before{border:0 solid transparent;border-image:url("production/runtime105/textures/ui.city_modal_panel.png") 149 fill / 30px / 0 stretch;filter:none}
.modal-panel::after{display:none}
.modal-panel .eyebrow{color:var(--city-amber)}
.modal-panel .muted{color:var(--city-muted)}
.upgrade-card{background:none!important;color:var(--city-ink);padding:40px 28px;box-shadow:none}
.upgrade-card::before{border:0 solid transparent;border-image:url("production/runtime105/textures/ui.city_modal_panel.png") 149 fill / 22px / 0 stretch;clip-path:none;filter:none}
.upgrade-card-top{display:none}
.upgrade-card:hover::before{filter:brightness(1.15)}
.upgrade-card h3{color:var(--city-ink)}
#upgradeScreen .modal-panel{padding-top:50px}
#upgradeScreen .modal-panel>.eyebrow{top:57px}
.effect-label{color:var(--city-muted)}
.effect-values{color:#e6dcbb}
.upgrade-effects>div,.build-summary{border-color:#68705b77}
.result-stats>div::before{border:0 solid transparent;border-image:var(--city-frame) 149 fill / 15px / 0 stretch;filter:none}
.result-stats>div::after{display:none}
.result-stats b{color:var(--city-ink)}
.result-stats>div:last-child b{color:var(--city-amber)}
.result-stats>div>span:last-child{color:var(--city-muted)}
#app .primary,#app .secondary{position:relative;isolation:isolate;color:var(--city-ink);border:0;background:none!important;box-shadow:none;text-shadow:0 1px 2px #000;clip-path:none;filter:none}
#app .primary::before,#app .secondary::before{content:"";position:absolute;inset:0;z-index:-1;pointer-events:none;border:0 solid transparent;border-image:url("production/runtime105/textures/ui.city_action_button.png") 108 fill / 16px / 0 stretch;filter:none}
#app .primary::after,#app .secondary::after{display:none}
#app .primary:hover::before,#app .secondary:hover::before{filter:brightness(1.25)}
#app .primary:disabled{opacity:.55;cursor:wait}
#app .primary{color:#ead7ae}
.result-actions>button{width:196px;height:60px;min-height:60px}
.mode-select a{color:var(--city-muted);border-color:#656c59;background:#1b211ce8}
.mode-select a[aria-current]{color:#e7dfbb;border-color:#b3a36c;background:#384033e8}
.mode-summary,.save-status,.control-help,.loadout-guide{color:var(--city-muted)}
.start-layer-base{filter:saturate(.65) brightness(.72)}
#startScreen .start-panel>.eyebrow{color:var(--city-amber)}
#startScreen .start-panel>h1{color:#e1e3d1;text-shadow:0 2px 10px #0008}
#startScreen .start-panel>h1 span{color:#cbb17b}
.guide-routes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}
.guide-route{position:relative;isolation:isolate;display:flex;align-items:center;justify-content:center;gap:8px;min-height:70px;padding:14px 18px}
.guide-route::before{content:"";position:absolute;inset:0;z-index:-1;border:0 solid transparent;border-image:url("production/runtime105/textures/ui.city_ability_slot.png") 128 fill / 14px / 0 stretch}
.guide-route img{display:block;width:28px;height:28px;object-fit:contain}
.guide-route>.semantic-icon-slot{width:28px;height:28px}
.guide-route b{color:var(--city-ink);font-size:14px;line-height:18px}
#app button:focus-visible,#app a:focus-visible{outline:2px solid #dec78d;outline-offset:3px}
@container(max-width:800px){
 .hud-top-left{left:10px;top:7px;width:240px;min-height:74px;padding:8px 14px 10px}
 .hud-top-left .stat-line{gap:4px;font-size:11px}.hud-top-left .label{width:24px}
 .hud-top-left .meter{width:120px}#healthText{font-size:11px}
 .run-readout{top:7px;width:136px;min-height:74px;padding:9px 16px}
 .run-readout .timer-line,.timer-line #timerText{font-size:23px;line-height:26px}
 .run-readout #waveText{font-size:10px}.hostile-line small{font-size:9px}
 .ability-bar{left:10px;bottom:10px;gap:3px}
 .ability,.ability[data-ability="echo"],.ability.aim-mode{width:82px;height:66px;padding:13px 13px 15px}
 .ability strong{font-size:11px;line-height:14px}
 .ability>span:not(.ability-charge-track):not(.ability-receiver){font-size:10px;line-height:14px;margin-top:4px}
 .ability .ability-icon,.ability .ability-icon.semantic-icon{width:19px;height:19px;right:9px;top:10px}
 #roleSkillSlot .ability-icon{width:22px;height:22px;right:8px;top:9px}
 .ability-receiver{right:7px;top:8px;transform:scale(.7)}
 .ability .relic-motion{right:7px;top:6px;width:23px;height:23px}
 .ability:has(i)::after,.ability>i{left:13px;right:13px;bottom:12px;height:2px}
 .ability-charge-track{left:12px;right:12px;bottom:11px}
 .ability .charge-motion{left:11px;bottom:9px;width:calc(100% - 22px);height:14px}
 .ability .echo-boost-state{top:13px;left:27px}
 .hud-top-right{bottom:9px;right:58px;width:232px;min-height:66px;padding:10px 17px;grid-template-columns:78px minmax(0,1fr);grid-template-rows:repeat(3,16px);gap:0 6px}
 #weaponText{font-size:11px}#weaponMode{font-size:9px}.hud-top-right .resource-readout{font-size:10px}
 .pause-button{right:10px;bottom:23px;width:38px;height:38px}
 .xp-wrap{left:10px;bottom:83px;transform:none;width:140px}
 .toast{right:10px;top:88px;width:250px;padding:12px 20px;font-size:11px;line-height:16px}
 .sound-button{right:10px;top:10px}
 .guide-routes{gap:4px}.guide-route{min-height:50px;gap:5px;padding:12px}
 .guide-route img{width:20px;height:20px}.guide-route b{font-size:12px}
 .guide-route>.semantic-icon-slot{width:20px;height:20px}
 .result-panel .result-actions>button{width:174px;height:52px;min-height:52px}
 .modal-panel::before{border-image-width:25px}
 #upgradeScreen .modal-panel{padding-top:40px}
 #upgradeScreen .modal-panel>.eyebrow{top:46px}
}