/* Magias de DS2: requisitos claros, lanzamientos por Aprendizaje y rutas de obtención. */
.ds2-magias-page .cover p { max-width: 900px; }
.ds2-magias-page .plate .quick b { overflow-wrap: anywhere; }
.ds2-magias-page .plate .quick b.ds2-magic-card-requirements { white-space: pre-line; }
.ds2-route-availability { margin-top: 9px; color: #bfccd0; font: 400 12px/1.7 Cinzel, serif; }
.ds2-route-availability > b { color: var(--amber-l); }
.ds2-route-availability ul { margin: 4px 0 0; padding-left: 19px; }
.ds2-route-availability li + li { margin-top: 4px; }
.ds2-route-availability li b { color: var(--muro-white); }.ds2-magias-page .plate .quick > div { min-width: 0; }
.ds2-magias-page .plate .quick b { min-height: calc(1.4em * 2); }
.ds2-magic-ficha .ficha-data { padding-bottom: 96px; }
.ds2-magic-art { flex-basis: min(34vh, 360px); min-height: 240px; max-height: 380px; }
.ds2-magic-art img { padding: 30px; }
.ds2-magias-page .ds2-magic-ficha .fd-stats { grid-template-columns: repeat(3, minmax(0, 150px)); max-width: 520px; }
.ds2-magic-ficha .fd-spec { margin: 0 0 20px; border-color: rgba(var(--amber-rgb), .2); }
.ds2-magic-ficha .fd-spec-row { border-bottom-color: rgba(var(--amber-rgb), .14); }
.ds2-magic-ficha .fd-spec-row .k { color: var(--amber-l); }
.ds2-magic-ficha .fd-spec-row .v { color: var(--muro-white); }
.ds2-magic-ficha .fd-spec-row dd.v { margin: 0; }
.ds2-magic-ficha .fd-spec[hidden] { display: none !important; }
.ds2-magic-fact-note { margin: -8px 0 18px; color: var(--muro-text); font: 400 11px/1.7 Cinzel, serif; }
.ds2-magic-description p { white-space: pre-line; }
.ds2-magic-damage-card { border-color: rgba(var(--amber-rgb), .22); }
.ds2-magic-damage-list { display: grid; gap: 8px; }
.ds2-magic-damage-row { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 12px 14px; border: 1px solid rgba(var(--amber-rgb), .14); background: rgba(var(--bg3-rgb), .24); }
.ds2-magic-damage-row > div { display: grid; gap: 4px; min-width: 0; }
.ds2-magic-damage-row span { color: var(--muro-text); font: 700 9px/1.45 Cinzel, serif; letter-spacing: .09em; text-transform: uppercase; }
.ds2-magic-damage-row b { color: var(--muro-white); font: 600 12px/1.5 Cinzel, serif; }
.ds2-magic-damage-row p { flex: 0 0 auto; margin: 0; color: var(--amber-l); font: 600 12px/1.5 Cinzel, serif; text-align: right; }
.ds2-magic-damage-note { margin: 12px 0 0 !important; color: var(--muro-text) !important; font-size: 10px !important; }
.ds2-magic-use-note { margin: 0 0 13px !important; color: var(--muro-text) !important; font-size: 11px !important; }
.ds2-magic-use-grid { display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 8px; }
.ds2-magic-use-step { min-width: 0; padding: 10px 9px; border: 1px solid rgba(var(--amber-rgb), .15); background: rgba(var(--bg3-rgb), .28); text-align: center; }
.ds2-magic-use-step span { display: block; color: var(--muro-text); font: 700 8px/1.5 Cinzel, serif; letter-spacing: .1em; text-transform: uppercase; }
.ds2-magic-use-step b { display: block; margin-top: 3px; color: var(--amber-l); font: 700 16px/1.35 Cinzel, serif; font-variant-numeric: tabular-nums; }
.ds2-magic-use-step.is-changed { border-color: rgba(var(--crim-rgb), .32); background: rgba(var(--crim-rgb), .08); }
.ds2-magic-use-step.is-changed span { color: var(--amber-l); }
.ds2-magic-facts-note { margin: 9px 0 0; color: var(--muro-text); font: 400 10px/1.7 Cinzel, serif; }

@media (max-width: 860px) {
  .ds2-magic-art { order: 0; flex: 0 0 clamp(180px, 28vh, 250px); width: 100%; min-height: 0; max-height: none; }
  .ds2-magic-art img { padding: 22px; }
  .ds2-magic-ficha .fd-stats { order: 4; width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 9px; padding: 0 18px; box-sizing: border-box; }
  .ds2-magic-ficha .fd-stats .fds:first-child { grid-column: 1 / -1; }
  .ds2-magic-ficha .fd-spec { order: 5; width: 100%; grid-template-columns: minmax(0, 1fr); column-gap: 0; margin: 0 0 16px; padding: 0 18px; box-sizing: border-box; }
  .ds2-magic-ficha .ds2-magic-tabs { order: 6; width: 100%; margin: 0; padding: 0 16px; box-sizing: border-box; }
  .ds2-magic-ficha .ds2-ficha-panel { order: 7; width: 100%; padding: 14px 18px 8px; box-sizing: border-box; }
  .ds2-magic-ficha .ds2-obtencion { order: 8; width: 100%; padding: 10px 18px 22px; box-sizing: border-box; }
  .ds2-magic-use-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 7px; }
  .ds2-magic-use-step { padding: 9px 7px; }
  .ds2-magic-use-step b { font-size: 14px; }
  .ds2-magic-damage-row { align-items: flex-start; flex-direction: column; gap: 5px; padding: 10px 11px; }
  .ds2-magic-damage-row p { text-align: left; }
}