/* Only the initial document uses these classes; normal page controls retain their UI. */
.initial-html-mobile { display: none; }
.initial-html-item { min-width: 0; padding: 12px; overflow-wrap: anywhere; }
.initial-html-item > summary { cursor: pointer; }
.initial-html-item > summary:focus-visible { outline: 2px solid var(--brand); outline-offset: 4px; }
.initial-html-item .character-name-text { font-weight: 700; }
.initial-html-values { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; line-height: 1.6; }
.initial-html-item .character-detail { margin-top: 10px; }
@media (max-width: 850px) {
  .initial-html-desktop { display: none; }
  .initial-html-mobile { display: grid; }
  .initial-html-values { gap: 4px 12px; }
}