@import url('https://fonts.googleapis.com/css2?family=DM+Mono:wght@400;500&family=Space+Grotesk:wght@400;500;600;700&display=swap');
.real-screenshot { overflow: hidden; border: 1px solid var(--line); background: #15191b; box-shadow: 0 24px 70px #0008; }
.real-screenshot > img { display: block; width: 100%; height: auto; }
.ruler-preview { position: relative; min-height: 210px; overflow: hidden; background: linear-gradient(135deg, #293437 0 1px, transparent 1px 100%); background-size: 24px 24px; }
.ruler-preview::before { content: ''; position: absolute; inset: 30px 12%; border: 1px solid #ffffff18; background: linear-gradient(90deg, #ffffff09 1px, transparent 1px), linear-gradient(#ffffff09 1px, transparent 1px); background-size: 32px 32px; }
.ruler-line { position: absolute; left: 15%; right: 15%; height: 2px; background: var(--cyan); box-shadow: 0 0 12px #66d7d088; }
.ruler-line::before, .ruler-line::after { content: ''; position: absolute; top: -5px; width: 1px; height: 12px; background: var(--cyan); }
.ruler-line::before { left: 0; }
.ruler-line::after { right: 0; }
.line-one { top: 58px; }
.line-two { top: 108px; }
.line-three { top: 164px; }
.ruler-distance { position: absolute; left: 50%; transform: translateX(-50%); color: var(--cyan); background: #20292b; padding: 3px 7px; font: 10px var(--mono); letter-spacing: .04em; }
.distance-one { top: 77px; }
.distance-two { top: 132px; }
.benefits { display: grid; grid-template-columns: .8fr 1.2fr; gap: 80px; align-items: start; border-top: 1px solid var(--line); }
.benefits-heading h2 { font-size: clamp(38px, 4vw, 58px); }
.benefits-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); border-top: 1px solid var(--line); }
.benefit-item { min-height: 112px; padding: 22px 18px 18px 0; border-bottom: 1px solid var(--line); }
.benefit-item:not(:nth-child(3n)) { border-right: 1px solid var(--line); padding-right: 24px; }
.benefit-item:not(:nth-child(3n + 1)) { padding-left: 24px; }
.benefit-item:nth-last-child(-n + 3) { border-bottom: 0; }
.benefit-item span { color: var(--orange); font: 10px var(--mono); }
.benefit-item p { margin: 18px 0 0; color: var(--white); font-size: 16px; }
@media(max-width:720px){.benefits{display:block}.benefits-heading{margin-bottom:40px}.benefits-list{grid-template-columns:1fr}.benefit-item,.benefit-item:not(:nth-child(3n)),.benefit-item:not(:nth-child(3n + 1)),.benefit-item:nth-last-child(-n + 3){grid-column:auto;border-right:0;border-bottom:1px solid var(--line);padding:18px 0}.benefit-item:last-child{border-bottom:0}}
.download-actions { display: flex; flex-wrap: wrap; gap: 12px; justify-content: center; }
.button.secondary { background: transparent; border: 1px solid rgba(237, 242, 239, .35); color: #edf2ef; }
@media (max-width: 640px) { .download-actions { flex-direction: column; align-items: stretch; } }
:root{--ink:#101316;--panel:#202528;--line:#373d40;--white:#f7f5ef;--muted:#92999a;--orange:#ff6b3d;--cyan:#66d7d0;--display:'Space Grotesk',sans-serif;--mono:'DM Mono',monospace}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--ink);color:var(--white);font-family:var(--display);line-height:1.45}body:before{content:'';position:fixed;inset:0;pointer-events:none;opacity:.15;background:linear-gradient(#fff1 1px,transparent 1px),linear-gradient(90deg,#fff1 1px,transparent 1px);background-size:48px 48px;mask-image:linear-gradient(#000,transparent 75%)}a{color:inherit;text-decoration:none}.shell{max-width:1440px;margin:auto;padding:0 54px;position:relative}header{height:78px;border-bottom:1px solid var(--line);display:flex;align-items:center;gap:40px}.brand{font-size:20px;font-weight:700;letter-spacing:-.07em;white-space:nowrap}.brand b{display:inline-grid;place-items:center;width:25px;height:25px;background:var(--orange);color:var(--ink);margin-right:8px;letter-spacing:0}nav{display:flex;gap:26px;color:#a7abad;font:12px var(--display)}nav a:hover{color:var(--white)}.account{margin-left:auto;display:flex;align-items:center;gap:24px;color:#a7abad;font-size:12px}.button{background:var(--orange);color:var(--ink);display:inline-block;padding:15px 19px;font-weight:700;font-size:13px;transition:.2s}.button:hover{background:#ff835c;transform:translateY(-2px)}.button.small{padding:10px 13px;font-size:11px}.menu{display:none;background:none;border:0;color:white;font-size:20px}.hero{display:grid;grid-template-columns:.85fr 1.15fr;gap:70px;align-items:center;padding:100px 0 90px;min-height:650px}.eyebrow{font:10px var(--mono);letter-spacing:.14em;text-transform:uppercase;color:var(--cyan);margin:0 0 24px}.hero h1,h2{font-size:clamp(44px,5vw,76px);line-height:.98;letter-spacing:-.075em;margin:0;font-weight:600}.hero h1 em,h2 em{color:var(--orange);font-style:normal}.lead{color:#a7abad;font-size:18px;max-width:410px;margin:28px 0 30px}.actions{display:flex;align-items:center;gap:25px}.text-link{font-size:13px;font-weight:600;border-bottom:1px solid #555;padding-bottom:5px}.text-link:hover{color:var(--orange);border-color:var(--orange)}.capabilities{color:#747b7e;font:10px var(--mono);margin-top:65px}.capabilities i{color:var(--orange);padding:0 7px}.product{position:relative}.coords{position:absolute;left:-40px;top:-34px;color:#707a7d;font:10px var(--mono)}.coords b{color:var(--orange);margin-left:14px}.app{background:#252a2d;border:1px solid #4b5052;box-shadow:0 24px 70px #0008;transform:rotate(1.2deg);animation:rise .8s ease both}.app-top{height:37px;border-bottom:1px solid #444;display:flex;align-items:center;padding:0 14px;gap:15px;color:#788082;font:10px var(--mono)}.app-top span{color:#697174}.app-top small{margin-left:auto;color:var(--cyan)}.canvas{height:365px;margin:20px;position:relative;overflow:hidden;background:#b8c1be;color:#142126}.fake-ui{height:45px;background:#dbe2df;margin-bottom:61px}.canvas-copy{margin-left:40px}.canvas-copy small{font:8px var(--mono);color:#536765}.canvas-copy h3{font-size:29px;line-height:1.03;margin:10px 0}.canvas-copy p{font:11px var(--mono);color:#566966}.blur{position:absolute;right:48px;top:136px;width:126px;height:54px;background:#71807c;filter:blur(6px)}.select{position:absolute;inset:87px 26px 32px 23px;border:1px solid var(--orange);box-shadow:0 0 0 999px #10151512}.select label{position:absolute;right:0;bottom:-19px;color:var(--orange);font:9px var(--mono)}.callout{position:absolute;background:var(--orange);color:var(--ink);display:grid;place-items:center;width:21px;height:21px;border-radius:50%;font:700 11px var(--mono)}.one{left:280px;top:188px}.two{left:188px;top:260px}.note{position:absolute;right:44px;bottom:58px;background:var(--ink);padding:9px 12px;border-left:2px solid var(--orange);font:10px var(--mono)}.toolbar{height:49px;background:#171a1c;border-top:1px solid #444;display:flex;align-items:center;gap:16px;padding:0 15px;color:#92999a;font:15px var(--mono)}.toolbar b{color:var(--orange)}.toolbar i{border-left:1px solid #444;height:20px}.toolbar u{width:13px;height:13px;border-radius:50%;background:var(--orange);text-decoration:none}.toolbar strong{margin-left:auto;background:var(--cyan);color:var(--ink);padding:5px 8px;font-size:10px}.pad{padding:110px 0;border-top:1px solid var(--line)}.section-head{display:flex;justify-content:space-between;align-items:end;margin-bottom:55px}.section-head h2{font-size:50px}.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:45px}.steps article{position:relative}.steps article small{color:var(--orange);font:11px var(--mono)}.mini{height:91px;border:1px solid #4c5355;background:#202528;margin-top:13px;position:relative}.capture:after{content:'';position:absolute;inset:18px 22px;border:1px solid var(--orange)}.markup{padding:27px 14px;color:var(--orange);font:19px var(--mono)}.result{padding:19px;font:10px var(--mono);color:#89908f}.result b{display:block;color:white;font-size:15px}.result i{position:absolute;right:17px;top:26px;background:var(--orange);color:var(--ink);padding:5px;font-style:normal}.upload{padding:26px 15px;color:var(--cyan);font:10px var(--mono)}.upload b{display:inline-block;width:60%;height:4px;background:var(--cyan);margin-right:6px}.steps h3{font-size:19px;margin:17px 0 5px}.steps p,.editor>div>p,.recorder>div>p,.sharing>div>p{color:var(--muted);max-width:300px;font-size:13px}.editor,.recorder,.sharing,.shortcuts{display:grid;grid-template-columns:.8fr 1.2fr;gap:100px;align-items:center}.editor h2,.recorder h2,.sharing h2,.shortcuts h2{font-size:53px;margin-bottom:25px}.editor ul{list-style:none;padding:0;margin-top:32px;color:#b6baba;font:11px var(--mono);line-height:2.4}.editor li:first-letter{color:var(--orange)}.board{border:1px solid #4a4f50;background:#252a2d;padding:15px;box-shadow:12px 12px #171a1b}.board>small{font:9px var(--mono);color:var(--cyan)}.board-image{height:310px;background:#d1d5cf;color:#243130;margin-top:12px;padding:60px 70px;position:relative;overflow:hidden}.board code{font:15px var(--mono);line-height:2;background:#e5e7e0;padding:17px;display:block;box-shadow:0 8px 18px #929997}.board code span{color:#e25b40}.board code b{color:#168d88}.board code i{color:#9a5b1b}.board-arrow{position:absolute;width:130px;border-top:3px solid var(--orange);top:164px;left:207px;transform:rotate(-28deg)}.board label{position:absolute;left:246px;top:188px;background:var(--ink);padding:10px 13px;border-left:3px solid var(--orange);font:11px var(--mono)}.board label b{background:var(--orange);color:var(--ink);padding:4px}.board-tools{height:42px;display:flex;align-items:center;color:#9aa0a0;font:14px var(--mono)}.board-tools span{color:var(--orange)}.board-tools strong{margin-left:auto;background:var(--orange);color:var(--ink);padding:7px;font-size:10px}.recorder,.settings{background:#181d1f;margin-left:-54px;margin-right:-54px;padding-left:54px;padding-right:54px}.recording{background:#252a2d;border:1px solid #565b5b;padding:15px;box-shadow:0 20px 40px #0008;transform:rotate(-1deg)}.record-top{height:27px;color:#b4b8b5;font:10px var(--mono)}.record-top span{float:right}.record-area{height:285px;background:linear-gradient(145deg,#546362,#9daaa4);position:relative}.record-frame{position:absolute;inset:42px 65px;border:2px solid var(--orange)}.click{position:absolute;left:46%;top:46%;border:2px solid var(--orange);border-radius:50%;padding:12px;color:var(--orange)}.record-area label{position:absolute;right:90px;bottom:74px;background:var(--ink);padding:9px;font:10px var(--mono)}.record-area label b{background:var(--orange);color:var(--ink);padding:3px}.timeline{height:47px;display:flex;align-items:center;gap:13px;color:#8d9494;font:10px var(--mono)}.timeline i{height:6px;background:var(--orange);width:38%;display:inline-block}.formats{display:flex;gap:0;align-items:center;margin:28px 0;color:#899093;font:11px var(--mono)}.formats b,.formats span{padding:8px 17px;border:1px solid #4b5153}.formats b{background:var(--orange);color:var(--ink);border-color:var(--orange)}.toggle{display:inline-block;width:27px;height:15px;border-radius:12px;background:#555d5d;position:relative}.toggle:after{content:'';position:absolute;width:11px;height:11px;border-radius:50%;background:#aab0ae;top:2px;left:2px}.toggle.on{background:var(--cyan)}.toggle.on:after{left:14px;background:var(--ink)}.center{text-align:center}.center h2{font-size:50px}.tabs{margin:35px 0 30px}.tabs button{background:none;color:#7f8688;border:1px solid #414749;padding:10px 16px;font:11px var(--mono)}.tabs button.active{background:var(--cyan);color:var(--ink);border-color:var(--cyan)}.utility{display:grid;grid-template-columns:1.4fr .8fr;border:1px solid #444b4d;background:#202528;min-height:280px}.utility-screen{margin:18px;background:#6c7d78;min-height:240px;position:relative}.scan{position:absolute;inset:44px 115px;border:2px solid var(--cyan)}.scan-result{position:absolute;right:28px;bottom:24px;background:var(--ink);padding:12px;font:10px var(--mono);display:grid;gap:5px}.scan-result small{color:var(--cyan)}.scan-result button{background:var(--orange);border:0;padding:6px;font:10px var(--mono)}.utility-screen code{display:block;padding:45px;color:white;font:18px var(--mono);line-height:1.9}.utility-screen mark{background:var(--orange)}.hidden{display:none}.utility-copy{padding:55px 45px;border-left:1px solid #444b4d}.utility-copy small,.share-panel>small{color:#899091;font:9px var(--mono)}.utility-copy small:first-letter{color:var(--orange)}.utility-copy h3{font-size:31px;line-height:1.05}.utility-copy p{color:var(--muted);max-width:240px;font-size:13px}.sharing{grid-template-columns:.8fr 1.2fr}.share-panel{border:1px solid #474d4f;background:#202528;padding:23px 26px;max-width:610px}.share-panel small b,.share-panel>small span{color:var(--cyan)}.progress{display:flex;align-items:center;gap:13px;margin:26px 0;color:var(--cyan);font:10px var(--mono)}.progress i{height:5px;background:var(--cyan);flex:1}.share-link{background:#171b1c;padding:12px;color:var(--cyan);font:11px var(--mono)}.share-link button{float:right;background:none;border:0;color:white;font:10px var(--mono)}.share-panel p{border-bottom:1px solid #383e40;padding:10px 0;font-size:12px}.share-panel p small{font-size:9px;color:#777}.shortcuts{grid-template-columns:.8fr 1.2fr}.keys{border-top:1px solid #4a5051}.keys p{border-bottom:1px solid #4a5051;padding:15px 0;margin:0;color:#b5bbba;font-size:13px}.keys kbd{float:right;background:#2c3234;border:1px solid #596163;border-bottom-width:3px;padding:6px 9px;font:11px var(--mono);margin-left:6px}.download{text-align:center;padding-bottom:125px}.download h2{font-size:66px}.download>p:not(.eyebrow){color:#969c9b;margin:24px 0 30px;font:11px var(--mono)}.download small{display:block;color:#777f80;font:10px var(--mono);margin-top:19px}footer{border-top:1px solid #4a4f50;min-height:89px;display:flex;align-items:center;gap:45px;color:#757d7f;font:10px var(--mono)}footer nav{font:10px var(--mono);gap:23px}footer>span{margin-left:auto}@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:translateY(0)}}
+@media(max-width:1000px){.shell{padding:0 28px}header nav{gap:14px}.hero{gap:45px}.hero h1{font-size:55px}.recorder{margin-left:-28px;margin-right:-28px;padding-left:28px;padding-right:28px}}
+@media(max-width:720px){.shell{padding:0 18px}header{height:65px}.account,header nav{display:none}.menu{display:block;margin-left:auto}.hero,.editor,.recorder,.sharing,.shortcuts{display:flex;flex-direction:column;align-items:stretch;gap:55px;padding-top:65px}.hero h1{font-size:50px}.capabilities{line-height:2.2;margin-top:40px}.app{transform:none}.canvas{height:275px;margin:12px}.canvas-copy{margin-left:22px}.canvas-copy h3{font-size:22px}.note{right:20px;bottom:35px}.pad{padding:75px 0}.section-head{display:block;margin-bottom:35px}.section-head h2,.center h2{font-size:40px}.steps{display:block}.steps article{margin-bottom:27px}.editor h2,.recorder h2,.sharing h2,.shortcuts h2{font-size:42px}.board{order:-1}.board-image{height:235px;padding:35px 24px}.board code{font-size:10px}.board-arrow{left:118px;width:90px;top:124px}.board label{left:120px;top:146px;font-size:9px}.recorder,.settings{margin-left:-18px;margin-right:-18px;padding-left:18px;padding-right:18px}.recording{order:-1}.record-area{height:210px}.record-frame{inset:28px 35px}.utility{display:flex;flex-direction:column}.utility-copy{border-left:0;border-top:1px solid #444b4d;padding:28px}.utility-screen{min-height:210px}.sharing .share-panel{order:-1}.shortcuts .keys{width:100%}.keys kbd{float:none;margin:0}.download h2{font-size:48px}footer{flex-wrap:wrap;padding:25px 0;gap:18px}footer nav{order:3;width:100%;flex-wrap:wrap;gap:15px}footer>span{margin-left:0}}
+@media(prefers-reduced-motion:reduce){*{animation:none!important;scroll-behavior:auto!important}}
.brand-lockup{position:relative;display:inline-flex;align-items:center}.ua-mark{position:absolute;top:-7px;right:-8px;width:16px;height:10px;display:flex;flex-direction:column;border:1px solid var(--ink);border-radius:2px;overflow:hidden;transform:rotate(8deg);box-shadow:2px 2px 0 #0005}.ua-mark i{display:block;flex:1}.ua-mark i:first-child{background:#198bd2}.ua-mark i:last-child{background:#ffd34e}.language{display:flex;gap:5px;margin-left:auto;color:#646d70;font:10px var(--mono)}.language a.active{color:var(--white);border-bottom:1px solid var(--orange)}
.origin-note{display:flex;align-items:center;gap:10px;color:#879092;font:9px var(--mono);letter-spacing:.08em;padding:11px 0;border-bottom:1px solid #2a3032}.origin-note b{background:#ffd34e;color:#101316;padding:2px 5px;font-size:8px}.origin-note small{color:#697275;letter-spacing:0}
.brand img{width:27px;height:27px;object-fit:cover;border-radius:6px;vertical-align:middle;margin-right:8px}.brand img+*{margin-left:0}
@media(max-width:720px){.language{margin-left:auto}.origin-note{font-size:8px}.origin-note small{display:none}}
