:root{--bg:#f4f4f1;--ink:#111;--ink-soft:#66665f;--paper:#fff;--line:#e2e2dc;--mark:#ff3b30;--sans:-apple-system, BlinkMacSystemFont, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif;--mono:ui-monospace, "SF Mono", Menlo, Consolas, monospace;color-scheme:light}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:72px}body{font-family:var(--sans);color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased;margin:0;font-size:16px;line-height:1.7;overflow-x:hidden}a:focus-visible,button:focus-visible,summary:focus-visible,.sticker:focus-visible{outline:3px solid var(--ink);outline-offset:3px}.topbar{z-index:1000;backdrop-filter:saturate(1.6)blur(16px);background:#f4f4f1cc;align-items:center;gap:20px;padding:12px clamp(16px,4vw,40px);display:flex;position:sticky;top:0}.brand{color:var(--ink);align-items:center;gap:8px;font-weight:700;text-decoration:none;display:flex}.brand svg{fill:none;width:22px;height:22px;stroke:var(--ink);stroke-width:2.4px;stroke-linecap:round}.topnav{gap:22px;margin-left:auto;display:flex}.topnav a{color:var(--ink-soft);font-size:14px;text-decoration:none}.topnav a:hover{color:var(--ink)}.button{background:var(--ink);color:var(--paper);border-radius:999px;align-items:center;gap:8px;padding:14px 26px;font-weight:700;text-decoration:none;transition:translate .12s,box-shadow .12s;display:inline-flex;box-shadow:0 4px #000,0 12px 26px #0000002e}.button:hover{translate:0 -2px;box-shadow:0 6px #000,0 16px 32px #0003}.button:active{translate:0 4px;box-shadow:0 0 #000,0 4px 12px #00000029}.button svg{fill:none;stroke:currentColor;stroke-width:2.4px;stroke-linecap:round;stroke-linejoin:round;width:18px;height:18px}.button.small{padding:7px 16px;font-size:14px;box-shadow:0 3px #000}.chip{border:1.5px solid var(--ink);background:var(--paper);color:var(--ink);font:inherit;cursor:pointer;border-radius:999px;padding:6px 14px;font-size:14px;font-weight:600}.chip:hover{background:var(--ink);color:var(--paper)}.hero{text-align:center;padding:56px 20px 40px;position:relative}.badge{background:var(--ink);color:var(--paper);border-radius:999px;margin:0 0 22px;padding:5px 14px;font-size:13px;font-weight:600;display:inline-block}.hero h1{letter-spacing:-.03em;margin:0;font-size:clamp(56px,11vw,136px);font-weight:800;line-height:1.04}.hero h1 span{display:block}.stuck em{background:var(--paper);border-radius:.14em;margin-top:.08em;padding:0 .2em .2em;font-style:normal;display:inline-block;position:relative;rotate:-3deg;box-shadow:0 .12em .4em #00000024,0 0 0 1px #0000000f}.stuck .scribble{fill:none;width:84%;height:.14em;stroke:var(--mark);stroke-width:5px;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1px;animation:.55s ease-out .5s forwards draw;position:absolute;bottom:.04em;left:8%;overflow:visible}@keyframes draw{to{stroke-dashoffset:0}}.stuck em:after{--arm:.2em;--w:4px;--c:var(--ink);content:"";background:linear-gradient(var(--c), var(--c)) top left / var(--arm) var(--w), linear-gradient(var(--c), var(--c)) top left / var(--w) var(--arm), linear-gradient(var(--c), var(--c)) top right / var(--arm) var(--w), linear-gradient(var(--c), var(--c)) top right / var(--w) var(--arm), linear-gradient(var(--c), var(--c)) bottom left / var(--arm) var(--w), linear-gradient(var(--c), var(--c)) bottom left / var(--w) var(--arm), linear-gradient(var(--c), var(--c)) bottom right / var(--arm) var(--w), linear-gradient(var(--c), var(--c)) bottom right / var(--w) var(--arm);pointer-events:none;background-repeat:no-repeat;position:absolute;inset:-.14em}.lead{max-width:34em;color:var(--ink-soft);margin:34px auto 30px;font-size:clamp(16px,1.6vw,19px)}.cta{flex-direction:column;align-items:center;gap:16px;display:flex}.facts{color:var(--ink-soft);font-size:13px}.demo{width:min(1120px,100%);margin:64px auto 0}.demo-bar{flex-wrap:wrap;justify-content:center;align-items:center;gap:12px;margin-bottom:16px;display:flex}.demo-hint{margin:0;font-weight:600}.demo-count{background:var(--ink);color:var(--paper);border-radius:999px;padding:4px 12px;font-size:13px;font-weight:700}.stage{aspect-ratio:16/9;cursor:crosshair;touch-action:none;user-select:none;text-align:left;border-radius:22px;position:relative;overflow:hidden;box-shadow:0 30px 80px #00000038,0 0 0 1px #00000014}.desk{background:radial-gradient(70% 80% at 20% 10%,#8d8d88,#0000 70%),radial-gradient(60% 70% at 90% 100%,#3a3a38,#0000 70%),#5f5f5a;position:absolute;inset:0}.menubar{backdrop-filter:blur(10px);color:#1a1a1a;background:#ffffff8c;align-items:center;gap:18px;height:28px;padding:0 16px;font-size:12.5px;display:flex;position:absolute;inset:0 0 auto}.menubar b{font-size:10px}.menubar-right{align-items:center;gap:10px;margin-left:auto;display:flex}.menubar svg{fill:none;stroke:#1a1a1a;stroke-width:2.4px;stroke-linecap:round;width:15px;height:15px}.win{background:#ffffffeb;border-radius:12px;position:absolute;overflow:hidden;box-shadow:0 18px 40px #0000004d,0 0 0 .5px #0003}.win-title{color:#6b6680;border-bottom:1px solid #0000000f;align-items:center;gap:6px;height:30px;padding:0 12px;font-size:12px;display:flex}.win-title i{background:#ff5f57;border-radius:50%;width:11px;height:11px}.win-title i:nth-child(2){background:#febc2e}.win-title i:nth-child(3){background:#28c840}.win-title span{margin-left:8px}.win-design{width:36%;height:76%;top:12%;left:5%}.poster{height:calc(100% - 30px);color:var(--paper);background:linear-gradient(#1f7bff,#ff5fa2 120%);align-content:end;padding:7%;display:grid;position:relative;overflow:hidden}.sun{aspect-ratio:1;background:#ffd23f;border-radius:50%;width:70%;position:absolute;top:8%;right:-12%;box-shadow:0 0 60px #ffd23fb3}.poster strong{letter-spacing:-.02em;font-size:clamp(22px,4.4vw,52px);font-weight:900;line-height:1;position:relative}.poster small{opacity:.9;margin-top:6px;font-size:clamp(10px,1.1vw,13px);position:relative}.win-code{background:#18181af2;width:50%;height:40%;top:14%;left:45%}.win-code .win-title{color:#9a9a96;border-color:#ffffff0f}.win-code pre{font:clamp(9px, 1.15vw, 13.5px) / 1.75 var(--mono);color:#e8e8e4;margin:0;padding:3% 4%}.win-code .k{color:#ff7ab6}.win-code .f{color:#7cc4ff}.win-notes{background:#fff6c9;width:36%;height:32%;top:60%;left:52%}.win-notes ul{color:#4a3f1a;margin:0;padding:4% 6% 0 9%;font-size:clamp(10px,1.2vw,14px);line-height:1.9}.selection{z-index:2;cursor:crosshair;border:1px solid #ffffffd9;position:absolute;box-shadow:0 0 0 9999px #0000006b}.selection .corner,.selection .tick{filter:drop-shadow(0 0 .8px #0009)drop-shadow(0 0 .8px #0009);border:0 solid #fff;position:absolute}.corner{width:18px;height:18px}.corner.tl{border-width:3.5px 0 0 3.5px;top:-2px;left:-2px}.corner.tr{border-width:3.5px 3.5px 0 0;top:-2px;right:-2px}.corner.bl{border-width:0 0 3.5px 3.5px;bottom:-2px;left:-2px}.corner.br{border-width:0 3.5px 3.5px 0;bottom:-2px;right:-2px}.tick.tc,.tick.bc{border-top-width:3.5px;width:12px;left:calc(50% - 6px)}.tick.tc{top:-2px}.tick.bc{bottom:-2px}.tick.ml,.tick.mr{border-left-width:3.5px;height:12px;top:calc(50% - 6px)}.tick.ml{left:-2px}.tick.mr{right:-2px}.size{color:var(--paper);font:12px/1.7 var(--mono);white-space:nowrap;background:#000000bf;border-radius:999px;padding:1px 10px;position:absolute;bottom:calc(100% + 8px);left:-1px}.sel-tools{cursor:default;background:#1e1e20f0;border-radius:999px;gap:4px;padding:5px;display:flex;position:absolute;top:calc(100% + 10px);right:-1px;box-shadow:0 10px 30px #00000059,inset 0 0 0 .5px #ffffff24}.tools-above .sel-tools{top:auto;bottom:calc(100% + 10px)}.sel-tools[hidden]{display:none}.sel-tools button{color:#ffffffb8;font:inherit;white-space:nowrap;cursor:pointer;background:0 0;border:0;border-radius:999px;padding:6px 14px;font-size:13.5px;font-weight:600}.sel-tools button:hover{color:var(--paper);background:#ffffff1f}.sel-tools .primary{background:var(--paper);color:var(--ink)}.sel-tools .primary:hover{color:var(--ink);background:#e4e4e0}.sticker{outline:4px solid var(--paper);cursor:grab;touch-action:none;user-select:none;border-radius:6px;transition:opacity .18s,box-shadow .2s;animation:.35s cubic-bezier(.2,1.4,.4,1) stick;position:absolute;overflow:hidden;box-shadow:0 22px 50px #00000059}.sticker>.desk{pointer-events:none}.sticker.dragging{cursor:grabbing;box-shadow:0 30px 70px #00000073}.sticker.leaving{opacity:0}@keyframes stick{0%{opacity:.4;rotate:-6deg}}.sticker-badge{color:var(--paper);font:12px/1.7 var(--mono);opacity:0;pointer-events:none;background:#000000bf;border-radius:6px;padding:1px 8px;transition:opacity .2s;position:absolute;bottom:8px;right:8px}.sticker-badge.shown{opacity:1}.section{width:min(1120px,100% - 40px);margin:0 auto;padding:110px 0 20px}.section h2{letter-spacing:-.02em;margin:0 0 10px;font-size:clamp(34px,5vw,60px);font-weight:800;line-height:1.1}.section h2 span{display:block}.section h2 span+span{color:var(--ink-soft)}.section-note{max-width:36em;color:var(--ink-soft);margin:0 0 36px}.bento{grid-template-columns:repeat(3,1fr);grid-auto-rows:minmax(250px,auto);gap:16px;margin-top:44px;display:grid}.tile{background:var(--paper);border-radius:26px;padding:28px;transition:translate .2s;position:relative;overflow:hidden}.tile:hover{translate:0 -4px}.tile h3{flex-wrap:wrap;align-items:center;gap:12px;margin:0 0 8px;font-size:24px;font-weight:800;display:flex}.tile p{margin:0;font-size:15px}.tile-pin{background:var(--ink);color:var(--paper);grid-column:span 2;grid-template-columns:1fr 1fr;align-items:center;gap:20px;display:grid}.tile-pin p{color:#ffffffd9}.tile-pin kbd{color:var(--paper);background:#ffffff26;border-color:#ffffff80}.art-stack{height:200px;position:relative}.mini{outline:4px solid var(--paper);border-radius:6px;width:58%;height:62%;transition:rotate .3s,translate .3s;position:absolute;box-shadow:0 16px 36px #00000080}.mini-a{background:linear-gradient(#1f7bff,#ff5fa2);top:22%;left:4%;rotate:-9deg}.mini-b{background:#1b172a repeating-linear-gradient(#0000 0 14px,#7cc4ff 14px 17px,#0000 17px 26px) 14px 12px/70% 100% no-repeat;top:6%;left:22%;rotate:4deg}.mini-c{background:#fff6c9;top:30%;left:40%;rotate:-2deg}.tile-pin:hover .mini-a{translate:-14px 6px;rotate:-16deg}.tile-pin:hover .mini-b{translate:0 -10px;rotate:8deg}.tile-pin:hover .mini-c{translate:16px 8px;rotate:6deg}.tile-capture p,.tile-annotate p{color:var(--ink-soft)}.big-keys{gap:8px;margin-bottom:36px;display:flex}.big-keys kbd{border:1px solid var(--line);background:var(--bg);min-width:56px;color:var(--ink);border-radius:14px;padding:8px 12px;font-size:26px;font-weight:700;box-shadow:0 5px #00000024}.art-annotate{height:110px;margin-bottom:18px;position:relative}.art-annotate .num{background:var(--mark);width:30px;height:30px;color:var(--paper);border-radius:50%;place-items:center;font-weight:800;display:grid;position:absolute;top:8px;left:4px}.art-annotate .n2{top:58px;left:44px}.art-annotate .mosaic{background:conic-gradient(#b4b4ae 25%, #d4d4ce 0 50%, #9c9c96 0 75%, #c4c4be 0) 0 0 / 28px 28px, #c4c4be;width:84px;height:52px;image-rendering:pixelated;position:absolute;top:6px;right:6px}.art-annotate .mosaic:after{content:"";background:conic-gradient(#8e8e88 25%, transparent 0 50%, #dcdcd6 0 75%, transparent 0) 14px 0 / 42px 28px;opacity:.6;position:absolute;inset:0}.art-annotate .marker{background:#fff66af2;border-radius:3px;width:110px;height:16px;position:absolute;bottom:10px;right:20px;rotate:-2deg}.art-annotate svg{fill:none;width:120px;height:60px;stroke:var(--mark);stroke-width:4px;stroke-linecap:round;stroke-linejoin:round;position:absolute;top:16px;left:70px}.art-ocr{background:#161616;border-radius:12px;margin-bottom:26px;padding:18px 16px;position:relative}.art-ocr code{font:13px/1.8 var(--mono);color:#e8e8e4;outline-offset:3px;background:#ffffff1a;outline:1.5px dashed #ffffffd9;padding:2px 0;display:inline}.ocr-toast{background:var(--paper);box-shadow:0 0 0 1px var(--line);color:var(--ink);border-radius:999px;padding:3px 12px;font-size:12px;font-weight:700;position:absolute;bottom:-14px;right:12px}.tile-text-copy p{color:var(--ink-soft)}.tile-scroll{background:var(--ink);color:var(--paper);grid-row:span 2}.tile-scroll p{color:#ffffffb8}.art-scroll{outline:4px solid var(--paper);background:var(--paper);border-radius:18px 18px 0 0;width:58%;height:62%;position:absolute;bottom:-20px;left:50%;overflow:hidden;translate:-50%}.strip{gap:12px;padding:16px;animation:6s linear infinite scroll-strip;display:grid}.strip span{width:var(--w);background:#e6e6e1;border-radius:6px;height:12px;display:block}.strip span:nth-child(4n){background:#cdcdc7;border-radius:8px;width:100%;height:46px}@keyframes scroll-strip{to{translate:0 -50%}}.tile-privacy{grid-column:span 2;grid-template-rows:auto auto;grid-template-columns:auto 1fr;align-items:center;column-gap:24px;display:grid}.tile-privacy .offline{fill:none;width:84px;height:84px;stroke:var(--ink);stroke-width:2px;stroke-linecap:round;grid-row:span 2}.tile-privacy h3{margin:0;font-size:clamp(30px,4vw,48px)}.tile-privacy p{color:var(--ink-soft)}.keys{gap:4px;display:inline-flex}kbd{background:var(--paper);min-width:26px;font:600 13px/1.6 var(--mono);text-align:center;color:var(--ink);border:1px solid #d6d6d0;border-bottom-width:2px;border-radius:7px;padding:1px 7px}.shortcut-columns{grid-template-columns:repeat(2,1fr);gap:16px;display:grid}.shortcuts{background:var(--paper);border-radius:22px;margin:0;padding:22px 26px}.shortcuts .group{color:var(--ink-soft);margin-bottom:4px;font-size:13px;font-weight:700}.shortcuts div{border-bottom:1px solid var(--line);justify-content:space-between;align-items:center;padding:11px 0;display:flex}.shortcuts div:last-child{border-bottom:0}.shortcuts dd{margin:0}.steps{counter-reset:step;grid-template-columns:repeat(3,1fr);gap:16px;margin:0 0 32px;padding:0;list-style:none;display:grid}.steps li{background:var(--paper);counter-increment:step;border-radius:22px;padding:64px 24px 24px;font-size:15px;position:relative}.steps li:before{content:counter(step);background:var(--ink);width:34px;height:34px;color:var(--paper);font:800 15px/1 var(--mono);border-radius:50%;place-items:center;display:grid;position:absolute;top:18px;left:22px}.terminal-label{color:var(--ink-soft);margin:0 0 8px;font-size:14px}.terminal{background:#161616;border-radius:14px;align-items:center;gap:12px;max-width:44em;margin-bottom:36px;padding:10px 10px 10px 18px;display:flex}.terminal code{font:13px/1.6 var(--mono);color:#e8e8e4;white-space:nowrap;flex:1;overflow-x:auto}.terminal button{color:var(--paper);font:inherit;cursor:pointer;background:#333331;border:0;border-radius:8px;padding:5px 14px;font-size:13px}.terminal button:hover{background:#4a4a47}.faq{max-width:48em;margin-top:28px}.faq details{background:var(--paper);border-radius:16px;margin-bottom:10px;padding:0 22px}.faq summary{cursor:pointer;padding:18px 0;font-weight:700}.faq details p{color:var(--ink-soft);margin:0 0 18px}.footer{border-top:1px solid var(--line);width:min(1120px,100% - 40px);color:var(--ink-soft);justify-content:space-between;gap:16px;margin:100px auto 0;padding:26px 0 44px;font-size:13px;display:flex}@media (width<=900px){.bento{grid-template-columns:1fr 1fr}.tile-pin,.tile-privacy{grid-column:span 2}.tile-scroll{grid-row:span 1;min-height:320px}.steps{grid-template-columns:1fr}}@media (width<=720px){.topnav{display:none}.topbar .button.small{margin-left:auto}.stage{aspect-ratio:3/4}.win-design{width:60%;height:44%;top:9%;left:6%}.win-code{width:74%;height:22%;top:57%;left:20%}.win-notes{width:50%;height:30%;top:20%;left:44%}.bento,.shortcut-columns{grid-template-columns:1fr}.tile-pin,.tile-privacy{grid-column:auto}.tile-pin{grid-template-columns:1fr}.footer{flex-direction:column}}@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}.stuck .scribble,.strip,.sticker{animation:none}.stuck .scribble{stroke-dashoffset:0}}.lang[data-astro-cid-l4evwy7q]{background:#12161c0f;border-radius:8px;gap:2px;padding:2px;display:flex}.lang[data-astro-cid-l4evwy7q] a[data-astro-cid-l4evwy7q]{color:var(--ink-soft);border-radius:6px;padding:4px 8px;font-size:13px;text-decoration:none}.lang[data-astro-cid-l4evwy7q] a[data-astro-cid-l4evwy7q][aria-current=page]{background:var(--paper);color:var(--ink)}
