.hero-bag{max-width:1150px;margin:auto}.bag-heading{display:flex;justify-content:space-between;align-items:center;margin:4px 0 24px}.bag-heading a{font-size:12px;color:var(--muted);text-decoration:none}.bag-heading h1{font-size:32px;margin:10px 0 5px;letter-spacing:-1px}.bag-heading h1 span{display:inline-block;vertical-align:middle;padding:5px 9px;background:var(--tint);color:var(--accent);border-radius:10px;font-size:14px;letter-spacing:0}.bag-heading p{font-size:13px;color:var(--muted);margin:0}.bag-power{text-align:right;display:grid;gap:4px}.bag-power small{font-size:9px;letter-spacing:1px;color:var(--muted)}.bag-power>b{font-size:36px;line-height:1;color:var(--accent)}.bag-equipped{display:grid;grid-template-columns:repeat(8,1fr);gap:9px;background:var(--surface);border:1px solid var(--line);padding:14px;border-radius:20px;margin-bottom:22px}.bag-equipped>button,.bag-empty-slot{min-width:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;padding:0;border:0;background:transparent;color:var(--muted);font-size:10px}.bag-equipped .bag-art{width:100%;aspect-ratio:1;border-radius:12px;border:1px solid #9382b345}.bag-empty-slot i{font-style:normal;width:100%;aspect-ratio:1;display:grid;place-items:center;border:1px dashed var(--line);border-radius:12px;color:var(--line);font-size:24px}.bag-tools{display:flex;gap:10px;margin:0 0 18px}.bag-tools input{flex:1;min-width:80px}.bag-tools select{max-width:180px}.bag-tools input,.bag-tools select,.bag-tools button{height:43px;margin:0;padding:10px 14px;border-radius:12px;border:1px solid var(--line);background:var(--surface);color:var(--text);font-family:inherit}.bag-worn-filter[aria-pressed=true]{background:var(--tint);color:var(--accent);border-color:var(--accent)}.bag-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:15px}.bag-item{--rarity:#929caf;min-width:0;display:flex;flex-direction:column;text-align:left;overflow:hidden;padding:0 0 15px;border:1px solid var(--line);background:var(--surface);color:var(--text);border-radius:18px;cursor:pointer;box-shadow:0 4px 18px #100f2310;transition:transform .15s,border-color .15s}.bag-item:hover{border-color:var(--rarity);transform:translateY(-2px)}[data-rarity=uncommon]{--rarity:#5abc90}[data-rarity=rare]{--rarity:#639dec}[data-rarity=epic]{--rarity:#ad7eea}[data-rarity=legendary]{--rarity:#dca855}.bag-art-wrap{position:relative;width:100%;padding:0;background:#11151b}.bag-art{display:block;aspect-ratio:1;background-repeat:no-repeat;background-color:#11151b;width:100%}.bag-item>.bag-art-wrap{border-bottom:2px solid var(--rarity)}.bag-worn{position:absolute;top:10px;left:10px;background:#152926de;border:1px solid #77d6b660;border-radius:7px;padding:5px 7px;color:#b8f1d7;font-size:10px;font-weight:600}.bag-upgrade{position:absolute;top:10px;right:10px;background:#211a35d9;color:#e0cbff;border-radius:7px;padding:5px 7px;font-size:11px}.bag-item>small{margin:12px 13px 6px;font-size:10px;font-weight:500;color:var(--muted)}.bag-item>b{padding:0 13px;font-size:14px;line-height:1.35;min-height:38px}.bag-item-bottom{display:flex;justify-content:space-between;align-items:center;gap:5px;width:100%;padding:10px 13px 0;margin-top:auto;box-sizing:border-box;font-size:11px;color:var(--muted)}.bag-item-bottom strong{color:var(--text);font-size:16px;margin-left:4px}.bag-delta{font-weight:700;font-size:12px}.bag-delta.up{color:#268260}.bag-delta.down{color:#ca4b67}.bag-delta.same{color:var(--muted)}[data-theme=dark] .bag-delta.up{color:#77d7ac}[data-theme=dark] .bag-delta.down{color:#f48fa5}.bag-required{color:#b38244;font-size:10px}.bag-more,.bag-refresh{display:block;margin:22px auto;padding:11px 25px;border:1px solid var(--line);border-radius:11px;background:var(--surface);color:var(--text)}.bag-refresh{font-size:12px;color:var(--muted);background:transparent}.bag-empty{text-align:center;padding:45px 20px;color:var(--muted)}.bag-empty h2{color:var(--text)}.bag-primary{display:block;text-align:center;text-decoration:none;padding:14px 20px;border:0;border-radius:12px;background:linear-gradient(120deg,#9972f1,#7052c9);color:white;font-weight:700;font-family:inherit;cursor:pointer}.bag-primary:disabled{opacity:.45;cursor:default}.bag-empty .bag-primary{max-width:220px;margin:22px auto}.bag-lock,.bag-error,.bag-pending,.bag-notice{border-radius:12px;padding:13px 16px;font-size:13px;line-height:1.5;background:var(--surface);border:1px solid var(--line);margin-bottom:14px}.bag-lock{color:var(--muted)}.bag-lock a{color:var(--accent)}.bag-error{color:#bd3654}.bag-notice{color:#268260}.bag-pending button{padding:10px 16px;color:white;background:#7959d6;border:0;border-radius:10px}.bag-dialog{padding:0;border:1px solid var(--line);border-radius:24px;width:min(800px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;background:var(--surface);color:var(--text);box-shadow:0 30px 100px #0008}.bag-dialog::backdrop{background:#070914b8;backdrop-filter:blur(6px)}.bag-item-detail{position:relative;display:grid;grid-template-columns:42% 58%;--rarity:#929caf}.bag-close{position:absolute;z-index:2;right:12px;top:12px;width:34px;height:34px;display:grid;place-items:center;border:1px solid #ffffff30;border-radius:50%;background:#111827ba;color:#fff;font-size:24px;cursor:pointer}.bag-detail-image{background:#0f151d;display:flex;flex-direction:column;justify-content:center}.bag-detail-image .large{aspect-ratio:3/4}.bag-detail-image>span:last-child:not(.bag-art){text-align:center;color:var(--rarity);padding:15px;border-top:1px solid #ffffff15;font-size:12px}.bag-detail-copy{padding:35px 28px 24px}.bag-detail-copy>small{font-size:11px;color:var(--muted)}.bag-detail-copy h2{font-size:25px;line-height:1.2;margin:9px 0 22px}.bag-own-stat{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding-bottom:18px;border-bottom:1px solid var(--line)}.bag-own-stat>b{font-size:32px;color:var(--accent)}.bag-own-stat>span{font-size:12px;color:var(--muted)}.bag-own-stat>strong{display:block;flex-basis:100%;font-size:12px;color:var(--rarity)}.bag-detail-copy h3{font-size:13px;margin:22px 0 12px}.bag-comparison{margin:0}.bag-comparison>div{display:flex;justify-content:space-between;gap:12px;margin:9px 0;font-size:12px}.bag-comparison dt{color:var(--muted)}.bag-comparison dd{margin:0;display:flex;gap:10px;align-items:center}.bag-comparison dd>span:not(.bag-delta){color:var(--muted)}.bag-replaces{font-size:11px;line-height:1.5;color:var(--muted);padding:12px;background:var(--tint);border-radius:10px}.bag-detail-copy .bag-primary{width:100%;margin-top:22px}.bag-detail-copy .bag-free{display:block;text-align:center;margin-top:10px;font-size:10px}.bag-loading{padding:25px}
@media(max-width:1000px){.bag-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.bag-equipped{gap:6px;padding:10px}}
@media(max-width:700px){.bag-heading{margin:0 0 18px}.bag-heading h1{font-size:27px}.bag-power>b{font-size:30px}.bag-equipped{grid-template-columns:repeat(4,1fr);gap:12px 9px;border-radius:16px}.bag-equipped .bag-art,.bag-empty-slot i{max-width:58px}.bag-equipped>button,.bag-empty-slot{font-size:9px}.bag-tools{display:grid;grid-template-columns:1fr 110px;gap:8px}.bag-tools input{grid-column:1/-1}.bag-tools select{max-width:none}.bag-tools input,.bag-tools select,.bag-tools button{font-size:12px}.bag-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.bag-item{border-radius:14px;padding-bottom:12px}.bag-item>b{font-size:12px;padding:0 10px;min-height:34px}.bag-item>small{font-size:9px;margin:9px 10px 6px}.bag-item-bottom{padding:8px 10px 0;font-size:10px}.bag-item-bottom strong{font-size:14px}.bag-worn{font-size:9px;top:7px;left:7px}.bag-upgrade{top:7px;right:7px;font-size:10px}.bag-dialog{width:calc(100vw - 20px);max-height:calc(100dvh - 20px);border-radius:20px}.bag-item-detail{display:block}.bag-detail-image{position:relative;max-height:190px;overflow:hidden;align-items:center}.bag-detail-image .large{width:180px;aspect-ratio:1}.bag-detail-image>span:last-child:not(.bag-art){position:absolute;bottom:8px;left:10px;padding:6px 9px;border:1px solid #ffffff20;background:#121822cc;border-radius:8px;font-size:10px}.bag-detail-copy{padding:20px}.bag-detail-copy h2{font-size:23px;margin:8px 0 14px}.bag-own-stat{padding-bottom:12px}.bag-detail-copy h3{margin:16px 0 10px}.bag-comparison>div{margin:8px 0}.bag-detail-copy .bag-primary{margin-top:16px}.bag-replaces{margin:12px 0 0}}
@media(prefers-reduced-motion:reduce){.bag-item{transition:none}}

.bag-close{padding:0;min-height:34px!important;min-width:34px}.bag-item-detail[data-rarity=uncommon]{--rarity:#5abc90}.bag-item-detail[data-rarity=rare]{--rarity:#639dec}.bag-item-detail[data-rarity=epic]{--rarity:#ad7eea}.bag-item-detail[data-rarity=legendary]{--rarity:#dca855}
.bag-empty-slot i{color:var(--muted)}
