:root{--bg:#0f1117;--surface:#1a1d2e;--surface2:#252840;--accent:#6c63ff;--green:#43e97b;--yellow:#f9ca24;--text:#e8eaf6;--text2:#9e9eb8;--border:#2e3250;--red:#ff6b6b}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg);color:var(--text);min-height:100vh;font-family:Segoe UI,sans-serif}nav{background:var(--surface);border-bottom:1px solid var(--border);z-index:100;align-items:center;gap:4px;height:56px;padding:0 24px;display:flex;position:sticky;top:0}.logo{color:var(--accent);margin-right:16px;font-size:16px;font-weight:700}nav button{color:var(--text2);cursor:pointer;background:0 0;border:none;border-radius:8px;padding:8px 16px;font-size:14px;transition:all .2s}nav button.active,nav button:hover{background:var(--surface2);color:var(--text)}nav button.active{color:var(--accent)}.nav-refresh{margin-left:auto;font-size:18px;color:var(--text2)!important;padding:4px 10px!important}.nav-refresh:hover{color:var(--accent)!important}.nav-refresh:disabled{opacity:.4;cursor:not-allowed}.nav-logout{font-size:13px;color:var(--text2)!important}.nav-logout:hover{color:var(--red)!important}.login-screen{background:var(--bg);justify-content:center;align-items:center;min-height:100vh;display:flex}.login-box{background:var(--surface);border:1px solid var(--border);border-radius:16px;flex-direction:column;gap:16px;width:100%;max-width:380px;padding:40px 36px;display:flex}.login-logo{color:var(--accent);text-align:center;font-size:22px;font-weight:700}.login-sub{color:var(--text2);text-align:center;margin-top:-8px;font-size:13px}.login-error{border:1px solid var(--red);color:var(--red);text-align:center;background:#ff6b6b1f;border-radius:8px;padding:10px 14px;font-size:13px}.page{max-width:1100px;margin:0 auto;padding:24px}.loading-screen{height:100vh;color:var(--text2);flex-direction:column;justify-content:center;align-items:center;gap:16px;display:flex}.spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:36px;height:36px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.cards{grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;margin-bottom:24px;display:grid}.card{background:var(--surface);border:1px solid var(--border);border-radius:12px;padding:20px}.card .lbl{color:var(--text2);margin-bottom:6px;font-size:12px}.card .val{color:var(--accent);font-size:26px;font-weight:700}.card .sub{color:var(--text2);margin-top:4px;font-size:12px}.alert-banner{border:1px solid var(--red);background:linear-gradient(135deg,#3d1a1a,#2a1a3d);border-radius:12px;margin-bottom:24px;padding:16px 20px}.alert-banner h3{color:var(--red);margin-bottom:12px;font-size:14px}.alert-item{background:#ff6b6b14;border-radius:8px;justify-content:space-between;align-items:center;margin-bottom:6px;padding:8px 12px;font-size:13px;display:flex}.alert-actions{gap:8px;display:flex}.table-wrap{background:var(--surface);border:1px solid var(--border);border-radius:12px;margin-bottom:20px;overflow:hidden}table{border-collapse:collapse;width:100%;font-size:13px}th{background:var(--surface2);color:var(--text2);text-align:left;padding:10px 14px;font-size:12px;font-weight:600}td{border-top:1px solid var(--border);color:var(--text);padding:10px 14px}tr:hover td{background:#6c63ff0d}.badge{border-radius:20px;padding:2px 8px;font-size:11px;font-weight:600;display:inline-block}.badge-green{color:var(--green);background:#43e97b26}.badge-red{color:var(--red);background:#ff6b6b26}.btn{cursor:pointer;border:none;border-radius:8px;padding:8px 18px;font-size:13px;font-weight:600;transition:all .2s}.btn-accent{background:var(--accent);color:#fff}.btn-accent:hover{opacity:.85}.btn-ghost{color:var(--text2);border:1px solid var(--border);background:0 0}.btn-ghost:hover{background:var(--surface2);color:var(--text)}.btn-danger{color:var(--red);border:1px solid var(--red);cursor:pointer;background:0 0;border-radius:6px;padding:4px 10px;font-size:12px}.btn-danger:hover{background:#ff6b6b1a}.btn-sm{cursor:pointer;border:none;border-radius:6px;padding:4px 12px;font-size:12px;font-weight:600}.btn-primary{background:var(--accent);color:#fff}.btn-edit{background:var(--surface2);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:6px;padding:4px 10px;font-size:12px}.btn-edit:hover{border-color:var(--accent);color:var(--accent)}.section-title{margin-bottom:16px;font-size:16px;font-weight:700}.form-row{flex-wrap:wrap;align-items:flex-end;gap:12px;margin-bottom:16px;display:flex}.form-group{flex-direction:column;flex:1;gap:6px;min-width:150px;display:flex}.form-group label{color:var(--text2);font-size:12px}.form-group input,.form-group select{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;outline:none;padding:8px 12px;font-size:13px}.form-group input:focus,.form-group select:focus{border-color:var(--accent)}select option{background:var(--surface2)}.tabs{background:var(--surface);border:1px solid var(--border);border-radius:10px;gap:4px;width:fit-content;margin-bottom:20px;padding:4px;display:flex}.tab{color:var(--text2);cursor:pointer;background:0 0;border:none;border-radius:7px;padding:7px 18px;font-size:13px;font-weight:600;transition:all .2s}.tab.active{background:var(--accent);color:#fff}.modal-bg{z-index:200;background:#000000b3;justify-content:center;align-items:center;display:flex;position:fixed;inset:0}.modal{background:var(--surface);border:1px solid var(--border);border-radius:16px;width:420px;max-width:95vw;padding:28px}.modal h3{margin-bottom:20px;font-size:16px}.modal .form-group{margin-bottom:14px}.modal-actions{justify-content:flex-end;gap:10px;margin-top:20px;display:flex}.report-header{flex-wrap:wrap;align-items:center;gap:12px;margin-bottom:20px;display:flex}.sales-block{margin-bottom:20px}.sales-hd{background:var(--surface2);border-radius:10px 10px 0 0;justify-content:space-between;padding:12px 16px;display:flex}.sales-hd .sname{color:var(--accent);font-weight:700}.sales-hd .stotal{color:var(--green);font-weight:700}.sales-block .table-wrap{border-radius:0 0 12px 12px;margin:0}.empty{color:var(--text2);text-align:center;padding:32px;font-size:13px}.filter-row{align-items:center;gap:8px;display:flex}.filter-row select{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;outline:none;padding:6px 10px;font-size:12px}