/* ============================================================
   EXECUTIVE INTELLIGENCE PLATFORM — PHASE B (Intelligence Depth)
   ------------------------------------------------------------
   css/intelligence-depth.css
   Compositional layer for:
     (1) Boardroom View + Deep Research View on intelligence items
     (2) Now / Next / Legacy temporal layers
     (3) Future Lab expanded horizons (2030 → 2125+)
   Built entirely on tokens-2100.css + style.css tokens (navy /
   gold / ivory / teal / charcoal). NO new hues. Applies 2100
   honesty conventions:
     - dashed gold + ◆ + "Projected" = forecast/hypothesis
     - solid gold = evidence
     - confidence triad NEVER colour-only (always text label + glyph)
     - provenance labels literal
   Scoped to [data-intel-depth] surfaces so legacy pages are
   untouched. Additive only.
   ============================================================ */

[data-intel-depth] .ib-depth {
  --ib-line: var(--line-fact, #C6A15B);
  --ib-line-f: var(--line-forecast, #C6A15B);
  background: var(--bg-surface1, #121A24);
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  border-radius: 10px;
  padding: 1.4rem 1.5rem;
  margin: 1.6rem 0;
  color: var(--text-primary, #F7F3EA);
}

[data-intel-depth] .ib-view-switch {
  display: flex;
  flex-wrap: wrap;
  gap: 0.6rem;
  align-items: center;
  border-bottom: 1px solid var(--line-hair, rgba(201,210,220,.22));
  padding-bottom: 0.9rem;
  margin-bottom: 1.1rem;
}

[data-intel-depth] .ib-view-switch .ib-switch-label {
  font-size: 0.74rem;
  letter-spacing: 0.14em;
  text-transform: uppercase;
  font-weight: 600;
  color: var(--text-data, #8A94A0);
  margin-right: 0.4rem;
}

[data-intel-depth] .ib-view-btn {
  font: inherit;
  font-size: 0.85rem;
  font-weight: 600;
  letter-spacing: 0.02em;
  color: var(--text-secondary, #C9D2DC);
  background: transparent;
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  border-radius: 6px;
  padding: 0.5rem 0.95rem;
  min-height: 44px;
  cursor: pointer;
  transition: color .18s ease, border-color .18s ease, background .18s ease;
}
[data-intel-depth] .ib-view-btn[aria-pressed="true"] {
  color: var(--accent-gold, #C6A15B);
  border-color: var(--accent-gold, #C6A15B);
  background: var(--t-gold, rgba(198,161,91,.16));
}
[data-intel-depth] .ib-view-btn:focus-visible {
  outline: 2px solid var(--focus, #C6A15B);
  outline-offset: 2px;
}

/* --- Boardroom view (decision-first) --- */
[data-intel-depth] .ib-boardroom { display: block; }
[data-intel-depth] .ib-boardroom[hidden] { display: none; }

[data-intel-depth] .ib-bifm-decision {
  border-left: 3px solid var(--line-fact, #C6A15B);
  padding: 0.1rem 0 0.1rem 1rem;
  margin-bottom: 1.2rem;
}
[data-intel-depth] .ib-bifm-decision .ib-q {
  font-size: 0.72rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--accent-gold, #C6A15B); font-weight: 600; margin-bottom: 0.35rem;
}
[data-intel-depth] .ib-bifm-decision p {
  font-size: 1.05rem; line-height: 1.55; font-weight: 300;
  color: var(--text-primary, #F7F3EA); margin: 0;
}

[data-intel-depth] .ib-blocks { display: grid; gap: 0.9rem; }
[data-intel-depth] .ib-block {
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  border-left: 3px solid var(--line-fact, #C6A15B);
  border-radius: 5px;
  padding: 0.95rem 1.05rem;
  background: var(--bg-surface2, #1A2430);
}
[data-intel-depth] .ib-block .ib-bk {
  display: flex; align-items: center; gap: 0.6rem; margin-bottom: 0.4rem;
}
[data-intel-depth] .ib-block .ib-bk .no {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 0.72rem; letter-spacing: 0.12em; color: #fff;
  background: var(--c-navy-legacy, #0B1F33); padding: 0.14rem 0.5rem; border-radius: 2px;
}
[data-intel-depth] .ib-block .ib-bk .lab {
  font-size: 0.76rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--accent-gold, #C6A15B); font-weight: 700;
}
[data-intel-depth] .ib-block p { font-size: 0.94rem; line-height: 1.62; color: var(--text-secondary, #C9D2DC); margin: 0; }

/* --- Deep Research view --- */
[data-intel-depth] .ib-deep { display: block; }
[data-intel-depth] .ib-deep[hidden] { display: none; }

[data-intel-depth] .ib-deep h3 {
  font-size: 1.02rem; font-weight: 600; letter-spacing: 0.01em;
  color: var(--text-primary, #F7F3EA); margin: 0 0 0.5rem;
}
[data-intel-depth] .ib-deep .ib-deep-status {
  font-size: 0.84rem; line-height: 1.55; color: var(--text-muted, #9CA3AF);
  background: var(--t-sand, rgba(215,205,180,.22)); border-left: 3px solid var(--c-sand, #D7CDB4);
  padding: 0.7rem 0.9rem; border-radius: 4px; margin-bottom: 1rem;
}
[data-intel-depth] .ib-method {
  font-size: 0.9rem; line-height: 1.6; color: var(--text-secondary, #C9D2DC);
  margin-bottom: 1.1rem;
}
[data-intel-depth] .ib-deep-section { margin-bottom: 1.2rem; }
[data-intel-depth] .ib-deep-kicker {
  font-size: 0.7rem; letter-spacing: 0.14em; text-transform: uppercase;
  color: var(--text-data, #8A94A0); font-weight: 600; margin-bottom: 0.5rem;
}
[data-intel-depth] .ib-sources { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
[data-intel-depth] .ib-source {
  display: flex; flex-wrap: wrap; gap: 0.4rem 0.8rem; align-items: baseline;
  border: 1px solid var(--line-hair, rgba(201,210,220,.22)); border-left: 3px solid var(--line-fact, #C6A15B);
  border-radius: 5px; padding: 0.55rem 0.8rem; font-size: 0.88rem; color: var(--text-secondary, #C9D2DC);
}
[data-intel-depth] .ib-source a { color: var(--accent-gold, #C6A15B); font-weight: 600; text-decoration: none; }
[data-intel-depth] .ib-source a:hover { text-decoration: underline; }
[data-intel-depth] .ib-source .ib-date { font-family: var(--mono, ui-monospace, monospace); font-size: 0.78rem; color: var(--text-data, #8A94A0); }
[data-intel-depth] .ib-source .ib-tier { font-size: 0.74rem; color: var(--c-teal-light, #3D8278); }

[data-intel-depth] .ib-evidence { list-style: none; margin: 0; padding: 0; display: grid; gap: 0.5rem; }
[data-intel-depth] .ib-evidence li {
  border: 1px solid var(--line-hair, rgba(201,210,220,.22)); border-left: 3px solid var(--line-fact, #C6A15B);
  border-radius: 5px; padding: 0.55rem 0.8rem; font-size: 0.88rem; color: var(--text-secondary, #C9D2DC);
}
[data-intel-depth] .ib-evidence a { color: var(--accent-gold, #C6A15B); font-weight: 600; text-decoration: none; }
[data-intel-depth] .ib-evidence .ib-note { font-size: 0.82rem; color: var(--text-muted, #9CA3AF); }

[data-intel-depth] .ib-connected { display: flex; flex-wrap: wrap; gap: 0.5rem; }
[data-intel-depth] .ib-chip {
  font-size: 0.78rem; color: var(--text-secondary, #C9D2DC);
  border: 1px solid var(--line-hair, rgba(201,210,220,.22)); border-radius: 20px; padding: 0.3rem 0.75rem;
}
[data-intel-depth] .ib-pending {
  font-size: 0.86rem; line-height: 1.55; color: var(--text-muted, #9CA3AF);
  border-left: 3px dashed var(--c-sand, #D7CDB4); background: var(--t-sand, rgba(215,205,180,.22));
  padding: 0.7rem 0.9rem; border-radius: 4px; font-style: italic;
}

/* --- Provenance & confidence (honesty conventions) --- */
[data-intel-depth] .ib-provenance {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 0.74rem; letter-spacing: 0.03em; color: var(--text-data, #8A94A0);
  margin-top: 1rem; border-top: 1px solid var(--line-hair, rgba(201,210,220,.22)); padding-top: 0.7rem;
}
[data-intel-depth] .ib-conf {
  display: inline-flex; align-items: center; gap: 0.35rem;
  font-size: 0.76rem; font-weight: 600; border-radius: 20px; padding: 0.2rem 0.6rem; margin-right: 0.4rem;
}
[data-intel-depth] .ib-conf.verified { color: var(--accent-gold, #C6A15B); border: 1px solid var(--line-fact, #C6A15B); }
[data-intel-depth] .ib-conf.site { color: var(--c-teal-light, #3D8278); border: 1px solid var(--c-teal-light, #3D8278); }
[data-intel-depth] .ib-conf.inferred { color: var(--c-sand, #D7CDB4); border: 1px solid var(--c-sand, #D7CDB4); }
[data-intel-depth] .ib-conf.pending { color: var(--text-muted, #9CA3AF); border: 1px dashed var(--c-sand, #D7CDB4); font-style: italic; }
[data-intel-depth] .ib-conf.historical { color: var(--text-data, #8A94A0); border: 1px solid var(--line-hair, rgba(201,210,220,.22)); }

/* ============================================================
   NOW / NEXT / LEGACY — temporal layers
   ============================================================ */
[data-intel-depth] .tl-layer {
  background: var(--bg-surface1, #121A24);
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  border-radius: 10px;
  padding: 1.4rem 1.5rem;
  margin: 1.6rem 0;
  color: var(--text-primary, #F7F3EA);
}
[data-intel-depth] .tl-switch {
  display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center;
  border-bottom: 1px solid var(--line-hair, rgba(201,210,220,.22)); padding-bottom: 0.9rem; margin-bottom: 0.9rem;
}
[data-intel-depth] .tl-btn {
  font: inherit; cursor: pointer; min-height: 44px; border-radius: 6px;
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  background: transparent; color: var(--text-secondary, #C9D2DC);
  font-size: 0.85rem; font-weight: 600; padding: 0.5rem 1rem;
  display: inline-flex; align-items: center; gap: 0.4rem;
}
[data-intel-depth] .tl-btn .g { font-size: 0.9rem; }
[data-intel-depth] .tl-btn[aria-pressed="true"] { color: var(--accent-gold, #C6A15B); border-color: var(--accent-gold, #C6A15B); background: var(--t-gold, rgba(198,161,91,.16)); }
[data-intel-depth] .tl-btn:focus-visible { outline: 2px solid var(--focus, #C6A15B); outline-offset: 2px; }
[data-intel-depth] .tl-btn .tl-fwd { font-size: 0.62rem; letter-spacing: 0.1em; text-transform: uppercase; color: var(--c-sand, #D7CDB4); vertical-align: middle; }

[data-intel-depth] .tl-panel[hidden] { display: none; }
[data-intel-depth] .tl-panel .tl-intro {
  font-size: 0.9rem; line-height: 1.6; color: var(--text-muted, #9CA3AF);
  border-left: 3px solid var(--line-hair, rgba(201,210,220,.22)); padding-left: 0.9rem; margin-bottom: 1.1rem;
}
[data-intel-depth] .tl-item {
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  border-radius: 6px; padding: 0.9rem 1.05rem; margin-bottom: 0.8rem;
  background: var(--bg-surface2, #1A2430);
}
[data-intel-depth] .tl-item h4 { font-size: 1rem; font-weight: 600; color: var(--text-primary, #F7F3EA); margin: 0 0 0.3rem; }
[data-intel-depth] .tl-item p { font-size: 0.9rem; line-height: 1.58; color: var(--text-secondary, #C9D2DC); margin: 0 0 0.5rem; }
[data-intel-depth] .tl-item .tl-links { display: flex; flex-wrap: wrap; gap: 0.7rem; font-size: 0.84rem; }
[data-intel-depth] .tl-item .tl-links a { color: var(--accent-gold, #C6A15B); font-weight: 600; text-decoration: none; }
[data-intel-depth] .tl-item .tl-links a:hover { text-decoration: underline; }

[data-intel-depth] .tl-layer-rendered { border-top: 1px solid var(--line-hair, rgba(201,210,220,.22)); margin-top: 1rem; padding-top: 0.7rem; }
[data-intel-depth] .tl-layer-rendered .ib-provenance { margin-top: 0; }

/* ============================================================
   FUTURE LAB — dated, append-only scenario horizons
   ============================================================ */
[data-intel-depth] .fl-hub {
  background: var(--bg-surface1, #121A24);
  border: 1px solid var(--line-hair, rgba(201,210,220,.22));
  border-radius: 10px;
  padding: 1.4rem 1.5rem;
  margin: 1.6rem 0;
  color: var(--text-primary, #F7F3EA);
}
[data-intel-depth] .fl-hub .fl-asof {
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 0.76rem; letter-spacing: 0.04em; color: var(--text-data, #8A94A0);
  margin-bottom: 1rem;
}
[data-intel-depth] .fl-hub .fl-asof b { color: var(--c-sand, #D7CDB4); }
[data-intel-depth] .fl-horizon {
  border: 1px dashed var(--line-forecast, #C6A15B);
  border-radius: 8px; padding: 1.15rem 1.25rem; margin-bottom: 1rem;
  position: relative;
}
[data-intel-depth] .fl-horizon .fl-h-tag {
  display: inline-flex; align-items: center; gap: 0.4rem;
  font-family: var(--mono, ui-monospace, monospace);
  font-size: 0.7rem; letter-spacing: 0.12em; text-transform: uppercase;
  color: var(--accent-gold, #C6A15B); border: 1px solid var(--line-forecast, #C6A15B);
  border-radius: 20px; padding: 0.2rem 0.6rem; margin-bottom: 0.7rem;
}
[data-intel-depth] .fl-horizon .fl-h-tag .d { font-size: 0.85rem; }
[data-intel-depth] .fl-horizon h3 {
  font-size: 1.18rem; font-weight: 600; color: var(--text-primary, #F7F3EA); margin: 0 0 0.3rem;
}
[data-intel-depth] .fl-horizon .fl-h-meta {
  font-family: var(--mono, ui-monospace, monospace); font-size: 0.76rem; letter-spacing: 0.03em;
  color: var(--text-data, #8A94A0); margin-bottom: 0.6rem; display: flex; flex-wrap: wrap; gap: 0.4rem 1rem;
}
[data-intel-depth] .fl-horizon .fl-h-meta .prob { color: var(--c-sand, #D7CDB4); }
[data-intel-depth] .fl-horizon p.fl-h-scenario { font-size: 0.93rem; line-height: 1.62; color: var(--text-secondary, #C9D2DC); margin: 0 0 0.8rem; }
[data-intel-depth] .fl-horizon .fl-assump {
  border-left: 3px solid var(--c-teal-light, #3D8278); background: var(--t-teal-d, rgba(61,130,120,.22));
  padding: 0.7rem 0.9rem; border-radius: 4px; margin-bottom: 0.7rem;
}
[data-intel-depth] .fl-horizon .fl-assump h4 { font-size: 0.72rem; letter-spacing: 0.12em; text-transform: uppercase; color: var(--c-teal-light, #3D8278); margin: 0 0 0.35rem; font-weight: 700; }
[data-intel-depth] .fl-horizon .fl-assump ul { margin: 0; padding-left: 1.1rem; font-size: 0.86rem; line-height: 1.55; color: var(--text-secondary, #C9D2DC); }
[data-intel-depth] .fl-horizon .fl-conf { font-size: 0.84rem; line-height: 1.5; color: var(--text-muted, #9CA3AF); font-style: italic; }
[data-intel-depth] .fl-horizon .fl-originals { font-family: var(--mono, ui-monospace, monospace); font-size: 0.72rem; color: var(--text-data, #8A94A0); margin-top: 0.7rem; }

[data-intel-depth] .fl-appendonly {
  font-size: 0.84rem; line-height: 1.55; color: var(--text-muted, #9CA3AF);
  border-left: 3px dashed var(--c-sand, #D7CDB4); padding-left: 0.9rem; margin-top: 0.4rem;
}
[data-intel-depth] .fl-appendonly b { color: var(--text-secondary, #C9D2DC); }

/* --- Dark is default for these surfaces; light-mode caretaking --- */
[data-theme="2100"][data-surface-mode="light"] [data-intel-depth] .ib-depth,
[data-theme="2100"][data-surface-mode="light"] [data-intel-depth] .tl-layer,
[data-theme="2100"][data-surface-mode="light"] [data-intel-depth] .fl-hub {
  background: var(--bg-surface1, #FFFFFF);
  border-color: var(--line-hair, #E3DDCF);
}
[data-theme="2100"][data-surface-mode="light"] [data-intel-depth] .ib-block,
[data-theme="2100"][data-surface-mode="light"] [data-intel-depth] .tl-item,
[data-theme="2100"][data-surface-mode="light"] [data-intel-depth] .fl-horizon { background: var(--bg-surface2, #FFFFFF); }

/* Reduced motion */
@media (prefers-reduced-motion: reduce){
  [data-intel-depth] *,[data-intel-depth] *::before,[data-intel-depth] *::after{
    animation:none!important; transition:none!important; scroll-behavior:auto!important;
  }
}

/* Responsive */
@media (max-width: 640px){
  [data-intel-depth] { padding: 0 0.2rem; }
  [data-intel-depth] .ib-depth,
  [data-intel-depth] .tl-layer,
  [data-intel-depth] .fl-hub { padding: 1.1rem; }
  [data-intel-depth] .ib-view-switch, [data-intel-depth] .tl-switch { flex-direction: column; align-items: stretch; }
  [data-intel-depth] .ib-view-btn, [data-intel-depth] .tl-btn { justify-content: center; }
}