/* Catálogo de personagens e transformações — DBO Absolut */
.char-help{border:1px solid #294768;background:#101e34;border-left:3px solid #f7ae36;padding:16px;margin-bottom:18px;display:flex;flex-direction:column;gap:5px;font-size:12px;color:#c5d4e8}
.char-help strong{color:#ffce72;font-size:16px}.char-help p{margin:6px 0 0;line-height:1.7;color:#9db3ce}
.char-search{display:flex;gap:10px;margin-bottom:16px}.char-search input{background:#071729;border:1px solid #314963;min-width:0;flex:1;color:#eaf2ff;border-radius:4px;padding:12px;font-size:12px}
.char-family{margin:16px 0;overflow:hidden}.char-family>.panel-title{display:flex;justify-content:space-between;align-items:center;gap:12px}
.char-family>.panel-title small{font-size:10px;color:#9db8d4}
.char-phase{padding:12px 16px 18px;border-top:1px solid #243d5b}
.char-phase h3{font-size:14px;color:#fbc264;margin:0 0 13px;display:flex;align-items:center;justify-content:space-between;gap:7px}
.char-phase h3 small{color:#9fb1ca;font-size:10px}
.char-stages{display:grid;grid-template-columns:repeat(auto-fill,minmax(105px,1fr));gap:10px}
.char-stage{min-height:158px;background:#0a182b;border:1px solid #2c496b;border-radius:6px;padding:8px 5px;text-align:center;display:flex;flex-direction:column;align-items:center;justify-content:space-between;gap:4px}
.char-art{height:92px;width:100%;display:flex;justify-content:center;align-items:center;background:radial-gradient(circle at center,#213b5c,#0b1c32 75%);border-radius:4px}
.char-art img{max-height:82px;max-width:95%;width:80px;height:80px;object-fit:contain;image-rendering:pixelated}
.char-stage strong{font-size:12px;color:#ffd178}.char-stage small{font-size:10px;color:#95b1d1}.char-awaiting{color:#6c8aaa;font-size:10px;line-height:1.3}
.char-stage .char-alert{color:#ff867c;font-size:9px}
.char-library-link{margin:6px 0 16px}.char-library{padding-bottom:10px}.char-library>.char-search{padding:12px 14px;margin:0}
.char-sprite-library{display:grid;grid-template-columns:repeat(auto-fill,minmax(94px,1fr));gap:8px;padding:12px}
.char-sprite-library>div{display:flex;flex-direction:column;gap:8px;align-items:center;justify-content:center;min-height:104px;background:#0a192c;border:1px solid #284463;border-radius:5px;padding:6px}
.char-sprite-library img{width:75px;height:70px;object-fit:contain;image-rendering:pixelated}
.char-sprite-library strong{font-size:10px;color:#ddba73}
.char-library .char-library-link{padding:0 14px}
@media(max-width:550px){.char-search{flex-direction:column}.char-family>.panel-title{flex-wrap:wrap}.char-stages{grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.char-stage{min-height:136px;padding:4px}.char-art{height:72px}.char-art img{height:67px;width:67px}.char-stage strong{font-size:10px}.char-stage small{font-size:9px}}

/* DBO_CHAR_ACCORDION_V1 */
/* Acordeão acessível: clique/Enter/Espaço no nome para abrir; um por vez. */
.char-family.char-accordion { margin: 8px 0; overflow: hidden; }
.char-accordion > summary.char-accordion-head {
  display: flex; align-items: center; gap: 12px; min-height: 54px;
  padding: 13px 16px; cursor: pointer; user-select: none;
  list-style: none; transition: background-color .16s ease;
}
.char-accordion > summary.char-accordion-head::-webkit-details-marker { display: none; }
.char-accordion > summary.char-accordion-head::marker { content: ''; }
.char-accordion > summary.char-accordion-head:hover { background: #213652; }
.char-accordion > summary.char-accordion-head:focus-visible { outline: 2px solid #ffbe51; outline-offset: -3px; }
.char-accordion-name { min-width: 0; flex: 1; font-size: 14px; font-weight: 800; color: #f4f7ff; overflow-wrap: anywhere; }
.char-accordion > summary .char-accordion-count { color: #9db8d4; font-size: 11px; white-space: nowrap; }
.char-accordion-switch { min-width: 86px; text-align: right; color: #ffbf53; font-size: 11px; font-weight: 800; letter-spacing: .04em; }
.char-accordion-switch::after { content: 'MOSTRAR  ▾'; }
.char-accordion[open] > summary .char-accordion-switch::after { content: 'OCULTAR  ▴'; }
.char-accordion[open] > summary.char-accordion-head { border-bottom: 1px solid #2d496a; background: #1b304e; }
.char-accordion .char-phase:first-of-type { border-top: 0; }
@media (max-width: 550px) {
  .char-accordion > summary.char-accordion-head { padding: 12px 10px; gap: 8px; flex-wrap: nowrap; }
  .char-accordion-name { font-size: 13px; }
  .char-accordion > summary .char-accordion-count { font-size: 10px; white-space: normal; text-align: right; }
  .char-accordion-switch { min-width: 69px; font-size: 10px; }
  .char-accordion-switch::after { content: 'VER  ▾'; }
  .char-accordion[open] > summary .char-accordion-switch::after { content: 'FECHAR  ▴'; }
}