/* URL form: one big row, stacks on phones. */
.pr-form { max-width: 720px; display: grid; gap: 12px; }
.pr-row { display: flex; gap: 10px; }
.pr-url { flex: 1; min-width: 0; }
.pr-url input { min-height: 58px; border: 2px solid var(--ink); font-size: 17px; }
.pr-row .btn { min-height: 58px; padding: 0 28px; font-size: 17px; }
@media (max-width: 520px) { .pr-row { flex-direction: column; } }
.pr-pills { display: flex; flex-wrap: wrap; gap: 8px; margin: 14px 0 0; }
.pr-example { margin-top: 48px; }
.pr-example > h2, .pr-again h2 { font-size: 1.5rem; margin: 0 0 16px; }

/* Report: score card left, fixes right. */
.pr-report { display: flex; flex-wrap: wrap; gap: 24px; align-items: stretch; }
.pr-score { flex: 1 1 300px; min-width: 0; display: flex; flex-direction: column; align-items: center; gap: 12px; text-align: center; padding: 28px; border-radius: 20px; }
.pr-score p { margin: 0; }
.pr-passed { font-weight: 700; font-size: 18px; }
.pr-verdict { color: var(--muted); font-size: 15px; }
.pr-share { margin-top: auto; }

.pr-ring { flex: none; max-width: 100%; height: auto; }
.pr-ring circle { fill: none; stroke-width: 12; }
.pr-ring .track { stroke: var(--surface-2); }
.pr-ring .bar { stroke-linecap: round; }
.pr-ring.good .bar { stroke: var(--leaf); }
.pr-ring.mid .bar { stroke: var(--accent); }
.pr-ring.bad .bar { stroke: var(--chili); }
.pr-ring .num { font: 800 34px var(--display); fill: var(--text); }
.pr-ring .of { font: 11px var(--font); fill: var(--muted); }

.pr-fixes { flex: 999 1 520px; min-width: 0; display: flex; flex-direction: column; gap: 16px; }
.pr-fixes h2 { margin: 0; font-size: 24px; }
.pr-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 12px; }
.pr-list li { display: flex; gap: 14px; padding: 20px; }
.pr-list .icon-chip { width: 32px; height: 32px; border-radius: 50%; }
.pr-list strong { font-size: 17px; overflow-wrap: anywhere; }
.pr-list p { margin: 4px 0 0; color: var(--muted); }
.pr-good { padding: 18px 20px; }
.pr-good-head { display: flex; justify-content: space-between; gap: 12px; margin: 0 0 12px; }
.pr-good-head span { font-size: 14px; font-weight: 600; color: var(--leaf); }
.pr-chips { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 8px; }
.pr-chips .pill { font-size: 14px; white-space: normal; }

/* AI roast: dark band, fixed colours in both themes. */
.pr-ai { margin-top: 40px; background: var(--slab); color: var(--slab-text); border: 1px solid var(--slab-border); border-radius: 24px; padding: clamp(24px, 5vw, 36px); display: flex; flex-wrap: wrap; gap: 32px; align-items: center; }
.pr-ai .kicker { color: var(--accent); margin-bottom: 8px; }
.pr-ai h2, .pr-roast h2 { margin: 0 0 12px; font-size: clamp(1.5rem, 4vw, 1.9rem); }
.pr-ai-copy { flex: 999 1 460px; min-width: 0; }
.pr-ai-sub { margin: 0; color: var(--slab-muted); }
.pr-ticks { list-style: none; margin: 18px 0 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); gap: 10px 20px; font-size: 15px; }
.pr-ticks li::before { content: "✓"; color: var(--accent); margin-right: 8px; }
.pr-ai-buy { flex: 1 1 260px; min-width: 0; display: grid; gap: 10px; }
.pr-ai-buy .btn { min-height: 56px; font-size: 17px; font-weight: 800; }
.pr-ai-buy p { margin: 0; text-align: center; font-size: 13px; color: var(--slab-muted); }
.pr-roast, .pr-ai-msg { margin-top: 40px; }
.pr-roast-text { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.65; max-width: 75ch; }

.pr-again { margin-top: 48px; }
