/* Only screen chrome. The printed sheet and the shared row partial keep their
   existing typography, spacing, colors, and US Letter pagination. The link's
   media="screen" and this guard both exclude these rules from paper output. */
@media screen {
  /* Breadcrumb and eyebrow match the sport hubs and format guides
     (static/css/format-pages.css). Copied rather than loading that file: its
     colors are tokens scoped to the .format-page layout, which these pages
     do not use, and its breadcrumb padding is that layout's gutter. */
  :is(.public-printable-hub, .public-printable-sheet) .format-breadcrumbs { font-size: 12px; line-height: 1.7; color: #61645b; }
  :is(.public-printable-hub, .public-printable-sheet) .format-breadcrumbs ol { display: flex; flex-wrap: wrap; gap: 6px 12px; margin: 0; padding: 0; list-style: none; }
  :is(.public-printable-hub, .public-printable-sheet) .format-breadcrumbs li { display: flex; gap: 12px; }
  :is(.public-printable-hub, .public-printable-sheet) .format-breadcrumbs a { color: inherit; text-decoration: none; }
  :is(.public-printable-hub, .public-printable-sheet) .format-breadcrumbs a:hover { text-decoration: underline; }
  .public-printable-hub .format-eyebrow { font-size: 12px; line-height: 1.5; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; color: #284f38; }

  .public-printable-hub [data-section="hero"] > .public-container:last-child { padding-block: 28px 56px; }
  .public-printable-hub [data-section="weeks"] { background: #f0eee6; }
  .public-printable-hub nav[aria-label$="printable pick sheets"] a {
    min-height: 68px;
    padding-block: 12px;
    border-color: #deddd2;
    color: #284f38;
  }
  .public-printable-hub nav[aria-label$="printable pick sheets"] a:hover { background: #e5ebe1; border-color: #284f38; }
  .public-printable-hub [data-analytics-cta="printable_hub_current_week"] { white-space: normal; text-align: center; }
  .public-printable-hub [data-section="how-it-works"] > .public-container { padding-block: 56px; }
  .public-printable-hub [data-section="how-it-works"] h3 { color: #284f38; font-size: 19px; letter-spacing: -.02em; }

  .public-printable-sheet { background: #fcf9f2; }
  .public-printable-sheet .printable-screen { max-width: 900px; padding-block: 32px 64px; }
  .public-printable-sheet .printable-intro > p { font-size: 16px; line-height: 1.7; color: #61645b; }
  /* The sheet-image strip below the sheet: a small thumbnail with the caption
     and the PDF link beside it, the same row at every width. Grid areas
     because the caption must stay the figure's last child in the markup; the
     empty first and last rows center the text against the thumbnail. */
  .public-printable-sheet .printable-preview {
    display: grid;
    grid-template-columns: 104px minmax(0, 1fr);
    grid-template-rows: 1fr auto auto 1fr;
    grid-template-areas: "thumb ." "thumb caption" "thumb download" "thumb .";
    column-gap: 16px;
    margin-inline: 0;
    margin-bottom: 0;
  }
  .public-printable-sheet .printable-preview-link {
    grid-area: thumb;
    border: 1px solid #deddd2;
    border-radius: 4px;
    background: white;
    overflow: hidden;
    box-shadow: 0 1px 2px rgb(0 0 0 / .06);
  }
  .public-printable-sheet .printable-preview-link:hover { border-color: #284f38; }
  .public-printable-sheet .printable-preview figcaption { grid-area: caption; font-size: 14px; line-height: 1.5; color: #61645b; }
  .public-printable-sheet .printable-preview-download {
    grid-area: download;
    justify-self: start;
    display: inline-flex;
    align-items: center;
    min-height: 44px;
    color: #284f38;
    font-size: 14px;
    font-weight: 600;
    text-decoration: underline;
    text-underline-offset: 3px;
  }
  .public-printable-sheet .printable-preview-download:hover { color: #1d3e2a; }
  .public-printable-sheet .printable-options {
    padding: 16px 20px;
    border-color: #deddd2;
    border-radius: 6px;
    background: #f0eee6;
  }
  .public-printable-sheet .printable-options > span { color: #61645b; }
  .public-printable-sheet .printable-options label { min-height: 44px; }
  .public-printable-sheet .printable-options button {
    min-height: 44px;
    padding-inline: 24px;
    background: #284f38;
    border-color: #284f38;
    color: white;
    font-weight: 650;
  }
  .public-printable-sheet .printable-options button:hover { background: #1d3e2a; }
  .public-printable-sheet nav[aria-label="Other weeks"] { padding-block: 8px; border-bottom: 1px solid #deddd2; }
  .public-printable-sheet nav[aria-label="Other weeks"] a { display: inline-flex; align-items: center; min-height: 44px; color: #284f38; font-weight: 600; }
  .public-printable-sheet .printable-next-step { background: #e5ebe1; border: 0; border-radius: 6px; }
  .public-printable-sheet .printable-next-step h2 { color: #284f38; font-size: 28px; line-height: 1.2; font-weight: 650; letter-spacing: -.035em; }
  .public-printable-sheet .printable-next-step p { color: #61645b; }
  .public-printable-sheet .printable-next-step [data-analytics-cta="printable_sheet_start_pool"] { background: #284f38; font-size: 14px; font-weight: 650; }
  .public-printable-sheet .printable-next-step [data-analytics-cta="printable_sheet_start_pool"]:hover { background: #1d3e2a; }
  @media (max-width: 640px) {
    .public-printable-sheet .printable-options { padding: 16px; }
  }
}
