.mobile-time{max-width:860px;margin:0 auto;min-width:0;padding-bottom:max(18px,env(safe-area-inset-bottom))}
.mobile-time .card{margin-bottom:14px;min-width:0;overflow-wrap:anywhere}
.clock-page-intro{margin:0 0 12px;padding:0 2px;color:var(--muted);font-size:14px}
.mobile-time h2,.mobile-time h3{margin-top:0}
.mobile-time h2{font-size:clamp(22px,5vw,30px);overflow-wrap:anywhere}
.mobile-time input,.mobile-time select{box-sizing:border-box;width:100%;max-width:100%;min-height:48px;font-size:16px}
.mobile-time label{display:block;margin-top:14px;margin-bottom:6px}
.mobile-time button.big-action{width:100%;min-height:52px;white-space:normal;margin-top:12px;font-size:17px}
.mobile-time button:disabled{opacity:.55;cursor:not-allowed}
.mobile-time button:focus-visible,.mobile-time input:focus-visible,.mobile-time select:focus-visible{outline:3px solid var(--gold);outline-offset:3px}
.clock-current{border-left:4px solid #c9a227}
.clock-current.is-active{background:#1d1d1d;color:#fff;border-color:#1d1d1d;box-shadow:inset 4px 0 0 var(--gold)}
.clock-current.is-active p{color:#ddd}
.mobile-time .clock-timer{font-size:clamp(34px,9vw,50px);font-variant-numeric:tabular-nums;font-weight:800;margin:14px 0 8px}
.mobile-time .clock-label{display:block;font-weight:800;letter-spacing:.08em;color:#806600;font-size:12px;margin-bottom:6px}
.clock-current.is-active .clock-label{color:#f0c640}
.mobile-time .clock-connection,.mobile-time .clock-selection,.mobile-time .clock-more{font-size:13px;line-height:1.45}
.mobile-time .clock-selection{min-height:20px;margin:8px 0 0}
.mobile-time .clock-more{margin:4px 0 0;color:var(--muted)}
.clock-toolbar{display:flex;align-items:center;gap:10px;justify-content:space-between;margin:4px 0 14px}
.clock-toolbar .clock-message{flex:1;min-height:20px;margin:0;font-size:13px;line-height:1.4;overflow-wrap:anywhere}
.clock-refresh{flex:0 0 auto;min-height:42px}
.clock-history-card{padding-bottom:12px!important}
.clock-history-head{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}
.clock-history-head h3{margin:0 0 3px}
.clock-history-head p{margin:0;font-size:13px}
.clock-summary{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0 6px}
.clock-summary>div{border:1px solid var(--line);border-radius:10px;padding:11px 12px;background:#fafafa}
.clock-summary span{display:block;color:var(--muted);font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.04em}
.clock-summary b{display:block;margin-top:3px;font-size:19px;font-variant-numeric:tabular-nums}
.clock-day{margin-top:16px;border-top:1px solid var(--line)}
.clock-day:first-child{margin-top:10px}
.clock-day-head{display:flex;justify-content:space-between;align-items:center;padding:11px 0 6px;font-size:13px}
.clock-day-head span{color:var(--muted);font-weight:700;font-variant-numeric:tabular-nums}
.clock-history-row{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:12px;align-items:center;padding:11px 0;border-bottom:1px solid var(--line)}
.clock-history-row:last-child{border-bottom:0}
.clock-history-row.voided{opacity:.58}
.clock-history-main{min-width:0}
.clock-history-job{display:flex;align-items:baseline;gap:8px;min-width:0}
.clock-history-job strong{font-size:15px;white-space:nowrap}
.clock-history-job span{min-width:0;color:#555;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clock-history-address,.clock-history-time,.clock-history-note{margin:3px 0 0!important;font-size:13px;line-height:1.35!important}
.clock-history-address{color:#333}
.clock-history-time{color:var(--muted)}
.clock-history-note{color:#555;background:#f7f7f8;border-radius:7px;padding:6px 8px}
.clock-history-hours{font-size:16px;font-weight:800;font-variant-numeric:tabular-nums;white-space:nowrap}
.clock-history-toggle{width:100%;min-height:44px;margin-top:14px}
@media(max-width:600px){
  .mobile-time .card{padding:15px}
  .clock-page-intro{font-size:13px}
  .clock-summary>div{padding:10px}
  .clock-history-row{gap:8px;padding:10px 0}
  .clock-history-job{display:block}
  .clock-history-job span{display:block;margin-top:2px;white-space:normal}
  .clock-history-hours{font-size:15px}
  .clock-toolbar{align-items:flex-start}
}

.clock-account-group{margin:6px 0 10px;padding-left:10px;border-left:2px solid var(--line)}
.clock-account-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:7px 0 4px;font-size:12px;text-transform:uppercase;letter-spacing:.035em}
.clock-account-head strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.clock-account-head span{color:var(--muted);font-weight:700;font-variant-numeric:tabular-nums;white-space:nowrap}
.mobile-time select optgroup{font-weight:800}
.mobile-time select option{font-weight:400}
