:root{--bg:#f7f8fa;--surface:#fff;--surface-2:#f9fafb;--border:#e5e7eb;--border-strong:#d1d5db;--text:#111827;--text-muted:#4b5563;--text-faint:#9ca3af;--grid:#eef0f3;--hover:#f3f4f6;--accent:#1d4ed8;--accent-hover:#1e40af;--accent-soft:#c7d2fe;--accent-tint:#eff6ff;--on-accent:#fff;--green:#047857;--green-tint:#ecfdf5;--amber:#b45309;--amber-tint:#fffbeb;--red:#b91c1c;--red-solid:#dc2626;--red-tint:#fef2f2;--brand-panel:#0f1e3d;--radius:10px;--radius-sm:6px;--shadow:0 1px 2px #1018280d;--shadow-lg:0 8px 24px -6px #1018281f;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;font-family:Inter,system-ui,-apple-system,Segoe UI,sans-serif;font-size:15px;line-height:1.5}@media (prefers-color-scheme:dark){:root{--bg:#0b1220;--surface:#111a2b;--surface-2:#0f1726;--border:#1f2a3d;--border-strong:#2b3850;--text:#e5e7eb;--text-muted:#9ca3af;--text-faint:#6b7280;--grid:#1a2436;--hover:#172135;--accent:#60a5fa;--accent-hover:#93c5fd;--accent-soft:#1e3a8a;--accent-tint:#60a5fa1f;--on-accent:#0b1220;--green:#34d399;--green-tint:#34d3991f;--amber:#fbbf24;--amber-tint:#fbbf241f;--red:#f87171;--red-solid:#dc2626;--red-tint:#f871711f;--brand-panel:#13213d;--shadow:0 1px 2px #0000004d;--shadow-lg:0 8px 24px -6px #00000080;--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}}*{box-sizing:border-box}html,body{min-height:100%;margin:0}body{background:var(--bg);-webkit-tap-highlight-color:transparent}button,.btn,.icon-btn,.row--button,.menu__trigger{-webkit-user-select:none;user-select:none;touch-action:manipulation}h1,h2,h3,p{margin:0}h1{letter-spacing:-.015em;font-size:clamp(1.4rem,2.4vw,1.75rem);font-weight:600;line-height:1.2}h3{font-size:.98rem;font-weight:600}button{font:inherit;color:inherit}code{background:var(--hover);border:1px solid var(--border);border-radius:4px;padding:1px 5px;font-family:ui-monospace,SFMono-Regular,Consolas,monospace;font-size:.85em}.muted{color:var(--text-muted)}.tabular{font-variant-numeric:tabular-nums}.eyebrow{text-transform:uppercase;letter-spacing:.06em;color:var(--text-faint);margin-bottom:2px;font-size:.72rem;font-weight:600}.page{gap:16px;max-width:1240px;margin:0 auto;padding:28px 24px 64px;display:grid}.page__head{justify-content:space-between;align-items:end;gap:16px;margin-bottom:8px;display:flex}.page__head p{margin-top:4px}.grid-3{grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;display:grid}.span-2{grid-column:span 2}.cell{grid-template-columns:minmax(0,1fr);display:grid}.grid-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;display:grid}.page>*,.grid-3>*,.grid-stats>*{min-width:0}@media (width<=960px){.grid-3{display:contents}.span-2{grid-column:auto}.m-1{order:1}.m-2{order:2}.m-3{order:3}.m-4{order:4}.m-5{order:5}.m-6{order:6}.m-7{order:7}.m-8{order:8}}@media (width<=520px){.page{gap:12px;padding:20px 16px 48px}.grid-stats{gap:12px}.hide-sm{display:none}}.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);position:relative}.card__head{justify-content:space-between;align-items:start;gap:12px;padding:18px 20px 8px;display:flex}.chip{border-radius:var(--radius-sm);background:var(--surface-2);border:1px solid var(--border);color:var(--text-muted);white-space:nowrap;align-items:center;padding:3px 8px;font-size:.75rem;font-weight:500;display:inline-flex}.chip--sm{align-self:start;margin-top:6px;padding:1px 6px;font-size:.7rem}.topbar{z-index:20;background:var(--surface);border-bottom:1px solid var(--border);position:sticky;top:0}.topbar__inner{justify-content:space-between;align-items:center;max-width:1240px;margin:0 auto;padding:10px 24px;display:flex}.brand{letter-spacing:-.01em;align-items:center;gap:10px;font-size:1.05rem;font-weight:600;display:flex}.live-dot{background:var(--green);border-radius:50%;width:8px;height:8px}.menu{position:relative}.menu__trigger{border-radius:var(--radius);cursor:pointer;background:0 0;border:1px solid #0000;align-items:center;gap:10px;padding:4px 8px 4px 4px;transition:background .15s,border-color .15s;display:flex}@media (hover:hover){.menu__trigger:hover{background:var(--hover)}}.avatar{width:30px;height:30px;color:var(--on-accent);background:var(--accent);border-radius:50%;place-items:center;font-size:.75rem;font-weight:600;display:grid}img.avatar{object-fit:cover}.menu__name{font-size:.92rem;font-weight:500}.menu__panel{transform-origin:100% 0;min-width:240px;box-shadow:var(--shadow-lg);padding:6px;position:absolute;top:calc(100% + 6px);right:0}.menu__user{border-bottom:1px solid var(--border);flex-direction:column;margin-bottom:6px;padding:10px 10px 12px;display:flex}.menu__user .muted{font-size:.85rem}.menu__item{border-radius:var(--radius-sm);cursor:pointer;text-align:left;background:0 0;border:0;align-items:center;gap:10px;width:100%;padding:8px 10px;font-size:.92rem;display:flex}@media (hover:hover){.menu__item:hover{background:var(--hover)}}.menu__item--danger{color:var(--red)}.btn{border-radius:var(--radius-sm);cursor:pointer;border:1px solid #0000;justify-content:center;align-items:center;gap:8px;padding:9px 16px;font-size:.92rem;font-weight:600;transition:background .15s,border-color .15s,color .15s;display:inline-flex}.btn:disabled{opacity:.6;cursor:progress}.btn--xl{flex:1;padding:12px 18px;font-size:.98rem}.btn--block{width:100%}.btn--primary{color:var(--on-accent);background:var(--accent)}@media (hover:hover){.btn--primary:hover{background:var(--accent-hover)}}.btn--danger{color:#fff;background:var(--red-solid)}@media (hover:hover){.btn--danger:hover{background:#b91c1c}}.btn--ghost,.btn--outline{background:var(--surface);border-color:var(--border-strong)}@media (hover:hover){.btn--ghost:hover,.btn--outline:hover{background:var(--hover)}}.spin{animation:.9s linear infinite spin}.clock-card{--status:var(--text-faint);flex-direction:column;gap:16px;padding:20px;display:flex}.clock-card.status-on{--status:var(--green)}.clock-card.status-break{--status:var(--amber)}.clock-card__head{justify-content:space-between;align-items:start;gap:12px;display:flex}.clock-card__date{font-size:1rem;font-weight:600}.clock-card__row{gap:10px;width:100%;display:flex}.clock-card__actions{display:flex}.clock-card__foot{color:var(--text-muted);text-align:center;font-size:.8rem}.clock-ring{aspect-ratio:1;width:min(100%,230px);margin:4px auto;position:relative}.clock-ring__svg{width:100%;height:100%;transform:rotate(-90deg)}.clock-ring__track{fill:none;stroke:var(--grid);stroke-width:8px}.clock-ring__bar{fill:none;stroke:var(--status);stroke-width:8px;stroke-linecap:round;transition:stroke .3s}.clock-ring__center{place-items:center;display:grid;position:absolute;inset:0}.clock-ring__inner{flex-direction:column;align-items:center;gap:2px;display:flex}.clock-ring__time{letter-spacing:-.02em;font-variant-numeric:tabular-nums;font-size:clamp(1.8rem,5vw,2.2rem);font-weight:600}.clock-ring__sub{color:var(--text-muted);font-size:.82rem}.clock-ring__type{color:var(--accent);background:var(--accent-tint);border-radius:999px;margin-top:4px;padding:2px 8px;font-size:.72rem;font-weight:600}.shift-type{white-space:nowrap;font-weight:500}.tag--bh{color:var(--green)}.table tfoot td{border-top:1px solid var(--border-strong);border-bottom:0;font-weight:600}.table td.wrap{white-space:normal}.card__note{color:var(--text-faint);padding:4px 20px 14px;font-size:.78rem}.clock-ring__sub strong{color:var(--text);font-weight:600}.pill{color:var(--text-muted);background:var(--surface-2);border:1px solid var(--border);white-space:nowrap;border-radius:999px;align-items:center;gap:6px;padding:3px 10px;font-size:.75rem;font-weight:600;display:inline-flex}.pill__dot{background:currentColor;border-radius:50%;width:6px;height:6px}.pill--on{color:var(--green);background:var(--green-tint);border-color:#0000}.pill--break{color:var(--amber);background:var(--amber-tint);border-color:#0000}.stat{flex-direction:column;gap:2px;padding:18px 20px;display:flex}.stat__icon{border-radius:var(--radius-sm);width:34px;height:34px;color:var(--accent);background:var(--accent-tint);place-items:center;margin-bottom:12px;display:grid}.stat__label{color:var(--text-muted);font-size:.85rem;font-weight:500}.stat__value{letter-spacing:-.02em;font-size:clamp(1.4rem,2.6vw,1.75rem);font-weight:600}.stat__hint{color:var(--text-faint);margin-top:auto;padding-top:8px;font-size:.8rem}.progress{display:grid}.progress:before{content:"";background:var(--grid);border-radius:99px;grid-area:1/1;height:6px;display:block}.progress__bar{background:var(--accent);border-radius:99px;grid-area:1/1;height:6px}.progress__label{grid-area:2/1;margin-top:6px}.chart-card__body{padding:8px 12px 14px}.tooltip{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);box-shadow:var(--shadow-lg);padding:8px 10px;font-size:.82rem}.tooltip__title{color:var(--text-muted);margin-bottom:2px;font-size:.76rem}.tooltip__ot{color:var(--amber);font-size:.76rem}.recharts-wrapper,.recharts-wrapper :focus,.recharts-surface:focus{outline:none}.chart-card__body{-webkit-user-select:none;user-select:none}@media (hover:none){.recharts-tooltip-cursor{display:none}}.list-card{padding-bottom:6px}.rows{margin:0;padding:4px 8px 6px;list-style:none}.row{border-radius:var(--radius-sm);align-items:center;gap:12px;padding:10px 12px;transition:background .15s;display:flex}.row+.row{border-top:1px solid var(--border);border-radius:0}@media (hover:hover){.row:hover{background:var(--hover)}}.row__badge{border-radius:var(--radius-sm);flex-shrink:0;place-items:center;width:32px;height:32px;display:grid}.badge--paid{color:var(--green);background:var(--green-tint)}.badge--pending{color:var(--amber);background:var(--amber-tint)}.badge--in-progress{color:var(--accent);background:var(--accent-tint)}.row__main{flex:1;min-width:0}.row__title{font-size:.92rem;font-weight:500}.row__sub{color:var(--text-faint);font-size:.78rem}.row__sub .ot{color:var(--amber)}.row__end{text-align:right}.row__amount{font-variant-numeric:tabular-nums;font-weight:600}.tag{font-size:.72rem;font-weight:500}.tag--paid{color:var(--green)}.tag--pending{color:var(--amber)}.tag--in-progress{color:var(--accent)}.table-wrap{padding:4px 8px 8px;overflow-x:auto}.table{border-collapse:collapse;font-variant-numeric:tabular-nums;width:100%;font-size:.86rem}.table th{text-align:left;text-transform:uppercase;letter-spacing:.05em;color:var(--text-faint);background:var(--surface-2);border-bottom:1px solid var(--border);padding:8px 12px;font-size:.72rem;font-weight:600}.table td{border-bottom:1px solid var(--border);white-space:nowrap;padding:10px 12px}.table tbody tr:last-child td{border-bottom:0}.table tbody tr{transition:background .15s}@media (hover:hover){.table tbody tr:hover{background:var(--hover)}}.table .num{text-align:right}.timesheet{--ts-cols:64px minmax(140px, 1fr) 178px 64px 76px;flex-direction:column;display:flex;overflow:hidden}.timesheet__head{align-items:center}.week-nav{align-items:center;gap:6px;display:flex}.btn--sm{padding:5px 10px;font-size:.8rem}.icon-btn{border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--surface);cursor:pointer;place-items:center;width:32px;height:32px;transition:background .15s;display:grid}@media (hover:hover){.icon-btn:hover:not(:disabled){background:var(--hover)}}.icon-btn:disabled{opacity:.35;cursor:default}.ts-scale,.ts-day{grid-template-columns:var(--ts-cols);grid-template-areas:"date track shifts hours pay";column-gap:16px;padding:0 20px;display:grid}.ts-scale{padding-top:4px;padding-bottom:4px}.ts-scale__ticks{grid-area:track;height:14px;position:relative}.ts-scale__ticks span{color:var(--text-faint);font-variant-numeric:tabular-nums;font-size:.68rem;position:absolute;transform:translate(-50%)}.ts-scale__ticks span:first-child{transform:none}.ts-scale__ticks span:last-child{transform:translate(-100%)}.ts-days{flex:1;margin:0;padding:0;list-style:none}.ts-day{border-top:1px solid var(--border);align-items:center;min-height:54px;padding-top:8px;padding-bottom:8px;transition:background .15s}@media (hover:hover){.ts-day:hover{background:var(--hover)}}.ts-day--today{background:var(--accent-tint)}@media (hover:hover){.ts-day--today:hover{background:var(--accent-tint)}}.ts-day__date{flex-direction:column;grid-area:date;line-height:1.2;display:flex}.ts-day__date strong{font-size:.9rem}.ts-day__date span{color:var(--text-faint);font-size:.75rem}.ts-day--today .ts-day__date strong{color:var(--accent)}.ts-day--off .ts-day__date strong{color:var(--text-muted);font-weight:500}.ts-track{background:var(--grid);border-radius:99px;grid-area:track;height:10px;position:relative}.ts-track i{background:var(--border);width:1px;position:absolute;top:-3px;bottom:-3px}.ts-bar{background:var(--accent);border-radius:99px;position:absolute;top:0;bottom:0}.ts-bar--from{opacity:.55;border-top-left-radius:0;border-bottom-left-radius:0}.ts-bar--to{border-top-right-radius:0;border-bottom-right-radius:0}.ts-bar--live{background:var(--green);animation:1.6s ease-in-out infinite live}.ts-day__shifts{grid-area:shifts;gap:4px;display:grid}.ts-day__none{color:var(--text-faint);font-size:.85rem}.ts-shift__times{align-items:baseline;gap:6px;display:flex}.ts-time{font-variant-numeric:tabular-nums;font-size:.95rem;font-weight:600}.ts-time sup{color:var(--text-faint);margin-left:1px;font-size:.65rem}.ts-arrow{color:var(--text-faint);font-size:.85rem}.ts-now{color:var(--green)}.ts-shift__meta{color:var(--text-faint);flex-wrap:wrap;align-items:center;gap:4px;font-size:.74rem;display:flex}.ts-flag{border-radius:4px;padding:0 5px;font-size:.66rem;font-weight:600}.ts-flag--ot{color:var(--amber);background:var(--amber-tint)}.ts-flag--bh{color:var(--green);background:var(--green-tint)}.ts-day__hours,.ts-day__pay{text-align:right;font-variant-numeric:tabular-nums;white-space:nowrap}.ts-day__hours{grid-area:hours;font-size:.9rem}.ts-day__pay{color:var(--text-muted);grid-area:pay;font-size:.85rem}.ts-total{border-top:1px solid var(--border-strong);background:var(--surface-2);justify-content:space-between;align-items:center;gap:16px;padding:14px 20px;display:flex}.ts-total>div{flex-direction:column;line-height:1.25;display:flex}.ts-total strong{font-variant-numeric:tabular-nums;font-size:1.15rem}.ts-total span{color:var(--text-faint);font-size:.78rem}.ts-total__pay{text-align:right}@media (width<=640px){.ts-scale{display:none}.ts-day{grid-template-columns:48px minmax(0,1fr) auto;grid-template-areas:"date shifts hours""date track pay";row-gap:8px;padding:10px 16px}.ts-total{padding:14px 16px}}.row--button{cursor:pointer}@media (hover:hover){.row--selected,.row--selected:hover{background:var(--accent-tint);box-shadow:inset 3px 0 0 var(--accent)}}@keyframes live{50%{opacity:.55}}.topbar__actions{align-items:center;gap:8px;display:flex}.badge-overlay{z-index:50;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#080c1499;place-items:center;padding:16px;display:grid;position:fixed;inset:0}.badge-sheet{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);width:100%;max-width:560px;box-shadow:var(--shadow-lg);gap:14px;padding:16px 20px 20px;display:grid}.badge-sheet__head{justify-content:space-between;align-items:center;display:flex}.badge-sheet__head h2{font-size:1.05rem;font-weight:600}.badge-sheet__loading{min-height:200px;color:var(--accent);place-items:center;display:grid}.badge{background:#fff;border:10px solid #d9d9d9;border-radius:12px;place-items:center;padding:24px;display:grid}.badge__qr{aspect-ratio:1;width:100%;max-width:320px;display:block}.badge-form{gap:8px;display:grid}.badge-form label{font-size:.9rem;font-weight:600}.badge-form input{font:inherit;font-variant-numeric:tabular-nums;border-radius:var(--radius-sm);border:1px solid var(--border-strong);background:var(--surface);color:var(--text);padding:10px 12px}.badge-form input:focus{outline:2px solid var(--accent);outline-offset:1px}.badge-form .muted{font-size:.8rem}.badge-form__actions{justify-content:flex-end;gap:8px;margin-top:6px;display:flex}@media (width<=520px){.badge{padding:12px}.badge__qr{max-width:none}}.auth{background:var(--surface);grid-template-columns:minmax(360px,5fr) 7fr;min-height:100dvh;display:grid}.auth__brand{background:var(--brand-panel);color:#e5e7eb;flex-direction:column;justify-content:space-between;gap:40px;padding:40px 48px;display:flex}.brand--light{color:#fff}.auth__pitch h2{letter-spacing:-.02em;color:#fff;max-width:18ch;margin-bottom:32px;font-size:clamp(1.6rem,2.6vw,2.1rem);font-weight:600;line-height:1.2}.auth__features{gap:22px;margin:0;padding:0;list-style:none;display:grid}.auth__features li{align-items:start;gap:14px;display:flex}.auth__features strong{color:#fff;font-size:.95rem;font-weight:600}.auth__features p{color:#9ca3af;margin-top:2px;font-size:.88rem}.auth__feature-icon{border-radius:var(--radius-sm);color:#93c5fd;background:#93c5fd1a;border:1px solid #93c5fd2e;flex-shrink:0;place-items:center;width:36px;height:36px;display:grid}.auth__legal{color:#6b7280;font-size:.78rem}.auth__main{background:var(--bg);place-items:center;padding:40px 24px;display:grid}.auth__card{flex-direction:column;gap:12px;width:100%;max-width:380px;display:flex}.auth__mobile-logo{margin-bottom:8px;display:none}.auth__title{font-size:1.6rem}.auth__note{color:var(--text-faint);border-top:1px solid var(--border);align-items:center;gap:6px;margin-top:8px;padding-top:16px;font-size:.78rem;display:flex}@media (width<=820px){.auth{grid-template-columns:1fr}.auth__brand{display:none}.auth__mobile-logo{display:block}}.gsi{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light;min-height:44px;margin-top:12px;position:relative}.gsi__button{min-height:44px;transition:opacity .2s;display:flex}.gsi__button iframe{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}.gsi__skeleton,.gsi__overlay{border-radius:4px;justify-content:center;align-items:center;gap:8px;font-size:.9rem;font-weight:500;display:flex;position:absolute;inset:0}.gsi__skeleton{background:var(--surface);border:1px solid var(--border-strong);color:var(--text-faint)}.gsi__overlay{color:var(--text)}.alert{color:var(--red);background:var(--red-tint);border-radius:var(--radius-sm);padding:10px 12px;font-size:.85rem;overflow:hidden}.alert--row{justify-content:space-between;align-items:start;gap:8px;display:flex}.alert__close{color:inherit;cursor:pointer;opacity:.7;background:0 0;border:0;padding:2px;display:inline-flex}@media (hover:hover){.alert__close:hover{opacity:1}}.table .empty{text-align:center;color:var(--text-faint);white-space:normal;padding:28px 12px}.load-error{text-align:center;justify-items:center;gap:12px;max-width:420px;padding:0 16px;display:grid}.page-loader{min-height:100dvh;color:var(--accent);place-items:center;display:grid}:focus-visible{outline:2px solid var(--accent);outline-offset:2px}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition:none!important;animation:none!important}}