:root{--font-sans:Arial, Helvetica, sans-serif;--font-mono:"Courier New", Courier, monospace;--ink:#17352f;--forest:#143c35;--forest-2:#1d5248;--cream:#f4f1e9;--paper:#fffdf8;--line:#ddd9cf;--muted:#6e746f;--orange:#ec7444;--green:#2e8b70;--sand:#d8b573;--red:#c65349}*{box-sizing:border-box}html{background:var(--cream)}body{color:var(--ink);background:var(--cream);font-family:var(--font-sans);margin:0}a{color:inherit;text-decoration:none}button,input,textarea,select{font:inherit}button{cursor:pointer}.container{width:min(1180px,100% - 40px);margin-inline:auto}.logo{letter-spacing:-.4px;align-items:center;gap:10px;font-size:20px;display:inline-flex}.logo>span{color:#fff;background:var(--forest);letter-spacing:.5px;border-radius:11px;place-items:center;width:38px;height:38px;font-size:13px;display:grid}.logo-light{color:#fff}.logo-light>span{color:var(--forest);background:#f3d9a6}.button{border:0;border-radius:10px;justify-content:center;align-items:center;padding:11px 17px;font-weight:750;transition:transform .15s,opacity .15s,background .15s;display:inline-flex}.button:hover{transform:translateY(-1px)}.button:disabled{cursor:wait;opacity:.65}.button-primary{background:var(--orange);color:#fff;box-shadow:0 8px 24px #ec74442b}.button-secondary{color:var(--forest);border:1px solid var(--line);background:#fff}.button-large{padding:15px 22px}.button-small{color:#fff;background:var(--forest);padding:8px 13px;font-size:13px}.button-full{width:100%;margin-top:8px}.eyebrow,.step-label{color:var(--orange);letter-spacing:1.6px;text-transform:uppercase;font-size:12px;font-weight:850;line-height:1}.landing-nav{justify-content:space-between;align-items:center;height:90px;display:flex}.hero{grid-template-columns:1.05fr .95fr;align-items:center;gap:75px;min-height:620px;padding-block:60px 100px;display:grid}.hero h1{letter-spacing:-4px;max-width:750px;margin:22px 0;font-size:clamp(46px,6vw,78px);line-height:.98}.hero-copy>p{color:var(--muted);max-width:620px;font-size:19px;line-height:1.65}.hero-actions{align-items:center;gap:18px;margin-top:32px;display:flex}.hero-note{color:var(--muted);max-width:180px;font-size:13px}.hero-board{background:var(--forest);color:#fff;border-radius:26px;padding:28px;transform:rotate(1deg);box-shadow:0 35px 70px #17352f3b}.preview-top{color:#b8ccc6;justify-content:space-between;align-items:flex-start;font-size:13px;display:flex}.preview-top strong{color:#fff}.preview-stat{background:#ffffff0b;border:1px solid #ffffff1c;border-radius:18px;margin-top:28px;padding:24px}.preview-stat span{color:#b8ccc6;font-size:13px;display:block}.preview-stat strong{margin-top:4px;font-size:48px;display:block}.preview-grid{grid-template-columns:repeat(3,1fr);gap:10px;margin:12px 0 24px;display:grid}.preview-grid div{color:var(--ink);background:#fff;border-radius:14px;padding:16px;position:relative}.preview-grid small,.preview-grid b{display:block}.preview-grid small{color:var(--muted)}.preview-grid b{margin-top:6px;font-size:25px}.dot{border-radius:50%;width:8px;height:8px;position:absolute;top:12px;right:12px}.dot.green{background:var(--green)}.dot.amber{background:var(--sand)}.dot.red{background:var(--red)}.preview-row{border-top:1px solid #ffffff15;align-items:center;gap:12px;padding:14px 0;display:flex}.preview-row p{flex-direction:column;flex:1;margin:0;display:flex}.preview-row small{color:#b8ccc6;margin-top:4px}.avatar{width:42px;height:42px;color:var(--forest);background:#dcebe5;border-radius:12px;flex:none;place-items:center;font-size:12px;font-style:normal;font-weight:850;display:grid}.avatar.sand{background:#f2d8a4}.pill{text-transform:capitalize;white-space:nowrap;border-radius:999px;align-items:center;width:fit-content;padding:6px 9px;font-size:11px;display:inline-flex}.pill.success{color:#17644e;background:#dff2e8}.pill.warning{color:#8a531b;background:#f9e7c7}.pill.neutral{color:#626762;background:#ecece8}.trust-strip{border-top:1px solid var(--line);background:#fff;padding:38px 0}.trust-grid{grid-template-columns:repeat(3,1fr);gap:45px;display:grid}.trust-grid div{flex-direction:column;gap:7px;display:flex}.trust-grid span{color:var(--muted);line-height:1.5}.auth-page{grid-template-columns:minmax(360px,42%) 1fr;min-height:100vh;display:grid}.auth-panel{color:#fff;background:var(--forest);flex-direction:column;padding:48px clamp(30px,6vw,90px);display:flex}.auth-copy{margin-block:auto}.auth-copy h1{letter-spacing:-3.5px;max-width:560px;margin:20px 0;font-size:clamp(40px,5vw,68px);line-height:1.02}.auth-copy p{color:#bed0ca;max-width:480px;font-size:17px;line-height:1.65}.auth-points{color:#d7e4e0;flex-direction:column;gap:10px;font-size:14px;display:flex}.auth-form-wrap,.onboarding-page{place-items:center;padding:30px;display:grid}.auth-card,.onboarding-card{background:var(--paper);border:1px solid var(--line);border-radius:20px;width:min(460px,100%);padding:clamp(28px,5vw,46px);box-shadow:0 24px 60px #17352f12}.auth-card h2,.onboarding-card h1{letter-spacing:-1px;margin:12px 0 8px;font-size:30px}.muted{color:var(--muted);line-height:1.55}label{color:var(--ink);font-size:13px;font-weight:750}input,textarea,select{width:100%;color:var(--ink);background:#fff;border:1px solid #cfcec8;border-radius:9px;outline:none;margin-top:7px;padding:12px 13px;transition:border .15s,box-shadow .15s}input:focus,textarea:focus,select:focus{border-color:var(--green);box-shadow:0 0 0 3px #2e8b701c}.auth-card label{margin-top:26px;display:block}.form-error{color:#8d312a;background:#fbe7e4;border-radius:8px;padding:10px 12px;font-size:13px}.fine-print{color:#8a8e8a;text-align:center;margin:18px 0 0;font-size:11px}.code-input{height:58px;font-family:var(--font-mono);letter-spacing:9px;text-align:center;font-size:26px}.back-link,.text-button{color:var(--green);background:0 0;border:0;padding:0;font-weight:750}.text-button{width:100%;margin-top:18px;font-size:13px}.onboarding-page{min-height:100vh}.onboarding-card .logo{margin-bottom:50px}.stack-form{flex-direction:column;gap:17px;margin-top:28px;display:flex}.stack-form label{display:block}.form-grid{grid-template-columns:1fr 1fr;gap:12px;display:grid}.info-box{color:var(--forest);background:#e8f1ed;border-radius:9px;flex-direction:column;gap:4px;padding:13px 14px;font-size:12px;display:flex}.app-frame{grid-template-columns:245px 1fr;min-height:100vh;display:grid}.sidebar{color:#dce8e4;background:var(--forest);flex-direction:column;height:100vh;padding:26px 20px;display:flex;position:sticky;top:0}.business-switcher{background:#ffffff09;border:1px solid #ffffff17;border-radius:12px;flex-direction:column;gap:5px;margin:30px 0 18px;padding:14px;display:flex}.business-switcher small{color:#8db1a7;letter-spacing:1.2px;font-size:9px}.business-switcher strong{color:#fff;white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.business-switcher span{color:#9fbdb4;text-transform:capitalize;font-size:11px}.side-nav{flex-direction:column;gap:5px;display:flex}.side-nav a,.sidebar-bottom a,.sidebar-bottom button{color:#c4d4cf;text-align:left;background:0 0;border:0;border-radius:9px;align-items:center;gap:12px;width:100%;padding:11px 12px;font-size:14px;font-weight:650;display:flex}.side-nav a:hover,.sidebar-bottom a:hover,.sidebar-bottom button:hover{color:#fff;background:#ffffff0d}.side-nav span,.sidebar-bottom span{text-align:center;color:#84aa9f;width:20px}.sidebar-bottom{border-top:1px solid #ffffff12;margin-top:auto;padding-top:16px}.app-main{min-width:0}.mobile-header,.mobile-nav{display:none}.page-content{width:min(1400px,100% - 64px);margin-inline:auto;padding:46px 0 80px}.page-header{justify-content:space-between;align-items:flex-end;gap:25px;margin-bottom:32px;display:flex}.page-header h1{letter-spacing:-2px;margin:9px 0 4px;font-size:clamp(31px,4vw,46px);line-height:1.05}.page-header p{color:var(--muted);margin:0}.stats-grid{grid-template-columns:repeat(4,1fr);gap:14px;display:grid}.stat-card{border:1px solid var(--line);background:var(--paper);border-radius:16px;flex-direction:column;min-height:170px;padding:22px;display:flex}.stat-card>span{color:var(--muted);font-size:12px;font-weight:750}.stat-card>strong{letter-spacing:-1.5px;margin-block:auto;font-size:36px}.stat-card>small{color:var(--muted)}.stat-card.dark{color:#fff;background:var(--forest);border-color:var(--forest)}.stat-card.dark span,.stat-card.dark small{color:#b7cbc4}.stat-card.green{border-top:4px solid var(--green)}.stat-card.orange{border-top:4px solid var(--orange)}.stat-card.sand{border-top:4px solid var(--sand)}.dashboard-grid{grid-template-columns:1.5fr 1fr;gap:14px;margin-top:14px;display:grid}.panel{background:var(--paper);border:1px solid var(--line);border-radius:16px;overflow:hidden}.panel-heading{border-bottom:1px solid #ebe8df;justify-content:space-between;align-items:flex-start;min-height:78px;padding:20px 22px;display:flex}.panel-heading h2{letter-spacing:-.5px;margin:5px 0 0;font-size:21px}.panel-heading p{color:var(--muted);margin:5px 0 0;font-size:12px}.panel-heading>a{color:var(--green);font-size:13px;font-weight:750}.list-row{border-bottom:1px solid #eeeae1;align-items:center;gap:12px;padding:16px 22px;display:flex}.list-row:last-child{border:0}.list-row div{flex-direction:column;gap:3px;display:flex}.list-row small{color:var(--muted)}.check-circle{border:2px solid #b9c4bf;border-radius:50%;width:20px;height:20px}.quick-panel>a{border-bottom:1px solid #eeeae1;align-items:center;gap:12px;padding:17px 22px;display:flex}.quick-panel>a:last-child{border:0}.quick-panel>a:hover{background:#f7f5ee}.quick-panel a>div{flex-direction:column;flex:1;gap:3px;display:flex}.quick-panel small{color:var(--muted)}.quick-icon{width:34px;height:34px;color:var(--forest);background:#e7eee9;border-radius:9px;place-items:center;font-weight:850;display:grid}.empty{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:250px;padding:40px;display:flex}.empty>span{width:45px;height:45px;color:var(--green);background:#e6f2ed;border-radius:50%;place-items:center;margin-bottom:12px;display:grid}.empty p{max-width:330px;color:var(--muted);margin:7px 0 14px}.empty a{color:var(--green);font-weight:750}.two-column{grid-template-columns:minmax(0,1.5fr) minmax(320px,.8fr);align-items:start;gap:16px;display:grid}.form-panel{padding-bottom:22px;position:sticky;top:22px}.form-panel .stack-form{padding-inline:22px}.employee-row,.money-row,.task-row{border-bottom:1px solid #eeeae1;align-items:center;gap:14px;padding:16px 20px;display:flex}.employee-row:last-child,.money-row:last-child,.task-row:last-child{border:0}.employee-main{flex-direction:column;flex:1;gap:4px;min-width:0;display:flex}.employee-main small,.employee-wage small,.money-row small,.task-row small{color:var(--muted)}.employee-wage{flex-direction:column;align-items:flex-end;display:flex}.money-row>div:first-child,.task-row>div:first-child{flex-direction:column;flex:1;gap:4px;display:flex}.money-row>div:nth-child(2){flex-direction:column;align-items:flex-end;display:flex}.task-row p{color:var(--muted);margin:5px 0 0;font-size:13px}.task-row.done{opacity:.58}.task-row.done strong{text-decoration:line-through}.attendance-panel{overflow-x:auto}.attendance-head,.attendance-row{grid-template-columns:1.1fr 2fr 70px;align-items:center;gap:18px;min-width:920px;padding:13px 20px;display:grid}.attendance-head{color:var(--muted);text-transform:uppercase;background:#efede6;font-size:11px;font-weight:800}.attendance-row{border-top:1px solid #eeeae1}.person-cell{align-items:center;gap:12px;display:flex}.person-cell p{flex-direction:column;gap:3px;margin:0;display:flex}.person-cell small{color:var(--muted)}.attendance-fields{grid-template-columns:1.2fr 1fr 1fr .7fr;gap:7px;display:grid}.attendance-fields input,.attendance-fields select{margin:0;padding:9px;font-size:12px}.settings-card{max-width:680px;padding:24px}.settings-card>div{border-bottom:1px solid #ece8df;justify-content:space-between;gap:20px;padding:17px 0;display:flex}.settings-card small{color:var(--muted)}.settings-card form{margin-top:24px}.capitalize{text-transform:capitalize}.payroll-stats{grid-template-columns:repeat(3,1fr);gap:12px;margin-bottom:16px;display:grid}.payroll-stats article{background:var(--paper);border:1px solid var(--line);border-radius:15px;flex-direction:column;justify-content:center;gap:8px;min-height:122px;padding:20px;display:flex}.payroll-stats span,.payroll-stats small{color:var(--muted)}.payroll-stats span{font-size:13px;font-weight:750}.payroll-stats strong{letter-spacing:-1px;font-size:28px}.payroll-stats small{font-size:12px}.payroll-layout{grid-template-columns:minmax(0,1.55fr) minmax(350px,.85fr)}.pay-run-row{border-bottom:1px solid #eeeae1;grid-template-columns:minmax(0,1fr) auto;gap:14px 24px;padding:19px 22px;display:grid}.pay-run-row:last-child{border-bottom:0}.pay-run-main{min-width:0}.pay-run-title{align-items:center;gap:9px;display:flex}.pay-run-title strong{font-size:16px}.pay-run-main>small{color:var(--muted);margin-top:5px;font-size:12px;display:block}.pay-breakdown{color:var(--muted);flex-wrap:wrap;gap:7px 14px;margin-top:12px;font-size:12px;display:flex}.pay-run-total{flex-direction:column;justify-content:center;align-items:flex-end;display:flex}.pay-run-total small{color:var(--muted)}.pay-run-total strong{margin-top:3px;font-size:20px}.pay-run-actions{grid-column:1/-1;justify-content:flex-end;gap:8px;display:flex}.pay-run-actions form{margin:0}.calculation-box{color:#604b21;background:#f6ead0;border:1px solid #ead7ae;border-radius:10px;flex-direction:column;gap:5px;padding:14px;display:flex}.calculation-box span{color:#776542;font-size:12px;line-height:1.5}.pay-record-toolbar{justify-content:space-between;align-items:center;margin-bottom:18px;display:flex}.pay-record-toolbar>a{color:var(--green);font-weight:750}.pay-record{border:1px solid var(--line);background:#fff;border-radius:18px;max-width:920px;margin-inline:auto;padding:clamp(28px,5vw,58px);box-shadow:0 24px 60px #17352f12}.pay-record>header{border-bottom:2px solid var(--forest);justify-content:space-between;align-items:flex-start;padding-bottom:28px;display:flex}.pay-record>header>div:last-child{flex-direction:column;align-items:flex-end;gap:4px;display:flex}.pay-record small{color:var(--muted);letter-spacing:.7px;font-size:11px}.pay-record-heading{justify-content:space-between;align-items:flex-end;gap:24px;padding:28px 0;display:flex}.pay-record-heading h1{letter-spacing:-1.5px;margin:7px 0 0;font-size:34px}.pay-record-heading>div:last-child{text-align:right}.pay-record-person{background:#f2f0e9;border-radius:12px;grid-template-columns:1.15fr 1fr 1fr;gap:18px;padding:20px;display:grid}.pay-record-person div{flex-direction:column;gap:6px;display:flex}.pay-record-person span{color:var(--muted);font-size:13px}.pay-record-lines{border-top:1px solid var(--line);margin-top:28px}.pay-record-lines>div{border-bottom:1px solid #ece9e1;justify-content:space-between;align-items:center;gap:25px;min-height:54px;padding:10px 4px;display:flex}.pay-record-lines span{color:var(--muted)}.pay-record-lines .negative{color:var(--red)}.pay-record-lines .pay-record-net{color:#fff;background:var(--forest);border:0;border-radius:12px;min-height:76px;margin-top:12px;padding:16px 20px}.pay-record-net span{color:#c7d9d4;font-weight:750}.pay-record-net strong{font-size:29px}.pay-record-meta{grid-template-columns:repeat(3,1fr);gap:12px;margin-top:28px;display:grid}.pay-record-meta>div{border:1px solid var(--line);border-radius:10px;flex-direction:column;gap:6px;padding:14px;display:flex}.pay-record-meta strong{text-transform:capitalize;font-size:13px;line-height:1.45}.pay-record-note{background:#f6f4ee;border-radius:10px;margin-top:24px;padding:16px 18px}.pay-record-note p{margin:7px 0 0;line-height:1.55}.pay-record footer{color:var(--muted);border-top:1px solid var(--line);margin-top:28px;padding-top:18px;font-size:11px}@media (max-width:1050px){.stats-grid{grid-template-columns:repeat(2,1fr)}.two-column{grid-template-columns:1fr}.form-panel{position:static}.payroll-layout{grid-template-columns:1fr}}@media (max-width:760px){.container{width:min(100% - 28px,600px)}.landing-nav{height:72px}.hero{grid-template-columns:1fr;gap:50px;min-height:auto;padding-block:70px}.hero h1{letter-spacing:-3px;font-size:50px}.hero-actions{flex-direction:column;align-items:flex-start}.hero-board{padding:18px;transform:none}.preview-grid{grid-template-columns:1fr 1fr 1fr}.preview-grid div{padding:12px 9px}.preview-grid small{font-size:10px}.trust-grid{grid-template-columns:1fr;gap:24px}.auth-page{grid-template-columns:1fr}.auth-panel{min-height:330px;padding:28px}.auth-copy h1{font-size:42px}.auth-points{display:none}.auth-form-wrap{align-items:start;margin-top:-26px}.app-frame{display:block}.sidebar{display:none}.mobile-header{background:var(--paper);border-bottom:1px solid var(--line);z-index:4;justify-content:space-between;align-items:center;height:68px;padding:0 16px;display:flex;position:sticky;top:0}.mobile-header>span{text-overflow:ellipsis;white-space:nowrap;max-width:130px;color:var(--muted);font-size:12px;overflow:hidden}.mobile-header .logo>span{width:32px;height:32px}.mobile-header .logo{font-size:17px}.mobile-nav{z-index:5;background:var(--paper);border-top:1px solid var(--line);grid-template-columns:repeat(6,1fr);height:68px;padding:7px 4px;display:grid;position:fixed;bottom:0;left:0;right:0}.mobile-nav a{color:var(--muted);flex-direction:column;justify-content:center;align-items:center;gap:3px;font-size:8px;display:flex}.mobile-nav b{color:var(--forest);font-size:15px}.page-content{width:calc(100% - 28px);padding:28px 0 95px}.page-header{flex-direction:column;align-items:flex-start;margin-bottom:24px}.page-header h1{font-size:34px}.page-header .button{width:100%}.stats-grid{grid-template-columns:1fr 1fr;gap:9px}.stat-card{min-height:145px;padding:16px}.stat-card>strong{font-size:28px}.stat-card>small{font-size:10px}.dashboard-grid{grid-template-columns:1fr;gap:9px}.form-grid{grid-template-columns:1fr}.employee-row,.money-row{flex-wrap:wrap;align-items:flex-start}.employee-wage{order:4;align-items:flex-start;padding-left:56px}.employee-row .pill{margin-left:auto}.money-row>div:nth-child(2){align-items:flex-start}.money-row .pill{margin-left:auto}.onboarding-page{padding:16px}.onboarding-card{padding:28px 22px}.payroll-stats{grid-template-columns:1fr;gap:8px}.payroll-stats article{min-height:102px}.pay-run-row{grid-template-columns:1fr}.pay-run-total{align-items:flex-start}.pay-run-actions{justify-content:stretch}.pay-run-actions .button,.pay-run-actions form{flex:1}.pay-run-actions form .button{width:100%}.pay-record{border-radius:12px;padding:25px 18px}.pay-record-heading{flex-direction:column;align-items:flex-start}.pay-record-heading>div:last-child{text-align:left}.pay-record-person,.pay-record-meta{grid-template-columns:1fr}.pay-record>header .logo strong{display:none}}@media print{@page{size:A4;margin:16mm}html,body{background:#fff}.sidebar,.mobile-header,.mobile-nav,.print-hide{display:none!important}.app-frame{display:block}.page-content.pay-record-page{width:100%;padding:0}.pay-record{max-width:none;box-shadow:none;border:0;border-radius:0;padding:0}}
