:root{--font-display: "Poppins", sans-serif;--font-body: "DM Sans", sans-serif;--bg-base: #0a0d12;--bg-surface: #111620;--bg-card: #161d2b;--bg-hover: #1d2638;--bg-input: #0f1520;--border: #1e2a3d;--border-light: #253448;--text-primary: #e8edf5;--text-secondary: #8899b3;--text-muted: #4a5a72;--accent-cyan: #2563eb;--accent-cyan-dim: rgba(0, 212, 232, .2);--accent-cyan-glow: rgba(0, 212, 232, .25);--accent-amber: #f59e0b;--accent-amber-dim: rgba(245, 158, 11, .2);--accent-green: #10b981;--accent-green-dim: rgba(16, 185, 129, .2);--accent-red: #f50808;--accent-red-dim: rgba(239, 68, 68, .2);--accent-purple: #8b5cf6;--sidebar-width: 260px;--topbar-height: 64px;--shadow-sm: 0 1px 3px rgba(0,0,0,.4);--shadow-md: 0 4px 16px rgba(0,0,0,.5);--shadow-lg: 0 8px 32px rgba(0,0,0,.6);--shadow-glow-cyan: 0 0 20px rgba(0, 212, 232, .2);--radius-sm: 6px;--radius-md: 10px;--radius-lg: 16px;--radius-xl: 24px;--transition: .2s ease}[data-theme=light]{--bg-base: #f0f4f8;--bg-surface: #ffffff;--bg-card: #ffffff;--bg-hover: #f5f8fc;--bg-input: #f8fafc;--border: #dce4ef;--border-light: #e8eef7;--text-primary: #0f1a2e;--text-secondary: #4a6080;--text-muted: #8899b3;--accent-cyan: #2563eb;--accent-cyan-dim: rgba(0, 92, 168, .12);--accent-cyan-glow: rgba(0, 152, 168, .15);--accent-amber: #d97706;--accent-amber-dim: rgba(217, 119, 6, .1);--accent-green: #059669;--accent-green-dim: rgba(5, 150, 105, .1);--accent-red: #dc2626;--accent-red-dim: rgba(220, 38, 38, .08);--shadow-sm: 0 1px 3px rgba(0,0,0,.08);--shadow-md: 0 4px 16px rgba(0,0,0,.1);--shadow-lg: 0 8px 32px rgba(0,0,0,.12);--shadow-glow-cyan: 0 0 20px rgba(0, 152, 168, .12)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--bg-base);color:var(--text-primary);font-size:15px;line-height:1.6;width:100%;margin:auto;min-height:100vh;transition:background var(--transition),color var(--transition);-webkit-font-smoothing:antialiased}h1,h2,h3,h4,h5,h6{font-family:var(--font-display);line-height:1.1;letter-spacing:.03em}a{color:inherit;text-decoration:none}button{font-family:var(--font-body);cursor:pointer;border:none;outline:none;transition:all var(--transition)}input,select,textarea{font-family:var(--font-body);outline:none;border:none}::-webkit-scrollbar{width:5px;height:5px}::-webkit-scrollbar-track{background:var(--bg-base)}::-webkit-scrollbar-thumb{background:var(--border-light);border-radius:99px}::-webkit-scrollbar-thumb:hover{background:var(--text-muted)}.flex{display:flex}.flex-col{display:flex;flex-direction:column}.items-center{align-items:center}.justify-between{justify-content:space-between}.gap-1{gap:4px}.gap-2{gap:8px}.gap-3{gap:12px}.gap-4{gap:16px}.gap-6{gap:24px}.w-full{width:100%}.text-sm{font-size:13px}.text-xs{font-size:11px}.font-medium{font-weight:500}.font-semibold{font-weight:600}.truncate{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInLeft{0%{opacity:0;transform:translate(-16px)}to{opacity:1;transform:translate(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 0 0 var(--accent-cyan-glow)}50%{box-shadow:0 0 0 8px transparent}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}@keyframes blink{0%,to{opacity:1}50%{opacity:.4}}.animate-fade{animation:fadeIn .3s ease both}.animate-slide{animation:slideInLeft .3s ease both}.skeleton{background:linear-gradient(90deg,var(--bg-card) 25%,var(--bg-hover) 50%,var(--bg-card) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-sm)}.spinner{width:20px;height:20px;border:2px solid var(--border);border-top-color:var(--accent-cyan);border-radius:50%;animation:spin .7s linear infinite;display:inline-block}.react-hot-toast{font-family:var(--font-body)!important}.grid-2{display:grid;grid-template-columns:repeat(2,1fr);gap:16px}.grid-3{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.grid-4{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}.stats-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}@media(max-width:1200px){.grid-4{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.grid-2,.grid-3,.grid-4{grid-template-columns:1fr}.stats-grid{gap:8px}:root{--sidebar-width: 0px}}.page{animation:fadeIn .3s ease}.page-header{margin-bottom:24px;display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.page-title{font-size:28px;font-weight:700;color:var(--text-primary)}.page-subtitle{font-size:14px;color:var(--text-secondary);margin-top:2px}.card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:20px;transition:border-color var(--transition),box-shadow var(--transition)}.card:hover{border-color:var(--border-light);box-shadow:var(--shadow-md)}.card-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}.card-title{font-family:var(--font-display);font-size:18px;font-weight:600;color:var(--text-primary)}.btn{display:inline-flex;align-items:center;gap:6px;padding:8px 18px;border-radius:var(--radius-md);font-size:14px;font-weight:500;transition:all var(--transition);white-space:nowrap}.btn-primary{background:var(--accent-cyan);color:#000;font-weight:800;font-family:Poppins}.btn-primary:hover{filter:brightness(1.1);transform:translateY(-1px);box-shadow:var(--shadow-glow-cyan)}.btn-secondary{background:var(--bg-hover);color:var(--text-primary);border:1px solid var(--border);font-weight:700}.btn-secondary:hover{border-color:var(--accent-cyan);color:var(--accent-cyan)}.btn-danger{background:var(--accent-red-dim);color:var(--accent-red);border:1px solid transparent}.btn-danger:hover{background:var(--accent-red);color:#fff}.btn-ghost{background:transparent;color:var(--text-secondary)}.btn-ghost:hover{background:var(--bg-hover);color:var(--text-primary)}.btn-sm{padding:8px 12px;font-size:14px;font-weight:700;border-radius:50px}.btn-icon{padding:8px;border-radius:var(--radius-md);background:var(--bg-hover);color:var(--text-secondary);display:inline-flex;align-items:center;justify-content:center}.btn-icon:hover{background:var(--accent-cyan-dim);color:var(--accent-cyan)}.btn:disabled{opacity:.5;cursor:not-allowed;pointer-events:none}.form-group{display:flex;flex-direction:column;gap:6px}.form-label{font-size:13px;font-weight:500;color:var(--text-secondary)}.form-input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 14px;color:var(--text-primary);font-size:14px;width:100%;transition:border-color var(--transition),box-shadow var(--transition)}.form-input:focus{border-color:var(--accent-cyan);box-shadow:0 0 0 3px var(--accent-cyan-dim)}.form-input::placeholder{color:var(--text-muted)}.form-select{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius-md);padding:10px 14px;color:var(--text-primary);font-size:14px;width:100%;cursor:pointer;transition:border-color var(--transition);appearance:none}.form-select:focus{border-color:var(--accent-cyan)}.form-error{font-size:12px;color:var(--accent-red)}.form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}@media(max-width:600px){.form-row{grid-template-columns:1fr}}.table-wrapper{overflow-x:auto;border-radius:var(--radius-lg);border:1px solid var(--border)}table{width:100%;border-collapse:collapse;font-size:14px}thead{background:var(--bg-hover);border-bottom:1px solid var(--border)}th{padding:12px 16px;text-align:left;font-family:var(--font-display);font-size:13px;font-weight:600;color:var(--text-secondary);text-transform:uppercase;letter-spacing:.06em;white-space:nowrap}td{padding:14px 16px;border-bottom:1px solid var(--border);color:var(--text-primary)}tr:last-child td{border-bottom:none}tbody tr{transition:background var(--transition)}tbody tr:hover{background:var(--bg-hover)}.modal-overlay{position:fixed;inset:0;background:#000000b3;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:1000;display:flex;align-items:center;justify-content:center;padding:16px;animation:fadeIn .15s ease}.modal{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius-xl);padding:28px;width:100%;max-width:520px;box-shadow:var(--shadow-lg);animation:fadeIn .2s ease}.modal-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.modal-title{font-family:var(--font-display);font-size:22px;font-weight:700}.modal-close{background:none;border:none;color:var(--text-muted);font-size:20px;cursor:pointer;padding:4px;border-radius:var(--radius-sm);line-height:1}.modal-close:hover{color:var(--text-primary);background:var(--bg-hover)}.modal-footer{display:flex;gap:12px;justify-content:flex-end;margin-top:24px}.badge{display:inline-flex;align-items:center;gap:4px;padding:3px 10px;border-radius:99px;font-size:12px;font-weight:600}.badge-green{background:var(--accent-green-dim);color:var(--accent-green)}.badge-red{background:var(--accent-red-dim);color:var(--accent-red)}.badge-amber{background:var(--accent-amber-dim);color:var(--accent-amber)}.badge-cyan{background:var(--accent-cyan-dim);color:var(--accent-cyan)}.badge-muted{background:var(--bg-hover);color:var(--text-muted)}.toggle{position:relative;display:inline-block;width:44px;height:24px}.toggle input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;inset:0;background:var(--bg-hover);border:1px solid var(--border);border-radius:99px;transition:all .25s}.toggle-slider:before{content:"";position:absolute;width:18px;height:18px;left:2px;top:2px;background:var(--text-muted);border-radius:50%;transition:all .25s}.toggle input:checked+.toggle-slider{background:var(--accent-cyan);border-color:var(--accent-cyan)}.toggle input:checked+.toggle-slider:before{transform:translate(20px);background:#000}.empty-state{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 24px;gap:12px;color:var(--text-muted);text-align:center}.empty-state svg{width:48px;height:48px;opacity:.4}.empty-state h3{font-size:18px;color:var(--text-secondary)}.empty-state p{font-size:14px;max-width:300px}.divider{height:1px;background:var(--border);margin:20px 0}.dot{width:8px;height:8px;border-radius:50%;display:inline-block}.dot-green{background:var(--accent-green);box-shadow:0 0 6px var(--accent-green);animation:blink 2s ease-in-out infinite}.dot-red{background:var(--accent-red)}.dot-amber{background:var(--accent-amber)}.dot-muted{background:var(--text-muted)}[data-tooltip]{position:relative}[data-tooltip]:after{content:attr(data-tooltip);position:absolute;bottom:calc(100% + 6px);left:50%;transform:translate(-50%);background:var(--bg-hover);border:1px solid var(--border);color:var(--text-primary);padding:5px 10px;border-radius:var(--radius-sm);font-size:12px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s;z-index:100}[data-tooltip]:hover:after{opacity:1}.how-it-works{padding:100px 8%;background-color:#fcfcfc}.section-header{text-align:center;margin-bottom:80px}.section-header h2{font-size:2.5rem;color:#000;font-weight:700}.section-header p{color:#000}.section-header h2 span{color:var(--accent-cyan)}.steps-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:40px;position:relative}.step-card{background:#fff;padding:50px 30px 30px;border-radius:20px;border:1px solid #edf2f7;position:relative;transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.step-card:hover{transform:translateY(-10px);box-shadow:0 25px 50px #0000000d}.step-number{position:absolute;top:-20px;left:30px;width:40px;height:40px;background:var(--accent-cyan);color:#fff;display:flex;align-items:center;justify-content:center;border-radius:12px;font-weight:900;font-size:1.2rem;box-shadow:0 8px 20px #2563eb4d}.step-content h3{font-size:1.3rem;margin-bottom:15px;color:var(--bg-base);font-weight:600}.step-content p{color:#64748b;line-height:1.7;font-size:.95rem}@media(min-width:1024px){.steps-grid:before{content:"";position:absolute;top:50%;left:10%;right:10%;height:2px;background:linear-gradient(90deg,transparent,#2563eb,transparent);z-index:0;display:none}}@media(max-width:768px){.how-it-works{padding:60px 20px}.step-card{margin-top:20px}}
