:root{--text-small:14px;--text-body:16px;--text-heading:28px;--type-label:var(--text-small);--type-body:var(--text-body);--type-heading:var(--text-heading);--ink:#202630;--muted:#667085;--blue:#2563eb;--line:#e2e7ef;--mono:ui-monospace,SFMono-Regular,Consolas,monospace;--sans:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;--shadow-pop:0 8px 25px #243b5809;color-scheme:light}
*{box-sizing:border-box}html{scroll-padding-top:90px}body{margin:0;background:#fff;color:var(--ink);font:400 var(--text-body)/1.5 var(--sans);-webkit-font-smoothing:antialiased}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}a{color:inherit;text-decoration:none}button{cursor:pointer}button:focus-visible,a:focus-visible,summary:focus-visible,pre:focus-visible{outline:2px solid #83a8ef;outline-offset:5px}button:disabled{cursor:default}svg{height:20px;width:20px;stroke:currentColor;stroke-width:1.6;fill:none;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}img{max-width:100%}[hidden]{display:none!important}.svg-defs{position:absolute;width:0;height:0;overflow:hidden}.wrap{width:min(1160px,calc(100% - 80px));margin-inline:auto}.skip{position:fixed;top:-100px;background:#fff;padding:12px;z-index:99}.skip:focus{top:12px}
.site-header{height:74px;position:sticky;top:0;background:#fffffff0;backdrop-filter:blur(18px);border-bottom:1px solid #f0f1f4;z-index:20}.nav{height:100%;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;align-items:center;gap:9px;font-size:var(--text-body);font-weight:650;letter-spacing:-.4px}.brand img{width:31px;height:31px}.nav nav{display:flex;align-items:center;gap:30px;color:#555e6a}.nav nav>a:hover{color:var(--blue)}.products-menu{position:relative}.products-menu summary{display:flex;align-items:center;gap:6px;list-style:none;cursor:pointer}.products-menu summary::-webkit-details-marker{display:none}.products-menu summary>svg{width:13px;height:13px;transition:transform .2s}.products-menu[open] summary>svg{transform:rotate(180deg)}.dropdown{position:absolute;top:35px;left:-20px;width:300px;padding:10px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:0 12px 30px #18284012}.dropdown a{display:flex;align-items:start;gap:12px;padding:14px;border-radius:8px}.dropdown a:hover{background:#f5f7fb}.dropdown b,.dropdown small{display:block}.dropdown b{font-size:var(--text-body);font-weight:550}.dropdown small{font-size:var(--text-small);color:var(--muted);margin-top:4px}.header-actions{display:flex;align-items:center;gap:22px}.github-link{display:grid;place-items:center;width:32px;height:36px;border-radius:6px}.github-link img{width:22px;height:22px}.github-link:hover{background:#f3f5f8}.header-cta{display:flex;align-items:center;gap:8px;padding:10px 16px;background:#f3f5f8;border-radius:8px;font-size:var(--text-small);font-weight:550}.header-cta svg{width:16px;height:16px}
.hero{padding:43px 0 33px;text-align:center}.hero h1{font-size:36px;font-weight:650;line-height:1.16;letter-spacing:-1px;margin:0}.hero h1>span{display:block;color:#717b8c}.hero p{font-size:var(--text-body);line-height:1.65;color:var(--muted);margin:22px 0 0}.product-tabs{position:relative;display:grid;grid-template-columns:1fr 1fr}.product-tabs:after{content:"";position:absolute;left:0;right:0;bottom:0;height:1px;background:var(--line);pointer-events:none}.product-tab{position:relative;border:0;background:#fff;display:flex;align-items:center;justify-content:center;gap:16px;padding:21px 20px;text-align:left;color:#202630}.product-tab>svg{width:27px;height:27px;color:#667085}.product-tab strong,.product-tab small{display:block}.product-tab strong{font-size:var(--text-body);font-weight:600;letter-spacing:-.25px}.product-tab small{font-size:var(--text-small);font-weight:400;margin-top:3px;color:#667085}.product-tab[aria-selected=true]{color:#202630}.product-tab[aria-selected=true]>svg{color:var(--blue)}.product-tab[aria-selected=true] .selected-indicator{position:absolute;bottom:0;left:22%;right:22%;height:2px;background:var(--blue);z-index:1}.product-tab:first-child:after{content:'';position:absolute;right:0;top:50%;width:1px;height:34px;background:var(--line);transform:translateY(-50%)}
.scene{padding:29px 29px 34px;display:flex;align-items:center;flex-direction:column}.product-feature-pills{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));align-items:center;gap:10px}.desktop-choices,.sdk-capability-list{width:100%;max-width:940px;margin:0 0 30px}.product-feature-pills [role=tab]{display:flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:9px 12px;background:transparent;border:0;border-radius:8px;color:#7a879a;font-size:var(--text-small);font-weight:400;line-height:1.4;white-space:nowrap}.product-feature-pills [role=tab] b{font:inherit;color:inherit}.product-feature-pills [role=tab] svg{width:16px;height:16px}.product-feature-pills [role=tab][aria-selected=true]{color:#365fa2;background:#f0f4fc}.product-feature-pills [role=tab]:hover{background:#f1f4f9}.product-feature-pills [role=tab][aria-selected=true]:hover{background:#eaf0fa}
.pill-heading{width:100%;max-width:940px;text-align:left;padding-inline:24px;margin:0 auto 16px}.pill-heading h2,.pill-heading h3{font-size:var(--text-body);font-weight:500;line-height:1.5;letter-spacing:0;margin:0}.pill-heading p{font-size:var(--text-body);line-height:1.6;color:var(--muted);margin:0}.desktop-carousel-host,.sdk-story-stage{width:100%;max-width:940px;min-width:0}.feature-pane{padding:0;min-width:0}.desktop-controls{display:flex;justify-content:space-between;align-items:center;padding:12px 3px 0;color:#8a95a5;font-size:var(--text-small)}.desktop-controls>div{display:flex;gap:8px}.desktop-controls button{display:grid;place-items:center;padding:5px;border:0;background:transparent;color:#7b8ba2;border-radius:5px}.desktop-controls button:hover{background:#edf2fa}.desktop-controls svg{width:15px;height:15px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 20px;min-height:46px;border:0;border-radius:25px;line-height:1.4;font-size:var(--text-body);font-weight:500}.primary{color:#fff;background:var(--blue);box-shadow:0 4px 10px #2563eb12}.primary:hover{background:#1e56d9}.button svg{width:17px;height:17px}.product-story-actions{display:flex;justify-content:center;align-items:center;gap:24px;margin-top:34px}.text-button{display:inline-flex;align-items:center;gap:8px;border:0;background:none;color:var(--muted);padding:0;font-size:var(--text-body)}.text-button svg{width:15px;height:15px}.sdk-start{margin-top:34px}.closing{text-align:center;padding:70px 0 80px}.closing h2{font-size:var(--text-heading);line-height:1.25;letter-spacing:-.7px;margin:0 0 24px}.closing>div{display:flex;justify-content:center;gap:30px}.text-link{display:inline-flex;align-items:center;gap:8px;color:var(--blue)}.text-link svg{width:17px;height:17px}footer{display:flex;align-items:center;gap:24px;padding:25px 0 30px;border-top:1px solid var(--line);font-size:var(--text-small);color:var(--muted)}footer>span{margin-left:auto}footer nav{display:flex;gap:22px}footer .brand img{width:24px;height:24px}
dialog{border:1px solid var(--line);border-radius:14px;width:min(1080px,92vw);padding:0;overflow:hidden;box-shadow:0 25px 100px #10182840}dialog::backdrop{background:#11182799;backdrop-filter:blur(8px)}.dialog-top{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;background:#fff}.dialog-top b{font-weight:550}.dialog-top button{display:grid;place-items:center;background:#f3f5f8;border:0;border-radius:50%;padding:7px}dialog video{display:block;width:100%;max-height:77vh;background:#101828}.modal-open{overflow:hidden}
@media(max-width:1000px){.wrap{width:calc(100% - 48px)}.nav nav{gap:22px}.scene{padding-inline:20px}}
@media(max-width:720px){.wrap{width:calc(100% - 32px)}.nav{gap:12px}.nav nav>a{display:none}.header-actions{gap:8px}.header-cta{padding:9px 11px}.brand img{width:25px;height:25px}.scene{padding:24px 0 30px}.hero{padding:32px 0 26px}.hero h1{font-size:28px;letter-spacing:-.5px}.hero p{margin-top:18px}.product-tab{padding:18px 8px;gap:8px}.product-tab>svg{width:20px;height:20px}.product-tab small{display:none}.product-feature-pills{display:flex;justify-content:flex-start;flex-wrap:wrap;gap:5px}.product-feature-pills [role=tab]{padding:9px 10px}.product-story-actions{flex-direction:column;gap:18px}.closing{padding:55px 0}.closing>div{flex-direction:column;align-items:center;gap:18px}footer{flex-wrap:wrap;gap:15px}footer nav{margin-left:auto}.dropdown{left:-100px}.desktop-controls>span{max-width:65%}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}
.mobile-break{display:none}
@media(max-width:720px){.mobile-break{display:initial}.header-actions .github-link{display:none}}

/* Invisible label sizing preserves the original 16px pill hitboxes while the
   visible labels use a quieter 14px. Hidden from assistive technology. */
.product-feature-pills .pill-label{display:grid;align-items:center;text-align:center}
.product-feature-pills .pill-label>span{grid-area:1 / 1}
.product-feature-pills .pill-measure{visibility:hidden;font-size:var(--text-body);font-weight:500;line-height:1.4;pointer-events:none;user-select:none}

/* Public repository star count, verified 2026-11-12; refreshed with site releases. */
.header-actions .github-link{display:flex;gap:9px;width:auto;padding:0 5px}
.github-stars{display:flex;align-items:center;gap:4px;font-size:var(--text-small);font-weight:500;color:var(--ink);white-space:nowrap}
.github-stars svg{width:14px;height:14px;stroke-width:1.5}
@media(max-width:720px){.header-actions .github-link{display:none}}

@media(max-width:720px){.pill-heading{padding-inline:16px}}

/* Adapted from ocw-context/site/consumer.html. Original Desktop demo scenes. */
.appwin{
  --ow-paper:#F5F6F7;--ow-panel:#FFF;--ow-ink:#17191C;--ow-muted:#5B616B;
  --ow-faint:#9AA1AA;--ow-line:#E8EAED;--ow-line-strong:#D8DCE1;
  --ow-accent:#2563EB;--ow-accent-soft:#E9F0FD;--ow-solid:#E9EBF0;
  color:var(--ow-ink);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,system-ui,sans-serif;
  background:var(--ow-paper);border-radius:18px;box-shadow:var(--shadow-pop);overflow:hidden;
  border:1px solid var(--ow-line-strong);
}
.carousel{display:grid;overflow:hidden}
.carousel .slide{
  grid-area:1/1;background:var(--ow-paper);min-width:0;
  opacity:0;visibility:hidden;pointer-events:none;
}
.carousel .slide.is-active{
  opacity:1;visibility:visible;pointer-events:auto;
}

.demo-workspace{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 190px;min-height:430px;overflow:hidden;}
.demo-chat{min-width:0;padding:28px;display:flex;flex-direction:column;border-right:1px solid var(--ow-line);}
.demo-transcript{flex:1;display:flex;flex-direction:column;gap:18px;min-height:0}
.demo-user{align-self:flex-end;max-width:78%;padding:9px 12px;border-radius:14px 14px 4px 14px;background:var(--ow-solid);font-size:var(--text-small);line-height:1.45}
.demo-connector-message{
  align-self:stretch;border:1px solid var(--ow-line-strong);border-radius:11px;background:var(--ow-panel);overflow:hidden;
}
.demo-connector-head{
  min-height:32px;padding:6px 9px;display:flex;align-items:center;gap:6px;background:rgba(97,31,105,.11);
  border-bottom:1px solid var(--ow-line);white-space:nowrap;
}
.demo-connector-head img{width:17px;height:17px;object-fit:contain}
.demo-connector-head b{font-size:var(--text-small);color:#611f69;overflow:hidden;text-overflow:ellipsis}
.demo-connector-head span{font-size:var(--text-small);color:var(--ow-muted)}
.demo-connector-head small{font-size:var(--text-small);color:var(--ow-faint)}
.demo-connector-head time{margin-left:auto;font-size:var(--text-small);color:var(--ow-faint)}
.demo-connector-body{padding:9px 11px;font-size:var(--text-small);line-height:1.45;color:var(--ow-ink)}
.demo-assistant{font-size:var(--text-small);line-height:1.55;color:var(--ow-ink)}
.demo-who{margin-bottom:10px;font-size:var(--text-small);font-weight:400;letter-spacing:0;text-transform:none;color:#7e8795}
.demo-assistant strong{font-weight:650}
.demo-stepgroup{display:flex;align-items:center;gap:6px;color:var(--ow-faint);font-size:var(--text-small)}
.demo-stepgroup .demo-chevron{font-size:var(--text-small)}
.demo-result h4{margin:0 0 5px;font-size:var(--text-body);line-height:1.25;font-weight:700;letter-spacing:-.01em}
.demo-result p{font-size:var(--text-small);line-height:1.5;color:var(--ow-muted)}
.demo-result ul{margin:6px 0 0;padding-left:16px;font-size:var(--text-small);line-height:1.45;color:var(--ow-muted)}
.demo-result li::marker{color:var(--ow-faint)}
.demo-inline-result{
  display:none;align-items:center;gap:8px;padding:8px 10px;border:1px solid var(--ow-line);
  border-radius:9px;background:var(--ow-panel);font-size:var(--text-small);color:var(--ow-muted);
}
.demo-artifact-chip{
  width:max-content;max-width:100%;display:grid;grid-template-columns:25px minmax(0,1fr) auto;align-items:center;gap:8px;
  padding:6px 9px;border:1px solid var(--ow-line);border-radius:9px;background:var(--ow-panel);color:var(--ow-ink);
}
.demo-artifact-chip .chip-ico{width:25px;height:25px;border-radius:7px;display:grid;place-items:center;background:var(--ow-accent-soft);color:var(--ow-accent);font-size:var(--text-small)}
.demo-artifact-chip b{display:block;font-size:var(--text-small);font-weight:650;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-artifact-chip small{display:block;margin-top:1px;font-size:var(--text-small);color:var(--ow-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-artifact-chip .chip-open{font-size:var(--text-small);font-weight:650;color:var(--ow-accent);white-space:nowrap}
.demo-approval{margin-top:16px;padding:10px;border:1px solid var(--ow-line);border-radius:9px;background:#fff;}
.demo-approval-head{display:flex;align-items:center;gap:7px;font-size:var(--text-small);color:var(--ow-ink)}
.demo-approval-ico{
  width:20px;height:20px;border-radius:6px;display:grid;place-items:center;flex:none;
  background:var(--ow-accent-soft);color:var(--ow-accent);font-size:var(--text-small);font-weight:700;
}
.demo-approval-head b{font-weight:600}.demo-approval-scope{margin-left:auto;font-size:var(--text-small);color:var(--ow-faint)}
.demo-approval-actions{display:flex;align-items:center;gap:7px;margin-top:8px}
.demo-approve{
  padding:4px 9px;border:1px solid var(--ow-accent);border-radius:7px;color:var(--ow-accent);
  font-size:var(--text-small);font-weight:650;
}
.demo-deny{padding:4px 6px;color:var(--ow-faint);font-size:var(--text-small)}
.demo-rail{padding:9px 13px;background:rgba(255,255,255,.78);font-size:var(--text-small);line-height:1.35}
.demo-rail-section{padding:9px 0 11px;border-bottom:1px solid var(--ow-line)}
.demo-rail-section:last-child{border-bottom:0}
.demo-rail-head{display:flex;align-items:center;gap:6px;margin-bottom:8px;font-size:var(--text-small);font-weight:650}
.demo-chevron{color:var(--ow-faint);font-size:var(--text-small)}.demo-rail-refresh{margin-left:auto;color:var(--ow-faint)}
.demo-progress{display:flex;flex-direction:column;gap:7px}
.demo-progress-row{display:grid;grid-template-columns:11px 1fr;gap:6px;color:var(--ow-muted)}
.demo-progress-row::before{content:"";width:9px;height:9px;margin-top:2px;border:1.3px solid var(--ow-line-strong);border-radius:3px}
.demo-progress-row.done{color:var(--ow-faint);text-decoration:line-through}
.demo-progress-row.done::before{content:"✓";display:grid;place-items:center;color:#fff;background:var(--ow-accent);border-color:var(--ow-accent);font-size:var(--text-small);text-decoration:none}
.demo-progress-row.active{color:var(--ow-ink)}
.demo-progress-row.active::before{border-radius:50%;border-color:var(--ow-accent);box-shadow:inset 0 0 0 2px var(--ow-panel);background:var(--ow-accent)}
.demo-artifact{display:grid;grid-template-columns:18px 1fr;gap:7px;align-items:center}
.demo-file-ico{width:18px;height:18px;display:grid;place-items:center;color:var(--ow-muted);font-size:var(--text-small)}
.demo-artifact b{display:block;font-size:var(--text-small);font-weight:550;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-artifact span{display:block;font-size:var(--text-small);color:var(--ow-faint)}
.demo-access{display:flex;align-items:center;gap:6px;color:var(--ow-muted)}
.demo-access b{font-weight:500;color:var(--ow-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-artifact-viewer{position:relative;grid-column:2;grid-row:1;min-width:0;display:flex;flex-direction:column;background:var(--ow-panel);border-left:1px solid var(--ow-line);}
.demo-av-head{min-height:48px;padding:8px 10px;display:flex;align-items:center;gap:8px;border-bottom:1px solid var(--ow-line);background:rgba(255,255,255,.94)}
.demo-av-back{width:24px;height:24px;display:grid;place-items:center;border-radius:7px;color:var(--ow-muted);font-size:var(--text-body)}
.demo-av-heading{min-width:0;flex:1}
.demo-av-title{font-size:var(--text-small);font-weight:650;color:var(--ow-ink);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-av-title span{color:var(--ow-faint);font-weight:500;margin-right:4px}
.demo-av-path{margin-top:1px;font-size:var(--text-small);color:var(--ow-faint);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.demo-av-actions{font-size:var(--text-small);letter-spacing:.08em;color:var(--ow-faint)}
.demo-av-body{padding:14px;min-width:0;overflow:auto;flex:1;}
.demo-html-preview{
  height:100%;padding:12px 13px;border:1px solid var(--ow-line);border-radius:10px;background:#fff;
  box-shadow:0 5px 18px rgba(20,30,60,.07);
}
.demo-report-head{display:flex;align-items:center;justify-content:space-between;gap:8px}
.demo-html-kicker{font-size:var(--text-small);font-weight:400;letter-spacing:0;text-transform:none;color:#7e8795}
.demo-report-status{
  padding:3px 6px;border-radius:999px;background:#eaf8ef;color:#237a4b;
  font-size:var(--text-small);font-weight:750;letter-spacing:.05em;text-transform:uppercase;
}
.demo-html-preview h3{margin:8px 0 6px;font-size:var(--text-small);font-weight:550;line-height:1.45;letter-spacing:0}
.demo-report-sub{font-size:var(--text-small);line-height:1.35;color:var(--ow-muted)}
.demo-metric-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:10px}
.demo-metric{padding:7px 8px;border:1px solid var(--ow-line);border-radius:7px;background:#fbfcff}
.demo-metric b{display:block;font-size:var(--text-body);line-height:1.05;letter-spacing:-.025em;color:var(--ow-ink)}
.demo-metric span{display:block;margin-top:3px;font-size:var(--text-small);line-height:1.2;color:var(--ow-muted)}
.demo-chart-card{margin-top:8px;padding:7px 9px 6px;border:1px solid var(--ow-line);border-radius:8px}
.demo-chart-head{display:flex;align-items:center;justify-content:space-between;font-size:var(--text-small);color:var(--ow-muted)}
.demo-chart-head b{font-size:var(--text-small);color:var(--ow-ink)}
.demo-chart-delta{font-weight:700;color:#237a4b}
.demo-mini-chart{
  position:relative;height:62px;margin-top:6px;padding:0 3px 13px;display:flex;align-items:flex-end;justify-content:space-around;gap:0;
  background:repeating-linear-gradient(to bottom,transparent 0,transparent 15px,var(--ow-line) 16px);
}
.demo-bar{position:relative;z-index:1;flex:0 0 clamp(24px,12%,42px);border-radius:4px 4px 2px 2px;background:linear-gradient(180deg,#64b5ff,#2563eb)}
.demo-bar::after{content:attr(data-q);position:absolute;top:calc(100% + 3px);left:50%;transform:translateX(-50%);font-size:var(--text-small);color:var(--ow-faint)}
.demo-html-note{
  margin-top:8px;padding:7px 8px;border-radius:7px;background:var(--ow-accent-soft);
  font-size:var(--text-small);line-height:1.35;color:var(--ow-muted);
}
.demo-html-note b{color:var(--ow-accent)}
.demo-md-preview{
  padding:12px 13px;border:1px solid var(--ow-line);border-radius:10px;background:#fff;
  box-shadow:0 5px 18px rgba(20,30,60,.07);
}
.demo-incident-head{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.demo-md-preview h3{margin:0;font-size:var(--text-body);line-height:1.2;letter-spacing:-.015em}
.demo-incident-status{
  flex:none;padding:3px 6px;border-radius:999px;background:#fff2df;color:#a55305;
  font-size:var(--text-small);font-weight:750;letter-spacing:.04em;text-transform:uppercase;
}
.demo-incident-sub{margin-top:3px;font-size:var(--text-small);line-height:1.35;color:var(--ow-muted)}
.demo-incident-metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:9px}
.demo-incident-metric{padding:6px 7px;border-radius:7px;background:#f6f8fb}
.demo-incident-metric b{display:block;font-size:var(--text-small);line-height:1.1;color:var(--ow-ink)}
.demo-incident-metric span{display:block;margin-top:2px;font-size:var(--text-small);color:var(--ow-muted)}
.demo-md-preview h4{margin:10px 0 5px;font-size:var(--text-small);color:var(--ow-ink)}
.demo-timeline{position:relative;margin-left:3px;padding-left:13px;border-left:1px solid var(--ow-line-strong)}
.demo-timeline-row{position:relative;display:grid;grid-template-columns:29px 1fr;gap:5px;padding:0 0 6px;font-size:var(--text-small);line-height:1.25;color:var(--ow-muted)}
.demo-timeline-row:last-child{padding-bottom:0}
.demo-timeline-row::before{
  content:"";position:absolute;left:-17px;top:3px;width:6px;height:6px;border-radius:50%;
  background:var(--ow-accent);box-shadow:0 0 0 2px #fff;
}
.demo-timeline-row time{font-weight:700;color:var(--ow-ink)}
.demo-timeline-row b{font-weight:650;color:var(--ow-ink)}
.demo-md-callout{
  display:grid;grid-template-columns:20px 1fr;gap:7px;align-items:center;margin-top:9px;padding:7px 8px;
  border-radius:7px;background:#fff7e8;font-size:var(--text-small);line-height:1.3;color:#8a4b08;
}
.demo-callout-ico{width:20px;height:20px;border-radius:6px;display:grid;place-items:center;background:#ffe8bf;font-size:var(--text-small)}
.demo-md-callout b{display:block;font-size:var(--text-small)}
.demo-diff{margin-top:9px;border:1px solid var(--ow-line);border-radius:8px;overflow:hidden;font-family:var(--mono);font-size:var(--text-small);line-height:1.65}
.demo-diff-file{padding:4px 8px;background:#f6f8fb;border-bottom:1px solid var(--ow-line);font-weight:500;color:var(--ow-muted)}
.demo-diff-line{padding:1px 8px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:var(--ow-muted)}
.demo-diff-line.del{background:#fff1f0;color:#a8071a}
.demo-diff-line.add{background:#f0fdf4;color:#1f7a45}
.has-viewer .demo-approval{position:relative;margin-top:16px;padding:10px;border:1px solid var(--ow-line);border-radius:9px;}
.has-viewer .demo-approval-head{align-items:flex-start;font-size:var(--text-small);line-height:1.3}
.has-viewer .demo-approval-head{flex-wrap:wrap}
.has-viewer .demo-approval-scope{display:block;width:100%;margin-left:27px;font-size:var(--text-small);color:var(--ow-faint)}
.has-viewer .demo-approval-actions{margin-top:6px}
/* The real composer is a compact two-row card rather than a pill-shaped chat bar. */
.composer{padding:11px 14px 13px;background:var(--ow-paper)}
.composer-card{border:1px solid var(--ow-line);border-radius:13px;background:var(--ow-panel);box-shadow:0 1px 3px rgba(0,0,0,.05);overflow:hidden}
.comp-input{display:flex;align-items:center;min-height:34px;padding:9px 11px 4px;font-size:var(--text-small);color:var(--ow-faint)}
.comp-controls{display:flex;align-items:center;gap:7px;padding:3px 8px 8px;color:var(--ow-muted)}
.comp-plus{width:21px;height:21px;display:grid;place-items:center;font-size:var(--text-body);line-height:1;color:var(--ow-muted)}
.comp-mode{display:inline-flex;align-items:center;font-size:var(--text-small)}
.comp-chevron{width:5px;height:5px;margin:-2px 0 0 5px;border-right:1px solid currentColor;border-bottom:1px solid currentColor;transform:rotate(45deg)}
.comp-model{margin-left:auto;padding:4px 9px;border:1px solid var(--ow-line);border-radius:6px;background:var(--ow-paper);font-size:var(--text-small);font-weight:550;color:var(--ow-muted)}
.comp-send{width:23px;height:23px;flex:none;border-radius:50%;display:grid;place-items:center;background:var(--ow-accent);color:#fff}
/* Each frame tells its story deliberately, then holds the completed state for three seconds. */
.slide.is-active .demo-user,.slide.is-active .demo-connector-message{animation:demo-stage-in .55s cubic-bezier(.22,.6,.2,1) .2s both}
.slide.is-active .demo-stepgroup{animation:demo-stage-in .55s cubic-bezier(.22,.6,.2,1) 1.1s both}
.slide.is-active .demo-assistant{animation:demo-stage-in .58s cubic-bezier(.22,.6,.2,1) 2s both}
.slide.is-active .demo-inline-result,.slide.is-active .demo-artifact-chip{animation:demo-stage-in .55s cubic-bezier(.22,.6,.2,1) 2.8s both}
.slide.is-active .demo-rail{animation:demo-stage-in .55s cubic-bezier(.22,.6,.2,1) 2.35s both}
.slide.is-active .demo-approval{animation:demo-stage-in .58s cubic-bezier(.22,.6,.2,1) 3.35s both}
.slide.is-active .demo-artifact-viewer{animation:demo-viewer-in .65s cubic-bezier(.22,.6,.2,1) 3.7s both}
.slide.is-active.has-viewer .demo-approval{animation-delay:4.8s}
@keyframes demo-stage-in{from{opacity:0;transform:translateY(7px)}to{opacity:1;transform:none}}
@keyframes demo-viewer-in{from{opacity:0;transform:translateX(24px)}to{opacity:1;transform:none}}

.has-viewer .demo-workspace{grid-template-columns:minmax(0,38%) minmax(0,62%)}
.has-viewer .demo-chat{grid-column:1;grid-row:1;min-width:0;padding:28px}
.has-viewer .demo-rail,.has-viewer .demo-artifact-chip{display:none}
.demo-transcript{gap:14px}
.demo-user{max-width:100%}

.demo-result p{margin:7px 0}
.demo-result h4{font-size:var(--text-small)}
.demo-artifact-viewer .demo-av-head{min-height:56px}
.demo-html-preview{padding:14px 12px}
.demo-md-preview{box-shadow:none}
.demo-incident-head{flex-wrap:wrap}
.demo-incident-sub,.demo-incident-metric span,.demo-metric span{line-height:1.4}
.demo-metric{padding:9px 7px}
.demo-metric b{font-size:var(--text-body)}
.demo-timeline-row{grid-template-columns:35px minmax(0,1fr);gap:7px;line-height:1.45}
.demo-md-callout{padding:10px;line-height:1.45}
.demo-diff-line{overflow-x:auto;text-overflow:clip}
.demo-html-note{line-height:1.45}
.demo-artifact,.demo-artifact>span:last-child{min-width:0}
.demo-approval-head{line-height:1.4}
.demo-approval-actions{margin-top:8px}
.comp-send{font-size:var(--text-small)}
@media(max-width:720px){
 .demo-workspace,.has-viewer .demo-workspace{grid-template-columns:1fr;min-height:0}
 .has-viewer .demo-chat{grid-column:1;grid-row:1}
 .demo-artifact-viewer{grid-column:1;grid-row:2;border-left:0;border-top:1px solid var(--ow-line)}
 .demo-rail{display:none}
}
@media(prefers-reduced-motion:reduce){
 .slide.is-active .demo-user,.slide.is-active .demo-connector-message,
 .slide.is-active .demo-stepgroup,.slide.is-active .demo-assistant,
 .slide.is-active .demo-inline-result,.slide.is-active .demo-artifact-chip,
 .slide.is-active .demo-rail,.slide.is-active .demo-approval,
 .slide.is-active .demo-artifact-viewer{animation:none}
}

@media(max-width:720px){.demo-chat,.has-viewer .demo-chat{padding:22px}}

/* Quiet demo typography: reserve medium weight for headings and actions. */
.appwin b,.appwin strong{font-weight:400}
.appwin .demo-result h4,.appwin .demo-html-preview h3,
.appwin .demo-md-preview h3,.appwin .demo-md-preview h4{font-weight:500}
.appwin .demo-assistant strong,.appwin .demo-av-title,
.appwin .demo-artifact-chip b,.appwin .chip-open,.appwin .demo-rail-head,
.appwin .demo-artifact b,.appwin .demo-access b,.appwin .demo-chart-delta,
.appwin .demo-timeline-row time,.appwin .demo-timeline-row b{font-weight:400}
.appwin .demo-report-status,.appwin .demo-incident-status{font-weight:400;text-transform:none;letter-spacing:0}
.appwin .demo-approval-head b,.appwin .demo-approve{font-weight:500}

/* Make the channel readable and keep incidental metadata on its own line. */
.demo-connector-head{display:grid;grid-template-columns:17px minmax(0,1fr);gap:4px 8px;white-space:normal}
.demo-connector-head b{overflow:visible;text-overflow:clip;overflow-wrap:anywhere;line-height:1.4}
.demo-connector-meta{grid-column:2;display:flex;align-items:center;gap:12px;flex-wrap:wrap}
.demo-connector-meta time{margin-left:0;color:var(--ow-muted)}
.demo-connector-meta span{color:var(--ow-muted)}

/* One shared inset and column grid for every SDK feature. */
.sdk-story-stage{--sdk-column-gap:64px;padding-inline:24px}
.sdk-story-stage .pill-heading{max-width:none;padding-inline:0}
/* SDK illustrations and code views. No window chrome around agent conversations. */
.integration-options{position:relative;display:grid;grid-template-columns:1fr 1fr;gap:96px;width:calc(100% + 48px);margin-inline:-24px;padding:24px;background:#f8f9fb;border-radius:14px}.integration-card{min-width:0}.integration-title{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:20px;font-weight:400;color:#526071}.show-code{display:flex;align-items:center;justify-content:center;gap:5px;background:none;border:0;color:#3863aa;font-size:var(--text-small);font-weight:400;line-height:1.5;padding:0;white-space:nowrap}.show-code svg{width:14px;height:14px}.show-code:hover{color:#174b9d}.integration-visual{height:270px;padding:24px;display:flex;flex-direction:column;justify-content:center;align-items:center;background:transparent;border-radius:12px}.app-boundary{padding:15px 12px;border:1px solid #d5dce8;border-radius:11px;background:#fff;width:100%}.app-boundary-title{font-size:var(--text-small);font-weight:550;color:#4b5769;margin-bottom:16px}.interface-node{padding:9px 6px;background:#f3f5f8;border-radius:7px;text-align:center;font-size:var(--text-small);line-height:1.5;color:#576577}.flow-arrow{height:23px;line-height:1;display:grid;place-items:center;font-size:var(--text-body);color:#9cacbf}.runtime-node{display:flex;align-items:center;gap:7px;padding:12px 9px;width:100%;border:1px solid #c8d8f5;border-radius:8px;background:#edf3ff;color:#31518b}.runtime-node img{width:22px;height:22px}.runtime-node>span{font-size:var(--text-small);font-weight:600}.runtime-node b{display:block;font-size:var(--text-small);font-weight:400;line-height:1.4;color:#6581b2;margin-top:3px}.integration-caption{margin-top:14px;text-align:center;color:#7b879b;font-size:var(--text-small);line-height:1.5}.integration-card>p{font-size:var(--text-body);line-height:1.65;color:#717b8b;margin:22px 0 0}.web-app-node,.backend-node{width:100%;padding:8px 6px;background:#fff;border:1px solid #d9e0e9;border-radius:8px;text-align:center;color:#536073;font-size:var(--text-small);line-height:1.4}.backend-node small{display:block;font-size:inherit;color:#8792a4;margin-top:3px}.service-connection{height:32px;display:flex;align-items:center;gap:7px;color:#9aa9bf}.service-connection small{font-size:var(--text-small)}.service-runtime{justify-content:center;padding:11px 9px}
.sdk-code{background:#f5f7fa;border:1px solid #e1e6ed;border-radius:11px;overflow:hidden;min-width:0}.code-toolbar{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid #e4e8ee}.code-toolbar [role=tablist]{display:flex;gap:12px}.code-toolbar button{border:0;background:none;padding:5px 0;color:#728096;font-size:var(--text-small);font-weight:400}.code-toolbar [aria-selected=true]{color:#345c9e;font-weight:550}.sdk-code pre{margin:0;padding:18px 14px;overflow:auto;max-height:340px;white-space:pre-wrap;overflow-wrap:anywhere;tab-size:2;font-family:var(--mono);font-size:var(--text-small);line-height:1.65;color:#3c506b}.token-string{color:#39776d}.token-keyword{color:#8255a2}.token-comment{color:#7c8798}.code-note{font-size:var(--text-small);line-height:1.5;color:#667085;padding:0 14px 14px;margin:0}.copy-status{font-size:var(--text-small);padding:0 14px;color:#607e69}.copy-status:empty{display:none}.integration-card .sdk-code{height:270px;display:flex;flex-direction:column}.integration-card .sdk-code pre{flex:1;min-height:0}.integration-card .code-note{max-height:92px;overflow:auto;flex-shrink:0}.integration-card .code-toolbar{flex-shrink:0}.integration-card .copy-status:not(:empty){padding-bottom:8px}
.explanation-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:24px;color:#677486;font-size:var(--text-body)}.provider-gallery{display:flex;flex-wrap:wrap;justify-content:center;gap:26px 27px;max-width:780px;margin-inline:auto;padding:10px 0 32px}.provider-logo{width:118px;min-height:91px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:15px}.provider-logo img{width:34px;height:34px;object-fit:contain}.provider-logo>span{font-size:var(--text-small);font-weight:500;color:#4e5c70}.model-compatibility{text-align:center;font-size:var(--text-small);line-height:1.8;margin:18px 0 0;color:#7c889a}
@media(max-width:1000px){.sdk-story-stage{--sdk-column-gap:38px}}
@media(max-width:720px){.integration-options{grid-template-columns:1fr;gap:32px}.provider-logo{width:95px}.integration-visual{height:285px}}

.homepage .experience-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);column-gap:var(--sdk-column-gap);align-items:start;width:100%;margin:0 auto}
.homepage .focused-scene .experience-grid,.homepage .focused-scene .experience-grid *{font-size:var(--type-body)}
.homepage .focused-scene svg{height:18px;width:18px;stroke-width:1.6}
.demo-column-label{min-height:27px;display:flex;align-items:center;justify-content:space-between;gap:12px;color:#526071;font-weight:500;margin:0 0 24px;line-height:1.5}
.demo-column-label .show-code{color:#3863aa;font-weight:400;gap:6px;padding:0}
.conversation-demo{padding:0}
.user-turn{margin:0 0 28px auto;max-width:92%;text-align:right}
.user-turn>span{display:block;color:#667085;margin-bottom:8px;line-height:1.5;font-weight:500}
.user-turn p{margin:0;color:#252f3d;line-height:1.55;font-weight:400}
.agent-sender{display:flex;align-items:center;gap:10px;margin-bottom:14px;color:#344054}
.agent-sender>span{width:28px;height:28px;display:grid;place-items:center;background:#edf2fa;border-radius:8px;color:#5d7ca9;flex-shrink:0}
.agent-sender strong{font-weight:550;line-height:1.5}
.agent-turn-content{margin-left:38px}
.tool-activity{margin:0;padding:0;list-style:none;display:grid;gap:4px}
.tool-row{display:flex;align-items:center;gap:9px;min-height:44px;padding:10px 0;color:#344054;line-height:1.5}
.tool-row svg{color:#6b8d7e;flex-shrink:0}
.tool-row>span{flex:1;min-width:0}
.tool-row.blocked{background:#fbf0eb;border-radius:8px;color:#8f513a;padding:10px;margin-inline:-10px;flex-wrap:wrap}
.tool-row.blocked svg{color:#9e644e}
.tool-row.blocked strong{font-weight:500;margin-left:27px;display:block;flex-basis:100%}
.tool-row.redacted{color:#426b98}
.tool-row.redacted svg{color:#5b82ad}
.agent-reply{margin:20px 0 0;color:#526071;line-height:1.6;font-weight:400}
.explanation-demo{min-width:0}
.explanation-canvas{background:#f7f8fa;border-radius:12px;padding:24px;color:#344054}
.explanation-canvas[hidden]{display:none}
.explanation-canvas strong{font-weight:550}
.explanation-canvas p{margin:0;line-height:1.55;color:#667085}
.decision-brief{display:grid;gap:18px}
.decision-brief>div{display:grid;grid-template-columns:1fr 1.35fr;gap:16px;align-items:start;line-height:1.5}
.decision-brief>div>span{color:#667085}
.decision-brief strong{color:#344054}
.scene-flow{text-align:center;color:#98a6b9;line-height:1;padding:16px 0}
.review-rule{display:flex;align-items:flex-start;gap:10px;padding:17px;background:#edf2fb;border-radius:8px;color:#36547e}
.review-rule svg{margin-top:3px;color:#6583ad}
.review-rule strong{display:block;margin-bottom:6px}
.scene-result{display:flex;align-items:flex-start;gap:10px;padding:17px;border-radius:8px;background:#fbf0eb;color:#8f513a}
.scene-result svg{margin-top:3px;color:#9e644e}
.scene-result strong{display:block;margin-bottom:6px}
.scene-result p{color:#835f50}
.workspace-zone{padding:20px;border:1px solid #ccd8ec;background:#edf2fb;border-radius:10px}
.workspace-label{display:flex;align-items:center;gap:9px;color:#36547e;margin-bottom:12px;line-height:1.5}
.workspace-label svg{color:#6583ad}
.workspace-zone>p{margin-bottom:18px}
.workspace-access{display:flex;align-items:center;gap:10px;padding:10px 0;line-height:1.5;color:#3d536e}
.workspace-access>svg:first-child{color:#6a83a5}
.workspace-access>svg:last-child{margin-left:auto;color:#648879}
.sandbox-crossing{display:flex;align-items:center;justify-content:center;gap:8px;color:#956044;padding:22px 0}
.sandbox-crossing>span{height:1px;width:24px;background:#d9c5b9}
.sandbox-crossing strong{font-weight:500}
.host-resource{display:flex;gap:10px;align-items:flex-start;color:#7c5c4b;flex-wrap:wrap}
.host-resource>svg{margin-top:3px;color:#9d7c67}
.host-resource strong{font-weight:500;line-height:1.5}
.host-resource code{display:block;line-height:1.6;color:#7d6b60;margin-top:4px;overflow-wrap:anywhere}
.host-resource>span{flex-basis:100%;margin-left:28px;color:#7e8896;line-height:1.5}
.payload-stage>strong{display:block;line-height:1.5;color:#344054;margin-bottom:13px}
.payload-stage code{display:block;border:1px solid #e0e5ec;border-radius:8px;padding:16px;background:#fff;line-height:1.85;color:#44546b;white-space:normal;overflow-wrap:anywhere}
.payload-stage mark{background:#f7e2d5;color:#955e3b;border-radius:3px;padding:2px 3px}
.redaction-transform{display:flex;justify-content:center;align-items:center;gap:8px;padding:22px 0;color:#526f95}
.redaction-transform>span{width:16px;height:1px;background:#c7d3e4}
.redaction-transform>strong{font-weight:500}
.sanitized code{background:#f2f6fb;border-color:#d1deef}
.sanitized mark{background:#dfeaf8;color:#476f9d}
.scene-caption-line{margin:18px 0 0!important;color:#667085!important}
.homepage .focused-scene .sdk-code pre{line-height:1.6;max-height:340px}
.homepage .focused-scene .code-note{color:#667085;line-height:1.5}
.homepage .focused-scene .code-toolbar button{font-weight:400}
.homepage .focused-scene .code-toolbar [aria-selected=true]{font-weight:550}
@media(max-width:1000px){.homepage .experience-grid{column-gap:var(--sdk-column-gap)}.explanation-canvas{padding:20px}.conversation-demo{padding-inline:0}.agent-turn-content{margin-left:32px}.decision-brief>div{grid-template-columns:1fr;gap:4px}}
@media(max-width:720px){.homepage .experience-grid{grid-template-columns:1fr;gap:32px}.homepage .pill-heading h3{font-size:var(--type-body)}.user-turn{max-width:85%}.decision-brief>div{grid-template-columns:1fr 1.3fr;gap:12px}}
@media(min-width:721px){.tool-row.blocked{flex-wrap:nowrap}.tool-row.blocked strong{flex-basis:auto;margin-left:auto;white-space:nowrap}}

@media(min-width:721px){.tool-row.blocked{flex-wrap:nowrap}.tool-row.blocked strong{flex-basis:auto;margin-left:auto;white-space:nowrap}}

@media(max-width:720px){.sdk-story-stage{--sdk-column-gap:32px;padding-inline:16px}.sdk-story-stage .pill-heading{padding-inline:0}}

@media(max-width:720px){.integration-options{width:calc(100% + 32px);margin-inline:-16px;padding:20px 16px}}

/* A short divider separates the two deployment choices without enclosing them. */
.integration-options:after{content:"";position:absolute;left:50%;top:72px;bottom:72px;width:1px;background:#e1e5eb;pointer-events:none}
@media(min-width:721px) and (max-width:1000px){.integration-options{gap:64px}}
@media(max-width:720px){.integration-options{gap:32px}.integration-options:after{display:none}}

/* Approved standalone deployment illustration, scoped to Build apps. */
#feature-panel-intro .canvas{height:388px;position:relative;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-top:40px}
#feature-panel-intro .app{width:100%;background:#fff;border:1px solid #dfe3ea;border-radius:16px;box-shadow:0 8px 28px #1f2c4710;overflow:hidden}
#feature-panel-intro .app-head{padding:18px 22px;display:flex;align-items:center;gap:10px;border-bottom:1px solid #eceef2}
#feature-panel-intro .app-icon{width:20px;height:20px;stroke:#6b7789;stroke-width:1.5;fill:none}
#feature-panel-intro .app-main{padding:24px 22px;display:flex;align-items:center;justify-content:space-between;gap:18px}
#feature-panel-intro .app-main span{color:#667085;font-size:14px}
#feature-panel-intro .ui-sketch{width:118px;height:52px;display:grid;grid-template-columns:25px 1fr;gap:7px}
#feature-panel-intro .ui-sketch i{border-radius:4px;background:#f0f2f6}
#feature-panel-intro .ui-sketch i:first-child{grid-row:span 2}
#feature-panel-intro .ui-sketch i:last-child{background:#e6edfb}
#feature-panel-intro .runtime{margin:0 12px 12px;border-radius:10px;background:#edf3ff;padding:20px 16px;display:flex;align-items:center;gap:12px;color:#2455b4}
#feature-panel-intro .star{width:27px;height:27px;flex:none;color:#2563eb}
#feature-panel-intro .runtime strong,#feature-panel-intro .service strong{font-size:16px;font-weight:500;display:block}
#feature-panel-intro .runtime span,#feature-panel-intro .service span{font-size:14px;color:#5c739b;display:block;margin-top:2px}
#feature-panel-intro .bundle-label{font-size:14px;color:#667085;margin-top:18px;display:flex;gap:8px;align-items:center}
#feature-panel-intro .bundle-label svg{width:16px;height:16px;stroke:#8490a2;fill:none;stroke-width:1.5}
#feature-panel-intro .sdk-tag{background:#f1f4f8;padding:4px 10px;border-radius:5px;color:#526071!important}
#feature-panel-intro .connection{height:68px;display:grid;grid-template-columns:1fr 24px 1fr;align-items:center;gap:12px;width:100%}
#feature-panel-intro .connection svg{grid-column:2;height:68px;width:24px;stroke:#7c9acd;stroke-width:1.5;fill:none}
#feature-panel-intro .connection span{font-size:14px;color:#667085;grid-column:3}
#feature-panel-intro .service-zone{width:100%;padding:16px;background:#f6f8fc;border:1px dashed #ccd6e5;border-radius:14px}
#feature-panel-intro .service{display:flex;gap:12px;align-items:center;padding:10px 8px;color:#2455b4}
#feature-panel-intro .canvas{height:388px;padding-top:32px;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:300px 38px;align-content:start;justify-items:stretch;align-items:stretch}
#feature-panel-intro #local-diagram .app{height:300px;display:flex;flex-direction:column}
#feature-panel-intro #local-diagram .app-main{flex:1}
#feature-panel-intro #local-diagram .bundle-label{justify-content:center;align-self:end;margin-top:0}
#feature-panel-intro #service-diagram{grid-template-rows:112px 76px 112px 38px}
#feature-panel-intro .remote-row{display:grid;grid-template-columns:1fr 40px 1fr;align-items:stretch;width:100%}
#feature-panel-intro .remote-box{border:1px solid #dfe3ea;border-radius:12px;background:#fff;box-shadow:0 4px 16px #1f2c4708;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:12px}
#feature-panel-intro .between-apps{width:28px;height:24px;fill:none;stroke:#8798ae;stroke-width:1.4;align-self:center;justify-self:center}
#feature-panel-intro .connection{height:76px;grid-template-columns:1fr 40px 1fr;gap:0}
#feature-panel-intro .connection svg{grid-column:3;justify-self:center;height:76px}
#feature-panel-intro .connection span{grid-column:1 / 3;grid-row:1;text-align:right;padding-right:4px}
#feature-panel-intro .service-zone{height:112px;display:flex;align-items:center;padding:16px}
#feature-panel-intro .service-caption{margin:0;justify-content:center;align-self:end;font-size:14px;white-space:nowrap}
#feature-panel-intro .sdk-tag{font-size:14px;line-height:1.5;font-weight:400}
#feature-panel-intro .service-zone{position:relative;align-items:flex-start}
#feature-panel-intro .service-zone .service{padding:0 8px}
#feature-panel-intro .platform-logos{position:absolute;right:16px;bottom:12px;display:flex;align-items:center;gap:12px}
#feature-panel-intro .platform-logos img{width:23px;height:23px;object-fit:contain}
#feature-panel-intro .platform-logos img:first-child{margin-right:4px}
#feature-panel-intro .integration-card .sdk-code{height:388px}
#feature-panel-intro .bundle-label svg{flex-shrink:0}
@media(max-width:720px){#feature-panel-intro .service-caption{white-space:normal;text-align:center}}

/* Approved standalone action review. */
#feature-panel-review .columns{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:120px}
#feature-panel-review section{min-width:0}
#feature-panel-review h2{font-size:16px;font-weight:600;margin:0}
#feature-panel-review .column-title{height:32px;display:flex;align-items:center;justify-content:space-between;margin-bottom:32px}
#feature-panel-review button{font:inherit;cursor:pointer}
#feature-panel-review svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#feature-panel-review .icon{width:18px;height:18px}
#feature-panel-review .code-toggle{border:0;background:none;color:#3562ac;display:flex;gap:6px;align-items:center;padding:6px 0;font-size:14px}
#feature-panel-review .conversation{padding-top:0}
#feature-panel-review .user{max-width:88%;margin:0 0 34px auto}
#feature-panel-review .sender{display:flex;align-items:center;gap:10px;margin:0 0 12px;font-weight:500}
#feature-panel-review .sender small{font-size:14px;font-weight:400;color:#667085}
#feature-panel-review .user .sender{justify-content:flex-end;font-size:14px;color:#667085}
#feature-panel-review .bubble{padding:16px 18px;border-radius:14px 14px 4px 14px;background:#f3f5f8;color:#344054}
#feature-panel-review .avatar{width:30px;height:30px;display:grid;place-items:center;border-radius:9px;background:#edf3ff;color:#4e74b2}
#feature-panel-review .activity{margin-left:40px;padding:18px;background:#f5f7fa;border-radius:4px 14px 14px 14px}
#feature-panel-review .agent-line{margin:0 0 18px;color:#526071}
#feature-panel-review .tools{list-style:none;margin:0;padding:0;display:grid;gap:8px}
#feature-panel-review .tool{width:100%;padding:12px;border:1px solid transparent;border-radius:9px;display:flex;align-items:center;gap:10px;background:none;color:#344054;text-align:left}
#feature-panel-review .tool:hover{background:#f6f8fb}
#feature-panel-review .tool .icon{color:#598372}
#feature-panel-review .tool .status{margin-left:auto;font-size:14px;color:#667085}
#feature-panel-review .tool[aria-pressed=true]{border-color:#e1e5ec;background:#f8f9fb}
#feature-panel-review .tool[data-action=restart] .icon,#feature-panel-review .tool[data-action=restart] .status{color:#a45c3b}
#feature-panel-review .tool[data-action=restart][aria-pressed=true]{background:#fcf2ec;border-color:#f3dfd2}
#feature-panel-review .reply{margin:24px 0 0;color:#526071}
#feature-panel-review .review{position:relative}
#feature-panel-review .review-card{border:1px solid #dce4f0;border-radius:14px;background:#fafbfe;overflow:hidden}
#feature-panel-review .review-head{padding:18px 20px;display:flex;align-items:center;gap:10px;color:#2a579f;border-bottom:1px solid #e4eaf3;background:#f0f5ff}
#feature-panel-review .review-head .avatar{background:white}
#feature-panel-review .review-head span{font-weight:500}
#feature-panel-review .review-head small{font-size:14px;color:#667b9e;display:block;font-weight:400;margin-top:2px}
#feature-panel-review .comparison{display:grid;grid-template-columns:1fr 1fr;gap:24px;padding:24px 20px}
#feature-panel-review .comparison small{display:block;font-size:14px;color:#667085;margin-bottom:10px}
#feature-panel-review .comparison p{margin:0 0 14px;min-height:48px;color:#344054}
#feature-panel-review .scope{display:inline-flex;align-items:center;gap:6px;background:#eaf1fe;color:#355d9d;padding:4px 9px;border-radius:6px;font-size:14px}
#feature-panel-review .scope.production{background:#faeee5;color:#985333}
#feature-panel-review .question{padding:0 20px 20px;color:#526071;font-size:14px}
#feature-panel-review .connector{height:38px;display:flex;justify-content:center;align-items:center;color:#9aa9bd}
#feature-panel-review .connector svg{width:20px;height:30px}
#feature-panel-review .decision{border:1px solid #eedbcf;border-radius:12px;padding:18px 20px;background:#fcf4ef;display:flex;align-items:flex-start;gap:12px;color:#975536}
#feature-panel-review .decision>.icon{margin-top:3px}
#feature-panel-review .decision strong{font-weight:500}
#feature-panel-review .decision p{color:#795e50;margin:6px 0 0;font-size:14px;line-height:1.6}
#feature-panel-review .decision.allowed{background:#f0f7f2;border-color:#d7e7dc;color:#426b53}
#feature-panel-review .decision.allowed p{color:#586e5e}
#feature-panel-review .explanation{margin:20px 0 0;color:#667085;font-size:14px;line-height:1.6}
#feature-panel-review .review[hidden]{display:none}
#feature-panel-review button:focus-visible{outline:2px solid #8db0ff;outline-offset:3px}
#feature-panel-review .note{margin:36px 0 0;font-size:14px;color:#667085}
@media(max-width:760px){#feature-panel-review .columns{grid-template-columns:1fr;gap:40px}
#feature-panel-review .comparison{gap:16px}
#feature-panel-review .activity{margin-left:0}
}
#feature-panel-review .review-link{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;overflow:visible;color:#8ba4c8;z-index:1}
#feature-panel-review .review-link path{stroke-width:1.5;fill:none}
#feature-panel-review .review-link circle{fill:currentColor;stroke:none}
@media(max-width:760px){#feature-panel-review .review-link{display:none}
#feature-panel-review .activity{margin-left:0}
#feature-panel-review .column-title{height:auto;gap:16px}
}
#feature-panel-review .sender .avatar{background:none;color:#667b9e}
#feature-panel-review .user .sender{gap:8px}
#feature-panel-review .user .sender .icon{width:18px;height:18px}
#feature-panel-review .comparison p{min-height:0;margin-bottom:0}

/* Match Build apps' outer surface while preserving the shared content edges. */
#feature-panel-review .columns{width:calc(100% + 48px);margin-inline:-24px;padding:24px;background:#f8f9fb;border-radius:14px}
#feature-panel-review .activity{background:#fff}
#feature-panel-review .bubble{background:#edf1f7}
@media(max-width:720px){#feature-panel-review .columns{width:calc(100% + 32px);margin-inline:-16px;padding:20px 16px}}

/* Approved standalone sandbox design. */
#feature-panel-sandbox h2{font-size:16px;font-weight:400;color:#526071;margin:0}
#feature-panel-sandbox button{font:inherit;cursor:pointer}
#feature-panel-sandbox svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#feature-panel-sandbox .icon{width:18px;height:18px}
#feature-panel-sandbox .surface{padding:24px;background:#f8f9fb;border-radius:14px}
#feature-panel-sandbox .columns{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:108px}
#feature-panel-sandbox .columns>section{min-width:0}
#feature-panel-sandbox .column-title{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:32px;margin-bottom:30px}
#feature-panel-sandbox .code-toggle{display:flex;align-items:center;gap:6px;border:0;background:none;padding:4px 0;font-size:14px;color:#3562ac;white-space:nowrap}
#feature-panel-sandbox .code-toggle svg{width:16px;height:16px}
#feature-panel-sandbox .sender{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:14px;font-weight:400;color:#667085}
#feature-panel-sandbox .sender .icon{color:#78879b}
#feature-panel-sandbox .user{max-width:92%;margin:0 0 30px auto}
#feature-panel-sandbox .user .sender{justify-content:flex-end;font-size:14px;font-weight:400;color:#667085;gap:8px}
#feature-panel-sandbox .user-bubble{padding:16px 18px;background:#edf1f7;border-radius:14px 14px 4px 14px;color:#344054}
#feature-panel-sandbox .agent-bubble{margin-left:28px;background:#fff;border-radius:4px 14px 14px 14px;padding:18px}
#feature-panel-sandbox .agent-bubble>p{margin:0 0 20px;color:#526071}
#feature-panel-sandbox .agent-bubble>p.reply{margin:22px 0 0}
#feature-panel-sandbox .tools{display:grid;gap:8px;margin:0;padding:0;list-style:none}
#feature-panel-sandbox .tool{display:flex;align-items:center;gap:9px;width:100%;padding:12px 8px;border:1px solid transparent;background:none;text-align:left;border-radius:8px;color:#344054;font-size:16px;line-height:1.5}
#feature-panel-sandbox .tool .icon{color:#5b826d;width:16px;height:16px}
#feature-panel-sandbox .tool .status{margin-left:auto;font-size:14px;color:#667085}
#feature-panel-sandbox .tool:hover{background:#f6f8fb}
#feature-panel-sandbox .tool[aria-pressed=true]{border-color:#dce4ed;background:#f5f8fc}
#feature-panel-sandbox .tool.blocked .icon,#feature-panel-sandbox .tool.blocked .status{color:#a05b3d}
#feature-panel-sandbox .tool.blocked[aria-pressed=true]{background:#fcf2ec;border-color:#f0ddd2}
#feature-panel-sandbox .link{position:absolute;inset:0;width:100%;height:100%;color:#8ba4c8;pointer-events:none;overflow:visible;z-index:1}
#feature-panel-sandbox .link path{stroke-width:1.5;fill:none}
#feature-panel-sandbox .link circle{fill:currentColor;stroke:none}
#feature-panel-sandbox .diagram[hidden]{display:none}
#feature-panel-sandbox .note{font-size:14px;color:#667085;margin:24px 0 0;line-height:1.6}
#feature-panel-sandbox .down{height:28px;display:flex;align-items:center;justify-content:center;color:#9aa9bd}
#feature-panel-sandbox .down svg{width:18px;height:24px}
#feature-panel-sandbox .result{padding:16px 18px;border-radius:10px;border:1px solid #eedbd0;background:#fcf3ed;color:#945239;display:flex;gap:10px;align-items:flex-start}
#feature-panel-sandbox .result strong{font-weight:500}
#feature-panel-sandbox .result p{font-size:14px;line-height:1.6;margin:6px 0 0;color:#795f52}
#feature-panel-sandbox .result .icon{margin-top:3px}
#feature-panel-sandbox .result.allowed{background:#f1f7f2;border-color:#d7e6dc;color:#416b53}
#feature-panel-sandbox .result.allowed p{color:#586d5d}
#feature-panel-sandbox button:focus-visible,#feature-panel-sandbox summary:focus-visible{outline:2px solid #8db0ff;outline-offset:3px}
#feature-panel-sandbox code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px}
@media(max-width:800px){#feature-panel-sandbox .surface{padding:20px}
#feature-panel-sandbox .columns{grid-template-columns:1fr;gap:36px}
#feature-panel-sandbox .link{display:none}
#feature-panel-sandbox .agent-bubble{margin-left:28px}
#feature-panel-sandbox .column-title{gap:12px}
}
#feature-panel-sandbox .sandbox{border:1px solid #c6d6ef;border-radius:14px;background:#f0f5ff;padding:18px}
#feature-panel-sandbox .sandbox-title{display:flex;align-items:center;gap:10px;color:#315d9f;font-weight:500;margin-bottom:20px}
#feature-panel-sandbox .process{display:flex;align-items:center;gap:10px;background:#fff;padding:14px;border:1px solid #dce5f1;border-radius:9px;color:#344054}
#feature-panel-sandbox .process code{display:block;color:#697a93;margin-top:4px;font-size:14px;overflow-wrap:anywhere}
#feature-panel-sandbox .access-label{font-size:14px;color:#697a93;margin:22px 0 10px}
#feature-panel-sandbox .resources{display:grid;gap:10px}
#feature-panel-sandbox .resource{display:flex;align-items:center;gap:9px;padding:10px 8px;border-radius:8px;border:1px solid transparent;color:#42546d}
#feature-panel-sandbox .resource>svg:last-child{margin-left:auto;color:#62816c;width:16px;height:16px}
#feature-panel-sandbox .resource code{display:block;font-size:14px;color:#748299;overflow-wrap:anywhere}
#feature-panel-sandbox .resource.selected{background:#fff;border-color:#cbdcf3}
#feature-panel-sandbox .boundary-crossing{height:36px;display:flex;flex-direction:column;align-items:center;color:#af7659;gap:3px}
#feature-panel-sandbox .boundary-crossing span{height:6px;border-left:1px dashed #cba88f}
#feature-panel-sandbox .boundary-crossing svg{width:16px;height:16px}
#feature-panel-sandbox .host-resource{padding:12px 8px;display:flex;align-items:center;gap:10px;color:#7d6454}
#feature-panel-sandbox .host-resource code{display:block;margin-top:3px;font-size:14px;color:#8b7b70;overflow-wrap:anywhere}
#feature-panel-sandbox .host-resource>span{margin-left:auto;font-size:14px;text-align:right;color:#8b7b70;max-width:60px}
#feature-panel-sandbox .result{margin-top:16px}
#feature-panel-sandbox .host-resource.muted,#feature-panel-sandbox .boundary-crossing.muted{opacity:.55}

#feature-panel-sandbox .surface{width:calc(100% + 48px);margin-inline:-24px}
@media(max-width:800px){#feature-panel-sandbox .surface{width:calc(100% + 32px);margin-inline:-16px;padding:20px 16px}}

/* Approved standalone guardrails design. */
#feature-panel-guardrails h2{font-size:16px;font-weight:400;color:#526071;margin:0}
#feature-panel-guardrails button{font:inherit;cursor:pointer}
#feature-panel-guardrails svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
#feature-panel-guardrails .icon{width:18px;height:18px}
#feature-panel-guardrails .surface{padding:24px;background:#f8f9fb;border-radius:14px}
#feature-panel-guardrails .columns{position:relative;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:108px}
#feature-panel-guardrails .columns>section{min-width:0}
#feature-panel-guardrails .column-title{display:flex;align-items:center;justify-content:space-between;gap:16px;min-height:32px;margin-bottom:30px}
#feature-panel-guardrails .code-toggle{display:flex;align-items:center;gap:6px;border:0;background:none;padding:4px 0;font-size:14px;color:#3562ac;white-space:nowrap}
#feature-panel-guardrails .code-toggle svg{width:16px;height:16px}
#feature-panel-guardrails .sender{display:flex;align-items:center;gap:8px;margin:0 0 12px;font-size:14px;font-weight:400;color:#667085}
#feature-panel-guardrails .sender .icon{color:#78879b}
#feature-panel-guardrails .user{max-width:92%;margin:0 0 30px auto}
#feature-panel-guardrails .user .sender{justify-content:flex-end;font-size:14px;font-weight:400;color:#667085;gap:8px}
#feature-panel-guardrails .user-bubble{padding:16px 18px;background:#edf1f7;border-radius:14px 14px 4px 14px;color:#344054}
#feature-panel-guardrails .agent-bubble{margin-left:28px;background:#fff;border-radius:4px 14px 14px 14px;padding:18px}
#feature-panel-guardrails .agent-bubble>p{margin:0 0 20px;color:#526071}
#feature-panel-guardrails .agent-bubble>p.reply{margin:22px 0 0}
#feature-panel-guardrails .tools{display:grid;gap:8px;margin:0;padding:0;list-style:none}
#feature-panel-guardrails .tool{display:flex;align-items:center;gap:9px;width:100%;padding:12px 8px;border:1px solid transparent;background:none;text-align:left;border-radius:8px;color:#344054;font-size:16px;line-height:1.5}
#feature-panel-guardrails .tool .icon{color:#5b826d;width:16px;height:16px}
#feature-panel-guardrails .tool .status{margin-left:auto;font-size:14px;color:#667085}
#feature-panel-guardrails .tool:hover{background:#f6f8fb}
#feature-panel-guardrails .tool[aria-pressed=true]{border-color:#dce4ed;background:#f5f8fc}
#feature-panel-guardrails .tool.blocked .icon,#feature-panel-guardrails .tool.blocked .status{color:#a05b3d}
#feature-panel-guardrails .tool.blocked[aria-pressed=true]{background:#fcf2ec;border-color:#f0ddd2}
#feature-panel-guardrails .link{position:absolute;inset:0;width:100%;height:100%;color:#8ba4c8;pointer-events:none;overflow:visible;z-index:1}
#feature-panel-guardrails .link path{stroke-width:1.5;fill:none}
#feature-panel-guardrails .link circle{fill:currentColor;stroke:none}
#feature-panel-guardrails .diagram[hidden]{display:none}
#feature-panel-guardrails .note{font-size:14px;color:#667085;margin:24px 0 0;line-height:1.6}
#feature-panel-guardrails .down{height:28px;display:flex;align-items:center;justify-content:center;color:#9aa9bd}
#feature-panel-guardrails .down svg{width:18px;height:24px}
#feature-panel-guardrails .result{padding:16px 18px;border-radius:10px;border:1px solid #eedbd0;background:#fcf3ed;color:#945239;display:flex;gap:10px;align-items:flex-start}
#feature-panel-guardrails .result strong{font-weight:500}
#feature-panel-guardrails .result p{font-size:14px;line-height:1.6;margin:6px 0 0;color:#795f52}
#feature-panel-guardrails .result .icon{margin-top:3px}
#feature-panel-guardrails .result.allowed{background:#f1f7f2;border-color:#d7e6dc;color:#416b53}
#feature-panel-guardrails .result.allowed p{color:#586d5d}
#feature-panel-guardrails button:focus-visible,#feature-panel-guardrails summary:focus-visible{outline:2px solid #8db0ff;outline-offset:3px}
#feature-panel-guardrails code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:14px}
@media(max-width:800px){#feature-panel-guardrails .surface{padding:20px}
#feature-panel-guardrails .columns{grid-template-columns:1fr;gap:36px}
#feature-panel-guardrails .link{display:none}
#feature-panel-guardrails .agent-bubble{margin-left:28px}
#feature-panel-guardrails .column-title{gap:12px}
}
#feature-panel-guardrails .filter-event{padding:10px 8px;display:flex;align-items:center;gap:9px;color:#526f9a;font-size:14px;flex-wrap:wrap}
#feature-panel-guardrails .filter-event .icon{width:16px;height:16px}
#feature-panel-guardrails .filter-event>span:last-child{margin-left:auto;font-size:14px;color:#667085}
#feature-panel-guardrails .payload{border:1px solid #e0e5ec;border-radius:12px;background:white;overflow:hidden}
#feature-panel-guardrails .payload-label{display:flex;align-items:center;gap:9px;padding:12px 16px;color:#526071;font-size:14px;border-bottom:1px solid #edf0f4}
#feature-panel-guardrails .payload-label code{margin-left:auto;color:#8490a2;font-size:14px}
#feature-panel-guardrails .payload pre{padding:16px;margin:0;font:14px/1.7 ui-monospace,SFMono-Regular,Consolas,monospace;color:#526071;white-space:pre-wrap;overflow-wrap:anywhere}
#feature-panel-guardrails .payload mark{background:#fae8de;color:#98583b;border-radius:3px;padding:1px 3px}
#feature-panel-guardrails .clean mark{background:#e8f0ff;color:#3665a5}
#feature-panel-guardrails .clean{border-color:#d0def1}
#feature-panel-guardrails .filter-node{padding:16px;border:1px solid #d2dff4;border-radius:10px;background:#edf3ff}
#feature-panel-guardrails .filter-title{display:flex;align-items:center;gap:9px;color:#315e9e;font-weight:500}
#feature-panel-guardrails .count{font-size:14px;font-weight:400;margin-left:auto;color:#6580a8}
#feature-panel-guardrails .rule-summary{font-size:14px;color:#536b90;margin:10px 0}
#feature-panel-guardrails .filter-node details{font-size:14px;color:#5675a1}
#feature-panel-guardrails .filter-node summary{cursor:pointer;width:max-content}
#feature-panel-guardrails .rule-details{display:grid;grid-template-columns:60px minmax(0,1fr);gap:8px 14px;padding-top:14px}
#feature-panel-guardrails .rule-details code{font-size:14px;overflow-wrap:anywhere}
#feature-panel-guardrails .outcome{margin:18px 0 0;font-size:14px;color:#667085;line-height:1.6}

#feature-panel-guardrails .surface{width:calc(100% + 48px);margin-inline:-24px}
@media(max-width:800px){#feature-panel-guardrails .surface{width:calc(100% + 32px);margin-inline:-16px;padding:20px 16px}}

#feature-panel-review .column-title h2{font-weight:400;color:#526071}
#feature-panel-review .sender{font-size:14px;font-weight:400;color:#667085}

/* Shared compact code controls across every SDK panel. */
#panel-sdk .show-code{font-size:14px;font-weight:400;line-height:1.5;gap:5px}
#panel-sdk .show-code span{font:inherit}
#panel-sdk .show-code svg{width:14px;height:14px;stroke-width:1.6}

#feature-panel-models .models-surface{width:calc(100% + 48px);margin-inline:-24px;padding:24px;background:#f8f9fb;border-radius:14px}
#feature-panel-models .explanation-toolbar{justify-content:flex-end}
@media(max-width:720px){#feature-panel-models .models-surface{width:calc(100% + 32px);margin-inline:-16px;padding:20px 16px}}

/* Keep cloud providers, model families and gateways/local runtimes in stable rows. */
#feature-panel-models .provider-gallery{display:flex;flex-direction:column;align-items:center;gap:26px}
#feature-panel-models .provider-row{display:flex;justify-content:center;flex-wrap:wrap;gap:26px 27px;width:100%}