/* RotorLab app sheet (2.133.0): tokens in both themes, the base layer and the
   rl- components. header.inject links it into every app and console page
   AHEAD of the page's own <style>, so a page rule still wins a tie and moving
   a page onto this sheet is deletion (tools/strip_tokens.py).
   Sources: DESIGN-DIRECTION.md (decision 444, 445), PLAN-2133 section 3,
   ICONS.md 2.4. Contract U1: token and class names are posted in the 2.133.0
   CHAT before any change. Colors live only in the generated block below;
   tests/test_tokens.py measures them in both themes (WCAG 2.2 AA).
   Inter: copyright 2016 The Inter Project Authors, SIL Open Font License 1.1
   (rlab/fonts/web/LICENSE-Inter.txt). */

@font-face{font-family:"Inter";font-style:normal;font-weight:100 900;font-display:swap;
src:url("/rlfont-inter-latin.woff2?v=4.1") 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}

/* @tokens begin: generated from rlab/tokens.py by `python -m rlab.tokens --write`; edit that file, not this block */
:root{--font:"Inter","Segoe UI Variable Text","Segoe UI",system-ui,-apple-system,Roboto,sans-serif;--mono:ui-monospace,"Cascadia Mono","SF Mono",Menlo,Consolas,monospace;--fs-1:12px;--lh-1:16px;--fs-2:13px;--lh-2:20px;--fs-3:14px;--lh-3:20px;--fs-4:16px;--lh-4:24px;--fs-5:20px;--lh-5:28px;--fs-6:24px;--lh-6:32px;--fs-7:32px;--lh-7:40px;--sp-1:4px;--sp-2:8px;--sp-3:12px;--sp-4:16px;--sp-5:24px;--sp-6:32px;--sp-7:48px;--r-1:6px;--r-2:10px;--r-pill:999px;--t-fast:120ms;--t-base:200ms;--ease:cubic-bezier(.2,0,.38,.9);--row:40px;--ctl:36px;--pad:16px;--bar-h:52px;--rail-w:232px;--dash-1:none;--dash-2:6 3;--dash-3:2 3;--dash-4:8 3 2 3;--dash-5:12 4}
[data-density="compact"]{--row:32px;--ctl:32px;--pad:12px}
:root,[data-theme="dark"]{--bg:#0d1117;--rail:#0a0e13;--bar:#10151c;--surface:#151b23;--surface-2:#1b222c;--overlay:#1e2630;--track:#161c24;--line:#232c37;--line-strong:#313c4a;--field-line:#6b7684;--ink:#e6edf3;--ink-2:#c2ccd6;--mut:#8b97a6;--faint:#8b95a1;--accent:#4d8bff;--accent-hover:#6a9eff;--accent-soft:#16233b;--on-accent:#06101f;--focus:#4d8bff;--signal:#2dd4bf;--ok:#43d98a;--ok-bg:#0f2a1d;--warn:#e8b53d;--warn-bg:#2a230f;--bad:#ff8f7a;--bad-bg:#2c1618;--unk:#b39dfa;--unk-bg:#211c33;--neutral:#8b97a6;--neutral-bg:#1b222c;--on-status:#0d1117;--series-1:#6ea2ff;--series-2:#22b8cf;--series-3:#e879f9;--series-4:#a5b4fc;--series-5:#94a3b8;--shadow-1:none;--shadow-2:0 2px 8px rgba(0,0,0,.4);--shadow-3:0 8px 24px rgba(0,0,0,.45),0 24px 56px -12px rgba(0,0,0,.6);--scrim:rgba(0,0,0,.62);--edge-fade:rgba(0,0,0,.2);--surface2:var(--surface-2);--line2:var(--line-strong);--accent2:var(--accent-hover);--shadow:var(--shadow-1);color-scheme:dark}
[data-theme="light"]{--bg:#f4f6f9;--rail:#eff2f5;--bar:#ffffff;--surface:#ffffff;--surface-2:#f1f4f8;--overlay:#ffffff;--track:#e3e7ed;--line:#e3e8ee;--line-strong:#cfd6df;--field-line:#6b7684;--ink:#0f1722;--ink-2:#344051;--mut:#5b6573;--faint:#5f6977;--accent:#1a5fd0;--accent-hover:#164fae;--accent-soft:#e8f0fe;--on-accent:#ffffff;--focus:#1a5fd0;--signal:#0f766e;--ok:#0a7d44;--ok-bg:#e7f7ee;--warn:#946300;--warn-bg:#fbf2dd;--bad:#b42318;--bad-bg:#fdecec;--unk:#6b46c1;--unk-bg:#f1eefc;--neutral:#5b6573;--neutral-bg:#f1f4f8;--on-status:#ffffff;--series-1:#1a5fd0;--series-2:#0e7490;--series-3:#a21caf;--series-4:#4338ca;--series-5:#4b5563;--shadow-1:0 1px 2px rgba(15,23,34,.05);--shadow-2:0 1px 2px rgba(15,23,34,.06),0 4px 12px rgba(15,23,34,.08);--shadow-3:0 4px 12px rgba(15,23,34,.08),0 16px 40px -8px rgba(15,23,34,.24);--scrim:rgba(15,23,34,.42);--edge-fade:rgba(0,0,0,.2);--surface2:var(--surface-2);--line2:var(--line-strong);--accent2:var(--accent-hover);--shadow:var(--shadow-1);color-scheme:light}
/* @tokens end */

/* ------------------------------------------------------------ base layer
   Element rules sit inside :where() (no specificity), so any page rule wins. */
:where(*,*::before,*::after){box-sizing:border-box}
:where(body){background:var(--bg);color:var(--ink);font:400 var(--fs-3)/var(--lh-3) var(--font);
-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
[hidden]{display:none!important}
:where(a){color:var(--accent);text-underline-offset:2px}
:where(p,li,dd,figcaption,.lead,.hint) :where(a:not([class])){text-decoration:underline}
:focus-visible{outline:2px solid var(--focus);outline-offset:2px}
:where(h1){font-size:var(--fs-5);line-height:var(--lh-5);font-weight:600;letter-spacing:-.012em}
:where(h2){font-size:var(--fs-4);line-height:var(--lh-4);font-weight:600;letter-spacing:-.006em}
:where(h3){font-size:var(--fs-3);line-height:var(--lh-3);font-weight:600}
:where(input:not([type=checkbox],[type=radio],[type=range],[type=file],[type=color],[type=submit],[type=button],[type=reset],[type=image],[type=hidden]),select,textarea){
background:var(--surface);color:var(--ink);border:1px solid var(--field-line);border-radius:var(--r-1);font:inherit}
:where(input,select,textarea):focus-visible{outline:2px solid var(--focus);outline-offset:1px}
/* 3.0.1 round 2 (R-20): a placeholder is italic, so it never reads as a
   value saved in the field */
:where(input,textarea)::placeholder{color:var(--mut);opacity:1;font-style:italic}
:where(input[type=checkbox],input[type=radio],input[type=range]){accent-color:var(--accent)}
:where(code,kbd,samp){font-family:var(--mono)}
:where(table){border-collapse:collapse}
:where(th){color:var(--mut);font-weight:500}
::selection{background:var(--accent-soft);color:var(--ink)}

/* Utilities */
.rl-num,.num{font-variant-numeric:tabular-nums}
/* a handle reads as stored: no contextual alternate turns "8x8" into a
   multiplication sign (2.133.1, R331-VIS-27) */
.rl-id{font-feature-settings:"ss02","tnum","calt" 0}
.rl-mono,.mono{font-family:var(--mono)}
.rl-mut{color:var(--mut)}
.rl-ink2{color:var(--ink-2)}
.rl-small{font-size:var(--fs-1);line-height:var(--lh-1)}
.rl-nw{white-space:nowrap}
/* A reminder a state's law prompts, on a form or a record (3.1.2, V-9): set
   apart from the form's hints, and never a warning's color. */
.rl-remind{margin:8px 0 12px;padding:8px 0 8px 12px;border-left:3px solid var(--accent)}
.rl-remind-h{margin:0 0 4px;font-weight:600;color:var(--ink)}
.rl-remind-say{margin:0 0 8px;color:var(--ink);font-size:var(--fs-3);line-height:var(--lh-3)}
.rl-vh{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.rl-skip{position:absolute;left:8px;top:-60px;z-index:100;background:var(--accent);color:var(--on-accent);padding:8px 12px;border-radius:var(--r-1);font-weight:500}
.rl-skip:focus{top:8px}

/* ----------------------------------------------- compatibility (old classes)
   The family every page wrote for itself, on the tokens: the dark primary now
   carries --on-accent (5.86:1, was white at 3.25), edges are --line-strong,
   inputs --field-line. Normal specificity, so the page's own rule of the same
   name (later in the document) still wins until it is deleted. */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:7px 14px;
border:1px solid var(--line-strong);border-radius:var(--r-1);background:var(--surface);color:var(--ink);
font-family:inherit;font-size:var(--fs-3);font-weight:500;line-height:20px;cursor:pointer;
text-decoration:none;white-space:nowrap;transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease)}
.btn:hover{background:var(--surface-2);border-color:var(--field-line)}
.btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover);color:var(--on-accent)}
.btn.sm,.btn.small{padding:5px 10px;font-size:var(--fs-2)}
.btn:disabled,.btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2);box-shadow:var(--shadow-1);padding:var(--pad)}
.hint{color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1)}
.err{color:var(--bad)}

/* ------------------------------------------------------------------- icons
   One sprite, /rlicons.svg (ICONS.md); the glyph takes its word's color. */
.rl-i{width:16px;height:16px;flex:none;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;vertical-align:-3px}
.rl-i-20{width:20px;height:20px;stroke-width:1.75}
.rl-i-24{width:24px;height:24px;stroke-width:1.5}
.rl-glyph{width:12px;height:12px;flex:none;fill:none;stroke:currentColor}

/* ----------------------------------------------------------------- buttons */
.rl-btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;height:var(--ctl);padding:0 14px;
border-radius:var(--r-1);border:1px solid var(--line-strong);background:var(--surface);color:var(--ink);
font:500 var(--fs-3)/1 var(--font);cursor:pointer;white-space:nowrap;text-decoration:none!important;
transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease)}
.rl-btn:hover{background:var(--surface-2);border-color:var(--field-line)}
.rl-btn.primary{background:var(--accent);border-color:var(--accent);color:var(--on-accent)}
.rl-btn.primary:hover{background:var(--accent-hover);border-color:var(--accent-hover)}
.rl-btn.ghost{border-color:transparent;background:transparent;color:var(--ink-2)}
.rl-btn.ghost:hover{background:var(--surface-2);color:var(--ink)}
.rl-btn.danger{background:var(--bad);border-color:var(--bad);color:var(--on-status)}
.rl-btn.sm{height:32px;padding:0 10px;font-size:var(--fs-2)}
.rl-btn:disabled,.rl-btn[aria-disabled="true"]{opacity:.55;cursor:not-allowed}
.rl-btn .rl-i{vertical-align:0}
.rl-link{background:none;border:0;padding:0;color:var(--accent);font:inherit;cursor:pointer}
.rl-link:hover{text-decoration:underline;text-underline-offset:2px}
.rl-iconbtn{display:inline-grid;place-items:center;width:32px;height:32px;padding:0;border-radius:var(--r-1);border:0;background:transparent;color:var(--ink-2);cursor:pointer;position:relative}
.rl-iconbtn:hover{background:var(--surface-2);color:var(--ink)}
.rl-iconbtn[data-tip]:hover::after,.rl-iconbtn[data-tip]:focus-visible::after{content:attr(data-tip);position:absolute;top:calc(100% + 6px);right:0;z-index:80;white-space:nowrap;padding:4px 8px;border-radius:var(--r-1);background:var(--ink);color:var(--surface);font:500 var(--fs-1)/var(--lh-1) var(--font);pointer-events:none}
.rl-kbd{font:500 var(--fs-1)/var(--lh-1) var(--font);padding:0 5px;border:1px solid var(--line-strong);border-bottom-width:2px;border-radius:5px;color:var(--mut);background:var(--surface)}

/* ------------------------------------------------- state badge (RLState)
   Tone and shape together, never color alone (DESIGN-DIRECTION 7.1). */
.rl-state{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px 0 6px;border-radius:var(--r-1);border:1px solid;
font:500 var(--fs-1)/var(--lh-1) var(--font);white-space:nowrap;vertical-align:middle;flex:none}
.rl-state .rl-glyph{width:12px;height:12px}
.rl-state.lg{height:28px;padding:0 10px 0 8px;font-size:var(--fs-2);gap:8px}
.rl-state.lg .rl-glyph{width:14px;height:14px}
.rl-t-ok{color:var(--ok);background:var(--ok-bg);border-color:color-mix(in srgb,var(--ok) 38%,transparent)}
.rl-t-warn{color:var(--warn);background:var(--warn-bg);border-color:color-mix(in srgb,var(--warn) 40%,transparent)}
.rl-t-bad{color:var(--bad);background:var(--bad-bg);border-color:color-mix(in srgb,var(--bad) 38%,transparent)}
.rl-t-unk{color:var(--unk);background:var(--unk-bg);border-color:color-mix(in srgb,var(--unk) 60%,transparent);border-style:dashed}
.rl-t-neutral{color:var(--ink-2);background:var(--neutral-bg);border-color:var(--line-strong)}
.rl-t-neutral .rl-glyph{color:var(--mut)}
.rl-tag{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 8px;border-radius:var(--r-1);border:1px solid var(--line-strong);
background:transparent;color:var(--ink-2);font:500 var(--fs-1)/var(--lh-1) var(--font);white-space:nowrap;vertical-align:middle}
.rl-tag .rl-i{width:14px;height:14px;color:var(--mut);vertical-align:0}
.rl-why{color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-state+.rl-why,.rl-state+.rl-word+.rl-why{margin-left:6px}
.rl-table .rl-state+.rl-why{margin-left:0}
.rl-count{display:inline-flex;align-items:center;justify-content:center;min-width:22px;height:20px;padding:0 6px;border-radius:var(--r-pill);
border:1px solid var(--line);background:var(--surface-2);color:var(--ink);font:600 var(--fs-1)/1 var(--font);font-variant-numeric:tabular-nums}
.rl-count.zero{color:var(--mut);font-weight:500}
.rl-count .rl-glyph{width:12px;height:12px;margin-right:4px}
.rl-count.rl-t-ok .rl-glyph{color:var(--ok)}.rl-count.rl-t-warn .rl-glyph{color:var(--warn)}.rl-count.rl-t-bad .rl-glyph{color:var(--bad)}.rl-count.rl-t-unk .rl-glyph{color:var(--unk)}
.rl-count[class*="rl-t-"]{color:var(--ink);background:var(--surface-2);border:1px solid var(--line)}

/* ------------------------------------------------------------ page header */
/* The page owns its padding (M-59, R33-VIS-15, DESIGN-DIRECTION 5): 32 px
   at 1280 and up, 24 from 720, 16 under 720, so every title starts at the
   same edge. A page puts rl-page on its main and drops its own padding; a
   .rl-page still inside a padded .wrap draws none of its own meanwhile. */
.rl-page{max-width:1440px;margin:0 auto;padding:var(--sp-6) var(--sp-6) var(--sp-7)}
.wrap>.rl-page{padding:0}
.rl-page.record{max-width:1240px}
.rl-page.narrow{max-width:1080px}
.rl-pagehead{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:20px}
.rl-pagehead h1{margin:0}
/* 120ch, not 76ch (owner, 3.0.0): a page's lead is one sentence, so on a desktop
   it stays on one line; a longer paragraph is still capped. */
.rl-pagehead .lead{margin:4px 0 0;color:var(--ink-2);max-width:120ch}
.rl-how{margin-top:4px;font-size:var(--fs-2);line-height:var(--lh-2);color:var(--ink-2)}
.rl-how>summary{cursor:pointer;color:var(--accent);width:max-content;list-style:none}
.rl-how>summary::-webkit-details-marker{display:none}
.rl-asof{margin-top:2px;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end;flex:none}

/* ---------------------------------------------------------- record header */
.rl-recordhead{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2);box-shadow:var(--shadow-1);margin-bottom:20px}
.rl-recordhead .top{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;padding:20px}
.rl-recordhead .name{display:flex;align-items:center;gap:10px;min-width:0}
.rl-recordhead .name .rl-i-20{color:var(--mut)}
.rl-recordhead h1{margin:0;font-size:var(--fs-6);line-height:var(--lh-6);letter-spacing:-.016em}
.rl-recordhead .ident{margin-top:4px;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-recordhead .badges{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px}
.rl-recordhead .badges>div{display:flex;align-items:center;gap:8px;min-width:0}
/* RLRecordHead (2.133.2, D-8, M-22): the one record header; a page holds
   no .rl-recordhead rule of its own. Badge rows are labeled when more than
   one reading is shown; the why reads after the badge. */
.rl-recordhead .who{min-width:0;flex:1 1 auto}
.rl-recordhead .name .glyph,.rl-recordhead .rl-rh-glyph{display:inline-flex;flex:none;color:var(--mut)}
.rl-recordhead .ident{display:flex;flex-wrap:wrap;gap:4px 8px;align-items:center}
.rl-recordhead .ident a{color:var(--accent)}
.rl-recordhead .badges:has(.lbl){flex-direction:column;align-items:flex-start;gap:10px}
.rl-recordhead .badges>div{flex-wrap:wrap;align-items:flex-start}
.rl-recordhead .badges .lbl{color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-2);min-width:140px}
.rl-recordhead .since{margin:10px 0 0;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2);max-width:76ch}
.rl-recordhead .rl-rh-extra{margin-top:12px}
.rl-recordhead [hidden]{display:none}
/* One figure size for numbers and words (2.133.2, L-32, VIS-16); a zero and
   a fact not recorded read in --mut. */
.rl-recordhead .rl-facet .v .z,.rl-recordhead .rl-facet .v.zero{color:var(--mut)}
.rl-recordhead .rl-facet.na .v{color:var(--mut)}
@media (max-width:1079px){.rl-recordhead .top{flex-direction:column;gap:12px}.rl-recordhead .rl-actions{flex-wrap:wrap;justify-content:flex-start}}
.rl-facets{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border-top:1px solid var(--line)}
.rl-facet{padding:14px 20px;border-left:1px solid var(--line);min-width:0}
.rl-facet:first-child{border-left:0}
.rl-facet .v{font:600 var(--fs-5)/var(--lh-5) var(--font);font-variant-numeric:tabular-nums}
.rl-facet .v small{font:400 var(--fs-2)/var(--lh-2) var(--font);color:var(--mut);margin-left:2px}
.rl-facet .l{font-weight:500;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-facet .b{color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1)}
.rl-facet .v .rl-cell1{max-width:none;white-space:normal}

/* ------------------------------------------------- cards, tiles, sections */
.rl-card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2);box-shadow:var(--shadow-1);min-width:0}
.rl-card-h{display:flex;align-items:center;justify-content:space-between;gap:12px;min-height:48px;padding:12px var(--pad);border-bottom:1px solid var(--line)}
.rl-card-h h2,.rl-card-h h3{margin:0;font:600 var(--fs-3)/var(--lh-3) var(--font);letter-spacing:0}
.rl-card-h .sub{color:var(--mut);font-size:var(--fs-2)}
.rl-card-b{padding:var(--pad)}
.rl-card-f{padding:10px var(--pad);border-top:1px solid var(--line);color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-grid{display:grid;gap:16px}
.rl-sec{margin-top:28px}
.rl-sec-h{display:flex;align-items:baseline;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.rl-sec-h h2{margin:0}
.rl-sec-h .sub{color:var(--mut);font-size:var(--fs-2)}
.rl-stat{display:block;padding:16px;color:var(--ink);text-decoration:none!important;border:1px solid var(--line);border-radius:var(--r-2);
background:var(--surface);box-shadow:var(--shadow-1);transition:border-color var(--t-fast) var(--ease)}
a.rl-stat:hover{border-color:var(--field-line)}
.rl-stat .v{font:600 var(--fs-6)/var(--lh-6) var(--font);font-variant-numeric:tabular-nums;letter-spacing:-.016em}
.rl-stat .v small{font:500 var(--fs-3)/var(--lh-3) var(--font);color:var(--mut);letter-spacing:0;margin-left:2px}
.rl-stat .l{margin-top:2px;font-weight:500}
.rl-stat .b{margin-top:2px;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-stat.na .v{color:var(--mut)}
.rl-kv{display:grid;grid-template-columns:minmax(120px,max-content) 1fr;gap:6px 16px;margin:0;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-kv dt{color:var(--mut)}
.rl-kv dd{margin:0;color:var(--ink);min-width:0}

/* ----------------------------------------------------- exception cards */
/* .rl-exc is a band (decision 616): the .rl-band block below */
.rl-ex{position:relative;display:flex;flex-direction:column;gap:8px;padding:14px 16px 14px 19px;background:var(--surface);border:1px solid var(--line);
border-radius:var(--r-2);box-shadow:var(--shadow-1);overflow:hidden;min-width:0}
.rl-ex::before{content:"";position:absolute;left:0;top:0;bottom:0;width:3px;background:var(--tone,var(--line-strong))}
.rl-ex.bad{--tone:var(--bad)}.rl-ex.warn{--tone:var(--warn)}.rl-ex.unk{--tone:var(--unk)}.rl-ex.neutral{--tone:var(--line-strong)}
.rl-ex .top{display:flex;align-items:flex-start;justify-content:space-between;gap:8px}
.rl-ex .head{display:flex;align-items:baseline;gap:8px;color:var(--ink);text-decoration:none!important;min-width:0}
.rl-ex .head .n{font:600 var(--fs-6)/var(--lh-6) var(--font);font-variant-numeric:tabular-nums;letter-spacing:-.016em}
.rl-ex .head .t{font:500 var(--fs-3)/var(--lh-3) var(--font)}
.rl-ex a.head:hover .t{text-decoration:underline;text-underline-offset:2px}
.rl-ex ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:6px}
.rl-ex li{color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-ex li b{color:var(--ink);font-weight:600}
.rl-ex .act{margin-top:auto;padding-top:2px;display:flex;gap:16px;flex-wrap:wrap;font-size:var(--fs-2)}
.rl-allclear{display:flex;align-items:center;gap:8px;margin-top:12px;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-allclear .rl-glyph{color:var(--ok)}
/* RLExceptions (M-05 .1): the head is a heading holding one link, the badge
   after it; record names in --ink 600, the reason in --ink-2. */
.rl-ex-h{margin:0;font:inherit;letter-spacing:0;min-width:0}
.rl-ex:has(.top>.rl-why) .top{flex-wrap:wrap}
.rl-ex .top>.rl-why{flex-basis:100%;order:3;margin:0}
.rl-ex .head .na{align-self:center;color:var(--mut);font-size:var(--fs-2)}
.rl-ex .rec{color:var(--ink);font-weight:600;text-decoration:none}
/* a record link is underlined at rest, not told by weight alone (2.133.1,
   R331-A11Y-23, WCAG 1.4.1) */
.rl-ex a.rec,.rl-bars a.rec{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:2px;
text-decoration-color:color-mix(in srgb,currentColor 45%,transparent)}
.rl-ex a.rec:hover{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.rl-ex-note{margin:0;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-exc+.rl-also,.rl-exc+.rl-allclear,.rl-band+.rl-also,.rl-band+.rl-allclear{margin-top:12px}
/* a page whose wrapper is the grid itself: the lines after the cards span it (H-11) */
.rl-exc>.rl-also,.rl-exc>.rl-allclear{grid-column:1/-1}
.rl-also{margin:12px 0 0;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-also+.rl-allclear{margin-top:8px}

/* ------------------------------------------- figure per record (RLBars)
   One drawing for hours per aircraft (M-55 .1): name and identity, the bar,
   the figure with its unit, tabular, never monospace. */
.rl-bars{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:8px}
.rl-bars li{display:grid;grid-template-columns:minmax(96px,32%) minmax(48px,1fr) minmax(64px,max-content);align-items:center;gap:12px;min-width:0}
.rl-bars .nm{display:flex;flex-direction:column;min-width:0}
.rl-bars .rec{color:var(--ink);font-weight:600;font-size:var(--fs-2);line-height:var(--lh-2);text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-bars a.rec:hover{color:var(--accent);text-decoration:underline;text-underline-offset:2px}
.rl-bars .sub{color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.rl-bar{position:relative;display:block;height:8px;border-radius:0;background:var(--track);overflow:hidden}
.rl-bar>span{position:absolute;left:0;top:0;bottom:0;border-radius:0;background:var(--series-1)}
.rl-bar.unknown{background:transparent;border:1px dashed var(--field-line)}
.rl-bars .v{color:var(--ink);font:500 var(--fs-2)/var(--lh-2) var(--font);font-variant-numeric:tabular-nums;text-align:right;white-space:nowrap}
.rl-bars .v.na{color:var(--mut);font-weight:400}
.rl-bars-more,.rl-bars-empty{margin:8px 0 0;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}

/* -------------------------------------------------------- tables (RLTable) */
/* 3.0.1, P-02: the wrapper is no scroll box, so the head sticks to the page
   under the bar and the banner (--rl-sticky-top, set by ui.js). A table
   wider than its wrapper gets data-wide (ui.js RLTableFit): its own scroll
   box, the head pinned in it. data-box: inside another scroll box. The
   hidden caption stays placed inside the wrapper (position:relative). */
/* the head's offset: the sticky bar's height (ui.js) plus the sticky
   banner's (rlbar.js); 0 on a page with neither. --cell-max: RLCell's cut. */
:root{--rl-sticky-bar:0px;--rl-banner-h:0px;--rl-sticky-top:calc(var(--rl-sticky-bar) + var(--rl-banner-h));--cell-max:28ch}
.rl-tablewrap{position:relative;overflow:visible}
.rl-tablewrap[data-wide]{overflow:auto;max-height:calc(100dvh - var(--rl-sticky-top,0px) - 16px)}
.rl-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-table th{position:sticky;top:var(--rl-sticky-top,0px);z-index:1;height:36px;padding:0 12px;background:var(--surface-2);color:var(--mut);
font:500 var(--fs-1)/var(--lh-1) var(--font);text-align:left;white-space:nowrap;border-bottom:1px solid var(--line)}
.rl-table td{height:var(--row);padding:6px 12px;border-bottom:1px solid var(--line);vertical-align:middle;color:var(--ink)}
.rl-table th.n,.rl-table td.n{text-align:right;font-variant-numeric:tabular-nums}
[data-density="compact"] .rl-table td,.rl-table[data-density="compact"] td{height:32px;padding:4px 10px}
[data-density="compact"] .rl-table .sub,.rl-table[data-density="compact"] .sub{display:inline;margin-left:6px}
.rl-table tbody tr:hover td{background:color-mix(in srgb,var(--surface-2) 70%,transparent)}
.rl-table tbody tr:last-child td{border-bottom:0}
.rl-table .rec{color:var(--ink);font-weight:600;text-decoration:none}
.rl-table .rec:hover{color:var(--accent)}
.rl-table .sub{display:block;color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1);font-weight:400}
.rl-table .rl-why{display:block;font-size:var(--fs-1);line-height:var(--lh-1);margin-top:2px}
.rl-table tr.rl-stale td{color:var(--mut)}
.rl-table tr.rl-stale td:first-child{box-shadow:inset 3px 0 0 var(--line-strong)}
.rl-tablewrap[data-wide] .rl-table th,.rl-tablewrap[data-box] .rl-table th,.rl-table[data-box] th{top:0}
/* RLCell (3.0.1, P-01): one line per cell, number first, the sentence one
   press away */
.rl-cell{display:block;min-width:0}
.rl-cell1{display:inline-block;vertical-align:bottom;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--cell-max,28ch)}
.rl-cell1[class*="rl-t-"]{background:none;border:0;font-weight:500}
.rl-cell1 .rl-glyph{width:14px;height:14px;margin-right:4px;vertical-align:-2px}
.rl-cell2{display:block;color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--cell-max,28ch)}
.rl-cell-why{margin-left:6px;padding:0 2px;background:none;border:0;color:var(--accent);font:inherit;font-size:var(--fs-1);cursor:pointer;vertical-align:bottom;min-height:0}
.rl-cell-why:hover{text-decoration:underline;text-underline-offset:2px}
.rl-cell-why[aria-expanded="true"]{color:var(--ink-2)}
.rl-table tr.rl-detail td{height:auto;padding:8px 12px 10px;background:var(--surface-2);color:var(--ink-2);white-space:normal}
div.rl-detail{margin:4px 0 0;padding:8px 10px;background:var(--surface-2);color:var(--ink-2);border-radius:var(--r-1,4px);white-space:normal}
/* RLCounts (3.0.1, M-03): the number then its badge, never wrapped apart */
.rl-cnt{white-space:nowrap}
.rl-cnt .rl-num{font-weight:600;font-variant-numeric:tabular-nums}
.rl-counts.stack .rl-cnt{display:block}
.rl-counts.stack .rl-cnt+.rl-cnt{margin-top:4px}
.rl-counts.none{color:var(--mut)}
/* RLCap (3.0.1, P-02): the line under a capped record-page table */
.rl-cap{margin:8px 0 0;padding:0 12px;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-sort{display:inline-flex;align-items:center;gap:4px;border:0;background:none;padding:0;color:inherit;font:inherit;cursor:pointer}
th.n .rl-sort{flex-direction:row-reverse}
.rl-sort .rl-i{width:14px;height:14px;opacity:.6}
th:hover .rl-sort .rl-i,.rl-sort:focus-visible .rl-i,th[aria-sort="ascending"] .rl-sort .rl-i,th[aria-sort="descending"] .rl-sort .rl-i{opacity:1}
th[aria-sort="ascending"],th[aria-sort="descending"]{color:var(--ink)}
.rl-toolbar{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:12px var(--pad);border-bottom:1px solid var(--line)}
.rl-toolbar .grow{flex:1}
.rl-countline{color:var(--mut);font-size:var(--fs-2);white-space:nowrap}
/* The card view's sort, shown under 720 px only (M-24 .1, R33-A11Y-8). */
.rl-sortsel{display:none;align-items:center;gap:8px;color:var(--ink-2);font:500 var(--fs-2)/var(--lh-2) var(--font)}
.rl-sortsel .lab{flex:none;white-space:nowrap}
.rl-sortsel .rl-select{width:auto;min-width:0;max-width:100%}
.rl-viewline{display:flex;align-items:center;gap:8px;flex-wrap:wrap;padding:6px var(--pad);border-bottom:1px solid var(--line);
background:var(--surface-2);color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1)}
.rl-viewline code{color:var(--ink-2);font-size:var(--fs-1);overflow-wrap:anywhere}
.rl-seg{display:inline-flex;padding:2px;gap:2px;border-radius:var(--r-1);background:var(--track)}
/* 3.0.3 L17 (from L11): in dark the track (#161c24) is one step off the card
   (#151b23), so a segmented control or a bar on a card lost its track; an
   inset edge draws it in both themes' dark */
:root:not([data-theme="light"]) .rl-seg{box-shadow:inset 0 0 0 1px var(--line-strong)}
:root:not([data-theme="light"]) .rl-bar{box-shadow:inset 0 0 0 1px var(--line)}
.rl-seg button{display:inline-flex;align-items:center;gap:6px;height:28px;padding:0 8px;border:0;border-radius:5px;background:transparent;
color:var(--mut);font:500 var(--fs-1)/1 var(--font);cursor:pointer}
.rl-seg button[aria-pressed="true"]{background:var(--surface);color:var(--ink);box-shadow:var(--shadow-1),inset 0 -2px 0 var(--accent)}
/* dark, by attribute or by the system theme (3.0.2, L3, S1-21's form): the
   pressed choice is told by its fill, an edge and the accent underline */
:root:not([data-theme="light"]) .rl-seg button[aria-pressed="true"]{background:var(--overlay);color:var(--ink);box-shadow:inset 0 0 0 1px var(--line-strong),inset 0 -2px 0 var(--accent)}
.rl-pager{display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:8px var(--pad);color:var(--mut);font-size:var(--fs-2)}

/* --------------------------------------------------------- filter chips */
.rl-chip{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 10px;border:1px solid var(--line-strong);border-radius:var(--r-pill);
background:var(--surface);color:var(--ink-2);font:500 var(--fs-2)/1 var(--font);cursor:pointer;white-space:nowrap;text-decoration:none}
.rl-chip:hover{border-color:var(--field-line);color:var(--ink)}
.rl-chip[aria-pressed="true"]{background:var(--accent-soft);border-color:var(--accent);color:var(--ink)}
.rl-chip .c{color:var(--mut);font-variant-numeric:tabular-nums}
.rl-chip[aria-pressed="true"] .c{color:var(--ink)}
.rl-chip .rl-glyph{width:12px;height:12px}
.rl-chip .rl-glyph.ok{color:var(--ok)}.rl-chip .rl-glyph.warn{color:var(--warn)}.rl-chip .rl-glyph.bad{color:var(--bad)}.rl-chip .rl-glyph.unk{color:var(--unk)}

/* ------------------------------------------------------------------ tabs */
/* position:relative holds a tab count's visually hidden text inside the
   scroller, so the page never scrolls sideways (2.133.1, R331-A11Y-4, as
   .rl-tablewrap) */
.rl-tabs{position:relative;display:flex;gap:4px;border-bottom:1px solid var(--line);overflow-x:auto;scrollbar-width:none}
.rl-tabs a,.rl-tabs button,.rl-tab{display:inline-flex;align-items:center;gap:6px;height:40px;padding:0 12px;border:0;
border-bottom:2px solid transparent;background:none;color:var(--mut);font:500 var(--fs-2)/var(--lh-2) var(--font);white-space:nowrap;
text-decoration:none!important;cursor:pointer}
.rl-tabs a:hover,.rl-tabs button:hover,.rl-tab:hover{color:var(--ink)}
.rl-tabs [aria-current],.rl-tabs [aria-selected="true"]{color:var(--ink);border-bottom-color:var(--accent)}
/* 3.4.1: a tab RLTabs.show() hides is gone from the strip (the display
   rule above would draw it), and a tab's count sits after its label */
.rl-tabs [hidden]{display:none}
.rl-tabs .rl-count{height:18px;min-width:18px;font-size:var(--fs-1)}

/* ----------------------------------------------------------------- forms */
.rl-field{display:flex;flex-direction:column;gap:6px;min-width:0}
.rl-field>label,.rl-field .lab{font:500 var(--fs-2)/var(--lh-2) var(--font);color:var(--ink)}
.rl-field .hint{margin-top:-4px}
.rl-input,.rl-select,.rl-textarea{width:100%;height:var(--ctl);padding:0 10px;border:1px solid var(--field-line);border-radius:var(--r-1);
background:var(--surface);color:var(--ink);font:400 var(--fs-3)/var(--lh-3) var(--font)}
.rl-textarea{height:auto;min-height:80px;padding:8px 10px;resize:vertical}
.rl-input:focus-visible,.rl-select:focus-visible,.rl-textarea:focus-visible{outline:2px solid var(--focus);outline-offset:1px}
.rl-input::placeholder,.rl-textarea::placeholder{color:var(--mut)}
.rl-select{appearance:none;padding-right:30px;background-image:linear-gradient(45deg,transparent 50%,var(--mut) 50%),linear-gradient(135deg,var(--mut) 50%,transparent 50%);
background-position:calc(100% - 15px) 52%,calc(100% - 10px) 52%;background-size:5px 5px;background-repeat:no-repeat}
.rl-input.sm,.rl-select.sm{height:32px;width:auto;font-size:var(--fs-2)}
.rl-search{position:relative;display:inline-flex;align-items:center}
.rl-search .rl-i{position:absolute;left:10px;color:var(--mut);pointer-events:none}
.rl-search .rl-input{height:32px;padding-left:34px;font-size:var(--fs-2)}
.rl-input[aria-invalid="true"],.rl-select[aria-invalid="true"],.rl-textarea[aria-invalid="true"]{border-color:var(--bad);box-shadow:0 0 0 1px var(--bad)}
.rl-err{display:flex;align-items:flex-start;gap:6px;color:var(--bad);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-err .rl-glyph{margin-top:4px}
.rl-errsum{padding:12px 16px;border:1px solid var(--line);border-left:4px solid var(--bad);border-radius:var(--r-2);background:var(--bad-bg);color:var(--ink);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-errsum h2,.rl-errsum h3{margin:0 0 4px;font-size:var(--fs-3);line-height:var(--lh-3)}
.rl-errsum ul{margin:0;padding-left:18px}
.rl-check{display:flex;gap:10px;align-items:flex-start}
.rl-check input{width:18px;height:18px;margin:1px 0 0;accent-color:var(--accent);flex:none}
.rl-savebar{position:sticky;bottom:0;z-index:30;display:flex;align-items:center;justify-content:flex-end;gap:8px;padding:10px var(--pad);
background:var(--overlay);border-top:1px solid var(--line-strong);box-shadow:var(--shadow-2)}
.rl-savebar .msg{margin-right:auto;color:var(--ink-2);font-size:var(--fs-2)}

/* --------------------------------------------------------- drop target */
.rl-drop{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;padding:24px 16px;text-align:center;
border:1px dashed var(--field-line);border-radius:var(--r-2);background:var(--surface);color:var(--ink-2)}
.rl-drop.rl-drop-over{border-color:var(--accent);background:var(--accent-soft)}
.rl-drop input[type=file]{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);border:0}
/* One drop shape (2.133.2, D-12, M-29): glyph, title, formats, hint, button. */
.rl-drop{position:relative;min-height:160px;cursor:pointer}
.rl-drop.is-filled{border-style:solid;cursor:default}
.rl-drop.is-bad{border-color:var(--bad)}
.rl-drop-ico{display:inline-flex;color:var(--mut);line-height:0}
.rl-drop-title{font:600 var(--fs-3)/var(--lh-3) var(--font);color:var(--ink)}
.rl-drop-formats{font-size:var(--fs-2);line-height:var(--lh-2);color:var(--ink-2);max-width:60ch}
.rl-drop-hint{font-size:var(--fs-1);line-height:var(--lh-1);color:var(--mut);max-width:60ch}
.rl-drop-btn:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
.rl-drop-status{margin:8px 0 0;min-height:1.5em;font-size:var(--fs-2);line-height:var(--lh-2);color:var(--ink-2);overflow-wrap:anywhere}
.rl-drop-status.bad{color:var(--bad)}

/* -------------------------------------------------- gauges (RLGauge) */
.rl-gauge{min-width:0}
.rl-gauge-track{position:relative;height:8px;border-radius:var(--r-pill);background:var(--surface-2);box-shadow:inset 0 0 0 1px var(--field-line);overflow:hidden}
.rl-gauge-fill{position:absolute;left:0;top:0;bottom:0;border-radius:var(--r-pill);background:var(--accent)}
.rl-gauge-fill.rl-t-ok{background:var(--ok)}.rl-gauge-fill.rl-t-warn{background:var(--warn)}.rl-gauge-fill.rl-t-bad{background:var(--bad)}
.rl-gauge-fill.rl-t-unk,.rl-gauge-fill.rl-t-neutral{background:var(--field-line)}
.rl-gauge-tick{position:absolute;top:0;bottom:0;width:2px;background:var(--ink)}
.rl-gauge-track.unknown{background:transparent;box-shadow:none;border:1px dashed var(--field-line)}
.rl-gaugeline{display:flex;justify-content:space-between;gap:8px;margin-top:4px;color:var(--ink-2);font-size:var(--fs-1);line-height:var(--lh-1)}
.rl-ring{width:44px;height:44px;flex:none}
.rl-ring .track{fill:none;stroke:var(--surface-2);stroke-width:5}
.rl-ring .fill{fill:none;stroke:var(--tone,var(--accent));stroke-width:5;stroke-linecap:round}
.rl-ring text{fill:var(--ink);font:600 12px var(--font);font-variant-numeric:tabular-nums}
.rl-ring .fill.rl-t-ok,.rl-ring.ok{--tone:var(--ok)}.rl-ring .fill.rl-t-warn,.rl-ring.warn{--tone:var(--warn)}.rl-ring .fill.rl-t-bad,.rl-ring.bad{--tone:var(--bad)}
.rl-ring .fill[class*="rl-t-"]{background:none;border:0}

/* ----------------------------------------- banner messages (RLBanner)
   The region is the shell's #rl-banner.rl-banner; each message is .rl-msg. */
.rl-msg{display:flex;align-items:center;gap:12px;min-height:44px;padding:8px 16px 8px 12px;border-left:4px solid var(--tone,var(--accent));
border-bottom:1px solid var(--line);background:var(--tint,var(--accent-soft));color:var(--ink);font:400 var(--fs-2)/var(--lh-2) var(--font)}
.rl-msg>.rl-glyph,.rl-msg>.rl-i{width:16px;height:16px;flex:none;color:var(--tone,var(--accent))}
.rl-msg.bad{--tone:var(--bad);--tint:var(--bad-bg)}
.rl-msg.warn{--tone:var(--warn);--tint:var(--warn-bg)}
.rl-msg.info{--tone:var(--accent);--tint:var(--accent-soft)}
.rl-msg.ok{--tone:var(--ok);--tint:var(--ok-bg)}
.rl-msg .txt{flex:1;min-width:0}
.rl-msg .txt b{font-weight:600}
.rl-msg-act{flex:none;font-weight:500}
.rl-msg-step{display:flex;align-items:center;gap:2px;color:var(--ink-2);font-size:var(--fs-1);white-space:nowrap;font-variant-numeric:tabular-nums}
.rl-msg-step .rl-iconbtn{width:28px;height:28px}
.rl-msg-x{flex:none}
.rl-note{display:flex;align-items:flex-start;gap:10px;padding:10px 12px;border:1px solid var(--line);border-left:4px solid var(--tone,var(--accent));
border-radius:var(--r-1);background:var(--tint,var(--accent-soft));color:var(--ink);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-def{margin:8px 0 0;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}.rl-def b{color:var(--ink-2);font-weight:600}
.rl-note.bad{--tone:var(--bad);--tint:var(--bad-bg)}.rl-note.warn{--tone:var(--warn);--tint:var(--warn-bg)}.rl-note.ok{--tone:var(--ok);--tint:var(--ok-bg)}
.rl-note>.rl-glyph,.rl-note>.rl-i{margin-top:3px;color:var(--tone,var(--accent))}

/* ----------------------------------------------- toasts: success and info only */
.rl-toasts,#rl-toasts{position:fixed;left:50%;bottom:20px;transform:translateX(-50%);z-index:90;display:flex;flex-direction:column;gap:8px;width:min(480px,calc(100vw - 24px))}
.rl-toast{display:flex;align-items:center;gap:10px;padding:10px 8px 10px 14px;border:1px solid var(--line-strong);border-radius:var(--r-2);
background:var(--overlay);color:var(--ink);box-shadow:var(--shadow-3);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-toast .txt{flex:1;min-width:0}
.rl-toast-x{flex:none}
.rl-toast.ok>.rl-i,.rl-toast.ok>.rl-glyph{color:var(--ok)}
.rl-toast.info>.rl-i{color:var(--accent)}

/* ---------------------------------------------- empty and loading (RLEmpty) */
.rl-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:28px 16px;text-align:center;color:var(--mut)}
.rl-empty>.rl-i,.rl-empty>.rl-glyph{width:24px;height:24px}
.rl-empty h3,.rl-empty .rl-empty-h{margin:6px 0 0;color:var(--ink);font:600 var(--fs-4)/var(--lh-4) var(--font)}
.rl-empty p{margin:0;max-width:46ch;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-empty .rl-btn,.rl-empty .btn{margin-top:8px}
.rl-skel{display:block;height:12px;border-radius:var(--r-1);background:var(--surface-2);animation:rl-pulse 1.2s ease-in-out infinite alternate}
.rl-skel.row{height:var(--row);border-radius:0;margin-bottom:1px}
@keyframes rl-pulse{from{opacity:1}to{opacity:.6}}
.rl-loading{color:var(--mut);font-size:var(--fs-2)}

/* ------------------------------------------- menus, dialogs and sheets */
.rl-pop{position:absolute;z-index:60;min-width:220px;padding:6px;background:var(--overlay);border:1px solid var(--line-strong);border-radius:var(--r-2);box-shadow:var(--shadow-3)}
.rl-pop .sec{padding:6px 0;border-top:1px solid var(--line)}
.rl-pop .sec:first-child{border-top:0}
.rl-pop .lbl{padding:6px 10px 4px;color:var(--mut);font:500 var(--fs-1)/var(--lh-1) var(--font)}
.rl-mi{display:flex;align-items:center;gap:10px;width:100%;height:32px;padding:0 10px;border:0;border-radius:var(--r-1);background:transparent;
color:var(--ink);font:400 var(--fs-2)/var(--lh-2) var(--font);text-align:left;cursor:pointer;text-decoration:none!important;white-space:nowrap}
/* One line per item (3.4.4, decision 660); an item too long for a phone opts
   out with .wrap and grows to fit its lines. */
.rl-mi.wrap{white-space:normal;height:auto;min-height:32px;padding-top:6px;padding-bottom:6px}
.rl-mi:hover,.rl-mi:focus-visible{background:var(--surface-2)}
.rl-mi .rl-i{color:var(--mut)}
.rl-mi .aside{margin-left:auto;color:var(--mut);font-size:var(--fs-1)}
.rl-mi.danger{color:var(--bad)}
.rl-scrim{position:fixed;inset:0;z-index:65;background:var(--scrim)}
.rl-dialog{position:fixed;z-index:70;left:50%;top:14vh;transform:translateX(-50%);width:min(560px,calc(100vw - 24px));max-height:76vh;display:flex;flex-direction:column;
background:var(--overlay);border:1px solid var(--line-strong);border-radius:var(--r-2);box-shadow:var(--shadow-3);overflow:hidden;color:var(--ink)}
.rl-sheet{position:fixed;z-index:70;top:0;right:0;bottom:0;width:min(480px,100vw);display:flex;flex-direction:column;
background:var(--overlay);border-left:1px solid var(--line-strong);box-shadow:var(--shadow-3);color:var(--ink)}
.rl-dialog-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px 12px 12px 20px;border-bottom:1px solid var(--line)}
.rl-dialog-h h2{margin:0;font-size:var(--fs-4);line-height:var(--lh-4)}
.rl-dialog-b{padding:16px 20px;overflow:auto;font-size:var(--fs-3);line-height:var(--lh-3);
/* A soft edge at the foot while there is more below (3.1.3, V2-5): the first
   layer rides with the content and covers the second at the end. */
background:linear-gradient(to top,var(--overlay) 45%,transparent) bottom/100% 32px no-repeat local,
linear-gradient(to top,var(--edge-fade),transparent) bottom/100% 14px no-repeat scroll}
.rl-dialog-f{display:flex;justify-content:flex-end;gap:8px;flex-wrap:wrap;padding:12px 20px;border-top:1px solid var(--line)}
/* One sheet geometry (2.133.2, D-10, M-24): askSheet's box, and a page's
   own modal box given the class, take one header (RLSheet.head), labels
   above their fields and the buttons in the foot. */
.rl-ask{background:var(--overlay);color:var(--ink);border:1px solid var(--line-strong);border-radius:var(--r-2);box-shadow:var(--shadow-3);
width:100%;max-width:560px;max-height:90vh;overflow:auto;padding:0}
.rl-ask .rl-dialog-h{position:sticky;top:0;z-index:1;background:inherit}
.rl-ask .rl-dialog-h h2{margin:0;font-size:var(--fs-4);line-height:var(--lh-4)}
.rl-ask .rl-field{margin:0 0 12px}
.rl-ask .rl-field input,.rl-ask .rl-field select,.rl-ask .rl-field textarea{width:100%;box-sizing:border-box}
.rl-ask .rl-field textarea{min-height:64px;resize:vertical}
.rl-ask .rl-field[hidden]{display:none}
.rl-sheet-x{display:inline-flex;align-items:center;gap:6px}

/* ------------------------------------------------------- duty clock (RLClock) */
.rl-clock{display:inline-flex;align-items:center;gap:6px;min-height:22px;padding:1px 8px 1px 6px;border-radius:var(--r-1);border:1px solid var(--line-strong);
color:var(--ink-2);background:var(--neutral-bg);font:500 var(--fs-1)/var(--lh-1) var(--font);font-variant-numeric:tabular-nums}
.rl-clock.rl-t-bad{border-style:solid}
.rl-clock-rule{display:block;color:var(--mut);font-size:var(--fs-1);line-height:var(--lh-1)}
.rl-state .rl-word{min-width:0}
.rl-drop-btn{margin-top:4px}
.rl-causes{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-causes th{height:36px;padding:0 12px;background:var(--surface-2);color:var(--mut);font:500 var(--fs-1)/var(--lh-1) var(--font);text-align:left;border-bottom:1px solid var(--line)}
.rl-causes td{padding:8px 12px;border-bottom:1px solid var(--line);vertical-align:top}
.rl-causes tr:last-child td{border-bottom:0}

/* ------------------------------------------- forensics verdict card */
.rl-verdict{background:var(--surface);border:1px solid var(--line);border-radius:var(--r-2);box-shadow:var(--shadow-1);padding:20px}
.rl-verdict .headline{margin:0;font:600 var(--fs-5)/var(--lh-5) var(--font)}
.rl-verdict .when{margin-top:4px;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-verdict .conf{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:12px;color:var(--ink-2);font-size:var(--fs-2)}
.rl-verdict .limits{margin-top:12px;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-verdict .tiles{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-top:16px}

/* ------------------------------------------------------------ charts
   Series by token and by dash (R31-A11Y-18); status colors only on labeled
   thresholds. */
.rl-s1{color:var(--series-1);stroke:var(--series-1)}
.rl-s2{color:var(--series-2);stroke:var(--series-2);stroke-dasharray:var(--dash-2)}
.rl-s3{color:var(--series-3);stroke:var(--series-3);stroke-dasharray:var(--dash-3)}
.rl-s4{color:var(--series-4);stroke:var(--series-4);stroke-dasharray:var(--dash-4)}
.rl-s5{color:var(--series-5);stroke:var(--series-5);stroke-dasharray:var(--dash-5)}
.rl-legend{display:flex;flex-wrap:wrap;gap:4px 16px;color:var(--ink-2);font-size:var(--fs-1);line-height:var(--lh-1)}

/* ------------------------------------------- component parts (ds-b, U2) */
.rl-tableempty{border-top:1px solid var(--line)}
.rl-tableerr,.rl-staleline{display:flex;align-items:center;gap:8px;padding:8px var(--pad);border-bottom:1px solid var(--line);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-tableerr{color:var(--bad);background:var(--bad-bg)}
.rl-staleline{color:var(--ink-2);background:var(--warn-bg)}
.rl-toast.bad{border-left:4px solid var(--bad)}
.rl-toast.bad>.rl-glyph{color:var(--bad)}
.rl-msg-anchor{margin-left:8px;font-weight:500}
.rl-msg-act.primary{padding:4px 10px;border-radius:var(--r-1);background:var(--accent);color:var(--on-accent);text-decoration:none}
.rl-msg-n{font-variant-numeric:tabular-nums}
.rl-ringrow{display:flex;align-items:center;gap:12px;min-width:0}
.rl-skel.tile{height:96px;border-radius:var(--r-2)}
.rl-gauge-what{margin-top:4px;font-size:var(--fs-1);line-height:var(--lh-1);color:var(--ink-2)}
.rl-gauge-what>summary{cursor:pointer;color:var(--accent);width:max-content}
.rl-clock-left{font-variant-numeric:tabular-nums}
.rl-sortlabel{min-width:0}
.rl-sortglyph{display:inline-flex}
.rl-verdict .counts{display:flex;flex-wrap:wrap;gap:8px 16px;margin-top:12px;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-verdict .na{margin-top:8px;color:var(--mut);font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-statewrap{display:inline-flex;flex-wrap:wrap;align-items:center;gap:4px 8px;min-width:0}

/* ------------------------------------------------ 3.0.2 shared (lane S1)
   Contracts S1-01 to S1-23, docs/reviews/2026-10-30-panel-r302. */
/* Decision 616, the card band. Reverses S1-04, S1-05 and X-04 (cards ended at
   their content, a last card widened): every card in a band has one width
   and one height. .rl-exc and .rl-row are bands by default.
   Sizes: M 288 (a list: 3 records then "and N more"), .s 112 (a stat), .l 400
   (a chart, or a ranked list of 6), .sheet a full-width table or long list.
   minmax(floor,1fr) makes every row as tall as the tallest, so the height is
   a floor: a long name or 200 percent zoom grows the whole band and nothing
   clips. No spans inside a band; a part-filled last row keeps its empty slot
   and one card alone keeps its one third. Columns 3, 2, 1 at 1280 and 720.
   data-cols="2|4|6" sets the columns from 1280. */
.rl-band,.rl-exc,.rl-row{--p-h:288px;--p-cols:3;display:grid;gap:16px;align-items:stretch;
grid-template-columns:repeat(var(--p-cols),minmax(0,1fr));grid-auto-rows:minmax(var(--p-h),1fr)}
.rl-band.s{--p-h:112px}
.rl-band.l{--p-h:400px;--p-cols:2}
.rl-band.sheet{--p-h:0px;--p-cols:1;grid-auto-rows:auto}
.rl-band>*,.rl-exc>*,.rl-row>*{display:flex;flex-direction:column;min-width:0}
.rl-band>[hidden],.rl-exc>[hidden],.rl-row>[hidden]{display:none}
/* the band RLExceptions writes inside an .rl-exc wrapper stays a grid: the
   child rule above made it one stacked column of full-width cards */
.rl-exc>.rl-band{display:grid}
.rl-exc>.rl-also{display:block}
.rl-exc>.rl-allclear{flex-direction:row}
/* RLExceptions writes the cards in a band of their own when the wrapper is
   .rl-exc: the Also and zero lines under them must not take a band's row */
.rl-exc:has(>.rl-band),.rl-exc:has(>.rl-also),.rl-exc:has(>.rl-allclear){display:block}
/* the foot: "and N more" and the card's links, pinned to the bottom. Pin the
   foot by this class only, never :last-child, or a card's figures drop too */
.rl-foot{display:flex;flex-wrap:wrap;align-items:baseline;gap:4px 16px;margin-top:auto;padding-top:8px;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-foot a,.rl-foot .rl-link{color:var(--accent)}
.rl-foot span.more{color:var(--mut)}
@media (min-width:1280px){
.rl-band[data-cols="2"]{--p-cols:2}.rl-band[data-cols="4"]{--p-cols:4}.rl-band[data-cols="6"]{--p-cols:6}}
@media (max-width:1279px){
.rl-band,.rl-exc,.rl-row{--p-cols:2}
.rl-band.s{--p-cols:3}}
@media print{.rl-band,.rl-exc,.rl-row{--p-h:0px;grid-auto-rows:auto}}
/* a long headline puts its badge under it, never over a word; two badges
   stay together at the right, not one floating mid-card */
.rl-ex .top{flex-wrap:wrap;justify-content:flex-start}
.rl-ex .top>.rl-ex-h{margin-right:auto}
/* 3.0.3 L17 (daily Records LOW): one card of a row put "Act soon" under its
   headline and its neighbor beside it; the headline now wraps its own words
   and every badge stays at the top right, never over a word */
.rl-ex .top>.rl-ex-h{flex:1 1 0;min-width:0}
.rl-ex .top>.rl-state{flex:none}
/* the record layout: a main column and an aside, each a stack */
.rl-cols{display:grid;grid-template-columns:minmax(0,2fr) minmax(280px,1fr);gap:16px;align-items:start}
.rl-cols>*{display:flex;flex-direction:column;gap:16px;min-width:0}
@media (max-width:1079px){.rl-cols{grid-template-columns:minmax(0,1fr)}}
/* S1-02: number-first tiles. Decision 616: a stat band is size S, floor 112,
   gap 16, 12 on the phone */
.rl-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(180px,1fr));gap:16px;grid-auto-rows:minmax(112px,1fr)}
/* up to six tiles share one row from 1280 px, never five and a lone sixth
   (L7, live at 1440); from 720 px, up to four in a row and five or six in
   threes */
@media (min-width:1280px){
.rl-stats:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.rl-stats:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.rl-stats:has(>:nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}
.rl-stats:has(>:nth-child(5):last-child){grid-template-columns:repeat(5,minmax(0,1fr))}
.rl-stats:has(>:nth-child(6):last-child){grid-template-columns:repeat(6,minmax(0,1fr))}}
@media (min-width:720px) and (max-width:1279px){
.rl-stats:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}
.rl-stats:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.rl-stats:has(>:nth-child(4):last-child){grid-template-columns:repeat(4,minmax(0,1fr))}
.rl-stats:has(>:nth-child(5):last-child),.rl-stats:has(>:nth-child(6):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}}
.rl-stat .l{text-transform:none;letter-spacing:0}
.rl-stat.zero .v,.rl-stat.na .v{color:var(--mut)}
.rl-stat.na .v{font-size:var(--fs-4);line-height:var(--lh-6);font-weight:500;letter-spacing:0}
.rl-stat[data-tone] .v .rl-glyph{width:18px;height:18px;margin-right:6px;vertical-align:-1px}
.rl-stat[data-tone="bad"] .v{color:var(--bad)}.rl-stat[data-tone="warn"] .v{color:var(--warn)}
.rl-stat[data-tone="ok"] .v{color:var(--ok)}.rl-stat[data-tone="unk"] .v{color:var(--unk)}
/* S1-01: the charts fold under the lists they summarize */
.rl-trends{margin-top:28px}
.rl-trends-d>summary{display:flex;align-items:baseline;gap:8px;margin-bottom:12px;cursor:pointer;list-style:none;width:max-content;max-width:100%}
.rl-trends-d>summary::-webkit-details-marker{display:none}
.rl-trends-d>summary::before{content:"";align-self:center;width:7px;height:7px;margin-right:2px;border-right:2px solid var(--mut);border-bottom:2px solid var(--mut);transform:rotate(-45deg);transition:transform var(--t-fast) var(--ease)}
.rl-trends-d[open]>summary::before{transform:rotate(45deg)}
.rl-trends-h h2,.rl-trends-h h3{margin:0}
.rl-trends-h .sub{color:var(--mut);font-size:var(--fs-2)}
/* S1-06 and S1-10: names */
.rl-name-2{color:var(--mut);font-weight:400}
/* S1-08: the phone card's title row and its Details */
.rl-cardmore{display:none}
.rl-ex .rl-id,.rl-kv .rl-id{white-space:nowrap}
/* S1-14: a column holding one value on every row is said once above it */
.rl-uni-off{display:none!important}
/* 3.0.3 L17: the line keeps the cells' inset and a gap above the head, in a
   flush card as in a padded one; it never touches the card edge */
.rl-uniform{margin:0 0 4px;padding:10px 12px 6px;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
/* S1-18: a strip that scrolls fades on the side that has more */
.rl-chips{display:flex;align-items:center;gap:8px;overflow-x:auto;scrollbar-width:none}
.rl-tabs::-webkit-scrollbar,.rl-chips::-webkit-scrollbar{display:none}
.rl-tabs[data-more="end"],.rl-chips[data-more="end"]{-webkit-mask-image:linear-gradient(to right,black calc(100% - 40px),transparent);mask-image:linear-gradient(to right,black calc(100% - 40px),transparent)}
.rl-tabs[data-more="start"],.rl-chips[data-more="start"]{-webkit-mask-image:linear-gradient(to left,black calc(100% - 40px),transparent);mask-image:linear-gradient(to left,black calc(100% - 40px),transparent)}
.rl-tabs[data-more="both"],.rl-chips[data-more="both"]{-webkit-mask-image:linear-gradient(to right,transparent,black 40px,black calc(100% - 40px),transparent);mask-image:linear-gradient(to right,transparent,black 40px,black calc(100% - 40px),transparent)}
.rl-stripsel{display:none}
/* S1-19: a card's rule is one press away under its headline */
.rl-ex-whybtn{align-self:flex-start;font-size:var(--fs-2);line-height:var(--lh-2)}
.rl-ex-why{margin:0;color:var(--ink-2);font-size:var(--fs-2);line-height:var(--lh-2)}
/* S1-20: the one Filters panel, a drop panel here and a sheet on the phone */
.rl-filters:not(.open){display:none}
.rl-filters.open{position:fixed;z-index:60;width:min(380px,calc(100vw - 16px));max-height:min(70vh,560px);overflow:auto;padding:4px 16px 16px;
background:var(--overlay);border:1px solid var(--line-strong);border-radius:var(--r-2);box-shadow:var(--shadow-3);color:var(--ink)}
.rl-filters-h{display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 0;margin-bottom:4px}
.rl-filters-h h2{margin:0;font-size:var(--fs-3);line-height:var(--lh-3)}
.rl-filters .rl-field{margin-bottom:12px}
.rl-filters-scrim{position:fixed;inset:0;z-index:65;background:var(--scrim)}
.rl-filters.open.sheet{top:auto!important;left:0!important;right:0;bottom:0;z-index:70;width:100vw;max-height:85vh;border-radius:var(--r-2) var(--r-2) 0 0;border-width:1px 0 0}
.rl-filters.sheet .rl-filters-h{position:sticky;top:-4px;z-index:1;background:var(--overlay)}
/* S1-21: a disabled button reads as disabled in dark, primary or not */
:root:not([data-theme="light"]) :is(.rl-btn,.btn):is(:disabled,[aria-disabled="true"]){background:var(--surface-2);border-color:var(--line);color:var(--mut);opacity:1;box-shadow:none}
/* and in light (3.0.2 integration): a disabled primary was still blue at
   reduced opacity; it takes the same grey fill, a visible edge and muted text */
[data-theme="light"] :is(.rl-btn,.btn):is(:disabled,[aria-disabled="true"]){background:var(--surface-2);border-color:var(--line-strong);color:var(--mut);opacity:1;box-shadow:none}

/* ---------------------------------------------------------- responsive */
@media (max-width:1279px){.rl-page{padding:var(--sp-5) var(--sp-5) var(--sp-7)}.wrap>.rl-page{padding:0}
.rl-facets{grid-template-columns:repeat(2,minmax(0,1fr))}
.rl-facet:nth-child(odd){border-left:0}.rl-facet:nth-child(n+3){border-top:1px solid var(--line)}}
@media (max-width:719px){
.rl-page{padding:var(--sp-4) var(--sp-4) var(--sp-7)}.wrap>.rl-page{padding:0}
.rl-sortsel{display:inline-flex}
.rl-bars li{grid-template-columns:minmax(88px,38%) minmax(32px,1fr) minmax(56px,max-content);gap:8px}
.rl-pagehead,.rl-recordhead .top{flex-direction:column;gap:12px}
.rl-recordhead .top{padding:16px}.rl-recordhead h1{font-size:var(--fs-5);line-height:var(--lh-5)}.rl-recordhead .rl-actions{width:100%}
.rl-actions{justify-content:flex-start}
.rl-actions .primary{order:-1}
.rl-btn{min-height:40px}
.rl-iconbtn{width:40px;height:40px}
.rl-table.rl-cards thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.rl-table.rl-cards,.rl-table.rl-cards tbody,.rl-table.rl-cards tr,.rl-table.rl-cards td{display:block;width:100%}
.rl-table.rl-cards tr{padding:10px 12px;border-bottom:1px solid var(--line)}
.rl-table.rl-cards td{height:auto;padding:2px 0;border:0;text-align:left!important}
.rl-table.rl-cards .rl-cell1,.rl-table.rl-cards .rl-cell2{white-space:normal;overflow:visible;max-width:none}
.rl-table.rl-cards tr.rl-detail{padding:8px 12px;background:var(--surface-2)}
.rl-table.rl-cards tr.rl-detail td{background:none;padding:0}
/* 3.0.2 (X-08): the label is a column of its own and the whole value sits
   in the other, so a wrapped value never runs back under its label */
.rl-table.rl-cards td[data-label]{display:table;table-layout:fixed;width:100%}
.rl-table.rl-cards td[data-label]::before{content:attr(data-label);display:table-cell;width:38%;padding-right:8px;vertical-align:top;color:var(--mut);font-size:var(--fs-1);overflow-wrap:anywhere}
.rl-table.rl-cards .rl-cell{display:inline}
.rl-dialog{top:auto;bottom:0;transform:translateX(-50%);width:100vw;max-height:90vh;border-radius:var(--r-2) var(--r-2) 0 0}
/* 3.0.2 lane S1 (S1-02, S1-08, S1-18) */
.rl-stats{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;grid-auto-rows:auto}
/* decision 616: one column at natural height, stats in pairs */
.rl-band,.rl-exc,.rl-row,.rl-band.s,.rl-band.l{--p-cols:1;--p-h:0px;gap:12px;grid-auto-rows:auto}
.rl-band.s{--p-cols:2}
.rl-ex .top{flex-wrap:wrap}
.rl-ex li.cut{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.rl-kv{grid-template-columns:minmax(96px,40%) minmax(0,1fr)}
.rl-sa-more{margin-left:calc(40% + 16px)}
.rl-sa-rows{margin-top:8px}
.rl-table.rl-cards tr td[data-card="head"]{display:flex;flex-wrap:wrap;align-items:baseline;justify-content:flex-start;gap:4px 8px;padding-bottom:4px;font-weight:600}
.rl-table.rl-cards tr td[data-card="head"]::before{content:none}
.rl-table.rl-cards tr td[data-card="head"] .rl-id{white-space:nowrap;flex:none}
.rl-table.rl-cards[data-compact] tr:not([data-open]) td[data-card="more"]{display:none}
.rl-table.rl-cards[data-compact] .rl-cardmore{display:inline-flex;margin-left:auto;font-size:var(--fs-2);font-weight:500}
.rl-stripsel{display:block;width:100%;margin-bottom:8px}
[data-phone="select"][data-stripsel]{display:none}
/* A banner on the phone (3.0.2, L15): the sentence takes the full width
   beside its glyph, and the action, the pager and the close go on the line
   under it, never a one-word column beside them. */
.rl-msg{flex-wrap:wrap;row-gap:4px}
.rl-msg .txt{flex:1 1 calc(100% - 28px)}
.rl-msg>.rl-msg-act,.rl-msg>.rl-msg-anchor{margin-left:28px}
.rl-msg>.rl-msg-act~.rl-msg-act,.rl-msg>.rl-msg-act~.rl-msg-anchor,.rl-msg>.rl-msg-anchor~.rl-msg-anchor{margin-left:8px}
.rl-msg-step{margin-left:auto}
.rl-msg:has(.rl-msg-x):not(:has(.rl-msg-act,.rl-msg-anchor,.rl-msg-step)) .txt{flex-basis:calc(100% - 84px)}
}
@media (pointer:coarse){.rl-btn,.rl-input,.rl-select{min-height:44px}
/* 3.0.3: the Why's 44 px target is a hit area of its own (::after, placed
   over the word), so it adds nothing to the line: on a phone card the value
   stays level with its label (L17's padding and negative margins pushed the
   value 10 to 22 px off its label, RECHECK-303 crosscheck R1) */
.rl-cell-why{position:relative;vertical-align:baseline}
.rl-cell-why::after{content:"";position:absolute;left:50%;top:50%;width:44px;height:44px;transform:translate(-50%,-50%)}
.rl-table.rl-cards .rl-cell1{vertical-align:baseline}.rl-iconbtn{width:44px;height:44px}
.rl-tabs a,.rl-tabs button,.rl-tab,.rl-chip,.rl-seg button,.rl-sort{min-height:44px}
.rl-msg-step .rl-iconbtn{width:44px;height:44px}
.console input,.console select,.console button{min-height:44px}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{transition-duration:.01ms!important;animation-duration:.01ms!important;
animation-iteration-count:1!important;scroll-behavior:auto!important}.rl-skel{animation:none}}
@media (forced-colors:active){.rl-state,.rl-tag,.rl-chip{border-color:CanvasText}.rl-ex::before,.rl-msg,.rl-note{forced-color-adjust:auto}}

/* ------------------------------------------------ 3.0.4 shared (lane shared)
   Rows F-45 to F-51, docs/reviews/2026-10-31-panel-r304/LIST.md. */
/* F-45: a record's facets lead an odd count with the first across the row
   below 1280 px. Stat tiles no longer do: decision 616, no spans in a band,
   and a part-filled last row keeps its empty slot */
@media (max-width:1279px){
.rl-facets:has(>:last-child:nth-child(odd):not(:first-child))>.rl-facet:first-child{grid-column:1/-1}
.rl-facets:has(>:last-child:nth-child(odd):not(:first-child))>.rl-facet:nth-child(n+2){border-top:1px solid var(--line)}
.rl-facets:has(>:last-child:nth-child(odd):not(:first-child))>.rl-facet:nth-child(odd):not(:first-child){border-left:1px solid var(--line)}
.rl-facets:has(>:last-child:nth-child(odd):not(:first-child))>.rl-facet:nth-child(even){border-left:0}}
/* from 1280 px a record with fewer than four facets takes that many columns,
   never a blank quarter */
@media (min-width:1280px){
.rl-facets:has(>:nth-child(3):last-child){grid-template-columns:repeat(3,minmax(0,1fr))}
.rl-facets:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(0,1fr))}}
/* F-46: one or two tiles keep a tile's width (180 to 240 px), never half
   the page each for one figure */
@media (min-width:720px){
.rl-stats:has(>:only-child){grid-template-columns:minmax(180px,240px)}
.rl-stats:has(>:nth-child(2):last-child){grid-template-columns:repeat(2,minmax(180px,240px))}}
/* F-47: the badge holds the top right of the headline's first line only;
   the later lines run the card's full width (ui.js measures the badge) */
.rl-ex .top{--rl-badge-w:0px}
.rl-ex .top[data-badge]{display:block;position:relative}
.rl-ex .top[data-badge]>:is(.rl-state,.rl-tag){position:absolute;top:0;right:0}
.rl-ex .top[data-badge] .head .t::before{content:"";float:right;width:var(--rl-badge-w);height:1em}
/* F-48: on the phone a text button (Details, Why, Show) is as tall as its
   line; the shell's 40 px floor made the line taller than its sentence. The
   hit area still reaches 40 px: a layer of its own over the word, as the
   Why's, so nothing moves and a page's own margins still hold. */
@media (max-width:640px){
.rl-link:where(button:not(.rl-btn,.btn)){min-height:0}
:where(button.rl-link:not(.rl-btn,.btn)){position:relative}
:where(button.rl-link:not(.rl-btn,.btn))::after{content:"";position:absolute;left:-4px;right:-4px;top:50%;height:40px;transform:translateY(-50%)}}
/* F-49: a phone card's label sits on its value's first line, not at the top
   of a taller control */
@media (max-width:719px){
.rl-table.rl-cards td[data-label]::before{vertical-align:baseline}}
/* F-50: the fade is wider, and a page's own strip opts in with
   data-rl-strip (ui.js watches it as it does .rl-tabs); from 720 px a tab
   row that runs past its width draws its tabs closer first (data-tight) */
.rl-tabs[data-tight]{gap:0}
.rl-tabs[data-tight] :is(a,button,.rl-tab){padding:0 8px}
[data-rl-strip]{flex-wrap:nowrap!important;overflow-x:auto!important;scrollbar-width:none}
[data-rl-strip]>*{flex:none}
[data-rl-strip]::-webkit-scrollbar{display:none}
:is(.rl-tabs,.rl-chips,[data-rl-strip])[data-more="end"]{-webkit-mask-image:linear-gradient(to right,black calc(100% - 56px),transparent);mask-image:linear-gradient(to right,black calc(100% - 56px),transparent)}
:is(.rl-tabs,.rl-chips,[data-rl-strip])[data-more="start"]{-webkit-mask-image:linear-gradient(to left,black calc(100% - 56px),transparent);mask-image:linear-gradient(to left,black calc(100% - 56px),transparent)}
:is(.rl-tabs,.rl-chips,[data-rl-strip])[data-more="both"]{-webkit-mask-image:linear-gradient(to right,transparent,black 56px,black calc(100% - 56px),transparent);mask-image:linear-gradient(to right,transparent,black 56px,black calc(100% - 56px),transparent)}
/* 3.0.4 (M3, M4): a table wider than its box fades at the cut edge, the
   same 56 px fade as a strip, so a column past the edge is never a silent
   cut. A page opts its wrap in with RLStrip.watch(wrap) after it draws
   (ui.js sets data-more); the scroll bar stays. */
.rl-tablewrap[data-more="end"]{-webkit-mask-image:linear-gradient(to right,black calc(100% - 56px),transparent);mask-image:linear-gradient(to right,black calc(100% - 56px),transparent)}
.rl-tablewrap[data-more="start"]{-webkit-mask-image:linear-gradient(to left,black calc(100% - 56px),transparent);mask-image:linear-gradient(to left,black calc(100% - 56px),transparent)}
.rl-tablewrap[data-more="both"]{-webkit-mask-image:linear-gradient(to right,transparent,black 56px,black calc(100% - 56px),transparent);mask-image:linear-gradient(to right,transparent,black 56px,black calc(100% - 56px),transparent)}
/* F-51: the file picker's button is a secondary button in both themes */
input[type=file]{max-width:100%;color:var(--ink-2);font:400 var(--fs-2)/var(--lh-2) var(--font)}
input[type=file]::file-selector-button{height:var(--ctl);margin:0 10px 0 0;padding:0 14px;border:1px solid var(--line-strong);border-radius:var(--r-1);
background:var(--surface);color:var(--ink);font:500 var(--fs-3)/1 var(--font);cursor:pointer;
transition:background var(--t-fast) var(--ease),border-color var(--t-fast) var(--ease)}
input[type=file]:hover::file-selector-button{background:var(--surface-2);border-color:var(--field-line)}
input[type=file]:disabled{color:var(--mut)}
input[type=file]:disabled::file-selector-button{background:var(--surface-2);border-color:var(--line);color:var(--mut);cursor:not-allowed}
/* 3.0.6 (VERIFY-304): on a phone a record header's reason takes its own line, at the edge of the lines around it */
@media (max-width:719px){.rl-rh-row .rl-state+.rl-why{display:block;margin:4px 0 0}}