/* Brand kits: scoped tokens per brand (.brand-<id>), the mode-aware logo element (bk-logo), and the branded case-file
   header used by the Venture Explorer (bk-case). The values mirror BRANDS in js/brands.js. Every token below is safe
   for its use in the current RJ.OS mode: --bk-accent-text and --bk-cta-* meet WCAG AA on --bk-ground. */

/* ── Tokens (dark mode is the default; light mode overrides the grounds and text-safe accents) ── */
.brand-geipl {
  --bk-emerald: #1D9E5C; --bk-cobalt: #2563C9; --bk-steel: #AAB3BC; --bk-graphite: #15181C; --bk-mist: #EEF2F6;
  --bk-ground: #15181C; --bk-ink: #EEF2F6; --bk-ink-2: #AAB3BC; --bk-line: #2B323A;
  --bk-accent: #1D9E5C; --bk-accent-2: #2563C9; --bk-accent-text: #34B873;
  --bk-cta-bg: #1D9E5C; --bk-cta-fg: #15181C;
  --bk-font-display: 'Unbounded', 'Manrope', system-ui, sans-serif; --bk-font-head: 'Manrope', system-ui, sans-serif; --bk-font-text: 'Manrope', system-ui, sans-serif;
  --bk-logo-h: 44px;
}
.brand-heyelda {
  --bk-cream: #fbf6ef; --bk-ink-brown: #33261b; --bk-orange: #e96e27; --bk-peach: #ffdab9;
  --bk-ground: #33261b; --bk-ink: #fbf6ef; --bk-ink-2: #e8d6c4; --bk-line: #4d3c2e;
  --bk-accent: #e96e27; --bk-accent-2: #ffdab9; --bk-accent-text: #f08a4b;
  --bk-cta-bg: #e96e27; --bk-cta-fg: #33261b;
  --bk-font-display: 'Bricolage Grotesque', system-ui, sans-serif; --bk-font-head: 'Bricolage Grotesque', system-ui, sans-serif;
  --bk-font-serif: 'Instrument Serif', Georgia, serif; --bk-font-text: 'Atkinson Hyperlegible', system-ui, sans-serif;
  --bk-logo-h: 42px;
}
.brand-stratiq {
  --bk-gallery: #F6F4EE; --bk-graphite: #23272C; --bk-timber: #B98B5E; --bk-signal: #E9EDA0;
  --bk-ground: #23272C; --bk-ink: #F6F4EE; --bk-ink-2: #C9C4B8; --bk-line: #3A4047;
  --bk-accent: #E9EDA0; --bk-accent-2: #B98B5E; --bk-accent-text: #E9EDA0;
  --bk-cta-bg: #E9EDA0; --bk-cta-fg: #23272C;
  --bk-font-display: 'Manrope', system-ui, sans-serif; --bk-font-head: 'Manrope', system-ui, sans-serif; --bk-font-text: 'Manrope', system-ui, sans-serif;
  --bk-font-mono: 'IBM Plex Mono', var(--font-mono), monospace;
  --bk-logo-h: 32px;
}
.brand-namoh {
  --bk-orange: #D34912; --bk-brown: #451603; --bk-cream: #F6EBDD;
  --bk-ground: #1F0E06; --bk-ink: #F6EBDD; --bk-ink-2: #D9C3AE; --bk-line: #3E2416;
  --bk-accent: #D34912; --bk-accent-2: #451603; --bk-accent-text: #EC6A35;
  --bk-cta-bg: #E0602A; --bk-cta-fg: #1F0E06;
  --bk-font-display: 'Marcellus', Georgia, serif; --bk-font-head: 'Marcellus', Georgia, serif; --bk-font-text: 'Source Sans 3', system-ui, sans-serif;
  --bk-logo-h: 52px;
}
[data-mode='light'] .brand-geipl { --bk-ground: #F3F5F7; --bk-ink: #15181C; --bk-ink-2: #4A535C; --bk-line: #D5DBE1; --bk-accent-text: #157A47; }
[data-mode='light'] .brand-heyelda { --bk-ground: #fbf6ef; --bk-ink: #33261b; --bk-ink-2: #6b5a4a; --bk-line: #eadccb; --bk-accent-text: #b5501a; }
[data-mode='light'] .brand-stratiq { --bk-ground: #F6F4EE; --bk-ink: #23272C; --bk-ink-2: #5A5F66; --bk-line: #E2DED3; --bk-accent: #B98B5E; --bk-accent-text: #7E5A35; --bk-cta-bg: #23272C; --bk-cta-fg: #E9EDA0; }
[data-mode='light'] .brand-namoh { --bk-ground: #FBF3EA; --bk-ink: #2E1608; --bk-ink-2: #6A4A36; --bk-line: #EBDACA; --bk-accent-text: #A8380D; --bk-cta-bg: #451603; --bk-cta-fg: #F6EBDD; }

/* ── Logo: both lockups in the DOM, the one for the nearest mode shown ── */
.bk-logo { display: inline-flex; align-items: center; height: var(--bk-logo-h, 40px); max-width: 100%; flex: none; }
.bk-logo img { display: block; height: 100%; width: auto; max-width: 100%; object-fit: contain; object-position: left center; }
.bk-logo .bk-logo-l { display: none; }
[data-mode='light'] .bk-logo .bk-logo-l { display: block; }
[data-mode='light'] .bk-logo .bk-logo-d { display: none; }
[data-mode='light'] [data-mode='dark'] .bk-logo .bk-logo-l { display: none; }
[data-mode='light'] [data-mode='dark'] .bk-logo .bk-logo-d { display: block; }
.bk-logo.is-text { height: auto; font: 700 20px/1.1 var(--bk-font-head, inherit); color: var(--bk-ink, var(--text)); letter-spacing: -0.01em; }

/* ── Venture Explorer: the branded case-file header ── */
.bk-case {
  position: relative; display: grid; gap: 12px; padding: 16px 16px 16px 20px; border-radius: 10px;
  background: var(--bk-ground); color: var(--bk-ink); border: 1px solid var(--bk-line); overflow: hidden;
}
.bk-case::before { content: ''; position: absolute; inset: 0 auto 0 0; width: 5px; background: linear-gradient(180deg, var(--bk-accent), var(--bk-accent-2, var(--bk-accent))); }
.bk-case-top { display: flex; align-items: center; justify-content: space-between; gap: 10px 14px; flex-wrap: wrap; min-width: 0; }
.bk-case-badges { display: flex; flex-wrap: wrap; gap: 6px; }
.bk-case-badges .badge { border-color: var(--bk-line); color: var(--bk-ink-2); background: transparent; }
.bk-case-badges .badge--ok, .bk-case-badges .badge--acc { color: var(--bk-accent-text); border-color: color-mix(in srgb, var(--bk-accent-text) 45%, transparent); }
.bk-case-badges .badge .led { box-shadow: none; }
.bk-case-line { font: 700 19px/1.3 var(--bk-font-head); color: var(--bk-ink); letter-spacing: -0.01em; max-width: 46ch; text-wrap: balance; }
.brand-namoh .bk-case-line { font-weight: 400; font-size: 20px; letter-spacing: 0; }
.bk-case-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.bk-cta {
  display: inline-flex; align-items: center; gap: 8px; min-height: 36px; padding: 0 14px; border-radius: 999px; border: 0;
  background: var(--bk-cta-bg); color: var(--bk-cta-fg); font: 700 12.5px/1 var(--bk-font-head); letter-spacing: 0.01em; cursor: pointer;
  transition: transform 0.15s, filter 0.15s;
}
.bk-cta:hover { filter: brightness(1.07); transform: translateY(-1px); }
.bk-cta:focus-visible { outline: 2px solid var(--bk-accent-text); outline-offset: 2px; }
.bk-cta svg { width: 13px; height: 13px; }
.brand-namoh .bk-cta, .brand-geipl .bk-cta { border-radius: 6px; }
[data-mode='light'] .bk-case { border: 2px solid var(--nb-line); box-shadow: var(--nb-shadow-sm); border-radius: 4px; }
[data-mode='light'] .bk-cta { box-shadow: 2px 2px 0 var(--nb-line); }
@media (prefers-reduced-motion: reduce) { .bk-cta { transition: none; } .bk-cta:hover { transform: none; } }
@container (max-width: 480px) {
  .bk-case { padding: 14px 12px 14px 16px; }
  .bk-case-line { font-size: 17px; }
  .bk-logo { height: calc(var(--bk-logo-h, 40px) * 0.86); }
}
.bk-case + .vx-d-sum { margin-top: 14px; }

/* ── Proof chips: every number in Story Mode, the case files and Spaces carries one (proofChip() in
      js/apps/story/proof.js). Verified = my own figure or a product fact you can see; Reported = my figure, not
      checkable from outside; Projection = a forecast. ── */
.st-proof {
  display: inline-flex; align-items: center; gap: 5px; height: 22px; padding: 0 9px; border-radius: 999px; flex: none;
  border: 1px solid; font: 600 10px/1 var(--font-mono); letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap; cursor: help;
}
.st-proof-mark { font-size: 11px; letter-spacing: 0; }
.st-proof.is-compact { height: 19px; padding: 0 7px; gap: 4px; font-size: 9px; }
.st-proof--verified { color: var(--green); border-color: color-mix(in srgb, var(--green) 45%, transparent); background: color-mix(in srgb, var(--green) 9%, transparent); }
.st-proof--reported { color: var(--acc); border-color: var(--acc-a35); background: var(--acc-a06); }
.st-proof--projection { color: #e9c46a; border-color: rgba(233, 196, 106, 0.45); background: rgba(233, 196, 106, 0.08); }
[data-mode='light'] .st-proof { border: 1.5px solid var(--nb-line); color: var(--nb-fill-ink); }
[data-mode='light'] .st-proof--verified { background: #d6efc4; color: #1f4a0d; }
[data-mode='light'] .st-proof--reported { background: var(--nb-tag-bg); }
[data-mode='light'] .st-proof--projection { background: #fbe3a6; color: #5a3b00; }
[data-mode='light'] [data-mode='dark'] .st-proof { border: 1px solid; }

/* ── Venture Explorer: the case-study template (Problem → Moves → Numbers → Lessons → Try it) ── */
.app-ventures .st-cf { --cf-acc: var(--acc); margin-top: 14px; }
.app-ventures .st-cf.is-brand { --cf-acc: var(--bk-accent-text); }
.app-ventures .st-cf-sec { padding: 14px 0 16px; border-top: 1px dashed var(--line-2); }
.app-ventures .st-cf-h { display: flex; align-items: baseline; gap: 10px; margin: 0 0 10px; font-size: 11px; font-weight: 700; letter-spacing: 0.14em; text-transform: uppercase; color: var(--text); }
.app-ventures .st-cf-h i { font: 800 16px/1 var(--font-dot); font-style: normal; letter-spacing: 0.02em; color: var(--cf-acc); }
.app-ventures .st-cf-problem { margin: 0; max-width: 62ch; font-size: 13.5px; line-height: 1.65; color: var(--text); }
.app-ventures .st-cf-moves { list-style: none; counter-reset: st-move; margin: 0; padding: 0; display: grid; gap: 7px; }
.app-ventures .st-cf-moves li { counter-increment: st-move; display: grid; grid-template-columns: 24px minmax(0, 1fr); gap: 8px; color: var(--text-2); line-height: 1.55; }
.app-ventures .st-cf-moves li::before { content: counter(st-move, decimal-leading-zero); font: 700 11px/1.75 var(--font-mono); color: var(--cf-acc); }
.app-ventures .st-cf .vx-flow { margin: 12px 0 0; }
.app-ventures .st-cf-built { margin-top: 12px; }
.app-ventures .st-cf-built summary { cursor: pointer; width: max-content; font-size: 11.5px; color: var(--muted); }
.app-ventures .st-cf-built summary:hover { color: var(--text); }
.app-ventures .st-cf-built ul { margin-top: 6px; color: var(--text-2); line-height: 1.55; }
.app-ventures .st-cf-tiles { margin: 0; }
.app-ventures .st-cf-tiles .tile { display: grid; align-content: start; }
.app-ventures .st-cf-tiles .st-proof { justify-self: start; margin-top: 9px; }
.app-ventures .st-cf.is-brand .tile-v { color: var(--cf-acc); text-shadow: 0 0 22px color-mix(in srgb, var(--cf-acc) 30%, transparent); }
.app-ventures .st-cf-none { margin: 0; font-size: 12.5px; color: var(--text-2); }
.app-ventures .st-cf-facts { display: grid; grid-template-columns: max-content minmax(0, 1fr); gap: 5px 14px; margin: 12px 0 0; font-size: 12px; }
.app-ventures .st-cf-facts dt { align-self: center; font-size: 10px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--muted); }
.app-ventures .st-cf-facts dd { margin: 0; color: var(--text-2); }
.app-ventures .st-cf-facts dd b { color: var(--text); }
.app-ventures .st-cf-legend { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 12px 0 0; font-size: 11px; color: var(--muted); }
.app-ventures .st-cf-try { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 8px; }
.app-ventures .st-cf-app {
  display: grid; grid-template-columns: 28px minmax(0, 1fr); gap: 10px; align-items: center; min-height: 58px; padding: 10px 12px;
  text-align: left; text-decoration: none; color: inherit; border: 1px solid var(--nb-line); border-radius: 8px; background: var(--nb-card);
  box-shadow: var(--nb-shadow-sm); transition: transform 0.12s, box-shadow 0.12s;
}
.app-ventures .st-cf-app:hover { transform: translate(-1px, -1px); box-shadow: var(--nb-shadow); }
.app-ventures .st-cf-app:focus-visible { outline: 2px solid var(--cf-acc); outline-offset: 2px; }
.app-ventures .st-cf-ic { display: grid; place-items: center; }
.app-ventures .st-cf-ic .px-icon { width: 26px; height: 26px; }
.app-ventures .st-cf-app > span:last-child { display: grid; gap: 2px; min-width: 0; }
.app-ventures .st-cf-app b { font-size: 12.5px; color: var(--text); }
.app-ventures .st-cf-app span span { font-size: 11px; line-height: 1.4; color: var(--muted); }
.app-ventures .st-cf-app small { font-size: 9.5px; letter-spacing: 0.12em; text-transform: uppercase; color: var(--cf-acc); }
.app-ventures .st-cf-story {
  display: grid; grid-template-columns: auto minmax(0, 1fr) auto; gap: 12px; align-items: center; width: 100%; margin-top: 4px; padding: 12px 14px;
  text-align: left; border: 1px solid var(--acc-a35); border-radius: 8px; background: var(--acc-a06); color: var(--text);
}
.app-ventures .st-cf-story:hover { border-color: var(--acc); }
.app-ventures .st-cf-story-n { font: 800 18px/1 var(--font-dot); color: var(--acc); }
.app-ventures .st-cf-story b { display: block; font-size: 10.5px; letter-spacing: 0.14em; text-transform: uppercase; color: var(--acc); }
.app-ventures .st-cf-story span span { font-size: 12.5px; color: var(--text); }
[data-mode='light'] .app-ventures .st-cf-sec { border-top: 2px dashed var(--line-3); }
[data-mode='light'] .app-ventures .st-cf.is-brand .tile-v { text-shadow: none; }
[data-mode='light'] .app-ventures .st-cf-app { border: 2px solid var(--nb-line); border-radius: 4px; }
[data-mode='light'] .app-ventures .st-cf-app:hover { background: var(--nb-tag-bg); }
[data-mode='light'] .app-ventures .st-cf-story { border: 2px solid var(--nb-line); border-radius: 4px; background: var(--nb-tag-bg); box-shadow: var(--nb-shadow-sm); }
[data-mode='light'] .app-ventures .st-cf-story b, [data-mode='light'] .app-ventures .st-cf-story-n { color: var(--nb-fill-ink); }
@media (prefers-reduced-motion: reduce) { .app-ventures .st-cf-app { transition: none; } .app-ventures .st-cf-app:hover { transform: none; } }
@container (max-width: 480px) {
  .app-ventures .st-cf-try { grid-template-columns: minmax(0, 1fr); }
  .app-ventures .st-cf-facts { grid-template-columns: minmax(0, 1fr); gap: 2px; }
  .app-ventures .st-cf-facts dd { margin-bottom: 6px; }
}