/* Shared live report and homepage structure, served as /report.css.
   Keep usable without the report-only HappyAI layer in visual.css. */
:root {
  font-family:Inter,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;
  color:#e9f1ed;
  background:#091610;
  font-synthesis:none
}
* {
  box-sizing:border-box
}
body {
  margin:0;
  background:radial-gradient(circle at 66% -25%,#244c39 0,transparent 44%),#091610
}
button,input,select {
  font:inherit
}
button {
  cursor:pointer
}
button:focus-visible,input:focus-visible,select:focus-visible {
  outline:2px solid #a9f2b9;
  outline-offset:3px
}
.shell {
  min-height:100vh
}
.topbar {
  height:76px;
  padding:0 clamp(22px,4vw,68px);
  border-bottom:1px solid #ffffff16;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  background:#0a1812b8
}
.brand {
  display:flex;
  align-items:center;
  gap:13px;
  font-size:18px;
  font-weight:730;
  letter-spacing:-.03em
}
.brand small {
  display:block;
  color:#83a895;
  font-size:10px;
  font-weight:600;
  letter-spacing:.16em;
  text-transform:uppercase;
  margin-top:3px
}
.brand-symbol {
  width:39px;
  height:39px;
  display:grid;
  place-items:center;
  border-radius:12px;
  background:#b9f5c9;
  color:#143825;
  font-size:27px
}
.header-controls {
  display:flex;
  align-items:center;
  gap:18px
}
.demo-badge {
  border:1px solid #7ad6a553;
  background:#1d54372d;
  color:#9aebba;
  border-radius:100px;
  padding:7px 12px;
  font-size:11px;
  font-weight:760;
  letter-spacing:.04em
}
.company-picker {
  color:#9bb7a6;
  font-size:11px;
  font-weight:700;
  display:flex;
  align-items:center;
  gap:10px
}
.company-picker select {
  appearance:none;
  background:#173226;
  color:#e6f6ec;
  border:1px solid #446b53;
  border-radius:9px;
  padding:9px 30px 9px 11px;
  font-size:12px;
  max-width:240px
}
main {
  max-width:1600px;
  margin:auto;
  padding:0 clamp(22px,4vw,68px) 80px
}
.intro {
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  padding:54px 0 22px
}
.eyebrow {
  color:#9fdfb0;
  font-size:10px;
  letter-spacing:.18em;
  font-weight:850;
  text-transform:uppercase
}
.intro h1 {
  font-size:clamp(34px,4vw,60px);
  margin:15px 0 13px;
  color:#f3faf3
}
.intro p {
  font-size:14px;
  line-height:1.65;
  color:#a9c2b2;
  max-width:760px;
  margin:0
}
.status {
  font-size:11px;
  color:#88aa95;
}
.metrics {
  grid-template-columns:repeat(4,1fr);
}
.metric strong {
  display:block;
  letter-spacing:-.04em
}
.metric span {
  display:block;
  margin-top:5px
}
.report-layout {
  display:grid;
  grid-template-columns:minmax(0,1fr) 345px;
  gap:16px;
  align-items:stretch
}
.graph-panel,.detail-panel {
  background:#f6f7f1;
  color:#1c3026;
  border:1px solid #dae8dd;
  border-radius:20px;
  box-shadow:0 28px 90px #0003
}
.graph-panel {
  padding:24px 24px 18px;
  min-width:0
}
.section-head {
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px
}
.section-head h2 {
  font-size:22px;
  letter-spacing:-.035em;
  margin:5px 0 0
}
.graph-panel .eyebrow,.highlights .eyebrow {
  color:#43825d
}
.quiet-button {
  border:1px solid #d4e1d5;
  background:#fff;
  color:#456650;
  border-radius:8px;
  padding:8px 11px;
  font-size:11px;
  font-weight:700
}
.section-intro {
  color:#698071;
  font-size:12px;
  line-height:1.5;
  margin:11px 0 16px
}
.graph-toolbar {
  display:flex;
  justify-content:space-between;
  gap:14px
}
.graph-search-label {
  font-weight:760;
  min-width:210px
}
.graph-search-label input {
  display:block;
  margin-top:5px;
  width:100%;
  border:1px solid #d2e0d4;
  background:#fff;
  color:#213e2c;
  border-radius:8px;
  padding:9px 10px;
}
.graph-filters {
  display:flex;
  gap:6px;
  flex-wrap:wrap;
}
.filter-chip {
  display:flex;
  align-items:center;
  gap:5px;
  border:1px solid #dce7dc;
  background:#fff;
  border-radius:7px;
  padding:6px 8px;
  color:#56715b;
  white-space:nowrap
}
.filter-chip input {
  accent-color:#327e50;
  margin:0
}
#graph {
  width:100%;
  border-radius:13px;
  margin-top:15px;
  border:1px solid #e0eadf
}
.graph-bottom {
  justify-content:space-between;
  align-items:flex-start;
  gap:16px;
  padding-top:15px
}
.graph-legend {
  display:flex;
  flex-wrap:wrap;
}
.legend-item {
  display:flex;
  align-items:center;
  gap:5px
}
.legend-dot {
  background:var(--dot)
}
.graph-object-list {
  flex-wrap:wrap;
  justify-content:flex-end;
  gap:5px;
}
.graph-object-list button {
  background:transparent;
  color:#456f51;
  border:0;
  font-size:10px;
  padding:3px 4px
}
.graph-object-list button:hover {
  text-decoration:underline
}
.detail-panel {
  padding:25px;
  min-height:620px;
  overflow:auto
}
.detail-empty {
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  height:100%;
  color:#6c8772
}
.detail-orbit {
  font-size:62px;
  color:#9ecbab
}
.detail-empty h2 {
  margin:15px 0 6px;
  color:#2c5237
}
.detail-empty p {
  font-size:12px;
  line-height:1.6;
  max-width:230px
}
.detail-type {
  font-size:10px;
  color:#538b61;
  letter-spacing:.15em;
  font-weight:850;
  text-transform:uppercase
}
.detail-panel h2 {
  font-size:24px;
  letter-spacing:-.035em;
  line-height:1.16;
  margin:12px 0
}
.detail-panel p {
  font-size:13px;
  color:#607567;
  line-height:1.6
}
.detail-links {
  border-top:1px solid #dae8dd;
  margin-top:25px;
  padding-top:17px
}
.detail-links strong {
  font-size:11px;
  color:#456c51
}
.detail-links button {
  display:block;
  text-align:left;
  border:0;
  background:none;
  color:#3d7650;
  font-size:12px;
  padding:8px 0
}
.detail-action {
  border:0;
  border-radius:9px;
  background:#d8efdb;
  color:#245c37;
  font-size:12px;
  font-weight:780;
  padding:10px 12px;
  margin-top:14px
}
.highlights {
  margin-top:32px
}
.highlights h2 {
  color:#f2faf2
}
.highlight-grid {
  display:grid;
  grid-template-columns:repeat(3,1fr);
  gap:12px;
  margin-top:15px
}
.highlight-card {
  background:#14291c;
  border:1px solid #35543d;
  border-radius:15px;
  padding:18px
}
.highlight-card .num {
  font-size:10px;
  color:#a1d4a6;
  font-weight:850;
  letter-spacing:.15em
}
.highlight-card p {
  font-size:13px;
  color:#bdd6c1;
  line-height:1.55;
  margin:9px 0 0
}
footer {
  padding:28px 68px;
  color:#6b8975;
  font-size:11px;
  text-align:center;
  border-top:1px solid #ffffff10
}
@media(max-width:1050px) {
  .detail-panel {
    min-height:250px
  }
  .highlight-grid {
    grid-template-columns:1fr 1fr
  }
}
@media(max-width:700px) {
  .topbar {
    height:auto;
    padding:16px 20px;
    align-items:flex-start
  }
  .intro {
    display:block;
  }
  .status {
    margin-top:12px
  }
  .metrics {
    grid-template-columns:1fr 1fr
  }
  .graph-panel {
    padding:17px
  }
  .graph-toolbar {
    display:block
  }
  .graph-search-label {
    display:block
  }
  .graph-object-list {
    justify-content:flex-start;
  }
  .highlight-grid {
    grid-template-columns:1fr
  }
  footer {
    padding:25px
  }
}
.claim-status {
  display:inline-flex;
  border-radius:6px;
  padding:5px 8px;
  font-size:10px;
  font-weight:760;
  line-height:1.25
}
.claim-status.supported {
  background:#e5f5e9;
  color:#32704a
}
.claim-status.hypothesis {
  background:#fff0d6;
  color:#8b641b
}
.detail-evidence {
  border-top:1px solid #dce8dd;
  margin-top:20px;
  padding-top:16px
}
.evidence-buttons {
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  margin-top:11px
}
.evidence-buttons button {
  border:1px solid #cae0d0;
  border-radius:7px;
  background:#eff9f0;
  color:#366e49;
  padding:6px 8px;
  font-size:11px
}
.evidence-buttons button:hover {
  background:#ddf2e1
}
.no-evidence {
  display:block;
  font-size:11px;
  margin-top:10px
}
.report-tabs {
  display:flex;
  gap:4px;
  overflow:auto;
  border-bottom:1px solid #44634b;
}
.report-tabs button {
  border:0;
  border-bottom:2px solid transparent;
  background:transparent;
  color:#96b29d;
  padding:15px 18px;
  font-size:13px;
  font-weight:740;
  white-space:nowrap
}
.report-tabs button:hover,.report-tabs button.active {
  color:#d4f8d9
}
.report-tabs button.active {
  border-color:#8ad9a0
}
.section-content {
  padding:25px 0 15px;
  min-height:300px
}
.section-title {
  margin:0 0 18px
}
.section-title h2,.section-story h2 {
  color:#f4fbf4;
  font-size:28px;
  letter-spacing:-.035em;
  margin:6px 0
}
.section-title p {
  color:#a2bda8;
  font-size:13px;
  line-height:1.6
}
.secondary-title {
  margin-top:35px
}
.section-grid,.report-columns {
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:17px
}
.section-story {
  border:1px solid #36583f;
  background:#13281b;
  border-radius:16px;
  padding:23px;
  min-height:220px
}
.section-story>p {
  color:#bdd5c0;
  line-height:1.7;
  font-size:14px
}
.story-note {
  color:#91b19a;
  font-size:11px;
  line-height:1.55;
  border-top:1px solid #43624a;
  padding-top:14px;
  margin-top:18px
}
.compact-step {
  display:flex;
  gap:12px;
  padding:10px 0;
  border-top:1px solid #31513b
}
.compact-step b {
  background:#c9efce;
  color:#255a35;
  border-radius:50%;
  width:24px;
  height:24px;
  flex:0 0 24px;
  display:grid;
  place-items:center;
  font-size:11px
}
.compact-step strong {
  font-size:12px
}
.compact-step p {
  color:#a1bea9;
  font-size:11px;
  margin:4px 0
}
.report-card {
  background:#f6f8f3;
  color:#273b2d;
  border:1px solid #dbe8dc;
  border-radius:14px;
  padding:20px;
  margin-bottom:11px
}
.report-card-head {
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:14px
}
.report-card h3 {
  font-size:17px;
  letter-spacing:-.02em;
  line-height:1.3;
  margin:4px 0 8px
}
.report-card p {
  font-size:12px;
  color:#5a715e;
  line-height:1.6;
  margin:4px 0 0
}
.card-kicker {
  font-size:10px;
  color:#63946f;
  font-weight:800;
  letter-spacing:.07em;
  text-transform:uppercase
}
.report-card .claim-status {
  flex:0 0 auto
}
.report-list {
  max-width:1050px
}
.people-section {
  display:grid;
  grid-template-columns:310px minmax(0,1fr);
  gap:16px
}
.people-directory,.person-profile {
  background:#f6f8f3;
  color:#253c2d;
  border-radius:15px;
  padding:17px;
  border:1px solid #dce8de
}
.people-directory {
  max-height:650px;
  overflow:auto
}
.person-row {
  width:100%;
  display:block;
  text-align:left;
  border:0;
  border-bottom:1px solid #dfe9df;
  background:transparent;
  padding:11px 7px;
  color:#294335
}
.person-row:hover,.person-row.active {
  background:#e2f1e5
}
.person-row strong,.person-row span {
  display:block
}
.person-row strong {
  font-size:13px
}
.person-row span {
  font-size:11px;
  margin-top:3px
}
.person-profile {
  padding:25px
}
.person-profile h3 {
  font-size:26px;
  margin:8px 0
}
.person-profile h4 {
  font-size:11px;
  color:#4d8560;
  letter-spacing:.1em;
  text-transform:uppercase;
  margin:22px 0 4px
}
.person-profile p {
  font-size:13px;
  line-height:1.6;
  color:#5c7061
}
.empty-profile {
  display:grid;
  place-items:center;
  color:#718573
}
.primary-action {
  display:block;
  background:#24794a;
  color:#fff;
  border:0;
  border-radius:9px;
  padding:11px 13px;
  font-size:12px;
  font-weight:760;
  margin-top:22px
}
.dialogue-placeholder {
  background:#f2f7f0;
  color:#627967;
  border-radius:13px;
  padding:28px;
  font-size:13px
}
.dialogue-messages {
  max-width:950px;
  background:#f4f7f1;
  border-radius:16px;
  padding:21px
}
.dialogue-message {
  max-width:82%;
  background:#e6efe5;
  border-radius:11px;
  padding:11px 14px;
  margin:12px 0;
  color:#344c38
}
.dialogue-message.interviewer {
  margin-left:auto;
  background:#d8ebdc
}
.dialogue-message[data-highlighted="true"] {
  background:#fff1c9;
  outline:3px solid #dfb84b
}
.dialogue-message .speaker {
  font-size:10px;
  text-transform:uppercase;
  font-weight:760;
  color:#619071
}
.dialogue-message p {
  font-size:13px;
  line-height:1.6;
  margin:5px 0 0
}
@media(max-width:800px) {
  .section-grid,.report-columns {
    grid-template-columns:1fr
  }
  .people-section {
    grid-template-columns:1fr
  }
  .people-directory {
    max-height:250px
  }
  .report-card-head {
    display:block
  }
  .report-card .claim-status {
    margin:5px 0
  }
}
/* The graph is a readable map first; movement is limited to the opening reveal. */
#graph {
  background:radial-gradient(circle at 48% 50%,#1b4230 0%,#10271c 58%,#0b1d14 100%);
  border-color:#365f44
}
.graph-object-list {
  display:block;
}
.quick-departments {
  display:flex;
  flex-wrap:wrap;
  gap:4px
}
.object-browser {
  margin-top:8px;
  font-size:11px;
  color:#3e7651
}
.object-browser summary {
  font-weight:750
}
.object-browser>div {
  max-height:115px;
  overflow:auto;
  margin-top:7px;
  padding:8px;
  background:#e9f2e8;
  border-radius:7px;
  justify-content:flex-end;
}
.object-browser button {
  border:1px solid #d1e1d1;
  border-radius:6px;
  background:#fff
}
@media(max-width:700px) {
  .topbar {
    flex-wrap:wrap
  }
  .header-controls {
    width:100%;
    display:flex;
    justify-content:space-between;
    align-items:center;
    text-align:left
  }
  .company-picker {
    margin-top:0
  }
  .company-picker select {
    max-width:190px
  }
  .quick-departments,.object-browser>div {
    justify-content:flex-start
  }
  .report-tabs button {
    padding:13px 11px
  }
  .intro h1 {
    overflow-wrap:anywhere
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto!important;
    animation-duration:0.01ms!important;
    transition-duration:0.01ms!important
  }
}
.highlight-card .claim-status,.compact-step .claim-status {
  margin-top:10px
}
.highlight-card .evidence-buttons button,.compact-step .evidence-buttons button {
  background:#234a2e;
  border-color:#548361;
  color:#e1f5e3
}
.highlight-card .evidence-buttons button:hover,.compact-step .evidence-buttons button:hover {
  background:#32623d
}
.highlight-card .no-evidence,.compact-step .no-evidence {
  color:#a7bfa9
}
.legend-department {
  border-radius:2px
}
.legend-task {
  border-radius:0;
  transform:rotate(45deg)
}
.legend-process {
  clip-path:polygon(25% 0,75% 0,100% 50%,75% 100%,25% 100%,0 50%)
}
.legend-learning-group {
  clip-path:polygon(50% 0,100% 100%,0 100%)
}
.legend-contradiction {
  clip-path:polygon(0 0,50% 45%,100% 0,75% 100%,25% 100%)
}
.legend-roadmap {
  clip-path:polygon(50% 0,100% 38%,82% 100%,18% 100%,0 38%)
}
.legend-automation {
  border-radius:35% 35% 25% 25%
}