/* Solving Polynomials with Polygons — design system.
   Type: Newsreader (display + prose), STIX Two Text (math), Spline Sans Mono (data).
   Face colors are the validated categorical palette; identity is never
   color-alone (a triangle has three sides). */

:root {
  --paper: #FBFAF7;
  --plate: #FFFFFF;
  --plate-2: #F4F3ED;
  --ink: #1C2026;
  --ink-2: #575C64;
  --muted: #666A71;
  --hairline: #E5E3DC;
  --accent: #2a78d6;
  --link: #1c5cab;
  --good: #006300;
  --warn-ink: #8a4a12;
  --warn-bg: #fdf0e3;
  --f3: #2a78d6;  /* triangles */
  --f4: #eb6834;  /* quadrilaterals */
  --f5: #1baf7a;  /* pentagons */
  --f6: #eda100;  /* hexagons */
  --f7: #e87ba4;  /* heptagons */
  --serif: "Newsreader", "Iowan Old Style", Georgia, serif;
  --math: "STIX Two Text", "Times New Roman", serif;
  --mono: "Spline Sans Mono", ui-monospace, "SF Mono", Menlo, monospace;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --paper: #14171C;
    --plate: #1B1F26;
    --plate-2: #20242C;
    --ink: #E9E7E1;
    --ink-2: #B4B8BF;
    --muted: #878B92;
    --hairline: #2A2F37;
    --accent: #3987e5;
    --link: #6da7ec;
    --good: #2fbf2f;
    --warn-ink: #f0b37c;
    --warn-bg: #2d2318;
    --f3: #3987e5;
    --f4: #d95926;
    --f5: #199e70;
    --f6: #c98500;
    --f7: #d55181;
  }
}
:root[data-theme="dark"] {
  --paper: #14171C;
  --plate: #1B1F26;
  --plate-2: #20242C;
  --ink: #E9E7E1;
  --ink-2: #B4B8BF;
  --muted: #878B92;
  --hairline: #2A2F37;
  --accent: #3987e5;
  --link: #6da7ec;
  --good: #2fbf2f;
  --warn-ink: #f0b37c;
  --warn-bg: #2d2318;
  --f3: #3987e5;
  --f4: #d95926;
  --f5: #199e70;
  --f6: #c98500;
  --f7: #d55181;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { animation: none !important; transition: none !important; }
}

body {
  margin: 0;
  background: var(--paper);
  color: var(--ink);
  font-family: var(--serif);
  font-size: 1.0625rem;
  line-height: 1.68;
  font-optical-sizing: auto;
  -webkit-font-smoothing: antialiased;
}

a { color: var(--link); text-decoration-thickness: 1px; text-underline-offset: 2px; }
a:hover { text-decoration-thickness: 2px; }
:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; border-radius: 2px; }

.prose { max-width: 66ch; margin: 0 auto; padding: 0 1.25rem; }
.prose p { margin: 1.1em 0; }
.prose strong { font-weight: 600; }

h1, h2, h3 { font-family: var(--serif); text-wrap: balance; line-height: 1.15; }
h2 { font-size: 1.85rem; font-weight: 600; margin: 0 0 0.6em; }
h3 { font-size: 1.2rem; font-weight: 600; margin: 2em 0 0.5em; }

.eyebrow {
  font-family: var(--mono);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 1rem;
}

section { padding: 4.5rem 0 1rem; }

.math { font-family: var(--math); }
.math i { font-style: italic; }
.display-math {
  font-family: var(--math);
  font-size: 1.25rem;
  text-align: center;
  margin: 1.6rem 0;
  overflow-x: auto;
  padding: 0.25rem 0;
  white-space: nowrap;
}

/* ---------- hero ---------- */
header.hero {
  position: relative;
  padding: 5.5rem 0 3rem;
  text-align: center;
}
.theme-toggle {
  position: absolute;
  top: 1rem;
  right: 1rem;
  font-family: var(--mono);
  font-size: 0.72rem;
  letter-spacing: 0.08em;
  background: var(--plate);
  color: var(--ink-2);
  border: 1px solid var(--hairline);
  border-radius: 999px;
  padding: 0.5em 1em;
  cursor: pointer;
}
.theme-toggle:hover { border-color: var(--accent); }
.hero h1 {
  font-size: clamp(2.5rem, 7vw, 4.3rem);
  font-weight: 500;
  margin: 0.4em auto 0.3em;
  max-width: 14ch;
}
.hero .lede {
  font-size: 1.2rem;
  color: var(--ink-2);
  max-width: 52ch;
  margin: 0 auto 1.5rem;
  text-wrap: balance;
}
.hero-band {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
  flex-wrap: wrap;
  margin: 2.2rem auto 1rem;
}
.hero-band .subdigon { width: 88px; height: 88px; }
.hero-eq { margin-top: 1.4rem; font-size: 1.35rem; }
.hero-cta {
  display: inline-block;
  margin-top: 1.6rem;
  font-family: var(--mono);
  font-size: 0.85rem;
  border: 1px solid var(--hairline);
  border-radius: 999px;
  padding: 0.55em 1.2em;
  text-decoration: none;
  color: var(--ink);
  background: var(--plate);
}
.hero-cta:hover { border-color: var(--accent); }

/* ---------- plates (interactive figures) ---------- */
.plate {
  max-width: 960px;
  margin: 2.25rem auto;
  padding: 1.5rem clamp(1rem, 3vw, 2rem) 1.75rem;
  background: var(--plate);
  border: 1px solid var(--hairline);
  border-radius: 14px;
}
.plate-title {
  font-family: var(--mono);
  font-size: 0.72rem;
  font-weight: 500;
  letter-spacing: 0.16em;
  text-transform: uppercase;
  color: var(--muted);
  margin: 0 0 1.2rem;
}

.skip-link {
  position: absolute;
  left: 1rem;
  top: -4rem;
  z-index: 10;
  font-family: var(--mono);
  font-size: 0.85rem;
  background: var(--ink);
  color: var(--paper);
  padding: 0.6em 1em;
  border-radius: 8px;
  text-decoration: none;
}
.skip-link:focus { top: 1rem; }

nav.contents {
  max-width: 66ch;
  margin: 0 auto;
  padding: 0 1.25rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem 1.4rem;
  font-family: var(--mono);
  font-size: 0.78rem;
}
nav.contents a { color: var(--ink-2); text-decoration: none; border-bottom: 1px solid var(--hairline); padding-bottom: 0.1em; }
nav.contents a:hover { color: var(--link); border-color: var(--link); }
.plate-note { font-size: 0.92rem; color: var(--ink-2); margin-top: 1rem; }

/* ---------- subdigon svg ---------- */
.subdigon { display: block; }
.subdigon .face { stroke: none; }
.subdigon .face-3 { fill: color-mix(in srgb, var(--f3) 22%, transparent); }
.subdigon .face-4 { fill: color-mix(in srgb, var(--f4) 22%, transparent); }
.subdigon .face-5 { fill: color-mix(in srgb, var(--f5) 24%, transparent); }
.subdigon .face-6 { fill: color-mix(in srgb, var(--f6) 24%, transparent); }
.subdigon .face-7 { fill: color-mix(in srgb, var(--f7) 24%, transparent); }
.subdigon .face-8 { fill: color-mix(in srgb, var(--muted) 24%, transparent); }
.subdigon .face-none { fill: transparent; }
.subdigon .outline { fill: none; stroke: var(--ink); stroke-width: 1.7; stroke-linejoin: round; }
.subdigon .diagonal { stroke: var(--ink); stroke-width: 1.1; opacity: 0.85; }
.subdigon .root-edge { stroke: var(--accent); stroke-width: 2.4; stroke-linecap: round; }
.subdigon .vertex { fill: var(--ink); }

.face-key {
  display: flex;
  flex-wrap: wrap;
  gap: 0.4rem 1.1rem;
  font-family: var(--mono);
  font-size: 0.78rem;
  color: var(--ink-2);
  margin-bottom: 1rem;
}
.face-key .chip {
  display: inline-block;
  width: 0.7em; height: 0.7em;
  border-radius: 2px;
  margin-right: 0.45em;
  vertical-align: baseline;
}

/* ---------- controls ---------- */
.controls { display: flex; flex-wrap: wrap; gap: 1rem 1.75rem; align-items: end; margin-bottom: 1.25rem; }
.control label {
  display: block;
  font-family: var(--mono);
  font-size: 0.72rem;
  letter-spacing: 0.1em;
  text-transform: uppercase;
  color: var(--muted);
  margin-bottom: 0.35rem;
}
.stepper { display: inline-flex; align-items: center; border: 1px solid var(--hairline); border-radius: 8px; background: var(--paper); }
.stepper button {
  font-family: var(--mono); font-size: 1rem;
  background: none; border: none; color: var(--ink);
  width: 2.1rem; height: 2.1rem; cursor: pointer; border-radius: 8px;
}
.stepper button:hover { background: var(--plate-2); }
.stepper output {
  font-family: var(--mono); font-size: 1rem; font-weight: 600;
  min-width: 2ch; text-align: center; font-variant-numeric: tabular-nums;
}
input[type="number"] {
  font-family: var(--mono); font-size: 0.95rem;
  background: var(--paper); color: var(--ink);
  border: 1px solid var(--hairline); border-radius: 8px;
  padding: 0.45em 0.55em; width: 5.5rem;
  font-variant-numeric: tabular-nums;
}
input[type="range"] { accent-color: var(--accent); width: 100%; }
button.preset, button.action {
  font-family: var(--mono); font-size: 0.8rem;
  background: var(--paper); color: var(--ink);
  border: 1px solid var(--hairline); border-radius: 999px;
  padding: 0.45em 1em; cursor: pointer;
}
button.preset:hover, button.action:hover { border-color: var(--accent); }
button.preset[aria-pressed="true"] { background: var(--ink); color: var(--paper); border-color: var(--ink); }

/* ---------- gallery ---------- */
.count-line { font-size: 1.05rem; margin: 0.5rem 0 1rem; }
.count-line .math { font-size: 1.15rem; }
.count-big { font-family: var(--mono); font-weight: 600; font-size: 1.3rem; color: var(--link); }
.gallery {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(104px, 1fr));
  gap: 0.6rem;
}
.gallery .cell {
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  padding: 0.4rem;
  display: flex; justify-content: center;
}
.gallery .subdigon { width: 100%; height: auto; }

/* ---------- series browser ---------- */
.series-line {
  font-family: var(--math);
  font-size: 1.2rem;
  line-height: 2.1;
  overflow-x: auto;
  padding-bottom: 0.5rem;
}
.series-line .term {
  cursor: pointer;
  border-radius: 6px;
  padding: 0.1em 0.25em;
  border: 1px solid transparent;
}
.series-line .term:hover { border-color: var(--hairline); background: var(--plate-2); }
.series-line .term[aria-pressed="true"] { background: var(--ink); color: var(--paper); }
.term-detail { margin-top: 1rem; border-top: 1px solid var(--hairline); padding-top: 1rem; }

/* ---------- paneling operator ---------- */
.slot {
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  padding: 0.4rem 0.55rem 0.2rem;
  cursor: pointer;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  gap: 0.15rem;
}
.slot:hover { border-color: var(--accent); }
.slot-label { font-family: var(--mono); font-size: 0.72rem; color: var(--muted); }
.pan-stage { display: flex; justify-content: center; }
.pan-svg { width: min(520px, 100%); }
.pan-svg svg { width: 100%; height: auto; display: block; }
.pan-svg .null-edge { stroke: var(--ink); stroke-width: 1.7; stroke-linecap: round; }
.pan-svg .face { stroke: var(--ink); stroke-width: 1.1; stroke-linejoin: round; }

/* ---------- playground ---------- */
.poly-inputs { display: flex; flex-wrap: wrap; gap: 0.6rem 0.4rem; align-items: center; font-family: var(--math); font-size: 1.15rem; }
.poly-inputs .co { display: inline-flex; flex-direction: column; align-items: center; gap: 0.2rem; }
.playground-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(255px, 1fr)); gap: 1.5rem; margin-top: 1.5rem; }

.digits {
  font-family: var(--mono);
  font-size: clamp(1.1rem, 2.6vw, 1.5rem);
  font-variant-numeric: tabular-nums;
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: 10px;
  padding: 0.9rem 1rem;
  overflow-x: auto;
  white-space: nowrap;
}
.digits .label { font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--muted); display: block; margin-bottom: 0.3rem; }
.digits .match { color: var(--good); font-weight: 600; text-decoration: underline; text-decoration-thickness: 2px; text-underline-offset: 3px; }
.digit-status { font-family: var(--mono); font-size: 0.82rem; color: var(--ink-2); margin-top: 0.5rem; }

.badge {
  display: inline-block;
  font-family: var(--mono); font-size: 0.75rem;
  border-radius: 999px; padding: 0.3em 0.9em;
  border: 1px solid var(--hairline);
}
.badge.ok { color: var(--good); border-color: color-mix(in srgb, var(--good) 45%, transparent); }
.badge.bad { color: var(--warn-ink); background: var(--warn-bg); border-color: transparent; }

.chart-wrap { position: relative; }
.chart-wrap svg { width: 100%; height: auto; display: block; }
.chart-wrap .axis-label { font-family: var(--mono); font-size: 11.5px; fill: var(--muted); }
.chart-wrap .grid { stroke: var(--hairline); stroke-width: 1; }
.chart-wrap .baseline { stroke: var(--muted); stroke-width: 1; }
.chart-wrap .err-line { stroke: var(--accent); stroke-width: 2; fill: none; stroke-linejoin: round; }
.chart-wrap .err-dot { fill: var(--accent); stroke: var(--plate); stroke-width: 2; }
.chart-wrap .root-dot { fill: var(--f3); stroke: var(--plate); stroke-width: 1.5; }
.chart-wrap .root-target { fill: none; stroke: var(--accent); stroke-width: 2; }
.chart-wrap .est-marker line { stroke: var(--good); stroke-width: 2.2; stroke-linecap: round; }
.chart-wrap .est-trail { fill: none; stroke: var(--good); stroke-width: 1.2; opacity: 0.45; }

/* ---------- finite identity ---------- */
.fid-zero { color: var(--muted); }
.fid-survivor { color: var(--link); font-weight: 600; white-space: nowrap; }

.chart-tip {
  position: absolute;
  pointer-events: none;
  background: var(--ink); color: var(--paper);
  font-family: var(--mono); font-size: 0.72rem;
  border-radius: 6px; padding: 0.35em 0.6em;
  transform: translate(-50%, -130%);
  white-space: nowrap;
  opacity: 0;
}

.subdigon .face.central { stroke: var(--ink); stroke-width: 1; }
.subdigon .face-3.central { fill: color-mix(in srgb, var(--f3) 55%, transparent); }
.subdigon .face-4.central { fill: color-mix(in srgb, var(--f4) 55%, transparent); }
.subdigon .face-5.central { fill: color-mix(in srgb, var(--f5) 58%, transparent); }
.subdigon .face-6.central { fill: color-mix(in srgb, var(--f6) 58%, transparent); }
.central-group h4 { margin: 1.4rem 0 0.4rem; font-size: 1.1rem; font-weight: 600; }
.central-group .formula-check { font-family: var(--mono); font-size: 0.82rem; color: var(--good); }

/* ---------- geode table ---------- */
.geode-table { border-collapse: collapse; font-family: var(--mono); font-size: 0.92rem; margin: 1rem auto 0.5rem; font-variant-numeric: tabular-nums; }
.geode-table th, .geode-table td { border: 1px solid var(--hairline); padding: 0.45em 0.9em; text-align: right; }
.geode-table th { color: var(--muted); font-weight: 500; background: var(--plate-2); }
.geode-table td.edge-seq { color: var(--link); font-weight: 600; }

/* ---------- fractions ---------- */
.display-math big { font-size: 1.6em; vertical-align: -0.1em; padding: 0 0.15em; }

/* ---------- words (Plate V) ---------- */
.word-slots { display: flex; flex-wrap: wrap; gap: 1rem; margin-bottom: 1rem; }
.word-slot {
  background: var(--paper);
  border: 1px solid var(--hairline);
  border-radius: 12px;
  padding: 0.6rem 0.7rem 0.5rem;
  display: flex; flex-direction: column; align-items: center; gap: 0.3rem;
  cursor: pointer;
  font: inherit; color: inherit;
}
.word-slot:hover { border-color: var(--accent); }
.word-slot.slot-0 { border-top: 3px solid var(--f3); }
.word-slot.slot-1 { border-top: 3px solid var(--f4); }
.word-slot.slot-2 { border-top: 3px solid var(--f5); }
.slot-word { font-family: var(--mono); font-size: 0.85rem; letter-spacing: 0.14em; color: var(--ink-2); }
.tree-edge { stroke: var(--ink); stroke-width: 1.4; stroke-dasharray: 2 1.6; opacity: 0.85; }
.tree-node circle { fill: var(--plate); stroke: var(--ink); stroke-width: 1.2; }
.tree-node text { font-family: var(--mono); font-size: 7.5px; font-weight: 600; fill: var(--ink); }
.tree-node.leaf circle { fill: var(--plate-2); }
.tree-node.hl circle { stroke: var(--accent); stroke-width: 2.2; fill: color-mix(in srgb, var(--accent) 28%, var(--plate)); }
.word-line { display: flex; flex-wrap: wrap; gap: 0.4rem; align-items: flex-end; font-family: var(--mono); min-height: 3.6rem; }
.letter { display: inline-flex; flex-direction: column; align-items: center; gap: 0.25rem; min-width: 2rem; }
.letter .glyph {
  border: 1.5px solid var(--hairline); border-radius: 6px;
  padding: 0.25em 0.5em; font-weight: 600; font-size: 1rem; background: var(--paper);
}
.letter.slot-0 .glyph { border-color: var(--f3); }
.letter.slot-1 .glyph { border-color: var(--f4); }
.letter.slot-2 .glyph { border-color: var(--f5); }
.letter .bar { width: 0.6rem; background: var(--good); border-radius: 2px; }
.letter .bar.none { background: transparent; }
.letter.fail .glyph { border-color: var(--warn-ink); color: var(--warn-ink); background: var(--warn-bg); }

/* ---------- convergence region ---------- */
.region-row { display: flex; flex-wrap: wrap; gap: 1.5rem; align-items: center; }
.region-row .chart-wrap { flex: 0 1 340px; }
.region-row .plate-note { flex: 1 1 240px; margin-top: 0; }
.chart-wrap .region-fill { fill: color-mix(in srgb, var(--accent) 16%, transparent); stroke: var(--accent); stroke-width: 1.5; }
.chart-wrap .region-dot { fill: var(--good); stroke: var(--plate); stroke-width: 2; }
.chart-wrap .region-dot.out { fill: var(--f4); }

/* ---------- papers ---------- */
.paper-cards { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 1rem; max-width: 960px; margin: 2rem auto; padding: 0 1.25rem; }
.paper-card {
  border: 1px solid var(--hairline); border-radius: 14px;
  background: var(--plate); padding: 1.25rem 1.4rem;
  display: flex; flex-direction: column; gap: 0.5rem;
}
.paper-card .venue { font-family: var(--mono); font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.paper-card h3 { margin: 0; font-size: 1.05rem; line-height: 1.35; }
.paper-card p { margin: 0; font-size: 0.9rem; color: var(--ink-2); }
.paper-card a { margin-top: auto; font-family: var(--mono); font-size: 0.8rem; }

footer {
  margin-top: 5rem;
  border-top: 1px solid var(--hairline);
  padding: 2.5rem 1.25rem 3.5rem;
  text-align: center;
  font-size: 0.9rem;
  color: var(--ink-2);
}
footer .math { font-size: 1rem; }

.sr-only {
  position: absolute; width: 1px; height: 1px;
  padding: 0; margin: -1px; overflow: hidden;
  clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- hover help ---------- */
#tip {
  position: absolute;
  z-index: 50;
  max-width: 30ch;
  background: var(--ink);
  color: var(--paper);
  font-family: var(--serif);
  font-size: 0.9rem;
  line-height: 1.45;
  padding: 0.55em 0.8em;
  border-radius: 8px;
  box-shadow: 0 6px 20px rgba(0, 0, 0, 0.18);
  pointer-events: none;
}
#tip::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -6px;
  width: 12px; height: 12px;
  background: var(--ink);
  transform: translateX(-50%) rotate(45deg);
}
#tip.below::after { bottom: auto; top: -6px; }
.term-def {
  text-decoration: underline dotted;
  text-decoration-color: var(--link);
  text-underline-offset: 3px;
  cursor: help;
  border-radius: 2px;
}
.term-def:hover { color: var(--link); }

/* ---------- guidance ---------- */
.howto {
  max-width: 66ch;
  margin: 1.6rem auto 0;
  padding: 0.9rem 1.25rem;
  font-size: 0.95rem;
  color: var(--ink-2);
  text-align: center;
  text-wrap: balance;
}
.try {
  font-family: var(--mono);
  font-size: 0.82rem;
  color: var(--ink-2);
  background: var(--plate-2);
  border-left: 3px solid var(--accent);
  border-radius: 0 8px 8px 0;
  padding: 0.55em 0.9em;
  margin: -0.4rem 0 1.2rem;
}
.try b { color: var(--link); font-weight: 600; }

/* ---------- sticky section bar ---------- */
nav.contents {
  position: sticky;
  top: 0;
  z-index: 40;
  max-width: none;
  background: color-mix(in srgb, var(--paper) 92%, transparent);
  backdrop-filter: blur(6px);
  border-bottom: 1px solid var(--hairline);
  padding: 0.55rem 1.25rem;
  margin: 1.5rem 0 0;
}
nav.contents a.active { color: var(--link); border-color: var(--link); }

/* ---------- affordance polish ---------- */
button, .slot, .word-slot, .term, .cell, .preset, .action { transition: border-color 0.15s ease, background-color 0.15s ease, transform 0.15s ease, box-shadow 0.15s ease; }
.series-line .term { border-bottom: 1px dotted var(--muted); border-radius: 6px 6px 0 0; }
.series-line .term:hover { border-color: var(--accent); background: var(--plate-2); }
.gallery .cell:hover { border-color: var(--accent); transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08); }
.slot:hover, .word-slot:hover { transform: translateY(-2px); box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08); }
button.action:hover, button.preset:hover { transform: translateY(-1px); }
.slot::after, .word-slot::after {
  content: "click to swap";
  font-family: var(--mono);
  font-size: 0.62rem;
  letter-spacing: 0.08em;
  color: var(--muted);
}

/* ---------- byline, share, cite ---------- */
.byline { font-family: var(--mono); font-size: 0.8rem; color: var(--ink-2); margin: -0.6rem auto 0; }
.hero-actions { display: flex; justify-content: center; flex-wrap: wrap; gap: 0.6rem; }
.hero-actions .hero-cta { margin-top: 1.6rem; font: inherit; font-family: var(--mono); font-size: 0.85rem; cursor: pointer; }
.bibtex {
  font-family: var(--mono); font-size: 0.8rem; line-height: 1.5;
  background: var(--paper); border: 1px solid var(--hairline); border-radius: 10px;
  padding: 0.9rem 1rem; overflow-x: auto; margin: 0 0 1rem;
}

/* ---------- embed mode: one plate, nothing else ---------- */
body.embed > *:not(main):not(#tip) { display: none; }
body.embed main > * { display: none; }
body.embed main section:has(.embed-target) { display: block; padding: 0; }
body.embed section:has(.embed-target) > *:not(.embed-target) { display: none; }
body.embed .plate.embed-target { margin: 0; max-width: none; border: none; border-radius: 0; }
.embed-foot { font-family: var(--mono); font-size: 0.75rem; margin: 1rem 0 0; text-align: right; }