:root{--bg:#0a0a0f;--surface:#111118;--surface2:#18181f;--border:#1e1e2a;--accent:#c8f04a;--accent-dim:rgba(200,240,74,.12);--text:#f0f0f5;--text-muted:#6b6b80;--text-dim:#3a3a4a;--red:#ff4d6d;--red-dim:rgba(255,77,109,.12);--green:#4dffb4;--green-dim:rgba(77,255,180,.1);--blue:#4d9fff;--blue-dim:rgba(77,159,255,.1);--sidebar-w:220px;--radius:12px}*{box-sizing:border-box;margin:0;padding:0}body,html{height:100%;background:var(--bg);color:var(--text);font-family:DM Sans,sans-serif;font-size:14px;-webkit-font-smoothing:antialiased}a{text-decoration:none;color:inherit}::-webkit-scrollbar{width:4px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}.app-shell{height:100vh}.app-shell,.main{display:flex;overflow:hidden}.main{flex:1 1}.main,.sidebar{flex-direction:column}.sidebar{width:var(--sidebar-w);background:var(--surface);border-right:1px solid var(--border);display:flex;padding:28px 0 20px;flex-shrink:0}.sidebar-logo{font-family:Syne,sans-serif;font-size:22px;font-weight:800;letter-spacing:-.5px;padding:0 24px 32px;color:var(--text)}.sidebar-logo span{color:var(--accent)}.nav-label{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-dim);padding:0 24px 10px}.nav-item{display:flex;align-items:center;gap:10px;padding:10px 24px;color:var(--text-muted);cursor:pointer;font-size:13px;font-weight:500;border-left:2px solid transparent;transition:all .15s;text-decoration:none}.nav-item:hover{color:var(--text);background:var(--surface2)}.nav-item.active{color:var(--accent);border-left-color:var(--accent);background:var(--accent-dim)}.nav-icon{width:16px;height:16px;opacity:.7;flex-shrink:0}.nav-item.active .nav-icon{opacity:1}.nav-divider{margin:12px 0 10px}.nav-divider,.sidebar-bottom{border-top:1px solid var(--border)}.sidebar-bottom{margin-top:auto;padding:20px 24px 0}.sidebar-client{font-size:12px;color:var(--text-muted);margin-bottom:12px}.sidebar-client strong{display:block;color:var(--text);font-size:13px;margin-bottom:2px}.logout-btn{background:none;border:1px solid var(--border);border-radius:7px;color:var(--text-muted);font-family:DM Sans,sans-serif;font-size:12px;padding:8px 12px;cursor:pointer;width:100%;text-align:left;transition:all .15s}.logout-btn:hover{border-color:var(--red);color:var(--red)}.topbar{height:60px;border-bottom:1px solid var(--border);display:flex;align-items:center;justify-content:space-between;padding:0 32px;flex-shrink:0;background:var(--surface)}.topbar-title{font-family:Syne,sans-serif;font-size:16px;font-weight:700;letter-spacing:-.3px}.topbar-period{background:var(--surface2);border:1px solid var(--border);border-radius:7px;padding:6px 14px;font-size:12px;color:var(--text-muted);display:flex;align-items:center;gap:6px}.period-dot{width:6px;height:6px;border-radius:50%;background:var(--accent)}.content{flex:1 1;overflow-y:auto;padding:32px}.kpi-grid{display:grid;grid-template-columns:repeat(4,1fr);grid-gap:16px;gap:16px;margin-bottom:28px}.kpi-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:22px 24px;transition:border-color .2s}.kpi-card:hover{border-color:#2a2a38}.kpi-label{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:10px}.kpi-value{font-family:Syne,sans-serif;font-size:28px;font-weight:700;letter-spacing:-.5px;color:var(--text);margin-bottom:10px;line-height:1}.kpi-change{display:inline-flex;align-items:center;gap:4px;font-size:12px;font-weight:500;padding:3px 8px;border-radius:20px}.kpi-change.up{background:var(--green-dim);color:var(--green)}.kpi-change.down{background:var(--red-dim);color:var(--red)}.chart-row{display:grid;grid-gap:16px;gap:16px;margin-bottom:28px}.chart-row-2{grid-template-columns:2fr 1fr}.chart-row-1{grid-template-columns:1fr}.chart-card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:24px}.card-title{font-family:Syne,sans-serif;font-size:14px;font-weight:700;letter-spacing:-.2px;margin-bottom:20px;color:var(--text)}.chart-wrap{position:relative}.data-table{width:100%;border-collapse:collapse}.data-table th{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);text-align:left;padding:10px 16px}.data-table td,.data-table th{border-bottom:1px solid var(--border)}.data-table td{padding:13px 16px;font-size:13px;color:var(--text)}.data-table tr:last-child td{border-bottom:none}.data-table tr:hover td,.rank-badge{background:var(--surface2)}.rank-badge{display:inline-flex;align-items:center;justify-content:center;width:22px;height:22px;border-radius:6px;font-size:11px;font-weight:600;color:var(--text-muted)}.rank-badge.top{background:var(--accent-dim);color:var(--accent)}.badge{display:inline-block;padding:3px 10px;border-radius:20px;font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.05em}.badge-paid{background:var(--green-dim);color:var(--green)}.badge-sent{background:var(--blue-dim);color:var(--blue)}.badge-overdue{background:var(--red-dim);color:var(--red)}.badge-active{background:var(--green-dim);color:var(--green)}.progress-bar{height:4px;background:var(--surface2);border-radius:4px;overflow:hidden;margin-top:6px}.progress-fill{height:100%;border-radius:4px;background:var(--accent)}.invoice-summary{display:grid;grid-template-columns:repeat(3,1fr);grid-gap:16px;gap:16px;margin-bottom:28px}.inv-sum-label{font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:8px}.inv-sum-value{font-family:Syne,sans-serif;font-size:26px;font-weight:700;letter-spacing:-.5px}.inv-sum-value.red{color:var(--red)}.inv-sum-value.green{color:var(--green)}.coming-soon{flex-direction:column;height:400px;gap:16px;text-align:center}.coming-soon,.coming-soon-icon{display:flex;align-items:center;justify-content:center}.coming-soon-icon{width:64px;height:64px;background:var(--accent-dim);border-radius:16px;font-size:28px}.coming-soon h2{font-family:Syne,sans-serif;font-size:22px;font-weight:700}.coming-soon p{color:var(--text-muted);max-width:360px;line-height:1.6}.legend{display:flex;gap:20px;flex-wrap:wrap;margin-bottom:16px}.legend-item{display:flex;align-items:center;gap:6px;font-size:12px;color:var(--text-muted)}.legend-dot{width:8px;height:8px;border-radius:2px}.admin-section{margin-bottom:32px}.admin-section-title{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.1em;color:var(--text-muted);margin-bottom:16px;padding-bottom:10px;border-bottom:1px solid var(--border)}.form-grid{display:grid;grid-template-columns:1fr 1fr;grid-gap:16px;gap:16px}.form-grid-3{grid-template-columns:1fr 1fr 1fr}.form-group{display:flex;flex-direction:column;gap:7px}.form-group.full{grid-column:1/-1}.form-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted)}.form-label .req{color:var(--red);margin-left:2px}.form-input{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:10px 14px;color:var(--text);font-family:DM Sans,sans-serif;font-size:13px;outline:none;transition:border-color .2s;width:100%}.form-input:focus{border-color:var(--accent)}.form-input::placeholder{color:var(--text-dim)}.form-input.error{border-color:var(--red)}textarea.form-input{resize:vertical}.form-hint{font-size:11px;color:var(--text-muted);margin-top:2px}.ptoggle{position:relative}.ptoggle .form-input{padding-right:40px}.peye{position:absolute;right:12px;top:50%;transform:translateY(-50%);cursor:pointer;color:var(--text-muted);-webkit-user-select:none;-moz-user-select:none;user-select:none;font-size:14px}.submit-row{display:flex;align-items:center;gap:14px;margin-top:8px}.btn-primary{background:var(--accent);color:#0a0a0f;border:none;border-radius:8px;padding:11px 28px;font-family:Syne,sans-serif;font-size:13px;font-weight:700;cursor:pointer;transition:opacity .2s}.btn-primary:hover{opacity:.85}.btn-primary:disabled{opacity:.5;cursor:not-allowed}.btn-secondary{background:none;color:var(--text-muted);border:1px solid var(--border);border-radius:8px;padding:11px 20px;font-family:DM Sans,sans-serif;font-size:13px;cursor:pointer;transition:all .2s}.btn-secondary:hover{border-color:var(--text-muted);color:var(--text)}.alert{border-radius:8px;padding:12px 16px;font-size:13px;margin-bottom:20px}.alert-success{background:var(--green-dim);border:1px solid var(--green);color:var(--green)}.alert-error{background:var(--red-dim);border:1px solid var(--red);color:var(--red)}.admin-badge{display:inline-flex;align-items:center;background:var(--accent-dim);color:var(--accent);border:1px solid rgba(200,240,74,.3);border-radius:20px;padding:3px 10px;font-size:11px;font-weight:600;margin-left:8px;vertical-align:middle}.login-screen{position:fixed;inset:0;display:flex;align-items:center;justify-content:center;background:var(--bg)}.login-bg{position:absolute;inset:0;overflow:hidden}.login-bg:before{top:-40%;left:-20%;width:80vw;height:80vw;background:radial-gradient(circle,rgba(200,240,74,.06) 0,transparent 65%)}.login-bg:after,.login-bg:before{content:"";position:absolute;border-radius:50%}.login-bg:after{bottom:-30%;right:-10%;width:60vw;height:60vw;background:radial-gradient(circle,rgba(77,159,255,.05) 0,transparent 65%)}.login-card{position:relative;z-index:2;width:400px;background:var(--surface);border:1px solid var(--border);border-radius:20px;padding:48px 40px 40px;animation:fadeUp .6s ease both}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.login-logo{font-family:Syne,sans-serif;font-size:28px;font-weight:800;letter-spacing:-1px;color:var(--text);margin-bottom:6px}.login-logo span{color:var(--accent)}.login-tagline{color:var(--text-muted);font-size:13px;margin-bottom:36px}.login-label{display:block;font-size:11px;font-weight:500;text-transform:uppercase;letter-spacing:.08em;color:var(--text-muted);margin-bottom:8px}.login-input{width:100%;background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:12px 14px;color:var(--text);font-family:DM Sans,sans-serif;font-size:14px;outline:none;transition:border-color .2s;margin-bottom:20px}.login-input:focus{border-color:var(--accent)}.login-btn{width:100%;background:var(--accent);color:#0a0a0f;border:none;border-radius:8px;padding:13px;font-family:Syne,sans-serif;font-size:14px;font-weight:700;cursor:pointer;transition:opacity .2s;margin-top:4px}.login-btn:hover{opacity:.88}.login-btn:disabled{opacity:.5;cursor:not-allowed}.login-forgot{display:block;text-align:center;margin-top:16px;color:var(--text-muted);font-size:13px;cursor:pointer;transition:color .2s;background:none;border:none;width:100%}.login-forgot:hover{color:var(--accent)}.login-error{background:var(--red-dim);border:1px solid var(--red);color:var(--red);border-radius:8px}.login-error,.login-info{padding:10px 14px;font-size:13px;margin-bottom:16px}.login-info{background:var(--blue-dim);border:1px solid var(--blue);color:var(--blue);border-radius:8px}.loading-screen{display:flex;align-items:center;justify-content:center;height:100vh;background:var(--bg)}.spinner{width:32px;height:32px;border:2px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .7s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}