:root{
  /* **hover-lift**: **hover-lift*: **hover-lift: */
  --cream-stage:#F8EED8;
  --buckwheat-honey:#C9902E;
  --studio-umber:#4C3727;
  --soft-mochi:#FFF8EC;
  --muted-apricot:#E7B77A;
  --circuit-matcha:#7E9B64;
  --avatar-plum:#8D6A91;
  --display:"Fraunces", Georgia, serif;
  --body:"Nunito Sans", system-ui, sans-serif;
  --tech:"Atkinson Hyperlegible", Verdana, sans-serif;
}

*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;
  color:var(--studio-umber);
  background:var(--cream-stage);
  font-family:var(--body);
  overflow-x:hidden;
}

.dream-stage{background:var(--cream-stage); min-height:100vh;}
.scene{
  position:relative;
  min-height:100vh;
  overflow:hidden;
  isolation:isolate;
}
.scene:before{
  content:"";
  position:absolute;
  inset:6vw;
  border:1px solid rgba(76,55,39,.08);
  border-radius:42px;
  pointer-events:none;
}

.on-air-corner{
  position:absolute;
  top:8vh;
  right:9vw;
  display:flex;
  align-items:center;
  gap:10px;
  font:700 13px/1 var(--tech);
  letter-spacing:.12em;
  color:var(--studio-umber);
}
.on-air-corner span{
  width:11px;height:11px;border-radius:50%;background:var(--buckwheat-honey);
  box-shadow:0 0 0 0 rgba(201,144,46,.44);
  animation:pulse 2.6s ease-in-out infinite;
}

.title-tape{
  position:absolute;
  left:9vw;
  bottom:18vh;
  transform:rotate(-2deg) translateX(-2vw);
  background:var(--muted-apricot);
  padding:22px 34px 26px;
  border-radius:8px 18px 10px 20px;
  box-shadow:18px 18px 0 rgba(201,144,46,.24);
  animation:slideTape 1.35s cubic-bezier(.19,1,.22,1) both;
}
.stage-label,.scene-title span,.final-label span{
  display:block;
  margin:0 0 8px;
  font:700 12px/1.2 var(--tech);
  letter-spacing:.14em;
  text-transform:uppercase;
}
h1,h2{font-family:var(--display); margin:0; line-height:.94; font-weight:800;}
h1{font-size:clamp(42px,7vw,118px); letter-spacing:-.06em;}
h2{font-size:clamp(34px,5vw,84px); letter-spacing:-.045em; max-width:760px;}
p{font-size:18px; line-height:1.55; margin:0;}

.sleep-monitor{
  position:absolute;
  top:19vh;
  right:12vw;
  width:min(29vw,330px);
  min-width:240px;
  background:var(--studio-umber);
  border-radius:36px;
  padding:14px;
  filter:drop-shadow(18px 20px 0 rgba(126,155,100,.23));
  animation:monitorFloat 6s ease-in-out infinite;
}
.monitor-bar{color:var(--soft-mochi);font:700 11px/1 var(--tech);letter-spacing:.12em;text-transform:uppercase;padding:8px 12px 12px;}
.sleep-monitor svg{display:block;width:100%;background:var(--soft-mochi);border-radius:26px;}
.screen{fill:var(--soft-mochi);stroke:var(--studio-umber);stroke-width:5}
.avatar-plum{fill:var(--avatar-plum)}
.hair{fill:#4C3727;opacity:.22}
.eye,.smile{fill:none;stroke:var(--soft-mochi);stroke-width:7;stroke-linecap:round;animation:blink 5.8s infinite;transform-origin:center;}
.smile{animation:none;stroke-width:5;opacity:.75}
.edge-secret{position:absolute;left:4vw;top:74vh;font:700 12px var(--tech);letter-spacing:.1em;opacity:.42;transform:rotate(90deg)}

svg.circuit, .bloom-circuit{position:absolute;overflow:visible;z-index:-1}.circuit-one{width:52vw;right:18vw;top:38vh}.circuit-two{width:78vw;left:8vw;top:16vh}.circuit-three{width:72vw;left:14vw;top:14vh}.draw,.loop-path,.prop-line,.reveal-line{fill:none;stroke-linecap:round;stroke-linejoin:round;stroke-width:4;stroke-dasharray:900;stroke-dashoffset:900;animation:drawPath 6.5s ease forwards}.honey{stroke:var(--buckwheat-honey)}.matcha{stroke:var(--circuit-matcha)}svg circle{fill:var(--soft-mochi);stroke:var(--buckwheat-honey);stroke-width:4}.reveal-line,.prop-line{stroke:var(--avatar-plum);opacity:0;transition:opacity .45s ease;stroke-width:3}.scene.has-lift .reveal-line,.scene.has-lift .prop-line{opacity:.75}

.scene-two{min-height:112vh}.scene-title{position:absolute;left:11vw;top:12vh}.cue-title h2{max-width:620px}.cue-prop{position:absolute;background:var(--soft-mochi);border:2px solid var(--studio-umber);border-radius:22px;padding:18px 22px;box-shadow:0 0 0 rgba(201,144,46,0);transition:transform .32s ease, box-shadow .32s ease, filter .32s ease;will-change:transform}.cue-prop.is-near{transform:translateY(-9px) rotate(var(--tilt,0deg));box-shadow:14px 16px 0 rgba(201,144,46,.36);filter:drop-shadow(0 0 14px rgba(231,183,122,.2))}.cue-prop:after{content:"";position:absolute;left:20px;right:20px;bottom:-16px;height:3px;background:var(--circuit-matcha);opacity:0;transition:opacity .32s ease}.cue-prop.is-near:after{opacity:.75}.cue-prop span,.cue-prop small{font:700 12px var(--tech);letter-spacing:.12em;text-transform:uppercase}.cue-prop strong,.cue-prop b{display:block;font-family:var(--display);font-size:30px;line-height:1;margin:8px 0}.cue-note{left:61vw;top:21vh;width:250px;--tilt:2deg}.obs-card{left:23vw;top:46vh;width:220px;--tilt:-2deg}.chat-bubble{right:10vw;bottom:17vh;width:260px;border-radius:34px 34px 10px 34px;--tilt:3deg}.emotion-chip{left:47vw;bottom:13vh;border-radius:999px;padding:14px 26px;font:800 16px var(--body);color:var(--soft-mochi);background:var(--avatar-plum);--tilt:-1deg}.mini-bars{display:flex;gap:8px;margin-top:18px}.mini-bars i{display:block;width:42px;height:44px;border-radius:12px;background:var(--muted-apricot)}.mini-bars i:nth-child(2){height:28px;background:var(--circuit-matcha)}.mini-bars i:nth-child(3){height:54px;background:var(--buckwheat-honey)}

.scene-three{min-height:118vh}.patchbay-copy{position:absolute;right:10vw;top:13vh;width:42vw}.sticker{min-width:168px;border-radius:16px 24px 18px 8px;background:var(--muted-apricot)}.sticker-a{left:12vw;top:27vh;--tilt:-3deg}.sticker-b{right:28vw;top:39vh;background:var(--soft-mochi);--tilt:2deg}.sticker-c{left:32vw;bottom:20vh;background:var(--circuit-matcha);color:var(--soft-mochi);--tilt:3deg}.sticker-d{right:12vw;bottom:13vh;background:var(--avatar-plum);color:var(--soft-mochi);--tilt:-2deg}.calendar-petal{left:8vw;bottom:12vh;width:82px;height:100px;border-radius:46px 46px 22px 22px;text-align:center;font:800 20px/1.05 var(--display);display:grid;place-items:center;background:var(--soft-mochi);--tilt:5deg}

.scene-four{min-height:105vh}.halo{position:absolute;width:min(64vw,760px);aspect-ratio:1;border-radius:50%;background:rgba(255,248,236,.62);left:18vw;top:10vh;box-shadow:0 0 0 80px rgba(255,248,236,.18)}.bloom-circuit{width:min(58vw,620px);left:21vw;top:13vh;z-index:0}.halo-ring{fill:none;stroke:rgba(76,55,39,.12);stroke-width:2}.loop-path{stroke:var(--buckwheat-honey);stroke-width:5;fill:none;animation:drawPath 5s ease forwards, glowLoop 4.8s ease-in-out infinite 2s}.loop-path.second{stroke:var(--circuit-matcha);animation-delay:.8s,2.4s}.signal-dot{fill:var(--soft-mochi);stroke:var(--avatar-plum);animation:orbitPulse 3.8s ease-in-out infinite}.d2{animation-delay:1s}.d3{animation-delay:2s}.final-label{position:absolute;right:9vw;bottom:15vh;width:min(36vw,470px);background:var(--soft-mochi);padding:30px;border-radius:32px;box-shadow:-18px 18px 0 rgba(201,144,46,.22)}.final-label h2{font-size:clamp(32px,4vw,60px)}.final-label p{margin-top:18px}.tiny-prop{left:17vw;bottom:12vh;border-radius:999px;background:var(--studio-umber);color:var(--soft-mochi);font:800 15px var(--tech);letter-spacing:.1em;text-transform:uppercase}

@keyframes pulse{50%{box-shadow:0 0 0 16px rgba(201,144,46,0);transform:scale(.82)}}
@keyframes slideTape{from{opacity:0;transform:rotate(-2deg) translateX(-12vw)}to{opacity:1;transform:rotate(-2deg) translateX(-2vw)}}
@keyframes monitorFloat{50%{transform:translateY(-12px) rotate(1deg)}}
@keyframes blink{0%,44%,48%,100%{transform:scaleY(1)}46%{transform:scaleY(.08)}}
@keyframes drawPath{to{stroke-dashoffset:0}}
@keyframes glowLoop{50%{filter:drop-shadow(0 0 12px rgba(201,144,46,.65))}}
@keyframes orbitPulse{50%{transform:scale(1.28);transform-origin:center;fill:var(--muted-apricot)}}

@media (max-width: 760px){
  .scene:before{inset:18px;border-radius:26px}.title-tape{left:7vw;right:7vw;bottom:15vh;padding:18px}.sleep-monitor{right:8vw;top:19vh;width:245px;min-width:0}.circuit-one{width:120vw;right:-42vw}.scene-title,.patchbay-copy{left:8vw;right:8vw;top:9vh;width:auto}.cue-note{left:9vw;top:34vh}.obs-card{left:33vw;top:55vh}.chat-bubble{right:7vw;bottom:11vh}.emotion-chip{left:8vw;bottom:27vh}.sticker-a{left:8vw;top:31vh}.sticker-b{right:7vw;top:48vh}.sticker-c{left:10vw;bottom:26vh}.sticker-d{right:8vw;bottom:10vh}.calendar-petal{display:none}.halo{left:-22vw;top:16vh;width:120vw}.bloom-circuit{left:-5vw;top:18vh;width:100vw}.final-label{left:8vw;right:8vw;bottom:11vh;width:auto}.tiny-prop{left:9vw;bottom:38vh}}
