/* Outlined festival graphics; never a colored background or scientific overlay. */
:root{--anime:.5;--anime-pink:#ff8bd5;--anime-blue:#76eafa;--anime-drift:1px;--anime-duration:18s;--anime-look-x:0px;--anime-look-y:0px}
.site-anime-mark,.anime-cursor-spark{position:absolute;display:block;width:38px;height:38px;color:var(--anime-pink);pointer-events:none!important;user-select:none;z-index:1}
.site-anime-mark{opacity:var(--mark-opacity,0);transform:rotate(var(--tilt,-10deg));animation:anime-drift var(--anime-duration) ease-in-out var(--phase,0s) infinite alternate;filter:drop-shadow(0 0 3px currentColor)}
.site-anime-mark[hidden],.anime-festival[hidden]{display:none!important}
.site-anime-mark svg,.anime-cursor-spark svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor;stroke-width:1.25;stroke-linecap:round;stroke-linejoin:round;overflow:visible;pointer-events:none!important}
.site-anime-mark svg{animation:anime-twinkle calc(var(--anime-duration) * .65) ease-in-out var(--phase,0s) infinite alternate}
.site-anime-mark[data-motif="butterfly"] svg,.site-anime-mark[data-motif="wings"] svg{animation:anime-flutter calc(var(--anime-duration) * .4) ease-in-out var(--phase,0s) infinite alternate;transform-origin:center}
.chapter,.anime-heading,.chapter .body-copy,.brand,nav,.independence,.reading-head h2,.reading-head>p:last-child,.index-tools,.work-row strong,.next,footer{position:relative}
.software-chapter .software-body,.software-chapter .software-copy,.software-chapter .body-copy,.software-chapter .software-copy p,.software-chapter a{position:relative}
.software-chapter:not(.active) .site-anime-mark{display:none!important}
.anime-title-top{width:44px;height:44px;top:-24px;left:20px;--tilt:-12deg;color:var(--anime-blue)}
.anime-title-side{width:38px;height:38px;right:3%;top:64%;--tilt:15deg}
.chapter[data-step="0"] .anime-title-side{right:1%;top:66%;width:46px;height:46px}
.anime-copy-mark{width:23px;height:23px;left:-33px;top:5px;--tilt:-18deg}
.anime-margin-moon{width:32px;height:32px;left:-53px;top:57%;color:#c1a6ff;--tilt:-16deg}
.inline-link{position:relative}
.anime-link-star{width:18px;height:18px;right:-30px;top:8px;color:var(--anime-blue);--tilt:8deg}
.anime-heading span:not(.site-anime-mark){text-decoration-line:underline;text-decoration-color:rgb(255 139 213 / calc(var(--anime,.1)*.5));text-decoration-thickness:1px;text-underline-offset:9px}
.anime-brand-ears{width:29px;height:29px;left:43px;top:-16px;--tilt:0deg}
.anime-nav-heart{width:18px;height:18px;right:-31px;top:-3px;--tilt:14deg}
.anime-independent-wings{width:29px;height:29px;left:-38px;top:-10px;color:var(--anime-blue);--tilt:0deg}
.anime-notebook-planet{width:72px;height:72px;right:6%;top:-55px;--tilt:-8deg}
.anime-notebook-bow{width:36px;height:36px;right:-35px;top:-22px;--tilt:16deg}
.anime-index-cat{width:37px;height:37px;right:125px;top:0;--tilt:8deg;color:#c1a6ff}
.anime-work-mark{width:24px;height:24px;left:-33px;top:calc(50% - 12px);--tilt:-14deg}
.work-row:nth-child(even) .anime-work-mark{color:var(--anime-blue);--tilt:14deg}
.anime-chill-wings{width:70px;height:70px;left:37%;top:-24px;--tilt:-9deg;color:var(--anime-blue)}
.anime-footer-heart{width:20px;height:20px;left:110px;top:20px;--tilt:12deg}
/* Isolated stage layer is below its z=5 blackout. Notebook gets its own clipped layer. */
.anime-festival{position:absolute;inset:0;overflow:hidden;pointer-events:none!important;z-index:3;contain:layout paint}
.anime-festival *{pointer-events:none!important}
.reading{position:relative;isolation:isolate}
.anime-festival-reading{z-index:0}
.reading>*:not(.anime-festival){position:relative;z-index:1}
.anime-festival-sprite{width:var(--size,28px);height:var(--size,28px);animation-name:anime-festival-drift}
.anime-festival-comet{width:67px;height:67px;color:var(--anime-blue);animation:anime-comet calc(var(--anime-duration) * 1.4) ease-out var(--phase,0s) infinite;filter:drop-shadow(0 0 2px currentColor)}
.anime-cursor-spark{width:19px;height:19px;filter:drop-shadow(0 0 2px currentColor)}
@keyframes anime-drift{from{transform:translate(calc(var(--anime-look-x) * .3),calc(var(--anime-look-y) * .3)) rotate(var(--tilt,-10deg))}to{transform:translate(calc(var(--anime-look-x) * .3),calc(var(--anime-look-y) * .3 - var(--anime-drift) * .4)) rotate(calc(var(--tilt,-10deg) + 7deg))}}
@keyframes anime-festival-drift{from{transform:translate(var(--anime-look-x),var(--anime-look-y)) rotate(var(--tilt,-10deg))}to{transform:translate(calc(var(--anime-look-x) + var(--anime-drift) * var(--sway,1)),calc(var(--anime-look-y) - var(--anime-drift) * 1.4)) rotate(calc(var(--tilt,-10deg) + 22deg))}}
@keyframes anime-twinkle{from{opacity:.55;transform:scale(.86)}to{opacity:1;transform:scale(1.08)}}
@keyframes anime-flutter{from{opacity:.72;transform:scaleX(.62) rotate(-8deg)}to{opacity:1;transform:scaleX(1.06) rotate(8deg)}}
@keyframes anime-comet{0%,10%{opacity:0;transform:translate(-65px,55px) scale(.65)}18%{opacity:var(--mark-opacity)}45%{opacity:0;transform:translate(65px,-75px) scale(1.05)}100%{opacity:0;transform:translate(65px,-75px) scale(1.05)}}
/* No animation work for hidden chapters/sections or a hidden document. */
.chapter:not(.active) .site-anime-mark,.chapter:not(.active) .site-anime-mark svg,.anime-out-of-view .site-anime-mark,.anime-out-of-view .site-anime-mark svg,.anime-document-paused .site-anime-mark,.anime-document-paused .site-anime-mark svg{animation-play-state:paused!important}
.software-chapter:not(.active) .site-anime-mark,.software-chapter:not(.active) .site-anime-mark svg{animation-play-state:paused!important}
.anime-takeover-paused .site-anime-mark,.anime-takeover-paused .site-anime-mark svg{animation-play-state:paused!important}
/* Static SVG cursors keep a native fallback and never replace link/drag/slider affordances. */
body.anime-cursor-on,body.anime-cursor-on #anime-cat-takeover{cursor:var(--anime-cursor),auto}
body.anime-cursor-on #geometry{cursor:var(--anime-cursor),crosshair!important}
body.anime-cursor-on #geometry[style*="grabbing"]{cursor:grabbing!important}
body.anime-cursor-on #geometry[style*="pointer"]{cursor:pointer!important}
body.anime-cursor-on #software-geometry{cursor:var(--anime-cursor),crosshair!important}
body.anime-cursor-on #software-geometry[style*="grabbing"]{cursor:grabbing!important}
body.anime-cursor-on #software-geometry[style*="pointer"]{cursor:pointer!important}
body.anime-cursor-on a,body.anime-cursor-on button,body.anime-cursor-on select{cursor:pointer}
.anime-motion-reduced .site-anime-mark,.anime-motion-reduced .site-anime-mark svg{animation:none!important;transform:rotate(var(--tilt,0deg))}
.anime-motion-reduced .anime-festival-comet{opacity:var(--mark-opacity)}
/* Space for the ordinary 190×64 bottom-right energy slider. */
.caption .playful{margin-right:0}
.coordinate{margin-right:205px}
.reading footer,.reading .next{padding-right:205px}
@media(min-width:1051px) and (max-height:800px){.anime-title-top{width:40px;height:40px;top:-22px}.anime-title-side{width:31px;height:31px}.anime-margin-moon{width:26px;height:26px;left:-43px}.coordinate{margin-right:205px;font-size:7px}.anime-festival-sprite{width:calc(var(--size,28px) * .8);height:calc(var(--size,28px) * .8)}}
@media(max-width:1050px){.anime-title-side{right:0}.anime-festival-sprite{max-width:30px;max-height:30px}.anime-notebook-planet{right:2%;width:48px;height:48px}.anime-margin-moon{left:-23px;width:20px}.anime-copy-mark{left:-25px;width:18px}.reading footer,.reading .next{padding-right:205px}}
@media(max-width:650px){.anime-festival-stage .anime-festival-sprite:nth-child(n+9){display:none}.anime-title-top{width:32px;height:32px;top:-19px}.anime-notebook-bow,.anime-index-cat{display:none}.anime-work-mark{left:auto;right:0;top:-16px}.reading footer,.reading .next{padding-right:0;padding-bottom:72px}.anime-chill-wings{left:70%;width:48px}.anime-festival-comet{width:38px;height:38px}}
@media(prefers-reduced-motion:reduce){.site-anime-mark,.site-anime-mark svg{animation:none!important;transform:rotate(var(--tilt,0deg))}.anime-festival-comet{opacity:var(--mark-opacity)}.anime-cursor-spark{display:none!important}}
/* Anime energy v2: drawn cels, held poses and composed edge action. */
.site-anime-mark{filter:none;animation:anime-cel-breathe var(--anime-duration) steps(2,end) var(--phase,0s) infinite}
.site-anime-mark svg{animation:none;stroke-width:1.5}
.site-anime-mark[data-motif="butterfly"] svg,.site-anime-mark[data-motif="wings"] svg{animation:none}
.anime-title-top{width:35px;height:35px;top:-24px;left:15px}
.anime-title-side{width:24px;height:24px;right:3%;top:75%}
.anime-copy-mark{width:19px;height:19px;left:-28px}
.anime-nav-heart{width:16px;height:16px}
.anime-festival-sprite{animation:anime-cel-pop calc(var(--anime-duration) * 1.1) steps(1,end) var(--phase,0s) infinite}
.anime-festival-sprite[data-motif="petal"]{animation:anime-petal-tumble calc(var(--anime-duration) * 1.7) linear var(--phase,0s) infinite}
.anime-familiar{width:90px!important;height:120px!important;right:-28px;top:40%;color:var(--anime-blue);transform-origin:85% 85%;animation:anime-familiar-peek 9s linear infinite;--tilt:0deg;filter:none}
.anime-familiar svg{stroke-width:1.5;animation:none!important}
.familiar-eye-bright,.familiar-eye-star,.familiar-mouth-joy,.familiar-emote{display:none}
.familiar-eyes{transform-box:fill-box;transform-origin:center;animation:anime-cel-blink 6.8s steps(1,end) infinite}
.familiar-ribbons{transform-origin:75px 107px;animation:anime-ribbon-hold 4s steps(2,end) infinite}
.familiar-wave{transform-origin:101px 114px}
.anime-manga-burst{width:67px;height:134px;right:1%;top:36%;color:#b5ced5;animation:anime-speed-cut 6.7s steps(1,end) infinite;z-index:0}
.anime-manga-corner{width:130px;height:70px;left:0;bottom:16%;color:#c4acd8;animation:anime-panel-cut 8s steps(1,end) infinite;transform-origin:left bottom}
body[data-anime-band="quiet"] .site-anime-mark,body[data-anime-band="quiet"] .site-anime-mark *{animation:none!important}
body[data-anime-band="curious"] .familiar-ribbons{animation:none}
body[data-anime-band="awake"] .anime-familiar{width:108px!important;height:144px!important;right:-20px;animation-duration:6.8s}
body[data-anime-band="awake"] .familiar-eye-calm,body[data-anime-band="festival"] .familiar-eye-calm{display:none}
body[data-anime-band="awake"] .familiar-eye-bright{display:inline}
body[data-anime-band="festival"] .familiar-eye-star,body[data-anime-band="festival"] .familiar-mouth-joy,body[data-anime-band="festival"] .familiar-emote{display:inline}
body[data-anime-band="festival"] .familiar-mouth-calm{display:none}
body[data-anime-band="festival"] .anime-familiar{width:126px!important;height:168px!important;right:-12px;animation:anime-familiar-bounce 5.8s linear infinite}
body[data-anime-band="festival"] .familiar-wave{animation:anime-wave-cut 3.9s steps(2,end) infinite}
body[data-anime-band="festival"] .familiar-emote{animation:anime-emote-cut 5.8s steps(1,end) infinite}
body[data-anime-band="festival"] .anime-festival-sprite{filter:drop-shadow(0 0 1px currentColor)}
@keyframes anime-cel-breathe{0%,69%,100%{transform:rotate(var(--tilt,-10deg))}72%,83%{transform:translateY(-3px) rotate(calc(var(--tilt,-10deg) + 5deg))}}
@keyframes anime-cel-pop{0%,50%,100%{transform:scale(.78) rotate(var(--tilt,-10deg));opacity:calc(var(--mark-opacity) * .65)}54%,68%{transform:scale(1.1) rotate(calc(var(--tilt,-10deg) + 10deg));opacity:var(--mark-opacity)}72%,84%{transform:scale(.92) rotate(var(--tilt,-10deg));opacity:var(--mark-opacity)}}
@keyframes anime-petal-tumble{0%{transform:translate(-15px,0) rotate(-30deg)}50%{transform:translate(15px,-8px) rotate(60deg)}100%{transform:translate(-15px,0) rotate(150deg)}}
@keyframes anime-familiar-peek{0%,55%,100%{transform:translate(10px,0) rotate(0deg)}60%,78%{transform:translate(-3px,-4px) rotate(-5deg)}80%,87%{transform:translate(0,-2px) rotate(-2deg)}}
@keyframes anime-familiar-bounce{0%,48%,100%{transform:translate(0,0) rotate(-3deg)}51%{transform:translate(6px,5px) rotate(4deg)}54%,63%{transform:translate(-6px,-15px) rotate(-7deg)}66%{transform:translate(0,3px) rotate(1deg)}70%,86%{transform:translate(0,0) rotate(-3deg)}}
@keyframes anime-cel-blink{0%,91%,96%,100%{transform:scaleY(1)}92%,95%{transform:scaleY(.09)}}
@keyframes anime-ribbon-hold{0%,50%,100%{transform:rotate(-4deg)}55%,80%{transform:rotate(5deg)}}
@keyframes anime-wave-cut{0%,48%,100%{transform:rotate(0deg)}52%,61%,78%,87%{transform:rotate(-13deg)}65%,73%,91%,96%{transform:rotate(10deg)}}
@keyframes anime-emote-cut{0%,50%,89%,100%{opacity:0;transform:translateY(3px)}54%,85%{opacity:1;transform:translateY(0)}}
@keyframes anime-speed-cut{0%,48%,70%,100%{opacity:0;transform:translateX(12px)}52%,58%{opacity:var(--mark-opacity);transform:translateX(0)}62%,66%{opacity:calc(var(--mark-opacity) * .4);transform:translateX(-5px)}}
@keyframes anime-panel-cut{0%,60%,100%{transform:translateX(-10px);opacity:calc(var(--mark-opacity) * .65)}64%,83%{transform:translateX(0);opacity:var(--mark-opacity)}}
/* All nested cel animation shares the same lifecycle as the stage. */
.anime-document-paused .site-anime-mark,.anime-document-paused .site-anime-mark *,
.anime-takeover-paused .site-anime-mark,.anime-takeover-paused .site-anime-mark *,
.anime-library-paused .site-anime-mark,.anime-library-paused .site-anime-mark *,
.anime-out-of-view .site-anime-mark,.anime-out-of-view .site-anime-mark *,
.chapter:not(.active) .site-anime-mark *,
.software-chapter:not(.active) .site-anime-mark *,
.closing-chapter:not(.active) .site-anime-mark *,
.intro-beat:not(.active) .site-anime-mark *,
.overview-beat:not(.active) .site-anime-mark *,
.company-model-beat:not(.active) .site-anime-mark *,
.atelier-sequence-beat:not(.active) .site-anime-mark *,
.roadmap-sequence-beat:not(.active) .site-anime-mark *{animation-play-state:paused!important}
.anime-motion-reduced .site-anime-mark,.anime-motion-reduced .site-anime-mark *{animation:none!important}
.anime-motion-reduced .anime-familiar{transform:rotate(-3deg)}
.anime-motion-reduced .anime-manga-burst{opacity:calc(var(--mark-opacity) * .4)}
@media(prefers-reduced-motion:reduce){.site-anime-mark,.site-anime-mark *{animation:none!important}.anime-familiar{transform:rotate(-3deg)}.anime-manga-burst{opacity:calc(var(--mark-opacity) * .4)}}
/* A small original mechanical cel: angular painted planes, inking and register marks. */
.anime-mecha-cel{width:118px;height:74px;right:1.5%;top:18%;--tilt:-5deg;animation:anime-mecha-pass 9.4s linear infinite;filter:none}
.anime-cel-swatch{width:27px;height:100px;left:0;top:38%;--tilt:0deg;animation:none;opacity:calc(var(--mark-opacity) * .7)}
body[data-anime-band="festival"] .anime-mecha-cel{width:145px;height:91px}
.mecha-registration{opacity:.5}
@keyframes anime-mecha-pass{0%,45%,100%{transform:translate(7px,5px) rotate(-5deg)}49%{transform:translate(12px,7px) rotate(-7deg)}53%,69%{transform:translate(-6px,-7px) rotate(2deg)}74%,89%{transform:translate(0,0) rotate(-2deg)}}
.anime-paper-courier{width:70px;height:30px;left:25%;top:83%;--tilt:-4deg;animation:anime-courier-flight 10.3s linear infinite;color:#c9cedd}
.familiar-person{transform:translate(calc(var(--anime-look-x) * .12),calc(var(--anime-look-y) * .12))}
@keyframes anime-courier-flight{0%,42%,100%{transform:translate(0,0) rotate(-4deg)}47%{transform:translate(-5px,3px) rotate(-9deg)}54%,71%{transform:translate(26px,-8px) rotate(3deg)}78%,88%{transform:translate(8px,-1px) rotate(-1deg)}}
:is(.closing-chapter,.intro-beat,.overview-beat,.company-model-beat,.atelier-sequence-beat,.roadmap-sequence-beat):not(.active) .site-anime-mark,
:is(.closing-chapter,.intro-beat,.overview-beat,.company-model-beat,.atelier-sequence-beat,.roadmap-sequence-beat):not(.active) .site-anime-mark *,
:is(.stage,.software-stage,.closing-stage)[inert] .site-anime-mark,
:is(.stage,.software-stage,.closing-stage)[inert] .site-anime-mark *{animation-play-state:paused!important}
.chapter[data-step="0"] .anime-title-side{width:24px;height:24px;right:-4px;top:80%}
/* Input surfaces have priority over peripheral performances. Left accents remain. */
.closing-stage[data-scene="contact"] :is(.anime-familiar,.anime-mecha-cel,.anime-manga-burst,.anime-festival-sprite){display:none!important}
/* Framework labels occupy the right middle; the cameo settles below them. */
.closing-stage[data-scene="atelier"] .anime-familiar{top:auto;bottom:14%;width:108px!important;height:144px!important}

/* The source/code comparison uses the outer-right area for inspectable terms. */
.software-stage[data-function="contracts"] .anime-familiar{display:none!important}