@charset "UTF-8";
[hidden]{display:none!important}
:root{color-scheme:light;--paper:#f6f5ef;--ink:#183c31;--body:#4d5d55;--muted:#647568;--line:#dce0d5;--green:#285641;--mint:#e9eedf;--white:#fffefa}
*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:96px}body{margin:0;background:var(--paper);color:var(--ink);font-family:"Microsoft YaHei","PingFang SC",system-ui,sans-serif;-webkit-font-smoothing:antialiased}a{color:inherit}button{font:inherit}a,button,summary{-webkit-tap-highlight-color:transparent}a:focus-visible,button:focus-visible,summary:focus-visible{outline:3px solid #b35c3b;outline-offset:5px}img{max-width:100%;display:block}p{color:var(--body);line-height:1.85}h1,h2,h3,h4,p,figure{margin:0}h1,h2{letter-spacing:-.045em}em{font-style:normal;color:#65846d}.frame{max-width:1320px;margin-inline:auto;padding-inline:48px}
.header{position:sticky;top:0;z-index:20;background:#f6f5eff5;border-bottom:1px solid var(--line);backdrop-filter:blur(14px)}.header-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:24px}.brand{display:flex;gap:10px;align-items:center;text-decoration:none;font-size:22px;font-weight:700;white-space:nowrap}.brand span{font-size:12px;font-weight:400;color:var(--muted);margin-left:12px;padding-left:20px;border-left:1px solid var(--line)}.header nav{display:flex;gap:30px;font-size:13px}.header nav a,.home-link{text-decoration:none}.header a:hover{color:#9d583a}.home-link{font-size:13px}.skip{position:fixed;top:-100px;left:20px;padding:15px;background:var(--ink);color:white;z-index:99}.skip:focus{top:10px}
.hero{display:grid;grid-template-columns:1fr 1.06fr;gap:40px;padding-block:72px 60px;align-items:center}.eyebrow{font-size:11px;letter-spacing:.16em;font-weight:600;color:var(--muted)}.live-dot{display:inline-block;width:7px;height:7px;border-radius:50%;background:#658e64;margin-right:9px}.hero h1{font-size:clamp(38px,4.4vw,62px);line-height:1.28;font-weight:700;margin-top:25px}.hero h1 span{color:#6e8c72}.hero-description{font-size:16px;margin-top:26px}.hero-context{font-size:11px;letter-spacing:.04em;margin-top:18px;color:var(--muted)}.hero-actions{display:flex;align-items:center;gap:26px;margin-top:30px}.button{display:inline-flex;align-items:center;justify-content:space-between;gap:30px;text-decoration:none;background:var(--ink);color:#fffefa;padding:15px 23px;font-size:13px;border-radius:6px;transition:background .2s}.button:hover{background:#37694e}.text-link{font-size:13px;text-underline-offset:6px}.hero-note{font-size:9px;letter-spacing:.18em;margin-top:35px}.hero-visual{height:460px;position:relative;border-radius:100px 12px 12px 12px;overflow:hidden;background:#a9bc96}.hero-visual>img{height:100%;width:100%;object-fit:cover;object-position:65% center}.hero-visual figcaption{position:absolute;inset:auto 0 0;padding:19px 24px;background:linear-gradient(transparent,#183c3199);color:#fff;font-size:11px;display:flex;justify-content:space-between;gap:12px}.visual-caption{opacity:.8;font-size:9px}.visual-stamp{position:absolute;top:32px;right:24px;font-size:9px;letter-spacing:.12em;color:#28432d;text-align:center;line-height:1.5}.visual-stamp b{font-size:32px;font-weight:400}
.chapter-index{display:grid;grid-template-columns:repeat(4,1fr);margin-bottom:84px}.chapter-index a{text-decoration:none;padding:26px 20px;border-block:1px solid var(--line);border-right:1px solid var(--line)}.chapter-index a:first-child{padding-left:0}.chapter-index a:last-child{border-right:0}.chapter-index span{font-size:9px;letter-spacing:.12em;color:var(--muted)}.chapter-index strong{display:block;font-size:14px;font-weight:500;margin-top:12px}.chapter-index i{font-style:normal;float:right;color:#6f8e76}.chapter-index a:hover{background:var(--mint)}.content-shell{display:grid;grid-template-columns:180px minmax(0,1fr);gap:65px;align-items:start}.reading-nav{position:sticky;top:115px;font-size:12px;display:flex;flex-direction:column;align-items:flex-start;gap:20px}.reading-nav>span{font-size:10px;color:var(--muted);letter-spacing:.12em;margin-bottom:7px}.reading-nav a{text-decoration:none;color:var(--muted);border-left:2px solid transparent;padding-left:12px}.reading-nav a:hover,.reading-nav a.is-active{color:var(--green);border-color:var(--green)}.reading-note{margin:15px 0;color:var(--muted);font-size:11px;line-height:1.9}.reading-nav .back-top{font-size:10px;padding:0;border:0}.chapter{margin-bottom:80px;padding-bottom:72px;border-bottom:1px solid var(--line);scroll-margin-top:15px}.section-label{display:flex;justify-content:space-between;gap:16px;font-size:10px;letter-spacing:.12em;color:var(--muted);margin-bottom:20px}.section-label span:last-child{letter-spacing:.06em}.chapter h2{font-size:clamp(30px,3.3vw,44px);line-height:1.35;margin-bottom:20px}.lead{font-size:15px;max-width:760px}.chapter-art{margin-block:30px}.chapter-art img{width:100%;aspect-ratio:2.25;height:auto;object-fit:cover;border-radius:10px;background:var(--mint)}.chapter-art figcaption{text-align:center;font-size:10px;color:var(--muted);padding-top:12px;letter-spacing:.06em}.two-up{display:grid;grid-template-columns:1fr 1fr;gap:32px;margin-block:35px}.two-up h3{font-size:16px;margin-bottom:10px}.two-up p{font-size:13px}
.flow{list-style:none;margin:32px 0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid var(--line);border-radius:8px;overflow:hidden}.flow li{position:relative;padding:20px 15px;background:#ecefe5;border-right:1px solid #d4ddcc}.flow li:last-child{border:0}.flow li:not(:last-child)::after{content:'→';position:absolute;right:-8px;top:28px;z-index:1;color:#71856b;font-size:16px}.flow li>span{display:block;font-size:10px;font-family:monospace;color:#72846e;margin-bottom:10px}.flow strong{font-size:14px;display:block}.flow small{display:block;font-size:10px;line-height:1.8;color:var(--muted);margin-top:8px}.walkthrough,.service-example{padding:26px;background:var(--white);border:1px solid var(--line);border-radius:10px}.panel-heading{display:flex;justify-content:space-between;align-items:center;gap:14px}.panel-heading h3{font-size:17px;margin-top:8px}.panel-heading .eyebrow{font-size:9px}.badge{font-size:10px;white-space:nowrap;display:inline-block;color:#687b61;background:#edf1e7;border:1px solid #dce4d5;border-radius:20px;padding:5px 10px}.walkthrough>p{font-size:13px;margin-top:14px}.step-controls{display:flex;gap:8px;margin-block:22px}.step-controls button{flex:1;padding:11px 8px;cursor:pointer;border:1px solid var(--line);border-radius:5px;font-size:12px;background:transparent;color:var(--body)}.step-controls button[aria-pressed=true]{background:var(--ink);color:white;border-color:var(--ink)}.step-result{background:#f2f4ec;border-left:3px solid #789576;padding:22px;min-height:190px;border-radius:0 6px 6px 0}.step-result>span{font-size:10px;color:var(--muted)}.step-result h4{font-size:16px;margin:12px 0 10px}.step-result p{font-size:12px}.step-result code{display:block;margin-top:17px;font-family:inherit;font-size:11px;color:#687b61;line-height:1.8}.fine-print,.walkthrough>.fine-print{font-size:10px;color:var(--muted);line-height:1.8;margin-top:18px}.engineering{margin-top:20px;border-block:1px solid var(--line)}.engineering summary{padding:19px 0;font-size:13px;cursor:pointer;list-style:none;display:flex;justify-content:space-between;gap:12px}.engineering summary::-webkit-details-marker{display:none}.engineering summary span{font-size:18px;color:var(--muted)}.engineering[open] summary span{transform:rotate(45deg)}.engineering dl{margin:0 0 20px}.engineering dl>div{margin-bottom:15px}.engineering dt{font-size:12px;font-weight:600}.engineering dd{font-size:12px;color:var(--body);line-height:1.8;margin:5px 0}.takeaway{display:grid;grid-template-columns:70px 1fr;gap:20px;margin-top:30px;padding-top:6px}.takeaway>span{font-size:10px;color:#927e51;padding-top:5px;letter-spacing:.1em}.takeaway p{font-size:14px;color:var(--ink);font-weight:500}
.service-example .panel-heading h3{margin:0}.customer-bubble{padding:14px 20px;background:var(--mint);border-radius:12px 12px 0 12px;width:fit-content;margin:26px 0 20px auto;font-size:13px}.answer-bubble{padding:20px;background:#f6f5f0;border:1px solid #e6e6db;border-radius:12px 12px 12px 0}.answer-bubble>span{font-size:10px;font-weight:600;color:var(--green)}.answer-bubble p{font-size:13px;margin-block:10px}.answer-bubble small{font-size:10px;color:var(--muted);line-height:1.8;display:block}.handoff{display:flex;gap:12px;margin-top:18px;align-items:start}.handoff>span{color:#a08951}.handoff p{font-size:11px}.handoff strong{display:block;font-size:11px}.case-study{background:var(--white);border:1px solid var(--line);border-radius:10px;padding:28px;margin-top:30px}.case-study>h3{font-size:24px;letter-spacing:-.035em;margin:22px 0 16px}.case-study>p{font-size:13px}.metric-row{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:25px 0}.metric-row>div{padding:14px 10px;background:#f3f1f7;border-radius:5px;text-align:center}.metric-row b{display:block;font-size:12px;color:#5f416b}.metric-row span{display:block;font-size:10px;margin-top:7px;color:#806b89;line-height:1.6}.survey-preview{margin:22px 0}.survey-preview img{width:100%;height:auto;max-height:530px;object-fit:contain;background:#faf7fd;border-radius:6px}.survey-preview figcaption{text-align:center;font-size:10px;color:var(--muted);line-height:1.8;margin-top:12px}.case-notes{margin:24px 0 0}.case-notes>div{display:grid;grid-template-columns:105px 1fr;gap:15px;padding:14px 0;border-top:1px solid var(--line)}.case-notes dt{font-size:11px;line-height:1.9;font-weight:600}.case-notes dd{font-size:12px;color:var(--body);margin:0;line-height:1.85}
.task-board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-top:24px}.task-board>section{background:#eef0e9;padding:14px 10px;border-radius:6px}.task-board h4{display:flex;align-items:center;gap:6px;font-size:11px;font-weight:500;margin-bottom:17px}.task-board h4 i{height:6px;width:6px;border-radius:50%;background:#b8ad8a}.task-board section:nth-child(2) i{background:#93aa84}.task-board section:nth-child(3) i{background:#3d6d52}.task-board h4>span{margin-left:auto;color:var(--muted);font:10px monospace}.task-card{background:white;border:1px solid var(--line);border-radius:5px;padding:12px}.task-card>small{font-size:9px;color:#8a7a53}.task-card>strong{display:block;font-size:12px;margin:12px 0;line-height:1.7}.task-card>p{font-size:10px;margin-bottom:16px}.task-card>span{font-size:9px;color:var(--muted);border-top:1px solid var(--line);display:block;padding-top:10px}.repo-list{display:grid;gap:18px;margin-top:30px}.repo-card{display:grid;grid-template-columns:65px 1fr;gap:25px;padding:26px;background:var(--white);border:1px solid var(--line);border-radius:8px}.repo-symbol{width:62px;height:62px;display:grid;place-items:center;border-radius:16px;font-size:27px}.film{background:#e7eedf;color:#5e7654}.slides{background:#f4e6d9;color:#ab754f}.tutor{background:#e4e9f0;color:#5f779b}.repo-body h3{font-size:22px;margin:8px 0 12px;letter-spacing:-.02em}.repo-body p{font-size:13px}.repo-body>a{display:flex;justify-content:space-between;gap:15px;padding-top:17px;margin-top:20px;border-top:1px solid var(--line);text-decoration:none;font-size:11px}.repo-body>a span{color:var(--muted);overflow-wrap:anywhere}.repo-body>a:hover{color:#9d583a}.closing{padding:0 0 70px}.closing h2{font-size:30px;line-height:1.5;margin:20px 0 30px}.footer{border-top:1px solid var(--line);padding-block:28px;display:flex;justify-content:space-between;gap:15px;font-size:10px;color:var(--muted)}.footer a{text-decoration:none}
@media(min-width:1550px){.frame{max-width:1420px}.hero-visual{height:500px}.hero h1{font-size:66px}.content-shell{gap:90px}}
@media(max-width:1050px){.frame{padding-inline:32px}.hero{gap:28px}.hero-visual{height:430px}.hero h1{font-size:42px}.content-shell{grid-template-columns:130px minmax(0,1fr);gap:32px}.reading-nav{font-size:11px}.hero-actions{gap:18px}.chapter-index strong{font-size:12px}.chapter-index a{padding-inline:14px}.flow li{padding-inline:12px}.task-board{gap:6px}.task-board>section{padding:12px 7px}.case-study{padding:22px}.panel-heading{flex-wrap:wrap}}
@media(max-width:780px){.frame{padding-inline:24px}.header-inner{height:68px;gap:15px}.header nav{gap:18px;font-size:12px}.brand span,.home-link{display:none}.hero{grid-template-columns:1fr;padding-top:45px;gap:32px}.hero h1{font-size:48px}.hero-visual{height:350px;border-top-left-radius:70px}.hero-visual img{object-position:center 58%}.hero-note{display:none}.hero-description{margin-top:20px}.hero-context{font-size:11px}.chapter-index{grid-template-columns:repeat(2,1fr);margin-bottom:55px}.chapter-index a{padding:20px 14px}.chapter-index a:first-child,.chapter-index a:nth-child(3){padding-left:0}.chapter-index a:nth-child(2){border-right:0}.chapter-index a:nth-child(3),.chapter-index a:nth-child(4){border-top:0}.chapter-index strong{font-size:14px}.content-shell{display:block}.reading-nav{display:none}.chapter{margin-bottom:58px;padding-bottom:50px}.chapter h2{font-size:36px}.section-label{font-size:9px}.lead{font-size:14px}.chapter-art img{aspect-ratio:1.8}.two-up{gap:22px}.closing h2{font-size:28px}}
@media(max-width:480px){.frame{padding-inline:20px}.brand{font-size:19px;gap:7px}.brand img{width:27px;height:27px}.header nav{font-size:11px;gap:14px}.hero h1{font-size:39px}.hero-description{font-size:14px}.hero-context{font-size:10px}.hero-visual{height:290px}.hero-actions{gap:20px}.button{padding:14px 18px;gap:23px}.hero-actions .text-link{font-size:12px}.hero{padding-block:36px 38px}.chapter-index strong{font-size:12px}.chapter-index span{font-size:8px}.chapter-index a{padding:17px 10px}.chapter h2{font-size:30px}.two-up{grid-template-columns:1fr;gap:23px}.flow{grid-template-columns:repeat(2,minmax(0,1fr))}.flow li{padding:17px}.flow li:nth-child(2){border-right:0}.flow li:nth-child(1),.flow li:nth-child(2){border-bottom:1px solid #d4ddcc}.flow li:nth-child(2)::after{display:none}.walkthrough,.service-example,.case-study{padding:18px}.step-controls{gap:5px}.step-controls button{font-size:11px;padding:10px 5px}.step-result{padding:16px;min-height:232px}.step-result h4{font-size:14px}.panel-heading h3{font-size:15px}.takeaway{display:block}.takeaway p{font-size:13px;margin-top:9px}.case-study>h3{font-size:22px}.metric-row{gap:5px}.metric-row>div{padding:12px 5px}.metric-row b{font-size:11px}.metric-row span{font-size:9px}.case-notes>div{grid-template-columns:1fr;gap:5px}.task-board{grid-template-columns:1fr;gap:12px}.task-board>section{padding:15px}.task-board h4{margin-bottom:12px}.task-card strong{margin-block:8px}.task-card>p{margin-bottom:10px}.repo-card{grid-template-columns:42px 1fr;gap:14px;padding:20px 15px}.repo-symbol{width:42px;height:42px;border-radius:10px;font-size:22px}.repo-body .eyebrow{font-size:8px}.repo-body h3{font-size:20px}.repo-body>a{flex-direction:column;gap:7px}.footer{flex-wrap:wrap;font-size:9px}.closing h2{font-size:24px}.visual-caption{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{transition:none!important;animation:none!important}}

/* Anonymized vision case study; synthetic comparison illustrations. */
.vision-intro{display:grid;grid-template-columns:1.1fr 1fr;align-items:center;gap:28px;margin-top:30px;background:var(--white);border:1px solid var(--line);border-radius:12px;overflow:hidden}.vision-intro>img{width:100%;height:100%;object-fit:contain;background:#152638}.vision-intro>div{padding:28px 24px 28px 0}.vision-intro h3{font-size:27px;line-height:1.5;margin:16px 0}.vision-intro p{font-size:12px;margin-bottom:18px}.vision-picker{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 20px}.vision-picker button{padding:10px 14px;border:1px solid var(--line);background:var(--white);color:var(--ink);border-radius:7px;font-size:12px;cursor:pointer}.vision-picker button[aria-pressed=true]{background:var(--ink);color:var(--paper);border-color:var(--ink)}.vision-panel{padding:26px;border:1px solid var(--line);background:var(--white);border-radius:12px;margin-top:20px;min-width:0}.vision-panel-head h3{font-size:22px;line-height:1.6;margin:14px 0 22px}.vision-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px}.vision-pair figure{margin:0;min-width:0}.vision-pair svg{display:block;width:100%;height:auto;border-radius:8px}.vision-pair figcaption{padding:12px 0;font-size:11px;line-height:1.8}.vision-pair figcaption b,.vision-pair figcaption span{display:block}.vision-pair figcaption span{font-size:9px;color:var(--muted)}.vision-prompt{font-size:13px;padding:0 0 18px;line-height:1.9}.vision-output{padding:26px;background:#152638;color:#deebf2;border-radius:12px;margin-top:24px;min-width:0}.vision-output .eyebrow{color:#9cbcc8;font-size:10px;line-height:1.8}.vision-output pre{margin:20px 0;font:12px/1.9 ui-monospace,monospace;white-space:pre-wrap;overflow-wrap:anywhere}.vision-output p{font-size:11px;color:#b1c8d3}.vision-panel .badge{white-space:normal}.vision-intro .badge{white-space:normal}
@media(max-width:780px){.vision-intro{grid-template-columns:1fr}.vision-intro>img{max-height:280px;object-fit:contain;background:#152638}.vision-intro>div{padding:0 24px 25px}.vision-panel{padding:20px}.vision-panel-head h3{font-size:20px}}
@media(max-width:480px){.vision-pair{grid-template-columns:1fr;gap:8px}.vision-picker{gap:6px}.vision-picker button{font-size:11px;padding:10px 11px}.vision-panel{padding:16px}.vision-output{padding:18px}.vision-output pre{font-size:11px}}

#visual-analysis>img{object-fit:contain;background:#152638}
