/* eduTechnoz Parent Workshop - shared bubbly styles (Teacher Pulse family: logo orange / yellow / blue + purple) */
:root{--pw-orange:#F07A45;--pw-yellow:#F1C536;--pw-blue:#4FC3E2;--pw-purple:#6A69DD;--pw-purple-d:#3F3F94;--pw-pink:#FF698D;--pw-green:#60B463;
  --pw-ink:#1C1D1F;--pw-muted:#5F6166;--pw-grey:#9D9FA2;--pw-sky:#EEF9FD;--pw-lilac:#F3F2FF;--pw-cream:#FFF6DA;--pw-card:#ffffff}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;font-family:"Fredoka","Segoe UI",Arial,sans-serif;color:var(--pw-ink);background:var(--pw-sky);overflow-x:hidden;-webkit-tap-highlight-color:transparent}
img{max-width:100%}
button{font-family:inherit}

/* buttons */
.pw-btn{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:8px;border:0;cursor:pointer;border-radius:999px;padding:16px 30px;
  font:700 19px "Fredoka",Arial,sans-serif;color:#fff;text-decoration:none;background:linear-gradient(135deg,#FF8A57,var(--pw-orange));
  box-shadow:0 7px 0 #C4552B,0 14px 26px rgba(240,122,69,.4);transition:transform .12s,box-shadow .12s}
.pw-btn:after{content:"";position:absolute;left:18px;top:6px;width:38%;height:36%;border-radius:999px;background:linear-gradient(rgba(255,255,255,.55),rgba(255,255,255,0));pointer-events:none}
.pw-btn:hover{transform:translateY(-2px) scale(1.02)}
.pw-btn:active{transform:translateY(5px);box-shadow:0 2px 0 #C4552B,0 6px 12px rgba(240,122,69,.3)}
.pw-btn.purple{background:linear-gradient(135deg,#8483F0,var(--pw-purple));box-shadow:0 7px 0 var(--pw-purple-d),0 14px 26px rgba(106,105,221,.35)}
.pw-btn.purple:active{box-shadow:0 2px 0 var(--pw-purple-d)}
.pw-btn.ghost{background:#fff;color:var(--pw-purple);box-shadow:0 6px 0 #D9D8F5,0 10px 20px rgba(106,105,221,.15)}
.pw-btn.ghost:active{box-shadow:0 2px 0 #D9D8F5}
.pw-btn[disabled]{filter:grayscale(.6);opacity:.75;cursor:wait}
.pw-btn.wiggle{animation:pw-wiggle 3.2s 2s ease-in-out infinite}

/* fx */
.pw-particle{position:fixed;z-index:10001;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 30% 30%,#fff 0 18%,var(--c) 55%);animation:pw-burst .7s ease-out forwards}
.pw-confetti{position:fixed;z-index:10001;bottom:-40px;border-radius:50%;pointer-events:none;background:radial-gradient(circle at 30% 30%,#fff 0 15%,var(--c) 60%);opacity:.95;animation:pw-up var(--t) cubic-bezier(.3,.6,.4,1) forwards}
.pw-confetti.star{background:none;border-radius:0;color:var(--c);line-height:1;text-align:center}
.pw-bg-bubble{position:absolute;bottom:-90px;border-radius:50%;pointer-events:none;
  background:radial-gradient(circle at 30% 30%,rgba(255,255,255,.95),rgba(255,255,255,.2) 35%,rgba(255,255,255,.06) 60%,rgba(255,255,255,.4) 100%);
  box-shadow:inset 0 0 12px rgba(255,255,255,.6),0 0 0 1px rgba(79,195,226,.12);animation:pw-rise linear infinite}
.pw-star{position:absolute;pointer-events:none;animation:pw-twinkle 2.6s ease-in-out infinite}

/* scroll reveal */
.pw-reveal{opacity:0;transform:translateY(38px) scale(.94);transition:opacity .6s ease,transform .75s cubic-bezier(.2,1.5,.4,1)}
.pw-reveal.from-left{transform:translateX(-60px) rotate(-3deg)}
.pw-reveal.from-right{transform:translateX(60px) rotate(3deg)}
.pw-reveal.pop{transform:scale(.4)}
.pw-reveal.in{opacity:1;transform:none}
.pw-d1{transition-delay:.08s}.pw-d2{transition-delay:.18s}.pw-d3{transition-delay:.28s}.pw-d4{transition-delay:.38s}.pw-d5{transition-delay:.48s}.pw-d6{transition-delay:.58s}

/* sound toggle */
.pw-mute{position:fixed;right:14px;top:14px;z-index:60;border:0;cursor:pointer;width:46px;height:46px;border-radius:50%;background:#fff;font-size:20px;
  box-shadow:0 6px 16px rgba(106,105,221,.25)}
.pw-mute .pw-tap{position:absolute;right:52px;top:9px;white-space:nowrap;background:var(--pw-purple);color:#fff;font:600 13px "Fredoka",Arial;padding:5px 10px;border-radius:999px;animation:pw-bob 2s ease-in-out infinite}
.pw-mute .pw-tap.gone{display:none}

/* faces (rating) */
.pw-faces{display:flex;justify-content:space-between;gap:8px;padding:8px 0}
.pw-face{flex:1;max-width:84px;aspect-ratio:1;border-radius:50%;border:0;cursor:pointer;font-size:36px;
  background:radial-gradient(circle at 30% 28%,#fff 0 12%,rgba(255,255,255,.2) 30%),radial-gradient(circle,#EEF9FD,#CFEFFA);
  box-shadow:inset 0 0 0 2px rgba(79,195,226,.45),0 6px 14px rgba(79,195,226,.25);animation:pw-bob 2.4s calc(var(--i) * .18s) ease-in-out infinite;transition:transform .2s}
.pw-face:hover{transform:scale(1.12)}
.pw-face.sel{transform:scale(1.22);box-shadow:inset 0 0 0 4px var(--c),0 8px 18px rgba(0,0,0,.2);animation:none}
.pw-face.dim{opacity:.45}

@keyframes pw-burst{0%{transform:translate(0,0) scale(1);opacity:1}100%{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}
@keyframes pw-up{0%{transform:translate(0,0) scale(.6) rotate(0)}100%{transform:translate(var(--dx),-112vh) scale(1.1) rotate(320deg);opacity:.25}}
@keyframes pw-rise{0%{transform:translateY(0) translateX(0)}50%{transform:translateY(-60vh) translateX(18px)}100%{transform:translateY(-125vh) translateX(-12px)}}
@keyframes pw-twinkle{0%,100%{opacity:.15;transform:scale(.5) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(25deg)}}
@keyframes pw-bob{0%,100%{translate:0 0}50%{translate:0 -6px}}
@keyframes pw-float{0%,100%{transform:translateY(0) rotate(var(--tilt,0deg))}50%{transform:translateY(-14px) rotate(calc(var(--tilt,0deg) * -1))}}
@keyframes pw-wiggle{0%,86%,100%{transform:rotate(0)}88%{transform:rotate(-4deg) scale(1.04)}91%{transform:rotate(4deg) scale(1.06)}94%{transform:rotate(-3deg)}97%{transform:rotate(2deg)}}
@keyframes pw-pop-in{0%{transform:scale(0) rotate(var(--tilt,0deg));opacity:0}60%{opacity:1}100%{transform:scale(1) rotate(var(--tilt,0deg));opacity:1}}
@keyframes pw-jelly{0%,100%{transform:rotate(var(--tilt,0deg)) scale(1)}25%{transform:rotate(var(--tilt,0deg)) scale(1.12,.88)}50%{transform:rotate(var(--tilt,0deg)) scale(.92,1.08)}75%{transform:rotate(var(--tilt,0deg)) scale(1.04,.96)}}

@media (prefers-reduced-motion:reduce){
  *,*:before,*:after{animation-duration:.01s!important;animation-iteration-count:1!important;transition-duration:.01s!important}
  .pw-reveal{opacity:1;transform:none}
}