/* Binet v2.4.1 interactive capability surface.
   Synthetic public scenarios only; no customer data or deployable artifacts. */
.interactive-shell {
  --ia-panel: #ffffff;
  --ia-panel-muted: #f7f9fc;
  --ia-border: #d6e0ec;
  --ia-border-strong: #9fb0c4;
  --ia-text: #0b1728;
  --ia-muted: #56667b;
  --ia-navy: #071526;
  --ia-blue: #2563eb;
  --ia-blue-soft: #eaf2ff;
  --ia-teal: #0f766e;
  --ia-amber: #9a5805;
  --ia-red: #b42318;
  width: min(1720px, calc(100vw - 28px));
  margin: 1.1rem auto 3.5rem;
  color: var(--ia-text);
}
.interactive-shell * { box-sizing: border-box; }
.interactive-shell button,
.interactive-shell select,
.interactive-shell input { font: inherit; }
.interactive-command {
  display: grid;
  grid-template-columns: minmax(260px,.75fr) minmax(0,1.5fr) auto;
  align-items: center;
  gap: 1rem;
  padding: 1rem 1.1rem;
  color: #fff;
  background: linear-gradient(135deg, #06111f, #0b2847 68%, #123d62);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  box-shadow: 0 22px 64px rgba(3,14,28,.22);
}
.interactive-command h1,
.interactive-command h2,
.interactive-command strong { color: #fff; }
.interactive-command p { color: #d6e5f4; }
.interactive-title { display: grid; gap: .2rem; }
.interactive-title small { color: #9edcff; font-weight: 900; text-transform: uppercase; letter-spacing: .12em; }
.interactive-title strong { font-size: clamp(1.25rem,2vw,1.75rem); letter-spacing: -.025em; }
.interactive-command-status { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: center; }
.ia-badge {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  padding: .38rem .68rem;
  border-radius: 999px;
  border: 1px solid rgba(255,255,255,.23);
  background: rgba(255,255,255,.08);
  color: #e9f3ff;
  font-size: .78rem;
  font-weight: 850;
}
.ia-badge.review { color: #ffe5a6; border-color: rgba(250,204,21,.42); }
.ia-badge.safe { color: #bff7ea; border-color: rgba(45,212,191,.38); }
.interactive-command-actions { display: flex; flex-wrap: wrap; gap: .5rem; justify-content: flex-end; }
.ia-button {
  min-height: 42px;
  border-radius: 10px;
  border: 1px solid transparent;
  padding: .64rem .92rem;
  font-weight: 850;
  cursor: pointer;
  transition: transform .15s ease, background .15s ease, border-color .15s ease;
}
.ia-button:hover { transform: translateY(-1px); }
.ia-button.primary { background: #fff; color: #071526; }
.ia-button.primary:hover { background: #eaf2ff; }
.ia-button.secondary { background: rgba(255,255,255,.08); border-color: rgba(255,255,255,.24); color: #fff; }
.ia-button.secondary:hover { background: rgba(255,255,255,.15); }
.ia-button.dark { background: #0b1f36; color: #fff; border-color: #0b1f36; }
.ia-button.dark:hover { background: #175cd3; border-color: #175cd3; }
.ia-button.light { background: #fff; color: #0b1f36; border-color: #9fb0c4; }
.ia-button.light:hover { border-color: #2563eb; color: #175cd3; }

.interactive-controls {
  display: grid;
  grid-template-columns: repeat(4,minmax(190px,1fr));
  gap: .9rem;
  margin: 1rem 0;
  padding: 1rem;
  background: var(--ia-panel);
  border: 1px solid var(--ia-border);
  border-radius: 16px;
  box-shadow: 0 8px 26px rgba(10,29,51,.07);
}
.ia-control { display: grid; gap: .38rem; min-width: 0; }
.ia-control label,
.ia-control .ia-control-label { font-size: .78rem; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; color: #42526a; }
.ia-control select {
  width: 100%;
  min-height: 44px;
  padding: .62rem .72rem;
  border: 1px solid var(--ia-border-strong);
  border-radius: 9px;
  background: #fff;
  color: var(--ia-text);
  font-weight: 720;
}
.ia-toggle-row { display: flex; flex-wrap: wrap; gap: .4rem; }
.ia-toggle {
  display: inline-flex;
  align-items: center;
  gap: .4rem;
  min-height: 38px;
  padding: .48rem .65rem;
  border: 1px solid var(--ia-border);
  border-radius: 999px;
  color: #334155;
  background: #fff;
  cursor: pointer;
  font-size: .82rem;
  font-weight: 780;
}
.ia-toggle input { accent-color: var(--ia-blue); }

.interactive-workspace {
  display: grid;
  grid-template-columns: minmax(760px,1.7fr) minmax(360px,.68fr);
  gap: 1rem;
  align-items: start;
}
.ia-panel {
  min-width: 0;
  background: var(--ia-panel);
  border: 1px solid var(--ia-border);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(10,29,51,.08);
}
.ia-panel-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 1rem;
  padding: 1rem 1.1rem .85rem;
  border-bottom: 1px solid var(--ia-border);
}
.ia-panel-header h2,
.ia-panel-header h3 { margin: 0; }
.ia-panel-header p { margin: .2rem 0 0; color: var(--ia-muted); }
.ia-panel-body { padding: 1rem 1.1rem; }

.ia-canvas-panel { overflow: hidden; }
.ia-canvas-wrap {
  position: relative;
  min-height: 620px;
  background:
    radial-gradient(circle at 10% 10%, rgba(37,99,235,.09), transparent 23rem),
    linear-gradient(180deg,#fbfdff,#f2f6fb);
}
.ia-svg { width: 100%; min-height: 620px; display: block; }
.ia-grid-line { stroke: #dce5ef; stroke-width: 1; opacity: .55; }
.ia-boundary { fill: transparent; stroke-width: 2; stroke-dasharray: 10 8; opacity: .82; }
.ia-boundary-label { font-size: 14px; font-weight: 900; letter-spacing: .04em; }
.ia-failure-domain { fill: rgba(154,88,5,.04); stroke: #b9791d; stroke-width: 2; stroke-dasharray: 4 7; opacity: .88; }
.ia-failure-label { fill: #814604; font-size: 13px; font-weight: 900; }
.ia-link { fill: none; stroke: #7990aa; stroke-width: 4; opacity: .52; transition: opacity .18s, stroke .18s, stroke-width .18s; }
.ia-link.is-active { stroke: #2563eb; stroke-width: 7; opacity: 1; filter: drop-shadow(0 0 4px rgba(37,99,235,.38)); }
.ia-link.is-muted { opacity: .12; }
.ia-link.is-security { stroke: #0f766e; }
.ia-node { cursor: pointer; transition: opacity .18s, transform .18s; transform-box: fill-box; transform-origin: center; }
.ia-node:hover,
.ia-node:focus { transform: translateY(-3px); }
.ia-node.is-muted { opacity: .22; }
.ia-node.is-active .ia-node-card { stroke: #2563eb; stroke-width: 4; filter: drop-shadow(0 10px 13px rgba(37,99,235,.2)); }
.ia-node-card { fill: #fff; stroke: #91a3b8; stroke-width: 2.2; rx: 18; }
.ia-node-header { fill: #0b1f36; rx: 15; }
.ia-node-title { fill: #fff; font-size: 15px; font-weight: 900; }
.ia-node-description { fill: #334155; font-size: 12px; font-weight: 650; }
.ia-node-type { fill: #175cd3; font-size: 11px; font-weight: 900; text-transform: uppercase; letter-spacing: .07em; }
.ia-node-marker { fill: #fff; stroke-width: 3; }
.ia-node-marker.evidence { stroke: #9a5805; }
.ia-node-marker.claim { stroke: #0f766e; }
.ia-node-marker.cyber { stroke: #b42318; }
.ia-node-marker-text { font-size: 10px; font-weight: 900; text-anchor: middle; dominant-baseline: central; }
.ia-canvas-legend {
  display: flex;
  flex-wrap: wrap;
  gap: .45rem 1rem;
  padding: .75rem 1rem;
  background: #fff;
  border-top: 1px solid var(--ia-border);
  color: #42526a;
  font-size: .78rem;
  font-weight: 750;
}
.ia-legend-item { display: inline-flex; align-items: center; gap: .38rem; }
.ia-legend-swatch { width: 14px; height: 14px; border-radius: 4px; border: 2px solid #64748b; background: #fff; }
.ia-legend-swatch.flow { border-color: #2563eb; background: #dbeafe; }
.ia-legend-swatch.trust { border-color: #0f766e; border-style: dashed; background: #e7f8f5; }
.ia-legend-swatch.failure { border-color: #9a5805; border-style: dashed; background: #fff6df; }
.ia-legend-swatch.evidence { border-color: #b42318; background: #fff0ee; }

.ia-side-rail { display: grid; gap: 1rem; }
.ia-analysis-card { border-top: 5px solid var(--ia-blue); }
.ia-analysis-card.alethia { border-top-color: var(--ia-teal); }
.ia-analysis-card.cyber { border-top-color: var(--ia-red); }
.ia-analysis-card.review { border-top-color: var(--ia-amber); }
.ia-system-label { display: flex; align-items: center; justify-content: space-between; gap: .75rem; margin-bottom: .8rem; }
.ia-system-label strong { font-size: 1.05rem; }
.ia-system-state { font-size: .72rem; font-weight: 900; text-transform: uppercase; letter-spacing: .08em; color: #175cd3; }
.ia-analysis-grid { display: grid; gap: .65rem; }
.ia-analysis-row {
  padding: .7rem .75rem;
  background: var(--ia-panel-muted);
  border: 1px solid #e1e8f0;
  border-radius: 10px;
}
.ia-analysis-row strong { display: block; margin-bottom: .18rem; font-size: .78rem; text-transform: uppercase; letter-spacing: .07em; color: #42526a; }
.ia-analysis-row p,
.ia-analysis-row ul { margin: 0; }
.ia-analysis-row ul { padding-left: 1.1rem; }
.ia-question-row { display: flex; flex-wrap: wrap; gap: .42rem; margin-top: .8rem; }
.ia-question {
  border: 1px solid #b8c5d4;
  border-radius: 999px;
  background: #fff;
  color: #0b1f36;
  padding: .46rem .65rem;
  font-size: .78rem;
  font-weight: 780;
  cursor: pointer;
}
.ia-question:hover { border-color: #2563eb; color: #175cd3; }

.ia-workflow {
  margin-top: 1rem;
  padding: 1rem;
  background: #fff;
  border: 1px solid var(--ia-border);
  border-radius: 18px;
  box-shadow: 0 10px 30px rgba(10,29,51,.08);
}
.ia-workflow-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: .85rem; }
.ia-workflow-header h2 { margin: 0; font-size: clamp(1.35rem,2vw,2rem); }
.ia-progress-bar { height: 9px; border-radius: 999px; background: #dbe5ef; overflow: hidden; margin-bottom: .85rem; }
.ia-progress-fill { height: 100%; width: 0; background: linear-gradient(90deg,#2563eb,#0f766e); transition: width .25s ease; }
.ia-workflow-steps { display: grid; grid-template-columns: repeat(5,minmax(0,1fr)); gap: .55rem; }
.ia-step {
  min-width: 0;
  min-height: 100px;
  padding: .72rem;
  border: 1px solid var(--ia-border);
  border-radius: 11px;
  background: #f8fafc;
}
.ia-step strong { display: block; margin-bottom: .2rem; font-size: .82rem; }
.ia-step small { display: block; line-height: 1.35; }
.ia-step[data-state="complete"] { border-color: #71b9a9; background: #effaf7; }
.ia-step[data-state="active"] { border-color: #2563eb; background: #eaf2ff; box-shadow: 0 0 0 3px rgba(37,99,235,.11); }
.ia-step[data-state="pending"] { opacity: .68; }

.ia-artifacts { margin-top: 1rem; }
.ia-artifact-tabs { display: flex; flex-wrap: wrap; gap: .4rem; padding: .75rem .75rem 0; }
.ia-tab {
  border: 1px solid var(--ia-border);
  background: #fff;
  color: #334155;
  padding: .52rem .72rem;
  border-radius: 9px 9px 0 0;
  font-size: .8rem;
  font-weight: 820;
  cursor: pointer;
}
.ia-tab[aria-selected="true"] { color: #fff; background: #0b1f36; border-color: #0b1f36; }
.ia-artifact-content { padding: 1rem; }
.ia-review-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: .8rem; }
.ia-review-card {
  padding: .9rem;
  border: 1px solid var(--ia-border);
  border-left: 5px solid #2563eb;
  border-radius: 12px;
  background: #fff;
}
.ia-review-card.risk { border-left-color: #9a5805; }
.ia-review-card.boundary { border-left-color: #b42318; }
.ia-review-card.trust { border-left-color: #0f766e; }
.ia-review-card h3 { margin-bottom: .45rem; font-size: 1.05rem; }
.ia-review-card p,
.ia-review-card ul { margin-bottom: 0; }
.ia-code {
  overflow: auto;
  max-height: 520px;
  padding: 1rem;
  color: #dbeafe;
  background: #071526;
  border-radius: 12px;
  font-family: var(--font-mono, ui-monospace, monospace);
  font-size: .84rem;
  line-height: 1.55;
  white-space: pre;
}
.ia-bom-grid { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: .65rem; }
.ia-bom-card { padding: .75rem; border: 1px solid var(--ia-border); border-radius: 10px; background: #fff; }
.ia-bom-card strong { display: block; }
.ia-twin-selector { display: flex; flex-wrap: wrap; gap: .45rem; margin-bottom: .8rem; }
.ia-twin-state { border: 1px solid var(--ia-border); border-radius: 999px; background: #fff; padding: .46rem .68rem; font-weight: 780; cursor: pointer; }
.ia-twin-state[aria-pressed="true"] { color: #fff; border-color: #0f766e; background: #0f766e; }
.ia-federal-table { width: 100%; border-collapse: separate; border-spacing: 0; font-size: .88rem; }
.ia-federal-table th,
.ia-federal-table td { padding: .7rem; border-bottom: 1px solid var(--ia-border); text-align: left; vertical-align: top; }
.ia-federal-table th { color: #fff; background: #0b1f36; }
.ia-federal-table th:first-child { border-radius: 9px 0 0 0; }
.ia-federal-table th:last-child { border-radius: 0 9px 0 0; }
.ia-status { display: inline-flex; padding: .26rem .46rem; border-radius: 999px; font-size: .7rem; font-weight: 900; text-transform: uppercase; letter-spacing: .05em; }
.ia-status.review { color: #754000; background: #fff0c2; }
.ia-status.public { color: #0b4f47; background: #dff7f1; }
.ia-status.blocked { color: #8f1e16; background: #ffe2dd; }

.ia-gallery { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 1rem; }
.ia-gallery-card { overflow: hidden; background: #fff; border: 1px solid var(--ia-border); border-radius: 16px; box-shadow: 0 10px 28px rgba(10,29,51,.07); }
.ia-gallery-preview { min-height: 230px; background: linear-gradient(180deg,#f9fbfd,#edf3f8); }
.ia-gallery-preview svg { display: block; width: 100%; height: 230px; }
.ia-gallery-copy { padding: 1rem; }
.ia-gallery-copy h2,
.ia-gallery-copy h3 { margin-bottom: .5rem; }
.ia-gallery-actions { display: flex; flex-wrap: wrap; gap: .45rem; margin-top: .8rem; }

.ia-home-preview { margin-top: 1rem; }
.ia-home-preview .ia-canvas-wrap { min-height: 460px; }
.ia-home-preview .ia-svg { min-height: 460px; }
.ia-home-preview .ia-side-rail,
.ia-home-preview .interactive-controls,
.ia-home-preview .ia-workflow,
.ia-home-preview .ia-artifacts { display: none; }

.ia-proof-embed .interactive-workspace { grid-template-columns: minmax(650px,1.5fr) minmax(320px,.65fr); }
.ia-proof-embed .ia-workflow { display: none; }

.ia-empty {
  padding: 1.5rem;
  border: 1px dashed var(--ia-border-strong);
  border-radius: 12px;
  color: var(--ia-muted);
  background: #f8fafc;
}

@media (max-width: 1280px) {
  .interactive-command { grid-template-columns: 1fr auto; }
  .interactive-command-status { grid-column: 1 / -1; justify-content: flex-start; }
  .interactive-controls { grid-template-columns: repeat(2,minmax(220px,1fr)); }
  .interactive-workspace,
  .ia-proof-embed .interactive-workspace { grid-template-columns: 1fr; }
  .ia-side-rail { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ia-workflow-steps { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .ia-gallery { grid-template-columns: repeat(2,minmax(0,1fr)); }
}
@media (max-width: 760px) {
  .interactive-shell { width: min(100% - 20px, 100%); margin-top: .65rem; }
  .interactive-command { grid-template-columns: 1fr; border-radius: 14px; }
  .interactive-command-status,
  .interactive-command-actions { justify-content: flex-start; }
  .interactive-controls { grid-template-columns: 1fr; }
  .ia-side-rail { grid-template-columns: 1fr; }
  .ia-canvas-wrap,
  .ia-svg { min-height: 520px; }
  .ia-workflow-steps,
  .ia-review-grid,
  .ia-bom-grid,
  .ia-gallery { grid-template-columns: 1fr; }
  .ia-panel-header { display: grid; }
  .ia-federal-table { display: block; overflow-x: auto; white-space: normal; }
  .ia-artifact-tabs { overflow-x: auto; flex-wrap: nowrap; }
  .ia-tab { min-width: max-content; }
  .ia-node-description { font-size: 11px; }
}
@media (prefers-reduced-motion: reduce) {
  .interactive-shell *,
  .interactive-shell *::before,
  .interactive-shell *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}

/* v2.4.1 application-density corrections. */
.ia-home-preview .interactive-workspace,
.ia-home-preview .ia-canvas-panel { width: 100%; grid-template-columns: 1fr; }

@media (min-width: 1281px) {
  .interactive-workspace { min-height: 760px; }
  .ia-side-rail {
    position: sticky;
    top: 84px;
    max-height: 760px;
    overflow: auto;
    padding-right: .22rem;
    scrollbar-width: thin;
    scrollbar-color: #9fb0c4 transparent;
  }
  .ia-side-rail::-webkit-scrollbar { width: 9px; }
  .ia-side-rail::-webkit-scrollbar-thumb { background: #9fb0c4; border-radius: 999px; }
}

.ia-intel-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0,1fr));
  gap: .35rem;
  padding: .4rem;
  background: #0b1f36;
  border: 1px solid #24415f;
  border-radius: 14px;
  box-shadow: 0 8px 24px rgba(10,29,51,.12);
}
.ia-intel-tabs button {
  min-height: 40px;
  padding: .48rem .3rem;
  border: 1px solid transparent;
  border-radius: 9px;
  background: transparent;
  color: #dce8f5;
  font-size: .76rem;
  font-weight: 850;
  cursor: pointer;
}
.ia-intel-tabs button:hover,
.ia-intel-tabs button:focus-visible { background: rgba(255,255,255,.1); color: #fff; }
.ia-intel-tabs button[aria-selected="true"] { background: #fff; color: #0b1f36; border-color: #d6e0ec; }
.ia-intel-panel[hidden] { display: none !important; }

@media (min-width: 1281px) {
  .ia-side-rail {
    position: sticky;
    top: 84px;
    max-height: none;
    overflow: visible;
    padding-right: 0;
  }
}
@media (max-width: 760px) {
  .ia-intel-tabs { position: sticky; top: 58px; z-index: 4; }
  .ia-canvas-wrap { overflow-x: auto; overscroll-behavior-inline: contain; }
  .ia-canvas-wrap .ia-svg { width: 900px; max-width: none; }
}