:root{--bg:#000;--bg-elev:#111827;--bg-elev-2:#1f2937;--bg-input:#1f2937;--bg-input-focus:#1e293b;--border:#374151;--border-strong:#4b5563;--text:#fff;--text-muted:#9ca3af;--text-faint:#6b7280;--primary:#3b82f6;--primary-hover:#2563eb;--primary-soft:#3b82f626;--brand:#115e59;--brand-hover:#0f766e;--success:#22c55e;--warning:#f59e0b;--danger:#ef4444;--info:#60a5fa;--violet:#8b5cf6;--violet-soft:#a78bfa;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:var(--text);background:var(--bg);font-family:ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}*{box-sizing:border-box}html,body,#root{background:var(--bg);height:100%;margin:0}body{-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5}a{color:var(--info);text-decoration:none}a:hover{text-decoration:underline}h1{letter-spacing:-.2px;margin:0;font-size:24px;font-weight:800}h2{color:var(--text);margin:0 0 14px;font-size:16px;font-weight:700}.muted{color:var(--text-muted)}.muted.small,.small{font-size:12px}.center{text-align:center}.mono{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:12px}.ellipsis{text-overflow:ellipsis;white-space:nowrap;max-width:360px;overflow:hidden}.app-shell{grid-template-columns:240px 1fr;min-height:100vh;display:grid}.sidebar{background:var(--bg-elev);border-right:1px solid var(--border);flex-direction:column;gap:18px;height:100vh;padding:20px 14px;display:flex;position:sticky;top:0}.sidebar .brand{padding:0 6px}.brand{align-items:center;gap:10px;display:flex}.brand-mark{background:var(--brand);color:#fff;letter-spacing:.5px;border-radius:10px;place-items:center;width:40px;height:40px;font-size:14px;font-weight:800;display:grid}.brand-title{color:var(--text);font-size:16px;font-weight:700}.brand-sub{color:var(--text-muted);letter-spacing:1px;text-transform:uppercase;font-size:11px;font-weight:600}.nav{flex-direction:column;flex:1;gap:4px;display:flex}.nav a{color:var(--text-muted);border-radius:12px;align-items:center;gap:10px;padding:11px 12px;font-size:13px;font-weight:600;transition:background .15s,color .15s;display:flex}.nav a:hover{background:var(--bg-elev-2);color:var(--text);text-decoration:none}.nav a.active{background:var(--primary-soft);color:var(--text);border:1px solid #3b82f659;padding:10px 11px}.nav-icon{text-align:center;width:18px;font-size:16px}.sidebar-footer{border-top:1px solid var(--border);flex-direction:column;gap:12px;padding-top:14px;display:flex}.user-chip{align-items:center;gap:10px;display:flex}.user-avatar{background:var(--brand);color:#fff;border-radius:50%;place-items:center;width:36px;height:36px;font-size:14px;font-weight:700;display:grid}.user-avatar.large{width:64px;height:64px;font-size:24px}.user-meta{min-width:0}.user-email{text-overflow:ellipsis;white-space:nowrap;max-width:160px;color:var(--text);font-size:12px;font-weight:500;overflow:hidden}.main{width:100%;max-width:1200px;padding:28px 32px 60px}.page{flex-direction:column;gap:18px;display:flex}.page-header{justify-content:space-between;align-items:flex-end;gap:12px;display:flex}.page-loading{background:var(--bg);place-items:center;min-height:100vh;display:grid}.spinner{border:3px solid var(--border);border-top-color:var(--primary);border-radius:50%;width:28px;height:28px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}.auth-shell{background:radial-gradient(circle at 20% 20%, #115e5959 0%, transparent 45%), radial-gradient(circle at 80% 80%, #3b82f62e 0%, transparent 45%), var(--bg);place-items:center;min-height:100vh;padding:20px;display:grid}.auth-card{background:var(--bg-elev);border:1px solid var(--border);border-radius:18px;width:100%;max-width:420px;padding:28px;box-shadow:0 20px 60px #00000080}.auth-card .brand{margin-bottom:22px}.form{flex-direction:column;gap:14px;display:flex}.field{flex-direction:column;gap:6px;display:flex}.field span{color:var(--text-muted);letter-spacing:.2px;font-size:12px;font-weight:600}.field-inline{flex-direction:column;gap:4px;display:flex}input[type=text],input[type=email],input[type=date],.input,select.input{background:var(--bg-input);border:1px solid var(--border);color:var(--text);border-radius:12px;outline:none;padding:11px 14px;font-size:13px;transition:border-color .15s,background .15s,box-shadow .15s}input:focus,.input:focus{border-color:var(--primary);background:var(--bg-input-focus);box-shadow:0 0 0 3px var(--primary-soft)}input:disabled{opacity:.6}select.input{appearance:none;background-image:url("data:image/svg+xml;charset=utf-8,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' viewBox='0 0 10 6'%3E%3Cpath fill='%239ca3af' d='M0 0l5 6 5-6z'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;padding-right:30px}.btn-primary{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:12px;padding:12px 18px;font-size:14px;font-weight:700;transition:background .15s,transform 50ms,box-shadow .15s;box-shadow:0 4px 14px #3b82f640}.btn-primary:hover:not(:disabled){background:var(--primary-hover);box-shadow:0 6px 18px #3b82f659}.btn-primary:active:not(:disabled){transform:translateY(1px)}.btn-primary:disabled{opacity:.55;cursor:not-allowed;box-shadow:none}.btn-ghost{background:var(--bg-elev-2);color:var(--text);border:1px solid var(--border);cursor:pointer;border-radius:12px;padding:10px 14px;font-size:13px;font-weight:600;transition:background .15s,color .15s,border-color .15s}.btn-ghost:hover:not(:disabled){background:var(--border);border-color:var(--border-strong)}.btn-ghost:disabled{opacity:.4;cursor:not-allowed}.btn-link{color:var(--info);cursor:pointer;text-align:left;background:0 0;border:none;padding:4px 0;font-size:13px;font-weight:600}.btn-link:hover{text-decoration:underline}.alert{border:1px solid #0000;border-radius:12px;padding:12px 14px;font-size:13px;font-weight:500}.alert.error{color:#fca5a5;background:#ef44441f;border-color:#ef444459}.alert.info{color:#93c5fd;background:#3b82f61f;border-color:#3b82f659}.metric-grid{grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:14px;display:grid}.metric-grid.compact .metric-card{padding:16px}.metric-card{background:var(--bg-elev);border:1px solid var(--border);border-radius:16px;padding:20px;transition:border-color .15s,transform .15s;position:relative;overflow:hidden}.metric-card:hover{border-color:var(--border-strong)}.metric-card:before{content:"";background:var(--primary);height:4px;position:absolute;top:0;left:0;right:0}.metric-card.accent-indigo:before,.metric-card.accent-blue:before{background:var(--primary)}.metric-card.accent-green:before{background:var(--success)}.metric-card.accent-amber:before{background:var(--warning)}.metric-card.accent-violet:before{background:var(--violet)}.metric-card.accent-red:before{background:var(--danger)}.metric-card.accent-gray:before{background:var(--text-faint)}.metric-title{text-transform:uppercase;letter-spacing:.6px;color:var(--text-muted);font-size:11px;font-weight:700}.metric-value{letter-spacing:-.5px;color:var(--text);margin-top:6px;font-size:30px;font-weight:800}.metric-hint{color:var(--text-muted);margin-top:6px;font-size:12px}.grid-2{grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:14px;display:grid}.card{background:var(--bg-elev);border:1px solid var(--border);border-radius:16px;padding:20px}.card.no-pad{padding:0;overflow:hidden}.breakdown{flex-direction:column;gap:14px;margin:0;padding:0;list-style:none;display:flex}.breakdown-row{justify-content:space-between;align-items:baseline;margin-bottom:6px;display:flex}.breakdown-label{text-transform:capitalize;font-size:13px;font-weight:500}.breakdown-value{font-size:13px;font-weight:600}.bar{background:var(--bg-elev-2);border-radius:4px;height:8px;overflow:hidden}.bar-fill{background:linear-gradient(90deg, var(--primary), var(--violet));border-radius:4px;height:100%}.filters{background:var(--bg-elev);border:1px solid var(--border);border-radius:16px;flex-wrap:wrap;align-items:center;gap:10px;padding:14px;display:flex}.filters .input{min-width:160px}.checkbox{color:var(--text-muted);align-items:center;gap:8px;font-size:13px;font-weight:500;display:flex}.checkbox input[type=checkbox]{accent-color:var(--primary);width:16px;height:16px}.table{border-collapse:collapse;width:100%;font-size:13px}.table thead th{background:var(--bg-elev-2);text-align:left;letter-spacing:.6px;text-transform:uppercase;color:var(--text-muted);border-bottom:1px solid var(--border);padding:12px 16px;font-size:11px;font-weight:700}.table tbody td{border-bottom:1px solid var(--border);vertical-align:top;padding:14px 16px}.table tbody tr:last-child td{border-bottom:none}.table tbody tr:hover{background:#ffffff06}.cell-primary{color:var(--text);font-weight:600}.cell-secondary{margin-top:2px}.badge{background:var(--bg-elev-2);border:1px solid var(--border);color:var(--text-muted);text-transform:capitalize;letter-spacing:.3px;border-radius:999px;padding:3px 10px;font-size:11px;font-weight:600;display:inline-block}.badge.danger{color:#fca5a5;background:#ef444426;border-color:#ef444466}.badge.role-owner,.badge.role-boss{color:#c4b5fd;background:#8b5cf626;border-color:#8b5cf666}.badge.role-senior{color:#93c5fd;background:#3b82f626;border-color:#3b82f666}.badge.role-worker,.badge.role-user{color:#86efac;background:#22c55e26;border-color:#22c55e66}.badge.role-junior{color:#fcd34d;background:#f59e0b26;border-color:#f59e0b66}.badge.status-completed,.badge.status-submitted{color:#86efac;background:#22c55e26;border-color:#22c55e66}.badge.status-cancelled{color:#fca5a5;background:#ef444426;border-color:#ef444466}.badge.status-started,.badge.status-accepted{color:#93c5fd;background:#3b82f626;border-color:#3b82f666}.badge.status-assigned{color:#fcd34d;background:#f59e0b26;border-color:#f59e0b66}.badges{flex-wrap:wrap;gap:6px;margin-top:8px;display:flex}.pager{justify-content:space-between;align-items:center;gap:12px;display:flex}.pager-controls{align-items:center;gap:8px;display:flex}.user-header{background:var(--bg-elev);border:1px solid var(--border);border-radius:18px;grid-template-columns:auto 1fr auto;align-items:center;gap:20px;padding:24px;display:grid}.user-header h1{margin-bottom:6px}.role-changer{flex-direction:column;gap:6px;min-width:180px;display:flex}.tabs{border-bottom:1px solid var(--border);gap:4px;margin-bottom:4px;display:flex}.tab{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-bottom:2px solid #0000;margin-bottom:-1px;padding:12px 16px;font-size:13px;font-weight:600;transition:color .15s,border-color .15s}.tab:hover{color:var(--text)}.tab.active{color:var(--text);border-bottom-color:var(--primary);font-weight:700}.tab-panel{flex-direction:column;gap:14px;display:flex}.kv{grid-template-columns:160px 1fr;gap:10px 16px;margin:0;display:grid}.kv dt{color:var(--text-muted);text-transform:uppercase;letter-spacing:.3px;padding-top:2px;font-size:12px;font-weight:600}.kv dd{margin:0;font-weight:500}.otp-input{grid-template-columns:repeat(8,1fr);gap:8px;display:grid}.otp-cell{aspect-ratio:1/1.15;text-align:center;width:100%;color:var(--text);background:var(--bg-input);border:1px solid var(--border);caret-color:var(--primary);border-radius:12px;outline:none;padding:0;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:20px;font-weight:700;transition:border-color .15s,background .15s,box-shadow .15s}.otp-cell:focus{border-color:var(--primary);background:var(--bg-input-focus);box-shadow:0 0 0 3px var(--primary-soft)}.otp-cell:disabled{opacity:.6;cursor:not-allowed}@media (width<=460px){.otp-input{gap:6px}.otp-cell{font-size:17px}}