:root{--bg-primary:#0f172a;--bg-secondary:#0f172a;--bg-tertiary:#020617;--border-color:#1e293b;--border-light:#334155;--text-primary:#f1f5f9;--text-secondary:#94a3b8;--text-muted:#64748b;--accent-indigo:#6366f1;--accent-indigo-dark:#4f46e5;--accent-indigo-glow:#6366f126;--accent-emerald:#34d399;--accent-emerald-dark:#059669;--accent-emerald-glow:#34d3991a;--accent-amber:#fbbf24;--accent-amber-dark:#d97706;--accent-amber-glow:#fbbf241a;--font-sans:"Inter", sans-serif;--font-mono:"Fira Code", monospace}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow:hidden}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--bg-tertiary)}::-webkit-scrollbar-thumb{background:var(--border-color);border-radius:3px}::-webkit-scrollbar-thumb:hover{background:var(--border-light)}.app-container{flex-direction:column;width:100vw;height:100vh;display:flex;overflow:hidden}.app-header{background-color:var(--bg-secondary);border-bottom:1px solid var(--border-color);z-index:50;flex-shrink:0;justify-content:space-between;align-items:center;height:64px;padding:0 24px;display:flex}.brand-section{align-items:center;gap:12px;display:flex}.brand-icon{background-color:var(--accent-indigo-dark);color:#fff;border-radius:8px;justify-content:center;align-items:center;width:32px;height:32px;display:flex}.brand-info{flex-direction:column;display:flex}.brand-title{letter-spacing:.05em;color:#fff;font-size:16px;font-weight:800;line-height:1.2}.brand-subtitle{color:var(--accent-indigo);letter-spacing:.1em;font-size:10px;font-weight:600}.header-badges{align-items:center;gap:12px;display:flex}.badge-status{background-color:var(--accent-emerald-glow);color:var(--accent-emerald);border:1px solid #34d39933;border-radius:9999px;align-items:center;gap:8px;padding:6px 12px;font-size:11px;font-weight:600;display:flex}.pulse-dot{background-color:var(--accent-emerald);border-radius:50%;width:6px;height:6px;animation:1.5s infinite pulse;box-shadow:0 0 #34d399b3}@keyframes pulse{0%{transform:scale(.95);box-shadow:0 0 #34d399b3}70%{transform:scale(1);box-shadow:0 0 0 5px #34d39900}to{transform:scale(.95);box-shadow:0 0 #34d39900}}.badge-version{background-color:var(--border-color);color:var(--text-secondary);border:1px solid var(--border-light);font-size:11px;font-weight:600;font-family:var(--font-mono);border-radius:6px;padding:6px 10px}.main-wrapper{flex:1;height:calc(100vh - 64px);display:flex;overflow:hidden}.sidebar{background-color:var(--bg-secondary);border-right:1px solid var(--border-color);flex-direction:column;flex-shrink:0;gap:24px;width:260px;padding:24px 16px;display:flex;overflow-y:auto}.sidebar-nav-section{flex-direction:column;gap:6px;display:flex}.sidebar-nav-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:.15em;margin-bottom:4px;padding:0 8px;font-size:10px;font-weight:700}.sidebar-link{color:var(--text-secondary);cursor:pointer;border-left:2px solid #0000;border-radius:8px;justify-content:space-between;align-items:center;padding:10px 12px;font-size:13px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.sidebar-link-content{align-items:center;gap:10px;display:flex}.sidebar-link:hover{color:var(--text-primary);background-color:#1e293b80}.sidebar-link.active{color:var(--accent-indigo);border-left-color:var(--accent-indigo);background-color:#6366f114}.sidebar-link.sandbox-link.active{color:var(--accent-amber);border-left-color:var(--accent-amber);background-color:#fbbf2414}.method-badge{font-size:9px;font-weight:700;font-family:var(--font-mono);border-radius:4px;padding:2px 6px}.method-badge.post{background-color:var(--accent-emerald-glow);color:var(--accent-emerald)}.workspace-container{flex:1;height:100%;display:flex;overflow:hidden}.left-pane{border-right:1px solid var(--border-color);flex:1;max-width:60%;height:100%;min-height:0;max-height:100%;padding:40px;overflow-y:auto}.right-pane{background-color:var(--bg-tertiary);width:40%;height:100%;min-height:0;max-height:100%;padding:40px;overflow-y:auto}.quick-sheet-panel,.code-example-panel{margin-bottom:32px}.mobile-nav-toggle{display:none}.section-meta{color:var(--accent-indigo);text-transform:uppercase;letter-spacing:.15em;margin-bottom:8px;font-size:11px;font-weight:700}.section-title{color:#fff;letter-spacing:-.02em;margin-bottom:16px;font-size:28px;font-weight:800}.section-subtitle{color:#fff;margin-top:32px;margin-bottom:16px;font-size:20px;font-weight:700}.section-text{color:var(--text-secondary);margin-bottom:20px;font-size:15px;font-weight:400;line-height:1.6}.section-text strong{color:#fff;font-weight:600}.alert-card{border:1px solid #0000;border-radius:12px;gap:16px;margin-bottom:32px;padding:20px;display:flex}.alert-card.indigo{background-color:var(--accent-indigo-glow);border-color:#6366f133}.alert-card.amber{background-color:var(--accent-amber-glow);border-color:#fbbf2433}.alert-icon{flex-shrink:0;justify-content:center;align-items:center;width:24px;height:24px;display:flex}.alert-icon.indigo{color:var(--accent-indigo)}.alert-icon.amber{color:var(--accent-amber)}.alert-content{flex-direction:column;gap:6px;display:flex}.alert-title{color:#fff;font-size:14px;font-weight:600}.alert-desc{color:var(--text-secondary);font-size:13px;line-height:1.5}.code-block-inline{background-color:var(--bg-tertiary);border:1px solid var(--border-color);font-family:var(--font-mono);color:var(--text-primary);white-space:pre-wrap;border-radius:8px;margin-bottom:24px;padding:14px 18px;font-size:13px;position:relative;overflow-x:auto}.diagram-container{border:1px solid var(--border-color);background-color:#0f172a4d;border-radius:12px;margin-top:16px;margin-bottom:32px;padding:24px}.diagram-header{color:var(--text-muted);text-transform:uppercase;letter-spacing:.1em;text-align:center;margin-bottom:20px;font-size:11px;font-weight:700}.diagram-flow{justify-content:center;align-items:center;gap:16px;display:flex}.diagram-step{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:#fff;border-radius:8px;justify-content:center;align-items:center;gap:10px;min-width:140px;padding:12px 16px;font-size:12px;font-weight:600;display:flex}.diagram-step.emerald{border-color:#34d39966}.diagram-step-icon{color:var(--accent-indigo)}.diagram-step-icon.emerald{color:var(--accent-emerald)}.diagram-arrow{color:var(--text-muted);font-size:16px}.credentials-grid{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:24px;display:grid}.credential-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:10px;flex-direction:column;gap:8px;padding:16px;display:flex;position:relative}.credential-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:600}.credential-value-wrapper{justify-content:space-between;align-items:center;gap:10px;display:flex}.credential-value{font-family:var(--font-mono);color:#fff;word-break:break-all;font-size:13px;font-weight:600}.credential-value.emerald{color:var(--accent-emerald)}.copy-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:4px;transition:all .2s;display:flex}.copy-btn:hover{color:var(--text-primary);background-color:#ffffff0d}.endpoint-header{align-items:center;gap:12px;margin-bottom:20px;display:flex}.endpoint-method{font-family:var(--font-mono);background-color:var(--accent-emerald-glow);color:var(--accent-emerald);border:1px solid #34d39933;border-radius:6px;padding:4px 10px;font-size:14px;font-weight:700}.endpoint-path{font-family:var(--font-mono);color:#fff;font-size:16px;font-weight:600}.table-title{color:#fff;margin-top:24px;margin-bottom:12px;font-size:14px;font-weight:600}.spec-table-container{border:1px solid var(--border-color);border-radius:8px;margin-bottom:32px;overflow:hidden}.spec-table{border-collapse:collapse;text-align:left;width:100%;font-size:13px}.spec-table th{color:var(--text-secondary);border-bottom:1px solid var(--border-color);background-color:#1e293b4d;padding:12px 16px;font-weight:600}.spec-table td{border-bottom:1px solid var(--border-color);vertical-align:top;padding:12px 16px}.spec-table tr:last-child td{border-bottom:none}.field-name{font-family:var(--font-mono);color:#fff;font-weight:600}.field-type{font-family:var(--font-mono);color:var(--accent-indigo);font-size:11px}.field-req{border-radius:4px;padding:2px 6px;font-size:11px;font-weight:600}.field-req.required{color:#f87171;background-color:#f8717114}.field-req.optional{color:var(--text-muted);background-color:#64748b14}.field-desc{color:var(--text-secondary);line-height:1.5}.quick-sheet-panel{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;padding:20px}.quick-sheet-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.1em;margin-bottom:16px;font-size:11px;font-weight:700}.quick-sheet-rows{flex-direction:column;gap:12px;display:flex}.quick-sheet-row{justify-content:space-between;align-items:center;font-size:12px;display:flex}.quick-sheet-label{color:var(--text-muted);font-weight:500}.quick-sheet-value{font-family:var(--font-mono);color:#fff;font-weight:600}.code-example-panel{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;overflow:hidden}.code-panel-header{border-bottom:1px solid var(--border-color);background-color:#1e293b33;justify-content:space-between;align-items:center;height:48px;padding:0 16px;display:flex}.code-panel-title{color:var(--text-secondary);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700}.code-tabs{height:100%;display:flex}.code-tab{color:var(--text-muted);font-family:var(--font-mono);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;align-items:center;height:100%;padding:0 16px;font-size:12px;font-weight:500;transition:all .2s;display:flex}.code-tab:hover{color:var(--text-primary)}.code-tab.active{color:var(--text-primary);border-bottom-color:var(--accent-indigo);background-color:#ffffff05}.code-content-wrapper{position:relative}.code-display{font-family:var(--font-mono);color:#cbd5e1;background-color:var(--bg-tertiary);max-height:400px;margin:0;padding:20px;font-size:12px;line-height:1.6;overflow:auto}.code-copy-absolute{z-index:10;position:absolute;top:12px;right:12px}.sandbox-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);border-radius:12px;flex-direction:column;display:flex;overflow:hidden}.sandbox-header{border-bottom:1px solid var(--border-color);background-color:#fbbf2408;align-items:center;gap:10px;padding:10px 14px;display:flex}.sandbox-header-title{color:var(--accent-amber);text-transform:uppercase;letter-spacing:.05em;font-size:13px;font-weight:700}.sandbox-body{flex-direction:column;gap:12px;padding:14px;display:flex}.sandbox-inputs-grid{grid-template-columns:2fr 1.2fr;gap:12px;display:grid}.sandbox-group{flex-direction:column;gap:6px;display:flex}.sandbox-label{color:var(--text-secondary);font-size:12px;font-weight:600}.sandbox-input{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:#fff;font-family:var(--font-mono);border-radius:8px;outline:none;padding:8px 12px;font-size:13px;transition:border-color .2s}.sandbox-input:focus{border-color:var(--accent-indigo)}.sandbox-actions{gap:10px;margin-top:4px;display:flex}.btn{cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:8px 14px;font-size:13px;font-weight:600;transition:all .2s;display:flex}.btn-primary{background-color:var(--accent-indigo-dark);color:#fff}.btn-primary:hover{background-color:var(--accent-indigo)}.btn-secondary{background-color:var(--border-color);color:var(--text-secondary);border:1px solid var(--border-light)}.btn-secondary:hover{background-color:var(--border-light);color:var(--text-primary)}.sandbox-console{border-top:1px solid var(--border-color);margin-top:10px;padding-top:10px}.console-header{justify-content:space-between;align-items:center;margin-bottom:8px;display:flex}.console-title{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;font-size:11px;font-weight:700}.status-badge{font-family:var(--font-mono);border-radius:4px;padding:3px 8px;font-size:11px;font-weight:700}.status-badge.ready{background-color:var(--border-color);color:var(--text-secondary)}.status-badge.success{background-color:var(--accent-emerald-glow);color:var(--accent-emerald)}.status-badge.unauthorized{color:#ef4444;background-color:#ef44441a}.status-badge.validation{background-color:var(--accent-amber-glow);color:var(--accent-amber)}.console-output{border:1px solid var(--border-color);font-family:var(--font-mono);white-space:pre-wrap;background-color:#020617;border-radius:8px;max-height:280px;padding:12px 16px;font-size:12px;overflow:auto}.json-key{color:#818cf8}.json-value-string{color:#34d399}.json-value-number{color:#fb7185}.json-value-boolean{color:#fbbf24}.toast{background-color:var(--bg-secondary);border:1px solid var(--border-color);z-index:100;border-radius:8px;align-items:center;gap:10px;padding:12px 16px;animation:.2s ease-out slideIn;display:flex;position:fixed;bottom:24px;right:24px;box-shadow:0 10px 15px -3px #0000004d}@keyframes slideIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.toast-icon{color:var(--accent-emerald)}.toast-text{color:#fff;font-size:13px;font-weight:500}html{scroll-behavior:smooth;scroll-padding-top:80px}@media (width<=1024px){.left-pane{max-width:100%}.right-pane{width:100%}.workspace-container{flex-direction:column;overflow-y:auto}.left-pane,.right-pane{border-right:none;border-bottom:1px solid var(--border-color);height:auto;overflow-y:visible}.main-wrapper{overflow-y:auto}}@media (width<=768px){.sidebar{display:none}.sidebar.mobile-open{z-index:40;width:260px;height:calc(100vh - 64px);display:flex;position:fixed;top:64px;left:0;box-shadow:20px 0 30px #00000080}.mobile-nav-toggle{color:#fff;cursor:pointer;background:0 0;border:none;padding:8px;font-size:20px;display:flex}.left-pane,.right-pane{padding:24px 16px}.credentials-grid{grid-template-columns:1fr}.diagram-flow{flex-direction:column;gap:12px}.diagram-arrow{transform:rotate(90deg)}}
