.attendance{gap:18px}.att-intro{display:flex;align-items:center;justify-content:space-between;gap:16px;border-left:3px solid var(--red);padding:2px 0 2px 16px}.att-intro b{font-size:16px}.att-intro p{font-size:12px;color:var(--sub);margin-top:3px}.att-timezone{font-size:11px;color:var(--sub)}.att-intro .form-field{margin:0;min-width:150px}.att-intro select{border:1px solid var(--line);background:white;border-radius:5px;padding:7px 10px}.att-stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));background:white;border:1px solid var(--line);border-radius:8px}.att-stats>div{padding:18px 22px}.att-stats>div+div{border-left:1px solid var(--line)}.att-stats span,.att-stats small{display:block;color:var(--sub);font-size:11px}.att-stats strong{font-size:25px;line-height:1.7;font-variant-numeric:tabular-nums}.att-stats>div:nth-child(2) strong{color:var(--teal)}.att-stats>div:last-child strong{font-size:23px}.att-tabs{display:flex;border-bottom:1px solid #dce1e6;gap:22px}.att-tabs button{font-size:13px;background:transparent;color:var(--sub);padding:11px 4px;border-bottom:3px solid transparent}.att-tabs button.active{color:var(--red);font-weight:700;border-bottom-color:var(--red)}.att-employee-list{padding:0 22px}.att-employee{display:grid;grid-template-columns:minmax(150px,1fr) minmax(200px,1.2fr) auto;gap:20px;align-items:center;padding:20px 0;border-top:1px solid var(--line)}.att-person{display:flex;gap:12px;align-items:center;min-width:0}.att-avatar{display:grid;place-items:center;background:#f0f3f6;border:1px solid var(--line);width:42px;height:42px;border-radius:50%;font-size:16px;color:#64717c;flex-shrink:0}.att-person h3{font-size:14px;overflow-wrap:anywhere}.att-person small{font-size:11px;color:var(--sub);overflow-wrap:anywhere}.att-shift p{font-size:11px;color:var(--sub);margin-top:4px}.att-person-actions{display:flex;gap:8px}.att-person-actions .button{min-width:78px}.att-panel-foot{font-size:11px;color:var(--sub);background:#fafbfc;border-top:1px solid var(--line);padding:12px 22px}.att-empty{text-align:center;padding:30px 20px 36px}.att-clock{display:block;font-size:48px;line-height:1.3;color:var(--teal);margin-bottom:10px}.att-empty h3{font-size:17px}.att-empty p{font-size:12px;color:var(--sub);margin:6px auto 18px;max-width:290px}.att-storage{font-size:11px;color:var(--sub)}.att-filters label{display:grid;gap:4px;color:var(--sub);font-size:11px}.att-filters input{width:170px;min-width:0;flex:none}.att-filters select{min-width:150px;max-width:250px}.att-filters{align-items:end}.att-filters>.button{margin-left:auto}.att-note-cell{white-space:normal;min-width:180px;max-width:280px;overflow-wrap:anywhere}.att-note-cell small{margin-top:4px}.att-form-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}.att-form-grid input{width:100%}.att-form-error{font-size:12px;color:var(--red);margin-top:12px}.att-audit{font-size:11px;color:var(--sub);margin-top:14px}.att-audit li{margin-top:8px;overflow-wrap:anywhere}.att-audit small{display:block}.att-shortcut{display:flex;align-items:center;justify-content:space-between;padding:18px 22px;margin-bottom:20px;gap:12px}.att-shortcut h2{font-size:15px}.att-shortcut p{font-size:11px;color:var(--sub);margin-top:3px}.att-shortcut .button{white-space:nowrap}
@media(max-width:1000px){.att-stats>div{padding:16px}.att-stats strong,.att-stats>div:last-child strong{font-size:21px}.att-employee{grid-template-columns:1fr 1fr}.att-person-actions{grid-column:1/-1;justify-content:flex-end}}
@media(max-width:760px){.attendance{gap:16px}.att-intro b{font-size:14px}.att-intro p{font-size:11px}.att-timezone{display:none}.att-stats{grid-template-columns:repeat(2,minmax(0,1fr))}.att-stats>div{padding:14px 16px}.att-stats>div:nth-child(3){border-left:0}.att-stats>div:nth-child(n+3){border-top:1px solid var(--line)}.att-stats strong,.att-stats>div:last-child strong{font-size:21px}.att-stats small{font-size:9px}.att-tabs{gap:0;justify-content:space-between}.att-tabs button{font-size:12px;padding:10px 6px}.att-employee-list{padding:0 16px}.att-employee{gap:12px;padding:16px 0;grid-template-columns:1fr auto}.att-shift{max-width:175px;text-align:right}.att-shift p{font-size:10px}.att-person-actions{justify-content:stretch}.att-person-actions>.button{flex:1;min-height:40px}.att-panel-foot{padding:12px 16px;font-size:10px}.att-filters label{flex:1;min-width:0}.att-filters input,.att-filters select{width:100%;min-width:0;max-width:none}.att-filters>.button{margin:2px 0 0;width:100%}.att-intro{flex-wrap:wrap}.att-intro .form-field{width:100%}.att-form-grid{grid-template-columns:1fr;gap:0}.att-form-grid input{min-width:0}.att-storage{font-size:10px}.att-shortcut{padding:16px;margin-bottom:16px}.att-shortcut h2{font-size:14px}.attendance .table-wrap .button{min-height:36px}}