/* Cause-Finder website theme, inspected 2026-10-21.
   Brand tokens retain the public site's HSL values. Layout belongs to this local app. */
:root{
  color-scheme:dark;
  --cf-main:hsl(217 88% 6%);
  --cf-section:hsl(215 87% 12%);
  --cf-card:hsl(213 85% 15%);
  --cf-blue:hsl(210 100% 40%);
  --cf-electric:hsl(203 100% 50%);
  --cf-lime:hsl(69 80% 50%);
  --cf-border:hsl(214 40% 22%);
  --cf-text:hsl(216 30% 92%);
  --cf-muted:hsl(216 30% 84%);
  --navy:var(--cf-main);--ink:var(--cf-text);--muted:var(--cf-muted);
  --bg:var(--cf-main);--paper:var(--cf-card);--line:var(--cf-border);
  --green:#43baff;--mint:var(--cf-electric);--violet:var(--cf-lime);
  --purple-bg:#202e22;--orange:#e7c580;
  font-family:Inter,Arial,sans-serif;
}
body{background:var(--cf-main);color:var(--cf-text)}
h1,h2,h3,h4{color:#fff;font-weight:700;letter-spacing:-.025em}
h1{font-weight:800}a{color:#43baff}p{color:var(--cf-muted)}
button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible{outline-color:var(--cf-lime)}
.skip{background:var(--cf-section);color:white}
.sidebar{background:#080f20;border-right:1px solid var(--cf-border)}
.brand{display:flex;flex-direction:column;align-items:center;gap:11px;letter-spacing:0}
.brand img{display:block;width:174px;max-width:100%;height:auto;object-fit:contain}
.brand small{font-size:7px;letter-spacing:1.3px;color:#a8bad0;text-align:center}
.workspace-label{margin-top:34px;color:#8da5c1}
nav a{color:#b9c9df}nav a.active{background:var(--cf-card);color:#43baff;box-shadow:inset 3px 0 var(--cf-electric)}
nav a:hover{background:#0c2442;color:#fff}
.sidebar-bottom{color:#d5dfec}.sidebar-bottom small,.edition{color:#9bb0c9}
.local-dot{background:var(--cf-lime);box-shadow:0 0 8px #c8e51b30}
.sidebar-link{color:#43baff}.edition{border-color:var(--cf-border)}
.topbar{background:#080f20;border-color:var(--cf-border);color:#a9bdd4}
.topbar strong{color:#d3deee}.topbar span:not(.local-pill):not(.avatar){color:#6c87a5}
.local-pill{background:#12261d;color:#d4e766;border-color:#52672c}
.avatar{background:var(--cf-card);color:#48bcff;border:1px solid var(--cf-border)}
.eyebrow{color:var(--cf-electric)}
.button,.button:visited{background:var(--cf-section);color:#e8eff8;border-color:#294568;border-radius:999px}
.button.primary{background:var(--cf-blue);border-color:var(--cf-blue);color:#fff;box-shadow:0 4px 18px #009dff15}
.button.light{background:var(--cf-lime);border-color:var(--cf-lime);color:var(--cf-main);font-weight:700;box-shadow:0 0 20px -5px #c8e51b4d}
.button.dark{background:var(--cf-blue);border-color:var(--cf-blue)}
.button.ghost{background:transparent;color:#e3eaf5;border-color:#2d4a6c}
.button:hover{filter:brightness(1.12)}
.hero{background-color:var(--cf-main);background-image:radial-gradient(#009dff29 .8px,transparent .8px),linear-gradient(115deg,#06152c99,#030e1f);background-size:24px 24px,100% 100%;border:1px solid #1f4565;box-shadow:0 0 35px -20px #009dff55;padding-top:37px;padding-bottom:37px}
.hero h2{font-size:33px;font-weight:800;color:white}.hero .eyebrow{color:#43baff}.hero p{color:var(--cf-muted)}
.mint{color:var(--cf-electric)}
.orbit{border-color:#164c70}.orbit.inner{border-color:#35674f}
.core{width:156px;height:106px;background:#05162e;border:1px solid #1f5f7a;border-radius:16px;transform:none;box-shadow:0 0 26px #009dff14}
.core img{width:134px;height:auto;display:block}
.orbit-label{border-color:#245172;background:#082344;color:#dbe8f5}.orbit-label.b{color:#d5e977}
.stat,.card,.question,.skill-rating,.source-item,.journey-node,.mapping-node{background:var(--cf-card);border-color:var(--cf-border)}
.stat strong{color:white}.stat small,.stat .label{color:#b1c4dc}
.card{box-shadow:0 5px 20px #0000000a}
.role-card.selected{border-color:var(--cf-electric);box-shadow:0 0 0 1px var(--cf-electric),0 0 24px #009dff15}
.role-card .card-footer{border-color:var(--cf-border)}
.icon-tile{background:#04172c;border:1px solid #205577;color:var(--cf-electric)}
.icon-tile.purple{background:#16291f;color:var(--cf-lime);border-color:#455b30}
.icon-tile.orange{background:#1d2732;color:#e1c27b;border-color:#5e5334}
.badge{background:#0a3455;color:#82d1ff;border:1px solid #205474}
.badge.purple{background:#26331a;color:#d0e478;border-color:#4d612a}
.badge.orange{background:#352c1b;color:#ebcd87;border-color:#625136}
.badge.neutral{background:#0b1b31;color:#b7cbe2;border-color:#263e5c}
.badge.blue{background:#0d355f;color:#a5d4ff;border-color:#295783}
.callout{background:#082741;border-color:#245678;color:#c6dbea}
.callout strong{color:#f4f8ff}.callout.purple{background:#192c26;border-color:#40573e}
.step-list .number,.section-number{background:#0a2a48;border:1px solid #235270;color:#4ac0ff}
.filters,.table-wrap{background:var(--cf-section);border-color:var(--cf-border)}
input,select,textarea{background:#04172d;border-color:#35516f;color:#e4edf9}
input::placeholder,textarea::placeholder{color:#97abc3}
input[type=checkbox],input[type=radio]{accent-color:var(--cf-lime)}
.assessment-progress,.bar-track{background:#173553}.assessment-progress div{background:var(--cf-electric)}
.question label:has(input:checked){background:#0b3a60;box-shadow:inset 2px 0 var(--cf-electric)}
.question .explanation{background:#061a32;color:#c2d5e9}
.sticky-action{background:#04172d;border:1px solid #2b5977;box-shadow:0 6px 25px #0006}
.bar-fill{background:var(--cf-electric)}.bar-fill.purple{background:var(--cf-lime)}
.detail-hero{background:linear-gradient(120deg,#082747,#04182d);border-color:#246080}
.journey-node small{color:#43baff}.journey-node:not(:last-child):after{color:var(--cf-electric)}
.timeline{border-color:#27516c}.timeline-stage:before{background:var(--cf-lime);border-color:var(--cf-main)}
.module.completed{background:#102d2d;border-color:#335c43}.module.completed .module-head h3{color:#d2e880}
.module .evidence{border-color:var(--cf-border)}
th{background:#061c36;color:#91bce3}td,th{border-color:var(--cf-border)}
.research-lead{background:linear-gradient(120deg,#082747,#04172c);border:1px solid #24577c}
.research-lead p{color:#c6d5e6}.research-lead a{color:#65c8ff}
.empty{background:var(--cf-section);border-color:#355270}
.mapping-context,.notice{background:#272d20;border-color:#566139;color:#dbe1b9}
.matrix .coverage{background:#0a2945;color:#bcd1e9}
.assessment-done,.mini-metric,.link-button{color:#43baff}
.page-footer{background:#080f20;color:#9bb0c9;border-color:var(--cf-border)}
.accent-line{background:linear-gradient(90deg,var(--cf-electric),var(--cf-lime))}
#toast{background:#082747;border:1px solid #2a6289;color:#eff7ff}
.spotlight{background:linear-gradient(135deg,#092a4b,#142c2c);border-color:#2d5664}.spotlight .eyebrow{color:var(--cf-lime)}
@media(max-width:760px){.brand{align-items:flex-start;gap:7px}.brand img{width:146px}.brand small{text-align:left;font-size:7px}.hero h2{font-size:28px}.sidebar{border-right:0;border-bottom:1px solid var(--cf-border)}}
@media print{
 :root{color-scheme:light;--ink:#182637;--muted:#4e5c6b;--bg:#fff;--paper:#fff;--line:#d6dce2;--green:#075c70}
 body{background:white!important;color:#182637!important}h1,h2,h3,h4,.stat strong{color:#132c42!important}
 p,.stat small,.stat .label,.subtle,.inline-note{color:#43566a!important}
 .card,.stat,.question,.skill-rating,.source-item,.journey-node,.mapping-node,.detail-hero,.research-lead,.hero,.callout,.notice,.mapping-context,.table-wrap{background:white!important;background-image:none!important;color:#182637!important;border-color:#d1dce2!important;box-shadow:none!important}
 .badge,.badge.purple,.badge.orange,.badge.neutral{background:#edf2f6!important;color:#24475b!important;border-color:#cddae3!important}
 th{background:#edf2f6!important;color:#24475b!important}a{color:#075c70!important}
 .bar-track{background:#e1e8ed!important}.bar-fill{background:#0066cc!important}.bar-fill.purple{background:#779520!important}
 .callout strong{color:#182637!important}.module.completed .module-head h3{color:#36551d!important}
}

/* Shared app shell and interaction rhythm. See DESIGN.md. */
:root {
  --cf-shell: #080f20;
  --cf-focus: #d7f24d;
  --cf-action-size: 2.75rem;
  --cf-gutter: clamp(1rem, 3vw, 3rem);
  --cf-motion: 150ms;
}
.sidebar-toggle { display: none; }
::selection { background: var(--cf-lime); color: var(--cf-main); }
:where(a[href], button, input, select, textarea, summary, [tabindex]):focus-visible {
  outline: 2px solid var(--cf-focus);
  outline-offset: 3px;
}
#content:focus-visible { outline-offset: -3px; }
.view-heading h1, .hero h2, .section-head h2 { text-wrap: balance; }
.view-heading h1 { margin-block: 0 .45rem; line-height: 1.12; }
.view-heading p, .hero p { max-inline-size: 65ch; }
.view-heading p { font-size: 1rem; }
.button, .sidebar-toggle, .nova-launch { min-block-size: var(--cf-action-size); }
.button, .sidebar-toggle, .nova-launch, .sidebar nav a { touch-action: manipulation; }
.button:active:not(:disabled), .nova-launch:active:not(:disabled) { transform: translateY(1px); }
.button:disabled { cursor: default; }
@media (prefers-reduced-motion: no-preference) {
  .button, .nova-launch { transition: transform var(--cf-motion) ease-out; }
}
@media (prefers-reduced-motion: reduce) {
  .button, .nova-launch, .sidebar nav a { transition: none; }
  .button:active:not(:disabled), .nova-launch:active:not(:disabled) { transform: none; }
}
@media screen {
  .sidebar { background: var(--cf-shell); }
  .topbar { min-block-size: 4rem; height: auto; padding: .6rem var(--cf-gutter); }
  .topbar strong { font-size: .875rem; }
  main { padding: 2rem var(--cf-gutter) 3.5rem; }
  .view-heading { margin-block-end: 1.5rem; }
  .hero {
    align-items: center;
    padding: clamp(1.25rem, 3vw, 2.75rem);
    grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr);
    background-image: radial-gradient(#219ae622 .8px, transparent .8px), linear-gradient(115deg,#0a203a,#050f22);
    box-shadow: none;
  }
  .hero h2 { font-size: clamp(1.65rem, 1.15rem + 1.25vw, 2.5rem); line-height: 1.15; margin-block: 0 .9rem; }
  .hero h2 .mint { display: block; color: #58c8ff; }
  .hero p { font-size: .9375rem; line-height: 1.6; margin-block: 0 1.2rem; }
  .hero-art { min-block-size: 13rem; }
  .hero-art .orbit { inline-size: 13rem; block-size: 13rem; }
  .hero-art .orbit.inner { inline-size: 9rem; block-size: 9rem; }
  .stats {
    grid-template-columns: repeat(4, minmax(0,1fr));
    gap: 0;
    border: 1px solid var(--cf-border);
    border-radius: .875rem;
    overflow: hidden;
  }
  .stat { border: 0; border-radius: 0; padding: .9rem 1rem; background: #091b32; }
  .stat + .stat { border-inline-start: 1px solid var(--cf-border); }
  .stat strong { font-variant-numeric: tabular-nums; }
  .stat small { line-height: 1.35; }
  .sidebar nav { padding: .2rem .25rem .2rem .15rem; scrollbar-color: #365678 transparent; }
  .sidebar nav a { min-block-size: 2.35rem; }
  .sidebar-bottom { padding-block-start: .85rem; }
  .page-footer { padding-block-end: 4.5rem; }
  .sticky-action { position: static; }
}
@media screen and (min-width: 961px) and (max-height: 820px) {
  .sidebar { padding-block: 1rem; }
  .sidebar .brand img { width: 140px; }
  .sidebar .workspace-label { margin-block-start: 1.1rem; }
  .sidebar-bottom .edition { display: none; }
}
@media screen and (max-width: 960px) {
  .sidebar {
    position: static;
    width: auto;
    display: grid;
    grid-template-columns: minmax(0,1fr) auto;
    gap: .55rem 1rem;
    align-items: center;
    padding: .6rem var(--cf-gutter);
    border-right: 0;
    border-bottom: 1px solid var(--cf-border);
  }
  .brand { align-items: flex-start; justify-self: start; gap: .15rem; }
  .brand img { width: 7rem; }
  .brand small { text-align: left; }
  .workspace-label, .sidebar-bottom { display: none; }
  .main-wrap { margin: 0; }
  .sidebar-toggle { display: inline-flex; align-items: center; gap: .4rem; }
  .sidebar-toggle svg { width: 1rem; fill: none; stroke: currentColor; stroke-width: 2; }
  .sidebar nav {
    grid-column: 1 / -1;
    display: grid;
    grid-template-columns: repeat(2,minmax(0,1fr));
    gap: .25rem;
    margin: 0;
    padding: .2rem;
    overflow: visible;
  }
  .sidebar-toggle[aria-expanded="false"] + nav { display: none; }
  .sidebar nav a { min-block-size: var(--cf-action-size); font-size: .8125rem; margin: 0; }
}
@media screen and (max-width: 600px) {
  main { padding-block-start: 1.45rem; }
  .topbar { min-block-size: 2.75rem; }
  .topbar .nova-global, .topbar .local-pill { display: none; }
  .hero { grid-template-columns: 1fr; }
  .hero-art { display: none; }
  .stats { grid-template-columns: repeat(2,minmax(0,1fr)); }
  .stat:nth-child(odd) { border-inline-start: 0; }
  .stat:nth-child(n+3) { border-block-start: 1px solid var(--cf-border); }
}
@media screen and (max-width: 350px) {
  .sidebar nav { grid-template-columns: 1fr; }
}
@media print {
  .sidebar-toggle, .skip { display: none; }
}
.academy-back { display: block; margin-block: .65rem; font-size: .8125rem; }
@media screen and (max-width: 960px) {
  .sidebar .brand { grid-column: 1; grid-row: 1; }
  .sidebar-toggle { grid-column: 2; grid-row: 1; }
  .academy-back { grid-column: 1 / -1; margin: 0; }
}
@media screen {
  .hero-art .orbit-label.a { inset: 0 auto auto 0; }
  .hero-art .orbit-label.b { inset: 0 0 auto auto; }
  .hero-art .orbit-label.c { inset: auto auto 0 0; }
}
@media screen and (max-width: 1150px) {
  .hero-art .orbit-label { padding: .35rem .5rem; font-size: .57rem; }
}
@media screen and (max-width: 760px) {
  .hero { grid-template-columns: 1fr; }
}
@media screen and (max-width: 600px) {
  .nova-widget .nova-launch { padding: .3rem; }
  .nova-widget .nova-launch > span:nth-child(2) {
    position: absolute;
    inline-size: 1px;
    block-size: 1px;
    overflow: hidden;
    clip-path: inset(50%);
    white-space: nowrap;
  }
  .nova-widget .nova-launch > span:last-child { display: none; }
}
@media screen {
  .brand small { font-size: .6875rem; letter-spacing: .055em; }
  .sidebar-bottom small, .edition, .topbar, .page-footer { font-size: .6875rem; }
  .topbar, .edition, .page-footer { letter-spacing: .075em; }
  .local-dot { box-shadow: none; }
  .button.light { box-shadow: 0 4px 14px #0003; }
}
.roadmap-filters #target-role { flex: 1; min-inline-size: 12rem; max-inline-size: none; }
@media screen and (max-width: 600px) {
  .roadmap-filters #target-role { flex-basis: 100%; min-inline-size: 0; }
}

@media screen {
  body[data-view="assessment"] .topbar .nova-global { display: none; }
  .sidebar nav { scrollbar-gutter: stable; }
  .crosswalk-scroll { display: none; }
  .crosswalk-table table { min-inline-size: 36rem; }
  .crosswalk-table:focus-visible { outline-offset: -3px; }
  .roadmap-next { margin-block: 1rem; }
}
@media screen and (min-width: 961px) and (max-height: 980px) {
  .sidebar .brand img { width: 145px; }
  .sidebar .workspace-label { margin-block-start: 1rem; }
  .sidebar-bottom small, .sidebar-bottom .edition { display: none; }
}
@media screen and (max-width: 650px) {
  .crosswalk-scroll { display: block; font-size: .8125rem; margin-block: 0 .65rem; }
}

.training-spotlight {
  padding: clamp(1rem, 2vw, 1.5rem);
  border: 1px solid #426758;
  border-radius: .875rem;
  background: #0b242e;
}
.training-spotlight h3 { margin-block-start: 0; color: #e0f393; }
#provider-title { scroll-margin-block-start: 1rem; }

.journey-map {
  margin-block: 1.25rem;
  background: var(--cf-section);
}
.journey-map .section-head { flex-wrap: wrap; gap: .75rem; }
.journey-views { display: flex; gap: .35rem; }
.journey-views .button, .journey-detail .button, .journey-skill .button {
  min-height: var(--cf-action-size);
  white-space: normal;
  text-align: start;
}
.journey-views [aria-pressed="true"] { border-color: var(--cf-electric); }
.journey-position strong { color: var(--cf-lime); }
.journey-route, .journey-skills, .journey-activities {
  list-style: none;
  padding: 0;
  margin: 0;
}
.journey-route { display: grid; gap: .55rem; }
.journey-stop {
  display: flex;
  align-items: center;
  gap: .75rem;
  position: relative;
  isolation: isolate;
  width: 100%;
  min-height: 3.75rem;
  padding: .45rem .65rem;
  text-align: start;
  background: var(--cf-main);
  color: inherit;
  border: 1px solid transparent;
  border-radius: .6rem;
  cursor: pointer;
}
.journey-stop[aria-expanded="true"], .journey-stop:hover { border-color: var(--cf-electric); }
.journey-stop small { display: block; margin-top: .15rem; }
.journey-stop[aria-current="step"] small { color: var(--cf-lime); }
.journey-node-marker {
  display: grid;
  place-items: center;
  flex: 0 0 2rem;
  height: 2rem;
  border-radius: 50%;
  border: 1px solid var(--cf-electric);
  background: var(--cf-main);
  font-variant-numeric: tabular-nums;
}
.journey-stop[data-done="true"] .journey-node-marker {
  background: var(--cf-lime);
  border-color: var(--cf-lime);
  color: var(--cf-main);
}
.journey-stop[aria-current="step"] .journey-node-marker { outline: 2px solid var(--cf-lime); outline-offset: 3px; }
.journey-route > li:not(:last-child) .journey-stop::before {
  content: "";
  position: absolute;
  z-index: -1;
  inset: 50% auto -.8rem calc(.65rem + 1rem);
  width: 2px;
  background: var(--cf-electric);
  opacity: .35;
  transform-origin: top;
}
.journey-route > li:not(:last-child) .journey-stop[data-done="true"]::before {
  background: var(--cf-lime);
  opacity: 1;
}
.journey-detail {
  min-width: 0;
  padding: 1rem;
  background: var(--cf-card);
  border: 1px solid var(--cf-electric);
  border-radius: .75rem;
}
.journey-detail h3, .journey-skill p { margin: 0; }
.journey-activities, .journey-skills { display: grid; gap: .55rem; }
.journey-activities li, .journey-skill { display: flex; align-items: center; flex-wrap: wrap; gap: .6rem; }
.journey-skill { padding-block: .55rem; border-block-end: 1px solid color-mix(in srgb, currentColor 20%, transparent); }
.journey-skill > div { flex: 1 1 12rem; }
.journey-skill meter { width: 7rem; }
body[data-view="roadmap"] .module { scroll-margin-top: 7rem; }

@media (min-width: 1100px) {
  .journey-route { grid-template-columns: minmax(13rem, 1fr) minmax(0, 2fr); grid-auto-rows: min-content; column-gap: 1rem; align-items: start; }
  .journey-route > li { display: contents; }
  .journey-stop { grid-column: 1; }
  .journey-detail { grid-area: 1 / 2 / span 6; }
}
@media (max-width: 1099px) {
  .journey-detail { margin-block: .65rem; }
}
@media (prefers-reduced-motion: no-preference) {
  .journey-detail { transition: opacity 180ms ease-out, transform 180ms ease-out; }
  @starting-style {
    .journey-detail { opacity: 0; transform: translateY(5px); }
  }
  .journey-map:not([data-exploring]) .journey-stop[data-done="true"]::before { animation: journey-draw 260ms ease-out; }
  .journey-map:not([data-exploring]) .journey-stop[aria-current="step"] .journey-node-marker { animation: journey-arrive 220ms ease-out; }
}
@keyframes journey-draw { from { transform: scaleY(0); } }
@keyframes journey-arrive { from { opacity: .65; transform: scale(.85); } }
@media print {
  .journey-map { display: none; }
}