/* report.css — styles specific to the generated grade report.
   Pairs with grader.css (loaded first). */

.report-hero__gauge { justify-self: end; }
/* The headline overall score reads in near-black; the colored ring carries the
   band signal. (Per-pillar score numbers keep their band color.) */
.report-hero__gauge .score-num { color: var(--color-fg); }
.share-line {
  margin: 22px 0 0; padding: 10px 16px; display: inline-block;
  border: 1.5px solid var(--bno-slack-black); border-radius: var(--radius-pill);
  background: var(--bno-paper); font-size: 15px; font-weight: 650;
}
.share-line strong { font-weight: 850; }
.report-emailed { margin: 14px 0 0; font-size: 14px; color: var(--color-fg-muted); }

/* What's working */
.whats-working { max-width: 820px; margin: 0; padding: 0; list-style: none; display: grid; gap: 12px; }
.whats-working li { position: relative; padding-left: 34px; font-size: 17px; line-height: 1.45; font-weight: 600; }
.whats-working li::before {
  content: ""; position: absolute; left: 0; top: 2px; width: 22px; height: 22px; border-radius: 50%;
  background: var(--grade-great); -webkit-mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9.55 17.6 4 12l1.4-1.4 4.15 4.15L18.6 5.3 20 6.7z'/%3E%3C/svg%3E") center/15px no-repeat;
  mask: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath fill='%23000' d='M9.55 17.6 4 12l1.4-1.4 4.15 4.15L18.6 5.3 20 6.7z'/%3E%3C/svg%3E") center/15px no-repeat;
}

/* First five seconds quote */
.five-seconds {
  max-width: 860px; margin: 0; padding: 28px 32px;
  border-left: 5px solid var(--bno-fiery-orange);
  background: var(--bno-paper); border-radius: 0 8px 8px 0; box-shadow: var(--en-shadow);
  font: italic 450 clamp(20px, 2.6vw, 28px)/1.4 var(--font-display); color: var(--color-fg);
}

/* Emergency vs project paths */
.path-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.path-card { padding: 24px; border: 1.5px solid var(--bno-slack-black); border-radius: 8px; background: var(--bno-paper); box-shadow: var(--en-shadow); display: grid; gap: 8px; }
.path-card h3 { margin: 0; font: 650 22px/1.05 var(--font-display); }
.path-card p { margin: 0; color: var(--color-fg-muted); line-height: 1.5; }
.path-chip {
  justify-self: start; padding: 4px 12px; border-radius: var(--radius-pill);
  font: 800 11px/1 var(--font-sans); text-transform: uppercase; letter-spacing: 0.05em;
  color: var(--band-ink); background: var(--band-soft);
}

/* Quick wins */
.quickwins { max-width: 880px; margin: 0; padding: 0; list-style: none; display: grid; gap: 14px; counter-reset: qw; }
.quickwin { display: grid; grid-template-columns: 40px 1fr; gap: 16px; align-items: start;
  padding: 20px; background: var(--bno-paper); border: 1.5px solid var(--bno-slack-black); border-radius: 8px; box-shadow: var(--en-shadow); }
.quickwin-n { width: 36px; height: 36px; border-radius: 50%; display: grid; place-items: center;
  background: var(--bno-fiery-orange); color: var(--bno-slack-black); font: 850 17px/1 var(--font-sans); }
.quickwin strong { display: block; margin-bottom: 3px; font-size: 17px; }
.quickwin div { color: var(--color-fg-muted); line-height: 1.45; }
.quickwin div strong { color: var(--color-fg); }

/* Speed note + could-not-verify */
.speed-note { max-width: 820px; margin: 26px 0 0; padding: 16px 20px; border-radius: 8px;
  background: var(--en-soft-yellow); font-size: 15px; line-height: 1.5; }
.could-not-verify { max-width: 820px; margin: 0; padding-left: 20px; color: var(--color-fg-muted); line-height: 1.6; }

@media (max-width: 760px) {
  .path-grid { grid-template-columns: 1fr; }
  .report-hero__gauge { justify-self: start; }
}