.guide-page{--bg: #FAFAF9;--bg-code: #F5F5F4;--text: #1C1917;--text-muted: #57534E;--accent: #DC2626;--border: #E7E5E4;--code-border: #D6D3D1;font-family:"Source Serif 4",Georgia,serif;font-size:18px;line-height:1.7;color:var(--text);background:var(--bg)}.guide-page nav{position:fixed;top:0;left:0;width:280px;height:100vh;padding:2rem 1.5rem;background:var(--bg);border-right:1px solid var(--border);overflow-y:auto;z-index:100}.guide-page nav h1{font-family:IBM Plex Mono,monospace;font-size:.85rem;font-weight:600;letter-spacing:.05em;text-transform:uppercase;color:var(--accent);margin-bottom:2rem}.guide-page nav ul{list-style:none;padding:0;margin:0}.guide-page nav>ul>li{margin-bottom:.5rem}.guide-page nav a{font-family:IBM Plex Mono,monospace;font-size:.8rem;color:var(--text-muted);text-decoration:none;display:block;padding:.4rem 0;transition:color .2s}.guide-page nav a:hover{color:var(--text)}.guide-page nav ul ul{padding-left:1rem;margin-top:.25rem}.guide-page nav ul ul a{font-size:.75rem;opacity:.8}.guide-page main{margin-left:280px;max-width:800px;padding:4rem 3rem 6rem}.guide-page .hero{margin-bottom:4rem;padding-bottom:3rem;border-bottom:1px solid var(--border)}.guide-page .hero h1{font-size:2.5rem;font-weight:600;line-height:1.2;margin-bottom:1rem;letter-spacing:-.02em}.guide-page .hero p{font-size:1.15rem;color:var(--text-muted);max-width:540px}.guide-page section{margin-bottom:4rem}.guide-page h2{font-family:IBM Plex Mono,monospace;font-size:.75rem;font-weight:600;letter-spacing:.1em;text-transform:uppercase;color:var(--accent);margin-bottom:1.5rem;padding-top:2rem}.guide-page h3{font-size:1.4rem;font-weight:600;margin:2.5rem 0 1rem;letter-spacing:-.01em}.guide-page h4{font-family:IBM Plex Mono,monospace;font-size:.9rem;font-weight:500;margin:2rem 0 .75rem;color:var(--text)}.guide-page p{margin-bottom:1rem}.guide-page strong{font-weight:600}.guide-page code{font-family:IBM Plex Mono,monospace;font-size:.85em;background:var(--bg-code);padding:.15em .4em;border-radius:3px}.guide-page pre{font-family:IBM Plex Mono,monospace;font-size:.8rem;line-height:1.6;background:var(--bg-code);border:1px solid var(--code-border);border-radius:6px;padding:1.25rem 1.5rem;overflow-x:auto;margin:1.5rem 0}.guide-page pre code{background:none;padding:0}.guide-page table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.95rem}.guide-page th,.guide-page td{text-align:left;padding:.75rem 1rem;border-bottom:1px solid var(--border)}.guide-page th{font-family:IBM Plex Mono,monospace;font-size:.75rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:var(--text-muted)}.guide-page ul,.guide-page ol{margin:1rem 0 1.5rem;padding-left:1.5rem}.guide-page li{margin-bottom:.5rem}.guide-page .callout{background:var(--bg-code);border-left:3px solid var(--accent);padding:1rem 1.25rem;margin:1.5rem 0;font-size:.95rem}.guide-page .callout strong{display:block;font-family:IBM Plex Mono,monospace;font-size:.75rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;color:var(--accent)}.guide-page .comparison{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.5rem 0}.guide-page .comparison>div{padding:1rem;border-radius:6px;font-size:.9rem}.guide-page .comparison .bad{background:#fef2f2;border:1px solid #FECACA}.guide-page .comparison .good{background:#f0fdf4;border:1px solid #BBF7D0}.guide-page .comparison h5{font-family:IBM Plex Mono,monospace;font-size:.7rem;text-transform:uppercase;letter-spacing:.05em;margin-bottom:.5rem;color:var(--text-muted)}.guide-page .tree{font-family:IBM Plex Mono,monospace;font-size:.8rem;line-height:1.8}.guide-page .tree .comment{color:var(--text-muted)}.guide-page kbd{font-family:IBM Plex Mono,monospace;font-size:.8em;background:var(--bg-code);border:1px solid var(--code-border);border-radius:4px;padding:.2em .5em;box-shadow:0 1px 0 var(--code-border)}@media(max-width:900px){.guide-page nav{display:none}.guide-page main{margin-left:0;padding:2rem 1.5rem 4rem}.guide-page .hero h1{font-size:2rem}.guide-page .comparison{grid-template-columns:1fr}}.guide-page section[id]{scroll-margin-top:2rem}@media print{.guide-page nav{display:none}.guide-page main{margin-left:0;max-width:100%}}