@charset "UTF-8";@import"https://fonts.googleapis.com/css2?family=DM+Mono:ital,wght@0,300;0,400;0,500;1,400&family=Newsreader:ital,opsz,wght@0,6..72,300;0,6..72,400;0,6..72,500;0,6..72,600;1,6..72,300;1,6..72,400&family=Outfit:wght@200;300;400;500;600;700&display=swap";:root{--guide-bg-deep: #06090f;--guide-bg-surface: #0c1018;--guide-bg-elevated: #121924;--guide-bg-code: #0a0f18;--guide-text-primary: #d4dce8;--guide-text-secondary: #7a8a9e;--guide-text-muted: #4a5568;--guide-text-bright: #edf2f7;--guide-neon-cyan: #00e5c8;--guide-neon-cyan-dim: #00e5c840;--guide-neon-cyan-glow: #00e5c820;--guide-neon-blue: #3da5ff;--guide-neon-pink: #ff3d96;--guide-neon-amber: #ffb84d;--guide-neon-green: #7fff3d;--guide-line-1: #ffb84d;--guide-line-2: #ff3d96;--guide-line-3: #ff4040;--guide-line-4: #3da5ff;--guide-border-subtle: #1a2332;--guide-border-accent: #1e3a4a;--guide-font-display: "Outfit", sans-serif;--guide-font-body: "Newsreader", Georgia, serif;--guide-font-mono: "DM Mono", "Consolas", monospace;--guide-content-width: 1000px;--guide-content-wide: 1100px;--guide-page-padding: 2rem}.guide-page{background:var(--guide-bg-deep);color:var(--guide-text-primary);font-family:var(--guide-font-body);line-height:1.72;min-height:100vh;font-size:18px;-webkit-font-smoothing:antialiased}.guide-site-main{position:relative;width:auto;min-height:100vh;padding-top:50px}@media screen and (min-width: 768px){.guide-site-main{margin-left:120px;padding-top:0}}.guide-page:before{content:"";position:fixed;inset:0;background-image:linear-gradient(var(--guide-border-subtle) 1px,transparent 1px),linear-gradient(90deg,var(--guide-border-subtle) 1px,transparent 1px);background-size:60px 60px;opacity:.3;pointer-events:none;z-index:0}.guide-nav-top{position:sticky;top:0;left:0;right:0;z-index:100;border-bottom:1px solid var(--guide-border-subtle);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#06090fd9}.guide-nav-inner{max-width:var(--guide-content-wide);margin:0 auto;padding:.6rem var(--guide-page-padding);display:flex;align-items:center;justify-content:space-between}.guide-nav-brand{font-family:var(--guide-font-display);font-weight:600;font-size:.85rem;letter-spacing:.06em;text-transform:uppercase;color:var(--guide-text-secondary);text-decoration:none;display:flex;align-items:center;gap:.5rem}.guide-nav-brand:hover{color:var(--guide-neon-cyan)}.guide-nav-brand .dot{width:8px;height:8px;border-radius:50%;background:var(--guide-neon-cyan);box-shadow:0 0 8px var(--guide-neon-cyan),0 0 16px var(--guide-neon-cyan-dim);animation:guide-nav-pulse 3s ease-in-out infinite}@keyframes guide-nav-pulse{0%,to{opacity:1;box-shadow:0 0 8px var(--guide-neon-cyan),0 0 16px var(--guide-neon-cyan-dim)}50%{opacity:.6;box-shadow:0 0 4px var(--guide-neon-cyan)}}.guide-nav-chapter{font-family:var(--guide-font-mono);font-size:.72rem;color:var(--guide-text-muted);letter-spacing:.04em}.guide-nav-links{display:flex;gap:1rem;align-items:center}.guide-nav-links a{font-family:var(--guide-font-display);font-size:.78rem;font-weight:400;color:var(--guide-text-secondary);text-decoration:none;padding:.3rem .6rem;border-radius:4px;transition:color .2s,background .2s}.guide-nav-links a:hover{color:var(--guide-neon-cyan);background:var(--guide-neon-cyan-glow)}.guide-nav-links a.disabled{opacity:.3;pointer-events:none}@media (max-width: 767px){.guide-nav-inner{padding:.4rem .75rem;flex-wrap:wrap;gap:0}.guide-nav-brand{font-size:.72rem;gap:.35rem}.guide-nav-brand .dot{width:6px;height:6px}.guide-nav-brand{order:1}.guide-nav-chapter{order:3;width:100%;text-align:center;font-size:.62rem;padding-top:.15rem;border-top:1px solid var(--guide-border-subtle)}.guide-nav-links{order:2;gap:.4rem}.guide-nav-links a{font-size:.72rem;padding:.2rem .5rem}.chapter-header{padding:2rem var(--guide-page-padding) 1.5rem}.chapter-title{font-size:1.8rem}.chapter-subtitle{font-size:1rem}.chapter-nav{flex-direction:column;padding:2rem var(--guide-page-padding) 3rem;gap:.75rem}.chapter-nav a.next{text-align:left}}.guide-main{position:relative;z-index:1;padding-top:1rem}.chapter-header{max-width:var(--guide-content-wide);margin:0 auto;padding:4rem var(--guide-page-padding) 3rem}.chapter-number{font-family:var(--guide-font-mono);font-size:.75rem;font-weight:400;color:var(--guide-neon-cyan);letter-spacing:.15em;text-transform:uppercase;margin-bottom:.8rem;display:flex;align-items:center;gap:.75rem}.chapter-number:after{content:"";flex:1;height:1px;background:linear-gradient(90deg,var(--guide-neon-cyan-dim),transparent)}.chapter-title{font-family:var(--guide-font-display);font-size:2.8rem;font-weight:700;color:var(--guide-text-bright);line-height:1.15;letter-spacing:-.02em;margin-bottom:1rem}.chapter-subtitle{font-family:var(--guide-font-body);font-size:1.15rem;font-weight:300;color:var(--guide-text-secondary);font-style:italic;line-height:1.6;max-width:600px}.guide-page .content{max-width:var(--guide-content-width);margin:0 auto;padding:0 var(--guide-page-padding) 4rem}.guide-page .content p{margin-bottom:1.4rem;color:var(--guide-text-primary)}.guide-page .content p.lead{font-size:1.15rem;color:var(--guide-text-secondary);font-style:italic;border-left:2px solid var(--guide-neon-cyan-dim);padding-left:1.2rem;margin-bottom:2rem}.guide-page .content h2{font-family:var(--guide-font-display);font-size:1.5rem;font-weight:600;color:var(--guide-text-bright);margin:3rem 0 1.2rem;letter-spacing:-.01em}.guide-page .content h3{font-family:var(--guide-font-display);font-size:1.1rem;font-weight:500;color:var(--guide-neon-cyan);margin:2rem 0 .8rem}.guide-page .content strong{color:var(--guide-text-bright);font-weight:600}.guide-page .content em{color:var(--guide-text-secondary)}.guide-page .content a{color:var(--guide-neon-cyan);text-decoration:underline;text-decoration-color:var(--guide-neon-cyan-dim);text-underline-offset:3px;transition:text-decoration-color .2s}.guide-page .content a:hover{text-decoration-color:var(--guide-neon-cyan)}.guide-page .content code{font-family:var(--guide-font-mono);font-size:.85em;background:var(--guide-bg-elevated);padding:.15em .4em;border-radius:3px;color:var(--guide-neon-amber)}.guide-page .content blockquote{border-left:3px solid var(--guide-neon-cyan);padding:1rem 1.5rem;margin:2rem 0;background:var(--guide-bg-surface);border-radius:0 6px 6px 0;font-style:italic;color:var(--guide-text-secondary)}.guide-page .content blockquote strong{color:var(--guide-neon-cyan);font-style:normal}.callout{background:var(--guide-bg-surface);border:1px solid var(--guide-border-accent);border-radius:8px;padding:1.5rem;margin:2rem 0}.callout.insight{border-left:3px solid var(--guide-neon-green)}.callout.story{border-left:3px solid var(--guide-neon-pink)}.callout-label{font-family:var(--guide-font-mono);font-size:.7rem;font-weight:500;text-transform:uppercase;letter-spacing:.12em;margin-bottom:.5rem}.callout.insight .callout-label{color:var(--guide-neon-green)}.callout.story .callout-label{color:var(--guide-neon-pink)}.live-editor{max-width:var(--guide-content-wide);margin:2.5rem auto;padding:0 var(--guide-page-padding)}.editor-container{background:var(--guide-bg-surface);border:1px solid var(--guide-border-subtle);border-radius:10px;overflow:hidden}.editor-toolbar{display:flex;align-items:center;justify-content:space-between;padding:.5rem 1rem;background:var(--guide-bg-elevated);border-bottom:1px solid var(--guide-border-subtle)}.editor-toolbar-label{font-family:var(--guide-font-mono);font-size:.7rem;color:var(--guide-text-muted);letter-spacing:.08em;text-transform:uppercase}.editor-toolbar button{font-family:var(--guide-font-mono);font-size:.7rem;background:var(--guide-neon-cyan-glow);color:var(--guide-neon-cyan);border:1px solid var(--guide-neon-cyan-dim);padding:.25rem .7rem;border-radius:4px;cursor:pointer;transition:background .2s,box-shadow .2s}.editor-toolbar button:hover{background:var(--guide-neon-cyan-dim);box-shadow:0 0 12px var(--guide-neon-cyan-glow)}.editor-split{display:grid;grid-template-columns:1fr 1fr;min-height:360px}.editor-mobile-note{display:none;padding:.75rem 1rem;text-align:center;font-family:var(--guide-font-mono);font-size:.7rem;color:var(--guide-text-muted);background:var(--guide-bg-code);border-bottom:1px solid var(--guide-border-subtle)}.editor-toolbar-mobile{display:none;align-items:center;justify-content:center;padding:.5rem 1rem;background:var(--guide-bg-elevated);border-bottom:1px solid var(--guide-border-subtle);font-family:var(--guide-font-mono);font-size:.65rem;color:var(--guide-text-muted);letter-spacing:.06em;text-transform:uppercase}@media (max-width: 768px){.editor-split{grid-template-columns:1fr;min-height:auto}.editor-code{display:none}.editor-mobile-note{display:block}.editor-toolbar{display:none}.editor-toolbar-mobile{display:flex}}.editor-code{position:relative;border-right:1px solid var(--guide-border-subtle)}.editor-code textarea{width:100%;height:100%;min-height:360px;resize:none;background:var(--guide-bg-code);color:var(--guide-text-primary);font-family:var(--guide-font-mono);font-size:.78rem;line-height:1.65;padding:1rem;border:none;outline:none;-moz-tab-size:2;-o-tab-size:2;tab-size:2;white-space:pre;overflow:auto}.editor-code textarea::-moz-selection{background:var(--guide-neon-cyan-dim)}.editor-code textarea::selection{background:var(--guide-neon-cyan-dim)}.editor-code .ace-container{width:100%;min-height:360px}.editor-code .ace-container .ace_editor{font-size:13px!important}.editor-code .ace-container .ace_gutter{background:var(--guide-bg-deep)}.editor-preview{background:var(--guide-bg-deep);display:flex;align-items:center;justify-content:center;padding:1.5rem;position:relative;overflow:hidden}.editor-preview svg{max-width:100%;max-height:100%}.chapter-nav{max-width:var(--guide-content-width);margin:0 auto;padding:3rem var(--guide-page-padding) 4rem;display:flex;justify-content:space-between;align-items:stretch;gap:1.5rem}.chapter-nav a{display:flex;flex-direction:column;gap:.3rem;text-decoration:none;padding:1.2rem 1.5rem;border:1px solid var(--guide-border-subtle);border-radius:8px;transition:border-color .2s,background .2s;flex:1}.chapter-nav a:hover{border-color:var(--guide-neon-cyan-dim);background:var(--guide-bg-surface)}.chapter-nav a.next{text-align:right}.chapter-nav .nav-label{font-family:var(--guide-font-mono);font-size:.65rem;color:var(--guide-text-muted);text-transform:uppercase;letter-spacing:.1em}.chapter-nav .nav-title{font-family:var(--guide-font-display);font-size:.95rem;font-weight:500;color:var(--guide-neon-cyan)}.hero-svg-container{max-width:var(--guide-content-wide);margin:2rem auto 3rem;padding:0 var(--guide-page-padding)}.hero-svg{width:100%;height:200px;background:var(--guide-bg-surface);border-radius:10px;border:1px solid var(--guide-border-subtle);overflow:hidden}.guide-footer{max-width:var(--guide-content-width);margin:0 auto;padding:2rem var(--guide-page-padding);border-top:1px solid var(--guide-border-subtle);font-family:var(--guide-font-mono);font-size:.7rem;color:var(--guide-text-muted);text-align:center;letter-spacing:.04em}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);border:0}.guide-page .content,.chapter-header,.live-editor{animation:guideFadeIn .6s ease-out}@keyframes guideFadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.slider-row{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;background:var(--guide-bg-elevated);border-top:1px solid var(--guide-border-subtle);font-family:var(--guide-font-mono);font-size:.72rem;color:var(--guide-text-secondary)}.slider-row label{min-width:120px}.slider-row input[type=range]{flex:1;accent-color:var(--guide-neon-cyan);max-width:200px}.slider-row .slider-value{color:var(--guide-neon-cyan);min-width:40px;text-align:right}.toggle-row{display:flex;align-items:center;gap:1rem;padding:.5rem 1rem;background:var(--guide-bg-elevated);border-top:1px solid var(--guide-border-subtle);font-family:var(--guide-font-mono);font-size:.72rem;color:var(--guide-text-secondary)}.ba-toggle{display:flex;gap:0;border-radius:4px;overflow:hidden;border:1px solid var(--guide-border-subtle)}.ba-toggle button{font-family:var(--guide-font-mono);font-size:.68rem;padding:.25rem .8rem;border:none;cursor:pointer;transition:background .2s,color .2s;background:var(--guide-bg-surface);color:var(--guide-text-muted)}.ba-toggle button.active{background:var(--guide-neon-cyan-dim);color:var(--guide-neon-cyan)}.cp-interactive{max-width:var(--guide-content-wide);margin:2.5rem auto;padding:0 var(--guide-page-padding)}.cp-canvas{background:var(--guide-bg-surface);border:1px solid var(--guide-border-subtle);border-radius:10px;overflow:hidden;position:relative}.cp-canvas svg{display:block;width:100%}.cp-handle{cursor:grab;transition:r .15s}.cp-handle:hover{r:10}.cp-handle:active{cursor:grabbing}.cp-readout{padding:.6rem 1rem;background:var(--guide-bg-elevated);border-top:1px solid var(--guide-border-subtle);font-family:var(--guide-font-mono);font-size:.72rem;color:var(--guide-text-secondary);letter-spacing:.02em}.filter-bar{display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem 1rem;background:var(--guide-bg-elevated);border-top:1px solid var(--guide-border-subtle);align-items:center}.filter-bar .label{font-family:var(--guide-font-mono);font-size:.68rem;color:var(--guide-text-muted);margin-right:.5rem}.line-btn{font-family:var(--guide-font-mono);font-size:.7rem;font-weight:600;padding:.2rem .6rem;border-radius:4px;border:2px solid;cursor:pointer;transition:opacity .2s,background .2s;background:transparent}.line-btn.active{background:var(--btn-color);color:#0a0e17}.line-btn:not(.active){opacity:.35;color:var(--btn-color)}.guide-index-hero{max-width:var(--guide-content-wide);margin:0 auto;padding:8rem var(--guide-page-padding) 4rem;text-align:center}.guide-index-title{font-family:var(--guide-font-display);font-size:3.6rem;font-weight:700;color:var(--guide-text-bright);letter-spacing:-.03em;line-height:1.1;margin-bottom:1.2rem}.guide-index-title span{color:var(--guide-neon-cyan)}.guide-index-tagline{font-family:var(--guide-font-body);font-size:1.2rem;color:var(--guide-text-secondary);font-style:italic;max-width:540px;margin:0 auto 3rem;line-height:1.6}.guide-toc{max-width:600px;margin:0 auto;padding:0 var(--guide-page-padding) 6rem;list-style:none}.guide-toc-item{display:flex;align-items:baseline;gap:1rem;padding:1rem .5rem;text-decoration:none;transition:background .2s;border-radius:4px;border-bottom:1px solid var(--guide-border-subtle)}.guide-toc-item:first-child{border-top:1px solid var(--guide-border-subtle)}.guide-toc-item:hover{background:var(--guide-bg-surface)}.guide-toc-number{font-family:var(--guide-font-mono);font-size:.7rem;color:var(--guide-neon-cyan);min-width:2.5rem;letter-spacing:.05em}.guide-toc-text{display:flex;flex-direction:column;gap:.2rem}.guide-toc-title{font-family:var(--guide-font-display);font-size:1rem;font-weight:500;color:var(--guide-text-primary)}.guide-toc-item:hover .guide-toc-title{color:var(--guide-neon-cyan)}.guide-toc-subtitle{font-family:var(--guide-font-body);font-size:.8rem;color:var(--guide-text-muted);font-style:italic}