.docs-page{background:var(--bg);min-height:100vh;padding-top:95px}.docs-layout{grid-template-columns:280px 1fr;width:100%;max-width:1400px;min-height:calc(100vh - 95px);margin:0 auto;display:grid}.docs-sidebar{background:var(--bg-secondary);border-right:1px solid var(--border);height:calc(100vh - 95px);padding:2rem 0;position:sticky;top:95px;overflow:hidden auto}.docs-sidebar::-webkit-scrollbar{width:6px}.docs-sidebar::-webkit-scrollbar-track{background:0 0}.docs-sidebar::-webkit-scrollbar-thumb{background:var(--border);border-radius:3px}.docs-sidebar::-webkit-scrollbar-thumb:hover{background:var(--text-light)}.docs-nav{padding:0}.docs-nav h3{font-family:var(--font-display);text-transform:uppercase;letter-spacing:1px;color:var(--text-light);margin-bottom:1rem;padding:0 2rem;font-size:.75rem;font-weight:700}.docs-nav ul{padding:0;list-style:none}.docs-nav ul li{margin-bottom:0}.docs-nav ul li a{color:var(--text);border-left:3px solid #0000;padding:.75rem 2rem;font-size:.95rem;text-decoration:none;transition:all .2s;display:block}.docs-nav ul li a:hover{border-left-color:var(--accent);color:var(--accent);background:#ff6b6b1a}.docs-nav ul li a.active{border-left-color:var(--accent);color:var(--accent);background:#ff6b6b1a;font-weight:600}.docs-content{width:100%;max-width:900px;padding:3rem;overflow-x:hidden}.docs-section{margin-bottom:4rem;scroll-margin-top:120px}.docs-section:last-child{margin-bottom:0}.docs-section h1{font-family:var(--font-display);color:var(--primary);margin-bottom:1rem;font-size:3rem;font-weight:700;line-height:1.2}.docs-section h2{font-family:var(--font-display);color:var(--primary);border-bottom:2px solid var(--border);margin-top:3rem;margin-bottom:1rem;padding-bottom:.5rem;font-size:2rem;font-weight:700}.docs-section h3{font-family:var(--font-display);color:var(--primary);margin-top:2rem;margin-bottom:1rem;font-size:1.5rem;font-weight:600}.docs-section h4{font-family:var(--font-display);color:var(--primary);margin-top:1.5rem;margin-bottom:.75rem;font-size:1.25rem;font-weight:600}.docs-section p{color:var(--text-light);margin-bottom:1.5rem;font-size:1rem;line-height:1.8}.docs-section .lead{color:var(--text);margin-bottom:2rem;font-size:1.25rem;line-height:1.7}.docs-section ul,.docs-section ol{margin-bottom:1.5rem;padding-left:2rem}.docs-section ul li,.docs-section ol li{color:var(--text-light);margin-bottom:.75rem;line-height:1.8}.docs-badges{flex-wrap:wrap;gap:1rem;margin-bottom:2rem;display:flex}.docs-badges .badge{background:var(--bg-secondary);color:var(--primary);font-size:.875rem;font-weight:600;font-family:var(--font-mono);border-radius:6px;padding:.5rem 1rem;display:inline-block}.code-block{background:var(--code-bg);border-radius:8px;max-width:100%;margin:1.5rem 0;padding:1.5rem;overflow-x:auto;box-shadow:0 4px 12px #00000026}.code-block pre{font-family:var(--font-mono);color:#e2e8f0;white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;margin:0;font-size:.9rem;line-height:1.6}.code-block code{font-family:var(--font-mono);white-space:pre-wrap;word-wrap:break-word}.docs-section p code,.docs-section li code{background:var(--bg-secondary);color:var(--accent);font-size:.85em;font-family:var(--font-mono);border-radius:4px;padding:.2rem .4rem}.comparison-box{grid-template-columns:1fr 1fr;gap:2rem;margin:2rem 0;display:grid}.comparison-item{border-radius:12px;padding:1.5rem}.comparison-item.bad{background:#fef2f2;border:2px solid #fecaca}.comparison-item.good{background:#f0fdf4;border:2px solid #bbf7d0}.comparison-item h4{margin-top:0;margin-bottom:1rem}.comparison-item.bad h4{color:#dc2626}.comparison-item.good h4{color:#16a34a}.docs-cta{background:linear-gradient(135deg,var(--primary),var(--primary-light));color:#fff;text-align:center;border-radius:16px;margin-top:4rem;padding:3rem}.docs-cta h2{color:#fff;border:none;margin:0 0 1rem;padding:0}.docs-cta p{color:#ffffffe6;margin-bottom:2rem;font-size:1.1rem}@media (max-width:968px){.docs-layout{grid-template-columns:1fr;gap:0}.docs-sidebar{display:none}.docs-content{max-width:100%;padding:2rem 1.5rem}.comparison-box{grid-template-columns:1fr}.docs-section h1{font-size:2rem}.docs-section h2{font-size:1.5rem}.docs-page{padding-top:95px}.code-block{margin:1rem 0;padding:.75rem;font-size:.8rem}.code-block pre{white-space:pre-wrap;word-wrap:break-word;overflow-wrap:break-word;font-size:.8rem}.code-block code{white-space:pre-wrap;word-wrap:break-word;font-size:.8rem}}
