.extra-summon-dialog { width: min(760px, calc(100vw - 24px)); padding: 20px; overflow: auto; max-height: calc(100dvh - 24px); }
.extra-count, .extra-empty { color: var(--muted, #b7b4a9); }
.extra-card-list { display: grid; gap: 12px; }
.extra-card-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px 16px; padding: 12px 0; border-bottom: 1px solid #ffffff20; }
.extra-card-row p, .extra-card-row small { grid-column: 1 / -1; margin: 0; }
.extra-card-inspect { display: flex; align-items: center; gap: 12px; text-align: left; font-size: 16px; }
.extra-card-inspect img { width: 56px; height: 76px; object-fit: cover; border-radius: 3px; }
.extra-materials { display: grid; gap: 8px; padding: 12px 0; }
.extra-materials h3 { font-size: 16px; margin: 0 0 4px; }
.extra-material { text-align: left; padding: 12px; border: 1px solid #ffffff26; border-radius: 4px; }
.extra-material[aria-pressed="true"] { border-color: #d7b67a; background: #413329; }
.extra-summon-dialog footer { display: flex; align-items: center; gap: 8px; position: sticky; bottom: -20px; background: #161b18; padding: 12px 0; }
.extra-status { flex: 1; min-width: 0; font-size: 13px; color: #d4c199; }
.extra-summon-dialog button { white-space: normal; overflow-wrap: anywhere; }
.extra-summon-dialog button:not(.primary-button) { appearance: none; font: inherit; color: #eee5cf; background: #14221c; border: 1px solid #b99c6555; padding: 10px 14px; border-radius: 4px; }
.extra-summon-dialog button.extra-card-inspect { background: transparent; border: 0; padding: 0; }
.extra-summon-dialog button[aria-pressed="true"] { background: #4b2328; border-color: #d7b67a; }
.extra-summon-dialog button:disabled { color: #aaa99d; opacity: 0.65; cursor: default; }
.extra-summon-dialog button:focus-visible { outline: 2px solid #d7b67a; outline-offset: 3px; }
@media (max-width: 480px) { .extra-summon-dialog { padding: 12px; } .extra-card-row { grid-template-columns: minmax(0, 1fr); } .extra-summon-dialog footer { flex-wrap: wrap; bottom: -12px; } .extra-status { flex-basis: 100%; } }
