/* Keep the world's artwork around content, with opaque theme paper beneath copy.
   Loaded last so page and focus layouts share the same reading surfaces. */
html[data-theme]:not([data-palette='pastel-crystal']),
html[data-theme]:not([data-palette='pastel-crystal']) #mha-familienkarte {
  --ui-control: var(--ui-paper, #fff8e9);
}
html[data-theme], html[data-theme] #mha-familienkarte {
  --ui-dialog: var(--ui-paper, #fff8e9);
  --ui-popover: var(--ui-paper, #fff8e9);
}
html[data-theme] #mha-familienkarte :is(.mha-masthead, .mha-footnote) {
  background: var(--ui-paper, #fff8e9);
}
html[data-theme] #mha-familienkarte .mha-sidebar {
  background: linear-gradient(var(--ui-sidebar), var(--ui-sidebar)), var(--ui-paper);
}
html[data-theme] #mha-familienkarte .mha-mobile-nav {
  background: linear-gradient(var(--ui-mobile), var(--ui-mobile)), var(--ui-paper);
}
html[data-theme] #mha-familienkarte .mha-treasure-person[aria-pressed='true'] .mha-treasure-selection {
  background: none;
  border-bottom: 1px solid currentColor;
}
html[data-theme] #mha-familienkarte .mha-focus {
  --focus-glass: var(--ui-paper, #fff8e9);
}
html[data-theme] #mha-familienkarte .mha-focus-header > div {
  padding: 12px 18px;
  max-width: 100%;
  box-sizing: border-box;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-panel-radius, 16px);
  background: var(--ui-paper, #fff8e9);
}
html[data-theme] #mha-familienkarte .mha-focus-header { padding-inline: 50px; }
html[data-theme] #mha-familienkarte .mha-focus[data-editing] .mha-focus-widget:not([data-widget-type=room]) {
  background: var(--ui-paper, #fff8e9);
  border-radius: var(--ui-panel-radius, 16px);
  backdrop-filter: none;
}
html[data-theme] #mha-familienkarte .mha-focus .mha-focus-arrow {
  background: var(--ui-paper, #fff8e9);
}
html[data-theme] #mha-familienkarte .mha-focus :is(.mha-focus-footer, .mha-focus-settings, .mha-focus-catalog, .mha-focus-empty) {
  background: var(--ui-paper, #fff8e9);
  backdrop-filter: none;
}
@media (max-width: 699px) {
  html[data-theme] #mha-familienkarte .mha-focus-header { padding-inline: 33px; }
  html[data-theme] #mha-familienkarte .mha-focus-header > div { padding: 12px; }
}

/* The room itself stays open to the atlas; only its reading controls have paper. */
html[data-theme] #mha-familienkarte .mha-focus[data-editing] .mha-focus-widget[data-widget-type=room] {
  background: transparent;
  backdrop-filter: none;
}
html[data-theme] #mha-familienkarte .mha-focus-widget[data-widget-type=room] > header {
  align-self: flex-start;
  max-width: 100%;
  box-sizing: border-box;
  margin-bottom: 8px;
  padding: 10px 14px;
  border-radius: var(--ui-radius, 10px);
  background: var(--ui-paper);
}
html[data-theme] #mha-familienkarte .room3d-room-navigation > :is(label, [data-room-focus-detail]),
html[data-theme] #mha-familienkarte .mha-focus .room3d-status:not(:empty) {
  padding: 10px 12px;
  box-sizing: border-box;
  border-radius: var(--ui-radius, 10px);
  background: var(--ui-paper);
}
html[data-theme] #mha-familienkarte .mha-focus-widget[data-widget-type=room] > .mha-focus-widget-body:not(:has(.room3d-workspace)) {
  flex: none;
  height: auto;
  padding: 12px 16px;
  border-radius: var(--ui-radius, 10px);
  background: var(--ui-paper);
}
html[data-theme] #mha-familienkarte .mha-focus button.focus-resize {
  background: var(--ui-paper);
}

/* Section titles use the same inset as page titles, including the overview. */
html[data-theme] #mha-familienkarte .mha-heading-row {
  padding: 22px 24px;
  border: 1px solid var(--ui-line);
  background: var(--ui-surface);
}
html[data-theme] #mha-familienkarte .sf-map-heading {
  padding: 20px 24px;
}
html[data-theme] #mha-familienkarte .sf-map-heading :is(h2, p) { margin-bottom: 0; }
html[data-theme] #mha-familienkarte .sf-map-heading h2 { margin-top: 0; }
@media (max-width: 850px) {
  html[data-theme] #mha-familienkarte .mha-heading-row { padding: 18px 16px; }
  html[data-theme] #mha-familienkarte .sf-map-heading { padding: 18px 16px; }
}

/* Small reading groups, never a single sheet over the whole page. */
html[data-theme] #mha-familienkarte :is(
  .smart-workspace-toolbar, .mha-library-topline, .mha-library-tools,
  .mha-library-filter-panel, .mha-library-volume-copy, .mha-library-milestones,
  .mha-task-selected-day, .mha-cl-toolbar, .mha-cl-empty, .mha-recipe-library > .mha-tools,
  .mha-community-filters, .mha-gallery-toolbar, .mha-album-summary,
  .mha-known-people, .mha-character-intro, .mha-character-settings,
  .mha-character-rule-strip, .mha-classic-toolbar, .mha-game-table-top, .mha-quiz-setup,
  .mha-game-counters, .mha-pantry-room > header
) {
  box-sizing: border-box;
  padding: 16px 20px;
  border: 1px solid var(--ui-line);
  border-radius: var(--ui-radius, 10px);
  background: var(--ui-paper);
}
html[data-theme] #mha-familienkarte :is(
  .mha-library-edition-note, .mha-empty, .mha-game-status,
  .mha-learning > .mha-small-note, .mha-character-setup > .mha-small-note,
  .mha-classic-game > .mha-small-note, .mha-gallery-folders > p,
  .mha-album-grid > p,
  .mha-recipe-library > h2, .mha-recipe-library > p,
  .mha-recipe-group > :is(h2, h3), .mha-pantry-shelf > h3,
  [data-task-days] > p:not(.mha-task-swipe-hint),
  .mha-main > div > .mha-small-note,
  .mha-pending-receipts > h2,
  .mha-pending-receipts > .mha-small-note,
  .mha-secondary-tools > summary, .mha-task-library > summary,
  .mha-health-ranking > summary,
  .mha-character-guide > summary, .mha-classic-help > summary
) {
  box-sizing: border-box;
  padding: 12px 16px;
  border-radius: var(--ui-radius, 10px);
  background: var(--ui-paper);
}
html[data-theme] #mha-familienkarte .mha-people > .mha-person,
html[data-theme] #mha-familienkarte [data-task-days] > .mha-inline-check,
html[data-theme] #mha-familienkarte .mha-main > .mha-inline-check {
  background: var(--ui-paper);
  padding: 10px 14px;
  border-radius: var(--ui-radius, 10px);
}
html[data-theme] #mha-familienkarte .mha-friend-stats > div,
html[data-theme] #mha-familienkarte .mha-recipe-mini { background: var(--ui-paper); }
html[data-theme] #mha-familienkarte .mha-character-tabs button:not([aria-pressed=true]) {
  background: var(--ui-paper);
}
html[data-theme] #mha-familienkarte .mha-cl-empty > .mha-empty {
  padding: 0;
  background: transparent;
}
html[data-theme] #mha-familienkarte .mha-library-volume-copy { margin-top: 12px; }
html[data-theme] #mha-familienkarte .mha-library-volume-copy > :first-child { margin-top: 0; }
html[data-theme] #mha-familienkarte .mha-cl-empty > p { margin-bottom: 0; }
html[data-theme] #mha-familienkarte .mha-game-counters { margin-block: 12px; }
html[data-theme] #mha-familienkarte .mha-recipe-library > :is(h2, p) { margin-block: 10px; }
@media (max-width: 850px) {
  html[data-theme] #mha-familienkarte :is(.smart-workspace-toolbar, .mha-library-topline,
    .mha-library-tools, .mha-library-filter-panel, .mha-library-volume-copy,
    .mha-library-milestones, .mha-cl-toolbar, .mha-community-filters,
    .mha-gallery-toolbar, .mha-album-summary, .mha-character-settings,
    .mha-character-intro, .mha-classic-toolbar, .mha-game-table-top,
    .mha-pantry-room > header) { padding: 14px 16px; }
}