.capture-tools{padding-top:130px;scroll-margin-top:110px}
.capture-heading{max-width:720px;margin-bottom:70px}
.capture-heading .eyebrow{color:#a6c6bb;font-size:10px;letter-spacing:2.5px}
.capture-heading h2{font-size:clamp(32px,4vw,52px);font-weight:580;letter-spacing:-1.5px;line-height:1.3;margin:18px 0}
.capture-heading>p:last-child{font-size:14px;color:#a0a4aa}
.capture-feature{display:grid;grid-template-columns:.82fr 1.18fr;gap:64px;align-items:center;scroll-margin-top:120px}
.capture-feature+.capture-feature{margin-top:110px}
.capture-feature-reverse{grid-template-columns:1.18fr .82fr}
.capture-feature-reverse .capture-copy{order:2}.capture-feature-reverse .capture-demo{order:1}
.capture-copy,.capture-demo{min-width:0}
.capture-kicker{font-size:12px;letter-spacing:1px;color:#a3c6b4}
.capture-copy h3{font-size:clamp(30px,3.25vw,43px);line-height:1.38;font-weight:570;letter-spacing:-1.3px;margin:17px 0 22px}
.capture-description{font-size:14px;line-height:2;color:#a8a8b0;max-width:420px}
.capture-benefits{padding:0;list-style:none;margin:23px 0;color:#c3ccc8;font-size:12px;line-height:1.85}
.capture-benefits li{display:flex;gap:10px;margin:9px 0}.capture-benefits li:before{content:'↗';color:#8fc7a9}
.capture-platform{display:inline-flex;border:1px solid #345246;background:#11271f80;color:#b5d6c4;border-radius:99px;font-size:10px;padding:4px 11px;gap:4px}
.capture-platform-blue{border-color:#394962;background:#19283b80;color:#b2cbe9}
.capture-shortcuts{display:flex;align-items:center;gap:8px;flex-wrap:wrap;font-size:10px;color:#a9afb5;margin-top:14px}
.capture-shortcuts kbd{font:11px/1.7 ui-monospace,monospace;padding:2px 6px;border:1px solid #404348;border-bottom-width:2px;border-radius:4px;color:#d4dadf;background:#161a1d}
.capture-note{font-size:10px;color:#878e96;margin-top:9px;line-height:1.8}
.capture-stage{container-type:inline-size;position:relative;aspect-ratio:1.22;border:1px solid #35443c;border-radius:22px;overflow:hidden;background:radial-gradient(ellipse at 70% 35%,#3a6c4d2b,transparent 70%),radial-gradient(#fff1 .7px,transparent .7px) 0 0/18px 18px,#111715;box-shadow:0 24px 80px #0005;color:#cbd6d0;isolation:isolate}
.capture-stage-bar{position:absolute;inset:0 0 auto;height:9%;border-bottom:1px solid #ffffff0b;background:#1b2220dd;display:flex;align-items:center;gap:3%;padding:0 4%;font-size:1.8cqw;color:#a2b2a9}
.capture-stage-bar>span:last-child{margin-left:auto;font-size:1.6cqw;color:#83958a}
.capture-traffic{display:flex;gap:.8cqw}.capture-traffic i{width:1.1cqw;height:1.1cqw;border-radius:50%;background:#df7e75}.capture-traffic i:nth-child(2){background:#d3b36c}.capture-traffic i:nth-child(3){background:#78b28b}
.capture-source{position:absolute;left:6%;top:21%;width:44%;padding:2.4%;border:1px solid #4c5a4c;border-radius:10px;background:#222c26;box-shadow:0 12px 30px #0004;transform:rotate(-3deg);transition:opacity .6s,transform .8s}
.capture-source-top{display:flex;justify-content:space-between;font-size:1.7cqw;margin-bottom:5%;color:#b7c3bb}.capture-source>img{width:100%;height:16cqw;object-fit:cover;border-radius:5px}
.capture-source p{font-size:2cqw;margin-top:7%;line-height:1.8;color:#e1eee4}.capture-copy-key{position:absolute;right:5%;bottom:-10%;padding:1.5% 5%;font:2cqw/1.6 ui-monospace,monospace;border:1px solid #8ac3a0;border-radius:6px;background:#cbe5d3;color:#173823;box-shadow:0 6px 20px #0003}
.capture-library{position:absolute;z-index:2;right:5%;top:14%;width:37%;height:78%;padding:3%;border:1px solid #ffffff35;border-radius:13px;background:linear-gradient(145deg,#303935f5,#1c2521f5);box-shadow:0 18px 45px #0006;transition:transform .8s}
.capture-library-title{display:flex;align-items:center;gap:5%;font-size:2.3cqw;color:#eef5f0;font-weight:600}.capture-library-title img{width:3.4cqw;height:3.4cqw;border-radius:4px}.capture-library-title>span:last-child{margin-left:auto;color:#9faea5}
.capture-search{font-size:1.5cqw;border:1px solid #ffffff18;background:#ffffff05;border-radius:5px;color:#85998c;padding:3% 6%;margin-top:6%}
.capture-filters{display:flex;gap:9%;margin:5% 0;font-size:1.4cqw;color:#90a197}.capture-filter-active{color:#d9f5e2}
.capture-library-item{border:1px solid #ffffff18;border-radius:7px;background:#414d443b;margin-top:6%;padding:6%;transition:opacity .55s,transform .65s}
.capture-collected-text{position:relative;padding:4%}.capture-type{font:2.2cqw Georgia,serif;color:#94bc9f}.capture-collected-text p{font-size:1.7cqw;line-height:1.65;margin:2% 0}.capture-collected-text small{font-size:1.25cqw;color:#8b9f91}
.capture-collected-image{padding:0;overflow:hidden}.capture-collected-image>img{width:100%;height:10.3cqw;object-fit:cover}.capture-collected-image>span{display:flex;justify-content:space-between;font-size:1.4cqw;padding:5% 6%}.capture-collected-image b{color:#d0dca7;font-size:1.7cqw}
.capture-file{display:flex;align-items:center;gap:5%;font-size:1.4cqw}.capture-file>span:first-child{color:#b7cbae}.capture-file small{margin-left:auto;font-size:1.2cqw;color:#96a59b}
.capture-library-footer{position:absolute;bottom:3%;left:8%;display:flex;align-items:center;gap:1cqw;font-size:1.3cqw;color:#97b69f}.capture-library-footer i{width:.7cqw;height:.7cqw;background:#9ad2a9;border-radius:50%}
.capture-canvas-label{position:absolute;left:7%;top:17%;width:42%;display:flex;justify-content:space-between;opacity:0;font-size:1.8cqw;color:#9daf9e;transition:opacity .4s}
.capture-board-card{position:absolute;left:8%;top:28%;width:40%;padding:1.5%;border:1px solid #9ad2a9;border-radius:7px;background:#26372b;opacity:0;transform:translate(84%,20%) scale(.72);transition:transform 1s cubic-bezier(.2,.75,.25,1),opacity .5s;box-shadow:0 0 0 3px #9ad2a90c,0 12px 25px #0005}
.capture-board-card img{width:100%;height:21cqw;object-fit:cover;border-radius:4px}.capture-board-card p{font-size:1.6cqw;padding:5% 3% 2%}
.capture-cursor{position:absolute;z-index:5;pointer-events:none;width:4.3%;transition:left 1.1s cubic-bezier(.2,.7,.2,1),top 1.1s cubic-bezier(.2,.7,.2,1),opacity .3s;filter:drop-shadow(0 3px 3px #0007)}.capture-cursor svg{width:100%;display:block}
.capture-clip-cursor{left:38%;top:58%}.capture-toast{position:absolute;z-index:3;display:flex;align-items:center;gap:1.2cqw;padding:1.6% 3%;border:1px solid #87b49755;border-radius:99px;background:#243b2f;color:#d2efdc;font-size:1.7cqw;opacity:0;transition:opacity .6s,transform .6s;box-shadow:0 8px 30px #0004}.capture-clip-toast{left:13%;bottom:16%;transform:translateY(12px)}.capture-toast>span:first-child{color:#ace6bb}
.capture-stage-note{position:absolute;bottom:4%;left:5%;color:#91a799;font-size:1.35cqw;letter-spacing:.1cqw}
.capture-progress{position:absolute;inset:auto 0 0;height:2px;background:linear-gradient(90deg,#9cd2a8,#96c8e7);transform:scaleX(var(--capture-progress,1));transform-origin:left}
[data-demo-kind="clipboard"][data-step="0"] .capture-collected-text,[data-demo-kind="clipboard"][data-step="0"] .capture-collected-image{opacity:0;transform:translateY(15px)}
[data-demo-kind="clipboard"][data-step="1"] .capture-clip-cursor{left:81%;top:59%}
[data-demo-kind="clipboard"][data-step="1"] .capture-source{opacity:.45;transform:rotate(-3deg) scale(.96)}
[data-demo-kind="clipboard"][data-step="2"] .capture-source{opacity:0;transform:scale(.9)}
[data-demo-kind="clipboard"][data-step="2"] .capture-canvas-label,[data-demo-kind="clipboard"][data-step="2"] .capture-board-card{opacity:1;transform:translate(0,0) scale(1)}
[data-demo-kind="clipboard"][data-step="2"] .capture-clip-cursor{left:40%;top:58%}
[data-demo-kind="clipboard"][data-step="2"] .capture-clip-toast{opacity:1;transform:translateY(0);transition-delay:.8s}
.capture-ocr-stage{border-color:#3c4560;background:radial-gradient(ellipse at 30% 70%,#5667ad24,transparent 65%),#141820;color:#cbd3e5}
.capture-ocr-stage .capture-stage-bar{background:#202633dd}.capture-ocr-stage .capture-stage-bar>span:last-child{color:#97a5bf}
.capture-document{position:absolute;left:8%;top:17%;width:76%;height:64%;padding:5%;border-radius:7px;background:#e4e3d9;color:#263531;transform:rotate(-2deg);box-shadow:0 15px 40px #0005}
.capture-document-top{display:flex;justify-content:space-between;font-size:1.2cqw;letter-spacing:.15cqw;color:#778176;border-bottom:1px solid #26353122;padding-bottom:4%}
.capture-document-title{font-size:3.5cqw;font-family:Georgia,'Songti SC',serif;margin-top:5%;font-weight:600}
.capture-ocr-source{position:relative;margin-top:5%;padding:3%;font-family:Georgia,'Songti SC',serif;font-size:2.4cqw;line-height:1.8;white-space:nowrap}
.capture-document-image{height:22%;margin:5% 3%;border-radius:3px;background:linear-gradient(90deg,#cfdaa099,#23392622),url('/assets/mocix-intro/cinematic.webp') center 55%/cover}
.capture-selection{position:absolute;inset:0;border:1.5px solid #749ded;background:#86aafa25;transform-origin:top left;transition:transform 1.1s,opacity .4s}
.capture-selection>i{position:absolute;width:1cqw;height:1cqw;background:#eaf1ff;border:1px solid #527abe}.capture-selection>i:nth-child(1){left:-.5cqw;top:-.5cqw}.capture-selection>i:nth-child(2){right:-.5cqw;top:-.5cqw}.capture-selection>i:nth-child(3){left:-.5cqw;bottom:-.5cqw}.capture-selection>i:nth-child(4){right:-.5cqw;bottom:-.5cqw}
.capture-scan{position:absolute;left:0;right:0;height:2px;top:0;background:#739fe9;box-shadow:0 0 15px #618deb;opacity:0}
.capture-recognizing{position:absolute;z-index:4;left:29%;top:65%;display:flex;align-items:center;gap:1.2cqw;padding:2% 4%;border:1px solid #53698c;border-radius:8px;background:#242e42;color:#d6e3fa;font-size:1.8cqw;opacity:0;transition:opacity .3s}.capture-recognizing>span:first-child{width:1.8cqw;height:1.8cqw;border:1.5px solid #91aad755;border-top-color:#c7ddff;border-radius:50%}
.capture-ocr-cursor{left:19%;top:39%}
.capture-ocr-result{position:absolute;z-index:3;left:26%;right:5%;top:56%;padding:3.5%;border:1px solid #ffffffba;border-radius:12px;background:#eef1f4f7;color:#233044;box-shadow:0 12px 40px #0006;opacity:0;transform:translateY(20px);transition:opacity .6s,transform .6s}
.capture-result-heading{display:flex;align-items:center;gap:1cqw;font-size:1.8cqw;font-weight:600}.capture-result-heading>span:first-child{display:grid;place-items:center;width:2.6cqw;height:2.6cqw;border-radius:50%;background:#d7e5df;color:#3c6a53}.capture-result-heading small{margin-left:auto;font-size:2cqw;color:#7d8590;font-weight:400}
.capture-result-text{font-size:2cqw;line-height:1.7;margin:5% 0 6%;white-space:pre-line}.capture-result-footer{display:flex;align-items:center;justify-content:space-between;font-size:1.35cqw;color:#788393;gap:5%}.capture-result-action{font-size:1.6cqw;background:#fff;border:1px solid #d1d7df;border-radius:5px;padding:3% 6%;color:#394b63}
[data-demo-kind="ocr"][data-step="0"] .capture-selection{transform:scale(.03,.1);opacity:.7}
[data-demo-kind="ocr"][data-step="1"] .capture-ocr-cursor{left:77%;top:55%}
[data-demo-kind="ocr"][data-step="1"] .capture-recognizing{opacity:1}
[data-demo-kind="ocr"][data-step="1"] .capture-scan{opacity:1;animation:capture-scan 1.3s ease-in-out infinite alternate}
[data-demo-kind="ocr"][data-step="1"] .capture-recognizing>span:first-child{animation:capture-spin 1.2s linear infinite}
[data-demo-kind="ocr"][data-step="2"] .capture-ocr-result{opacity:1;transform:translateY(0)}
[data-demo-kind="ocr"][data-step="2"] .capture-ocr-cursor{left:78%;top:51%;opacity:0}
[data-capture-demo][data-playing="false"] .capture-scan,[data-capture-demo][data-playing="false"] .capture-recognizing>span:first-child{animation-play-state:paused}
.capture-controls{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px;margin-top:16px}.capture-steps,.capture-playback{display:flex;gap:4px;align-items:center}
.capture-controls button{min-height:36px;background:transparent;border:1px solid transparent;border-radius:6px;padding:5px 8px;font-size:10px;color:#a0aaa4}.capture-steps button{display:flex;align-items:center;gap:6px}.capture-steps b{font-size:9px;font-weight:500;color:#73897c}.capture-steps button[aria-pressed="true"]{background:#192b22;border-color:#375040;color:#cbe9d6}.capture-playback button{font-size:10px;color:#a1a6af}.capture-playback button:hover{color:#e0eee5;background:#ffffff08}
.capture-bottom{display:flex;align-items:center;justify-content:space-between;gap:24px;margin-top:65px;padding-top:30px;border-top:1px solid #ffffff16}.capture-bottom p{font-size:13px;color:#a6b6ad}.capture-bottom .button{font-size:12px;min-height:44px}
@keyframes capture-scan{from{top:0}to{top:100%}}@keyframes capture-spin{to{transform:rotate(360deg)}}
@media(min-width:701px) and (max-width:1000px){.capture-feature,.capture-feature-reverse{gap:32px;grid-template-columns:1fr 1.15fr}.capture-feature-reverse{grid-template-columns:1.15fr 1fr}.capture-copy h3{font-size:30px}.capture-description{font-size:12px}.capture-benefits{font-size:11px}.capture-stage{aspect-ratio:1.12}.capture-library{height:73%}.capture-controls{gap:3px}.capture-steps button{padding:4px 5px}}
@media(max-width:700px){.capture-tools{padding-top:80px}.capture-heading{margin-bottom:36px}.capture-heading h2{font-size:32px}.capture-heading>p:last-child{font-size:13px}.capture-feature,.capture-feature-reverse{grid-template-columns:1fr;gap:28px}.capture-feature-reverse .capture-copy,.capture-feature-reverse .capture-demo{order:initial}.capture-feature+.capture-feature{margin-top:70px}.capture-copy h3{font-size:34px;margin:14px 0 18px}.capture-description{max-width:none;font-size:13px}.capture-benefits{margin:18px 0}.capture-stage{border-radius:16px}.capture-controls{margin-top:11px;gap:6px}.capture-controls button{min-height:40px}.capture-bottom{flex-direction:column;align-items:flex-start;margin-top:45px;gap:18px}}
@media(prefers-reduced-motion:reduce){.capture-stage *{transition:none!important;animation:none!important}}

/* Fixed slots keep translated cards and the collection status inside the panel. */
.capture-library{display:grid;grid-template-rows:8% 10% 6% 22% 28% 10% 4%;gap:2%}
.capture-library .capture-search,.capture-library .capture-filters,.capture-library .capture-library-item{margin:0;min-height:0}
.capture-library .capture-search,.capture-library .capture-filters{display:flex;align-items:center}
.capture-collected-text{overflow:hidden}.capture-collected-text .capture-type{float:left;margin-right:5%}.capture-collected-text p{margin:0 0 3%;line-height:1.5}
.capture-collected-image>img{height:70%}.capture-collected-image>span{height:30%;padding:2% 6%;align-items:center}
.capture-library-footer{position:static;align-self:center;font-size:1.3cqw}