:root{font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#161616;background:#fff;font-synthesis:none;--muted:#777;--line:#ebebeb;--accent:#477bf1}*{box-sizing:border-box}body{margin:0}a{color:inherit;text-decoration:none}button,input{font:inherit}button,summary{cursor:pointer}a,button,input,summary{outline-offset:5px}a:focus-visible,button:focus-visible,input:focus-visible,summary:focus-visible{outline:2px solid var(--accent)}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap}.skip{position:absolute;top:-100px;z-index:20}.skip:focus{top:10px;left:10px;background:white;padding:12px}.wrap{max-width:1440px;margin:auto;padding:0 32px}.brand{display:flex;align-items:center;gap:10px;font-size:25px;font-weight:750;letter-spacing:-1.3px}.brand svg{width:30px;height:30px;flex-shrink:0}.site-header{background:#f8f8f8;border-bottom:1px solid #f4f4f4}.header-inner{max-width:1440px;margin:auto;padding:17px 32px;display:flex;align-items:center;gap:30px;min-height:74px}.header-inner nav,.header-actions{display:flex;gap:24px;align-items:center;font-size:13px;white-space:nowrap}.header-actions{margin-left:auto;gap:18px}.button{display:inline-flex;align-items:center;justify-content:center;min-height:42px;border-radius:999px;background:#141414;color:white;padding:11px 23px;font-size:13px;font-weight:500;box-shadow:0 2px 3px #0000000e}.button:hover{background:#333}.site-search{display:flex;align-items:center;gap:12px;background:white;border:1px solid #eee;border-radius:50px;padding:11px 16px;width:300px;margin:auto}.site-search svg{width:16px;height:16px;color:#999;flex-shrink:0}.site-search input{background:none;border:0;min-width:0;width:100%;font-size:12px;color:#333;outline-offset:2px}.site-search input::placeholder{color:#929292}.harness-hero{text-align:center;padding:80px 24px 72px}.release-pill{display:inline-flex;gap:10px;align-items:center;padding:5px 12px 5px 5px;background:#f8f8f8;border-radius:12px;font-size:11px;color:#444}.release-pill span{padding:6px 9px;background:linear-gradient(#659aff,#467ee9);color:white;border-radius:7px;box-shadow:0 1px 5px #387df45e}.harness-hero h1{font-size:clamp(38px,3.7vw,54px);letter-spacing:-2.4px;font-weight:600;line-height:1.12;margin:28px 0 20px}.harness-hero>p{color:#686868;font-size:17px;line-height:1.65;margin:0 auto 25px;max-width:620px}.install{display:inline-flex;align-items:center;gap:25px;padding:5px 5px 5px 18px;border-radius:99px;background:#f7f7f7;max-width:100%}.install code{font-size:12px;white-space:nowrap}.install button{background:white;border:1px solid #f0f0f0;border-radius:99px;font-size:12px;min-height:37px;padding:8px 18px;box-shadow:0 2px 3px #00000008}.hero-links{display:flex;align-items:center;justify-content:center;gap:20px;margin:20px 0 12px;font-size:11px;color:#777}.hero-links a{color:#333}.release-note{display:block;font-size:10px;color:#888;line-height:1.6}.explore{scroll-margin-top:25px}.explore-toolbar{display:flex;align-items:center;justify-content:space-between;gap:20px;margin-bottom:26px}.filter-list{display:flex;background:#f8f8f8;padding:4px;border-radius:99px;gap:3px}.filter-list button{border:0;background:transparent;color:#858585;border-radius:99px;padding:12px 21px;font-size:12px;white-space:nowrap}.filter-list button[aria-pressed=true]{background:white;color:#151515;box-shadow:0 2px 5px #0000000d}.workflow-link{border:1px solid #eee;box-shadow:0 2px 4px #00000008;border-radius:99px;padding:12px 18px;font-size:12px}.capability-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:40px 22px}.capability-card{min-width:0}.capability-card a{display:block;border-radius:20px}.card-preview{height:280px;background:#f7f7f7;border-radius:22px;display:flex;align-items:center;justify-content:center;padding:30px;overflow:hidden;transition:background .2s}.capability-card a:hover .card-preview{background:#f0f0f0}.mini-window{background:white;border:1px solid #e9e9e9;border-radius:9px;box-shadow:0 9px 18px #00000009;width:100%;max-width:355px;overflow:hidden;font-size:10px;transform:translateY(3px);transition:transform .2s}.capability-card a:hover .mini-window{transform:translateY(-2px)}.mini-title{display:flex;align-items:center;justify-content:space-between;gap:8px;border-bottom:1px solid #eee;padding:14px;font-weight:600;font-size:10px}.mini-title>span{font-size:8px;color:#777;font-weight:400;background:#f4f4f4;padding:4px 6px;border-radius:4px}.file-row{display:flex;align-items:center;gap:4px;padding:14px 12px;border-bottom:1px solid #f4f4f4;font-size:9px}.file-row b{font-size:8px;font-weight:400;color:#999;margin-left:auto}.mini-bottom{font-size:8px;color:#888;padding:13px;text-align:center}.code-lines{display:grid;gap:10px;padding:18px;font-family:ui-monospace,SFMono-Regular,monospace;font-size:9px}.code-dim{color:#8c8c8c}.code-lines strong{font-weight:500;color:#304f9d}.tool-call{display:flex;justify-content:space-between;align-items:center;gap:10px;padding:13px 14px;border-bottom:1px solid #f4f4f4}.tool-call span{font-size:8px;color:#999}.tool-call code{font-size:9px;background:#f7f7f7;border:1px solid #eee;padding:6px;border-radius:5px}.mini-editor{display:grid;grid-template-columns:65px 1fr 62px;min-height:160px}.mini-editor>div{padding:12px 8px;display:flex;flex-direction:column;gap:12px;font-size:8px}.mini-editor>div:first-child{border-right:1px solid #eee}.mini-editor>div:last-child{border-left:1px solid #eee;color:#888}.mini-preview{align-items:center;justify-content:center;gap:10px!important}.sample-button,.sample-outline{font-size:8px;white-space:nowrap;padding:7px 8px;background:#171717;color:white;border-radius:5px}.sample-outline{background:white;color:#444;border:1px solid #ddd}.save-flow{display:grid;text-align:center;padding:18px;gap:9px;font-size:10px}.save-flow i{color:#aaa;font-style:normal}.save-flow strong{background:#f4f6f9;color:#405477;font-weight:500;padding:10px;border-radius:5px}.terminal-mini .code-lines{background:#242424;color:white}.terminal-mini .code-dim{color:#aaa}.card-meta{display:flex;justify-content:space-between;color:#898989;font-size:10px;margin:17px 2px 8px}.capability-card h3{font-size:17px;font-weight:550;letter-spacing:-.4px;margin:0 2px 8px}.capability-card p{font-size:12px;line-height:1.75;color:#777;margin:0 2px;max-width:370px}.preview-note{text-align:center;font-size:10px;color:#999;margin:32px 0 0}.eyebrow{font-size:10px;letter-spacing:1.6px;font-weight:500;color:#888}h2{font-size:38px;font-weight:550;letter-spacing:-1.6px;line-height:1.15;margin:18px 0 26px}.harness-explainer{display:grid;grid-template-columns:1fr 1fr;gap:100px;padding-top:110px;padding-bottom:90px}.harness-explainer p,.files-section p{font-size:15px;line-height:1.8;color:#747474;margin:0 0 18px}.harness-explainer a,.section-heading>a,.files-section a{font-size:12px;text-decoration:underline;text-underline-offset:4px}.workflow-section{padding-top:55px;padding-bottom:80px;border-top:1px solid var(--line)}.section-heading{display:flex;align-items:center;justify-content:space-between;gap:25px;margin-bottom:30px}.section-heading h2{margin-bottom:0}.workflow-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:45px}.workflow-grid article{display:flex;gap:15px}.step-number{font-size:11px;color:#999;padding-top:4px}.workflow-grid h3{font-size:17px;font-weight:550;margin:0 0 10px;letter-spacing:-.3px}.workflow-grid p{font-size:13px;line-height:1.8;color:#777;margin:0 0 16px}.workflow-grid code{font-size:10px;line-height:1.8;background:#f6f6f6;border-radius:5px;padding:6px 8px;box-decoration-break:clone;overflow-wrap:anywhere}.files-section{border-top:1px solid var(--line);padding-top:80px;padding-bottom:80px;display:grid;grid-template-columns:1fr 1fr;gap:100px}.files-section p{max-width:450px}.files-section h2 code{font-size:.9em;font-weight:400}.file-list{border:1px solid #e9e9e9;border-radius:14px;overflow:hidden}.file-list>div{padding:19px 24px;display:grid;gap:8px;border-bottom:1px solid #eee}.file-list>div:last-child{border:0}.file-list code{font-size:12px;overflow-wrap:anywhere}.file-list span{color:#888;font-size:11px}.faq-section{padding-top:30px;padding-bottom:80px;max-width:850px}.faq-section h2{text-align:center;margin-bottom:35px}.faq-section details{border-bottom:1px solid #eee;padding:20px 0}.faq-section summary{font-size:15px;line-height:1.6}.faq-section p{font-size:13px;color:#777;line-height:1.8;margin:15px 0 0}.closing-banner{background:#f8f8f8;border:1px solid #f1f1f1;border-radius:24px;padding:60px;text-align:center;margin-bottom:65px;max-width:1376px}.closing-banner svg{width:45px;height:45px}.closing-banner h2{font-size:40px;margin:22px 0 15px}.closing-banner p{font-size:14px;color:#888;margin-bottom:25px}.closing-points{display:flex;justify-content:center;gap:45px;margin-top:50px;font-size:11px;color:#888}.site-footer{max-width:1440px;margin:auto;padding:35px 32px 55px;display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:45px}.site-footer p{font-size:12px;color:#888;margin:18px 0}.site-footer small{font-size:10px;color:#aaa}.site-footer nav{display:flex;flex-direction:column;gap:14px;font-size:12px}.site-footer nav b{font-weight:550;margin-bottom:5px}.site-footer nav a{color:#888}.site-footer nav a:hover{color:#151515}
/* Documentation shares the same restrained shell. */
body>header:not(.site-header){padding:22px 32px;max-width:1440px;margin:auto;border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between;gap:25px}body>header:not(.site-header) nav{display:flex;gap:25px;font-size:13px}.docs-shell{max-width:1240px;margin:auto;display:grid;grid-template-columns:225px minmax(0,1fr);gap:65px;padding:55px 32px 80px}.docs-nav{position:sticky;top:25px;height:fit-content}.docs-nav nav{display:flex;flex-direction:column;gap:3px}.docs-nav a{font-size:12px;padding:9px 12px;border-radius:6px;color:#777}.docs-nav a:hover,.docs-nav a[aria-current]{background:#f4f4f4;color:#111}.docs-main{min-width:0;max-width:790px}.doc-section{scroll-margin-top:30px;border-bottom:1px solid #eee;padding-bottom:50px;margin-bottom:50px}.doc-section h1{font-size:40px;font-weight:550;line-height:1.12;letter-spacing:-1.5px;margin:15px 0 25px}.doc-section h2{font-size:23px;letter-spacing:-.5px;margin:30px 0 15px}.doc-section p,.doc-section li{font-size:14px;line-height:1.85;color:#666}.doc-section li{margin-bottom:12px}.doc-section .lead{font-size:17px}.doc-section a{text-decoration:underline;text-underline-offset:3px}.doc-section pre{background:#f7f7f7;border:1px solid #eee;border-radius:10px;padding:22px;overflow:auto;line-height:1.9;font-size:13px}.doc-section code{font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.88em;overflow-wrap:anywhere}.notice{padding:20px 24px;background:#f5f7fb;border:1px solid #e8edf5;border-radius:10px;font-size:13px;line-height:1.8}.doc-section details{border:1px solid #eee;border-radius:10px;padding:18px;margin-top:25px}.doc-section summary{font-size:14px}.doc-section blockquote{border-left:2px solid #ccc;margin:20px 0;padding:8px 25px;line-height:1.8;color:#666}.table-wrap{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px;line-height:1.7}th,td{text-align:left;border-bottom:1px solid #eee;padding:16px 10px;vertical-align:top}th{font-weight:600}td:first-child{min-width:200px}body>footer:not(.site-footer){max-width:1240px;margin:auto;padding:30px 32px;border-top:1px solid #eee;display:flex;align-items:center;gap:30px;font-size:11px;color:#888}body>footer:not(.site-footer)>a:last-child{margin-left:auto}.text-link{display:inline-block;margin-top:10px}
@media(max-width:1100px){.header-inner{gap:22px}.site-search{width:220px}.header-inner nav{gap:16px}.card-preview{padding:20px;height:250px}.mini-editor{grid-template-columns:55px 1fr}.mini-editor>div:last-child{display:none}.harness-explainer,.files-section{gap:50px}.closing-banner{margin-left:32px;margin-right:32px}}@media(max-width:850px){.site-search{display:none}.header-inner nav{margin-right:auto}.capability-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.workflow-grid{grid-template-columns:repeat(2,1fr)}.docs-shell{grid-template-columns:190px minmax(0,1fr);gap:28px}.site-footer{gap:25px}.harness-explainer,.files-section{gap:35px}.hero-links{flex-wrap:wrap}.card-preview{height:270px}}@media(max-width:600px){.wrap{padding-left:22px;padding-right:22px}.header-inner{padding:17px 20px;gap:12px;flex-wrap:wrap}.brand{font-size:24px}.brand svg{width:26px;height:26px}.header-inner nav{order:3;flex:1 1 100%;justify-content:center;font-size:11px;gap:24px;padding-top:7px}.header-actions{font-size:11px;gap:12px}.header-actions .button{font-size:11px;padding:9px 15px;min-height:36px}.harness-hero{padding:50px 22px 45px}.harness-hero h1{font-size:39px;letter-spacing:-1.8px}.harness-hero>p{font-size:15px}.desktop{display:none}.release-pill{font-size:9px;gap:6px}.install{gap:10px;padding-left:12px}.install code{font-size:10px}.install button{font-size:10px;padding:8px 13px}.hero-links{gap:10px;flex-direction:column;font-size:10px}.release-note{font-size:9px;max-width:290px;margin:auto}.explore-toolbar{align-items:flex-start;flex-direction:column;gap:16px}.filter-list{max-width:100%;overflow:auto}.filter-list button{font-size:11px;padding:10px 14px}.workflow-link{align-self:flex-end;font-size:10px;padding:8px 13px}.capability-grid{grid-template-columns:1fr;gap:30px}.card-preview{height:280px;padding:35px}.mini-editor{grid-template-columns:65px 1fr 62px}.mini-editor>div:last-child{display:flex}.capability-card h3{font-size:17px}.preview-note{font-size:9px;line-height:1.7}.harness-explainer,.files-section{grid-template-columns:1fr;gap:15px;padding-top:60px;padding-bottom:55px}h2{font-size:32px;letter-spacing:-1.2px}.harness-explainer p,.files-section p{font-size:14px}.workflow-section{padding-top:40px;padding-bottom:50px}.section-heading{display:block;margin-bottom:30px}.section-heading>a{display:inline-block;margin-top:20px}.workflow-grid{grid-template-columns:1fr;gap:30px}.file-list{margin-top:15px}.file-list>div{padding:17px}.file-list code{font-size:11px}.faq-section{padding-bottom:50px}.faq-section summary{font-size:14px}.closing-banner{padding:40px 22px;margin-left:18px;margin-right:18px;margin-bottom:30px}.closing-banner h2{font-size:33px}.closing-banner p{font-size:13px;line-height:1.7}.closing-points{display:grid;grid-template-columns:1fr 1fr;gap:20px;margin-top:35px;font-size:10px}.site-footer{grid-template-columns:1fr 1fr;padding:30px 22px;gap:35px}.site-footer>div{grid-column:1/-1}.site-footer nav{font-size:11px}body>header:not(.site-header){padding:20px;gap:15px}body>header:not(.site-header) nav{gap:15px;font-size:11px}.nav-npm{display:none}.docs-shell{display:block;padding:25px 22px}.docs-nav{position:static;margin-bottom:30px}.docs-nav nav{flex-direction:row;overflow:auto;padding-bottom:10px}.docs-nav a{white-space:nowrap}.docs-nav .eyebrow{display:none}.doc-section h1{font-size:33px}.doc-section pre{padding:15px;font-size:12px}body>footer:not(.site-footer)>span{display:none}}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* Canon's editorial product narrative. */
.header-inner nav{margin-right:auto}.editorial-hero{display:grid;grid-template-columns:1.1fr 1fr;gap:85px;align-items:center;padding-top:90px;padding-bottom:85px;max-width:1320px}.edition{font-size:10px;letter-spacing:1.6px;color:#777;display:flex;align-items:center;gap:9px}.edition>span{width:6px;height:6px;background:#709181;border-radius:50%}.hero-copy h1{font-size:clamp(48px,4.7vw,70px);line-height:1.06;letter-spacing:-3.5px;font-weight:550;margin:27px 0}.hero-copy h1 em{font-style:normal;color:#8a8c88}.hero-copy>p{font-size:16px;line-height:1.8;color:#777;max-width:460px}.hero-cta{display:flex;align-items:center;gap:25px;margin:29px 0}.hero-cta .button{border-radius:9px;gap:28px;min-height:45px}.quiet-link{font-size:12px}.hero-copy .install{background:none;border:1px solid #e9e9e9;border-radius:8px;padding-left:13px;gap:20px}.hero-copy .install button{border:0;background:#f6f6f6;border-radius:5px;box-shadow:none;font-size:10px;min-height:29px}.hero-copy .install code{font-size:10px;color:#777}.hero-copy .release-note{margin-top:14px;font-size:10px}.harness-map{background:#f7f8f6;border:1px solid #edf0e9;border-radius:18px;padding:26px 32px 22px;position:relative}.map-caption{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1.1px;color:#92968e;margin-bottom:25px}.map-source{border:1px solid #e1e5de;border-radius:10px;background:white;padding:18px;display:flex;align-items:center;gap:14px;box-shadow:0 3px 5px #00000002}.node-icon{font-size:20px;border:1px solid #eee;border-radius:9px;padding:9px 12px;color:#72796b}.map-source>div:nth-child(2){display:grid;gap:5px}.map-source small,.map-branches small{font-size:8px;letter-spacing:1px;color:#989c92}.map-source strong{font-size:16px;font-weight:550}.map-source div>span{font-size:10px;color:#888}.source-dot{width:6px;height:6px;border-radius:50%;background:#82927a;display:inline-block}.map-source>.source-dot{margin-left:auto}.map-wire{width:1px;height:26px;background:#d1d8cb;margin:auto}.map-center{border:1px solid #dce2d5;background:white;border-radius:12px;box-shadow:0 12px 28px #363d2b08;overflow:hidden}.map-center-title{display:flex;align-items:center;gap:9px;padding:17px 20px;background:#f0f3eb;border-bottom:1px solid #e5e9df}.canon-spark{font-size:25px;color:#596b4d;line-height:1}.map-center-title strong{font-size:21px;letter-spacing:-1px}.map-center-title>span:last-child{margin-left:auto;font-size:9px;color:#828878}.map-context{padding:19px;border-bottom:1px solid #eee}.map-context>span{font-size:8px;letter-spacing:1px;color:#92968e}.map-context>div{display:flex;gap:8px;margin-top:12px}.map-context code{font-size:10px;border:1px solid #e6e8e2;background:#fbfcfa;padding:7px 10px;border-radius:5px}.map-branches{display:grid;grid-template-columns:1fr 1fr}.map-branches>div{padding:20px;display:grid;gap:10px}.map-branches>div+div{border-left:1px solid #eee}.map-branches strong{font-size:12px;font-weight:550}.map-branches div>span{font-size:10px;line-height:1.8;color:#999}.map-check{display:flex;align-items:center;gap:10px;padding:17px 20px;border-top:1px solid #eee;background:#fdfdfc}.map-check>div{display:grid;gap:4px}.map-check strong{font-size:10px;font-weight:500}.map-check div>span{font-size:9px;color:#969b90}.check-mark{width:22px;height:22px;border-radius:50%;background:#e9eee3;color:#5f7250;text-align:center;line-height:22px;font-size:11px}.map-check>span:last-child{margin-left:auto;font-size:22px;color:#87937c}.map-footnote{display:flex;align-items:center;justify-content:center;gap:7px;font-size:9px;color:#969b90;margin-top:19px}.context-strip{max-width:1256px;border-top:1px solid #eee;border-bottom:1px solid #eee;display:flex;align-items:center;justify-content:space-between;gap:30px;padding-top:24px;padding-bottom:24px}.context-strip>span{font-size:8px;letter-spacing:1.3px;color:#aaa}.context-strip>div{display:flex;align-items:center;gap:30px}.context-strip b{font-size:12px;font-weight:500;color:#666}.context-strip i{font-size:12px;color:#ccc;font-style:normal}.product-chapters{max-width:1256px;padding-top:85px}.chapter-heading{margin-bottom:55px}.chapter-heading h2{font-size:42px;line-height:1.18}.chapter{display:grid;grid-template-columns:1fr 1fr;gap:100px;align-items:center;padding:0 0 80px;margin-bottom:65px;border-bottom:1px solid #eee}.chapter:last-child{margin-bottom:0}.chapter-reverse .chapter-copy{order:2}.chapter-index{font-size:9px;letter-spacing:1.5px;color:#999}.chapter-copy h3{font-size:30px;font-weight:500;letter-spacing:-1px;line-height:1.25;margin:18px 0 22px}.chapter-copy p{font-size:14px;line-height:1.85;color:#777;max-width:445px}.chapter-copy code{font-size:12px;color:#555}.chapter-copy>a{font-size:12px;display:inline-flex;align-items:center;gap:25px;margin-top:15px}.chapter-copy>a:hover{text-decoration:underline}.context-document{border:1px solid #e5e7e2;border-radius:12px;background:#fcfcfb;overflow:hidden;box-shadow:0 15px 35px #24291b05}.document-label{padding:17px 22px;background:#f3f4f0;color:#92978b;font-size:8px;letter-spacing:1.1px;display:flex;justify-content:space-between}.context-file{display:flex;align-items:center;gap:13px;padding:20px 22px;border-bottom:1px solid #eee}.context-file>span:first-child{font-size:25px;color:#989f8f}.context-file>div{display:grid;gap:6px}.context-file strong{font-family:ui-monospace,monospace;font-size:12px;font-weight:500}.context-file small{font-size:10px;color:#999}.file-label{margin-left:auto;font-size:8px;border:1px solid #e5e7e0;color:#929787;padding:5px 8px;border-radius:4px}.document-content{padding:25px 28px;font-family:ui-monospace,monospace}.document-content>.code-dim{font-size:10px;color:#aaa}.document-content h4{font-size:14px;letter-spacing:-.3px;font-weight:500;margin:20px 0 13px}.document-content p{font-size:11px;line-height:2;color:#77806b;margin:0 0 20px}.document-links{display:flex;justify-content:space-between;padding:18px 22px;border-top:1px solid #eee;font-size:9px;color:#92998a}.visual-caption{display:block;text-align:center;padding:10px 20px;font-size:8px;line-height:1.7;color:#a0a497;background:#f7f8f5}.design-surface{border:1px solid #e7e4e0;border-radius:12px;background:#faf9f6;overflow:hidden}.surface-top{display:flex;justify-content:space-between;padding:20px 22px;border-bottom:1px solid #ece9e3;font-size:8px;color:#979387;letter-spacing:.8px}.design-specimen{padding:40px 20px;text-align:center;min-height:230px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:25px}.specimen-eyebrow{font-size:8px;letter-spacing:1.3px;color:#aaa69b}.design-specimen>div{display:flex;gap:14px;align-items:center}.specimen-primary{background:#776850;color:white;padding:13px 20px;border-radius:8px;font-size:12px;box-shadow:0 3px 7px #77685015}.specimen-outline{border:1px solid #dedbd3;border-radius:8px;background:#fff;padding:13px 20px;font-size:12px;color:#777266}.specimen-caption{font-size:9px;color:#aaa69b}.design-properties{display:flex;justify-content:space-around;align-items:center;border-top:1px solid #eae7e0;padding:18px 12px;font-size:9px;color:#aaa599;background:#fff}.design-properties span{display:flex;gap:6px;align-items:center}.design-properties b{font-weight:400;color:#6e685c}.property-dot{width:10px;height:10px;border-radius:3px;background:#776850}.source-caption{display:flex;justify-content:space-between;padding:17px 22px;border-top:1px solid #ece9e3;font-size:9px;color:#9a9587}.source-caption code{font-size:9px}.check-notebook{border-radius:12px;background:#f7f8fa;border:1px solid #e6e9ee;padding:0 25px;overflow:hidden}.notebook-heading{display:flex;align-items:center;justify-content:space-between;padding:22px 0;font-size:9px;letter-spacing:1px;color:#8993a2}.check-notebook>div:not(.notebook-heading):not(.notebook-note){position:relative;padding:20px 0 22px 36px;border-top:1px solid #e4e8ef}.loop-number{position:absolute;left:0;top:22px;font-size:9px;color:#a1acbb}.check-notebook code{font-size:14px;color:#56657a}.check-notebook p{font-size:11px;color:#9ba3af;margin:9px 0 0;line-height:1.6}.notebook-note{font-size:9px;color:#9ba3af;border-top:1px solid #e4e8ef;padding:20px 0}.harness-explainer,.workflow-section,.files-section{max-width:1256px}.harness-explainer{padding-top:70px;padding-bottom:70px}.workflow-grid{grid-template-columns:1fr 1fr;gap:30px 65px}.workflow-grid article{border-top:1px solid #eee;padding-top:25px}.closing-banner{background:#f2f4ee;border-color:#e9ece2}.closing-banner h2{font-size:43px}.closing-banner .button{border-radius:8px}.site-footer{max-width:1320px}
@media(max-width:1050px){.editorial-hero{gap:40px}.harness-map{padding:23px}.hero-copy h1{font-size:56px}.chapter{gap:50px}.context-strip>div{gap:20px}.map-branches>div{padding:17px}.map-context code{font-size:9px;padding:6px 8px}}@media(max-width:800px){.editorial-hero{grid-template-columns:1fr;gap:45px;max-width:650px;padding-top:55px}.hero-copy h1{font-size:65px}.harness-map{max-width:550px;width:100%}.context-strip{flex-direction:column;gap:18px}.chapter{grid-template-columns:1fr;gap:30px;padding-bottom:55px;margin-bottom:50px}.chapter-reverse .chapter-copy{order:0}.chapter-copy p{max-width:none}.product-chapters{max-width:650px;padding-top:60px}.chapter-heading h2{font-size:36px}}@media(max-width:600px){.editorial-hero{padding-top:43px;padding-bottom:45px;gap:40px}.hero-copy h1{font-size:48px;letter-spacing:-2.4px}.edition{font-size:8px;letter-spacing:1.2px}.hero-copy>p{font-size:14px;line-height:1.85}.hero-cta{gap:20px}.hero-cta .button{font-size:11px;padding:11px 15px;gap:15px}.quiet-link{font-size:10px}.hero-copy .release-note{margin-left:0;max-width:none}.harness-map{padding:19px 16px;border-radius:12px}.map-caption{font-size:7px;letter-spacing:.7px}.map-source{padding:13px;gap:10px}.node-icon{padding:7px 10px}.map-source strong{font-size:14px}.map-source div>span{font-size:9px}.map-center-title{padding:14px}.map-center-title strong{font-size:20px}.map-center-title>span:last-child{font-size:8px}.map-context{padding:15px}.map-context code{font-size:9px}.map-branches>div{padding:15px}.map-branches strong{font-size:11px}.map-check{padding:14px}.context-strip{margin:0 22px;padding-left:0;padding-right:0}.context-strip>div{gap:13px;flex-wrap:wrap;justify-content:center}.context-strip b{font-size:10px}.context-strip i{font-size:10px}.chapter-heading h2{font-size:30px}.chapter-copy h3{font-size:28px}.chapter-copy p{font-size:13px}.file-label{font-size:7px}.context-file{padding:17px}.context-file small{font-size:9px}.document-content{padding:23px}.document-content p{font-size:10px}.document-links{font-size:8px;padding:15px}.source-caption{font-size:8px;padding:15px}.source-caption code{font-size:8px}.workflow-grid{grid-template-columns:1fr;gap:25px}.harness-explainer{padding-top:45px;padding-bottom:45px}.closing-banner h2{font-size:33px}}
.layers-section{margin-top:75px;background-color:#fafaf7;background-image:radial-gradient(#dadcd24a .7px,transparent .7px);background-size:9px 9px;padding:65px 0 70px;border-block:1px solid #eff0e9}.layers-heading{max-width:1320px}.layers-heading h2{font-size:41px;margin:18px 0}.layers-heading>p{font-size:14px;color:#8a8d82;line-height:1.8}.layers-layout{display:grid;grid-template-columns:1fr 1fr;gap:75px;max-width:1320px;align-items:center}.layer-steps{display:flex;flex-direction:column}.layer-step{display:flex;align-items:flex-start;gap:20px;text-align:left;background:transparent;border:0;border-bottom:1px solid #e3e5db;width:100%;padding:26px 0;color:#a4a79d;transition:color .2s}.layer-step:last-child{border:0}.layer-icon{padding-top:1px;flex-shrink:0;color:#b4b8ac}.layer-icon svg{width:24px;height:24px}.layer-step>span:nth-child(2){display:grid;gap:12px}.layer-step strong{font-size:21px;font-weight:550;letter-spacing:-.5px}.layer-step>span>span{font-size:13px;line-height:1.8;max-width:440px;color:#a8aba2}.layer-step small{margin-left:auto;font-size:9px;opacity:.55;padding-top:7px}.layer-step[aria-pressed=true]{color:#20221c}.layer-step[aria-pressed=true] .layer-icon{color:#66744d}.layer-step[aria-pressed=true]>span>span{color:#777e6b}.layer-step:hover{color:#5e6652}.layer-visual{min-width:0;padding:20px 0 0}.layer-diagram{width:100%;height:auto;overflow:visible;display:block}.layer-plane{fill:#f0f1eaa8;stroke:#c8cdbe;stroke-width:1;transition:fill .3s,stroke .3s}.layer-drawing{stroke:#b2b9a7;transition:stroke .3s}.plane-index{font-size:10px;font-family:ui-monospace,monospace;fill:#b0b7a4;letter-spacing:2px}.diagram-layer.is-active .layer-plane{fill:#242820;stroke:#242820;filter:drop-shadow(0px 12px 9px #1e241c25)}.diagram-layer.is-active .layer-drawing{stroke:#dfe6d5}.diagram-layer.is-active .plane-index{fill:#98a888}.layer-description{display:grid;gap:9px;margin:15px auto 0;text-align:center;min-height:88px}.layer-description>span{font-size:9px;letter-spacing:1px;text-transform:uppercase;color:#92998a}.layer-description strong{font-size:12px;font-weight:500;font-family:ui-monospace,monospace;color:#656e59}.layer-description a{font-size:10px;color:#818976;text-decoration:underline;text-underline-offset:4px}.diagram-layer{pointer-events:none}
@media(max-width:1000px){.layers-layout{gap:35px}.layer-step{padding:22px 0;gap:15px}.layer-step strong{font-size:19px}.layer-step>span>span{font-size:12px}.layers-heading h2{font-size:36px}}@media(max-width:700px){.layers-section{margin-top:50px;padding:45px 0}.layers-layout{grid-template-columns:1fr;gap:10px}.layers-heading h2{font-size:31px}.layers-heading>p{font-size:13px}.layer-step{padding:20px 0}.layer-step strong{font-size:18px}.layer-step>span:nth-child(2){gap:8px}.layer-step>span>span{font-size:12px}.layer-step small{display:none}.layer-icon svg{width:21px;height:21px}.layer-visual{max-width:430px;width:100%;margin:auto;padding-top:20px}.layer-description{margin-top:5px}.layers-heading,.layers-layout{padding-left:24px;padding-right:24px}}
/* Keep the centered opening; the explanatory layers replace only the catalogue. */
.layers-section{margin-top:0}.harness-hero{padding-bottom:65px}
@media(max-width:600px){.harness-hero{padding-bottom:45px}.layers-section{margin-top:0}}
.library-support{display:flex;gap:13px;align-items:center;justify-content:center;margin:18px 0 14px;font-size:11px;color:#777}.library-support>span{display:flex;align-items:center;gap:7px}.library-support i{width:5px;height:5px;background:#738561;border-radius:50%}.library-support b{font-size:8px;font-weight:400;line-height:1;padding:5px 6px;background:#f4f4f4;border:1px solid #ededed;border-radius:4px;color:#999}.library-support>span:first-child b{background:#f1f5ee;color:#7a8a6b;border-color:#e7eddf}@media(max-width:600px){.library-support{font-size:10px;gap:10px;flex-wrap:wrap}.library-support b{font-size:8px}}
/* Playful, draggable samples remain confined to the hero. */
.harness-hero{position:relative;isolation:isolate;overflow:hidden;min-height:570px;padding-top:80px;padding-bottom:65px}.hero-main{position:relative;z-index:2;max-width:650px;margin:auto;pointer-events:none}.hero-main a,.hero-main button,.hero-main .install{pointer-events:auto}.hero-main>p{color:#686868;font-size:17px;line-height:1.65;margin:0 auto 25px;max-width:620px}.hero-main h1{font-size:clamp(38px,3.7vw,54px);letter-spacing:-2.4px;font-weight:600;line-height:1.12;margin:28px 0 20px}.floating-components{position:absolute;inset:0;max-width:1450px;margin:auto;z-index:1;pointer-events:none}.float-piece{position:absolute;display:flex;align-items:center;gap:10px;padding:14px;background:#fff;border:1px solid #ececec;border-radius:13px;box-shadow:0 8px 30px #24242409,0 2px 4px #24242404;pointer-events:auto;cursor:grab;touch-action:none;user-select:none;transform:translate(var(--drag-x,0px),var(--drag-y,0px)) rotate(var(--tilt,0deg));transition:transform .55s cubic-bezier(.2,.85,.25,1.15),box-shadow .2s;will-change:transform}.float-piece.dragging{transition:box-shadow .2s;cursor:grabbing;box-shadow:0 16px 38px #24242418;z-index:10}.float-grip{padding:0;border:0;background:transparent;color:#c8c8c8;font-size:18px;line-height:1;width:12px;cursor:grab;touch-action:none}.float-grip:hover{color:#777}.float-button{left:45px;top:98px;--tilt:-9deg;padding:12px}.floating-button{border:0;border-radius:8px;background:#272a24;color:white;font-size:12px;padding:13px 18px;display:flex;gap:20px;align-items:center;cursor:grab}.float-input{right:20px;top:99px;--tilt:8deg;width:237px;text-align:left}.float-input>div{min-width:0;display:grid;gap:9px;width:100%}.float-input label{font-size:10px;color:#888}.float-input input{min-width:0;width:100%;border:1px solid #e6e6e6;border-radius:6px;padding:10px;font-size:11px;outline-offset:2px;background:#fbfbfb;color:#555;user-select:text}.float-status{left:95px;top:330px;--tilt:6deg;padding:13px 16px}.floating-badge{display:flex;align-items:center;gap:7px;background:#f4f0e5;color:#8b7950;border-radius:30px;padding:7px 10px;font-size:10px}.floating-badge i{width:5px;height:5px;background:#b49b5d;border-radius:50%}.float-switch{right:62px;top:303px;--tilt:-7deg;padding:17px 15px}.floating-switch{display:flex;align-items:center;gap:9px;font-size:11px;color:#73796b;cursor:pointer}.floating-switch input{position:absolute;opacity:0;width:1px;height:1px}.switch-track{display:block;width:30px;height:17px;border-radius:20px;background:#ddd;position:relative;transition:background .2s}.switch-track:after{content:"";position:absolute;left:3px;top:3px;width:11px;height:11px;border-radius:50%;background:white;transition:transform .2s}.floating-switch input:checked+.switch-track{background:#849271}.floating-switch input:checked+.switch-track:after{transform:translateX(13px)}.floating-switch input:focus-visible+.switch-track{outline:2px solid #477bf1;outline-offset:4px}.float-person{left:10px;top:460px;--tilt:-4deg;text-align:left;gap:9px;padding:12px}.floating-avatar{width:32px;height:32px;background:#eff1f4;color:#8a919f;font-size:10px;border-radius:50%;display:grid;place-items:center}.float-person>div{display:grid;gap:4px}.float-person strong{font-size:10px;font-weight:500;color:#555}.float-person div>span{font-size:8px;color:#aaa}.drag-hint{display:block;color:#aaa;font-size:9px;margin-top:24px;letter-spacing:.2px}
/* A source-centred map, rather than a stack of decorative layers. */
.layers-section{background:#fafbf8;background-image:none}.connection-canvas{height:455px;position:relative;max-width:500px;width:100%;margin:auto;background-image:radial-gradient(#bdc6af44 .7px,transparent .7px);background-size:13px 13px;border-radius:20px}.connection-caption{font-size:8px;letter-spacing:1.3px;color:#a0a994;text-align:center;padding-top:8px}.connection-wires{position:absolute;inset:0;width:100%;height:100%;color:#d5ddcb;pointer-events:none}.connection-node{position:absolute;background:#fcfdfb;border:1px solid #e0e6d8;border-radius:10px;padding:17px 16px;width:165px;display:grid;gap:9px;color:#89937c;box-shadow:0 5px 14px #485d2905;transition:background .2s,color .2s,box-shadow .2s}.connection-node small{font-size:7px;letter-spacing:1.2px;color:#a1ac92}.connection-node strong{font-size:13px;font-weight:500}.connection-node code{font-size:8px;color:#a1ac92}.connection-node.is-active{background:#303929;color:white;border-color:#303929;box-shadow:0 8px 25px #29351a16}.connection-node.is-active small,.connection-node.is-active code{color:#b8c5aa}.node-source{left:0;top:45px}.node-rules{right:0;top:45px}.node-agent{left:0;top:295px}.node-studio{right:0;top:295px}.connection-core{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:144px;height:95px;border-radius:13px;background:white;border:1px solid #d7dfcf;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;box-shadow:0 10px 30px #39472a0c}.connection-core>span{font-size:29px;font-weight:650;letter-spacing:-1.8px;color:#3b4630}.connection-core small{font-size:8px;color:#9ca88e}.connection-feedback{position:absolute;left:50%;bottom:0;transform:translateX(-50%);border-radius:20px;border:1px solid #e1e6da;background:#fafcf7;padding:9px 16px;display:flex;align-items:center;gap:10px;font-size:10px;color:#96a287;white-space:nowrap;transition:background .2s,color .2s}.connection-feedback i{font-style:normal;color:#c1c9b7}.connection-feedback.is-active{color:white;background:#303929;border-color:#303929}.layer-description{margin-top:30px}.layer-step{padding:22px 0}.layer-step strong{font-size:19px}
@media(max-width:1200px){.float-button{left:10px;top:65px;scale:.85;transform-origin:left center}.float-input{right:0;top:75px;scale:.85;transform-origin:right center}.float-status{left:20px;top:335px;scale:.85;transform-origin:left center}.float-switch{right:10px;top:335px;scale:.85;transform-origin:right center}.float-person{left:10px;top:475px;scale:.85;transform-origin:left center}.hero-main{max-width:580px}.hero-main h1{font-size:48px}.hero-main>p{font-size:15px;max-width:480px}}
@media(max-width:950px){.harness-hero{padding-top:60px;padding-bottom:195px}.float-button{left:6%;top:auto;bottom:64px;scale:.85}.float-input{right:5%;top:auto;bottom:40px;scale:.85}.float-status{left:40%;top:auto;bottom:55px;scale:.9}.float-switch,.float-person{display:none}.hero-main{max-width:620px}.connection-node{width:145px;padding:14px}.connection-node strong{font-size:12px}.connection-node code{font-size:7px}}
@media(max-width:600px){.harness-hero{padding-top:48px;padding-bottom:160px}.hero-main h1{font-size:39px;letter-spacing:-1.8px}.hero-main>p{font-size:15px}.float-button{left:3%;bottom:36px;scale:.75}.float-input{right:3%;bottom:25px;scale:.7;width:220px}.float-status{display:none}.drag-hint{margin-top:18px}.connection-canvas{height:380px;max-width:380px}.connection-node{width:140px;padding:13px}.node-source,.node-rules{top:35px}.node-agent,.node-studio{top:248px}.connection-core{width:120px;height:80px}.connection-core>span{font-size:25px}.connection-feedback{bottom:-10px}.connection-caption{font-size:7px}.layer-description{margin-top:35px}}
@media(prefers-reduced-motion:reduce){.float-piece{transition:none}}
/* Components drift independently; dragging temporarily pauses their motion. */
@keyframes component-drift{0%,100%{translate:0 0}25%{translate:5px -9px}50%{translate:-3px -15px}75%{translate:-7px -5px}}
.float-piece{animation:component-drift var(--float-duration,8s) ease-in-out infinite;animation-delay:var(--float-delay,0s)}.float-piece.dragging{animation-play-state:paused}.float-piece:focus-visible{outline:2px solid #ad93e7;outline-offset:5px}.float-button{--float-duration:8.5s;--float-delay:-1s;background:#f5f0fe;border-color:#e7dbfa}.floating-button{background:#9470d7;box-shadow:0 2px 5px #7953b51c;cursor:grab}.float-input{--float-duration:10s;--float-delay:-4s;background:#f1f6ff;border-color:#dde8f8}.float-input label{color:#7f98bf}.float-input input{border-color:#d8e4f6;background:#fbfdff;color:#7290bb}.float-input input::placeholder{color:#9bafd0}.float-status{--float-duration:9s;--float-delay:-6s;background:#fffaf0;border-color:#f3e6c9}.floating-badge{background:#f9eccb;color:#ac893a}.floating-badge i{background:#caa352}.float-switch{--float-duration:11s;--float-delay:-2s;background:#f0f8f0;border-color:#dcebdc}.floating-switch{color:#7c9c7b}.floating-switch input:checked+.switch-track{background:#94b593}.float-person{--float-duration:9.5s;--float-delay:-5s;background:#f1f2ff;border-color:#e1e2f8}.floating-avatar{background:#dfe2fb;color:#949bd0}.float-person strong{color:#878db8}.float-person div>span{color:#a1a6c5}.float-tabs{left:110px;top:222px;--tilt:5deg;--float-duration:10.5s;--float-delay:-7s;padding:10px;background:#fdf0f4;border-color:#f3dce5}.floating-tabs{display:flex;gap:3px;padding:3px;background:#f6e3eb;border-radius:8px}.floating-tabs button{border:0;background:transparent;border-radius:6px;padding:8px 15px;font-size:10px;color:#b2879b;cursor:pointer}.floating-tabs button[aria-pressed=true]{background:#fffafa;color:#a3748a;box-shadow:0 2px 4px #ac678c09}.float-palette{right:95px;top:227px;--tilt:-5deg;--float-duration:9s;--float-delay:-3s;padding:13px;gap:7px;background:#fffafd;border-color:#f1e5ee}.float-palette>span{width:19px;height:25px;background:var(--swatch);border-radius:5px;opacity:.85}.float-toast{right:20px;top:462px;--tilt:5deg;--float-duration:11s;--float-delay:-8s;background:#eff9f5;border-color:#dceddf;gap:11px;padding:15px}.toast-check{width:25px;height:25px;border-radius:50%;background:#d6eddf;color:#83af96;display:grid;place-items:center;font-size:12px}.float-toast>div{display:grid;gap:5px}.float-toast strong{font-size:10px;font-weight:500;color:#739b84}.float-toast div>span{font-size:8px;color:#97b4a3}@media(max-width:1200px){.float-tabs{left:15px;top:212px;scale:.85;transform-origin:left center}.float-palette{right:10px;top:215px;scale:.85;transform-origin:right center}.float-toast{right:10px;top:470px;scale:.85;transform-origin:right center}}@media(max-width:950px){.float-tabs,.float-palette,.float-toast{display:none}}@media(prefers-reduced-motion:reduce){.float-piece{animation:none;transition:none}}
/* Float the controls themselves, without decorative cards around them. */
.float-piece,.float-piece.dragging{background:transparent;border:0;box-shadow:none;padding:0;border-radius:0}.float-piece:focus-visible{outline-offset:8px;border-radius:8px}.floating-button{background:#8661d1;color:#fff;border:1px solid #7953c7;padding:14px 22px;font-size:13px;border-radius:9px;box-shadow:0 4px 10px #7756c31a}.float-input{width:214px}.float-input label{display:none}.float-input>div{display:block}.float-input input{background:#fff;border:1.5px solid #8daee5;border-radius:9px;padding:14px 16px;font-size:12px;color:#4673b5;box-shadow:0 3px 9px #4c75b012}.float-input input::placeholder{color:#829dca}.floating-badge{background:#fff1c8;border:1px solid #eedda7;border-radius:30px;padding:9px 14px;font-size:12px;color:#9a772d;box-shadow:0 2px 6px #b08f3210}.floating-badge i{background:#bb9740}.floating-switch{color:#557b60;font-size:12px;gap:10px}.switch-track{width:38px;height:22px;background:#dedede}.switch-track:after{width:16px;height:16px;top:3px;left:3px}.floating-switch input:checked+.switch-track{background:#78a58b}.floating-switch input:checked+.switch-track:after{transform:translateX(16px)}.float-person>div{display:none}.floating-avatar{width:48px;height:48px;border:2px solid #fff;background:#d9dff6;color:#7486bc;box-shadow:0 2px 7px #4f64a915;font-size:15px}.float-person{left:110px;top:450px}.floating-tabs{background:#f5e5ee;padding:4px;border:1px solid #ead5e0;border-radius:10px;box-shadow:0 3px 8px #b3779410}.floating-tabs button{font-size:12px;padding:10px 20px;color:#a47e94}.floating-tabs button[aria-pressed=true]{background:white;color:#95657f;box-shadow:0 2px 4px #9c638414}.float-palette{gap:9px}.float-palette>span{width:24px;height:30px;opacity:1;box-shadow:0 2px 5px #00000009}.float-toast{background:#fff;border:1px solid #d7e9df;box-shadow:0 4px 12px #709d8310;padding:13px 17px;border-radius:10px}.toast-check{background:#dff0e5;color:#64947a}.float-toast strong{color:#5d7e6a;font-size:11px}.float-toast div>span{color:#8aab97;font-size:9px}@media(max-width:1200px){.float-person{left:35px;top:475px}}@media(max-width:950px){.float-person{display:none}}
/* Component proportions follow the installed shadcn/ui controls. */
.floating-button{height:36px;padding:0 14px;gap:8px;border-radius:8px;border:1px solid transparent;background:#7c3aed;color:#fff;font-size:14px;font-weight:500;box-shadow:0 1px 2px #0000000d}.floating-button:hover{background:#6d28d9}.float-input{width:220px}.float-input input{height:36px;border:1px solid #e4e4e7;border-radius:8px;padding:4px 12px;background:#fff;color:#18181b;font-size:14px;box-shadow:0 1px 2px #00000008}.float-input input::placeholder{color:#71717a}.float-input input:focus-visible{outline:3px solid #a78bfa55;outline-offset:0;border-color:#a78bfa}.floating-badge{height:24px;padding:2px 9px;gap:5px;background:#fef3c7;border:1px solid transparent;color:#a16207;border-radius:999px;font-size:12px;font-weight:500;box-shadow:none}.floating-badge i{width:5px;height:5px;background:#d97706}.floating-tabs{height:36px;padding:3px;background:#f4f4f5;border:0;border-radius:8px;gap:2px;box-shadow:none}.floating-tabs button{font-size:14px;font-weight:500;line-height:1;color:#71717a;padding:4px 12px;border-radius:6px}.floating-tabs button[aria-pressed=true]{background:#fff;color:#18181b;box-shadow:0 1px 3px #00000015}.floating-switch{color:#27272a;font-size:14px;font-weight:500;gap:9px}.switch-track{width:32px;height:18px;background:#e4e4e7;box-shadow:0 1px 2px #00000008}.switch-track:after{width:14px;height:14px;top:2px;left:2px}.floating-switch input:checked+.switch-track{background:#16a34a}.floating-switch input:checked+.switch-track:after{transform:translateX(14px)}.floating-avatar{width:40px;height:40px;border:1px solid #ddd6fe;background:#ede9fe;color:#6d28d9;font-size:14px;font-weight:500;box-shadow:none}.float-toast{padding:14px 16px;background:#fff;border:1px solid #e4e4e7;border-radius:8px;box-shadow:0 4px 12px #00000008;gap:10px}.toast-check{width:18px;height:18px;background:#18181b;color:#fff;font-size:11px}.float-toast strong{font-size:13px;font-weight:500;color:#18181b}.float-toast div>span{font-size:12px;color:#71717a}.float-palette>span{width:22px;height:22px;border-radius:5px;box-shadow:inset 0 0 0 1px #0000000a}.float-button{--tilt:-5deg}.float-input{--tilt:5deg}.float-tabs{--tilt:3deg}.float-status{--tilt:4deg}.float-switch{--tilt:-4deg}.float-toast{--tilt:3deg}

/* A direct product explanation, followed by one everyday example. */
.canon-definition{border-top:1px solid #ededed;background:#fafafa;scroll-margin-top:24px}.canon-definition .harness-explainer{padding-top:84px;padding-bottom:80px;gap:56px 90px}.canon-definition h2{font-size:42px;line-height:1.13;letter-spacing:-1.7px}.canon-definition .definition-lead{font-size:21px;line-height:1.55;color:#222;letter-spacing:-.35px}.canon-definition code{font-size:13px;color:#444}.canon-definition strong{font-weight:550;color:#333}.canon-example{grid-column:1/-1;border-top:1px solid #e5e5e5;padding-top:34px;display:grid;grid-template-columns:1fr 3fr;gap:14px 38px}.canon-example>.eyebrow{grid-column:1/-1}.canon-example h3{font-size:24px;line-height:1.25;letter-spacing:-.6px;font-weight:550;margin:0}.example-sequence{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:32px}.example-sequence span{font-size:10px;letter-spacing:1.2px;color:#888}.canon-example .example-sequence p{font-size:13px;line-height:1.8;margin:12px 0 0;color:#666}@media(max-width:800px){.canon-definition .harness-explainer{grid-template-columns:1fr;gap:24px;padding-top:48px;padding-bottom:48px}.canon-definition h2{font-size:34px;margin-bottom:0}.canon-definition .definition-lead{font-size:19px}.canon-example{grid-template-columns:1fr;margin-top:12px;gap:18px}.example-sequence{grid-template-columns:1fr;gap:24px}.canon-example h3 br{display:none}.canon-example h3 br:after{content:' '}}

.canon-agents{grid-column:1/-1;padding:28px 0 0;border-top:1px solid #e5e5e5}.agent-brands{display:flex;align-items:center;gap:54px;margin:27px 0 18px}.agent-brand{display:flex;align-items:center;gap:12px;font-size:23px;letter-spacing:-.7px;font-weight:550;color:#27272a}.agent-brand svg{width:30px;height:30px}.canon-agents p{font-size:12px!important;margin:0!important}.canon-example{padding-top:30px}@media(max-width:600px){.agent-brands{gap:24px;flex-wrap:wrap}.agent-brand{font-size:19px}.agent-brand svg{width:25px;height:25px}}

/* Start using Canon / what the harness does. */
.setup-section{max-width:1320px;padding-top:80px;padding-bottom:80px;scroll-margin-top:35px}.setup-heading{text-align:center;max-width:810px;margin:0 auto 60px}.setup-heading>.eyebrow{color:#7c3aed;letter-spacing:.5px;font-size:12px;font-weight:550}.setup-heading h2{font-size:44px;line-height:1.13;letter-spacing:-1.8px;margin:20px 0 24px}.setup-heading>p{font-size:17px;line-height:1.7;color:#666;max-width:740px;margin:0 auto}.setup-definition{display:block;color:#888;font-size:12px;margin-top:15px;line-height:1.6}.setup-layout{display:grid;grid-template-columns:1fr 1fr;gap:64px}.setup-start>h2{font-size:18px;letter-spacing:-.4px;font-weight:550;margin:0 0 12px}.setup-subtitle{font-size:13px;color:#888;line-height:1.6;margin:0 0 29px}.setup-steps{list-style:none;padding:0;margin:0}.setup-steps li{margin-bottom:27px}.setup-step-title{display:flex;gap:11px;align-items:center;margin-bottom:12px}.setup-step-title>span{font-family:ui-monospace,monospace;font-size:10px;color:#a1a1aa}.setup-step-title h3{font-size:12px;font-weight:500;margin:0;line-height:1.6}.setup-command{border:1px solid #e4e4e7;border-radius:10px;background:#fafafa;padding:5px;display:flex;gap:8px;align-items:center;box-shadow:0 3px 7px #18181b03}.setup-command>code{background:#fff;box-shadow:0 1px 3px #18181b08;border:1px solid #eeeeef;border-radius:6px;padding:14px;line-height:1.8;font-size:12px;flex:1;min-width:0;overflow-wrap:anywhere}.setup-command>code>span{color:#7c3aed}.setup-command button{display:grid;place-items:center;min-width:33px;min-height:34px;padding:6px;border:0;background:none;color:#888;border-radius:6px;font-size:9px}.setup-command button:hover{color:#222;background:#eee}.setup-command svg{width:15px;height:15px}.setup-steps li>p{font-size:12px;color:#888;line-height:1.8;margin:12px 0 0}.setup-steps li>p code{font-size:11px;color:#555}.setup-agents{display:flex;align-items:center;gap:20px;flex-wrap:wrap;border-top:1px solid #eee;padding-top:22px;margin-top:31px}.setup-agents>span{font-size:11px;color:#999}.setup-agents>div{display:flex;align-items:center;gap:21px;flex-wrap:wrap}.setup-agent{display:flex;align-items:center;gap:6px;font-size:12px;font-weight:500;color:#555}.setup-agent svg{width:22px;height:22px}.setup-preview-note{font-size:10px;line-height:1.8;color:#999;margin:20px 0 15px}.setup-preview-note a{text-decoration:underline;text-underline-offset:3px}.setup-guide{font-size:12px;display:inline-flex;align-items:center;gap:25px}.setup-features{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-top:27px}.setup-features article{padding:24px 22px;border:1px solid #e6e6e9;border-radius:12px;min-width:0;background:#fff}.setup-features svg{width:24px;height:24px;color:#52525b;margin-bottom:27px}.setup-features h3{font-size:14px;line-height:1.4;letter-spacing:-.2px;margin:0 0 10px}.setup-features p{font-size:12px;line-height:1.8;color:#888;margin:0}.library-support{display:flex!important;flex-direction:column;align-items:center;gap:10px!important;margin-top:21px!important}.library-signature{display:flex;align-items:center;gap:9px;border:1px solid #e7e7eb;border-radius:9px;background:#fff;padding:12px 17px;box-shadow:0 3px 9px #18181b04;font-size:13px;color:#777;line-height:1.5}.library-signature svg{width:21px;height:21px;color:#222;margin-left:3px}.library-signature strong{font-size:15px;color:#222;font-weight:550;letter-spacing:-.3px}.library-support>.library-future{font-size:10px;color:#999}.hero-main .release-note{margin-top:13px}@media(max-width:1050px){.setup-layout{gap:35px}.setup-features article{padding:20px 17px}.setup-command>code{font-size:11px;padding:12px}.setup-agents{gap:15px}.setup-agents>div{gap:15px}}@media(max-width:800px){.setup-section{padding-top:52px;padding-bottom:45px}.setup-heading{margin-bottom:38px}.setup-heading h2{font-size:35px;letter-spacing:-1.4px}.setup-heading>p{font-size:15px}.setup-layout{grid-template-columns:1fr;gap:45px}.setup-features{margin-top:22px}.setup-features article{padding:23px}.setup-features svg{margin-bottom:22px}.setup-start{max-width:600px;width:100%;margin:auto}}@media(max-width:480px){.setup-section{padding-left:22px;padding-right:22px}.setup-heading h2{font-size:31px}.setup-definition{font-size:11px}.setup-features{grid-template-columns:1fr;gap:12px}.setup-features article{display:grid;grid-template-columns:26px 1fr;column-gap:17px;padding:21px}.setup-features svg{grid-row:1/3;margin:1px 0 0;width:23px;height:23px}.setup-features h3{margin-bottom:7px}.setup-features p{grid-column:2}.library-signature{padding:10px 12px;gap:6px;font-size:11px}.library-signature strong{font-size:13px}.library-signature svg{width:18px;height:18px}}
/* Each workflow row opens into its own text + visual spread. */
.journey-accordion{display:grid;gap:9px;background:#f2f2f3;border:1px solid #ededee;padding:9px;border-radius:23px}.journey-row{display:grid;grid-template-columns:1fr 1fr;border:1px solid #e9e9ec;border-radius:16px;overflow:hidden;background:#fff}.journey-info{min-width:0}.journey-info h3{margin:0}.journey-toggle{display:flex;align-items:center;gap:17px;width:100%;text-align:left;padding:25px 28px;border:0;background:none;font-size:17px;font-weight:550;letter-spacing:-.4px;line-height:1.4;min-height:101px;color:#29292c}.journey-toggle:focus-visible{outline:2px solid #7c3aed;outline-offset:-4px}.journey-icon{display:grid;place-items:center;width:46px;height:46px;flex-shrink:0;border:1px dashed #d7d7dc;border-radius:13px;background:#fafafa;color:#555}.journey-icon svg{width:21px;height:21px}.journey-row[data-open=true] .journey-icon{background:#222;color:#fff;border-color:#222}.journey-indicator{margin-left:auto;color:#aaa;font-size:17px;font-weight:400}.journey-content{padding:0 32px 32px}.journey-content p{font-size:14px;line-height:1.8;color:#777;max-width:430px;margin:1px 0 25px}.journey-content ul{display:grid;gap:12px;list-style:none;padding:0;margin:0}.journey-content li{display:flex;align-items:center;gap:10px;font-size:12px;line-height:1.6;color:#555}.journey-content li:before{content:'✓';display:grid;place-items:center;width:15px;height:15px;flex-shrink:0;border:1px solid #bf9e77;border-radius:50%;font-size:9px;color:#ad8656}.journey-art{height:101px;min-width:0;display:flex;align-items:center;justify-content:center;overflow:hidden;padding:25px 35px;position:relative;background:#f1f0ee}.journey-row[data-open=true] .journey-art{height:100%;min-height:332px}.journey-art>div{width:100%;max-width:350px;flex-shrink:0;transition:transform .25s,opacity .25s}.journey-row[data-open=false] .journey-art>div{transform:rotate(-5deg) translateY(8px);opacity:.72}.journey-row[data-open=false]:hover .journey-art>div{transform:rotate(-3deg) translateY(1px);opacity:1}.journey-art-connect{background:#f1efea}.journey-art-build{background:#f0f2f7}.journey-art-refine{background:#f2eef7}.journey-art-save{background:#edf3ee}.journey-files,.journey-agent-sheet,.journey-studio,.journey-save{border:1px solid #dddcd8;border-radius:12px;background:#fff;box-shadow:0 12px 30px #312b2110;overflow:hidden}.journey-files>div{display:flex;align-items:center;gap:12px;padding:15px 20px;border-bottom:1px solid #eeedeb}.journey-files>div>span{font-size:11px;color:#aaa}.journey-files code{font-size:11px;color:#555}.journey-files b{font-size:8px;color:#a19c94;font-weight:400;margin-left:auto}.journey-files .journey-folder{font-size:12px;font-weight:500;padding:17px 20px;background:#fafaf9}.journey-folder small{margin-left:auto;font-size:8px;font-weight:400;color:#aaa}.journey-files .journey-source-foot{border:0;justify-content:center;gap:9px;padding:17px}.journey-source-foot svg{width:19px;height:19px;color:#746b60}.journey-files .journey-source-foot>span{font-size:9px;color:#a29a8d}.journey-agent-sheet{padding:21px}.journey-agent-top{display:flex;align-items:center;gap:9px;font-size:10px;color:#8a91a0;margin-bottom:20px}.journey-agent-top svg{width:21px;height:21px;color:#414958}.journey-prompt{font-size:12px;line-height:1.6;background:#f4f5f8;border-radius:8px;padding:13px 15px;margin-bottom:16px;color:#424b5c}.journey-tool-row{display:flex;gap:11px;font-size:10px;color:#929cae;padding:7px 5px}.journey-tool-row code{font-size:10px;color:#7d889d}.journey-code{font-family:ui-monospace,monospace;padding:16px 5px 2px;margin-top:9px;border-top:1px solid #eee;font-size:10px;line-height:1.9;color:#687084}.journey-code span{color:#9a85b1}.journey-code b{font-weight:400;color:#62867a}.journey-studio-top{display:flex;align-items:center;gap:7px;padding:15px 17px;border-bottom:1px solid #eee;font-size:10px}.journey-studio-top svg{width:18px;height:18px}.journey-studio-top strong{font-weight:500}.journey-studio-top>span{margin-left:auto;font-size:8px;color:#aaa}.journey-studio-body{display:grid;grid-template-columns:1.2fr 1fr;min-height:157px}.journey-button-pair{display:flex;align-items:center;justify-content:center;flex-direction:column;gap:10px;background:#fcfbfd}.journey-primary{background:#78608f;color:white;padding:11px 12px;border-radius:8px;font-size:9px}.journey-outline{border:1px solid #ddd8e3;background:white;color:#807789;padding:9px 16px;border-radius:8px;font-size:9px}.journey-properties{border-left:1px solid #eee;padding:20px 14px;font-size:8px}.journey-properties small{display:block;font-size:7px;letter-spacing:1px;color:#aaa;margin-bottom:22px}.journey-properties>div{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px;color:#999;gap:10px}.journey-properties>div>span{display:flex;align-items:center;gap:4px;color:#777}.journey-properties i{width:7px;height:7px;background:#78608f;border-radius:2px}.journey-properties .journey-faux-slider{height:3px;background:#ebe7ef;border-radius:5px;margin-top:20px}.journey-faux-slider i{display:block;margin-left:55%;width:9px;height:9px;border:1px solid #b1a3c0;background:white;border-radius:50%}.journey-studio-bottom{padding:14px 10px;text-align:center;border-top:1px solid #eee;font-size:8px;color:#a296ac}.journey-save-file{display:flex;gap:10px;align-items:center;padding:16px 20px;border-bottom:1px solid #eee;color:#90a094;font-size:11px}.journey-save-file code{font-size:10px;color:#6e7a70}.journey-save-file small{font-size:8px;margin-left:auto;color:#aaa}.journey-diff{display:grid;padding:18px 20px;gap:8px;font-family:ui-monospace,monospace;font-size:10px;line-height:1.5;background:#fafcf9;border-bottom:1px solid #eee}.journey-diff span{color:#bd9393}.journey-diff strong{font-weight:400;color:#779378}.journey-check-commands{display:flex;gap:9px;padding:20px 20px 0}.journey-check-commands code{font-size:9px;border:1px solid #e0e8df;padding:6px 9px;border-radius:5px;color:#7b8d7c}.journey-save>p{font-size:9px;color:#9ca79b;margin:16px 20px 20px}@media(max-width:1050px){.capability-scene{grid-template-columns:1fr}.scene-copy{padding:21px 23px}.scene-copy h3 br{display:none}.scene-art{min-height:175px}.scene-reuse{padding-top:20px;padding-bottom:48px}.scene-context{padding:18px}.context-sheet{width:200px}.scene-copy h3{margin-top:10px}.setup-layout{grid-template-columns:.9fr 1fr}.journey-toggle{font-size:15px;padding:22px 20px;gap:12px}.journey-content{padding:0 23px 27px}.journey-content p{font-size:13px}.journey-art{padding:25px}.journey-files b{display:none}}@media(max-width:800px){.setup-layout{grid-template-columns:1fr}.capability-scene{grid-template-columns:1fr 1fr}.scene-copy h3 br{display:initial}.scene-art{min-height:208px}.journey-row{grid-template-columns:1fr}.journey-row[data-open=false] .journey-art{display:none}.journey-toggle{min-height:84px;padding:18px 20px}.journey-icon{width:42px;height:42px}.journey-row[data-open=true] .journey-art{min-height:280px;height:280px}.journey-content p{max-width:none}.journey-accordion{padding:7px;border-radius:18px}.journey-row{border-radius:12px}}@media(max-width:480px){.scene-copy{padding:20px 16px}.scene-copy h3{font-size:14px}.scene-copy p{font-size:10px}.scene-art{min-height:225px}.tile-button{width:100px;font-size:10px;transform:rotate(-7deg) translate(-5px,0)}.tile-input{width:129px;padding:10px 8px;font-size:8px}.tile-input span{font-size:6px}.scene-context{padding:13px}.context-sheet{width:130px;padding:11px}.context-sheet>div{font-size:8px}.context-sheet p{font-size:6px}.scene-agent-marks{gap:8px}.scene-agent-marks span{padding:6px}.scene-agent-marks svg{width:16px;height:16px}.scene-edit{padding:20px 10px}.scene-swatch-label{width:120px}.scene-example-button{font-size:8px;padding:11px 10px;gap:13px}.journey-toggle{font-size:14px}.journey-art{padding:24px 18px}.journey-files>div{padding:14px}.journey-files code{font-size:10px}.journey-studio-top{padding:14px}.journey-properties{padding:18px 12px}}@media(prefers-reduced-motion:reduce){.journey-art>div,.scene-example-button{transition:none}}
/* Connect first, then show the agent's workflow in its own section. */
.setup-layout{gap:75px}.connect-visual{background:#f7f7f8;border:1px solid #ededf0;border-radius:17px;padding:39px 36px 28px;align-self:start;margin-top:2px}.connect-project{border:1px solid #e2e2e7;border-radius:10px;background:white;overflow:hidden;box-shadow:0 8px 23px #1b1a2305}.connect-project-top{display:flex;align-items:center;gap:9px;padding:18px;border-bottom:1px solid #eee;font-size:12px}.connect-project-top>span{font-size:17px;color:#888}.connect-project-top strong{font-weight:500}.connect-project-top small{font-size:9px;color:#aaa;margin-left:auto}.connect-file{display:flex;justify-content:space-between;align-items:center;gap:13px;padding:19px 18px;border-bottom:1px solid #f2f2f4}.connect-file:last-child{border:0}.connect-file code{font-size:11px;color:#555}.connect-file>span{font-size:9px;color:#999}.connect-thread{height:48px;display:grid;place-items:center;color:#c0bec9;font-size:22px}.connect-canon{display:flex;align-items:center;gap:13px;padding:20px;background:#fff;border:1px solid #e2e2e7;border-radius:11px 11px 0 0}.connect-canon>svg{width:34px;height:34px;color:#29262e;flex-shrink:0}.connect-canon>div{display:grid;gap:5px}.connect-canon strong{font-size:20px;font-weight:550;letter-spacing:-.7px}.connect-canon>div>span{font-size:10px;color:#999}.connect-tag{font-size:8px;padding:5px 7px;background:#f4f4f5;border-radius:4px;color:#999;margin-left:auto}.connect-prepared{padding:20px;background:#fdfdfe;border:1px solid #e2e2e7;border-top:0;border-radius:0 0 11px 11px}.connect-prepared>span{display:block;font-size:8px;letter-spacing:1px;color:#aaa;margin-bottom:16px}.connect-prepared>div{display:flex;align-items:center;gap:12px;padding:10px 0}.connect-prepared i{font-size:12px;font-style:normal;color:#bbb}.connect-prepared code{font-size:10px;color:#777}.connect-prepared small{font-size:9px;color:#aaa;margin-left:auto}.connect-visual>p{font-size:11px;line-height:1.8;color:#999;text-align:center;margin:24px 0 0}.agent-design-section{background:#f8f8f9;border-top:1px solid #f0f0f1;border-bottom:1px solid #f0f0f1;padding:76px 0 44px}.agent-design-section>.wrap{max-width:1320px}.agent-design-heading{display:flex;justify-content:space-between;align-items:end;gap:70px;margin-bottom:38px}.agent-design-heading h2{font-size:39px;line-height:1.16;letter-spacing:-1.6px;margin-bottom:0}.agent-design-heading>p{font-size:14px;color:#777;line-height:1.8;max-width:375px;margin:0}.agent-design-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:25px}.agent-design-grid article{min-width:0}.agent-design-art{height:315px;border:1px solid #e8e7ed;border-radius:14px;position:relative;overflow:hidden;display:flex;align-items:center;justify-content:center;flex-direction:column;background:#fff}.agent-step{display:block;font-family:ui-monospace,monospace;font-size:9px;letter-spacing:.8px;color:#999;margin-top:23px}.agent-design-grid h3{font-size:19px;font-weight:550;letter-spacing:-.5px;line-height:1.4;margin:10px 0}.agent-design-grid article>p{font-size:12px;line-height:1.85;color:#888;margin:0;max-width:350px}.agent-design-tools{display:flex;align-items:center;justify-content:center;gap:35px;border-top:1px solid #e8e8ec;padding-top:29px;margin-top:35px}.agent-design-tools>span{font-size:11px;color:#aaa}.agent-design-tools>div{display:flex;gap:35px;align-items:center}.agent-design-tools>div>span{display:flex;align-items:center;gap:8px;color:#75747b}.agent-design-tools svg{width:22px;height:22px}.agent-design-tools b{font-size:14px;font-weight:500;letter-spacing:-.3px}.workflow-section{padding-top:80px}@media(max-width:1050px){.setup-layout{gap:35px}.connect-visual{padding:28px 23px}.connect-file{padding:18px 14px}.connect-file>span{font-size:8px}.agent-design-heading{gap:40px}.agent-design-heading h2{font-size:34px}.agent-design-heading>p{max-width:320px;font-size:13px}.agent-design-grid{gap:18px}.agent-design-art{height:295px}.design-art-mcp{padding:18px}.mcp-demo-tool{padding:12px 9px;gap:6px}.mcp-demo-tool code{font-size:8px}.library-demo-input{width:200px}.reuse-page{width:255px}}@media(max-width:800px){.connect-visual{max-width:600px;width:100%;margin:auto}.agent-design-section{padding:50px 0 35px}.agent-design-heading{display:block;margin-bottom:30px}.agent-design-heading>p{max-width:500px;margin-top:23px;font-size:14px}.agent-design-grid{grid-template-columns:1fr;gap:38px;max-width:500px;margin:auto}.agent-design-art{height:320px}.agent-design-grid article>p{max-width:none}.library-demo-input{width:235px}.design-art-mcp{padding:35px}.mcp-demo-tool code{font-size:11px}.reuse-page{width:285px}.agent-design-tools{flex-direction:column;gap:22px}.agent-design-tools>div{gap:25px}.workflow-section{padding-top:52px}}@media(max-width:480px){.connect-visual{padding:23px 18px}.connect-file{gap:7px}.connect-file code{font-size:10px}.connect-canon{padding:18px 15px}.connect-canon>div>span{font-size:8px}.connect-prepared{padding:18px 15px}.connect-prepared small{font-size:8px}.agent-design-heading h2{font-size:31px}.agent-design-tools>div{gap:18px}.agent-design-tools svg{width:20px;height:20px}.agent-design-tools b{font-size:12px}.design-art-mcp{padding:24px}.mcp-demo-tool code{font-size:10px}}

.hero-main .library-support{margin-top:26px!important}.setup-guide{margin-top:22px}

/* Center the complete hero message, with room above and below it. */
@media(min-width:951px){.harness-hero{min-height:680px;display:grid;align-items:center;padding:120px 24px}.hero-main{width:100%;margin:0 auto}.hero-main h1{margin-top:0}}
@media(min-width:601px) and (max-width:950px){.harness-hero{padding-top:88px}}
@media(max-width:600px){.harness-hero{padding-top:76px}}
.hero-library-row{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:25px;margin:25px auto 0;font-size:12px;line-height:1.5}
.hero-library-current{display:inline-flex;align-items:center;gap:8px;color:#29272e}.hero-library-current svg{width:18px;height:18px}.hero-library-current strong{font-size:13px;font-weight:550;letter-spacing:-.2px}
.hero-library-planned{display:inline-flex;align-items:center;gap:7px;color:#99969e}.hero-library-planned small{font-size:8px;line-height:1;border:1px solid #e9e7ec;border-radius:4px;padding:4px 5px;color:#aaa6b1}
@media(max-width:480px){.hero-library-row{gap:16px;margin-top:22px;font-size:11px}.hero-library-current strong{font-size:12px}.hero-library-planned{gap:5px}.hero-library-planned small{font-size:7px;padding:4px}}
.agent-design-tools{flex-wrap:wrap;column-gap:30px;row-gap:22px}.agent-design-tools>div{flex-wrap:wrap;justify-content:center;gap:24px 30px}.agent-design-tools>div>span{white-space:nowrap}
@media(max-width:800px){.agent-design-tools>div{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:100%;max-width:480px;gap:24px 18px}.agent-design-tools>div>span{justify-content:center}}
/* A single project, from setup to tool calls to reuse. */
.agent-design-art{height:360px}
.design-art-terminal{background:#eeedf1;padding:23px}
.build-terminal{width:100%;background:#232229;color:#e6e3ed;border:1px solid #33313b;border-radius:11px;box-shadow:0 13px 26px #24212c16;overflow:hidden}
.build-terminal-bar{display:flex;align-items:center;justify-content:space-between;padding:13px 15px;border-bottom:1px solid #3a3742;color:#aaa5b5;font:9px ui-monospace,monospace}
.terminal-dots{display:flex;gap:4px}.terminal-dots i{width:5px;height:5px;border-radius:50%;background:#615b6d}
.build-terminal-body{padding:19px 18px;font:10px/1.75 ui-monospace,monospace}
.terminal-intent{color:#b7adcd;margin-bottom:17px;font-size:11px}
.terminal-command{display:flex;align-items:baseline;gap:8px}.terminal-command>span{color:#b7a2da;flex-shrink:0}.terminal-command code{font:inherit;white-space:pre-wrap;overflow-wrap:anywhere}.terminal-command-space{margin-top:12px}
.terminal-success{color:#a3a0ad;font-size:9px;padding-left:15px}.terminal-success>span{color:#9ebeab;margin-right:4px}
.terminal-ready{display:flex;align-items:center;gap:9px;color:#8f899c;font-size:9px;margin-top:15px}.terminal-ready i{height:11px;width:6px;background:#bcafd2}
.design-art-tools{background:#edf1f7;padding:23px}
.tool-conversation{background:#fff;border:1px solid #dce3ee;border-radius:11px;width:100%;box-shadow:0 10px 24px #293e5e09;overflow:hidden}
.tool-endpoints{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:19px 17px;border-bottom:1px solid #e9edf4}
.tool-endpoints>span{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:550;color:#454f63}
.tool-endpoints>span>i{font:12px ui-monospace,monospace;color:#7c8ba1}.tool-endpoints svg{width:18px;height:18px;color:#73608b;flex-shrink:0}
.tool-endpoints .tool-connection{flex:1;color:#94a0b1;font:8px ui-monospace,monospace;gap:6px}.tool-connection i{height:1px;flex:1;background:#d9e0ea}
.tool-exchange{padding:15px 16px;border-bottom:1px solid #edf0f5}
.agent-tool-call,.agent-tool-reply{display:flex;align-items:center;gap:7px}.agent-tool-call>span{color:#9b8bb9}.agent-tool-call code{font:10px/1.65 ui-monospace,monospace;color:#515c70;overflow-wrap:anywhere}.agent-tool-call b{font-weight:400;color:#8260a3}
.agent-tool-reply{margin:9px 0 0 15px;font-size:9px;color:#8591a3;line-height:1.5}.agent-tool-reply>span:first-child{color:#a6b0be}.agent-tool-reply code{font:9px/1.5 ui-monospace,monospace;color:#826898}
.tool-component{padding:3px 6px;border:1px solid #e5e9f0;border-radius:4px;background:#f7f8fb;font-size:8px;color:#758199}
.tool-conversation-note{display:flex;align-items:center;justify-content:center;gap:6px;font-size:8px;color:#95a0b0;padding:13px 8px}.tool-conversation-note i{width:4px;height:4px;background:#91ac9a;border-radius:50%}
.design-art-reuse{background:#f2eee7;padding:23px 30px}
.inventory-mini,.todo-mini{width:100%;background:#fff;border:1px solid #e5dfd6;border-radius:9px;box-shadow:0 6px 16px #51452e06}
.inventory-mini{padding:14px 15px}.inventory-mini-title{display:flex;align-items:center;justify-content:space-between;gap:8px}.inventory-mini-title>span{display:flex;align-items:center;gap:6px;font-size:10px;font-weight:550;color:#665a70}.inventory-mini-title svg{width:14px;height:14px}.inventory-mini-title small{font-size:8px;color:#aba395}
.inventory-mini-items{display:flex;gap:7px;margin:13px 0 9px}.inventory-mini-items>span{display:flex;align-items:center;justify-content:center;gap:5px;flex:1;padding:7px 4px;border:1px solid #e6dfee;border-radius:5px;background:#f7f4fa;color:#806492;font-size:9px}.inventory-mini-items i{font-style:normal;font-size:10px;color:#a38bb7}.inventory-mini>code{font:8px ui-monospace,monospace;color:#a9a093}
.inventory-reuse-link{display:flex;align-items:center;justify-content:center;gap:8px;width:100%;padding:14px 10px;font:8px ui-monospace,monospace;color:#aa9e8a}.inventory-reuse-link>span{height:1px;background:#dfd8cd;flex:1}.inventory-reuse-link>i{font-size:12px;font-style:normal;color:#928176}
.todo-mini{padding:17px}.todo-mini-title{display:flex;justify-content:space-between;align-items:center}.todo-mini-title strong{font-size:19px;font-weight:550;letter-spacing:-.6px;color:#453c36}.todo-mini-title>span{font-size:8px;color:#a99d8e}
.todo-mini-form{display:flex;gap:6px;margin:13px 0 12px;font-size:9px}.todo-mini-form>span{flex:1;min-width:0;border:1px solid #e6e0e9;border-radius:5px;padding:8px 10px;color:#aba1b3}.todo-mini-form>b{display:flex;align-items:center;gap:12px;font-size:9px;font-weight:400;padding:8px 10px;background:#806492;color:white;border:1px solid #785a8b;border-radius:5px}.todo-mini-form i{font-style:normal}
.todo-mini-task{display:flex;align-items:center;gap:8px;padding:8px 0;font-size:10px;color:#776b61}.todo-mini-task>i{display:grid;place-items:center;flex-shrink:0;width:12px;height:12px;border-radius:3px;border:1px solid #d8d0dc;font-style:normal;font-size:8px;color:#fff}.todo-mini-task.task-complete>i{border-color:#806492;background:#806492}.task-complete>span{text-decoration:line-through;color:#b3a8b7}
@media(min-width:801px) and (max-width:1050px){.design-art-terminal,.design-art-tools{padding:12px}.design-art-reuse{padding:16px}.build-terminal-body{padding:17px 12px;font-size:9px}.terminal-intent{font-size:10px}.tool-endpoints{padding:17px 12px;gap:8px}.tool-exchange{padding:15px 10px}.agent-tool-call code{font-size:9px}.agent-tool-reply{font-size:8px}.tool-component{padding:3px 4px}.inventory-mini{padding:13px 10px}.inventory-mini-items{gap:4px}.inventory-mini-items>span{font-size:8px;gap:3px}}
@media(max-width:800px){.agent-design-art{height:360px}.build-terminal,.tool-conversation,.inventory-mini,.todo-mini{max-width:360px}.inventory-reuse-link{max-width:360px}.build-terminal-body{font-size:11px}.terminal-success{font-size:10px}.agent-tool-call code{font-size:11px}.agent-tool-reply{font-size:10px}.agent-tool-reply code{font-size:10px}.tool-component{font-size:9px}}
@media(max-width:380px){.design-art-terminal,.design-art-tools{padding:15px}.design-art-reuse{padding:20px}.build-terminal-body{font-size:10px;padding:17px 13px}.tool-exchange{padding:15px 11px}.agent-tool-call code{font-size:10px}.agent-tool-reply{font-size:9px}}
/* Keep the longer skill command readable on narrow screens. */
@media(max-width:600px){.hero-main .install{border-radius:20px;gap:12px;padding:10px 10px 10px 16px;text-align:left}.hero-main .install code{white-space:normal;overflow-wrap:anywhere;font-size:12px;line-height:1.7;min-width:0}.hero-main .install button{flex-shrink:0;white-space:nowrap;font-size:12px;padding:10px 14px}.setup-command>code{white-space:pre-wrap;overflow-wrap:anywhere;min-width:0}.setup-command>button{flex-shrink:0}}

/* Equal entry paths for existing applications and new projects. */
.setup-scenarios{display:grid;gap:19px}.setup-scenario{border-left:2px solid #e4e4e7;padding-left:14px;min-width:0}.setup-scenario h4{font-size:12px;font-weight:550;margin:0 0 9px;color:#27272a}.setup-scenario p{font-size:12px;color:#888;line-height:1.8;margin:9px 0 0}.setup-scenario .setup-command>code{font-family:inherit;font-size:12px;line-height:1.65}