/* VOLTSpool Playground. CSS-only ambient motion; no external services. */
:root{--mood-a:#bba8ff;--mood-b:#ffb8df;--mood-c:#a1eedb;--mood-accent:#6142d9;--mood-wash:#f3eeff}
:root[data-mood="sunset"]{--mood-a:#ffc098;--mood-b:#ffabd1;--mood-c:#ffe38c;--mood-accent:#ac3767;--mood-wash:#fff0e7;--purple:#ac3767}
:root[data-mood="lagoon"]{--mood-a:#8de8e2;--mood-b:#a8caff;--mood-c:#c6ef8a;--mood-accent:#166e76;--mood-wash:#e8f8f3;--purple:#166e76}
body{background:#fcfaf7;isolation:isolate}body:before{content:'';position:fixed;inset:0;z-index:-2;pointer-events:none;background:radial-gradient(ellipse at 8% 10%,var(--mood-a),transparent 52%),radial-gradient(ellipse at 92% 42%,var(--mood-b),transparent 50%),radial-gradient(ellipse at 15% 93%,var(--mood-c),transparent 52%);opacity:.44;transition:background .6s}
.ambient-art{position:fixed;inset:0;z-index:-1;overflow:hidden;pointer-events:none;background-image:radial-gradient(#51407328 .7px,transparent .7px);background-size:24px 24px;mask-image:linear-gradient(#0009,transparent 75%)}.ambient-art i{position:absolute;width:48vw;height:48vw;max-width:680px;max-height:680px;border-radius:45% 55% 60% 40%;background:var(--mood-a);opacity:.17;filter:blur(45px);animation:ambient-drift 24s ease-in-out infinite alternate}.ambient-art i:nth-child(1){top:-22%;left:40%}.ambient-art i:nth-child(2){top:40%;left:-20%;background:var(--mood-b);animation-delay:-9s}.ambient-art i:nth-child(3){bottom:-35%;right:-15%;background:var(--mood-c);animation-delay:-17s}
@keyframes ambient-drift{to{transform:translate(45px,55px) rotate(35deg)}}
header{background:#fffaf7c9;border:1px solid #fff9;backdrop-filter:blur(18px);border-radius:0 0 28px 28px}.brand-logo img{box-shadow:0 4px 18px #24213916}.hero{position:relative;padding-top:26px;gap:5%}.hero h1{font-size:clamp(3.3rem,6.9vw,6.6rem)}.hero h1 span{background:linear-gradient(110deg,var(--mood-accent) 15%,#ad3b9b 55%,var(--mood-accent));background-clip:text;-webkit-background-clip:text;color:transparent}.hero-copy>.eyebrow{display:inline-flex;align-items:center;gap:10px;border:1px solid #24213933;border-radius:30px;padding:7px 12px;font-size:.66rem;background:#ffffff99}.hero-copy>.eyebrow:before{content:'';height:7px;width:7px;border-radius:50%;background:var(--mood-accent);box-shadow:0 0 0 4px #ffffff99}.hero-image{border:1px solid #242139;box-shadow:12px 12px 0 #242139;border-radius:40px}.hero-image:after{content:'✦';position:absolute;bottom:60px;right:18px;color:#f1ff91;font-size:6rem;line-height:1;text-shadow:2px 2px #242139;pointer-events:none}.hero-image img{border-radius:38px}.sticker{background:#edff97;border-radius:50% 42% 45% 40%;padding:23px;top:20px;right:20px}.hero-note span{font-size:.7rem}.vibes-band{background:linear-gradient(100deg,#e1fa8a,var(--mood-c),#e9daff);padding:18px 10px;border-block:1px solid #24213933}.vibes-band span:before{content:'✦';margin-right:22px}.vibes-band span{letter-spacing:.13em}.page-intro{position:relative}.page-intro>p{font-size:1.08rem}.page-tiles>a{box-shadow:none;background:#ffffffa8;border-color:#24213933;transition:transform .25s,box-shadow .25s}.page-tiles>a:nth-child(2){background:#e8e3ffb0}.page-tiles>a:nth-child(3){background:#e8f4b5b0}.page-tiles>a:hover{transform:translateY(-5px);box-shadow:0 14px 35px #51407315}.about{background:linear-gradient(125deg,#29213f,var(--mood-accent));border-radius:42px;margin:0 2%;padding:70px 5%}.steps>div{padding:26px;border:1px solid #24213920;border-radius:26px;background:#ffffffb0}.steps{gap:20px}.steps span{background:var(--mood-wash);color:var(--mood-accent)}.faq{background:#ffffff80;border-radius:36px;margin-bottom:30px}.faq details[open]{background:var(--mood-wash);border-radius:16px;padding:20px 16px}.faq summary::marker{color:var(--mood-accent)}footer{background:#ffffff8c}.vibes-finder{background:linear-gradient(120deg,#ffffffdf,var(--mood-wash));box-shadow:6px 6px 0 var(--mood-a);border-color:#24213988}.vibes-tools input{margin-bottom:0}.card{box-shadow:4px 4px 0 #24213990}.card:hover{box-shadow:8px 14px 0 var(--mood-a)}.button{box-shadow:0 5px 14px #24213918}.button:hover{background:var(--mood-accent)}button{transition:background .2s,transform .2s,box-shadow .2s}.carousel-arrow:hover{transform:scale(1.07)}
.mood-dock{position:fixed;right:20px;bottom:20px;z-index:20;border:1px solid #24213930;border-radius:40px;background:#fffffff0;backdrop-filter:blur(16px);box-shadow:0 6px 30px #24213915;padding:8px 12px;display:flex;align-items:center;gap:8px}.mood-dock>span{font-size:.65rem;font-weight:800;letter-spacing:.1em;margin:0 3px}.mood-dock button{padding:0;width:30px;height:30px;border:3px solid white;outline:1px solid #24213922;border-radius:50%;background:var(--colour)}.mood-dock button[aria-pressed=true]{outline:2px solid #242139;transform:scale(1.06)}.mood-status{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden}.mood-dock .motion-toggle{width:34px;height:34px;border:0;outline:0;background:#f1eef6;color:#242139;font-size:.85rem;margin-left:3px}.scroll-progress{position:fixed;top:0;left:0;height:3px;background:linear-gradient(90deg,var(--mood-accent),#e46db6,#c1e66f);width:100%;transform:scaleX(0);transform-origin:left;z-index:99;pointer-events:none}
.play-picks{margin:0 5% 64px;padding:38px;border:1px solid #24213944;border-radius:36px;background:#ffffffad;display:grid;grid-template-columns:1fr 1fr;gap:36px;align-items:center;box-shadow:0 18px 60px #6043940c}.play-picks h2{font-size:clamp(2.2rem,4vw,3.7rem);max-width:460px}.play-picks .eyebrow{color:var(--mood-accent)}.play-picks-copy>p{max-width:400px;color:#59556c}.play-pick-stage{position:relative;padding:20px;border-radius:26px;background:linear-gradient(135deg,var(--mood-a),var(--mood-c));display:grid;grid-template-columns:1fr;overflow:hidden}.play-pick-stage:before{content:'✦';position:absolute;top:4px;right:15px;font-size:5rem;color:#fff9;line-height:1}.play-pick-stage img{display:block;width:100%;aspect-ratio:1.25;max-height:300px;object-fit:contain;border-radius:18px;animation:pick-in .3s ease-out}.play-pick-meta{display:flex;justify-content:space-between;align-items:center;gap:16px;background:#fffdf5e8;padding:14px 16px;border-radius:18px;margin-top:16px}.play-pick-meta h3{font-size:1.05rem;margin:0}.play-pick-meta p{margin:3px 0 0;font-size:.85rem}.play-pick-meta a{flex-shrink:0;border-radius:50%;width:42px;height:42px;display:grid;place-items:center;background:#242139;color:white;font-size:1.3rem}.pick-controls{display:flex;align-items:center;gap:12px;margin-top:22px}.pick-controls button{background:#242139;color:white;border:0;border-radius:50px;padding:12px 20px;font-weight:700}.pick-controls .pick-next{background:white;color:#242139;border:1px solid #242139;width:46px;height:46px;padding:0;font-size:1.4rem}.pick-count{font-size:.8rem;color:#59556c}.pick-prompt{font-size:.8rem!important;margin-top:18px!important}.play-pick-stage:focus-within{outline:3px solid var(--mood-accent);outline-offset:5px}.vibes-toast{bottom:82px}.product-copy{background:#ffffff55}.vibes-quick:hover{color:var(--mood-accent)}.vibes-dialog{border-radius:30px}.vibes-dialog-copy{background:#fffdfa}.vibes-dialog-media{background:var(--preview-bg,var(--mood-wash))}.vibes-result:hover{transform:translateY(-3px)}.spotlight-glow{position:absolute;inset:0;background:radial-gradient(300px circle at var(--mx,50%) var(--my,50%),#ffffff40,transparent 80%);pointer-events:none;border-radius:inherit}
@keyframes pick-in{from{opacity:.35;transform:translateY(8px) scale(.97)}to{opacity:1;transform:none}}
html[data-motion="paused"] *,html[data-motion="paused"] *:before,html[data-motion="paused"] *:after{animation:none!important;scroll-behavior:auto!important;transition:none!important}
@media(min-width:1600px){.play-picks{max-width:1296px;margin-inline:auto}}
@media(max-width:760px){.hero{padding-top:12px}.hero h1{font-size:clamp(3.3rem,12vw,5rem)}.hero-copy>.eyebrow{font-size:.6rem;letter-spacing:1.2px}.hero-image{border-radius:26px;box-shadow:7px 7px 0 #242139}.hero-image img{border-radius:25px}.hero-image:after{font-size:4rem}.sticker{padding:18px}.play-picks{margin:0 6% 45px;padding:22px;grid-template-columns:1fr;gap:25px;border-radius:26px}.play-picks h2{margin-bottom:16px}.play-picks-copy>p{margin-bottom:0}.play-pick-stage img{max-height:260px}.pick-controls{flex-wrap:wrap}.mood-dock{bottom:12px;right:12px;gap:6px;padding:7px 10px}.mood-dock>span{font-size:.58rem}.mood-dock button{width:28px;height:28px}.about{margin:0 3%;border-radius:26px;padding:44px 6%}.vibes-band{padding:15px 4px}.vibes-band span{font-size:.6rem;margin:0 6px;letter-spacing:.04em}.vibes-band span:before{margin-right:7px}.faq{margin-bottom:0;border-radius:24px}.steps>div{padding:22px}.ambient-art i{width:85vw;height:85vw;filter:blur(25px)}footer{padding-bottom:85px}.play-pick-meta{padding:12px}.play-pick-meta h3{font-size:1rem}.vibes-toast{bottom:74px;max-width:94vw}.vibes-dialog{max-height:85dvh}}
@media(prefers-reduced-motion:reduce){.ambient-art i{animation:none}.scroll-progress{display:none}*,*:before,*:after{animation:none!important;transition:none!important}}