.sb-home{--paper:#fffaf0;--book-ink:#2b2335;--blueprint:#1d4ea3;--hand:"Caveat","Segoe Print","Bradley Hand",cursive}.sb-home .phone{width:min(300px,78vw);aspect-ratio:9/18.4;border-radius:44px;padding:11px;flex:none;background:linear-gradient(160deg,#2a3042,#141824 40%,#1c2131);box-shadow:0 0 0 1px #343b50,var(--sb-phone-shadow),0 0 80px var(--sb-glow-1)}.sb-home .screen{position:relative;height:100%;border-radius:34px;overflow:hidden;background:var(--paper);container-type:inline-size}.sb-home .notch,.sb-opening .notch{position:absolute;top:2.6%;left:50%;width:30%;height:3.6%;margin-left:-15%;border-radius:20px;background:#0b0d14;z-index:6}.sb-home .layer,.sb-opening .layer{position:absolute;inset:0;visibility:hidden;display:flex;flex-direction:column;padding:16cqw 7cqw 7cqw}.sb-home .layer.is-on,.sb-opening .layer.is-on{visibility:visible;z-index:1}.sb-home .layer.developing{visibility:visible;z-index:2;animation:sb-develop 1.3s cubic-bezier(.6,0,.2,1) both}@keyframes sb-develop{0%{-webkit-clip-path:inset(0 0 100% 0);clip-path:inset(0 0 100% 0);filter:blur(5px) saturate(.3)}to{-webkit-clip-path:inset(0 0 0 0);clip-path:inset(0 0 0 0);filter:none}}.sb-home .sweep{position:absolute;left:-10%;right:-10%;height:2px;top:0;z-index:5;opacity:0;pointer-events:none;background:linear-gradient(90deg,transparent,rgba(var(--sb-accent-rgb),1),transparent);box-shadow:0 0 16px 4px rgba(var(--sb-accent-rgb),.55)}.sb-home .sweep.go{animation:sb-sweep 1.3s cubic-bezier(.6,0,.2,1) both}@keyframes sb-sweep{0%{top:0;opacity:1}90%{opacity:1}to{top:100%;opacity:0}}.l-doodle{background:repeating-linear-gradient(180deg,transparent 0 8.4cqw,#cfe0f5 8.4cqw calc(8.4cqw + 1px)),#fffdf6}.l-doodle:before{content:"";position:absolute;left:9cqw;top:0;bottom:0;width:1px;background:#f2b8b8}.l-doodle .art{transform:rotate(-2deg)}.sb-home .art svg,.sb-home .pic svg,.sb-opening .art svg{display:block;width:100%;height:auto}.l-doodle .kid{margin:4cqw 0 0;font:600 7.4cqw/1.12 var(--hand);color:#2c3e9e;transform:rotate(-1.5deg)}.l-doodle .byline{margin:3cqw 0 0;font:600 5.6cqw/1 var(--hand);color:#c2410c;align-self:flex-end;transform:rotate(-4deg)}.l-layout{background:#fbfaf6}.sb-home .box{border:1.5px dashed #8a8597;border-radius:2cqw;position:relative}.sb-home .box.pic{aspect-ratio:4/3;display:grid;place-items:center}.sb-home .box.pic:after,.sb-home .box.pic:before{content:"";position:absolute;inset:0;background:linear-gradient(to top right,transparent calc(50% - .5px),#b9b4c4 calc(50% - .5px) calc(50% + .5px),transparent calc(50% + .5px))}.sb-home .box.pic:after{transform:scaleX(-1)}.sb-home .pencil{font:600 5.4cqw/1 var(--hand);color:#6d6880;background:#fbfaf6;padding:0 2cqw;position:relative;z-index:1}.sb-home .bars{display:flex;flex-direction:column;gap:3cqw;margin-top:6cqw}.sb-home .bars i{display:block;height:4cqw;border:1.5px dashed #8a8597;border-radius:1cqw}.sb-home .bars i:last-child{width:62%}.sb-home .navrow{margin-top:auto;display:flex;justify-content:space-between;align-items:center}.sb-home .navrow .box{width:13cqw;height:9cqw}.sb-home .dots{display:flex;gap:2cqw}.sb-home .dots i{width:2.4cqw;height:2.4cqw;border-radius:50%;border:1.5px solid #8a8597}.l-blueprint{background:linear-gradient(#ffffff14 1px,transparent 1px) 0 0/6cqw 6cqw,linear-gradient(90deg,#ffffff14 1px,transparent 1px) 0 0/6cqw 6cqw,var(--blueprint);color:#e8f0ff}.l-blueprint .bars i,.l-blueprint .box,.l-blueprint .dots i{border:1px solid #cfe0ff}.l-blueprint .box.pic:after,.l-blueprint .box.pic:before{background:linear-gradient(to top right,transparent calc(50% - .5px),#cfe0ff88 calc(50% - .5px) calc(50% + .5px),transparent calc(50% + .5px))}.l-blueprint .tag{font:500 3.4cqw/1 var(--sb-mono);letter-spacing:.06em;color:#cfe0ff;background:var(--blueprint);padding:0 1.5cqw;position:relative;z-index:1}.l-blueprint .top{display:flex;justify-content:space-between;margin-bottom:4cqw}.l-code{background:#141826;color:#d9e1f2;font:400 4.2cqw/1.62 var(--sb-mono);padding-top:17cqw}.l-code .file{margin:0 0 4cqw;font:500 3.6cqw/1 var(--sb-mono);color:#8f9bb8}.l-code .file b{color:#e8f0ff;font-weight:500}.l-code .ln{white-space:pre;opacity:0}.l-code.play .ln{animation:sb-type .3s ease forwards;animation-delay:calc(var(--d) * .17s)}@keyframes sb-type{0%{opacity:0;transform:translateX(-4px)}to{opacity:1;transform:none}}.l-code .k{color:#c4a7ff}.l-code .t{color:#8fd3c7}.l-code .s{color:#f2c27a}.l-tested{background:var(--paper)}.l-tested .faded{flex:1 1;opacity:.18;filter:grayscale(.6)}.l-tested .checks{position:absolute;left:7cqw;right:7cqw;top:30%;display:flex;flex-direction:column;gap:3cqw;padding:5cqw;border-radius:4cqw;background:#ffffffee;box-shadow:0 10px 30px rgba(0,0,0,.12)}.l-tested .check{display:flex;justify-content:space-between;align-items:center;font:500 4.4cqw/1.2 var(--sb-sans);color:#2b2335;opacity:0}.l-tested .check b{color:#1f8a5b;font-weight:600}.l-tested.play .check{animation:sb-type .35s ease forwards;animation-delay:calc(var(--d) * .45s)}.l-tested .sum{margin:1cqw 0 0;font:600 5cqw/1 var(--sb-sans);color:#1f8a5b;text-align:center;opacity:0}.l-tested.play .sum{animation:sb-type .35s ease forwards;animation-delay:2s}.sb-home .book{position:absolute;inset:0;display:flex;flex-direction:column;padding:16cqw 7cqw 7cqw;background:var(--paper)}.sb-home .booktop{display:flex;justify-content:space-between;align-items:center;gap:2cqw;min-height:6cqw;margin-bottom:3cqw;font:500 3.6cqw/1 var(--sb-sans);color:#7a6f86}.sb-home .booktop .title{font:italic 600 5cqw/1 var(--sb-display);color:var(--book-ink)}.sb-home .bk-chip{display:inline-flex;align-items:center;gap:1.2cqw;padding:1.2cqw 2.4cqw;border-radius:99px;background:#efe9ff;color:#4c1d95;font:500 3.2cqw/1 var(--sb-sans);white-space:nowrap}.sb-home .pages{position:relative;flex:1 1;perspective:900px;touch-action:pan-y}.sb-home .pg{position:absolute;inset:0;display:flex;flex-direction:column;background:var(--paper);transform-origin:left center;transition:transform .8s cubic-bezier(.6,0,.2,1),opacity .8s ease;-webkit-backface-visibility:hidden;backface-visibility:hidden}.sb-home .pg.gone{transform:rotateY(-100deg);opacity:0}.sb-home .pic{border-radius:3cqw;overflow:hidden;background:#fff3d9}.sb-home .pic.night{background:#2a2350}.sb-home .words{margin:5cqw 0 0;font:500 6.6cqw/1.25 var(--sb-display);color:var(--book-ink)}.sb-home .words .hl{background:linear-gradient(transparent 60%,#fde68a 0)}.sb-home .booknav{margin-top:auto;display:flex;justify-content:space-between;align-items:center;min-height:10cqw}.sb-home .arrow{display:inline-grid;place-items:center;width:11cqw;height:9cqw;margin:0;padding:0;border:0;border-radius:3cqw;background:#2b2335;color:#fff;font:600 4.6cqw/1 var(--sb-sans);box-shadow:none;cursor:pointer}.sb-home .bdots{display:flex;gap:2cqw;margin:0 auto}.sb-home .bdots i{width:2.2cqw;height:2.2cqw;border-radius:50%;background:#d8cfe3}.sb-home .bdots i.is-on{background:#2b2335}.sb-home .readrow{display:flex;justify-content:center;min-height:9cqw;margin-top:2cqw}.sb-home .read{display:inline-flex;align-items:center;gap:1.5cqw;margin:0;border:0;border-radius:99px;background:#fde68a;color:#5a3a00;font:600 3.6cqw/1 var(--sb-sans);padding:2cqw 3.4cqw;box-shadow:none;cursor:pointer}.sb-home .h-vessel{display:flex;flex-direction:column;align-items:center;gap:14px;min-width:0}.sb-home .dev-stages{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;justify-content:center;gap:6px}.sb-home .dev-stages li{font:500 11px/1 var(--sb-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--sb-text-3);padding:7px 9px;border:1px solid var(--sb-line);border-radius:999px;transition:color .3s,border-color .3s,background .3s}.sb-home .dev-stages li.is-on{color:var(--sb-accent);border-color:rgba(var(--sb-accent-rgb),.5);background:rgba(var(--sb-accent-rgb),.08)}.sb-home .h-caption{font-size:13px;color:var(--sb-text-3);text-align:center;max-width:30em;margin:0}.sb-home .decide{display:grid;grid-template-columns:minmax(0,1fr) auto;grid-gap:56px;gap:56px;align-items:center}.sb-home .qs{display:flex;flex-direction:column;gap:22px;min-width:0}.sb-home .q h3{margin:0 0 10px;font:600 18px/1.3 var(--sb-sans);color:var(--sb-text)}.sb-home .opts{display:flex;flex-wrap:wrap;gap:8px}.sb-home .opt{margin:0;border:1px solid var(--sb-line);background:var(--sb-surface);color:var(--sb-text);border-radius:999px;padding:10px 16px;font:500 15px/1 var(--sb-sans);box-shadow:none;cursor:pointer;transition:border-color .2s,background .2s,color .2s}.sb-home .opt[aria-pressed=true]{border-color:var(--sb-accent);background:rgba(var(--sb-accent-rgb),.1);color:var(--sb-accent)}.sb-home .price{display:flex;flex-direction:column;gap:8px;padding:20px 22px;border:1px dashed rgba(var(--sb-accent-rgb),.55);border-radius:18px;background:var(--sb-surface);max-width:30em}.sb-home .price .v{font:500 12px/1 var(--sb-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--sb-accent)}.sb-home .price p{margin:0;color:var(--sb-text-2)}.sb-home .price b{color:var(--sb-text)}.sb-home .price.bump{animation:sb-bump .5s ease}@keyframes sb-bump{30%{transform:translateY(-4px);box-shadow:0 10px 30px rgba(var(--sb-accent-rgb),.18)}}.sb-home .yours{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-gap:56px;gap:56px;align-items:center}.sb-home .own{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:12px}.sb-home .own li{display:flex;gap:12px;color:var(--sb-text)}.sb-home .own li:before{content:"";flex:none;width:6px;height:6px;margin-top:10px;border-radius:50%;background:var(--sb-accent)}.sb-home .stagebox{position:relative;min-height:340px;display:grid;grid-template-columns:1fr 1fr;grid-gap:24px;gap:24px;align-items:center}.sb-home .minibook{justify-self:center;width:130px;aspect-ratio:3/4;border-radius:6px 14px 14px 6px;background:linear-gradient(90deg,#3b2a6b 0 10%,#5b3fa8 10%);box-shadow:var(--sb-card-shadow);display:flex;flex-direction:column;justify-content:flex-end;padding:14px;color:#fff;font:italic 600 18px/1.1 var(--sb-display)}.sb-home .minibook small{margin-top:6px;font:500 11px/1.2 var(--sb-sans);font-style:normal;opacity:.8}.sb-home .repo{border:1px solid var(--sb-line);border-radius:16px;background:var(--sb-surface);padding:16px;display:flex;flex-direction:column;gap:8px;box-shadow:var(--sb-card-shadow);min-width:0}.sb-home .repo .rt{display:flex;align-items:center;gap:8px;font:600 14px/1.2 var(--sb-sans);color:var(--sb-text);overflow-wrap:anywhere}.sb-home .repo ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:4px;font:400 12.5px/1.4 var(--sb-mono);color:var(--sb-text-2)}.sb-home .repo li{display:flex;justify-content:space-between;gap:8px}.sb-home .repo .live{display:inline-flex;align-items:center;gap:6px;margin-top:4px;font:500 13px/1 var(--sb-sans);color:var(--sb-accent)}.sb-home .flyer{position:absolute;font:500 12px/1 var(--sb-mono);color:var(--sb-text);background:var(--sb-surface);border:1px solid var(--sb-line);border-radius:8px;padding:6px 8px;opacity:0;pointer-events:none;box-shadow:0 6px 16px rgba(0,0,0,.08)}.sb-home .flying .flyer{animation:sb-fly 1.2s cubic-bezier(.5,0,.2,1) forwards;animation-delay:calc(var(--d) * .18s)}@keyframes sb-fly{0%{opacity:0;transform:translate(0) scale(.9)}15%{opacity:1}85%{opacity:1}to{opacity:0;transform:translate(var(--dx),var(--dy)) scale(.8)}}.sb-home .examples{display:flex;flex-wrap:wrap;gap:8px;margin-top:28px}.sb-home .examples span{border:1px solid var(--sb-line);border-radius:999px;padding:9px 14px;font-size:14px;color:var(--sb-text-2);background:var(--sb-surface)}.sb-opening{display:none}.sb-opening.op-out,html[data-opening] .sb-opening{display:block}html[data-opening="1"] .sb-home .page-part{opacity:0;transform:translateY(14px)}html[data-opening] .sb-home .h-hero .phone{visibility:hidden}.sb-home .page-part{transition:opacity .9s ease,transform .9s cubic-bezier(.2,.7,.2,1)}.sb-opening{position:fixed;inset:0;z-index:70;overflow:hidden;background:radial-gradient(60% 60% at 50% 45%,rgba(var(--sb-accent-rgb),.1),transparent 70%),var(--sb-bg);transition:background .6s ease}.sb-opening.clearing{background:transparent}.sb-opening.op-out{opacity:0;visibility:hidden;transition:opacity .6s ease,visibility 0s .6s}.sb-opening .op-dust{position:absolute;inset:0;pointer-events:none}.sb-opening .op-center{position:absolute;left:50%;top:46%;transform:translate(-50%,-50%);width:min(760px,calc(100% - 32px));text-align:center;display:flex;flex-direction:column;align-items:center;gap:16px;z-index:3;transition:opacity .6s ease,transform .8s cubic-bezier(.5,0,.2,1)}.sb-opening .op-center.up{opacity:0;transform:translate(-50%,-70%)}.sb-opening .op-title{margin:0;font:500 clamp(46px,7.4vw,104px)/1 var(--sb-display);letter-spacing:-.015em;color:var(--sb-text)}.sb-opening .op-title em{font-style:italic;color:var(--sb-accent)}.sb-opening .op-title>span{display:inline-block;opacity:0}.sb-opening .op-sub{margin:0;font:500 clamp(17px,1.6vw,21px)/1.4 var(--sb-sans);color:var(--sb-text-2);opacity:0;transition:opacity .5s ease}.sb-opening .op-sub.is-on{opacity:1}.sb-opening .op-say{position:absolute;left:50%;bottom:calc(5% + env(safe-area-inset-bottom,0px));transform:translate(-50%,10px);z-index:6;width:min(40em,calc(100% - 32px));margin:0;text-align:center;font:italic 500 clamp(22px,2.4vw,30px)/1.2 var(--sb-display);color:var(--sb-text);opacity:0;transition:opacity .6s ease,transform .6s ease}.sb-opening .op-say.is-on{opacity:1;transform:translate(-50%)}.sb-opening .frag{position:absolute;left:var(--x);top:var(--y);z-index:2;opacity:0;will-change:transform}.sb-opening .fl{animation:sb-float var(--dur,7s) ease-in-out infinite alternate;animation-delay:var(--del,0s)}@keyframes sb-float{0%{transform:translateY(-6px) rotate(-.6deg)}to{transform:translateY(8px) rotate(.8deg)}}.sb-opening .paper{position:relative;transform:rotate(var(--r,0deg)) scale(var(--s,1));filter:blur(var(--b,0));box-shadow:0 14px 34px rgba(30,20,60,.16);transition:filter .6s ease,opacity .6s ease}.sb-opening .frag.glint .paper:after{content:"";position:absolute;inset:0;border-radius:inherit;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.85) 48%,transparent 66%);background-size:250% 100%;animation:sb-glint .7s ease forwards;pointer-events:none}@keyframes sb-glint{0%{background-position:120% 0}to{background-position:-30% 0}}.sb-opening .frag.fall .paper{filter:blur(5px);opacity:.25}.sb-opening .hand{font-family:var(--hand);font-weight:600;color:#3a2f55}.sb-opening .note-sticky{width:180px;padding:22px 16px 18px;background:#fde68a;font-size:24px;line-height:1.05;color:#4a3a00}.sb-opening .note-sticky:before{content:"";position:absolute;left:50%;top:-10px;width:70px;height:20px;margin-left:-35px;background:rgba(255,255,255,.55);transform:rotate(-4deg)}.sb-opening .napkin{width:210px;padding:14px;background:#fff;border-radius:8px;background-image:radial-gradient(circle at 78% 72%,transparent 21px,rgba(160,110,60,.28) 22px,rgba(160,110,60,.12) 25px,transparent 27px)}.sb-opening .graph svg,.sb-opening .napkin svg,.sb-opening .note-board svg{display:block;width:100%;height:auto}.sb-opening .napkin p{margin:6px 0 0;font-size:20px;color:#4b3f63}.sb-opening .polaroid{width:150px;padding:10px 10px 30px;background:#fff}.sb-opening .polaroid .shot{aspect-ratio:1;background:#f1ede4;display:grid;place-items:center}.sb-opening .polaroid p{position:absolute;left:0;right:0;bottom:6px;margin:0;text-align:center;font-size:19px;color:#4b3f63}.sb-opening .bubble{max-width:220px;padding:12px 16px;background:#fff;border-radius:18px;font-size:22px;line-height:1.05;color:#3a2f55}.sb-opening .bubble:before{content:"";position:absolute;left:24px;bottom:-10px;border:10px solid transparent;border-top-color:#fff;border-bottom:0}.sb-opening .icard{width:200px;padding:14px 14px 12px;background:#fff;background-image:linear-gradient(#f2b8b8,#f2b8b8),repeating-linear-gradient(180deg,transparent 0 23px,#d6e4f5 23px 24px);background-size:100% 1px,100% 100%;background-position:0 30px,0 6px;background-repeat:no-repeat,repeat;font-size:21px;line-height:24px;color:#3a2f55}.sb-opening .note-board{width:220px;padding:14px;background:#fff;border-radius:10px;box-shadow:inset 0 0 0 6px #e8e6ef,0 14px 34px rgba(30,20,60,.16)}.sb-opening .graph{width:170px;padding:12px;background:#fff;background-image:linear-gradient(#e3ecf7 1px,transparent 0),linear-gradient(90deg,#e3ecf7 1px,transparent 0);background-size:12px 12px}.sb-opening .graph p{margin:0;font-size:20px;color:#3a2f55}.sb-opening .zoe-page{width:170px;aspect-ratio:9/18.4;border-radius:10px;overflow:hidden;container-type:inline-size;background:#fffdf6}.sb-opening .wand{position:absolute;left:0;top:0;width:176px;height:176px;z-index:4;pointer-events:none;opacity:0}.sb-opening .wand-glow{animation:sb-glow 1.4s ease-in-out infinite alternate;transform-origin:148px 12px}@keyframes sb-glow{0%{opacity:.75;transform:scale(.85)}to{opacity:1;transform:scale(1.15)}}.sb-opening .wand svg{display:block;width:100%;height:100%;overflow:visible}.sb-opening .op-phone{position:absolute;z-index:5;border-radius:44px;padding:11px;background:linear-gradient(160deg,#2a3042,#141824 40%,#1c2131);box-shadow:0 0 0 1px #343b50,var(--sb-phone-shadow),0 0 90px rgba(var(--sb-accent-rgb),.35);opacity:0;pointer-events:none}.sb-opening .op-screen{position:relative;width:100%;height:100%;border-radius:34px;overflow:hidden;container-type:inline-size;background:#fffdf6}.sb-opening .op-skip{position:absolute;z-index:6;right:calc(20px + env(safe-area-inset-right,0px));bottom:calc(20px + env(safe-area-inset-bottom,0px));margin:0;background:color-mix(in srgb,var(--sb-bg) 70%,transparent);border:1px solid var(--sb-line);color:var(--sb-text-2);border-radius:999px;padding:9px 16px;font:500 14px/1 var(--sb-sans);box-shadow:none;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}@media (max-width:860px){.sb-home .decide,.sb-home .yours{grid-template-columns:minmax(0,1fr);gap:36px}.sb-home .decide .phone{justify-self:center}.sb-home .stagebox{min-height:280px}}@media (max-width:760px){.sb-opening .frag.desk{display:none}.sb-opening .note-sticky{width:130px;font-size:19px;padding:16px 12px 12px}.sb-opening .bubble{max-width:150px;font-size:17px;padding:9px 12px}.sb-opening .napkin{width:150px}.sb-opening .napkin p{font-size:16px}.sb-opening .zoe-page{width:120px}.sb-opening .wand{width:112px;height:112px}.sb-opening .op-center{top:50%}}@media (prefers-reduced-motion:reduce){.sb-home .layer.developing,.sb-home .sweep.go,.sb-opening .fl{animation:none}}