:root{font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;color:#19323e;background:#f4f6f8;font-synthesis:none;--ink:#19323e;--muted:#60727c;--line:#dce4e8;--green:#176e55;--lime:#c5f271;--navy:#152f3a}*{box-sizing:border-box}body{margin:0;font-size:16px;line-height:1.5}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}button,input,select,textarea,a{outline-offset:4px}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,a:focus-visible{outline:3px solid #5b9eec}button{transition:background .15s,color .15s}button:active{transform:translateY(1px)}.app-shell{display:grid;grid-template-columns:222px minmax(0,1fr);min-height:100vh}.sidebar{background:var(--navy);color:#fff;padding:32px 20px;display:flex;flex-direction:column;position:sticky;top:0;height:100vh}.brand{display:flex;gap:12px;align-items:center;font-size:24px;font-weight:750;line-height:1.1}.brand-mark{display:flex;align-items:center;justify-content:center;width:43px;height:43px;border-radius:11px;background:var(--lime);font-size:34px;color:var(--navy);letter-spacing:-3px;padding-right:5px}.brand-mark span{font-size:22px;align-self:flex-start;margin-top:5px}.brand-sub{display:block;font-size:9px;letter-spacing:1.8px;font-weight:550;margin-top:7px}.workspace-label{font-size:12px;letter-spacing:1.4px;color:#a0b3bc;margin:58px 12px 15px}.sidebar nav{display:grid;gap:8px}.nav{border:0;background:transparent;color:#c8d7de;text-align:left;padding:13px 12px;border-radius:7px;font-size:14px;display:flex;align-items:center;gap:10px}.nav span{font-size:22px;line-height:1;width:23px}.nav:hover{background:#28434e}.nav.active{color:#fff;background:#304c56;box-shadow:inset 3px 0 var(--lime)}.sidebar-bottom{margin-top:auto;padding:40px 12px 0;font-size:13px;color:#c3d1d7}.sidebar-bottom strong{font-size:14px;color:#e7f0f3}.sidebar-bottom p{line-height:1.6}.small-logo{border:1px solid #5b747e;border-radius:50%;height:36px;width:36px;display:grid;place-items:center;font-size:12px;margin-bottom:14px}.session-note{border-top:1px solid #38515c;padding-top:19px;margin-top:27px;font-size:13px;color:#e3ebef}.session-note span{color:#afc2cb;font-size:12px}.workspace{min-width:0}.topbar{height:75px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 38px;background:white;font-size:14px;font-weight:600;gap:15px}.topbar-right{display:flex;gap:17px;align-items:center}.demo-badge{font-size:12px;color:#5a6b75;border:1px solid var(--line);padding:5px 10px;border-radius:5px;font-weight:500}.text-button{border:0;background:transparent;color:#536b77;font-size:13px;padding:6px 0;text-decoration:underline;text-underline-offset:3px}main{max-width:1640px;margin:auto;padding:34px 38px 30px}h1{font-size:30px;letter-spacing:-1px;margin:0 0 5px;font-weight:700}h2{font-size:18px;letter-spacing:-.3px;margin:0}h3{font-size:16px;margin:0}p{margin:6px 0 0}.muted{color:var(--muted)}.page-head{display:flex;justify-content:space-between;gap:20px;align-items:center;margin-bottom:28px}.page-head p{font-size:14px;color:var(--muted)}.period{border:1px solid var(--line);background:white;padding:9px 13px;border-radius:6px;font-size:13px;white-space:nowrap;color:#4b626c}.stats{display:grid;grid-template-columns:1.1fr 1.1fr 1fr;gap:17px;margin-bottom:28px}.stat{background:white;padding:20px 23px;border:1px solid var(--line);border-radius:10px;position:relative}.stat:first-child{background:#e8f2ed;border-color:#d7e7dd}.eyebrow{font-size:12px;letter-spacing:1px;text-transform:uppercase;font-weight:600;color:#587064}.stat strong{display:block;font-size:28px;font-weight:650;letter-spacing:-.8px;margin-top:6px;font-variant-numeric:tabular-nums}.stat small{font-size:12px;color:#5c727e;display:block;margin-top:5px}.stat .tiny{font-size:15px;font-weight:450;color:#6b7b83;letter-spacing:0}.budget-track{height:4px;background:#e6ecef;border-radius:3px;overflow:hidden;margin-top:10px;max-width:210px}.budget-track div{height:100%;background:#24755d}.calculator-layout{display:grid;grid-template-columns:240px minmax(0,1fr);gap:22px;align-items:start}.panel{background:white;border:1px solid var(--line);border-radius:10px;overflow:hidden}.panel-head{padding:20px;display:flex;justify-content:space-between;align-items:center;gap:10px;border-bottom:1px solid var(--line)}.count{font-size:12px;color:#5f7480;background:#f0f4f6;padding:2px 7px;border-radius:5px;margin-left:5px}.plus{width:31px;height:31px;border:1px solid var(--line);background:white;color:var(--ink);border-radius:6px;font-size:21px;line-height:1}.plus:hover{background:#edf5ef}.employee-list{max-height:795px;overflow:auto;padding:7px}.employee{border:0;width:100%;background:white;padding:13px 11px;display:flex;align-items:center;text-align:left;gap:10px;border-radius:6px;position:relative;margin:2px 0}.employee:hover{background:#f5f8fa}.employee.selected{background:#edf4f0;box-shadow:inset 3px 0 #26785b}.avatar{width:34px;height:34px;border-radius:50%;background:#eef2f5;color:#3d5b6b;display:grid;place-items:center;font-size:12px;font-weight:650;flex-shrink:0}.employee.selected .avatar{background:#d6e6dc;color:#236048}.employee strong{font-size:13px;display:block;font-weight:600;line-height:1.4}.employee small{font-size:11px;color:#6c7d86;display:block;margin-top:2px}.employee .employee-text{min-width:0;overflow-wrap:anywhere}.pending-dot{width:6px;height:6px;border-radius:50%;background:#bb7c27;position:absolute;right:8px;top:12px}.employee-head{display:flex;justify-content:space-between;align-items:flex-start;gap:15px;padding:23px 25px 0}.employee-head h2{font-size:23px;letter-spacing:-.5px}.employee-meta{font-size:13px;color:var(--muted);margin-top:3px}.badge{display:inline-block;font-size:12px;font-weight:550;border-radius:5px;padding:4px 9px;white-space:nowrap;background:#e9f4ed;color:#297151}.badge.warn{background:#fff0d9;color:#8a5814}.badge.neutral{background:#eef2f5;color:#647681}.details-form{padding:21px 25px 24px;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:17px 16px}.field{display:flex;flex-direction:column;gap:6px;min-width:0}.field>span,.field>label{font-size:13px;font-weight:550;color:#4a606c}.field input,.field select,.field textarea,.cell-input{width:100%;padding:10px 11px;border:1px solid #cdd9df;border-radius:6px;color:var(--ink);background:#fff;min-width:0;font-size:14px;line-height:1.5}.field input:hover,.cell-input:hover,.field select:hover{border-color:#85a393}.field input:focus,.cell-input:focus,.field select:focus{border-color:#258264}.field small{font-size:12px;color:#6b7e88}.field textarea{min-height:74px;resize:vertical}.field.wide{grid-column:1/-1}.input-affix{position:relative}.input-affix input{padding-left:40px}.input-affix span{position:absolute;left:12px;top:12px;font-size:12px;color:#71828c}.check-field{display:flex;gap:9px;align-items:center;font-size:14px;align-self:end;min-height:43px}.check-field input{accent-color:#267b5c;width:17px;height:17px}.bonus-card{margin:0 25px 24px;padding:23px 25px;background:var(--navy);color:#fff;border-radius:8px;display:grid;grid-template-columns:1.2fr 1fr;gap:15px}.bonus-label{font-size:12px;letter-spacing:1px;text-transform:uppercase;color:#c7d7de}.bonus-amount{font-size:32px;font-weight:600;letter-spacing:-1px;line-height:1.2;margin:9px 0;color:var(--lime);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}.bonus-desc{font-size:12px;color:#b8cdd5}.score-side{border-left:1px solid #42606a;padding-left:25px;display:grid;grid-template-columns:1fr 1fr;gap:10px}.score-side strong{font-size:21px;display:block;font-weight:550;margin-bottom:3px}.score-side span{font-size:12px;color:#b8cbd3}.calculation-detail{grid-column:1/-1;margin-top:6px;border-top:1px solid #42606a;padding-top:13px;color:#c0d2d9;font-size:12px}.section-head{display:flex;align-items:center;justify-content:space-between;padding:23px 25px 16px;gap:15px}.section-head p{font-size:13px;color:var(--muted);margin-top:3px}.kpi-wrap{padding:0 25px 20px}.kpi-table{width:100%;border-collapse:collapse;font-size:13px;table-layout:fixed}.kpi-table th{color:#6a7e88;text-align:left;font-size:11px;letter-spacing:.6px;text-transform:uppercase;font-weight:600;border-bottom:1px solid var(--line);padding:11px 5px}.kpi-table td{padding:17px 5px;border-bottom:1px solid #e8eef1;vertical-align:top}.kpi-table th:first-child,.kpi-table td:first-child{padding-left:0;width:35%}.kpi-table th:last-child,.kpi-table td:last-child{text-align:right;padding-right:0;width:15%}.kpi-title{font-weight:550;font-size:13px;line-height:1.45}.kpi-direction{font-size:11px;color:#71838d;margin-top:5px}.kpi-description{font-size:12px;color:#71838d;font-weight:400;margin-top:5px;line-height:1.5}.cell-input{font-size:13px;padding:8px 7px;min-height:39px}.kpi-unit{font-size:10px;color:#677f8a;margin-top:5px}.kpi-score{font-size:14px;font-weight:600;display:block;margin-top:6px;color:#1a7358}.kpi-score.low{color:#9b631b}.kpi-table tfoot td{font-weight:600;border:0;padding-bottom:0}.helper{padding:15px 25px;border-top:1px solid var(--line);font-size:12px;color:#607681;background:#fafcfd}.helper strong{color:#3c5865}.issue{padding:13px 16px;border:1px solid #eed8ae;background:#fff7e8;border-radius:6px;color:#875411;font-size:13px;margin:0 25px 20px}.issue p:first-child{margin:0}.deduction{border-top:1px solid var(--line);margin:0 25px 22px;padding-top:18px;display:grid;grid-template-columns:1fr 1fr;gap:22px;align-items:start}.net{padding-top:3px;text-align:right}.net span{font-size:12px;color:var(--muted)}.net strong{display:block;font-size:22px;font-weight:600;margin:3px 0}.net small{font-size:11px;color:#6b7e88}.bottom-actions{display:flex;justify-content:flex-end;padding:0 25px 19px}.danger-link{font-size:12px;color:#985045;background:none;border:0;text-decoration:underline;text-underline-offset:3px}.primary,.secondary{padding:10px 17px;border-radius:6px;border:1px solid var(--navy);font-weight:550;font-size:14px;background:var(--navy);color:white;min-height:43px}.primary:hover{background:#2b4d5d}.secondary{background:white;color:var(--ink);border-color:#ccd8de}.secondary:hover{background:#f0f5f4}.section-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.form-panel{padding:25px}.form-panel h2{margin-bottom:5px}.form-panel>p{font-size:14px;color:var(--muted);margin-bottom:23px}.fields-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.settings-submit{display:flex;align-items:center;justify-content:flex-end;gap:15px;margin-top:24px}.bands{width:100%;border-collapse:collapse;font-size:14px;margin:12px 0}.bands th{font-size:12px;text-align:left;color:#687f8a;padding-bottom:9px;font-weight:550}.bands td{padding:6px 8px 6px 0}.bands input{width:100%;min-width:0}.band-remove{background:none;border:0;font-size:20px;color:#9c7169;padding:7px}.settings-note{font-size:13px;margin-top:20px;color:#627782}.role-layout{display:grid;grid-template-columns:250px minmax(0,1fr);gap:23px}.role-list{max-height:840px;overflow:auto;padding:8px}.role-item{display:block;background:white;border:0;padding:13px 12px;text-align:left;width:100%;border-radius:6px;font-size:14px}.role-item.selected{background:#edf4f0;box-shadow:inset 3px 0 #26785b}.role-item small{display:block;font-size:12px;color:#647982;margin-top:3px}.role-kpi{border-top:1px solid var(--line);padding:20px 0 5px;margin-top:22px}.role-kpi-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:15px;color:#6c808a;font-size:12px;text-transform:uppercase;letter-spacing:.7px}.role-kpi .fields-grid{grid-template-columns:2fr 1fr 1fr}.empty{text-align:center;padding:70px 20px;color:#607780}.empty h2{color:var(--ink);margin-bottom:8px}.empty button{margin-top:20px}footer{display:flex;justify-content:space-between;font-size:11px;color:#7c8e97;max-width:1640px;margin:auto;padding:0 38px 26px;gap:20px}dialog{border:1px solid var(--line);border-radius:12px;padding:26px;width:480px;max-width:calc(100vw - 32px);color:var(--ink);box-shadow:0 20px 100px #152f3a30}dialog::backdrop{background:#112e3c60;backdrop-filter:blur(3px)}dialog h2{font-size:23px;margin-bottom:7px}dialog p{font-size:14px;color:var(--muted);margin-bottom:23px}.dialog-actions{display:flex;gap:10px;justify-content:flex-end;margin-top:24px}.error-text{color:#a14133;font-size:13px;margin-top:16px}#toast{position:fixed;bottom:25px;left:50%;transform:translate(-50%,20px);padding:13px 22px;border-radius:8px;background:var(--navy);color:white;font-size:14px;box-shadow:0 6px 28px #0002;opacity:0;pointer-events:none;transition:.2s;max-width:90vw}#toast.show{opacity:1;transform:translate(-50%,0)}.skip{position:fixed;top:-100px;left:10px;z-index:100;background:white;padding:10px}.skip:focus{top:10px}[hidden]{display:none!important}input[aria-invalid=true]{border-color:#b97840;background:#fffaf0}noscript{padding:20px;display:block}.inline-note{font-size:13px;color:var(--muted);margin-top:15px}details{font-size:13px;color:#5c737f;margin-top:18px}summary{cursor:pointer;font-weight:550}details p{line-height:1.7}.section-label{font-size:12px;text-transform:uppercase;letter-spacing:1px;color:#6d808a;margin-bottom:17px}.role-actions{display:flex;justify-content:space-between;align-items:center;gap:12px;margin-top:24px}
@media(min-width:1600px){.calculator-layout{grid-template-columns:275px minmax(0,1fr)}.kpi-title{font-size:14px}.kpi-table th{font-size:12px}.employee strong{font-size:14px}.employee small{font-size:12px}}
@media(max-width:1200px){.app-shell{grid-template-columns:185px minmax(0,1fr)}.sidebar{padding:27px 13px}.nav{font-size:13px;gap:7px;padding:12px 9px}main{padding:28px 24px}.topbar{padding:0 24px}.calculator-layout{grid-template-columns:205px minmax(0,1fr);gap:16px}.employee-head,.details-form,.section-head{padding-left:20px;padding-right:20px}.details-form{grid-template-columns:1fr 1fr}.bonus-card{margin-left:20px;margin-right:20px;padding:20px}.bonus-amount{font-size:28px}.score-side{padding-left:18px}.kpi-wrap{padding-left:20px;padding-right:20px}.kpi-table th:first-child,.kpi-table td:first-child{width:31%}.kpi-table th:last-child,.kpi-table td:last-child{width:14%}.kpi-description{display:none}.stat{padding:17px}.stat strong{font-size:25px}.role-layout{grid-template-columns:220px minmax(0,1fr)}.role-kpi .fields-grid{grid-template-columns:1fr 1fr}.role-kpi .fields-grid .field:first-child{grid-column:1/-1}}
@media(max-width:960px){.app-shell{display:block}.sidebar{height:auto;position:relative;padding:16px 24px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:20px}.brand{font-size:20px}.brand-mark{width:35px;height:35px;font-size:28px}.brand-mark span{font-size:19px}.brand-sub{font-size:8px;letter-spacing:1.3px}.sidebar nav{display:flex;gap:5px}.nav{font-size:13px;white-space:nowrap}.nav span{display:none}.workspace-label,.sidebar-bottom{display:none}.topbar{height:61px}.calculator-layout{grid-template-columns:200px minmax(0,1fr)}h1{font-size:28px}.period{font-size:12px}.stats{gap:12px}.stat strong{font-size:24px}.section-grid{grid-template-columns:1fr}.role-layout{grid-template-columns:210px minmax(0,1fr)}.bonus-card{grid-template-columns:1fr}.score-side{border:0;border-top:1px solid #42606a;padding:14px 0 0}.calculation-detail{margin-top:0}.kpi-table th:first-child,.kpi-table td:first-child{width:30%}.kpi-title{font-size:12px}.kpi-table th{font-size:10px;letter-spacing:0}.cell-input{padding:8px 4px;font-size:12px}}
@media(max-width:700px){.sidebar{display:block;padding:17px 18px 10px}.brand{margin-bottom:18px}.sidebar nav{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:4px}.nav{text-align:center;justify-content:center;font-size:12px;white-space:normal;min-height:43px;padding:8px 5px}.nav.active{box-shadow:inset 0 -2px var(--lime)}.topbar{padding:0 18px;font-size:12px;height:auto;min-height:58px;gap:10px}.topbar-right{gap:10px}.demo-badge{display:none}.text-button{font-size:12px}main{padding:24px 16px}h1{font-size:27px}.page-head{align-items:flex-start;flex-direction:column;gap:12px;margin-bottom:20px}.page-head p{font-size:13px}.period{padding:6px 10px}.stats{grid-template-columns:1fr 1fr;gap:10px;margin-bottom:20px}.stat{padding:16px 14px;border-radius:8px}.stat strong{font-size:23px}.stat:last-child{grid-column:1/-1;display:flex;align-items:center;justify-content:space-between;gap:10px;padding:13px 14px}.stat:last-child strong{font-size:21px;margin:0}.stat:last-child small{margin:0;font-size:11px;text-align:right;max-width:110px}.eyebrow{font-size:10px;letter-spacing:.6px}.stat small{font-size:11px}.calculator-layout{grid-template-columns:1fr;gap:17px}.employee-panel .panel-head{padding:13px 16px}.employee-panel h2{font-size:15px}.employee-list{max-height:none;display:flex;gap:5px;overflow-x:auto;padding:5px 8px 10px}.employee{flex:0 0 165px;padding:9px;gap:8px;align-items:flex-start}.employee strong{font-size:12px}.employee small{font-size:10px}.avatar{width:29px;height:29px;font-size:10px}.employee.selected{box-shadow:inset 0 -2px #26785b}.employee-head{padding:20px 17px 0}.employee-head h2{font-size:22px}.details-form{padding:18px 17px 20px;gap:15px 12px}.field>span,.field>label{font-size:12px}.field input,.field select,.cell-input{font-size:16px;padding:9px;min-height:43px}.field small{font-size:11px}.bonus-card{margin:0 17px 20px;padding:20px;grid-template-columns:1fr}.bonus-amount{font-size:35px}.score-side{grid-template-columns:1fr 1fr}.score-side strong{font-size:22px}.section-head{padding:20px 17px 15px}.section-head h2{font-size:17px}.section-head p{font-size:12px}.kpi-wrap{padding:0 17px 10px}.kpi-table,.kpi-table tbody{display:block}.kpi-table thead{display:none}.kpi-table tr{display:grid;grid-template-columns:1fr 1fr 1fr;gap:12px;border-top:1px solid #e5ebee;padding:16px 0}.kpi-table td{border:0;padding:0!important;width:auto!important}.kpi-table td:first-child{grid-column:1/-1}.kpi-title{font-size:14px}.kpi-direction{font-size:11px}.kpi-description{display:block;font-size:12px}.kpi-table td[data-label]:before{content:attr(data-label);display:block;font-size:11px;color:#607984;margin-bottom:6px}.kpi-table td:last-child{grid-column:1/-1;text-align:left!important;display:flex;align-items:center;justify-content:space-between;background:#f4f7f6;padding:9px 12px!important;border-radius:5px}.kpi-table td:last-child:before{margin:0}.kpi-score{margin:0}.kpi-unit{display:none}.kpi-table tfoot{display:block}.kpi-table tfoot tr{grid-template-columns:1fr 1fr;align-items:center}.kpi-table tfoot td:first-child{grid-column:auto}.kpi-table tfoot td:last-child{grid-column:auto;justify-content:flex-end;background:none;font-size:14px}.deduction{margin:0 17px 20px;gap:14px}.net strong{font-size:20px}.helper{padding:15px 17px}.issue{margin-left:17px;margin-right:17px}.section-grid{gap:18px}.form-panel{padding:20px}.fields-grid{gap:16px 12px}.role-layout{grid-template-columns:1fr}.role-list{display:flex;max-height:unset;overflow:auto;gap:7px}.role-item{flex:0 0 180px;font-size:13px}.role-item small{font-size:11px}.role-kpi .fields-grid{grid-template-columns:1fr 1fr}.role-actions{flex-wrap:wrap}footer{flex-direction:column;padding:0 17px 25px;gap:5px}.settings-submit{flex-wrap:wrap}.settings-submit .primary{width:100%}.bands th{font-size:11px}.bands .cell-input{font-size:16px}.badge{font-size:11px}.input-affix input{padding-left:35px}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;scroll-behavior:auto!important}}

/* Maintain readable controls and labels at all viewport sizes. */
.field>span,.field>label,.check-field{font-size:14px}.field input,.field select,.field textarea{font-size:16px}.employee strong,.role-item,.kpi-title{font-size:14px}.nav{font-size:14px}.kpi-table th{font-size:12px}.cell-input{font-size:14px}.kpi-table td[data-label]:before{font-size:14px}.brand-sub{font-size:10px;letter-spacing:1px}@media(max-width:700px){.cell-input{font-size:16px}.nav{font-size:12px}.employee strong{font-size:14px}.stat:last-child small{max-width:120px}}