/* Natural Fluffy performance. All rules are confined to the Downloads entrance. */
#downloads .downloads-entry { min-height:100svh; height:100svh; overflow:hidden; isolation:isolate; background:#d00076; }
#downloads .downloads-backdrop { background:radial-gradient(ellipse at 76% 36%,#ff0090 0%,#d00076 54%,#8e0052 100%); }
#downloads .downloads-backdrop::after { background:linear-gradient(0deg,#22001580,transparent 22%),radial-gradient(ellipse at 4% 86%,#5400355c,transparent 60%); }
#downloads .downloads-emblem { width:auto; height:87%; aspect-ratio:1; right:2%; top:8%; opacity:.3; object-fit:contain; mix-blend-mode:normal; filter:drop-shadow(0 28px 20px #4b002850); transform:rotate(-13deg); }
#downloads .downloads-entry .route-header { width:min(calc(100% - 12vw),1240px); height:76px; margin:0 auto; }
#downloads .downloads-opening { position:absolute; top:clamp(116px,18vh,184px); left:max(6vw,calc((100% - 1240px)/2)); width:min(55%,640px); margin:0; display:block; pointer-events:none; }
#downloads .downloads-intro { width:100%; }
#downloads #downloads-title { font-size:clamp(66px,6.5vw,96px); line-height:.94; white-space:nowrap; }
#downloads .downloads-intro .brush-copy.spray-copy { max-width:420px; width:85%; margin:19px 0 28px; height:auto; opacity:1; }
#downloads .download-packs { width:100%; max-width:600px; gap:16px; margin:0; }
#downloads .download-pack { grid-template-columns:88px minmax(0,1fr); gap:18px; padding:17px; border:1px solid #ffd5ed85; border-radius:18px; background:radial-gradient(ellipse at var(--light-x,20%) 0%,#fff3,transparent 58%),linear-gradient(125deg,#ffc6e31f,#4500284a 45%,#19001363); backdrop-filter:blur(20px) saturate(1.15); -webkit-backdrop-filter:blur(20px) saturate(1.15); box-shadow:inset 0 1px 1px #fff9,inset 1px 0 1px #ffbfe84d,inset 0 -1px 1px #ffbbe472,0 16px 30px #43002340; transform-origin:100% 50%; transition:border-color .2s,box-shadow .2s; }
#downloads .download-pack::before { left:8%; right:25%; height:2px; background:linear-gradient(90deg,transparent,#fff,transparent); box-shadow:0 0 12px #ffb2e4; }
#downloads .download-pack.is-pointed { border-color:#fff3fa; box-shadow:inset 0 1px 2px #fff,inset 0 -1px 1px #fff6,0 0 18px #ff70bb40,0 16px 30px #43002350; }
#downloads .pack-visual { width:88px; }
#downloads .pack-cover { border-radius:9px; border-color:#ffedf689; }
#downloads .download-meta { gap:0 12px; }
#downloads .download-pack h3 { font-size:34px; gap:12px; }
#downloads .download-pack h3 em { color:#fff; font-size:22px; }
#downloads .pack-tags { color:#fff1f8; font-size:15px; gap:4px 9px; margin-top:10px; }
#downloads .download-meta .collection-button { min-width:100px; min-height:80px; max-width:none; gap:8px; font-size:15px; padding:5px; }
#downloads .download-meta .collection-button svg { width:42px; height:42px; padding:10px; background:#2900188c; border:1px solid #ffc6e588; box-shadow:inset 0 1px 0 #fff8,0 4px 12px #45002850; }
#downloads .download-meta .collection-button:is(:hover,:focus-visible) svg { background:#ff0090; transform:translateY(2px); }
#downloads .downloads-character { inset:76px -19% 24px 19%; width:auto; height:auto; bottom:24px; z-index:1; pointer-events:none; }
#downloads .fluffy-rig { inset:0; width:100%; height:100%; aspect-ratio:auto; transform-origin:50% 50%; }
#downloads .fluffy-rig img,#downloads .fluffy-performance { position:absolute; inset:0; width:100%; height:100%; object-fit:contain; }
#downloads .fluffy-performance { opacity:0; pointer-events:none; }
#downloads .fluffy-shadow { display:none; }
#downloads .downloads-entry[data-motion=ready] .fluffy-performance { opacity:1; }
#downloads .downloads-entry[data-motion=ready] .fluffy-base { visibility:hidden; }
#downloads .poster-unavailable .fluffy-base { display:none; }
#downloads .downloads-entry[data-motion=loading] .download-pack { visibility:hidden; opacity:0; }
#downloads .downloads-entry[data-motion=static] .download-pack { visibility:visible!important; opacity:1!important; transform:none!important; }
#downloads .downloads-motion-controls { position:absolute; left:max(6vw,calc((100% - 1240px)/2)); bottom:30px; z-index:5; display:flex; align-items:center; gap:25px; width:auto; }
#downloads .downloads-motion-controls[hidden] { display:none; }
#downloads .downloads-replay { position:static; color:#fff; font-size:14px; min-height:44px; text-decoration:underline; text-underline-offset:5px; }
#downloads .downloads-scroll-cue { color:#fff; font:400 21px/1 var(--display); display:flex; gap:18px; align-items:center; }
#downloads .downloads-scroll-cue i { width:84px; height:2px; background:#ffffff40; display:block; }
#downloads .downloads-scroll-cue i::after { content:""; display:block; width:100%; height:100%; background:#fff; transform:scaleX(var(--scene-progress,0)); transform-origin:left; }
@media(min-width:880px) and (max-height:760px) {
 #downloads .downloads-opening { top:112px; width:58%; }
 #downloads #downloads-title { font-size:72px; }
 #downloads .downloads-intro .brush-copy.spray-copy { max-width:330px; margin:14px 0 20px; }
 #downloads .download-packs { max-width:575px; gap:13px; }
 #downloads .download-pack { padding:13px 16px; grid-template-columns:76px minmax(0,1fr); }
 #downloads .pack-visual { width:76px; }
 #downloads .download-pack h3 { font-size:31px; }
 #downloads .download-meta .collection-button { min-height:70px; }
 #downloads .downloads-character { inset:64px -19% 24px 19%; }
}
@media(min-width:880px) and (max-width:1100px) {
 #downloads .downloads-opening { left:5%; width:56%; }
 #downloads .download-pack { grid-template-columns:74px minmax(0,1fr); gap:14px; padding:15px; }
 #downloads .pack-visual { width:74px; }
 #downloads .download-pack h3 { font-size:30px; gap:8px; }
 #downloads .download-pack h3 em { font-size:21px; }
 #downloads .pack-tags { font-size:14px; }
 #downloads .download-meta .collection-button { min-width:86px; font-size:14px; }
 #downloads .downloads-character { inset:80px -18% 28px 18%; }
}
@media(max-width:879px) {
 #downloads .downloads-entry { min-height:100svh; height:auto; }
 #downloads .downloads-opening { position:relative; top:auto; left:auto; width:calc(100% - 44px); margin:34px 22px 44px; }
 #downloads #downloads-title { font-size:clamp(49px,8vw,70px); }
 #downloads .downloads-intro .brush-copy.spray-copy { max-width:340px; margin:14px 0 25px; }
 #downloads .download-packs { width:100%; max-width:none; margin-top:260px; }
 #downloads .downloads-character { inset:auto; top:206px; height:265px; width:100%; left:0; right:auto; bottom:auto; }
 #downloads .downloads-emblem { top:120px; height:400px; right:-85px; }
 #downloads .download-meta { display:grid; grid-template-columns:minmax(0,1fr) auto; }
 #downloads .download-meta .collection-button { flex-direction:column; justify-content:center; width:auto; margin:0; min-height:75px; }
 #downloads .download-pack { grid-template-columns:78px minmax(0,1fr); gap:15px; }
 #downloads .pack-visual { width:78px; }
}
@media(max-width:450px) {
 #downloads .downloads-entry .route-header { width:calc(100% - 36px); height:58px; }
 #downloads .downloads-opening { width:calc(100% - 36px); margin:22px 18px 34px; }
 #downloads #downloads-title { font-size:49px; }
 #downloads .downloads-intro .brush-copy.spray-copy { max-width:284px; margin:14px 0 18px; }
 #downloads .download-packs { margin-top:215px; gap:12px; }
 #downloads .downloads-character { top:206px; height:195px; }
 #downloads .download-pack { grid-template-columns:58px minmax(0,1fr); padding:13px; gap:12px; }
 #downloads .pack-visual { width:58px; }
 #downloads .download-pack h3 { font-size:27px; display:block; }
 #downloads .download-pack h3 em { display:block; font-size:21px; margin-top:4px; }
 #downloads .pack-tags { font-size:14px; margin-top:7px; }
 #downloads .download-meta .collection-button { min-width:76px; max-width:84px; font-size:14px; gap:7px; padding:4px; }
 #downloads .download-meta .collection-button svg { width:38px; height:38px; padding:9px; }
}
@media(prefers-reduced-motion:reduce) {
 #downloads .fluffy-rig,#downloads .downloads-emblem,#downloads .download-pack { transform:none!important; }
 #downloads .download-pack,#downloads .download-meta .collection-button svg { transition:none; }
}
