/* Deviation: the pool beside a bank of your own and held $STANDARD, as a document that makes its case in words, with one
   drawing of what the same ETH pays you over twelve months (owner, 29 September 2026: no repeated tables, figures in
   sentences, headings that state a claim). One identity per option: the pool copper and solid, your own bank ink and
   dotted, held $STANDARD plum; "≈" still marks every estimate. The document's base is the thesis's (thesis.css). */
.deviation-page .o-pool{color:var(--copper)}.deviation-page .o-own{color:var(--ink)}.deviation-page .o-held{color:var(--plum)}
.deviation-page .sw{display:inline-block;width:22px;height:0;margin:0 8px 3px 0;vertical-align:middle;border-top:3px solid var(--copper)}
.deviation-page .sw-own{border-top:2px dotted var(--ink)}.deviation-page .sw-held{border-top:2px solid var(--plum)}
[data-dv]{font-variant-numeric:tabular-nums lining-nums}

/* The masthead: a plain title, a deck of two sentences, then the bell at full bleed, the window its only crop. */
.dv-mast{padding:var(--space-7) 0 0;max-width:62rem}
.dv-mast .overline{color:var(--muted);margin:0 0 22px}
.dv-mast h1{font:400 clamp(3.25rem,6vw,5.25rem)/.98 var(--display);letter-spacing:-.035em;margin:0}
.dv-deck{font:400 clamp(1.5rem,2.5vw,2.125rem)/1.2 var(--display);letter-spacing:-.016em;color:var(--ink);max-width:30ch;margin:22px 0 0;text-wrap:balance}
.dv-deck em{font-style:normal;color:var(--copper)}
.dv-plate{width:100vw;margin:var(--space-5) 0 0 calc((100% - 100vw) / 2);height:clamp(220px,26vw,400px);overflow:hidden}
.dv-plate svg{display:block;width:100%;height:100%}
/* Line weights are on screen, not in the drawing, so the bell reads the same at every width (owner, 30 September 2026:
   "more visible, it is too faded"). */
.dv-plate svg path{vector-effect:non-scaling-stroke;fill:none}
.dv-plate .bl-h{stroke:var(--engraving-ink);stroke-width:.9px;opacity:.7}
.dv-plate .bl-t{stroke:var(--engraving-copper);stroke-width:1.2px;opacity:1}
.dv-plate .bl-c{stroke:var(--engraving-ink);stroke-width:1px}
.dv-plate .bl-sd{stroke:var(--engraving-copper);stroke-width:1.1px;stroke-dasharray:3 4}

/* The lede: the year's figures in two paragraphs, the way in beside them. */
.dv-lede{display:grid;grid-template-columns:minmax(0,40rem) auto;justify-content:space-between;align-items:end;gap:48px;margin:var(--space-6) 0 0}
.dv-lede p{font:400 1.1875rem/1.72 var(--body);color:var(--ink);margin:0;text-wrap:pretty}
.dv-lede p+p{margin-top:18px}
.dv-n{font-variant-numeric:tabular-nums;color:var(--copper);font-weight:500;white-space:nowrap}
.dv-actions{display:flex;flex-direction:column;align-items:flex-start;gap:14px;padding-bottom:6px;margin:0}

/* A section: its claim on the left, its words on the right, its one drawing across the page. */
.dv-sec{display:grid;grid-template-columns:minmax(0,21rem) minmax(0,40rem);justify-content:space-between;column-gap:56px;padding:var(--space-6) 0 0;border-top:1px solid var(--rule);margin-top:var(--space-7)}
.dv-sec h2{font:400 2.5rem/1.05 var(--display);letter-spacing:-.025em;margin:0;text-wrap:balance}
.dv-notes{min-width:0}
.dv-wide{grid-column:1/-1;margin-top:var(--space-6)}
.dv-note{margin:0;padding:16px 0;border-top:1px solid var(--rule);font:400 .9375rem/1.65 var(--body);color:var(--muted)}
.dv-note:first-child{border-top:0;padding-top:4px}
.dv-note b{display:flex;align-items:center;gap:10px;font:400 1.125rem/1.3 var(--display);letter-spacing:-.005em;margin-bottom:6px}
.dv-body{margin:0;font:400 1.0625rem/1.75 var(--body);color:var(--ink);text-wrap:pretty}
.dv-body+.dv-body{margin-top:16px}

/* A year in five moments: when, in mono, beside what happens. */
.dv-when{display:grid;grid-template-columns:11rem minmax(0,1fr);gap:24px;padding:12px 0;border-top:1px solid var(--rule)}
.dv-when:first-child{border-top:0;padding-top:4px}
.dv-when .t{margin:0;font:400 .6875rem/1.9 var(--mono);letter-spacing:.05em;text-transform:uppercase;color:var(--copper)}
.dv-when .d{margin:0;font:400 1.0625rem/1.7 var(--body);color:var(--ink)}

/* One statement carries the section. */
.dv-sec-pull{grid-template-columns:minmax(0,1fr)}
.dv-sec-pull .dv-pull{font:400 clamp(2.25rem,4.4vw,3.75rem)/1.04 var(--display);letter-spacing:-.03em;max-width:22ch;margin:0 0 var(--space-5)}
.dv-pull em{font-style:normal;color:var(--copper)}
.dv-sec-pull .dv-notes{max-width:40rem}

/* The pool now, in one live sentence. */
.dv-live{margin:0 0 18px;font:400 clamp(1.5rem,2.3vw,1.875rem)/1.3 var(--display);letter-spacing:-.012em;color:var(--ink);text-wrap:pretty}
.dv-live [data-dv]{color:var(--copper);font-variant-numeric:lining-nums tabular-nums}

/* What you get, set beside what it costs. */
.dv-pairs{grid-column:1/-1;margin-top:var(--space-6);border-top:1px solid var(--rule)}
.dv-pair{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:56px;align-items:baseline;padding:16px 0 18px;border-bottom:1px solid var(--rule)}
.dv-pair .get{margin:0;font:400 clamp(1.5rem,2.2vw,1.875rem)/1.15 var(--display);letter-spacing:-.015em;color:var(--copper)}
.dv-pair .cost{margin:0;font:400 .9375rem/1.7 var(--body);color:var(--muted);max-width:30rem}

.dv-actions-row{flex-direction:row;margin:26px 0 0}
.dv-fine{margin:18px 0 0;font:400 .8125rem/1.7 var(--body);color:var(--muted)}

/* The one drawing: the landing's graph, the pool's figure in the pool's own colour here. */
.dv-fig{margin:0}
.dv-fig figcaption{display:grid;grid-template-columns:64px 1fr;gap:12px;margin-top:10px;padding-top:14px;border-top:1px solid var(--rule);font-size:.75rem;line-height:1.7;color:var(--muted)}
.dv-fig-n{font:400 .6875rem/1.9 var(--mono);letter-spacing:.06em;color:var(--muted)}
.deviation-page .paid-figure .pd-estimate{fill:var(--copper)}

/* How the pool pays you: the one dark chapter, carrying the landing's rotation figure as it was approved on ink. */
.dv-ink{background:var(--ink);box-shadow:0 0 0 100vmax var(--ink);clip-path:inset(0 -100vmax);border-top:0;padding:var(--space-7) 0 var(--space-6)}
.dv-ink h2{color:var(--on-ink)}.dv-ink .dv-body{color:var(--on-ink-muted)}
.dv-ink .rotation-figure{margin-top:0}

/* Figures drawn from the reading: the any-amount chart and the estimate's bars. On a phone a drawing carries no words and
   the sentence above it gives its figures (owner, 25 September 2026). */
.dv-chart{display:block;width:100%;height:auto;overflow:visible}
.dv-chart text{font:400 11px/1 var(--mono);letter-spacing:.05em;fill:var(--muted)}.dv-chart .t{fill:var(--ink)}
.dv-chart .f-pool{fill:var(--copper)}.dv-chart .f-own{fill:var(--ink)}.dv-chart .f-held{fill:var(--plum)}.dv-chart .q{opacity:.72}
.dv-chart .big{font:400 40px/1 var(--display);letter-spacing:-.02em}.dv-chart .mid{font:400 26px/1 var(--display);letter-spacing:-.01em}
.dv-chart .g{stroke:var(--rule);stroke-width:.8;fill:none}.dv-chart .ax{stroke:var(--engraving-ink);stroke-width:.9;fill:none}
.dv-chart .hair{stroke:var(--ink);stroke-width:.7;stroke-dasharray:2 4;fill:none;opacity:.6}
.dv-chart .pool-l{stroke:var(--copper);stroke-width:3;fill:none;stroke-linejoin:round}
.dv-chart .own-l{stroke:var(--ink);stroke-width:1.6;stroke-dasharray:1.5 3.5;stroke-linecap:round;fill:none}
.dv-chart .reading{font:400 13px/1 var(--body);letter-spacing:0;fill:var(--muted)}
.dv-lead{display:none}
.dv-bars{border-top:1px solid var(--rule)}
.dv-bar-row{display:grid;grid-template-columns:minmax(220px,360px) 1fr 96px;gap:18px;align-items:center;padding:12px 0;border-bottom:1px solid var(--rule)}
.dv-bar-label{font-size:.875rem;line-height:1.4;color:var(--ink);text-align:right}
.dv-bar{display:block;height:18px}.dv-bar i{display:block;height:100%;background:var(--copper);opacity:.42;transition:width .6s cubic-bezier(.4,0,.2,1)}
.dv-bar-row.is-now .dv-bar i{opacity:.9}.dv-bar-row b{font:400 .8125rem/1 var(--mono);letter-spacing:.04em;font-weight:400}
.dv-bar-row.is-now .dv-bar-label{font-weight:500}
@media(prefers-reduced-motion:reduce){.dv-bar i{transition:none}}

/* How the figures are calculated: a section of the study, in prose, its figures live. */
.dv-calc h3{margin:22px 0 6px;font:400 1.3125rem/1.3 var(--display);letter-spacing:-.01em;color:var(--ink)}
.dv-calc p{margin:0;font:400 1rem/1.75 var(--body);color:var(--ink);text-wrap:pretty}
.dv-calc [data-dv]{color:var(--copper)}

/* While the chain is read, and if it cannot be: the words keep their place, the figures their width. */
main[data-dv-state="reading"] [data-dv]:not([data-dv="provenance"]){color:transparent;background:var(--rule);border-radius:2px;opacity:.5}

@media (max-width:760px){
  .dv-mast{padding-top:var(--space-6)}
  .dv-deck{font-size:1.375rem}
  .dv-lede{grid-template-columns:1fr;gap:28px}
  .dv-lede p{font-size:1.0625rem}
  .dv-sec{grid-template-columns:1fr;row-gap:18px;padding-top:var(--space-6);margin-top:var(--space-7)}
  .dv-sec h2{font-size:2rem}
  .dv-sec-pull .dv-pull{font-size:2.125rem}
  .dv-wide{margin-top:var(--space-5)}
  .dv-when{grid-template-columns:1fr;gap:4px}
  .dv-live{font-size:1.375rem}
  .dv-pair{grid-template-columns:1fr;gap:8px;padding:18px 0 20px}
  .dv-pair .get{font-size:1.375rem}
}
@media (max-width:700px){
  .dv-lead{display:block;min-height:4.2em;margin:0 0 12px;font:400 1.1875rem/1.35 var(--display);color:var(--ink)}
  .dv-bar-row{grid-template-columns:1fr auto;gap:8px 12px}.dv-bar-label{grid-column:1/-1;text-align:left}
}