/* ── Variables ───────────────────────────────────── */
:root {
  --bg:   #faf8f4;
  --s1:   #ffffff;
  --s2:   #f4f1eb;
  --s3:   #ece8e0;
  --b1:   #e2ddd6;
  --b2:   #cec8be;
  --t1:   #1a1714;
  /* v2.11 (#6): darkened for WCAG-AA contrast on the warm bg (round F / Henk) */
  --t2:   #6b655d;
  --t3:   #8c867d;
  --shadow: 0 1px 4px rgba(26,23,20,.07), 0 4px 16px rgba(26,23,20,.05);
  --shadow2: 0 4px 24px rgba(26,23,20,.12), 0 16px 48px rgba(26,23,20,.08);

  /* Meeting color — overridden per session */
  --mc:   #c1440e;
  --mc2:  #d96030;
  --mcg:  rgba(193,68,14,.09);
  --mcs:  rgba(193,68,14,.15);
}
*, *::before, *::after { margin:0; padding:0; box-sizing:border-box; }
html, body { height:100%; }
body {
  font-family:'Inter',-apple-system,sans-serif;
  background:var(--bg); color:var(--t1);
  -webkit-font-smoothing:antialiased;
}

/* ── Accessibility (v2.11 #6, round F) ───────────── */
/* Visible keyboard focus everywhere (Karim — keyboard-only). :focus-visible so
   mouse users don't see rings, keyboard users always do. */
:focus-visible { outline:2px solid var(--mc); outline-offset:2px; border-radius:6px; }
.inp:focus-visible { outline-offset:0; }
/* Respect reduced-motion: kill the wing-flap, heartbeat pulse and reveals. */
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation-duration:.001ms !important; animation-iteration-count:1 !important; transition-duration:.001ms !important; scroll-behavior:auto !important; }
}

/* ── Screens ─────────────────────────────────────── */
.screen { display:none; min-height:100vh; flex-direction:column; }
.screen.active { display:flex; animation:fadeIn .22s ease; }
@keyframes fadeIn { from{opacity:0;transform:translateY(6px)} to{opacity:1;transform:none} }

/* ── Buttons ─────────────────────────────────────── */
.btn {
  border:none; border-radius:9px; font-family:inherit; font-size:13px; font-weight:500;
  cursor:pointer; transition:all .15s; padding:9px 18px;
  display:inline-flex; align-items:center; justify-content:center; gap:6px;
}
.btn-primary { background:var(--mc); color:#fff; }
.btn-primary:hover { background:var(--mc2); transform:translateY(-1px); box-shadow:0 4px 16px var(--mcs); }
.btn-primary:active { transform:none; box-shadow:none; }
.btn-primary:disabled { opacity:.4; cursor:default; transform:none; box-shadow:none; }
.btn-ghost { background:transparent; border:1px solid var(--b1); color:var(--t2); }
.btn-ghost:hover { border-color:var(--b2); color:var(--t1); }
.btn-ghost:disabled { opacity:.4; cursor:default; }
.btn-sm { padding:6px 13px; font-size:12px; border-radius:7px; }
.btn-lg { padding:13px 30px; font-size:15px; font-weight:600; border-radius:12px; }

/* ── Inputs ──────────────────────────────────────── */
.inp {
  width:100%; border:1.5px solid var(--b1); border-radius:9px;
  padding:10px 13px; font-size:14px; font-family:inherit;
  color:var(--t1); background:var(--s1); transition:border-color .15s; outline:none;
}
.inp:focus { border-color:var(--mc); }
.inp::placeholder { color:var(--t3); }
select.inp { cursor:pointer; appearance:none; }

/* ── Fly mark ────────────────────────────────────── */
.fly-mark { color:var(--mc); flex-shrink:0; }
.fly-mark svg { display:block; }
.fly-mark .wl,.fly-mark .wr { transform-box:fill-box; }
.fly-mark.flapping .wl { animation:fl .2s ease-in-out infinite alternate; transform-origin:85% 50%; }
.fly-mark.flapping .wr { animation:fr .2s ease-in-out infinite alternate; transform-origin:15% 50%; }
@keyframes fl { to{transform:rotate(-22deg) scaleY(.18);} }
@keyframes fr { to{transform:rotate(22deg) scaleY(.18);} }

.fly-svg { display:block; }

/* ══════════════════════════════════
   ONBOARDING SCREEN
══════════════════════════════════ */
#screen-onboarding {
  align-items:center; justify-content:center; min-height:100vh;
  padding:40px 20px; overflow-y:auto;
  background: radial-gradient(ellipse at 50% -5%, rgba(67,56,202,.1) 0%, transparent 55%),
              radial-gradient(ellipse at 20% 100%, rgba(193,68,14,.06) 0%, transparent 50%),
              var(--bg);
}

.ob-wrap {
  max-width:500px; width:100%; display:flex; flex-direction:column;
  align-items:center; text-align:center; gap:0;
}

/* Brand section */
.ob-brand {
  display:flex; flex-direction:column; align-items:center; gap:14px;
  margin-bottom:20px;
  animation: ob-rise .7s cubic-bezier(.34,1.56,.64,1) both;
}
.ob-fly-wrap {
  width:88px; height:88px; border-radius:50%;
  background:var(--s1); box-shadow: 0 4px 28px rgba(67,56,202,.18), var(--shadow);
  display:flex; align-items:center; justify-content:center;
  border:2px solid rgba(67,56,202,.15);
}
.ob-fly-wrap .fly-mark { color:#4338ca; }
.ob-name { font-size:52px; font-weight:800; letter-spacing:-2.5px; color:var(--t1); line-height:1; }
.ob-tagline {
  font-size:17px; line-height:1.55; color:var(--t2); font-weight:400;
  max-width:380px; animation: ob-rise .6s ease .25s both;
}
.ob-tagline strong { color:var(--t1); font-weight:600; }

/* Three-value strip */
.ob-values {
  display:flex; gap:10px; flex-wrap:wrap; justify-content:center;
  margin:20px 0 24px; animation: ob-rise .5s ease .4s both;
}
.ob-val {
  font-size:12px; font-weight:600; padding:5px 13px; border-radius:20px;
  background:var(--s1); border:1.5px solid var(--b1); color:var(--t2);
  display:flex; align-items:center; gap:6px; /* v2.27: flat, no floating shadow */
}
.ob-val-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; }

/* Demo simulation card */
.ob-demo {
  width:100%; background:var(--s1); border-radius:18px;
  padding:18px 18px 16px; border:1px solid var(--b1); box-shadow:var(--shadow2);
  margin-bottom:28px; min-height:200px;
  animation: ob-rise .5s ease .55s both;
  position:relative; overflow:hidden;
}
.ob-demo-label {
  font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1.2px;
  color:var(--t3); margin-bottom:10px; display:flex; align-items:center; gap:6px;
}
.ob-live-dot { width:5px; height:5px; border-radius:50%; background:#22c55e; animation:blink 1.2s infinite; }
.ob-tx-area { min-height:80px; }
.ob-tx-line {
  font-size:12.5px; color:var(--t2); line-height:1.5;
  padding:6px 9px; border-radius:7px; background:var(--s2);
  margin-bottom:4px; animation:fadeIn .3s ease;
  display:flex; gap:8px; align-items:flex-start; text-align:left;
}
.ob-tx-spkr { font-weight:700; font-size:11px; flex-shrink:0; }
.ob-insight-card {
  margin-top:10px; padding:9px 12px;
  background:rgba(124,58,237,.07); border:1.5px solid rgba(124,58,237,.18);
  border-radius:10px; font-size:12px; color:#6d28d9; line-height:1.5;
  text-align:left; opacity:0; transform:translateY(6px);
  transition:opacity .5s ease, transform .5s ease;
}
.ob-insight-card.show { opacity:1; transform:none; }

/* CTAs */
.ob-ctas {
  display:flex; flex-direction:column; align-items:center; gap:14px;
  animation: ob-rise .5s ease .7s both;
}
.ob-cta-hint { font-size:11.5px; color:var(--t3); }
.ob-auth-row { font-size:13px; color:var(--t2); display:flex; gap:16px; flex-wrap:wrap; justify-content:center; margin-top:8px; }
.ob-auth-link { color:var(--mc); font-weight:500; cursor:pointer; transition:opacity .15s; padding:3px 2px; }
.ob-auth-link:hover { opacity:.75; text-decoration:underline; }

@keyframes ob-rise {
  from { opacity:0; transform:translateY(18px); }
  to   { opacity:1; transform:none; }
}

/* ══════════════════════════════════
   AUTH SCREEN
══════════════════════════════════ */
#screen-auth {
  align-items:center; justify-content:center; padding:32px 16px;
  background:radial-gradient(ellipse at 50% -10%, var(--mcg) 0%, transparent 55%), var(--bg);
}
.auth-card {
  background:var(--s1); border-radius:20px; padding:36px;
  width:100%; max-width:400px; box-shadow:var(--shadow2); border:1px solid var(--b1);
}
.auth-brand { display:flex; align-items:center; gap:12px; margin-bottom:32px; }
.auth-brand-name { font-size:26px; font-weight:800; letter-spacing:-.6px; }
.auth-brand-tag { font-size:12px; color:var(--t3); margin-top:3px; }
.auth-title { font-size:19px; font-weight:700; letter-spacing:-.3px; margin-bottom:4px; }
.auth-sub { font-size:13px; color:var(--t2); margin-bottom:22px; }
.auth-field { margin-bottom:11px; }
.auth-field label { display:block; font-size:10.5px; font-weight:600; color:var(--t2); text-transform:uppercase; letter-spacing:.6px; margin-bottom:5px; }
.auth-err { background:rgba(180,30,30,.07); border:1px solid rgba(180,30,30,.2); border-radius:7px; padding:9px 13px; font-size:13px; color:#b41e1e; margin-bottom:14px; display:none; }
.auth-err.show { display:block; }
.auth-divider { display:flex; align-items:center; gap:12px; margin:18px 0; }
.auth-divider span { font-size:11px; color:var(--t3); white-space:nowrap; }
.auth-divider::before,.auth-divider::after { content:''; flex:1; height:1px; background:var(--b1); }
.auth-switch { text-align:center; font-size:13px; color:var(--t2); margin-top:14px; }
.auth-link { color:var(--mc); font-weight:500; cursor:pointer; }
.auth-link:hover { text-decoration:underline; }
.auth-note { margin-top:18px; padding:11px 13px; background:var(--s2); border-radius:9px; font-size:12px; color:var(--t2); line-height:1.6; }
.auth-note a { color:var(--mc); text-decoration:none; }

/* ══════════════════════════════════
   ARCHIVE SCREEN
══════════════════════════════════ */
#screen-archive { background:var(--bg); }
.topbar {
  display:flex; align-items:center; justify-content:space-between;
  padding:0 24px; height:54px; background:var(--s1);
  border-bottom:1px solid var(--b1); flex-shrink:0;
  position:sticky; top:0; z-index:10;
}
.tb-logo { display:flex; align-items:center; gap:9px; font-size:15px; font-weight:800; letter-spacing:-.4px; user-select:none; }
.tb-tag { font-size:11px; font-weight:400; color:var(--t3); }
.tb-right { display:flex; align-items:center; gap:8px; }
.tb-user { font-size:12px; color:var(--t2); }

/* ── Archive hero (change 1) ─────────────────────── */
.archive-hero {
  padding:0 28px;
  border-bottom: 1px solid var(--b1);
  background: var(--s1);
}
.archive-hero-inner {
  max-width:960px; margin:0 auto; padding:40px 0 32px;
  display:flex; align-items:flex-end; justify-content:space-between; gap:20px;
}
.archive-hero-greeting {
  font-size:34px; font-weight:800; letter-spacing:-.8px; line-height:1.1;
  margin-bottom:6px; color:var(--t1);
}
.archive-sub { font-size:14px; color:var(--t2); line-height:1.5; }
.archive-grid { padding:24px 28px 56px; max-width:960px; margin:0 auto; width:100%; display:grid; grid-template-columns:repeat(auto-fill, minmax(240px,1fr)); gap:14px; }

/* Archive cards (change 2) */
.session-card {
  background:var(--s1); border:1px solid var(--b1); border-radius:16px;
  overflow:hidden; cursor:pointer; transition:all .2s;
  box-shadow: 0 2px 8px rgba(26,23,20,.06), 0 0 0 0 transparent;
}
.session-card:hover {
  border-color:var(--b2); transform:translateY(-3px);
  box-shadow: 0 8px 28px rgba(26,23,20,.11), 0 2px 8px rgba(26,23,20,.06);
}
/* Color wash header replaces thin stripe */
.session-card-header {
  height:64px; position:relative; overflow:hidden;
  display:flex; align-items:flex-end; padding:10px 16px;
}
.session-card-dot {
  width:8px; height:8px; border-radius:50%;
  position:absolute; top:14px; left:16px; opacity:.7;
}
.session-card-del {
  margin-left:8px; background:rgba(180,30,30,.0); border:none; border-radius:5px;
  width:22px; height:22px; color:rgba(180,30,30,.4); font-size:16px; line-height:1;
  cursor:pointer; transition:all .15s; flex-shrink:0; display:flex; align-items:center; justify-content:center;
  opacity:0;
}
.session-card:hover .session-card-del { opacity:1; }
.session-card-del:hover { background:rgba(180,30,30,.12); color:#b41e1e; }
.session-card-body { padding:14px 18px 16px; }
.session-card-date { font-size:10.5px; color:var(--t3); text-transform:uppercase; letter-spacing:.6px; margin-bottom:5px; }
.session-card-name { font-size:15px; font-weight:700; letter-spacing:-.3px; margin-bottom:10px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.session-card-tags { display:flex; flex-wrap:wrap; gap:5px; }
.session-tag { font-size:10.5px; font-weight:500; padding:3px 8px; border-radius:20px; border:1px solid var(--b1); color:var(--t2); background:var(--s2); }
.session-dur { font-size:11px; color:var(--t3); margin-top:10px; }

.new-card {
  border:1.5px dashed var(--b1); border-radius:14px; padding:22px 18px;
  cursor:pointer; transition:all .18s; display:flex; flex-direction:column;
  gap:6px; min-height:120px; justify-content:center;
  background:transparent;
}
.new-card:hover { border-color:var(--mc); background:var(--mcg); }
.new-card-title { font-size:15px; font-weight:700; color:var(--t1); }
.new-card-sub { font-size:12px; color:var(--t2); }
.new-card-icon { font-size:22px; margin-bottom:4px; }

/* ══════════════════════════════════
   MEETING SCREEN
══════════════════════════════════ */
/* Change 6: subtle session-color background wash */
#screen-meeting {
  background: linear-gradient(160deg, var(--mcg) 0%, var(--bg) 35%);
}
/* Change 5: meeting bar with session-color accent line */
.meeting-bar {
  display:flex; align-items:center; justify-content:space-between;
  padding:0 20px; height:54px; background:var(--s1);
  border-bottom:3px solid var(--mc); flex-shrink:0; position:sticky; top:0; z-index:10;
  box-shadow: 0 1px 12px rgba(26,23,20,.06);
}
.meeting-bar-left { display:flex; align-items:center; gap:10px; }
.meeting-name-inp {
  font-size:14px; font-weight:600; letter-spacing:-.3px;
  background:transparent; border:none; outline:none; font-family:inherit;
  color:var(--t1); padding:4px 7px; border-radius:6px;
  transition:background .15s; max-width:200px;
}
.meeting-name-inp:hover,.meeting-name-inp:focus { background:var(--s2); }
.meeting-timer { font-size:13px; font-variant-numeric:tabular-nums; color:var(--t2); letter-spacing:.5px; }
.meeting-bar-right { display:flex; align-items:center; gap:8px; }
.cost-tag { font-size:10.5px; color:var(--t3); padding:3px 9px; border:1px solid var(--b1); border-radius:20px; font-variant-numeric:tabular-nums; transition:all .2s; }
.cost-tag.active { color:var(--mc); border-color:var(--mcs); }

/* Color swatch in bar */
.mc-swatch { width:14px; height:14px; border-radius:50%; background:var(--mc); flex-shrink:0; }

/* ── LIVE MODE ────────────────────────────────────── */
#meeting-live { flex:1; display:flex; flex-direction:column; align-items:center; justify-content:center; padding:28px 20px; gap:32px; }

/* Change 3: much larger fly button */
.live-fly-btn {
  width:136px; height:136px; border-radius:50%;
  background:var(--s1); border:2.5px solid var(--b1);
  display:flex; align-items:center; justify-content:center;
  cursor:pointer; transition:all .22s;
  box-shadow: 0 4px 24px rgba(26,23,20,.1), 0 1px 4px rgba(26,23,20,.06);
}
.live-fly-btn:hover { border-color:var(--mc); transform:scale(1.03); box-shadow:0 8px 32px var(--mcs); }
.live-fly-btn.listening {
  border-color:var(--mc); background:var(--mcg);
  animation:hb 2.5s ease-in-out infinite;
}
@keyframes hb {
  0%,100% { box-shadow:0 0 0 0 var(--mcs), 0 4px 24px rgba(26,23,20,.1); }
  50%      { box-shadow:0 0 0 24px transparent, 0 4px 24px rgba(26,23,20,.1); }
}
.live-status { font-size:13px; color:var(--t2); font-weight:500; letter-spacing:.1px; }
.live-status.on { color:var(--mc); font-weight:600; }

/* Recent transcript */
.live-recent { max-width:540px; width:100%; }
.live-recent-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:7px; }
.live-section-label { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--t3); }
/* v2.11 (#1): "Read along" toggle — calm peek ↔ full live caption view */
.live-tx-toggle { font-size:11px; font-weight:600; font-family:inherit; border:1px solid var(--b1); background:transparent; color:var(--t2); border-radius:7px; padding:3px 10px; cursor:pointer; transition:all .15s; }
.live-tx-toggle:hover { border-color:var(--b2); color:var(--t1); }
.live-tx { font-size:13px; line-height:1.55; color:var(--t2); padding:7px 11px; background:var(--s1); border-radius:9px; margin-bottom:5px; border:1px solid var(--b1); box-shadow:var(--shadow); }
.live-tx-ts { font-size:10.5px; color:var(--mc); margin-right:6px; font-variant-numeric:tabular-nums; opacity:.7; }
.live-tx-spkr { font-weight:600; font-size:11px; margin-right:4px; }
.live-tx-interim { opacity:.4; font-style:italic; }
.live-tx-marker { font-weight:600; font-size:11.5px; color:var(--mc); background:var(--mcg); border-color:var(--mcs); box-shadow:none; }
/* expanded = scrollable live transcript ("read along") */
#liveLines.expanded { max-height:42vh; overflow-y:auto; padding:2px 4px 2px 0; scroll-behavior:smooth; }

/* v2.24 (#6): "Catch me up" — collapse a recap to essentials + decisions + actions */
#review-content.catchup .review-section { display:none; }
#review-content.catchup #sec-decisions,
#review-content.catchup #sec-todos { display:block; }

/* v2.24 (Jobs cut): collapsed meeting-type chip on the live screen */
.live-type-chip { display:block; margin:0 auto 6px; font-size:11.5px; font-weight:600; font-family:inherit; border:1px solid var(--b1); background:transparent; color:var(--t2); border-radius:14px; padding:4px 13px; cursor:pointer; transition:all .15s; }
.live-type-chip:hover { border-color:var(--mc); color:var(--mc); }

/* v2.31 (#6): calm "short session" note at the top of a thin recap */
.short-note { font-size:13px; color:var(--t2); background:var(--s2); border-radius:10px; padding:11px 14px; margin-bottom:16px; line-height:1.5; }

/* v2.22 (#5): recap-quality micro-survey */
#recapRating { display:flex; align-items:center; flex-wrap:wrap; gap:8px; margin-top:18px; padding:12px 14px; background:var(--s2); border-radius:10px; font-size:13px; color:var(--t2); }
#recapRating .rr-q { font-weight:600; color:var(--t1); }
#recapRating .rr-btn { font-family:inherit; font-size:12.5px; font-weight:600; border:1px solid var(--b1); background:var(--s1); color:var(--t1); border-radius:8px; padding:5px 12px; cursor:pointer; transition:all .15s; }
#recapRating .rr-btn:hover { border-color:var(--mc); color:var(--mc); }
#rrThanks { color:var(--mc); font-weight:600; }

/* v2.21 (UX): short essence line under the tagline */
.ob-subtag { font-size:13px; font-weight:500; color:var(--t2); text-align:center; margin-top:6px; }
/* v2.21 (UX): dismiss button on dashboard cards (demo) */
.card-x { position:absolute; top:7px; right:9px; background:none; border:none; font-size:16px; line-height:1; color:var(--t3); cursor:pointer; padding:2px 5px; border-radius:6px; font-family:inherit; }
.card-x:hover { color:var(--t1); background:var(--s2); }

/* v2.20 (UX): first-recap next-steps card */
#nextStepsCard { background:var(--s1); border:1.5px solid var(--mcs); border-radius:14px; padding:16px 18px; margin-bottom:14px; box-shadow:var(--shadow); }
.ns-head { font-size:14px; font-weight:700; color:var(--t1); margin-bottom:12px; }
.ns-step { display:flex; align-items:center; gap:12px; padding:9px 0; border-top:1px solid var(--b1); }
.ns-step:first-of-type { border-top:none; }
.ns-num { flex:none; width:22px; height:22px; border-radius:50%; background:var(--mcg); color:var(--mc); font-size:12px; font-weight:700; display:flex; align-items:center; justify-content:center; }
.ns-body { flex:1; min-width:0; }
.ns-body .ns-t { font-size:13.5px; font-weight:600; color:var(--t1); }
.ns-body .ns-d { font-size:12px; color:var(--t2); line-height:1.45; }
.ns-dismiss { background:none; border:none; font-family:inherit; font-size:12.5px; color:var(--t2); cursor:pointer; margin-top:10px; padding:4px 0; }
.ns-dismiss:hover { color:var(--t1); text-decoration:underline; }

/* v2.16 (UX): Meet your fly — first-run welcome */
.meetfly-modal { max-width:460px; text-align:center; }
.meetfly-fly { color:var(--mc); display:flex; justify-content:center; margin-bottom:10px; }
.meetfly-hi { font-size:21px; font-weight:800; letter-spacing:-.4px; color:var(--t1); margin-bottom:8px; }
.meetfly-sub { font-size:13.5px; line-height:1.6; color:var(--t2); max-width:380px; margin:0 auto 20px; }
.meetfly-q { font-size:11px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--t3); margin-bottom:10px; }
.meetfly-grid { display:grid; grid-template-columns:1fr 1fr; gap:9px; margin-bottom:16px; }
.meetfly-opt { display:flex; flex-direction:column; align-items:flex-start; gap:2px; text-align:left; font-family:inherit; cursor:pointer;
  background:var(--s1); border:1.5px solid var(--b1); border-radius:12px; padding:13px 14px; transition:border-color .15s, transform .08s, box-shadow .15s; }
.meetfly-opt:hover { border-color:var(--mc); transform:translateY(-1px); box-shadow:0 4px 16px var(--mcs); }
.meetfly-opt:active { transform:none; }
.meetfly-opt .mf-dot { width:9px; height:9px; border-radius:50%; margin-bottom:5px; }
.meetfly-opt .mf-t { font-size:14px; font-weight:700; color:var(--t1); }
.meetfly-opt .mf-d { font-size:11.5px; color:var(--t2); line-height:1.4; }
.meetfly-skip { background:none; border:none; font-family:inherit; font-size:13px; color:var(--t2); cursor:pointer; padding:6px 10px; border-radius:7px; }
.meetfly-skip:hover { color:var(--t1); text-decoration:underline; }
@media (max-width:420px){ .meetfly-grid { grid-template-columns:1fr; } }

/* v2.12 (#3): Ask your meetings */
.ask-chip { font-size:12px; font-family:inherit; border:1px solid var(--b1); background:var(--s2); color:var(--t2); border-radius:16px; padding:5px 12px; cursor:pointer; transition:all .15s; }
.ask-chip:hover { border-color:var(--mc); color:var(--mc); }
.ask-answer { font-size:13.5px; line-height:1.65; color:var(--t1); background:var(--s2); border-radius:10px; padding:14px 16px; }
.ask-foot { font-size:11px; color:var(--t3); margin-top:8px; text-align:right; }
.ask-empty { font-size:13px; color:var(--t2); padding:8px 0; }

/* v2.11 (#9): open-loops re-engagement banner (archive) */
.open-loops-banner { display:flex; align-items:center; gap:10px; cursor:pointer; padding:12px 16px; margin:0 0 14px; background:var(--mcg); border:1.5px solid var(--mcs); border-radius:12px; font-size:13.5px; color:var(--t1); transition:border-color .15s, transform .08s; }
.open-loops-banner:hover { border-color:var(--mc); }
.open-loops-banner:active { transform:scale(.997); }
.open-loops-banner .ol-dot { color:var(--mc); font-size:10px; line-height:1; }
.open-loops-banner .ol-text { flex:1; line-height:1.45; }
.open-loops-banner .ol-cta { font-weight:600; color:var(--mc); white-space:nowrap; }

/* Whisper */
.fly-whisper {
  max-width:540px; width:100%;
  background:var(--mcg); border:1.5px solid var(--mcs); border-radius:13px;
  padding:13px 16px; display:flex; align-items:flex-start; gap:10px;
  opacity:0; transform:translateY(8px); transition:opacity .4s, transform .4s;
}
.fly-whisper.visible { opacity:1; transform:none; }
.fly-whisper-label { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--mc); margin-bottom:3px; }
.fly-whisper-text { font-size:13px; color:var(--t1); line-height:1.55; }

/* ── REVIEW MODE ──────────────────────────────────── */
#meeting-review { flex:1; overflow-y:auto; padding:28px 20px 60px; }
.review-wrap { max-width:840px; margin:0 auto; }

.review-hero {
  padding:36px 0 40px; border-bottom:1px solid var(--b1); margin-bottom:36px;
}
.review-hero-eyebrow { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1.2px; color:var(--mc); margin-bottom:8px; }
.review-hero-title { font-size:26px; font-weight:800; letter-spacing:-.5px; margin-bottom:6px; }
.review-hero-meta { font-size:13px; color:var(--t2); display:flex; gap:14px; flex-wrap:wrap; }

.review-actions { display:flex; gap:8px; flex-wrap:wrap; margin-bottom:18px; }

/* Review sections (change 9: bigger section labels) */
.review-section { margin-bottom:24px; } /* v2.27: tighter, consistent vertical rhythm */
.review-section-head {
  display:flex; align-items:center; gap:10px;
  font-size:12px; font-weight:700; text-transform:uppercase; letter-spacing:.9px; color:var(--t2);
  margin-bottom:14px; padding-bottom:10px;
  border-bottom:1.5px solid var(--b1);
}
.review-section-accent { width:4px; height:16px; border-radius:2px; background:var(--mc); flex-shrink:0; }


/* Cards (change 7: real shadow elevation) */
.cards-grid { display:grid; grid-template-columns:repeat(auto-fill, minmax(230px,1fr)); gap:10px; }
.rcard {
  background:var(--s1); border:none; border-radius:14px;
  padding:14px 16px; border-left:3px solid var(--mc);
  transition:all .2s; position:relative;
  box-shadow: 0 2px 8px rgba(26,23,20,.07), 0 0 0 1px var(--b1);
}
.rcard:hover {
  transform:translateY(-2px);
  box-shadow: 0 8px 24px rgba(26,23,20,.11), 0 0 0 1px var(--b2);
}
.rcard-label { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--mc); margin-bottom:7px; display:flex; align-items:center; justify-content:space-between; }
.rcard-label-right { font-size:10.5px; font-weight:400; color:var(--t3); }
.rcard-text { font-size:13.5px; line-height:1.58; color:var(--t1); }
.rcard-text[contenteditable] { outline:none; cursor:text; border-radius:4px; padding:2px; transition:background .15s; }
.rcard-text[contenteditable]:hover { background:var(--s2); }
.rcard-text[contenteditable]:focus { background:var(--s2); }
.rcard-meta { margin-top:8px; font-size:11.5px; color:var(--t2); }
.rcard-meta strong { color:var(--t1); font-weight:600; }

/* Notes field */
.notes-field[contenteditable] {
  font-size:14.5px; line-height:1.85; color:var(--t2);
  outline:none; border-radius:8px; padding:12px; transition:background .15s;
  cursor:text;
}
.notes-field[contenteditable]:hover { background:var(--s2); }
.notes-field[contenteditable]:focus { background:var(--s2); }
.notes-field p { margin-bottom:12px; }

/* AI idea cards (change 7 continued) */
.ai-card {
  background:var(--s1); border:none; border-radius:14px;
  padding:16px; transition:all .2s;
  border-left:3px solid var(--mc);
  box-shadow: 0 2px 8px rgba(26,23,20,.07), 0 0 0 1px var(--mc), 0 0 0 1px transparent;
}
.ai-card:hover {
  transform:translateY(-2px);
  box-shadow: 0 8px 28px var(--mcs), 0 0 0 1.5px var(--mc);
}
.ai-card-head { display:flex; align-items:center; justify-content:space-between; margin-bottom:9px; }
.ai-badge { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:var(--mc); }
.ai-not-discussed { font-size:10.5px; color:var(--t3); }
.ai-text[contenteditable] { font-size:13.5px; line-height:1.6; color:var(--t1); outline:none; border-radius:4px; padding:2px; transition:background .15s; cursor:text; }
.ai-text[contenteditable]:hover,.ai-text[contenteditable]:focus { background:var(--s2); }
.ai-reasoning { font-size:12px; line-height:1.5; color:var(--t2); font-style:italic; margin:8px 0 13px; }
.ai-prompt-btn {
  width:100%; background:var(--mcg); border:1.5px solid var(--mcs);
  border-radius:8px; padding:9px 13px; font-size:12.5px; font-weight:500;
  font-family:inherit; color:var(--mc); cursor:pointer; transition:all .15s;
  text-align:left; display:flex; align-items:center; justify-content:space-between;
}
.ai-prompt-btn:hover { background:var(--mcs); }

/* Critique cards (change 7 continued) */
.critique-card {
  background:var(--s1); border:none; border-left:3px solid #c77d2e;
  border-radius:14px; padding:14px 16px; transition:all .2s;
  box-shadow: 0 2px 8px rgba(26,23,20,.07), 0 0 0 1px var(--b1);
}
.critique-card:hover { transform:translateY(-2px); box-shadow:0 8px 24px rgba(199,125,46,.12), 0 0 0 1px var(--b2); }
.critique-label { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.8px; color:#c77d2e; margin-bottom:7px; }
.critique-point { font-size:13.5px; line-height:1.58; color:var(--t1); margin-bottom:8px; }
.critique-suggestion { font-size:12px; line-height:1.5; color:var(--t2); font-style:italic; }

/* ── Essentials block (change 8: cinematischer) ──── */
.essentials-block {
  background:var(--mc); border-radius:20px; padding:28px 30px;
  margin-bottom:32px; color:#fff;
  box-shadow: 0 8px 40px var(--mcs), 0 2px 8px rgba(26,23,20,.1);
}
.essentials-label { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1.4px; opacity:.6; margin-bottom:12px; }
.essentials-headline { font-size:23px; font-weight:800; line-height:1.35; letter-spacing:-.5px; margin-bottom:22px; }
.essentials-top3 { display:flex; flex-direction:column; gap:10px; margin-bottom:0; }
.essentials-item {
  display:flex; align-items:flex-start; gap:14px;
  background:rgba(255,255,255,.13); border-radius:12px; padding:13px 16px;
  font-size:14px; line-height:1.5; backdrop-filter:blur(4px);
}
.essentials-num {
  font-size:28px; font-weight:800; opacity:.5; flex-shrink:0;
  line-height:1; margin-top:-2px; min-width:28px;
}
.essentials-drift {
  margin-top:16px; padding-top:16px; border-top:1px solid rgba(255,255,255,.18);
  font-size:12.5px; opacity:.72; line-height:1.55; font-style:italic;
}

/* ── Section count pill ─────────────────────────── */
.section-count-pill {
  font-size:10.5px; font-weight:600; color:var(--t2);
  background:var(--s2); border-radius:10px; padding:2px 8px;
  border:1px solid var(--b1); margin-left:6px; flex-shrink:0;
}
.review-section.collapsed .section-count-pill { color:var(--mc); background:var(--mcg); border-color:var(--mcs); }

/* ── Relevance indicators ────────────────────────── */
.rel-dot { width:6px; height:6px; border-radius:50%; flex-shrink:0; margin-top:5px; }
.rel-high   { background:var(--mc); }
.rel-medium { background:var(--b2); }
.rel-low    { background:var(--b1); }

/* Low-relevance cards are dimmed */
.rcard.rel-low { opacity:.55; }
.rcard.rel-low:hover { opacity:1; }

/* Tangent badge */
.tangent-badge {
  font-size:10.5px; font-weight:600; text-transform:uppercase; letter-spacing:.6px;
  color:var(--t3); background:var(--s3); border-radius:4px; padding:2px 6px;
  margin-left:6px;
}

/* Reveal animation */
.reveal-item { opacity:0; transform:translateY(14px); transition:opacity .4s ease, transform .4s ease; }
.reveal-item.in { opacity:1; transform:none; }

/* Account nudge */
.account-nudge {
  display:none; padding:14px 16px; background:var(--mcg);
  border:1.5px solid var(--mcs); border-radius:12px;
  font-size:13px; line-height:1.6; color:var(--t1); margin-bottom:20px;
}

/* ══════════════════════════════════
   SETTINGS MODAL
══════════════════════════════════ */
.overlay { position:fixed; inset:0; background:rgba(26,23,20,.5); z-index:200; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(6px); }
.overlay.hidden { display:none; }
.modal { background:var(--s1); border-radius:18px; padding:26px; width:480px; max-width:96vw; box-shadow:var(--shadow2); max-height:92vh; overflow-y:auto; border:1px solid var(--b1); }
.modal-title { font-size:15px; font-weight:700; letter-spacing:-.3px; margin-bottom:2px; }
.modal-sub { font-size:12px; color:var(--t2); margin-bottom:20px; }
.modal-section { font-size:10.5px; font-weight:700; letter-spacing:1px; text-transform:uppercase; color:var(--t3); margin:18px 0 10px; padding-top:16px; border-top:1px solid var(--b1); }
.field { margin-bottom:12px; }
.field-label { display:block; font-size:10.5px; font-weight:600; color:var(--t2); text-transform:uppercase; letter-spacing:.6px; margin-bottom:5px; }
.field-hint { font-size:11.5px; color:var(--t3); margin-top:4px; line-height:1.55; }
.field-hint a { color:var(--mc); text-decoration:none; }
.field-hint a:hover { text-decoration:underline; }
.modal-footer { display:flex; justify-content:flex-end; gap:8px; margin-top:20px; }
.btn-save { background:var(--mc); border:none; color:#fff; padding:9px 22px; border-radius:8px; font-size:13px; font-weight:600; font-family:inherit; cursor:pointer; transition:opacity .15s; }
.btn-save:hover { opacity:.85; }

/* ── Toast ───────────────────────────────────────── */
.toast { position:fixed; bottom:22px; left:50%; transform:translateX(-50%) translateY(8px); background:var(--t1); color:#fff; border-radius:9px; padding:9px 16px; font-size:13px; font-weight:500; white-space:nowrap; box-shadow:var(--shadow2); z-index:999; opacity:0; transition:opacity .2s, transform .2s; pointer-events:none; }
.toast.show { opacity:1; transform:translateX(-50%) translateY(0); }

/* Spinner */
.spin { width:13px; height:13px; border:2px solid rgba(255,255,255,.2); border-top-color:#fff; border-radius:50%; animation:sp .7s linear infinite; }
@keyframes sp { to{transform:rotate(360deg)} }
.spin-c { border:2px solid var(--b1); border-top-color:var(--mc); }

/* ── Card action bar ─────────────────────────────── */
.card-bar {
  display:flex; align-items:center; justify-content:space-between;
  margin-bottom:8px; opacity:0; transition:opacity .15s; min-height:22px;
}
.rcard:hover .card-bar,
.ai-card:hover .card-bar,
.critique-card:hover .card-bar { opacity:1; }
.card-bar-right { display:flex; gap:3px; align-items:center; }
.drag-handle {
  font-size:13px; color:var(--t3); cursor:grab; user-select:none;
  padding:0 3px; letter-spacing:2px; line-height:1;
}
.drag-handle:active { cursor:grabbing; }
.cba {
  font-size:10.5px; font-weight:600; border:none; background:transparent;
  color:var(--t3); cursor:pointer; padding:3px 7px; border-radius:5px;
  font-family:inherit; transition:all .12s; white-space:nowrap; line-height:1.4;
}
.cba:hover { background:var(--s2); color:var(--t1); }
.cba-up:hover  { background:var(--mcg); color:var(--mc); }
.cba-ai:hover  { background:var(--mcg); color:var(--mc); }
.cba-x:hover   { background:rgba(180,30,30,.08); color:#b41e1e; }
.card-body-row { display:flex; gap:8px; align-items:flex-start; }

/* ── Drag states ─────────────────────────────────── */
.rcard.dragging,.ai-card.dragging,.critique-card.dragging { opacity:.35; transform:scale(.98); }
.rcard.drag-over,.ai-card.drag-over,.critique-card.drag-over {
  outline:2px dashed var(--mc); outline-offset:2px;
}

/* ── Claude panel ────────────────────────────────── */
.claude-panel { max-height:0; overflow:hidden; transition:max-height .3s ease; }
.claude-panel.open { max-height:420px; border-top:1px solid var(--b1); margin-top:12px; padding-top:12px; }
.cp-actions { display:flex; gap:5px; flex-wrap:wrap; margin-bottom:10px; }
.cp-btn {
  font-size:11px; font-weight:500; padding:5px 11px; border-radius:7px;
  border:1px solid var(--b1); background:transparent; color:var(--t2);
  font-family:inherit; cursor:pointer; transition:all .12s;
}
.cp-btn:hover { border-color:var(--mc); color:var(--mc); background:var(--mcg); }
.cp-loading { display:flex; align-items:center; gap:8px; font-size:12px; color:var(--t2); padding:6px 0; }
.cp-text { font-size:13px; line-height:1.7; color:var(--t1); white-space:pre-wrap; }
.cp-err  { font-size:12px; color:#b41e1e; }
.cp-row  { display:flex; gap:7px; margin-top:10px; }
.cp-copy-btn,.cp-cls-btn {
  font-size:11px; padding:4px 10px; border-radius:6px;
  border:1px solid var(--b1); background:transparent; color:var(--t2);
  font-family:inherit; cursor:pointer; transition:all .12s;
}
.cp-copy-btn:hover { border-color:var(--mc); color:var(--mc); }

/* ── Dismissed banner ────────────────────────────── */
.dismissed-banner {
  font-size:11.5px; color:var(--t3); text-align:center; padding:9px 14px;
  border:1px dashed var(--b1); border-radius:9px; cursor:pointer;
  margin-top:8px; transition:all .15s;
}
.dismissed-banner:hover { color:var(--mc); border-color:var(--mc); background:var(--mcg); }

/* ── Text highlight ──────────────────────────────── */
mark.fly-hl {
  background:var(--mcg); border-bottom:2px solid var(--mc);
  border-radius:2px; padding:1px 2px; cursor:pointer;
}
mark.fly-hl:hover { background:var(--mcs); }
.hl-toolbar {
  position:fixed; z-index:600; background:var(--t1); color:#fff;
  border-radius:8px; padding:5px 8px; display:none; gap:5px;
  box-shadow:var(--shadow2); transform:translateX(-50%); white-space:nowrap;
  pointer-events:all;
}
.hl-toolbar.show { display:flex; }
.hl-btn {
  font-size:11px; font-weight:500; background:transparent; border:none;
  color:#fff; cursor:pointer; font-family:inherit; padding:2px 5px;
  border-radius:4px; transition:background .12s;
}
.hl-btn:hover { background:rgba(255,255,255,.18); }

/* ══ 0. Onboarding fixes (UX round 2) ═══════════════ */
.no-key-banner {
  background:rgba(180,30,30,.07); border:1.5px solid rgba(180,30,30,.2);
  border-radius:12px; padding:11px 16px; font-size:13px; color:#b41e1e;
  display:flex; align-items:center; justify-content:space-between; gap:12px;
  max-width:520px; width:100%;
}
.no-key-banner.hidden { display:none; }
.no-key-banner a, .no-key-banner .nkb-link {
  font-weight:600; color:#b41e1e; text-decoration:underline; cursor:pointer; white-space:nowrap;
}

.review-loading {
  display:flex; flex-direction:column; align-items:center; justify-content:center;
  padding:60px 0; gap:14px;
}
.review-loading-text { font-size:14px; color:var(--t2); }

/* Meeting name rename hint */
.meeting-name-inp::after { content:'✎'; }
.meeting-name-inp:hover { text-decoration:underline dotted var(--t3); }

/* Settings accordion */
.settings-adv-toggle {
  display:flex; align-items:center; gap:8px; cursor:pointer;
  font-size:11px; font-weight:600; color:var(--t2); padding:14px 0 6px;
  border-top:1px solid var(--b1); margin-top:14px; list-style:none;
  user-select:none; transition:color .15s;
}
.settings-adv-toggle:hover { color:var(--t1); }
.settings-adv-toggle::marker { display:none; }
.settings-adv-toggle::-webkit-details-marker { display:none; }
.settings-adv-chevron { margin-left:auto; font-size:11px; transition:transform .2s; }
details.settings-adv[open] .settings-adv-chevron { transform:rotate(180deg); }
details.settings-adv[open] .settings-adv-toggle { color:var(--t1); }

/* Per-item copy */
.cba-copy:hover { background:var(--s2); color:var(--t1); }

/* ══ Topic filter ═══════════════════════════════════ */
.topic-filter-bar {
  display:flex; gap:6px; flex-wrap:wrap; padding:2px 0 18px; /* v2.27: one calm rhythm */
}
.topic-chip {
  font-size:12px; font-weight:600; padding:5px 13px; border-radius:20px;
  border:1.5px solid var(--b1); background:var(--s1); color:var(--t2);
  cursor:pointer; font-family:inherit; transition:all .14s;
  display:flex; align-items:center; gap:6px; /* v2.27: flat + matches .ob-val */
  white-space:nowrap;
}
.topic-chip:hover { border-color:var(--b2); color:var(--t1); }
.topic-chip.active { color:#fff; border-color:transparent; }
.topic-chip-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }
.rcard.topic-hidden,.ai-card.topic-hidden,.critique-card.topic-hidden { display:none; }
.review-section.all-hidden { opacity:.28; pointer-events:none; }
.review-section.all-hidden .review-section-head { opacity:.6; }

/* Manual topic marker in live view */
.live-topic-row { max-width:520px; width:100%; display:flex; align-items:center; gap:7px; flex-wrap:wrap; }
.live-topic-btn {
  font-size:11.5px; font-weight:500; padding:5px 13px; border-radius:20px;
  border:1.5px dashed var(--b1); background:transparent; color:var(--t2);
  cursor:pointer; font-family:inherit; transition:all .14s;
}
.live-topic-btn:hover { border-color:var(--mc); color:var(--mc); border-style:solid; }
.live-topic-input-wrap { display:flex; gap:6px; align-items:center; flex:1; }
.live-topic-input {
  flex:1; border:1.5px solid var(--b1); border-radius:8px; padding:5px 10px;
  font-size:12.5px; font-family:inherit; color:var(--t1); outline:none; background:var(--bg);
  transition:border-color .15s; min-width:0;
}
.live-topic-input:focus { border-color:var(--mc); }
.current-topic-badge {
  font-size:11px; font-weight:700; padding:4px 11px; border-radius:20px;
  background:var(--s1); border:1.5px solid currentColor; display:flex; align-items:center; gap:5px;
}

/* ══ Section collapse ═══════════════════════════════ */
.section-toggle {
  margin-left:auto; background:transparent; border:none; cursor:pointer;
  color:var(--t3); font-size:13px; padding:2px 6px; border-radius:4px;
  transition:all .2s; font-family:inherit; line-height:1; flex-shrink:0;
}
.section-toggle:hover { background:var(--s2); color:var(--t1); }
.review-section.collapsed .section-toggle { transform:rotate(-90deg); }
.review-section.collapsed > *:not(.review-section-head) { display:none; }

/* ══ 3. Quick add ════════════════════════════════════ */
.quick-add-wrap { max-width:520px; width:100%; }
.qa-toggle {
  width:100%; padding:10px 16px; background:var(--s1); border:1.5px dashed var(--b1);
  border-radius:12px; font-size:13px; font-weight:500; color:var(--t2);
  cursor:pointer; transition:all .18s; font-family:inherit; text-align:left;
  box-shadow:var(--shadow);
}
.qa-toggle:hover,.qa-toggle.open { border-color:var(--mc); color:var(--mc); background:var(--mcg); border-style:solid; }
.qa-panel {
  background:var(--s1); border:1.5px solid var(--b1); border-radius:14px;
  padding:14px; margin-top:6px; box-shadow:var(--shadow2);
  display:none; flex-direction:column; gap:10px;
}
.qa-panel.open { display:flex; animation:fadeIn .15s ease; }
.qa-types { display:flex; gap:5px; flex-wrap:wrap; }
.qa-type {
  font-size:11.5px; font-weight:500; padding:4px 12px; border-radius:20px;
  border:1.5px solid var(--b1); background:transparent; color:var(--t2);
  cursor:pointer; font-family:inherit; transition:all .12s;
}
.qa-type.active { background:var(--mc); color:#fff; border-color:var(--mc); }
.qa-input {
  width:100%; border:1.5px solid var(--b1); border-radius:9px; padding:9px 12px;
  font-size:13.5px; font-family:inherit; color:var(--t1); resize:none; outline:none;
  transition:border-color .15s; background:var(--bg); line-height:1.5;
}
.qa-input:focus { border-color:var(--mc); }
.qa-row { display:flex; gap:8px; align-items:center; }
.qa-owner-inp {
  flex:1; border:1.5px solid var(--b1); border-radius:7px; padding:6px 10px;
  font-size:12px; font-family:inherit; color:var(--t1); outline:none; background:var(--bg);
  transition:border-color .15s;
}
.qa-owner-inp:focus { border-color:var(--mc); }
.qa-owner-inp::placeholder { color:var(--t3); }

/* ══ 4. Meeting type ════════════════════════════════ */
.meeting-type-row { display:flex; gap:5px; flex-wrap:wrap; justify-content:center; }
.mtype-btn {
  font-size:11px; font-weight:600; padding:5px 13px; border-radius:20px;
  border:1.5px solid var(--b1); background:var(--s1); color:var(--t2);
  cursor:pointer; font-family:inherit; transition:all .12s; box-shadow:var(--shadow);
  letter-spacing:.2px;
}
.mtype-btn.active { background:var(--mc); color:#fff; border-color:var(--mc); }
.mtype-btn:hover:not(.active) { border-color:var(--b2); color:var(--t1); }

/* ══ 6. Done cards ══════════════════════════════════ */
.rcard.done { opacity:.55; }
.rcard.done .rcard-text { text-decoration:line-through; color:var(--t2); }
.done-btn {
  width:20px; height:20px; border-radius:50%;
  border:1.5px solid var(--b1); background:transparent;
  cursor:pointer; transition:all .14s; flex-shrink:0;
  display:flex; align-items:center; justify-content:center; color:var(--t3); font-size:10.5px;
}
.done-btn:hover { border-color:var(--green); color:var(--green); background:rgba(34,197,94,.08); }
.rcard.done .done-btn { border-color:var(--green); color:var(--green); background:rgba(34,197,94,.12); }

/* v2.30: Compact view removed (button dropped in v2.26.1) — sections collapse individually. */

/* ══ 8. Archive search ══════════════════════════════ */
.archive-search-wrap { position:relative; }
.archive-search {
  width:260px; border:1.5px solid var(--b1); border-radius:9px;
  padding:8px 12px 8px 34px; font-size:13px; font-family:inherit;
  color:var(--t1); background:var(--s1); outline:none; transition:all .15s;
}
.archive-search:focus { border-color:var(--mc); width:300px; }
.archive-search::placeholder { color:var(--t3); }
.archive-search-icon {
  position:absolute; left:11px; top:50%; transform:translateY(-50%);
  color:var(--t3); font-size:13px; pointer-events:none;
}
.archive-hero-right { display:flex; align-items:center; gap:10px; }

/* ══ 9. Keyboard shortcuts overlay ══════════════════ */
.shortcuts-overlay {
  position:fixed; inset:0; background:rgba(26,23,20,.7);
  z-index:300; display:flex; align-items:center; justify-content:center;
  backdrop-filter:blur(6px);
}
.shortcuts-overlay.hidden { display:none; }
.shortcuts-card {
  background:var(--s1); border-radius:18px; padding:28px 30px;
  width:400px; max-width:94vw; box-shadow:var(--shadow2); border:1px solid var(--b1);
}
.sc-title { font-size:15px; font-weight:700; margin-bottom:18px; display:flex; justify-content:space-between; align-items:center; }
.sc-close { background:transparent; border:none; cursor:pointer; color:var(--t2); font-size:20px; line-height:1; padding:0; }
.sc-row { display:flex; justify-content:space-between; align-items:center; padding:9px 0; border-bottom:1px solid var(--b1); }
.sc-row:last-child { border-bottom:none; }
.sc-keys { display:flex; gap:4px; }
.kbd { background:var(--s2); border:1px solid var(--b1); border-radius:5px; padding:3px 8px; font-size:11px; font-weight:600; color:var(--t2); }
.sc-desc { font-size:13px; color:var(--t2); }
.help-btn {
  background:transparent; border:1px solid var(--b1); border-radius:6px;
  width:26px; height:26px; cursor:pointer; color:var(--t2); font-size:12px;
  font-weight:600; font-family:inherit; transition:all .12s; display:flex; align-items:center; justify-content:center;
}
.help-btn:hover { border-color:var(--b2); color:var(--t1); }

/* ══ Meeting Prep screen ════════════════════════════ */
#screen-prep { background:var(--bg); overflow-y:auto; }
.prep-header { padding:32px 28px 0; max-width:960px; margin:0 auto; }
.prep-greeting { font-size:28px; font-weight:800; letter-spacing:-.5px; margin-bottom:4px; }
.prep-sub { font-size:14px; color:var(--t2); margin-bottom:24px; }

/* Project chips */
.prep-projects { display:flex; gap:7px; flex-wrap:wrap; margin-bottom:28px; }
.prep-proj-chip {
  font-size:12px; font-weight:600; padding:6px 14px; border-radius:20px;
  border:1.5px solid var(--b1); background:var(--s1); cursor:pointer;
  font-family:inherit; transition:all .14s; display:flex; align-items:center; gap:6px;
  box-shadow:var(--shadow);
}
.prep-proj-chip:hover { border-color:var(--b2); }
.prep-proj-chip.active { color:#fff; border-color:transparent; }
.prep-proj-dot { width:7px; height:7px; border-radius:50%; flex-shrink:0; }

/* Prep two-column layout */
.prep-body { display:grid; grid-template-columns:320px 1fr; gap:20px; padding:0 28px 20px; max-width:960px; margin:0 auto; }
@media (max-width:700px) { .prep-body { grid-template-columns:1fr; } }

/* Left column */
.prep-left { display:flex; flex-direction:column; gap:16px; }
.prep-card {
  background:var(--s1); border:1px solid var(--b1); border-radius:14px;
  padding:18px; box-shadow:var(--shadow);
}
.prep-card-title { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1px; color:var(--t3); margin-bottom:12px; display:flex; align-items:center; justify-content:space-between; }
.prep-task {
  display:flex; align-items:flex-start; gap:9px; padding:7px 0;
  border-bottom:1px solid var(--b1); font-size:13px; color:var(--t1); line-height:1.5;
}
.prep-task:last-child { border-bottom:none; }
.prep-task-check {
  width:16px; height:16px; border-radius:4px; border:1.5px solid var(--b1);
  flex-shrink:0; margin-top:2px; cursor:pointer; transition:all .12s;
  display:flex; align-items:center; justify-content:center; font-size:10.5px; color:transparent;
}
.prep-task-check:hover { border-color:var(--green); color:var(--green); }
.prep-task.done .prep-task-check { background:var(--green); border-color:var(--green); color:#fff; }
.prep-task.done .prep-task-text { text-decoration:line-through; opacity:.5; }
.prep-task-text { flex:1; }
.prep-task-owner { font-size:11px; color:var(--mc); font-weight:600; margin-top:2px; }

.prep-question {
  display:flex; align-items:flex-start; gap:8px; padding:6px 0;
  border-bottom:1px solid var(--b1); font-size:13px; color:var(--t2); line-height:1.5;
}
.prep-question:last-child { border-bottom:none; }
.prep-q-mark { color:var(--mc); font-weight:700; flex-shrink:0; }

/* Right column */
.prep-right { display:flex; flex-direction:column; gap:16px; }
.prep-brief-card {
  background:var(--mc); color:#fff; border-radius:16px; padding:24px;
  box-shadow:0 4px 24px var(--mcs);
}
.prep-brief-label { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:1.3px; opacity:.65; margin-bottom:10px; }
.prep-brief-text { font-size:15px; line-height:1.65; font-weight:500; margin-bottom:18px; }
.prep-points { display:flex; flex-direction:column; gap:7px; }
.prep-point {
  background:rgba(255,255,255,.13); border-radius:9px; padding:9px 13px;
  font-size:13px; line-height:1.45; display:flex; align-items:flex-start; gap:8px;
}
.prep-point-num { font-weight:700; opacity:.45; flex-shrink:0; font-size:13px; }

.prep-brief-loading { display:flex; flex-direction:column; align-items:center; gap:12px; padding:32px; opacity:.7; }

/* Prep bottom */
.prep-bottom { max-width:960px; margin:0 auto; padding:0 28px 48px; display:flex; flex-direction:column; gap:14px; }
.prep-topic-inp {
  width:100%; border:1.5px solid var(--b1); border-radius:10px; padding:11px 14px;
  font-size:14px; font-family:inherit; color:var(--t1); background:var(--s1);
  outline:none; transition:border-color .15s; resize:none;
}
.prep-topic-inp:focus { border-color:var(--mc); }
.prep-topic-inp::placeholder { color:var(--t3); }
.prep-start-row { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }

/* Memory indicator in archive */
.memory-badge {
  font-size:10.5px; font-weight:600; padding:3px 8px; border-radius:20px;
  background:var(--mcg); color:var(--mc); border:1px solid var(--mcs);
}

/* ══ Mobile responsive ══════════════════════════════ */
@media (max-width: 640px) {
  /* Onboarding */
  .ob-name { font-size:38px; }
  .ob-tagline { font-size:15px; }
  .ob-values { gap:6px; }
  .ob-val { font-size:11px; padding:4px 10px; }
  .ob-demo { padding:14px; }

  /* Auth */
  .auth-card { padding:28px 20px; border-radius:16px; }

  /* Topbar */
  .tb-tag { display:none; }
  .tb-user { max-width:100px; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }

  /* Archive */
  .archive-hero { padding:0 14px; }
  .archive-hero-inner { flex-direction:column; align-items:flex-start; gap:14px; padding:22px 0 18px; }
  .archive-hero-right { width:100%; flex-direction:column; align-items:stretch; gap:8px; }
  .archive-search { width:100%; }
  .archive-hero-greeting { font-size:24px; letter-spacing:-.4px; }
  .archive-grid { padding:12px 14px 48px; grid-template-columns:1fr; gap:10px; }

  /* Meeting bar */
  .meeting-bar { padding:0 12px; height:50px; }
  .meeting-bar-left { gap:7px; flex:1; min-width:0; overflow:hidden; }
  .meeting-name-inp { max-width:120px; font-size:13px; }
  .meeting-bar-left > span { display:none; } /* hide pencil hint */
  .cost-tag,.help-btn { display:none; }
  .meeting-bar-right { gap:5px; flex-shrink:0; }
  /* v2.46 FIX: the old rule forced #endBtn visible (!important) and hid the
     Leave button on mobile — "End meeting" appeared BEFORE recording started,
     one mistap ended an empty meeting, and the v2.42 one-exit flow was broken
     on the primary platform. JS owns End/Leave visibility; CSS only hides the
     Settings button here (it's beta-hidden anyway). */
  .meeting-bar-right .btn-ghost:not(#endBtn):not(#leaveBtn) { display:none; }

  /* Live view */
  #meeting-live { padding:18px 14px; gap:18px; }
  .live-fly-btn { width:108px; height:108px; }
  .meeting-type-row { justify-content:flex-start; overflow-x:auto; flex-wrap:nowrap; padding-bottom:4px; scrollbar-width:none; -webkit-overflow-scrolling:touch; }
  .meeting-type-row::-webkit-scrollbar { display:none; }
  .quick-add-wrap,.live-recent,.fly-whisper { max-width:100%; }
  .live-topic-row { flex-wrap:wrap; }

  /* Review */
  #meeting-review { padding:14px 12px 60px; }
  .review-wrap { max-width:100%; }
  .review-hero { padding:20px 0 24px; margin-bottom:20px; }
  .review-hero-title { font-size:20px; }
  .review-hero-meta { gap:8px; font-size:12px; }
  .review-actions { flex-wrap:wrap; gap:6px; }
  .review-actions .btn { font-size:12px; padding:7px 11px; }
  .cards-grid { grid-template-columns:1fr !important; }
  .essentials-block { padding:18px 16px; }
  .essentials-headline { font-size:17px; }
  .essentials-item { padding:10px 12px; font-size:13px; }
  .topic-filter-bar { flex-wrap:nowrap; overflow-x:auto; padding-bottom:6px; scrollbar-width:none; }
  .topic-filter-bar::-webkit-scrollbar { display:none; }

  /* Cards always show action bar on mobile (no hover) */
  .card-bar { opacity:1 !important; }
  .cba { font-size:11px; padding:4px 8px; }
  /* v2.29: calmer card toolbar on mobile — keep only "Ask Claude" + dismiss.
     Copy lives in the Ask-Claude panel; promote/drag are desktop niceties. */
  .card-bar .drag-handle, .card-bar .cba-copy, .card-bar .cba-up { display:none; }

  /* Prep screen */
  .prep-body { grid-template-columns:1fr; padding:0 14px 14px; gap:12px; }
  .prep-header { padding:18px 14px 0; }
  .prep-bottom { padding:0 14px 48px; }
  .prep-greeting { font-size:22px; }

  /* Settings */
  .modal { padding:20px 18px; }

  /* Shortcuts overlay */
  .shortcuts-card { padding:22px 20px; }
}

/* Safe area for notched iPhones */
@supports (padding-bottom: env(safe-area-inset-bottom)) {
  #meeting-live  { padding-bottom: calc(18px + env(safe-area-inset-bottom)); }
  #meeting-review{ padding-bottom: calc(60px + env(safe-area-inset-bottom)); }
  .ob-ctas       { padding-bottom: calc(0px + env(safe-area-inset-bottom)); }
}

/* Scrollbar */
::-webkit-scrollbar { width:3px; }
::-webkit-scrollbar-thumb { background:var(--b1); border-radius:2px; }

/* v2.6 (P7): Share-menu items */
.share-mi { display:block; width:100%; text-align:left; border:none; background:transparent; font-family:inherit; font-size:13px; color:var(--t1); padding:8px 10px; border-radius:8px; cursor:pointer; }
.share-mi:hover { background:var(--mcg, rgba(0,0,0,.05)); }
.share-mi:disabled { opacity:.45; cursor:default; }

/* v2.6 (P8b): inline SVG icon set — replaces emoji interface glyphs */
.ico { width:13px; height:13px; vertical-align:-2px; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }

/* v2.34 (tier 3): figures section — one column */
#grid-figures { grid-template-columns:1fr; gap:12px; }

/* v2.35: per-topic recap layout */
.topic-block { margin-bottom:10px; }
.topic-head { display:flex; align-items:center; gap:9px; font-size:15px; font-weight:800; color:var(--t1); letter-spacing:-.2px; margin:8px 0 12px; padding-bottom:9px; border-bottom:2px solid var(--b1); }
.topic-head-dot { width:10px; height:10px; border-radius:50%; flex-shrink:0; }
.topic-sub { font-size:10.5px; font-weight:700; text-transform:uppercase; letter-spacing:.7px; color:var(--t3); margin:14px 0 8px; }

/* ── Situation strip (v2.37) ─────────────────────────────────── */
.sit-strip{display:flex;flex-direction:column;gap:8px;margin:0 0 22px;padding:14px 16px;
  background:#fbf3e4;border:1px solid #efe2c9;border-radius:14px}
.sit-row{display:flex;align-items:baseline;gap:12px}
.sit-tag{flex:0 0 auto;font-size:11px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;
  color:#8a6d28;background:#f3e6c6;border-radius:999px;padding:3px 10px;white-space:nowrap}
.sit-note{font-size:14px;line-height:1.45;color:#5b5347}
@media (max-width:520px){ .sit-row{flex-direction:column;gap:4px} }

/* ── Admin insights (v2.38) ──────────────────────────────────── */
.admin-span{font-size:12.5px;color:var(--t3);margin:0 0 16px;letter-spacing:.02em}
.admin-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px}
.admin-card{background:var(--s1);border:1px solid var(--b1);border-radius:16px;padding:18px 20px}
.admin-card-h{font-size:11px;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:var(--t2);margin-bottom:14px}
.admin-card-note{font-size:12.5px;color:var(--t3);margin:-8px 0 14px;line-height:1.4}
.admin-big{font-size:38px;font-weight:800;color:var(--mc);line-height:1;margin-bottom:12px}
.admin-big-sub{font-size:14px;font-weight:600;color:var(--t2)}
.admin-split{height:10px;border-radius:6px;background:#e9534e22;overflow:hidden;margin-bottom:6px}
.admin-split-up{height:100%;background:#2faf6a;border-radius:6px}
.admin-split-legend{display:flex;justify-content:space-between;font-size:12.5px;color:var(--t2)}
.admin-bar-row{display:flex;align-items:center;gap:10px;margin-bottom:9px}
.admin-bar-label{flex:0 0 120px;font-size:13px;color:var(--t1)}
.admin-bar-track{flex:1;height:9px;background:var(--s3);border-radius:5px;overflow:hidden}
.admin-bar-fill{height:100%;background:var(--mc);border-radius:5px;min-width:2px;transition:width .4s ease}
.admin-bar-warn{background:#d98026}
.admin-bar-val{flex:0 0 auto;font-size:13px;font-weight:700;color:var(--t1);min-width:24px;text-align:right;font-variant-numeric:tabular-nums}
.admin-stat-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(80px,1fr));gap:14px}
.admin-stat-v{font-size:24px;font-weight:800;color:var(--t1);line-height:1}
.admin-stat-l{font-size:11.5px;color:var(--t2);margin-top:4px;line-height:1.3}
.admin-loading{display:flex;align-items:center;gap:10px;justify-content:center;padding:60px 0;color:var(--t2);font-size:14px}
.admin-empty,.admin-empty-sm{color:var(--t2);font-size:13.5px;line-height:1.5}
.admin-empty{text-align:center;padding:50px 20px}

/* ── Action items: checklist table (v2.39, variant A) ───────────── */
.action-list{display:flex;flex-direction:column;background:var(--bg);border:1px solid var(--b1);border-radius:14px;overflow:hidden}
.action-row{display:flex;flex-wrap:wrap;align-items:center;gap:12px;padding:11px 14px;border-bottom:1px solid var(--b1);position:relative}
.action-row:last-child{border-bottom:none}
.action-row.rel-low{opacity:.6}
.action-row.pri-high{box-shadow:inset 3px 0 0 var(--mc)}
.ar-check{flex:0 0 auto;width:18px;height:18px;border:1.5px solid var(--b2);border-radius:5px;background:transparent;cursor:pointer;padding:0;position:relative}
.ar-check:hover{border-color:var(--mc)}
.action-row.done .ar-check{background:var(--mc);border-color:var(--mc)}
.action-row.done .ar-check::after{content:"\2713";color:#fff;font-size:12px;position:absolute;inset:0;display:flex;align-items:center;justify-content:center}
.ar-text{flex:1;min-width:140px;font-size:14px;line-height:1.45;color:var(--t1);outline:none;border-radius:4px}
.ar-text:focus{box-shadow:0 0 0 2px var(--mcs)}
.action-row.done .ar-text{text-decoration:line-through;color:var(--t3)}
.ar-meta{flex:0 0 auto;display:flex;align-items:center;gap:7px}
.ar-owner{font-size:12px;font-weight:600;color:var(--mc);background:var(--mcg);border-radius:999px;padding:3px 9px;white-space:nowrap}
.ar-due{display:inline-flex;align-items:center;gap:4px;font-size:12px;color:var(--t2);background:var(--s2);border-radius:999px;padding:3px 9px;white-space:nowrap}
.ar-actions{flex:0 0 auto;display:flex;gap:2px;opacity:0;transition:opacity .12s}
.action-row:hover .ar-actions,.action-row:focus-within .ar-actions{opacity:1}
.ar-act{display:inline-flex;align-items:center;justify-content:center;border:none;background:transparent;color:var(--t3);cursor:pointer;padding:5px;border-radius:6px;line-height:0}
.ar-act svg{display:block}
.ar-act:hover{background:var(--s3);color:var(--t1)}
.action-row .claude-panel{flex-basis:100%;width:100%;order:9}
@media(max-width:520px){
  .action-row{align-items:flex-start;row-gap:6px}
  .ar-actions{opacity:1;order:6;margin-left:auto}
  .ar-act{padding:7px}
  .ar-meta{order:5;flex-basis:auto;margin-left:30px}
}

/* ── Live "before you start" peek (v2.39 — folded-in prep) ──────── */
.before-start{display:flex;align-items:center;gap:8px;width:fit-content;max-width:92%;margin:4px auto 12px;padding:8px 14px;background:var(--mcg);border:1px solid var(--mcs);border-radius:999px;font-size:13px;color:var(--t1);cursor:pointer;transition:border-color .12s}
.before-start:hover{border-color:var(--mc)}
.bs-dot{width:7px;height:7px;border-radius:50%;background:var(--mc);flex:0 0 auto}
.bs-cta{font-weight:600;color:var(--mc)}

/* ── Refining badge (v2.39 two-stage analysis) ─────────────────── */
.refining-badge{display:flex;align-items:center;gap:9px;justify-content:center;margin:0 0 16px;padding:9px 14px;background:var(--mcg);border:1px solid var(--mcs);border-radius:10px;font-size:12.5px;color:var(--t2)}

/* v2.42 (beta focus): test-week curtain — everything tagged .beta-hide is hidden
   for testers; 01-core removes the class when localStorage fly.dev=1. */
.beta-hide{display:none !important}

/* v2.43: the fly pulses with the room's real volume — the level meter in
   04-speech writes --lvl (0..1) every animation frame while listening. */
.live-fly-btn.listening {
  transform: scale(calc(1 + var(--lvl, 0) * .12));
  transition: transform .09s linear, border-color .22s, background .22s;
}
/* v2.43: live gist — interpreted "what's being discussed" instead of raw lines */
.live-gist {
  background: var(--s1, #fff);
  border: 1.5px solid var(--mcs, rgba(0,0,0,.12));
  border-left: 3px solid var(--mc, #c1440e);
  border-radius: 10px;
  padding: 10px 14px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--t1, #222);
}

/* ══ v2.46 — floating feedback button discipline ══════════════════════
   The pill overlapped the onboarding footer links and recap content on
   mobile. Hidden on onboarding (sibling selector: every screen precedes
   #fbBtn in the DOM); smaller + calmer on small viewports. */
#screen-onboarding.active ~ #fbBtn { display:none; }
@media (max-width: 640px) {
  #fbBtn { padding:5px 10px; font-size:11px; opacity:.85; bottom:14px; right:14px; }
}