:root {
  color-scheme: light;
  --ink: #101826;
  --muted: #5a6675;
  --line: #d6dce4;
  --paper: #ffffff;
  --bg: #f3f5f8;
  --accent: #174ea6;
  --accent-soft: #eaf1fd;
  --positive: #0f7b58;
  --warning: #986500;
  --danger: #9b2226;
  font-family: "IBM Plex Sans", "Avenir Next", "Segoe UI", sans-serif;
  line-height: 1.45;
  color: var(--ink);
  background: var(--bg);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; min-height: 100vh; background: var(--bg); color: var(--ink); }
a { color: inherit; }
img { max-width: 100%; display: block; }
button, input, select, textarea { font: inherit; }

.site-shell { min-height: 100vh; padding: 1rem; }
.page { max-width: 1280px; margin: 0 auto; }

.site-header, .footer-panel, .hero, .feature-block, .home-hero-panel, .home-system-card,
.home-break-card, .home-process, .home-outcome-card, .solutions-intro, .solution-row,
.purpose-row, .contact-shell, .message-panel {
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 0;
}

.site-header, .footer-panel { padding: 1rem 1.1rem; }
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; }
.brand { text-decoration: none; display: inline-flex; align-items: center; }
.brand-copy { display: grid; gap: 0.1rem; }
.brand-copy strong { font-size: 1.08rem; letter-spacing: 0.01em; }
.brand-copy span { font-size: 0.92rem; color: var(--muted); }
.site-nav { display: flex; flex-wrap: wrap; gap: 0.8rem; align-items: center; }
.site-nav a { text-decoration: none; color: var(--ink); }
.site-nav .cta-link, .button, .button-secondary, .foresight-button {
  display: inline-flex; align-items: center; justify-content: center; gap: 0.5rem;
  text-decoration: none; cursor: pointer; border-radius: 0; border: 1px solid var(--line);
  padding: 0.78rem 1rem; background: var(--paper); color: var(--ink); font-weight: 600;
}
.site-nav .cta-link, .button.primary, .foresight-button.primary { background: var(--ink); color: #fff; border-color: var(--ink); }

.hero, .feature-block, .home-hero-panel, .home-system-card, .home-break-card,
.home-process, .home-outcome-card, .solutions-intro, .solution-row, .purpose-row,
.contact-shell, .message-panel { padding: 1.1rem; }

.foresight-app { background: var(--bg); }
.foresight-shell { max-width: 1640px; margin: 0 auto; padding: 20px; }
.foresight-loading { padding: 1rem 1.1rem; background: var(--paper); border: 1px solid var(--line); }
.foresight-frame { display: grid; gap: 16px; }
.foresight-topbar { display: grid; grid-template-columns: minmax(0, 1.2fr) minmax(360px, 0.8fr); gap: 16px; align-items: start; }
.foresight-headline { background: var(--paper); border: 1px solid var(--line); border-radius: 0; padding: 1.2rem; display: grid; gap: 0.85rem; }
.foresight-kicker { margin: 0; text-transform: uppercase; letter-spacing: 0.13em; font-size: 0.72rem; color: var(--muted); font-weight: 700; }
.foresight-headline h1 { margin: 0; font-size: clamp(2.2rem, 4vw, 4.4rem); line-height: 0.95; letter-spacing: -0.04em; max-width: 14ch; }
.foresight-lead { margin: 0; max-width: 72ch; color: var(--muted); font-size: 1.02rem; }
.foresight-toolbar, .foresight-create-grid, .foresight-grid, .foresight-meta-grid, .foresight-stage-grid, .foresight-lifecycle-grid, .foresight-inspector-grid { display: grid; gap: 16px; }
.foresight-toolbar { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.foresight-toolbar .foresight-card { min-height: 100%; }
.foresight-controls, .foresight-actions, .foresight-inline-actions, .foresight-footer-actions { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.foresight-select, .foresight-input, .foresight-textarea {
  width: 100%; border: 1px solid var(--line); border-radius: 0; background: var(--paper); color: var(--ink);
  padding: 0.72rem 0.8rem;
}
.foresight-textarea { min-height: 92px; resize: vertical; }
.foresight-field { display: grid; gap: 6px; }
.foresight-field label, .foresight-label { color: var(--muted); font-size: 0.9rem; }
.foresight-card { background: var(--paper); border: 1px solid var(--line); border-radius: 0; padding: 1rem; }
.foresight-card h2, .foresight-card h3, .foresight-panel-title { margin: 0; line-height: 1.1; }
.foresight-card h2 { font-size: 1.15rem; }
.foresight-card h3 { font-size: 1rem; }
.foresight-card p { margin: 0; color: var(--muted); }
.foresight-summary { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.foresight-stat { background: var(--paper); border: 1px solid var(--line); border-radius: 0; padding: 1rem; display: grid; gap: 0.35rem; }
.foresight-stat strong { font-size: 1.5rem; }
.foresight-stat span { color: var(--muted); font-size: 0.92rem; }
.foresight-create-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.foresight-grid { grid-template-columns: minmax(280px, 320px) minmax(0, 1fr) minmax(320px, 380px); align-items: start; }
.foresight-stack { display: grid; gap: 16px; }
.foresight-list { display: grid; gap: 10px; }
.foresight-list-item { border: 1px solid var(--line); border-radius: 0; background: var(--paper); padding: 0.95rem; display: grid; gap: 0.6rem; }
.foresight-list-item.is-active { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.foresight-list-item h4, .foresight-list-item p { margin: 0; }
.foresight-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; }
.foresight-pill { display: inline-flex; align-items: center; gap: 0.3rem; padding: 0.26rem 0.5rem; border: 1px solid var(--line); border-radius: 0; background: #fff; color: var(--muted); font-size: 0.78rem; text-transform: uppercase; letter-spacing: 0.06em; }
.foresight-pill.is-shared { border-color: #9fc1ff; background: var(--accent-soft); color: var(--accent); }
.foresight-pill.is-private { border-color: #d7dde4; }
.foresight-pill.is-warning { border-color: #f0d48d; background: #fff8e8; color: var(--warning); }
.foresight-pill.is-positive { border-color: #a9e2c7; background: #eefbf5; color: var(--positive); }
.foresight-pill.is-danger { border-color: #f0b0b5; background: #fff1f2; color: var(--danger); }
.foresight-stage-grid { grid-template-columns: repeat(auto-fit, minmax(144px, 1fr)); }
.foresight-stage { display: grid; gap: 0.35rem; align-content: start; text-align: left; }
.foresight-stage strong { font-size: 1rem; }
.foresight-stage span { font-size: 0.85rem; color: var(--muted); }
.foresight-stage.is-active { border-color: var(--accent); box-shadow: inset 0 0 0 1px var(--accent); }
.foresight-lifecycle-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.foresight-table { width: 100%; border-collapse: collapse; }
.foresight-table th, .foresight-table td { border-bottom: 1px solid var(--line); padding: 0.7rem 0.5rem; text-align: left; vertical-align: top; }
.foresight-table th { color: var(--muted); font-size: 0.85rem; font-weight: 600; }
.foresight-divider { height: 1px; background: var(--line); margin: 0.9rem 0; }
.foresight-kv { display: grid; gap: 0.5rem; }
.foresight-kv-row { display: grid; gap: 0.2rem; }
.foresight-kv-row strong { font-size: 0.94rem; }
.foresight-kv-row span, .foresight-kv-row a { color: var(--muted); font-size: 0.92rem; word-break: break-word; }
.foresight-provenance { display: grid; gap: 0.55rem; }
.foresight-provenance a { color: var(--accent); text-decoration: none; word-break: break-word; }
.foresight-provenance a:hover { text-decoration: underline; }
.foresight-audit { display: grid; gap: 0.65rem; max-height: 520px; overflow: auto; padding-right: 0.1rem; }
.foresight-audit-entry { border: 1px solid var(--line); border-radius: 0; background: var(--paper); padding: 0.82rem; display: grid; gap: 0.35rem; }
.foresight-audit-entry time { color: var(--muted); font-size: 0.8rem; }
.foresight-audit-entry p { margin: 0; color: var(--ink); }
.foresight-meter { display: grid; gap: 0.35rem; }
.foresight-meter-track { width: 100%; height: 10px; background: #edf1f5; border: 1px solid var(--line); }
.foresight-meter-fill { height: 100%; background: linear-gradient(90deg, var(--accent) 0%, #5b8ef4 100%); }
.foresight-mini { color: var(--muted); font-size: 0.86rem; }
.foresight-bundle { background: #0f1726; color: #eef2f7; border: 1px solid #0f1726; padding: 0.9rem; overflow: auto; max-height: 260px; font-size: 0.82rem; white-space: pre-wrap; }
.foresight-note { color: var(--muted); font-size: 0.92rem; }
.foresight-status { min-height: 1.2rem; color: var(--muted); font-size: 0.92rem; }
.foresight-status.is-live { color: var(--accent); }
.foresight-status.is-error { color: var(--danger); }
.foresight-empty { border: 1px dashed var(--line); background: #fff; padding: 1rem; color: var(--muted); }
.foresight-flex { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.foresight-split { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.foresight-micro { font-size: 0.82rem; color: var(--muted); }
.foresight-record { display: grid; gap: 0.6rem; }
.foresight-record code, .foresight-code { font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; }
.foresight-codeblock { white-space: pre-wrap; font-family: "SFMono-Regular", Consolas, "Liberation Mono", Menlo, monospace; font-size: 0.82rem; }

@media (max-width: 1200px) {
  .foresight-topbar, .foresight-grid, .foresight-create-grid, .foresight-summary, .foresight-toolbar, .foresight-lifecycle-grid, .foresight-split { grid-template-columns: 1fr; }
}

@media (max-width: 760px) {
  .site-header { flex-direction: column; align-items: start; }
  .foresight-shell { padding: 14px; }
  .foresight-card, .foresight-headline, .foresight-stat, .foresight-list-item, .foresight-audit-entry { padding: 0.9rem; }
}
