/* rrm-a2.css — GENERATED by dev/gen_rrm_a2_css.py from
   docs/design/a2/tokens.json. Edit the tokens and re-run; do not
   edit this top block by hand. Fonts: https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500;600&family=IBM+Plex+Sans+Arabic:wght@400;500;600&family=IBM+Plex+Sans:wght@400;500;600&family=Source+Serif+4:ital,opsz,wght@0,8..60,600;1,8..60,400&display=swap */

:root {
  --a2-ground: #f6f5f2;
  --a2-surface: #ffffff;
  --a2-surface-raised: #fbfaf8;
  --a2-ink: #1a1917;
  --a2-ink-muted: #6b6761;
  --a2-ink-faint: #a9a49b;
  --a2-line: #e7e4de;
  --a2-line-strong: #1a1917;
  --a2-control-border: #cfcbc3;
  --a2-bar: #1a1917;
  --a2-bar-text: #ffffff;
  --a2-bar-text-muted: #b8b3aa;
  --a2-accent: #d97a0e;
  --a2-accent-tint: #fbebd2;
  --a2-accent-ink: #7a4a00;
  --a2-ok: #2f8f5b;
  --a2-warn: #d97a0e;
  --a2-warn-ink: #8a5a00;
  --a2-bad: #c93a2b;
  --a2-bad-ink: #a93226;
  --a2-primary-fill: #1a1917;
  --a2-primary-text: #ffffff;
  --a2-font-sans: "IBM Plex Sans", "IBM Plex Sans Arabic", system-ui, sans-serif;
  --a2-font-arabic: "IBM Plex Sans Arabic", "IBM Plex Sans", system-ui, sans-serif;
  --a2-font-serif: "Source Serif 4", Georgia, serif;
  --a2-font-mono: "IBM Plex Mono", ui-monospace, Menlo, monospace;
  --a2-space-1: 4px;
  --a2-space-2: 8px;
  --a2-space-3: 12px;
  --a2-space-4: 16px;
  --a2-space-5: 24px;
  --a2-space-6: 32px;
  --a2-radius-sm: 2px;
  --a2-radius-md: 5px;
  --a2-radius-lg: 8px;
  --a2-radius-dot: 50%;
  color-scheme: light;
}

[data-theme="dark"] {
  --a2-ground: #141311;
  --a2-surface: #1e1c19;
  --a2-surface-raised: #262320;
  --a2-ink: #ece9e3;
  --a2-ink-muted: #a39f98;
  --a2-ink-faint: #6b6761;
  --a2-line: #2f2c28;
  --a2-line-strong: #ece9e3;
  --a2-control-border: #3d3934;
  --a2-bar: #0d0c0b;
  --a2-bar-text: #ece9e3;
  --a2-bar-text-muted: #8a867f;
  --a2-accent: #e8902a;
  --a2-accent-tint: #3a2a12;
  --a2-accent-ink: #f0c27a;
  --a2-ok: #4fb37a;
  --a2-warn: #e8902a;
  --a2-warn-ink: #f0c27a;
  --a2-bad: #e0604f;
  --a2-bad-ink: #f0857a;
  --a2-primary-fill: #ece9e3;
  --a2-primary-text: #141311;
  color-scheme: dark;
}

/* ---- type styles (one class per token) ---- */
.page-title { font-family: var(--a2-font-serif); font-size: 30px; line-height: 36px; font-weight: 600; letter-spacing: -0.01em; }
.section-title { font-family: var(--a2-font-serif); font-size: 17px; line-height: 24px; font-weight: 600; }
.footnote { font-family: var(--a2-font-serif); font-size: 13px; line-height: 18px; font-weight: 400; font-style: italic; }
.body { font-family: var(--a2-font-sans); font-size: 14px; line-height: 20px; font-weight: 400; }
.body-strong { font-family: var(--a2-font-sans); font-size: 14px; line-height: 20px; font-weight: 500; }
.label { font-family: var(--a2-font-sans); font-size: 11.5px; line-height: 16px; font-weight: 600; letter-spacing: 0.07em; text-transform: uppercase; }
.caption { font-family: var(--a2-font-sans); font-size: 12.5px; line-height: 16px; font-weight: 400; }
.nav { font-family: var(--a2-font-sans); font-size: 13.5px; line-height: 20px; font-weight: 500; }
.body-ar { font-family: var(--a2-font-arabic); font-size: 14px; line-height: 22px; font-weight: 400; direction: rtl; }
.caption-ar { font-family: var(--a2-font-arabic); font-size: 13px; line-height: 18px; font-weight: 400; direction: rtl; }
.num { font-family: var(--a2-font-mono); font-size: 13px; line-height: 20px; font-weight: 400; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.num-strong { font-family: var(--a2-font-mono); font-size: 13px; line-height: 20px; font-weight: 600; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.num-display { font-family: var(--a2-font-mono); font-size: 22px; line-height: 28px; font-weight: 500; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.doc-id { font-family: var(--a2-font-mono); font-size: 28px; line-height: 34px; font-weight: 500; font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }


/* ==== components (hand-maintained below this line) ==== */
/* Specificity: style.css colours links with body.v3-shell a:not(.btn)
   :not(.nav-link):not(.navbar-brand) (0,4,2); A2 link rules are written as
   html[data-shell="a2"] body.a2-shell.a2-shell … so they win on purpose.
   Shell, ListTable, RecordHeader, Status, panes, launcher — the A2 frame.
   Loaded ONLY by templates._page_a2 (ui_shell=a2 or ?shell=a2). Every
   colour below is a token; nothing here is Odoo's colour, type or mark. */

html[data-shell="a2"] { background: var(--a2-ground); }
html[data-shell="a2"] body.a2-shell.a2-shell {
  margin: 0; background: var(--a2-ground); color: var(--a2-ink);
  font-family: var(--a2-font-sans); font-size: 14px; line-height: 20px;
  -webkit-font-smoothing: antialiased;
}
html[lang="ar"] body.a2-shell.a2-shell { font-family: var(--a2-font-arabic); }
html[data-shell="a2"] body.a2-shell.a2-shell a { color: var(--a2-ink); text-decoration: none; }
html[data-shell="a2"] body.a2-shell.a2-shell a:hover { color: var(--a2-accent); }
html[data-shell="a2"] body.a2-shell.a2-shell h1, html[data-shell="a2"] body.a2-shell.a2-shell h2, html[data-shell="a2"] body.a2-shell.a2-shell h3,
html[data-shell="a2"] body.a2-shell.a2-shell h4, html[data-shell="a2"] body.a2-shell.a2-shell h5 { color: var(--a2-ink); }
.footnote { color: var(--a2-ink-muted); }
.caption-ar { color: var(--a2-ink-muted); }
/* An Arabic secondary line under an English value keeps rtl shaping but
   sits on the frame's start edge, not the cell's far edge. */
html[dir="ltr"] .a2-field .caption-ar, html[dir="ltr"] .a2-table .caption-ar,
html[dir="ltr"] .a2-item-txt .caption-ar, html[dir="ltr"] .a2-tile .caption-ar { text-align: left; }
html[dir="rtl"] .a2-field .caption-ar, html[dir="rtl"] .a2-table .caption-ar,
html[dir="rtl"] .a2-item-txt .caption-ar, html[dir="rtl"] .a2-tile .caption-ar { text-align: right; }
.muted { color: var(--a2-ink-muted); }
.faint { color: var(--a2-ink-faint); }
.num, .num-strong, .num-display, .doc-id { direction: ltr; unicode-bidi: isolate; white-space: nowrap; }
.r { text-align: end; }
.a2-sr { position: absolute; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }

/* Unconverted v3 content inside the A2 frame takes the A2 palette. */
html[data-shell="a2"][data-theme] {
  --v3-bg: var(--a2-ground); --v3-bg-accent: none;
  --v3-surface: var(--a2-surface); --v3-surface-2: var(--a2-surface-raised);
  --v3-surface-3: var(--a2-surface-raised); --v3-line: var(--a2-line);
  --v3-text: var(--a2-ink); --v3-text-2: var(--a2-ink-muted); --v3-text-3: var(--a2-ink-faint);
  --v3-accent: var(--a2-ink); --v3-accent-strong: var(--a2-accent);
  --v3-ok: var(--a2-ok); --v3-warn: var(--a2-warn-ink); --v3-bad: var(--a2-bad-ink);
  --v3-menu-bg: var(--a2-surface); --v3-shadow: 0 6px 24px rgba(0,0,0,.12);
}
/* style.css paints the v3 ambience with !important; the A2 frame is flat ground. */
html[data-shell="a2"] body.v3-shell.a2-shell { background: var(--a2-ground) !important; color: var(--a2-ink);
  font-family: var(--a2-font-sans); font-size: 14px; line-height: 20px; }
html[lang="ar"] body.v3-shell.a2-shell { font-family: var(--a2-font-arabic); }

/* ---------------------------------------------------------------- top bar */
.a2-bar {
  position: sticky; top: 0; z-index: 1040; height: 50px;
  display: flex; align-items: center; gap: var(--a2-space-5);
  padding: 0 var(--a2-space-6); background: var(--a2-bar); color: var(--a2-bar-text);
}
.a2-brand { display: flex; align-items: center; gap: 10px; flex-shrink: 0; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-brand, html[data-shell="a2"] body.a2-shell.a2-shell .a2-brand:hover { color: var(--a2-bar-text); }
.a2-mark { width: 10px; height: 10px; border-radius: var(--a2-radius-sm); background: var(--a2-accent); flex-shrink: 0; }
.a2-brand-name { font-family: var(--a2-font-serif); font-size: 17px; font-weight: 600; white-space: nowrap; }
.a2-nav { display: flex; align-items: center; gap: 2px; flex: 1; min-width: 0;
  overflow-x: auto; scrollbar-width: none; }
.a2-nav::-webkit-scrollbar { display: none; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-nav a { font: 500 13.5px/20px var(--a2-font-sans); padding: 6px 10px; border-radius: var(--a2-radius-md);
  color: var(--a2-bar-text-muted); white-space: nowrap; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-nav a:hover { color: var(--a2-bar-text); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-nav a.active { color: var(--a2-bar-text); box-shadow: inset 0 -2px 0 var(--a2-accent); border-radius: 0; }
.a2-bar-right { display: flex; align-items: center; gap: var(--a2-space-2); flex-shrink: 0; }
.a2-bar-btn { height: 30px; padding: 0 10px; border-radius: var(--a2-radius-md);
  background: transparent; border: 1px solid rgba(255,255,255,.14); color: var(--a2-bar-text-muted);
  font: 500 13px/20px var(--a2-font-sans); cursor: pointer; white-space: nowrap; }
.a2-bar-btn:hover, .a2-bar-btn[aria-expanded="true"] { color: var(--a2-bar-text); border-color: rgba(255,255,255,.3); }
.a2-bar-btn .narrow { display: none; }
.a2-bar-btn b { color: var(--a2-bar-text); font-weight: 500; font-family: var(--a2-font-mono); font-size: 12.5px; }
.a2-avatar { width: 30px; height: 30px; border-radius: var(--a2-radius-dot); border: 1px solid rgba(255,255,255,.2);
  background: transparent; color: var(--a2-bar-text); font: 500 12.5px/1 var(--a2-font-sans); cursor: pointer; }
.a2-menu-wrap { position: relative; }
.a2-menu { display: none; position: absolute; top: calc(100% + 8px); inset-inline-end: 0; z-index: 1050;
  min-width: 220px; max-height: 70vh; overflow-y: auto; padding: 6px;
  background: var(--a2-surface); color: var(--a2-ink); border: 1px solid var(--a2-line);
  border-radius: var(--a2-radius-lg); box-shadow: 0 8px 28px rgba(0,0,0,.14); }
.a2-menu.open { display: block; }
.a2-menu a, .a2-menu button { display: flex; align-items: center; gap: 8px; width: 100%; padding: 7px 10px;
  border: 0; background: transparent; border-radius: var(--a2-radius-md); color: var(--a2-ink);
  font: 400 13.5px/20px var(--a2-font-sans); text-align: start; cursor: pointer; }
.a2-menu a:hover, .a2-menu button:hover { background: var(--a2-surface-raised); color: var(--a2-ink); }
.a2-menu a.on { font-weight: 600; }
.a2-menu .a2-menu-group { padding: 8px 10px 2px; }
.a2-menu hr { border: 0; border-top: 1px solid var(--a2-line); margin: 6px 0; }
.a2-menu form { margin: 0; }

/* ----------------------------------------------------- breadcrumb + title */
.a2-crumb { height: 42px; display: flex; align-items: center; gap: 6px; padding: 0 var(--a2-space-6);
  color: var(--a2-ink-muted); border-bottom: 1px solid var(--a2-line); overflow: hidden; white-space: nowrap; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-crumb a { color: var(--a2-ink-muted); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-crumb a:hover { color: var(--a2-ink); }
.a2-crumb .sep { color: var(--a2-ink-faint); }
.a2-crumb .here { color: var(--a2-ink); font-weight: 500; overflow: hidden; text-overflow: ellipsis; }
.a2-main { padding: var(--a2-space-5) var(--a2-space-6) 64px; }
.a2-title-row { display: flex; align-items: flex-end; justify-content: space-between; gap: var(--a2-space-4);
  flex-wrap: wrap; margin-bottom: var(--a2-space-5); }
.a2-title-row h1 { margin: 0; }
.a2-title-meta { display: flex; align-items: baseline; gap: var(--a2-space-3); flex-wrap: wrap; }
.a2-title-meta .muted { font-size: 14px; }
.a2-actions { display: flex; gap: var(--a2-space-2); flex-wrap: wrap; }

/* ----------------------------------------------------------------- buttons */
.a2-btn { display: inline-flex; align-items: center; gap: 6px; height: 32px; padding: 0 12px;
  border-radius: var(--a2-radius-md); border: 1px solid var(--a2-control-border);
  background: var(--a2-surface); color: var(--a2-ink); font: 500 14px/20px var(--a2-font-sans);
  white-space: nowrap; cursor: pointer; }
html[data-shell="a2"] body.a2-shell.a2-shell a.a2-btn { color: var(--a2-ink); }
.a2-btn:hover { border-color: var(--a2-ink-muted); }
html[data-shell="a2"] body.a2-shell.a2-shell a.a2-btn:hover { color: var(--a2-ink); }
.a2-btn.primary, html[data-shell="a2"] body.a2-shell.a2-shell a.a2-btn.primary { background: var(--a2-primary-fill);
  border-color: var(--a2-primary-fill); color: var(--a2-primary-text); }
.a2-btn.primary:hover { opacity: .9; }
.a2-btn.bad, html[data-shell="a2"] body.a2-shell.a2-shell a.a2-btn.bad { color: var(--a2-bad-ink); }
.a2-btn[disabled] { opacity: .5; cursor: not-allowed; }
.a2-btn.sm { height: 26px; padding: 0 8px; font-size: 12.5px; }

/* ------------------------------------------------------------------ status */
.st { display: inline-flex; align-items: center; gap: var(--a2-space-1); font-size: 12.5px;
  line-height: 16px; font-weight: 500; white-space: nowrap; color: var(--a2-ink); }
.st .dot { width: 8px; height: 8px; border-radius: var(--a2-radius-dot); background: var(--a2-ink); flex-shrink: 0; }
.st.ok .dot { background: var(--a2-ok); }
.st.warn .dot { background: var(--a2-warn); }
.st.warn { color: var(--a2-warn-ink); }
.st.bad .dot { background: var(--a2-bad); }
.st.bad { color: var(--a2-bad-ink); }
.st.faint, .st.faint .dot { color: var(--a2-ink-faint); }
.st.faint .dot { background: var(--a2-ink-faint); }
html[data-shell="a2"] body.a2-shell.a2-shell a.st.warn { color: var(--a2-warn-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell a.st.bad { color: var(--a2-bad-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell a.st { color: var(--a2-ink); }

/* ------------------------------------------------------------- card / list */
.a2-card { background: var(--a2-surface); border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); }
.a2-card + .a2-card { margin-top: var(--a2-space-5); }
.a2-cp { display: flex; align-items: center; gap: var(--a2-space-2); flex-wrap: wrap;
  padding: var(--a2-space-3); border-bottom: 1px solid var(--a2-line); }
.a2-cp .grow { flex: 1; }
.a2-input, html[data-shell="a2"] body.a2-shell.a2-shell .a2-cp select, html[data-shell="a2"] body.a2-shell.a2-shell .a2-dd-panel select,
html[data-shell="a2"] body.a2-shell.a2-shell .a2-dd-panel input { height: 32px; padding: 0 10px; border-radius: var(--a2-radius-md);
  border: 1px solid var(--a2-control-border); background: var(--a2-surface); color: var(--a2-ink);
  font: 400 14px/20px var(--a2-font-sans); }
.a2-input::placeholder { color: var(--a2-ink-faint); }
.a2-input:focus, .a2-dd-panel select:focus, .a2-dd-panel input:focus { outline: 2px solid var(--a2-ink); outline-offset: -1px; }
.a2-search { width: 240px; max-width: 100%; }
.a2-chip { display: inline-flex; align-items: center; gap: var(--a2-space-1); height: 26px; padding: 0 8px;
  border-radius: var(--a2-radius-md); background: var(--a2-accent-tint); color: var(--a2-accent-ink);
  font-size: 12.5px; line-height: 16px; white-space: nowrap; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-chip a { color: var(--a2-accent-ink); font-weight: 600; padding-inline-start: 2px; }
.a2-dd { position: relative; }
.a2-dd > summary { list-style: none; }
.a2-dd > summary::-webkit-details-marker { display: none; }
.a2-dd-panel { position: absolute; top: calc(100% + 6px); inset-inline-start: 0; z-index: 30;
  min-width: 260px; padding: var(--a2-space-3); background: var(--a2-surface);
  border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); box-shadow: 0 8px 28px rgba(0,0,0,.12); }
.a2-dd-panel.end { inset-inline-start: auto; inset-inline-end: 0; }
.a2-dd-panel label { display: grid; gap: 4px; margin-bottom: var(--a2-space-3); }
.a2-dd-panel a { display: block; padding: 6px 8px; border-radius: var(--a2-radius-md); }
.a2-dd-panel a.on { font-weight: 600; background: var(--a2-surface-raised); }
.a2-seg { display: inline-flex; border: 1px solid var(--a2-control-border); border-radius: var(--a2-radius-md); overflow: hidden; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-seg a { padding: 0 10px; height: 30px; display: inline-flex; align-items: center;
  color: var(--a2-ink-muted); font-size: 12.5px; font-weight: 500; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-seg a.on { background: var(--a2-surface-raised); color: var(--a2-ink); }
.a2-seg a + a { border-inline-start: 1px solid var(--a2-control-border); }

.a2-table-wrap { overflow-x: auto; }
.a2-table { width: 100%; border-collapse: collapse; }
.a2-table th { font-size: 11.5px; line-height: 16px; font-weight: 600; letter-spacing: .07em; text-transform: uppercase;
  color: var(--a2-ink-muted); background: var(--a2-surface-raised); text-align: start;
  padding: 9px var(--a2-space-3); border-bottom: 1px solid var(--a2-line-strong); white-space: nowrap; }
.a2-table th.r { text-align: end; }
.a2-table td { padding: 9px var(--a2-space-3); border-bottom: 1px solid var(--a2-line); vertical-align: top; }
.a2-table tbody tr:hover td { background: var(--a2-surface-raised); }
.a2-table tr.rev td, html[data-shell="a2"] body.a2-shell.a2-shell .a2-table tr.rev td a, .a2-table tr.rev .st { color: var(--a2-ink-faint); }
.a2-table tr.rev .st .dot { background: var(--a2-ink-faint); }
.a2-table tr.grp td { background: var(--a2-surface-raised); font-weight: 700; }
.a2-table tfoot td { border-top: 1px solid var(--a2-line-strong); border-bottom: 0; padding: 10px var(--a2-space-3); }
.a2-table td .caption { display: block; color: var(--a2-ink-muted); margin-top: 2px; }
.a2-table .empty td { text-align: center; color: var(--a2-ink-muted); padding: 40px 12px; }
.a2-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: var(--a2-space-3); padding: var(--a2-space-3); }
.a2-mini { border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); padding: var(--a2-space-4); display: grid; gap: 6px; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-mini.rev, html[data-shell="a2"] body.a2-shell.a2-shell .a2-mini.rev * { color: var(--a2-ink-faint); }
.a2-mini-top { display: flex; justify-content: space-between; gap: 8px; }

/* ------------------------------------------------------------------ record */
.a2-rec { padding: var(--a2-space-5); }
.a2-rec-top { display: flex; justify-content: space-between; align-items: center; gap: var(--a2-space-3);
  flex-wrap: wrap; padding-bottom: var(--a2-space-4); border-bottom: 1px solid var(--a2-line); }
.a2-ribbon { display: inline-flex; align-items: center; gap: 2px; padding: 2px; border: 1px solid var(--a2-line);
  border-radius: var(--a2-radius-md); }
.a2-ribbon span { padding: 4px 12px; font-size: 12.5px; font-weight: 500; color: var(--a2-ink-muted); border-radius: var(--a2-radius-md); }
.a2-ribbon span.on { background: var(--a2-ink); color: var(--a2-primary-text); }
.a2-ribbon span.done { color: var(--a2-ink); }
.a2-ribbon .sep { padding: 0; color: var(--a2-ink-faint); }
.a2-rec-head { display: flex; justify-content: space-between; gap: var(--a2-space-5); flex-wrap: wrap; padding-top: var(--a2-space-5); }
.a2-rec-head .doc-id { margin: 0; word-break: break-all; white-space: normal; }
.a2-rec-type { margin: 4px 0 var(--a2-space-5); color: var(--a2-ink-muted); }
.a2-fields { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--a2-space-4) var(--a2-space-5); }
.a2-field .label { color: var(--a2-ink-muted); display: block; margin-bottom: 4px; }
.a2-field .v { display: block; }
.a2-field .caption, .a2-field .caption-ar { display: block; color: var(--a2-ink-muted); margin-top: 2px; }
.a2-counters { display: flex; align-self: flex-start; border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); }
.a2-counter { padding: 10px 16px; min-width: 92px; display: grid; gap: 2px; }
html[data-shell="a2"] body.a2-shell.a2-shell a.a2-counter:hover { background: var(--a2-surface-raised); color: var(--a2-ink); }
.a2-counter + .a2-counter { border-inline-start: 1px solid var(--a2-line); }
.a2-counter .num-display { font-size: 20px; line-height: 26px; }
.a2-counter .caption { color: var(--a2-ink-muted); }
.a2-section { margin-top: var(--a2-space-6); }
.a2-section > .section-title { margin: 0 0 var(--a2-space-3); display: flex; justify-content: space-between; align-items: baseline; gap: 12px; }
.a2-section > .section-title .footnote { font-size: 13px; }
.a2-alert { padding: 10px 14px; border-radius: var(--a2-radius-md); border: 1px solid var(--a2-line); margin-bottom: var(--a2-space-4); background: var(--a2-surface); }
.a2-alert.bad { border-color: var(--a2-bad); color: var(--a2-bad-ink); }
.a2-alert.ok { border-color: var(--a2-ok); }

/* ----------------------------------------------------------------- chatter */
.a2-chat { border-top: 1px solid var(--a2-line); }
.a2-chat-compose { display: flex; gap: var(--a2-space-2); padding: var(--a2-space-4) 0; flex-wrap: wrap; }
.a2-chat-compose .a2-input { flex: 1; min-width: 200px; }
.a2-chat-row { display: flex; gap: var(--a2-space-3); padding: var(--a2-space-4) 0; border-top: 1px solid var(--a2-line); }
.a2-av { width: 28px; height: 28px; border-radius: var(--a2-radius-dot); background: var(--a2-surface-raised);
  border: 1px solid var(--a2-line); display: grid; place-items: center; font-size: 11.5px; font-weight: 600;
  color: var(--a2-ink-muted); flex-shrink: 0; }
.a2-chat-who { display: flex; gap: var(--a2-space-2); align-items: baseline; flex-wrap: wrap; }
.a2-chat-who .caption { color: var(--a2-ink-muted); }
.a2-chat-body { margin-top: 2px; }

/* ------------------------------------------------------- two-pane (tenants) */
.a2-panes { display: grid; grid-template-columns: 340px minmax(0, 1fr); min-height: 560px; }
.a2-pane-list { border-inline-end: 1px solid var(--a2-line); display: flex; flex-direction: column; min-height: 0; }
.a2-pane-items { overflow-y: auto; max-height: calc(100vh - 290px); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-item { display: flex; align-items: flex-start; gap: 10px; padding: 10px var(--a2-space-3);
  border-bottom: 1px solid var(--a2-line); color: var(--a2-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-item:hover { background: var(--a2-surface-raised); color: var(--a2-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-item.active { background: var(--a2-surface-raised); box-shadow: inset 2px 0 0 var(--a2-ink); }
html[dir="rtl"] body.a2-shell.a2-shell .a2-item.active { box-shadow: inset -2px 0 0 var(--a2-ink); }

.a2-item-txt { flex: 1; min-width: 0; display: grid; gap: 1px; }
.a2-item-txt .caption, .a2-item-txt .caption-ar { color: var(--a2-ink-muted); }
/* An Arabic secondary line under an English value keeps rtl shaping but
   sits on the frame's start edge, not the cell's far edge. */
html[dir="ltr"] .a2-field .caption-ar, html[dir="ltr"] .a2-table .caption-ar,
html[dir="ltr"] .a2-item-txt .caption-ar, html[dir="ltr"] .a2-tile .caption-ar { text-align: left; }
html[dir="rtl"] .a2-field .caption-ar, html[dir="rtl"] .a2-table .caption-ar,
html[dir="rtl"] .a2-item-txt .caption-ar, html[dir="rtl"] .a2-tile .caption-ar { text-align: right; }
.a2-item-amt { text-align: end; display: grid; gap: 2px; justify-items: end; }
.a2-pane-detail { padding: var(--a2-space-5); min-width: 0; }
.a2-pane-detail[hidden] { display: none; }
.a2-detail-head { display: flex; justify-content: space-between; gap: 16px; flex-wrap: wrap; align-items: flex-start;
  padding-bottom: var(--a2-space-4); border-bottom: 1px solid var(--a2-line); margin-bottom: var(--a2-space-5); }
.a2-detail-head h2 { margin: 0; }
.a2-pane-empty { padding: 60px 24px; text-align: center; color: var(--a2-ink-muted); }

/* ----------------------------------------------------------- home launcher */
.a2-home-date { margin: 0 0 6px; }
.a2-attn { display: flex; gap: var(--a2-space-4); flex-wrap: wrap; margin-bottom: var(--a2-space-6); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-attn a.st:hover { text-decoration: underline; }
.a2-kpis { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); }
.a2-kpi { padding: var(--a2-space-4) var(--a2-space-5); display: grid; gap: 4px; }
.a2-kpi + .a2-kpi { border-inline-start: 1px solid var(--a2-line); }
.a2-kpi .label { color: var(--a2-ink-muted); }
.a2-kpi .caption { color: var(--a2-ink-muted); }
.a2-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: var(--a2-space-3); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-tile { display: grid; gap: 2px; padding: var(--a2-space-4); background: var(--a2-surface);
  border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); color: var(--a2-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-tile:hover { border-color: var(--a2-ink); color: var(--a2-ink); }
.a2-tile .caption, .a2-tile .caption-ar { color: var(--a2-ink-muted); }
/* An Arabic secondary line under an English value keeps rtl shaping but
   sits on the frame's start edge, not the cell's far edge. */
html[dir="ltr"] .a2-field .caption-ar, html[dir="ltr"] .a2-table .caption-ar,
html[dir="ltr"] .a2-item-txt .caption-ar, html[dir="ltr"] .a2-tile .caption-ar { text-align: left; }
html[dir="rtl"] .a2-field .caption-ar, html[dir="rtl"] .a2-table .caption-ar,
html[dir="rtl"] .a2-item-txt .caption-ar, html[dir="rtl"] .a2-tile .caption-ar { text-align: right; }
.a2-home h2.section-title { margin: var(--a2-space-6) 0 var(--a2-space-3); }

/* ------------------------------------------------------------- phone width */
@media (max-width: 760px) {
  .a2-bar { padding: 0 16px; gap: 12px; }
  .a2-brand-name { display: none; }
  .a2-bar-btn .wide { display: none; }
  .a2-bar-btn .narrow { display: inline; }
  .a2-bar-right { gap: 6px; }
  .a2-crumb, .a2-main { padding-left: 16px; padding-right: 16px; }
  .a2-fields { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .a2-panes { grid-template-columns: 1fr; }
  .a2-pane-list { border-inline-end: 0; border-bottom: 1px solid var(--a2-line); }
  .a2-pane-items { max-height: 300px; }
  .a2-kpis { grid-template-columns: 1fr; }
  .a2-kpi + .a2-kpi { border-inline-start: 0; border-top: 1px solid var(--a2-line); }
  .a2-search { width: 100%; }
  .page-title { font-size: 26px; line-height: 32px; }
  .doc-id { font-size: 21px; line-height: 28px; }
  .a2-counters { width: 100%; }
  .a2-counter { flex: 1; min-width: 0; padding: 8px 10px; }
  .a2-rec { padding: 16px; }
}
@media (max-width: 420px) { .a2-fields { grid-template-columns: 1fr; } }

@media print {
  .a2-bar, .a2-crumb, .a2-actions, .a2-cp, .a2-chat-compose, .a2-noprint { display: none !important; }
  body.a2-shell.a2-shell { background: #fff; }
  .a2-main { padding: 0; }
  .a2-card { border: 0; }
}

/* ------------------------------------------------ 7.1 · module sidebar */
.a2-body.has-side { display: grid; grid-template-columns: 228px minmax(0, 1fr); align-items: start; }
.a2-side { position: sticky; top: 50px; max-height: calc(100vh - 50px); overflow-y: auto;
  padding: var(--a2-space-4) var(--a2-space-3) var(--a2-space-6); border-inline-end: 1px solid var(--a2-line);
  background: var(--a2-surface); align-self: stretch; }
.a2-side-title { margin: 0 0 var(--a2-space-2); padding: 0 var(--a2-space-2); }
.a2-side-group { color: var(--a2-ink-muted); padding: var(--a2-space-3) var(--a2-space-2) var(--a2-space-1); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-side-item { display: block; padding: 5px var(--a2-space-2);
  border-radius: var(--a2-radius-md); color: var(--a2-ink); font-size: 13.5px; line-height: 20px; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-side-item:hover { background: var(--a2-surface-raised); color: var(--a2-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-side-item.on { background: var(--a2-surface-raised); font-weight: 600;
  box-shadow: inset 2px 0 0 var(--a2-accent); }
html[dir="rtl"] body.a2-shell.a2-shell .a2-side-item.on { box-shadow: inset -2px 0 0 var(--a2-accent); }
.a2-sect-narrow { display: none; }
.a2-moved { border-color: var(--a2-accent); background: var(--a2-accent-tint); color: var(--a2-accent-ink); }

/* ------------------------------------------- 7.1 · forms, KPIs, record */
.a2-form { padding: var(--a2-space-5); display: grid; gap: var(--a2-space-5); max-width: 980px; }
.a2-form-row { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: var(--a2-space-4); }
.a2-form label.a2-f { display: grid; gap: 4px; }
.a2-form label.a2-f > .label { color: var(--a2-ink-muted); }
.a2-form .caption { color: var(--a2-ink-muted); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-form select, html[data-shell="a2"] body.a2-shell.a2-shell .a2-form input[type=text],
html[data-shell="a2"] body.a2-shell.a2-shell .a2-form input[type=date], html[data-shell="a2"] body.a2-shell.a2-shell .a2-form input[type=number],
html[data-shell="a2"] body.a2-shell.a2-shell .a2-form input[type=file] {
  height: 34px; padding: 0 10px; border-radius: var(--a2-radius-md); border: 1px solid var(--a2-control-border);
  background: var(--a2-surface); color: var(--a2-ink); font: 400 14px/20px var(--a2-font-sans); width: 100%; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-form input[type=file] { padding: 5px 8px; height: auto; }
.a2-form input.num, .a2-form input.num-in { font-family: var(--a2-font-mono); font-variant-numeric: tabular-nums; }
.a2-form fieldset { border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); padding: var(--a2-space-4); margin: 0; min-width: 0; }
.a2-form legend { font-family: var(--a2-font-serif); font-size: 17px; line-height: 24px; font-weight: 600; padding: 0 6px; width: auto; float: none; margin: 0; }
.a2-radio { display: inline-flex; align-items: center; gap: 6px; margin-inline-end: var(--a2-space-4); }
.a2-sum { display: flex; flex-wrap: wrap; gap: var(--a2-space-5); padding: var(--a2-space-3) var(--a2-space-4);
  border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg); background: var(--a2-surface-raised); }
.a2-sum > div { display: grid; gap: 2px; }
.a2-sum .label { color: var(--a2-ink-muted); }
.a2-form-actions { display: flex; gap: var(--a2-space-2); flex-wrap: wrap; align-items: center; }
.a2-kpis.k4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.a2-kpis.k3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.a2-kpis + .a2-kpis { border-top: 0; border-top-left-radius: 0; border-top-right-radius: 0; margin-top: -1px; }
.a2-kpi a { text-decoration: underline; text-underline-offset: 2px; }
.a2-tabs { display: flex; gap: var(--a2-space-4); border-bottom: 1px solid var(--a2-line); margin-bottom: var(--a2-space-5); flex-wrap: wrap; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-tabs a { padding: 8px 2px; color: var(--a2-ink-muted); font: 500 13.5px/20px var(--a2-font-sans); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-tabs a.on { color: var(--a2-ink); box-shadow: inset 0 -2px 0 var(--a2-line-strong); }
.a2-banner { display: flex; align-items: center; justify-content: space-between; gap: var(--a2-space-4); flex-wrap: wrap;
  padding: var(--a2-space-3) var(--a2-space-4); border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg);
  background: var(--a2-surface); margin-bottom: var(--a2-space-5); }
.a2-banner.bad { border-color: var(--a2-bad); }
.a2-banner.warn { border-color: var(--a2-warn); }
.a2-banner.ok { border-color: var(--a2-ok); }
.a2-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--a2-space-5); }
.a2-toggle-row { display: flex; justify-content: space-between; align-items: center; gap: var(--a2-space-4);
  padding: var(--a2-space-3) 0; border-top: 1px solid var(--a2-line); }
.a2-toggle-row:first-of-type { border-top: 0; }
.a2-toggle-row input[type=checkbox] { width: 18px; height: 18px; accent-color: var(--a2-ink); }

@media (max-width: 760px) {
  .a2-body.has-side { grid-template-columns: 1fr; }
  .a2-side { display: none; }
  .a2-sect-narrow { display: block; }
  .a2-kpis.k4, .a2-kpis.k3 { grid-template-columns: 1fr; }
  .a2-split { grid-template-columns: 1fr; }
  .a2-form { padding: 16px; }
}
@media print { .a2-side { display: none !important; } .a2-body.has-side { display: block; } }

/* ------------------------------------------------ 7.2 · photo gallery */
.a2-gallery { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: var(--a2-space-2); margin-top: var(--a2-space-1); }
.a2-gallery img { width: 100%; aspect-ratio: 1; object-fit: cover; border-radius: var(--a2-radius-md); border: 1px solid var(--a2-line); display: block; }
.a2-gallery a:hover img { border-color: var(--a2-ink); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-form textarea { border-radius: var(--a2-radius-md); border: 1px solid var(--a2-control-border); background: var(--a2-surface); color: var(--a2-ink); }
.a2-table tr.grp td .caption-ar { display: inline; margin-inline-start: 8px; }

/* ------------------------------------------------ 7.5 · frame, settings, close */
.a2-frame { min-width: 0; }
.a2-frame-history form[method="POST"], .a2-frame-history form[method="post"],
.a2-frame-history form[method="Post"] { display: none !important; }
.a2-sect { padding: var(--a2-space-5); margin-bottom: var(--a2-space-5); scroll-margin-top: 110px; }
.a2-sect > .section-title { margin: 0 0 var(--a2-space-2); }
.a2-sect > .caption.muted { display: block; margin-bottom: var(--a2-space-4); }
.a2-sect .a2-form { padding: 0; max-width: none; }
.a2-jump { display: flex; flex-wrap: wrap; gap: var(--a2-space-2) var(--a2-space-4); margin-bottom: var(--a2-space-5); }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-jump a { color: var(--a2-ink-muted); font: 500 13.5px/20px var(--a2-font-sans); }
.a2-check { display: grid; grid-template-columns: auto 1fr; gap: var(--a2-space-2) var(--a2-space-4); align-items: start;
  padding: var(--a2-space-3) 0; border-top: 1px solid var(--a2-line); }
.a2-check:first-of-type { border-top: 0; }
.a2-table details { display: inline-block; vertical-align: middle; }
.a2-table details > summary { list-style: none; cursor: pointer; }
.a2-table details > summary::-webkit-details-marker { display: none; }
.a2-table details > .a2-form { padding: var(--a2-space-3) 0 0; gap: var(--a2-space-2); min-width: 260px; }
.a2-table details > .a2-form .a2-form-row { grid-template-columns: 1fr; }
.a2-btn.sm { height: 26px; padding: 0 8px; font-size: 13px; }
.a2-btn.danger, html[data-shell="a2"] body.a2-shell.a2-shell .a2-btn.danger { border-color: var(--a2-bad); color: var(--a2-bad-ink); }

/* ------------------------------------------------ 7.8 · document library */
.a2-doc-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(180px, 1fr)); gap: var(--a2-space-3); }
html[data-shell="a2"] body.a2-shell.a2-shell a.a2-doc-card { display: block; border: 1px solid var(--a2-line); border-radius: var(--a2-radius-lg);
  background: var(--a2-surface); overflow: hidden; color: var(--a2-ink); }
.a2-doc-card img, .a2-doc-ph { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: flex; align-items: center;
  justify-content: center; background: var(--a2-surface-raised); }
.a2-doc-cap { display: grid; gap: 2px; padding: var(--a2-space-2) var(--a2-space-3); }
.a2-doc-preview { width: 100%; max-height: 520px; object-fit: contain; border: 0; border-radius: var(--a2-radius-md);
  background: var(--a2-surface-raised); display: block; }
iframe.a2-doc-preview { height: 520px; }

/* 7.14 Accounting landing — one card per journal, per book (Odoo's dashboard shape) */
.a2-jcard { display: grid; gap: var(--a2-space-3); padding: var(--a2-space-4) var(--a2-space-5); align-content: start; }
.a2-jcard-head { display: flex; justify-content: space-between; gap: 8px; align-items: baseline; }
.a2-jcard-head .caption-ar { color: var(--a2-ink-muted); }
.a2-jcard-fig { display: grid; gap: 2px; }
.a2-jcard-foot { display: flex; justify-content: space-between; align-items: center; gap: 8px; flex-wrap: wrap; }

/* 7.14 settings · owner's tools · maintenance leftovers */
.a2-sign { display: grid; gap: 2px; padding-top: var(--a2-space-3); border-top: 1px solid var(--a2-line-strong); text-align: center; }

/* 7.14.1 The A2 Form page — every New / Edit / record action opens here (no inline panels) */
.a2-fp { padding: var(--a2-space-5); }
.a2-fp .a2-rec-head { margin: var(--a2-space-4) 0 var(--a2-space-4); }
.a2-fp-note { margin: 0 0 var(--a2-space-4); }
.a2-fgrid { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: var(--a2-space-4) var(--a2-space-5); max-width: 900px; }
.a2-fgrid > label, .a2-fgrid > .a2-f { display: grid; gap: 4px; align-content: start; min-width: 0; }
.a2-fgrid > label > .label, .a2-fgrid .a2-chips > .label { color: var(--a2-ink-muted); }
.a2-fgrid .wide, .a2-fgrid > .a2-table-wrap, .a2-fgrid > p, .a2-fgrid > div { grid-column: 1 / -1; }
.a2-fgrid input[type=text], .a2-fgrid input[type=date], .a2-fgrid input[type=number], .a2-fgrid input[type=email],
.a2-fgrid input[type=password], .a2-fgrid select, .a2-fgrid textarea { width: 100%; }
.a2-chips { border: 0; padding: 0; margin: 0; display: flex; flex-wrap: wrap; gap: var(--a2-space-2); align-items: center; }
.a2-chips > legend { float: left; width: 100%; padding: 0; margin: 0 0 4px; }
.a2-chipbox { display: inline-flex; align-items: center; gap: 6px; height: 28px; padding: 0 10px; border: 1px solid var(--a2-line);
  border-radius: var(--a2-radius-md); background: var(--a2-surface); cursor: pointer; }
.a2-chipbox input { margin: 0; }
.a2-chipbox:has(input:checked) { background: var(--a2-accent-tint); border-color: var(--a2-accent); color: var(--a2-accent-ink); }
@media (max-width: 760px) { .a2-fgrid { grid-template-columns: 1fr; } }

/* 7.14.2 Sign in, code, first-run setup — the signed-out frame on A2 */
html[data-shell="a2"] body.a2-auth { min-height: 100vh; margin: 0; background: var(--a2-ground); color: var(--a2-ink); font-family: var(--a2-font-sans); }
.a2-auth-main { min-height: 100vh; display: grid; place-items: center; padding: 16px; box-sizing: border-box; }
.a2-auth-card { width: 100%; max-width: 380px; padding: var(--a2-space-6) var(--a2-space-5); box-sizing: border-box; }
.a2-auth-brand { display: flex; align-items: center; gap: 10px; margin-bottom: var(--a2-space-5); }
.a2-auth-brand .a2-mark { display: inline-block; width: 10px; height: 10px; border-radius: var(--a2-radius-sm); background: var(--a2-accent); }
.a2-auth-name { font-family: var(--a2-font-serif); font-size: 17px; font-weight: 600; }
.a2-auth-brand .body-ar { margin-inline-start: auto; font-size: 13px; }
.a2-auth-title { margin: 0 0 var(--a2-space-2); }
.a2-auth-sub { margin: 0 0 var(--a2-space-4); }
.a2-auth-form { display: grid; gap: var(--a2-space-3); margin: 0; }
.a2-auth-form label { display: grid; gap: 4px; }
.a2-auth-form .label { color: var(--a2-ink-muted); }
.a2-auth-form .a2-input { width: 100%; box-sizing: border-box; }
html[data-shell="a2"] body.a2-shell.a2-shell .a2-auth-wide { width: 100%; justify-content: center; height: 38px; }
.a2-auth-or { display: flex; align-items: center; gap: 10px; margin: var(--a2-space-4) 0; color: var(--a2-ink-muted); font-size: 13px; }
.a2-auth-or::before, .a2-auth-or::after { content: ""; flex: 1; border-top: 1px solid var(--a2-line); }
.a2-auth-code { font-family: var(--a2-font-mono); font-size: 22px; letter-spacing: 0.4em; text-align: center; height: 44px; }
.a2-auth-links { display: flex; gap: var(--a2-space-2); justify-content: center; margin: var(--a2-space-4) 0 0; flex-wrap: wrap; }
.a2-auth-foot { margin: var(--a2-space-4) 0 0; text-align: center; }

/* 7.14.3 Accounting landing — the Odoo 19 dashboard shape on RRM tokens: 3-across journal cards per
   book, a left colour strip per type, actions under the title, stats right, a chart in every card */
.a2-jgroup { margin-top: var(--a2-space-6); }
.a2-jgroup > .section-title { margin: 0 0 var(--a2-space-3); }
.a2-jcards { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--a2-space-3); }
@media (max-width: 1100px) { .a2-jcards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 640px) { .a2-jcards { grid-template-columns: 1fr; } }
.a2-jcard { --a2-jc: var(--a2-ink); display: grid; gap: var(--a2-space-3); padding: var(--a2-space-4) var(--a2-space-5);
  border-inline-start: 4px solid var(--a2-jc); align-content: start; min-width: 0; }
.a2-jcard.t-rent { --a2-jc: var(--a2-accent); }
.a2-jcard.t-rcp { --a2-jc: var(--a2-ok); }
.a2-jcard.t-bank { --a2-jc: var(--a2-ink); }
.a2-jcard.t-cash { --a2-jc: var(--a2-ink-muted); }
.a2-jcard.t-bill { --a2-jc: var(--a2-bad); }
.a2-jcard-top { display: flex; justify-content: space-between; gap: var(--a2-space-3); align-items: flex-start; }
.a2-jcard-head { display: grid; gap: 2px; min-width: 0; }
.a2-jcard-head .caption-ar { color: var(--a2-ink-muted); }
.a2-jcard-acts { display: flex; gap: 6px; flex-wrap: wrap; margin-top: 6px; }
.a2-jstats { display: grid; gap: 4px; justify-items: end; text-align: end; flex-shrink: 0; }
.a2-jstat { display: grid; gap: 0; }
.a2-jstat .label { color: var(--a2-ink-muted); }
.a2-chart { display: block; width: 100%; height: 86px; color: var(--a2-jc); }
.a2-chart rect, .a2-chart circle { fill: currentColor; }
.a2-chart rect.z { fill: var(--a2-line-strong); }
.a2-chart line.z { stroke: var(--a2-line-strong); stroke-width: 1; }
.a2-chart path.p { fill: none; stroke: currentColor; stroke-width: 1.5; vector-effect: non-scaling-stroke; }
.a2-chart path.a { fill: currentColor; opacity: .12; }
.a2-chart text { font-family: var(--a2-font-sans); font-size: 9px; fill: var(--a2-ink-muted); }
.a2-chart text.v { font-family: var(--a2-font-mono); fill: var(--a2-ink); }
.a2-line { height: 72px; }
.a2-jcard-foot { margin-top: 2px; }
.a2-jcard.empty .body-strong, .a2-jcard.empty .num-strong { color: var(--a2-ink-faint); }
.a2-jcard.empty { border-inline-start-color: color-mix(in srgb, var(--a2-jc) 35%, transparent); }