/* ==========================================================================
   Zentrum — the shared look of the amino.ph suite (AminOps redesign, adopted
   for Finamino 2026-10-03). Loaded AFTER styles.css: it re-points the
   --amino-* tokens every component already reads, so the whole app takes the
   new look without touching component CSS, and it adds dark mode by
   redefining the same tokens.

   Three materials: the SKY is the ground, GLASS floats on it (the header and
   its controls), PAPER holds everything you read (cards, tables, forms).
   Colour means something: series hues identify; green / amber / red mean
   good / watch / act. Nothing is tinted for decoration.
   ========================================================================== */

:root {
  /* Sky, paper, ink */
  --z-sky-1: #b3d3f0;
  --z-sky-2: #c6ddf3;
  --z-sky-3: #dde9f5;
  --z-sky-4: #eaf1f8;
  --z-accent: #2f6fae;
  --z-accent-soft: #e6effa;
  --z-good: #1f8f68;
  --z-good-bg: #e3f4ec;
  --z-warn: #b7791a;
  --z-warn-bg: #fbf1dc;
  --z-bad: #c2453c;
  --z-bad-bg: #fbe9e7;
  --z-glass: linear-gradient(147deg, rgba(255, 255, 255, .9), rgba(244, 249, 255, .62) 58%, rgba(255, 255, 255, .78));
  --z-glass-shadow: 0 16px 32px -18px rgba(16, 28, 42, .45), 0 2px 10px -5px rgba(16, 28, 42, .22),
    inset 0 1px 0 rgba(255, 255, 255, .98), inset 0 -1px 1px rgba(255, 255, 255, .6),
    inset 0 0 0 1px rgba(29, 43, 55, .07);
  --z-glass-ink: #1d2a37;
  --z-paper-shadow: 0 1px 0 rgba(255, 255, 255, .9) inset, 0 0 0 1px rgba(29, 43, 55, .07),
    0 20px 44px -34px rgba(16, 28, 42, .45);

  /* Chart series, fixed order — a series keeps its colour between charts. */
  --z-s1: #5b9bd6;
  --z-s2: #8574d8;
  --z-s3: #3f9e6f;
  --z-s4: #c79a4e;
  --z-s5: #cf6d96;
  --z-s6: #d9844a;
  --z-s7: #4fb3c4;
  --z-s8: #b5658f;
  --z-s9: #7aa84e;
  --z-s10: #c48a2f;
  --z-s11: #3f8f8f;
  --z-s12: #9a8fd0;
  --z-other: #9aa6b3;
  --z-line-ink: #1d2a37;

  /* The existing token names, re-pointed */
  --amino-ink: #16202c;
  --amino-paper: #ffffff;
  --amino-cream: #f5f8fc;
  --amino-n-50: #eef3f9;
  --amino-n-100: #e6edf5;
  --amino-n-200: #e2e9f2;
  --amino-n-300: #d7e2ee;
  --amino-n-400: #8294a8;
  --amino-n-500: #5f7186;
  --amino-n-600: #43556a;
  --amino-n-700: #2e3e50;
  --amino-n-800: #1d2a37;
  --amino-n-900: #121a24;
  --amino-bg: var(--z-sky-4);
  --amino-surface: var(--amino-paper);
  --amino-surface-sunk: var(--amino-n-50);
  --amino-border: var(--amino-n-200);
  --amino-text: var(--amino-ink);
  --amino-text-muted: var(--amino-n-500);
  --amino-text-invert: var(--amino-paper);
  --amino-success: var(--z-good);
  --amino-warning: var(--z-warn);
  --amino-danger: var(--z-bad);
  --amino-grad-spectrum: linear-gradient(110deg, var(--z-s1), var(--z-s2));

  --amino-font-display: "Bricolage Grotesque", "Trebuchet MS", system-ui, sans-serif;
  --amino-font-sans: "Public Sans", "Helvetica Neue", Arial, sans-serif;
  --z-font-mono: "JetBrains Mono", ui-monospace, Menlo, monospace;
  --amino-text-sm: 13px;
  --amino-text-base: 14px;
  --amino-text-lg: 16px;
  --amino-text-xl: 18px;
  --amino-text-2xl: 22px;
  --amino-text-3xl: 26px;
  --amino-text-4xl: 30px;
  --amino-text-5xl: 40px;

  --amino-radius-sm: 8px;
  --amino-radius-md: 12px;
  --amino-radius-lg: 18px;
  --amino-radius-xl: 22px;
  --amino-radius-2xl: 22px;

  --amino-shadow-md: var(--z-paper-shadow);
  --amino-shadow-lg: 0 24px 48px -24px rgba(16, 28, 42, .45), 0 0 0 1px rgba(29, 43, 55, .07);
  --amino-shadow-focus: 0 0 0 3px rgba(47, 111, 174, .35);
}

/* Dark: the same names, redefined. Followed when the device is dark and no
   choice was made, or when Dark is picked in the account menu. */
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --z-sky-1: #16324e; --z-sky-2: #132a41; --z-sky-3: #101f30; --z-sky-4: #0d1721;
    --z-accent: #8fbbe6; --z-accent-soft: #1d2c3e;
    --z-good: #5cc2ae; --z-good-bg: #16302a; --z-warn: #e0bd7a; --z-warn-bg: #33291a;
    --z-bad: #f08a80; --z-bad-bg: #3a1f1d;
    --z-glass: linear-gradient(147deg, rgba(255, 255, 255, .17), rgba(255, 255, 255, .06) 58%, rgba(255, 255, 255, .11));
    --z-glass-shadow: 0 18px 38px -20px rgba(0, 0, 0, .75), inset 0 1px 0 rgba(255, 255, 255, .34), inset 0 0 0 1px rgba(255, 255, 255, .15);
    --z-glass-ink: #eef4fb;
    --z-paper-shadow: 0 0 0 1px rgba(255, 255, 255, .07), 0 20px 44px -30px rgba(0, 0, 0, .75);
    --z-s1: #7cb3e6; --z-s2: #a596ea; --z-s3: #5cc28c; --z-s4: #dcb26a; --z-s5: #e48bb0; --z-s6: #eb9d68;
    --z-s7: #6ccadb; --z-s8: #cf82aa; --z-s9: #97c46a; --z-s10: #dba54c; --z-s11: #5cb0b0; --z-s12: #b6acea;
    --z-other: #7d8b9b; --z-line-ink: #e9eff6;
    --amino-ink: #e9eff6; --amino-paper: #171f29; --amino-cream: #0f151d;
    --amino-n-50: #1b2531; --amino-n-100: #202c3a; --amino-n-200: #26364a; --amino-n-300: #2b3d55;
    --amino-n-400: #7d8b9b; --amino-n-500: #9aa8b8; --amino-n-600: #b7c4d2; --amino-n-700: #cbd5e0;
    --amino-n-800: #dde5ee; --amino-n-900: #eef3f8;
    --amino-shadow-lg: 0 24px 48px -24px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .08);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --z-sky-1: #16324e; --z-sky-2: #132a41; --z-sky-3: #101f30; --z-sky-4: #0d1721;
  --z-accent: #8fbbe6; --z-accent-soft: #1d2c3e;
  --z-good: #5cc2ae; --z-good-bg: #16302a; --z-warn: #e0bd7a; --z-warn-bg: #33291a;
  --z-bad: #f08a80; --z-bad-bg: #3a1f1d;
  --z-glass: linear-gradient(147deg, rgba(255, 255, 255, .17), rgba(255, 255, 255, .06) 58%, rgba(255, 255, 255, .11));
  --z-glass-shadow: 0 18px 38px -20px rgba(0, 0, 0, .75), inset 0 1px 0 rgba(255, 255, 255, .34), inset 0 0 0 1px rgba(255, 255, 255, .15);
  --z-glass-ink: #eef4fb;
  --z-paper-shadow: 0 0 0 1px rgba(255, 255, 255, .07), 0 20px 44px -30px rgba(0, 0, 0, .75);
  --z-s1: #7cb3e6; --z-s2: #a596ea; --z-s3: #5cc28c; --z-s4: #dcb26a; --z-s5: #e48bb0; --z-s6: #eb9d68;
  --z-s7: #6ccadb; --z-s8: #cf82aa; --z-s9: #97c46a; --z-s10: #dba54c; --z-s11: #5cb0b0; --z-s12: #b6acea;
  --z-other: #7d8b9b; --z-line-ink: #e9eff6;
  --amino-ink: #e9eff6; --amino-paper: #171f29; --amino-cream: #0f151d;
  --amino-n-50: #1b2531; --amino-n-100: #202c3a; --amino-n-200: #26364a; --amino-n-300: #2b3d55;
  --amino-n-400: #7d8b9b; --amino-n-500: #9aa8b8; --amino-n-600: #b7c4d2; --amino-n-700: #cbd5e0;
  --amino-n-800: #dde5ee; --amino-n-900: #eef3f8;
  --amino-shadow-lg: 0 24px 48px -24px rgba(0, 0, 0, .8), 0 0 0 1px rgba(255, 255, 255, .08);
  color-scheme: dark;
}

/* ---------- Ground ---------- */
html { background: var(--z-sky-4); }
body {
  background: linear-gradient(178deg, var(--z-sky-1) 0, var(--z-sky-2) 260px, var(--z-sky-3) 620px, var(--z-sky-4) 1100px, var(--z-sky-4));
  background-attachment: scroll;
  min-height: 100vh;
  line-height: 1.5;
}
h1, h2, h3 { font-family: var(--amino-font-display); font-weight: 650; letter-spacing: -0.02em; text-wrap: balance; }
.amino-display { font-weight: 650; }
table, .num, .statement td, .records td { font-variant-numeric: tabular-nums; }
:focus-visible { outline: 2px solid var(--z-accent); outline-offset: 2px; }

/* ---------- Shell: glass header over the sky, one reading column ---------- */
.app { display: block; min-height: 100vh; padding-top: 12px; }
.sidebar, .mobile-topbar, .sidebar-overlay { display: none !important; }

.z-top {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 60;
  max-width: 1180px;
  margin: 0 auto;
  padding: 0 16px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.z-bar, .z-subtabs {
  background: var(--z-glass);
  -webkit-backdrop-filter: blur(20px) saturate(180%);
  backdrop-filter: blur(20px) saturate(180%);
  box-shadow: var(--z-glass-shadow);
  color: var(--z-glass-ink);
}
.z-bar {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 7px 8px 7px 10px;
  border-radius: 22px;
  min-width: 0;
}
.z-brand {
  appearance: none;
  border: 0;
  background: transparent;
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 4px 8px 4px 2px;
  cursor: pointer;
  color: var(--z-glass-ink);
  font-family: var(--amino-font-display);
  font-weight: 700;
  font-size: 17px;
  letter-spacing: -0.02em;
  flex: none;
}
.z-brand img { height: 24px; width: auto; display: block; }
:root[data-theme="dark"] .z-brand img { filter: invert(1); }
@media (prefers-color-scheme: dark) { :root:not([data-theme="light"]) .z-brand img { filter: invert(1); } }
.z-groups {
  display: flex;
  gap: 2px;
  flex: 1;
  min-width: 0;
  overflow-x: auto;
  scrollbar-width: none;
}
.z-groups::-webkit-scrollbar { display: none; }
.z-groups button, .z-subtabs button {
  appearance: none;
  border: 0;
  background: transparent;
  color: var(--z-glass-ink);
  font: inherit;
  font-size: 13.5px;
  font-weight: 500;
  padding: 8px 13px;
  border-radius: 12px;
  cursor: pointer;
  white-space: nowrap;
  opacity: .78;
  transition: background .2s, opacity .2s;
}
.z-groups button:hover, .z-subtabs button:hover { opacity: 1; }
/* The open one stops being glass: it becomes the paper face of the page. */
.z-groups button[aria-current="page"], .z-subtabs button[aria-current="page"] {
  background: var(--amino-surface);
  color: var(--amino-text);
  opacity: 1;
  box-shadow: 0 0 0 1px var(--amino-border);
}
.z-tools { display: flex; align-items: center; gap: 8px; flex: none; }
.z-attn {
  appearance: none;
  border: 0;
  border-radius: 999px;
  padding: 6px 12px;
  background: var(--z-warn-bg);
  color: var(--z-warn);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
  white-space: nowrap;
}
.z-save { font-size: 12px; font-weight: 600; padding: 5px 10px; border-radius: 999px; background: var(--amino-n-100); color: var(--amino-text-muted); white-space: nowrap; }
.z-save.failed { background: var(--z-bad-bg); color: var(--z-bad); }
.z-years { display: flex; gap: 2px; background: var(--amino-n-100); border-radius: 12px; padding: 2px; }
.z-years button {
  appearance: none; border: 0; background: transparent; color: var(--amino-text-muted);
  font: inherit; font-size: 12px; font-weight: 600; padding: 4px 9px; border-radius: 10px; cursor: pointer;
}
.z-years button[aria-pressed="true"] { background: var(--amino-surface); color: var(--amino-text); }
.z-account-btn {
  appearance: none;
  border: 0;
  width: 34px;
  height: 34px;
  border-radius: 50%;
  background: var(--amino-ink);
  color: var(--amino-paper);
  font: inherit;
  font-weight: 700;
  font-size: 13px;
  cursor: pointer;
  flex: none;
}
.z-subtabs {
  display: flex;
  gap: 2px;
  padding: 5px;
  border-radius: 16px;
  align-self: flex-start;
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: none;
}
.z-scrim { position: fixed; inset: 0; z-index: 70; }
.z-menu {
  position: fixed;
  z-index: 80;
  top: calc(env(safe-area-inset-top, 0px) + 66px);
  right: max(16px, calc((100vw - 1180px) / 2 + 16px));
  width: min(320px, calc(100vw - 32px));
  background: var(--amino-surface);
  color: var(--amino-text);
  border-radius: 18px;
  box-shadow: var(--amino-shadow-lg);
  padding: 16px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  font-size: 13px;
}
.z-menu-who { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.z-menu-who strong { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.z-menu-note { font-size: 12px; margin: 0; }
.z-menu-row { display: flex; align-items: center; justify-content: space-between; gap: 10px; }
.z-menu-data { font-size: 12px; line-height: 1.5; }
.z-menu .period-toggle { margin: 0; }

.main {
  max-width: 1180px;
  margin: 0 auto;
  padding: 28px 16px calc(64px + env(safe-area-inset-bottom, 0px));
}

/* ---------- Page header ---------- */
.view-head { margin-bottom: 24px; }
.view-head .eyebrow { font-size: 10px; letter-spacing: .09em; color: var(--amino-n-400); }
.view-head h1 { font-size: var(--amino-text-4xl); line-height: 1.15; }
.view-head .lede { font-size: 13.5px; color: var(--amino-n-600); }

/* ---------- Paper ---------- */
.card {
  border: 0;
  border-radius: 22px;
  padding: 22px;
  box-shadow: var(--z-paper-shadow);
}
.card.sunk { box-shadow: none; }
.grid { gap: 14px; }

/* ---------- Controls ---------- */
input, select, textarea {
  border-radius: 12px;
  background: var(--amino-surface);
  color: var(--amino-text);
  border-color: var(--amino-border);
}
.btn { border-radius: 12px; }
.btn.ghost { color: var(--amino-text); border-color: var(--amino-border); }
.pill { border-radius: 8px; font-size: 11.5px; padding: 3px 9px; }
.pill.ok { background: var(--z-good-bg); color: var(--z-good); }
.pill.warn { background: var(--z-warn-bg); color: var(--z-warn); }
.statement td.credit { color: var(--z-accent); }
.chart-tip .tip-val.up, .chart-tip .tip-val.new { color: var(--z-good); }
.chart-tip .tip-val.down { color: var(--z-bad); }

/* ---------- Flags: quieter, toned, one line ----------
   A flag is for something someone can act on. It reads as a tinted strip with
   a tone dot, not a shouting banner; "info" and "quiet" fall back to a grey
   note so they stop competing with the numbers. */
.flag {
  border: 0;
  border-radius: 14px;
  padding: 10px 14px;
  font-weight: 500;
  font-size: 13px;
  background: var(--z-warn-bg);
  color: var(--amino-text);
}
.flag::before {
  content: "";
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--z-warn);
  flex: none;
}
.flag > span:first-child:empty { display: none; }
.flag.ok { background: var(--z-good-bg); border: 0; }
.flag.ok::before { background: var(--z-good); }
.flag.bad { background: var(--z-bad-bg); border: 0; }
.flag.bad::before { background: var(--z-bad); }
.flag.info { background: var(--amino-n-50); border: 0; color: var(--amino-text-muted); }
.flag.info::before { background: var(--amino-n-400); }
.flag.quiet { font-style: normal; color: var(--amino-text-muted); background: transparent; padding: 4px 0; }
.flag.quiet::before { background: var(--amino-n-300); }

/* ---------- Phone ---------- */
/* ---------- Overview (dashboard) ---------- */
.z-dash { display: flex; flex-direction: column; gap: 16px; }
.z-dash > .card { margin-top: 0 !important; }
.z-dash .eyebrow, .z-card-head .eyebrow { font-size: 10.5px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--amino-text-muted); }
.z-dash .view-head { margin-bottom: 0; }

.z-scope { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.z-chips { display: flex; flex-wrap: wrap; gap: 6px; }
.z-chip, .z-seg button {
  display: inline-flex; align-items: center; gap: 7px;
  border: 0; border-radius: 999px; padding: 7px 13px;
  background: var(--z-glass); box-shadow: var(--z-glass-shadow); color: var(--z-glass-ink);
  font: 500 13px/1 var(--amino-font-sans); cursor: pointer;
}
.z-chip[aria-pressed="true"], .z-seg button[aria-pressed="true"] { background: var(--z-glass-ink); color: var(--amino-paper); box-shadow: none; }
.z-chip .dot, .z-rank-name .dot { width: 8px; height: 8px; border-radius: 50%; flex: none; }
.z-month {
  margin-left: auto; display: flex; align-items: center; gap: 2px; padding: 3px;
  border-radius: 999px; background: var(--z-glass); box-shadow: var(--z-glass-shadow);
}
.z-month button { border: 0; background: transparent; color: var(--z-glass-ink); width: 30px; height: 30px; border-radius: 50%; font-size: 18px; line-height: 1; cursor: pointer; }
.z-month button:hover:not(:disabled) { background: rgba(127, 140, 155, .14); }
.z-month button:disabled { opacity: .3; cursor: default; }
.z-month select {
  appearance: none; -webkit-appearance: none; border: 0; background: transparent; box-shadow: none;
  color: var(--z-glass-ink); font: 600 14px/1 var(--amino-font-sans); padding: 6px 4px; min-width: 9.5em; text-align: center; text-align-last: center; cursor: pointer;
}
.z-month select:focus { box-shadow: none; }

.z-headline { font: 500 clamp(18px, 2.2vw, 22px)/1.4 var(--amino-font-display); letter-spacing: -.01em; margin: 2px 0 0; max-width: 62ch; text-wrap: pretty; }
.z-headline strong { font-weight: 700; }

.z-heroes { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.z-hero { position: relative; background: var(--amino-surface); border-radius: var(--amino-radius-lg, 16px); box-shadow: var(--z-paper-shadow); padding: 16px 16px 12px; display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.z-hero .viz-toggle { position: absolute; top: 10px; right: 10px; }
.z-fig { font: 650 26px/1.1 var(--amino-font-display); letter-spacing: -.02em; font-variant-numeric: tabular-nums; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.z-hero-row { display: flex; flex-wrap: wrap; align-items: center; gap: 4px 8px; font-size: 12.5px; color: var(--amino-text-muted); }
.z-spark { width: 100%; height: 30px; display: block; margin-top: 2px; }

.z-card { display: flex; flex-direction: column; gap: 14px; }
.z-card-head { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px 16px; }
.z-card-head h2 { font-size: 20px; margin: 2px 0 4px; }
.z-card-head p { margin: 0; max-width: 70ch; font-size: 13.5px; }
.z-seg { display: inline-flex; gap: 4px; }

.z-pl td:first-child, .z-pl th:first-child { text-align: left; }
.z-pl tr.child td.rowlabel { padding-left: var(--amino-space-5); }
.z-term { display: block; font-size: 11.5px; font-weight: 400; color: var(--amino-text-muted); }
.z-per { color: var(--amino-text-muted); }

/* Plain meanings: a dotted underline on the word, a small card on hover, focus or tap. */
.z-meaning { all: unset; cursor: help; text-decoration: underline dotted; text-decoration-color: color-mix(in srgb, currentColor 45%, transparent); text-underline-offset: 3px; border-radius: 3px; }
.z-meaning:focus-visible { outline: 2px solid var(--z-accent); outline-offset: 2px; }
.z-meaning-pop { position: fixed; z-index: 60; width: min(280px, calc(100vw - 32px)); box-sizing: border-box; padding: 10px 12px; border-radius: 10px;
  background: var(--amino-surface, #fff); color: var(--amino-text, #1d2a37); box-shadow: var(--z-glass-shadow); border: 1px solid var(--amino-border);
  font-size: 13px; font-weight: 400; line-height: 1.45; text-align: left; text-transform: none; letter-spacing: normal; white-space: normal; }
.z-meaning-pop.above { transform: translateY(-100%); }
.z-meaning-pop strong { display: block; font-size: 12.5px; margin-bottom: 3px; }
.z-note { font-size: 13px; color: var(--amino-text-muted); margin: 0; max-width: 90ch; }

.z-more { border-top: 1px solid var(--amino-border); padding-top: 10px; }
.z-more > summary { cursor: pointer; font-weight: 600; font-size: 13.5px; color: var(--z-accent); list-style: none; }
.z-more > summary::-webkit-details-marker { display: none; }
.z-more > summary::before { content: "▸"; display: inline-block; width: 1.1em; transition: transform .15s; }
.z-more[open] > summary::before { transform: rotate(90deg); }
.z-more[open] > summary { margin-bottom: 12px; }
.z-more .card { box-shadow: none; background: transparent; padding: 0; margin-top: 0 !important; }

.z-split { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.15fr); gap: 24px; align-items: start; }
.z-rank { display: flex; flex-direction: column; gap: 12px; }
.z-rank-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 4px 12px; align-items: center; }
.z-rank-name { display: flex; align-items: center; gap: 8px; font-weight: 500; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.z-rank-val { display: flex; align-items: center; gap: 8px; font-variant-numeric: tabular-nums; }
.z-share { min-width: 3em; text-align: right; color: var(--amino-text-muted); font-size: 12.5px; }
.z-track { grid-column: 1 / -1; height: 6px; border-radius: 3px; background: var(--amino-surface-sunk); overflow: hidden; }
.z-track i { display: block; height: 100%; border-radius: 3px; }
.z-insights { list-style: none; padding: 0; margin: 16px 0 0; display: flex; flex-direction: column; gap: 8px; font-size: 13.5px; }
.z-insights li { display: flex; gap: 8px; align-items: baseline; }
.z-insights .tone { width: 8px; height: 8px; border-radius: 50%; flex: none; transform: translateY(-1px); }
.z-chart { width: 100%; height: auto; display: block; overflow: visible; }

.z-status { display: flex; gap: 12px; align-items: center; padding: 12px 14px; border-radius: 12px; background: var(--amino-surface-sunk); }
.z-status .mark { width: 30px; height: 30px; border-radius: 50%; display: grid; place-items: center; font-weight: 700; flex: none; color: #fff; background: var(--z-other); }
.z-status.ok { background: var(--z-good-bg); } .z-status.ok .mark { background: var(--z-good); }
.z-status.off { background: var(--z-warn-bg); } .z-status.off .mark { background: var(--z-warn); }
.z-status .say { font-weight: 600; }
.z-status .sub { font-size: 12.5px; color: var(--amino-text-muted); }

@media (max-width: 980px) {
  .z-heroes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .z-split { grid-template-columns: minmax(0, 1fr); }
}

@media (max-width: 760px) {
  .z-month { margin-left: 0; }
  .z-fig { font-size: 22px; }
  .z-heroes { gap: 8px; }
  .z-hero { padding: 12px; }
  .app { padding-top: 8px; }
  table.records { display: block; overflow-x: auto; }
  /* Phones: the header scrolls away with the page instead of pinning the
     menu and the sub-tabs over half the screen. */
  .z-top { padding: 0 10px; position: relative; top: auto; }
  .z-bar { flex-wrap: wrap; row-gap: 6px; }
  .z-groups { order: 3; flex-basis: 100%; }
  .z-tools { margin-left: auto; }
  .z-brand span { display: none; }
  .main { padding: 20px 16px calc(64px + env(safe-area-inset-bottom, 0px)); }
  .card { padding: 16px; border-radius: 18px; }
  .z-menu { top: calc(env(safe-area-inset-top, 0px) + 110px); }
}

@media (prefers-reduced-motion: reduce) {
  .z-groups button, .z-subtabs button { transition: none; }
}

/* A Record row in a closed month: its ✎ and × give way to this. */
.closed-badge { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; color: var(--amino-text-muted); white-space: nowrap; }

/* Outlook: the survival answer, its bar, and the target pace. */
.plan-inline-group { display: flex; flex-wrap: wrap; gap: 8px 16px; align-items: center; }
.z-answer { border-radius: 14px; padding: 16px 18px; border: 1px solid transparent; }
.z-answer.good { background: var(--z-good-bg); border-color: color-mix(in srgb, var(--z-good) 30%, transparent); }
.z-answer.warn { background: var(--z-warn-bg); border-color: color-mix(in srgb, var(--z-warn) 30%, transparent); }
.z-answer.bad { background: var(--z-bad-bg); border-color: color-mix(in srgb, var(--z-bad) 30%, transparent); }
.z-answer-big { font-size: clamp(20px, 3.2vw, 28px); font-weight: 700; line-height: 1.25; }
.z-answer.good .z-answer-big { color: var(--z-good); }
.z-answer.warn .z-answer-big { color: var(--z-warn); }
.z-answer.bad .z-answer-big { color: var(--z-bad); }
.z-answer-sub, .z-answer-runway { margin-top: 6px; font-size: 14px; color: var(--amino-text); }
.z-answer-runway { color: var(--amino-text-muted); }

.z-survival-bar { position: relative; display: flex; height: 22px; border-radius: 6px; background: var(--amino-surface-sunk); overflow: hidden; }
.z-survival-bar .seg { height: 100%; }
.z-survival .staff { --c: var(--z-s6); }
.z-survival .bills { --c: var(--z-s2); }
.z-survival .restock { --c: var(--z-s4); }
.z-survival .floor { --c: var(--z-other); }
.z-survival .cushion { --c: var(--z-good); }
.z-survival .cash { --c: transparent; }
.z-survival .short { --c: var(--z-bad); }
.z-survival-bar .seg { background: var(--c); }
.z-survival-cash { position: absolute; top: -2px; bottom: -2px; width: 2px; margin-left: -1px; background: var(--amino-text); }
.z-survival-short { position: absolute; top: 0; bottom: 0; background: repeating-linear-gradient(135deg, color-mix(in srgb, var(--z-bad) 55%, transparent) 0 4px, transparent 4px 8px); }
.z-survival-steps { list-style: none; margin: 10px 0 0; padding: 0; display: grid; gap: 4px; font-size: 13.5px; }
.z-survival-steps li { display: grid; grid-template-columns: 12px 1fr auto; gap: 8px; align-items: center; }
.z-survival-steps li .key { width: 10px; height: 10px; border-radius: 3px; background: var(--c); }
.z-survival-steps li.cash .key { background: none; border-left: 2px solid var(--amino-text); border-radius: 0; }
.z-survival-steps li.cushion, .z-survival-steps li.short { border-top: 1px solid var(--amino-border); padding-top: 4px; font-weight: 600; }
.z-survival-steps li.short strong { color: var(--z-bad); }

.target-hero .progress.split .pace-mark { position: absolute; top: -3px; bottom: -3px; width: 2px; margin-left: -1px; background: var(--amino-text); }
.z-pace { margin-top: 6px; font-size: 13.5px; }
.z-pace.ahead { color: var(--z-good); }
.z-pace.behind { color: var(--z-warn); }
.z-pace .muted { display: block; font-size: 12px; margin-top: 2px; }
.analysis-head > div > .eyebrow { font-size: 10.5px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--amino-text-muted); }
.analysis-head > div > h2 { font-size: 20px; margin: 2px 0 0; }

/* Shareholders: one card per person, the distribution table, the safe-to-pay steps. */
.z-people { display: grid; grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap: 12px; }
.z-person { border-radius: 12px; padding: 12px 14px; background: var(--amino-surface-sunk); border-top: 3px solid var(--c, var(--z-accent)); }
.z-person .eyebrow { font-size: 10.5px; font-weight: 600; letter-spacing: .09em; text-transform: uppercase; color: var(--amino-text-muted); }
.z-person .z-fig { font-size: 24px; font-weight: 700; margin: 4px 0 2px; }
.z-person .muted { font-size: 12.5px; }
.z-dist td:first-child, .z-dist th:first-child { text-align: left; }
.z-safe-steps .staff { --c: var(--z-s6); }
.z-safe-steps .bills { --c: var(--z-s2); }
.z-safe-steps .restock { --c: var(--z-s4); }
.z-safe-steps .aheadRestock { --c: color-mix(in srgb, var(--z-s4) 55%, transparent); }
.z-safe-steps .aheadBills { --c: color-mix(in srgb, var(--z-s2) 55%, transparent); }
.z-safe-steps .between { --c: var(--z-s3); }
.z-safe-steps .floor, .z-safe-steps .reserve, .z-safe-steps .tax { --c: var(--z-other); }
.z-safe-steps .cushion { --c: var(--z-good); }
.z-safe-steps .short { --c: var(--z-bad); }
.z-safe-steps .retained { --c: var(--z-accent); color: var(--amino-text-muted); }

/* Dashboard health checks. */
.z-health { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 14px; }
.z-health-item { border-radius: 12px; padding: 14px 16px; background: var(--amino-surface-sunk); }
.z-health-item h3 { font-size: 13px; font-weight: 600; margin: 0 0 6px; color: var(--amino-text-muted); text-transform: uppercase; letter-spacing: .06em; }
.z-health-item p { margin: 6px 0 0; font-size: 13.5px; }
.z-health-item#health-vial { grid-column: 1 / -1; }
.z-health-big { font-size: 20px; font-weight: 700; line-height: 1.25; }
.z-health-big.good { color: var(--z-good); }
.z-health-big.warn { color: var(--z-warn); }
.z-health-big.bad { color: var(--z-bad); }
.z-health-steps { list-style: none; margin: 8px 0 0; padding: 0; display: grid; gap: 4px; font-size: 13.5px; }
.z-health-steps li { display: flex; justify-content: space-between; gap: 12px; }
.z-health-steps li.total { border-top: 1px solid var(--amino-border); padding-top: 4px; font-weight: 600; }
.z-health-steps li.warn strong { color: var(--z-warn); }

/* Monthly summary: one printable page (Shareholders > Monthly summary). */
.z-summary section { margin-top: 18px; }
.z-summary h3 { font-size: 13px; text-transform: uppercase; letter-spacing: .06em; color: var(--amino-text-muted); margin: 0 0 6px; }
.z-summary p { margin: 6px 0 0; font-size: 13.5px; line-height: 1.5; }
.z-summary-flags { margin: 6px 0 0; padding-left: 18px; font-size: 13.5px; display: grid; gap: 4px; }
@media print {
  .z-top, .no-print, .save-state, .toast, .z-scrim, .z-menu { display: none !important; }
  .app, .main { padding: 0 !important; margin: 0 !important; background: #fff !important; }
  .z-summary { box-shadow: none !important; border: none !important; color: #000; }
  .z-summary section { break-inside: avoid; }
}

/* Analysis (Zentrum redesign): insight line, ranked bars, split bar. */
.z-insight { margin: 4px 0 14px; font-size: 14.5px; line-height: 1.5; color: var(--amino-text); max-width: 80ch; }
.z-chart-label { margin: 14px 0 0; font-size: 12px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--amino-text-muted); }
.z-rank { list-style: none; margin: 6px 0 0; padding: 0; display: grid; gap: 4px; }
.z-rank-row { all: unset; box-sizing: border-box; width: 100%; display: grid; grid-template-columns: minmax(120px, 1.2fr) 2fr minmax(180px, auto); gap: 12px; align-items: center; padding: 6px 4px; border-radius: 8px; font-size: 13.5px; }
button.z-rank-row { cursor: pointer; }
button.z-rank-row:hover, button.z-rank-row:focus-visible { background: var(--amino-n-50, rgba(0,0,0,.03)); outline: none; }
.z-rank-label { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.z-rank-track { height: 10px; border-radius: 999px; background: var(--amino-n-100); overflow: hidden; }
.z-rank-fill { display: block; height: 100%; border-radius: 999px; }
.z-rank-figs { text-align: right; font-variant-numeric: tabular-nums; white-space: nowrap; }
.z-rank li.warn .z-rank-label { color: var(--z-warn); font-weight: 600; }
.z-rank-detail { padding: 4px 8px 10px 16px; }
.z-rank-detail .analysis-table.compact td { padding: 4px 8px; font-size: 13px; }
@media (max-width: 640px) {
  .z-rank-row { grid-template-columns: 1fr auto; }
  .z-rank-track { grid-column: 1 / -1; order: 3; }
}
.z-split-bar { display: flex; height: 18px; border-radius: 999px; overflow: hidden; background: var(--amino-n-100); }
.z-split-bar span { display: block; height: 100%; }
.z-split-legend { list-style: none; margin: 10px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 18px; font-size: 13px; }
.z-split-legend li { display: flex; align-items: center; gap: 6px; }
.z-isolate .legend-item { all: unset; cursor: pointer; display: inline-flex; flex-direction: column; padding: 4px 8px; border-radius: 8px; }
.z-isolate .legend-item:hover, .z-isolate .legend-item:focus-visible { background: var(--amino-n-100); }
.z-isolate .legend-item.on { background: var(--amino-n-100); }
.z-isolate .legend-item.dim { opacity: .45; }
.mom-table .analysis-table { margin-top: 0; }

/* Settings rows: the setting, one line on what it changes, the control. */
.z-setting { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 16px; align-items: center; padding: 12px 0; border-top: 1px solid var(--amino-border); }
.z-card-head + .z-setting { border-top: 0; }
.z-setting label { font-weight: 600; font-size: 14px; }
.z-setting p { margin: 2px 0 0; font-size: 13px; max-width: 64ch; }
.z-setting select { min-width: 200px; }
.z-pct-input { display: inline-flex; align-items: center; gap: 6px; }
.z-pct-input input { width: 88px; text-align: right; }
.z-pct-input.bad input { border-color: var(--z-bad); }
@media (max-width: 640px) { .z-setting { grid-template-columns: 1fr; } }
.z-config-what { margin: 2px 0 0; font-size: 12.5px; }
.z-history-day { margin-top: 14px; }
.z-history-day h3.eyebrow { margin: 0 0 6px; }
.z-history-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; font-size: 13.5px; }
.z-history-list li { display: grid; grid-template-columns: 72px minmax(0, 1fr) auto; gap: 10px; align-items: start; }
.z-history-list li.undone > span:nth-child(2) { color: var(--amino-text-muted); }
.z-history-undo { padding: 2px 10px; }
.z-history-time { font-variant-numeric: tabular-nums; }

/* Brand colours and expense groups in Config (2026-10-03) */
.z-swatch { width: 14px; height: 14px; border-radius: 4px; display: inline-block; flex: none; box-shadow: inset 0 0 0 1px rgba(0,0,0,.12); }
.z-brand-colors li { align-items: center; }
.z-brand-colors input[type="color"] { width: 36px; height: 26px; padding: 0 2px; border-radius: 6px; border: 1px solid var(--amino-border, rgba(0,0,0,.15)); background: transparent; cursor: pointer; }
div.z-groups { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: var(--amino-space-4, 16px); }
.z-group h3 { margin: 0 0 2px; font-size: 14px; }
.z-group > p { font-size: 12.5px; margin: 0 0 8px; }
.z-group ul { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; }
.z-group li { display: grid; grid-template-columns: minmax(0, 1fr) 118px; gap: 8px; align-items: center; font-size: 13.5px; }
.z-group li select { width: 100%; }
.z-chip .z-swatch { width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 0; }
.z-swatch-dot { width: 9px; height: 9px; border-radius: 50%; margin-right: 6px; vertical-align: 1px; }

/* polish: attention — the Needs attention panel and the Dashboard's one line */
.z-attn.bad { background: var(--z-bad-bg); color: var(--z-bad); }
.attn-panel { display: grid; gap: var(--amino-space-5); }
.attn-panel .restate.in-panel { border: 0; background: none; box-shadow: none; padding: 0; margin: 0; }
.attn-panel .restate.in-panel .restate-head { font-size: 14px; }
.attn-panel .restate-row { flex-wrap: wrap; row-gap: 6px; }
.attn-error { margin: 0; padding: 10px 12px; border-radius: 10px; background: var(--z-bad-bg); color: var(--z-bad); font-size: 13px; }
.attn-line {
  display: flex; align-items: center; gap: 10px;
  padding: 8px 12px; margin: 0 0 var(--amino-space-5);
  border-radius: 10px; font-size: 13px;
  background: var(--z-bad-bg); color: var(--z-bad);
}
.attn-line > span:nth-child(2) { flex: 1; min-width: 0; }
.attn-line .btn { flex: none; }
/* polish: analysis-outlook */
/* A row's second word (actual / now / the total's months) sits beside the
   month on desktop and under it on a phone, so the pinned column stays narrow. */
.z-row-tag { margin-left: 6px; font-size: 12px; }
@media (max-width: 640px) {
  .z-row-tag { display: block; margin-left: 0; font-size: 11px; line-height: 1.3; }
  .analysis-section .statement th, .analysis-section .statement td { padding: 9px 10px; font-size: 13px; }
  .analysis-section .statement thead th { font-size: 11px; }
  #sec-ar .statement td:first-child { min-width: 128px; }
  .analysis-section .z-rank-figs { font-size: 12.5px; }
}
/* polish: overview */
.tieout-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--amino-space-5); margin-top: var(--amino-space-4); }
.tieout-grid table.records { width: 100%; }
@media (max-width: 760px) {
  .tieout-grid { grid-template-columns: minmax(0, 1fr); }
  .tieout-grid table.records { display: table; }
  .tieout-grid input[type="number"] { width: 8.5em !important; }
  .z-health-steps li > strong { white-space: nowrap; }
  /* The pinned label column kept collapsing to one word a line. */
  .z-dash .statement td.rowlabel, .z-dash .statement th:first-child { min-width: 9.5em; }
  .z-dash .statement th, .z-dash .statement td { padding: 8px 10px; }
  /* The cash bridge's labels were unreadable scaled to phone width: keep it legible and let it scroll. */
  .z-bridge-scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; }
  .z-bridge-scroll .z-chart { min-width: 680px; }
}
/* polish: record-shareholders-settings */
/* Dividends: a wide retained-earnings table scrolls inside its card instead of widening the page. */
.sh-grid > * { min-width: 0; }
.sh-re td:first-child { min-width: 150px; }
@media (max-width: 600px) {
  /* Team & logins: each login becomes a small card, so status and actions are never cut off. */
  table.records.team-table { display: block; overflow: visible; }
  .team-table thead { display: none; }
  .team-table tbody { display: block; }
  .team-table tr { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; padding: 12px 2px; border-bottom: 1px solid var(--amino-border); }
  .team-table td { display: block; border: 0; padding: 0; }
  .team-table tbody tr:hover td { background: transparent; }
  .team-table td.team-email { flex-basis: 100%; font-weight: 600; overflow-wrap: anywhere; }
  .team-table td.team-name, .team-table td.team-seen { font-size: 12.5px; color: var(--amino-text-muted); }
  .team-table td.team-seen { flex-basis: 100%; }
  .team-table td.team-act { flex-basis: 100%; width: auto; }
  .team-table td.team-act .actions-cell { justify-content: flex-start; }
  .team-table td.team-act .icon-btn.slot { display: none; }

  /* Dividends › Retained earnings: keep the row labels readable and pinned while months scroll. */
  .sh-re td:first-child, .sh-re th:first-child { position: sticky; left: 0; z-index: 1; min-width: 132px; background: var(--amino-surface, #fff); }
  .sh-re input { width: 92px !important; }
}

/* polish 2: dashboard — one card grammar, review table, metric tiles */
.z-card-head .z-card-fig { font-size: 26px; font-weight: 650; font-variant-numeric: tabular-nums; letter-spacing: -0.01em; white-space: nowrap; }
.z-card-head .z-card-fig.neg { color: var(--z-bad); }
.z-dash .good { color: var(--z-good); }
.z-dash .bad { color: var(--z-bad); }
.z-health-big { color: inherit; }
.z-health-big small { font-size: 13px; font-weight: 500; color: var(--amino-text-muted); }
.z-health-item h3, .z-health-vial h3 { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--amino-text-muted); margin: 0 0 6px; }
.z-health-vial { margin-top: var(--amino-space-5); }
.ck-card .ck-group { font-size: 12px; letter-spacing: .06em; text-transform: uppercase; color: var(--amino-text-muted); margin: 0 0 4px; }
.ck-table { width: 100%; border-collapse: collapse; font-size: 13.5px; }
.ck-table td { padding: 10px 8px; border-top: 1px solid var(--amino-border); vertical-align: top; }
.ck-table tr:first-child td { border-top: 0; }
.ck-table .ck-text { width: 100%; }
.ck-table .ck-amt { text-align: right; white-space: nowrap; font-variant-numeric: tabular-nums; font-weight: 600; }
.ck-table .ck-act { white-space: nowrap; text-align: right; }
.ck-table .ck-act .btn { margin-left: 6px; }
.ck-ack-link { margin-left: 10px; font-size: 12px; color: var(--amino-text-muted); }
.ck-sub { font-size: 12px; color: var(--amino-text-muted); margin-top: 2px; }
.ck-tech { margin-top: 4px; font-size: 12px; color: var(--amino-text-muted); }
.ck-tech summary { cursor: pointer; }
.ck-ack { display: flex; gap: 8px; flex-wrap: wrap; margin-top: 8px; }
.ck-ack input { flex: 1; min-width: 200px; }
.ck-fold { margin-top: var(--amino-space-3); border-top: 1px solid var(--amino-border); padding-top: var(--amino-space-3); }
.ck-fold summary { cursor: pointer; font-weight: 600; font-size: 13.5px; }
@media (max-width: 640px) {
  .ck-table tr { display: grid; grid-template-columns: 1fr auto; }
  .ck-table td { border-top: 0; padding: 6px 0; }
  .ck-table tr { border-top: 1px solid var(--amino-border); padding: 6px 0; }
  .ck-table .ck-text { grid-column: 1 / -1; }
  .ck-table .ck-amt { text-align: left; }
}
.ck-ack-link { appearance: none; background: none; border: 0; padding: 0; cursor: pointer; text-decoration: underline; text-underline-offset: 2px; }
.z-card-head h2 .z-meaning { font: inherit; color: inherit; }
.z-dash .z-health { grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); }
/* Glossary page */
.z-glossary-search { min-width: 220px; max-width: 100%; }
.z-glossary-list { margin: 0; display: grid; }
.z-glossary-row { display: grid; grid-template-columns: minmax(180px, 280px) 1fr; gap: 6px 24px; padding: 12px 0; border-top: 1px solid var(--amino-border); scroll-margin-top: 96px; }
.z-glossary-row:first-child { border-top: 0; }
.z-glossary-row dt { font-weight: 600; }
.z-glossary-row dd { margin: 0; color: var(--amino-text-muted); }
.z-glossary-row:target { background: var(--z-accent-soft); border-radius: 8px; padding-left: 10px; padding-right: 10px; }
@media (max-width: 640px) { .z-glossary-row { grid-template-columns: 1fr; } }
/* polish 2: analysis-outlook */
/* A covered month is a fact, not an alert: no tinted box, only the figure in green.
   Amber and red keep their box (needs action / wrong). */
.z-answer.good { background: transparent; border-color: var(--amino-border); }
.z-answer-big { font-size: clamp(18px, 2.6vw, 24px); }
/* Key-figure lines under a section title: label, figure, then muted context. */
.z-insight { font-size: 14px; }
.z-insight strong { font-variant-numeric: tabular-nums; font-size: 15.5px; }
.z-empty-line { margin: 4px 0 var(--amino-space-5); font-size: 13.5px; }
.z-basis { font-size: 12.5px; margin-left: 8px; }

/* polish: Config list rows stay on one line on phones (name, type, remove). */
@media (max-width: 640px) {
  .row.z-cfg-item { flex-wrap: nowrap; }
  .row.z-cfg-item > input { min-width: 0; }
  .row.z-cfg-item > select { width: 120px !important; flex: none; padding-left: 10px; padding-right: 22px; }
  .row.z-cfg-item > input { padding-left: 12px; padding-right: 10px; }
  .row.z-cfg-item .icon-btn[data-short] { width: 38px; padding: 0; justify-content: center; flex: none; }
  .row.z-cfg-item .icon-btn[data-short]::after { content: none; }
}
/* polish 2: record-shareholders-settings */
/* Dividends › Available for Distribution: the figure with its label, the limiting facts beside it. No banner. */
.sh-avail { display: flex; flex-wrap: wrap; align-items: flex-end; gap: var(--amino-space-3) var(--amino-space-6); padding: var(--amino-space-2) 0 var(--amino-space-4); border-bottom: 1px solid var(--amino-border); }
.sh-avail-fig .label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.04em; color: var(--amino-text-muted); }
.sh-avail-fig .value { font-family: var(--amino-font-display); font-weight: 700; font-size: clamp(26px, 3vw, 34px); line-height: 1.1; margin-top: 4px; font-variant-numeric: tabular-nums; }
.sh-avail-fig .value.zero { color: var(--amino-text-muted); }
.sh-avail-facts { flex: 1 1 260px; min-width: 0; font-size: 13px; color: var(--amino-text-muted); display: grid; gap: 2px; }
.sh-avail-split { color: var(--amino-text); font-variant-numeric: tabular-nums; }
/* Expenses: "Common" is the default brand, so it reads as plain text, not a pill on every row. */
.exp-page .common-badge { padding: 0; background: none; color: inherit; font-size: inherit; font-weight: 400; }
.exp-foot, .pc-foot { margin-top: var(--amino-space-4); }
/* Config › Expense Groups: an unsaved suggestion is a quiet word, not a pill on every row. */
.z-suggested { display: block; font-size: 11.5px; font-style: italic; color: var(--z-warn); }
.pc-count { font-size: 13px; white-space: nowrap; border-bottom: 1px dotted var(--amino-n-400); }
/* Setup is a narrow list; the retained-earnings statement gets the width. */
@media (min-width: 900px) {
  .grid.cols-2.sh-grid { grid-template-columns: minmax(0, 2fr) minmax(0, 3fr); }
  .sh-re td:first-child { min-width: 190px; }
}
/* Analysis · one vial, start to finish (2026-10-03) */
.vial-legend { display: flex; flex-wrap: wrap; gap: 6px 14px; font-size: 12.5px; color: var(--amino-text-muted); margin: 6px 0 12px; }
.vial-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 6px; vertical-align: -1px; }
.vial-rows { list-style: none; margin: 0; padding: 0; display: grid; gap: 16px; }
.vial-head { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 4px 12px; font-size: 14px; font-weight: 600; margin-bottom: 6px; }
.vial-head .muted { font-weight: 400; font-size: 13px; }
.vial-bar { display: flex; height: 14px; border-radius: 7px; overflow: hidden; background: var(--amino-surface-sunk); }
.vial-bar span { display: block; height: 100%; }
.vial-figs { display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: 12.5px; color: var(--amino-text-muted); margin-top: 6px; font-variant-numeric: tabular-nums; }
.vial-figs strong { margin-left: auto; font-size: 13px; }

/* Record a distribution: when the money is sent (now, or a later month). */
.sh-paid-in { border: 1px solid var(--z-sky-3); border-radius: 10px; padding: var(--amino-space-3) var(--amino-space-4); margin: var(--amino-space-3) 0; display: grid; gap: 6px; }
.sh-paid-in legend { padding: 0 4px; font-weight: 600; }
.sh-paid-in label { display: flex; align-items: center; justify-content: flex-start; gap: 8px; cursor: pointer; white-space: nowrap; }
.sh-paid-in input[type="radio"] { width: auto; min-width: 0; height: auto; flex: none; margin: 0; padding: 0; border: 0; box-shadow: none; outline-offset: 2px; }

/* Balance sheet: where retained earnings sits */
.z-bs-mix { margin: 4px 0 10px; }
.z-bs-bar { display: flex; height: 10px; border-radius: 999px; overflow: hidden; background: var(--amino-n-100); }
.z-bs-legend { list-style: none; margin: 8px 0 0; padding: 0; display: flex; flex-wrap: wrap; gap: 4px 16px; font-size: 12.5px; color: var(--amino-text-muted); }
.z-bs-legend li { display: inline-flex; align-items: center; gap: 6px; }
.z-bs-legend strong { color: var(--amino-text); font-weight: 600; }
.z-bs-bar > span { display: block; height: 100%; min-width: 2px; }
.z-bs .z-bs-section td { font-size: 11.5px; font-weight: 600; letter-spacing: .04em; text-transform: uppercase; color: var(--amino-text-muted); padding-top: 14px; }
.z-bs .z-bs-diff td { color: var(--amino-danger, #d64545); font-weight: 600; }
/* Sales needed for a dividend per shareholder (Dividends › Available for Distribution) */
.sh-need { max-width: 620px; margin-top: var(--amino-space-4); padding: var(--amino-space-4); border: 1px solid var(--amino-border); border-radius: 10px; background: var(--amino-surface-2, transparent); display: grid; gap: var(--amino-space-3); }
.sh-need-head { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 10px; }
.sh-need-head h3 { margin: 0; font-size: 14px; }
.sh-need-head .muted { font-size: 12.5px; }
.sh-need-ask { display: flex; flex-wrap: wrap; gap: var(--amino-space-2) var(--amino-space-4); }
.sh-need-ask input { width: 130px; text-align: right; font-variant-numeric: tabular-nums; }
.sh-need-ask select { max-width: 100%; }
.sh-need-out { display: grid; gap: 4px; font-size: 13px; }
.sh-need-row { display: flex; justify-content: space-between; gap: 12px; font-variant-numeric: tabular-nums; }
.sh-need-row.big { font-size: 15px; margin-top: 2px; }
.sh-need-row.big strong { font-family: var(--amino-font-display); }
.sh-need-verdict { color: var(--amino-text-muted); font-size: 12.5px; }
.sh-need-verdict.ok { color: var(--amino-success, var(--amino-text)); font-weight: 600; }
@media (max-width: 640px) { .sh-need { padding: var(--amino-space-3); } .sh-need-ask input { width: 110px; } }
/* Pay a Dividend (Dividends › Available for Distribution) */
.sh-pay { display: grid; gap: var(--amino-space-4); }
.sh-pay-amount { display: grid; gap: 6px; }
.sh-pay-amount label { font-size: 11px; font-weight: 600; text-transform: uppercase; letter-spacing: 0.05em; color: var(--amino-text-muted); }
.sh-pay-amount input { font-family: var(--amino-font-display); font-size: 24px; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; max-width: 240px; }
.sh-pay-quick { display: flex; flex-wrap: wrap; gap: 6px; }
.sh-pay-split, .sh-pay-after { display: grid; gap: 2px; padding-top: var(--amino-space-3); border-top: 1px solid var(--amino-border); }
.sh-pay-row { display: flex; justify-content: space-between; gap: 12px; padding: 4px 0; font-size: 14px; font-variant-numeric: tabular-nums; }
.sh-pay-row .neg { color: var(--amino-danger); }
.sh-pay-warn { margin-top: 6px; padding: 8px 10px; border-radius: 8px; background: color-mix(in srgb, var(--amino-warning) 14%, transparent); color: var(--amino-warning); font-size: 13px; }
.sh-need-verdict.ok .btn { margin-left: 6px; }
/* Record a Dividend Already Paid (round 8) */
.sh-pay-acts { justify-content: flex-end; gap: 8px; flex-wrap: wrap; }
.sh-paid-fields { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: var(--amino-space-4); align-items: end; }
.sh-paid-fields select { width: 100%; }
.sh-paid-fields .sh-pay-amount input { max-width: none; width: 100%; }
.sh-pay-warn.info { background: var(--z-accent-soft); color: var(--amino-text); }
@media (max-width: 640px) { .sh-paid-fields { grid-template-columns: minmax(0, 1fr); } }
