.demo-shell{--demo-ink:#e9efef;--demo-dim:#8d9797;--demo-line:#ffffff1a}.demo-intro-section{padding:58px 0 0;scroll-margin-top:24px}.demo-close-section{padding:46px 0 0;scroll-margin-top:24px}.demo-intro{text-align:center;gap:14px;max-width:760px;margin:0 auto;display:grid}.demo-title{color:var(--demo-ink);letter-spacing:-.03em;margin:0;font-size:clamp(34px,8vw,62px);line-height:1.02}.demo-title em{color:#69deef;font-style:normal}.demo-deck{color:var(--demo-dim);margin:0;font-size:clamp(15px,3.6vw,19px);line-height:1.55}.demo-theatre{max-width:1020px;margin:34px auto 0}.demo-frame{aspect-ratio:4/3;border:1px solid var(--demo-line);--demo-body:clamp(68px, 27cqh, 178px);--demo-floor:7cqh;--demo-rise:18cqh;--demo-mark:var(--demo-enter-from,-180px);--demo-lift:0px;--demo-wave-ms:1.4s;background:radial-gradient(120% 90% at 18% 8%,#69deef29,#0000 62%),radial-gradient(90% 70% at 88% 92%,#58809433,#0000 66%),linear-gradient(160deg,#10181c 0%,#080c0e 58%,#0a0f11 100%);border-radius:clamp(14px,2.4vw,26px);width:100%;position:relative;overflow:hidden;box-shadow:inset 0 1px #ffffff12,0 34px 90px #0009;container-type:size}@media (min-width:640px){.demo-frame{aspect-ratio:16/10}}.demo-frame[data-paused=true] *,.demo-frame[data-paused=true]:before,.demo-frame[data-paused=true]:after{animation-play-state:paused!important}.demo-screen{position:absolute;inset:0}.demo-menubar{background:#090d0f9e;border-bottom:1px solid #ffffff0f;align-items:center;gap:2cqw;height:7cqh;padding:0 2.6cqw;display:flex;position:absolute;top:0;left:0;right:0}.demo-menu-mark{background:#e9efef8c;border-radius:50%;width:1.5cqw;height:1.5cqw}.demo-menus,.demo-menu-clock{align-items:center;gap:1.4cqw;display:flex}.demo-menu-clock{margin-left:auto}.demo-menus i,.demo-menu-clock i{background:#e9efef38;border-radius:2px;height:1cqh;display:block}.demo-menus i:first-child{width:4cqw}.demo-menus i:nth-child(2){width:3cqw}.demo-menus i:nth-child(3){width:3.6cqw}.demo-menu-clock i:first-child{width:2.6cqw}.demo-menu-clock i:nth-child(2){width:4.4cqw}.demo-files{grid-template-rows:repeat(3,auto);grid-auto-flow:column;gap:3.4cqh 2.2cqw;display:grid;position:absolute;top:10cqh;right:2.4cqw}.demo-file{border-radius:1.2cqh 1.2cqh .8cqh .8cqh;width:5cqw;height:4.6cqh;display:block}.demo-file.is-folder{background:linear-gradient(#69deef57,#69deef24)}.demo-file.is-doc{background:#e9efef29;border-radius:.6cqh}.demo-window{background:#0c1113e6;border:1px solid #ffffff14;border-radius:1.6cqh;width:52cqw;padding:2.6cqh 3cqw;position:absolute;top:14cqh;bottom:24cqh;left:5cqw;overflow:hidden;box-shadow:0 18px 46px #00000080}.demo-traffic{gap:1cqw;display:flex}.demo-traffic i{background:#e9efef33;border-radius:50%;width:1.4cqw;height:1.4cqw;display:block}.demo-window-label{color:#69deefb8;letter-spacing:.18em;text-transform:uppercase;margin:2.4cqh 0 0;font-size:clamp(8px,1.7cqw,12px)}.demo-window-task{color:var(--demo-ink);margin:.8cqh 0 0;font-size:clamp(11px,2.6cqw,19px);line-height:1.25}.demo-doc-lines{gap:1.6cqh;margin-top:3cqh;display:grid}.demo-doc-lines i{background:#e9efef1a;border-radius:3px;height:1.1cqh;display:block}.demo-doc-lines i:nth-child(2){width:86%}.demo-doc-lines i:nth-child(3){width:92%}.demo-doc-lines i:nth-child(4){width:64%}.demo-feed{background:linear-gradient(#1a1416 0%,#120e10 100%);border:1px solid #ffffff1a;border-radius:1.8cqh;flex-direction:column;gap:2cqh;padding:2.4cqh 2.6cqw;display:flex;position:absolute;inset:9cqh 3cqw 13cqh 18cqw;overflow:hidden;transform:translate(112%);box-shadow:0 26px 70px #0000009e}.demo-feed-bar{align-items:center;gap:1.6cqw;display:flex}.demo-feed-bar i{background:#ffffff29;border-radius:3px;height:1.2cqh;display:block}.demo-feed-bar i:first-child{border-radius:50%;width:3cqw;height:3cqw}.demo-feed-bar i:nth-child(2){width:22cqw}.demo-feed-card{background:linear-gradient(#ffffff1c,#ffffff0a);border-radius:1.2cqh;flex:auto}.demo-feed-card.is-tall{flex-grow:2.6}.demo-feed-card.is-short{flex-grow:.7}.demo-feed-shade{opacity:0;border-radius:inherit;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#080c0db8;position:absolute;inset:0}.demo-frame[data-feed=in] .demo-feed,.demo-frame[data-feed=behind] .demo-feed{animation:.62s cubic-bezier(.2,.72,.18,1) both demo-feed-in}.demo-frame[data-feed=out] .demo-feed{animation:.64s cubic-bezier(.5,0,.72,.3) both demo-feed-out}.demo-frame[data-feed=behind] .demo-feed-shade{animation:.46s both demo-shade-in}@keyframes demo-feed-in{0%{transform:translate(112%)}to{transform:translate(0,0)}}@keyframes demo-feed-out{0%{transform:translate(0,0)}to{transform:translate(112%)}}@keyframes demo-shade-in{0%{opacity:0}to{opacity:1}}.demo-hud{z-index:6;background:#080c0ddb;border:1px solid #69deef3d;border-radius:999px;align-items:baseline;gap:1.6cqw;padding:1.2cqh 2.2cqw;display:flex;position:absolute;top:10cqh;left:5cqw}.demo-hud-clock{color:#69deef;font-variant-numeric:tabular-nums;letter-spacing:.04em;font-size:clamp(12px,2.6cqw,20px)}.demo-hud-note{color:var(--demo-dim);letter-spacing:.02em;font-size:clamp(8px,1.6cqw,12px)}.demo-hud[data-held=true] .demo-hud-clock{color:#e9efef99}.demo-walker,.demo-portrait,.demo-wave-layer{z-index:5;pointer-events:none;position:absolute}.demo-walker{bottom:calc(var(--demo-floor) - .4879 * var(--demo-body));width:calc(.8275 * var(--demo-body));height:calc(1.9516 * var(--demo-body));transform:translate3d(var(--demo-mark), calc(-1 * var(--demo-lift)), 0);filter:drop-shadow(0 3cqh 2.6cqh #00000080);left:0}.demo-portrait,.demo-wave-layer{bottom:calc(var(--demo-floor) - .0991 * var(--demo-body));left:calc(var(--demo-mark) - .1502 * var(--demo-body));width:calc(1.1798 * var(--demo-body));height:calc(1.1798 * var(--demo-body));filter:drop-shadow(0 3cqh 2.6cqh #00000080)}.demo-sprite{will-change:background-position;background-position:0 0;background-repeat:no-repeat;display:block;position:absolute;inset:0}.demo-sprite-walk{animation:sprite-eight var(--demo-walk-cycle,.72s) steps(8, jump-none) infinite;background-image:url(/stoiq-yeti-walk-safe.webp);background-size:800% 100%}.demo-sprite-climb{background-image:url(/stoiq-yeti-climb-safe.webp);background-size:800% 100%}.demo-frame[data-phase=climbing] .demo-sprite-climb{animation:1.12s steps(8,jump-none) both sprite-eight}.demo-frame[data-phase=checking] .demo-sprite-climb,.demo-frame[data-phase=grace] .demo-sprite-climb,.demo-frame[data-phase=holding] .demo-sprite-climb{background-position:100% 0}.demo-frame[data-phase=returning] .demo-sprite-climb{animation:.9s steps(8,jump-none) reverse both sprite-eight}.demo-wave-layer{animation:demo-wave var(--demo-wave-ms) step-end 1 both;background-image:url(/stoiq-yeti-wave-safe.webp);background-repeat:no-repeat;background-size:400% 100%;display:block}@keyframes demo-wave{0%{background-position:0 0}12%{background-position:33.3333% 0}22%{background-position:66.6667% 0}32%,66%{background-position:100% 0}78%{background-position:66.6667% 0}88%{background-position:33.3333% 0}to{background-position:0 0}}.demo-frame[data-phase=arriving] .demo-walker{animation:demo-enter var(--demo-enter-ms,2.4s) linear both}.demo-frame[data-phase=planting] .demo-walker{animation:demo-corner var(--demo-corner-ms,2.4s) linear both}.demo-frame[data-phase=climbing] .demo-walker{animation:1.15s cubic-bezier(.34,.1,.3,1) both demo-climb-rise}.demo-frame[data-phase=returning] .demo-walker{animation:.9s cubic-bezier(.5,0,.5,1) both demo-climb-drop}@keyframes demo-enter{0%{transform:translate3d(var(--demo-enter-from,-180px), 0, 0)}to{transform:translate3d(var(--demo-enter-to,60px), 0, 0)}}@keyframes demo-corner{0%{transform:translate3d(var(--demo-enter-to,60px), 0, 0)}to{transform:translate3d(var(--demo-corner-to,300px), 0, 0)}}@keyframes demo-climb-rise{0%{transform:translate3d(var(--demo-enter-to,60px), 0, 0)}to{transform:translate3d(var(--demo-enter-to,60px), calc(-1 * var(--demo-rise)), 0)}}@keyframes demo-climb-drop{0%{transform:translate3d(var(--demo-enter-to,60px), calc(-1 * var(--demo-rise)), 0)}to{transform:translate3d(var(--demo-enter-to,60px), 0, 0)}}.demo-frame[data-phase=greeting],.demo-frame[data-phase=focusing],.demo-frame[data-phase=drifting],.demo-frame[data-phase=climbing],.demo-frame[data-phase=checking],.demo-frame[data-phase=grace],.demo-frame[data-phase=holding],.demo-frame[data-phase=returning],.demo-frame[data-phase=completing],.demo-frame[data-phase=planting]{--demo-mark:var(--demo-enter-to,60px)}.demo-frame[data-phase=potting],.demo-frame[data-phase=grown],.demo-frame[data-phase=closing]{--demo-mark:var(--demo-corner-to,300px)}.demo-frame[data-phase=checking],.demo-frame[data-phase=grace],.demo-frame[data-phase=holding]{--demo-lift:var(--demo-rise)}.demo-plant{z-index:4;bottom:var(--demo-floor);left:calc(var(--demo-mark) + .66 * var(--demo-body));transform-origin:50% 100%;position:absolute}.demo-plant.is-seedling{width:calc(.1467 * .6167 * var(--demo-body));height:calc(.1467 * var(--demo-body));animation:.52s cubic-bezier(.2,1.3,.5,1) both demo-plant-in}.demo-plant.is-grown{width:calc(.2 * .5467 * var(--demo-body));height:calc(.2 * var(--demo-body));animation:.7s cubic-bezier(.2,.9,.3,1) both demo-plant-grow}@keyframes demo-plant-in{0%{transform:scale(.2)}to{transform:scale(1)}}@keyframes demo-plant-grow{0%{transform:scaleY(.73)scaleX(.88)}to{transform:scaleY(1)scaleX(1)}}.demo-bubble{bottom:calc(var(--demo-floor) + 1.04 * var(--demo-body) + var(--demo-lift));left:calc(var(--demo-mark) + .34 * var(--demo-body));z-index:8;background:#101516f0;border:1px solid #ffffff24;border-radius:16px 16px 16px 4px;gap:10px;width:max-content;max-width:min(74cqw,400px);padding:12px 14px 13px;animation:.26s cubic-bezier(.2,.8,.3,1) both demo-bubble-in;display:grid;position:absolute;box-shadow:inset 0 1px #ffffff14,0 22px 54px #0009}.demo-frame[data-phase=checking] .demo-bubble,.demo-frame[data-phase=grace] .demo-bubble,.demo-frame[data-phase=holding] .demo-bubble{right:4cqw;bottom:calc(var(--demo-floor) + .42 * var(--demo-body) + var(--demo-lift));left:calc(var(--demo-mark) + .62 * var(--demo-body));border-radius:16px 16px 16px 4px;width:auto;max-width:none}.demo-bubble-line{color:var(--demo-ink);text-wrap:pretty;margin:0;font-size:clamp(13px,1.15vw,15px);line-height:1.42}.demo-choices{flex-wrap:wrap;gap:8px;display:flex}.demo-choice{min-height:44px;color:var(--demo-ink);cursor:pointer;font:inherit;pointer-events:auto;background:#ffffff0d;border:1px solid #ffffff29;border-radius:999px;padding:0 14px;font-size:clamp(12px,1.05vw,14px);line-height:1;transition:border-color .16s,background-color .16s,transform .16s}.demo-choice:hover,.demo-choice:focus-visible{background:#69deef1f;border-color:#69deef80}.demo-choice:active{transform:translateY(1px)}.demo-choice.is-primary{color:#d8fbff;background:#69deef29;border-color:#69deef73}@keyframes demo-bubble-in{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.demo-underbar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;margin-top:14px;display:flex}.demo-underbar-note{color:var(--demo-dim);margin:0;font-size:13px;line-height:1.5}.demo-replay{min-height:44px;color:var(--demo-ink);cursor:pointer;font:inherit;background:0 0;border:1px solid #ffffff29;border-radius:999px;padding:0 18px;font-size:13px}.demo-replay:hover,.demo-replay:focus-visible{border-color:#69deef80}.demo-close{text-align:center;gap:16px;max-width:640px;margin:44px auto 0;display:grid}.demo-close h2{color:var(--demo-ink);letter-spacing:-.02em;margin:0;font-size:clamp(26px,5.4vw,40px);line-height:1.1}.demo-close h2 em{color:#69deef;font-style:normal}.demo-close p{color:var(--demo-dim);margin:0;font-size:clamp(14px,3.4vw,17px);line-height:1.6}.demo-close-actions{flex-wrap:wrap;justify-content:center;gap:14px;margin-top:6px;display:flex}.demo-terms{color:#8d9797cc;font-size:13px}.demo-storyboard{display:none}@media (prefers-reduced-motion:reduce){.demo-live{display:none}.demo-storyboard{gap:14px;max-width:760px;margin:0 auto;display:grid}}.demo-panel{border:1px solid var(--demo-line);background:#0c1113b3;border-radius:18px;grid-template-columns:78px 1fr;align-items:center;gap:16px;padding:16px;display:grid}.demo-panel-still{background:#ffffff08;border-radius:12px;width:78px;height:96px;position:relative;overflow:hidden}.demo-panel-still i{background-repeat:no-repeat;background-size:800% 100%;width:88px;height:208px;display:block;position:absolute;bottom:-34%;left:50%;transform:translate(-50%)}.demo-panel-still.is-walk i{background-image:url(/stoiq-yeti-walk-safe.webp);background-position:42.857% 0}.demo-panel-still.is-climb i{background-image:url(/stoiq-yeti-climb-safe.webp);background-position:71.428% 0}.demo-panel-still .companion-portrait{width:92px;position:absolute;bottom:2px;left:50%;transform:translate(-50%)}.demo-panel-plant{width:15px;height:24px;position:absolute;bottom:6px;right:6px}.demo-panel-line{color:var(--demo-ink);margin:0 0 6px;font-size:15px;line-height:1.4}.demo-panel-caption{color:var(--demo-dim);margin:0;font-size:13px;line-height:1.5}