.upgrade-pending,.upgrade-guidance{font-size:11px;color:#b1a3bd;line-height:1.8;margin:0 auto 20px;max-width:520px;padding:12px 18px;background:#211c29;border:1px solid #ffffff08;border-radius:8px}.upgrade-pending{color:#dfc084;border-color:#dfc08433}.upgrade-outcome{max-width:680px;margin:0 auto 28px;padding:27px;background:radial-gradient(ellipse at top,#d6b36714,transparent),#1d1923;border:1px solid #d6b36740;border-radius:14px}.upgrade-outcome.success{border-color:#8cdcbb55;background:radial-gradient(ellipse at top,#8cdcbb12,transparent),#191e20}.upgrade-outcome>span{font-size:8px;letter-spacing:2px;color:#c5b096}.upgrade-outcome.success>span{color:#8cdcbb}.upgrade-outcome h2{font-size:32px;margin:12px 0}.upgrade-outcome p{font-size:12px;color:#aea0b9;line-height:1.8;margin-bottom:22px}.upgrade-outcome>div{display:flex;justify-content:center;gap:10px;flex-wrap:wrap}.upgrade-outcome .btn{width:auto;min-width:180px}.upgradearea+.upgradeaction:has(.upgrade-outcome)>#upgradebutton,.upgradearea+.upgradeaction:has(.upgrade-outcome)>.multiplier,.upgradearea+.upgradeaction:has(.upgrade-outcome)>.testswitch{display:none}.columns{scroll-margin-top:120px}.columns button:disabled{cursor:wait;opacity:.6}.upgradeaction select:disabled{opacity:.5}
@media(max-width:560px){.upgrade-outcome{padding:21px 15px}.upgrade-outcome h2{font-size:27px}.upgrade-outcome .btn{width:100%}.upgrade-pending,.upgrade-guidance{font-size:10px}.columns{scroll-margin-top:130px}}

.target-summary{display:flex;align-items:center;min-height:34px;margin:4px 0 14px;font-size:11px;color:#a89ab7}
#targets .target-estimate{display:flex;justify-content:space-between;align-items:center;gap:8px;margin-top:12px;padding-top:10px;border-top:1px solid #ffffff12;font-size:10px;color:#a99bb7}
#targets .target-estimate b{color:#e8c485;font-size:13px;font-variant-numeric:tabular-nums}
#targets .itemcard.selected{outline:2px solid var(--gold);outline-offset:-2px}
#targets .empty{grid-column:1/-1;padding:28px 16px}
#targets .empty p{font-size:12px;line-height:1.7;margin-bottom:18px}
.columns .itemcard:focus-visible{outline:2px solid #f2d6a2;outline-offset:3px}
@media(max-width:560px){
 .target-tools{display:grid;grid-template-columns:1fr 1fr;gap:8px}
 .target-tools #targetSearch{grid-column:1/-1;width:100%;min-width:0}
 .target-tools input,.target-tools select{width:100%;min-width:0;min-height:44px}
 .upgradeaction .multiplier .chip{min-width:56px;min-height:42px}
 .target-summary{font-size:10px}
}

.target-pagination{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:22px 0;align-self:auto}.target-pagination span{font-size:11px;color:#a89ab7}.target-pagination button{min-height:44px}.target-pagination button:disabled{opacity:.35;cursor:default}#target-summary{scroll-margin-top:115px}

.upgrade-selection-context{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 16px;padding:14px;background:#dfc0840a;border:1px solid #dfc08430;border-radius:10px}.upgrade-selection-context[hidden]{display:none}.upgrade-selection-context p{margin:0;color:#c9bdcf;font-size:12px;line-height:1.6;overflow-wrap:anywhere}.upgrade-selection-context button{flex-shrink:0;min-height:44px}.upgrade-selection-context button:focus-visible{outline:2px solid #dfc084;outline-offset:3px}@media(max-width:600px){.upgrade-selection-context{align-items:stretch;flex-direction:column}}

/* Upgrade workspace: selectors stay inside the existing upgrade structure. */
.upgradearea{gap:24px;padding:30px;border-radius:24px;background:radial-gradient(ellipse at 50% 30%,#d7ad5714,transparent 62%),linear-gradient(145deg,#1e2029,#14161d);border-color:#ffffff12;box-shadow:0 18px 48px #00000020}
.upgradearea>.slot{min-width:0;min-height:258px;padding:24px 18px;border-radius:18px;border-color:#ffffff0d;background:linear-gradient(160deg,#ffffff06,#ffffff01);box-shadow:inset 0 1px 0 #ffffff05}
.upgradearea>.slot:first-child{border-top:2px solid #91cbb373;background:radial-gradient(ellipse at bottom,#91cbb30b,transparent 75%),#ffffff02}
.upgradearea>.slot:last-child{border-top:2px solid #e6bc7073;background:radial-gradient(ellipse at bottom,#e6bc700c,transparent 75%),#ffffff02}
.upgradearea>.slot>small{letter-spacing:.15em;font-size:9px;font-weight:800;margin:10px 0 8px}
.upgradearea>.slot:first-child>small{color:#a3dac3}
.upgradearea>.slot>h3{line-height:1.5;font-size:14px;overflow-wrap:anywhere;max-width:100%}
.upgradearea>.slot>p{font-size:14px;font-weight:700;font-variant-numeric:tabular-nums;color:#d5cbdc;margin:10px 0 0}
.upgradearea .dial{box-shadow:0 0 0 9px #ffffff03,0 0 0 10px #ffffff08,0 18px 55px #0004}
.upgradearea .dialinner{background:radial-gradient(ellipse at 50% 20%,#30303b,#181820 78%)}
.upgradearea .dial small{max-width:90%;text-align:center;line-height:1.6;letter-spacing:.1em}
.upgradearea+.upgradeaction{margin:24px 0 38px;padding:0 12px}
.upgradeaction>#upgradebutton{min-height:52px;width:min(100%,320px);border-radius:12px;font-size:12px;box-shadow:0 8px 26px #e6bc7015}
.upgradeaction>.multiplier{gap:8px;margin:16px 0}
.upgradeaction>.multiplier>.chip{min-width:64px;min-height:44px;border-radius:10px;background:#ffffff05;border-color:#ffffff10;font-size:12px}
.upgradeaction>.testswitch{flex-wrap:wrap;gap:10px;line-height:1.6;margin:20px 0 10px;color:#b1a9bc}
.upgradeaction>.testswitch>select{min-height:40px;border-radius:8px;background:#1d1c26;border-color:#ffffff15}
.upgradeaction>.chance-note{line-height:1.8;color:#a79daf;max-width:560px;margin:12px auto}
.upgradeaction>.upgrade-pending,.upgradeaction>.upgrade-guidance{border-radius:12px;padding:15px 18px;background:#ffffff04;color:#beb4c8}
.upgradeaction>.upgrade-pending{background:#e6bc7009;color:#ecd2a3;border-color:#e6bc7038}
.upgradeaction>.upgrade-outcome{border-radius:20px;padding:28px;box-shadow:0 12px 36px #0002}
.upgradeaction>.upgrade-outcome h2{font-size:36px;line-height:1.1}
.upgradeaction+.columns{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;align-items:start;scroll-margin-top:120px}
.upgradeaction+.columns>section{--upgrade-accent:#a3dac3;min-width:0;padding:22px;border:1px solid #ffffff10;border-top:2px solid #91cbb350;border-radius:18px;background:linear-gradient(150deg,#20212b,#191920);box-shadow:0 10px 32px #00000015}
.upgradeaction+.columns>section:last-child{--upgrade-accent:#e6bc70;border-top-color:#e6bc7050}
.upgradeaction+.columns>section>h2{display:flex;align-items:center;gap:12px;margin:0 0 20px;font-size:26px;letter-spacing:.025em}
.upgradeaction+.columns>section>h2>span{font:700 11px Manrope,Arial,sans-serif;color:var(--upgrade-accent);background:#ffffff05;border:1px solid #ffffff0c;border-radius:7px;padding:5px 8px;font-variant-numeric:tabular-nums}
.upgradeaction+.columns .source-tools{display:flex;gap:8px;margin:0 0 14px}
.upgradeaction+.columns .source-tools input{flex:1;width:100%;min-width:0}
.upgradeaction+.columns :is(.source-tools,.target-tools) :is(input,select){min-height:44px;padding:11px 12px;background:#12131b;border:1px solid #ffffff15;border-radius:9px;color:#eee8f3;font-size:11px}
.upgradeaction+.columns :is(.source-tools,.target-tools) input::placeholder{color:#9e94aa}
.upgradeaction+.columns .chip{border-radius:9px;min-height:44px;background:#ffffff04;border-color:#ffffff12;color:#cec4d8}
.upgradeaction+.columns .target-collection-filters{gap:10px;padding:12px;background:#ffffff03;border:1px solid #ffffff08;border-radius:10px}
.upgradeaction+.columns .target-summary{font-size:11px;line-height:1.75;min-height:36px;color:#b1a7bd;scroll-margin-top:120px}
.upgradeaction+.columns .itemgrid{gap:10px}
.upgradeaction+.columns .itemcard{border-radius:12px;background:radial-gradient(ellipse at 50% 15%,color-mix(in srgb,var(--rarity) 10%,transparent),transparent 75%),#171820;border-color:#ffffff0d;border-bottom-color:var(--rarity);transition:border-color .18s,background-color .18s,box-shadow .18s}
.upgradeaction+.columns .itemcard h3{line-height:1.45;overflow-wrap:anywhere}
.upgradeaction+.columns .itemcard.selected{outline:2px solid var(--upgrade-accent);outline-offset:-2px;background-color:#262832;box-shadow:0 0 0 3px color-mix(in srgb,var(--upgrade-accent) 9%,transparent)}
.upgradeaction+.columns .itemcard[aria-pressed="true"]>small{color:var(--upgrade-accent)}
.upgradeaction+.columns .target-pagination{padding-top:14px;margin:18px 0 0;border-top:1px solid #ffffff0c;flex-wrap:wrap}
/* These content pagers must not inherit the fixed mobile header nav height. */
nav#source-pagination,nav#target-pagination{height:auto;min-height:0;order:initial}
.upgradeaction+.columns .target-pagination span{font-variant-numeric:tabular-nums;color:#b9aec5}
.upgradeaction+.columns .upgrade-selection-context{gap:12px;padding:14px;border-radius:12px;background:color-mix(in srgb,var(--upgrade-accent) 6%,#191920);border-color:color-mix(in srgb,var(--upgrade-accent) 30%,transparent);border-left-width:3px}
.upgradeaction+.columns .upgrade-selection-context p{font-size:11px;color:#d9d0e0}
.upgradeaction+.columns .upgrade-selection-context button{white-space:normal;line-height:1.5;color:var(--upgrade-accent);max-width:190px}
.upgradeaction+.columns .empty{padding:32px 18px;border-radius:12px;background:#ffffff02;border-color:#ffffff16;color:#b3a8bf}
.upgradeaction+.columns .empty h3{color:#e7dfef;font-size:23px;line-height:1.3}
.upgradeaction+.columns .empty p{font-size:12px;line-height:1.8}
.upgradeaction+.columns :is(button,input,select):focus-visible,.upgradeaction :is(button,select,a):focus-visible{outline:2px solid #f5d79c;outline-offset:3px}
/* Keep keyboard focus outside the card even when its selected outline is inset. */
#upgrade-sources .itemcard:focus-visible,#targets .itemcard:focus-visible{outline:2px solid #f5d79c;outline-offset:3px}
.upgradeaction+.columns button:disabled{cursor:not-allowed;opacity:.45}
.upgradeaction+.columns .itemcard:disabled{opacity:.65}
@media(hover:hover){.upgradeaction+.columns .itemcard:not(:disabled):hover{border-color:var(--rarity);background-color:#24232e;box-shadow:0 5px 18px #0003}.upgradeaction+.columns .chip:not(:disabled):hover{background:#ffffff09;border-color:#ffffff28}}
@media(max-width:1100px){.upgradeaction+.columns>section{padding:16px}.upgradearea{gap:16px;padding:22px}.upgradearea>.slot{padding:18px 12px;min-height:230px}.upgradeaction+.columns .upgrade-selection-context{align-items:stretch;flex-direction:column}.upgradeaction+.columns .upgrade-selection-context button{max-width:none}}
@media(max-width:760px){.upgradeaction+.columns{grid-template-columns:1fr;gap:18px}.upgradeaction+.columns .itemgrid{grid-template-columns:repeat(3,minmax(0,1fr))}.upgradearea>.slot>h3{font-size:12px}.upgradearea>.slot>p{font-size:12px}}
@media(max-width:560px){.upgradearea{padding:18px 12px;gap:12px;border-radius:18px}.upgradearea>.slot{min-height:195px;padding:14px 9px;border-radius:12px}.upgradearea>.slot>small{font-size:8px;letter-spacing:.08em}.upgradearea .dialwrap{padding-top:8px}.upgradeaction+.columns>section{padding:16px 12px;border-radius:14px}.upgradeaction+.columns>section>h2{font-size:24px;margin-bottom:16px}.upgradeaction+.columns .itemgrid{grid-template-columns:repeat(2,minmax(0,1fr))}.upgradeaction+.columns .itemcard{padding:12px}.upgradeaction+.columns .itemcard h3{font-size:11px}.upgradeaction>.upgrade-outcome{padding:22px 16px}.upgradeaction>.upgrade-outcome h2{font-size:30px}.upgradeaction+.columns .target-pagination{gap:8px}.upgradeaction+.columns .target-pagination .chip{padding-inline:12px}.upgradeaction+.columns .target-summary{scroll-margin-top:140px}}
@media(prefers-reduced-motion:reduce){.upgradearea,.upgradearea *,.upgradeaction *,.upgradeaction+.columns *{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.upgrade-stages{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;list-style:none;margin:0 0 20px;padding:0}.upgrade-stages li{display:flex;align-items:center;gap:10px;min-width:0;padding:14px;border:1px solid #ffffff0c;border-radius:10px;background:#18151e;color:#a99ab7;font-size:11px;line-height:1.6}.upgrade-stages li>span{display:grid;place-items:center;flex:0 0 27px;height:27px;border:1px solid #ffffff15;border-radius:50%;font-variant-numeric:tabular-nums}.upgrade-stages .current{color:#f0d39e;border-color:#e4b96a55;background:#e4b96a0b}.upgrade-stages .current>span{background:#e4b96a;color:#201a12;border-color:#e4b96a}.upgrade-stages .done{color:#a4d5bc}.upgrade-save-status{border-top:1px solid #ffffff14;padding-top:14px;font-size:11px!important;line-height:1.8}@media(max-width:600px){.upgrade-stages{grid-template-columns:repeat(2,minmax(0,1fr));gap:7px}.upgrade-stages li{padding:11px;font-size:10px}}
