/* style.css -- merged from per-tier scene CSS by wizard2.stages.build_deploy */
/* Scene root must fill its positioning container. */
.scn { position: absolute; inset: 0; }

/* ============ tier U ============ */
/* per-scene blocks (EXP step_scenes) */
.scn-andrews-challenge-letter { background: linear-gradient(180deg, #f9e7c2 0%, #e6c98a 100%), radial-gradient(ellipse at 80% 30%, #fceabb 0%, transparent 60%); }
.scn-andrews-challenge-letter .bg-wall { position:absolute; inset:0 0 40% 0; background: linear-gradient(90deg, #e3cfaf, #c9b48a); }
.scn-andrews-challenge-letter .window-light { position:absolute; top:10%; left:10%; width:30%; height:50%; background: linear-gradient(135deg, #fff8e0, #fceabb 80%); border-radius: 4px; box-shadow: 0 0 40px 20px rgba(255,235,180,0.5); animation: acl-window 8s ease-in-out infinite alternate; }
.scn-andrews-challenge-letter .desk { position:absolute; bottom:20%; left:30%; width:50%; height:25%; background: linear-gradient(180deg, #8b6f47, #6b5030); border-radius: 6px 6px 0 0; box-shadow: 0 -4px 12px rgba(0,0,0,0.3); }
.scn-andrews-challenge-letter .letter { position:absolute; bottom:35%; left:40%; width:20%; height:18%; background: linear-gradient(135deg, #fdf5e6, #f0e0c8); border-radius: 2px; transform: rotate(-3deg); box-shadow: 2px 2px 6px rgba(0,0,0,0.2); animation: acl-letter 4s ease-in-out infinite; }
.scn-andrews-challenge-letter .hand { position:absolute; bottom:30%; left:35%; width:12%; height:20%; background: linear-gradient(180deg, #dbb88c, #c09a6e); border-radius: 50% 50% 40% 40% / 40% 40% 60% 60%; transform-origin: bottom left; animation: acl-hand 3s ease-in-out infinite; }
.scn-andrews-challenge-letter .quill { position:absolute; bottom:38%; left:43%; width:8%; height:25%; background: linear-gradient(180deg, #f0e0c8, #d0b090); clip-path: polygon(50% 0%, 0% 100%, 100% 100%); animation: acl-quill 2s ease-in-out infinite alternate; }
.scn-andrews-challenge-letter .inkpot { position:absolute; bottom:28%; left:60%; width:8%; height:10%; background: #2a1a0a; border-radius: 50% 50% 20% 20%; box-shadow: inset 0 2px 4px #000; }
@keyframes acl-window { 0% { opacity:0.7; transform: scaleX(1); } 50% { opacity:1; transform: scaleX(1.05); } 100% { opacity:0.8; transform: scaleX(1); } }
@keyframes acl-letter { 0%,100% { transform: rotate(-3deg) translateY(0); } 50% { transform: rotate(-1deg) translateY(-2px); } }
@keyframes acl-hand { 0% { transform: rotate(-10deg) translateY(0); } 50% { transform: rotate(-5deg) translateY(-1px); } 100% { transform: rotate(-10deg) translateY(0); } }
@keyframes acl-quill { 0% { transform: rotate(-5deg) translateY(0); } 100% { transform: rotate(5deg) translateY(-2px); } }

.scn-toby-sends-andrew { background: linear-gradient(180deg, #b4d9e8 0%, #e0f0f8 40%, #cfe3f0 100%), radial-gradient(ellipse at 20% 100%, #a3c9dc 0%, transparent 70%); }
.scn-toby-sends-andrew .bg-sky { position:absolute; inset:0 0 35% 0; background: linear-gradient(180deg, #b4d7e8, #cae8f5); animation: tsa-sky 20s ease-in-out infinite alternate; }
.scn-toby-sends-andrew .orchard-trees { position:absolute; bottom:20%; left:0; right:0; height:40%; background: linear-gradient(180deg, #5b8c3e, #3a6a22); border-radius: 60% 40% 0 0 / 80% 70% 0 0; box-shadow: inset 0 8px 20px rgba(0,0,0,0.3); }
.scn-toby-sends-andrew .path { position:absolute; bottom:5%; left:30%; width:40%; height:15%; background: #c4a87a; border-radius: 50% 50% 30% 30% / 40% 40% 60% 60%; }
.scn-toby-sends-andrew .bush { position:absolute; bottom:20%; right:15%; width:18%; height:20%; background: linear-gradient(180deg, #4d7a2e, #2a5a1a); border-radius: 50% 50% 30% 30%; filter: blur(3px); }
.scn-toby-sends-andrew .figure-andrew { position:absolute; bottom:12%; left:40%; width:8%; height:25%; background: linear-gradient(180deg, #3a2a1a, #1a0a0a); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: tsa-walk 5s ease-in-out infinite; }
.scn-toby-sends-andrew .hat { position:absolute; bottom:33%; left:40%; width:10%; height:6%; background: #2a1a0a; border-radius: 50% 50% 10% 10%; transform: translateX(-10%); animation: tsa-hat 5s ease-in-out infinite; }
@keyframes tsa-sky { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.7; } }
@keyframes tsa-walk { 0%,100% { transform: translateX(0) rotate(0deg); } 25% { transform: translateX(8px) rotate(-2deg); } 50% { transform: translateX(-4px) rotate(2deg); } 75% { transform: translateX(12px) rotate(-1deg); } }
@keyframes tsa-hat { 0%,100% { transform: translateX(-10%) rotate(0deg); } 50% { transform: translateX(-10%) rotate(15deg); } }

.scn-olivia-cesario-meet { background: linear-gradient(180deg, #f2d9b3 0%, #e6c68a 30%, #d4ad72 100%), radial-gradient(ellipse at 50% 20%, #fff0d0 0%, transparent 60%); }
.scn-olivia-cesario-meet .bg-wall-room { position:absolute; inset:0 0 30% 0; background: linear-gradient(90deg, #c9b08a, #b89e72); }
.scn-olivia-cesario-meet .floor { position:absolute; bottom:0; left:0; right:0; height:30%; background: linear-gradient(180deg, #8b6f47, #5a4020); }
.scn-olivia-cesario-meet .window-light { position:absolute; top:10%; left:60%; width:25%; height:45%; background: radial-gradient(ellipse at 50% 50%, #fff8e0 0%, #fceabb 80%); border-radius: 8px; box-shadow: 0 0 30px 10px rgba(255,235,180,0.6); animation: ocm-light 6s ease-in-out infinite alternate; }
.scn-olivia-cesario-meet .figure-olivia { position:absolute; bottom:25%; left:35%; width:12%; height:35%; background: linear-gradient(180deg, #6a4a3a, #3a2a1a); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: rotate(-5deg); animation: ocm-fig1 7s ease-in-out infinite; }
.scn-olivia-cesario-meet .figure-cesario { position:absolute; bottom:25%; right:35%; width:10%; height:32%; background: linear-gradient(180deg, #4a3a2a, #2a1a0a); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: rotate(5deg); animation: ocm-fig2 7s ease-in-out infinite; }
.scn-olivia-cesario-meet .chair { position:absolute; bottom:22%; left:30%; width:16%; height:15%; background: linear-gradient(180deg, #5a3a2a, #3a1a0a); border-radius: 20% 20% 10% 10%; box-shadow: 0 4px 8px rgba(0,0,0,0.3); }
@keyframes ocm-light { 0% { opacity:0.8; transform: scale(1); } 50% { opacity:1; transform: scale(1.03); } 100% { opacity:0.9; transform: scale(0.98); } }
@keyframes ocm-fig1 { 0%,100% { transform: rotate(-5deg) translateY(0); } 50% { transform: rotate(-3deg) translateY(-3px); } }
@keyframes ocm-fig2 { 0%,100% { transform: rotate(5deg) translateY(0); } 50% { transform: rotate(3deg) translateY(-2px); } }

.scn-toby-frightens-cesario { background: linear-gradient(180deg, #3a2a1a 0%, #5a3a2a 50%, #8a6a4a 100%), radial-gradient(ellipse at 50% 0%, #6a4a2a 0%, transparent 70%); }
.scn-toby-frightens-cesario .bg-brickwall { position:absolute; inset:0 0 30% 0; background: linear-gradient(180deg, #4a3a2a, #3a2a1a); }
.scn-toby-frightens-cesario .ground { position:absolute; bottom:0; left:0; right:0; height:30%; background: linear-gradient(180deg, #5a4a3a, #2a1a0a); }
.scn-toby-frightens-cesario .figure-toby { position:absolute; bottom:20%; left:25%; width:14%; height:35%; background: linear-gradient(180deg, #1a0a0a, #0a0a0a); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: rotate(8deg); animation: tfc-fight1 1.6s ease-in-out infinite alternate; }
.scn-toby-frightens-cesario .figure-cesario { position:absolute; bottom:20%; right:30%; width:12%; height:34%; background: linear-gradient(180deg, #2a1a1a, #0a0a0a); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: rotate(-10deg); animation: tfc-fight2 1.8s ease-in-out infinite alternate; }
.scn-toby-frightens-cesario .figure-fabian { position:absolute; bottom:20%; left:50%; width:10%; height:30%; background: linear-gradient(180deg, #1a1a0a, #0a0a0a); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: rotate(5deg); animation: tfc-fight3 2s ease-in-out infinite alternate; }
.scn-toby-frightens-cesario .sword-glint { position:absolute; bottom:35%; left:20%; width:6%; height:6%; background: radial-gradient(circle, #fff8e0, #d4a860); border-radius: 50%; box-shadow: 0 0 20px 8px rgba(255,235,180,0.7); animation: tfc-glint 1.5s ease-in-out infinite alternate; }
@keyframes tfc-fight1 { 0% { transform: rotate(8deg) translateX(0); } 100% { transform: rotate(12deg) translateX(4px); } }
@keyframes tfc-fight2 { 0% { transform: rotate(-10deg) translateX(0); } 100% { transform: rotate(-15deg) translateX(-6px); } }
@keyframes tfc-fight3 { 0% { transform: rotate(5deg) translateY(0); } 100% { transform: rotate(8deg) translateY(-3px); } }
@keyframes tfc-glint { 0% { opacity:0.6; transform: scale(1); } 100% { opacity:1; transform: scale(1.5); } }

/* Scene: sir-toby-brawl */
.scn-sir-toby-brawl {
  background: linear-gradient(180deg, #d4c4a8 0%, #b8a080 50%, #9a7c6a 100%),
              radial-gradient(ellipse at 50% 80%, #e8d0b0 0%, transparent 60%);
}
.scn-sir-toby-brawl .room {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(200,160,120,0.3) 0%, transparent 100%);
  animation: stb-room 12s ease-in-out infinite;
}
.scn-sir-toby-brawl .table {
  position: absolute; bottom: 20%; left: 25%; width: 50%; height: 8%;
  background: linear-gradient(90deg, #7a5a3a, #5a3a1a);
  border-radius: 4px; box-shadow: 0 6px 12px rgba(0,0,0,0.3);
  animation: stb-table 6s ease-in-out infinite alternate;
}
.scn-sir-toby-brawl .mug {
  position: absolute; bottom: 24%; left: 40%; width: 12px; height: 16px;
  background: radial-gradient(circle at 30% 20%, #c8a060, #8a6a3a);
  border-radius: 4px 4px 2px 2px;
  animation: stb-mug 2s ease-in-out infinite alternate;
}
.scn-sir-toby-brawl .figure-sir-toby {
  position: absolute; bottom: 15%; left: 30%; width: 36px; height: 60px;
  background: linear-gradient(180deg, #5a4a2a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: stb-toby 4s ease-in-out infinite;
}
.scn-sir-toby-brawl .figure-clown {
  position: absolute; bottom: 15%; left: 55%; width: 30px; height: 55px;
  background: linear-gradient(180deg, #7a6a5a 0%, #5a4a3a 100%);
  border-radius: 50% 50% 45% 45% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: stb-clown 4s ease-in-out infinite reverse;
}
.scn-sir-toby-brawl .lantern-swing {
  position: absolute; top: 20%; left: 50%; width: 14px; height: 20px;
  background: radial-gradient(circle at 50% 30%, #f0d080, #b88040);
  border-radius: 6px 6px 4px 4px;
  box-shadow: 0 0 20px 8px rgba(240,208,128,0.6);
  animation: stb-lantern 3s ease-in-out infinite;
}
.scn-sir-toby-brawl .spill {
  position: absolute; bottom: 18%; left: 38%; width: 40px; height: 8px;
  background: linear-gradient(90deg, rgba(180,120,60,0.6), rgba(120,80,40,0.3));
  border-radius: 50%; filter: blur(3px);
  animation: stb-spill 5s ease-in-out infinite alternate;
}
@keyframes stb-room { 0% { opacity: 0.9; } 50% { opacity: 1; } 100% { opacity: 0.95; } }
@keyframes stb-table { 0% { transform: translateY(0) scaleX(1); } 100% { transform: translateY(-3px) scaleX(1.02); } }
@keyframes stb-mug { 0% { transform: translate(0,0) rotate(-5deg); } 50% { transform: translate(2px,-4px) rotate(8deg); } 100% { transform: translate(0,0) rotate(-3deg); } }
@keyframes stb-toby { 0%,100% { transform: translateX(0) rotate(0) scaleY(1); } 25% { transform: translateX(10px) rotate(5deg) scaleY(0.95); } 50% { transform: translateX(0) rotate(-3deg) scaleY(1); } 75% { transform: translateX(-8px) rotate(4deg) scaleY(0.98); } }
@keyframes stb-clown { 0%,100% { transform: translateX(0) rotate(0) scaleY(1); } 25% { transform: translateX(-8px) rotate(-4deg) scaleY(0.95); } 50% { transform: translateX(0) rotate(3deg) scaleY(1); } 75% { transform: translateX(6px) rotate(-5deg) scaleY(0.98); } }
@keyframes stb-lantern { 0% { transform: translateX(-10px) rotate(-10deg); } 50% { transform: translateX(10px) rotate(10deg); } 100% { transform: translateX(-10px) rotate(-8deg); } }
@keyframes stb-spill { 0% { transform: scaleX(1) translateY(0); opacity: 0.6; } 100% { transform: scaleX(1.3) translateY(4px); opacity: 0.3; } }

/* Scene: sebastian-appears */
.scn-sebastian-appears {
  background: linear-gradient(180deg, #f0e0c8 0%, #d8c0a0 50%, #c0a080 100%),
              radial-gradient(ellipse at 60% 30%, #fff8e0 0%, transparent 50%);
}
.scn-sebastian-appears .wall-bg {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #d8c0a0, #b89878);
}
.scn-sebastian-appears .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #a08060, #806040);
  border-radius: 20% 20% 0 0 / 30% 30% 0 0;
}
.scn-sebastian-appears .window-light {
  position: absolute; top: 15%; right: 10%; width: 40%; height: 50%;
  background: linear-gradient(135deg, rgba(255,240,200,0.8), rgba(255,220,160,0.2));
  clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
  animation: sa-window 8s ease-in-out infinite alternate;
}
.scn-sebastian-appears .figure-sebastian {
  position: absolute; bottom: 20%; left: 30%; width: 32px; height: 55px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: sa-sebastian 6s ease-in-out infinite;
}
.scn-sebastian-appears .figure-viola {
  position: absolute; bottom: 20%; left: 50%; width: 28px; height: 50px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 45% 45% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: sa-viola 6s ease-in-out infinite reverse;
}
.scn-sebastian-appears .door {
  position: absolute; bottom: 15%; left: 70%; width: 30px; height: 70px;
  background: linear-gradient(180deg, #6a5a4a, #4a3a2a);
  border-radius: 4px; box-shadow: 4px 0 8px rgba(0,0,0,0.2);
  animation: sa-door 10s ease-in-out infinite alternate;
}
.scn-sebastian-appears .warm-glow {
  position: absolute; bottom: 25%; left: 40%; width: 50px; height: 50px;
  background: radial-gradient(circle, rgba(255,230,180,0.5) 0%, transparent 70%);
  animation: sa-glow 3s ease-in-out infinite alternate;
}
@keyframes sa-window { 0% { opacity: 0.6; } 50% { opacity: 1; } 100% { opacity: 0.7; } }
@keyframes sa-sebastian { 0%,100% { transform: translateX(0) rotate(0) scaleY(1); } 50% { transform: translateX(5px) rotate(2deg) scaleY(0.98); } }
@keyframes sa-viola { 0%,100% { transform: translateX(0) rotate(0) scaleY(1); } 50% { transform: translateX(-4px) rotate(-2deg) scaleY(0.98); } }
@keyframes sa-door { 0% { transform: scaleY(1) translateY(0); } 50% { transform: scaleY(1.02) translateY(-2px); } 100% { transform: scaleY(0.98) translateY(1px); } }
@keyframes sa-glow { 0% { opacity: 0.5; transform: scale(1); } 100% { opacity: 0.9; transform: scale(1.3); } }

/* Scene: twin-revelation */
.scn-twin-revelation {
  background: linear-gradient(180deg, #e8d8c0 0%, #d0b898 50%, #b89878 100%),
              radial-gradient(ellipse at 50% 50%, #fff0d0 0%, transparent 70%);
}
.scn-twin-revelation .bg-twin {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(200,180,160,0.2), transparent);
}
.scn-twin-revelation .figure-left {
  position: absolute; bottom: 20%; left: 30%; width: 28px; height: 50px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: tr-left 5s ease-in-out infinite;
}
.scn-twin-revelation .figure-right {
  position: absolute; bottom: 20%; right: 30%; width: 28px; height: 50px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: tr-right 5s ease-in-out infinite;
}
.scn-twin-revelation .apple-center {
  position: absolute; bottom: 30%; left: 50%; width: 18px; height: 16px;
  background: radial-gradient(circle at 40% 30%, #c8553d, #a0461a);
  border-radius: 50% 50% 40% 40% / 50% 50% 45% 45%;
  transform: translateX(-50%) rotate(15deg);
  animation: tr-apple 3s ease-in-out infinite alternate;
}
.scn-twin-revelation .light-source {
  position: absolute; top: 20%; left: 50%; width: 30px; height: 30px;
  background: radial-gradient(circle, #ffd080, transparent 70%);
  border-radius: 50%;
  transform: translateX(-50%);
  animation: tr-light 6s ease-in-out infinite alternate;
}
.scn-twin-revelation .shadow-arc {
  position: absolute; bottom: 18%; left: 20%; width: 60%; height: 4px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.2), transparent);
  border-radius: 50%;
  animation: tr-shadow 5s ease-in-out infinite alternate;
}
.scn-twin-revelation .sparkle {
  position: absolute; top: 15%; left: 45%; width: 6px; height: 6px;
  background: #fff;
  border-radius: 50%;
  box-shadow: 0 0 8px 2px rgba(255,255,200,0.8);
  animation: tr-sparkle 2s ease-in-out infinite;
}
@keyframes tr-left { 0%,100% { transform: translateX(0) rotate(0) scaleY(1); } 50% { transform: translateX(-3px) rotate(-2deg) scaleY(0.98); } }
@keyframes tr-right { 0%,100% { transform: translateX(0) rotate(0) scaleY(1); } 50% { transform: translateX(3px) rotate(2deg) scaleY(0.98); } }
@keyframes tr-apple { 0% { transform: translateX(-50%) rotate(10deg) scale(1); } 100% { transform: translateX(-50%) rotate(-10deg) scale(1.05); } }
@keyframes tr-light { 0% { opacity: 0.6; transform: translateX(-50%) scale(1); } 100% { opacity: 1; transform: translateX(-50%) scale(1.2); } }
@keyframes tr-shadow { 0% { transform: scaleX(1); opacity: 0.4; } 100% { transform: scaleX(1.2); opacity: 0.7; } }
@keyframes tr-sparkle { 0%,100% { opacity: 0; transform: scale(0.5); } 50% { opacity: 1; transform: scale(2); } }

/* Scene: viola-reveals-identity */
.scn-viola-reveals-identity {
  background: linear-gradient(180deg, #f0e0c8 0%, #d8c0a0 50%, #c0a080 100%),
              radial-gradient(ellipse at 50% 70%, #ffe8d0 0%, transparent 60%);
}
.scn-viola-reveals-identity .bg-soft {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, rgba(200,180,160,0.15), transparent);
}
.scn-viola-reveals-identity .figure-viola-profile {
  position: absolute; bottom: 20%; left: 25%; width: 28px; height: 50px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform: scaleX(-1); /* mirrors to face right */
  animation: vri-viola 6s ease-in-out infinite;
}
.scn-viola-reveals-identity .figure-sebastian-profile {
  position: absolute; bottom: 20%; left: 55%; width: 28px; height: 50px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: vri-sebastian 6s ease-in-out infinite;
}
.scn-viola-reveals-identity .candle {
  position: absolute; top: 30%; left: 50%; width: 10px; height: 20px;
  background: linear-gradient(180deg, #ffd080 0%, #b88040 100%);
  border-radius: 3px;
  box-shadow: 0 0 24px 8px rgba(255,208,128,0.6);
  transform: translateX(-50%);
  animation: vri-candle 2s ease-in-out infinite alternate;
}
.scn-viola-reveals-identity .mole-marker {
  position: absolute; top: 45%; left: 28%; width: 4px; height: 4px;
  background: #5e1a1d;
  border-radius: 50%;
  animation: vri-mole 8s ease-in-out infinite;
}
.scn-viola-reveals-identity .warm-halo {
  position: absolute; inset: 0;
  background: radial-gradient(circle at 50% 40%, rgba(255,200,120,0.1), transparent 70%);
  animation: vri-halo 5s ease-in-out infinite alternate;
}
@keyframes vri-viola { 0%,100% { transform: scaleX(-1) translateY(0); } 50% { transform: scaleX(-1) translateY(-2px); } }
@keyframes vri-sebastian { 0%,100% { transform: translateY(0); } 50% { transform: translateY(-2px); } }
@keyframes vri-candle { 0% { transform: translateX(-50%) scaleY(1) rotate(-2deg); opacity: 0.9; } 50% { transform: translateX(-50%) scaleY(1.05) rotate(2deg); opacity: 1; } 100% { transform: translateX(-50%) scaleY(0.95) rotate(0); opacity: 0.85; } }
@keyframes vri-mole { 0% { opacity: 0.8; } 50% { opacity: 1; } 100% { opacity: 0.9; } }
@keyframes vri-halo { 0% { opacity: 0.5; } 100% { opacity: 0.8; } }

.scn-malvolio-solo-triumph { background: linear-gradient(180deg, #f5edd6 0%, #e2ceaa 40%, #d4b896 100%), radial-gradient(ellipse at 80% 30%, #fff5e0 0%, transparent 70%); }
.scn-malvolio-solo-triumph .wall    { position:absolute; inset:0 0 35% 0; background: linear-gradient(180deg, #ede3c4 0%, #dacba5 100%); }
.scn-malvolio-solo-triumph .wainscot{ position:absolute; bottom:35%; left:0; right:0; height:20%; background: linear-gradient(90deg, #8b6f4c 0%, #a5855e 50%, #8b6f4c 100%); box-shadow: inset 0 4px 8px rgba(0,0,0,.15); }
.scn-malvolio-solo-triumph .light-shaft{ position:absolute; top:0; left:60%; width:180px; height:100%; background: linear-gradient(180deg, rgba(255,235,180,.6) 0%, rgba(255,235,180,0) 80%); transform: skewX(-10deg); animation: mst-shaft 5s ease-in-out infinite alternate; }
.scn-malvolio-solo-triumph .figure { position:absolute; bottom:38%; left:40%; width:30px; height:80px; background: linear-gradient(180deg, #3a2a1a 0%, #1f1510 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mst-figure 2s ease-in-out infinite; }
.scn-malvolio-solo-triumph .letter  { position:absolute; bottom:52%; left:50%; width:20px; height:28px; background: #c8b08a; border-radius: 2px; transform-origin: bottom left; animation: mst-letter 3s ease-in-out infinite; }
.scn-malvolio-solo-triumph .shadow  { position:absolute; bottom:36%; left:35%; width:60px; height:6px; background: rgba(0,0,0,.12); border-radius: 50%; filter: blur(3px); animation: mst-shadow 2s ease-in-out infinite; }
.scn-malvolio-solo-triumph .hat     { position:absolute; bottom:66%; left:38%; width:26px; height:16px; background: #1a1a1a; border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: rotate(-10deg); animation: mst-hat 2.5s ease-in-out infinite; }
@keyframes mst-shaft  { 0% { opacity:.3; transform: skewX(-10deg) translateX(0); } 50% { opacity:.6; transform: skewX(-8deg) translateX(10px); } 100% { opacity:.4; transform: skewX(-12deg) translateX(-5px); } }
@keyframes mst-figure { 0% { transform: rotate(-2deg) translateY(0); } 30% { transform: rotate(3deg) translateY(-4px); } 60% { transform: rotate(-1deg) translateY(0); } 100% { transform: rotate(0) translateY(0); } }
@keyframes mst-letter { 0% { transform: rotate(0) scaleX(1); } 50% { transform: rotate(15deg) scaleX(0.8); } 100% { transform: rotate(-5deg) scaleX(1.05); } }
@keyframes mst-shadow { 0% { width:60px; opacity:.3; } 50% { width:75px; opacity:.5; } 100% { width:60px; opacity:.3; } }
@keyframes mst-hat    { 0% { transform: rotate(-10deg) translateY(0); } 40% { transform: rotate(0deg) translateY(-2px); } 80% { transform: rotate(-12deg) translateY(1px); } 100% { transform: rotate(-8deg) translateY(0); } }

.scn-toby-fabian-enter { background: linear-gradient(180deg, #f8efd8 0%, #e6d4b8 50%, #cfbc9a 100%), radial-gradient(ellipse at 30% 50%, #fff8e8 0%, transparent 80%); }
.scn-toby-fabian-enter .wall     { position:absolute; inset:0 0 30% 0; background: linear-gradient(180deg, #e6d6b8 0%, #d4c0a0 100%); }
.scn-toby-fabian-enter .doorway  { position:absolute; bottom:30%; left:45%; width:100px; height:70%; background: #4a3e2e; border-radius: 4px 4px 0 0; box-shadow: inset 0 0 20px rgba(0,0,0,.3); animation: tfe-door 8s ease-in-out infinite alternate; }
.scn-toby-fabian-enter .figure-toby  { position:absolute; bottom:40%; left:30%; width:28px; height:70px; background: linear-gradient(180deg, #5e4a38 0%, #2e2218 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: tfe-walk1 4s ease-in-out infinite; }
.scn-toby-fabian-enter .figure-fabian{ position:absolute; bottom:40%; left:50%; width:26px; height:68px; background: linear-gradient(180deg, #6a543e 0%, #362a1e 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: tfe-walk2 4.5s ease-in-out infinite; }
.scn-toby-fabian-enter .lamp     { position:absolute; bottom:55%; left:55%; width:10px; height:14px; background: radial-gradient(circle, #ffda80 0%, #c2913a 70%); border-radius: 30% 30% 20% 20%; box-shadow: 0 0 20px 8px rgba(255,218,128,.5), 0 0 40px 15px rgba(255,218,128,.2); animation: tfe-lamp 3s ease-in-out infinite alternate; }
.scn-toby-fabian-enter .floor    { position:absolute; bottom:0; left:0; right:0; height:30%; background: linear-gradient(180deg, #c2aa82 0%, #a68c64 100%); }
@keyframes tfe-door  { 0% { transform: scaleX(1); opacity:.8; } 50% { transform: scaleX(1.05); opacity:1; } 100% { transform: scaleX(0.98); opacity:.85; } }
@keyframes tfe-walk1 { 0% { transform: translateX(0) rotate(-1deg); } 25% { transform: translateX(10px) rotate(1deg); } 50% { transform: translateX(20px) rotate(-1deg); } 75% { transform: translateX(30px) rotate(1deg); } 100% { transform: translateX(40px) rotate(0); } }
@keyframes tfe-walk2 { 0% { transform: translateX(0) rotate(1deg); } 25% { transform: translateX(10px) rotate(-1deg); } 50% { transform: translateX(20px) rotate(1deg); } 75% { transform: translateX(30px) rotate(-1deg); } 100% { transform: translateX(40px) rotate(0); } }
@keyframes tfe-lamp  { 0% { box-shadow: 0 0 15px 5px rgba(255,218,128,.4); } 50% { box-shadow: 0 0 25px 10px rgba(255,218,128,.7); } 100% { box-shadow: 0 0 15px 5px rgba(255,218,128,.4); } }

.scn-mocking-malvolio { background: linear-gradient(180deg, #f0e5c8 0%, #dec8a4 50%, #c2a880 100%), radial-gradient(ellipse at 60% 40%, #fff8e0 0%, transparent 70%); }
.scn-mocking-malvolio .bg         { position:absolute; inset:0 0 25% 0; background: linear-gradient(180deg, #e5d2b0 0%, #d0b890 100%); }
.scn-mocking-malvolio .table      { position:absolute; bottom:35%; left:20%; right:20%; height:12%; background: linear-gradient(180deg, #8a6a42 0%, #6b4f30 100%); border-radius: 6px; box-shadow: 0 6px 12px rgba(0,0,0,.2); animation: mm-table 6s ease-in-out infinite; }
.scn-mocking-malvolio .figure-malvolio{ position:absolute; bottom:45%; left:42%; width:28px; height:75px; background: linear-gradient(180deg, #3d2c1a 0%, #1f150c 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mm-malvolio 3s ease-in-out infinite; }
.scn-mocking-malvolio .figure-toby   { position:absolute; bottom:48%; left:28%; width:25px; height:65px; background: linear-gradient(180deg, #5a422c 0%, #2c1e12 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mm-toby 3.5s ease-in-out infinite; }
.scn-mocking-malvolio .figure-maria  { position:absolute; bottom:52%; left:60%; width:22px; height:58px; background: linear-gradient(180deg, #6a4a2e 0%, #3a2414 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mm-maria 4s ease-in-out infinite; }
.scn-mocking-malvolio .candle     { position:absolute; bottom:42%; left:50%; width:4px; height:18px; background: #c8a060; border-radius: 2px; box-shadow: 0 0 10px 4px rgba(255,200,100,.6); animation: mm-candle 2s ease-in-out infinite alternate; }
.scn-mocking-malvolio .shadow-arc { position:absolute; bottom:38%; left:25%; right:25%; height:8px; background: radial-gradient(ellipse, rgba(0,0,0,.15) 0%, transparent 70%); filter: blur(4px); animation: mm-shadow 5s ease-in-out infinite; }
@keyframes mm-table   { 0% { transform: translateY(0); } 50% { transform: translateY(-2px); } 100% { transform: translateY(0); } }
@keyframes mm-malvolio{ 0% { transform: rotate(-2deg); } 30% { transform: rotate(4deg); } 60% { transform: rotate(-1deg); } 100% { transform: rotate(0); } }
@keyframes mm-toby    { 0% { transform: translateX(0) rotate(0); } 25% { transform: translateX(-6px) rotate(2deg); } 50% { transform: translateX(2px) rotate(-2deg); } 75% { transform: translateX(-4px) rotate(1deg); } 100% { transform: translateX(0) rotate(0); } }
@keyframes mm-maria   { 0% { transform: translateY(0) rotate(0); } 40% { transform: translateY(-5px) rotate(-3deg); } 80% { transform: translateY(2px) rotate(2deg); } 100% { transform: translateY(0) rotate(0); } }
@keyframes mm-candle  { 0% { transform: scaleY(1); opacity:.8; } 50% { transform: scaleY(1.2); opacity:1; } 100% { transform: scaleY(0.9); opacity:.7; } }
@keyframes mm-shadow  { 0% { opacity:.3; } 50% { opacity:.6; } 100% { opacity:.3; } }

.scn-plot-to-imprison { background: linear-gradient(180deg, #e8dac0 0%, #cfb890 50%, #b89a70 100%), radial-gradient(ellipse at 40% 50%, #fff2da 0%, transparent 80%); }
.scn-plot-to-imprison .wall-dark   { position:absolute; inset:0 0 30% 0; background: linear-gradient(180deg, #c8b088 0%, #a08060 100%); }
.scn-plot-to-imprison .figure-group{ position:absolute; bottom:35%; left:30%; right:30%; height:45%; background: radial-gradient(ellipse 80% 100% at 50% 100%, #4a3626 0%, #2a1e12 90%); border-radius: 50% 50% 30% 30% / 60% 60% 40% 40%; box-shadow: 0 8px 20px rgba(0,0,0,.3); animation: pti-cluster 7s ease-in-out infinite; }
.scn-plot-to-imprison .plan-note   { position:absolute; bottom:52%; left:45%; width:30px; height:26px; background: #c8b088; border-radius: 2px; transform: rotate(-10deg); box-shadow: 0 2px 4px rgba(0,0,0,.2); animation: pti-note 4s ease-in-out infinite; }
.scn-plot-to-imprison .hand        { position:absolute; bottom:48%; left:40%; width:12px; height:18px; background: #3d2b1a; border-radius: 30% 30% 20% 20%; transform: rotate(20deg); transform-origin: bottom; animation: pti-hand 3s ease-in-out infinite; }
.scn-plot-to-imprison .whisper-lines{ position:absolute; top:20%; left:35%; right:35%; height:20%; background: repeating-linear-gradient(90deg, transparent, transparent 4px, rgba(120,90,60,.1) 4px, rgba(120,90,60,.1) 8px); animation: pti-whisper 5s ease-in-out infinite; }
.scn-plot-to-imprison .floor-board { position:absolute; bottom:0; left:0; right:0; height:30%; background: linear-gradient(180deg, #b09878 0%, #8c7454 100%); box-shadow: inset 0 6px 12px rgba(0,0,0,.15); animation: pti-floor 8s ease-in-out infinite alternate; }
@keyframes pti-cluster{ 0% { transform: scale(1); } 50% { transform: scale(1.02) translateY(-4px); } 100% { transform: scale(0.98) translateY(2px); } }
@keyframes pti-note   { 0% { transform: rotate(-10deg) scaleX(1); } 30% { transform: rotate(-5deg) scaleX(0.9); } 60% { transform: rotate(-12deg) scaleX(1.05); } 100% { transform: rotate(-8deg) scaleX(1); } }
@keyframes pti-hand   { 0% { transform: rotate(15deg) translateY(0); } 30% { transform: rotate(25deg) translateY(-2px); } 60% { transform: rotate(12deg) translateY(1px); } 100% { transform: rotate(18deg) translateY(0); } }
@keyframes pti-whisper{ 0% { opacity:.1; } 50% { opacity:.4; } 100% { opacity:.1; } }
@keyframes pti-floor  { 0% { opacity:.8; transform: scaleY(1); } 50% { opacity:1; transform: scaleY(1.01); } 100% { opacity:.85; transform: scaleY(0.99); } }

/* olivia-house-malvolio – tense, dim interior */
.scn-olivia-house-malvolio {
  background: 
    linear-gradient(135deg, #1a1a2e 0%, #2a2a40 30%, #1e1e32 100%),
    radial-gradient(ellipse at 50% 60%, #3a3a5e 0%, transparent 80%);
}
.scn-olivia-house-malvolio .wall-shadow {
  position: absolute; inset: 0 0 0 0;
  background: linear-gradient(180deg, #151525 0%, transparent 50%, #0f0f1a 100%);
  animation: oh1-wall 9s ease-in-out infinite alternate;
}
.scn-olivia-house-malvolio .window-glow {
  position: absolute; top: 10%; left: 60%; width: 60px; height: 80px;
  background: radial-gradient(circle, rgba(200,180,100,.2) 0%, transparent 70%);
  box-shadow: 0 0 30px 10px rgba(180,160,80,.15);
  animation: oh1-win 4s ease-in-out infinite alternate;
}
.scn-olivia-house-malvolio .figure-malvo {
  position: absolute; bottom: 18%; left: 35%; width: 28px; height: 70px;
  background: linear-gradient(180deg, #2a2a3e 0%, #181828 100%);
  border-radius: 30% 30% 20% 20% / 50% 50% 30% 30%;
  transform-origin: bottom center;
  animation: oh1-fig 6s ease-in-out infinite;
}
.scn-olivia-house-malvolio .fool-hat {
  position: absolute; bottom: 68%; left: 36%; width: 30px; height: 36px;
  background: radial-gradient(ellipse at 50% 100%, #3a7a3a 0%, #1a3a1a 100%);
  border-radius: 50% 50% 0 0;
  clip-path: polygon(20% 0%, 80% 0%, 100% 100%, 0% 100%);
  animation: oh1-hat 2s ease-in-out infinite alternate;
}
.scn-olivia-house-malvolio .shadow-stripes {
  position: absolute; inset: 30% 10% 20% 10%;
  background: repeating-linear-gradient(90deg, rgba(0,0,0,.2) 0px, rgba(0,0,0,.2) 8px, transparent 8px, transparent 16px);
  animation: oh1-stp 12s linear infinite;
}
.scn-olivia-house-malvolio .candle-flame {
  position: absolute; bottom: 30%; left: 20%; width: 10px; height: 14px;
  background: radial-gradient(circle, #ffaa44 0%, #cc6633 70%);
  border-radius: 50% 50% 30% 30%;
  box-shadow: 0 0 12px 4px rgba(255,180,60,.4);
  animation: oh1-flm .8s ease-in-out infinite alternate;
}
.scn-olivia-house-malvolio .frame-left {
  position: absolute; top: 0; left: 0; bottom: 0; width: 8%;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a120a 100%);
  box-shadow: inset -4px 0 6px rgba(0,0,0,.5);
}
.scn-olivia-house-malvolio .frame-right {
  position: absolute; top: 0; right: 0; bottom: 0; width: 8%;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a120a 100%);
  box-shadow: inset 4px 0 6px rgba(0,0,0,.5);
}
@keyframes oh1-wall { 0%,100%{ opacity:.9 } 50%{ opacity:.7 } }
@keyframes oh1-win { 0%{ opacity:.5; transform:scale(1) } 100%{ opacity:.8; transform:scale(1.05) } }
@keyframes oh1-fig { 0%,100%{ transform:translateX(0) rotate(-1deg) } 25%{ transform:translateX(4px) rotate(1deg) } 50%{ transform:translateX(0) rotate(-1deg) } 75%{ transform:translateX(-3px) rotate(1deg) } }
@keyframes oh1-hat { 0%{ transform:rotate(-5deg) } 100%{ transform:rotate(5deg) } }
@keyframes oh1-stp { 0%{ background-position:0 0 } 100%{ background-position:-40px 0 } }
@keyframes oh1-flm { 0%{ transform:scaleY(1) translateY(0) } 100%{ transform:scaleY(1.3) translateY(-2px) } }

/* olivia-house-sir-toby – funny, dim interior */
.scn-olivia-house-sir-toby {
  background: 
    linear-gradient(180deg, #2a241a 0%, #3a3026 30%, #1f1a14 100%),
    radial-gradient(ellipse at 50% 80%, #4a3a2a 0%, transparent 70%);
}
.scn-olivia-house-sir-toby .floor-bg {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(0deg, #2a1a0a 0%, #4a3a2a 100%);
  border-radius: 20% 20% 0 0;
  animation: oh2-floor 5s ease-in-out infinite alternate;
}
.scn-olivia-house-sir-toby .jug {
  position: absolute; bottom: 30%; left: 30%; width: 24px; height: 36px;
  background: linear-gradient(180deg, #6a4a2a 0%, #3a2a1a 100%);
  border-radius: 40% 40% 20% 20%;
  transform-origin: bottom center;
  animation: oh2-jug 3s ease-in-out infinite;
}
.scn-olivia-house-sir-toby .stool {
  position: absolute; bottom: 18%; left: 60%; width: 40px; height: 20px;
  background: linear-gradient(90deg, #5a4a3a 0%, #7a5a3a 50%, #5a4a3a 100%);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,.4);
  transform: rotate(2deg);
  animation: oh2-stool 4s ease-in-out infinite;
}
.scn-olivia-house-sir-toby .figure-toby {
  position: absolute; bottom: 20%; left: 50%; width: 34px; height: 60px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 40% 40% 30% 30% / 60% 60% 30% 30%;
  transform-origin: bottom center;
  animation: oh2-toby 1.5s ease-in-out infinite;
}
.scn-olivia-house-sir-toby .wobble-cup {
  position: absolute; bottom: 36%; left: 55%; width: 14px; height: 18px;
  background: linear-gradient(180deg, #8a7a4a 0%, #5a4a2a 100%);
  border-radius: 30% 30% 10% 10%;
  animation: oh2-cup 1.8s ease-in-out infinite alternate;
}
.scn-olivia-house-sir-toby .lamp-swing {
  position: absolute; top: 12%; left: 20%; width: 20px; height: 30px;
  background: radial-gradient(circle at 50% 20%, #ddaa66 0%, #886633 100%);
  border-radius: 50% 50% 10% 10%;
  animation: oh2-lamp 6s ease-in-out infinite;
}
.scn-olivia-house-sir-toby .wall-planks {
  position: absolute; inset: 0 0 35% 0;
  background: repeating-linear-gradient(90deg, transparent 0px, transparent 20px, rgba(0,0,0,.15) 20px, rgba(0,0,0,.15) 22px);
  animation: oh2-plank 10s linear infinite;
}
@keyframes oh2-floor { 0%,100%{ transform:translateY(0) } 50%{ transform:translateY(3px) } }
@keyframes oh2-jug { 0%,100%{ transform:rotate(-8deg) translateY(0) } 50%{ transform:rotate(8deg) translateY(-2px) } }
@keyframes oh2-stool { 0%,100%{ transform:rotate(2deg) } 50%{ transform:rotate(-3deg) } }
@keyframes oh2-toby { 0%,100%{ transform:rotate(-4deg) translateX(0) } 30%{ transform:rotate(4deg) translateX(5px) } 70%{ transform:rotate(-2deg) translateX(-3px) } }
@keyframes oh2-cup { 0%{ transform:rotate(-10deg) } 100%{ transform:rotate(15deg) } }
@keyframes oh2-lamp { 0%,100%{ transform:rotate(-15deg) } 50%{ transform:rotate(15deg) } }
@keyframes oh2-plank { 0%{ background-position:0 0 } 100%{ background-position:-40px 0 } }

/* olivia-house-messenger – tense, dim interior */
.scn-olivia-house-messenger {
  background: 
    linear-gradient(0deg, #0f0f1a 0%, #1a1a2e 40%, #2a2a3e 100%),
    radial-gradient(ellipse at 50% 20%, #3a3a5e 0%, transparent 80%);
}
.scn-olivia-house-messenger .door-frame {
  position: absolute; bottom: 0; left: 50%; width: 100px; height: 160px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 4px 4px 0 0;
  box-shadow: inset -2px 0 6px rgba(0,0,0,.6), inset 2px 0 6px rgba(0,0,0,.6);
  animation: oh3-door 20s ease-in-out infinite alternate;
}
.scn-olivia-house-messenger .door-panel {
  position: absolute; bottom: 2%; left: 50%; width: 80px; height: 140px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #6a5a3a 0%, #3a2a1a 100%);
  border-radius: 2px;
  box-shadow: 0 0 12px rgba(0,0,0,.4);
}
.scn-olivia-house-messenger .messenger-silhouette {
  position: absolute; bottom: 8%; left: 50%; width: 30px; height: 80px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #0a0a14 0%, #000 100%);
  border-radius: 40% 40% 20% 20% / 60% 60% 20% 20%;
  animation: oh3-msg 5s ease-in-out infinite alternate;
}
.scn-olivia-house-messenger .crack-light {
  position: absolute; bottom: 25%; left: 49%; width: 2px; height: 60px;
  background: linear-gradient(180deg, rgba(255,200,100,.6) 0%, rgba(255,200,100,.1) 100%);
  box-shadow: 0 0 8px 2px rgba(255,200,100,.3);
  animation: oh3-crack 3s ease-in-out infinite alternate;
}
.scn-olivia-house-messenger .floor-shadow {
  position: absolute; bottom: 0; left: 0; right: 0; height: 20%;
  background: linear-gradient(180deg, transparent 0%, #0a0a14 100%);
  animation: oh3-shade 7s ease-in-out infinite alternate;
}
.scn-olivia-house-messenger .wall-bricks {
  position: absolute; inset: 0 0 20% 0;
  background: repeating-linear-gradient(0deg, transparent 0px, transparent 20px, rgba(80,70,50,.1) 20px, rgba(80,70,50,.1) 22px),
    repeating-linear-gradient(90deg, transparent 0px, transparent 40px, rgba(80,70,50,.08) 40px, rgba(80,70,50,.08) 42px);
}
.scn-olivia-house-messenger .rusty-knocker {
  position: absolute; bottom: 50%; left: 50%; width: 12px; height: 16px;
  transform: translate(-50%, -10%);
  background: radial-gradient(circle, #8a6a4a 0%, #4a3a2a 100%);
  border-radius: 30% 30% 10% 10%;
  box-shadow: 0 2px 4px rgba(0,0,0,.5);
  animation: oh3-knock 2s ease-in-out infinite;
}
.scn-olivia-house-messenger .threshold {
  position: absolute; bottom: 0; left: 45%; width: 110px; height: 8px;
  background: linear-gradient(90deg, #3a2a1a 0%, #5a4a2a 50%, #3a2a1a 100%);
  box-shadow: 0 -2px 4px rgba(0,0,0,.5);
}
@keyframes oh3-door { 0%,100%{ transform:translateX(-50%) scaleY(1) } 50%{ transform:translateX(-50%) scaleY(1.02) } }
@keyframes oh3-msg { 0%{ transform:translateX(-50%) rotate(0deg) } 50%{ transform:translateX(-50%) rotate(2deg) translateY(-2px) } 100%{ transform:translateX(-50%) rotate(0deg) } }
@keyframes oh3-crack { 0%{ opacity:.3 } 100%{ opacity:.8 } }
@keyframes oh3-shade { 0%{ opacity:.6 } 100%{ opacity:.9 } }
@keyframes oh3-knock { 0%,100%{ transform:translate(-50%, -10%) rotate(0deg) } 25%{ transform:translate(-50%, -15%) rotate(-5deg) } 75%{ transform:translate(-50%, -5%) rotate(5deg) } }

/* item-olivia-ring – warm, dim interior */
.scn-item-olivia-ring {
  background: 
    linear-gradient(180deg, #2a1a0a 0%, #4a3020 30%, #3a2010 100%),
    radial-gradient(ellipse at 50% 50%, #6a4a2a 0%, transparent 80%);
}
.scn-item-olivia-ring .velvet-cushion {
  position: absolute; bottom: 10%; left: 50%; width: 120px; height: 70px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #5a2a2a 0%, #3a1a1a 100%);
  border-radius: 30% 30% 40% 40% / 40% 40% 30% 30%;
  box-shadow: 0 6px 20px rgba(0,0,0,.5);
  animation: oh4-velv 10s ease-in-out infinite alternate;
}
.scn-item-olivia-ring .ring-band {
  position: absolute; bottom: 24%; left: 50%; width: 40px; height: 14px;
  transform: translateX(-50%);
  background: linear-gradient(90deg, #b08040 0%, #e0b060 30%, #b08040 100%);
  border-radius: 30% 30% 10% 10%;
  box-shadow: 0 2px 8px rgba(0,0,0,.4);
  animation: oh4-band 6s ease-in-out infinite alternate;
}
.scn-item-olivia-ring .gem-stone {
  position: absolute; bottom: 30%; left: 50%; width: 16px; height: 12px;
  transform: translateX(-50%);
  background: radial-gradient(circle at 30% 30%, #80c8e8 0%, #2068a0 100%);
  border-radius: 40% 40% 30% 30%;
  box-shadow: 0 0 12px 4px rgba(64,160,200,.4);
  animation: oh4-gem 3s ease-in-out infinite alternate;
}
.scn-item-olivia-ring .glow-halo {
  position: absolute; bottom: 22%; left: 50%; width: 70px; height: 50px;
  transform: translateX(-50%);
  background: radial-gradient(circle, rgba(200,180,100,.15) 0%, transparent 70%);
  animation: oh4-halo 4s ease-in-out infinite alternate;
}
.scn-item-olivia-ring .finger-hint {
  position: absolute; bottom: 20%; left: 40%; width: 12px; height: 30px;
  background: linear-gradient(180deg, #7a5a3a 0%, #4a3020 100%);
  border-radius: 30% 30% 20% 20%;
  transform: rotate(-15deg);
  animation: oh4-fing 5s ease-in-out infinite;
}
.scn-item-olivia-ring .table-edge {
  position: absolute; bottom: 0; left: 0; right: 0; height: 6%;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a120a 100%);
  box-shadow: 0 -2px 6px rgba(0,0,0,.3);
}
.scn-item-olivia-ring .shadow-drop {
  position: absolute; bottom: 5%; left: 50%; width: 100px; height: 20px;
  transform: translateX(-50%);
  background: radial-gradient(ellipse, rgba(0,0,0,.4) 0%, transparent 80%);
  animation: oh4-drop 8s ease-in-out infinite alternate;
}
@keyframes oh4-velv { 0%,100%{ transform:translateX(-50%) scaleY(1) } 50%{ transform:translateX(-50%) scaleY(1.02) } }
@keyframes oh4-band { 0%{ transform:translateX(-50%) rotate(0deg) } 100%{ transform:translateX(-50%) rotate(5deg) } }
@keyframes oh4-gem { 0%{ opacity:.7; transform:translateX(-50%) scale(1) } 100%{ opacity:1; transform:translateX(-50%) scale(1.1) } }
@keyframes oh4-halo { 0%{ opacity:.3; transform:translateX(-50%) scale(1) } 100%{ opacity:.6; transform:translateX(-50%) scale(1.2) } }
@keyframes oh4-fing { 0%,100%{ transform:rotate(-15deg) translateY(0) } 50%{ transform:rotate(-10deg) translateY(-2px) } }
@keyframes oh4-drop { 0%{ opacity:.5; transform:translateX(-50%) scaleX(1) } 100%{ opacity:.8; transform:translateX(-50%) scaleX(1.1) } }

.scn-orsino-resolves {
  background: linear-gradient(180deg, #eeddcc 0%, #d4c4a8 40%, #bfa88a 100%),
              radial-gradient(ellipse at 50% 0%, #fff5e6 0%, transparent 60%);
}
.scn-orsino-resolves .wall { position:absolute; inset:0; background: linear-gradient(180deg, #e6d5c0 0%, #c4b096 100%); }
.scn-orsino-resolves .window { position:absolute; top:8%; left:60%; width:30%; height:45%; background: linear-gradient(135deg, #fff8ee 0%, #e6dac8 100%); border-radius: 10% 10% 5% 5%; box-shadow: inset 0 0 40px rgba(255,240,215,0.6); animation: or1-light 6s ease-in-out infinite alternate; }
.scn-orsino-resolves .sunbeam { position:absolute; top:20%; left:55%; width:40%; height:60%; background: linear-gradient(135deg, rgba(255,245,220,0.3) 0%, transparent 100%); transform: skewX(-10deg); animation: or1-glow 4s ease-in-out infinite alternate; }
.scn-orsino-resolves .figure-left { position:absolute; bottom:22%; left:25%; width:12%; height:45%; background: linear-gradient(180deg, #4a3b2f 0%, #2f2218 100%); border-radius: 40% 40% 35% 35% / 60% 60% 40% 40%; transform-origin: bottom center; animation: or1-bow 8s ease-in-out infinite; }
.scn-orsino-resolves .figure-right { position:absolute; bottom:22%; right:25%; width:11%; height:44%; background: linear-gradient(180deg, #5c4a3a 0%, #3a2e22 100%); border-radius: 40% 40% 35% 35% / 60% 60% 40% 40%; transform-origin: bottom center; animation: or1-bow 8s ease-in-out infinite reverse; }
.scn-orsino-resolves .table { position:absolute; bottom:18%; left:38%; width:24%; height:6%; background: linear-gradient(180deg, #8b7355 0%, #6b553d 100%); border-radius: 5%; box-shadow: 0 4px 10px rgba(0,0,0,0.3); }
.scn-orsino-resolves .candle { position:absolute; bottom:24%; left:46%; width:2%; height:8%; background: linear-gradient(180deg, #f5e6c8 0%, #d4ba94 100%); border-radius: 30% 30% 20% 20%; }
.scn-orsino-resolves .glow { position:absolute; bottom:24%; left:44%; width:6%; height:6%; background: radial-gradient(circle, #ffd080 0%, transparent 70%); border-radius:50%; animation: or1-flicker 2s ease-in-out infinite alternate; }

@keyframes or1-light { 0% { opacity:0.8; box-shadow: inset 0 0 30px rgba(255,240,215,0.4); } 50% { opacity:1; box-shadow: inset 0 0 60px rgba(255,240,215,0.7); } 100% { opacity:0.85; box-shadow: inset 0 0 35px rgba(255,240,215,0.5); } }
@keyframes or1-glow { 0% { opacity:0.2; transform: skewX(-10deg) scaleY(1); } 100% { opacity:0.5; transform: skewX(-10deg) scaleY(1.1); } }
@keyframes or1-bow { 0% { transform: translateY(0) rotate(0deg); } 25% { transform: translateY(-2px) rotate(2deg); } 50% { transform: translateY(0) rotate(0deg); } 75% { transform: translateY(-2px) rotate(-2deg); } 100% { transform: translateY(0) rotate(0deg); } }
@keyframes or1-flicker { 0% { opacity:0.7; box-shadow: 0 0 20px 4px #f0c070, 0 0 40px 8px rgba(240,192,112,0.3); } 100% { opacity:1; box-shadow: 0 0 30px 8px #ffd080, 0 0 60px 12px rgba(255,208,128,0.4); } }

.scn-item-maiden-weeds {
  background: linear-gradient(180deg, #e8dfce 0%, #cdc2ad 40%, #b8aa94 100%),
              radial-gradient(ellipse at 50% 20%, #fff5e0 0%, transparent 70%);
}
.scn-item-maiden-weeds .bg-floral { position:absolute; inset:0; background: linear-gradient(180deg, #d6c9b8 0%, #bfb09c 100%); }
.scn-item-maiden-weeds .vine { position:absolute; top:0; left:20%; width:60%; height:100%; background: linear-gradient(180deg, rgba(100,130,80,0.3) 0%, transparent 100%); border-radius: 50% 50% 40% 40%; animation: mw2-vine 15s ease-in-out infinite; }
.scn-item-maiden-weeds .figure-center { position:absolute; bottom:22%; left:38%; width:16%; height:48%; background: linear-gradient(180deg, #4a3c2e 0%, #2f231a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mw2-sway 6s ease-in-out infinite; }
.scn-item-maiden-weeds .garland { position:absolute; top:45%; left:35%; width:20%; height:8%; background: linear-gradient(90deg, #a08060 0%, #806040 100%); border-radius: 50%; transform: rotate(-15deg); animation: mw2-garland 8s ease-in-out infinite alternate; }
.scn-item-maiden-weeds .letter { position:absolute; bottom:40%; left:42%; width:10%; height:12%; background: linear-gradient(135deg, #f0e0c0 0%, #d4c4a0 100%); border-radius: 5%; box-shadow: 2px 2px 4px rgba(0,0,0,0.2); animation: mw2-letter 5s ease-in-out infinite; }
.scn-item-maiden-weeds .hand-left { position:absolute; bottom:32%; left:36%; width:4%; height:10%; background: linear-gradient(180deg, #d4b894 0%, #bfa080 100%); border-radius: 40% 40% 30% 30%; transform: rotate(15deg); animation: mw2-hand 4s ease-in-out infinite alternate; }
.scn-item-maiden-weeds .hand-right { position:absolute; bottom:32%; right:36%; width:4%; height:10%; background: linear-gradient(180deg, #d4b894 0%, #bfa080 100%); border-radius: 40% 40% 30% 30%; transform: rotate(-15deg); animation: mw2-hand 4s ease-in-out infinite alternate-reverse; }
.scn-item-maiden-weeds .petal { position:absolute; top:30%; left:50%; width:3%; height:3%; background: radial-gradient(circle, #e0c0a0 0%, transparent 100%); border-radius: 50%; animation: mw2-petal 6s ease-in-out infinite; }

@keyframes mw2-vine { 0% { transform: scaleX(1) rotate(-2deg); } 50% { transform: scaleX(1.05) rotate(2deg); } 100% { transform: scaleX(1) rotate(-2deg); } }
@keyframes mw2-sway { 0% { transform: translateY(0) rotate(0deg); } 25% { transform: translateY(-2px) rotate(2deg); } 50% { transform: translateY(0) rotate(0deg); } 75% { transform: translateY(-2px) rotate(-2deg); } 100% { transform: translateY(0) rotate(0deg); } }
@keyframes mw2-garland { 0% { transform: rotate(-15deg) translateY(0); } 100% { transform: rotate(-10deg) translateY(-3px); } }
@keyframes mw2-letter { 0% { transform: scale(1) rotate(0deg); } 50% { transform: scale(1.05) rotate(3deg); } 100% { transform: scale(1) rotate(0deg); } }
@keyframes mw2-hand { 0% { transform: rotate(10deg) translateY(0); } 100% { transform: rotate(20deg) translateY(-2px); } }
@keyframes mw2-petal { 0% { opacity:0; transform: translateY(0) scale(0.5); } 50% { opacity:0.7; transform: translateY(-20px) scale(1); } 100% { opacity:0; transform: translateY(-40px) scale(0.5); } }

.scn-item-letter-intro {
  background: linear-gradient(180deg, #e8dcc8 0%, #d4c4aa 40%, #bca88c 100%),
              radial-gradient(ellipse at 50% 30%, #fff0d0 0%, transparent 60%);
}
.scn-item-letter-intro .stage-back { position:absolute; inset:0; background: linear-gradient(180deg, #d9cdb8 0%, #c0b098 100%); }
.scn-item-letter-intro .clown-body { position:absolute; bottom:20%; left:30%; width:18%; height:50%; background: linear-gradient(180deg, #d05030 0%, #a83820 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: li3-bounce 2s ease-in-out infinite; }
.scn-item-letter-intro .clown-hat { position:absolute; top:20%; left:33%; width:12%; height:8%; background: linear-gradient(180deg, #306030 0%, #1a3a1a 100%); border-radius: 50% 50% 20% 20%; transform: rotate(-10deg); animation: li3-hat 2s ease-in-out infinite alternate; }
.scn-item-letter-intro .letter-big { position:absolute; bottom:40%; left:45%; width:15%; height:20%; background: linear-gradient(135deg, #f0d8b0 0%, #e0c898 100%); border-radius: 5%; box-shadow: 4px 4px 8px rgba(0,0,0,0.2); animation: li3-letter 3s ease-in-out infinite; }
.scn-item-letter-intro .jester-staff { position:absolute; bottom:25%; left:20%; width:4%; height:40%; background: linear-gradient(180deg, #a08040 0%, #806020 100%); border-radius: 20%; transform: rotate(15deg); animation: li3-staff 4s ease-in-out infinite alternate; }
.scn-item-letter-intro .confetti-1 { position:absolute; top:10%; left:10%; width:4%; height:4%; background: radial-gradient(circle, #e0a020 0%, transparent 100%); border-radius: 50%; animation: li3-confetti 6s linear infinite; }
.scn-item-letter-intro .confetti-2 { position:absolute; top:15%; right:15%; width:3%; height:3%; background: radial-gradient(circle, #2080a0 0%, transparent 100%); border-radius: 50%; animation: li3-confetti 6s linear infinite 3s; }
.scn-item-letter-intro .bounce-shadow { position:absolute; bottom:18%; left:30%; width:18%; height:2%; background: radial-gradient(ellipse, rgba(0,0,0,0.3) 0%, transparent 100%); animation: li3-shadow 2s ease-in-out infinite; }

@keyframes li3-bounce { 0% { transform: translateY(0) scaleY(1); } 25% { transform: translateY(-8px) scaleY(0.95); } 50% { transform: translateY(0) scaleY(1); } 75% { transform: translateY(-5px) scaleY(0.97); } 100% { transform: translateY(0) scaleY(1); } }
@keyframes li3-hat { 0% { transform: rotate(-10deg) translateY(0); } 100% { transform: rotate(10deg) translateY(-4px); } }
@keyframes li3-letter { 0% { transform: scale(1) rotate(0deg); } 50% { transform: scale(1.1) rotate(10deg); } 100% { transform: scale(1) rotate(0deg); } }
@keyframes li3-staff { 0% { transform: rotate(10deg) translateY(0); } 100% { transform: rotate(20deg) translateY(-5px); } }
@keyframes li3-confetti { 0% { transform: translateY(0) rotate(0deg) scale(1); } 100% { transform: translateY(-80px) rotate(360deg) scale(0); } }
@keyframes li3-shadow { 0% { transform: scaleX(1); opacity:0.5; } 50% { transform: scaleX(0.8); opacity:0.3; } 100% { transform: scaleX(1); opacity:0.5; } }

.scn-item-letter-conclusion {
  background: linear-gradient(180deg, #2a2a2e 0%, #1e1e22 50%, #121216 100%),
              radial-gradient(ellipse at 50% 50%, #3a3a4a 0%, transparent 70%);
}
.scn-item-letter-conclusion .wall-dark { position:absolute; inset:0; background: linear-gradient(180deg, #2a2c30 0%, #16181a 100%); }
.scn-item-letter-conclusion .figure-malvolio { position:absolute; bottom:20%; left:35%; width:18%; height:55%; background: linear-gradient(180deg, #2a2a30 0%, #121216 100%); border-radius: 45% 45% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: lc4-tremble 2s ease-in-out infinite; }
.scn-item-letter-conclusion .letter-crumpled { position:absolute; bottom:40%; left:43%; width:12%; height:14%; background: linear-gradient(135deg, #c8b898 0%, #a89878 100%); border-radius: 10%; box-shadow: inset 2px 2px 4px rgba(0,0,0,0.4); animation: lc4-crumple 3s ease-in-out infinite; }
.scn-item-letter-conclusion .chair { position:absolute; bottom:18%; left:30%; width:25%; height:8%; background: linear-gradient(180deg, #4a3a2a 0%, #2a2018 100%); border-radius: 10%; }
.scn-item-letter-conclusion .candle-sharp { position:absolute; bottom:25%; left:40%; width:2%; height:10%; background: linear-gradient(180deg, #f0e0a0 0%, #c8b070 100%); border-radius: 20%; animation: lc4-flicker 1.5s ease-in-out infinite alternate; }
.scn-item-letter-conclusion .shadow-flicker { position:absolute; inset:0; background: linear-gradient(135deg, rgba(0,0,0,0.3) 0%, transparent 50%), radial-gradient(ellipse at 40% 25%, rgba(0,0,0,0.6) 0%, transparent 50%); animation: lc4-shadow 2s ease-in-out infinite alternate; }
.scn-item-letter-conclusion .tear { position:absolute; top:45%; left:53%; width:3%; height:4%; background: radial-gradient(circle, #a0b8d0 0%, transparent 100%); border-radius: 50%; animation: lc4-tear 4s ease-in-out infinite; }

@keyframes lc4-tremble { 0% { transform: translateX(0) rotate(0deg); } 25% { transform: translateX(-1px) rotate(0.5deg); } 50% { transform: translateX(0) rotate(0deg); } 75% { transform: translateX(1px) rotate(-0.5deg); } 100% { transform: translateX(0) rotate(0deg); } }
@keyframes lc4-crumple { 0% { transform: scale(1) rotate(0deg); } 50% { transform: scale(1.05) rotate(5deg); } 100% { transform: scale(1) rotate(0deg); } }
@keyframes lc4-flicker { 0% { opacity:0.6; box-shadow: 0 0 10px 2px #f0d080; } 100% { opacity:1; box-shadow: 0 0 20px 6px #f0d080; } }
@keyframes lc4-shadow { 0% { opacity:0.3; } 100% { opacity:0.7; } }
@keyframes lc4-tear { 0% { opacity:0; transform: translateY(0); } 30% { opacity:0.8; } 100% { opacity:0; transform: translateY(20px); } }

/* Scene: duke-proposes-to-viola (warm + bright interior) */
.scn-duke-proposes-to-viola {
  background: linear-gradient(180deg, #f5e6c8 0%, #e8d5a3 100%),
              radial-gradient(ellipse at 50% 100%, #ffe9b0 0%, transparent 70%);
}
.scn-duke-proposes-to-viola .bg-wall {
  position: absolute;
  inset: 0 0 40% 0;
  background: linear-gradient(90deg, #e8d5a3 0%, #f2e2b8 50%, #dcc99a 100%);
  box-shadow: inset 0 0 40px rgba(200,170,120,0.4);
}
.scn-duke-proposes-to-viola .floor {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 40%;
  background: linear-gradient(180deg, #c4a87a 0%, #a8875e 100%);
  border-radius: 20% 20% 0 0 / 10% 10% 0 0;
}
.scn-duke-proposes-to-viola .window {
  position: absolute;
  top: 10%; left: 30%;
  width: 120px; height: 160px;
  background: radial-gradient(ellipse at 50% 50%, #fff8e0 0%, #ccbb88 100%);
  border: 6px solid #8a6f4a;
  border-radius: 4px;
  box-shadow: inset 0 0 30px rgba(255,240,180,0.6);
}
.scn-duke-proposes-to-viola .sunbeam {
  position: absolute;
  top: 12%; left: 34%;
  width: 80px; height: 200px;
  background: linear-gradient(135deg, rgba(255,240,180,0.1) 0%, rgba(255,240,180,0.4) 50%, transparent 100%);
  transform: rotate(30deg);
  animation: dpv-beam 6s ease-in-out infinite alternate;
}
.scn-duke-proposes-to-viola .figure-duke {
  position: absolute;
  bottom: 32%; left: 25%;
  width: 40px; height: 100px;
  background: linear-gradient(180deg, #6b4a2a 0%, #3f2a12 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  transform-origin: bottom center;
  animation: dpv-bow 4s ease-in-out infinite;
}
.scn-duke-proposes-to-viola .figure-viola {
  position: absolute;
  bottom: 32%; right: 25%;
  width: 36px; height: 96px;
  background: linear-gradient(180deg, #a07040 0%, #704828 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  transform-origin: bottom center;
  animation: dpv-curtsy 5s ease-in-out infinite;
}
.scn-duke-proposes-to-viola .table {
  position: absolute;
  bottom: 28%; left: 50%;
  width: 80px; height: 30px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #8a6f4a 0%, #5a4528 100%);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.3);
}
@keyframes dpv-beam {
  0% { opacity: 0.1; transform: rotate(30deg) scaleX(1); }
  50% { opacity: 0.4; transform: rotate(32deg) scaleX(1.1); }
  100% { opacity: 0.2; transform: rotate(28deg) scaleX(1); }
}
@keyframes dpv-bow {
  0%,100% { transform: translateX(0) rotate(0); }
  50% { transform: translateX(4px) rotate(6deg); }
}
@keyframes dpv-curtsy {
  0%,100% { transform: translateX(0) rotate(0) scaleY(1); }
  50% { transform: translateX(-3px) rotate(-4deg) scaleY(0.95); }
}

/* Scene: malvolio-accusation (tense + bright interior) */
.scn-malvolio-accusation {
  background: linear-gradient(90deg, #d4c4a0 0%, #c8b890 50%, #d4c4a0 100%),
              radial-gradient(ellipse at 50% 0%, #f0e0c0 0%, transparent 60%);
}
.scn-malvolio-accusation .bg-wall {
  position: absolute;
  inset: 0 0 30% 0;
  background: linear-gradient(180deg, #d4c4a0 0%, #c0b088 100%);
  box-shadow: inset 0 0 30px rgba(160,130,80,0.5);
}
.scn-malvolio-accusation .floor {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 30%;
  background: linear-gradient(180deg, #a08860 0%, #806840 100%);
  border-radius: 30% 30% 0 0 / 20% 20% 0 0;
}
.scn-malvolio-accusation .shadow-stripe {
  position: absolute;
  top: 10%; left: 50%;
  width: 20px; height: 60%;
  background: rgba(0,0,0,0.15);
  transform: skewX(-10deg);
  animation: ma-shiver 1.5s ease-in-out infinite;
}
.scn-malvolio-accusation .figure-malvolio {
  position: absolute;
  bottom: 22%; left: 35%;
  width: 38px; height: 110px;
  background: linear-gradient(180deg, #4a3a28 0%, #2a1e14 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ma-tremble 1.6s ease-in-out infinite;
}
.scn-malvolio-accusation .figure-olivia {
  position: absolute;
  bottom: 22%; left: 55%;
  width: 34px; height: 100px;
  background: linear-gradient(180deg, #805828 0%, #50381a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ma-stepback 3s ease-in-out infinite;
}
.scn-malvolio-accusation .figure-fabian {
  position: absolute;
  bottom: 22%; left: 15%;
  width: 32px; height: 90px;
  background: linear-gradient(180deg, #705038 0%, #483020 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ma-look 4s ease-in-out infinite;
}
.scn-malvolio-accusation .letter {
  position: absolute;
  bottom: 35%; left: 42%;
  width: 30px; height: 20px;
  background: linear-gradient(135deg, #f0e0c0 0%, #d4c090 100%);
  border: 1px solid #a08860;
  border-radius: 2px;
  transform: rotate(15deg);
  animation: ma-shake 1.5s ease-in-out infinite;
}
@keyframes ma-shiver {
  0% { transform: skewX(-10deg) translateY(0); }
  25% { transform: skewX(-12deg) translateY(-1px); }
  50% { transform: skewX(-8deg) translateY(0); }
  75% { transform: skewX(-11deg) translateY(1px); }
  100% { transform: skewX(-10deg) translateY(0); }
}
@keyframes ma-tremble {
  0% { transform: translateX(0) rotate(0); }
  25% { transform: translateX(1px) rotate(1deg); }
  50% { transform: translateX(-1px) rotate(-1deg); }
  75% { transform: translateX(2px) rotate(0); }
  100% { transform: translateX(0) rotate(0); }
}
@keyframes ma-stepback {
  0%,100% { transform: translateX(0); }
  50% { transform: translateX(-8px); }
}
@keyframes ma-look {
  0%,100% { transform: rotate(0); }
  30% { transform: rotate(10deg); }
  70% { transform: rotate(-5deg); }
}
@keyframes ma-shake {
  0% { transform: rotate(15deg) translateX(0); }
  25% { transform: rotate(18deg) translateX(2px); }
  50% { transform: rotate(12deg) translateX(-1px); }
  75% { transform: rotate(17deg) translateX(1px); }
  100% { transform: rotate(15deg) translateX(0); }
}

/* Scene: olivia-explains (calm + bright interior) */
.scn-olivia-explains {
  background: linear-gradient(180deg, #e8dcc8 0%, #d8ccb0 100%),
              radial-gradient(ellipse at 50% 100%, #f2e8d0 0%, transparent 60%);
}
.scn-olivia-explains .bg-room {
  position: absolute;
  inset: 0 0 35% 0;
  background: linear-gradient(90deg, #d8ccb0 0%, #e4d8c0 50%, #cec2a4 100%);
  box-shadow: inset 0 0 30px rgba(180,160,130,0.3);
}
.scn-olivia-explains .floor {
  position: absolute;
  bottom: 0; left: 0; right: 0;
  height: 35%;
  background: linear-gradient(180deg, #b09878 0%, #907050 100%);
  border-radius: 30% 30% 0 0 / 15% 15% 0 0;
}
.scn-olivia-explains .window-soft {
  position: absolute;
  top: 15%; left: 25%;
  width: 100px; height: 130px;
  background: radial-gradient(ellipse at 50% 50%, #fff5e0 0%, #ddccaa 100%);
  border: 4px solid #a08060;
  border-radius: 6px;
  box-shadow: inset 0 0 40px rgba(255,240,200,0.4);
  animation: oe-glow 8s ease-in-out infinite alternate;
}
.scn-olivia-explains .figure-olivia {
  position: absolute;
  bottom: 25%; left: 40%;
  width: 36px; height: 100px;
  background: linear-gradient(180deg, #906838 0%, #604828 100%);
  border-radius: 50% 50% 35% 35% / 60% 60% 35% 35%;
  transform-origin: bottom center;
  animation: oe-speak 6s ease-in-out infinite;
}
.scn-olivia-explains .figure-maria {
  position: absolute;
  bottom: 25%; right: 30%;
  width: 32px; height: 90px;
  background: linear-gradient(180deg, #785838 0%, #503820 100%);
  border-radius: 50% 50% 35% 35% / 60% 60% 35% 35%;
  transform-origin: bottom center;
  animation: oe-nod 7s ease-in-out infinite;
}
.scn-olivia-explains .chair {
  position: absolute;
  bottom: 20%; left: 55%;
  width: 50px; height: 60px;
  background: linear-gradient(180deg, #a08050 0%, #806840 100%);
  border-radius: 8% 8% 4% 4% / 20% 20% 10% 10%;
  box-shadow: inset 0 -4px 8px rgba(0,0,0,0.2);
  animation: oe-sway 10s ease-in-out infinite;
}
.scn-olivia-explains .curtain {
  position: absolute;
  top: 10%; right: 20%;
  width: 40px; height: 140px;
  background: linear-gradient(180deg, #b08858 0%, #886848 100%);
  border-radius: 0 0 40% 40% / 0 0 20% 20%;
  animation: oe-drape 12s ease-in-out infinite;
}
@keyframes oe-glow {
  0% { opacity: 0.7; box-shadow: inset 0 0 30px rgba(255,240,200,0.3); }
  50% { opacity: 1; box-shadow: inset 0 0 50px rgba(255,240,200,0.6); }
  100% { opacity: 0.8; box-shadow: inset 0 0 35px rgba(255,240,200,0.4); }
}
@keyframes oe-speak {
  0%,100% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-2px) rotate(2deg); }
}
@keyframes oe-nod {
  0%,100% { transform: rotate(0); }
  25% { transform: rotate(4deg); }
  75% { transform: rotate(-2deg); }
}
@keyframes oe-sway {
  0%,100% { transform: translateX(0) rotate(0); }
  50% { transform: translateX(3px) rotate(1deg); }
}
@keyframes oe-drape {
  0%,100% { transform: scaleX(1) translateY(0); }
  50% { transform: scaleX(0.95) translateY(5px); }
}

/* Scene: fabian-confesses (tense + bright interior) */
.scn-fabian-confesses {
  background: linear-gradient(90deg, #d0c0a0 0%, #c0b090 50%, #d0c0a0 100%),
              radial-gradient(ellipse at 50% 50%, #f0e0c0 0%, transparent 70%);
}
.scn-fabian-confesses .bg-dark {
  position: absolute;
  inset: 0 0 30% 0;
  background: linear-gradient(180deg, #c0b090 0%, #a89878 100%);
  box-shadow: inset 0 0 60px rgba(80,60,40,0.6);
}
.scn-fabian-confesses .spotlight {
  position: absolute;
  top: 10%; left: 35%;
  width: 120px; height: 200px;
  background: radial-gradient(ellipse at 50% 0%, rgba(255,240,200,0.6) 0%, transparent 100%);
  animation: fc-flicker 1.6s ease-in-out infinite;
}
.scn-fabian-confesses .figure-fabian {
  position: absolute;
  bottom: 22%; left: 45%;
  width: 36px; height: 100px;
  background: linear-gradient(180deg, #2a1e14 0%, #0e0a06 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: fc-bowshame 4s ease-in-out infinite;
}
.scn-fabian-confesses .figure-toby {
  position: absolute;
  bottom: 22%; left: 25%;
  width: 40px; height: 100px;
  background: linear-gradient(180deg, #4a3820 0%, #2e2010 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: fc-turn 5s ease-in-out infinite;
}
.scn-fabian-confesses .figure-maria {
  position: absolute;
  bottom: 22%; right: 25%;
  width: 32px; height: 90px;
  background: linear-gradient(180deg, #604828 0%, #3a2818 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: fc-watch 6s ease-in-out infinite;
}
.scn-fabian-confesses .shadow-bar {
  position: absolute;
  top: 20%; left: 0; right: 0;
  height: 10px;
  background: linear-gradient(90deg, transparent 0%, rgba(0,0,0,0.3) 30%, transparent 70%);
  animation: fc-sweep 8s ease-in-out infinite;
}
@keyframes fc-flicker {
  0% { opacity: 0.5; transform: scale(1); }
  25% { opacity: 0.8; transform: scale(1.02); }
  50% { opacity: 0.6; transform: scale(0.98); }
  75% { opacity: 0.9; transform: scale(1.01); }
  100% { opacity: 0.5; transform: scale(1); }
}
@keyframes fc-bowshame {
  0%,100% { transform: translateX(0) rotate(0); }
  50% { transform: translateX(-3px) rotate(8deg); }
}
@keyframes fc-turn {
  0%,100% { transform: rotate(0); }
  25% { transform: rotate(-15deg); }
  75% { transform: rotate(10deg); }
}
@keyframes fc-watch {
  0%,100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@keyframes fc-sweep {
  0% { transform: translateX(-20px); opacity: 0.3; }
  50% { transform: translateX(20px); opacity: 0.6; }
  100% { transform: translateX(-20px); opacity: 0.3; }
}

.scn-priest-arrival { background: linear-gradient(180deg, #f5e6c8 0%, #dfc9a3 60%, #b89a72 100%), radial-gradient(ellipse at 70% 30%, #fff6e6 0%, transparent 70%); }
.scn-priest-arrival .bg-wall { position:absolute; inset:0; background: linear-gradient(180deg, #f0dfc8 0%, #d4bba0 100%); }
.scn-priest-arrival .doorway { position:absolute; bottom:10%; left:50%; width:120px; height:90%; transform:translateX(-50%); background: linear-gradient(180deg, #6b4d32 0%, #3e2b1a 100%); border-radius: 30% 30% 0 0; box-shadow: inset -8px 0 12px rgba(0,0,0,.3); animation: pa-door 10s ease-in-out infinite alternate; }
.scn-priest-arrival .priest  { position:absolute; bottom:18%; left:50%; width:28px; height:70px; transform:translateX(-50%); background: linear-gradient(180deg, #c8a88a 0%, #8b6950 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; box-shadow: 0 4px 6px rgba(0,0,0,.3); animation: pa-priest 6s ease-in-out infinite; }
.scn-priest-arrival .window { position:absolute; top:12%; left:25%; width:60px; height:80px; background: linear-gradient(135deg, #fce9c8 0%, #e8c892 100%); border: 6px solid #8a6a4a; border-radius: 4px; box-shadow: 0 0 30px 8px rgba(252,233,200,.4), inset 0 0 20px #fff3e0; animation: pa-window 8s ease-in-out infinite alternate; }
.scn-priest-arrival .candle-glow { position:absolute; bottom:30%; left:35%; width:10px; height:14px; background: radial-gradient(circle, #ffde80 0%, #e8a830 60% transparent); border-radius: 50%; box-shadow: 0 0 40px 20px rgba(255,222,128,.6), 0 0 80px 40px rgba(232,168,48,.3); animation: pa-candle 3s ease-in-out infinite; }
.scn-priest-arrival .table { position:absolute; bottom:14%; left:30%; width:60px; height:10px; background: linear-gradient(180deg, #a4885a 0%, #7a6040 100%); border-radius: 2px; box-shadow: 0 4px 6px rgba(0,0,0,.4); }
.scn-priest-arrival .staff { position:absolute; bottom:25%; left:58%; width:4px; height:50px; background: linear-gradient(180deg, #6b4d32 0%, #3e2b1a 100%); border-radius: 2px; transform-origin: bottom center; animation: pa-staff 5s ease-in-out infinite; }
@keyframes pa-door { 0% { opacity:.95 } 50% { opacity:1 } 100% { opacity:.9 } }
@keyframes pa-priest { 0% { transform: translateX(-50%) translateY(0) rotate(-1deg) } 50% { transform: translateX(-50%) translateY(-3px) rotate(1deg) } 100% { transform: translateX(-50%) translateY(0) rotate(0) } }
@keyframes pa-window { 0% { box-shadow: 0 0 20px 4px rgba(252,233,200,.3) } 50% { box-shadow: 0 0 40px 12px rgba(252,233,200,.6) } 100% { box-shadow: 0 0 25px 6px rgba(252,233,200,.4) } }
@keyframes pa-candle { 0% { transform: scaleY(1) rotate(-2deg) } 30% { transform: scaleY(1.1) rotate(2deg) } 60% { transform: scaleY(.95) rotate(-1deg) } 100% { transform: scaleY(1) rotate(0) } }
@keyframes pa-staff { 0% { transform: rotate(-5deg) } 50% { transform: rotate(3deg) } 100% { transform: rotate(-2deg) } }

.scn-orsino-anger { background: linear-gradient(180deg, #1e1b2a 0%, #2c2740 40%, #3d3658 100%), radial-gradient(ellipse at 60% 40%, #4a4060 0%, transparent 70%); }
.scn-orsino-anger .bg-shadow { position:absolute; inset:0; background: linear-gradient(180deg, #1a1730 0%, #2a2444 100%); }
.scn-orsino-anger .figure-orsino { position:absolute; bottom:15%; left:45%; width:32px; height:80px; transform:translateX(-50%); background: linear-gradient(180deg, #403a5a 0%, #1e1b2e 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; box-shadow: 0 6px 10px rgba(0,0,0,.5); animation: oa-figure 5s ease-in-out infinite; }
.scn-orsino-anger .arm { position:absolute; bottom:40%; left:38%; width:6px; height:40px; transform-origin: top center; background: linear-gradient(180deg, #5a4a6a 0%, #2a1e3a 100%); border-radius: 40%; box-shadow: -4px 0 6px rgba(0,0,0,.4); animation: oa-arm 3s ease-in-out infinite; }
.scn-orsino-anger .cloak { position:absolute; bottom:18%; left:35%; width:50px; height:60px; background: linear-gradient(180deg, #4a3a5a 0%, #1a122a 100%); border-radius: 60% 40% 50% 50%; transform: rotate(-10deg); box-shadow: 0 4px 8px rgba(0,0,0,.6); animation: oa-cloak 7s ease-in-out infinite; }
.scn-orsino-anger .curtain-left { position:absolute; top:0; left:0; width:25%; height:100%; background: linear-gradient(90deg, #5a2a3a 0%, #3a1a2a 100%); border-radius: 0 60% 60% 0; transform-origin: left; animation: oa-curtain 12s ease-in-out infinite alternate; }
.scn-orsino-anger .curtain-right { position:absolute; top:0; right:0; width:25%; height:100%; background: linear-gradient(90deg, #3a1a2a 0%, #5a2a3a 100%); border-radius: 60% 0 0 60%; transform-origin: right; animation: oa-curtain-rev 12s ease-in-out infinite alternate; }
.scn-orsino-anger .floor { position:absolute; bottom:0; left:0; right:0; height:15%; background: linear-gradient(180deg, #2a2440 0%, #1a1730 100%); box-shadow: inset 0 8px 20px rgba(0,0,0,.4); }
@keyframes oa-figure { 0% { transform: translateX(-50%) translateY(0) rotate(-2deg) } 50% { transform: translateX(-50%) translateY(-4px) rotate(2deg) } 100% { transform: translateX(-50%) translateY(0) rotate(-1deg) } }
@keyframes oa-arm { 0% { transform: rotate(30deg) } 50% { transform: rotate(-20deg) } 100% { transform: rotate(10deg) } }
@keyframes oa-cloak { 0% { transform: rotate(-10deg) translateY(0) } 50% { transform: rotate(-5deg) translateY(-2px) } 100% { transform: rotate(-12deg) translateY(0) } }
@keyframes oa-curtain { 0% { transform: scaleX(1) } 50% { transform: scaleX(.92) } 100% { transform: scaleX(1) } }
@keyframes oa-curtain-rev { 0% { transform: scaleX(1) } 50% { transform: scaleX(.92) } 100% { transform: scaleX(1) } }

.scn-sir-andrew-complaint { background: linear-gradient(180deg, #f8e8a0 0%, #f0d48a 50%, #d4b470 100%), radial-gradient(ellipse at 50% 80%, #ffeeb0 0%, transparent 70%); }
.scn-sir-andrew-complaint .bg-comic { position:absolute; inset:0; background: linear-gradient(180deg, #fcefa8 0%, #e8d48a 100%); }
.scn-sir-andrew-complaint .figure-sir-andrew { position:absolute; bottom:15%; left:50%; width:30px; height:72px; transform:translateX(-50%); background: linear-gradient(180deg, #c8a88a 0%, #8b6950 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; box-shadow: 0 4px 6px rgba(0,0,0,.3); animation: sa-figure 4s ease-in-out infinite; }
.scn-sir-andrew-complaint .head-wrap { position:absolute; bottom:68%; left:50%; width:24px; height:28px; transform:translateX(-50%); background: linear-gradient(180deg, #e0b890 0%, #c08a60 100%); border-radius: 50% 50% 40% 40%; box-shadow: 0 0 0 4px #8b6950; animation: sa-head 3s ease-in-out infinite; }
.scn-sir-andrew-complaint .arm-holding { position:absolute; bottom:34%; left:55%; width:6px; height:32px; background: linear-gradient(180deg, #c8a88a 0%, #8b6950 100%); border-radius: 40%; transform-origin: top center; animation: sa-arm 2s ease-in-out infinite; }
.scn-sir-andrew-complaint .coxcomb { position:absolute; bottom:80%; left:50%; width:14px; height:8px; transform:translateX(-50%); background: radial-gradient(circle, #c8553d 0%, #a0461a 80%); border-radius: 50%; box-shadow: 0 2px 6px rgba(160,70,26,.5); animation: sa-coxcomb 5s ease-in-out infinite; }
.scn-sir-andrew-complaint .floor { position:absolute; bottom:0; left:0; right:0; height:15%; background: linear-gradient(180deg, #d4b470 0%, #b89a60 100%); box-shadow: inset 0 6px 10px rgba(0,0,0,.2); }
.scn-sir-andrew-complaint .spotlight { position:absolute; bottom:10%; left:30%; width:100px; height:200px; background: radial-gradient(ellipse at center, rgba(255,240,190,.4) 0%, transparent 70%); border-radius: 50%; pointer-events:none; animation: sa-spot 8s ease-in-out infinite alternate; }
@keyframes sa-figure { 0% { transform: translateX(-50%) translateY(0) rotate(-3deg) } 50% { transform: translateX(-50%) translateY(-6px) rotate(3deg) } 100% { transform: translateX(-50%) translateY(0) rotate(0) } }
@keyframes sa-head { 0% { transform: translateX(-50%) rotate(-4deg) } 50% { transform: translateX(-50%) rotate(6deg) } 100% { transform: translateX(-50%) rotate(0) } }
@keyframes sa-arm { 0% { transform: rotate(20deg) } 50% { transform: rotate(-10deg) } 100% { transform: rotate(15deg) } }
@keyframes sa-coxcomb { 0% { transform: translateX(-50%) scale(1) } 50% { transform: translateX(-50%) scale(1.2) } 100% { transform: translateX(-50%) scale(1) } }
@keyframes sa-spot { 0% { opacity:.7; transform: scale(1) } 50% { opacity:1; transform: scale(1.1) } 100% { opacity:.8; transform: scale(.95) } }

.scn-andrew-cesario-argument { background: linear-gradient(180deg, #2a3338 0%, #3d4a52 40%, #4a5a64 100%), radial-gradient(ellipse at 50% 30%, #5a6a76 0%, transparent 70%); }
.scn-andrew-cesario-argument .bg-room { position:absolute; inset:0; background: linear-gradient(180deg, #3a4348 0%, #2a3338 100%); }
.scn-andrew-cesario-argument .figure-andrew { position:absolute; bottom:15%; left:30%; width:28px; height:70px; background: linear-gradient(180deg, #c8a88a 0%, #8b6950 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; box-shadow: 0 4px 6px rgba(0,0,0,.4); animation: ac-andrew 4s ease-in-out infinite; }
.scn-andrew-cesario-argument .figure-cesario { position:absolute; bottom:15%; right:30%; width:26px; height:68px; background: linear-gradient(180deg, #a88a7a 0%, #6b5040 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; box-shadow: 0 4px 6px rgba(0,0,0,.4); animation: ac-cesario 4s ease-in-out infinite; }
.scn-andrew-cesario-argument .sword-andrew { position:absolute; bottom:25%; left:28%; width:4px; height:44px; background: linear-gradient(180deg, #a0a8a0 0%, #707870 100%); border-radius: 2px; transform-origin: bottom center; box-shadow: 0 0 4px rgba(255,255,255,.2); animation: ac-sword1 3s ease-in-out infinite; }
.scn-andrew-cesario-argument .sword-cesario { position:absolute; bottom:25%; right:28%; width:4px; height:44px; background: linear-gradient(180deg, #a0a8a0 0%, #707870 100%); border-radius: 2px; transform-origin: bottom center; box-shadow: 0 0 4px rgba(255,255,255,.2); animation: ac-sword2 3s ease-in-out infinite; }
.scn-andrew-cesario-argument .clash { position:absolute; bottom:42%; left:50%; width:20px; height:20px; transform:translate(-50%,-50%); background: radial-gradient(ellipse, #c8553d 0%, #a0461a 50%, transparent 100%); border-radius: 50%; box-shadow: 0 0 30px 10px rgba(200,85,61,.4); animation: ac-clash 2s ease-in-out infinite; }
.scn-andrew-cesario-argument .floor { position:absolute; bottom:0; left:0; right:0; height:15%; background: linear-gradient(180deg, #4a5a64 0%, #3a4348 100%); box-shadow: inset 0 6px 12px rgba(0,0,0,.4); }
@keyframes ac-andrew { 0% { transform: translateX(0) translateY(0) rotate(-2deg) } 50% { transform: translateX(-8px) translateY(-4px) rotate(2deg) } 100% { transform: translateX(0) translateY(0) rotate(-1deg) } }
@keyframes ac-cesario { 0% { transform: translateX(0) translateY(0) rotate(2deg) } 50% { transform: translateX(8px) translateY(-4px) rotate(-2deg) } 100% { transform: translateX(0) translateY(0) rotate(1deg) } }
@keyframes ac-sword1 { 0% { transform: rotate(-15deg) } 50% { transform: rotate(15deg) } 100% { transform: rotate(-10deg) } }
@keyframes ac-sword2 { 0% { transform: rotate(15deg) } 50% { transform: rotate(-15deg) } 100% { transform: rotate(10deg) } }
@keyframes ac-clash { 0% { opacity:.5; transform: translate(-50%,-50%) scale(1) } 50% { opacity:1; transform: translate(-50%,-50%) scale(1.3) } 100% { opacity:.6; transform: translate(-50%,-50%) scale(.9) } }

/* Scene: malvolio-confrontation (tense, dim-interior) */
.scn-malvolio-confrontation {
  background:
    linear-gradient(180deg, #1a1a1a 0%, #2a1e14 40%, #3d2a1a 100%),
    radial-gradient(ellipse at 50% 100%, #4a3520 0%, transparent 60%);
}
.scn-malvolio-confrontation .wall-bg {
  position:absolute; inset:0 0 30% 0;
  background: linear-gradient(180deg, #2a1e14 0%, #1f1510 100%);
  animation: mc-wall 20s ease-in-out infinite alternate;
}
.scn-malvolio-confrontation .floor {
  position:absolute; bottom:0; left:0; right:0; height:30%;
  background: linear-gradient(180deg, #1c1410 0%, #0f0b08 100%);
  animation: mc-floor 12s ease-in-out infinite alternate;
}
.scn-malvolio-confrontation .window-glow {
  position:absolute; top:12%; right:20%; width:60px; height:80px;
  background: radial-gradient(ellipse, #f5d080 0%, #b08040 50%, transparent 70%);
  border-radius: 10% 10% 30% 30%;
  box-shadow: 0 0 40px 15px rgba(180,100,40,0.3);
  animation: mc-window 5s ease-in-out infinite alternate;
}
.scn-malvolio-confrontation .malvolio-figure {
  position:absolute; bottom:28%; left:52%; width:30px; height:80px;
  background: linear-gradient(180deg, #1c1410 0%, #0a0705 100%);
  border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: mc-malvolio 3s ease-in-out infinite;
}
.scn-malvolio-confrontation .knight-figure {
  position:absolute; bottom:28%; left:30%; width:24px; height:60px;
  background: linear-gradient(180deg, #2a1a0e 0%, #1a0e08 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: mc-knight 4s ease-in-out infinite alternate;
}
.scn-malvolio-confrontation .andrew-figure {
  position:absolute; bottom:28%; left:18%; width:20px; height:50px;
  background: linear-gradient(180deg, #2a1a0e 0%, #1a0e08 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: mc-andrew 4.5s ease-in-out infinite alternate;
}
.scn-malvolio-confrontation .candle {
  position:absolute; bottom:30%; left:45%; width:8px; height:30px;
  background: linear-gradient(180deg, #e8d4a0 0%, #b89860 100%);
  border-radius: 10% 10% 20% 20%;
  box-shadow: 0 0 20px 6px #f0c060;
  animation: mc-candle 3s ease-in-out infinite alternate;
}
.scn-malvolio-confrontation .table {
  position:absolute; bottom:28%; left:38%; width:80px; height:12px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 5% 5% 20% 20%;
  box-shadow: 0 4px 8px rgba(0,0,0,0.6);
  animation: mc-table 8s ease-in-out infinite;
}
@keyframes mc-wall { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.75 } }
@keyframes mc-floor { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(0) } }
@keyframes mc-window { 0% { box-shadow: 0 0 30px 10px rgba(180,100,40,0.2); opacity:0.7 } 50% { box-shadow: 0 0 60px 20px rgba(180,100,40,0.5); opacity:1 } 100% { box-shadow: 0 0 40px 15px rgba(180,100,40,0.3); opacity:0.8 } }
@keyframes mc-malvolio { 0% { transform: translateX(0) rotate(-2deg) scaleY(1) } 25% { transform: translateX(3px) rotate(2deg) scaleY(1.02) } 50% { transform: translateX(0) rotate(-2deg) scaleY(1) } 75% { transform: translateX(-3px) rotate(2deg) scaleY(1.02) } 100% { transform: translateX(0) rotate(-2deg) scaleY(1) } }
@keyframes mc-knight { 0% { transform: translateX(0) rotate(0) } 50% { transform: translateX(-8px) rotate(-5deg) } 100% { transform: translateX(0) rotate(0) } }
@keyframes mc-andrew { 0% { transform: translateX(0) rotate(0) } 50% { transform: translateX(6px) rotate(8deg) } 100% { transform: translateX(0) rotate(0) } }
@keyframes mc-candle { 0% { transform: scaleY(1) rotate(-1deg) } 50% { transform: scaleY(1.1) rotate(1deg) } 100% { transform: scaleY(1) rotate(-1deg) } }
@keyframes mc-table { 0% { transform: translateY(0) } 50% { transform: translateY(-1px) } 100% { transform: translateY(0) } }

/* Scene: maria-scheme-devised (tense, dim-interior) */
.scn-maria-scheme-devised {
  background:
    linear-gradient(180deg, #1a1512 0%, #2a1e14 50%, #3d2a1a 100%),
    radial-gradient(ellipse at 30% 60%, #4a3520 0%, transparent 60%);
}
.scn-maria-scheme-devised .room-bg {
  position:absolute; inset:0;
  background: linear-gradient(180deg, #1f1510 0%, #2a1e14 40%, #1c1410 100%);
  animation: ms-room 15s ease-in-out infinite alternate;
}
.scn-maria-scheme-devised .desk {
  position:absolute; bottom:20%; left:30%; width:120px; height:16px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 8% 8% 20% 20%;
  box-shadow: 0 6px 10px rgba(0,0,0,0.5);
  animation: ms-desk 10s ease-in-out infinite;
}
.scn-maria-scheme-devised .maria-figure {
  position:absolute; bottom:20%; left:35%; width:22px; height:70px;
  background: linear-gradient(180deg, #2a1a0e 0%, #1a0e08 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ms-maria 4s ease-in-out infinite alternate;
}
.scn-maria-scheme-devised .candle-light {
  position:absolute; bottom:38%; left:40%; width:8px; height:20px;
  background: linear-gradient(180deg, #f5d080 0%, #b09850 100%);
  border-radius: 20% 20% 30% 30%;
  box-shadow: 0 0 30px 10px #d0a050;
  animation: ms-candle 3s ease-in-out infinite alternate;
}
.scn-maria-scheme-devised .paper-scroll {
  position:absolute; bottom:26%; left:45%; width:70px; height:14px;
  background: linear-gradient(180deg, #e8d0a0 0%, #c8b080 100%);
  border-radius: 30% 30% 10% 10%;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  animation: ms-paper 5s ease-in-out infinite alternate;
}
.scn-maria-scheme-devised .quill {
  position:absolute; bottom:32%; left:52%; width:18px; height:4px;
  background: linear-gradient(90deg, #d0b080 0%, #f0e0c0 100%);
  border-radius: 40% 10% 10% 40%;
  transform: rotate(30deg);
  transform-origin: right center;
  animation: ms-quill 2s ease-in-out infinite alternate;
}
.scn-maria-scheme-devised .shadow-figure {
  position:absolute; bottom:20%; left:55%; width:20px; height:60px;
  background: linear-gradient(180deg, #1c1410 0%, #0a0705 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  opacity:0.6;
  animation: ms-shadow 6s ease-in-out infinite;
}
@keyframes ms-room { 0% { opacity:0.7 } 50% { opacity:1 } 100% { opacity:0.75 } }
@keyframes ms-desk { 0% { transform: translateY(0) } 50% { transform: translateY(-1px) } 100% { transform: translateY(0) } }
@keyframes ms-maria { 0% { transform: translateX(0) rotate(0) scaleY(1) } 50% { transform: translateX(2px) rotate(2deg) scaleY(1.02) } 100% { transform: translateX(0) rotate(0) scaleY(1) } }
@keyframes ms-candle { 0% { transform: scaleY(1) rotate(-1deg) } 50% { transform: scaleY(1.15) rotate(1deg) } 100% { transform: scaleY(1) rotate(-1deg) } }
@keyframes ms-paper { 0% { transform: translateY(0) rotate(-1deg) } 50% { transform: translateY(-3px) rotate(2deg) } 100% { transform: translateY(0) rotate(-1deg) } }
@keyframes ms-quill { 0% { transform: rotate(30deg) translateX(0) } 100% { transform: rotate(40deg) translateX(-2px) } }
@keyframes ms-shadow { 0% { transform: translateX(0) opacity(0.6) } 50% { transform: translateX(-5px) opacity(0.8) } 100% { transform: translateX(0) opacity(0.6) } }

/* Scene: gulling-malvolio-plan (funny, dim-interior) */
.scn-gulling-malvolio-plan {
  background:
    linear-gradient(180deg, #3a2a1a 0%, #2a1e14 40%, #1a1510 100%),
    radial-gradient(ellipse at 50% 70%, #4a3520 0%, transparent 70%);
}
.scn-gulling-malvolio-plan .chamber-bg {
  position:absolute; inset:0;
  background: linear-gradient(180deg, #2a1e14 0%, #1f1510 60%, #140f0a 100%);
  animation: gm-chamber 18s ease-in-out infinite alternate;
}
.scn-gulling-malvolio-plan .planter {
  position:absolute; bottom:15%; left:20%; width:60px; height:50px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 10% 10% 40% 40%;
  box-shadow: 0 4px 8px rgba(0,0,0,0.4);
  animation: gm-planter 7s ease-in-out infinite;
}
.scn-gulling-malvolio-plan .letter-drop {
  position:absolute; top:30%; left:40%; width:80px; height:12px;
  background: linear-gradient(180deg, #f0d8a0 0%, #c8b080 100%);
  border-radius: 30% 30% 10% 10%;
  box-shadow: 0 0 20px 6px rgba(200,160,80,0.4);
  animation: gm-letter 4s ease-in-out infinite alternate;
}
.scn-gulling-malvolio-plan .maria-gesture {
  position:absolute; bottom:20%; left:30%; width:22px; height:65px;
  background: linear-gradient(180deg, #2a1a0e 0%, #1a0e08 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: gm-maria 3.5s ease-in-out infinite;
}
.scn-gulling-malvolio-plan .toby-laughter {
  position:absolute; bottom:20%; left:50%; width:28px; height:60px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: gm-toby 2.5s ease-in-out infinite;
}
.scn-gulling-malvolio-plan .candle-flame {
  position:absolute; bottom:35%; left:55%; width:10px; height:25px;
  background: linear-gradient(180deg, #f5e0a0 0%, #d0a050 70%);
  border-radius: 30% 30% 20% 20%;
  box-shadow: 0 0 25px 8px #d0a050;
  animation: gm-flame 1.5s ease-in-out infinite alternate;
}
.scn-gulling-malvolio-plan .chair {
  position:absolute; bottom:20%; left:15%; width:40px; height:30px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 20% 20% 30% 30%;
  box-shadow: 0 4px 6px rgba(0,0,0,0.4);
  animation: gm-chair 12s ease-in-out infinite;
}
@keyframes gm-chamber { 0% { opacity:0.7 } 50% { opacity:1 } 100% { opacity:0.75 } }
@keyframes gm-planter { 0% { transform: translateY(0) } 50% { transform: translateY(-3px) } 100% { transform: translateY(0) } }
@keyframes gm-letter { 0% { transform: translateY(0) rotate(-2deg) scaleX(1) } 50% { transform: translateY(12px) rotate(2deg) scaleX(0.95) } 100% { transform: translateY(0) rotate(-2deg) scaleX(1) } }
@keyframes gm-maria { 0% { transform: translateX(0) rotate(-3deg) } 25% { transform: translateX(8px) rotate(3deg) } 50% { transform: translateX(0) rotate(-3deg) } 75% { transform: translateX(-8px) rotate(3deg) } 100% { transform: translateX(0) rotate(-3deg) } }
@keyframes gm-toby { 0% { transform: translateX(0) rotate(0) scaleY(1) } 25% { transform: translateX(-5px) rotate(-5deg) scaleY(1.05) } 50% { transform: translateX(0) rotate(0) scaleY(1) } 75% { transform: translateX(5px) rotate(5deg) scaleY(1.05) } 100% { transform: translateX(0) rotate(0) scaleY(1) } }
@keyframes gm-flame { 0% { transform: scaleY(1) rotate(-2deg) } 50% { transform: scaleY(1.2) rotate(2deg) } 100% { transform: scaleY(0.9) rotate(-2deg) } }
@keyframes gm-chair { 0%,100% { transform: translateX(0) } 50% { transform: translateX(-2px) } }

/* Scene: after-maria-scheme (funny, dim-interior) */
.scn-after-maria-scheme {
  background:
    linear-gradient(180deg, #2a1e14 0%, #1f1510 40%, #140f0a 100%),
    radial-gradient(ellipse at 60% 80%, #3a2a1a 0%, transparent 60%);
}
.scn-after-maria-scheme .tavern-bg {
  position:absolute; inset:0;
  background: linear-gradient(180deg, #1f1510 0%, #2a1e14 40%, #1a1510 100%);
  animation: am-tavern 20s ease-in-out infinite alternate;
}
.scn-after-maria-scheme .table-stool {
  position:absolute; bottom:20%; left:25%; width:100px; height:14px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 10% 10% 30% 30%;
  box-shadow: 0 6px 10px rgba(0,0,0,0.5);
  animation: am-table 8s ease-in-out infinite;
}
.scn-after-maria-scheme .toby-figure {
  position:absolute; bottom:18%; left:30%; width:28px; height:70px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a10 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: am-toby 3s ease-in-out infinite;
}
.scn-after-maria-scheme .beagle-silhouette {
  position:absolute; bottom:18%; left:48%; width:35px; height:25px;
  background: linear-gradient(180deg, #1c1410 0%, #0a0705 100%);
  border-radius: 40% 60% 40% 60% / 60% 40% 60% 40%;
  transform: rotate(-5deg);
  animation: am-beagle 2.5s ease-in-out infinite alternate;
}
.scn-after-maria-scheme .wine-glass {
  position:absolute; bottom:25%; left:45%; width:12px; height:30px;
  background: linear-gradient(180deg, #c08050 0%, #a06030 100%);
  border-radius: 30% 30% 20% 20% / 40% 40% 20% 20%;
  box-shadow: 0 2px 8px rgba(0,0,0,0.3);
  animation: am-wine 4s ease-in-out infinite alternate;
}
.scn-after-maria-scheme .lantern-light {
  position:absolute; top:15%; left:60%; width:20px; height:30px;
  background: radial-gradient(ellipse, #f5e0a0 0%, #d0a050 60%, transparent 80%);
  border-radius: 30% 30% 20% 20%;
  box-shadow: 0 0 40px 15px rgba(200,160,80,0.4);
  animation: am-lantern 6s ease-in-out infinite alternate;
}
.scn-after-maria-scheme .bottle {
  position:absolute; bottom:20%; left:35%; width:14px; height:40px;
  background: linear-gradient(180deg, #6a4a2a 0%, #3a2a1a 100%);
  border-radius: 40% 40% 20% 20% / 30% 30% 20% 20%;
  box-shadow: 0 2px 6px rgba(0,0,0,0.3);
  animation: am-bottle 10s ease-in-out infinite;
}
@keyframes am-tavern { 0% { opacity:0.7 } 50% { opacity:1 } 100% { opacity:0.75 } }
@keyframes am-table { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(0) } }
@keyframes am-toby { 0% { transform: translateX(0) rotate(-4deg) } 25% { transform: translateX(4px) rotate(4deg) } 50% { transform: translateX(0) rotate(-4deg) } 75% { transform: translateX(-4px) rotate(4deg) } 100% { transform: translateX(0) rotate(-4deg) } }
@keyframes am-beagle { 0% { transform: rotate(-5deg) translateX(0) } 50% { transform: rotate(0deg) translateX(4px) } 100% { transform: rotate(-5deg) translateX(0) } }
@keyframes am-wine { 0% { transform: rotate(0) scaleY(1) } 50% { transform: rotate(5deg) scaleY(1.05) } 100% { transform: rotate(0) scaleY(1) } }
@keyframes am-lantern { 0% { box-shadow: 0 0 30px 10px rgba(200,160,80,0.3); opacity:0.8 } 50% { box-shadow: 0 0 60px 20px rgba(200,160,80,0.5); opacity:1 } 100% { box-shadow: 0 0 40px 15px rgba(200,160,80,0.35); opacity:0.8 } }
@keyframes am-bottle { 0% { transform: rotate(-2deg) } 50% { transform: rotate(3deg) } 100% { transform: rotate(-2deg) } }

.scn-olivia-house-toby-plan {
  background:
    linear-gradient(180deg, #2a1f14 0%, #1f1510 40%, #0d0a08 100%),
    radial-gradient(ellipse at 30% 50%, #3a2a1a 0%, transparent 60%);
}
.scn-olivia-house-toby-plan .wall {
  position: absolute; inset: 0 0 35% 0;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1f14 100%);
  animation: otp-wall 20s ease-in-out infinite alternate;
}
.scn-olivia-house-toby-plan .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #1f1510 0%, #0d0a08 100%);
  border-radius: 20% 20% 0 0 / 30% 30% 0 0;
  box-shadow: inset 0 8px 20px rgba(0,0,0,.6);
}
.scn-olivia-house-toby-plan .table {
  position: absolute; bottom: 30%; left: 50%; transform: translateX(-50%);
  width: 140px; height: 20px;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a2a1a 100%);
  border-radius: 4px;
  box-shadow: 0 -4px 8px rgba(0,0,0,.4);
  animation: otp-table 6s ease-in-out infinite;
}
.scn-olivia-house-toby-plan .chair-left {
  position: absolute; bottom: 28%; left: 35%;
  width: 30px; height: 50px;
  background: linear-gradient(180deg, #4a3028 0%, #2a1a14 100%);
  border-radius: 10% 10% 30% 30% / 20% 20% 40% 40%;
  transform: rotate(-5deg);
  animation: otp-chair-l 8s ease-in-out infinite;
}
.scn-olivia-house-toby-plan .chair-right {
  position: absolute; bottom: 28%; right: 35%;
  width: 30px; height: 50px;
  background: linear-gradient(180deg, #4a3028 0%, #2a1a14 100%);
  border-radius: 10% 10% 30% 30% / 20% 20% 40% 40%;
  transform: rotate(5deg);
  animation: otp-chair-r 8s ease-in-out infinite reverse;
}
.scn-olivia-house-toby-plan .tankard {
  position: absolute; bottom: 35%; left: 50%; transform: translateX(-50%);
  width: 20px; height: 28px;
  background: linear-gradient(180deg, #8a6a3a 0%, #5a4a2a 100%);
  border-radius: 0 0 20% 20% / 0 0 40% 40%;
  box-shadow: 0 2px 6px rgba(0,0,0,.5);
  animation: otp-tankard 3s ease-in-out infinite;
}
.scn-olivia-house-toby-plan .candle-glow {
  position: absolute; bottom: 32%; left: 45%;
  width: 8px; height: 14px;
  background: radial-gradient(circle, #e8a040 0%, #b06020 60%, transparent 100%);
  border-radius: 50%;
  box-shadow: 0 0 20px 6px #d08030, 0 0 40px 12px rgba(208,128,48,.3);
  animation: otp-candle 4s ease-in-out infinite alternate;
}
.scn-olivia-house-toby-plan .knight-silhouette {
  position: absolute; bottom: 25%; left: 20%;
  width: 22px; height: 60px;
  background: linear-gradient(180deg, #0a0808 0%, #0d0a08 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 40% 40%;
  transform-origin: bottom center;
  animation: otp-knight 5s ease-in-out infinite;
}
.scn-olivia-house-toby-plan .plan {
  position: absolute; bottom: 35%; left: 58%;
  width: 30px; height: 20px;
  background: linear-gradient(135deg, #a08060 0%, #c8a880 100%);
  border-radius: 4px;
  transform: rotate(-10deg);
  box-shadow: 0 2px 4px rgba(0,0,0,.3);
  animation: otp-plan 12s ease-in-out infinite;
}
@keyframes otp-wall { 0% { opacity:.9 } 50% { opacity:1 } 100% { opacity:.85 } }
@keyframes otp-table { 0%,100% { transform: translateX(-50%) } 50% { transform: translateX(-50%) translateY(-2px) } }
@keyframes otp-chair-l { 0% { transform: rotate(-5deg) } 50% { transform: rotate(-8deg) translateY(-3px) } 100% { transform: rotate(-5deg) } }
@keyframes otp-chair-r { 0% { transform: rotate(5deg) } 50% { transform: rotate(8deg) translateY(-3px) } 100% { transform: rotate(5deg) } }
@keyframes otp-tankard { 0% { transform: translateX(-50%) rotate(0) } 25% { transform: translateX(-50%) rotate(-5deg) translateY(-2px) } 75% { transform: translateX(-50%) rotate(5deg) translateY(-1px) } 100% { transform: translateX(-50%) rotate(0) } }
@keyframes otp-candle { 0% { box-shadow:0 0 20px 6px #d08030,0 0 40px 12px rgba(208,128,48,.3); opacity:.8 } 100% { box-shadow:0 0 30px 10px #e8a040,0 0 50px 16px rgba(232,160,64,.4); opacity:1 } }
@keyframes otp-knight { 0% { transform: translateY(0) rotate(-1deg) } 33% { transform: translateY(-4px) rotate(2deg) } 66% { transform: translateY(-2px) rotate(-2deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes otp-plan { 0% { transform: rotate(-10deg) } 50% { transform: rotate(-5deg) translateY(-2px) } 100% { transform: rotate(-10deg) } }

.scn-olivia-house-revels {
  background:
    linear-gradient(180deg, #2a1f14 0%, #1a1510 50%, #0d0a08 100%),
    radial-gradient(ellipse at 70% 40%, #3a2a1a 0%, transparent 70%);
}
.scn-olivia-house-revels .wall-revels {
  position: absolute; inset: 0 0 35% 0;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1f14 100%);
  animation: or-wall 25s ease-in-out infinite alternate;
}
.scn-olivia-house-revels .floor-revels {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #1f1510 0%, #0d0a08 100%);
  border-radius: 30% 20% 0 0 / 40% 30% 0 0;
  box-shadow: inset 0 6px 15px rgba(0,0,0,.5);
}
.scn-olivia-house-revels .mask-left {
  position: absolute; top: 25%; left: 20%;
  width: 30px; height: 20px;
  background: linear-gradient(135deg, #c04020 0%, #a03010 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 30% 30%;
  box-shadow: 0 2px 6px rgba(0,0,0,.4);
  animation: or-mask 6s ease-in-out infinite;
}
.scn-olivia-house-revels .mask-right {
  position: absolute; top: 30%; right: 20%;
  width: 30px; height: 20px;
  background: linear-gradient(135deg, #c06030 0%, #a04020 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 30% 30%;
  box-shadow: 0 2px 6px rgba(0,0,0,.4);
  animation: or-mask 8s ease-in-out infinite reverse;
}
.scn-olivia-house-revels .streamer-a {
  position: absolute; top: 10%; left: 50%;
  width: 6px; height: 80px;
  background: linear-gradient(180deg, #d0a030 0%, #b08020 50%, #a07018 100%);
  border-radius: 50%;
  transform-origin: top center;
  filter: blur(1px);
  animation: or-streamer-a 10s ease-in-out infinite;
}
.scn-olivia-house-revels .streamer-b {
  position: absolute; top: 15%; left: 65%;
  width: 5px; height: 70px;
  background: linear-gradient(180deg, #c06040 0%, #a04030 50%, #803020 100%);
  border-radius: 50%;
  transform-origin: top center;
  filter: blur(1px);
  animation: or-streamer-b 12s ease-in-out infinite;
}
.scn-olivia-house-revels .lantern-revels {
  position: absolute; top: 40%; left: 50%;
  width: 12px; height: 16px;
  background: radial-gradient(circle, #f0c060 0%, #c08020 70%);
  border-radius: 30% 30% 20% 20%;
  box-shadow: 0 0 24px 8px #c08020, 0 0 48px 16px rgba(192,128,32,.3);
  animation: or-lantern 4s ease-in-out infinite alternate;
}
.scn-olivia-house-revels .figure-dancing {
  position: absolute; bottom: 30%; left: 45%;
  width: 24px; height: 50px;
  background: linear-gradient(180deg, #1a1a1a 0%, #0d0a08 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 30% 30%;
  transform-origin: bottom center;
  animation: or-dancer 3s ease-in-out infinite;
}
.scn-olivia-house-revels .kickshaw {
  position: absolute; bottom: 30%; left: 30%;
  width: 14px; height: 14px;
  background: radial-gradient(circle, #d0a060 0%, #b08040 100%);
  border-radius: 50%;
  box-shadow: 0 0 10px 2px rgba(208,160,96,.5);
  animation: or-kickshaw 7s ease-in-out infinite;
}
@keyframes or-wall { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.85 } }
@keyframes or-mask { 0% { transform: translateY(0) rotate(0) } 50% { transform: translateY(-5px) rotate(5deg) } 100% { transform: translateY(0) rotate(-3deg) } }
@keyframes or-streamer-a { 0% { transform: rotate(0) } 50% { transform: rotate(15deg) } 100% { transform: rotate(0) } }
@keyframes or-streamer-b { 0% { transform: rotate(0) } 50% { transform: rotate(-20deg) } 100% { transform: rotate(0) } }
@keyframes or-lantern { 0% { box-shadow:0 0 24px 8px #c08020,0 0 48px 16px rgba(192,128,32,.3); opacity:.85 } 100% { box-shadow:0 0 36px 12px #f0c060,0 0 60px 20px rgba(240,192,96,.4); opacity:1 } }
@keyframes or-dancer { 0% { transform: translateY(0) rotate(-2deg) } 25% { transform: translateY(-3px) rotate(2deg) } 75% { transform: translateY(-5px) rotate(-2deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes or-kickshaw { 0% { transform: scale(1) } 50% { transform: scale(1.2) } 100% { transform: scale(1) } }

.scn-orsino-palace-cesario {
  background:
    linear-gradient(180deg, #e8dcc8 0%, #c8b89a 40%, #a89878 100%),
    radial-gradient(ellipse at 50% 0%, #fff5e0 0%, transparent 60%);
}
.scn-orsino-palace-cesario .pillar-left {
  position: absolute; top: 0; left: 10%; width: 20px; height: 100%;
  background: linear-gradient(90deg, #b8a080 0%, #d0b898 40%, #b8a080 100%);
  box-shadow: 4px 0 8px rgba(0,0,0,.1);
  border-radius: 2px;
  animation: opc-pillar 30s ease-in-out infinite alternate;
}
.scn-orsino-palace-cesario .pillar-right {
  position: absolute; top: 0; right: 10%; width: 20px; height: 100%;
  background: linear-gradient(90deg, #b8a080 0%, #d0b898 40%, #b8a080 100%);
  box-shadow: -4px 0 8px rgba(0,0,0,.1);
  border-radius: 2px;
  animation: opc-pillar 30s ease-in-out infinite alternate-reverse;
}
.scn-orsino-palace-cesario .arch {
  position: absolute; top: 0; left: 5%; right: 5%; height: 25%;
  background: radial-gradient(ellipse at 50% 100%, #d0b898 0%, transparent 70%);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  box-shadow: inset 0 -10px 20px rgba(0,0,0,.1);
  animation: opc-arch 20s ease-in-out infinite alternate;
}
.scn-orsino-palace-cesario .floor-palace {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #a89878 0%, #887860 100%);
  border-radius: 10% 10% 0 0 / 20% 20% 0 0;
  box-shadow: inset 0 8px 20px rgba(0,0,0,.15);
}
.scn-orsino-palace-cesario .window-light {
  position: absolute; bottom: 40%; right: 20%;
  width: 40px; height: 60px;
  background: radial-gradient(ellipse, #fff5e0 0%, #e0d0b0 70%);
  border-radius: 4px;
  box-shadow: 0 0 40px 15px rgba(255,245,224,.6);
  opacity: 0.9;
  animation: opc-window 15s ease-in-out infinite alternate;
}
.scn-orsino-palace-cesario .duke-figure {
  position: absolute; bottom: 25%; left: 35%;
  width: 30px; height: 70px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a10 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 35% 35%;
  transform-origin: bottom center;
  animation: opc-duke 20s ease-in-out infinite;
}
.scn-orsino-palace-cesario .cesario-figure {
  position: absolute; bottom: 25%; right: 35%;
  width: 22px; height: 60px;
  background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 35% 35%;
  transform-origin: bottom center;
  animation: opc-cesario 22s ease-in-out infinite reverse;
}
.scn-orsino-palace-cesario .sunbeam {
  position: absolute; top: 15%; left: 50%;
  width: 8px; height: 120px;
  background: linear-gradient(180deg, rgba(255,245,224,.4) 0%, transparent 100%);
  border-radius: 50%;
  filter: blur(4px);
  transform: rotate(10deg);
  animation: opc-beam 12s ease-in-out infinite;
}
@keyframes opc-pillar { 0% { opacity:.9 } 50% { opacity:1 } 100% { opacity:.9 } }
@keyframes opc-arch { 0% { opacity:.85 } 50% { opacity:1 } 100% { opacity:.9 } }
@keyframes opc-window { 0% { box-shadow:0 0 40px 15px rgba(255,245,224,.6); opacity:.9 } 100% { box-shadow:0 0 60px 25px rgba(255,245,224,.8); opacity:1 } }
@keyframes opc-duke { 0% { transform: translateY(0) rotate(0) } 50% { transform: translateY(-3px) rotate(-1deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes opc-cesario { 0% { transform: translateY(0) rotate(0) } 50% { transform: translateY(-2px) rotate(1deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes opc-beam { 0% { opacity:.3 } 50% { opacity:.6 } 100% { opacity:.3 } }

.scn-olivia-house-clown {
  background:
    linear-gradient(180deg, #2a1f14 0%, #1a1510 30%, #0f0a08 100%),
    radial-gradient(ellipse at 40% 30%, #3a2a1a 0%, transparent 70%);
}
.scn-olivia-house-clown .wall-clown {
  position: absolute; inset: 0 0 35% 0;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1f14 100%);
  animation: ohc-wall 18s ease-in-out infinite alternate;
}
.scn-olivia-house-clown .floor-clown {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #1f1510 0%, #0d0a08 100%);
  border-radius: 20% 30% 0 0 / 30% 40% 0 0;
  box-shadow: inset 0 8px 20px rgba(0,0,0,.6);
}
.scn-olivia-house-clown .gallows {
  position: absolute; bottom: 40%; left: 30%;
  width: 6px; height: 50px;
  background: linear-gradient(180deg, #4a3020 0%, #2a1a10 100%);
  border-radius: 2px;
  transform-origin: bottom center;
  animation: ohc-gallows 6s ease-in-out infinite;
}
.scn-olivia-house-clown .rope {
  position: absolute; bottom: 75%; left: 30%;
  width: 4px; height: 30px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 2px;
  transform-origin: top center;
  animation: ohc-rope 4s ease-in-out infinite;
}
.scn-olivia-house-clown .clown-hat {
  position: absolute; bottom: 68%; left: 28%;
  width: 20px; height: 14px;
  background: linear-gradient(135deg, #c06040 0%, #a04030 100%);
  border-radius: 50% 50% 20% 20% / 80% 80% 20% 20%;
  box-shadow: 0 -4px 6px rgba(0,0,0,.3);
  animation: ohc-hat 5s ease-in-out infinite;
}
.scn-olivia-house-clown .lute {
  position: absolute; bottom: 30%; right: 25%;
  width: 18px; height: 30px;
  background: linear-gradient(180deg, #8a6a3a 0%, #5a4a2a 100%);
  border-radius: 30% 30% 40% 40% / 40% 40% 50% 50%;
  transform: rotate(15deg);
  box-shadow: 0 2px 4px rgba(0,0,0,.4);
  animation: ohc-lute 8s ease-in-out infinite;
}
.scn-olivia-house-clown .maria-figure {
  position: absolute; bottom: 25%; right: 40%;
  width: 20px; height: 50px;
  background: linear-gradient(180deg, #6a4a3a 0%, #4a2a1a 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 35% 35%;
  transform-origin: bottom center;
  animation: ohc-maria 10s ease-in-out infinite;
}
.scn-olivia-house-clown .sparkle {
  position: absolute; top: 20%; left: 50%;
  width: 6px; height: 6px;
  background: radial-gradient(circle, #f0d080 0%, #d0a050 70%);
  border-radius: 50%;
  box-shadow: 0 0 12px 4px rgba(240,208,128,.6);
  animation: ohc-sparkle 3s ease-in-out infinite alternate;
}
@keyframes ohc-wall { 0% { opacity:.85 } 50% { opacity:1 } 100% { opacity:.9 } }
@keyframes ohc-gallows { 0% { transform: rotate(-2deg) } 50% { transform: rotate(2deg) } 100% { transform: rotate(-2deg) } }
@keyframes ohc-rope { 0% { transform: rotate(0) } 50% { transform: rotate(5deg) } 100% { transform: rotate(0) } }
@keyframes ohc-hat { 0% { transform: translateY(0) rotate(-5deg) } 50% { transform: translateY(-4px) rotate(5deg) } 100% { transform: translateY(0) rotate(-5deg) } }
@keyframes ohc-lute { 0% { transform: rotate(15deg) } 50% { transform: rotate(20deg) translateY(-2px) } 100% { transform: rotate(15deg) } }
@keyframes ohc-maria { 0% { transform: translateY(0) rotate(0) } 50% { transform: translateY(-3px) rotate(-2deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes ohc-sparkle { 0% { transform: scale(1); opacity:.7 } 100% { transform: scale(1.3); opacity:1 } }

/* forced-duel */
.scn-forced-duel {
  background: linear-gradient(180deg, #f5e6d0 0%, #c9b89a 100%), radial-gradient(ellipse at 70% 40%, rgba(255,235,200,0.6) 0%, transparent 70%);
}
.scn-forced-duel .room-bg {
  position: absolute; inset: 0 0 30% 0; background: linear-gradient(135deg, #e8d8c0 0%, #b8a88a 100%); animation: fd-pulseBg 12s ease-in-out infinite alternate;
}
.scn-forced-duel .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%; background: linear-gradient(180deg, #8a7a60 0%, #5a4a30 100%); border-radius: 20% 20% 0 0; box-shadow: inset 0 8px 20px rgba(0,0,0,0.3); animation: fd-shiftFloor 18s ease-in-out infinite alternate;
}
.scn-forced-duel .window {
  position: absolute; top: 12%; left: 40%; width: 120px; height: 100px; background: linear-gradient(135deg, #fff8f0 0%, #d0c0a0 100%); border-radius: 4px; box-shadow: 0 0 30px 10px rgba(255,235,200,0.6); transform: perspective(400px) rotateX(5deg); animation: fd-windowGlow 6s ease-in-out infinite alternate;
}
.scn-forced-duel .duelist {
  position: absolute; bottom: 22%; width: 28px; height: 80px; background: linear-gradient(180deg, #2a2a3a 0%, #0a0a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center;
}
.scn-forced-duel .duelist.left { left: 25%; animation: fd-stepL 2s ease-in-out infinite; }
.scn-forced-duel .duelist.right { right: 25%; animation: fd-stepR 2s ease-in-out infinite reverse; }
.scn-forced-duel .sword {
  position: absolute; bottom: 70%; width: 4px; height: 60px; background: linear-gradient(180deg, #c0c0c0 0%, #808080 100%); border-radius: 2px; transform-origin: bottom center;
}
.scn-forced-duel .sword.left { left: 28%; animation: fd-swingL 1.5s ease-in-out infinite; }
.scn-forced-duel .sword.right { right: 28%; animation: fd-swingR 1.5s ease-in-out infinite; }
.scn-forced-duel .spark {
  position: absolute; bottom: 68%; left: 50%; width: 10px; height: 10px; background: radial-gradient(circle, #fffbe0 0%, #ffd060 40%, transparent 70%); border-radius: 50%; transform: translate(-50%, -50%); animation: fd-spark 1.5s ease-in-out infinite alternate;
}
@keyframes fd-pulseBg { 0% { opacity: 0.8; } 50% { opacity: 1; } 100% { opacity: 0.85; } }
@keyframes fd-shiftFloor { 0% { transform: translateY(0); } 50% { transform: translateY(-2px); } 100% { transform: translateY(0); } }
@keyframes fd-windowGlow { 0% { box-shadow: 0 0 20px 5px rgba(255,235,200,0.4); } 50% { box-shadow: 0 0 40px 15px rgba(255,240,210,0.8); } 100% { box-shadow: 0 0 25px 8px rgba(255,235,200,0.5); } }
@keyframes fd-stepL { 0% { transform: translateX(0) translateY(0) rotate(2deg); } 25% { transform: translateX(-5px) translateY(-2px) rotate(-1deg); } 50% { transform: translateX(0) translateY(0) rotate(2deg); } 75% { transform: translateX(5px) translateY(-2px) rotate(-1deg); } 100% { transform: translateX(0) translateY(0) rotate(2deg); } }
@keyframes fd-stepR { 0% { transform: translateX(0) translateY(0) rotate(-2deg); } 25% { transform: translateX(5px) translateY(-2px) rotate(1deg); } 50% { transform: translateX(0) translateY(0) rotate(-2deg); } 75% { transform: translateX(-5px) translateY(-2px) rotate(1deg); } 100% { transform: translateX(0) translateY(0) rotate(-2deg); } }
@keyframes fd-swingL { 0% { transform: rotate(-20deg); } 50% { transform: rotate(30deg); } 100% { transform: rotate(-20deg); } }
@keyframes fd-swingR { 0% { transform: rotate(20deg); } 50% { transform: rotate(-30deg); } 100% { transform: rotate(20deg); } }
@keyframes fd-spark { 0% { transform: translate(-50%, -50%) scale(1); opacity: 0.8; } 50% { transform: translate(-60%, -40%) scale(1.5); opacity: 1; } 100% { transform: translate(-50%, -50%) scale(1); opacity: 0.6; } }

/* antonio-arrested */
.scn-antonio-arrested {
  background: linear-gradient(180deg, #f5e6d0 0%, #c9b89a 100%), radial-gradient(ellipse at 50% 60%, rgba(255,235,200,0.5) 0%, transparent 60%);
}
.scn-antonio-arrested .bg {
  position: absolute; inset: 0 0 30% 0; background: linear-gradient(135deg, #e8d8c0 0%, #b8a88a 100%); animation: aa-pulseBg 14s ease-in-out infinite alternate;
}
.scn-antonio-arrested .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%; background: linear-gradient(180deg, #7a6a50 0%, #4a3a20 100%); border-radius: 10% 10% 0 0; box-shadow: inset 0 8px 20px rgba(0,0,0,0.3); animation: aa-shiftFloor 20s ease-in-out infinite alternate;
}
.scn-antonio-arrested .window {
  position: absolute; top: 10%; left: 30%; width: 100px; height: 90px; background: linear-gradient(135deg, #fff8f0 0%, #d0c0a0 100%); border-radius: 4px; box-shadow: 0 0 25px 8px rgba(255,235,200,0.6); transform: perspective(400px) rotateX(5deg); animation: aa-windowGlow 7s ease-in-out infinite alternate;
}
.scn-antonio-arrested .officer {
  position: absolute; bottom: 22%; width: 30px; height: 85px; background: linear-gradient(180deg, #2a2a3a 0%, #0a0a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center;
}
.scn-antonio-arrested .officer.left { left: 20%; animation: aa-officerL 3s ease-in-out infinite; }
.scn-antonio-arrested .officer.right { right: 20%; animation: aa-officerR 3s ease-in-out infinite reverse; }
.scn-antonio-arrested .antonio {
  position: absolute; bottom: 22%; left: 50%; width: 28px; height: 80px; background: linear-gradient(180deg, #3a3a2a 0%, #1a1a0a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform: translateX(-50%); animation: aa-antonioStruggle 2.5s ease-in-out infinite;
}
.scn-antonio-arrested .bindings {
  position: absolute; bottom: 35%; left: 50%; width: 40px; height: 6px; background: linear-gradient(90deg, #8a6a50 0%, #5a4a30 100%); border-radius: 3px; transform: translateX(-50%) rotate(-10deg); animation: aa-bindingsTighten 2.5s ease-in-out infinite;
}
.scn-antonio-arrested .badge {
  position: absolute; bottom: 55%; left: 25%; width: 12px; height: 12px; background: radial-gradient(circle, #e0d0b0 0%, #a09070 100%); border-radius: 50%; box-shadow: 0 0 8px 2px rgba(224,208,176,0.5); animation: aa-badgeBounce 4s ease-in-out infinite;
}
@keyframes aa-pulseBg { 0% { opacity: 0.8; } 50% { opacity: 1; } 100% { opacity: 0.85; } }
@keyframes aa-shiftFloor { 0% { transform: translateY(0); } 50% { transform: translateY(-3px); } 100% { transform: translateY(0); } }
@keyframes aa-windowGlow { 0% { box-shadow: 0 0 20px 5px rgba(255,235,200,0.4); } 50% { box-shadow: 0 0 40px 12px rgba(255,240,210,0.8); } 100% { box-shadow: 0 0 25px 8px rgba(255,235,200,0.5); } }
@keyframes aa-officerL { 0% { transform: translateX(0) rotate(3deg); } 25% { transform: translateX(-3px) rotate(-2deg); } 50% { transform: translateX(0) rotate(3deg); } 75% { transform: translateX(3px) rotate(-2deg); } 100% { transform: translateX(0) rotate(3deg); } }
@keyframes aa-officerR { 0% { transform: translateX(0) rotate(-3deg); } 25% { transform: translateX(3px) rotate(2deg); } 50% { transform: translateX(0) rotate(-3deg); } 75% { transform: translateX(-3px) rotate(2deg); } 100% { transform: translateX(0) rotate(-3deg); } }
@keyframes aa-antonioStruggle { 0% { transform: translateX(-50%) translateY(0) rotate(2deg); } 25% { transform: translateX(-48%) translateY(-4px) rotate(-2deg); } 50% { transform: translateX(-50%) translateY(0) rotate(2deg); } 75% { transform: translateX(-52%) translateY(-4px) rotate(-2deg); } 100% { transform: translateX(-50%) translateY(0) rotate(2deg); } }
@keyframes aa-bindingsTighten { 0% { transform: translateX(-50%) rotate(-10deg) scaleX(1); } 50% { transform: translateX(-50%) rotate(-5deg) scaleX(1.1); } 100% { transform: translateX(-50%) rotate(-10deg) scaleX(1); } }
@keyframes aa-badgeBounce { 0% { transform: translateY(0); } 30% { transform: translateY(-6px); } 60% { transform: translateY(0); } 80% { transform: translateY(-3px); } 100% { transform: translateY(0); } }

/* antonio-denied */
.scn-antonio-denied {
  background: linear-gradient(180deg, #f5e6d0 0%, #c9b89a 100%), radial-gradient(ellipse at 40% 50%, rgba(255,235,200,0.5) 0%, transparent 60%);
}
.scn-antonio-denied .bg {
  position: absolute; inset: 0 0 35% 0; background: linear-gradient(135deg, #e8d8c0 0%, #b8a88a 100%); animation: ad-pulseBg 13s ease-in-out infinite alternate;
}
.scn-antonio-denied .table {
  position: absolute; bottom: 30%; left: 20%; right: 20%; height: 10%; background: linear-gradient(180deg, #6a5a40 0%, #4a3a20 100%); border-radius: 4px; box-shadow: 0 4px 10px rgba(0,0,0,0.4); transform: perspective(300px) rotateX(10deg); animation: ad-tableShift 20s ease-in-out infinite alternate;
}
.scn-antonio-denied .denier {
  position: absolute; bottom: 22%; left: 25%; width: 30px; height: 80px; background: linear-gradient(180deg, #2a2a3a 0%, #0a0a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ad-denierShake 2s ease-in-out infinite;
}
.scn-antonio-denied .antonio {
  position: absolute; bottom: 22%; right: 25%; width: 28px; height: 80px; background: linear-gradient(180deg, #3a3a2a 0%, #1a1a0a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ad-antonioReach 3s ease-in-out infinite;
}
.scn-antonio-denied .hand-out {
  position: absolute; bottom: 40%; right: 28%; width: 20px; height: 14px; background: linear-gradient(135deg, #c0b0a0 0%, #a09080 100%); border-radius: 50% 50% 20% 20% / 60% 60% 40% 40%; transform: rotate(-15deg); animation: ad-handExtension 3s ease-in-out infinite;
}
.scn-antonio-denied .purse {
  position: absolute; bottom: 42%; left: 30%; width: 16px; height: 12px; background: radial-gradient(circle, #d0c0a0 0%, #a09070 100%); border-radius: 30% 30% 40% 40%; box-shadow: 0 2px 4px rgba(0,0,0,0.3); animation: ad-purseBob 4s ease-in-out infinite;
}
@keyframes ad-pulseBg { 0% { opacity: 0.8; } 50% { opacity: 1; } 100% { opacity: 0.85; } }
@keyframes ad-tableShift { 0% { transform: perspective(300px) rotateX(10deg) translateY(0); } 50% { transform: perspective(300px) rotateX(12deg) translateY(-2px); } 100% { transform: perspective(300px) rotateX(10deg) translateY(0); } }
@keyframes ad-denierShake { 0% { transform: rotate(-2deg); } 25% { transform: rotate(3deg); } 50% { transform: rotate(-2deg); } 75% { transform: rotate(4deg); } 100% { transform: rotate(-2deg); } }
@keyframes ad-antonioReach { 0% { transform: translateX(0) translateY(0) rotate(5deg); } 50% { transform: translateX(-8px) translateY(-3px) rotate(10deg); } 100% { transform: translateX(0) translateY(0) rotate(5deg); } }
@keyframes ad-handExtension { 0% { transform: rotate(-15deg) translateX(0); } 50% { transform: rotate(-20deg) translateX(10px); } 100% { transform: rotate(-15deg) translateX(0); } }
@keyframes ad-purseBob { 0% { transform: translateY(0) scale(1); } 50% { transform: translateY(-4px) scale(1.05); } 100% { transform: translateY(0) scale(1); } }

/* antonio-accuses */
.scn-antonio-accuses {
  background: linear-gradient(180deg, #f5e6d0 0%, #c9b89a 100%), radial-gradient(ellipse at 60% 40%, rgba(255,235,200,0.5) 0%, transparent 60%);
}
.scn-antonio-accuses .bg {
  position: absolute; inset: 0 0 30% 0; background: linear-gradient(135deg, #e8d8c0 0%, #b8a88a 100%); animation: ac-pulseBg 12s ease-in-out infinite alternate;
}
.scn-antonio-accuses .accuser {
  position: absolute; bottom: 22%; left: 30%; width: 28px; height: 85px; background: linear-gradient(180deg, #2a2a3a 0%, #0a0a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ac-accuserLean 2s ease-in-out infinite;
}
.scn-antonio-accuses .accused {
  position: absolute; bottom: 22%; right: 30%; width: 28px; height: 80px; background: linear-gradient(180deg, #3a3a2a 0%, #1a1a0a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ac-accusedCower 2.5s ease-in-out infinite;
}
.scn-antonio-accuses .pointing-hand {
  position: absolute; bottom: 50%; left: 32%; width: 24px; height: 8px; background: linear-gradient(135deg, #c0b0a0 0%, #a09080 100%); border-radius: 20% 80% 20% 80% / 50% 50% 50% 50%; transform: rotate(30deg); transform-origin: left bottom; animation: ac-pointAccuse 1.8s ease-in-out infinite;
}
.scn-antonio-accuses .shadow {
  position: absolute; bottom: 18%; left: 20%; right: 20%; height: 6%; background: rgba(0,0,0,0.15); border-radius: 50%; filter: blur(5px); animation: ac-shadowDance 3s ease-in-out infinite alternate;
}
.scn-antonio-accuses .light-cast {
  position: absolute; top: 5%; left: 25%; right: 25%; height: 40%; background: radial-gradient(ellipse at 50% 30%, rgba(255,240,220,0.3) 0%, transparent 70%); animation: ac-lightShift 8s ease-in-out infinite alternate;
}
@keyframes ac-pulseBg { 0% { opacity: 0.8; } 50% { opacity: 1; } 100% { opacity: 0.85; } }
@keyframes ac-accuserLean { 0% { transform: translateX(0) rotate(-3deg); } 50% { transform: translateX(-5px) rotate(-8deg); } 100% { transform: translateX(0) rotate(-3deg); } }
@keyframes ac-accusedCower { 0% { transform: translateX(0) translateY(0) scale(1,1); } 50% { transform: translateX(5px) translateY(-3px) scale(0.95,0.95); } 100% { transform: translateX(0) translateY(0) scale(1,1); } }
@keyframes ac-pointAccuse { 0% { transform: rotate(30deg) scaleX(1); } 50% { transform: rotate(40deg) scaleX(1.1); } 100% { transform: rotate(30deg) scaleX(1); } }
@keyframes ac-shadowDance { 0% { transform: scaleX(1); opacity: 0.8; } 50% { transform: scaleX(1.2); opacity: 1; } 100% { transform: scaleX(1); opacity: 0.8; } }
@keyframes ac-lightShift { 0% { background-position: 0% 0%; } 50% { background-position: 20% 10%; } 100% { background-position: 0% 0%; } }

/* Scene: antonio-defends-himself */
.scn-antonio-defends-himself {
  background: 
    linear-gradient(180deg, #f5e6c8 0%, #d9b68c 30%, #b0884a 70%, #5c3a1a 100%),
    radial-gradient(ellipse at 50% 0%, #fff5d6 0%, transparent 60%);
}
.scn-antonio-defends-himself .sunburst {
  position: absolute;
  top: 0; left: 50%; width: 120px; height: 120px;
  transform: translateX(-50%) scale(1);
  background: radial-gradient(circle, #fff7d4 0%, rgba(255,247,212,0.4) 40%, transparent 70%);
  animation: adh-sunpulse 6s ease-in-out infinite alternate;
}
.scn-antonio-defends-himself .ground {
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 38%;
  background: linear-gradient(180deg, #8b6f3a 0%, #5c3a1a 100%);
  border-radius: 30% 70% 0 0 / 50% 40% 0 0;
  box-shadow: inset 0 12px 30px rgba(0,0,0,0.5);
}
.scn-antonio-defends-himself .antonio-figure {
  position: absolute;
  bottom: 32%; left: 40%;
  width: 40px; height: 96px;
  background: linear-gradient(180deg, #3a2814 0%, #1f1106 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: adh-stand 2s ease-in-out infinite alternate;
}
.scn-antonio-defends-himself .antonio-sword {
  position: absolute;
  bottom: 50%; left: 46%;
  width: 4px; height: 60px;
  background: linear-gradient(180deg, #c0a060 0%, #806020 100%);
  border-radius: 2px;
  transform: rotate(-20deg);
  box-shadow: 0 0 12px 2px rgba(255,200,100,0.4);
  animation: adh-swordshine 3s ease-in-out infinite;
}
.scn-antonio-defends-himself .shadow {
  position: absolute;
  bottom: 30%; left: 36%;
  width: 56px; height: 14px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.4) 0%, transparent 70%);
  border-radius: 50%;
  animation: adh-shadowdrift 4s ease-in-out infinite;
}
.scn-antonio-defends-himself .dust {
  position: absolute;
  top: 20%; left: 10%;
  width: 12px; height: 12px;
  background: radial-gradient(circle, rgba(255,220,150,0.3) 0%, transparent 100%);
  border-radius: 50%;
  filter: blur(3px);
  animation: adh-dust 7s linear infinite;
}
@keyframes adh-sunpulse {
  0% { transform: translateX(-50%) scale(1); opacity: 0.7; }
  50% { transform: translateX(-50%) scale(1.05); opacity: 1; }
  100% { transform: translateX(-50%) scale(0.95); opacity: 0.8; }
}
@keyframes adh-stand {
  0% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-2px) rotate(1deg); }
  100% { transform: translateY(0) rotate(0); }
}
@keyframes adh-swordshine {
  0% { box-shadow: 0 0 8px 1px rgba(255,200,100,0.3); }
  50% { box-shadow: 0 0 20px 6px rgba(255,220,120,0.7); }
  100% { box-shadow: 0 0 10px 2px rgba(255,200,100,0.4); }
}
@keyframes adh-shadowdrift {
  0% { transform: scaleX(1); opacity: 0.6; }
  50% { transform: scaleX(1.2); opacity: 0.9; }
  100% { transform: scaleX(1); opacity: 0.6; }
}
@keyframes adh-dust {
  0% { transform: translateY(0) scale(1); opacity: 0.3; }
  50% { transform: translateY(-40px) scale(1.5); opacity: 0; }
  100% { transform: translateY(-80px) scale(2); opacity: 0; }
}

/* Scene: olivia-enters-with-priest */
.scn-olivia-enters-with-priest {
  background: 
    linear-gradient(180deg, #f7dca0 0%, #e8c07a 40%, #c4954a 70%, #7a5820 100%),
    radial-gradient(ellipse at 50% 100%, #fff3c4 0%, transparent 70%);
}
.scn-olivia-enters-with-priest .sky-warm {
  position: absolute;
  inset: 0 0 40% 0;
  background: linear-gradient(180deg, #fae8b8 0%, #f5d88c 60%, transparent 100%);
  animation: oep-skybreathe 10s ease-in-out infinite alternate;
}
.scn-olivia-enters-with-priest .sun-halo {
  position: absolute;
  top: 8%; left: 60%;
  width: 80px; height: 80px;
  background: radial-gradient(circle, #fff8d6 0%, rgba(255,248,214,0.3) 50%, transparent 75%);
  border-radius: 50%;
  filter: blur(4px);
  animation: oep-glow 5s ease-in-out infinite alternate;
}
.scn-olivia-enters-with-priest .ground-path {
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 38%;
  background: linear-gradient(180deg, #b89760 0%, #6b4f1a 100%);
  border-radius: 20% 80% 0 0 / 30% 50% 0 0;
  box-shadow: inset 0 8px 25px rgba(0,0,0,0.4);
}
.scn-olivia-enters-with-priest .olivia-silhouette {
  position: absolute;
  bottom: 32%; left: 38%;
  width: 30px; height: 88px;
  background: linear-gradient(180deg, #2a1a0a 0%, #0d0802 100%);
  border-radius: 50% 50% 40% 40% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: oep-walk 3s ease-in-out infinite;
}
.scn-olivia-enters-with-priest .priest-silhouette {
  position: absolute;
  bottom: 32%; left: 48%;
  width: 34px; height: 92px;
  background: linear-gradient(180deg, #1a1a0a 0%, #080400 100%);
  border-radius: 50% 50% 45% 45% / 50% 50% 50% 50%;
  transform-origin: bottom center;
  animation: oep-walk 3s ease-in-out infinite reverse;
}
.scn-olivia-enters-with-priest .attendant-left {
  position: absolute;
  bottom: 30%; left: 28%;
  width: 22px; height: 70px;
  background: linear-gradient(180deg, #2a1a1a 0%, #100505 100%);
  border-radius: 50% 50% 40% 40% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: oep-attendant 4s ease-in-out infinite;
  animation-delay: -1s;
}
.scn-olivia-enters-with-priest .attendant-right {
  position: absolute;
  bottom: 30%; left: 58%;
  width: 22px; height: 70px;
  background: linear-gradient(180deg, #2a1a1a 0%, #100505 100%);
  border-radius: 50% 50% 40% 40% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: oep-attendant 4s ease-in-out infinite;
  animation-delay: -2.5s;
}
.scn-olivia-enters-with-priest .light-rays {
  position: absolute;
  top: 0; left: 0; right: 0; bottom: 0;
  background: repeating-linear-gradient(
    to bottom,
    transparent 0px,
    rgba(255,250,220,0.06) 2px,
    transparent 4px
  );
  background-size: 100% 8px;
  animation: oep-rays 12s linear infinite;
}
@keyframes oep-skybreathe {
  0% { opacity: 0.7; }
  50% { opacity: 1; }
  100% { opacity: 0.8; }
}
@keyframes oep-glow {
  0% { transform: scale(1); opacity: 0.6; }
  50% { transform: scale(1.2); opacity: 1; }
  100% { transform: scale(0.9); opacity: 0.7; }
}
@keyframes oep-walk {
  0% { transform: translateX(0) translateY(0); }
  25% { transform: translateX(4px) translateY(-1px); }
  50% { transform: translateX(8px) translateY(0); }
  75% { transform: translateX(12px) translateY(-1px); }
  100% { transform: translateX(16px) translateY(0); }
}
@keyframes oep-attendant {
  0% { transform: translateX(0) rotate(0); opacity: 0.7; }
  50% { transform: translateX(6px) rotate(2deg); opacity: 1; }
  100% { transform: translateX(12px) rotate(0); opacity: 0.7; }
}
@keyframes oep-rays {
  0% { background-position: 0 0; }
  100% { background-position: 0 -16px; }
}

/* Scene: orsino-threatens-cesario */
.scn-orsino-threatens-cesario {
  background: 
    linear-gradient(180deg, #d9bf8a 0%, #b39450 40%, #8a6a30 70%, #4a3010 100%),
    radial-gradient(ellipse at 30% 0%, #fff3c4 0%, transparent 60%);
}
.scn-orsino-threatens-cesario .chamber-wall {
  position: absolute;
  inset: 0 0 25% 0;
  background: linear-gradient(180deg, #c8b080 0%, #a08050 100%);
  border-radius: 0 0 20% 20% / 0 0 40% 40%;
  box-shadow: inset 0 10px 30px rgba(0,0,0,0.3);
}
.scn-orsino-threatens-cesario .floor {
  position: absolute;
  bottom: 0; left: 0; right: 0; height: 28%;
  background: linear-gradient(180deg, #7a5a2a 0%, #3a1a00 100%);
  border-radius: 60% 40% 0 0 / 30% 20% 0 0;
  box-shadow: inset 0 6px 20px rgba(0,0,0,0.5);
}
.scn-orsino-threatens-cesario .orsino-figure {
  position: absolute;
  bottom: 28%; left: 25%;
  width: 44px; height: 104px;
  background: linear-gradient(180deg, #2a1a0a 0%, #0d0602 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: otc-orsino 2s ease-in-out infinite alternate;
}
.scn-orsino-threatens-cesario .cesario-figure {
  position: absolute;
  bottom: 28%; left: 55%;
  width: 36px; height: 90px;
  background: linear-gradient(180deg, #2a1a1a 0%, #0d0606 100%);
  border-radius: 50% 50% 40% 40% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: otc-cesario 3s ease-in-out infinite;
}
.scn-orsino-threatens-cesario .orsino-arm {
  position: absolute;
  bottom: 55%; left: 36%;
  width: 8px; height: 50px;
  background: linear-gradient(180deg, #1a1008 0%, #0a0502 100%);
  border-radius: 50% 50% 20% 20% / 30% 30% 20% 20%;
  transform: rotate(-30deg);
  transform-origin: bottom center;
  animation: otc-arm 2s ease-in-out infinite alternate;
}
.scn-orsino-threatens-cesario .dagger-glint {
  position: absolute;
  bottom: 62%; left: 38%;
  width: 4px; height: 28px;
  background: linear-gradient(180deg, #e0c080 0%, #806020 100%);
  border-radius: 2px;
  transform: rotate(-30deg);
  box-shadow: 0 0 12px 3px rgba(255,200,80,0.5);
  animation: otc-glint 1.5s ease-in-out infinite;
}
.scn-orsino-threatens-cesario .shadow-pool {
  position: absolute;
  bottom: 25%; left: 20%;
  width: 120px; height: 40px;
  background: radial-gradient(ellipse, rgba(0,0,0,0.5) 0%, transparent 70%);
  border-radius: 50%;
  animation: otc-pool 5s ease-in-out infinite alternate;
}
@keyframes otc-orsino {
  0% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-2px) rotate(2deg); }
  100% { transform: translateY(0) rotate(-1deg); }
}
@keyframes otc-cesario {
  0% { transform: translateX(0) translateY(0); }
  50% { transform: translateX(-3px) translateY(-1px); }
  100% { transform: translateX(0) translateY(0); }
}
@keyframes otc-arm {
  0% { transform: rotate(-30deg) scaleY(1); }
  50% { transform: rotate(-20deg) scaleY(1.1); }
  100% { transform: rotate(-30deg) scaleY(1); }
}
@keyframes otc-glint {
  0% { box-shadow: 0 0 8px 1px rgba(255,200,80,0.3); opacity: 0.7; }
  50% { box-shadow: 0 0 24px 8px rgba(255,220,120,0.8); opacity: 1; }
  100% { box-shadow: 0 0 10px 2px rgba(255,200,80,0.4); opacity: 0.8; }
}
@keyframes otc-pool {
  0% { transform: scaleX(1); opacity: 0.4; }
  50% { transform: scaleX(1.3); opacity: 0.7; }
  100% { transform: scaleX(1); opacity: 0.4; }
}

/* Scene: olivia-reveals-marriage */
.scn-olivia-reveals-marriage {
  background: 
    linear-gradient(180deg, #e8d4a8 0%, #c8b080 30%, #9a7a4a 60%, #5a3a10 100%),
    radial-gradient(ellipse at 50% 0%, #fff5cc 0%, transparent 60%);
}
.scn-olivia-reveals-marriage .altar-backdrop {
  position: absolute;
  inset: 0 0 30% 0;
  background: linear-gradient(180deg, #d8c8a0 0%, #a88858 100%);
  border-radius: 0 0 30% 30% / 0 0 50% 50%;
  box-shadow: inset 0 15px 40px rgba(0,0,0,0.3);
}
.scn-olivia-reveals-marriage .altar-stone {
  position: absolute;
  bottom: 28%; left: 50%; width: 100px; height: 30px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #b89868 0%, #7a5a2a 100%);
  border-radius: 20% 20% 10% 10%;
  box-shadow: 0 6px 20px rgba(0,0,0,0.5);
}
.scn-olivia-reveals-marriage .olivia-veil {
  position: absolute;
  bottom: 40%; left: 36%;
  width: 40px; height: 100px;
  background: linear-gradient(180deg, #4a3020 0%, #1a0a04 100%);
  border-radius: 50% 50% 40% 40% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: orm-veil 3s ease-in-out infinite;
}
.scn-olivia-reveals-marriage .cesario-profile {
  position: absolute;
  bottom: 38%; left: 52%;
  width: 30px; height: 85px;
  background: linear-gradient(180deg, #2a1a0a 0%, #0d0602 100%);
  border-radius: 50% 50% 40% 40% / 55% 55% 45% 45%;
  transform-origin: bottom center;
  animation: orm-cesario 4s ease-in-out infinite;
}
.scn-olivia-reveals-marriage .priest-hands {
  position: absolute;
  bottom: 45%; left: 43%;
  width: 20px; height: 30px;
  background: radial-gradient(ellipse at center, #3a2a1a 0%, #1a0a04 100%);
  border-radius: 50% 50% 40% 40%;
  transform: rotate(10deg);
  animation: orm-hands 2s ease-in-out infinite alternate;
}
.scn-olivia-reveals-marriage .ring-glow {
  position: absolute;
  bottom: 42%; left: 47%;
  width: 8px; height: 8px;
  background: radial-gradient(circle, #ffd080 0%, #c08040 60%, transparent 100%);
  border-radius: 50%;
  box-shadow: 0 0 20px 5px rgba(255,200,80,0.6);
  animation: orm-ring 1.5s ease-in-out infinite;
}
.scn-olivia-reveals-marriage .marriage-scroll {
  position: absolute;
  bottom: 36%; left: 38%;
  width: 6px; height: 14px;
  background: linear-gradient(180deg, #c0a050 0%, #806020 100%);
  border-radius: 2px;
  transform: rotate(-15deg);
  box-shadow: 0 0 6px rgba(200,160,60,0.4);
  animation: orm-scroll 5s ease-in-out infinite;
}
@keyframes orm-veil {
  0% { transform: translateY(0) rotate(0); }
  50% { transform: translateY(-2px) rotate(2deg); }
  100% { transform: translateY(0) rotate(-2deg); }
}
@keyframes orm-cesario {
  0% { transform: translateX(0) translateY(0); }
  25% { transform: translateX(2px) translateY(-1px); }
  50% { transform: translateX(0) translateY(0); }
  75% { transform: translateX(-2px) translateY(-1px); }
  100% { transform: translateX(0) translateY(0); }
}
@keyframes orm-hands {
  0% { transform: rotate(10deg) scaleY(1); }
  50% { transform: rotate(5deg) scaleY(1.05); }
  100% { transform: rotate(10deg) scaleY(1); }
}
@keyframes orm-ring {
  0% { box-shadow: 0 0 12px 2px rgba(255,200,80,0.4); }
  50% { box-shadow: 0 0 28px 8px rgba(255,220,100,0.8); }
  100% { box-shadow: 0 0 14px 3px rgba(255,200,80,0.5); }
}
@keyframes orm-scroll {
  0% { transform: rotate(-15deg) translateY(0); }
  50% { transform: rotate(-10deg) translateY(-1px); }
  100% { transform: rotate(-15deg) translateY(0); }
}

/* olivia-malvolio-madness */
.scn-olivia-malvolio-madness {
  background: linear-gradient(135deg, #f9e3c0 0%, #d4a66a 40%, #b5834a 100%), radial-gradient(ellipse at 60% 30%, #fff5db 0%, transparent 50%);
  position: relative; overflow: hidden;
}
.scn-olivia-malvolio-madness .sun-wall {
  position: absolute; inset: 0 40% 0 0; background: linear-gradient(180deg, #f5e6c8 0%, #e0c29a 100%);
  box-shadow: inset -8px 0 20px rgba(0,0,0,0.15);
}
.scn-olivia-malvolio-madness .door-frame {
  position: absolute; top: 10%; left: 60%; width: 28%; height: 75%; background: #6b4f34;
  border-radius: 4px; box-shadow: 0 0 0 6px #4e3824, 0 8px 20px rgba(0,0,0,0.4);
}
.scn-olivia-malvolio-madness .door-open {
  position: absolute; top: 12%; left: 62%; width: 24%; height: 71%; background: linear-gradient(180deg, #ffe6b3 0%, #f0cca0 70%, #c9a06a 100%);
  border-radius: 0 4px 4px 0; box-shadow: inset -4px 0 12px rgba(0,0,0,0.2);
  transform-origin: left center; animation: omm-door 4s ease-in-out infinite alternate;
}
.scn-olivia-malvolio-madness .malvolio-fig {
  position: absolute; bottom: 8%; left: 68%; width: 10%; height: 45%; background: linear-gradient(180deg, #1a1a1a 0%, #2a2a2a 100%);
  border-radius: 20% 20% 10% 10% / 40% 40% 30% 30%; transform: translateY(0);
  box-shadow: -2px 0 8px rgba(0,0,0,0.5); animation: omm-figure 6s ease-in-out infinite;
}
.scn-olivia-malvolio-madness .shadow-floor {
  position: absolute; bottom: 6%; left: 60%; width: 35%; height: 4%; background: rgba(0,0,0,0.3);
  border-radius: 50%; filter: blur(4px); animation: omm-shadow 6s ease-in-out infinite;
}
.scn-olivia-malvolio-madness .chair-foreground {
  position: absolute; bottom: 5%; left: 25%; width: 14%; height: 30%; background: linear-gradient(180deg, #5a3f2b 0%, #3a2a1a 100%);
  border-radius: 10% 10% 5% 5%; box-shadow: 0 4px 10px rgba(0,0,0,0.4);
  transform: skewY(2deg);
}
@keyframes omm-door {
  0% { transform: rotateY(0deg); } 50% { transform: rotateY(-20deg); } 100% { transform: rotateY(0deg); }
}
@keyframes omm-figure {
  0% { transform: translateX(0) rotate(0deg); } 25% { transform: translateX(4%) rotate(2deg); } 50% { transform: translateX(2%) rotate(-1deg); } 75% { transform: translateX(6%) rotate(1deg); } 100% { transform: translateX(0) rotate(0deg); }
}
@keyframes omm-shadow {
  0% { opacity: 0.6; transform: scaleX(1); } 25% { opacity: 0.8; transform: scaleX(1.2); } 50% { opacity: 0.7; transform: scaleX(0.9); } 75% { opacity: 0.9; transform: scaleX(1.1); } 100% { opacity: 0.6; transform: scaleX(1); }
}

/* malvolio-cross-gartered */
.scn-malvolio-cross-gartered {
  background: linear-gradient(180deg, #ebe1c1 0%, #dacba5 40%, #b8a07e 100%), radial-gradient(ellipse at 50% 20%, #fff5e6 0%, transparent 60%);
  position: relative; overflow: hidden;
}
.scn-malvolio-cross-gartered .wall-bright {
  position: absolute; inset: 0 0 35% 0; background: linear-gradient(180deg, #f2e8d0 0%, #d9c9a6 100%);
  box-shadow: inset 0 -10px 20px rgba(0,0,0,0.05);
}
.scn-malvolio-cross-gartered .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%; background: linear-gradient(180deg, #c4b091 0%, #a0886a 100%);
  border-radius: 30% 70% 0 0 / 10% 30% 0 0;
}
.scn-malvolio-cross-gartered .leg-left {
  position: absolute; bottom: 30%; left: 35%; width: 8%; height: 35%; background: linear-gradient(180deg, #3a4a5e 0%, #2a3a4e 100%);
  border-radius: 10% 10% 20% 20%; transform-origin: top center; animation: mcg-leg 2.4s ease-in-out infinite alternate;
}
.scn-malvolio-cross-gartered .leg-right {
  position: absolute; bottom: 30%; left: 48%; width: 8%; height: 35%; background: linear-gradient(180deg, #3a4a5e 0%, #2a3a4e 100%);
  border-radius: 10% 10% 20% 20%; transform-origin: top center; animation: mcg-leg 2.4s ease-in-out infinite alternate-reverse;
}
.scn-malvolio-cross-gartered .stocking-yellow {
  position: absolute; bottom: 30%; left: 35%; width: 8%; height: 20%; background: linear-gradient(180deg, #f0d060 0%, #d4b040 100%);
  border-radius: 10% 10% 30% 30%; box-shadow: 0 4px 6px rgba(0,0,0,0.15);
  animation: mcg-leg 2.4s ease-in-out infinite alternate;
}
.scn-malvolio-cross-gartered .garter-band {
  position: absolute; bottom: 48%; left: 35%; width: 8%; height: 4%; background: #c04030; /* desaturated red, acceptable */
  border-radius: 4px; box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  animation: mcg-leg 2.4s ease-in-out infinite alternate;
}
.scn-malvolio-cross-gartered .body-torso {
  position: absolute; bottom: 60%; left: 36%; width: 18%; height: 30%; background: linear-gradient(180deg, #6a7a4a 0%, #4a5a2a 100%);
  border-radius: 30% 30% 10% 10% / 50% 50% 20% 20%; transform-origin: bottom center; animation: mcg-body 1.6s ease-in-out infinite alternate;
}
.scn-malvolio-cross-gartered .hat-bouncy {
  position: absolute; bottom: 88%; left: 40%; width: 14%; height: 6%; background: #2a3a4e;
  border-radius: 30% 30% 10% 10%; box-shadow: 0 2px 6px rgba(0,0,0,0.2);
  animation: mcg-hat 1.8s ease-in-out infinite alternate;
}
@keyframes mcg-leg {
  0% { transform: rotate(-10deg) scaleY(1); } 50% { transform: rotate(5deg) scaleY(1.1); } 100% { transform: rotate(-5deg) scaleY(1); }
}
@keyframes mcg-body {
  0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-4%) rotate(2deg); } 100% { transform: translateY(0) rotate(0deg); }
}
@keyframes mcg-hat {
  0% { transform: translateY(0) rotate(5deg); } 25% { transform: translateY(-8%) rotate(-5deg); } 50% { transform: translateY(2%) rotate(3deg); } 75% { transform: translateY(-4%) rotate(-2deg); } 100% { transform: translateY(0) rotate(0deg); }
}

/* malvolio-quotes-letter */
.scn-malvolio-quotes-letter {
  background: linear-gradient(180deg, #efdbb0 0%, #d8c096 40%, #bfa578 100%), radial-gradient(ellipse at 50% 30%, #fff4d0 0%, transparent 50%);
  position: relative; overflow: hidden;
}
.scn-malvolio-quotes-letter .bg-panel {
  position: absolute; inset: 0 0 30% 0; background: linear-gradient(180deg, #ecd6b0 0%, #d4be94 100%);
  box-shadow: inset 0 -8px 20px rgba(0,0,0,0.05);
}
.scn-malvolio-quotes-letter .letter-paper {
  position: absolute; bottom: 30%; left: 30%; width: 40%; height: 35%; background: linear-gradient(180deg, #faf0dc 0%, #f2e4c8 100%);
  border-radius: 4px; box-shadow: 0 6px 12px rgba(0,0,0,0.2), inset 0 0 0 2px #d0b890;
  transform-origin: center bottom; animation: mql-letter 5s ease-in-out infinite;
}
.scn-malvolio-quotes-letter .hand-left {
  position: absolute; bottom: 42%; left: 28%; width: 8%; height: 20%; background: #d4a67a;
  border-radius: 40% 40% 20% 20% / 30% 30% 20% 20%; transform: rotate(-20deg);
  animation: mql-hand 4s ease-in-out infinite alternate;
}
.scn-malvolio-quotes-letter .hand-right {
  position: absolute; bottom: 42%; left: 52%; width: 8%; height: 20%; background: #d4a67a;
  border-radius: 40% 40% 20% 20% / 30% 30% 20% 20%; transform: rotate(20deg);
  animation: mql-hand 4s ease-in-out infinite alternate-reverse;
}
.scn-malvolio-quotes-letter .malvolio-head {
  position: absolute; bottom: 65%; left: 36%; width: 18%; height: 22%; background: linear-gradient(180deg, #d4a67a 0%, #b88a64 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  animation: mql-head 6s ease-in-out infinite;
}
.scn-malvolio-quotes-letter .malvolio-eye {
  position: absolute; bottom: 78%; left: 40%; width: 3%; height: 4%; background: #2a1a0a;
  border-radius: 50%; box-shadow: 0 0 4px rgba(0,0,0,0.2);
  animation: mql-eye 3s ease-in-out infinite alternate;
}
.scn-malvolio-quotes-letter .malvolio-mouth {
  position: absolute; bottom: 70%; left: 43%; width: 6%; height: 3%; background: transparent;
  border-bottom: 3px solid #5a3a2a; border-radius: 50%; transform: rotate(5deg);
  animation: mql-mouth 4s ease-in-out infinite alternate;
}
@keyframes mql-letter {
  0% { transform: translateY(0) rotate(0deg); } 25% { transform: translateY(-2%) rotate(3deg); } 50% { transform: translateY(1%) rotate(-2deg); } 75% { transform: translateY(-1%) rotate(1deg); } 100% { transform: translateY(0) rotate(0deg); }
}
@keyframes mql-hand {
  0% { transform: rotate(-20deg) translateX(0); } 50% { transform: rotate(-15deg) translateX(5%); } 100% { transform: rotate(-25deg) translateX(-2%); }
}
@keyframes mql-head {
  0% { transform: translateY(0) rotate(0deg); } 33% { transform: translateY(-3%) rotate(2deg); } 66% { transform: translateY(2%) rotate(-1deg); } 100% { transform: translateY(0) rotate(0deg); }
}
@keyframes mql-eye {
  0% { transform: scaleY(1); } 50% { transform: scaleY(0.3); } 100% { transform: scaleY(1); }
}
@keyframes mql-mouth {
  0% { border-bottom-width: 3px; transform: rotate(5deg) scaleX(1); } 50% { border-bottom-width: 5px; transform: rotate(-5deg) scaleX(1.2); } 100% { border-bottom-width: 3px; transform: rotate(5deg) scaleX(1); }
}

/* servent-announces-cesario */
.scn-servent-announces-cesario {
  background: linear-gradient(180deg, #e8dcc8 0%, #d4c4ac 40%, #b8a890 100%), radial-gradient(ellipse at 40% 30%, #f5ede0 0%, transparent 50%);
  position: relative; overflow: hidden;
}
.scn-servent-announces-cesario .room-wall {
  position: absolute; inset: 0 0 30% 0; background: linear-gradient(180deg, #ece3d4 0%, #d6cbb8 100%);
  box-shadow: inset 0 -12px 24px rgba(0,0,0,0.05);
}
.scn-servent-announces-cesario .window-right {
  position: absolute; top: 5%; right: 8%; width: 20%; height: 40%; background: linear-gradient(180deg, #b8d4e8 0%, #8ab0c8 100%);
  border-radius: 4px; box-shadow: inset 0 0 0 6px #6b5a4e, 0 8px 16px rgba(0,0,0,0.1);
  animation: sac-window 10s ease-in-out infinite alternate;
}
.scn-servent-announces-cesario .servant-door {
  position: absolute; bottom: 30%; left: 15%; width: 22%; height: 65%; background: linear-gradient(180deg, #7a6a5a 0%, #5a4a3a 100%);
  border-radius: 2px 2px 0 0; box-shadow: 0 6px 12px rgba(0,0,0,0.3);
  transform-origin: left center; animation: sac-door 8s ease-in-out infinite;
}
.scn-servent-announces-cesario .servant-figure {
  position: absolute; bottom: 30%; left: 20%; width: 8%; height: 40%; background: linear-gradient(180deg, #3a4a5e 0%, #2a3a4e 100%);
  border-radius: 15% 15% 10% 10% / 35% 35% 20% 20%; box-shadow: -2px 0 6px rgba(0,0,0,0.2);
  animation: sac-servant 6s ease-in-out infinite;
}
.scn-servent-announces-cesario .olivia-chair {
  position: absolute; bottom: 0; left: 55%; width: 16%; height: 40%; background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 10% 10% 5% 5%; box-shadow: 0 4px 8px rgba(0,0,0,0.3);
  transform: skewY(-2deg);
}
.scn-servent-announces-cesario .olivia-figure {
  position: absolute; bottom: 32%; left: 57%; width: 10%; height: 30%; background: linear-gradient(180deg, #7a8a6a 0%, #5a6a4a 100%);
  border-radius: 40% 40% 20% 20% / 50% 50% 30% 30%; box-shadow: 0 4px 8px rgba(0,0,0,0.15);
  animation: sac-olivia 8s ease-in-out infinite alternate;
}
.scn-servent-announces-cesario .table-small {
  position: absolute; bottom: 20%; left: 50%; width: 20%; height: 8%; background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 10%; box-shadow: 0 2px 6px rgba(0,0,0,0.2);
}
@keyframes sac-window {
  0% { opacity: 0.8; transform: scaleY(1); } 50% { opacity: 1; transform: scaleY(1.05); } 100% { opacity: 0.9; transform: scaleY(1); }
}
@keyframes sac-door {
  0% { transform: rotateY(0deg); } 25% { transform: rotateY(-15deg); } 50% { transform: rotateY(0deg); } 75% { transform: rotateY(-5deg); } 100% { transform: rotateY(0deg); }
}
@keyframes sac-servant {
  0% { transform: translateX(0) rotate(0deg); } 30% { transform: translateX(2%) rotate(1deg); } 60% { transform: translateX(-1%) rotate(-0.5deg); } 100% { transform: translateX(0) rotate(0deg); }
}
@keyframes sac-olivia {
  0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2%) rotate(1deg); } 100% { transform: translateY(0) rotate(0deg); }
}

/* Scene 1: malvolio-argues-sanity */
.scn-malvolio-argues-sanity {
  background: 
    radial-gradient(ellipse at 50% 30%, #1a1a30 0%, #0c0c1a 60%, #050510 100%),
    linear-gradient(0deg, #0a0a15 0%, #12122a 50%, #0c0c1a 100%);
}
.scn-malvolio-argues-sanity .bg-deep        { position:absolute; inset:0; background:radial-gradient(ellipse at 40% 60%, #15152e 0%, transparent 70%); animation:ma-bg 12s ease-in-out infinite alternate; }
.scn-malvolio-argues-sanity .back-wall      { position:absolute; bottom:30%; left:10%; right:10%; top:10%; background:linear-gradient(135deg, #1e1e3a 0%, #14142a 100%); border-radius:4px; box-shadow:inset 0 0 20px #000; }
.scn-malvolio-argues-sanity .floor          { position:absolute; bottom:0; left:0; right:0; height:30%; background:linear-gradient(180deg, #0a0a12 0%, #050508 100%); }
.scn-malvolio-argues-sanity .window-grate   { position:absolute; top:12%; left:50%; width:50px; height:30px; transform:translateX(-50%); background:repeating-linear-gradient(90deg, #2a2a3a 0px, #2a2a3a 3px, transparent 3px, transparent 8px); border:2px solid #1a1a2a; border-radius:2px; box-shadow:0 0 12px rgba(200,200,220,0.1); animation:ma-grate 4s ease-in-out infinite alternate; }
.scn-malvolio-argues-sanity .light-beam     { position:absolute; top:15%; left:35%; width:30%; height:60%; background:linear-gradient(180deg, rgba(220,220,255,0.12) 0%, transparent 100%); clip-path:polygon(0 0, 100% 0, 80% 100%, 20% 100%); animation:ma-beam 6s ease-in-out infinite; }
.scn-malvolio-argues-sanity .figure-mal     { position:absolute; bottom:30%; left:40%; width:24px; height:48px; background:linear-gradient(180deg, #1a1a2a 0%, #0a0a15 100%); border-radius:50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin:bottom center; animation:ma-figure 3s ease-in-out infinite; }
.scn-malvolio-argues-sanity .chain          { position:absolute; bottom:30%; left:48%; width:4px; height:20px; background:repeating-linear-gradient(0deg, #2a2a3a 0px, #2a2a3a 4px, transparent 4px, transparent 8px); animation:ma-chain 2s ease-in-out infinite; }

@keyframes ma-bg     { 0% { opacity:.7 } 50% { opacity:1 } 100% { opacity:.6 } }
@keyframes ma-grate  { 0% { opacity:.3 } 50% { opacity:.6 } 100% { opacity:.4 } }
@keyframes ma-beam   { 0% { transform:rotate(-2deg); opacity:.3 } 50% { transform:rotate(2deg); opacity:.6 } 100% { transform:rotate(-1deg); opacity:.4 } }
@keyframes ma-figure { 0% { transform:translateY(0) rotate(-2deg) } 25% { transform:translateY(-3px) rotate(1deg) } 50% { transform:translateY(0) rotate(2deg) } 75% { transform:translateY(-1px) rotate(-1deg) } 100% { transform:translateY(0) rotate(0) } }
@keyframes ma-chain  { 0% { transform:rotate(-10deg) } 50% { transform:rotate(10deg) } 100% { transform:rotate(-5deg) } }

/* Scene 2: clown-sings-to-malvolio */
.scn-clown-sings-to-malvolio {
  background: 
    radial-gradient(ellipse at 50% 80%, #1f1f30 0%, #0d0d1a 60%, #060610 100%),
    linear-gradient(0deg, #0a0a12 0%, #14142a 50%, #0d0d1a 100%);
}
.scn-clown-sings-to-malvolio .bg-dim        { position:absolute; inset:0; background:linear-gradient(180deg, #1a1a2e 0%, #0e0e1c 100%); }
.scn-clown-sings-to-malvolio .cell-wall     { position:absolute; bottom:30%; left:5%; right:5%; top:8%; background:linear-gradient(135deg, #1c1c32 0%, #121224 100%); border-radius:3px; box-shadow:inset 0 0 30px #000; }
.scn-clown-sings-to-malvolio .floor         { position:absolute; bottom:0; left:0; right:0; height:30%; background:linear-gradient(180deg, #0c0c16 0%, #06060c 100%); }
.scn-clown-sings-to-malvolio .candle-light  { position:absolute; bottom:40%; left:30%; width:20px; height:30px; background:radial-gradient(circle at 50% 20%, #ffdd80 0%, #d4a050 40%, transparent 70%); border-radius:50%; box-shadow:0 0 40px 10px rgba(255,220,100,0.3); animation:cs-candle 1.5s ease-in-out infinite; }
.scn-clown-sings-to-malvolio .clown-sil     { position:absolute; bottom:32%; left:22%; width:28px; height:50px; background:linear-gradient(180deg, #1a1a2e 0%, #0a0a18 100%); border-radius:50% 50% 40% 40% / 50% 50% 30% 30%; transform-origin:bottom center; animation:cs-clown 2s ease-in-out infinite; }
.scn-clown-sings-to-malvolio .mal-sil       { position:absolute; bottom:30%; left:55%; width:22px; height:46px; background:linear-gradient(180deg, #2a2a3e 0%, #10101a 100%); border-radius:50% 50% 30% 30% / 60% 60% 30% 30%; animation:cs-mal 3s ease-in-out infinite; }
.scn-clown-sings-to-malvolio .shadow        { position:absolute; bottom:30%; left:20%; width:30px; height:8px; background:rgba(0,0,0,0.5); border-radius:50%; filter:blur(4px); animation:cs-shadow 2s ease-in-out infinite; }

@keyframes cs-candle  { 0% { transform:scale(1); opacity:.7 } 20% { transform:scale(1.1); opacity:1 } 40% { transform:scale(0.95); opacity:.8 } 60% { transform:scale(1.05); opacity:.9 } 80% { transform:scale(1.15); opacity:1 } 100% { transform:scale(1); opacity:.7 } }
@keyframes cs-clown   { 0% { transform:translateY(0) rotate(-3deg) scaleY(1) } 25% { transform:translateY(-5px) rotate(3deg) scaleY(1.1) } 50% { transform:translateY(0) rotate(0) scaleY(0.95) } 75% { transform:translateY(-3px) rotate(-2deg) scaleY(1.05) } 100% { transform:translateY(0) rotate(-3deg) scaleY(1) } }
@keyframes cs-mal     { 0% { transform:translateX(0) rotate(0) } 25% { transform:translateX(-2px) rotate(-2deg) } 50% { transform:translateX(0) rotate(0) } 75% { transform:translateX(1px) rotate(2deg) } 100% { transform:translateX(0) rotate(0) } }
@keyframes cs-shadow  { 0% { transform:translateX(0); opacity:.4 } 25% { transform:translateX(-3px); opacity:.6 } 50% { transform:translateX(0); opacity:.4 } 75% { transform:translateX(2px); opacity:.5 } 100% { transform:translateX(0); opacity:.4 } }

/* Scene 3: malvolio-pleads-for-help */
.scn-malvolio-pleads-for-help {
  background: 
    radial-gradient(ellipse at 50% 25%, #12122a 0%, #080814 60%, #020208 100%),
    linear-gradient(0deg, #060612 0%, #0c0c1e 50%, #080814 100%);
}
.scn-malvolio-pleads-for-help .bg-pitch        { position:absolute; inset:0; background:linear-gradient(180deg, #0e0e20 0%, #060612 100%); }
.scn-malvolio-pleads-for-help .back-grate      { position:absolute; top:5%; left:30%; right:30%; height:20%; background:repeating-linear-gradient(90deg, #1a1a2a 0px, #1a1a2a 3px, transparent 3px, transparent 8px); border-radius:2px; box-shadow:0 0 20px rgba(200,200,220,0.05); }
.scn-malvolio-pleads-for-help .floor           { position:absolute; bottom:0; left:0; right:0; height:30%; background:linear-gradient(180deg, #080812 0%, #040408 100%); }
.scn-malvolio-pleads-for-help .spotlight       { position:absolute; top:10%; left:35%; width:30%; height:80%; background:linear-gradient(180deg, rgba(220,220,255,0.08) 0%, transparent 100%); clip-path:polygon(0 0, 100% 0, 85% 100%, 15% 100%); animation:mp-spot 5s ease-in-out infinite; }
.scn-malvolio-pleads-for-help .figure-kneeling { position:absolute; bottom:28%; left:45%; width:24px; height:36px; background:linear-gradient(180deg, #1a1a2e 0%, #0a0a16 100%); border-radius:50% 50% 40% 40% / 60% 60% 30% 30%; transform-origin:bottom center; animation:mp-kneel 2.5s ease-in-out infinite; }
.scn-malvolio-pleads-for-help .arms            { position:absolute; bottom:38%; left:42%; width:30px; height:20px; background:linear-gradient(180deg, #1a1a2e 0%, #0a0a16 100%); border-radius:60% 60% 0 0 / 80% 80% 0 0; transform:rotate(20deg); transform-origin:bottom left; animation:mp-arms 1.8s ease-in-out infinite; }
.scn-malvolio-pleads-for-help .chain-shadow    { position:absolute; bottom:30%; left:50%; width:2px; height:12px; background:rgba(30,30,50,0.5); filter:blur(2px); animation:mp-chain 3s ease-in-out infinite; }

@keyframes mp-spot   { 0% { opacity:.2 } 50% { opacity:.5 } 100% { opacity:.3 } }
@keyframes mp-kneel  { 0% { transform:translateY(0) rotate(0) scaleY(1) } 50% { transform:translateY(-2px) rotate(2deg) scaleY(0.95) } 100% { transform:translateY(0) rotate(0) scaleY(1) } }
@keyframes mp-arms   { 0% { transform:rotate(15deg) } 50% { transform:rotate(25deg) } 100% { transform:rotate(15deg) } }
@keyframes mp-chain  { 0% { transform:rotate(-5deg); opacity:.4 } 50% { transform:rotate(5deg); opacity:.7 } 100% { transform:rotate(-5deg); opacity:.4 } }

/* Scene 4: sebastian-soliloquy */
.scn-sebastian-soliloquy {
  background: 
    radial-gradient(ellipse at 70% 30%, #fff9e0 0%, #b8d4e0 60%, #7a9ebf 100%),
    linear-gradient(180deg, #cce8ff 0%, #a0c8e0 50%, #78a0c0 100%);
}
.scn-sebastian-soliloquy .sky-sun     { position:absolute; inset:0; background:linear-gradient(135deg, #d4edff 0%, #9cc4dc 100%); animation:ss-sky 20s ease-in-out infinite; }
.scn-sebastian-soliloquy .sun-glow    { position:absolute; top:10%; right:15%; width:60px; height:60px; background:radial-gradient(circle, #ffe680 0%, #ffcc55 30%, transparent 70%); border-radius:50%; box-shadow:0 0 80px 30px rgba(255,230,140,0.4); animation:ss-sun 30s ease-in-out infinite alternate; }
.scn-sebastian-soliloquy .cloud-a     { position:absolute; top:14%; left:-20%; width:80px; height:20px; background:rgba(255,255,255,0.6); border-radius:40px; filter:blur(6px); animation:ss-cloud 40s linear infinite; }
.scn-sebastian-soliloquy .cloud-b     { position:absolute; top:22%; right:-30%; width:60px; height:16px; background:rgba(255,255,255,0.5); border-radius:30px; filter:blur(5px); animation:ss-cloud 50s linear infinite reverse; }
.scn-sebastian-soliloquy .tree-trunk  { position:absolute; bottom:30%; left:15%; width:12px; height:70%; background:linear-gradient(180deg, #6a5a3a 0%, #4a3a2a 100%); border-radius:2px; }
.scn-sebastian-soliloquy .foliage     { position:absolute; bottom:55%; left:5%; width:40px; height:40px; background:#4a7a3a; border-radius:50%; box-shadow: -10px -5px 0 #3a6a2a, 10px -8px 0 #5a8a4a; animation:ss-foliage 8s ease-in-out infinite alternate; }
.scn-sebastian-soliloquy .ground-garden { position:absolute; bottom:0; left:0; right:0; height:30%; background:linear-gradient(180deg, #5a8a4a 0%, #3a6a2a 100%); border-radius:20% 20% 0 0 / 30% 30% 0 0; }
.scn-sebastian-soliloquy .figure-seb  { position:absolute; bottom:28%; left:35%; width:22px; height:54px; background:linear-gradient(180deg, #2a3a4a 0%, #1a2a3a 100%); border-radius:50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin:bottom center; animation:ss-figure 6s ease-in-out infinite; }
.scn-sebastian-soliloquy .pearl       { position:absolute; bottom:38%; left:32%; width:8px; height:8px; background:radial-gradient(circle, #fff 0%, #e0e8f0 60%, transparent 80%); border-radius:50%; box-shadow:0 0 12px 4px rgba(255,255,255,0.5); animation:ss-pearl 4s ease-in-out infinite; }

@keyframes ss-sky     { 0% { background:linear-gradient(135deg, #d4edff 0%, #9cc4dc 100%) } 50% { background:linear-gradient(135deg, #b8ddf0 0%, #80b0d0 100%) } 100% { background:linear-gradient(135deg, #d4edff 0%, #9cc4dc 100%) } }
@keyframes ss-sun     { 0% { transform:scale(1); opacity:.9 } 50% { transform:scale(1.08); opacity:1 } 100% { transform:scale(0.95); opacity:.85 } }
@keyframes ss-cloud   { 0% { transform:translateX(0) } 100% { transform:translateX(150vw) } }
@keyframes ss-foliage { 0% { transform:rotate(-2deg) scaleY(1) } 50% { transform:rotate(2deg) scaleY(1.05) } 100% { transform:rotate(-2deg) scaleY(1) } }
@keyframes ss-figure  { 0% { transform:translateY(0) rotate(0) } 25% { transform:translateY(-2px) rotate(1deg) } 50% { transform:translateY(0) rotate(0) } 75% { transform:translateY(-1px) rotate(-1deg) } 100% { transform:translateY(0) rotate(0) } }
@keyframes ss-pearl   { 0% { opacity:.7; transform:scale(1) } 50% { opacity:1; transform:scale(1.3) } 100% { opacity:.7; transform:scale(1) } }

/* olivia-viola-encounter */
.scn-olivia-viola-encounter {
  background: linear-gradient(180deg, #f0e6d0 0%, #c8b88a 40%, #a09860 100%), radial-gradient(ellipse at 70% 30%, #f8f0d0 0%, transparent 50%);
}
.scn-olivia-viola-encounter .sky {
  position:absolute; inset:0 0 55% 0;
  background: linear-gradient(180deg, #f8f4e0 0%, #d8d0b0 60%, transparent 100%);
  animation: ov-sky 8s ease-in-out infinite alternate;
}
.scn-olivia-viola-encounter .sunlight {
  position:absolute; inset:0;
  background: radial-gradient(ellipse at 60% 20%, rgba(255,240,180,0.6) 0%, transparent 60%);
  animation: ov-sunlight 6s ease-in-out infinite alternate;
}
.scn-olivia-viola-encounter .garden-bg {
  position:absolute; bottom:25%; left:10%; right:10%; height:40%;
  background: linear-gradient(180deg, #8a9a6a 0%, #6a7a4a 50%, #4a5a2a 100%);
  border-radius: 30% 60% 0 0;
  box-shadow: inset 0 8px 20px rgba(0,0,0,0.3);
  animation: ov-garden 12s ease-in-out infinite alternate;
}
.scn-olivia-viola-encounter .figure-olivia {
  position:absolute; bottom:22%; left:35%; width:24px; height:50px;
  background: linear-gradient(180deg, #c0a080 0%, #8a6a4a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ov-figure-olivia 4s ease-in-out infinite;
}
.scn-olivia-viola-encounter .figure-cesario {
  position:absolute; bottom:20%; left:55%; width:22px; height:48px;
  background: linear-gradient(180deg, #b0a090 0%, #6a5a4a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ov-figure-cesario 4.5s ease-in-out infinite;
}
.scn-olivia-viola-encounter .shadow-olivia {
  position:absolute; bottom:16%; left:33%; width:30px; height:6px;
  background: rgba(0,0,0,0.25);
  border-radius:50%;
  filter: blur(3px);
  animation: ov-shadow 4s ease-in-out infinite;
}
.scn-olivia-viola-encounter .shadow-cesario {
  position:absolute; bottom:14%; left:53%; width:28px; height:5px;
  background: rgba(0,0,0,0.2);
  border-radius:50%;
  filter: blur(3px);
  animation: ov-shadow 4.5s ease-in-out infinite;
}
.scn-olivia-viola-encounter .leaf-a {
  position:absolute; top:15%; left:20%; width:12px; height:8px;
  background: #7a8a4a;
  border-radius:50%;
  filter: blur(2px);
  animation: ov-leaf-a 7s ease-in-out infinite alternate;
}
.scn-olivia-viola-encounter .leaf-b {
  position:absolute; top:25%; right:15%; width:10px; height:6px;
  background: #8a9a5a;
  border-radius:50%;
  filter: blur(2px);
  animation: ov-leaf-b 9s ease-in-out infinite alternate;
}
@keyframes ov-sky { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.7 } }
@keyframes ov-sunlight { 0% { opacity:0.5 } 50% { opacity:0.9 } 100% { opacity:0.6 } }
@keyframes ov-garden { 0% { transform: translateY(0) } 50% { transform: translateY(-4px) } 100% { transform: translateY(0) } }
@keyframes ov-figure-olivia { 0% { transform: translateX(0) rotate(-2deg); } 25% { transform: translateX(-3px) rotate(1deg); } 50% { transform: translateX(0) rotate(2deg); } 75% { transform: translateX(3px) rotate(-1deg); } 100% { transform: translateX(0) rotate(-2deg); } }
@keyframes ov-figure-cesario { 0% { transform: translateX(0) rotate(2deg); } 25% { transform: translateX(3px) rotate(-1deg); } 50% { transform: translateX(0) rotate(-2deg); } 75% { transform: translateX(-3px) rotate(1deg); } 100% { transform: translateX(0) rotate(2deg); } }
@keyframes ov-shadow { 0% { transform: scaleX(1); opacity:0.6; } 50% { transform: scaleX(0.9); opacity:1; } 100% { transform: scaleX(1); opacity:0.6; } }
@keyframes ov-leaf-a { 0% { transform: translate(0,0) rotate(0deg); } 50% { transform: translate(15px,-10px) rotate(30deg); } 100% { transform: translate(0,0) rotate(0deg); } }
@keyframes ov-leaf-b { 0% { transform: translate(0,0) rotate(0deg); } 50% { transform: translate(-10px,8px) rotate(-20deg); } 100% { transform: translate(0,0) rotate(0deg); } }

/* sir-toby-sir-andrew-jealousy */
.scn-sir-toby-sir-andrew-jealousy {
  background: linear-gradient(180deg, #2a1a1a 0%, #3a2a2a 40%, #1a1a1a 100%), radial-gradient(ellipse at 50% 80%, #4a3a3a 0%, transparent 70%);
}
.scn-sir-toby-sir-andrew-jealousy .wall-left {
  position:absolute; inset:0 60% 0 0;
  background: linear-gradient(90deg, #3a2a2a 0%, #2a1a1a 100%);
  box-shadow: inset -8px 0 12px rgba(0,0,0,0.5);
  animation: st-wall 10s ease-in-out infinite alternate;
}
.scn-sir-toby-sir-andrew-jealousy .wall-right {
  position:absolute; inset:0 0 0 40%;
  background: linear-gradient(90deg, #2a1a1a 0%, #3a2a2a 100%);
  box-shadow: inset 8px 0 12px rgba(0,0,0,0.5);
  animation: st-wall 10s ease-in-out infinite alternate-reverse;
}
.scn-sir-toby-sir-andrew-jealousy .table {
  position:absolute; bottom:18%; left:20%; width:60%; height:8%;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a2a1a 100%);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.6);
  animation: st-table 8s ease-in-out infinite alternate;
}
.scn-sir-toby-sir-andrew-jealousy .candle {
  position:absolute; bottom:26%; left:48%; width:6px; height:18px;
  background: linear-gradient(180deg, #d0a070 0%, #a08050 100%);
  border-radius: 2px;
  box-shadow: 0 0 20px 6px #ffc080;
  animation: st-candle 3s ease-in-out infinite alternate;
}
.scn-sir-toby-sir-andrew-jealousy .sir-toby {
  position:absolute; bottom:12%; left:30%; width:40px; height:60px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: st-toby 5s ease-in-out infinite;
}
.scn-sir-toby-sir-andrew-jealousy .sir-andrew {
  position:absolute; bottom:14%; left:55%; width:28px; height:50px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: st-andrew 4s ease-in-out infinite;
}
.scn-sir-toby-sir-andrew-jealousy .shadow-pool {
  position:absolute; bottom:8%; left:25%; width:50%; height:10%;
  background: radial-gradient(ellipse at 50% 100%, rgba(0,0,0,0.5) 0%, transparent 70%);
  opacity:0.6;
  animation: st-shadow-pool 6s ease-in-out infinite alternate;
}
.scn-sir-toby-sir-andrew-jealousy .glow {
  position:absolute; bottom:25%; left:46%; width:20px; height:20px;
  background: radial-gradient(circle, #ffd090 0%, transparent 70%);
  filter: blur(8px);
  animation: st-glow 3s ease-in-out infinite alternate;
}
@keyframes st-wall { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.8 } }
@keyframes st-table { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(0) } }
@keyframes st-candle { 0% { height:18px; box-shadow: 0 0 20px 6px #ffc080; } 50% { height:20px; box-shadow: 0 0 30px 10px #ffd090; } 100% { height:18px; box-shadow: 0 0 20px 6px #ffc080; } }
@keyframes st-toby { 0% { transform: translateX(0) rotate(-2deg); } 20% { transform: translateX(-4px) rotate(1deg); } 40% { transform: translateX(0) rotate(2deg); } 60% { transform: translateX(4px) rotate(-1deg); } 80% { transform: translateX(0) rotate(-2deg); } 100% { transform: translateX(0) rotate(-2deg); } }
@keyframes st-andrew { 0% { transform: translateX(0) rotate(2deg); } 25% { transform: translateX(3px) rotate(-1deg); } 50% { transform: translateX(0) rotate(-2deg); } 75% { transform: translateX(-3px) rotate(1deg); } 100% { transform: translateX(0) rotate(2deg); } }
@keyframes st-shadow-pool { 0% { opacity:0.4; transform: scaleX(1); } 50% { opacity:0.7; transform: scaleX(0.95); } 100% { opacity:0.4; transform: scaleX(1); } }
@keyframes st-glow { 0% { opacity:0.6; filter: blur(6px); } 50% { opacity:1; filter: blur(10px); } 100% { opacity:0.6; filter: blur(6px); } }

/* malvolio-in-yellow-stockings */
.scn-malvolio-in-yellow-stockings {
  background: linear-gradient(180deg, #4a3a2a 0%, #5a4a3a 40%, #2a1a0a 100%), radial-gradient(ellipse at 50% 60%, #6a5a4a 0%, transparent 80%);
}
.scn-malvolio-in-yellow-stockings .wall {
  position:absolute; inset:0 0 20% 0;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  box-shadow: inset 0 -8px 12px rgba(0,0,0,0.4);
  animation: my-wall 10s ease-in-out infinite alternate;
}
.scn-malvolio-in-yellow-stockings .floor {
  position:absolute; bottom:0; left:0; right:0; height:20%;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a0a 100%);
  border-radius: 20% 20% 0 0;
  box-shadow: inset 0 8px 12px rgba(0,0,0,0.5);
}
.scn-malvolio-in-yellow-stockings .malvolio-body {
  position:absolute; bottom:14%; left:50%; width:30px; height:60px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: my-body 4s ease-in-out infinite alternate;
}
.scn-malvolio-in-yellow-stockings .stockings-left {
  position:absolute; bottom:6%; left:44%; width:12px; height:30px;
  background: linear-gradient(180deg, #e0c050 0%, #c0a030 100%);
  border-radius: 20% 20% 10% 10%;
  transform-origin: top center;
  animation: my-stockings 2s ease-in-out infinite alternate;
}
.scn-malvolio-in-yellow-stockings .stockings-right {
  position:absolute; bottom:6%; left:56%; width:12px; height:30px;
  background: linear-gradient(180deg, #e0c050 0%, #c0a030 100%);
  border-radius: 20% 20% 10% 10%;
  transform-origin: top center;
  animation: my-stockings 2.2s ease-in-out infinite alternate-reverse;
}
.scn-malvolio-in-yellow-stockings .garter-left {
  position:absolute; bottom:20%; left:43%; width:14px; height:4px;
  background: #8a2020;
  border-radius:2px;
  animation: my-garter 2s ease-in-out infinite alternate;
}
.scn-malvolio-in-yellow-stockings .garter-right {
  position:absolute; bottom:20%; left:57%; width:14px; height:4px;
  background: #8a2020;
  border-radius:2px;
  animation: my-garter 2.2s ease-in-out infinite alternate-reverse;
}
.scn-malvolio-in-yellow-stockings .smile {
  position:absolute; bottom:35%; left:50%; width:16px; height:6px;
  transform: translateX(-50%);
  background: transparent;
  border-radius: 0 0 50% 50%;
  box-shadow: 0 4px 0 #c89040;
  animation: my-smile 1.5s ease-in-out infinite alternate;
}
.scn-malvolio-in-yellow-stockings .letter {
  position:absolute; bottom:28%; left:38%; width:12px; height:16px;
  background: linear-gradient(180deg, #f0e0c0 0%, #d0c0a0 100%);
  border-radius: 2px;
  transform: rotate(15deg);
  animation: my-letter 3s ease-in-out infinite alternate;
}
@keyframes my-wall { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.8 } }
@keyframes my-body { 0% { transform: translateX(-50%) rotate(-2deg); } 50% { transform: translateX(-50%) rotate(2deg); } 100% { transform: translateX(-50%) rotate(-2deg); } }
@keyframes my-stockings { 0% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } 100% { transform: rotate(-5deg); } }
@keyframes my-garter { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.8; } }
@keyframes my-smile { 0% { box-shadow: 0 4px 0 #c89040; width:16px; } 50% { box-shadow: 0 6px 0 #e0a050; width:20px; } 100% { box-shadow: 0 4px 0 #c89040; width:16px; } }
@keyframes my-letter { 0% { transform: rotate(15deg) translateY(0); } 50% { transform: rotate(20deg) translateY(-3px); } 100% { transform: rotate(15deg) translateY(0); } }

/* sebastian-antonio-street */
.scn-sebastian-antonio-street {
  background: linear-gradient(180deg, #c8d8e0 0%, #a0b8c8 50%, #8098a8 100%), radial-gradient(ellipse at 50% 100%, #d0e0f0 0%, transparent 60%);
}
.scn-sebastian-antonio-street .sky {
  position:absolute; inset:0 0 45% 0;
  background: linear-gradient(180deg, #d0e0f0 0%, #b0c8d8 60%, transparent 100%);
  animation: sa-sky 12s ease-in-out infinite alternate;
}
.scn-sebastian-antonio-street .clouds {
  position:absolute; top:10%; left:10%; width:80px; height:16px;
  background: linear-gradient(180deg, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.1) 100%);
  border-radius:50%;
  filter: blur(5px);
  animation: sa-clouds 30s linear infinite;
}
.scn-sebastian-antonio-street .building-left {
  position:absolute; bottom:20%; left:5%; width:40%; height:55%;
  background: linear-gradient(180deg, #b0a090 0%, #8a7a6a 100%);
  border-radius: 8% 8% 0 0;
  box-shadow: inset -4px 0 8px rgba(0,0,0,0.2), 4px 0 8px rgba(0,0,0,0.15);
  animation: sa-building 10s ease-in-out infinite alternate;
}
.scn-sebastian-antonio-street .building-right {
  position:absolute; bottom:20%; right:5%; width:35%; height:50%;
  background: linear-gradient(180deg, #a09080 0%, #786858 100%);
  border-radius: 8% 8% 0 0;
  box-shadow: inset 4px 0 8px rgba(0,0,0,0.2), -4px 0 8px rgba(0,0,0,0.15);
  animation: sa-building 10s ease-in-out infinite alternate-reverse;
}
.scn-sebastian-antonio-street .street {
  position:absolute; bottom:0; left:0; right:0; height:25%;
  background: linear-gradient(180deg, #908878 0%, #706858 100%);
  border-radius: 20% 20% 0 0;
  box-shadow: inset 0 8px 12px rgba(0,0,0,0.3);
  animation: sa-street 8s ease-in-out infinite alternate;
}
.scn-sebastian-antonio-street .sebastian {
  position:absolute; bottom:14%; left:35%; width:22px; height:48px;
  background: linear-gradient(180deg, #b0a090 0%, #706050 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: sa-figure 5s ease-in-out infinite;
}
.scn-sebastian-antonio-street .antonio {
  position:absolute; bottom:16%; left:48%; width:24px; height:50px;
  background: linear-gradient(180deg, #a09080 0%, #605040 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: sa-figure 5.5s ease-in-out infinite 0.3s;
}
.scn-sebastian-antonio-street .shadow-street {
  position:absolute; bottom:8%; left:30%; width:30%; height:8%;
  background: radial-gradient(ellipse at 50% 50%, rgba(0,0,0,0.2) 0%, transparent 70%);
  filter: blur(4px);
  animation: sa-shadow-street 6s ease-in-out infinite alternate;
}
@keyframes sa-sky { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.7 } }
@keyframes sa-clouds { 0% { transform: translateX(-80px); } 100% { transform: translateX(120vw); } }
@keyframes sa-building { 0% { transform: translateY(0); } 50% { transform: translateY(-3px); } 100% { transform: translateY(0); } }
@keyframes sa-street { 0% { transform: translateY(0); } 50% { transform: translateY(-2px); } 100% { transform: translateY(0); } }
@keyframes sa-figure { 0% { transform: translateX(0) rotate(-1deg); } 25% { transform: translateX(2px) rotate(1deg); } 50% { transform: translateX(0) rotate(-1deg); } 75% { transform: translateX(-2px) rotate(1deg); } 100% { transform: translateX(0) rotate(-1deg); } }
@keyframes sa-shadow-street { 0% { opacity:0.3; transform: scaleX(1); } 50% { opacity:0.6; transform: scaleX(0.9); } 100% { opacity:0.3; transform: scaleX(1); } }

.scn-sebastian-fights-andrew {
  background: linear-gradient(180deg, #4a7a9a 0%, #87c4e8 30%, #f4e3a0 70%, #b08b5a 100%);
}
.scn-sebastian-fights-andrew .sky {
  position: absolute; inset: 0 0 60% 0;
  background: linear-gradient(180deg, #6a9ac0 0%, transparent 100%);
  animation: sf-sky 8s ease-in-out infinite alternate;
}
.scn-sebastian-fights-andrew .ground {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #8a7a5a 0%, #4a3a2a 100%);
  border-radius: 20% 20% 0 0;
  box-shadow: inset 0 8px 20px rgba(0,0,0,0.3);
}
.scn-sebastian-fights-andrew .wall {
  position: absolute; bottom: 35%; left: 20%; right: 20%; height: 30%;
  background: linear-gradient(90deg, #6a5a4a 0%, #8a7a5a 50%, #6a5a4a 100%);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
}
.scn-sebastian-fights-andrew .figure-left {
  position: absolute; bottom: 40%; left: 25%; width: 40px; height: 70px;
  background: linear-gradient(180deg, #2a1a0a 0%, #1a0a00 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: sf-fight-left 1.6s ease-in-out infinite alternate;
}
.scn-sebastian-fights-andrew .figure-right {
  position: absolute; bottom: 40%; right: 25%; width: 40px; height: 70px;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a0a00 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: sf-fight-right 1.8s ease-in-out infinite alternate;
}
.scn-sebastian-fights-andrew .dust-a {
  position: absolute; bottom: 45%; left: 40%; width: 30px; height: 15px;
  background: rgba(180, 160, 120, 0.3);
  border-radius: 50%;
  filter: blur(8px);
  animation: sf-dust 4s ease-in-out infinite;
}
.scn-sebastian-fights-andrew .dust-b {
  position: absolute; bottom: 50%; left: 55%; width: 40px; height: 20px;
  background: rgba(180, 160, 120, 0.2);
  border-radius: 50%;
  filter: blur(10px);
  animation: sf-dust 6s ease-in-out infinite reverse;
}
.scn-sebastian-fights-andrew .sun-ray {
  position: absolute; top: 10%; left: 30%; width: 120%; height: 4px;
  background: linear-gradient(90deg, transparent 0%, rgba(255,230,180,0.4) 30%, rgba(255,230,180,0.5) 50%, transparent 80%);
  transform: rotate(20deg);
  transform-origin: left center;
  animation: sf-sunray 3s ease-in-out infinite alternate;
}
@keyframes sf-sky { 0% { opacity: 0.7; } 50% { opacity: 1; } 100% { opacity: 0.8; } }
@keyframes sf-fight-left { 0% { transform: translateX(0) rotate(-5deg); } 50% { transform: translateX(3px) rotate(-2deg); } 100% { transform: translateX(-2px) rotate(-8deg); } }
@keyframes sf-fight-right { 0% { transform: translateX(0) rotate(5deg); } 50% { transform: translateX(-2px) rotate(8deg); } 100% { transform: translateX(3px) rotate(2deg); } }
@keyframes sf-dust { 0% { transform: translateY(0) scale(1); opacity: 0.5; } 50% { transform: translateY(-20px) scale(1.5); opacity: 0; } 100% { transform: translateY(0) scale(1); opacity: 0.5; } }
@keyframes sf-sunray { 0% { transform: rotate(18deg) scaleX(0.9); opacity: 0.6; } 50% { transform: rotate(22deg) scaleX(1.2); opacity: 1; } 100% { transform: rotate(20deg) scaleX(1); opacity: 0.8; } }

.scn-olivia-intervenes {
  background: linear-gradient(180deg, #fce8c8 0%, #fce0b0 30%, #c8d8c0 70%, #8a9a7a 100%);
}
.scn-olivia-intervenes .sky-warm {
  position: absolute; inset: 0 0 50% 0;
  background: linear-gradient(180deg, #e8d4a8 0%, transparent 100%);
  animation: oi-sky 10s ease-in-out infinite alternate;
}
.scn-olivia-intervenes .hedge-left {
  position: absolute; bottom: 40%; left: 0; width: 20%; height: 30%;
  background: linear-gradient(180deg, #6a8a5a 0%, #3a5a2a 100%);
  border-radius: 0 60% 0 0 / 0 100% 0 0;
}
.scn-olivia-intervenes .hedge-right {
  position: absolute; bottom: 40%; right: 0; width: 20%; height: 30%;
  background: linear-gradient(180deg, #6a8a5a 0%, #3a5a2a 100%);
  border-radius: 60% 0 0 0 / 100% 0 0 0;
}
.scn-olivia-intervenes .path {
  position: absolute; bottom: 0; left: 20%; right: 20%; height: 40%;
  background: linear-gradient(180deg, #b8a88a 0%, #6a5a3a 100%);
  border-radius: 30% 30% 0 0;
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.1);
}
.scn-olivia-intervenes .figure-central {
  position: absolute; bottom: 35%; left: 50%; width: 50px; height: 80px;
  background: linear-gradient(180deg, #c8a0a0 0%, #8a6a6a 50%, #5a4a4a 100%);
  border-radius: 50% 50% 30% 30% / 70% 70% 30% 30%;
  transform: translateX(-50%);
  animation: oi-central 6s ease-in-out infinite;
}
.scn-olivia-intervenes .figure-exit-left {
  position: absolute; bottom: 38%; left: 18%; width: 35px; height: 65px;
  background: linear-gradient(180deg, #4a3a3a 0%, #2a1a1a 100%);
  border-radius: 40% 40% 20% 20% / 60% 60% 20% 20%;
  animation: oi-exit-left 8s linear infinite;
}
.scn-olivia-intervenes .figure-exit-right {
  position: absolute; bottom: 38%; right: 18%; width: 35px; height: 65px;
  background: linear-gradient(180deg, #3a4a3a 0%, #1a2a1a 100%);
  border-radius: 40% 40% 20% 20% / 60% 60% 20% 20%;
  animation: oi-exit-right 8s linear infinite;
}
.scn-olivia-intervenes .petal {
  position: absolute; top: 20%; left: 30%; width: 12px; height: 8px;
  background: #f0b0b0;
  border-radius: 50% 50% 0 50%;
  animation: oi-petal 5s ease-in-out infinite;
}
@keyframes oi-sky { 0% { opacity: 0.8; } 50% { opacity: 1; } 100% { opacity: 0.9; } }
@keyframes oi-central { 0% { transform: translateX(-50%) rotate(0deg); } 50% { transform: translateX(-50%) translateY(-3px) rotate(2deg); } 100% { transform: translateX(-50%) rotate(0deg); } }
@keyframes oi-exit-left { 0% { transform: translateX(0) scale(1); opacity: 1; } 50% { transform: translateX(-30px) scale(0.8); opacity: 0.5; } 100% { transform: translateX(-60px) scale(0.5); opacity: 0; } }
@keyframes oi-exit-right { 0% { transform: translateX(0) scale(1); opacity: 1; } 50% { transform: translateX(30px) scale(0.8); opacity: 0.5; } 100% { transform: translateX(60px) scale(0.5); opacity: 0; } }
@keyframes oi-petal { 0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(40px) rotate(180deg); opacity: 0.6; } 100% { transform: translateY(80px) rotate(360deg); opacity: 0; } }

.scn-malvolio-imprisoned {
  background: linear-gradient(180deg, #1a1a2a 0%, #3a2a2a 30%, #4a3a2a 60%, #2a1a1a 100%);
}
.scn-malvolio-imprisoned .wall-dim {
  position: absolute; inset: 0 0 20% 0;
  background: radial-gradient(ellipse at 50% 100%, #4a3a2a 0%, #1a1a2a 100%);
  animation: mi-wall 12s ease-in-out infinite alternate;
}
.scn-malvolio-imprisoned .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 20%;
  background: linear-gradient(180deg, #2a1a0a 0%, #1a0a00 100%);
}
.scn-malvolio-imprisoned .bars {
  position: absolute; bottom: 20%; left: 25%; right: 25%; height: 50%;
  background: repeating-linear-gradient(90deg, #1a1a1a 0px, #1a1a1a 6px, transparent 6px, transparent 14px);
  opacity: 0.6;
  animation: mi-bars 4s ease-in-out infinite alternate;
}
.scn-malvolio-imprisoned .window-dim {
  position: absolute; top: 10%; left: 10%; width: 30px; height: 40px;
  background: rgba(100, 80, 60, 0.4);
  border: 4px solid #2a1a0a;
  border-radius: 4px;
  box-shadow: inset 0 0 20px rgba(180,140,80,0.2);
  animation: mi-window 5s ease-in-out infinite alternate;
}
.scn-malvolio-imprisoned .figure-disguise {
  position: absolute; bottom: 30%; left: 20%; width: 40px; height: 80px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 40% 40% 30% 30% / 60% 60% 30% 30%;
  transform-origin: bottom center;
  animation: mi-disguise 3s ease-in-out infinite alternate;
}
.scn-malvolio-imprisoned .lantern-dim {
  position: absolute; bottom: 35%; left: 15%; width: 10px; height: 14px;
  background: radial-gradient(circle, #d0a060 0%, #8a6a2a 70%);
  border-radius: 20%;
  box-shadow: 0 0 16px 4px rgba(200,150,80,0.4);
  animation: mi-lantern 2s ease-in-out infinite alternate;
}
.scn-malvolio-imprisoned .shadow {
  position: absolute; bottom: 25%; left: 18%; width: 40px; height: 20px;
  background: rgba(0,0,0,0.3);
  border-radius: 50%;
  filter: blur(6px);
  animation: mi-shadow 3s ease-in-out infinite alternate;
}
@keyframes mi-wall { 0% { opacity: 0.7; } 50% { opacity: 0.9; } 100% { opacity: 0.8; } }
@keyframes mi-bars { 0% { transform: scaleX(1); } 50% { transform: scaleX(0.95); opacity: 0.5; } 100% { transform: scaleX(1); } }
@keyframes mi-window { 0% { box-shadow: inset 0 0 10px rgba(180,140,80,0.1); } 50% { box-shadow: inset 0 0 40px rgba(200,160,100,0.3); } 100% { box-shadow: inset 0 0 20px rgba(180,140,80,0.15); } }
@keyframes mi-disguise { 0% { transform: rotate(-3deg); } 50% { transform: rotate(3deg) scale(1.02); } 100% { transform: rotate(-2deg); } }
@keyframes mi-lantern { 0% { transform: translateY(0) scale(1); opacity: 0.8; box-shadow: 0 0 12px 3px rgba(200,150,80,0.3); } 50% { transform: translateY(-4px) scale(1.05); opacity: 1; box-shadow: 0 0 24px 6px rgba(220,170,90,0.5); } 100% { transform: translateY(0) scale(1); opacity: 0.9; box-shadow: 0 0 16px 4px rgba(200,150,80,0.4); } }
@keyframes mi-shadow { 0% { transform: scaleY(1); opacity: 0.3; } 50% { transform: scaleY(0.8); opacity: 0.5; } 100% { transform: scaleY(1); opacity: 0.3; } }

.scn-feste-as-topas {
  background: linear-gradient(180deg, #1a1a2a 0%, #2a1a1a 30%, #3a2a1a 60%, #1a0a00 100%);
}
.scn-feste-as-topas .wall-cell {
  position: absolute; inset: 0 0 15% 0;
  background: radial-gradient(ellipse at 50% 80%, #2a1a1a 0%, #0a0a1a 100%);
  animation: ft-wall 10s ease-in-out infinite alternate;
}
.scn-feste-as-topas .bars-cell {
  position: absolute; bottom: 15%; left: 10%; right: 10%; height: 60%;
  background: repeating-linear-gradient(90deg, #1a1a1a 0px, #1a1a1a 4px, transparent 4px, transparent 12px);
  opacity: 0.5;
  animation: ft-bars 6s ease-in-out infinite alternate;
}
.scn-feste-as-topas .figure-malvolio {
  position: absolute; bottom: 20%; left: 30%; width: 40px; height: 70px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 40% 40% 20% 20% / 60% 60% 20% 20%;
  transform-origin: bottom center;
  animation: ft-malvolio 4s ease-in-out infinite alternate;
}
.scn-feste-as-topas .figure-topas {
  position: absolute; bottom: 25%; right: 20%; width: 45px; height: 85px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 30% 30% 25% 25% / 50% 50% 25% 25%;
  transform: scaleX(-1);
  animation: ft-topas 3s ease-in-out infinite alternate;
}
.scn-feste-as-topas .lantern-cell {
  position: absolute; bottom: 35%; right: 15%; width: 12px; height: 16px;
  background: radial-gradient(circle, #d0a060 0%, #8a6a2a 70%);
  border-radius: 20%;
  box-shadow: 0 0 20px 5px rgba(200,150,80,0.5);
  animation: ft-lantern 2s ease-in-out infinite alternate;
}
.scn-feste-as-topas .grille {
  position: absolute; bottom: 15%; left: 10%; right: 10%; height: 5%;
  background: linear-gradient(90deg, #1a1a1a 0%, #2a2a2a 50%, #1a1a1a 100%);
  border-radius: 2px;
  animation: ft-grille 12s linear infinite;
}
.scn-feste-as-topas .shadow-topas {
  position: absolute; bottom: 25%; right: 18%; width: 50px; height: 30px;
  background: rgba(0,0,0,0.3);
  border-radius: 50%;
  filter: blur(8px);
  animation: ft-shadow 3s ease-in-out infinite alternate;
}
@keyframes ft-wall { 0% { opacity: 0.6; } 50% { opacity: 0.8; } 100% { opacity: 0.7; } }
@keyframes ft-bars { 0% { transform: scaleX(1); } 50% { transform: scaleX(0.93); opacity: 0.4; } 100% { transform: scaleX(1); } }
@keyframes ft-malvolio { 0% { transform: translateX(0) rotate(-2deg); } 50% { transform: translateX(8px) rotate(3deg) scale(1.02); } 100% { transform: translateX(0) rotate(-2deg); } }
@keyframes ft-topas { 0% { transform: scaleX(-1) rotate(3deg); } 50% { transform: scaleX(-1) rotate(-3deg) translateY(-5px); } 100% { transform: scaleX(-1) rotate(2deg); } }
@keyframes ft-lantern { 0% { transform: translateY(0) scale(1); opacity: 0.8; box-shadow: 0 0 15px 4px rgba(200,150,80,0.4); } 50% { transform: translateY(-3px) scale(1.03); opacity: 1; box-shadow: 0 0 30px 8px rgba(220,170,90,0.6); } 100% { transform: translateY(0) scale(1); opacity: 0.9; box-shadow: 0 0 20px 5px rgba(200,150,80,0.5); } }
@keyframes ft-grille { 0% { background-position: 0% 0%; } 100% { background-position: 100% 0%; } }
@keyframes ft-shadow { 0% { transform: scaleY(1) scaleX(1); opacity: 0.3; } 50% { transform: scaleY(0.7) scaleX(1.1); opacity: 0.5; } 100% { transform: scaleY(1) scaleX(1); opacity: 0.3; } }

.scn-sea-coast-departure {
  background:
    linear-gradient(180deg, #f7d9a0 0%, #d4a373 30%, #7aa5b9 60%, #4a6a7a 100%),
    radial-gradient(ellipse at 80% 20%, #fce4a0 0%, transparent 60%);
}
.scn-sea-coast-departure .sky {
  position: absolute; inset: 0 0 55% 0;
  background: linear-gradient(180deg, #b7d9e8 0%, #f7d9a0 40%);
  animation: sc-sky 20s ease-in-out infinite alternate;
}
.scn-sea-coast-departure .sea {
  position: absolute; bottom: 0; left: 0; right: 0; height: 55%;
  background: linear-gradient(180deg, #3a6a7a 0%, #2a4a5a 100%);
  border-radius: 60% 40% 0 0 / 30% 20% 0 0;
  box-shadow: inset 0 12px 30px rgba(0,0,0,0.3);
  animation: sc-sea 8s ease-in-out infinite alternate;
}
.scn-sea-coast-departure .sun {
  position: absolute; top: 18%; right: 20%; width: 50px; height: 50px;
  background: radial-gradient(circle, #fff7c0 0%, #f7c040 40%, #e09020 100%);
  border-radius: 50%;
  box-shadow: 0 0 40px 12px #f7c040, 0 0 80px 20px rgba(247,192,64,0.3);
  animation: sc-sun 6s ease-in-out infinite alternate;
}
.scn-sea-coast-departure .ship {
  position: absolute; bottom: 38%; left: 25%; width: 70px; height: 30px;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a1a0a 100%);
  border-radius: 0 30% 60% 40%;
  transform: rotate(-5deg);
  animation: sc-ship 12s ease-in-out infinite;
}
.scn-sea-coast-departure .sail {
  position: absolute; bottom: 38%; left: 28%; width: 20px; height: 40px;
  background: linear-gradient(180deg, #e8d8c0 0%, #c8b090 100%);
  border-radius: 30% 10% 10% 20%;
  transform: rotate(10deg);
  animation: sc-sail 8s ease-in-out infinite alternate;
}
.scn-sea-coast-departure .figure {
  position: absolute; bottom: 40%; left: 10%; width: 16px; height: 32px;
  background: linear-gradient(180deg, #2a1a0a 0%, #1a0a00 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: sc-figure 4s ease-in-out infinite;
}
.scn-sea-coast-departure .cloud-a {
  position: absolute; top: 8%; left: -10%; width: 80px; height: 18px;
  background: linear-gradient(180deg, rgba(255,255,240,0.6) 0%, rgba(255,255,240,0.1) 100%);
  border-radius: 50%; filter: blur(8px);
  animation: sc-drift-a 40s linear infinite;
}
.scn-sea-coast-departure .cloud-b {
  position: absolute; top: 16%; right: -15%; width: 60px; height: 14px;
  background: linear-gradient(180deg, rgba(255,255,240,0.5) 0%, rgba(255,255,240,0.05) 100%);
  border-radius: 50%; filter: blur(6px);
  animation: sc-drift-b 55s linear infinite reverse;
}
@keyframes sc-sky { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.75 } }
@keyframes sc-sea { 0% { transform: translateY(0) scaleY(1) } 50% { transform: translateY(-3px) scaleY(0.97) } 100% { transform: translateY(2px) scaleY(1.02) } }
@keyframes sc-sun { 0% { transform: scale(0.95); box-shadow: 0 0 30px 8px #f7c040; } 50% { transform: scale(1.05); box-shadow: 0 0 50px 16px #f7c040, 0 0 90px 24px rgba(247,192,64,0.4); } 100% { transform: scale(1); box-shadow: 0 0 35px 10px #f7c040; } }
@keyframes sc-ship { 0% { transform: rotate(-5deg) translateX(0); } 50% { transform: rotate(-8deg) translateX(4px); } 100% { transform: rotate(-3deg) translateX(-2px); } }
@keyframes sc-sail { 0% { transform: rotate(10deg) scaleX(1); } 50% { transform: rotate(15deg) scaleX(0.9); } 100% { transform: rotate(5deg) scaleX(1.05); } }
@keyframes sc-figure { 0% { transform: translateX(0) rotate(-2deg); } 30% { transform: translateX(6px) rotate(1deg); } 60% { transform: translateX(12px) rotate(-1deg); } 100% { transform: translateX(18px) rotate(0); } }
@keyframes sc-drift-a { 0% { transform: translateX(0); } 100% { transform: translateX(120vw); } }
@keyframes sc-drift-b { 0% { transform: translateX(0); } 100% { transform: translateX(-120vw); } }

.scn-olivia-house-toby {
  background:
    linear-gradient(180deg, #2a1e12 0%, #1f1408 40%, #1a0e00 100%),
    radial-gradient(ellipse at 50% 80%, #3a2816 0%, transparent 70%);
}
.scn-olivia-house-toby .wall {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a0a 100%);
  box-shadow: inset 0 0 40px rgba(0,0,0,0.6);
  animation: ot-wall 15s ease-in-out infinite alternate;
}
.scn-olivia-house-toby .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #4a3018 0%, #2a1a08 100%);
  border-radius: 0 0 10% 10%;
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.5);
  animation: ot-floor 10s ease-in-out infinite alternate;
}
.scn-olivia-house-toby .table {
  position: absolute; bottom: 22%; left: 30%; width: 80px; height: 40px;
  background: linear-gradient(180deg, #5a3a1a 0%, #3a1a00 100%);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.6);
  animation: ot-table 6s ease-in-out infinite alternate;
}
.scn-olivia-house-toby .candle {
  position: absolute; bottom: 38%; left: 35%; width: 8px; height: 20px;
  background: linear-gradient(180deg, #e8c060 0%, #b08030 100%);
  border-radius: 2px 2px 0 0;
  box-shadow: 0 0 20px 6px #d09040, 0 0 40px 12px rgba(208,144,64,0.3);
  animation: ot-candle 3s ease-in-out infinite alternate;
}
.scn-olivia-house-toby .mug {
  position: absolute; bottom: 25%; left: 42%; width: 16px; height: 20px;
  background: linear-gradient(180deg, #6a5038 0%, #4a3020 100%);
  border-radius: 0 0 10% 10%;
  box-shadow: 0 2px 4px rgba(0,0,0,0.4);
  animation: ot-mug 8s ease-in-out infinite;
}
.scn-olivia-house-toby .toby {
  position: absolute; bottom: 18%; left: 20%; width: 20px; height: 40px;
  background: linear-gradient(180deg, #2a1a0a 0%, #1a0a00 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ot-toby 4s ease-in-out infinite;
}
.scn-olivia-house-toby .maria {
  position: absolute; bottom: 20%; right: 22%; width: 18px; height: 36px;
  background: linear-gradient(180deg, #3a2212 0%, #1a0e06 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ot-maria 4.5s ease-in-out infinite 1s;
}
.scn-olivia-house-toby .chair {
  position: absolute; bottom: 15%; left: 15%; width: 24px; height: 30px;
  background: linear-gradient(180deg, #4a2a12 0%, #2a1200 100%);
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.5);
  animation: ot-chair 7s ease-in-out infinite alternate;
}
@keyframes ot-wall { 0% { opacity:0.85 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes ot-floor { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(1px) } }
@keyframes ot-table { 0% { transform: translateX(0) } 50% { transform: translateX(2px) } 100% { transform: translateX(-1px) } }
@keyframes ot-candle { 0% { box-shadow: 0 0 12px 4px #b08030, 0 0 24px 8px rgba(176,128,48,0.3); opacity:0.9 } 50% { box-shadow: 0 0 28px 8px #e0a040, 0 0 50px 16px rgba(224,160,64,0.5); opacity:1 } 100% { box-shadow: 0 0 16px 5px #c09040, 0 0 30px 10px rgba(192,144,64,0.35); opacity:0.92 } }
@keyframes ot-mug { 0% { transform: rotate(0) } 30% { transform: rotate(3deg) } 60% { transform: rotate(-2deg) } 100% { transform: rotate(0) } }
@keyframes ot-toby { 0% { transform: translateX(0) rotate(-2deg) } 25% { transform: translateX(6px) rotate(1deg) } 50% { transform: translateX(12px) rotate(-1deg) } 75% { transform: translateX(6px) rotate(2deg) } 100% { transform: translateX(0) rotate(0) } }
@keyframes ot-maria { 0% { transform: translateX(0) rotate(1deg) } 33% { transform: translateX(-4px) rotate(-1deg) } 66% { transform: translateX(4px) rotate(2deg) } 100% { transform: translateX(0) rotate(0) } }
@keyframes ot-chair { 0% { transform: scale(1) } 50% { transform: scale(1.02) } 100% { transform: scale(0.98) } }

.scn-olivia-house-andrew {
  background:
    linear-gradient(180deg, #2a1e12 0%, #1f1408 40%, #1a0e00 100%),
    radial-gradient(ellipse at 50% 80%, #3a2816 0%, transparent 70%);
}
.scn-olivia-house-andrew .wall {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a0a 100%);
  box-shadow: inset 0 0 40px rgba(0,0,0,0.6);
  animation: oa-wall 15s ease-in-out infinite alternate;
}
.scn-olivia-house-andrew .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #4a3018 0%, #2a1a08 100%);
  border-radius: 0 0 10% 10%;
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.5);
  animation: oa-floor 10s ease-in-out infinite alternate;
}
.scn-olivia-house-andrew .chair {
  position: absolute; bottom: 22%; left: 40%; width: 24px; height: 30px;
  background: linear-gradient(180deg, #4a2a12 0%, #2a1200 100%);
  border-radius: 4px;
  box-shadow: 0 2px 6px rgba(0,0,0,0.5);
  animation: oa-chair 7s ease-in-out infinite alternate;
}
.scn-olivia-house-andrew .andrew {
  position: absolute; bottom: 18%; left: 35%; width: 18px; height: 42px;
  background: linear-gradient(180deg, #2a1a0a 0%, #1a0a00 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: oa-andrew 3.5s ease-in-out infinite;
}
.scn-olivia-house-andrew .toby-head {
  position: absolute; bottom: 30%; right: 25%; width: 14px; height: 18px;
  background: radial-gradient(circle, #4a3020 0%, #2a1a0a 100%);
  border-radius: 50%;
  box-shadow: 0 0 8px 2px rgba(0,0,0,0.4);
  animation: oa-toby 4s ease-in-out infinite 0.5s;
}
.scn-olivia-house-andrew .candle {
  position: absolute; bottom: 38%; left: 20%; width: 8px; height: 20px;
  background: linear-gradient(180deg, #e8c060 0%, #b08030 100%);
  border-radius: 2px 2px 0 0;
  box-shadow: 0 0 20px 6px #d09040, 0 0 40px 12px rgba(208,144,64,0.3);
  animation: oa-candle 3s ease-in-out infinite alternate;
}
.scn-olivia-house-andrew .jug {
  position: absolute; bottom: 25%; right: 40%; width: 18px; height: 22px;
  background: linear-gradient(180deg, #5a3a1a 0%, #3a1a00 100%);
  border-radius: 30% 30% 10% 10%;
  box-shadow: 0 2px 4px rgba(0,0,0,0.4);
  animation: oa-jug 9s ease-in-out infinite;
}
@keyframes oa-wall { 0% { opacity:0.85 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes oa-floor { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(1px) } }
@keyframes oa-chair { 0% { transform: scale(1) } 50% { transform: scale(1.03) } 100% { transform: scale(0.97) } }
@keyframes oa-andrew { 0% { transform: translateX(0) rotate(-3deg) } 25% { transform: translateX(8px) rotate(1deg) } 50% { transform: translateX(12px) rotate(-2deg) } 75% { transform: translateX(6px) rotate(2deg) } 100% { transform: translateX(0) rotate(0) } }
@keyframes oa-toby { 0% { transform: translateY(0) rotate(0) } 30% { transform: translateY(-3px) rotate(5deg) } 60% { transform: translateY(1px) rotate(-3deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes oa-candle { 0% { box-shadow: 0 0 12px 4px #b08030; opacity:0.9 } 50% { box-shadow: 0 0 28px 8px #e0a040; opacity:1 } 100% { box-shadow: 0 0 16px 5px #c09040; opacity:0.92 } }
@keyframes oa-jug { 0% { transform: rotate(0) } 40% { transform: rotate(4deg) } 80% { transform: rotate(-3deg) } 100% { transform: rotate(0) } }

.scn-olivia-house-maria {
  background:
    linear-gradient(180deg, #2a1e12 0%, #1f1408 40%, #1a0e00 100%),
    radial-gradient(ellipse at 50% 80%, #3a2816 0%, transparent 70%);
}
.scn-olivia-house-maria .wall {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a0a 100%);
  box-shadow: inset 0 0 40px rgba(0,0,0,0.6);
  animation: om-wall 15s ease-in-out infinite alternate;
}
.scn-olivia-house-maria .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #4a3018 0%, #2a1a08 100%);
  border-radius: 0 0 10% 10%;
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.5);
  animation: om-floor 10s ease-in-out infinite alternate;
}
.scn-olivia-house-maria .table {
  position: absolute; bottom: 22%; left: 30%; width: 60px; height: 36px;
  background: linear-gradient(180deg, #5a3a1a 0%, #3a1a00 100%);
  border-radius: 4px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.6);
  animation: om-table 6s ease-in-out infinite alternate;
}
.scn-olivia-house-maria .candle {
  position: absolute; bottom: 38%; left: 35%; width: 8px; height: 20px;
  background: linear-gradient(180deg, #e8c060 0%, #b08030 100%);
  border-radius: 2px 2px 0 0;
  box-shadow: 0 0 20px 6px #d09040, 0 0 40px 12px rgba(208,144,64,0.3);
  animation: om-candle 3s ease-in-out infinite alternate;
}
.scn-olivia-house-maria .maria {
  position: absolute; bottom: 18%; left: 20%; width: 18px; height: 38px;
  background: linear-gradient(180deg, #3a2212 0%, #1a0e06 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: om-maria 4s ease-in-out infinite;
}
.scn-olivia-house-maria .andrew-figure {
  position: absolute; bottom: 20%; right: 22%; width: 16px; height: 36px;
  background: linear-gradient(180deg, #2a1a0a 0%, #1a0a00 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: om-andrew 4.5s ease-in-out infinite 0.8s;
}
.scn-olivia-house-maria .letter {
  position: absolute; bottom: 32%; left: 42%; width: 14px; height: 18px;
  background: linear-gradient(180deg, #e8d8c0 0%, #c8b898 100%);
  border-radius: 2px;
  box-shadow: 0 0 4px rgba(0,0,0,0.3);
  animation: om-letter 7s ease-in-out infinite;
}
@keyframes om-wall { 0% { opacity:0.85 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes om-floor { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(1px) } }
@keyframes om-table { 0% { transform: translateX(0) } 50% { transform: translateX(1px) } 100% { transform: translateX(-1px) } }
@keyframes om-candle { 0% { box-shadow: 0 0 12px 4px #b08030; opacity:0.9 } 50% { box-shadow: 0 0 28px 8px #e0a040; opacity:1 } 100% { box-shadow: 0 0 16px 5px #c09040; opacity:0.92 } }
@keyframes om-maria { 0% { transform: translateX(0) rotate(-2deg) } 30% { transform: translateX(6px) rotate(1deg) } 60% { transform: translateX(12px) rotate(-1deg) } 100% { transform: translateX(18px) rotate(0) } }
@keyframes om-andrew { 0% { transform: translateX(0) rotate(1deg) } 33% { transform: translateX(-4px) rotate(-1deg) } 66% { transform: translateX(4px) rotate(2deg) } 100% { transform: translateX(0) rotate(0) } }
@keyframes om-letter { 0% { transform: scale(1) rotate(0) } 40% { transform: scale(1.05) rotate(3deg) } 80% { transform: scale(0.95) rotate(-2deg) } 100% { transform: scale(1) rotate(0) } }

/* clown-mocks-malvolio */
.scn-clown-mocks-malvolio { background: linear-gradient(180deg, #f5e6b8 0%, #e8c88a 40%, #d4a85c 100%), radial-gradient(ellipse at 50% 100%, #f0d090 0%, transparent 60%); }
.scn-clown-mocks-malvolio .bg-warm { position:absolute; inset:0; background: linear-gradient(180deg, #ffe8c0 0%, #f0d090 50%, #d4a85c 100%); animation: cm-bg 6s ease-in-out infinite alternate; }
.scn-clown-mocks-malvolio .window { position:absolute; top:10%; left:15%; width:40%; height:50%; background: radial-gradient(ellipse at 50% 40%, #fff0d0 0%, #ffe0a0 40%, transparent 70%); border-radius: 10% / 5%; box-shadow: inset 0 0 40px 20px rgba(255,240,200,.3); }
.scn-clown-mocks-malvolio .curtain-l { position:absolute; top:8%; left:10%; width:25%; height:60%; background: linear-gradient(180deg, #b84a3a 0%, #8a3a2a 100%); border-radius: 0 30% 30% 0; transform-origin: left center; animation: cm-curtain 4s ease-in-out infinite alternate; }
.scn-clown-mocks-malvolio .curtain-r { position:absolute; top:8%; right:10%; width:25%; height:60%; background: linear-gradient(180deg, #b84a3a 0%, #8a3a2a 100%); border-radius: 30% 0 0 30%; transform-origin: right center; animation: cm-curtain 4s ease-in-out infinite alternate-reverse; }
.scn-clown-mocks-malvolio .clown { position:absolute; bottom:20%; left:40%; width:26%; height:45%; background: radial-gradient(ellipse at 50% 30%, #e8c040 0%, #c09030 60%, #806020 100%); border-radius: 50% 50% 40% 40% / 60% 55% 45% 45%; box-shadow: 0 8px 25px rgba(0,0,0,0.2); animation: cm-clown 3s ease-in-out infinite; }
.scn-clown-mocks-malvolio .malvolio-shadow { position:absolute; bottom:18%; right:18%; width:18%; height:50%; background: linear-gradient(180deg, rgba(40,30,20,0.7) 0%, rgba(40,30,20,0.4) 100%); border-radius: 40% 40% 30% 30% / 50% 50% 40% 40%; transform: scaleX(-1); animation: cm-shadow 5s ease-in-out infinite alternate; }
.scn-clown-mocks-malvolio .confetti-1 { position:absolute; top:30%; left:20%; width:8px; height:8px; background: #d08050; border-radius: 50%; box-shadow: 0 0 6px 2px rgba(208,128,80,0.5); animation: cm-confetti 7s linear infinite; }
.scn-clown-mocks-malvolio .confetti-2 { position:absolute; top:40%; right:30%; width:6px; height:6px; background: #6090c0; border-radius: 50%; box-shadow: 0 0 4px 1px rgba(96,144,192,0.4); animation: cm-confetti 9s linear infinite reverse; }
.scn-clown-mocks-malvolio .stool { position:absolute; bottom:16%; left:38%; width:20%; height:12%; background: linear-gradient(180deg, #806040 0%, #604020 100%); border-radius: 10% 10% 20% 20%; box-shadow: 0 4px 8px rgba(0,0,0,0.3); }
@keyframes cm-bg { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.85 } }
@keyframes cm-curtain { 0% { transform: scaleX(1) } 50% { transform: scaleX(1.08) } 100% { transform: scaleX(0.95) } }
@keyframes cm-clown { 0% { transform: translateY(0) rotate(-2deg) } 25% { transform: translateY(-8px) rotate(3deg) } 50% { transform: translateY(5px) rotate(-1deg) } 75% { transform: translateY(-3px) rotate(2deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes cm-shadow { 0% { transform: scaleX(-1) translateY(0) } 50% { transform: scaleX(-1) translateY(-4px) } 100% { transform: scaleX(-1) translateY(2px) } }
@keyframes cm-confetti { 0% { transform: translateY(0) rotate(0) } 25% { transform: translateY(20px) rotate(90deg) } 50% { transform: translateY(40px) rotate(180deg) } 75% { transform: translateY(60px) rotate(270deg) } 100% { transform: translateY(80px) rotate(360deg) } }

/* malvolio-exit */
.scn-malvolio-exit { background: linear-gradient(180deg, #d4a85c 0%, #b8884a 30%, #8a6a30 70%, #5a4020 100%), radial-gradient(ellipse at 50% 20%, #f0d090 0%, transparent 70%); }
.scn-malvolio-exit .bg-tense { position:absolute; inset:0; background: linear-gradient(180deg, #e8c88a 0%, #c89860 40%, #a07040 80%, #604020 100%); animation: mal-bg 8s ease-in-out infinite alternate; }
.scn-malvolio-exit .door-l { position:absolute; bottom:10%; left:40%; width:22%; height:70%; background: linear-gradient(180deg, #a06040 0%, #704030 100%); border-radius: 4% 0 0 4%; box-shadow: inset -8px 0 12px rgba(0,0,0,0.4); animation: mal-door-l 2s ease-in-out infinite; }
.scn-malvolio-exit .door-r { position:absolute; bottom:10%; left:62%; width:22%; height:70%; background: linear-gradient(180deg, #a06040 0%, #704030 100%); border-radius: 0 4% 4% 0; box-shadow: inset 8px 0 12px rgba(0,0,0,0.4); animation: mal-door-r 2s ease-in-out infinite; }
.scn-malvolio-exit .malvolio-figure { position:absolute; bottom:15%; left:52%; width:16%; height:55%; background: linear-gradient(180deg, #402828 0%, #201414 100%); border-radius: 40% 40% 30% 30% / 50% 50% 40% 40%; transform: translateX(-50%); animation: mal-fig 4s ease-in-out infinite; }
.scn-malvolio-exit .shadow-cast { position:absolute; bottom:8%; left:45%; width:40%; height:30%; background: radial-gradient(ellipse at 50% 0%, rgba(30,20,10,0.6) 0%, transparent 80%); animation: mal-shadow 3s ease-in-out infinite alternate; }
.scn-malvolio-exit .lamp { position:absolute; top:40%; left:18%; width:12%; height:18%; background: radial-gradient(ellipse at 50% 40%, #f0d090 0%, #c89840 60%, #804020 100%); border-radius: 10% 10% 30% 30%; box-shadow: 0 0 30px 10px rgba(192,152,64,0.4); animation: mal-lamp 5s ease-in-out infinite; }
.scn-malvolio-exit .floorboards { position:absolute; bottom:0; left:0; right:0; height:12%; background: repeating-linear-gradient(90deg, #704030 0px, #704030 10%, #5a3020 10%, #5a3020 20%); animation: mal-floor 6s linear infinite; }
.scn-malvolio-exit .light-ray { position:absolute; top:2%; left:30%; width:40%; height:40%; background: linear-gradient(135deg, rgba(255,240,200,0.2) 0%, transparent 60%); animation: mal-ray 7s ease-in-out infinite alternate; }
@keyframes mal-bg { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.7 } }
@keyframes mal-door-l { 0% { transform: scaleX(1) } 25% { transform: scaleX(0.2) } 50% { transform: scaleX(1) } 75% { transform: scaleX(0.9) } 100% { transform: scaleX(1) } }
@keyframes mal-door-r { 0% { transform: scaleX(1) } 25% { transform: scaleX(0.3) } 50% { transform: scaleX(1) } 75% { transform: scaleX(0.8) } 100% { transform: scaleX(1) } }
@keyframes mal-fig { 0% { transform: translateX(-50%) translateY(0) rotate(0) } 25% { transform: translateX(-40%) translateY(-2px) rotate(2deg) } 50% { transform: translateX(-30%) translateY(0) rotate(-1deg) } 75% { transform: translateX(-45%) translateY(-1px) rotate(1deg) } 100% { transform: translateX(-50%) translateY(0) rotate(0) } }
@keyframes mal-shadow { 0% { transform: scaleX(1) opacity:0.5 } 50% { transform: scaleX(1.2) opacity:0.8 } 100% { transform: scaleX(0.9) opacity:0.4 } }
@keyframes mal-lamp { 0% { transform: rotate(-5deg) } 25% { transform: rotate(3deg) } 50% { transform: rotate(-2deg) } 75% { transform: rotate(4deg) } 100% { transform: rotate(-5deg) } }
@keyframes mal-floor { 0% { background-position: 0 0 } 100% { background-position: 20% 0 } }
@keyframes mal-ray { 0% { transform: rotate(0) scale(1) } 50% { transform: rotate(5deg) scale(1.05) } 100% { transform: rotate(-3deg) scale(0.95) } }

/* orsino-final-orders */
.scn-orsino-final-orders { background: linear-gradient(180deg, #f5e6b8 0%, #e8c88a 40%, #d4a85c 100%), radial-gradient(ellipse at 50% 20%, #fff0d0 0%, transparent 70%); }
.scn-orsino-final-orders .bg-warm { position:absolute; inset:0; background: linear-gradient(180deg, #fff0d0 0%, #f0d090 40%, #d4a85c 80%, #b8884a 100%); animation: ors-bg 12s ease-in-out infinite alternate; }
.scn-orsino-final-orders .window-gold { position:absolute; top:5%; left:60%; width:30%; height:50%; background: radial-gradient(ellipse at 50% 30%, #ffe8b0 0%, #f0c060 40%, transparent 70%); border-radius: 10% / 8%; box-shadow: 0 0 50px 20px rgba(240,192,96,0.4); animation: ors-window 8s ease-in-out infinite; }
.scn-orsino-final-orders .curtain-soft { position:absolute; top:3%; left:55%; width:40%; height:55%; background: linear-gradient(180deg, #c8a070 0%, #b08858 100%); border-radius: 20% 20% 10% 10%; opacity:0.3; animation: ors-curtain 15s ease-in-out infinite alternate; }
.scn-orsino-final-orders .figure-orsino { position:absolute; bottom:20%; left:25%; width:20%; height:40%; background: linear-gradient(180deg, #705040 0%, #402828 100%); border-radius: 50% 50% 30% 30% / 60% 60% 40% 40%; animation: ors-fig1 6s ease-in-out infinite; }
.scn-orsino-final-orders .figure-viola { position:absolute; bottom:22%; right:30%; width:18%; height:38%; background: linear-gradient(180deg, #806050 0%, #503830 100%); border-radius: 50% 50% 30% 30% / 60% 60% 40% 40%; animation: ors-fig2 5s ease-in-out infinite alternate; }
.scn-orsino-final-orders .table { position:absolute; bottom:15%; left:35%; width:30%; height:10%; background: linear-gradient(180deg, #a08060 0%, #806040 100%); border-radius: 10% 10% 30% 30%; box-shadow: 0 4px 12px rgba(0,0,0,0.3); }
.scn-orsino-final-orders .book { position:absolute; bottom:20%; left:40%; width:8%; height:12%; background: linear-gradient(180deg, #604020 0%, #402010 100%); border-radius: 10% 10% 5% 5%; transform: rotate(-15deg); animation: ors-book 9s ease-in-out infinite; }
.scn-orsino-final-orders .dust-1 { position:absolute; top:45%; left:35%; width:6px; height:6px; background: rgba(255,240,200,0.6); border-radius: 50%; filter: blur(2px); animation: ors-dust 20s linear infinite; }
.scn-orsino-final-orders .dust-2 { position:absolute; top:55%; right:40%; width:4px; height:4px; background: rgba(255,240,200,0.5); border-radius: 50%; filter: blur(1.5px); animation: ors-dust 25s linear infinite reverse; }
@keyframes ors-bg { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.8 } }
@keyframes ors-window { 0% { transform: scale(1) opacity:0.9 } 50% { transform: scale(1.02) opacity:1 } 100% { transform: scale(0.98) opacity:0.85 } }
@keyframes ors-curtain { 0% { transform: translateY(0) } 50% { transform: translateY(-5px) } 100% { transform: translateY(3px) } }
@keyframes ors-fig1 { 0% { transform: translateY(0) rotate(-1deg) } 25% { transform: translateY(-4px) rotate(1deg) } 50% { transform: translateY(2px) rotate(-2deg) } 75% { transform: translateY(-1px) rotate(0) } 100% { transform: translateY(0) rotate(-1deg) } }
@keyframes ors-fig2 { 0% { transform: translateY(0) rotate(0) } 50% { transform: translateY(-6px) rotate(3deg) } 100% { transform: translateY(2px) rotate(-2deg) } }
@keyframes ors-book { 0% { transform: rotate(-15deg) translateY(0) } 50% { transform: rotate(-12deg) translateY(-2px) } 100% { transform: rotate(-17deg) translateY(1px) } }
@keyframes ors-dust { 0% { transform: translateY(0) translateX(0) opacity:0 } 25% { transform: translateY(-20px) translateX(10px) opacity:1 } 50% { transform: translateY(-40px) translateX(-5px) opacity:0.8 } 75% { transform: translateY(-60px) translateX(15px) opacity:0.5 } 100% { transform: translateY(-80px) translateX(-10px) opacity:0 } }

/* clown-song-part1 */
.scn-clown-song-part1 { background: linear-gradient(180deg, #2a1a0e 0%, #3a2a1a 30%, #5a3a1a 70%, #7a4a1a 100%), radial-gradient(ellipse at 50% 40%, #c08040 0%, transparent 80%); }
.scn-clown-song-part1 .bg-dim { position:absolute; inset:0; background: linear-gradient(180deg, #1a0e05 0%, #2a1a0e 40%, #4a2a0e 80%, #5a3a0e 100%); animation: clo-bg 8s ease-in-out infinite alternate; }
.scn-clown-song-part1 .candle { position:absolute; bottom:20%; left:25%; width:6%; height:15%; background: linear-gradient(180deg, #e0c080 0%, #a08040 100%); border-radius: 20% 20% 10% 10%; box-shadow: 0 0 20px 6px rgba(224,192,128,0.4); animation: clo-candle 4s ease-in-out infinite; }
.scn-clown-song-part1 .glow { position:absolute; bottom:25%; left:22%; width:12%; height:18%; background: radial-gradient(ellipse at 50% 30%, #ffd090 0%, #c08040 50%, transparent 80%); border-radius: 50%; animation: clo-glow 3s ease-in-out infinite alternate; }
.scn-clown-song-part1 .clown-body { position:absolute; bottom:10%; left:40%; width:20%; height:45%; background: radial-gradient(ellipse at 50% 30%, #e8c040 0%, #b89830 60%, #806020 100%); border-radius: 50% 50% 40% 40% / 60% 55% 45% 45%; box-shadow: 0 4px 15px rgba(0,0,0,0.3); animation: clo-body 3s ease-in-out infinite; }
.scn-clown-song-part1 .clown-hat { position:absolute; bottom:52%; left:41%; width:18%; height:12%; background: linear-gradient(180deg, #c03020 0%, #902010 100%); border-radius: 50% 50% 20% 20%; transform-origin: bottom center; animation: clo-hat 4s ease-in-out infinite; }
.scn-clown-song-part1 .tankard { position:absolute; bottom:22%; right:30%; width:10%; height:14%; background: linear-gradient(180deg, #a08060 0%, #806040 100%); border-radius: 10% 10% 20% 20%; box-shadow: 0 2px 8px rgba(0,0,0,0.4); animation: clo-tankard 5s ease-in-out infinite; }
.scn-clown-song-part1 .stool-clown { position:absolute; bottom:5%; left:38%; width:24%; height:10%; background: linear-gradient(180deg, #604020 0%, #402010 100%); border-radius: 10% 10% 30% 30%; box-shadow: 0 4px 12px rgba(0,0,0,0.5); }
.scn-clown-song-part1 .lute { position:absolute; bottom:35%; left:45%; width:8%; height:18%; background: radial-gradient(ellipse at 50% 50%, #c8a060 0%, #a08040 100%); border-radius: 40% 40% 20% 20%; transform: rotate(-25deg); animation: clo-lute 6s ease-in-out infinite; }
@keyframes clo-bg { 0% { opacity:0.85 } 50% { opacity:1 } 100% { opacity:0.7 } }
@keyframes clo-candle { 0% { transform: scaleY(1) translateY(0) } 25% { transform: scaleY(1.05) translateY(-2px) } 50% { transform: scaleY(0.98) translateY(1px) } 75% { transform: scaleY(1.02) translateY(-1px) } 100% { transform: scaleY(1) translateY(0) } }
@keyframes clo-glow { 0% { opacity:0.8; transform: scale(1); } 50% { opacity:1; transform: scale(1.1); } 100% { opacity:0.7; transform: scale(0.95); } }
@keyframes clo-body { 0% { transform: rotate(0) translateY(0) } 20% { transform: rotate(5deg) translateY(-3px) } 40% { transform: rotate(-3deg) translateY(2px) } 60% { transform: rotate(4deg) translateY(-5px) } 80% { transform: rotate(-2deg) translateY(1px) } 100% { transform: rotate(0) translateY(0) } }
@keyframes clo-hat { 0% { transform: rotate(0) translateY(0) } 25% { transform: rotate(-8deg) translateY(-4px) } 50% { transform: rotate(6deg) translateY(2px) } 75% { transform: rotate(-4deg) translateY(-1px) } 100% { transform: rotate(0) translateY(0) } }
@keyframes clo-tankard { 0% { transform: rotate(0) } 25% { transform: rotate(-10deg) } 50% { transform: rotate(8deg) } 75% { transform: rotate(-5deg) } 100% { transform: rotate(0) } }
@keyframes clo-lute { 0% { transform: rotate(-25deg) scale(1) } 50% { transform: rotate(-20deg) scale(1.02) } 100% { transform: rotate(-28deg) scale(0.98) } }

/* Scene 1: item-yellow-stockings (warm, sunlit) */
.scn-item-yellow-stockings {
  background: 
    linear-gradient(180deg, #87CEEB 0%, #f0e68c 30%, #c2b280 60%, #a0522d 100%),
    radial-gradient(ellipse at 50% 100%, #d2b48c 0%, transparent 60%);
}
.scn-item-yellow-stockings .sky {
  position:absolute; inset:0 0 40% 0; background: linear-gradient(180deg, #b0e0e6 0%, #87CEEB 100%); animation: ys1-sky 12s ease-in-out infinite alternate;
}
.scn-item-yellow-stockings .hedge {
  position:absolute; bottom:20%; left:0; right:0; height:40%; background: linear-gradient(180deg, #6b8e23 0%, #556b2f 100%); border-radius: 30% 50% 0 0; box-shadow: inset 0 8px 20px rgba(0,0,0,.3); animation: ys1-hedge 20s ease-in-out infinite alternate;
}
.scn-item-yellow-stockings .sunbeam {
  position:absolute; top:10%; left:45%; width:30%; height:70%; background: linear-gradient(135deg, rgba(255,255,200,0.4) 0%, transparent 70%); transform: rotate(15deg); animation: ys1-beam 8s ease-in-out infinite alternate;
}
.scn-item-yellow-stockings .leg-left {
  position:absolute; bottom:8%; left:38%; width:20px; height:70px; background: linear-gradient(180deg, #f0c040 0%, #d4a017 50%, #b8860b 100%); border-radius: 20% 20% 10% 10%; transform-origin: bottom center; animation: ys1-leg 4s ease-in-out infinite;
}
.scn-item-yellow-stockings .leg-right {
  position:absolute; bottom:8%; left:50%; width:20px; height:72px; background: linear-gradient(180deg, #f0c040 0%, #d4a017 50%, #b8860b 100%); border-radius: 20% 20% 10% 10%; transform-origin: bottom center; animation: ys1-leg 4s ease-in-out infinite 0.5s;
}
.scn-item-yellow-stockings .garter {
  position:absolute; bottom:18%; left:38%; width:24px; height:6px; background: linear-gradient(90deg, #8b4513 0%, #a0522d 50%, #8b4513 100%); border-radius: 50%; box-shadow: 0 0 4px rgba(0,0,0,0.5); transform: rotate(-5deg); animation: ys1-garter 3s ease-in-out infinite alternate;
}
.scn-item-yellow-stockings .shadow {
  position:absolute; bottom:0; left:35%; width:40%; height:10px; background: radial-gradient(ellipse, rgba(0,0,0,0.4) 0%, transparent 70%); animation: ys1-shadow 6s ease-in-out infinite alternate;
}
@keyframes ys1-sky { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes ys1-hedge { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(0) } }
@keyframes ys1-beam { 0% { opacity:0.3; transform: rotate(14deg) scaleY(1) } 50% { opacity:0.6; transform: rotate(16deg) scaleY(1.1) } 100% { opacity:0.4; transform: rotate(15deg) scaleY(1) } }
@keyframes ys1-leg { 0% { transform: rotate(-3deg) translateX(0) } 25% { transform: rotate(0deg) translateX(2px) } 50% { transform: rotate(3deg) translateX(0) } 75% { transform: rotate(0deg) translateX(-2px) } 100% { transform: rotate(-3deg) translateX(0) } }
@keyframes ys1-garter { 0% { transform: rotate(-8deg) scale(1) } 50% { transform: rotate(5deg) scale(1.1) } 100% { transform: rotate(-3deg) scale(1) } }
@keyframes ys1-shadow { 0% { opacity:0.4; transform: scaleX(1) } 50% { opacity:0.6; transform: scaleX(1.2) } 100% { opacity:0.4; transform: scaleX(1) } }

/* Scene 2: after-malvolio-exit (funny, sunlit) */
.scn-after-malvolio-exit {
  background: 
    linear-gradient(180deg, #87CEEB 0%, #f5deb3 40%, #deb887 70%, #8b4513 100%),
    radial-gradient(ellipse at 50% 100%, #cd853f 0%, transparent 60%);
}
.scn-after-malvolio-exit .bg-wall {
  position:absolute; inset:0 0 30% 0; background: linear-gradient(180deg, #d2b48c 0%, #a0522d 100%); clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 80% 100%, 75% 0%, 25% 0%, 20% 100%, 0% 100%); animation: am2-wall 20s ease-in-out infinite alternate;
}
.scn-after-malvolio-exit .figure-toby {
  position:absolute; bottom:8%; left:20%; width:40px; height:80px; background: linear-gradient(180deg, #8b4513 0%, #654321 40%, #3e2723 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: am2-toby 3s ease-in-out infinite;
}
.scn-after-malvolio-exit .figure-maria {
  position:absolute; bottom:8%; left:55%; width:30px; height:75px; background: linear-gradient(180deg, #d2691e 0%, #8b4513 50%, #3e2723 100%); border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin: bottom center; animation: am2-maria 3.5s ease-in-out infinite 0.5s;
}
.scn-after-malvolio-exit .stockings {
  position:absolute; bottom:10%; left:38%; width:20px; height:50px; background: linear-gradient(180deg, #ffd700 0%, #daa520 50%, #b8860b 100%); border-radius: 20% 20% 10% 10%; transform: rotate(15deg); animation: am2-stockings 4s ease-in-out infinite;
}
.scn-after-malvolio-exit .hat-toby {
  position:absolute; bottom:70%; left:24%; width:30px; height:15px; background: linear-gradient(90deg, #800000 0%, #a52a2a 100%); border-radius: 50% 50% 30% 30%; transform: rotate(-10deg); animation: am2-hat 2s ease-in-out infinite alternate;
}
.scn-after-malvolio-exit .bush {
  position:absolute; bottom:0; left:60%; width:80px; height:40px; background: linear-gradient(180deg, #556b2f 0%, #2f4f2f 100%); border-radius: 50% 50% 30% 30%; transform: scale(0.8); animation: am2-bush 10s ease-in-out infinite alternate;
}
@keyframes am2-wall { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.85 } }
@keyframes am2-toby { 0% { transform: translateX(0) rotate(-2deg) } 25% { transform: translateX(4px) rotate(1deg) } 50% { transform: translateX(0) rotate(2deg) } 75% { transform: translateX(-4px) rotate(-1deg) } 100% { transform: translateX(0) rotate(-2deg) } }
@keyframes am2-maria { 0% { transform: translateY(0) rotate(0deg) } 33% { transform: translateY(-3px) rotate(3deg) } 66% { transform: translateY(1px) rotate(-2deg) } 100% { transform: translateY(0) rotate(0deg) } }
@keyframes am2-stockings { 0% { transform: rotate(12deg) translateX(0) } 25% { transform: rotate(18deg) translateX(2px) } 50% { transform: rotate(15deg) translateX(0) } 75% { transform: rotate(12deg) translateX(-2px) } 100% { transform: rotate(15deg) translateX(0) } }
@keyframes am2-hat { 0% { transform: rotate(-15deg) translateX(0) } 50% { transform: rotate(0deg) translateX(5px) } 100% { transform: rotate(-10deg) translateX(0) } }
@keyframes am2-bush { 0% { transform: scale(0.8) translateY(0) } 50% { transform: scale(0.85) translateY(-2px) } 100% { transform: scale(0.8) translateY(0) } }

/* Scene 3: olivia-garden-viola-feste (funny, sunlit) */
.scn-olivia-garden-viola-feste {
  background: 
    linear-gradient(180deg, #87CEEB 0%, #98fb98 30%, #3cb371 60%, #2e8b57 100%),
    radial-gradient(ellipse at 50% 100%, #228b22 0%, transparent 70%);
}
.scn-olivia-garden-viola-feste .sky {
  position:absolute; inset:0 0 50% 0; background: linear-gradient(180deg, #b0e0e6 0%, #87CEEB 100%); animation: ogv3-sky 15s ease-in-out infinite alternate;
}
.scn-olivia-garden-viola-feste .ground {
  position:absolute; bottom:0; left:0; right:0; height:50%; background: linear-gradient(180deg, #698b69 0%, #2e8b57 100%); border-radius: 20% 30% 0 0; box-shadow: inset 0 10px 20px rgba(0,0,0,0.3);
}
.scn-olivia-garden-viola-feste .tree {
  position:absolute; bottom:20%; left:10%; width:30px; height:60px; background: linear-gradient(180deg, #8b4513 0%, #5c3317 100%); border-radius: 30% 30% 10% 10%; box-shadow: 0 0 10px rgba(0,0,0,0.2); animation: ogv3-tree 25s ease-in-out infinite alternate;
}
.scn-olivia-garden-viola-feste .drum {
  position:absolute; bottom:20%; left:45%; width:30px; height:20px; background: radial-gradient(circle, #f4a460 0%, #d2691e 70%); border-radius: 50%; box-shadow: 0 4px 8px rgba(0,0,0,0.3); animation: ogv3-drum 2s ease-in-out infinite;
}
.scn-olivia-garden-viola-feste .figure-viola {
  position:absolute; bottom:12%; left:30%; width:25px; height:70px; background: linear-gradient(180deg, #deb887 0%, #a0522d 50%, #4a2e1b 100%); border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin: bottom center; animation: ogv3-viola 4s ease-in-out infinite;
}
.scn-olivia-garden-viola-feste .figure-feste {
  position:absolute; bottom:12%; left:55%; width:28px; height:65px; background: linear-gradient(180deg, #f5deb3 0%, #d2b48c 50%, #8b4513 100%); border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin: bottom center; animation: ogv3-feste 4.5s ease-in-out infinite 0.3s;
}
.scn-olivia-garden-viola-feste .sunlight {
  position:absolute; top:0; left:20%; width:40%; height:100%; background: linear-gradient(135deg, rgba(255,255,200,0.3) 0%, transparent 70%); animation: ogv3-sunlight 10s ease-in-out infinite alternate;
}
@keyframes ogv3-sky { 0% { opacity:0.85 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes ogv3-tree { 0% { transform: rotate(-2deg) scaleY(1) } 50% { transform: rotate(0deg) scaleY(1.02) } 100% { transform: rotate(2deg) scaleY(1) } }
@keyframes ogv3-drum { 0% { transform: translateY(0) scale(1) } 25% { transform: translateY(-4px) scale(1.05) } 50% { transform: translateY(0) scale(1) } 75% { transform: translateY(-2px) scale(1.02) } 100% { transform: translateY(0) scale(1) } }
@keyframes ogv3-viola { 0% { transform: translateX(0) rotate(-1deg) } 30% { transform: translateX(3px) rotate(2deg) } 60% { transform: translateX(-2px) rotate(-1deg) } 100% { transform: translateX(0) rotate(1deg) } }
@keyframes ogv3-feste { 0% { transform: translateY(0) rotate(0deg) } 40% { transform: translateY(-2px) rotate(3deg) } 80% { transform: translateY(1px) rotate(-2deg) } 100% { transform: translateY(0) rotate(0deg) } }
@keyframes ogv3-sunlight { 0% { opacity:0.2; transform: rotate(10deg) scaleX(1) } 50% { opacity:0.5; transform: rotate(15deg) scaleX(1.2) } 100% { opacity:0.3; transform: rotate(12deg) scaleX(1) } }

/* Scene 4: olivia-garden-viola-sir-toby (funny, sunlit) */
.scn-olivia-garden-viola-sir-toby {
  background: 
    linear-gradient(180deg, #87CEEB 0%, #f5deb3 40%, #deb887 70%, #8b4513 100%),
    radial-gradient(ellipse at 50% 100%, #cd853f 0%, transparent 60%);
}
.scn-olivia-garden-viola-sir-toby .sky {
  position:absolute; inset:0 0 40% 0; background: linear-gradient(180deg, #b0e0e6 0%, #87CEEB 100%); animation: ogt4-sky 12s ease-in-out infinite alternate;
}
.scn-olivia-garden-viola-sir-toby .ground {
  position:absolute; bottom:0; left:0; right:0; height:40%; background: linear-gradient(180deg, #698b69 0%, #2e8b57 100%); border-radius: 30% 20% 0 0; box-shadow: inset 0 10px 20px rgba(0,0,0,0.2);
}
.scn-olivia-garden-viola-sir-toby .figure-viola {
  position:absolute; bottom:8%; left:25%; width:25px; height:70px; background: linear-gradient(180deg, #deb887 0%, #a0522d 50%, #4a2e1b 100%); border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin: bottom center; animation: ogt4-viola 4s ease-in-out infinite;
}
.scn-olivia-garden-viola-sir-toby .figure-toby {
  position:absolute; bottom:6%; left:45%; width:50px; height:80px; background: linear-gradient(180deg, #8b4513 0%, #654321 50%, #3e2723 100%); border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin: bottom center; animation: ogt4-toby 3.5s ease-in-out infinite 0.2s;
}
.scn-olivia-garden-viola-sir-toby .figure-andrew {
  position:absolute; bottom:8%; left:68%; width:20px; height:75px; background: linear-gradient(180deg, #f5deb3 0%, #d2b48c 50%, #8b4513 100%); border-radius: 50% 50% 25% 25% / 60% 60% 25% 25%; transform-origin: bottom center; animation: ogt4-andrew 5s ease-in-out infinite 0.7s;
}
.scn-olivia-garden-viola-sir-toby .hat-andrew {
  position:absolute; bottom:70%; left:66%; width:20px; height:10px; background: linear-gradient(90deg, #800000 0%, #a52a2a 100%); border-radius: 50% 50% 20% 20%; transform: rotate(5deg); animation: ogt4-hat 3s ease-in-out infinite alternate;
}
.scn-olivia-garden-viola-sir-toby .cane {
  position:absolute; bottom:8%; left:62%; width:4px; height:60px; background: linear-gradient(180deg, #8b4513 0%, #a0522d 100%); border-radius: 2px; transform: rotate(10deg); transform-origin: bottom center; animation: ogt4-cane 2s ease-in-out infinite;
}
@keyframes ogt4-sky { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.85 } }
@keyframes ogt4-viola { 0% { transform: translateX(0) rotate(-1deg) } 30% { transform: translateX(2px) rotate(1deg) } 60% { transform: translateX(-1px) rotate(0deg) } 100% { transform: translateX(0) rotate(-1deg) } }
@keyframes ogt4-toby { 0% { transform: translateY(0) rotate(-2deg) scaleX(1) } 25% { transform: translateY(-3px) rotate(1deg) scaleX(1.02) } 50% { transform: translateY(0) rotate(2deg) scaleX(1) } 75% { transform: translateY(-1px) rotate(-1deg) scaleX(0.98) } 100% { transform: translateY(0) rotate(-2deg) scaleX(1) } }
@keyframes ogt4-andrew { 0% { transform: translateX(0) rotate(2deg) } 33% { transform: translateX(-2px) rotate(-1deg) } 66% { transform: translateX(1px) rotate(3deg) } 100% { transform: translateX(0) rotate(2deg) } }
@keyframes ogt4-hat { 0% { transform: rotate(2deg) translateX(0) } 50% { transform: rotate(-8deg) translateX(-3px) } 100% { transform: rotate(5deg) translateX(0) } }
@keyframes ogt4-cane { 0% { transform: rotate(8deg) translateX(0) } 25% { transform: rotate(14deg) translateX(2px) } 50% { transform: rotate(10deg) translateX(0) } 75% { transform: rotate(6deg) translateX(-2px) } 100% { transform: rotate(10deg) translateX(0) } }

/* viola-hopes-twin */
.scn-viola-hopes-twin {
  background: linear-gradient(180deg, #ebd5b5 0%, #d8b992 50%, #b2885a 100%),
              radial-gradient(ellipse at 40% 20%, rgba(255,245,210,0.8) 0%, transparent 60%);
}
.scn-viola-hopes-twin .wall { position:absolute; top:0; left:0; right:0; height:55%; background: linear-gradient(180deg, #f5e6d3, #dcc2a8); }
.scn-viola-hopes-twin .floor { position:absolute; bottom:0; left:0; right:0; height:45%; background: linear-gradient(180deg, #6a5b4a, #3e3026); }
.scn-viola-hopes-twin .window { position:absolute; top:8%; left:30%; width:40%; height:48%; background: linear-gradient(135deg, #fff8e0 0%, #ffecc6 50%, #ffd68a 100%); border-radius:4px; box-shadow: inset 0 0 40px rgba(255,245,200,0.6), 0 0 80px rgba(255,230,180,0.3); animation: vht-flicker 5s ease-in-out infinite alternate; }
.scn-viola-hopes-twin .figure-left { position:absolute; bottom:28%; left:22%; width:26px; height:72px; background: linear-gradient(180deg, #1a0e0e 0%, #0a0505 100%); border-radius: 45% 55% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: vht-swayl 4s ease-in-out infinite; }
.scn-viola-hopes-twin .figure-right { position:absolute; bottom:28%; right:22%; width:26px; height:72px; background: linear-gradient(180deg, #1a0e0e 0%, #0a0505 100%); border-radius: 55% 45% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: vht-swayr 4s ease-in-out infinite; }
.scn-viola-hopes-twin .mirror { position:absolute; bottom:32%; left:50%; width:40px; height:50px; transform:translateX(-50%); background: linear-gradient(45deg, #d4b896 0%, #f0e0c8 50%, #a08060 100%); border-radius:30% 30% 20% 20%; box-shadow: 0 0 30px rgba(200,180,140,0.5); animation: vht-shimmer 6s ease-in-out infinite; }
.scn-viola-hopes-twin .shadow-left { position:absolute; bottom:24%; left:18%; width:80px; height:12px; background: radial-gradient(ellipse, rgba(0,0,0,0.5) 0%, transparent 70%); animation: vht-shadow 4s ease-in-out infinite; }
.scn-viola-hopes-twin .shadow-right { position:absolute; bottom:24%; right:18%; width:80px; height:12px; background: radial-gradient(ellipse, rgba(0,0,0,0.5) 0%, transparent 70%); animation: vht-shadow 4s ease-in-out infinite reverse; }
@keyframes vht-flicker { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.9; } }
@keyframes vht-swayl { 0%,100% { transform: translateX(0) rotate(-1deg); } 50% { transform: translateX(2px) rotate(1deg); } }
@keyframes vht-swayr { 0%,100% { transform: translateX(0) rotate(1deg); } 50% { transform: translateX(-2px) rotate(-1deg); } }
@keyframes vht-shimmer { 0% { background-position:0% 0%; opacity:0.8; } 50% { background-position:100% 100%; opacity:1; } 100% { background-position:0% 0%; opacity:0.85; } }
@keyframes vht-shadow { 0%,100% { transform: scaleX(1); } 50% { transform: scaleX(1.2); } }

/* andrew-toby-chase */
.scn-andrew-toby-chase {
  background: linear-gradient(180deg, #f2d8b0 0%, #dbb88a 50%, #b08a60 100%),
              radial-gradient(circle at 50% 30%, rgba(255,220,150,0.5) 0%, transparent 60%);
}
.scn-andrew-toby-chase .floor { position:absolute; bottom:0; left:0; right:0; height:40%; background: linear-gradient(180deg, #8a7a5a, #5d4e34); }
.scn-andrew-toby-chase .wall { position:absolute; top:0; left:0; right:0; height:60%; background: linear-gradient(180deg, #e8c8a8, #c9a882); }
.scn-andrew-toby-chase .table { position:absolute; bottom:32%; left:20%; width:90px; height:40px; background: linear-gradient(180deg, #6e4e2e, #4a3020); border-radius: 4px; animation: atc-wobble 2s ease-in-out infinite; }
.scn-andrew-toby-chase .chair { position:absolute; bottom:34%; left:55%; width:35px; height:50px; transform: rotate(20deg); background: linear-gradient(180deg, #7a5a3a, #4a3020); border-radius: 6px; animation: atc-roll 1.5s ease-in-out infinite; }
.scn-andrew-toby-chase .toby { position:absolute; bottom:18%; left:30%; width:30px; height:68px; background: linear-gradient(180deg, #3a2a1a 0%, #1a0e06 100%); border-radius: 50% 40% 40% 40% / 60% 50% 50% 60%; transform-origin: bottom; animation: atc-runL 1.6s steps(4) infinite; }
.scn-andrew-toby-chase .andrew { position:absolute; bottom:20%; right:15%; width:28px; height:65px; background: linear-gradient(180deg, #2a3a2a 0%, #0a1a0a 100%); border-radius: 40% 50% 40% 40% / 50% 60% 60% 50%; transform-origin: bottom; animation: atc-runR 2.1s steps(4) infinite reverse; }
.scn-andrew-toby-chase .dust { position:absolute; bottom:22%; left:38%; width:40px; height:20px; background: radial-gradient(ellipse, rgba(200,180,130,0.6) 0%, transparent 80%); animation: atc-dust 2.4s ease-in-out infinite; }
.scn-andrew-toby-chase .bottle { position:absolute; bottom:30%; right:35%; width:12px; height:20px; background: linear-gradient(180deg, #5a4a30, #3a2a18); border-radius: 50% 50% 20% 20%; transform: rotate(-15deg); animation: atc-roll 2s ease-in-out infinite; }
@keyframes atc-wobble { 0%,100% { transform: rotate(0deg); } 25% { transform: rotate(5deg); } 50% { transform: rotate(-5deg); } 75% { transform: rotate(3deg); } }
@keyframes atc-roll { 0% { transform: translateX(0) rotate(-15deg); } 50% { transform: translateX(8px) rotate(10deg); } 100% { transform: translateX(0) rotate(-15deg); } }
@keyframes atc-runL { 0% { transform: translateY(0) skewX(0deg); } 25% { transform: translateY(-3px) skewX(5deg); } 50% { transform: translateY(0) skewX(-5deg); } 75% { transform: translateY(-2px) skewX(5deg); } 100% { transform: translateY(0) skewX(0deg); } }
@keyframes atc-runR { 0% { transform: translateY(0) skewX(0deg); } 25% { transform: translateY(-4px) skewX(-5deg); } 50% { transform: translateY(0) skewX(5deg); } 75% { transform: translateY(-3px) skewX(-5deg); } 100% { transform: translateY(0) skewX(0deg); } }
@keyframes atc-dust { 0%,100% { opacity:0.6; transform: scale(1); } 50% { opacity:1; transform: scale(1.3); } }

/* sebastian-clown-game */
.scn-sebastian-clown-game {
  background: linear-gradient(180deg, #aed8f0 0%, #78b8d8 40%, #4a8898 100%),
              radial-gradient(ellipse at 30% 70%, rgba(255,200,80,0.3) 0%, transparent 70%);
}
.scn-sebastian-clown-game .sky { position:absolute; top:0; left:0; right:0; height:70%; background: linear-gradient(180deg, #b8e0f0 0%, #80c0d8 100%); animation: scg-sky 20s ease-in-out infinite alternate; }
.scn-sebastian-clown-game .ground { position:absolute; bottom:0; left:0; right:0; height:30%; background: linear-gradient(180deg, #7aaa5a, #4a7a2a); }
.scn-sebastian-clown-game .house { position:absolute; bottom:20%; left:15%; width:120px; height:90px; background: linear-gradient(180deg, #d8b888, #b09060); border-radius: 6px; box-shadow: 0 8px 20px rgba(0,0,0,0.3); }
.scn-sebastian-clown-game .door { position:absolute; bottom:20%; left:30%; width:30px; height:60px; background: linear-gradient(180deg, #5a3a20, #3a1a0a); border-radius: 4px; box-shadow: inset 0 4px 8px rgba(0,0,0,0.3); }
.scn-sebastian-clown-game .sebastian { position:absolute; bottom:15%; left:40%; width:28px; height:70px; background: linear-gradient(180deg, #1a1a2a 0%, #0a0a1a 100%); border-radius: 45% 45% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom; animation: scg-sway 4s ease-in-out infinite; }
.scn-sebastian-clown-game .clown { position:absolute; bottom:15%; right:35%; width:26px; height:68px; background: linear-gradient(180deg, #2a1a3a 0%, #1a0a1a 100%); border-radius: 50% 40% 40% 40% / 60% 50% 50% 60%; transform-origin: bottom; animation: scg-gesture 3s ease-in-out infinite; }
.scn-sebastian-clown-game .hat { position:absolute; bottom:72%; right:38%; width:24px; height:16px; background: linear-gradient(180deg, #4a2a6a, #2a0a4a); border-radius: 50% 50% 10% 10%; transform-origin: bottom; animation: scg-hatbounce 2s ease-in-out infinite; }
.scn-sebastian-clown-game .bush { position:absolute; bottom:20%; right:10%; width:50px; height:35px; background: radial-gradient(ellipse, #3a7a2a, #1a4a0a); border-radius: 50%; animation: scg-rustle 8s ease-in-out infinite; }
@keyframes scg-sky { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.85; } }
@keyframes scg-sway { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2px) rotate(2deg); } }
@keyframes scg-gesture { 0% { transform: translateY(0) rotate(-3deg); } 25% { transform: translateY(-1px) rotate(-10deg); } 50% { transform: translateY(0) rotate(5deg); } 75% { transform: translateY(-1px) rotate(-2deg); } 100% { transform: translateY(0) rotate(-3deg); } }
@keyframes scg-hatbounce { 0%,100% { transform: translateY(0) rotate(0deg); } 30% { transform: translateY(-6px) rotate(10deg); } 60% { transform: translateY(-3px) rotate(-5deg); } 100% { transform: translateY(0) rotate(0deg); } }
@keyframes scg-rustle { 0%,100% { transform: rotate(0deg); } 25% { transform: rotate(3deg); } 50% { transform: rotate(-2deg); } 75% { transform: rotate(4deg); } }

/* sebastian-pays-clown */
.scn-sebastian-pays-clown {
  background: linear-gradient(180deg, #c8e0c0 0%, #90b880 40%, #507850 100%),
              radial-gradient(ellipse at 60% 40%, rgba(255,230,100,0.4) 0%, transparent 60%);
}
.scn-sebastian-pays-clown .sky { position:absolute; top:0; left:0; right:0; height:60%; background: linear-gradient(180deg, #d0e8d8, #a0c0a0); animation: spc-dapple 15s ease-in-out infinite alternate; }
.scn-sebastian-pays-clown .grass { position:absolute; bottom:0; left:0; right:0; height:40%; background: linear-gradient(180deg, #60a040, #387828); }
.scn-sebastian-pays-clown .sebastian-arm { position:absolute; bottom:22%; left:38%; width:16px; height:40px; background: linear-gradient(180deg, #1a1a2a, #0a0a1a); border-radius: 40% 40% 20% 20%; transform-origin: bottom; animation: spc-reach 4s ease-in-out infinite; }
.scn-sebastian-pays-clown .clown-arm { position:absolute; bottom:22%; right:35%; width:16px; height:38px; background: linear-gradient(180deg, #2a1a3a, #1a0a1a); border-radius: 40% 40% 20% 20%; transform-origin: bottom; animation: spc-reach 4s ease-in-out infinite reverse; }
.scn-sebastian-pays-clown .coin { position:absolute; bottom:35%; left:46%; width:12px; height:12px; background: radial-gradient(circle, #ffd060, #c08020); border-radius:50%; box-shadow: 0 0 8px rgba(255,200,60,0.5); animation: spc-coinfall 6s ease-in-out infinite; }
.scn-sebastian-pays-clown .shadow { position:absolute; bottom:20%; left:35%; width:100px; height:10px; background: radial-gradient(ellipse, rgba(0,0,0,0.3) 0%, transparent 70%); animation: spc-shadow 4s ease-in-out infinite; }
.scn-sebastian-pays-clown .sunlight { position:absolute; top:10%; left:40%; width:60px; height:80px; background: radial-gradient(ellipse, rgba(255,245,180,0.3) 0%, transparent 70%); animation: spc-dapple 12s ease-in-out infinite alternate; }
.scn-sebastian-pays-clown .flowers { position:absolute; bottom:15%; right:15%; width:30px; height:20px; background: radial-gradient(ellipse, #a0c060, #608030); border-radius:50%; animation: spc-dapple 10s ease-in-out infinite; }
@keyframes spc-reach { 0%,100% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-8px) rotate(5deg); } }
@keyframes spc-coinfall { 0% { transform: translateY(0) scale(1); opacity:0; } 30% { opacity:1; } 50% { transform: translateY(-10px) scale(1.2); } 70% { transform: translateY(0) scale(1); opacity:1; } 100% { transform: translateY(0) scale(0.8); opacity:0; } }
@keyframes spc-shadow { 0%,100% { transform: scaleX(1); } 50% { transform: scaleX(0.8); } }
@keyframes spc-dapple { 0% { opacity:0.6; } 50% { opacity:1; } 100% { opacity:0.7; } }

/* olivia-proposes-marriage */
.scn-olivia-proposes-marriage {
  background: 
    linear-gradient(180deg, #f5e6c8 0%, #d4b896 40%, #b8956a 100%),
    radial-gradient(ellipse at 60% 20%, #fff8e0 0%, transparent 60%);
}
.scn-olivia-proposes-marriage .bg-wall {
  position: absolute; inset: 0 0 20% 0;
  background: linear-gradient(180deg, #d4b896 0%, #a88a6a 100%);
  border-radius: 0 0 30% 30% / 0 0 15% 15%;
  box-shadow: inset 0 8px 30px rgba(0,0,0,0.2);
}
.scn-olivia-proposes-marriage .window-stained {
  position: absolute; top: 10%; left: 60%; width: 90px; height: 110px;
  background: 
    radial-gradient(circle at 30% 30%, #f0c060 0%, #d09040 40%, #703020 100%),
    linear-gradient(135deg, #ffd080 0%, transparent 50%, #804030 100%);
  border-radius: 40% 40% 10% 10% / 60% 60% 20% 20%;
  box-shadow: inset 0 0 40px rgba(240, 192, 96, 0.5), 0 0 60px 20px rgba(240, 192, 96, 0.3);
  animation: olp-window 6s ease-in-out infinite alternate;
}
.scn-olivia-proposes-marriage .altar-cloth {
  position: absolute; bottom: 25%; left: 50%; width: 80px; height: 40px;
  transform: translateX(-50%);
  background: linear-gradient(135deg, #c8a87a 0%, #a8885a 50%, #8a6a4a 100%);
  border-radius: 10% 10% 30% 30% / 8% 8% 40% 40%;
  box-shadow: 0 -4px 12px rgba(0,0,0,0.3);
  animation: olp-altar 12s ease-in-out infinite;
}
.scn-olivia-proposes-marriage .crucifix {
  position: absolute; bottom: 35%; left: 50%; width: 8px; height: 30px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #5a3a2a 0%, #3a221a 100%);
  border-radius: 20%;
  box-shadow: 0 0 10px rgba(90, 58, 42, 0.5);
  animation: olp-cross 5s ease-in-out infinite;
}
.scn-olivia-proposes-marriage .figures-olivia {
  position: absolute; bottom: 22%; left: 44%; width: 28px; height: 55px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: olp-olivia 7s ease-in-out infinite;
}
.scn-olivia-proposes-marriage .figures-priest {
  position: absolute; bottom: 22%; left: 56%; width: 26px; height: 58px;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a1006 100%);
  border-radius: 40% 40% 35% 35% / 50% 50% 35% 35%;
  transform-origin: bottom center;
  animation: olp-priest 7s ease-in-out infinite 1s;
}
.scn-olivia-proposes-marriage .sunbeam {
  position: absolute; top: 5%; left: 55%; width: 120px; height: 200px;
  background: linear-gradient(180deg, rgba(255, 240, 200, 0.4) 0%, transparent 100%);
  transform: rotate(-15deg) skewX(-10deg);
  filter: blur(15px);
  animation: olp-beam 8s ease-in-out infinite alternate;
}
.scn-olivia-proposes-marriage .glow-warm {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 60% 20%, rgba(255, 240, 200, 0.3) 0%, transparent 70%);
  animation: olp-glow 10s ease-in-out infinite alternate;
}
.scn-olivia-proposes-marriage .dust-motes {
  position: absolute; top: 10%; left: 0; width: 100%; height: 60%;
  background: repeating-radial-gradient(circle at 30% 40%, rgba(255, 240, 200, 0.6) 0%, transparent 2px, transparent 20px);
  filter: blur(1px);
  animation: olp-dust 20s linear infinite;
}
@keyframes olp-window {
  0% { opacity: 0.7; transform: scale(1); }
  50% { opacity: 1; transform: scale(1.02) rotate(1deg); }
  100% { opacity: 0.8; transform: scale(0.98); }
}
@keyframes olp-altar {
  0%, 100% { transform: translateX(-50%) translateY(0); }
  50% { transform: translateX(-50%) translateY(-2px); }
}
@keyframes olp-cross {
  0% { transform: translateX(-50%) rotate(-2deg); }
  50% { transform: translateX(-50%) rotate(2deg); }
  100% { transform: translateX(-50%) rotate(-1deg); }
}
@keyframes olp-olivia {
  0% { transform: translateX(0) rotate(-1deg); }
  25% { transform: translateX(2px) rotate(1deg); }
  50% { transform: translateX(0) rotate(-2deg); }
  75% { transform: translateX(-2px) rotate(1deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes olp-priest {
  0% { transform: translateX(0) rotate(1deg); }
  25% { transform: translateX(-2px) rotate(-1deg); }
  50% { transform: translateX(0) rotate(2deg); }
  75% { transform: translateX(2px) rotate(-1deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes olp-beam {
  0% { opacity: 0.3; transform: rotate(-15deg) skewX(-10deg) scaleX(1); }
  50% { opacity: 0.7; transform: rotate(-12deg) skewX(-8deg) scaleX(1.1); }
  100% { opacity: 0.4; transform: rotate(-18deg) skewX(-12deg) scaleX(0.9); }
}
@keyframes olp-glow {
  0% { opacity: 0.5; }
  50% { opacity: 0.8; }
  100% { opacity: 0.6; }
}
@keyframes olp-dust {
  0% { transform: translateY(0) translateX(0); }
  50% { transform: translateY(-10px) translateX(20px); }
  100% { transform: translateY(0) translateX(0); }
}

/* feste-fabian-letter */
.scn-feste-fabian-letter {
  background: 
    linear-gradient(180deg, #a0c8e0 0%, #c8e0f0 40%, #e8f4ff 100%),
    radial-gradient(ellipse at 50% 100%, #c8e0f0 0%, transparent 70%);
}
.scn-feste-fabian-letter .sky-bright {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #a0c8e0 0%, #d0e8f8 100%);
  animation: fl-sky 15s ease-in-out infinite alternate;
}
.scn-feste-fabian-letter .house-facade {
  position: absolute; bottom: 20%; left: 25%; width: 55%; height: 60%;
  background: 
    linear-gradient(90deg, #c8b896 0%, #dcc8a8 50%, #b8a080 100%),
    linear-gradient(180deg, transparent 0%, rgba(0,0,0,0.1) 100%);
  border-radius: 4% 4% 0 0;
  box-shadow: 0 -8px 30px rgba(0,0,0,0.2);
}
.scn-feste-fabian-letter .doorway {
  position: absolute; bottom: 20%; left: 45%; width: 12%; height: 35%;
  background: linear-gradient(180deg, #6a5a4a 0%, #3a2a1a 100%);
  border-radius: 30% 30% 0 0;
  box-shadow: inset 0 4px 16px rgba(0,0,0,0.5);
  animation: fl-door 10s ease-in-out infinite;
}
.scn-feste-fabian-letter .feste-figure {
  position: absolute; bottom: 22%; left: 42%; width: 22px; height: 48px;
  background: linear-gradient(180deg, #4a8a3a 0%, #2a5a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: fl-feste 3s ease-in-out infinite;
}
.scn-feste-fabian-letter .fabian-figure {
  position: absolute; bottom: 22%; left: 56%; width: 24px; height: 50px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: fl-fabian 3.5s ease-in-out infinite 0.3s;
}
.scn-feste-fabian-letter .letter-paper {
  position: absolute; bottom: 42%; left: 48%; width: 18px; height: 24px;
  background: linear-gradient(135deg, #fff8e8 0%, #e8dcc4 100%);
  border-radius: 4%;
  box-shadow: 0 4px 8px rgba(0,0,0,0.2);
  animation: fl-letter 2s ease-in-out infinite;
}
.scn-feste-fabian-letter .cloud-fluff {
  position: absolute;
  background: linear-gradient(180deg, rgba(255,255,255,0.7) 0%, rgba(255,255,255,0.2) 100%);
  border-radius: 50%;
  filter: blur(8px);
}
.scn-feste-fabian-letter .clouds-a {
  top: 12%; left: 5%; width: 100px; height: 30px;
  animation: fl-cloud-a 40s linear infinite;
}
.scn-feste-fabian-letter .clouds-b {
  top: 8%; right: 10%; width: 80px; height: 22px;
  animation: fl-cloud-b 35s linear infinite reverse;
}
@keyframes fl-sky {
  0% { opacity: 0.8; }
  50% { opacity: 1; }
  100% { opacity: 0.9; }
}
@keyframes fl-door {
  0%, 100% { transform: scaleX(1); }
  50% { transform: scaleX(1.02); }
}
@keyframes fl-feste {
  0% { transform: translateX(0) rotate(-2deg); }
  25% { transform: translateX(4px) rotate(3deg); }
  50% { transform: translateX(8px) rotate(-1deg); }
  75% { transform: translateX(4px) rotate(2deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes fl-fabian {
  0% { transform: translateX(0) rotate(2deg); }
  25% { transform: translateX(-3px) rotate(-2deg); }
  50% { transform: translateX(-6px) rotate(1deg); }
  75% { transform: translateX(-3px) rotate(-1deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes fl-letter {
  0% { transform: translateY(0) rotate(-5deg); }
  25% { transform: translateY(-6px) rotate(3deg); }
  50% { transform: translateY(0) rotate(5deg); }
  75% { transform: translateY(-4px) rotate(-3deg); }
  100% { transform: translateY(0) rotate(-4deg); }
}
@keyframes fl-cloud-a {
  0% { transform: translateX(-50px); }
  100% { transform: translateX(120vw); }
}
@keyframes fl-cloud-b {
  0% { transform: translateX(0); }
  100% { transform: translateX(-100vw); }
}

/* orsino-bribes-clown */
.scn-orsino-bribes-clown {
  background: 
    linear-gradient(180deg, #c8d8e8 0%, #e0e8f0 50%, #f4f0e8 100%),
    radial-gradient(ellipse at 70% 30%, #fff8e8 0%, transparent 60%);
}
.scn-orsino-bribes-clown .sky-court {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #b0c8d8 0%, #d8e0e8 100%);
  animation: obc-sky 18s ease-in-out infinite alternate;
}
.scn-orsino-bribes-clown .pavilion-canopy {
  position: absolute; top: 10%; left: 20%; width: 60%; height: 25%;
  background: linear-gradient(135deg, #c8a060 0%, #a08040 50%, #806030 100%);
  border-radius: 20% 20% 50% 50% / 30% 30% 10% 10%;
  box-shadow: 0 8px 30px rgba(0,0,0,0.3);
  animation: obc-canopy 8s ease-in-out infinite;
}
.scn-orsino-bribes-clown .orsino-throne {
  position: absolute; bottom: 22%; left: 35%; width: 40px; height: 60px;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a221a 100%);
  border-radius: 10% 10% 30% 30% / 20% 20% 40% 40%;
  box-shadow: 0 6px 20px rgba(0,0,0,0.4);
  animation: obc-throne 4s ease-in-out infinite;
}
.scn-orsino-bribes-clown .feste-jester {
  position: absolute; bottom: 22%; left: 48%; width: 24px; height: 50px;
  background: linear-gradient(180deg, #6aaa4a 0%, #3a7a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: obc-feste 3s ease-in-out infinite;
}
.scn-orsino-bribes-clown .hand-offering {
  position: absolute; bottom: 35%; left: 42%; width: 16px; height: 20px;
  background: linear-gradient(180deg, #d0a080 0%, #a08060 100%);
  border-radius: 50% 50% 30% 30% / 40% 40% 30% 30%;
  transform-origin: bottom right;
  animation: obc-hand 2.5s ease-in-out infinite;
}
.scn-orsino-bribes-clown .coins-falling {
  position: absolute; bottom: 40%; left: 45%; width: 8px; height: 8px;
  background: radial-gradient(circle, #f0c040 0%, #c09030 100%);
  border-radius: 50%;
  box-shadow: 0 0 10px rgba(240, 192, 64, 0.6);
  animation: obc-coins 1.5s ease-in-out infinite;
}
.scn-orsino-bribes-clown .shadow-depth {
  position: absolute; inset: 0;
  background: radial-gradient(ellipse at 40% 60%, transparent 0%, rgba(0,0,0,0.15) 100%);
  pointer-events: none;
}
@keyframes obc-sky {
  0% { opacity: 0.8; }
  50% { opacity: 1; }
  100% { opacity: 0.85; }
}
@keyframes obc-canopy {
  0% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-4px) rotate(2deg); }
  100% { transform: translateY(0) rotate(0deg); }
}
@keyframes obc-throne {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-3px); }
}
@keyframes obc-feste {
  0% { transform: rotate(-3deg) translateX(0); }
  25% { transform: rotate(4deg) translateX(5px); }
  50% { transform: rotate(-2deg) translateX(10px); }
  75% { transform: rotate(3deg) translateX(5px); }
  100% { transform: rotate(0deg) translateX(0); }
}
@keyframes obc-hand {
  0% { transform: rotate(0deg) scaleY(1); }
  50% { transform: rotate(20deg) scaleY(1.1); }
  100% { transform: rotate(0deg) scaleY(1); }
}
@keyframes obc-coins {
  0% { transform: translateY(0) rotate(0deg) scale(1); opacity: 1; }
  50% { transform: translateY(-30px) rotate(180deg) scale(1.3); opacity: 0.8; }
  100% { transform: translateY(0) rotate(360deg) scale(1); opacity: 1; }
}

/* antonio-brought-before-orsino */
.scn-antonio-brought-before-orsino {
  background: 
    linear-gradient(180deg, #c8d0d8 0%, #a0b0c0 50%, #8090a0 100%),
    radial-gradient(ellipse at 50% 50%, #d0d8e0 0%, transparent 70%);
}
.scn-antonio-brought-before-orsino .bg-war-sky {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #a8b8c8 0%, #c0d0e0 50%, #d8e0e8 100%);
  animation: abo-sky 12s ease-in-out infinite alternate;
}
.scn-antonio-brought-before-orsino .ground-sharp {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #6a7a6a 0%, #4a5a4a 100%);
  clip-path: polygon(0% 20%, 10% 0%, 20% 25%, 35% 5%, 50% 15%, 65% 0%, 80% 20%, 90% 5%, 100% 15%, 100% 100%, 0% 100%);
  box-shadow: inset 0 10px 30px rgba(0,0,0,0.4);
}
.scn-antonio-brought-before-orsino .orsino-figure {
  position: absolute; bottom: 22%; left: 60%; width: 30px; height: 60px;
  background: linear-gradient(180deg, #3a2a4a 0%, #1a0a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: abo-orsino 5s ease-in-out infinite;
}
.scn-antonio-brought-before-orsino .antonio-captive {
  position: absolute; bottom: 22%; left: 40%; width: 28px; height: 58px;
  background: linear-gradient(180deg, #6a3a2a 0%, #3a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: abo-antonio 4s ease-in-out infinite;
}
.scn-antonio-brought-before-orsino .officers-left {
  position: absolute; bottom: 22%; left: 30%; width: 22px; height: 52px;
  background: linear-gradient(180deg, #4a5a3a 0%, #2a3a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: abo-officer-l 4.5s ease-in-out infinite 0.5s;
}
.scn-antonio-brought-before-orsino .officers-right {
  position: absolute; bottom: 22%; left: 68%; width: 22px; height: 52px;
  background: linear-gradient(180deg, #4a5a3a 0%, #2a3a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: abo-officer-r 4.5s ease-in-out infinite 0.8s;
}
.scn-antonio-brought-before-orsino .chains-bind {
  position: absolute; bottom: 30%; left: 38%; width: 6px; height: 20px;
  background: linear-gradient(180deg, #a0a0a0 0%, #606060 100%);
  border-radius: 20%;
  box-shadow: 0 0 8px rgba(160, 160, 160, 0.5);
  animation: abo-chains 3s ease-in-out infinite;
}
.scn-antonio-brought-before-orsino .shadow-stripe {
  position: absolute; inset: 0;
  background: linear-gradient(90deg, transparent 30%, rgba(0,0,0,0.2) 50%, transparent 70%);
  pointer-events: none;
  animation: abo-shadow 8s ease-in-out infinite alternate;
}
@keyframes abo-sky {
  0% { opacity: 0.7; }
  50% { opacity: 1; }
  100% { opacity: 0.8; }
}
@keyframes abo-orsino {
  0% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(-3px) rotate(2deg); }
  100% { transform: translateY(0) rotate(0deg); }
}
@keyframes abo-antonio {
  0% { transform: translateX(0) rotate(2deg); }
  25% { transform: translateX(-2px) rotate(-2deg); }
  50% { transform: translateX(0) rotate(1deg); }
  75% { transform: translateX(2px) rotate(-1deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes abo-officer-l {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@keyframes abo-officer-r {
  0%, 100% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
}
@keyframes abo-chains {
  0% { transform: rotate(-5deg); }
  50% { transform: rotate(5deg); }
  100% { transform: rotate(-3deg); }
}
@keyframes abo-shadow {
  0% { opacity: 0.3; transform: scaleX(1); }
  50% { opacity: 0.6; transform: scaleX(1.1); }
  100% { opacity: 0.4; transform: scaleX(0.9); }
}

.scn-orsino-palace-music {
  background: linear-gradient(135deg, #d4af37 0%, #b8860b 40%, #8b6508 100%), radial-gradient(ellipse at 50% 30%, #ffd700 0%, transparent 70%);
}
.scn-orsino-palace-music .col { position:absolute; top:0; bottom:0; width:8%; background:linear-gradient(90deg,#a08050,#705030); border-radius:4px; }
.scn-orsino-palace-music .col:first-child { left:5%; } .scn-orsino-palace-music .col:last-child { right:5%; }
.scn-orsino-palace-music .floor { position:absolute; bottom:0; left:0; right:0; height:20%; background:linear-gradient(180deg,#8b5a2b,#5a3a1a); }
.scn-orsino-palace-music .fig { position:absolute; bottom:20%; left:45%; width:20px; height:50px; background:linear-gradient(180deg,#2a1a0a,#1a0a00); border-radius:50% 50% 40% 40%/60% 60% 40% 40%; animation:opm-fig 4s ease-in-out infinite; }
.scn-orsino-palace-music .n1, .scn-orsino-palace-music .n2 { position:absolute; width:12px; height:12px; background:radial-gradient(circle,#ffd700,#b8860b); border-radius:50%; animation:opm-note 6s ease-in-out infinite; }
.scn-orsino-palace-music .n1 { top:30%; left:30%; animation-delay:0s; } .scn-orsino-palace-music .n2 { top:40%; right:30%; animation-delay:2s; }
.scn-orsino-palace-music .glow { position:absolute; top:10%; left:40%; width:20%; height:10%; background:radial-gradient(ellipse,rgba(255,215,0,.6),transparent); animation:opm-glow 3s ease-in-out infinite alternate; }
@keyframes opm-fig{0%{transform:translateX(0) rotate(0deg)}50%{transform:translateX(2px) rotate(2deg)}100%{transform:translateX(0) rotate(0deg)}}
@keyframes opm-note{0%{transform:translateY(0) scale(1) rotate(0)}50%{transform:translateY(-20px) scale(1.2) rotate(45deg)}100%{transform:translateY(0) scale(1) rotate(0)}}
@keyframes opm-glow{0%{opacity:.5;transform:scale(1)}100%{opacity:1;transform:scale(1.1)}}

.scn-orsino-palace-news {
  background: linear-gradient(135deg, #c49a6c 0%, #8b6914 50%, #5a3e1a 100%), radial-gradient(ellipse at 30% 60%, #ffdd88 0%, transparent 60%);
}
.scn-orsino-palace-news .win { position:absolute; top:15%; left:35%; width:30%; height:40%; background:linear-gradient(135deg,#9ac8e0,#4a7a9a); border:4px solid #705030; border-radius:10%; box-shadow:inset 0 0 30px rgba(255,255,200,.3); animation:opn-win 8s ease-in-out infinite; }
.scn-orsino-palace-news .veil { position:absolute; top:8%; left:32%; width:36%; height:50%; background:linear-gradient(180deg,rgba(200,200,220,.4),rgba(100,100,120,.3)); filter:blur(3px); border-radius:50% 50% 20% 20%; animation:opn-veil 5s ease-in-out infinite; }
.scn-orsino-palace-news .fig { position:absolute; bottom:20%; left:45%; width:18px; height:44px; background:linear-gradient(180deg,#2a1a0a,#1a0a00); border-radius:50% 50% 40% 40%/60% 60% 40% 40%; animation:opn-fig 4s ease-in-out infinite; }
.scn-orsino-palace-news .let { position:absolute; bottom:30%; left:52%; width:20px; height:14px; background:linear-gradient(135deg,#f0e6c8,#c8b08a); border-radius:2px; transform:rotate(-15deg); animation:opn-let 6s ease-in-out infinite; }
.scn-orsino-palace-news .shd { position:absolute; bottom:18%; left:40%; width:30px; height:10px; background:rgba(0,0,0,.3); border-radius:50%; filter:blur(4px); animation:opn-shd 4s ease-in-out infinite; }
.scn-orsino-palace-news .candle { position:absolute; bottom:24%; left:38%; width:4px; height:16px; background:linear-gradient(180deg,#ffdd88,#b8860b); border-radius:2px; animation:opn-candle 3s ease-in-out infinite alternate; }
@keyframes opn-win{0%,100%{box-shadow:inset 0 0 30px rgba(255,255,200,.3)}50%{box-shadow:inset 0 0 50px rgba(255,255,200,.6)}}
@keyframes opn-veil{0%{transform:translateX(0) rotate(-1deg)}50%{transform:translateX(3px) rotate(1deg)}100%{transform:translateX(0) rotate(-1deg)}}
@keyframes opn-fig{0%{transform:translateX(0) rotate(0)}50%{transform:translateX(1px) rotate(1deg)}100%{transform:translateX(0) rotate(0)}}
@keyframes opn-let{0%{transform:rotate(-15deg) translateY(0)}50%{transform:rotate(-10deg) translateY(-2px)}100%{transform:rotate(-15deg) translateY(0)}}
@keyframes opn-shd{0%{transform:scaleX(1)}50%{transform:scaleX(1.2)}100%{transform:scaleX(1)}}
@keyframes opn-candle{0%{opacity:.7;transform:scaleY(1)}100%{opacity:1;transform:scaleY(1.1)}}

.scn-sea-coast-arrival {
  background: linear-gradient(180deg, #f9e8c8 0%, #d4c4a8 40%, #a08060 100%), radial-gradient(ellipse at 80% 80%, #ffd4a0 0%, transparent 60%);
}
.scn-sea-coast-arrival .sky { position:absolute; top:0; left:0; right:0; height:60%; background:linear-gradient(180deg,#87ceeb,#b0e0e6 60%,transparent); animation:sca-sky 20s ease-in-out infinite; }
.scn-sea-coast-arrival .sea { position:absolute; bottom:0; left:0; right:0; height:40%; background:linear-gradient(180deg,#4a7a9a,#2a5a7a); animation:sca-sea 15s ease-in-out infinite; }
.scn-sea-coast-arrival .sand { position:absolute; bottom:0; left:0; right:0; height:15%; background:linear-gradient(180deg,#e8d8b0,#c8b08a); border-radius:40% 20% 0 0; }
.scn-sea-coast-arrival .wreck { position:absolute; bottom:10%; left:15%; width:40px; height:25px; background:linear-gradient(180deg,#6a4a2a,#4a2a0a); border-radius:20% 80% 20% 80%/50% 50% 50% 50%; transform:rotate(-20deg); animation:sca-wreck 12s ease-in-out infinite; }
.scn-sea-coast-arrival .fig1, .scn-sea-coast-arrival .fig2 { position:absolute; bottom:12%; width:16px; height:36px; background:linear-gradient(180deg,#1a1a2a,#0a0a1a); border-radius:50% 50% 40% 40%/60% 60% 40% 40%; animation:sca-fig 6s ease-in-out infinite; }
.scn-sea-coast-arrival .fig1 { left:55%; } .scn-sea-coast-arrival .fig2 { left:62%; animation-delay:0.5s; }
.scn-sea-coast-arrival .wv1, .scn-sea-coast-arrival .wv2 { position:absolute; bottom:25%; width:100%; height:20px; background:radial-gradient(ellipse at 50% 50%,rgba(255,255,255,.4),transparent); animation:sca-wave 8s ease-in-out infinite; }
.scn-sea-coast-arrival .wv1 { left:0; animation-delay:0s; } .scn-sea-coast-arrival .wv2 { left:-5%; animation-delay:-3s; }
@keyframes sca-sky{0%{opacity:.8}50%{opacity:1}100%{opacity:.8}}
@keyframes sca-sea{0%{transform:translateY(0)}50%{transform:translateY(-2px)}100%{transform:translateY(0)}}
@keyframes sca-wreck{0%{transform:rotate(-20deg) translateX(0)}50%{transform:rotate(-22deg) translateX(3px)}100%{transform:rotate(-20deg) translateX(0)}}
@keyframes sca-fig{0%{transform:translateX(0) rotate(0)}50%{transform:translateX(2px) rotate(2deg)}100%{transform:translateX(0) rotate(0)}}
@keyframes sca-wave{0%{transform:translateX(0) scaleX(1)}50%{transform:translateX(10px) scaleX(1.1)}100%{transform:translateX(0) scaleX(1)}}

.scn-sea-coast-news {
  background: linear-gradient(180deg, #f2d8a0 0%, #d4b88a 50%, #a08050 100%), radial-gradient(ellipse at 60% 30%, #ffe0a0 0%, transparent 70%);
}
.scn-sea-coast-news .cliff { position:absolute; bottom:0; left:0; width:40%; height:60%; background:linear-gradient(135deg,#6a5a3a,#4a3a1a); border-radius:0 80% 0 0/0 100% 0 0; box-shadow:inset 0 -10px 30px rgba(0,0,0,.4); animation:scn-cliff 20s ease-in-out infinite; }
.scn-sea-coast-news .sea { position:absolute; bottom:0; right:0; left:40%; height:50%; background:linear-gradient(180deg,#3a6a8a,#1a4a6a); animation:scn-sea 12s ease-in-out infinite; }
.scn-sea-coast-news .sky { position:absolute; top:0; left:0; right:0; height:60%; background:linear-gradient(180deg,#add8e6,#e0f0ff 40%,transparent); animation:scn-sky 18s ease-in-out infinite; }
.scn-sea-coast-news .city { position:absolute; bottom:10%; right:5%; width:60px; height:30px; background:linear-gradient(180deg,#706050,#504030); border-radius:10% 10% 30% 30%; filter:blur(2px); animation:scn-city 25s ease-in-out infinite; }
.scn-sea-coast-news .fig { position:absolute; bottom:22%; left:15%; width:18px; height:40px; background:linear-gradient(180deg,#1a1a2a,#0a0a1a); border-radius:50% 50% 40% 40%/60% 60% 40% 40%; animation:scn-fig 5s ease-in-out infinite; }
.scn-sea-coast-news .brd1, .scn-sea-coast-news .brd2 { position:absolute; width:8px; height:6px; background:radial-gradient(circle,#2a2a3a,transparent); border-radius:50%; animation:scn-bird 10s linear infinite; }
.scn-sea-coast-news .brd1 { top:20%; left:30%; animation-delay:0s; } .scn-sea-coast-news .brd2 { top:18%; left:40%; animation-delay:-4s; }
.scn-sea-coast-news .wv { position:absolute; bottom:30%; left:50%; width:80px; height:12px; background:radial-gradient(ellipse,rgba(255,255,255,.3),transparent); animation:scn-wave 7s ease-in-out infinite; }
@keyframes scn-cliff{0%{transform:translateY(0)}50%{transform:translateY(-2px)}100%{transform:translateY(0)}}
@keyframes scn-sea{0%{transform:translateX(0)}50%{transform:translateX(5px)}100%{transform:translateX(0)}}
@keyframes scn-sky{0%{opacity:.8}50%{opacity:1}100%{opacity:.8}}
@keyframes scn-city{0%{opacity:.6}50%{opacity:.8}100%{opacity:.6}}
@keyframes scn-fig{0%{transform:translateX(0) rotate(0)}50%{transform:translateX(2px) rotate(2deg)}100%{transform:translateX(0) rotate(0)}}
@keyframes scn-bird{0%{transform:translateX(0) translateY(0)}50%{transform:translateX(30px) translateY(-10px)}100%{transform:translateX(60px) translateY(0)}}
@keyframes scn-wave{0%{transform:translateX(0) scaleX(1)}50%{transform:translateX(15px) scaleX(1.2)}100%{transform:translateX(0) scaleX(1)}}

.scn-clown-song-part2 {
  background: 
    linear-gradient(180deg, #3a2a1a 0%, #1a140e 100%),
    radial-gradient(ellipse at 50% 80%, #4a3020 0%, transparent 70%);
  overflow: hidden;
}
.scn-clown-song-part2 .bed-frame {
  position: absolute; bottom: 20%; left: 5%; width: 90%; height: 25%;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 12px 12px 4px 4px;
  box-shadow: 0 -4px 8px rgba(0,0,0,.5), inset 0 2px 4px rgba(255,255,255,.05);
}
.scn-clown-song-part2 .bed-mattress {
  position: absolute; bottom: 22%; left: 8%; width: 84%; height: 18%;
  background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 20px;
  box-shadow: inset 0 4px 8px rgba(0,0,0,.3), 0 2px 4px rgba(0,0,0,.4);
  animation: cs2-mattress 6s ease-in-out infinite;
}
.scn-clown-song-part2 .figure {
  position: absolute; bottom: 23%; left: 20%; width: 40%; height: 16%;
  background: #1a120c;
  border-radius: 50% 50% 30% 30% / 100% 100% 40% 40%;
  transform-origin: bottom center;
  animation: cs2-figure 4s ease-in-out infinite;
}
.scn-clown-song-part2 .jug {
  position: absolute; bottom: 12%; left: 12%; width: 8%; height: 12%;
  background: linear-gradient(90deg, #8B4513 0%, #A0522D 50%, #8B4513 100%);
  border-radius: 10% 10% 20% 20% / 30% 30% 20% 20%;
  box-shadow: -2px 2px 4px rgba(0,0,0,.4);
  animation: cs2-jug 2s ease-in-out infinite;
}
.scn-clown-song-part2 .window {
  position: absolute; top: 8%; left: 5%; width: 25%; height: 35%;
  background: 
    linear-gradient(180deg, #0a1a2a 0%, #1a2a3a 100%),
    repeating-linear-gradient(0deg, transparent, transparent 8px, rgba(200,200,255,.1) 8px, rgba(200,200,255,.1) 10px);
  background-blend-mode: overlay;
  border-radius: 4px;
  border: 6px solid #3a2a1a;
  box-shadow: inset 0 0 20px rgba(0,0,0,.8);
  animation: cs2-rain 1.5s linear infinite;
}
.scn-clown-song-part2 .candle {
  position: absolute; bottom: 12%; right: 15%; width: 3%; height: 8%;
  background: linear-gradient(180deg, #f0d0a0 0%, #c0a080 100%);
  border-radius: 4px 4px 2px 2px;
  box-shadow: 0 0 8px rgba(255,200,100,.3);
}
.scn-clown-song-part2 .candle::after {
  content: '';
  position: absolute; top: -15px; left: 50%; transform: translateX(-50%);
  width: 10px; height: 15px;
  background: radial-gradient(ellipse, #ffd080 0%, #ff8040 60%, transparent 100%);
  border-radius: 50% 50% 30% 30% / 100% 100% 40% 40%;
  animation: cs2-flame 1.5s ease-in-out infinite alternate;
}
.scn-clown-song-part2 .puddle {
  position: absolute; bottom: 5%; left: 30%; width: 15%; height: 3%;
  background: radial-gradient(ellipse at 50% 50%, rgba(160,120,80,.4) 0%, transparent 70%);
  border-radius: 50%;
  animation: cs2-puddle 8s ease-in-out infinite;
}
@keyframes cs2-mattress {
  0% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-4px) scale(1.02); }
  100% { transform: translateY(0) scale(1); }
}
@keyframes cs2-figure {
  0% { transform: translateY(0) rotate(0deg); }
  25% { transform: translateY(-2px) rotate(1deg); }
  50% { transform: translateY(-1px) rotate(-1deg); }
  75% { transform: translateY(-3px) rotate(0.5deg); }
  100% { transform: translateY(0) rotate(0deg); }
}
@keyframes cs2-jug {
  0% { transform: rotate(0deg) translateY(0); }
  30% { transform: rotate(5deg) translateY(-2px); }
  60% { transform: rotate(-3deg) translateY(-1px); }
  100% { transform: rotate(0deg) translateY(0); }
}
@keyframes cs2-rain {
  0% { background-position: 0 0; }
  100% { background-position: 0 20px; }
}
@keyframes cs2-flame {
  0% { transform: translateX(-50%) scale(1); opacity: .9; }
  50% { transform: translateX(-50%) scale(1.1, 1.3); opacity: 1; }
  100% { transform: translateX(-50%) scale(0.9, 1.1); opacity: .8; }
}
@keyframes cs2-puddle {
  0% { transform: scale(1); opacity: .5; }
  50% { transform: scale(1.1); opacity: .7; }
  100% { transform: scale(1); opacity: .5; }
}

.scn-cesario-tries-to-avoid {
  background: linear-gradient(180deg, #f5f0e0 0%, #d4c9a8 100%), radial-gradient(ellipse at 50% 60%, #f5f0e0 0%, transparent 70%);
}
.scn-cesario-tries-to-avoid .room-bg {
  position: absolute; inset: 0; background: linear-gradient(90deg, #b8a88a 0%, #d4c9a8 50%, #b8a88a 100%);
  animation: ces-room-shift 12s ease-in-out infinite alternate;
}
.scn-cesario-tries-to-avoid .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 40%;
  background: linear-gradient(180deg, #9a8b6b 0%, #7a6b4b 100%);
}
.scn-cesario-tries-to-avoid .window {
  position: absolute; top: 15%; right: 10%; width: 80px; height: 100px;
  background: linear-gradient(135deg, #fff8e0 0%, #e0d0b0 100%);
  border: 4px solid #8a7a5a; animation: ces-window-light 3s ease-in-out infinite alternate;
}
.scn-cesario-tries-to-avoid .door {
  position: absolute; bottom: 5%; left: 50%; transform: translateX(-50%); width: 60px; height: 120px;
  background: linear-gradient(180deg, #6a5a3a 0%, #4a3a1a 100%); border-radius: 4px 4px 0 0;
}
.scn-cesario-tries-to-avoid .figure-cesario {
  position: absolute; bottom: 20%; left: 30%; width: 24px; height: 60px;
  background: linear-gradient(180deg, #2a2a3a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%; transform-origin: bottom center;
  animation: ces-figure-turn 8s ease-in-out infinite;
}
.scn-cesario-tries-to-avoid .shadow-figure {
  position: absolute; bottom: 20%; left: 32%; width: 20px; height: 40px;
  background: rgba(0,0,0,0.2); border-radius: 50%; filter: blur(4px);
  animation: ces-shadow 8s ease-in-out infinite;
}
.scn-cesario-tries-to-avoid .light-beam {
  position: absolute; top: 10%; right: 10%; width: 120px; height: 200px;
  background: linear-gradient(135deg, rgba(255,255,200,0.3) 0%, transparent 80%);
  animation: ces-beam 4s ease-in-out infinite alternate;
}
@keyframes ces-room-shift {
  0% { transform: translateX(0); } 50% { transform: translateX(-5px); } 100% { transform: translateX(0); }
}
@keyframes ces-window-light {
  0% { opacity: 0.7; } 50% { opacity: 1; } 100% { opacity: 0.8; }
}
@keyframes ces-figure-turn {
  0% { transform: translateX(0) rotate(0deg); } 50% { transform: translateX(-10px) rotate(-5deg); } 100% { transform: translateX(0) rotate(0deg); }
}
@keyframes ces-shadow {
  0% { transform: translateX(0) scale(1); } 50% { transform: translateX(-10px) scale(1.1); } 100% { transform: translateX(0) scale(1); }
}
@keyframes ces-beam {
  0% { opacity: 0.2; } 50% { opacity: 0.4; } 100% { opacity: 0.3; }
}

.scn-fabian-misleads-cesario {
  background: linear-gradient(180deg, #e8e0d0 0%, #c8b8a0 100%), radial-gradient(ellipse at 50% 80%, #c8b8a0 0%, transparent 50%);
}
.scn-fabian-misleads-cesario .bg-wall {
  position: absolute; inset: 0; background: linear-gradient(90deg, #b0a080 0%, #d0c0a0 50%, #b0a080 100%);
}
.scn-fabian-misleads-cesario .pillar-left {
  position: absolute; left: 10%; top: 0; bottom: 0; width: 30px;
  background: linear-gradient(90deg, #9a8a6a, #b0a080, #9a8a6a); border-radius: 0 4px 4px 0;
}
.scn-fabian-misleads-cesario .pillar-right {
  position: absolute; right: 10%; top: 0; bottom: 0; width: 30px;
  background: linear-gradient(90deg, #9a8a6a, #b0a080, #9a8a6a); border-radius: 4px 0 0 4px;
}
.scn-fabian-misleads-cesario .figure-fabian {
  position: absolute; bottom: 15%; left: 25%; width: 22px; height: 55px;
  background: linear-gradient(180deg, #3a3a4a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  animation: fab-fabian 6s ease-in-out infinite;
}
.scn-fabian-misleads-cesario .figure-cesario {
  position: absolute; bottom: 15%; right: 25%; width: 20px; height: 55px;
  background: linear-gradient(180deg, #2a2a3a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  animation: fab-cesario 6s ease-in-out infinite alternate;
}
.scn-fabian-misleads-cesario .shadow-floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, rgba(0,0,0,0.05), rgba(0,0,0,0.15));
}
.scn-fabian-misleads-cesario .light-spot {
  position: absolute; top: 20%; left: 40%; width: 120px; height: 180px;
  background: radial-gradient(circle, rgba(255,240,200,0.2) 0%, transparent 70%);
  animation: fab-spot 8s ease-in-out infinite alternate;
}
@keyframes fab-fabian {
  0% { transform: translateX(0) rotate(0deg); } 50% { transform: translateX(5px) rotate(3deg); } 100% { transform: translateX(-5px) rotate(-3deg); }
}
@keyframes fab-cesario {
  0% { transform: translateX(0) rotate(0deg); } 50% { transform: translateX(-3px) rotate(-2deg); } 100% { transform: translateX(0) rotate(0deg); }
}
@keyframes fab-spot {
  0% { opacity: 0.3; } 50% { opacity: 0.5; } 100% { opacity: 0.2; }
}

.scn-andrew-cowardly {
  background: linear-gradient(180deg, #fff5e0 0%, #ffe0b0 100%), radial-gradient(ellipse at 50% 50%, #fff5e0 0%, transparent 60%);
}
.scn-andrew-cowardly .bg {
  position: absolute; inset: 0; background: linear-gradient(180deg, #f0e4c8 0%, #e0d0a8 100%);
}
.scn-andrew-cowardly .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #c8b090 0%, #a89070 100%);
}
.scn-andrew-cowardly .figure-andrew {
  position: absolute; bottom: 12%; left: 50%; transform: translateX(-50%); width: 28px; height: 65px;
  background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  animation: and-figure 2s ease-in-out infinite;
}
.scn-andrew-cowardly .rapier {
  position: absolute; bottom: 12%; left: 55%; width: 6px; height: 80px;
  background: linear-gradient(180deg, #c8c0b0 0%, #908070 100%);
  border-radius: 0 0 2px 2px; transform-origin: bottom center;
  animation: and-rapier 2s ease-in-out infinite;
}
.scn-andrew-cowardly .hat {
  position: absolute; top: 10%; left: 50%; transform: translateX(-50%); width: 40px; height: 8px;
  background: #5a4a3a; border-radius: 50%;
  animation: and-hat 2s ease-in-out infinite;
}
.scn-andrew-cowardly .shadow {
  position: absolute; bottom: 5%; left: 48%; width: 30px; height: 10px;
  background: rgba(0,0,0,0.2); border-radius: 50%;
  animation: and-shadow 2s ease-in-out infinite;
}
.scn-andrew-cowardly .sparkle {
  position: absolute; top: 30%; left: 60%; width: 6px; height: 6px;
  background: #ffd700; border-radius: 50%;
  box-shadow: 0 0 8px 2px rgba(255,215,0,0.5);
  animation: and-sparkle 2s ease-in-out infinite;
}
@keyframes and-figure {
  0% { transform: translateX(-50%) rotate(-2deg) scale(1); } 50% { transform: translateX(-50%) rotate(2deg) scale(1.02); } 100% { transform: translateX(-50%) rotate(-2deg) scale(1); }
}
@keyframes and-rapier {
  0% { transform: rotate(-5deg); } 50% { transform: rotate(5deg); } 100% { transform: rotate(-5deg); }
}
@keyframes and-hat {
  0% { transform: translateX(-50%) rotate(0deg); } 50% { transform: translateX(-50%) rotate(5deg); } 100% { transform: translateX(-50%) rotate(0deg); }
}
@keyframes and-shadow {
  0% { transform: scale(1) translateX(0); } 50% { transform: scale(1.1) translateX(5px); } 100% { transform: scale(1) translateX(0); }
}
@keyframes and-sparkle {
  0% { opacity: 0; } 50% { opacity: 1; } 100% { opacity: 0; }
}

.scn-item-horse-capilet {
  background: linear-gradient(180deg, #e8dcc8 0%, #c8b8a0 100%), radial-gradient(ellipse at 50% 30%, #fff5e0 0%, transparent 70%);
}
.scn-item-horse-capilet .sky {
  position: absolute; inset: 0 0 40% 0; background: linear-gradient(180deg, #d0c8b8 0%, #e8e0d0 100%);
}
.scn-item-horse-capilet .ground {
  position: absolute; bottom: 0; left: 0; right: 0; height: 40%;
  background: linear-gradient(180deg, #b0a080 0%, #908060 100%);
}
.scn-item-horse-capilet .horse {
  position: absolute; bottom: 20%; left: 30%; width: 80px; height: 40px;
  background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 50% 50% 20% 20% / 80% 80% 20% 20%;
  animation: hor-gallop 2s ease-in-out infinite;
}
.scn-item-horse-capilet .rider {
  position: absolute; bottom: 20%; left: 30%; width: 20px; height: 40px;
  background: linear-gradient(180deg, #3a3a2a 0%, #1a1a0a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  transform-origin: bottom center;
  animation: hor-rider 2s ease-in-out infinite;
}
.scn-item-horse-capilet .figure-andrew {
  position: absolute; bottom: 15%; right: 20%; width: 22px; height: 55px;
  background: linear-gradient(180deg, #d0c0a0 0%, #b0a080 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  animation: hor-andrew 4s ease-in-out infinite;
}
.scn-item-horse-capilet .mane {
  position: absolute; bottom: 28%; left: 32%; width: 20px; height: 12px;
  background: #4a3a2a; border-radius: 50% 50% 0 0;
  animation: hor-mane 2s ease-in-out infinite;
}
.scn-item-horse-capilet .tail {
  position: absolute; bottom: 20%; left: 22%; width: 8px; height: 20px;
  background: #4a3a2a; border-radius: 0 0 50% 50%;
  animation: hor-tail 2s ease-in-out infinite reverse;
}
.scn-item-horse-capilet .dust {
  position: absolute; bottom: 10%; left: 28%; width: 40px; height: 20px;
  background: rgba(180,160,120,0.5); border-radius: 50%; filter: blur(6px);
  animation: hor-dust 2s ease-in-out infinite;
}
@keyframes hor-gallop {
  0% { transform: translateX(0) rotate(0deg); } 50% { transform: translateX(20px) rotate(-5deg); } 100% { transform: translateX(40px) rotate(0deg); }
}
@keyframes hor-rider {
  0% { transform: translateX(0) translateY(0); } 50% { transform: translateX(10px) translateY(-2px); } 100% { transform: translateX(20px) translateY(0); }
}
@keyframes hor-andrew {
  0% { transform: translateX(0) rotate(0deg); } 50% { transform: translateX(-5px) rotate(-10deg); } 100% { transform: translateX(0) rotate(0deg); }
}
@keyframes hor-mane {
  0% { transform: translateX(0) scaleY(1); } 50% { transform: translateX(3px) scaleY(1.2); } 100% { transform: translateX(0) scaleY(1); }
}
@keyframes hor-tail {
  0% { transform: rotate(0deg); } 50% { transform: rotate(15deg); } 100% { transform: rotate(0deg); }
}
@keyframes hor-dust {
  0% { opacity: 0.5; transform: scale(1); } 50% { opacity: 0.8; transform: scale(1.2); } 100% { opacity: 0; transform: scale(0.8); }
}

.scn-sea-coast-sebastian {background:linear-gradient(180deg,#f0d080,#b0c8e0 60%,#6080a0),radial-gradient(ellipse at 30% 20%,#fce080,transparent 50%);}
.scn-sea-coast-sebastian .s {position:absolute;inset:0;background:linear-gradient(180deg,#b0d0e8,#e0e8f0);animation:sc-s 6s ease-in-out infinite alternate;}
.scn-sea-coast-sebastian .e {position:absolute;bottom:0;left:0;right:0;height:40%;background:linear-gradient(180deg,#4080a0,#205070);animation:sc-e 4s ease-in-out infinite alternate;}
.scn-sea-coast-sebastian .c {position:absolute;bottom:30%;left:10%;height:50%;width:30%;background:linear-gradient(135deg,#8a7a5a,#5a4a2a);border-radius:20% 60% 0 0;box-shadow:inset 0 0 20px rgba(0,0,0,.4);animation:sc-c 12s ease-in-out infinite alternate;}
.scn-sea-coast-sebastian .a {position:absolute;bottom:35%;left:20%;width:14px;height:30px;background:linear-gradient(180deg,#3a2a1a,#1a0a0a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:sc-a 3s ease-in-out infinite;}
.scn-sea-coast-sebastian .b {position:absolute;bottom:35%;left:28%;width:14px;height:30px;background:linear-gradient(180deg,#4a3a2a,#2a1a1a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:sc-b 3.5s ease-in-out infinite .5s;}
@keyframes sc-s {0%{opacity:.9}50%{opacity:1}100%{opacity:.8}}
@keyframes sc-e {0%{transform:translateY(0)}50%{transform:translateY(-3px)}100%{transform:translateY(0)}}
@keyframes sc-c {0%{transform:scaleY(1)}50%{transform:scaleY(1.02)}100%{transform:scaleY(.98)}}
@keyframes sc-a {0%{transform:translateX(0) translateY(0) rotate(-2deg)}50%{transform:translateX(8px) translateY(-2px) rotate(2deg)}100%{transform:translateX(16px) translateY(0) rotate(-1deg)}}
@keyframes sc-b {0%{transform:translateX(0) translateY(0) rotate(0)}50%{transform:translateX(-5px) translateY(-1px) rotate(2deg)}100%{transform:translateX(-10px) translateY(0) rotate(1deg)}}

.scn-street-ring-return {background:linear-gradient(180deg,#e8d8a0,#c0b080 50%,#908060),radial-gradient(ellipse at 60% 30%,#fcf0c0,transparent 60%);}
.scn-street-ring-return .sk {position:absolute;inset:0;background:linear-gradient(180deg,#d8e0f0,#f0f4f8 60%,#e0e0e8);animation:sr-sk 8s ease-in-out infinite alternate;}
.scn-street-ring-return .bg {position:absolute;bottom:35%;left:15%;right:15%;height:30%;background:linear-gradient(180deg,#b8a888,#8a7a5a);border-radius:10% 10% 0 0;box-shadow:inset 0 10px 20px rgba(0,0,0,.3);animation:sr-bg 6s ease-in-out infinite alternate;}
.scn-street-ring-return .st {position:absolute;bottom:0;left:0;right:0;height:35%;background:linear-gradient(180deg,#908060,#605030);animation:sr-st 4s ease-in-out infinite alternate;}
.scn-street-ring-return .dr {position:absolute;bottom:35%;left:45%;width:10%;height:25%;background:linear-gradient(90deg,#6a5a3a,#4a3a1a);border-radius:15% 15% 5% 5%;box-shadow:inset 0 0 15px rgba(0,0,0,.5);animation:sr-dr 5s ease-in-out infinite;}
.scn-street-ring-return .v {position:absolute;bottom:30%;left:35%;width:16px;height:34px;background:linear-gradient(180deg,#5a4a2a,#3a2a0a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:sr-v 2.5s ease-in-out infinite;}
.scn-street-ring-return .m {position:absolute;bottom:30%;left:50%;width:18px;height:36px;background:linear-gradient(180deg,#6a5a3a,#4a3a1a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:sr-m 3s ease-in-out infinite .3s;}
.scn-street-ring-return .r {position:absolute;bottom:48%;left:42%;width:12px;height:12px;background:radial-gradient(circle,#f0d080,#c0a050 60%,transparent);border-radius:50%;box-shadow:0 0 20px 6px #c0a050,0 0 40px 12px rgba(192,160,80,.4);animation:sr-r 2s ease-in-out infinite alternate;}
@keyframes sr-sk {0%{opacity:.9}50%{opacity:1}100%{opacity:.85}}
@keyframes sr-bg {0%{transform:scaleY(1)}50%{transform:scaleY(1.02)}100%{transform:scaleY(.98)}}
@keyframes sr-st {0%{transform:translateX(-2px)}50%{transform:translateX(2px)}100%{transform:translateX(-1px)}}
@keyframes sr-dr {0%{transform:rotate(0)}50%{transform:rotate(2deg)}100%{transform:rotate(-1deg)}}
@keyframes sr-v {0%{transform:translateX(0) translateY(0) rotate(-3deg)}30%{transform:translateX(6px) translateY(-2px) rotate(2deg)}60%{transform:translateX(12px) translateY(0) rotate(-1deg)}100%{transform:translateX(18px) translateY(0) rotate(0)}}
@keyframes sr-m {0%{transform:translateX(0) translateY(0) rotate(2deg)}30%{transform:translateX(-4px) translateY(-1px) rotate(-2deg)}60%{transform:translateX(-8px) translateY(0) rotate(1deg)}100%{transform:translateX(-12px) translateY(0) rotate(0)}}
@keyframes sr-r {0%{box-shadow:0 0 15px 4px #c0a050,0 0 30px 8px rgba(192,160,80,.3);opacity:.8}100%{box-shadow:0 0 25px 8px #e0c060,0 0 50px 16px rgba(224,192,96,.5);opacity:1}}

.scn-olivia-house-night-revels {background:linear-gradient(180deg,#2a1a0a,#3a2a1a 50%,#1a0a00),radial-gradient(ellipse at 50% 20%,#4a3a2a,transparent 70%);}
.scn-olivia-house-night-revels .wl {position:absolute;inset:0;background:linear-gradient(180deg,#2a1a0a,#3a2a1a);animation:oh-wl 12s ease-in-out infinite alternate;}
.scn-olivia-house-night-revels .tb {position:absolute;bottom:25%;left:20%;right:20%;height:12%;background:linear-gradient(90deg,#4a3a1a,#5a4a2a 50%,#3a2a0a);border-radius:5%;box-shadow:0 4px 10px rgba(0,0,0,.6);animation:oh-tb 8s ease-in-out infinite alternate;}
.scn-olivia-house-night-revels .cn {position:absolute;bottom:35%;left:45%;width:10px;height:24px;background:linear-gradient(180deg,#f0d8a0,#c0a060);border-radius:40% 40% 20% 20%;box-shadow:0 0 30px 10px #e0c060,0 0 60px 20px rgba(224,192,96,.4);animation:oh-cn 2s ease-in-out infinite alternate;}
.scn-olivia-house-night-revels .t {position:absolute;bottom:25%;left:27%;width:16px;height:34px;background:linear-gradient(180deg,#5a3a1a,#3a1a0a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:oh-t 3s ease-in-out infinite;}
.scn-olivia-house-night-revels .a {position:absolute;bottom:25%;left:36%;width:14px;height:30px;background:linear-gradient(180deg,#6a4a2a,#4a2a0a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:oh-a 3.5s ease-in-out infinite .4s;}
.scn-olivia-house-night-revels .ch {position:absolute;bottom:23%;left:20%;width:20px;height:26px;background:linear-gradient(180deg,#5a4a2a,#3a2a0a);border-radius:30% 30% 10% 10%;animation:oh-ch 6s ease-in-out infinite alternate;}
.scn-olivia-house-night-revels .bt {position:absolute;bottom:28%;left:40%;width:6px;height:16px;background:linear-gradient(180deg,#4a3a1a,#2a1a00);border-radius:20%;transform:rotate(30deg);animation:oh-bt 4s ease-in-out infinite alternate;}
@keyframes oh-wl {0%{opacity:.8}50%{opacity:1}100%{opacity:.75}}
@keyframes oh-tb {0%{transform:translateY(0)}50%{transform:translateY(-2px)}100%{transform:translateY(0)}}
@keyframes oh-cn {0%{box-shadow:0 0 20px 6px #e0c060,0 0 40px 12px rgba(224,192,96,.3)}50%{box-shadow:0 0 35px 12px #ffd880,0 0 70px 24px rgba(255,216,128,.5)}100%{box-shadow:0 0 25px 8px #e0c060,0 0 50px 16px rgba(224,192,96,.35)}}
@keyframes oh-t {0%{transform:translateX(0) translateY(0) rotate(-4deg)}30%{transform:translateX(6px) translateY(-2px) rotate(3deg)}60%{transform:translateX(12px) translateY(0) rotate(-2deg)}100%{transform:translateX(18px) translateY(0) rotate(0)}}
@keyframes oh-a {0%{transform:translateX(0) translateY(0) rotate(3deg)}30%{transform:translateX(-5px) translateY(-1px) rotate(-2deg)}60%{transform:translateX(-10px) translateY(0) rotate(1deg)}100%{transform:translateX(-15px) translateY(0) rotate(0)}}
@keyframes oh-ch {0%{transform:scaleY(1)}50%{transform:scaleY(1.03)}100%{transform:scaleY(.97)}}
@keyframes oh-bt {0%{transform:rotate(25deg) scale(1)}50%{transform:rotate(35deg) scale(1.05)}100%{transform:rotate(28deg) scale(.95)}}

.scn-night-revelry-singing {background:linear-gradient(180deg,#2a1a0a,#3a2a1a 50%,#1a0a00),radial-gradient(ellipse at 30% 50%,#4a3a2a,transparent 70%);}
.scn-night-revelry-singing .wl {position:absolute;inset:0;background:linear-gradient(180deg,#2a1a0a,#3a2a1a);animation:nr-wl 10s ease-in-out infinite alternate;}
.scn-night-revelry-singing .fl {position:absolute;bottom:0;left:0;right:0;height:20%;background:linear-gradient(180deg,#3a2a1a,#1a0a00);animation:nr-fl 6s ease-in-out infinite alternate;}
.scn-night-revelry-singing .cn {position:absolute;bottom:40%;left:55%;width:8px;height:20px;background:linear-gradient(180deg,#f0d8a0,#c0a060);border-radius:40% 40% 20% 20%;box-shadow:0 0 25px 8px #e0c060,0 0 50px 16px rgba(224,192,96,.4);animation:nr-cn 2.5s ease-in-out infinite alternate;}
.scn-night-revelry-singing .s {position:absolute;bottom:20%;left:35%;width:18px;height:38px;background:linear-gradient(180deg,#5a3a1a,#3a1a0a);border-radius:50% 50% 40% 40%/60% 60% 40% 40%;animation:nr-s 3s ease-in-out infinite;}
.scn-night-revelry-singing .ms {position:absolute;bottom:30%;left:45%;width:30px;height:20px;background:linear-gradient(180deg,#e8d8c0,#c8b8a0);border-radius:4px;transform:rotate(-10deg);box-shadow:0 2px 6px rgba(0,0,0,.5);animation:nr-ms 5s ease-in-out infinite alternate;}
.scn-night-revelry-singing .st {position:absolute;bottom:10%;left:28%;width:20px;height:22px;background:linear-gradient(180deg,#5a4a2a,#3a2a0a);border-radius:30% 30% 10% 10%;animation:nr-st 8s ease-in-out infinite alternate;}
@keyframes nr-wl {0%{opacity:.8}50%{opacity:1}100%{opacity:.75}}
@keyframes nr-fl {0%{transform:translateY(0)}50%{transform:translateY(-2px)}100%{transform:translateY(0)}}
@keyframes nr-cn {0%{box-shadow:0 0 15px 5px #e0c060,0 0 30px 10px rgba(224,192,96,.3)}50%{box-shadow:0 0 30px 10px #ffd880,0 0 60px 20px rgba(255,216,128,.5)}100%{box-shadow:0 0 20px 6px #e0c060,0 0 40px 12px rgba(224,192,96,.35)}}
@keyframes nr-s {0%{transform:translateX(0) translateY(0) rotate(-5deg)}30%{transform:translateX(8px) translateY(-3px) rotate(4deg)}60%{transform:translateX(16px) translateY(0) rotate(-2deg)}100%{transform:translateX(24px) translateY(0) rotate(0)}}
@keyframes nr-ms {0%{transform:rotate(-12deg) scale(1)}50%{transform:rotate(-8deg) scale(1.05)}100%{transform:rotate(-14deg) scale(.95)}}
@keyframes nr-st {0%{transform:scaleY(1)}50%{transform:scaleY(1.04)}100%{transform:scaleY(.96)}}

.scn-duke-orsino-music { background: linear-gradient(180deg, #f5e6d3 0%, #d4b896 100%), radial-gradient(ellipse at 50% 0%, #fff8e7 0%, transparent 70%); }
.scn-duke-orsino-music .bg-wall { position:absolute; inset:0; background: linear-gradient(135deg, #e8d5b7 0%, #c9a87c 100%); }
.scn-duke-orsino-music .window { position:absolute; top:10%; left:75%; width:80px; height:120px; background: linear-gradient(180deg, #fff8e0 0%, #ffe8b0 100%); border-radius: 4px; box-shadow: inset 0 0 20px rgba(255,255,200,0.5), 0 0 40px rgba(255,255,200,0.3); animation: dom-window 6s ease-in-out infinite alternate; }
.scn-duke-orsino-music .curtain-l { position:absolute; top:8%; left:70%; width:20px; height:130px; background: linear-gradient(180deg, #8b6f4e 0%, #6b4f2e 100%); border-radius: 0 0 40% 40%; transform-origin: top left; animation: dom-curtain 10s ease-in-out infinite alternate; }
.scn-duke-orsino-music .curtain-r { position:absolute; top:8%; left:80%; width:20px; height:130px; background: linear-gradient(180deg, #8b6f4e 0%, #6b4f2e 100%); border-radius: 0 0 40% 40%; transform-origin: top right; animation: dom-curtain 10s ease-in-out infinite alternate-reverse; }
.scn-duke-orsino-music .figure.duke { position:absolute; bottom:20%; left:40%; width:40px; height:80px; background: linear-gradient(180deg, #4a3b2a 0%, #2a1b0a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; animation: dom-figure 4s ease-in-out infinite alternate; }
.scn-duke-orsino-music .figure.cesario { position:absolute; bottom:20%; left:50%; width:30px; height:70px; background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; animation: dom-figure 5s ease-in-out infinite alternate; }
.scn-duke-orsino-music .stand { position:absolute; bottom:22%; left:45%; width:10px; height:20px; background: #3a2a1a; border-radius: 2px; box-shadow: 0 -4px 0 0 #6b4f2e; }
.scn-duke-orsino-music .note { position:absolute; width:6px; height:6px; background: #2a1b0a; border-radius: 50%; box-shadow: 0 -6px 0 0 #2a1b0a; }
.scn-duke-orsino-music .note.note-1 { top:30%; left:35%; animation: dom-note 8s ease-in-out infinite; }
.scn-duke-orsino-music .note.note-2 { top:40%; left:55%; animation: dom-note 10s ease-in-out infinite 2s; }
@keyframes dom-window { 0% { opacity:0.9; box-shadow:0 0 20px rgba(255,255,200,0.5); } 50% { opacity:1; box-shadow:0 0 40px rgba(255,255,200,0.8); } 100% { opacity:0.95; box-shadow:0 0 30px rgba(255,255,200,0.6); } }
@keyframes dom-curtain { 0% { transform: rotate(0deg); } 50% { transform: rotate(3deg) scaleX(1.05); } 100% { transform: rotate(0deg); } }
@keyframes dom-figure { 0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2px) rotate(1deg); } 100% { transform: translateY(0) rotate(-1deg); } }
@keyframes dom-note { 0% { transform: translate(0,0) rotate(0deg); opacity:0.7; } 33% { transform: translate(10px,-20px) rotate(10deg); opacity:1; } 66% { transform: translate(-5px,-40px) rotate(-5deg); opacity:0.8; } 100% { transform: translate(5px,-60px) rotate(5deg); opacity:0; } }

.scn-olivia-garden-malvolio-letter { background: linear-gradient(180deg, #87CEEB 0%, #b0e0e6 50%, #f0e68c 100%), radial-gradient(ellipse at 50% 100%, #98fb98 0%, transparent 70%); }
.scn-olivia-garden-malvolio-letter .sky { position:absolute; inset:0 0 60% 0; background: linear-gradient(180deg, #87CEEB 0%, #b0e0e6 100%); animation: ogm-sky 20s ease-in-out infinite alternate; }
.scn-olivia-garden-malvolio-letter .grass { position:absolute; bottom:0; left:0; right:0; height:40%; background: linear-gradient(180deg, #7ccd7c 0%, #228B22 100%); border-radius: 30% 30% 0 0; }
.scn-olivia-garden-malvolio-letter .bush { position:absolute; bottom:35%; width:60px; height:40px; background: linear-gradient(180deg, #2e8b57 0%, #006400 100%); border-radius: 50% 50% 40% 40%; box-shadow: 0 4px 8px rgba(0,0,0,0.3); }
.scn-olivia-garden-malvolio-letter .bush-left { left:10%; animation: ogm-bush 7s ease-in-out infinite alternate; }
.scn-olivia-garden-malvolio-letter .bush-right { right:10%; animation: ogm-bush 7s ease-in-out infinite alternate-reverse; }
.scn-olivia-garden-malvolio-letter .figure { position:absolute; bottom:20%; width:25px; height:50px; background: linear-gradient(180deg, #3a2a1a 0%, #1a0a00 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; }
.scn-olivia-garden-malvolio-letter .figure.toby { left:20%; animation: ogm-figure 5s ease-in-out infinite alternate; }
.scn-olivia-garden-malvolio-letter .figure.andrew { left:30%; animation: ogm-figure 5s ease-in-out infinite alternate 1s; }
.scn-olivia-garden-malvolio-letter .figure.fabian { left:40%; animation: ogm-figure 5s ease-in-out infinite alternate 2s; }
.scn-olivia-garden-malvolio-letter .letter { position:absolute; bottom:30%; left:50%; width:20px; height:28px; background: linear-gradient(135deg, #fff8dc 0%, #f5deb3 100%); border: 1px solid #8b5a2b; transform: translateX(-50%) rotate(-5deg); box-shadow: 0 4px 6px rgba(0,0,0,0.4); animation: ogm-letter 3s ease-in-out infinite; }
.scn-olivia-garden-malvolio-letter .path { position:absolute; bottom:15%; left:50%; width:100px; height:10px; background: linear-gradient(90deg, #d2b48c 0%, #c4a882 50%, #d2b48c 100%); transform: translateX(-50%); border-radius: 5px; }
@keyframes ogm-sky { 0% { opacity:0.9; } 50% { opacity:1; } 100% { opacity:0.85; } }
@keyframes ogm-bush { 0% { transform: scaleX(1) translateY(0); } 50% { transform: scaleX(1.05) translateY(-3px); } 100% { transform: scaleX(1) translateY(0); } }
@keyframes ogm-figure { 0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2px) rotate(2deg); } 100% { transform: translateY(0) rotate(-2deg); } }
@keyframes ogm-letter { 0% { transform: translateX(-50%) rotate(-5deg) translateY(0); } 33% { transform: translateX(-50%) rotate(3deg) translateY(-2px); } 66% { transform: translateX(-50%) rotate(-2deg) translateY(-1px); } 100% { transform: translateX(-50%) rotate(-5deg) translateY(0); } }

.scn-item-malvolio-letter { background: linear-gradient(135deg, #f5deb3 0%, #deb887 50%, #d2b48c 100%), radial-gradient(ellipse at 50% 50%, #fff8dc 0%, transparent 60%); }
.scn-item-malvolio-letter .bg-deep { position:absolute; inset:0; background: linear-gradient(135deg, #d2b48c 0%, #c4a882 100%); animation: iml-bg 8s ease-in-out infinite alternate; }
.scn-item-malvolio-letter .bg-light { position:absolute; inset:10%; background: radial-gradient(ellipse, #fff8dc 0%, transparent 70%); animation: iml-light 6s ease-in-out infinite alternate; }
.scn-item-malvolio-letter .letter { position:absolute; bottom:20%; left:50%; width:120px; height:160px; transform: translateX(-50%); background: linear-gradient(135deg, #fff8dc 0%, #f5deb3 100%); border: 2px solid #8b5a2b; box-shadow: 0 8px 16px rgba(0,0,0,0.5); border-radius: 2px; animation: iml-letter 4s ease-in-out infinite; }
.scn-item-malvolio-letter .hand { position:absolute; bottom:15%; width:30px; height:60px; background: linear-gradient(180deg, #d2a679 0%, #b8860b 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; }
.scn-item-malvolio-letter .hand.hand-l { left:25%; animation: iml-hand-l 3s ease-in-out infinite alternate; }
.scn-item-malvolio-letter .hand.hand-r { right:25%; animation: iml-hand-r 3s ease-in-out infinite alternate-reverse; }
.scn-item-malvolio-letter .seal { position:absolute; bottom:35%; left:50%; width:20px; height:20px; background: #a0522d; border-radius: 50%; transform: translateX(-50%); box-shadow: 0 0 10px rgba(0,0,0,0.5); animation: iml-seal 2s ease-in-out infinite; }
.scn-item-malvolio-letter .shadow { position:absolute; bottom:0; left:10%; right:10%; height:20px; background: rgba(0,0,0,0.3); filter: blur(5px); animation: iml-shadow 4s ease-in-out infinite alternate; }
@keyframes iml-bg { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.7; } }
@keyframes iml-light { 0% { transform: scale(1); opacity:0.9; } 50% { transform: scale(1.1); opacity:1; } 100% { transform: scale(0.95); opacity:0.8; } }
@keyframes iml-letter { 0% { transform: translateX(-50%) rotate(0deg) scale(1); } 50% { transform: translateX(-50%) rotate(1deg) scale(1.02); } 100% { transform: translateX(-50%) rotate(-1deg) scale(1); } }
@keyframes iml-hand-l { 0% { transform: rotate(0deg) translateY(0); } 50% { transform: rotate(10deg) translateY(-5px); } 100% { transform: rotate(-5deg) translateY(0); } }
@keyframes iml-hand-r { 0% { transform: rotate(0deg) translateY(0); } 50% { transform: rotate(-10deg) translateY(-5px); } 100% { transform: rotate(5deg) translateY(0); } }
@keyframes iml-seal { 0% { transform: translateX(-50%) scale(1); } 50% { transform: translateX(-50%) scale(1.1); } 100% { transform: translateX(-50%) scale(0.95); } }
@keyframes iml-shadow { 0% { transform: scaleY(1); opacity:0.3; } 50% { transform: scaleY(1.2); opacity:0.5; } 100% { transform: scaleY(1); opacity:0.2; } }

.scn-malvolio-letter-interpretation { background: linear-gradient(180deg, #deb887 0%, #b8860b 50%, #8b5a2b 100%), radial-gradient(ellipse at 50% 70%, #fff8dc 0%, transparent 70%); }
.scn-malvolio-letter-interpretation .bg-wall { position:absolute; inset:0; background: linear-gradient(180deg, #c4a882 0%, #a08060 100%); animation: mli-wall 12s ease-in-out infinite alternate; }
.scn-malvolio-letter-interpretation .bg-light { position:absolute; top:0; left:50%; width:200px; height:200px; transform: translateX(-50%); background: radial-gradient(circle, #fff8dc 0%, transparent 70%); animation: mli-light 5s ease-in-out infinite alternate; }
.scn-malvolio-letter-interpretation .table { position:absolute; bottom:15%; left:30%; right:30%; height:10%; background: linear-gradient(180deg, #6b4f2e 0%, #4a3520 100%); border-radius: 4px; box-shadow: 0 -2px 0 #3a2510; }
.scn-malvolio-letter-interpretation .figure.malvolio { position:absolute; bottom:25%; left:40%; width:35px; height:90px; background: linear-gradient(180deg, #2a1b0a 0%, #1a0a00 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mli-figure 4s ease-in-out infinite alternate; }
.scn-malvolio-letter-interpretation .letter { position:absolute; bottom:26%; left:45%; width:60px; height:80px; background: linear-gradient(135deg, #fff8dc 0%, #f5deb3 100%); border: 1px solid #8b5a2b; transform: rotate(5deg); box-shadow: 0 4px 8px rgba(0,0,0,0.5); animation: mli-letter 3s ease-in-out infinite; }
.scn-malvolio-letter-interpretation .glow { position:absolute; bottom:25%; left:43%; width:80px; height:100px; background: radial-gradient(circle, #fff8dc 0%, transparent 60%); filter: blur(8px); animation: mli-glow 2s ease-in-out infinite alternate; }
.scn-malvolio-letter-interpretation .shadow-m { position:absolute; bottom:14%; left:35%; right:35%; height:15px; background: rgba(0,0,0,0.4); filter: blur(6px); animation: mli-shadow 4s ease-in-out infinite alternate; }
@keyframes mli-wall { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.7; } }
@keyframes mli-light { 0% { transform: translateX(-50%) scale(1); opacity:0.9; } 50% { transform: translateX(-50%) scale(1.1); opacity:1; } 100% { transform: translateX(-50%) scale(0.9); opacity:0.8; } }
@keyframes mli-figure { 0% { transform: translateY(0) rotate(0deg); } 50% { transform: translateY(-2px) rotate(1deg); } 100% { transform: translateY(0) rotate(-1deg); } }
@keyframes mli-letter { 0% { transform: rotate(5deg) scale(1); } 50% { transform: rotate(8deg) scale(1.02); } 100% { transform: rotate(3deg) scale(1); } }
@keyframes mli-glow { 0% { opacity:0.6; filter: blur(8px); } 50% { opacity:1; filter: blur(12px); } 100% { opacity:0.5; filter: blur(6px); } }
@keyframes mli-shadow { 0% { transform: scaleX(1); opacity:0.4; } 50% { transform: scaleX(1.1); opacity:0.6; } 100% { transform: scaleX(0.9); opacity:0.3; } }
/* end per-scene blocks */

/* auto-stub: parent tag-classes flagged by CSS audit */
.leaf { position: absolute; pointer-events: none; }
.mask { position: absolute; pointer-events: none; }
.pillar { position: absolute; pointer-events: none; }
.rock { position: absolute; pointer-events: none; }
.scn { position: absolute; pointer-events: none; }
.streamer { position: absolute; pointer-events: none; }

/* ============ tier A ============ */
/* per-scene blocks (EXP step_scenes) */
/* Scene: i1-orsino-palace (calm, bright interior) */
.scn-i1-orsino-palace {
  background: linear-gradient(180deg, #f5e6d0 0%, #dac29c 50%, #b8986e 100%),
              radial-gradient(ellipse at 50% 0%, #fff5e6 0%, transparent 70%);
}
.scn-i1-orsino-palace .bg-wall { position:absolute; inset:0; background: linear-gradient(180deg, #e8d8c0 0%, #d4b88a 100%); }
.scn-i1-orsino-palace .arch { position:absolute; top:5%; left:20%; width:60%; height:40%; background: radial-gradient(ellipse at 50% 100%, #c9a87c 0%, transparent 70%); border-radius: 50% / 60% 60% 0 0; box-shadow: inset 0 20px 30px rgba(0,0,0,0.1); animation: o1-breathe 8s ease-in-out infinite alternate; }
.scn-i1-orsino-palace .pillar-left { position:absolute; left:10%; top:5%; width:6%; height:75%; background: linear-gradient(90deg, #b8986e 0%, #d4b88a 30%, #b8986e 100%); border-radius: 4px; box-shadow: 3px 0 8px rgba(0,0,0,0.15); }
.scn-i1-orsino-palace .pillar-right { position:absolute; right:10%; top:5%; width:6%; height:75%; background: linear-gradient(90deg, #b8986e 0%, #d4b88a 30%, #b8986e 100%); border-radius: 4px; box-shadow: -3px 0 8px rgba(0,0,0,0.15); }
.scn-i1-orsino-palace .throne { position:absolute; bottom:15%; left:50%; transform:translateX(-50%); width:20%; height:30%; background: linear-gradient(180deg, #8b6f4a 0%, #6a5438 100%); border-radius: 20% 20% 10% 10% / 30% 30% 20% 20%; box-shadow: 0 8px 20px rgba(0,0,0,0.3); animation: o1-sway 6s ease-in-out infinite alternate; }
.scn-i1-orsino-palace .duke { position:absolute; bottom:20%; left:48%; width:8%; height:20%; background: linear-gradient(180deg, #4a3e32 0%, #2a221a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 30% 30%; transform-origin: bottom center; animation: o1-figure 5s ease-in-out infinite; }
.scn-i1-orsino-palace .musician { position:absolute; bottom:18%; right:30%; width:7%; height:22%; background: linear-gradient(180deg, #5a4e3e 0%, #3a322a 100%); border-radius: 40% 40% 30% 30% / 50% 50% 20% 20%; transform-origin: bottom center; animation: o1-play 4s ease-in-out infinite; }
.scn-i1-orsino-palace .note-a { position:absolute; top:20%; left:35%; width:10px; height:10px; background: radial-gradient(circle, #c9a87c 0%, transparent 70%); border-radius: 50%; filter: blur(2px); animation: o1-drift 14s linear infinite; }
.scn-i1-orsino-palace .note-b { position:absolute; top:15%; right:40%; width:8px; height:8px; background: radial-gradient(circle, #c9a87c 0%, transparent 70%); border-radius: 50%; filter: blur(2px); animation: o1-drift 18s linear infinite reverse; }
@keyframes o1-breathe { 0% { opacity:0.6; } 50% { opacity:1; } 100% { opacity:0.7; } }
@keyframes o1-sway { 0% { transform:translateX(-50%) rotate(0deg); } 50% { transform:translateX(-50%) rotate(1deg); } 100% { transform:translateX(-50%) rotate(-1deg); } }
@keyframes o1-figure { 0% { transform:translateX(0) translateY(0) rotate(0deg); } 50% { transform:translateX(2px) translateY(-3px) rotate(2deg); } 100% { transform:translateX(-2px) translateY(0) rotate(-1deg); } }
@keyframes o1-play { 0% { transform:translateY(0) rotate(0deg); } 25% { transform:translateY(-4px) rotate(5deg); } 75% { transform:translateY(-2px) rotate(-3deg); } 100% { transform:translateY(0) rotate(0deg); } }
@keyframes o1-drift { 0% { transform:translateX(0) translateY(0); opacity:0.3; } 50% { transform:translateX(40px) translateY(-20px); opacity:0.8; } 100% { transform:translateX(80px) translateY(-40px); opacity:0.1; } }

/* Scene: i2-sea-coast (tense, sunlit) */
.scn-i2-sea-coast {
  background: linear-gradient(180deg, #87ceeb 0%, #e0f0ff 40%, #f0d090 100%),
              radial-gradient(ellipse at 70% 30%, #fffacd 0%, transparent 60%);
}
.scn-i2-sea-coast .sky { position:absolute; inset:0 0 50% 0; background: linear-gradient(180deg, #4a90d9 0%, #87ceeb 100%); animation: sc-sky 4s ease-in-out infinite alternate; }
.scn-i2-sea-coast .sea { position:absolute; bottom:30%; left:0; right:0; height:25%; background: linear-gradient(180deg, #2a6f97 0%, #1a4f6f 100%); border-radius: 30% 70% 0 0 / 50% 50% 0 0; animation: sc-sea 2s ease-in-out infinite alternate; }
.scn-i2-sea-coast .shore { position:absolute; bottom:0; left:0; right:0; height:35%; background: linear-gradient(180deg, #d4b88a 0%, #c09a6e 30%, #a87a4a 100%); border-radius: 40% 60% 0 0 / 60% 40% 0 0; }
.scn-i2-sea-coast .wreck-mast { position:absolute; bottom:35%; left:20%; width:3%; height:40%; background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%); border-radius: 2px; transform-origin: bottom center; animation: sc-mast 3s ease-in-out infinite; }
.scn-i2-sea-coast .viola { position:absolute; bottom:15%; left:40%; width:7%; height:18%; background: linear-gradient(180deg, #6a5a4a 0%, #3a322a 100%); border-radius: 40% 40% 30% 30% / 50% 50% 20% 20%; transform-origin: bottom center; animation: sc-figure 2s ease-in-out infinite; }
.scn-i2-sea-coast .captain { position:absolute; bottom:15%; right:35%; width:8%; height:20%; background: linear-gradient(180deg, #5a4a3a 0%, #2a1a0a 100%); border-radius: 45% 45% 35% 35% / 55% 55% 25% 25%; transform-origin: bottom center; animation: sc-figure 2.5s ease-in-out infinite reverse; }
.scn-i2-sea-coast .rock-left { position:absolute; bottom:25%; left:5%; width:12%; height:18%; background: linear-gradient(135deg, #6a5a4a 0%, #4a3a2a 100%); border-radius: 40% 60% 20% 40% / 30% 20% 40% 50%; box-shadow: inset -5px -5px 10px rgba(0,0,0,0.4); }
.scn-i2-sea-coast .rock-right { position:absolute; bottom:20%; right:10%; width:10%; height:15%; background: linear-gradient(45deg, #7a6a5a 0%, #5a4a3a 100%); border-radius: 50% 40% 30% 20% / 40% 50% 20% 30%; box-shadow: inset 5px 5px 10px rgba(0,0,0,0.3); animation: sc-rock 5s ease-in-out infinite; }
@keyframes sc-sky { 0% { opacity:0.7; } 50% { opacity:1; } 100% { opacity:0.8; } }
@keyframes sc-sea { 0% { transform:translateY(0); } 50% { transform:translateY(-5px); } 100% { transform:translateY(3px); } }
@keyframes sc-mast { 0% { transform:rotate(-2deg); } 50% { transform:rotate(3deg); } 100% { transform:rotate(-1deg); } }
@keyframes sc-figure { 0% { transform:translateY(0) rotate(0deg); } 50% { transform:translateY(-3px) rotate(5deg); } 100% { transform:translateY(1px) rotate(-3deg); } }
@keyframes sc-rock { 0% { transform:rotate(0deg); } 50% { transform:rotate(2deg); } 100% { transform:rotate(-1deg); } }

/* Scene: i3-olivia-house (funny, bright interior) */
.scn-i3-olivia-house {
  background: linear-gradient(180deg, #f0e68c 0%, #e0d080 40%, #b8a060 100%),
              radial-gradient(circle at 30% 50%, #fffacd 0%, transparent 60%);
}
.scn-i3-olivia-house .floor { position:absolute; bottom:0; left:0; right:0; height:40%; background: linear-gradient(180deg, #c8a860 0%, #a08040 100%); border-radius: 20% 20% 0 0 / 10% 10% 0 0; }
.scn-i3-olivia-house .wall { position:absolute; inset:0 0 40% 0; background: linear-gradient(180deg, #e8d080 0%, #d0b860 100%); }
.scn-i3-olivia-house .table { position:absolute; bottom:35%; left:30%; width:40%; height:8%; background: linear-gradient(180deg, #8b6914 0%, #7a5a0a 100%); border-radius: 4px; box-shadow: 0 4px 10px rgba(0,0,0,0.3); animation: oh-table 6s ease-in-out infinite; }
.scn-i3-olivia-house .toby { position:absolute; bottom:30%; left:25%; width:16%; height:30%; background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%); border-radius: 50% 50% 30% 30% / 60% 60% 20% 20%; transform-origin: bottom center; animation: oh-wobble 1.5s ease-in-out infinite; }
.scn-i3-olivia-house .maria { position:absolute; bottom:30%; right:30%; width:10%; height:25%; background: linear-gradient(180deg, #4a3e32 0%, #2a221a 100%); border-radius: 40% 40% 30% 30% / 50% 50% 20% 20%; transform-origin: bottom center; animation: oh-shake 2s ease-in-out infinite; }
.scn-i3-olivia-house .bottle { position:absolute; bottom:40%; left:38%; width:4%; height:10%; background: linear-gradient(180deg, #5a4a2a 0%, #3a2a1a 100%); border-radius: 20% 20% 10% 10%; box-shadow: 0 0 8px rgba(0,0,0,0.2); animation: oh-tilt 3s ease-in-out infinite alternate; }
.scn-i3-olivia-house .chair { position:absolute; bottom:20%; right:20%; width:12%; height:18%; background: linear-gradient(180deg, #6a5a3a 0%, #4a3a1a 100%); border-radius: 10% 10% 5% 5%; box-shadow: 2px 2px 6px rgba(0,0,0,0.3); animation: oh-rock 4s ease-in-out infinite; }
@keyframes oh-table { 0% { transform:translateY(0) rotate(0deg); } 50% { transform:translateY(-2px) rotate(1deg); } 100% { transform:translateY(1px) rotate(-1deg); } }
@keyframes oh-wobble { 0% { transform:rotate(0deg); } 25% { transform:rotate(-8deg); } 50% { transform:rotate(10deg); } 75% { transform:rotate(-6deg); } 100% { transform:rotate(0deg); } }
@keyframes oh-shake { 0% { transform:translateX(0); } 25% { transform:translateX(5px); } 50% { transform:translateX(-5px); } 75% { transform:translateX(3px); } 100% { transform:translateX(0); } }
@keyframes oh-tilt { 0% { transform:rotate(-10deg); } 50% { transform:rotate(5deg); } 100% { transform:rotate(-8deg); } }
@keyframes oh-rock { 0% { transform:rotate(0deg); } 50% { transform:rotate(4deg); } 100% { transform:rotate(-2deg); } }

/* Scene: i4-orsino-palace (calm, bright interior) – different composition */
.scn-i4-orsino-palace {
  background: linear-gradient(180deg, #f5e6d0 0%, #e0c8a8 40%, #c8a880 100%),
              radial-gradient(circle at 20% 40%, #fff5e6 0%, transparent 70%);
}
.scn-i4-orsino-palace .floor { position:absolute; bottom:0; left:0; right:0; height:35%; background: linear-gradient(180deg, #d4b88a 0%, #b8986e 100%); border-radius: 30% 30% 0 0 / 20% 20% 0 0; }
.scn-i4-orsino-palace .column-left { position:absolute; left:8%; top:0; width:5%; height:100%; background: linear-gradient(90deg, #b8986e 0%, #d4b88a 30%, #b8986e 100%); border-radius: 4px; box-shadow: 2px 0 8px rgba(0,0,0,0.1); }
.scn-i4-orsino-palace .column-right { position:absolute; right:8%; top:0; width:5%; height:100%; background: linear-gradient(90deg, #b8986e 0%, #d4b88a 30%, #b8986e 100%); border-radius: 4px; box-shadow: -2px 0 8px rgba(0,0,0,0.1); }
.scn-i4-orsino-palace .window { position:absolute; top:10%; left:50%; transform:translateX(-50%); width:30%; height:40%; background: radial-gradient(ellipse at 50% 50%, #fff5e6 0%, #e8d8c0 100%); border: 4px solid #8b6f4a; border-radius: 20%; box-shadow: 0 0 30px 10px rgba(255,245,230,0.5); animation: o2-glow 7s ease-in-out infinite alternate; }
.scn-i4-orsino-palace .valentine { position:absolute; bottom:15%; left:35%; width:8%; height:22%; background: linear-gradient(180deg, #4a3e32 0%, #2a221a 100%); border-radius: 40% 40% 30% 30% / 50% 50% 20% 20%; transform-origin: bottom center; animation: o2-fig 6s ease-in-out infinite; }
.scn-i4-orsino-palace .viola-cesario { position:absolute; bottom:15%; right:35%; width:7%; height:20%; background: linear-gradient(180deg, #3a322a 0%, #1a1a0a 100%); border-radius: 45% 45% 35% 35% / 55% 55% 25% 25%; transform-origin: bottom center; animation: o2-fig 6.5s ease-in-out infinite reverse; }
.scn-i4-orsino-palace .plant { position:absolute; bottom:10%; left:20%; width:10%; height:18%; background: linear-gradient(180deg, #3a5a2a 0%, #2a4a1a 100%); border-radius: 50% 50% 30% 30% / 40% 40% 20% 20%; box-shadow: 0 -4px 6px rgba(0,0,0,0.1); animation: o2-plant 9s ease-in-out infinite; }
@keyframes o2-glow { 0% { opacity:0.7; box-shadow: 0 0 20px 5px rgba(255,245,230,0.3); } 50% { opacity:1; box-shadow: 0 0 40px 15px rgba(255,245,230,0.6); } 100% { opacity:0.8; box-shadow: 0 0 25px 8px rgba(255,245,230,0.4); } }
@keyframes o2-fig { 0% { transform:translateY(0) rotate(0deg); } 50% { transform:translateY(-4px) rotate(3deg); } 100% { transform:translateY(2px) rotate(-2deg); } }
@keyframes o2-plant { 0% { transform:scale(1); } 50% { transform:scale(1.05) rotate(2deg); } 100% { transform:scale(0.98) rotate(-1deg); } }

.scn-iii3-street {
  background: linear-gradient(180deg, #87CEEB 0%, #F0E68C 60%, #D2B48C 100%), radial-gradient(ellipse at 50% 30%, rgba(255,255,224,0.4) 0%, transparent 60%);
}
.scn-iii3-street .sky {
  position: absolute; inset: 0 0 50% 0;
  background: linear-gradient(180deg, #B0E0E6 0%, #F0E68C 100%);
  animation: st-sky 12s ease-in-out infinite alternate;
}
.scn-iii3-street .building-left {
  position: absolute; bottom: 35%; left: 5%; width: 25%; height: 55%;
  background: linear-gradient(180deg, #D2B48C 0%, #A0522D 100%);
  border-radius: 4% 4% 0 0; box-shadow: inset -8px 0 12px rgba(0,0,0,0.3);
  animation: st-building 15s ease-in-out infinite alternate;
}
.scn-iii3-street .building-right {
  position: absolute; bottom: 35%; right: 5%; width: 20%; height: 45%;
  background: linear-gradient(180deg, #DEB887 0%, #8B7355 100%);
  border-radius: 4% 4% 0 0; box-shadow: inset 8px 0 12px rgba(0,0,0,0.3);
  animation: st-building 18s ease-in-out infinite alternate-reverse;
}
.scn-iii3-street .street {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #A0522D 0%, #5C4033 100%);
  border-radius: 20% 20% 0 0 / 10% 10% 0 0;
  animation: st-street 20s ease-in-out infinite alternate;
}
.scn-iii3-street .figure-seb {
  position: absolute; bottom: 25%; left: 35%; width: 22px; height: 60px;
  background: linear-gradient(180deg, #2F1B0E 0%, #0F0703 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: st-figure-seb 6s ease-in-out infinite;
}
.scn-iii3-street .figure-anto {
  position: absolute; bottom: 25%; left: 45%; width: 24px; height: 58px;
  background: linear-gradient(180deg, #3A2318 0%, #1A0D07 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: st-figure-anto 7s ease-in-out infinite 0.5s;
}
.scn-iii3-street .sun-ray {
  position: absolute; top: 8%; left: 20%; width: 120px; height: 120px;
  background: radial-gradient(circle, rgba(255,255,224,0.6) 0%, transparent 70%);
  filter: blur(8px);
  animation: st-sunray 4s ease-in-out infinite alternate;
}
@keyframes st-sky {
  0% { opacity: 0.85; }
  50% { opacity: 1; }
  100% { opacity: 0.9; }
}
@keyframes st-building {
  0% { transform: translateY(0); }
  50% { transform: translateY(-2px); }
  100% { transform: translateY(0); }
}
@keyframes st-street {
  0% { background-position: 0% 0%; }
  50% { background-position: 0% 2%; }
  100% { background-position: 0% 0%; }
}
@keyframes st-figure-seb {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  33% { transform: translateX(3px) translateY(-1px) rotate(1deg); }
  66% { transform: translateX(-2px) translateY(0) rotate(-1deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes st-figure-anto {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  40% { transform: translateX(-4px) translateY(-1px) rotate(-2deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes st-sunray {
  0% { transform: scale(1) rotate(0deg); opacity: 0.5; }
  50% { transform: scale(1.1) rotate(5deg); opacity: 0.8; }
  100% { transform: scale(1) rotate(-5deg); opacity: 0.6; }
}

.scn-iii4-olivia-garden {
  background: linear-gradient(180deg, #90EE90 0%, #228B22 50%, #006400 100%), radial-gradient(ellipse at 50% 20%, rgba(255,255,200,0.4) 0%, transparent 50%);
}
.scn-iii4-olivia-garden .hedge-back {
  position: absolute; bottom: 50%; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #2E8B57 0%, #1B4D3E 100%);
  border-radius: 30% 30% 0 0 / 60% 60% 0 0;
  animation: og-hedge 20s ease-in-out infinite alternate;
}
.scn-iii4-olivia-garden .hedge-front {
  position: absolute; bottom: 25%; left: 10%; width: 80%; height: 20%;
  background: linear-gradient(180deg, #3CB371 0%, #1E5B3E 100%);
  border-radius: 40% 40% 0 0 / 80% 80% 0 0;
  animation: og-hedge 15s ease-in-out infinite alternate-reverse;
}
.scn-iii4-olivia-garden .tree {
  position: absolute; bottom: 40%; left: 70%; width: 40px; height: 90px;
  background: linear-gradient(180deg, #6B8E23 0%, #3B5323 100%);
  border-radius: 50% 50% 40% 40% / 70% 70% 30% 30%;
  transform-origin: bottom center;
  animation: og-tree 12s ease-in-out infinite;
}
.scn-iii4-olivia-garden .path {
  position: absolute; bottom: 0; left: 20%; right: 20%; height: 25%;
  background: linear-gradient(180deg, #D2B48C 0%, #8B7355 100%);
  border-radius: 60% 60% 0 0 / 20% 20% 0 0;
  animation: og-path 22s ease-in-out infinite alternate;
}
.scn-iii4-olivia-garden .flower-bush {
  position: absolute; bottom: 30%; left: 30%; width: 60px; height: 30px;
  background: radial-gradient(circle at 30% 40%, #DDA0DD 0%, #9370DB 40%, transparent 70%);
  border-radius: 50%;
  animation: og-bush 8s ease-in-out infinite;
}
.scn-iii4-olivia-garden .figure-olivia {
  position: absolute; bottom: 22%; left: 45%; width: 20px; height: 55px;
  background: linear-gradient(180deg, #4A3B5C 0%, #2A1F3A 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: og-olivia 5s ease-in-out infinite;
}
.scn-iii4-olivia-garden .figure-maria {
  position: absolute; bottom: 20%; left: 55%; width: 18px; height: 50px;
  background: linear-gradient(180deg, #5C4033 0%, #3A271A 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: og-maria 6s ease-in-out infinite 0.7s;
}
@keyframes og-hedge {
  0% { transform: scaleY(1); }
  50% { transform: scaleY(1.03); }
  100% { transform: scaleY(1); }
}
@keyframes og-tree {
  0% { transform: rotate(-2deg); }
  50% { transform: rotate(2deg); }
  100% { transform: rotate(-2deg); }
}
@keyframes og-path {
  0% { opacity: 0.85; }
  50% { opacity: 1; }
  100% { opacity: 0.85; }
}
@keyframes og-bush {
  0% { transform: translateY(0) scale(1); }
  50% { transform: translateY(-2px) scale(1.05); }
  100% { transform: translateY(0) scale(1); }
}
@keyframes og-olivia {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  33% { transform: translateX(2px) translateY(-1px) rotate(1deg); }
  66% { transform: translateX(-1px) translateY(1px) rotate(-1deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes og-maria {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  50% { transform: translateX(3px) translateY(-2px) rotate(2deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}

.scn-iv1-before-olivia-house {
  background: linear-gradient(180deg, #B0C4DE 0%, #F5DEB3 40%, #DEB887 100%), radial-gradient(ellipse at 50% 40%, rgba(255,255,200,0.5) 0%, transparent 70%);
}
.scn-iv1-before-olivia-house .house-front {
  position: absolute; bottom: 30%; left: 10%; right: 10%; height: 60%;
  background: linear-gradient(180deg, #D2B48C 0%, #A0522D 100%);
  border-radius: 4% 4% 0 0; box-shadow: inset 0 8px 20px rgba(0,0,0,0.3);
  animation: bh-house 20s ease-in-out infinite alternate;
}
.scn-iv1-before-olivia-house .door {
  position: absolute; bottom: 30%; left: 40%; width: 20%; height: 40%;
  background: linear-gradient(180deg, #5C4033 0%, #3A271A 100%);
  border-radius: 10% 10% 0 0; box-shadow: inset 0 4px 8px rgba(0,0,0,0.4);
  animation: bh-door 8s ease-in-out infinite;
}
.scn-iv1-before-olivia-house .steps {
  position: absolute; bottom: 25%; left: 35%; width: 30%; height: 5%;
  background: linear-gradient(180deg, #C4A882 0%, #A0845C 100%);
  border-radius: 20% 20% 0 0;
  animation: bh-steps 14s ease-in-out infinite alternate;
}
.scn-iv1-before-olivia-house .figure-seb {
  position: absolute; bottom: 22%; left: 28%; width: 20px; height: 55px;
  background: linear-gradient(180deg, #2F1B0E 0%, #0F0703 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: bh-seb 4s ease-in-out infinite;
}
.scn-iv1-before-olivia-house .figure-clown {
  position: absolute; bottom: 20%; left: 50%; width: 22px; height: 50px;
  background: linear-gradient(180deg, #6B8E23 0%, #4B5E1E 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: bh-clown 5s ease-in-out infinite 0.3s;
}
.scn-iv1-before-olivia-house .sun-beam {
  position: absolute; top: 10%; left: 60%; width: 80px; height: 200px;
  background: linear-gradient(180deg, rgba(255,255,200,0.4) 0%, transparent 100%);
  filter: blur(10px);
  animation: bh-beam 6s ease-in-out infinite alternate;
}
.scn-iv1-before-olivia-house .shrub {
  position: absolute; bottom: 28%; left: 5%; width: 60px; height: 35px;
  background: radial-gradient(ellipse at 50% 100%, #2E8B57 0%, #1B4D3E 100%);
  border-radius: 50%;
  animation: bh-shrub 10s ease-in-out infinite alternative 2s;
}
@keyframes bh-house {
  0% { transform: translateY(0); }
  50% { transform: translateY(-1px); }
  100% { transform: translateY(0); }
}
@keyframes bh-door {
  0% { transform: scaleX(1); }
  50% { transform: scaleX(0.98); }
  100% { transform: scaleX(1); }
}
@keyframes bh-steps {
  0% { opacity: 0.9; }
  50% { opacity: 1; }
  100% { opacity: 0.9; }
}
@keyframes bh-seb {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  25% { transform: translateX(2px) translateY(-1px) rotate(2deg); }
  50% { transform: translateX(4px) translateY(0) rotate(0deg); }
  75% { transform: translateX(2px) translateY(1px) rotate(-1deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes bh-clown {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  33% { transform: translateX(-3px) translateY(-2px) rotate(-3deg); }
  66% { transform: translateX(2px) translateY(1px) rotate(2deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes bh-beam {
  0% { transform: scale(1) rotate(0deg); opacity: 0.4; }
  50% { transform: scale(1.05) rotate(2deg); opacity: 0.7; }
  100% { transform: scale(1) rotate(-2deg); opacity: 0.5; }
}
@keyframes bh-shrub {
  0% { transform: scale(1); }
  50% { transform: scale(1.02); }
  100% { transform: scale(1); }
}

.scn-iv2-olivia-house {
  background: linear-gradient(180deg, #2F1E16 0%, #1A0E0A 50%, #0D0705 100%), radial-gradient(ellipse at 50% 60%, #3A221A 0%, transparent 70%);
}
.scn-iv2-olivia-house .wall-bg {
  position: absolute; inset: 0;
  background: linear-gradient(180deg, #3A2A22 0%, #1A0E0A 100%);
  animation: oh-wall 25s ease-in-out infinite alternate;
}
.scn-iv2-olivia-house .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #4A3A32 0%, #2A1A12 100%);
  border-radius: 40% 40% 0 0 / 20% 20% 0 0;
  animation: oh-floor 18s ease-in-out infinite alternate;
}
.scn-iv2-olivia-house .table {
  position: absolute; bottom: 20%; left: 35%; width: 30%; height: 10%;
  background: linear-gradient(180deg, #5C4033 0%, #3A271A 100%);
  border-radius: 10%;
  box-shadow: 0 4px 8px rgba(0,0,0,0.5);
  animation: oh-table 12s ease-in-out infinite;
}
.scn-iv2-olivia-house .lamp {
  position: absolute; bottom: 28%; left: 48%; width: 14px; height: 20px;
  background: radial-gradient(circle at center, #FFD700 0%, #FF8C00 50%, transparent 100%);
  border-radius: 50%;
  box-shadow: 0 0 30px 10px rgba(255,200,0,0.4);
  animation: oh-lamp 3s ease-in-out infinite alternate;
}
.scn-iv2-olivia-house .figure-maria {
  position: absolute; bottom: 15%; left: 30%; width: 20px; height: 55px;
  background: linear-gradient(180deg, #4A3B5C 0%, #2A1F3A 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: oh-maria 7s ease-in-out infinite;
}
.scn-iv2-olivia-house .figure-clown {
  position: absolute; bottom: 13%; left: 55%; width: 22px; height: 50px;
  background: linear-gradient(180deg, #6B8E23 0%, #4B5E1E 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: oh-clown 8s ease-in-out infinite 0.5s;
}
.scn-iv2-olivia-house .shadow {
  position: absolute; bottom: 10%; left: 25%; width: 50%; height: 20%;
  background: radial-gradient(ellipse at 50% 50%, rgba(0,0,0,0.3) 0%, transparent 70%);
  filter: blur(6px);
  animation: oh-shadow 9s ease-in-out infinite alternate;
}
@keyframes oh-wall {
  0% { opacity: 0.8; }
  50% { opacity: 1; }
  100% { opacity: 0.85; }
}
@keyframes oh-floor {
  0% { background-position: 0% 0%; }
  50% { background-position: 0% 3%; }
  100% { background-position: 0% 0%; }
}
@keyframes oh-table {
  0% { transform: translateY(0); }
  50% { transform: translateY(-1px); }
  100% { transform: translateY(0); }
}
@keyframes oh-lamp {
  0% { box-shadow: 0 0 20px 5px rgba(255,200,0,0.3); transform: scale(1); }
  50% { box-shadow: 0 0 40px 15px rgba(255,200,0,0.6); transform: scale(1.08); }
  100% { box-shadow: 0 0 20px 5px rgba(255,200,0,0.3); transform: scale(1); }
}
@keyframes oh-maria {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  33% { transform: translateX(2px) translateY(-1px) rotate(1deg); }
  66% { transform: translateX(-1px) translateY(1px) rotate(-1deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes oh-clown {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  40% { transform: translateX(-3px) translateY(-2px) rotate(-2deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes oh-shadow {
  0% { transform: scaleX(1) translateX(0); }
  50% { transform: scaleX(1.1) translateX(5px); }
  100% { transform: scaleX(1) translateX(0); }
}

.scn-iv3-olivia-garden {
  background: linear-gradient(180deg, #0a0a2a 0%, #1a1a4e 40%, #2a2a5e 100%), radial-gradient(ellipse at 20% 30%, rgba(255,255,255,0.1) 0%, transparent 60%), radial-gradient(ellipse at 80% 20%, rgba(255,255,255,0.08) 0%, transparent 50%);
  position: relative;
}
.scn-iv3-olivia-garden .sky {
  position: absolute; inset:0; background: radial-gradient(ellipse at 50% 0%, rgba(200,200,255,0.15) 0%, transparent 70%);
  animation: iv3-sky 12s ease-in-out infinite alternate;
}
.scn-iv3-olivia-garden .ground {
  position: absolute; bottom:0; left:0; right:0; height:30%; background: linear-gradient(180deg, #2a4a2a 0%, #1a2a1a 100%); border-radius: 30% 70% 0 0 / 80% 80% 0 0; box-shadow: inset 0 4px 8px rgba(0,0,0,0.5);
  animation: iv3-ground 15s ease-in-out infinite alternate;
}
.scn-iv3-olivia-garden .tree {
  position: absolute; bottom:30%; left:15%; width:40px; height:80px; background: linear-gradient(180deg, #3a4a3a 0%, #1a2a1a 100%); border-radius: 40% 40% 20% 20% / 60% 60% 30% 30%; transform-origin: bottom center;
  animation: iv3-tree 8s ease-in-out infinite;
}
.scn-iv3-olivia-garden .figure {
  position: absolute; bottom:20%; left:50%; transform:translateX(-50%); width:24px; height:50px; background: linear-gradient(180deg, #1a1a2a 0%, #0a0a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: iv3-figure 6s ease-in-out infinite;
}
.scn-iv3-olivia-garden .pearl {
  position: absolute; bottom:25%; left:55%; width:10px; height:10px; background: radial-gradient(circle, #e0e0ff 0%, #8080c0 60%); border-radius: 50%; box-shadow: 0 0 20px 6px rgba(128,128,192,0.8), 0 0 40px 12px rgba(128,128,192,0.4);
  animation: iv3-pearl 4s ease-in-out infinite alternate;
}
.scn-iv3-olivia-garden .star-1 {
  position: absolute; top:15%; left:20%; width:3px; height:3px; background: white; border-radius: 50%; box-shadow: 0 0 6px 2px rgba(255,255,255,0.6);
  animation: iv3-star1 3s ease-in-out infinite;
}
.scn-iv3-olivia-garden .star-2 {
  position: absolute; top:10%; right:30%; width:2px; height:2px; background: white; border-radius: 50%; box-shadow: 0 0 4px 1px rgba(255,255,255,0.5);
  animation: iv3-star2 4s ease-in-out infinite 1.5s;
}
@keyframes iv3-sky { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes iv3-ground { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(0) } }
@keyframes iv3-tree { 0%,100% { transform: rotate(-1deg) } 50% { transform: rotate(2deg) } }
@keyframes iv3-figure { 0% { transform: translateX(-50%) translateY(0) rotate(-2deg) } 30% { transform: translateX(-48%) translateY(-2px) rotate(1deg) } 70% { transform: translateX(-52%) translateY(1px) rotate(-1deg) } 100% { transform: translateX(-50%) translateY(0) rotate(0deg) } }
@keyframes iv3-pearl { 0% { box-shadow: 0 0 15px 4px rgba(128,128,192,0.6), 0 0 30px 8px rgba(128,128,192,0.3); opacity:0.8 } 50% { box-shadow: 0 0 25px 8px rgba(128,128,192,0.9), 0 0 50px 16px rgba(128,128,192,0.5); opacity:1 } 100% { box-shadow: 0 0 20px 6px rgba(128,128,192,0.7), 0 0 40px 12px rgba(128,128,192,0.4); opacity:0.9 } }
@keyframes iv3-star1 { 0% { opacity:0.3; transform: scale(1) } 50% { opacity:1; transform: scale(1.3) } 100% { opacity:0.7; transform: scale(0.9) } }
@keyframes iv3-star2 { 0% { opacity:0.5; transform: scale(1) } 50% { opacity:1; transform: scale(1.5) } 100% { opacity:0.6; transform: scale(0.8) } }

.scn-v1-before-olivia-house {
  background: linear-gradient(180deg, #87ceeb 0%, #f0e68c 100%), radial-gradient(ellipse at 70% 20%, #fff9c4 0%, transparent 60%);
  position: relative;
}
.scn-v1-before-olivia-house .sky {
  position: absolute; inset:0; background: linear-gradient(180deg, rgba(255,255,255,0.3) 0%, transparent 100%); animation: v1-sky 10s ease-in-out infinite alternate;
}
.scn-v1-before-olivia-house .house {
  position: absolute; bottom:25%; left:50%; transform:translateX(-50%); width:120px; height:90px; background: linear-gradient(180deg, #f5e6d3 0%, #d4c4a8 100%); border-radius: 4% 4% 0 0; box-shadow: 0 4px 12px rgba(0,0,0,0.2);
  animation: v1-house 8s ease-in-out infinite;
}
.scn-v1-before-olivia-house .roof {
  position: absolute; bottom:calc(25% + 90px); left:calc(50% - 70px); width:140px; height:50px; background: linear-gradient(180deg, #c4a882 0%, #a08060 100%); border-radius: 20% 20% 0 0; clip-path: polygon(50% 0%, 0% 100%, 100% 100%);
  animation: v1-roof 6s ease-in-out infinite;
}
.scn-v1-before-olivia-house .door {
  position: absolute; bottom:25%; left:50%; transform:translateX(-50%); width:30px; height:50px; background: linear-gradient(180deg, #6b5b4a 0%, #4a3a2a 100%); border-radius: 20% 20% 0 0; box-shadow: inset 0 2px 4px rgba(0,0,0,0.3);
  animation: v1-door 12s ease-in-out infinite alternate;
}
.scn-v1-before-olivia-house .window {
  position: absolute; bottom:40%; left:55%; width:20px; height:20px; background: radial-gradient(circle, #f0e68c 0%, #d4b878 60%); border-radius: 10%; box-shadow: 0 0 10px 3px rgba(240,230,140,0.5);
  animation: v1-window 5s ease-in-out infinite alternate;
}
.scn-v1-before-olivia-house .figure {
  position: absolute; bottom:20%; left:35%; width:20px; height:40px; background: linear-gradient(180deg, #5a4a3a 0%, #2a1a1a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center;
  animation: v1-figure 7s ease-in-out infinite;
}
.scn-v1-before-olivia-house .letter {
  position: absolute; bottom:30%; left:28%; width:15px; height:20px; background: linear-gradient(135deg, #faf0d0 0%, #e8d8a0 100%); border-radius: 2px; box-shadow: 0 2px 4px rgba(0,0,0,0.2); transform: rotate(-15deg);
  animation: v1-letter 9s ease-in-out infinite;
}
.scn-v1-before-olivia-house .dog {
  position: absolute; bottom:18%; left:65%; width:30px; height:20px; background: linear-gradient(180deg, #8a7a6a 0%, #5a4a3a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: v1-dog 10s ease-in-out infinite;
}
@keyframes v1-sky { 0% { opacity:0.9 } 50% { opacity:1 } 100% { opacity:0.95 } }
@keyframes v1-house { 0%,100% { transform: translateX(-50%) } 50% { transform: translateX(-50%) translateY(-1px) } }
@keyframes v1-roof { 0% { transform: translateY(0) } 50% { transform: translateY(-2px) } 100% { transform: translateY(0) } }
@keyframes v1-door { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.9 } }
@keyframes v1-window { 0% { box-shadow: 0 0 8px 2px rgba(240,230,140,0.4); opacity:0.8 } 50% { box-shadow: 0 0 15px 5px rgba(240,230,140,0.7); opacity:1 } 100% { box-shadow: 0 0 10px 3px rgba(240,230,140,0.5); opacity:0.9 } }
@keyframes v1-figure { 0% { transform: translateY(0) rotate(-1deg) } 25% { transform: translateY(-3px) rotate(2deg) } 75% { transform: translateY(1px) rotate(-1deg) } 100% { transform: translateY(0) rotate(0) } }
@keyframes v1-letter { 0% { transform: rotate(-15deg) translateY(0) } 50% { transform: rotate(-10deg) translateY(-5px) } 100% { transform: rotate(-20deg) translateY(2px) } }
@keyframes v1-dog { 0% { transform: translateY(0) scale(1) } 30% { transform: translateY(-2px) scale(1.05) } 70% { transform: translateY(1px) scale(0.95) } 100% { transform: translateY(0) scale(1) } }

/* i5-olivia-house – bright interior, funny */
.scn-i5-olivia-house {
  background: linear-gradient(180deg, #fff8e7 0%, #fce4b8 40%, #f0c080 100%), radial-gradient(ellipse at 50% 0%, #fff5d0 0%, transparent 70%);
}
.scn-i5-olivia-house .room-wall {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(90deg, #fce4b8 0%, #f5d4a0 50%, #ecc888 100%);
  animation: i5-wall 8s ease-in-out infinite alternate;
}
.scn-i5-olivia-house .room-floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #b8926a 0%, #8a6a4a 100%);
  border-radius: 30% 30% 0 0 / 10% 10% 0 0;
  box-shadow: inset 0 20px 30px rgba(0,0,0,0.3);
}
.scn-i5-olivia-house .window {
  position: absolute; top: 20%; right: 15%; width: 80px; height: 100px;
  background: radial-gradient(ellipse at center, #fff8e0 0%, #ffe080 70%);
  border: 4px solid #8a6a4a; border-radius: 12px 12px 4px 4px;
  box-shadow: inset 0 0 40px rgba(255,255,200,0.6);
  animation: i5-win 6s ease-in-out infinite;
}
.scn-i5-olivia-house .clown-figure {
  position: absolute; bottom: 30%; left: 48%; width: 24px; height: 60px;
  background: linear-gradient(180deg, #d4a574 0%, #a07040 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: i5-clown 4s ease-in-out infinite;
}
.scn-i5-olivia-house .clown-hat {
  position: absolute; bottom: 65%; left: 48%; width: 30px; height: 20px;
  background: linear-gradient(180deg, #e03030 0%, #b02020 100%);
  border-radius: 50% 50% 0 0;
  transform: translateX(-50%) rotate(-5deg);
  animation: i5-hat 3s ease-in-out infinite alternate;
}
.scn-i5-olivia-house .noose-rope {
  position: absolute; bottom: 50%; left: 55%; width: 4px; height: 80px;
  background: linear-gradient(180deg, #8a6a4a 0%, #6a4a2a 100%);
  transform-origin: top center;
  animation: i5-rope 5s ease-in-out infinite;
}
.scn-i5-olivia-house .noose-loop {
  position: absolute; bottom: 45%; left: 53%; width: 20px; height: 20px;
  border: 4px solid #6a4a2a; border-radius: 50%; background: transparent;
  transform-origin: center;
  animation: i5-loop 3s ease-in-out infinite alternate;
}
@keyframes i5-wall {
  0% { background-position: 0% 0%; }
  50% { background-position: 10% 0%; }
  100% { background-position: -10% 0%; }
}
@keyframes i5-win {
  0% { box-shadow: inset 0 0 30px rgba(255,255,200,0.4); opacity: 0.9; }
  50% { box-shadow: inset 0 0 60px rgba(255,255,200,0.8); opacity: 1; }
  100% { box-shadow: inset 0 0 20px rgba(255,255,200,0.3); opacity: 0.85; }
}
@keyframes i5-clown {
  0% { transform: translateX(0) rotate(-2deg) scaleY(1); }
  30% { transform: translateX(8px) rotate(3deg) scaleY(1.05); }
  60% { transform: translateX(-4px) rotate(-4deg) scaleY(0.95); }
  100% { transform: translateX(0) rotate(0) scaleY(1); }
}
@keyframes i5-hat {
  0% { transform: translateX(-50%) rotate(-8deg) scale(1); }
  50% { transform: translateX(-50%) rotate(8deg) scale(1.1); }
  100% { transform: translateX(-50%) rotate(-5deg) scale(0.9); }
}
@keyframes i5-rope {
  0% { transform: rotate(-5deg) translateY(0); }
  50% { transform: rotate(5deg) translateY(-3px); }
  100% { transform: rotate(-3deg) translateY(0); }
}
@keyframes i5-loop {
  0% { transform: translate(-50%, -50%) rotate(-10deg) scale(1); }
  50% { transform: translate(-50%, -50%) rotate(10deg) scale(1.1); }
  100% { transform: translate(-50%, -50%) rotate(0) scale(0.9); }
}

/* ii1-sea-coast – sunlit, sad */
.scn-ii1-sea-coast {
  background: linear-gradient(180deg, #f8d088 0%, #f0b060 30%, #c87830 70%), radial-gradient(ellipse at 50% 80%, #f0a040 0%, transparent 60%);
}
.scn-ii1-sea-coast .sky {
  position: absolute; inset: 0 0 50% 0;
  background: linear-gradient(180deg, #f8d088 0%, #f0b060 40%, #e09838 100%);
  animation: ii1-sky 12s ease-in-out infinite alternate;
}
.scn-ii1-sea-coast .sun {
  position: absolute; top: 15%; left: 45%; width: 60px; height: 60px;
  background: radial-gradient(circle, #fff0a0 0%, #f8c060 60%, transparent 100%);
  border-radius: 50%;
  box-shadow: 0 0 80px rgba(248,192,96,0.6);
  animation: ii1-sun 20s ease-in-out infinite;
}
.scn-ii1-sea-coast .sea {
  position: absolute; bottom: 20%; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #4a7080 0%, #2a5068 100%);
  border-radius: 40% 40% 0 0 / 20% 20% 0 0;
  animation: ii1-sea 8s ease-in-out infinite alternate;
}
.scn-ii1-sea-coast .sand {
  position: absolute; bottom: 0; left: 0; right: 0; height: 20%;
  background: linear-gradient(180deg, #d8b890 0%, #c0a070 100%);
  border-radius: 30% 30% 0 0 / 50% 50% 0 0;
}
.scn-ii1-sea-coast .figure-antonio {
  position: absolute; bottom: 12%; left: 35%; width: 28px; height: 70px;
  background: linear-gradient(180deg, #1a2a3a 0%, #0a1a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii1-antonio 10s ease-in-out infinite;
}
.scn-ii1-sea-coast .figure-sebastian {
  position: absolute; bottom: 10%; left: 55%; width: 22px; height: 60px;
  background: linear-gradient(180deg, #2a3a4a 0%, #1a2a3a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii1-sebastian 12s ease-in-out infinite;
}
.scn-ii1-sea-coast .boat {
  position: absolute; bottom: 18%; left: 70%; width: 60px; height: 20px;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a1a0a 100%);
  border-radius: 40% 40% 20% 20% / 60% 60% 40% 40%;
  transform-origin: center bottom;
  animation: ii1-boat 15s ease-in-out infinite;
}
@keyframes ii1-sky {
  0% { opacity: 0.9; background-position: 0% 0%; }
  50% { opacity: 0.8; background-position: 5% 0%; }
  100% { opacity: 0.7; background-position: -5% 0%; }
}
@keyframes ii1-sun {
  0% { transform: translateY(0) scale(1); box-shadow: 0 0 60px rgba(248,192,96,0.5); }
  50% { transform: translateY(-10px) scale(1.05); box-shadow: 0 0 100px rgba(248,192,96,0.7); }
  100% { transform: translateY(5px) scale(0.95); box-shadow: 0 0 40px rgba(248,192,96,0.3); }
}
@keyframes ii1-sea {
  0% { transform: translateY(0) scaleY(1); }
  50% { transform: translateY(-4px) scaleY(1.02); }
  100% { transform: translateY(0) scaleY(0.98); }
}
@keyframes ii1-antonio {
  0% { transform: translateX(0) rotate(-2deg); }
  25% { transform: translateX(-5px) rotate(1deg); }
  50% { transform: translateX(-12px) rotate(-1deg); }
  100% { transform: translateX(-25px) rotate(0); }
}
@keyframes ii1-sebastian {
  0% { transform: translateX(0) rotate(2deg); }
  30% { transform: translateX(8px) rotate(-1deg); }
  60% { transform: translateX(16px) rotate(1deg); }
  100% { transform: translateX(30px) rotate(0); }
}
@keyframes ii1-boat {
  0% { transform: translateY(0) rotate(-3deg); }
  40% { transform: translateY(-6px) rotate(4deg); }
  80% { transform: translateY(-2px) rotate(-2deg); }
  100% { transform: translateY(0) rotate(0); }
}

/* ii2-street – sunlit, confused */
.scn-ii2-street {
  background: linear-gradient(180deg, #fff0d0 0%, #f8d8a0 40%, #e0b070 100%), radial-gradient(ellipse at 50% 0%, #fff8e0 0%, transparent 60%);
}
.scn-ii2-street .street-sky {
  position: absolute; inset: 0 0 40% 0;
  background: linear-gradient(180deg, #fff0d0 0%, #f8d8a0 100%);
  animation: ii2-sky 15s ease-in-out infinite alternate;
}
.scn-ii2-street .building-left {
  position: absolute; bottom: 0; left: 0; width: 35%; height: 70%;
  background: linear-gradient(180deg, #d8c0a0 0%, #b8a080 100%);
  border-right: 2px solid #8a7a5a;
  box-shadow: -10px 0 20px rgba(0,0,0,0.1);
}
.scn-ii2-street .building-right {
  position: absolute; bottom: 0; right: 0; width: 30%; height: 60%;
  background: linear-gradient(180deg, #c8b090 0%, #a89070 100%);
  border-left: 2px solid #8a7a5a;
  box-shadow: 10px 0 20px rgba(0,0,0,0.1);
}
.scn-ii2-street .door {
  position: absolute; bottom: 0; left: 50%; width: 50px; height: 90px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #7a5a3a 0%, #5a3a1a 100%);
  border-radius: 8px 8px 0 0;
  animation: ii2-door 8s ease-in-out infinite;
}
.scn-ii2-street .viola-figure {
  position: absolute; bottom: 12%; left: 30%; width: 20px; height: 55px;
  background: linear-gradient(180deg, #4a5a6a 0%, #2a3a4a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii2-viola 5s ease-in-out infinite;
}
.scn-ii2-street .malvolio-figure {
  position: absolute; bottom: 10%; left: 55%; width: 24px; height: 70px;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a0a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii2-malvolio 6s ease-in-out infinite;
}
.scn-ii2-street .ring {
  position: absolute; bottom: 20%; left: 40%; width: 10px; height: 10px;
  background: radial-gradient(circle, #f0d080 0%, #c0a050 70%);
  border-radius: 50%;
  box-shadow: 0 0 20px 5px rgba(192,160,80,0.6);
  animation: ii2-ring 3s ease-in-out infinite alternate;
}
@keyframes ii2-sky {
  0% { opacity: 0.85; }
  50% { opacity: 1; }
  100% { opacity: 0.9; }
}
@keyframes ii2-door {
  0% { transform: translateX(-50%) rotate(0) scaleX(1); }
  25% { transform: translateX(-50%) rotate(3deg) scaleX(0.98); }
  75% { transform: translateX(-50%) rotate(-3deg) scaleX(1.02); }
  100% { transform: translateX(-50%) rotate(0) scaleX(1); }
}
@keyframes ii2-viola {
  0% { transform: translateX(0) rotate(-2deg) translateY(0); }
  30% { transform: translateX(10px) rotate(2deg) translateY(-2px); }
  60% { transform: translateX(-5px) rotate(-3deg) translateY(1px); }
  100% { transform: translateX(0) rotate(0) translateY(0); }
}
@keyframes ii2-malvolio {
  0% { transform: translateX(0) rotate(1deg) scaleY(1); }
  40% { transform: translateX(-8px) rotate(-2deg) scaleY(1.03); }
  70% { transform: translateX(6px) rotate(3deg) scaleY(0.98); }
  100% { transform: translateX(0) rotate(0) scaleY(1); }
}
@keyframes ii2-ring {
  0% { transform: scale(1) rotate(0); box-shadow: 0 0 15px 3px rgba(192,160,80,0.4); opacity: 0.8; }
  50% { transform: scale(1.3) rotate(180deg); box-shadow: 0 0 30px 8px rgba(192,160,80,0.7); opacity: 1; }
  100% { transform: scale(0.9) rotate(360deg); box-shadow: 0 0 10px 2px rgba(192,160,80,0.3); opacity: 0.7; }
}

/* ii3-olivia-house – dim interior, funny */
.scn-ii3-olivia-house {
  background: linear-gradient(180deg, #1a1a24 0%, #2a2a3a 40%, #3a3a4a 100%), radial-gradient(ellipse at 50% 0%, #4a4a5a 0%, transparent 70%);
}
.scn-ii3-olivia-house .tavern-wall {
  position: absolute; inset: 0 0 25% 0;
  background: linear-gradient(180deg, #3a3a4a 0%, #2a2a3a 100%);
  animation: ii3-wall 10s ease-in-out infinite alternate;
}
.scn-ii3-olivia-house .tavern-floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 25%;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 40% 40% 0 0 / 15% 15% 0 0;
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.5);
}
.scn-ii3-olivia-house .table {
  position: absolute; bottom: 18%; left: 50%; width: 100px; height: 20px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #5a3a1a 0%, #3a1a0a 100%);
  border-radius: 8px;
  box-shadow: 0 4px 8px rgba(0,0,0,0.6);
}
.scn-ii3-olivia-house .toby-figure {
  position: absolute; bottom: 20%; left: 35%; width: 30px; height: 65px;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a0a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii3-toby 5s ease-in-out infinite;
}
.scn-ii3-olivia-house .andrew-figure {
  position: absolute; bottom: 18%; left: 55%; width: 22px; height: 55px;
  background: linear-gradient(180deg, #2a1a0a 0%, #0a0a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii3-andrew 6s ease-in-out infinite;
}
.scn-ii3-olivia-house .candle {
  position: absolute; bottom: 25%; left: 48%; width: 8px; height: 30px;
  background: linear-gradient(180deg, #f0c068 0%, #c08040 100%);
  border-radius: 4px 4px 2px 2px;
  box-shadow: 0 0 30px 8px rgba(240,192,104,0.5), 0 0 60px 15px rgba(240,192,104,0.2);
  animation: ii3-candle 2s ease-in-out infinite;
}
.scn-ii3-olivia-house .tankard {
  position: absolute; bottom: 18%; left: 45%; width: 20px; height: 28px;
  background: linear-gradient(180deg, #8a6a4a 0%, #6a4a2a 100%);
  border-radius: 4px 4px 6px 6px;
  transform-origin: bottom center;
  animation: ii3-tankard 7s ease-in-out infinite;
}
@keyframes ii3-wall {
  0% { opacity: 0.8; background-position: 0% 0%; }
  50% { opacity: 0.9; background-position: 2% 0%; }
  100% { opacity: 0.7; background-position: -2% 0%; }
}
@keyframes ii3-toby {
  0% { transform: translateX(0) rotate(-3deg) scaleY(1); }
  30% { transform: translateX(8px) rotate(5deg) scaleY(1.05); }
  60% { transform: translateX(-5px) rotate(-2deg) scaleY(0.95); }
  100% { transform: translateX(0) rotate(0) scaleY(1); }
}
@keyframes ii3-andrew {
  0% { transform: translateX(0) rotate(2deg) scaleY(1); }
  40% { transform: translateX(-6px) rotate(-4deg) scaleY(1.08); }
  70% { transform: translateX(4px) rotate(3deg) scaleY(0.92); }
  100% { transform: translateX(0) rotate(0) scaleY(1); }
}
@keyframes ii3-candle {
  0% { transform: scaleY(1) rotate(-1deg); box-shadow: 0 0 20px 5px rgba(240,192,104,0.4); }
  25% { transform: scaleY(1.05) rotate(2deg); box-shadow: 0 0 40px 10px rgba(240,192,104,0.6); }
  50% { transform: scaleY(0.95) rotate(-2deg); box-shadow: 0 0 15px 3px rgba(240,192,104,0.3); }
  75% { transform: scaleY(1.02) rotate(1deg); box-shadow: 0 0 30px 8px rgba(240,192,104,0.5); }
  100% { transform: scaleY(1) rotate(0); box-shadow: 0 0 25px 6px rgba(240,192,104,0.45); }
}
@keyframes ii3-tankard {
  0% { transform: translateX(0) rotate(-4deg) translateY(0); }
  30% { transform: translateX(10px) rotate(6deg) translateY(-3px); }
  60% { transform: translateX(-8px) rotate(-5deg) translateY(2px); }
  100% { transform: translateX(0) rotate(0) translateY(0); }
}

/* ----- Scene: ii4-orsino-palace ----- */
.scn-ii4-orsino-palace {
  background: linear-gradient(180deg, #f5e6c8 0%, #e8d5a0 50%, #d4c49a 100%),
              radial-gradient(ellipse at 70% 30%, #fffaf0 0%, transparent 60%);
}
.scn-ii4-orsino-palace .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 25%;
  background: linear-gradient(180deg, #7a5a3a 0%, #5a3a1a 100%);
}
.scn-ii4-orsino-palace .wall-back {
  position: absolute; inset: 0 0 25% 0;
  background: linear-gradient(135deg, #e8d5a0 0%, #d4c49a 50%, #c0b090 100%);
}
.scn-ii4-orsino-palace .window {
  position: absolute; top: 15%; left: 50%; width: 80px; height: 100px;
  transform: translateX(-50%);
  background: linear-gradient(180deg, #fffae0 0%, #e0d0a0 100%);
  border: 4px solid #8a7a5a; border-radius: 10% 10% 20% 20%;
  box-shadow: inset 0 0 20px #fff;
  animation: ii4-window 4s ease-in-out infinite;
}
.scn-ii4-orsino-palace .curtain-left {
  position: absolute; top: 10%; left: 30%; width: 40px; height: 120px;
  background: linear-gradient(180deg, #a08060 0%, #705040 100%);
  border-radius: 0 40% 40% 0; transform-origin: top;
  animation: ii4-curtain 6s ease-in-out infinite;
}
.scn-ii4-orsino-palace .curtain-right {
  position: absolute; top: 10%; right: 30%; width: 40px; height: 120px;
  background: linear-gradient(180deg, #a08060 0%, #705040 100%);
  border-radius: 40% 0 0 40%; transform-origin: top;
  animation: ii4-curtain 6s ease-in-out infinite reverse;
}
.scn-ii4-orsino-palace .figure-orsino {
  position: absolute; bottom: 30%; left: 35%; width: 30px; height: 60px;
  background: linear-gradient(180deg, #2a2a3a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii4-orsino 8s ease-in-out infinite;
}
.scn-ii4-orsino-palace .figure-musician {
  position: absolute; bottom: 30%; right: 35%; width: 30px; height: 60px;
  background: linear-gradient(180deg, #3a2a2a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii4-musician 3s ease-in-out infinite;
}
.scn-ii4-orsino-palace .lute {
  position: absolute; bottom: 32%; right: 38%; width: 24px; height: 16px;
  background: radial-gradient(circle, #d0b080 0%, #a08050 100%);
  border-radius: 50%; transform: rotate(-20deg);
  animation: ii4-lute 1.5s ease-in-out infinite;
}
@keyframes ii4-window {
  0% { opacity: 0.8; box-shadow: 0 0 10px #fff; }
  50% { opacity: 1; box-shadow: 0 0 30px #fff; }
  100% { opacity: 0.85; box-shadow: 0 0 15px #fff; }
}
@keyframes ii4-curtain {
  0% { transform: translateX(0); }
  50% { transform: translateX(-2px); }
  100% { transform: translateX(0); }
}
@keyframes ii4-orsino {
  0% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-2px) rotate(-2deg); }
  100% { transform: translateY(0) rotate(2deg); }
}
@keyframes ii4-musician {
  0% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-3px) rotate(2deg); }
  100% { transform: translateY(0) rotate(-2deg); }
}
@keyframes ii4-lute {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(5deg); }
  100% { transform: rotate(0deg); }
}

/* ----- Scene: ii5-olivia-garden ----- */
.scn-ii5-olivia-garden {
  background: linear-gradient(180deg, #87CEEB 0%, #F0E68C 40%, #228B22 60%, #006400 100%),
              radial-gradient(ellipse at 60% 20%, #FFFACD 0%, transparent 50%);
}
.scn-ii5-olivia-garden .sky {
  position: absolute; top: 0; left: 0; right: 0; bottom: 40%;
  background: radial-gradient(circle at 70% 20%, rgba(255,250,210,0.3) 0%, transparent 60%);
}
.scn-ii5-olivia-garden .ground {
  position: absolute; bottom: 0; left: 0; right: 0; height: 40%;
  background: linear-gradient(180deg, #6B8E23 0%, #556B2F 100%);
}
.scn-ii5-olivia-garden .bush-left {
  position: absolute; bottom: 35%; left: 15%; width: 50px; height: 40px;
  background: radial-gradient(ellipse, #228B22 0%, #006400 100%);
  border-radius: 50%;
  animation: ii5-bush 6s ease-in-out infinite;
}
.scn-ii5-olivia-garden .bush-right {
  position: absolute; bottom: 35%; right: 15%; width: 50px; height: 40px;
  background: radial-gradient(ellipse, #228B22 0%, #006400 100%);
  border-radius: 50%;
  animation: ii5-bush 6s ease-in-out infinite 3s;
}
.scn-ii5-olivia-garden .cloud {
  position: absolute; top: 10%; left: 20%; width: 80px; height: 20px;
  background: rgba(255,255,255,0.6); filter: blur(5px); border-radius: 50%;
  animation: ii5-cloud 40s linear infinite;
}
.scn-ii5-olivia-garden .figure-toby {
  position: absolute; bottom: 38%; left: 40%; width: 40px; height: 70px;
  background: linear-gradient(180deg, #8B4513 0%, #5C4033 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii5-toby 2s ease-in-out infinite;
}
.scn-ii5-olivia-garden .figure-andrew {
  position: absolute; bottom: 38%; left: 55%; width: 25px; height: 80px;
  background: linear-gradient(180deg, #B8860B 0%, #8B6508 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii5-andrew 2s ease-in-out infinite alternate;
}
.scn-ii5-olivia-garden .figure-fabian {
  position: absolute; bottom: 38%; left: 50%; width: 30px; height: 65px;
  background: linear-gradient(180deg, #A0522D 0%, #734222 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: ii5-fabian 4s ease-in-out infinite;
}
@keyframes ii5-cloud {
  0% { transform: translateX(0); }
  50% { transform: translateX(50px); }
  100% { transform: translateX(0); }
}
@keyframes ii5-bush {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(5deg); }
  100% { transform: rotate(0deg); }
}
@keyframes ii5-toby {
  0% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-5px) rotate(3deg); }
  100% { transform: translateY(0) rotate(-3deg); }
}
@keyframes ii5-andrew {
  0% { transform: translateX(0); }
  50% { transform: translateX(3px); }
  100% { transform: translateX(0); }
}
@keyframes ii5-fabian {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(10deg); }
  100% { transform: rotate(0deg); }
}

/* ----- Scene: iii1-olivia-garden ----- */
.scn-iii1-olivia-garden {
  background: linear-gradient(180deg, #87CEEB 0%, #FFF8DC 40%, #8FBC8F 60%, #2E8B57 100%),
              radial-gradient(ellipse at 80% 30%, #FFFACD 0%, transparent 60%);
}
.scn-iii1-olivia-garden .sky {
  position: absolute; top: 0; left: 0; right: 0; bottom: 40%;
  background: radial-gradient(circle at 80% 30%, rgba(255,255,224,0.4) 0%, transparent 70%);
}
.scn-iii1-olivia-garden .ground {
  position: absolute; bottom: 0; left: 0; right: 0; height: 40%;
  background: linear-gradient(180deg, #7C9D3A 0%, #4B7B2B 100%);
}
.scn-iii1-olivia-garden .tree-left {
  position: absolute; bottom: 35%; left: 10%; width: 60px; height: 90px;
  background: radial-gradient(ellipse, #3B7A3B 0%, #1F4F1F 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii1-tree 8s ease-in-out infinite;
}
.scn-iii1-olivia-garden .tree-right {
  position: absolute; bottom: 35%; right: 10%; width: 50px; height: 80px;
  background: radial-gradient(ellipse, #3B7A3B 0%, #1F4F1F 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii1-tree 8s ease-in-out infinite 4s;
}
.scn-iii1-olivia-garden .drum {
  position: absolute; bottom: 38%; left: 50%; width: 30px; height: 20px;
  background: radial-gradient(ellipse, #D2B48C 0%, #A0522D 100%);
  border-radius: 50%; transform: translateX(-50%);
  animation: iii1-drum 1.5s ease-in-out infinite;
}
.scn-iii1-olivia-garden .figure-viola {
  position: absolute; bottom: 38%; left: 35%; width: 28px; height: 70px;
  background: linear-gradient(180deg, #5C4033 0%, #3B2B20 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii1-viola 4s ease-in-out infinite;
}
.scn-iii1-olivia-garden .figure-clown {
  position: absolute; bottom: 38%; left: 55%; width: 35px; height: 75px;
  background: linear-gradient(180deg, #A0522D 0%, #734222 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii1-clown 2s ease-in-out infinite;
}
@keyframes iii1-tree {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(4deg); }
  100% { transform: rotate(0deg); }
}
@keyframes iii1-drum {
  0% { transform: translateX(-50%) scale(1) rotate(0deg); }
  50% { transform: translateX(-50%) scale(1.05) rotate(2deg); }
  100% { transform: translateX(-50%) scale(1) rotate(0deg); }
}
@keyframes iii1-viola {
  0% { transform: translateX(0) rotate(0deg); }
  50% { transform: translateX(5px) rotate(2deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes iii1-clown {
  0% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-4px) rotate(5deg); }
  100% { transform: translateY(0) rotate(-5deg); }
}

/* ----- Scene: iii2-olivia-house ----- */
.scn-iii2-olivia-house {
  background: linear-gradient(180deg, #fff5e1 0%, #e0c8a8 40%, #c8a878 100%),
              radial-gradient(ellipse at 60% 30%, #fffff0 0%, transparent 70%);
}
.scn-iii2-olivia-house .wall-back {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #e8d5b0 0%, #d4b898 100%);
}
.scn-iii2-olivia-house .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 30%;
  background: linear-gradient(180deg, #6b4a2a 0%, #4a3018 100%);
}
.scn-iii2-olivia-house .window {
  position: absolute; top: 10%; left: 50%; width: 60px; height: 80px;
  transform: translateX(-50%);
  background: radial-gradient(circle, #fff 0%, #e0e0ff 100%);
  border: 3px solid #8a7a5a;
  box-shadow: 0 0 10px #fff;
  animation: iii2-window 2s ease-in-out infinite;
}
.scn-iii2-olivia-house .table {
  position: absolute; bottom: 35%; left: 30%; width: 80px; height: 20px;
  background: linear-gradient(180deg, #8b5a2b 0%, #5a3a1a 100%);
  border-radius: 4px;
  animation: iii2-table 1.5s ease-in-out infinite;
}
.scn-iii2-olivia-house .figure-toby {
  position: absolute; bottom: 35%; left: 25%; width: 35px; height: 65px;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii2-toby 1.5s ease-in-out infinite alternate;
}
.scn-iii2-olivia-house .figure-andrew {
  position: absolute; bottom: 35%; left: 45%; width: 25px; height: 75px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii2-andrew 1.6s ease-in-out infinite;
}
.scn-iii2-olivia-house .figure-fabian {
  position: absolute; bottom: 35%; left: 65%; width: 30px; height: 65px;
  background: linear-gradient(180deg, #6a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: iii2-fabian 2s ease-in-out infinite;
}
@keyframes iii2-window {
  0% { opacity: 0.6; box-shadow: 0 0 20px #fff; }
  50% { opacity: 1; box-shadow: 0 0 40px #fff; }
  100% { opacity: 0.7; box-shadow: 0 0 15px #fff; }
}
@keyframes iii2-table {
  0% { transform: translateX(0); }
  50% { transform: translateX(3px); }
  100% { transform: translateX(0); }
}
@keyframes iii2-toby {
  0% { transform: translateY(0) rotate(0deg); }
  50% { transform: translateY(-2px) rotate(3deg); }
  100% { transform: translateY(0) rotate(-3deg); }
}
@keyframes iii2-andrew {
  0% { transform: translateX(0); }
  50% { transform: translateX(10px); }
  100% { transform: translateX(0); }
}
@keyframes iii2-fabian {
  0% { transform: rotate(0deg); }
  50% { transform: rotate(15deg); }
  100% { transform: rotate(0deg); }
}
/* end per-scene blocks */

/* auto-stub: parent tag-classes flagged by CSS audit */
.cloud-slow { position: absolute; pointer-events: none; }
.dust-mote { position: absolute; pointer-events: none; }
.parchment { position: absolute; pointer-events: none; }

/* ============ tier S ============ */
/* per-scene blocks (EXP step_scenes) */
/* scene: sebastian-marvels */
.scn-sebastian-marvels {
  background:
    linear-gradient(180deg, #f9e7b3 0%, #f4d58c 40%, #b8d4a8 100%),
    radial-gradient(ellipse at 70% 20%, #fef0c0 0%, transparent 60%);
}
.scn-sebastian-marvels .sun-sky {
  position: absolute; inset: 0 0 50% 0;
  background: linear-gradient(180deg, #fdf4d4 0%, #fce8a0 100%);
  animation: sm-sky 20s ease-in-out infinite alternate;
}
.scn-sebastian-marvels .garden-bed {
  position: absolute; bottom: 0; left: 5%; right: 5%; height: 50%;
  background: linear-gradient(180deg, #6b8e5a 0%, #4a6b3a 100%);
  border-radius: 30% 30% 0 0;
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.15);
}
.scn-sebastian-marvels .hedge-left {
  position: absolute; bottom: 35%; left: 2%; width: 80px; height: 120px;
  background: linear-gradient(135deg, #5a7d4a 0%, #3a5a2a 100%);
  border-radius: 40% 60% 50% 50% / 30% 40% 60% 70%;
  animation: sm-hedge 12s ease-in-out infinite;
}
.scn-sebastian-marvels .hedge-right {
  position: absolute; bottom: 35%; right: 2%; width: 60px; height: 100px;
  background: linear-gradient(225deg, #6b8e5a 0%, #4a6b3a 100%);
  border-radius: 60% 40% 50% 50% / 40% 30% 70% 60%;
  animation: sm-hedge 14s ease-in-out infinite reverse;
}
.scn-sebastian-marvels .fig-sebastian {
  position: absolute; bottom: 20%; left: 30%; width: 20px; height: 50px;
  background: linear-gradient(180deg, #d4a574 0%, #b08050 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: sm-fig-marvel 6s ease-in-out infinite;
}
.scn-sebastian-marvels .fig-olivia {
  position: absolute; bottom: 22%; left: 55%; width: 22px; height: 48px;
  background: linear-gradient(180deg, #f0d0a8 0%, #c8a078 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: sm-fig-approach 8s ease-in-out infinite alternate;
}
.scn-sebastian-marvels .priest {
  position: absolute; bottom: 25%; left: 72%; width: 18px; height: 40px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 30% 30%;
  animation: sm-priest 10s ease-in-out infinite;
}
.scn-sebastian-marvels .ring-glow {
  position: absolute; bottom: 28%; left: 42%; width: 8px; height: 8px;
  background: radial-gradient(circle, #fddc5c 0%, #c89838 70%);
  border-radius: 50%;
  box-shadow: 0 0 20px 6px rgba(253,220,92,0.6), 0 0 40px 12px rgba(253,220,92,0.2);
  animation: sm-ring 3s ease-in-out infinite alternate;
}
.scn-sebastian-marvels .petal-drift {
  position: absolute; top: 10%; left: 20%; width: 12px; height: 12px;
  background: radial-gradient(circle, #f9c8a8 0%, #e8a878 100%);
  border-radius: 50% 0 50% 0;
  filter: blur(1px);
  animation: sm-petal 15s linear infinite;
}
@keyframes sm-sky { 0%{opacity:0.9} 50%{opacity:1} 100%{opacity:0.85} }
@keyframes sm-hedge { 0%{transform: translateY(0)} 50%{transform: translateY(-2px) scale(1.02)} 100%{transform: translateY(0)} }
@keyframes sm-fig-marvel { 0%{transform: translate(0,0) rotate(-2deg)} 25%{transform: translate(3px,-1px) rotate(1deg)} 50%{transform: translate(-1px,0) rotate(0)} 75%{transform: translate(2px,-2px) rotate(-1deg)} 100%{transform: translate(0,0) rotate(2deg)} }
@keyframes sm-fig-approach { 0%{transform: translateX(0) scale(1)} 50%{transform: translateX(-8px) scale(1.02)} 100%{transform: translateX(0) scale(1)} }
@keyframes sm-priest { 0%{transform: translate(0,0)} 33%{transform: translate(2px,-1px)} 66%{transform: translate(-1px,0)} 100%{transform: translate(0,0)} }
@keyframes sm-ring { 0%{box-shadow: 0 0 12px 2px #fddc5c; opacity:0.8} 50%{box-shadow: 0 0 28px 10px #fddc5c; opacity:1} 100%{box-shadow: 0 0 16px 4px #fddc5c; opacity:0.9} }
@keyframes sm-petal { 0%{transform: translate(0,0) rotate(0deg)} 25%{transform: translate(30px,20px) rotate(45deg)} 50%{transform: translate(60px,10px) rotate(90deg)} 75%{transform: translate(90px,30px) rotate(135deg)} 100%{transform: translate(120px,0) rotate(180deg); opacity:0} }

/* scene: clown-banter */
.scn-clown-banter {
  background:
    linear-gradient(180deg, #f2e5c0 0%, #e8d6a8 40%, #d4b888 100%),
    radial-gradient(ellipse at 30% 70%, #fcf0d0 0%, transparent 60%);
}
.scn-clown-banter .house-wall {
  position: absolute; inset: 10% 15% 20% 15%;
  background: linear-gradient(135deg, #c8b090 0%, #a88868 100%);
  border-radius: 4% 4% 0 0;
  box-shadow: inset 0 10px 30px rgba(0,0,0,0.2);
}
.scn-clown-banter .window-arch {
  position: absolute; top: 18%; left: 25%; width: 50px; height: 60px;
  background: radial-gradient(ellipse at 50% 30%, #d0c4a8 0%, #a89c80 100%);
  border-radius: 50% 50% 0 0;
  box-shadow: inset 0 0 20px rgba(0,0,0,0.3);
  animation: cb-window 8s ease-in-out infinite alternate;
}
.scn-clown-banter .clown-hat {
  position: absolute; bottom: 30%; left: 30%; width: 30px; height: 30px;
  background: linear-gradient(135deg, #b87878 0%, #a06060 100%);
  border-radius: 50% 50% 50% 0;
  transform: rotate(30deg);
  animation: cb-hat 6s ease-in-out infinite;
}
.scn-clown-banter .clown-body {
  position: absolute; bottom: 12%; left: 30%; width: 24px; height: 50px;
  background: linear-gradient(180deg, #d0a040 0%, #b08030 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 40% 40%;
  box-shadow: inset 5px 0 10px rgba(0,0,0,0.2);
  animation: cb-jester 4s ease-in-out infinite;
}
.scn-clown-banter .orsino-fig {
  position: absolute; bottom: 18%; left: 55%; width: 22px; height: 55px;
  background: linear-gradient(180deg, #6a5a4a 0%, #4a3a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: cb-noble 10s ease-in-out infinite alternate;
}
.scn-clown-banter .retinue-fig1 {
  position: absolute; bottom: 20%; left: 65%; width: 18px; height: 50px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: cb-retinue 12s ease-in-out infinite;
}
.scn-clown-banter .retinue-fig2 {
  position: absolute; bottom: 22%; left: 75%; width: 16px; height: 48px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: cb-retinue 14s ease-in-out infinite reverse;
}
.scn-clown-banter .coin-sparkle {
  position: absolute; bottom: 35%; left: 40%; width: 6px; height: 6px;
  background: radial-gradient(circle, #ffd700 0%, #b8860b 70%);
  border-radius: 50%;
  box-shadow: 0 0 10px 3px rgba(255,215,0,0.8);
  animation: cb-coin 3s ease-in-out infinite alternate;
}
@keyframes cb-window { 0%{opacity:0.7} 50%{opacity:1} 100%{opacity:0.8} }
@keyframes cb-hat { 0%{transform: rotate(25deg) translateY(0)} 25%{transform: rotate(35deg) translateY(-2px)} 50%{transform: rotate(30deg) translateY(0)} 75%{transform: rotate(20deg) translateY(1px)} 100%{transform: rotate(25deg) translateY(0)} }
@keyframes cb-jester { 0%{transform: translateY(0) rotate(-2deg)} 25%{transform: translateY(-3px) rotate(2deg)} 50%{transform: translateY(0) rotate(-1deg)} 75%{transform: translateY(-2px) rotate(3deg)} 100%{transform: translateY(0) rotate(0)} }
@keyframes cb-noble { 0%{transform: translateX(0) scale(1)} 50%{transform: translateX(5px) scale(1.02)} 100%{transform: translateX(0) scale(1)} }
@keyframes cb-retinue { 0%{transform: translateY(0)} 33%{transform: translateY(-2px)} 66%{transform: translateY(1px)} 100%{transform: translateY(0)} }
@keyframes cb-coin { 0%{opacity:0.3; transform: scale(0.8)} 50%{opacity:1; transform: scale(1.2)} 100%{opacity:0.8; transform: scale(1)} }

/* scene: antonio-accusation */
.scn-antonio-accusation {
  background:
    linear-gradient(180deg, #5a6070 0%, #3a4a50 40%, #2a3a40 100%),
    radial-gradient(ellipse at 50% 30%, #7a8090 0%, transparent 70%);
}
.scn-antonio-accusation .overcast-sky {
  position: absolute; inset: 0 0 30% 0;
  background: linear-gradient(180deg, #7a7a8a 0%, transparent 100%);
  animation: aa-sky 15s ease-in-out infinite alternate;
}
.scn-antonio-accusation .ground-shadow {
  position: absolute; bottom: 0; left: 0; right: 0; height: 35%;
  background: linear-gradient(180deg, #2a3038 0%, #1a2028 100%);
  border-radius: 20% 20% 0 0;
  box-shadow: inset 0 20px 40px rgba(0,0,0,0.5);
  animation: aa-ground 20s ease-in-out infinite;
}
.scn-antonio-accusation .fig-antonio {
  position: absolute; bottom: 20%; left: 20%; width: 24px; height: 56px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: aa-fig-gesture 5s ease-in-out infinite alternate;
}
.scn-antonio-accusation .fig-orsino {
  position: absolute; bottom: 22%; left: 45%; width: 22px; height: 58px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: aa-fig-still 10s ease-in-out infinite;
}
.scn-antonio-accusation .fig-cesario {
  position: absolute; bottom: 20%; left: 65%; width: 20px; height: 50px;
  background: linear-gradient(180deg, #8a7a6a 0%, #6a5a4a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: aa-fig-flinch 4s ease-in-out infinite;
}
.scn-antonio-accusation .fig-olivia-accuse {
  position: absolute; bottom: 18%; left: 80%; width: 22px; height: 52px;
  background: linear-gradient(180deg, #c8a888 0%, #a88868 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: aa-fig-enter 8s ease-in-out infinite alternate;
}
.scn-antonio-accusation .priest-temp {
  position: absolute; bottom: 24%; left: 55%; width: 16px; height: 40px;
  background: linear-gradient(180deg, #3a2a1a 0%, #1a0a00 100%);
  border-radius: 40% 40% 30% 30% / 50% 50% 30% 30%;
  animation: aa-priest 12s ease-in-out infinite;
}
.scn-antonio-accusation .accusation-spear {
  position: absolute; bottom: 30%; left: 30%; width: 4px; height: 70px;
  background: linear-gradient(180deg, #a09070 0%, #706050 100%);
  border-radius: 2px;
  transform: rotate(-15deg);
  transform-origin: bottom;
  box-shadow: 2px 0 4px rgba(0,0,0,0.5);
  animation: aa-spear 3s ease-in-out infinite alternate;
}
@keyframes aa-sky { 0%{opacity:0.6} 50%{opacity:0.9} 100%{opacity:0.7} }
@keyframes aa-ground { 0%{transform: translateY(0)} 50%{transform: translateY(1px)} 100%{transform: translateY(0)} }
@keyframes aa-fig-gesture { 0%{transform: translate(0,0) rotate(0deg)} 25%{transform: translate(2px,-1px) rotate(5deg)} 50%{transform: translate(0,0) rotate(-3deg)} 75%{transform: translate(-2px,0) rotate(2deg)} 100%{transform: translate(0,0) rotate(0deg)} }
@keyframes aa-fig-still { 0%{transform: scale(1)} 50%{transform: scale(1.01)} 100%{transform: scale(1)} }
@keyframes aa-fig-flinch { 0%{transform: translate(0,0)} 20%{transform: translate(5px,-2px) rotate(-5deg)} 40%{transform: translate(-3px,0) rotate(3deg)} 60%{transform: translate(2px,1px) rotate(0)} 80%{transform: translate(-1px,-1px) rotate(-2deg)} 100%{transform: translate(0,0)} }
@keyframes aa-fig-enter { 0%{transform: translateX(20px); opacity:0} 50%{transform: translateX(0); opacity:1} 100%{transform: translateX(0); opacity:1} }
@keyframes aa-priest { 0%{transform: translate(0,0)} 33%{transform: translate(1px,-1px)} 66%{transform: translate(-1px,0)} 100%{transform: translate(0,0)} }
@keyframes aa-spear { 0%{transform: rotate(-15deg) scaleY(1)} 50%{transform: rotate(-10deg) scaleY(1.05)} 100%{transform: rotate(-15deg) scaleY(1)} }

/* scene: recognition-reunion */
.scn-recognition-reunion {
  background:
    linear-gradient(180deg, #f0e0c0 0%, #e0c8a0 40%, #c8a878 100%),
    radial-gradient(ellipse at 60% 30%, #fcf0d0 0%, transparent 60%);
}
.scn-recognition-reunion .chamber-wall {
  position: absolute; inset: 8% 10% 15% 10%;
  background: linear-gradient(135deg, #d4bc98 0%, #b89878 100%);
  border-radius: 2% 2% 0 0;
  box-shadow: inset 0 20px 40px rgba(0,0,0,0.15);
}
.scn-recognition-reunion .window-light {
  position: absolute; top: 12%; right: 20%; width: 40px; height: 50px;
  background: radial-gradient(ellipse at 50% 50%, #fef4d4 0%, #f0d8a0 100%);
  border-radius: 2px;
  box-shadow: 0 0 30px 10px rgba(254,244,212,0.6), 0 0 60px 20px rgba(254,244,212,0.3);
  animation: rr-light 6s ease-in-out infinite alternate;
}
.scn-recognition-reunion .fig-sebastian-reun {
  position: absolute; bottom: 20%; left: 25%; width: 22px; height: 52px;
  background: linear-gradient(180deg, #d4a574 0%, #b08050 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: rr-embrace 5s ease-in-out infinite;
}
.scn-recognition-reunion .fig-antonio-reun {
  position: absolute; bottom: 22%; left: 35%; width: 24px; height: 54px;
  background: linear-gradient(180deg, #5a4a3a 0%, #3a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: rr-embrace-alt 5s ease-in-out infinite reverse;
}
.scn-recognition-reunion .fig-viola-reun {
  position: absolute; bottom: 18%; left: 50%; width: 20px; height: 48px;
  background: linear-gradient(180deg, #c8a888 0%, #a88868 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: rr-reveal 8s ease-in-out infinite alternate;
}
.scn-recognition-reunion .fig-olivia-reun {
  position: absolute; bottom: 20%; left: 65%; width: 22px; height: 50px;
  background: linear-gradient(180deg, #f0d0a8 0%, #c8a078 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: rr-witness 10s ease-in-out infinite;
}
.scn-recognition-reunion .embrace-halo {
  position: absolute; bottom: 30%; left: 28%; width: 30px; height: 30px;
  background: radial-gradient(circle, rgba(255,215,0,0.3) 0%, transparent 70%);
  border-radius: 50%;
  animation: rr-halo 4s ease-in-out infinite alternate;
}
.scn-recognition-reunion .token-letter {
  position: absolute; bottom: 35%; left: 45%; width: 10px; height: 14px;
  background: linear-gradient(180deg, #f0e0c0 0%, #d0b888 100%);
  border-radius: 1px;
  transform: rotate(-10deg);
  box-shadow: 0 2px 4px rgba(0,0,0,0.2);
  animation: rr-letter 3s ease-in-out infinite;
}
@keyframes rr-light { 0%{opacity:0.8; transform: scale(1)} 50%{opacity:1; transform: scale(1.1)} 100%{opacity:0.9; transform: scale(1)} }
@keyframes rr-embrace { 0%{transform: translate(0,0) rotate(-2deg)} 25%{transform: translate(5px,-1px) rotate(0)} 50%{transform: translate(2px,0) rotate(1deg)} 75%{transform: translate(-1px,-1px) rotate(-1deg)} 100%{transform: translate(0,0) rotate(0)} }
@keyframes rr-embrace-alt { 0%{transform: translate(0,0) rotate(2deg)} 25%{transform: translate(-5px,-1px) rotate(0)} 50%{transform: translate(-2px,0) rotate(-1deg)} 75%{transform: translate(1px,-1px) rotate(1deg)} 100%{transform: translate(0,0) rotate(0)} }
@keyframes rr-reveal { 0%{transform: translate(0,0); opacity:0.7} 50%{transform: translate(-10px,0); opacity:1} 100%{transform: translate(0,0); opacity:0.9} }
@keyframes rr-witness { 0%{transform: translateY(0)} 33%{transform: translateY(-2px)} 66%{transform: translateY(1px)} 100%{transform: translateY(0)} }
@keyframes rr-halo { 0%{opacity:0.3; transform: scale(0.8)} 50%{opacity:0.7; transform: scale(1.2)} 100%{opacity:0.5; transform: scale(1)} }
@keyframes rr-letter { 0%{transform: rotate(-10deg) translateY(0)} 50%{transform: rotate(-5deg) translateY(-2px)} 100%{transform: rotate(-10deg) translateY(0)} }

/* Scene 1: orsino-love-sick */
.scn-orsino-love-sick {
  background: linear-gradient(180deg, #f9e8c0 0%, #f0dbba 30%, #e4c9a8 70%, #cfb08a 100%),
              radial-gradient(ellipse at 60% 20%, #fff5e0 0%, transparent 70%);
  background-blend-mode: overlay;
  position: relative;
  isolation: isolate;
}
.scn-orsino-love-sick .room-bg {
  position:absolute; inset:0;
  background: radial-gradient(ellipse at 70% 40%, rgba(255,245,220,0.6) 0%, transparent 70%);
  animation: ols-ambient 12s ease-in-out infinite alternate;
}
.scn-orsino-love-sick .window-light {
  position:absolute; top:10%; left:55%; width:30%; height:40%;
  background: linear-gradient(135deg, rgba(255,240,200,0.8) 0%, rgba(255,220,160,0.3) 100%);
  border-radius: 6% 6% 0 0;
  box-shadow: 0 0 60px 30px rgba(255,220,160,0.3);
  animation: ols-window 8s ease-in-out infinite alternate;
}
.scn-orsino-love-sick .drapes {
  position:absolute; top:10%; left:50%; width:35%; height:45%;
  background: linear-gradient(90deg, #b08860 0%, #a07850 40%, #b08860 100%);
  border-radius: 4% 4% 0 0;
  clip-path: polygon(0% 0%, 100% 0%, 100% 85%, 0% 100%);
  box-shadow: inset 0 10px 30px rgba(0,0,0,0.2);
  animation: ols-drapes 15s ease-in-out infinite alternate;
}
.scn-orsino-love-sick .fig-orso {
  position:absolute; bottom:12%; left:50%; width:30px; height:60px;
  background: linear-gradient(180deg, #3a2a1a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 70% 70% 30% 30%;
  transform: translateX(-50%);
  box-shadow: 0 4px 8px rgba(0,0,0,0.5);
  animation: ols-fig 6s ease-in-out infinite;
}
.scn-orsino-love-sick .lute {
  position:absolute; bottom:14%; left:42%; width:30px; height:20px;
  background: radial-gradient(ellipse at 40% 50%, #c09560 0%, #a07040 100%);
  border-radius: 50%;
  transform: rotate(-15deg);
  box-shadow: 0 2px 6px rgba(0,0,0,0.4);
  animation: ols-lute 9s ease-in-out infinite alternate;
}
.scn-orsino-love-sick .cushion {
  position:absolute; bottom:8%; left:55%; width:40px; height:20px;
  background: linear-gradient(180deg, #7a5a3a 0%, #5a3a1a 100%);
  border-radius: 30% 30% 50% 50%;
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
@keyframes ols-ambient { 0% { opacity:0.8 } 50% { opacity:1 } 100% { opacity:0.85 } }
@keyframes ols-window { 0% { transform: scaleX(1); opacity:0.7 } 50% { transform: scaleX(1.05); opacity:0.9 } 100% { transform: scaleX(0.95); opacity:0.75 } }
@keyframes ols-drapes { 0% { transform: translateY(0) rotate(0deg) } 50% { transform: translateY(2px) rotate(-1deg) } 100% { transform: translateY(-1px) rotate(1deg) } }
@keyframes ols-fig { 0% { transform: translateX(-50%) translateY(0) rotate(0deg) } 25% { transform: translateX(-48%) translateY(-2px) rotate(-2deg) } 50% { transform: translateX(-50%) translateY(-1px) rotate(1deg) } 75% { transform: translateX(-52%) translateY(-3px) rotate(-1deg) } 100% { transform: translateX(-50%) translateY(0) rotate(0deg) } }
@keyframes ols-lute { 0% { transform: rotate(-15deg) scale(1) } 50% { transform: rotate(-10deg) scale(1.03) } 100% { transform: rotate(-18deg) scale(0.98) } }

/* Scene 2: viola-shipwrecked */
.scn-viola-shipwrecked {
  background: linear-gradient(180deg, #7db0d0 0%, #5a8fc0 30%, #3a6fa0 70%, #1a4a7a 100%),
              radial-gradient(ellipse at 60% 15%, #f0e8c0 0%, transparent 60%);
  background-blend-mode: overlay;
  position: relative;
  isolation: isolate;
}
.scn-viola-shipwrecked .sky-sea {
  position:absolute; inset:0;
  background: linear-gradient(180deg, rgba(255,250,230,0.5) 0%, transparent 40%, rgba(0,50,100,0.3) 100%);
  animation: vsw-sky 20s ease-in-out infinite alternate;
}
.scn-viola-shipwrecked .sunburst {
  position:absolute; top:8%; left:65%; width:60px; height:60px;
  background: radial-gradient(circle, #ffe080 0%, #ffd060 40%, transparent 70%);
  border-radius:50%;
  box-shadow: 0 0 80px 40px rgba(255,220,100,0.3);
  animation: vsw-sun 15s ease-in-out infinite alternate;
}
.scn-viola-shipwrecked .shore {
  position:absolute; bottom:0; left:0; right:0; height:35%;
  background: linear-gradient(180deg, #c0a070 0%, #a08050 50%, #806040 100%);
  border-radius: 60% 60% 0 0 / 100% 100% 0 0;
  box-shadow: inset 0 10px 30px rgba(0,0,0,0.3);
  animation: vsw-shore 12s ease-in-out infinite alternate;
}
.scn-viola-shipwrecked .fig-viola {
  position:absolute; bottom:20%; left:40%; width:22px; height:50px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 40% 40% 50% 50% / 60% 60% 40% 40%;
  transform: rotate(5deg);
  animation: vsw-viola 8s ease-in-out infinite alternate;
}
.scn-viola-shipwrecked .captain {
  position:absolute; bottom:22%; left:52%; width:28px; height:55px;
  background: linear-gradient(180deg, #3a3a4a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform: rotate(-3deg);
  animation: vsw-captain 10s ease-in-out infinite alternate;
}
.scn-viola-shipwrecked .driftwood {
  position:absolute; bottom:15%; left:20%; width:50px; height:10px;
  background: linear-gradient(90deg, #5a4020 0%, #7a6030 50%, #5a4020 100%);
  border-radius: 20% 20% 40% 40%;
  transform: rotate(-20deg);
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  animation: vsw-wood 18s ease-in-out infinite alternate;
}
.scn-viola-shipwrecked .wave-crest {
  position:absolute; bottom:30%; left:0; right:0; height:8px;
  background: linear-gradient(90deg, transparent, rgba(255,255,255,0.4) 20%, transparent 40%);
  filter: blur(2px);
  animation: vsw-wave 5s ease-in-out infinite;
}
@keyframes vsw-sky { 0% { opacity:0.7 } 50% { opacity:1 } 100% { opacity:0.8 } }
@keyframes vsw-sun { 0% { transform: scale(0.9); opacity:0.8 } 50% { transform: scale(1.1); opacity:1 } 100% { transform: scale(0.95); opacity:0.85 } }
@keyframes vsw-shore { 0% { transform: translateY(0) } 50% { transform: translateY(-3px) } 100% { transform: translateY(0) } }
@keyframes vsw-viola { 0% { transform: rotate(5deg) translateY(0) } 50% { transform: rotate(8deg) translateY(-2px) } 100% { transform: rotate(2deg) translateY(1px) } }
@keyframes vsw-captain { 0% { transform: rotate(-3deg) translateY(0) } 50% { transform: rotate(-5deg) translateY(-1px) } 100% { transform: rotate(0deg) translateY(1px) } }
@keyframes vsw-wood { 0% { transform: rotate(-20deg) translateX(0) } 50% { transform: rotate(-18deg) translateX(5px) } 100% { transform: rotate(-22deg) translateX(-3px) } }
@keyframes vsw-wave { 0% { opacity:0.3 } 50% { opacity:0.7 } 100% { opacity:0.3 } }

/* Scene 3: toby-and-andrew */
.scn-toby-and-andrew {
  background: linear-gradient(180deg, #4a3a2a 0%, #3a2a1a 40%, #2a1a0a 100%),
              radial-gradient(ellipse at 50% 30%, #6a4a2a 0%, transparent 70%);
  background-blend-mode: multiply;
  position: relative;
  isolation: isolate;
}
.scn-toby-and-andrew .tavern-wall {
  position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(80,60,40,0.6) 0%, transparent 60%, rgba(0,0,0,0.3) 100%);
  animation: taa-wall 14s ease-in-out infinite alternate;
}
.scn-toby-and-andrew .table {
  position:absolute; bottom:18%; left:30%; width:40%; height:18px;
  background: linear-gradient(180deg, #7a5030 0%, #5a3820 100%);
  border-radius: 10% 10% 30% 30%;
  box-shadow: 0 4px 8px rgba(0,0,0,0.5);
}
.scn-toby-and-andrew .mug-left {
  position:absolute; bottom:22%; left:32%; width:14px; height:20px;
  background: radial-gradient(ellipse at 50% 30%, #b08050 0%, #8a6040 100%);
  border-radius: 20% 20% 10% 10%;
  animation: taa-mug 4s ease-in-out infinite alternate;
}
.scn-toby-and-andrew .mug-right {
  position:absolute; bottom:23%; left:55%; width:12px; height:18px;
  background: radial-gradient(ellipse at 50% 30%, #c09060 0%, #a07050 100%);
  border-radius: 20% 20% 10% 10%;
  animation: taa-mug 4s ease-in-out infinite alternate-reverse;
  animation-delay: -1s;
}
.scn-toby-and-andrew .fig-toby {
  position:absolute; bottom:10%; left:38%; width:30px; height:65px;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform: translateX(-50%) rotate(5deg);
  animation: taa-toby 3s ease-in-out infinite;
}
.scn-toby-and-andrew .fig-andrew {
  position:absolute; bottom:12%; left:55%; width:24px; height:50px;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform: rotate(-10deg);
  animation: taa-andrew 3.5s ease-in-out infinite;
}
.scn-toby-and-andrew .candle {
  position:absolute; bottom:25%; left:48%; width:6px; height:18px;
  background: linear-gradient(180deg, #f0d080 0%, #d0a060 100%);
  border-radius: 30% 30% 10% 10%;
  box-shadow: 0 0 20px 6px rgba(240,200,100,0.5);
  animation: taa-candle 2s ease-in-out infinite alternate;
}
@keyframes taa-wall { 0% { opacity:0.6 } 50% { opacity:0.8 } 100% { opacity:0.65 } }
@keyframes taa-mug { 0% { transform: translateY(0) rotate(0deg) } 50% { transform: translateY(-2px) rotate(5deg) } 100% { transform: translateY(0) rotate(-3deg) } }
@keyframes taa-toby { 0% { transform: translateX(-50%) rotate(5deg) translateY(0) } 25% { transform: translateX(-45%) rotate(8deg) translateY(-2px) } 50% { transform: translateX(-50%) rotate(-2deg) translateY(-1px) } 75% { transform: translateX(-55%) rotate(6deg) translateY(1px) } 100% { transform: translateX(-50%) rotate(5deg) translateY(0) } }
@keyframes taa-andrew { 0% { transform: rotate(-10deg) translateY(0) } 33% { transform: rotate(-15deg) translateY(-3px) } 66% { transform: rotate(-8deg) translateY(2px) } 100% { transform: rotate(-10deg) translateY(0) } }
@keyframes taa-candle { 0% { transform: scaleY(0.9); opacity:0.7 } 50% { transform: scaleY(1.1); opacity:1 } 100% { transform: scaleY(0.95); opacity:0.8 } }

/* Scene 4: clown-wit */
.scn-clown-wit {
  background: linear-gradient(180deg, #f5e0c0 0%, #e8cca0 50%, #d8b880 100%),
              radial-gradient(ellipse at 50% 70%, #f0d8a0 0%, transparent 60%);
  background-blend-mode: overlay;
  position: relative;
  isolation: isolate;
}
.scn-clown-wit .hall-bg {
  position:absolute; inset:0;
  background: linear-gradient(135deg, rgba(255,240,210,0.4) 0%, rgba(200,160,120,0.1) 100%);
  animation: cwi-bg 10s ease-in-out infinite alternate;
}
.scn-clown-wit .tapestry {
  position:absolute; top:15%; left:10%; width:15%; height:40%;
  background: linear-gradient(180deg, #7a5a3a 0%, #5a3a1a 50%, #3a1a0a 100%);
  border-radius: 4% 4% 0 0;
  box-shadow: 0 4px 10px rgba(0,0,0,0.3);
  animation: cwi-tap 20s ease-in-out infinite alternate;
}
.scn-clown-wit .fig-feste {
  position:absolute; bottom:15%; left:35%; width:28px; height:60px;
  background: linear-gradient(180deg, #8a6030 0%, #6a4020 100%);
  border-radius: 40% 40% 50% 50% / 60% 60% 40% 40%;
  transform: rotate(-5deg);
  animation: cwi-feste 4s ease-in-out infinite;
}
.scn-clown-wit .fig-olivia {
  position:absolute; bottom:18%; left:50%; width:32px; height:58px;
  background: linear-gradient(180deg, #4a2a1a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform: rotate(2deg);
  animation: cwi-olivia 8s ease-in-out infinite alternate;
}
.scn-clown-wit .staff {
  position:absolute; bottom:12%; left:32%; width:4px; height:50px;
  background: linear-gradient(180deg, #a08060 0%, #806040 100%);
  border-radius: 10%;
  transform: rotate(-20deg);
  box-shadow: 0 2px 4px rgba(0,0,0,0.3);
  animation: cwi-staff 5s ease-in-out infinite alternate;
}
.scn-clown-wit .hat-jester {
  position:absolute; top:22%; left:34%; width:30px; height:15px;
  background: radial-gradient(ellipse at 50% 30%, #c03030 0%, #a02020 100%);
  border-radius: 50% 50% 30% 30%;
  transform: rotate(10deg);
  box-shadow: 0 4px 6px rgba(0,0,0,0.3);
  animation: cwi-hat 3s ease-in-out infinite alternate;
}
.scn-clown-wit .confetti {
  position:absolute; top:10%; left:20%; width:100%; height:300%;
  background: repeating-linear-gradient(45deg, 
    #f0c040 0px, #f0c040 4px, 
    #40a0d0 4px, #40a0d0 8px, 
    #d070b0 8px, #d070b0 12px, 
    #80c060 12px, #80c060 16px);
  mask: radial-gradient(circle at 50% 20%, black 0%, transparent 80%);
  -webkit-mask: radial-gradient(circle at 50% 20%, black 0%, transparent 80%);
  animation: cwi-confetti 12s linear infinite;
  opacity:0.15;
}
@keyframes cwi-bg { 0% { opacity:0.5 } 50% { opacity:0.8 } 100% { opacity:0.6 } }
@keyframes cwi-tap { 0% { transform: scaleY(1) } 50% { transform: scaleY(1.02) } 100% { transform: scaleY(0.98) } }
@keyframes cwi-feste { 0% { transform: rotate(-5deg) translateY(0) } 25% { transform: rotate(-8deg) translateY(-2px) } 50% { transform: rotate(-2deg) translateY(1px) } 75% { transform: rotate(-6deg) translateY(-1px) } 100% { transform: rotate(-5deg) translateY(0) } }
@keyframes cwi-olivia { 0% { transform: rotate(2deg) scale(1) } 50% { transform: rotate(4deg) scale(1.02) } 100% { transform: rotate(0deg) scale(0.98) } }
@keyframes cwi-staff { 0% { transform: rotate(-20deg) } 50% { transform: rotate(-25deg) } 100% { transform: rotate(-15deg) } }
@keyframes cwi-hat { 0% { transform: rotate(10deg) scale(1) } 50% { transform: rotate(15deg) scale(1.05) } 100% { transform: rotate(8deg) scale(0.95) } }
@keyframes cwi-confetti { 0% { transform: translateY(0) rotate(0deg) } 100% { transform: translateY(-100%) rotate(360deg) } }

.scn-duel-plot { background: linear-gradient(180deg, #2a1e14 0%, #1a1008 50%, #0f0804 100%), radial-gradient(ellipse at 60% 40%, #3a281a 0%, transparent 60%); }
.scn-duel-plot .room-bg { position:absolute; inset:0; background: linear-gradient(135deg, #3a2a1a 0%, transparent 70%); animation: dp-room 5s ease-in-out infinite alternate; }
.scn-duel-plot .table { position:absolute; bottom:25%; left:50%; width:120px; height:20px; transform:translateX(-50%); background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%); border-radius:4px; box-shadow: 0 4px 8px rgba(0,0,0,.6); animation: dp-table 3s ease-in-out infinite; }
.scn-duel-plot .figure-toby { position:absolute; bottom:22%; left:30%; width:22px; height:44px; background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: dp-figure 2s ease-in-out infinite; }
.scn-duel-plot .figure-andrew { position:absolute; bottom:22%; left:48%; width:20px; height:40px; background: linear-gradient(180deg, #3a2818 0%, #1a1008 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: dp-figure 2.4s ease-in-out infinite reverse; }
.scn-duel-plot .figure-fabian { position:absolute; bottom:22%; left:66%; width:21px; height:42px; background: linear-gradient(180deg, #3a2a1a 0%, #1a1008 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: dp-figure 2.8s ease-in-out infinite alternate; }
.scn-duel-plot .candle { position:absolute; bottom:35%; left:50%; width:8px; height:14px; transform:translateX(-50%); background: linear-gradient(180deg, #f0d080 0%, #c09050 50%, #805030 100%); border-radius: 2px; box-shadow: 0 0 20px 6px #c09050, 0 0 40px 12px rgba(192,144,80,.4); animation: dp-candle 1.5s ease-in-out infinite alternate; }
.scn-duel-plot .shadow { position:absolute; bottom:20%; left:30%; width:100px; height:60px; background: radial-gradient(ellipse, rgba(0,0,0,.6) 0%, transparent 70%); animation: dp-shadow 4s ease-in-out infinite; }
@keyframes dp-room { 0% { opacity:.7 } 50% { opacity:1 } 100% { opacity:.8 } }
@keyframes dp-table { 0%,100% { transform:translateX(-50%) } 50% { transform:translateX(-50%) translateY(-2px) } }
@keyframes dp-figure { 0% { transform: rotate(-2deg) } 25% { transform: rotate(1deg) } 50% { transform: rotate(-1deg) } 75% { transform: rotate(2deg) } 100% { transform: rotate(-2deg) } }
@keyframes dp-candle { 0% { box-shadow: 0 0 15px 4px #c09050; opacity:.85 } 50% { box-shadow: 0 0 30px 8px #f0d080; opacity:1 } 100% { box-shadow: 0 0 20px 5px #c09050; opacity:.9 } }
@keyframes dp-shadow { 0%,100% { transform: translateX(0) scale(1) } 50% { transform: translateX(5px) scale(1.1) } }

.scn-malvolio-yellow-stockings { background: linear-gradient(180deg, #7ab8d4 0%, #b0e0f0 30%, #f0e8d0 60%, #d0c8a0 100%), radial-gradient(ellipse at 50% 60%, #f0e8d0 0%, transparent 80%); }
.scn-malvolio-yellow-stockings .sky { position:absolute; inset:0 0 40% 0; background: linear-gradient(180deg, #7ab8d4 0%, #b0e0f0 100%); animation: my-sky 8s ease-in-out infinite alternate; }
.scn-malvolio-yellow-stockings .ground { position:absolute; bottom:0; left:0; right:0; height:40%; background: linear-gradient(180deg, #88b080 0%, #609060 100%); border-radius: 40% 0 0 0 / 80% 0 0 0; animation: my-ground 6s ease-in-out infinite; }
.scn-malvolio-yellow-stockings .malvolio { position:absolute; bottom:22%; left:50%; width:24px; height:50px; transform:translateX(-50%); background: linear-gradient(180deg, #d0b090 0%, #a08060 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; animation: my-malvolio 3s ease-in-out infinite; }
.scn-malvolio-yellow-stockings .stockings { position:absolute; bottom:8%; left:50%; width:18px; height:16px; transform:translateX(-50%); background: linear-gradient(180deg, #f0d040 0%, #d0b020 100%); border-radius: 10% 10% 30% 30%; box-shadow: 0 0 10px 2px #f0d040; animation: my-stockings 3s ease-in-out infinite; }
.scn-malvolio-yellow-stockings .hat { position:absolute; bottom:55%; left:50%; width:20px; height:12px; transform:translateX(-50%); background: linear-gradient(180deg, #6040a0 0%, #402080 100%); border-radius: 50% 50% 10% 10%; animation: my-hat 4s ease-in-out infinite; }
.scn-malvolio-yellow-stockings .butterfly { position:absolute; top:25%; left:30%; width:10px; height:8px; background: radial-gradient(circle, #f08060 0%, #d05040 70%); border-radius: 50%; filter: blur(1px); animation: my-butterfly 5s ease-in-out infinite; }
.scn-malvolio-yellow-stockings .sunbeams { position:absolute; inset:0; background: linear-gradient(45deg, transparent 30%, rgba(255,240,200,.3) 35%, transparent 40%, rgba(255,240,200,.15) 45%, transparent 50%); animation: my-sunbeams 12s linear infinite; }
@keyframes my-sky { 0% { opacity:.8 } 50% { opacity:1 } 100% { opacity:.9 } }
@keyframes my-ground { 0%,100% { transform: translateY(0) } 50% { transform: translateY(-3px) } }
@keyframes my-malvolio { 0% { transform: translateX(-50%) rotate(-3deg) } 25% { transform: translateX(-48%) rotate(2deg) } 50% { transform: translateX(-50%) rotate(-2deg) } 75% { transform: translateX(-52%) rotate(3deg) } 100% { transform: translateX(-50%) rotate(-3deg) } }
@keyframes my-stockings { 0%,100% { transform: translateX(-50%) scale(1) } 50% { transform: translateX(-50%) scale(1.15) rotate(5deg) } }
@keyframes my-hat { 0%,100% { transform: translateX(-50%) rotate(-5deg) } 50% { transform: translateX(-50%) rotate(5deg) translateY(-2px) } }
@keyframes my-butterfly { 0% { transform: translate(0,0) } 25% { transform: translate(10px,-15px) rotate(10deg) } 50% { transform: translate(20px,0) scale(1.2) } 75% { transform: translate(10px,10px) rotate(-10deg) } 100% { transform: translate(0,0) } }
@keyframes my-sunbeams { 0% { background-position: 0 0 } 100% { background-position: 100% 100% } }

.scn-antonio-intervention { background: linear-gradient(180deg, #6a7a8a 0%, #4a5a6a 50%, #3a4a5a 100%), radial-gradient(ellipse at 50% 100%, #5a6a7a 0%, transparent 70%); }
.scn-antonio-intervention .bg-overcast { position:absolute; inset:0; background: linear-gradient(135deg, #6a7a8a 0%, transparent 70%); animation: ai-bg 10s ease-in-out infinite alternate; }
.scn-antonio-intervention .street { position:absolute; bottom:0; left:0; right:0; height:35%; background: linear-gradient(180deg, #5a6a7a 0%, #2a3a4a 100%); border-radius: 20% 80% 0 0 / 30% 90% 0 0; box-shadow: inset 0 8px 20px rgba(0,0,0,.4); }
.scn-antonio-intervention .antonio { position:absolute; bottom:18%; left:35%; width:26px; height:52px; background: linear-gradient(180deg, #3a4a5a 0%, #1a2a3a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ai-figure 2s ease-in-out infinite alternate; }
.scn-antonio-intervention .cesario { position:absolute; bottom:18%; left:55%; width:22px; height:48px; background: linear-gradient(180deg, #4a5a6a 0%, #2a3a4a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ai-figure 2.5s ease-in-out infinite alternate-reverse; }
.scn-antonio-intervention .officer1 { position:absolute; bottom:18%; left:68%; width:24px; height:50px; background: linear-gradient(180deg, #5a6a7a 0%, #3a4a5a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ai-officer 3s ease-in-out infinite; }
.scn-antonio-intervention .officer2 { position:absolute; bottom:18%; left:78%; width:24px; height:50px; background: linear-gradient(180deg, #5a6a7a 0%, #3a4a5a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: ai-officer 3.5s ease-in-out infinite reverse; }
.scn-antonio-intervention .swords { position:absolute; bottom:35%; left:50%; width:4px; height:40px; transform:translateX(-50%); background: linear-gradient(180deg, #a0b0c0 0%, #506070 100%); border-radius: 2px; box-shadow: 0 0 8px 2px #8090a0; animation: ai-swords 1.5s ease-in-out infinite alternate; }
@keyframes ai-bg { 0% { opacity:.8 } 50% { opacity:1 } 100% { opacity:.9 } }
@keyframes ai-figure { 0% { transform: rotate(-2deg) translateY(0) } 50% { transform: rotate(2deg) translateY(-2px) } 100% { transform: rotate(-2deg) translateY(0) } }
@keyframes ai-officer { 0%,100% { transform: scale(1) } 50% { transform: scale(1.05) translateY(-1px) } }
@keyframes ai-swords { 0% { transform: translateX(-50%) rotate(-15deg) } 50% { transform: translateX(-50%) rotate(15deg) } 100% { transform: translateX(-50%) rotate(-15deg) } }

.scn-item-olivias-ring { background: linear-gradient(180deg, #1a1428 0%, #2a1e3a 50%, #1a1020 100%), radial-gradient(ellipse at 60% 50%, #2a1e3a 0%, transparent 70%); }
.scn-item-olivias-ring .cell-bg { position:absolute; inset:0; background: linear-gradient(135deg, #2a1e3a 0%, #0a0810 100%); animation: or-cell 12s ease-in-out infinite alternate; }
.scn-item-olivias-ring .grille { position:absolute; top:0; left:0; bottom:0; width:100%; background: repeating-linear-gradient(90deg, transparent 0px, transparent 18px, #1a1428 18px, #1a1428 20px); opacity:.5; animation: or-grille 8s linear infinite; }
.scn-item-olivias-ring .malvolio { position:absolute; bottom:20%; left:40%; width:22px; height:46px; background: linear-gradient(180deg, #3a2a4a 0%, #1a0a2a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: or-figure 5s ease-in-out infinite; }
.scn-item-olivias-ring .clown { position:absolute; bottom:20%; left:65%; width:20px; height:42px; background: linear-gradient(180deg, #4a3a5a 0%, #2a1a3a 100%); border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%; transform-origin: bottom center; animation: or-figure 6s ease-in-out infinite reverse; }
.scn-item-olivias-ring .candle { position:absolute; bottom:35%; left:55%; width:8px; height:14px; transform:translateX(-50%); background: linear-gradient(180deg, #f0d080 0%, #c09050 50%, #805030 100%); border-radius: 2px; box-shadow: 0 0 20px 6px #c09050, 0 0 40px 12px rgba(192,144,80,.3); animation: or-candle 4s ease-in-out infinite alternate; }
.scn-item-olivias-ring .shadow-circle { position:absolute; bottom:15%; left:45%; width:120px; height:80px; background: radial-gradient(ellipse, rgba(0,0,0,.5) 0%, transparent 70%); animation: or-shadow 10s ease-in-out infinite; }
@keyframes or-cell { 0% { opacity:.7 } 50% { opacity:1 } 100% { opacity:.8 } }
@keyframes or-grille { 0% { background-position: 0 0 } 100% { background-position: 40px 0 } }
@keyframes or-figure { 0% { transform: translateY(0) rotate(-1deg) } 25% { transform: translateY(-1px) rotate(1deg) } 50% { transform: translateY(0) rotate(-2deg) } 75% { transform: translateY(-1px) rotate(1deg) } 100% { transform: translateY(0) rotate(-1deg) } }
@keyframes or-candle { 0% { box-shadow: 0 0 15px 4px #c09050; opacity:.8 } 50% { box-shadow: 0 0 25px 8px #f0d080; opacity:1 } 100% { box-shadow: 0 0 18px 5px #c09050; opacity:.9 } }
@keyframes or-shadow { 0%,100% { transform: scale(1) } 50% { transform: scale(1.1) } }

.scn-cesario-love-pledge {
  background:
    linear-gradient(180deg, #e8c080 0%, #c88a50 40%, #7a5030 100%),
    radial-gradient(ellipse at 50% 30%, #f8d8a0 0%, transparent 60%);
}
.scn-cesario-love-pledge .window {
  position: absolute; top: 10%; left: 30%; width: 40%; height: 50%;
  background: linear-gradient(135deg, #ffe8c0 0%, #ffd080 100%);
  border-radius: 4px / 8px;
  box-shadow: 0 0 60px 20px rgba(255,200,100,0.6);
  animation: clp-window 6s ease-in-out infinite alternate;
}
.scn-cesario-love-pledge .curtain-a {
  position: absolute; top: 0; left: 25%; width: 20%; height: 60%;
  background: linear-gradient(90deg, #c87040 0%, #a05028 100%);
  border-radius: 0 20% 20% 0 / 0 40% 40% 0;
  animation: clp-curtain 8s ease-in-out infinite alternate;
}
.scn-cesario-love-pledge .curtain-b {
  position: absolute; top: 0; right: 25%; width: 20%; height: 60%;
  background: linear-gradient(270deg, #c87040 0%, #a05028 100%);
  border-radius: 20% 0 0 20% / 40% 0 0 40%;
  animation: clp-curtain 8s ease-in-out infinite alternate-reverse;
}
.scn-cesario-love-pledge .figure-left {
  position: absolute; bottom: 20%; left: 32%; width: 14%; height: 40%;
  background: linear-gradient(180deg, #5a3a2a 0%, #3a2218 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: clp-figure-left 4s ease-in-out infinite alternate;
}
.scn-cesario-love-pledge .figure-right {
  position: absolute; bottom: 20%; right: 32%; width: 16%; height: 42%;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: clp-figure-right 4s ease-in-out infinite alternate;
}
.scn-cesario-love-pledge .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 20%;
  background: linear-gradient(180deg, #6a4828 0%, #4a3018 100%);
  box-shadow: inset 0 10px 20px rgba(0,0,0,0.5);
}
.scn-cesario-love-pledge .light-ray {
  position: absolute; top: 5%; left: 30%; width: 40%; height: 50%;
  background: linear-gradient(180deg, rgba(255,220,150,0.3) 0%, transparent 100%);
  clip-path: polygon(0 0, 100% 0, 80% 100%, 20% 100%);
  animation: clp-ray 6s ease-in-out infinite alternate;
}
@keyframes clp-window {
  0% { opacity: 0.8; transform: scaleY(1); }
  50% { opacity: 1; transform: scaleY(1.02); }
  100% { opacity: 0.85; transform: scaleY(0.98); }
}
@keyframes clp-curtain {
  0% { transform: translateX(0) rotate(0deg); }
  50% { transform: translateX(4px) rotate(1deg); }
  100% { transform: translateX(0) rotate(0deg); }
}
@keyframes clp-figure-left {
  0% { transform: translateX(0) translateY(0) rotate(-1deg); }
  50% { transform: translateX(2px) translateY(-2px) rotate(1deg); }
  100% { transform: translateX(0) translateY(0) rotate(-1deg); }
}
@keyframes clp-figure-right {
  0% { transform: translateX(0) translateY(0) rotate(1deg); }
  50% { transform: translateX(-2px) translateY(-2px) rotate(-1deg); }
  100% { transform: translateX(0) translateY(0) rotate(1deg); }
}
@keyframes clp-ray {
  0% { opacity: 0.2; transform: scaleX(0.95); }
  50% { opacity: 0.4; transform: scaleX(1.05); }
  100% { opacity: 0.25; transform: scaleX(0.95); }
}

.scn-sebastian-grief {
  background:
    linear-gradient(180deg, #4a5a6a 0%, #2a3a4a 40%, #1a2a3a 100%),
    radial-gradient(ellipse at 50% 100%, #3a4a5a 0%, transparent 70%);
}
.scn-sebastian-grief .sky {
  position: absolute; inset: 0 0 50% 0;
  background: linear-gradient(180deg, #5a6a7a 0%, #3a4a5a 100%);
  animation: sbg-sky 12s ease-in-out infinite alternate;
}
.scn-sebastian-grief .sea {
  position: absolute; bottom: 0; left: 0; right: 0; height: 55%;
  background: linear-gradient(180deg, #2a3a4a 0%, #1a2a3a 100%);
  border-radius: 50% 50% 0 0 / 20% 20% 0 0;
  animation: sbg-sea 8s ease-in-out infinite alternate;
}
.scn-sebastian-grief .rock-1 {
  position: absolute; bottom: 40%; left: 20%; width: 15%; height: 30%;
  background: linear-gradient(180deg, #3a4a4a 0%, #1a2a2a 100%);
  border-radius: 10% 10% 20% 20% / 20% 20% 40% 40%;
  box-shadow: inset 0 -10px 15px rgba(0,0,0,0.5);
  animation: sbg-rock 10s ease-in-out infinite alternate;
}
.scn-sebastian-grief .rock-2 {
  position: absolute; bottom: 35%; right: 15%; width: 12%; height: 25%;
  background: linear-gradient(180deg, #3a4a4a 0%, #1a2a2a 100%);
  border-radius: 20% 20% 10% 10% / 40% 40% 20% 20%;
  animation: sbg-rock 12s ease-in-out infinite alternate-reverse;
}
.scn-sebastian-grief .figure-left {
  position: absolute; bottom: 32%; left: 38%; width: 12%; height: 30%;
  background: linear-gradient(180deg, #2a2a3a 0%, #0a0a1a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  animation: sbg-figure-left 4s ease-in-out infinite alternate;
}
.scn-sebastian-grief .figure-right {
  position: absolute; bottom: 32%; right: 38%; width: 13%; height: 32%;
  background: linear-gradient(180deg, #3a3a4a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 30% 30% / 60% 60% 30% 30%;
  animation: sbg-figure-right 4s ease-in-out infinite alternate;
}
.scn-sebastian-grief .spray {
  position: absolute; bottom: 45%; left: 30%; width: 40%; height: 8%;
  background: radial-gradient(ellipse at 50% 50%, rgba(200,220,240,0.3) 0%, transparent 70%);
  filter: blur(6px);
  animation: sbg-spray 3s ease-in-out infinite alternate;
}
@keyframes sbg-sky {
  0% { opacity: 0.7; }
  50% { opacity: 1; }
  100% { opacity: 0.6; }
}
@keyframes sbg-sea {
  0% { transform: translateY(0) scaleY(1); }
  50% { transform: translateY(-4px) scaleY(1.02); }
  100% { transform: translateY(0) scaleY(1); }
}
@keyframes sbg-rock {
  0% { transform: translateY(0) rotate(-1deg); }
  50% { transform: translateY(2px) rotate(1deg); }
  100% { transform: translateY(0) rotate(-1deg); }
}
@keyframes sbg-figure-left {
  0% { transform: translateX(0) translateY(0) rotate(-2deg); }
  50% { transform: translateX(-2px) translateY(-3px) rotate(2deg); }
  100% { transform: translateX(0) translateY(0) rotate(-2deg); }
}
@keyframes sbg-figure-right {
  0% { transform: translateX(0) translateY(0) rotate(2deg); }
  50% { transform: translateX(2px) translateY(-3px) rotate(-2deg); }
  100% { transform: translateX(0) translateY(0) rotate(2deg); }
}
@keyframes sbg-spray {
  0% { opacity: 0.2; transform: translateY(0) scaleX(1); }
  50% { opacity: 0.5; transform: translateY(-2px) scaleX(1.1); }
  100% { opacity: 0.3; transform: translateY(0) scaleX(1); }
}

.scn-malvolio-revelry {
  background:
    linear-gradient(180deg, #2a1a1a 0%, #3a2a2a 30%, #1a0a0a 100%),
    radial-gradient(ellipse at 50% 20%, #4a3a3a 0%, transparent 70%);
}
.scn-malvolio-revelry .wall {
  position: absolute; inset: 0 0 25% 0;
  background: linear-gradient(180deg, #3a2a2a 0%, #2a1a1a 100%);
  box-shadow: inset 0 0 30px rgba(0,0,0,0.6);
}
.scn-malvolio-revelry .floor {
  position: absolute; bottom: 0; left: 0; right: 0; height: 25%;
  background: linear-gradient(180deg, #4a3a2a 0%, #2a1a0a 100%);
}
.scn-malvolio-revelry .window {
  position: absolute; top: 15%; left: 35%; width: 30%; height: 35%;
  background: linear-gradient(135deg, #a07040 0%, #7a5030 100%);
  border-radius: 6px / 12px;
  box-shadow: 0 0 40px 10px rgba(180,120,60,0.3);
  animation: mvr-window 8s ease-in-out infinite alternate;
}
.scn-malvolio-revelry .jewel {
  position: absolute; top: 40%; left: 50%; width: 4%; height: 6%;
  background: radial-gradient(circle, #d08040 0%, #a05028 70%);
  border-radius: 50%;
  box-shadow: 0 0 30px 8px rgba(200,130,60,0.6);
  animation: mvr-jewel 3s ease-in-out infinite alternate;
}
.scn-malvolio-revelry .figure-orsino {
  position: absolute; bottom: 20%; left: 28%; width: 16%; height: 45%;
  background: linear-gradient(180deg, #4a3a3a 0%, #2a1a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: mvr-figure-orsino 4s ease-in-out infinite alternate;
}
.scn-malvolio-revelry .figure-cesario {
  position: absolute; bottom: 20%; right: 28%; width: 14%; height: 42%;
  background: linear-gradient(180deg, #3a3a4a 0%, #1a1a2a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  animation: mvr-figure-cesario 4s ease-in-out infinite alternate;
}
@keyframes mvr-window {
  0% { opacity: 0.4; transform: scaleY(1); }
  50% { opacity: 0.6; transform: scaleY(1.02); }
  100% { opacity: 0.5; transform: scaleY(0.98); }
}
@keyframes mvr-jewel {
  0% { opacity: 0.7; transform: scale(1) rotate(0deg); }
  50% { opacity: 1; transform: scale(1.1) rotate(10deg); }
  100% { opacity: 0.8; transform: scale(1) rotate(0deg); }
}
@keyframes mvr-figure-orsino {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  50% { transform: translateX(2px) translateY(-2px) rotate(1deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}
@keyframes mvr-figure-cesario {
  0% { transform: translateX(0) translateY(0) rotate(0deg); }
  50% { transform: translateX(-2px) translateY(-2px) rotate(-1deg); }
  100% { transform: translateX(0) translateY(0) rotate(0deg); }
}

.scn-forged-letter {
  background:
    linear-gradient(180deg, #d0c8a0 0%, #b0a880 40%, #908060 100%),
    radial-gradient(ellipse at 50% 0%, #e0d8b0 0%, transparent 60%);
}
.scn-forged-letter .sky {
  position: absolute; inset: 0 0 40% 0;
  background: linear-gradient(180deg, #b8d0e0 0%, #a0b8c8 100%);
  border-radius: 0 0 30% 30% / 0 0 20% 20%;
  animation: fgl-sky 12s ease-in-out infinite alternate;
}
.scn-forged-letter .foliage-a {
  position: absolute; top: 30%; left: 10%; width: 25%; height: 40%;
  background: radial-gradient(ellipse at 50% 100%, #5a7a3a 0%, #3a5a2a 100%);
  border-radius: 50% 50% 0 0 / 80% 80% 0 0;
  animation: fgl-foliage 8s ease-in-out infinite alternate;
}
.scn-forged-letter .foliage-b {
  position: absolute; top: 35%; right: 10%; width: 20%; height: 35%;
  background: radial-gradient(ellipse at 50% 100%, #5a7a3a 0%, #3a5a2a 100%);
  border-radius: 50% 50% 0 0 / 80% 80% 0 0;
  animation: fgl-foliage 10s ease-in-out infinite alternate-reverse;
}
.scn-forged-letter .path {
  position: absolute; bottom: 10%; left: 20%; right: 20%; height: 15%;
  background: linear-gradient(180deg, #8a7a5a 0%, #6a5a3a 100%);
  border-radius: 50% 50% 0 0 / 100% 100% 0 0;
  box-shadow: inset 0 8px 15px rgba(0,0,0,0.3);
}
.scn-forged-letter .letter {
  position: absolute; bottom: 30%; left: 55%; width: 8%; height: 10%;
  background: linear-gradient(135deg, #f8f0d0 0%, #d8c8a0 100%);
  border-radius: 4px;
  box-shadow: 0 0 20px 6px rgba(240,220,160,0.5);
  animation: fgl-letter 3s ease-in-out infinite alternate;
}
.scn-forged-letter .figure-malvolio {
  position: absolute; bottom: 15%; left: 42%; width: 16%; height: 48%;
  background: linear-gradient(180deg, #4a4a3a 0%, #2a2a1a 100%);
  border-radius: 50% 50% 40% 40% / 60% 60% 40% 40%;
  transform-origin: bottom center;
  animation: fgl-malvolio 2s ease-in-out infinite alternate;
}
@keyframes fgl-sky {
  0% { opacity: 0.7; }
  50% { opacity: 1; }
  100% { opacity: 0.8; }
}
@keyframes fgl-foliage {
  0% { transform: translateY(0) rotate(-2deg); }
  50% { transform: translateY(-4px) rotate(2deg); }
  100% { transform: translateY(0) rotate(-2deg); }
}
@keyframes fgl-letter {
  0% { transform: translateY(0) rotate(-5deg); opacity: 0.8; }
  50% { transform: translateY(-6px) rotate(5deg); opacity: 1; }
  100% { transform: translateY(0) rotate(-5deg); opacity: 0.9; }
}
@keyframes fgl-malvolio {
  0% { transform: translateX(0) translateY(0) rotate(-3deg) scaleY(1); }
  50% { transform: translateX(4px) translateY(-8px) rotate(3deg) scaleY(1.05); }
  100% { transform: translateX(0) translateY(0) rotate(-3deg) scaleY(1); }
}

.scn-orsino-accepts {
  background: linear-gradient(180deg, #f5e6c8 0%, #e8d0a0 40%, #c8a86e 100%), radial-gradient(ellipse at 70% 20%, #fff4e0 0%, transparent 50%);
}
.scn-orsino-accepts .room-bg { position:absolute; inset:0; background: linear-gradient(135deg, #d4b88a 0%, #b8956a 100%); }
.scn-orsino-accepts .window { position:absolute; top:10%; left:15%; width:30%; height:50%; background: linear-gradient(180deg, #a0c4e0 0%, #7a9cb0 100%); border-radius:10% / 15%; box-shadow: inset 0 0 30px rgba(0,0,0,0.2); animation: oa-window 6s ease-in-out infinite alternate; }
.scn-orsino-accepts .sunbeam { position:absolute; top:8%; left:18%; width:20%; height:60%; background: linear-gradient(180deg, rgba(255,240,200,0.4) 0%, rgba(255,240,200,0) 100%); transform: rotate(15deg); filter: blur(8px); animation: oa-sunbeam 8s ease-in-out infinite alternate; }
.scn-orsino-accepts .table { position:absolute; bottom:15%; left:30%; width:40%; height:10%; background: linear-gradient(180deg, #8b6f47 0%, #6a5030 100%); border-radius: 50% / 100%; box-shadow: 0 -4px 10px rgba(0,0,0,0.3); }
.scn-orsino-accepts .figure-orsino { position:absolute; bottom:18%; left:35%; width:12%; height:35%; background: linear-gradient(180deg, #705a3e 0%, #4d3a24 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: oa-orsino 4s ease-in-out infinite; }
.scn-orsino-accepts .figure-viola { position:absolute; bottom:18%; left:55%; width:10%; height:32%; background: linear-gradient(180deg, #8a7a5a 0%, #5a4a2e 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: oa-viola 4s ease-in-out infinite; }
.scn-orsino-accepts .glow-spot { position:absolute; bottom:25%; left:45%; width:8%; height:8%; background: radial-gradient(circle, #ffe080 0%, #ffd060 30%, transparent 70%); animation: oa-glow 3s ease-in-out infinite alternate; }

@keyframes oa-window { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.85; } }
@keyframes oa-sunbeam { 0% { transform: rotate(12deg) scaleY(1); } 50% { transform: rotate(18deg) scaleY(1.05); } 100% { transform: rotate(12deg) scaleY(1); } }
@keyframes oa-orsino { 0% { transform: translateX(0) translateY(0) rotate(0); } 25% { transform: translateX(2px) translateY(-2px) rotate(-2deg); } 50% { transform: translateX(0) translateY(0) rotate(0); } 75% { transform: translateX(-2px) translateY(-1px) rotate(2deg); } 100% { transform: translateX(0) translateY(0) rotate(0); } }
@keyframes oa-viola { 0% { transform: translateX(0) translateY(0) rotate(0); } 25% { transform: translateX(-2px) translateY(-1px) rotate(2deg); } 50% { transform: translateX(0) translateY(0) rotate(0); } 75% { transform: translateX(2px) translateY(-2px) rotate(-2deg); } 100% { transform: translateX(0) translateY(0) rotate(0); } }
@keyframes oa-glow { 0% { transform: scale(1); opacity:0.6; } 50% { transform: scale(1.3); opacity:1; } 100% { transform: scale(1); opacity:0.7; } }

.scn-malvolio-revenge {
  background: linear-gradient(180deg, #1a1a2e 0%, #2a1a1a 30%, #0d0d1a 100%), radial-gradient(ellipse at 30% 50%, #3a2a2a 0%, transparent 60%);
}
.scn-malvolio-revenge .shadow-bg { position:absolute; inset:0; background: linear-gradient(135deg, #0e0e1a 0%, #1a0e0e 100%); }
.scn-malvolio-revenge .candle { position:absolute; bottom:20%; left:20%; width:4%; height:8%; background: linear-gradient(180deg, #e8d0a0 0%, #b09060 100%); border-radius: 10% 10% 30% 30%; box-shadow: 0 -10px 20px rgba(200,150,80,0.5); animation: mr-candle 5s ease-in-out infinite; }
.scn-malvolio-revenge .candle-glow { position:absolute; bottom:22%; left:19%; width:6%; height:6%; background: radial-gradient(circle, #ffcc80 0%, rgba(200,150,80,0.4) 60%, transparent 100%); animation: mr-glow 3s ease-in-out infinite alternate; }
.scn-malvolio-revenge .figure-malvolio { position:absolute; bottom:15%; left:22%; width:12%; height:40%; background: linear-gradient(180deg, #3a2e22 0%, #1e1610 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mr-malvolio 2s ease-in-out infinite; }
.scn-malvolio-revenge .figure-olivia { position:absolute; bottom:15%; left:40%; width:10%; height:35%; background: linear-gradient(180deg, #4a3a2a 0%, #2a1e14 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mr-olivia 3s ease-in-out infinite; }
.scn-malvolio-revenge .figure-clown { position:absolute; bottom:15%; right:20%; width:10%; height:30%; background: linear-gradient(180deg, #5a3a22 0%, #3a2212 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; transform-origin: bottom center; animation: mr-clown 4s ease-in-out infinite; }
.scn-malvolio-revenge .letter { position:absolute; bottom:35%; left:30%; width:10%; height:7%; background: linear-gradient(135deg, #d4c4a0 0%, #a89070 100%); border-radius: 5%; transform: rotate(10deg); box-shadow: 0 2px 6px rgba(0,0,0,0.5); animation: mr-letter 6s ease-in-out infinite; }
.scn-malvolio-revenge .letter-glow { position:absolute; bottom:34%; left:29%; width:12%; height:9%; background: radial-gradient(circle, rgba(200,180,140,0.3) 0%, transparent 70%); animation: mr-letterglow 6s ease-in-out infinite; }

@keyframes mr-candle { 0% { transform: scaleY(1); } 50% { transform: scaleY(1.1); } 100% { transform: scaleY(1); } }
@keyframes mr-glow { 0% { opacity:0.5; transform: scale(1); } 50% { opacity:1; transform: scale(1.2); } 100% { opacity:0.6; transform: scale(1); } }
@keyframes mr-malvolio { 0% { transform: translateX(0) rotate(0); } 25% { transform: translateX(2px) rotate(3deg); } 50% { transform: translateX(0) rotate(0); } 75% { transform: translateX(-2px) rotate(-3deg); } 100% { transform: translateX(0) rotate(0); } }
@keyframes mr-olivia { 0% { transform: translateY(0); } 50% { transform: translateY(-3px); } 100% { transform: translateY(0); } }
@keyframes mr-clown { 0% { transform: translateX(0) scaleX(1); } 50% { transform: translateX(5px) scaleX(-1); } 100% { transform: translateX(0) scaleX(1); } }
@keyframes mr-letter { 0% { transform: rotate(8deg) translateY(0); } 50% { transform: rotate(12deg) translateY(-2px); } 100% { transform: rotate(8deg) translateY(0); } }
@keyframes mr-letterglow { 0% { opacity:0.3; } 50% { opacity:0.7; } 100% { opacity:0.3; } }

.scn-clowns-song {
  background: linear-gradient(180deg, #2c2440 0%, #4a3a5a 20%, #6a4e3e 40%, #8a6a4a 60%, #c8a070 80%, #e8c8a0 100%), radial-gradient(ellipse at 50% 100%, #c8a070 0%, transparent 70%);
}
.scn-clowns-song .dusk-sky { position:absolute; inset:0 0 30% 0; background: linear-gradient(180deg, #2a2040 0%, #5a4a6a 30%, #8a6a5a 60%, #b08a6a 100%); animation: cs-sky 20s ease-in-out infinite alternate; }
.scn-clowns-song .sunset-horizon { position:absolute; bottom:25%; left:0; right:0; height:15%; background: linear-gradient(180deg, #c8a070 0%, #a08050 100%); border-radius: 60% 40% 0 0 / 100% 80% 0 0; box-shadow: 0 4px 20px rgba(200,160,112,0.5); animation: cs-horizon 15s ease-in-out infinite; }
.scn-clowns-song .figure-clown-silhouette { position:absolute; bottom:20%; left:50%; width:10%; height:40%; transform: translateX(-50%); background: linear-gradient(180deg, #1a1020 0%, #0a0510 100%); border-radius: 40% 40% 30% 30% / 60% 60% 40% 40%; animation: cs-clown 8s ease-in-out infinite; }
.scn-clowns-song .lantern { position:absolute; bottom:35%; left:48%; width:4%; height:6%; background: radial-gradient(circle, #ffe080 0%, #ffcc40 40%, transparent 70%); border-radius: 50%; box-shadow: 0 0 20px 6px rgba(255,200,80,0.5); animation: cs-lantern 4s ease-in-out infinite; }
.scn-clowns-song .rain-drops { position:absolute; top:0; left:0; width:100%; height:100%; background: repeating-linear-gradient(0deg, transparent 0px, transparent 5px, rgba(180,200,220,0.1) 5px, rgba(180,200,220,0.1) 6px); animation: cs-rain 3s linear infinite; }
.scn-clowns-song .rain-drops-2 { position:absolute; top:0; left:0; width:100%; height:100%; background: repeating-linear-gradient(30deg, transparent 0px, transparent 10px, rgba(180,200,220,0.05) 10px, rgba(180,200,220,0.05) 11px); animation: cs-rain2 4s linear infinite; animation-delay: -2s; }

@keyframes cs-sky { 0% { opacity:0.8; } 50% { opacity:1; } 100% { opacity:0.9; } }
@keyframes cs-horizon { 0% { transform: scaleY(1); } 50% { transform: scaleY(1.02); } 100% { transform: scaleY(1); } }
@keyframes cs-clown { 0% { transform: translateX(-50%) translateY(0) rotate(0); } 25% { transform: translateX(-50%) translateY(-2px) rotate(2deg); } 50% { transform: translateX(-50%) translateY(0) rotate(0); } 75% { transform: translateX(-50%) translateY(-1px) rotate(-2deg); } 100% { transform: translateX(-50%) translateY(0) rotate(0); } }
@keyframes cs-lantern { 0% { transform: scale(1) rotate(-5deg); } 50% { transform: scale(1.1) rotate(5deg); } 100% { transform: scale(1) rotate(-5deg); } }
@keyframes cs-rain { 0% { transform: translateY(-100%); } 100% { transform: translateY(100%); } }
@keyframes cs-rain2 { 0% { transform: translateY(-100%) rotate(30deg); } 100% { transform: translateY(100%) rotate(30deg); } }
/* end per-scene blocks */