/* NIGHTSPARK: painted, stretchable GPT Images UI surfaces. */
:root{--frame-menu:url('panel-arcane.webp');--frame-hud:url('panel-vital.webp');--frame-epic:url('panel-rare.webp');--frame-action:url('panel-action.webp');--ink:#10152a;--gold:#ffe0a3;--mint:#9ff8dd}
body{background:#11172b}
.painted-icon.art-icon{width:56px;height:56px}
.brand-mark .ico{width:45px;height:45px}.icon-btn .ico{width:26px;height:26px}.rail-btn .ico{width:38px;height:38px}.currency .ico{width:28px;height:28px}
.topbar{background:linear-gradient(105deg,#16263a,#232142 65%,#19253e);border-bottom:2px solid #c2a06466;box-shadow:0 3px 24px #0007;position:relative}
.topbar:after{content:'';position:absolute;bottom:-2px;left:10%;height:2px;width:60%;background:linear-gradient(90deg,transparent,#ffe0ab,#80f3dd,transparent);animation:ns-border 7s ease-in-out infinite;pointer-events:none}
.rail{background:linear-gradient(#1a2a3a,#20213a);border-right:2px solid #b5a47d44}
.rail-btn,.icon-btn,.gear-mini,.slot-tab,.element-btn,.currency,.rank-tag,.quality-control select,.language-select{background:#152840;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 13px stretch;border-radius:7px}
.rail-btn{gap:2px;min-height:77px}.rail-btn small{font-size:8px;color:#dce9ee}.rail-btn.active{background:none;border-image-source:var(--frame-action);box-shadow:0 0 20px #70f5dc22}
.rail-btn.active:before{display:none}.rail-btn:hover .ico{transform:translateY(-2px);filter:drop-shadow(0 0 7px #86f8de)}.rail-btn .ico{transition:transform .2s,filter .2s}
.gear-mini{width:49px;height:47px}.gear-mini .ico{width:38px;height:38px}.element-btn{border-image-width:12px;padding:9px 10px;gap:3px}.element-btn .ico{width:28px;height:28px}.element-btn.selected{border-image-source:var(--frame-action);box-shadow:0 0 17px #82f2db33}
.keyart{border:1px solid transparent;border-image:var(--frame-menu) 135 / 24px stretch;box-shadow:0 15px 35px #02071466;overflow:hidden;border-radius:14px}
.hero-card,.mode-card,.quick-panel,.region-card,.hero-switch,.loadout-preset{background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 22px stretch;box-shadow:0 6px 16px #0003;position:relative}
.hero-card{padding:23px 24px 18px}.hero-switch{border-image-width:15px}.mode-card{padding:17px 22px}.mode-card .painted-icon{width:62px;height:62px}.quick-panel{padding:14px 19px}.quick-panel .painted-icon{width:42px;height:42px}.region-card{padding:23px}.region-symbol{opacity:.65}.region-symbol .ico{width:80px;height:80px}
.region-card.selected{border-image-source:var(--frame-action);box-shadow:0 0 24px #73edc933}.region-card.locked{opacity:.66}
.primary-btn,.secondary-btn,.card-action,.forge-footer button,.slot-tab,.pause-buttons button,.settings-line button,.leaderboard-form button,.journey-goal>button,.cloud-choices .card-action{position:relative;isolation:isolate;background:none;border:1px solid transparent;border-image:var(--frame-action) 125 fill / 19px stretch;box-shadow:0 4px 0 #080c1b99,0 5px 15px #0003;color:#fff1cc;text-shadow:0 2px 2px #07232d;overflow:hidden;border-radius:8px}
.secondary-btn,.slot-tab,.settings-line button{border-image-source:var(--frame-hud);color:#dcecff}.primary-btn{color:#fff0bd;min-height:65px;font-weight:1000;font-size:13px;letter-spacing:1px}
.card-action{padding:13px 18px;min-height:46px;font-weight:1000}.card-action .ico{width:22px;height:22px}
button:not(:disabled):is(.primary-btn,.secondary-btn,.card-action,.slot-tab,.mode-card,.quick-panel,.hero-switch,.forge-offer,.region-card):hover{filter:brightness(1.18);box-shadow:0 0 22px #9ce9d233}
button:disabled{filter:saturate(.35);opacity:.57}
.primary-btn:after,.card-action:after,.mode-card:after,.gear-card:after,.store-card:after,.roster-card:after{content:'';position:absolute;inset:-20% -70%;pointer-events:none;z-index:1;background:linear-gradient(110deg,transparent 43%,#ffedbd00 44%,#fff6cf55 49%,#b8ffff33 51%,transparent 57%);transform:translateX(-35%);animation:ns-sheen 9s ease-in-out infinite}
.card-action:after{animation-delay:-3s}.store-card:after{animation-delay:-5s}.roster-card:after{animation-delay:-7s}.gear-card:after{animation-delay:-2s}
.modal{background:none;border:1px solid transparent;border-image:var(--frame-menu) 135 fill / 42px stretch;border-radius:18px;padding:38px 38px 30px;box-shadow:0 22px 90px #000b,0 0 60px #90dcff1a;animation:ns-enter .24s ease-out}
.modal-close{right:18px;top:17px;border-image-width:14px;z-index:10}
.modal h2{color:#fff0cc;text-shadow:0 2px 0 #10213a,0 0 25px #ffc97b22}.modal .eyebrow{color:#9fe7dc}.modal-intro{color:#c1cbe0;font-size:12px;line-height:1.65}
.veil{backdrop-filter:blur(8px);background:#070c20cc}
.panel-card,.forge-offer,.store-card,.trial-card,.roster-card,.codex-card,.power-upgrade,.ad-offer,.help-grid>div,.quest-row,.synergy-row,.journey-goal,.journey-main,.journey-chapters button{position:relative;isolation:isolate;background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 24px stretch;border-radius:12px;overflow:hidden;box-shadow:0 7px 20px #03061744}
.panel-card.epic,.forge-offer,.store-card.featured,.trial-card,.roster-card.is-selected{border-image-source:var(--frame-epic)}
.panel-card{padding:27px 25px 24px}.panel-card .big-icon{width:102px;height:102px;background:radial-gradient(ellipse,#876ac84d,transparent 68%);border:0;box-shadow:none;margin-bottom:12px}.big-icon .ico{width:96px;height:96px}
.panel-card h3,.forge-offer h3{color:#fff0ca}.panel-card p{color:#cbd6e8}.gear-card.locked .big-icon{opacity:.5}.panel-card.equipped{box-shadow:0 0 24px #baffd02b}
.upgrade-pick{padding:31px 22px 24px;min-height:320px;transition:transform .2s,filter .2s}.upgrade-pick:hover{transform:translateY(-5px)!important}.upgrade-pick .big-icon{width:124px;height:124px;margin:0 auto 17px}.upgrade-pick .big-icon .ico{width:120px;height:120px;border-radius:22px}
.upgrade-pick .rarity{font-size:9px;letter-spacing:1.4px;color:#f3cc85}.upgrade-pick h3{font-size:20px;margin:12px 0}.upgrade-pick p{min-height:49px;font-size:12px;line-height:1.65}.upgrade-pick .card-action{display:block;text-align:center;margin-top:20px}
.forge-offer{padding:27px 24px}.forge-offer>.painted-icon{width:96px;height:96px}.store-card{padding:30px 26px}.store-card>.painted-icon{width:108px;height:108px}.shop-head>.painted-icon,.forge-head>.painted-icon{width:84px;height:84px}
.power-upgrade,.ad-offer{padding:22px}.journey-main{padding:25px}.journey-goal{padding:16px 19px}.journey-goal>.painted-icon{width:54px;height:54px}.journey-chapters button{padding:15px 19px}.journey-chapters button.is-active{border-image-source:var(--frame-action)}
.roster-card{border-image-width:25px}.roster-copy{padding:10px 24px 25px}.roster-top{padding:15px 20px}.roster-top>.painted-icon{width:39px;height:39px}.codex-card{padding:24px}.help-grid>div{padding:24px}.quest-row,.synergy-row{padding:22px}.synergy-row>.ico,.synergy-row>span>.ico{width:65px;height:65px}.quest-row>span .ico{width:45px;height:45px}
.game-hud{top:16px;left:20px;right:20px;align-items:flex-start}
.player-hud{padding:17px 21px 15px 15px;min-width:330px;background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 27px stretch;box-shadow:0 8px 28px #07101e88;border-radius:12px;gap:10px}
.portrait{border:2px solid #efc87a;border-radius:50%;width:70px;height:70px;background:radial-gradient(circle,#345066,#111a30);box-shadow:0 0 15px #7fe8dc33,inset 0 0 12px #080d25;overflow:visible}.portrait canvas{border-radius:50%}.portrait b{background:#573c71;border:2px solid #e3c07f;color:#ffedb3;min-width:27px;height:27px;display:grid;place-items:center;bottom:-6px;right:-4px}
.vitals{width:222px}.vital-label{padding:1px 1px 7px;gap:8px}.vital-label b{color:#ffecbb;font-size:11px}.vital-label span{font-size:10px;font-weight:1000}
.hp-track,.xp-track{border:2px solid #d1af72;background:#0b1128;border-radius:6px;overflow:hidden;box-shadow:inset 0 2px 5px #000b;position:relative}.hp-track{height:16px}.hp-track>i{background:linear-gradient(#ffd9d0,#ef718d 38%,#d03565 55%,#ef7597);box-shadow:0 0 15px #ff6e9d77;border-radius:3px}.xp-track{height:9px;margin-top:5px;border-color:#9d9bb3}.xp-track>i{background:linear-gradient(#c9f7ff,#4ed6f2 45%,#658ce2 60%,#b0d9ff);box-shadow:0 0 12px #64ddfb}
.hp-track:after,.xp-track:after{content:'';position:absolute;inset:0;background:linear-gradient(105deg,transparent 15%,#ffffff44 40%,transparent 70%);transform:translateX(-100%);animation:ns-bar 5s linear infinite;pointer-events:none}
.xp-label{font-size:7px;letter-spacing:.9px;margin-top:6px;color:#a6dbed}
.run-hud{padding:15px 28px;background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 22px stretch;border-radius:10px;min-width:220px;text-shadow:0 2px 0 #081024}.run-hud>b{color:#ffedbd;font-size:31px}.run-hud .run-label{font-size:8px;color:#badcde}.run-hud #hud-wave{font-size:8px;color:#e7ca98}
.run-actions{padding:9px 15px;background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 18px stretch;gap:7px}.run-actions .icon-btn{width:35px;height:35px;border-image-width:11px}.kill-pill{border:0;background:none;padding:0;gap:4px}.kill-pill .ico{width:30px;height:30px}
.run-goal{top:154px;left:24px;padding:16px 20px;background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 19px stretch}.run-goal>.ico{width:36px;height:36px}.combat-strip{top:124px;left:29px;gap:8px}.combo-pill{border:1px solid transparent;border-image:var(--frame-epic) 125 fill / 13px stretch;padding:8px 15px}.essence-pill{border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 13px stretch}.essence-pill .ico{width:20px;height:20px}
.boss-hud{top:127px;width:min(520px,48vw);padding:18px 30px 22px;background:none;border:1px solid transparent;border-image:var(--frame-epic) 125 fill / 27px stretch;border-radius:8px;box-shadow:0 0 25px #bf5fbe33}.boss-hud>span{color:#ffdcbb;font-size:10px;text-shadow:0 2px 0 #210f32}.boss-hud>div{height:14px;border:1px solid #d9b270;border-radius:3px;background:#210f2d}.boss-hud>div>i{background:linear-gradient(#ffd4f2,#bd3979 40%,#7e285c 55%,#d95a8c)}
.game-bottom{bottom:16px}.skillbar{gap:11px;padding:16px 27px 12px;border:1px solid transparent;border-image:var(--frame-menu) 135 fill / 28px stretch;border-radius:12px;box-shadow:0 6px 28px #0008}.skill,.attack-skill{background:none;border:1px solid transparent;border-image:var(--frame-epic) 125 fill / 16px stretch;border-radius:10px;box-shadow:0 3px 9px #0005;width:76px;height:76px}.skill .ico{width:52px;height:52px}.attack-skill .ico{width:48px;height:48px}.skill>kbd{border:1px solid #d7af70;background:#192239;color:#ffe6b4;font-size:8px;border-radius:4px}.skill>b{font-size:7px;color:#ffefbf;bottom:-4px;text-shadow:0 2px 2px #000}.attack-skill small{color:#bdf4e3;font-size:7px}
.skill>i:not(.ico){background:#0e1524cc;color:#fff1be;font-size:24px;border-radius:9px;backdrop-filter:grayscale(.7)}.skill:hover{box-shadow:0 0 22px #bd8cfd77}.build-icons{padding:10px 15px;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 18px stretch;background:none}.build-icons>span{background:#23324e;border:1px solid #b69b6c;border-radius:6px;position:relative}.build-icons .ico{width:32px;height:32px}.build-icons b{position:absolute;bottom:-3px;right:0;font-size:9px;text-shadow:0 1px 2px #000;background:#142037;border-radius:3px;padding:1px 3px}
.control-hint{padding:12px 17px;background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 16px stretch}
.wave-banner{background:none;border:1px solid transparent;border-image:var(--frame-menu) 135 fill / 29px stretch;padding:23px 40px;box-shadow:0 12px 40px #0008}.toast{background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 17px stretch;padding:17px 26px}
.lobby:before{content:'';position:fixed;inset:0;pointer-events:none;z-index:0;opacity:.5;background-image:radial-gradient(2px 2px at 13% 22%,#ffe9b7 30%,transparent),radial-gradient(1px 1px at 60% 55%,#8af6dc 30%,transparent),radial-gradient(2px 2px at 87% 77%,#cfb6ff 30%,transparent);background-size:337px 401px,271px 359px,419px 297px;animation:ns-drift 24s linear infinite}.lobby>*{position:relative}
.ui-mote{position:fixed;z-index:9999;pointer-events:none;width:5px;height:5px;background:#fff1b4;box-shadow:0 0 9px #7dfff2;clip-path:polygon(50% 0,65% 35%,100% 50%,65% 65%,50% 100%,35% 65%,0 50%,35% 35%);animation:ns-mote .65s ease-out forwards}
@keyframes ns-sheen{0%,64%{transform:translateX(-40%);opacity:0}68%{opacity:.7}91%,100%{transform:translateX(40%);opacity:0}}
@keyframes ns-border{50%{left:30%;opacity:.35}}
@keyframes ns-bar{0%,35%{transform:translateX(-100%)}85%,100%{transform:translateX(100%)}}
@keyframes ns-drift{to{background-position:50px -401px,-60px -359px,70px -297px}}
@keyframes ns-enter{from{opacity:0;transform:translateY(14px) scale(.98)}to{opacity:1;transform:none}}
@keyframes ns-mote{to{transform:translate(var(--dx),var(--dy)) scale(.1) rotate(70deg);opacity:0}}
@media(max-width:1100px){.player-hud{min-width:290px}.vitals{width:186px}.run-hud{min-width:185px}.run-hud>b{font-size:26px}.game-hud{left:12px;right:12px}.modal{padding:32px 27px 25px;border-image-width:33px}}
@media(max-width:900px){.rail-btn{min-height:63px}.rail-btn .ico{width:29px;height:29px}.rail-btn small{font-size:6px}.hero-card{padding:18px}.modal{border-image-width:28px}.upgrade-pick{min-height:0}.game-bottom .control-hint{display:none}}
@media(max-width:600px){
.topbar{padding:10px 12px}.brand-mark .ico{width:30px;height:30px}.currency .ico{width:21px;height:21px}.currency{gap:4px;padding:0 9px}.currency b{font-size:12px}.language-select{border-image-width:10px}.rail-btn{min-height:58px}.rail-btn .ico{width:27px;height:27px}.rail-btn small{font-size:5px}
.hero-card{padding:13px 17px}.hero-switch .painted-icon{width:27px;height:27px}.gear-mini{width:35px;height:34px;border-image-width:10px}.gear-mini .ico{width:29px;height:29px}.element-btn .ico{width:21px;height:21px}.element-btn{padding:8px;border-image-width:10px}.mode-card{padding:15px 16px}.mode-card .painted-icon{width:45px;height:45px}.quick-panel{padding:12px 15px}.quick-panel .painted-icon{width:33px;height:33px}.primary-btn{min-height:58px;font-size:11px}
.modal{padding:30px 22px 22px;border-image-width:25px}.modal-close{right:13px;top:12px}.modal h2{font-size:22px}.modal-intro{font-size:10px}
.panel-card,.forge-offer,.store-card,.trial-card,.roster-card,.codex-card,.quest-row,.synergy-row{border-image-width:20px}
.panel-card:not(.upgrade-pick){padding:20px}.panel-card:not(.upgrade-pick)>.big-icon{width:64px;height:64px}.panel-card .big-icon .ico{width:60px;height:60px}
.upgrade-pick{grid-template-columns:78px 1fr;padding:19px 18px;gap:3px 11px;min-height:155px}.upgrade-pick>.big-icon{width:76px;height:76px;margin:0;grid-row:1/6;align-self:center}.upgrade-pick .big-icon .ico{width:75px;height:75px;border-radius:12px}.upgrade-pick h3{font-size:15px;margin:4px 0}.upgrade-pick p{font-size:10px;min-height:0;line-height:1.5}.upgrade-pick .rarity{font-size:7px}.upgrade-pick .card-action{min-height:33px;font-size:9px;padding:8px 13px;margin-top:4px}.pick-keys{font-size:7px}
.forge-offer>.painted-icon{width:72px;height:72px}.forge-offer{padding:20px 18px}.store-card{padding:23px 20px}.store-card>.painted-icon{width:82px;height:82px}.shop-head>.painted-icon,.forge-head>.painted-icon{width:55px;height:55px}.journey-main{padding:18px 15px}.journey-goal{padding:14px}.journey-chapters button{padding:14px}.roster-copy{padding:9px 20px 22px}.roster-top{padding:15px 18px}.codex-card{padding:20px}
.game-hud{top:9px;left:8px;right:8px;gap:4px}.player-hud{min-width:0;width:228px;padding:11px 13px 10px 10px;gap:5px;border-image-width:19px}.portrait{width:48px;height:48px;min-width:48px}.portrait b{width:21px;height:21px;min-width:21px;font-size:9px;bottom:-5px}.vitals{width:145px}.vital-label{padding-bottom:4px;gap:3px}.vital-label b{font-size:8px}.vital-label span{font-size:7px}.hp-track{height:11px;border-width:1px}.xp-track{height:6px;border-width:1px;margin-top:4px}.xp-label{font-size:5px;letter-spacing:.5px;margin-top:4px}.run-hud{top:94px;left:50%;transform:translateX(-50%);min-width:135px;padding:9px 15px;position:absolute;border-image-width:16px}.run-hud>b{font-size:21px}.run-hud .run-label{display:none}.run-hud #hud-wave{font-size:6px}.run-actions{padding:8px 10px;gap:3px;border-image-width:14px}.run-actions .sound-toggle{display:none}.run-actions .icon-btn{width:29px;height:29px}.run-actions .icon-btn .ico{width:20px;height:20px}.kill-pill .ico{width:22px;height:22px}.kill-pill b{font-size:11px}
.combat-strip{top:82px;left:13px;right:13px;gap:5px;max-width:none;justify-content:space-between}.combo-pill{font-size:7px;padding:6px 10px}.overdrive-meter{width:82px!important;height:22px!important}.overdrive-meter>b{font-size:5px}.combat-strip #spell-stage{font-size:6px}.combat-strip #fusion-icons{top:98px;left:0;max-width:145px}.combat-strip #fusion-icons .ico{width:21px;height:21px}
.game .run-goal{top:177px;left:10px;max-width:190px;padding:12px 14px;border-image-width:15px}.run-goal>.ico{width:26px;height:26px}.run-goal b{font-size:7px}.run-goal small{font-size:6px!important}.game .boss-hud{top:177px;width:calc(100vw - 40px);padding:16px 20px;border-image-width:21px}.boss-hud>span{font-size:7px}.boss-hud>div{height:10px}.game:has(.boss-hud:not([hidden])) .run-goal{display:none}
.game-bottom{bottom:13px}.skillbar{padding:12px 17px 9px;gap:7px;border-image-width:22px;left:auto;right:10px;transform:none}.skill{width:58px;height:61px;border-image-width:13px}.skill .ico{width:41px;height:41px}.attack-skill{width:43px;height:48px;border-image-width:11px}.attack-skill .ico{width:34px;height:34px}.skill>b{font-size:5px}.skill>kbd{font-size:6px}.attack-skill small{font-size:5px}.skill>i:not(.ico){font-size:20px}.build-icons{bottom:104px;right:10px;max-width:calc(100vw - 25px);padding:8px 13px;border-image-width:13px}.build-icons .ico{width:23px;height:23px}.build-icons>span{padding:1px}.build-icons b{font-size:7px}.joystick{bottom:22px;left:22px;box-shadow:0 0 0 2px #8be9d333,inset 0 0 30px #a0ebd533}
}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation:none!important}.ui-mote{display:none}}

.gear-card.locked .big-icon{opacity:.75;filter:saturate(.65);position:relative}.gear-lock{position:absolute;right:-1px;bottom:0;background:#172238cc;border-radius:50%;padding:3px}.gear-lock .ico{width:25px!important;height:25px!important}.skill>.ico{position:relative;inset:auto;display:block;margin:auto;background-color:transparent;backdrop-filter:none;border-radius:0}.roster-top>.ico{font-size:0;padding:0;border:0;background-color:transparent}
@media(min-width:1000px){#modal[data-kind=equipment] .modal{width:min(1100px,calc(100vw - 44px));max-width:1100px}#modal[data-kind=equipment] .panel-grid{grid-template-columns:repeat(4,1fr)}#modal[data-kind=equipment] .panel-card{padding:24px 20px}#modal[data-kind=equipment] .big-icon{width:85px;height:85px}#modal[data-kind=equipment] .big-icon>.ico{width:82px;height:82px}}
/* Purpose-drawn button states and actual HUD meter frames. */
:root{--button-teal:url('button-teal.webp');--button-gold:url('button-gold.webp');--button-violet:url('button-violet.webp');--button-secondary:url('button-secondary.webp')}
.primary-btn,.card-action,.forge-footer .primary-btn{border-image:var(--button-teal) 45 150 fill / 15px 30px stretch}
.secondary-btn,.slot-tab,.settings-line button,.pause-buttons .secondary-btn,.leaderboard-form button{border-image:var(--button-secondary) 45 150 fill / 14px 27px stretch}
.epic .card-action,.store-card.featured .card-action,.forge-offer .card-action{border-image-source:var(--button-violet)}
button.primary-btn:hover:not(:disabled),button.card-action:hover:not(:disabled),button.slot-tab:hover:not(:disabled){border-image-source:var(--button-gold);color:#fff4cb}
.run-hud{border-image:url('hud-clock.webp') 48 155 fill / 20px 34px stretch}
.hp-track,.xp-track{padding:4px 14px;height:20px;background:#0b132b;border:0;border-image:none;overflow:visible;box-shadow:none}.xp-track{height:13px;padding:3px 12px;margin-top:7px}
.hp-track:before,.xp-track:before,.boss-hud>div:before{content:'';position:absolute;inset:-3px -4px;z-index:2;border:1px solid transparent;border-image:url('bar-health.webp') 30 145 / 8px 19px stretch;pointer-events:none}
.xp-track:before{border-image-source:url('bar-xp.webp');border-image-width:7px 17px}.hp-track>i,.xp-track>i{height:100%;max-width:100%;position:relative;z-index:1}.hp-track:after,.xp-track:after{z-index:3}
.boss-hud>div{height:20px;padding:4px 18px;border:0;position:relative;overflow:visible;background:#140e20}.boss-hud>div:before{inset:-5px -8px;border-image-source:url('bar-boss.webp');border-image-slice:40 155;border-image-width:10px 25px}.boss-hud>div>i{max-width:100%;height:100%;display:block}
@media(max-width:600px){.primary-btn,.card-action{border-image-width:12px 23px}.hp-track{height:14px;padding:3px 10px}.xp-track{height:9px;padding:2px 9px;margin-top:5px}.hp-track:before{border-image-width:6px 14px}.xp-track:before{border-image-width:5px 13px}.boss-hud>div{height:16px;padding:4px 15px}.boss-hud>div:before{border-image-width:8px 20px}.run-hud{border-image-width:15px 25px}}

.game:has(#boss-hud:not([hidden])) .run-goal{display:none}
/* Keep the overlay sized to the physical viewport in RTL mobile layouts. */
html,body{max-width:100%;overflow-x:clip}.app-layout,.lobby-main,.hero-grid,.hero-card{min-width:0}.veil{direction:ltr;width:100%;max-width:100vw;min-width:0}.modal{min-width:0;max-width:calc(100vw - 28px)}[dir=rtl] .app-layout{direction:ltr}[dir=rtl] .lobby-main,[dir=rtl] .modal{direction:rtl}
/* The same crafted materials cover every remaining control and menu panel. */
button{border-image:var(--button-secondary) 45 150 fill / 11px 20px stretch}.mage-card{background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 25px stretch;border-radius:12px;padding:23px 24px 20px;box-shadow:0 7px 25px #0004}.daily-btn{background:none;border:1px solid transparent;border-image:var(--button-violet) 45 150 fill / 16px 29px stretch;padding:15px 22px}.loadout-link{padding:13px 15px;border-image-width:11px 20px;margin:11px 0 3px}.loadout-link .ico{width:23px;height:23px}.difficulty button{border-image:var(--frame-hud) 125 fill / 8px stretch}.portal-note,.journey-summary,.forge-footer,.store-message{background:none;border:1px solid transparent;border-image:var(--frame-hud) 125 fill / 17px stretch;padding:17px 20px}.forge-footer{gap:12px}.primary-btn,.card-action{border-image-source:var(--button-teal)}.slot-tab.selected{border-image-source:var(--button-gold)}.icon-btn,.gear-mini,.rail-btn,.element-btn{border-image-source:var(--frame-hud);border-image-slice:125 fill}.rail-btn.active,.element-btn.selected{border-image-source:var(--frame-action)}
@media(max-width:600px){.mage-card{padding:17px 17px 19px;border-image-width:19px}.daily-btn{padding:12px 17px}.loadout-link{padding:10px 12px;border-image-width:9px 17px}.portal-note,.journey-summary,.forge-footer,.store-message{padding:14px 16px;border-image-width:14px}.forge-footer>div{display:none}}
/* Override compact legacy HUD rules so the painted vitals remain readable. */
.wave-banner{top:145px;max-width:430px;padding:18px 30px}.game:has(#wave-banner:not([hidden])) .run-goal{visibility:hidden}.game:has(#boss-hud:not([hidden])) .wave-banner{top:205px}.game:not([hidden])~.toast{bottom:145px}
@media(max-width:600px){.game .player-hud{width:228px;min-width:228px}.game .portrait{width:48px;height:48px;min-width:48px}.game .vital-label b{font-size:9px}.game .vital-label span{font-size:8px}.game .xp-label{display:flex;font-size:6px}.game .run-actions .kill-pill{display:flex}.game .wave-banner{top:158px;width:calc(100vw - 60px);max-width:330px;padding:13px 23px;border-image-width:19px}.game .wave-banner b{font-size:16px}.game .wave-banner small{font-size:6px}.game:not([hidden])~.toast{bottom:auto;top:240px;font-size:9px;max-width:calc(100vw - 70px);padding:12px 22px}}
.game .run-actions .kill-pill{position:static;top:auto;left:auto;display:flex}.overdrive-meter{background:none;border:1px solid transparent;border-image:url('bar-boss.webp') 40 155 fill / 6px 15px stretch;border-radius:0;padding:3px 9px;overflow:visible}.overdrive-meter>b{z-index:3}.overdrive-meter>i{position:relative;max-width:100%}
@media(max-width:600px){.game .run-actions .icon-btn{width:36px;height:36px}.modal-close{width:38px;height:38px}.game .run-actions .kill-pill{padding:0;gap:3px}.game .kill-pill .ico{width:21px;height:21px}.game .kill-pill b{font-size:10px}}
@media(max-width:600px){.game .run-hud{left:50%;right:auto;top:94px;transform:translateX(-50%);min-width:135px;width:135px}.game .wave-banner{top:165px}}
@media(max-width:360px){.game .player-hud{width:190px;min-width:190px;padding:11px 11px 10px 9px}.game .portrait{width:40px;height:40px;min-width:40px}.game .vitals{width:122px;min-width:0}.game .vital-label b{font-size:8px}.game .vital-label span{font-size:7px}.game .run-actions{padding:8px}.game .run-actions .icon-btn{width:32px;height:32px}.game .kill-pill .ico{width:17px;height:17px}}

#build-icons:empty{display:none}@media(max-width:600px){.skill kbd{display:none}}
#lobby button,#modal button,#game button{border-style:solid;border-color:transparent;border-width:1px}.text-btn,.lobby-footer button{padding:9px 18px;min-height:32px}.portal-note{flex-wrap:wrap}
