/* Inherits the shared paper/ink window and mobile sheet. No extra HUD button. */
#panel.artifacts-wide { width: min(760px, calc(100vw - 24px)); }
.museum, .artifact-profile, .artifact-medals { color: var(--ink); overflow-wrap: anywhere; }
.museum h3, .artifact-profile h3 { margin: var(--space-1) 0; font-size: var(--text-xl); }
.museum h4, .artifact-medals h4 { margin: 0 0 var(--space-2); font-size: var(--text-lg); }
.museum p, .artifact-medals p, .artifact-profile p { line-height: 1.5; margin: var(--space-2) 0; }
.museum-heading { display: flex; align-items: center; gap: var(--space-3); padding: var(--space-4) 0; }
.museum-heading small, .artifact-profile small { letter-spacing: 1px; color: var(--muted); }
.museum-emblem { font-size: 44px; }
.museum-totals { display: grid; grid-template-columns: repeat(3, 1fr); border-block: 1px solid var(--border-soft); padding: var(--space-3) 0; text-align: center; }
.museum-totals b { font-size: var(--text-xl); }
.museum-totals small { display: block; font-size: var(--text-xs); font-weight: normal; }
.museum-help { font-size: var(--text-sm); color: var(--muted); }
.museum-sets { display: flex; gap: var(--space-2); margin: var(--space-3) 0; padding: var(--space-1); overflow-x: auto; scrollbar-width: thin; }
.museum-sets button { text-align: left; padding: var(--space-2); min-width: 0; }
.museum-sets small { display: block; }
.museum-set-heading { border-left: 3px solid var(--border); padding: var(--space-1) var(--space-3); margin: var(--space-4) 0; }
.museum-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.artifact-card { --rarity: var(--rarity-common); border-top: 3px solid var(--rarity); text-align: center; display: flex; flex-direction: column; min-width: 0; }
.artifact-card.fine { --rarity: var(--rarity-fine); }
.artifact-card.rare { --rarity: var(--rarity-rare); }
.artifact-card.legendary { --rarity: var(--rarity-legendary); }
.artifact-card.missing { background: var(--surface-inset); }
.artifact-rarity { color: var(--rarity); font-weight: bold; }
.artifact-display { height: 66px; display: grid; place-items: center; font-size: 36px; background: radial-gradient(ellipse at center, var(--surface-raised), transparent 70%); margin: var(--space-2) 0; border-bottom: 2px solid var(--border-soft); }
.missing .artifact-display { color: var(--muted); background: none; }
.artifact-card h5 { font-size: var(--text-md); margin: var(--space-2) 0; }
.artifact-card p { font-size: var(--text-xs); flex: 1; }
.artifact-card button { font-size: var(--text-xs); width: 100%; padding: var(--space-2) var(--space-1); }
.artifact-card button small, .museum-dig button small, .museum-goods small { display: block; }
.artifact-kept { padding: var(--space-2) 0; color: var(--muted); }
.museum-dig, .museum-goods, .museum-recent { margin-top: var(--space-4); }
.museum-goods > div { display: flex; flex-wrap: wrap; gap: var(--space-2); }
.museum-recent ul { padding: 0; list-style: none; }
.museum-recent li { display: flex; justify-content: space-between; gap: var(--space-3); margin: var(--space-2) 0; }
.artifact-profile { display: grid; grid-template-columns: auto 1fr; gap: var(--space-2) var(--space-3); margin: var(--space-3) 0 var(--space-4); }
.artifact-profile > span { font-size: 40px; }
.artifact-profile label, .artifact-profile select, .artifact-profile button { grid-column: 1 / -1; }
.artifact-profile select { width: 100%; min-width: 0; min-height: var(--touch-target); color: var(--ink); background: var(--surface-raised); font: inherit; }
.artifact-medals article { padding: var(--space-4) 0; border-bottom: 1px solid var(--border-soft); }
.medal-tiers { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-2); }
.medal-tiers > div { min-width: 0; display: flex; flex-direction: column; gap: var(--space-2); }
.medal-tiers small { font-size: var(--text-xs); }
.medal-tiers progress { width: 100%; accent-color: var(--even); }
.medal-tiers button { font-size: var(--text-xs); padding-inline: var(--space-1); }
@media (max-width: 760px), (pointer: coarse) and (max-width: 1100px), (max-height: 500px) and (max-width: 1100px) {
  #panel.artifacts-wide { width: auto; }
  .museum-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--space-2); }
  .museum button, .artifact-profile button, .artifact-medals button { min-height: var(--touch-target); }
  .museum-heading { gap: var(--space-2); }
  .museum h3 { font-size: var(--text-xl); }
}