/* Existing inspection and utility owners opt in. Card geometry, artwork,
   flips, finish selection, focus and scroll ownership remain unchanged. */
.inspection-system .inspection-context:empty { display: none; }
.inspection-system { border-color: var(--pm-ui-line); border-radius: 24px; background: radial-gradient(ellipse at 50% 0, var(--pm-ui-surface-raised), transparent 65%), var(--pm-ui-surface); box-shadow: 0 20px 70px var(--pm-ui-shadow); }
.inspection-system .inspection-context { width: 100%; min-width: 0; text-align: left; }
.inspection-system .showcase-tabs button,
.inspection-system .showcase-tools button { min-height: 44px; font-size: 14px; }
.inspection-system .showcase-tools { font-size: 13px; letter-spacing: 0; }
.inspection-system .showcase-details { border: 0; border-radius: 0; background: transparent; padding: 12px 0; }
.inspection-system .showcase-details > small { font-size: 13px; color: var(--pm-ui-muted); }
.inspection-system .showcase-details h3 { color: var(--pm-ui-text); }
.inspection-system .showcase-details > p { font-size: 16px !important; line-height: 1.5 !important; color: var(--pm-ui-text); }
.inspection-system .showcase-live-stats dt { font-size: 13px; }
.inspection-system .showcase-synergy { border: 0; border-top: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; padding: 12px 0; }
.inspection-system .showcase-synergy > b { font-size: 14px; letter-spacing: 0; text-transform: none; }
.inspection-system .showcase-synergy p { font-size: 14px !important; color: var(--pm-ui-text); }
.inspection-system .showcase-synergy > b,
.inspection-system .showcase-synergy summary { color: var(--pm-ui-accent); }
.inspection-system .showcase-synergy summary { min-height: 44px; font-size: 14px; }
.inspection-system .inspection-context > :is(.hero-perk,.device-inspection) { border: 0; border-top: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; margin: 12px 0 0; padding: 12px 0; }
.inspection-system .inspection-context :is(p,small) { font-size: 14px; line-height: 1.5; color: var(--pm-ui-muted); }
.inspection-system > .end-turn { min-height: 48px; font-size: 15px; }
@media (max-width: 600px), (max-height: 500px) {
  .inspection-system:has(.card-showcase[data-inspect-panel=card]) > .inspection-context { display: none; }
}

.utility-system { color: var(--pm-ui-text); border: 1px solid var(--pm-ui-line); border-radius: 24px; background: linear-gradient(160deg, var(--pm-ui-surface-raised), var(--pm-ui-surface) 70%); box-shadow: 0 20px 70px var(--pm-ui-shadow); }
.utility-system .utility-header > .eyebrow { display: none; }
.utility-system .utility-header > h2 { font-size: 22px; letter-spacing: -.02em; }
.utility-system .utility-header > h2 { color: var(--pm-ui-text); }
.utility-system .utility-body { gap: 16px; }
.utility-system .utility-note { font-size: 14px; line-height: 1.5; color: var(--pm-ui-muted); }
.utility-system .utility-footer > :is(button,a) { min-height: 48px; font-size: 15px; }
.utility-system .utility-footer > .end-turn { border-radius: 20px; background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); box-shadow: none; }
.utility-system .utility-footer > .ghost { border: 0; background: transparent; box-shadow: none; color: var(--pm-ui-muted); }
.utility-system .game-preferences { grid-template-columns: minmax(0,1fr); gap: 0; padding: 4px 14px 14px; border-radius: 18px; background: var(--pm-ui-surface-soft); }
.utility-system .game-preferences .preference-toggle { min-height: 48px; padding: 12px 0; font-size: 15px; gap: 16px; border: 0; border-bottom: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; box-shadow: none; color: var(--pm-ui-text); }
.utility-system .game-preferences .preference-toggle b { font-size: 14px; color: var(--pm-ui-accent); }
.utility-system .game-preferences .preference-slider { border: 0; border-radius: 0; background: transparent; padding: 12px 0; font-size: 15px; }
.utility-system .game-preferences .preference-slider input { min-height: 44px; }
.utility-system .game-preferences .preference-slider { color: var(--pm-ui-text); }
.utility-system .game-preferences .preference-slider output { color: var(--pm-ui-accent); }
.utility-system .game-preferences .preference-section { margin: 20px 0 4px; font-size: 18px; letter-spacing: 0; text-transform: none; color: var(--pm-ui-text); }
.utility-system .game-preferences .preference-note { font-size: 13px; line-height: 1.5; margin: 12px 0; }
.utility-system .game-preferences .preference-note { color: var(--pm-ui-muted); }
.utility-system .preference-audio-state { padding: 0 0 16px; border: 0; border-bottom: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; }
.utility-system .preference-audio-state > strong { font-size: 15px; }
.utility-system .preference-audio-state > strong { color: var(--pm-ui-text); }
.utility-system .game-preferences .preference-audio-state > p { font-size: 14px; }
.utility-system .game-preferences .preference-audio-state > p { color: var(--pm-ui-muted); }
.utility-system :is(.controller-status,.localization-status) { border: 0; border-top: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; padding: 12px 0; }
.utility-system :is(.controller-status,.localization-status) > strong { font-size: 15px; }
.utility-system :is(.controller-status,.localization-status) > p { font-size: 14px; line-height: 1.5; }
.utility-system .controller-glyph-select { font-size: 14px; border: 0; padding-inline: 0; }
.utility-system :is(.controller-status,.localization-status) > strong { color: var(--pm-ui-text); }
.utility-system :is(.controller-status,.localization-status) > p,
.utility-system .controller-glyph-select { color: var(--pm-ui-muted); }
.utility-system .controller-binding { color: var(--pm-ui-text); background: var(--pm-ui-surface-raised); border-color: var(--pm-ui-line); }
.utility-system .controller-binding b { color: var(--pm-ui-accent); }
.utility-system .controller-binding span { font-size: 13px; }
.utility-system .controller-binding b { font-size: 14px; }
.utility-system .controller-remap-cancel { min-height: 44px; font-size: 14px; }
.utility-system .battle-build-panel,
.utility-system .attack-forecast { border: 0; border-top: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; padding: 16px 0; margin: 0; }
.utility-system .battle-field-report { border: 0; border-block: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; }
.utility-system .battle-field-report > summary { padding-inline: 0; font-size: 15px; }
.utility-system .battle-field-report > summary small { font-size: 13px; }
.utility-system .battle-field-body { padding-inline: 0; }
.utility-system .battle-journal-stats span { font-size: 13px; }
.utility-system .battle-recent-events h3 { font-size: 18px; }
@media (min-width: 700px) {
  .utility-system .game-preferences { grid-template-columns: repeat(2,minmax(0,1fr)); column-gap: 24px; }
}
@media (max-width: 600px) and (min-height: 501px) {
  .overlay:has(> .utility-system) { align-items: flex-end; padding: max(16px,env(safe-area-inset-top)) max(8px,env(safe-area-inset-right)) 0 max(8px,env(safe-area-inset-left)); }
  .utility-system { width: 100%; max-height: calc(100dvh - max(16px,env(safe-area-inset-top))); border-bottom: 0; border-radius: 24px 24px 0 0; padding: 20px 16px max(16px,env(safe-area-inset-bottom)); }
}

/* Quiet card stage and a compact control dock, rather than stacked panels. */
.inspection-system.card-inspection { border: 0; background: var(--pm-ui-surface); }
.inspection-system .showcase-buttons button { border: 0; border-radius: 999px; background: var(--pm-ui-surface-raised); color: var(--pm-ui-text); padding: 10px 16px; box-shadow: none; }
.inspection-system.card-inspection > .end-turn { width: min(180px,100%); margin: 12px auto 0; border-radius: 999px; background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); }
@media (max-width: 600px), (max-height: 500px) {
 .inspection-system .card-showcase { display: flex; flex-direction: column; }
 .inspection-system .card-showcase > * { order: 4; }
 .inspection-system .card-showcase > .showcase-stage { order: 1; }
 .inspection-system .card-showcase > .showcase-tabs { order: 2; width: max-content; max-width: 100%; align-self: center; border-radius: 999px; padding: 3px; background: var(--pm-ui-surface-raised); gap: 0; }
 .inspection-system .card-showcase > .showcase-tools { order: 3; }
 .inspection-system .showcase-tabs button { border: 0; border-radius: 999px; background: transparent; color: var(--pm-ui-muted); }
 .inspection-system .showcase-tabs button[aria-pressed=true] { background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); }
}

@media (max-width: 600px) and (min-height: 501px) {
 .inspection-system .card-showcase[data-inspect-panel=card] > .showcase-stage { height: clamp(150px,calc(100dvh - 320px),440px); }
}

/* Journey collection, reward and checklist inspection share the same showcase
   but use an expedition modal owner, rather than the practice inspector. */
.exp-modal.modal-inspect { background: var(--pm-ui-surface); color: var(--pm-ui-text); border: 0; border-radius: 24px; box-shadow: 0 20px 60px var(--pm-ui-shadow); }
.exp-modal.modal-inspect > .exp-icon-button { width: 44px; min-height: 44px; border: 0; border-radius: 50%; background: var(--pm-ui-surface-raised); color: var(--pm-ui-text); box-shadow: 0 3px 10px var(--pm-ui-shadow); }
.exp-modal.modal-inspect .showcase-card-label { color: var(--pm-ui-text); }
.exp-modal.modal-inspect .showcase-tabs { width: max-content; max-width: 100%; align-self: center; padding: 3px; gap: 0; border-radius: 999px; background: var(--pm-ui-surface-raised); }
.exp-modal.modal-inspect .showcase-tabs button { min-height: 44px; font-size: 14px; border: 0; border-radius: 999px; background: transparent; color: var(--pm-ui-muted); }
.exp-modal.modal-inspect .showcase-tabs button[aria-pressed=true] { background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); }
.exp-modal.modal-inspect .showcase-tools { font-size: 13px; letter-spacing: 0; color: var(--pm-ui-muted); }
.exp-modal.modal-inspect .showcase-buttons button { min-height: 44px; padding: 10px 16px; border: 0; border-radius: 999px; background: var(--pm-ui-surface-raised); color: var(--pm-ui-text); font-size: 14px; box-shadow: none; }
.exp-modal.modal-inspect .showcase-details { border: 0; border-radius: 0; background: transparent; padding: 12px 0; }
.exp-modal.modal-inspect .showcase-details h3 { color: var(--pm-ui-text); }
.exp-modal.modal-inspect .showcase-details > p { color: var(--pm-ui-text); font-size: 16px !important; line-height: 1.5 !important; }
.exp-modal.modal-inspect .showcase-details > small,
.exp-modal.modal-inspect .showcase-caption { color: var(--pm-ui-muted); font-size: 13px; }
.exp-modal.modal-inspect .showcase-live-stats dt { color: var(--pm-ui-muted); font-size: 13px; }
.exp-modal.modal-inspect .showcase-live-stats dd { color: var(--pm-ui-text); }
.exp-modal.modal-inspect .showcase-synergy { border: 0; border-top: 1px solid var(--pm-ui-line); border-radius: 0; background: transparent; padding: 12px 0; }
.exp-modal.modal-inspect .showcase-synergy > b,
.exp-modal.modal-inspect .showcase-synergy summary { color: var(--pm-ui-accent); font-size: 14px; }
.exp-modal.modal-inspect .showcase-synergy p { color: var(--pm-ui-text); }
.exp-modal.modal-inspect .showcase-archetypes > span { background: var(--pm-ui-surface-raised); color: var(--pm-ui-text); border-color: var(--pm-ui-line); border-left: 2px solid var(--tag-color,var(--pm-ui-accent)); }
.exp-modal.modal-inspect .inspect-status-list > li { color: var(--pm-ui-text); background: var(--pm-ui-surface-raised); }
.exp-modal.modal-inspect .showcase-note { color: var(--pm-ui-muted); background: transparent; border: 0; padding-inline: 0; }
.exp-modal.modal-inspect .inspect-ownership { background: transparent; border: 0; border-top: 1px solid var(--pm-ui-line); border-radius: 0; padding: 12px 0; color: var(--pm-ui-text); }
.exp-modal.modal-inspect .inspect-ownership :is(p,small) { color: var(--pm-ui-muted); font-size: 13px !important; }
.exp-modal.modal-inspect .inspect-finish-options .exp-button { min-height: 48px; border: 0; border-radius: 999px; background: var(--pm-ui-surface-raised); color: var(--pm-ui-text); font-size: 13px; }
.exp-modal.modal-inspect .inspect-finish-options .exp-button[aria-pressed=true] { background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); }
.exp-modal.modal-inspect .inspect-return { display: flex; justify-content: center; background: var(--pm-ui-surface); padding: 8px 0 max(8px,env(safe-area-inset-bottom)); }
.exp-modal.modal-inspect .inspect-return .exp-button { width: min(240px,100%); min-height: 48px; border: 0; border-radius: 999px; background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); font-size: 15px; box-shadow: none; }
.exp-modal.modal-inspect:has(.card-showcase[data-inspect-panel=card]) > .inspect-return { position: static; flex: none; }
@media (max-width: 600px) and (min-height: 501px) {
 .exp-modal.modal-inspect .card-showcase { display: flex; flex-direction: column; }
 .exp-modal.modal-inspect .card-showcase > * { order: 4; }
 .exp-modal.modal-inspect .card-showcase > .showcase-stage { order: 1; }
 .exp-modal.modal-inspect .card-showcase > .showcase-tabs { order: 2; }
 .exp-modal.modal-inspect .card-showcase > .showcase-tools { order: 3; }
 .exp-modal.modal-inspect .card-showcase[data-inspect-panel=card] > .showcase-stage { height: clamp(140px,calc(100dvh - 320px),400px); }
}
@media (max-width: 600px) and (min-height: 501px) and (max-height: 700px) {
 /* Reserve the real 50px view switch, 44px face controls and 64px return
    region before sizing the physical card; the footer must not cover tools. */
 .exp-modal.modal-inspect .card-showcase[data-inspect-panel=card] > .showcase-stage { height: clamp(140px,calc(100dvh - 375px),325px); }
}

/* The journal and satchel use the utility owner but contain older nested
   readouts; their text and preview surfaces must follow both appearances. */
.utility-system :is(.battle-build-panel,.attack-forecast,.battle-field-body) :is(h3,strong,dd) { color: var(--pm-ui-text); }
.utility-system :is(.battle-build-panel,.attack-forecast,.battle-field-body) :is(p,dt,span,small) { color: var(--pm-ui-muted); }
.utility-system .battle-build-panel dd { font-size: 14px; }
.utility-system .attack-forecast :is(.attack-forecast-row,.attack-forecast-row.skipped,.attack-forecast-row.empty) { background: var(--pm-ui-surface-soft); border: 0; border-radius: 14px; }
.utility-system .attack-forecast .attack-forecast-row dd { color: var(--pm-ui-text); font-size: 14px; }
.utility-system .attack-forecast .attack-forecast-uncertainty { color: var(--pm-ui-danger); background: var(--pm-ui-danger-surface); border-color: var(--pm-ui-danger); }
.utility-system .battle-field-body :is(.battle-unit-readouts,.battle-reflex-readout,.battle-hazard-readout) > li { background: var(--pm-ui-surface-soft); border: 0; color: var(--pm-ui-text); }
.utility-system .battle-field-body .battle-hero-effects > li { background: var(--pm-ui-surface-raised); color: var(--pm-ui-text); }
.utility-system .battle-field-body :is(.reflex-short,.hazard-active) { background: var(--pm-ui-danger-surface); color: var(--pm-ui-danger); }
.utility-system .battle-journal-list li { color: var(--pm-ui-text); font-size: 14px; line-height: 1.5; }
.utility-system .satchel-snapshot { color: var(--pm-ui-muted); }
.utility-system .satchel-item { background: var(--pm-ui-surface-soft); border: 0; border-radius: 16px; }
.utility-system .satchel-item-heading :is(h3,strong) { color: var(--pm-ui-text); }
.utility-system .satchel-item-heading :is(small,span) { color: var(--pm-ui-muted); }
.utility-system .satchel-item p.satchel-description { color: var(--pm-ui-text); font-size: 14px; }
.utility-system .satchel-preview { background: var(--pm-ui-surface-raised); border: 0; border-radius: 12px; color: var(--pm-ui-text); }
.utility-system .satchel-preview :is(strong,dd) { color: var(--pm-ui-text); }
.utility-system .satchel-preview :is(dt,p,small,span) { color: var(--pm-ui-muted); }
.utility-system .satchel-preview .satchel-warning { background: var(--pm-ui-danger-surface); color: var(--pm-ui-danger); }
.utility-system .satchel-item .end-turn { min-height: 48px; border-radius: 999px; font-size: 15px; background: var(--pm-ui-accent); color: var(--pm-ui-on-accent); }
.utility-system.utility-modal .satchel-snapshot { color: var(--pm-ui-muted); }
.utility-system.utility-modal .satchel-item p.satchel-blocked { color: var(--pm-ui-danger); background: var(--pm-ui-danger-surface); border-color: var(--pm-ui-danger); border-radius: 10px; font-size: 14px; }
.utility-system .utility-header > .modal-close { color: var(--pm-ui-text); background: var(--pm-ui-surface-raised); border: 0; border-radius: 50%; box-shadow: 0 3px 10px var(--pm-ui-shadow); }
.shell .exp-modal.modal-inspect .inspect-ownership strong{color:var(--pm-ui-text)}