@import url("https://fonts.googleapis.com/css2?family=IBM+Plex+Mono:wght@400;500&family=IBM+Plex+Sans:wght@300;400;500;600&family=Source+Serif+4:opsz,wght@8..60,400;8..60,600&display=swap");

/* Foresight Computational: component styles. Colors, spacing, radii and type sizes come from tokens.css. */
[class^="fc-"], [class*=" fc-"] { box-sizing: border-box; }
.fc-page { margin: 0; background: var(--ground); color: var(--ink); font-family: var(--font-sans); -webkit-font-smoothing: antialiased; }
:where(.fc-page h1, .fc-page h2, .fc-page h3, .fc-page p) { margin: 0; }
.display, .display-serif, .h1 { text-wrap: balance; }
:where([class^="fc-"], [class*=" fc-"]):focus-visible { outline: 2px solid var(--signal-lit); outline-offset: 2px; }
.readout, .readout-sm, .code, .fc-panel { font-family: var(--font-mono); font-variant-numeric: tabular-nums; font-feature-settings: "tnum" 1; }
.reading, .reading-lead { font-family: var(--font-serif); }

/* Button */
.fc-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 0 var(--space-5); border: 1px solid transparent; border-radius: var(--radius-md); font-family: var(--font-sans); text-decoration: none; cursor: pointer; transition: background-color 140ms ease, border-color 140ms ease; }
.fc-btn--primary { background: var(--signal); color: var(--on-signal); }
.fc-btn--primary:hover, .fc-btn--primary:active { background: var(--signal-pressed); }
.fc-btn--secondary { background: transparent; border-color: var(--line-strong); color: var(--ink); }
.fc-btn--secondary:hover { border-color: var(--ink); }
.fc-btn--text { background: transparent; color: var(--signal-lit); padding: 0 var(--space-2); }
.fc-btn--text:hover { text-decoration: underline; }
.fc-btn:disabled, .fc-btn[aria-disabled="true"] { background: var(--surface); border-color: var(--line); color: var(--ink-muted); cursor: not-allowed; }

/* NavBar */
.fc-nav { background: var(--ground); border-bottom: 1px solid var(--line); }
.fc-nav__inner { max-width: var(--container-max); margin: 0 auto; padding: 0 var(--space-4); min-height: var(--nav-height); display: flex; align-items: center; flex-wrap: wrap; gap: var(--space-6); }
.fc-nav__brand { color: var(--ink); text-decoration: none; margin-right: auto; }
.fc-nav__menu { display: flex; align-items: center; gap: var(--space-6); }
.fc-nav__list { display: flex; gap: var(--space-6); list-style: none; margin: 0; padding: 0; }
.fc-nav__link { display: inline-block; padding: var(--space-2) 0; color: var(--ink); text-decoration: none; border-bottom: 1px solid transparent; }
.fc-nav__link:hover, .fc-nav__link[aria-current="page"] { border-bottom-color: var(--ink); }
.fc-nav__login { color: var(--ink-muted); text-decoration: none; border: 1px solid var(--line-strong); border-radius: var(--radius-md); padding: var(--space-2) var(--space-4); }
.fc-nav__login:hover { color: var(--ink); border-color: var(--ink); }
.fc-nav__toggle { display: none; background: transparent; color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--radius-md); padding: var(--space-2) var(--space-4); font-family: var(--font-sans); cursor: pointer; }
@media (max-width: 860px) {
  .fc-nav__toggle { display: inline-flex; }
  .fc-nav__menu { display: none; flex-basis: 100%; flex-direction: column; align-items: flex-start; gap: var(--space-4); padding-bottom: var(--space-4); }
  .fc-nav__menu.is-open { display: flex; }
  .fc-nav__list { flex-direction: column; gap: var(--space-2); }
}

/* Disclosure */
.fc-disclosure { background: transparent; border: 0; border-top: 1px solid var(--line-strong); border-radius: 0; padding: var(--space-6) 0 0; display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); column-gap: var(--space-5); row-gap: var(--space-4); color: var(--ink); }
.fc-disclosure__title { grid-column: 1; margin: 0; color: var(--ink); }
.fc-disclosure__text { grid-column: 2; margin: 0; max-width: var(--measure); color: var(--ink); }
.fc-disclosure__links { grid-column: 2; display: flex; flex-wrap: wrap; gap: var(--space-5); list-style: none; margin: 0; padding: 0; }
.fc-disclosure__links a { color: var(--ink-muted); text-decoration: none; }
.fc-disclosure__links a:hover { color: var(--ink); text-decoration: underline; }
.fc-fine { margin: 0; max-width: var(--measure); color: var(--ink-muted); }
@media (max-width: 900px) { .fc-disclosure { grid-template-columns: minmax(0, 1fr); } .fc-disclosure__title, .fc-disclosure__text, .fc-disclosure__links { grid-column: 1; } }

/* StatementGrid */
.fc-statements { counter-reset: st; list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(auto-fit, minmax(220px, 1fr)); border-top: 1px solid var(--line-strong); border-bottom: 1px solid var(--line); }
.fc-statements__item { counter-increment: st; padding: var(--space-6) var(--space-5) var(--space-7); border-left: 1px solid var(--line); color: var(--ink); font-size: 26px; line-height: 34px; font-weight: 300; letter-spacing: -0.01em; }
.fc-statements__item::before { content: counter(st, decimal-leading-zero); display: block; margin-bottom: var(--space-7); font-size: 14px; line-height: 20px; font-weight: 400; letter-spacing: 0; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.fc-statements__item:first-child { border-left: 0; padding-left: 0; }
@media (max-width: 900px) { .fc-statements__item:nth-child(odd) { border-left: 0; padding-left: 0; } }
@media (max-width: 600px) { .fc-statements__item { border-left: 0; padding: var(--space-5) 0 var(--space-5); } .fc-statements__item + .fc-statements__item { border-top: 1px solid var(--line); } .fc-statements__item::before { margin-bottom: var(--space-3); } }

/* Cards: StepCard, TechCard */
.fc-card { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--space-5); display: flex; flex-direction: column; gap: var(--space-3); color: var(--ink); }
.fc-card h3 { margin: 0; }
.fc-step__n { color: var(--ink-muted); }
.fc-step__body { margin: 0; color: var(--ink); }
.fc-step__note { margin: auto 0 0; padding-top: var(--space-3); border-top: 1px solid var(--line); color: var(--ink-muted); }
.fc-tech__list { margin: 0; display: grid; gap: var(--space-4); }
.fc-tech__list dt { color: var(--ink-muted); }
.fc-tech__list dd { margin: var(--space-1) 0 0; color: var(--ink); }

/* RuleList */
.fc-rules__title { margin: 0 0 var(--space-6); color: var(--ink); max-width: 900px; }
.fc-rules__list { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-strong); }
.fc-rules__item { padding: var(--space-4) 0; border-bottom: 1px solid var(--line); color: var(--ink); }
.fc-rules--grid .fc-rules__title { margin-bottom: var(--space-8); }
.fc-rules--grid .fc-rules__list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); column-gap: var(--space-5); border-top: 0; }
.fc-rules--grid .fc-rules__item { display: grid; align-content: start; gap: var(--space-6); padding: var(--space-5) var(--space-5) var(--space-8) 0; border-top: 1px solid var(--line-strong); border-bottom: 0; }
.fc-rules--grid .fc-rules__item { font-size: 24px; line-height: 32px; font-weight: 400; letter-spacing: -0.01em; }
.fc-rules__mark { width: 8px; height: 8px; border-radius: 1px; background: var(--ink-muted); }
@media (max-width: 900px) { .fc-rules--grid .fc-rules__list { grid-template-columns: minmax(0, 1fr); } .fc-rules--grid .fc-rules__item { gap: var(--space-4); padding-bottom: var(--space-6); } }

/* StepList */
.fc-steps { list-style: none; margin: 0; padding: 0; border-top: 1px solid var(--line-strong); }
.fc-steps__row { position: relative; display: grid; grid-template-columns: 72px minmax(160px, 220px) minmax(0, 1fr); column-gap: var(--space-5); align-items: baseline; padding: var(--space-5) 0 28px; border-bottom: 1px solid var(--line); }
.fc-steps__n { font-family: var(--font-sans); font-weight: 300; font-size: 32px; line-height: 36px; color: var(--ink-muted); font-variant-numeric: tabular-nums; }
.fc-steps__title { margin: 0; color: var(--ink); }
.fc-steps__body p { margin: 0; color: var(--ink); }
.fc-steps__body .fc-steps__note { margin-top: var(--space-2); color: var(--ink-muted); }
.fc-steps__mark { position: absolute; left: -20px; top: 38px; width: 11px; height: 11px; box-sizing: border-box; background: var(--signal); border: 1.5px solid var(--signal-lit); border-radius: var(--radius-sm); }
@media (max-width: 700px) { .fc-steps__row { grid-template-columns: 48px minmax(0, 1fr); row-gap: var(--space-2); } .fc-steps__body { grid-column: 2; } .fc-steps__mark { left: -14px; } }

/* TechMap */
.fc-techmap { display: grid; grid-template-columns: minmax(0, 4fr) minmax(0, 8fr); gap: var(--space-7); align-items: stretch; }
.fc-techmap__tabs { display: flex; flex-direction: column; border-top: 1px solid var(--line-strong); }
.fc-techmap__tab { display: flex; align-items: center; gap: var(--space-3); width: 100%; padding: 13px 0; background: transparent; border: 0; border-bottom: 1px solid var(--line); color: var(--ink-muted); font-family: var(--font-sans); text-align: left; cursor: pointer; transition: color 140ms ease; }
.fc-techmap__tab:hover, .fc-techmap__tab.is-on { color: var(--ink); }
.fc-techmap__mark { flex: none; width: 11px; height: 11px; box-sizing: border-box; border: 1.5px solid transparent; border-radius: var(--radius-sm); }
.fc-techmap__tab.is-on .fc-techmap__mark { background: var(--signal-lit); border-color: var(--signal-lit); }
.fc-techmap__panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--space-7); }
.fc-techmap__title { margin: 0 0 var(--space-6); color: var(--ink); }
.fc-techmap__cols { margin: 0; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: var(--space-6); }
.fc-techmap__cols dt { box-sizing: border-box; min-height: 52px; color: var(--ink-muted); padding-bottom: var(--space-3); margin-bottom: var(--space-3); border-bottom: 1px solid var(--line); }
.fc-techmap__cols dd { margin: 0; color: var(--ink); }
@media (max-width: 900px) { .fc-techmap__cols dt { min-height: 0; } .fc-techmap { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); } .fc-techmap__cols { grid-template-columns: minmax(0, 1fr); gap: var(--space-5); } .fc-techmap__panel { padding: var(--space-5); } }

/* Pipeline */
.fc-pipeline { --gap: var(--space-5); list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: repeat(var(--fc-n, 8), minmax(0, 1fr)); gap: var(--gap); }
.fc-pipe { position: relative; padding-top: var(--space-6); display: flex; flex-direction: column; gap: var(--space-2); color: var(--ink); }
.fc-pipe__marker { position: absolute; top: 0; left: 0; width: 12px; height: 12px; background: var(--ground); border: 1.5px solid var(--line-strong); border-radius: var(--radius-sm); }
.fc-pipe::before { content: ""; position: absolute; top: 5.5px; left: 12px; width: calc(100% + var(--gap) - 12px); border-top: 1px solid var(--line-strong); }
.fc-pipe:last-child::before { display: none; }
.fc-pipe--to-optional::before { border-top-style: dashed; }
.fc-pipe--optional .fc-pipe__marker { border-style: dashed; }
.fc-pipe--key .fc-pipe__marker { background: var(--signal-lit); border-color: var(--signal-lit); }
.fc-pipe__name { color: var(--ink); }
.fc-pipe__tag, .fc-pipe__note { color: var(--ink-muted); }
@media (max-width: 1100px) {
  .fc-pipeline { grid-template-columns: 1fr; }
  .fc-pipe { padding: 0 0 0 var(--space-6); }
  .fc-pipe__marker { top: 4px; }
  .fc-pipe::before { top: 16px; left: 5.5px; width: 0; height: calc(100% + var(--gap) - 16px); border-top: 0; border-left: 1px solid var(--line-strong); }
  .fc-pipe--to-optional::before { border-left-style: dashed; }
}

/* DataPanel */
.fc-panel { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); margin: 0; overflow: hidden; }
.fc-panel__head { padding: var(--space-3) var(--space-5); border-bottom: 1px solid var(--line); color: var(--ink-muted); }
.fc-panel__rows { margin: 0; padding: var(--space-2) var(--space-5); }
.fc-panel__row { display: flex; justify-content: space-between; gap: var(--space-5); padding: var(--space-2) 0; border-bottom: 1px solid var(--line); }
.fc-panel__row:last-child { border-bottom: 0; }
.fc-panel dt { color: var(--ink-muted); }
.fc-panel dd { margin: 0; color: var(--ink); text-align: right; }
.fc-panel dd.is-live { color: var(--signal-lit); }
.fc-panel__cap { margin: 0; padding: var(--space-3) var(--space-5); border-top: 1px solid var(--line); color: var(--ink-muted); font-family: var(--font-sans); }

/* SignalWave */
.fc-wave-wrap { overflow: hidden; }
.fc-wave { display: block; width: 100%; min-width: 720px; height: auto; position: relative; left: 50%; transform: translateX(-50%); }
.fc-wave__grid { fill: none; stroke: var(--line); stroke-width: 1; }
.fc-wave__floor { fill: none; stroke: var(--line-strong); stroke-width: 1; opacity: 0.55; }
.fc-wave__trace { fill: none; stroke: var(--signal-lit); stroke-width: 2.5; stroke-linejoin: round; stroke-linecap: round; }
.fc-wave--animate .fc-wave__trace { stroke-dasharray: 1; stroke-dashoffset: 1; animation: fc-draw 2400ms cubic-bezier(0.3, 0.6, 0.2, 1) 1 forwards; }
@keyframes fc-draw { to { stroke-dashoffset: 0; } }
@media (prefers-reduced-motion: reduce) { .fc-wave--animate .fc-wave__trace { animation: none; stroke-dashoffset: 0; } }

/* ContourFigure */
.fc-contour { margin: 0; display: grid; gap: var(--space-3); justify-items: center; }
.fc-contour svg { width: 100%; max-width: 560px; height: auto; }
.fc-contour__ring { fill: none; stroke: var(--line-strong); }
.fc-contour__core { fill: var(--signal-lit); }
.fc-contour figcaption { color: var(--ink-muted); }

/* ContourField */
.fc-topo { position: absolute; left: 0; top: 0; display: block; width: 100%; height: 100%; }
.fc-topo__line { fill: none; stroke: var(--line-strong); stroke-width: 1; opacity: 0.32; vector-effect: non-scaling-stroke; }
.fc-topo__line--major { opacity: 0.75; }
[data-theme="light"] .fc-topo__line { opacity: 0.22; }
[data-theme="light"] .fc-topo__line--major { opacity: 0.5; }

/* Field, RadioGroup */
.fc-field, .fc-radios { display: grid; grid-template-columns: minmax(0, 1fr); gap: var(--space-2); margin: 0; padding: 0; border: 0; min-width: 0; }
.fc-field__label { color: var(--ink); padding: 0; }
.fc-control { width: 100%; min-width: 0; min-height: 44px; padding: var(--space-3); background: var(--surface); color: var(--ink); border: 1px solid var(--line-strong); border-radius: var(--radius-md); font-family: var(--font-sans); }
textarea.fc-control { resize: vertical; }
.fc-control::placeholder { color: var(--ink-muted); }
.fc-control:hover { border-color: var(--ink-muted); }
.fc-control:focus-visible { outline: 2px solid var(--signal-lit); outline-offset: 2px; border-color: var(--ink); }
.fc-control.is-error { border: 2px solid var(--ink); }
.fc-control:disabled { color: var(--ink-muted); border-color: var(--line); cursor: not-allowed; }
select.fc-control { appearance: none; -webkit-appearance: none; padding-right: var(--space-7); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1.5l5 5 5-5' fill='none' stroke='%237C8B98' stroke-width='1.5'/%3E%3C/svg%3E"); background-repeat: no-repeat; background-position: right var(--space-3) center; }
.fc-field__msg { margin: 0; color: var(--ink-muted); }
.fc-field__msg.is-error { color: var(--ink); }
.fc-radios__opts { display: flex; flex-wrap: wrap; gap: var(--space-3) var(--space-6); }
.fc-radio { display: inline-flex; align-items: center; gap: var(--space-2); cursor: pointer; color: var(--ink); }
.fc-radio input { appearance: none; -webkit-appearance: none; margin: 0; width: 20px; height: 20px; border: 1px solid var(--line-strong); border-radius: 50%; background: var(--surface); display: grid; place-content: center; cursor: pointer; }
.fc-radio input::before { content: ""; width: 10px; height: 10px; border-radius: 50%; background: var(--signal-lit); transform: scale(0); transition: transform 120ms ease; }
.fc-radio input:checked { border-color: var(--signal-lit); }
.fc-radio input:checked::before { transform: scale(1); }
.fc-radio input:focus-visible { outline: 2px solid var(--signal-lit); outline-offset: 2px; }

/* RiskNote */
.fc-risk { background: var(--surface); border: 1px solid var(--line-strong); border-radius: var(--radius-lg); padding: var(--space-8); display: grid; grid-template-columns: minmax(0, 5fr) minmax(0, 7fr); gap: var(--space-7); align-items: start; color: var(--ink); }
.fc-risk__title { margin: 0; color: var(--ink); }
.fc-risk__body { margin: 0; max-width: var(--measure); color: var(--ink); }
@media (max-width: 900px) { .fc-risk { grid-template-columns: minmax(0, 1fr); padding: var(--space-6); gap: var(--space-5); } }

/* PortalGate */
.fc-gate { background: var(--surface); border: 1px solid var(--line); border-radius: var(--radius-lg); padding: var(--space-7) var(--space-6); display: grid; justify-items: start; gap: var(--space-4); color: var(--ink); }
.fc-gate h2 { margin: 0; }
.fc-gate__lock { color: var(--ink-muted); }
.fc-gate__body { margin: 0; max-width: var(--measure); color: var(--ink); }
.fc-gate__actions { display: flex; flex-wrap: wrap; gap: var(--space-3); }
