/* Quiet, touch-friendly cardio catalogue and session screens. */
.cardio-library-tabs { display:flex; gap:24px; border-bottom:1px solid var(--line); margin:0 0 24px; }
.cardio-library-tabs a { min-height:44px; display:flex; align-items:center; color:var(--muted); border-bottom:2px solid transparent; text-decoration:none; font-size:var(--text-15); }
.cardio-library-tabs a[aria-current] { color:var(--ink); border-color:var(--ink); font-weight:600; }
.cardio-picker { min-width:0; max-width:680px; }
.cardio-search { display:flex; align-items:center; gap:10px; border:1px solid var(--line); border-radius:var(--radius-l); padding:0 12px; min-height:48px; background:var(--paper); }
.cardio-search svg { width:20px; height:20px; flex-shrink:0; }
.cardio-search input { min-width:0; width:100%; padding:12px 0; border:0; background:transparent; font:inherit; font-size:var(--text-16); color:inherit; outline:0; }
.cardio-search:focus-within { outline:2px solid var(--muted); outline-offset:2px; }
.cardio-filters { display:flex; gap:7px; max-width:100%; min-width:0; overflow-x:auto; overscroll-behavior-x:contain; margin:14px 0 0; padding:0 2px 8px; }
.cardio-filters .filter-chip { flex-shrink:0; min-height:44px; }
.cardio-count { margin:6px 0 4px; font-size:var(--text-12); color:var(--muted); }
.cardio-options { display:grid; }
.cardio-option { display:flex; align-items:center; justify-content:space-between; gap:16px; width:100%; min-width:0; min-height:68px; padding:14px 2px; border:0; border-bottom:1px solid var(--line); background:transparent; color:inherit; text-align:left; cursor:pointer; }
.cardio-option span { min-width:0; }
.cardio-option strong { display:block; font-size:var(--text-15); line-height:1.4; font-weight:550; overflow-wrap:anywhere; }
.cardio-option small { display:block; font-size:var(--text-12); line-height:1.5; color:#7a8491; margin-top:3px; }
.cardio-option svg { width:18px; height:18px; flex-shrink:0; color:#8c95a1; }
.cardio-option:focus-visible { outline:2px solid var(--muted); outline-offset:-2px; border-radius:var(--radius-m); }
.cardio-empty { display:grid; justify-items:start; padding:20px 0; gap:8px; }
.cardio-intro { color:var(--muted); }
.cardio-intro-actions { display:grid; grid-template-columns:1fr; }
.cardio-kicker { font-size:var(--text-12); color:var(--muted); margin:0 0 6px; }
.cardio-session .session-scroll { padding-bottom:24px; }
.cardio-clock { text-align:center; padding:28px 0 32px; }
.cardio-clock [role="timer"] { display:block; font-size:clamp(42px,12vw,64px); font-variant-numeric:tabular-nums; font-weight:500; line-height:1.2; letter-spacing:-2px; }
.cardio-clock p { color:#7a8491; font-size:var(--text-13); margin:8px 0 20px; }
.cardio-clock button { min-width:150px; }
.cardio-session .form-input, .cardio-entry-form .form-input { font-size:var(--text-16); width:100%; min-width:0; }
.cardio-extra { margin:18px 0; }
.cardio-extra summary { min-height:44px; padding:12px 0; font-size:var(--text-14); color:var(--muted); cursor:pointer; }
.cardio-extra .form-field { margin-top:12px; }
.cardio-entry-form { display:grid; gap:16px; }
.cardio-entry-form .form-field { margin-bottom:0; }
.cardio-entry-form .cardio-extra { margin:0; }
.cardio-entry-form input[type="date"] { min-width:0; min-height:48px; display:block; appearance:none; -webkit-appearance:none; }
.cardio-entry-form input[type="date"]::-webkit-date-and-time-value { text-align:left; }
.cardio-optional { color:#87909b; font-weight:400; font-size:var(--text-12); }
.cardio-result { font-size:var(--text-24); font-weight:500; font-variant-numeric:tabular-nums; }
.cardio-detail-notes { white-space:pre-wrap; overflow-wrap:anywhere; margin-top:18px; color:var(--muted); }
.cardio-session .button, .cardio-entry-form .button, .cardio-session .text-button, .cardio-intro-actions .button { min-height:44px; touch-action:manipulation; }
#modal:has(.cardio-picker) { width:640px; max-width:calc(100vw - 20px); }
@media (max-width:720px) {
 .cardio-library-tabs { margin-bottom:18px; }
 .cardio-picker { width:100%; }
 .cardio-entry-form { padding-bottom:max(24px,env(safe-area-inset-bottom)); }
 .cardio-session h2 { font-size:var(--text-20); overflow-wrap:anywhere; }
 .cardio-clock { padding-top:24px; }
 .workout-row[data-cardio] .workout-numbers { font-size:var(--text-12); }
}

@media (max-width:700px), (max-width:1200px) and (max-height:600px) {
  #modal.modal-page:has(.cardio-picker) { width:100%; max-width:none; }
}
