@import "https://fonts.googleapis.com/css2?family=Bricolage+Grotesque:wght@400;500;700;800&family=Noto+Sans+SC:wght@400;500;700&display=swap";:root{--bg:oklch(96% .015 85);--paper:oklch(98.5% .008 85);--surface:oklch(93% .02 84);--surface-strong:oklch(89% .03 84);--ink:oklch(24% .03 50);--ink-soft:oklch(44% .022 50);--line:oklch(79% .026 78);--brand:oklch(58% .16 38);--brand-deep:oklch(42% .13 32);--signal:oklch(65% .14 140);--warn:oklch(72% .14 78);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.5rem;--space-6:2rem;--space-7:3rem;--space-8:4rem;--space-9:6rem;--shadow-soft:0 28px 60px color-mix(in oklab, var(--brand-deep) 12%, transparent);--shadow-paper:0 12px 30px color-mix(in oklab, var(--ink) 8%, transparent);color:var(--ink);background:radial-gradient(circle at top left, color-mix(in oklab, var(--brand) 15%, transparent), transparent 35%), radial-gradient(circle at bottom right, color-mix(in oklab, var(--signal) 16%, transparent), transparent 40%), linear-gradient(180deg, oklch(98.5% .007 90), var(--bg));font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Noto Sans SC,sans-serif}*{box-sizing:border-box}html{scroll-behavior:smooth}body{min-width:320px;margin:0}body:before{content:"";pointer-events:none;background-image:linear-gradient(color-mix(in oklab, var(--line) 20%, transparent) 1px, transparent 1px), linear-gradient(90deg, color-mix(in oklab, var(--line) 20%, transparent) 1px, transparent 1px);opacity:.45;background-size:36px 36px;position:fixed;inset:0;-webkit-mask-image:linear-gradient(#0003,#0000 20% 80%,#0003);mask-image:linear-gradient(#0003,#0000 20% 80%,#0003)}h1,h2,h3,.eyebrow,.node-kicker,.compare-label,.note-label,.panel-title,.callout-title,.diag-label,.failure-tag,.section-heading p,.controlplane-label{font-family:Bricolage Grotesque,Noto Sans SC,sans-serif}h1,h2,h3,p,li,ol,ul{margin:0}h1{letter-spacing:-.06em;max-width:12ch;font-size:clamp(3.2rem,5vw,6.4rem);line-height:.96}h1 span{color:var(--brand-deep)}h2{letter-spacing:-.04em;font-size:clamp(2rem,3vw,3.25rem);line-height:1.02}h3{font-size:1.2rem;line-height:1.1}p,li{color:var(--ink-soft);font-size:1rem;line-height:1.75}strong,code{color:var(--ink)}code{background:color-mix(in oklab, var(--surface-strong) 60%, white);border-radius:999px;padding:.15rem .45rem;font-family:Bricolage Grotesque,monospace;font-size:.92em}#app{width:min(1280px,100vw - 2rem);padding:var(--space-7) 0 var(--space-9);margin:0 auto}.page-shell{gap:var(--space-6);display:grid}.hero,.diagram-section,.qa-card,.failure-section,.takeaway-section{border:1px solid color-mix(in oklab, var(--line) 85%, white);background:color-mix(in oklab, var(--paper) 92%, white);box-shadow:var(--shadow-paper);border-radius:2rem;position:relative;overflow:hidden}.hero,.diagram-section,.failure-section,.takeaway-section{padding:clamp(1.5rem,3vw,3rem)}.hero{gap:var(--space-6);grid-template-columns:minmax(0,1.35fr) minmax(300px,.85fr);align-items:stretch;min-height:36rem;display:grid}.hero:after,.diagram-section:after,.failure-section:after,.takeaway-section:after,.qa-card:after{content:"";background:radial-gradient(circle, color-mix(in oklab, var(--brand) 16%, transparent), transparent 72%);pointer-events:none;border-radius:50%;width:12rem;height:12rem;position:absolute;inset:auto auto 0 0;transform:translate(-22%,26%)}.hero-copy{align-content:space-between;gap:var(--space-6);display:grid}.hero-lede{max-width:58ch;font-size:1.08rem}.eyebrow{color:var(--brand-deep);text-transform:uppercase;letter-spacing:.16em;font-size:.84rem}.hero-notes{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.hero-notes>div,.hero-panel,.controlplane-strip,.diagnostic-strip,.alb-item,.compare-column,.failure-card{background:color-mix(in oklab, var(--surface) 86%, white)}.hero-notes>div{padding:var(--space-4);border-radius:1.4rem}.note-label,.panel-title,.node-kicker,.compare-label,.callout-title,.diag-label{margin-bottom:var(--space-2);color:var(--ink);letter-spacing:.02em;font-size:.9rem;display:block}.hero-panel{padding:var(--space-5);align-content:start;gap:var(--space-4);border:1px solid color-mix(in oklab, var(--line) 70%, white);border-radius:1.75rem;display:grid}.signal-list,.checklist,.takeaway-list{padding:0;list-style:none}.signal-list{gap:var(--space-4);display:grid}.signal-list li,.checklist li{gap:var(--space-1);display:grid}.signal-list strong,.checklist li:before,.takeaway-list li:before{color:var(--ink)}.diagram-section,.failure-section,.takeaway-section{gap:var(--space-5);display:grid}.section-heading{gap:var(--space-2);display:grid}.pipeline{gap:var(--space-3);grid-template-columns:1fr auto 1fr auto 1fr auto 1fr;align-items:stretch;display:grid}.node{padding:var(--space-5);align-content:start;gap:var(--space-3);border:1px solid color-mix(in oklab, var(--line) 72%, white);border-radius:1.5rem;min-height:15rem;display:grid}.node-client{background:color-mix(in oklab, var(--warn) 15%, var(--paper))}.node-service{background:color-mix(in oklab, var(--brand) 11%, var(--paper))}.node-bridge{background:color-mix(in oklab, var(--signal) 13%, var(--paper))}.node-gateway{background:color-mix(in oklab, var(--brand-deep) 9%, var(--paper))}.pipe{align-content:center;justify-items:center;gap:var(--space-2);min-width:5rem;color:var(--ink-soft);font-size:.85rem;display:grid}.pipe:before{content:"";border-top:2px solid color-mix(in oklab, var(--brand-deep) 65%, white);border-bottom:2px solid color-mix(in oklab, var(--brand-deep) 65%, white);clip-path:polygon(0 35%,76% 35%,76% 0,100% 50%,76% 100%,76% 65%,0 65%);width:100%;height:1rem}.controlplane-strip,.diagnostic-strip{gap:var(--space-4);padding:var(--space-4) var(--space-5);border:1px solid color-mix(in oklab, var(--line) 68%, white);border-radius:1.25rem;grid-template-columns:auto 1fr;align-items:center;display:grid}.controlplane-label{color:var(--brand-deep);text-transform:uppercase;letter-spacing:.16em;font-size:.92rem}.qa-grid{gap:var(--space-6);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.qa-card{gap:var(--space-5);padding:clamp(1.5rem,3vw,2.5rem);display:grid}.answer-block{gap:var(--space-2);max-width:62ch;display:grid}.comparison{gap:var(--space-4);grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.compare-column,.failure-card,.alb-item{padding:var(--space-4);border:1px solid color-mix(in oklab, var(--line) 72%, white);border-radius:1.35rem}.compare-bad{background:color-mix(in oklab, var(--warn) 12%, var(--paper))}.compare-good{background:color-mix(in oklab, var(--signal) 12%, var(--paper))}.checklist{gap:var(--space-3);display:grid}.checklist li{padding-left:1.4rem;position:relative}.checklist li:before{content:"•";position:absolute;top:0;left:.2rem}.callout{padding:var(--space-4);background:color-mix(in oklab, var(--brand) 10%, var(--paper));border-radius:1.35rem}.callout.warm{background:color-mix(in oklab, var(--warn) 16%, var(--paper))}.alb-stack,.failure-grid{gap:var(--space-4);grid-template-columns:repeat(auto-fit,minmax(220px,1fr));display:grid}.alb-item{gap:var(--space-2);display:grid}.alb-item span{color:var(--brand-deep);text-transform:uppercase;letter-spacing:.14em;font-size:.86rem}.failure-grid{align-items:stretch}.failure-card{gap:var(--space-3);display:grid}.failure-tag{background:color-mix(in oklab, var(--brand) 15%, white);width:2rem;height:2rem;color:var(--brand-deep);border-radius:999px;place-items:center;font-size:.9rem;font-weight:700;display:inline-grid}.diagnostic-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.takeaway-list{gap:var(--space-4);counter-reset:step;display:grid}.takeaway-list li{min-height:2.5rem;padding-left:3.6rem;position:relative}.takeaway-list li:before{counter-increment:step;content:counter(step);background:color-mix(in oklab, var(--brand) 18%, white);border-radius:.8rem;place-items:center;width:2.35rem;height:2.35rem;font-family:Bricolage Grotesque,sans-serif;font-weight:700;display:grid;position:absolute;top:-.1rem;left:0}@media (width<=1100px){.hero,.qa-grid,.comparison,.diagnostic-strip,.pipeline{grid-template-columns:1fr}.pipe{min-height:3.5rem}.pipe:before{border-top:none;border-bottom:none;border-left:2px solid color-mix(in oklab, var(--brand-deep) 65%, white);border-right:2px solid color-mix(in oklab, var(--brand-deep) 65%, white);clip-path:polygon(35% 0,65% 0,65% 76%,100% 76%,50% 100%,0 76%,35% 76%);width:1rem;height:100%}.controlplane-strip{grid-template-columns:1fr}}@media (width<=720px){#app{width:min(100vw - 1rem,100%);padding:.5rem 0 4rem}.hero,.diagram-section,.qa-card,.failure-section,.takeaway-section{border-radius:1.4rem;padding:1.2rem}h1{max-width:100%}.hero{min-height:auto}}