:root{--ink-950: #060c17;--ink-900: #0a1322;--ink-800: #0f1c2e;--ink-700: #16283f;--ink-600: #1f3654;--text: #0b1220;--text-soft: #4a5c73;--text-faint: #7c8ea4;--text-invert: #ecf2f8;--text-invert-soft: #a3b5c9;--paper: #ffffff;--paper-tint: #f5f8fa;--paper-deep: #eaf0f4;--line: #dfe7ed;--line-soft: #eef3f6;--line-dark: #1d2f47;--saas: #0e9f8e;--saas-strong: #0a7d70;--saas-ink: #075e55;--saas-soft: rgb(14 159 142 / .1);--saas-line: rgb(14 159 142 / .28);--premise: #d97706;--premise-strong: #b45309;--premise-ink: #92400e;--premise-soft: rgb(217 119 6 / .1);--premise-line: rgb(217 119 6 / .28);--ok: #0f766e;--warn: #b45309;--danger: #b91c1c;--focus: #0e9f8e;--r-sm: 6px;--r-md: 10px;--r-lg: 16px;--r-xl: 22px;--s-1: .25rem;--s-2: .5rem;--s-3: .75rem;--s-4: 1rem;--s-5: 1.25rem;--s-6: 1.5rem;--s-8: 2rem;--s-10: 2.5rem;--s-12: 3rem;--s-16: 4rem;--s-20: 5rem;--s-24: 6rem;--container: 76rem;--container-narrow: 54rem;--header-h: 4.25rem;--font: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Source Han Sans SC", sans-serif;--font-mono: ui-monospace, "SF Mono", "JetBrains Mono", Menlo, Consolas, "Liberation Mono", monospace;--ease: cubic-bezier(.22, .61, .36, 1);--dur: .2s;--shadow-sm: 0 1px 2px rgb(11 18 32 / .05);--shadow-md: 0 4px 16px -4px rgb(11 18 32 / .1);--shadow-lg: 0 20px 48px -16px rgb(11 18 32 / .18)}*,*:before,*:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--header-h) + 1rem)}body{margin:0;font-family:var(--font);font-size:16px;line-height:1.65;color:var(--text);background:var(--paper);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}h1,h2,h3,h4,p,ul,ol,figure,blockquote{margin:0}ul,ol{padding:0;list-style:none}a{color:inherit;text-decoration:none}img,svg{display:block;max-width:100%}button{font:inherit;color:inherit;background:none;border:0;cursor:pointer}table{border-collapse:collapse;width:100%}:focus-visible{outline:2px solid var(--focus);outline-offset:3px;border-radius:3px}::selection{background:var(--saas-soft)}.h1{font-size:clamp(2rem,4.4vw,3.4rem);font-weight:700;line-height:1.14;letter-spacing:-.028em}.h2{font-size:clamp(1.5rem,2.6vw,2.15rem);font-weight:700;line-height:1.22;letter-spacing:-.022em}.h3{font-size:1.125rem;font-weight:650;line-height:1.35;letter-spacing:-.012em}.lede{font-size:clamp(1rem,1.5vw,1.15rem);line-height:1.7;color:var(--text-soft)}.small{font-size:.875rem;line-height:1.6;color:var(--text-soft)}.mono{font-family:var(--font-mono);font-variant-numeric:tabular-nums}.eyebrow{display:inline-flex;align-items:center;gap:.5rem;font-family:var(--font-mono);font-size:.72rem;font-weight:500;letter-spacing:.12em;text-transform:uppercase;color:var(--text-faint)}.eyebrow:before{content:"";width:18px;height:1px;background:currentColor;opacity:.5}.wrap{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:var(--s-5)}.wrap--narrow{max-width:var(--container-narrow)}.section{padding-block:clamp(3.5rem,7vw,6rem)}.section--tint{background:var(--paper-tint)}.section--dark{background:var(--ink-900);color:var(--text-invert)}.section--tight{padding-block:clamp(2.5rem,4vw,3.5rem)}.section-head{display:flex;flex-direction:column;gap:var(--s-3);max-width:46rem;margin-bottom:var(--s-10)}.section-head--center{align-items:center;text-align:center;margin-inline:auto}.section--dark .lede,.section--dark .small,.section--dark .eyebrow{color:var(--text-invert-soft)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.78rem 1.4rem;font-size:.95rem;font-weight:600;letter-spacing:-.005em;border-radius:var(--r-md);border:1px solid transparent;transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),color var(--dur) var(--ease),transform var(--dur) var(--ease);white-space:nowrap}.btn:active{transform:translateY(1px)}.btn--primary{background:var(--ink-900);color:#fff}.btn--primary:hover{background:var(--ink-700)}.btn--saas{background:var(--saas);color:#fff}.btn--saas:hover{background:var(--saas-strong)}.btn--premise{background:var(--premise);color:#fff}.btn--premise:hover{background:var(--premise-strong)}.btn--line{background:transparent;border-color:var(--line);color:var(--text)}.btn--line:hover{border-color:var(--text-faint);background:var(--paper-tint)}.btn--ghost{background:transparent;color:var(--text-soft);padding-inline:.9rem}.btn--ghost:hover{color:var(--text)}.btn--sm{padding:.5rem .9rem;font-size:.85rem}.btn--block{width:100%}.btn--invert{background:#fff;color:var(--ink-900)}.btn--invert:hover{background:#dbe6ef}.btn--outline-invert{background:transparent;border-color:#ffffff47;color:var(--text-invert)}.btn--outline-invert:hover{border-color:#fff9;background:#ffffff0f}.btn-row{display:flex;flex-wrap:wrap;gap:var(--s-3)}.site-header{position:sticky;top:0;z-index:50;height:var(--header-h);background:#ffffffdb;-webkit-backdrop-filter:saturate(180%) blur(14px);backdrop-filter:saturate(180%) blur(14px);border-bottom:1px solid var(--line-soft)}.site-header__inner{display:flex;align-items:center;gap:var(--s-6);height:100%}.brand{display:inline-flex;align-items:center;gap:.6rem;font-weight:700;letter-spacing:-.02em;flex-shrink:0}.brand__mark{display:grid;place-items:center;width:30px;height:30px;border-radius:8px;background:var(--ink-900);color:#fff;font-family:var(--font-mono);font-size:.72rem;font-weight:600;letter-spacing:0}.brand__name{font-size:1.02rem}.brand__sub{font-size:.7rem;font-weight:500;color:var(--text-faint);letter-spacing:.02em}.nav-wrap{display:flex;align-items:center;margin-left:auto}.site-nav{display:flex;align-items:center;gap:.15rem}.site-nav__link{padding:.45rem .7rem;font-size:.9rem;font-weight:550;color:var(--text-soft);border-radius:var(--r-sm);transition:color var(--dur) var(--ease),background var(--dur) var(--ease)}.site-nav__link:hover{color:var(--text);background:var(--paper-tint)}.site-nav__link.is-active{color:var(--text)}.site-nav__link.is-active:after{content:"";display:block;height:2px;margin-top:2px;background:var(--saas);border-radius:1px}.header-actions{display:flex;align-items:center;gap:var(--s-2);margin-left:var(--s-4)}.nav-toggle{display:none;margin-left:auto;padding:.4rem}.nav-toggle span{display:block;width:20px;height:2px;background:var(--text);border-radius:1px}.nav-toggle span+span{margin-top:5px}.hero{position:relative;overflow:hidden;background:var(--ink-950);color:var(--text-invert);padding-block:clamp(3.5rem,8vw,6.5rem) clamp(3rem,6vw,5rem)}.hero:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(60rem 32rem at 78% -10%,rgb(14 159 142 / .2),transparent 62%),radial-gradient(48rem 26rem at 8% 108%,rgb(217 119 6 / .13),transparent 60%);pointer-events:none}.hero:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgb(255 255 255 / .032) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / .032) 1px,transparent 1px);background-size:56px 56px;-webkit-mask-image:radial-gradient(70% 60% at 50% 30%,#000 30%,transparent 78%);mask-image:radial-gradient(70% 60% at 50% 30%,#000 30%,transparent 78%);pointer-events:none}.hero__inner{position:relative;z-index:1;display:grid;grid-template-columns:minmax(0,1.08fr) minmax(0,.92fr);gap:clamp(2rem,4vw,4rem);align-items:center}.hero__badge{display:inline-flex;align-items:center;gap:.5rem;padding:.3rem .7rem .3rem .4rem;margin-bottom:var(--s-5);font-size:.8rem;color:var(--text-invert-soft);background:#ffffff0d;border:1px solid rgb(255 255 255 / .1);border-radius:999px}.hero__badge b{display:inline-flex;align-items:center;padding:.1rem .45rem;font-size:.7rem;font-weight:600;color:var(--ink-950);background:var(--saas);border-radius:999px}.hero .h1{color:#fff;font-size:clamp(1.9rem,3.9vw,3rem)}.hero__lede{margin-top:var(--s-5);max-width:37rem;font-size:clamp(.98rem,1.4vw,1.08rem);line-height:1.75;color:var(--text-invert-soft)}.hero .btn-row{margin-top:var(--s-8)}.hero__note{margin-top:var(--s-4);font-size:.82rem;color:#a3b5c9d9}.hero__stats{display:flex;flex-wrap:wrap;gap:var(--s-8);margin-top:var(--s-10);padding-top:var(--s-6);border-top:1px solid rgb(255 255 255 / .09)}.hero__stat b{display:block;font-family:var(--font-mono);font-size:1.35rem;font-weight:600;color:#fff;letter-spacing:-.02em}.hero__stat span{font-size:.8rem;color:var(--text-invert-soft)}.line-picker{display:flex;flex-direction:column;gap:var(--s-3)}.line-card{position:relative;display:block;padding:var(--s-5) var(--s-6);background:#ffffff0b;border:1px solid rgb(255 255 255 / .1);border-radius:var(--r-lg);transition:background var(--dur) var(--ease),border-color var(--dur) var(--ease),transform var(--dur) var(--ease)}.line-card:hover{transform:translate(3px);background:#ffffff13}.line-card--saas:hover{border-color:var(--saas-line)}.line-card--premise:hover{border-color:var(--premise-line)}.line-card__top{display:flex;align-items:center;gap:.5rem;margin-bottom:.3rem}.line-card__dot{width:8px;height:8px;border-radius:50%;flex-shrink:0}.line-card--saas .line-card__dot{background:var(--saas);box-shadow:0 0 0 4px #0e9f8e2e}.line-card--premise .line-card__dot{background:var(--premise);box-shadow:0 0 0 4px #d977062e}.line-card__label{font-size:.98rem;font-weight:650;color:#fff}.line-card__tag{margin-left:auto;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.06em;padding:.1rem .4rem;border-radius:999px;border:1px solid rgb(255 255 255 / .16);color:var(--text-invert-soft)}.line-card__desc{font-size:.86rem;color:var(--text-invert-soft);line-height:1.6}.line-card__price{margin-top:.5rem;font-size:.8rem;font-family:var(--font-mono);color:#ecf2f8e6}.compare{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-5)}.compare__col{display:flex;flex-direction:column;padding:var(--s-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg)}.compare__col--saas{border-top:3px solid var(--saas)}.compare__col--premise{border-top:3px solid var(--premise)}.compare__head{display:flex;align-items:baseline;gap:.6rem;padding-bottom:var(--s-4);border-bottom:1px solid var(--line-soft)}.compare__name{font-size:1.1rem;font-weight:700;letter-spacing:-.015em}.compare__hint{font-size:.78rem;color:var(--text-faint)}.compare__rows{display:flex;flex-direction:column;margin-top:var(--s-2)}.compare__row{display:flex;align-items:flex-start;gap:.6rem;padding:.6rem 0;font-size:.9rem;border-bottom:1px dashed var(--line-soft)}.compare__row:last-child{border-bottom:0}.compare__key{flex:0 0 5.6rem;color:var(--text-faint);font-size:.84rem}.compare__val{flex:1;color:var(--text)}.compare__col .btn{margin-top:auto}.grid{display:grid;gap:var(--s-4)}.grid--2{grid-template-columns:repeat(2,minmax(0,1fr))}.grid--3{grid-template-columns:repeat(3,minmax(0,1fr))}.grid--4{grid-template-columns:repeat(4,minmax(0,1fr))}.card{padding:var(--s-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}.card--hover:hover{border-color:var(--line-strong, #c8d4dd);box-shadow:var(--shadow-md)}.card__title{display:flex;align-items:center;gap:.5rem;font-size:1rem;font-weight:650;letter-spacing:-.01em}.card__body{margin-top:.5rem;font-size:.9rem;line-height:1.7;color:var(--text-soft)}.layers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4)}.layer{display:flex;flex-direction:column;padding:var(--s-6);background:var(--paper);border:1px solid var(--line);border-top:3px solid var(--line);border-radius:var(--r-lg)}.layer--operate{border-top-color:var(--premise)}.layer--execute{border-top-color:var(--saas)}.layer--support{border-top-color:var(--text-faint)}.layer__top{display:flex;align-items:center;justify-content:space-between;gap:var(--s-3)}.layer__index{font-family:var(--font-mono);font-size:.78rem;letter-spacing:.08em;color:var(--text-faint)}.layer__badge{padding:.2rem .55rem;font-size:.72rem;border-radius:999px;background:var(--paper-deep);color:var(--text-soft);white-space:nowrap}.layer__name{margin-top:var(--s-4);font-size:1.12rem;font-weight:680;letter-spacing:-.01em;color:var(--text)}.layer__q{margin-top:.45rem;font-size:.92rem;font-weight:600;line-height:1.5}.layer--operate .layer__q{color:var(--premise-ink)}.layer--execute .layer__q{color:var(--saas-ink)}.layer--support .layer__q{color:var(--text-soft)}.layer__desc{margin-top:.6rem;font-size:.875rem;line-height:1.72;color:var(--text-soft)}.layer__domains{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:auto;padding-top:var(--s-5)}.layer__domain{padding:.22rem .5rem;font-size:.74rem;color:var(--text-soft);background:var(--paper-tint);border:1px solid var(--line-soft);border-radius:var(--r-sm)}.scope-note{display:flex;gap:var(--s-4);margin-top:var(--s-6);padding:var(--s-5);background:var(--paper-tint);border-left:3px solid var(--warn);border-radius:var(--r-md)}.scope-note__label{flex:0 0 auto;padding-top:.1rem;font-size:.74rem;font-weight:700;letter-spacing:.06em;color:var(--warn);white-space:nowrap}.scope-note__body{font-size:.875rem;line-height:1.78;color:var(--text-soft)}.layer-tag{flex:0 0 auto;padding:.16rem .42rem;font-size:.68rem;font-weight:600;border-radius:4px;white-space:nowrap}.layer-tag--operate{background:var(--premise-soft);color:var(--premise-ink)}.layer-tag--execute{background:var(--saas-soft);color:var(--saas-ink)}.layer-tag--support{background:var(--paper-deep);color:var(--text-soft)}.pain{display:flex;gap:var(--s-4);padding:var(--s-5) 0;border-bottom:1px solid var(--line-soft)}.pain__no{flex:0 0 2.2rem;font-family:var(--font-mono);font-size:.8rem;color:var(--saas);padding-top:.2rem}.pain__title{font-size:1rem;font-weight:650;letter-spacing:-.01em}.pain__desc{margin-top:.3rem;font-size:.9rem;line-height:1.7;color:var(--text-soft)}.chip{display:inline-flex;align-items:center;gap:.3rem;padding:.16rem .5rem;font-size:.74rem;font-weight:600;line-height:1.5;border-radius:999px;border:1px solid var(--line);color:var(--text-soft);white-space:nowrap}.chip--saas{color:var(--saas-ink);background:var(--saas-soft);border-color:var(--saas-line)}.chip--premise{color:var(--premise-ink);background:var(--premise-soft);border-color:var(--premise-line)}.chip--starter{color:var(--text-soft);background:var(--paper-tint)}.chip--pro{color:var(--saas-ink);background:var(--saas-soft);border-color:var(--saas-line)}.chip--ent{color:var(--premise-ink);background:var(--premise-soft);border-color:var(--premise-line)}.chip-row{display:flex;flex-wrap:wrap;gap:.4rem}.tour{display:flex;flex-direction:column;gap:var(--s-3)}.tour__tabs{display:flex;flex-wrap:wrap;gap:.4rem;padding-bottom:var(--s-4);border-bottom:1px solid var(--line-soft)}.tour__tab{display:inline-flex;align-items:center;gap:.45rem;padding:.5rem .9rem;font-size:.88rem;font-weight:600;color:var(--text-soft);border:1px solid transparent;border-radius:var(--r-md);transition:all var(--dur) var(--ease)}.tour__tab:hover{background:var(--paper-tint);color:var(--text)}.tour__tab.is-active{background:var(--ink-900);color:#fff}.tour__tab-no{font-family:var(--font-mono);font-size:.72rem;opacity:.55}.tour__panel{display:grid;grid-template-columns:minmax(0,.86fr) minmax(0,1.14fr);gap:clamp(1.5rem,3vw,3rem);align-items:center;padding-top:var(--s-5)}.tour__copy{display:flex;flex-direction:column;gap:var(--s-3)}.tour__points{display:flex;flex-direction:column;gap:.55rem;margin-top:var(--s-2)}.tour__point{display:flex;gap:.55rem;font-size:.9rem;line-height:1.6;color:var(--text-soft)}.tour__point:before{content:"";flex:0 0 5px;height:5px;margin-top:.55rem;border-radius:50%;background:var(--saas)}.tour__shot{overflow:hidden;border:1px solid var(--line);border-radius:var(--r-lg);background:var(--paper-tint);box-shadow:var(--shadow-lg)}.tour__shot img{width:100%;height:auto}.tour__cap{padding:.6rem .9rem;font-size:.78rem;color:var(--text-faint);border-top:1px solid var(--line-soft);background:var(--paper)}.flayer{margin-top:var(--s-12);padding-left:var(--s-6);border-left:3px solid var(--line)}.flayer:first-of-type{margin-top:var(--s-8)}.flayer:nth-of-type(1){border-left-color:var(--premise)}.flayer:nth-of-type(2){border-left-color:var(--saas)}.flayer:nth-of-type(3){border-left-color:var(--text-faint)}.flayer__head{display:flex;align-items:flex-start;gap:var(--s-4);margin-bottom:var(--s-2)}.flayer__index{padding-top:.25rem;font-size:.78rem;letter-spacing:.08em;color:var(--text-faint)}.flayer__name{font-size:1.35rem;font-weight:700;letter-spacing:-.02em;color:var(--text)}.flayer__q{margin-top:.15rem;font-size:.95rem;font-weight:600;color:var(--text)}.flayer__desc{margin-top:.4rem;font-size:.86rem;line-height:1.7;color:var(--text-soft)}.fgroup{border-top:1px solid var(--line-soft);padding-top:var(--s-6);margin-top:var(--s-6)}.fgroup:first-child{border-top:0;margin-top:0;padding-top:0}.fgroup__head{display:flex;align-items:baseline;gap:var(--s-3);margin-bottom:var(--s-5)}.fgroup__code{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.1em;color:var(--text-faint)}.fgroup__name{font-size:1.2rem;font-weight:700;letter-spacing:-.018em}.fgroup__sum{font-size:.88rem;color:var(--text-soft)}.fitem{display:flex;flex-direction:column;gap:.3rem;padding:var(--s-4);border:1px solid var(--line-soft);border-radius:var(--r-md);background:var(--paper)}.fitem__top{display:flex;align-items:flex-start;gap:.5rem}.fitem__title{font-size:.92rem;font-weight:650;letter-spacing:-.008em}.fitem__title+.chip{margin-left:auto;flex-shrink:0}.fitem__desc{font-size:.84rem;line-height:1.65;color:var(--text-soft)}.ind{display:flex;flex-direction:column;gap:.4rem;padding:var(--s-5);border:1px solid var(--line);border-radius:var(--r-md);background:var(--paper)}.ind__code{font-family:var(--font-mono);font-size:.66rem;letter-spacing:.08em;color:var(--text-faint);text-transform:uppercase}.ind__name{font-size:1rem;font-weight:650}.ind__desc{font-size:.84rem;color:var(--text-soft);line-height:1.6}.ind__scenes{display:flex;flex-direction:column;gap:.2rem;margin-top:.3rem;padding-top:.5rem;border-top:1px dashed var(--line-soft)}.ind__scene{font-size:.8rem;color:var(--text-faint)}.ind__scene:before{content:"· "}.price-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--s-4);align-items:stretch}.pcard{position:relative;display:flex;flex-direction:column;padding:var(--s-6);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg)}.pcard--hl{border-color:var(--saas-line);box-shadow:0 0 0 1px var(--saas-line),var(--shadow-md)}.pcard--premise{border-top:3px solid var(--premise)}.pcard--saas{border-top:3px solid var(--saas)}.pcard__flag{position:absolute;top:-.7rem;left:var(--s-5);padding:.12rem .55rem;font-size:.7rem;font-weight:600;color:#fff;background:var(--saas);border-radius:999px}.pcard__name{font-size:1rem;font-weight:700;letter-spacing:-.01em}.pcard__tagline{margin-top:.2rem;min-height:3.85em;font-size:.82rem;line-height:1.55;color:var(--text-soft)}.pcard__price{display:flex;align-items:baseline;gap:.3rem;margin-top:var(--s-4);padding-bottom:var(--s-4);border-bottom:1px solid var(--line-soft)}.pcard__num{font-family:var(--font);font-variant-numeric:tabular-nums;font-size:1.85rem;font-weight:700;letter-spacing:-.025em;line-height:1.15}.pcard__unit{font-size:.78rem;color:var(--text-faint)}.pcard__meta{display:flex;flex-wrap:wrap;gap:.3rem;margin-top:var(--s-3)}.pcard__list{display:flex;flex-direction:column;gap:.45rem;margin-top:var(--s-4);font-size:.85rem;line-height:1.55;color:var(--text-soft)}.pcard__list li{display:flex;gap:.5rem}.pcard__list li:before{content:"✓";flex-shrink:0;color:var(--saas);font-weight:700}.pcard--premise .pcard__list li:before{color:var(--premise)}.pcard .btn{margin-top:auto}.pcard__cta{margin-top:auto;padding-top:var(--s-5)}.matrix{overflow-x:auto;border:1px solid var(--line);border-radius:var(--r-lg)}.matrix table{min-width:44rem;font-size:.88rem}.matrix th,.matrix td{padding:.7rem 1rem;text-align:left;border-bottom:1px solid var(--line-soft);vertical-align:middle}.matrix thead th{background:var(--paper-tint);font-size:.8rem;font-weight:650;letter-spacing:.02em;color:var(--text-soft);white-space:nowrap}.matrix--packages table{table-layout:fixed}.matrix--packages th:first-child{width:40%}.matrix--packages th:not(:first-child){width:20%}.matrix--packages td{overflow-wrap:anywhere;padding:.55rem 1rem}.matrix--packages tbody tr:hover td{background:#f8fbfc}.matrix--packages tbody tr.matrix__group:hover td{background:var(--paper-tint)}.matrix tbody tr:last-child td{border-bottom:0}.matrix td.is-yes{color:var(--saas-ink);font-weight:600}.matrix td.is-no{color:var(--text-faint)}.matrix__group td{background:var(--paper-tint);font-size:.76rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint)}.tut-filter{display:flex;flex-wrap:wrap;gap:.4rem;margin-bottom:var(--s-6)}.tut-filter__btn{padding:.42rem .85rem;font-size:.86rem;font-weight:550;color:var(--text-soft);border:1px solid var(--line);border-radius:999px;transition:all var(--dur) var(--ease)}.tut-filter__btn:hover{border-color:var(--text-faint);color:var(--text)}.tut-filter__btn.is-active{background:var(--ink-900);border-color:var(--ink-900);color:#fff}.tut-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-4)}.tut-card{display:flex;flex-direction:column;gap:.5rem;padding:var(--s-5);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-lg);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease),transform var(--dur) var(--ease)}.tut-card:hover{border-color:var(--saas-line);box-shadow:var(--shadow-md);transform:translateY(-2px)}.tut-card__meta{display:flex;align-items:center;gap:.4rem;font-size:.74rem;color:var(--text-faint)}.tut-card__title{font-size:1rem;font-weight:650;line-height:1.4;letter-spacing:-.012em}.tut-card__sum{font-size:.85rem;line-height:1.62;color:var(--text-soft)}.tut-card__foot{display:flex;align-items:center;gap:.5rem;margin-top:auto;padding-top:var(--s-3);font-size:.76rem;color:var(--text-faint)}.article{display:grid;grid-template-columns:minmax(0,1fr) 16rem;gap:clamp(2rem,4vw,4rem);align-items:start}.article__body{max-width:46rem}.article__head{padding-bottom:var(--s-6);border-bottom:1px solid var(--line);margin-bottom:var(--s-8)}.article__meta{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:var(--s-3)}.article__goal{margin-top:var(--s-5);padding:var(--s-4) var(--s-5);background:var(--saas-soft);border-left:3px solid var(--saas);border-radius:0 var(--r-sm) var(--r-sm) 0;font-size:.9rem;line-height:1.7}.article__goal b{display:block;font-size:.74rem;letter-spacing:.08em;text-transform:uppercase;color:var(--saas-ink);margin-bottom:.2rem}.article h2{font-size:1.2rem;font-weight:700;letter-spacing:-.018em;margin-top:var(--s-10);margin-bottom:var(--s-4)}.pre-list{display:flex;flex-direction:column;gap:.35rem;font-size:.9rem;color:var(--text-soft)}.pre-list li:before{content:"— ";color:var(--text-faint)}.steps{display:flex;flex-direction:column;gap:var(--s-5);counter-reset:step}.step{position:relative;padding-left:2.6rem;counter-increment:step}.step:before{content:counter(step,decimal-leading-zero);position:absolute;left:0;top:.1rem;font-family:var(--font-mono);font-size:.78rem;font-weight:600;color:var(--saas)}.step:after{content:"";position:absolute;left:.62rem;top:1.5rem;bottom:-1.1rem;width:1px;background:var(--line)}.step:last-child:after{display:none}.step__title{font-size:.98rem;font-weight:650;letter-spacing:-.01em}.step__body{margin-top:.3rem;font-size:.9rem;line-height:1.75;color:var(--text-soft)}.pitfall{padding:var(--s-4) 0;border-bottom:1px solid var(--line-soft)}.pitfall:last-child{border-bottom:0}.pitfall__q{font-size:.92rem;font-weight:650;color:var(--text)}.pitfall__q:before{content:"Q ";font-family:var(--font-mono);font-size:.78rem;color:var(--premise)}.pitfall__a{margin-top:.3rem;font-size:.89rem;line-height:1.72;color:var(--text-soft)}.article__side{position:sticky;top:calc(var(--header-h) + 1.5rem);display:flex;flex-direction:column;gap:var(--s-5)}.side-box{padding:var(--s-4) var(--s-5);background:var(--paper-tint);border-radius:var(--r-md)}.side-box__title{font-size:.74rem;font-weight:650;letter-spacing:.08em;text-transform:uppercase;color:var(--text-faint);margin-bottom:var(--s-3)}.side-box__link{display:block;padding:.3rem 0;font-size:.86rem;color:var(--text-soft);line-height:1.5}.side-box__link:hover{color:var(--saas-ink)}.faq-group+.faq-group{margin-top:var(--s-10)}.faq-group__name{font-size:.78rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:var(--text-faint);margin-bottom:var(--s-2)}.faq-item{border-bottom:1px solid var(--line-soft)}.faq-item__q{display:flex;align-items:center;gap:var(--s-3);width:100%;padding:var(--s-4) 0;text-align:left;font-size:.96rem;font-weight:600;letter-spacing:-.008em}.faq-item__q:hover{color:var(--saas-ink)}.faq-item__icon{margin-left:auto;flex-shrink:0;width:1.1rem;height:1.1rem;display:grid;place-items:center;font-family:var(--font-mono);font-size:.9rem;color:var(--text-faint);transition:transform var(--dur) var(--ease)}.faq-item.is-open .faq-item__icon{transform:rotate(45deg)}.faq-item__a{padding:0 0 var(--s-5);max-width:46rem;font-size:.9rem;line-height:1.78;color:var(--text-soft)}.cta{position:relative;overflow:hidden;padding-block:clamp(3rem,6vw,5rem);background:var(--ink-900);color:var(--text-invert)}.cta:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(40rem 20rem at 15% 0%,rgb(14 159 142 / .16),transparent 65%),radial-gradient(36rem 18rem at 88% 100%,rgb(217 119 6 / .12),transparent 62%);pointer-events:none}.cta__inner{position:relative;z-index:1;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:var(--s-6)}.cta__copy{max-width:34rem}.cta .h2{color:#fff}.cta__sub{margin-top:var(--s-3);font-size:.95rem;line-height:1.7;color:var(--text-invert-soft)}.site-footer{padding-block:var(--s-16) var(--s-8);background:var(--ink-950);color:var(--text-invert-soft);font-size:.86rem}.footer__top{display:grid;grid-template-columns:minmax(0,1.6fr) repeat(3,minmax(0,1fr));gap:var(--s-8);padding-bottom:var(--s-10);border-bottom:1px solid var(--line-dark)}.footer__brand{display:flex;flex-direction:column;gap:var(--s-3);max-width:22rem}.footer__brand .brand{color:#fff}.footer__brand .brand__mark{background:#ffffff1a}.footer__tagline{font-size:.86rem;line-height:1.7;color:var(--text-invert-soft)}.footer__group-title{font-size:.74rem;font-weight:650;letter-spacing:.1em;text-transform:uppercase;color:#a3b5c9b3;margin-bottom:var(--s-3)}.footer__link{display:block;padding:.22rem 0;color:var(--text-invert-soft);font-size:.86rem;transition:color var(--dur) var(--ease)}.footer__link:hover{color:#fff}.footer__bottom{display:flex;flex-wrap:wrap;align-items:center;gap:var(--s-4);justify-content:space-between;padding-top:var(--s-6);font-size:.78rem;color:#a3b5c9bf}.divider{height:1px;background:var(--line);border:0;margin-block:var(--s-8)}.note{padding:var(--s-4) var(--s-5);font-size:.85rem;line-height:1.7;color:var(--text-soft);background:var(--paper-tint);border-left:3px solid var(--line);border-radius:0 var(--r-sm) var(--r-sm) 0}.note--warn{background:var(--premise-soft);border-left-color:var(--premise)}.note b{color:var(--text)}.link-arrow{display:inline-flex;align-items:center;gap:.35rem;font-size:.88rem;font-weight:600;color:var(--saas-ink)}.link-arrow:after{content:"→";transition:transform var(--dur) var(--ease)}.link-arrow:hover:after{transform:translate(3px)}.link-arrow--premise{color:var(--premise-ink)}.kv{display:grid;grid-template-columns:6.5rem 1fr;gap:.4rem var(--s-4);font-size:.88rem}.kv dt{color:var(--text-faint)}.kv dd{margin:0;color:var(--text)}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:absolute;left:-9999px;top:0;z-index:100;padding:.6rem 1rem;background:var(--ink-900);color:#fff;border-radius:0 0 var(--r-sm) 0}.skip-link:focus{left:0}.page-hero{padding-block:clamp(2.5rem,5vw,4rem) clamp(2rem,4vw,3rem);border-bottom:1px solid var(--line-soft);background:var(--paper-tint)}.page-hero--saas{background:linear-gradient(180deg,var(--saas-soft),var(--paper-tint) 70%)}.page-hero--premise{background:linear-gradient(180deg,var(--premise-soft),var(--paper-tint) 70%)}.page-hero__inner{display:flex;flex-direction:column;gap:var(--s-4);max-width:52rem}.page-hero .h1{font-size:clamp(1.85rem,3.4vw,2.7rem)}.page-hero--dark{background:var(--ink-900);border-bottom-color:var(--line-dark)}.page-hero--dark .h1{color:#fff}.page-hero--dark .lede{color:var(--text-invert-soft)}.page-hero--dark .eyebrow{color:#45c8b8}.tut-search{display:flex;gap:var(--s-3);margin-bottom:var(--s-6)}.tut-search__input{flex:1;min-width:0;padding:.6rem .9rem;font-size:.92rem;font-family:inherit;color:var(--text);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--dur) var(--ease)}.tut-search__input:focus{outline:none;border-color:var(--saas);box-shadow:0 0 0 3px var(--saas-soft)}.tut-search__clear{flex:0 0 auto;padding:0 .9rem;font-size:.82rem;font-family:inherit;color:var(--text-soft);background:var(--paper-tint);border:1px solid var(--line);border-radius:var(--r-md);cursor:pointer}.tut-search__clear:hover{color:var(--text);border-color:var(--line-strong, #c8d4dd)}.tut-filter__num{margin-left:.3rem;font-family:var(--font-mono);font-size:.7rem;opacity:.55}.tut-groups{display:flex;flex-direction:column;gap:var(--s-12)}.tut-group__head{display:flex;align-items:baseline;flex-wrap:wrap;gap:.5rem .75rem;padding-bottom:var(--s-4);margin-bottom:var(--s-5);border-bottom:1px solid var(--line)}.tut-group__title{font-size:1.25rem;font-weight:700;letter-spacing:-.015em;color:var(--text)}.tut-group__layer{padding:.12rem .42rem;font-size:.68rem;color:var(--text-soft);background:var(--paper-deep);border-radius:4px}.tut-group__desc{font-size:.85rem;color:var(--text-faint)}.tut-group__count{margin-left:auto;font-family:var(--font-mono);font-size:.78rem;color:var(--text-faint)}.codeblock{margin-top:var(--s-4);border:1px solid var(--line-dark);border-radius:var(--r-md);overflow:hidden;background:var(--ink-900)}.codeblock__head{display:flex;align-items:center;gap:var(--s-3);padding:.5rem .85rem;background:var(--ink-800);border-bottom:1px solid var(--line-dark)}.codeblock__lang{padding:.1rem .4rem;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.04em;color:#45c8b8;background:#45c8b81f;border-radius:3px}.codeblock__title{font-size:.78rem;color:var(--text-invert-soft)}.codeblock__copy{margin-left:auto;padding:.15rem .55rem;font-size:.72rem;font-family:inherit;color:var(--text-invert-soft);background:transparent;border:1px solid var(--line-dark);border-radius:4px;cursor:pointer;transition:color var(--dur) var(--ease),border-color var(--dur) var(--ease)}.codeblock__copy:hover{color:#fff;border-color:#45c8b8}.codeblock__pre{margin:0;padding:var(--s-4) var(--s-5);overflow-x:auto;font-family:var(--font-mono);font-size:.8rem;line-height:1.7;color:#d6e2ee;white-space:pre;-moz-tab-size:2;tab-size:2}.dev-points{display:flex;flex-wrap:wrap;gap:.35rem;margin-top:var(--s-4)}.dev-point{padding:.22rem .5rem;font-family:var(--font-mono);font-size:.72rem;color:var(--text-soft);background:var(--paper-tint);border:1px solid var(--line-soft);border-radius:var(--r-sm)}.dev-list{display:flex;flex-direction:column;gap:.6rem}.dev-item{display:flex;gap:var(--s-4);padding:var(--s-5);background:var(--paper);border:1px solid var(--line);border-radius:var(--r-md);transition:border-color var(--dur) var(--ease),box-shadow var(--dur) var(--ease)}.dev-item:hover{border-color:var(--saas-line);box-shadow:var(--shadow-md)}.dev-item__no{flex:0 0 2rem;font-size:.78rem;color:var(--saas);padding-top:.15rem}.dev-item__main{min-width:0}.dev-item__title{font-size:1.02rem;font-weight:650;letter-spacing:-.01em;color:var(--text)}.dev-item__sum{margin-top:.3rem;font-size:.875rem;line-height:1.7;color:var(--text-soft)}.dev-item__meta{display:flex;gap:.4rem;margin-top:.5rem;font-family:var(--font-mono);font-size:.72rem;color:var(--text-faint)}.dev-stack{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-6)}.dev-stack__col{padding:var(--s-6);background:var(--paper-tint);border:1px solid var(--line-soft);border-radius:var(--r-lg)}.dev-stack__title{margin-bottom:var(--s-3);font-size:1rem;font-weight:650;color:var(--text)}.dev-stack .pre-list{margin:0;padding-left:1.1rem}.dev-stack .pre-list li{margin-bottom:.35rem;font-size:.875rem;line-height:1.65;color:var(--text-soft)}@media (max-width: 1080px){.brand__sub{display:none}.price-grid,.grid--4,.tut-list{grid-template-columns:repeat(2,minmax(0,1fr))}.footer__top{grid-template-columns:repeat(2,minmax(0,1fr));row-gap:var(--s-10)}}@media (max-width: 900px){.hero__inner{grid-template-columns:minmax(0,1fr)}.line-picker{max-width:32rem}.tour__panel,.article{grid-template-columns:minmax(0,1fr)}.article__side{position:static;flex-direction:row;flex-wrap:wrap}.side-box{flex:1 1 14rem}.grid--3{grid-template-columns:repeat(2,minmax(0,1fr))}.layers,.compare{grid-template-columns:minmax(0,1fr)}}@media (max-width: 760px){:root{--header-h: 3.75rem}.nav-toggle{display:block}.nav-wrap{display:none}.site-header.is-open .nav-wrap{position:absolute;top:var(--header-h);left:0;right:0;display:flex;flex-direction:column;align-items:stretch;gap:0;padding:var(--s-3) var(--s-5) var(--s-5);background:#fff;border-bottom:1px solid var(--line);box-shadow:var(--shadow-md)}.site-header.is-open .site-nav{flex-direction:column;align-items:stretch;gap:0;margin:0}.site-header.is-open .site-nav__link{padding:.7rem 0;border-bottom:1px solid var(--line-soft)}.site-header.is-open .site-nav__link.is-active:after{display:none}.site-header.is-open .header-actions{display:flex;flex-direction:row;align-items:stretch;gap:var(--s-2);margin:var(--s-4) 0 0}.site-header.is-open .header-actions .btn{flex:1}.grid--2,.grid--3,.grid--4,.tut-list,.price-grid{grid-template-columns:minmax(0,1fr)}.hero__stats{gap:var(--s-5) var(--s-6)}.cta__inner{flex-direction:column;align-items:flex-start}.footer__top{grid-template-columns:minmax(0,1fr);gap:var(--s-8)}.kv{grid-template-columns:minmax(0,1fr);gap:.1rem}.kv dd{margin-bottom:.5rem}.scope-note,.tut-search{flex-direction:column;gap:var(--s-2)}.tut-search__clear{padding:.5rem .9rem}.dev-stack{grid-template-columns:minmax(0,1fr)}.dev-item{padding:var(--s-4);gap:var(--s-3)}.dev-item__no{flex-basis:1.4rem}.codeblock__pre{padding:var(--s-3) var(--s-4);font-size:.74rem}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important;scroll-behavior:auto!important}}
