/* Álbum de figurinhas da Copa 2026 — escopado em .alb / .fig (tokens do design system). */
.alb-wrap{max-width:1040px;margin:0 auto;padding:1rem;color:var(--color-text);}
.alb-wrap .breadcrumbs{font-size:.85rem;color:var(--color-text-muted);margin-bottom:.7rem;}
.alb-wrap .breadcrumbs a{color:var(--color-text-muted);text-decoration:none;}

/* Hero */
.alb-hero{position:relative;overflow:hidden;background:linear-gradient(135deg,#15803d,#166534);color:#fff;border-radius:18px;padding:1.6rem 1.3rem;box-shadow:0 10px 30px rgba(21,128,61,.25);}
.alb-hero::after{content:"";position:absolute;inset:0;background:radial-gradient(circle at 88% -20%,rgba(255,255,255,.18),transparent 45%);pointer-events:none;}
.alb-hero h1{margin:0;font-size:1.7rem;letter-spacing:-.02em;}
.alb-hero p{margin:.45rem 0 0;opacity:.95;}
.alb-prog{margin-top:1rem;}
.alb-prog__bar{height:18px;border-radius:999px;background:rgba(255,255,255,.22);overflow:hidden;}
.alb-prog__fill{height:100%;background:var(--color-cta);border-radius:999px;transition:width .5s ease;}
.alb-prog__lbl{display:flex;justify-content:space-between;font-weight:700;font-size:.92rem;margin-top:.4rem;}

/* Botões */
.alb-actions{display:flex;flex-wrap:wrap;gap:.6rem;margin:1.1rem 0 .3rem;}
.alb-btn{display:inline-flex;align-items:center;gap:.45rem;font-weight:700;text-decoration:none;border:0;cursor:pointer;border-radius:999px;padding:.65rem 1.15rem;font-size:.95rem;transition:transform .12s ease,box-shadow .12s ease;}
.alb-btn--cta{background:var(--color-cta);color:#fff;box-shadow:0 4px 14px rgba(253,136,1,.35);}
.alb-btn--ghost{background:var(--color-bg-hover);color:var(--color-text);border:1px solid var(--color-border);}
.alb-btn--green{background:#15803d;color:#fff;}
.alb-btn:hover{transform:translateY(-2px);}
.alb-btn:disabled{opacity:.55;cursor:not-allowed;transform:none;}
.alb-badge{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:22px;padding:0 6px;border-radius:999px;background:#fff;color:#15803d;font-size:.78rem;font-weight:800;margin-left:.1rem;}

/* Missões */
.alb-missions{display:grid;gap:.7rem;margin-top:.6rem;}
.alb-mission{display:flex;align-items:center;gap:.9rem;border:1px solid var(--color-border);border-radius:14px;background:var(--color-bg-card);padding:.85rem 1rem;}
.alb-mission__ic{font-size:1.7rem;line-height:1;}
.alb-mission__body{flex:1;min-width:0;}
.alb-mission__tt{font-weight:700;}
.alb-mission__sub{color:var(--color-text-muted);font-size:.86rem;margin-top:.15rem;}
.alb-mission__prog{font-size:.78rem;font-weight:700;color:#15803d;background:#dcfce7;border-radius:999px;padding:.1rem .55rem;display:inline-block;margin-top:.3rem;}
.alb-mission__done{color:#15803d;font-weight:800;}

/* Grade de figurinhas */
.alb-cat{margin-top:1.8rem;scroll-margin-top:80px;}
.alb-cat__h{display:flex;align-items:center;justify-content:space-between;gap:.5rem;font-size:1.2rem;margin:0 0 .8rem;padding-left:.6rem;border-left:5px solid #15803d;}
.alb-cat__count{font-size:.82rem;color:var(--color-text-muted);font-weight:600;}
.alb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(110px,1fr));gap:.65rem;}
.fig{position:relative;border-radius:12px;overflow:hidden;border:2px solid var(--color-border);background:var(--color-bg-card);aspect-ratio:3/4;display:flex;flex-direction:column;}
.fig--comum{border-color:#cbd5e1;} .fig--incomum{border-color:#86efac;} .fig--raro{border-color:#93c5fd;} .fig--epico{border-color:#c4b5fd;} .fig--lendaria{border-color:#fcd34d;box-shadow:0 0 0 2px #fde68a inset;}
.fig__img{width:100%;flex:1;object-fit:contain;background:#f8fafc;}
.fig--missing .fig__img{filter:grayscale(1) brightness(.55) opacity(.16);}
.fig__num{position:absolute;top:5px;left:6px;font-size:.72rem;font-weight:800;background:rgba(0,0,0,.55);color:#fff;border-radius:6px;padding:.02rem .32rem;}
.fig__qty{position:absolute;top:5px;right:6px;font-size:.72rem;font-weight:800;background:var(--color-cta);color:#fff;border-radius:999px;padding:.02rem .36rem;}
.fig__name{font-size:.72rem;font-weight:600;text-align:center;padding:.28rem .25rem;line-height:1.15;color:var(--color-text);background:var(--color-bg-card);}
.fig--missing .fig__name{color:var(--color-text-muted);}
.fig__lock{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;font-size:1.6rem;opacity:.5;}

/* Modal de abertura de pacote */
.alb-modal{position:fixed;inset:0;background:rgba(8,20,12,.78);display:none;align-items:center;justify-content:center;z-index:1000;padding:1rem;}
.alb-modal.is-open{display:flex;}
.alb-modal__box{background:var(--color-bg-card);border-radius:18px;max-width:640px;width:100%;padding:1.4rem;max-height:90vh;overflow:auto;text-align:center;}
.alb-modal__h{font-size:1.3rem;font-weight:800;margin:.2rem 0 1rem;}
.alb-reveal{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;}
@media(max-width:480px){.alb-reveal{grid-template-columns:repeat(2,1fr);}}
.alb-reveal .fig{opacity:0;transform:translateY(14px) scale(.9);animation:albIn .45s ease forwards;}
.alb-reveal .fig:nth-child(1){animation-delay:.05s}.alb-reveal .fig:nth-child(2){animation-delay:.20s}.alb-reveal .fig:nth-child(3){animation-delay:.35s}.alb-reveal .fig:nth-child(4){animation-delay:.50s}
@keyframes albIn{to{opacity:1;transform:none;}}
.fig__tag{position:absolute;bottom:24px;left:50%;transform:translateX(-50%);font-size:.62rem;font-weight:800;padding:.05rem .4rem;border-radius:999px;}
.fig__tag--nova{background:var(--color-cta);color:#fff;} .fig__tag--rep{background:#94a3b8;color:#fff;}
@media(prefers-reduced-motion:reduce){.alb-reveal .fig{animation:none;opacity:1;transform:none;}}

/* Compartilhar / privacidade */
.alb-share{margin-top:1.8rem;border:1px solid var(--color-border);border-radius:14px;background:var(--color-bg-card);padding:1.1rem;}
.alb-share h2{font-size:1.1rem;margin:0 0 .5rem;}
.alb-note{font-size:.84rem;color:var(--color-text-muted);}
.alb-flash{background:#dcfce7;color:#14532d;border-radius:10px;padding:.6rem .9rem;font-weight:600;margin-bottom:.8rem;}

/* Hub público /figurinhas */
.fig-hero{text-align:center;background:linear-gradient(135deg,#15803d,#166534);color:#fff;border-radius:18px;padding:2rem 1.2rem;}
.fig-hero h1{margin:0;font-size:1.9rem;}
.fig-sel{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:.6rem;}
.fig-sel a{display:flex;flex-direction:column;gap:.1rem;border:1px solid var(--color-border);border-radius:12px;padding:.7rem .8rem;text-decoration:none;color:var(--color-text);background:var(--color-bg-card);transition:transform .12s,border-color .12s;}
.fig-sel a:hover{transform:translateY(-2px);border-color:#15803d;}
.fig-faq{display:grid;gap:.55rem;margin-top:1rem;}
.fig-faq details{border:1px solid var(--color-border);border-radius:12px;background:var(--color-bg-card);}
.fig-faq summary{cursor:pointer;font-weight:700;padding:.8rem 1rem;}
.fig-faq p{margin:0;padding:0 1rem .9rem;color:var(--color-text-secondary);}
.fig-prose{line-height:1.7;color:var(--color-text-secondary);}
.fig-prose a{color:var(--color-text-link);}
