/* /sample-report/: the sample build risk report as a document on the page. The report is the engine's own
   HTML in a frame (never restyled here); sample.js sizes the frame and scales it on narrow screens. */
.sr-wrap { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 864px); grid-template-rows: auto auto 1fr;
  grid-template-areas: "head sheet" "parts sheet" "fine sheet"; gap: 0 clamp(40px, 4vw, 72px); align-items: start; }
.sr-wrap .band-head { grid-area: head; margin-bottom: 36px; }
.sr-wrap .band-head h1 { font-size: clamp(32px, 3vw, 46px); }
.sr-wrap .cta { margin-top: 26px; }
.sr-parts { grid-area: parts; list-style: none; margin: 0; padding: 0; display: grid; }
.sr-parts li { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 2px 12px; padding: 14px 0; border-top: 1px solid var(--line); }
.sr-parts li:last-child { border-bottom: 1px solid var(--line); }
.sr-parts .n { grid-row: span 2; padding-top: 4px; font-family: var(--mono); font-size: 11px; letter-spacing: 0.16em; color: var(--faint); }
.sr-parts b { font-size: 16px; font-weight: 700; letter-spacing: -0.01em; }
.sr-parts span:last-child { color: var(--mute); font-size: 14.5px; line-height: 1.5; }
.sr-wrap .fine { grid-area: fine; }
.sr-sheet { grid-area: sheet; margin: 0; overflow: hidden; border-radius: 4px; background: var(--vellum); box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45); }
.sr-sheet iframe { display: block; width: 100%; height: 2100px; border: 0; background: var(--vellum); }
.sr-sheet.fit iframe { transform-origin: 0 0; }

@media (max-width: 1200px) {
  .sr-wrap { grid-template-columns: minmax(0, 1fr); grid-template-rows: none; grid-template-areas: "head" "parts" "sheet" "fine"; }
  .sr-wrap .band-head { max-width: 760px; }
  .sr-parts { grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 0 24px; margin-bottom: 40px; }
  .sr-parts li:last-child { border-bottom: 0; }
  .sr-sheet { max-width: 864px; }
}
