/* Shiliu: monochrome typography, pixel branding, readable interaction states. */
:root{
 --refined-surface:var(--sl-paper);
 --refined-ink:var(--sl-ink);
 --refined-muted:var(--sl-secondary);
 --refined-line:var(--sl-border);
 --refined-hover:var(--sl-accent-soft);
 --refined-inverse:var(--sl-paper);
 --refined-dark:var(--sl-night);
 --refined-dark-line:var(--sl-night-raised);
 --refined-shadow:0 18px 48px rgb(0 0 0 / .04);
 --refined-duration:160ms;
 --refined-title:clamp(36px,3.9vw,54px);
 --refined-section-title:clamp(28px,3vw,36px);
 --refined-max:1180px;
}
html{scroll-padding-top:104px;scrollbar-gutter:stable}
body{text-rendering:optimizeLegibility}
.site-header{background:var(--refined-surface);backdrop-filter:none}
.nav-wrap{height:76px}
.site-header nav a{position:relative;display:inline-flex;align-items:center;min-height:44px;padding-block:8px;color:var(--refined-muted);transition:color var(--refined-duration)}
.site-header nav a::after{content:"";position:absolute;left:0;right:0;bottom:6px;height:1px;background:currentColor;transform:scaleX(0);transform-origin:left;transition:transform var(--refined-duration)}
.site-header nav a:hover,.site-header nav a[aria-current="location"]{color:var(--refined-ink);text-decoration:none}
.site-header nav a:hover::after,.site-header nav a[aria-current="location"]::after{transform:scaleX(1)}
.button{transition:background var(--refined-duration),border-color var(--refined-duration),color var(--refined-duration)}
.button:active{transform:none}
.button>span[aria-hidden="true"],.text-link>span[aria-hidden="true"]{transition:transform var(--refined-duration)}
.button:hover>span[aria-hidden="true"],.text-link:hover>span[aria-hidden="true"]{transform:translate(2px,-2px)}
.hero-actions .text-link:hover>span{transform:translateY(2px)}
.hero{padding:94px 0 76px;gap:64px;min-height:640px}
.hero h1{font-size:var(--refined-title);line-height:1.37;font-weight:600;letter-spacing:-1.5px;text-wrap:balance}
.hero-description{max-width:480px;line-height:2;margin-top:27px}
.hero .eyebrow{letter-spacing:.04em}
.hero-actions{margin-top:32px}
.hero .micro{line-height:1.8;color:var(--refined-muted)}
.hero-demo{box-shadow:var(--refined-shadow);border-color:var(--refined-line)}
.demo-label,.tag,.example-label{letter-spacing:.04em}
.user-message{margin-left:22px}
.demo-tabs button{min-height:44px;position:relative;transition:color var(--refined-duration),border-color var(--refined-duration)}
.demo-tabs button:hover{color:var(--refined-ink)}
.demo-panel{min-height:202px}
.demo-row{gap:13px}
.demo-row strong{font-size:13px}
.demo-row small{font-size:12px;line-height:1.6}
.demo-bottom{line-height:1.7}
.agents-section{padding:0 0 56px}
.agents-heading{display:flex;align-items:center;gap:14px;font-size:12px;letter-spacing:.03em;margin-bottom:25px}
.agents-heading::after{content:"";height:1px;background:var(--refined-line);flex:1}
.agents-grid-page{row-gap:25px;column-gap:18px}
.agents-grid-page .agent-badge{font-size:12px;gap:10px;min-height:34px}
.agent-badge img{transition:filter var(--refined-duration),opacity var(--refined-duration)}
.agents-grid-page .agent-badge img{filter:grayscale(1);opacity:.82}
.agents-grid-page .agent-badge:hover img{filter:none;opacity:1}
.agents-note{padding-top:21px;margin-top:25px;border-top:1px solid var(--refined-line);font-size:11px;letter-spacing:.02em}
.capability-strip{border-top:1px solid var(--refined-line);border-bottom:1px solid var(--refined-line)}
.strip-inner{padding-block:22px}
.section-heading h2{font-size:var(--refined-section-title);line-height:1.5;text-wrap:balance}
.section-heading>p:last-child{max-width:680px}
.feature{gap:78px;padding-block:50px;scroll-margin-top:18px}
.feature+.feature{margin-top:35px;border-top:1px solid var(--refined-line);padding-top:76px}
.feature-copy>p{max-width:440px}
.feature h3{letter-spacing:-.5px;line-height:1.55}
.feature-copy .text-link{min-height:38px}
.visual{box-shadow:none;overflow:hidden}
.visual-heading{padding-block:17px}
.skill-item>div{min-width:0}
.skill-item h4{line-height:1.65;overflow-wrap:anywhere}
.skill-item p{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
a.skill-item{transition:background var(--refined-duration)}
a.skill-item:hover{background:var(--wash)}
.skill-symbol{flex-shrink:0}
.space-layout{min-height:330px}
.document-preview{padding:25px}
.document-preview p{font-size:11px;color:var(--refined-muted);margin-top:19px;margin-bottom:7px}
.doc-value{font-size:12px;line-height:1.9;color:var(--refined-ink);max-width:255px}
.document-preview h4{line-height:1.65;margin-top:17px}
.workflow-section{padding-block:88px}
.workflow-grid li{padding-top:22px;border-top-color:var(--refined-ink)}
.workflow-grid h3{margin:18px 0 12px}
.workflow-grid p{line-height:1.95}
.step-resource{line-height:1.8}
.task-example{margin-top:48px;padding-top:30px}
.task-example blockquote{font-weight:400;line-height:2;max-width:850px}
.task-example>.text-link{min-height:44px;margin-top:7px}
.instruction-text{font-size:14px;line-height:2.1}
.copy-small{min-height:34px}
.faq-list summary{gap:22px;line-height:1.8}
.faq-list summary>span{flex-shrink:0;transition:transform var(--refined-duration)}
.faq-list details[open] summary>span{transform:rotate(45deg)}
.faq-list details[open] summary{color:var(--refined-ink)}
.faq-list details p{max-width:620px}
.faq-list summary:hover{color:var(--refined-ink)}
/* The inverse pixel mark has no inherited pale-blue tile or image filter. */
.final-cta{background:var(--refined-dark);border-color:var(--refined-dark);border-radius:var(--sl-radius);padding:70px 30px 66px;margin-bottom:62px}
.final-cta .final-mark{display:grid;place-items:center;width:48px;height:56px;margin:0 auto 23px;background:transparent;border:0;border-radius:0;color:var(--refined-inverse)}
.final-mark .brand-pixel{display:block;width:42px;height:48px;filter:none;image-rendering:pixelated}
.final-cta .eyebrow{margin-top:0;font-size:10px;letter-spacing:.18em;line-height:1.8}
.final-cta h2{font-size:var(--refined-section-title);line-height:1.55;letter-spacing:-.6px;margin-top:22px}
.final-cta .button{min-width:160px;justify-content:space-between}
.final-cta .micro{margin-top:17px;line-height:1.9}
.footer-top>p{line-height:1.8}
.footer-top>div a{display:inline-flex;align-items:center;min-height:38px}
.footer-bottom{line-height:1.8}
/* Copy stays visible; only the long Agent list scrolls on normal-height screens. */
#copy-fallback.connect-dialog{padding:24px 30px 27px;max-height:calc(100dvh - 40px);box-shadow:var(--sl-shadow-raised);scrollbar-width:thin}
#copy-fallback .dialog-top{position:sticky;top:-24px;z-index:2;background:var(--refined-surface);padding-block:5px;margin-bottom:15px}
#copy-fallback .dialog-close{width:44px;height:44px;font-size:25px;border-radius:var(--sl-radius-sm);transition:background var(--refined-duration)}
#copy-fallback h2{font-size:25px;line-height:1.6}
#copy-fallback h2 span{font-weight:500}
#copy-fallback textarea{font-size:13px;line-height:1.95;height:139px;resize:none}
#copy-fallback textarea:focus-visible{outline:2px solid var(--refined-ink);outline-offset:-2px}
.copy-instruction-actions .button{min-height:42px;min-width:112px;justify-content:space-between}
.copy-status{font-variant-numeric:tabular-nums}
.copy-status-mark{border-radius:0;color:var(--refined-ink);background:var(--wash)}
.dialog-agents h3{display:flex;justify-content:space-between;align-items:center;gap:15px;margin-bottom:16px;font-size:12px}
.agent-count{font-size:10px;color:var(--refined-muted);font-weight:400}
.agents-grid-dialog{max-height:221px;overflow-y:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;align-content:start;gap:20px 8px;padding:4px 4px 8px}
.agents-grid-dialog .agent-badge{font-size:10px;line-height:1.5;gap:8px}
.agents-grid-dialog .agent-badge img{width:26px;height:26px}
button:focus-visible,a:focus-visible,summary:focus-visible{outline:2px solid var(--refined-ink);outline-offset:4px}
@media(max-width:1100px){.hero{gap:36px}.hero h1{font-size:clamp(36px,4.4vw,47px)}.feature{gap:48px}.agents-grid-page{column-gap:16px}}
@media(max-width:820px){html{scroll-padding-top:88px}.nav-wrap{height:68px}.hero{padding:62px 0 49px;gap:37px;min-height:0}.hero h1{font-size:47px}.hero-demo{max-width:600px}.agents-section{padding-bottom:44px}.feature{gap:30px;padding-block:35px}.feature+.feature{padding-top:48px;margin-top:19px}.feature-copy>p{max-width:600px}.section{padding-block:68px}.workflow-section{padding-block:65px}.final-cta{padding-block:55px}.site-header nav a::after{display:none}.site-header nav a[aria-current="location"]{background:var(--wash)}}
@media(max-width:560px){:root{--refined-section-title:28px}.nav-wrap{height:64px}.menu-toggle{min-width:44px;min-height:44px}.hero{padding:43px 0 43px;gap:30px}.hero h1{font-size:clamp(29px,8.35vw,36px);line-height:1.45;letter-spacing:-.7px}.hero-description{font-size:14px;line-height:2;margin-top:22px}.hero .micro{margin-top:14px}.hero-actions{margin-top:25px;gap:18px}.hero-actions .text-link{min-height:44px}.demo-body{padding:18px}.user-message{margin-left:16px}.demo-row strong{font-size:12px}.demo-row small{font-size:11px}.demo-panel{min-height:202px}.demo-tabs{gap:24px}.agents-heading{line-height:1.8;gap:10px;font-size:11px}.agents-grid-page{gap:24px 12px}.agents-grid-page .agent-badge{font-size:11px;gap:9px}.agents-note{font-size:11px;padding-top:17px;margin-top:21px;line-height:1.8}.agents-section{padding-bottom:35px}.section{padding-block:56px}.section-heading h2{line-height:1.55;letter-spacing:-.5px}.feature{padding-block:24px;gap:25px}.feature h3{font-size:25px}.feature+.feature{padding-top:42px;margin-top:17px}.feature-copy .text-link{min-height:44px}.document-preview{padding:21px 15px}.document-preview h4{font-size:16px}.doc-value{font-size:11px;line-height:1.85}.space-layout{min-height:345px}.file-tree{padding-inline:9px}.workflow-section{padding-block:54px}.workflow-grid{gap:29px 22px}.workflow-grid h3{font-size:18px}.workflow-grid p{font-size:13px}.step-resource{font-size:10px}.task-example{margin-top:34px;padding-top:24px;gap:14px}.task-example blockquote{font-size:14px;line-height:2}.task-example>.text-link{margin-top:0}.instruction-text{font-size:13px;padding:20px}.instruction-bottom{line-height:1.9}.copy-small{min-height:44px}.faq-list summary{padding-block:19px;font-size:14px}.final-cta{padding:43px 20px 44px;margin-bottom:34px}.final-cta .final-mark{width:42px;height:48px;margin-bottom:22px}.final-mark .brand-pixel{width:35px;height:40px}.final-cta .eyebrow{font-size:9px;letter-spacing:.14em}.final-cta h2{font-size:27px;line-height:1.6;margin-top:19px}.final-cta>p:not(.eyebrow):not(.micro){font-size:13px}.final-cta .micro{font-size:11px}.site-footer{padding-bottom:25px}.footer-top>div{gap:10px 20px}#copy-fallback.connect-dialog{padding:14px 17px 20px;max-height:calc(100dvh - 24px)}#copy-fallback .dialog-top{top:-14px;padding-top:4px;margin-bottom:11px}#copy-fallback h2{font-size:21px}#copy-fallback #copy-description{font-size:12px}#copy-fallback textarea{font-size:12px;height:156px;padding:13px;line-height:1.9}.copy-instruction-actions{padding:9px 10px}.copy-instruction-actions .button{min-width:104px}.agents-grid-dialog{max-height:215px;gap:21px 8px}.agents-grid-dialog .agent-badge{font-size:10px}.dialog-agents h3{font-size:12px}.agent-count{font-size:10px}#copy-fallback .copy-next{font-size:11px;line-height:1.85}}
@media(max-height:650px){#copy-fallback.connect-dialog{max-height:calc(100dvh - 20px)}.agents-grid-dialog{max-height:150px}#copy-fallback .dialog-top{position:static}}
@media(pointer:coarse){.text-link,.account-link,.footer-top>div a{min-height:44px}}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}

.agent-bootstrap { margin:24px 0 0;padding:20px;border:1px solid #e5e7eb;border-radius:12px;overflow-wrap:anywhere; }
.agent-bootstrap summary { cursor:pointer;font-weight:600; }
.agent-bootstrap p { max-width:80ch;margin:12px 0 0;line-height:1.8; }
