/* Launchpad by Tessera, development instance.
   Light theme — brand-chrome palette from vault/commercial/brand-guidelines.md
   (section 9.1). Tessera Teal primary on an off-white canvas; no dark chrome.
   Rebranded 2026-06-09 per Mia (light background, Launchpad name, brand colors). */
:root {
  --teal:#00897B; --teal-dark:#00695C; --teal-mid:#5BB8AC;
  --teal-tint:#B2DFDB; --teal-pale:#E8F5F3; --teal-vapor:#DFF0ED;
  --navy:#1A2744;            /* legacy anchor — reserved, not used as chrome */
  --ink:#111827; --body:#4B5563; --muted:#9CA3AF;
  --separator:#E5E7EB; --canvas:#F8F9FA; --surface:#FFFFFF; --white:#FFFFFF;
  --gray:#F4F5F7; --gray-mid:#E5E7EB;
  --amber:#B47C1E; --amber-pale:#FAECCE;
  --terra:#A34E3C; --terra-pale:#F4DBD3;
  --font-sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
  --font-mono:"SF Mono","Consolas","Liberation Mono",Menlo,monospace;
}
* { box-sizing:border-box; }
html,body { margin:0; padding:0; font-family:var(--font-sans); color:var(--ink); background:var(--canvas); font-size:14px; line-height:1.5; -webkit-font-smoothing:antialiased; }
a { color:var(--teal-dark); }

/* Top bar — light surface, teal underline */
.topbar {
  position:sticky; top:0; z-index:40; background:var(--surface); color:var(--ink);
  border-bottom:3px solid var(--teal); padding:12px 24px;
  display:flex; align-items:center; justify-content:space-between; gap:16px; flex-wrap:wrap;
  box-shadow:0 1px 3px rgba(17,24,39,.06);
}
.topbar__brand { display:flex; flex-direction:row; align-items:center; gap:12px; }
.topbar__mark { height:42px; width:auto; display:block; }
.topbar__brandtext { display:flex; flex-direction:column; gap:2px; }
.topbar__wordmark { font-weight:700; font-size:18px; letter-spacing:.2px; color:var(--ink); }
.topbar__wordmark .accent { color:var(--teal-dark); font-weight:600; font-size:13px; }
.topbar__sub { font-size:10.5px; color:var(--muted); letter-spacing:1.4px; text-transform:uppercase; }
.topbar__nav { display:flex; gap:14px; flex-wrap:wrap; align-items:center; }
.topbar__nav a { color:var(--body); text-decoration:none; font-size:12px; }
.topbar__nav a:hover { color:var(--teal-dark); }
.topbar__nav a.disabled { color:var(--muted); cursor:not-allowed; }
.run-pill {
  font-family:var(--font-mono); font-size:11px; font-weight:700;
  background:var(--teal-pale); border:1px solid var(--teal); color:var(--teal-dark);
  border-radius:999px; padding:5px 12px; letter-spacing:.4px;
}

.wrap { max-width:1080px; margin:0 auto; padding:24px 24px 64px; }
.wrap--wide { max-width:1180px; }

/* Banners */
.banner-pii {
  background:var(--teal-pale); border:1px solid var(--teal); color:var(--teal-dark);
  border-radius:8px; padding:12px 16px; font-size:12.5px; margin-bottom:18px;
  display:flex; align-items:center; gap:12px; line-height:1.5;
}
.banner-pii .dot { font-size:18px; color:var(--teal); }
.sim-banner {
  background:var(--amber-pale); border:1px solid var(--amber); color:var(--amber);
  border-radius:6px; padding:6px 14px; font-size:11px; font-weight:700; letter-spacing:1px;
  text-transform:uppercase; display:inline-block; margin-bottom:16px;
}

/* Cards */
.card { background:var(--surface); border:1px solid var(--separator); border-radius:10px; padding:20px 22px; margin-bottom:20px; }
.card--hero { background:var(--teal-pale); color:var(--ink); border:1px solid var(--teal-tint); border-radius:12px; padding:22px 26px; }
.card--hero .stripe { height:4px; background:var(--teal); margin:-22px -26px 18px; border-radius:12px 12px 0 0; }
.card--hero h1 { margin:0 0 6px; font-size:20px; color:var(--ink); }
.card--hero p { margin:0; color:var(--body); max-width:780px; font-size:13px; line-height:1.6; }
.section-head { font-size:11px; color:var(--muted); text-transform:uppercase; letter-spacing:1.4px; font-weight:700; margin:28px 0 12px; }

/* Page-name label — the bold step name at the top of every flow page, above the
   page's own product headline, so a reviewer always knows which page they are
   on. Sized in rem so it scales with the a11y text-size stepper (root font-size)
   and colored with a theme token so high-contrast mode restyles it cleanly. */
.page-label {
  font-size:2rem; font-weight:800; line-height:1.1; letter-spacing:.06em;
  text-transform:uppercase; color:var(--teal-dark); margin:0 0 1rem;
}

/* Stage jump link on the landing list. The stage cell suppresses the row's
   click so this link navigates to the stage's own page without also firing the
   row navigation. The link inherits the pill's own styling. */
.stage-link { text-decoration:none; display:inline-block; }
.stage-link:hover .pill { filter:brightness(.96); }

/* Forms */
label.field-label { display:block; font-size:12px; font-weight:700; color:var(--ink); margin:14px 0 6px; letter-spacing:.3px; }
input[type=text], select, textarea {
  width:100%; padding:10px 12px; border:1px solid var(--gray-mid); border-radius:7px;
  font-family:inherit; font-size:14px; color:var(--ink); background:var(--surface);
}
input[type=text]:focus, select:focus, textarea:focus { outline:none; border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-vapor); }
textarea { min-height:90px; resize:vertical; }
.hint { font-size:11.5px; color:var(--muted); margin-top:5px; line-height:1.5; }
.choice { display:flex; align-items:flex-start; gap:9px; padding:9px 11px; border:1px solid var(--gray-mid); border-radius:7px; margin:6px 0; background:var(--surface); cursor:pointer; }
.choice:hover { background:var(--teal-pale); border-color:var(--teal-mid); }
.choice input { margin-top:2px; }
.choice span { font-size:13.5px; color:var(--ink); }

/* Buttons */
.btn { display:inline-block; padding:10px 18px; border-radius:8px; font-size:13px; font-weight:700; border:1px solid transparent; cursor:pointer; text-decoration:none; letter-spacing:.3px; }
.btn--primary { background:var(--teal); color:var(--white); }
.btn--primary:hover { background:var(--teal-dark); }
.btn--navy { background:var(--teal-dark); color:var(--white); }
.btn--navy:hover { background:#00564B; }
.btn--ghost { background:var(--surface); color:var(--teal-dark); border-color:var(--gray-mid); }
.btn--ghost:hover { background:var(--teal-pale); border-color:var(--teal-mid); }
.btn--amber { background:var(--amber); color:var(--white); }
.btn--sm { padding:6px 12px; font-size:12px; }
.btn-row { display:flex; gap:10px; flex-wrap:wrap; margin-top:18px; }

/* Progress */
.progress-wrap { margin:18px 0 8px; }
.progress-track { height:10px; background:var(--gray-mid); border-radius:5px; overflow:hidden; }
.progress-fill { height:100%; background:var(--teal); border-radius:5px; transition:width .3s; }
.progress-label { font-size:12px; color:var(--body); margin-top:6px; }

/* Layout split */
.split { display:grid; grid-template-columns:1fr 280px; gap:22px; align-items:start; }

/* Cluster sidebar */
.clusters { background:var(--surface); border:1px solid var(--separator); border-radius:10px; padding:14px 16px; }
.clusters h3 { font-size:11px; text-transform:uppercase; letter-spacing:1.2px; color:var(--muted); margin:0 0 10px; }
.cluster { display:flex; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid var(--gray); font-size:12.5px; }
.cluster:last-child { border-bottom:none; }
.cluster.active { font-weight:700; color:var(--teal-dark); }
.cluster__count { font-family:var(--font-mono); font-size:11px; color:var(--muted); }
.cluster.active .cluster__count { color:var(--teal-dark); }

/* Pills / chips */
.pill { display:inline-flex; align-items:center; padding:5px 11px; border-radius:999px; font-size:10.5px; font-weight:700; letter-spacing:.6px; border:1px solid; }
.pill.role { background:var(--teal-dark); color:var(--white); border-color:var(--teal-dark); }
.pill.shape { background:var(--teal-pale); color:var(--teal-dark); border-color:var(--teal); }
.pill.sim { background:var(--amber-pale); color:var(--amber); border-color:var(--amber); }
.pill.prefill { background:var(--amber-pale); color:var(--amber); border-color:var(--amber); }
.pill.high { background:var(--teal-pale); color:var(--teal-dark); border-color:var(--teal); }
.pill.medium { background:var(--amber-pale); color:var(--amber); border-color:var(--amber); }
.pill.low { background:var(--terra-pale); color:var(--terra); border-color:var(--terra); }

/* Confidence meter */
.conf { display:flex; align-items:center; gap:10px; margin-top:10px; }
.conf__value { font-family:var(--font-mono); font-weight:700; font-size:15px; }
.conf__value.high { color:var(--teal); } .conf__value.medium { color:var(--amber); } .conf__value.low { color:var(--terra); }
.meter { flex:1; height:8px; background:var(--gray-mid); border-radius:4px; overflow:hidden; max-width:200px; }
.meter__fill { height:100%; background:var(--teal); }
.meter__fill.medium { background:var(--amber); } .meter__fill.low { background:var(--terra); }

/* Confirm rows */
.confirm-row { background:var(--surface); border:1px solid var(--separator); border-radius:9px; padding:14px 16px; margin-bottom:12px; border-left:4px solid var(--teal); }
.confirm-row.medium { border-left-color:var(--amber); }
.confirm-row.low { border-left-color:var(--terra); }
.confirm-row.confirmed { background:var(--teal-pale); }
.confirm-row__head { display:flex; justify-content:space-between; gap:14px; align-items:flex-start; flex-wrap:wrap; }
.confirm-row__nl { font-size:13.5px; color:var(--ink); margin:8px 0; line-height:1.55; }
.confirm-row__meta { font-size:11.5px; color:var(--muted); font-family:var(--font-mono); }
.confirm-actions { display:flex; gap:9px; align-items:center; margin-top:10px; flex-wrap:wrap; }
.confirm-actions select { width:auto; padding:6px 10px; font-size:12px; }
.confirmed-tag { font-size:11px; font-weight:700; color:var(--teal-dark); letter-spacing:.5px; }

/* Tables */
table.data { width:100%; border-collapse:collapse; font-size:12.5px; }
table.data th { background:var(--teal-pale); color:var(--teal-dark); text-align:left; padding:9px 11px; font-size:10.5px; text-transform:uppercase; letter-spacing:1px; border-bottom:1px solid var(--gray-mid); }
table.data td { padding:9px 11px; border-bottom:1px solid var(--gray-mid); vertical-align:top; }
table.data tr:nth-child(even) td { background:var(--gray); }

/* Code / preview — light surface, teal accent */
pre.preview { background:var(--canvas); color:var(--ink); font-family:var(--font-mono); font-size:12px; line-height:1.5; padding:16px; border:1px solid var(--separator); border-left:3px solid var(--teal); border-radius:8px; overflow-x:auto; margin:0; }

/* Tabs */
.tabs { display:flex; gap:6px; margin-bottom:0; }
.tab-btn { padding:8px 16px; border:1px solid var(--gray-mid); border-bottom:none; border-radius:8px 8px 0 0; background:var(--gray); cursor:pointer; font-size:12.5px; font-weight:700; color:var(--body); }
.tab-btn.active { background:var(--teal); color:var(--white); border-color:var(--teal); }
.tab-panel { display:none; }
.tab-panel.active { display:block; }

/* Audit */
.audit-event { background:var(--surface); border:1px solid var(--separator); border-radius:8px; padding:11px 14px; margin-bottom:9px; border-left:4px solid var(--teal-mid); }
.audit-event__type { font-family:var(--font-mono); font-size:12px; font-weight:700; color:var(--teal-dark); }
.audit-event__meta { font-size:11px; color:var(--muted); margin-top:3px; font-family:var(--font-mono); }
.audit-event__payload { font-size:11.5px; color:var(--body); margin-top:6px; font-family:var(--font-mono); word-break:break-word; }
.audit-seq { display:inline-block; width:26px; height:26px; line-height:26px; text-align:center; background:var(--teal-dark); color:var(--white); border-radius:6px; font-family:var(--font-mono); font-size:11px; font-weight:700; margin-right:8px; }

.doctrine { background:var(--teal-pale); color:var(--teal-dark); border-left:4px solid var(--teal); border-radius:8px; padding:14px 22px; font-size:13px; font-style:italic; font-weight:600; margin-top:24px; }
.footer-note { margin-top:24px; font-size:11.5px; color:var(--muted); line-height:1.6; }
.kv { display:flex; gap:10px; font-size:12.5px; margin:5px 0; }
.kv__k { color:var(--muted); min-width:130px; }
.kv__v { color:var(--ink); font-weight:600; }

@media (max-width:860px) {
  .split { grid-template-columns:1fr; }
}

/* Journey progress bar (Onboarding Wizard) --------------------------------- */
.journey { margin:18px 0 14px; }
.journey__head { display:flex; justify-content:space-between; align-items:baseline; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.journey__now { font-size:15px; font-weight:700; color:var(--teal-dark); }
.journey__by { font-size:12px; color:var(--muted); }
.journey__bar { list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:6px; margin:0; padding:0; }
.journey__step { display:flex; align-items:center; gap:6px; }
.journey__dot { display:inline-flex; align-items:center; justify-content:center; min-width:22px; height:22px; padding:0 6px; border-radius:11px; font-size:11px; font-weight:700; border:1px solid var(--gray-mid); background:var(--surface); color:var(--muted); }
.journey__step--done .journey__dot { background:var(--teal); border-color:var(--teal); color:var(--white); }
.journey__step--current .journey__dot { background:var(--teal-dark); border-color:var(--teal-dark); color:var(--white); box-shadow:0 0 0 3px var(--teal-vapor); }
.journey__step--upcoming .journey__dot { opacity:.85; }
.journey__name { font-size:12.5px; font-weight:700; color:var(--teal-dark); }

/* Confirm All control ------------------------------------------------------ */
.confirm-all { display:flex; align-items:center; flex-wrap:wrap; gap:12px; background:var(--teal-pale); border:1px solid var(--teal-tint); border-radius:10px; padding:12px 16px; margin:6px 0 18px; }
.confirm-all label { font-size:13px; color:var(--ink); display:flex; align-items:center; gap:8px; }
.confirm-all__note { font-size:11.5px; color:var(--muted); }

/* Viewable PDF frame ------------------------------------------------------- */
.pdf-frame { width:100%; height:640px; border:1px solid var(--separator); border-radius:8px; background:var(--canvas); }

/* Onboarding-stage breadcrumb (v1.5) -------------------------------------- */
.crumbs { max-width:1080px; margin:14px auto 0; padding:0 24px; }
.crumbs__bar { list-style:none; display:flex; flex-wrap:wrap; align-items:center; gap:4px; margin:0; padding:10px 14px; background:var(--surface); border:1px solid var(--separator); border-radius:10px; }
.crumbs__step { display:flex; align-items:center; gap:4px; }
.crumbs__bubble { display:inline-flex; align-items:center; gap:7px; padding:5px 12px 5px 6px; border-radius:999px; border:1px solid var(--gray-mid); background:var(--surface); text-decoration:none; }
a.crumbs__bubble:hover { background:var(--teal-pale); border-color:var(--teal-mid); }
.crumbs__bubble--static { opacity:.55; cursor:not-allowed; }
.crumbs__dot { display:inline-flex; align-items:center; justify-content:center; min-width:20px; height:20px; padding:0 5px; border-radius:10px; font-size:10.5px; font-weight:700; background:var(--gray); color:var(--muted); border:1px solid var(--gray-mid); }
.crumbs__label { font-size:11.5px; font-weight:700; color:var(--body); letter-spacing:.2px; }
.crumbs__arrow { color:var(--muted); font-size:14px; padding:0 2px; }
.crumbs__step--done .crumbs__dot { background:var(--teal); border-color:var(--teal); color:var(--white); }
.crumbs__step--done .crumbs__label { color:var(--teal-dark); }
.crumbs__step--current .crumbs__bubble { background:var(--teal-pale); border-color:var(--teal); box-shadow:0 0 0 3px var(--teal-vapor); }
.crumbs__step--current .crumbs__dot { background:var(--teal-dark); border-color:var(--teal-dark); color:var(--white); }
.crumbs__step--current .crumbs__label { color:var(--teal-dark); }

/* Ingest-progress page (v1.5) --------------------------------------------- */
.ingest-stage { font-size:14px; font-weight:700; color:var(--teal-dark); min-height:20px; }
.ingest-pctrow { display:flex; align-items:baseline; gap:12px; flex-wrap:wrap; }
.ingest-pct { font-size:18px; font-weight:700; color:var(--teal-dark); font-family:var(--font-mono); }

/* Intake acquisition modes (v1.5) ----------------------------------------- */
.intake-mode { margin-top:6px; }
.choice--mode { align-items:flex-start; }
.intake-panel { margin:6px 0 4px; padding:12px 14px; background:var(--surface); border:1px solid var(--teal-tint); border-radius:8px; }

/* Category-gaps summary (v1.5) -------------------------------------------- */
.gap-summary { border-left:4px solid var(--teal); }
.gap-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(220px,1fr)); gap:12px; margin-top:6px; }
.gap-tile { display:block; padding:13px 15px; border-radius:9px; border:1px solid var(--separator); text-decoration:none; background:var(--surface); transition:border-color .15s, box-shadow .15s; }
.gap-tile:hover { border-color:var(--teal-mid); box-shadow:0 2px 8px rgba(0,137,123,.10); }
.gap-tile--open { border-left:4px solid var(--amber); }
.gap-tile--clear { border-left:4px solid var(--teal); }
.gap-tile__top { display:flex; align-items:center; gap:10px; }
.gap-tile__count { display:inline-flex; align-items:center; justify-content:center; min-width:30px; height:30px; padding:0 8px; border-radius:8px; font-size:15px; font-weight:800; font-family:var(--font-mono); }
.gap-tile--open .gap-tile__count { background:var(--amber-pale); color:var(--amber); }
.gap-tile--clear .gap-tile__count { background:var(--teal-pale); color:var(--teal-dark); }
.gap-tile__cat { font-size:13.5px; font-weight:700; color:var(--ink); }
.gap-tile__detail { font-size:12px; color:var(--body); margin-top:7px; line-height:1.5; }
.gap-tile__jump { font-size:11px; font-weight:700; color:var(--teal-dark); margin-top:8px; letter-spacing:.3px; }

/* Simulate: per-channel side-by-side visualizer control. */
.sbs-control{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid var(--line);}
.sbs-control .hint{margin:0;}

/* On-hold list pill */
.pill.hold { background:var(--gray); color:var(--body); border-color:var(--gray-mid); }

/* Per-row action dropdown (Launchpad list) --------------------------------- */
.rowmenu-cell { position:relative; overflow:visible; white-space:nowrap; }
.rowmenu { display:inline-block; position:relative; }
.rowmenu > summary { list-style:none; display:inline-block; }
.rowmenu > summary::-webkit-details-marker { display:none; }
.rowmenu > summary::after { content:" \25BE"; }
.rowmenu[open] > summary::after { content:" \25B4"; }
.rowmenu__panel {
  position:absolute; right:0; top:calc(100% + 4px); z-index:30;
  min-width:210px; background:var(--surface); border:1px solid var(--separator);
  border-radius:9px; box-shadow:0 6px 20px rgba(17,24,39,.14); padding:6px;
}
.rowmenu__note { font-size:10.5px; color:var(--muted); padding:5px 8px 7px; line-height:1.4; border-bottom:1px solid var(--gray); margin-bottom:4px; }
.rowmenu__item {
  display:block; width:100%; text-align:left; box-sizing:border-box;
  background:none; border:none; border-radius:6px; cursor:pointer;
  padding:8px 10px; font-size:12.5px; font-weight:600; color:var(--teal-dark);
  font-family:inherit; text-decoration:none;
}
.rowmenu__item:hover { background:var(--teal-pale); }
.rowmenu__item--hold { color:var(--body); }
.rowmenu__item--off { color:var(--muted); cursor:not-allowed; }
.rowmenu__item--off:hover { background:none; }
.rowmenu__lock { font-size:10px; font-weight:700; text-transform:uppercase; letter-spacing:.5px; color:var(--muted); float:right; margin-top:1px; }
.rowmenu form { margin:0; }
