.personal-recommendation{display:flex;flex-direction:column;gap:10px;min-width:0;min-height:0;background:#fff;box-shadow:none;padding:18px}
.personal-recommendation .prediction-card__top{margin-bottom:6px;gap:8px;align-items:center}
.personal-recommendation .prediction-card__stroke{font-family:inherit;font-size:12px;letter-spacing:0}
.recommendation-course-line .prediction-panel__course-label{font-family:var(--font-ui);letter-spacing:.02em}
.personal-recommendation .prediction-card__pb{font-size:11px;padding:4px 7px;white-space:nowrap}
.personal-recommendation .recommendation-heading{font-size:15px;line-height:1.35;font-weight:700;color:#15345d;margin:0;letter-spacing:0}
.recommendation-target{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;font-size:18px;font-weight:700;color:#15345d;font-variant-numeric:tabular-nums}
.recommendation-target strong{font-size:inherit;font-weight:inherit;color:inherit;white-space:nowrap}
.recommendation-gap{font-weight:700;white-space:nowrap;font-size:12px;font-variant-numeric:tabular-nums}
.recommendation-gap.is-away{color:#bb2736}
.recommendation-gap.is-within{color:#197247}
.recommendation-reason{font-size:12px;line-height:1.5;margin:0;color:#526781}
.recommendation-course-line{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 10px;margin-top:5px}
.recommendation-course-line .prediction-panel__course-label{margin:0}
.recommendation-archive-note{color:#748093;font-size:11px;line-height:1.4;font-weight:400;letter-spacing:0;text-transform:none}
.recommendation-archive-note[hidden]{display:none}
.recommendation-ladder-label{font-family:inherit;font-size:10px;letter-spacing:0;font-weight:700;color:#667b91;padding-top:0}
.recommendation-ladder{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.recommendation-ladder li{display:flex;flex-direction:column;gap:8px;padding:12px 8px;border:1px solid transparent;border-top-color:#e4ebf3;border-radius:0;font-size:12px;min-width:0}
.recommendation-ladder li.is-recommended{background:color-mix(in srgb,var(--stroke-soft) 45%,white);border-color:var(--stroke-border);border-radius:10px}
.recommendation-ladder strong{font-variant-numeric:tabular-nums;white-space:nowrap}
.recommendation-benchmark-head{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:4px 8px;min-width:0}
.recommendation-distance{color:#15345d}
.recommendation-remaining{display:inline-flex;align-items:baseline;gap:5px;color:#607690;font-size:10px}
.recommendation-benchmark-times{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));align-items:end;gap:10px;font-family:inherit;font-size:11px;line-height:1.35;color:#607690;font-variant-numeric:tabular-nums}
.recommendation-benchmark-times strong{font-size:12px;color:#15345d}
.recommendation-benchmark-start{grid-column:1;text-align:left}
.recommendation-benchmark-start>span{color:#26734c}
.recommendation-benchmark-goal{grid-column:2;text-align:right}
.recommendation-benchmark-times>span>span{display:block;margin-bottom:3px;overflow-wrap:anywhere}
.recommendation-progress-position{position:relative;min-width:0;padding-bottom:28px}
.recommendation-progress{height:9px;flex:none;border-radius:999px;background:#e5ecf3;overflow:hidden}
.recommendation-progress>span{display:block;height:100%;width:var(--progress);border-radius:inherit;background:var(--stroke-accent);opacity:.8}
.recommendation-progress.is-empty>span{width:0}
.recommendation-pb-marker{position:absolute;top:-2px;left:clamp(1px,var(--progress),calc(100% - 1px));width:3px;height:16px;transform:translateX(-50%);border-radius:2px;background:var(--stroke-accent);box-shadow:0 0 0 1px #fff}
.recommendation-benchmark-pb{position:absolute;top:19px;left:var(--progress);transform:translateX(calc(0% - var(--progress)));display:inline-flex;align-items:baseline;gap:4px;max-width:100%;white-space:nowrap;font-size:11px;line-height:1.4;color:#607690}
.recommendation-benchmark-pb strong{font-size:12px;color:#15345d}
.recommendation-next{display:block;text-align:right;font-size:10px;font-weight:400;line-height:1.4;color:#65798e}
.recommendation-next .recommendation-gap{font-size:10px}
.recommendation-next.is-complete{color:#26734c}
.stroke-score-name{color:#111}
@media(min-width:821px){
  .personal-recommendation .recommendation-reason{min-height:3em}
  @supports(grid-template-rows:subgrid){
    .swimmer-page .prediction-grid:has(.personal-recommendation){row-gap:10px}
    .personal-recommendation{display:grid;grid-template-rows:subgrid;grid-row:span 6;row-gap:10px;height:auto}
    .personal-recommendation .recommendation-reason{min-height:0}
  }
}
@media(min-width:821px) and (max-width:1250px){.swimmer-page .prediction-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:820px){
  .swimmer-page .prediction-panel__head{column-gap:8px;row-gap:7px}
  .swimmer-page .prediction-panel__title-block{display:contents}
  .swimmer-page .prediction-panel__title{grid-column:1;grid-row:1}
  .swimmer-page .prediction-course-toggle{grid-column:2;grid-row:1;justify-self:end}
  .recommendation-course-line{grid-column:1/-1;grid-row:2;margin-top:0}
  .personal-recommendation{padding:16px;gap:10px}
  .personal-recommendation .recommendation-heading{font-size:16px}
  .recommendation-ladder li{font-size:13px}
  .recommendation-benchmark-times strong,.recommendation-benchmark-pb strong{font-size:13px}
}
@media(max-width:360px){
  .swimmer-page .prediction-panel__title{font-size:18px;align-self:center}
  .swimmer-page .prediction-course-toggle{gap:4px}
  .swimmer-page .prediction-course-btn.qual-course-btn{font-size:10px;padding:4px 6px;min-width:0}
}