/* HiDoof preview · Premium. Its own colour (obsidian violet + iridescent sheen) so it never looks like the gold Download. */
:root{--pv1:#2a1650;--pv2:#6b2fd6;--pv3:#c03ad8;--pvglow:rgba(150,70,255,.55)}

/* Premium button under the opened card */
.pill.prem{position:relative;overflow:hidden;isolation:isolate;border:1px solid rgba(225,190,255,.7);color:#fff;font-weight:600;letter-spacing:.01em;
 background:linear-gradient(135deg,var(--pv1) 0%,var(--pv2) 55%,var(--pv3) 100%);box-shadow:0 0 0 1px rgba(227,191,98,.55) inset,0 6px 22px var(--pvglow)}
.pill.prem::after{content:"";position:absolute;inset:-40% -60%;z-index:-1;background:linear-gradient(100deg,transparent 40%,rgba(255,255,255,.55) 50%,transparent 60%);transform:translateX(-60%);animation:premSheen 3.2s ease-in-out infinite}
@keyframes premSheen{55%,100%{transform:translateX(60%)}}
.pill.prem:hover:not(:disabled){box-shadow:0 0 0 1px rgba(227,191,98,.9) inset,0 8px 30px var(--pvglow);transform:translateY(-1px)}
.pill.prem.more{background:rgba(107,47,214,.18);border-color:rgba(200,160,255,.75);box-shadow:none}
.pill.prem.more::after{display:none}
.pill.prem:disabled{opacity:.6;cursor:progress}
/* Download Premium: gold-on-violet, with a progress fill while it downloads */
.pill.premdl{position:relative;overflow:hidden;border:1px solid #e3bf62;color:#fff3cf;font-weight:600;background:linear-gradient(135deg,#3a1d6e,#5b2bb0);box-shadow:0 6px 20px rgba(90,40,180,.45)}
.pill.premdl small{font-weight:400;opacity:.8}
.pill.premdl .ico{display:inline-block;margin-right:2px}
.pill.premdl.busy{background:linear-gradient(90deg,#7b4fe0 var(--p,0%),#3a1d6e var(--p,0%))}
.pill.premdl.attn{animation:attn 1.2s ease-in-out 2}
@keyframes attn{50%{box-shadow:0 0 0 6px rgba(227,191,98,.35),0 6px 26px rgba(150,70,255,.7)}}

/* Premium sheet */
#premsheet{position:fixed;inset:0;z-index:117;background:rgba(18,10,30,.62);display:flex;align-items:center;justify-content:center;padding:16px;animation:rin .25s ease-out}
.prbox{position:relative;width:min(520px,100%);max-height:calc(100dvh - 24px);overflow:auto;display:flex;flex-direction:column;gap:14px;border:1px solid rgba(160,110,240,.35);
 background:radial-gradient(120% 60% at 100% 0,rgba(192,58,216,.10),transparent 60%),radial-gradient(100% 60% at 0 0,rgba(107,47,214,.10),transparent 60%),#fff}
.sheetx{position:absolute;right:10px;top:8px;background:none;border:0;font-size:26px;line-height:1;color:var(--mut);cursor:pointer;padding:4px 10px;border-radius:8px}
.sheetx:hover{background:#f6f0ff}
.sheetx:focus-visible{outline:3px solid var(--gold2);outline-offset:2px}
.prhead{display:flex;gap:16px;align-items:center;padding-right:28px}
.prthumb{flex:none;width:76px;aspect-ratio:540/840;border-radius:8px;overflow:hidden;box-shadow:0 8px 22px rgba(80,30,160,.35),0 0 0 1.5px #e3bf62;animation:floaty 4s ease-in-out infinite}
.prthumb img{width:100%;height:100%;object-fit:cover;display:block}
@keyframes floaty{50%{transform:translateY(-4px) rotate(-1.5deg)}}
.prkick{margin:0 0 2px;font:600 12px 'Inter',sans-serif;letter-spacing:.08em;color:var(--pv2)}
.prhead h3{margin:0;font-size:22px;line-height:1.25}
.prinv{margin:6px 0 0;color:var(--ink);font-size:14.5px;line-height:1.55}
.prlist{display:flex;flex-direction:column;gap:10px}
.pr{position:relative;display:flex;align-items:center;gap:12px;padding:12px 14px;border:1.5px solid var(--line);border-radius:14px;cursor:pointer;background:#fff;transition:border-color .2s,box-shadow .2s,transform .2s}
.pr:hover:not(.off){border-color:#a77cf0;transform:translateY(-1px)}
.pr.on{border-color:var(--pv2);background:linear-gradient(135deg,#faf6ff,#fff);box-shadow:0 0 0 3px rgba(107,47,214,.16),0 8px 22px rgba(107,47,214,.12)}
.pr.off{opacity:.55;cursor:not-allowed}
.pr input{width:22px;height:22px;flex:none;margin:0;accent-color:var(--pv2);cursor:inherit}
.prpic{flex:none;width:42px;aspect-ratio:540/840;border-radius:6px;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 8px rgba(0,0,0,.25)}
.prpic img{display:block;width:100%;height:100%;object-fit:contain;border-radius:inherit}
.prt{flex:1;display:flex;flex-direction:column;line-height:1.35;min-width:0}
.prt b{font-size:15px}.prt small{color:var(--mut);font-size:12.5px}
.prt em{font-style:normal;font-size:11.5px;color:var(--pv2);font-weight:600;margin-top:2px}
.prp{font:700 18px 'Inter',sans-serif;color:var(--ink)}
.prmsg{margin:0;font-size:13.5px;color:var(--mut)}.prmsg:empty{display:none}
.prtotal{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:12px;font-size:18px}
.prtotal b{font-size:26px;font-variant-numeric:tabular-nums}
.prpay{width:100%;padding:15px;font-size:16px;border:0;background:linear-gradient(135deg,var(--pv1),var(--pv2) 55%,var(--pv3));box-shadow:0 10px 28px rgba(107,47,214,.35)}
.prpay:disabled{opacity:.45;box-shadow:none}
@media(max-width:600px){#premsheet{align-items:flex-end;padding:0}.prbox{width:100%;border-radius:18px 18px 0 0;max-height:92dvh;animation:sheetUp .3s ease-out}}
@media(prefers-reduced-motion:reduce){.pill.prem::after,.prthumb,.pill.premdl.attn{animation:none}}

/* WebP preview stays above the purchase sheet; originals remain paid downloads. */
.prpic[role="button"],.prthumb[role="button"]{cursor:zoom-in}
.prpic[role="button"]:focus-visible,.prthumb[role="button"]:focus-visible{outline:3px solid #6b2fd6;outline-offset:4px}
.premium-image-viewer{border:0;padding:0;background:transparent;color:white;max-width:96vw;max-height:94dvh;overflow:visible}
.premium-image-viewer::backdrop{background:rgba(15,9,24,.88)}
.premium-image-viewer button{display:flex;flex-direction:column;align-items:center;gap:0;border:0;background:transparent;color:white;padding:0;cursor:zoom-out;outline:none;-webkit-tap-highlight-color:transparent}
.premium-image-viewer img{display:block;width:min(540px,86vw,calc(64.2857vh - 64px));width:min(540px,86vw,calc(64.2857dvh - 64px));aspect-ratio:2160/3360;object-fit:contain;border-radius:12px;box-shadow:0 12px 50px #0008}
.premium-image-viewer:focus{outline:none}