/* A quieter night palette, with the same playful purple identity. */
html{color-scheme:light;scroll-padding-top:0}
html[data-theme=dark]{color-scheme:dark;--ink:#f1eaf9;--muted:#bcb0ca;--plum:#c4a2f2;--purple:#c4a2f2;--line:#40344f;--brand-ink:#f1eaf9;--brand-purple:#c4a2f2;--edge:#40344f;background:#14111c}
.hero .hero-copy h1{margin-bottom:5px}
.hero-subtitle{font-family:Outfit,sans-serif;font-size:clamp(30px,3.3vw,49px);line-height:1.15;letter-spacing:-.035em;color:#756381;margin:0 0 28px}
.hero-mascot{border:0;padding:0;background:none;pointer-events:auto;cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:42%;touch-action:manipulation;outline-offset:9px}
.hero-mascot img,.hero-mascot canvas,.mascot-shades{pointer-events:none}
.hero-mascot:focus-visible{outline:3px solid #9363cd}
.hero-mascot:active .mascot-shades{scale:.98}
.mascot-shades{position:absolute;inset:0;width:100%;height:100%;z-index:2;opacity:0;transform:translate3d(0,-30%,0) rotate(-14deg) scale(.94);transform-origin:50% 70%;filter:drop-shadow(0 4px 2px #08071133)}
.theme-ready .mascot-shades{transition:transform .44s cubic-bezier(.2,.85,.2,1.12),opacity .2s ease,scale .12s ease}
[data-theme=dark] .mascot-shades{opacity:1;transform:translate3d(0,0,0) rotate(0) scale(1)}
.theme-hint{position:absolute;bottom:8px;left:50%;translate:-50% 0;white-space:nowrap;font-size:11px;font-weight:500;letter-spacing:.02em;color:#756381;pointer-events:none;z-index:5}
.mascot-orbit{margin-bottom:16px}
.theme-ready body,.theme-ready .nav-cta,.theme-ready .compatibility,.theme-ready .vision-demo,.theme-ready .signup-card,.theme-ready .signup-section,.theme-ready .questions details,.theme-ready .overview-toolbar,.theme-ready .overview-player{transition:background-color .32s ease,color .24s ease,border-color .32s ease,box-shadow .32s ease,transform .28s ease}
[data-theme=dark] body{background:radial-gradient(ellipse 65% 560px at 85% 270px,#43285b66,transparent),#14111c;color:var(--ink)}
[data-theme=dark] .hero h1 em{color:#c4a2f2;text-shadow:0 4px 0 #3d2952}
[data-theme=dark] .hero-subtitle{color:#b9a5d0}
[data-theme=dark] .hero-kicker,[data-theme=dark] .eyebrow{color:#bea0de}
[data-theme=dark] .hero-kicker span{background:#c5a1ef;box-shadow:0 0 0 5px #362844}
[data-theme=dark] .intro,[data-theme=dark] .caption,[data-theme=dark] .hero-actions .caption span,[data-theme=dark] .connection-copy p,[data-theme=dark] .workflow-footnote,[data-theme=dark] .signup p,[data-theme=dark] .signature,[data-theme=dark] .questions p,[data-theme=dark] .platform-note,[data-theme=dark] .privacy-note,[data-theme=dark] .footer>span{color:#bfb3cc}
[data-theme=dark] .nav-cta{background:#282033;border-color:#59436f;box-shadow:0 4px 0 #0c0912}
[data-theme=dark] .button{color:#fff;background:linear-gradient(180deg,#8b60b9,#674091);border-color:#b28bd25e;box-shadow:0 4px 0 #38214e,0 12px 28px #05030a44}
[data-theme=dark] .button:hover{background:linear-gradient(180deg,#a074cd,#7950a8);box-shadow:0 6px 0 #38214e,0 16px 28px #05030a55}
[data-theme=dark] .button:active{box-shadow:0 1px 0 #38214e}
[data-theme=dark] .hero-mascot{filter:drop-shadow(0 20px 30px #9b61e533)}
[data-theme=dark] .orbit-ring{border-color:#a97ad52b}
[data-theme=dark] .orbit-label{background:linear-gradient(150deg,#3b2d4a,#271e35);border-color:#665079;color:#e9dcf8;box-shadow:0 5px 0 #17101f,0 12px 24px #05030833}
[data-theme=dark] .theme-hint,[data-theme=dark] .mascot-job,[data-theme=dark] .mascot-orbit>.job-arrow{color:#b79acb}
[data-theme=dark] .vision-demo,[data-theme=dark] .signup-card{background:linear-gradient(145deg,#30243d,#211b2b);border-color:#554163;box-shadow:0 7px 0 #100c17,0 25px 55px #08060d33}
[data-theme=dark] .vision-demo:before,[data-theme=dark] .signup-card:before{background:radial-gradient(230px circle at var(--light-x,50%) var(--light-y,0%),#a06bd322,transparent 75%)}
[data-theme=dark] .vision-heading,[data-theme=dark] .demo-tag,[data-theme=dark] .brief-bottom{color:#b9a5ca}
[data-theme=dark] .brief-bottom{border-color:#493652}
[data-theme=dark] .brief-copy:hover{background:#b88cde0d;box-shadow:inset 0 1px 0 #ffffff0d,0 3px 0 #09060d33}
[data-theme=dark] .brief-examples button{color:#c2b0d1}
[data-theme=dark] .brief-examples button:hover{background:#30223e;box-shadow:0 4px 0 #0d0913}
[data-theme=dark] .brief-examples button[aria-pressed=true]{background:#372744;border-color:#614676;color:#ead8ff}
[data-theme=dark] .compatibility{background:linear-gradient(120deg,#251e30,#211a2d);border-color:#493653;box-shadow:0 6px 0 #0e0b14}
[data-theme=dark] .overview-player{background:#17121e;border-color:#4b365f;box-shadow:0 8px 0 #0d0912,0 26px 70px #05030933}
[data-theme=dark] .overview-toolbar{background:#2c2039;border-color:#50385f}
[data-theme=dark] .overview-toolbar button{background:#443051;border-color:#76558e;color:#f0e4ff}
[data-theme=dark] .scrub-caption,[data-theme=dark] .workflow-scrubber output{color:#dfcaef}
[data-theme=dark] #overview-scrub{border-color:#76558e;background:linear-gradient(to right,#bc91e9 0%,#bc91e9 var(--progress,0%),#50375e var(--progress,0%),#50375e 100%)}
[data-theme=dark] .workflow-footnote a{color:#c6a4ec}
[data-theme=dark] .signup-section{background:radial-gradient(ellipse at 15% 30%,#48305a55,transparent 65%),#1c1525;border-color:#44304f}
[data-theme=dark] .purchase-price,[data-theme=dark] .signup-card h3{color:#f1eaf9}
[data-theme=dark] .questions details{background:#241c2d;border-color:#493653}
[data-theme=dark] .questions details[open]{background:#2c2037;box-shadow:0 8px 24px #0002}
[data-theme=dark] .footer{border-color:#44334f}
[data-theme=dark] .reactive-word:hover,[data-theme=dark] .hero h1 .reactive-word:hover{color:#dac0fc;text-shadow:0 3px 0 #463255,0 7px 14px #0002}
[data-theme=dark] :focus-visible{outline-color:#d1aaff}
@media(max-width:760px){.hero-subtitle{font-size:36px;margin-bottom:22px}.theme-hint{bottom:0;font-size:10px}.mascot-orbit{margin-bottom:20px}}
@media(prefers-reduced-motion:reduce){.theme-ready .mascot-shades,.theme-ready body,.theme-ready .nav-cta,.theme-ready .compatibility,.theme-ready .vision-demo,.theme-ready .signup-card,.theme-ready .signup-section,.theme-ready .questions details,.theme-ready .overview-toolbar,.theme-ready .overview-player{transition:none!important}.mascot-shades{transform:none}.hero-mascot{animation:none!important}}
[data-theme=dark] .hero .hero-copy .intro{color:#bfb3cc}
/* Keep broad surfaces interpolable instead of swapping opaque gradients. */
.vision-demo,.signup-card{background:linear-gradient(145deg,#ffffff0d,transparent),#fcf9fe}
[data-theme=dark] .vision-demo,[data-theme=dark] .signup-card{background:linear-gradient(145deg,#ffffff0d,transparent),#251e30}
.compatibility{background:linear-gradient(120deg,#ffffff20,transparent),#f1ebf7}
[data-theme=dark] .compatibility{background:linear-gradient(120deg,#ffffff04,transparent),#211a2d}
.signup .signup-card .purchase-price{font-size:38px;line-height:1.2;max-width:none;color:var(--ink)}
/* Native snapping preserves free scrolling inside sections taller than the screen. */
html{scroll-snap-type:y proximity;scroll-padding-top:24px}
#home,main>section,.footer{scroll-snap-align:start;scroll-snap-stop:normal}
.hero{scroll-margin-top:112px}
.hero-actions .caption{max-width:370px;line-height:1.6}
/* Keep the hit area still while the artwork floats; decorative layers never intercept taps. */
.hero-mascot{animation:none;isolation:isolate;transform:none;z-index:5}
.hero-mascot img,.hero-mascot canvas,.hero-mascot .mascot-shades{animation:mascot-art-float 6s ease-in-out infinite}
.mascot-orbit{transform:none;transform-style:flat}
.orbit-label{pointer-events:none}
@keyframes mascot-art-float{0%,100%{translate:0 0;rotate:-3deg}50%{translate:0 -12px;rotate:2deg}}
[data-theme=dark] .compatibility .connection-copy h2{color:#f2e7ff}
.overview-toolbar #overview-play{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:10px;border-radius:50%}
#overview-play svg{width:22px;height:22px;fill:currentColor}
#overview-play .pause-icon,#overview-play[data-playing=true] .play-icon{display:none}
#overview-play[data-playing=true] .pause-icon{display:block}
.workflow-footnote{justify-content:flex-end}
.signup .maker-quote{margin:0;position:relative;padding-top:40px;max-width:580px}
.maker-quote:before{content:'“';position:absolute;top:-36px;left:-6px;font:120px Georgia,serif;color:var(--plum);opacity:.45}
.signup .maker-quote p{font-family:Outfit,sans-serif;font-size:clamp(23px,2.5vw,35px);line-height:1.35;letter-spacing:-.025em;color:var(--ink);max-width:none;margin:0 0 22px}
.signup .maker-quote p+p{font-size:clamp(19px,1.8vw,26px);line-height:1.5;color:var(--muted,#756381)}
.maker-quote em{font-style:normal;color:var(--plum)}
.brief-copy{overflow:hidden;min-height:160px}
.brief-word{display:inline-block;will-change:auto}
.is-entering .brief-word{animation:brief-word-in .45s cubic-bezier(.18,.8,.25,1) both;animation-delay:var(--word-delay)}
.is-leaving .brief-word{animation:brief-word-out .22s ease-in both;animation-delay:calc(var(--word-delay) * .3)}
#brief-rotation{min-width:36px;min-height:36px;padding:8px;font-size:12px}
@keyframes brief-word-in{from{opacity:0;transform:translateY(-20px) rotate(-4deg)}to{opacity:1;transform:translateY(0) rotate(0)}}
@keyframes brief-word-out{to{opacity:0;transform:translateY(25px) rotate(5deg)}}
@media(max-width:760px){.hero{scroll-margin-top:86px}.hero-actions .caption{font-size:12px}.brief-copy{min-height:165px}.signup .maker-quote{padding-top:32px}.overview-heading h2{font-size:clamp(30px,7vw,39px)}}
@media(max-width:600px){.overview-toolbar{gap:10px;flex-wrap:nowrap}.workflow-scrubber{gap:9px}.overview-toolbar #overview-expand{padding:10px 8px;white-space:nowrap}.overview-toolbar #overview-play{flex-basis:40px;width:40px;height:40px}}
@media(prefers-reduced-motion:reduce){html{scroll-snap-type:none}.brief-word{opacity:1;transform:none}.hero-mascot img,.hero-mascot canvas,.hero-mascot .mascot-shades{animation:none}}
[data-theme=dark] .nav nav a{color:#d8c9e7}
[data-theme=dark] .nav nav a:hover{color:#f2e7ff}
.signup .signup-card .purchase-price{font-size:38px!important;line-height:1.2!important}