:root { color-scheme: dark; }
* { box-sizing: border-box; }
body {
    margin: 0;
    font-family: -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
    background: #14151a;
    color: #e8e9ee;
    line-height: 1.55;
}
.panel { background: #1b1d24; border: 1px solid #2a2c36; border-radius: 10px; padding: 2rem; }
h1 { margin-top: 0; font-size: 1.6rem; }
.status-line { color: #6fcf97; font-size: 0.95rem; }
.action {
    display: inline-block; margin-top: 0.5rem; padding: 0.5rem 1rem;
    background: #3b6fe0; color: #fff; text-decoration: none; border-radius: 6px;
}
.action:hover { background: #2f5cc0; }

/* ---- Forms (auth surface, Sprint 1) ------------------------------------ */
.form-row { display: flex; flex-direction: column; gap: 0.25rem; margin: 0.85rem 0; }
.form-row label { font-size: 0.9rem; color: #b6b9cc; }
.form-row input[type="text"],
.form-row input[type="email"],
.form-row input[type="password"] {
    padding: 0.5rem 0.65rem; border-radius: 6px;
    background: #14151a; color: #e8e9ee;
    border: 1px solid #2a2c36; font-size: 1rem;
}
.form-row input:focus { outline: 2px solid #3b6fe0; border-color: #3b6fe0; }
.form-row-inline { flex-direction: row; align-items: center; gap: 0.5rem; }
.form-row-inline label { margin: 0; }
.field-error { color: #ef6c6c; font-size: 0.85rem; }
.form-summary-error {
    background: rgba(239, 108, 108, 0.12);
    border: 1px solid rgba(239, 108, 108, 0.55);
    color: #f3b9b9; padding: 0.65rem 0.85rem; border-radius: 6px; margin-bottom: 1rem;
}
.action-secondary { background: #2a2c36; }
.action-secondary:hover { background: #353846; }
.muted { color: #8c8fa3; }
.muted a { color: #b6c2ff; }
a { color: #b6c2ff; }
hr { border: 0; border-top: 1px solid #2a2c36; margin: 1.5rem 0; }
code.otp-uri {
    display: block; padding: 0.6rem 0.75rem;
    background: #14151a; border: 1px solid #2a2c36; border-radius: 6px;
    font-family: ui-monospace, Menlo, Consolas, monospace;
    word-break: break-all; font-size: 0.85rem; color: #d4dcff;
}

/* ---- Portal home: welcome + start-wizard CTA -------------------------- */
.portal-welcome { margin-bottom: 1.25rem; }
.portal-welcome h1 { margin-bottom: 0.25rem; }
.start-wizard h2 { margin-top: 0; font-size: 1.35rem; }
.start-wizard p { margin: 0.85rem 0; }

/* ---- Status tracker --------------------------------------------------- */
.tracker {
    background: #1b1d24; border: 1px solid #2a2c36; border-radius: 10px;
    padding: 2rem;
}
.tracker-header { margin-bottom: 1.5rem; }
.tracker-header h2 { margin: 0 0 0.5rem 0; font-size: 1.35rem; }
.tracker-header p { margin: 0; font-size: 0.95rem; }

.pipeline {
    list-style: none; margin: 0; padding: 0;
    display: grid; grid-template-columns: repeat(5, 1fr);
    gap: 0;
    position: relative;
}
.pipeline-step {
    display: flex; flex-direction: column; align-items: center;
    text-align: center; padding: 0 0.5rem; position: relative;
}
/* Connecting bar between nodes — sits behind the circle nodes. */
.pipeline-step:not(:last-child)::after {
    content: ""; position: absolute;
    top: 1.1rem;
    left: calc(50% + 1.2rem);
    right: calc(-50% + 1.2rem);
    height: 2px; background: #2a2c36; z-index: 0;
}
.pipeline-step.pipeline-step-complete:not(:last-child)::after { background: #3b6fe0; }
.pipeline-node {
    width: 2.2rem; height: 2.2rem; border-radius: 50%;
    background: #14151a; border: 2px solid #2a2c36;
    display: flex; align-items: center; justify-content: center;
    color: #8c8fa3; font-weight: 600; font-size: 0.95rem;
    position: relative; z-index: 1;
}
.pipeline-step-complete .pipeline-node {
    background: #3b6fe0; border-color: #3b6fe0; color: #fff;
}
.pipeline-step-current .pipeline-node {
    background: #14151a; border-color: #6fcf97; color: #6fcf97;
    box-shadow: 0 0 0 3px rgba(111, 207, 151, 0.18);
}
.pipeline-step-skipped .pipeline-node {
    background: #14151a; border-color: #2a2c36; color: #555866;
}
.pipeline-label {
    margin-top: 0.75rem;
    display: flex; flex-direction: column; gap: 0.15rem;
    font-size: 0.9rem;
}
.pipeline-label strong { color: #e8e9ee; }
.pipeline-step-current .pipeline-label strong { color: #6fcf97; }
.pipeline-step-skipped .pipeline-label strong { color: #6b6e80; }

/* ---- Terminal-state pill (Declined / Withdrawn / Paused) -------------- */
.terminal-pill {
    margin-top: 1.5rem; padding: 1rem 1.25rem; border-radius: 8px;
    border: 1px solid #2a2c36; background: #14151a;
}
.terminal-pill h3 { margin: 0 0 0.35rem 0; font-size: 1.05rem; }
.terminal-pill p { margin: 0.35rem 0; }
.terminal-pill .terminal-rationale { color: #d4dcff; }
.terminal-pill-declined  { border-color: rgba(239, 108, 108, 0.55); background: rgba(239, 108, 108, 0.08); }
.terminal-pill-declined  h3 { color: #ef9a9a; }
.terminal-pill-withdrawn { border-color: rgba(140, 143, 163, 0.55); background: rgba(140, 143, 163, 0.06); }
.terminal-pill-withdrawn h3 { color: #b6b9cc; }
.terminal-pill-paused    { border-color: rgba(214, 175, 100, 0.55); background: rgba(214, 175, 100, 0.08); }
.terminal-pill-paused    h3 { color: #e6c47a; }

/* Narrow viewports — stack the pipeline vertically. */
@media (max-width: 640px) {
    .pipeline { grid-template-columns: 1fr; }
    .pipeline-step { flex-direction: row; align-items: flex-start; gap: 0.85rem; padding: 0.5rem 0; }
    .pipeline-step:not(:last-child)::after {
        top: 2.4rem; left: 1.1rem; right: auto;
        width: 2px; height: calc(100% - 1.5rem);
    }
    .pipeline-label { margin-top: 0; align-items: flex-start; text-align: left; }
}

/* ---- Sprint 3 — term sheets + engagement (founder portal) -------------- */
/* Scoped ts-* classes so existing founder pages (whose status-pill spans
   have always rendered unstyled here) are visually untouched. */
.ts-pill {
    display: inline-block; padding: 0.15rem 0.6rem; border-radius: 999px;
    font-size: 0.8rem; font-weight: 600; letter-spacing: 0.02em;
}
.ts-pill-issued     { background: #1f3a64; color: #cfe0ff; }
.ts-pill-accepted   { background: #1f6450; color: #c8f0d8; }
.ts-pill-signed     { background: #1f6438; color: #c5f0c5; }
.ts-pill-declined   { background: #642a2a; color: #f3c0c0; }
.ts-pill-withdrawn  { background: #4a3a1f; color: #f0d8a0; }
.ts-pill-active     { background: #1f6438; color: #c5f0c5; }
.ts-pill-completed  { background: #1f3a64; color: #cfe0ff; }
.ts-pill-terminated { background: #642a2a; color: #f3c0c0; }

.ts-list { list-style: none; padding: 0; margin: 0.5rem 0 1rem; display: grid; gap: 0.5rem; }
.ts-list-item {
    display: flex; flex-wrap: wrap; align-items: center; gap: 0.6rem;
    padding: 0.6rem 0.75rem; border: 1px solid #2a2c36; border-radius: 8px;
}
.ts-list-item a { color: #b6c2ff; font-weight: 600; }

.ts-terms {
    display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr));
    gap: 0.85rem; margin: 0.75rem 0 1rem;
}
.ts-terms > div { display: grid; }
.ts-terms dt { color: #8c8fa3; font-size: 0.75rem; text-transform: uppercase; letter-spacing: 0.04em; }
.ts-terms dd { margin: 0.15rem 0 0; font-size: 0.95rem; }

/* ---- Sprint 5 -- check-ins + invoices (founder portal) ------------------ */
.ts-pill-scheduled       { background: #2a2c36; color: #b6b9cc; }
.ts-pill-awaitingfounder { background: #1f4a64; color: #cfecff; }
.ts-pill-awaitingreview  { background: #1f5a64; color: #cff5ff; }
.ts-pill-overdue         { background: #642a2a; color: #f3c0c0; }
.ts-pill-paid            { background: #1f6438; color: #c5f0c5; }
.ts-pill-void            { background: #2a2c36; color: #b6b9cc; }
.ts-pill-draft           { background: #2a2c36; color: #b6b9cc; }