:root{--bg:#f6f5f1;--ink:#20231e;--muted:#787b73;--orange:#f07642;--line:#dddfd6;--dark:#111410;--ease:cubic-bezier(.2,.8,.2,1)}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:30px}body{margin:0;background:var(--bg);color:var(--ink);font-family:-apple-system,BlinkMacSystemFont,"PingFang SC","Microsoft YaHei",sans-serif;-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{outline:3px solid #cc5a2b;outline-offset:4px}::selection{background:#ffbb94;color:#20231e}[hidden]{display:none!important}.skip{position:fixed;left:10px;top:-100px;z-index:100;background:white;padding:15px}.skip:focus{top:10px}.header{max-width:1480px;margin:auto;padding:25px 5%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid var(--line)}.brand{display:flex;align-items:center;gap:10px;font-size:19px;font-weight:650;letter-spacing:-.7px}.brand-icon{font-size:34px;color:var(--orange);line-height:1}.brand small{font-size:9px;letter-spacing:1.7px;margin-left:6px;color:var(--muted);font-weight:500}.header-actions{display:flex;align-items:center;gap:25px}.quiet{border:0;background:none;font-size:11px;color:#73776e}.quiet:disabled{cursor:default}.collection-button{border:1px solid #c9cdc1;background:transparent;border-radius:30px;padding:10px 14px;font-size:12px;display:flex;gap:12px;align-items:center}.collection-button span{background:var(--ink);color:white;border-radius:50%;min-width:23px;height:23px;display:grid;place-items:center;font-size:10px}.intro{max-width:1360px;margin:0 auto;display:grid;grid-template-columns:1.2fr 1fr;padding:70px 3% 60px;gap:55px;align-items:center}.eyebrow{font-size:9px;font-weight:600;letter-spacing:1.9px;display:flex;gap:8px;align-items:center;color:#85887d}.eyebrow i{width:6px;height:6px;background:var(--orange);border-radius:50%}.intro h1{font-size:clamp(35px,3.65vw,57px);line-height:1.3;font-weight:550;letter-spacing:-2.7px;margin:23px 0 29px;position:relative}.intro h1 span{color:#cc5b31}.intro h1 svg{position:absolute;width:65%;height:15px;bottom:-14px;left:22%;fill:none;stroke:#ed9b72;stroke-width:2}.intro p{font-size:13px;line-height:1.9;color:#797f71;margin-bottom:31px}.intro-bottom{display:flex;align-items:center;gap:25px}.primary{border:0;background:var(--ink);color:white;padding:14px 20px;border-radius:7px;font-size:12px;display:inline-flex;align-items:center;justify-content:center;gap:27px;white-space:nowrap;transition:background .2s,transform .2s}.primary:hover{background:#414a37;transform:translateY(-2px)}.intro-stats{display:flex;gap:9px;align-items:center}.intro-stats b{font-size:35px;font-weight:500;letter-spacing:-2px}.intro-stats span{font-size:9px;color:#85897e;line-height:1.65}.offline-note{font-size:9px;color:#83887a;display:flex;gap:6px;align-items:center}.offline-note i{width:5px;height:5px;background:#8a9c75;border-radius:50%}.intro-art{position:relative;height:347px;border-radius:16px;background:#e9e9df;overflow:hidden;perspective:1000px}.art-grid{position:absolute;inset:0;background-image:linear-gradient(#b7bfab2b 1px,transparent 1px),linear-gradient(90deg,#b7bfab2b 1px,transparent 1px);background-size:34px 34px;mask-image:linear-gradient(transparent,#000)}.art-note{position:absolute;left:23px;top:20px;font-size:7px;line-height:1.7;letter-spacing:1.8px;color:#7f8775}.art-orbit{position:absolute;width:320px;height:320px;border:1px solid #cbd2bf;border-radius:50%;left:12%;top:9%;box-shadow:0 0 0 35px #cbd2bf25,0 0 0 70px #cbd2bf20}.art-card{position:absolute;width:185px;height:243px;border-radius:11px;padding:19px;box-shadow:0 15px 32px #2634141c}.art-card>span{font-size:6px;letter-spacing:1px;display:flex;justify-content:space-between}.art-card.front{background:#f47c49;left:41%;top:20%;transform:rotate(12deg);animation:artFloat 7s ease-in-out infinite;color:#312519}.art-card.front b{font-size:27px;line-height:1.22;font-weight:500;display:block;margin-top:17px}.art-card.front small{font-size:6px;letter-spacing:1px;position:absolute;bottom:17px}.art-spark{font-size:74px;line-height:1;margin-top:12px}.art-card.back{background:#202b24;color:#dae1cb;left:17%;top:15%;transform:rotate(-13deg);animation:artFloatBack 8s ease-in-out infinite}.art-card.back b{font-size:17px;font-weight:400}.wire-sphere{width:112px;height:112px;border:1px solid #bddbab;border-radius:50%;margin:30px 0 23px;background:repeating-radial-gradient(ellipse at center,transparent 0 10px,#adc09a66 11px 12px,transparent 13px 20px);transform:rotate(-30deg);position:relative}.wire-sphere:after{content:"";position:absolute;inset:0;border:1px solid #bddbab;border-radius:50%;transform:scaleX(.4)}.art-tag{position:absolute;bottom:25px;left:22px;background:#ffffffb5;border:1px solid white;border-radius:30px;font-size:8px;letter-spacing:1px;padding:9px 11px;display:flex;align-items:center;gap:7px;backdrop-filter:blur(10px)}.art-tag span{width:5px;height:5px;border-radius:50%;background:#dc6e3b}.art-index{position:absolute;right:20px;bottom:20px;font-size:8px;letter-spacing:2px;color:#89907f}.recipes{max-width:1280px;margin:0 auto 67px;display:grid;grid-template-columns:.95fr 1fr 1fr 1fr;gap:13px;padding:0 15px}.recipe-label{display:flex;flex-direction:column;justify-content:center;gap:8px}.recipe-label b{font-size:13px;font-weight:550}.recipe-label>span{font-size:10px;color:#959a8a}.recipes button{border:1px solid #dce0d4;background:#f0f1ea;border-radius:9px;padding:16px 18px;display:flex;gap:13px;align-items:center;text-align:left;font-size:12px;transition:background .2s,border-color .2s}.recipes button:hover{background:#e9ecdf;border-color:#b6c2a5}.recipes button small{display:block;font-size:9px;color:#929887;margin-top:5px}.recipes button>span:last-child{margin-left:auto;color:#7f8771}.recipe-dot{width:31px;height:31px;border-radius:50%;flex-shrink:0}.recipe-dot.blue{background:radial-gradient(circle at 30% 25%,#b8d4ff,#5069b9 50%,#192a60)}.recipe-dot.cream{background:linear-gradient(135deg,#f8f2e3,#b7b89e);border:1px solid #d8d9c7}.recipe-dot.orange{background:radial-gradient(circle at 30% 25%,#ffe1a4,#f18352 50%,#be4f3e)}.catalog{max-width:1280px;margin:auto;padding:0 15px}.catalog-heading{display:flex;align-items:end;justify-content:space-between;margin-bottom:25px}.catalog h2{font-weight:550;font-size:25px;letter-spacing:-1px;margin:12px 0 0;display:flex;align-items:center;gap:16px}.catalog h2>span{font-size:9px;letter-spacing:0;font-weight:400;color:#8a907f;border-left:1px solid #d4d9ca;padding-left:16px}.catalog-heading>p{font-size:10px;color:#989e8f}.toolbar{display:flex;justify-content:space-between;gap:15px;align-items:center;padding:17px 0;border-block:1px solid var(--line);position:relative}.filters{display:flex;gap:4px;flex-wrap:wrap}.filters button{border:0;border-radius:6px;background:none;padding:11px 13px;font-size:11px;white-space:nowrap}.filters button span{margin-left:6px;font-size:9px;color:#999f90}.filters button.active{background:var(--ink);color:white}.filters button.active span{color:#d0d9c6}.filters button:not(.active):hover{background:#e9ecdf}.search{display:flex;gap:9px;align-items:center;border:1px solid #d9dfcf;border-radius:6px;padding:8px 10px;background:#eeefe8;max-width:226px}.search>span{font-size:23px;line-height:.7;color:#8a927e}.search input{width:100%;border:0;background:none;outline:none;font-size:10px;color:var(--ink);min-width:0}.search:focus-within{outline:2px solid #c6794a;outline-offset:2px}.search input:focus-visible{outline:0}.subtoolbar{display:flex;justify-content:space-between;align-items:center;padding:15px 0 19px;font-size:10px;color:#959c8c;gap:10px}.subtoolbar p{margin:0}.subtoolbar label{display:flex;align-items:center;gap:6px;white-space:nowrap;cursor:pointer}.subtoolbar input{accent-color:#cd6539}.grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px 20px}.effect-card{background:#fff;border:1px solid #e1e4da;border-radius:12px;overflow:hidden;transition:box-shadow .25s,border-color .25s}.effect-card:hover{box-shadow:0 8px 25px #1d2b100a;border-color:#bbc6ae}.effect-card.selected{border-color:#da8259;box-shadow:0 0 0 1px #da82591a}.stage{height:231px;position:relative;overflow:hidden;isolation:isolate;background:#15191e;color:white;display:grid;place-items:center}.stage *{box-sizing:border-box}.stage>*{max-width:100%}.stage-label{position:absolute;left:15px;top:13px;z-index:4;font-size:8px;letter-spacing:1.1px;color:#ffffff80;pointer-events:none;font-family:ui-monospace,monospace}.stage-prompt{position:absolute;left:0;right:0;bottom:13px;text-align:center;z-index:4;font-size:8px;color:#ffffff70;letter-spacing:1px;pointer-events:none}.effect-card .stage button:focus-visible,.stage [tabindex]:focus-visible{outline-color:#f9b17a}.effect-meta{padding:17px 18px 16px}.effect-top{display:flex;justify-content:space-between;align-items:start;gap:10px}.effect-top h3{font-size:15px;letter-spacing:-.4px;font-weight:550;margin:0 0 5px}.effect-top small{font-size:8px;letter-spacing:.6px;color:#a0a696;font-family:ui-monospace,monospace}.select-effect{flex-shrink:0;border:1px solid #dce2d4;border-radius:50%;width:29px;height:29px;background:#f7f9f4;color:#717d62;font-size:20px;line-height:1;display:grid;place-items:center}.selected .select-effect{background:#f17845;border-color:#f17845;color:white;font-size:14px}.effect-meta p{font-size:10px;color:#8a9280;margin:12px 0 17px;line-height:1.7;min-height:17px}.meta-bottom{display:flex;justify-content:space-between;align-items:center;gap:6px}.tags{display:flex;flex-wrap:wrap;gap:4px}.tags span{font-size:8px;padding:4px 6px;background:#f1f3eb;border-radius:3px;color:#909a82}.open-effect{background:transparent;border:0;font-size:9px;color:#647252;padding:5px 0;white-space:nowrap}.open-effect:hover{color:#c36032}.closing{max-width:1250px;margin:68px auto 0;padding:34px 30px;background:#e9edde;border:1px solid #dae0cd;border-radius:12px;display:flex;align-items:center;gap:24px}.closing>span{font-size:53px;color:#849367}.closing h2{font-weight:500;font-size:22px;margin:0 0 10px;letter-spacing:-.5px}.closing p{font-size:11px;color:#919b80;margin:0;line-height:1.7}.closing button{margin-left:auto}footer{max-width:1340px;margin:42px auto 0;padding:30px 3% 120px;display:flex;align-items:center;justify-content:space-between;gap:20px}footer .brand{font-size:13px}footer p{font-size:9px;color:#9aa18f}footer>span{font-size:7px;letter-spacing:1px;color:#aab09f}.selection-dock{position:fixed;z-index:20;bottom:20px;left:50%;transform:translateX(-50%);width:min(820px,calc(100% - 30px));border:1px solid #55634a;border-radius:12px;background:#202b20ef;box-shadow:0 10px 45px #17281030;backdrop-filter:blur(16px);color:white;display:flex;justify-content:space-between;align-items:center;padding:14px 16px}.selection-dock>div{display:flex;gap:11px;align-items:center}.dock-icon{background:#d5eac0;color:#354c25;width:26px;height:26px;border-radius:50%;display:grid;place-items:center;font-size:12px}.selection-dock b{font-weight:500;font-size:12px}.dock-caption{font-size:9px;color:#abb7a1;margin-left:8px}.selection-dock button{border:0;background:#f58b58;border-radius:6px;padding:12px 16px;color:#2e211a;font-size:11px;display:flex;gap:25px}.toast{position:fixed;z-index:100;top:23px;left:50%;transform:translate(-50%,-80px);opacity:0;background:#242e21;color:white;padding:12px 20px;border-radius:8px;box-shadow:0 8px 25px #1e2d1525;font-size:12px;transition:transform .3s,opacity .3s;pointer-events:none;max-width:90vw;text-align:center}.toast.show{transform:translate(-50%,0);opacity:1}#empty{text-align:center;padding:70px 10px}#empty>span{font-size:55px;color:#a6b091}#empty h3{font-weight:500}#empty p{font-size:12px;color:#8b967d}.secondary{background:#eff2e8;border:1px solid #d8dfcc;border-radius:7px;padding:12px 15px;font-size:11px}.text-button{border:0;background:transparent;color:#9b7562;font-size:10px}.text-button:disabled{opacity:.4;cursor:default}dialog{max-height:90dvh;border:1px solid #dbe3ce;border-radius:17px;background:var(--bg);padding:23px;width:min(850px,calc(100% - 28px));color:var(--ink);box-shadow:0 20px 100px #0812044d;overflow-y:auto}dialog::backdrop{background:#0c170dcc;backdrop-filter:blur(8px)}.dialog-top{display:flex;justify-content:space-between;align-items:center;margin-bottom:18px}.close-dialog{background:#e9edde;border:0;width:30px;height:30px;border-radius:50%;font-size:22px;color:#768464}.preview-stage{height:390px;border-radius:10px}.preview-stage .demo-content{scale:1.25}.preview-info{display:flex;gap:25px;align-items:center;justify-content:space-between;padding:25px 4px 15px}.preview-info h2{font-weight:550;font-size:25px;margin:0 0 12px}.preview-info p{font-size:12px;color:#879279;line-height:1.8;max-width:540px;margin:0 0 13px}.preview-info .primary{font-size:11px}.preview-help{background:#e9edde;border-radius:6px;padding:13px;color:#758663;font-size:11px;line-height:1.8}#selection-dialog{width:min(680px,calc(100% - 28px));padding:27px}#selection-dialog h2{font-size:30px;font-weight:500;letter-spacing:-1px;margin:0 0 12px}.dialog-lead{font-size:12px;color:#8a957d;line-height:1.7;margin-bottom:24px}#selection-items{display:flex;flex-direction:column;gap:7px;max-height:230px;overflow:auto}.selected-row{background:#eef1e6;border:1px solid #dce3ce;border-radius:6px;padding:10px 12px;display:flex;justify-content:space-between;align-items:center;gap:10px;font-size:12px}.selected-row small{font-size:9px;color:#97a486;margin-right:10px}.selected-row button{border:0;background:none;font-size:20px;color:#839271}.selection-empty{font-size:12px;color:#7c896e;background:#ecefe3;border-radius:6px;padding:20px;line-height:1.8}.brief-settings{display:grid;grid-template-columns:1.15fr 1fr;gap:12px;margin:22px 0}.brief-settings label,.brief-label{display:block;font-size:11px;color:#7c896e}.brief-settings input,.brief-settings select{display:block;margin-top:9px;width:100%;font-size:11px;padding:11px;border:1px solid #d8e0cd;border-radius:5px;background:#fff;color:#4d6040;min-width:0}.brief-label{margin-bottom:9px}#brief{width:100%;border:1px solid #d8e0cd;border-radius:6px;resize:vertical;background:white;padding:13px;font-size:11px;line-height:1.8;color:#667755}.selection-actions{display:flex;gap:10px;margin-top:17px;flex-wrap:wrap}.selection-actions .text-button{margin-left:auto}.local-note{font-size:9px;color:#9aa68b;margin:18px 0 0}
/* The live collection */
.demo-content{position:relative;z-index:2;pointer-events:auto}.demo-word{font-size:36px;line-height:1.1;font-weight:500;letter-spacing:-1.8px}.demo-kicker{font-family:ui-monospace,monospace;font-size:7px;letter-spacing:2px;color:#ffffff80;margin-bottom:12px}.centered{text-align:center}.aurora{background:#080d18}.aurora:before,.aurora:after{content:"";position:absolute;width:90%;height:150%;top:-45%;left:-15%;border-radius:50%;background:conic-gradient(from 0deg,transparent,#447fe940,#64ffbb78,#6760ed78,transparent);filter:blur(32px);animation:aurora 9s ease-in-out infinite alternate;transform:rotate(-25deg)}.aurora:after{left:32%;top:10%;background:linear-gradient(60deg,#15669075,#5145c098,transparent);animation-delay:-4s}.aurora .demo-word{color:#e2ecff}.stars{background:radial-gradient(ellipse at bottom,#193247,#070f1b 75%)}.star-field{position:absolute;inset:0}.star{position:absolute;left:var(--x);top:var(--y);width:var(--s);height:var(--s);background:#c9e5ff;border-radius:50%;animation:twinkle var(--t) ease-in-out infinite alternate;animation-delay:var(--d)}.star-ring{position:absolute;border:1px solid #80b3d927;width:260px;height:260px;border-radius:50%;transform:rotateX(65deg) rotateZ(-20deg)}.mesh{background:#101d16;perspective:350px}.mesh-floor{position:absolute;width:150%;height:220%;top:35%;background:linear-gradient(transparent,#223b2633),repeating-linear-gradient(90deg,#86af633f 0 1px,transparent 1px 35px),repeating-linear-gradient(0deg,#86af633f 0 1px,transparent 1px 35px);transform:rotateX(62deg);transform-origin:50% 0;animation:gridMove 5s linear infinite}.mesh .demo-word{color:#d9efb6}.liquid{background:#ede7df;color:#493c42}.blob{position:absolute;width:180px;height:160px;background:#ee9789;border-radius:42% 58% 59% 41% / 44% 35% 65% 56%;filter:blur(9px);animation:morph 8s ease-in-out infinite alternate;left:12%;top:12%}.blob.two{background:#aaacd6;left:51%;top:36%;width:130px;height:130px;animation-delay:-3s}.blob.three{background:#ffd49c;left:47%;top:-6%;width:110px;height:110px;animation-delay:-5s}.liquid .stage-label,.liquid .stage-prompt{color:#66545790}.liquid .demo-word{font-family:Georgia,serif;font-style:italic;font-size:43px}.beams{background:#12141a}.beam{position:absolute;top:-30%;left:18%;width:70px;height:160%;background:linear-gradient(90deg,transparent,#9fa9ff55,transparent);transform:rotate(30deg);filter:blur(11px);animation:beam 7s ease-in-out infinite alternate}.beam.two{left:56%;width:100px;background:linear-gradient(90deg,transparent,#e3b9ff38,transparent);animation-delay:-4s}.beams .demo-word{font-weight:300;letter-spacing:3px;font-size:29px}.glass{background:linear-gradient(135deg,#bfd2c4,#59776d);color:#eaf5ec}.glass:before{content:"";position:absolute;left:20%;top:7%;width:150px;height:150px;border-radius:50%;background:#cbea95;filter:blur(2px);animation:glassBall 7s ease-in-out infinite alternate}.glass:after{content:"";position:absolute;right:20%;bottom:-14%;width:145px;height:145px;border-radius:50%;background:#dfa088;animation:glassBall 8s -4s ease-in-out infinite alternate}.glass-panel{width:210px;padding:22px;border:1px solid #ffffff70;border-radius:14px;background:#ffffff17;backdrop-filter:blur(16px);box-shadow:0 10px 35px #20372b25}.glass-panel small{font-size:7px;letter-spacing:2px}.glass-panel .demo-word{font-size:28px;margin-top:17px}.glass-panel span{font-size:8px;display:block;margin-top:16px;color:#ffffffb0}.split{background:#e6e9de;color:#31412c}.split .stage-label,.split .stage-prompt{color:#40533380}.split-line{overflow:hidden;font-size:38px;line-height:1.12;font-weight:500;letter-spacing:-1.5px}.split-line span{display:block;animation:splitReveal 5s var(--ease) infinite}.split-line:nth-child(2) span{animation-delay:.13s;color:#78866a}.typewriter{background:#17251e}.terminal{width:245px;font-family:ui-monospace,monospace}.terminal-top{display:flex;gap:4px;margin-bottom:25px}.terminal-top i{width:5px;height:5px;border-radius:50%;background:#5f8268}.terminal-top i:first-child{background:#d59a72}.typed{font-size:19px;color:#b8dba9;height:26px;letter-spacing:-.7px}.cursor{display:inline-block;background:#a5cd91;width:2px;height:21px;vertical-align:middle;animation:blink .8s steps(2) infinite}.terminal small{display:block;font-size:7px;color:#6c8b6d;margin-top:19px}.gradient-text{background:#0e141c}.gradient-word{font-size:40px;font-weight:600;letter-spacing:-2px;background:linear-gradient(110deg,#7ce5e0,#c8a6ef,#f4b887,#7ce5e0);background-size:300% 100%;color:transparent;background-clip:text;animation:textGradient 6s linear infinite}.outline{background:#eee9df}.outline .stage-label,.outline .stage-prompt{color:#665b4380}.outline-word{font-size:56px;font-weight:750;letter-spacing:-4px;position:relative;color:transparent;-webkit-text-stroke:1px #5a624c}.outline-word:after{content:attr(data-text);position:absolute;left:0;top:0;color:#5a624c;clip-path:inset(100% 0 0);animation:inkFill 5s ease-in-out infinite}.scramble{background:#202228}.scramble-btn{background:none;border:0;text-align:left;color:#edeadd;padding:12px}.scramble-btn strong{font-family:ui-monospace,monospace;font-size:29px;letter-spacing:-1px}.scramble-btn small{display:block;color:#b4ad79;font-family:ui-monospace,monospace;font-size:8px;letter-spacing:2px;margin-bottom:12px}.marquee{background:#ee7346;display:flex;flex-direction:column;justify-content:center;gap:12px;color:#492b21}.marquee .stage-label,.marquee .stage-prompt{color:#60281b90}.marquee-track{display:flex;gap:21px;width:max-content;max-width:none;animation:marquee 14s linear infinite;white-space:nowrap;font-size:32px;font-weight:600;letter-spacing:-1px}.marquee-track.reverse{animation-direction:reverse;font-size:25px;color:transparent;-webkit-text-stroke:1px #7e3e26}.tilt{background:radial-gradient(ellipse at 50% 100%,#293a52,#111923);perspective:800px}.tilt-card{width:170px;height:150px;transform:rotateX(var(--rx,9deg)) rotateY(var(--ry,-13deg));transition:transform .22s var(--ease);border:1px solid #aec8e458;border-radius:12px;background:linear-gradient(130deg,#677faa99,#233a5a99);box-shadow:12px 16px 30px #03091550;padding:18px;transform-style:preserve-3d}.tilt-card small{font-size:7px;letter-spacing:2px;color:#b7cfe2}.tilt-card .demo-word{transform:translateZ(25px);font-size:32px;margin-top:21px}.tilt-card>span{font-size:8px;color:#9ac4f1;display:block;margin-top:13px}.spotlight{background:#101411}.spot-panel{position:absolute;inset:32px 28px;border-radius:12px;background:#192019;border:1px solid #728b5555;overflow:hidden;display:grid;place-items:center}.spot-panel:before{content:"";position:absolute;inset:0;background:radial-gradient(150px circle at var(--mx,50%) var(--my,50%),#c5e98f55,transparent 75%)}.spot-panel .demo-word{font-size:30px;color:#d5e7c2;position:relative}.magnetic{background:#e5e6de}.magnetic .stage-label,.magnetic .stage-prompt{color:#414b3480}.magnet-ring{width:166px;height:166px;border:1px dashed #afbaa0;border-radius:50%;display:grid;place-items:center}.magnet-button{background:#343e2c;border:0;color:#e5efda;border-radius:50%;width:100px;height:100px;font-size:11px;letter-spacing:1px;transform:translate(var(--tx,0px),var(--ty,0px));transition:transform .25s var(--ease),background .2s}.magnet-button span{display:block;font-size:27px;margin-top:6px}.magnet-button:hover{background:#5a6a47}.flip{background:#f1e5dc;perspective:800px}.flip .stage-label,.flip .stage-prompt{color:#7a594480}.flip-button{width:166px;height:164px;position:relative;background:none;border:0;padding:0;transform-style:preserve-3d;transition:transform .7s var(--ease)}.flip-button.flipped{transform:rotateY(180deg)}.flip-face{position:absolute;inset:0;border-radius:12px;backface-visibility:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center}.flip-front{background:#dd845f;color:#3d2b20;border:1px solid #b9725140;box-shadow:0 9px 20px #9b634522}.flip-front span{font-size:49px}.flip-front b{font-size:14px;font-weight:500;margin-top:15px}.flip-back{background:#444f3c;transform:rotateY(180deg);color:#e8eddc}.flip-back b{font-size:23px;line-height:1.25;font-weight:400}.flip-back small{font-size:8px;letter-spacing:1.5px;margin-top:18px}.ripple{background:#151e2c}.ripple-button{width:100%;height:100%;position:absolute;inset:0;border:0;background:radial-gradient(ellipse,#25476b,#111a2a);overflow:hidden;color:#bed4e8;display:grid;place-items:center}.ripple-button span{font-size:30px;font-weight:300;letter-spacing:2px;pointer-events:none}.ripple-ring{position:absolute;width:15px;height:15px;border:1px solid #b8dfff;border-radius:50%;pointer-events:none;transform:translate(-50%,-50%) scale(1);animation:ripple .95s ease-out forwards;box-shadow:0 0 12px #b8dfff55}.tabs{background:#eaece4;color:#34402c}.tabs .stage-label,.tabs .stage-prompt{color:#5f6d4e80}.tab-demo{width:253px}.demo-tabs{position:relative;display:flex;background:#d9dfce;border-radius:7px;padding:4px;gap:0}.tab-indicator{position:absolute;left:4px;top:4px;bottom:4px;width:calc((100% - 8px)/3);background:#fff;border-radius:5px;box-shadow:0 2px 5px #2630170f;transform:translateX(calc(var(--index,0)*100%));transition:transform .4s var(--ease)}.demo-tabs button{border:0;background:none;position:relative;flex:1;padding:10px 0;font-size:10px;color:#6f7e5e}.demo-tabs button[aria-selected=true]{color:#293721}.tab-content{padding:19px 5px 0}.tab-content strong{font-weight:450;font-size:21px;display:block;margin-bottom:7px}.tab-content small{font-size:9px;color:#8b987b}.scroll-stage{background:#17211e;display:block;padding:32px 25px 27px}.scroll-stage .stage-prompt{bottom:8px;font-size:7px}.scroll-window{height:100%;overflow-y:auto;overscroll-behavior:contain;border-radius:9px;background:#eff0e9;color:#394333;scrollbar-width:thin;scrollbar-color:#a3b494 transparent;position:relative;outline-offset:2px!important}.scroll-intro{font-size:9px;color:#6c7e5a;letter-spacing:1px;padding:22px 18px}.scroll-intro b{font-size:24px;font-weight:450;letter-spacing:-.8px;color:#394a30;display:block;margin:7px 0}.reveal-items{padding:0 17px 35px;display:grid;gap:12px}.reveal-item{padding:20px 15px;background:#dbe6cd;border-radius:7px;opacity:.12;transform:translateY(24px);transition:opacity .5s,transform .5s;font-size:12px;min-height:70px;display:flex;justify-content:space-between;align-items:center}.reveal-item.shown{opacity:1;transform:none}.reveal-item:nth-child(2){background:#e8ceb9}.reveal-item:nth-child(3){background:#c9dce4}.reveal-item span{font-size:8px}.stack{background:#28201c}.stack-space{padding:5px 17px 80px}.stack-item{position:sticky;top:var(--top);padding:21px 17px;height:120px;border-radius:8px;margin-bottom:27px;box-shadow:0 -5px 15px #27341715;background:var(--color);font-size:10px}.stack-item strong{font-size:28px;letter-spacing:-1px;font-weight:500;display:block;margin-top:13px}.stack-item small{position:absolute;right:17px;top:22px}.progress{background:#20232d}.progress-bar{position:sticky;top:0;z-index:3;height:5px;background:#d3dbca}.progress-bar i{height:100%;display:block;width:var(--progress,0%);background:#c77e52}.progress-content{padding:17px 19px 25px;min-height:500px;background:repeating-linear-gradient(0deg,transparent 0 39px,#cbd3c230 39px 40px)}.progress-content h4{font-size:28px;font-weight:450;line-height:1.1;letter-spacing:-1px;margin:8px 0 25px}.progress-content p{font-size:10px;line-height:2;color:#8a977d;margin:30px 0}.progress-number{position:sticky;bottom:10px;float:right;margin-right:12px;background:#33422c;color:#e8f0df;border-radius:15px;padding:5px 9px;font-size:9px}.parallax{background:#24383c}.parallax .scroll-window{background:#b5d0cb}.landscape{height:290px;position:sticky;top:-35px;overflow:hidden;background:linear-gradient(#b2d4d2,#e6e6c8)}.sun{position:absolute;width:48px;height:48px;border-radius:50%;background:#f6e9bd;left:54%;top:32px;transform:translateY(var(--sun-y,0px))}.mountain{position:absolute;width:350px;height:260px;left:-70px;top:98px;border-radius:40% 60% 10% 0;background:#748f84;transform:translateY(var(--far-y,0px)) rotate(-20deg)}.mountain.near{left:48px;top:163px;background:#345c57;border-radius:60% 40% 0 0;transform:translateY(var(--near-y,0px)) rotate(25deg)}.landscape-text{position:absolute;left:17px;top:35px;font-size:27px;font-family:Georgia,serif;color:#355454;transform:translateY(var(--text-y,0px))}.parallax-tail{height:150px;background:#23423c;color:#d7e4d4;position:relative;padding:30px 20px;font-size:11px;line-height:1.8}.horizontal{background:#222424}.horizontal .scroll-window{background:#eaded0}.horizontal-space{height:650px;position:relative}.horizontal-pin{position:sticky;top:0;height:158px;overflow:hidden;padding-top:31px}.horizontal-track{display:flex;gap:12px;width:max-content;max-width:none;padding:0 16px;transform:translateX(var(--travel,0px));will-change:transform}.horizontal-slide{height:100px;width:155px;border-radius:7px;background:#c17450;flex-shrink:0;padding:15px;color:#f4e8d7}.horizontal-slide:nth-child(2){background:#6b7e59}.horizontal-slide:nth-child(3){background:#527e85}.horizontal-slide:nth-child(4){background:#817286}.horizontal-slide small{font-size:7px;letter-spacing:1px}.horizontal-slide b{font-size:22px;display:block;font-weight:400;margin-top:15px}.count{background:#1d2920}.count-demo{text-align:center}.count-number{font-size:64px;letter-spacing:-4px;color:#cee9b6;font-variant-numeric:tabular-nums;font-weight:400}.count-number sup{font-size:25px;letter-spacing:-1px}.count-demo small{font-size:8px;letter-spacing:2px;color:#8ba775}.replay-count{display:block;margin:15px auto 0;background:#c4dda913;border:1px solid #9dc07840;border-radius:20px;color:#b4cc9f;font-size:9px;padding:7px 11px}
@keyframes artFloat{0%,100%{transform:translateY(0) rotate(12deg)}50%{transform:translateY(-12px) rotate(9deg)}}@keyframes artFloatBack{0%,100%{transform:translateY(0) rotate(-13deg)}50%{transform:translateY(8px) rotate(-17deg)}}@keyframes aurora{to{transform:translate(20%,20%) rotate(30deg) scale(1.3)}}@keyframes twinkle{to{opacity:.2;transform:scale(.5)}}@keyframes gridMove{to{background-position:0 0,0 35px,0 35px}}@keyframes morph{to{transform:translate(35px,-17px) rotate(60deg);border-radius:64% 36% 32% 68% / 35% 69% 31% 65%}}@keyframes beam{to{transform:translateX(90px) rotate(45deg);opacity:.35}}@keyframes glassBall{to{transform:translate(25px,20px)}}@keyframes splitReveal{0%,8%{transform:translateY(110%)}23%,80%{transform:translateY(0)}96%,100%{transform:translateY(-110%)}}@keyframes blink{to{opacity:0}}@keyframes textGradient{to{background-position:300% 0}}@keyframes inkFill{0%,10%,100%{clip-path:inset(100% 0 0)}45%,65%{clip-path:inset(0 0 0)}}@keyframes marquee{to{transform:translateX(-50%)}}@keyframes ripple{to{transform:translate(-50%,-50%) scale(35);opacity:0}}
.stage[data-active=false] *,.stage[data-active=false]:before,.stage[data-active=false]:after{animation-play-state:paused!important}body.paused *,body.paused *:before,body.paused *:after{animation-play-state:paused!important}body.paused .reveal-item{opacity:1;transform:none}body.paused .split-line span{animation:none}body.paused .tilt-card{transform:none!important}body.paused .magnet-button{transform:none!important}body.paused .flip-button{transition:none}body.paused .tab-indicator{transition:none}body.paused .ripple-ring{display:none}
@media(min-width:1600px){.intro{padding-top:88px;padding-bottom:76px}.intro-art{height:380px}.art-card{width:195px;height:255px}.stage{height:250px}.preview-stage{height:420px}}
@media(max-width:1100px){.intro{gap:30px;padding:50px 5%}.intro h1{font-size:40px;letter-spacing:-2px}.intro-art{height:315px}.art-card{width:159px;height:219px}.art-card.front b{font-size:24px}.art-card.front{left:44%}.art-spark{font-size:61px}.wire-sphere{width:90px;height:90px;margin:24px 0}.offline-note{display:none}.recipes{padding:0 5%;margin-bottom:52px;gap:9px}.recipes button{padding:13px 11px;gap:9px}.recipe-dot{width:26px;height:26px}.recipes button small{font-size:8px}.catalog{padding:0 5%}.toolbar{flex-wrap:wrap}.search{max-width:none;width:220px}.grid{grid-template-columns:repeat(2,minmax(0,1fr))}.catalog-heading>p{display:none}.closing{margin:50px 5% 0}.closing p{max-width:350px}.closing h2{font-size:20px}.closing button{font-size:10px}footer{padding-inline:5%}footer>span{display:none}}
@media(max-width:680px){.header{padding:19px 5%}.brand{font-size:16px;gap:7px}.brand small{display:none}.brand-icon{font-size:28px}.header-actions{gap:10px}.quiet{font-size:9px;padding:5px 0}.collection-button{font-size:10px;padding:7px 9px;gap:6px}.collection-button span{min-width:19px;height:19px;font-size:9px}.intro{grid-template-columns:1fr;gap:30px;padding:37px 6% 33px}.intro .eyebrow{font-size:8px;letter-spacing:1.3px}.intro h1{font-size:37px;letter-spacing:-2.2px;line-height:1.35;margin-top:21px}.intro h1 svg{width:66%;left:23%;bottom:-12px}.intro p{font-size:11px;line-height:1.9;margin-bottom:24px}.desktop-br{display:none}.intro-bottom{gap:25px}.intro-art{height:267px}.art-card{width:154px;height:212px}.art-card.front{left:45%;top:15%}.art-card.back{left:16%;top:9%}.art-note{font-size:6px;left:15px;top:13px}.art-tag{left:13px;bottom:13px;font-size:7px}.art-index{right:13px;bottom:14px;font-size:7px}.recipes{display:flex;overflow:auto;scrollbar-width:none;margin-bottom:39px;padding:0 6%;gap:10px}.recipe-label{min-width:130px}.recipe-label b{font-size:11px}.recipe-label>span{font-size:9px}.recipes button{min-width:180px;padding:13px}.recipe-dot{width:27px;height:27px}.catalog{padding:0 5%}.catalog h2{font-size:22px;gap:11px}.catalog h2>span{font-size:8px;padding-left:11px}.catalog-heading{margin-bottom:20px}.toolbar{gap:12px;padding:12px 0}.filters{gap:1px;flex-wrap:nowrap;width:100%;overflow:auto;scrollbar-width:none}.filters button{padding:9px 10px;font-size:10px}.filters button span{display:none}.search{width:100%;max-width:none;padding:10px}.search input{font-size:11px}.subtoolbar{padding:13px 0 16px;font-size:9px;align-items:start}.subtoolbar p{max-width:65%;line-height:1.6}.grid{grid-template-columns:1fr;gap:19px}.stage{height:235px}.effect-meta{padding:17px}.effect-top h3{font-size:16px}.effect-meta p{font-size:11px}.tags span{font-size:9px}.open-effect{font-size:10px}.select-effect{width:33px;height:33px}.closing{padding:23px;flex-wrap:wrap;gap:12px;margin-top:38px}.closing>span{font-size:38px}.closing>div{flex:1}.closing h2{font-size:18px;margin-bottom:7px}.closing p{font-size:10px}.closing button{margin:4px 0 0 50px;font-size:11px}footer{align-items:start;margin-top:20px;flex-direction:column;gap:3px;padding-bottom:100px}footer p{font-size:8px}.dock-caption{display:none}.selection-dock{padding:10px 12px;bottom:12px;border-radius:10px}.selection-dock>div{gap:7px}.selection-dock b{font-size:10px}.dock-icon{width:22px;height:22px;font-size:10px}.selection-dock button{font-size:10px;padding:11px 12px;gap:12px}dialog{padding:17px;max-height:93dvh}.preview-stage{height:300px}.preview-stage .demo-content{scale:1}.preview-info{display:block;padding-top:22px}.preview-info h2{font-size:22px}.preview-info .primary{margin-top:18px;width:100%}.preview-info p{font-size:11px}.preview-help{font-size:10px}#selection-dialog{padding:22px 18px}#selection-dialog h2{font-size:27px}.dialog-lead{font-size:11px}.brief-settings{grid-template-columns:1fr}.selection-actions{gap:8px}.selection-actions .primary{font-size:10px;padding:12px}.selection-actions .secondary{font-size:10px;padding:12px}.selection-actions .text-button{margin:0}.toast{font-size:11px;min-width:210px}.recipe-label{padding-right:10px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}.reveal-item{opacity:1;transform:none}.tilt-card,.magnet-button{transform:none!important}.ripple-ring{display:none}.split-line span{transform:none}}


.preview-stage .horizontal-slide{width:260px;height:180px;padding:25px}.preview-stage .horizontal-slide b{font-size:33px;margin-top:35px}.preview-stage .horizontal-pin{height:255px;padding-top:42px}.preview-stage .horizontal-space{height:1000px}.preview-stage .landscape{height:380px}.preview-stage .parallax-tail{height:240px}.preview-stage .mountain{width:750px;height:400px;top:160px}.preview-stage .mountain.near{top:255px;left:90px}.preview-stage .landscape-text{top:65px;left:35px;font-size:38px}
