:root {
    --gold: #fbbf24;
    --gold-dim: rgba(251,191,36,0.3);
    --gold-faint: rgba(251,191,36,0.06);
    --bg: #050914;
    --card: rgba(255,255,255,0.02);
    --border: rgba(255,255,255,0.06);
    --text: #fff;
    --text-secondary: rgba(255,255,255,0.55);
    --text-muted: rgba(255,255,255,0.35);
    --font-display: 'Syncopate', sans-serif;
    --font-body: 'Inter', sans-serif;
  }

  /* ── Loading ────────────────────────────── */
  .profile-loading {
    min-height:80vh; display:flex; align-items:center; justify-content:center;
    flex-direction:column; gap:1rem;
  }
  .profile-loading__spinner {
    width:40px; height:40px; border:3px solid rgba(251,191,36,0.15);
    border-top-color:var(--gold); border-radius:50%; animation:spin 0.8s linear infinite;
  }
  @keyframes spin { to { transform:rotate(360deg); } }
  .profile-loading__text {
    font-family:var(--font-display); font-size:0.625rem; font-weight:700;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--text-muted);
  }

  /* ── HERO (UNTOUCHED) ──────────────────── */
  .p-hero {
    position:relative; height:100vh; min-height:600px; display:flex;
    align-items:flex-end; overflow:hidden; background:var(--bg);
  }
  .p-hero__bg {
    position:absolute; inset:0; background-size:cover; background-position:center center;
    transition:opacity 0.6s ease;
  }
  /* ┏━ Hero Living Portrait video (Gap 2d) ━━━━━━━━━━━━━━━━━━━━┓
     When the guest has both a Twin still portrait AND a livingPortraitVideoUrl,
     the Authority Page hero plays the video instead of the static portrait
     image. Video plays muted, autoplay, loop, playsinline. Falls back to the
     still hero bg when toggle is flipped to Original or no video is present.
  ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛ */
  .p-hero__video {
    position:absolute; inset:0; width:100%; height:100%;
    object-fit:cover; object-position:center center;
    display:none; transition:opacity 0.6s ease;
  }
  .p-hero__video.is-active { display:block; }
  .p-hero__bg.is-hidden { opacity:0; }
  .p-hero__overlay {
    position:absolute; inset:0;
    background:
      linear-gradient(to top, var(--bg) 0%, rgba(5,9,20,0.75) 25%, rgba(5,9,20,0.15) 55%, rgba(5,9,20,0.35) 100%),
      linear-gradient(to right, rgba(5,9,20,0.6) 0%, rgba(5,9,20,0) 50%);
  }
  .p-hero__content {
    position:relative; z-index:2; padding:0 80px 80px; max-width:900px; width:100%;
  }
  .p-hero__segment {
    font-family:var(--font-display); font-size:0.5rem; font-weight:700;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--text-muted);
    margin-bottom:8px;
  }
  .p-hero__name {
    font-family:var(--font-display); font-weight:700;
    font-size:clamp(2.5rem,6vw,4.5rem); line-height:1.0; text-transform:uppercase;
    color:var(--text); margin:0 0 12px; letter-spacing:-1px;
  }
  .p-hero__headline {
    font-size:clamp(1rem,1.5vw,1.15rem); color:var(--text-secondary);
    max-width:600px; line-height:1.6; margin-bottom:24px;
  }
  .p-hero__play-btn {
    display:inline-flex; align-items:center; gap:12px; padding:12px 24px;
    background:rgba(251,191,36,0.12); border:1px solid var(--gold-dim);
    border-radius:60px; color:var(--gold); font-family:var(--font-display);
    font-size:0.5rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase;
    cursor:pointer; transition:all 0.3s ease; text-decoration:none;
  }
  .p-hero__play-btn:hover { background:rgba(251,191,36,0.25); border-color:var(--gold); }
  .p-hero__play-circle {
    width:36px; height:36px; border-radius:50%; background:var(--gold);
    display:flex; align-items:center; justify-content:center; flex-shrink:0;
  }
  .p-hero__play-circle svg { width:14px; height:14px; fill:var(--bg); margin-left:2px; }

  /* ── BODY ───────────────────────────────── */
  .p-body { padding:0 0 4rem; }
  .p-container { max-width:1100px; margin:0 auto; padding:0 clamp(16px,3vw,40px); }

  .p-back {
    display:inline-flex; align-items:center; gap:0.5rem; margin-bottom:1.5rem;
    font-family:var(--font-display); font-size:0.5rem; font-weight:700;
    letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted);
    text-decoration:none; transition:color 0.2s; padding-top:2rem;
  }
  .p-back:hover { color:var(--gold); }

  /* ── Stat Bar ────────────────────────────── */
  .p-statbar {
    display:flex; align-items:center; gap:1.5rem; padding:1rem 0 1.5rem;
    border-bottom:1px solid var(--border); margin-bottom:2.5rem; flex-wrap:wrap;
  }
  .p-statbar__photo {
    width:56px; height:56px; min-width:56px; border-radius:10px;
    overflow:hidden; border:2px solid rgba(251,191,36,0.2);
  }
  .p-statbar__photo img { width:100%; height:100%; object-fit:cover; }
  .p-statbar__initials {
    width:56px; height:56px; min-width:56px; border-radius:10px;
    background:linear-gradient(135deg,rgba(255,255,255,0.03),var(--gold-faint));
    border:2px solid rgba(251,191,36,0.2); display:flex; align-items:center;
    justify-content:center; font-family:var(--font-display); font-size:1.25rem;
    font-weight:700; color:var(--gold);
  }
  .p-statbar__meta { flex:1; min-width:0; }
  .p-statbar__name {
    font-family:var(--font-display); font-weight:700; font-size:0.875rem;
    color:var(--text); text-transform:uppercase; line-height:1.2;
  }
  .p-statbar__title { font-size:0.8125rem; color:var(--text-secondary); margin-top:2px; }
  .p-statbar__tier {
    display:inline-flex; align-items:center; gap:4px; padding:4px 12px;
    border-radius:60px; font-family:var(--font-display); font-size:0.4rem;
    font-weight:700; letter-spacing:0.15em; text-transform:uppercase;
  }
  /* ┏━ Digital Twin portrait toggle ━━━━━━━━━━━━━━━━━━━━━┓
     Segmented control under the stat bar that lets the viewer flip the
     hero background and the stat-bar photo between the publication-
     treated Digital Twin portrait and the guest's original headshot.
     Only renders when the guest has an active twin with a primary
     portrait. Default state shows the Twin (gold pill on "Twin").
  ┗━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━━┛ */
  .p-portrait-toggle {
    display:inline-flex; align-items:center; gap:0; padding:3px;
    border-radius:60px; border:1px solid rgba(251,191,36,0.18);
    background:rgba(255,255,255,0.02); margin-top:8px;
  }
  .p-portrait-toggle__btn {
    appearance:none; border:0; background:transparent; cursor:pointer;
    padding:5px 14px; border-radius:60px;
    font-family:var(--font-display); font-size:0.65rem; font-weight:700;
    letter-spacing:0.18em; text-transform:uppercase;
    color:var(--text-muted); transition:color 0.2s, background 0.2s;
  }
  .p-portrait-toggle__btn:hover { color:var(--text-secondary); }
  .p-portrait-toggle__btn[aria-pressed="true"] {
    background:rgba(251,191,36,0.15); color:var(--gold);
  }

  .p-statbar__tier--vip { background:rgba(251,191,36,0.15); color:var(--gold); border:1px solid var(--gold-dim); }
  .p-statbar__tier--member { background:rgba(99,102,241,0.12); color:#818cf8; border:1px solid rgba(99,102,241,0.25); }
  .p-statbar__tier--featured { background:var(--gold-faint); color:var(--gold); border:1px solid rgba(251,191,36,0.15); }
  .p-statbar__tier--free { background:rgba(255,255,255,0.05); color:var(--text-muted); border:1px solid var(--border); }
  .p-statbar__score {
    display:flex; align-items:center; gap:8px; padding:6px 14px;
    background:var(--gold-faint); border:1px solid rgba(251,191,36,0.12);
    border-radius:10px;
  }
  .p-statbar__score-num {
    font-family:var(--font-display); font-weight:700; font-size:1.25rem; color:var(--gold);
  }
  .p-statbar__score-label {
    font-family:var(--font-display); font-size:0.4rem; font-weight:700;
    letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted);
    line-height:1.3;
  }
  .p-statbar__links { display:flex; gap:8px; margin-left:auto; }
  .p-statbar__link {
    width:34px; height:34px; border-radius:8px; display:flex; align-items:center;
    justify-content:center; background:var(--card); border:1px solid var(--border);
    color:var(--text-muted); font-size:14px; text-decoration:none; transition:all 0.2s;
  }
  .p-statbar__link:hover { border-color:var(--gold-dim); color:var(--gold); }

  /* ── Signal Brief — visual infographic ─── */
  .p-signal {
    display:flex; align-items:center; gap:1.5rem; margin-bottom:3rem;
    background:linear-gradient(135deg,rgba(251,191,36,0.04),rgba(255,255,255,0.01));
    border:1px solid rgba(251,191,36,0.12); border-radius:16px; padding:1.25rem 1.5rem;
    cursor:pointer; transition:border-color 0.2s ease, transform 0.2s ease;
  }
  .p-signal:hover { border-color:rgba(251,191,36,0.3); transform:translateY(-1px); }
  .p-signal__open-hint {
    margin-left:auto; font-size:0.75rem; letter-spacing:0.1em; text-transform:uppercase;
    color:var(--text-muted); display:flex; align-items:center; gap:0.4rem;
  }
  .p-signal__open-hint i { font-size:0.875rem; color:var(--gold); }

  /* ── Authority Drawer — the audit panel ─── */
  .p-drawer-backdrop {
    position:fixed; inset:0; background:rgba(2,6,12,0.85); backdrop-filter:blur(8px);
    opacity:0; pointer-events:none; transition:opacity 0.35s ease; z-index:100;
  }
  .p-drawer-backdrop.is-open { opacity:1; pointer-events:auto; }
  .p-drawer {
    position:fixed; inset:5vh 0 0 0; max-width:920px; margin:0 auto;
    background:linear-gradient(180deg, rgba(8,12,24,0.98), rgba(5,9,20,0.99));
    border:1px solid rgba(251,191,36,0.15); border-radius:24px 24px 0 0;
    transform:translateY(100%); transition:transform 0.45s cubic-bezier(0.32,0.72,0,1);
    overflow-y:auto; box-shadow:0 -20px 60px rgba(0,0,0,0.6); z-index:101;
  }
  .p-drawer.is-open { transform:translateY(0); }

  /* Preview-mode drawer — narrower max-width because the Public Preview
     Card is a single ~600px panel; the wider 920px drawer makes the card
     float in dead backdrop on each side. Applied as a modifier class on
     the .p-drawer element when audienceState='public'. */
  .p-drawer--preview { max-width:640px; }
  .p-drawer__header {
    position:sticky; top:0; display:flex; align-items:center; justify-content:space-between;
    padding:1.5rem 2rem; background:linear-gradient(180deg, rgba(8,12,24,0.98), rgba(8,12,24,0.85));
    border-bottom:1px solid rgba(251,191,36,0.1); z-index:2;
  }
  .p-drawer__title {
    font-family:'Bebas Neue', sans-serif; font-size:1.35rem; letter-spacing:0.08em;
    color:var(--gold); text-transform:uppercase; line-height:1;
  }
  .p-drawer__sub { font-size:0.8125rem; color:var(--text-muted); margin-top:0.25rem; }
  .p-drawer__close {
    background:transparent; border:1px solid rgba(255,255,255,0.15); color:var(--text);
    width:36px; height:36px; border-radius:50%; cursor:pointer; transition:all 0.2s;
    display:flex; align-items:center; justify-content:center;
  }
  .p-drawer__close:hover { border-color:var(--gold); color:var(--gold); }
  .p-drawer__body { padding:1.5rem 2rem 4rem; }

  /* Disclaimer */
  .p-drawer__disclaimer {
    background:linear-gradient(135deg, rgba(251,191,36,0.06), rgba(251,191,36,0.02));
    border-left:3px solid var(--gold); border-radius:8px;
    padding:1.25rem 1.5rem; margin-bottom:2rem; font-size:0.9375rem; line-height:1.6;
    color:rgba(255,255,255,0.75);
  }
  .p-drawer__disclaimer strong { color:var(--gold); display:block; margin-bottom:0.5rem;
    font-size:0.75rem; letter-spacing:0.15em; text-transform:uppercase; }

  /* Hero score row */
  .p-drawer__hero {
    display:flex; align-items:center; gap:1.5rem; margin-bottom:2.5rem;
    padding:1.5rem; background:rgba(255,255,255,0.02); border-radius:12px;
    border:1px solid rgba(251,191,36,0.08);
  }
  .p-drawer__score {
    font-family:'Bebas Neue', sans-serif; font-size:4rem; line-height:1; color:var(--gold);
  }
  .p-drawer__score-meta { flex:1; }
  .p-drawer__score-label {
    font-size:0.6875rem; letter-spacing:0.18em; text-transform:uppercase;
    color:var(--text-muted); margin-bottom:0.25rem;
  }
  .p-drawer__score-name { font-size:1.125rem; font-weight:600; color:var(--text); }
  .p-drawer__score-tier {
    display:inline-block; margin-left:0.5rem; padding:0.15rem 0.6rem; font-size:0.6875rem;
    letter-spacing:0.1em; text-transform:uppercase; border-radius:999px;
    background:rgba(251,191,36,0.12); color:var(--gold); border:1px solid rgba(251,191,36,0.25);
  }

  /* Section pattern */
  .p-drawer__section { margin-bottom:2.5rem; }
  .p-drawer__section-num {
    font-family:'Bebas Neue', sans-serif; color:var(--gold); font-size:1.5rem;
    letter-spacing:0.1em; margin-right:0.5rem; opacity:0.6;
  }
  .p-drawer__section-title {
    font-family:'Bebas Neue', sans-serif; font-size:1.5rem; letter-spacing:0.08em;
    color:var(--text); text-transform:uppercase; line-height:1; margin-bottom:0.25rem;
    display:flex; align-items:center;
  }
  .p-drawer__section-sub {
    font-size:0.8125rem; color:var(--text-muted); margin-bottom:1.25rem;
  }
  .p-drawer__section-sub a { color:var(--gold); text-decoration:underline; text-underline-offset:3px; }

  /* E-E-A-T grid */
  .p-eeat-grid { display:grid; gap:1rem; }
  .p-eeat-row {
    display:grid; grid-template-columns:120px 1fr 80px; gap:1rem; align-items:start;
    padding:1rem; background:rgba(255,255,255,0.02); border-radius:10px;
    border:1px solid rgba(255,255,255,0.04);
  }
  .p-eeat-row__label {
    font-family:'Bebas Neue', sans-serif; font-size:1rem; letter-spacing:0.06em;
    color:var(--gold); text-transform:uppercase; line-height:1.2;
  }
  .p-eeat-row__source { font-size:0.8125rem; color:var(--text-secondary); margin-bottom:0.5rem; }
  .p-eeat-row__bar {
    height:6px; background:rgba(255,255,255,0.06); border-radius:3px; overflow:hidden;
    margin-bottom:0.5rem;
  }
  .p-eeat-row__bar-fill { height:100%; background:linear-gradient(90deg, var(--gold), #fde68a); border-radius:3px; transition:width 1s ease; }
  .p-eeat-row__hint { font-size:0.75rem; color:var(--text-muted); }
  .p-eeat-row__score { text-align:right; font-family:'Bebas Neue', sans-serif; font-size:1.5rem; color:var(--text); }
  .p-eeat-row__score small { font-size:0.875rem; color:var(--text-muted); display:block; }

  /* Citation audit */
  .p-cite {
    background:rgba(255,255,255,0.02); border-radius:10px; padding:1.25rem;
    border:1px solid rgba(255,255,255,0.04); margin-bottom:1rem;
  }
  .p-cite__query {
    font-size:0.95rem; color:var(--text); margin-bottom:0.875rem; font-style:italic;
    padding-left:0.75rem; border-left:2px solid var(--gold);
  }
  .p-cite__results { display:grid; grid-template-columns:repeat(2, 1fr); gap:0.5rem; }
  .p-cite__row {
    display:flex; align-items:center; justify-content:space-between; gap:0.75rem;
    padding:0.6rem 0.875rem; background:rgba(0,0,0,0.25); border-radius:6px;
    font-size:0.8125rem;
  }
  .p-cite__provider { color:var(--text-secondary); font-weight:500; }
  .p-cite__status { font-size:0.75rem; letter-spacing:0.05em; text-transform:uppercase; }
  .p-cite__status--cited { color:#4ade80; }
  .p-cite__status--mentioned { color:var(--gold); }
  .p-cite__status--absent { color:#f87171; }
  .p-cite__status--locked { color:var(--text-muted); }
  .p-cite__rank {
    display:inline-block; width:18px; height:18px; line-height:18px; text-align:center;
    border-radius:50%; background:rgba(74,222,128,0.15); color:#4ade80;
    font-size:0.6875rem; font-weight:700; margin-left:0.4rem;
  }
  .p-cite__overall {
    margin-top:1.5rem; padding:1rem 1.25rem; background:rgba(251,191,36,0.05);
    border-radius:8px; font-size:0.875rem; color:var(--text-secondary); display:flex;
    justify-content:space-between; align-items:center; gap:1rem; flex-wrap:wrap;
  }
  .p-cite__overall strong { color:var(--gold); font-size:1rem; }
  .p-cite__rerun {
    background:transparent; border:1px solid rgba(251,191,36,0.3); color:var(--gold);
    padding:0.5rem 1rem; border-radius:6px; font-size:0.75rem; letter-spacing:0.08em;
    text-transform:uppercase; cursor:pointer; transition:all 0.2s;
  }
  .p-cite__rerun:hover:not(:disabled) { background:rgba(251,191,36,0.1); }
  .p-cite__rerun:disabled { opacity:0.4; cursor:not-allowed; }

  /* Compounding chart */
  .p-compound {
    background:rgba(255,255,255,0.02); border-radius:10px; padding:1.5rem;
    border:1px solid rgba(255,255,255,0.04);
  }
  .p-compound__chart { width:100%; height:140px; margin-bottom:1rem; }
  .p-compound__line { fill:none; stroke:var(--gold); stroke-width:2; }
  .p-compound__area { fill:url(#p-compound-grad); }
  .p-compound__dot { fill:var(--gold); }
  .p-compound__events { font-size:0.8125rem; }
  .p-compound__event {
    display:grid; grid-template-columns:90px 36px 1fr; gap:0.75rem; padding:0.5rem 0;
    border-bottom:1px solid rgba(255,255,255,0.04);
  }
  .p-compound__event:last-child { border-bottom:none; }
  .p-compound__event-date { color:var(--text-muted); }
  .p-compound__event-score { color:var(--gold); font-weight:600; text-align:center; }
  .p-compound__event-label { color:var(--text-secondary); }

  /* Deliverables */
  .p-deliv { display:flex; flex-direction:column; gap:0.5rem; }
  .p-deliv__row {
    display:grid; grid-template-columns:24px 1fr auto; gap:0.875rem; align-items:center;
    padding:0.75rem 1rem; background:rgba(255,255,255,0.02); border-radius:8px;
    border:1px solid rgba(255,255,255,0.04); font-size:0.875rem;
  }
  .p-deliv__icon { width:24px; height:24px; display:flex; align-items:center; justify-content:center; }
  .p-deliv__icon i { font-size:1rem; }
  .p-deliv__icon--shipped i { color:#4ade80; }
  .p-deliv__icon--pending i { color:var(--gold); }
  .p-deliv__icon--inprog i { color:var(--gold); }
  .p-deliv__icon--locked i { color:var(--text-muted); }
  .p-deliv__label { color:var(--text); font-weight:500; }
  .p-deliv__perf { display:block; color:var(--text-muted); font-size:0.75rem; margin-top:0.2rem; }
  .p-deliv__url {
    color:var(--gold); font-size:0.75rem; text-decoration:none;
    border:1px solid rgba(251,191,36,0.25); padding:0.25rem 0.6rem; border-radius:6px;
  }
  .p-deliv__url:hover { background:rgba(251,191,36,0.08); }
  .p-deliv__summary {
    margin-top:1rem; padding:0.875rem 1rem; background:rgba(251,191,36,0.05);
    border-radius:8px; font-size:0.8125rem; color:var(--text-secondary);
  }

  /* Data sources */
  .p-source-list { display:grid; gap:0.5rem; }
  .p-source {
    display:grid; grid-template-columns:160px 1fr auto; gap:1rem; align-items:center;
    padding:0.6rem 1rem; background:rgba(255,255,255,0.02); border-radius:6px;
    font-size:0.8125rem;
  }
  .p-source__name { color:var(--text); font-weight:500; display:flex; align-items:center; gap:0.5rem; }
  .p-source__purpose { color:var(--text-muted); }
  .p-source__cost { color:var(--gold); font-family:monospace; font-size:0.75rem; }
  .p-source__pending {
    color:var(--gold); font-family:monospace; font-size:0.75rem;
    opacity:0.65; font-style:italic;
  }
  .p-source--pending { opacity:0.72; }
  .p-source__badge {
    display:inline-flex; align-items:center; padding:1px 7px;
    border-radius:8px; border:1px solid rgba(251,191,36,0.25);
    background:rgba(251,191,36,0.06); color:var(--gold);
    font-family:monospace; font-size:0.55rem;
    letter-spacing:0.12em; text-transform:uppercase; font-weight:700;
  }
  .p-source-group-label {
    margin:0.875rem 0 0.375rem; padding:0 0.25rem;
    font-family:monospace; font-size:0.625rem; letter-spacing:0.18em;
    text-transform:uppercase; color:var(--text-muted); font-weight:600;
  }
  .p-source-group-label:first-child { margin-top:0; }
  .p-source__total {
    margin-top:0.875rem; padding:0.875rem 1rem; background:rgba(251,191,36,0.05);
    border-radius:6px; font-size:0.8125rem; color:var(--text-secondary);
    display:flex; justify-content:space-between;
  }
  .p-source__total strong { color:var(--gold); }

  /* Locked state for non-owners */
  .p-locked {
    padding:2rem; text-align:center; background:rgba(255,255,255,0.02);
    border-radius:10px; border:1px dashed rgba(251,191,36,0.2);
    color:var(--text-muted); font-size:0.9375rem;
  }

  /* ============================================================
     Public Preview Card — the v1.2 public audience experience.
     Replaces the six-section drawer for non-owners. One screen.
     One decision. Hero score + four shape-only bars + Honest
     Version + two CTAs.
     ============================================================ */
  .p-preview {
    max-width:560px; margin:0 auto;
  }
  .p-preview__hero {
    display:flex; align-items:center; gap:1.25rem;
    padding:1.5rem 1.25rem; margin-bottom:1.5rem;
    background:linear-gradient(135deg, rgba(251,191,36,0.10) 0%, rgba(15,23,42,0.65) 100%);
    border:1px solid rgba(251,191,36,0.28);
    border-left:3px solid var(--gold);
    border-radius:10px;
  }
  .p-preview__score {
    font-family:var(--font-display); font-weight:700;
    font-size:3.5rem; line-height:1; color:var(--gold);
    text-shadow:0 0 24px rgba(251,191,36,0.32);
  }
  .p-preview__score small {
    font-size:1rem; color:var(--text-muted); font-weight:600;
    letter-spacing:0.04em;
  }
  .p-preview__hero-meta { flex:1; min-width:0; }
  .p-preview__hero-label {
    font-family:var(--font-display); font-size:0.6875rem; font-weight:700;
    letter-spacing:0.16em; text-transform:uppercase;
    color:rgba(251,191,36,0.78); margin-bottom:0.375rem;
  }
  .p-preview__hero-name {
    font-family:var(--font-display); font-size:1.375rem; font-weight:700;
    color:#fff; line-height:1.2;
    display:flex; align-items:center; flex-wrap:wrap; gap:0.5rem;
  }
  .p-preview__tier {
    font-size:0.625rem; font-weight:700; letter-spacing:0.1em;
    padding:0.25rem 0.5rem; border-radius:999px;
    background:rgba(251,191,36,0.18); color:var(--gold);
    border:1px solid rgba(251,191,36,0.32);
  }

  .p-preview__shape {
    padding:1.25rem 1.25rem 1.5rem; margin-bottom:1.25rem;
    background:rgba(15,23,42,0.55);
    border:1px solid rgba(255,255,255,0.06);
    border-radius:10px;
  }
  .p-preview__shape-title {
    font-family:var(--font-display); font-size:0.6875rem; font-weight:700;
    letter-spacing:0.16em; text-transform:uppercase;
    color:rgba(255,255,255,0.78); margin-bottom:0.25rem;
  }
  .p-preview__shape-sub {
    font-size:0.75rem; color:var(--text-muted); margin-bottom:1.125rem;
  }
  .p-preview__shape-sub a {
    color:var(--text-secondary); text-decoration:underline;
    text-underline-offset:2px; text-decoration-color:rgba(255,255,255,0.24);
  }
  .p-preview__shape-sub a:hover { color:#fff; }

  /* Bars: solid colored blocks at proportional heights. No surrounding
     track — the bar IS the height. Premium reads as confident shape, not
     "empty rectangle waiting to be filled." Each bar sits on a baseline
     row aligned to the bottom of the bars container. */
  .p-preview__bars {
    display:grid; grid-template-columns:repeat(4, 1fr); gap:1rem;
    height:140px; align-items:end;
    padding:0 0.5rem 0.25rem;
  }
  .p-preview__bar {
    display:flex; flex-direction:column; align-items:center;
    justify-content:flex-end; height:100%;
  }
  .p-preview__bar-fill {
    width:100%; height:0%;
    background:linear-gradient(180deg, var(--gold) 0%, #fde68a 100%);
    border-radius:6px 6px 2px 2px;
    transition:height 1.1s cubic-bezier(0.22, 1, 0.36, 1);
    box-shadow:0 0 16px rgba(251,191,36,0.28),
               0 -2px 0 rgba(255,255,255,0.12) inset;
    min-height:18px;
  }
  .p-preview__bar-label {
    margin-top:0.625rem; font-size:0.6875rem; font-weight:600;
    color:rgba(255,255,255,0.7); text-align:center;
    letter-spacing:0.02em; line-height:1.3;
  }

  .p-preview__disclaimer {
    padding:1rem 1.125rem; margin-bottom:1.25rem;
    background:rgba(15,23,42,0.55);
    border:1px solid rgba(251,191,36,0.16);
    border-left:3px solid var(--gold);
    border-radius:8px;
    font-size:0.875rem; line-height:1.55; color:rgba(255,255,255,0.84);
  }
  .p-preview__disclaimer strong {
    display:block; margin-bottom:0.5rem;
    color:var(--gold);
    font-family:var(--font-display); font-size:0.6875rem; font-weight:700;
    letter-spacing:0.16em; text-transform:uppercase;
  }
  .p-preview__disclaimer strong i { margin-right:0.4rem; }

  /* Pitch copy — the conversion bridge between the disclaimer and the CTAs.
     Promoted from small grey-text to a confident larger pitch line. */
  .p-preview__pitch {
    padding:0.5rem 0.5rem 1.5rem;
    font-size:1rem; line-height:1.55;
    color:rgba(255,255,255,0.92); text-align:center;
    font-weight:500;
  }
  .p-preview__pitch strong {
    color:#fff; font-weight:600;
  }

  .p-preview__cta-row {
    display:flex; gap:0.75rem; justify-content:center;
    margin-bottom:0.75rem;
  }
  .p-preview__cta-primary {
    flex:1; max-width:200px;
    padding:0.875rem 1.25rem; border-radius:8px;
    background:var(--gold); color:#020617;
    font-family:var(--font-display); font-weight:700;
    font-size:0.75rem; letter-spacing:0.12em; text-transform:uppercase;
    text-align:center; text-decoration:none;
    transition:all 0.18s; white-space:nowrap;
  }
  .p-preview__cta-primary:hover { background:#fde68a; transform:translateY(-1px); }
  .p-preview__cta-ghost {
    flex:1; max-width:200px;
    padding:0.875rem 1.25rem; border-radius:8px;
    background:transparent; color:rgba(255,255,255,0.86);
    border:1px solid rgba(255,255,255,0.18);
    font-family:var(--font-display); font-weight:700;
    font-size:0.75rem; letter-spacing:0.12em; text-transform:uppercase;
    text-align:center; text-decoration:none;
    transition:all 0.18s; white-space:nowrap;
  }
  .p-preview__cta-ghost:hover { border-color:var(--gold); color:var(--gold); }
  .p-preview__nudge {
    text-align:center; font-size:0.75rem;
    color:var(--text-muted); padding:0.25rem 0;
  }
  .p-preview__nudge strong { color:rgba(255,255,255,0.84); }

  /* Owner-only "Open in Portal" header chip — small, non-primary,
     gives David a clear path from the inline drawer to the bookmarkable
     portal-native audit at /portal/audit/<slug>. */
  .p-drawer__portal-link {
    display:inline-flex; align-items:center; gap:0.5rem;
    margin-bottom:1.25rem; padding:0.5rem 0.875rem;
    background:rgba(20,184,166,0.08); color:#5eead4;
    border:1px solid rgba(20,184,166,0.22);
    border-radius:6px;
    font-size:0.75rem; font-weight:600; letter-spacing:0.04em;
    text-decoration:none; transition:all 0.18s;
  }
  .p-drawer__portal-link:hover {
    background:rgba(20,184,166,0.14);
    border-color:rgba(20,184,166,0.42);
    color:#99f6e4;
  }
  .p-drawer__portal-link i { font-size:0.6875rem; opacity:0.8; }

  @media (max-width: 520px) {
    .p-preview__hero { flex-direction:column; align-items:flex-start; gap:0.75rem; }
    .p-preview__score { font-size:3rem; }
    .p-preview__bars { gap:0.625rem; height:130px; }
    .p-preview__bar-label { font-size:0.625rem; }
    .p-preview__cta-row { flex-direction:column; }
    .p-preview__cta-primary, .p-preview__cta-ghost { max-width:none; }
  }

  /* Refresh My Authority — the customer's magic button. Sits at the top
     of the drawer for owners only. Same engine the producer's "Refresh
     Authority Stack" calls. One click = signal recompute + citation
     audit + history snapshot. Rate-limited to 1/24h for owners. */
  .p-refresh-stack {
    display:flex; align-items:center; gap:0.875rem;
    padding:0.875rem 1rem; margin-bottom:1.25rem;
    background:linear-gradient(135deg, rgba(251,191,36,0.10) 0%, rgba(20,184,166,0.06) 100%);
    border:1px solid rgba(251,191,36,0.28);
    border-left:3px solid var(--gold);
    border-radius:8px;
  }
  .p-refresh-stack__icon {
    flex-shrink:0; width:32px; height:32px;
    display:flex; align-items:center; justify-content:center;
    background:rgba(251,191,36,0.16); border-radius:50%; color:var(--gold);
    font-size:0.9375rem;
  }
  .p-refresh-stack__body { flex:1; min-width:0; }
  .p-refresh-stack__title {
    font-family:var(--font-display); font-size:0.9375rem; font-weight:700;
    color:#fff; margin-bottom:0.125rem;
  }
  .p-refresh-stack__sub {
    font-size:0.75rem; line-height:1.45; color:rgba(255,255,255,0.65);
  }
  .p-refresh-stack__btn {
    flex-shrink:0; padding:0.6rem 1.125rem;
    background:var(--gold); color:#020617; border:none; border-radius:6px;
    font-family:var(--font-display); font-weight:700; font-size:0.6875rem;
    letter-spacing:0.1em; text-transform:uppercase; cursor:pointer;
    transition:all 0.2s; white-space:nowrap;
  }
  .p-refresh-stack__btn:hover:not(:disabled) { background:#fde68a; }
  .p-refresh-stack__btn:disabled {
    background:rgba(255,255,255,0.08); color:rgba(255,255,255,0.4);
    cursor:not-allowed;
  }
  @media (max-width: 640px) {
    .p-refresh-stack { flex-wrap:wrap; }
    .p-refresh-stack__btn { width:100%; padding:0.75rem; }
  }

  /* Tier-deliverables strip directly under Refresh Stack. Owner-only.
     Reads the canonical pricing line items from docs/digital-twin-spec.md.
     This anchors the AEB as a paid deliverable: "this is what you bought." */
  .p-drawer__tier-promise {
    margin-bottom:1.5rem; padding:1rem 1.125rem;
    background:rgba(15,23,42,0.55);
    border:1px solid rgba(251,191,36,0.16);
    border-radius:8px;
  }
  .p-drawer__tier-promise-title {
    font-family:var(--font-display); font-size:0.6875rem; font-weight:700;
    letter-spacing:0.14em; text-transform:uppercase;
    color:rgba(251,191,36,0.78); margin-bottom:0.25rem;
  }
  .p-drawer__tier-promise-label {
    font-family:var(--font-display); font-size:1.0625rem; font-weight:700;
    color:#fff; margin-bottom:0.625rem;
  }
  .p-drawer__tier-promise-list {
    list-style:none; margin:0; padding:0;
    display:grid; grid-template-columns:1fr 1fr; gap:0.375rem 1rem;
  }
  .p-drawer__tier-promise-list li {
    display:flex; align-items:flex-start; gap:0.5rem;
    font-size:0.8125rem; line-height:1.45;
    color:rgba(255,255,255,0.84);
  }
  .p-drawer__tier-promise-list i {
    color:var(--gold); font-size:0.75rem;
    margin-top:0.25rem; flex-shrink:0;
  }
  @media (max-width: 640px) {
    .p-drawer__tier-promise-list { grid-template-columns:1fr; }
  }

  /* "What this means for you" insights callout. Owner-only. Sits
     under the score hero and translates raw pillar numbers into a
     plain-English next step. Mirrors the cool-toned, premium aesthetic
     of the other AEB sections without competing with the gold accent. */
  .p-drawer__insights {
    margin-bottom:1.75rem; padding:1.125rem 1.25rem;
    background:linear-gradient(135deg, rgba(20,184,166,0.10) 0%, rgba(15,23,42,0.5) 100%);
    border:1px solid rgba(20,184,166,0.32);
    border-left:3px solid #14b8a6;
    border-radius:8px;
  }
  .p-drawer__insights-title {
    font-family:var(--font-display); font-size:0.6875rem; font-weight:700;
    letter-spacing:0.14em; text-transform:uppercase;
    color:#5eead4; margin-bottom:0.5rem;
    display:flex; align-items:center; gap:0.5rem;
  }
  .p-drawer__insights-title i { font-size:0.875rem; }
  .p-drawer__insights-body {
    font-size:0.9375rem; line-height:1.55;
    color:rgba(255,255,255,0.92);
  }
  .p-drawer__insights-body strong { color:#fff; }

  /* Next-snapshot hint at the foot of the compounding chart. Tiny,
     unobtrusive, but signals "this is live" to the page owner. */
  .p-compound__next-hint {
    margin-top:0.75rem; padding:0.5rem 0.75rem;
    background:rgba(20,184,166,0.08);
    border:1px solid rgba(20,184,166,0.22);
    border-radius:6px;
    font-size:0.75rem; color:#5eead4;
    text-align:center;
  }
  .p-compound__next-hint i { margin-right:0.4rem; opacity:0.8; }

  /* Close The Gap — ranked, computed plays under the citation audit.
     Answers the obvious question every owner asks after seeing 3/12:
     "Okay, so what do I actually do about it?" Each play tied to point
     lift, target LLMs, and a deadline. Computed from real pillar gaps. */
  .p-gap__intro {
    margin-bottom:1rem; padding:0.875rem 1rem;
    background:rgba(255,255,255,0.02); border-radius:8px;
    border-left:2px solid rgba(251,191,36,0.4);
    font-size:0.875rem; color:rgba(255,255,255,0.78); line-height:1.5;
  }
  .p-gap__plays {
    display:flex; flex-direction:column; gap:0.75rem;
  }
  .p-gap__play {
    display:grid; grid-template-columns:auto 1fr auto; gap:0.875rem;
    padding:1rem 1.125rem;
    background:rgba(255,255,255,0.025);
    border:1px solid rgba(255,255,255,0.06);
    border-left:3px solid var(--gold);
    border-radius:8px;
    align-items:start;
  }
  .p-gap__play--high { border-left-color:#fbbf24; }
  .p-gap__play--med  { border-left-color:#a3a3a3; }
  .p-gap__play--low  { border-left-color:#6b7280; }
  .p-gap__rank {
    display:flex; align-items:center; justify-content:center;
    width:32px; height:32px; border-radius:50%;
    background:rgba(251,191,36,0.12); color:var(--gold);
    font-family:var(--font-display); font-weight:700; font-size:0.875rem;
    flex-shrink:0;
  }
  .p-gap__body { min-width:0; }
  .p-gap__title {
    font-family:var(--font-display); font-size:0.9375rem; font-weight:700;
    color:#fff; margin-bottom:0.25rem; letter-spacing:0.01em;
  }
  .p-gap__why {
    font-size:0.8125rem; line-height:1.5;
    color:rgba(255,255,255,0.7); margin-bottom:0.5rem;
  }
  .p-gap__meta {
    display:flex; flex-wrap:wrap; gap:0.5rem 0.875rem;
    font-size:0.6875rem; letter-spacing:0.06em; text-transform:uppercase;
    color:rgba(255,255,255,0.55); font-weight:600;
  }
  .p-gap__meta span {
    display:inline-flex; align-items:center; gap:0.35rem;
  }
  .p-gap__meta i { color:rgba(251,191,36,0.6); font-size:0.75rem; }
  .p-gap__meta strong { color:rgba(255,255,255,0.78); font-weight:700; }
  .p-gap__lift {
    display:flex; flex-direction:column; align-items:flex-end;
    flex-shrink:0; min-width:64px; text-align:right;
  }
  .p-gap__lift-num {
    font-family:var(--font-display); font-size:1.375rem; font-weight:700;
    color:var(--gold); line-height:1;
  }
  .p-gap__lift-label {
    font-size:0.625rem; letter-spacing:0.1em; text-transform:uppercase;
    color:rgba(255,255,255,0.5); margin-top:0.25rem; font-weight:700;
  }
  @media (max-width: 640px) {
    .p-gap__play { grid-template-columns:auto 1fr; }
    .p-gap__lift { grid-column:2; align-items:flex-start; flex-direction:row;
                   gap:0.5rem; align-items:baseline; margin-top:0.25rem; }
    .p-gap__lift-label { margin-top:0; }
  }

  /* Starting Line banner — contextualizes the citation audit baseline.
     Visually distinct from the global Honest Version disclaimer: warmer
     teal accent, forward-arrow icon, reads as actionable framing for the
     specific guest's current state, not a product-wide disclaimer. */
  .p-starting-line {
    display:flex; gap:0.875rem; align-items:flex-start;
    padding:1.125rem 1.25rem; margin-bottom:1.25rem;
    background:linear-gradient(135deg, rgba(20,184,166,0.08) 0%, rgba(251,191,36,0.04) 100%);
    border:1px solid rgba(20,184,166,0.22);
    border-left:3px solid #14b8a6;
    border-radius:8px;
  }
  .p-starting-line__icon {
    flex-shrink:0; width:28px; height:28px; display:flex; align-items:center; justify-content:center;
    background:rgba(20,184,166,0.18); border-radius:50%; color:#5eead4; font-size:0.875rem;
  }
  .p-starting-line__body { flex:1; min-width:0; }
  .p-starting-line__title {
    font-family:var(--font-display); font-size:0.75rem; font-weight:700;
    letter-spacing:0.14em; text-transform:uppercase; color:#5eead4;
    margin-bottom:0.25rem;
  }
  .p-starting-line__text {
    font-size:0.875rem; line-height:1.55; color:rgba(255,255,255,0.82);
  }
  .p-starting-line__text strong { color:#fff; font-weight:600; }
  .p-locked i { color:var(--gold); font-size:1.5rem; margin-bottom:0.5rem; display:block; }
  .p-locked__cta {
    display:inline-block; margin-top:1rem; padding:0.6rem 1.25rem;
    background:var(--gold); color:#020617; font-weight:700; font-size:0.8125rem;
    letter-spacing:0.08em; text-transform:uppercase; border-radius:6px;
    text-decoration:none;
  }
  .p-locked__cta:hover { background:#fde68a; }

  /* Two-CTA pattern — 'Sign in' (owner) + 'Get my own' (visitor).
     Used inside .p-locked panels so visitors don't dead-end when they
     hit a sign-in gate on someone else's page. */
  .p-locked__cta-row {
    display:flex; gap:0.625rem; flex-wrap:wrap; justify-content:center;
    margin-top:1rem;
  }
  .p-locked__cta--ghost {
    display:inline-block; padding:0.6rem 1.25rem;
    background:transparent; color:rgba(255,255,255,0.92);
    border:1px solid rgba(255,255,255,0.18);
    font-weight:700; font-size:0.8125rem; letter-spacing:0.08em;
    text-transform:uppercase; border-radius:6px; text-decoration:none;
    transition:border-color 180ms ease, color 180ms ease;
  }
  .p-locked__cta--ghost:hover { border-color:var(--gold); color:var(--gold); }
  .p-locked__nudge {
    display:block; margin-top:0.875rem;
    font-size:0.75rem; color:rgba(255,255,255,0.55); line-height:1.5;
  }
  .p-locked__nudge strong { color:rgba(255,255,255,0.78); font-weight:600; }

  @media (max-width: 768px) {
    .p-drawer { inset:2vh 0 0 0; border-radius:16px 16px 0 0; }
    .p-drawer__header { padding:1rem 1.25rem; }
    .p-drawer__body { padding:1rem 1.25rem 4rem; }
    .p-eeat-row { grid-template-columns:90px 1fr 60px; gap:0.75rem; }
    .p-cite__results { grid-template-columns:1fr; }
    .p-source { grid-template-columns:1fr auto; }
    .p-source__purpose { grid-column:1 / -1; }
  }
  .p-signal__ring-wrap { position:relative; width:72px; height:72px; min-width:72px; }
  .p-signal__ring-svg { width:72px; height:72px; transform:rotate(-90deg); }
  .p-signal__ring-bg { fill:none; stroke:rgba(251,191,36,0.1); stroke-width:5; }
  .p-signal__ring-fill { fill:none; stroke:var(--gold); stroke-width:5; stroke-linecap:round; transition:stroke-dashoffset 1.5s ease; }
  .p-signal__ring-num {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    font-family:var(--font-display); font-weight:700; font-size:1.25rem; color:var(--gold);
  }
  .p-signal__info { flex:1; }
  .p-signal__title {
    font-family:var(--font-display); font-size:0.5rem; font-weight:700;
    letter-spacing:0.18em; text-transform:uppercase; color:var(--gold); margin-bottom:4px;
  }
  .p-signal__desc { font-size:0.8125rem; color:var(--text-muted); line-height:1.5; }
  .p-signal__btn {
    display:inline-flex; align-items:center; gap:6px; padding:10px 20px;
    background:var(--gold-faint); border:1px solid rgba(251,191,36,0.18);
    border-radius:8px; color:var(--gold); font-family:var(--font-display);
    font-size:0.45rem; font-weight:700; letter-spacing:0.12em; text-transform:uppercase;
    text-decoration:none; transition:all 0.3s; cursor:pointer; white-space:nowrap;
  }
  .p-signal__btn:hover { background:rgba(251,191,36,0.12); border-color:var(--gold); }
  .p-signal__btn i { font-size:11px; }

  /* ── Signal Breakdown — dimensional bars ─── */
  .p-signal-breakdown {
    background: rgba(255,255,255,0.03);
    border: 1px solid rgba(251,191,36,0.1);
    border-radius: 16px;
    padding: 2rem 2rem 1.5rem;
    margin-top: 1rem;
  }
  .p-sb-header { margin-bottom: 1.5rem; }
  .p-sb-title {
    font-family: var(--font-heading);
    font-size: 1.125rem;
    color: #fff;
    text-transform: uppercase;
    letter-spacing: 2px;
    margin: 0 0 0.35rem;
  }
  .p-sb-subtitle {
    font-size: 0.8125rem;
    color: var(--text-muted);
    margin: 0;
  }
  .p-sb-bars { display: flex; flex-direction: column; gap: 1rem; }
  .p-sb-bar-row {
    display: flex; align-items: center; gap: 1rem;
  }
  .p-sb-bar-label {
    width: 120px; min-width: 120px;
    font-size: 0.75rem;
    color: rgba(255,255,255,0.7);
    text-transform: uppercase;
    letter-spacing: 1px;
    text-align: right;
  }
  .p-sb-bar-track {
    flex: 1; height: 8px;
    background: rgba(255,255,255,0.06);
    border-radius: 4px;
    overflow: hidden;
    position: relative;
  }
  .p-sb-bar-fill {
    height: 100%; border-radius: 4px;
    transition: width 1.2s cubic-bezier(.22,1,.36,1);
    width: 0;
  }
  .p-sb-bar-fill.high { background: var(--gold); }
  .p-sb-bar-fill.mid { background: #d97706; }
  .p-sb-bar-fill.low { background: rgba(251,191,36,0.25); }
  .p-sb-bar-fill.zero { background: rgba(255,255,255,0.08); width: 100% !important; }
  .p-sb-bar-value {
    width: 36px; min-width: 36px;
    font-size: 0.8125rem;
    font-weight: 700;
    text-align: right;
  }
  .p-sb-bar-value.high { color: var(--gold); }
  .p-sb-bar-value.mid { color: #d97706; }
  .p-sb-bar-value.low { color: rgba(251,191,36,0.5); }
  .p-sb-bar-value.zero { color: rgba(255,255,255,0.25); }
  .p-sb-bar-status {
    font-size: 0.6875rem;
    text-transform: uppercase;
    letter-spacing: 1px;
    width: 80px; min-width: 80px;
  }
  .p-sb-bar-status.high { color: var(--gold); }
  .p-sb-bar-status.mid { color: #d97706; }
  .p-sb-bar-status.low { color: rgba(251,191,36,0.5); }
  .p-sb-bar-status.zero { color: rgba(255,255,255,0.25); }

  /* Improvement actions */
  .p-sb-actions {
    margin-top: 1.5rem;
    border-top: 1px solid rgba(251,191,36,0.1);
    padding-top: 1.25rem;
  }
  .p-sb-actions-header {
    font-family: var(--font-heading);
    font-size: 0.8125rem;
    color: var(--gold);
    text-transform: uppercase;
    letter-spacing: 2px;
    margin-bottom: 1rem;
  }
  .p-sb-actions-header i { margin-right: 6px; }
  .p-sb-actions-list { display: flex; flex-direction: column; gap: 0.75rem; }
  .p-sb-action {
    display: flex; align-items: flex-start; gap: 0.75rem;
    padding: 0.75rem 1rem;
    background: rgba(251,191,36,0.04);
    border: 1px solid rgba(251,191,36,0.08);
    border-radius: 10px;
    transition: border-color .2s;
  }
  .p-sb-action:hover { border-color: rgba(251,191,36,0.25); }
  .p-sb-action-icon {
    width: 28px; height: 28px; min-width: 28px;
    background: rgba(251,191,36,0.1);
    border-radius: 8px;
    display: flex; align-items: center; justify-content: center;
    color: var(--gold); font-size: 12px;
    margin-top: 2px;
  }
  .p-sb-action-text { flex: 1; }
  .p-sb-action-title {
    font-size: 0.8125rem; font-weight: 600;
    color: #fff; margin-bottom: 2px;
  }
  .p-sb-action-desc {
    font-size: 0.75rem;
    color: var(--text-muted);
    line-height: 1.4;
  }
  .p-sb-action-impact {
    font-size: 0.6875rem;
    color: var(--gold);
    font-weight: 600;
    white-space: nowrap;
    margin-top: 2px;
  }
  @media (max-width:600px) {
    .p-sb-bar-row { flex-wrap: wrap; gap: 0.4rem; }
    .p-sb-bar-label { width: 100%; text-align: left; min-width: unset; }
    .p-sb-bar-status { display: none; }
    .p-signal-breakdown { padding: 1.25rem; }
  }

  /* ── Story Chapter — image + quote side by side ── */
  .p-chapter {
    display:grid; grid-template-columns:1fr 1fr; gap:0; margin-bottom:0;
    min-height:420px; overflow:hidden; border-radius:0;
  }
  .p-chapter:nth-child(even) .p-chapter__img { order:2; }
  .p-chapter:nth-child(even) .p-chapter__content { order:1; }
  .p-chapter__img {
    position:relative; overflow:hidden; min-height:420px;
  }
  .p-chapter__img img {
    width:100%; height:100%; object-fit:cover; display:block;
    transition:transform 0.6s ease;
  }
  .p-chapter__img:hover img { transform:scale(1.03); }
  .p-chapter__content {
    display:flex; flex-direction:column; justify-content:center;
    padding:3rem 2.5rem; background:var(--card);
    border:1px solid var(--border);
  }
  .p-chapter__label {
    font-family:var(--font-display); font-size:0.45rem; font-weight:700;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--gold);
    margin-bottom:1rem; opacity:0.7;
  }
  .p-chapter__quote {
    font-size:1.25rem; color:rgba(255,255,255,0.9); line-height:1.6;
    font-style:italic; margin-bottom:1rem; font-weight:300;
  }
  .p-chapter__context {
    font-size:0.875rem; color:var(--text-muted); line-height:1.7;
  }
  .p-chapter__topic {
    display:inline-block; margin-top:1rem; font-family:var(--font-display);
    font-size:0.4rem; font-weight:700; letter-spacing:0.15em; text-transform:uppercase;
    color:rgba(251,191,36,0.6); padding:4px 10px; background:var(--gold-faint);
    border-radius:4px;
  }

  /* ── Video Chapter — full-width cinematic ── */
  .p-video-chapter {
    position:relative; width:100vw; margin-left:calc(-50vw + 50%);
    margin-bottom:0; overflow:hidden; height:500px;
  }
  .p-video-chapter video {
    width:100%; height:100%; object-fit:cover; display:block;
  }
  .p-video-chapter__overlay {
    position:absolute; inset:0;
    background:linear-gradient(to right, rgba(5,9,20,0.85) 0%, rgba(5,9,20,0.3) 50%, rgba(5,9,20,0.85) 100%);
    display:flex; align-items:center; justify-content:center;
  }
  .p-video-chapter__text {
    text-align:center; max-width:600px; padding:2rem;
  }
  .p-video-chapter__label {
    font-family:var(--font-display); font-size:0.5rem; font-weight:700;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--gold);
    margin-bottom:0.75rem;
  }
  .p-video-chapter__quote {
    font-size:1.375rem; color:var(--text); line-height:1.6;
    font-style:italic; font-weight:300;
  }

  /* ── Story Chapters Container ────────────── */
  .p-story {
    width:100vw; margin-left:calc(-50vw + 50%); margin-bottom:3rem;
  }

  /* ── Section title ─────────────────────── */
  /* ── Receipts strip — proof-of-work counters under the AEB ring ── */
  .p-receipts {
    display:grid; grid-template-columns:repeat(3, minmax(0, 1fr));
    border:1px solid var(--border); border-radius:14px;
    background:var(--card);
    margin-bottom:2.5rem;
  }
  @media (max-width: 720px) { .p-receipts { grid-template-columns:1fr; } }
  .p-receipt {
    padding:1.25rem 1.5rem;
    border-right:1px solid var(--border);
    display:flex; flex-direction:column; gap:0.35rem;
  }
  .p-receipt:last-child { border-right:0; }
  @media (max-width: 720px) {
    .p-receipt { border-right:0; border-bottom:1px solid var(--border); }
    .p-receipt:last-child { border-bottom:0; }
  }
  .p-receipt__label {
    font-family:var(--font-display); font-size:0.5rem; font-weight:700;
    letter-spacing:0.28em; text-transform:uppercase; color:var(--text-muted);
  }
  .p-receipt__value {
    font-family:var(--font-display); font-size:1.875rem; font-weight:700;
    color:var(--text); line-height:1.1; letter-spacing:0.01em;
  }
  .p-receipt__value small {
    font-family:var(--font-body); font-size:0.7rem; font-weight:500;
    color:var(--text-muted); margin-left:5px; letter-spacing:0;
  }
  .p-receipt__sub { font-size:0.75rem; color:var(--text-muted); line-height:1.45; }

  .p-section { margin-bottom:2.5rem; }
  .p-section__title {
    font-family:var(--font-display); font-size:0.5625rem; font-weight:700;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--gold);
    margin-bottom:1rem; padding-bottom:0.5rem;
    border-bottom:1px solid rgba(251,191,36,0.1);
  }

  /* ── Appearances — visual cards ─────────── */
  .p-appearances { display:grid; grid-template-columns:1fr 1fr; gap:1rem; }
  .p-appearance {
    background:var(--card); border:1px solid var(--border);
    border-radius:12px; overflow:hidden; text-decoration:none; transition:all 0.3s;
    display:flex; flex-direction:column;
  }
  .p-appearance:hover { border-color:var(--gold-dim); transform:translateY(-2px); }
  .p-appearance__thumb {
    width:100%; aspect-ratio:16/9; background:rgba(255,255,255,0.03);
    overflow:hidden; position:relative;
  }
  .p-appearance__thumb img { width:100%; height:100%; object-fit:cover; transition:transform 0.4s; }
  .p-appearance:hover .p-appearance__thumb img { transform:scale(1.05); }
  .p-appearance__thumb-play {
    position:absolute; inset:0; display:flex; align-items:center; justify-content:center;
    background:rgba(0,0,0,0.35); opacity:0; transition:opacity 0.3s;
  }
  .p-appearance:hover .p-appearance__thumb-play { opacity:1; }
  .p-appearance__thumb-play svg { width:40px; height:40px; fill:var(--gold); }
  .p-appearance__info { padding:1rem 1.25rem; }
  .p-appearance__show {
    font-family:var(--font-display); font-size:0.45rem; font-weight:700;
    letter-spacing:0.15em; text-transform:uppercase; color:var(--text-muted); margin-bottom:4px;
  }
  .p-appearance__segment { font-size:0.9375rem; font-weight:600; color:var(--text); margin-bottom:4px; }
  .p-appearance__date { font-size:0.8125rem; color:var(--text-muted); }

  /* Reel Room — vertical 9:16 short clips, premium TV-network treatment */
  .p-reels {
    display:grid; grid-template-columns:repeat(2, 1fr); gap:1.5rem;
    max-width:760px; margin:0 auto;
  }
  .p-reels--four { grid-template-columns:repeat(4, 1fr); max-width:none; gap:1rem; }
  .p-reels--one { grid-template-columns:1fr; max-width:380px; }
  .p-reel {
    position:relative; cursor:pointer; border-radius:18px; overflow:hidden;
    background:#000; border:1px solid rgba(251,191,36,0.18);
    box-shadow:0 8px 32px rgba(0,0,0,0.4), 0 0 0 1px rgba(255,255,255,0.02) inset;
    transition:transform 0.35s cubic-bezier(0.2,0.8,0.2,1), border-color 0.35s, box-shadow 0.35s;
    aspect-ratio:9/16;
  }
  .p-reel:hover {
    transform:translateY(-4px);
    border-color:rgba(251,191,36,0.55);
    box-shadow:0 20px 50px rgba(0,0,0,0.55), 0 0 32px rgba(251,191,36,0.18);
  }
  .p-reel__poster {
    position:absolute; inset:0; width:100%; height:100%; object-fit:cover;
    transition:transform 0.6s ease, filter 0.4s;
    filter:saturate(0.95) contrast(1.05);
  }
  .p-reel:hover .p-reel__poster { transform:scale(1.04); filter:saturate(1.1) contrast(1.1); }
  .p-reel__scrim {
    position:absolute; inset:0;
    background:linear-gradient(180deg, rgba(0,0,0,0.0) 0%, rgba(0,0,0,0.0) 35%, rgba(2,6,23,0.78) 100%);
    pointer-events:none;
  }
  .p-reel__play {
    position:absolute; top:50%; left:50%; transform:translate(-50%,-50%);
    width:64px; height:64px; border-radius:50%;
    background:rgba(251,191,36,0.95);
    display:flex; align-items:center; justify-content:center;
    box-shadow:0 6px 24px rgba(251,191,36,0.45), 0 0 0 6px rgba(251,191,36,0.12);
    transition:transform 0.3s, box-shadow 0.3s;
  }
  .p-reel:hover .p-reel__play {
    transform:translate(-50%,-50%) scale(1.08);
    box-shadow:0 10px 32px rgba(251,191,36,0.65), 0 0 0 10px rgba(251,191,36,0.18);
  }
  .p-reel__play svg { width:24px; height:24px; fill:#020617; margin-left:3px; }
  .p-reel__chip {
    position:absolute; top:14px; left:14px;
    background:rgba(2,6,23,0.72); backdrop-filter:blur(8px);
    -webkit-backdrop-filter:blur(8px);
    border:1px solid rgba(251,191,36,0.35);
    color:var(--gold); font-family:var(--font-display); font-weight:700;
    font-size:0.5rem; letter-spacing:0.18em; text-transform:uppercase;
    padding:5px 10px; border-radius:6px;
  }
  .p-reel__caption-block {
    position:absolute; left:14px; right:14px; bottom:14px;
    color:#fff; pointer-events:none;
  }
  .p-reel__caption {
    font-size:0.875rem; font-weight:600; line-height:1.35;
    text-shadow:0 1px 6px rgba(0,0,0,0.7);
  }
  .p-reel__sub {
    margin-top:6px; font-size:0.6875rem; color:rgba(255,255,255,0.7);
    letter-spacing:0.06em;
    text-shadow:0 1px 4px rgba(0,0,0,0.7);
  }
  .p-reel.is-live .p-reel__poster,
  .p-reel.is-live .p-reel__scrim,
  .p-reel.is-live .p-reel__play,
  .p-reel.is-live .p-reel__chip,
  .p-reel.is-live .p-reel__caption-block { display:none; }
  .p-reel__iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
  .p-reels__lede {
    color:var(--text-secondary); font-size:0.9375rem; line-height:1.6;
    max-width:560px; margin:0 0 1.5rem;
  }

  /* The Conversation — transcript stack (highlights + collapsed full + standalone link) */
  .p-conv__lede {
    color:var(--text-secondary); font-size:0.9375rem; line-height:1.6;
    max-width:620px; margin:0 0 1.75rem;
  }
  .p-conv__highlights {
    display:grid; grid-template-columns:repeat(2, 1fr); gap:1rem;
  }
  .p-conv__card {
    background:var(--card); border:1px solid var(--border);
    border-radius:12px; padding:1.5rem 1.5rem 1.25rem;
    transition:all 0.3s ease;
  }
  .p-conv__card:hover { border-color:var(--gold-dim); transform:translateY(-2px); }
  .p-conv__topic {
    display:inline-block; font-family:var(--font-display);
    font-size:0.5rem; font-weight:700; letter-spacing:0.18em;
    text-transform:uppercase; color:var(--gold);
    margin-bottom:0.75rem;
  }
  .p-conv__quote {
    color:var(--text); font-size:1rem; line-height:1.55;
    font-weight:500; margin:0;
  }
  .p-conv__quote::before { content:'“'; color:var(--gold); margin-right:2px; }
  .p-conv__quote::after { content:'”'; color:var(--gold); margin-left:2px; }

  .p-conv__expand {
    margin-top:1.5rem; display:flex; gap:0.75rem; align-items:center; flex-wrap:wrap;
  }
  .p-conv__btn {
    display:inline-flex; align-items:center; gap:0.5rem;
    padding:0.625rem 1.25rem; background:transparent;
    border:1px solid rgba(251,191,36,0.35);
    color:var(--gold); font-family:var(--font-display);
    font-weight:700; font-size:0.5625rem; letter-spacing:0.15em;
    text-transform:uppercase; border-radius:8px;
    text-decoration:none; cursor:pointer; transition:all 0.2s;
  }
  .p-conv__btn:hover { background:rgba(251,191,36,0.08); border-color:var(--gold); }
  .p-conv__btn .fa-solid, .p-conv__btn svg { font-size:0.75rem; transition:transform 0.3s; }
  .p-conv__btn[aria-expanded="true"] .p-conv__btn-chev { transform:rotate(180deg); }
  .p-conv__btn-link {
    color:var(--text-muted); border-color:transparent;
    background:transparent; padding:0.625rem 0.5rem;
  }
  .p-conv__btn-link:hover { color:var(--gold); background:transparent; }

  .p-conv__full {
    max-height:0; overflow:hidden;
    transition:max-height 0.6s ease;
  }
  .p-conv__full.is-open { max-height:8000px; }
  .p-conv__full-inner {
    margin-top:1.5rem; padding:1.75rem 1.75rem 1.5rem;
    background:var(--card); border:1px solid var(--border);
    border-radius:12px;
    color:var(--text-secondary); font-size:0.9375rem; line-height:1.7;
  }
  .p-conv__full-inner p { margin:0 0 1rem; }
  .p-conv__full-inner p:last-child { margin-bottom:0; }
  .p-conv__full-foot {
    margin-top:1.25rem; padding-top:1rem;
    border-top:1px solid var(--border);
    font-size:0.8125rem; color:var(--text-muted);
  }

  /* Agent-discovery: small terminal-icon button in the stat bar */
  .p-statbar__agent {
    display:inline-flex; align-items:center; justify-content:center;
    width:32px; height:32px; border-radius:8px;
    background:rgba(251,191,36,0.06);
    border:1px solid rgba(251,191,36,0.2);
    color:var(--gold); transition:all 0.2s;
    text-decoration:none;
  }
  .p-statbar__agent:hover {
    background:rgba(251,191,36,0.14);
    border-color:var(--gold);
    transform:translateY(-1px);
  }
  .p-statbar__agent svg { width:14px; height:14px; }

  /* ── FAQ ────────────────────────────────── */
  .p-faqs { display:flex; flex-direction:column; gap:0.5rem; }
  .p-faq {
    background:var(--card); border:1px solid var(--border); border-radius:10px; overflow:hidden;
  }
  .p-faq__q {
    width:100%; padding:1rem 1.25rem; display:flex; justify-content:space-between;
    align-items:center; gap:1rem; cursor:pointer; background:none; border:none;
    font-size:0.9375rem; font-weight:600; color:var(--text); text-align:left; transition:color 0.2s;
  }
  .p-faq__q:hover { color:var(--gold); }
  .p-faq__chevron { width:16px; height:16px; color:var(--text-muted); flex-shrink:0; transition:transform 0.3s; }
  .p-faq.open .p-faq__chevron { transform:rotate(180deg); }
  .p-faq__a { max-height:0; overflow:hidden; transition:max-height 0.35s ease; }
  .p-faq.open .p-faq__a { max-height:600px; }
  .p-faq__a-inner { padding:0 1.25rem 1rem; font-size:0.875rem; color:var(--text-secondary); line-height:1.7; }

  /* ── Expertise — visual grid ───────────── */
  .p-knows { display:flex; flex-wrap:wrap; gap:0.5rem; }
  .p-knows__item {
    font-size:0.8125rem; padding:0.5rem 1rem; background:var(--card);
    border:1px solid var(--border); border-radius:8px; color:var(--text-muted);
    transition:all 0.2s;
  }
  .p-knows__item:hover { border-color:var(--gold-dim); color:var(--gold); }

  /* ── CTA ────────────────────────────────── */
  .p-cta {
    background:linear-gradient(135deg,rgba(255,255,255,0.02),rgba(251,191,36,0.05));
    border:1px solid rgba(251,191,36,0.15); border-radius:12px; padding:2.5rem;
    text-align:center; margin-top:1rem;
  }
  .p-cta__label {
    font-family:var(--font-display); font-size:0.5rem; font-weight:700;
    letter-spacing:0.2em; text-transform:uppercase; color:var(--text-muted); margin-bottom:0.5rem;
  }
  .p-cta__text { font-size:0.9375rem; color:var(--text-secondary); margin-bottom:1.25rem; line-height:1.6; }
  .p-cta__btn {
    display:inline-flex; align-items:center; gap:0.5rem; padding:0.75rem 1.75rem;
    background:var(--gold); color:var(--bg); font-family:var(--font-display);
    font-weight:700; font-size:0.5625rem; letter-spacing:0.15em; text-transform:uppercase;
    border-radius:8px; text-decoration:none; transition:background 0.2s;
  }
  .p-cta__btn:hover { background:#f59e0b; }

  /* VIP self-serve checkout CTA (Phase 1)
     Sits inside the statbar, just below the tier badge. Only renders
     for non-VIP profiles. One click fires the public-checkout endpoint
     and redirects to Stripe - no /join wizard, no producer involvement. */
  .p-vip-cta {
    margin-top:0.875rem;
    display:flex; flex-direction:column; align-items:flex-start; gap:0.4rem;
  }
  .p-vip-cta__btn {
    display:inline-flex; align-items:center; gap:0.5rem;
    padding:0.625rem 1.125rem;
    background:linear-gradient(135deg, #fbbf24 0%, #f59e0b 100%);
    color:#050914; font-family:var(--font-display);
    font-weight:700; font-size:0.625rem; letter-spacing:0.14em; text-transform:uppercase;
    border:none; border-radius:8px; cursor:pointer;
    box-shadow:0 4px 18px rgba(251,191,36,0.25);
    transition:transform 0.15s ease, box-shadow 0.15s ease, opacity 0.15s ease;
  }
  .p-vip-cta__btn:hover {
    transform:translateY(-1px);
    box-shadow:0 6px 22px rgba(251,191,36,0.35);
  }
  .p-vip-cta__btn:disabled {
    opacity:0.6; cursor:wait; transform:none; box-shadow:none;
  }
  .p-vip-cta__price {
    font-size:0.6875rem;
    letter-spacing:0.06em; font-weight:600; text-transform:none;
    opacity:0.85;
  }
  .p-vip-cta__sub {
    font-size:0.75rem; color:var(--text-muted);
    letter-spacing:0.04em;
  }
  .p-vip-cta__err {
    font-size:0.75rem; color:#fca5a5;
    background:rgba(220,38,38,0.08);
    border:1px solid rgba(220,38,38,0.2);
    padding:0.375rem 0.625rem; border-radius:6px;
    display:none;
  }
  .p-vip-cta__success {
    display:none;
    font-size:0.75rem; color:#86efac;
    background:rgba(34,197,94,0.08);
    border:1px solid rgba(34,197,94,0.2);
    padding:0.5rem 0.75rem; border-radius:6px;
    letter-spacing:0.02em;
  }

  /* Post-payment Calendly lock-in surface.
     Mounts when ?vip=activated is in the URL. Replaces the small
     success banner with a full inline Calendly widget so the buyer's
     next action is picking a date — the highest-leverage moment for
     reducing churn. Width spans the content column on desktop; the
     iframe inside auto-resizes via Calendly's own widget script. */
  .p-vip-calendar {
    margin-top:1.5rem;
    background:linear-gradient(180deg, rgba(251,191,36,0.06) 0%, rgba(251,191,36,0.02) 100%);
    border:1px solid rgba(251,191,36,0.18);
    border-radius:14px;
    padding:1.5rem;
    display:none;
  }
  .p-vip-calendar__head {
    display:flex; align-items:flex-start; gap:0.75rem;
    margin-bottom:1.25rem;
  }
  .p-vip-calendar__icon {
    width:44px; height:44px; border-radius:10px; flex-shrink:0;
    background:linear-gradient(135deg, #fbbf24, #f59e0b);
    display:flex; align-items:center; justify-content:center;
    color:#050914; font-size:1.05rem;
  }
  .p-vip-calendar__title {
    margin:0 0 0.25rem;
    font-family:var(--font-display); font-weight:700;
    font-size:1.05rem; color:var(--text-primary);
    letter-spacing:0.01em;
  }
  .p-vip-calendar__sub {
    margin:0; font-size:0.8125rem; color:var(--text-muted);
    line-height:1.5;
  }
  .p-vip-calendar__sub strong { color:var(--text-primary); }
  .p-vip-calendar__widget {
    min-height:680px; min-width:320px;
    background:rgba(0,0,0,0.2);
    border-radius:10px;
    overflow:hidden;
  }
  .p-vip-calendar__booked {
    display:none;
    padding:1rem 1.25rem;
    background:rgba(34,197,94,0.1);
    border:1px solid rgba(34,197,94,0.25);
    border-radius:8px;
    color:#86efac; font-size:0.875rem;
    line-height:1.55;
  }
  .p-vip-calendar__booked strong { color:#bbf7d0; }

  /* ── Not Found ─────────────────────────── */
  .p-notfound {
    min-height:60vh; display:flex; align-items:center; justify-content:center;
    flex-direction:column; gap:1rem; text-align:center; padding:2rem;
  }
  .p-notfound__title {
    font-family:var(--font-display); font-size:1.5rem; font-weight:700;
    text-transform:uppercase; color:var(--text);
  }
  .p-notfound__text { color:var(--text-muted); }

  /* ── Responsive ────────────────────────── */
  @media (max-width:768px) {
    .p-hero__content { padding:0 24px 48px; }
    .p-statbar { gap:1rem; }
    .p-statbar__links { margin-left:0; width:100%; justify-content:flex-start; }
    .p-chapter { grid-template-columns:1fr; min-height:auto; }
    .p-chapter__img { min-height:260px; }
    .p-chapter:nth-child(even) .p-chapter__img { order:1; }
    .p-chapter:nth-child(even) .p-chapter__content { order:2; }
    .p-chapter__content { padding:2rem 1.5rem; }
    .p-video-chapter { height:350px; }
    .p-signal { flex-direction:column; text-align:center; }
    .p-appearances { grid-template-columns:1fr; }
    .p-reels { grid-template-columns:repeat(2, 1fr); gap:1rem; }
    .p-reels--four { grid-template-columns:repeat(2, 1fr); }
    .p-reels--one { grid-template-columns:1fr; }
    .p-conv__highlights { grid-template-columns:1fr; }
  }

  /* ── Scroll animations ─────────────────── */
  .p-reveal {
    opacity:0; transform:translateY(30px);
    transition:opacity 0.7s ease, transform 0.7s ease;
  }
  .p-reveal.visible { opacity:1; transform:translateY(0); }