/* EdgarAgents XBRL Online Reviewer (XOR) — shared styles.
   Legend colours are fixed by spec: Modified orange, Added green, Removed red, Unchanged black. */
:root {
  --bg: #ffffff; --bg-soft: #f6f8fa; --bg-sunk: #eef1f4; --panel: #ffffff;
  --ink: #1f2328; --ink-2: #424a53; --muted: #656d76; --line: #d0d7de; --line-soft: #e6eaef;
  --accent: #0b5cad; --accent-ink: #ffffff; --accent-soft: #e7f0fb; --focus: #0b5cad;
  --mod: #b35900; --mod-bg: #fff1e0; --mod-line: #f0a35e;
  --add: #1a7f37; --add-bg: #e6f4ea; --add-line: #74c58b;
  --rem: #c62828; --rem-bg: #fdecea; --rem-line: #ef8e8e;
  --unch: #1f2328; --ext: #6f42c1; --ext-bg: #f3edfc;
  --ok: #1a7f37; --bad: #c62828; --warn-bg: #fff8c5; --warn-ink: #6b4f00; --warn-line: #e6cf6b;
  --shadow: 0 8px 24px rgba(31,35,40,.14), 0 1px 3px rgba(31,35,40,.08);
  --radius: 6px; --row-h: 28px;
  --font: system-ui, -apple-system, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
  --mono: ui-monospace, SFMono-Regular, "Cascadia Mono", Consolas, monospace;
  color-scheme: light;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #0d1117; --bg-soft: #151b23; --bg-sunk: #1b222c; --panel: #161b22;
    --ink: #e6edf3; --ink-2: #c9d1d9; --muted: #9198a1; --line: #3d444d; --line-soft: #2a313a;
    --accent: #4493f8; --accent-ink: #0d1117; --accent-soft: #15253d; --focus: #4493f8;
    --mod: #f0883e; --mod-bg: #3a2414; --mod-line: #9b5a24;
    --add: #3fb950; --add-bg: #12301c; --add-line: #2c7a3d;
    --rem: #f85149; --rem-bg: #3a1618; --rem-line: #a03a36;
    --unch: #e6edf3; --ext: #b392f0; --ext-bg: #2a2140; --warn-bg: #3a3008; --warn-ink: #e3c35a; --warn-line: #6d5a14;
    --shadow: 0 8px 24px rgba(0,0,0,.5);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #0d1117; --bg-soft: #151b23; --bg-sunk: #1b222c; --panel: #161b22;
  --ink: #e6edf3; --ink-2: #c9d1d9; --muted: #9198a1; --line: #3d444d; --line-soft: #2a313a;
  --accent: #4493f8; --accent-ink: #0d1117; --accent-soft: #15253d; --focus: #4493f8;
  --mod: #f0883e; --mod-bg: #3a2414; --mod-line: #9b5a24;
  --add: #3fb950; --add-bg: #12301c; --add-line: #2c7a3d;
  --rem: #f85149; --rem-bg: #3a1618; --rem-line: #a03a36;
  --unch: #e6edf3; --ext: #b392f0; --ext-bg: #2a2140; --warn-bg: #3a3008; --warn-ink: #e3c35a; --warn-line: #6d5a14;
  --shadow: 0 8px 24px rgba(0,0,0,.5);
  color-scheme: dark;
}
* { box-sizing: border-box; }
html, body { margin: 0; height: 100%; }
/* 17 Oct (owner): the body grows with the page — fixed at the window height, the app bar (sticky in the body) scrolled away
   after one screen and the pinned project header left a gap above it where the page showed through */
body { height: auto; min-height: 100%; }
body { font: 13px/1.45 var(--font); color: var(--ink); background: var(--bg); -webkit-font-smoothing: antialiased; }
a { color: var(--accent); text-decoration: none; }
a:hover { text-decoration: underline; }
h1 { font-size: 20px; margin: 0 0 4px; font-weight: 650; }
h2 { font-size: 15px; margin: 18px 0 8px; font-weight: 650; }
h3 { font-size: 13px; margin: 12px 0 6px; font-weight: 650; }
code, .mono { font-family: var(--mono); font-size: 12px; }
.num { font-variant-numeric: tabular-nums; }
.muted { color: var(--muted); }
.small { font-size: 12px; }
.hidden { display: none !important; }
:focus-visible { outline: 2px solid var(--focus); outline-offset: 1px; }

/* ---------- buttons & inputs */
.btn { display: inline-flex; align-items: center; gap: 6px; height: 30px; padding: 0 12px; border: 1px solid var(--line);
  background: var(--bg-soft); color: var(--ink); border-radius: var(--radius); cursor: pointer; font: inherit; font-weight: 550; white-space: nowrap; }
.btn:hover { background: var(--bg-sunk); text-decoration: none; }
.btn.primary { background: var(--accent); border-color: var(--accent); color: var(--accent-ink); }
.btn.primary:hover { filter: brightness(1.08); }
.btn.danger { color: var(--rem); }
.btn.sm { height: 26px; padding: 0 8px; font-size: 12px; }
.btn.icon { width: 32px; padding: 0; justify-content: center; }
.btn[disabled] { opacity: .5; cursor: not-allowed; }
.btn.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
input[type=text], input[type=email], input[type=password], input[type=search], input[type=number], input[type=date], select, textarea {
  font: inherit; color: var(--ink); background: var(--bg); border: 1px solid var(--line); border-radius: var(--radius);
  height: 30px; padding: 0 8px; min-width: 0; }
textarea { height: auto; padding: 6px 8px; resize: vertical; }
label.field { display: flex; flex-direction: column; gap: 4px; font-weight: 550; font-size: 12px; color: var(--ink-2); }
.row { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.grow { flex: 1; }
.stack { display: flex; flex-direction: column; gap: 10px; }

/* ---------- app chrome */
.topbar { display: flex; align-items: center; gap: 12px; height: 48px; padding: 0 16px; border-bottom: 1px solid var(--line); background: var(--panel); position: sticky; top: 0; z-index: 30; }
.brand { font-weight: 700; letter-spacing: .2px; display: flex; align-items: center; gap: 8px; color: var(--ink); }
.brand .logo { width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; flex: none; }
.brand .logo img { width: 100%; height: 100%; display: block; }      /* the EA mark: white disc, navy "ea", cyan accent (vector) */
.topbar nav a { color: var(--ink-2); padding: 6px 8px; border-radius: 6px; font-weight: 550; }
.topbar nav a.active, .topbar nav a:hover { background: var(--bg-sunk); text-decoration: none; }
.page { max-width: 1280px; margin: 0 auto; padding: 20px 16px 60px; }
.card { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 14px 16px; }
.cards { display: grid; gap: 12px; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); }
.pill { display: inline-flex; align-items: center; gap: 4px; padding: 1px 8px; border-radius: 999px; font-size: 11px; font-weight: 650; border: 1px solid var(--line); background: var(--bg-soft); color: var(--ink-2); white-space: nowrap; }
.pill.ok { color: var(--ok); border-color: var(--add-line); background: var(--add-bg); }
.pill.bad { color: var(--bad); border-color: var(--rem-line); background: var(--rem-bg); }
.pill.warn { color: var(--mod); border-color: var(--mod-line); background: var(--mod-bg); }
.pill.info { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); }
table.list { width: 100%; border-collapse: collapse; }
table.list th, table.list td { text-align: left; padding: 7px 8px; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
table.list th { font-size: 12px; color: var(--muted); font-weight: 600; background: var(--bg-soft); position: sticky; top: 0; }
table.list tr:hover td { background: var(--bg-soft); }
.banner { padding: 8px 12px; border-radius: var(--radius); border: 1px solid var(--warn-line); background: var(--warn-bg); color: var(--warn-ink); display: flex; gap: 8px; align-items: flex-start; }
.banner.err { border-color: var(--rem-line); background: var(--rem-bg); color: var(--rem); }
.banner.info { border-color: var(--line); background: var(--bg-soft); color: var(--ink-2); }
.banner.warn { display: block; }                                   /* 17 Oct: upload warnings — title, list, buttons stacked */
.toast-wrap { position: fixed; bottom: 16px; right: 16px; display: flex; flex-direction: column; gap: 8px; z-index: 100; }
.toast { background: var(--ink); color: var(--bg); padding: 10px 14px; border-radius: 8px; box-shadow: var(--shadow); max-width: 420px; }
.toast.err { background: var(--rem); color: #fff; }
.progress { height: 6px; background: var(--bg-sunk); border-radius: 99px; overflow: hidden; }
.progress > i { display: block; height: 100%; background: var(--accent); width: 0; transition: width .3s; }
.progress.ok > i { background: var(--ok); }
.empty { padding: 40px; text-align: center; color: var(--muted); }

/* ---------- modal / popover */
.modal-back { position: fixed; inset: 0; background: rgba(15,20,25,.45); display: grid; place-items: center; z-index: 60; padding: 16px; }
.modal { background: var(--panel); border-radius: 10px; box-shadow: var(--shadow); width: min(720px, 100%); max-height: calc(100vh - 32px); display: flex; flex-direction: column; border: 1px solid var(--line); }
.modal header { padding: 14px 16px; border-bottom: 1px solid var(--line); display: flex; align-items: center; gap: 8px; }
.modal header h2 { margin: 0; flex: 1; }
.modal .body { padding: 14px 16px; overflow: auto; }
.modal footer { padding: 12px 16px; border-top: 1px solid var(--line); display: flex; justify-content: flex-end; gap: 8px; }
.modal.wide { width: min(1100px, 100%); }
.pop { position: absolute; z-index: 50; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); padding: 12px; min-width: 240px; max-width: 360px; }
.pop h3 { margin-top: 0; }
.checks { display: flex; flex-direction: column; gap: 4px; }
.checks label { display: flex; gap: 6px; align-items: center; cursor: pointer; }

/* ---------- legend colours */
.st-Modified, .st-M { color: var(--mod); }
.st-Added, .st-A { color: var(--add); }
.st-Removed, .st-R { color: var(--rem); }
.st-Unchanged, .st-U { color: var(--unch); }
.ico { display: inline-block; width: 1.1em; text-align: center; font-weight: 800; }
.badge { display: inline-block; font-size: 9.5px; line-height: 13px; min-width: 13px; text-align: center; padding: 0 2px; border-radius: 3px; border: 1px solid currentColor; margin-left: 3px; font-weight: 700; vertical-align: 1px; }
.dot { width: 8px; height: 8px; border-radius: 50%; display: inline-block; }
.dot.M { background: var(--mod); } .dot.A { background: var(--add); } .dot.R { background: var(--rem); } .dot.U { background: var(--muted); }

/* ---------- login */
.login-wrap { min-height: 100vh; display: grid; place-items: center; padding: 16px; background: var(--bg-soft); }
.login { width: min(380px, 100%); }

/* ---------- viewer layout (V-01 … V-31) */
:root {
  --vh-preview: #17365D; --vh-compare: #3B2A6B; --sec-bg: #E2EAF4; --sec-ink: #17365D; --sub-bg: #F1F5F9; --sub-ink: #334155;
  --row-ink: #1f2937; --row-hover: #F0F7FF; --row-sel: #DCEBFA; --stripe: rgba(15, 23, 42, .025);
  --std: #16a34a; --std-bg: #dcfce7; --ext-c: #ea7a0c; --ext-c-bg: #ffedd5; --cmp: #3B2A6B; --cmp-bg: #ece8f6;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --vh-preview: #1e3a5f; --vh-compare: #4c3a85; --sec-bg: #1c2a3d; --sec-ink: #b9d0ee; --sub-bg: #18202b; --sub-ink: #c3cfdd;
    --row-ink: #e6edf3; --row-hover: #15253d; --row-sel: #1d3a5c; --stripe: rgba(255, 255, 255, .03);
    --std: #3fb950; --std-bg: #12301c; --ext-c: #f0883e; --ext-c-bg: #3a2414; --cmp: #b9a6f2; --cmp-bg: #2a2147;
  }
}
:root[data-theme="dark"] {
  --vh-preview: #1e3a5f; --vh-compare: #4c3a85; --sec-bg: #1c2a3d; --sec-ink: #b9d0ee; --sub-bg: #18202b; --sub-ink: #c3cfdd;
  --row-ink: #e6edf3; --row-hover: #15253d; --row-sel: #1d3a5c; --stripe: rgba(255, 255, 255, .03);
  --std: #3fb950; --std-bg: #12301c; --ext-c: #f0883e; --ext-c-bg: #3a2414; --cmp: #b9a6f2; --cmp-bg: #2a2147;
}
body.viewer { overflow: hidden; }
body.resizing, body.resizing * { cursor: col-resize !important; user-select: none !important; }
.nowrap { white-space: nowrap; }
.v-app { display: grid; grid-template-rows: auto auto 1fr auto; grid-template-columns: minmax(0, 1fr); height: 100vh; }
/* the Untagged panel's wide table scrolls inside the panel; it no longer widens the page past its close button */
.v-head { border-bottom: 1px solid var(--line); background: var(--panel); padding: 5px 10px; display: flex; flex-direction: column; gap: 4px; }
.v-bar { display: flex; align-items: center; gap: 6px 10px; flex-wrap: wrap; min-height: 32px; }
.v-bar > * { flex: none; }
.v-bar .grow { flex: 1 1 0; min-width: 4px; }
.v-bar .co { font-size: 15px; font-weight: 700; max-width: 320px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.v-bar .hm { color: var(--ink-2); font-weight: 550; font-size: 12.5px; padding-left: 9px; border-left: 1px solid var(--line); line-height: 16px; }
.v-bar .hm.b { color: var(--ink); font-weight: 650; border-left: 0; padding-left: 0; }
.v-bar .hm.mono { font-size: 12px; }
.run-badge { background: var(--vh-preview); color: #fff; border-radius: 999px; padding: 2px 10px; font-size: 11.5px; font-weight: 650; white-space: nowrap; }
.cmp-badge { background: var(--vh-compare); color: #fff; border-radius: 999px; padding: 2px 10px; font-size: 11.5px; font-weight: 650; }
.hchips { display: inline-flex; gap: 3px; flex-wrap: wrap; align-items: center; }
.pn-foot { padding: 6px 10px; border-top: 1px solid var(--line-soft); flex-wrap: wrap; row-gap: 2px; }
.hchip { display: inline-flex; align-items: center; gap: 3px; height: 22px; padding: 0 7px; border: 1px solid var(--line); border-radius: 999px; background: var(--bg-soft);
  color: var(--ink-2); font: inherit; font-size: 11.5px; white-space: nowrap; }
.hchip b { color: var(--ink); font-variant-numeric: tabular-nums; font-weight: 700; }
button.hchip { cursor: pointer; }
button.hchip:hover { border-color: var(--accent); }
.hchip.on { background: var(--accent-soft); border-color: var(--accent); color: var(--accent); }
.hchip.on b { color: var(--accent); }
.hchip.bad b { color: var(--bad); }
.hchip.M b { color: var(--mod); } .hchip.A b { color: var(--add); } .hchip.R b { color: var(--rem); }
.hchip.plain { border: 0; background: none; padding: 0; }
.hchip.grp { padding: 0 2px; gap: 0; }
.hchip .cp { border: 0; background: none; font: inherit; font-weight: 700; padding: 0 5px; cursor: pointer; border-radius: 99px; line-height: 20px; font-variant-numeric: tabular-nums; }
.hchip .cp:hover { background: var(--bg-sunk); }
.hchip .cp.M { color: var(--mod); } .hchip .cp.A { color: var(--add); } .hchip .cp.R { color: var(--rem); }
.legend-mini { display: inline-flex; align-items: center; gap: 4px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.legend-mini .lg { font-size: 11px; margin-left: 6px; } .legend-mini .lg.M { color: var(--mod); } .legend-mini .lg.A { color: var(--add); } .legend-mini .lg.R { color: var(--rem); }
.legend-mini .cd + .cd, .legend-mini .cd:not(:first-child) { margin-left: 6px; }
.seg { display: inline-flex; border: 1px solid var(--line); border-radius: var(--radius); overflow: hidden; }
.seg button { border: 0; background: var(--bg-soft); color: var(--ink-2); padding: 0 10px; height: 26px; cursor: pointer; font: inherit; font-size: 12px; font-weight: 600; }
.seg button.on { background: var(--accent); color: var(--accent-ink); }
.iconbar { display: flex; gap: 3px; align-items: center; }
.iconbar .btn.icon { width: 30px; height: 28px; position: relative; font-size: 14px; }
.iconbar .btn.icon .cnt { position: absolute; top: -5px; right: -5px; background: var(--accent); color: var(--accent-ink); border-radius: 99px; font-size: 9px; padding: 0 4px; line-height: 14px; }
.hsearch { display: inline-flex; align-items: center; position: relative; }
.hsearch input { position: absolute; right: 34px; top: 0; width: 0; padding: 0; border-width: 0; transition: width .15s; height: 28px; z-index: 6; }
.hsearch.open input { width: 280px; padding: 0 8px; border-width: 1px; box-shadow: var(--shadow); }
.v-notes { display: flex; align-items: center; gap: 8px; font-size: 11.5px; color: var(--ink-2); background: var(--bg-soft); border: 1px solid var(--line-soft);
  border-radius: 6px; padding: 2px 4px 2px 10px; white-space: nowrap; overflow: hidden; }
.v-notes > span { overflow: hidden; text-overflow: ellipsis; }
.v-notes .warn { color: var(--warn-ink); }
.v-notes .sep { color: var(--muted); flex: none; }
.v-notes .x { margin-left: auto; border: 0; background: none; cursor: pointer; color: var(--muted); font: inherit; padding: 0 6px; flex: none; }
.mode-compare .v-head { box-shadow: inset 0 3px 0 var(--vh-compare); }

/* main grid: role list | role | results; side panels collapse to a thin strip (V-11) */
.v-main { display: grid; grid-template-columns: 270px minmax(0, 1fr) 330px; min-height: 0; }
.v-main.left-off { grid-template-columns: 24px minmax(0, 1fr) 330px; }
.v-main.right-off { grid-template-columns: 270px minmax(0, 1fr) 24px; }
.v-main.left-off.right-off { grid-template-columns: 24px minmax(0, 1fr) 24px; }
.panel { display: flex; flex-direction: column; min-width: 0; min-height: 0; background: var(--panel); position: relative; }
.pn-head { display: flex; align-items: center; gap: 6px; padding: 5px 8px; border-bottom: 1px solid var(--line); min-height: 34px; }
.pn-head b { font-size: 12px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); }
.pn-head .pn-x { width: 24px; height: 22px; }
.pn-body { overflow: auto; flex: 1; min-height: 0; }
.pn-strip { display: none; position: absolute; inset: 0; border: 0; background: var(--bg-soft); cursor: pointer; color: var(--ink-2); padding: 6px 0;
  flex-direction: column; align-items: center; gap: 10px; font: inherit; font-weight: 700; }
.pn-strip .vt { writing-mode: vertical-rl; font-size: 11px; letter-spacing: .5px; text-transform: uppercase; color: var(--muted); }
.pn-strip:hover { background: var(--bg-sunk); }
.left-off .v-nav > :not(.pn-strip), .right-off .v-right > :not(.pn-strip) { display: none; }
.left-off .v-nav .pn-strip, .right-off .v-right .pn-strip { display: flex; }
.v-nav { border-right: 1px solid var(--line); }
.v-right { border-left: 1px solid var(--line); }
.v-nav .grp { font: inherit; font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); padding: 9px 10px 4px; font-weight: 700; display: flex; gap: 6px; align-items: center; width: 100%; border: 0; background: none; cursor: pointer; text-align: left; }
.v-nav .grp:hover { color: var(--ink); }
.v-nav .grp .car { width: 10px; display: inline-block; }
.v-nav .role .t.M { color: var(--mod); font-weight: 600; }
.v-nav .role .t.A { color: var(--add); }
.v-nav .role .t.R { color: var(--rem); text-decoration: line-through; }
.rh .rt.M { color: #ffc58a; } .rh .rt.A { color: #9be5ad; } .rh .rt.R { color: #ffaaa5; text-decoration: line-through; }
.tip .chl b.M { color: var(--mod); } .tip .chl b.A { color: var(--add); } .tip .chl b.R { color: var(--rem); text-decoration: line-through; }
.cm-browse .ctl { display: grid; grid-template-columns: auto 1fr; gap: 4px 8px; align-items: center; padding: 8px 10px; font-size: 12px; }
.cm-browse .ctl select { height: 26px; }
.cm-browse .sts { display: flex; flex-wrap: wrap; gap: 4px 10px; padding: 0 10px 6px; font-size: 12px; }
.cm-browse .sts label { display: inline-flex; gap: 4px; align-items: center; }
.cm-pill { font-size: 10.5px; border-radius: 99px; padding: 0 6px; border: 1px solid var(--line); white-space: nowrap; }
.cm-pill.u { color: var(--mod); border-color: var(--mod-line); background: var(--mod-bg); }
.cm-pill.a { color: var(--accent); border-color: var(--accent); background: var(--accent-soft); }
.cm-pill.ok { color: var(--ok); border-color: var(--add-line); background: var(--add-bg); }
.cm-pill.orph { color: var(--rem); border-color: var(--rem-line); background: var(--rem-bg); }
.orph-card { margin: 4px 10px; padding: 6px 8px; border: 1px dashed var(--rem-line); border-radius: 6px; font-size: 12px; }
.remap-bar { position: fixed; left: 50%; transform: translateX(-50%); top: 52px; z-index: 70; background: var(--ink); color: var(--bg); padding: 6px 12px; border-radius: 8px; box-shadow: var(--shadow); font-size: 12.5px; display: flex; gap: 10px; align-items: center; }
.remap-bar button { font: inherit; border: 0; border-radius: 6px; padding: 2px 8px; cursor: pointer; }
.v-nav .role { display: grid; grid-template-columns: auto 1fr auto; gap: 1px 6px; align-items: center; padding: 4px 10px; cursor: pointer; border-left: 3px solid transparent; }
.mode-preview .v-nav .role { grid-template-columns: 1fr auto; }
.v-nav .role.sub { padding-left: 24px; }
.v-nav .role.sub .t { font-size: 12px; color: var(--ink-2); }
.v-nav .role:hover { background: var(--bg-soft); }
.v-nav .role.cur { background: var(--accent-soft); border-left-color: var(--accent); }
.v-nav .role .t { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 12.5px; color: var(--ink); }
.v-nav .role .t.st-Unchanged { color: var(--ink); }
.v-nav .role .cnts { display: flex; gap: 3px; font-size: 10.5px; font-weight: 700; font-variant-numeric: tabular-nums; align-items: center; }
.v-nav .role .tc { background: var(--accent-soft); color: var(--accent); border-radius: 99px; padding: 0 5px; }
.v-nav .role .rsub { grid-column: 1 / -1; font-size: 10.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 20px; }
.mode-preview .v-nav .role .rsub { padding-left: 0; }
.v-nav .role .bar { grid-column: 1 / -1; height: 2px; background: var(--bg-sunk); border-radius: 2px; overflow: hidden; }
.v-nav .role .bar i { display: block; height: 100%; background: var(--ok); }
.cm-badge { font: inherit; font-size: 10.5px; color: var(--accent); background: var(--accent-soft); border: 0; border-radius: 4px; padding: 0 4px; line-height: 16px; cursor: pointer; font-weight: 700; }

/* center */
.v-center { display: flex; flex-direction: column; min-width: 0; min-height: 0; }
.filterbar { display: flex; align-items: center; gap: 8px; padding: 4px 8px; border-bottom: 1px solid var(--line); background: var(--bg-soft); flex-wrap: wrap; }
.fchip { display: inline-flex; align-items: center; gap: 6px; background: var(--accent-soft); color: var(--accent); border: 1px solid var(--accent); border-radius: 999px; padding: 1px 4px 1px 10px; font-size: 12px; font-weight: 600; }
.fchip .x { border: 0; background: none; color: inherit; cursor: pointer; font: inherit; padding: 0 4px; border-radius: 99px; }
.fchip .x:hover { background: var(--bg); }
.grid-wrap { flex: 1; overflow: auto; position: relative; background: var(--bg); padding: 0 8px 24px; }   /* V-07: 8px instead of a gutter */
.g-inner { min-width: max-content; }

/* role grid (V-14 … V-24) */
table.gt { border-collapse: separate; border-spacing: 0; table-layout: fixed; margin-bottom: 18px; color: var(--row-ink); }
table.gt th, table.gt td { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; border-bottom: 1px solid var(--line-soft); }
table.gt thead th { position: sticky; top: 0; z-index: 3; background: var(--vh-preview); color: #fff; font-size: 11.5px; font-weight: 600; padding: 5px 8px;
  vertical-align: bottom; text-align: right; border-bottom: 0; border-right: 1px solid rgba(255,255,255,.12); line-height: 1.3; }
.mode-compare table.gt thead th { background: var(--vh-compare); }
table.gt thead th.l { position: sticky; left: 0; z-index: 4; text-align: left; white-space: normal; vertical-align: top; }
table.gt thead th .grp { display: block; color: rgba(255,255,255,.75); font-weight: 500; font-size: 11px; }
table.gt thead th .dt { display: block; font-weight: 700; }
table.gt thead th .vs { display: block; font-weight: 400; font-size: 10.5px; color: rgba(255,255,255,.8); }  /* C-03 paired prior period */
table.gt thead th.m { text-align: left; }
table.gt thead th.c { text-align: center; }
table.gt thead th .rz { position: absolute; top: 0; right: -3px; width: 7px; height: 100%; cursor: col-resize; z-index: 2; }
table.gt thead th .rz:hover { background: rgba(255,255,255,.35); }
table.gt thead th.colst-current { box-shadow: inset 0 3px 0 var(--add-line); }
table.gt thead th.colst-base { box-shadow: inset 0 3px 0 var(--rem-line); }
table.gt thead th.colst-base .dt { text-decoration: line-through; }
.rh .rn { display: flex; align-items: baseline; gap: 6px; flex-wrap: wrap; }
.rh .rt { font-size: 13px; font-weight: 700; color: #fff; white-space: normal; }
.rh .rt.st-Modified, .rh .rt.st-Added, .rh .rt.st-Removed { color: #fff; }
.rh .lc { font-weight: 500; color: rgba(255,255,255,.75); }
.rh .un { font-weight: 500; color: rgba(255,255,255,.8); font-size: 11px; margin-top: 2px; }
.rh .rcg { font-weight: 500; font-size: 11px; margin-top: 2px; color: rgba(255,255,255,.85); }
.rh .rcg .st-M { color: #ffc58a; } .rh .rcg .st-A { color: #9be5ad; } .rh .rcg .st-R { color: #ffaaa5; }
.rh .cm-badge, th .cm-badge.hd { background: rgba(255,255,255,.2); color: #fff; }
th .cm-badge.hd { position: absolute; top: 3px; left: 4px; }
table.gt.sub thead th { position: static; }
table.gt.sub thead th.l { position: sticky; left: 0; }
table.gt.sub { margin-top: 6px; }
.ap-h { display: inline-flex; align-items: center; gap: 4px; }
.ap-h .linkbtn { color: #fff; font-size: 11.5px; font-weight: 600; padding: 0; }
.ap-h input { accent-color: #fff; }

table.gt tbody td { padding: 4px 8px; line-height: 19px; background: var(--bg); color: var(--row-ink); font-variant-numeric: tabular-nums; }
table.gt tbody td.l { position: sticky; left: 0; z-index: 1; white-space: normal; overflow-wrap: anywhere; text-align: left; }
table.gt.virt tbody td.l { white-space: nowrap; }
table.gt tbody td.v { text-align: right; position: relative; }
table.gt tbody td.v.has-ck { padding-right: 22px; }
table.gt tbody td.v.txt { text-align: left; color: var(--ink-2); cursor: pointer; }
table.gt tbody td.v.tl { text-align: left; }
table.gt thead th.p.pc { text-align: center; }      /* 18 Oct (text_left_v1): period headings centred, as the SEC viewer */      /* 18 Oct (text_left_v1): non-numeric values left-aligned, as the SEC viewer */
table.gt tbody td.m { text-align: left; font-size: 12px; color: var(--ink-2); }
table.gt tbody td.m.c { text-align: center; }
table.gt tbody td.def { white-space: normal; }
table.gt tbody td.def .clamp { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; line-height: 16px; font-size: 11.5px; }
table.gt.virt tbody td.def .clamp { -webkit-line-clamp: 1; }
table.gt tbody td.mono { font-size: 11.5px; }
table.gt tbody tr.sec td { background: var(--sec-bg); color: var(--sec-ink); font-weight: 700; }
table.gt tbody tr.subsec td { background: var(--sub-bg); color: var(--sub-ink); font-weight: 700; }
table.gt tbody tr.tot td.l, table.gt tbody tr.tot td.v { font-weight: 600; }
.stripes table.gt tbody tr.odd:not(.sec):not(.subsec) td { background-image: linear-gradient(var(--stripe), var(--stripe)); }
table.gt tbody tr:hover td { background: var(--row-hover); background-image: none; }
table.gt tbody tr.sel td { background: var(--row-sel); background-image: none; }
table.gt tbody tr.focus td { box-shadow: inset 0 1px 0 var(--accent), inset 0 -1px 0 var(--accent); }
table.gt tbody tr.flash td { animation: flash 1.2s ease-out; }
table.gt tbody tr.sp td { padding: 0; border: 0; background: transparent; }
table.gt tbody tr.empty-row td { text-align: center; color: var(--muted); padding: 24px; white-space: normal; }
@keyframes flash { 0% { background: var(--accent-soft); } 100% { } }
td.v .ck { position: absolute; right: 5px; top: 50%; transform: translateY(-50%); font-weight: 800; cursor: pointer; }
.ck.ok, .calc-ok { color: var(--ok); font-weight: 800; }
.ck.bad, .calc-bad { color: var(--bad); font-weight: 800; }
td.v .more { font-size: 10px; color: var(--muted); margin-left: 3px; }
td.v .cm-dot { position: absolute; top: 1px; left: 2px; font: 700 9px/12px var(--font); color: var(--accent); background: var(--accent-soft); border: 0; border-radius: 6px; padding: 0 3px; cursor: pointer; }
td.v.hit { box-shadow: inset 3px 0 0 var(--accent); }
/* B-03: an added / removed row is coloured in every cell */
table.gt tbody tr.row-A td, table.gt tbody tr.row-A td .lab, table.gt tbody tr.row-A td .cpt { color: var(--add); }
table.gt tbody tr.row-R td, table.gt tbody tr.row-R td .lab, table.gt tbody tr.row-R td .cpt { color: var(--rem); text-decoration: line-through; }
/* B-05: Negated shows a small "Yes" chip (violet: green is reserved for Added) */
.neg { display: inline-block; font-size: 10.5px; font-weight: 700; color: #6d28d9; background: #ede9fe; border-radius: 99px; padding: 0 7px; line-height: 16px; }
/* B-16: approval kept, value / attributes changed since */
.appr-chg { color: #d97706; font-size: 11px; margin-left: 3px; cursor: help; vertical-align: 1px; }
.appr-chg-t { color: #b45309; margin-top: 2px; }
/* V-15: one dot before each label — green standard, orange extension, on a pale badge */
.cd { display: inline-block; width: 12px; height: 12px; border-radius: 50%; vertical-align: -1px; margin-right: 6px; flex: none; line-height: 0;
  background: radial-gradient(circle, var(--std) 0 3px, var(--std-bg) 3.5px); }
.cd.ext { background: radial-gradient(circle, var(--ext-c) 0 3px, var(--ext-c-bg) 3.5px); }
.lab { user-select: text; }
.hid-ico { display: inline-block; font-size: 10px; line-height: 13px; color: var(--muted); border: 1px solid var(--line); border-radius: 3px; padding: 0 2px; margin-left: 5px; font-weight: 600; vertical-align: 1px; }
/* V-24: black text; legend colours only on what changed; concepts underline on hover only */
.cpt { color: inherit; cursor: pointer; }
.cpt:hover { text-decoration: underline; }
table.gt tbody td.M, table.gt tbody td.l.M .lab { color: var(--mod); font-weight: 600; }
table.gt tbody td.A, table.gt tbody td.l.A .lab { color: var(--add); font-weight: 600; }
table.gt tbody td.R, table.gt tbody td.l.R .lab { color: var(--rem); text-decoration: line-through; }
/* G-05 (R10): a text cell follows the legend like any value cell — the text-cell grey is only for unchanged text */
table.gt tbody tr.row-A td.v.txt, table.gt tbody td.v.txt.A { color: var(--add); }
table.gt tbody tr.row-R td.v.txt, table.gt tbody td.v.txt.R { color: var(--rem); text-decoration: line-through; }
table.gt tbody td.v.txt.M { color: var(--mod); }
/* R19: a member heading added / removed is green / red struck in every cell, like its lines */
table.gt tbody tr.dimh.row-A td, table.gt tbody tr.dimh.row-A td .lab { color: var(--add); }
table.gt tbody tr.dimh.row-R td, table.gt tbody tr.dimh.row-R td .lab { color: var(--rem); text-decoration: line-through; }
table.gt tbody tr.dimh td.m.mono .mq { font-weight: 500; }
table.gt tbody tr.dimh td.m.M { color: var(--mod); }          /* G-04: a mapped member whose QName changed */
/* R21: footnote markers next to values and the role's footnote list below the table */
sup.fnm { font-size: 9.5px; margin-left: 2px; color: var(--accent); font-weight: 600; vertical-align: super; line-height: 0; }
sup.fnm.A { color: var(--add); } sup.fnm.R { color: var(--rem); text-decoration: line-through; } sup.fnm.M { color: var(--mod); }
.fn-list { font-size: 12px; color: var(--ink-2); padding: 6px 10px 12px; max-width: 1100px; }
.fn-list .fn-i { padding: 2px 0; cursor: help; } .fn-list .fn-i b { color: var(--accent); margin-right: 2px; }
.fn-list .fn-i.A, .fn-list .fn-i.A b { color: var(--add); } .fn-list .fn-i.R, .fn-list .fn-i.R b { color: var(--rem); text-decoration: line-through; }
.fn-list .fn-i.M, .fn-list .fn-i.M b { color: var(--mod); }
.tip .fn-h { margin-top: 6px; } .tip .fn-hi { margin-top: 2px; } .tip .fn-hi.st-Added { color: var(--add); }
.tip .fn-hi.st-Removed { color: var(--rem); text-decoration: line-through; } .tip .fn-hi.st-Modified b { color: var(--mod); }
.tip .fn-hi .fn-st { font-weight: 600; text-decoration: none; display: inline-block; margin-right: 4px; }   /* 17 Oct: "Footnote added / removed / text changed" */
/* G-02: hover / modal actions and the current-source view */
.tb-acts { display: flex; gap: 6px; margin-top: 6px; flex-wrap: wrap; }
.src-bar { display: flex; align-items: center; gap: 12px; margin-bottom: 8px; }
.src-doc { user-select: text; }
table.gt tbody td.M[data-e], table.gt tbody td.A[data-e], table.gt tbody td.R[data-e], td[data-mk].M { cursor: help; }
table.gt tbody td input[type=checkbox] { width: 14px; height: 14px; margin: 0; cursor: pointer; accent-color: var(--ok); vertical-align: -2px; }
.cm-ico { font: inherit; font-size: 11px; color: var(--accent); cursor: pointer; padding: 0 3px; border-radius: 4px; border: 0; background: none; line-height: 18px; }
.cm-ico:hover { background: var(--bg-sunk); }
.cm-ico.has { background: var(--accent-soft); font-weight: 700; }
.cm-ico.changed { color: var(--mod); }
.linkbtn { border: 0; background: none; color: var(--accent); font: inherit; font-size: 12px; cursor: pointer; padding: 0 4px; }
.linkbtn:hover { text-decoration: underline; }
.linkbtn[disabled] { opacity: .45; cursor: not-allowed; text-decoration: none; }
.linkbtn.danger, .btn.danger { color: var(--rem); }
.grp-h { display: flex; align-items: center; gap: 4px; margin-top: 4px; }
.checks.two { display: grid; grid-template-columns: 1fr 1fr; gap: 4px 12px; }
.xroles { max-height: 240px; overflow: auto; border: 1px solid var(--line-soft); border-radius: 6px; padding: 4px 8px; }
.thread .c.deleted { font-style: italic; }

/* right panel */
.v-right .tabs { display: flex; gap: 2px; padding: 4px 8px 0; border-bottom: 1px solid var(--line); overflow-x: auto; }
.v-right .tabs button { border: 0; background: none; padding: 6px 8px; cursor: pointer; color: var(--muted); font: inherit; font-weight: 600; border-bottom: 2px solid transparent; white-space: nowrap; }
.v-right .tabs button.on { color: var(--ink); border-bottom-color: var(--accent); }
.v-right .res { overflow: auto; flex: 1; padding-bottom: 20px; }
.res .rg { font-size: 11.5px; font-weight: 700; padding: 8px 10px 3px; color: var(--ink-2); position: sticky; top: 0; background: var(--panel); border-bottom: 1px solid var(--line-soft); display: flex; gap: 6px; align-items: center; z-index: 1; }
.res .ri { padding: 5px 10px 5px 14px; cursor: pointer; border-left: 3px solid transparent; display: grid; grid-template-columns: 1fr auto; gap: 2px 8px; font-size: 12px; }
.res .ri:hover { background: var(--bg-soft); }
.res .ri.cur { border-left-color: var(--accent); background: var(--accent-soft); }
.res .ri .lb { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.res .ri .lb.wrap { white-space: normal; }
.res .ri .sub { grid-column: 1 / 3; color: var(--muted); font-size: 11px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.res .ri.M { border-left-color: var(--mod-line); } .res .ri.A { border-left-color: var(--add-line); } .res .ri.R { border-left-color: var(--rem-line); }
.brk-wrap { border-bottom: 2px solid var(--line); padding-bottom: 6px; margin-bottom: 4px; }
.brk-scroll { overflow-x: auto; padding: 4px 8px; }
table.cmp { width: 100%; border-collapse: collapse; font-size: 12px; }
table.cmp th, table.cmp td { padding: 3px 6px; text-align: left; vertical-align: top; border-bottom: 1px solid var(--line-soft); word-break: break-word; }
table.cmp th { font-size: 11px; color: var(--muted); font-weight: 600; }
.tip table.cmp td:first-child { white-space: nowrap; word-break: normal; }
table.cmp .r { text-align: right; } table.cmp .c { text-align: center; } table.cmp .b { font-weight: 700; }
table.cmp tr.chg td { background: var(--mod-bg); }
table.cmp tr.chg td:first-child { color: var(--mod); font-weight: 650; }
table.cmp tr.tot td { border-top: 1px solid var(--line); font-weight: 600; }
table.brk td, table.brk th { white-space: nowrap; }
table.brk td:first-child { white-space: normal; min-width: 140px; }

/* untagged review panel (V-34) */
.drawer { border-top: 1px solid var(--line); background: var(--panel); min-width: 0; }
.drawer > header > .drawer-x { margin-left: 4px; }
.drawer > header { display: flex; align-items: center; gap: 8px; padding: 5px 12px; flex-wrap: wrap; }
.drawer > header input[type=search] { width: 240px; height: 26px; }
.drawer > header select { height: 26px; }
.drawer .dbody { height: 280px; overflow: auto; border-top: 1px solid var(--line-soft); }
.drawer td.reason { max-width: 380px; color: var(--ink-2); }

/* 18 Oct (dumps_ui_v1): one Download control for every dump — button, menu, format badges */
.dl-btn { display: inline-flex; align-items: center; gap: 5px; font-weight: 600; white-space: nowrap; }
.dl-btn .dl-ico { font-size: 13px; line-height: 1; color: var(--accent); }
.dl-btn .dl-car { font-size: 10px; opacity: .7; }
.pop:has(> .dl-menu) { padding: 0; width: auto !important; }
.dl-menu { min-width: 300px; max-width: 380px; padding: 6px; }
.dl-menu .dl-head { display: flex; flex-direction: column; gap: 1px; padding: 6px 10px 8px; border-bottom: 1px solid var(--line-soft, var(--line)); margin-bottom: 4px; }
.dl-menu .dl-head b { font-size: 13px; }
.dl-menu .dl-head span { font-size: 11.5px; color: var(--muted); }
.dl-menu .dl-item { display: flex; align-items: flex-start; gap: 10px; width: 100%; padding: 8px 10px; border: 0; border-radius: 8px;
  background: none; font: inherit; color: inherit; text-align: left; cursor: pointer; }
.dl-menu .dl-item:hover, .dl-menu .dl-item:focus-visible { background: var(--bg-sunk, var(--bg-soft)); outline: none; }
.dl-menu .dl-txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.dl-menu .dl-txt b { font-size: 13px; font-weight: 600; }
.dl-menu .dl-txt span { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.dl-fmt { display: inline-flex; align-items: center; justify-content: center; min-width: 38px; height: 18px; padding: 0 5px; border-radius: 4px;
  font-size: 10px; font-weight: 700; letter-spacing: .04em; color: #fff; flex: none; margin-top: 1px; }
.dl-fmt.dl-xlsx { background: #1d6f42; } .dl-fmt.dl-csv { background: #5b6b7f; } .dl-fmt.dl-html { background: #c2571a; } .dl-fmt.dl-pdf { background: #b3261e; }
.dl-btn .dl-fmt { height: 16px; min-width: 34px; font-size: 9.5px; margin-top: 0; }
/* the viewer's filter bar: the filter chips on the left, the download and Clear all on the right */
.filterbar .fb-grow { flex: 1 1 auto; }
.filterbar .fb-sep { width: 1px; height: 18px; background: var(--line); margin: 0 2px; }

/* hover cards (V-26): two columns, 420–520 px, selectable, never off-screen */
.tip { position: fixed; z-index: 80; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow);
  width: min(480px, calc(100vw - 16px)); min-width: min(420px, calc(100vw - 16px)); max-height: calc(100vh - 16px); overflow: auto; font-size: 12px; user-select: text; }
.tip.sm { min-width: 260px; width: auto; max-width: 420px; }
.tip .ch { padding: 7px 10px; border-bottom: 1px solid var(--line); background: var(--bg-soft); border-radius: 8px 8px 0 0; }
.tip.cv .ch { box-shadow: inset 3px 0 0 var(--vh-compare); }
.tip .chl { line-height: 1.45; word-break: break-word; }
.tip .chl b { color: var(--ink); }
.tip .ctype { margin-left: 8px; font-size: 11px; color: var(--muted); white-space: nowrap; }
.tip .tb { padding: 8px 10px; }
.tip .pg { display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 3px 10px; align-items: baseline; }
.tip .pg.one { grid-template-columns: auto 1fr; margin-top: 6px; }
.tip .pk { color: var(--muted); font-size: 11px; white-space: nowrap; }
.tip .pv { word-break: break-word; font-variant-numeric: tabular-nums; }
.tip .defn { margin-top: 8px; padding-top: 6px; border-top: 1px solid var(--line-soft); color: var(--ink-2); }
.tip .defn b { display: block; color: var(--muted); font-size: 11px; font-weight: 600; margin-bottom: 2px; }
.tip .stl { font-weight: 650; margin-bottom: 6px; }
.tip .snip { max-height: 140px; overflow: auto; margin: 6px 0; padding: 6px; background: var(--bg-soft); border-radius: 6px; white-space: pre-wrap; }
.redline { line-height: 1.6; white-space: pre-wrap; }
.redline .ins { color: var(--add); }
.redline .del { color: var(--rem); text-decoration: line-through; }

/* right-click menu (V-21, V-27) */
.ctx { position: fixed; z-index: 90; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; box-shadow: var(--shadow); padding: 4px; min-width: 220px; }
.ci { display: block; width: 100%; text-align: left; border: 0; background: none; font: inherit; color: var(--ink); padding: 5px 10px; border-radius: 5px; cursor: pointer; }
.ci:hover:not([disabled]) { background: var(--accent-soft); }
.ci[disabled] { opacity: .45; cursor: default; }
.ci.on { font-weight: 700; color: var(--accent); }
.csep { height: 1px; background: var(--line-soft); margin: 3px 4px; }
.cmp-pop .ch-h { font-size: 11px; text-transform: uppercase; letter-spacing: .4px; color: var(--muted); font-weight: 700; margin-top: 6px; }
.cmp-pop .sec-list { max-height: 280px; overflow: auto; border: 1px solid var(--line-soft); border-radius: 6px; }

/* formatted text block with change marks (V-33) */
.tb-doc { max-height: 70vh; overflow: auto; padding: 4px 6px; background: #fff; color: #000; border: 1px solid var(--line); border-radius: 6px; font-family: "Times New Roman", Georgia, serif; font-size: 13px; }
.tb-doc table { border-collapse: collapse; max-width: 100%; }
.tb-doc img { max-width: 100%; }
.tb-doc .rl-mod { color: #1a7f37; background: #fff1e0; font-weight: 600; }   /* 18 Oct (owner): new words green, the modified tint behind */
.tb-doc .rl-add { color: #1a7f37; background: #e6f4ea; }
.tb-doc .rl-rem, .tb-doc .rl-rem * { color: #c62828 !important; text-decoration: line-through; }
.tb-doc tr.rl-rem td, .tb-doc td.rl-add { background: transparent; }
.tb-doc td.rl-add, .tb-doc tr.rl-add td, .tb-doc p.rl-add, .tb-doc div.rl-add { color: #1a7f37; }
/* 18 Oct (table_redline_v2): a changed cell keeps its place — the prior value small and struck through above the current */
.tb-doc .rl-was { display: block; font-size: 88%; line-height: 1.2; color: #c62828; text-decoration: line-through; font-weight: 400; white-space: nowrap; }
/* owner: deletion red (the prior value), addition green (the current value), the modified tint on the cell only */
.tb-doc td.rl-cell-mod, .tb-doc th.rl-cell-mod { background: #fff4e5 !important; }
.tb-doc td.rl-cell-mod *:not(.rl-was), .tb-doc th.rl-cell-mod *:not(.rl-was) { color: #1a7f37 !important; font-weight: 600; }
.tb-doc td.rl-cell-mod, .tb-doc th.rl-cell-mod { color: #1a7f37; }
.tb-doc td.rl-cell-rem, .tb-doc th.rl-cell-rem { background: #fdecec !important; }
/* 23 Oct (redline_inline_v1): the prior value on the same line, before the current one — the table keeps its original rows */
.tb-doc.rl-inline .rl-was { display: inline; font-size: 85%; line-height: inherit; margin-right: .45em; }
.tb-doc.rl-inline td.rl-cell-mod, .tb-doc.rl-inline th.rl-cell-mod, .tb-doc.rl-inline td.rl-cell-rem { white-space: nowrap; }
.tb-doc tr.rl-rem > td, .tb-doc tr.rl-rem > th { background: #fdecec !important; }
.tb-doc tr.rl-add > td, .tb-doc tr.rl-add > th { background: #e9f6ec !important; color: #1a7f37; }
.tb-doc td.rl-add, .tb-doc th.rl-add { background: #e9f6ec !important; }

.thread { border: 1px solid var(--line); border-radius: 8px; margin-bottom: 10px; }
.thread .c { padding: 8px 10px; border-bottom: 1px solid var(--line-soft); }
.thread .c:last-child { border-bottom: 0; }
.thread .c.reply { padding-left: 26px; background: var(--bg-soft); }
.kbd { font-family: var(--mono); font-size: 11px; border: 1px solid var(--line); border-bottom-width: 2px; border-radius: 4px; padding: 0 4px; background: var(--bg-soft); }

.stat { display: flex; flex-direction: column; padding: 2px 10px; border-right: 1px solid var(--line-soft); min-width: max-content; cursor: default; }
.stat b { font-size: 15px; font-variant-numeric: tabular-nums; }
.stat span { font-size: 11px; color: var(--muted); }
.stat.click { cursor: pointer; border-radius: 6px; }
.stat.click:hover { background: var(--bg-sunk); }

/* ---------- source blackline */
.bl { display: grid; grid-template-columns: 1fr 1fr; gap: 0; }
.bl.inline { grid-template-columns: 1fr; }
.bl .side { overflow: auto; height: calc(100vh - 150px); border-right: 1px solid var(--line); padding: 8px 12px; }
.bl .blk { padding: 3px 6px; border-radius: 4px; margin: 2px 0; white-space: pre-wrap; }
.bl .blk.row { font-variant-numeric: tabular-nums; display: flex; gap: 12px; }
.bl .blk.row span { flex: 1; }
.bl .blk.op-m { background: var(--mod-bg); }
.bl .blk.op-a { background: var(--add-bg); color: var(--add); }
.bl .blk.op-r { background: var(--rem-bg); color: var(--rem); text-decoration: line-through; }
.bl .blk.cur-chg { outline: 2px solid var(--accent); }
.bl .gap { background: repeating-linear-gradient(45deg, transparent, transparent 4px, var(--bg-sunk) 4px, var(--bg-sunk) 8px); min-height: 1.4em; border-radius: 4px; margin: 2px 0; }

/* ---------- inline viewer */
.iv { display: grid; grid-template-columns: 1fr 380px; height: calc(100vh - var(--chrome-h, 48px)); }
.iv iframe { width: 100%; height: 100%; border: 0; background: #fff; }
.iv aside { border-left: 1px solid var(--line); overflow: auto; background: var(--panel); }

/* ---------- taxonomy tree */
.tree .n { padding: 2px 6px; cursor: pointer; border-radius: 4px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.tree .n:hover { background: var(--bg-soft); }
.tree .n.sel { background: var(--accent-soft); }
.tx-layout { display: grid; grid-template-columns: 320px 1fr 420px; height: calc(100vh - var(--chrome-h, 48px)); }
.tx-layout > div { overflow: auto; border-right: 1px solid var(--line); padding: 10px; }

@media (max-width: 1100px) {
  .v-main { grid-template-columns: 0 1fr 0; }
  .v-main.show-left { grid-template-columns: 260px 1fr 0; }
  .tx-layout { grid-template-columns: 1fr; height: auto; }
  .iv { grid-template-columns: 1fr; }
  .iv aside { max-height: 40vh; }
}
@media (max-width: 640px) {
  .page { padding: 12px 16px 40px; }
  .topbar { padding: 0 12px; gap: 8px; }
  .topbar nav { display: none; }
  .bl { grid-template-columns: 1fr; }
}

/* ---------- searchable pickers & forms (Company / User / Project modules) */
.pk { position: relative; }
.pk-btn { width: 100%; height: 34px; display: flex; align-items: center; gap: 6px; padding: 0 10px; border: 1px solid var(--line); border-radius: var(--radius);
  background: var(--bg); color: var(--ink); font: inherit; cursor: pointer; text-align: left; }
.pk-btn[disabled] { background: var(--bg-soft); cursor: not-allowed; color: var(--muted); }
.pk-label { flex: 1; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.pk-caret { color: var(--muted); }
.pk-menu { position: absolute; z-index: 90; left: 0; right: 0; top: calc(100% + 4px); background: var(--panel); border: 1px solid var(--line); border-radius: 8px;
  box-shadow: var(--shadow); padding: 8px; min-width: 240px; }
.pk-q { width: 100%; height: 34px; margin-bottom: 6px; }
.pk-list { max-height: 240px; overflow: auto; }
.pk-opt { display: flex; gap: 8px; align-items: center; padding: 7px 10px; border-radius: 6px; cursor: pointer; font-weight: 400; }
.pk-opt:hover, .pk-opt:focus, .pk-opt.on { background: var(--bg-sunk); outline: none; }
.pk-all { border-bottom: 1px solid var(--line-soft); border-radius: 0; font-weight: 600; }
.form-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; }
.form-grid .full { grid-column: 1 / -1; }
.form-grid input, .form-grid select { height: 34px; }
.req::after { content: " *"; color: var(--rem); }
.field-err { color: var(--rem); font-size: 12px; font-weight: 400; }
.field-warn { color: var(--mod); font-size: 12px; font-weight: 400; }
.field-ok { color: var(--ok); font-size: 12px; font-weight: 400; }
.chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; border: 1px solid var(--line); border-radius: var(--radius); padding: 4px 6px; min-height: 34px; background: var(--bg); }
.chips input { border: 0; flex: 1; min-width: 160px; height: 24px; outline: none; background: transparent; padding: 0; }
.chip { display: inline-flex; gap: 2px; align-items: center; background: var(--accent-soft); color: var(--accent); border-radius: 999px; padding: 1px 4px 1px 10px; font-size: 12px; }
.chip button { border: 0; background: none; color: inherit; cursor: pointer; font-size: 14px; line-height: 1; }
.kpis { display: grid; grid-template-columns: repeat(auto-fill, minmax(140px, 1fr)); gap: 10px; margin: 12px 0; }
.kpi { background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; cursor: pointer; text-align: left; font: inherit; color: var(--ink); }
.kpi b { display: block; font-size: 22px; font-variant-numeric: tabular-nums; }
.kpi span { font-size: 12px; color: var(--muted); }
.kpi.on { outline: 2px solid var(--accent); }
.kpi.bad b { color: var(--rem); }
tr.overdue td { background: var(--rem-bg); }
.round-card { border: 1px solid var(--line); border-radius: 10px; background: var(--panel); margin-bottom: 12px; }
.round-card.current { border-color: var(--accent); box-shadow: 0 0 0 1px var(--accent) inset; }
.round-card > header { display: flex; gap: 10px; align-items: center; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
.round-card .rc-body { padding: 12px 14px; display: grid; grid-template-columns: repeat(auto-fill, minmax(170px, 1fr)); gap: 10px 18px; }
.round-card .rc-actions { padding: 10px 14px; border-top: 1px solid var(--line-soft); display: flex; gap: 6px; flex-wrap: wrap; align-items: center; }
.kv2 { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.kv2 > span { font-size: 11.5px; color: var(--muted); }
.kv2 > b { font-weight: 600; overflow-wrap: anywhere; }
.timeline { padding: 4px 14px 12px 22px; list-style: none; border-left: 2px solid var(--line-soft); margin: 0 0 0 22px; }
.timeline li { position: relative; padding: 3px 0; font-size: 12px; }
.timeline li::before { content: ""; position: absolute; left: -28px; top: 8px; width: 8px; height: 8px; border-radius: 50%; background: var(--accent); }
.edited { font-size: 10px; font-weight: 700; color: var(--mod); border: 1px solid var(--mod-line); border-radius: 3px; padding: 0 4px; margin-left: 4px; }
.cal { display: grid; gap: 6px; }
.cal .cal-row { display: grid; grid-template-columns: 70px repeat(5, minmax(0, 1fr)); gap: 6px; align-items: stretch; }
.cal .cal-cell { border: 1px solid var(--line-soft); border-radius: 6px; padding: 6px; min-height: 52px; background: var(--panel); min-width: 0; }
.cal .cal-cell a { display: block; font-size: 12px; margin-bottom: 3px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cal .cal-h { font-weight: 700; font-size: 12px; color: var(--muted); padding: 4px 6px; }
.tabsbar { display: flex; gap: 4px; border-bottom: 1px solid var(--line); margin: 12px 0; overflow-x: auto; }
.tabsbar button { border: 0; background: none; padding: 8px 12px; font: inherit; font-weight: 600; color: var(--muted); cursor: pointer; border-bottom: 2px solid transparent; white-space: nowrap; }
.tabsbar button.on { color: var(--ink); border-bottom-color: var(--accent); }
.filters { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; margin: 10px 0; }
.filters > * { flex: 0 1 auto; }
.filters .pk { min-width: 170px; }
.pager { display: flex; gap: 8px; align-items: center; justify-content: flex-end; padding: 8px 10px; }
th.sort { cursor: pointer; user-select: none; }
th.sort:hover { color: var(--ink); }
.back { display: inline-flex; gap: 4px; align-items: center; font-weight: 600; color: var(--ink); }
@media (max-width: 720px) { .form-grid { grid-template-columns: 1fr; } .cal .cal-row { grid-template-columns: 50px repeat(5, minmax(56px, 1fr)); } }

/* top bar: keep on one line at narrow widths */
.brand { white-space: nowrap; }
.topbar nav { flex-wrap: nowrap; overflow-x: auto; }
.topbar nav a { white-space: nowrap; }
@media (max-width: 1100px) { #who { display: none; } .brand .brand-text { display: none; } }
input:disabled, select:disabled, textarea:disabled { background: var(--bg-soft); color: var(--muted); cursor: not-allowed; }
.res .ri.rp select { max-width: 160px; font-size: 11px; margin-right: 4px; }  /* R12 role pairings */

/* R11 extension: values of prior periods the current form has no counterpart for */
table.gt tbody td.v.N { color: #8c959f; }
table.gt thead th.colst-nc { background: #6e7781 !important; }
/* H-01 (round 8): a selected tile is filled; the active-filter chip bar; an empty result explains itself */
.kpi.on { outline: 2px solid var(--accent); background: var(--accent-soft); }
.kpi.on span { color: var(--accent); font-weight: 600; }
.kpi[aria-pressed="true"]::after { content: "✓"; float: right; margin-top: -26px; color: var(--accent); font-weight: 700; }
.chipbar { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; margin: -2px 0 10px; }
.chipbar.hidden { display: none; }
.empty-state { display: flex; flex-direction: column; gap: 8px; align-items: flex-start; padding: 6px 0; color: var(--ink); }
.empty-state b { font-weight: 700; }
#res .empty-state { padding: 8px 10px; font-size: 13px; }     /* H-01: the viewer's Changes and Comments panels */
#res .empty-state .row { flex-wrap: wrap; }
.pk-opt .muted.small { float: right; font-variant-numeric: tabular-nums; }
/* H-02: the error screen that replaces a blank page */
.err-screen { max-width: 560px; margin: 48px auto; padding: 24px; }
.err-screen h2 { margin: 0 0 8px; }

/* ---- round 8 Part B (process_v2): Round Closed, SLA, the status pipeline, the process stepper, override, documents */
.pill.done { color: #17365d; border-color: #9fb3cc; background: #e9eff6; }
.sla { display: inline-block; margin-left: 6px; padding: 0 6px; border-radius: 999px; font-size: 11px; font-weight: 650; line-height: 17px; white-space: nowrap; }
.sla.soon { color: #7a4d00; background: #fff3d1; border: 1px solid #e8b949; }
.sla.overdue { color: var(--bad); background: var(--rem-bg); border: 1px solid var(--rem-line); }
.kpis .pipeline { grid-column: 1 / -1; display: flex; align-items: stretch; }
.pipeline .kpi { flex: 1; min-width: 0; border-radius: 0; margin-left: -1px; position: relative; }
.pipeline .kpi:first-child { border-radius: 8px 0 0 8px; margin-left: 0; }
.pipeline .kpi:last-child { border-radius: 0 8px 8px 0; }
.pipeline .kpi + .kpi::before { content: "›"; position: absolute; left: -7px; top: 50%; transform: translateY(-50%); width: 13px; height: 18px;
  line-height: 16px; text-align: center; background: var(--panel); color: var(--muted); font-weight: 700; z-index: 1; }
.pipeline .kpi.on { z-index: 2; }
.stepper { display: grid; grid-template-columns: repeat(9, minmax(0, 1fr)); gap: 6px; list-style: none; padding: 0; margin: 12px 0 4px; }
.stepper li { border-top: 4px solid var(--line); padding: 6px 2px 0; font-size: 12px; color: var(--muted); }
.stepper li b { display: block; font-size: 12.5px; color: var(--ink-2); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.stepper li .n { font-variant-numeric: tabular-nums; margin-right: 4px; }
.stepper li.done { border-top-color: #6f8fb3; }
.stepper li.done b::after { content: " ✓"; color: #17365d; }
.stepper li.current { border-top-color: #17365d; color: var(--ink-2); }
.stepper li.current b { color: #17365d; }
.stepper li.optional { border-top-style: dashed; }
.override { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; padding: 6px 14px; border-top: 1px solid var(--line-soft); background: var(--bg-soft); font-size: 12.5px; }
.override.mine { background: var(--accent-soft); }
.docs { padding: 4px 14px 10px; border-top: 1px solid var(--line-soft); }
.docs table.list td, .docs table.list th { padding: 5px 6px; font-size: 12.5px; }
.docs .reply td:first-child { padding-left: 22px; }
.docs .reply td:first-child::before { content: "↳ "; color: var(--muted); }
.timeline .ev { color: var(--muted); }
@media (max-width: 900px) { .stepper { grid-template-columns: repeat(3, minmax(0, 1fr)); } }

/* ---- round 8 Part C (inline_viewer_v2): the Inline Viewer — SEC toolbar, sections, document tabs, fact panel */
.ivx { display: flex; flex-direction: column; height: calc(100vh - var(--chrome-h, 48px)); }
.ivx-bar { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; padding: 6px 10px; border-bottom: 1px solid var(--line); background: var(--panel); }
.ivx-bar .ivx-b b { font-weight: 600; color: var(--accent); }
.ivx-search { display: flex; align-items: center; gap: 2px; }
.ivx-search input { width: 260px; height: 30px; }
.ivx-legend { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--muted); margin-left: 4px; }
.ivx-legend .lg { display: inline-block; width: 12px; height: 12px; border-radius: 2px; margin-left: 6px; }
.ivx-legend .lg.M { background: rgba(240,136,62,.45); box-shadow: inset 0 -2px 0 #b35900; }
.ivx-legend .lg.A { background: rgba(26,127,55,.35); box-shadow: inset 0 -2px 0 #1a7f37; }
/* 21 Oct (approver_kind_v1): a line item the client approved */
.appr-by { display: inline-block; margin-left: 4px; padding: 0 4px; border-radius: 3px; font-size: 10px; font-weight: 700; line-height: 15px;
  color: #fff; background: #6f42c1; vertical-align: middle; cursor: help; }
.ivx-legend .lg.U { background: rgba(111,66,193,.22); box-shadow: inset 0 -2px 0 #6f42c1; }   /* 21 Oct (inline_unchanged_v1) */
.ivx-main { flex: 1; min-height: 0; display: flex; }
.ivx-left { width: 290px; border-right: 1px solid var(--line); overflow: auto; background: var(--panel); }
.ivx-right { width: 400px; border-left: 1px solid var(--line); overflow: auto; background: var(--panel); }
.ivx-left.hidden, .ivx-right.hidden { display: none; }
.ivx-doc { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.ivx-doc iframe { flex: 1; width: 100%; border: 0; background: #fff; }
.ivx-tabs { display: flex; gap: 2px; padding: 4px 8px 0; border-bottom: 1px solid var(--line); background: var(--bg-soft); overflow-x: auto; }
.ivx-tabs button { border: 1px solid var(--line); border-bottom: 0; background: var(--panel); border-radius: 6px 6px 0 0; padding: 4px 10px; font: inherit; font-size: 12px; cursor: pointer; white-space: nowrap; display: inline-flex; gap: 6px; align-items: center; color: var(--ink-2); }
.ivx-tabs button.on { background: var(--accent-soft); color: var(--accent); font-weight: 600; }
.ivx-ph { padding: 6px 10px; border-bottom: 1px solid var(--line-soft); position: sticky; top: 0; background: var(--panel); z-index: 1; }
.ivx-fh { padding: 8px 12px; border-bottom: 1px solid var(--line-soft); }
.ivx-fh .tabsbar { margin-top: 8px; }
.ivx-tab { padding: 8px 12px; }
.ivx-kv th { width: 120px; color: var(--muted); font-weight: 600; vertical-align: top; }
.ivx-kv td { word-break: break-word; }
.ivx-list .ri { padding: 6px 12px; border-bottom: 1px solid var(--line-soft); cursor: pointer; }
.ivx-list .ri:hover { background: var(--bg-soft); }
.ivx-list .ri.M { box-shadow: inset 3px 0 0 var(--mod); } .ivx-list .ri.A { box-shadow: inset 3px 0 0 var(--ok); } .ivx-list .ri.R { box-shadow: inset 3px 0 0 var(--rem); }
.ivx-ell { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; min-width: 0; }
.ivx-sec { display: flex; width: 100%; gap: 6px; align-items: center; text-align: left; border: 0; background: none; font: inherit; font-size: 12.5px; padding: 4px 10px 4px 22px; cursor: pointer; color: var(--ink-2); }
.ivx-sec:hover { background: var(--accent-soft); color: var(--accent); }
.ivx-left details > summary { padding: 6px 10px; font-weight: 650; font-size: 12.5px; cursor: pointer; }
.ivx-menu .pk-opt { display: flex; gap: 6px; align-items: center; width: 100%; text-align: left; border: 0; background: none; font: inherit; padding: 5px 8px; cursor: pointer; }
.ivx-menu .pk-opt:hover:not(:disabled) { background: var(--accent-soft); }
.ivx-more { max-height: 70vh; overflow: auto; min-width: 300px; }
.ivx-more summary { cursor: pointer; padding: 4px 0; font-weight: 600; font-size: 12.5px; }
.ivx-checks { max-height: 220px; overflow: auto; padding-left: 4px; font-size: 12px; }
.ivx-tip { position: fixed; z-index: 60; max-width: 460px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px; box-shadow: 0 8px 24px rgba(0,0,0,.18); font-size: 12.5px; pointer-events: none; }
.ivx-cc { margin-top: 6px; } .ivx-cc th { color: var(--muted); font-weight: 600; } .ivx-cc tr.chg td { background: var(--mod-bg); color: var(--mod); font-weight: 600; }
.ivx-ref div { line-height: 1.5; }

/* ---- round 8: each round's approvals and comments; removals highlighted, with a hover card */
.rv-flag { display: inline-block; margin-top: 4px; padding: 1px 8px; border-radius: 999px; font-size: 11.5px; font-weight: 650; cursor: help;
  color: #7a4d00; background: #fff3d1; border: 1px solid #e8b949; }
.rv-flag:focus { outline: 2px solid var(--focus); outline-offset: 1px; }
.rv-card { position: absolute; z-index: 70; max-width: 520px; background: var(--panel); border: 1px solid var(--line); border-radius: 8px; padding: 10px 12px;
  box-shadow: 0 8px 24px rgba(0,0,0,.18); font-size: 12.5px; pointer-events: none; }
.rv-card ul { margin: 6px 0; padding-left: 16px; } .rv-card li { margin: 3px 0; }


/* ---------------------------------------------------------------- round 8 (taxonomy_v2): Taxonomy Viewer in the Yeti layout */
:root {
  --tx-navy: #0f2a4a; --tx-navy-2: #17406e; --tx-teal: #0e7c86; --tx-gold: #b7892b; --tx-pane-h: #eef3f9; --tx-pane-line: #cfd9e5;
  --tx-sel: #dcebfa; --tx-hover: #f0f6fd; --tx-mark: #fff1a8;
  --txi-role: #17406e; --txi-table: #7c3aed; --txi-axis: #c2410c; --txi-member: #15803d; --txi-lineitems: #1d4ed8; --txi-abstract: #64748b;
  --txi-monetary: #0e7c86; --txi-text: #9d174d; --txi-other: #475569;
  --g-fin: #1d4ed8; --g-fund: #0e7c86; --g-sec: #7c3aed; --g-ref: #b45309;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --tx-navy: #10233d; --tx-navy-2: #1b3a63; --tx-teal: #2bb3bd; --tx-gold: #d9b25a; --tx-pane-h: #18212d; --tx-pane-line: #2e3a49;
    --tx-sel: #1d3a5c; --tx-hover: #15253d; --tx-mark: #5c4b00;
    --txi-role: #8fb6ea; --txi-table: #b392f0; --txi-axis: #f0883e; --txi-member: #3fb950; --txi-lineitems: #6ea8fe; --txi-abstract: #9198a1;
    --txi-monetary: #2bb3bd; --txi-text: #f472b6; --txi-other: #9fb0c3;
    --g-fin: #6ea8fe; --g-fund: #2bb3bd; --g-sec: #b392f0; --g-ref: #e3a24f;
  }
}
:root[data-theme="dark"] {
  --tx-navy: #10233d; --tx-navy-2: #1b3a63; --tx-teal: #2bb3bd; --tx-gold: #d9b25a; --tx-pane-h: #18212d; --tx-pane-line: #2e3a49;
  --tx-sel: #1d3a5c; --tx-hover: #15253d; --tx-mark: #5c4b00;
  --txi-role: #8fb6ea; --txi-table: #b392f0; --txi-axis: #f0883e; --txi-member: #3fb950; --txi-lineitems: #6ea8fe; --txi-abstract: #9198a1;
  --txi-monetary: #2bb3bd; --txi-text: #f472b6; --txi-other: #9fb0c3;
  --g-fin: #6ea8fe; --g-fund: #2bb3bd; --g-sec: #b392f0; --g-ref: #e3a24f;
}
.tx2 { display: flex; flex-direction: column; height: calc(100vh - var(--chrome-h, 48px)); background: var(--bg-soft); }
.tx2-head { display: flex; align-items: center; gap: 14px; flex-wrap: wrap; padding: 8px 14px; background: linear-gradient(90deg, var(--tx-navy), var(--tx-navy-2)); color: #fff; }
.tx2-head .muted { color: #c7d5e6; }
.tx2-title { display: flex; align-items: center; gap: 10px; min-width: 220px; }
.tx2-badge { background: var(--tx-gold); color: #1b1300; font-weight: 800; font-size: 11px; letter-spacing: .04em; padding: 3px 8px; border-radius: 4px; }
.tx2-field { display: inline-flex; align-items: center; gap: 6px; font-size: 12px; font-weight: 600; color: #dbe6f3; }
.tx2-field select { height: 26px; border-radius: 4px; border: 1px solid #ffffff55; background: #ffffff14; color: #fff; padding: 0 6px; font: inherit; font-weight: 500; }
.tx2-field select option { color: #1f2328; }
.tx2-head .btn { background: #ffffff14; color: #fff; border-color: #ffffff55; }
.tx2-head .btn:hover { background: #ffffff28; }
.tx2-main { flex: 1; min-height: 0; display: grid; grid-template-columns: minmax(300px, 40%) 1fr; gap: 8px; padding: 8px; }
.tx2-split { min-height: 0; display: grid; grid-template-rows: 1fr minmax(170px, 36%); gap: 8px; }
body.tx2-tools-min .tx2-split { grid-template-rows: 1fr 38px; }
body.tx2-tools-min .tx2-searchbar, body.tx2-tools-min .tx2-grid { display: none; }
.tx2-pane { background: var(--panel); border: 1px solid var(--tx-pane-line); border-radius: 6px; min-height: 0; display: flex; flex-direction: column; overflow: hidden; }
.tx2-ph { display: flex; align-items: center; gap: 10px; padding: 6px 10px; background: var(--tx-pane-h); border-bottom: 1px solid var(--tx-pane-line); font-size: 12.5px; }
.tx2-filter { padding: 6px 8px; border-bottom: 1px solid var(--line-soft); }
.tx2-filter input { width: 100%; }
.tx2-tree { flex: 1; overflow: auto; padding: 4px 0; font-size: 12.5px; }
.tx2-n { display: flex; align-items: center; gap: 6px; padding: 2px 8px; min-height: 22px; cursor: pointer; white-space: nowrap; border-left: 2px solid transparent; }
.tx2-n:hover { background: var(--tx-hover); }
.tx2-n.sel { background: var(--tx-sel); border-left-color: var(--tx-teal); }
.tx2-n:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.tx2-n.abs .tx2-l { font-weight: 600; }
.tx2-role { padding-left: 6px; font-weight: 600; color: var(--ink); border-top: 1px solid var(--line-soft); }
.tx2-role.open { background: var(--tx-pane-h); }
.tx2-l { overflow: hidden; text-overflow: ellipsis; }
.tx2-meta { margin-left: auto; font-size: 10.5px; color: var(--muted); font-weight: 500; padding-left: 8px; }
.tx2-tg { width: 14px; flex: none; text-align: center; color: var(--muted); font-weight: 700; font-family: var(--mono); }
.txi { flex: none; display: inline-flex; align-items: center; justify-content: center; min-width: 18px; height: 16px; padding: 0 2px; border-radius: 3px;
  font: 700 10px/1 var(--font); color: #fff; background: var(--txi-other); }
.txi-role { background: var(--txi-role); } .txi-table { background: var(--txi-table); } .txi-axis { background: var(--txi-axis); }
.txi-member { background: var(--txi-member); } .txi-lineitems { background: var(--txi-lineitems); }
.txi-abstract { background: transparent; color: var(--txi-abstract); border: 1px solid var(--txi-abstract); font-size: 11px; }
.txi-monetary, .txi-pershare { background: var(--txi-monetary); } .txi-textblock, .txi-string { background: var(--txi-text); }
:root[data-theme="dark"] .txi:not(.txi-abstract) { color: #0d1117; }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .txi:not(.txi-abstract) { color: #0d1117; } }
.tx2-chip { flex: none; font-size: 10px; font-weight: 700; padding: 0 5px; border-radius: 3px; border: 1px solid var(--line); color: var(--ink-2); background: var(--bg-soft); }
.tx2-chip.pos { color: var(--add); border-color: var(--add-line); background: var(--add-bg); }
.tx2-chip.neg { color: var(--rem); border-color: var(--rem-line); background: var(--rem-bg); }
.tx2-chip.arc { color: var(--txi-table); }
.tx2-chip.def { color: var(--tx-gold); border-color: var(--tx-gold); }
.tx2-chip.up { color: var(--txi-lineitems); } .tx2-chip.down { color: var(--txi-member); }
.tx2-right { overflow: auto; }
.tx2-chead { display: flex; align-items: center; gap: 10px; padding: 12px 12px 8px; }
.tx2-chead .txi { min-width: 24px; height: 22px; font-size: 12px; }
.tx2-ctitle { font-size: 16px; font-weight: 700; color: var(--ink); }
.tx2-tabs { display: flex; gap: 2px; padding: 0 10px; border-bottom: 1px solid var(--tx-pane-line); position: sticky; top: 0; background: var(--panel); z-index: 1; }
.tx2-tab { border: 0; background: transparent; font: inherit; font-size: 12.5px; font-weight: 600; color: var(--muted); padding: 7px 12px; cursor: pointer; border-bottom: 2px solid transparent; }
.tx2-tab.on { color: var(--tx-teal); border-bottom-color: var(--tx-teal); }
.tx2-ph .tx2-tab { padding: 2px 8px; }
.tx2-tabbody { padding: 10px 12px 16px; }
.tx2-box { border: 1px solid var(--tx-pane-line); border-radius: 6px; margin-bottom: 12px; overflow: hidden; }
.tx2-boxh { background: var(--tx-pane-h); padding: 5px 10px; font-weight: 700; font-size: 12px; color: var(--ink-2); border-bottom: 1px solid var(--tx-pane-line); }
.tx2-kv { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.tx2-kv th { width: 150px; text-align: left; font-weight: 600; color: var(--muted); padding: 4px 10px; vertical-align: top; border-bottom: 1px solid var(--line-soft); }
.tx2-kv td { padding: 4px 10px; border-bottom: 1px solid var(--line-soft); word-break: break-word; }
.tx2-kv tr:last-child th, .tx2-kv tr:last-child td { border-bottom: 0; }
.tx2-ref { border-bottom: 2px solid var(--tx-pane-line); } .tx2-ref:last-child { border-bottom: 0; }
.tx2-grid-t { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.tx2-grid-t th { position: sticky; top: 0; background: var(--tx-pane-h); text-align: left; font-weight: 700; font-size: 11.5px; color: var(--ink-2); padding: 5px 8px; border-bottom: 1px solid var(--tx-pane-line); }
.tx2-grid-t td { padding: 4px 8px; border-bottom: 1px solid var(--line-soft); vertical-align: top; }
.tx2-grid-t tbody tr:nth-child(even) td { background: var(--stripe); }
.tx2-results tbody tr { cursor: pointer; } .tx2-results tbody tr:hover td { background: var(--tx-hover); } .tx2-results tbody tr.sel td { background: var(--tx-sel); }
.tx2-doc { color: var(--ink-2); line-height: 1.45; }
.tx2-link { display: inline-flex; align-items: center; gap: 6px; }
.tx2-loc { padding: 7px 10px; border-bottom: 1px solid var(--line-soft); } .tx2-loc:last-child { border-bottom: 0; }
.tx2-locrole { display: inline-flex; align-items: center; gap: 6px; font-weight: 600; font-size: 12.5px; }
.tx2-path { margin: 4px 0 0 24px; font-size: 12px; line-height: 1.6; color: var(--ink-2); }
.tx2-sep { color: var(--muted); margin: 0 5px; }
.tx2-searchbar { display: flex; gap: 8px; align-items: center; padding: 6px 8px; border-bottom: 1px solid var(--line-soft); flex-wrap: wrap; }
.tx2-searchbar input { flex: 1; min-width: 200px; }
.tx2-grid { flex: 1; overflow: auto; }
.tx2-grid mark { background: var(--tx-mark); color: inherit; border-radius: 2px; }
.tx2-where { font-size: 10px; font-weight: 700; text-transform: uppercase; color: var(--muted); letter-spacing: .03em; }
.tx2-rank { position: relative; display: inline-block; width: 50px; height: 14px; background: var(--bg-sunk); border-radius: 3px; overflow: hidden; vertical-align: middle; }
.tx2-rank i { position: absolute; inset: 0 auto 0 0; background: var(--tx-teal); opacity: .35; }
.tx2-rank b { position: relative; font-size: 10px; padding-left: 4px; }
.tx2-empty { text-align: center; padding: 60px 24px; color: var(--ink-2); display: grid; gap: 6px; justify-items: center; }
.tx2-empty-i { width: 46px; height: 46px; border-radius: 50%; display: grid; place-items: center; background: var(--tx-pane-h); color: var(--tx-teal); font-size: 22px; }
@media (max-width: 900px) {
  .tx2 { height: auto; } .tx2-main { grid-template-columns: 1fr; } .tx2-tree { max-height: 50vh; } .tx2-split { grid-template-rows: auto auto; }
  .tx2-right { max-height: none; } .tx2-grid { max-height: 50vh; }
}

/* ---------------------------------------------------------------- round 8 (taxonomy_v2): the Taxonomies page */
.txl-hero { background: linear-gradient(120deg, var(--tx-navy) 0%, var(--tx-navy-2) 55%, var(--tx-teal) 130%); color: #fff; padding: 28px 0 70px; }
.txl-hero .wrap, .txl-body { max-width: 1240px; margin: 0 auto; padding: 0 20px; }
.txl-hero h1 { margin: 0; font-size: 26px; letter-spacing: -.01em; color: #fff; }
.txl-hero p { margin: 6px 0 0; color: #d4e1f0; max-width: 760px; line-height: 1.5; }
.txl-hero .btn { background: #ffffff1c; color: #fff; border-color: #ffffff66; }
.txl-hero .btn:hover { background: #ffffff30; }
.txl-stats { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-top: 20px; }
.txl-stat { background: #ffffff14; border: 1px solid #ffffff30; border-radius: 8px; padding: 12px 14px; }
.txl-stat b { display: block; font-size: 22px; font-variant-numeric: tabular-nums; }
.txl-stat span { font-size: 12px; color: #d4e1f0; }
.txl-body { margin-top: -48px; padding-bottom: 40px; }
.txl-find { background: var(--panel); border: 1px solid var(--line); border-radius: 10px; box-shadow: var(--shadow); padding: 14px 16px; position: relative; }
.txl-find .row { gap: 8px; flex-wrap: wrap; }
.txl-find input { flex: 1; min-width: 220px; height: 36px; font-size: 14px; }
.txl-find select { height: 36px; }
.txl-res { margin-top: 10px; max-height: 340px; overflow: auto; border-top: 1px solid var(--line-soft); }
.txl-res a { display: grid; grid-template-columns: 24px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 6px 4px; border-bottom: 1px solid var(--line-soft); color: var(--ink); text-decoration: none; }
.txl-res a:hover { background: var(--tx-hover); }
.txl-group { margin-top: 26px; }
.txl-group h2 { display: flex; align-items: center; gap: 10px; font-size: 15px; margin: 0 0 10px; color: var(--ink); }
.txl-group h2 i { width: 10px; height: 10px; border-radius: 3px; background: var(--g); }
.txl-cards { display: grid; grid-template-columns: repeat(auto-fill, minmax(290px, 1fr)); gap: 12px; }
.txl-card { background: var(--panel); border: 1px solid var(--line); border-top: 3px solid var(--g); border-radius: 8px; padding: 12px 14px; display: flex; flex-direction: column; gap: 8px;
  transition: box-shadow .15s, transform .15s; }
.txl-card:hover { box-shadow: var(--shadow); transform: translateY(-1px); }
.txl-code { display: inline-block; font-weight: 800; font-size: 12px; letter-spacing: .04em; color: var(--g); background: color-mix(in srgb, var(--g) 12%, transparent); padding: 2px 8px; border-radius: 4px; }
.txl-name { font-weight: 650; color: var(--ink); line-height: 1.3; }
.txl-pub { font-size: 11.5px; color: var(--muted); }
.txl-rel { display: grid; grid-template-columns: 46px minmax(0, 1fr) auto; gap: 8px; align-items: center; padding: 5px 0; border-top: 1px solid var(--line-soft); font-size: 12.5px; }
.txl-rel b { font-variant-numeric: tabular-nums; }
.txl-latest { font-size: 10px; font-weight: 700; color: var(--g); margin-left: 4px; }
@media (max-width: 760px) { .txl-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.page.txl { max-width: none; padding: 0; margin: 0; }


/* 15 Oct: the breadcrumb trail (the earlier project / company breadcrumb style, on every page but the Dashboard) */
.crumbs { display: flex; align-items: center; flex-wrap: wrap; gap: 6px; min-height: 30px; padding: 4px 16px; font-size: 12.5px; color: var(--muted); border-bottom: 1px solid var(--line-soft); background: var(--panel); }
.crumbs a { color: var(--accent); } .crumbs .sep { color: var(--muted); } .crumbs [aria-current] { color: var(--ink-2); font-weight: 600; }
html.has-crumbs { --chrome-h: 79px; }

/* 15 Oct: Yeti's empty concept panel and collapsible sections */
.tx2-none { font-weight: 700; margin: 2px 0 8px; color: var(--ink); }
.tx2-note { margin: 0 12px 8px; } .tx2-tabbody > .tx2-note { margin: 0 0 10px; }
button.tx2-boxh { display: flex; width: 100%; align-items: center; border: 0; border-bottom: 1px solid var(--tx-pane-line); font: inherit; font-weight: 700; font-size: 12px; text-align: left; cursor: pointer; }
.tx2-box:not(:has(> :nth-child(2))) > .tx2-boxh, .tx2-box.closed > .tx2-boxh { border-bottom: 0; }
.tx2-car { margin-left: auto; font-size: 10px; color: var(--muted); transition: transform .15s; }
.tx2-box.closed > :not(.tx2-boxh) { display: none; } .tx2-box.closed .tx2-car { transform: rotate(180deg); }
.tx2-tab[disabled] { opacity: .45; cursor: default; }

/* 15 Oct: bulk import preview — rows with errors */
tr.bad-row td { background: var(--rem-bg); }

/* 15 Oct: the structured "Changes vs prior year" window */
.modal.tx2c-modal { width: min(1180px, 100%); }
.tx2c { display: flex; flex-direction: column; gap: 10px; }
.tx2c-tiles { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 10px; }
.tx2c-tile { text-align: left; border: 1px solid var(--line); border-top: 3px solid var(--c); background: var(--panel); border-radius: 8px; padding: 10px 12px;
  cursor: pointer; font: inherit; color: var(--ink); display: grid; gap: 1px; }
.tx2c-tile b { font-size: 22px; font-variant-numeric: tabular-nums; color: var(--c); }
.tx2c-tile span { font-weight: 650; } .tx2c-tile small { color: var(--muted); font-size: 11.5px; }
.tx2c-tile:hover { background: var(--bg-soft); }
.tx2c-tile.on { background: color-mix(in srgb, var(--c) 9%, var(--panel)); box-shadow: inset 0 0 0 1px var(--c); }
.tx2c-tile.add { --c: var(--add); } .tx2c-tile.mod { --c: var(--mod); } .tx2c-tile.info { --c: var(--accent); } .tx2c-tile.rem { --c: var(--rem); }
.tx2c-bar { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; }
.tx2c-bar input { flex: 1; min-width: 220px; }
.tx2c-body { max-height: 56vh; overflow: auto; border: 1px solid var(--tx-pane-line); border-radius: 8px; }
.tx2c-t tbody tr { cursor: pointer; } .tx2c-t tbody tr:hover td { background: var(--tx-hover); }
.tx2c-t tbody tr:focus-visible { outline: 2px solid var(--focus); outline-offset: -2px; }
.tx2c-l { font-weight: 550; }
.tx2c-old del { background: var(--rem-bg); color: var(--rem); text-decoration: line-through; border-radius: 2px; }
.tx2c-new ins { background: var(--add-bg); color: var(--add); text-decoration: none; border-radius: 2px; font-weight: 600; }
@media (max-width: 760px) { .tx2c-tiles { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.tx2c-t { table-layout: fixed; width: 100%; }
.tx2c-t td, .tx2c-t th { overflow-wrap: anywhere; }
.tx2c-t td:last-child, .tx2c-t th:last-child { overflow-wrap: normal; }
.tx2c-t .pill { white-space: nowrap; }

/* =====================================================================================================================
   Round 8 Part E (flag ui_v2): the redesigned presentation layer — navy app bar flowing into a title band on Dashboard,
   My work, Companies, Projects, Guide and Admin (and a company / project), white cards with soft shadows on a light
   canvas, refined tables, tiles, filters and tabs. Everything is scoped to html.ui2, so ui_v2 off is the earlier look.
   ===================================================================================================================== */
:root {
  --ui2-navy: #0f2a4a; --ui2-navy-2: #17406e; --ui2-blue: #1b5a8c; --ui2-bg: #f3f6fb; --ui2-line: #e1e7ef; --ui2-head: #f7f9fc;
  --ui2-th: #5b6b82; --ui2-hover: #f4f8ff; --ui2-shadow: 0 1px 2px rgba(16, 24, 40, .05), 0 6px 18px rgba(16, 24, 40, .06);
  --ui2-shadow-h: 0 2px 6px rgba(16, 24, 40, .08), 0 12px 28px rgba(16, 24, 40, .10); --ui2-gold: #f2c14e;
  --ui2-k1: #17406e; --ui2-k2: #0e7c86; --ui2-k3: #b7791f; --ui2-k4: #c62828; --ui2-k5: #6f42c1;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --ui2-bg: #0b1018; --ui2-line: #273241; --ui2-head: #141c27; --ui2-th: #9fb0c3; --ui2-hover: #15253d;
    --ui2-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35); --ui2-shadow-h: 0 2px 6px rgba(0, 0, 0, .5), 0 12px 28px rgba(0, 0, 0, .45);
    --ui2-k1: #6ea8fe; --ui2-k2: #2bb3bd; --ui2-k3: #e3a24f; --ui2-k4: #f85149; --ui2-k5: #b392f0;
  }
}
:root[data-theme="dark"] {
  --ui2-bg: #0b1018; --ui2-line: #273241; --ui2-head: #141c27; --ui2-th: #9fb0c3; --ui2-hover: #15253d;
  --ui2-shadow: 0 1px 2px rgba(0, 0, 0, .4), 0 6px 18px rgba(0, 0, 0, .35); --ui2-shadow-h: 0 2px 6px rgba(0, 0, 0, .5), 0 12px 28px rgba(0, 0, 0, .45);
  --ui2-k1: #6ea8fe; --ui2-k2: #2bb3bd; --ui2-k3: #e3a24f; --ui2-k4: #f85149; --ui2-k5: #b392f0;
}

/* ---- the app bar (every page with the top bar) */
html.ui2 .topbar { background: var(--ui2-navy); border-bottom: 1px solid rgba(255, 255, 255, .08); height: 52px; gap: 14px; }
html.ui2 .topbar .brand { color: #fff; letter-spacing: .1px; }
html.ui2 .topbar .brand .logo { width: 30px; height: 30px; box-shadow: 0 1px 3px rgba(0, 0, 0, .25); }
html.ui2 .topbar nav a { color: #c9d7ea; padding: 7px 11px; border-radius: 8px; font-weight: 600; position: relative; }
html.ui2 .topbar nav a:hover { background: rgba(255, 255, 255, .08); color: #fff; }
html.ui2 .topbar nav a.active { background: rgba(255, 255, 255, .14); color: #fff; box-shadow: inset 0 -3px 0 var(--ui2-gold); }
/* the menu still scrolls sideways on a narrow window, without a visible scroll bar (the active mark is inside the link) */
html.ui2 .topbar nav { scrollbar-width: none; overflow-y: hidden; }
html.ui2 .topbar nav::-webkit-scrollbar { display: none; }
html.ui2 body header.topbar .btn { background: rgba(255, 255, 255, .08); border-color: rgba(255, 255, 255, .22); color: #fff; box-shadow: none; height: 32px; }
html.ui2 body header.topbar .btn:hover { background: rgba(255, 255, 255, .16); transform: none; }
html.ui2 .topbar #who { color: #c9d7ea; }
html.ui2.has-crumbs { --chrome-h: 83px; }

/* ---- the canvas and the title band */
html.ui2 body.ui2-page { background: linear-gradient(120deg, var(--ui2-navy) 0%, var(--ui2-navy-2) 55%, var(--ui2-blue) 100%) 0 0 / 100% var(--hero-h, 190px) no-repeat, var(--ui2-bg); }
html.ui2 body.ui2-page .crumbs { background: transparent; border-bottom-color: rgba(255, 255, 255, .10); color: #9fb3cc; }
html.ui2 body.ui2-page .crumbs a { color: #cfe0f5; } html.ui2 body.ui2-page .crumbs [aria-current] { color: #fff; }
html.ui2 body.ui2-page main.page:not([style*="900px"]) { max-width: 1720px !important; }      /* data pages use the width; the Guide keeps its reading width */
html.ui2 body.ui2-page main.page { padding-top: 22px; }
html.ui2 body.ui2-page .hero-el, html.ui2 body.ui2-page .hero-el h1 { color: #fff; }
html.ui2 body.ui2-page .hero-el h1, html.ui2 body.ui2-page h1.hero-el { font-size: 26px; font-weight: 700; letter-spacing: -.01em; }
html.ui2 body.ui2-page p.hero-el, html.ui2 body.ui2-page .hero-el .muted { color: #c3d3e8; font-size: 13.5px; margin-top: 4px; }
html.ui2 body.ui2-page .hero-el a { color: #fff; text-decoration: underline; text-decoration-color: rgba(255, 255, 255, .5); text-underline-offset: 2px; }
html.ui2 body.ui2-page .hero-el .btn { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .30); color: #fff; box-shadow: none; }
html.ui2 body.ui2-page .hero-el .btn:hover { background: rgba(255, 255, 255, .18); }
html.ui2 body.ui2-page .hero-el .btn.primary { background: #fff; border-color: #fff; color: var(--ui2-navy); }
html.ui2 body.ui2-page .hero-el .btn.primary:hover { background: #eef4fb; }
html.ui2 body.ui2-page .hero-el + * { margin-top: 40px; }

/* ---- buttons, inputs, pills */
html.ui2 body.ui2-page .btn { height: 34px; padding: 0 14px; border-radius: 8px; font-weight: 600; background: var(--panel); border-color: var(--ui2-line);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .05); transition: background .12s, box-shadow .12s, transform .12s; }
html.ui2 body.ui2-page .btn:hover { background: var(--ui2-hover); }
html.ui2 body.ui2-page .btn.primary { background: linear-gradient(180deg, #1a6bd0, #0b54a8); border-color: #0b54a8; color: #fff; box-shadow: 0 1px 2px rgba(11, 84, 168, .3), 0 4px 10px rgba(11, 84, 168, .18); }
html.ui2 body.ui2-page .btn.primary:hover { filter: brightness(1.06); transform: translateY(-1px); }
html.ui2 body.ui2-page .btn.sm { height: 28px; padding: 0 10px; font-size: 12px; border-radius: 7px; }
html.ui2 body.ui2-page input[type=text], html.ui2 body.ui2-page input[type=search], html.ui2 body.ui2-page input[type=email],
html.ui2 body.ui2-page input[type=number], html.ui2 body.ui2-page input[type=date], html.ui2 body.ui2-page select { height: 36px; border-radius: 8px; border-color: var(--ui2-line); padding: 0 10px; }
html.ui2 body.ui2-page input:focus, html.ui2 body.ui2-page select:focus { outline: none; border-color: #1a6bd0; box-shadow: 0 0 0 3px rgba(26, 107, 208, .15); }
html.ui2 body.ui2-page .pk-btn { height: 36px; border-radius: 8px; border-color: var(--ui2-line); }
html.ui2 body.ui2-page .pill { padding: 2px 10px; font-size: 11.5px; }

/* ---- cards and tables */
html.ui2 body.ui2-page .card { border-radius: 12px; border-color: var(--ui2-line); box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-page table.list th { background: var(--ui2-head); color: var(--ui2-th); font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .05em;
  padding: 10px 12px; border-bottom: 1px solid var(--ui2-line); }
html.ui2 body.ui2-page table.list td { padding: 11px 12px; border-bottom-color: var(--ui2-line); }
html.ui2 body.ui2-page table.list tbody tr:last-child td { border-bottom: 0; }
html.ui2 body.ui2-page table.list tr:hover td { background: var(--ui2-hover); }
html.ui2 body.ui2-page table.list td a { font-weight: 600; }
html.ui2 body.ui2-page .page > table.list, html.ui2 body.ui2-page .page > .stack > table.list { border-collapse: separate; border-spacing: 0; background: var(--panel);
  border: 1px solid var(--ui2-line); border-radius: 12px; overflow: hidden; box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-page .pager { border-top: 1px solid var(--ui2-line); }

/* ---- tiles (Dashboard): an accent per tile, the status pipeline as one strip */
html.ui2 body.ui2-page .kpis { gap: 14px; margin: 16px 0 16px; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); }
html.ui2 body.ui2-page .kpi { border-radius: 12px; border-color: var(--ui2-line); box-shadow: var(--ui2-shadow); padding: 14px 16px 14px 18px; position: relative; overflow: hidden;
  transition: box-shadow .15s, transform .15s; }
html.ui2 body.ui2-page .kpi:hover { box-shadow: var(--ui2-shadow-h); transform: translateY(-1px); }
html.ui2 body.ui2-page .kpi b { font-size: 28px; font-weight: 750; line-height: 1.15; letter-spacing: -.01em; }
html.ui2 body.ui2-page .kpi span { font-size: 12.5px; font-weight: 600; }
html.ui2 body.ui2-page .kpis > .kpi::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 4px; background: var(--k, var(--ui2-k1)); }
html.ui2 body.ui2-page .kpis > .kpi:nth-of-type(1) { --k: var(--ui2-k1); } html.ui2 body.ui2-page .kpis > .kpi:nth-of-type(2) { --k: var(--ui2-k2); }
html.ui2 body.ui2-page .kpis > .kpi:nth-of-type(3) { --k: var(--ui2-k3); } html.ui2 body.ui2-page .kpis > .kpi:nth-of-type(4) { --k: var(--ui2-k4); }
html.ui2 body.ui2-page .kpis > .kpi:nth-of-type(5) { --k: var(--ui2-k5); }
html.ui2 body.ui2-page .kpis > .kpi b { color: var(--k); }
html.ui2 body.ui2-page .kpi.on { outline: 0; box-shadow: 0 0 0 2px var(--k, #1a6bd0), var(--ui2-shadow-h); background: color-mix(in srgb, var(--k, #1a6bd0) 7%, var(--panel)); }
html.ui2 body.ui2-page .kpi.bad b { color: var(--ui2-k4); }
html.ui2 body.ui2-page .pipeline { box-shadow: var(--ui2-shadow); border-radius: 12px; }
html.ui2 body.ui2-page .pipeline .kpi { box-shadow: none; border-radius: 0; padding: 12px 14px 12px 18px; }
html.ui2 body.ui2-page .pipeline .kpi:hover { transform: none; background: var(--ui2-hover); }
html.ui2 body.ui2-page .pipeline .kpi:first-child { border-radius: 12px 0 0 12px; } html.ui2 body.ui2-page .pipeline .kpi:last-child { border-radius: 0 12px 12px 0; }
html.ui2 body.ui2-page .pipeline .kpi b { font-size: 22px; color: var(--ink); }
html.ui2 body.ui2-page .pipeline .kpi::after { content: ""; position: absolute; left: 0; right: 0; top: 0; height: 3px; background: var(--ps, #94a3b8); opacity: .9; }
html.ui2 body.ui2-page .pipeline .kpi:nth-child(1) { --ps: #94a3b8; } html.ui2 body.ui2-page .pipeline .kpi:nth-child(2) { --ps: #64748b; }
html.ui2 body.ui2-page .pipeline .kpi:nth-child(3) { --ps: #f59e0b; } html.ui2 body.ui2-page .pipeline .kpi:nth-child(4) { --ps: #d97706; }
html.ui2 body.ui2-page .pipeline .kpi:nth-child(5) { --ps: #60a5fa; } html.ui2 body.ui2-page .pipeline .kpi:nth-child(6) { --ps: #2563eb; }
html.ui2 body.ui2-page .pipeline .kpi:nth-child(7) { --ps: #8b5cf6; } html.ui2 body.ui2-page .pipeline .kpi:nth-child(8) { --ps: #16a34a; }
html.ui2 body.ui2-page .pipeline .kpi.on { box-shadow: inset 0 0 0 2px #1a6bd0; background: color-mix(in srgb, #1a6bd0 7%, var(--panel)); }

/* ---- filter bars as toolbars */
html.ui2 body.ui2-page .filters { background: var(--panel); border: 1px solid var(--ui2-line); border-radius: 12px; padding: 10px 12px; box-shadow: var(--ui2-shadow); gap: 10px; margin: 0 0 14px; }
html.ui2 body.ui2-page .filters:has(+ .filters) { border-radius: 12px 12px 0 0; margin-bottom: 0; border-bottom-style: dashed; box-shadow: none; }
html.ui2 body.ui2-page .filters + .filters { border-radius: 0 0 12px 12px; border-top: 0; }
html.ui2 body.ui2-page .chipbar { margin: -4px 0 12px; }

/* ---- tabs (Admin) */
html.ui2 body.ui2-page .tabsbar { background: var(--panel); border: 1px solid var(--ui2-line); border-radius: 12px; padding: 5px; gap: 4px; box-shadow: var(--ui2-shadow); margin: 0 0 16px; }
html.ui2 body.ui2-page .tabsbar button { border: 0; border-radius: 8px; padding: 8px 14px; color: var(--ink-2); }
html.ui2 body.ui2-page .tabsbar button:hover { background: var(--ui2-hover); }
html.ui2 body.ui2-page .tabsbar button.on { background: var(--ui2-navy); color: #fff; }

/* ---- reading pages (Guide) */
html.ui2 body.ui2-page .page h2 { font-size: 17px; margin: 26px 0 12px; padding-left: 12px; border-left: 4px solid var(--ui2-gold); }
html.ui2 body.ui2-page .page h2.hero-el { border: 0; padding: 0; }
html.ui2 body.ui2-page .page > ul, html.ui2 body.ui2-page .page > ol { line-height: 1.75; background: var(--panel); border: 1px solid var(--ui2-line); border-radius: 12px;
  padding: 14px 18px 14px 36px; box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-page .empty { color: var(--muted); }

/* ---- Part E (ui_v2), second pass: Taxonomies, the Taxonomy Viewer and the Inline Viewer */
/* Taxonomies: the hero is part of the band (no white strip under the app bar) */
html.ui2 body.ui2-page .txl-hero { background: transparent; padding-top: 18px; }
html.ui2 body.ui2-page .txl-hero.hero-el + .txl-body { margin-top: -48px; }
html.ui2 body.ui2-page .txl-hero .wrap, html.ui2 body.ui2-page .txl-body { max-width: 1600px; }
html.ui2 body.ui2-page .txl-find, html.ui2 body.ui2-page .txl-card { border-radius: 12px; border-color: var(--ui2-line); box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-page .txl-card:hover { box-shadow: var(--ui2-shadow-h); }
html.ui2 body.ui2-page .txl-stat { border-radius: 12px; background: rgba(255, 255, 255, .10); }
/* the viewers: the breadcrumb strip joins the navy app bar; panels are cards on the light canvas */
html.ui2 body.ui2-app { background: var(--ui2-bg); }
html.ui2 body.ui2-app .crumbs { background: var(--ui2-navy); border-bottom-color: rgba(255, 255, 255, .08); color: #9fb3cc; }
html.ui2 body.ui2-app .crumbs a { color: #cfe0f5; } html.ui2 body.ui2-app .crumbs [aria-current] { color: #fff; }
html.ui2 body.ui2-app .btn { border-radius: 8px; font-weight: 600; border-color: var(--ui2-line); background: var(--panel); box-shadow: 0 1px 2px rgba(16, 24, 40, .05); }
html.ui2 body.ui2-app .btn:hover { background: var(--ui2-hover); }
html.ui2 body.ui2-app .btn.primary { background: linear-gradient(180deg, #1a6bd0, #0b54a8); border-color: #0b54a8; color: #fff; }
html.ui2 body.ui2-app input[type=search], html.ui2 body.ui2-app input[type=text], html.ui2 body.ui2-app select { border-radius: 8px; border-color: var(--ui2-line); }
html.ui2 body.ui2-app input:focus, html.ui2 body.ui2-app select:focus { outline: none; border-color: #1a6bd0; box-shadow: 0 0 0 3px rgba(26, 107, 208, .15); }
/* Taxonomy Viewer */
html.ui2 body.ui2-app .tx2 { background: var(--ui2-bg); }
html.ui2 body.ui2-app .tx2-head { background: linear-gradient(120deg, var(--ui2-navy-2) 0%, var(--ui2-blue) 100%); border-bottom: 0; }
html.ui2 body.ui2-app .tx2-head .btn { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .30); color: #fff; box-shadow: none; }
html.ui2 body.ui2-app .tx2-head .btn:hover { background: rgba(255, 255, 255, .18); }
html.ui2 body.ui2-app .tx2-main { gap: 12px; padding: 12px; }
html.ui2 body.ui2-app .tx2-split { gap: 12px; }
html.ui2 body.ui2-app .tx2-pane { border-radius: 12px; border-color: var(--ui2-line); box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-app .tx2-ph { background: var(--ui2-head); border-bottom-color: var(--ui2-line); padding: 9px 12px; }
html.ui2 body.ui2-app .tx2-box { border-radius: 10px; border-color: var(--ui2-line); }
html.ui2 body.ui2-app .tx2-grid-t th { background: var(--ui2-head); color: var(--ui2-th); text-transform: uppercase; letter-spacing: .05em; font-size: 10.5px; }
/* Inline Viewer */
html.ui2 body.ui2-app .ivx { background: var(--ui2-bg); }
html.ui2 body.ui2-app .ivx-bar { background: var(--panel); border-bottom: 1px solid var(--ui2-line); padding: 8px 12px; gap: 8px; box-shadow: 0 1px 3px rgba(16, 24, 40, .05); position: relative; z-index: 2; }
html.ui2 body.ui2-app .ivx-bar .btn { height: 32px; }
html.ui2 body.ui2-app .ivx-search input { height: 32px; border-radius: 8px 0 0 8px; }
html.ui2 body.ui2-app .ivx-main { gap: 10px; padding: 10px; }
html.ui2 body.ui2-app .ivx-left, html.ui2 body.ui2-app .ivx-right { border: 1px solid var(--ui2-line); border-radius: 12px; box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-app .ivx-doc { border: 1px solid var(--ui2-line); border-radius: 12px; overflow: hidden; box-shadow: var(--ui2-shadow); background: var(--panel); }
html.ui2 body.ui2-app .ivx-tabs { background: var(--ui2-head); border-bottom-color: var(--ui2-line); padding: 6px 10px 0; gap: 4px; }
html.ui2 body.ui2-app .ivx-tabs button { border-radius: 8px 8px 0 0; border-color: var(--ui2-line); padding: 6px 12px; font-weight: 600; }
html.ui2 body.ui2-app .ivx-tabs button.on { background: var(--panel); color: var(--ui2-navy-2); box-shadow: inset 0 3px 0 var(--ui2-gold); }
html.ui2 body.ui2-app .ivx-ph { background: var(--ui2-head); border-bottom-color: var(--ui2-line); }
html.ui2 body.ui2-page .txl-group h2 { border-left: 0; padding-left: 0; margin: 0 0 10px; }
.tx2c-succ { display: block; color: inherit; text-decoration: none; border-left: 3px solid var(--add-line); padding-left: 8px; }
.tx2c-succ:hover .tx2c-l { color: var(--accent); text-decoration: underline; }

/* ---- Part E (ui_v2), third pass: the comparison viewer. The meaning colours (modified / added / removed, the role headers,
   the legend) and the SEC rendering of the grid are unchanged; the chrome around them is redesigned. */
html.ui2 body.ui2-viewer { background: var(--ui2-bg); }
html.ui2 body.ui2-viewer .crumbs { background: var(--ui2-navy); border-bottom-color: rgba(255, 255, 255, .08); color: #9fb3cc; }
html.ui2 body.ui2-viewer .crumbs a { color: #cfe0f5; } html.ui2 body.ui2-viewer .crumbs [aria-current] { color: #fff; }
html.ui2 body.ui2-viewer .v-head { background: linear-gradient(120deg, var(--ui2-navy) 0%, var(--ui2-navy-2) 60%, var(--ui2-blue) 100%); border-bottom: 0;
  padding: 8px 14px; color: #fff; }
html.ui2 body.ui2-viewer .v-bar { gap: 8px 12px; }
html.ui2 body.ui2-viewer .v-bar .brand .logo { width: 30px; height: 30px; box-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
html.ui2 body.ui2-viewer .v-bar .co { color: #fff; font-size: 16px; }
html.ui2 body.ui2-viewer .v-bar .hm { color: #c9d7ea; border-left-color: rgba(255, 255, 255, .22); }
html.ui2 body.ui2-viewer .v-bar .hm.b { color: #fff; }
html.ui2 body.ui2-viewer .cmp-badge, html.ui2 body.ui2-viewer .run-badge { background: rgba(255, 255, 255, .14); border: 1px solid rgba(255, 255, 255, .28);
  color: #fff; padding: 3px 12px; max-width: 520px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.ui2 body.ui2-viewer .hchips { gap: 6px; }
html.ui2 body.ui2-viewer .hchip { height: 26px; padding: 0 10px; border-radius: 8px; background: #fff; border-color: transparent; color: var(--ink-2);
  box-shadow: 0 1px 2px rgba(0, 0, 0, .15); font-weight: 550; }
html.ui2 body.ui2-viewer .hchip:hover { filter: brightness(.97); }
html.ui2 body.ui2-viewer .hchip.on { background: var(--ui2-gold); color: #1b1300; } html.ui2 body.ui2-viewer .hchip.on b { color: #1b1300; }
html.ui2 body.ui2-viewer .hchip.plain { background: none; box-shadow: none; color: #c9d7ea; }
html.ui2 body.ui2-viewer .v-head .seg { border-color: rgba(255, 255, 255, .3); border-radius: 8px; }
html.ui2 body.ui2-viewer .v-head .seg button { background: rgba(255, 255, 255, .08); color: #dbe6f3; height: 30px; padding: 0 14px; }
html.ui2 body.ui2-viewer .v-head .seg button.on { background: #fff; color: var(--ui2-navy); }
html.ui2 body.ui2-viewer .v-head .btn { background: rgba(255, 255, 255, .10); border-color: rgba(255, 255, 255, .28); color: #fff; border-radius: 8px; }
html.ui2 body.ui2-viewer .v-head .btn:hover { background: rgba(255, 255, 255, .2); }
html.ui2 body.ui2-viewer .v-head .btn.on { background: var(--ui2-gold); color: #1b1300; border-color: var(--ui2-gold); }
html.ui2 body.ui2-viewer .iconbar { gap: 5px; }
html.ui2 body.ui2-viewer .iconbar .btn.icon { width: 32px; height: 30px; }
html.ui2 body.ui2-viewer .iconbar .btn.icon .cnt { background: var(--ui2-gold); color: #1b1300; }
html.ui2 body.ui2-viewer .v-head .banner { border-radius: 8px; }
/* panels as cards on the canvas */
html.ui2 body.ui2-viewer .v-main { gap: 10px; padding: 10px; background: var(--ui2-bg); }
html.ui2 body.ui2-viewer .panel, html.ui2 body.ui2-viewer .v-center { border: 1px solid var(--ui2-line); border-radius: 12px; box-shadow: var(--ui2-shadow); overflow: hidden;
  background: var(--panel); }
html.ui2 body.ui2-viewer .v-nav, html.ui2 body.ui2-viewer .v-right { border-left: 1px solid var(--ui2-line); border-right: 1px solid var(--ui2-line); }
html.ui2 body.ui2-viewer .pn-head { background: var(--ui2-head); border-bottom-color: var(--ui2-line); min-height: 40px; padding: 6px 10px; }
html.ui2 body.ui2-viewer .pn-head b { color: var(--ui2-th); letter-spacing: .06em; font-size: 11.5px; }
html.ui2 body.ui2-viewer .pn-foot { border-top-color: var(--ui2-line); background: var(--ui2-head); }
html.ui2 body.ui2-viewer .v-right .tabs { padding: 6px 10px 0; gap: 2px; border-bottom-color: var(--ui2-line); scrollbar-width: none; overflow-y: hidden; }
html.ui2 body.ui2-viewer .v-right .tabs::-webkit-scrollbar { display: none; }
html.ui2 body.ui2-viewer .v-right .tabs { justify-content: space-between; padding: 6px 6px 0; }
html.ui2 body.ui2-viewer .v-right .tabs button { padding: 7px 6px; border-radius: 8px 8px 0 0; font-size: 12.5px; flex: 0 1 auto; }
html.ui2 body.ui2-viewer .v-right .tabs button:hover { background: var(--ui2-hover); color: var(--ink); }
html.ui2 body.ui2-viewer .v-right .tabs button.on { color: var(--ui2-navy-2); border-bottom: 3px solid var(--ui2-gold); }
html.ui2 body.ui2-viewer .grp { letter-spacing: .05em; }
html.ui2 body.ui2-viewer .role { border-radius: 8px; margin: 1px 6px; }
html.ui2 body.ui2-viewer .role.cur { box-shadow: inset 3px 0 0 var(--ui2-gold); }
html.ui2 body.ui2-viewer .drawer { margin: 0 10px 10px; border: 1px solid var(--ui2-line); border-radius: 12px; box-shadow: var(--ui2-shadow); overflow: hidden; }

/* the comparison header's toggles and status (formerly under "More ▾") */
.hchip.toggle .tg { display: inline-grid; place-items: center; width: 13px; height: 13px; border: 1.5px solid currentColor; border-radius: 3px; font-size: 10px; line-height: 1; margin-right: 3px; }
.hchip.status.ok b, .hchip.status.ok { color: var(--ok); } .hchip.status.bad { color: var(--bad); } .hchip.status.warn { color: var(--mod); }
html.ui2 body.ui2-viewer .hchip.status { font-weight: 650; }

/* the viewer header in one row (15 Oct): identity block | chips (scroll sideways when they do not fit) | tools */
.v-id, .v-id1, .v-id2 { display: contents; }
html.ui2 body.ui2-viewer .v-bar { flex-wrap: nowrap; min-height: 46px; }
html.ui2 body.ui2-viewer .v-id { display: flex; flex-direction: column; justify-content: center; gap: 4px; min-width: 0; flex: 0 1 auto; max-width: 440px; }
html.ui2 body.ui2-viewer .v-id1 { display: flex; align-items: baseline; gap: 9px; white-space: nowrap; min-width: 0; overflow: hidden; }
html.ui2 body.ui2-viewer .v-id1 .co { font-size: 16px; line-height: 20px; }
html.ui2 body.ui2-viewer .v-id1 .hm { font-size: 12px; line-height: 14px; }
html.ui2 body.ui2-viewer .v-id2 { display: block; min-width: 0; line-height: 1; }
html.ui2 body.ui2-viewer .v-id2 .cmp-badge, html.ui2 body.ui2-viewer .v-id2 .run-badge { display: inline-block; max-width: 100%; font-size: 11px; padding: 2px 10px; vertical-align: top; }
html.ui2 body.ui2-viewer .hchips { flex: 1 1 auto; min-width: 0; flex-wrap: nowrap; overflow-x: auto; overflow-y: hidden; scrollbar-width: none; padding: 3px 2px;
  scroll-behavior: smooth; }
html.ui2 body.ui2-viewer .hchips::-webkit-scrollbar { display: none; }
html.ui2 body.ui2-viewer .hchips > * { flex: none; }
html.ui2 body.ui2-viewer .hchips.ovf-r { -webkit-mask-image: linear-gradient(to right, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(to right, #000 calc(100% - 36px), transparent); }
html.ui2 body.ui2-viewer .hchips.ovf-l { -webkit-mask-image: linear-gradient(to right, transparent, #000 36px); mask-image: linear-gradient(to right, transparent, #000 36px); }
html.ui2 body.ui2-viewer .hchips.ovf-l.ovf-r { -webkit-mask-image: linear-gradient(to right, transparent, #000 36px, #000 calc(100% - 36px), transparent); mask-image: linear-gradient(to right, transparent, #000 36px, #000 calc(100% - 36px), transparent); }
html.ui2 body.ui2-viewer .hchip { transition: transform .15s, box-shadow .15s, background .15s; }
html.ui2 body.ui2-viewer .hchip:hover { transform: translateY(-1px); box-shadow: 0 3px 8px rgba(0, 0, 0, .22); }
html.ui2 body.ui2-viewer .v-bar > .grow { flex: 0 0 4px; }
html.ui2 body.ui2-viewer .iconbar .btn.icon { width: 30px; }
html.ui2 body.ui2-viewer .v-id { min-width: 280px; }
html.ui2 body.ui2-viewer .v-id1 .co { flex: none; max-width: 260px; overflow: hidden; text-overflow: ellipsis; }
html.ui2 body.ui2-viewer .v-id1 .hm { flex: 0 1 auto; min-width: 0; overflow: hidden; text-overflow: ellipsis; }
html.ui2 body.ui2-viewer .v-id { flex: none; max-width: 600px; }
html.ui2 body.ui2-viewer .v-id1 .hm { flex: none; }
/* 15 Oct: more room for the review — the viewer's cards sit 4 px apart and 4 px from the window's edges */
html.ui2 body.ui2-viewer .v-main { gap: 4px; padding: 4px; }
html.ui2 body.ui2-viewer .panel, html.ui2 body.ui2-viewer .v-center { border-radius: 8px; }
html.ui2 body.ui2-viewer .drawer { margin: 0 4px 4px; border-radius: 8px; }
/* 15 Oct: every chip visible — smaller chips that wrap onto a second row within the header (no sideways scrolling) */
html.ui2 body.ui2-viewer .hchips { flex-wrap: wrap; overflow: visible; row-gap: 4px; column-gap: 5px; align-content: center; padding: 0;
  -webkit-mask-image: none !important; mask-image: none !important; }
html.ui2 body.ui2-viewer .hchip { height: 22px; padding: 0 8px; font-size: 11.5px; border-radius: 6px; }
html.ui2 body.ui2-viewer .hchip b { font-size: 11.5px; }
html.ui2 body.ui2-viewer .hchip .cp { line-height: 20px; padding: 0 4px; }
html.ui2 body.ui2-viewer .hchip.toggle .tg { width: 11px; height: 11px; font-size: 9px; }
html.ui2 body.ui2-viewer .iconbar { gap: 3px; }
html.ui2 body.ui2-viewer .iconbar .btn.icon { width: 28px; height: 28px; }
html.ui2 body.ui2-viewer .v-head .seg button { height: 28px; padding: 0 10px; }
html.ui2 body.ui2-viewer .v-head .cmp-btn { height: 28px; padding: 0 10px; }

/* 15 Oct (ui_v2): the Compare panel */
.pop.cmp2-pop { padding: 0; border-radius: 12px; overflow: hidden; border-color: var(--ui2-line); box-shadow: 0 12px 36px rgba(16, 24, 40, .22); }
.cmp2 { display: flex; flex-direction: column; max-height: min(78vh, 760px); }
.cmp2-head { background: linear-gradient(120deg, var(--ui2-navy), var(--ui2-navy-2)); color: #fff; padding: 14px 16px; }
.cmp2-title { font-size: 15px; font-weight: 700; }
.cmp2-sub { font-size: 12px; color: #c3d3e8; margin-top: 3px; }
.cmp2-body { overflow: auto; padding: 6px 12px 12px; display: flex; flex-direction: column; gap: 6px; }
.cmp2-back { align-self: flex-start; border: 0; background: none; color: var(--accent); font: inherit; font-weight: 600; padding: 6px 2px; cursor: pointer; }
.cmp2-sec { display: flex; align-items: baseline; gap: 8px; font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ui2-th); margin: 10px 2px 2px; }
.cmp2-cik { font-weight: 600; letter-spacing: 0; text-transform: none; font-family: var(--mono); color: var(--muted); }
.cmp2-card { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 1px solid var(--ui2-line); background: var(--panel); border-radius: 10px;
  padding: 9px 12px; cursor: pointer; font: inherit; color: var(--ink); transition: border-color .12s, box-shadow .12s, transform .12s; }
.cmp2-card:hover { border-color: #1a6bd0; box-shadow: 0 3px 10px rgba(26, 107, 208, .14); transform: translateY(-1px); }
.cmp2-card.on { border-color: #1a6bd0; background: color-mix(in srgb, #1a6bd0 6%, var(--panel)); }
.cmp2-ic { width: 30px; height: 30px; flex: none; border-radius: 8px; display: grid; place-items: center; background: var(--ui2-head); color: var(--ui2-navy-2); font-size: 15px; }
.cmp2-ct { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cmp2-ct b { font-weight: 650; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cmp2-ct small { color: var(--muted); }
.cmp2-go { color: var(--muted); font-size: 18px; line-height: 1; padding-left: 2px; }
.cmp2-search input { width: 100%; height: 36px; border-radius: 8px; }
.cmp2-forms { display: flex; gap: 5px; flex-wrap: wrap; }
.cmp2-fchip { border: 1px solid var(--ui2-line); background: var(--panel); border-radius: 999px; padding: 3px 10px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; color: var(--ink-2); }
.cmp2-fchip:hover { background: var(--ui2-hover); }
.cmp2-fchip.on { background: var(--ui2-navy); border-color: var(--ui2-navy); color: #fff; }
.cmp2-list { border: 1px solid var(--ui2-line); border-radius: 10px; overflow: auto; max-height: 300px; min-height: 60px; }
.cmp2-row { display: grid; grid-template-columns: 74px minmax(0, 1fr) auto auto; align-items: center; gap: 10px; width: 100%; text-align: left; border: 0;
  border-bottom: 1px solid var(--line-soft); background: var(--panel); padding: 8px 12px; cursor: pointer; font: inherit; color: var(--ink); }
.cmp2-row:last-child { border-bottom: 0; }
.cmp2-row:hover { background: var(--ui2-hover); }
.cmp2-form { justify-self: start; font-weight: 800; font-size: 11.5px; padding: 3px 8px; border-radius: 6px; background: var(--bg-sunk); color: var(--ink-2); white-space: nowrap; }
.cmp2-form.annual { background: color-mix(in srgb, #1d4ed8 12%, transparent); color: #1d4ed8; }
.cmp2-form.quarter { background: color-mix(in srgb, #0e7c86 14%, transparent); color: #0e7c86; }
.cmp2-form.reg { background: color-mix(in srgb, #7c3aed 12%, transparent); color: #7c3aed; }
.cmp2-form.current { background: var(--bg-sunk); color: var(--muted); }
.cmp2-rd { display: flex; flex-direction: column; min-width: 0; } .cmp2-rd small { color: var(--muted); }
.cmp2-acc { font-family: var(--mono); font-size: 11px; color: var(--muted); }
.cmp2-foot { font-size: 11.5px; color: var(--muted); padding: 2px 2px 0; }
/* 18 Oct (compare_pop_v3): the SEC list takes the room left in a full-height pop-up; one scrollbar that stops at its ends */
.cmp3 .cmp2 { max-height: none; }
.cmp3 .cmp2-body { overscroll-behavior: contain; }
.cmp3 .cmp2-list { max-height: none; min-height: 220px; overscroll-behavior: contain; scroll-snap-type: y proximity; }
.cmp3 .cmp2-row { padding: 6px 12px; scroll-snap-align: start; }
.cmp3 .cmp2-row .cmp2-rd b { font-size: 13px; }
/* 15 Oct: a narrower window — the chips get their own full-width row under the company line instead of a squeezed column */
@media (max-width: 1560px) {
  html.ui2 body.ui2-viewer .v-bar { flex-wrap: wrap; row-gap: 6px; }
  html.ui2 body.ui2-viewer .v-bar > .grow { flex: 1 1 0; }
  html.ui2 body.ui2-viewer .hchips { order: 10; flex: 1 1 100%; justify-content: flex-start; }
}
@media (max-width: 900px) {
  html.ui2 body.ui2-viewer .v-id { max-width: 100%; }
  html.ui2 body.ui2-viewer .v-id1 .hm { display: none; }
}

/* 15 Oct (ui_v2): the Export panel */
.pop.xp2-pop { padding: 0; border-radius: 12px; overflow: hidden; border-color: var(--ui2-line); box-shadow: 0 12px 36px rgba(16, 24, 40, .22); }
.xp2 { display: flex; flex-direction: column; max-height: min(80vh, 760px); }
.xp2-head { background: linear-gradient(120deg, var(--ui2-navy), var(--ui2-navy-2)); color: #fff; padding: 14px 16px; }
.xp2-title { font-size: 15px; font-weight: 700; } .xp2-sub { font-size: 12px; color: #c3d3e8; margin-top: 3px; }
.xp2-body { overflow: auto; padding: 8px 14px 14px; display: flex; flex-direction: column; gap: 8px; }
.xp2-sec { font-size: 11px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ui2-th); margin-top: 6px; }
.xp2-seg { display: flex; width: 100%; border-radius: 8px; }
.xp2-seg button { flex: 1; height: 32px; }
.xp2-seg button.on { background: var(--ui2-navy); color: #fff; }
.xp2-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.xp2-card { display: flex; align-items: center; gap: 10px; text-align: left; border: 1px solid var(--ui2-line); background: var(--panel); border-radius: 10px; padding: 10px;
  cursor: pointer; font: inherit; color: var(--ink); transition: border-color .12s, box-shadow .12s, transform .12s; }
.xp2-card:hover { border-color: var(--c); box-shadow: 0 4px 12px color-mix(in srgb, var(--c) 22%, transparent); transform: translateY(-1px); }
.xp2-ic { width: 36px; height: 36px; flex: none; border-radius: 8px; display: grid; place-items: center; font-size: 10.5px; font-weight: 800; color: #fff; background: var(--c); }
.xp2-ct { flex: 1; min-width: 0; display: flex; flex-direction: column; } .xp2-ct b { font-weight: 700; } .xp2-ct small { color: var(--muted); font-size: 11px; line-height: 1.3; }
.xp2-dl { color: var(--muted); font-size: 14px; }
.xp2-card.pdf { --c: #c62828; } .xp2-card.xlsx { --c: #1a7f37; } .xp2-card.docx { --c: #1d4ed8; } .xp2-card.html { --c: #475569; }
.xp2-opts { display: grid; grid-template-columns: 1fr 1fr; gap: 8px; }
.xp2-opt { display: flex; flex-direction: column; text-align: left; border: 1px solid var(--ui2-line); background: var(--panel); border-radius: 10px; padding: 8px 10px; cursor: pointer; font: inherit; color: var(--ink); }
.xp2-opt small { color: var(--muted); font-size: 11px; }
.xp2-opt.on { border-color: #1a6bd0; background: color-mix(in srgb, #1a6bd0 7%, var(--panel)); box-shadow: inset 0 0 0 1px #1a6bd0; }
.xp2-note { font-size: 11.5px; color: var(--muted); line-height: 1.45; }
.xp2-foot { display: flex; gap: 8px; flex-wrap: wrap; border-top: 1px solid var(--line-soft); padding-top: 10px; }
.xp2-link { border: 1px solid var(--ui2-line); background: var(--panel); border-radius: 8px; padding: 6px 10px; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; color: var(--ink-2); }
.xp2-link:hover { background: var(--ui2-hover); color: var(--ink); }

/* 15 Oct: a compact viewer header — the trail inside the band, the chips beside the run title, tools on the right (≈72 px) */
html.ui2 body.ui2-viewer .v-app:not(:has(> .crumbs)) { grid-template-rows: auto 1fr auto; }
html.ui2 body.ui2-viewer .v-head { padding: 5px 12px 7px; gap: 2px; }
html.ui2 body.ui2-viewer .v-head .crumbs { background: none; border: 0; padding: 0 0 3px; min-height: 0; font-size: 11px; gap: 5px; }
html.ui2 body.ui2-viewer .v-bar { min-height: 0; align-items: center; }
html.ui2 body.ui2-viewer .v-id { flex: 1 1 auto; max-width: none; min-width: 0; gap: 3px; }
html.ui2 body.ui2-viewer .v-id2 { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; row-gap: 4px; }
html.ui2 body.ui2-viewer .v-id2 .hchips { order: 0; flex: 1 1 auto; min-width: 0; flex-wrap: wrap; row-gap: 4px; }
html.ui2 body.ui2-viewer .v-id2 .cmp-badge, html.ui2 body.ui2-viewer .v-id2 .run-badge { flex: none; height: 22px; line-height: 16px; max-width: 360px; }
html.ui2 body.ui2-viewer .hchip { height: 22px; }
html.ui2 body.ui2-viewer .v-bar > .brand .logo { width: 34px; height: 34px; }
html.ui2 body.ui2-viewer .v-bar { flex-wrap: nowrap !important; }
html.ui2 body.ui2-viewer .v-bar > .seg, html.ui2 body.ui2-viewer .v-bar > .cmp-btn, html.ui2 body.ui2-viewer .v-bar > .iconbar, html.ui2 body.ui2-viewer .v-bar > .brand { flex: none; }
html.ui2 body.ui2-viewer .v-bar > .grow { flex: 0 0 6px !important; }
/* 15 Oct: Export panel — sections never shrink; the Selected roles list scrolls in its own box */
.xp2-body > * { flex: none; }
.xp2-body .xroles { max-height: 220px; overflow: auto; border: 1px solid var(--ui2-line); border-radius: 10px; padding: 6px 10px; background: var(--ui2-head); }
.xp2-body .xroles.hidden { display: none; }
.xp2-body .xroles label { display: flex; gap: 8px; align-items: flex-start; padding: 3px 0; font-size: 12.5px; line-height: 1.35; }
.xp2-body .xroles .grp-h { position: sticky; top: -6px; background: var(--ui2-head); padding: 4px 0; z-index: 1; }
.xp2-seg { flex: none; min-height: 32px; }
.cmp2-forms { align-items: center; } .cmp2-count { margin-left: auto; font-size: 11.5px; color: var(--muted); white-space: nowrap; }

/* 15 Oct (ui_v2): the Inline Viewer's menus as panels */
html.ui2 body.ui2-app .pop:has(.ivm) { padding: 6px; border-radius: 12px; border-color: var(--ui2-line); box-shadow: 0 12px 32px rgba(16, 24, 40, .2); min-width: 280px; }
html.ui2 body.ui2-app .ivm { gap: 2px; }
html.ui2 body.ui2-app .ivm-head { display: flex; flex-direction: column; gap: 1px; padding: 6px 10px 8px; border-bottom: 1px solid var(--line-soft); margin-bottom: 4px; }
html.ui2 body.ui2-app .ivm-head b { font-size: 13px; color: var(--ink); }
html.ui2 body.ui2-app .ivm-head small { font-size: 11.5px; color: var(--muted); font-weight: 400; }
html.ui2 body.ui2-app .row.ivm-head { flex-direction: row; align-items: center; flex-wrap: wrap; gap: 4px 10px; }
html.ui2 body.ui2-app .row.ivm-head small { flex-basis: 100%; order: 3; }
html.ui2 body.ui2-app .ivm .pk-opt { display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 8px; border-left: 3px solid transparent; font-size: 13px; }
html.ui2 body.ui2-app .ivm .pk-opt:hover { background: var(--ui2-hover); }
html.ui2 body.ui2-app .ivm .pk-opt:has(input:checked) { background: color-mix(in srgb, #1a6bd0 8%, var(--panel)); border-left-color: #1a6bd0; font-weight: 600; }
html.ui2 body.ui2-app .ivm input[type=radio], html.ui2 body.ui2-app .ivm input[type=checkbox] { accent-color: #1a6bd0; width: 15px; height: 15px; margin: 0; flex: none; }
html.ui2 body.ui2-app .ivm-l { flex: 1; min-width: 0; }
html.ui2 body.ui2-app .ivm .ivm-n { margin-left: auto; background: var(--bg-sunk); color: var(--ink-2); border-radius: 999px; padding: 1px 8px; font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; }
html.ui2 body.ui2-app .ivm-ic { width: 22px; height: 22px; border-radius: 6px; display: grid; place-items: center; background: var(--ui2-head); color: var(--ui2-navy-2); font-size: 11px; font-weight: 700; flex: none; }
html.ui2 body.ui2-app .ivx-more.ivm { width: 380px; max-height: 70vh; }
html.ui2 body.ui2-app .ivx-more details { border: 1px solid var(--ui2-line); border-radius: 10px; margin: 4px 2px; background: var(--panel); }
html.ui2 body.ui2-app .ivx-more details[open] { box-shadow: var(--ui2-shadow); }
html.ui2 body.ui2-app .ivx-more summary { padding: 8px 12px; font-weight: 650; list-style-position: inside; border-radius: 10px; }
html.ui2 body.ui2-app .ivx-more summary:hover { background: var(--ui2-hover); }
html.ui2 body.ui2-app .ivx-more summary b { color: #1a6bd0; }
html.ui2 body.ui2-app .ivx-checks { padding: 2px 8px 8px; max-height: 240px; }
html.ui2 body.ui2-app .ivm .checks label { display: flex; align-items: center; gap: 8px; padding: 5px 6px; border-radius: 6px; font-size: 12.5px; }
html.ui2 body.ui2-app .ivm .checks label:hover { background: var(--ui2-hover); }
html.ui2 body.ui2-app .ivm .checks label:has(input:checked) { background: color-mix(in srgb, #1a6bd0 7%, var(--panel)); font-weight: 600; }
html.ui2 body.ui2-app .ivm-search .checks { padding: 2px 4px 6px; }
html.ui2 body.ui2-app .pop:has(.ivx-more.ivm) { width: 400px !important; max-width: calc(100vw - 16px); }
html.ui2 body.ui2-app .ivx-more.ivm { width: auto; min-width: 0; box-sizing: border-box; }
html.ui2 body.ui2-app .ivx-more details { margin: 4px 0; }

/* 15 Oct (ui_v2): Settings, Open in a new tab, Columns as panels */
.pop.vp-pop { padding: 0; border-radius: 12px; overflow: hidden; border-color: var(--ui2-line); box-shadow: 0 12px 36px rgba(16, 24, 40, .22); }
.vp { display: flex; flex-direction: column; max-height: min(80vh, 720px); }
.vp-head { background: linear-gradient(120deg, var(--ui2-navy), var(--ui2-navy-2)); color: #fff; padding: 12px 14px; }
.vp-title { font-size: 14.5px; font-weight: 700; } .vp-sub { font-size: 11.5px; color: #c3d3e8; margin-top: 2px; }
.vp-body { overflow: auto; padding: 8px 10px 10px; display: flex; flex-direction: column; gap: 4px; }
.vp-body > * { flex: none; }
.vp-sec { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--ui2-th); margin: 8px 4px 2px; }
.vp-seg { display: flex; width: 100%; border-radius: 8px; } .vp-seg button { flex: 1; height: 30px; } .vp-seg button.on { background: var(--ui2-navy); color: #fff; }
.vp-row { display: flex; align-items: center; gap: 10px; width: 100%; text-align: left; border: 0; background: none; border-radius: 8px; padding: 7px 8px;
  font: inherit; font-size: 13px; color: var(--ink); cursor: pointer; text-decoration: none; }
.vp-row:hover:not([disabled]) { background: var(--ui2-hover); text-decoration: none; }
.vp-row[disabled] { opacity: .5; cursor: default; }
.vp-ic { width: 26px; height: 26px; flex: none; border-radius: 7px; display: grid; place-items: center; background: var(--ui2-head); color: var(--ui2-navy-2); font-size: 13px; font-weight: 700; }
.vp-ic.big { width: 34px; height: 34px; font-size: 16px; border-radius: 9px; }
.vp-row kbd { font: 600 11px var(--mono); border: 1px solid var(--ui2-line); border-bottom-width: 2px; border-radius: 5px; padding: 1px 7px; background: var(--panel); color: var(--ink-2); }
.vp-go { color: var(--muted); }
.vp-link { color: var(--accent); }
.vp-switch { appearance: none; width: 34px; height: 20px; border-radius: 999px; background: var(--bg-sunk); border: 1px solid var(--ui2-line); position: relative; cursor: pointer; flex: none; transition: background .15s; }
.vp-switch::after { content: ""; position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0, 0, 0, .3); transition: transform .15s; }
.vp-switch:checked { background: #1a6bd0; border-color: #1a6bd0; } .vp-switch:checked::after { transform: translateX(14px); }
.vp-card { display: flex; align-items: center; gap: 10px; border: 1px solid var(--ui2-line); border-radius: 10px; padding: 9px 10px; color: var(--ink); text-decoration: none;
  transition: border-color .12s, box-shadow .12s, transform .12s; }
.vp-card:hover { border-color: #1a6bd0; box-shadow: 0 3px 10px rgba(26, 107, 208, .14); transform: translateY(-1px); text-decoration: none; }
.vp-card b { display: block; font-weight: 650; } .vp-card small { display: block; color: var(--muted); font-size: 11.5px; }
.vp-bar { display: flex; align-items: center; gap: 10px; padding: 2px 4px 4px; }
.vp-cols { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; }
.vp-cols label { display: flex; align-items: center; gap: 8px; padding: 6px 8px; border: 1px solid var(--ui2-line); border-radius: 8px; font-size: 12.5px; cursor: pointer; }
.vp-cols label:hover { background: var(--ui2-hover); }
.vp-cols label:has(input:checked) { border-color: color-mix(in srgb, #1a6bd0 45%, var(--ui2-line)); background: color-mix(in srgb, #1a6bd0 6%, var(--panel)); }
.vp-cols input { accent-color: #1a6bd0; margin: 0; }
.vp-note { font-size: 11.5px; color: var(--muted); padding: 6px 4px 2px; }
.vp-reset { border-top: 1px solid var(--line-soft); border-radius: 0 0 8px 8px; margin-top: 2px; }
/* the Calc list in the results panel */
html.ui2 body.ui2-viewer .calc-list { padding: 4px 8px 8px; }
html.ui2 body.ui2-viewer .calc-list .calc-sum { display: flex; align-items: baseline; gap: 8px; padding: 8px 6px; font-weight: 700; color: var(--rem); border: 0; background: none; }
html.ui2 body.ui2-viewer .calc-list > .small.muted { padding: 0 6px 6px !important; }
html.ui2 body.ui2-viewer .calc-list .ri.R { border: 1px solid var(--ui2-line); border-left: 3px solid var(--rem); border-radius: 8px; margin: 0 0 6px; padding: 7px 10px; background: var(--panel);
  box-shadow: 0 1px 2px rgba(16, 24, 40, .04); transition: box-shadow .12s, transform .12s; }
html.ui2 body.ui2-viewer .calc-list .ri.R:hover { box-shadow: 0 3px 10px rgba(198, 40, 40, .12); transform: translateY(-1px); background: color-mix(in srgb, var(--rem) 3%, var(--panel)); }

/* 15 Oct (ui_v2): the Exclude prefix panel */
.px2 .vp-body { display: flex; flex-direction: column; gap: 10px; max-height: min(62vh, 560px); overflow: auto; }
.px2-grp { border: 1px solid var(--ui2-line); border-radius: 10px; background: var(--panel); overflow: hidden; }
.px2-gh { display: flex; align-items: center; gap: 10px; padding: 9px 10px; background: var(--ui2-head); border-bottom: 1px solid var(--ui2-line); }
.px2-gh b { display: block; font-size: 12.5px; color: var(--ink); } .px2-gh small { display: block; font-size: 11px; color: var(--muted); }
.px2-badge { flex: none; width: 34px; height: 24px; border-radius: 6px; display: grid; place-items: center; font: 800 10px/1 var(--sans, inherit); letter-spacing: .04em; color: #fff; background: #1a6bd0; }
.px2-grp.ext .px2-badge { background: #b45309; }
.px2-acts { display: flex; gap: 8px; font-size: 12px; }
.px2-rows { padding: 4px; }
.px2-row { display: grid; grid-template-columns: 16px minmax(64px, auto) 1fr auto; align-items: center; gap: 10px; padding: 6px 8px; border-radius: 7px; cursor: pointer; font-size: 12.5px; }
.px2-row:hover { background: var(--ui2-hover); }
.px2-row input { accent-color: #c62828; margin: 0; width: 15px; height: 15px; }
.px2-pf { font-weight: 600; color: var(--ink); }
.px2-bar { height: 6px; border-radius: 999px; background: var(--bg-sunk); overflow: hidden; }
.px2-bar i { display: block; height: 100%; border-radius: inherit; background: color-mix(in srgb, #1a6bd0 55%, transparent); }
.px2-grp.ext .px2-bar i { background: color-mix(in srgb, #b45309 55%, transparent); }
.px2-n { font-size: 11px; font-weight: 600; font-variant-numeric: tabular-nums; color: var(--ink-2); background: var(--bg-sunk); border-radius: 999px; padding: 1px 8px; min-width: 34px; text-align: center; }
.px2-row:has(input:checked) { background: color-mix(in srgb, #c62828 6%, var(--panel)); }
.px2-row:has(input:checked) .px2-pf { text-decoration: line-through; color: var(--muted); }
.px2-row:has(input:checked) .px2-bar i { background: color-mix(in srgb, #c62828 45%, transparent); }
.px2-foot { display: flex; justify-content: flex-end; padding: 2px 8px 4px; }
.px2-tag { font-size: 10.5px; font-weight: 700; color: var(--muted); }
.px2-tag.on { color: #1a6bd0; margin-left: 8px; }
.px2-empty { padding: 10px 12px; font-size: 12px; color: var(--muted); font-style: italic; }
.px2-match { border: 1px dashed var(--ui2-line); border-radius: 10px; }
.px2-match summary { padding: 8px 12px; cursor: pointer; font-size: 12.5px; }
.px2-mbody { padding: 0 12px 10px; display: flex; flex-direction: column; gap: 8px; align-items: flex-start; }
.px2-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.px2-chip { display: flex; align-items: center; gap: 6px; border: 1px solid var(--ui2-line); border-radius: 999px; padding: 4px 10px; font-size: 12px; cursor: pointer; }
.px2-chip:has(input:checked) { border-color: #1a6bd0; background: color-mix(in srgb, #1a6bd0 7%, var(--panel)); }
.px2-chip input { accent-color: #1a6bd0; margin: 0; }
.px2-actions { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line-soft); background: var(--ui2-head); }
.px2-sum { font-size: 12px; color: var(--muted); } .px2-sum.on { color: #c62828; font-weight: 600; }

/* 15 Oct (xor_access): the client's temporary XOR sign-in */
.xor-acc { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; padding: 8px 14px; border-top: 1px solid var(--line-soft);
  background: color-mix(in srgb, #0e9f6e 7%, var(--panel)); font-size: 13px; }
.xor-acc code { font-size: 12px; }
.xor-acc.client { border: 1px solid color-mix(in srgb, #0e9f6e 35%, var(--line)); border-radius: 10px; margin: 8px 0 12px; }
.xor-acc-ic { width: 26px; height: 26px; border-radius: 7px; display: grid; place-items: center; background: color-mix(in srgb, #0e9f6e 18%, var(--panel)); }
.xor-can { margin: 0; padding-left: 18px; color: var(--ink-2); line-height: 1.6; }
.xor-new .field { display: flex; flex-direction: column; gap: 4px; }

/* 15 Oct (ui_v2): the project page — title and details pinned under the app bar, compact; the rest scrolls beneath */
html.ui2 body.ui2-page.pj-pinned .pj-sticky { position: sticky; top: 52px; z-index: 20; margin: -22px 0 0; padding: 10px 0 12px;
  background: linear-gradient(120deg, var(--ui2-navy) 0%, var(--ui2-navy-2) 70%);
  box-shadow: 0 0 0 100vmax var(--ui2-navy-2); clip-path: inset(0 -100vmax -18px); }
html.ui2 body.ui2-page.pj-pinned .pj-sticky::after { content: ""; position: absolute; left: -100vmax; right: -100vmax; bottom: 0; height: 0;
  box-shadow: 0 6px 14px rgba(10, 26, 51, .28); }
html.ui2 body.ui2-page.pj-pinned .pj-title { margin: 0 0 8px !important; min-height: 40px; }
html.ui2 body.ui2-page.pj-pinned .pj-title h1 { font-size: 22px; margin: 0; }
html.ui2 body.ui2-page.pj-pinned .pj-sticky .hero-el + * { margin-top: 0; }
html.ui2 body.ui2-page.pj-pinned .pj-facts { margin-top: 0 !important; padding: 10px 16px !important; gap: 6px 18px !important;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)) !important; }
html.ui2 body.ui2-page.pj-pinned .pj-facts .kv2 span { font-size: 11px; }
html.ui2 body.ui2-page.pj-pinned .pj-facts .kv2 b { font-size: 13px; line-height: 1.35; }
html.ui2 body.ui2-page.pj-pinned .pj-sticky + * { margin-top: 14px; }
/* the round card: denser, so its details and actions show with the project's */
html.ui2 body.ui2-page.pj-pinned .round-card .rc-body { padding-top: 10px; padding-bottom: 10px; gap: 8px 18px; grid-template-columns: repeat(auto-fill, minmax(148px, 1fr)); }
html.ui2 body.ui2-page.pj-pinned .round-card .rc-body .kv2 span { font-size: 11px; }
html.ui2 body.ui2-page.pj-pinned .round-card .rc-body .kv2 b { font-size: 13px; }
html.ui2 body.ui2-page.pj-pinned h2 { scroll-margin-top: 240px; }

/* 15 Oct (notes_v1): historical (company) notes and project notes */
.nt-h2 { margin-top: 18px; }
.nt-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.nt-grid.one { grid-template-columns: 1fr; }
@media (max-width: 1000px) { .nt-grid { grid-template-columns: 1fr; } }
.nt-col { background: var(--panel); border: 1px solid var(--ui2-line, var(--line)); border-radius: 12px; box-shadow: var(--ui2-shadow, none); overflow: hidden;
  display: flex; flex-direction: column; border-top: 3px solid var(--nt-c); }
.nt-col.company { --nt-c: #6d28d9; } .nt-col.project { --nt-c: #0b6bcb; }
.nt-col > header { display: flex; align-items: center; gap: 10px; padding: 10px 14px; border-bottom: 1px solid var(--line-soft); background: var(--ui2-head, var(--bg-soft)); }
.nt-col > header b { display: flex; align-items: center; gap: 8px; font-size: 14px; } .nt-col > header small { display: block; color: var(--muted); font-size: 11.5px; margin-top: 1px; }
.nt-ic { width: 30px; height: 30px; border-radius: 8px; display: grid; place-items: center; background: color-mix(in srgb, var(--nt-c) 12%, var(--panel)); flex: none; }
.nt-count { font-size: 11px; font-weight: 700; color: #fff; background: var(--nt-c); border-radius: 999px; padding: 1px 8px; }
.nt-list { padding: 10px; display: flex; flex-direction: column; gap: 8px; max-height: 340px; overflow: auto; }
.nt { border: 1px solid var(--line-soft); border-left: 3px solid color-mix(in srgb, var(--nt-c, #0b6bcb) 55%, transparent); border-radius: 8px; padding: 8px 12px; background: var(--panel); }
.nt.pinned { background: color-mix(in srgb, #f5b800 7%, var(--panel)); border-left-color: #d49b00; }
.nt-top { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; margin-bottom: 4px; }
.nt-tags { display: flex; gap: 6px; } .nt-tag { font-size: 10.5px; font-weight: 700; border-radius: 999px; padding: 1px 8px; }
.nt-tag.internal { background: var(--bg-sunk); color: var(--ink-2); } .nt-tag.shared { background: color-mix(in srgb, #0e9f6e 14%, var(--panel)); color: #0b7a55; }
.nt-tag.pin { background: color-mix(in srgb, #f5b800 18%, var(--panel)); color: #8a6100; }
.nt-acts { display: flex; gap: 10px; font-size: 12px; opacity: .55; transition: opacity .12s; } .nt:hover .nt-acts, .nt-acts:focus-within { opacity: 1; }
.nt-body { white-space: pre-wrap; overflow-wrap: anywhere; font-size: 13.5px; line-height: 1.5; color: var(--ink); }
.nt-meta { display: flex; flex-wrap: wrap; gap: 4px 14px; margin-top: 6px; font-size: 11.5px; color: var(--muted); }
.nt-meta b { color: var(--ink-2); font-weight: 600; }
.nt-origin { background: var(--bg-sunk); border-radius: 6px; padding: 0 6px; }
.nt-empty { color: var(--muted); font-size: 12.5px; font-style: italic; padding: 10px 4px; }
.nt-ta { width: 100%; box-sizing: border-box; font: inherit; font-size: 13.5px; border: 1px solid var(--ui2-line, var(--line)); border-radius: 8px; padding: 8px 10px; resize: vertical; min-height: 70px; }
.nt-ta:focus { outline: none; border-color: #1a6bd0; box-shadow: 0 0 0 3px rgba(26, 107, 208, .15); }
.nt-editbar { margin-top: 6px; gap: 8px; align-items: center; } .nt-share { display: flex; align-items: center; gap: 6px; }
.nt-hist .nt.cur { border-left-color: #0e9f6e; }

/* 15 Oct (ui_v2): the calculation marks as circled icons */
.ck .ck-ic { width: 15px; height: 15px; display: block; }
.ck:has(.ck-ic) { line-height: 0; transition: transform .12s; }
.ck:has(.ck-ic):hover { transform: translateY(-50%) scale(1.18) !important; }
td.m.c .ck:has(.ck-ic) { display: inline-block; vertical-align: middle; }
td.m.c .ck:has(.ck-ic):hover { transform: scale(1.18) !important; }

/* 15 Oct (validation_v2): the validation window */
.vl { display: flex; flex-direction: column; gap: 10px; min-height: 360px; }
.vl-run { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; padding: 10px 12px; border: 1px solid var(--ui2-line, var(--line)); border-radius: 10px; background: var(--ui2-head, var(--bg-soft)); }
.vl-runinfo { display: flex; flex-direction: column; gap: 4px; font-size: 13px; }
.vl-runs { display: flex; gap: 6px; flex-wrap: wrap; }
.vl-chip { font-size: 11.5px; border-radius: 999px; padding: 1px 9px; background: var(--panel); border: 1px solid var(--line-soft); color: var(--ink-2); }
.vl-chip.bad { color: var(--bad); border-color: color-mix(in srgb, var(--bad) 40%, var(--line)); }
.vl-busy { display: inline-flex; align-items: center; gap: 6px; color: #1a6bd0; font-weight: 600; }
.vl-busy .spin { width: 12px; height: 12px; border: 2px solid currentColor; border-right-color: transparent; border-radius: 50%; animation: vlspin .8s linear infinite; }
@keyframes vlspin { to { transform: rotate(360deg); } }
.vl-filters { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.vl-f { display: inline-flex; align-items: center; gap: 6px; border: 1px solid var(--ui2-line, var(--line)); background: var(--panel); border-radius: 999px; padding: 3px 10px; font: inherit; font-size: 12px; cursor: pointer; color: var(--ink-2); }
.vl-f b { font-size: 11px; background: var(--bg-sunk); border-radius: 999px; padding: 0 7px; }
.vl-f.on { border-color: #1a6bd0; background: color-mix(in srgb, #1a6bd0 9%, var(--panel)); color: var(--ink); font-weight: 600; }
.vl-f.bad b { background: color-mix(in srgb, var(--bad) 15%, var(--panel)); color: var(--bad); } .vl-f.warn b { background: color-mix(in srgb, #d97706 15%, var(--panel)); color: #b45309; }
.vl-sep { width: 1px; height: 20px; background: var(--line); margin: 0 4px; }
.vl-q { width: 260px; height: 30px !important; }
.vl-list { max-height: 56vh; overflow: auto; border: 1px solid var(--ui2-line, var(--line)); border-radius: 10px; }
.vl-t td { vertical-align: top; } .vl-msg { line-height: 1.45; } .vl-code { color: var(--ink-2); word-break: break-all; max-width: 260px; }
.vl-src { font-size: 10.5px; font-weight: 800; border-radius: 5px; padding: 1px 6px; color: #fff; background: #64748b; }
.vl-src.s-EFM { background: #1d4ed8; } .vl-src.s-DQC { background: #7c3aed; } .vl-src.s-iXBRL { background: #0e7490; } .vl-src.s-XBRL { background: #0f766e; } .vl-src.s-Basic { background: #94a3b8; }
.modal.vl-modal { width: min(1280px, 96vw); max-width: none; }

/* 15 Oct (ui_v2): notification cards (class toastc: .tc is the role tree's filter count) */
.toast-wrap.v2 { bottom: 20px; right: 20px; gap: 10px; align-items: flex-end; }
.toastc { --c: #16a34a; position: relative; display: flex; align-items: flex-start; gap: 12px; width: 380px; max-width: calc(100vw - 32px);
  background: var(--panel); color: var(--ink); border: 1px solid var(--ui2-line, var(--line)); border-left: 4px solid var(--c); border-radius: 12px;
  padding: 12px 12px 14px 14px; box-shadow: 0 12px 32px rgba(16, 24, 40, .18), 0 2px 6px rgba(16, 24, 40, .08); overflow: hidden;
  animation: toastcin .24s cubic-bezier(.2, .9, .3, 1.2); }
.toastc.info { --c: #1a6bd0; } .toastc.warn { --c: #d97706; } .toastc.error { --c: #dc2626; }
.toastc.out { animation: toastcout .22s ease forwards; }
@keyframes toastcin { from { opacity: 0; transform: translateY(12px) scale(.97); } to { opacity: 1; transform: none; } }
@keyframes toastcout { to { opacity: 0; transform: translateX(24px); } }
.toastc-ic { flex: none; width: 28px; height: 28px; border-radius: 50%; display: grid; place-items: center; font: 800 14px/1 var(--sans, inherit);
  color: #fff; background: var(--c); box-shadow: 0 0 0 4px color-mix(in srgb, var(--c) 15%, transparent); margin-top: 1px; }
.toastc.info .toastc-ic { font-family: Georgia, serif; font-style: italic; }
.toastc-body { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.toastc-body b { font-size: 13.5px; font-weight: 700; color: var(--ink); }
.toastc-msg { font-size: 13px; color: var(--ink-2); line-height: 1.45; overflow-wrap: anywhere; }
.toastc-x { flex: none; border: 0; background: none; color: var(--muted); font-size: 12px; width: 24px; height: 24px; border-radius: 6px; cursor: pointer; }
.toastc-x:hover { background: var(--bg-sunk); color: var(--ink); }
.toastc-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: var(--c); opacity: .55; transform-origin: left; transform: scaleX(1); }
@media (prefers-reduced-motion: reduce) { .toastc, .toastc.out { animation: none; } }

/* 15 Oct (ui_v2): the notifications panel under the bell */
html.ui2 #notif-btn { position: relative; }
html.ui2 #notif-btn #notif-n:not(:empty) { position: absolute; top: -6px; right: -6px; min-width: 18px; height: 18px; padding: 0 5px; border-radius: 999px;
  background: #dc2626; color: #fff; font-size: 10.5px; font-weight: 800; line-height: 18px; text-align: center; box-shadow: 0 0 0 2px var(--ui2-navy); }
.np { position: fixed; z-index: 120; width: 420px; max-width: calc(100vw - 24px); max-height: min(560px, calc(100vh - 80px)); display: flex; flex-direction: column;
  background: var(--panel); color: var(--ink); border: 1px solid var(--ui2-line, var(--line)); border-radius: 14px;
  box-shadow: 0 18px 48px rgba(10, 26, 51, .28), 0 2px 8px rgba(10, 26, 51, .1); animation: npin .18s ease-out; }
@keyframes npin { from { opacity: 0; transform: translateY(-6px); } }
.np::before { content: ""; position: absolute; top: -6px; left: var(--arrow, 60%); width: 12px; height: 12px; background: var(--ui2-navy, #0a1a33); transform: rotate(45deg); border-radius: 2px; }
.np-head { position: relative; display: flex; align-items: center; gap: 8px; padding: 12px 14px; border-radius: 14px 14px 0 0;
  background: linear-gradient(120deg, var(--ui2-navy, #0a1a33), var(--ui2-navy-2, #16365f)); color: #fff; }
.np-head b { font-size: 15px; }
.np-badge { font-size: 11px; font-weight: 700; background: #dc2626; color: #fff; border-radius: 999px; padding: 1px 8px; }
.np-link { border: 0; background: none; color: #bfdcff; font: inherit; font-size: 12.5px; font-weight: 600; cursor: pointer; padding: 4px 6px; border-radius: 6px; }
.np-link:hover:not([disabled]) { background: rgba(255, 255, 255, .12); color: #fff; }
.np-link[disabled] { opacity: .45; cursor: default; }
.np-x { border: 0; background: none; color: #c3d3e8; width: 26px; height: 26px; border-radius: 6px; cursor: pointer; }
.np-x:hover { background: rgba(255, 255, 255, .12); color: #fff; }
.np-tabs { display: flex; gap: 4px; padding: 8px 12px 0; border-bottom: 1px solid var(--line-soft); }
.np-tabs button { border: 0; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--muted); padding: 6px 10px 8px; cursor: pointer;
  border-bottom: 2px solid transparent; display: flex; gap: 6px; align-items: center; }
.np-tabs button span { font-size: 11px; background: var(--bg-sunk); color: var(--ink-2); border-radius: 999px; padding: 0 7px; }
.np-tabs button.on { color: var(--ink); border-bottom-color: #1a6bd0; }
.np-tabs button.on span { background: #1a6bd0; color: #fff; }
.np-list { overflow: auto; padding: 4px 0 6px; }
.np-day { font-size: 10.5px; font-weight: 800; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); padding: 10px 16px 4px; }
.np-item { position: relative; display: flex; gap: 12px; align-items: flex-start; padding: 10px 16px; border-left: 3px solid transparent; }
.np-item:hover { background: var(--ui2-hover, var(--bg-soft)); }
.np-item.unread { background: color-mix(in srgb, #1a6bd0 6%, var(--panel)); border-left-color: var(--k); }
.np-ic { flex: none; width: 32px; height: 32px; border-radius: 10px; display: grid; place-items: center; font-weight: 800; font-size: 13px;
  color: var(--k); background: color-mix(in srgb, var(--k) 13%, var(--panel)); }
.np-txt { flex: 1; min-width: 0; }
.np-msg { font-size: 13px; line-height: 1.45; color: var(--ink); overflow-wrap: anywhere; }
.np-item.unread .np-msg { font-weight: 600; }
.np-meta { font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.np-kind { color: var(--k); font-weight: 700; }
.np-dot { flex: none; width: 8px; height: 8px; border-radius: 50%; background: #1a6bd0; margin-top: 6px; }
.np-empty { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 36px 24px; text-align: center; color: var(--muted); font-size: 12.5px; }
.np-empty b { color: var(--ink); font-size: 14px; }
.np-empty-ic { width: 44px; height: 44px; border-radius: 50%; display: grid; place-items: center; background: color-mix(in srgb, #16a34a 14%, var(--panel));
  color: #16a34a; font-size: 20px; font-weight: 800; }
.np-foot { border-top: 1px solid var(--line-soft); padding: 8px 14px; font-size: 11.5px; color: var(--muted); text-align: center;
  background: var(--ui2-head, var(--bg-soft)); border-radius: 0 0 14px 14px; }

/* 15 Oct: the calculation icons — clicks go to the mark, not the drawing inside it; the inline form beside text */
.ck .ck-ic, .ck-inline .ck-ic { pointer-events: none; }
.ck-inline { display: inline-flex; align-items: center; gap: 4px; vertical-align: -3px; margin-right: 4px; }
.ck-inline .ck-ic { width: 15px; height: 15px; flex: none; }

/* 15 Oct (ui_v2): the Inline Viewer's hover card, as the XOR grid's */
.ivx-tip.ivh { padding: 0; width: 460px; max-width: calc(100vw - 24px); border-radius: 12px; border-color: var(--ui2-line, var(--line)); overflow: hidden;
  box-shadow: 0 14px 36px rgba(16, 24, 40, .22), 0 2px 6px rgba(16, 24, 40, .08); font-size: 12.5px; }
.ivh-head { padding: 10px 14px 9px; border-bottom: 1px solid var(--line-soft); background: var(--ui2-head, var(--bg-soft)); display: flex; flex-direction: column; gap: 3px; }
.ivh-k { color: var(--muted); font-weight: 600; }
.ivh-l b { font-size: 13.5px; color: var(--ink); }
.ivh-tag { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.ivh-tag code { font: 600 12px var(--mono); color: var(--ink); word-break: break-all; }
.ivh-std { display: inline-flex; align-items: center; gap: 4px; font-size: 11.5px; color: var(--ink-2); }
.ivh-std i { width: 8px; height: 8px; border-radius: 50%; background: #16a34a; } .ivh-std.ext i { background: #f59e0b; }
.ivh-pill { font-size: 10.5px; font-weight: 700; border-radius: 999px; padding: 0 7px; background: var(--bg-sunk); color: var(--ink-2); }
.ivh-pill.st-Modified { background: color-mix(in srgb, #f0883e 20%, var(--panel)); color: #b35900; }
.ivh-pill.st-Added { background: color-mix(in srgb, #1a7f37 16%, var(--panel)); color: #1a7f37; }
.ivh-val { padding: 10px 14px; border-bottom: 1px solid var(--line-soft); }
.ivh-v { font-size: 14px; font-weight: 700; color: var(--ink); overflow-wrap: anywhere; max-height: 7.5em; overflow: hidden; }
.ivh-val:not(.num) .ivh-v { font-size: 12.5px; font-weight: 500; line-height: 1.45; }
.ivh-per { font-size: 11.5px; color: var(--muted); margin-top: 3px; }
.ivh-dims { display: flex; flex-wrap: wrap; gap: 4px; margin-top: 6px; }
.ivh-dims span { font-size: 11px; background: color-mix(in srgb, #7c3aed 10%, var(--panel)); color: #6d28d9; border-radius: 6px; padding: 1px 7px; }
.ivh-sec { padding: 9px 14px; border-bottom: 1px solid var(--line-soft); }
.ivh-sec:last-child { border-bottom: 0; }
.ivh-grid { display: grid; grid-template-columns: auto 1fr auto 1fr; gap: 4px 12px; }
.ivh-grid span { color: var(--muted); white-space: nowrap; } .ivh-grid b { font-weight: 500; color: var(--ink); overflow-wrap: anywhere; }
.ivh-def > div:last-child { color: var(--ink-2); line-height: 1.45; margin-top: 2px; }
.ivh-chg table { width: 100%; border-collapse: collapse; margin-top: 5px; font-size: 12px; }
.ivh-chg th, .ivh-chg td { text-align: left; padding: 3px 6px; border-bottom: 1px solid var(--line-soft); vertical-align: top; overflow-wrap: anywhere; }
.ivh-chg thead th { color: var(--muted); font-weight: 600; font-size: 11px; }
.ivh-chg tbody th { color: var(--muted); font-weight: 500; white-space: nowrap; }
.ivh-chg tr.chg td { background: color-mix(in srgb, #f0883e 14%, var(--panel)); color: #8a4500; font-weight: 600; }
.ivh-note { padding: 7px 14px; font-size: 12px; font-weight: 600; border-bottom: 1px solid var(--line-soft); }
.ivh-note.A { color: #1a7f37; background: color-mix(in srgb, #1a7f37 7%, var(--panel)); }

/* 15 Oct: the EA loading screen */
.ea-splash { position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
  background: radial-gradient(1200px 600px at 50% 38%, #1b4f86 0%, #12345e 45%, #0a1a33 100%); color: #fff;
  transition: opacity .15s ease, transform .15s ease, visibility .15s; font-family: inherit; }   /* 16 Oct: shown at once, gone fast */
.ea-splash.out { opacity: 0; transform: scale(1.015); visibility: hidden; pointer-events: none; }
/* 16 Oct: the page behind the loading screen is never a white flash — 17 Oct: only WHILE it shows. Navy for the whole
   page made long pages (the Guide) navy below the first screen (body is one screen high; the rest is the page's
   own background), hiding the dark section headings there */
html { background: var(--bg); }
html.ui2 { background: var(--ui2-bg, var(--bg)); }
html:has(.ea-splash:not(.out)) { background: #0f2a4a; }
.ea-splash::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .5;
  background-image: radial-gradient(rgba(255, 255, 255, .07) 1px, transparent 1px); background-size: 22px 22px; }
.eas-box { position: relative; display: flex; flex-direction: column; align-items: center; gap: 10px; text-align: center; animation: easrise .6s ease-out both; }
@keyframes easrise { from { opacity: 0; transform: translateY(10px) scale(.98); } }
.eas-mark { position: relative; width: 132px; height: 132px; margin-bottom: 8px; }
.eas-ring { position: absolute; inset: 0; width: 100%; height: 100%; animation: easspin 1.4s linear infinite; }
.eas-ring circle { fill: none; stroke-width: 4; }
.eas-track { stroke: rgba(255, 255, 255, .12); }
.eas-arc { stroke: #14d6f6; stroke-linecap: round; stroke-dasharray: 90 250; filter: drop-shadow(0 0 6px rgba(20, 214, 246, .7)); }
@keyframes easspin { to { transform: rotate(360deg); } }
.eas-logo { position: absolute; inset: 18px; width: calc(100% - 36px); height: calc(100% - 36px);
  filter: drop-shadow(0 10px 24px rgba(0, 0, 0, .35)); animation: easpulse 2.4s ease-in-out infinite; }
@keyframes easpulse { 50% { transform: scale(1.04); } }
.eas-logo path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: easdraw 2.4s ease-in-out infinite; }
.eas-logo .eas-a1 { animation-delay: .25s; } .eas-logo .eas-a2 { animation-delay: .45s; }
@keyframes easdraw { 0% { stroke-dashoffset: 1; } 45%, 80% { stroke-dashoffset: 0; } 100% { stroke-dashoffset: -1; } }
.eas-name { font-size: 22px; font-weight: 700; letter-spacing: -.01em; }
.eas-name b { color: #14d6f6; font-weight: 800; margin-left: 4px; }
/* 17 Oct (owner): the "by EdgarAgents" line was removed from the loading screen */
.eas-msg { font-size: 13px; color: #cfe0f5; min-height: 18px; margin-top: 6px; max-width: 80vw; }
.eas-bar { position: relative; width: 240px; height: 4px; border-radius: 999px; background: rgba(255, 255, 255, .14); overflow: hidden; }
.eas-bar i { position: absolute; left: 0; top: 0; bottom: 0; width: 35%; border-radius: inherit;
  background: linear-gradient(90deg, #14d6f6, #7fe9ff); animation: easslide 1.2s ease-in-out infinite; }
.eas-bar.det i { animation: none; transition: width .35s ease; }
@keyframes easslide { 0% { left: -35%; } 100% { left: 100%; } }
@media (prefers-reduced-motion: reduce) {
  .eas-ring, .eas-logo, .eas-box, .eas-bar i { animation: none; }
  .eas-logo path { animation: none; stroke-dashoffset: 0; }
}
body { min-height: 100vh; }   /* 16 Oct: covers the navy page base on short pages */

/* 16 Oct: a running validation */
.vl-run:has(.vlc) { padding: 0; border: 0; background: none; }
.vl-runinfo:has(.vlc) { flex: 1; }
.vlc { display: flex; gap: 16px; align-items: flex-start; padding: 14px 16px; border-radius: 12px; color: #fff; flex: 1;
  background: linear-gradient(120deg, #0a1a33 0%, #12345e 60%, #1b4f86 100%); box-shadow: 0 8px 24px rgba(10, 26, 51, .25); }
.vlc-mark { position: relative; flex: none; width: 52px; height: 52px; }
.vlc-mark::before { content: ""; position: absolute; inset: -5px; border-radius: 50%; border: 2.5px solid rgba(255, 255, 255, .12);
  border-top-color: #14d6f6; animation: easspin 1s linear infinite; filter: drop-shadow(0 0 4px rgba(20, 214, 246, .6)); }
.vlc-mark svg { width: 100%; height: 100%; display: block; }
.vlc-mark path { stroke-dasharray: 1; stroke-dashoffset: 1; animation: easdraw 2.4s ease-in-out infinite; }
.vlc-mark path:nth-child(2) { animation-delay: .25s; } .vlc-mark path:nth-child(3) { animation-delay: .45s; }
.vlc-main { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 8px; }
.vlc-head { display: flex; align-items: baseline; gap: 6px; font-size: 12.5px; color: #c3d3e8; }
.vlc-head > b { font-size: 15px; color: #fff; }
.vlc-clock { font-variant-numeric: tabular-nums; color: #14d6f6; font-size: 14px; }
.vlc-step { position: relative; display: flex; align-items: center; gap: 10px; padding: 8px 10px; border-radius: 9px; background: rgba(255, 255, 255, .07); overflow: hidden; }
.vlc-ic { flex: none; width: 20px; height: 20px; border-radius: 50%; display: grid; place-items: center; font-size: 11px; font-weight: 800; }
.vlc-step.running .vlc-ic { border: 2px solid rgba(255, 255, 255, .25); border-top-color: #14d6f6; animation: easspin .8s linear infinite; }
.vlc-step.done .vlc-ic { background: #16a34a; color: #fff; }
.vlc-step.error .vlc-ic { background: #dc2626; color: #fff; }
.vlc-l { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.vlc-l b { font-size: 13px; color: #fff; } .vlc-l small { font-size: 11px; color: #9fb7d6; }
.vlc-r { font-size: 12px; color: #cfe0f5; white-space: nowrap; font-variant-numeric: tabular-nums; }
.vlc-step.done .vlc-r { color: #86efac; } .vlc-step.error .vlc-r { color: #fca5a5; white-space: normal; }
.vlc-bar { position: absolute; left: 0; bottom: 0; height: 2px; width: 30%; background: linear-gradient(90deg, transparent, #14d6f6, transparent);
  animation: easslide 1.3s ease-in-out infinite; }
@media (prefers-reduced-motion: reduce) { .vlc-mark::before, .vlc-mark path, .vlc-step.running .vlc-ic, .vlc-bar { animation: none; } .vlc-mark path { stroke-dashoffset: 0; } }
.vl-run:has(.vlc) .vl-runinfo { flex: 1 1 100%; min-width: 0; }
.vl-run:has(.vlc) { flex-wrap: wrap; row-gap: 10px; }

/* 16 Oct: the round card while a validation runs */
.btn.vl-on { border-color: #14d6f6 !important; color: #0b6b85 !important; background: color-mix(in srgb, #14d6f6 10%, var(--panel)) !important; display: inline-flex; align-items: center; gap: 7px; }
.vl-dot { width: 8px; height: 8px; border-radius: 50%; background: #14d6f6; box-shadow: 0 0 0 0 rgba(20, 214, 246, .6); animation: vlpulse 1.2s ease-out infinite; }
@keyframes vlpulse { to { box-shadow: 0 0 0 7px rgba(20, 214, 246, 0); } }

/* 16 Oct (ui_v2): the XBRL attribute filter panel */
.af2 { display: flex; flex-direction: column; max-height: min(78vh, 760px); }
.af2-body { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; overflow: auto; padding: 12px !important; background: var(--ui2-head, var(--bg-soft)); }
@media (max-width: 720px) { .af2-body { grid-template-columns: 1fr; } }
.af2-col { display: flex; flex-direction: column; gap: 10px; min-width: 0; }
.af2-card { background: var(--panel); border: 1px solid var(--ui2-line, var(--line)); border-radius: 10px; overflow: hidden; }
.af2-card > header { display: flex; align-items: center; gap: 8px; padding: 8px 10px; border-bottom: 1px solid var(--line-soft); font-size: 12.5px; }
.af2-card > header .linkbtn { font-size: 11.5px; }
.af2-opts { display: flex; flex-wrap: wrap; gap: 6px; padding: 10px; }
.af2-opts label { position: relative; display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border: 1px solid var(--ui2-line, var(--line)); border-radius: 999px;
  font-size: 12px; cursor: pointer; background: var(--panel); color: var(--ink); transition: background .12s, border-color .12s; user-select: none; }
.af2-opts label input { position: absolute; opacity: 0; pointer-events: none; }
.af2-opts label:hover { background: var(--ui2-hover, var(--bg-soft)); }
.af2-opts label:has(input:focus-visible) { outline: 2px solid #1a6bd0; outline-offset: 2px; }
.af2-opts label .muted { font-size: 10.5px; font-weight: 700; background: var(--bg-sunk); color: var(--ink-2) !important; border-radius: 999px; padding: 0 6px; }
.af2-opts label:has(input:checked) { --c: #1a6bd0; background: color-mix(in srgb, var(--c) 12%, var(--panel)); border-color: var(--c); color: var(--ink); font-weight: 600; }
.af2-opts label:has(input:checked)::before { content: "✓"; font-size: 10px; font-weight: 800; color: var(--c); }
.af2-opts label:has(input:checked) .muted { background: var(--c); color: #fff !important; }
.af2-opts label.zero { opacity: .55; }
.af2-card.types label.t-A { --c: #1a7f37; } .af2-card.types label.t-R { --c: #cf222e; } .af2-card.types label.t-M { --c: #c2410c; } .af2-card.types label.t-U { --c: #64748b; }
.af2-card.types label::after { content: ""; width: 8px; height: 8px; border-radius: 50%; background: var(--c, #64748b); order: -1; }
.af2-card.types label.t-A::after { background: #1a7f37; } .af2-card.types label.t-R::after { background: #cf222e; } .af2-card.types label.t-M::after { background: #c2410c; }
.af2-card.types label:has(input:checked)::before { display: none; }
.af2-rev { display: flex; flex-direction: column; gap: 8px; padding: 10px; }
.af2-seg { display: flex; border: 1px solid var(--ui2-line, var(--line)); border-radius: 8px; overflow: hidden; }
.af2-seg button { flex: 1; border: 0; background: var(--panel); font: inherit; font-size: 12px; padding: 6px 4px; cursor: pointer; color: var(--ink-2); display: inline-flex; justify-content: center; gap: 5px; align-items: center; }
.af2-seg button + button { border-left: 1px solid var(--ui2-line, var(--line)); }
.af2-seg button.on { background: var(--ui2-navy, #0f2a4a); color: #fff; font-weight: 600; }
.af2-n:empty { display: none; } .af2-seg .af2-n { font-size: 10.5px; opacity: .8; }
.af2-switch { display: flex; align-items: center; gap: 8px; font-size: 12.5px; cursor: pointer; }
.af2-switch input { position: absolute; opacity: 0; pointer-events: none; }
.af2-switch > i { flex: none; width: 32px; height: 18px; border-radius: 999px; background: var(--bg-sunk); border: 1px solid var(--ui2-line, var(--line)); position: relative; transition: background .15s; }
.af2-switch > i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 12px; height: 12px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.af2-switch:has(input:checked) > i { background: #cf222e; border-color: #cf222e; } .af2-switch:has(input:checked) > i::after { transform: translateX(14px); }
.af2-switch .af2-n { margin-left: auto; font-size: 10.5px; font-weight: 700; background: var(--bg-sunk); border-radius: 999px; padding: 0 6px; }
.af2-foot { display: flex; align-items: center; gap: 8px; padding: 10px 14px; border-top: 1px solid var(--line-soft); background: var(--panel); flex-wrap: wrap; }
.af2-count { font-size: 12.5px; color: var(--muted); } .af2-count b { font-size: 15px; color: var(--ink); font-variant-numeric: tabular-nums; }
.af2-foot select { height: 30px; font-size: 12px; }

/* 16 Oct (ui_v2): the "…" menu */
.mt2-body { display: flex; flex-direction: column; gap: 6px; padding: 10px !important; }
.mt2-item { display: flex; align-items: center; gap: 12px; width: 100%; text-align: left; border: 1px solid var(--ui2-line, var(--line)); background: var(--panel);
  border-radius: 10px; padding: 9px 10px; cursor: pointer; font: inherit; color: var(--ink); transition: border-color .12s, box-shadow .12s, transform .12s; }
.mt2-item:hover { border-color: var(--c); box-shadow: 0 4px 12px color-mix(in srgb, var(--c) 18%, transparent); transform: translateY(-1px); }
.mt2-item.px { --c: #7c3aed; } .mt2-item.rr { --c: #0e9f6e; } .mt2-item.ov { --c: #1a6bd0; }
.mt2-ic { flex: none; width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; font-size: 16px; font-weight: 700;
  color: var(--c); background: color-mix(in srgb, var(--c) 12%, var(--panel)); }
.mt2-t { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.mt2-t b { font-size: 13px; } .mt2-t small { font-size: 11.5px; color: var(--muted); line-height: 1.35; }
.mt2-go { color: var(--muted); font-size: 18px; }

/* 17 Oct (ui_v2): the sign-in page */
body.lg-body { background: #0a1a33; }
.lg-page { min-height: 100vh; height: 100vh; display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(400px, 1fr); }
.lg-hero { position: relative; overflow: hidden; color: #fff; padding: 32px 56px 20px; display: flex; flex-direction: column; gap: 14px;
  background: radial-gradient(900px 520px at 70% 45%, #1b4f86 0%, rgba(27, 79, 134, 0) 60%), linear-gradient(140deg, #071427 0%, #0f2a4a 45%, #12345e 100%); }
.lg-hero::before { content: ""; position: absolute; inset: 0; pointer-events: none; opacity: .35;
  background-image: linear-gradient(rgba(255, 255, 255, .05) 1px, transparent 1px), linear-gradient(90deg, rgba(255, 255, 255, .05) 1px, transparent 1px);
  background-size: 44px 44px; mask-image: radial-gradient(ellipse at 60% 50%, #000 30%, transparent 75%); }
.lg-hero > * { position: relative; }
.lg-brand { display: flex; align-items: center; gap: 12px; }
.lg-brand img { width: 40px; height: 40px; border-radius: 50%; box-shadow: 0 4px 14px rgba(0, 0, 0, .35); }
.lg-brand b { display: block; font-size: 16px; letter-spacing: .02em; } .lg-brand small { display: block; font-size: 12px; color: #9fb7d6; }
.lg-copy { max-width: 620px; margin-top: 18px; }
.lg-kicker { font-size: 12px; font-weight: 800; letter-spacing: .22em; color: #14d6f6; }
.lg-copy h1 { font-size: clamp(28px, 3.1vw, 44px); line-height: 1.12; margin: 10px 0 12px; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.lg-copy h1 span { background: linear-gradient(90deg, #7fe9ff, #14d6f6); -webkit-background-clip: text; background-clip: text; color: transparent; }
.lg-copy p { font-size: 15px; line-height: 1.6; color: #c3d3e8; margin: 0; }
.lg-art { flex: 1; min-height: 0; display: grid; place-items: center; }
.lg-art { overflow: hidden; }
.lg-art > svg { height: 100%; max-height: 520px; width: auto; max-width: 100%; }
.lg-illu { width: min(100%, 620px); height: auto; overflow: visible; }
.lg-illu .lg-stack { animation: lgfloat 6s ease-in-out infinite; }
.lg-illu .lg-lens { animation: lglens 7s ease-in-out infinite; }
.lg-illu .lg-shield { animation: lgfloat 5s ease-in-out .6s infinite; }
.lg-illu .lg-chart { animation: lgfloat 5.5s ease-in-out 1.2s infinite; }
.lg-illu .lg-chip { animation: lgchip 4.8s ease-in-out infinite; } .lg-illu .c2 { animation-delay: .8s; } .lg-illu .c3 { animation-delay: 1.6s; } .lg-illu .c4 { animation-delay: 2.4s; }
@keyframes lgfloat { 50% { transform: translateY(-8px); } }
@keyframes lglens { 0%, 100% { transform: translate(300px, 128px); } 50% { transform: translate(318px, 136px); } }
@keyframes lgchip { 0%, 100% { opacity: .95; } 50% { opacity: .55; } }
.lg-illu .lg-stack, .lg-illu .lg-shield, .lg-illu .lg-chart { transform-box: fill-box; }
.lg-feats { display: grid; grid-template-columns: repeat(3, 1fr); gap: 12px; }
.lg-feat { display: flex; gap: 10px; align-items: flex-start; padding: 12px; border-radius: 12px; background: rgba(255, 255, 255, .06); border: 1px solid rgba(255, 255, 255, .09); backdrop-filter: blur(4px); }
.lg-feat > span { flex: none; width: 32px; height: 32px; border-radius: 9px; display: grid; place-items: center; font-weight: 800; color: #0a1a33; background: linear-gradient(135deg, #7fe9ff, #14d6f6); }
.lg-feat b { display: block; font-size: 13px; } .lg-feat small { display: block; font-size: 11.5px; color: #9fb7d6; margin-top: 1px; }
.lg-foot { font-size: 11.5px; color: #7f98b8; }
.lg-side { display: grid; place-items: center; padding: 32px 24px; background: linear-gradient(180deg, #f6f9fd, #eef3fa); }
.lg-card { width: min(420px, 100%); background: #fff; border: 1px solid #e1e7ef; border-radius: 18px; padding: 34px 34px 26px;
  box-shadow: 0 24px 60px rgba(10, 26, 51, .14), 0 2px 8px rgba(10, 26, 51, .06); animation: lgin .5s ease-out both; }
@keyframes lgin { from { opacity: 0; transform: translateY(12px); } }
.lg-form { display: flex; flex-direction: column; gap: 14px; }
.lg-hi h2 { margin: 0; font-size: 24px; font-weight: 800; color: #0a1a33; letter-spacing: -.01em; }
.lg-hi p { margin: 4px 0 6px; color: #5b6b80; font-size: 13.5px; }
.lg-field > span { display: block; font-size: 12.5px; font-weight: 700; color: #33475f; margin-bottom: 6px; }
.lg-in { display: flex; align-items: center; gap: 8px; height: 46px; border: 1.5px solid #d7dee8; border-radius: 11px; padding: 0 12px; background: #fbfcfe;
  transition: border-color .15s, box-shadow .15s, background .15s; }
.lg-in:focus-within { border-color: #1a6bd0; background: #fff; box-shadow: 0 0 0 4px rgba(26, 107, 208, .14); }
.lg-in > i { font-style: normal; font-size: 14px; opacity: .6; width: 18px; text-align: center; }
.lg-in input { flex: 1; min-width: 0; border: 0 !important; outline: none; background: transparent; font: inherit; font-size: 14px; color: #0a1a33; height: 100%; box-shadow: none !important; padding: 0; }
.lg-eye { border: 0; background: none; cursor: pointer; font-size: 14px; opacity: .45; padding: 4px; border-radius: 6px; }
.lg-eye:hover, .lg-eye.on { opacity: .9; background: #eef3fa; }
.lg-submit { position: relative; height: 48px; border: 0; border-radius: 11px; cursor: pointer; font: inherit; font-size: 15px; font-weight: 700; color: #fff;
  display: flex; align-items: center; justify-content: center; gap: 10px; margin-top: 4px;
  background: linear-gradient(135deg, #0f2a4a 0%, #1a6bd0 100%); box-shadow: 0 10px 22px rgba(26, 107, 208, .3); transition: transform .12s, box-shadow .12s, filter .12s; }
.lg-submit:hover { transform: translateY(-1px); box-shadow: 0 14px 28px rgba(26, 107, 208, .38); filter: brightness(1.06); }
.lg-submit:disabled { cursor: progress; filter: saturate(.7); }
.lg-arrow { transition: transform .15s; } .lg-submit:hover .lg-arrow { transform: translateX(3px); }
.lg-submit.busy .lg-arrow { width: 14px; height: 14px; border: 2px solid rgba(255, 255, 255, .5); border-top-color: #fff; border-radius: 50%; color: transparent; animation: easspin .8s linear infinite; }
.lg-or { display: flex; align-items: center; gap: 10px; color: #8a9ab0; font-size: 12px; }
.lg-or::before, .lg-or::after { content: ""; flex: 1; height: 1px; background: #e1e7ef; }
.lg-sso { display: flex; align-items: center; justify-content: center; height: 44px; border: 1.5px solid #d7dee8; border-radius: 11px; color: #0f2a4a; font-weight: 700;
  text-decoration: none !important; background: #fff; transition: border-color .15s, background .15s; }
.lg-sso:hover { border-color: #1a6bd0; background: #f4f8fd; }
.lg-safe { display: flex; align-items: center; gap: 6px; margin: 4px 0 0; font-size: 11.5px; color: #7a8a9f; justify-content: center; }
.lg-safe i { font-style: normal; }
.lg-card .card { box-shadow: none; border: 0; padding: 0; }
.lg-card h2 { color: #0a1a33; }
@media (max-width: 1000px) {
  .lg-page { grid-template-columns: 1fr; height: auto; }
  .lg-hero { padding: 24px 22px 20px; } .lg-art, .lg-feats { display: none; } .lg-copy { margin-top: 8px; } .lg-copy p { font-size: 13.5px; }
  .lg-side { padding: 24px 16px 40px; }
}
@media (prefers-reduced-motion: reduce) { .lg-illu *, .lg-card { animation: none !important; } }

/* 17 Oct: saved views on the Dashboard */
.dv-btn { display: inline-flex; align-items: center; gap: 7px; max-width: 280px; }
.dv-btn > span:nth-child(2) { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-btn.on { border-color: #1a6bd0 !important; background: color-mix(in srgb, #1a6bd0 8%, var(--panel)) !important; color: var(--ink) !important; }
.dv-ic { opacity: .7; } .dv-car { font-size: 10px; opacity: .6; }
.dv { display: flex; flex-direction: column; max-height: min(78vh, 640px); }
.dv-body { overflow: auto; padding: 8px 12px 10px; display: flex; flex-direction: column; gap: 6px; }
.dv-sec { font-size: 10.5px; font-weight: 800; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); margin-top: 6px; }
.dv-quick { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
.dv-q { --c: #1a6bd0; display: flex; align-items: center; gap: 8px; text-align: left; border: 1px solid var(--ui2-line, var(--line)); background: var(--panel); border-radius: 10px;
  padding: 8px; cursor: pointer; font: inherit; color: var(--ink); transition: border-color .12s, background .12s; }
.dv-q.bad { --c: #dc2626; } .dv-q.warn { --c: #d97706; } .dv-q.cm { --c: #7c3aed; } .dv-q.qc { --c: #0e9f6e; }
.dv-q:hover { border-color: var(--c); } .dv-q.on { border-color: var(--c); background: color-mix(in srgb, var(--c) 9%, var(--panel)); }
.dv-qi { flex: none; width: 28px; height: 28px; border-radius: 8px; display: grid; place-items: center; font-size: 13px; color: var(--c); background: color-mix(in srgb, var(--c) 12%, var(--panel)); }
.dv-q b { display: block; font-size: 12.5px; } .dv-q small { display: block; font-size: 11px; color: var(--muted); }
.dv-list { display: flex; flex-direction: column; gap: 4px; }
.dv-item { display: flex; align-items: center; gap: 6px; border: 1px solid var(--ui2-line, var(--line)); border-radius: 10px; padding: 4px 6px 4px 4px; }
.dv-item.on { border-color: #1a6bd0; background: color-mix(in srgb, #1a6bd0 6%, var(--panel)); box-shadow: inset 3px 0 0 #1a6bd0; }
.dv-apply { flex: 1; min-width: 0; text-align: left; border: 0; background: none; font: inherit; color: var(--ink); cursor: pointer; padding: 5px 6px; border-radius: 7px; }
.dv-apply:hover { background: var(--ui2-hover, var(--bg-soft)); }
.dv-name { display: flex; align-items: center; gap: 6px; font-weight: 700; font-size: 13px; }
.dv-def { font-size: 10px; font-weight: 700; color: #b45309; background: color-mix(in srgb, #f59e0b 16%, var(--panel)); border-radius: 999px; padding: 0 7px; }
.dv-apply small { display: block; font-size: 11.5px; color: var(--muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.dv-acts { display: flex; gap: 2px; }
.dv-a { border: 0; background: none; width: 28px; height: 28px; border-radius: 7px; cursor: pointer; font-size: 13px; color: var(--muted); }
.dv-a:hover { background: var(--bg-sunk); color: var(--ink); } .dv-a.star { color: #d97706; } .dv-a.del:hover { color: #dc2626; }
.dv-ren { flex: 1; height: 30px; margin: 4px; }
.dv-empty { display: flex; flex-direction: column; gap: 2px; padding: 10px 12px; border: 1px dashed var(--ui2-line, var(--line)); border-radius: 10px; font-size: 12px; color: var(--muted); }
.dv-empty b { color: var(--ink); font-size: 13px; }
.dv-all { align-self: flex-start; border: 0; background: none; color: #1a6bd0; font: inherit; font-size: 12px; cursor: pointer; padding: 6px 2px 0; }
.dv-save { border-top: 1px solid var(--line-soft); padding: 10px 12px 12px; background: var(--ui2-head, var(--bg-soft)); display: flex; flex-direction: column; gap: 6px; }
.dv-cur { font-size: 11.5px; color: var(--ink-2); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .dv-cur span { color: var(--muted); }
.dv-saverow { display: flex; gap: 6px; } .dv-saverow input { flex: 1; min-width: 0; height: 32px; }

/* 17 Oct: the EA coin and the tilting illustration (sign-in page) */
.lg-coin { position: relative; flex: none; width: 52px; height: 52px; padding: 0; border: 0; background: none; cursor: pointer; perspective: 600px;
  transform-style: preserve-3d; margin: 8px 10px; }
.lg-coin:focus-visible { outline: 2px solid #14d6f6; outline-offset: 4px; border-radius: 50%; }
.lg-coin-in { position: absolute; inset: 0; transform-style: preserve-3d; transition: transform .5s; }
.lg-coin-f, .lg-coin-b { position: absolute; inset: 0; border-radius: 50%; overflow: hidden; backface-visibility: hidden; display: grid; place-items: center;
  box-shadow: 0 10px 24px rgba(0, 0, 0, .45), inset 0 0 0 2px rgba(255, 255, 255, .55), inset 0 -6px 12px rgba(10, 26, 51, .25); }
.lg-coin-f { background: #fff; } .lg-coin-f img { width: 100%; height: 100%; display: block; }
.lg-coin-b { transform: rotateY(180deg); background: radial-gradient(circle at 35% 30%, #1f5a96, #0a1a33 70%); }
.lg-coin-b b { font-size: 14px; letter-spacing: .08em; color: #14d6f6; text-shadow: 0 0 8px rgba(20, 214, 246, .6); }
.lg-sheen { position: absolute; inset: -40%; background: linear-gradient(115deg, transparent 40%, rgba(255, 255, 255, .85) 50%, transparent 60%);
  transform: translateX(-120%); animation: lgsheen 4.5s ease-in-out infinite; pointer-events: none; mix-blend-mode: screen; }
@keyframes lgsheen { 0%, 62% { transform: translateX(-120%); } 82%, 100% { transform: translateX(120%); } }
.lg-brand { gap: 14px; }
.lg-illu { transition: transform .35s ease-out; transform-style: preserve-3d; will-change: transform; }
@media (prefers-reduced-motion: reduce) { .lg-sheen { animation: none; display: none; } .lg-coin-in { transition: none; } }

/* 17 Oct: the EA mark in a 3D data globe (in place of the turning coin) */
.lg-coin.lg-g { width: 92px; height: 92px; margin: -14px -8px -14px -16px; perspective: 700px; filter: none; }
.lg-g .lg-globe { position: absolute; inset: 0; width: 92px; height: 92px; pointer-events: none; }
.lg-g .lg-globe.front { z-index: 3; }
.lg-g .lg-coin-in { inset: 24px; z-index: 2; transition: transform .7s cubic-bezier(.2, .8, .2, 1); }
.lg-g .lg-coin-f, .lg-g .lg-coin-b { box-shadow: 0 6px 16px rgba(0, 0, 0, .45), inset 0 0 0 1.5px rgba(255, 255, 255, .6); }
.lg-g .lg-coin-b b { font-size: 11px; }
.lg-g .lg-glow { position: absolute; inset: 14px; border-radius: 50%; z-index: 1;
  background: radial-gradient(circle, rgba(20, 214, 246, .35) 0%, rgba(20, 214, 246, .08) 55%, transparent 72%); animation: lgglow 3.2s ease-in-out infinite; }
@keyframes lgglow { 50% { transform: scale(1.12); opacity: .7; } }
.lg-brand:has(.lg-g) { gap: 10px; }
@media (prefers-reduced-motion: reduce) { .lg-g .lg-glow { animation: none; } }

/* 17 Oct: 3D logo treatments on the sign-in page (halo / hex / tags; the globe is above) */
.fx { position: relative; flex: none; width: 92px; height: 92px; margin: -14px -8px -14px -16px; padding: 0; border: 0; background: none; cursor: pointer; perspective: 600px; }
.fx:focus-visible { outline: 2px solid #14d6f6; outline-offset: 2px; border-radius: 50%; }
.fx-mark { position: absolute; left: 50%; top: 50%; width: 44px; height: 44px; margin: -22px 0 0 -22px; border-radius: 50%; overflow: hidden; z-index: 2;
  background: #fff; box-shadow: 0 6px 16px rgba(0, 0, 0, .45), 0 0 18px rgba(20, 214, 246, .35), inset 0 0 0 1.5px rgba(255, 255, 255, .6); }
.fx-mark img { width: 100%; height: 100%; display: block; }
/* halo */
.fx-halo { transform-style: preserve-3d; }
.fx-ring { position: absolute; inset: 6px; border-radius: 50%; transform-style: preserve-3d; pointer-events: none;
  border: 2px solid transparent; border-top-color: #14d6f6; border-right-color: rgba(20, 214, 246, .35); filter: drop-shadow(0 0 4px rgba(20, 214, 246, .8)); }
.fx-ring i { position: absolute; top: -4px; left: 50%; width: 6px; height: 6px; margin-left: -3px; border-radius: 50%; background: #fff; box-shadow: 0 0 8px #14d6f6; }
.fx-ring.r1 { animation: fxr1 3.2s linear infinite; }
.fx-ring.r2 { inset: 13px; border-top-color: #7fe9ff; border-left-color: rgba(127, 233, 255, .35); border-right-color: transparent; animation: fxr2 4.6s linear infinite; }
.fx-ring.r3 { inset: 0; border-width: 1px; border-top-color: rgba(167, 139, 250, .9); border-bottom-color: rgba(167, 139, 250, .3); border-right-color: transparent; animation: fxr3 6s linear infinite; }
@keyframes fxr1 { from { transform: rotateX(68deg) rotateZ(0); } to { transform: rotateX(68deg) rotateZ(360deg); } }
@keyframes fxr2 { from { transform: rotateY(64deg) rotateZ(360deg); } to { transform: rotateY(64deg) rotateZ(0); } }
@keyframes fxr3 { from { transform: rotateX(-35deg) rotateY(30deg) rotateZ(0); } to { transform: rotateX(-35deg) rotateY(30deg) rotateZ(360deg); } }
.fx-halo.burst .fx-ring { animation-duration: .7s; }
/* hex */
.fx-prism { position: absolute; left: 50%; top: 50%; width: 35px; height: 70px; margin: -35px 0 0 -17.5px; transform-style: preserve-3d; animation: fxhex 10s linear infinite; }
.fx-face { position: absolute; inset: 0; border: 1px solid rgba(127, 233, 255, .75); background: linear-gradient(180deg, rgba(20, 214, 246, .16), rgba(20, 214, 246, .04) 60%, rgba(127, 233, 255, .14));
  box-shadow: inset 0 0 10px rgba(20, 214, 246, .25); backface-visibility: visible; }
.fx-cap { position: absolute; left: 50%; top: 50%; width: 70px; height: 70px; margin: -35px 0 0 -35px; clip-path: polygon(25% 7%, 75% 7%, 100% 50%, 75% 93%, 25% 93%, 0 50%);
  background: rgba(20, 214, 246, .08); border: 0; }
.fx-cap.top { transform: rotateX(90deg) translateZ(35px); } .fx-cap.bot { transform: rotateX(90deg) translateZ(-35px); }
@keyframes fxhex { from { transform: rotateX(-14deg) rotateY(0); } to { transform: rotateX(-14deg) rotateY(360deg); } }
.fx-hex.burst .fx-prism { animation-duration: 1.2s; }
.fx-hex .fx-mark { z-index: 1; }
/* tags */
.fx-tags { width: 120px; height: 120px; margin: -28px -18px -28px -30px; }
.fx-layer { position: absolute; inset: 0; pointer-events: none; } .fx-layer.front { z-index: 3; } .fx-layer.back { z-index: 1; }
.fx-tag { position: absolute; left: 0; top: 0; font: 600 9.5px/1 Consolas, monospace; color: #bff4ff; white-space: nowrap; padding: 3px 6px; border-radius: 999px;
  background: rgba(11, 35, 64, .85); border: 1px solid rgba(20, 214, 246, .5); box-shadow: 0 0 8px rgba(20, 214, 246, .25); }
@media (prefers-reduced-motion: reduce) { .fx-ring, .fx-prism { animation: none; } }

/* 17 Oct: forgot password (sign-in page) */
.lg-lab { display: flex !important; align-items: baseline; justify-content: space-between; }
.lg-forgot { font-size: 12.5px; font-weight: 600; color: #1a6bd0; text-decoration: none; }
.lg-forgot:hover { text-decoration: underline; }
.lg-back { align-self: center; border: 0; background: none; color: #1a6bd0; font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; padding: 4px 8px; }
.lg-sent { align-items: stretch; text-align: left; }
.lg-sent-ic { width: 52px; height: 52px; border-radius: 14px; display: grid; place-items: center; font-size: 24px; color: #fff;
  background: linear-gradient(135deg, #0f2a4a, #1a6bd0); box-shadow: 0 10px 22px rgba(26, 107, 208, .3); }
.lg-note { font-size: 12.5px; color: #5b6b80; margin: 0; padding: 10px 12px; background: #f4f8fd; border-radius: 10px; }

/* 17 Oct: the reset form's message when the address has no account (or cannot be reset) */
.lg-alert { display: flex; flex-direction: column; gap: 2px; padding: 11px 14px 11px 42px; border-radius: 11px; position: relative; font-size: 13px; line-height: 1.45;
  background: #fef2f2; border: 1px solid #fecaca; color: #7f1d1d; }
.lg-alert::before { content: "!"; position: absolute; left: 13px; top: 12px; width: 20px; height: 20px; border-radius: 50%; background: #dc2626; color: #fff;
  font-weight: 800; font-size: 12px; display: grid; place-items: center; }
.lg-alert b { font-size: 13.5px; color: #991b1b; }
.lg-alert.hidden { display: none; }
.lg-alert.shake { animation: lgshake .35s ease; }
@keyframes lgshake { 20%, 60% { transform: translateX(-5px); } 40%, 80% { transform: translateX(5px); } }

/* 17 Oct: attribute filter — approval choices on one line each (label over its count), the "no filter" note */
.af2-seg button { flex-direction: column; gap: 1px; white-space: nowrap; padding: 6px 4px; line-height: 1.2; }
.af2-seg .af2-n { font-size: 10.5px; font-weight: 700; opacity: .75; }
.af2-count .af2-none { display: none; } .af2-count.none .af2-none { display: inline; }

/* 17 Oct: year-over-year movement of a beginning balance (inline hover card and fact panel) */
.ivh-yoy-row { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-top: 4px; }
.ivh-yoy-row > span { display: flex; flex-direction: column; } .ivh-yoy-row small { font-size: 11px; color: var(--muted); }
.ivh-yoy-row b { font-size: 14px; font-variant-numeric: tabular-nums; } .ivh-yoy-row > i { color: var(--muted); font-style: normal; }
.ivh-yoy-d { margin-left: auto; font-size: 12px; font-weight: 700; padding: 2px 8px; border-radius: 999px; background: var(--bg-sunk); color: var(--ink-2);
  flex-direction: row !important; }
.ivh-yoy-d.up { background: #e8f5ec; color: #1a7f37; } .ivh-yoy-d.down { background: #fdecec; color: #b42318; }
.ivx-yoy { margin-top: 10px; padding: 10px 12px; border: 1px solid var(--line); border-radius: 10px; background: var(--panel); }
.ivx-yoy .ivh-k { font-size: 11.5px; color: var(--muted); }

/* 17 Oct: scrolling the grid sideways, values showed through the 8px strip left of the frozen label column (sticky at the
   scroller's padding edge). The 8px now sits OUTSIDE the scroller (margin, not padding), so the label column never moves
   (no jump when scrolling starts) and nothing shows to its left; while scrolled, a crisp 1px divider like Excel's frozen
   pane (no blurred shadow) */
.grid-wrap { padding-left: 0; margin-left: 8px; }
.grid-wrap.hscrolled table.gt thead th.l { box-shadow: inset -1px 0 0 rgba(255, 255, 255, .35); }
.grid-wrap.hscrolled table.gt tbody td.l { box-shadow: inset -1px 0 0 var(--line); }

/* 17 Oct: partial (role-wise) comparison — the roles to compare, in the Compare panel */
.cmp2-scope { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border: 1px solid var(--ui2-line, var(--line)); border-radius: 12px; background: var(--ui2-head, var(--bg-soft)); }
.cmp2-scope .cmp2-sec { margin: 0; }
.cmp2-scount { margin-left: auto; font-size: 11px; font-weight: 700; letter-spacing: 0; text-transform: none; color: var(--muted); }
.cmp2-scount.warn { color: #b42318; }
.cmp2-seg { display: flex; border: 1px solid var(--ui2-line, var(--line)); border-radius: 9px; overflow: hidden; background: var(--panel); }
.cmp2-seg button { flex: 1 1 0; min-width: 0; border: 0; background: none; font: inherit; font-size: 12px; padding: 7px 8px; cursor: pointer; color: var(--ink-2);
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.cmp2-seg button + button { border-left: 1px solid var(--ui2-line, var(--line)); }
.cmp2-seg button.on { background: var(--ui2-navy, #0f2a4a); color: #fff; font-weight: 600; }
.cmp2-seg button:disabled { opacity: .45; cursor: not-allowed; }
.cmp2-scope-pick { display: flex; flex-direction: column; gap: 6px; }
.cmp2-scope-list { max-height: 210px; overflow: auto; border: 1px solid var(--ui2-line, var(--line)); border-radius: 9px; background: var(--panel); padding: 4px 0; }
.cmp2-sg { display: flex; align-items: center; gap: 8px; padding: 6px 10px 2px; font-size: 11px; text-transform: uppercase; letter-spacing: .05em; color: var(--ui2-th, var(--muted)); }
.cmp2-sg .linkbtn { font-size: 11px; text-transform: none; letter-spacing: 0; }
.cmp2-sr { display: flex; align-items: center; gap: 8px; padding: 4px 12px; font-size: 12.5px; cursor: pointer; }
.cmp2-sr:hover { background: var(--ui2-hover, var(--bg-soft)); }
.cmp2-snote { font-size: 11.5px; color: var(--muted); }

/* 17 Oct: the Guide — contents, cards per section, the Super Admin PDF card */
.g-page h1 { margin-bottom: 4px; }
.g-page h2 { scroll-margin-top: 90px; }
.g-card { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 6px 18px; box-shadow: 0 1px 2px rgba(15, 42, 74, .04); }
.g-card > ul, .g-card > ol { margin: 10px 0; padding-left: 20px; line-height: 1.75; }
.g-card > p { margin: 0 0 10px; }
.g-toc { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 12px 18px; margin: 14px 0 6px; }
.g-toc ol { columns: 2; column-gap: 32px; margin: 6px 0 0; padding-left: 20px; line-height: 1.9; }
.g-toc a { color: var(--accent, #0b5cad); text-decoration: none; } .g-toc a:hover { text-decoration: underline; }
.g-pdf { display: flex; align-items: center; gap: 14px; background: var(--panel); border: 1px solid var(--line); border-left: 4px solid #c62828;
  border-radius: 12px; padding: 12px 16px; margin: 14px 0 4px; }
.g-pdf-ic { flex: none; width: 46px; height: 54px; border-radius: 8px; background: #c62828; color: #fff; display: grid; place-items: center; font-weight: 800; font-size: 13px; }
.g-pdf .row { gap: 8px; flex: none; }
.g-faq dt { font-weight: 700; margin-top: 10px; } .g-faq dd { margin: 2px 0 8px 0; color: var(--ink-2); }
.g-keys { background: var(--panel); border-radius: 12px; overflow: hidden; }

/* 17 Oct (validation_ui_v2): validation messages as cards; filters with an explicit "All" and ticked choices */
.vf-bar { display: flex; flex-direction: column; gap: 8px; padding: 10px 12px; border: 1px solid var(--ui2-line, var(--line)); border-radius: 10px; background: var(--panel); }
.vf-row { display: flex; align-items: center; gap: 6px; flex-wrap: wrap; }
.vf-lab { width: 64px; font-size: 11px; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.vf { display: inline-flex; align-items: center; gap: 6px; height: 28px; border: 1px solid var(--ui2-line, var(--line)); background: var(--panel); border-radius: 999px; padding: 0 11px 0 8px; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; color: var(--ink-2); }
.vf:hover { border-color: #94a3b8; }
.vf b { font-size: 11px; font-weight: 700; background: var(--bg-sunk); color: var(--ink-2); border-radius: 999px; padding: 0 7px; }
.vf-ck { display: inline-flex; width: 14px; height: 14px; border-radius: 50%; border: 1.5px solid #94a3b8; font-size: 9px; line-height: 1; align-items: center; justify-content: center; }
.vf.sel { background: #0f3d7a; border-color: #0f3d7a; color: #fff; }
.vf.sel .vf-ck { border-color: #fff; background: #fff; color: #0f3d7a; font-weight: 900; }
.vf.sel b { background: rgba(255, 255, 255, .2); color: #fff; }
.vf.lv-error:not(.sel) .vf-ck { border-color: var(--bad); } .vf.lv-warning:not(.sel) .vf-ck { border-color: #d97706; } .vf.lv-info:not(.sel) .vf-ck { border-color: #1a6bd0; }
.vm-wrap { display: flex; flex-direction: column; gap: 8px; padding: 8px; background: var(--bg-soft, #f6f8fb); }
.vm { background: var(--panel); border: 1px solid var(--ui2-line, var(--line)); border-left: 4px solid #94a3b8; border-radius: 8px; padding: 10px 12px; }
.vm.vm-error { border-left-color: var(--bad); } .vm.vm-warning { border-left-color: #d97706; } .vm.vm-info { border-left-color: #1a6bd0; }
.vm-head { display: flex; align-items: center; gap: 8px; flex-wrap: wrap; }
.vm-code { font-size: 12px; color: var(--ink-2); background: var(--bg-sunk); border-radius: 5px; padding: 1px 7px; white-space: nowrap; max-width: 520px; overflow: hidden; text-overflow: ellipsis; }
.vm-n { font-size: 11.5px; font-weight: 700; color: var(--ink-2); }
.vm-show { white-space: nowrap; text-decoration: none; }
.vm-msg { margin-top: 7px; line-height: 1.5; font-size: 13px; color: var(--ink); overflow-wrap: anywhere; }
.vm-q { font-size: 11.5px; background: var(--bg-sunk); border-radius: 4px; padding: 0 4px; color: #0f3d7a; overflow-wrap: anywhere; }
.vm-foot { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; font-size: 12px; color: var(--muted); }
.vm-foot .vm-q { margin-right: 4px; }
.vm-facts a, .vm-link { font-weight: 600; margin-right: 6px; white-space: nowrap; }
.vm-list { margin: 8px 0 0; padding-left: 22px; display: flex; flex-direction: column; gap: 6px; font-size: 12.5px; }
.vm-occ { display: flex; gap: 12px; align-items: baseline; justify-content: space-between; }
.vm-otext { line-height: 1.45; overflow-wrap: anywhere; } .vm-olinks { flex: 0 0 auto; font-size: 12px; }
.vm-props { font-size: 11.5px; color: var(--muted); margin-top: 2px; overflow-wrap: anywhere; }
.vm-more { border: 0; background: none; color: #1a6bd0; font: inherit; font-size: 12px; font-weight: 600; cursor: pointer; padding: 4px 0 0; }
.vm-det summary { cursor: pointer; font-size: 12px; color: var(--ink-2); margin-top: 3px; }
.vm-calc { margin-top: 8px; border: 1px solid var(--line-soft, var(--line)); border-radius: 6px; padding: 8px 10px; background: var(--bg-soft, #f8fafc); }
.vm-meta { display: flex; flex-wrap: wrap; gap: 4px 18px; font-size: 12px; color: var(--ink-2); margin-bottom: 6px; }
.vm-meta b { color: var(--muted); font-weight: 600; }
.vm-ct { width: 100%; border-collapse: collapse; font-size: 12.5px; }
.vm-ct td { padding: 3px 6px; border-top: 1px solid var(--line-soft, var(--line)); vertical-align: baseline; }
.vm-ct tr:first-child td { border-top: 0; }
.vm-ct td.num { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; width: 160px; }
.vm-ct td:last-child { width: 70px; text-align: right; }
.vm-w { width: 16px; color: var(--muted); font-weight: 700; }
.vm-sum td { font-weight: 600; } .vm-diff td { font-weight: 700; color: var(--bad); }

/* 18 Oct (hover_compare_v1): member / axis / domain change as Previous / Current */
.hc { margin-top: 8px; }
.hc-t { margin-top: 4px; } .hc-t td { overflow-wrap: anywhere; }
.hc-t th:nth-child(2), .hc-t th:nth-child(3) { width: 45%; }
.hc-del { background: color-mix(in srgb, var(--rem, #dc2626) 18%, transparent); color: var(--rem, #b91c1c); border-radius: 3px; padding: 0 2px; font-weight: 700; text-decoration: line-through; }
.hc-ins { background: color-mix(in srgb, var(--add, #16a34a) 18%, transparent); color: var(--add, #15803d); border-radius: 3px; padding: 0 2px; font-weight: 700; }
.hc-gap { display: inline-block; width: 2px; height: 1em; padding: 0; vertical-align: -2px; text-decoration: none; }
.hc-del.hc-gap { background: var(--rem, #dc2626); } .hc-ins.hc-gap { background: var(--add, #16a34a); }
.hc-what { margin-top: 4px; color: var(--ink-2); } .hc-what b { color: var(--mod); }

/* 18 Oct (modal_drag_v1): pop-up windows move by their title bar */
.modal header.drag-h { cursor: move; user-select: none; touch-action: none; }
.modal header.drag-h h2 { cursor: move; }
.drag-grip { color: var(--muted); font-size: 15px; line-height: 1; margin-right: 2px; letter-spacing: -1px; }
.modal header.drag-h:hover .drag-grip { color: var(--ink-2); }
.modal.dragging { box-shadow: 0 18px 50px rgba(10, 26, 51, .35); transition: none; }
.modal.dragging .body { pointer-events: none; }
.modal-back.moved { background: rgba(15, 20, 25, .18); }

/* 18 Oct (calc_tip_v2): the calculation hover — total, calculated and difference rows in the components' table */
table.cmp tr.ct-tot td { border-top: 1.5px solid var(--ink-2); padding-top: 5px; }
table.cmp tr.ct-sum td { border-bottom: 0; padding-top: 2px; padding-bottom: 2px; }
/* 18 Oct (owner: "show the value without breaking"): in the calculation hover the labels wrap, the values and signs never do */
.tip table.calc-t { table-layout: auto; }
.tip table.calc-t td:first-child { white-space: normal; word-break: normal; overflow-wrap: break-word; min-width: 180px; }
.tip table.calc-t td.num, .tip table.calc-t th.r, .tip table.calc-t td.c, .tip table.calc-t th.c { white-space: nowrap; word-break: normal; overflow-wrap: normal; width: 1%; }

/* 18 Oct (role_features_v1): Admin → Roles & features */
.rf { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 16px; align-items: start; }
.rf-list { display: flex; flex-direction: column; gap: 8px; position: sticky; top: 12px; }
.rf-list-head { display: flex; align-items: center; gap: 8px; padding: 0 2px 4px; }
.rf-card { text-align: left; border: 1px solid var(--ui2-line, var(--line)); background: var(--panel); border-radius: 10px; padding: 10px 12px; cursor: pointer; font: inherit; color: var(--ink); display: flex; flex-direction: column; gap: 4px; }
.rf-card:hover { border-color: #94a3b8; }
.rf-card.on { border-color: #1a6bd0; box-shadow: 0 0 0 2px color-mix(in srgb, #1a6bd0 25%, transparent); }
.rf-card.off { opacity: .7; }
.rf-card.new { border-style: dashed; cursor: default; }
.rf-card-top { display: flex; align-items: center; gap: 6px; }
.rf-card-sub { font-size: 12px; color: var(--muted); }
.rf-meter { height: 4px; border-radius: 4px; background: var(--bg-sunk); overflow: hidden; }
.rf-meter i { display: block; height: 100%; background: #1a6bd0; border-radius: 4px; }
.rf-tag { font-size: 10.5px; font-weight: 700; border-radius: 999px; padding: 1px 8px; background: var(--bg-sunk); color: var(--ink-2); }
.rf-tag.lock { background: #0f3d7a; color: #fff; } .rf-tag.cu { background: #e6f1fb; color: #0c447c; } .rf-tag.off { background: #fde8e8; color: #9b1c1c; }
.rf-ed { border: 1px solid var(--ui2-line, var(--line)); border-radius: 12px; background: var(--panel); display: flex; flex-direction: column; min-width: 0; }
.rf-info { padding: 16px; display: flex; flex-direction: column; gap: 10px; border-bottom: 1px solid var(--ui2-line, var(--line)); }
.rf-info-row { display: flex; gap: 16px; align-items: flex-end; }
.rf-field { display: flex; flex-direction: column; gap: 4px; font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.rf-field input, .rf-field textarea { font: inherit; font-weight: 400; font-size: 14px; }
.rf-field .req { color: var(--bad); font-style: normal; margin-left: 2px; }
.rf-active { display: inline-flex; align-items: center; gap: 8px; font-weight: 600; font-size: 13px; padding-bottom: 6px; cursor: pointer; }
.rf-active.dis { opacity: .6; cursor: not-allowed; }
.rf-feats-head { display: flex; align-items: center; gap: 10px; padding: 12px 16px 4px; }
.rf-feats-head h3 { margin: 0; }
.rf-feats-head input { width: 240px; }
.rf-groups { padding: 4px 16px 12px; display: flex; flex-direction: column; gap: 12px; }
.rf-group { border: 1px solid var(--ui2-line, var(--line)); border-radius: 10px; overflow: hidden; }
.rf-group-head { display: flex; align-items: center; gap: 10px; padding: 10px 12px; background: var(--bg-soft, #f6f8fb); border-bottom: 1px solid var(--ui2-line, var(--line)); }
.rf-group-head small { display: block; color: var(--muted); font-size: 12px; }
.rf-count { font-size: 12px; font-weight: 700; border-radius: 999px; padding: 1px 9px; background: var(--bg-sunk); color: var(--ink-2); }
.rf-count.full { background: #0f3d7a; color: #fff; } .rf-count.some { background: #e6f1fb; color: #0c447c; }
.rf-feats { display: grid; grid-template-columns: repeat(auto-fill, minmax(300px, 1fr)); }
.rf-feat { display: flex; gap: 12px; align-items: flex-start; padding: 10px 12px; border-top: 1px solid var(--line-soft, var(--line)); cursor: pointer; }
.rf-feat:hover { background: var(--bg-soft, #f6f8fb); }
.rf-feat.chg { background: color-mix(in srgb, #d97706 8%, transparent); }
.rf-ft b { display: block; font-size: 13.5px; font-weight: 600; color: var(--ink); }
.rf-ft b em { font-style: normal; font-size: 11px; font-weight: 700; color: #b45309; margin-left: 4px; }
.rf-ft small { display: block; font-size: 12px; color: var(--muted); line-height: 1.4; margin-top: 2px; }
.rf-feat:not(.on) .rf-ft b { color: var(--ink-2); font-weight: 500; }
.rf-sw { position: relative; flex: none; width: 34px; height: 20px; margin-top: 1px; }
.rf-sw input { position: absolute; inset: 0; opacity: 0; margin: 0; cursor: pointer; z-index: 1; }
.rf-sw i { position: absolute; inset: 0; border-radius: 999px; background: #cbd5e1; transition: background .15s; }
.rf-sw i::after { content: ""; position: absolute; top: 2px; left: 2px; width: 16px; height: 16px; border-radius: 50%; background: #fff; box-shadow: 0 1px 2px rgba(0,0,0,.25); transition: transform .15s; }
.rf-sw input:checked + i { background: #1a6bd0; }
.rf-sw input:checked + i::after { transform: translateX(14px); }
.rf-sw input:focus-visible + i { outline: 2px solid var(--focus); outline-offset: 2px; }
.rf-sw input:disabled + i { opacity: .55; }
.rf-bar { position: sticky; bottom: 0; display: flex; align-items: center; gap: 8px; padding: 10px 16px; border-top: 1px solid var(--ui2-line, var(--line)); background: var(--panel); border-radius: 0 0 12px 12px; }
.rf-bar-n { font-size: 13px; font-weight: 600; color: var(--ink-2); }
@media (max-width: 900px) { .rf { grid-template-columns: 1fr; } .rf-list { position: static; } }


/* 18 Oct (migration_v2): the taxonomy migration report dialog */
.mig-pick { display: flex; align-items: flex-end; gap: 10px; flex-wrap: wrap; margin-bottom: 12px; }
.mig-pick label { display: flex; flex-direction: column; gap: 4px; flex: 1 1 360px; }
.mig-pick select { height: 34px; }
.mig-head { display: flex; align-items: center; gap: 10px; margin: 4px 0 10px; }
.mig-tiles { display: grid; grid-template-columns: repeat(auto-fill, minmax(118px, 1fr)); gap: 8px; margin-bottom: 12px; }
.mig-tile { border: 1px solid var(--line); border-radius: 10px; padding: 8px 10px; background: var(--panel); display: flex; flex-direction: column; }
.mig-tile b { font-size: 20px; line-height: 1.2; } .mig-tile span { font-size: 11.5px; color: var(--muted); }
.mig-tile.add b { color: var(--add, #1a7f37); } .mig-tile.rem b { color: var(--rem, #c62828); } .mig-tile.mod b { color: var(--mod, #b35900); }
.mig-tile.bad { border-color: var(--rem, #c62828); }
.mig-sec { margin-top: 10px; } .mig-sec h3 { font-size: 13px; margin: 0 0 6px; display: flex; gap: 8px; align-items: center; }
.mig-t { width: 100%; table-layout: auto; } .mig-t td { padding: 4px 8px; vertical-align: top; } .mig-t td.mono { overflow-wrap: anywhere; min-width: 260px; }
.mig-prog { height: 6px; border-radius: 3px; background: var(--bg-sunk, #eee); overflow: hidden; margin-top: 6px; }
.mig-prog i { display: block; height: 100%; background: var(--accent); transition: width .3s; }

/* 19 Oct (forms_v2): creation and edit forms — header with icon and subtitle, titled sections, one input style */
.modal.f2 { border-radius: 14px; overflow: hidden; box-shadow: 0 24px 60px rgba(10, 26, 51, .28); border-color: var(--line); }
.modal.f2 header { gap: 14px; padding: 18px 22px; background: linear-gradient(180deg, var(--panel), var(--bg-soft)); }
.modal.f2 .f2-ic { width: 42px; height: 42px; border-radius: 11px; display: grid; place-items: center; flex: none; color: #fff;
  background: linear-gradient(135deg, #1a6bd0, #1f3a5f); box-shadow: 0 4px 12px rgba(26, 107, 208, .3); }
.modal.f2 .f2-t { flex: 1; min-width: 0; }
.modal.f2 .f2-t h2 { margin: 0; font-size: 18px; font-weight: 700; color: var(--ink); }
.modal.f2 .f2-t p { margin: 2px 0 0; font-size: 12.5px; color: var(--muted); }
.modal.f2 .body { padding: 18px 22px; background: var(--bg-soft); display: flex; flex-direction: column; gap: 14px; }
.modal.f2 footer { padding: 14px 22px; background: var(--panel); align-items: center; }
.modal.f2 footer .btn { min-width: 96px; height: 38px; font-weight: 600; }
.modal.f2 .f2-note { font-size: 12px; color: var(--muted); }
.f2-sec { background: var(--panel); border: 1px solid var(--line); border-radius: 12px; padding: 16px 18px; }
.f2-sec-h { display: flex; align-items: baseline; gap: 10px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--line-soft, var(--line)); }
.f2-sec-h b { font-size: 13px; letter-spacing: .02em; color: var(--ink); }
.f2-sec-h span { font-size: 12px; color: var(--muted); }
.f2-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px 20px; }
.f2-grid .full { grid-column: 1 / -1; }
.f2-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.f2-lab { font-size: 12.5px; font-weight: 600; color: var(--ink-2); }
.f2-help { font-size: 12px; color: var(--muted); line-height: 1.4; }
.f2-help .field-ok, .f2-help .field-err, .f2-help .field-warn { font-size: 12px; }
.modal.f2 .f2-field input:not([type=checkbox]):not([type=radio]):not([type=file]), .modal.f2 .f2-field select, .modal.f2 .f2-field textarea,
.modal.f2 .f2-field .pk-btn, .modal.f2 .f2-field .chips { min-height: 40px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel);
  font: inherit; color: var(--ink); padding: 0 12px; box-shadow: none; outline: none; width: 100%; box-sizing: border-box; }
.modal.f2 .f2-field .chips { padding: 5px 8px; }
.modal.f2 .f2-field input[type=date], .modal.f2 .f2-field input[type=datetime-local] { padding: 0 10px; color-scheme: light; }
.modal.f2 .f2-field input:focus, .modal.f2 .f2-field select:focus, .modal.f2 .f2-field textarea:focus, .modal.f2 .f2-field .pk-btn:focus,
.modal.f2 .f2-field .chips:focus-within { border-color: #1a6bd0; box-shadow: 0 0 0 3px rgba(26, 107, 208, .15); }
.modal.f2 .f2-field input[disabled], .modal.f2 .f2-field .pk-btn[disabled] { background: var(--bg-soft); color: var(--ink-2); }
.modal.f2 .f2-field input[type=file] { padding: 10px; border: 1.5px dashed var(--line); border-radius: 10px; background: var(--panel); width: 100%; }
.f2-tabs { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.f2-tab { display: flex; gap: 12px; align-items: flex-start; text-align: left; padding: 12px 14px; border: 1.5px solid var(--line); border-radius: 12px;
  background: var(--panel); cursor: pointer; font: inherit; color: var(--ink); }
.f2-tab b { display: block; font-size: 13.5px; } .f2-tab span { font-size: 12px; color: var(--muted); }
.f2-tab.on { border-color: #1a6bd0; background: color-mix(in srgb, #1a6bd0 6%, var(--panel)); box-shadow: 0 0 0 3px rgba(26, 107, 208, .12); }
.f2-tab .f2-dot { width: 16px; height: 16px; border-radius: 50%; border: 2px solid var(--line); flex: none; margin-top: 2px; }
.f2-tab.on .f2-dot { border-color: #1a6bd0; background: radial-gradient(circle, #1a6bd0 45%, transparent 50%); }
.f2-ident { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); }
.f2-ident b { color: var(--ink-2); font-weight: 600; }
.f2-check { display: flex; align-items: center; gap: 8px; font-size: 13px; font-weight: 600; color: var(--ink-2); align-self: end; min-height: 40px; }
@media (max-width: 720px) { .f2-grid, .f2-tabs { grid-template-columns: 1fr; } }

.modal.f2 .f2-field .pk-btn { display: flex; align-items: center; justify-content: space-between; text-align: left; }
.modal.f2 .f2-field .chips input { border: 0 !important; box-shadow: none !important; min-height: 28px; padding: 0 4px; width: auto; flex: 1; }
.modal.f2 .f2-field .chips { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.f2-body { display: flex; flex-direction: column; gap: 14px; }

/* 19 Oct (validation_split_v1): the Validation window's check tabs and each run's summary */
.vt-tabs { display: flex; gap: 2px; border-bottom: 1px solid var(--ui2-line, var(--line)); margin: 2px 0 -4px; overflow-x: auto; }
.vt-tab { display: inline-flex; align-items: center; gap: 7px; padding: 9px 14px 10px; border: 0; border-bottom: 3px solid transparent; background: none; font: inherit; font-size: 13px; font-weight: 600; color: var(--ink-2); cursor: pointer; white-space: nowrap; }
.vt-tab:hover { color: var(--ink); background: var(--bg-soft); }
.vt-tab.on { color: #0f3d7a; border-bottom-color: #0f3d7a; }
.vt-tab b { font-size: 11px; padding: 1px 7px; border-radius: 999px; background: var(--bg-soft); color: var(--ink-2); }
.vt-tab.on b { background: #0f3d7a; color: #fff; }
.vt-dot { width: 8px; height: 8px; border-radius: 50%; background: #b8c2cf; }
.vt-dot.ok { background: #1f9d55; } .vt-dot.msg { background: #d98a00; } .vt-dot.err { background: #c62828; }
.vt-sum { display: flex; align-items: center; gap: 12px; padding: 10px 14px; border-radius: 10px; border: 1px solid var(--ui2-line, var(--line)); background: var(--panel); font-size: 13px; }
.vt-sum small { color: var(--ink-3, #6b7280); }
.vt-sum.ok { border-color: #b7e2c6; background: #f1faf4; } .vt-sum.msg { border-color: #f1d49a; background: #fffaf0; }
.vt-sum.err { border-color: #f2b8b5; background: #fdf3f2; }
.vt-ic { flex: none; min-width: 28px; height: 28px; padding: 0 6px; border-radius: 999px; display: inline-flex; align-items: center; justify-content: center; font-weight: 800; color: #fff; background: #8a96a8; }
.vt-sum.ok .vt-ic { background: #1f9d55; } .vt-sum.msg .vt-ic { background: #d98a00; } .vt-sum.err .vt-ic { background: #c62828; }
.modal.vl-modal:has(.vt-tabs) { min-height: min(760px, 88vh); }   /* the window keeps its height when the tab changes */
/* 19 Oct (calc_explain_v1): components missing from the calculation's context */
.vm-missrow td { color: #8a5a00; background: #fffaf0; }
.vm-miss { font-size: 11.5px; color: #8a5a00; margin-top: 2px; }
.vm-missv { color: #8a5a00; font-style: italic; }

/* 20 Oct (untagged_practice_v1): the untagged values' suggested members, text values, the "not listed" count */
.ut-sugg .ut-mem { font-size: 11px; color: var(--text); white-space: nowrap; margin-top: 2px; max-width: 340px; overflow: hidden; text-overflow: ellipsis; }   /* a typed member can be a long text: the full value in the hover */
.ut-text { max-width: 260px; white-space: normal; font-size: 12px; }
.ut-left { border-bottom: 1px dotted currentColor; cursor: help; color: var(--muted); }

/* 20 Oct (period_variants_v1): a period variant in a column */
.pv-warn { display: inline-block; margin-left: 4px; color: #fab219; font-size: 12px; cursor: help; }
.pv-note { border-top: 1px solid var(--line-soft); margin-top: 4px; padding-top: 4px; }
/* 20 Oct (step_assignees_v1): assignees per step in Edit project details */
.step-assign { grid-column: 1 / -1; display: flex; flex-direction: column; gap: 8px; }
.step-assign .sa-row { display: grid; grid-template-columns: 120px minmax(0, 1fr); align-items: center; gap: 12px; }
.step-assign .sa-step { font-weight: 600; color: var(--ink-2); }
.sa-show { display: flex; flex-direction: column; gap: 2px; font-size: 13px; }
@media (max-width: 600px) { .step-assign .sa-row { grid-template-columns: 1fr; gap: 4px; } }

/* 23 Oct (hover_toggle_v1): the hover-details toggle — struck through when off */
.btn.hv-tg:not(.on) { opacity: .6; text-decoration: line-through; }
.btn.hv-tg.on { box-shadow: inset 0 0 0 2px rgba(255,255,255,.55); }
.ivx-b.hv-tg.on { box-shadow: none; }

/* 23 Oct (table_shape_cols_v1): a prior column not compared (the 6-K's three months) — struck, red, in its place */
.tb-doc td.rl-col-rem, .tb-doc th.rl-col-rem { background: #fdecec !important; white-space: nowrap; padding-left: 8px; padding-right: 8px; }
.tb-doc .rl-col-rem, .tb-doc .rl-col-rem * { color: #c62828 !important; text-decoration: line-through; font-weight: 400 !important; white-space: nowrap !important; }
.tb-doc.rl-inline td.rl-cell-mod *, .tb-doc.rl-inline th.rl-cell-mod * { white-space: nowrap !important; }

/* 23 Oct (owner chose "Back to word-level", flag redline_clean_v1): word marks in text read like tracked changes — removed
   words struck red, added words green in the filing's own font and weight, no tint, no bold; tables keep their cell marks */
.tb-doc.rl-clean span.rl-mod, .tb-doc.rl-clean span.rl-add { background: none; font-weight: inherit; color: #1a7f37; }
.tb-doc.rl-clean span.rl-rem { background: none; }
.tb-doc.rl-clean p.rl-add, .tb-doc.rl-clean div.rl-add { background: none; color: #1a7f37; }

/* 23 Oct (owner: "Is this gap is intentionally … update the flexible width based on the machine (lap or system)", flag
   fluid_width_v1): data pages fill the window on every screen — side margins in proportion to the width (16 px on a
   laptop, up to 40 px on a large monitor); the Guide keeps its reading width */
html.ui2.fluid body.ui2-page main.page:not([style*="900px"]) { max-width: none !important; padding-left: clamp(16px, 2.2vw, 40px); padding-right: clamp(16px, 2.2vw, 40px); }
html.ui2.fluid body.ui2-page .txl-hero .wrap, html.ui2.fluid body.ui2-page .txl-body { max-width: none; padding-left: clamp(16px, 2.2vw, 40px); padding-right: clamp(16px, 2.2vw, 40px); }

/* 23 Oct (qv_side_by_side_v1): Quick Validation — the original HTML (source) and the iXBRL document (output) side by side */
.qv-side { display: flex; flex-direction: column; gap: 8px; }
.qv-nav { position: sticky; top: 0; z-index: 5; display: flex; align-items: flex-start; gap: 10px; padding: 10px 12px; background: var(--panel, #fff);
  border: 1px solid var(--line); border-radius: 10px; box-shadow: 0 2px 8px rgba(15, 30, 60, .06); }
.qv-nav .qv-cur { flex: 1; font-size: 13px; line-height: 1.5; min-width: 0; }
.qv-nav .qv-cur .redline { margin-top: 4px; max-height: 84px; overflow: auto; }
.qv-panes { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin-top: 8px; }
.qv-pane { display: flex; flex-direction: column; border: 1px solid var(--line); border-radius: 10px; overflow: hidden; background: #fff; min-width: 0; }
.qv-ph { padding: 8px 12px; border-bottom: 1px solid var(--line); background: var(--bg-2, #f6f8fb); font-size: 13px; }
.qv-ph .qv-note { font-size: 12px; color: #9a6700; margin-top: 2px; }
.qv-ph .qv-note:empty { display: none; }
iframe.qv-doc { width: 100%; height: calc(100vh - 290px); min-height: 420px; border: 0; background: #fff; }
.qv-seg { margin-right: 8px; }
@media (max-width: 1000px) { .qv-panes { grid-template-columns: 1fr; } iframe.qv-doc { height: 60vh; } }


/* Quick Validation header (qv_ui_v2, 23 Oct) */
.qv-hero{background:var(--card,#fff);border:1px solid var(--line,#dfe3ea);border-radius:12px;padding:22px 26px;margin:6px 0 16px;box-shadow:0 1px 3px rgba(16,24,40,.06)}
.qv-hero-top{display:flex;gap:18px;align-items:flex-start;justify-content:space-between}
.qv-eyebrow{font-size:12px;letter-spacing:.04em;text-transform:uppercase;color:var(--muted,#667085)}
.qv-title{margin:4px 0 6px;font-size:26px}
.qv-sub{margin:0;color:var(--muted,#667085);max-width:860px;line-height:1.5}
.qv-status{white-space:nowrap;font-weight:600;font-size:13px;padding:6px 14px;border-radius:999px;border:1px solid}
.qv-status.ok{color:#067647;background:#ecfdf3;border-color:#abefc6}
.qv-status.warn{color:#b54708;background:#fffaeb;border-color:#fedf89}
.qv-checks{display:flex;flex-wrap:wrap;gap:6px;margin:16px 0 18px}
.qv-chip{font-size:12px;padding:3px 10px;border-radius:999px;background:var(--bg,#f2f4f7);border:1px solid var(--line,#e4e7ec);color:var(--fg,#344054)}
.qv-steps{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.qv-step{display:flex;gap:14px;border:1px solid var(--line,#e4e7ec);border-radius:10px;padding:16px 18px;background:var(--bg,#f9fafb)}
.qv-step.off{opacity:.6}
.qv-step-n{flex:none;width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-weight:700;background:var(--accent,#0b5cad);color:#fff}
.qv-step.done .qv-step-n{background:#12b76a}
.qv-step-body{display:flex;flex-direction:column;gap:6px;min-width:0;flex:1}
.qv-drop{display:flex;align-items:center;gap:10px;margin-top:4px;padding:10px 12px;border:1.5px dashed var(--line,#d0d5dd);border-radius:8px;cursor:pointer;background:var(--card,#fff)}
.qv-drop:hover{border-color:var(--accent,#0b5cad)}
.qv-file-input{position:absolute;width:1px;height:1px;opacity:0;pointer-events:none}
.qv-fname{font-size:13px;color:var(--muted,#667085);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.qv-run{align-self:flex-start;margin-top:4px;padding:9px 20px;font-size:14px}
@media (max-width:900px){.qv-steps{grid-template-columns:1fr}.qv-hero-top{flex-direction:column}}

/* side by side: scroll together (qv_scroll_sync_v1, 24 Oct) */
.qv-sync{display:inline-flex;align-items:center;gap:6px;font-size:13px;white-space:nowrap;color:var(--fg,#344054);cursor:pointer;margin-right:4px}
.qv-sync input{width:15px;height:15px;accent-color:var(--accent,#0b5cad)}

/* grouped findings: step through every place (24 Oct) */
.qv-places{display:inline-flex;align-items:center;gap:4px;margin-left:8px;font-size:12.5px;font-weight:600}
.btn.xs{padding:1px 8px;font-size:12px;line-height:1.4}

/* 25 Oct (owner: Unified Review Page, flag unified_review_v1): the iXBRL document and the XBRL grid on one page */
.ur-wrap { flex: 1; min-height: 0; display: flex; flex-direction: column; --ur-doc: 50%; }
.ur-wrap.lr { flex-direction: row; }
.ur-doc { position: relative; flex: 0 0 var(--ur-doc); min-height: 0; min-width: 0; display: flex; flex-direction: column; border-bottom: 1px solid var(--line); background: var(--panel); }
.ur-wrap.lr .ur-doc { border-bottom: 0; border-right: 1px solid var(--line); }
.ur-div { flex: 0 0 6px; cursor: row-resize; background: var(--line-soft, #e5e7eb); touch-action: none; }
.ur-wrap.lr .ur-div { cursor: col-resize; }
.ur-div:hover, .ur-div:focus-visible, .ur-wrap.dragging .ur-div { background: var(--accent); outline: none; }
.ur-wrap.dragging iframe { pointer-events: none; }            /* the divider keeps the pointer while dragging over the document */
.ur-docbar { display: flex; align-items: center; gap: 8px; padding: 4px 10px; border-bottom: 1px solid var(--line-soft, #e5e7eb); font-size: 12px; flex-wrap: wrap; }
.ur-title { font-size: 12px; color: var(--ink-2, #374151); }
.ur-follow { display: inline-flex; align-items: center; gap: 4px; white-space: nowrap; font-size: 12px; padding: 0 6px; }
.ur-chips { position: absolute; left: 10px; bottom: 10px; z-index: 5; display: flex; gap: 6px; flex-wrap: wrap; max-width: calc(100% - 40px); pointer-events: none; }
.ur-chips > * { pointer-events: auto; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.ur-chip { display: inline-flex; align-items: center; gap: 4px; padding: 3px 10px; border-radius: 999px; background: #fff8e1; border: 1px solid #f0c36d; color: var(--ink, #111); font-size: 12px; }
.ur-chip .x { border: 0; background: none; cursor: pointer; color: var(--muted); font-size: 14px; line-height: 1; }
.ur-chip select { font-size: 12px; padding: 0 2px; }
.ur-frame { flex: 1; min-height: 0; display: flex; }
.ur-iframe { flex: 1; width: 100%; border: 0; background: #fff; }
.ur-wait { padding: 16px; }
.ur-seg button { min-width: 52px; }
.ur-back { margin-left: 4px; }
.ur-back.hidden { display: none; }
.ur-wrap > #main { flex: 1 1 0; min-height: 0; min-width: 0; }
.ur-wrap.ur-xbrl > .ur-doc, .ur-wrap.ur-xbrl > .ur-div { display: none; }
.ur-wrap.ur-ixbrl > #main, .ur-wrap.ur-ixbrl > .ur-div { display: none; }
.ur-wrap.ur-ixbrl > .ur-doc { flex: 1 1 auto; border: 0; }
/* 25 Oct (owner): Split shows neither the summary chips nor the run's name (it is in the trail above); the XBRL view keeps both */
html body.ur-mode-split .v-head .run-badge, html body.ur-mode-split .v-head .cmp-badge,
html body.ur-mode-ixbrl .v-head .run-badge, html body.ur-mode-ixbrl .v-head .cmp-badge { display: none !important; }   /* the iXBRL view too (owner, 26 Oct) */      /* 25 Oct (owner): the summary chips stay in the XBRL view; Split gives the room to the panes */
#gi table.gt tbody td.ur-cell { box-shadow: inset 0 0 0 2px #d32f2f !important; background: rgba(211,47,47,.06); }   /* the selected cell (owner, 25 Oct) */
table.gt tbody tr.focus.ur-cellrow td { box-shadow: none; }                                          /* …not its whole row */
.ur-ftab { padding: 8px 12px; }
.ur-fh { padding: 8px 12px; border-bottom: 1px solid var(--line-soft, #e5e7eb); }
.ur-fh .tabsbar { margin-top: 8px; }
.ur-dochits { display: flex; justify-content: space-between; align-items: center; }
body.ur-embed { --chrome-h: 0px; }
body.ur-embed .crumbs { display: none; }
body.ur-embed .ivx-bar { flex-wrap: nowrap; overflow-x: auto; scrollbar-width: thin; }   /* one line on the review page (owner, 25 Oct) */
body.ur-embed .ivx-bar > * { flex-shrink: 0; }
body.ur-embed .ivx-search input { width: 200px; }
/* 25 Oct (owner: "why the mouse curser always showing with question mark"): on the review page a value cell is clicked to
   select it (and its fact in the document) — a hand, not the "help" question mark changed cells had; the old Reviewer keeps it */
body.ur-on table.gt tbody td[data-e], body.ur-on table.gt tbody td[data-mk].M { cursor: pointer; }
/* 25 Oct (owner: "Remove the hidden in the iXBRL view. Since both are same"): the document's Data → Additional Items Only is it */
body.ur-mode-ixbrl .v-head #chips [data-tile="hidden"], body.ur-mode-ixbrl .v-head #chips [data-tile="calc"] { display: none; }   /* …and Calc errors (owner, 26 Oct) */
/* 26 Oct: the document pane takes the redesigned look, but not its padding and card frame — the document keeps the room */
html.ui2 body.ur-embed .ivx-main { padding: 0; gap: 0; }
html.ui2 body.ur-embed .ivx-doc { border: 0; border-radius: 0; box-shadow: none; }
html.ui2 body.ur-embed .ivx-left, html.ui2 body.ur-embed .ivx-right { border-radius: 0; box-shadow: none; }
/* 26 Oct (owner: "Is this option is needed in the iXBRL. If not, please remove it"): the chips that act on the grid (not on
   screen in the iXBRL view) are not shown there — the change counts (the document has its Changes filter), Untagged,
   Dimensional, Footnoted, Shared periods only, Not-comparable columns, the compared / sign-off status; Comments and Approved stay */
body.ur-mode-ixbrl .v-head #chips .hchip.grp, body.ur-mode-ixbrl .v-head #chips .hchip.toggle, body.ur-mode-ixbrl .v-head #chips .hchip.status,
body.ur-mode-ixbrl .v-head #chips [data-tile="untagged"], body.ur-mode-ixbrl .v-head #chips [data-tile="dimensional"],
body.ur-mode-ixbrl .v-head #chips [data-tile="footnoted"] { display: none; }
/* 26 Oct (owner: "Add comments and approval options here"): in Split and the iXBRL view the header is one line — the company
   details, then Comments and Approved (the other chips act on the grid and stay in the XBRL view) */
html body.ur-mode-split .v-head #chips > :not([data-tile="comments"]):not([data-tile="approved"]),
html body.ur-mode-ixbrl .v-head #chips > :not([data-tile="comments"]):not([data-tile="approved"]) { display: none !important; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id { flex-direction: row; align-items: center; gap: 14px; max-width: none; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id2, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id2 { display: flex; align-items: center; flex: none; }
/* …in one line, smaller (owner, 26 Oct: "If required reduce the font size and keep it in same line"); the company name gives
   way first (it is cut with … ), the details and the two chips keep their room */
html.ui2 body.ui2-viewer.ur-mode-split .v-id, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id { flex-wrap: nowrap; min-width: 0; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id1, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id1 { flex: 0 1 auto; min-width: 0; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id1 .co, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id1 .co { min-width: 60px; overflow: hidden; text-overflow: ellipsis; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id1 .hm, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id1 .hm { flex: none; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id2 .hchips, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id2 .hchips { display: flex; flex-wrap: nowrap; overflow: visible; gap: 5px; padding: 0; -webkit-mask-image: none; mask-image: none; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id2 .hchip, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id2 .hchip { font-size: 11px; padding: 2px 8px; line-height: 16px; white-space: nowrap; }
/* 26 Oct (owner: "Remove this", on the XBRL view): no view of the review page shows the run-name pill — the trail names the run */
html body.ur-on .v-head .run-badge, html body.ur-on .v-head .cmp-badge { display: none !important; }
/* 26 Oct (owner: "Remove this option", the XBRL view): the "N compared · status" chip is not shown on the review page (the
   sign-off status is in the Approved chip's hover text) */
html body.ur-on .v-head #chips .hchip.status { display: none !important; }
/* 26 Oct (owner: "minimize the font if required and keep it in the same line", the XBRL view): the chips in one row, 11 px;
   a window too narrow for all of them scrolls the row sideways instead of wrapping it */
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id { max-width: none; min-width: 0; flex: 1 1 auto; }
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id2 { display: flex; align-items: center; min-width: 0; }
/* 26 Oct (owner: "don't hide the content … reduce the font size if required"): every chip shown — no fade, no cut; the font
   steps down (11 → 9 px, unified.js fitChips) until the row fits */
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id2 .hchips { display: flex; flex-wrap: nowrap; overflow: hidden; gap: 4px; padding: 2px 0;
  -webkit-mask-image: none !important; mask-image: none !important; font-size: var(--ur-chip-fs, 11px); }
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id2 .hchip { font-size: inherit; padding: 2px 7px; line-height: 1.45; white-space: nowrap; flex: none; }
/* 26 Oct (owner: "Remove CIK in the split and IXBRL view"); the XBRL view keeps it */
body.ur-mode-split .v-head .v-id1 .hm.mono, body.ur-mode-ixbrl .v-head .v-id1 .hm.mono { display: none; }
/* 26 Oct (owner: "Split view in the left and right option. keep the roles commonly in the inline left layer"): side by side
   the grid has no Roles panel — the document's Sections (on its left) open the roles; top / bottom keeps the Roles panel */
.ur-wrap.lr.ur-split > #main > .v-nav { display: none !important; }
.ur-wrap.lr.ur-split > #main.v-main { grid-template-columns: minmax(0, 1fr) 330px !important; }
.ur-wrap.lr.ur-split > #main.v-main.right-off { grid-template-columns: minmax(0, 1fr) 24px !important; }
/* 26 Oct (owner: "Auto adjust and show the full name based on the space availablity in the all the three mode"): the company
   name takes the free width up to the buttons (no fixed cap); it is cut with … only when the window is too narrow; the
   details (form, period, taxonomy, CIK) are never cut */
html.ui2 body.ui2-viewer.ur-on .v-id { flex: 1 1 auto; max-width: none; min-width: 0; }
html.ui2 body.ui2-viewer.ur-on .v-id1 { flex: 0 1 auto; min-width: 0; }
html.ui2 body.ui2-viewer.ur-on .v-id1 .co { max-width: none; flex: 0 1 auto; min-width: 80px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
html.ui2 body.ui2-viewer.ur-on .v-id1 .hm { flex: none; }
/* 26 Oct: the hover card's grip bar — drag to move, Reset position, ✕ */
/* the card has no padding of its own: the grip bar is a full-width strip at its top, kept in view when a long card scrolls
   (26 Oct, owner: "fix this issue" — the bar was squeezed against the card's edge) */
#tip .tip-grip { position: sticky; top: 0; z-index: 2; display: flex; align-items: center; gap: 8px; margin: 0; min-height: 26px;
  padding: 4px 8px 4px 10px; border-bottom: 1px solid var(--line); background: var(--bg-soft, #f6f8fa); border-radius: 8px 8px 0 0;
  cursor: move; user-select: none; touch-action: none; font-size: 11.5px; color: var(--muted); }
#tip .tip-grip .tip-move { font-weight: 600; letter-spacing: .02em; }
#tip .tip-grip .tip-move::before { content: "\2807  Move"; white-space: pre; }
#tip .tip-grip .x::before { content: "\2715"; }
#tip .tip-grip .grow { flex: 1; }
#tip .tip-grip .x { border: 0; background: none; cursor: pointer; color: var(--muted); font-size: 14px; line-height: 1; padding: 2px 4px; border-radius: 4px; }
#tip .tip-grip .x:hover { background: var(--line); color: var(--ink, #111); }
#tip .tip-grip .tip-reset { font-size: 11.5px; }
#tip .tip-grip + .ch { border-radius: 0; }
/* 26 Oct (owner: "it should be auto adjusted and keep the left align with logo"): the company block starts right after the logo */
html.ui2 body.ui2-viewer.ur-on .v-id { align-items: flex-start; }
html.ui2 body.ui2-viewer.ur-mode-split .v-id, html.ui2 body.ui2-viewer.ur-mode-ixbrl .v-id { justify-content: flex-start; align-items: center; }
/* 26 Oct (owner: "Can you please add some better look background colour"): on the review page the grid area is a soft
   blue-grey with a faint dot pattern, and the table sits on it as a white card */
body.ur-on { --ur-canvas: #eef2f8; --ur-dot: rgba(23, 54, 93, .07); }
:root[data-theme="dark"] body.ur-on { --ur-canvas: #121a26; --ur-dot: rgba(255, 255, 255, .05); }
body.ur-on .grid-wrap { background-color: var(--ur-canvas); background-image: radial-gradient(var(--ur-dot) 1px, transparent 1px);
  background-size: 16px 16px; }
/* 26 Oct (owner: "Can you add some border … professional look borders with impressive look"): the table is a framed card — a
   crisp outline, a navy accent along its left edge and a soft layered shadow */
body.ur-on { --ur-frame: #c3cede; --ur-accent: #1f3b6e; }
:root[data-theme="dark"] body.ur-on { --ur-frame: #34445c; --ur-accent: #5b8def; }
body.ur-on .grid-wrap table.gt { background: var(--panel, #fff); margin: 10px 0 18px 4px;
  box-shadow: 0 0 0 1px var(--ur-frame), -4px 0 0 0 var(--ur-accent),
    0 4px 8px rgba(16, 24, 40, .08), 0 14px 30px rgba(16, 24, 40, .10); }   /* 27 Oct: navy on the right and bottom too */
body.ur-on .grid-wrap { padding-right: 12px; }
body.ur-on .grid-wrap table.gt { border-right: 3px solid var(--ur-accent); border-bottom: 3px solid var(--ur-accent); }   /* drawn, not clipped */
/* 26 Oct (owner: "Can you remove the numbers"): the Roles groups show no count on the review page */
body.ur-on #nav .grp .pill { display: none; }
/* 26 Oct (owner: "don't show this"): the review page shows no notes banner under the header — its warnings are listed in
   Results → Structure → Messages */
body.ur-on .v-head .v-notes { display: none !important; }
/* 26 Oct (owner: "move little up and fix this UI issue. the UI should be flexible and auto adjusted mode. It should not hide any
   content"): the identity block takes exactly the width left beside the buttons (never under them); the buttons never shrink and
   sit level with the company line; chips that cannot fit even at 9 px wrap to a second row instead of being cut */
html.ui2 body.ui2-viewer.ur-on .v-bar { align-items: flex-start; }
html.ui2 body.ui2-viewer.ur-on .v-bar > .brand { align-self: center; }
html.ui2 body.ui2-viewer.ur-on .v-id { flex: 1 1 0; min-width: 0; }
html.ui2 body.ui2-viewer.ur-on .v-bar > :not(.v-id):not(.grow) { flex-shrink: 0; }
html.ui2 body.ui2-viewer.ur-on .v-bar > .grow { flex: 0 0 8px; }
html.ui2 body.ui2-viewer.ur-on .v-bar > .seg, html.ui2 body.ui2-viewer.ur-on .v-bar > .cmp-btn, html.ui2 body.ui2-viewer.ur-on .v-bar > .iconbar { margin-top: 2px; }
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id2 .hchips.ur-chips-wrap { flex-wrap: wrap; overflow: visible; row-gap: 4px; }
/* the chip row is held to the identity block's width (left alignment made it as wide as its content, so the fitting never
   shrank or wrapped it) */
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id2 { align-self: stretch; min-width: 0; max-width: 100%; }
html.ui2 body.ui2-viewer.ur-mode-xbrl .v-id2 .hchips { min-width: 0; max-width: 100%; }
/* 26 Oct (owner: "comment filter and approvals should also work in the inline view"): the iXBRL view with Results open —
   the document, then the Results panel (Comments with its filters, the lines not approved …); no grid, no roles */
.ur-wrap.ur-ixbrl.ur-res { flex-direction: row; }
.ur-wrap.ur-ixbrl.ur-res > #main { display: grid !important; flex: 0 0 380px; grid-template-columns: minmax(0, 1fr) !important; border-left: 1px solid var(--line); }
.ur-wrap.ur-ixbrl.ur-res > #main > .v-nav, .ur-wrap.ur-ixbrl.ur-res > #main > .v-center { display: none !important; }
.ur-wrap.ur-ixbrl.ur-res > .ur-doc { flex: 1 1 auto; }
/* 26 Oct: the comment and approval counts in the document's toolbar — the iXBRL view and a popped-out window (Split: the header) */
body.ur-embed .ur-counts { display: none; gap: 6px; }
body.ur-embed[data-ur-mode="ixbrl"] .ur-counts, body.ur-embed[data-ur-mode="popout"] .ur-counts { display: inline-flex; }
body.ur-embed .ur-counts b { color: var(--accent); }
/* 27 Oct (owner: "Good UI design please"): the Fact tab's Details card — a navy header as the grid's, label / value rows with
   muted small-caps labels, the fact value emphasised, the XBRL ID in a code chip, quiet empty values */
body.ur-on { --ur-fd-head: #1f3b6e; --ur-fd-line: #e3e8f0; --ur-fd-stripe: #f7f9fc; --ur-fd-label: #5b6b82; --ur-fd-code: #eef2f8; }
:root[data-theme="dark"] body.ur-on { --ur-fd-head: #24406f; --ur-fd-line: #2c3a4f; --ur-fd-stripe: #18212e; --ur-fd-label: #9aa8bc; --ur-fd-code: #1c2636; }
.ur-fd { padding: 10px; }
.ur-fd-head { display: flex; align-items: center; gap: 8px; padding: 8px 10px; background: var(--ur-fd-head); color: #fff; border-radius: 10px 10px 0 0; }
.ur-fd-title { font-weight: 650; font-size: 13px; letter-spacing: .02em; }
.ur-fd-head .pill { font-size: 11px; }
.ur-fd-head .btn.sm { height: 24px; min-width: 24px; padding: 0 6px; border-radius: 6px; background: rgba(255,255,255,.12); border: 1px solid rgba(255,255,255,.25); color: #fff; }
.ur-fd-head .btn.sm:hover { background: rgba(255,255,255,.22); }
.ur-fd-pos { font-size: 11.5px; color: rgba(255,255,255,.85); white-space: nowrap; }
.ur-fd-t { width: 100%; border-collapse: separate; border-spacing: 0; font-size: 12.5px; background: var(--panel, #fff); border: 1px solid var(--ur-fd-line);
  border-top: 0; border-radius: 0 0 10px 10px; overflow: hidden; box-shadow: 0 1px 2px rgba(16,24,40,.05), 0 6px 16px rgba(16,24,40,.06); }
.ur-fd-t tr:nth-child(even) th, .ur-fd-t tr:nth-child(even) td { background: var(--ur-fd-stripe); }
.ur-fd-t th { width: 84px; text-align: left; font-weight: 600; font-size: 10.5px; letter-spacing: .06em; text-transform: uppercase; color: var(--ur-fd-label);
  padding: 9px 10px; vertical-align: top; border-top: 1px solid var(--ur-fd-line); white-space: nowrap; }
.ur-fd-t td { padding: 8px 10px; border-top: 1px solid var(--ur-fd-line); word-break: break-word; color: var(--ink, #111827); line-height: 1.45; }
.ur-fd-t tr:first-child th, .ur-fd-t tr:first-child td { border-top: 0; }
.ur-fd-t .ur-fd-val { font-weight: 650; font-size: 13.5px; font-variant-numeric: tabular-nums; }
.ur-fd-t .ur-fd-id { display: inline-block; max-width: 100%; padding: 2px 6px; border-radius: 6px; background: var(--ur-fd-code); font-size: 11.5px;
  word-break: break-all; color: var(--ink, #1f2937); }
.ur-fd-t .ur-fd-none { color: var(--muted); }
.ur-fd-t .ur-dim { color: var(--muted); font-size: 12px; margin-top: 3px; }
/* 27 Oct: the Results panel shows the open list only — its name is the title, no tab strip; ▾ switches */
body.ur-on #right .tabs { display: none; }
body.ur-on #right .ur-rsw { margin-left: 4px; }
.ur-rsw-menu { min-width: 160px; }
/* 27 Oct (round_picker_v1): the round title as a drop-down of every round */
.round-pick { font: inherit; font-size: 15px; font-weight: 700; padding: 3px 28px 3px 8px; border: 1px solid var(--line); border-radius: 8px;
  background-color: var(--panel); color: var(--ink, #111); cursor: pointer; max-width: 160px; }
.round-pick:hover, .round-pick:focus { border-color: var(--accent); outline: none; box-shadow: 0 0 0 3px rgba(26, 107, 208, .15); }
/* 27 Oct: the approval ticks on / off button in the document's toolbar */
body.ur-embed .ur-switch { display: inline-flex; align-items: center; gap: 8px; height: 32px; padding: 0 10px; border: 1px solid var(--line);
  border-radius: 8px; background: var(--panel); color: var(--ink, #1f2937); font: inherit; font-size: 12.5px; cursor: pointer; white-space: nowrap; flex-shrink: 0; }
body.ur-embed .ur-switch:hover { border-color: #9fb3cf; }
body.ur-embed .ur-switch:focus-visible { outline: 2px solid var(--accent); outline-offset: 2px; }
body.ur-embed .ur-sw-track { position: relative; width: 34px; height: 18px; border-radius: 999px; background: #c8ced8; transition: background .18s ease; }
body.ur-embed .ur-sw-knob { position: absolute; top: 2px; left: 2px; width: 14px; height: 14px; border-radius: 50%; background: #fff;
  box-shadow: 0 1px 2px rgba(16,24,40,.3); transition: transform .18s ease; }
body.ur-embed .ur-switch.on .ur-sw-track { background: #1a7f37; }
body.ur-embed .ur-switch.on .ur-sw-knob { transform: translateX(16px); }
body.ur-embed .ur-sw-state { min-width: 22px; font-weight: 600; font-size: 11.5px; color: var(--muted); }
body.ur-embed .ur-switch.on .ur-sw-state { color: #1a7f37; }
/* 27 Oct (comparisons_collapsed_v1): the Comparisons list as one line that opens */
.cmp-fold { padding: 12px 16px; margin-top: 18px; }
.cmp-fold > summary { cursor: pointer; display: flex; align-items: center; gap: 8px; font-size: 15px; list-style: none; }
.cmp-fold > summary::before { content: "\25B8"; color: var(--muted); transition: transform .15s ease; }
.cmp-fold[open] > summary::before { transform: rotate(90deg); }
.cmp-fold > summary::-webkit-details-marker { display: none; }
.cmp-fold[open] > .card { margin-top: 12px; }
/* 27 Oct (grid_fit_v1): the review grid without spare room — tighter cells, so more columns fit the pane */
body.ur-on.ur-fit table.gt tbody td { padding: 3px 6px; }
body.ur-on.ur-fit table.gt tbody td.v.has-ck { padding-right: 20px; }
body.ur-on.ur-fit table.gt thead th { padding-left: 6px; padding-right: 6px; }
/* 27 Oct (owner: "Minimize the lines and remove the unnecessary spaces and try to accommodate all the details instead of
   scroll it", fact_compact_v1): the Details card — tighter rows, a narrower label column, the XBRL ID in smaller code text */
body.ur-fd-compact .ur-fd { padding: 6px; }
body.ur-fd-compact .ur-fd-head { padding: 4px 8px; gap: 6px; }
body.ur-fd-compact .ur-fd-head .btn.sm { height: 20px; min-width: 20px; padding: 0 5px; }
body.ur-fd-compact .ur-fd-t { font-size: 12px; }
body.ur-fd-compact .ur-fd-t th { width: 58px; padding: 3px 6px 3px 8px; font-size: 9.5px; letter-spacing: .04em; line-height: 1.35; }
body.ur-fd-compact .ur-fd-t td { padding: 3px 8px 3px 4px; line-height: 1.3; }
body.ur-fd-compact .ur-fd-t .ur-fd-val { font-size: 12.5px; }
body.ur-fd-compact .ur-fd-t .ur-fd-id { display: inline; padding: 0 3px; font-size: 10.5px; word-break: break-all; border-radius: 4px; }