/* Application stylesheet.
   Repo rule (2026-08-09): NO CSS in .clj files. Structure and Datastar
   attributes live in Hiccup; everything visual lives here. Extracted
   verbatim from views/app-css when that rule landed. */
  /* =================================================================== *
   * WARM PAPER — Treatment 1 (docs/mockups/create-event-treatments.html)
   *
   * Architecture, ratified 2026-08-09: cascade layers + native CSS
   * nesting, no preprocessor. Every rule below refers to var(--token) and
   * NOTHING hardcodes a colour, a radius or a font stack — so restyling
   * this app later is editing the :root block and nothing else.
   *
   * One caveat worth knowing before you move a rule: Fomantic UI arrives
   * UNLAYERED from a CDN <link>, and an unlayered normal declaration beats
   * a layered one no matter what order they appear in. Where we have to
   * win against Fomantic (body, .ui.header, .ui.form label) the
   * declaration carries !important — for IMPORTANT declarations the layer
   * order inverts and layered beats unlayered, so that is the sanctioned
   * way to do it rather than a specificity arms race. Our own components
   * (.marquee, .create-page, .btn-go) have no vendor competitor and need
   * no such thing.
   * =================================================================== */
  @layer tokens, base, components, page;

  @layer tokens {
    :root {
      /* surfaces + ink */
      --paper: #FAF7F2;
      --paper-deep: #F1EADD;
      --card: #FFFFFF;
      --ink: #221E17;
      --ink-soft: #3B342A;
      --muted: #7C7264;
      --muted-2: #948A7B;
      --kicker: #9C9284;
      /* rules + fields */
      --line: #E9E1D5;
      --line-soft: #EFE8DC;
      --field-line: #DDD4C6;
      --field-line-hover: #CBBFAC;
      --placeholder: #B4A996;
      /* links */
      --link: #1E62A8;
      --link-hover: #134B84;
      --link-underline: rgba(30,98,168,.32);
      /* the go button */
      --go: #1B7A4B;
      --go-hover: #166540;
      --go-ink: #FFFFFF;
      --danger: #B3261E;
      /* the marker + the focus halo it doubles as */
      --highlight: #FFF1B8;
      --focus-halo: #FFF1B8;
      --focus-line: #B9924A;
      /* ghost (empty) state */
      --ghost-paper: #F4EFE6;
      --ghost-line: #DFD5C4;
      --ghost-ink: #C4B9A6;
      /* public agenda — session cards + operations bands (Sched-quality
         bar translated into Warm Paper: sage session fill from the --go
         family; neutral recessed ops band; warm amber social band). */
      --agenda-session-fill: #EDF3EA;
      --agenda-session-line: #D9E5D3;
      --agenda-ops-fill: #F3EEE4;
      --agenda-ops-line: #E7DECD;
      --agenda-ops-ink: #8B8172;
      --agenda-social-fill: #FBF0DC;
      --agenda-social-line: #EDDDBB;
      --agenda-social-ink: #8A6A2F;
      /* geometry */
      --radius: 7px;
      --radius-lg: 12px;
      --pill: 999px;
      --field-inset: inset 0 1px 2px rgba(90,74,50,.06);
      --btn-lift: 0 1px 0 rgba(0,0,0,.14), inset 0 1px 0 rgba(255,255,255,.22);
      /* type */
      --font-display: 'Fraunces', 'Iowan Old Style', 'Palatino Linotype', Georgia, serif;
      --font-ui: 'Source Sans 3', system-ui, 'Seravek', 'Avenir Next', 'Segoe UI', sans-serif;
      --display-axes: 'SOFT' 60, 'WONK' 1, 'opsz' 110;
    }

    /* Vendored from google/fonts, SIL OFL 1.1 — each licence ships beside
       its font in resources/public/vendor/. No CDN at runtime. */
    @font-face {
      font-family: 'Fraunces';
      src: url('/vendor/fraunces-latin.woff2') format('woff2');
      font-weight: 100 900; font-style: normal; font-display: swap;
    }
    @font-face {
      font-family: 'Source Sans 3';
      src: url('/vendor/source-sans-3-latin.woff2') format('woff2');
      font-weight: 200 900; font-style: normal; font-display: swap;
    }
  }

  @layer base {
    body {
      font-family: var(--font-ui) !important;
      background: var(--paper) !important;
      color: var(--ink) !important;
      font-size: 16px !important;
      line-height: 1.55;
    }
    a {
      color: var(--link);
      &:hover { color: var(--link-hover); }
    }
    h1, h2, h3, h4, .ui.header {
      font-family: var(--font-display) !important;
      font-variation-settings: var(--display-axes);
      color: var(--ink) !important;
    }
    /* Scoped to the FIELD label Fomantic actually styles. A bare
       `.ui.form label` would also grab the radio sentence in .cfp-choice —
       and because important declarations invert the layer order, an earlier
       layer would then beat the page layer trying to un-bold it. */
    .ui.form .field > label {
      font-family: var(--font-ui) !important;
      font-size: 15px !important;
      font-weight: 600 !important;
      color: var(--ink-soft) !important;
    }
    input:focus, select:focus, textarea:focus {
      outline: none;
      border-color: var(--focus-line) !important;
      box-shadow: 0 0 0 4px var(--focus-halo) !important;
    }
    ::placeholder { color: var(--placeholder); }
  }
  .ui.container { max-width: 940px !important; }
  .app-header { display:flex; align-items:baseline; justify-content:space-between;
                margin-bottom: 1.4em; }
  .app-header h1 { margin: 0 !important; }
  .app-header .sub { color:#888; font-size: 0.85em; }
  .field-hint { color:#888; font-size: 0.85em; margin-top: 0.25em; }
  /* THE PROSE STANDARD (Gene, 2026-08-09): any box that asks for sentences is
     generous when empty and grows with the writing. field-sizing:content is
     browser-owned auto-size (no JS, nothing for a morph to fight); rows= in
     the markup is the fallback floor for engines without it. prose-deep is
     the multi-paragraph ask: the pitch, the abstract, the bio. */
  .ui.form textarea { min-height: 8em; field-sizing: content; max-height: 65vh; }
  .ui.form textarea.prose-deep { min-height: 13em; }
  .field-hint.slug-ok { color: var(--go); }
  .field-hint.slug-bad { color: var(--danger); }
  .slug-prefix { color:#888; }
  .ui.table td, .ui.table th { padding: 0.55em 0.7em !important; }
  .ui.table thead th { text-transform: uppercase; font-size:0.75em; letter-spacing:0.04em;
                       color:#999; font-weight:600; }
  .empty-state { color:#888; text-align:center; padding: 2.5em 1em; }
  .checklist { list-style:none; margin:0; padding:0; }
  .checklist li { padding: 0.45em 0; border-bottom:1px solid #f2f2f2; display:flex; gap:0.6em; }
  .checklist li:last-child { border-bottom:none; }
  .checklist .box { width:1.2em; flex:none; color:#aaa; }
  .checklist .done { color:#21ba45; }
  .checklist .done + span { color:#888; text-decoration: line-through; }
  .facts dt { color:#999; font-size:0.78em; text-transform:uppercase; letter-spacing:0.04em; }
  .facts dd { margin: 0 0 0.9em 0; font-weight:600; }
  /* A URL you hand to speakers is a link, not code (Gene, 2026-08-10 —
     'why in the world is a URL in monospace'). */
  .cfp-url { font-weight: 600; word-break: break-all; }
  /* The committee page (step 3): roster + add form as quiet white cards,
     yellow initials discs, role as a quiet pill (Gene, 2026-08-09). */
  .roster-card {
    background: var(--card); border: 1px solid var(--line-soft);
    border-radius: var(--radius-lg); padding: 1em 1.25em;
    box-shadow: 0 1px 6px rgba(34, 30, 23, 0.06);
    margin-bottom: 1.6em;
  }
  .member-avatar {
    display: inline-flex; align-items: center; justify-content: center;
    width: 32px; height: 32px; flex: none; border-radius: 50%;
    background: var(--highlight); color: var(--ink);
    font-size: 12px; font-weight: 700; font-family: var(--font-ui);
  }
  .member-role-pill {
    display: inline-block; margin-left: 0.5em;
    background: var(--paper-deep); color: var(--muted);
    font-size: 0.72em; font-weight: 700; letter-spacing: 0.04em;
    text-transform: uppercase; padding: 0.1em 0.65em;
    border-radius: var(--pill);
  }
  .member-role-pill.chair { background: var(--highlight); color: var(--ink); }
  .btn-go.sm { padding: 0.55em 1.3em; font-size: 0.95em; }
  .member-list { margin: 0.4em 0 1em 0; }
  .member-row { display:flex; align-items:center; justify-content:space-between;
                gap:0.8em; padding:0.6em 0; border-bottom:1px solid var(--line-soft); }
  .member-row .member-who { flex: 1; min-width: 0; }
  .member-actions { display:flex; align-items:center; gap:0.35em; flex:none; }
  .member-actions form { display:inline; }
  .member-row:last-child { border-bottom:none; }
  .member-name { font-weight:600; margin-right:0.4em; }
  .member-email { color:#888; font-size:0.85em; }
  .member-tracks { display:flex; flex-wrap:wrap; gap:0.3em; margin-top:0.28em; }
  .member-track {
    color:var(--muted); background:var(--paper-deep);
    border:1px solid var(--line-soft); border-radius:var(--pill);
    font-size:0.72em; line-height:1.4; padding:0.08em 0.55em;
  }
  .add-member-form { margin-top: 0.6em; padding-top: 0.9em; border-top:1px solid #eee; }
  .optional { color:#aaa; font-weight:400; font-size:0.9em; }
  /* Public CFP page */
  .cfp-masthead { border-bottom: 1px solid var(--line); padding-bottom: 1.1em; margin-bottom: 1.6em; }
  .cfp-masthead .masthead-title {
    font-family: var(--font-display);
    font-variation-settings: var(--display-axes);
    font-weight: 600; font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.16; letter-spacing: -.012em; color: var(--ink);
    margin: 0 0 0.3em 0 !important;
  }
  .cfp-masthead .masthead-mark {
    background-image: linear-gradient(180deg,
      transparent 54%, var(--highlight) 54%, var(--highlight) 93%, transparent 93%);
    -webkit-box-decoration-break: clone;
    box-decoration-break: clone;
    padding: 0 .06em;
  }
  .cfp-kicker { text-transform:uppercase; letter-spacing:0.1em; font-size:0.8em;
                color:var(--kicker); font-weight:700; margin-bottom:0.4em; }
  .cfp-meta { color:#555; margin-top:0.8em; }
  .cfp-meta .sep { color:#ccc; margin:0 0.5em; }
  /* The blurb Gene loved (2026-08-11 screenshot): ONE serif voice throughout,
     gentle size step — big thesis, medium serif body, quiet serif footnote. */
  .cfp-intro { font-family:var(--font-display); font-size:1.06em; color:var(--ink-soft);
               max-width:46em; line-height:1.5; text-wrap:pretty;
               margin:0.7em 0 0.2em; }
  .cfp-intro p { margin:0 0 0.7em; }
  .cfp-intro p:last-child { margin-bottom:0; }
  .cfp-intro p:first-child { font-size:1.28em; line-height:1.42; color:var(--ink);
                             letter-spacing:-0.005em; }
  /* TWO registers only (Gene, 2026-08-11: "make styling the same"):
     paragraph 1 = serif thesis; everything after = ONE quiet sans voice. */
  .cfp-intro p:nth-child(n+2) { font-family:var(--font-ui); font-weight:400;
                                font-size:0.85em; color:var(--ink-soft);
                                line-height:1.55; }
  /* The two-column editorial masthead. */
  .cfp-two-col { display:grid; grid-template-columns:1.6fr 1fr; gap:2.5em;
                 align-items:start; margin-top:0.4em; }
  @media (max-width:720px) { .cfp-two-col { grid-template-columns:1fr; gap:1.2em; } }
  .cfp-rail { border-left:1px solid var(--line); padding-left:1.5em;
              font-size:0.92em; color:var(--ink-soft); }
  .cfp-rail .rl { margin-bottom:0.9em; }
  .cfp-rail .rk { display:block; font-size:10.5px; font-weight:700;
                  letter-spacing:0.12em; text-transform:uppercase;
                  color:var(--muted); margin-bottom:0.25em; }
  .cfp-rail-attr { margin-top:0.35em; font-size:0.92em; color:var(--ink-soft); }
  .cfp-colophon { font-size:0.85em; color:var(--muted); max-width:46em; }
  /* THE 404 — "Not on the program" (Gene, 2026-08-11). Same editorial voice as
     the CFP masthead: serif headline, quiet sans body, one link out. The
     two-class selector beats .public-widget-page's !important top margin
     without an arms race. */
  .public-widget-page.nf-page { margin-top: 14vh !important; text-align:left; }
  .nf-page .masthead-title {
    font-family: var(--font-display);
    font-variation-settings: var(--display-axes);
    font-weight: 600; font-size: clamp(28px, 3.4vw, 40px);
    line-height: 1.16; letter-spacing: -.012em; color: var(--ink);
    margin: 0 0 0.5em 0 !important;
  }
  .nf-body { font-family:var(--font-ui); font-size:1.05em; color:var(--ink-soft);
             max-width:34em; line-height:1.5; margin:0 0 0.4em; }
  .nf-aside { font-style:italic; font-size:0.9em; color:var(--muted);
              max-width:34em; margin:0 0 1.4em; }
  .nf-detail { font-size:0.9em; color:var(--muted); max-width:34em;
               margin:0 0 1.4em; }
/* Intro-less events: collapse the two-col to a single horizontal rail. */
.cfp-two-col.cfp-rail-only { display:block; }
.cfp-two-col.cfp-rail-only .cfp-intro-col { display:none; }
.cfp-two-col.cfp-rail-only .cfp-rail { display:flex; gap:3em; flex-wrap:wrap;
  border-left:0; padding-left:0; border-top:1px solid var(--line);
  padding-top:1em; margin-top:0.6em; }
.cfp-two-col.cfp-rail-only .cfp-rail .rl { margin-bottom:0; max-width:22em; }
.cfp-rail-row { display:flex; gap:3em; flex-wrap:wrap; border-left:0;
                padding-left:0; border-top:1px solid var(--line);
                padding-top:1em; margin-top:0.6em; }
.cfp-rail-row .rl { margin-bottom:0; max-width:22em; }
.agenda-frame-note { font-size:0.92em; font-weight:600; color:var(--ink-soft);
                     margin:0.2em 0 0.6em; }
.agenda-day-empty { color:var(--muted); margin:0.4em 0 0; }
.agenda-soon { font-family:var(--font-display); font-size:1.1em;
               color:var(--ink-soft); }
/* Eyebrow + live draft-status share one baseline row (SSE morph target keeps
   its own id/element — layout only). */
.cfp-section-row { display:flex; align-items:baseline; gap:1em; }
.cfp-section-row .cfp-section-title { margin:2em 0 0.8em; }
.cfp-section-row .cfp-draft-status { margin:0; }

  /* Form: grayscale discipline — no browser blue, no alarm-red asterisks. */
  .ui.form input, .ui.form select, .ui.form textarea { accent-color: var(--ink); }
  .ui.form input[type=radio], .ui.form input[type=checkbox] { accent-color: var(--ink); }
  .ui.form input:focus, .ui.form select:focus, .ui.form textarea:focus {
    outline:none; border-color:var(--ink-soft);
    box-shadow:0 0 0 2px var(--line); }
  .required-mark { color:var(--muted); margin-left:2px; }
  .cfp-limit { color:#888; font-size:0.9em; margin-top:0.3em; }
  /* THE eyebrow — one style everywhere (matches .public-result-count). */
  .cfp-section-title { text-transform:uppercase; letter-spacing:0.14em; font-size:11px;
                       color:var(--muted); font-weight:600; margin:2em 0 0.8em 0; }
  .import-box { border:1px solid #d4d4d5; border-radius:4px; padding:0.9em 1em;
                background:#fafafa; margin-bottom:1.2em; }
  .import-box .title { font-weight:600; margin-bottom:0.5em; }
  .private-note { border-left:3px solid #e0b400; padding-left:0.8em; }
  .char-limit { color:#aaa; font-size:0.8em; float:right; }
  .sub-row { padding:0.6em 0; border-bottom:1px solid #f2f2f2; }
  .sub-row:last-child { border-bottom:none; }
  .sub-title { font-weight:600; }
  .sub-meta { color:#888; font-size:0.85em; }
  /* Organizer layout: fixed sidebar + content */
  .ui.container.wide { max-width: 1180px !important; }
  .layout { display:flex; gap:2.4em; align-items:flex-start; }
  .sidebar { width:246px; flex:none; position:sticky; top:0.9em; }
  .content { flex:1; min-width:0; }
  /* First content row: breadcrumb left, whoami right — the sidebar owns
     the top of the viewport, so this strip lives INSIDE the column
     (Gene, 2026-08-10: no dead band above the sidebar). */
  .content-top { display:flex; align-items:flex-start;
                 justify-content:space-between; gap:1em; }
  .content-top .whoami { margin-left:auto; margin-bottom:0; }
  /* Event log */
  .log-row { display:flex; gap:0.9em; padding:0.5em 0; border-bottom:1px solid #f2f2f2;
             align-items:baseline; }
  .log-row:last-child { border-bottom:none; }
  .log-when { color:#999; font-size:0.8em; white-space:nowrap; flex:none; width:11.5em; }
  .log-type { font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
              font-size:0.8em; color:#2185d0; white-space:nowrap; flex:none; width:11em; }
  .log-what { flex:1; min-width:0; }
  .log-actor { color:#aaa; font-size:0.8em; white-space:nowrap; flex:none; }
  /* Signed-in strip */
  .whoami { display:flex; justify-content:flex-end; align-items:center; gap:0.6em;
            font-size:0.82em; color:#888; margin-bottom:0.5em; }
  .whoami form { display:inline; }
  /* ---- The review board ---- */
  .coverage { display:flex; align-items:center; gap:1em; margin-bottom:1.1em; }
  .coverage-headline { font-size:1.15em; font-weight:700; white-space:nowrap; }
  .coverage-track { flex:1; height:10px; background:#eee; border-radius:5px; overflow:hidden; }
  .coverage-fill { height:100%; background:#21ba45; }
  .coverage-note { color:#888; font-size:0.85em; white-space:nowrap; }
  .board-controls { display:flex; gap:0.7em; align-items:center; flex-wrap:wrap;
                    margin-bottom:1em; }
  .chip { display:inline-block; padding:0.2em 0.6em; border-radius:999px; font-size:0.78em;
          border:1px solid #ddd; color:#555; background:#fff; white-space:nowrap; }
  a.chip:hover { background:#f4f4f5; }
  .chip.on { background:#2185d0; border-color:#2185d0; color:#fff; font-weight:600; }
  .sidebar .sb-policy-link { display:block; margin:1px 0 6px 3px; padding:6px 8px;
    border:1px solid var(--line); border-radius:6px; color:var(--muted);
    font-size:11px; font-weight:600; line-height:1.25; text-decoration:none; }
  .sidebar .sb-policy-summary, .sidebar .sb-policy-action { display:block; }
  .sidebar .sb-policy-action { margin-top:4px; color:var(--ink); }
  .sidebar .sb-policy-link:hover { color:var(--ink); border-color:var(--focus-line); }
  /* Coverage work stays primary; the all-submissions weather report docks at
     its right edge and wraps beneath it on narrow screens. */
  .board-work-queue-row { display:grid; grid-template-columns:minmax(0, 1fr);
                          align-items:start; gap:2em; margin:0 0 1em; }
  .board-work-queue-row .board-coverage-grid { min-width:0; width:auto; margin:0; }
  .board-work-queue-row .spark-block { margin-left:auto; }
  .spark polyline { stroke: var(--go); stroke-width: 2; }
  .spark circle { fill: var(--go); }
  .spark .spark-fill { fill: var(--highlight); stroke: var(--focus-line);
                       stroke-width: 1; opacity: 0.85; }
  .spark-label { color: var(--muted); font-size: 0.82em; margin-top: 1px; }
  .spark-axis { display:flex; justify-content:space-between;
                color: var(--muted-2); font-size: 0.7em; }
  .spark-label .sep { color:#ccc; margin:0 0.4em; }
  .spark-label .gold { color: var(--focus-line); }
  @media (min-width:900px) {
    .board-work-queue-row { grid-template-columns:minmax(0, 1fr) max-content; }
    .board-work-queue-row .spark-block { margin-top:0; margin-bottom:0; }
  }
  /* Numbers wear the plot's own colors: submissions line is red,
     reviewed fill is green (Gene, 2026-08-10). */
  .spark-label .spark-subs { color: var(--danger); }
  .spark-label .spark-rev { color: var(--go); }
  .spark-counts { font-size: 0.74em; margin-top: 0; }

  /* THE LEDGER (Gene ratified treatment A, 2026-08-09): one line per
     submission, sortable headings, conversation as a sub-row, controls
     revealed by :target — no server state, no JS, morph-proof. */
  .ledger-table thead th {
    text-align:left; font-size:0.72em; text-transform:uppercase;
    letter-spacing:0.07em; color:var(--muted); font-weight:700;
    padding:0.35em 0.5em; border-bottom:2px solid var(--line);
    white-space:nowrap;
  }
  .ledger-table thead th a { color:inherit; }
  .ledger-table thead th.on a { color:var(--ink); }
  .ledger-row td { border-top:1px solid var(--line-soft);
                   padding:0.5em 0.5em; vertical-align:top; }
  .lg-flag { width:1%; }
  .lg-title { min-width:16em; }
  .lg-focus { color:var(--muted-2); margin-right:0.45em; text-decoration:none; }
  .lg-focus:hover { color:var(--ink); }
  .lg-title-link { color:var(--ink); font-weight:650; }
  .lg-title-link:hover { color:var(--link); }
  .lg-speaker { white-space:nowrap; }
  .lg-speaker .b-headshot.sm { width:22px; height:22px; vertical-align:middle;
                               margin-right:0.45em; }
  .lg-org { color:var(--ink-soft); }
  .lg-size, .lg-n { text-align:center; white-space:nowrap; }
  .lg-mean, .lg-score { text-align:center; white-space:nowrap; }
  .lg-you { text-align:center; font-weight:700; color:var(--focus-line); }
  .lg-state { width:1%; }
  .ledger-sub td { padding:0 0.5em 0.55em; border:none; font-size:0.9em; }
  .lg-spacer { width:1%; border:none; }
  .ledger-controls { display:none; }
  .ledger-controls td { padding:0 0.5em 0.7em; border:none; }
  tbody.ledger:target .ledger-controls { display:table-row; }
  tbody.ledger:target .ledger-row td { background:var(--card); }
  tbody.ledger:target .ledger-row td:first-child {
    box-shadow: inset 3px 0 0 var(--highlight); }
  tbody.ledger:hover .ledger-row td { background:var(--card); }

  /* THE REVIEW BOARD, Warm Paper (2026-08-09): the shared table the doctrine
     describes. Hairline-separated entries on paper, marker yellow for YOUR
     marks, the warm gold for everyone's stars. */
  .board-table { width:100%; border-collapse:collapse; }
  .board-row-a td { border-top:1px solid var(--line); padding:0.85em 0.5em 0.2em 0.5em;
                    vertical-align:middle; }
  .board-table tbody:hover .board-row-a td,
  .board-table tbody:hover .board-row-b td { background: var(--card); }
  .board-row-b td { padding:0 0.5em 0.85em 0.5em; }
  .board-divider td { background:var(--paper-deep); color:var(--muted); font-size:0.84em;
                      letter-spacing:0.02em; padding:0.55em 0.5em; text-align:center; }
  .sub-flag { cursor:pointer; background:none; border:none; font-size:1.05em; padding:0 0.2em;
              filter:grayscale(1); opacity:0.3; }
  .sub-flag.on { filter:none; opacity:1; }
  .b-title { font-weight:650; font-size:1.04em; line-height:1.3; }
  .b-title a { color:var(--ink); }
  .b-title a:hover { color:var(--link); }
  .b-facts { color:var(--muted); font-size:0.82em; }
  .b-num { text-align:center; white-space:nowrap; }
  .b-mean { font-family:var(--font-display); font-variation-settings:var(--display-axes);
            font-size:1.35em; font-weight:600; color:var(--ink); }
  .b-n { color:var(--muted-2); font-size:0.8em; }
  .b-split { color:var(--danger); font-size:0.72em; font-weight:700; letter-spacing:0.04em; }
  .b-headshot { width:34px; height:34px; border-radius:50%; object-fit:cover; }
  .opinions { display:flex; flex-wrap:wrap; gap:0.4em 0.9em; align-items:baseline;
              font-size:0.87em; }
  .op-rating { white-space:nowrap; }
  .op-rating .who { font-weight:600; color:var(--ink-soft); }
  .op-stars { color:var(--focus-line); }
  .op-comment { color:var(--ink-soft); }
  .op-comment .who { font-weight:600; }
  .op-none { color:var(--muted-2); font-style:italic; }
  .pc-only { margin-top:0.45em; background:var(--paper-deep);
             border-left:3px solid var(--highlight);
             padding:0.4em 0.7em; font-size:0.87em; }
  .pc-badge { display:inline-block; background:var(--focus-line); color:var(--go-ink);
              font-size:0.65em; font-weight:700; padding:0.1em 0.45em;
              border-radius:var(--radius); letter-spacing:0.05em;
              margin-right:0.5em; vertical-align:middle; }
  .row-controls { display:flex; gap:0.6em; align-items:center; flex-wrap:wrap;
                  margin-top:0.55em; padding-top:0.5em;
                  border-top:1px dashed var(--line-soft); }
  .row-controls form { display:flex; gap:0.3em; align-items:center; margin:0; }
  .star-btn { border:1px solid var(--field-line); background:var(--card);
              border-radius:var(--radius); cursor:pointer;
              padding:0.18em 0.4em; font-size:0.78em; color:var(--muted);
              position:relative; }
  .star-radio { position:absolute; inset:0; width:100%; height:100%;
                margin:0; opacity:0; cursor:pointer; }
  .star-btn:hover { background:var(--highlight); border-color:var(--focus-line);
                    color:var(--ink); }
  .star-btn:focus-within { outline:2px solid var(--focus-line);
                           outline-offset:2px; }
  .star-btn.mine { background:var(--highlight); border-color:var(--focus-line);
                   color:var(--ink); font-weight:700; }
  .event-name-cell { display:flex; align-items:flex-start; gap:0.55em; }
  .event-default-form { margin:0; }
  .event-default-star { border:0; background:transparent; color:var(--muted-2);
                        cursor:pointer; font-size:0.83em; line-height:1;
                        opacity:0.18; padding:0.08em; }
  .event-default-star:hover { color:var(--focus-line); opacity:0.65; }
  .event-default-star.active { color:var(--focus-line); opacity:1; }
  .event-default-star:focus-visible { outline:2px solid var(--focus-line);
                                      outline-offset:2px; border-radius:2px; }
  .comment-input { width:16em; padding:0.3em 0.5em; font-size:0.85em;
                   border:1px solid var(--field-line); border-radius:var(--radius);
                   background:var(--card); }
  .mine-label { color:var(--muted-2); font-size:0.75em; margin-right:0.15em; }
  /* The status word as a quiet pill; the row's state, not a shout. */
  .board-table .ui.mini.label {
    background:var(--paper-deep) !important; color:var(--muted) !important;
    border-radius:var(--pill) !important; font-weight:700;
    font-size:0.68em !important; letter-spacing:0.03em;
  }
  /* Speakers are another organizer ledger, not a stack of profile cards.
     Keep the Review Board's face/name rail and full-width title rows, then
     put the operational truth on one quiet line underneath. */
  .speaker-ledger-table { table-layout:fixed; margin-top:0.8em; }
  .speaker-ledger-table .lg-th-person { width:31%; }
  .speaker-ledger-table th:nth-child(2) { width:10%; text-align:center; }
  .speaker-ledger-table th:nth-child(3) { width:14%; }
  .speaker-ledger-table th:nth-child(4) { width:16%; }
  .speaker-ledger-table th:last-child { width:29%; }
  tbody.speaker-ledger + tbody.speaker-ledger > .ledger-row > td {
    padding-top:0.9em;
  }
  tbody.speaker-ledger:hover > tr > td { background:var(--card); }
  .speaker-ledger-row > td { vertical-align:middle; }
  .speaker-ledger-email {
    max-width:17em; overflow:hidden; color:var(--muted); font-size:0.78em;
    text-overflow:ellipsis; white-space:nowrap;
  }
  .speaker-ledger-sessions { text-align:center; white-space:nowrap; }
  .speaker-ledger-sessions strong { color:var(--ink-soft); font-size:0.82em; }
  .speaker-ledger-actions form { margin:0; }
  .speaker-ledger-actions { vertical-align:middle !important; }
  .speaker-ledger-actions .speaker-invite-action {
    display:block; padding:0; border:0; background:none; cursor:pointer;
    color:var(--focus-line); font:inherit; font-size:0.78em; font-weight:700;
    line-height:1.6;
  }
  .speaker-ledger-actions .speaker-invite-action:hover { text-decoration:underline; }
  .speaker-ledger-title-row td, .speaker-ledger-talk-row td {
    border-top:0 !important; padding-top:0 !important; padding-bottom:0.16em !important;
  }
  .speaker-ledger-talk-row .lg-title-link { font-size:0.9em; }
  .speaker-ledger-details > td {
    padding:0.15em 0.5em 0.7em calc(48px + 12px + 0.5em) !important;
    border-top:0 !important; color:var(--muted); font-size:0.82em;
  }
  .speaker-lifecycle {
    display:flex; align-items:center; flex-wrap:wrap; gap:0.35em 0.65em;
    min-width:0;
  }
  .speaker-lifecycle-tasks, .speaker-lifecycle-history {
    padding-left:0.65em; border-left:1px solid var(--line);
  }
  .speaker-lifecycle-update { color:var(--ink-soft); }
  .speaker-filter-form .public-filter-bar { margin-bottom:0.55em; }
  .speaker-filter-facets { margin-top:0; }
  .speaker-filter-facets select {
    min-width:13em; padding:0.5em 2.1em 0.5em 0.75em;
    border:1px solid var(--line); border-radius:7px; background:var(--card);
  }
  .speaker-edit-page { max-width:64em; }
  @media (max-width:70em) {
    .speaker-ledger-table { table-layout:auto; }
    .speaker-ledger-table .lg-th-person { width:auto; }
    .speaker-ledger-email { max-width:12em; }
  }
  /* Alert rows — count first, then the sentence, then where to go */
  .alerts { margin-bottom:1.2em; }
  .alert-row { display:flex; align-items:baseline; gap:0.6em; padding:0.5em 0.7em;
               border-left:3px solid #ddd; background:#fbfbfb; margin-bottom:0.35em; }
  .alert-row.urgent { border-left-color:#f2711c; background:#fff8f3; }
  .alert-count { font-size:1.25em; font-weight:700; min-width:1.6em; }
  .alert-text { flex:1; }
  .alert-go { white-space:nowrap; font-size:0.85em; }
  /* Portal */
  .portal-sub { border:1px solid #e4e4e5; border-radius:5px; padding:1em 1.1em;
                margin-bottom:1.1em; }
  .portal-sub h3 { margin:0 0 0.2em 0 !important; font-size:1.12em; }
  .portal-event { color:#888; font-size:0.88em; margin-bottom:0.6em; }
  .status-pill { display:inline-block; padding:0.2em 0.7em; border-radius:999px;
                 font-size:0.8em; font-weight:600; }
  .status-pill.review { background:#f0f0f1; color:#666; }
  .status-pill.accepted { background:#21ba45; color:#fff; }
  .status-pill.waitlisted { background:#f2b01e; color:#fff; }
  .status-pill.declined { background:#e8e8e8; color:#777; }
  .accepted-banner { background:#e8f8ec; border:1px solid #a3e0b5; border-radius:5px;
                     padding:0.8em 1em; margin-bottom:0.8em; }
  .task-list { list-style:none; margin:0.6em 0 0 0; padding:0; }
  .task-row { display:flex; align-items:center; gap:0.6em; padding:0.4em 0;
              border-bottom:1px solid #f4f4f4; }
  .task-row:last-child { border-bottom:none; }
  .task-row.done .task-label { color:#999; text-decoration:line-through; }
  .task-tick { width:1.2em; flex:none; }
  .task-label { flex:1; }
  .task-form { display:flex; gap:0.3em; align-items:center; }
  .task-form input[type=url] { width:16em; padding:0.2em 0.4em; font-size:0.85em; }
  /* Inform */
  .letter { background:#fcfcfc; border:1px solid #e4e4e5; border-radius:4px;
            padding:0.9em 1.1em; margin:0.5em 0; }
  .letter-subject { font-weight:700; margin-bottom:0.4em; }
  .letter-to { color:#888; font-size:0.85em; margin-bottom:0.6em; }
  .letter-body { white-space:pre-wrap; font-size:0.9em; line-height:1.5; color:#333; }
  .comms-table { table-layout:fixed; width:100%; }
  .comms-table .c-when { width:13em; white-space:nowrap; color:#666; font-size:0.85em; }
  .comms-table .c-to { width:16em; overflow-wrap:anywhere; font-size:0.9em; }
  .comms-table .c-status { width:7em; white-space:nowrap; text-align:right; }
  .inform-group { margin-bottom:2em; }
  .inform-head { display:flex; align-items:baseline; justify-content:space-between;
                 gap:1em; border-bottom:2px solid #222; padding-bottom:0.4em;
                 margin-bottom:0.8em; }
  /* Schedule */
  .day-tabs { display:flex; gap:0.4em; margin-bottom:1em; flex-wrap:wrap; }
  .status-bar { display:flex; gap:1.4em; flex-wrap:wrap; align-items:baseline;
                background:#f7f7f8; border-radius:5px; padding:0.7em 1em; margin-bottom:1em; }
  .status-bar .n { font-weight:700; font-size:1.1em; }
  .status-bar .lbl { color:#777; font-size:0.85em; }
  .status-sep { color:#ddd; }
  .conflict-chip { display:block; background:#fff4e5; border-left:3px solid #f2711c;
                   padding:0.45em 0.8em; margin-bottom:0.35em; font-size:0.88em; }
  .conflict-chip .fixes { margin-left:0.6em; }
  .conflict-chip form { display:inline; }
  .withheld-note { background:var(--ghost-paper); border-left:3px solid var(--focus-line);
                   padding:0.45em 0.8em; margin-bottom:1em; font-size:0.88em;
                   color:var(--ink-soft); }
  .sched-grid { width:100%; border-collapse:collapse; table-layout:fixed; }
  .sched-grid th { font-size:0.75em; text-transform:uppercase; letter-spacing:0.05em;
                   color:#888; padding:0.4em; border-bottom:2px solid #ddd; text-align:left; }
  .sched-grid td { border:1px solid #f0f0f0; padding:0.3em; vertical-align:top; height:3em; }
  .sched-time { width:5.5em; color:#888; font-size:0.8em; white-space:nowrap;
                background:#fafafa; }
  .sched-card { background:#eef5fd; border:1px solid #cfe0f5; border-radius:4px;
                padding:0.35em 0.5em; font-size:0.85em; }
  .sched-card.block { background:#f4f4f5; border-color:#e0e0e2; color:#666; font-style:italic; }
  .sched-card.conflicted { background:#fff4e5; border-color:#f2b98c; }
  .sched-card .who { color:#777; font-size:0.9em; }
  .sched-card .acts { margin-top:0.25em; }
  .sched-card .acts form { display:inline; }
  .sched-card .acts button, .sched-card .acts select {
    font-size:0.72em; padding:0.05em 0.3em; }
  .unroomed-col { background:#fffdf5; }
  .tray { border:1px solid #e4e4e5; border-radius:5px; padding:0.9em 1em; margin-bottom:1.2em; }
  .tray-card { border-bottom:1px solid #f2f2f2; padding:0.5em 0; }
  .tray-card:last-child { border-bottom:none; }
  .place-form { display:flex; gap:0.35em; align-items:center; flex-wrap:wrap;
                margin-top:0.35em; }
  .place-form input, .place-form select { font-size:0.8em; padding:0.15em 0.3em; }
  .locked-banner { background:#eef5fd; border:1px solid #cfe0f5; border-radius:5px;
                   padding:0.8em 1em; margin-bottom:1em; display:flex;
                   justify-content:space-between; align-items:center; gap:1em; }
  /* Public agenda — the Sched quality bar in Warm Paper (2026-08-18).
     Times keep a fixed left gutter; the card/band lives in .agenda-body so
     the gutter stays clean. Session cards (real sessions AND program-speaker
     blocks) get the sage fill; operations rows are quiet recessive bands,
     with a warm amber accent for social items (networking, party). */
  .agenda-item { display:flex; gap:1.1em; padding:0; margin:0 0 0.9em;
                 align-items:flex-start; border-bottom:none; }
  .agenda-time { width:8.5em; flex:none; color:var(--muted); font-size:0.88em;
                 white-space:nowrap; font-variant-numeric:tabular-nums;
                 padding-top:0.95em; }
  .agenda-item-ops .agenda-time { padding-top:0.55em; }
  .agenda-body { flex:1; min-width:0; }
  .agenda-card { background:var(--agenda-session-fill);
                 border:1px solid var(--agenda-session-line);
                 border-radius:var(--radius-lg); padding:0.85em 1.15em; }
  .agenda-speaker-name { font-weight:650; color:var(--ink); font-size:1.02em;
                         line-height:1.35; }
  .agenda-speaker-org { color:var(--muted); font-size:0.88em; margin-top:0.15em; }
  .agenda-band { border:1px solid var(--agenda-ops-line); border-radius:var(--radius);
                 background:var(--agenda-ops-fill); padding:0.45em 1.15em; }
  .agenda-band-label { font-size:0.78em; font-weight:700; letter-spacing:0.09em;
                       text-transform:uppercase; color:var(--agenda-ops-ink);
                       line-height:1.5; }
  .agenda-band-social { background:var(--agenda-social-fill);
                        border-color:var(--agenda-social-line); }
  .agenda-band-social .agenda-band-label { color:var(--agenda-social-ink); }
  .agenda-title { font-weight:700; line-height:1.35; }
  .agenda-title a { color:var(--ink); }
  .agenda-title a:hover { color:var(--link-hover); }
  .agenda-who { color:var(--muted); font-size:0.9em; margin-top:0.2em; }
  .agenda-room { color:var(--muted-2); font-size:0.85em; margin-top:0.4em; }
  .personal-schedule-toggle { margin-top:0.65em !important; }
  .personal-schedule-toggle[aria-pressed="true"] { color:var(--go) !important; border-color:var(--go) !important; }
  .my-schedule-export { margin:1em 0 1.4em; }
  /* Form builder — Warm Paper: every grey here is a token, so a restyle is a
     token-block swap. The card shell itself (.fb-card) is unlayered, at the
     bottom of this file, because it must beat the CDN's .ui.segment. */
  /* Two calm lines per question (Gene, 2026-08-09): a label line and a muted
     shape line — much shorter than the old 4-5 line stack, but not the cramped
     one-liner that came before this. The label anchors to its preview twin. */
  .fb-row { display:flex; gap:0.7em; align-items:baseline; padding:0.7em 0.3em;
            border-bottom:1px solid var(--line-soft); line-height:1.4; }
  .fb-row:last-child { border-bottom:none; }
  .fb-row.retired { opacity:0.7; }
  .fb-row.retired .fb-label { color:var(--ghost-ink); text-decoration:line-through; }
  .fb-ord { width:1.5em; flex:none; color:var(--muted-2); font-size:0.85em; text-align:right;
            padding-top:0.1em; }
  .fb-main { flex:1; min-width:0; }
  .fb-label { font-weight:600; color:var(--ink); text-decoration:none; font-size:1.02em;
              border-bottom:1px solid transparent; }
  .fb-label:hover { border-bottom-color:var(--field-line); }
  .fb-shape { display:block; color:var(--muted-2); font-size:0.82em; margin-top:0.15em; }
  .fb-glyph { margin-left:0.35em; font-size:0.85em; }
  .fb-meta { color:var(--muted); font-size:0.8em; margin-top:0.15em; }
  .fb-id { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; color:var(--muted);
           background:var(--paper-deep); padding:0.05em 0.35em; border-radius:3px; }
  .fb-opts { color:var(--muted); font-size:0.82em; margin-top:0.2em; }
  .fb-body { flex:1; min-width:0; }
  /* Actions live UNDERNEATH the (full-width) label now, so a long question
     never squeezes the buttons (Gene, 2026-08-09, question #6). */
  .fb-acts { display:flex; gap:0.3em; align-items:center; flex-wrap:wrap;
             margin-top:0.5em; }
  .fb-acts form { display:inline; margin:0; }
  .fb-tag { display:inline-block; font-size:0.65em; font-weight:700; letter-spacing:0.05em;
            padding:0.1em 0.45em; border-radius:3px; margin-left:0.4em; vertical-align:middle; }
  .fb-tag.req { background:var(--danger); color:var(--card); }
  .fb-tag.priv { background:var(--focus-line); color:var(--card); }
  .fb-tag.lock { background:var(--paper-deep); color:var(--muted); }
  .fb-tag.gone { background:var(--muted); color:var(--card); }
  .fb-confirm { background:var(--highlight); border-left:3px solid var(--focus-line);
                padding:0.55em 0.8em; margin:0.4em 0 0.4em 2.4em; font-size:0.88em; }
  .fb-confirm form { display:inline; margin-right:0.3em; }
  .fb-preview { border:1px solid var(--line); border-radius:5px; padding:1em 1.1em;
                background:var(--paper); }
  .fb-preview .field { margin-bottom:0.9em !important; }
  .fb-ghost { border:1px dashed var(--ghost-line); border-radius:5px;
              padding:0.7em 0.8em 0.4em; background:var(--ghost-paper);
              margin-bottom:0.9em; }
  .fb-retired { margin-top:0.6em; border-top:1px dashed var(--line); padding-top:0.5em; }
  .fb-retired summary { cursor:pointer; color:var(--muted); font-size:0.85em;
                        user-select:none; }
  .fb-retired summary:hover { color:var(--ink-soft); }
  /* Time travel */
  .timetravel { background:#f3f0fa; border:1px solid #d9d0f0; border-radius:5px;
                padding:0.7em 1em; margin-bottom:1em; }
  .timetravel .row1 { display:flex; align-items:baseline; justify-content:space-between;
                      gap:1em; flex-wrap:wrap; }
  .timetravel input[type=range] { width:100%; margin-top:0.5em; }
  .tt-when { font-weight:700; }
  .replay-bar { background:#f7f7f8; border-radius:5px; padding:0.8em 1em; margin-bottom:1em; }
  .replay-progress { height:10px; background:#e4e4e5; border-radius:5px; overflow:hidden;
                     margin:0.5em 0; }
  .replay-fill { height:100%; background:#6435c9; transition:width 0.3s linear; }
  .replay-controls { display:flex; gap:0.5em; align-items:center; flex-wrap:wrap; }
  .replay-controls form { display:inline; }
  @media (max-width: 640px) {
    .agenda-item { flex-direction:column; gap:0.3em; }
    .agenda-time { width:auto; padding-top:0; }
    .agenda-item-ops .agenda-time { padding-top:0; }
  }

@layer components {
  /* ---- PAPER EDGE: the event workspace rail ------------------------
   * The nav is the lifecycle, so it reads as a printed contents page:
   * a cream column, quiet ink links, group labels in small caps. The
   * ACTIVE page is marked with the same highlighter stroke the create
   * marquee uses — a filled pill would be a different vocabulary. */
  /* De-barred (Gene, 2026-08-11: "a lot of bars") — the rail floats on the
     page; the role cards carry their own edges. */
  .sidebar {
    padding: 22px 18px 20px;
    display: flex;
    flex-direction: column;
    gap: 1px;

    .sb-top {
      display: flex; align-items: baseline; justify-content: space-between;
      gap: 10px; font-size: 13px; margin-bottom: 14px;

      & a { color: var(--muted); }
      & a:hover { color: var(--ink); }
    }
    .sb-event { padding-bottom: 14px; border-bottom: 1px solid var(--line); margin-bottom: 12px; }
    .sb-title {
      font-family: var(--font-display);
      font-variation-settings: var(--display-axes);
      font-weight: 600; font-size: 19px; line-height: 1.25; color: var(--ink);
    }
    .sb-state {
      font-size: 12.5px; color: var(--muted-2); margin-top: 5px;
      &.open { color: var(--go); }
    }
    .sb-group {
      font-size: 12px; letter-spacing: .09em; text-transform: uppercase;
      color: var(--kicker); margin: 14px 0 2px 2px;
    }
    .sb-item {
      /* Adjust line-height here to change sidebar menu vertical spacing. */
      display: inline-block; font-size: 15px; line-height: 1.25; color: var(--ink-soft);
      padding: 2px 3px; border-radius: var(--radius); margin-left: 2px;

      &:hover { color: var(--ink); text-decoration: none; }
      &:focus-visible { outline: none; box-shadow: 0 0 0 3px var(--focus-halo); }
      /* The marker stroke, not a filled pill. */
      &.active {
        color: var(--ink); font-weight: 600;
        background-image: linear-gradient(180deg,
          transparent 58%, var(--highlight) 58%, var(--highlight) 92%, transparent 92%);
      }
    }
    .sb-out { color: var(--link); }
    .sb-complete-label { display:inline-flex; align-items:center; gap:0.38em; }
    .sb-inline-check { color:var(--go); font-weight:900; }
    .sb-inline-x { color:var(--danger); font-weight:900; }
    .sb-start-pill {
      display:inline-block; margin-left:0.45em; padding:0.08em 0.55em;
      border-radius:var(--pill); background:var(--go); color:white;
      font-size:0.62em; font-weight:800; line-height:1.5;
      letter-spacing:0.06em; text-transform:uppercase; vertical-align:0.14em;
    }
    .sb-read-only-label { display:inline-flex; align-items:center; gap:0.5em; }
    .sb-read-only-pill {
      display:inline-block; padding:0.06em 0.5em; border:1px solid var(--line);
      border-radius:var(--pill); color:var(--muted); font-size:0.62em;
      font-weight:800; line-height:1.45; letter-spacing:0.06em;
      text-transform:uppercase;
    }
    .read-only-fields { border:0; margin:0; padding:0; min-width:0; }
    .sb-quiet {
      margin-top: 18px; padding-top: 14px; border-top: 1px solid var(--line);
      font-size: 13px; color: var(--muted);

      & a { color: var(--muted); }
      & a:hover { color: var(--ink); }
      & a.on { color: var(--ink); font-weight: 600; }
      .dot { color: var(--ghost-ink); padding: 0 6px; }
    }
  }

  /* Events › <event> › <page>. The last crumb is ink and unlinked — a
     breadcrumb that links to where you already are is noise. */
  .crumbs {
    font-size: 13px; color: var(--muted); margin-bottom: 22px; line-height: 1.7;

    & a { color: var(--muted); border-bottom: 1px solid transparent; }
    & a:hover { color: var(--ink); border-bottom-color: var(--line); text-decoration: none; }
    .sep { color: var(--ghost-ink); padding: 0 7px; }
    .here { color: var(--ink); font-weight: 600; }
  }

  /* The one deliberate act on the dashboard's Event card. */
  .cfp-act {
    margin: 6px 0 4px;
    & button { font-family: var(--font-ui); }
  }
}

@layer page {
  .cfps-page { max-width: 44em; margin: 4.5em auto 6em; padding: 0 1.5em; }
  .cfps-intro { color: var(--muted); font-size: 1.08em; line-height: 1.65; }
  .cfps-rule {
    display: flex; align-items: center; gap: 1em; margin: 2.2em 0 1.6em;
    color: var(--kicker); font-size: 0.78em; font-weight: 700;
    letter-spacing: 0.12em; text-transform: uppercase; white-space: nowrap;

    &::after { content: ""; flex: 1; border-top: 1px solid var(--line); }
  }
  .cfps-event {
    display: grid; grid-template-columns: 5.2em 1fr; gap: 0 1.4em;
    margin-bottom: 1.4em; padding: 1.5em 1.7em 1.4em;
    background: var(--card); border: 1px solid var(--line); border-radius: 10px;
    box-shadow:
      0 1px 2px color-mix(in srgb, var(--ink) 4%, transparent),
      0 6px 18px -12px color-mix(in srgb, var(--ink) 12%, transparent);
  }
  .cfps-date {
    grid-row: 1 / span 4; align-self: start; padding: 0.55em 0.3em 0.6em;
    text-align: center; background: var(--paper); border: 1px solid var(--line);
    border-radius: 8px;
  }
  .cfps-date .mo {
    display: block; color: var(--go); font-size: 0.72em; font-weight: 700;
    letter-spacing: 0.14em; text-transform: uppercase;
  }
  .cfps-date .dd {
    display: block; color: var(--ink); font-family: var(--font-display);
    font-size: 1.5em; font-weight: 600; line-height: 1.15;
  }
  .cfps-date .yr { display: block; color: var(--muted); font-size: 0.72em; }
  .cfps-card-head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 0.8em; min-width: 0;
  }
  .cfps-event h2 {
    margin: 0 0 0.3em; font-family: var(--font-display); font-size: 1.45em;
    font-weight: 600; line-height: 1.2;
  }
  .cfps-card-head h2 { min-width: 0; }
  .cfps-event h2 a { color: var(--link); text-decoration: none; }
  .cfps-event h2 a:hover {
    color: var(--link-hover); text-decoration: underline;
    text-decoration-color: color-mix(in srgb, var(--link) 32%, transparent);
  }
  .cfps-event-meta {
    display: flex; flex-wrap: wrap; gap: 0.3em 0; margin-bottom: 0.9em;
    color: var(--muted); font-size: 0.95em;
  }
  .cfps-event-meta span + span::before {
    content: "·"; margin: 0 0.55em; color: var(--kicker);
  }
  .cfps-state {
    flex: none; padding: 0.24em 0.68em; border-radius: var(--pill);
    font-size: 0.7em; font-weight: 800; letter-spacing: 0.05em;
    line-height: 1.35; text-transform: uppercase; white-space: nowrap;
  }
  .cfps-state-open {
    color: var(--go);
    background: color-mix(in srgb, var(--go) 9%, var(--card));
    border: 1px solid color-mix(in srgb, var(--go) 28%, var(--line));
  }
  .cfps-event-meta .deadline {
    display: flex; align-items: baseline; gap: 0.5em; flex-basis: 100%;
    margin-top: 0.45em; padding: 0.55em 0.7em;
    color: var(--ink-soft); font-weight: 600;
    background: color-mix(in srgb, var(--highlight) 35%, var(--card));
    border-left: 3px solid var(--go); border-radius: 0 var(--radius) var(--radius) 0;
  }
  .cfps-event-meta span + span.deadline::before { content: none; margin: 0; }
  .cfps-event-meta .deadline-label {
    color: var(--muted); font-size: 0.72em; font-weight: 800;
    letter-spacing: 0.08em; text-transform: uppercase;
  }
  .cfps-foot {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1em; flex-wrap: wrap; margin-top: 0.2em; padding-top: 0.95em;
    border-top: 1px solid var(--line-soft);
  }
  .cfps-event .cfps-organizer { margin-top: 0; }
  .cfps-event .masthead-cfp-link {
    margin-left: auto; padding: 0.55em 1.15em; color: var(--card);
    background: var(--go); font-weight: 700; text-decoration: none; white-space: nowrap;
    border: 1px solid var(--go);
    border-radius: 8px;
  }
  .cfps-event .masthead-cfp-link:hover {
    color: var(--card);
    background: color-mix(in srgb, var(--go) 84%, var(--ink));
  }
  .cfps-gallery {
    grid-column: 2; margin-top: 1.1em; padding-top: 1em;
    border-top: 1px solid var(--line-soft);
  }
  .cfps-gallery-kicker {
    margin-bottom: 0.9em; color: var(--kicker); font-size: 0.72em;
    font-weight: 700; letter-spacing: 0.12em; text-transform: uppercase;
  }
  .cfps-gallery .cfp-featured-grid {
    grid-template-columns: repeat(auto-fill, minmax(108px, 1fr));
    gap: 1.2em 0.8em; margin-top: 0;
  }
  .cfps-gallery .cfp-featured-card .public-headshot {
    width: 76px; height: 76px; margin: 0 auto 7px;
  }
  .cfps-gallery .cfp-featured-name { font-size: 13.5px; line-height: 1.25; }
  .cfps-gallery .cfp-featured-org { font-size: 11.5px; }
  .cfps-gallery .cfp-featured-title,
  .cfps-gallery .public-itrev-history { font-size: 11px; line-height: 1.3; }
  .cfps-gallery-more { margin-top: 1.1em; font-size: 0.92em; }
  .cfps-gallery-more a { color: var(--link); font-weight: 600; text-decoration: none; }
  .cfps-gallery-more a:hover { text-decoration: underline; }
  .cfps-empty {
    margin-top: 2em !important; padding: 1.4em 1.5em !important;
    border: 1px solid var(--line) !important; box-shadow: none !important;
  }
  @media (max-width: 560px) {
    .cfps-event { grid-template-columns: 1fr; }
    .cfps-date { display: none; }
    .cfps-gallery { grid-column: 1; }
    .cfps-card-head { align-items: center; }
    .cfps-foot { align-items: stretch; }
    .cfps-event .masthead-cfp-link {
      width: 100%; margin-left: 0; box-sizing: border-box; text-align: center;
    }
  }
  .nf-discovery { margin-top: 1em; }

  /* ---- Create event: the marquee screen -----------------------------
   * Layout is scoped to .create-page on purpose. The tokens and the base
   * typography above are global (every screen warms up for free); the
   * geometry here is not, so no other page is re-laid-out. */
  .create-page {
    max-width: 660px;

    .marquee { margin: 0 0 46px 0; }

    /* The Basecamp signature: a highlighter run under the words, not a box
       around them. box-decoration-break keeps the stroke continuous when the
       headline wraps, which it does the moment a location is typed. */
    .marquee-title {
      font-family: var(--font-display);
      font-variation-settings: var(--display-axes);
      font-weight: 600;
      font-size: clamp(30px, 3.9vw, 46px);
      line-height: 1.16;
      letter-spacing: -.012em;
      color: var(--ink);
      margin: 0 !important;

      &.ghost {
        color: var(--ghost-ink);
        font-style: italic;
        & span { border-bottom: 2px dashed var(--ghost-line); }
      }
    }
    .marquee-mark {
      background-image: linear-gradient(180deg,
        transparent 54%, var(--highlight) 54%, var(--highlight) 93%, transparent 93%);
      -webkit-box-decoration-break: clone;
      box-decoration-break: clone;
      padding: 0 .06em;
    }
    .marquee-caption { margin: 20px 0 0; font-size: 15px; line-height: 1.6; color: var(--muted); }
    .marquee-url {
      margin: 8px 0 0; font-size: 16px; color: var(--link);
      border-bottom: 1px solid var(--link-underline);
      display: inline-block; word-break: break-all;

      & .copy-url {
        margin-left: 0.6em; padding: 1px 8px; font-size: 12px;
        color: var(--muted); background: var(--card);
        border: 1px solid var(--line); border-radius: 6px; cursor: pointer;
        &:hover { color: var(--ink); border-color: var(--muted-2); }
      }

      /* No name yet, so no address yet — said in the same ghost idiom as
         the headline instead of inventing one out of the dates. */
      &.ghost {
        color: var(--ghost-ink); border-bottom-color: transparent;
        & span { font-style: italic; border-bottom: 1px dashed var(--ghost-line); }
      }
    }
    .marquee-assist {
      margin-top: 14px; font-size: 15px; color: var(--muted);

      & button {
        font: inherit; color: var(--link); background: none; border: none;
        padding: 0; cursor: pointer; text-decoration: underline;
        text-underline-offset: 3px; text-decoration-color: var(--link-underline);
        &:hover { color: var(--link-hover); }
      }
    }

    & form { border-top: 1px solid var(--line); padding-top: 36px; }
    .field { margin-bottom: 26px !important; }

    & input[type=text], & input[type=date], & input[type=email], & input[type=url],
    & select {
      background: var(--card) !important;
      border: 1px solid var(--field-line) !important;
      border-radius: var(--radius) !important;
      padding: 13px 14px !important;
      font-family: var(--font-ui);
      font-size: 17px;
      color: var(--ink) !important;
      box-shadow: var(--field-inset);
      width: 100%;

      &:hover { border-color: var(--field-line-hover) !important; }
    }

    /* The open/closed choice reads as a sentence, not a fieldset. */
    .cfp-choice {
      color: var(--muted); font-size: 15px; margin: 0 0 26px 0;

      .lead {
        display: block; font-weight: 600; font-size: 15px;
        color: var(--ink-soft); margin-bottom: 6px;
      }
      & label {
        display: block; font-size: 15px !important; font-weight: 400 !important;
        color: var(--muted) !important; padding: 3px 0;
      }
      & input[type=radio] { margin-right: 8px; }
    }
    .cfp-until {
      margin: 6px 0 0 26px; display: flex; align-items: center;
      gap: 10px; flex-wrap: wrap; color: var(--muted-2);

      & input[type=date] { width: auto; font-size: 15px !important; padding: 9px 12px !important; }
    }

    /* Native <details>: zero JavaScript, keyboard-accessible for free, and the
       browser owns the open/closed state so an SSE morph cannot reset it. */
    .create-details {
      margin: 6px 0 34px;
      border-top: 1px solid var(--line-soft);
      border-bottom: 1px solid var(--line-soft);

      & > summary {
        padding: 16px 2px; font-size: 15px; color: var(--muted);
        cursor: pointer; border-radius: var(--radius);
        &:hover { color: var(--ink); }
        &:focus-visible { outline: none; box-shadow: 0 0 0 4px var(--focus-halo); }
      }
      .field-hint { color: var(--muted-2); }
    }

    .btn-go {
      background: var(--go); color: var(--go-ink); border: none;
      border-radius: var(--pill); padding: 15px 30px;
      font-family: var(--font-ui); font-size: 17px; font-weight: 600;
      letter-spacing: .005em; box-shadow: var(--btn-lift); cursor: pointer;
      transition: background .13s, transform .08s;

      &:hover { background: var(--go-hover); }
      &:active { transform: translateY(1px); }
      &:focus-visible { outline: none; box-shadow: 0 0 0 4px var(--focus-halo), 0 0 0 5px var(--go); }
    }
    .btn-quiet {
      background: none; border: none; color: var(--link);
      font-family: var(--font-ui); font-size: 15px; cursor: pointer;
      text-decoration: underline; text-underline-offset: 3px;
      text-decoration-color: var(--link-underline); padding: 6px 2px;
      border-radius: var(--radius);

      &:hover { color: var(--link-hover); }
      &:focus-visible { outline: none; box-shadow: 0 0 0 4px var(--focus-halo); }
    }

    .create-footer {
      margin: 40px 0 0; font-size: 15px; line-height: 1.75;
      color: var(--muted); max-width: 56ch;

      & strong { color: var(--ink-soft); }
      .box { border-top: 1px solid var(--line-soft); padding-top: 18px; margin-top: 18px; }
      .demo-note { margin-top: 10px; }
    }
  }

  /* One moment of motion, on load only. The SSE morph is deliberately NOT
     animated — a headline that fades on every keystroke is a strobe. */
  @keyframes rise {
    from { opacity: 0; transform: translateY(6px); }
    to   { opacity: 1; transform: none; }
  }
  @media (prefers-reduced-motion: no-preference) {
    .create-page {
      .rise { animation: rise 300ms ease-out both; }
      .rise-1 { animation-delay: .08s; }
      .rise-2 { animation-delay: .16s; }
    }
  }
}

/* Launch strip — the dashboard's loud walk-to-launch when the call isn't open.
   Same visual language as the create page: paper card, marker accent, one
   green act. (Kept unlayered deliberately: it must win over legacy rules.) */
.launch-strip {
  background: var(--card); border: 1px solid var(--line); border-radius: 10px;
  padding: 16px 18px; margin: 0 0 1.4em;
}
.launch-strip .launch-lead { font-weight: 600; color: var(--ink); margin-bottom: 10px; }
.launch-strip .launch-steps { display: flex; gap: 10px; flex-wrap: wrap; align-items: stretch; }
.launch-strip .launch-step {
  display: flex; align-items: center; gap: 8px;
  border: 1px solid var(--line); border-radius: 8px; padding: 10px 14px;
  color: var(--ink); background: var(--paper); font-weight: 600;
  text-decoration: none; cursor: pointer; font-size: 14px;
}
.launch-strip .launch-step:hover { border-color: var(--muted-2); }
.launch-strip .launch-step .n {
  display: inline-flex; align-items: center; justify-content: center;
  width: 20px; height: 20px; border-radius: 50%;
  background: var(--highlight); color: var(--ink); font-size: 12px;
}
.launch-strip .launch-step .launch-note { color: var(--muted); font-weight: 400; font-size: 12px; }
.launch-strip .launch-step-form { display: contents; }
.launch-strip .launch-step.go { background: var(--go); color: var(--go-ink); border-color: var(--go); }
.launch-strip .launch-step.go:hover { background: var(--go-hover); }
.launch-strip .launch-step.go .n { background: rgba(255,255,255,.25); color: var(--go-ink); }

/* CREATE CFP — the transient launch wizard in the sidebar. Steps are real
   nav rows with a number that becomes a ✓; the open act is the one green
   thing in the column. Gone the moment the call opens. */
.sidebar .sb-step { display: inline-flex; align-items: center; gap: 8px; }
.sidebar .sb-step-n {
  display: inline-flex; align-items: center; justify-content: center;
  width: 18px; height: 18px; border-radius: 50%; flex: none;
  background: var(--highlight); color: var(--ink); font-size: 11px; font-weight: 700;
}
.sidebar .sb-step-note { color: var(--muted-2); font-weight: 400; font-size: 11px; }
.sidebar .sb-item.sb-step-done { color: var(--muted); cursor: default; }
.sidebar .sb-item.sb-step-done .sb-step-n { background: var(--line-soft); color: var(--muted); }
.sidebar .sb-open-form { margin: 6px 0 4px; }
.sidebar .sb-open {
  width: 100%; padding: 8px 12px; border: none; border-radius: var(--pill);
  background: var(--go); color: var(--go-ink); font-weight: 600; font-size: 13px;
  cursor: pointer; font-family: var(--font-ui);
}
.sidebar .sb-open:hover { background: var(--go-hover); }

/* Wizard rows: grid, not flex — fixed number column, text column where the
   note stacks UNDER the label. Nothing fights for rail width, the number
   top-aligns, labels never wrap mid-phrase (the 2x2 jumble of 2026-08-09). */
.sidebar .sb-step {
  display: grid; grid-template-columns: 18px 1fr;
  column-gap: 8px; row-gap: 1px; align-items: start; width: 100%;
}
.sidebar .sb-step-n { margin-top: 2px; }
.sidebar .sb-step-label { grid-column: 2; font-size: 14px; line-height: 1.35; }
.sidebar .sb-step-note { grid-column: 2; display: block; }

/* Done steps: a green ✓, no disc; future steps carry an invisible spacer in
   the marker column so labels align — the group header ("step N of 3") does
   the counting (Gene, 2026-08-09). */
/* THE EVENT MASTHEAD CARD (treatment A, Gene 2026-08-09): names the room you
   are standing in. Native <details>; the ⇅ summary opens the switcher. */
.sidebar .sb-event-card {
  border: 1px solid var(--line); border-radius: var(--radius-lg);
  background: var(--card); margin: 10px 0 4px;
}
.sidebar .sb-event-card summary {
  list-style: none; cursor: pointer; padding: 10px 12px;
  display: grid; grid-template-columns: 1fr auto; column-gap: 8px;
  align-items: center; border-radius: var(--radius-lg);
}
.sidebar .sb-event-card summary::-webkit-details-marker { display: none; }
.sidebar .sb-event-card summary:hover { background: var(--paper); }
.sidebar .sb-event-title {
  grid-column: 1; font-family: var(--font-display); font-weight: 600;
  font-size: 15.5px; line-height: 1.25; color: var(--ink);
}
.sidebar .sb-event-meta { grid-column: 1; color: var(--muted); font-size: 12px; }
.sidebar .sb-event-switch {
  grid-column: 2; grid-row: 1 / span 2; color: var(--muted-2); font-size: 14px;
  display: inline-flex; align-items: center; gap: 4px;
}
.sidebar .sb-event-count {
  background: var(--paper-deep); color: var(--muted);
  font-size: 11px; font-weight: 700; font-family: var(--font-ui);
  padding: 1px 7px; border-radius: var(--pill);
}
.sidebar .sb-event-card[open] summary {
  border-bottom: 1px solid var(--line-soft);
  border-radius: var(--radius-lg) var(--radius-lg) 0 0;
}
.sidebar .sb-event-menu { padding: 6px 8px; display: flex; flex-direction: column; }
.sidebar .sb-event-opt { padding: 5px 6px; border-radius: var(--radius); font-size: 14px; }
.sb-event-opt { display:flex; align-items:baseline; gap:0.6em; }
.sb-event-opt .sb-opt-name { min-width:0; }
.sb-opt-state { margin-left:auto; font-size:10px; font-weight:600;
                letter-spacing:0.08em; text-transform:uppercase;
                color:var(--muted); white-space:nowrap; }
.sb-opt-state.open { color:var(--ink); }
.cfp-state-cell { display:block; margin-left:0; margin-bottom:0.2em; }

.sidebar .sb-event-opt:hover { background: var(--paper); text-decoration: none; }
.sidebar .sb-event-opt.all { color: var(--muted); font-size: 13px; }

/* THE DEV STRIP — diagnostics in normal document flow. It follows the judged
   page instead of covering its last control or intercepting viewport clicks.
   Deliberately un-Warm-Paper (slate) so it cannot be mistaken for product. */
.dev-strip {
  margin: 0 18px 18px; position: static;
  padding: 8px 18px; background: #2E2A24; color: #D8D2C6;
  font-size: 12.5px; border-radius: var(--radius);
}
.dev-strip summary { list-style: none; cursor: pointer; }
.dev-strip summary::-webkit-details-marker { display: none; }
.dev-strip .dev-strip-body {
  display: flex; align-items: center; gap: 18px; margin-top: 6px;
}
.sb-dev-badge {
  display: inline-block; background: var(--highlight); color: var(--ink);
  font-size: 10px; font-weight: 800; letter-spacing: 0.12em;
  padding: 1px 8px; border-radius: var(--pill); flex: none;
}
/* The scrubber, restyled for the strip: full remaining width, compact rows. */
.dev-strip-scrub { flex: 1; min-width: 0; }
.dev-strip-scrub .timetravel { margin: 0; padding: 0; border: none; background: none; }
.dev-strip-scrub .timetravel .row1 { font-size: 12px; color: #D8D2C6; }
.dev-strip-scrub .timetravel .row1 strong { color: #EDE8DD; }
.dev-strip-scrub .timetravel .tt-when { color: var(--highlight); }
.dev-strip-scrub .timetravel input[type="range"] { width: 100%; }
.dev-strip-scrub .timetravel .field-hint { color: #A79E8E; font-size: 10.5px; margin: 0; }

/* Wizard rows sit TIGHT and EVEN — one unit, identical padding per row
   (Gene, 2026-08-09). */
.sidebar .sb-item.sb-step-item {
  display: block; padding-top: 3px; padding-bottom: 3px; margin: 0;
}
.sidebar .sb-item .sb-step-n.sb-ck {
  background: transparent; color: var(--go); font-size: 13px;
}
.sidebar .sb-step-sp { width: 18px; flex: none; }

/* .btn-go escaped .create-page scope 2026-08-09 — the green act appears on
   the Form page ("Looks right") and future step pages too. Sm = header-sized. */
.btn-go {
  background: var(--go); color: var(--go-ink); border: none;
  border-radius: var(--pill); padding: 15px 30px;
  font-family: var(--font-ui); font-size: 17px; font-weight: 600;
  letter-spacing: .005em; box-shadow: var(--btn-lift); cursor: pointer;
  transition: background .13s, transform .08s;
}
.btn-go:hover { background: var(--go-hover); }
.btn-go:active { transform: translateY(1px); }
.btn-go.btn-go-sm { padding: 9px 18px; font-size: 14px; }

/* Step banner — the wizard's voice on a step page. */
.step-banner {
  background: var(--card); border: 1px solid var(--line);
  border-left: 4px solid var(--highlight); border-radius: var(--radius);
  padding: 12px 16px; margin: 0 0 1.2em; color: var(--ink-soft);
}

/* Form builder: Warm Paper card shell — same language as the launch strip,
   and unlayered for the same reason: it must win over the CDN's .ui.segment. */
.ui.segment.fb-card {
  background: var(--card); border: 1px solid var(--line);
  border-radius: 10px; box-shadow: none; padding: 16px 18px;
}
.ui.segment.fb-card > .ui.header { color: var(--ink); }

/* The derived spine's owner line — only rendered when the sidebar had to
   CHOOSE an event (no event in the URL, several exist). */
.sidebar .sb-event-name {
  display: block; font-family: var(--font-display); font-weight: 600;
  font-size: 15px; color: var(--ink); text-decoration: none;
  margin: 14px 0 2px; padding: 0 10px;
}
.sidebar .sb-event-name:hover { color: var(--link-hover); }

/* Edit-question MODAL (Gene, 2026-08-09) — one question at a time takes the
   foreground; the list underneath never shifts. Server-owned: ?edit=<id>
   drives it, the scrim + × are plain cancel links, zero JS. Unlayered so it
   beats the Fomantic .ui.segment underneath. */
.fb-modal-backdrop {
  position: fixed; inset: 0; z-index: 1000;
  display: flex; align-items: flex-start; justify-content: center;
  padding: 5vh 1rem;
}
.fb-modal-scrim {
  position: absolute; inset: 0;
  background: rgba(34, 30, 23, 0.42); backdrop-filter: blur(1px);
}
.fb-modal {
  position: relative; z-index: 1; width: 100%; max-width: 560px;
  max-height: 90vh; overflow-y: auto;
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius-lg); box-shadow: 0 18px 50px rgba(34,30,23,.28);
  margin: 0 !important;
}
.fb-modal-head {
  display: flex; align-items: center; justify-content: space-between;
  padding-bottom: 0.8em; margin-bottom: 0.4em; border-bottom: 1px solid var(--line-soft);
}
.fb-modal-x {
  font-size: 1.5em; line-height: 1; color: var(--muted-2);
  text-decoration: none; padding: 0 0.2em;
}
.fb-modal-x:hover { color: var(--ink); }
.fb-modal-foot { margin-top: 1em; padding-top: 0.9em; border-top: 1px solid var(--line-soft); }

/* Left-rail lock, LEFT of the number (Gene, 2026-08-09). Same baseline as the
   number so a row reads: 🔒 3  Label. */
.fb-lock { width:1.1em; flex:none; text-align:center; font-size:0.85em; padding-top:0.1em; }

/* Preview fields NUMBERED to match the builder rows — the number uses the
   exact fb-ord treatment (small, muted, right-aligned) and sits BESIDE the
   field without breaking its line. */
.fb-preview .pv-item { display:flex; gap:0.7em; align-items:flex-start; }
.fb-preview .pv-num { width:1.5em; flex:none; color:var(--muted-2); font-size:0.85em;
                      text-align:right; padding-top:0.15em; }
.fb-preview .pv-field { flex:1; min-width:0; }

/* ---- The public CFP's live lane (bd -td8) ---------------------------------
   Three server-pushed elements: the note under a field, the draft-status line,
   and the restored banner. All three are targets for an SSE fragment, so they
   exist in the DOM even when empty — an invisible landing pad, never a
   client-side createElement. Tokens only. */
.cfp-note {
  font-size: 0.85em; line-height: 1.35;
  margin: 0.2em 0 0; min-height: 0;
}
.cfp-note:empty { margin: 0; }
.cfp-note + .field-hint { margin-top: 0.05em; }
.cfp-note.warn { color: var(--danger); }
.cfp-note.ok   { color: var(--muted); }

.cfp-draft-status {
  display: flex; align-items: baseline; gap: 0.7em;
  font-size: 0.85em; color: var(--muted);
  margin: -0.4em 0 1.2em 0; min-height: 1.2em;
}
.cfp-draft-status .cfp-progress { font-variant-numeric: tabular-nums; }
.cfp-draft-status .cfp-saved { color: var(--go); }
.cfp-draft-status .cfp-autosave-hint { color: var(--muted); font-style: italic; }

.cfp-restored {
  background: var(--highlight); border-radius: var(--radius);
  padding: 0.7em 1em; margin-bottom: 1.2em;
  font-size: 0.92em; color: var(--ink-soft);
}

/* Interleaved question+preview GRID (Gene, 2026-08-09) — each question and its
   live preview share ONE grid row, top-aligned, so they line up vertically and
   cannot drift. A tall preview input just makes its row tall; the builder row
   sits at the row top beside it. */
.fb-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  column-gap: 1.5em; row-gap: 0.9em;
  align-items: start;              /* natural heights, tops paired by row */
}
.fb-grid .fb-col-head {
  grid-row: 1; align-self: end; margin: 0 0 0.1em !important;
  font-size: 0.82em !important; letter-spacing: 0.08em; text-transform: uppercase;
  color: var(--muted) !important; font-family: var(--font-ui) !important;
  font-weight: 700 !important;
}
.fb-grid .fb-span { grid-column: 1 / -1; }

/* Margin-notes treatment (Gene, 2026-08-09): only the PREVIEW is a card — it
   is the real artifact. The question on the left sits flat on the paper like
   an editor's annotation. Left top padding matches the card's inner padding
   so the two number discs sit on the same line. */
.fb-grid .fb-gr {
  background: var(--card); border: 1px solid var(--line-soft);
  border-radius: var(--radius-lg); padding: 1em 1.15em;
}
/* The question card: always-on soft white surface (Gene, 2026-08-09 —
   ratified from the hover treatment), shadow-only so it stays quieter than
   the bordered preview card it annotates. */
.fb-grid .fb-gl {
  position: relative; border-radius: var(--radius-lg);
  padding: 1em 2.2em 0.9em 0.85em; margin-left: -0.85em;
  background: var(--card);
  box-shadow: 0 1px 6px rgba(34, 30, 23, 0.06);
}
.fb-grid .fb-gl::after {
  content: "⟶"; position: absolute; right: 0.5em; top: 0.85em;
  color: var(--muted-2); font-size: 1.15em;
}
.fb-grid .fb-gl .fb-row { border-bottom: none; padding: 0; }

/* The number is a marker-yellow disc (the app's signature, echoing the wizard
   step numbers), same on both sides so the eye pairs left↔right instantly. */
.fb-grid .fb-lock { display: none; }               /* lock moves into the label */
.fb-grid .fb-ord, .fb-grid .pv-num {
  display: inline-flex; align-items: center; justify-content: center;
  width: 22px; height: 22px; flex: none; border-radius: 50%;
  background: var(--highlight); color: var(--ink);
  font-size: 0.78em; font-weight: 700; font-family: var(--font-ui);
  text-align: center; padding: 0; margin-top: 1px;
}
.fb-grid .fb-gr { display: flex; gap: 0.7em; align-items: flex-start; }
.fb-grid .pv-field { flex: 1; min-width: 0; }
.fb-grid .fb-row { display: flex; gap: 0.6em; align-items: baseline; }

/* Label + shape column inside the left card. */
.fb-grid .fb-body { flex: 1; min-width: 0; }
.fb-grid .fb-label { font-weight: 600; font-size: 1.02em; }
.fb-grid .fb-shape {
  /* Always its own line under the question label, left-justified with it
     (Gene, 2026-08-09). */
  display: block; width: fit-content; margin-top: 0.35em;
  background: var(--paper-deep); color: var(--muted);
  font-size: 0.74em; font-weight: 600; letter-spacing: 0.02em;
  padding: 0.15em 0.6em; border-radius: var(--pill);
}
.fb-grid .fb-acts { margin-top: 0.7em; gap: 0.3em; }

@media (max-width: 820px) {
  .fb-grid { grid-template-columns: 1fr; }
  .fb-grid .fb-col-head:nth-of-type(2) { display: none; }
}

/* The finish bar: the green button lives in the header stack (above "View
   public page") and again at the very bottom (Gene, 2026-08-09). */
.fb-header-acts {
  display: flex; flex-direction: column; align-items: flex-end; gap: 1em;
}
.fb-header-acts .fb-next { margin: 0; }
.fb-next.bottom { margin: 2em 0 0.5em; }

/* THE SAVE TOAST (Gene, 2026-08-09): every edit form confirms its save with
   the same server-rendered toast on the post-save reload. Pure CSS lifecycle
   (slide in, hold, fade) — no JS, nothing for a morph to fight. */
.toast {
  position: fixed; top: 18px; right: 18px; z-index: 1000;
  background: var(--ink); color: var(--paper);
  padding: 10px 16px; border-radius: 8px; font-weight: 600; font-size: 14px;
  box-shadow: 0 4px 14px rgba(0,0,0,.18); pointer-events: none;
  animation: toast-in .18s ease-out, toast-out .5s ease-in 2.6s both;
}
.toast::before { content: "✓ "; color: var(--highlight); }
@keyframes toast-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes toast-out { to { opacity: 0; visibility: hidden; } }

/* Events page: the j/k focus ring (box-shadow inset — outline gets clipped by
   overflow ancestors) and the archived shelf (same language as fb-retired). */
tr.ev-focused td { background: var(--highlight) !important;
                   box-shadow: inset 0 2px 0 var(--focus-line), inset 0 -2px 0 var(--focus-line); }
.ev-archived { margin-top: 0.8em; border-top: 1px dashed var(--line); padding-top: 0.5em; }
.ev-archived summary { cursor: pointer; color: var(--muted); font-size: 0.9em; user-select: none; }
.ev-archived summary:hover { color: var(--ink-soft); }
.ev-archived-row { display: flex; align-items: center; justify-content: space-between;
                   gap: 0.8em; padding: 0.45em 0.2em; border-bottom: 1px solid var(--line-soft); }
.ev-archived-row:last-child { border-bottom: none; }
.ev-archived-name { color: var(--muted); }
.ev-archived-row form { margin: 0; }
kbd { font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: 0.85em;
      background: var(--paper-deep); border: 1px solid var(--line); border-radius: 4px;
      padding: 0 0.35em; }

/* The face pool (bd 9ot): committee roster avatars as photos. */
.member-avatar-img { width:38px; height:38px; border-radius:50%; object-fit:cover;
                     flex:none; box-shadow:0 1px 3px rgba(60,45,20,.25); }

/* Board person-first rows (Gene, 2026-08-10): line 1 = face·name·role·org,
   line 2 = the talk at full width. */
.lg-person { display:flex; align-items:center; gap:12px; min-width:16em; }
.b-face { width:48px; height:48px; border-radius:50%; object-fit:cover; flex:none;
          box-shadow:0 1px 3px rgba(60,45,20,.25); }
.blind-avatar { display:inline-flex; align-items:center; justify-content:center;
                box-sizing:border-box; background:var(--line-soft); color:var(--muted);
                border:1px solid var(--line); box-shadow:none; font-weight:600; }
.blind-presenter-label { color:var(--muted); font-weight:400 !important; }
.lg-person-link.blind-person-link { align-items:flex-start; }
.blind-person-link .blind-presenter-label { line-height:1.4; }
/* Revealed-avatar mark (bd-cm3h, treatment #05 "dashed halo"): when a blind
   policy WOULD hide the presenter but THIS viewer is exempt (a chair, or
   reveal-after-vote and they've already voted), mark the avatar so the reveal
   reads as deliberate, not a leak. Never shown under a visible/open-table
   policy — there is nothing to reassure when identity is open to everyone. */
.revealed-mark { outline:2px dashed var(--focus-line); outline-offset:3px; }
.revealed-note { color:var(--focus-line); font-size:0.72em; font-weight:600;
                 letter-spacing:.02em; margin-top:2px; }
.blind-submission-header { padding-left:calc(0.5em + 60px) !important; text-align:left; }
.lg-pname { font-weight:600; color:var(--ink); }
.lg-prole { color:var(--muted); font-size:0.92em; }
.lg-porg { color:var(--muted); font-size:0.85em; margin-top:1px; }
.ledger-title-row td { border-top:none !important; padding-top:0 !important; }
.ledger-row td { border-bottom:none !important; padding-bottom:4px !important; }
.lg-th-person .dot { color:var(--muted-2); }

/* Numeric board headers center over their numbers (Gene, 2026-08-10); the
   person cell stacks name / role / org flush left. */
.ledger-table th.th-org-size, .ledger-table th.th-voted,
.ledger-table th.th-avg, .ledger-table th.th-score { text-align:center; }
.lg-pmeta { color:var(--muted); font-size:0.88em; line-height:1.25; }
.lg-pwho { line-height:1.3; }
.ledger-title-row td { padding-left:10px !important; }

/* Format bubble on row 1; title row indents to the name's left edge (the
   red-line note, 2026-08-10). */
.fmt-chip { display:inline-block; background:var(--paper-deep); border:1px solid var(--line);
            border-radius:999px; padding:2px 10px; font-size:0.78em; color:var(--ink-soft);
            white-space:nowrap; }
.lg-title-cell { padding-left:calc(48px + 12px + 0.7em) !important; }
/* The winner: an inner wrapper has no competing td padding rules across
   layers — the title hangs on the NAME's left rail, never the photo's
   (Gene, 2026-08-10). */
.lg-title-indent { padding-left: calc(48px + 12px); }
/* THE TWO VERBS (Gene, 2026-08-10): every row offers both acts, always
   visible — gold acts HERE (opens the inline card), quiet one navigates. */
.lg-acts { white-space:nowrap; text-align:right; }
.lg-acts a { display:block; text-decoration:none; font-size:0.78em; font-weight:700;
             line-height:1.6; }
.lg-acts .act-read { color: var(--focus-line); }
.lg-acts .act-read:hover { text-decoration:underline; }
.lg-acts .act-status-line {
  display:flex; align-items:center; justify-content:flex-end; gap:0.45em;
  margin-top:0.15em;
}
.lg-acts .act-rate { color: var(--muted); font-weight:400; }
.lg-acts .act-rate:hover { color: var(--ink); }
tbody.ledger + tbody.ledger > .ledger-row > td { padding-top:0.9em; }
/* The inline card the gold verb opens — marker-edged, the row exhales. */
/* On :target the WHOLE tbody becomes one white envelope — the card visibly
   belongs to its submission (Gene, 2026-08-10). */
tbody.ledger:target > tr > td { background: var(--card); }
tbody.ledger:target { outline: 1px solid var(--line); }
.ledger-controls .rate-card {
  background: var(--paper); border:none;
  border-left:3px solid var(--highlight);
  border-radius: var(--radius);
  padding:0.6em 0.9em 0.7em; margin:0.15em 0 0.7em calc(48px + 12px);
}
.ledger-controls .review-recusal { margin-left:calc(48px + 12px); }
.rate-card-head { display:flex; align-items:center; justify-content:space-between;
                  margin-bottom:0.35em; }
.rate-card-title { font-size:0.68em; letter-spacing:0.09em; text-transform:uppercase;
                   color:var(--focus-line); font-weight:800; }
.rate-card-saved { margin-left:0.8em; color:var(--go); letter-spacing:0.05em; }
.card-close-group { display:inline-flex; align-items:center; gap:0.5em; }
.esc-hint { font-family:ui-monospace,monospace; font-size:0.62em; color:var(--muted-2);
            border:1px solid var(--field-line); border-radius:4px; padding:0 0.4em;
            background:var(--card); }
.ledger-controls .rate-card .row-controls { border-top:none; margin:0; padding:0; }
.ledger-controls .card-close { color:var(--muted-2); text-decoration:none;
                               font-size:1.05em; }
.ledger-controls .card-close:hover { color:var(--ink); }
.lg-title-cell .lg-title-indent { padding-left: 0; margin-left: calc(48px + 12px); }
.ledger-title-row td.lg-spacer { padding-left:10px !important; }

/* SUBMISSION DETAIL, Treatment B "Basecamp" (Gene ratified 2026-08-10):
   proposal at reading measure + speaker rail; the committee is a full-width
   THREAD at the page's foot — the geometry is the anti-anchoring. */
.sd-layout { display:flex; gap:2.2rem; align-items:flex-start; }
.sd-main { flex:3; min-width:0; }
.sd-rail { flex:1; min-width:230px; max-width:300px;
           /* The card FLOATS: reading a long proposal never scrolls the
              speaker out of view (Gene, 2026-08-10 — the paper cut he has
              felt across thousands of Sessionize reviews). Pure CSS. */
           position: sticky; top: 1rem; align-self: flex-start; }
.sd-prose { max-width:46em; }
.sd-prose dd { margin-bottom:1em; }
.sd-photo { width:84px; height:84px; border-radius:50%; object-fit:cover;
            border:1px solid var(--line); margin-bottom:0.5em; }
.sp-name { font-weight:700; font-size:1.05em; }
.sp-meta { color:var(--muted); font-size:0.88em; margin-bottom:0.6em; }
.sp-links { display:flex; flex-direction:column; gap:2px; font-size:0.85em;
            margin-bottom:0.7em; }
.sp-bio { font-size:0.88em; color:var(--ink-soft); white-space:pre-wrap; }

.sd-thread { border-top:1px solid var(--line); margin-top:2rem; padding-top:1.2rem; }
.verdict-line { display:flex; gap:0.9em; align-items:baseline; font-size:0.9em;
                color:var(--muted); margin-bottom:0.9em; }
.verdict-line .avg { font-family:var(--font-display);
                     font-variation-settings:var(--display-axes);
                     font-size:1.5em; color:var(--ink); font-weight:600; }
.verdict-line .sep { color:#ccc; }
.bubble { display:flex; gap:0.6em; margin-bottom:0.7em; max-width:52em; }
.sd-avatar { width:28px; height:28px; border-radius:50%; background:var(--highlight);
             color:var(--ink); font-size:11px; font-weight:800; flex:none;
             display:inline-flex; align-items:center; justify-content:center;
             font-family:var(--font-ui); }
.balloon { background:var(--card); border:1px solid var(--line-soft);
           border-radius:2px 12px 12px 12px; padding:0.5em 0.85em; font-size:0.92em;
           box-shadow:0 1px 4px rgba(34,30,23,.05); }
.balloon .who { font-weight:700; font-size:0.82em; margin-right:0.5em; }
.balloon .when { color:var(--muted-2); font-size:0.75em; }
.balloon .stars-inline { color:var(--focus-line); font-weight:700; }
.balloon-body { margin-top:0.15em; }

.sd-thread .rate-strip { display:flex; align-items:center; gap:0.7em; flex-wrap:wrap;
                         background:var(--paper-deep); border-left:3px solid var(--highlight);
                         border-radius:var(--radius); padding:0.6em 0.9em; margin-top:1rem; }
.sd-thread .rate-strip .lbl { text-transform:uppercase; font-size:0.68em;
                              letter-spacing:0.09em; color:var(--focus-line);
                              font-weight:800; }
.sd-thread .rate-strip .row-controls { border-top:none; margin:0; padding:0; }

/* Mentions — a shoulder-tap between committee people (2026-08-11). "Ask a
   colleague to look" on the detail page; "You were asked to look at these"
   shelf on the recipient's board. Soft by design: quiet, ignorable. */
.mention-control { margin-top:0.8em; }
.mention-control form { display:flex; align-items:center; gap:0.5em; flex-wrap:wrap; }
.mention-control select { padding:0.3em 0.5em; font-size:0.85em; }
.mention-note { width:18em; padding:0.3em 0.5em; font-size:0.85em; }
.mentions-shelf { background:var(--paper-deep); border-left:3px solid var(--highlight);
                  border-radius:var(--radius); padding:0.7em 1em; margin-bottom:1rem; }
.mention-list { list-style:none; margin:0.3em 0 0; padding:0; }
.mention-item { padding:0.25em 0; font-size:0.92em; }
.mention-item .mention-from { color:var(--focus-line); }
.mention-item .mention-why { color:var(--focus-line); font-style:italic; }

/* Board opinions, T2 (Gene ratified 2026-08-10): star histogram + quote
   lines carrying each comment's stars; silent raters named beneath. */
.opinions-t2 { display:flex; gap:1.1em; align-items:flex-start; font-size:0.87em; }
.histo { display:inline-flex; align-items:flex-end; gap:3px;
         flex:none; cursor:help; min-height:14px; }
/* T1 (Gene, 2026-08-10): each bucket is a column — bar over its numeral.
   The 1–5 axis is what turns "some dots" into a distribution. */
.hcol { display:inline-flex; flex-direction:column; align-items:center;
        justify-content:flex-end; gap:1px; }
.hbar { display:inline-block; width:9px; background:var(--focus-line);
        border-radius:1px 1px 0 0; }
.hbar.empty { background:var(--line-soft); }
/* Bar heights, formerly an inline style on every bar. Seven fixed values —
   2px when empty, otherwise 3 + 4×min(n,6) — so they belong in the stylesheet
   and not repeated five times per rated row across a 500-row board. Geometry
   is byte-for-byte what the inline rule produced. */
.hbar.h0 { height:2px; }
.hbar.h1 { height:7px; }
.hbar.h2 { height:11px; }
.hbar.h3 { height:15px; }
.hbar.h4 { height:19px; }
.hbar.h5 { height:23px; }
.hbar.h6 { height:27px; }
.hnum { font-size:0.62em; line-height:1; color:var(--muted-2);
        font-variant-numeric:tabular-nums; }
.quote-lines { min-width:0; }
.quote-line { margin:0.05em 0; color:var(--ink-soft); }
.quote-line .qbar { color:var(--focus-line); font-weight:800; margin-right:0.35em; }
.quote-line .who { font-weight:700; }
/* T5: the fixed-width star column left of each commenter's name. */
.quote-line .op-slot { display:inline-block; min-width:2.9em;
                       color:var(--focus-line); font-weight:600; }
.quote-line.silent { color:var(--muted); font-size:0.92em; }
.quote-line.silent .who { font-weight:600; color:var(--muted); }

/* The person block links to the detail page — same colors as at rest, the
   name underlines on hover to say so (Gene, 2026-08-10). */
.lg-person-link { display:flex; align-items:center; gap:12px; color:inherit;
                  text-decoration:none; }
.lg-person-link:hover { color:inherit; }
.lg-person-link:hover .lg-pname { text-decoration:underline;
                                  color:var(--link); }

/* Mission-control dashboard (Gene ratified 2026-08-10): stat tiles + the
   what-needs-you queue + the recent feed. Tokens only; paper cards. */
.dash-tiles { display:grid; grid-template-columns:repeat(4, 1fr); gap:1em;
              margin:1.2em 0; }
@media (max-width: 720px) { .dash-tiles { grid-template-columns:repeat(2, 1fr); } }
.dash-tile { background:var(--card); border:1px solid var(--line);
             border-radius:var(--radius-lg); padding:1em 1.1em;
             display:flex; flex-direction:column; gap:0.15em; }
.dash-tile .dash-n { font-size:2.1em; font-weight:800; color:var(--ink);
                     line-height:1.1; font-variant-numeric:tabular-nums; }
.dash-tile .dash-l { font-weight:700; color:var(--ink-soft); }
.dash-tile .dash-h { font-size:0.85em; color:var(--muted); }
.dash-tile .dash-spark { margin-top:0.35em; }
.dash-tile .dash-spark img { max-width:100%; height:auto; display:block; }
.dash-card { background:var(--card); border:1px solid var(--line);
             border-radius:var(--radius-lg); padding:1.1em 1.3em;
             margin:1.1em 0; }
.dash-need { display:flex; align-items:baseline; gap:0.6em; padding:0.45em 0;
             border-bottom:1px solid var(--line-soft); color:var(--ink-soft);
             text-decoration:none; }
.dash-need:last-child { border-bottom:none; }
a.dash-need:hover { color:var(--link); }
.dash-need .dash-go { margin-left:auto; color:var(--link); font-weight:600;
                      white-space:nowrap; }
/* Basecamp shape (Gene, 2026-08-10): the act on its own line, the talk it
   landed on beneath, slightly indented. Entries separated by a soft rule. */
.dash-recent-entry { padding:0.5em 0; border-bottom:1px solid var(--line-soft); }
.dash-recent-entry:last-of-type { border-bottom:none; }
.dash-recent-act { display:flex; gap:0.6em; align-items:baseline;
                   color:var(--ink); font-weight:600; }
.dash-recent-act .dash-recent-when { margin-left:auto; color:var(--muted);
                                     font-size:0.85em; font-weight:400; }
.dash-recent-on { margin:0.25em 0 0 1.4em; }
.dash-call-line { display:flex; align-items:center; gap:0.9em;
                  margin:1.4em 0 0.4em; color:var(--muted); font-size:0.92em; }
.dash-call-line form { margin:0; }
.dash-feed-talk { display:inline-flex; align-items:center; gap:0.45em;
                  min-width:0; }
.dash-feed-face { width:22px; height:22px; border-radius:50%;
                  object-fit:cover; flex:none; }
.dash-feed-title { color:var(--link); }
.dash-feed-who { color:var(--muted); font-size:0.85em; white-space:nowrap; }
/* Inside a stat tile the sparkline is just the picture — the counts are
   the tile itself; keep grid honest at any tile count. */
.dash-spark .spark-label, .dash-spark .spark-axis { display:none; }
.dash-tiles { grid-template-columns:repeat(auto-fit, minmax(160px, 1fr)); }

/* THE LANDING (bd -7e1, Gene ratified skeleton 2026-08-10): Zen Paper hero
   + hate/proud mirror + organizer/speaker duo + the Ledger tape as the trust
   section. Public, signed-out only — signed-in / redirects to /events. */
.landing { max-width:900px; margin:0 auto; font-size:16px; }
.landing-top { display:flex; justify-content:space-between; align-items:baseline;
               margin-bottom:3.2em; }
.landing-brand { font-family:var(--display, Fraunces, serif); font-weight:900;
                 font-size:1.3em; color:var(--ink); }
.landing-utilities { display:flex; align-items:baseline; gap:1.4em; }
.landing-demo-link { color:var(--muted); font-size:0.9em; font-weight:600; }
.landing-demo-link:hover { color:var(--link); }
.landing-signin { font-weight:600; color:var(--go); }
.landing .kicker { font-weight:600; font-size:0.8em; letter-spacing:0.24em;
                   text-transform:uppercase; color:var(--muted); margin-bottom:1.6em; }
.landing h1 { font-family:var(--display, Fraunces, serif); font-weight:300;
              font-size:clamp(2.2em, 5vw, 3.6em); line-height:1.1;
              letter-spacing:-0.01em; color:var(--ink); }
.landing h1 b { font-weight:900;
  background-image:linear-gradient(180deg, transparent 58%, var(--highlight) 58%,
                                   var(--highlight) 94%, transparent 94%); }
.landing .confess { margin:1.8em 0 2.4em; font-size:1.12em; color:var(--muted);
                    line-height:1.65; max-width:38em; }
.landing .mirror { display:grid; grid-template-columns:1fr 1fr; gap:1.8em;
                   margin:0 0 2.8em; }
.landing .mirror h3 { font-size:0.78em; letter-spacing:0.18em; text-transform:uppercase;
                      margin-bottom:0.9em; }
.landing .hate h3 { color:var(--danger); }
.landing .proud h3 { color:var(--go); }
.landing .mirror ul { list-style:none; margin:0; padding:0; }
.landing .mirror li { padding:0.55em 0 0.55em 1.9em; position:relative;
                      line-height:1.5; color:var(--ink-soft);
                      border-bottom:1px solid var(--line-soft); }
.landing .mirror li:last-child { border-bottom:none; }
.landing .hate li::before { content:"✗"; position:absolute; left:0.1em;
                            color:var(--danger); font-weight:700; }
.landing .proud li::before { content:"✓"; position:absolute; left:0.1em;
                             color:var(--go); font-weight:700; }
.landing .hate .ex { color:var(--muted); font-size:0.9em; font-style:italic; }
.landing .duo { display:grid; grid-template-columns:1fr 1fr; gap:1.4em;
                margin-bottom:2.8em; }
.landing .duo .card { background:var(--card); border:1px solid var(--line);
                      border-radius:8px; padding:1.6em; }
.landing .aud { font-size:0.72em; font-weight:600; letter-spacing:0.18em;
                text-transform:uppercase; color:var(--muted); margin-bottom:0.7em; }
.landing .duo h2 { font-family:var(--display, Fraunces, serif); font-weight:600;
                   font-size:1.35em; margin:0 0 0.4em; }
.landing .duo p { color:var(--muted); line-height:1.55; font-size:0.95em;
                  margin-bottom:0.9em; }
.landing .duo a { font-weight:600; color:var(--go); }
.landing .duo .spk a { color:var(--focus-line); }
.landing .cta { display:inline-block; background:var(--go); color:#fff;
                font-weight:600; font-size:1.05em; padding:0.9em 2em;
                border-radius:10px; }
.landing .cta:hover { background:#166540; color:#fff; }
.landing .quiet { margin-left:0.9em; font-size:0.85em; color:var(--muted-2); }
.landing-ledger { display:grid; grid-template-columns:1fr 1.1fr; gap:3em;
                  align-items:center; margin-top:4.5em; padding-top:3em;
                  border-top:1px solid var(--line); }
.landing-ledger h2 { font-family:var(--display, Fraunces, serif); font-weight:900;
                     font-size:1.9em; line-height:1.1; letter-spacing:-0.02em; }
.landing-ledger h2 span { color:var(--danger); }
.landing-ledger .sub { margin:1.2em 0 0; color:var(--muted); line-height:1.6; }
.landing .tape { background:var(--card); border:1px solid var(--line);
                 border-radius:8px; box-shadow:0 16px 44px rgba(60,45,20,0.14);
                 padding:1.5em 1.6em 1em; transform:rotate(0.5deg);
                 font-family:ui-monospace, "SF Mono", Menlo, monospace;
                 font-size:0.78em; line-height:2.05; color:var(--ink-soft);
                 white-space:pre; overflow-x:auto; }
.landing .tape .h { font-weight:600; color:var(--ink);
                    border-bottom:2px solid var(--ink); margin-bottom:0.5em;
                    letter-spacing:0.04em; }
.landing .tape .dead { color:var(--danger); }
.landing .tape .love { background:#FFF7E0; }
.landing .tape .hot { background:var(--highlight); font-weight:600; }
.landing .tape .foot { border-top:1px dashed var(--line); margin-top:0.5em;
                       padding-top:0.4em; color:var(--muted-2); font-size:0.9em;
                       white-space:normal; }
@media (max-width: 760px) {
  .landing-top { align-items:flex-start; gap:1em; }
  .landing-utilities { align-items:flex-end; flex-direction:column; gap:0.45em;
                       text-align:right; }
  .landing .mirror, .landing .duo, .landing-ledger { grid-template-columns:1fr; }
  .landing .tape { transform:none; padding:1.25em 1em 0.9em;
                   white-space:normal; overflow-x:visible; line-height:1.55; }
  .landing .tape > div { overflow-wrap:anywhere; margin-bottom:0.45em; }
}

/* Public program widgets — shared logged-out session and speaker surfaces. */
.public-widget-page { max-width: 960px !important; margin-top: 2em !important;
                      margin-bottom: 4em !important; }
.public-widget-nav { display:flex; flex-wrap:wrap; gap:0.35em; margin:1em 0 1.5em;
                     border-bottom:1px solid var(--line); }
.public-widget-nav a { padding:0.65em 0.9em; color:var(--muted); font-weight:600;
                       border-bottom:3px solid transparent; }
.public-widget-nav a.active { color:var(--ink); border-bottom-color:var(--focus-line); }
.public-program-nav .program-nav-speakers {
  color:var(--ink); border-bottom-color:var(--focus-line);
}
.public-widget-page:has(#agenda:target) .program-nav-speakers {
  color:var(--muted); border-bottom-color:transparent;
}
.public-widget-page:has(#agenda:target) .program-nav-agenda,
.public-widget-page:has(#speakers:target) .program-nav-speakers {
  color:var(--ink); border-bottom-color:var(--focus-line);
}
.public-program-section { scroll-margin-top:1.5em; }
.public-program-section + .public-program-section { margin-top:3.5em; }
.public-program-heading {
  margin:0 0 0.65em !important; font-family:var(--font-display) !important;
  font-variation-settings:var(--display-axes); font-size:clamp(25px, 3vw, 34px) !important;
  font-weight:600 !important; line-height:1.16; letter-spacing:-.012em;
}
.agenda-day-section { margin-top:1.8em; }
.agenda-day-section > h3.ui.header { margin-bottom:0.75em !important; }
.public-program-resources { margin-top:2.5em; color:var(--muted); }
.accepted-sessions-embed { margin-top:3.5em; padding-top:2em; border-top:1px solid var(--line); }
.accepted-sessions-embed > p { color:var(--ink-soft); }
.accepted-sessions-code {
  display:block; width:100%; min-height:4.5em; box-sizing:border-box;
  padding:0.9em 1em; border:1px solid var(--line); border-radius:var(--radius);
  background:var(--paper-deep); color:var(--ink); resize:vertical;
  font-family:ui-monospace, "SF Mono", Menlo, monospace; font-size:0.9em; line-height:1.45;
}
.accepted-sessions-actions {
  display:flex; flex-wrap:wrap; align-items:center; gap:0.9em; margin-top:0.8em;
}
.accepted-sessions-actions a { font-weight:600; }
.public-filter-bar { display:flex; gap:0.6em; margin:1em 0; }
.public-filter-bar input[type="search"] { flex:1; min-width:12em; padding:0.7em 0.85em;
                                           border:1px solid var(--line); border-radius:7px; }
.public-filter-bar input[type="search"]:focus { outline:3px solid color-mix(in srgb, var(--focus-line) 24%, transparent);
                                                border-color:var(--focus-line); }
.public-facets { display:flex; flex-wrap:wrap; align-items:center; gap:0.45em;
                 margin:0.8em 0 1.2em; }
.public-facet, .public-chip { display:inline-block; border:1px solid var(--line);
                              border-radius:999px; padding:0.25em 0.65em;
                              color:var(--ink-soft); background:var(--card); font-size:0.86em; }
.public-facet.active { color:#fff; background:var(--focus-line); border-color:var(--focus-line); }
.public-result-count { margin:1.2em 0 1.4em; font-size:11px; font-weight:600;
                        letter-spacing:0.14em; text-transform:uppercase;
                        color:var(--muted); } /* keep in lockstep with .cfp-section-title */
.public-session-list { display:grid; gap:1em; }
.public-session-card, .public-session-detail, .public-speaker-detail,
.public-speaker-session { background:var(--card); border:1px solid var(--line);
                          border-radius:10px; padding:1.25em 1.4em; }
.public-session-card h3, .public-speaker-card h3 { margin:0 0 0.5em; }
.public-copy-preview { color:var(--ink-soft); line-height:1.55; display:-webkit-box;
                       -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; }
.public-show-more { margin:0.35em 0 0.8em; color:var(--ink-soft); }
.public-show-more summary { cursor:pointer; color:var(--focus-line); font-weight:600; }
.public-show-more:not([open]) .public-disclosure-less { display:none; }
.public-show-more[open] .public-disclosure-more { display:none; }
.public-show-more[open] .public-disclosure-less { display:inline; }
.public-session-meta { display:flex; flex-wrap:wrap; gap:1em; margin:0.8em 0;
                       color:var(--ink-soft); font-weight:600; }
.public-speakers-block { margin-top:0.8em; }
.public-session-speaker { display:flex; flex-wrap:wrap; gap:0.55em; align-items:baseline;
                           margin-top:0.25em; color:var(--muted); }
.public-session-speaker a { font-weight:700; }
.public-chips { display:flex; flex-wrap:wrap; gap:0.4em; margin-top:0.8em; }
/* The speakers grid mirrors the production CFP featured strip (Gene, 2026-08-11
   screenshot ruling): OPEN editorial grid — no card boxes, 5-ish across,
   112px circles, tight vertical rhythm. */
.public-speaker-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(150px,1fr));
                       gap:1.6em 1em; }
.public-speaker-card { background:transparent; border:0; padding:0.25em;
                       text-align:center; display:flex; flex-direction:column; }
.public-headshot { width:112px; height:112px; border-radius:50%; object-fit:cover;
                   background:var(--line-soft); margin:0 auto 0.8em; display:flex;
                   align-items:center; justify-content:center;
                   border:1px solid var(--line);
                   /* always grayscale for now (Gene, 2026-08-11) — matches the
                      CFP featured strip; one look everywhere. */
                   filter:grayscale(1); }
.public-headshot-fallback { flex-direction:column; color:var(--muted); }
.public-headshot-fallback span { font-size:2.2em; font-weight:700; }
.public-headshot-fallback small { font-size:0.65em; }
/* Card typography mirrors the CFP featured strip: display-font name,
   soft-ink org, muted title. */
.public-speaker-card h3 { font-family:var(--font-display); font-weight:700; }
.public-speaker-card h3 a { color:inherit; }
.public-speaker-title { font-weight:400; font-size:0.85em; color:var(--muted);
                        margin:0.25em 0; line-height:1.35; }
.public-speaker-company { font-weight:600; font-size:0.9em; color:var(--ink-soft);
                          margin:0.2em 0; }
/* The directory deliberately inherits the same featured-card grid used by the
   CFP and program pages. Keep this class as a page marker only; page-specific
   card geometry caused EMB-04 clipping and defeated the shared renderer. */
/* "Previously at IT Revolution" — the video-library moat hook. */
.cfp-masthead .cfp-limit { display:flex; gap:1.5em; flex-wrap:wrap; }
.masthead-cfp-link { font-weight:600; }

/* The archive stamp (Gene, 2026-08-11, T2-in-pill): a tinted paper stub —
   sentence-case italic aside, no border, never wraps. "We know our history"
   said quietly. */
/* The organizer chip: label + tiny round grayscale portrait + name. */
.cfp-organizer { display:flex; align-items:center; gap:0.6em; margin-top:0.9em; }
.cfp-organizer-label { font-size:11px; font-weight:600; letter-spacing:0.1em;
                       text-transform:uppercase; color:var(--muted); }
.cfp-organizer-chip { display:inline-flex; align-items:center; gap:0.5em;
                      padding:0.2em 0.85em 0.2em 0.25em; border-radius:999px;
                      background:var(--line-soft); text-decoration:none;
                      color:var(--ink); font-weight:600; }
.cfp-organizer-chip:hover { background:var(--line); }
.cfp-organizer-photo { width:28px; height:28px; border-radius:50%;
                       object-fit:cover; filter:grayscale(1); }
.cfp-organizer-attr { font-size:0.92em; color:var(--muted); }
.cfp-cap-note { font-size:12.5px; color:var(--muted); margin:0 0 0.6em; }

/* T5v2 (Gene): the tenure line is part of the text stack — title typography,
   italic, no pill, no chrome. Subtlety IS the design. */
.public-itrev-history { display:block; margin-top:1px;
                        font-size:12px; font-style:italic; font-weight:400;
                        color:var(--muted); text-decoration:none;
                        line-height:1.35; white-space:nowrap; }
.public-itrev-history:hover { color:var(--ink-soft); text-decoration:underline; }
.public-itrev-history-block { margin-top:1.25em; }
.pit-years { display:flex; flex-wrap:wrap; gap:0.35em; margin:0.6em 0 0; }
.pit-year { padding:0.1em 0.6em; border-radius:999px; background:var(--line-soft);
            font-size:11px; font-weight:600; letter-spacing:0.04em;
            color:var(--ink-soft); }
.public-itrev-talks { margin:0.5em 0 0; padding-left:1.2em; color:var(--muted); }
.public-itrev-talks li { margin:0.15em 0; }
.public-back-link { display:inline-block; margin:0 0 1em; font-weight:600; }
.public-speaker-detail { display:grid; grid-template-columns:170px 1fr; gap:1.5em;
                         align-items:start; }
.public-speaker-sessions { margin-top:2em; }
.public-speaker-session { margin-bottom:0.75em; }
.public-detail-tabs { display:flex; gap:1em; border-bottom:1px solid var(--line);
                      margin:0.8em 0 1em; color:var(--muted); }
.public-detail-tabs span { padding:0.5em 0; }
.public-detail-tabs .active { color:var(--ink); border-bottom:3px solid var(--focus-line); }
@media (max-width: 600px) {
  .public-filter-bar, .public-speaker-detail { display:block; }
  .public-filter-bar .button { margin-top:0.5em; }
}

/* ── Per-speaker announce page: a personal, shareable "I'm speaking!" ───── */
.announce-page { text-align:center; }
.announce-hero { max-width:52ch; margin:0 auto 3em; }
.announce-hero-photo { width:200px; height:200px; border-radius:50%; object-fit:cover;
                       background:var(--line-soft); margin:0 auto 1.2em; display:flex;
                       align-items:center; justify-content:center; }
.announce-hero-fallback { flex-direction:column; color:var(--muted);
                          font-size:3.2em; font-weight:700; }
.announce-kicker { text-transform:uppercase; letter-spacing:0.14em; font-size:0.8em;
                   font-weight:700; color:var(--focus-line); margin-bottom:0.4em; }
.announce-hero-name { font-family:var(--font-display, inherit); font-size:2.4em;
                      line-height:1.12; text-wrap:balance; margin:0.1em 0 0.3em; }
.announce-hero-tagline { font-weight:600; font-size:1.1em; margin:0.15em 0; }
.announce-hero-company { color:var(--muted); margin:0.1em 0 0.6em; }
.announce-hero-talk { font-style:italic; color:var(--ink-soft); line-height:1.5;
                      margin:0.4em auto 1em; max-width:44ch; }
.announce-hero-copy { font-size:1.14em; line-height:1.6; color:var(--ink-soft);
                      max-width:46ch; margin:0 auto 1.4em; }
.announce-hero-cta { margin-top:0.4em; }
.announce-share { margin-top:1.4em; font-size:13.5px; color:var(--muted); }
.announce-share a, .announce-share-copy { color:inherit; text-decoration:underline; }
.announce-share-copy { background:none; border:none; padding:0; font:inherit; cursor:pointer; }
.announce-share .dot { color:var(--ghost-ink); padding:0 6px; }
.announce-share-label { margin-right:6px; }
.announce-peers { margin-top:3em; padding-top:2.4em; border-top:1px solid var(--line); }
.announce-peers-head { font-size:1.4em; margin:0 0 1.4em; color:var(--ink-soft); }
.announce-peers-empty { color:var(--muted); }
/* Pipeline stage strip (4d3): decide → tell → announce, current stage hot. */
.board-stage-row { display:flex; align-items:center; gap:1.25rem; flex-wrap:wrap;
                   margin:0 0 1.6em; }
.board-stage-row .board-controls, .board-stage-row .pipeline-strip { margin:0; }
.pipeline-strip { display:flex; align-items:center; gap:10px; margin:0 0 1.6em; font-size:13.5px; }
.pipeline-strip .ps-stage { display:flex; flex-direction:column; padding:6px 14px;
                            border:1px solid var(--line); border-radius:8px;
                            color:var(--muted); background:none; }
.pipeline-strip .ps-stage.ps-active { border-color:var(--ink); color:var(--ink); background:var(--card); }
.pipeline-strip .ps-label { font-weight:600; }
.pipeline-strip .ps-detail { font-size:12px; }
.pipeline-strip .ps-arrow { color:var(--ghost-ink); }
/* Pipeline cascade (4d3): vertical stages, each with owner + teaching line. */
.pipeline-cascade { max-width:72ch; }
.pipeline-cascade .pc-stage { border:1px solid var(--line); border-radius:10px;
                              padding:1em 1.2em; background:var(--card); }
.pipeline-cascade .pc-head { display:flex; align-items:baseline; gap:10px; }
.pipeline-cascade .pc-n { color:var(--muted); }
.pipeline-cascade .pc-name { margin:0; font-size:1.05em; }
.pipeline-cascade .pc-ball { margin-left:auto; font-size:12px; color:var(--muted);
                             border:1px solid var(--line); border-radius:99px; padding:2px 10px; }
.pipeline-cascade .pc-jump { font-size:13px; }
.pipeline-cascade .pc-desc { color:var(--ink-soft); font-size:13.5px; margin:0.4em 0 0.6em;
                             line-height:1.5; }
.pipeline-cascade .pc-meter { font-weight:600; font-size:13.5px; }
.pipeline-cascade .pc-rows { margin-top:0.5em; }
.pipeline-cascade .pc-row { display:flex; align-items:center; gap:8px; font-size:13px;
                            padding:3px 0; }
.pipeline-cascade .pc-glyph { color:var(--muted); }
.pipeline-cascade .pc-rowname { min-width:14em; }
.pipeline-cascade .pc-detail { color:var(--muted); }
.pipeline-cascade .pc-row .pc-copy { margin-left:auto; }
.pipeline-cascade .pc-copy { background:none; border:none; padding:0; font:inherit;
                             color:inherit; text-decoration:underline; cursor:pointer;
                             font-size:12.5px; color:var(--muted); }
.pipeline-cascade .pc-rowco { color:var(--muted); font-size:12px; }
.pipeline-cascade .pc-more { color:var(--ghost-ink); cursor:pointer; font-size:12.5px; padding:3px 0; }
.pipeline-cascade .pc-more-details summary::-webkit-details-marker { display:none; }
/* 4tv: expanding is one-way — the summary vanishes so the list reads whole. */
.pipeline-cascade .pc-more-details[open] > summary { display:none; }
/* 4tv: fixed name column so 'bio missing' aligns on long name·company rows. */
.pipeline-cascade .pc-rowname { flex:0 0 20em; min-width:0; }
.pipeline-cascade .pc-flow { color:var(--ghost-ink); font-size:12.5px; margin:0.7em 0; }
.pipeline-cascade .pc-future { color:var(--muted); font-size:12.5px; margin-top:1em; }
.announce-program { margin-top:3em; padding-top:2.4em; border-top:1px solid var(--line); }
.announce-program .announce-hero-cta { margin-top:1.6em; }
.announce-foot-link { display:inline-block; margin-top:2em; font-weight:600;
                      color:var(--muted); }

/* The event, folded into the announce page beneath the hero: photo, name,
   organizer copy, organizer chip (Gene, 2026-08-11). */
.announce-event { margin-top:3em; padding-top:2.4em; border-top:1px solid var(--line); }
.announce-event-photo { width:100%; max-height:340px; object-fit:cover;
                        border-radius:var(--radius-lg); margin-bottom:1.2em; }
.announce-event-name { font-family:var(--font-display); font-size:1.3em; margin:0 0 0.8em; }
.announce-event .cfp-intro { max-width:70ch; margin:0 auto 1.2em; text-align:left; }
/* Typography unification (Gene, 2026-08-11 redesign): the base .cfp-intro
   rules above give paragraph 1 an oversized serif lede sized for the CFP
   page's own hero role — wrong register here, where the intro is a
   supporting beat under the speaker's own hero. Text is untouched; only the
   visual weight changes ("use text, just style it differently"). One
   uniform body scale, a slightly elevated lede, a demoted footnote. */
.announce-event .cfp-intro p,
.announce-event .cfp-intro p:first-child,
.announce-event .cfp-intro p:nth-child(n+2) {
  font-family:var(--font-ui); font-size:16px; line-height:1.65;
  color:var(--ink-soft); letter-spacing:normal; font-weight:400;
}
.announce-event .cfp-intro p:first-child { font-size:1.12em; color:var(--ink); }
.announce-event .cfp-intro p:last-child { font-size:13px; color:var(--muted); }
.announce-organizer { margin-top:1.2em; }
.announce-organizer .rk { display:block; font-size:10.5px; font-weight:700;
                          letter-spacing:0.1em; text-transform:uppercase;
                          color:var(--muted); margin-bottom:0.4em; }
.announce-organizer .cfp-organizer-chip { margin:0 auto; }
.announce-organizer .cfp-rail-attr { text-align:center; }
.announce-cfp-line { margin-top:1.6em; color:var(--muted); }

/* The agenda's closing pitch band — replaces the old bare CTA button. */
.announce-pitch { margin-top:2em; }
.announce-pitch-line { font-family:var(--font-display); font-size:1.15em; margin-bottom:0.9em; }

/* The quiet structural footer, shared shape with the landing footer. */
.public-foot { margin-top:3.5em; padding:2em 0 1.5em; border-top:1px solid var(--line);
              text-align:center; }
.public-foot .pf-links { font-size:13.5px; color:var(--muted); }
.public-foot .pf-links .dot { color:var(--ghost-ink); padding:0 8px; }
.public-foot .pf-credit { margin-top:0.8em; color:var(--muted); font-size:13px; }

/* ── Newcomer welcome hero (Option C "live proof", 2026-08-10) ─────────── */
@layer components {
  /* W2 (Gene, 2026-08-11): single calm column — doors, then the playbill
     ticker of real live events, then the promises. */
  /* De-boxed (Gene, 2026-08-11): the welcome sits naked on the page —
     the door cards carry the edges, no outer frame. */
  .welcome-hero { max-width: 640px; padding: 0.4em 0 1em; }
  .wh-live-k {
    text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.78em;
    color: var(--kicker); font-weight: 700; margin: 1.4em 0 0.3em;
  }
  .wh-ticker { margin-bottom: 0.4em; }
  .wh-trow {
    display: flex; align-items: baseline; gap: 10px; padding: 7px 2px;
    border-top: 1px solid var(--line-soft); font-size: 14.5px;
  }
  .wh-trow:first-of-type { border-top: none; }
  .wh-trow b { font-family: var(--font-display); }
  .wh-trow .wh-host { font-size: 12.5px; color: var(--muted); }
  .wh-trow .wh-host:hover { color: var(--link); }
  .wh-trow .wh-dots { flex: 1; border-bottom: 1.5px dotted var(--line); }
  .wh-trow .wh-n { font-variant-numeric: tabular-nums; color: var(--ink-soft);
                   white-space: nowrap; }
  .wh-trow a { font-size: 13px; white-space: nowrap; }
  .wh-greeting { margin: 0 0 0.6em; }
  /* Lighter door-card treatment (Gene, 2026-08-11: "I like the lighter
     treatment") — each hat is a white card, echoing the rail's role cards. */
  .wh-hat {
    margin-bottom: 0.95em; background: var(--card);
    border: 1px solid var(--line); border-radius: var(--radius-lg);
    padding: 1.05em 1.2em;
  }
  .wh-hat-label {
    text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.78em;
    color: var(--kicker); margin-bottom: 0.35em; font-weight: 700;
  }
  .wh-hat p { margin: 0 0 0.7em; max-width: 34em; }
  .wh-quote {
    margin: 1.8em 0 0; padding-left: 1em; font-style: italic;
    border-left: 3px solid var(--focus-line, #b58c4e); color: var(--ink-soft, #6b5d4f);
  }
  .wh-panel-label {
    text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.78em;
    color: var(--ink-soft, #8a7a68); margin-bottom: 0.5em; font-weight: 700;
  }
  .wh-panel {
    background: var(--panel, #faf6ef); border: 1px solid var(--hairline, #e0d8ca);
    border-radius: 8px; padding: 1.4em;
  }
  .wh-event-name { font-weight: 700; font-size: 1.15em; margin-bottom: 0.6em; }
  .wh-stats { display: flex; gap: 1.2em; flex-wrap: wrap; margin-bottom: 1em; }
  .wh-talks { margin-bottom: 1.1em; }
  .wh-talk { display: flex; gap: 0.6em; margin-bottom: 0.45em; align-items: baseline; }
  .wh-stars { color: var(--accent, #b58c4e); font-variant-numeric: tabular-nums; white-space: nowrap; }
  .wh-talk-title { overflow: hidden; text-overflow: ellipsis; }
  @media (max-width: 760px) { .welcome-hero { grid-template-columns: 1fr; } }
}

/* THE NEWCOMER GHOST MAP (Option B, Gene 2026-08-11): a person with no
   events sees the organizer's journey spine; every ghost row is a real
   <button> in a tiny form. Muted like sb-step-done, but alive — pointer +
   hover-brighten say "click me", because clicking IS the tour. */
.sidebar .sb-demo-form { margin: 0; display: block; }
.sidebar button.sb-item {
  background: none; border: none; width: 100%; text-align: left;
  font-family: inherit; font-size: 15px; display: block; cursor: pointer;
}
.sidebar .sb-item.sb-ghost { color: var(--muted); }
.sidebar .sb-item.sb-ghost:hover { color: var(--ink); }
.sidebar .sb-item.sb-ghost .sb-step-n { background: var(--line-soft); color: var(--muted); }
.sidebar .sb-ghost-box {
  border: 1.5px dashed var(--ghost-line); border-radius: var(--radius);
  padding: 9px 11px; margin: 6px 0 2px;
}
.sidebar .sb-ghost-box b {
  font-family: var(--font-display); font-size: 15px; font-weight: 600;
  color: var(--muted); display: block;
}
.sidebar .sb-ghost-create { font-size: 13px; color: var(--link); }
.sidebar .sb-tour {
  margin-top: 8px; color: var(--go); font-weight: 600; font-size: 14px;
}
.sidebar .sb-tour small {
  display: block; color: var(--muted); font-weight: 400; font-size: 11.5px;
}

/* Three-hats welcome (Gene 2026-08-11): the thesis line names the account
   model; each hat's doors are concrete verbs; the reviewer door is a form
   POST into the demo board, styled as a link. */
.welcome-hero .wh-thesis {
  color: var(--muted); font-size: 15px; margin: -0.4em 0 1.4em;
  max-width: 42ch;
}
.welcome-hero .wh-sandbox-orientation {
  border: 2px solid #c53b32; border-radius: 7px;
  background: #fff8f6; padding: 15px 17px 13px; margin: 0 0 1.25em;
  box-shadow: 0 2px 0 rgb(197 59 50 / 10%);
}
.welcome-hero .wh-sandbox-k {
  color: #a92d27; font-size: 11px; font-weight: 800;
  letter-spacing: 0.13em; text-transform: uppercase; margin-bottom: 7px;
}
.welcome-hero .wh-sandbox-orientation p { margin: 0 0 0.55em; }
.welcome-hero .wh-sandbox-orientation p:last-child { margin-bottom: 0; }
.welcome-hero .wh-doors { display: flex; flex-direction: column; gap: 0.35em; }
.welcome-hero .wh-demo-door { margin: 0; }
.welcome-hero .wh-linklike {
  background: none; border: none; padding: 0; font: inherit;
  color: var(--link); cursor: pointer; text-align: left;
}
.welcome-hero .wh-linklike:hover { text-decoration: underline; }

/* SIMULATION badge — same chip as DEV but green: "this is a demo timeline,
   drag it." Renders in every environment on replay-marked events. */
.sb-dev-badge.sim-badge { background: var(--go); color: #fff; margin-left: 6px; }

/* V4r role CARDS (Gene picked V4 revision, 2026-08-11): each hat is a
   white card with a title + one-line promise. The red SIMULATION banner
   is the loud twin of the bottom strip — every environment, never
   mistakable for real data. */
.sidebar .sb-sect {
  background: var(--card); border: 1px solid var(--line);
  border-radius: var(--radius-lg); padding: 10px 12px; margin-top: 12px;
}
.sidebar .sb-role {
  padding-bottom: 7px; margin-bottom: 4px;
  border-bottom: 1px solid var(--line-soft);
}
.sidebar .sb-role span {
  font-family: var(--font-display); font-weight: 700; font-size: 14.5px;
  color: var(--ink);
}
.sidebar .sb-role small {
  display: block; font-family: var(--font-ui); font-weight: 400;
  font-size: 11.5px; color: var(--muted); margin-top: 1px;
}
.sim-banner {
  background: var(--danger); color: #fff; padding: 10px 18px;
  display: flex; align-items: center; gap: 12px; font-weight: 700;
}
.sim-banner .sim-word { font-size: 16px; letter-spacing: .14em; }
.sim-banner .sim-note { font-weight: 400; opacity: .92; font-size: 12.5px; }
.sim-banner .sim-exit { margin-left: auto; color: #fff; font-size: 12.5px; white-space: nowrap; }

/* Placement A: "see all events →" rides the organizer card's header row. */
.sidebar .sb-role { display: grid; grid-template-columns: 1fr auto; align-items: baseline; }
.sidebar .sb-role small { grid-column: 1 / -1; }
.sidebar .sb-role-see { font-size: 12px; color: var(--link); white-space: nowrap; }

/* The double promise block (Gene, 2026-08-11): why-we-built-this, then
   our-promise-to-you, replacing the queue/table quote. */
.welcome-hero .wh-promise {
  margin-top: 1.1em; border-left: 3px solid var(--focus-line); padding-left: 1em;
}
.welcome-hero .wh-promise-k {
  text-transform: uppercase; letter-spacing: 0.08em; font-size: 0.72em;
  color: var(--kicker); font-weight: 700; margin-bottom: 0.25em;
}
.welcome-hero .wh-promise p {
  font-family: var(--font-display); font-size: 15.5px; line-height: 1.45;
  color: var(--ink-soft); max-width: 40ch; margin: 0;
}

/* T1 marquee login (Gene picked it, 2026-08-11). */
.login-marquee {
  max-width: 560px; margin: 3.5em auto 0; text-align: center;
  padding: 0 1.5em;
}
.login-marquee .lm-brand {
  font-family: var(--font-display); font-weight: 700; font-size: 17px;
  margin-bottom: 30px;
}
.login-marquee .lm-welcome {
  font-family: var(--font-display); font-size: 28px; line-height: 1.22;
  margin: 0 0 8px; text-wrap: balance;
}
.login-marquee .lm-sub { color: var(--muted); font-size: 15px; margin: 0 0 26px; }
.login-marquee .lm-act { margin-bottom: 6px; }
.login-marquee .lm-google {
  display: inline-flex; align-items: center; justify-content: center; gap: 10px;
  background: var(--card); color: var(--ink); font-weight: 600; font-size: 15px;
  border: 1px solid var(--field-line); border-radius: 10px;
  padding: 12px 24px; text-decoration: none; transition: background .18s ease;
}
.login-marquee .lm-google:hover { background: var(--paper-deep); color: var(--ink); }
.login-marquee .lm-g { display: inline-flex; }
.login-marquee .lm-g svg { width: 18px; height: 18px; flex: none; }
.login-marquee .lm-hint { color: var(--muted); font-size: 12.5px; margin-top: 7px; }
.login-marquee .lm-magic-off {
  margin-top: 16px; background: var(--line-soft); color: var(--muted-2);
  border: 1px solid var(--line); border-radius: var(--radius);
  padding: 10px 18px; font-size: 14px; font-family: var(--font-ui);
  cursor: not-allowed;
}
.login-marquee .lm-magic {
  margin: 24px auto 0; width: fit-content; text-align: center;
  border: 1px dashed var(--ghost-line); border-radius: var(--radius);
  padding: 10px 14px;
}
.login-marquee .lm-magic .lm-dev-tag { display: block; margin-bottom: 7px; }
.login-marquee .lm-magic input[disabled] {
  background: var(--line-soft); color: var(--muted-2); cursor: not-allowed;
}
.login-marquee .lm-send[disabled] {
  background: var(--line-soft); color: var(--muted-2); cursor: not-allowed;
}
.login-marquee .lm-dev-tag {
  font-size: 10.5px; text-transform: uppercase; letter-spacing: .1em;
  color: var(--muted-2); font-weight: 700; white-space: nowrap;
}
.login-marquee .lm-magic input {
  border: 1px solid var(--field-line); border-radius: var(--radius);
  padding: 7px 10px; font-size: 14px; font-family: var(--font-ui);
  background: var(--card); color: var(--ink); width: 220px;
}
.login-marquee .lm-send {
  background: var(--line-soft); color: var(--ink-soft);
  border: 1px solid var(--field-line); border-radius: var(--radius);
  padding: 8px 14px; font-size: 13.5px; font-family: var(--font-ui);
  font-weight: 600; cursor: pointer; white-space: nowrap; margin-left: 6px;
}
.login-marquee .lm-fine {
  color: var(--muted); font-size: 13px; margin-top: 26px; padding-top: 18px;
  border-top: 1px solid var(--line);
}
.login-marquee .lm-sandbox { margin-top: 42px; text-align: left; }
.login-marquee .lm-sandbox-head { text-align:center; margin:26px auto 20px; }
.login-marquee .lm-sandbox-head h2 {
  font-family:var(--font-display); font-size:25px; line-height:1.2;
  margin:0 0 8px;
}
.login-marquee .lm-sandbox-head p {
  color:var(--muted); font-size:14px; line-height:1.55;
  max-width:48ch; margin:0 auto;
}
.login-marquee .lm-sandbox-head .lm-sandbox-safety {
  color:var(--go); font-size:11.5px; font-weight:700; margin-top:10px;
}
.login-marquee .lm-personas {
  display:grid; grid-template-columns:1fr 1fr; gap:12px;
}
.login-marquee .lm-persona-organizer { grid-column:1 / -1; }
.login-marquee .lm-persona { margin:0; }
.login-marquee .lm-persona-card {
  appearance:none; width:100%; height:100%; text-align:left;
  display:flex; flex-direction:column; align-items:flex-start;
  background:var(--card); color:var(--ink); border:1px solid var(--line);
  border-radius:10px; padding:18px; font-family:var(--font-ui);
  cursor:pointer; box-shadow:0 2px 8px rgba(60,45,20,.04);
  transition:transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.login-marquee .lm-persona-card:hover,
.login-marquee .lm-persona-card:focus-visible {
  transform:translateY(-2px); border-color:var(--go);
  box-shadow:0 10px 24px rgba(60,45,20,.10); outline:none;
}
.login-marquee .lm-persona.disabled .lm-persona-card {
  cursor:not-allowed; opacity:.48; filter:saturate(.35); box-shadow:none;
}
.login-marquee .lm-persona.disabled .lm-persona-card:hover,
.login-marquee .lm-persona.disabled .lm-persona-card:focus-visible {
  transform:none; border-color:var(--line); box-shadow:none;
}
.login-marquee .lm-persona-organizer .lm-persona-card {
  background:color-mix(in srgb, var(--go) 5%, var(--card));
  border-color:color-mix(in srgb, var(--go) 38%, var(--line));
  padding:22px;
}
.login-marquee .lm-persona-label {
  font-size:11px; font-weight:800; letter-spacing:.11em;
  text-transform:uppercase; color:var(--ink);
}
.login-marquee .lm-persona-body {
  color:var(--muted); font-size:13.5px; line-height:1.5;
  margin:9px 0 14px;
}
.login-marquee .lm-persona-action {
  color:var(--go); font-size:13px; font-weight:700; margin-top:auto;
}
.login-marquee .lm-sandbox-boundary {
  color:var(--muted-2); font-size:11.5px; text-align:center; margin:14px 0 0;
}
@media (max-width: 560px) {
  .login-marquee .lm-personas { grid-template-columns:1fr; }
  .login-marquee .lm-persona-organizer { grid-column:auto; }
  .login-marquee .lm-sandbox { margin-top:34px; }
}

/* The floating DEV chip (injected inline by browser-reload) reads as a
   dark banner and overlaps Log out — hidden (Gene, 2026-08-11: "I don't
   think we need that dark banner anymore"). !important beats its inline
   styles; the reload script itself is untouched. */

/* One voice inside the role cards (Gene, 2026-08-11: "why is it blue
   instead of matching the other ones?") — real links and demo buttons
   read identically; hover brightens both. */
.sidebar .sb-sect a.sb-item { color: var(--ink-soft); }
.sidebar .sb-sect a.sb-item:hover { color: var(--ink); text-decoration: none; }

/* Admin as one quiet footer word on the newcomer card (Gene, 2026-08-11):
   the journey stays visible; operations shrink to a single door. */
.sidebar .sb-admin-foot { margin-top: 8px; padding-top: 8px;
                          border-top: 1px solid var(--line-soft); }
.sidebar .sb-admin-quiet {
  background: none; border: none; padding: 2px; cursor: pointer;
  font-family: var(--font-ui); font-size: 12.5px; color: var(--muted);
}
.sidebar .sb-admin-quiet:hover { color: var(--ink); }

/* THE HOST PLAYBILL (/organizers/<slug>, Gene ratified round 2 2026-08-11):
   chair + speaker profile + their events, in the welcome-ticker idiom. */
.playbill {
  max-width: 560px; margin: 3em auto 0; text-align: center; padding: 0 1.5em 2em;
}
.playbill .pb-kick, .playbill .pb-kick2 {
  text-transform: uppercase; letter-spacing: .1em; font-size: 11.5px;
  color: var(--kicker); font-weight: 700;
}
.playbill .pb-ava {
  width: 92px; height: 92px; border-radius: 50%; background: var(--paper-deep);
  border: 1px solid var(--line); margin: 16px auto 14px; display: flex;
  align-items: center; justify-content: center;
  font-family: var(--font-display); font-size: 32px; font-weight: 700;
  color: var(--muted);
}
.playbill .pb-photo {
  width: 92px; height: 92px; border-radius: 50%; object-fit: cover;
  border: 1px solid var(--line); margin: 16px auto 14px; display: block;
}
.playbill .pb-name { font-family: var(--font-display); font-size: 36px;
                     font-weight: 800; margin: 0 0 2px; line-height: 1.1; }
.playbill .pb-tag { color: var(--ink-soft); font-size: 15px; margin-top: 4px;
                    text-wrap: balance; max-width: 46ch;
                    margin-left: auto; margin-right: auto; }
.playbill .pb-bio { color: var(--ink-soft); font-size: 15px; line-height: 1.65;
                    max-width: 52ch; margin: 16px auto 6px;
                    text-align: center; text-wrap: pretty; }
.playbill .pb-links { display: flex; gap: 18px; justify-content: center;
                      font-size: 13px; margin: 12px 0 0; }
.playbill .pb-edit {
  display: inline-block; margin-top: 20px; font-size: 13.5px;
  border: 1px solid var(--field-line); border-radius: var(--radius);
  padding: 7px 14px; color: var(--ink-soft); background: var(--card);
}
.playbill .pb-edit:hover { border-color: var(--field-line-hover);
                           color: var(--ink); text-decoration: none; }
.playbill .pb-events { margin-top: 28px; padding-top: 16px;
                       border-top: 1px solid var(--line); text-align: left; }
.playbill .pb-kick2 { display: block; margin-bottom: 4px; }
.playbill .pb-trow {
  display: flex; align-items: baseline; gap: 10px; padding: 9px 2px;
  border-top: 1px solid var(--line-soft); font-size: 15px;
}
.playbill .pb-trow:first-of-type { border-top: none; }
.playbill .pb-trow b { font-family: var(--font-display); }
.playbill .pb-dots { flex: 1; border-bottom: 1.5px dotted var(--line); }
.playbill .pb-n { color: var(--ink-soft); white-space: nowrap;
                  font-variant-numeric: tabular-nums; }
.playbill .pb-open {
  background: var(--go); color: #fff; font-size: 11px; font-weight: 700;
  border-radius: var(--pill); padding: 2px 10px; white-space: nowrap;
}
.playbill .pb-open:hover { background: var(--go-hover); color: #fff; }
.playbill .pb-nudge {
  background: var(--paper-deep); border-radius: var(--radius);
  font-size: 12.5px; color: var(--muted); padding: 9px 13px; margin-top: 18px;
  text-align: left;
}
.playbill .pb-back { display: inline-block; margin-top: 24px;
                     color: var(--muted); font-size: 13px; }

/* CFP Time Machine (Gene named it, 2026-08-11) — the scrubber header gets
   marquee billing; the banner exit becomes a real button. */
.timetravel .tt-title {
  font-family: var(--font-display); font-weight: 700; font-size: 15.5px;
}
.timetravel .tt-sub { margin-left: 0.7em; font-size: 12.5px; color: var(--muted); }
.dev-strip .timetravel .tt-title { color: #EDE8DD; font-size: 16px; }
.dev-strip .timetravel .tt-sub { color: #A79E8E; }
.sim-banner .sim-exit {
  margin-left: auto; color: #fff; font-size: 13px; font-weight: 700;
  border: 1.5px solid rgba(255,255,255,.85); border-radius: var(--radius);
  padding: 6px 14px; white-space: nowrap;
}
.sim-banner .sim-exit:hover { background: rgba(255,255,255,.15); color: #fff;
                              text-decoration: none; }

/* Simulations shelf — replay demos live here, never the events table. */
.ev-sims { margin-top: 1.2em; }
.ev-sims summary { cursor: pointer; color: var(--muted); font-size: 13.5px; }

/* The public CFP hero image (Gene, 2026-08-11): one wide band above the
   kicker; optional per event via settings.hero-image-url. */
.cfp-masthead .cfp-hero {
  display: block; width: 100%; max-height: 340px; object-fit: cover;
  border-radius: var(--radius-lg); margin-bottom: 1.4em;
}

/* Shared product footer: origin credit above the quiet navigation row. */
.site-footer {
  margin-top: 3em; padding-top: 2em; border-top: 1px solid var(--line);
  text-align: center;
}
.site-footer .site-thanks {
  color: var(--ink); font-family: var(--font-display); font-size: 16px;
  font-style: italic; margin: 0 auto 0.9em;
}
.site-footer .site-links { font-size: 13.5px; color: var(--muted); }
.site-footer .site-links .dot { color: var(--ghost-ink); padding: 0 8px; }

/* The landing story (Gene's copy, 2026-08-11) — replaces the ledger tape. */
.landing .landing-story {
  margin: 3.5em auto 0; max-width: 76ch;
}
.landing .landing-story h2 {
  font-family: var(--font-display); font-size: 26px; line-height: 1.25;
  margin-bottom: 0.8em; text-wrap: balance;
}
.landing .landing-story h2 span { color: var(--focus-line); }
.landing .landing-story p {
  font-size: 16px; line-height: 1.65; margin-bottom: 1em;
  color: var(--ink-soft);
}
/* The story's proof photo — the Charlotte room, mid-story. */
.landing .landing-story .ls-photo {
  display: block; width: 100%; border-radius: var(--radius-lg);
  margin: 1.4em 0;
}

/* Featured (announced) speakers strip on the public CFP (Gene, 2026-08-11):
   the Sched-replacement lane — sells submissions AND tickets. */
.cfp-featured { margin-top: 3em; }
.cfp-featured-grid {
  display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 1.6em 1em; margin-top: 1em; text-align: center;
}
.cfp-featured-card { display:flex; flex-direction:column; position:relative; }
.cfp-featured-card .public-headshot { width:112px; height:112px; margin:0 auto 8px; }
.cfp-featured-card h3 a, .cfp-featured-name a { color:inherit; text-decoration:none; }
.cfp-featured-name a::after { content:""; position:absolute; inset:0; }
.cfp-featured-card details, .cfp-featured-card summary { position:relative; z-index:1; }
.cfp-featured-card:has(.cfp-featured-name a):hover .cfp-featured-name a { text-decoration:underline; }
.cfp-featured-card:has(.cfp-featured-name a):focus-within { outline:3px solid var(--focus-line);
                                                            outline-offset:6px; border-radius:var(--radius-sm); }
.cfp-featured-name a:hover { text-decoration:underline; }
.cfp-featured-photo {
  width: 112px; height: 112px; border-radius: 50%; object-fit: cover;
  margin: 0 auto 8px; display: block; border: 1px solid var(--line);
  filter: grayscale(1);
}
.cfp-featured-name { font-family: var(--font-display); font-weight: 700;
                     font-size: 15px; }
.cfp-featured-org { font-weight: 600; font-size: 12.5px; color: var(--ink-soft); }
.cfp-featured-title { font-size: 12px; color: var(--muted); line-height: 1.35; }

/* On the landing story, the featured grid runs exactly 4 across. */
.landing .cfp-featured-grid { grid-template-columns: repeat(4, 1fr); }
.landing .cfp-featured-card { display:flex; flex-direction:column; }
.cfp-featured-photo { width: 96px; height: 96px; }

/* The zoo (bead sessionize-sched-killer-92x) — an internal element gallery:
   proof surfaces + living documentation, calm and quiet, no new fonts. */
.zoo-page { max-width: 68em; }
.zoo-section { margin-bottom: 2.4em; }
.zoo-section h2 {
  font-family: var(--font-display); font-size: 20px; margin-bottom: 0.6em;
}
.zoo-section h3 {
  font-family: var(--font-ui); font-size: 13px; font-weight: 700;
  text-transform: uppercase; letter-spacing: 0.05em; color: var(--muted);
  margin: 1.2em 0 0.5em;
}
.zoo-jump { display:flex; flex-wrap:wrap; gap:0.45em 0.8em; align-items:center;
  margin-bottom:1.5em; color:var(--muted); font-size:13px; }
.zoo-jump span { font-weight:700; color:var(--ink-soft); }

.zoo-preview-row {
  display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 1.4em;
  align-items: start;
}
@media (max-width: 46em) { .zoo-preview-row { grid-template-columns: 1fr; } }

/* LinkedIn-style: image on top, bold title, gray description, domain line. */
.zoo-card-linkedin {
  border: 1px solid var(--line); border-radius: var(--radius-lg);
  overflow: hidden; background: var(--card);
}
.zc-li-image { display: block; width: 100%; max-height: 260px; object-fit: cover; }
.zc-li-body { padding: 0.9em 1em; }
.zc-li-title { font-weight: 700; font-size: 15px; color: var(--ink); line-height: 1.3; }
.zc-li-desc {
  color: var(--muted); font-size: 13px; margin-top: 0.3em; line-height: 1.4;
  display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical;
  overflow: hidden;
}
.zc-li-domain {
  color: var(--muted-2); font-size: 12px; text-transform: uppercase;
  letter-spacing: 0.03em; margin-top: 0.5em;
}

/* Slack-style: readable hierarchy followed by the complete landscape card. */
.zoo-card-slack {
  border-left: 3px solid var(--line); background: var(--card);
  padding: 0.7em 0.9em; border-radius: 0 var(--radius-lg) var(--radius-lg) 0;
}
.zc-sl-body { flex: 1 1 auto; min-width: 0; }
.zc-sl-domain { color: var(--muted); font-size: 12px; margin-bottom: 0.15em; }
.zc-sl-title { color: #1264A3; font-weight: 700; font-size: 16px; line-height: 1.3; }
.zc-sl-desc { color: var(--ink-soft); font-size: 14px; margin-top: 0.3em; line-height: 1.45; }
.zc-sl-image {
  display: block; width: min(100%, 520px); aspect-ratio: 1.91 / 1;
  object-fit: contain; object-position: left center; margin-top: 0.7em;
  border-radius: 4px; background: var(--paper-deep);
}

/* X summary_large_image: complete 1.91:1 artwork, then readable copy. */
.zoo-card-x {
  overflow: hidden; border: 1px solid var(--line); border-radius: 14px;
  background: var(--card);
}
.zc-x-card-type {
  padding: 0.45em 0.8em; color: var(--muted); font-size: 11px;
  font-weight: 700; letter-spacing: 0.04em;
}
.zc-x-image {
  display: block; width: 100%; aspect-ratio: 1.91 / 1; object-fit: contain;
  background: var(--paper-deep);
}
.zc-x-body { padding: 0.75em 0.85em 0.85em; }
.zc-x-title { color: var(--ink); font-size: 15px; font-weight: 700; line-height: 1.3; }
.zc-x-desc { color: var(--ink-soft); font-size: 13px; line-height: 1.4; margin-top: 0.25em; }
.zc-x-domain { color: var(--muted); font-size: 12px; margin-top: 0.45em; }

.zoo-dims { color: var(--ink-soft); font-size: 13.5px; margin: 1em 0; }
.zoo-meta-table code { font-size: 12.5px; }

.zoo-tips { padding-left: 1.2em; color: var(--ink-soft); font-size: 14px; line-height: 1.6; }
.zoo-tips li { margin-bottom: 0.5em; }
.zoo-tips code {
  background: var(--paper-deep); padding: 0.1em 0.35em; border-radius: 3px;
  font-size: 0.92em;
}

.zoo-index-stub {
  border-top: 1px solid var(--line); margin-top: 2em; padding-top: 1.2em;
  color: var(--muted); font-size: 13.5px;
}
.zoo-index-stub h2 {
  font-family: var(--font-display); font-size: 16px; color: var(--ink-soft);
  margin-bottom: 0.4em;
}

@layer page {
  /* Ann's speaker marquee: quiet rows, with the bulb as the only loud mark. */
  .announce-admin { max-width: 72em; }
  .announce-admin-section { margin-top: 2.2em; }
  .announce-admin-section-head {
    display: flex; align-items: center; justify-content: space-between;
    gap: 1em; margin-bottom: 0.45em;
  }
  .announce-admin-kicker {
    margin: 0 0 0.45em; color: var(--kicker); font-size: 12px;
    font-weight: 700; letter-spacing: 0.1em; text-transform: uppercase;
  }
  .announce-admin-section-head .announce-admin-kicker { margin: 0; }
  .announce-admin-row {
    display: grid; grid-template-columns: 2em minmax(13em, 1fr) minmax(15em, auto) auto;
    gap: 1em; align-items: center; padding: 0.9em 0;
    border-top: 1px solid var(--line-soft);
  }
  .announce-admin-row:last-child { border-bottom: 1px solid var(--line-soft); }
  .announce-admin-row.dark { color: var(--muted); }
  .announce-bulb { font-size: 22px; line-height: 1; text-align: center; }
  .announce-bulb .sb-inline-check { color: var(--go); font-weight: 900; }
  .announce-bulb .sb-inline-x { color: var(--danger); font-weight: 900; }

  /* Reviewer progress: current-cycle vs lifetime separation (ABS-05/08) */
  .reviewer-progress-headline { margin: 0 0 8px; font-size: 1.1em; }
  .progress-current { font-weight: 600; }
  .progress-lifetime { color: var(--text-muted, #767676); }
  .reviewer-progress-complete .header { font-size: 1.1em; }
  a.announce-page-action,
  button.announce-page-action {
    background: none; border: none; border-radius: 0; box-shadow: none;
    padding: 0; margin: 0; font: inherit; line-height: inherit;
    color: var(--link); text-decoration: underline; cursor: pointer;
  }
  .announce-bulb.lit { color: var(--go); }
  .announce-bulb.dark { color: var(--ghost-ink); }
  .announce-person { display: flex; flex-direction: column; min-width: 0; }
  .announce-person strong { color: var(--ink); }
  .announce-person span { color: var(--muted); font-size: 13.5px; }
  .announce-person code {
    overflow: hidden; color: var(--muted-2); font-size: 11.5px;
    text-overflow: ellipsis; white-space: nowrap;
  }
  .announce-readiness { color: var(--muted); font-size: 13px; white-space: nowrap; }
  .announce-actions { display: flex; justify-content: flex-end; gap: 0.45em; }
  .announce-actions form { margin: 0; }
  .announce-edit-panel {
    display: none; grid-column: 2 / -1; padding: 1.1em 1.2em 1.2em;
    border: 1px solid var(--line); border-radius: var(--radius-md);
    background: var(--card);

    &:target { display: block; }
  }
  .announce-edit-head {
    display: flex; align-items: flex-start; justify-content: space-between;
    gap: 1em; margin-bottom: 1em;
  }
  .announce-edit-kicker {
    color: var(--kicker); font-size: 11px; font-weight: 700;
    letter-spacing: 0.1em; text-transform: uppercase;
  }
  .announce-edit-close {
    color: var(--muted); font-size: 16px; text-decoration: none;
  }
  .announce-edit-grid {
    display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.5em;
  }
  .announce-edit-subhead {
    margin-bottom: 0.75em; color: var(--ink); font-family: var(--font-display);
    font-size: 16px; font-weight: 600;
  }
  .announce-edit-talk + .announce-edit-talk {
    margin-top: 1em; padding-top: 1em; border-top: 1px solid var(--line-soft);
  }
  .announce-admin-footer {
    margin-top: 2em; padding-top: 1.2em; border-top: 1px solid var(--line);
  }
  .announce-create { max-width: 48em; }

  @media (max-width: 58em) {
    .announce-admin-row {
      grid-template-columns: 2em 1fr;
    }
    .announce-readiness, .announce-actions { grid-column: 2; }
    .announce-actions { justify-content: flex-start; flex-wrap: wrap; }
    .announce-edit-panel { grid-column: 1 / -1; }
    .announce-edit-grid { grid-template-columns: 1fr; }
  }
}
  /* Rough-cut stamp chips: armed state (JS flips data-armed; server owns all real state) */
  .sched-stamp-chip[data-armed="true"] { outline:2px solid #333; outline-offset:1px; font-weight:700; }
  /* Public agenda day tabs: pills with real separation (Gene: "Oct 7Day 2" ran together) */
  .agenda-day-tabs { display:flex; gap:0.5em; flex-wrap:wrap; margin:0.4em 0 0.6em; }
  .agenda-day-tab { display:inline-block; padding:0.3em 0.9em; border:1px solid #d9d7d2;
                    border-radius:999px; text-decoration:none; }
  .agenda-day-tab.active { background:#333; color:#fff; border-color:#333; }
  /* Drag surfaces never text-select: a drag starting inside a selection drags
     the whole selection (the "3 cards moved with it" artifact, 2026-08-18). */
  .rough-lane, .rough-card, .rail-speaker { user-select:none; -webkit-user-select:none; }
  /* Open seats on the public agenda: a whisper, not a hole (2026-08-18) */
  .agenda-band-tba { opacity:.5; font-style:italic; }
  .agenda-band-tba .agenda-band-label { text-transform:none; letter-spacing:0; }
  /* TBA bands wear the speaker-card sage — a held seat, softer still */
  .agenda-band-tba { background:var(--agenda-session-fill); border-color:var(--agenda-session-line); }