/* V2: centered product films and an interactive collection. */
.motion-toggle{background:none;border:1px solid #63705b35;padding:9px 13px;border-radius:30px;font-size:10px;color:#64705d}.motion-toggle span{margin-left:9px}.scroll-story{height:580svh;--outro:0}.film-layer{opacity:calc(1 - var(--outro)*.85)}.film-layer video,.film-poster{object-position:50% 50%}.film-shade{background:linear-gradient(90deg,#f5f2e9aa,transparent 37%),linear-gradient(0deg,#f5f3eddd,transparent 22%)}.chapter-copy{top:auto;bottom:22%;max-width:28%;width:310px}.chapter-copy h2{font-size:clamp(36px,4vw,60px)}.chapter-copy>p{max-width:230px}.story-outro{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;flex-direction:column;text-align:center;opacity:0;pointer-events:none;transform:translateY(30px);transition:opacity .4s,transform .6s}.story-outro.visible{opacity:var(--outro);transform:none;pointer-events:auto}.story-outro h2{font:400 clamp(30px,4vw,56px)/1.55 LocalSerif,"Songti SC",serif;margin:20px}.story-outro h2 span{color:#7f8e70}.story-outro .text-link{margin-top:12px}.story-stage{background:#f5f3ed}.projects-section{background:#f5f3ed;padding-top:86px}.works-list{display:flex;flex-direction:column;gap:96px}.work-row{display:grid;grid-template-columns:minmax(0,1.44fr) minmax(0,1fr);gap:7%;align-items:center}.work-row.reverse{grid-template-columns:minmax(0,1fr) minmax(0,1.44fr)}.work-row.reverse .demo{grid-column:2;grid-row:1}.work-row.reverse .work-copy{grid-column:1;grid-row:1}.work-copy h3{font:400 clamp(37px,4vw,56px)/1.2 LocalSerif,Georgia,serif;letter-spacing:-.055em;margin:19px 0}.work-tagline{font-size:19px;line-height:1.6;letter-spacing:-.04em}.work-description{font-size:12px;line-height:2.2;color:#7c8173;margin-top:21px;max-width:330px}.feature-tags{display:flex;gap:7px;flex-wrap:wrap;margin-top:24px}.feature-tags span{font-size:9px;color:#7b8370;border:1px solid #d6d9cd;border-radius:30px;padding:6px 9px}.work-copy .text-link{margin-top:27px}.collection-note{font-size:10px;color:#8a907e;text-align:center;margin-top:80px;line-height:1.8}.demo{height:450px;position:relative;overflow:hidden;border-radius:18px;border:1px solid #535e3810;background:#e8ece0;isolation:isolate}.demo-top,.demo-bottom{position:absolute;left:26px;right:26px;display:flex;align-items:center;justify-content:space-between;z-index:3;gap:12px}.demo-top{top:24px;font-size:8px;letter-spacing:.1em;color:#77806d}.demo-badge{border:1px solid #64705b30;border-radius:30px;padding:5px 9px;white-space:nowrap;font-size:8px;letter-spacing:.03em}.demo-bottom{bottom:22px;font-size:10px;color:#78846c}.demo-bottom>span{line-height:1.8;max-width:60%}.demo-action{display:flex;gap:11px;align-items:center;padding:10px 14px;background:#fafbf3cf;border:1px solid #7a866338;border-radius:30px;font-size:10px;white-space:nowrap;box-shadow:0 3px 12px #53644b06;transition:background .2s,transform .2s}.demo-action:hover{background:#fffef8;transform:translateY(-2px)}.demo-action:active{transform:translateY(0)}
.demo-furry{background:radial-gradient(ellipse at 50% 38%,#f2f1dc,#e0e7d6 80%)}.world-scene{position:absolute;inset:0;display:grid;place-items:center}.world-halo{width:240px;height:240px;border:1px solid #bec9ae6b;border-radius:50%;position:absolute;top:70px;left:calc(50% - 120px)}.world-halo:after{content:"";position:absolute;inset:20px;border:1px solid #bdc9ae3b;border-radius:50%}.world-scene .mini-island{transform:scale(1.3);margin-top:40px;animation:island-breathe 8s ease-in-out infinite}.tiny-echo{position:absolute;left:76px;bottom:29px;width:64px;height:94px;z-index:4;transform-origin:50% 100%;filter:drop-shadow(0 5px 3px #34452929)}.tiny-echo img{height:100%;width:100%;object-fit:contain}.tiny-echo.jumping{animation:echo-jump 1.15s cubic-bezier(.3,.05,.5,1) both}.landing-ring{position:absolute;left:77px;bottom:26px;width:65px;height:22px;border:2px solid #e5c678;border-radius:50%;opacity:0;z-index:3}.landing-ring.ripple{animation:land-ripple 1.15s ease-out both}.firefly{position:absolute;width:4px;height:4px;border-radius:50%;background:#fff5b5;box-shadow:0 0 12px #f4d374;animation:firefly-float 5s ease-in-out infinite;z-index:5}.f1{left:35px;top:35px}.f2{right:16px;top:65px;animation-delay:-2s}.f3{left:105px;top:-15px;animation-delay:-3s}.world-cloud{position:absolute;width:64px;height:15px;border-radius:50%;background:#fffdfa9c;filter:blur(3px);animation:cloud-drift 9s ease-in-out infinite}.cloud-a{top:126px;left:14%}.cloud-b{top:167px;right:12%;width:47px;animation-delay:-4s}@keyframes island-breathe{50%{transform:scale(1.3) translateY(-5px)}}@keyframes echo-jump{0%,100%{transform:translateY(0) scale(1,1)}15%{transform:scale(1.1,.9)}48%{transform:translateY(-42px) rotate(-7deg) scale(.97,1.03)}78%{transform:translateY(0) scale(1.09,.91)}}@keyframes land-ripple{0%,65%{opacity:0;transform:scale(.6)}80%{opacity:.85}100%{opacity:0;transform:scale(1.9)}}@keyframes firefly-float{50%{transform:translate(7px,-10px);opacity:.4}}@keyframes cloud-drift{50%{transform:translateX(16px)}}
.demo-term{background:radial-gradient(ellipse at 40% 40%,#e9e8e0,#d9dcd3)}.term-window{position:absolute;top:88px;left:8%;width:84%;height:269px;background:#28332e;border:1px solid #3f4b42;border-radius:12px;box-shadow:0 26px 45px -18px #32483865,0 6px 0 #a7b1a15c;transform:perspective(900px) rotateY(-6deg) rotateX(3deg);color:#dae3d4;overflow:hidden}.window-bar{height:40px;border-bottom:1px solid #a3b49b17;display:flex;align-items:center;gap:15px;padding:0 15px;color:#91a28c;font-size:9px}.window-bar>span{display:flex;gap:4px}.window-bar i{width:5px;height:5px;background:#7b8874;border-radius:50%}.window-bar b{font-size:9px;font-weight:400}.window-bar small{margin-left:auto;font-size:8px}.term-content{padding:20px}.term-block{display:flex;align-items:center;gap:8px;font-size:12px;min-height:18px}.term-prompt{color:#b2cc95}.term-block code{white-space:pre;font-family:ui-monospace,SFMono-Regular,monospace;font-size:11px}.type-caret{width:5px;height:12px;background:#bdcb9e;animation:caret-blink 1s step-end infinite}.term-output{display:flex;align-items:flex-start;gap:10px;margin-top:19px;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}.term-output.visible,.term-ai.visible{opacity:1;transform:none}.term-success{color:#b4d99c}.term-output b{font-size:11px;font-weight:400}.term-output p{font:8px ui-monospace,monospace;color:#8e9d87;margin-top:6px}.term-ai{display:flex;gap:10px;border:1px solid #afc49b22;background:#abbf9210;border-radius:7px;padding:11px;margin-top:17px;font-size:10px;line-height:1.7;opacity:0;transform:translateY(6px);transition:opacity .4s,transform .4s}.term-ai img{width:25px;object-fit:contain;filter:brightness(1.7);opacity:.85}.term-ai small{font-size:9px;color:#a0b394}.term-footer{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;padding:8px 15px;border-top:1px solid #a3b49b17;font-size:6px;letter-spacing:.12em;color:#819779}.term-footer i{display:inline-block;width:4px;height:4px;background:#b2c691;border-radius:50%;margin-right:4px}@keyframes caret-blink{50%{opacity:0}}
.demo-cost{background:radial-gradient(ellipse at 55% 40%,#eef4e9,#dee9df)}.cost-dashboard{position:absolute;top:78px;left:13%;width:74%;height:287px;background:#fafbf6;border:1px solid #dae3d4;border-radius:15px;padding:23px;box-shadow:0 23px 40px -20px #49674744;transform:rotate(-3deg)}.cost-dashboard-top{display:flex;align-items:center;justify-content:space-between}.cost-dashboard-top small{font-size:9px;color:#8a9482}.cost-dashboard-top h4{font:400 30px/1.2 LocalSerif,Georgia,serif;letter-spacing:-.04em;margin:8px 0 0}.cost-dashboard-top h4 em{font-size:15px;color:#a0a992;font-style:normal}.cost-seal{display:grid;place-items:center;width:38px;height:38px;background:#dce8d4;border-radius:50%;font:italic 23px Georgia;color:#798d6b}.chart{display:flex;gap:12px;height:88px;margin:22px 0 32px;align-items:flex-end}.chart>i{flex:1;position:relative;min-height:8px;height:calc(var(--bar)*100%);border-radius:5px 5px 2px 2px;background:linear-gradient(#a3bc93,#d7e4cf);transform-origin:bottom;transform:scaleY(var(--grow,1));transition:height .5s}.chart>i:nth-child(4){background:linear-gradient(#66885d,#a0b98e)}.chart>i>span{position:absolute;top:calc(100% + 7px);left:0;right:0;text-align:center;font-style:normal;font-size:8px;color:#99a28d}.receipt{display:flex;align-items:center;gap:10px;padding:12px;background:#eef1e6;border:1px solid #e2e8d7;border-radius:8px;box-shadow:0 7px 14px #7085630a;transform:translateX(13px)}.receipt-icon{font-size:16px}.receipt b{font-size:9px;font-weight:500;display:block}.receipt small{font-size:7px;color:#98a18d;margin-top:5px;display:block}.receipt strong{font-size:11px;font-weight:500;margin-left:auto}.receipt.added{animation:receipt-in .6s ease-out}@keyframes receipt-in{0%{opacity:0;transform:translate(25px,7px)}100%{opacity:1;transform:translate(13px,0)}}
.demo-paste{background:radial-gradient(ellipse at 40% 35%,#f5ede0,#e8decc)}.paste-playground{position:absolute;inset:75px 6% 73px;display:flex;align-items:center;flex-direction:column;justify-content:center}.paste-fan{width:290px;height:174px;position:relative;margin-top:15px}.paste-fan button{position:absolute;top:0;left:75px;width:143px;height:163px;border:1px solid #d9cfb8;border-radius:10px;background:#fff9ed;padding:18px;text-align:left;box-shadow:0 10px 24px #886d3a24;transform-origin:50% 120%;transform:translateX(-42px) rotate(-20deg);transition:transform .6s,background .4s,border-color .4s,box-shadow .4s}.paste-fan button:nth-child(2){transform:rotate(0deg);background:#e8d6b5}.paste-fan button:nth-child(3){transform:translateX(42px) rotate(20deg);background:#f2e7d4}.paste-fan button[aria-pressed=true]{transform:translateY(-17px) rotate(0deg);z-index:2;background:#fffdf3;box-shadow:0 15px 25px #886d3a2a;border-color:#b8aa8b}.paste-fan span{font-size:7px;letter-spacing:.08em;color:#a49476}.paste-fan b{font:400 22px/1.1 LocalSerif,Georgia,serif;display:block;margin-top:16px;color:#817154}.paste-fan i{font-size:8px;font-style:normal;color:#ac9a7b;display:block;margin-top:15px}.paste-destination{background:#fcf9f0b5;border:1px solid #d9cfb8;border-radius:8px;padding:12px 17px;width:85%;margin-top:20px;position:relative}.paste-destination>span{display:block;font-size:7px;color:#aa9b81;letter-spacing:.08em}.paste-destination p{font:italic 16px LocalSerif,Georgia,serif;margin-top:7px;color:#8f7c5c}.paste-destination i{position:absolute;right:17px;top:27px;width:1px;height:14px;background:#b4a284;animation:caret-blink 1s step-end infinite}
.demo-sodu{height:520px;background:radial-gradient(ellipse at 50% 35%,#f5f4ed,#e7e8dd)}.sodu-playground{position:absolute;top:66px;left:50%;width:280px;transform:translateX(-50%)}.sodu-caption{height:43px;display:flex;align-items:center;justify-content:space-between;font-size:10px;color:#8a8f7d}.sodu-caption img{height:59px;width:52px;object-fit:contain;align-self:flex-end;transform:rotate(8deg)}.sodu-board{display:grid;grid-template-columns:repeat(9,1fr);border:1.5px solid #9ca68d;background:#b8c0aa;gap:1px;box-shadow:0 15px 30px -15px #7a84603a;border-radius:5px;overflow:visible;perspective:700px}.sodu-cell{aspect-ratio:1;background:#fdfbf2;padding:0;display:grid;place-items:center;font:400 14px LocalSerif,Georgia,serif;position:relative;min-width:0;color:#646e57}.sodu-cell:nth-child(3n):not(:nth-child(9n)){border-right:1.5px solid #9ca68d}.sodu-cell:nth-child(n+19):nth-child(-n+27),.sodu-cell:nth-child(n+46):nth-child(-n+54){border-bottom:1.5px solid #9ca68d}.sodu-cell.empty{background:#e9eddd;color:#668050;cursor:pointer}.sodu-cell.selected{background:#c7d5b3;outline:2px solid #80986a;outline-offset:-2px;z-index:2}.sodu-cell.filled{background:#edf3e1;color:#577447}.sodu-cell.wrong{animation:wrong-cell .3s}.sodu-cell.wave{animation:cell-wave 1.1s ease-in-out both;animation-delay:calc(var(--wave-index)*35ms)}.sodu-numbers{display:flex;justify-content:center;gap:5px;margin-top:15px}.sodu-numbers button{width:26px;height:28px;font:15px LocalSerif,Georgia,serif;background:#f5f5ea;border:1px solid #cbd1be;border-radius:5px}.sodu-numbers button:hover{background:#e1e9d5}.sodu-numbers button:disabled{opacity:.35}.demo-sodu .demo-bottom{bottom:19px}.demo-sodu.won{background:radial-gradient(ellipse at 50% 35%,#f8f4d6,#e3e9d4)}@keyframes cell-wave{0%,100%{transform:translateY(0);background:#fdfbf2}40%{transform:translateY(-9px) rotateX(13deg);background:#dce9bf;box-shadow:0 8px 12px #71835526}}@keyframes wrong-cell{25%{transform:translateX(-3px);background:#f1d9ce}75%{transform:translateX(3px)}}
.demo:not(.in-view) *,.motion-paused .demo *{animation-play-state:paused!important}.motion-paused .demo *{transition:none!important}.demo:focus-within{border-color:#7f956147}
@media(min-width:1700px){.demo{height:510px}.demo-sodu{height:545px}.term-window{top:118px}.cost-dashboard{top:110px}.world-scene .mini-island{transform:scale(1.5)}.sodu-playground{top:79px}}
@media(max-width:1000px){.works-list{gap:72px}.work-row,.work-row.reverse{gap:5%;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr)}.work-row.reverse{grid-template-columns:minmax(0,1fr) minmax(0,1.25fr)}.work-tagline{font-size:16px}.work-description{font-size:11px}.demo-top,.demo-bottom{left:20px;right:20px}.demo-top>span:first-child{font-size:7px;letter-spacing:.025em}.demo-badge{font-size:7px}.demo-bottom{font-size:9px}.demo-bottom>span{max-width:48%}.demo-action{font-size:9px;padding:9px 10px}.term-window{left:5%;width:90%}.term-content{padding:17px}.cost-dashboard{left:8%;width:84%;padding:20px}.chart{gap:9px}.window-bar small{display:none}.sodu-playground{width:260px}}
@media(max-width:700px){.motion-toggle{font-size:9px;padding:7px 10px}.site-header nav{gap:13px}.site-header nav a:last-child{display:none}.brand-suffix{display:none}.scroll-story{height:540svh}.story-stage{min-height:560px}.film-layer{top:24%;bottom:9%;mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 92%,transparent);-webkit-mask-image:linear-gradient(to bottom,transparent,#000 9%,#000 92%,transparent)}.film-layer video,.film-poster{object-fit:cover;object-position:50% 50%}.film-shade{background:linear-gradient(#f5f3ed 0%,#f5f3ed 17%,transparent 39%,transparent 76%,#f5f3ed 99%)}.chapter-copy{top:13%;bottom:auto;max-width:86%;width:86%}.chapter-copy h2{font-size:43px;margin:9px 0}.chapter-copy>p{font-size:11px;max-width:none}.chapter-copy .text-link{margin-top:10px;font-size:10px;padding-bottom:7px}.hero-copy{top:17%}.hero-copy h1{font-size:40px}.chapter-rail{bottom:81px}.story-bottom{bottom:22px}.story-outro h2{font-size:29px;margin:20px 0;line-height:1.7}.story-outro .eyebrow{font-size:8px}.story-outro .text-link{font-size:11px}.projects-section{padding-top:58px}.section-heading{margin-bottom:38px}.section-heading h2{font-size:34px}.work-row,.work-row.reverse{display:flex;flex-direction:column;align-items:stretch;gap:29px}.works-list{gap:65px}.work-copy h3{font-size:43px;margin:12px 0}.work-copy .eyebrow{font-size:8px}.work-tagline{font-size:18px}.work-description{font-size:12px;margin-top:14px;max-width:100%}.feature-tags{margin-top:18px}.work-copy .text-link{margin-top:20px}.demo{height:405px;border-radius:13px}.demo-sodu{height:505px}.demo-top{top:19px}.demo-top,.demo-bottom{left:18px;right:18px}.demo-bottom{bottom:18px;font-size:9px}.demo-badge{padding:5px 7px}.world-scene .mini-island{transform:scale(1.15);margin-top:20px;animation-name:island-breathe-small}.world-halo{top:65px}.term-window{top:72px;height:257px}.term-content{padding:17px}.term-block code{font-size:10px}.term-ai{font-size:9px}.cost-dashboard{top:68px;height:260px;width:79%;left:10.5%;padding:20px}.cost-dashboard-top h4{font-size:27px}.chart{height:67px;margin-top:18px}.receipt{padding:10px}.receipt b{font-size:8px}.receipt strong{font-size:10px}.paste-playground{inset:68px 5% 69px}.paste-fan{transform:scale(.9);margin-top:0}.paste-destination{margin-top:8px}.sodu-playground{top:58px;width:270px}.sodu-cell{font-size:14px}.collection-note{font-size:9px;margin-top:54px}.media-status{bottom:81px;font-size:8px}.story-bottom .edition{display:none}}
@media(max-width:360px){.demo-top{left:12px;right:12px}.demo-top>span:first-child{font-size:6px}.demo-bottom{left:12px;right:12px}.demo-bottom>span{font-size:8px}.sodu-playground{width:245px}.demo-sodu{height:478px}.work-tagline{font-size:16px}.paste-fan{transform:scale(.82)}.term-block code{font-size:9px}.motion-toggle{font-size:8px}.hero-copy h1{font-size:35px}}
@keyframes island-breathe-small{50%{transform:scale(1.15) translateY(-5px)}}
@media(prefers-reduced-motion:reduce){.scroll-story{height:100svh;min-height:560px}.story-outro{display:none}.film-layer{opacity:1}.demo *{animation:none!important;transition:none!important}.motion-toggle{display:none}}