.attendance-workspace{--att-blue:light-dark(#1769e8,#1769e8);--att-ink:light-dark(#202936,#edf1f8);--att-line:light-dark(#e3eaf2,#354158);color:var(--att-ink);min-width:0}.att-page-heading,.att-register-toolbar,.att-register-caption,.att-register-footer,.att-day-detail>header,.att-request-list article>header{display:flex;align-items:center;justify-content:space-between;gap:16px}.att-page-heading{margin-bottom:22px}.att-page-heading h1{font-size:28px;letter-spacing:-.8px;margin:5px 0}.att-page-heading p{margin:0;color:light-dark(#202936,#edf1f8);font-size:13px}.att-page-heading p span{padding-left:10px}.att-module-nav{display:flex;gap:5px;overflow:auto;border-bottom:1px solid var(--att-line);padding:0 0 12px;margin-bottom:22px;scrollbar-width:thin}.att-module-nav a{white-space:nowrap;display:flex;gap:7px;align-items:center;padding:10px 12px;border-radius:7px;color:light-dark(#202936,#edf1f8);font-size:12px;font-weight:650;text-decoration:none}.att-module-nav a.active{background:light-dark(#eaf2ff,#1b2537);color:light-dark(#125bd0,#75a4f0)}.attendance-workspace .button.primary{background:var(--att-blue);border-color:var(--att-blue);color:white}.att-register-toolbar{margin-bottom:14px}.att-view-tabs,.att-toolbar-tools{display:flex;gap:5px;align-items:center}.att-view-tabs{border:1px solid var(--att-line);border-radius:7px;background:white;padding:3px}.att-view-tabs a{font-size:12px;padding:9px 14px;color:light-dark(#202936,#edf1f8);border-radius:5px;text-decoration:none}.att-view-tabs a.active{background:var(--att-blue);color:white;box-shadow:0 3px 8px light-dark(#1769e82b,#0000002b)}.att-filter-panel{background:white;border:1px solid var(--att-line);border-radius:10px;padding:17px;margin-bottom:16px;box-shadow:0 3px 16px light-dark(#233b6010,#00000010)}.att-date-range{display:flex;gap:12px;align-items:end;flex-wrap:wrap;margin-bottom:13px}.att-date-range label{flex:0 1 175px}.att-date-range label:nth-child(n+3){flex-basis:115px}.att-filter-fields{display:grid;grid-template-columns:repeat(4,minmax(110px,1fr)) minmax(175px,1.5fr) auto;gap:11px;align-items:end}.attendance-workspace label{font-size:12px;color:light-dark(#202936,#edf1f8);margin:0 0 10px;display:block}.attendance-workspace input:not([type=checkbox]),.attendance-workspace select,.attendance-workspace textarea{font:inherit;font-size:12px;border:1px solid light-dark(#d9e2ee,#354158);border-radius:6px;min-height:37px;margin-top:6px;max-width:100%;background:white;color:light-dark(#202936,#edf1f8)}.attendance-workspace input:focus-visible,.attendance-workspace select:focus-visible,.attendance-workspace textarea:focus-visible,.attendance-workspace a:focus-visible,.attendance-workspace button:focus-visible{outline:3px solid #8ab9ff;outline-offset:2px}.attendance-workspace input[type=checkbox]{accent-color:var(--att-blue);width:15px;height:15px}.att-filter-actions{display:flex;gap:7px;margin-bottom:10px}.att-advanced-filters>summary,.att-presets>summary{font-size:12px;color:light-dark(#202936,#edf1f8);cursor:pointer;display:flex;gap:7px;align-items:center}.att-advanced-filters .form-grid{margin-top:16px;grid-template-columns:repeat(3,minmax(0,1fr))}.att-presets{margin:12px 0}.att-presets>div{display:flex;flex-wrap:wrap;align-items:end;gap:9px;padding:12px;background:light-dark(#f4f7fc,#1b2537);border-radius:8px}.att-presets form{display:flex;gap:8px;align-items:end}.att-export-menu,.att-columns-menu{position:relative}.att-export-menu summary,.att-columns-menu summary{list-style:none;cursor:pointer}.att-export-menu>div,.att-columns-menu>div{position:absolute;right:0;top:100%;z-index:20;background:white;border:1px solid var(--att-line);padding:12px;border-radius:8px;box-shadow:0 8px 28px light-dark(#172c4820,#00000020);min-width:160px}.att-export-menu a{display:block;padding:8px;color:light-dark(#202936,#edf1f8)}.att-columns-menu label{display:flex;align-items:center;gap:9px;white-space:nowrap}.att-register-panel{background:white;border:1px solid var(--att-line);border-radius:10px;overflow:hidden;box-shadow:0 4px 20px light-dark(#18345808,#00000008)}.att-register-caption{padding:17px 18px;font-size:11px;color:light-dark(#202936,#edf1f8)}.att-register-caption>div{display:flex;gap:10px;align-items:center}.att-register-caption h2{font-size:14px;margin:0;color:var(--att-ink)}.att-live-dot{display:inline-block;background:light-dark(#20b67c,#20b67c);border:3px solid light-dark(#dcf9ed,#354158);width:12px;height:12px;border-radius:50%;flex:none}.att-bulk-bar{display:flex;gap:10px;align-items:center;padding:10px 16px;background:light-dark(#f8faff,#1b2537);border-top:1px solid var(--att-line);font-size:11px;flex-wrap:wrap}.att-bulk-bar select{width:220px;min-height:32px!important;margin:0!important}.att-bulk-bar input{width:220px;min-height:32px!important;margin:0!important}.att-bulk-bar small{color:light-dark(#202936,#edf1f8)}.att-bulk-bar [data-attendance-selected]{font-weight:700;min-width:70px}.att-matrix-scroll{overflow:auto;max-height:660px;position:relative;isolation:isolate}.att-matrix{border-collapse:separate;border-spacing:0;font-size:11px;white-space:nowrap;width:max-content;min-width:100%}.att-matrix th,.att-matrix td{border-right:1px solid light-dark(#e9eef5,#354158);border-bottom:1px solid light-dark(#e9eef5,#354158);padding:10px 8px;text-align:center;height:54px;background:white;vertical-align:middle}.att-matrix thead th{position:sticky;top:0;z-index:4;background:light-dark(#f6f8fc,#1b2537);color:light-dark(#202936,#edf1f8);font-size:10px;font-weight:700;height:48px}.att-matrix th small,.att-matrix td>small{display:block;font-weight:400;color:light-dark(#202936,#edf1f8);margin-top:5px;font-size:10px}.att-matrix .att-check-cell{position:sticky;left:0;z-index:3;width:36px;min-width:36px;padding:6px;background:light-dark(#fff,#1b2537)}.att-matrix .att-employee-cell{position:sticky;left:36px;z-index:3;width:215px;min-width:215px;text-align:left;box-shadow:4px 0 6px light-dark(#172c4805,#00000005)}.att-matrix:not(:has(.att-check-cell)) .att-employee-cell{left:0}.att-matrix thead .att-employee-cell,.att-matrix thead .att-check-cell{z-index:6;background:light-dark(#f6f8fc,#1b2537)}.att-matrix .att-date-cell{min-width:43px;width:43px;padding:8px 6px}.att-matrix thead .att-date-cell span{display:block}.att-matrix .is-weekend{color:light-dark(#bc3045,#e08593)}.att-matrix .is-today{background:light-dark(#edf5ff,#1b2537)}.att-matrix .is-off{background:light-dark(#fafbfe,#1b2537)}.att-matrix .is-holiday{background:light-dark(#fff9ed,#1b2537)}.att-matrix tbody tr:hover td{background:light-dark(#f3f8ff,#1b2537)}.att-person{display:flex;align-items:center;gap:10px}.att-avatar{display:flex;align-items:center;justify-content:center;width:33px;height:33px;border-radius:50%;background:linear-gradient(145deg,light-dark(#e5edf9,#243149),light-dark(#dce8f8,#243149));border:2px solid white;color:light-dark(#202936,#edf1f8);flex:none;font-size:10px;font-weight:750}.att-person strong{display:block;color:light-dark(#202936,#edf1f8);font-size:12px;font-weight:650}.att-person small{display:block;font-size:10px;color:light-dark(#202936,#edf1f8);margin-top:5px}.att-code{display:inline-flex;justify-content:center;align-items:center;min-width:27px;height:28px;padding:0 5px;border-radius:5px;font-size:11px;font-weight:750;text-decoration:none;line-height:1;background:light-dark(#edf0f5,#243149);color:light-dark(#202936,#edf1f8);border:1px solid transparent}.att-code-P,.att-code-OD,.att-code-WFH{background:light-dark(#dcf8e8,#243149);color:light-dark(#087f4c,#75f0bb)}.att-code-A{background:light-dark(#ffe0e4,#243149);color:light-dark(#c2243f,#e77e90)}.att-code-L,.att-code-PR{background:light-dark(#fff0c9,#243149);color:light-dark(#98530b,#f0b475)}.att-code-H{background:light-dark(#ddebff,#243149);color:light-dark(#115ac0,#75a8f0)}.att-code-LV{background:light-dark(#eee2ff,#243149);color:light-dark(#202936,#edf1f8)}.att-code-WO{background:light-dark(#e9edf3,#243149);color:light-dark(#202936,#edf1f8)}.att-code-PH{background:light-dark(#dcf5f4,#243149);color:light-dark(#167976,#7ee7e4)}.att-code-MP{background:light-dark(#ffe5d5,#243149);color:light-dark(#a94619,#eb9d7a)}.att-code-NC{background:light-dark(#f3f5f8,#1b2537);color:light-dark(#202936,#edf1f8);border-color:light-dark(#e7ebf0,#354158)}.att-code:hover{border-color:currentColor}.att-total{font-variant-numeric:tabular-nums;color:light-dark(#202936,#edf1f8)}.att-total-absent{color:light-dark(#cc2541,#e87d8f)}.att-total-late{color:light-dark(#bd6816,#efb176)}.att-row-action{display:inline-flex;align-items:center;justify-content:center;gap:5px;border:1px solid light-dark(#dce4ef,#354158);border-radius:5px;padding:6px 9px;text-decoration:none;font-size:10px;color:light-dark(#202936,#edf1f8);background:white}.att-row-action svg{width:13px;height:13px}.att-register-footer{padding:15px 18px;font-size:11px;color:light-dark(#202936,#edf1f8)}.att-register-footer p{margin:0}.att-legend{display:flex;flex-wrap:wrap;gap:14px;margin:18px 0}.att-legend>span{display:flex;align-items:center;gap:6px;font-size:10px;color:light-dark(#202936,#edf1f8)}.att-legend .att-code{height:23px;min-width:23px;font-size:9px}.att-report-note{font-size:11px}.att-mobile-register{display:none}.att-detail-drawer{width:min(1250px,calc(100vw - 38px));max-width:none;max-height:85vh;border:1px solid light-dark(#d5e4f8,#354158);border-radius:14px;padding:0;color:light-dark(#202936,#edf1f8);box-shadow:0 18px 80px light-dark(#13233c40,#00000040)}.att-detail-drawer::backdrop{background:light-dark(#1226416b,#1226416b);backdrop-filter:blur(2px)}.att-drawer-top{display:flex;justify-content:space-between;align-items:center;padding:13px 22px;background:light-dark(#edf5ff,#1b2537);border-bottom:1px solid light-dark(#dbe6f5,#354158);font-size:12px;position:sticky;top:0;z-index:2}.att-drawer-top button{font-size:24px;line-height:1;background:transparent;border:0;color:light-dark(#202936,#edf1f8);cursor:pointer}.att-day-detail{padding:22px}.att-day-detail>header{margin-bottom:22px}.att-day-detail h2{font-size:18px;margin:0}.att-day-detail header p{font-size:11px;color:light-dark(#465264,#b7c4d8);margin:7px 0 0}.att-detail-grid{display:grid;grid-template-columns:1.4fr 1fr 1fr 1fr;gap:14px}.att-detail-grid>section{padding:16px;border:1px solid var(--att-line);border-radius:8px;background:light-dark(#fff,#1b2537);min-width:0}.att-detail-grid h3{display:flex;gap:7px;font-size:12px;margin:0 0 16px}.att-timeline{padding:0;margin:0;list-style:none}.att-timeline li{display:flex;align-items:start;gap:10px;padding:11px 0;position:relative;font-size:11px;border-bottom:1px solid light-dark(#eef2f8,#354158)}.att-timeline li strong{font-size:10px;white-space:nowrap;min-width:49px}.att-timeline li small{display:block;margin-top:6px;color:light-dark(#465264,#b7c4d8);font-size:10px;overflow-wrap:anywhere}.att-timeline-dot{width:10px;height:10px;border-radius:50%;background:light-dark(#18ac7b,#18ac7b);flex:none}.att-timeline-dot.is-out{background:light-dark(#ed7a63,#592b22)}.att-facts{margin:0;font-size:10px}.att-facts>div{display:flex;gap:10px;justify-content:space-between;border-bottom:1px solid light-dark(#eef2f7,#354158);padding:9px 0}.att-facts dt{color:light-dark(#465264,#b7c4d8)}.att-facts dd{margin:0;text-align:right;font-weight:600}.att-location-evidence{font-size:10px;padding:8px 0;border-bottom:1px solid light-dark(#eef2f7,#354158);overflow-wrap:anywhere}.att-location-evidence p{color:light-dark(#465264,#b7c4d8)}.att-location-evidence a{display:block;margin:7px 0}.att-detail-actions{display:flex;flex-direction:column;gap:8px}.att-remarks{font-size:12px;color:light-dark(#202936,#edf1f8);white-space:pre-wrap}.att-history{border-top:1px solid var(--att-line);padding:13px 0;font-size:12px}.att-history summary{cursor:pointer;font-weight:650;color:light-dark(#202936,#edf1f8)}.att-history pre,.att-settings-content pre{white-space:pre-wrap;overflow-wrap:anywhere;background:light-dark(#f5f8fc,#1b2537);padding:16px;font-size:11px;max-height:400px;overflow:auto}.att-two-columns{display:grid;grid-template-columns:1fr 1fr;gap:18px;align-items:start}.att-stat-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:18px 0}.att-stat{display:flex;gap:16px;padding:23px;border:1px solid var(--att-line);border-radius:10px;background:white;text-decoration:none;color:light-dark(#202936,#edf1f8)}.att-stat>span{background:light-dark(#e6f1ff,#1b2537);color:light-dark(#3779d2,#82abe3);border-radius:10px;width:45px;height:45px;display:grid;place-items:center}.att-stat-absent>span{background:light-dark(#ffe7eb,#1b2537);color:light-dark(#c9465c,#dc8997)}.att-stat-late>span{background:light-dark(#fff2d5,#243149);color:light-dark(#ad771a,#ebc17a)}.att-stat-exceptions>span{background:light-dark(#f0e9ff,#1b2537);color:light-dark(#465264,#b7c4d8)}.att-stat small{display:block;font-size:11px;color:light-dark(#465264,#b7c4d8)}.att-stat strong{display:block;font-size:29px;margin:7px 0}.att-distribution>div{display:grid;grid-template-columns:120px 1fr 35px;gap:14px;align-items:center;margin:18px 0;font-size:12px}.att-distribution meter{width:100%;height:14px;accent-color:light-dark(#287be2,#223a59)}.att-big-number{font-size:40px;color:light-dark(#246cce,#7daae8);margin:10px 0 25px}.att-big-number small{display:block;font-size:12px;color:light-dark(#465264,#b7c4d8);margin-top:9px}.att-ess-hero{display:flex;justify-content:space-between;gap:20px;background:linear-gradient(110deg,light-dark(#143c73,#143c73),light-dark(#2479cb,#2479cb));color:white;border-radius:12px;padding:30px;margin-bottom:20px}.att-ess-hero h2{font-size:25px;margin:6px 0 12px}.att-ess-hero p{color:light-dark(#d6e8ff,#d6e8ff);font-size:12px}.att-ess-hero strong{font-size:38px;display:block}.att-ess-hero small{display:block;color:light-dark(#d6e8ff,#d6e8ff);margin-top:9px}.att-punch-actions,.att-checkboxes{display:flex;flex-wrap:wrap;gap:10px}.att-checkboxes label{display:flex;align-items:center;gap:7px}.att-inline-form{display:flex;align-items:end;gap:12px;flex-wrap:wrap;margin:13px 0;padding:12px;background:light-dark(#f7faff,#1b2537);border-radius:8px}.att-inline-form label{flex:1 1 180px;margin:0}.att-inline-form button{margin-bottom:1px}.att-request-list article{border:1px solid var(--att-line);border-radius:10px;padding:20px;margin-bottom:15px;font-size:12px}.att-request-list article header p{color:light-dark(#465264,#b7c4d8)}.att-report-catalog{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:20px}.att-report-catalog a{display:flex;gap:6px;align-items:center;border:1px solid var(--att-line);padding:9px 12px;border-radius:7px;font-size:11px;color:light-dark(#202936,#edf1f8);text-decoration:none;background:white}.att-report-catalog a.active{color:light-dark(#1769e8,#75a5f0);background:light-dark(#eaf3ff,#1b2537);border-color:light-dark(#a7c9f8,#354158)}.att-settings-layout{display:grid;grid-template-columns:210px minmax(0,1fr);gap:20px;align-items:start}.att-settings-nav{background:white;border:1px solid var(--att-line);border-radius:10px;padding:15px;position:sticky;top:20px;display:flex;flex-direction:column;gap:4px}.att-settings-nav a{display:flex;gap:8px;font-size:12px;padding:9px;color:light-dark(#202936,#edf1f8);border-radius:6px;text-decoration:none}.att-settings-nav a:hover{background:light-dark(#edf5ff,#1b2537);color:light-dark(#1769e8,#75a5f0)}.att-settings-section{border:1px solid var(--att-line);border-radius:9px;padding:18px;scroll-margin-top:25px}.att-settings-section legend{font-size:13px;font-weight:700;padding:0 8px}.att-settings-section[hidden],.attendance-workspace [hidden]{display:none!important}.att-settings-content details{border-bottom:1px solid var(--att-line);padding:12px 0;font-size:12px}.att-settings-content details summary{cursor:pointer}.att-settings-content details form{margin-top:20px}.att-settings-content .panel{scroll-margin-top:25px}.att-live-notice{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.att-live-notice label{margin:0 0 0 auto;display:flex;gap:8px;align-items:center}.attendance-workspace .table-scroll td{font-size:12px}.attendance-workspace .panel{margin-bottom:20px}.attendance-workspace .panel-heading h2{display:flex;align-items:center;gap:7px;font-size:15px}.attendance-workspace .panel-heading>span{font-size:11px;color:light-dark(#465264,#b7c4d8)}.attendance-workspace .table-scroll td small{display:block;color:light-dark(#465264,#b7c4d8);margin-top:5px}.attendance-workspace .form-grid{gap:16px}.attendance-workspace .form-span{grid-column:1/-1}.attendance-workspace .hint{line-height:1.7}.attendance-workspace fieldset{min-width:0}.attendance-workspace .table-scroll{max-width:100%}
@media(max-width:1250px){.att-filter-fields{grid-template-columns:repeat(3,minmax(0,1fr))}.att-stat{padding:16px;gap:10px}.att-detail-grid{grid-template-columns:1fr 1fr}.att-settings-layout{grid-template-columns:180px minmax(0,1fr)}}
@media(max-width:800px){.att-page-heading{align-items:start}.att-page-heading h1{font-size:23px}.att-page-heading p span{display:block;padding:5px 0}.att-register-toolbar{align-items:stretch;flex-direction:column}.att-view-tabs{overflow:auto}.att-view-tabs a{white-space:nowrap;flex:1;text-align:center;padding:8px 10px}.att-toolbar-tools{justify-content:end}.att-filter-fields{grid-template-columns:repeat(2,minmax(0,1fr))}.att-advanced-filters .form-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.att-stat-grid{grid-template-columns:repeat(2,1fr)}.att-two-columns{grid-template-columns:1fr}.att-settings-layout{grid-template-columns:1fr}.att-settings-nav{position:static;display:flex;flex-direction:row;flex-wrap:wrap}.att-settings-nav label{width:100%}.att-settings-nav a{padding:7px}.att-register-caption{align-items:start}.att-register-caption>div{flex-wrap:wrap}.att-register-caption>span{max-width:110px;text-align:right}.att-register-footer{align-items:start;flex-direction:column}.att-bulk-bar input{flex:1}.att-day-detail{padding:16px}.att-detail-drawer{width:calc(100vw - 16px);max-height:92vh}.att-request-list article>header{align-items:start}.att-ess-hero{padding:22px}.att-ess-hero strong{font-size:28px}}
@media(max-width:600px){.att-page-heading{flex-direction:column;gap:12px}.att-module-nav{margin-bottom:16px}.att-filter-panel{padding:13px}.att-filter-fields{grid-template-columns:1fr 1fr;gap:8px}.att-filter-fields>label:nth-last-of-type(1),.att-filter-actions{grid-column:1/-1}.att-filter-actions .button{flex:1}.att-date-range{gap:8px}.att-date-range label{flex:1 1 42%;min-width:0}.att-advanced-filters .form-grid{grid-template-columns:1fr}.att-matrix-scroll{display:none}.att-bulk-bar{display:none}.att-mobile-register{display:block}.att-mobile-register article{padding:16px;border-top:1px solid var(--att-line)}.att-mobile-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:7px;margin-top:16px}.att-mobile-day{display:flex;align-items:center;flex-direction:column;gap:5px;text-decoration:none}.att-mobile-day>small{font-size:9px;color:light-dark(#465264,#b7c4d8)}.att-mobile-register footer{display:flex;gap:10px;justify-content:space-between;margin-top:16px;font-size:10px;color:light-dark(#465264,#b7c4d8)}.att-mobile-register footer strong{color:light-dark(#202936,#edf1f8)}.att-detail-grid{grid-template-columns:1fr}.att-day-detail>header{align-items:start}.att-day-detail h2{font-size:16px}.att-ess-hero{flex-direction:column}.att-stat{padding:14px;align-items:start}.att-stat>span{width:30px;height:30px}.att-stat strong{font-size:24px}.att-stat small{font-size:10px}.att-distribution>div{grid-template-columns:100px 1fr 25px;gap:8px}.att-presets form{flex-wrap:wrap}.att-settings-content .form-grid,.attendance-workspace form.form-grid{grid-template-columns:1fr}.att-view-tabs{width:100%}.att-view-tabs a{font-size:10px;padding:8px 6px}.att-live-notice label{margin:0}}

.att-employee-focus{padding:18px;background:light-dark(#f4f8ff,#1b2537)}.att-employee-ledger{width:100%}.att-list-filter{display:flex;gap:10px;align-items:end}.att-list-filter label{flex:1;margin:0}.att-list-filter .button{margin-bottom:0}

.att-list-filter{flex-wrap:wrap}.att-list-filter label{min-width:0}@media(max-width:600px){.att-list-filter label{flex-basis:100%}.att-list-filter .button{flex:1}}

.att-detail-drawer{margin:auto}.attendance-workspace .att-history{padding:13px 0;margin:0}.att-detail-grid>section{margin:0}

.att-detail-drawer{position:fixed;inset:0 0 0 auto;margin:0;height:100dvh;max-height:100dvh;width:min(1180px,100vw);border-radius:12px 0 0 12px}