/* The same complete animated character peeks over the message workshop. */
.fishy-stage {position:sticky;top:8px;z-index:3;background:#e4dfed;box-shadow:0 10px 12px #e4dfed;display:flex;align-items:center;justify-content:space-between;min-height:188px;scroll-margin-top:24px;gap:12px;margin:-8px 0 22px;border-bottom:1px solid #c4b9d4;pointer-events:none;user-select:none}
.scam-clue {scroll-margin-top:220px;scroll-margin-bottom:24px}
.fishy-aside {flex:1;min-width:0;max-width:270px;padding:8px 0 20px}
.fishy-name {display:block;font-size:10px;font-weight:800;letter-spacing:.17em;color:#6e4f96;margin-bottom:9px}
.fishy-aside p {font-size:20px;font-weight:700;letter-spacing:-.035em;line-height:1.25;color:#49325e;max-width:220px}
.fishy-window {width:188px;height:188px;flex:0 0 188px;position:relative;overflow:hidden;isolation:isolate}
.fishy-halo {position:absolute;bottom:-42px;left:3px;right:3px;height:185px;border-radius:50%;background:radial-gradient(ellipse at 50% 70%,#cbb6ed,#e4dfed 74%);transition:background .25s}
.fishy-puppet {position:absolute;top:-18px;left:-48px;width:284px;height:379px;transform:translateY(0);transform-origin:50% 40%;will-change:transform}
#fishy-stage .exercise-fishy-cinema {inset:0;mask-image:none}
.fishy-ledge {position:absolute;bottom:0;left:0;right:0;height:5px;border-radius:4px 4px 0 0;background:linear-gradient(90deg,#aa96c5,#7852ba,#aa96c5);box-shadow:0 -5px 18px #3c215726;z-index:4}
.fishy-punctuation {position:absolute;right:0;top:15px;z-index:4;background:#f7f4fb;color:#654593;border:1px solid #b8a5cd;border-radius:11px 11px 11px 2px;min-width:32px;height:34px;padding:4px 8px;display:grid;place-items:center;font-size:19px;font-weight:800;transform:rotate(8deg);box-shadow:0 4px 15px #3219470c}
.fishy-stage[data-count="1"] .fishy-halo {background:radial-gradient(ellipse at 50% 70%,#ebc7a0,#e4dfed 74%)}
.fishy-stage[data-count="2"] .fishy-halo {background:radial-gradient(ellipse at 50% 70%,#e8adb8,#e4dfed 74%)}
.fishy-stage[data-count="3"] .fishy-halo {background:radial-gradient(ellipse at 50% 70%,#cbe6a9,#e4dfed 74%)}
.fishy-stage[data-count="3"] .fishy-punctuation {color:#38521a;background:#eaf5d8;border-color:#a4bd7c;font-size:14px;min-width:44px;transform:rotate(0)}
.fishy-stage[data-count="3"] .fishy-aside p {color:#3d5623}
.fishy-stage[data-pose="ducked"] .fishy-puppet {transform:translateY(118px)}
html[data-motion=paused] .fishy-stage * {transition:none!important}
@media(prefers-reduced-motion:reduce) {html:not([data-motion=running]) .fishy-stage * {transition:none!important}}
@media(max-width:760px) {
  .fishy-stage {min-height:162px;margin:-4px 0 19px;gap:5px}
  .scam-clue {scroll-margin-top:190px;scroll-margin-bottom:24px}
  .fishy-aside {padding-bottom:12px}
  .fishy-aside p {font-size:18px;max-width:175px}
  .fishy-window {width:144px;flex-basis:144px;height:162px}
  .fishy-puppet {width:246px;height:328px;top:-14px;left:-51px}
  .fishy-halo {left:0;right:0;height:156px;bottom:-35px}
  .fishy-punctuation {height:28px;min-width:27px;font-size:17px;top:10px;padding:3px 6px}
}
@media(max-width:360px) {
  .fishy-stage {min-height:150px}
  .fishy-aside p {font-size:16px}
  .fishy-window {width:126px;flex-basis:126px;height:150px}
  .fishy-puppet {width:220px;height:294px;top:-12px;left:-47px}
}
/* Fishy is one complete animated character, blended into the hero atmosphere. */
.hero-art {height:560px;isolation:isolate}
.hero-art .art-annotation {display:none}
.fishy-aura {position:absolute;left:20%;right:-5%;top:9%;bottom:6%;border-radius:50%;background:radial-gradient(ellipse,#754fe044,transparent 66%);filter:blur(25px);pointer-events:none;z-index:-2}
.fishy-orbit {position:absolute;left:15%;right:-1%;top:19%;height:54%;border:1px solid #bfa6ff2d;border-radius:50%;transform:rotate(-23deg);box-shadow:0 0 0 30px #a486ff04;pointer-events:none;z-index:-1}
.fishy-orbit:after {content:"";position:absolute;right:9%;top:9%;width:7px;height:7px;background:var(--ice);border-radius:50%;box-shadow:0 0 22px #37c6f4}
.fishy-cinema {position:absolute;inset:-45px -7% -35px -8%;pointer-events:none;isolation:isolate;
  mask-image:linear-gradient(to right,transparent,#000 18%,#000 82%,transparent),linear-gradient(to bottom,transparent,#000 8%,#000 94%,transparent);
  mask-composite:intersect}
.fishy-cinema>img,.fishy-cinema>video {position:absolute;inset:0;width:100%;height:100%;max-width:none;object-fit:contain;transform:none}
.fishy-cinema>img {z-index:0}
.fishy-film {z-index:1;opacity:0;transition:opacity .16s ease}
.fishy-film.is-showing {opacity:1}
.fishy-cinema>canvas {position:absolute;inset:0;width:100%;height:100%;object-fit:contain;z-index:3;pointer-events:none}
.fishy-cinema.has-composite>img {opacity:0!important}
/* Keep the source video in the browser's rendering pipeline. Fully transparent
   video can stop delivering frames even while the canvas needs those frames. */
.fishy-cinema.has-composite>video {opacity:.001!important;transition:none}
#fishy-reaction-film {z-index:2}
.hero-art .floating-badge {z-index:3;left:1%;top:32%;font-size:13px;box-shadow:0 10px 35px #120c3340}
.floating-badge strong {font-weight:inherit}
.hero-art[data-fishy-state=watch] .floating-badge {background:#91e1f7}
.hero-art[data-fishy-state=startled] .floating-badge,
.hero-art[data-fishy-state=caught] .floating-badge {background:#ffcf9b}
.hero-art .hero-message {z-index:4;left:-14%;bottom:0;transform:rotate(-4deg);border:1px solid #ffffff55}
.hero-art .hero-message:hover,.hero-art .hero-message:focus-within,.hero-art .hero-message.is-revealed {transform:rotate(0)}
.fishy-signature {position:absolute;right:0;bottom:5%;z-index:3;pointer-events:none;text-align:right}
.fishy-signature>span {display:flex;gap:8px;align-items:center;justify-content:flex-end;font-size:19px;font-weight:850;letter-spacing:.12em;color:#d9ceff}
.signature-dot {width:6px;height:6px;border-radius:50%;background:var(--ice);box-shadow:0 0 12px var(--ice)}
.fishy-signature small {font-size:7px;letter-spacing:.12em;color:#bca9da;display:block;margin-top:6px}
html[data-motion=paused] .fishy-film {transition:none}
@media(max-width:1100px) {
  .hero-art {height:520px}
  .hero-art .hero-message {left:-12%;width:275px}
  .fishy-signature {right:-2%;bottom:7%}
}
@media(max-width:760px) {
  .hero-art {height:650px;margin:14px 0 10px}
  .fishy-cinema {inset:-10px -13% 190px -13%}
  .fishy-aura {top:4%;bottom:36%;left:2%;right:2%}
  .fishy-orbit {left:3%;right:0;top:12%;height:44%}
  .hero-art .floating-badge {top:20%;left:0;font-size:12px;padding:8px 13px 8px 9px}
  .hero-art .hero-message {left:0;bottom:0;width:100%;transform:rotate(-2deg)}
  .fishy-signature {right:0;bottom:42%}
  .fishy-signature>span {font-size:16px}
  .fishy-signature small {font-size:6px;max-width:90px}
}
@media(max-width:380px) {
  .hero-art {height:610px}
  .fishy-cinema {inset:-5px -15% 205px -15%}
  .hero-art .floating-badge {left:-1%;top:18%;font-size:11px}
  .fishy-signature {bottom:44%}
}
@media(prefers-reduced-motion:reduce) {
  html:not([data-motion=running]) .fishy-film {transition:none}
}



/* Fishy peeks over the real registration CTA; no frame or interaction layer. */
.registration-intro {position:relative;padding-top:112px;min-width:310px}
.registration-intro .registration-cta {position:relative;z-index:4}
.registration-fishy {position:absolute;top:-14px;left:0;right:0;height:143px;pointer-events:none;user-select:none}
.registration-fishy-line {position:absolute;left:0;bottom:38px;max-width:142px;padding:9px 11px;border:1px solid #a28ccc55;border-radius:10px 10px 2px 10px;color:#e1d4f6;background:#382254;font-size:12px;font-weight:650;line-height:1.4}
.registration-fishy-window {position:absolute;right:0;bottom:0;width:161px;height:143px;overflow:hidden;isolation:isolate}
.registration-fishy-puppet {position:absolute;width:258px;height:344px;left:-49px;top:-22px;transform:translateY(22px) rotate(-5deg);transform-origin:50% 35%;transition:transform .45s cubic-bezier(.2,.7,.2,1)}
#registration-fishy .registration-fishy-cinema {inset:0;mask-image:none}
.registration-fishy[data-pose=watching] .registration-fishy-puppet {transform:translateY(4px) rotate(0)}
.registration-fishy[data-pose=caught] .registration-fishy-puppet {transform:translateY(12px) rotate(4deg)}
.registration-fishy[data-pose=caught] .registration-fishy-line {color:var(--lime);border-color:#ddf98566}
html[data-motion=paused] .registration-fishy-puppet {transform:translateY(12px) rotate(-3deg);transition:none}
@media(prefers-reduced-motion:reduce) {html:not([data-motion=running]) .registration-fishy-puppet {transform:translateY(12px) rotate(-3deg)!important;transition:none!important}}
@media(max-width:760px) {
  .registration-intro {min-width:0;padding-top:96px}
  .registration-fishy {height:123px;top:-12px}
  .registration-fishy-window {width:142px;height:123px}
  .registration-fishy-puppet {width:230px;height:307px;left:-44px;top:-21px}
  .registration-fishy-line {bottom:32px;max-width:calc(100% - 149px);font-size:11px;padding:8px 9px}
}

/* Each animation already contains transparency; render it directly. */
.fishy-cinema>.fishy-native {z-index:3;opacity:1;transition:none}
.fishy-cinema>img[hidden] {display:none!important}