.attendance-toolbar{display:flex;align-items:end;justify-content:space-between;gap:16px;flex-wrap:wrap;margin:20px 0}.attendance-month{display:grid;gap:7px;font-size:13px;color:#536475}.attendance-month input{width:185px}.attendance-rule{background:#f0f7fb;border:1px solid #dceaf1;border-radius:14px;padding:18px 20px;margin-bottom:20px;color:#4d6572;font-size:13px;line-height:1.65}.attendance-rule strong{font-size:14px;color:#223e4b}.attendance-rule p{margin:6px 0 0}.attendance-stats{display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:12px}.attendance-stat{display:flex;flex-direction:column;gap:11px;background:#fff;border:1px solid #e3e9ed;border-radius:13px;padding:16px}.attendance-stat span{font-size:13px;color:#637384}.attendance-stat strong{font-size:28px;line-height:1;font-variant-numeric:tabular-nums;color:#263e4b}.attendance-stat.late strong{color:#b58119}.attendance-stat.missing strong{color:#bd5060}.attendance-stat.pending strong{color:#637d9a}.attendance-stat.onTime strong{color:#2b8063}.attendance-completion{display:flex;justify-content:space-between;gap:14px;align-items:center;margin:16px 0 30px;padding:14px 4px;color:#365369;font-size:14px}.attendance-completion span{font-size:12px;color:#748492;line-height:1.6}.attendance-team,.attendance-exceptions,#attendance-person-days{margin:26px 0}.attendance-team h2,.attendance-exceptions h2,.attendance-day-heading h2{font-size:17px;margin:0 0 14px}.attendance-table-scroll{overflow-x:auto;border:1px solid #e0e6eb;border-radius:12px;background:white}.attendance-table{width:100%;min-width:690px;border-collapse:collapse;font-size:13px;white-space:nowrap}.attendance-table th,.attendance-table td{text-align:left;padding:14px 16px;border-bottom:1px solid #edf0f3}.attendance-table thead th{font-weight:500;color:#657384;background:#f7f9fb}.attendance-table tbody tr:last-child th,.attendance-table tbody tr:last-child td{border-bottom:0}.attendance-table tbody th{font-weight:500;color:#2e4557}.attendance-table .selected{background:#f0f7fc}.attendance-missing-count{font-weight:650;color:#bd5060}.attendance-day-heading{display:flex;justify-content:space-between;gap:12px;align-items:baseline}.attendance-days{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}.attendance-day{background:#fff;border:1px solid #e2e8ed;border-radius:12px;padding:15px;display:flex;flex-direction:column;gap:10px;min-height:128px;min-width:0}.attendance-day>div{display:flex;justify-content:space-between;align-items:center;gap:8px}.attendance-day>div>strong{font-size:14px;color:#2b4052}.attendance-day>div>span{font-size:12px;color:#87939e}.attendance-day-status{font-size:13px;font-weight:550;color:#6e7d8b}.attendance-day small{font-size:11px;color:#84929e;line-height:1.5;overflow-wrap:anywhere}.attendance-day .text-button{align-self:start;margin-top:auto;font-size:12px;padding:0}.attendance-day.onTime{border-color:#cfe5da}.attendance-day.onTime .attendance-day-status{color:#2b8063}.attendance-day.late{background:#fffaf0;border-color:#eedebc}.attendance-day.late .attendance-day-status{color:#aa791a}.attendance-day.missing{background:#fff7f7;border-color:#eed7db}.attendance-day.missing .attendance-day-status{color:#bd5060}.attendance-day.leave{background:#f3f7ff;border-color:#d8e3f4}.attendance-day.leave .attendance-day-status{color:#5a75a5}.attendance-day.rest,.attendance-day.notStarted{background:#f6f8fa;border-color:#e7ebef}.attendance-day.notStarted{opacity:.78}.attendance-exception-list{display:grid;gap:9px}.attendance-exception-list article{display:flex;justify-content:space-between;gap:16px;background:white;border:1px solid #e0e7ed;border-radius:12px;padding:16px}.attendance-exception-list article>div{display:flex;flex-direction:column;gap:7px;min-width:0}.attendance-exception-list strong{font-size:14px;color:#385167}.attendance-exception-list span,.attendance-exception-list p{font-size:12px;color:#728292;margin:0;overflow-wrap:anywhere}.attendance-remove{flex-shrink:0;align-self:center}.attendance-rule-fields{display:grid;grid-template-columns:1fr 1fr;gap:16px}.attendance-workdays{border:1px solid #e2e8ed;border-radius:12px;padding:18px 14px;display:flex;gap:14px;flex-wrap:wrap;margin:0 0 25px}.attendance-workdays legend{font-size:14px;padding:0 8px;color:#425b6c}.attendance-workdays label{display:flex;gap:7px;align-items:center;font-size:13px}.attendance-workdays input,.attendance-member-row input[type=checkbox]{width:17px;height:17px;flex-shrink:0;accent-color:#267a98}.attendance-members h3{font-size:15px;margin:8px 0}.attendance-members>.hint{margin:0 0 12px;line-height:1.7}.attendance-member-row{display:flex;justify-content:space-between;align-items:center;gap:12px;padding:12px 0;border-bottom:1px solid #edf0f3}.attendance-member-row>label:first-child{display:flex;align-items:center;gap:10px;min-width:0;font-size:14px}.attendance-member-row>label:first-child>span{display:flex;flex-direction:column;gap:5px;overflow-wrap:anywhere}.attendance-member-row small{font-size:11px;color:#8a98a4}.attendance-member-date{display:flex;flex-direction:column;gap:5px;font-size:11px;color:#7d8c9a;flex-shrink:0}.attendance-member-date input{width:156px;font-size:13px;padding:10px;min-height:40px}.attendance-members{margin-bottom:25px}.attendance-member-date input:disabled{opacity:.48}.attendance-rule-fields input[type=date],.attendance-rule-fields input[type=time]{min-width:0;width:100%}.attendance-day-heading .hint{white-space:normal;text-align:right;font-size:11px}
@media(max-width:1100px){.attendance-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.attendance-days{grid-template-columns:repeat(3,minmax(0,1fr))}.attendance-completion{align-items:start;flex-direction:column;gap:8px}}
@media(max-width:640px){.attendance-toolbar{margin:15px 0;gap:10px;align-items:center}.attendance-toolbar .button{font-size:12px;padding:10px 12px}.attendance-month input{width:155px;min-height:42px}.attendance-rule{padding:14px;font-size:12px}.attendance-rule strong{font-size:13px}.attendance-stats{gap:8px}.attendance-stat{padding:13px 11px;gap:8px}.attendance-stat span{font-size:11px}.attendance-stat strong{font-size:24px}.attendance-days{grid-template-columns:repeat(2,minmax(0,1fr));gap:9px}.attendance-day{padding:12px;gap:8px;min-height:132px}.attendance-day-heading{align-items:start}.attendance-day-heading h2{font-size:15px}.attendance-team,.attendance-exceptions,#attendance-person-days{margin:22px 0}.attendance-rule-fields{grid-template-columns:1fr;gap:0}.attendance-member-date input{width:135px}.attendance-member-row>label:first-child{font-size:13px}.attendance-workdays{gap:12px}.attendance-exception-list article{padding:13px}.attendance-completion{margin:14px 0 24px}.attendance-table th,.attendance-table td{padding:12px}}
@media(max-width:360px){.attendance-toolbar{align-items:stretch;flex-direction:column}.attendance-toolbar .button{align-self:start}.attendance-stats{grid-template-columns:repeat(3,minmax(0,1fr))}.attendance-stat{padding:12px 8px}.attendance-member-row{gap:8px}.attendance-member-date input{width:125px}.attendance-member-row>label:first-child{gap:7px}.attendance-day{padding:11px}.attendance-day>div>span{font-size:11px}}
.attendance-day.ended{background:#f6f8fa;border-color:#e7ebef;color:#8b98a4}.attendance-ended-members{margin-top:18px;padding:14px;background:#f6f8fa;border:1px solid #e4e9ee;border-radius:10px}.attendance-ended-members h4{font-size:13px;margin:0 0 10px;color:#6b7d8d}.attendance-ended-members>div{display:flex;flex-direction:column;gap:5px;padding:7px 0}.attendance-ended-members strong{font-size:13px;color:#526879}.attendance-ended-members span{font-size:11px;color:#8a97a4;overflow-wrap:anywhere}

/* Team attendance is shown as member cards, with all statistics visible vertically. */
@media(max-width:720px){
  #attendance-workspace,.attendance-team,.attendance-exceptions,.attendance-stats,
  .attendance-days,.attendance-members,.attendance-month{min-width:0;max-width:100%}
  .attendance-rule,.attendance-stat,.attendance-completion,.attendance-day-heading,
  .attendance-ended-members{overflow-wrap:anywhere}
  .attendance-table-scroll{min-width:0;max-width:100%;overflow:visible;border:0;background:transparent}
  .attendance-table,.attendance-table tbody{display:block;width:100%;min-width:0;white-space:normal}
  .attendance-table thead{display:none}
  .attendance-table tbody{display:grid;gap:10px}
  .attendance-table tr{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 10px;border:1px solid #e0e6eb;border-radius:12px;background:#fff;padding:13px}
  .attendance-table tbody th{grid-column:1/-1;min-width:0;padding:0 0 9px;font-size:15px;overflow-wrap:anywhere}
  .attendance-table tbody td{min-width:0;padding:8px 0;border-bottom:0;overflow-wrap:anywhere}
  .attendance-table td::before{display:block;color:#7a8b9a;font-size:11px;margin-bottom:3px}
  .attendance-table td:nth-child(2)::before{content:"应交"}
  .attendance-table td:nth-child(3)::before{content:"按时"}
  .attendance-table td:nth-child(4)::before{content:"补交"}
  .attendance-table td:nth-child(5)::before{content:"缺交"}
  .attendance-table td:nth-child(6)::before{content:"待交"}
  .attendance-table td:nth-child(7)::before{content:"请假"}
  .attendance-table td:nth-child(8)::before{content:"完成率"}
  .attendance-table tbody td:last-child{grid-column:2/-1;justify-self:end;align-self:end;padding:3px 0}
  .attendance-table td .text-button{min-width:0;max-width:100%;white-space:normal}
  .attendance-day-heading{flex-wrap:wrap}
  .attendance-day-heading .hint{text-align:left}
  .attendance-day .text-button{white-space:normal;text-align:left}
  .attendance-rule-fields{grid-template-columns:minmax(0,1fr)}
  .attendance-member-row>label:first-child{flex:1;min-width:0}
  .attendance-member-row>label:first-child>span{min-width:0}
  .attendance-member-date{min-width:0}
  .attendance-member-date input{min-width:0;max-width:100%}
}
@media(max-width:400px){
  .attendance-member-row{flex-wrap:wrap;gap:7px}
  .attendance-member-row>label:first-child{flex-basis:100%;margin-bottom:0}
  .attendance-member-date{width:100%;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:10px;padding-left:27px;margin-bottom:0}
  .attendance-member-date input{width:155px;flex:0 1 155px}
}