/* ══════════════ MOBILE ══════════════ */
    @media(max-width:720px){
      /* prevent iOS auto-zoom on focus (inputs must be >=16px) */
      /* Vertical padding only. This used to be the `padding` SHORTHAND, and because this file
         loads after every page stylesheet it silently reset the horizontal padding of any input
         that had earned its own — above all .roster-search, whose 2.7rem left gutter exists to
         clear the magnifier icon painted into its background. On mobile the icon therefore sat
         underneath the placeholder text. Longhand keeps the iOS fix and leaves the gutters alone. */
      .input,.select{font-size:16px;padding-top:.8rem;padding-bottom:.8rem}
      .select{padding-right:2.5rem}
      .field-label{font-size:.62rem}
      /* Still a comfortable touch target (>=44px tall), rescaled for the new type. The old
         1.05rem was sized against the condensed uppercase face and reads oversized in Inter. */
      .btn{padding:.78rem 1.2rem;font-size:.88rem}
      /* bigger tap targets */
      .icon-btn{width:38px;height:38px}
      .nav__tab{padding:.45rem .6rem}
      .seg{width:100%;justify-content:center;flex-wrap:wrap}
      .seg__btn{flex:1;justify-content:center;min-width:0}
      .metric-grid{grid-template-columns:1fr}
      .roster-grid{grid-template-columns:1fr}
      .prog-card__stats{gap:1.5rem}
      .prog-card__go{position:static;margin-top:1.1rem}
      .lead-select-row{gap:.75rem}
      .lead-select-row .field{flex:1;min-width:140px}
      /* tables: keep readable, allow horizontal scroll */
      .log-table{min-width:460px}
      .log-table th,.log-table td{padding:.6rem .5rem}
    }
    /* very small screens: stack the recent-entries table into cards so nothing is cut off */
    @media(max-width:560px){
      .table-scroll{overflow-x:visible}
      .log-table{min-width:0}
      .log-table thead{display:none}
      .log-table,.log-table tbody{display:block}
      .log-table tr{display:grid;grid-template-columns:1fr auto;gap:.1rem .6rem;align-items:center;padding:.7rem .3rem;border-bottom:1px solid var(--b1)}
      .log-table tr:hover td{background:none}
      .log-table td{display:block;border:none;padding:.1rem 0}
      .log-table td.ath{grid-column:1;grid-row:1;font-size:.92rem}
      .log-table td[data-label="Date"]{grid-column:2;grid-row:1;text-align:right;color:var(--t3);font-size:.68rem}
      .log-table td[data-label="Metric"]{grid-column:1;grid-row:2;color:var(--t2);font-size:.76rem}
      .log-table td[data-label="Value"]{grid-column:1;grid-row:3}
      .log-table td:last-child{grid-column:2;grid-row:2 / 4;text-align:right;align-self:center}
    }
    @media(max-width:400px){
      .pr-hero{padding:2.25rem 1rem 2.25rem}
      .prog-card__badge{font-size:3.5rem}
      .metric-card{padding:1.15rem 1.15rem .9rem}
    }
    /* larger touch targets on any touch device */
    @media(hover:none){
      .del-x{width:38px;height:38px}
      .prog-card:active{transform:translateY(0)}
    }

    /* ── PRINT (Save as PDF) ── */
    @media print{
      @page{margin:12mm}
      .sidebar,.appbar,.scrim,.toast,.report-controls,.report-actions,.eyebrow,.page-title,.page-desc{display:none!important}
      .main{margin-left:0!important}
      .wrap{padding:0!important;max-width:none}
      body{background:#fff!important;-webkit-print-color-adjust:exact;print-color-adjust:exact}
      .report-card{border:1px solid var(--b2);box-shadow:none}
    }