/* Fixed console budget: 128px portrait row + 38px attributes + gap/padding. */
#fps-counter{position:fixed;top:10px;left:12px;z-index:25;display:flex;align-items:center;gap:8px;padding:5px 9px;border:1px solid #71816480;border-radius:4px;background:#101c17d9;color:#b7c8bb;font:12px/18px system-ui,sans-serif;pointer-events:none;user-select:none}
#fps-value{min-width:3ch;text-align:right;color:#c6f0ca;font-size:14px;font-variant-numeric:tabular-nums}
.hero-info .hero-summary{flex:none;height:128px;min-height:128px}
.hero-info .hero-vitals{min-width:0;display:flex;flex-direction:column;gap:3px;height:128px}
.hero-info .hero-name{font-size:16px;line-height:21px}
.hero-info #details-button{margin-top:1px;font-size:11px;line-height:15px}
.hero-info .hero-stats{display:grid;gap:2px;margin:0;line-height:16px}
.hero-info .hero-stats>span:last-child{display:none}
.hero-info .hero-stats>span:nth-child(2){display:block}
.hero-info .hero-stats span,.hero-info .hero-stats b{font-size:12px}
.hero-info .hero-attributes{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px;height:38px;flex:none}
.hero-attributes button{display:flex;align-items:center;gap:5px;padding:3px;background:#111f19;border:1px solid #7181648c;border-radius:3px;color:#dedfca;min-width:0;text-align:left}
.hero-attributes img{width:27px;height:27px;object-fit:cover;flex:none;border:1px solid #aaa579}
.hero-attributes span{font-size:11px;line-height:13px;min-width:0}
.hero-attributes b{display:block;font-size:14px;line-height:15px;color:#fff1bd;overflow:hidden;text-overflow:ellipsis}
.hero-attributes button:hover,.hero-attributes button.pointer-hover{background:#29392a;border-color:#deca8a}
.attribute-detail-icon{width:38px;height:38px;vertical-align:middle;margin-right:10px;border:1px solid #b0a274}
.attribute-effects{display:grid;grid-template-columns:1fr auto;gap:10px;font-size:15px;margin:18px 0}
.attribute-effects dd{margin:0;color:#f0d793;text-align:right}.attribute-effects dt{color:#d6dfcc}
.card-hover-detail .attribute-footnote{font-size:12px;color:#a5b49d;margin-bottom:0}
.hero-vitals #initial-skill-status{position:relative;inset:auto;zoom:1;display:grid;grid-template-columns:30px minmax(0,1fr);grid-template-rows:17px 15px;column-gap:4px;flex:none;align-items:center;width:100%;min-width:0;height:36px;margin:0;padding:1px 2px;border:1px solid #988d61;border-radius:2px;background:#101b15;box-shadow:none;transform:none;text-align:left}
#initial-skill-status #skill-symbol{position:relative;grid-row:1/3;width:30px;height:30px;font-size:0;overflow:hidden}
#skill-symbol img{width:30px;height:30px;display:block}
#skill-symbol:after{content:'';position:absolute;inset:0;background:conic-gradient(#03090bc4 calc(var(--cooldown,0)*1turn),transparent 0)}
.hero-vitals #initial-skill-status #skill-name{display:block;font-size:11px;line-height:16px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:#f1dfb4}
.hero-vitals #initial-skill-status #skill-status{display:block;font-size:9px;line-height:12px;margin:0;color:#a9d7b2;white-space:nowrap}
.murloc-selection-skill>header>img{width:38px;height:38px;object-fit:cover;border:1px solid #b9a671}
.skill-detail-icon{width:40px;height:40px;vertical-align:middle;margin-right:10px;border:1px solid #b9a671}
#meter-scope{margin:5px 0 8px;color:#becab1;font-size:11px;text-align:center}
#meter-rows{max-height:300px;overflow:auto;scrollbar-width:thin}
#meter-rows .meter-row{position:relative;padding:4px 0 12px}
#meter-rows .meter-row>div{display:flex;gap:7px;align-items:center;font-size:12px;line-height:16px}
#meter-rows .meter-row img{position:static;width:28px;height:28px;flex:none;border:1px solid #928967}
#meter-rows .meter-row span{flex:1;min-width:0;text-align:left;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
#meter-rows .meter-row b{font-size:12px;white-space:nowrap;font-variant-numeric:tabular-nums}
#meter-rows .meter-row small{display:block;font-size:9px;color:#9dcee4;line-height:11px}
#meter-rows .meter-row>i{height:5px;margin:3px 35px 0 0;background:#344434}
#meter-rows .meter-row u{background:#d5ac6a}
#meter-rows [data-damage-type="法术"] u{background:#9c98ee}
#meter-rows [data-damage-type="真实"] u{background:#e5e7d6}
#meter-rows [data-owner="summon"] u{background:#60c3c8}
#meter-rows .meter-row>em{position:absolute;right:0;bottom:8px;font-size:10px;font-style:normal;color:#b9c8ac}
#meter-total{display:block;font-size:11px;line-height:18px;margin-top:6px;white-space:normal}
#defense-route-guide{position:fixed;z-index:3;pointer-events:none;width:210px;display:flex;flex-direction:column;align-items:center;gap:12px;text-align:center;transform:translateX(-50%);color:#f9edd0;text-shadow:0 2px 3px #000}
#defense-route-guide[hidden]{display:none}
#defense-route-guide>div{box-sizing:border-box;width:210px;padding:8px 12px;background:#102017ec;border:1px solid #d2ba72;border-radius:4px;box-shadow:0 3px 10px #0008}
#defense-route-guide b{display:block;font-size:19px;line-height:25px}
#defense-route-guide span{display:block;font-size:14px;line-height:21px;color:var(--guide-color);filter:brightness(1.5)}
#defense-route-guide .defense-guide-arrow{display:grid;place-items:center;width:64px;height:64px;flex:none}
#defense-route-guide svg{display:block;width:40px;height:48px;fill:#f5d580;stroke:#283014;stroke-width:2;filter:drop-shadow(0 0 7px #ffe68b99);transform-origin:center;transform:rotate(var(--guide-angle));animation:none}

#defense-route-guide,#defense-route-guide>div{animation:none!important;transition:none!important}
#defense-route-guide .defense-guide-arrow{margin:0;padding:0;font-style:normal;overflow:visible;min-height:64px;animation:defense-arrow-bob 1s ease-in-out infinite}
@keyframes defense-arrow-bob{50%{transform:translateY(6px)}}
@media(prefers-reduced-motion:reduce){#defense-route-guide .defense-guide-arrow{animation:none}}
