/* ========================================================================== legacy.css — 2011 Joomla compatibility layer DESIGN-SPEC.md §16, plus §16.10 (inline-style neutralisation). Loaded LAST, after bootstrap.min.css and site.css: several rules here exist only to undo the 2010 "finance" skin and would otherwise be undone themselves. FOUR HOUSE RULES 1. SCOPE. Every selector sits under .rb-prose, the article container, so no 2011 class leaks into masthead, rail, breadcrumb or footer — .img, .sub, .just and .left are far too generic to leave loose. That costs one class of specificity everywhere, and the one interaction the spec pins down still holds: .rb-prose .font8c is (0,2,0) against the column classes' (0,3,1), so per-column alignment still wins (§16.4). 2. TOKENS ONLY. Not one literal colour — all 15 hard-coded colours in the 2010 sheet resolve to a var(--rb-*), or a 2010 literal survives as a brick mid-table that no token can reach. Old values are quoted in comments WITHOUT their leading hash on purpose: gate 4 greps for literal hex outside the token block and documentation must not trip it. Do not tidy the hash back in. Colour and space are tokens; font-size and border-width are literals, matching the spec's own §16 and §11.5 rules. 3. THREE RULE WEIGHTS (§5.3): hair 1px --rb-border-subtle, mid 2px --rb-border-strong, heavy 2px --rb-rule-primary. No fourth weight, and no vertical rules in any context. 4. !important BUDGET: eight in the whole file. Seven are in §16.10 and each names the inline declaration it beats; nothing but an inline style is ever fought. The eighth is .rlink, which matches a 2010 !important at equal weight rather than losing to it (§16.5). Grep the file: `grep -c '!important'` returns 15 lines, of which seven are prose mentions (three in this rule, one in §16.5, one in the §16.10 preamble, and one each in §16.10 e and f explaining why they need none), leaving eight declarations. If that arithmetic and this count ever disagree, the count is the thing that is wrong. Verified 2026-09-02 against all 892 bodies: 53 distinct class names, 9,874 inline style attributes, 1,029 tables, 40,222 cells. ========================================================================== */ /* ===== §16.1 Element-level residue ====================================== The old element rules are replaced wholesale by site.css. One intent is worth keeping: td p{margin:0;line-height:1.3em}. 30 paragraphs sit inside cells and must stay flush against 17,180
line breaks. The 2010 sheet also suppressed the focus outline on links and images. That half is NOT reproduced here or anywhere: it removes the focus ring (§17.3, and gate 5 greps for it — which is why this sentence describes the declaration instead of quoting it). ========================================================================= */ .rb-prose :is(td,th) p{margin:0;line-height:1.45} /* ===== §16.2 Cell borders and padding — the one-block remap ============= 34,468 cells, eight classes, one rule. The 2010 skin drew a full 1px box on every one; three used different greys (c6cfe1, dad9dd, c7d0cc, C3D1EC) and tdr2's box was white — an invisible gutter, not a rule. Because we REMOVE the borders rather than recolour them, those 2,480 white boxes can never resurface as visible grey lines. td1 (8,237 uses) had no padding at all and gains some here. No cell in the corpus carries two of these classes, so the block cannot conflict with itself. td2/td4 do not exist. Class-based, so it follows a cell through header promotion: 1,207 of the 1,235 the pass has synthesised so far still carry one of these eight classes. Every other cell-level rule in this file is written :is(td,th) for the same reason — see the INTEGRATION NOTE. ========================================================================= */ .rb-prose :is(.tdr,.tdr2,.tdr5,.tdr7,.td1,.td3,.td5,.td6){ border:0; border-bottom:1px solid var(--rb-border-subtle); /* hair */ padding:var(--rb-s-2) var(--rb-s-3); /* 8px 12px, = §11.5 */ } /* ===== §16.3 Row and table backgrounds ================================== far* sits on ; the design's zebra, hover and total-row treatments all paint . A td background paints over a tr background regardless of selector weight, so every rule here targets descendant cells — otherwise the two systems silently erase each other. ========================================================================= */ /* Genuine panel tints: far1 (1 use, e0e0e0), far2 (4, e4e4e4). */ .rb-prose :is(.far1,.far2) > :is(td,th){background:var(--rb-surface-2)} /* far3 (937 uses, e9e9e9) is NOT a header marker and encodes nothing: it occurs in 6 tables and 5 paint every row (900.html 301/301, 144.html 195/195, 956.html 66/66, 163.html 59/59, 710.html 16/16; 897.html 300/301). A whole-table wash from 2010. Neutralised. The declaration is a deliberate no-op — the 2010 sheet is no longer loaded — kept so the decision stays visible at the point of use. */ .rb-prose .far3 > :is(td,th){background:transparent} /* Neutralising it leaves those 6 tables with no banding at all, because §12 step 8 refuses data-zebra to any table containing a far* class. Two of them are 301 rows and one is 195 — the tables that need banding most. Supply it here from the same token. :where() keeps this under the hover rule's (0,3,3) so row hover still reads. */ .rb-prose :where(.rb-tw:not([data-zebra]),.table-scroll:not([data-zebra])) tr.far3:nth-child(even) > :is(td,th), .rb-prose > table tr.far3:nth-child(even) > :is(td,th){background:var(--rb-zebra)} /* far5 (284 uses across 60 tables, d9eeff) is a real emphasis band, used both as a header strip and — in all 60 tables — as the last row. */ .rb-prose .far5 > :is(td,th){background:var(--rb-blue-100)} /* §12 step 7 adds .rb-total to a far5 row in last position. */ .rb-prose .far5.rb-total > :is(td,th){ border-top:2px solid var(--rb-border-strong); /* mid */ font-weight:700; color:var(--rb-text-strong); } /* far4 exists in the 2010 sheet (eeeeee) and nowhere in the corpus: no rule. */ /* tbl (2 tables: 140.html at 115 rows, 983.html at 11) carried its own f3f3f3 zebra and a 1px box. The box is dropped outright. The stripe is supplied only where the system has not already banded the table — both qualify for data-zebra="auto", and running both would stripe odd AND even rows, destroying the banding on a 115-row table. */ .rb-prose > :where(.tbl) > tbody > tr:nth-child(odd) > :is(td,th), .rb-prose :where(.rb-tw:not([data-zebra]) .tbl,.table-scroll:not([data-zebra]) .tbl) > tbody > tr:nth-child(odd) > :is(td,th){ background:var(--rb-zebra); } /* ===== §16.4 Typography classes ========================================= The 2010 body was 13px, so 8pt (~10.67px) read as 82% of it; against a 16px body it would be 67% — unreadable. Every size is mapped up. Written WITHOUT an element qualifier on purpose: font8c sits on 215 and zero cells, font8 on 103 and 61
. They work by inheritance, and td.font8 would kill 279 of the 510 font8 uses outright. ========================================================================= */ .rb-prose .font8 {font-size:13px;line-height:1.5} .rb-prose .font8c {font-size:13px;text-align:center} .rb-prose .font8b {font-size:13px;font-weight:600} .rb-prose .font8bc {font-size:13px;font-weight:600;text-align:center} /* 0 uses; §12.2 signal */ .rb-prose .fontb {font-weight:600} .rb-prose .fontc {text-align:center} .rb-prose .f12 {font-size:14px} .rb-prose .f12c {font-size:14px;text-align:center} .rb-prose .t8c {font-size:13px;text-align:center} /* §16.8 orphans — in the corpus, defined in neither 2010 stylesheet. Emitted from evident intent so the markup does not lose meaning. */ .rb-prose .fontbc {font-weight:600;text-align:center} /* 5 , header rows */ .rb-prose .font5 {font-size:12px} /* 3 */ .rb-prose .font12 {font-size:14px} /* 1
*/ .rb-prose .f10 {font-size:13px} /* 2 */ /* NOTE. On a promoted data table site.css sets .rb-tw[data-kind="data"] table{font-size:14px} at (0,2,1), outranking these (0,2,0) rules for the 61 font8 and 215 font8c TABLES. That is the intended outcome: the table system owns data-table type size and 14px is a better floor than 13px. text-align still lands — nothing in site.css sets it on
. On the 103 font8 the size does land, a rule on the row being nearer in the inheritance chain than one on the table. And [data-cols="dense"] td{font-size:12px} beats everything here by targeting the cell directly, which is also correct. BoB (1 use, on an ) is a bank abbreviation used as a content label, not a style hook. Deliberately no rule. */ /* ===== §16.5 Link and sub-heading classes =============================== rlink's 2010 rule carried text-decoration:underline !important. It cannot be beaten at equal specificity without our own, and the new system underlines links anyway — so match it rather than fight it. 607 uses. sub (120: 119 span, 1 p) and sub1 (96: 86 span, 10 p) were bold underlined inline spans. They were always sub-headings semantically ("UBA Global Locations", "1. Industrial & Commercial Bank of China") and §12.3 reads them as caption sources. Promoted to blocks; dropping the underline fixes 216 underlined non-links. ========================================================================= */ .rb-prose .rlink{ font-weight:600; text-decoration:underline !important; text-underline-offset:2px; } .rb-prose .ref{font-weight:600;text-decoration:underline;text-underline-offset:2px} /* 0 uses */ .rb-prose .sub, .rb-prose .sub1{ display:block; font-weight:600; text-decoration:none; color:var(--rb-text-strong); margin:var(--rb-s-6) 0 var(--rb-s-2); } .rb-prose .sub {font-size:18px} .rb-prose .sub1{font-size:19px} /* ===== §16.6 Spacing classes — quantised onto the 8px scale (§5.1) ====== mab = margin-bottom, mt = margin-top, pad = padding-LEFT only. (The brief reads padN as all-round padding, which would indent 13 elements on four sides.) Trailing counts are corpus uses; zeros are the documented defensive set. ========================================================================= */ .rb-prose .mab5, .rb-prose .mab10 {margin-bottom:var(--rb-s-2)} /* 10 -> 8 (10, 15) */ .rb-prose .mab15 {margin-bottom:var(--rb-s-4)} /* 15 -> 16 (44) */ .rb-prose .mab20, .rb-prose .mab25 {margin-bottom:var(--rb-s-6)} /* 20,25 -> 24 (1100, 13) */ .rb-prose .mab30 {margin-bottom:var(--rb-s-8)} /* 30 -> 32 (428) */ .rb-prose .mab40, .rb-prose .mab50 {margin-bottom:var(--rb-s-12)} /* 40,50 -> 48 (61, 16) */ .rb-prose .mab60, .rb-prose .mab70 {margin-bottom:var(--rb-s-16)} /* 60,70 -> 64 (4, 0) */ .rb-prose .mab90 {margin-bottom:var(--rb-s-24)} /* 90 -> 96 (0) */ .rb-prose .mt5 {margin-top:var(--rb-s-1)} /* 5 -> 4 (5) */ .rb-prose .mt10 {margin-top:var(--rb-s-2)} /* 10 -> 8 (1) */ .rb-prose .mt15 {margin-top:var(--rb-s-4)} /* 15 -> 16 (0) */ .rb-prose .mt20, .rb-prose .mt25 {margin-top:var(--rb-s-6)} /* 20,25 -> 24 (1, 0) */ .rb-prose .mt30 {margin-top:var(--rb-s-8)} /* 30 -> 32 (15) */ .rb-prose .mt40 {margin-top:var(--rb-s-12)} /* 40 -> 48 (3) */ .rb-prose .par {margin-bottom:var(--rb-s-6)} /* 20 -> 24 (0) */ .rb-prose .par1 {margin-bottom:var(--rb-s-4)} /* 15 -> 16 (1) */ .rb-prose .par2 {margin-bottom:var(--rb-s-2)} /* 10 -> 8 (2) */ .rb-prose .pad5 {padding-left:var(--rb-s-1)} /* 5 -> 4 (10) */ .rb-prose .pad10 {padding-left:var(--rb-s-2)} /* 10 -> 8 (1) */ .rb-prose .pad15 {padding-left:var(--rb-s-4)} /* 15 -> 16 (0) */ .rb-prose .pad20, .rb-prose .pad25 {padding-left:var(--rb-s-6)} /* 20,25 -> 24 (0) */ .rb-prose .pad30 {padding-left:var(--rb-s-8)} /* 30 -> 32 (0) */ .rb-prose .pad50 {padding-left:var(--rb-s-12)} /* 50 -> 48 (2) */ /* The old body set p{text-align:justify}. Justified unhyphenated prose is the most dated thing on the 2010 site; .just is its explicit form. */ .rb-prose .just{text-align:left} /* A 48px left indent costs 13% of the line on a 360px screen. */ @media (max-width:575.98px){ .rb-prose :is(.pad5,.pad10,.pad15,.pad20,.pad25,.pad30,.pad50){padding-left:0} } /* Every table is moved inside
by the post-process pass, and the figure owns the block margin. A legacy margin class left on the inner table would add dead space inside the frame and double the gap below it — 309 mab20 and 156 mab30 tables would show it. */ .rb-prose .rb-tw table{margin:0} /* ===== §16.7 Figure-block classes ======================================= All six are centred

blocks: 100% of their 231 uses are on

, and the corpus holds zero float declarations and zero genuine align= attributes. The brief's reading of img1..img3 as float+margin helpers is wrong — do not write float-clearing rules. Element-qualified here (unlike §16.4) precisely because the family is entirely on

, and because it takes (0,2,1) to reassert six distinct margins over site.css §13.2's single p[class^="img"] rule. Where a

carries an img class and a margin class together (8 cases), the img class wins: it is the more specific description of the block. ========================================================================= */ .rb-prose p.img, .rb-prose p.img1, .rb-prose p.img2, .rb-prose p.img22, .rb-prose p.img3, .rb-prose p.img4 {text-align:center} .rb-prose p.img {margin:var(--rb-s-8) 0 var(--rb-s-4)} /* 30/15 (14) */ .rb-prose p.img1 {margin:var(--rb-s-6) 0 var(--rb-s-4)} /* 20/15 (64) */ .rb-prose p.img2, .rb-prose p.img22 {margin:var(--rb-s-4) 0} /* 10/10 (115) */ .rb-prose p.img3 {margin:var(--rb-s-2) 0 var(--rb-s-4)} /* 5/10 (32) */ .rb-prose p.img4 {margin:0 0 var(--rb-s-6)} /* 0/20 (6) */ /* ===== §16.9 Presentational attributes ================================== 271 border=, 149 cellpadding=, 34 cellspacing=, 505 valign=, 6 rules=, 2 align=. Neutralised by CSS, never edited out of the bodies. valign is still honoured by every engine, so those three rules are documentation — but they survive a future all:unset. There is no bgcolor and no nowrap attribute anywhere in the corpus. ========================================================================= */ .rb-prose table[border]{border:0} .rb-prose :is(td,th)[align="center"]{text-align:center} /* the only 2 genuine align= */ .rb-prose :is(td,th)[valign="top"]{vertical-align:top} .rb-prose :is(td,th)[valign="middle"]{vertical-align:middle} .rb-prose :is(td,th)[valign="bottom"]{vertical-align:bottom} /* rules="rows" (6 tables: 140, 313, 382, 482, 633, 983) is an HTML4 attribute drawing internal cell rules in the UA's own colour. §16.2 and site.css between them already zero the borders on every classed and every layout cell, but 633.html's cells carry no class at all, so its 26 rows would keep a grey grid the token system never sees. */ .rb-prose table[rules] :is(td,th){border-left:0;border-right:0} /* ========================================================================== §16.10 Inline-style neutralisation [EXTENSION] 9,874 inline style attributes survive in the bodies, and nothing but !important beats an inline declaration. Each rule below names the exact declaration it beats, with a measured count and the measured damage. MEASURED: summing each table's widest row of inline px widths and image gutters, 491 tables overflow a 360px phone column and 34 overflow a 768px tablet column. None overflows the 832px desktop column — which is why every rule here is inside a max-width query. ========================================================================== */ /* a. FIXED PIXEL WIDTHS — 1,082 on

, 237 on , up to 750px. Data tables are deliberately EXCLUDED: their columns are sized for the scroll tier and a frozen first column (§11.7/§11.8), and releasing the widths would let the browser squeeze a 14-column ranking instead of scrolling it, which §11.8 explicitly rejects. What is left is - layout tables between 768px and 991.98px, where site.css's unwrap has not yet fired and there is no scrollport: 8 tables measured, worst case 730px inside a 704px column; - any table the pass never wrapped — the §12.5 cache-miss or hand-dropped-article path, where no data-mobile attribute exists. [style*="width"] also matches the 17 border-width cells in 448.html, which carry no width of their own, so the overmatch is inert. DISCRIMINATED FROM THE MARKUP, NOT FROM A HOOK. A table containing an is always a layout table: 803 in-table images and zero of them in a data table, re-verified here. :has(img) therefore identifies the population that actually carries photo-cell widths and gutters, whatever the post-process pass ends up calling its wrappers. The two named hooks catch image-less layout tables under either vocabulary — see the INTEGRATION NOTE at the foot of this file. */ @media (max-width:991.98px){ .rb-prose table:has(img)[style*="width"], .rb-prose table.t-layout[style*="width"], .rb-prose [data-kind="layout"] table[style*="width"], .rb-prose table:has(img) :is(td,th)[style*="width"], .rb-prose table.t-layout :is(td,th)[style*="width"], .rb-prose [data-kind="layout"] :is(td,th)[style*="width"]{width:auto !important} } /* a2. THE SAME FIXED WIDTHS, ON PROMOTED HEADER CELLS — 784 in 437.html. NOT in the spec's §3.4 census, which counts these five as color: uses of a5bbe3 mapped to .rb-c-blue. Re-measured with a word boundary: there are ZERO color:a5bbe3 declarations in the corpus and exactly five background-color ones, all on in one file. The true color: census is 359+7+7+6+3+2+1+1+1 = 387, matching the spec's own total exactly. It matters because these are section-header rows (Switzerland, Europe, Latin America, Asia / Pacific) whose text §12.4 remaps to .rb-c-blue. Left on the inline a5bbe3 ground that is a mid blue on a pale blue — about 1.5:1, unreadable. The surface-tint token is the th ground, which is what these rows are, and carries the remapped text at 8.1:1. No !important needed: the background is on the and this paints the and converted 1,235 cells from
across 178 files carry a width-only inline style, inherited from the the header-promotion pass converted. DESIGN-SPEC §11.6 says in terms that these legacy header widths "are the one thing the old template got wrong; they must not be consulted" — nothing enforced it, and a. deliberately exempts data tables, so on a data table they still drive the whole column allocation. table-layout is auto, so a width is a MINIMUM the browser honours before it looks at the 120 body rows underneath. MEASURED on the widest ranking (634, 120 rows, 35/205/90/205/140): at 1440 the 830px table divides [55.8, 243.5, 120.9, 243.5, 166.3] and 8 rows wrap to 63.69px against a 39.59px base — bank names are squeezed so a date column can hold 166px it does not need. Releasing the widths keeps the table at exactly 830px and redivides it [55.8, 358.4, 120.3, 163.8, 131.7]: 0 rows wrap. At 768: 23 wrapped rows -> 0, Bank 208 -> 307. MIN-WIDTH 768 ON PURPOSE. Below that a.'s rationale still governs: the scroll tier wants the columns wide so a 14-column ranking scrolls instead of being squeezed (§11.8), and at 390 nothing changes anyway — the table stays 535.97px with identical columns, because the intrinsic minimums already exceed the inline widths there. Header cells only: body-cell widths are the scroll tier's business and are left alone at every width. */ @media (min-width:768px){ .rb-prose .rb-tw[data-kind="data"] thead th[style*="width"], .rb-prose .table-scroll thead th[style*="width"]{width:auto !important} } /* b. IMAGE GUTTERS — 490 inline margin-right, 60px to 100px. 489 of the 490 sit on an inside a , and images only ever occur in layout tables, so td img is an exact selector needing no hook. (The one outlier is margin-right:auto on a centred image, which this must not touch and does not: auto is not a gutter.) Below 768px this asserts the same 0 that site.css §11.8 asserts on unwrapped tables — identical value, so the two cannot disagree — and it still fires if no unwrap tier was ever stamped. Between 768px and 991.98px neither unwrap nor scrollport applies, so the gutter is merely reduced to a scale step rather than removed. */ @media (max-width:767.98px){ .rb-prose :is(td,th) img[style*="margin-right"]{margin-right:0 !important} } @media (min-width:768px) and (max-width:991.98px){ .rb-prose :is(td,th) img[style*="margin-right"]{margin-right:var(--rb-s-6) !important} } /* c. INLINE padding-left — 96 declarations, up to 105px, a third of a 312px column. The same correction §16.6 makes for the pad classes, applied to the inline form that outranks them. */ @media (max-width:575.98px){ .rb-prose [style*="padding-left"]{padding-left:var(--rb-s-3) !important} } /* d. INLINE font-size: 8pt — 9 declarations, ~10.67px against a 16px body. The same correction §16.4 makes for .font8. The other inline sizes in the corpus (10pt, 12pt, 13px, 14pt, 14px, 15px) are legible and left alone. */ .rb-prose [style*="font-size: 8pt"]{font-size:13px !important} /* e. INLINE ROW BACKGROUND — 5
, the same lever §16.3 relies on. tbody is named to reach (0,4,3), matching the zebra rule that would otherwise win — 437.html has no far* class and 43 rows, so it does get data-zebra="auto". */ .rb-prose .rb-tw[data-kind="data"] tbody tr[style*="background-color"] > :is(td,th), .rb-prose .table-scroll tbody tr[style*="background-color"] > :is(td,th), .rb-prose tbody tr[style*="background-color"] > :is(td,th){ background:var(--rb-surface-tint); } /* f. INLINE CELL BORDERS — 17 in 448.html carrying border-width:1px;border-style:solid with no border-color, so the box resolves to currentColor: a full-strength text-coloured 1px grid, and a vertical rule, which §0 bans outright. The inline style sets width and style but not colour, so recolouring needs no !important and turns 17 currentColor boxes into legitimate hairlines. */ .rb-prose :is(td,th)[style*="border-style"]{border-color:var(--rb-border-subtle)} /* g. INLINE font-family — 89 declarations across 14 files, every one of them verdana: 82 x "verdana,geneva", 5 x "verdana", 2 x "Verdana", and nothing else. Unquoted `verdana` names a face this box does not have, and Chromium does NOT apply the fontconfig verdana->DejaVu alias, so the whole list resolves to nothing and falls through to the default standard font — a Times-metric SERIF, which §0 bans outright. Measured: the home page's only section label ("Recent Publications", 16px/600) renders 135.55px wide under `verdana`, under `serif`, and under a deliberately nonexistent family alike, against 152.92px under the --rb-font-sans stack. A font-family census of
found exactly two nodes escaping the design system. Spec §16 row 16 wanted the attribute stripped in the post-process pass; until that runs, an inline declaration can only be outranked here. */ .rb-prose [style*="font-family"]{font-family:var(--rb-font-sans) !important} /* ========================================================================== INTEGRATION NOTE — the corpus and the spec currently disagree Recorded 2026-09-02 so the next person does not have to rediscover it. DESIGN-SPEC §12.1 specifies that the post-process pass wraps each table in
and stamps data-kind="data"|"layout" (433/596). The bodies in app/data/articles/ were rewritten at 10:44 by something else, and now carry a different vocabulary: - every table wrapped in
(1,029) - 555 tables marked class="t-layout" role="presentation" - zero rb-tw, zero data-kind anywhere in the corpus Three consequences, none of which this file can fix on its own: 1. site.css, written to the spec, keys every table rule off .rb-tw[data-kind=...] and will therefore style nothing. 2. .t-layout is sound but incomplete: it never lands on a table carrying data-cell classes (0 false positives), but it marks 555 where the spec's own discriminator finds 596 layout tables. 41 layout tables would receive the data skin. 3. role="presentation" on 555 tables contradicts §17.5, which says in terms that it "is not required and must not be added, because several contain real content in cells that a reader should still reach". It strips table semantics from the address and branch blocks that the 17,180
line breaks live in. This is an accessibility regression, not a styling preference. The pass is also still running: between 10:31 and 10:51 it promoted 304
to , 784 of which carry an inline pixel width. Every cell-level selector in this file is therefore written :is(td,th) rather than td — a compat layer that says only td silently stops covering a cell the moment it is promoted, and :is(td,th) costs nothing, being the same specificity as td. All figures quoted in this file are a snapshot; the class counts are stable, the element names are not. Every §16.1-§16.9 rule above is keyed to the 2011 classes themselves and is unaffected either way. The four rules that did need a wrapper — far3 banding, the tbl stripe, and §16.10 a and e — now name both vocabularies or discriminate from the markup, so they land under the spec's pass, the current corpus, or no pass at all. §16.6's .rb-tw table{margin:0} is the one rule left deliberately spec-only: it must not fire against a wrapper whose own block margin is unknown, or every table on the site loses its spacing. ========================================================================== */