/* EF Ops Shell E2 — JC LOCK 11 Oct 2026
   ONE fused topbar (logo+title+rooms) · left section rail · fluid canvas · NO chat dock
   Palette navy + slate (JC: #0f2942 / #1e3a5f primary · slate neutrals)
   Fredoka+Nunito · classic EF-01 on WHITE header
   V2.4.5 / Finance V2.5.5: UNIFIED type scale + rail menu tokens (all rooms inherit)
*/
:root {
  /* —— Palette navy + slate —— */
  --ef-surface: #f8fafc;
  --ef-container: #f1f5f9;
  --ef-primary: #1e3a5f;
  --ef-primary-deep: #0f2942;
  --ef-primary-soft: #dbe4f0;
  --ef-primary-on: #0f2942;
  --ef-outline: #94a3b8;
  --ef-outline-soft: #e2e8f0;
  --ef-line: #94a3b8;
  --ef-ink: #0f172a;
  --ef-muted: #64748b;
  --ef-faint: #64748b;
  --ef-chip: #e2e8f0;
  --ef-ok: #c4eed0;
  --ef-warn: #ffecb3;
  --ef-brand: #1e3a5f;
  --ef-white: #ffffff;

  /* —— Layout chrome —— */
  --ef-rail-w: 200px;
  --ef-rail-w-narrow: 72px;
  --ef-rail-pad: 12px 10px;
  --ef-rail-gap: 4px;
  --ef-rail-pill-pad: 10px 12px;
  --ef-rail-pill-pad-sm: 8px 4px;
  --ef-rail-pill-radius: 12px;
  --ef-rail-pill-min-h: 40px;
  --ef-rail-icon: 16px;
  --ef-brand-col: 180px; /* FIXED — logo+title column; room cards always start here */
  --ef-radius: 16px;
  --ef-topbar-min-h: 64px;

  /* —— UNIFIED type scale (MH = Finance = every room) —— */
  --ef-fs-body: 15px;
  --ef-fs-brand: 15px;       /* header room title */
  --ef-fs-brand-sm: 13px;    /* ≤900px */
  --ef-fs-room: 10px;        /* room-card labels */
  --ef-fs-room-sm: 9px;
  --ef-fs-rail-lab: 10px;    /* rail section label */
  --ef-fs-rail: 13px;        /* rail items desktop */
  --ef-fs-rail-sm: 10px;     /* rail items narrow */
  --ef-fs-sumup-title: 15px;
  --ef-fs-sumup-act: 13px;
  --ef-fs-sumup-why: 12px;
  --ef-fs-sumup-meta: 11px;
  --ef-fs-badge: 11px;       /* ver-pill / profile version */
  --ef-fs-menu: 13px;
  --ef-fs-hint: 9px;
  --ef-fs-foot: 11px;
  --ef-fs-avatar: 11px;

  --ef-font-display: Fredoka, Nunito, system-ui, sans-serif;
  --ef-font-body: Nunito, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
}

body.shell-e,
.shell-e-root {
  max-width: none !important;
  width: 100%;
  margin: 0;
  background: var(--ef-surface);
  color: var(--ef-ink);
  font-family: var(--ef-font-body);
  font-size: var(--ef-fs-body);
  line-height: 1.45;
  font-weight: 600;
}

.shell-e-root,
.wrap.mh-shell.shell-e {
  max-width: none !important;
  width: 100%;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  box-shadow: none !important;
}

/* ========== FUSED TOPBAR — logo + title + room cards · ONE band ========== */
.ef-topbar {
  display: grid;
  grid-template-columns: var(--ef-brand-col) minmax(0, 1fr) auto;
  align-items: center;
  column-gap: 12px;
  padding: 8px 12px;
  padding-top: calc(8px + env(safe-area-inset-top, 0px));
  background: #ffffff;
  border-bottom: 1px solid var(--ef-line);
  flex-shrink: 0;
  z-index: 20;
  order: -1;
  min-height: var(--ef-topbar-min-h);
  box-sizing: border-box;
}
.ef-topbar-brand {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  width: var(--ef-brand-col);
  max-width: var(--ef-brand-col);
  min-width: var(--ef-brand-col);
  overflow: hidden;
}
.ef-topbar .header-logo-btn {
  padding: 0;
  border: 0;
  background: none;
  cursor: pointer;
  flex-shrink: 0;
  line-height: 0;
}
.ef-topbar .header-logo,
.shell-e .header-logo,
.shell-e-root .header-logo {
  width: 28px;
  height: 28px;
  border-radius: 6px;
  background: #fff !important;
  object-fit: contain;
  display: block;
}
.ef-topbar .header-text {
  min-width: 0;
  overflow: hidden;
}
.ef-topbar .header-title {
  font-family: var(--ef-font-display);
  font-weight: 600;
  font-size: var(--ef-fs-brand);
  color: var(--ef-ink);
  line-height: 1.15;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* Version / Signed-in removed from top bar — live only in profile menu */
.ef-topbar .header-sub {
  display: none !important;
}
.ef-topbar-end {
  display: flex;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
  margin-left: 0;
  position: relative;
}
.ef-topbar .header-avatar,
.ef-topbar .mewrap {
  flex-shrink: 0;
}
.ef-topbar .mewrap { position: relative; }
.ef-topbar .header-avatar {
  width: 32px;
  height: 32px;
  border-radius: 999px;
  background: var(--ef-container);
  color: var(--ef-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: var(--ef-fs-avatar);
  font-weight: 800;
  cursor: pointer;
  border: 0;
  padding: 0;
}
.ef-topbar .menu {
  position: absolute;
  right: 0;
  top: calc(100% + 6px);
  background: #fff;
  border-radius: 16px;
  box-shadow: 0 8px 30px rgba(15, 23, 42, 0.15);
  padding: 10px;
  min-width: 220px;
  z-index: 40;
  font-size: var(--ef-fs-menu);
  font-weight: 700;
}
.ef-topbar .menu[hidden] { display: none !important; }
.ef-topbar .menu .mi {
  display: block;
  width: 100%;
  text-align: left;
  padding: 8px 10px;
  border-radius: 10px;
  text-decoration: none;
  border: 0;
  background: none;
  font: inherit;
  cursor: pointer;
  color: inherit;
  box-sizing: border-box;
}
.ef-topbar .menu .mi:hover { background: var(--ef-container); }
.ef-topbar .menu .mv {
  color: var(--ef-faint);
  font-size: var(--ef-fs-badge);
  padding: 4px 10px;
}

/* Legacy .app-header — fused into .ef-topbar */
.shell-e > .app-header:not(.ef-topbar .app-header),
.shell-e-root > .app-header {
  display: none !important;
}

/* Rooms scroll strip — ALWAYS starts at column 2 (fixed after brand col) */
.ef-rooms-bar {
  display: flex;
  flex-wrap: nowrap;
  align-items: stretch;
  gap: 6px;
  padding: 0;
  background: transparent;
  border-bottom: none;
  min-width: 0;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.ef-rooms-bar .ef-rb-hint {
  font-size: var(--ef-fs-hint);
  font-weight: 700;
  color: var(--ef-faint);
  align-self: center;
  margin-left: 2px;
  white-space: nowrap;
  flex-shrink: 0;
}

.ef-room-chip,
.ef-room-card {
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 1px;
  min-width: 58px;
  height: 48px;
  padding: 4px 8px;
  border-radius: 12px;
  border: 1px solid var(--ef-line);
  background: #fff;
  color: var(--ef-muted);
  font-family: var(--ef-font-body);
  font-size: var(--ef-fs-room);
  font-weight: 800;
  text-decoration: none;
  cursor: pointer;
  line-height: 1.1;
  white-space: nowrap;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
  box-sizing: border-box;
  flex-shrink: 0;
}
.ef-room-chip .ico,
.ef-room-card .ico {
  font-size: 14px;
  line-height: 1;
}
.ef-room-chip .ico-img,
.ef-room-card .ico-img {
  width: 22px;
  height: 22px;
  border-radius: 6px;
  object-fit: cover;
  display: block;
  background: transparent;
}
.ef-room-chip:hover,
.ef-room-card:hover { filter: brightness(0.98); box-shadow: 0 2px 6px rgba(15,23,42,.08); }
.ef-room-chip.on,
.ef-room-card.on {
  background: #fff;
  color: var(--ef-primary);
  border-color: var(--ef-primary);
  box-shadow: 0 0 0 2px var(--ef-primary-soft);
}
.ef-room-chip.locked,
.ef-room-card.locked {
  opacity: 0.55;
  cursor: not-allowed;
  background: var(--ef-chip);
  color: var(--ef-faint);
  border-color: var(--ef-outline-soft);
  box-shadow: none;
}
.ef-room-chip .lock,
.ef-room-card .lock {
  font-size: 11px;
}

/* Body row: rail | canvas  (NO chat) */
body.shell-e .app-shell,
.shell-e .app-shell,
.shell-e-root .app-shell {
  display: flex;
  flex: 1;
  min-height: 0;
  overflow: hidden;
  height: calc(100dvh - 72px);
}

/* ========== UNIFIED Section rail (beats app.css / finance.css) ========== */
body.shell-e .section-rail,
.shell-e .section-rail,
.shell-e-root .section-rail {
  display: flex !important;
  flex-direction: column !important;
  width: var(--ef-rail-w) !important;
  align-items: stretch !important;
  padding: var(--ef-rail-pad) !important;
  gap: var(--ef-rail-gap) !important;
  background: var(--ef-container) !important;
  border-right: 1px solid var(--ef-line) !important;
  overflow-y: auto;
  flex-shrink: 0;
  box-sizing: border-box;
}
body.shell-e .section-rail .rail-lab,
.shell-e .section-rail .rail-lab,
.shell-e-root .section-rail .rail-lab {
  font-size: var(--ef-fs-rail-lab) !important;
  font-weight: 800 !important;
  text-transform: uppercase;
  letter-spacing: 0.06em;
  color: var(--ef-faint) !important;
  padding: 4px 10px 8px !important;
  align-self: stretch;
  text-align: left;
}
body.shell-e .rail-pill,
.shell-e .rail-pill,
.shell-e-root .rail-pill,
body.shell-e .section-rail .rail-pill,
.shell-e .section-rail .rail-pill {
  width: auto !important;
  min-height: var(--ef-rail-pill-min-h);
  text-align: left !important;
  padding: var(--ef-rail-pill-pad) !important;
  font-family: var(--ef-font-body) !important;
  font-size: var(--ef-fs-rail) !important;
  font-weight: 800 !important;
  line-height: 1.2;
  border-radius: var(--ef-rail-pill-radius) !important;
  border: none;
  background: #fff;
  color: var(--ef-muted);
  cursor: pointer;
  box-shadow: 0 1px 2px rgba(15, 23, 42, 0.06);
  position: relative;
  transition: background 0.15s, color 0.15s;
  box-sizing: border-box;
}
body.shell-e .rail-pill:hover,
.shell-e .rail-pill:hover {
  background: #fff;
  filter: brightness(0.98);
}
body.shell-e .rail-pill.on,
.shell-e .rail-pill.on,
.shell-e-root .rail-pill.on,
body.shell-e .section-rail .rail-pill.on {
  background: var(--ef-primary-soft) !important;
  color: var(--ef-primary-on) !important;
  box-shadow: none !important;
}
body.shell-e .rail-pill:focus-visible,
.shell-e .rail-pill:focus-visible {
  outline: 2px solid var(--ef-primary);
  outline-offset: 2px;
}
body.shell-e .rail-badge,
.shell-e .rail-badge {
  position: absolute;
  top: -4px;
  right: -4px;
  min-width: 16px;
  height: 16px;
  border-radius: 99px;
  background: var(--ef-primary);
  color: #fff;
  font: 800 9px/16px var(--ef-font-body);
  text-align: center;
  padding: 0 4px;
  box-shadow: 0 0 0 2px #fff;
}

/* Canvas fluid */
body.shell-e .content-pane,
.shell-e .content-pane,
.shell-e-root .content-pane {
  flex: 1;
  min-width: 0;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  background: var(--ef-surface);
}

/* Sumup card */
.ef-sumup-card {
  background: #fff;
  border-radius: var(--ef-radius);
  border: 1px solid var(--ef-outline-soft);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  padding: 16px;
  margin-bottom: 14px;
}
.ef-sumup-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 12px;
}
.ef-sumup-who-row {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}
.ef-sumup-av {
  width: 36px;
  height: 36px;
  border-radius: 10px;
  background: var(--ef-primary-soft);
  color: var(--ef-primary);
  display: flex;
  align-items: center;
  justify-content: center;
  font-weight: 800;
  font-size: 12px;
  overflow: hidden;
  flex-shrink: 0;
}
.ef-sumup-av img { width: 100%; height: 100%; object-fit: cover; display: block; }
.ef-sumup-title {
  font-family: var(--ef-font-display);
  font-weight: 600;
  font-size: var(--ef-fs-sumup-title);
  color: var(--ef-ink);
}
.ef-sumup-sub { font-size: var(--ef-fs-sumup-meta); font-weight: 700; color: var(--ef-muted); }
.ef-sumup-asof { font-size: var(--ef-fs-hint); font-weight: 700; color: var(--ef-faint); white-space: nowrap; }
.ef-sumup-action {
  display: flex;
  gap: 10px;
  align-items: flex-start;
  padding: 10px 0;
  border-top: 1px solid var(--ef-outline-soft);
}
.ef-sumup-prio {
  flex-shrink: 0;
  min-width: 52px;
  max-width: 92px;
  overflow: hidden;
  text-overflow: ellipsis;
  text-align: center;
  font-size: var(--ef-fs-hint);
  font-weight: 800;
  letter-spacing: 0.02em;
  padding: 3px 8px;
  border-radius: 99px;
  background: var(--ef-chip);
  color: var(--ef-muted);
  text-transform: none;
  white-space: nowrap;
}
.ef-sumup-prio.high { background: #fee2e2; color: #991b1b; }
.ef-sumup-prio.med { background: var(--ef-primary-soft); color: var(--ef-primary); }
.ef-sumup-prio.low { background: var(--ef-chip); color: var(--ef-muted); }
.ef-sumup-act-title { font-size: var(--ef-fs-sumup-act); font-weight: 800; color: var(--ef-ink); }
.ef-sumup-act-why { font-size: var(--ef-fs-sumup-why); font-weight: 600; color: var(--ef-muted); margin-top: 2px; }
.ef-sumup-who { font-size: var(--ef-fs-sumup-why); font-weight: 800; color: var(--ef-primary); }
.ef-sumup-foot { font-size: var(--ef-fs-sumup-meta); font-weight: 700; color: var(--ef-faint); margin: 10px 0 0; }

/* Footer */
body.shell-e .app-foot,
.shell-e .app-foot,
.shell-e-root .app-foot {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 14px calc(12px + env(safe-area-inset-bottom, 0px));
  font-size: var(--ef-fs-foot);
  font-weight: 700;
  color: var(--ef-muted);
  background: #fff;
  border-top: 1px solid var(--ef-outline-soft);
  z-index: 15;
}

/* Hide chat dock remnants */
.shell-e .chatpill,
.shell-e .chatbg,
.shell-e .chatpanel,
.shell-e.chat-dock-on .chatpill,
.shell-e.chat-dock-on .chatbg,
.shell-e.chat-dock-on .chatpanel {
  display: none !important;
}

/* Version badge (footer / profile menu only — NOT top bar) */
body.shell-e .ver-pill,
.shell-e .ver-pill,
.shell-e-root .ver-pill {
  display: inline-flex;
  align-items: center;
  padding: 4px 10px;
  border-radius: 99px;
  background: var(--ef-primary-soft);
  color: var(--ef-primary);
  font: 800 var(--ef-fs-badge)/1.2 var(--ef-font-body);
}
.ef-topbar .ver-pill,
.ef-topbar #ver-top {
  display: none !important;
}

@media (max-width: 900px) {
  :root { --ef-brand-col: 140px; }
  body.shell-e .section-rail,
  .shell-e .section-rail,
  .shell-e-root .section-rail {
    width: var(--ef-rail-w-narrow) !important;
    align-items: center !important;
    padding: 10px 0 !important;
  }
  body.shell-e .rail-pill,
  .shell-e .rail-pill,
  .shell-e-root .rail-pill,
  body.shell-e .section-rail .rail-pill {
    width: 56px !important;
    text-align: center !important;
    padding: var(--ef-rail-pill-pad-sm) !important;
    font-size: var(--ef-fs-rail-sm) !important;
    min-height: 0;
  }
  body.shell-e .section-rail .rail-lab,
  .shell-e .section-rail .rail-lab { display: none !important; }
  body.shell-e .app-shell,
  .shell-e .app-shell,
  .shell-e-root .app-shell {
    height: calc(100dvh - 88px);
  }
  .ef-topbar { column-gap: 8px; padding: 6px 8px; padding-top: calc(6px + env(safe-area-inset-top, 0px)); }
  .ef-topbar .header-title { font-size: var(--ef-fs-brand-sm); }
  .ef-room-chip,
  .ef-room-card {
    min-width: 52px;
    height: 44px;
    font-size: var(--ef-fs-room-sm);
  }
  .ef-room-chip .ico-img,
  .ef-room-card .ico-img { width: 20px; height: 20px; }
}
@media (max-width: 560px) {
  :root { --ef-brand-col: 112px; }
  .ef-rooms-bar { gap: 4px; }
  .ef-room-chip,
  .ef-room-card { min-width: 48px; height: 42px; padding: 3px 5px; }
  .ef-rb-hint { display: none; }
}

/* ===== Finance-parity cards (Shell H V2.4.6 / V2.5.6) ===== */
/* Match Finance room card chrome so MH Home/Performance look identical */
body.shell-e .card,
.shell-e .card,
.shell-e-root .card {
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.06);
  border-radius: 16px;
  padding: 14px;
  margin: 0 0 12px;
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.04);
}
body.shell-e .card.flat,
.shell-e .card.flat { box-shadow: none; }
body.shell-e .card-lbl,
.shell-e .card-lbl {
  font-size: 11px;
  font-weight: 700;
  color: var(--ef-muted);
  margin: 0 0 2px;
}
body.shell-e .card-val,
.shell-e .card-val {
  font-family: var(--ef-font-display);
  font-weight: 600;
  font-size: 26px;
  color: var(--ef-ink);
  letter-spacing: -0.02em;
  line-height: 1.15;
  margin: 0;
}
body.shell-e .card-val.sm,
.shell-e .card-val.sm { font-size: 20px; }
body.shell-e .card-h,
.shell-e .card-h {
  font-size: 13px;
  font-weight: 800;
  color: var(--ef-ink);
  margin: 0 0 8px;
}
body.shell-e .note,
.shell-e .note {
  font-size: 12px;
  color: var(--ef-faint);
  font-weight: 700;
  margin-top: 4px;
}
body.shell-e .kpi-grid,
.shell-e .kpi-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0 0 12px;
}
body.shell-e .kpi-grid .card,
.shell-e .kpi-grid .card { margin: 0; }
body.shell-e .perf-grid,
.shell-e .perf-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 10px;
  margin: 0 0 12px;
}
body.shell-e .perf-card,
.shell-e .perf-card { margin: 0; }
body.shell-e .perf-card-top,
.shell-e .perf-card-top {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 6px;
  margin-bottom: 2px;
}
body.shell-e .perf-card-top .card-lbl { margin: 0; flex: 1; }
body.shell-e .perf-card.tone-ok { border-top: 3px solid #81c784; }
body.shell-e .perf-card.tone-watch { border-top: 3px solid #ffb74d; }
body.shell-e .perf-card.tone-risk { border-top: 3px solid #e57373; }
body.shell-e .perf-card.tone-stub,
.shell-e .perf-card.tone-stub { border-top: 3px solid #94a3b8; opacity: 0.92; }
/* Opinion card — same chrome as Finance sumup sibling */
.ef-opinion-card {
  background: #fff;
  border-radius: var(--ef-radius);
  border: 1px solid var(--ef-outline-soft);
  box-shadow: 0 1px 3px rgba(15, 23, 42, 0.06);
  padding: 16px;
  margin-bottom: 14px;
  border-left: 3px solid var(--ef-primary);
}
.ef-opinion-card .ef-opinion-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 10px;
}
.ef-opinion-card .ef-opinion-title {
  font-family: var(--ef-font-display);
  font-weight: 600;
  font-size: var(--ef-fs-sumup-title);
  color: var(--ef-ink);
}
.ef-opinion-card .ef-opinion-sub {
  font-size: var(--ef-fs-sumup-meta);
  font-weight: 700;
  color: var(--ef-muted);
}
.ef-opinion-card .ef-opinion-body {
  font-size: var(--ef-fs-sumup-act);
  font-weight: 600;
  color: var(--ef-ink);
  line-height: 1.45;
  margin: 0;
}
.ef-opinion-card .ef-opinion-points {
  margin: 10px 0 0;
  padding: 0;
  list-style: none;
}
.ef-opinion-card .ef-opinion-points li {
  font-size: var(--ef-fs-sumup-why);
  font-weight: 600;
  color: var(--ef-muted);
  padding: 6px 0;
  border-top: 1px solid var(--ef-outline-soft);
  line-height: 1.4;
}
body.shell-e .chip.ok { background: #e8f5e9; color: #1b5e20; }
body.shell-e .chip.rose { background: #fce8e6; color: #8c1d18; }
body.shell-e .chip.amber { background: #fff3e0; color: #7a4f01; }
body.shell-e .chip.blue { background: #e3f2fd; color: #1a3a6b; }
body.shell-e .chip.stub { background: #e2e8f0; color: #475569; }
@media (max-width: 560px) {
  body.shell-e .perf-grid,
  body.shell-e .kpi-grid { grid-template-columns: 1fr; }
}


/* —— Home freshness / attribution (Excel check) —— */
.ef-fresh-card {
  background: #fff;
  border: 1px solid var(--ef-outline-soft, #e2e8f0);
  border-radius: 16px;
  padding: 14px 16px;
  margin: 0 0 14px;
  box-shadow: 0 1px 2px rgba(15, 41, 66, 0.04);
}
.ef-fresh-head {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 10px;
  margin-bottom: 8px;
}
.ef-fresh-title {
  font-size: var(--ef-fs-sumup-title, 15px);
  font-weight: 800;
  color: var(--ef-ink, #0f172a);
}
.ef-fresh-sub, .ef-fresh-scope, .ef-fresh-note, .ef-fresh-dash, .ef-fresh-foot, .ef-fresh-empty {
  font-size: var(--ef-fs-sumup-why, 12px);
  font-weight: 600;
  color: var(--ef-muted, #64748b);
}
.ef-fresh-scope { margin: 0 0 8px; }
.ef-fresh-list { display: flex; flex-direction: column; gap: 8px; }
.ef-fresh-row {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  gap: 8px 12px;
  padding: 10px 12px;
  border-radius: 12px;
  background: var(--ef-container, #f1f5f9);
  border-left: 3px solid var(--ef-outline, #94a3b8);
}
.ef-fresh-row.status-ok { border-left-color: #16a34a; }
.ef-fresh-row.status-stale { border-left-color: #d97706; }
.ef-fresh-row.status-missing { border-left-color: #dc2626; }
.ef-fresh-file { font-size: 13px; font-weight: 800; color: var(--ef-ink, #0f172a); }
.ef-fresh-meta { display: flex; flex-wrap: wrap; gap: 8px; align-items: center; }
.ef-fresh-when, .ef-fresh-who {
  font-size: 11px; font-weight: 700; color: var(--ef-primary, #1e3a5f);
  background: var(--ef-primary-soft, #dbe4f0); border-radius: 999px; padding: 3px 8px;
}
.ef-fresh-st {
  font-size: 10px; font-weight: 800; letter-spacing: .04em;
  border-radius: 999px; padding: 3px 8px; background: #e2e8f0; color: #475569;
}
.ef-fresh-row.status-ok .ef-fresh-st { background: #c4eed0; color: #166534; }
.ef-fresh-row.status-stale .ef-fresh-st { background: #ffecb3; color: #92400e; }
.ef-fresh-row.status-missing .ef-fresh-st { background: #fee2e2; color: #991b1b; }
.ef-fresh-foot { margin: 10px 0 0; }

.ef-fresh-checked {
  font-size: 11px; font-weight: 800; color: #166534;
  background: #c4eed0; border-radius: 999px; padding: 4px 10px; white-space: nowrap;
}
.ef-fresh-age {
  font-size: 11px; font-weight: 800; color: #92400e;
  background: #ffecb3; border-radius: 999px; padding: 3px 8px;
}
.ef-fresh-row.status-missing .ef-fresh-age { color: #991b1b; background: #fee2e2; }
.ef-fresh-remind {
  margin-top: 4px; font-size: 12px; font-weight: 800; color: var(--ef-primary-deep, #0f2942);
}
.ef-fresh-reminders {
  margin: 10px 0 0; padding-left: 18px;
  font-size: 12px; font-weight: 700; color: var(--ef-ink, #0f172a);
}
.ef-fresh-reminders li { margin: 0 0 4px; }

/* —— Home mail check (Graph email-verify, never send) —— */
.ef-mail-card {
  background: #fff; border: 1px solid var(--ef-outline-soft,#e2e8f0); border-radius: 16px;
  padding: 14px 16px; margin: 0 0 14px; box-shadow: 0 1px 2px rgba(15,41,66,.04);
}
.ef-mail-head { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:8px; }
.ef-mail-title { font-size: var(--ef-fs-sumup-title,15px); font-weight:800; color: var(--ef-ink,#0f172a); }
.ef-mail-sub, .ef-mail-scope, .ef-mail-from, .ef-mail-foot, .ef-mail-empty {
  font-size: var(--ef-fs-sumup-why,12px); font-weight:600; color: var(--ef-muted,#64748b);
}
.ef-mail-scope { margin: 0 0 8px; }
.ef-mail-checked {
  font-size: 11px; font-weight: 800; color: #166534; background: #c4eed0;
  border-radius: 999px; padding: 4px 10px; white-space: nowrap;
}
.ef-mail-list { display:flex; flex-direction:column; gap:8px; }
.ef-mail-row {
  display:flex; flex-wrap:wrap; justify-content:space-between; gap:8px 12px;
  padding:10px 12px; border-radius:12px; background: var(--ef-container,#f1f5f9);
  border-left: 3px solid var(--ef-outline,#94a3b8);
}
.ef-mail-row.urg-high { border-left-color:#dc2626; }
.ef-mail-row.urg-med { border-left-color:#d97706; }
.ef-mail-row.urg-low { border-left-color:#64748b; }
.ef-mail-subj { font-size:13px; font-weight:800; color: var(--ef-ink,#0f172a); }
.ef-mail-meta { display:flex; flex-wrap:wrap; gap:8px; align-items:center; }
.ef-mail-who {
  font-size:11px; font-weight:800; color: var(--ef-primary,#1e3a5f);
  background: var(--ef-primary-soft,#dbe4f0); border-radius:999px; padding:3px 8px;
}
.ef-mail-urg {
  font-size:10px; font-weight:800; letter-spacing:.04em; border-radius:999px; padding:3px 8px;
  background:#e2e8f0; color:#475569;
}
.ef-mail-row.urg-high .ef-mail-urg { background:#fee2e2; color:#991b1b; }
.ef-mail-row.urg-med .ef-mail-urg { background:#ffecb3; color:#92400e; }
.ef-mail-foot { margin:10px 0 0; }


/* —— B4 speaking mascot (Shell H Home opinion) —— */
:root {
  --ef-room-accent: var(--ef-primary, #1e3a5f);
}
.ef-opinion-card {
  border-left-color: var(--ef-room-accent, var(--ef-primary));
}
.ef-opinion-card.ef-opinion-speak {
  display: grid;
  grid-template-columns: 150px 1fr;
  gap: 18px;
  align-items: start;
  border-left: 3px solid var(--ef-room-accent, var(--ef-primary));
}
.ef-opinion-mascot {
  width: 150px;
  height: 150px;
  object-fit: contain;
  background: transparent;
  border-radius: 0;
  border: none;
  box-shadow: none;
  display: block;
}
.ef-opinion-bubble {
  position: relative;
  background: #f8fafc;
  border: 1px solid var(--ef-outline-soft, #e2e8f0);
  border-radius: 14px;
  padding: 14px 16px;
  min-width: 0;
}
.ef-opinion-bubble:before {
  content: "";
  position: absolute;
  left: -8px;
  top: 28px;
  width: 14px;
  height: 14px;
  background: #f8fafc;
  border-left: 1px solid var(--ef-outline-soft, #e2e8f0);
  border-bottom: 1px solid var(--ef-outline-soft, #e2e8f0);
  transform: rotate(45deg);
}
.ef-opinion-speak .ef-opinion-head { margin-bottom: 8px; }
.ef-opinion-speak .ef-sumup-av {
  background: color-mix(in srgb, var(--ef-room-accent, var(--ef-primary)) 18%, #fff);
  color: var(--ef-room-accent, var(--ef-primary));
}
@media (max-width: 720px) {
  .ef-opinion-card.ef-opinion-speak {
    grid-template-columns: 110px 1fr;
    gap: 12px;
  }
  .ef-opinion-mascot { width: 110px; height: 110px; border-radius: 14px; }
  .ef-opinion-bubble:before { top: 22px; }
}
@media (max-width: 480px) {
  .ef-opinion-card.ef-opinion-speak {
    grid-template-columns: 1fr;
  }
  .ef-opinion-mascot { width: 120px; height: 120px; margin: 0 auto; }
  .ef-opinion-bubble:before { display: none; }
}