:root{--body-bg: #0d0f1a;--aside-bg: #13151f;--nav-bg: #13151f;--hover-bg: #1e2133;--border: #21262d;--text-primary: #eeeef2;--text-secondary: #c4c4cf;--text-muted: #8b949e;--text-accent: #9898aa;--code-bg: #0a0b14;--code-text: #d8d8e6;--code-keyword: #bb9af7;--code-string: #5de4a8;--code-comment: #555568;--surface: var(--aside-bg);--text: var(--text-primary);--accent: #7aa2f7;--accent2: var(--code-keyword)}*{margin:0;padding:0;box-sizing:border-box}html{scroll-behavior:smooth}html,body{height:100%}body{font-family:Inter,-apple-system,sans-serif;background-color:var(--body-bg);color:var(--text-primary);display:flex;flex-direction:column}

.code-copy{display:flex;align-items:center;gap:.5rem;background-color:var(--code-bg);border:1px solid var(--border);border-radius:6px;padding:.75rem 1rem;margin:1.5rem 0}.code-copy code{flex:1;background:none;border:none;padding:0;color:var(--code-text);font-size:.875rem;user-select:all}.copy-btn{flex-shrink:0;background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.25rem;display:flex;align-items:center;justify-content:center;transition:color .15s ease}.copy-btn:hover{color:var(--text-primary)}.copy-btn.copied{color:var(--code-string)}

aside{font-family:JetBrains Mono,Menlo,monospace;background-color:var(--aside-bg);color:var(--text-primary);font-size:13px;line-height:1.5;min-height:100vh;padding:1.25rem 0;border-right:1px solid var(--border);width:280px;flex-shrink:0;overflow-y:auto;nav{margin-bottom:1.5rem;padding:0 1.25rem;&:last-of-type{margin-bottom:6rem}}nav h3{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:var(--text-muted);margin-bottom:.5rem;display:block}nav ol,nav ul{list-style:none}nav li{margin-bottom:.2rem}nav a{display:block;padding:.35rem .625rem;color:var(--text-muted);text-decoration:none;border-left:2px solid transparent;transition:color .15s ease,background-color .15s ease,border-color .15s ease;border-radius:0 4px 4px 0}nav a:hover:not([aria-disabled=true]){color:var(--text-primary);background-color:var(--hover-bg);border-left-color:var(--text-accent)}nav a:active{color:var(--text-accent)}nav a[aria-disabled=true]{color:var(--text-muted);cursor:not-allowed;opacity:.4}nav a[aria-current=page]{color:var(--text-primary);background-color:var(--hover-bg);border-left-color:var(--code-keyword);font-weight:500}nav ul ul{margin-left:1.25rem;margin-top:.2rem;border-left:1px solid var(--border);padding-left:.5rem}nav ul ul li{margin-bottom:.1rem}nav ul ul a{font-size:12px;padding:.2rem .5rem;border-left:none}nav li:has(a[aria-current=page])>a:first-child{color:var(--text-primary);font-weight:500}}@media(max-width:768px){aside{position:fixed;top:3rem;left:0;bottom:0;width:100%!important;min-height:0;height:calc(100dvh - 3rem);padding:1rem 0;border-right:none;border-bottom:none;z-index:50;transform:translate(-100%);transition:transform .2s ease;overscroll-behavior:contain;nav{margin-bottom:1.25rem;padding:0 1rem}nav a{padding:.3rem .5rem;font-size:12px}}body.drawer-open aside{transform:translate(0)}body.drawer-open:before{content:"";position:fixed;inset:3rem 0 0;background:#00000080;z-index:49}}@media(max-width:480px){aside{padding:.75rem 0;nav{margin-bottom:1rem;padding:0 .75rem}nav h3{font-size:10px;margin-bottom:.4rem}nav li{margin-bottom:.2rem}nav a{padding:.3rem .5rem;font-size:12px}}}

.hero{display:flex;flex-direction:column;padding-top:20px}.hero-eyebrow{font-family:monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:28px}.hero h1{font-size:clamp(52px,9vw,112px);font-weight:800;line-height:.92;letter-spacing:-.03em;color:var(--text);margin-bottom:36px}.hero-desc{max-width:520px;font-size:18px;color:var(--text-muted);line-height:1.7;margin-bottom:48px}.hero-desc strong{color:var(--text);font-weight:600}.hero-actions{display:flex;align-items:center;gap:20px;flex-wrap:wrap}.btn-primary{display:inline-flex;align-items:center;gap:10px;padding:14px 28px;background:var(--accent);color:#0d1117;font-family:monospace;font-size:13px;font-weight:500;text-decoration:none;border-radius:4px}.btn-primary:hover{background:#92b4f9}.btn-ghost{display:inline-flex;align-items:center;padding:14px 28px;background:transparent;color:var(--text-muted);font-family:monospace;font-size:13px;text-decoration:none;border:1px solid var(--border);border-radius:4px}.btn-ghost:hover{color:var(--text);border-color:var(--text-muted)}.stats-strip{border-top:1px solid var(--border);border-bottom:1px solid var(--border);padding:40px 0;margin:80px 0;display:grid;grid-template-columns:repeat(3,1fr)}.stat-item{padding:0 40px;border-right:1px solid var(--border)}.stat-item:first-child{border-left:1px solid var(--border)}.stat-value{font-size:36px;font-weight:800;letter-spacing:-.03em;line-height:1;margin-bottom:6px}.stat-value.accent{color:var(--accent)}.stat-value.purple{color:var(--accent2)}.stat-value.green{color:var(--code-string)}.stat-label{font-family:monospace;font-size:11px;letter-spacing:.15em;text-transform:uppercase;color:var(--text-muted)}section.section{padding:100px 0}.section-tag{font-family:monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--accent);margin-bottom:20px;display:flex;align-items:center;gap:12px}.section-tag:after{content:"";flex:1;height:1px;background:var(--border)}.section-title{font-size:clamp(32px,5vw,52px);font-weight:800;letter-spacing:-.03em;line-height:1.05;color:var(--text);margin-bottom:20px}.section-lead{font-size:17px;color:var(--text-muted);max-width:540px;line-height:1.75;margin-bottom:64px}.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;background:var(--border);border:1px solid var(--border)}.feature-card{background:var(--body-bg);padding:36px 32px}.feature-card:hover{background:var(--surface)}.feature-icon{font-family:monospace;font-size:11px;letter-spacing:.1em;color:var(--accent);margin-bottom:20px;opacity:.7}.feature-title{font-size:17px;font-weight:700;color:var(--text);margin-bottom:10px}.feature-body{font-size:14px;color:var(--text-muted);line-height:1.7}.philosophy{background:var(--surface);border:1px solid var(--border);padding:64px;font-size:clamp(22px,3vw,32px);font-weight:700;letter-spacing:-.02em;line-height:1.35;color:var(--text)}.philosophy em{font-style:normal;color:var(--accent2)}.philosophy cite{display:block;margin-top:28px;font-family:monospace;font-size:12px;letter-spacing:.1em;color:var(--text-muted);font-style:normal}.pattern-flow{display:flex;align-items:stretch}.pattern-step{flex:1;padding:32px 28px;border:1px solid var(--border);background:var(--body-bg)}.pattern-step:not(:first-child){margin-left:-1px}.pattern-step:hover{background:var(--surface);border-color:var(--accent);z-index:1;position:relative}.pattern-num{font-family:monospace;font-size:10px;letter-spacing:.15em;color:var(--accent);margin-bottom:14px}.pattern-name{font-size:18px;font-weight:700;color:var(--text);margin-bottom:10px}.pattern-desc{font-size:13px;color:var(--text-muted);line-height:1.65}.cta-section{display:flex;flex-direction:column;justify-content:center;min-height:100dvh;text-align:center}.cta-label{font-family:monospace;font-size:11px;letter-spacing:.2em;text-transform:uppercase;color:var(--text-muted);margin-bottom:24px}.cta-title{font-size:clamp(40px,6vw,72px);font-weight:800;letter-spacing:-.04em;line-height:.95;color:var(--text);margin-bottom:48px}.cta-title em{font-style:normal;color:var(--accent)}@media(max-width:768px){.features-grid{grid-template-columns:1fr}.stats-strip{grid-template-columns:1fr;gap:0}.stat-item{border-right:none;border-bottom:1px solid var(--border)}.stat-item:first-child{border-left:none;border-top:1px solid var(--border)}.pattern-flow{flex-direction:column}.pattern-step:not(:first-child){margin-left:0;margin-top:-1px}.philosophy{padding:40px 32px}}.install-hint{font-family:monospace;font-size:12px;color:var(--muted);padding:12px 20px;background:var(--surface);border:1px solid var(--border);border-radius:4px;display:flex;align-items:center;gap:10px;cursor:copy}.install-hint .prompt{color:var(--accent2)}

.container{display:flex;flex:1;overflow:hidden}main{flex:1;overflow-y:auto;padding:2rem}@media(max-width:768px){body,.container{flex-direction:column}main{padding:1.5rem}}@media(max-width:480px){main{padding:1rem}}main{padding-block:2rem;padding-inline:4rem;line-height:1.6}main h2:not([class]):before,main h3:not([class]):before,main h4:not([class]):before{content:attr(data-counter) ". ";color:var(--text-muted)}main h2{font-size:1.35rem;color:var(--text-primary);margin-top:2.5rem;margin-bottom:1.25rem;font-weight:600;padding-bottom:.25rem;border-bottom:1px solid var(--border)}main h3{font-size:1.1rem;color:var(--text-primary);margin-top:1.5rem;margin-bottom:.75rem;font-weight:600}main h4{font-size:.975rem;color:var(--text-primary);margin-top:1rem;margin-bottom:.5rem;font-weight:500}main p{margin-bottom:1.25rem;color:var(--text-secondary);line-height:1.75}main a{color:var(--accent);text-decoration:none;border-bottom:1px solid transparent;transition:color .15s ease,border-color .15s ease}main a:hover{color:var(--text-primary);border-bottom-color:var(--code-keyword)}main section{padding-bottom:1.125rem}main code{font-family:JetBrains Mono,Menlo,monospace;background-color:var(--code-bg);border:1px solid var(--border);border-radius:4px;color:var(--code-text);font-size:.875em;padding:.15em .4em}main pre{background-color:var(--code-bg);border:1px solid var(--border);border-radius:8px;overflow-x:auto;margin:1.5rem 0;color:var(--code-text);font-size:.85rem;line-height:1.65;tab-size:4}main pre code{background:none;border:none;padding:0;color:inherit;font-size:inherit}main ul,main ol{margin-left:1.5rem;margin-bottom:1.25rem}main li{margin-bottom:.5rem;color:var(--text-secondary);line-height:1.65}main li>code,main p>code{background-color:var(--code-bg);border:1px solid var(--border);padding:.15em .4em;border-radius:3px;font-size:.875em}main .comparison{display:grid;grid-template-columns:1fr 1fr;gap:1.25rem;margin:2rem 0}main .comparison-item{padding:1.25rem;background-color:var(--aside-bg);border:1px solid var(--border);border-radius:8px;transition:border-color .15s ease,transform .15s ease}main .comparison-item:hover{border-color:var(--text-accent);transform:translateY(-1px)}main .comparison-item h4{color:var(--text-primary);font-weight:600;margin-bottom:.75rem;font-size:.975rem}main .comparison-item p{font-size:.875rem;margin-bottom:0}@media(max-width:768px){main{padding:1.5rem}main h1{font-size:1.75rem}main h2{font-size:1.25rem}main h3{font-size:1.025rem}main .comparison{grid-template-columns:1fr;gap:1rem}main pre{padding:.75rem}}@media(max-width:480px){main{padding:1rem}main h1{font-size:1.5rem}main h2{font-size:1.15rem}main pre{font-size:.8rem;padding:.5rem}main code{font-size:.825em}}main table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.875rem;background-color:var(--aside-bg);border:1px solid var(--border);border-radius:8px;overflow:hidden}main thead{background-color:var(--code-bg);border-bottom:1px solid var(--border)}main th{padding:.75rem 1rem;text-align:left;font-weight:600;color:var(--text-muted);text-transform:uppercase;font-size:.75rem;letter-spacing:.6px}main td{padding:.75rem 1rem;border-bottom:1px solid var(--border);color:var(--text-secondary);line-height:1.6}main tbody tr:last-child td{border-bottom:none}main tbody tr{transition:background-color .15s ease}main tbody tr:hover{background-color:var(--hover-bg)}main td code,main th code{background-color:var(--code-bg);border:1px solid var(--border);padding:.15em .4em;border-radius:3px;font-size:.825em}main td a{color:var(--accent);border-bottom:1px solid transparent;transition:border-color .15s ease}main td a:hover{border-bottom-color:var(--code-keyword)}@media(max-width:768px){main table{font-size:.825rem}main th,main td{padding:.625rem .875rem}main th{font-size:.7rem}}@media(max-width:480px){main table{display:block;overflow-x:auto;white-space:nowrap;border-radius:4px}main th,main td{padding:.5rem .625rem}}main blockquote{border-left:2px solid var(--border);margin:1.5rem 0;padding:.75rem 1.25rem;border-radius:0 6px 6px 0}main blockquote p{color:var(--text-muted);font-style:italic;margin-bottom:0;line-height:1.7}main blockquote p:not(:last-child){margin-bottom:.75rem}

nav.topbar{font-family:JetBrains Mono,Menlo,monospace;background-color:var(--nav-bg);border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;width:100%;height:3.5rem;padding:1rem 1.5rem;flex-shrink:0;.topbar-brand{display:flex;align-items:center;padding:0 1.5rem;gap:.75rem;cursor:pointer;text-decoration:unset!important}.topbar-brand h1{font-size:16px;font-weight:600;color:var(--text-primary);letter-spacing:.3px}.topbar-brand span{font-size:11px;color:var(--text-muted);text-transform:uppercase;letter-spacing:.6px}.topbar-menu{display:flex;align-items:center;gap:0;list-style:none;margin:0;padding:0}.topbar-menu li{margin:0;padding:0}.topbar-menu a{display:flex;padding:0 1.25rem;height:3.5rem;align-items:center;color:var(--text-muted);text-decoration:none;font-size:13px;transition:color .15s ease,background-color .15s ease;border-bottom:2px solid transparent}.topbar-menu a:hover{color:var(--text-primary);background-color:var(--hover-bg);border-bottom-color:var(--text-accent)}.topbar-menu a.active{color:var(--text-primary);border-bottom-color:var(--code-keyword)}.topbar-actions{display:flex;align-items:center;gap:.5rem;padding:0 1.5rem}.topbar-action-btn{background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.4rem .6rem;font-size:12px;transition:color .15s ease,background-color .15s ease;border-radius:5px}.topbar-action-btn:hover{color:var(--text-primary);background-color:var(--hover-bg)}.topbar-menu-toggle{display:none;background:none;border:none;color:var(--text-muted);cursor:pointer;padding:.4rem;border-radius:5px;align-items:center;justify-content:center}.topbar-menu-toggle:hover{color:var(--text-primary);background-color:var(--hover-bg)}}@media(max-width:768px){nav.topbar{height:3rem;padding:0;.topbar-brand{display:none;background:none;border:none}.topbar-menu a{padding:0 .75rem;font-size:12px}.topbar-actions{gap:.25rem;padding:0 1rem}.topbar-menu-toggle{display:inline-flex}}}

dialog.search-dialog{position:fixed;top:20%;left:50%;translate:-50% 0;width:min(560px,90vw);background-color:var(--aside-bg);border:1px solid var(--border);border-radius:10px;padding:0;color:var(--text-primary);box-shadow:0 32px 80px #000000b3}dialog.search-dialog::backdrop{background-color:#0000008c;backdrop-filter:blur(3px)}.search-dialog-input{width:100%;background:transparent;border:none;border-bottom:1px solid var(--border);color:var(--text-primary);font-family:inherit;font-size:.95rem;padding:1rem 1.25rem;outline:none}.search-dialog-input::placeholder{color:var(--text-muted)}.search-dialog-results{list-style:none;max-height:320px;overflow-y:auto;padding:.5rem}.search-dialog-results li a{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.6rem .75rem;border-radius:6px;color:var(--text-secondary);text-decoration:none;font-size:.875rem;transition:background-color .15s ease,color .15s ease}.search-dialog-results li a:hover{background-color:var(--hover-bg);color:var(--text-primary)}.search-result-group{font-size:.7rem;color:var(--text-muted);white-space:nowrap;letter-spacing:.4px;text-transform:uppercase}.topbar-search{background-color:var(--body-bg);border:1px solid var(--border);border-radius:6px;color:var(--text-muted);cursor:pointer;font-family:inherit;font-size:.8rem;padding:.4rem .75rem;width:200px;outline:none;transition:border-color .15s ease}.topbar-search:hover{border-color:var(--text-accent)}

.table-of-contents{background-color:var(--aside-bg);border-left:2px solid var(--code-keyword);padding-inline:1rem;padding-block:1.25rem;border-radius:0 6px 6px 0}.table-of-contents h5{font-size:.75rem;line-height:1;text-transform:uppercase;letter-spacing:.7px;color:var(--text-muted);font-weight:600;margin-top:0;margin-bottom:.75rem}.table-of-contents ol{margin:0;padding-left:1.25rem}.table-of-contents li{margin-bottom:.125rem;&:last-child{margin-bottom:0}}.table-of-contents a{color:var(--text-secondary);text-decoration:none;font-size:.875rem;transition:color .15s ease;&:hover{color:var(--text-primary)}}

