/* Skill configuration: scoped to the existing modal only. */
#loadout-dialog{width:min(1120px,96vw);max-height:94dvh;border-radius:12px;border:1px solid #26b5e3;background:linear-gradient(120deg,#06243a,#061b2e);color:#e8f4ff;overflow:hidden;font-family:'Segoe UI',sans-serif}#loadout-dialog #editor-host{padding:0;overflow:hidden;max-height:none}#loadout-dialog>header{height:91px;padding:12px 18px;background:linear-gradient(100deg,#041c30,#08263b);position:relative;overflow:hidden;border-bottom:1px solid #28739a}#loadout-dialog .skill-hero{display:flex;align-items:center;gap:12px;width:100%;min-width:0}#loadout-dialog .skill-hero>canvas:first-child{width:75px!important;height:75px!important;object-fit:contain;image-rendering:pixelated;flex:none}#loadout-dialog .skill-hero>div{position:relative;z-index:1}#loadout-dialog .skill-hero h2{font:900 24px/1.2 'Segoe UI',sans-serif;margin:4px 0 5px;color:#eef9ff}#loadout-dialog .skill-hero small{font-size:8px;color:#20d3fb;letter-spacing:1.5px}#loadout-dialog .skill-hero-art{position:absolute;right:55px;top:-75px;width:300px!important;height:300px!important;object-fit:contain;image-rendering:pixelated;opacity:.35;mask-image:linear-gradient(90deg,transparent,#000 50%);pointer-events:none}#loadout-dialog>header>button{z-index:2;position:absolute;right:15px;top:16px;min-width:35px;height:35px;padding:0;border-color:#4f8bb1;font-size:25px;background:#133650a8;color:#d7ebfb}
#loadout-dialog #loadout-tabs{padding:7px 16px;margin:0;display:flex;gap:5px;border-bottom:1px solid #27506b;overflow-x:auto;background:#061b2c}#loadout-dialog .loadout-tab{font:700 10px 'Segoe UI',sans-serif;display:flex;align-items:center;gap:3px;padding:4px 8px;white-space:nowrap;border:1px solid #285b7d;border-radius:4px;background:#0a293e;color:#a8cadd}#loadout-dialog .loadout-tab canvas{width:22px!important;height:22px!important;object-fit:contain}#loadout-dialog .loadout-tab.active{border-color:#ffcf46;background:#253a3c;color:#ffe393}
#loadout-dialog .skill-layout{display:grid;grid-template-columns:40% minmax(0,1fr)}#loadout-dialog .skill-catalog{padding:16px;border-right:1px solid #1f526f;min-width:0}#loadout-dialog h3{font:800 10px/1.3 'Segoe UI',sans-serif;letter-spacing:.3px;color:#d4e6f3;margin:0 0 10px}#loadout-dialog #skill-filters{display:flex;gap:5px;flex-wrap:wrap;margin-bottom:10px}#loadout-dialog #skill-filters button{padding:6px 10px;border:1px solid #235a7b;background:linear-gradient(#0c3049,#08263a);border-radius:5px;color:#c4dded;font:10px 'Segoe UI',sans-serif}#loadout-dialog #skill-filters [aria-pressed=true]{background:#036ba6;border-color:#25d5ff;color:#f1fcff;box-shadow:0 0 6px #06baff33}#loadout-dialog #move-options{display:flex;flex-direction:column;gap:6px;overflow-y:auto;height:466px;max-height:calc(91dvh - 265px);padding:2px 6px 3px 1px;scrollbar-color:#139ed7 #082335;scrollbar-width:thin}#loadout-dialog #move-options .move-option{display:grid;grid-template-columns:46px minmax(75px,1fr) repeat(3,43px);gap:7px;align-items:center;flex:none;min-height:62px;padding:7px;border:1px solid #184a68;border-radius:6px;background:linear-gradient(110deg,#0c2d43,#08273d);color:#e4f4ff;text-align:left;box-shadow:none}#loadout-dialog #move-options .move-option.selected{border:2px solid #ffce44;padding:6px;box-shadow:0 0 0 1px #ffce4438,inset 0 0 10px #ffe38b0a}#loadout-dialog #move-options .move-option:hover{background:#123a52}#loadout-dialog #move-options .move-option>canvas{width:46px;height:46px;border:1px solid #29617e;border-radius:5px;object-fit:contain;image-rendering:auto}.skill-list-name{min-width:0}.skill-list-name strong{display:block;font:800 11px/1.25 'Segoe UI',sans-serif;margin-bottom:5px;color:#eef8ff}.skill-list-metric{text-align:center;display:flex;flex-direction:column;gap:5px}.skill-list-metric small{font:8px 'Segoe UI',sans-serif;color:#86b2ce}.skill-list-metric b{font:850 11px 'Segoe UI',sans-serif;color:#e5f6ff}.skill-type{display:inline-block;border:1px solid var(--element);border-radius:4px;background:color-mix(in srgb,var(--element) 20%,#061b2e);color:var(--element);padding:2px 6px;font:800 8px/1.1 'Segoe UI',sans-serif;margin-right:4px}.skill-category{display:inline-block;font:700 8px 'Segoe UI',sans-serif;text-transform:uppercase;border:1px solid #235576;border-radius:4px;color:#8dc6e7;padding:4px 7px}
#loadout-dialog .skill-context{padding:16px 18px 12px;min-width:0;overflow-y:auto;max-height:calc(94dvh - 135px);scrollbar-color:#168abd #092a3b;scrollbar-width:thin}.skill-detail-heading{display:flex;align-items:center;gap:15px}.skill-large-icon canvas{display:block;width:70px;height:70px;border:1px solid #33759c;border-radius:7px}.skill-detail-heading h2{font:900 22px/1.2 'Segoe UI',sans-serif;margin:0 0 8px;color:#f1f9ff}.skill-description{font:12px/1.5 'Segoe UI',sans-serif;color:#b6d0e2;margin:11px 0}.skill-indicators{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px}.skill-indicators>div{position:relative;display:flex;flex-direction:column;justify-content:center;gap:2px;min-height:58px;padding:9px 6px 7px 31px;border:1px solid #20526f;border-radius:5px;background:linear-gradient(120deg,#0b2c42,#072135);min-width:0}.skill-indicators i{position:absolute;left:8px;top:13px;font:23px/1 Arial;color:#29bfff;font-style:normal}.skill-indicators>div:first-child i{color:#ff5269}.skill-indicators>div:nth-child(2) i{color:#956bff}.skill-indicators b{font:900 16px/1.1 'Segoe UI',sans-serif;overflow-wrap:anywhere}.skill-indicators>div:last-child b{font-size:10px}.skill-indicators span{font:8px/1.4 'Segoe UI',sans-serif;color:#82b6d6}.skill-indicators small{display:block;font:8px 'Segoe UI',sans-serif;color:#78a6c2}.skill-specifics{font:10px/1.4 'Segoe UI',sans-serif;color:#94cce4;margin:7px 0}.skill-preview{position:relative;border:1px solid #28627f;border-radius:6px;overflow:hidden;margin:10px 0 14px;background:#061b29}.skill-preview>canvas{width:100%;height:auto;display:block;aspect-ratio:720/220;image-rendering:auto}.skill-preview button{position:absolute;left:10px;bottom:27px;width:33px;height:33px;border:1px solid #a9cce3;border-radius:50%;background:#0b263ddd;color:#eef9ff;font-size:14px}.skill-preview small{display:block;font:8px/1.3 'Segoe UI',sans-serif;padding:5px 9px;color:#83b0ca;background:#051828}.skill-context>h3 small{font:9px 'Segoe UI',sans-serif;letter-spacing:0;color:#739eb8;margin-left:8px}
#loadout-dialog #equipped-slots{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;margin:0}#loadout-dialog #equipped-slots .equip-slot{display:flex;flex-direction:column;align-items:start;gap:5px;min-width:0;min-height:115px;padding:7px;border:1px solid #235c7e;border-radius:6px;background:linear-gradient(125deg,#0b2b42,#062036);box-shadow:none;text-align:left;color:#d9edfb}#loadout-dialog #equipped-slots .equip-slot.active{border:2px solid #ffce44;padding:6px;background:linear-gradient(125deg,#263d3f,#102a36)}#loadout-dialog #equipped-slots .equip-slot>small{display:flex;justify-content:space-between;width:100%;font:8px 'Segoe UI',sans-serif;color:#80bfde}#loadout-dialog #equipped-slots .active>small{color:#ffe16f}#loadout-dialog #equipped-slots .equip-slot>small>span{font-size:12px}#loadout-dialog #equipped-slots canvas{width:46px;height:40px;object-fit:cover;border:1px solid #2b647d;border-radius:4px}#loadout-dialog #equipped-slots .equip-slot>b{font:800 10px/1.2 'Segoe UI',sans-serif;white-space:normal;color:#edf8ff}#loadout-dialog #equipped-slots .skill-type{font-size:7px;padding:2px 4px}.skill-footer{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:12px}.skill-footer button{min-height:36px;padding:8px 14px;border-radius:6px;font:800 10px 'Segoe UI',sans-serif;text-transform:uppercase}.skill-footer #reset-loadout{background:linear-gradient(#0b344e,#082538);border:1px solid #36769d;color:#c5dfef}.skill-footer #confirm-loadout{background:linear-gradient(125deg,#ffe66b,#ffb817);border:1px solid #ffe176;box-shadow:inset 0 1px #fff5b5;color:#33230c}#loadout-dialog #loadout-status{font:9px/1.3 'Segoe UI',sans-serif;color:#90b9d1;margin:7px 0 0}#loadout-dialog #loadout-empty{padding:20px}
@media(max-width:900px){#loadout-dialog .skill-layout{grid-template-columns:42% minmax(0,1fr)}#loadout-dialog .skill-catalog{padding:11px}#loadout-dialog .skill-context{padding:11px}#loadout-dialog #move-options .move-option{grid-template-columns:36px minmax(60px,1fr) repeat(3,32px);gap:4px;padding:5px}#loadout-dialog #move-options .move-option>canvas{width:36px;height:36px}.skill-list-name strong{font-size:10px}.skill-list-metric b{font-size:10px}.skill-list-metric small{font-size:7px}.skill-detail-heading h2{font-size:18px}.skill-large-icon canvas{width:54px;height:54px}.skill-indicators{gap:4px}.skill-indicators>div{padding-left:22px}.skill-indicators i{font-size:16px;left:4px}.skill-indicators b{font-size:13px}.skill-indicators>div:last-child b{font-size:8px}#loadout-dialog #equipped-slots{gap:4px}.skill-footer button{padding:7px 9px;font-size:9px}}
@media(max-width:650px){#loadout-dialog{width:96vw;max-height:94dvh}#loadout-dialog>header{height:85px;padding:9px}#loadout-dialog .skill-hero h2{font-size:20px}#loadout-dialog .skill-hero>canvas:first-child{width:55px!important;height:55px!important}#loadout-dialog .skill-hero-art{width:190px!important;height:190px!important;right:20px;top:-35px;opacity:.17}#loadout-dialog .skill-layout{display:block;overflow-y:auto;max-height:calc(94dvh - 130px)}#loadout-dialog .skill-catalog{padding:10px;border-right:0;border-bottom:1px solid #235674}#loadout-dialog #move-options{height:190px;max-height:190px}#loadout-dialog #move-options .move-option{grid-template-columns:39px minmax(75px,1fr) repeat(3,37px)}#loadout-dialog #move-options .move-option>canvas{width:39px;height:39px}#loadout-dialog #skill-filters button{padding:5px 8px;font-size:9px}#loadout-dialog .skill-context{max-height:none;overflow:visible;padding:12px}.skill-indicators>div{min-height:58px}.skill-context>h3 small{display:block;margin:4px 0 0}.skill-description{font-size:11px}#loadout-dialog #equipped-slots{grid-template-columns:repeat(2,minmax(0,1fr))}#loadout-dialog #equipped-slots .equip-slot{min-height:113px}.skill-footer{position:sticky;bottom:0;padding:8px 0;margin-bottom:0;background:#071f31;z-index:1}.skill-footer button{font-size:9px;min-height:38px}.skill-preview small{font-size:7px}}
@media(prefers-reduced-motion:reduce){#loadout-dialog *{scroll-behavior:auto!important;transition:none!important}}
#loadout-dialog #loadout-title{font:900 24px/1.2 'Segoe UI',sans-serif;color:#eff8ff;letter-spacing:0;margin:3px 0 6px}#loadout-dialog .skill-footer{padding:0;border:0;background:none;margin:11px 0 0;min-height:36px}#loadout-dialog .skill-footer #reset-loadout{font:800 10px 'Segoe UI',sans-serif;padding:8px 14px;border:1px solid #36769d;border-radius:6px;background:linear-gradient(#0b344e,#082538);color:#c5dfef;text-align:center}#loadout-dialog .skill-footer #confirm-loadout{font:850 10px 'Segoe UI',sans-serif;padding:8px 14px}
@media(max-width:650px){#loadout-dialog #loadout-title{font-size:20px}#loadout-dialog .skill-footer{padding:8px 0;background:#071f31}#loadout-dialog .skill-footer #reset-loadout,#loadout-dialog .skill-footer #confirm-loadout{font-size:9px;padding:8px 9px}}
