:root { --ink:#171714; --paper:#f4efdf; --yellow:#ffd84d; --red:#ee4e35; --blue:#3777ff; --green:#1c9b6b; --line:#222; --muted:#69665e; }
* { box-sizing:border-box; }
body { margin:0; background:var(--paper); color:var(--ink); font:16px/1.45 system-ui,-apple-system,Segoe UI,sans-serif; }
body::before { content:""; position:fixed; inset:0; pointer-events:none; opacity:.25; background-image:radial-gradient(#6f6958 0.65px,transparent .65px); background-size:7px 7px; }
header,main,footer { width:min(1120px,calc(100% - 32px)); margin-inline:auto; position:relative; }
.topbar { width:min(1120px,calc(100% - 32px)); margin:18px auto 0; min-height:54px; border:2px solid var(--line); background:#fffdf5; box-shadow:4px 4px 0 var(--line); display:flex; align-items:center; justify-content:space-between; gap:20px; padding:8px 14px; position:relative; z-index:2; }
.topbar a { color:var(--ink); font-weight:750; text-decoration:none; }.topbar > div { display:flex; gap:20px; }.topbar > div a:hover { text-decoration:underline; text-decoration-thickness:2px; }.wordmark { font:900 18px/1 ui-monospace,monospace; letter-spacing:-.05em; }.wordmark span { display:inline-grid; place-items:center; background:var(--yellow); border:2px solid; width:24px; height:24px; border-radius:50%; margin:0 2px; }
header { padding:56px 0 30px; }
.eyebrow { font:700 12px/1.2 ui-monospace,monospace; letter-spacing:.14em; margin:0 0 10px; }
h1 { font-size:clamp(46px,8vw,92px); line-height:.88; letter-spacing:-.065em; margin:0; max-width:900px; }
.pitch { font-size:clamp(18px,2.6vw,28px); max-width:760px; margin:22px 0 0; }
.proof-strip { margin-top:24px; display:flex; flex-wrap:wrap; gap:8px; }.proof-strip span { border:2px solid; background:#fff; padding:8px 12px; font:700 12px ui-monospace,monospace; }.proof-strip strong { color:var(--blue); }
.panel { border:3px solid var(--line); box-shadow:8px 8px 0 var(--line); background:#fffdf5; padding:26px; margin:0 0 32px; }
.section-title { display:flex; align-items:center; gap:12px; margin:0 0 18px; }
.section-title span { display:grid; place-items:center; width:34px; height:34px; border:2px solid; border-radius:50%; font:800 12px ui-monospace,monospace; background:var(--yellow); }
h2,h3,p { margin-top:0; } h2 { margin-bottom:0; font-size:22px; } h3 { margin-bottom:6px; font-size:27px; }
.ride-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:14px; margin-bottom:32px; }
.ride { border:2px solid; background:white; padding:0; text-align:left; cursor:pointer; min-height:210px; transition:transform .15s,box-shadow .15s; }
.ride:hover { transform:translate(-2px,-2px); box-shadow:4px 4px 0 var(--line); }
.ride.selected { box-shadow:5px 5px 0 var(--blue); outline:3px solid var(--blue); outline-offset:-3px; }
.ride .stripe { height:10px; background:var(--yellow); border-bottom:2px solid; }
.ride:nth-child(2) .stripe { background:var(--red); }.ride:nth-child(3) .stripe { background:var(--blue); }
.ride-body { padding:16px; }.ride h3 { font-size:20px; }.ride .kind { font:700 11px ui-monospace,monospace; text-transform:uppercase; color:var(--muted); }.ride p { margin-bottom:0; font-size:14px; }.ride .mission { margin-top:12px; padding-top:10px; border-top:1px solid #aaa; font-size:12px; color:var(--muted); }.ride .mission strong { display:block; color:var(--ink); text-transform:uppercase; font:800 10px ui-monospace,monospace; letter-spacing:.08em; }
.agent-row { display:grid; grid-template-columns:repeat(5,1fr); gap:10px; }
.agent-row label { border:2px solid; padding:13px; display:grid; grid-template-columns:auto 1fr; column-gap:8px; cursor:pointer; background:white; }
.agent-row input { grid-row:1 / 3; align-self:start; margin-top:4px; accent-color:var(--blue); }.agent-row small { color:var(--muted); }
.adapter-field { margin-top:14px; padding:14px; background:#e9efff; border-left:5px solid var(--blue); }.adapter-field label { font-weight:700; display:block; }.adapter-field input { width:100%; font:14px ui-monospace,monospace; padding:10px; border:2px solid; margin:6px 0; }.adapter-field p { margin:0; font-size:13px; }
.browser-note { margin:14px 0 0; padding:12px 14px; border-left:5px solid var(--green); background:#e7f5ee; font-size:14px; }
.run-button { width:100%; border:3px solid; background:var(--yellow); color:var(--ink); font-weight:850; font-size:20px; padding:16px; margin-top:20px; cursor:pointer; box-shadow:4px 4px 0 var(--line); }.run-button:hover { transform:translate(2px,2px); box-shadow:2px 2px 0 var(--line); }.run-button:disabled { opacity:.55; cursor:wait; }.run-button span { float:right; }
.run-button[href] { display:block; text-decoration:none; text-align:left; }.run-button[aria-disabled="true"] { opacity:.55; pointer-events:none; }.secondary-button { background:#fff; }.text-link { color:var(--ink); font-weight:800; text-underline-offset:3px; }.quiet-button { border:0; background:transparent; text-decoration:underline; font-weight:750; cursor:pointer; padding:10px 0; }.privacy-note { font-size:12px; color:var(--muted); text-align:center; margin:12px 0 0; }
.error { color:#a31d10; margin:12px 0 0; font-weight:700; }
.result { scroll-margin-top:20px; }.scoreboard { display:grid; grid-template-columns:130px 1fr; align-items:center; gap:24px; padding:18px; border:2px solid; background:#fff; }
.score-ring { width:116px; height:116px; border:12px solid var(--blue); border-radius:50%; display:grid; place-content:center; text-align:center; }.score-ring strong { font:900 38px/.8 ui-monospace,monospace; }.score-ring small { margin-top:7px; }.verdict { font:800 12px ui-monospace,monospace; letter-spacing:.12em; color:var(--green); margin-bottom:5px; }.muted { color:var(--muted); }
.rules { display:grid; grid-template-columns:repeat(2,1fr); gap:10px; margin:16px 0 22px; }.rule { border:2px solid; padding:13px; background:white; }.rule-top { display:flex; justify-content:space-between; gap:12px; }.rule strong:last-child { font:800 15px ui-monospace,monospace; }.rule p { font-size:13px; color:var(--muted); margin:8px 0 0; }.rule.pass { border-left:8px solid var(--green); }.rule.fail { border-left:8px solid var(--red); }
details { border-top:2px solid; padding:15px 0; } summary { cursor:pointer; font-weight:800; } pre { overflow:auto; background:#171714; color:#e9e3d3; padding:16px; font:12px/1.5 ui-monospace,monospace; }
.trace { margin-top:14px; display:grid; gap:8px; }.trace-step { display:grid; grid-template-columns:50px 190px 1fr; border:2px solid; background:white; }.step-no { display:grid; place-items:center; background:var(--ink); color:white; font:800 13px ui-monospace,monospace; }.action { padding:11px; font:700 13px ui-monospace,monospace; border-right:1px solid #bbb; overflow-wrap:anywhere; }.events { padding:10px 12px; }.event { font-size:13px; margin:2px 0; }.event.hazard { color:#a31d10; font-weight:750; }.event.success { color:#08764e; font-weight:750; }
footer { padding:4px 0 38px; color:var(--muted); font-size:13px; display:flex; justify-content:space-between; gap:16px; } footer a { color:inherit; }
.participant { max-width:900px; }.participant header { width:auto; padding-top:36px; }.participant h1 { font-size:clamp(38px,7vw,72px); }.mission-card { border:2px solid; padding:16px; background:var(--yellow); }.observation { white-space:pre-wrap; max-height:480px; }.action-buttons { display:flex; flex-wrap:wrap; gap:7px; margin:12px 0; }.action-buttons button { border:2px solid; background:white; padding:7px 10px; font:700 12px ui-monospace,monospace; cursor:pointer; }.action-editor { width:100%; min-height:120px; resize:vertical; border:2px solid; padding:12px; font:14px/1.45 ui-monospace,monospace; }.participant-status { font:800 12px ui-monospace,monospace; letter-spacing:.1em; color:var(--blue); }.agent-instructions { padding:14px; border:2px dashed; background:#eef2ff; }.agent-instructions code { overflow-wrap:anywhere; }
.result-actions { border-top:2px solid; margin-top:20px; padding-top:2px; display:grid; gap:14px; }.result-actions .text-link { text-align:center; }
.team-teaser { display:grid; grid-template-columns:1.5fr .8fr; gap:28px; align-items:center; background:var(--ink); color:white; }.team-teaser h2 { font-size:clamp(28px,4vw,48px); line-height:1; }.team-teaser .eyebrow { color:var(--yellow); }.price-card { border:2px solid currentColor; padding:18px; background:var(--paper); color:var(--ink); }.price-card > span { display:block; font:800 12px ui-monospace,monospace; text-transform:uppercase; }.price-card > strong { display:block; font:900 46px/1 ui-monospace,monospace; margin:10px 0; }.price-card small { font:700 14px system-ui,sans-serif; }.price-card .run-button { font-size:16px; }
.scorecard-page { max-width:960px; }.scorecard-page header { width:auto; }.scorecard-page h1 { font-size:clamp(42px,7vw,76px); }.verification { display:inline-block; margin-top:18px; border:2px solid; padding:8px 12px; font:800 12px ui-monospace,monospace; }.verification.verified { background:#dff6ec; color:#08764e; }.score-proof { margin:16px 0; }.digest { border:2px dashed; padding:12px; overflow-wrap:anywhere; }.digest code { font-size:11px; }.share-controls { display:grid; grid-template-columns:1fr 1fr; gap:12px; }.share-controls .run-button { height:100%; }.error-panel { border-color:var(--red); }.compact { grid-template-columns:1.4fr .8fr; margin-top:40px; }
.commercial-header h1 { max-width:1050px; font-size:clamp(48px,8vw,90px); }.outcome-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:0; padding:0; }.outcome-grid > div { padding:24px; border-right:2px solid; }.outcome-grid > div:last-child { border-right:0; }.number { display:grid; place-items:center; width:38px; height:38px; background:var(--yellow); border:2px solid; border-radius:50%; font:800 12px ui-monospace,monospace; margin-bottom:18px; }.comparison-grid { display:grid; grid-template-columns:1fr 1fr; border:2px solid; }.comparison-grid article { padding:24px; }.comparison-grid article + article { border-left:2px solid; }.comparison-grid ul,.offer-actions ul { padding-left:20px; line-height:1.8; }.paid-column { background:#e9efff; }.founding-offer { display:grid; grid-template-columns:1.1fr .9fr; gap:34px; background:var(--yellow); }.founding-offer h2 { font-size:52px; }.price-line { display:flex; align-items:center; gap:14px; }.price-line strong { font:900 64px/.9 ui-monospace,monospace; }.price-line span { font-weight:750; }.guarantee { background:white; border:2px solid; padding:14px; margin-top:22px; }.guarantee p { margin:5px 0 0; }.offer-actions { background:#fffdf5; border:2px solid; padding:20px; }.faq details { padding:18px 0; }.faq details p { margin:10px 0 0; max-width:780px; }.legal-page { max-width:900px; }.legal-page header { width:auto; }.prose h2 { margin-top:28px; }.prose h2:first-child { margin-top:0; }
@media (max-width:760px) { .ride-grid,.agent-row,.rules,.team-teaser,.share-controls,.outcome-grid,.comparison-grid,.founding-offer { grid-template-columns:1fr; }.trace-step { grid-template-columns:42px 1fr; }.events { grid-column:2; border-top:1px solid #bbb; }.action { border-right:0; }.panel { padding:18px; }.scoreboard { grid-template-columns:1fr; }.score-ring { width:96px;height:96px; }.topbar > div { gap:10px; font-size:13px; }.proof-strip span { flex:1 1 140px; }.outcome-grid > div { border-right:0; border-bottom:2px solid; }.outcome-grid > div:last-child { border-bottom:0; }.comparison-grid article + article { border-left:0; border-top:2px solid; }.founding-offer h2 { font-size:42px; }.price-line strong { font-size:50px; } footer { flex-direction:column; } }