/* Sticker Album (v4) */
.stk{position:relative;width:62px;height:62px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,#fff 0%,#fff6e4 60%,#ffe9c2 100%);border:4px solid #fff;box-shadow:0 4px 0 rgba(84,60,20,.10),0 6px 14px rgba(84,60,20,.16);transform:rotate(var(--r,0deg))}
.stk .stk-e{font-size:30px;line-height:1}
.stk .stk-n{position:absolute;bottom:-6px;right:-6px;min-width:24px;height:24px;padding:0 5px;border-radius:999px;background:var(--blue);color:#fff;font-size:12px;font-weight:700;display:grid;place-items:center;border:2px solid #fff}
.stk.gold{background:radial-gradient(circle at 32% 28%,#fffbe6 0%,#ffe27a 38%,#f5b301 78%,#d98e00 100%);overflow:hidden}
.stk.gold::after{content:"";position:absolute;inset:-30%;background:linear-gradient(115deg,transparent 40%,rgba(255,255,255,.75) 50%,transparent 60%);animation:stkShine 3.2s ease-in-out infinite}
.stk.gold .stk-n{background:#d98e00;font-size:10.5px;bottom:auto;right:auto;position:static;display:none}
.stk.ghost{background:#f1ece4;border-color:#f7f3ec;box-shadow:none}
.stk.ghost .stk-e{filter:grayscale(1);opacity:.28}
.stk.big{width:150px;height:150px;border-width:8px}
.stk.big .stk-e{font-size:76px}
.stk.big .stk-n{min-width:44px;height:44px;font-size:20px;bottom:0;right:0;border-width:3px}
.stk.big.gold .stk-n{display:none}
@keyframes stkShine{0%,55%{transform:translateX(-60%)}85%,100%{transform:translateX(60%)}}

/* new sticker modal */
.stk-new{text-align:center}
.stk-stage{position:relative;height:178px;display:grid;place-items:center;perspective:700px;margin:-4px 0 6px}
.stk-peel{animation:stkPeel .9s cubic-bezier(.2,1.4,.4,1) both}
.stk-peel .stk{transform:rotate(-6deg)}
@keyframes stkPeel{0%{transform:translateY(-40px) rotateY(100deg) rotateZ(-30deg) scale(.3);opacity:0}55%{opacity:1}100%{transform:none;opacity:1}}
.stk-shine{position:absolute;width:190px;height:190px;border-radius:50%;background:conic-gradient(from 0deg,rgba(255,201,60,.0),rgba(255,201,60,.35),rgba(255,201,60,0),rgba(255,92,122,.25),rgba(255,201,60,0),rgba(84,120,255,.25),rgba(255,201,60,0));animation:spin 6s linear infinite;z-index:-1}
.stk-k{font-size:13px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--orange)}
.stk-new h2{margin:2px 0 4px}

/* album card in the treasure tab */
.album-card{width:100%;display:flex;align-items:center;gap:14px;text-align:left;padding:14px 16px;margin:4px 0 18px;border-radius:var(--radius);background:linear-gradient(135deg,#6a5cff 0%,#a55eea 100%);color:#fff;box-shadow:var(--shadow)}
.album-cover{width:54px;height:54px;border-radius:14px;background:rgba(255,255,255,.2);display:grid;place-items:center;font-size:32px;flex:none}
.album-txt{flex:1;min-width:0}
.album-txt h3{font-size:19px;margin:0}
.album-txt p{margin:2px 0 0;font-size:13.5px;opacity:.9}
.album-flame{display:flex;align-items:center;gap:2px;background:rgba(255,255,255,.22);border-radius:999px;padding:6px 11px;font-size:18px}
.album-flame b{font-size:17px}
.album-flame.off{opacity:.55;filter:grayscale(.6)}

/* the album sheet */
.album h2{margin-bottom:12px}
.streak-box{display:flex;align-items:center;gap:14px;background:linear-gradient(135deg,#fff3e0,#ffe2c4);border-radius:18px;padding:12px 14px;margin-bottom:12px}
.streak-box.off{background:#f6f2ec}
.streak-big{display:flex;flex-direction:column;align-items:center;min-width:64px;line-height:1}
.streak-big .fl{font-size:30px;animation:flick 1.6s ease-in-out infinite;transform-origin:50% 90%}
.streak-box.off .fl{filter:grayscale(1);opacity:.4;animation:none}
.streak-big b{font-size:26px;margin-top:2px}
.streak-big small{font-size:11px;color:var(--muted);margin-top:2px;white-space:nowrap}
.streak-note{font-size:14px;color:#5b4a3a;line-height:1.4}
@keyframes flick{0%,100%{transform:scale(1) rotate(-3deg)}50%{transform:scale(1.12) rotate(3deg)}}
.stars-row{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin-bottom:14px}
.star{display:flex;flex-direction:column;align-items:center;gap:6px}
.star .stk{width:46px;height:46px;border-width:3px}
.star .stk .stk-e{font-size:22px}
.star small{font-size:10.5px;color:var(--muted);font-weight:700}
.star.got small{color:#b07800}
.album-tabs{display:flex;gap:8px;overflow-x:auto;margin-bottom:10px;scrollbar-width:none}
.album-tabs::-webkit-scrollbar{display:none}
.album-tabs button{flex:none;padding:6px 12px;border-radius:999px;background:#f4efe6;font-weight:600;font-size:13.5px;border:2px solid transparent}
.album-tabs button.on{background:#eef2ff;border-color:var(--blue)}
.album-page{background:#fffdf8;border-radius:18px;border:2px solid var(--line);padding:12px 10px 16px;background-image:radial-gradient(#f3e8d6 1px,transparent 1px);background-size:16px 16px}
.album-page-h{display:flex;align-items:baseline;gap:8px;margin:0 4px 12px}
.album-page-h [lang=he]{font-family:var(--he);font-weight:700;font-size:18px}
.album-page-h b{font-size:16px}
.album-page-h .muted{margin-left:auto}
.slots{display:grid;grid-template-columns:repeat(auto-fill,minmax(52px,1fr));gap:12px 8px;justify-items:center}
.slot{width:50px;height:50px;border-radius:50%;border:2px dashed #e3d6c0;display:grid;place-items:center;color:#cdbca2;font-size:13px;font-weight:700;background:rgba(255,255,255,.6)}
.slot.full{position:relative;border:3px solid #fff;background:radial-gradient(circle at 35% 30%,#fff 0%,#fff6e4 60%,#ffe9c2 100%);box-shadow:0 3px 0 rgba(84,60,20,.10),0 5px 12px rgba(84,60,20,.16);transform:rotate(var(--r,0deg))}
.slot.full .stk-e{font-size:24px;line-height:1}
.slot.full .stk-n{position:absolute;bottom:-5px;right:-6px;min-width:20px;height:20px;padding:0 4px;border-radius:999px;background:var(--blue);color:#fff;font-size:10.5px;display:grid;place-items:center;border:2px solid #fff}
.slot.full.pop{animation:slotPop .45s cubic-bezier(.2,1.6,.4,1)}
@keyframes slotPop{0%{transform:rotate(var(--r)) scale(1)}40%{transform:rotate(0) scale(1.25)}100%{transform:rotate(var(--r)) scale(1)}}
@media (prefers-reduced-motion:reduce){.stk.gold::after,.stk-shine,.streak-big .fl{animation:none}.stk-peel{animation-duration:.01s}}

.stk-stage.two{display:flex;justify-content:center;align-items:center;gap:6px}
.stk-stage.two .stk.big{width:118px;height:118px;border-width:6px}
.stk-stage.two .stk.big .stk-e{font-size:58px}
.stk-stage.two .stk-peel:nth-child(2) .stk{transform:rotate(7deg)}
.stk-also{margin:6px auto 0;max-width:300px;font-size:14px;color:var(--muted);background:#fff7e0;border-radius:12px;padding:8px 10px}
.stk-also b{color:#b07800}