:root{--blue:#2859ed;--ink:#20242e;--muted:#656b78;--line:#dfe1e6;--canvas:#f2f3f5;--yellow:#f1ff89;--lilac:#e6e2ff;--mono:Consolas,"SFMono-Regular",monospace;--sans:"PingFang TC","Noto Sans TC","Microsoft JhengHei",sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:140px}body{margin:0;background:var(--canvas);color:var(--ink);font-family:var(--sans);font-size:15px;line-height:1.75;-webkit-font-smoothing:antialiased}a{color:inherit;text-decoration:none}button{font:inherit;cursor:pointer}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid #cc3c8c;outline-offset:5px}h1,h2,h3,p,figure{margin:0}h1,h2,h3{line-height:1.3}ul,ol{padding:0;margin:0}button{border:0}::selection{background:var(--yellow);color:var(--ink)}.mono,.eyebrow,.frame-label,.row-code{font-family:var(--mono)}.skip{position:fixed;z-index:100;top:-80px;left:16px;padding:12px 24px;background:var(--yellow)}.skip:focus{top:12px}.toolbar{height:80px;position:fixed;z-index:30;top:0;inset-inline:0;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 30px;gap:24px}.brand{display:flex;align-items:center;gap:12px;font-size:18px;line-height:1.45;font-weight:600}.brand b{font-weight:600;letter-spacing:-.3px}.brand small{display:block;font-size:11px;font-weight:400;color:var(--muted);margin-top:4px;letter-spacing:1px}.file-name{font-family:var(--mono);color:#666c76;font-size:11px;display:flex;align-items:center;gap:12px}.file-dot{width:7px;height:7px;border-radius:50%;background:var(--blue)}.file-divider{color:#b5b8c0;margin:0 8px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:28px;background:var(--blue);color:white;padding:15px 22px;font-weight:600;font-size:14px;transition:background .2s,transform .2s}.button span{font-size:22px;font-weight:400;line-height:1}.button:hover{background:#1946cf;transform:translateY(-2px)}.button.small{font-size:12px;padding:10px 15px;gap:25px}.layers{position:fixed;left:0;top:80px;bottom:0;width:182px;z-index:15;background:#fafbfc;border-right:1px solid var(--line);font-size:11px}.layers-title{padding:24px 18px 18px;font-size:12px;font-weight:600;display:flex;justify-content:space-between}.layers-title span{font-family:var(--mono);font-weight:400;color:var(--muted);font-size:10px}.page-name{margin:0 12px 15px;background:#edeff3;padding:9px 7px}.page-name span{margin-right:7px}.layers nav a{display:flex;align-items:center;padding:11px 15px;color:#626773;white-space:nowrap}.layers nav a>span{font-size:17px;margin-right:8px;color:#848a97}.layers nav a:hover{background:#eff2fc}.layers nav a.active{background:#e6edff;color:var(--blue);box-shadow:inset 2px 0 var(--blue)}.layers nav a.active>span{color:var(--blue)}.layer-bottom{position:absolute;bottom:25px;left:18px;right:12px}.layer-bottom p{font-size:10px;margin:12px 0 4px}.layer-bottom>.mono{font-size:8px;color:#737986}.avatars{display:flex;padding-left:5px}.avatars span{border:2px solid #fafbfc;width:28px;height:28px;border-radius:50%;display:grid;place-items:center;margin-left:-5px;background:var(--yellow)}.avatars span:nth-child(2){background:#eec5e8}.avatars span:nth-child(3){background:#ffd8b9}.ruler-top{position:fixed;z-index:20;top:80px;left:182px;right:0;height:27px;border-bottom:1px solid #daddE3;background:repeating-linear-gradient(90deg,#b7bcc7 0 1px,transparent 1px 10px) left bottom/100% 5px no-repeat,#eff0f3;display:flex;justify-content:space-between;padding:0 14px;color:#777d88;font:8px/18px var(--mono)}.ruler-side{position:fixed;left:182px;top:107px;bottom:0;width:24px;border-right:1px solid #daddE3;background:repeating-linear-gradient(0deg,#b7bcc7 0 1px,transparent 1px 10px) right top/5px 100% no-repeat,#eff0f3;z-index:10}.workspace{margin-left:206px;padding:164px 48px 20px;background-image:radial-gradient(#c6cbd5 .7px,transparent .7px);background-size:12px 12px}.artboard{position:relative;background:#fff;margin:0 auto 78px;max-width:1180px;box-shadow:0 5px 16px #282f4107;scroll-margin-top:30px}.frame-label{position:absolute;top:-28px;left:0;right:0;display:flex;align-items:center;justify-content:space-between;gap:10px;color:#636b7d;font-size:10px;letter-spacing:.2px;line-height:18px}.frame-label>span:last-child{font-size:8px;letter-spacing:1px}.selected{outline:1.5px solid var(--blue)}.selected>.frame-label{color:var(--blue)}.handles{position:absolute;inset:0;pointer-events:none;z-index:5}.handles i{position:absolute;width:7px;height:7px;border:1px solid var(--blue);background:#fff}.handles i:nth-child(1){left:-4px;top:-4px}.handles i:nth-child(2){left:50%;top:-4px}.handles i:nth-child(3){right:-4px;top:-4px}.handles i:nth-child(4){right:-4px;top:50%}.handles i:nth-child(5){right:-4px;bottom:-4px}.handles i:nth-child(6){left:50%;bottom:-4px}.handles i:nth-child(7){left:-4px;bottom:-4px}.handles i:nth-child(8){left:-4px;top:50%}.hero{display:grid;grid-template-columns:1.12fr 1fr;overflow:visible}.hero-copy{padding:57px 0 48px 44px;z-index:2}.eyebrow{font-size:10px;letter-spacing:1.3px;font-weight:500;color:var(--blue);line-height:1.6;margin-bottom:26px}.hero .eyebrow{font-size:8px;letter-spacing:1.1px;display:flex;gap:8px;align-items:center}.eyebrow>span{display:inline-block;width:6px;height:6px;background:var(--blue)}h1{font-size:clamp(44px,4.22vw,67px);font-weight:800;letter-spacing:-3px;line-height:1.32;white-space:nowrap}.marked{color:var(--blue);position:relative}.marked:after{content:"";position:absolute;left:0;right:0;bottom:0;height:4px;background:var(--yellow);z-index:-1}.hero-description{font-size:13px;line-height:1.9;color:#5e6471;margin-top:28px;margin-bottom:28px}.micro{font-size:9px;color:var(--muted);margin-top:16px}.micro>span{margin:0 5px;color:#b1b4bd}.hero-visual{position:relative;min-width:0;background:#eeebff;margin:18px 18px 18px 16px;overflow:hidden;min-height:510px}.visual-caption{position:absolute;left:24px;top:22px;font-size:8px;letter-spacing:1px;color:#5d538a}.orbit{border:1px solid #d7d0f3;border-radius:50%;position:absolute;width:470px;height:470px;left:-90px;top:60px}.orbit-two{width:330px;height:330px;left:-15px;top:130px}.sample-browser{position:absolute;left:23px;top:103px;width:370px;background:#fff;border:1px solid #aaa5c4;transform:rotate(-7deg);box-shadow:0 18px 25px #4a377c13}.browser-bar{display:flex;align-items:center;justify-content:space-between;padding:11px 14px;border-bottom:1px solid #e5e2ef;font:6px var(--mono)}.browser-bar>span:first-child{color:#c6c2d4;font-size:5px;letter-spacing:2px}.sample-content{height:228px;position:relative;padding:28px 24px;overflow:hidden}.sample-kicker{font:5px var(--mono);letter-spacing:1px}.sample-heading{margin-top:15px;font-size:28px;font-weight:800;letter-spacing:-1px;line-height:1.25;position:relative;z-index:2}.sample-rule{width:90px;height:4px;background:#dddde4;margin-top:15px}.sample-link{font-size:7px;background:var(--blue);color:#fff;display:inline-block;margin-top:13px;padding:6px 9px}.sculpture{position:absolute;width:190px;height:190px;right:-25px;bottom:12px}.shape{position:absolute}.shape-blue{width:95px;height:150px;right:30px;top:0;border-radius:55px;background:var(--blue);transform:rotate(35deg)}.shape-yellow{width:140px;height:74px;bottom:12px;left:-10px;background:#e4f85b;border-radius:90px;transform:rotate(-28deg)}.shape-white{height:60px;width:60px;right:38px;bottom:33px;background:#eeebff;border-radius:50%;box-shadow:inset -7px -7px 0 #d6d1f2}.sample-footer{display:flex;justify-content:space-between;background:#f9f9fc;padding:13px 24px;font:5px var(--mono);border-top:1px solid #eeedf3}.sample-phone{position:absolute;right:20px;top:236px;width:136px;background:#fff;border:4px solid #343047;box-shadow:0 15px 25px #312b6c23;border-radius:19px;padding:10px 11px 14px;transform:rotate(9deg);z-index:2}.phone-bar{height:3px;width:26px;border-radius:4px;background:#343047;margin:0 auto 13px}.phone-brand{display:block;font:5px var(--mono);margin-bottom:14px}.sample-phone strong{display:block;font-size:16px;line-height:1.25;letter-spacing:-.5px}.phone-art{position:relative;height:74px;background:#eeebff;margin:12px 0;overflow:hidden}.phone-art i{position:absolute;height:90px;width:45px;background:var(--blue);border-radius:50px;transform:rotate(35deg);left:22px;top:-7px}.phone-art b{position:absolute;height:40px;width:80px;background:#e4f85b;border-radius:50%;transform:rotate(-25deg);top:38px;left:25px}.phone-lines{height:11px;background:repeating-linear-gradient(#dfe1e7 0 3px,transparent 3px 7px);width:80px}.phone-cta{display:block;background:var(--blue);color:#fff;font-size:6px;padding:5px 7px;margin-top:12px}.collab-cursor{position:absolute;z-index:4;display:flex;align-items:flex-end;pointer-events:none}.collab-cursor svg{width:22px;height:28px;stroke:white;stroke-width:1.5;fill:currentColor}.collab-cursor>span{font-size:10px;color:#fff;padding:2px 8px;border-radius:3px;margin-left:-4px;margin-bottom:-16px}.design{color:#b82d83;left:32px;top:200px;animation:design-drift 9s ease-in-out infinite}.design>span{background:#b82d83}.engineer{color:#b44b09;right:17px;top:425px;animation:engineer-drift 11s ease-in-out infinite}.engineer>span{background:#b44b09}.sticky-note{position:absolute;left:20px;bottom:43px;background:var(--yellow);padding:16px 18px;transform:rotate(-6deg);box-shadow:3px 6px 0 #393a5910;font-size:20px;font-weight:700;line-height:1.45;z-index:3}.sticky-note>span{display:block;font-size:8px;font-weight:400;margin-bottom:9px}.sticky-note i{display:block;font-style:normal;font-size:7px;font-weight:400;margin-top:10px}.visual-dimension{position:absolute;bottom:15px;right:15px;font-size:7px;color:#696187}.hero-bottom{grid-column:1/-1;display:flex;gap:24px;border-top:1px solid var(--line);padding:17px 28px;font-size:10px;color:#5e6573}.hero-bottom>span:not(:last-child):before{content:"";display:inline-block;height:5px;width:5px;border:1px solid #7e8491;margin-right:8px}.hero-bottom>.mono{margin-left:auto;font-size:8px;letter-spacing:1px}h2{font-size:38px;font-weight:750;letter-spacing:-1.4px;line-height:1.4}h3{font-size:17px;letter-spacing:-.3px}.scope,.flow{padding:48px 44px}.section-heading{display:grid;grid-template-columns:1fr 1fr}.section-heading>.eyebrow{grid-column:1/-1;margin-bottom:16px}.section-heading>p:last-child{font-size:13px;color:var(--muted);align-self:end;justify-self:end;padding-bottom:5px}.scope-layout{display:grid;grid-template-columns:1.5fr 1fr;gap:36px;margin-top:35px}.scope-list article{display:flex;gap:16px;align-items:flex-start;border-top:1px solid var(--line);padding:24px 0}.scope-list article:last-child{border-bottom:1px solid var(--line)}.row-icon{font-family:var(--mono);width:27px;height:29px;font-size:23px;color:var(--blue);line-height:29px;flex-shrink:0}.scope-list h3{font-size:16px;margin-bottom:7px}.scope-list p{font-size:12px;line-height:1.9;color:var(--muted)}.row-code{font-size:7px;letter-spacing:.5px;color:#818795;padding-top:6px;margin-left:auto;min-width:52px}.scenario{background:#f1f0f9;padding:25px 26px 22px;position:relative;align-self:stretch}.scenario-top{display:flex;align-items:center;gap:10px;font-size:10px;line-height:1.5}.scenario-top small{font-size:8px;color:var(--muted)}.comment-pin{display:grid;place-items:center;background:var(--blue);color:#fff;height:32px;width:32px;border-radius:50% 50% 50% 0;font-size:12px}.scenario h3{font-size:20px;line-height:1.6;margin:23px 0 14px}.scenario p{font-size:12px;line-height:1.9;color:#656577}.scenario-path{display:flex;align-items:center;justify-content:center;flex-direction:column;margin:20px 0;gap:4px}.scenario-path>span{padding:5px 18px;font-size:10px;border:1px solid #c7c4db;background:white;min-width:130px;text-align:center}.scenario-path>i{font-size:12px;font-style:normal;color:#a09bb7}.scenario-path>.path-blue{color:var(--blue);border-color:var(--blue);background:#e8ecff}.scenario-foot{padding-top:15px;border-top:1px dashed #c8c4d9;font-size:10px!important}.demo{background:#e8e5fa;padding:42px 44px 26px}.demo-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;margin-bottom:30px}.demo-heading .eyebrow{font-size:9px;margin-bottom:15px}.demo-heading>p{font-size:12px;color:#605d75;margin-bottom:5px}.demo-tools{display:flex;justify-content:space-between;gap:12px;margin-bottom:16px}.mode-switch,.size-switch{display:flex;gap:3px;background:#dcd8ef;border:1px solid #d1cce8;padding:3px}.mode-switch button,.size-switch button{background:transparent;color:#666077;padding:8px 17px;font-size:10px}.mode-switch button[aria-pressed="true"],.size-switch button[aria-pressed="true"]{background:#fff;color:var(--blue);box-shadow:0 2px 4px #2e255a0a}.preview-stage{background-image:radial-gradient(#bdb7d7 .7px,transparent .7px);background-size:12px 12px;min-height:394px;border:1px solid #cdc7e4;padding:28px 40px 42px;display:flex;align-items:center;justify-content:center;position:relative}.demo-site{background:#fbffed;width:100%;max-width:760px;border:1px solid #252923;box-shadow:7px 7px 0 #756b9d16;transition:width .45s,background .3s}.demo-nav{display:flex;justify-content:space-between;align-items:center;padding:14px 23px;border-bottom:1px solid #d8decc;font-size:11px}.demo-nav b>span{font-size:6px;vertical-align:top;margin-left:2px}.demo-nav>span{font:6px var(--mono)}.demo-site-body{display:grid;grid-template-columns:1fr 1fr}.demo-copy{padding:27px 26px}.demo-copy>.mono{font-size:6px;letter-spacing:.6px}.demo-copy h3{font-size:36px;letter-spacing:-1.5px;line-height:1.2;margin:13px 0}.demo-copy p{font-size:9px;color:#636c55}.demo-fake-button{display:inline-block;background:#26352b;color:#fff;font-size:8px;padding:8px 13px;margin-top:16px}.demo-art{background:#d9ed9d;position:relative;overflow:hidden;margin:14px}.demo-flower{position:absolute;width:155px;height:155px;left:50%;top:46%;transform:translate(-50%,-50%) rotate(-10deg);transition:transform .5s}.demo-art:hover .demo-flower{transform:translate(-50%,-50%) rotate(10deg)}.demo-flower i{position:absolute;width:80px;height:80px;border-radius:50%;background:#516d36;left:0;top:0}.demo-flower i:nth-child(2){left:75px}.demo-flower i:nth-child(3){top:75px}.demo-flower i:nth-child(4){left:75px;top:75px}.demo-flower b{position:absolute;inset:45px;border-radius:50%;background:#e9f8b8}.art-word{position:absolute;bottom:12px;left:17px;font-family:Georgia,serif;font-style:italic;font-size:23px;line-height:1;color:#294829}.demo-site-bottom{display:flex;justify-content:space-between;border-top:1px solid #d8decc;padding:10px 24px;font:6px var(--mono);letter-spacing:1px}.preview-badge{position:absolute;bottom:11px;left:50%;transform:translateX(-50%);font-size:8px;white-space:nowrap;color:#625a7d}.demo-caption{font-size:9px;color:#655d7f;margin-top:16px}.demo-caption>span{color:var(--blue);font-size:16px;margin-right:5px}.demo-site.wire{background:#fff}.wire .demo-art{background:linear-gradient(36deg,transparent 49.7%,#adb2bb 50%,transparent 50.3%),linear-gradient(-36deg,transparent 49.7%,#adb2bb 50%,transparent 50.3%),#f5f5f6;border:1px solid #b7bcc5}.wire .demo-flower,.wire .art-word{visibility:hidden}.wire .demo-copy h3{color:#777e88}.wire .demo-fake-button{color:#626973;background:#e6e8ec;border:1px solid #b8bec7}.wire .demo-nav,.wire .demo-site-bottom{border-color:#dfe1e6}.demo-site.mobile{width:245px}.mobile .demo-nav{padding:10px 15px}.mobile .demo-nav>span{display:none}.mobile .demo-site-body{grid-template-columns:1fr}.mobile .demo-copy{padding:20px}.mobile .demo-copy h3{font-size:29px}.mobile .demo-art{height:165px;margin:0 15px 15px}.mobile .demo-flower{transform:translate(-50%,-50%) scale(.7) rotate(-10deg)}.mobile .demo-site-bottom{padding:10px;font-size:5px;letter-spacing:0}.mobile .art-word{font-size:20px}.flow-heading{display:flex;justify-content:space-between;gap:24px}.flow-heading .eyebrow{margin-bottom:16px}.flow-note{transform:rotate(4deg);background:var(--yellow);padding:16px 22px;align-self:center;font-size:12px;line-height:1.9;box-shadow:3px 4px 0 #23272f08}.flow-note>span{font-size:9px}.flow-note p{margin-top:7px}.steps{display:grid;grid-template-columns:repeat(4,1fr);list-style:none;margin-top:40px;border:1px solid var(--line)}.steps li{padding:24px 20px;position:relative}.steps li+li{border-left:1px solid var(--line)}.steps li:not(:last-child):after{content:"→";position:absolute;top:31px;right:-12px;background:#fff;color:var(--blue);width:23px;text-align:center;z-index:1}.step-top{display:flex;align-items:center;gap:12px}.step-top>span{font:30px var(--mono);color:var(--blue);letter-spacing:-2px}.step-top>i{font:7px var(--mono);letter-spacing:1px;color:var(--muted)}.steps h3{font-size:15px;margin-top:25px;white-space:nowrap}.steps p{font-size:11px;line-height:1.9;color:var(--muted);margin-top:13px}.step-result{display:block;color:var(--blue);font-size:9px;margin-top:22px}.inline-cta{margin-top:28px;display:flex;justify-content:space-between;align-items:center;gap:20px}.inline-cta p{font-size:13px}.inline-cta p span{display:block;font-size:10px;color:var(--muted);margin-top:4px}.text-link{font-size:12px;color:var(--blue);border-bottom:1px solid var(--blue);padding:6px 0;white-space:nowrap}.handoff{display:grid;grid-template-columns:1fr 265px}.handoff-main{padding:46px 40px}.handoff .eyebrow{font-size:9px;margin-bottom:18px}.handoff h2{font-size:34px}.input-output{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:35px}.panel-label{font-size:9px;color:var(--blue)}.check-list{list-style:none;margin-top:15px}.check-list li{font-size:11px;color:#656b78;margin:10px 0;display:flex;align-items:baseline;gap:7px}.check-list li:before{content:"✓";color:var(--blue)}.boundary{margin-top:28px;padding-top:22px;border-top:1px solid var(--line)}.boundary h3{font-size:14px}.boundary h3>span{color:#9d4770;margin-right:6px}.boundary ul{list-style:none;margin:14px 0}.boundary li{font-size:11px;color:#656b78;margin:6px 0;display:flex;gap:8px}.boundary li:before{content:"–";color:#9a9eaa}.boundary>p{font-size:10px;color:var(--muted)}.inspector{border-left:1px solid var(--line);background:#fbfbfd;font-size:11px;display:flex;flex-direction:column}.inspector-title{padding:17px 22px;display:flex;justify-content:space-between;border-bottom:1px solid var(--line);font-weight:600}.inspector-title>span{color:var(--blue)}.property{padding:19px 22px;border-bottom:1px solid var(--line)}.property>span{display:block;font:8px var(--mono);letter-spacing:.5px;color:var(--muted);margin-bottom:12px}.property strong{font-size:13px;font-weight:600}.property-tags{display:flex;gap:5px;margin-top:12px}.property-tags b{background:#edeef4;font:9px var(--mono);padding:5px 8px;color:#666a7b}.property-value{display:flex;align-items:center;gap:12px}.property-value i{font:20px var(--mono);color:var(--blue)}.spacing-demo{display:flex;gap:5px;margin-top:10px;height:20px}.spacing-demo i{background:#e6ebfe;border:1px solid #c8d4fd;flex:1}.swatches{display:flex;gap:7px}.swatches i{width:29px;height:29px;background:var(--blue);border:1px solid #0000000c}.swatches i:nth-child(2){background:var(--lilac)}.swatches i:nth-child(3){background:var(--yellow)}.swatches i:nth-child(4){background:white}.font-sample{font-size:24px;font-weight:600;margin-top:12px;line-height:1.3}.font-sample>span{display:block;font-size:9px;font-weight:400;margin-top:6px;color:var(--muted)}.ownership{background:#f0f3ff;flex:1}.ownership strong{font-size:21px;line-height:1.4;letter-spacing:-.5px;color:var(--blue)}.ownership p{font-size:9px;color:#65708a;margin-top:10px}.inspector-footer{padding:12px 22px;font-size:8px;color:var(--blue);letter-spacing:1px}.faq{padding:45px 40px;display:grid;grid-template-columns:.9fr 1.4fr;gap:40px}.faq .eyebrow{font-size:9px;margin-bottom:20px}.faq h2{font-size:33px}.faq-intro>p:last-child{font-size:11px;color:var(--muted);margin-top:20px}.faq-sticker{font:bold 70px Georgia,serif;color:var(--blue);background:var(--lilac);display:grid;place-items:center;width:95px;height:95px;margin-top:30px;transform:rotate(-9deg);border:1px solid #d5cff6}.questions{border-top:1px solid var(--line)}details{border-bottom:1px solid var(--line)}summary{display:flex;align-items:center;gap:11px;cursor:pointer;list-style:none;padding:20px 0;font-size:12px;line-height:1.6;font-weight:500}summary::-webkit-details-marker{display:none}summary>span{font:9px var(--mono);color:#858b99}summary>i{font:18px var(--mono);margin-left:auto;color:var(--blue);flex-shrink:0}details[open]>summary>i{transform:rotate(45deg)}details[open]>summary{color:var(--blue);padding-bottom:12px}details p{font-size:12px;line-height:1.9;padding:0 8px 22px 25px;color:var(--muted)}.contact{padding:42px 44px;display:flex;align-items:center;justify-content:space-between;gap:24px;background:#f2ffb1;background-image:linear-gradient(90deg,#b6c87c1a 1px,transparent 1px),linear-gradient(#b6c87c1a 1px,transparent 1px);background-size:30px 30px}.contact .eyebrow{margin-bottom:16px}.contact h2{font-size:42px}.contact p:not(.eyebrow){font-size:12px;color:#626d44;margin-top:22px}.contact-action{display:flex;align-items:center;flex-direction:column;gap:14px;position:relative;padding-top:35px}.contact-action>.mono{font-size:9px;color:#606b43}.your-cursor{position:absolute;right:45px;top:-42px;font-size:55px;color:var(--blue);transform:rotate(-10deg)}.your-cursor>span{position:absolute;top:48px;left:33px;background:var(--blue);color:#fff;font-size:11px;padding:2px 12px;transform:rotate(10deg)}footer{max-width:1180px;margin:-25px auto 0;padding-bottom:10px}.footer-top,.footer-bottom{display:flex;justify-content:space-between;align-items:center;gap:20px}.footer-brand{font-size:18px;font-weight:700;letter-spacing:-.3px}.footer-top>.mono{font-size:8px;color:var(--muted);letter-spacing:1px}.products{font-size:10px;color:#666d7b;margin:21px 0;padding-bottom:22px;border-bottom:1px solid #d3d6dd}.footer-bottom{font-size:9px;color:#727987}.mobile-contact{display:none}@keyframes design-drift{0%,100%{transform:translate(0,0)}40%,65%{transform:translate(17px,-22px)}}@keyframes engineer-drift{0%,100%{transform:translate(0,0)}40%,65%{transform:translate(-17px,-18px)}}
@media(min-width:1550px){.workspace{padding-inline:70px}.hero-copy{padding-left:55px}.hero-visual{min-height:560px}.sample-browser{width:420px;left:35px}.sample-content{height:265px}.sample-heading{font-size:34px}.sample-phone{right:30px;top:265px}.sticky-note{bottom:48px;left:30px}.engineer{top:465px}.hero-description{font-size:15px}.hero-copy{padding-block:65px}.scope-list p{font-size:13px}.steps p{font-size:12px}}
@media(max-width:1200px) and (min-width:901px){.layers{width:155px}.ruler-top,.ruler-side{left:155px}.workspace{margin-left:179px;padding-inline:30px}.hero-copy{padding-left:30px}h1{font-size:46px}.hero-visual{margin-left:5px}.sample-browser{left:5px;width:315px}.sample-heading{font-size:24px}.sculpture{right:-60px}.sample-phone{right:10px;width:122px}.sticky-note{left:12px;font-size:17px}.scope,.flow{padding:38px 30px}.row-code{display:none}.scope-layout{gap:25px}.scenario{padding:22px 20px}.scenario h3{font-size:17px}.steps li{padding:22px 13px}.steps h3{font-size:13px}.step-top{gap:8px}.handoff{grid-template-columns:1fr 225px}.handoff-main{padding:38px 30px}.handoff h2{font-size:29px}.input-output{grid-template-columns:1fr;gap:12px}.check-list{margin-top:8px}.check-list li{margin:5px 0}.faq{padding:38px 30px;gap:25px}.contact h2{font-size:35px}.contact{padding:38px 30px}.contact-action .button{font-size:12px;padding:14px 15px;gap:12px}.demo{padding-inline:30px}.demo-copy h3{font-size:29px}.demo-flower{transform:translate(-50%,-50%) scale(.8)}}
@media(max-width:900px){.toolbar{height:70px;padding:0 20px}.file-name,.layers,.ruler-side{display:none}.ruler-top{left:0;top:70px;height:24px}.workspace{margin-left:0;padding:140px 30px 25px}.hero-copy{padding-left:30px}h1{font-size:49px}.hero-visual{margin-left:0}.hero{grid-template-columns:1.1fr 1fr}.sample-browser{width:315px;left:14px}.sample-phone{right:10px;width:122px}.sample-heading{font-size:24px}.sculpture{right:-50px}.sticky-note{font-size:18px;left:18px}.hero .eyebrow{font-size:6px}.hero-description{font-size:12px}.hero-visual{min-height:490px}.scope,.flow{padding:35px 30px}.section-heading h2{font-size:32px}.scope-layout{gap:25px}.row-code{display:none}.scenario{padding:24px 20px}.scenario h3{font-size:17px}.steps{grid-template-columns:repeat(2,1fr)}.steps li{padding:24px}.steps li:nth-child(3){border-left:0}.steps li:nth-child(n+3){border-top:1px solid var(--line)}.steps li:nth-child(2):after{display:none}.steps p{font-size:12px}.demo{padding:35px 30px 24px}.demo-heading h2{font-size:32px}.demo-heading>p{font-size:11px}.preview-stage{padding-inline:25px}.demo-copy h3{font-size:29px}.demo-flower{transform:translate(-50%,-50%) scale(.8)}.handoff{grid-template-columns:1fr 220px}.handoff-main{padding:35px 30px}.handoff h2{font-size:29px}.input-output{grid-template-columns:1fr;gap:14px}.check-list{margin-top:8px}.check-list li{margin:6px 0}.faq{padding:35px 30px;gap:25px;grid-template-columns:.8fr 1.2fr}.faq h2{font-size:29px}.contact{padding:35px 30px}.contact h2{font-size:34px}.contact-action .button{font-size:12px;gap:15px;padding:14px 16px}.hero-bottom{gap:17px;padding-inline:20px}.hero-bottom>.mono{font-size:6px}}
@media(max-width:600px){html{scroll-padding-top:105px}body{font-size:14px;padding-bottom:72px}.toolbar{height:66px;padding-inline:16px;gap:12px}.brand{font-size:16px;gap:8px}.brand small{font-size:9px;letter-spacing:.4px;margin-top:3px}.button.small{font-size:10px;padding:9px 10px;gap:10px}.button.small span{font-size:17px}.ruler-top{top:66px;height:24px;overflow:hidden;gap:45px;justify-content:start}.ruler-top span{flex-shrink:0}.workspace{padding:135px 19px 22px;background-size:10px 10px}.artboard{margin-bottom:63px;scroll-margin-top:20px}.frame-label{font-size:9px;top:-25px}.frame-label>span:last-child{font-size:6px;letter-spacing:.3px}.hero{display:flex;flex-direction:column}.hero-copy{padding:30px 24px 26px}.hero .eyebrow{font-size:7px;letter-spacing:.5px;margin-bottom:22px}h1{font-size:43px;letter-spacing:-2px;line-height:1.35}.hero-description{font-size:12px;line-height:1.9;margin:22px 0}.desktop-only{display:none}.hero .button{padding:13px 17px;font-size:12px;gap:35px}.micro{font-size:8px;margin-top:12px}.hero-visual{margin:0 12px 12px;min-height:402px}.visual-caption{font-size:7px;top:16px;left:16px}.sample-browser{width:278px;left:18px;top:66px}.browser-bar{padding:9px 12px}.sample-content{height:184px;padding:22px 17px}.sample-heading{font-size:23px}.sample-kicker{font-size:4px}.sample-rule{margin-top:12px}.sample-link{font-size:6px;margin-top:10px}.sculpture{transform:scale(.8);transform-origin:right bottom;right:-28px;bottom:10px}.sample-footer{padding:10px 17px}.sample-phone{width:111px;top:175px;right:18px;border-width:3px;border-radius:15px;padding:8px 9px 12px}.phone-bar{margin-bottom:11px}.phone-brand{margin-bottom:10px;font-size:4px}.sample-phone strong{font-size:13px}.phone-art{height:61px;margin:9px 0}.phone-lines{width:66px}.phone-cta{margin-top:8px;font-size:5px}.sticky-note{left:20px;bottom:33px;font-size:17px;padding:13px 14px}.sticky-note>span{font-size:7px;margin-bottom:7px}.sticky-note i{font-size:6px;margin-top:8px}.design{left:28px;top:144px}.engineer{top:324px;right:13px}.collab-cursor>span{font-size:8px}.collab-cursor svg{width:19px}.visual-dimension{font-size:6px;bottom:12px;right:11px}.orbit{width:370px;height:370px;top:26px}.orbit-two{width:250px;height:250px;left:-10px;top:85px}.hero-bottom{padding:12px 17px;gap:15px;font-size:8px;flex-wrap:wrap}.hero-bottom>span:not(:last-child):before{margin-right:5px;height:4px;width:4px}.hero-bottom>.mono{display:none}h2{font-size:29px;letter-spacing:-1px;line-height:1.4}.scope,.flow{padding:30px 24px}.eyebrow{font-size:8px;letter-spacing:.7px;margin-bottom:18px}.section-heading{display:block}.section-heading h2{font-size:29px}.section-heading>.eyebrow{margin-bottom:15px}.section-heading>p:last-child{font-size:11px;margin-top:18px}.scope-layout{display:block;margin-top:24px}.scope-list article{padding:21px 0;gap:13px}.scope-list h3{font-size:15px;margin-bottom:8px}.scope-list p{font-size:11px}.row-icon{font-size:22px;width:22px}.scenario{margin-top:28px;padding:23px}.scenario h3{font-size:20px;margin-top:21px}.scenario p{font-size:11px}.scenario-path{flex-direction:row;gap:5px;margin:23px -7px}.scenario-path>span{min-width:0;padding:7px 8px;font-size:8px;white-space:nowrap}.scenario-path>i{transform:rotate(-90deg);font-size:10px}.scenario-foot{font-size:10px!important}.scenario-foot br{display:none}.demo{padding:30px 17px 20px}.demo-heading{display:block;margin:0 7px 23px}.demo-heading h2{font-size:29px}.demo-heading .eyebrow{font-size:7px;letter-spacing:.5px}.demo-heading>p{font-size:11px;margin-top:18px}.demo-tools{gap:5px;margin-bottom:12px;flex-wrap:wrap}.mode-switch,.size-switch{padding:3px;gap:1px}.mode-switch button{padding:7px 9px;font-size:9px}.size-switch button{padding:7px 9px;font-size:9px}.preview-stage{min-height:260px;padding:18px 10px 32px}.demo-nav{padding:10px;font-size:8px}.demo-nav>span{font-size:4px}.demo-copy{padding:15px 12px}.demo-copy>.mono{font-size:4px;letter-spacing:0}.demo-copy h3{font-size:23px;letter-spacing:-1px;margin:12px 0}.demo-copy p{font-size:7px}.demo-fake-button{font-size:6px;padding:6px 8px;margin-top:12px}.demo-art{margin:8px 8px 8px 0}.demo-flower{transform:translate(-50%,-50%) scale(.55)}.demo-art:hover .demo-flower{transform:translate(-50%,-50%) scale(.55) rotate(10deg)}.art-word{font-size:17px;left:9px;bottom:12px}.demo-site-bottom{padding:8px 10px;font-size:4px;letter-spacing:.3px}.preview-badge{font-size:7px;bottom:9px}.demo-caption{font-size:9px;line-height:1.8}.demo-site.mobile{width:220px}.mobile .demo-nav{font-size:10px}.mobile .demo-copy>.mono{font-size:6px}.mobile .demo-copy p{font-size:9px}.mobile .demo-fake-button{font-size:8px}.flow-heading{display:block}.flow-note{margin:25px 2px 0 auto;max-width:237px;padding:13px 18px;font-size:11px;transform:rotate(2deg)}.flow-note p{margin-top:5px}.steps{display:block;margin-top:30px;border:0}.steps li{padding:23px 0 23px 48px;min-height:160px;border-top:1px solid var(--line)}.steps li+li{border-left:0}.steps li:last-child{border-bottom:1px solid var(--line)}.steps li:not(:last-child):after{content:"↓";left:4px;top:auto;bottom:14px;right:auto;font-size:16px}.steps li:nth-child(2):after{display:block}.step-top{position:absolute;left:0;top:22px;flex-direction:column;gap:6px;align-items:flex-start}.step-top>span{font-size:27px}.step-top>i{font-size:5px;letter-spacing:0}.steps h3{font-size:15px;margin:0}.steps p{font-size:11px;line-height:1.9;margin-top:10px}.step-result{font-size:9px;margin-top:13px}.inline-cta{display:block;margin-top:24px}.inline-cta p{font-size:12px}.inline-cta p span{font-size:10px;line-height:1.9;margin-top:7px}.text-link{display:inline-block;font-size:11px;margin-top:14px}.handoff{display:block}.handoff-main{padding:30px 24px}.handoff .eyebrow{font-size:7px;letter-spacing:.5px}.handoff h2{font-size:27px}.input-output{margin-top:26px;gap:19px}.panel-label{font-size:9px}.check-list li{font-size:11px;margin:8px 0}.boundary{margin-top:24px}.boundary h3{font-size:13px}.boundary li{font-size:10px;line-height:1.9}.boundary>p{font-size:10px}.inspector{border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr}.inspector-title{grid-column:1/-1;padding:14px 24px}.property{padding:18px 17px;min-width:0}.property:nth-child(3),.property:nth-child(5){border-left:1px solid var(--line)}.property>span{font-size:6px;letter-spacing:0}.property strong{font-size:11px}.property-tags b{font-size:8px;padding:4px 6px}.property-value{gap:7px;font-size:9px}.swatches{gap:5px}.swatches i{width:24px;height:24px}.font-sample{font-size:22px}.font-sample>span{font-size:8px}.ownership strong{font-size:20px}.ownership p{font-size:9px}.inspector-footer{grid-column:1/-1;padding:12px 24px}.faq{display:block;padding:30px 24px}.faq .eyebrow{font-size:8px;margin-bottom:16px}.faq-intro{position:relative}.faq h2{font-size:29px}.faq-sticker{position:absolute;right:0;top:50px;font-size:49px;width:65px;height:65px;margin:0}.faq-intro>p:last-child{font-size:11px;margin-top:18px}.questions{margin-top:25px}summary{font-size:11px;padding:19px 0;gap:9px}summary>span{font-size:8px}summary>i{font-size:16px}details p{font-size:11px;padding-left:22px}.contact{display:block;padding:30px 24px}.contact h2{font-size:33px}.contact .eyebrow{font-size:8px}.contact p:not(.eyebrow){font-size:11px;margin-top:18px}.contact-action{align-items:flex-start;margin-top:25px;padding-top:15px;gap:12px}.contact-action .button{font-size:12px;padding:14px 18px;gap:25px}.contact-action>.mono{font-size:8px}.your-cursor{top:-39px;right:18px;font-size:42px}.your-cursor>span{font-size:9px;top:39px;left:26px;padding:2px 10px}footer{margin-top:-18px;padding:0 5px 5px}.footer-top{display:block}.footer-brand{font-size:17px}.footer-top>.mono{display:block;font-size:7px;margin-top:9px}.products{font-size:9px;line-height:2;margin:17px 0;padding-bottom:17px}.footer-bottom{display:block;font-size:8px;line-height:1.8}.footer-bottom>span{display:block}.footer-bottom>span+span{margin-top:6px}.mobile-contact{position:fixed;z-index:25;bottom:0;inset-inline:0;display:flex;justify-content:space-between;align-items:center;background:var(--blue);color:#fff;padding:17px 22px;padding-bottom:max(17px,env(safe-area-inset-bottom));box-shadow:0 -3px 14px #34458515}.mobile-contact>span{font-size:10px;color:#d6e0ff}.mobile-contact>b{font-size:13px;font-weight:500}.preview-stage:has(.mobile){min-height:450px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
/* Readable content within the editor canvas. */
.hero-description{font-size:14px}.micro{font-size:10px}.section-heading>p:last-child{font-size:14px}.scope-list p,.scenario p{font-size:13px}.row-code{color:#676d7b}.scenario-foot{font-size:11px!important}.demo-heading>p{font-size:13px}.demo-caption{font-size:11px}.steps p{font-size:13px}.step-result{font-size:10px}.inline-cta p span{font-size:12px}.check-list li,.boundary li{font-size:13px}.boundary>p{font-size:12px}.panel-label{font-size:10px}.faq-intro>p:last-child{font-size:13px}summary{font-size:14px}summary>span{color:#687080}details p{font-size:13px}.contact p:not(.eyebrow){font-size:14px}.products{font-size:11px}.footer-bottom{font-size:10px}.preview-stage:before{content:"↔ 24";position:absolute;left:7px;top:7px;font:8px var(--mono);color:#a83c53;border-bottom:1px solid #b7566a;line-height:14px}.ruler-top{color:#646b77}.hero-bottom{font-size:11px}
@media(max-width:1200px) and (min-width:601px){.check-list li,.boundary li{font-size:12px}.steps p{font-size:12px}summary{font-size:12px}.hero-description{font-size:13px}.hero-bottom{font-size:10px}.demo-heading>p{font-size:12px}}
@media(max-width:600px){.hero-description{font-size:13px}.micro{font-size:9px}.hero-bottom{font-size:9px;gap:12px}.section-heading>p:last-child{font-size:13px}.scope-list p,.scenario p{font-size:13px}.scenario-foot{font-size:12px!important}.demo-heading>p{font-size:12px}.demo-caption{font-size:10px}.steps p{font-size:13px}.step-result{font-size:10px}.inline-cta p{font-size:13px}.inline-cta p span{font-size:12px}.text-link{font-size:12px}.check-list li{font-size:13px}.boundary li{font-size:12px}.boundary>p{font-size:11px}.panel-label{font-size:10px}.faq-intro>p:last-child{font-size:12px}summary{font-size:12px;gap:8px}details p{font-size:13px}.contact p:not(.eyebrow){font-size:12px}.products{font-size:10px}.footer-bottom{font-size:9px}.preview-stage:before{font-size:6px;left:3px;top:2px;line-height:10px}}

/* A complete design canvas: assets, prototypes, export and comments. */
:root{--blue:#2459ed;--canvas:#eef3ff;--yellow:#edff62;--lilac:#e9deff;--magenta:#bd146e;--orange:#b8460b}
.workspace{background-image:radial-gradient(#a6bce9 .8px,transparent .8px)}
.layers{background:#f7f9ff}.ruler-top,.ruler-side{background-color:#e5edff}
.artboard{outline:1px solid #9db7ff;margin-bottom:100px;transition:outline-color .25s,box-shadow .25s}
.artboard.selected{outline:2px solid var(--blue);box-shadow:0 8px 28px #2459ed15}
.artboard>.frame-label{color:#355aa7}.artboard.selected>.frame-label{color:var(--blue)}
.artboard>.handles i{border-color:#7598f6;transition:background .25s,transform .25s}
.artboard.selected>.handles i{border-color:var(--blue);background:var(--yellow);transform:scale(1.2)}
.artboard:not(.contact):after{content:"↕ 64";position:absolute;bottom:-75px;left:50%;height:50px;display:flex;align-items:center;border-left:1px solid #d22f57;padding-left:8px;color:#b51a41;font:11px var(--mono);background:linear-gradient(#d22f57,#d22f57) top left/7px 1px no-repeat,linear-gradient(#d22f57,#d22f57) bottom left/7px 1px no-repeat;pointer-events:none}
.frame-label{cursor:grab}.artboard:has(>.frame-label:hover){box-shadow:0 9px 28px #2459ed21}
.board-meta{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;border-top:1px dashed #9db7ff;padding-top:18px;margin-top:30px;--cursor-color:var(--magenta);position:relative}
.board-meta.orange{--cursor-color:var(--orange)}.board-meta.blue{--cursor-color:var(--blue)}
.board-annotation{display:flex;gap:12px;align-items:center;min-height:36px}
.parked-cursor{display:flex;align-items:center;gap:2px;color:var(--cursor-color);animation:annotation-drift 7s ease-in-out infinite}
.parked-cursor svg{height:25px;width:22px;fill:currentColor;stroke:#fff;stroke-width:1.2}
.parked-cursor b{font-size:11px;font-weight:500;padding:2px 9px;background:var(--cursor-color);color:#fff;margin-top:12px}
.note-pin{display:flex;align-items:center;gap:7px;background:var(--yellow);border:1px solid #7f8d30;border-radius:15px 15px 15px 2px;color:#394513;min-height:36px;padding:4px 10px;font:12px var(--mono)}
.note-pin>span{font:11px var(--sans)}.note-pin:hover,.note-pin[aria-expanded=true]{background:#d7ef36}
.dimension{background:#e5edff;border:1px solid #a2bcff;padding:4px 7px;color:#244ba8;font-size:10px;white-space:nowrap}.dimension-mobile{display:none}
.board-note{flex-basis:100%;font-size:13px;padding:14px 18px;background:#f4ffae;border-left:3px solid #9eb522;color:#394513}.board-note[hidden]{display:none}
.hero>.board-meta{margin:0;padding:16px 24px;background:#f2f6ff}.hero-bottom{border-bottom:0}
.scope{background:linear-gradient(135deg,#fff 45%,#f0e9ff)}
.scope-layout{grid-template-columns:minmax(0,1.6fr) minmax(240px,1fr);gap:24px}
.component-library{border:1px solid #af8ce0;background:#f5eeff;min-width:0}
.panel-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 16px;font-size:12px;border-bottom:1px solid #cab5e8;color:#6431a3}
.panel-toolbar>span{font:9px var(--mono);letter-spacing:.3px}
.scope-list{display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:16px;border:0}
.scope-list article{display:flex;position:relative;flex-direction:column;align-items:flex-start;gap:18px;padding:19px 16px 35px;border:1px solid #b691e7;background:#fff;box-shadow:3px 3px 0 #d8c3f6;min-width:0}
.scope-list article+article{border-top:1px solid #b691e7}.scope-list article:hover{border-color:#7a33bd;box-shadow:4px 5px 0 #ceb2f3}
.scope-list h3{font-size:16px;margin-bottom:10px}.scope-list p{font-size:13px;line-height:1.85}.row-code{display:block;position:absolute;bottom:10px;right:12px;color:#7744a5;font-size:9px}
.row-icon{display:grid;grid-template-columns:repeat(2,7px);gap:3px;transform:rotate(45deg);width:17px;height:17px;margin:3px 4px}
.row-icon i{background:#9b45e6;width:7px;height:7px}
.scenario{background:#edff62;border:1px solid #c4d638;box-shadow:5px 5px 0 #d5e645;align-self:start;transform:rotate(1deg)}
.scenario-top{color:#394513}.scenario p,.scenario-foot{color:#47521f}.comment-pin{background:#bd146e;color:#fff}.scenario-path>span{border-color:#809133;background:#faffd9;color:#394513}.scenario-path>.path-blue{background:var(--blue);color:#fff;border-color:var(--blue)}
.demo{background:#fff7f0}.preview-stage{background-color:#ffebd7;border-color:#dfaf7d}.demo-tools{border-bottom:1px solid #d6ac87;padding-bottom:14px}.demo-caption{color:#76532d}
.flow{background:linear-gradient(0deg,#edf3ff,#f8faff);background-image:radial-gradient(#b6c9f2 .7px,transparent .7px);background-size:12px 12px}
.flow-note{background:#edff62;border-color:#c4d638}.prototype-label{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-top:35px;font:10px var(--mono);color:#244ba8}.prototype-label>span:first-child{padding:6px 12px;background:var(--blue);color:#fff;border-radius:4px}
.steps{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:48px 60px;border:0;margin-top:22px;padding:0 20px 0 0;position:relative}
.steps li,.steps li+li,.steps li:nth-child(n+3){padding:0 24px 23px;background:#fff;border:1.5px solid var(--blue);box-shadow:5px 5px 0 #c5d6ff;min-height:220px}
.steps li:nth-child(3){grid-column:2;grid-row:2}.steps li:nth-child(4){grid-column:1;grid-row:2}
.step-top{position:static;margin:0 -24px;padding:10px 18px;background:#e5edff;border-bottom:1px solid #9db7ff;flex-direction:row;align-items:center;justify-content:space-between}
.step-top>span{font-size:22px;letter-spacing:-1px}.step-top>i{font-size:10px;color:#244ba8;letter-spacing:1px}.steps h3{margin-top:20px;font-size:17px;white-space:normal}.steps p{font-size:13px}.step-result{display:inline-block;font-size:11px;padding:4px 9px;border:1px solid #a2bcff;background:#f1f5ff;margin-top:16px}
.steps li:not(:last-child):after{display:grid;place-items:center;content:"→";position:absolute;top:50%;left:auto;right:-61px;width:60px;height:2px;background:var(--blue);color:var(--blue);font-size:26px;line-height:1;z-index:2}
.steps li:nth-child(2):after{content:"↓";top:auto;bottom:-49px;left:50%;right:auto;width:2px;height:48px}
.steps li:nth-child(3):after{content:"←";right:auto;left:-61px}.steps li:before{content:"";position:absolute;top:calc(50% - 4px);right:-5px;height:8px;width:8px;border-radius:50%;border:1px solid var(--blue);background:#fff;z-index:3}.steps li:nth-child(2):before{top:auto;bottom:-5px;right:calc(50% - 4px)}.steps li:nth-child(3):before{right:auto;left:-5px}.steps li:last-child:before{display:none}
.inline-cta{background:#e2ebff;border:1px solid #b7caff;padding:20px}.handoff-main{background:#fff}.input-output{grid-template-columns:1fr;gap:14px}.input-output>div{border:1px solid #9db7ff;background:#f3f6ff;padding:17px 18px;position:relative}.input-output>div:nth-child(2){background:#fff0f7;border-color:#e4a6c7}.input-output>div:nth-child(2) .panel-label{color:#a00d5c}.check-list{margin-top:10px}.check-list li{margin:7px 0}
.boundary{border:1px solid #dcb5c8;padding-top:0;background:#fff5f9;margin-top:25px}.boundary .panel-toolbar{padding:12px 15px;background:#f8ddeb;border-color:#dcb5c8;color:#85244e;flex-wrap:wrap}.boundary h3{font-size:14px}.boundary ul{margin:0}.boundary li{display:flex;align-items:flex-start;gap:10px;padding:13px 15px;margin:0;border-bottom:1px solid #efd2e0;color:#674557;font-size:12px}.boundary li:before{display:none}.boundary li svg{width:19px;height:19px;stroke:#a52566;fill:none;stroke-width:1.7;flex-shrink:0;margin-top:2px}.boundary li:nth-child(-n+3)>span{text-decoration:line-through;text-decoration-color:#bc7195}.boundary>p{padding:12px 15px;color:#674557;font-size:12px}
.inspector{background:#f2f6ff;border-color:#9db7ff}.inspector-title{background:var(--blue);color:#fff}.inspector-title>span{color:var(--yellow)}.property{border-color:#c5d6ff}.property-tags b{background:#dbe6ff;color:#244ba8}.swatches i:nth-child(2){background:#ed46a2}.swatches i:nth-child(3){background:var(--yellow)}.swatches i:nth-child(4){background:#ff8b39}.ownership{background:#e3ecff;flex:0}.export-panel{padding:16px 20px;background:#fff4db;border-bottom:1px solid #dbba74}.export-panel .panel-toolbar{padding:0 0 10px;color:#6f4b15;border-color:#dbba74}.export-panel p{font-size:12px;color:#684a1f;margin-top:10px}.export-options{display:flex;gap:6px;flex-wrap:wrap;margin-top:13px}.export-options button{font:11px var(--mono);padding:9px 7px;background:#fff;border:1px solid #b97e20;color:#684a1f}.export-options button[aria-pressed=true]{background:#ffe296;border-color:#8f5a06}.export-panel #export-description{min-height:88px;line-height:1.8}.handoff>.board-meta{margin:0;padding:16px 24px;background:#f2f6ff}
.faq{grid-template-columns:.85fr 1.5fr;gap:30px;background:#fff2f9}.faq .eyebrow{color:#a41860}.faq-sticker{background:#f64ca5;color:#fff;border:0;box-shadow:5px 5px 0 #ffb4da;border-radius:35px 35px 35px 0}.questions{border:0}.questions details{background:#fff;border:1px solid #dca1c1;margin-bottom:12px;box-shadow:3px 3px 0 #f1cce0}.questions details:last-child{margin-bottom:0}.questions summary{padding:16px;gap:12px;align-items:flex-start;font-size:13px}.questions summary>i{padding-top:13px;color:#a41860}.questions details[open]>summary{color:var(--ink);padding-bottom:16px}
.thread-avatar,.questions summary>.thread-avatar{background:var(--yellow);border:1px solid #a2b42f;border-radius:50%;width:30px;height:30px;flex-shrink:0;display:grid;place-items:center;color:#394513;font:12px var(--sans);margin-top:4px}.questions .thread-question{font:inherit;color:inherit}.thread-question small{display:block;color:#84526c;font-size:10px;font-weight:400;margin-bottom:5px}.thread-reply{display:flex;align-items:flex-start;gap:12px;margin:0 16px 18px 30px;padding:15px 0 0 14px;border-left:2px solid #e6b3ce;border-top:1px solid #f0d8e5}.thread-reply>.thread-avatar{background:#a41860;border-color:#a41860;color:#fff}.thread-reply strong{font-size:11px;color:#a41860;font-weight:500}.questions .thread-reply p{padding:5px 0 0;font-size:13px;color:#60505b;line-height:1.9}
.faq>.board-meta{margin-top:0}.contact{flex-wrap:wrap;background-color:#edff62}.contact>.board-meta{flex-basis:100%;margin-top:12px}.contact p:not(.eyebrow){color:#414e16}.contact-action>.mono{color:#414e16}
footer{border-top:2px solid var(--blue);padding-top:20px;position:relative}footer:before{content:"↳ END OF CANVAS";display:block;font:10px var(--mono);color:var(--blue);margin-bottom:18px}
@keyframes annotation-drift{0%,35%,100%{transform:translate(0,0)}55%,80%{transform:translate(4px,-4px)}}
@media(max-width:1200px) and (min-width:601px){.scope-layout{grid-template-columns:1fr}.scenario{display:grid;grid-template-columns:1fr 1fr;gap:15px}.scenario-top{grid-column:1/-1}.scenario h3{margin-top:0}.scenario-path{margin:0}.scenario-foot{align-self:center}.scope-list article{padding:19px 16px 35px}.steps{gap:45px 40px}.steps li:not(:last-child):after{right:-41px;width:40px}.steps li:nth-child(2):after{width:2px;height:45px;right:auto;bottom:-46px}.steps li:nth-child(3):after{left:-41px;right:auto}.faq{grid-template-columns:1fr 1.4fr}.questions summary{padding:13px;gap:9px}}
@media(max-width:600px){
.artboard{margin-bottom:96px}.artboard:not(.contact):after{bottom:-72px;height:48px;font-size:10px}.frame-label>span:last-child{display:none}.frame-label{font-size:10px}
.board-meta{margin-top:24px;padding-top:14px;gap:10px}.board-annotation{gap:8px}.parked-cursor b{font-size:10px;padding:2px 7px}.parked-cursor svg{width:18px}.note-pin{padding:4px 8px;font-size:10px}.note-pin>span{font-size:10px}.dimension{font-size:9px;padding:4px 6px}.dimension-desktop{display:none}.dimension-mobile{display:inline}.board-note{font-size:12px;padding:12px}.hero>.board-meta,.handoff>.board-meta{padding:14px 18px}.hero>.board-meta{width:100%}
.scope{padding:30px 20px}.scope-layout{display:block}.scope-list{grid-template-columns:1fr;padding:14px;gap:14px}.scope-list article{padding:18px 16px 32px;gap:15px}.scope-list h3{font-size:16px}.panel-toolbar{padding:12px;font-size:12px}.panel-toolbar>span{font-size:8px}.scenario{margin-top:28px}.row-code{display:block}.section-heading h2{font-size:29px}
.flow{padding:30px 22px}.flow h2{font-size:27px}.flow-note{margin-top:24px}.prototype-label{align-items:flex-start;margin-top:28px;font-size:9px}.prototype-label>span:last-child{max-width:105px;text-align:right}.steps{display:flex;flex-direction:column;gap:42px;padding:0;margin-top:18px}.steps li,.steps li+li,.steps li:nth-child(n+3){padding:0 19px 22px;min-height:0;border:1.5px solid var(--blue)}.step-top{margin:0 -19px;padding:10px 16px}.step-top>span{font-size:22px}.step-top>i{font-size:9px}.steps h3{margin-top:18px;font-size:16px}.steps p{font-size:13px}.steps li:not(:last-child):after,.steps li:nth-child(2):after,.steps li:nth-child(3):after{content:"↓";top:auto;bottom:-43px;left:50%;right:auto;width:2px;height:42px;display:grid}.steps li:before,.steps li:nth-child(2):before,.steps li:nth-child(3):before{top:auto;bottom:-5px;right:auto;left:calc(50% - 4px)}.inline-cta{padding:17px;margin-top:28px}.inline-cta p{font-size:13px}.text-link{white-space:normal}
.handoff-main{padding:30px 22px}.handoff h2{font-size:29px}.input-output{gap:14px}.input-output>div{padding:15px}.check-list li{font-size:12px}.boundary li{padding:12px;font-size:12px}.boundary .panel-toolbar{padding:12px}.boundary .panel-toolbar>span{font-size:8px}.boundary h3{font-size:13px}.export-panel{grid-column:1/-1;padding:18px 22px}.export-options{flex-wrap:nowrap}.export-options button{flex:1;padding:11px}.export-panel #export-description{min-height:0}.inspector-footer{font-size:9px}
.faq{padding:30px 20px}.faq h2{font-size:28px}.faq-sticker{width:52px;height:52px;right:0;top:100px;font-size:38px;border-radius:20px 20px 20px 0}.faq-intro>p:last-child{max-width:245px;font-size:12px}.questions{margin-top:32px}.questions summary{padding:14px 12px;gap:9px;font-size:12px}.thread-avatar,.questions summary>.thread-avatar{width:26px;height:26px;font-size:11px}.thread-question small{font-size:9px}.thread-reply{margin:0 12px 16px 23px;padding-left:11px;gap:8px}.questions .thread-reply p{font-size:12px}.faq>.board-meta{margin-top:24px}
.contact{padding:30px 22px}.contact>.board-meta{margin-top:25px}.contact h2{font-size:31px}footer{padding-top:18px}.mobile-contact{padding-bottom:max(17px,env(safe-area-inset-bottom))}body{padding-bottom:calc(78px + env(safe-area-inset-bottom))}
}
@media(prefers-reduced-motion:reduce){.parked-cursor{animation:none}.artboard,.handles i{transition:none}}
@media(max-width:600px){.demo-site:not(.mobile) .demo-copy h3{font-size:20px;letter-spacing:-1px}}

/* Keep the complete cursor paths and labels in empty mockup space. */
.collab-cursor.design{left:220px;top:55px}
.collab-cursor.engineer{right:180px;top:auto;bottom:40px}
.your-cursor{top:-62px}
@media(max-width:600px){
  .collab-cursor.design{left:150px;top:26px}
  .collab-cursor.engineer{right:18px;top:102px;bottom:auto}
  .your-cursor{top:-39px}
}

.hub-link{margin:12px 0 22px;font-size:13px;line-height:1.6}.hub-link a{color:inherit;text-decoration:underline;text-underline-offset:3px}
