/* Settings remain wired internally, but are absent from the training UI. */
aside,header details,#camera-settings{display:none!important}
#skills{justify-content:center;gap:14px;padding:12px 0 16px}
#skills button{position:relative;flex:none;width:66px;height:66px;min-height:0;padding:3px;border:2px solid #8d794e;border-radius:0;background:linear-gradient(135deg,#c6ac70,#252c2c 35%,#111b22 70%,#8c7445);box-shadow:0 0 0 2px #070f14,inset 0 0 0 1px #d0b878;overflow:visible}
#skills button:hover,#skills button:focus-visible{border-color:#f1d994;outline:1px solid #f1d994;outline-offset:3px}
#skills button:active{transform:translateY(1px)}
.ability-icon{display:block;width:100%;height:100%;object-fit:cover;pointer-events:none}
.cooldown-sweep{position:absolute;inset:3px;pointer-events:none;display:none;background:conic-gradient(from 0deg,rgba(0,7,14,.82) 0deg var(--cooldown-angle),transparent var(--cooldown-angle) 360deg)}
.cooling .cooldown-sweep{display:block}.cooling .ability-icon{filter:saturate(.5) brightness(.65)}
.cooldown-number{position:absolute;inset:0;display:grid;place-items:center;font:600 26px Georgia,serif;color:#fff;text-shadow:0 2px 4px #000;pointer-events:none}
.ability-key{position:absolute;bottom:-15px;left:50%;transform:translateX(-50%);min-width:25px;padding:1px 5px;background:#101820;border:1px solid #796642;color:#e6d9ad;font:bold 13px Georgia,serif;text-align:center;pointer-events:none}
#skills button.recast{border-color:#ffe4a1;box-shadow:0 0 0 2px #785e29,0 0 12px #e9b84d88}
.recast-time{position:absolute;bottom:3px;left:3px;height:3px;max-width:calc(100% - 6px);width:var(--recast-width);background:#ffe7a0;pointer-events:none}
.skill-tooltip{display:none;position:absolute;bottom:88px;left:50%;transform:translateX(-50%);width:240px;padding:12px;background:#0c1724f5;border:1px solid #a38b55;text-align:left;box-shadow:0 5px 20px #0009;z-index:5;pointer-events:none;color:#c8d1d8;line-height:1.6;font-size:13px}
.skill-tooltip strong{display:block;color:#e7cd8d;margin-bottom:6px}.skill-tooltip em{display:block;color:#8daca8;font-style:normal;font-size:11px;margin-top:8px}
#skills button:hover .skill-tooltip,#skills button:focus-visible .skill-tooltip{display:block}
@media(max-width:480px){#skills{gap:12px}#skills button{width:56px;height:56px}.skill-tooltip{width:180px}#skills button:first-child .skill-tooltip{left:0;transform:none}#skills button:last-child .skill-tooltip{left:auto;right:0;transform:none}}

/* Original Riot HUD atlas: portrait, central frame, equipment frame and resource fills. */
.hud{width:965px;height:180px;bottom:0;padding:0;background:none;border:0;border-radius:0;transform:translateX(-50%) scale(.64);transform-origin:bottom center}
.hud-portrait{position:absolute;left:0;bottom:0;width:170px;height:175px}
.hud-portrait img{position:absolute;left:22px;top:30px;width:119px;height:119px;border-radius:50%;object-fit:cover}
.portrait-frame{position:absolute;inset:0;background:url('assets/lee-icons/clarity_hudatlas.png') 0 -650px no-repeat}
.hero-level{position:absolute;left:101px;top:129px;width:28px;height:29px;display:grid;place-items:center;color:#eee8d2;font:bold 19px Georgia,serif;text-shadow:0 2px 2px black}
.hud-center{position:absolute;left:160px;bottom:0;width:550px;height:175px;background:url('assets/lee-icons/clarity_hudatlas.png') -210px -650px no-repeat}
#skills{position:absolute;left:45px;top:24px;padding:0;gap:14px;justify-content:flex-start}
#skills button{width:64px;height:64px}
.resource-bars{position:absolute;left:54px;right:31px;bottom:18px;display:grid;gap:3px}
.resource{height:18px;position:relative;background:#020909;border:1px solid #5d5b36;overflow:hidden}
.resource .fill{position:absolute;left:0;top:0;height:100%;background-image:url('assets/lee-icons/clarity_hudatlas.png');background-repeat:no-repeat}
.health .fill{background-position:0 -920px}.energy .fill{background-position:0 -876px}
.resource .value{position:absolute;inset:0;text-align:center;font:bold 16px Arial,sans-serif;line-height:17px;color:#fff;text-shadow:1px 1px 2px #000}
.hud-equipment{position:absolute;left:710px;bottom:0;width:245px;height:175px;background:url('assets/lee-icons/clarity_hudatlas.png') -8px -413px no-repeat}
.equipment-slots{position:absolute;left:13px;top:24px;display:grid;grid-template-columns:repeat(3,48px);gap:5px}
.equipment-slot{width:48px;height:48px;border:1px solid #172d2b;background:#07141388;position:relative;box-shadow:inset 0 0 5px #000}
.equipment-slot span{position:absolute;left:3px;bottom:1px;font-size:11px;color:#8b927d}
.trinket-slot{position:absolute;right:24px;top:26px;width:35px;height:40px;color:#8b927d;font-size:11px;padding:24px 3px 0}
.hud-gold{position:absolute;left:13px;bottom:13px;width:198px;height:32px;background:url('assets/lee-icons/clarity_hudatlas.png') -3px -54px no-repeat;color:#e5cc72;text-align:center;font:bold 22px Georgia,serif;line-height:31px}
#stats{position:absolute;left:180px;bottom:181px;font-size:12px;color:#a7bdba;background:#0b171bbf;padding:3px 8px;border-radius:3px;white-space:nowrap;margin:0}
#message{position:absolute;bottom:202px;left:180px;right:0;font-size:12px;margin:0;text-shadow:0 1px 3px #000;pointer-events:none}
@media(max-width:800px){.hud{transform:translateX(-50%) scale(.52)}}
@media(max-width:640px){.hud{transform:translateX(-50%) scale(.40)}}
@media(max-width:490px){.hud{transform:translateX(-50%) scale(.304)}#skills{gap:14px}#skills button{width:64px;height:64px}}

/* Compact seven-slot row; passive and summoner slots are intentionally dim. */
#message,#stats{display:none!important}
#skills{left:100px;top:24px;gap:12px}
#skills button{width:58px;height:58px}
.passive-slot{position:absolute;left:54px;top:24px;width:38px;height:38px}
.dim-slot{padding:2px;border:1px solid #736444;background:#071313;box-shadow:inset 0 0 0 1px #1d2925}
.dim-slot img{display:block;width:100%;height:100%;object-fit:cover;filter:brightness(.35) saturate(.45)}
.summoner-slots{position:absolute;left:418px;top:24px;display:flex;gap:7px}
.summoner-slots .dim-slot{position:relative;width:46px;height:46px}
.summoner-slots span{position:absolute;bottom:-13px;left:0;font:12px Georgia,serif;color:#777c72}
@media(max-width:490px){#skills{gap:12px}#skills button{width:58px;height:58px}}

/* Align the abilities with the original atlas sockets. */
.passive-slot{left:62px}
#skills{left:112px}
.trinket-slot{right:25px;top:23px;width:39px;height:48px;padding:0;background:#000;border:1px solid #12231f}
.recall-slot{position:absolute;right:25px;top:79px;width:40px;height:40px;border-radius:50%;overflow:hidden;background:#000;border:2px solid #2c3935}
.recall-slot img{width:100%;height:100%;object-fit:cover;filter:brightness(.35) saturate(.4)}
.recall-slot span{position:absolute;bottom:0;left:3px;font:11px Georgia,serif;color:#96988b}

/* Match the atlas's 74-unit spacing rather than spreading smaller icons. */
#skills{left:116px;top:27px;gap:4px}
#skills button{width:70px;height:70px}
.passive-slot{left:62px;top:27px;width:46px;height:46px}

/* Inlays sit behind the original equipment frame, visible only through its cutouts. */
.hud-equipment{background:none;isolation:isolate}
.hud-equipment::after{content:"";position:absolute;inset:0;z-index:2;background:url('assets/lee-icons/clarity_hudatlas.png') -8px -413px no-repeat;pointer-events:none}
.equipment-slots,.hud-gold{z-index:3}
.trinket-slot{left:172px;right:auto;top:25px;width:45px;height:51px;border:0;z-index:0;background:#000}
.recall-slot{left:174px;right:auto;top:80px;width:42px;height:42px;border:0;z-index:1}

/* Screen-space nameplate follows the hero's terrain-adjusted head position. */
.hero-overhead{position:absolute;display:flex;align-items:center;width:139px;height:25px;transform:translate(-50%,-100%);pointer-events:none;z-index:4;filter:drop-shadow(0 1px 2px #000)}
.hero-overhead[hidden]{display:none}
.hero-level{flex:none;display:grid;place-items:center;width:25px;height:25px;border:2px solid #b5a575;border-radius:50%;background:radial-gradient(circle at 40% 30%,#343e3d,#101719);color:#fff3d1;font:bold 12px system-ui;z-index:1}
.hero-health{position:relative;width:116px;height:13px;margin-left:-2px;border:2px solid #101b1e;background:#2a1618;box-shadow:0 0 0 1px #837957;overflow:hidden}
.hero-health-fill{position:absolute;inset:0 auto 0 0;width:100%;background:linear-gradient(#a1f363 0%,#62d137 45%,#329919 100%)}
 .hero-health-ticks{position:absolute;inset:0;background:none}
.hero-health-tick{position:absolute;top:0;width:1.111111px;height:50%;background:#182511;transform:translateX(-50%);pointer-events:none}
.hero-health-tick.major{height:100%;width:2.222222px;background:#10190d}
.hero-overhead .hero-level{position:static;inset:auto;transform:none;margin:0;box-shadow:none}

/* Square level badge and aligned health/energy stack. */
.hero-overhead{width:139px;height:22px;align-items:stretch}
.hero-overhead .hero-level{width:22px;height:22px;border-radius:0;font-size:11px;border:1px solid #9e936e}
.hero-vitals{display:flex;flex-direction:column;flex:1;min-width:0;height:22px;border:1px solid #837957;border-left:0;background:#101b1e}
.hero-overhead .hero-health{flex:none;width:100%;height:15px;margin:0;border:1px solid #101b1e;box-shadow:none}
.hero-energy{position:relative;flex:1;min-height:0;margin:0 1px 1px;background:#352c0c;overflow:hidden}
.hero-energy-fill{height:100%;width:100%;background:linear-gradient(#ffe96b,#d9ad20)}

.hero-overhead{transform:translate(-50%,calc(-100% - 8px)) scale(.9);transform-origin:bottom center}

/* Native-size nameplate: no transform scaling, taller health and crisp ticks. */
.hero-overhead{width:125px;height:25px;transform:translate(-50%,calc(-100% - 8px));filter:none}
.hero-overhead .hero-level{width:25px;height:25px;font-size:11px}
.hero-vitals{height:25px}
.hero-overhead .hero-health{height:19px}
.hero-health-tick{width:1px;transform:none;height:8px}
.hero-health-tick.major{width:2px;height:100%}

/* Raise the nameplate above the head, without thickening its bars. */
.hero-overhead{height:20px;transform:translate(-50%,calc(-100% - 18px))}
.hero-overhead .hero-level{width:20px;height:20px}
.hero-vitals{height:20px}
.hero-overhead .hero-health{height:14px}
.hero-health-tick{height:6px}
.hero-health-tick.major{height:100%}

.survival-score{position:absolute;top:14px;left:50%;transform:translateX(-50%);padding:9px 18px;background:#10212ddd;color:#e8ddac;border:1px solid #82734e;border-radius:5px;white-space:nowrap;pointer-events:none;font-size:14px}
.survival-end{position:absolute;inset:0;display:grid;place-items:center;background:#08131bbd;z-index:20}
.survival-end[hidden]{display:none}.survival-end section{text-align:center;background:#112735;border:1px solid #b69a5f;padding:32px 45px;border-radius:8px}.survival-end button{padding:12px 28px}
.hero-shield-fill{position:absolute;top:0;bottom:0;background:linear-gradient(#fff,#e8eff4 50%,#bacbd9);box-shadow:inset 0 0 2px white;pointer-events:none}
.hero-shield-value{position:absolute;left:calc(100% + 4px);top:0;color:#fff;font:bold 10px/14px system-ui;text-shadow:0 1px 3px #000;white-space:nowrap}#skills button.low-energy .ability-icon,.touch-skill.low-energy img{filter:grayscale(.75) brightness(.4)}