@import "https://fonts.googleapis.com/css2?family=Be+Vietnam+Pro:wght@400;500;600;700;800&display=swap";*{box-sizing:border-box}body{color:#1d2d43;background:#f4f7fb;margin:0;font-family:Be Vietnam Pro,Arial,sans-serif;font-size:13px}button,input,select{font:inherit}button,a.primary{cursor:pointer;color:#334761;background:#fff;border:1px solid #dbe3ed;border-radius:8px;justify-content:center;align-items:center;gap:7px;padding:10px 14px;text-decoration:none;display:inline-flex}button:hover{background:#eef4ff}button:disabled{opacity:.45;cursor:default}.primary{color:#fff!important;background:#1966dc!important;border-color:#1966dc!important}input,select{color:#20334e;background:#fff;border:1px solid #dce4ed;border-radius:7px;min-width:0;padding:10px}label{color:#52647b;flex-direction:column;gap:7px;font-size:11px;font-weight:600;display:flex}h1{letter-spacing:-1px;margin:10px 0;font-size:29px}h2{margin:0 0 5px;font-size:16px}p{color:#718198;line-height:1.7}small{color:#8391a5;margin-top:6px;font-size:11px;font-weight:400;display:block}.app{min-height:100vh;display:flex}aside{color:#d9e6f7;background:#102440;flex-direction:column;width:225px;padding:32px 20px;display:flex;position:fixed;inset:0 auto 0 0}.brand{align-items:center;gap:12px;font-size:21px;font-weight:800;display:flex}.brand span{background:#2873e9;border-radius:11px;padding:10px;display:flex}.brand small{letter-spacing:3px;color:#89a8d3;font-size:9px}.side-label{letter-spacing:1.4px;color:#7991b2;margin:48px 12px 16px;font-size:9px}.nav{color:#a8bdd9;background:0 0;border:0;justify-content:flex-start;gap:12px;margin:4px 0;padding:14px}.nav.active{color:#fff;background:#244774}.nav:hover{background:#203c60}.side-bottom{border-top:1px solid #29415f;margin-top:auto;padding:22px 8px;font-size:11px}.dot{background:#58dcb0;border-radius:50%;width:7px;height:7px;margin-right:6px;display:inline-block}main{width:calc(100% - 225px);margin-left:225px;padding:38px 35px}header{justify-content:space-between;align-items:center;margin-bottom:29px;display:flex}.eyebrow{letter-spacing:1.5px;color:#4673a8;font-size:10px;font-weight:700}header p{margin:0}.user{background:#fff;border:1px solid #e2e8f1;border-radius:9px;align-items:center;gap:10px;padding:12px;font-size:11px;display:flex}.stats{grid-template-columns:repeat(4,1fr);gap:18px;margin-bottom:26px;display:grid}.stats>div{background:#fff;border:1px solid #e3e9f1;border-radius:12px;padding:22px}.stats b{margin-top:12px;font-size:33px;display:block}.stats em{color:#9aa7ba;font-size:15px;font-style:normal;font-weight:400}.blue{color:#216be0}.green{color:#19a578}.orange{color:#df9425!important}.card{background:#fff;border:1px solid #e2e8f1;border-radius:12px;overflow:hidden}.toolbar{border-bottom:1px solid #e9eef4;flex-wrap:wrap;align-items:flex-end;gap:16px;padding:22px;display:flex}.search{flex:1;min-width:190px;position:relative}.search svg{color:#8391a5;position:absolute;top:12px;left:12px}.search input{width:100%;padding-left:36px}.icon{padding:11px}.table-head{justify-content:space-between;align-items:center;gap:16px;padding:23px;display:flex}.actions{gap:9px;display:flex}.bulk{background:#f8faff;border-top:1px solid #edf1f8;align-items:center;gap:15px;padding:12px 22px;font-size:11px;display:flex}.bulk button{padding:7px 10px;font-size:10px}.hint{color:#8391a5;margin-left:auto}.table-wrap{max-height:65vh;overflow:auto}table{border-collapse:collapse;white-space:nowrap;width:100%}thead{z-index:1;background:#f3f6fa;position:sticky;top:0}th{text-align:left;color:#7c8ca1;letter-spacing:.6px;padding:15px 20px;font-size:9px}td{border-bottom:1px solid #edf1f5;padding:14px 20px;font-size:12px}td select{background:#f8fafc;width:158px;padding:9px;font-size:11px}.team{color:#5677a2;background:#eef3fb;border-radius:5px;padding:3px 7px;font-size:10px}.hours{width:62px;padding:9px}.note{border-color:#0000;width:165px;font-size:11px}.dirty{background:#fffaf0}.notice{background:#edf5ff;border:1px solid #c5d9f4;border-radius:8px;justify-content:space-between;margin-bottom:20px;padding:15px 20px;display:flex}.notice button{background:0 0;border:0;padding:0 6px}.empty{text-align:center;padding:40px}.permissions{padding:25px}.permissions>.toolbar{padding-left:0}.leader-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin-top:24px;display:grid}.leader-grid>div{border:1px solid #e2e9f3;border-radius:10px;padding:20px}.avatar{color:#2868c4;background:#eaf2ff;border-radius:50%;justify-content:center;align-items:center;width:35px;height:35px;margin-bottom:12px;display:flex}.leader-grid button{margin-left:8px;padding:4px;font-size:10px}footer{color:#9ba8bb;letter-spacing:1px;justify-content:space-between;margin-top:25px;font-size:9px;display:flex}.modal{z-index:5;background:#10244088;justify-content:center;align-items:center;padding:20px;display:flex;position:fixed;inset:0}.modal form{background:#fff;border-radius:13px;width:420px;max-height:95vh;padding:28px;overflow:auto}.modal label{margin-top:15px}.modal .actions{justify-content:flex-end;margin-top:22px}@media (max-width:1050px){aside{width:190px}main{width:calc(100% - 190px);margin-left:190px;padding:25px 20px}.stats{gap:10px}.stats>div{padding:16px}.hint{display:none}.leader-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:700px){.app{display:block}aside{flex-flow:wrap;gap:4px;width:100%;padding:16px;display:flex;position:static}.brand{width:100%;margin-bottom:8px;font-size:18px}.side-label,.side-bottom{display:none}.nav{gap:6px;padding:9px;font-size:11px}main{width:100%;margin:0;padding:22px 14px}header{align-items:flex-start;gap:12px}h1{font-size:24px}.user{max-width:155px;font-size:9px;overflow:hidden}.stats{grid-template-columns:repeat(2,1fr)}.table-head{flex-direction:column;align-items:flex-start}.toolbar{gap:10px;padding:15px}.toolbar label{flex:1;min-width:130px}.bulk{flex-wrap:wrap}.leader-grid{grid-template-columns:1fr}footer span{display:none}}.controller-bar{background:#eaf2ff;border:1px solid #cbdcf7;border-radius:11px;align-items:center;gap:24px;margin-bottom:20px;padding:18px 22px;display:flex}.controller-bar label{min-width:300px}.work-code{color:#225bae;background:#eef4ff;border-radius:6px;padding:7px 10px;font-weight:700;display:inline-block}.shift-code{font-weight:700}.admin-login{color:#276ac5;white-space:nowrap;font-size:11px}.table-wrap{scrollbar-width:auto;scrollbar-color:#8498b6 #edf2f8}.table-wrap::-webkit-scrollbar{width:12px;height:12px}.table-wrap::-webkit-scrollbar-thumb{background:#8498b6;border:3px solid #edf2f8;border-radius:10px}@media (max-width:700px){.controller-bar{flex-direction:column;align-items:stretch;gap:12px}.controller-bar label{min-width:0}header{flex-wrap:wrap}.admin-login{margin-left:auto}}.month-stats{margin-top:22px}.month-stats>button{text-align:left;white-space:normal;background:#fff;border:1px solid #e3e9f1;border-radius:12px;padding:20px;display:block}.month-stats>button:hover{border-color:#90b2ef}.month-stats small{line-height:1.6}.month-controls{justify-content:space-between;align-items:center;gap:16px;padding:0 22px 15px;display:flex}.month-explain{background:#f3f7fd;margin:0;padding:12px 22px;font-size:11px}.month-scroll{max-height:65vh}.month-table .frozen{z-index:2;background:#fff;border-right:2px solid #dfe7f2;min-width:240px;max-width:280px;position:sticky;left:0}.month-table thead .frozen{z-index:4;color:#23569c;background:#e9f1ff}.month-table th{text-align:center;min-width:82px;padding:13px 10px}.month-table th.frozen{text-align:left}.month-table td:not(.frozen){text-align:center;padding:9px 8px}.month-table .today{background:#edf4ff}.month-table .sunday{color:#d26537}.day-cell{background:0 0;border:0;flex-direction:column;gap:4px;min-width:62px;padding:4px;display:flex}.day-cell:hover{background:#edf4ff}.day-cell span{border-radius:5px;padding:5px 6px;font-size:11px;font-weight:600;display:block}.blank{color:#bdc7d4}.red{color:#c04756}.month-legend{border-top:1px solid #e2e9f3;flex-wrap:wrap;gap:10px;padding:17px 22px;font-size:10px;display:flex}.month-legend>span{border-radius:5px;padding:6px 8px}.month-legend small{width:100%;line-height:1.7}.period-label{padding:6px 0}@media (max-width:700px){.month-controls{flex-direction:column;align-items:flex-start}.month-table .frozen{min-width:180px;max-width:200px}.month-stats>button{padding:14px}.month-scroll{max-height:70vh}}.table-wrap{isolation:isolate;overscroll-behavior-x:contain;-webkit-overflow-scrolling:touch;max-width:100%;position:relative}.table-wrap table{border-collapse:separate;border-spacing:0}.table-wrap thead{position:static}.table-wrap thead th{z-index:3;background:#f3f6fa;position:sticky;top:0;box-shadow:0 1px #dce5f1}.table-wrap tr>:first-child{z-index:2;white-space:normal;background:#fff;width:220px;min-width:220px;max-width:260px;position:sticky;left:0;box-shadow:2px 0 #dfe7f2}.table-wrap tbody tr>:first-child strong{line-height:1.5;display:block}.table-wrap tbody tr.dirty>:first-child{background:#fffaf0}.table-wrap thead tr>:first-child{z-index:5;color:#23569c;background:#e9f1ff;top:0;left:0}.table-wrap tbody td:first-child small{overflow-wrap:anywhere;line-height:1.5}.month-table thead .frozen{z-index:5}@media (max-width:700px){.table-wrap tr>:first-child,.month-table .frozen{width:156px;min-width:156px;max-width:156px;padding-left:12px;padding-right:12px}.table-wrap tbody td:first-child strong{font-size:12px}.table-wrap thead tr>:first-child{font-size:9px}.table-wrap{max-height:68vh;max-height:68dvh}}.quick-attendance{background:#edf5ff;flex-wrap:wrap;gap:18px}.quick-attendance label{width:72px}.quick-attendance input{width:72px;padding:8px}.quick-attendance button{padding:12px 16px;font-size:12px}.quick-attendance small{color:#587aa7;line-height:1.5}.quick-attendance .hint{max-width:220px;font-size:10px;line-height:1.6}@media (max-width:700px){.quick-attendance>div{width:100%}.quick-attendance .hint{width:100%;max-width:none;margin-left:0;display:block}}.employee-import{background:#f5f9ff;border-top:1px solid #dce7f6;padding:20px 23px}.import-title{justify-content:space-between;align-items:center;gap:16px;display:flex}.employee-import p{margin:12px 0;font-size:11px}.upload-excel{color:#fff;cursor:pointer;background:#1966dc;border-radius:8px;justify-content:center;align-items:center;padding:11px 16px;font-size:12px;display:inline-flex;position:relative}.upload-excel input{opacity:0;cursor:pointer;width:100%;position:absolute;inset:0}.import-preview{flex-wrap:wrap;align-items:center;gap:14px;padding:15px 0;display:flex}.import-preview span{font-size:11px}.import-table{border:1px solid #dce7f6;border-radius:8px;max-height:280px}.import-table td{background:#fff}@media (max-width:700px){.import-title{flex-direction:column;align-items:stretch}.import-title .actions{flex-wrap:wrap}}.edit-alert{color:#a52a3c;background:#fff0f1;border:1px solid #e3a5ac;border-left:5px solid #cb394a;border-radius:10px;justify-content:space-between;align-items:center;gap:18px;margin-bottom:22px;padding:18px 20px;display:flex}.edit-alert small{color:#a84c57;line-height:1.6}.edit-alert button{color:#a52a3c;border-color:#e3a5ac}.saved-edited td{background:#fff1f2}.table-wrap tbody tr.saved-edited>:first-child{background:#ffe9ec}.edit-badge{white-space:normal;color:#bd293d!important;font-size:10px!important;font-weight:700!important}.month-edited{box-shadow:inset 0 0 0 1px #e898a4;background:#ffe8ec!important}.month-edited .day-cell span{color:#b3263c;background:#ffe1e7}.month-edited .day-cell .edit-badge{padding:1px;font-size:9px!important}@media (max-width:700px){.edit-alert{flex-direction:column;align-items:stretch}}.employee-login{flex-wrap:wrap;align-items:flex-end;gap:16px;width:100%;display:flex}.employee-login label{min-width:180px}.employee-login small{width:100%;line-height:1.6}.employee-login input{min-width:0}@media (max-width:700px){.employee-login label{flex:1;min-width:0}.employee-login button{width:100%}}.saved-pin{background:#eef5ff;border:1px solid #cbdcf7;border-radius:8px;flex-wrap:wrap;align-items:center;gap:8px;margin:12px 0;padding:12px;display:flex}.saved-pin b{letter-spacing:2px;color:#205da3;font-family:monospace;font-size:18px}.saved-pin button{margin:0;font-size:10px!important}button.danger{color:#b52840;background:#fff0f2;border-color:#e5a6b0}button.danger:hover{background:#ffe1e7}.delete-row{margin-top:8px;padding:6px 8px;font-size:10px;display:block}.table-head .actions{flex-wrap:wrap}body{color:#30343a;background:#ededed;font-size:14px}aside{color:#424242;background:#fff;border-right:1px solid #dedede;padding:0 16px 20px;box-shadow:2px 0 8px #0000000a}.brand{color:#fff;background:linear-gradient(145deg,#ff9800 0%,#f4511e 48%,#c2185b 100%);min-height:124px;margin:0 -16px;padding:26px 16px}.brand span{color:#fff;background:#ffffff2a;border:1px solid #ffffff60}.brand small{color:#fff;font-weight:600}.side-label{color:#555;letter-spacing:.3px;background:#f1f1f1;margin:0 -16px 12px;padding:12px 16px;font-size:11px;font-weight:800}.side-bottom{color:#666;border-color:#e0e0e0}.side-bottom small{color:#777}.dot{background:#009688}aside .nav{color:#424242;min-height:48px;box-shadow:none;background:#fff;border:0;border-radius:3px;margin:3px 0;padding:13px 12px;font-size:14px;font-weight:700}aside .nav svg{color:#757575;flex-shrink:0}aside .nav:hover{color:#e53935;background:#f5f5f5}aside .nav.active{color:#e53935;box-shadow:none;background:#ffebee;border-left:4px solid #f44336}aside .nav.active svg{color:#f44336}header{color:#fff;background:#f44336;border:0;border-radius:3px;flex-wrap:wrap;gap:16px;padding:22px 24px;box-shadow:0 3px 8px #00000020}h1{letter-spacing:-.6px;font-size:30px;font-weight:800}header h1,header .eyebrow,header p{color:#fff}.eyebrow{letter-spacing:1px;font-size:11px;font-weight:700}.user{color:#fff;background:#ffffff18;border:1px solid #fff5;border-radius:3px}.user small{color:#fff}.admin-login{color:#fff;font-weight:700;text-decoration:underline}h2{color:#34383e;font-size:21px;font-weight:800;line-height:1.4}label{color:#555;font-size:13px;font-weight:700}small{color:#717780;font-size:12px}p{color:#646b74}button,input,select{border-radius:3px}button{font-weight:600}input:focus,select:focus{outline:2px solid #80deea}.primary{font-weight:700;box-shadow:0 2px 5px #00000018;background:#0097a7!important;border-color:#0097a7!important}.primary:hover{background:#00838f!important}.upload-excel{background:#0097a7;border-radius:3px;font-weight:700}.card{background:#fff;border:1px solid #e0e0e0;border-radius:3px;box-shadow:0 2px 6px #00000015}.toolbar{background:#fff;border-color:#e7e7e7}.table-head{background:#fafafa;border-bottom:1px solid #e0e0e0}.table-head h2{color:#34383e}.actions{flex-wrap:wrap}.stats>div,.month-stats>button{color:#fff;border:0;border-radius:3px;padding:23px;box-shadow:0 3px 7px #0000001c}.stats>:nth-child(4n+1){background:#e91e63}.stats>:nth-child(4n+2){background:#00aabd}.stats>:nth-child(4n+3){background:#689f38}.stats>:nth-child(4n+4){background:#ef8500}.stats span{letter-spacing:.2px;color:#fff;font-size:13px;font-weight:800}.stats b,.stats .blue,.stats .green,.stats .orange{font-size:36px;font-weight:800;color:#fff!important}.stats small,.stats em{color:#fff}.month-stats>button:hover{filter:brightness(.96)}.controller-bar{background:#e0f2f1;border:1px solid #b2dfdb;border-radius:3px}.controller-bar strong{color:#00695c;font-size:15px}.quick-attendance{background:#e0f7fa;border-color:#b2ebf2}.quick-attendance strong{color:#007784;font-size:15px}.quick-attendance small{color:#486d73}.table-wrap thead th{color:#28616b;letter-spacing:.3px;background:#e6f5f6;padding-top:17px;padding-bottom:17px;font-size:12px;font-weight:800}.table-wrap thead tr>:first-child{color:#235a65;background:#d9eef1;font-size:13px}.table-wrap tbody tr:nth-child(2n):not(.dirty):not(.saved-edited)>td{background:#fafafa}.table-wrap tbody tr:nth-child(2n):not(.dirty):not(.saved-edited)>td:first-child{background:#f5f5f5}.table-wrap tbody tr:hover:not(.dirty):not(.saved-edited)>td{background:#f0f7f8}td{font-size:13px}td strong{font-weight:700}.team{color:#00796b;background:#e0f2f1;border-radius:3px;font-size:12px;font-weight:600}.work-code{color:#00838f;background:#e0f7fa;border-radius:3px}.shift-code{color:#546e7a}.present{color:#2e7d32;background:#e8f5e9!important}.employee-import{background:#f3f8f9;border-color:#d9e8eb}.import-title h2{color:#007984}.permissions>h2{color:#fff;background:#009688;border-radius:3px;padding:16px}.leader-grid>div{background:#fff;border-color:#00acc1 #e0e0e0 #e0e0e0;border-top-style:solid;border-top-width:4px;border-radius:3px;box-shadow:0 2px 5px #0000000d}.leader-grid>div:nth-child(4n+2){border-top-color:#7cb342}.leader-grid>div:nth-child(4n+3){border-top-color:#e91e63}.leader-grid>div:nth-child(4n+4){border-top-color:#fb8c00}.leader-grid strong{font-size:15px;font-weight:800}.avatar{color:#fff;background:#00acc1;font-weight:800}.saved-pin{background:#e0f7fa;border-color:#b2ebf2;border-radius:3px}.saved-pin b{color:#006978}.month-controls{background:#fff;padding-top:16px}.month-explain{color:#626b74;background:#f5f5f5}.month-table th b{font-size:14px}.month-table th small{font-size:11px;font-weight:600}.month-table thead .frozen{color:#235a65;background:#d9eef1}.month-legend{background:#fafafa}.period-label strong{color:#007e8c;font-size:16px}.worked{color:#2e7d32;background:#e8f5e9}.rotation{color:#5c6bc0;background:#e8eaf6}.leave{color:#a86600;background:#fff3e0}.absent{color:#c62828;background:#ffebee}@media (max-width:700px){aside{padding:0 14px 14px}.brand{width:calc(100% + 28px);min-height:88px;margin:0 -14px 6px;padding:18px 14px}aside .nav{min-height:42px;padding:10px;font-size:12px}header{padding:18px}h1{font-size:26px}h2{font-size:20px}.stats span{font-size:12px}.stats b{font-size:32px}.table-wrap thead tr>:first-child{font-size:12px}.table-wrap tbody td:first-child strong{font-size:13px}.table-wrap thead th{font-size:12px}.stats>div,.month-stats>button{padding:17px}.table-head{padding:18px}}.mobile-topbar,.mobile-menu-close,.menu-backdrop{display:none}@media (max-width:700px){.mobile-topbar{z-index:8;color:#fff;background:#f44336;align-items:center;gap:12px;min-height:48px;padding:8px 12px;display:flex;position:sticky;top:0;box-shadow:0 2px 6px #0002}.mobile-topbar button{color:#fff;background:#ffffff20;border:1px solid #ffffff50;min-height:40px;padding:9px}.mobile-topbar strong{font-size:14px}.mobile-topbar span{margin-left:6px;font-size:11px;font-weight:500}.app>aside{z-index:12;visibility:hidden;background:#fff;flex-flow:column;gap:0;width:260px;max-width:85vw;height:100dvh;padding:0 14px 18px;transition:transform .2s,visibility .2s;display:flex;position:fixed;inset:0 auto 0 0;overflow-y:auto;transform:translate(-105%);box-shadow:5px 0 20px #0003}.app.menu-open>aside{visibility:visible;transform:translate(0)}.menu-open .menu-backdrop{z-index:11;background:#0006;border:0;border-radius:0;padding:0;display:block;position:fixed;inset:0}.menu-open .mobile-menu-close{z-index:1;color:#b0352c;background:#ffffffeb;align-items:center;gap:3px;min-height:36px;padding:7px;font-size:11px;display:flex;position:absolute;top:10px;right:10px}.app>aside .brand{flex-shrink:0;width:calc(100% + 28px);min-height:130px;margin-bottom:0;padding-top:48px}.app>aside .side-label{margin-bottom:8px;display:block}.app>aside .side-bottom{margin-top:auto;padding-top:20px;display:block}.app>aside .nav{justify-content:flex-start;width:100%;min-height:46px;font-size:13px}.app>main{width:100%;margin:0;padding:12px 8px}body:has(.menu-open){overflow:hidden}header{gap:8px;margin-bottom:14px;padding:12px}header h1{margin:6px 0;font-size:21px}header p{font-size:11px;line-height:1.5}.eyebrow{font-size:9px}.user{max-width:100%;padding:7px;font-size:10px}.admin-login{font-size:10px}.stats{gap:8px;margin-bottom:12px}.stats>div,.month-stats>button{padding:11px}.stats span{font-size:10px}.stats b{margin-top:7px;font-size:25px}.stats small{font-size:10px}.controller-bar{gap:10px;margin-bottom:12px;padding:12px}.controller-bar strong{font-size:12px}.employee-login{gap:8px}.employee-login label{font-size:11px}.employee-login small{font-size:10px}.toolbar{gap:8px;padding:12px}.toolbar label{min-width:110px;font-size:11px}.toolbar input,.toolbar select{padding:8px;font-size:12px}.table-head{gap:10px;padding:12px}.table-head h2{font-size:17px}.table-head small{font-size:10px}.table-head .actions{gap:6px}.table-head button{min-height:38px;padding:9px 10px;font-size:11px}.quick-attendance{align-items:flex-end;gap:8px;padding:10px 12px}.quick-attendance>div{width:100%}.quick-attendance strong{font-size:12px}.quick-attendance label{width:60px;font-size:10px}.quick-attendance input{width:60px;min-height:38px;padding:8px;font-size:12px}.quick-attendance button{min-height:38px;padding:10px 12px;font-size:11px}.quick-attendance small,.quick-attendance .hint{font-size:10px;line-height:1.4}.roster-note{border-bottom:1px solid #e4e8eb;margin:0;padding:8px 12px;font-size:10px;line-height:1.45}.table-wrap thead th{letter-spacing:0;white-space:normal;min-width:105px;padding:11px 9px;font-size:10px;line-height:1.4}.table-wrap thead tr>:first-child{font-size:10px}.table-wrap td{padding:9px;font-size:11px;line-height:1.4}.table-wrap tr>:first-child,.month-table .frozen{width:118px;min-width:118px;max-width:118px;padding:9px}.table-wrap tbody td:first-child strong{font-size:11px;line-height:1.45}.table-wrap td small{margin-top:4px;font-size:10px;line-height:1.4}.table-wrap td select{width:140px;min-height:36px;padding:8px;font-size:11px}.team{padding:3px 5px;font-size:10px}.hours{width:54px;min-height:36px;padding:8px}.note{width:130px;min-height:36px;padding:8px}.work-code{padding:5px 7px;font-size:11px}.table-wrap{max-height:72dvh}.month-table th:not(:first-child){min-width:58px;padding:10px 6px}.month-table th b{font-size:11px}.month-table th small{font-size:9px}.day-cell{min-width:44px}.day-cell span{font-size:10px}.permissions{padding:14px}.permissions>h2{font-size:17px}.employee-import{padding:12px}.import-title h2{font-size:17px}footer{margin-top:15px;font-size:8px}}@media (prefers-reduced-motion:reduce){.app>aside{transition:none}}.attendance-filters{background:#e0f2f1;border-top:4px solid #009688;border-bottom:1px solid #b2dfdb;padding:16px 20px}.filter-heading{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.filter-heading strong{color:#00695c;font-size:16px;font-weight:800}.filter-heading span{color:#fff;background:#008577;border-radius:4px;padding:5px 9px;font-size:12px;font-weight:700}.filter-fields{flex-wrap:wrap;align-items:flex-end;gap:10px;display:flex}.filter-fields label{color:#00695c;flex:1;min-width:150px;font-size:12px}.filter-fields select,.filter-fields input{background:#fff;border-color:#9fcfc9;width:100%;min-height:40px;font-size:12px}.filter-fields .filter-search{flex:1.5}.filter-fields button{color:#007568;background:#fff;border-color:#008577;min-height:40px}.attendance-filters>small{color:#476e68;margin-top:10px;font-size:10px;line-height:1.5}.table-wrap .tone-working{border-color:#8fc7a0;font-weight:700;color:#236a39!important;background:#d8f0df!important}.table-wrap .tone-rotation{border-color:#b7a8e4;font-weight:700;color:#57409c!important;background:#e2ddfb!important}.table-wrap .tone-leave{border-color:#e9c37b;font-weight:700;color:#875600!important;background:#ffedc7!important}.table-wrap .tone-absent{border-color:#e48b9b;font-weight:700;color:#a51d35!important;background:#ffdadf!important}.table-wrap .tone-terminated{border-color:#aab4c0;font-weight:700;color:#404c5c!important;background:#e0e4e9!important}.table-wrap .tone-unmarked{border-color:#96cbe0;color:#276883!important;background:#e0f3fc!important}@media (max-width:700px){.attendance-filters{padding:11px 12px}.filter-heading{margin-bottom:9px}.filter-heading strong{font-size:13px}.filter-heading span{font-size:10px}.filter-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;display:grid}.filter-fields label{min-width:0;font-size:10px}.filter-fields select,.filter-fields input,.filter-fields button{min-height:36px;padding:8px;font-size:11px}.attendance-filters>small{font-size:9px}}.column-heading{justify-content:space-between;align-items:center;gap:7px;display:flex}.column-heading>span{white-space:normal;line-height:1.4}.column-filter-button{color:#28616b;background:#fff;border:1px solid #89b9bf;border-radius:3px;flex-shrink:0;gap:2px;min-width:30px;min-height:30px;padding:4px 5px}.column-filter-button:hover{background:#d2eeee}.column-filter-button.active{color:#fff;background:#00897b;border-color:#00695c;box-shadow:0 0 0 2px #00897b22}.column-filter-button>span{font-size:10px}.column-filter-popup{z-index:30;color:#33434b;background:#fff;border:1px solid #9bc6ca;border-top:4px solid #00897b;border-radius:5px;width:260px;max-width:calc(100vw - 16px);max-height:calc(100dvh - 80px);padding:12px;position:fixed;overflow:auto;box-shadow:0 8px 28px #0004}.column-filter-title{color:#00695c;justify-content:space-between;align-items:center;gap:8px;font-size:13px;display:flex}.column-filter-title button{border:0;padding:5px}.column-filter-content{flex-direction:column;gap:12px;padding:14px 0;display:flex}.column-filter-content label{font-size:12px}.column-filter-content input,.column-filter-content select{width:100%;min-height:40px;padding:10px;font-size:13px}.column-filter-footer{border-top:1px solid #e2e8e9;justify-content:space-between;gap:8px;padding-top:10px;display:flex}.column-filter-footer button{font-size:12px}.clear-column-filters{color:#00796b;border-color:#80cbc4;font-size:11px}@media (max-width:700px){.column-heading{gap:4px}.column-filter-button{min-width:27px;min-height:30px;padding:4px}.table-wrap th:has(.column-heading){min-width:125px}.table-wrap th:first-child:has(.column-heading){min-width:118px}.column-heading>span{font-size:10px}}.confirm-change{color:#00695c;background:#e0f2f1;border:1px solid #80cbc4;margin-top:8px;padding:8px 10px;font-size:11px;font-weight:700}.confirm-change:hover{background:#b2dfdb}.edit-alert .actions{flex-wrap:wrap}.other-shift-notice{color:#7b511b;background:#fff3df;border-top:3px solid #f5a623;border-bottom:1px solid #efd3a6;flex-wrap:wrap;align-items:center;gap:12px;padding:12px 20px;display:flex}.other-shift-notice strong{font-size:13px}.other-shift-notice small{color:#8b683d;font-size:11px}.other-shift-notice button{color:#784d16;background:#fff;border-color:#e3bb7c;font-size:12px;font-weight:700}@media (max-width:700px){.other-shift-notice{gap:8px;padding:10px 12px}.other-shift-notice strong{font-size:12px}.other-shift-notice button{padding:9px;font-size:11px}}.stats>button{text-align:left;white-space:normal;display:block}.stats>button.stat-selected{outline-offset:2px;outline:3px solid #37474f}.stats>button:hover{filter:brightness(.97)}.all-shifts-note{background:#e0f2f1;border-top:3px solid #009688;flex-wrap:wrap;align-items:center;gap:8px;padding:12px 20px;display:flex}.all-shifts-note strong{color:#00695c;font-size:12px}.all-shifts-note small{color:#52756e;margin:0;font-size:10px}.all-shifts-note button{padding:7px;font-size:11px}.extra-shift{white-space:normal;border-radius:4px;max-width:230px;margin-top:7px;padding:8px}.extra-shift strong{font-size:11px}.extra-shift small{color:inherit;font-size:10px}.record-shift{color:#00796b;font-size:10px;font-weight:700}@media (max-width:700px){.all-shifts-note{padding:10px 12px}.stats>button{padding:11px}.extra-shift{max-width:160px}}.marker-explain{color:#416e67;background:#e0f2f1;margin:0;padding:12px 20px;font-size:12px;line-height:1.6}.marker-count{border-radius:4px;padding:6px 14px;font-size:15px;font-weight:800;display:inline-block}.marker-count.working{color:#267541;background:#e0f2e4}.marker-details{white-space:normal;min-width:220px}.marker-details span{color:#896022;background:#fff0db;border-radius:3px;margin:3px;padding:5px 7px;font-size:11px;display:inline-block}@media (max-width:700px){.marker-explain{padding:10px 12px;font-size:10px}.marker-count{padding:5px 10px;font-size:12px}}.save-result{z-index:50;color:#175b37;background:#e7f6ed;border:2px solid #43a875;border-radius:12px;align-items:center;gap:14px;width:520px;max-width:calc(100vw - 24px);padding:18px;display:flex;position:fixed;bottom:24px;left:50%;transform:translate(-50%);box-shadow:0 8px 32px #0003}.save-result-icon{color:#fff;background:#21935c;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:44px;height:44px;display:flex}.save-result strong{font-size:17px;font-weight:800;line-height:1.45}.save-result p{color:inherit;margin:6px 0 0;font-size:12px;line-height:1.5}.save-result small{color:#397c55;font-size:11px}.save-result>button{color:inherit;background:0 0;border:0;align-self:flex-start;margin-left:auto;padding:6px}.save-result-error{color:#a32d3e;background:#fff0f1;border-color:#d77885}.save-result-error .save-result-icon{background:#c33f53}@media (max-width:700px){.save-result{bottom:calc(14px + env(safe-area-inset-bottom));gap:10px;padding:14px}.save-result strong{font-size:14px}.save-result p{font-size:11px}.save-result-icon{width:34px;height:34px}}.daily-hours-card{margin-top:20px}.daily-hours-card .table-head{background:#e0f2f1}.daily-hours-card h2{color:#00695c}.day-cell>span:has(.cell-attendance-hours){white-space:nowrap;justify-content:center;align-items:center;gap:6px;display:flex}.cell-attendance-code{font-size:11px;font-weight:800}.day-cell .cell-attendance-hours{color:inherit;background:#ffffffb3;border-left:1px solid #00000012;border-radius:3px;margin:0;padding:3px 5px;font-size:11px;font-weight:700;display:inline-block}.month-table .day-cell{min-width:100px}@media (max-width:700px){.cell-attendance-code,.day-cell .cell-attendance-hours{font-size:10px}.day-cell>span:has(.cell-attendance-hours){gap:4px}.month-table .day-cell{min-width:90px}}.machine-frame{background:#fff;border:0;width:100%;height:82vh;min-height:560px;display:block}.machine-tab .table-head a{color:#00796b;font-size:12px}.machine-stats{margin:0;padding:16px}.machine-status{border-radius:4px;padding:6px 9px;font-weight:700;display:inline-block}.machine-status.running{color:#246337;background:#d8f3df}.machine-status.maintenance{color:#886000;background:#fff0c4}.machine-status.off{color:#a4253b;background:#ffe1e4}.machine-status.unknown{color:#59636e;background:#e8ebef}@media (max-width:700px){.machine-frame{height:78dvh;min-height:480px}}