@font-face{font-family:"Album Metal Mania";src:url("/album-MetalMania.ttf") format("truetype");font-weight:400;font-style:normal;font-display:swap}
.album-open #collection #open-full-album{display:block;width:fit-content;max-width:calc(100% - 8px);margin:8px auto 10px;min-height:42px;padding:8px 20px;border:1px solid #bc9254;border-radius:9px;background:radial-gradient(ellipse at top,#59356799,transparent 85%),linear-gradient(120deg,#24182f,#36203f,#24182f);color:#ffdc95;font:400 clamp(21px,3vw,26px)/1.2 "Album Metal Mania",Georgia,serif;letter-spacing:.02em;text-align:center;text-wrap:balance;text-shadow:0 1px 0 #6b3b28,0 0 12px #efb75e55;box-shadow:inset 0 0 12px #eab9640c,0 2px 0 #130b1c,0 0 12px #ad65dc20;cursor:pointer}
.album-open #collection #open-full-album:hover{border-color:#ffe1a4;background-color:#4c2e5b;color:#fff1cc}
.album-open #collection #open-full-album:focus-visible{outline:3px solid #d6f69c;outline-offset:3px}
#full-album-dialog{width:min(1240px,96vw);max-width:96vw;max-height:94dvh;margin:auto;padding:0;border:1px solid #a57ab9;border-radius:14px;background:#14101f;color:#f5eafa;overflow:auto}
.full-album-header{display:grid;grid-template-columns:auto 1fr;align-items:center;gap:4px 14px;position:sticky;top:0;z-index:1;padding:16px 20px 12px;background:#1d152bf5;border-bottom:1px solid #654374;backdrop-filter:blur(8px)}
#full-album-dialog h2{margin:10px 0 5px;color:#ffd08e;font:700 27px/1.2 Georgia,serif}
#full-album-dialog p{grid-column:1/-1;margin:0;color:#d8c8e1;font-size:13px;line-height:1.4}
#full-album-dialog .full-album-return{margin:0;padding:7px 12px;min-height:36px;border:1px solid #b080d0;border-radius:7px;background:#352447;color:#fff1d5;font-size:13px;white-space:nowrap}
#full-album-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px;padding:18px}
#full-album-dialog .overview-card{--tier:#8ee268;min-width:0;margin:0;padding:8px;border:1px solid var(--tier);border-radius:9px;background:#21192b;text-align:center}
#full-album-dialog .tier-1{--tier:#65caff}#full-album-dialog .tier-2{--tier:#ffad55}#full-album-dialog .tier-3{--tier:#c589ff}
#full-album-dialog .overview-card button{display:block;width:100%;margin:0;padding:0;border:0;background:transparent;min-height:0;cursor:zoom-in}
#full-album-dialog .overview-card img{display:block;width:100%;height:auto;aspect-ratio:2/3;object-fit:contain;filter:grayscale(var(--card-grey)) brightness(var(--card-light));border-radius:5px}
#full-album-dialog .overview-card figcaption{padding:8px 0 2px;font-size:12px;line-height:1.35}
#full-album-dialog .overview-card strong{display:block;min-height:32px;color:var(--tier)}
#full-album-dialog .overview-card progress{display:block;width:100%;height:6px;margin:6px 0;accent-color:var(--tier)}
#full-album-dialog .overview-card span,#full-album-dialog .overview-card small{display:block;margin-top:4px}
#full-album-dialog .overview-card small{color:#c9b8d7}#full-album-dialog .is-complete small{color:#b9ef93}
#full-album-dialog button:focus-visible{outline:3px solid #ffd889;outline-offset:3px}
@media(min-width:1100px){#full-album-grid{grid-template-columns:repeat(8,minmax(0,1fr));gap:10px}}
@media(max-width:550px){#full-album-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;padding:12px}.full-album-header{padding:12px}#full-album-dialog h2{font-size:23px}}

/* Compact back arrow leaves the album title on a single line. */
#full-album-dialog .full-album-return{width:36px;padding:0;font-size:24px;line-height:1}
#full-album-dialog h2{white-space:nowrap}
@media(max-width:550px){.full-album-header{column-gap:10px}#full-album-dialog h2{font-size:clamp(18px,5.6vw,23px)}}

/* Draw attention without hiding the label or shifting its hit target. */
.album-open #collection #open-full-album{animation:album-invitation-glow 2.4s ease-in-out infinite}
@keyframes album-invitation-glow{
 0%,100%{opacity:1;border-color:#ffe4a0;text-shadow:0 0 7px #ffd173,0 0 18px #f7a63f;box-shadow:inset 0 0 15px #eab96430,0 2px 0 #130b1c,0 0 22px #ffc46370}
 50%{opacity:.65;border-color:#bc9254;text-shadow:0 1px 0 #6b3b28,0 0 8px #efb75e35;box-shadow:inset 0 0 12px #eab9640c,0 2px 0 #130b1c,0 0 8px #ad65dc20}
}
.album-open #collection #open-full-album:hover,.album-open #collection #open-full-album:focus-visible{animation:none;opacity:1;box-shadow:0 0 18px #ffc46370}
@media(prefers-reduced-motion:reduce){.album-open #collection #open-full-album{animation:none;opacity:1;border-color:#ffe4a0;box-shadow:0 0 15px #ffc46350}}

/* Keep the true card underneath as the still-image/autoplay fallback. */
#full-album-dialog .overview-card button{position:relative;overflow:hidden}
#full-album-dialog .album-character-film{position:absolute;top:29%;left:15%;display:block;width:70%;height:57%;object-fit:cover;border-radius:5px;background:#09050d;pointer-events:none;mask-image:linear-gradient(to bottom,transparent,#000 8%,#000 92%,transparent)}
#full-album-dialog .album-character-film[hidden]{display:none!important}

.album-open .reserve-cauldron{position:relative}
.album-open .xp-source-bubbles{display:flex;flex-wrap:wrap;justify-content:center;gap:4px;margin:5px auto;max-width:min(320px,85vw);width:max-content}
.album-open .xp-source-bubbles:empty{display:none}
.album-open .xp-source-bubble{font:600 11px/1.35 system-ui,sans-serif;white-space:nowrap;color:#ffe9b3;background:#32203ef2;border:1px solid #bd8f54;border-radius:14px;padding:4px 7px;box-shadow:0 0 7px #efb65a20}
