:root{--red:#e51b23;--red-dark:#bd1118;--yellow:#ffd100;--ink:#172033;--muted:#667085;--line:#e5e9f0;--canvas:#f5f7fa;--surface:#fff;--sidebar:#171f2f;--green:#16805d;--amber:#ad6d00;--blue:#2970b8;--violet:#6b4baa;--shadow:0 10px 30px rgba(16,24,40,.08)}
*{box-sizing:border-box}html,body{margin:0;min-height:100%;font-family:Inter,Arial,Helvetica,sans-serif;color:var(--ink);background:var(--canvas);-webkit-font-smoothing:antialiased}button,input,select,textarea{font:inherit}button{cursor:pointer}.hidden{display:none!important}.mobile-only{display:none}
.login-view{min-height:100vh;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(390px,.75fr);background:#fff}.login-visual{position:relative;overflow:hidden;display:flex;flex-direction:column;padding:42px 58px;background:linear-gradient(145deg,#141c2b,#222d43);color:#fff}.login-visual:before{content:"";position:absolute;inset:auto -120px -240px auto;width:720px;height:720px;border-radius:50%;background:radial-gradient(circle,rgba(229,27,35,.26),transparent 66%)}.login-visual:after{content:"";position:absolute;right:11%;top:15%;width:290px;height:420px;border:1px solid rgba(255,255,255,.07);border-radius:34px;transform:rotate(13deg);box-shadow:0 0 0 32px rgba(255,255,255,.018),0 0 0 64px rgba(255,255,255,.012)}
.brand-lockup{position:relative;z-index:1;display:flex;align-items:center;gap:0;color:#fff}.brand-lockup.large{transform-origin:left top;transform:scale(1.12)}.brand-mr,.brand-diy{height:36px;display:grid;place-items:center;padding:0 7px;font-size:12px;font-weight:900}.brand-mr{border-radius:7px 0 0 7px;color:var(--red);background:#fff}.brand-diy{border-radius:0 7px 7px 0;color:#111;background:var(--yellow)}.brand-lockup>div{display:grid;gap:2px;margin-left:11px}.brand-lockup b{font-size:16px}.brand-lockup small{text-transform:uppercase;letter-spacing:.11em;font-size:8px;color:#9ba7ba}.login-copy{position:relative;z-index:1;max-width:680px;margin:auto 0}.eyebrow{display:block;margin-bottom:13px;color:#aab5c6;font-size:10px;font-weight:800;letter-spacing:.13em}.eyebrow.red{color:var(--red)}.login-copy h1{margin:0;max-width:650px;font-size:48px;line-height:1.09;letter-spacing:-1.8px}.login-copy p{max-width:570px;margin:22px 0 27px;color:#bec7d4;font-size:15px;line-height:1.7}.login-features{display:flex;flex-wrap:wrap;gap:9px}.login-features span{padding:9px 12px;border:1px solid rgba(255,255,255,.1);border-radius:8px;background:rgba(255,255,255,.045);color:#d9dee6;font-size:10px}.login-card{width:min(420px,calc(100% - 44px));align-self:center;justify-self:center;padding:35px;border:1px solid var(--line);border-radius:16px;background:#fff;box-shadow:0 18px 48px rgba(20,28,43,.09)}.mobile-brand{display:none}.login-card h2{margin:0 0 9px;font-size:25px;letter-spacing:-.5px}.login-card>p{margin:0 0 25px;color:var(--muted);font-size:11px}.login-card label{display:grid;gap:7px;margin-bottom:15px;color:#344054;font-size:10px;font-weight:800}.login-card input,.form-control{width:100%;height:42px;border:1px solid var(--line);border-radius:9px;padding:0 12px;outline:none;color:var(--ink);background:#fbfcfd;font-size:11px}.login-card input:focus,.form-control:focus,textarea:focus{border-color:#e9868b;box-shadow:0 0 0 3px rgba(229,27,35,.08)}.form-error{min-height:18px;margin-top:11px;color:#c9272f;font-size:10px}.security-note{display:block;margin-top:18px;padding-top:16px;border-top:1px solid #edf0f4;color:#8b95a4;text-align:center;font-size:9px}
.btn{min-height:38px;display:inline-flex;align-items:center;justify-content:center;gap:7px;padding:0 14px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#3d485b;font-size:10px;font-weight:800;transition:.18s ease}.btn:hover{border-color:#c5ccd7;background:#fafbfc}.btn.primary{border-color:var(--red);background:var(--red);color:#fff;box-shadow:0 5px 13px rgba(229,27,35,.18)}.btn.primary:hover{background:var(--red-dark);transform:translateY(-1px)}.btn.dark{border-color:#263248;background:#263248;color:#fff}.btn.danger{border-color:#f0b8bb;color:#c2232b;background:#fff7f7}.btn.success{border-color:#228363;background:#228363;color:#fff}.btn.wide{width:100%}.btn:disabled{opacity:.45;pointer-events:none}
.app-shell{min-height:100vh;display:flex}.sidebar{position:fixed;inset:0 auto 0 0;z-index:40;width:248px;display:flex;flex-direction:column;padding:24px 16px 17px;background:var(--sidebar);color:#fff;box-shadow:8px 0 28px rgba(13,18,28,.08)}.sidebar>.brand-lockup{padding:0 8px 23px;border-bottom:1px solid rgba(255,255,255,.09)}.nav-list{display:grid;gap:4px;margin-top:20px}.nav-group{padding:0 12px 7px;color:#7c899d;font-size:9px;font-weight:800;letter-spacing:.12em}.nav-group.spaced{margin-top:15px}.nav-item{width:100%;min-height:42px;display:flex;align-items:center;gap:11px;padding:0 12px;border:0;border-radius:9px;background:transparent;color:#bac3d1;text-align:left;font-size:11px;font-weight:700;transition:.17s}.nav-item:hover{background:rgba(255,255,255,.055);color:#fff}.nav-item.active{background:#242d42;color:#fff;box-shadow:inset 3px 0 var(--red)}.nav-item.active .nav-icon{color:#ff6a70}.nav-icon{width:19px;text-align:center;font-size:17px}.badge{margin-left:auto;min-width:21px;height:19px;display:grid;place-items:center;padding:0 5px;border-radius:999px;background:rgba(229,27,35,.2);color:#ff777c;font-style:normal;font-size:8px}.sidebar-help{margin-top:auto;display:flex;align-items:center;gap:9px;padding:10px;border:1px solid rgba(255,255,255,.08);border-radius:10px;background:rgba(255,255,255,.035);color:#fff;text-align:left}.sidebar-help>span{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:rgba(255,209,0,.1);color:var(--yellow);font-weight:800}.sidebar-help>div{display:grid;gap:3px}.sidebar-help b{font-size:10px}.sidebar-help small{color:#8d99aa;font-size:8px}.sidebar-user{display:flex;align-items:center;gap:9px;margin-top:13px;padding:14px 8px 0;border-top:1px solid rgba(255,255,255,.09)}.avatar,.top-avatar{width:34px;height:34px;display:grid;place-items:center;flex:0 0 auto;border:0;border-radius:9px;background:linear-gradient(135deg,var(--red),#ff666b);color:#fff;font-size:11px;font-weight:900}.sidebar-user>div{display:grid;min-width:0;gap:2px}.sidebar-user b{max-width:135px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:10px}.sidebar-user small{color:#8d99aa;font-size:8px}.sidebar-user>button{margin-left:auto;border:0;background:transparent;color:#8490a2;font-size:18px}.main-area{min-width:0;flex:1;margin-left:248px}.topbar{position:sticky;top:0;z-index:30;height:68px;display:flex;align-items:center;gap:18px;padding:0 29px;border-bottom:1px solid var(--line);background:rgba(255,255,255,.96);backdrop-filter:blur(12px)}.global-search{position:relative;max-width:515px;width:100%;height:39px;display:flex;align-items:center;gap:9px;padding:0 11px;border:1px solid var(--line);border-radius:9px;background:#f8fafc;color:#8a95a5}.global-search input{min-width:0;flex:1;border:0;outline:0;background:transparent;color:#344054;font-size:11px}.global-search kbd{padding:3px 6px;border:1px solid #e0e5eb;border-radius:5px;background:#fff;color:#8590a0;font-size:8px}.search-results{position:absolute;left:0;right:0;top:46px;z-index:70;max-height:400px;overflow:auto;padding:6px;border:1px solid var(--line);border-radius:11px;background:#fff;box-shadow:var(--shadow)}.search-result{width:100%;display:flex;align-items:center;gap:10px;padding:9px;border:0;border-radius:8px;background:#fff;color:var(--ink);text-align:left}.search-result:hover{background:#f8fafc}.search-result .avatar{width:30px;height:30px}.search-result>div{display:grid;gap:3px}.search-result b{font-size:10px}.search-result small{color:#7c8797;font-size:8px}.top-actions{display:flex;align-items:center;gap:9px;margin-left:auto}.environment-pill{height:31px;display:flex;align-items:center;gap:6px;padding:0 9px;border:1px solid #dce7e2;border-radius:999px;background:#f2faf7;color:#30725f;font-size:8px;font-weight:800}.environment-pill i{width:6px;height:6px;border-radius:50%;background:#24a078}.icon-button{width:38px;height:38px;display:grid;place-items:center;border:1px solid var(--line);border-radius:9px;background:#fff;color:#5d697a}.notification-button{position:relative}.notification-button em{position:absolute;right:-3px;top:-4px;min-width:17px;height:17px;display:grid;place-items:center;padding:0 4px;border:2px solid #fff;border-radius:999px;background:var(--red);color:#fff;font-size:7px;font-style:normal}.notification-panel{position:absolute;right:28px;top:61px;width:330px;overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:var(--shadow)}.notification-panel header{height:50px;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid #edf0f4}.notification-panel header b{font-size:11px}.notification-panel header button{border:0;background:transparent;color:#798495;font-size:19px}.notification-entry{width:100%;display:flex;align-items:center;gap:9px;padding:12px 14px;border:0;border-bottom:1px solid #eef1f4;background:#fff;color:var(--ink);text-align:left;font-size:9px}.notification-entry:hover{background:#fafbfc}.notification-empty{padding:30px;color:#8490a1;text-align:center;font-size:9px}
.page-content{max-width:1540px;margin:0 auto;padding:28px 30px 45px;outline:0}.page-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:20px}.page-heading>div:first-child{min-width:0}.page-heading .eyebrow{margin:0 0 7px;color:var(--red);font-size:9px}.page-heading h1{margin:0;color:#172033;font-size:27px;line-height:1.15;letter-spacing:-.55px}.page-heading p{margin:7px 0 0;color:var(--muted);font-size:10px}.heading-actions{display:flex;align-items:center;gap:8px}.panel{overflow:hidden;border:1px solid var(--line);border-radius:12px;background:#fff;box-shadow:0 3px 14px rgba(16,24,40,.03)}.panel-header{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:13px;padding:12px 16px;border-bottom:1px solid #edf0f4}.panel-header h2{margin:0 0 4px;font-size:12px}.panel-header p{margin:0;color:#8791a0;font-size:8px}.policy-alert{min-height:64px;display:flex;align-items:center;gap:12px;margin-top:20px;padding:11px 14px;border:1px solid #f0dd8f;border-radius:11px;background:linear-gradient(90deg,#fffbe8,#fffef8)}.policy-alert>span{width:36px;height:36px;display:grid;place-items:center;border-radius:9px;background:#fff0a5;color:#9e6800}.policy-alert div{min-width:0}.policy-alert b{display:block;margin-bottom:4px;color:#5c481c;font-size:10px}.policy-alert p{margin:0;color:#806c3e;font-size:9px;line-height:1.45}.policy-alert button{margin-left:auto;border:0;background:transparent;color:#8f670a;font-size:9px;font-weight:800;white-space:nowrap}.metric-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-top:16px}.metric-card{min-height:90px;display:flex;align-items:center;gap:11px;padding:14px;border:1px solid var(--line);border-radius:11px;background:#fff;box-shadow:0 2px 10px rgba(16,24,40,.025);text-align:left}.metric-card:hover{border-color:#ccd3dc;box-shadow:0 8px 22px rgba(16,24,40,.06)}.metric-icon{width:39px;height:39px;display:grid;place-items:center;flex:0 0 auto;border-radius:10px;font-size:17px}.metric-icon.red{background:#fff0f1;color:#d52830}.metric-icon.amber{background:#fff5dc;color:#b27300}.metric-icon.green{background:#eaf7f2;color:#16805d}.metric-icon.blue{background:#edf5ff;color:#2970b8}.metric-card>div{display:grid;gap:3px}.metric-card small{color:#7c8796;font-size:8px;font-weight:700}.metric-card b{font-size:19px}.metric-card em{color:#8993a2;font-size:8px;font-style:normal}.dashboard-grid{display:grid;grid-template-columns:minmax(0,1fr) 315px;gap:15px;margin-top:15px;align-items:start}.side-stack{display:grid;gap:15px}.mini-calendar{display:grid;grid-template-columns:repeat(7,minmax(92px,1fr));gap:7px;padding:12px;overflow-x:auto}.mini-day{min-height:174px;display:flex;flex-direction:column;align-items:stretch;padding:9px;border:1px solid #e8ebf0;border-radius:8px;background:#fff;color:var(--ink);text-align:left}.mini-day:hover{border-color:#c7ced7;transform:translateY(-1px)}.mini-day.today{border-color:#ef9ca0;box-shadow:inset 0 3px var(--red)}.mini-day>span{display:flex;justify-content:space-between;color:#7b8696;font-size:8px}.mini-day>span b{color:#253044;font-size:13px}.shift-chip{display:grid;gap:2px;margin-top:10px;padding:8px;border-radius:7px}.shift-chip b{font-size:12px}.shift-chip small{font-size:7px;font-weight:700;opacity:.75}.tone-blue{background:#e9f3ff;color:#175d9b}.tone-violet{background:#f2edff;color:#6842a2}.tone-cyan{background:#e7f8fa;color:#187a85}.tone-amber{background:#fff2ca;color:#986000}.tone-slate{background:#f0f2f5;color:#647084}.tone-green{background:#eaf7f2;color:#167054}.tone-red{background:#fff0f1;color:#b6222a}.mini-day>p{margin:8px 0 0;color:#6f7a8b;font-size:8px;line-height:1.45}.status-pill{align-self:flex-start;margin-top:auto;padding:4px 6px;border-radius:999px;font-size:7px;font-weight:800}.status-approved{background:#eaf7f2;color:#147355}.status-pending{background:#fff3d6;color:#986000}.status-draft{background:#f0f2f5;color:#687386}.status-rejected{background:#fff0f1;color:#b6222a}.task-list{display:grid;padding:5px 0}.task-item{display:flex;align-items:center;gap:9px;padding:11px 14px;border:0;border-bottom:1px solid #eef1f4;background:#fff;color:var(--ink);text-align:left}.task-item:last-child{border-bottom:0}.task-item:hover{background:#fafbfc}.task-item>span{width:31px;height:31px;display:grid;place-items:center;border-radius:8px;background:#fff3d8;color:#a56b00}.task-item div{display:grid;gap:3px}.task-item b{font-size:9px}.task-item small{color:#8590a0;font-size:8px}.task-item>i{margin-left:auto;color:#9aa4b2;font-style:normal}.flow-card{padding:15px}.flow-card h3{margin:0;font-size:11px}.flow-card>p{margin:5px 0 15px;color:#8490a0;font-size:8px}.flow-steps{display:grid}.flow-step{position:relative;min-height:45px;display:flex;gap:9px}.flow-step:not(:last-child):after{content:"";position:absolute;left:11px;top:24px;width:1px;height:25px;background:#e0e4ea}.flow-step>i{width:23px;height:23px;display:grid;place-items:center;flex:0 0 auto;border:1px solid #d9dde5;border-radius:50%;background:#fff;color:#8993a2;font-size:8px;font-style:normal}.flow-step.done>i{border-color:#24a078;background:#24a078;color:#fff}.flow-step.current>i{border-color:var(--red);background:#fff3f3;color:var(--red)}.flow-step span{display:grid;align-content:start;gap:3px}.flow-step b{font-size:9px}.flow-step small{color:#8993a2;font-size:8px}
.toolbar{display:flex;align-items:center;gap:8px;margin-top:18px;padding:12px;border:1px solid var(--line);border-radius:11px;background:#fff}.toolbar-group{display:flex;align-items:center;gap:6px}.toolbar-label{color:#7a8595;font-size:8px;font-weight:800}.toolbar input,.toolbar select,.table-search input{height:35px;border:1px solid var(--line);border-radius:8px;padding:0 9px;outline:none;background:#fafbfc;color:#344054;font-size:9px}.toolbar input[type=date]{width:135px}.toolbar select{min-width:170px}.employee-picker{position:relative;min-width:280px}.employee-picker button{width:100%;height:38px;display:flex;align-items:center;gap:9px;padding:0 9px;border:1px solid var(--line);border-radius:8px;background:#fff;color:var(--ink);text-align:left}.employee-picker button .avatar{width:27px;height:27px}.employee-picker button div{display:grid;gap:2px}.employee-picker button b{font-size:9px}.employee-picker button small{color:#8490a0;font-size:7px}.employee-picker button>i{margin-left:auto;color:#8d97a7;font-style:normal}.picker-popover{position:absolute;top:44px;left:0;z-index:60;width:360px;padding:7px;border:1px solid var(--line);border-radius:10px;background:#fff;box-shadow:var(--shadow)}.picker-popover input{width:100%;height:35px;margin-bottom:5px}.picker-list{max-height:300px;overflow:auto}.cycle-layout{display:grid;grid-template-columns:minmax(0,1fr) 295px;gap:15px;margin-top:15px;align-items:start}.cycle-grid{display:grid;grid-template-columns:repeat(7,minmax(80px,1fr));gap:6px;padding:13px;overflow-x:auto}.cycle-day{min-height:94px;display:grid;gap:7px;padding:8px;border:1px solid #e7ebef;border-radius:8px;background:#fff;color:var(--ink);text-align:left}.cycle-day:hover{border-color:#bdc7d3;box-shadow:0 6px 14px rgba(22,32,51,.07);transform:translateY(-1px)}.cycle-day.today{border-color:#ef9ca0;box-shadow:inset 0 2px var(--red)}.cycle-day>span{display:flex;justify-content:space-between;color:#8791a1;font-size:8px}.cycle-day>span b{color:#253044;font-size:13px}.cycle-day .shift-chip{margin:0;padding:6px}.cycle-day>small{color:#9aa3b0;font-size:7px}.calendar-legend{display:flex;align-items:center;gap:13px;padding:12px 14px;border-top:1px solid #edf0f4;color:#778293;font-size:8px}.calendar-legend span{display:flex;align-items:center;gap:5px}.dot{width:7px;height:7px;border-radius:50%;background:#9ba4b1}.dot.green{background:#2ba27b}.dot.amber{background:#e0a020}.dot.red{background:var(--red)}.rule-list{display:grid;padding:7px 14px 14px}.rule-item{display:flex;gap:9px;padding:10px 0;border-bottom:1px solid #eef1f4}.rule-item:last-child{border:0}.rule-item>span{color:#23906d}.rule-item div{display:grid;gap:3px}.rule-item b{font-size:9px}.rule-item small{color:#8791a1;font-size:8px;line-height:1.45}
.data-panel{margin-top:15px}.data-table-wrap{overflow:auto}.data-table{width:100%;min-width:900px;border-collapse:collapse}.data-table th{height:40px;padding:0 11px;border-bottom:1px solid #e8ebef;background:#fafbfc;color:#788394;text-align:left;font-size:7px;font-weight:900;letter-spacing:.04em;text-transform:uppercase;white-space:nowrap}.data-table td{height:58px;padding:8px 11px;border-bottom:1px solid #eef1f4;color:#3c485b;font-size:9px;vertical-align:middle}.data-table tbody tr:hover{background:#fcfcfd}.data-table input[type=checkbox]{width:14px;height:14px;accent-color:var(--red)}.employee-cell{display:flex;align-items:center;gap:8px;min-width:155px}.employee-cell .avatar{width:28px;height:28px}.employee-cell div{display:grid;gap:3px}.employee-cell b{font-size:9px}.employee-cell small{color:#8590a0;font-size:8px}.code-pill{display:inline-flex;align-items:center;justify-content:center;min-height:24px;padding:0 8px;border-radius:6px;font-size:8px;font-weight:900;white-space:nowrap}.check-tag{display:inline-flex;align-items:center;min-height:22px;padding:0 7px;border-radius:999px;font-size:7px;font-weight:800;white-space:nowrap}.check-pass{background:#eaf7f2;color:#167158}.check-warn{background:#fff3d4;color:#976100}.check-danger{background:#fff0f1;color:#b6222a}.table-search{width:240px;display:flex;align-items:center;gap:6px}.table-search input{width:100%}.row-action{width:28px;height:28px;display:grid;place-items:center;border:1px solid var(--line);border-radius:7px;background:#fff;color:#718093}.empty-state{display:grid;justify-items:center;gap:6px;padding:45px;color:#8893a2}.empty-state>span{font-size:30px;color:#2a9c78}.empty-state h3{margin:0;color:#293548;font-size:13px}.empty-state p{margin:0;font-size:9px}.summary-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-top:18px}.summary-card{min-height:86px;display:grid;align-content:center;gap:4px;padding:14px;border:1px solid var(--line);border-radius:10px;background:#fff}.summary-card small{color:#7f8a9a;font-size:8px;font-weight:700}.summary-card b{font-size:20px}.summary-card span{color:#8c96a5;font-size:8px}.upload-drop{display:grid;justify-items:center;gap:7px;padding:30px;border:1px dashed #cfd6df;border-radius:10px;background:#fafbfc;text-align:center}.upload-drop>span{font-size:28px}.upload-drop b{font-size:11px}.upload-drop p{margin:0;max-width:380px;color:#7c8797;font-size:9px;line-height:1.5}.upload-drop input{max-width:100%;font-size:9px}.upload-actions{display:flex;justify-content:flex-end;gap:8px;margin-top:14px}.filter-tabs{display:flex;gap:5px;overflow:auto}.filter-tabs button{min-height:29px;padding:0 9px;border:1px solid var(--line);border-radius:7px;background:#fff;color:#6c7889;font-size:8px;font-weight:800;white-space:nowrap}.filter-tabs button.active{border-color:#ef9ca0;background:#fff4f4;color:#c71c24}
.report-grid{display:grid;grid-template-columns:1.15fr .85fr;gap:15px;margin-top:15px}.chart-bars{display:grid;gap:12px;padding:18px}.chart-row{display:grid;grid-template-columns:92px 1fr 38px;align-items:center;gap:8px;font-size:8px}.chart-row>span{color:#5d697b}.chart-row>i{height:8px;overflow:hidden;border-radius:999px;background:#edf0f4}.chart-row>i>em{height:100%;display:block;border-radius:inherit;background:linear-gradient(90deg,var(--red),#f0666c)}.chart-row>b{text-align:right}.mix-list{display:grid;gap:9px;padding:18px}.mix-row{display:grid;grid-template-columns:64px 1fr 34px;align-items:center;gap:8px;font-size:8px}.mix-row>i{height:8px;overflow:hidden;border-radius:999px;background:#edf0f4}.mix-row>i>em{height:100%;display:block;border-radius:inherit;background:#4c8fc9}.settings-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:15px;margin-top:18px}.settings-card{padding-bottom:14px}.settings-card>.panel-header{justify-content:flex-start}.settings-icon{width:35px;height:35px;display:grid;place-items:center;flex:0 0 auto;border-radius:9px;background:#fff0f1;color:#cf222a}.settings-body{padding:14px}.settings-body p{margin:0 0 13px;color:#718093;font-size:9px;line-height:1.55}.settings-kv{display:grid;gap:8px}.settings-kv>div{display:flex;justify-content:space-between;padding:9px;border-radius:7px;background:#f7f8fa;font-size:8px}.settings-kv b{font-size:9px}.settings-actions{display:flex;gap:7px;margin-top:13px}.audit-list{display:grid}.audit-entry{display:grid;grid-template-columns:145px 165px 1fr 145px;gap:10px;padding:11px 14px;border-bottom:1px solid #eef1f4;font-size:8px}.audit-entry b{font-size:8px}.audit-entry span{color:#748092}
.drawer-layer,.modal-layer{position:fixed;inset:0;z-index:100}.drawer-backdrop,.modal-backdrop{position:absolute;inset:0;width:100%;border:0;background:rgba(20,27,40,.44);backdrop-filter:blur(2px)}.drawer{position:absolute;inset:0 0 0 auto;width:min(475px,100%);display:flex;flex-direction:column;background:#fff;box-shadow:-18px 0 60px rgba(11,18,32,.2);animation:slideIn .22s ease both}.drawer-header{min-height:80px;display:flex;align-items:center;justify-content:space-between;padding:0 21px;border-bottom:1px solid var(--line)}.drawer-header .eyebrow{margin:0 0 5px;color:var(--red);font-size:8px}.drawer-header h2{margin:0;font-size:18px}.drawer-close,.modal-close{width:34px;height:34px;display:grid;place-items:center;border:1px solid var(--line);border-radius:8px;background:#fff;color:#657184;font-size:18px}.drawer-body{flex:1;overflow:auto;padding:20px 21px}.drawer-footer{min-height:68px;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:0 21px;border-top:1px solid var(--line)}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px}.form-field{display:grid;gap:7px;margin-bottom:13px}.form-field.full{grid-column:1/-1}.form-field label{color:#414d5f;font-size:9px;font-weight:800}.form-field label em{color:var(--red);font-style:normal}.form-field textarea{min-height:85px;resize:vertical;padding:10px;border:1px solid var(--line);border-radius:8px;outline:0;background:#fbfcfd;color:#344054;font-size:10px}.readonly-banner,.warning-banner{display:flex;gap:9px;margin-bottom:15px;padding:10px;border-radius:8px;font-size:8px;line-height:1.5}.readonly-banner{background:#eef5ff;color:#31699e}.warning-banner{border:1px solid #f1d68c;background:#fff9e8;color:#8d6209}.audit-hint{display:flex;gap:8px;margin-top:12px;padding:10px;border-radius:8px;background:#f4f6f8;color:#687486;font-size:8px;line-height:1.45}.modal{position:relative;z-index:1;width:min(620px,calc(100% - 30px));max-height:calc(100vh - 50px);overflow:auto;margin:25px auto;border-radius:14px;background:#fff;box-shadow:0 25px 70px rgba(10,18,32,.25)}.modal-header{min-height:67px;display:flex;align-items:center;justify-content:space-between;padding:0 18px;border-bottom:1px solid var(--line)}.modal-header h2{margin:0;font-size:16px}.modal-body{padding:18px}.modal-footer{min-height:64px;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:0 18px;border-top:1px solid var(--line)}.help-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}.help-grid article{padding:12px;border:1px solid var(--line);border-radius:9px}.help-grid h3{margin:0 0 6px;font-size:10px}.help-grid p{margin:0;color:#748092;font-size:8px;line-height:1.55}.toast{position:fixed;z-index:140;left:50%;bottom:24px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:11px 15px;border-radius:9px;background:#1b2b3c;color:#fff;box-shadow:0 12px 35px rgba(10,18,32,.23);font-size:9px;font-weight:800;animation:toastIn .2s ease both}.toast.error{background:#b4232b}@keyframes slideIn{from{transform:translateX(100%)}to{transform:none}}@keyframes toastIn{from{opacity:0;transform:translate(-50%,10px)}to{opacity:1;transform:translate(-50%,0)}}
@media(max-width:1180px){.dashboard-grid,.cycle-layout{grid-template-columns:1fr}.side-stack{grid-template-columns:1fr 1fr}.metric-grid,.summary-grid{grid-template-columns:repeat(2,1fr)}.report-grid{grid-template-columns:1fr}}
@media(max-width:900px){.sidebar{transform:translateX(-100%);transition:.2s}.sidebar.open{transform:none}.main-area{margin-left:0}.mobile-only{display:grid}.mobile-backdrop{position:fixed;inset:0;z-index:35;background:rgba(18,25,38,.4)}.topbar{padding:0 16px}.environment-pill{display:none}.settings-grid{grid-template-columns:1fr}.login-view{grid-template-columns:1fr}.login-visual{display:none}.mobile-brand{display:flex;margin-bottom:25px}.login-card{margin:30px auto}}
@media(max-width:640px){.page-content{padding:22px 14px 35px}.global-search kbd{display:none}.topbar{height:61px}.page-heading{align-items:flex-start;flex-direction:column}.page-heading h1{font-size:23px}.heading-actions{width:100%;overflow:auto}.heading-actions .btn{flex:1;white-space:nowrap}.metric-grid,.summary-grid{gap:8px}.metric-card{min-height:85px;padding:11px}.metric-icon{display:none}.side-stack{grid-template-columns:1fr}.toolbar{align-items:stretch;flex-direction:column}.toolbar-group{width:100%;overflow:auto}.employee-picker{min-width:100%}.picker-popover{width:100%}.cycle-grid{grid-template-columns:repeat(7,minmax(76px,1fr))}.panel-header{align-items:flex-start;flex-direction:column}.panel-header .btn,.table-search{width:100%}.form-grid{grid-template-columns:1fr}.form-field.full{grid-column:auto}.report-grid{grid-template-columns:1fr}.audit-entry{grid-template-columns:1fr 1fr}.help-grid{grid-template-columns:1fr}.notification-panel{right:10px;width:calc(100vw - 20px)}}
@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}
.status-pending_manager,.status-pending_hod,.status-pending_hrm{background:#fff3d6;color:#986000}.cycle-day.current-week{border-color:#e9cd62;background:linear-gradient(180deg,#fffbea,#fff)}.cycle-day.current-week.today{border-color:#e51b23;box-shadow:inset 0 3px #e51b23,0 0 0 2px rgba(255,209,0,.28)}.dot.week{border-radius:2px;background:#ffd100;box-shadow:0 0 0 1px #d9b300}.summary-status{font-size:14px!important}.department-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:10px;margin-top:15px}.department-card{display:grid;grid-template-columns:1fr auto;gap:7px 12px;padding:13px;border:1px solid var(--line);border-radius:10px;background:#fff}.department-card>div{display:grid;gap:3px}.department-card span{color:#7d8898;font-size:8px;font-weight:800}.department-card b{font-size:13px}.department-card small{grid-column:1/-1;color:#768294;font-size:8px;line-height:1.55}.department-card .btn{grid-column:2;grid-row:1;min-height:30px;padding:0 10px;font-size:8px}.approval-calendar{display:grid;grid-template-columns:repeat(7,minmax(52px,1fr));gap:5px;margin-bottom:18px}.approval-day{display:grid;gap:3px;padding:7px;border:1px solid var(--line);border-radius:7px;background:#fafbfc;text-align:center}.approval-day b{font-size:8px}.approval-day em{color:#c61f27;font-size:9px;font-style:normal;font-weight:900}.approval-timeline{display:grid;margin-top:10px}.approval-step{display:flex;gap:10px;padding:10px 0;border-bottom:1px solid #edf0f4}.approval-step>i{width:25px;height:25px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#eaf7f2;color:#16805d;font-size:9px;font-style:normal;font-weight:900}.approval-step>div{display:grid;gap:3px}.approval-step b{font-size:9px;text-transform:capitalize}.approval-step span,.approval-step small{color:#7a8697;font-size:8px}.temporary-password{display:block;margin-top:8px;padding:10px;border-radius:6px;background:#fff;color:#172033;font-family:ui-monospace,monospace;font-size:13px;letter-spacing:.03em}.modal-header>div small{color:#7c8797;font-size:8px}
.bulk-fill-control{display:flex;align-items:center;overflow:hidden;border:1px solid var(--line);border-radius:8px;background:#fff}.bulk-fill-control select{height:36px;min-width:145px;padding:0 9px;border:0;border-right:1px solid var(--line);outline:0;background:#f8fafc;color:#344054;font-size:9px;font-weight:800}.bulk-fill-control .btn{border:0;border-radius:0}.access-guidance{display:flex;gap:10px;margin:13px 15px;padding:12px;border:1px solid #d8e9e2;border-radius:9px;background:#f2faf7;color:#235f50}.access-guidance>span{font-size:16px}.access-guidance b{font-size:10px}.access-guidance p{margin:4px 0 0;font-size:8px;line-height:1.5}.access-table td{height:65px}.permission-chip{display:inline-flex;margin:2px;padding:4px 6px;border-radius:999px;background:#edf2f7;color:#536174;font-size:7px;font-weight:800}.permission-chip.important{background:#fff0d2;color:#8e5c00}.expiry-text{display:block;margin-top:5px;color:#7a8697;font-size:7px}.btn.compact{min-height:30px;padding:0 10px;font-size:8px}.permission-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:12px 0}.permission-group{display:grid;gap:5px;margin:0;padding:10px;border:1px solid var(--line);border-radius:9px}.permission-group legend{padding:0 5px;color:#677486;font-size:8px;font-weight:900;text-transform:uppercase}.permission-option{display:flex;align-items:flex-start;gap:8px;padding:8px;border-radius:7px;background:#f8fafc}.permission-option:hover{background:#f2f5f8}.permission-option.inherited{background:#f0f7f4}.permission-option input{width:14px;height:14px;margin-top:1px;accent-color:#e51b23}.permission-option span{display:grid;gap:3px}.permission-option b{font-size:8px}.permission-option small{color:#7b8797;font-size:7px}.permission-option.inherited small{color:#2a775f}@media(max-width:640px){.bulk-fill-control{width:100%}.bulk-fill-control select{flex:1}.permission-grid{grid-template-columns:1fr}}
.login-link{width:100%;margin-top:9px;padding:7px;border:0;background:transparent;color:#a91b22;font-size:10px;font-weight:800}.login-link:hover{text-decoration:underline}.form-error.success{color:#167158}.language-control{height:31px;display:flex;align-items:center;gap:6px;padding:0 8px;border:1px solid var(--line);border-radius:8px;background:#fff;color:#697587;font-size:8px;font-weight:800}.language-control select{border:0;outline:0;background:transparent;color:#172033;font-size:9px;font-weight:900}.sidebar,.main-area{transition:width .2s ease,margin-left .2s ease,transform .2s ease}.sidebar-collapsed .sidebar{width:78px;padding-inline:10px}.sidebar-collapsed .main-area{margin-left:78px}.sidebar-collapsed .brand-lockup>div,.sidebar-collapsed .nav-group,.sidebar-collapsed .nav-item:not(.active){font-size:0}.sidebar-collapsed .brand-lockup{justify-content:center;padding-inline:0}.sidebar-collapsed .brand-mr,.sidebar-collapsed .brand-diy{width:27px;padding:0;font-size:9px}.sidebar-collapsed .nav-item{justify-content:center;padding:0}.sidebar-collapsed .nav-icon{width:auto}.sidebar-collapsed .nav-item .badge{position:absolute;margin:0 0 26px 27px}.sidebar-collapsed .sidebar-help>div,.sidebar-collapsed .sidebar-user>div,.sidebar-collapsed .sidebar-user>button{display:none}.sidebar-collapsed .sidebar-help{justify-content:center;padding:8px}.sidebar-collapsed .sidebar-user{justify-content:center;padding-inline:0}.blocked-reason{max-width:250px;color:#b4232b!important;line-height:1.35}.assignment-list{display:flex!important;flex-wrap:wrap;gap:5px}.assignment-chip{display:inline-flex;align-items:center;padding:5px 7px;border-radius:999px;background:#eef3f8;color:#48566b!important;font-size:7px!important;font-weight:800}.assignment-heading{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-bottom:12px}.assignment-heading>div{display:grid;gap:4px}.assignment-heading b{font-size:11px}.assignment-heading small{color:#7b8797;font-size:8px}.responsibility-row{display:grid;grid-template-columns:1.2fr 1fr 34px;align-items:end;gap:9px;padding:10px;margin-bottom:8px;border:1px solid var(--line);border-radius:9px;background:#fafbfc}.responsibility-row .form-field{margin:0}.row-remove{width:34px;height:42px;border:1px solid #efc5c7;border-radius:8px;background:#fff7f7;color:#b4232b;font-size:18px}.profile-summary{display:flex;align-items:center;gap:11px;margin-bottom:18px;padding:13px;border:1px solid var(--line);border-radius:10px;background:#f8fafc}.profile-summary .avatar{width:42px;height:42px}.profile-summary>div{display:grid;gap:4px}.profile-summary b{font-size:12px}.profile-summary small{color:#768294;font-size:8px}
@media(max-width:900px){.sidebar-collapsed .sidebar{width:248px}.sidebar-collapsed .main-area{margin-left:0}.sidebar-collapsed .brand-lockup>div,.sidebar-collapsed .nav-group,.sidebar-collapsed .nav-item:not(.active){font-size:inherit}.sidebar-collapsed .nav-item{justify-content:flex-start;padding:0 12px}.sidebar-collapsed .nav-icon{width:19px}.sidebar-collapsed .sidebar-help>div,.sidebar-collapsed .sidebar-user>div,.sidebar-collapsed .sidebar-user>button{display:grid}.sidebar-collapsed .sidebar-help{justify-content:flex-start}.sidebar-collapsed .sidebar-user{justify-content:flex-start}.language-control span{display:none}}
@media(max-width:640px){.language-control{padding:0 5px}.top-actions{gap:5px}.responsibility-row{grid-template-columns:1fr}.row-remove{width:100%;height:34px}.assignment-heading{align-items:stretch;flex-direction:column}.assignment-heading .btn{width:100%}}
.sidebar-collapsed .nav-item{font-size:0}@media(max-width:900px){.sidebar-collapsed .nav-item{font-size:11px}}
.cycle-day.weekend:not(.current-week){background:#f8fafc}.cycle-day.weekend>span{color:#64748b}.cycle-day.weekend .shift-chip.tone-slate{background:#e8edf3;color:#475569}
