/* Relic artwork and collection: retain the site's existing visual language. */
.relic-send-dialog { width: min(560px,calc(100% - 24px)); max-height: calc(100dvh - 32px); overflow-y: auto; margin: auto; padding: 28px; border: 1px solid var(--cyan); color: var(--text); background: linear-gradient(135deg,#10121b,#1e1531); }
.relic-send-dialog::backdrop { background: #03060de0; }
.relic-send-dialog h2 { margin: 8px 0 18px; font-family: var(--heading); font-size: 2rem; text-transform: uppercase; }
.relic-send-dialog p { font-size: 1rem; line-height: 1.5; }
.relic-send-dialog label { display: block; margin: 20px 0 8px; font-size: 1rem; }
.relic-send-dialog input { width: 100%; min-height: 48px; padding: 12px; border: 1px solid var(--cyan); background: #090c15; color: var(--text); font: inherit; }
.relic-send-item { display: flex; align-items: center; gap: 18px; border: 1px solid var(--line); background: #090c1580; padding: 10px; }
.relic-send-item img { width: 96px; height: 96px; object-fit: contain; }
.relic-send-item strong,.relic-send-item span { display: block; overflow-wrap: anywhere; }
.relic-send-item strong { font-family: var(--heading); font-size: 1.4rem; }
.relic-send-item span { color: var(--muted); font-size: .875rem; margin-top: 6px; }
.relic-recipients { display: grid; gap: 6px; margin-top: 10px; }
.relic-recipients button { min-height: 44px; text-align: left; font-size: 1rem; }
.relic-recipients button[aria-pressed="true"] { border-color: var(--green); color: var(--green); }
.relic-copy-actions { display: flex; flex-wrap: wrap; gap: 8px 16px; }
.relic-copy-actions button { min-height: 44px; }
#relicTransferHistoryList p { border-bottom: 1px solid var(--line); padding: 12px 0; overflow-wrap: anywhere; }
.relic-send-dialog button:focus-visible { outline: 2px solid var(--cyan); outline-offset: 3px; }
@media(max-width:520px) { .relic-send-dialog { padding: 24px 18px; } .relic-send-dialog .modal-actions { flex-wrap: wrap; } }
.vault-positions { padding: 0; margin-bottom: 18px; }
.vault-positions > summary { min-height: 48px; padding: 14px 20px; cursor: pointer; color: var(--cyan); font-size: 1rem; font-weight: 700; }
.vault-positions > summary:focus-visible { outline: 2px solid var(--cyan); outline-offset: -4px; }
.vault-positions[open] > summary { border-bottom: 1px solid var(--line); }
.vault-positions > .section-heading { padding: 20px 20px 0; }
.vault-positions > .locker-grid { padding: 0 20px 20px; }
.relic-armory .relic-card { grid-template-columns: minmax(0,1fr); gap: 12px; padding: 16px; text-align: center; }
.relic-forge-art { display: block; width: 100%; height: 150px; padding: 10px; object-fit: contain; filter: drop-shadow(0 8px 20px #9b4dff33); }
.relic-armory .relic-card strong { font-family: var(--heading); font-size: 1.25rem; line-height: 1.15; }
.relic-armory .relic-card p, .relic-armory .relic-card button { font-size: .875rem; }
.relic-armory .relic-card .relic-bonus { font-size: .75rem; }
.relic-armory .relic-card button { min-height: 44px; }
.relic-gift-copy { display: grid; gap: 6px; margin-top: 6px; color: var(--muted); font-size: .75rem; text-align: left; }
.relic-gift-copy select { width: 100%; min-width: 0; min-height: 44px; padding: 8px; border: 1px solid var(--line); background: #0b0d17; color: var(--text); font: inherit; font-size: 1rem; }
.relic-gift-copy select:focus-visible, .relic-armory [data-send-armory-relic]:focus-visible { outline: 2px solid var(--cyan); outline-offset: 2px; }
.relic-collection { margin-top: 28px; padding-top: 24px; border-top: 1px solid var(--line); }
.relic-collection-heading { display: flex; justify-content: space-between; gap: 16px; align-items: end; flex-wrap: wrap; }
.relic-collection-heading h4 { margin: 0; font-family: var(--heading); font-size: 1.6rem; text-transform: uppercase; }
.relic-collection-heading label { display: grid; gap: 5px; color: var(--muted); font-size: .875rem; }
.relic-collection-heading select { min-height: 44px; padding: 8px 12px; border: 1px solid var(--line); background: #0b0d17; color: var(--text); font: inherit; }
#relicCollectionSummary { margin: 14px 0 18px; color: var(--muted); font-size: .875rem; line-height: 1.5; }
.relic-collection-grid { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 14px; }
.relic-collectible { min-width: 0; padding: 12px; background: #0a0d17; border: 1px solid #363149; }
.relic-collectible.is-collected { border-color: #82709f; background: linear-gradient(155deg,#171327,#0a0d17); }
.relic-art-well { position: relative; background: radial-gradient(ellipse at center,#8b54e221,transparent 68%); }
.relic-item-art { display: block; width: 100%; aspect-ratio: 1; height: auto; padding: 14px; object-fit: contain; }
.relic-art-well > span { display: block; text-align: right; margin: -5px 0 10px; color: var(--cyan); font-size: .75rem; }
.is-uncollected .relic-item-art { opacity: .48; filter: saturate(.55); }
.relic-collectible h5 { margin: 6px 0; font-family: var(--heading); font-size: 1.25rem; line-height: 1.15; text-transform: uppercase; overflow-wrap: anywhere; }
.relic-collectible-tier, .relic-uncollected-copy { font-size: .875rem; line-height: 1.45; color: var(--muted); }
.relic-collectible details { border-top: 1px solid var(--line); margin-top: 12px; padding-top: 10px; }
.relic-collectible summary, .relic-drop-guide summary { min-height: 32px; cursor: pointer; color: var(--cyan); font-size: .875rem; }
.relic-collectible ul { padding: 0; margin: 8px 0 0; list-style: none; display: grid; gap: 12px; }
.relic-collectible li { display: grid; gap: 5px; font-size: .875rem; }
.relic-collectible li span { color: var(--muted); }
.relic-collectible .text-btn { min-height: 44px; text-align: left; font-size: .875rem; }
.relic-drop-guide { margin-top: 20px; padding: 16px; border: 1px solid var(--line); background: #0003; }
.relic-drop-guide p { font-size: 1rem; line-height: 1.5; color: var(--muted); }
.mining-impact-stage .relic-strike-art { display: block; width: 140px; height: 140px; object-fit: contain; margin: 0 auto; }
.leaderboard-relic .relic-badge-art { width: 24px; height: 24px; object-fit: contain; flex-shrink: 0; padding: 0; }
@media (max-width: 1000px) { .relic-collection-grid { grid-template-columns: repeat(2,minmax(0,1fr)); } }
@media (max-width: 520px) { .relic-forge-art { height: 120px; } .relic-collection-grid { gap: 8px; } .relic-collectible { padding: 8px; } .relic-item-art { padding: 8px; } }
@media (max-width: 340px) { .relic-collection-grid { grid-template-columns: minmax(0,1fr); } }
