/**
 * ORA Code — full-width interactive product tour.
 * Product canvas remains dark in every marketing-site theme.
 */
.oc-page{
  --oc-app:#101217;--oc-bar:#1d2130;--oc-side:#181a20;--oc-main:#15171d;--oc-inspect:#13161c;
  --oc-surface:#1d2028;--oc-hover:#252832;--oc-line:#2c303a;--oc-text:#f4f2ee;--oc-dim:#b4ada2;
  --oc-muted:#888177;--oc-violet:#6858f5;--oc-cyan:#22cddd;--oc-teal:#16d7b1;--oc-green:#22c96b;
  --oc-red:#f0627a;--oc-amber:#efb94a;--oc-ui:Inter,Aptos,"Segoe UI",system-ui,sans-serif;
  --oc-display:"Segoe UI Variable Display",Aptos,"Segoe UI",system-ui,sans-serif;
  --oc-mono:"Cascadia Code","SFMono-Regular",Consolas,monospace
}
.oc-page main{position:relative;z-index:2}
.oc-sr-only{position:absolute!important;width:1px!important;height:1px!important;padding:0!important;margin:-1px!important;overflow:hidden!important;clip:rect(0,0,0,0)!important;white-space:nowrap!important;border:0!important}
.oc-demo button,.oc-watch-btn{font:inherit}
.oc-demo button:focus-visible,.oc-watch-btn:focus-visible{outline:2px solid #9a8cff;outline-offset:2px}

/* Product-led hero */
.oc-hero{padding:calc(var(--nav-h) + clamp(38px,5vw,58px)) 0 clamp(58px,8vw,94px);overflow:hidden;text-align:center}
.oc-hero-inner{width:min(1460px,calc(100% - 32px));margin-inline:auto}
.oc-hero-copy{max-width:960px;margin-inline:auto}
.oc-hero-brand{display:inline-flex;align-items:center;gap:9px;margin:0 0 22px;color:var(--accent-2);font:750 .82rem/1 var(--oc-ui);letter-spacing:.14em;text-transform:uppercase}
.oc-hero-brand span{width:8px;height:8px;border-radius:50%;background:var(--oc-teal);box-shadow:0 0 18px rgba(22,215,177,.85)}
.oc-hero h1{max-width:18ch;margin:0 auto 18px;color:var(--fg);font-family:var(--oc-display);font-size:clamp(2.7rem,5.45vw,4.8rem);font-weight:680;letter-spacing:-.057em;line-height:.98;text-transform:none;text-wrap:balance}
.oc-hero .lede{max-width:63ch;margin:0 auto 30px;color:var(--fg-dim);font-size:clamp(1rem,1.55vw,1.2rem);line-height:1.7;text-wrap:balance}
.oc-hero-ctas{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:12px}
.oc-hero-ctas .cta{min-height:48px;padding:13px 23px;border-radius:999px;font-weight:700}
.oc-watch-btn{min-height:48px;padding:12px 18px;border:1px solid color-mix(in srgb,var(--fg) 15%,transparent);border-radius:999px;color:var(--fg-dim);background:color-mix(in srgb,var(--fg) 4%,transparent);cursor:pointer;font-weight:650;transition:.18s ease}
.oc-watch-btn:hover{color:var(--fg);border-color:color-mix(in srgb,var(--fg) 27%,transparent);background:color-mix(in srgb,var(--fg) 7%,transparent);transform:translateY(-1px)}
.oc-hero-proof{display:flex;flex-wrap:wrap;justify-content:center;gap:9px 20px;margin-top:18px;color:var(--fg-mute);font-size:.8rem}
.oc-hero-proof span{display:inline-flex;align-items:center;gap:7px}
.oc-hero-proof span:before{content:"✓";display:grid;place-items:center;width:16px;height:16px;border:1px solid rgba(22,215,177,.35);border-radius:50%;color:var(--oc-teal);font-size:.63rem;font-weight:900}
.oc-hero-stage{position:relative;margin-top:clamp(32px,4vw,44px);text-align:left}
.oc-hero-stage:before{content:"";position:absolute;z-index:-1;inset:-18% -5% -12%;background:radial-gradient(ellipse 48% 42% at 18% 15%,rgba(104,88,245,.27),transparent 65%),radial-gradient(ellipse 42% 42% at 85% 80%,rgba(34,205,221,.16),transparent 62%);filter:blur(20px);pointer-events:none}
.oc-tour-label{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:0 8px 10px;color:var(--fg-mute);font:600 .74rem/1.4 var(--oc-ui)}
.oc-tour-label>span:first-child{display:inline-flex;align-items:center;gap:8px;color:var(--fg-dim)}
.oc-tour-label i,.oc-network i,.oc-demo-footer [data-oc-live-status] i{display:inline-block;width:7px;height:7px;border-radius:50%;background:var(--oc-green);box-shadow:0 0 11px rgba(34,201,107,.82)}

/* Desktop application shell */
.oc-demo{position:relative;min-width:0;overflow:hidden;border:1px solid rgba(142,132,255,.36);border-radius:19px;color:var(--oc-text);background:var(--oc-app);box-shadow:0 1px 0 rgba(255,255,255,.08) inset,0 45px 120px rgba(0,0,0,.52),0 0 0 1px rgba(0,0,0,.3);font:12px/1.35 var(--oc-ui);isolation:isolate}
.oc-demo:after{content:"";position:absolute;z-index:20;inset:0;border-radius:inherit;box-shadow:0 0 52px rgba(104,88,245,.09) inset;pointer-events:none}
.oc-demo--hero{min-height:0;transform:none}
.oc-appbar{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;min-height:37px;padding:0 10px;border-bottom:1px solid var(--oc-line);color:var(--oc-dim);background:linear-gradient(180deg,rgba(90,97,125,.12),transparent),var(--oc-bar);user-select:none}
.oc-app-brand,.oc-app-switch,.oc-app-actions,.oc-network{display:flex;align-items:center}
.oc-app-brand{gap:7px}.oc-app-brand strong{color:#9d82ff;font-size:12px;letter-spacing:.08em}.oc-app-switch{gap:4px}
.oc-app-switch span{padding:5px 11px;border-radius:999px;color:var(--oc-muted);font-size:11px}
.oc-app-switch .is-active{border:1px solid #5b5d66;color:#f4eadb;background:rgba(255,255,255,.07);font-weight:700}
.oc-app-actions{justify-content:flex-end;gap:8px}.oc-network{gap:6px;color:var(--oc-teal);font-size:10px}
.oc-plan-pill{padding:4px 9px;border:1px solid rgba(139,124,255,.5);border-radius:999px;color:#ddd6ff;background:rgba(104,88,245,.13);font-weight:700}
.oc-icon-button,.oc-rail-title button,.oc-profile button,.oc-preview-tabbar button,.oc-browser-bar button,.oc-modal-head button{appearance:none;border:0;color:inherit;background:transparent;cursor:pointer}
.oc-icon-button{min-width:28px;min-height:28px;border-radius:8px}.oc-icon-button:hover{background:var(--oc-hover)}
.oc-window-controls{color:#8c8f98;font-family:var(--oc-mono);letter-spacing:.45em;white-space:nowrap}
.oc-mobile-switcher{display:none}
.oc-demo-grid{display:grid;grid-template-columns:minmax(225px,20.8fr) minmax(450px,44.8fr) minmax(370px,34.4fr);height:clamp(570px,46vw,650px);min-height:0}
.oc-demo-rail,.oc-demo-center,.oc-demo-right{min-width:0;min-height:0;border-right:1px solid var(--oc-line)}
.oc-demo-rail{display:flex;flex-direction:column;overflow:hidden;background:var(--oc-side)}
.oc-demo-center,.oc-demo-right{display:flex;flex-direction:column}.oc-demo-center{background:var(--oc-main)}.oc-demo-right{border-right:0;background:var(--oc-inspect)}

/* Agents rail */
.oc-rail-title,.oc-rail-section-head{display:flex;align-items:center;justify-content:space-between;color:var(--oc-muted);font-size:10px;letter-spacing:.08em}
.oc-rail-title{min-height:42px;padding:0 9px}.oc-rail-title button{width:26px;height:26px;color:var(--oc-muted);font-size:18px}
.oc-agent-nav{display:grid;gap:2px;padding:0 8px 12px;border-bottom:1px solid rgba(255,255,255,.07)}
.oc-agent-nav button{appearance:none;display:flex;align-items:center;gap:10px;width:100%;min-height:35px;padding:6px 9px;border:0;border-radius:7px;color:var(--oc-dim);background:transparent;text-align:left;cursor:pointer}
.oc-agent-nav button:hover{color:var(--oc-text);background:var(--oc-hover)}.oc-agent-nav .is-primary{color:var(--oc-text);background:#23262e}
.oc-agent-nav button>span{width:18px;color:#9c8aff;font-size:15px;text-align:center}.oc-agent-nav b{font-weight:600}
.oc-rail-section{padding:14px 8px 8px}.oc-rail-section-head{padding:0 4px 8px;font-size:9px}
.oc-rail-section-head button{appearance:none;border:0;color:var(--oc-muted);background:none;cursor:pointer;font-size:10px}
.oc-repo-name{display:flex;align-items:center;gap:6px;padding:4px 6px 7px;color:var(--oc-dim)}.oc-repo-name strong{color:var(--oc-text);font-size:11px}
.oc-repo-branch{margin-left:auto;color:var(--oc-muted);font:9px var(--oc-mono)}
.oc-task{appearance:none;display:grid;grid-template-columns:8px minmax(0,1fr);align-items:start;gap:8px;width:100%;min-height:48px;padding:7px;border:1px solid transparent;border-radius:8px;color:var(--oc-dim);background:transparent;text-align:left;cursor:pointer;transition:.15s ease}
.oc-task:hover{background:var(--oc-hover)}.oc-task.is-active{border-color:rgba(104,88,245,.46);color:var(--oc-text);background:rgba(104,88,245,.14);box-shadow:2px 0 0 var(--oc-violet) inset}
.oc-task>span{min-width:0}.oc-task strong,.oc-task small{display:block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.oc-task strong{font-size:10.5px;font-weight:600}.oc-task small{margin-top:3px;color:var(--oc-muted);font-size:9px}
.oc-task-dot{width:6px;height:6px;margin-top:5px;border-radius:50%}.oc-task-dot.is-review{background:var(--oc-amber);box-shadow:0 0 7px rgba(239,185,74,.45)}.oc-task-dot.is-pass,.oc-task-dot.is-done{background:var(--oc-green)}
.oc-background{min-height:106px;margin-top:auto;padding:10px 8px;border-top:1px solid rgba(255,255,255,.07)}
.oc-background-task{display:flex;gap:8px;padding:8px 7px;border-radius:7px;background:rgba(255,255,255,.025)}
.oc-background-task strong,.oc-background-task small,.oc-profile strong,.oc-profile small{display:block}.oc-background-task strong{color:var(--oc-dim);font-size:10px}.oc-background-task small{margin-top:3px;color:var(--oc-muted);font-size:9px}
.oc-spinner{width:11px;height:11px;margin-top:2px;border:2px solid rgba(104,88,245,.24);border-top-color:#9b8cff;border-radius:50%}
.oc-demo[data-oc-state=running] .oc-spinner{animation:oc-spin .75s linear infinite}@keyframes oc-spin{to{transform:rotate(360deg)}}
.oc-profile{display:grid;grid-template-columns:28px minmax(0,1fr) 28px;align-items:center;gap:8px;min-height:53px;padding:7px 9px;border-top:1px solid var(--oc-line);background:#15171d}
.oc-avatar{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;color:#fff;background:linear-gradient(145deg,#755af7,#23cbdc);font-weight:700}
.oc-profile strong{color:var(--oc-text);font-size:10px}.oc-profile small{margin-top:2px;color:var(--oc-muted);font-size:9px}.oc-profile button{width:28px;height:28px;color:var(--oc-muted)}

/* Build Studio */
.oc-studio-toolbar{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:43px;padding:0 10px;border-bottom:1px solid var(--oc-line);color:var(--oc-muted);background:#181a20}
.oc-studio-toolbar>div{display:flex;align-items:center;gap:9px;min-width:0}.oc-studio-toolbar strong{color:#f0dfc7;font-size:11px}
.oc-back,.oc-mini-btn{appearance:none;min-width:28px;min-height:28px;border:1px solid transparent;border-radius:6px;color:var(--oc-muted);background:transparent;cursor:pointer}
.oc-back{padding:0;font-size:18px}.oc-mini-btn{padding:4px 7px;border-color:var(--oc-line);font-size:9px}.oc-back:hover,.oc-mini-btn:hover{color:var(--oc-text);background:var(--oc-hover)}
.oc-disk{padding:3px 6px;border-radius:999px;color:var(--oc-teal);background:rgba(22,215,177,.11);font-size:8px;font-weight:700}
.oc-model{max-width:142px;overflow:hidden;color:var(--oc-dim);font:9px var(--oc-mono);text-overflow:ellipsis;white-space:nowrap}
.oc-review-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:61px;margin:8px 10px 0;padding:9px 10px;border:1px solid var(--oc-line);border-radius:9px;background:linear-gradient(90deg,rgba(104,88,245,.07),rgba(255,255,255,.018))}
.oc-review-strip>div{display:flex;align-items:center;gap:9px;min-width:0}.oc-review-strip strong,.oc-review-strip small{display:block}.oc-review-strip strong{color:var(--oc-text);font-size:10px}
.oc-review-strip small{max-width:240px;margin-top:3px;overflow:hidden;color:var(--oc-muted);font-size:8.5px;text-overflow:ellipsis;white-space:nowrap}
.oc-review-icon{display:grid;place-items:center;width:24px;height:24px;border-radius:7px;color:#aa9dff;background:rgba(104,88,245,.13)}
.oc-review-strip>button,.oc-panel-heading button{appearance:none;flex:0 0 auto;min-height:31px;padding:7px 11px;border:0;border-radius:7px;color:#fff;background:linear-gradient(135deg,#795ff8,#5e54e8);cursor:pointer;font-size:9px;font-weight:700}
.oc-chat{flex:1;min-height:0;overflow:auto;padding:14px 12px;scrollbar-width:thin;scrollbar-color:#343843 transparent}
.oc-chat-user{display:flex;align-items:flex-start;gap:8px;margin:0 0 11px auto;max-width:91%}.oc-avatar--small{flex:0 0 auto;width:22px;height:22px;font-size:8px}
.oc-chat-user p{margin:0;padding:9px 11px;border:1px solid rgba(104,88,245,.27);border-radius:10px 10px 3px 10px;color:var(--oc-text);background:rgba(104,88,245,.1);font-size:10px;line-height:1.45}
.oc-agent-card{padding:12px;border:1px solid rgba(255,255,255,.075);border-radius:11px;background:rgba(255,255,255,.018)}
.oc-agent-card-head{display:flex;align-items:center;gap:7px}.oc-agent-orb{width:15px;height:15px;border:2px solid #8b6fff;border-radius:50%;box-shadow:0 0 9px rgba(104,88,245,.65) inset,0 0 8px rgba(34,205,221,.3)}
.oc-agent-card-head strong{color:var(--oc-text);font-size:10px}.oc-agent-card-head>span:last-child{margin-left:auto;padding:3px 7px;border:1px solid rgba(34,201,107,.25);border-radius:999px;color:#70e29e;background:rgba(34,201,107,.08);font-size:8px}
.oc-agent-card>p{margin:9px 0 10px 22px;color:var(--oc-dim);font-size:10px;line-height:1.5}
.oc-activity{display:grid;gap:5px;margin:0 0 10px 22px;padding:0;list-style:none}
.oc-activity li{display:grid;grid-template-columns:15px minmax(0,1fr) auto;align-items:center;min-height:24px;color:var(--oc-muted);opacity:.42;transition:.22s ease}
.oc-activity li>span:first-child{display:grid;place-items:center;width:13px;height:13px;border:1px solid #4a4e57;border-radius:50%;font-size:7px}
.oc-activity li.is-done,.oc-activity li.is-current{color:var(--oc-dim);opacity:1}.oc-activity li.is-done>span:first-child{border-color:rgba(34,201,107,.45);color:var(--oc-green);background:rgba(34,201,107,.08)}
.oc-activity li.is-current:not(.is-done)>span:first-child{color:transparent;border-color:rgba(104,88,245,.3);border-top-color:#b7aaff;animation:oc-spin .8s linear infinite}.oc-activity small{color:var(--oc-muted);font:8px var(--oc-mono)}
.oc-file-chips{display:flex;flex-wrap:wrap;gap:5px;margin:0 0 10px 22px}.oc-file-chips button{appearance:none;padding:5px 7px;border:1px solid var(--oc-line);border-radius:6px;color:var(--oc-dim);background:#181b21;cursor:pointer;font:8.5px var(--oc-mono)}
.oc-file-chips button:hover{border-color:rgba(104,88,245,.56);color:var(--oc-text)}.oc-file-chips em{margin-left:4px;color:var(--oc-green);font-style:normal}
.oc-agent-result{display:flex;align-items:center;gap:8px;margin-left:22px;padding:8px 9px;border:1px solid rgba(34,201,107,.22);border-radius:8px;background:rgba(34,201,107,.055)}
.oc-agent-result>span:first-child{display:grid;place-items:center;width:19px;height:19px;border-radius:50%;color:#0f2017;background:var(--oc-green);font-size:10px;font-weight:900}
.oc-agent-result strong,.oc-agent-result small{display:block}.oc-agent-result strong{color:#a9edc3;font-size:9px}.oc-agent-result small{margin-top:2px;color:var(--oc-muted);font-size:8px}
.oc-composer{display:block;flex:0 0 auto;padding:0 10px 8px;border:0;background:transparent}
.oc-composer-box{padding:9px 9px 7px;border:1px solid #383d49;border-radius:11px;background:#181a20;box-shadow:0 10px 30px rgba(0,0,0,.25)}
.oc-composer input{width:100%;min-height:29px;padding:0 3px 7px;border:0;outline:0;color:var(--oc-text);background:transparent;font-size:10px}.oc-composer input::placeholder{color:var(--oc-muted)}
.oc-composer-tools,.oc-composer-tools>div,.oc-statusbar{display:flex;align-items:center}.oc-composer-tools{justify-content:space-between;gap:8px}.oc-composer-tools>div{gap:3px}
.oc-composer-tools button{appearance:none;min-width:25px;min-height:25px;padding:3px 6px;border:1px solid transparent;border-radius:6px;color:var(--oc-muted);background:transparent;cursor:pointer;font-size:9px}
.oc-composer-tools button:hover{color:var(--oc-text);background:var(--oc-hover)}.oc-composer-tools .oc-plan-toggle,.oc-composer-tools .oc-model-toggle{border-color:var(--oc-line);color:var(--oc-dim)}
.oc-composer-tools .oc-send{width:27px;height:27px;padding:0;border:0;border-radius:50%;color:#fff;background:linear-gradient(145deg,#8067fa,#4c68ed);font-size:15px}
.oc-statusbar{gap:10px;min-height:25px;padding:4px 2px 0;color:var(--oc-muted);font-size:8px}.oc-statusbar button{appearance:none;padding:3px 7px;border:1px solid var(--oc-line);border-radius:5px;color:var(--oc-dim);background:transparent;cursor:pointer;font-size:8px}
.oc-progress{position:relative;width:43px;height:4px;margin-left:auto;overflow:hidden;border-radius:99px;background:#30343d}.oc-progress i{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:linear-gradient(90deg,var(--oc-violet),var(--oc-cyan));transition:width .4s ease}.oc-statusbar>strong{color:var(--oc-muted);font:8px var(--oc-mono)}

/* Inspector tabs and panels */
.oc-tabs{display:flex;align-items:stretch;gap:0;min-height:43px;padding:0 7px;overflow-x:auto;border-bottom:1px solid var(--oc-line);background:#181a20;scrollbar-width:none}.oc-tabs::-webkit-scrollbar{display:none}
.oc-tab{appearance:none;position:relative;flex:0 0 auto;min-height:42px;padding:0 9px;border:0;color:var(--oc-muted);background:transparent;cursor:pointer;font-size:9px;white-space:nowrap}
.oc-tab:after{content:"";position:absolute;right:8px;bottom:0;left:8px;height:2px;background:transparent}.oc-tab:hover{color:var(--oc-dim)}.oc-tab.is-active{color:var(--oc-text)}.oc-tab.is-active:after{background:linear-gradient(90deg,var(--oc-violet),var(--oc-cyan))}
.oc-tab span{display:inline-grid;place-items:center;min-width:15px;height:15px;margin-left:3px;border-radius:99px;color:#d8d3ff;background:rgba(104,88,245,.19);font-size:7px}
.oc-panel-view{flex:1;min-height:0;overflow:hidden;background:var(--oc-inspect)}.oc-panel-view[hidden]{display:none!important}.oc-panel-view.is-active{display:flex;flex-direction:column}
.oc-preview-tabbar{display:flex;align-items:center;gap:8px;min-height:31px;padding:0 8px;border-bottom:1px solid var(--oc-line);color:var(--oc-dim);background:#14171d;font-size:9px}
.oc-preview-tabbar span{align-self:stretch;display:flex;align-items:center;padding:0 9px;border-right:1px solid var(--oc-line);border-left:1px solid var(--oc-line);background:#1a1d24}.oc-preview-tabbar button{width:24px;height:24px;color:var(--oc-muted)}
.oc-browser-bar{display:grid;grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:7px;min-height:38px;padding:4px 7px;border-bottom:1px solid var(--oc-line)}
.oc-browser-nav{color:var(--oc-muted);font-size:13px;white-space:nowrap}.oc-browser-url{min-width:0;overflow:hidden;padding:6px 8px;border:1px solid var(--oc-line);border-radius:5px;color:var(--oc-dim);background:#1c1f26;font:8px var(--oc-mono);text-overflow:ellipsis;white-space:nowrap}
.oc-browser-bar button{min-width:32px;height:25px;border:1px solid var(--oc-line);border-radius:5px;color:var(--oc-dim);font-size:8px}
.oc-browser-tools{display:flex;gap:5px;min-height:38px;padding:5px 7px;overflow-x:auto;border-bottom:1px solid var(--oc-line);scrollbar-width:none}.oc-browser-tools::-webkit-scrollbar{display:none}
.oc-browser-tools button{appearance:none;flex:0 0 auto;min-height:27px;padding:4px 7px;border:1px solid var(--oc-line);border-radius:5px;color:var(--oc-muted);background:#171a20;cursor:pointer;font-size:8px}
.oc-browser-tools button:hover,.oc-browser-tools button.is-active{border-color:rgba(104,88,245,.52);color:var(--oc-text);background:rgba(104,88,245,.11)}
.oc-browser-frame{position:relative;flex:1;min-height:0;margin:9px;overflow:hidden;border:1px solid #303641;border-radius:8px;background:#0b0f19;transition:.18s ease}.oc-browser-frame.is-refreshing{opacity:.62;transform:scale(.995)}
.oc-preview-site{display:grid;place-items:center;width:100%;height:100%;min-height:310px;padding:clamp(18px,3vw,34px);background:radial-gradient(circle at 18% 10%,rgba(84,126,223,.3),transparent 45%),linear-gradient(135deg,#1a346a,#275394 52%,#213867)}
.oc-preview-site[data-oc-preview=checkout]{background:radial-gradient(circle at 80% 10%,rgba(226,156,83,.26),transparent 40%),linear-gradient(140deg,#2a1c32,#563851 58%,#302540)}
.oc-preview-site[data-oc-preview=dashboard]{background:radial-gradient(circle at 10% 10%,rgba(21,211,174,.22),transparent 38%),linear-gradient(145deg,#102b31,#123f48 55%,#10272f)}
.oc-calc-card{width:min(100%,320px);padding:clamp(20px,3vw,30px);border:1px solid rgba(255,255,255,.2);border-radius:18px;color:#fff;background:rgba(255,255,255,.12);box-shadow:0 22px 60px rgba(0,0,0,.28);backdrop-filter:blur(12px)}
.oc-preview-badge{display:inline-flex;align-items:center;gap:5px;margin-bottom:13px;padding:4px 7px;border:1px solid rgba(255,255,255,.2);border-radius:99px;color:rgba(255,255,255,.78);background:rgba(0,0,0,.13);font-size:7px;font-weight:800;letter-spacing:.1em}
.oc-preview-badge:before{content:"";width:5px;height:5px;border-radius:50%;background:#47e696;box-shadow:0 0 8px rgba(71,230,150,.8)}
.oc-calc-card h3{margin:0;color:#fff;font-size:clamp(18px,2.2vw,25px);letter-spacing:-.035em}.oc-calc-card>p{margin:6px 0 16px;color:rgba(255,255,255,.68);font-size:9px}.oc-calc-card form{display:grid;gap:9px}
.oc-calc-card label{display:grid;gap:4px;color:rgba(255,255,255,.74);font-size:8px;font-weight:650}.oc-calc-card input{width:100%;min-height:38px;padding:7px 10px;border:1px solid rgba(255,255,255,.22);border-radius:8px;outline:0;color:#fff;background:rgba(255,255,255,.13);font:12px var(--oc-ui)}
.oc-calc-card input:focus{border-color:rgba(255,255,255,.65);box-shadow:0 0 0 3px rgba(255,255,255,.09)}.oc-calc-card form button{min-height:38px;margin-top:2px;border:0;border-radius:8px;color:#082318;background:#33d778;cursor:pointer;font-size:10px;font-weight:800}
.oc-calc-card output{display:flex;align-items:center;justify-content:space-between;margin-top:12px;padding:9px 11px;border:1px solid rgba(255,255,255,.14);border-radius:8px;color:rgba(255,255,255,.7);background:rgba(0,0,0,.16);font-size:8px}.oc-calc-card output strong{color:#fff;font-size:15px}

/* Changes, plan, terminal, environment */
.oc-panel-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:58px;padding:9px 12px;border-bottom:1px solid var(--oc-line);background:#16191f}
.oc-panel-heading strong,.oc-panel-heading small{display:block}.oc-panel-heading strong{color:var(--oc-text);font-size:10px}.oc-panel-heading small{margin-top:3px;color:var(--oc-muted);font-size:8px}
.oc-pass{padding:4px 7px;border:1px solid rgba(34,201,107,.26);border-radius:99px;color:#79dea2;background:rgba(34,201,107,.07);font-size:8px}
.oc-changes-list{flex:1;min-height:0;overflow:auto;padding:8px}.oc-change-row{appearance:none;display:flex;justify-content:space-between;gap:10px;width:100%;min-height:34px;padding:7px 8px;border:0;border-radius:5px;color:var(--oc-dim);background:transparent;cursor:pointer;text-align:left;font:9px var(--oc-mono)}
.oc-change-row:hover,.oc-change-row.is-active{color:var(--oc-text);background:var(--oc-hover)}.oc-change-row span:last-child{color:var(--oc-green)}
.oc-diff{margin:2px 0 7px;padding:8px 10px;overflow:auto;border:1px solid rgba(255,255,255,.075);border-radius:6px;color:#91e5b3;background:#0d1612;font:8px/1.65 var(--oc-mono);white-space:pre-wrap}.oc-diff span{display:block}
.oc-plan-list{display:grid;gap:9px;margin:0;padding:12px;overflow:auto;list-style:none}.oc-plan-list li{display:grid;grid-template-columns:25px minmax(0,1fr);gap:9px;padding:9px;border:1px solid rgba(255,255,255,.075);border-radius:7px;background:rgba(255,255,255,.016)}
.oc-plan-list li>span{display:grid;place-items:center;width:22px;height:22px;border:1px solid #434853;border-radius:50%;color:var(--oc-muted);font-size:8px}.oc-plan-list li.is-done>span{border-color:rgba(34,201,107,.4);color:var(--oc-green);background:rgba(34,201,107,.07)}
.oc-plan-list strong,.oc-plan-list small{display:block}.oc-plan-list strong{color:var(--oc-dim);font-size:9px}.oc-plan-list small{margin-top:3px;color:var(--oc-muted);font-size:8px;line-height:1.45}
.oc-terminal-head{display:flex;justify-content:space-between;padding:9px 11px;border-bottom:1px solid var(--oc-line);color:var(--oc-muted);font-size:8px;letter-spacing:.08em}.oc-terminal{flex:1;margin:0;padding:13px;overflow:auto;color:#d8dce5;background:#0c0f14;font:9px/1.75 var(--oc-mono);white-space:pre-wrap}.oc-terminal .dim{color:#767d89}.oc-terminal .cyan{color:#67d9e5}.oc-terminal .pass{color:#72dd9e}
.oc-env-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:12px}.oc-env-grid article{min-width:0;padding:12px;border:1px solid var(--oc-line);border-radius:8px;background:#171a20}.oc-env-grid span,.oc-env-grid strong,.oc-env-grid small{display:block}.oc-env-grid span{color:var(--oc-muted);font-size:7px;letter-spacing:.08em}.oc-env-grid strong{margin-top:9px;overflow:hidden;color:var(--oc-text);font:9px var(--oc-mono);text-overflow:ellipsis;white-space:nowrap}.oc-env-grid small{margin-top:5px;color:var(--oc-green);font-size:8px}

/* Footer, toast and approval center */
.oc-demo-footer{display:flex;align-items:center;gap:16px;min-height:31px;padding:0 11px;border-top:1px solid var(--oc-line);color:var(--oc-muted);background:#171a20;font-size:8px}.oc-demo-footer [data-oc-live-status]{display:inline-flex;align-items:center;gap:6px;color:#7de4a7}.oc-demo-footer>span:nth-child(2){margin-left:auto}
.oc-demo-footer button{appearance:none;border:0;color:#b7adff;background:none;cursor:pointer;font-size:8px;font-weight:700}.oc-demo[data-oc-state=running] .oc-demo-footer [data-oc-live-status]{color:#b8adff}.oc-demo[data-oc-state=running] .oc-demo-footer [data-oc-live-status] i{background:var(--oc-violet);animation:oc-pulse 1.2s ease-in-out infinite}
@keyframes oc-pulse{50%{opacity:.45;transform:scale(.72)}}.oc-toast{position:absolute;z-index:55;right:14px;bottom:42px;max-width:min(300px,calc(100% - 28px));padding:9px 12px;border:1px solid rgba(104,88,245,.42);border-radius:8px;color:var(--oc-text);background:rgba(25,26,34,.96);box-shadow:0 16px 40px rgba(0,0,0,.4);font-size:9px}
.oc-review-modal[hidden]{display:none}.oc-review-modal{position:absolute;z-index:60;inset:0;display:grid;place-items:center;padding:20px}.oc-modal-backdrop{position:absolute;inset:0;background:rgba(5,6,9,.72);backdrop-filter:blur(5px)}
.oc-review-modal>section{position:relative;width:min(440px,100%);overflow:hidden;border:1px solid #3b404d;border-radius:14px;outline:0;color:var(--oc-text);background:#181b22;box-shadow:0 30px 90px rgba(0,0,0,.62)}
.oc-modal-head{display:flex;align-items:flex-start;justify-content:space-between;gap:14px;padding:16px;border-bottom:1px solid var(--oc-line)}.oc-modal-head small{color:#9889ff;font-size:8px;font-weight:800;letter-spacing:.12em}.oc-modal-head h3{margin:5px 0 0;color:var(--oc-text);font-size:16px;letter-spacing:-.025em}
.oc-modal-head button{width:30px;height:30px;border-radius:7px;color:var(--oc-muted);font-size:18px}.oc-modal-head button:hover{color:var(--oc-text);background:var(--oc-hover)}
.oc-modal-summary{display:flex;gap:11px;padding:14px 16px;border-bottom:1px solid rgba(255,255,255,.075);background:rgba(34,201,107,.035)}.oc-check-large{display:grid;place-items:center;flex:0 0 auto;width:28px;height:28px;border-radius:50%;color:#092014;background:var(--oc-green);font-weight:900}.oc-modal-summary strong{font-size:10px}.oc-modal-summary p{margin:4px 0 0;color:var(--oc-muted);font-size:9px;line-height:1.5}
.oc-review-modal ul{margin:0;padding:8px 16px;list-style:none}.oc-review-modal li{display:flex;justify-content:space-between;gap:12px;padding:7px 0;border-bottom:1px solid rgba(255,255,255,.075);color:var(--oc-dim);font:9px var(--oc-mono)}.oc-review-modal li strong{color:var(--oc-green)}
.oc-modal-actions{display:flex;justify-content:flex-end;gap:8px;padding:13px 16px 16px}.oc-modal-actions button{appearance:none;min-height:34px;padding:7px 12px;border:1px solid var(--oc-line);border-radius:7px;color:var(--oc-dim);background:#20232b;cursor:pointer;font-size:9px;font-weight:700}.oc-modal-actions .is-approve{border-color:transparent;color:#071b11;background:var(--oc-green)}

/* Existing supporting sections */
.oc-explain{padding:18px 0 46px}.oc-explain-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-bottom:22px}.oc-explain-card{padding:26px 24px;border:1px solid rgba(255,255,255,.08);border-radius:18px;background:linear-gradient(165deg,rgba(167,139,250,.08),rgba(255,255,255,.02))}
.oc-explain-card h3,.oc-who-card h3,.oc-how-card h3{margin:0 0 9px;font-family:var(--oc-display);letter-spacing:-.025em}.oc-explain-card h3{font-size:1.2rem}.oc-explain-card p,.oc-who-card p,.oc-how-card p{margin:0;color:var(--fg-dim);line-height:1.62}.oc-explain-card p{font-size:.95rem}.oc-explain-card strong,.oc-steps-plain strong{color:var(--fg)}
.oc-steps-plain{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:0;padding:18px 20px;border:1px solid rgba(255,255,255,.08);border-radius:16px;background:rgba(255,255,255,.02);counter-reset:ocstep;list-style:none}.oc-steps-plain li{position:relative;padding-left:29px;color:var(--fg-dim);font-size:.88rem;line-height:1.48;counter-increment:ocstep}
.oc-steps-plain li:before{content:counter(ocstep);position:absolute;top:0;left:0;display:grid;place-items:center;width:20px;height:20px;border-radius:6px;color:#0b0f1a;background:linear-gradient(135deg,#a78bfa,#22d3ee);font:700 .68rem var(--oc-mono)}
.oc-section{padding:76px 0}.oc-section .eyebrow{margin:0 0 12px;color:var(--accent-2);font-size:.75rem;font-weight:700;letter-spacing:.1em;text-transform:uppercase}.oc-section h2{max-width:23ch;margin:0 0 12px;font-family:var(--oc-display);font-size:clamp(1.65rem,3.5vw,2.45rem);letter-spacing:-.035em}.oc-section-lede{max-width:54ch;margin:0 0 36px;color:var(--fg-dim);line-height:1.68}
.oc-how-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:15px}.oc-how-card,.oc-who-card,.oc-model-card{border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.025)}.oc-how-card{padding:22px;border-radius:16px}.oc-how-card h3{font-size:1.05rem}.oc-how-card p{font-size:.9rem}.oc-how-card .oc-num{display:block;margin-bottom:11px;color:var(--accent-1);font:700 .72rem var(--oc-mono)}
.oc-who-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:8px}.oc-who-card{padding:24px;border-radius:16px}.oc-who-card h3{font-size:1.05rem}.oc-who-card p{font-size:.9rem}
.oc-models{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-top:8px}.oc-model-card{padding:24px 20px;border-radius:16px;text-align:center}.oc-model-card strong{display:block;margin-bottom:7px;font-family:var(--oc-display);font-size:1.1rem}.oc-model-card span{color:var(--fg-dim);font-size:.85rem;line-height:1.48}
.oc-cta-band{padding:84px 0 104px;text-align:center}.oc-cta-band h2{margin:0 0 12px;font-family:var(--oc-display);font-size:clamp(1.85rem,4vw,2.7rem);letter-spacing:-.04em}.oc-cta-band p{max-width:42ch;margin:0 auto 28px;color:var(--fg-dim)}.oc-cta-band .oc-hero-ctas{justify-content:center}

/* Compact desktop/tablet rail */
@media (max-width:1180px) and (min-width:801px){
  .oc-hero-inner{width:calc(100% - 24px)}.oc-demo-grid{grid-template-columns:62px minmax(400px,1.14fr) minmax(340px,.86fr);height:600px}
  .oc-rail-title{justify-content:center}.oc-rail-title>span,.oc-rail-title button,.oc-agent-nav b,.oc-rail-section-head,.oc-repo-name strong,.oc-repo-branch,.oc-task>span,.oc-background,.oc-profile>span:nth-child(2),.oc-profile button{display:none}
  .oc-agent-nav{place-items:center;padding-inline:7px}.oc-agent-nav button{display:grid;place-items:center;width:42px;height:42px;padding:0}.oc-agent-nav button>span{font-size:17px}.oc-rail-section{padding-inline:7px}.oc-repo-name{justify-content:center;padding:7px 0}.oc-task{display:grid;place-items:center;min-height:38px;padding:0}.oc-task-dot{margin:0}.oc-profile{grid-template-columns:1fr;place-items:center;margin-top:auto}
  .oc-review-strip small,.oc-mini-btn:first-child,.oc-window-controls{display:none}
}

/* Mobile shows one workspace pane, never a tall three-pane stack */
@media (max-width:800px){
  .oc-hero{padding-top:calc(var(--nav-h) + 38px)}.oc-hero-inner{width:min(calc(100% - 20px),680px)}.oc-hero h1{max-width:15ch;font-size:clamp(2.35rem,11.5vw,4.1rem)}
  .oc-tour-label>span:last-child,.oc-app-switch,.oc-window-controls,.oc-plan-pill{display:none}.oc-appbar{grid-template-columns:1fr auto}.oc-app-actions{grid-column:2}
  .oc-mobile-switcher{display:grid;grid-template-columns:repeat(3,1fr);min-height:43px;padding:5px;border-bottom:1px solid var(--oc-line);background:#181a20}.oc-mobile-switcher button{appearance:none;min-height:33px;border:0;border-radius:6px;color:var(--oc-muted);background:transparent;cursor:pointer;font-size:10px;font-weight:700}.oc-mobile-switcher button.is-active{color:var(--oc-text);background:rgba(104,88,245,.16)}
  .oc-demo-grid{display:block;height:590px}.oc-demo-grid>[data-oc-workspace]{display:none;height:100%;border-right:0}.oc-demo[data-mobile-panel=tasks] [data-oc-workspace=tasks]{display:flex}.oc-demo[data-mobile-panel=build] [data-oc-workspace=build],.oc-demo:not([data-mobile-panel]) [data-oc-workspace=build]{display:flex}.oc-demo[data-mobile-panel=preview] [data-oc-workspace=preview]{display:flex}
  .oc-demo-rail{width:100%}.oc-task{min-height:54px}.oc-background{display:block}.oc-review-strip{min-height:60px}.oc-chat{padding-bottom:10px}.oc-demo-footer>span:nth-child(2){display:none}.oc-demo-footer button{margin-left:auto}.oc-preview-site{min-height:360px}
  .oc-explain-grid,.oc-who-grid,.oc-models{grid-template-columns:1fr}.oc-how-grid,.oc-steps-plain{grid-template-columns:1fr 1fr}
}
@media (max-width:560px){
  .oc-hero{padding-bottom:62px}.oc-hero-inner{width:calc(100% - 16px)}.oc-hero-copy{padding-inline:6px}.oc-hero h1{font-size:clamp(2.25rem,12.2vw,3.25rem)}.oc-hero-proof{display:grid;grid-template-columns:1fr 1fr;text-align:left}.oc-hero-stage{margin-top:36px}.oc-demo{border-radius:13px}
  .oc-app-actions .oc-icon-button,.oc-mini-btn,.oc-studio-toolbar>div:last-child .oc-model{display:none}.oc-demo-grid{height:570px}.oc-review-strip{margin-inline:7px}.oc-agent-card>p,.oc-activity,.oc-file-chips,.oc-agent-result{margin-left:0}.oc-composer{padding-inline:7px}.oc-model-toggle{max-width:125px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .oc-tabs{padding-inline:3px}.oc-tab{padding-inline:8px}.oc-calc-card{border-radius:14px}.oc-env-grid,.oc-how-grid,.oc-steps-plain{grid-template-columns:1fr}
  .oc-sticky-cta{position:fixed;z-index:40;right:14px;bottom:max(14px,env(safe-area-inset-bottom));left:14px;display:flex;justify-content:center}.oc-sticky-cta .cta{width:100%;justify-content:center;box-shadow:0 12px 40px rgba(0,0,0,.42)}
}
@media (min-width:561px){.oc-sticky-cta{display:none}}
@media (prefers-reduced-motion:reduce){.oc-demo *,.oc-demo *:before,.oc-demo *:after{scroll-behavior:auto!important;animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}
html[data-perf=lite] .oc-demo *,html[data-perf=lite] .oc-demo *:before,html[data-perf=lite] .oc-demo *:after{animation:none!important;transition:none!important}

/* Dynamic preview states populated by the product-tour controller */
.oc-file-chips button.is-active{border-color:rgba(104,88,245,.68);color:var(--oc-text);background:rgba(104,88,245,.14)}
.oc-browser-frame.is-selecting{box-shadow:0 0 0 2px #7399ff inset}
.oc-browser-frame.is-selecting:after{content:"Select an element";position:absolute;top:10px;left:10px;z-index:3;padding:4px 7px;border:1px solid rgba(115,153,255,.7);border-radius:5px;color:#dce7ff;background:rgba(28,63,132,.88);font:8px var(--oc-mono)}
.oc-checkout-total{display:flex;align-items:center;justify-content:space-between;margin:16px 0 10px;padding:12px;border:1px solid rgba(255,255,255,.16);border-radius:9px;background:rgba(0,0,0,.14)}
.oc-checkout-total span{color:rgba(255,255,255,.72);font-size:9px}.oc-checkout-total strong{font-size:18px}
.oc-checkout-actions{display:grid;grid-template-columns:1fr 1fr;gap:7px}.oc-checkout-actions button,.oc-dashboard-card>button{min-height:36px;border:1px solid rgba(255,255,255,.18);border-radius:8px;color:#fff;background:rgba(255,255,255,.1);cursor:pointer;font-size:9px;font-weight:750}
.oc-checkout-actions button:first-child,.oc-dashboard-card>button{border-color:transparent;color:#102319;background:#42dd86}
.oc-metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin:15px 0 10px}.oc-metric{padding:9px 6px;border:1px solid rgba(255,255,255,.16);border-radius:8px;background:rgba(0,0,0,.14);text-align:center}.oc-metric span,.oc-metric strong,.oc-metric small{display:block}.oc-metric span{color:rgba(255,255,255,.62);font-size:7px}.oc-metric strong{margin-top:5px;font-size:14px}.oc-metric small{margin-top:2px;color:#74e1bd;font-size:7px}
.oc-demo.is-approved .oc-agent-card-head>span:last-child,.oc-demo.is-approved .oc-demo-footer [data-oc-live-status]{color:#a6efc0}.oc-demo.is-approved .oc-agent-result{border-color:rgba(34,201,107,.48);background:rgba(34,201,107,.1)}
body.oc-modal-open{overflow:hidden}
.oc-demo{scroll-margin-top:calc(var(--nav-h) + 14px)}
.oc-page .oc-sticky-cta{display:none!important}