:root{--bg-primary: #ffffff;--bg-secondary: #f9fafb;--bg-tertiary: #f3f4f6;--bg-code: #1e1e1e;--text-primary: #111827;--text-secondary: #6b7280;--text-tertiary: #9ca3af;--border-primary: #e5e7eb;--border-secondary: #d1d5db;--accent: #10a37f;--accent-hover: #0d8f72;--gengage-blue: #172aaf;--gengage-pink: #f668f2;--shadow: rgba(0, 0, 0, .1)}.dark{--bg-primary: #0d0d0d;--bg-secondary: #171717;--bg-tertiary: #1a1a1a;--bg-code: #1e1e1e;--text-primary: #ececec;--text-secondary: #a1a1aa;--text-tertiary: #71717a;--border-primary: #262626;--border-secondary: #404040;--accent: #10a37f;--accent-hover: #0ea472;--gengage-blue: #172aaf;--gengage-pink: #f668f2;--shadow: rgba(0, 0, 0, .5)}*{transition:background-color .2s ease,color .2s ease,border-color .2s ease}.sidebar{transition:width .3s ease,transform .3s ease}.sidebar.collapsed{width:60px}.sidebar.collapsed .sidebar-text{opacity:0;visibility:hidden;width:0}.sidebar.collapsed #nav-content{opacity:0;visibility:hidden;overflow:hidden}.sidebar.collapsed #theme-toggle{opacity:0;visibility:hidden;width:0;padding:0}.sidebar.collapsed svg{margin:0 auto}.sidebar-collapse-icon{display:block}.sidebar-expand-icon,.sidebar.collapsed .sidebar-collapse-icon{display:none}.sidebar.collapsed .sidebar-expand-icon{display:block}.sidebar.collapsed #sidebar-toggle{justify-content:center;padding:1rem .5rem}.sidebar.collapsed #sidebar-toggle .sidebar-expand-icon{width:1.5rem;height:1.5rem}.nav-section{margin-bottom:.5rem}.nav-section-title{display:flex;align-items:center;gap:.5rem;padding:.5rem .75rem;font-size:.875rem;font-weight:600;color:var(--text-primary);cursor:pointer;border-radius:.5rem;transition:background-color .15s ease}.nav-section-title:hover{background-color:var(--bg-tertiary)}.nav-section-title.active{background-color:var(--bg-tertiary);color:var(--accent)}.nav-chevron{transition:transform .2s ease;flex-shrink:0}.nav-section.collapsed .nav-chevron{transform:rotate(-90deg)}.nav-items{padding-left:1.25rem;margin-top:.25rem;border-left:1px solid var(--border-primary);margin-left:.5rem;overflow:hidden;transition:max-height .3s ease,opacity .3s ease}.nav-section.collapsed .nav-items{max-height:0;opacity:0;margin-top:0}.nav-section:not(.collapsed) .nav-items{max-height:2000px;opacity:1}.nav-link{display:block;padding:.5rem .75rem;font-size:.875rem;color:var(--text-secondary);border-radius:.375rem;transition:all .15s ease;text-decoration:none}.nav-link:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.nav-link.active{background-color:var(--accent);color:#fff;font-weight:500}.nav-subsection{margin-top:.25rem}.nav-subsection-title{display:flex;align-items:center;gap:.5rem;padding:.4rem .75rem;font-size:.8125rem;font-weight:500;color:var(--text-secondary);cursor:pointer;border-radius:.375rem;transition:all .15s ease}.nav-subsection-title:hover{background-color:var(--bg-tertiary);color:var(--text-primary)}.nav-subsection.collapsed .nav-subsection-items{max-height:0;opacity:0;margin-top:0}.nav-subsection:not(.collapsed) .nav-subsection-items{max-height:1000px;opacity:1}.nav-subsection-items{padding-left:1rem;margin-top:.25rem;overflow:hidden;transition:max-height .3s ease,opacity .3s ease}#main-content{transition:margin-left .3s ease}.sidebar.collapsed~#main-content{margin-left:60px}.content h1{font-size:2.25rem;font-weight:700;margin-bottom:1rem;color:var(--text-primary);line-height:1.2}.content h2{font-size:1.875rem;font-weight:700;margin-top:3rem;margin-bottom:1rem;color:var(--text-primary);line-height:1.3;border-bottom:1px solid var(--border-primary);padding-bottom:.5rem}.content h3{font-size:1.5rem;font-weight:600;margin-top:2rem;margin-bottom:.75rem;color:var(--text-primary)}.content h4{font-size:1.25rem;font-weight:600;margin-top:1.5rem;margin-bottom:.5rem;color:var(--text-primary)}.content p{margin-bottom:1rem;line-height:1.7;color:var(--text-secondary)}.content ul,.content ol{margin-bottom:1rem;padding-left:1.5rem;color:var(--text-secondary)}.content li{margin-bottom:.5rem;line-height:1.7}.content a{color:var(--accent);text-decoration:underline;transition:color .15s ease}.content a:hover{color:var(--accent-hover)}.content strong{font-weight:600;color:var(--text-primary)}.content code{background-color:var(--bg-tertiary);padding:.125rem .375rem;border-radius:.25rem;font-size:.875em;font-family:JetBrains Mono,monospace;color:var(--text-primary)}.code-block-wrapper{position:relative;margin:1.5rem 0;border-radius:.75rem;overflow:hidden;background-color:#f6f8fa;border:1px solid var(--border-primary)}.dark .code-block-wrapper{background-color:var(--bg-code)}.code-block-header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1rem;background-color:#e8eaed;border-bottom:1px solid var(--border-primary)}.dark .code-block-header{background-color:#ffffff0d;border-bottom:1px solid rgba(255,255,255,.1)}.code-block-lang{font-size:.75rem;font-weight:500;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em}.dark .code-block-lang{color:#fff9}.copy-button{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;background-color:var(--bg-primary);border:1px solid var(--border-primary);border-radius:.375rem;font-size:.75rem;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.copy-button:hover{background-color:var(--bg-secondary);border-color:var(--border-secondary);color:var(--text-primary)}.dark .copy-button{background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fffc}.dark .copy-button:hover{background-color:#ffffff26;border-color:#ffffff4d}.copy-button.copied{background-color:var(--accent);border-color:var(--accent);color:#fff}.code-block-wrapper pre{margin:0;padding:1rem;overflow-x:auto;background-color:transparent!important}.code-block-wrapper code{font-family:JetBrains Mono,monospace;font-size:.875rem;line-height:1.6;background:transparent!important;padding:0!important}.code-block-wrapper pre::-webkit-scrollbar{height:8px}.code-block-wrapper pre::-webkit-scrollbar-track{background:#ffffff0d}.code-block-wrapper pre::-webkit-scrollbar-thumb{background:#fff3;border-radius:4px}.code-block-wrapper pre::-webkit-scrollbar-thumb:hover{background:#ffffff4d}.code-block-collapsible{position:relative}.code-block-collapsible.collapsed pre{max-height:360px;overflow:hidden;position:relative}.code-block-collapsible:not(.collapsed) pre{max-height:none;overflow-x:auto;overflow-y:visible}.code-block-collapsible pre{transition:max-height .3s ease}.code-block-collapsible.collapsed:after{content:"";position:absolute;bottom:0;left:0;right:0;height:120px;background:linear-gradient(to bottom,transparent,#f6f8fa);pointer-events:none;border-bottom-left-radius:.75rem;border-bottom-right-radius:.75rem}.dark .code-block-collapsible.collapsed:after{background:linear-gradient(to bottom,transparent,#1e1e1e)}.code-block-collapsible:not(.collapsed):after{display:none}.code-block-expand-btn{display:flex;align-items:center;gap:.375rem;padding:.375rem .75rem;background-color:var(--bg-primary);border:1px solid var(--border-primary);border-radius:.375rem;font-size:.75rem;color:var(--text-secondary);cursor:pointer;transition:all .15s ease}.code-block-expand-btn:hover{background-color:var(--accent);border-color:var(--accent);color:#fff}.dark .code-block-expand-btn{background-color:#ffffff1a;border:1px solid rgba(255,255,255,.2);color:#fffc}.dark .code-block-expand-btn:hover{background-color:var(--accent);border-color:var(--accent);color:#fff}.expand-icon{transition:transform .2s ease;flex-shrink:0}.code-block-collapsible:not(.collapsed) .expand-icon{transform:rotate(180deg)}.code-block-wrapper .token.comment,.code-block-wrapper .token.prolog,.code-block-wrapper .token.doctype,.code-block-wrapper .token.cdata{color:#6a737d}.code-block-wrapper .token.punctuation{color:#24292e}.code-block-wrapper .token.property,.code-block-wrapper .token.tag,.code-block-wrapper .token.boolean,.code-block-wrapper .token.number,.code-block-wrapper .token.constant,.code-block-wrapper .token.symbol,.code-block-wrapper .token.deleted{color:#d73a49}.code-block-wrapper .token.selector,.code-block-wrapper .token.attr-name,.code-block-wrapper .token.string,.code-block-wrapper .token.char,.code-block-wrapper .token.builtin,.code-block-wrapper .token.inserted{color:#22863a}.code-block-wrapper .token.operator,.code-block-wrapper .token.entity,.code-block-wrapper .token.url,.code-block-wrapper .language-css .token.string,.code-block-wrapper .style .token.string{color:#005cc5}.code-block-wrapper .token.atrule,.code-block-wrapper .token.attr-value,.code-block-wrapper .token.keyword{color:#d73a49}.code-block-wrapper .token.function,.code-block-wrapper .token.class-name{color:#6f42c1}.code-block-wrapper .token.regex,.code-block-wrapper .token.important,.code-block-wrapper .token.variable{color:#e36209}.code-block-wrapper .token.important,.code-block-wrapper .token.bold{font-weight:700}.code-block-wrapper .token.italic{font-style:italic}.dark .code-block-wrapper .token.comment,.dark .code-block-wrapper .token.prolog,.dark .code-block-wrapper .token.doctype,.dark .code-block-wrapper .token.cdata{color:#7c8899}.dark .code-block-wrapper .token.punctuation{color:#c5c8c6}.dark .code-block-wrapper .token.property,.dark .code-block-wrapper .token.tag,.dark .code-block-wrapper .token.boolean,.dark .code-block-wrapper .token.number,.dark .code-block-wrapper .token.constant,.dark .code-block-wrapper .token.symbol,.dark .code-block-wrapper .token.deleted{color:#f9826c}.dark .code-block-wrapper .token.selector,.dark .code-block-wrapper .token.attr-name,.dark .code-block-wrapper .token.string,.dark .code-block-wrapper .token.char,.dark .code-block-wrapper .token.builtin,.dark .code-block-wrapper .token.inserted{color:#a0d9b5}.dark .code-block-wrapper .token.operator,.dark .code-block-wrapper .token.entity,.dark .code-block-wrapper .token.url,.dark .code-block-wrapper .language-css .token.string,.dark .code-block-wrapper .style .token.string{color:#9dd9f3}.dark .code-block-wrapper .token.atrule,.dark .code-block-wrapper .token.attr-value,.dark .code-block-wrapper .token.keyword{color:#c792ea}.dark .code-block-wrapper .token.function,.dark .code-block-wrapper .token.class-name{color:#ffd580}.dark .code-block-wrapper .token.regex,.dark .code-block-wrapper .token.important,.dark .code-block-wrapper .token.variable{color:#ffcb6b}.dark .code-block-wrapper .token.important,.dark .code-block-wrapper .token.bold{font-weight:700}.dark .code-block-wrapper .token.italic{font-style:italic}.content table{width:100%;border-collapse:collapse;margin:1.5rem 0;font-size:.875rem;border:1px solid var(--border-primary);border-radius:.5rem;overflow:hidden}.content table thead{background-color:var(--bg-tertiary)}.content table th{padding:.75rem 1rem;text-align:left;font-weight:600;color:var(--text-primary);border-bottom:1px solid var(--border-primary)}.content table td{padding:.75rem 1rem;border-bottom:1px solid var(--border-primary);color:var(--text-secondary)}.content table tbody tr:last-child td{border-bottom:none}.content table tbody tr:hover{background-color:var(--bg-tertiary)}#toc-nav a{display:block;font-size:.8125rem;color:var(--text-tertiary);text-decoration:none;border-left:2px solid transparent;padding:.375rem 0 .375rem .75rem;transition:all .15s ease}#toc-nav a:hover{color:var(--text-primary);border-left-color:var(--border-secondary)}#toc-nav a.active{color:var(--accent);border-left-color:var(--accent);font-weight:500}.note{padding:1rem;border-radius:.5rem;margin:1.5rem 0;border-left:4px solid var(--accent);background-color:var(--bg-tertiary)}.note-title{font-weight:600;margin-bottom:.5rem;color:var(--text-primary)}.note-content{color:var(--text-secondary);line-height:1.6}.demo-container{margin:2rem 0;padding:2rem;border-radius:.75rem;background-color:var(--bg-secondary);border:1px solid var(--border-primary)}.demo-iframe{width:100%;height:600px;border:1px solid var(--border-primary);border-radius:.5rem;background-color:#fff}.demo-controls{display:flex;gap:1rem;margin-bottom:1rem;flex-wrap:wrap}.demo-input{flex:1;min-width:200px;padding:.5rem .75rem;border:1px solid var(--border-primary);border-radius:.375rem;background-color:var(--bg-primary);color:var(--text-primary);font-size:.875rem}.demo-button{padding:.5rem 1rem;background-color:var(--accent);color:#fff;border:none;border-radius:.375rem;font-size:.875rem;font-weight:500;cursor:pointer;transition:background-color .15s ease}.demo-button:hover{background-color:var(--accent-hover)}.demo-example-card{margin-bottom:1.5rem;padding:1.5rem;border-radius:.5rem;background-color:var(--bg-primary);border:1px solid var(--border-primary)}.demo-example-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:1rem;padding-bottom:.75rem;border-bottom:1px solid var(--border-primary)}.demo-example-body{margin-top:1rem}.demo-launcher-btn{width:60px;height:60px;border-radius:50%;background:linear-gradient(135deg,#172aaf,#f668f2);border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s ease,box-shadow .2s ease;box-shadow:0 4px 12px #172aaf4d}.demo-launcher-btn:hover{transform:scale(1.05);box-shadow:0 6px 16px #172aaf66}.demo-launcher-btn:active{transform:scale(.95)}.demo-suggested-question{padding:.5rem 1rem;background-color:var(--bg-secondary);border:1px solid var(--border-primary);border-radius:.375rem;font-size:.875rem;color:var(--text-primary);cursor:pointer;transition:all .15s ease}.demo-suggested-question:hover{background-color:var(--accent);color:#fff;border-color:var(--accent)}@media (max-width: 1024px){.sidebar{transform:translate(-100%)}.sidebar.mobile-open{transform:translate(0)}#main-content{margin-left:0}#mobile-overlay.active{display:block}}@media (max-width: 768px){.content h1{font-size:1.875rem}.content h2{font-size:1.5rem}.content h3{font-size:1.25rem}.code-block-wrapper{margin-left:-1rem;margin-right:-1rem;border-radius:0}.code-block-collapsible.collapsed pre{max-height:300px}.code-block-collapsible.collapsed:after{height:100px}.code-block-expand-btn{padding:.5rem .875rem;font-size:.8125rem;min-height:36px}}@media (max-width: 480px){.code-block-header{flex-wrap:wrap;gap:.5rem}.code-block-lang{flex:1 1 100%;margin-bottom:.25rem}}.fade-in{animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:10px}::-webkit-scrollbar-track{background:var(--bg-secondary)}::-webkit-scrollbar-thumb{background:var(--border-secondary);border-radius:5px}::-webkit-scrollbar-thumb:hover{background:var(--text-tertiary)}
