:root{--bg:#0d1117;--surface:#161d27;--surface-2:#1c2531;--border:#262f3d;--text:#edf3f8;--text-muted:#8fa0b0;--accent:#22d3ee;--accent-text:#67e8f9;--danger:#fb7185;--success:#4ade80;--font-display:"Quicksand", -apple-system, "Segoe UI", sans-serif;--font-body:"Nunito Sans", -apple-system, "Segoe UI", sans-serif;--border-soft:#ffffff12;--ink-2:var(--surface-2);--surface-solid:var(--surface);--text-faint:#5b6b7a;--accent-dim:#22d3ee24;--font-mono:"SFMono-Regular", Consolas, Menlo, monospace;--radius-sm:10px;--radius-md:14px;--radius-pill:999px;--chart-keyboard:var(--accent);--chart-mouse:#c084fc;--shadow-card:0 10px 30px #00000059;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}*{box-sizing:border-box}body{background:radial-gradient(1100px 500px at 15% -10%, #22d3ee17, transparent), radial-gradient(900px 500px at 100% 0%, #c084fc0f, transparent), var(--bg);color:var(--text);font-family:var(--font-body);background-attachment:fixed;margin:0}h1,h2,h3{font-family:var(--font-display);font-weight:700}button{font:inherit;font-family:var(--font-display);cursor:pointer;font-weight:600;transition:background .15s,border-color .15s,opacity .15s,transform .12s,box-shadow .15s}button:active{transform:scale(.96)}button:disabled{cursor:default;opacity:.6;transform:none}input{font:inherit;font-family:var(--font-body)}.error-text{color:var(--danger);margin:4px 0 0;font-size:13px}.hint-text{color:var(--text-muted);font-size:13px}.login-page{justify-content:center;align-items:center;min-height:100vh;padding:20px;display:flex}.login-card{background:var(--surface);border:1px solid var(--border);border-radius:22px;flex-direction:column;gap:16px;width:100%;max-width:360px;padding:32px 30px;display:flex;box-shadow:0 24px 60px -24px #0009,0 0 0 1px #22d3ee0a}.login-mark{background:linear-gradient(135deg, var(--accent), #7dd3fc);color:#001318;width:46px;height:46px;font-family:var(--font-display);border-radius:16px;justify-content:center;align-items:center;margin-bottom:2px;font-size:20px;font-weight:700;display:flex;box-shadow:0 10px 24px -10px #22d3ee99}.login-card h1{margin:0 0 2px;font-size:19px}.login-card p.hint-text{margin:-8px 0 4px}.login-card label{color:var(--text-muted);flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.login-card input{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:12px;padding:10px 12px}.login-card button{background:linear-gradient(135deg, var(--accent), #7dd3fc);color:#001318;border:none;border-radius:12px;margin-top:6px;padding:11px;font-weight:700}.login-card button:not(:disabled):hover{filter:brightness(1.08);box-shadow:0 10px 22px -10px #22d3ee8c}.login-card button.secondary{background:var(--surface);color:var(--text);border:1px solid var(--border)}.login-card button.secondary:not(:disabled):hover{box-shadow:none;border-color:var(--accent)}.login-divider{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;align-items:center;gap:10px;margin:4px 0;font-size:12px;display:flex}.login-divider:before,.login-divider:after{content:"";background:var(--border);flex:1;height:1px}.admin-shell{min-height:100vh;padding-bottom:40px}.admin-header{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:16px 24px;display:flex}.admin-header-left{align-items:center;gap:10px;display:flex}.admin-mark{background:linear-gradient(135deg, var(--accent), #7dd3fc);color:#001318;width:30px;height:30px;font-family:var(--font-display);border-radius:10px;justify-content:center;align-items:center;font-size:14px;font-weight:700;display:flex}.admin-header h1{margin:0;font-size:16px}.admin-header-right{color:var(--text-muted);align-items:center;gap:14px;font-size:13px;font-weight:600;display:flex}.admin-header-right button{border:1px solid var(--border);color:var(--text);background:0 0;border-radius:999px;padding:7px 14px}.admin-header-right button:hover{border-color:var(--danger);color:var(--danger)}.admin-tabs{gap:4px;padding:16px 24px 0;display:flex}.admin-tabs button{color:var(--text-muted);background:0 0;border:none;border-bottom:2px solid #0000;border-radius:999px 999px 0 0;padding:9px 18px}.admin-tabs button:hover{color:var(--text);background:#ffffff08}.admin-tabs button.is-active{color:var(--accent-text);border-bottom-color:var(--accent);background:#22d3ee0f}.admin-main{max-width:860px;margin:24px auto 0;padding:0 24px}.users-toolbar{flex-wrap:wrap;align-items:center;gap:10px;margin-bottom:16px;display:flex}.users-toolbar button{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:999px;padding:9px 16px}.users-toolbar button:hover{border-color:var(--accent);color:var(--accent-text);box-shadow:0 6px 16px -8px #22d3ee66}.users-search{border:1px solid var(--border);background:var(--surface);min-width:160px;color:var(--text);border-radius:999px;flex:220px;padding:9px 14px}.users-role-filter{border:1px solid var(--border);background:var(--surface);color:var(--text);border-radius:999px;padding:9px 14px}.users-table{border-collapse:separate;border-spacing:0;background:var(--surface);border:1px solid var(--border);border-radius:16px;width:100%;font-size:13.5px;overflow:hidden}.users-table th{text-align:left;color:var(--text-muted);font-family:var(--font-display);text-transform:uppercase;letter-spacing:.05em;border-bottom:1px solid var(--border);background:var(--surface-2);padding:12px 14px;font-size:11px;font-weight:600}.users-table td{border-bottom:1px solid var(--border);padding:12px 14px}.users-table tbody tr:last-child td{border-bottom:none}.users-table tbody tr{transition:background .15s}.users-table tbody tr:hover{background:#ffffff06}.users-table tbody tr.is-self{background:#22d3ee0b}.user-name-cell{align-items:center;gap:10px;display:flex}.user-avatar{width:30px;height:30px;font-family:var(--font-display);color:#0b0f14;border-radius:50%;flex:none;justify-content:center;align-items:center;font-size:12.5px;font-weight:700;display:flex}.self-badge{background:var(--accent);color:#001318;font-family:var(--font-display);text-transform:uppercase;letter-spacing:.03em;border-radius:999px;padding:1px 8px;font-size:10px;font-weight:700;display:inline-block}.role-pill{font-family:var(--font-display);text-transform:capitalize;border:1px solid var(--border);color:var(--text-muted);border-radius:999px;padding:3px 10px;font-size:11px;font-weight:700;display:inline-block}.role-pill.role-admin{color:var(--accent-text);background:#22d3ee1a;border-color:#22d3ee59}.role-pill.role-manager{color:#c084fc;background:#c084fc1a;border-color:#c084fc59}.users-actions{justify-content:flex-end;gap:8px;display:flex}.users-actions button{border:1px solid var(--border);background:var(--surface-2);color:var(--text);border-radius:999px;padding:6px 12px;font-size:12px}.users-actions button:hover{border-color:var(--accent);color:var(--accent-text)}.users-actions button.danger{color:var(--danger);border-color:#fb718559}.users-actions button.danger:hover{border-color:var(--danger);color:var(--danger);background:#fb71851f}.modal-backdrop{-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);z-index:50;background:#04070ba6;justify-content:center;align-items:center;padding:20px;animation:.15s both fadeIn;display:flex;position:fixed;inset:0}.modal-card{background:var(--surface);border:1px solid var(--border);border-radius:20px;width:100%;max-width:380px;padding:22px;animation:.18s cubic-bezier(.2,.8,.3,1.1) both modalIn;box-shadow:0 30px 70px -28px #000000a6}.modal-header{justify-content:space-between;align-items:center;margin-bottom:14px;display:flex}.modal-header h3{margin:0;font-size:16px}.modal-close{color:var(--text-muted);background:0 0;border:none;border-radius:999px;padding:4px 9px;font-size:20px;line-height:1}.modal-close:hover{color:var(--text);background:#ffffff12}.modal-body p{color:var(--text-muted);margin:0 0 4px;font-size:13.5px;line-height:1.55}.modal-form{flex-direction:column;gap:13px;display:flex}.modal-form label{color:var(--text-muted);flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.modal-form input,.modal-form select{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:12px;padding:10px 12px}.modal-form input:focus,.modal-form select:focus,.login-card input:focus,.settings-form input:focus{border-color:var(--accent);outline:none;box-shadow:0 0 0 3px #22d3ee29}.modal-actions{justify-content:flex-end;gap:8px;margin-top:6px;display:flex}.modal-actions button{background:linear-gradient(135deg, var(--accent), #7dd3fc);color:#001318;border:none;border-radius:999px;padding:9px 16px;font-size:13px;font-weight:700}.modal-actions button:not(:disabled):not(.ghost):not(.danger):hover{filter:brightness(1.08)}.modal-actions button.ghost{border:1px solid var(--border);color:var(--text);background:0 0;font-weight:600}.modal-actions button.ghost:hover{border-color:var(--text-muted)}.modal-actions button.danger{background:var(--danger);color:#2a0a0a}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes modalIn{0%{opacity:0;transform:translateY(10px)scale(.96)}to{opacity:1;transform:translateY(0)scale(1)}}.toast{font-family:var(--font-display);background:var(--surface);border:1px solid var(--border);color:var(--text);z-index:60;border-radius:999px;padding:12px 20px;font-size:13px;font-weight:600;animation:.22s cubic-bezier(.2,.8,.3,1.1) both toastIn;position:fixed;bottom:28px;left:50%;transform:translate(-50%);box-shadow:0 12px 30px -10px #0000008c}.toast-success{color:var(--success);border-color:#4ade8066}.toast-error{color:var(--danger);border-color:#fb718566}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%)}}.settings-page{flex-wrap:wrap;align-items:flex-start;gap:18px;display:flex}.settings-form{background:var(--surface);border:1px solid var(--border);border-radius:18px;flex-direction:column;flex:380px;gap:15px;max-width:380px;padding:22px;display:flex}.settings-form h2{margin:0;font-size:16px}.settings-form label{color:var(--text-muted);flex-direction:column;gap:6px;font-size:13px;font-weight:600;display:flex}.settings-form input{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:12px;padding:9px 12px}.settings-form button{background:linear-gradient(135deg, var(--accent), #7dd3fc);color:#001318;border:none;border-radius:999px;align-self:flex-start;padding:9px 18px;font-weight:700}.settings-form button:not(:disabled):hover{filter:brightness(1.08)}.settings-form .settings-actions{flex-wrap:wrap;gap:10px;display:flex}.settings-form button.secondary{color:var(--text);border:1px solid var(--border);background:0 0}.settings-form label.settings-check{flex-direction:row;align-items:center;gap:8px;font-weight:500}.settings-form label.settings-check input{padding:0}.back-link{color:var(--text-muted);background:0 0;border:none;margin-bottom:16px;padding:0;font-size:13px}.back-link:hover{color:var(--accent-text)}.history-header{align-items:center;gap:14px;margin-bottom:20px;display:flex}.user-avatar-lg{color:#001318;width:48px;height:48px;font-size:17px}.history-header h2{margin:0;font-size:18px}.history-header p{margin:2px 0 0}.stat-row{flex-wrap:wrap;gap:10px;margin-bottom:20px;display:flex}.stat-tile{background:var(--surface);border:1px solid var(--border);border-radius:16px;flex-direction:column;flex:130px;gap:2px;padding:14px 16px;display:flex}.stat-value{font-family:var(--font-display);font-variant-numeric:tabular-nums;font-size:19px;font-weight:700}.stat-label{color:var(--text-muted);text-transform:uppercase;letter-spacing:.04em;font-size:11px}.history-columns{grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px;display:grid}@media (width<=640px){.history-columns{grid-template-columns:1fr}}.history-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:18px}.history-card h3{margin:0 0 12px;font-size:14px}.rank-list,.shift-list{flex-direction:column;gap:9px;margin:0;padding:0;list-style:none;display:flex}.rank-list li{justify-content:space-between;gap:10px;font-size:13px;display:flex}.rank-list li span:first-child{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.rank-value{font-family:var(--font-display);color:var(--accent-text);white-space:nowrap;font-weight:700}.shift-list li{border-bottom:1px solid var(--border);grid-template-columns:70px 1fr auto;align-items:center;gap:10px;padding-bottom:9px;font-size:13px;display:grid}.shift-list li:last-child{border-bottom:none;padding-bottom:0}.history-footnote{margin-top:16px}.history-subtabs{margin-bottom:16px}.history-range-filter{background:var(--surface);border:1px solid var(--border);border-radius:14px;flex-wrap:wrap;align-items:center;gap:14px;margin-bottom:16px;padding:12px 16px;display:flex}.history-range-filter label{color:var(--text-muted);align-items:center;gap:8px;font-size:12.5px;display:flex}.history-range-filter input[type=date]{border:1px solid var(--border);background:var(--bg);color:var(--text);border-radius:999px;padding:6px 10px;font-size:12.5px}.history-range-hint{margin-left:auto}.history-search{border:1px solid var(--border);background:var(--surface);width:100%;color:var(--text);border-radius:999px;margin-bottom:12px;padding:8px 14px;display:block}.dash-tab-panel{animation:.22s cubic-bezier(.22,1,.36,1) both tabPanelIn}@keyframes tabPanelIn{0%{opacity:0;transform:translateY(6px)}to{opacity:1;transform:translateY(0)}}.dash-empty{color:var(--text-faint);text-align:center;padding:18px 0 6px;font-size:13px}.dash-day-group{border:1px solid var(--border-soft);border-radius:var(--radius-md);transition:border-color .15s;overflow:hidden}.dash-day-group.is-open{border-color:var(--border)}.dash-day-group+.dash-day-group{margin-top:10px}.dash-day-heading{font-family:var(--font-display);color:var(--text);margin-bottom:10px;font-size:13.5px;font-weight:600}button.dash-day-heading.is-toggle{background:var(--ink-2);width:100%;font:inherit;text-align:left;cursor:pointer;border:none;align-items:center;gap:11px;margin-bottom:0;padding:12px 14px;transition:background .15s;display:flex}button.dash-day-heading.is-toggle:hover{background:var(--surface-solid)}.dash-day-chevron-wrap{background:var(--accent-dim);border-radius:50%;flex:none;justify-content:center;align-items:center;width:22px;height:22px;display:flex}.dash-day-chevron{color:var(--accent-text);transition:transform .15s}.dash-day-chevron.is-open{transform:rotate(90deg)}.dash-day-group .dash-log-list{background:var(--ink-2);padding:10px}.dash-day-count{font-family:var(--font-mono);border-radius:var(--radius-pill);background:var(--accent-dim);color:var(--accent-text);letter-spacing:.02em;margin-left:auto;padding:3px 10px;font-size:10.5px;font-weight:700}.activity-chart{border-bottom:1px solid var(--border-soft);margin-bottom:18px;padding-bottom:16px}.activity-chart-heading{justify-content:space-between;align-items:flex-start;gap:12px;margin-bottom:12px;display:flex}.time-range-picker{flex:none;position:relative}.time-range-picker-trigger{border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--ink-2);color:var(--text);font-family:var(--font-mono);cursor:pointer;align-items:center;gap:6px;padding:6px 11px;font-size:11px;transition:border-color .15s,color .15s;display:flex}.time-range-picker-trigger:hover{border-color:var(--accent);color:var(--accent-text)}.time-range-picker-menu{z-index:10;background:var(--surface-solid);border:1px solid var(--border);border-radius:var(--radius-sm);min-width:150px;box-shadow:var(--shadow-card);flex-direction:column;padding:4px;display:flex;position:absolute;top:calc(100% + 6px);right:0}.time-range-picker-option{text-align:left;font-family:var(--font-mono);color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:5px;padding:7px 10px;font-size:11.5px}.time-range-picker-option:hover{background:var(--ink-2);color:var(--text)}.time-range-picker-option.is-active{background:var(--accent-dim);color:var(--accent-text)}.activity-chart-title{font-family:var(--font-display);letter-spacing:-.01em;color:var(--text);margin:0;font-size:14px;font-weight:600}.activity-chart-subtitle{color:var(--text-muted);margin:3px 0 0;font-size:11.5px}.activity-chart-legend{color:var(--text-muted);flex-wrap:wrap;gap:14px;margin-bottom:12px;font-size:11px;display:flex}.activity-chart-legend-item{align-items:center;gap:6px;display:flex}.activity-chart-legend-item.is-muted{color:var(--text-faint);font-style:normal}button.activity-chart-legend-item.is-toggle{font:inherit;color:var(--text-muted);cursor:pointer;opacity:1;background:0 0;border:none;margin:0;padding:0;transition:opacity .12s}button.activity-chart-legend-item.is-toggle:hover{opacity:.7}button.activity-chart-legend-item.is-toggle.is-off{opacity:.35;text-decoration:line-through}.activity-chart-swatch{border-radius:2px;flex:none;width:8px;height:8px;display:inline-block}.activity-chart-swatch.kb{background:var(--chart-keyboard)}.activity-chart-swatch.ms{background:var(--chart-mouse)}.activity-chart-body{gap:6px;display:flex}.activity-chart-yaxis{flex:none;justify-content:center;align-items:center;width:14px;display:flex}.activity-chart-yaxis span{writing-mode:vertical-rl;font-family:var(--font-mono);letter-spacing:.04em;text-transform:uppercase;color:var(--text-faint);white-space:nowrap;font-size:9.5px;transform:rotate(180deg)}.activity-chart-track{flex:1;height:150px;position:relative}.activity-chart-svg{cursor:crosshair;width:100%;height:100%;display:block}.activity-chart-area{stroke:none}.activity-chart-area.kb{fill:url(#kb-area-gradient)}.activity-chart-area.ms{fill:url(#ms-area-gradient)}.activity-chart-line{fill:none;stroke-width:1.5px;stroke-linejoin:round;stroke-linecap:round}.activity-chart-line.kb{stroke:var(--chart-keyboard)}.activity-chart-line.ms{stroke:var(--chart-mouse)}.activity-chart-crosshair{stroke:var(--border);stroke-width:1px;stroke-dasharray:3 3}.activity-chart-status-dot{border:1px solid var(--text-faint);background:0 0;border-radius:50%;flex:none;width:6px;height:6px}.activity-chart-status-dot.is-active{background:var(--success);border-color:var(--success)}.activity-chart-xaxis{height:14px;margin-top:2px;position:relative}.activity-chart-xlabel{font-family:var(--font-mono);color:var(--text-faint);white-space:nowrap;font-size:9px;position:absolute;top:0;transform:translate(-50%)}.activity-chart-tooltip.is-floating{position:absolute;top:8px;transform:translate(-50%)}.activity-chart-tooltip{background:var(--surface-solid);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text);white-space:nowrap;pointer-events:none;z-index:5;box-shadow:var(--shadow-card);flex-direction:column;gap:3px;padding:8px 10px;font-size:10.5px;display:flex}.activity-chart-tooltip strong{font-family:var(--font-mono);color:var(--accent-text)}.activity-chart-tooltip .is-active{color:var(--success)}.activity-chart-tooltip .is-idle{color:var(--text-faint)}.activity-chart-footnote{color:var(--text-faint);align-items:center;gap:6px;margin:12px 0 0;font-size:10.5px;display:flex}.dash-log-list{flex-direction:column;gap:8px;margin:0;padding:0;list-style:none;display:flex}.dash-log-row{border-radius:var(--radius-sm);background:var(--ink-2);border:1px solid var(--border-soft);justify-content:space-between;align-items:center;padding:11px 14px;transition:background .2s,border-color .2s,transform .15s;display:flex}.dash-log-row:hover{border-color:var(--border);transform:translate(1px)}.dash-log-time{font-family:var(--font-mono);color:var(--text);font-variant-numeric:tabular-nums;font-size:12.5px}.dash-log-chip{font-family:var(--font-mono);border-radius:var(--radius-pill);background:var(--accent-dim);color:var(--accent-text);letter-spacing:.02em;white-space:nowrap;padding:3px 10px;font-size:11px;font-weight:600}.dash-activity-counts{font-family:var(--font-body);color:var(--text-muted);text-align:center;text-overflow:ellipsis;white-space:nowrap;flex:1;padding:0 8px;font-size:11.5px;overflow:hidden}.dash-summary-item{list-style:none}.dash-summary-item+.dash-summary-item{margin-top:8px}button.dash-summary-row{text-align:left;cursor:pointer;width:100%;font:inherit;margin:0}.dash-summary-sessions-count{font-family:var(--font-mono);color:var(--text-faint);white-space:nowrap;font-size:10.5px}.dash-summary-sessions{flex-direction:column;gap:6px;margin:8px 0 0 20px;padding:0;list-style:none;display:flex}.dash-day-group .screenshot-grid{background:var(--ink-2);max-height:410px;padding:10px;overflow-y:auto}.screenshot-grid{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));align-content:start;gap:10px;display:grid}.screenshot-thumb{border:1px solid var(--border-soft);border-radius:var(--radius-sm);background:var(--surface);aspect-ratio:16/10;flex-direction:column;padding:0;transition:border-color .15s;display:flex;position:relative;overflow:hidden}.screenshot-thumb:hover{border-color:var(--accent)}.screenshot-thumb img{object-fit:cover;width:100%;height:100%;display:block}.screenshot-preview-portal{z-index:2500;border:1.5px solid var(--accent);border-radius:var(--radius-md);pointer-events:none;animation:.15s cubic-bezier(.22,1,.36,1) both screenshotPreviewIn;position:fixed;overflow:hidden;box-shadow:0 24px 60px #000000a6,0 0 0 4px #0000004d}.screenshot-preview-portal img{object-fit:cover;width:100%;height:100%;display:block}@keyframes screenshotPreviewIn{0%{opacity:0;transform:scale(.96)}to{opacity:1;transform:scale(1)}}.screenshot-thumb-state{color:var(--text-faint);flex:1;justify-content:center;align-items:center;font-size:11px;display:flex}.screenshot-thumb-time{font-family:var(--font-mono);border-radius:var(--radius-pill);color:#fff;letter-spacing:.02em;background:#000000a6;padding:3px 8px;font-size:10.5px;font-weight:700;position:absolute;bottom:6px;left:6px}.load-more-btn{border-radius:var(--radius-pill);border:1px solid var(--border);background:var(--ink-2);color:var(--text);margin:14px auto 0;padding:9px 22px;display:block}.load-more-btn:not(:disabled):hover{border-color:var(--accent);color:var(--accent-text)}