.equipment-grade-M { --equipment-grade-color: #fb7185; }
.equipment-upgrade-overlay { position:fixed; inset:0; z-index:10080; place-items:center; padding:20px; background:rgba(1,5,12,.82); backdrop-filter:blur(7px); }
.equipment-upgrade-panel { width:min(820px,96vw); max-height:min(780px,92vh); overflow:auto; border:1px solid rgba(251,113,133,.42); border-radius:18px 5px 18px 5px; color:#dbeafe; background:linear-gradient(145deg,rgba(19,25,41,.99),rgba(3,10,19,.99)); box-shadow:inset 4px 0 #fb7185,0 25px 80px rgba(0,0,0,.55),0 0 45px rgba(251,113,133,.08); }
.equipment-upgrade-panel>header { display:flex; justify-content:space-between; align-items:center; padding:20px 24px; border-bottom:1px solid rgba(148,163,184,.13); background:linear-gradient(90deg,rgba(136,19,55,.18),transparent); }
.equipment-upgrade-panel>header small { color:#fb7185; font:700 7px/1 'Press Start 2P',monospace; letter-spacing:.14em; }
.equipment-upgrade-panel>header h2 { margin:7px 0 0; color:#fff; font:700 20px/1.15 'Press Start 2P',monospace; }
#equipmentUpgradeClose { width:38px; height:38px; border:1px solid rgba(148,163,184,.22); border-radius:10px; color:#94a3b8; background:rgba(15,23,42,.8); font-size:24px; cursor:pointer; }
#equipmentUpgradeBody { padding:22px 24px 25px; }
.equipment-upgrade-path { display:grid; grid-template-columns:1fr auto 1fr auto 1fr; align-items:center; gap:10px; }
.equipment-upgrade-item { min-width:0; display:grid; justify-items:center; gap:7px; padding:14px 8px; border:1px solid rgba(148,163,184,.16); border-radius:12px 4px 12px 4px; background:rgba(15,23,42,.7); }
.equipment-upgrade-item>small { color:#64748b; font:700 6px/1 'Press Start 2P',monospace; }
.equipment-upgrade-item>span { width:72px; height:72px; display:grid; place-items:center; border-radius:12px; background:radial-gradient(circle,rgba(255,255,255,.08),transparent 68%); }
.equipment-upgrade-item img { max-width:68px; max-height:68px; image-rendering:pixelated; }
.equipment-upgrade-item strong { max-width:100%; overflow:hidden; color:#e2e8f0; font-size:11px; text-overflow:ellipsis; white-space:nowrap; }
.equipment-upgrade-item b { color:var(--equipment-grade-color,#f8fafc); font:700 8px/1 'Press Start 2P',monospace; }
.equipment-upgrade-item.is-result { --equipment-grade-color:#fb7185; border-color:rgba(251,113,133,.4); box-shadow:inset 0 0 24px rgba(251,113,133,.08); }
.equipment-upgrade-plus,.equipment-upgrade-arrow { color:#64748b; font:700 17px/1 'Press Start 2P',monospace; }
.equipment-upgrade-arrow { color:#fb7185; }
.equipment-upgrade-selection { margin-top:18px; padding:14px; border:1px solid rgba(56,189,248,.16); border-radius:12px; background:rgba(2,8,18,.58); }
.equipment-upgrade-selection>header { display:flex; justify-content:space-between; margin-bottom:10px; }
.equipment-upgrade-selection>header strong { color:#cbd5e1; font-size:11px; }
.equipment-upgrade-selection>header small { color:#38bdf8; font-size:9px; }
.equipment-upgrade-selection>div { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; max-height:145px; overflow:auto; }
.equipment-upgrade-selection button { display:grid; grid-template-columns:44px 1fr auto; align-items:center; gap:10px; padding:9px; border:1px solid rgba(148,163,184,.14); border-radius:9px; color:#cbd5e1; text-align:left; background:rgba(15,23,42,.8); cursor:pointer; }
.equipment-upgrade-selection button.is-selected { border-color:#fb7185; background:rgba(136,19,55,.2); box-shadow:inset 3px 0 #fb7185; }
.equipment-upgrade-selection button img { width:42px; height:42px; object-fit:contain; image-rendering:pixelated; }
.equipment-upgrade-selection button span { display:flex; min-width:0; flex-direction:column; gap:4px; }
.equipment-upgrade-selection button b { overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.equipment-upgrade-selection button small { color:#64748b; font-size:8px; }
.equipment-upgrade-selection button i { color:#fb7185; font:normal 700 6px/1 'Press Start 2P',monospace; }
.equipment-upgrade-summary { display:grid; grid-template-columns:repeat(3,1fr); gap:9px; margin-top:14px; }
.equipment-upgrade-summary>div { display:flex; min-height:75px; flex-direction:column; gap:6px; padding:11px 13px; border:1px solid rgba(148,163,184,.13); border-radius:9px; background:rgba(15,23,42,.55); }
.equipment-upgrade-summary small { color:#64748b; font:700 6px/1 'Press Start 2P',monospace; }
.equipment-upgrade-summary strong { color:#f8fafc; font-size:17px; }
.equipment-upgrade-summary strong.is-missing { color:#f87171; }
.equipment-upgrade-summary span:not(.equipment-upgrade-meter) { color:#64748b; font-size:8px; }
.equipment-upgrade-meter { height:5px; overflow:hidden; border-radius:9px; background:#1e293b; }
.equipment-upgrade-meter i { display:block; height:100%; background:linear-gradient(90deg,#fb7185,#fbbf24); box-shadow:0 0 8px #fb7185; }
.equipment-upgrade-risk { margin:12px 0; padding:10px 12px; border:1px solid rgba(251,191,36,.2); border-radius:8px; color:#d6b77a; background:rgba(120,53,15,.12); font-size:9px; line-height:1.5; }
.equipment-upgrade-risk.is-danger { border-color:rgba(248,113,113,.25); color:#fca5a5; background:rgba(127,29,29,.13); }
#equipmentUpgradeConfirm,#equipmentUpgradeContinue { width:100%; padding:15px; border:1px solid rgba(251,113,133,.65); border-radius:10px 3px 10px 3px; color:#fff; background:linear-gradient(135deg,#9f1239,#be123c); box-shadow:0 8px 28px rgba(159,18,57,.25); font:700 9px/1 'Press Start 2P',monospace; cursor:pointer; }
#equipmentUpgradeConfirm:disabled { opacity:.4; cursor:not-allowed; filter:grayscale(.5); }
#inventoryUpgradeBtn { width:100%; display:flex; align-items:center; gap:10px; margin-top:9px; padding:10px 12px; border:1px solid rgba(251,113,133,.35); border-radius:10px 3px 10px 3px; color:#ffe4e6; text-align:left; background:linear-gradient(135deg,rgba(159,18,57,.38),rgba(76,5,25,.5)); cursor:pointer; }
#inventoryUpgradeBtn[hidden] { display:none!important; }
#inventoryUpgradeBtn>span:first-child { width:31px; height:31px; display:grid; flex:0 0 31px; place-items:center; border:1px solid rgba(251,113,133,.3); border-radius:8px; color:#fb7185; background:rgba(0,0,0,.17); }
#inventoryUpgradeBtn>span:last-child { display:flex; flex-direction:column; gap:4px; }
#inventoryUpgradeBtn strong { font:700 8px/1 'Press Start 2P',monospace; }
#inventoryUpgradeBtn small { color:#d8a1ac; font-size:8px; }
.equipment-upgrade-outcome { display:grid; justify-items:center; gap:12px; padding:25px 15px 10px; text-align:center; }
.equipment-upgrade-outcome>small { color:#fb7185; font:700 7px/1 'Press Start 2P',monospace; letter-spacing:.12em; }
.equipment-upgrade-outcome>span { width:130px; height:130px; display:grid; place-items:center; border:1px solid rgba(251,113,133,.35); border-radius:50%; background:radial-gradient(circle,rgba(251,113,133,.22),transparent 68%); box-shadow:0 0 35px rgba(251,113,133,.13); }
.equipment-upgrade-outcome img { max-width:105px; max-height:105px; image-rendering:pixelated; }
.equipment-upgrade-outcome h3 { margin:0; color:#fff; font:700 15px/1.35 'Press Start 2P',monospace; }
.equipment-upgrade-outcome p { margin:0 0 8px; color:#94a3b8; font-size:10px; }
.equipment-upgrade-overlay.is-failure .equipment-upgrade-panel { border-color:rgba(248,113,113,.4); box-shadow:inset 4px 0 #ef4444,0 25px 80px rgba(0,0,0,.55); }
@media(max-width:700px){.equipment-upgrade-overlay{padding:8px}.equipment-upgrade-panel>header{padding:16px}.equipment-upgrade-panel>header h2{font-size:14px}#equipmentUpgradeBody{padding:15px}.equipment-upgrade-path{grid-template-columns:1fr auto 1fr}.equipment-upgrade-path .is-result{grid-column:1/-1}.equipment-upgrade-arrow{display:none}.equipment-upgrade-selection>div,.equipment-upgrade-summary{grid-template-columns:1fr}.equipment-upgrade-item>span{width:58px;height:58px}.equipment-upgrade-item img{max-width:55px;max-height:55px}}