.osm-demo{width:100%;font-family:-apple-system,BlinkMacSystemFont,'SF Pro Text','Segoe UI',sans-serif;color:#1d1d1f;text-align:left;--demo-accent:#007aff}
.osm-demo *{box-sizing:border-box}.osm-demo svg{flex-shrink:0}.osm-demo button{font:inherit}.osm-demo p{color:inherit}.osm-demo button:focus-visible{outline:2px solid #007aff;outline-offset:4px}
.macbook{position:relative;padding:0 10px 16px}.mac-screen{position:relative;padding:9px 9px 11px;background:linear-gradient(#252525,#0a0a0a);border:1px solid #414141;border-radius:20px 20px 10px 10px;box-shadow:inset 0 1px 0 #777,0 16px 35px #00000012}.demo-desktop{position:relative;aspect-ratio:1.6;overflow:hidden;border-radius:10px 10px 2px 2px;background:#c8d1d5 url('/assets/macos-wallpaper.jpg') center/cover;isolation:isolate;container-type:inline-size}.mac-camera{position:absolute;left:50%;top:8px;transform:translateX(-50%);width:13%;height:22px;background:#171717;border-radius:0 0 9px 9px;z-index:5;display:grid;place-items:center}.mac-camera i{width:4px;height:4px;border-radius:50%;background:#263042;box-shadow:0 0 0 2px #121212}.mac-base{position:absolute;left:0;right:0;bottom:4px;height:15px;background:linear-gradient(#dfe0e1 0%,#a5a5a9 15%,#c1c2c5 45%,#a4a4a7 70%,#737376);border-radius:1px 1px 30px 30px;box-shadow:0 9px 12px -9px #0009,inset 0 1px 1px #fff}.mac-base i{position:absolute;left:42%;top:0;width:16%;height:5px;background:linear-gradient(#929296,#c9c9cd);border-radius:0 0 10px 10px}
.mac-menubar{height:28px;position:absolute;top:0;left:0;right:0;padding:0 1.7%;display:flex;align-items:center;gap:18px;background:#f8f8f863;backdrop-filter:blur(30px);font-size:clamp(9px,1.05cqw,12px);font-weight:500;z-index:4;color:#202327;white-space:nowrap}.mac-apple{font:18px -apple-system,BlinkMacSystemFont,sans-serif;line-height:1}.mac-menu-space{flex:1}.mac-menubar b{font-weight:650}.mac-wifi{width:15px;height:13px}.mac-battery{width:23px;height:11px;border:1px solid currentColor;border-radius:3px;position:relative;margin-left:-4px}.mac-battery:before{content:'';position:absolute;inset:1.5px;background:currentColor;border-radius:1px}.mac-battery:after{content:'';position:absolute;left:23px;top:3px;height:4px;width:2px;background:currentColor;border-radius:0 2px 2px 0}.mac-control-center{width:13px;display:grid;gap:3px}.mac-control-center i{display:block;position:relative;height:4px;width:12px;background:currentColor;border-radius:4px}.mac-control-center i:before{content:'';position:absolute;width:3px;height:3px;top:.5px;left:1px;border-radius:50%;background:#ddd}.mac-control-center i+i:before{left:auto;right:1px}
.mac-app-window{position:absolute;left:3.8%;top:9.5%;width:73%;height:70%;background:#fff;border:1px solid #0003;border-radius:10px;box-shadow:0 18px 50px #0004,0 1px 4px #0003;overflow:hidden}.mac-toolbar{height:47px;display:flex;align-items:center;gap:17px;padding:0 14px;background:linear-gradient(#fafafa,#eeeeef);border-bottom:1px solid #dededf;color:#6b6b6e;white-space:nowrap}.mac-toolbar-icon{width:19px;height:21px;display:grid;place-items:center;flex-shrink:0}.mac-toolbar-icon svg{width:18px;height:18px}.mac-toolbar-space{flex:1}.mac-toolbar-title{flex:1;text-align:center;font-size:11px;font-weight:500;overflow:hidden;text-overflow:ellipsis}.mac-type-icon{font:18px Georgia,serif}.mac-traffic{display:flex;gap:8px;padding-right:4px;flex-shrink:0}.mac-traffic i{width:12px;height:12px;border-radius:50%;background:#ff5f57;border:.5px solid #df4b45}.mac-traffic i:nth-child(2){background:#febc2e;border-color:#de9e25}.mac-traffic i:nth-child(3){background:#28c840;border-color:#1eab2e}
.demo-overlay{position:absolute;right:2.7%;top:15%;width:33.5%;min-height:38%;background:#fffffff5;border:1px solid #d1d1d1;border-radius:10px;padding:23px;box-shadow:0 16px 40px #0003,0 2px 6px #0000000f;z-index:3;backdrop-filter:blur(20px)}.demo-overlay-brand{font-size:11px;font-weight:500;color:#666;margin-bottom:13px}.demo-overlay-heading{font-size:clamp(16px,1.9cqw,22px);line-height:1.15;font-weight:550;letter-spacing:-.45px;max-width:55%;min-height:81px;padding-top:10px}.demo-face{position:absolute;right:12px;top:13px;margin:0!important;padding:0!important;border:0!important;background:none!important;font:500 clamp(7px,.86cqw,10px)/1.25 ui-monospace,SFMono-Regular,Menlo,monospace!important;letter-spacing:0!important;font-variant-ligatures:none!important;color:#3b3b3b;white-space:pre;user-select:none;overflow:visible!important}.demo-context{display:flex;flex-wrap:wrap;gap:5px;margin:8px 0 14px}.demo-context>span{display:inline-flex;align-items:center;gap:4px;border:1px solid #cbd9e6;color:#43637e;border-radius:5px;padding:4px 6px;background:#f5f9fc;font-size:clamp(8px,.8cqw,9px);line-height:14px;white-space:nowrap}.demo-context svg{width:11px;height:11px}.demo-overlay-body{font-size:clamp(11px,1.16cqw,13px);line-height:1.6;min-height:4.8em;color:#454545;margin-bottom:18px}.demo-overlay-footer{border-top:1px solid #e5e5e5;padding-top:11px;font-size:clamp(7px,.75cqw,9px);color:#737373;line-height:1.5}.demo-pointer{position:absolute;left:50%;top:50%;z-index:4;display:flex;align-items:flex-start;gap:4px;pointer-events:none;transition:left 650ms ease,top 650ms ease}.demo-pointer>svg{width:22px;height:30px;filter:drop-shadow(1px 2px 2px #0005)}.demo-pointer>span{position:relative;top:23px;left:-8px;white-space:nowrap;background:#007aff;color:#fff;font-size:10px;font-weight:550;line-height:22px;padding:0 7px;border-radius:4px;box-shadow:0 1px 4px #0002}.demo-pointer:before{content:'';position:absolute;left:-10px;top:-8px;width:35px;height:35px;background:#007aff16;border:1px solid #007aff5c;border-radius:50%;animation:cursor-ring 2.5s ease-out infinite}.demo-target{transition:background .4s,box-shadow .4s}[data-scenario='handoff'] .demo-pointer>span{background:#4b7253}
.demo-voice{position:absolute;z-index:4;left:50%;bottom:88px;transform:translateX(-50%);display:flex;align-items:center;gap:13px;background:#252525ed;color:#fff;border:1px solid #ffffff3a;border-radius:14px;box-shadow:0 8px 30px #0003;padding:13px 17px;width:68%;max-width:720px;backdrop-filter:blur(24px)}.demo-voice-icon{width:29px;height:29px;display:grid;place-items:center;border-radius:50%;background:#ffffff16;flex-shrink:0}.demo-voice-icon svg{width:16px;height:16px}.demo-voice-content{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.demo-voice-label{font-size:8px;font-weight:600;letter-spacing:1px;color:#b6b6b6}.demo-transcript{font-size:clamp(11px,1.24cqw,14px);line-height:1.4;min-height:1.4em}.demo-wave{height:26px;display:flex;align-items:center;gap:2px;width:38px;flex-shrink:0}.demo-wave i{width:2px;height:7px;display:block;background:#ddd;border-radius:2px;animation:voice-wave 900ms ease-in-out infinite alternate;animation-delay:calc(var(--bar)*-110ms)}.demo-wave i:nth-child(3n){height:13px}.demo-wave i:nth-child(4n){height:21px}[data-speaking='false'] .demo-wave i{animation:none;height:3px;opacity:.65}.mac-dock{display:flex;align-items:flex-end;gap:9px;position:absolute;left:50%;bottom:13px;transform:translateX(-50%);height:61px;padding:6px 10px 10px;background:#eeeeee70;border:1px solid #ffffff7a;border-radius:17px;box-shadow:0 2px 14px #0002,inset 0 0 0 1px #00000005;backdrop-filter:blur(24px);z-index:2}.mac-dock>span{position:relative;display:grid;place-items:center;width:44px;height:44px}.mac-dock img{width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 2px 2px #0002)}.mac-dock>span.active:after{content:'';width:3px;height:3px;background:#333;border-radius:50%;position:absolute;bottom:-5px;left:calc(50% - 1.5px)}.mac-dock>i{height:37px;width:1px;background:#0002;margin:0 2px}.mac-dock .mac-osm-icon{width:38px;height:38px;background:linear-gradient(#fff,#f0f0f0);border-radius:9px;box-shadow:0 1px 3px #0003;display:grid;place-items:center;font:500 10px/1 var(--mono);font-variant-ligatures:none;font-feature-settings:"liga" 0,"calt" 0;letter-spacing:0;white-space:nowrap;color:#171717;margin-bottom:3px}
.safari-toolbar{gap:14px}.safari-arrows{display:flex;gap:12px}.safari-arrows svg{width:12px;height:17px}.safari-arrows svg+svg{transform:rotate(180deg);opacity:.35}.safari-address{height:27px;border-radius:7px;background:#dfdfe0;box-shadow:inset 0 .5px 0 #00000008;display:flex;align-items:center;justify-content:center;gap:7px;font-size:11px;flex:1;max-width:65%;margin-left:4px}.safari-address svg{width:11px;height:11px;opacity:.65}.mac-toolbar-plus{font-size:22px;font-weight:300}.safari-tabs{height:25px;background:#e9e9eb;display:flex;border-bottom:1px solid #bfc0c2;font-size:9px;color:#606266;align-items:stretch}.safari-tabs>span{display:flex;gap:6px;align-items:center;justify-content:center;background:#fafafa;width:55%;border-right:1px solid #d6d7d9}.safari-tabs svg{width:11px;height:11px}
.terminal-toolbar{height:33px;background:linear-gradient(#f4f4f4,#e4e4e4)}.terminal-content{height:calc(100% - 33px);background:#1d1f22;color:#e6e6e7;padding:18px 22px;font:clamp(9px,1.07cqw,12px)/1.6 ui-monospace,SFMono-Regular,Menlo,monospace}.terminal-content p{margin:0 0 15px}.terminal-muted{color:#9499a1}.terminal-green{color:#9ad38d}.terminal-red{color:#f1a097}.terminal-error{background:#483b3b;color:#efb0a7;padding:10px 12px;max-width:83%;outline:1px solid #f5a79d77;outline-offset:3px;margin:20px 0}.terminal-error strong{color:#f4d3cd;font-weight:500}.terminal-error span{font-size:10px;color:#bea7a5}.terminal-caret{display:block;width:7px;height:13px;background:#ddd}.agent-toolbar>svg{width:18px;height:18px}.coding-agent{display:flex;height:calc(100% - 47px)}.coding-agent aside{width:25%;padding:22px 15px;background:#f4f4f4;border-right:1px solid #ddd;font-size:10px}.coding-agent aside b{display:block;font-size:11px;margin-bottom:20px}.coding-agent aside>span{display:block;background:#e5e5e5;padding:7px;border-radius:4px;white-space:nowrap}.coding-agent aside small{display:block;font-size:8px;color:#777;margin:30px 0 13px;letter-spacing:1px}.coding-agent aside p{margin:0 0 13px;color:#777}.coding-agent article{width:75%;padding:25px 27px}.coding-agent article>small{font-size:8px;color:#888;letter-spacing:1px}.coding-agent h3{font-size:22px;font-weight:600;letter-spacing:-.4px;margin:10px 0 20px;line-height:1.2}.agent-request{max-width:76%;background:#f4f5f5;border:1px solid #e0e1e2;border-radius:10px;padding:16px;font-size:11px;line-height:1.5}.agent-request p{margin:0 0 12px}.agent-request pre{font:9px/1.6 ui-monospace,Menlo,monospace;color:#9b635b;white-space:pre-wrap;margin:12px 0}.agent-request strong{font-weight:600}.agent-request>span{font-size:9px;color:#547a5b;display:block;margin-top:12px}
.demo-controls{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-top:20px}.demo-scenarios{display:flex;gap:6px}.demo-scenarios button{display:flex;align-items:center;gap:8px;white-space:nowrap;background:none;border:1px solid transparent;border-radius:7px;padding:10px 12px;font-size:12px;color:#737373;cursor:pointer}.demo-scenarios button>span{font-size:10px;font-variant-numeric:tabular-nums}.demo-scenarios button[aria-pressed='true']{color:#171717;border-color:#e4e4e4;background:#f8f8f8}.demo-scenarios button:hover{background:#f6f6f6;color:#171717}.demo-playback{display:flex;align-items:center;gap:7px}.demo-playback button{display:flex;align-items:center;justify-content:center;gap:5px;background:none;border:0;padding:8px 4px;min-width:28px;min-height:32px;color:#737373;font-size:11px;cursor:pointer}.demo-playback button:hover{color:#171717}.demo-playback svg{width:16px;height:16px}.demo-pause-symbol{font-size:13px}.demo-caption{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-top:14px;padding:0 4px;font-size:12px;color:#656565;line-height:1.5}.demo-progress{white-space:nowrap;font-size:11px;font-variant-numeric:tabular-nums}.is-paused .demo-wave i,.is-paused .demo-pointer:before{animation-play-state:paused}
@keyframes voice-wave{from{transform:scaleY(.45)}to{transform:scaleY(1.2)}}@keyframes cursor-ring{0%{transform:scale(.65);opacity:1}80%,100%{transform:scale(1.5);opacity:0}}
@media(max-width:1000px){.mac-menubar{gap:12px}.mac-app-window{left:3%;width:74%;top:10%;height:70%}.mac-toolbar{gap:13px;height:38px}.notes-layout{height:calc(100% - 38px)}.note-content{padding:12px 23px}.note-content h3{margin-top:22px}.note-content p{margin-bottom:13px}.notes-sidebar{padding:13px 8px}.notes-preview{padding:8px}.demo-overlay{padding:17px;width:35%;right:2.2%;top:15%}.demo-overlay-brand{font-size:10px}.demo-overlay-heading{min-height:68px;padding-top:5px}.demo-context{margin-top:8px;margin-bottom:10px}.demo-overlay-body{min-height:4.8em;margin-bottom:12px}.demo-face{font-size:8px!important;right:10px}.demo-voice{bottom:74px;padding:10px 13px;gap:10px;width:74%}.mac-dock{height:52px;bottom:11px;gap:7px;padding:5px 8px 9px;border-radius:14px}.mac-dock>span{width:37px;height:37px}.mac-dock .mac-osm-icon{width:32px;height:32px;font-size:9px;margin-bottom:2px}.mac-dock>i{height:31px}.demo-scenarios button{font-size:11px;padding:8px 10px}.terminal-content{padding:14px 18px}.terminal-content p{margin-bottom:10px}.terminal-error{margin:14px 0}.coding-agent article{padding:20px}.coding-agent h3{font-size:19px;margin-bottom:14px}.agent-request{padding:12px;font-size:10px}.agent-request pre{font-size:8px}.demo-caption{font-size:11px}}
@media(max-width:800px) and (min-width:651px){.mac-menubar .mac-menu-extra{display:none}.mac-control-center{display:none}.mac-screen{padding:6px}.mac-camera{top:6px;height:20px}.mac-menubar{height:24px;font-size:9px}.mac-toolbar{height:32px;gap:10px;padding-inline:10px}.mac-traffic{gap:6px}.mac-traffic i{width:9px;height:9px}.mac-toolbar-icon{width:15px}.mac-toolbar-icon svg{width:15px;height:15px}.notes-layout{height:calc(100% - 32px)}.notes-sidebar{font-size:9px;padding:10px 6px}.notes-preview b{font-size:9px}.notes-preview span,.notes-folder,.notes-sidebar small{font-size:8px}.notes-folder{padding:5px;gap:5px}.note-content{padding:10px 18px}.note-content h3{font-size:17px;margin:17px 0 12px}.note-content time{font-size:8px}.note-content p{font-size:9px;line-height:1.65}.demo-overlay{padding:13px;top:12%;min-height:40%}.demo-overlay-brand{font-size:9px;margin-bottom:9px}.demo-overlay-heading{font-size:15px;min-height:55px}.demo-face{font-size:6.6px!important;right:7px;top:10px}.demo-context{gap:4px;margin:7px 0 9px}.demo-context>span{font-size:7px;padding:2px 4px;line-height:12px}.demo-context svg{width:9px;height:9px}.demo-overlay-body{font-size:10px;line-height:1.5;min-height:4.5em}.demo-overlay-footer{font-size:7px;padding-top:8px}.demo-voice{bottom:61px;padding:8px 12px;width:80%;border-radius:10px}.demo-transcript{font-size:10px}.demo-voice-label{font-size:7px}.demo-voice-icon{width:24px;height:24px}.demo-voice-icon svg{width:14px;height:14px}.mac-dock{height:43px;bottom:10px;padding:4px 7px 8px;border-radius:12px}.mac-dock>span{width:30px;height:30px}.mac-dock .mac-osm-icon{width:27px;height:27px;font-size:8px;line-height:10px}.mac-dock>i{height:25px}.demo-scenarios{gap:1px}.demo-scenarios button{font-size:10px;padding:8px}.demo-playback{gap:3px}.demo-caption{font-size:10px}.demo-progress{font-size:10px}.terminal-content{font-size:8px}.terminal-error{max-width:83%;padding:7px}.terminal-error span{font-size:7px}.coding-agent h3{font-size:16px}.coding-agent article{padding:16px}.agent-request{font-size:8px;padding:10px}.agent-request pre{font-size:7px}.agent-request>span{font-size:7px}}
@media(max-width:650px){.macbook{padding:0 0 10px}.mac-screen{padding:5px;border-radius:14px 14px 8px 8px}.demo-desktop{height:600px;aspect-ratio:auto;container-type:normal;border-radius:9px 9px 2px 2px;background-position:center}.mac-camera{top:5px;width:19%;height:17px}.mac-camera i{width:3px;height:3px}.mac-base{height:9px;bottom:3px;border-radius:1px 1px 16px 16px}.mac-base i{height:3px}.mac-menubar{height:23px;font-size:8px;gap:10px;padding:0 11px}.mac-apple{font-size:15px}.mac-menu-extra,.mac-menubar>span:nth-child(5),.mac-control-center{display:none}.mac-menubar>span:last-child{font-size:0}.mac-menubar>span:last-child:after{content:'9:41 AM';font-size:8px}.mac-wifi{width:12px}.mac-battery{width:17px;height:9px}.mac-battery:after{left:17px;top:2px;width:1px;height:3px}.mac-app-window{left:3%;top:43px;width:94%;height:370px;border-radius:8px}.mac-toolbar{height:36px;padding:0 10px;gap:12px}.mac-toolbar-space{flex:1}.mac-toolbar-icon{width:14px}.mac-toolbar-icon svg{width:14px;height:14px}.mac-type-icon{font-size:14px}.mac-traffic{gap:5px;padding-right:0}.mac-traffic i{width:9px;height:9px}.notes-layout{height:calc(100% - 36px)}.notes-sidebar{display:none}.note-content{width:100%;padding:12px 20px}.note-content time{font-size:8px}.note-content h3{font-size:21px;margin:22px 0 15px}.note-content p{font-size:11px;line-height:1.65;max-width:92%;margin-bottom:16px}.note-target{min-height:0}.note-intro{font-size:10px!important}.note-closing{margin-top:17px!important}.demo-overlay{top:280px;right:3%;width:85%;padding:16px 17px;min-height:0;border-radius:9px;box-shadow:0 10px 25px #0003}.demo-overlay-brand{font-size:10px;margin-bottom:7px}.demo-overlay-heading{font-size:18px;min-height:62px;max-width:57%;padding-top:7px}.demo-face{font-size:7.7px!important;right:10px;top:10px;line-height:1.2!important}.demo-context{gap:4px;margin:8px 0 9px}.demo-context>span{font-size:8px;padding:2px 5px;line-height:13px}.demo-context svg{width:10px;height:10px}.demo-overlay-body{font-size:11px;line-height:1.5;min-height:0;margin-bottom:11px}.demo-overlay-footer{font-size:7px;padding-top:8px}.demo-voice{bottom:73px;width:94%;padding:10px 11px;gap:8px;border-radius:11px}.demo-voice-label{font-size:7px;letter-spacing:.8px}.demo-transcript{font-size:10px;line-height:1.4}.demo-voice-icon{width:23px;height:23px}.demo-voice-icon svg{width:14px;height:14px}.demo-wave{gap:1.5px;width:29px;height:23px}.demo-wave i{width:1.5px}.mac-dock{bottom:12px;height:47px;padding:4px 7px 9px;gap:6px;border-radius:12px}.mac-dock>span{width:34px;height:34px}.mac-dock .mac-osm-icon{width:29px;height:29px;border-radius:7px;font-size:8px;line-height:10px;margin-bottom:2px}.mac-dock>i{height:28px}.demo-pointer>svg{width:18px;height:25px}.demo-pointer>span{font-size:8px;line-height:18px;padding:0 5px;top:20px;left:-9px}.demo-pointer:before{width:28px;height:28px;left:-7px;top:-6px}.safari-toolbar{gap:8px}.safari-arrows{gap:7px}.safari-arrows svg{width:8px;height:14px}.safari-address{font-size:8px;height:23px;gap:4px;margin-left:0;max-width:none}.safari-address svg{width:9px;height:9px}.safari-toolbar .mac-toolbar-icon:last-of-type{display:none}.mac-toolbar-plus{font-size:17px}.safari-tabs{height:23px;font-size:7px}.safari-tabs>span{width:75%}.terminal-toolbar{height:30px}.mac-toolbar-title{font-size:8px}.terminal-content{height:calc(100% - 30px);padding:14px 15px;font-size:8px;line-height:1.6}.terminal-content p{margin-bottom:12px}.terminal-error{max-width:100%;padding:8px;font-size:8px;margin:16px 0}.terminal-error span{font-size:7px}.coding-agent{height:calc(100% - 36px)}.coding-agent aside{display:none}.coding-agent article{width:100%;padding:20px}.coding-agent article>small{font-size:7px}.coding-agent h3{font-size:21px;margin:9px 0 16px}.agent-request{max-width:95%;padding:13px;font-size:10px}.agent-request pre{font-size:8px}.agent-request>span{font-size:8px}.demo-controls{margin-top:13px;align-items:flex-start;gap:7px}.demo-scenarios{flex-direction:column;align-items:flex-start;gap:3px;flex:1}.demo-scenarios button{font-size:11px;padding:7px 9px;min-height:32px;gap:7px}.demo-scenarios button>span{font-size:9px}.demo-playback{gap:2px;margin-top:2px}.demo-playback button{font-size:10px;min-width:24px;padding:7px 3px}.demo-playback svg{width:14px;height:14px}.demo-caption{gap:14px;font-size:10px;margin-top:12px;padding:0 2px}.demo-caption>span:first-child{max-width:210px}.demo-progress{font-size:9px;white-space:normal;text-align:right;max-width:100px}}
@media(max-width:370px){.mac-toolbar{gap:9px}.demo-overlay{width:90%;padding:15px;top:285px}.demo-overlay-heading{font-size:17px}.demo-face{font-size:7px!important}.demo-voice{gap:6px}.demo-wave{display:none}.note-content{padding-inline:17px}.note-content p{font-size:10.5px}.demo-scenarios button{font-size:10px}.demo-pause-label{display:none}.demo-playback button{min-width:25px}}
@media(prefers-reduced-motion:reduce){.osm-demo *,.osm-demo *:before,.osm-demo *:after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

/* A cropped desktop, not a portrait laptop: keep the context, response, and
   speech in separate flow rows so none can obscure the selected target. */
@media(max-width:650px){
  .macbook{padding:0}
  .mac-screen{padding:0;border:0;background:none;border-radius:12px;box-shadow:none}
  .mac-camera,.mac-base{display:none}
  .demo-desktop{display:flex;flex-direction:column;align-items:stretch;gap:14px;height:auto;min-height:0;padding:43px 10px 80px;border:1px solid #c1c4c9;border-radius:12px;overflow:hidden}
  .mac-app-window{position:relative;left:auto;top:auto;width:100%;height:390px;flex-shrink:0;z-index:1}
  .demo-overlay{position:relative;top:auto;right:auto;width:88%;min-height:0;align-self:flex-end;margin:0;flex-shrink:0}
  .demo-voice{position:relative;left:auto;bottom:auto;transform:none;width:100%;max-width:none;margin:0;flex-shrink:0}
  .mac-dock{bottom:15px}
  
  
}
@media(max-width:370px){
  .demo-overlay{top:auto;right:auto;width:94%}
}


/* One recording follows the developer from the visual issue to the error. */
.demo-cursor-trail{position:absolute;inset:0;width:100%;height:100%;display:none;pointer-events:none;z-index:2;overflow:visible}
.demo-cursor-trail path{fill:none;stroke:#3985ed;stroke-width:3;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:100;stroke-dashoffset:0;vector-effect:non-scaling-stroke;opacity:.85}
[data-scenario='visual'] .demo-cursor-trail{display:block}
[data-scenario='visual'] .demo-pointer{transition:none}
[data-scenario='visual'] .demo-pointer:before{display:none}
@media(max-width:650px){[data-scenario='visual'] .demo-pointer>span{position:absolute;left:auto;right:12px;top:20px}}
[data-recording='true'] .demo-context>span:last-child{color:#a04d49;border-color:#e8ccca;background:#fff8f7}
[data-recording='true'] .demo-context>span:last-child:before{content:'';width:4px;height:4px;background:#d9635b;border-radius:50%}
.relay-dashboard{height:calc(100% - 72px);background:#f9fafc;overflow:hidden}
.relay-nav{height:45px;display:flex;align-items:center;gap:13px;padding:0 21px;border-bottom:1px solid #e4e7ee;background:#fff;color:#7d8492;font-size:9px}
.relay-nav>b{font-size:18px;letter-spacing:-.5px;color:#292a36}.relay-nav .local-badge{padding:3px 5px;border:1px solid #d5e5dc;background:#f1faf5;color:#488168;border-radius:4px;font-size:7px;letter-spacing:.4px}
.relay-layout{display:flex;height:calc(100% - 45px)}
.relay-sidebar{width:20%;flex-shrink:0;padding:18px 10px;background:#fff;border-right:1px solid #e5e7ee;color:#858c99;font-size:10px}
.relay-sidebar>span{display:block;padding:9px;border-radius:6px;margin-bottom:3px}.relay-sidebar .selected{background:#eeecfb;color:#6e61aa;font-weight:600}.relay-sidebar small{display:block;font:8px ui-monospace,monospace;margin:42px 9px 0;color:#a0a4b0}
.relay-main{width:80%;padding:16px 20px}
.relay-heading{display:flex;align-items:center;justify-content:space-between;width:78%;margin-bottom:13px}.relay-heading small{font-size:7px;letter-spacing:.9px;color:#979ca9}.relay-heading h3{font-size:22px;line-height:1.2;letter-spacing:-.5px;margin:6px 0 0}.relay-avatar{display:grid;place-items:center;width:26px;height:26px;border-radius:50%;background:#eee9ff;color:#8272ba;font-size:11px}
.relay-metrics{display:flex;gap:11px;width:78%;margin-bottom:15px}.relay-metrics>div{flex:1;background:#fff;border:1px solid #e6e8ef;border-radius:7px;padding:10px 12px}.relay-metrics small{display:block;font-size:8px;color:#8d93a1;margin-bottom:5px}.relay-metrics strong{font-size:18px;font-weight:600;line-height:1}
.chart-scene{position:relative;width:78%;height:167px}.broken-chart{position:absolute;left:0;top:0;width:77%;height:164px;background:#fff;border:1px solid #dadde7;border-radius:8px;box-shadow:0 2px 3px #00000003;padding:13px 15px;overflow:visible}.broken-chart>b{display:block;font-size:10px;color:#5e6475;font-weight:600}.chart-period{display:block;font-size:7px;color:#a4a9b4;margin-top:5px}.chart-grid{position:absolute;inset:56px 14px 26px;background:repeating-linear-gradient(to top,#e9eaf1 0 1px,transparent 1px 27px)}.chart-bars{position:absolute;left:17px;right:-70px;bottom:26px;display:flex;gap:11px;align-items:flex-end;height:96px}.chart-bars>i{flex:1;height:var(--height);background:linear-gradient(#b3a4e5,#8c76cd);border-radius:4px 4px 0 0;box-shadow:inset 0 1px #ffffff45}.chart-axis{position:absolute;bottom:10px;left:15px;color:#aeb2bc;font-size:6px;word-spacing:8px;white-space:nowrap}.visual-bug-target{position:absolute;right:0;top:47px;width:45%;height:105px}.relay-error-hint{display:flex;align-items:center;gap:5px;font-size:8px;color:#a48681!important;margin:10px 0 0!important}.relay-error-hint>span{width:4px;height:4px;background:#c59084;border-radius:50%}
.retained-context{display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;margin:15px 0 12px;max-width:80%;padding:8px 10px;border:1px solid #50637c;border-radius:5px;background:#26313f;font:9px/1.5 -apple-system,BlinkMacSystemFont,sans-serif;color:#b7c9e1}.retained-context>span{color:#9ebcdb}.retained-context>b{font-weight:400;color:#8299b9;font-size:8px}
[data-scenario='terminal'] .terminal-error{max-width:80%;margin:15px 0;font-size:11px;line-height:1.6}
[data-scenario='handoff'] .coding-agent article{padding-top:19px}[data-scenario='handoff'] .coding-agent h3{margin:8px 0 14px;font-size:21px}
.agent-visual-context{display:flex;gap:10px;align-items:center;padding-bottom:12px;border-bottom:1px solid #e0e3e7}.agent-visual-context b,.agent-error-context b{font-size:10px;font-weight:600;color:#505a68}.agent-visual-context p{font-size:10px;line-height:1.5;margin:4px 0 0!important}.mini-chart{position:relative;flex-shrink:0;width:73px;height:51px;background:#fff;border:1px solid #d5d9e3;border-radius:4px;display:flex;align-items:flex-end;gap:4px;padding:11px 0 8px 7px;margin-right:7px}.mini-chart i{height:70%;min-width:12px;background:#b5a6e3;border-radius:2px 2px 0 0}.mini-chart i:nth-child(2n){height:100%}.mini-chart svg{position:absolute;inset:0;width:90px;height:51px;overflow:visible;fill:none;stroke:#3985ed;stroke-width:1.7}.agent-error-context{margin-top:12px}.agent-error-context pre{font-size:9px;line-height:1.6;margin:7px 0 10px}.agent-task{font-size:10px;line-height:1.5;padding-top:9px;border-top:1px solid #e0e3e7;margin-bottom:0!important}
@media(max-width:1000px){.relay-dashboard{height:calc(100% - 63px)}.relay-nav{height:37px;padding:0 16px;font-size:8px;gap:9px}.relay-nav>b{font-size:16px}.relay-layout{height:calc(100% - 37px)}.relay-sidebar{padding:12px 7px;font-size:8px}.relay-sidebar>span{padding:7px}.relay-main{padding:12px 16px}.relay-heading{margin-bottom:10px}.relay-heading small{font-size:6px}.relay-heading h3{font-size:18px;margin-top:4px}.relay-avatar{width:23px;height:23px;font-size:9px}.relay-metrics{gap:8px;margin-bottom:12px}.relay-metrics>div{padding:7px 9px}.relay-metrics small{font-size:7px;margin-bottom:4px}.relay-metrics strong{font-size:15px}.chart-scene{height:135px}.broken-chart{height:132px;padding:10px 11px}.broken-chart>b{font-size:9px}.chart-period{font-size:6px}.chart-grid{inset:44px 11px 21px}.chart-bars{left:13px;right:-53px;bottom:22px;height:73px;gap:8px}.chart-axis{bottom:8px;left:11px;font-size:5px;word-spacing:5px}.visual-bug-target{top:36px;height:85px}.relay-error-hint{font-size:7px;margin-top:8px!important}.retained-context{font-size:8px;padding:6px 8px;margin:11px 0}.retained-context>b{font-size:7px}[data-scenario='terminal'] .terminal-error{font-size:9px;margin:12px 0}[data-scenario='handoff'] .coding-agent h3{font-size:18px;margin-bottom:11px}.agent-visual-context{gap:8px;padding-bottom:9px}.agent-visual-context b,.agent-error-context b{font-size:8px}.agent-visual-context p,.agent-task{font-size:8px}.mini-chart{width:57px;height:40px;padding:8px 0 6px 5px;gap:3px}.mini-chart i{min-width:9px}.mini-chart svg{width:70px;height:40px}.agent-error-context{margin-top:9px}.agent-error-context pre{font-size:8px;margin:5px 0 8px}}
@media(max-width:800px) and (min-width:651px){.relay-dashboard{height:calc(100% - 57px)}.relay-nav{height:30px;font-size:7px;padding:0 12px}.relay-nav>b{font-size:14px}.relay-nav .local-badge{font-size:5px;padding:2px 4px}.relay-layout{height:calc(100% - 30px)}.relay-sidebar{padding:9px 5px;font-size:7px}.relay-sidebar>span{padding:6px}.relay-sidebar small{font-size:6px;margin:25px 6px 0}.relay-main{padding:10px 12px}.relay-heading{margin-bottom:7px}.relay-heading small{font-size:5px}.relay-heading h3{font-size:16px;margin-top:3px}.relay-avatar{width:19px;height:19px;font-size:8px}.relay-metrics{gap:6px;margin-bottom:9px}.relay-metrics>div{padding:6px 7px}.relay-metrics small{font-size:6px;margin-bottom:3px}.relay-metrics strong{font-size:13px}.chart-scene{height:107px}.broken-chart{height:105px;padding:8px 9px}.broken-chart>b{font-size:7px}.chart-period{font-size:5px;margin-top:3px}.chart-grid{inset:35px 9px 18px}.chart-bars{left:10px;right:-42px;bottom:18px;height:58px;gap:6px}.chart-axis{bottom:6px;left:9px;font-size:4px;word-spacing:3px}.visual-bug-target{top:27px;height:71px}.relay-error-hint{font-size:6px;margin-top:5px!important}.retained-context{font-size:7px;padding:5px 6px;margin:9px 0}.retained-context>b{font-size:6px}[data-scenario='terminal'] .terminal-error{font-size:8px;margin:10px 0}[data-scenario='handoff'] .coding-agent article{padding-top:13px}[data-scenario='handoff'] .coding-agent h3{font-size:15px;margin-bottom:8px}.agent-request{padding:9px}.agent-visual-context{gap:5px;padding-bottom:7px}.agent-visual-context b,.agent-error-context b{font-size:7px}.agent-visual-context p,.agent-task{font-size:7px}.mini-chart{width:45px;height:32px;padding:7px 0 5px 4px;gap:2px;margin-right:5px}.mini-chart i{min-width:7px}.mini-chart svg{width:56px;height:32px}.agent-error-context{margin-top:7px}.agent-error-context pre{font-size:6px;line-height:1.5;margin:4px 0 7px}.agent-task{padding-top:6px}.agent-request>span{font-size:6px;margin-top:8px}}
@media(max-width:650px){.relay-dashboard{height:calc(100% - 59px)}.relay-nav{height:36px;padding:0 14px;font-size:7px;gap:10px}.relay-nav>b{font-size:17px}.relay-nav .local-badge{font-size:6px}.relay-layout{height:calc(100% - 36px)}.relay-sidebar{display:none}.relay-main{width:100%;padding:13px 17px}.relay-heading,.relay-metrics,.chart-scene{width:95%}.relay-heading{margin-bottom:10px}.relay-heading small{font-size:6px}.relay-heading h3{font-size:19px;margin-top:4px}.relay-avatar{width:23px;height:23px;font-size:9px}.relay-metrics{gap:9px;margin-bottom:12px}.relay-metrics>div{padding:8px 10px}.relay-metrics small{font-size:7px;margin-bottom:4px}.relay-metrics strong{font-size:15px}.chart-scene{height:135px}.broken-chart{width:76%;height:132px;padding:10px 11px}.broken-chart>b{font-size:9px}.chart-period{font-size:6px}.chart-grid{inset:44px 11px 21px}.chart-bars{left:13px;right:-54px;bottom:22px;height:75px;gap:8px}.chart-axis{bottom:8px;left:11px;font-size:5px;word-spacing:5px}.visual-bug-target{top:35px;height:87px}.relay-error-hint{font-size:7px;margin-top:8px!important}.retained-context{max-width:100%;font-size:8px;margin:13px 0;padding:7px 8px}.retained-context>b{font-size:7px}[data-scenario='terminal'] .terminal-error{max-width:100%;font-size:8px;margin:16px 0}[data-scenario='handoff'] .coding-agent article{padding:19px}[data-scenario='handoff'] .coding-agent h3{font-size:19px;margin:9px 0 14px}.agent-request{max-width:100%;padding:13px}.agent-visual-context{gap:10px;padding-bottom:11px}.agent-visual-context b,.agent-error-context b{font-size:9px}.agent-visual-context p,.agent-task{font-size:9px}.mini-chart{width:64px;height:45px;padding:9px 0 7px 6px;gap:3px;margin-right:7px}.mini-chart i{min-width:11px}.mini-chart svg{width:80px;height:45px}.agent-error-context{margin-top:11px}.agent-error-context pre{font-size:8px;line-height:1.6;margin:6px 0 9px}.agent-task{padding-top:9px}.demo-cursor-trail path{stroke-width:2.3}.demo-voice-label{font-size:6px;letter-spacing:.6px}}