/* Capsule visual system — shared inventory, augmentation and reward artwork. */
.capsule-render, .capsule-choice, .capsule-inventory-card, .selected-capsule-art { --capsule-tier: #b8c4d0; }
.rarity-Uncommon, .capsule-render[data-capsule-rarity="uncommon"] { --capsule-tier: #4ade80; }
.rarity-Rare, .capsule-render[data-capsule-rarity="rare"] { --capsule-tier: #60a5fa; }
.rarity-Epic, .capsule-render[data-capsule-rarity="epic"] { --capsule-tier: #a78bfa; }
.rarity-Legendary, .capsule-render[data-capsule-rarity="legendary"] { --capsule-tier: #facc15; }
img.capsule-render {
  object-fit: contain;
  box-sizing: border-box;
  border: 1px solid var(--capsule-tier);
  border-radius: 7px;
  background: #10151c;
  filter: none !important;
  padding: 3px;
}
.capsule-choice-art img.capsule-render,
.capsule-inventory-art img.capsule-render,
.selected-capsule-art img.capsule-render { border: 0; background: none; padding: 0; }
.capsule-selector-panel { background: linear-gradient(150deg, #151d27, #090e15); border-color: #344150; padding: 20px; }
.selected-capsule-stage { min-height: 260px; background: radial-gradient(ellipse at center, #243342 0%, #101720 65%); border-color: #2d3947; }
.selected-capsule-art { width: min(240px, 65vw); border: 1px solid var(--capsule-tier); border-radius: 12px; animation: none; background: #101720; }
.selected-capsule-art::before, .selected-capsule-art::after, .selected-capsule-scanlines { display: none; }
.selected-capsule-art img { animation: none !important; filter: none !important; }
.selected-capsule-row strong { color: #f0f4fa; }
.capsule-selector-filters { grid-template-columns: minmax(140px, 1.3fr) repeat(3, minmax(100px, 1fr)) 40px; padding: 0; border: 0; background: none; }
.capsule-selector-grid { grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 10px; max-height: 440px; overflow-y: auto; padding: 3px; scrollbar-color: #61778d #15202a; }
.capsule-choice, .capsule-choice.corrupted {
  border: 1px solid color-mix(in srgb, var(--capsule-tier) 55%, #17202a);
  background: #111923; padding: 12px; border-radius: 10px; min-height: 108px;
}
.capsule-choice { font-family: inherit !important; text-transform: none !important; letter-spacing: normal !important; border-radius: 10px !important; }
.capsule-choice.active, .capsule-choice:hover:not(:disabled) { border-color: var(--capsule-tier); background: #1a2634; box-shadow: inset 0 0 0 1px var(--capsule-tier); }
.capsule-choice:focus-visible { outline: 2px solid #fff; outline-offset: 3px; }
.capsule-choice-art { width: 70px; height: 78px; flex: 0 0 70px; }
.capsule-choice-art img { width: 100%; height: 100%; filter: none; }
.capsule-choice-name { font-size: 13px; line-height: 1.4; }
.capsule-tier-line { display: flex !important; flex-wrap: wrap; align-items: center; gap: 5px; color: var(--capsule-tier) !important; font-size: 10px; font-weight: 700; letter-spacing: .035em; margin-top: 7px; }
.capsule-tier-pips { display: inline-flex !important; gap: 3px; margin: 0 !important; }
.capsule-tier-pips i { width: 4px; height: 4px; background: var(--capsule-tier); border-radius: 1px; }
.capsule-corruption-tag { display: inline-flex !important; color: #ff9b91 !important; background: #431e22; border: 1px solid #824048; border-radius: 4px; padding: 1px 5px; margin: 0 !important; font-size: 9px !important; letter-spacing: .025em; }
.capsule-modal.capsule-inventory-modal { width: min(1480px, 96vw) !important; max-height: 92dvh; padding: 24px; background: #0e151e !important; border: 1px solid #3a4c60 !important; border-radius: 14px !important; text-align: left; box-shadow: 0 24px 80px #000a !important; }
.capsule-inventory-modal::before, .capsule-inventory-modal::after { display: none; }
.capsule-inventory-close { position: absolute !important; }
.capsule-inventory-modal > .capsule-modal-actions, .capsule-inventory-modal > .capsule-visual-key { flex-shrink: 0; }
.capsule-inventory-filters { grid-template-columns: repeat(4, minmax(125px, 190px)); }
.capsule-hero-tier { position: absolute; bottom: 10px; left: 0; right: 0; display: flex; justify-content: center; }
.capsule-hero-tier .capsule-tier-line { color: #dbe6f3 !important; }
.capsule-inventory-grid {
  grid-auto-flow: row; grid-template-rows: none; grid-auto-columns: auto; grid-auto-rows: 410px;
  grid-template-columns: repeat(auto-fill, minmax(230px, 1fr));
  max-height: none; min-height: 0; flex: 1 1 auto; overflow-y: auto; overflow-x: hidden;
  gap: 14px; padding: 4px 6px 16px; scrollbar-color: #61778d #15202a;
}
.capsule-inventory-card, .capsule-inventory-card.corrupted {
  grid-template-columns: 1fr; grid-template-areas: "art" "copy" "essence" "controls"; grid-template-rows: 152px 105px 38px 40px;
  border: 1px solid color-mix(in srgb, var(--capsule-tier) 55%, #17202a);
  border-radius: 12px !important; padding: 15px; gap: 10px; min-height: 410px; background: #141e29;
}
.capsule-inventory-card.empty { opacity: .68; background: #101720; }
.capsule-inventory-card.burning { opacity: .5; }
.capsule-inventory-art { width: 100%; height: 152px; background: radial-gradient(ellipse at center, #263543, #101720 75%); border: 0; border-radius: 8px; }
.capsule-inventory-art img { width: 152px; height: 152px; filter: none; }
.capsule-inventory-copy strong { font-size: 14px; line-height: 1.4; min-height: 39px; }
.capsule-inventory-count { border-radius: 5px; }
.capsule-inventory-controls { grid-template-columns: 54px 1fr 1.15fr; gap: 6px; }
.capsule-inventory-controls input, .capsule-inventory-controls button { min-width: 0; }
.capsule-inventory-controls input { font-size: 14px !important; padding: 6px !important; text-align: center; }
.capsule-inventory-controls button { font-size: 10px !important; letter-spacing: .02em !important; padding: 6px !important; }
.capsule-inventory-card.essence-card .capsule-inventory-controls { display: none; }
.capsule-inventory-filter:focus-visible, .capsule-selector-filter:focus-visible { outline: 2px solid #9acbff; outline-offset: 2px; }
.capsule-visual-key { color: #9eafc2; font-size: 11px; line-height: 1.5; margin: 0 0 12px; }
.capsule-modal-img.capsule-render { width: 144px; height: 144px; }
@media (max-width: 920px) {
  .capsule-selector-filters { grid-template-columns: 1fr 1fr; }
  .capsule-selector-filters .capsule-selector-reset { grid-column: auto; }
  .capsule-inventory-header { align-items: flex-start; flex-wrap: wrap; padding-right: 42px; }
  .capsule-modal.capsule-inventory-modal { padding: 18px 14px; }
}
@media (max-width: 560px) {
  .capsule-selector-panel { padding: 12px; }
  .capsule-selector-grid { grid-template-columns: 1fr; }
  .capsule-inventory-grid { grid-template-columns: 1fr; }
  .capsule-inventory-filters { grid-template-columns: 1fr 1fr; gap: 6px; }
  .capsule-inventory-filter { min-width: 0; width: 100%; font-size: 12px; padding: 8px; }
  .capsule-inventory-kpi { min-width: 86px; }
  .capsule-inventory-close { top: 12px; right: 12px; width: 36px; height: 36px; }
}
@media (prefers-reduced-motion: reduce) {
  .capsule-choice, .selected-capsule-stage, .selected-capsule-stage::after { animation: none !important; transition: none !important; }
}
