/* ============================================================
   Practice Management in the Age of AI 2026 — A Uku Report
   Paginated A4 report. Built on the Uku design system vocabulary.
   Type: Source Serif 4 (display + hero numerals) + Inter (UI/body/data).
   Aligned to the Uku DS typeface patch, 2026-06-09.
   ============================================================ */

@import url('https://fonts.googleapis.com/css2?family=Source+Serif+4:opsz,wght@8..60,200..900&family=Inter:wght@300;400;500;600;700&display=swap');

:root {
  /* Brand */
  --royal-blue: #5b5de4;
  --royal-blue-600: #4a4cd1;
  --royal-blue-16: #e5e5fb;
  --royal-blue-08: #f0f0fd;
  --uku-black: #251d35;
  --amber: #ffcc00;
  --uku-cyan: #00c7be;  --uku-cyan-16: #d6f6f5;
  --uku-green: #38b000; --uku-green-16: #dff2d6;
  --uku-orange: #ff9500;

  /* Cool neutral ink ramp (zinc) */
  --ink-50:#fafafa; --ink-100:#f4f4f5; --ink-200:#e4e4e7; --ink-300:#d4d4d8;
  --ink-400:#a1a1aa; --ink-500:#71717a; --ink-600:#52525b; --ink-700:#3f3f46;
  --ink-800:#27272a; --ink-900:#18181b;

  --font-display: "Source Serif 4", Georgia, "Times New Roman", serif;
  --font-sans: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --fr: "opsz" 60;
  /* big report numbers: lining + tabular = elegant AND column-aligned */
  --fr-num: "lnum" 1, "tnum" 1;

  /* Theme-able accent (driven by Tweaks) */
  --accent: var(--royal-blue);
  --accent-soft: var(--royal-blue-16);

  --shadow-page: 0 1px 2px rgba(37,29,53,.06), 0 24px 60px rgba(37,29,53,.16);
  --glow-product: 0 0 40px rgba(91,93,228,.16), 0 0 110px rgba(91,93,228,.07);

  /* A4 */
  --pw: 210mm;
  --ph: 297mm;
}

#report[data-accent="cyan"]   { --accent: var(--uku-cyan);   --accent-soft: var(--uku-cyan-16); }
#report[data-accent="green"]  { --accent: var(--uku-green);  --accent-soft: var(--uku-green-16); }
#report[data-accent="amber"]  { --accent: #e0a800;          --accent-soft: #fff3c2; }

* , *::before, *::after { box-sizing: border-box; }

html { -webkit-text-size-adjust: 100%; }
body {
  margin: 0;
  font-family: var(--font-sans);
  background: var(--viewer-bg, #e3e3e8);
  color: var(--ink-700);
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  transition: background .3s ease;
}
body[data-backdrop="dark"] { --viewer-bg: #16111f; }

img, svg { display: block; max-width: 100%; }
em { font-style: normal; }

/* ── Viewer shell ─────────────────────────────────────────── */
#report {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 28px;
  padding: 40px 20px 80px;
}

/* ── The page sheet ───────────────────────────────────────── */
.page {
  position: relative;
  width: var(--pw);
  height: var(--ph);
  background: #fff;
  box-shadow: var(--shadow-page);
  overflow: hidden;
  display: flex;
  flex-direction: column;
  padding: 19mm 18mm 13mm;
  color: var(--ink-700);
}
.page--dark { background: var(--uku-black); color: rgba(255,255,255,.82); }

/* Running header + footer */
.rh {
  display: flex; align-items: center; justify-content: space-between;
  font: 600 8.5pt/1 var(--font-sans);
  text-transform: uppercase; letter-spacing: .16em;
  color: var(--ink-400);
  padding-bottom: 9mm;
}
.rh__kicker { color: var(--accent); display: inline-flex; align-items: center; gap: 9px; }
.rh__kicker::before { content:""; width: 22px; height: 2px; border-radius: 2px; background: var(--accent); }
.page--dark .rh { color: rgba(255,255,255,.4); }
.page--dark .rh__kicker { color: #fff; }
.page--dark .rh__kicker::before { background: var(--accent); }

.page__body { flex: 1 1 auto; display: flex; flex-direction: column; min-height: 0; }

.rf {
  display: flex; align-items: center; justify-content: space-between;
  font: 500 8pt/1 var(--font-sans);
  color: var(--ink-400);
  padding-top: 7mm;
  margin-top: auto;
  border-top: 1px solid var(--ink-200);
}
.rf__n { font-weight: 700; color: var(--ink-600); font-variant-numeric: tabular-nums; }
.page--dark .rf { color: rgba(255,255,255,.34); border-top-color: rgba(255,255,255,.12); }
.page--dark .rf__n { color: rgba(255,255,255,.6); }

/* ── Typography ───────────────────────────────────────────── */
.kicker {
  font: 700 9pt/1 var(--font-sans);
  text-transform: uppercase; letter-spacing: .18em;
  color: var(--accent); margin: 0;
}
.h1, .h2, .h3, .display {
  font-family: var(--font-display);
  font-variation-settings: var(--fr);
  color: var(--ink-900); margin: 0;
  letter-spacing: -.022em; line-height: 1.04;
  text-wrap: balance;
}
.display { font-weight: 540; font-size: 52pt; line-height: .98; }
.h1 { font-weight: 540; font-size: 27pt; line-height: 1.06; }
.h2 { font-weight: 560; font-size: 25pt; }
.h3 { font-family: var(--font-sans); font-weight: 700; font-size: 13pt; letter-spacing: -.01em; line-height: 1.25; color: var(--ink-900); }
.page--dark .h1, .page--dark .h2, .page--dark .h3, .page--dark .display { color: #fff; }

.lead {
  font-size: 13.5pt; font-weight: 300; line-height: 1.5;
  color: var(--ink-600); margin: 0; text-wrap: pretty;
}
.body { font-size: 10.5pt; font-weight: 400; line-height: 1.62; color: var(--ink-600); margin: 0; text-wrap: pretty; }
.body + .body { margin-top: 9pt; }
.body b, .body strong { color: var(--ink-900); font-weight: 700; }
.page--dark .lead { color: rgba(255,255,255,.74); }
.page--dark .body { color: rgba(255,255,255,.66); }
.page--dark .body b { color: #fff; }

.lede-cap::first-letter {
  font-family: var(--font-display); font-variation-settings: var(--fr);
  font-weight: 560; font-size: 2.9em; float: left; line-height: .82;
  padding: 4px 9px 0 0; color: var(--accent);
}

/* Section title block */
.sect-title { margin: 2mm 0 5mm; flex: none; }
.sect-title .h1 { margin-top: 4mm; }

/* ── Cover ────────────────────────────────────────────────── */
.cover { padding: 0; }
.cover__inner {
  position: relative; z-index: 2; flex: 1;
  display: flex; flex-direction: column;
  padding: 19mm 18mm 14mm;
}
.cover__bg { position: absolute; inset: 0; overflow: hidden; pointer-events: none; }
.cover__dots {
  position: absolute; inset: 0;
  background-image: radial-gradient(rgba(255,255,255,.06) 1px, transparent 1px);
  background-size: 26px 26px;
  -webkit-mask-image: radial-gradient(ellipse 80% 60% at 70% 18%, #000 20%, transparent 70%);
  mask-image: radial-gradient(ellipse 80% 60% at 70% 18%, #000 20%, transparent 70%);
}
.cover__glow { position: absolute; border-radius: 50%; filter: blur(95px); }
.cover__glow--1 { width: 360px; height: 360px; left: -120px; top: 80px; background: radial-gradient(circle, rgba(91,93,228,.6), transparent 70%); }
.cover__glow--2 { width: 420px; height: 420px; right: -150px; top: 36%; background: radial-gradient(circle, rgba(120,56,188,.42), transparent 70%); }

.cover__top { display: flex; align-items: center; justify-content: space-between; }
.cover__logo { height: 30px; }
.cover__tag { font: 600 8.5pt/1 var(--font-sans); text-transform: uppercase; letter-spacing: .26em; color: rgba(255,255,255,.5); }

.cover__mark {
  margin-top: 30mm;
  font: 700 10pt/1 var(--font-sans); letter-spacing: .3em; text-transform: uppercase;
  color: var(--accent);
}
.cover__title {
  margin-top: 10mm; color: #fff;
  font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 500;
  font-size: 46pt; line-height: .98; letter-spacing: -.025em;
}
.cover__title em { color: var(--amber); }
.cover__year { display:block; font-family: var(--font-sans); font-weight: 700; font-size: 11pt; letter-spacing: .35em; color: rgba(255,255,255,.55); margin-top: 7mm; text-transform: uppercase; }
.cover__sub {
  margin-top: 9mm; max-width: 125mm;
  font-size: 13pt; font-weight: 300; line-height: 1.55; color: rgba(255,255,255,.76);
}

.cover__stat {
  margin-top: auto;
  display: flex; align-items: flex-end; gap: 12mm;
  padding-top: 12mm; border-top: 1px solid rgba(255,255,255,.14);
}
.cover__bignum {
  font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 540;
  font-size: 74pt; line-height: .82; letter-spacing: -.03em; color: #fff; white-space: nowrap;
  text-shadow: 0 0 60px rgba(91,93,228,.5);
}
.cover__bignum b { color: var(--accent); font-weight: inherit; }
.cover__statcopy { font-size: 11pt; font-weight: 300; line-height: 1.5; color: rgba(255,255,255,.7); max-width: 80mm; padding-bottom: 4mm; }
.cover__statcopy b { color: #fff; font-weight: 600; }

.cover__meta {
  display: flex; align-items: center; gap: 14px; flex-wrap: wrap;
  margin-top: 11mm; font: 500 9pt/1 var(--font-sans); color: rgba(255,255,255,.5);
}
.cover__meta span { display: inline-flex; align-items: center; gap: 14px; }
.cover__meta span::after { content:"·"; color: rgba(255,255,255,.3); }
.cover__meta span:last-child::after { content:""; }

/* ── Contents ─────────────────────────────────────────────── */
.toc { list-style: none; margin: 6mm 0 0; padding: 0; }
.toc li {
  display: flex; align-items: baseline; gap: 12px;
  padding: 3.4mm 0; border-bottom: 1px solid var(--ink-200);
}
.toc__n { font: 700 9pt/1 var(--font-sans); color: var(--accent); width: 26px; font-variant-numeric: tabular-nums; }
.toc__t { font: 500 12pt/1.2 var(--font-sans); color: var(--ink-800); }
.toc__dots { flex: 1; border-bottom: 1.5px dotted var(--ink-300); transform: translateY(-3px); }
.toc__p { font: 700 10.5pt/1 var(--font-sans); color: var(--ink-500); font-variant-numeric: tabular-nums; }

/* Two-column page layout */
.cols { display: grid; grid-template-columns: 1.55fr 1fr; gap: 12mm; flex: 1; min-height: 0; }
.cols--even { grid-template-columns: 1fr 1fr; }
.cols--narrow-left { grid-template-columns: 1fr 1.5fr; }

/* Sidebar note cards */
.notecard {
  border-left: 2px solid var(--accent);
  padding: 1mm 0 1mm 6mm; margin-bottom: 7mm;
}
.notecard h4 { font: 700 10.5pt/1.2 var(--font-sans); color: var(--ink-900); margin: 0 0 4px; }
.notecard p { font: 400 9.5pt/1.55 var(--font-sans); color: var(--ink-600); margin: 0; }

/* ── Charts (data viz) — two styles via [data-viz] ────────── */
.chartblock { margin-top: 2mm; }
.chartblock__cap {
  font: 700 9pt/1 var(--font-sans); text-transform: uppercase; letter-spacing: .15em;
  color: var(--ink-900); margin: 0 0 1.5mm;
}
.chartblock__sub { font: 400 9pt/1.4 var(--font-sans); color: var(--ink-400); margin: 0 0 5mm; }

.chart { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; }
.datum {
  display: grid; grid-template-columns: 1fr auto;
  grid-template-areas: "label val" "bar bar";
  column-gap: 14px; align-items: center;
}
.datum__label { grid-area: label; font: 500 10pt/1.3 var(--font-sans); color: var(--ink-700); }
.datum__val   { grid-area: val; font-variant-numeric: tabular-nums; }
.datum__bar   { grid-area: bar; position: relative; }
.datum__bar::after {
  content: ""; position: absolute; left: 0; top: 0; bottom: 0;
  width: calc(var(--v, 0) * 1%); background: var(--accent); border-radius: inherit;
}

/* Style A — Bars */
#report[data-viz="bars"] .chart { gap: 4.4mm; }
#report[data-viz="bars"] .datum { row-gap: 8px; }
#report[data-viz="bars"] .datum__val { font-family: var(--font-sans); font-weight: 700; font-size: 12pt; color: var(--ink-900); }
#report[data-viz="bars"] .datum__bar { height: 9px; border-radius: 99px; background: var(--ink-100); }
#report[data-viz="bars"] .datum.is-lead .datum__val { color: var(--accent); }
#report[data-viz="bars"] .datum:not(.is-lead) .datum__bar::after { background: color-mix(in srgb, var(--accent) 55%, var(--ink-200)); }

/* Style B — Editorial (big serif numerals, hairline rule) */
#report[data-viz="editorial"] .chart { gap: 4mm; }
#report[data-viz="editorial"] .datum { row-gap: 10px; padding-bottom: 4mm; border-bottom: 1px solid var(--ink-200); }
#report[data-viz="editorial"] .datum:last-child { border-bottom: 0; }
#report[data-viz="editorial"] .datum__label { font-size: 10.5pt; align-self: end; padding-bottom: 3px; }
#report[data-viz="editorial"] .datum__val {
  font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 560;
  font-size: 23pt; letter-spacing: -.02em; line-height: .82; color: var(--ink-900);
}
#report[data-viz="editorial"] .datum.is-lead .datum__val { color: var(--accent); }
#report[data-viz="editorial"] .datum__bar { height: 3px; background: var(--ink-200); }

/* Mini chart — always compact bars (demographic breakdowns), unaffected by viz toggle */
#report .chart--mini { gap: 3.1mm !important; }
#report .chart--mini .datum { row-gap: 6px !important; border-bottom: 0 !important; padding-bottom: 0 !important; align-items: center !important; }
#report .chart--mini .datum__label { font-size: 9.5pt !important; align-self: center !important; padding: 0 !important; }
#report .chart--mini .datum__val { font-family: var(--font-sans) !important; font-variation-settings: normal !important; font-weight: 700 !important; font-size: 10pt !important; line-height: 1 !important; color: var(--ink-900) !important; }
#report .chart--mini .datum__bar { height: 7px !important; border-radius: 99px !important; background: var(--ink-100) !important; }
#report .chart--mini .datum.is-lead .datum__val { color: var(--accent) !important; }
#report .chart--mini .datum:not(.is-lead) .datum__bar::after { background: color-mix(in srgb, var(--accent) 50%, var(--ink-200)) !important; }

/* dark-page chart */
.page--dark .datum__label { color: rgba(255,255,255,.78); }
.page--dark #report[data-viz="bars"] .datum__val,
#report[data-viz="bars"] .page--dark .datum__val { color: #fff; }
.page--dark .datum__bar { background: rgba(255,255,255,.12) !important; }
.page--dark #report[data-viz="editorial"] .datum { border-bottom-color: rgba(255,255,255,.14); }
.page--dark #report[data-viz="editorial"] .datum__val { color: #fff; }

/* ── Big stat grid (numbers-as-hero) ──────────────────────── */
.statgrid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; margin-top: 6mm; }
.statgrid--dark { border-top: 1px solid rgba(255,255,255,.14); }
.bigstat { padding: 6mm 6mm 6mm 0; border-top: 1px solid var(--ink-200); }
.statgrid--dark .bigstat { border-top-color: rgba(255,255,255,.14); }
.bigstat__n {
  font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 540;
  font-size: 40pt; line-height: .85; letter-spacing: -.03em; color: var(--accent);
}
.bigstat__l { font: 400 9.5pt/1.35 var(--font-sans); color: var(--ink-500); margin-top: 3mm; max-width: 44mm; }
.page--dark .bigstat__l { color: rgba(255,255,255,.6); }
.bigstat--muted .bigstat__n { color: var(--ink-300); }
.page--dark .bigstat--muted .bigstat__n { color: rgba(255,255,255,.32); }

/* ── Pull quote ───────────────────────────────────────────── */
.pquote { margin: 0; }
.pquote__mark { font-family: var(--font-display); font-variation-settings: var(--fr); font-size: 34pt; line-height: 0; color: var(--accent); display: block; height: 16pt; }
.pquote__t {
  font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 500;
  font-size: 16pt; line-height: 1.34; letter-spacing: -.012em; color: var(--ink-900); margin: 0;
}
.pquote__by { margin-top: 5mm; font: 500 9pt/1.4 var(--font-sans); color: var(--ink-500); }
.pquote__by b { color: var(--ink-800); font-weight: 700; }
.page--dark .pquote__t { color: #fff; }
.page--dark .pquote__by { color: rgba(255,255,255,.55); }
.page--dark .pquote__by b { color: #fff; }

.quotecard {
  background: var(--ink-50); border: 1px solid var(--ink-200);
  border-radius: 14px; padding: 7mm 7mm;
}
.quotecard .pquote__t { font-size: 13.5pt; }
.page--dark .quotecard { background: rgba(255,255,255,.04); border-color: rgba(255,255,255,.1); }

/* ── Key-findings cards ───────────────────────────────────── */
.findgrid { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin-top: 4mm; flex: 1; }
.find {
  padding: 7mm 8mm 7mm 0; border-top: 1px solid var(--ink-200);
  display: flex; flex-direction: column; gap: 3mm;
}
.find:nth-child(odd) { padding-right: 9mm; }
.find:nth-child(even) { padding-left: 9mm; border-left: 1px solid var(--ink-200); }
.find__n { font: 700 9pt/1 var(--font-sans); color: var(--accent); letter-spacing: .14em; }
.find__t { font: 700 13pt/1.22 var(--font-sans); color: var(--ink-900); letter-spacing: -.01em; margin: 0; }
.find__d { font: 400 10pt/1.5 var(--font-sans); color: var(--ink-600); margin: 0; }
.find__d b { color: var(--accent); font-weight: 700; }

/* ── Foreword ─────────────────────────────────────────────── */
.fw { display: grid; grid-template-columns: 1fr 1.7fr; gap: 12mm; flex: 1; }
.fw__aside { }
.fw__avatar {
  width: 54px; height: 54px; border-radius: 50%; background: var(--accent);
  color: #fff; display: inline-flex; align-items: center; justify-content: center;
  font: 700 15pt/1 var(--font-sans); letter-spacing: .02em;
}
.fw__name { font: 700 12pt/1.2 var(--font-sans); color: var(--ink-900); margin: 5mm 0 1mm; }
.fw__role { font: 400 9.5pt/1.3 var(--font-sans); color: var(--ink-500); }
.fw__sig { font-family: var(--font-display); font-variation-settings: var(--fr); font-style: italic; font-weight: 400; font-size: 17pt; color: var(--ink-800); margin-top: 8mm; }
.fw__lead { font-size: 14pt; }

/* ── Honest list ──────────────────────────────────────────── */
.hlist { list-style: none; margin: 4mm 0 0; padding: 0; }
.hlist li {
  display: grid; grid-template-columns: auto 1fr; gap: 12px; align-items: start;
  padding: 4.6mm 0; border-bottom: 1px solid var(--ink-200);
  font: 400 11pt/1.45 var(--font-sans); color: var(--ink-700);
}
.hlist li b { color: var(--ink-900); font-weight: 700; }
.hlist__b { width: 9px; height: 9px; border-radius: 50%; background: var(--accent); margin-top: 6px; }

/* ── Callout ──────────────────────────────────────────────── */
.callout {
  background: var(--uku-black); color: #fff; border-radius: 16px;
  padding: 9mm 9mm; position: relative; overflow: hidden;
}
.callout__glow { position: absolute; width: 260px; height: 260px; right: -90px; bottom: -120px; border-radius: 50%; background: radial-gradient(circle, rgba(91,93,228,.55), transparent 70%); filter: blur(60px); }
.callout h3 { font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 540; font-size: 19pt; line-height: 1.1; letter-spacing: -.02em; color: #fff; margin: 0 0 4mm; position: relative; }
.callout p { font: 300 11pt/1.55 var(--font-sans); color: rgba(255,255,255,.78); margin: 0; position: relative; }
.callout__cta {
  display: inline-flex; align-items: center; gap: 8px; margin-top: 6mm; position: relative;
  font: 700 10pt/1 var(--font-sans); color: #fff; white-space: nowrap;
  background: var(--accent); padding: 11px 18px; border-radius: 99px;
}
.callout__cta svg { width: 16px; height: 16px; stroke: currentColor; }

/* ── Takeaways (What it means) ────────────────────────────── */
.takeaways { display: grid; grid-template-columns: 1fr 1fr; gap: 7mm 11mm; margin-top: 5mm; }
.take { display: grid; grid-template-columns: auto 1fr; gap: 12px; }
.take__n {
  font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 560;
  font-size: 30pt; line-height: .8; color: var(--accent); width: 16mm;
}
.take__t { font: 700 12pt/1.25 var(--font-sans); color: var(--ink-900); margin: 0 0 2.5mm; letter-spacing: -.01em; }
.take__d { font: 400 9.7pt/1.5 var(--font-sans); color: var(--ink-600); margin: 0; }
.take__d b { color: var(--ink-900); font-weight: 700; }

/* ── About Uku ────────────────────────────────────────────── */
.about__ratings { display: flex; gap: 0; margin: 7mm 0; }
.rating { flex: 1; padding-right: 7mm; }
.rating + .rating { padding-left: 7mm; border-left: 1px solid rgba(255,255,255,.14); }
.rating__n { font-family: var(--font-display); font-variation-settings: var(--fr); font-weight: 540; font-size: 27pt; line-height: 1; color: #fff; }
.rating__n span { color: var(--amber); }
.rating__l { font: 500 9pt/1 var(--font-sans); color: rgba(255,255,255,.55); margin-top: 3mm; text-transform: uppercase; letter-spacing: .1em; }
.featlist { list-style: none; margin: 5mm 0 0; padding: 0; columns: 2; column-gap: 10mm; }
.featlist li {
  break-inside: avoid; display: flex; gap: 10px; align-items: flex-start;
  padding: 2.6mm 0; font: 400 10pt/1.4 var(--font-sans); color: rgba(255,255,255,.8);
}
.featlist li::before { content:""; flex: none; width: 7px; height: 7px; border-radius: 50%; background: var(--accent); margin-top: 6px; }

/* ── Helpers ──────────────────────────────────────────────── */
.mt-auto { margin-top: auto; }
.spacer-sm { height: 5mm; } .spacer-md { height: 8mm; } .spacer-lg { height: 12mm; }
.stack { display: flex; flex-direction: column; }
.divider { height: 1px; background: var(--ink-200); margin: 6mm 0; }
.page--dark .divider { background: rgba(255,255,255,.12); }
.maxw { max-width: 150mm; }

/* ── Tweaks root ──────────────────────────────────────────── */
#tweaks-root { position: fixed; inset: 0; pointer-events: none; z-index: 9999; }
#tweaks-root > * { pointer-events: auto; }

/* ── Typeface patch 2026-06-09 — Source Serif 4 ───────────── */
/* Low-contrast serif reads lighter than Fraunces at the same weight,
   so nudge display + numerals heavier, and switch on lining/tabular figures. */
.display, .h1, .h2 { font-weight: 600; }
.cover__title { font-weight: 620; }
.pquote__t { font-weight: 560; }
.cover__bignum, .bigstat__n, .rating__n, .take__n, .callout h3 { font-weight: 660; }
.cover__bignum, .bigstat__n, .rating__n, .take__n, .callout h3,
#report[data-viz="editorial"] .datum__val { font-feature-settings: var(--fr-num); }
#report[data-viz="editorial"] .datum__val { font-weight: 640; }

/* ── Print ────────────────────────────────────────────────── */
@page { size: A4 portrait; margin: 0; }
@media print {
  body { background: #fff; }
  #report { display: block; padding: 0; gap: 0; }
  .page {
    box-shadow: none; margin: 0; break-after: page; break-inside: avoid;
    width: 210mm; height: 297mm;
    -webkit-print-color-adjust: exact; print-color-adjust: exact;
  }
  .page:last-child { break-after: auto; }
  #tweaks-root { display: none !important; }
}

/* ── Screen niceties ──────────────────────────────────────── */
@media (max-width: 840px) {
  #report { padding: 16px 8px 60px; }
}

/* ── Responsive web overrides (Uku — for the gated web report, not the print original) ── */
@media (max-width: 820px) {
  #report { padding: 14px 10px 56px; gap: 16px; }
  .page { width: 100%; height: auto; min-height: 0; padding: 26px 20px; border-radius: 10px; }
  .cover { padding: 0; }
  .cover__inner { padding: 30px 22px 26px; min-height: 86vh; }
  .cover__mark { margin-top: 22mm; }
  .cover__title { font-size: 32pt; }
  .cover__sub { font-size: 11.5pt; max-width: none; }
  .cover__stat { flex-direction: column; align-items: flex-start; gap: 6mm; }
  .cover__bignum { font-size: 50pt; }
  .cover__statcopy { max-width: none; padding-bottom: 0; }
  .display { font-size: 32pt; } .h1 { font-size: 21pt; } .h2 { font-size: 19pt; }
  .cols, .cols--even, .cols--narrow-left, .fw, .findgrid, .takeaways, .statgrid { grid-template-columns: 1fr !important; gap: 22px; }
  .find:nth-child(odd) { padding-right: 0; }
  .find:nth-child(even) { padding-left: 0; border-left: 0; }
  .find, .bigstat { border-top: 1px solid var(--ink-200); padding: 5mm 0; }
  .page--dark .find, .page--dark .bigstat { border-top-color: rgba(255,255,255,.14); }
  .about__ratings { flex-wrap: wrap; row-gap: 18px; }
  .rating { flex: 0 0 46%; padding: 0 12px 0 0; }
  .rating + .rating { border-left: 0; padding-left: 0; }
  .featlist { columns: 1; }
  .pquote__t { font-size: 13pt !important; }
  .callout h3 { font-size: 16pt; }
  .maxw { max-width: none; }
}