:root { --ink:#161a20; --muted:#69717d; --line:#dce2ea; --paper:#f7f9fb; --blue:#0f62fe; --navy:#0c1f3f; --mint:#d9f7e6; --green:#198754; --amber:#e39b06; --red:#c83c4a; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; }
body { margin:0; background:var(--paper); color:var(--ink); font-family:Inter, ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; line-height:1.55; }
a { color:inherit; text-decoration:none; }
.topbar { height:74px; display:flex; align-items:center; justify-content:space-between; padding:0 max(5vw, 28px); background:#fff; border-bottom:1px solid var(--line); position:sticky; top:0; z-index:4; }
.brand { font-weight:760; font-size:1.14rem; letter-spacing:-.03em; }.brand span { color:var(--blue); }.topbar nav { display:flex; gap:26px; color:#4e5866; font-size:.92rem; }.top-link { color:var(--blue); font-weight:700; font-size:.9rem; }
main { max-width:1240px; margin:auto; padding:0 28px; }.grid { display:grid; grid-template-columns:1.2fr .8fr; gap:64px; align-items:center; }
.hero { padding:88px 0 72px; }.eyebrow { font-size:.74rem; font-weight:800; letter-spacing:.14em; text-transform:uppercase; color:#516174; margin:0 0 14px; }.hero h1 { font-size:clamp(2.6rem, 5vw, 4.7rem); letter-spacing:-.06em; line-height:1.04; margin:0; max-width:800px; }.lead { font-size:1.16rem; color:#536071; max-width:720px; margin:25px 0; }.actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:29px; }.button { display:inline-flex; justify-content:center; align-items:center; border:1px solid transparent; border-radius:4px; min-height:46px; padding:0 18px; cursor:pointer; font:inherit; font-weight:750; }.primary { background:var(--blue); color:#fff; box-shadow:0 8px 20px #0f62fe24; }.secondary { border-color:#aeb8c4; background:#fff; color:#1d2d42; }.fine-print { color:#77808b; font-size:.8rem; margin-top:20px; }
.hero-panel,.lab-shell,.terminal-card { background:#fff; border:1px solid var(--line); box-shadow:0 14px 35px #10203d0b; }.hero-panel { padding:24px; border-top:4px solid var(--blue); }.panel-heading,.lab-title-row,.section-heading,.audit-strip,.terminal-top,footer { display:flex; justify-content:space-between; align-items:center; gap:16px; }.panel-heading { font-size:.82rem; font-weight:800; text-transform:uppercase; letter-spacing:.08em; }.status { border-radius:999px; padding:4px 10px; font-size:.74rem; font-weight:800; text-transform:uppercase; letter-spacing:.04em; }.good { background:#d9f7e6; color:#08753b; }.warning { background:#fff2d2; color:#935d00; }.danger { background:#fde4e7; color:#a52334; }.signal-grid { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin:20px 0; }.signal-grid div { background:#fff; padding:15px; }.signal-grid small,.metric small { display:block; color:var(--muted); font-size:.76rem; }.signal-grid strong,.metric strong { display:block; margin:2px 0; font-size:1.1rem; }.signal-grid span { color:#7b8490; font-size:.76rem; }.evidence-line { border-top:1px solid var(--line); padding-top:14px; font-size:.84rem; color:#425166; }.pulse { display:inline-block; width:8px; height:8px; margin-right:8px; background:#1db66b; border-radius:50%; box-shadow:0 0 0 5px #1db66b1b; }
.section { padding:74px 0; border-top:1px solid var(--line); }.section h2 { font-size:clamp(1.9rem, 3vw, 3rem); letter-spacing:-.045em; margin:0 0 31px; }.steps { display:grid; grid-template-columns:repeat(4, 1fr); gap:1px; background:var(--line); border:1px solid var(--line); }.steps article { padding:24px; background:#fff; }.steps span { color:var(--blue); font-weight:800; font-size:.8rem; }.steps h3 { margin:17px 0 7px; }.steps p { color:#647080; font-size:.92rem; margin:0; }
.lab-section { padding-bottom:88px; }.simulation-label { background:#fff2d2; color:#825100; border:1px solid #f1d083; border-radius:3px; padding:7px 10px; font-size:.78rem; font-weight:700; }.lab-shell { display:grid; grid-template-columns:255px 1fr; min-height:455px; }.lab-rail { padding:20px; border-right:1px solid var(--line); background:#f9fbfd; }.lab-rail p { color:#5d6978; font-size:.82rem; margin:0 0 17px; }.stage { display:flex; align-items:center; width:100%; gap:10px; padding:11px 8px; border:0; border-left:3px solid transparent; background:transparent; text-align:left; color:#697685; cursor:pointer; font:inherit; font-size:.87rem; }.stage span { font-weight:800; color:#91a0af; font-size:.73rem; }.stage.active { border-left-color:var(--blue); background:#edf4ff; color:#10233f; font-weight:760; }.replay { width:100%; margin-top:24px; font-size:.86rem; }.lab-main { padding:35px; }.lab-title-row { align-items:start; }.lab-title-row h3 { font-size:1.6rem; letter-spacing:-.035em; margin:0; }.lab-description { color:#5e6977; max-width:760px; }.metric-grid { display:grid; grid-template-columns:repeat(4, 1fr); border:1px solid var(--line); margin:26px 0; }.metric { min-height:87px; padding:15px; border-right:1px solid var(--line); }.metric:last-child { border:0; }.metric strong { font-size:1rem; overflow-wrap:anywhere; }.explanation { border-left:3px solid var(--blue); padding:5px 0 5px 16px; color:#4e5d6c; }.explanation .eyebrow { margin-bottom:4px; }.explanation p:last-child { margin:0; }.audit-strip { margin-top:24px; padding:13px 0; border-top:1px solid var(--line); color:#536273; font-size:.86rem; }.audit-strip #sim-label { margin-left:auto; color:#965e00; font-size:.72rem; font-weight:850; letter-spacing:.08em; }
.run-section { padding-bottom:86px; }.run-section h2 { max-width:600px; margin-bottom:15px; }.run-section p { color:#5e6977; }.terminal-card { background:var(--navy); color:#dcecff; overflow:hidden; }.terminal-top { padding:11px 15px; background:#102b54; }.terminal-top span { width:8px; height:8px; border-radius:50%; background:#80a9eb; }.terminal-top p { margin:0 auto 0 0; color:#b6c8e3; font-size:.77rem; }.terminal-card code { display:block; padding:25px; color:#fff; font-size:.81rem; line-height:2; }.terminal-card > p { padding:0 25px 22px; color:#adbfda; font-size:.84rem; }.terminal-card strong { color:#fff; } footer { max-width:1240px; margin:auto; padding:30px 28px; border-top:1px solid var(--line); color:#627080; font-size:.82rem; } footer span:first-child { color:#192b40; font-weight:800; }
@media (max-width:850px) { .topbar nav { display:none; }.grid { grid-template-columns:1fr; gap:28px; }.hero { padding:60px 0; }.steps { grid-template-columns:1fr 1fr; }.lab-shell { grid-template-columns:1fr; }.lab-rail { border-right:0; border-bottom:1px solid var(--line); }.lab-rail .stage { display:inline-flex; width:auto; margin-right:5px; }.metric-grid { grid-template-columns:1fr 1fr; }.metric:nth-child(2) { border-right:0; }.metric:nth-child(-n+2) { border-bottom:1px solid var(--line); }.section-heading { align-items:start; flex-direction:column; } }
@media (max-width:520px) { main { padding:0 18px; }.topbar { padding:0 18px; }.top-link { display:none; }.steps,.metric-grid { grid-template-columns:1fr; }.metric { border-right:0; border-bottom:1px solid var(--line); }.metric:last-child { border-bottom:0; }.lab-main { padding:24px; }.lab-rail .stage { width:100%; }.hero h1 { font-size:2.65rem; } footer { align-items:start; flex-direction:column; padding:25px 18px; } }

/* Interactive dashboard lab */
.sim-console { background:#f7f9fc; border:1px solid #cfd8e3; box-shadow:0 18px 42px #10203d13; overflow:hidden; }
.sim-topbar { min-height:58px; display:flex; align-items:center; gap:16px; padding:0 20px; background:#fff; border-bottom:1px solid var(--line); font-size:.78rem; letter-spacing:.05em; }.sim-topbar strong { color:#10233f; font-size:.94rem; margin-right:auto; }.sim-topbar > span:not(.status):not(.sim-pill) { color:#526376; font-weight:800; }.sim-pill { color:#965e00; background:#fff2d2; padding:5px 8px; border-radius:2px; font-size:.7rem; font-weight:850; }
.sim-tabs { display:flex; overflow-x:auto; gap:2px; padding:0 18px; background:#fff; border-bottom:1px solid var(--line); }.sim-tab { flex:0 0 auto; min-height:48px; padding:0 13px; border:0; border-bottom:3px solid transparent; background:transparent; color:#647080; font:inherit; font-size:.8rem; font-weight:720; cursor:pointer; }.sim-tab.active { color:#0f62fe; border-bottom-color:#0f62fe; background:#f4f8ff; }
.dashboard-view { min-height:432px; padding:28px; }.view-heading { display:flex; justify-content:space-between; align-items:flex-start; gap:16px; }.view-heading h3 { margin:0; font-size:1.55rem; letter-spacing:-.035em; }.view-heading p:not(.eyebrow) { margin:5px 0 20px; color:#617082; max-width:760px; }.split-grid { display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:18px; }.dashboard-card { padding:21px; border:1px solid var(--line); background:#fff; }.dashboard-card > p:last-child { color:#596878; }.evidence-list { margin:0; padding:0; list-style:none; }.evidence-list li { display:grid; grid-template-columns:80px 1fr auto; gap:10px; padding:10px 0; border-top:1px solid var(--line); font-size:.88rem; }.evidence-list li:first-child { border-top:0; }.evidence-list b { color:#0f62fe; }.evidence-list em { font-style:normal; color:#32754c; font-size:.72rem; font-weight:800; }.inline-action { color:#0f62fe; border:0; background:transparent; padding:0; font:inherit; font-weight:800; cursor:pointer; }
.dashboard-card label { display:block; font-size:.78rem; color:#607082; font-weight:720; margin-bottom:14px; }.dashboard-card input,.dashboard-card select { display:block; width:100%; margin-top:5px; border:1px solid #aab7c7; border-radius:3px; padding:10px; color:#17212f; background:#fff; font:inherit; }.small-note { font-size:.78rem; color:#6d7886; }.stat-stack { display:grid; grid-template-columns:1fr 1fr; gap:1px; background:var(--line); border:1px solid var(--line); margin-top:13px; }.stat-stack div { background:#fff; padding:13px; }.stat-stack span { display:block; color:#657386; font-size:.75rem; }.stat-stack strong { display:block; margin-top:3px; }
.chain-card { margin-top:18px; }.chain { display:flex; align-items:center; gap:8px; overflow-x:auto; padding:8px 0; }.chain span { flex:0 0 auto; padding:7px 10px; border:1px solid #80cba0; background:#effbf4; color:#17633c; font-size:.75rem; font-weight:750; }.chain i { width:24px; height:1px; background:#8db19c; position:relative; }.chain i::after { content:""; position:absolute; right:0; top:-3px; border-left:6px solid #8db19c; border-top:3px solid transparent; border-bottom:3px solid transparent; }
table { width:100%; border-collapse:collapse; font-size:.82rem; } th,td { text-align:left; padding:10px 7px; border-top:1px solid var(--line); } th { color:#677586; font-size:.7rem; letter-spacing:.08em; text-transform:uppercase; }.dot { display:inline-block; width:7px; height:7px; border-radius:50%; margin-right:5px; }.good-dot { background:#1db66b; }.warning-dot { background:#e3a000; }
.terminal-sim { border:1px solid #122c57; background:#091a34; color:#dcecff; }.terminal-sim pre { min-height:195px; margin:0; padding:20px; white-space:pre-wrap; font:13px/1.55 ui-monospace, SFMono-Regular, Consolas, monospace; }.terminal-buttons { display:flex; flex-wrap:wrap; gap:8px; padding:13px; background:#102b54; }.terminal-buttons button { color:#dcecff; border:1px solid #5274a3; background:transparent; padding:7px 9px; border-radius:3px; font:inherit; font-size:.78rem; cursor:pointer; }.terminal-buttons button:last-child { border-color:#c47884; color:#ffd9dd; }
.tool-grid { display:flex; flex-wrap:wrap; gap:8px; margin:18px 0; }.tool-grid span { padding:8px 10px; border:1px solid #bfd2f9; background:#f1f6ff; color:#174a98; border-radius:3px; font:12px ui-monospace, SFMono-Regular, Consolas, monospace; }.codex-prompt { border:1px solid var(--line); background:#fff; padding:21px; }.codex-prompt > p { padding:12px; margin-top:0; background:#f7f9fc; border-left:3px solid #0f62fe; color:#3e5065; }.codex-result { margin-top:16px; padding:15px; border:1px solid #c4d8ee; background:#f2f8ff; color:#344e70; font-size:.88rem; }
.proof-dock { display:flex; justify-content:space-between; align-items:center; gap:20px; padding:18px 22px; background:#fff; border-top:1px solid var(--line); }.proof-dock .eyebrow { margin-bottom:4px; }.proof-dock p:last-child { margin:0; color:#536273; font-size:.88rem; }.proof-actions { display:flex; gap:8px; flex:0 0 auto; }.ghost { color:#526376; border-color:#aeb8c4; background:#fff; }.button:disabled { opacity:.45; cursor:not-allowed; }.deny-title { color:#b22d3b; margin:4px 0 12px; font-size:1rem; }.result-list { padding-left:19px; color:#536273; }.result-list li { margin:8px 0; }
@media (max-width:850px) { .sim-topbar { flex-wrap:wrap; height:auto; padding:13px 16px; }.sim-topbar strong { width:100%; }.dashboard-view { padding:20px; }.split-grid { grid-template-columns:1fr; }.proof-dock { align-items:flex-start; flex-direction:column; }.view-heading { flex-direction:column; }.sim-tabs { padding:0 9px; } }
