/* Shift controls and timesheets stay inside narrow phone screens. */
.att-actions,.att-state{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:10px 0}
.att-actions .btn{flex:0 1 auto;max-width:100%;white-space:normal;overflow-wrap:anywhere}
.att-metrics{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin:14px 0}
.att-metrics dt{color:var(--nt-ink2);font-size:12px}.att-metrics dd{margin:2px 0;overflow-wrap:anywhere}
.att-record{border:1px solid var(--nt-line);border-radius:12px;padding:14px;margin:12px 0;min-width:0}
.att-record>.btn{margin:12px 0}.att-audit{padding:10px 0;border-top:1px solid var(--nt-line)}
.att-audit pre{white-space:pre-wrap;overflow-wrap:anywhere;font-size:12px}
.att-filter{display:flex;flex-wrap:wrap;align-items:center;gap:10px}.att-filter select{width:auto;max-width:100%}
.att-break{padding:12px 0;border-bottom:1px solid var(--nt-line)}.att-break .btn{justify-self:start}
#att-correction .modal-body{padding:18px;min-width:0}
#att-correction [hidden],#att-error:empty{display:none!important}
@media(max-width:480px){.att-actions .btn{flex:1 1 120px}.att-metrics{grid-template-columns:minmax(0,1fr)}}