/* Equalis-cystatin-C: Stilguide-Equalis-cystatin-C.html, 2026-10-04.
   Endast svenska och engelska v2. Alla mått avser scenen 1920 × 1080. */
@font-face {
  font-family: 'Crimson Pro';
  src: url('./assets/crimson-pro.woff2') format('woff2');
  font-weight: 200 900;
  font-style: normal;
  font-display: block;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('./assets/ibm-plex-mono-regular.woff2') format('woff2');
  font-weight: 400;
  font-display: block;
}
@font-face {
  font-family: 'IBM Plex Mono';
  src: url('./assets/ibm-plex-mono-semibold.woff2') format('woff2');
  font-weight: 500 900;
  font-display: block;
}
:root {
  color-scheme: light;
  --surface: #fff;
  --fg: #171717;
  --charcoal: #323232;
  --muted-fg: #62605c;
  --muted: #cccac3;
  --crimson: #171717;
  --font-serif: 'Crimson Pro', Georgia, serif;
  --font-sans: var(--font-serif);
  --font-mono: 'IBM Plex Mono', monospace;
  --color-points: #8a8984;
  --color-ols: #4c6f91;
  --color-deming: #637f68;
  --color-pb: #82708d;
  --color-ellipse: #9b5b57;
  --color-identity: #8a8984;
}
html, body, .reveal-viewport { background: #fff; color: var(--fg); }
.reveal { font: 400 34px/1.22 var(--font-serif); color: var(--fg); }
.reveal .slides { text-align: left; }
.reveal .slides > section,
.reveal .slides > section.title-slide,
.reveal .slides > section.title-slide.title-slide-main {
  display: block !important;
  height: 1080px;
  padding: 0;
  box-sizing: border-box;
  text-align: left;
}
.lecture-paper {
  box-sizing: border-box;
  position: relative;
  width: 1560px;
  height: 1000px;
  margin: 16px auto 0;
  padding: 24px 32px 64px;
  border: 1.2px solid #171717;
  background: #fff;
}
.lecture-paper::before, .outliers-copy-header::before {
  content: '';
  display: block;
  height: 2.5px;
  background: #171717;
  margin-bottom: 12px;
}
.reveal h1, .reveal h2, .reveal .title-slide h1 {
  font: 600 42px/1.08 var(--font-serif);
  color: var(--fg);
  letter-spacing: 0;
  margin: 0 0 30px;
}
.reveal h3 { font: 600 32px/1.15 var(--font-serif); margin: 0 0 22px; }
.reveal p { margin: 0 0 22px; line-height: 1.22; }
.reveal .section-label {
  font: 400 16px/1.22 var(--font-serif);
  font-variant-caps: all-small-caps;
  letter-spacing: .08em;
  text-transform: none;
  color: var(--muted-fg);
  margin: 0 0 14px;
}
.reveal .body-text { font: 400 34px/1.22 var(--font-serif); color: var(--charcoal); max-width: none; }
.reveal .aside-text, .reveal .beta-caption { font: 400 23px/1.3 var(--font-serif); color: var(--muted-fg); }
.reveal .title-slide .title-content { max-width: none; margin: 0; text-align: left; }
.reveal .title-slide-main .title-content { margin-top: 80px; }
.reveal .title-slide-main h1 {
  font-size: 112px;
  line-height: 1.04;
  letter-spacing: -.015em;
}
.reveal .title-slide .title-subtitle {
  font: 400 38px/1.22 var(--font-serif);
  color: var(--fg);
  margin: 70px 0 40px;
}
.reveal .title-author { font: 400 23px/1.22 var(--font-serif); letter-spacing: 0; text-transform: none; color: var(--muted-fg); }
.reveal .title-rule { display: none; }
.reveal .closing-contact { font: 400 23px/1.4 var(--font-serif); margin: 22px 0; }
.reveal .closing-attribution { font: 400 23px/1.3 var(--font-serif); margin: 22px 0 60px; }
.reveal .pull-quote, .reveal .pull-quote p {
  font: italic 400 34px/1.22 var(--font-serif);
  color: var(--fg);
}
.reveal blockquote.pull-quote { border-left: 1px solid var(--fg); padding: 0 0 0 24px; margin: 30px 0; }
.reveal .closing-quote { text-align: left !important; max-width: 34em !important; margin: 80px 0 22px !important; }
.reveal .key-points { max-width: none; margin: 30px 0; }
.reveal .key-points .body-text { border-left: none; padding: 16px 0; margin: 0; border-bottom: 1px solid var(--muted); }
.reveal .r-squared-explanation .body-text { font-size: 32px; line-height: 1.22; }
.reveal .r-squared-explanation .aside-text { font-size: 23px; }
.reveal .takeaway-list { max-width: none; margin: 30px 0; }
.reveal .takeaway-list li {
  font: 400 34px/1.22 var(--font-serif);
  color: var(--fg);
  border-left: none;
  border-bottom: 1px solid var(--muted);
  padding: 18px 0;
  margin: 0;
}
.reveal .takeaway-list li:last-child { border-bottom: none; }
.reveal .takeaway-list li strong { color: var(--fg); }
.reveal #kallor .takeaway-list li, .reveal #references .takeaway-list li { font-size: 30px; padding: 12px 0; }
.reveal .workflow-cta, .reveal .beta-message {
  font: 600 34px/1.22 var(--font-serif);
  color: var(--fg);
  text-align: left;
  max-width: none;
  border-top: 1px solid var(--muted);
  padding-top: 24px;
  margin: 30px 0 22px;
}
.reveal .workflow-list, .reveal .workflow-beta .workflow-list { max-width: none; margin: 30px 0; }
.reveal .workflow-list li, .reveal .workflow-beta .workflow-list li {
  font: 400 34px/1.22 var(--font-serif);
  color: var(--fg);
  padding: 22px 0 22px 70px;
  border-bottom: 1px solid var(--muted);
}
.reveal .workflow-list li::before, .reveal .workflow-beta .workflow-list li::before {
  font: 400 23px/1.22 var(--font-mono);
  border: none;
  border-radius: 0;
  color: var(--muted-fg);
  width: 48px;
  height: auto;
  top: 24px;
}
.portrait-row { grid-template-columns: 430px minmax(0, 1fr); gap: 22px 56px; max-width: none; }
.portrait-frame { width: 430px; border: 1px solid var(--fg); box-shadow: none; background: #fff; }
.reveal .portrait-frame img { width: 100%; height: auto; border: none; box-shadow: none; }
.reveal .galton-intro .section-label {
  font-size: 28px;
  font-weight: 500;
  font-variant-caps: normal;
  letter-spacing: .04em;
  margin-bottom: 24px;
}
.galton-intro .portrait-frame {
  border-radius: 14px;
  box-shadow: 0 6px 22px rgba(23, 23, 23, .14);
}
.reveal .year-span { font: 400 23px/1.3 var(--font-mono); margin: 0 0 22px; }
.reveal section img.galton-plate { max-height: 700px; height: 700px; border: 1px solid var(--muted); box-shadow: none; }
.galton-plate-caption { font: 400 23px/1.3 var(--font-serif); }
/* Enskilda diagram delar format och marginaler i lectureChart. */
.viz-container { max-width: 900px; margin: 22px auto; }
.cloud-wrapper { width: 100%; max-width: 900px; display: flex; flex-direction: column; align-items: center; }
/* Diagrammet har en fast plats efter rubriken; alla reglage ligger under det. */
.cloud-wrapper > * { flex-shrink: 0; }
.cloud-wrapper > svg { display: block; width: 100%; height: auto; order: -1; }
.ba-beta .viz-container { max-width: 900px; }
.ba-beta .beta-caption { font-size: 23px; margin: 16px 0; text-align: left; }
.ba-beta .beta-message { margin: 24px 0 16px; }
.beta-two-cols { max-width: none; gap: 56px; margin: 30px 0; }
.beta-two-cols svg text { font: 400 23px var(--font-serif); fill: var(--charcoal); }
.beta-two-cols h3, .reveal .beta-methods h3 { font-size: 32px; }
.beta-dot { fill: var(--color-points); stroke: var(--fg); stroke-width: .5; }
.beta-grid { stroke: var(--muted); stroke-width: 1; }
.beta-methods { max-width: none; gap: 56px; margin: 60px 0 0; }
.beta-methods > div { border: none; border-top: 1px solid var(--fg); padding: 24px 0 0; }
.reveal .beta-methods p { font-size: 34px; line-height: 1.22; }
.reveal .beta-methods .beta-caption { font-size: 23px; }
.reveal .beta-formula { font: 400 44px/1.3 var(--font-serif); }
.anscombe-wrapper, .datasaurus-wrapper { max-width: 100%; }
.anscombe-cell svg, .datasaurus-cell svg, .hetero-cell svg { background: #fff; border: 1px solid var(--muted); border-radius: 0; }
.datasaurus-stats, .stats-display, .agreement-stats, .ols-ssr-inline {
  background: #fff;
  border: 1px solid var(--muted);
  border-radius: 0;
  font: 400 23px/1.3 var(--font-mono);
}
.datasaurus-stats-title { font: 600 32px/1.15 var(--font-serif); }
.datasaurus-stats-row { font: 400 23px/1.3 var(--font-mono); }
.axis text { font: 400 20px var(--font-serif); fill: var(--charcoal); }
.axis-label { font: 400 23px var(--font-serif); fill: var(--charcoal); letter-spacing: 0; }
.axis line, .axis path, .axis .domain { stroke: var(--fg); stroke-width: 1; }
.axis .tick line { stroke: #e0dfdb; }
.dot { fill: var(--color-points); stroke: var(--fg); stroke-width: .5; opacity: .82; }
.ba-label, .ba-label-loa { font: 400 19px var(--font-mono); }
.slider-row label { font: 400 23px var(--font-serif); letter-spacing: 0; }
.slider-row .slider-value { font: 500 28px var(--font-mono); inline-size: 5ch; min-inline-size: 5ch; flex: 0 0 5ch; text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.legend, .hetero-label { font: 400 23px var(--font-serif); text-transform: none; letter-spacing: 0; }
.toggle-group button, .ellipse-toggle-btn, .pb-animate-btn {
  font: 400 23px/1.2 var(--font-serif);
  text-transform: none;
  letter-spacing: 0;
  padding: 8px 18px;
  background: #fff;
  color: var(--fg);
  border: 1px solid var(--fg);
  border-radius: 0;
  box-shadow: none;
}
.toggle-group button.active, .toggle-group button[data-method].active, .ellipse-toggle-btn.active,
.ellipse-toggle-btn.agreement-toggle-identity.active,
.ellipse-toggle-btn.agreement-toggle-deming.active,
.ellipse-toggle-btn.ba-toggle-trend.active {
  background: var(--fg);
  color: #fff;
  border-color: var(--fg);
}
/* Metodfärg i figurernas linjer och legender; knapparna är monokroma. */
.datasaurus-reg-line, .ba-trend-line { stroke: var(--color-ols); }
.ba-mean-line, .ba-loa-line { stroke: var(--fg); }
.ba-label { fill: var(--fg); }
#correlation-cloud-container .ellipse-overlay,
#correlation-cloud-container .ellipse-overlay-line { stroke: var(--color-ellipse); }
.reveal button:focus-visible, .reveal input:focus-visible { outline: 2px solid var(--fg); outline-offset: 4px; }
.reveal .slides section, .reveal .slides section .fragment { transition: none !important; }
.reveal .slides section .fragment:not(.visible) { transform: none; }
/* Fragmenten ritas i samma filterlager så rubriken inte växlar rendering. */
[data-copy-edge-trial] .lecture-paper .fragment { will-change: auto; }
.reveal .progress { color: var(--fg); height: 2px; }
.lv-bar {
  bottom: 2px;
  padding: 2px;
  gap: 0;
  border: 1px solid var(--fg);
  border-radius: 0;
  background: #fff;
  box-shadow: none;
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  font-family: var(--font-serif);
  line-height: 1;
}
.lv-btn { height: clamp(16px, 4vh, 28px); font-family: var(--font-serif); border-radius: 0; font-size: clamp(10px, 1.8vh, 14px); color: var(--fg); }
.lv-count { font: 400 clamp(10px, 1.8vh, 14px)/1 var(--font-mono); color: var(--fg); }
.lv-sep { height: clamp(12px, 3vh, 20px); background: var(--muted); }

/* Fotokopia, 2026-10-06. Referens: photocopy.md. V1 berörs inte. */
@font-face { font-family: Tinos; src: url('./assets/tinos-regular.woff2'); font-style: normal; font-weight: 400; font-display: block; }
@font-face { font-family: Tinos; src: url('./assets/tinos-bold.woff2'); font-style: normal; font-weight: 500 900; font-display: block; }
@font-face { font-family: Tinos; src: url('./assets/tinos-italic.woff2'); font-style: italic; font-weight: 400; font-display: block; }
@font-face { font-family: Tinos; src: url('./assets/tinos-bold-italic.woff2'); font-style: italic; font-weight: 500 900; font-display: block; }
:root {
  --surface: #f7f6f3; --fg: #3a3a3a; --charcoal: #3a3a3a; --crimson: #3a3a3a;
  --muted-fg: #3a3a3a; --muted: #b7b6b2;
  --font-serif: Tinos, 'Times New Roman', serif;
  --font-sans: var(--font-serif); --font-mono: var(--font-serif);
  --color-points: #3a3a3a; --color-ols: #4c6f91; --color-deming: #637f68;
  --color-pb: #82708d; --color-ellipse: #3a3a3a; --color-identity: #3a3a3a;
}
html, body, .reveal-viewport, .reveal { background: #3a3a3a; }
.reveal .slides > section {
  /* Clip the rotated paper without becoming a scroll container. Keyboard
     focus must not scroll the entire slide by a few pixels. */
  isolation: isolate; overflow: hidden; overflow: clip;
  background: radial-gradient(ellipse at var(--copy-x,50%) var(--copy-y,45%), #f7f6f3 0%, #f0efec 70%, var(--copy-edge,#e4e3e0) 100%);
}
.lecture-paper {
  width: 1920px; height: 1080px; margin: 0;
  padding: 48px 96px 96px; border: 0; background: transparent;
  transform: translate(var(--copy-dx,0px),var(--copy-dy,0px)) rotate(var(--copy-angle,.1deg));
  transform-origin: center; filter: blur(.45px); z-index: 2;
}
.lecture-paper::before, .outliers-copy-header::before { height: 4px; background: var(--fg); border-bottom: 1px solid var(--fg); padding-bottom: 5px; background-clip: content-box; margin-bottom: 20px; }
.reveal .section-label { text-transform: uppercase; font-variant-caps: normal; font-size: 18px; letter-spacing: .12em; }
.reveal h1, .reveal h2, .reveal h3 { font-weight: 700; }
.reveal .galton-intro .section-label { font-size: 28px; letter-spacing: .1em; }
.axis text, .axis-label { font-size: 25px; }
.axis path, .axis .domain { stroke-width: 2px; }
.axis .tick line { stroke: var(--fg); opacity: .12; stroke-dasharray: 3 6; }
.dot, .beta-dot { fill: var(--fg); stroke: var(--fg); opacity: .55; }
.line-ols, .datasaurus-reg-line { stroke: var(--color-ols); stroke-width: 4px; stroke-dasharray: none; }
.line-deming { stroke: var(--color-deming); stroke-width: 3px; stroke-dasharray: none; }
.line-pb { stroke: var(--color-pb); stroke-width: 3px; stroke-dasharray: none; stroke-linecap: round; }
.line-true, .line-identity { stroke: var(--fg); stroke-width: 2px; stroke-dasharray: 3 6; }
.ba-trend-line { stroke-width: 4px; }
.ba-mean-line { stroke-width: 3px; }
.ba-loa-line { stroke-width: 2px; stroke-dasharray: 3 6; }
.residual-line, .residual-line.ols, .residual-line.deming { stroke: var(--color-residual); stroke-width: 2px; }
#correlation-cloud-container .ellipse-overlay { stroke-width: 3px; }
#correlation-cloud-container .ellipse-overlay-line { stroke-width: 2px; stroke-dasharray: 14 9; }
.legend-swatch[data-copy-method="deming"] { background: none !important; border-top: 3px solid var(--color-deming); height: 0; }
.legend-swatch[data-copy-method="pb"] { background: none !important; border-top: 3px dotted var(--color-pb); height: 0; }
.legend-swatch[data-copy-method="true"] { background: none !important; border-top: 3px dotted var(--fg); height: 0; }
.cloud-wrapper svg, .beta-two-cols svg, .anscombe-cell svg, .datasaurus-cell svg, .hetero-cell svg,
.portrait-frame, .datasaurus-stats, .stats-display, .agreement-stats, .ols-ssr-inline,
.toggle-group button, .ellipse-toggle-btn, .pb-animate-btn { background: transparent; }
.galton-intro .portrait-frame { border-radius: 0; box-shadow: none; }
.reveal .galton-plate, .reveal .portrait-frame img { filter: grayscale(1); }
.reveal table { border-top: 2px solid var(--fg); border-bottom: 2px solid var(--fg); border-collapse: collapse; }
.reveal table th, .reveal table td { border-left: 0; border-right: 0; border-bottom: 1px solid var(--fg); }
.reveal table th { font-style: italic; }
.copy-layer { position: absolute; inset: 0; width: 1920px; height: 1080px; pointer-events: none; z-index: 0; }
.copy-page-number { position: absolute; bottom: 48px; right: 96px; z-index: 2; font: 400 24px var(--font-serif); color: var(--fg); filter: blur(.45px); transform: rotate(var(--copy-angle,.1deg)); }
.lv-bar { background: #f7f6f3; }
@media (prefers-reduced-motion: reduce) { .lecture-paper { transform: none; } }

/* Slide 2: porträtt och rubrik börjar på samma rad. */
.galton-intro .galton-portrait { grid-column: 1; grid-row: 1 / span 2; width: 430px; margin: 0; align-self: stretch; position: relative; min-height: 0; }
.galton-intro .portrait-frame { box-sizing: border-box; position: absolute; inset: 0; width: 100%; height: 100%; border: 4px solid var(--fg); padding: 4px; }
.reveal .galton-intro .portrait-frame img { box-sizing: border-box; height: 100%; max-height: none; object-fit: cover; object-position: 55% center; border: 1px solid var(--fg); }
.reveal .galton-portrait figcaption { position: absolute; top: 100%; left: 9px; right: 9px; font: italic 400 23px/1.25 var(--font-serif); color: var(--fg); margin: 12px 0 0; text-align: left; }

.galton-intro .portrait-row { margin-top: 56px; }

.galton-intro .portrait-body > p:last-child { margin-bottom: 0; }

/* Originaltryckets vita papper blir transparent; bara trycksvärtan återstår. */
.reveal .galton-plate-row { width: fit-content; margin: 48px auto 0; text-align: left; }
.galton-plate-frame { border: 4px solid var(--fg); padding: 4px; }
.reveal section .galton-plate-frame img.galton-plate { display: block; height: 680px; max-height: none; width: auto; margin: 0; border: 1px solid var(--fg); filter: url(#galton-print-ink); }
.reveal .galton-plate-caption { font: italic 400 23px/1.25 var(--font-serif); margin: 12px 9px 0; color: var(--fg); text-align: left; }
.print-filter-defs { position: absolute; pointer-events: none; }

/* Interaktiv figur med samma dubbla tryckram och statiska bildtext. */
.reveal .correlation-figure { width: 918px; margin: 22px auto 0; }
.interactive-copy-frame { border: 4px solid var(--fg); padding: 4px; }
.correlation-figure .viz-container { box-sizing: content-box; width: 900px; max-width: none; margin: 0; border: 1px solid var(--fg); }
#correlation-cloud-container .overlay-toggles { margin-bottom: 18px; }
.reveal .correlation-figure figcaption { font: italic 400 23px/1.25 var(--font-serif); margin: 12px 9px 0; color: var(--fg); text-align: left; }
.correlation-figure .dot { fill: var(--fg); stroke: var(--fg); opacity: 1; }
.correlation-figure input[type=range]::-webkit-slider-thumb { background: var(--fg); border: 0; box-shadow: none; }
.correlation-figure input[type=range]::-moz-range-thumb { background: var(--fg); border: 0; box-shadow: none; }

/* Dämpad röd trycksvärta bara i korrelationsfigurens ellips och huvudaxlar. */
#correlation-cloud-container .ellipse-overlay,
#correlation-cloud-container .ellipse-overlay-line { stroke: #9b5b57; }

/* Samma yttre mått även när figuren bara har ett reglage. */
.correlation-figure .cloud-wrapper { min-height: 673px; }

/* Same plot, frame and reserved lower track, with local figure-step arrows. */
.rtm-fragments { position: absolute; width: 0; height: 0; overflow: hidden; pointer-events: none; }
.rtm-wrapper { --rtm-ink: #9b5b57; }
.rtm-part[data-rtm-group=low] { --rtm-ink: #4c6f91; }
.rtm-wrapper .rtm-part { transition: opacity 350ms ease; }
.rtm-wrapper .rtm-part[aria-hidden=true] { opacity: 0; visibility: hidden; }
.rtm-plot-border, .rtm-mean-indicator { fill: none; stroke: var(--fg); stroke-width: 1; }
.rtm-part[data-rtm-group] .rtm-mean-indicator { stroke: var(--rtm-ink); }
.rtm-point { fill: var(--fg); stroke: none; opacity: 1; transition: opacity 350ms ease; }
#regression-mean-container[data-rtm-selection=high] .rtm-point[data-selected=false],
#regression-mean-container[data-rtm-selection=low] .rtm-point[data-selected-low=false] { opacity: .24; }
.rtm-mean-guide { stroke: var(--fg); opacity: .35; stroke-width: 1.2; stroke-dasharray: 2 6; }
.rtm-identity { stroke: var(--fg); opacity: .5; visibility: visible; stroke-width: 1.7; stroke-dasharray: 8 6; }
.rtm-group-guide { fill: none; stroke: var(--rtm-ink); stroke-width: 2.8; stroke-dasharray: 9 7; }
.rtm-guide-reveal { transform-box: fill-box; }
.rtm-guide-reveal-vertical { transform-origin: center bottom; transform: scaleY(0); }
.rtm-guide-reveal-horizontal { transform-origin: left center; transform: scaleX(0); }
#regression-mean-container .rtm-guide-reveal-vertical[aria-hidden=false] { transform: scaleY(1); transition: transform 800ms ease-out; }
#regression-mean-container .rtm-guide-reveal-horizontal[aria-hidden=false] { transform: scaleX(1); transition: transform 800ms ease-out; }
#regression-mean-container:is([data-rtm-stage="5"], [data-rtm-stage="10"]) .rtm-identity { opacity: 0; visibility: hidden; }
#regression-mean-container:is([data-rtm-stage="5"], [data-rtm-stage="10"]) .rtm-mean-guide { opacity: .55; }
.rtm-distance-mark path { fill: none; stroke: var(--rtm-ink); stroke-width: 2.8; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; }
.rtm-comparison[aria-hidden=false] .rtm-distance-stroke { stroke-dashoffset: 0; transition: stroke-dashoffset 600ms ease-out; }
/* Fade the completed red annotations before restoring the unchanged data.
   Keep their clipping and drawn strokes intact until the fade has finished. */
#regression-mean-container[data-rtm-reset=high] .rtm-part[data-rtm-group=high] { transition: opacity 180ms ease, visibility 0s linear 180ms; }
#regression-mean-container[data-rtm-reset=high] .rtm-guide-reveal[data-rtm-to="5"] { transform: scale(1); }
#regression-mean-container[data-rtm-reset=high] .rtm-comparison[data-rtm-group=high] .rtm-distance-stroke { stroke-dashoffset: 0; }
#regression-mean-container[data-rtm-reset=high] :is(.rtm-point, .rtm-identity, .rtm-mean-guide) { transition: opacity 300ms ease 180ms; }
.rtm-footer { position: relative; width: 100%; height: 113px; }
.rtm-status { box-sizing: border-box; height: 113px; width: 100%; padding: 6px 80px 10px; display: flex; flex-direction: column; justify-content: center; text-align: center; }
.rtm-controls { position: absolute; inset: 0; pointer-events: none; }
.reveal .rtm-step-button { position: absolute; top: 50%; transform: translateY(-50%); width: 44px; height: 44px; padding: 0; border: 1px solid var(--fg); border-radius: 0; background: transparent; color: var(--fg); display: grid; place-items: center; cursor: pointer; pointer-events: auto; }
.rtm-step-prev { left: 20px; }
.rtm-step-next { right: 20px; }
.rtm-step-button svg { width: 22px; height: 22px; fill: none; stroke: currentColor; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.reveal .rtm-step-button:disabled { opacity: .3; cursor: default; }
.reveal .rtm-step-button:focus-visible { outline: 2px solid var(--fg); outline-offset: 4px; }
.reveal .rtm-step-heading { font: 600 25px/1.15 var(--font-serif); margin: 0 0 4px; }
.reveal .rtm-step-caption { font: 400 23px/1.25 var(--font-serif); margin: 0; }
@media (prefers-reduced-motion: reduce) {
  .rtm-wrapper .rtm-part, .rtm-point, .rtm-identity, .rtm-mean-guide, #regression-mean-container .rtm-guide-reveal, .rtm-distance-mark path { transition: none !important; }
}
@media print {
  .rtm-controls { display: none; }
  .rtm-wrapper .rtm-part[aria-hidden=true] { opacity: 1; visibility: visible; }
  #regression-mean-container .rtm-guide-reveal { transform: none; }
  .rtm-distance-mark path { stroke-dashoffset: 0; }
}

/* Metodjämförelsen använder samma tryckram och Demings dämpade gröna svärta. */
#agreement-scatter-container .agreement-reg-line { stroke: var(--color-deming); stroke-width: 3px; stroke-dasharray: none; }
#agreement-scatter-container .agreement-stats { border: 0; background: transparent; padding: 0 18px; margin: 0 auto 12px; }
/* Samma rena axlar som i föregående figurer. */
#agreement-scatter-container .axis-label { display: none; }

/* Bland–Altman behåller plats för skalvärden och samma yttre tryckram. */
#bland-altman-container .agreement-stats { border: 0; background: transparent; padding: 0 18px; margin: 0 auto; }
#bland-altman-container .overlay-toggles { margin-bottom: 12px; }
#bland-altman-container .ba-trend-line { stroke: var(--color-ols); }
/* Lite luft ovanför Bland–Altman-grafens skalvärden. */
#bland-altman-container .cloud-wrapper > svg { margin-top: 18px; }

/* OLS-reglagen delar en rad för att behålla samma figurformat. */
:is(#ols-residual-container, #deming-residual-container) .cloud-wrapper { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); align-content: start; }
:is(#ols-residual-container, #deming-residual-container) .cloud-wrapper > svg,
:is(#ols-residual-container, #deming-residual-container) .overlay-toggles { grid-column: 1 / -1; }
:is(#ols-residual-container, #deming-residual-container) .slider-row { gap: 8px; margin: 6px 0; }
:is(#ols-residual-container, #deming-residual-container) .slider-row label { min-width: 0; }
:is(#ols-residual-container, #deming-residual-container) .slider-row input { width: 130px; }
:is(#ols-residual-container, #deming-residual-container) .slider-value { min-width: 54px; }
/* Each changing readout has its own reserved track; digits cannot move buttons. */
:is(#ols-residual-container, #deming-residual-container) .overlay-toggles-with-readout {
  display: grid;
  grid-template-columns: 300px 90px 140px 110px;
  justify-content: center;
  align-items: center;
  gap: 24px;
}
:is(#ols-residual-container, #deming-residual-container) .ols-ssr-inline {
  box-sizing: border-box;
  width: 100%;
  display: flex;
  justify-content: center;
  align-items: baseline;
  gap: 8px;
  height: 45.6px;
  padding: 8px 18px;
  border: 1px solid var(--fg);
  border-radius: 0;
  background: transparent;
  color: var(--fg);
  font: 400 23px/1.2 var(--font-serif);
  font-variant-numeric: tabular-nums;
  white-space: nowrap;
}
#ols-residual-container .line-ols { stroke: var(--color-ols); }

/* Deming har ett extra reglage men samma graf, ram och kontrollnivåer. */
/* De längre etiketterna får bredare kolumner och luft mot grannvärdet och ramen. */
#deming-residual-container .cloud-wrapper { grid-template-columns: .85fr .85fr 1.15fr 1.15fr; }
/* Varje etikett, slider och värde bildar en tät grupp; reservutrymmet ligger efter värdet. */
#deming-residual-container .slider-row { width: max-content; justify-self: center; justify-content: flex-start; gap: 8px; }
#deming-residual-container .slider-row input { width: 80px; margin: 0; }
#deming-residual-container .slider-value { text-align: left; }
#deming-residual-container .line-deming { stroke: var(--color-deming); }

/* Passing–Bablok: dämpad lila, även för de animerade parvisa lutningarna. */
#pb-residual-container svg line:not([class]) { stroke: var(--color-pb); stroke-opacity: .06; }
#pb-residual-container .slider-row { margin: 6px 0; }

/* Långa SVG-prov använder exakt grafens linjeklasser. Modellknapparna är svarta. */
#model-convergence-container .legend { display: flex; justify-content: center; gap: 24px; margin: 6px 0 12px; }
#model-convergence-container .legend-item { display: flex; align-items: center; gap: 10px; }
#model-convergence-container .legend-swatch { display: block; width: 100px; height: 20px; background: none !important; border: 0; flex-shrink: 0; }
#model-convergence-container .legend-swatch svg { display: block; width: 100px; height: 20px; border: 0; background: transparent; }

/* Lite mer luft mellan korrelationsreglaget och modelllegenden. */
#model-convergence-container .slider-row { transform: translateY(-12px); }
/* Frågetecknets plats är reserverad även innan r når 0,99. */
#model-convergence-container .slider-row { min-height: 46px; margin: 0; gap: 12px; }
#model-convergence-container .slider-row label { min-width: 0; }
#model-convergence-container .slider-value { text-align: left; }
#model-convergence-container .convergence-question-slot { display: flex; align-items: center; width: 36px; height: 46px; flex: 0 0 36px; }
#model-convergence-container .convergence-mystery-toggle { box-sizing: border-box; display: grid; place-items: center; width: 36px; height: 36px; padding: 0; border: 2px solid var(--fg); border-radius: 50%; background: var(--fg); color: #fff; font: 400 26px/1 var(--font-serif); }
#model-convergence-container .convergence-mystery-toggle svg { display: block; width: 20px; height: 20px; margin: 0; border: 0; background: transparent; }
#model-convergence-container .convergence-mystery-toggle[hidden] { display: none; }
#model-convergence-container .convergence-mystery-toggle:focus-visible { outline: 1px dashed var(--fg); outline-offset: 4px; }
#model-convergence-container .convergence-context-point { fill: var(--muted); opacity: .16; }
#model-convergence-container .convergence-detail-stats { fill: var(--fg); font: 400 23px var(--font-serif); }

/* Regressionens roll: två samlade textblock med tydligare formelhierarki. */
.reveal .regression-role-slide .key-points { max-width: 1380px; margin: 48px 0 0; }
.reveal .regression-role-slide .key-points .body-text { border: 0; padding: 0; margin: 0; }
.reveal .regression-role-slide .regression-bias-summary { padding-bottom: 26px; border-bottom: 1px solid var(--muted); }
.reveal .regression-role-slide .regression-bias-summary .body-text + .body-text { margin-top: 12px; }
.reveal .regression-role-slide .r-squared-explanation { margin-top: 30px; }
.reveal .regression-role-slide .r-squared-explanation .body-text { font-size: 32px; line-height: 1.35; margin-top: 20px; }
.reveal .regression-role-slide .r-squared-explanation .r-squared-formula { font-size: 44px; margin: 0 0 26px; }
.reveal .regression-role-slide .r-squared-explanation .aside-text { font-size: 25px; margin-top: 26px; }

/* Anscombes kvartett som en sammanhållen figur med fyra paneler. */
.reveal .anscombe-copy-figure { width: 918px; margin: 22px auto 0; }
.anscombe-copy-figure #anscombe-container { width: 900px; margin: 0; border: 1px solid var(--fg); box-sizing: content-box; padding: 0; }
.anscombe-copy-figure .anscombe-wrapper { position: relative; padding: 18px 34px; }
.anscombe-copy-figure .anscombe-grid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 18px; }
.anscombe-copy-figure .anscombe-cell { position: relative; width: auto; }
.anscombe-copy-figure .anscombe-cell svg { display: block; width: 100%; height: auto; border: 1px solid var(--muted); background: transparent; }
.anscombe-copy-figure .anscombe-cell::before { position: absolute; top: 4px; left: 9px; font: 700 23px var(--font-serif); color: var(--fg); }
.anscombe-copy-figure .anscombe-cell:nth-child(1)::before { content: 'A'; }
.anscombe-copy-figure .anscombe-cell:nth-child(2)::before { content: 'B'; }
.anscombe-copy-figure .anscombe-cell:nth-child(3)::before { content: 'C'; }
.anscombe-copy-figure .anscombe-cell:nth-child(4)::before { content: 'D'; }
.anscombe-copy-figure .dot { fill: var(--fg); stroke: var(--fg); opacity: 1; }
.anscombe-copy-figure .datasaurus-reg-line { stroke: var(--color-ols); }
.reveal .anscombe-copy-figure figcaption { font: italic 23px/1.25 var(--font-serif); color: var(--fg); margin: 12px 0 0 9px; text-align: left; }
.anscombe-copy-figure .datasaurus-stats { position: absolute; top: calc(100% + 48px); left: 0; right: 0; border: 0; background: transparent; margin: 0; padding: 0; }
.anscombe-copy-figure .datasaurus-stats-title { font-size: 25px; margin: 0 0 8px; }
.anscombe-copy-figure .datasaurus-stats-row { font-size: 23px; }

.anscombe-copy-figure .anscombe-wrapper { box-sizing: border-box; width: 100%; }
.anscombe-copy-figure .anscombe-cell { min-width: 0; }

/* Datasaurus: ett långt figurband med två paneler synliga inom ramen. */
.reveal .datasaurus-copy-figure { width: 918px; margin: 22px auto 0; }
.datasaurus-copy-figure #datasaurus-container { width: 900px; margin: 0; border: 1px solid var(--fg); box-sizing: content-box; padding: 0; }
.datasaurus-copy-figure .datasaurus-wrapper { width: 100%; height: 673px; box-sizing: border-box; padding: 18px 0 20px; position: relative; display: flex; flex-direction: column; }
.datasaurus-copy-figure .datasaurus-viewport { overflow: hidden; width: 100%; flex: 1; min-height: 0; display: flex; align-items: center; }
.datasaurus-copy-figure .datasaurus-grid { display: flex; width: 100%; flex-shrink: 0; height: 400px; gap: 0; padding: 0; overflow: visible; transition: transform 180ms ease-out; }
.datasaurus-copy-figure .datasaurus-cell { flex: 0 0 50%; min-width: 0; box-sizing: border-box; padding: 12px; display: flex; align-items: center; }
.datasaurus-copy-figure .datasaurus-cell svg { width: 100%; height: auto; display: block; border: 1px solid var(--muted); background: transparent; }
.datasaurus-copy-figure .dot { fill: var(--fg); stroke: var(--fg); opacity: 1; }
.datasaurus-copy-figure .datasaurus-reg-line { stroke: var(--color-ols); stroke-width: .8; }
.datasaurus-copy-figure .datasaurus-slider { justify-content: center; flex-shrink: 0; margin: 24px 0 0; }
.datasaurus-copy-figure .datasaurus-slider input { width: 360px; }
.datasaurus-copy-figure .datasaurus-slider .slider-value { min-width: 140px; font-size: 25px; }
.reveal .datasaurus-copy-figure figcaption { font: italic 23px/1.25 var(--font-serif); color: var(--fg); margin: 12px 0 0 9px; text-align: left; }
.datasaurus-copy-figure .datasaurus-stats { position: absolute; top: calc(100% + 48px); left: 0; right: 0; border: 0; background: transparent; margin: 0; padding: 0; }
.datasaurus-copy-figure .datasaurus-stats-title { font-size: 25px; margin: 0 0 8px; }
.datasaurus-copy-figure .datasaurus-stats-row { font-size: 23px; }
@media (prefers-reduced-motion: reduce) { .datasaurus-copy-figure .datasaurus-grid { transition: none; } }
.datasaurus-copy-figure input[type=range] { appearance: none; height: 3px; background: var(--muted); border: 0; border-radius: 0; cursor: pointer; }
.datasaurus-copy-figure input[type=range]::-webkit-slider-thumb { appearance: none; width: 14px; height: 14px; border-radius: 50%; background: var(--fg); border: 0; box-shadow: none; }
.datasaurus-copy-figure input[type=range]::-moz-range-thumb { width: 14px; height: 14px; border-radius: 50%; background: var(--fg); border: 0; box-shadow: none; }

/* Den historiska modellen trycks med samma svärta på föreläsningens papper. */
.reveal .geocentric-copy-slide .section-label { font-size: 28px; font-weight: 500; font-variant-caps: normal; letter-spacing: .1em; margin-bottom: 24px; }
.geocentric-copy-slide .portrait-row { margin-top: 56px; align-items: start; }
.reveal .geocentric-portrait { grid-column: 1; grid-row: 1 / span 2; width: 430px; height: 420px; margin: 0; position: relative; }
.geocentric-copy-slide .portrait-frame { width: 100%; height: 100%; position: absolute; inset: 0; box-sizing: border-box; border: 4px solid var(--fg); padding: 4px; background: transparent; overflow: visible; }
.reveal .geocentric-copy-slide .portrait-frame img { width: 100%; height: 100%; max-height: none; object-fit: contain; box-sizing: border-box; margin: 0; border: 1px solid var(--fg); filter: url(#geocentric-print-ink); }
.reveal .geocentric-portrait figcaption { position: absolute; top: 100%; left: 9px; right: 9px; font: italic 400 23px/1.25 var(--font-serif); color: var(--fg); margin: 12px 0 0; text-align: left; }

/* Residualjämförelsen får en gemensam ram; två paneler behöver mer bredd. */
.reveal .hetero-copy-figure { width: 1380px; margin: 22px auto 0; }
.hetero-copy-inner { height: 673px; border: 1px solid var(--fg); display: flex; align-items: center; box-sizing: content-box; }
.hetero-copy-figure .beta-two-cols { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); width: 100%; gap: 32px; padding: 24px; box-sizing: border-box; margin: 0; }
.hetero-copy-figure .beta-two-cols > div { min-width: 0; }
.hetero-copy-figure svg { display: block; width: 100%; height: auto; overflow: visible; }
.hetero-copy-figure .beta-dot { fill: var(--color-residual); stroke: var(--color-residual); opacity: 1; }
.reveal .hetero-copy-figure h3 { margin: 16px 0 10px; text-align: center; }
.reveal .hetero-copy-figure .beta-caption { margin: 0; text-align: center; }
.reveal .hetero-copy-figure figcaption { font: italic 400 23px/1.25 var(--font-serif); color: var(--fg); margin: 12px 9px 0; text-align: left; }
.reveal .hetero-beta .beta-message { width: 1380px; margin: 18px auto 0; padding: 0; border: 0; font-size: 30px; }

/* Residualernas spridning och deras bidrag före/efter variansviktning. */
.reveal .weighting-copy-figure { width: 1380px; margin: 22px auto 0; }
.weighting-copy-inner { border: 1px solid var(--fg); padding: 30px 38px; }
.reveal .weighting-copy-inner p { font: 400 32px/1.3 var(--font-serif); margin: 0; }
.reveal .weighting-copy-inner .weighting-intro { margin-bottom: 24px; }
.reveal .weighting-illustration { display: block; width: 100%; height: auto; margin: 0; }
.weighting-illustration text { font: 400 28px var(--font-serif); fill: var(--fg); }
.weighting-illustration .weighting-panel-title, .weighting-illustration .weighting-total { font-weight: 700; }
.weighting-illustration .weighting-small { font-size: 24px; }
.weighting-notation { opacity: .82; }
.weighting-illustration .weighting-math { font-size: 26px; }
.weighting-illustration .weighting-definitions { font-size: 21px; }
.weighting-axis, .weighting-divider { fill: none; stroke: var(--fg); stroke-width: 1.5; }
.weighting-note-leader { fill: none; stroke: #9b5b57; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; }
.weighting-illustration .weighting-note-text text { fill: #9b5b57; font: 450 30px 'Copy Pencil', cursive; }
.weighting-zero { fill: none; stroke: var(--fg); stroke-width: 2; }
.weighting-band { fill: var(--fg); opacity: .09; }
.weighting-context { fill: var(--fg); opacity: .45; }
.weighting-residual { fill: none; stroke: var(--color-residual); stroke-width: 4; }
.weighting-observation { fill: var(--fg); }
.weighting-contribution { fill: url(#weighting-contribution-hatch); stroke: var(--fg); stroke-width: 1; }
.weighting-hatch-ink { fill: none; stroke: var(--fg); stroke-width: 1.4; }
.weighting-high {
  x: 1060px; y: 190px; width: 160px; height: 160px;
  transition: x 1100ms cubic-bezier(.22,.61,.36,1), y 1100ms cubic-bezier(.22,.61,.36,1), width 1100ms cubic-bezier(.22,.61,.36,1), height 1100ms cubic-bezier(.22,.61,.36,1);
}
.wls-weighting-copy:has(.weighting-step.visible) .weighting-high { x: 1132px; y: 334px; width: 16px; height: 16px; }
.wls-weighting-copy:has(.weighting-step.visible) .weighting-before { visibility: hidden; }
/* Samma röda penna som broschyrens r-inringning; ritningen börjar med formeln. */
.weighting-pen-arrow path { fill: none; stroke: #9b5b57; stroke-width: 2; stroke-linecap: round; stroke-linejoin: round; stroke-dasharray: 1; stroke-dashoffset: 1; opacity: 0; }
.weighting-step.visible .weighting-pen-shaft { animation: weighting-pen-draw 720ms cubic-bezier(.4,0,.2,1) both; }
.weighting-step.visible .weighting-pen-branch { animation: weighting-pen-draw 540ms 180ms cubic-bezier(.4,0,.2,1) both; }
.weighting-step.visible .weighting-pen-head { animation: weighting-pen-draw 180ms 680ms ease-out both; }
@keyframes weighting-pen-draw {
  0% { opacity: 0; stroke-dashoffset: 1; }
  1% { opacity: 1; }
  100% { opacity: 1; stroke-dashoffset: 0; }
}
@media (prefers-reduced-motion: reduce) {
  .weighting-high { transition: none; }
  .weighting-step.visible .weighting-pen-arrow path { animation: none; opacity: 1; stroke-dashoffset: 0; }
}
@media print {
  .wls-weighting-copy .weighting-high { x: 1132px; y: 334px; width: 16px; height: 16px; transition: none; }
  .wls-weighting-copy .weighting-before { visibility: hidden; }
  .reveal .wls-weighting-copy .fragment { opacity: 1; visibility: visible; }
  .wls-weighting-copy .weighting-step .weighting-pen-arrow path { animation: none; opacity: 1; stroke-dashoffset: 0; }
}
.reveal .weighting-copy-inner .weighting-conclusion { margin: 26px 0 0; font-weight: 700; }
.reveal .weighting-copy-figure figcaption { font: italic 400 23px/1.25 var(--font-serif); color: var(--fg); margin: 12px 9px 0; }

/* Tre tidningsspalter: större fördjupningstext och källbundet modellval. */
.reveal .beta-detail .beta-methods { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 56px; margin: 48px 0 0; }
.reveal .beta-detail .beta-methods > div { display: flex; flex-direction: column; min-width: 0; padding-top: 24px; }
.reveal .beta-detail .beta-methods h3 { margin: 0 0 20px; font-size: 32px; }
.reveal .beta-detail .beta-methods p { font-size: 32px; line-height: 1.3; margin: 0 0 24px; }
.reveal .beta-detail .beta-methods .beta-caption { font-size: 28px; line-height: 1.3; }
.reveal .beta-detail .beta-methods .beta-formula { font: 400 28px/1.3 var(--font-serif); }
.reveal .beta-detail .beta-methods .clsi-recommendation { margin: auto 0 0; min-height: 260px; box-sizing: border-box; padding-top: 22px; border-top: 1px solid var(--muted); font-size: 27px; line-height: 1.3; }
.reveal .beta-detail .clsi-recommendation strong { display: block; margin-bottom: 10px; font-weight: 700; }

/* Sammanfattning: samma textbredd, startavstånd och brödtext som regressionens roll. */
.reveal .model-choice-summary .takeaway-list,
.reveal .workflow-beta .workflow-list { width: 1380px; max-width: 1380px; margin: 48px 0 0; }
.reveal .model-choice-summary .takeaway-list li,
.reveal .workflow-beta .workflow-list li { font-size: 32px; line-height: 1.35; padding: 20px 0; }
.reveal .model-choice-summary .workflow-cta.pull-quote { max-width: 1380px; margin: 30px 0 0; padding-top: 24px; font-size: 44px; line-height: 1.3; font-weight: 400; font-style: italic; }

/* Numrerad lista: samma mått, med en gemensam indragning för text och slutnot. */
.reveal .workflow-beta .workflow-list li { padding-left: 70px; }
.reveal .workflow-beta .beta-caption { max-width: 1310px; margin: 24px 0 0 70px; font-size: 23px; line-height: 1.3; }

/* Referenser: två tidningsspalter med etablerat spaltavstånd och startavstånd. */
.reveal #kallor .takeaway-list, .reveal #references .takeaway-list { display: block; width: 100%; margin: 48px 0 0; columns: 2; column-gap: 56px; }
.reveal #kallor .takeaway-list li, .reveal #references .takeaway-list li { break-inside: avoid; font-size: 28px; line-height: 1.3; padding: 12px 0; }

/* Avslutning: etablerad textbredd och framhävd text, med en kopierad biblioteksstämpel. */
.reveal .closing-copy-slide .closing-quote { min-height: 171.6px; max-width: 1380px !important; margin: 48px 0 22px !important; font-size: 44px; line-height: 1.3; box-sizing: border-box; }
.reveal .closing-copy-slide .closing-attribution { font-size: 28px; line-height: 1.3; margin: 22px 0 60px; }
.reveal .closing-copy-slide .title-author { font-size: 34px; color: var(--fg); }
.reveal .closing-copy-slide .closing-contact { font-size: 28px; line-height: 1.3; margin-top: 24px; }
.library-copy-stamp { position: absolute; right: 150px; bottom: 150px; width: 390px; height: 220px; box-sizing: border-box; border: 8px double transparent; border-radius: 0; color: var(--fg); opacity: 1; filter: url(#library-stamp-ink); transform: rotate(-12deg); display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 8px; text-align: center; pointer-events: none; mask-image: linear-gradient(105deg, #000 0%, #000 25%, #000b 42%, #0005 62%, #0002 82%, #0003 100%); }
.library-copy-stamp-ghost { right: 152px; bottom: 151px; transform: rotate(-12.5deg); opacity: .09; }
/* Tre lokala bläckluckor i ramen, utan att bryta stämpeltexten. */
.library-copy-stamp::before { content: ''; position: absolute; inset: -8px; border: 8px double var(--fg); border-radius: 0; mask-image: radial-gradient(ellipse 18px 29px at 1% 46%, #0007 45%, #000b 70%, #000 100%), radial-gradient(ellipse 11px 14px at 3% 38%, #0004 35%, #0009 65%, #000 100%), radial-gradient(ellipse 9px 11px at .5% 51%, #0005 40%, #000 100%), radial-gradient(ellipse 17px 11px at 59% 1%, transparent 60%, #000 100%), radial-gradient(ellipse 14px 13px at 25% 99%, #0008 60%, #000 100%); mask-composite: intersect; }
.library-copy-stamp span { font: 400 20px/1 var(--font-serif); letter-spacing: .1em; }
.library-copy-stamp .stamp-loan { font-weight: 700; letter-spacing: .08em; }
.library-copy-stamp span:first-of-type { mask-image: radial-gradient(ellipse 11px 9px at 76% 50%, transparent 55%, #000 100%); }
.library-copy-stamp strong { font: 700 32px/1 var(--font-serif); letter-spacing: .04em; border-top: 1px solid var(--fg); border-bottom: 1px solid var(--fg); padding: 6px 12px; }

/* V2-navigation: liten, skarp ikonrad utan kopietextur eller synlig text. */
.lv-bar { bottom: 8px; gap: 2px; padding: 2px; border: 1px solid var(--muted); border-radius: 3px; background: #f7f6f3; box-shadow: none; filter: none; backdrop-filter: none; -webkit-backdrop-filter: none; }
html[data-theme] .lv-bar .lv-btn { width: 24px; height: 24px; padding: 0; gap: 0; border-radius: 1px; color: var(--fg); background: transparent; }
.lv-bar .lv-btn svg { width: 14px; height: 14px; }
.lv-bar .lv-nav { gap: 2px; }
.lv-bar .lv-sep { display: none; }
.lv-bar .lv-back span, .lv-bar .lv-count { position: absolute; width: 1px; height: 1px; min-width: 0; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.lv-bar .lv-btn:focus-visible { outline: 1px solid var(--fg); outline-offset: 1px; }

/* Outliers: samma ram och graf; varje modell har eget linjeprov och fast värdespår. */
.outliers-wrapper { height: 673px; box-sizing: border-box; }
/* Reglagen ryms närmare grafen; samma reserverade höjd håller legenden stilla. */
.outliers-controls { display: flex; align-items: center; justify-content: center; min-height: 44px; gap: 14px; margin: -24px 0 30px; }
.outliers-control-label { font: 400 23px var(--font-serif); }
.reveal .outlier-toggle { box-sizing: border-box; display: grid; place-items: center; width: 38px; height: 38px; padding: 0; border-radius: 50%; font-size: 21px; }
.reveal .outlier-toggle:focus-visible { outline: 2px solid var(--fg); outline-offset: 3px; }
.outliers-models { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); width: 100%; gap: 12px; text-align: center; font: 400 23px/1.2 var(--font-serif); }
.outliers-model-name { display: flex; align-items: center; justify-content: center; gap: 10px; white-space: nowrap; }
.outliers-model-name svg { display: block; width: 80px; height: 16px; flex-shrink: 0; border: 0; background: transparent; }
.outliers-slope { display: block; margin-top: 5px; font-variant-numeric: tabular-nums; }
.outliers-added-point, .outliers-point-label { fill: var(--color-residual); stroke: none; transition: opacity 180ms ease; }
.outliers-point-label { font: 400 18px var(--font-serif); }
@media (prefers-reduced-motion: reduce) {
  .outliers-added-point, .outliers-point-label { transition: none; }
}
/* Regression dilution: samma ram, graf och linjeprov som övriga modellfigurer. */
#dilution-demo-container .cloud-wrapper { height: 673px; box-sizing: border-box; }
#dilution-demo-container .slider-row { margin: 0 0 6px; }
#dilution-demo-container .legend { display: flex; align-items: center; justify-content: center; gap: 20px; margin: 0 0 6px; }
#dilution-demo-container .legend-item { display: flex; align-items: center; gap: 8px; }
#dilution-demo-container .legend-swatch { display: block; width: 100px; height: 20px !important; background: none !important; border: 0 !important; flex-shrink: 0; }
#dilution-demo-container .legend-swatch svg { display: block; width: 100px; height: 20px; border: 0; background: transparent; }
#dilution-demo-container .stats-display { margin: 0; padding: 0 12px; border: 0; background: transparent; font-size: 23px; line-height: 1.25; }

/* Residualer har en egen gemensam signalröd svärta, oberoende av modell. */
:root { --color-residual: #c83d32; }

/* Anscombe och Datasaurus: ett gemensamt klick utan långsam intoning. */
:is(.anscombe-copy-figure, .datasaurus-copy-figure) .datasaurus-reg-line,
:is(.anscombe-copy-figure, .datasaurus-copy-figure) .fragment { transition: none; }

/* Datasaurus: enbart reglaget syns; namn och positionsvärde finns för skärmläsare. */
.datasaurus-slider label, .datasaurus-slider .slider-value { position: absolute; width: 1px; height: 1px; min-width: 0; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }

/* Helskärm: största möjliga hela slide, med bibehållna proportioner. */
html:fullscreen .reveal .slides {
  inset: 50% auto auto 50% !important;
  zoom: 1 !important;
  transform: translate(-50%, -50%) scale(var(--copy-fullscreen-scale, 1)) !important;
}

/* Urblekt trycksvärta runt den kompletta sliden i helskärm. */
html:fullscreen,
html:fullscreen body,
html:fullscreen .reveal-viewport,
html:fullscreen .reveal {
  background: #3a3a3a;
}

/* Plate X: tätheten registreras till originalets bildkoordinater. */
.galton-plate-image { position: relative; }
.galton-density { position: absolute; inset: 1px; width: calc(100% - 2px); height: calc(100% - 2px); pointer-events: none; mix-blend-mode: multiply; visibility: hidden; }
.show-density .galton-density { visibility: visible; }
.galton-density-controls { display: flex; align-items: center; gap: 22px; margin: 14px 9px 0; }
.galton-density-toggle, .copy-edge-trial-controls button { font: 400 22px/1.2 var(--font-serif); color: var(--fg); border: 1px solid var(--fg); padding: 7px 14px; background: transparent; cursor: pointer; border-radius: 0; }
.galton-density-toggle:focus-visible { background: #3a3a3a12; }
.galton-density-toggle[aria-pressed="true"] { background: var(--fg); color: #f7f6f3; }
.galton-density-legend { display: flex; align-items: center; gap: 10px; font: italic 400 21px/1.2 var(--font-serif); }
.galton-density-legend[hidden], .copy-edge-trial-controls[hidden] { display: none; }
.galton-density-legend i { display: inline-block; width: 110px; height: 12px; opacity: 1; }
[data-copy-edge-trial="soft"] .lecture-paper { filter: url(#copy-edge-soft); }
[data-copy-edge-trial="warp"] .lecture-paper { filter: var(--copy-edge-filter, url(#copy-edge-warp)); }
/* Håll pappersböjen utanför den animerade figurens filteryta. Rubriklagrets
   origo är fortfarande sidans (0,0); figuren ligger helt utanför kantremsan. */
.reveal .outliers-slide .lecture-paper { filter: none; }
.outliers-slide .lecture-paper::before { display: none; }
.outliers-copy-header { display: flow-root; box-sizing: border-box; width: 1920px; margin: -48px -96px 0; padding: 48px 96px 0; filter: var(--copy-edge-filter, blur(.45px)); }
.reveal .outliers-copy-header h2 { margin-bottom: 0; }
.reveal .outliers-figure { margin-top: 30px; filter: blur(.45px); }

/* Keep the new figure animations out of the static page-edge filter. */
.reveal .illusion-slide .lecture-paper { filter: none; }
.illusion-slide .lecture-paper::before { display: none; }
.illusion-copy-header { display: flow-root; box-sizing: border-box; width: 1920px; margin: -48px -96px 0; padding: 48px 96px 0; filter: var(--copy-edge-filter, blur(.45px)); }
.illusion-copy-header::before { content: ''; display: block; height: 4px; background: var(--fg); border-bottom: 1px solid var(--fg); padding-bottom: 5px; background-clip: content-box; margin-bottom: 20px; }
.reveal .illusion-copy-header h2 { margin-bottom: 0; }
.reveal .illusion-figure { margin-top: 30px; filter: blur(.45px); }
#linear-examples-container { height: 673px; }
.examples-plots { position: relative; height: 560px; }
.example-panel { position: absolute; inset: 0; }
.example-panel[hidden] { display: none !important; }
.linear-examples-figure .example-panel .cloud-wrapper { min-height: 0; }
.examples-status { box-sizing: border-box; height: 113px; padding: 6px 80px 10px; display: grid; grid-template-rows: 29px 28px 28px; justify-items: center; align-content: center; text-align: center; }
.examples-readout, .examples-detail { font: 400 23px/1.2 var(--font-serif); font-variant-numeric: tabular-nums; }
.examples-detail { display: flex; justify-content: center; align-items: center; height: 28px; }
.examples-detail > [hidden] { display: none !important; }
.illusion-group-key { display: inline-flex; }
.examples-population-key { display: inline-flex; gap: 24px; }
.examples-population-key > span { display: inline-flex; align-items: center; gap: 9px; }
.examples-population-key i { width: 10px; height: 10px; border-radius: 50%; }
.examples-line-key { display: inline-flex; align-items: center; gap: 10px; }
.examples-line-key i { width: 42px; border-top: 3px solid var(--color-deming); }
.simpson-regression-pooled { stroke-width: 4px; }
.berkeley-total-point { fill: none; stroke: var(--fg); stroke-width: 2; }
.berkeley-total-value { fill: var(--fg); font-size: 25px; }
.berkeley-point { fill: currentColor; stroke: currentColor; stroke-width: 2; }
.berkeley-total-line, .berkeley-group-line { fill: none; stroke: currentColor; stroke-width: 2; stroke-dasharray: 7 7; stroke-linecap: round; }
.berkeley-total-line { stroke: var(--fg); }
.reveal .simpson-handnote { position: absolute; left: 1470px; top: 430px; width: 330px; margin: 0; color: #345c86; font: 550 42px/1.07 'Copy Pencil', cursive; text-align: left; transform: rotate(4deg); transform-origin: left top; filter: blur(.45px); pointer-events: none; opacity: 0; visibility: hidden; transition: opacity 250ms ease, visibility 0s 250ms; }
.simpson-handnote svg { position: absolute; }
.simpson-handnote span { display: block; filter: url(#simpson-note-grain); }
.simpson-handnote.is-visible { opacity: 1; visibility: visible; transition-delay: 0s; }
.simpson-handnote.is-immediate { transition: none; }
@media (prefers-reduced-motion: reduce) {
  .reveal .simpson-handnote { transition: none; }
}
.copy-edge-trial-controls { position: fixed; top: 8px; right: 8px; display: flex; gap: 4px; padding: 4px; background: #f7f6f3; z-index: 100; }
.copy-edge-trial-controls button { font-size: 15px; padding: 5px 9px; }
.copy-edge-trial-controls button[aria-pressed="true"] { background: #3a3a3a; color: #f7f6f3; }

.agreement-fit-stat[hidden] { display: none; }


.galton-density-note { font-size: 18px; margin-left: 12px; }

/* Blyerts i originalet: tunn handstil och varierat grått, under sidans kopiefilter. */
@font-face { font-family: 'Copy Pencil'; src: url('./assets/Caveat-Variable.woff2') format('woff2'); font-weight: 400 700; font-style: normal; font-display: swap; }
.reveal .pencil-note { position: absolute; inset: 0; margin: 0; pointer-events: none; color: #68665f; filter: url(#pencil-copy-grain); }
.pencil-arrow { position: absolute; inset: 0; width: 1920px; height: 1080px; }
.reveal .pencil-note-text { position: absolute; left: 154px; top: 690px; width: 440px; font: 450 42px/1.06 'Copy Pencil', cursive; text-align: left; transform: rotate(-5deg); transform-origin: left top; }
.pencil-note-text span, .pencil-note-text small { display: block; }
.reveal .pencil-note-text small { font: 400 30px/1.15 'Copy Pencil', cursive; margin-top: 12px; }
.pencil-note-reference { position: relative; width: max-content; }
.pencil-note-reference::after { content: ''; position: absolute; left: -2px; right: -7px; bottom: -3px; height: 1px; background: #68665f; opacity: .65; transform: rotate(.8deg); }

/* En senare notering: ny vinkel, lättare hand och en annan grå blyertston. */
.reveal .pencil-note-text.pencil-note-later { left: 270px; top: 862px; width: 370px; font-size: 38px; font-weight: 400; line-height: 1.04; color: #79756e; transform: rotate(3deg); }

/* Blå kulspetspenna från ett annat anteckningstillfälle, kopierad med sidan. */
.reveal .ink-note { position: absolute; inset: 0; margin: 0; pointer-events: none; color: #345c86; filter: url(#pencil-copy-grain); }
.ink-arrow { position: absolute; inset: 0; width: 1920px; height: 1080px; }
.reveal .ink-note-text { position: relative; margin-top: 0; width: 420px; color: #345c86; filter: url(#pencil-copy-grain); font: 550 42px/1.07 'Copy Pencil', cursive; text-align: left; transform: rotate(4deg); transform-origin: left top; }
.ink-note-text span { display: block; }

/* Keyboard focus is visible; resting control appearance stays unchanged. */
.reveal .viz-container input[type=range]:focus-visible,
.reveal .viz-container button:focus-visible { outline: 2px solid #3a3a3a; outline-offset: 5px; }