:root{--bg:#f6f7fb;--surface:#fff;--text:#182033;--muted:#6b7280;--line:#e6e8ef;--primary:#5b5ce2;--primary-dark:#4647c8;--primary-soft:#efefff;--success:#16a36a;--danger:#d9485f;--sidebar:#151827;--shadow:0 16px 40px rgba(31,41,55,.08);--radius:20px}*{box-sizing:border-box}html{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;background:var(--bg);color:var(--text)}body{margin:0;min-height:100vh}a{color:inherit;text-decoration:none}button,input{font:inherit}.muted{color:var(--muted)}.app-shell{display:grid;grid-template-columns:268px minmax(0,1fr);min-height:100vh}.sidebar{background:linear-gradient(180deg,#151827 0%,#10131f 100%);color:#fff;padding:24px 18px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh;z-index:30}.brand{display:flex;align-items:center;gap:12px;padding:0 8px 24px}.brand-mark,.hero-mark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#6366f1,#8b5cf6);font-weight:800;box-shadow:0 8px 24px rgba(99,102,241,.32)}.brand-name{font-size:18px;font-weight:800}.brand-product{font-size:12px;color:#a7adc2;margin-top:1px}.sidebar-context{display:flex;align-items:center;gap:9px;background:rgba(255,255,255,.055);border:1px solid rgba(255,255,255,.07);border-radius:13px;padding:11px 12px;margin:0 4px 18px;color:#c8cbda;font-size:12px}.context-dot,.status-dot{width:7px;height:7px;border-radius:50%;background:#45d693}.nav-list{display:flex;flex-direction:column;gap:4px}.nav-item{display:flex;align-items:center;gap:12px;min-height:44px;padding:0 12px;border-radius:11px;color:#aeb3c5;font-size:13px;font-weight:600}.nav-item:hover{background:rgba(255,255,255,.055);color:#fff}.nav-item.active{background:linear-gradient(90deg,rgba(99,102,241,.24),rgba(99,102,241,.08));color:#fff;border:1px solid rgba(129,140,248,.2)}.nav-item.disabled{cursor:default}.nav-icon{width:22px;text-align:center;font-size:16px;color:#cfd2df}.soon{margin-left:auto;font-size:9px;color:#b9bcff;border:1px solid rgba(169,171,255,.2);padding:3px 6px;border-radius:999px}.sidebar-footer{margin-top:auto;padding:16px 6px 2px}.version-pill{display:inline-flex;align-items:center;gap:9px;color:#9298ad;font-size:11px}.workspace{min-width:0}.topbar{height:78px;background:rgba(255,255,255,.92);backdrop-filter:blur(18px);border-bottom:1px solid var(--line);display:flex;align-items:center;padding:0 30px;position:sticky;top:0;z-index:20}.menu-button{display:none;border:0;background:none;font-size:22px}.topbar-title{display:flex;flex-direction:column;gap:2px}.topbar-title .eyebrow{font-size:10px;letter-spacing:.11em;color:#9297a6;text-transform:uppercase}.topbar-title strong{font-size:16px}.topbar-actions{margin-left:auto;display:flex;align-items:center;gap:12px}.language-link,.icon-button{border:1px solid var(--line);background:#fff;border-radius:10px;height:36px;min-width:36px;display:grid;place-items:center;color:#60677a;font-size:12px;font-weight:700}.icon-button{cursor:pointer;font-size:17px}.user-chip{display:flex;align-items:center;gap:10px;padding:4px 8px}.avatar{display:grid;place-items:center;width:36px;height:36px;border-radius:11px;background:var(--primary-soft);color:var(--primary-dark);font-weight:800}.user-copy{display:flex;flex-direction:column}.user-copy strong{font-size:12px}.user-copy span{font-size:10px;color:var(--muted);margin-top:2px}.page-content{padding:34px;max-width:1600px;margin:0 auto}.page-heading{display:flex;justify-content:space-between;gap:24px;align-items:flex-end;margin-bottom:26px}.section-kicker,.panel-eyebrow{display:block;color:var(--primary);font-weight:800;letter-spacing:.12em;font-size:10px;margin-bottom:8px}.page-heading h1,.setup-card h1{font-size:30px;line-height:1.15;margin:0 0 8px;letter-spacing:-.035em}.page-heading p{margin:0;color:var(--muted);font-size:14px;max-width:700px}.heading-actions{display:flex;gap:10px}.primary-button,.secondary-button{border:0;border-radius:12px;min-height:44px;padding:0 18px;font-weight:750;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:12px}.primary-button{background:linear-gradient(135deg,var(--primary),#6e62e8);color:#fff;box-shadow:0 10px 22px rgba(91,92,226,.22)}.primary-button.compact,.secondary-button{min-height:40px;padding:0 15px;font-size:12px}.primary-button:disabled,.secondary-button:disabled{opacity:.72;cursor:default}.secondary-button{background:#fff;color:#636a7c;border:1px solid var(--line)}.button-version{background:rgba(255,255,255,.15);padding:3px 6px;border-radius:7px;font-size:9px}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;margin-bottom:18px}.metric-card{background:var(--surface);border:1px solid var(--line);border-radius:17px;padding:20px;display:flex;align-items:center;gap:15px}.metric-card.accent{background:linear-gradient(135deg,#fbfbff,#f2f2ff);border-color:#dedfff}.metric-icon{width:42px;height:42px;border-radius:13px;background:#f4f5f9;display:grid;place-items:center;color:var(--primary);font-size:18px}.metric-card>div:last-child{display:flex;flex-direction:column}.metric-card span{font-size:11px;color:var(--muted);font-weight:650}.metric-card strong{font-size:25px;line-height:1.1;margin:5px 0 3px}.metric-card small{font-size:10px;color:#a0a5b2}.metric-card .status-text{font-size:18px;color:var(--success)}.content-grid{display:grid;gap:18px}.control-grid{grid-template-columns:minmax(0,1.7fr) minmax(300px,.8fr)}.panel,.empty-state-panel{background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 10px 28px rgba(31,41,55,.035)}.panel{padding:22px}.panel-header{display:flex;align-items:flex-start;justify-content:space-between;border-bottom:1px solid #eef0f4;padding-bottom:16px;margin-bottom:4px}.panel-header h2,.panel h2{margin:0;font-size:17px}.badge{font-size:9px;font-weight:800;letter-spacing:.08em;padding:6px 8px;border-radius:999px}.badge-live{background:#ebfaf3;color:#13885a}.foundation-list{display:flex;flex-direction:column}.foundation-item{display:grid;grid-template-columns:36px minmax(0,1fr) auto;gap:12px;align-items:center;padding:17px 4px;border-bottom:1px solid #f0f1f5}.foundation-item:last-child{border:0}.foundation-item .check,.foundation-item .step{width:30px;height:30px;border-radius:10px;display:grid;place-items:center;font-size:11px;font-weight:800}.foundation-item.complete .check{background:#ecfbf4;color:#139460}.foundation-item.next .step{background:var(--primary-soft);color:var(--primary)}.foundation-item strong{font-size:12px}.foundation-item p{margin:4px 0 0;color:var(--muted);font-size:11px}.foundation-item>span:last-child{font-size:10px;color:#9298a8}.workspace-stack>div{display:flex;align-items:center;gap:11px;padding:16px 2px;border-bottom:1px solid #f0f1f5}.workspace-stack>div:last-child{border:0}.workspace-icon{width:34px;height:34px;border-radius:10px;display:grid;place-items:center;font-size:11px;font-weight:800}.workspace-icon.purple{background:#efefff;color:#5859d7}.workspace-icon.blue{background:#edf7ff;color:#2685c7}.workspace-icon.green{background:#ecfaf4;color:#159463}.workspace-stack strong{font-size:12px}.workspace-stack p{font-size:10px;color:var(--muted);margin:3px 0 0}.mini-badge{margin-left:auto;font-size:9px;background:#eaf9f2;color:#168d5e;padding:4px 7px;border-radius:999px}.mini-badge.neutral{background:#f2f3f6;color:#858b98}.empty-state-panel{text-align:center;padding:70px 24px}.empty-illustration{margin:0 auto 18px;width:72px;height:72px;border-radius:22px;display:grid;place-items:center;background:linear-gradient(135deg,#efefff,#f8f6ff);color:var(--primary);font-weight:900}.empty-state-panel h2{margin:0 0 8px;font-size:19px}.empty-state-panel p{margin:0 auto;max-width:520px;color:var(--muted);font-size:12px;line-height:1.6}.employee-clock-hero{display:grid;grid-template-columns:1fr 360px;gap:24px;align-items:center;background:linear-gradient(135deg,#171a2b,#262a45);border-radius:24px;padding:36px;color:white;margin-bottom:18px}.clock-copy h1{font-size:34px;margin:0 0 9px}.clock-copy p{margin:0;color:#b9bfd0;max-width:620px;line-height:1.6;font-size:13px}.clock-card{background:white;color:var(--text);border-radius:19px;padding:22px;text-align:center;box-shadow:var(--shadow)}.clock-status{font-size:11px;color:var(--muted);display:flex;align-items:center;justify-content:center;gap:7px}.clock-status span{width:7px;height:7px;background:#a0a5b2;border-radius:50%}.clock-time{font-size:46px;font-weight:800;margin:11px 0 1px}.clock-date{font-size:10px;color:#9da2ae}.clock-button{width:100%;border:0;border-radius:12px;height:44px;margin-top:18px;background:#eceef3;color:#9aa0ae;font-weight:800}.employee-mini-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}.placeholder-line{margin-top:22px;padding:16px;background:#fafbfc;border-radius:12px;color:var(--muted);font-size:11px}.big-placeholder{font-size:30px;font-weight:800;margin-top:17px}.big-placeholder small{font-size:11px;color:var(--muted)}.auth-page{min-height:100vh;display:grid;grid-template-columns:minmax(420px,1.05fr) minmax(420px,.95fr)}.auth-panel{min-height:100vh}.auth-brand-panel{background:linear-gradient(145deg,#171a2b 0%,#20243b 52%,#292a4b 100%);color:#fff;padding:54px}.auth-brand-wrap{max-width:660px;height:100%;display:flex;flex-direction:column}.hero-brand{display:flex;align-items:center;gap:12px;font-size:20px;font-weight:850}.hero-mark.small{width:34px;height:34px;border-radius:10px;font-size:14px}.auth-hero-copy{margin:auto 0 46px}.hero-kicker{font-size:10px;letter-spacing:.17em;color:#aeb4ff;font-weight:850}.auth-hero-copy h1{font-size:56px;line-height:.98;letter-spacing:-.055em;margin:17px 0 22px}.auth-hero-copy p{color:#b7bdce;max-width:560px;line-height:1.7;font-size:14px}.hero-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.hero-grid>div{padding:15px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.035);border-radius:14px}.hero-grid strong{display:block;font-size:11px}.hero-grid span{display:block;color:#989fb4;font-size:9px;margin-top:5px}.auth-release{margin-top:28px;color:#7f869e;font-size:10px;display:flex;gap:8px;align-items:center}.auth-release span{width:6px;height:6px;border-radius:50%;background:#45d693}.auth-form-panel{display:grid;place-items:center;padding:46px;background:#fafbfe}.login-card{width:100%;max-width:440px}.mobile-brand{display:none}.login-card h2{font-size:30px;margin:7px 0 8px}.login-card>.muted{font-size:13px;margin-bottom:28px}.form-stack{display:flex;flex-direction:column;gap:16px}.field{display:flex;flex-direction:column;gap:7px}.field span{font-size:11px;font-weight:750;color:#3f4657}.field input{height:47px;border:1px solid #dfe2e9;border-radius:12px;padding:0 14px;background:#fff;outline:none}.field input:focus{border-color:#7779e8;box-shadow:0 0 0 4px rgba(91,92,226,.09)}.field small{font-size:9px;color:#8b91a0}.alert{padding:12px 13px;border-radius:11px;margin:0 0 18px;font-size:11px;display:flex;align-items:center;gap:8px}.alert-error{background:#fff0f2;color:#b9344a;border:1px solid #ffd7de}.alert-success{background:#ecfbf4;color:#14885a;border:1px solid #cef2df}.login-help{text-align:center;color:#8d93a2;font-size:10px;margin-top:20px}.login-help a{color:var(--primary);font-weight:750}.login-footer{text-align:center;margin-top:38px;color:#a5aab5;font-size:9px}.setup-page{min-height:100vh;display:grid;place-items:center;padding:40px;background:linear-gradient(135deg,#f6f7fb,#eeeff8)}.setup-card{background:#fff;border:1px solid var(--line);border-radius:24px;padding:34px;width:min(100%,680px);box-shadow:var(--shadow)}.hero-brand.dark{color:var(--text);margin-bottom:32px;font-size:15px}.setup-card>p{font-size:12px;line-height:1.5;margin:0 0 22px}.two-column-form{display:grid;grid-template-columns:1fr 1fr}.two-column-form .full{grid-column:1/-1}.back-link{display:inline-block;margin-top:20px;font-size:10px;color:var(--muted)}.error-page{min-height:100vh;display:grid;place-items:center;align-content:center;text-align:center;padding:30px;background:#f7f8fb}.error-code{font-size:72px;font-weight:900;color:#dadce5}.error-page h1{font-size:25px;margin:0 0 8px}.error-page p{color:var(--muted);font-size:12px;margin:0 0 20px}@media(max-width:1100px){.metric-grid{grid-template-columns:repeat(2,1fr)}.control-grid{grid-template-columns:1fr}.auth-page{grid-template-columns:1fr}.auth-brand-panel{display:none}.auth-form-panel{min-height:100vh}.mobile-brand{display:flex;align-items:center;gap:9px;margin-bottom:54px;font-weight:800}.employee-clock-hero{grid-template-columns:1fr}.employee-mini-grid{grid-template-columns:1fr 1fr}}@media(max-width:780px){.app-shell{grid-template-columns:1fr}.sidebar{position:fixed;left:-280px;width:268px;transition:left .2s}.sidebar.open{left:0;box-shadow:20px 0 50px rgba(0,0,0,.18)}.menu-button{display:block;margin-right:12px}.topbar{padding:0 16px}.user-copy{display:none}.page-content{padding:22px 16px}.page-heading{align-items:flex-start;flex-direction:column}.metric-grid{grid-template-columns:1fr 1fr}.auth-form-panel{padding:28px}.employee-mini-grid{grid-template-columns:1fr}}@media(max-width:520px){.metric-grid{grid-template-columns:1fr}.topbar-title .eyebrow{display:none}.language-link{display:none}.page-heading h1{font-size:25px}.auth-form-panel{padding:24px}.login-card h2{font-size:26px}.two-column-form{grid-template-columns:1fr}.two-column-form .full{grid-column:auto}.employee-clock-hero{padding:24px}.clock-copy h1{font-size:28px}}
.payroll-top-grid{grid-template-columns:minmax(0,1.1fr) minmax(320px,.9fr);margin-bottom:18px}.checkbox-field{display:flex!important;flex-direction:row!important;align-items:center;gap:10px;padding-top:26px}.checkbox-field input{width:17px;height:17px}.payroll-action-panel{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:18px}.payroll-action-panel p{margin:5px 0 0;font-size:11px}.payroll-table td{vertical-align:top}.payroll-issue{display:inline-block;background:#fff0f2;border:1px solid #ffd7de;color:#b9344a;border-radius:9px;padding:5px 7px;font-size:9px;font-weight:800;margin-bottom:5px}.payroll-advisory{display:block;max-width:280px;color:#8a6d1d;line-height:1.4}.payroll-override{display:grid;grid-template-columns:110px minmax(180px,1fr) auto;gap:6px;margin-top:8px}.payroll-override input{min-height:36px;border:1px solid var(--line);border-radius:9px;padding:0 9px;font-size:10px}.payroll-disclaimer{margin-top:18px;background:#fbfbff}.payroll-disclaimer strong{font-size:12px}.payroll-disclaimer p{font-size:11px;color:var(--muted);margin:6px 0 0;line-height:1.6}@media(max-width:1100px){.payroll-top-grid{grid-template-columns:1fr}.payroll-action-panel{align-items:flex-start;flex-direction:column}.payroll-override{grid-template-columns:1fr}}