.shm-year {
  display: none;
}

@media (max-width: 500px) {
  #workout-year-calendar {
    display: none;
  }

  :is(#screen-history, #sf-history-inline) .sh-hm-header,
  :is(#screen-history, #sf-history-inline) .sh-hm-legend {
    display: none;
  }

  :is(#screen-history, #sf-history-inline) .sh-hm-body,
  :is(#screen-history, #sf-history-inline) .sh-hm-body.collapsed {
    display: block;
    padding: var(--w2-s4);
    border-top: 0;
  }

  .shm-year {
    display: block;
    max-width: 100%;
    overflow: hidden;
    color: var(--w2-text);
    font-variant-numeric: tabular-nums;
  }

  .shm-head {
    margin-bottom: var(--w2-s4);
  }

  .shm-eyebrow,
  .shm-stat-label,
  .shm-section-title {
    font-family: 'JetBrains Mono', monospace;
    font-weight: 700;
    line-height: 1;
    letter-spacing: .14em;
    text-transform: uppercase;
    font-variant-numeric: tabular-nums;
  }

  .shm-eyebrow {
    color: var(--w2-lime);
    font-size: 11px;
  }

  .shm-subtitle {
    margin-top: var(--w2-s2);
    color: var(--w2-text-quiet);
    font-size: 12px;
  }

  .shm-year-strip {
    display: grid;
    grid-template-columns: repeat(12, 1fr);
    gap: var(--w2-s1);
    height: var(--w2-s6);
    margin-bottom: var(--w2-s2);
  }

  .shm-year-segment {
    border-radius: var(--w2-s1);
    background: color-mix(in srgb, var(--w2-text) 5%, transparent);
  }

  .shm-year-segment.has-data {
    background: var(--w2-lime);
  }

  .shm-year-segment.is-current {
    box-shadow: inset 0 0 0 calc(var(--w2-s1) / 2) var(--w2-fire);
  }

  .shm-year-labels {
    display: flex;
    justify-content: space-between;
    margin-bottom: var(--w2-s3);
    color: var(--w2-text-quiet);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  .shm-stat-card {
    margin-bottom: var(--w2-s2);
    padding: var(--w2-s3) var(--w2-s4);
    border-left: 3px solid var(--w2-text-quiet);
    border-radius: var(--w2-s3);
    background: var(--w2-surface-raised);
  }

  .shm-stat-card-streak {
    border-left-color: var(--w2-lime);
  }

  .shm-stat-card-break {
    border-left-color: var(--w2-fire);
  }

  .shm-stat-label {
    color: var(--w2-text-quiet);
    font-size: 10px;
  }

  .shm-stat-value {
    margin-top: var(--w2-s2);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.3;
    text-wrap: balance;
  }

  .shm-stat-meta {
    margin-top: var(--w2-s1);
    color: var(--w2-text-quiet);
    font-size: 12px;
    line-height: 1.4;
    text-wrap: pretty;
  }

  .shm-section-title {
    margin: var(--w2-s5) 0 var(--w2-s3);
    color: var(--w2-text-quiet);
    font-size: 10px;
  }

  .shm-month-tabs {
    display: flex;
    width: 100%;
    margin-bottom: var(--w2-s4);
    padding: var(--w2-s1);
    border-radius: var(--w2-s3);
    background: var(--w2-surface-raised);
  }

  .shm-month-tab {
    min-width: 0;
    min-height: var(--w2-s8);
    flex: 1;
    padding: 0;
    border: 0;
    border-radius: var(--w2-s2);
    color: var(--w2-text-quiet);
    background: transparent;
    cursor: pointer;
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: tabular-nums;
    transition-property: scale, color, background-color;
    transition-duration: 150ms;
    transition-timing-function: ease-out;
  }

  .shm-month-tab.has-data {
    color: var(--w2-text-muted);
    background: color-mix(in srgb, var(--w2-lime) 12%, transparent);
  }

  .shm-month-tab.is-selected {
    color: var(--w2-surface);
    background: var(--w2-lime);
  }

  .shm-month-tab:active {
    scale: .96;
  }

  .shm-month-title {
    margin-bottom: var(--w2-s3);
    font-size: 16px;
    font-weight: 700;
    line-height: 1.25;
    text-wrap: balance;
  }

  .shm-weekdays,
  .shm-month-grid {
    display: grid;
    grid-template-columns: repeat(7, var(--w2-s8));
    gap: var(--w2-s1);
    justify-content: space-between;
  }

  .shm-weekdays {
    margin-bottom: var(--w2-s2);
  }

  .shm-weekdays span {
    color: var(--w2-text-quiet);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    text-align: center;
    text-transform: uppercase;
    font-variant-numeric: tabular-nums;
  }

  .shm-day {
    display: flex;
    align-items: center;
    justify-content: center;
    width: var(--w2-s8);
    height: var(--w2-s8);
    padding: 0;
    border: 0;
    border-radius: var(--w2-s3);
    color: var(--w2-text-quiet);
    background: color-mix(in srgb, var(--w2-text) 4%, transparent);
    font-family: 'JetBrains Mono', monospace;
    font-size: 13px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  button.shm-day {
    cursor: pointer;
  }

  .shm-day-l1 {
    color: var(--w2-text);
    background: color-mix(in srgb, var(--w2-lime) 20%, transparent);
  }

  .shm-day-l2 {
    color: var(--w2-text);
    background: color-mix(in srgb, var(--w2-lime) 40%, transparent);
  }

  .shm-day-l3 {
    color: var(--w2-surface);
    background: color-mix(in srgb, var(--w2-lime) 65%, transparent);
  }

  .shm-day-l4 {
    color: var(--w2-surface);
    background: var(--w2-lime);
  }

  .shm-day.is-today {
    box-shadow: inset 0 0 0 calc(var(--w2-s1) / 2) var(--w2-fire);
  }

  .shm-day-pad {
    visibility: hidden;
  }

  .shm-month-summary {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: var(--w2-s2);
    margin: var(--w2-s4) 0;
  }

  .shm-month-summary > div {
    min-width: 0;
    padding: var(--w2-s3) var(--w2-s1);
    border-radius: var(--w2-s3);
    background: var(--w2-surface-raised);
    text-align: center;
  }

  .shm-month-summary b {
    display: block;
    font-family: 'JetBrains Mono', monospace;
    font-size: 18px;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  .shm-month-summary span {
    display: block;
    margin-top: var(--w2-s2);
    color: var(--w2-text-quiet);
    font-size: 10px;
    line-height: 1.2;
    text-wrap: balance;
  }

  .shm-day-list {
    border-top: 1px solid var(--w2-line);
  }

  .shm-day-row {
    display: flex;
    align-items: center;
    gap: var(--w2-s2);
    width: 100%;
    min-height: var(--w2-s9);
    padding: var(--w2-s2) 0;
    border: 0;
    border-bottom: 1px solid var(--w2-line);
    color: var(--w2-text);
    background: transparent;
    cursor: pointer;
    text-align: left;
  }

  .shm-day-date {
    width: calc(var(--w2-s9) + var(--w2-s5));
    flex: 0 0 calc(var(--w2-s9) + var(--w2-s5));
    font-size: 14px;
    font-weight: 600;
  }

  .shm-day-week {
    padding: var(--w2-s1);
    border: 1px solid var(--w2-line);
    border-radius: var(--w2-s1);
    color: var(--w2-text-quiet);
    font-family: 'JetBrains Mono', monospace;
    font-size: 10px;
    font-weight: 600;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  .shm-day-tonnage {
    margin-left: auto;
    font-family: 'JetBrains Mono', monospace;
    font-size: 15px;
    font-weight: 700;
    line-height: 1;
    font-variant-numeric: tabular-nums;
  }

  .shm-day-unit {
    color: var(--w2-text-quiet);
    font-size: 11px;
  }

  .shm-month-empty {
    padding: var(--w2-s4) 0;
    color: var(--w2-text-quiet);
    font-size: 13px;
    text-align: center;
  }
}
