#tool .field{align-content:start}
.hc-days{display:grid;gap:6px;margin-top:4px}
.hc-day,.hc-head{display:grid;gap:6px;align-items:center;grid-template-columns:minmax(0,1fr) minmax(0,1fr) 76px;
  grid-template-areas:"day tot add" "in out brk" "in2 out2 ."}
.hc-head{grid-template-areas:"in out brk";font-size:12px;color:var(--muted);font-weight:600}
.hc-head .hc-c-tot{display:none}
.hc-day{padding:10px 0;border-top:1px solid var(--border)}
.hc-day.off .hc-dn,.hc-day.off .hc-tot{color:var(--muted)}
.hc-dn{grid-area:day;font-weight:700}
.hc-tot{grid-area:tot;text-align:right;font-variant-numeric:tabular-nums;font-weight:700;white-space:nowrap}
.hc-tot small{display:block;font-weight:500;color:var(--muted);font-size:12px}
.hc-tot .ot{color:var(--bad)}
.hc-add{grid-area:add;min-height:34px;padding:0 8px;font-size:13px}
.hc-day .input{min-width:0;padding-left:8px;padding-right:8px}
.hc-day input[type=time]{display:block;width:100%;padding-left:6px;padding-right:4px}
@media (max-width:639px){.hc-day input[type=time]::-webkit-calendar-picker-indicator{display:none}.hc-day{padding:8px 0}}
.hc-i1{grid-area:in}.hc-o1{grid-area:out}.hc-b{grid-area:brk}.hc-i2{grid-area:in2}.hc-o2{grid-area:out2}
.hc-b .input{padding-right:38px}
.hc-b>span{right:8px;font-size:13px}
.hc-day:not(.s2) .hc-i2,.hc-day:not(.s2) .hc-o2{display:none}
.hc-c-in{grid-area:in}.hc-c-out{grid-area:out}.hc-c-brk{grid-area:brk}
@media (min-width:640px){
  .hc-day,.hc-head{grid-template-columns:52px minmax(0,1fr) minmax(0,1fr) 92px 84px 92px;grid-template-areas:"day in out brk tot add" ". in2 out2 . . ."}
  .hc-head{grid-template-areas:". in out brk tot ."}
  .hc-head .hc-c-tot{display:block;grid-area:tot;text-align:right}
}
.hc-opts{display:grid;gap:10px;max-width:480px}
.hc-opt{display:grid;grid-template-columns:minmax(0,1fr) 120px;gap:10px;align-items:center}
.hc-stats b{font-variant-numeric:tabular-nums}
.hc-actions{flex-wrap:wrap}
#hc-table td,#hc-table th{white-space:nowrap}
#hc-table td.ot{color:var(--bad)}
#hc-table tfoot td{font-weight:700}
@media print{
  .hc-actions,.hc-add,#hc-fill,.tool-head p,.app-promo{display:none!important}
  .hc-day input{border:0}
}
#hc-pay dd small{display:block;font-size:12px;font-weight:500;color:var(--muted)}
