/* Navy navigation and white work surfaces. Layout and permission controls are retained. */
:root{--blue:var(--product-blue);--blue-dark:var(--product-blue-hover);--ink:var(--product-ink);--muted:var(--product-muted);--line:var(--product-line);--bg:var(--product-bg);--paper:var(--product-paper);--radius:10px}
body{background:var(--bg);letter-spacing:.1px}h1{font-size:27px;letter-spacing:-.4px;font-weight:700}h2{font-size:17px}
input,select,textarea{border-color:#d8e0eb;border-radius:7px;background:#fff;color:var(--ink)}input::placeholder,textarea::placeholder{color:#7b899c}input:focus,select:focus,textarea:focus{border-color:var(--blue);box-shadow:0 0 0 3px #2864f612}input:-webkit-autofill{-webkit-box-shadow:0 0 0 1000px #fff inset;-webkit-text-fill-color:var(--ink)}
.primary{background:var(--blue);border-color:var(--blue);color:#fff;box-shadow:0 3px 8px #2864f61c}.primary:hover{background:var(--blue-dark);border-color:var(--blue-dark);color:#fff}.button{background:#fff;border-color:#d8e0eb;color:#42536b}.button:hover{background:var(--product-blue-soft);border-color:#a6bff8;color:var(--blue)}.danger{background:#fff2f3;border-color:#f0ced3;color:#b83647}.danger:hover{background:#ffe5e9}a,.text-button{color:#245bd3}.text-button:hover,a:hover{color:#1741a5}.text-button.red,.red{color:var(--product-danger)}.green{color:var(--product-success)}.amber{color:var(--product-warning)}
.brandmark{background:var(--blue);border-radius:9px;color:#fff;width:36px;height:36px;box-shadow:0 4px 12px #0002}.sidebar{width:218px;background:var(--product-navy);border:0;color:#f3f7ff;padding:26px 16px 18px;z-index:10}.brand{font-size:15px;gap:10px;letter-spacing:.2px}.brand small{color:#9bacbf;margin-top:4px;font-size:10px}.sidebar nav{gap:6px;margin-top:35px}.nav-button{display:flex;align-items:center;gap:11px;color:#b3c3d6;border-radius:6px;padding:12px 13px;font-size:13px;border:1px solid transparent}.nav-button:hover{background:var(--product-navy-hover);color:#fff}.nav-button.active{background:var(--blue);color:#fff;box-shadow:0 4px 14px #0002;font-weight:600}.nav-button i{display:inline-flex;width:18px;flex:none;font-style:normal}.ui-icon{width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.nav-button span{margin-left:auto;float:none;background:#ffeff0;color:#bc3f51;padding:0 6px;font-size:10px}.nav-caption{color:#8297af;font-size:10px;letter-spacing:1.8px;margin:31px 13px 10px}.sidebar>.inline-info{color:#91a7bf;font-size:11px;line-height:1.9}.team-badge{border-top-color:#294057;padding:17px 10px 3px}.team-badge strong{font-size:13px;color:#e8f0fa}.team-badge small{color:#90a5bc;font-size:10px}
.workspace{margin-left:218px}.topbar{height:64px;background:#fff;border-color:var(--line);padding:0 30px}.topbar>.muted{font-size:13px;color:#445773;font-weight:600;height:100%;display:flex;align-items:center;border-bottom:3px solid var(--blue);padding-top:3px}.topbar .account{gap:12px}.topbar .account>strong{font-size:13px}.topbar .text-button{font-size:12px}.avatar{background:#edf3ff;color:var(--blue);font-size:12px}.role{background:#f7f9fc;color:#687d98;border-color:#e0e7f1}.workspace main{max-width:2000px;padding:27px 30px 24px}.page-head{margin-bottom:24px}.page-head p{font-size:12px;color:var(--muted);margin-top:7px;line-height:1.6}.section-kicker{display:block;font-size:10px;letter-spacing:1.5px;color:#7389a5;margin-bottom:6px}.head-actions{align-items:center}.head-actions .button,.head-actions .primary{min-height:37px;font-size:12px;padding:8px 14px}
.metrics{gap:16px;margin-bottom:22px}.metric{position:relative;background:#fff;border:1px solid var(--line);padding:20px 20px 18px 76px;min-height:118px;box-shadow:var(--product-shadow)}.metric p{font-size:12px;color:#5e718b}.metric strong{font-size:32px;line-height:1.25;color:#23344d;margin:6px 0 4px;font-weight:650;font-variant-numeric:tabular-nums;letter-spacing:-.7px}.metric small{display:block;font-size:10px;color:#7a8ba0;line-height:1.5}.metric-icon{position:absolute;top:23px;left:19px;width:42px;height:42px;border-radius:12px;display:grid;place-items:center;color:var(--blue);background:#edf3ff}.metric-icon .ui-icon{width:22px;height:22px;stroke-width:1.9}.metric:nth-child(2) .metric-icon{background:#eaf8f1;color:#16996a}.metric:nth-child(3) .metric-icon{background:#f1edff;color:#8260db}.metric:nth-child(4) .metric-icon{background:#fff3e3;color:#dc921d}.metric.warn{background:#fff;border-color:var(--line)}.metric.warn .metric-icon{background:#fff3e3;color:#d89120}.metric.warn strong{color:#aa6b16}
.panel{background:#fff;border:1px solid var(--line);box-shadow:var(--product-shadow)}.panel-head{border-color:var(--line);padding:20px 23px}.panel-head h2{font-size:16px}.panel-head p{color:var(--muted)}.panel-body{padding:24px}.panel-head .text-button{font-size:12px}.toolbar{border-color:var(--line)}.toolbar select{max-width:230px}.badge{background:#eef2f7;color:#68798f;font-weight:500;white-space:nowrap;padding:3px 8px;font-size:10px;line-height:1.5;letter-spacing:0}.badge.active{background:#e8f7ef;color:#16845b}.badge.pending,.badge.invited,.badge.deletion_pending{background:#fff3dc;color:#a16a0d}.badge.disabled,.badge.rejected{background:#fff0f2;color:#ba4859}.badge.deleted{background:#edf0f5;color:#707e91}.badge.readonly{background:#edf3ff;color:#2864d7}
.people-board{min-width:0}.board-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.board-heading h2{font-size:16px;font-weight:600}.board-heading h2 span{color:#677f9f;font-size:11px;margin-left:8px;background:#e8edf5;border-radius:5px;padding:2px 8px}.board-heading .text-button{font-size:12px}.people-toolbar{padding:0 0 17px;border:0;gap:12px}.search-field{position:relative;flex:0 1 300px}.search-field>span{position:absolute;left:12px;top:6px;font-size:22px;color:#7b8da7;pointer-events:none}.search-field input{padding:9px 12px 9px 37px;font-size:12px;max-width:none;height:39px}.people-toolbar #employeeStatus{width:228px;max-width:228px;height:39px;font-size:12px;padding:8px 10px}.result-count{margin-left:auto;color:#6c7e96;font-size:11px;white-space:nowrap}
.employee-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:13px}.employee-card{min-width:0;background:#fff;border:1px solid var(--line);border-radius:10px;overflow:hidden;box-shadow:var(--product-shadow);transition:border-color .16s,box-shadow .16s}.employee-card:hover,.employee-card:focus-within{border-color:#a8c0f9;box-shadow:0 5px 20px #2864f610}.employee-card.has-attention{border-top-color:#e9bc68}.employee-card.state-disabled,.employee-card.state-rejected,.employee-card.state-deleted{background:#fafbfc}.employee-card.state-deletion_pending{border-color:#eed5a7}.card-main{display:block;width:100%;text-align:left;border:0;border-radius:10px 10px 0 0;background:transparent;color:inherit;padding:15px 14px 11px}.card-main:hover{background:#f9fbff}.card-identity{display:flex;gap:9px;align-items:center;min-width:0;height:33px}.person-avatar{display:grid;place-items:center;flex-shrink:0;width:32px;height:32px;background:#eaf1ff;color:#3262b5;border:1px solid #e2eaff;border-radius:8px;font-size:13px}.employee-card:nth-child(4n+2) .person-avatar{background:#e9f7f3;color:#328677;border-color:#ddf0e9}.employee-card:nth-child(4n+3) .person-avatar{background:#f1edfb;color:#8462bc;border-color:#e9e2f5}.employee-card:nth-child(4n) .person-avatar{background:#fff3e6;color:#b68a47;border-color:#f5e9d7}.card-person{min-width:0;flex:1}.card-person h3{font-size:14px;line-height:1.5;color:#293b55;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:600}.card-person>span{display:block;color:#7b8ca4;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-size:10px;line-height:1.3}.card-identity .badge{flex-shrink:0;font-size:10px;padding:3px 6px}
.card-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:7px;padding:16px 0 0}.card-stats>div{min-width:0}.card-stats strong{display:block;font-size:23px;line-height:1.2;font-weight:600;font-variant-numeric:tabular-nums;letter-spacing:-.6px}.card-stats span{display:block;font-size:11px;color:#7b8ba1;margin-top:5px;white-space:nowrap;letter-spacing:0}.card-foot{display:flex;align-items:center;justify-content:space-between;gap:5px;border-top:1px solid #edf0f6;margin:0 14px;padding:7px 0 8px;min-height:32px;color:#7c8ca2;font-size:11px}.card-foot>span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.card-more{height:24px;min-width:30px;padding:0 5px;line-height:18px;background:#f4f7fc;color:#6480a4;border:1px solid #e4eaf4;border-radius:5px;font-size:18px;letter-spacing:1px}.card-more:hover{background:#e9f0ff;color:var(--blue)}.deletion-countdown{color:#a76d14!important}.board-note{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;color:#7b8ca2;font-size:10px;margin-top:17px;padding-top:13px;border-top:1px solid var(--line)}.overview-links{display:flex;gap:22px;align-items:center;justify-content:flex-end;margin-top:16px}.overview-links a,.overview-links button{font-size:11px}.empty{color:#7c8ca3}.empty h3{color:#4a607e}.employee-empty{border:1px dashed #cad7eb;border-radius:10px;background:#fff;padding:65px 20px}.empty-symbol{display:block;font-size:36px;color:#7e9dcb;margin-bottom:12px}.employee-empty p{font-size:12px;margin-top:7px}
.invitation-panel{max-width:850px}.invitation{background:#f5f8ff;border-color:#bbcdf0}.invitation input{background:#fff;color:#3e5d89;border-color:#d8e2f2}.steps{color:#788da9}.steps b{color:#355b91}.link-row,.activity{border-color:var(--line)}.link-row small{margin-top:4px}.footnote{border-color:var(--line);color:#798aa2}.activity strong{color:#344d70}.activity small{color:#7b8ea6}.access-map p{color:#6d7f97;font-size:12px;line-height:1.9}.access-map h2{font-size:16px}.access-map>div+div{border-left:1px solid var(--line);padding-left:26px}.eyebrow{color:#6584af}.notice{background:#193756;color:#fff;border:1px solid #335879;box-shadow:0 8px 32px #18395722}.error{color:#bd3e50}table{color:#344761}th{background:#f7f9fc;color:#73859d}td{border-color:#edf1f6}tbody tr:hover{background:#f8faff}.pagination{border-color:var(--line)}
dialog{background:#fff;border-color:#dce4f0;box-shadow:0 25px 100px #081d3230;color:var(--ink)}dialog::backdrop{background:#081d3270;backdrop-filter:blur(3px)}.dialog-head{border-color:var(--line)}.dialog-head h2{font-size:17px}.icon-button{color:#7a8ea8}.icon-button:hover{background:#edf3ff;border-radius:6px;color:var(--blue)}.review-person{background:#f4f7fc;border:1px solid #e3eaf4}.inline-info{color:#6f829c}.delete-notice{border-color:#edd6a7;background:#fff8e9;color:#976c23}.delete-notice p{font-size:12px;margin-top:6px}.checks input{accent-color:var(--blue)}.status-card{background:#fff;border-color:var(--line)}.status-card .note{background:#f4f7fc}.status-icon{background:#fff2d7;color:#b58227}.transport-note{background:#fff5df;border-color:#ecd7ad;color:#8e661b}#actionForm>footer{display:flex;gap:10px;justify-content:flex-end;padding:18px 24px;border-top:1px solid var(--line);background:#f8faff}
.employee-drawer{position:fixed;inset:0 0 0 auto;margin:0;width:480px;max-width:100vw;height:100dvh;max-height:100dvh;border-radius:0;border-width:0 0 0 1px;overflow:auto;background:#fff}.drawer-header{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:15px;padding:22px 25px;background:#fff;border-bottom:1px solid var(--line)}.drawer-header h2{font-size:22px;overflow-wrap:anywhere}.drawer-header .section-kicker{margin-bottom:5px}#employeeDrawerBody{padding:24px 25px}.drawer-person{display:flex;align-items:center;gap:13px}.drawer-person .person-avatar{width:44px;height:44px;font-size:18px}.drawer-person>div{min-width:0;flex:1;overflow-wrap:anywhere}.drawer-person small{display:block;margin-top:3px;color:#7a8ea7;font-size:11px}.drawer-person .badge{font-size:11px}.employee-drawer .card-stats{padding:22px 0;border-bottom:1px solid var(--line);margin-bottom:20px}.employee-drawer .card-stats strong{font-size:29px}.drawer-meta{display:flex;justify-content:space-between;gap:15px;font-size:12px;padding:6px 0 20px;color:#788ca5}.drawer-meta strong{color:#405978;font-weight:400}.drawer-section{border-top:1px solid var(--line);padding:20px 0}.drawer-section h3{font-size:13px;font-weight:600;margin-bottom:13px;color:#3b5270}.permission-list{display:flex;gap:8px;flex-wrap:wrap}.permission-chip{font-size:11px;background:#f6f8fb;color:#8290a5;border:1px solid #e4eaf2;border-radius:5px;padding:5px 9px}.permission-chip.granted{background:#edf4ff;color:#3268c6;border-color:#d4e3ff}.drawer-actions{display:flex;gap:9px;flex-wrap:wrap}.drawer-actions button{font-size:11px;min-height:33px;padding:7px 12px}.drawer-section-head{display:flex;justify-content:space-between;gap:12px}.drawer-section-head a{font-size:12px}.employee-drawer .empty{padding:25px 0}.employee-drawer .empty p{font-size:12px;margin-top:8px}
.customer-workspace-button{display:flex;align-items:center;justify-content:space-between;gap:18px;width:100%;padding:20px;border:1px solid #d3e1ff;border-radius:9px;background:#f0f5ff;color:#255bc9!important;text-decoration:none}.customer-workspace-button:hover{background:#e6efff;border-color:#a9c4ff;text-decoration:none}.customer-workspace-button strong,.customer-workspace-button small{display:block}.customer-workspace-button strong{font-size:16px}.customer-workspace-button small{font-size:12px;line-height:1.6;color:#728bab;margin-top:7px}.customer-workspace-button>span:last-child{font-size:25px}
.admin-security-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;max-width:1100px;align-items:start}.admin-security-grid .panel{margin:0}.admin-security-grid .auth-form{max-width:480px}.admin-security-grid .inline-info{line-height:1.8;margin:14px 0}.recovery-code-count{display:flex;align-items:baseline;gap:12px;margin:0 0 24px}.recovery-code-count strong{font-size:56px;line-height:1;color:var(--blue);font-weight:400}.recovery-code-count span{color:#7b8ea7}.security-reminder{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:16px 20px;margin-bottom:24px;background:#edf4ff;border:1px solid #cddfff;border-radius:10px;color:#3d659b}.security-reminder .button{flex-shrink:0}.server-recovery-help{margin-top:26px;border:1px solid var(--line);border-radius:10px;padding:16px 20px;max-width:1100px;color:#73849d;font-size:13px;line-height:1.8;background:#fff}.server-recovery-help summary{cursor:pointer;color:#47648c;font-weight:500}.server-recovery-help ol{padding-left:22px}.server-recovery-help pre{white-space:pre-wrap;overflow-wrap:anywhere;background:#f3f6fb;padding:14px;border-radius:6px;color:#46628a;font-size:12px}.recovery-code-list{min-height:240px!important;font:14px/1.8 Consolas,monospace!important;white-space:pre;resize:vertical;margin:16px 0}.recovery-codes-dialog .dialog-footer{display:none}.recovery-codes-dialog .head-actions{flex-wrap:wrap}
.auth-shell{background:#f8faff;grid-template-columns:1.1fr 1fr}.auth-aside{background:var(--product-navy);padding:50px 60px;color:#fff}.auth-aside .brand{font-size:18px}.auth-copy{max-width:480px}.auth-copy h1{color:#f2f6ff;font-weight:650;letter-spacing:-1px;font-size:40px}.auth-copy p{color:#9eb3cf;font-size:14px}.auth-copy .eyebrow{color:#7fa8e8}.flow-card{background:#ffffff06;border-color:#314c6c;box-shadow:none}.flow-dot{background:#234577;color:#b4d3ff}.flow-row{color:#e0eaff}.flow-row small{color:#97acc9}.auth-main{background:#f8faff;margin:0;max-width:none}.auth-card{max-width:400px}.auth-card h2{color:#243754;letter-spacing:-.5px;font-size:28px}.auth-card>p{color:#7a8ca6;line-height:1.8}.auth-help{color:#7a8ca6;line-height:1.9}.auth-foot{color:#879fbe}.auth-form label{color:#4c6282;font-weight:500}.auth-form input{background:#fff;border-color:#d8e2f0;padding:12px 14px}.auth-form .primary{height:46px}.auth-aside .brand small{color:#8ea6c6}body:has(dialog[open]){overflow:hidden}
.supervisor-shell[data-section="overview"] .metric{min-height:96px;padding:17px 16px 15px 65px}.supervisor-shell[data-section="overview"] .metric-icon{left:16px;top:20px;width:36px;height:36px;border-radius:10px}.supervisor-shell[data-section="overview"] .metric strong{font-size:28px;margin:3px 0}.supervisor-shell[data-section="overview"] .metric small{font-size:10px}
.supervisor-shell[data-section="overview"] .metric{display:grid;grid-template-columns:1fr auto;grid-template-rows:auto auto;column-gap:9px;row-gap:3px;min-height:82px}.supervisor-shell[data-section="overview"] .metric p{grid-column:1;grid-row:1}.supervisor-shell[data-section="overview"] .metric small{grid-column:1;grid-row:2}.supervisor-shell[data-section="overview"] .metric strong{grid-column:2;grid-row:1/3;align-self:center;margin:0}
@media(min-width:1440px) and (max-height:950px){.workspace main{padding:20px 25px 16px}.page-head{margin-bottom:16px}.page-head h1{font-size:25px}.metrics{margin-bottom:16px}.employee-grid{gap:11px}.card-main{padding:12px 12px 9px}.card-foot{margin:0 12px;padding:6px 0}.people-toolbar{padding-bottom:13px}.overview-links{margin-top:10px}.supervisor-shell[data-section="overview"] .metric{min-height:84px;padding:12px 14px 12px 62px}.supervisor-shell[data-section="overview"] .metric-icon{top:17px;left:15px}.supervisor-shell[data-section="overview"] .card-main{padding:10px 12px 7px}.supervisor-shell[data-section="overview"] .card-identity{height:30px}.supervisor-shell[data-section="overview"] .card-stats{padding-top:8px}.supervisor-shell[data-section="overview"] .card-stats strong{font-size:21px}.supervisor-shell[data-section="overview"] .card-stats span{margin-top:3px}.supervisor-shell[data-section="overview"] .card-foot{padding:3px 0 4px;min-height:28px}.supervisor-shell[data-section="overview"] .employee-grid{gap:10px}}
@media(max-width:1439px){.employee-grid{grid-template-columns:repeat(4,minmax(0,1fr))}.sidebar{width:196px;padding:24px 13px}.workspace{margin-left:196px}.workspace main{padding:23px}.topbar{padding:0 23px}.card-identity{gap:7px}.person-avatar{width:28px;height:28px;font-size:12px}.card-main{padding:13px 12px 10px}.card-foot{margin:0 12px}.card-stats strong{font-size:22px}.metric{padding-left:63px}.metric-icon{left:15px;width:35px;height:35px}}
@media(max-width:1130px){.employee-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.workspace main{padding:20px}.page-head{gap:12px}.page-head .head-actions{flex-shrink:0}.auth-aside{padding:35px}.auth-copy h1{font-size:32px}}
@media(max-height:800px){#employeeDrawer .drawer-header{padding:16px 25px}#employeeDrawerBody{padding:18px 25px}#employeeDrawer .drawer-section{padding:14px 0}#employeeDrawer .drawer-section h3{margin-bottom:10px}#employeeDrawer .drawer-meta{padding-bottom:14px}#employeeDrawer .card-stats{margin:16px 0;padding:0 0 12px}#employeeDrawer .customer-workspace-button{padding:16px}}
@media(max-width:780px){.admin-security-grid{grid-template-columns:1fr}.security-reminder{align-items:flex-start;flex-direction:column}.server-recovery-help{padding:14px}}
@media(max-width:760px){.sidebar{position:static;width:auto;padding:16px 18px}.sidebar>.inline-info{display:none}.sidebar nav{margin-top:16px;gap:5px}.nav-button{font-size:12px;padding:9px 10px;gap:7px}.nav-button i{width:17px}.workspace{margin:0}.workspace main{padding:20px 16px}.topbar{padding:0 18px;height:52px}.page-head{flex-direction:row;align-items:flex-start;flex-wrap:wrap;margin-bottom:18px}.page-head h1{font-size:25px}.page-head .head-actions{gap:7px}.employee-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.people-toolbar{flex-wrap:wrap;gap:9px}.search-field{flex:1 1 100%;max-width:none}.people-toolbar #employeeStatus{flex:1;width:auto;max-width:270px}.metrics{gap:10px}.metric{padding:16px;min-height:110px}.metric-icon{position:static;margin-bottom:10px;width:32px;height:32px}.metric strong{font-size:27px}.supervisor-shell[data-section="overview"] .metric{padding:15px}.card-main{padding:12px 11px 10px}.card-foot{margin:0 11px}.card-identity .badge{font-size:8px;padding:3px 5px}.card-person h3{font-size:13px}.card-stats{gap:4px}.card-stats span{font-size:9px}.board-note{line-height:1.7}.overview-links{gap:14px;flex-wrap:wrap;justify-content:flex-start}.auth-shell{grid-template-columns:1fr}.auth-aside{padding:25px}.auth-main{padding:35px 25px}.access-map>div+div{border:0;padding:0}.employee-drawer{width:450px}}
@media(max-width:500px){.employee-grid{grid-template-columns:1fr}.card-main{padding:15px 16px 12px}.card-person h3{font-size:15px}.card-person>span{font-size:11px}.person-avatar{width:33px;height:33px}.card-identity .badge{font-size:10px;padding:4px 8px}.card-stats strong{font-size:27px}.card-stats span{font-size:11px}.card-foot{margin:0 16px;font-size:11px}.card-identity{gap:10px}.card-more{height:28px;min-width:34px}.page-head .head-actions .button{display:none}#employeeDrawerBody{padding:22px 19px}.drawer-header{padding:18px 19px}.auth-main{padding:30px 22px}}
