/* Shared 16:10 device. Scene motion is owned solely by motion.js. */
.motion-demo{--ink:#20313c;--paper:#f5f3ed;--accent:#ff9f0a;margin:0 auto 24px;max-width:1120px}
.motion-demo .demo-topbar{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px}.motion-demo .demo-topbar small{display:block;font-size:13px;color:#acb4ad}.m-demo-controls{display:flex;gap:8px}.m-demo-controls button{font:inherit;font-size:13px;padding:8px 13px;border-radius:999px;background:#202425;color:#edebe6;border:1px solid #626866;cursor:pointer}.m-demo-controls button:focus-visible{outline:3px solid #ff9f0a;outline-offset:3px}
.motion-demo .macbook-frame{position:relative!important;padding:9px!important;border:1px solid #677174!important;border-radius:clamp(12px,2.5vw,28px)!important;background:#23292d!important;box-shadow:0 12px 30px #0003!important;overflow:hidden!important;aspect-ratio:auto!important}.motion-demo .macbook-frame:before,.motion-demo .macbook-frame:after{display:none!important}
.motion-demo .m-screen{position:relative!important;width:100%!important;aspect-ratio:16/10!important;height:auto!important;min-height:0!important;overflow:hidden!important;border-radius:clamp(7px,1.5vw,19px)!important;background:linear-gradient(135deg,#182b3e,#46647b)!important;container-type:inline-size;color:var(--ink);font:400 1.8cqw/1.35 Barlow,sans-serif}.m-screen:after{content:'';position:absolute;left:47%;top:0;width:6%;height:1.7%;border-radius:0 0 7px 7px;background:#11181e;z-index:40;pointer-events:none}
.motion-demo .m-world{position:absolute;inset:0;transform-origin:0 0}.motion-demo .m-world *{box-sizing:border-box}.motion-demo .m-world h3{font:600 3.7cqw/1.1 'Barlow Condensed',sans-serif;color:var(--ink);margin:1.2cqw 0 2cqw}.motion-demo .m-world p{font-size:1.9cqw;line-height:1.4;margin:1cqw 0;color:#52606a}.motion-demo .m-world img{max-width:100%;object-fit:contain}.m-menubar{height:6.5%;display:flex;align-items:center;justify-content:space-between;background:#dce3e9;padding:0 1.7%;gap:2%;font-size:1.5cqw;white-space:nowrap;position:relative;z-index:30}.m-menu-left,.m-menu-right,.m-menu-apps{display:flex;align-items:center;gap:1cqw}.m-menu-left{gap:1.4cqw}.m-menu-icon{display:inline-flex;align-items:center;width:2.25cqw;height:2.5cqw;flex-shrink:0}.m-menu-icon img{width:100%;height:100%;filter:brightness(.12)}.m-menu-apps{overflow:hidden;max-width:26cqw}.m-wifi{width:2cqw;fill:none;stroke:currentColor;stroke-width:2}.m-battery{width:2.4cqw;height:1.2cqw;border:1px solid;border-radius:2px;background:linear-gradient(90deg,#20313c 80%,transparent 80%)}
.m-surface{background:var(--paper);border:1px solid #b5c0c0;border-radius:1.1cqw;box-shadow:0 1.2cqw 2.6cqw #07132126}.m-window{position:absolute;left:12%;top:22%;width:76%;overflow:hidden}.m-titlebar{display:flex;justify-content:space-between;align-items:center;padding:1.2cqw 1.7cqw;background:#e4e5df;border-bottom:1px solid #c2c8c4;font-size:1.5cqw}.m-lights{display:flex;gap:.55cqw}.m-lights i{width:.7cqw;height:.7cqw;background:#869083;border-radius:50%}.m-doc-body{padding:3cqw 4cqw}.m-kicker{font:400 1.3cqw 'IBM Plex Mono',monospace;letter-spacing:.1em;color:#647166}.m-field{margin:1.4cqw 0}.m-field-label{display:block;font-size:1.4cqw;color:#58655f;margin-bottom:.5cqw}.m-field-value{display:block;background:#fff;border:1px solid #aeb9b5;border-radius:.5cqw;padding:1cqw 1.4cqw;min-height:4.5cqw;font-size:1.9cqw}.m-popover{position:absolute;z-index:20}.m-popup-title{display:flex;align-items:center;gap:1cqw;border-bottom:1px solid #c3cbc5;padding-bottom:1.1cqw;margin-bottom:1.3cqw}.m-popup-title img{width:2.5cqw;height:2.5cqw}.m-popup-title>span{margin-left:auto;font-size:1.3cqw;color:#59665e}.m-button{display:inline-block;padding:1cqw 2cqw;border-radius:.65cqw;background:#e1e6e0;font-size:1.7cqw}.m-primary{background:#0f6e68;color:#fff}.m-panel-actions{display:flex;align-items:center;justify-content:space-between;margin-top:1.6cqw;font-size:1.5cqw}.m-toast{position:absolute;z-index:24;bottom:5%;left:20%;width:60%;padding:1.3cqw 2cqw;display:flex;align-items:center;justify-content:center;gap:1.2cqw;font-size:1.8cqw;background:#f2f5ed}.m-success{color:#0f6e68;font-size:2.5cqw}.m-cursor{position:absolute;width:2.6%;height:5.5%;left:0;top:0;z-index:45;fill:white;stroke:#18252e;stroke-width:1.3;filter:drop-shadow(0 2px 2px #0004);pointer-events:none}.m-click{position:absolute;width:2.5cqw;height:2.5cqw;border:2px solid #ff9f0a;border-radius:50%;z-index:44;pointer-events:none}.m-loop-veil{position:absolute;inset:0;background:#1d3446;z-index:50;pointer-events:none;opacity:0}.motion-demo .m-caption{font-size:16px;color:#c0c6bd;margin:12px 0 0}.m-lines i{display:block;height:.5cqw;background:#cbd3d6;margin:1.5cqw 0}.m-lines i:last-child{width:60%}
/* Paste: searchable history then explicit normal paste. */
.m-paste-panel{left:39%;top:10%;width:54%;padding:1.8cqw}.m-search{display:flex;gap:1cqw;background:white;border:1px solid #a7b5ac;border-radius:.6cqw;padding:1cqw;font-size:1.8cqw;min-height:4cqw}.m-history-row{display:flex;align-items:center;gap:1cqw;padding:1.3cqw .7cqw;border-bottom:1px solid #d1d7d0;font-size:1.6cqw;min-height:6cqw}.m-history-row small{display:block;color:#69766b;font-size:1.2cqw}.m-file-icon{background:#e0e6dc;padding:.7cqw;border-radius:.4cqw}.m-favorite{margin-left:auto}.m-popup-footer{display:flex;justify-content:space-between;padding-top:1.2cqw;font-size:1.2cqw;color:#59685d}.m-caret{height:2cqw;width:1px;background:#0f6e68}.m-address{margin-top:3cqw}
/* Bar: the menu is the subject; the document stays quiet. */
.m-bar-document{width:50%;left:15%;top:39%;opacity:.35}.m-bar-document h3{font-size:3cqw!important}.m-shelf{right:4%;top:9%;display:flex;gap:1.4cqw;padding:1.5cqw}.m-shelf>span{display:block;width:3cqw;height:3cqw}.m-shelf img{width:100%;height:100%;filter:brightness(.15)}.m-shot-menu{right:5%;top:21%;width:34%;padding:1.6cqw}.m-shot-menu>span{display:flex;justify-content:space-between;padding:1.2cqw 0;border-top:1px solid #cbd1cb;font-size:1.6cqw}.m-shot-menu>strong{display:block;margin-bottom:1cqw}.m-shot-menu small{font-size:1.2cqw}.m-shelf-tooltip{right:27%;top:19%;padding:.4cqw 1cqw;font-size:1.4cqw}
.m-logo-card{background:#edebe6;padding:4cqw 2cqw}.m-logo-card img{width:100%;height:15cqw}.m-capture-document{top:20%;left:10%;width:80%}.m-capture-selection{position:absolute;left:5%;top:28%;width:90%;height:56%;border:2px solid #0f8d81;transform-origin:0 0}.m-annotation-toolbar{top:12%;left:12%;padding:1.2cqw;display:flex;align-items:center;gap:2cqw;background:#24332f;color:#fff;white-space:nowrap;font-size:2cqw}.m-annotation-toolbar i{background:#ff9f0a;width:1.4cqw;height:1.4cqw;border-radius:50%}.m-annotation-toolbar span:last-child{font-size:1.4cqw}.m-annotation-path{position:absolute;inset:30% 5% 10%;width:90%;height:60%;fill:none;stroke:#ff9f0a;stroke-width:.7}.m-annotation-note{position:absolute;right:18%;bottom:17%;font-size:1.7cqw;color:#8a4c00}
.m-record-panel{left:24%;top:11%;width:52%;padding:2cqw}.m-checkrow{display:flex;align-items:center;gap:1cqw;margin:1.2cqw 0;font-size:1.6cqw}.m-check{padding:0 .3cqw;border:1px solid #87998e;background:#0f6e68;color:#fff;border-radius:.3cqw}.m-mic-options{left:32%;top:37%;width:48%;padding:1.2cqw}.m-mic-options span{display:block;padding:1.3cqw}.m-option-selected{background:#d2e5df}.m-record-document{top:22%}.m-review-logo{width:100%;height:14cqw}.m-countdown{position:absolute;inset:0;display:grid;place-items:center;background:#10243488;color:#fff;z-index:25;font:600 12cqw 'Barlow Condensed'}.m-recording-pill{position:absolute;left:43%;top:9%;background:#251c21;color:#fff;border-radius:99px;padding:.8cqw 2cqw;font-size:1.6cqw}.m-recording-pill i,.m-record-dot{display:inline-block;width:1cqw;height:1cqw;background:#ee4a47;border-radius:50%;margin-right:1cqw}.m-audio-session{left:23%;top:26%;width:54%;padding:3cqw;text-align:center}.m-waveform{display:flex;align-items:center;justify-content:center;gap:1cqw;height:8cqw}.m-waveform i{width:1.5cqw;height:4cqw;background:#0f6e68;border-radius:99px}
.m-ocr-document{top:23%;left:10%;width:67%}.m-ocr-selection{position:absolute;left:8%;top:30%;width:82%;height:49%;border:2px solid #0f8d81;transform-origin:0 0}.m-ocr-panel{left:31%;top:16%;width:60%;padding:2cqw}.m-ocr-text{padding:2cqw;background:#fff;border:1px solid #acbab1;min-height:11cqw;font-size:2cqw;margin:1cqw 0}.m-ocr-panel small{font-size:1.3cqw}
.m-awake-menu{right:5%;top:9%;width:44%;padding:2cqw}.m-awake-option{display:block;padding:1.2cqw;border-bottom:1px solid #ccd4cb;font-size:1.7cqw}.m-awake-chip{display:inline-block;background:#e0e8d8;color:#354a2e;padding:1.3cqw 2cqw;border-radius:99px;font-size:1.7cqw}.m-awake-document{top:32%}.m-display-dim{position:absolute;inset:6.5% 0 0;background:#091320;z-index:18;opacity:0}
.m-clean-panel{left:24%;top:22%;width:52%;padding:3cqw;text-align:center}.m-clean-panel img{width:5cqw;height:5cqw}.m-clean-lock{position:absolute;inset:6.5% 0 0;background:#30273e;text-align:center;padding:6cqw 8cqw;color:#ede7f5}.m-clean-lock h3{color:#ede7f5!important;font-size:4.5cqw!important}.m-clean-lock p{color:#c5bdd0!important}.m-clean-lock>strong{font:500 5cqw 'IBM Plex Mono'}.m-command-keys{display:flex;gap:1cqw;justify-content:center;margin:2cqw}.m-command-keys i{font-style:normal;border:1px solid #b1a5c3;border-radius:.7cqw;padding:1cqw 2cqw}.m-clean-lock small{font-size:1.5cqw}
.m-keys-document{left:10%;width:80%;top:14%}.m-keys-document .m-doc-body{padding:2cqw 3cqw}.m-typing-line{min-height:3cqw}.m-keyboard{position:absolute;left:10%;bottom:7%;width:68%;padding:1.3cqw;background:#1c1d1f;border:1px solid #9c9990;border-radius:1.3cqw}.m-keyboard>div{display:flex;gap:.55cqw;margin:.55cqw 0}.m-keyboard span{display:grid;place-items:center;border:1px solid #85857e;border-radius:.25cqw;color:#e3e1d5;font:400 1.3cqw Barlow;height:2.8cqw;flex:1}.m-keyboard .m-space{flex:3}.m-mouse{position:absolute;bottom:9%;right:9%;width:8%;height:22%;fill:#24262a;stroke:#b9b6ad;stroke-width:1.5}.m-mouse-left,.m-mouse-right{fill:#33383e}.m-keys-pasted{min-height:2cqw}
.m-mirror-document{left:6%;top:28%;width:48%}.m-mirror-preview{position:absolute;left:58%;top:23%;width:36%;aspect-ratio:1;border:2px solid #e9dfeb;border-radius:50%;overflow:hidden;background:#d8d9cd}.m-face{width:100%;height:100%;transform-origin:50% 40%}.m-face img{width:100%;height:100%}.m-zoom-badge{position:absolute;right:12%;top:7%;background:#211d25aa;color:#fff;padding:.3cqw .7cqw;font-size:1.5cqw;border-radius:.3cqw}.m-mic-meter{position:absolute;left:13%;right:13%;bottom:10%;background:#201c2bcc;color:#fff;padding:1cqw;font-size:1.3cqw;border-radius:.5cqw}.m-mic-meter i{display:block;background:#645869;height:.65cqw;border-radius:99px;overflow:hidden;margin-top:.4cqw}.m-mic-meter b{display:block;width:50%;height:100%;background:#bdd69f}
.m-plain-source{left:5%;top:22%;width:43%}.m-plain-target{left:52%;top:29%;width:43%}.m-styled-text{font:600 3cqw Georgia!important;color:#713f5b!important;background:#eedb99}.m-shortcut{font-size:1.3cqw;color:#6d7368}.m-plain-result{min-height:9cqw}.m-code-window{left:5%;top:15%;width:90%}.m-code-layout{display:grid;grid-template-columns:17% 43% 40%;min-height:36cqw}.m-code-layout aside{background:#e4e5dd;padding:1.7cqw 1cqw;font-size:1.3cqw}.m-code-layout aside span{display:block;padding:.8cqw .3cqw}.m-code-settings{padding:2cqw}.m-code-tabs{display:flex;gap:1cqw;font-size:1.2cqw;margin-bottom:2cqw}.m-code-tabs span{border-bottom:2px solid transparent}.m-code-settings h3{font-size:2.6cqw!important}.m-code-settings .m-field-value{font-size:1.3cqw;padding:.8cqw}.m-code-appearance,.m-code-export{position:absolute;top:11cqw;width:33%}.m-swatches{display:flex;gap:1cqw;margin:1cqw 0}.m-swatches i{width:2cqw;height:2cqw;border-radius:50%;background:#713f5b}.m-swatches i:nth-child(2){background:#0f6e68}.m-swatches i:nth-child(3){background:#111}.m-qr-preview{padding:4cqw 1.5cqw;align-self:center;text-align:center}.m-qr-preview img{width:100%;height:auto}.m-qr-verified{font-size:1.1cqw;display:block;margin-top:1cqw}.m-code-export small{display:block;margin-top:1.5cqw;font-size:1.3cqw}
@media(max-width:800px){.motion-demo .macbook-frame{padding:5px!important}.m-menu-words{display:none}.m-demo-controls button{padding:7px 10px;font-size:12px}.motion-demo .demo-topbar{font-size:15px}.motion-demo .m-caption{font-size:14px}.m-menu-left b{font-size:1.8cqw}}
@media(max-width:800px){.m-record-panel{left:16%;width:68%;padding:1.8cqw;top:10%}.m-record-panel .m-popup-title{font-size:2.5cqw;margin-bottom:1cqw;padding-bottom:1cqw}.m-record-panel .m-field{margin:.9cqw 0}.m-record-panel .m-field-label{font-size:2.1cqw;margin-bottom:.3cqw}.m-record-panel .m-field-value{font-size:2.6cqw;min-height:4.5cqw;padding:.7cqw 1cqw}.m-record-panel .m-checkrow{font-size:2.1cqw;margin:.8cqw 0}.m-record-panel .m-panel-actions{margin-top:1cqw;font-size:2cqw}.m-record-panel .m-button{font-size:2.3cqw}.m-mic-options{left:24%;width:61%;font-size:2.5cqw}.m-ocr-panel{left:18%;width:69%}.m-ocr-text{font-size:2.6cqw}.m-paste-panel{font-size:2.3cqw}.m-history-row{font-size:2.15cqw}.m-history-row small{font-size:1.7cqw}.m-popup-title>span{font-size:1.7cqw}.m-search{font-size:2.4cqw}.m-popup-footer{font-size:1.7cqw}}
/* Source choices share a row: preserves the Record action inside the screen. */
.m-record-panel{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:1.5cqw}.m-record-panel>.m-popup-title,.m-record-panel>.m-panel-actions{grid-column:1/-1}.m-record-panel .m-field-value{overflow-wrap:anywhere}.m-record-panel .m-checkrow{align-self:center}.m-record-panel .m-field{min-width:0}
.m-toast{color:#20313c;font-family:Barlow,sans-serif}
@media(max-width:800px){.m-history-row.m-history-other:nth-last-child(2){display:none}.m-ocr-panel{left:26%;width:67%}}
.m-demo-controls button{min-height:44px}
.motion-demo:not([data-motion-ready]) :is(.m-popover,.m-toast,.m-cursor,.m-click,.m-countdown,.m-clean-lock,.m-annotation-toolbar,.m-annotation-path,.m-annotation-note,.m-capture-selection,.m-ocr-selection,.m-code-appearance,.m-code-export){visibility:hidden}.motion-demo:not([data-motion-ready]) .m-world>.m-toast:last-child{visibility:visible}
/* KlikRename is a window app; there is no invented menubar control. */
.m-rename-window{left:5%;top:18%;width:90%}.m-rename-layout{display:grid;grid-template-columns:34% 66%;min-height:34cqw}.m-rename-rules{padding:2cqw;background:#e6e5db;border-right:1px solid #c6cbc0}.m-rename-rules>strong{display:block;margin-bottom:2cqw}.m-rename-rules .m-field-value{font-size:1.5cqw}.m-rename-model{display:block;margin-top:2cqw;font-size:1.4cqw;color:#596453}.m-rename-preview{padding:2.5cqw 2cqw}.m-rename-head,.m-rename-row{display:grid;grid-template-columns:1fr 1.2fr;gap:1cqw;font-size:1.6cqw;padding:1.3cqw .5cqw;border-bottom:1px solid #cbd0c5}.m-rename-head{font-size:1.3cqw;color:#64705f;margin-top:1.5cqw}.m-rename-new b{color:#805b30;text-decoration:underline;text-underline-offset:.25em}.m-rename-confirm{left:23%;top:31%;width:54%;padding:2.3cqw}.m-rename-confirm>strong{font-size:2.5cqw}.m-rename-confirm p{font-size:1.8cqw!important}.m-rename-preview .m-button{background:#805b30;margin-top:.5cqw}.m-rename-count{font-size:1.4cqw!important}
@media(max-width:800px){.m-rename-head{font-size:1.7cqw}.m-rename-row{font-size:2cqw}.m-rename-rules .m-field-value{font-size:2cqw}.m-rename-confirm{left:13%;width:74%}.m-rename-confirm>strong{font-size:3cqw}.m-rename-confirm p{font-size:2.5cqw!important}.m-rename-confirm .m-button{font-size:2.6cqw}}
/* Shelf: from two folders to one destination; originals stay visible. */
.m-sh-finder{width:31%;left:3%}.m-sh-a{top:11%}.m-sh-b{top:53%}.m-sh-c{left:66%;top:32%}.m-sh-list{position:relative;padding:.8cqw;min-height:13cqw}.m-sh-file{display:flex;align-items:center;gap:.9cqw;padding:.8cqw;border-radius:.5cqw;font-size:1.7cqw}.m-sh-glyph{flex:none;padding:.2cqw .5cqw;border:1px solid #9aa89f;border-radius:.3cqw;background:#fff;font:400 1cqw 'IBM Plex Mono',monospace;color:#4f5d54}.m-sh-anchor{position:absolute;left:50%;top:50%;width:1px;height:1px}.motion-demo .m-world p.m-sh-dest-empty,.motion-demo .m-world p.m-sh-empty{position:absolute;inset:0;display:grid;place-items:center;margin:0;font-size:1.6cqw;color:#6a766e;text-align:center}
.m-sh-panel{left:36.5%;top:13%;width:27%;padding:1.2cqw}.m-sh-head{display:flex;align-items:center;justify-content:space-between;gap:1cqw}.m-sh-panel .m-primary{background:#1e6b3c;font-size:1.5cqw;padding:.8cqw 1.3cqw;white-space:nowrap}.m-sh-close{color:#5c685f;font-size:2cqw;line-height:1}.m-sh-drop{position:relative;min-height:15cqw;margin:1cqw 0;padding:.5cqw;border:1px dashed #9aa89f;border-radius:.6cqw}.m-sh-foot{font-size:1.4cqw;color:#55625a}
.motion-demo .m-toast.m-sh-ghost{left:0;top:0;bottom:auto;width:auto;margin:1.1cqw 0 0 1.1cqw;padding:.6cqw 1.1cqw;font-size:1.5cqw;white-space:nowrap;z-index:26;background:#fff}
@media(max-width:800px){.m-sh-file{font-size:2.3cqw}.m-sh-glyph{font-size:1.3cqw}.motion-demo .m-world p.m-sh-dest-empty,.motion-demo .m-world p.m-sh-empty{font-size:2.2cqw}.m-sh-panel .m-primary{font-size:2.1cqw}.m-sh-foot{font-size:2cqw}.m-toast.m-sh-done{font-size:2.5cqw;width:76%;left:12%}.motion-demo .m-toast.m-sh-ghost{font-size:2.3cqw}}