:root{--bg-gradient:radial-gradient(circle at 0% 0%, #fcfdfd 0%, #f4f6fa 100%);--bg-card:#fff;--bg-body:#f4f6fa;--bg-card-secondary:#f3f4f699;--bg-panel:#ffffffb3;--bg-sidebar:#f3f4f6cc;--bg-button-secondary:#0000000a;--bg-button-secondary-hover:#00000014;--bg-input:#fff;--border:#e5e7ebcc;--border-focus:#6366f1;--text-primary:#1f2937;--text-secondary:#4b5563;--text-muted:#9ca3af;--primary:#6366f1;--primary-hover:#4f46e5;--primary-glow:#6366f126;--success:#10b981;--success-glow:#10b98126;--danger:#ef4444;--danger-glow:#ef44441a;--code-bg:#1e1e2e;--code-text:#cdd6f4;--shadow-sm:0 1px 2px 0 #0000000d;--shadow-md:0 4px 6px -1px #00000014, 0 2px 4px -1px #0000000a;--shadow-lg:0 10px 15px -3px #0000000f, 0 4px 6px -2px #00000008;--shadow-glow:0 0 20px #6366f11a;--glass-blur:blur(16px);--font-sans:"Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;--font-heading:"Outfit", var(--font-sans);--font-mono:"JetBrains Mono", monospace}@media (prefers-color-scheme:dark){:root{--bg-gradient:radial-gradient(circle at 0% 0%, #0d0f17 0%, #07080c 100%);--bg-card:#11131c;--bg-body:#0d0f17;--bg-card-secondary:#1e293b66;--bg-panel:#0f121e99;--bg-sidebar:#0a0c14d9;--bg-button-secondary:#ffffff0d;--bg-button-secondary-hover:#ffffff1a;--bg-input:#ffffff08;--border:#1f293799;--border-focus:#818cf8;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--primary:#818cf8;--primary-hover:#6366f1;--primary-glow:#818cf833;--success:#34d399;--success-glow:#34d39933;--danger:#f87171;--danger-glow:#f8717126;--code-bg:#0f111a;--code-text:#a6accd;--shadow-sm:0 1px 2px 0 #00000080;--shadow-md:0 4px 6px -1px #0000004d, 0 2px 4px -1px #0003;--shadow-lg:0 20px 25px -5px #0006, 0 10px 10px -5px #0000004d;--shadow-glow:0 0 25px #818cf826}}html.dark{--bg-gradient:radial-gradient(circle at 0% 0%, #0d0f17 0%, #07080c 100%);--bg-card:#11131c;--bg-body:#0d0f17;--bg-card-secondary:#1e293b66;--bg-panel:#0f121e99;--bg-sidebar:#0a0c14d9;--bg-button-secondary:#ffffff0d;--bg-button-secondary-hover:#ffffff1a;--bg-input:#ffffff08;--border:#1f293799;--border-focus:#818cf8;--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--primary:#818cf8;--primary-hover:#6366f1;--primary-glow:#818cf833;--success:#34d399;--success-glow:#34d39933;--danger:#f87171;--danger-glow:#f8717126;--code-bg:#0f111a;--code-text:#a6accd;--shadow-sm:0 1px 2px 0 #00000080;--shadow-md:0 4px 6px -1px #0000004d, 0 2px 4px -1px #0003;--shadow-lg:0 20px 25px -5px #0006, 0 10px 10px -5px #0000004d;--shadow-glow:0 0 25px #818cf826}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg-gradient);color:var(--text-primary);justify-content:center;align-items:stretch;min-height:100vh;line-height:1.5;display:flex;overflow-x:hidden}#root{flex-direction:column;width:100%;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);color:var(--text-primary);font-weight:600}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes spin{to{transform:rotate(360deg)}}.auth-container{flex-direction:column;justify-content:center;align-items:center;min-height:100vh;padding:24px;animation:.4s ease-out forwards fadeIn;display:flex}.auth-card{background:var(--bg-panel);width:100%;max-width:440px;-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);box-shadow:var(--shadow-lg), var(--shadow-glow);border-radius:16px;padding:40px;position:relative}.auth-header{text-align:center;margin-bottom:32px}.auth-header h1{background:linear-gradient(135deg, var(--primary), #ec4899);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:8px;font-size:28px;font-weight:700}.auth-header p{color:var(--text-secondary);font-size:14px}.form-group{text-align:left;margin-bottom:20px}.form-label{color:var(--text-secondary);margin-bottom:6px;font-size:13px;font-weight:500;display:block}.input-container{position:relative}.form-input{border:1px solid var(--border);background:var(--bg-input);width:100%;color:var(--text-primary);font-family:var(--font-sans);border-radius:8px;outline:none;padding:12px 16px;font-size:14px;transition:all .2s}.form-input:focus{border-color:var(--border-focus);box-shadow:0 0 0 3px var(--primary-glow)}.input-icon-right{color:var(--text-secondary);cursor:pointer;background:0 0;border:none;justify-content:center;align-items:center;display:flex;position:absolute;top:50%;right:12px;transform:translateY(-50%)}.btn{width:100%;font-family:var(--font-sans);cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:12px 24px;font-size:14px;font-weight:600;transition:all .2s;display:inline-flex}.btn-primary{background:var(--primary);color:#fff}.btn-primary:hover{background:var(--primary-hover);box-shadow:0 4px 12px var(--primary-glow);transform:translateY(-1px)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background:var(--bg-button-secondary);color:var(--text-primary);border:1px solid var(--border)}.btn-secondary:hover{background:var(--bg-button-secondary-hover)}.btn-sm{border-radius:6px;padding:6px 12px;font-size:12px}.alert{text-align:left;border-radius:8px;margin-bottom:20px;padding:12px 16px;font-size:13px}.alert-danger{background:var(--danger-glow);border:1px solid var(--danger);color:var(--danger)}.spinner{border:2px solid #ffffff4d;border-top-color:#fff;border-radius:50%;width:18px;height:18px;animation:.6s linear infinite spin}.dashboard-wrapper{min-height:100vh;animation:.3s ease-out forwards fadeIn;display:flex}.sidebar{background:var(--bg-sidebar);width:260px;-webkit-backdrop-filter:var(--glass-blur);border-right:1px solid var(--border);flex-direction:column;padding:32px 16px;display:flex}.sidebar-brand{font-family:var(--font-heading);background:linear-gradient(135deg, var(--primary), #ec4899);-webkit-text-fill-color:transparent;-webkit-background-clip:text;margin-bottom:40px;padding-left:12px;font-size:20px;font-weight:700}.sidebar-menu{flex-direction:column;flex-grow:1;gap:6px;list-style:none;display:flex}.sidebar-link{color:var(--text-secondary);cursor:pointer;border-radius:8px;align-items:center;gap:12px;padding:10px 14px;font-size:14px;font-weight:500;text-decoration:none;transition:all .2s;display:flex}.sidebar-link:hover{color:var(--text-primary);background:#ffffff0d}.sidebar-link.active{background:var(--primary-glow);color:var(--primary);font-weight:600}.sidebar-footer{border-top:1px solid var(--border);margin-top:auto;padding-top:20px}.main-content{flex-direction:column;flex-grow:1;padding:40px;display:flex;overflow-y:auto}.header{justify-content:space-between;align-items:center;margin-bottom:40px;display:flex}.header-title h2{font-size:24px;font-weight:700}.header-title p{color:var(--text-secondary);font-size:13px}.user-badge{background:var(--bg-panel);border:1px solid var(--border);border-radius:30px;align-items:center;gap:12px;padding:8px 16px;display:flex}.user-badge-avatar{background:var(--primary);color:#fff;border-radius:50%;justify-content:center;align-items:center;width:28px;height:28px;font-size:12px;font-weight:700;display:flex}.dashboard-grid{grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:24px;margin-bottom:40px;display:grid}.card{background:var(--bg-panel);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);box-shadow:var(--shadow-md);text-align:left;border-radius:12px;padding:24px;position:relative}.card-header{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.card-title{color:var(--text-primary);font-size:16px;font-weight:600}.card-body{color:var(--text-secondary)}.credential-row{margin-bottom:16px}.credential-row:last-child{margin-bottom:0}.credential-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.05em;margin-bottom:4px;font-size:12px}.credential-value{font-family:var(--font-mono);color:var(--text-primary);background:var(--code-bg);border:1px solid var(--border);border-radius:6px;justify-content:space-between;align-items:center;padding:8px 12px;font-size:14px;display:flex;overflow-x:auto}.copy-btn{color:var(--primary);cursor:pointer;background:0 0;border:none;border-radius:4px;padding:4px 8px;font-size:12px;font-weight:600;transition:background .2s}.copy-btn:hover{background:var(--primary-glow)}.badge{text-transform:uppercase;border-radius:4px;padding:4px 8px;font-size:11px;font-weight:600;display:inline-flex}.badge-success{background:var(--success-glow);color:var(--success)}.badge-danger{background:var(--danger-glow);color:var(--danger)}.table-container{background:var(--bg-panel);border:1px solid var(--border);box-shadow:var(--shadow-md);border-radius:12px;margin-top:24px;overflow-x:auto}.data-table{border-collapse:collapse;text-align:left;width:100%}.data-table th,.data-table td{padding:16px 24px}.data-table th{border-bottom:1px solid var(--border);color:var(--text-secondary);text-transform:uppercase;background:#ffffff05;font-size:12px;font-weight:600}.data-table td{border-bottom:1px solid var(--border);color:var(--text-primary);font-size:14px}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td{background:#ffffff03}.tags-container{flex-wrap:wrap;gap:8px;margin-top:8px;display:flex}.tag-pill{border:1px solid var(--border);color:var(--text-secondary);background:#ffffff0d;border-radius:20px;padding:4px 10px;font-size:12px}.toast-msg{background:var(--primary);color:#fff;box-shadow:var(--shadow-lg);z-index:1000;border-radius:8px;padding:12px 24px;font-size:14px;font-weight:500;animation:.2s ease-out fadeIn;position:fixed;bottom:24px;right:24px}.sidebar-backdrop{-webkit-backdrop-filter:blur(4px);z-index:998;background:#0006;animation:.2s ease-out fadeIn;position:fixed;inset:0}@media (width<=1024px){.sidebar{z-index:999;background:var(--bg-sidebar);box-shadow:var(--shadow-lg);transition:transform .3s cubic-bezier(.4,0,.2,1);position:fixed;top:0;bottom:0;left:0;transform:translate(-100%);width:280px!important}.sidebar.open{transform:translate(0)}.menu-toggle-btn,.menu-close-btn{display:block!important}.main-content{padding:24px}}@media (width<=768px){.main-content{padding:16px}.header{flex-direction:column;align-items:flex-start;gap:16px}.header-title{margin-bottom:0}.dashboard-grid{grid-template-columns:1fr;gap:16px}.card{padding:16px}.btn{padding:10px 20px}}@media (width<=480px){.auth-card{padding:24px 16px}.auth-container{padding:12px}.user-badge{padding:6px 12px}.user-badge-name{display:none}}.module-grid{grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:20px;animation:.3s ease-out fadeIn;display:grid}.module-card{background:var(--bg-panel);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);box-shadow:var(--shadow-md);cursor:pointer;border-radius:14px;padding:20px;transition:all .2s;position:relative;overflow:hidden}.module-card:hover{box-shadow:var(--shadow-lg);transform:translateY(-2px)}.module-card-locked{opacity:.6;cursor:default}.module-card-locked:hover{box-shadow:var(--shadow-md);transform:none}.module-card-coming-soon{cursor:default}.module-badge{letter-spacing:.06em;text-transform:uppercase;border-radius:20px;align-items:center;gap:5px;padding:3px 10px;font-size:10px;font-weight:700;display:inline-flex}.module-badge-live{color:#10b981;background:#10b9811f;border:1px solid #10b9814d}.module-badge-coming-soon{color:#f59e0b;background:#f59e0b1f;border:1px solid #f59e0b4d}.module-badge-locked{color:#f87171;background:#ef44441a;border:1px solid #ef444440}.module-badge-beta{color:#818cf8;background:#6366f11f;border:1px solid #6366f14d}.version-badge{font-size:10px;font-weight:700;font-family:var(--font-mono);color:var(--primary);letter-spacing:.04em;background:#6366f11f;border:1px solid #6366f140;border-radius:4px;align-items:center;padding:2px 8px;display:inline-flex}.breadcrumb{color:var(--text-muted);align-items:center;gap:6px;font-size:12px;display:flex}.breadcrumb-sep{color:var(--text-muted);opacity:.5;font-size:12px}.breadcrumb-active{color:var(--text-primary);font-weight:500}@keyframes skeleton-pulse{0%{opacity:.4}50%{opacity:.7}to{opacity:.4}}.skeleton{background:linear-gradient(90deg, var(--border) 25%, #ffffff0f 50%, var(--border) 75%);background-size:200% 100%;border-radius:6px;animation:1.8s ease-in-out infinite skeleton-pulse}.skeleton-text{height:14px;margin-bottom:8px}.skeleton-card{border-radius:14px;height:160px}.doc-search{align-items:center;display:flex;position:relative}.doc-search input{background:var(--bg-sidebar);border:1px solid var(--border);color:var(--text-primary);border-radius:8px;outline:none;width:240px;padding:7px 12px 7px 32px;font-size:13px;transition:border-color .2s}.doc-search input:focus{border-color:var(--border-focus);box-shadow:0 0 0 2px var(--primary-glow)}.doc-search-icon{color:var(--text-muted);pointer-events:none;font-size:14px;position:absolute;left:9px}.sidebar-section-header{letter-spacing:.08em;text-transform:uppercase;color:var(--text-muted);margin-top:12px;margin-bottom:2px;padding:4px 14px;font-size:10px;font-weight:700}.locked-overlay{-webkit-backdrop-filter:blur(2px);background:#00000040;border-radius:14px;flex-direction:column;justify-content:center;align-items:center;gap:4px;display:flex;position:absolute;inset:0}.tab-bar{border-bottom:1px solid var(--border);flex-wrap:wrap;gap:4px;margin-bottom:24px;padding-bottom:12px;display:flex}.tab-bar-item{cursor:pointer;color:var(--text-secondary);background:0 0;border:1px solid #0000;border-radius:6px;padding:5px 14px;font-size:12px;font-weight:500;transition:all .15s}.tab-bar-item:hover{background:var(--bg-sidebar);color:var(--text-primary)}.tab-bar-item.active{background:var(--primary-glow);border-color:var(--primary);color:var(--primary);font-weight:600}@media (width>=1600px){.module-grid{grid-template-columns:repeat(auto-fill,minmax(300px,1fr))}.main-content{max-width:1800px;margin:0 auto;padding:48px 64px}}@media (width>=2000px){.main-content{max-width:2200px}}@media (width<=1024px){.module-grid{grid-template-columns:repeat(auto-fill,minmax(220px,1fr))}}@media (width<=768px){.module-grid{grid-template-columns:1fr 1fr;gap:14px}.doc-search input{width:100%}.tab-bar{gap:6px}}@media (width<=480px){.module-grid{grid-template-columns:1fr}}@media (width<=1024px){.playground-columns-container{grid-template-columns:1fr!important}}html{overflow-x:hidden}button,select,input,textarea{touch-action:manipulation}.sidebar-link{min-height:40px}.settings-grid{grid-template-columns:2.2fr 1fr;gap:28px;animation:.3s ease-out fadeIn;display:grid}@media (width<=1100px){.settings-grid{grid-template-columns:1.6fr 1fr;gap:20px}}@media (width<=900px){.settings-grid{grid-template-columns:1fr;gap:20px}}.stat-grid-2col{grid-template-columns:1fr 1fr;gap:12px;display:grid}.stat-grid-3col{grid-template-columns:1fr 1fr 1fr;gap:12px;display:grid}@media (width<=480px){.stat-grid-2col{grid-template-columns:1fr;gap:8px}.stat-grid-3col{grid-template-columns:1fr 1fr;gap:8px}}.content-grid-2col{grid-template-columns:1fr 1fr;gap:20px;display:grid}@media (width<=768px){.content-grid-2col{grid-template-columns:1fr;gap:16px}}.playground-header{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}@media (width<=640px){.playground-header{flex-direction:column;align-items:flex-start}}.action-btn-row{flex-wrap:wrap;align-items:center;gap:10px;display:flex}@media (width<=480px){.action-btn-row{flex-direction:column;align-items:stretch}.action-btn-row .btn{justify-content:center;width:100%}}@media (width<=768px){.header-title h2{white-space:nowrap;text-overflow:ellipsis;max-width:clamp(160px,45vw,500px);font-size:18px;overflow:hidden}.header{flex-wrap:wrap;gap:10px}}@media (width<=480px){.header-title h2{max-width:clamp(140px,55vw,360px);font-size:15px}.header-title p{font-size:11px}.user-badge{gap:6px;padding:5px 10px}}.table-container{-webkit-overflow-scrolling:touch;max-width:100%;overflow-x:auto}@media (width<=768px){.data-table th,.data-table td{padding:10px 14px;font-size:13px}}@media (width<=480px){.data-table th,.data-table td{padding:8px 10px;font-size:12px}.data-table .hide-mobile{display:none}}@media (width<=640px){.credential-value{word-break:break-all;overflow-wrap:anywhere;flex-wrap:wrap;gap:4px;font-size:11px}.credential-value span:first-child{text-overflow:ellipsis;white-space:nowrap;flex:1;min-width:0;overflow:hidden}.card{padding:16px}.card-body{padding:0}.auth-card{padding:28px 20px}}@media (width<=400px){.card{padding:12px}}@media (width<=480px){.main-content{padding:12px}.header{margin-bottom:20px}.dashboard-grid{gap:12px;margin-bottom:20px}}@media (width<=1024px){.sidebar{overscroll-behavior:contain;overflow-y:auto}.sidebar-menu{gap:4px}}@media (width<=480px){.doc-search,.doc-search input{width:100%}}@media (width<=640px){.form-row-flex{flex-direction:column!important;align-items:stretch!important}.form-row-flex>*{width:100%!important}}@media (width<=900px){.webhook-detail-grid{grid-template-columns:1fr!important}}pre{-webkit-overflow-scrolling:touch;white-space:pre;max-width:100%;overflow-x:auto}@media (width<=480px){.toast-msg{text-align:center;padding:10px 16px;font-size:13px;bottom:12px;left:12px;right:12px}}@media (width<=360px){.module-grid{grid-template-columns:1fr}}@media (width<=480px){.btn-sm{padding:5px 10px;font-size:11px}.breadcrumb{flex-wrap:wrap;gap:4px}}@media (width<=320px){.sidebar{width:100%!important}}@media (width<=400px){.stat-grid-2col{grid-template-columns:1fr}}.tab-bar{-webkit-overflow-scrolling:touch;scrollbar-width:none;-ms-overflow-style:none;flex-wrap:nowrap;overflow-x:auto}.tab-bar::-webkit-scrollbar{display:none}@media (width<=600px){.tab-bar{flex-wrap:wrap;overflow-x:visible}.tab-bar-item{flex-shrink:0}}@media (width<=480px){.input-copy-row{flex-direction:column!important}.input-copy-row input,.input-copy-row button{width:100%!important}}.form-actions{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.form-actions-left{flex-wrap:wrap;gap:12px;display:flex}@media (width<=560px){.form-actions{flex-direction:column;align-items:stretch}.form-actions-left{flex-direction:column}.form-actions .btn,.form-actions-left .btn{justify-content:center;width:100%}}.report-form-grid{grid-template-columns:1fr 1fr;gap:16px;margin-bottom:16px;display:grid}@media (width<=600px){.report-form-grid{grid-template-columns:1fr;gap:12px}}.profile-info-grid{grid-template-columns:1fr 1fr;gap:20px;display:grid}@media (width<=560px){.profile-info-grid{grid-template-columns:1fr;gap:12px}}.auth-info-grid{grid-template-columns:1fr 1fr;gap:20px;margin-bottom:20px;display:grid}@media (width<=640px){.auth-info-grid{grid-template-columns:1fr;gap:12px}}
