/* Ajustes de lectura y controles, conservando los colores de cada minisite. */
body { line-height: 1.65; }
.text-xs, .text-\[10px\], .text-\[11px\] { font-size: 14px !important; line-height: 1.65; }
.text-sm { font-size: 16px !important; }
[hidden] { display: none !important; }
p.text-justify, .text-justify p { text-align: left; }
h1, h2, h3 { overflow-wrap: anywhere; line-height: 1.65; }
h1 { font-size: clamp(17px, 3vw, 30px) !important; }
h2 { font-size: clamp(15px, 2vw, 20px) !important; }
h3 { font-size: 13px !important; }
nav .nav-tab { min-height: 44px; padding: 9px 10px; font-size: 14px; flex: 1 1 auto; }
nav { max-width: 700px; margin-left: auto; margin-right: auto; }
.retro-btn { height: auto; min-height: 44px; font-size: 14px; }
.disclosure-button { font: inherit; text-align: left; min-height: 44px; padding: 7px 3px; }
button:focus-visible, a:focus-visible, summary:focus-visible { outline: 3px solid #ffd700; outline-offset: 4px; }
header > .banner-frame { height: auto !important; }
.banner-frame img { width: 100%; height: auto !important; object-fit: contain !important; opacity: 1; display: block; }
header .header-links { flex-wrap: wrap; gap: 10px; }
header a { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; }
.character-list { display: grid; gap: 14px; }
.character-card { background: rgba(0,0,0,.6); border: 1px solid #818cf8; border-left: 4px solid #7c3aed; border-radius: 4px; }
.character-card summary { cursor: pointer; list-style: none; display: flex; align-items: center; gap: 12px; padding: 12px; min-height: 64px; }
.character-card summary::-webkit-details-marker { display: none; }
.character-card summary::after { content: '+'; margin-left: auto; font-size: 24px; color: #c4b5fd; }
.character-card[open] summary::after { content: '−'; }
.character-portraits { display: flex; flex-wrap: wrap; gap: 6px; flex-shrink: 0; }
.character-portraits img { width: 52px; height: 52px; object-fit: cover; border: 1px solid #818cf8; }
.character-name { font-weight: bold; color: #c4b5fd; }
.character-past { font-size: 14px; color: #6ee7b7; }
.character-description { padding: 4px 16px 16px; font-size: 16px; text-align: left; }
.character-description p + p { margin-top: 12px; }
.character-desert { border-color: #d47735; }
.character-desert .character-name, .character-desert summary::after { color: #ffcc66; }
.character-photo { width: 64px; height: 64px; object-fit: cover; flex-shrink: 0; border: 1px solid #d47735; }
.gallery-folder { width: 100%; font: inherit; }
.gallery-thumb { padding: 0; width: 100%; display: block; border: 2px solid currentColor; background: #050811; aspect-ratio: 4/3; overflow: hidden; cursor: zoom-in; color: #818cf8; }
.gallery-thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .2s; }
.gallery-thumb:hover img { transform: scale(1.04); }
.gallery-notice { grid-column: 1 / -1; padding: 14px; }
.gallery-viewer { width: min(1100px, 96vw); max-width: 96vw; max-height: 94dvh; padding: 14px; border: 2px solid #818cf8; background: #070b18; color: #e5e7eb; border-radius: 5px; }
.gallery-viewer::backdrop { background: rgba(0,0,0,.88); }
.viewer-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; }
.viewer-toolbar p { font-size: 14px; }
.viewer-controls { display: flex; align-items: center; justify-content: center; gap: 14px; margin-top: 12px; }
.viewer-button { min-height: 44px; padding: 8px 14px; border: 1px solid #818cf8; background: #25215d; color: #fff; font: inherit; cursor: pointer; }
.viewer-image { display: block; max-width: 100%; width: auto; max-height: calc(94dvh - 160px); height: auto; margin: auto; object-fit: contain; }
.viewer-status { text-align: center; padding: 12px; }
@media (min-width: 768px) { .character-list { grid-template-columns: repeat(2, minmax(0, 1fr)); align-items: start; } }
@media (max-width: 639px) {
  body { padding: 8px !important; }
  body > .container-box { padding: 10px !important; }
  main > .tab-content { padding: 8px !important; }
  .text-xs, .text-\[10px\], .text-\[11px\] { font-size: 15px !important; }
  .release-table, .release-table tbody, .release-table tr { display: block; width: 100%; }
  .release-table { background: transparent; border-spacing: 0; }
  .release-table thead { display: none; }
  .release-table tr { margin-bottom: 16px; border: 2px solid #4d94ff; background: #1a1a40; }
  .release-table td { display: flex; gap: 12px; flex-wrap: wrap; align-items: center; width: 100%; padding: 8px 12px; border: 0; border-bottom: 1px solid #4d94ff55; text-align: left; }
  .release-table td:first-child { padding: 14px 12px; font-size: 17px; }
  .release-table td:not(:first-child)::before { content: attr(data-label); min-width: 85px; color: #ffd700; font-weight: bold; }
  .release-table td:last-child { border-bottom: 0; }
  .release-table .release-detail { flex-basis: 100%; width: 100%; min-width: 0; margin: 8px 0; }
  .release-table td a { display: inline-flex; align-items: center; min-height: 44px; }
  #fansub .border-l-2 { border-left: 0; border-top: 2px solid #4d94ff; padding: 18px 0 0; }
  .character-portraits img { width: 42px; height: 42px; }
  .character-card summary { gap: 9px; padding: 10px; }
  .gallery-viewer { padding: 10px; }
  .viewer-button { padding: 8px 10px; font-size: 14px; }
}
@media (prefers-reduced-motion: reduce) {
  .marquee span { animation: none; padding-left: 0; white-space: normal; }
  .marquee { white-space: normal; }
  *, *::before, *::after { animation-duration: .01ms !important; transition-duration: .01ms !important; scroll-behavior: auto !important; }
}
