/* ===========================================================================
   Riposte Laboratories · lightweight variant stylesheet
   Drives three renderings off one token set: mobile / lite / e-ink.
   Generated file; edit tmp/gen.js and re-run rather than editing here.
   =========================================================================== */

/* ---------- self-hosted webfont: JetBrains Mono (OFL 1.1) ----------
   Variable face (weight axis 100-800; the alt variants use 400/700/800) as
   woff2 subsets from Fontsource 5.3.0, served from /fonts, split by
   unicode-range so a page only fetches the subsets its script needs.
   Byte-budget policy: only the mobile variant loads the webfont; lite and
   e-ink drop it from --mono below so no @font-face download is ever
   triggered for them. Non-Latin editions have no JetBrains Mono glyphs and
   stay on the fallback stack. font-display:swap paints on the fallback. */
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:100 800;
  src:url("/fonts/jetbrains-mono-latin.b058178d.woff2") format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD;
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:100 800;
  src:url("/fonts/jetbrains-mono-latin-ext.e36841ed.woff2") format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF;
}
@font-face{
  font-family:"JetBrains Mono";font-style:normal;font-display:swap;font-weight:100 800;
  src:url("/fonts/jetbrains-mono-vietnamese.ddf99e6e.woff2") format("woff2");
  unicode-range:U+0102-0103,U+0110-0111,U+0128-0129,U+0168-0169,U+01A0-01A1,U+01AF-01B0,U+0300-0301,U+0303-0304,U+0308-0309,U+0323,U+0329,U+1EA0-1EF9,U+20AB;
}

:root{
  --ink:#1d1a17; --bone:#f6f1e7; --bone-dim:#eae4d6; --grid:#cdbfa2;
  --pink:#f0477d; --orange:#fe9a0d; --teal:#12b795;
  --pink-tx:#b81e58; --teal-tx:#0c7a63; --orange-tx:#9c5d00; /* accessible accent text on bone */
  --rule:2px solid var(--ink);
  --mono:"JetBrains Mono","IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
  --measure:66ch;
}
/* lite + e-ink honour their minimum-bytes budget: drop JetBrains Mono from
   the stack so the @font-face above is never requested for these variants. */
html.v-lite,html.v-eink{
  --mono:"IBM Plex Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,"Liberation Mono",monospace;
}
*{box-sizing:border-box;margin:0;padding:0}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{font-family:var(--mono);background:var(--bone);color:var(--ink);line-height:1.55;font-size:15px}
img,svg{display:block;max-width:100%}
a{color:inherit}
h1,h2,h3{text-transform:uppercase;letter-spacing:.02em;line-height:1.12}
b,strong{font-weight:700}
::selection{background:var(--pink);color:var(--ink)}

.wrap{width:min(var(--measure),92vw);margin:0 auto}

/* ---------- top bar + version switch ---------- */
.topbar{position:sticky;top:0;z-index:50;background:var(--bone);border-bottom:var(--rule)}
.topbar .bar{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:10px 16px;padding:9px 0}
.brand{display:flex;align-items:stretch;text-decoration:none;font-weight:700;text-transform:uppercase;white-space:nowrap;color:var(--ink)}
.brand .mark{display:flex;align-items:center;padding-inline-end:11px}
.brand .mark img{width:112px}
/* solid outer frame, dashed interior divide (spec-sheet motif) */
.brand .lock{display:flex;flex-direction:column;justify-content:center;gap:3px;padding-inline-start:11px;border-inline-start:1px dashed var(--ink)}
.brand .lab{font-size:11px;letter-spacing:.11em;line-height:1;direction:ltr;unicode-bidi:isolate}
.brand .doc{font-size:9px;letter-spacing:.13em;line-height:1;font-weight:400;color:var(--pink-tx);direction:ltr;unicode-bidi:isolate}
/* segmented control: stays a single atomic row (never wraps mid-control) and the
   current item is marked by an inverse fill only — the label weight never changes,
   so the control keeps the exact same width on every page and does not shift */
.vswitch{display:flex;flex-wrap:nowrap;border:var(--rule);font-size:11px;text-transform:uppercase;letter-spacing:.08em}
.vswitch a{padding:6px 11px;text-decoration:none;border-left:1px dashed var(--ink);white-space:nowrap}
.vswitch a:first-child{border-left:none}
.vswitch a[aria-current]{background:var(--ink);color:var(--bone)}

/* ---------- bands (jester motif) — sit inside the content column, not full-bleed,
   so they share the left/right edge with every heading, box and rule above/below ---------- */
.bandwrap{margin:6px auto}
.band{height:18px;border-top:var(--rule);border-bottom:var(--rule);
  background:repeating-conic-gradient(var(--ink) 0 25%, var(--bone) 0 50%) 50%/16px 16px}
.band.teal{background:repeating-conic-gradient(var(--teal) 0 25%, var(--bone) 0 50%) 50%/16px 16px}
.band.harlequin{height:22px;background:repeating-conic-gradient(from 45deg,var(--pink) 0 25%,var(--teal) 0 50%) 50%/22px 22px}

/* ---------- hero (home) ---------- */
/* No bottom rule: the alt layouts (mobile/lite/e-ink) have no marquee band to
   butt against it (as the full site does), so a bare full-width divider reads
   as a stray line under the CTA; the SEC.01 sechead rule provides the break. */
.hero{padding:44px 20px 40px;text-align:center}
.hero .wordmark{width:min(560px,86vw);margin:0 auto 14px}
/* letter-spacing adds a trailing gap after the last letter; text-indent of the
   same size adds a matching leading gap so the glyph run stays truly centred */
.hero .eyebrow{width:fit-content;margin-inline:auto;font-size:12px;letter-spacing:.34em;text-indent:.34em;text-transform:uppercase;opacity:.85}
@media(max-width:520px){.hero .eyebrow{letter-spacing:.24em;text-indent:.24em;font-size:11px}}
.hero h1{margin-top:20px;font-size:clamp(22px,5.4vw,32px);font-weight:800}
.hero h1 .p{opacity:.5}
.hero .sub{margin:14px auto 0;max-width:54ch;font-size:14px;opacity:.9}
.hero .cta{display:inline-block;margin-top:26px;padding:12px 24px;border:var(--rule);
  text-decoration:none;text-transform:uppercase;font-weight:700;letter-spacing:.12em;font-size:12px}

/* ---------- page-head banner (sub-pages) ---------- */
.pagehead{border-bottom:var(--rule);padding:36px 0}
.pagehead .kicker{font-size:11px;letter-spacing:.26em;text-transform:uppercase;opacity:.8}
.pagehead h1{font-size:clamp(28px,7vw,46px);font-weight:800;margin-top:8px}
.pagehead p{max-width:60ch;margin-top:12px;font-size:14px}

/* ---------- sections ---------- */
.sec{padding:40px 0}
.sechead{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;border-bottom:var(--rule);padding-bottom:12px;margin-bottom:22px}
.sechead h2{font-size:clamp(21px,4.6vw,32px);font-weight:800}
.seclab{display:inline-block;font-size:12px;font-weight:700;letter-spacing:.1em;
  color:var(--bone);background:var(--ink);padding:3px 9px;vertical-align:middle}
.seclab.c1{background:var(--pink);color:var(--ink)} .seclab.c2{background:var(--orange);color:var(--ink)} .seclab.c3{background:var(--teal);color:var(--ink)}
.sectag{font-size:12px;letter-spacing:.04em;opacity:.72;margin:-14px 0 18px}
.sectag::before{content:"// ";opacity:.7}

p{max-width:var(--measure)} p + p{margin-top:.85em}
.lead{font-size:clamp(15px,2.4vw,18px);font-weight:700;max-width:56ch;margin-bottom:.9em}
.dim{opacity:.62} .hi{color:var(--pink-tx);font-weight:700}
.defn{opacity:.72;font-weight:400}
.stack>*+*{margin-top:.85em}

/* ---------- spec box ---------- */
.spec{border:var(--rule);margin:20px 0}
.spec .spec-h{display:flex;justify-content:space-between;gap:10px;padding:8px 12px;
  font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  background:var(--bone-dim);border-bottom:var(--rule)}
.spec.c1 .spec-h{background:var(--pink);color:var(--ink)}
.spec.c2 .spec-h{background:var(--orange);color:var(--ink)}
.spec.c3 .spec-h{background:var(--teal);color:var(--ink)}
.spec .spec-h .doc{opacity:.72;font-weight:400;letter-spacing:.06em}
/* the doc number sits on a saturated fill in coloured spec heads; keep it legible */
.spec.c1 .spec-h .doc,.spec.c2 .spec-h .doc,.spec.c3 .spec-h .doc{opacity:1}
.spec ul{list-style:none;padding:12px 14px}
/* hanging indent: marker sits in the inline-start padding so wrapped lines
   align under the text, not under the bullet */
.spec li{padding:7px 0;padding-inline-start:1.4em;border-bottom:1px dashed var(--grid)}
.spec li:last-child{border-bottom:none}
.spec li::before{content:"\25B8";display:inline-block;width:1.4em;margin-inline-start:-1.4em;color:var(--pink-tx);font-weight:700}

/* ---------- flow ---------- */
.flow{display:grid;gap:12px;margin:22px 0;grid-template-columns:repeat(4,1fr)}
.flow .step{border:var(--rule);border-top-width:6px;padding:14px 10px;text-align:center;
  font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.flow .step b{display:block;font-size:20px;margin-bottom:5px}
.flow .step:nth-child(1){border-top-color:var(--pink)}
.flow .step:nth-child(2){border-top-color:var(--orange)}
.flow .step:nth-child(3){border-top-color:var(--teal)}
.flow .step:nth-child(4){border-top-color:var(--ink)}

/* ---------- stat / verdict / codes / rules / partner / pill / rail ---------- */
.grid{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));margin:20px 0}
.stat{border:var(--rule);border-top-width:6px;padding:16px 14px}
.stat:nth-child(3n+1){border-top-color:var(--pink)}
.stat:nth-child(3n+2){border-top-color:var(--orange)}
.stat:nth-child(3n){border-top-color:var(--teal)}
.stat .n{font-size:clamp(22px,5vw,34px);font-weight:800;line-height:1}
.stat .l{font-size:12.5px;margin-top:10px;line-height:1.5;opacity:.85}

.verdict{border:var(--rule);margin-top:0}
.verdict .v-h{padding:7px 11px;font-size:11px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  border-bottom:var(--rule);color:var(--bone)}
.verdict.yes .v-h{background:var(--teal);color:var(--ink)}
.verdict.no .v-h{background:var(--pink);color:var(--ink)}
.verdict.warn .v-h{background:var(--orange);color:var(--ink)}
.verdict ul{list-style:none;padding:10px 12px}
.verdict li{padding:5px 0;padding-inline-start:1.4em;border-bottom:1px dashed var(--grid);font-size:13px}
.verdict li:last-child{border-bottom:none}
.verdict li::before{display:inline-block;width:1.4em;margin-inline-start:-1.4em;font-weight:700}
.verdict.yes li::before{content:"\2713"}
.verdict.no li::before{content:"\2715"}
.verdict.warn li::before{content:"!"}

.codes{display:grid;gap:10px;grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin:20px 0}
.code{border:var(--rule);padding:10px;font-size:12px}
.code .num{display:inline-block;width:28px;height:28px;line-height:28px;text-align:center;
  font-weight:700;border:2px solid var(--ink);margin-bottom:6px}
.code.good .num{background:var(--teal);color:var(--ink)}
.code.some .num{background:var(--orange);color:var(--ink)}
.code.bad .num{background:var(--pink);color:var(--ink)}
.code b{display:block} .code span{opacity:.7;font-size:11px}

.rules{display:grid;gap:14px;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));margin:20px 0}
.rule{border:var(--rule);padding:14px}
.rule .r-n{font-size:22px;font-weight:800}
.rule:nth-child(3n+1) .r-n{color:var(--pink-tx)}
.rule:nth-child(3n+2) .r-n{color:var(--orange-tx)}
.rule:nth-child(3n) .r-n{color:var(--teal-tx)}
.rule b{display:block;text-transform:uppercase;letter-spacing:.06em;font-size:12px;margin:6px 0 4px}
.rule p{font-size:12px}

.partner{border:var(--rule);border-top-width:6px;padding:14px}
.partner:nth-child(4n+1){border-top-color:var(--pink)}
.partner:nth-child(4n+2){border-top-color:var(--orange)}
.partner:nth-child(4n+3){border-top-color:var(--teal)}
.partner:nth-child(4n){border-top-color:var(--ink)}
.partner .p-n{font-size:11px;font-weight:700;letter-spacing:.14em;opacity:.5}
.partner b{display:block;text-transform:uppercase;letter-spacing:.04em;font-size:13px;margin:6px 0 8px}
.partner p{font-size:12.5px} .partner .drops{margin-top:9px;font-size:11px;letter-spacing:.07em;text-transform:uppercase;opacity:.7}

.pills{display:flex;flex-wrap:wrap;gap:8px;margin:18px 0}
.pill{border:var(--rule);padding:7px 11px;font-size:12px;letter-spacing:.04em;text-transform:uppercase}

.rail{margin:20px 0}
.rail .r{display:grid;grid-template-columns:110px 1fr;gap:16px;padding:13px 0;border-top:1px dashed var(--grid);align-items:baseline}
.rail .r:first-child{border-top:none}
.rail .yr{font-weight:800;font-size:14px;letter-spacing:.04em}
.rail .yr .ph{display:block;font-size:11px;opacity:.6;letter-spacing:.08em}
.rail .d{font-size:13.5px;line-height:1.5}

.usebars{margin:18px 0;display:flex;flex-direction:column;gap:9px;max-width:52ch}
.usebars .row{display:grid;grid-template-columns:52px 1fr auto;gap:12px;align-items:center;font-size:13px}
.usebars .bar{height:15px;border:var(--rule)}
.usebars .bar>span{display:block;height:100%;background:var(--teal)}
.usebars .row:nth-child(1) .bar>span{background:var(--pink)}
.usebars .row:nth-child(2) .bar>span{background:var(--orange)}
.usebars .row:nth-child(3) .bar>span{background:var(--teal)}
.usebars .row:nth-child(4) .bar>span{background:var(--ink)}

/* ---------- TOC (recycling 101) ---------- */
.toc{border:var(--rule);margin:22px 0;font-size:12px}
.toc .toc-h{padding:8px 12px;font-weight:700;letter-spacing:.14em;text-transform:uppercase;
  background:var(--ink);color:var(--bone);font-size:11px}
.toc a{display:flex;gap:9px;padding:9px 12px;text-decoration:none;text-transform:uppercase;
  letter-spacing:.05em;border-bottom:1px dashed var(--grid)}
.toc a:last-child{border-bottom:none}
.toc a .n{font-weight:700;opacity:.45}

/* ---------- notes / stamps / mail ---------- */
.note{margin:20px 0;border:var(--rule);border-left:8px solid var(--orange);padding:12px 14px;
  font-size:13px;background:var(--bone-dim)}
.note b{display:block;text-transform:uppercase;letter-spacing:.07em;font-size:11px;margin-bottom:4px}
.note a{font-weight:700}
.stamp{display:inline-block;margin-top:16px;border:2px solid var(--orange);color:var(--orange-tx);
  padding:6px 11px;font-size:11px;font-weight:700;letter-spacing:.13em;text-transform:uppercase;transform:rotate(-1.6deg)}
.tbd{border:2px dashed var(--ink);padding:12px 14px;margin-top:12px}
.tbd .k{font-size:11px;letter-spacing:.09em;text-transform:uppercase;opacity:.7}
.tbd .v{font-size:clamp(17px,3.4vw,24px);font-weight:800;margin-top:4px}
.illus{margin:16px 0;font-size:12px;border-left:4px solid var(--orange);padding:6px 0 6px 12px;opacity:.85;max-width:58ch}
.bigmail{display:block;margin:20px 0;padding:20px 16px;border:var(--rule);text-align:center;
  text-decoration:none;font-size:clamp(15px,3.6vw,21px);font-weight:700;letter-spacing:.03em;overflow-wrap:anywhere}

/* ---------- two-column duo (collapses on narrow) ---------- */
.duo{display:grid;gap:16px;grid-template-columns:1fr 1fr;margin:20px 0}

/* ---------- hex figure ---------- */
.hexfig{display:grid;place-items:center;margin:20px 0;color:var(--ink)}
.hexfig svg{width:min(320px,80vw)}

/* ---------- footnotes ---------- */
.fnlist{list-style:none;counter-reset:fn;font-size:12px;margin-top:8px}
.fnlist li{counter-increment:fn;position:relative;padding:9px 0;padding-inline-start:28px;border-bottom:1px dashed var(--grid);line-height:1.5}
.fnlist li:last-child{border-bottom:none}
.fnlist li::before{content:counter(fn);position:absolute;inset-inline-start:0;top:9px;font-weight:700;color:var(--pink-tx)}
.fnlist li a{font-weight:700;overflow-wrap:anywhere}
sup.fn{font-size:.62em;font-weight:700;line-height:0;margin-left:1px}
sup.fn a{color:var(--pink-tx);text-decoration:underline}

/* ---------- footer ---------- */
footer{border-top:var(--rule);margin-top:8px}
footer .fnav{display:flex;flex-wrap:wrap;gap:10px 18px;justify-content:space-between;padding:16px 0;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
footer .fnav a{text-decoration:none;opacity:.8}
footer .fnav a:hover{opacity:1}
footer .cr{border-top:1px dashed var(--grid);padding:12px 0;font-size:11px;letter-spacing:.08em;text-transform:uppercase;opacity:.7}

/* ===========================================================================
   VARIANT: mobile  ·  brand experience for touch / small screens
   =========================================================================== */
.v-mobile{--measure:720px}
.v-mobile body{font-size:16px}
.v-mobile .brand .mark img{width:120px}
.v-mobile .wrap{width:min(720px,100%);padding:0 18px}
.v-mobile .vswitch a{padding:9px 12px}
.v-mobile .cta{min-height:40px;display:inline-flex;align-items:center;justify-content:center}
.v-mobile .vswitch a,.v-mobile .toc a{min-height:40px;display:flex;align-items:center;justify-content:center}
.v-mobile .toc a{justify-content:flex-start}

/* ===========================================================================
   VARIANT: lite  ·  minimum bytes, colour kept, no ornament
   =========================================================================== */
.v-lite{--measure:60ch}
.v-lite .brand .mark img{width:104px}
.v-lite .band{height:auto;border-bottom:none;border-top:var(--rule);margin:2.4rem 0;background:none}
.v-lite .hero{padding:32px 20px 28px}
.v-lite .flow{grid-template-columns:repeat(2,1fr)}

/* ===========================================================================
   VARIANT: e-ink  ·  pure monochrome, no motion, high contrast
   (set on <html class="v-eink">; accents collapse to ink via tokens)
   =========================================================================== */
html.v-eink{--ink:#000;--bone:#fff;--bone-dim:#fff;--grid:#000;
  --pink:#000;--orange:#000;--teal:#000;--pink-tx:#000;--teal-tx:#000;--orange-tx:#000;--rule:3px solid #000;--measure:72ch}
.v-eink body{font-size:18px;line-height:1.62}
.v-eink *{animation:none!important;transition:none!important;box-shadow:none!important;text-shadow:none!important;transform:none!important}
.v-eink ::selection{background:#000;color:#fff}
.v-eink a{text-decoration:underline}
.v-eink .hi{color:#000;text-decoration:underline}
.v-eink .seclab,.v-eink .spec-h,.v-eink .verdict .v-h,.v-eink .toc .toc-h{background:#000!important;color:#fff!important}
.v-eink .spec.c1 .spec-h,.v-eink .spec.c2 .spec-h,.v-eink .spec.c3 .spec-h{background:#000!important;color:#fff!important}
.v-eink .code .num{background:#fff!important;color:#000!important;border:2px solid #000}
.v-eink .stamp{border-color:#000;color:#000}
.v-eink .note{background:#fff;border-left-color:#000}
.v-eink .usebars .bar>span{background:#000!important}
.v-eink .stat .n,.v-eink .rule .r-n,.v-eink .fnlist li::before,.v-eink sup.fn a{color:#000}
.v-eink .brand{text-decoration:none}
.v-eink .brand .doc{color:#000}
.v-eink .brand .lock{border-inline-start-color:#000}
.v-eink .brand img,.v-eink .hero .wordmark{filter:brightness(0)}
.v-eink .band{height:18px;background:repeating-conic-gradient(#000 0 25%,#fff 0 50%) 50%/16px 16px;border-top:3px solid #000;border-bottom:3px solid #000}
.v-eink .band.harlequin{height:22px;background:repeating-conic-gradient(from 45deg,#000 0 25%,#fff 0 50%) 50%/22px 22px}
.v-eink .vswitch a[aria-current]{background:#000;color:#fff}
/* e-ink repaints slowly and ghosts; a sticky bar floats over the text it should
   sit above, so pin the header in normal flow instead */
.v-eink .topbar{position:static}
/* raise faint muted text so it stays legible on greyscale e-ink displays */
.v-eink .dim,.v-eink .sectag,.v-eink .partner .p-n,.v-eink .partner .drops,.v-eink .toc a .n,.v-eink .spec .spec-h .doc,.v-eink .rail .yr .ph,.v-eink .code span,.v-eink .mtnote,.v-eink .stat .l{opacity:.85}

/* ---------- responsive collapses (shared) ---------- */
@media(max-width:640px){
  .flow{grid-template-columns:repeat(2,1fr)}
  .duo{grid-template-columns:1fr}
  .rail .r{grid-template-columns:1fr;gap:4px}
}
/* keep the four process steps as a compact 2x2 matrix on phones; only the very
   narrowest screens fall back to a single column */
@media(max-width:339px){
  .flow{grid-template-columns:1fr}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}

/* ---------- language picker + utility (mirrors site.css) ---------- */
.utility{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.langpick{position:relative;font-size:11px;letter-spacing:.08em;text-transform:uppercase}
.langpick>summary{list-style:none;cursor:pointer;display:flex;align-items:center;gap:6px;padding:6px 11px;border:var(--rule);white-space:nowrap;font-weight:700}
.langpick>summary::-webkit-details-marker{display:none}
.globe{display:inline-block;vertical-align:-2px;flex:none}
.langpick>summary .car{font-size:9px;opacity:.6}
.langpick[open]>summary .car{transform:rotate(180deg)}
.langmenu{position:absolute;top:100%;inset-inline-end:0;margin-top:2px;z-index:80;min-width:208px;max-height:60vh;overflow:auto;background:var(--bone);border:var(--rule);display:grid;grid-template-columns:1fr 1fr}
.langmenu a{display:block;padding:9px 11px;text-decoration:none;border-bottom:1px dashed var(--grid);border-inline-start:1px dashed var(--grid)}
.langmenu a:nth-child(odd){border-inline-start:none}
.langmenu a[aria-current]{background:var(--ink);color:var(--bone);font-weight:700}
.langmenu a:hover{background:var(--teal);color:var(--ink)}
.langmenu a .en{display:block;font-size:9.5px;opacity:.72;letter-spacing:.04em}
.topbar .mtnote{border-top:1px dashed var(--ink);padding:6px 0;text-align:center;font-size:11px;letter-spacing:.02em;opacity:.75}
.v-mobile .langpick>summary{padding:9px 12px}
.v-eink .langmenu a:hover{background:#000;color:#fff}

/* ---------- right-to-left (Arabic, Farsi) for lightweight variants ---------- */
[dir="rtl"] .vswitch a{border-left:none;border-right:1px dashed var(--ink)}
[dir="rtl"] .vswitch a:first-child{border-right:none}
[dir="rtl"] .note{border-left:0;border-right:8px solid var(--orange)}
[dir="rtl"] .spec li::before{content:"\25C2"}
[dir="rtl"] .illus{border-left:0;border-right:4px solid var(--orange);padding:6px 12px 6px 0}
[dir="rtl"] sup.fn{margin-left:0;margin-right:1px}