/* Viscoelastic report: page-only rules. Author: Imad A. Adel.
   Components that exist only on this page, styled so they read as part of the report
   family. The shared layout layer (report.layout.css) is not edited for this page. */

/* SAMPLE badges inside the calculator's control labels keep their own case and spacing */
.ctrl .lb .bd{letter-spacing:.08em;margin-left:4px;vertical-align:1px}

/* a pane heading focused from the section navigation shows where the reader has landed */
.pane-head h1:focus-visible,.hero-band h1:focus-visible{outline:2px solid var(--sky);outline-offset:4px}

/* hero statistic units: #5BC6F0 was drawn for the navy hero band; on the light scheme's
   transparent hero it measures 1.95:1. The unit takes the scheme's accent. */
:root[data-theme="light"] .hstat .v em{color:var(--accent)}

/* dark scheme: the accent maps to #D98C84, and white text on it measures 2.6:1 (the
   "How to use" badge, the selected boundary-rule button). Text on the accent takes the
   scheme's on-accent ink. */
:root:not([data-theme="light"]) .guide-note .gn-badge,
:root:not([data-theme="light"]) .seg button.on{color:var(--on-accent)}

/* dark scheme: positive values on tinted table rows measured 4.3-4.4:1 */
:root:not([data-theme="light"]) .tbl td.pos{color:#6BD4A1}

/* dark scheme: the funnel note ink is the light muted value; map it to the dark muted token */
:root:not([data-theme="light"]) .svgwrap text[fill="#5A6B7D"]{fill:var(--muted)}

/* format parity with the reference report (FORMAT-CONFORMANCE items 4 and 5): the hero
   statistics, the guide note's top margin and the phone panel padding take the reference's
   values; this page's baseline carried older ones */
.hstat .v{font-size:1.16rem;overflow-wrap:anywhere}
.hstat .k{overflow-wrap:anywhere}
.pane .guide-note{margin-top:16px}
@media (max-width:420px){.panel-x .pb{padding:16px 18px}}

/* the unit after a hero statistic wraps as a whole word, never at its last full stop */
.hstat .v em{white-space:nowrap}
/* at 320 px the product name broke inside "Desaturation"; below 360 px it drops two
   pixels and wraps between words only */
@media (max-width:359px){:root .topbar .report-product{font-size:16px;overflow-wrap:normal}}

/* r1 F2: the Screened record key column held a 210 px nowrap width inside a column the rail
   narrows, and the value column collapsed; the key takes a share and wraps */
#ov_record td.k{width:38%;white-space:normal}

/* r1 F7: the schematics scroll sideways on a phone; the cue says so there and nowhere else */
/* its own class: the house cue (.cue) keeps the shared wording for tables */
.svgcue{display:none;font-size:.64rem;color:var(--muted);margin:0 0 6px}
@media (max-width:620px){.svgcue{display:block}}

/* r1 F4: reference list */
.refs{margin:0;padding-left:1.4em;display:flex;flex-direction:column;gap:8px;font-size:.8rem;line-height:1.6;color:var(--ink)}
.refs li{overflow-wrap:anywhere}
.refs li::marker{color:var(--muted);font-size:.72rem}

/* r2.1: the RP-05 scope statement is the page's own statement, not part of the manuscript
   status line, so the source block carries two paragraphs instead of one run of text */
.ms-cite p{margin:0}
.ms-cite p+p{margin-top:.55em}
