/**
 * coach.css — AI Coach module only. Isolated from app.css on purpose:
 * zero risk to the rest of the site's styling, free to establish a
 * distinct dashboard visual identity (dark gradient hero, glow accents,
 * journey stepper) while staying strictly on the site's actual brand
 * tokens (--primary-*, --accent-*, --gray-* from app.css) — no invented
 * purple/cyan "AI product" palette, so it reads as part of this brand.
 */

:root {
  --coach-ai-1: var(--primary-600);
  --coach-ai-2: var(--accent-600);
  --coach-ai-gradient: linear-gradient(120deg, var(--primary-600) 0%, var(--accent-500) 100%);
}

/* ── Hero banner ─────────────────────────────────────────────────────────── */
.coach-hero {
  position: relative;
  overflow: hidden;
  border-radius: 1rem;
  background: radial-gradient(ellipse 120% 100% at 20% -10%, rgba(37,99,235,.5) 0%, transparent 55%),
              radial-gradient(ellipse 90% 90% at 100% 10%, rgba(249,115,22,.32) 0%, transparent 55%),
              var(--gray-950);
  padding: 2rem 1.75rem;
  margin-bottom: 1.5rem;
  color: #fff;
}
.coach-hero::before {
  content: "";
  position: absolute; inset: 0; pointer-events: none;
  background-image: linear-gradient(rgba(148,163,255,.08) 1px, transparent 1px),
    linear-gradient(90deg, rgba(148,163,255,.08) 1px, transparent 1px);
  background-size: 32px 32px;
  mask-image: radial-gradient(ellipse 80% 80% at 50% 0%, #000 0%, transparent 75%);
}
.coach-hero-inner { position: relative; z-index: 1; }
.coach-hero-eyebrow {
  display: inline-flex; align-items: center; gap: .5rem;
  font-size: .68rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase;
  color: #93c5fd; margin-bottom: .85rem;
}
.coach-pulse-dot {
  position: relative; width: 7px; height: 7px; border-radius: 50%; background: #34d399; flex-shrink: 0;
}
.coach-pulse-dot::after {
  content: ""; position: absolute; inset: -4px; border-radius: 50%;
  border: 1.5px solid #34d399; animation: coach-pulse-ring 1.8s ease-out infinite;
}
@keyframes coach-pulse-ring {
  0%   { transform: scale(.6); opacity: .9; }
  100% { transform: scale(1.9); opacity: 0; }
}
.coach-hero-title { font-size: 1.7rem; font-weight: 800; line-height: 1.2; margin: 0 0 .5rem; letter-spacing: -.01em; }
.coach-hero-title .grad-text {
  background: linear-gradient(90deg, #93c5fd, #fdba74);
  -webkit-background-clip: text; background-clip: text; color: transparent;
}
.coach-hero-sub { font-size: .92rem; color: rgba(255,255,255,.72); max-width: 640px; margin: 0 0 0; line-height: 1.6; }
.coach-hero-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.25rem; margin-top: 1.1rem; font-size: .78rem; color: rgba(255,255,255,.65); }
.coach-hero-meta strong { color: #fff; }
.coach-hero-meta i { color: #bfdbfe; margin-right: .3rem; }

/* ── Journey stepper ─────────────────────────────────────────────────────── */
.coach-stepper {
  display: flex; align-items: flex-start; gap: 0; margin-bottom: 1.5rem;
  background: #fff; border: 1px solid var(--gray-200); border-radius: .85rem;
  padding: 1.1rem .5rem; overflow-x: auto;
}
.coach-step { flex: 1; min-width: 84px; display: flex; flex-direction: column; align-items: center; text-align: center; position: relative; padding: 0 .35rem; }
.coach-step::before {
  content: ""; position: absolute; top: 15px; left: -50%; width: 100%; height: 2px; background: var(--gray-200); z-index: 0;
}
.coach-step:first-child::before { content: none; }
.coach-step.is-complete::before { background: var(--coach-ai-1); }
.coach-step-dot {
  position: relative; z-index: 1; width: 30px; height: 30px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; font-size: .8rem; font-weight: 700;
  background: var(--gray-100); color: var(--gray-400); border: 2px solid var(--gray-100); margin-bottom: .4rem;
  transition: all .2s;
}
.coach-step.is-complete .coach-step-dot { background: var(--coach-ai-1); border-color: var(--coach-ai-1); color: #fff; }
.coach-step.is-current .coach-step-dot {
  background: #fff; border-color: var(--coach-ai-2); color: var(--coach-ai-2);
  box-shadow: 0 0 0 4px rgba(234,88,12,.15);
}
.coach-step-label { font-size: .68rem; font-weight: 600; color: var(--gray-500); line-height: 1.3; }
.coach-step.is-current .coach-step-label { color: var(--gray-900); font-weight: 700; }
.coach-step.is-complete .coach-step-label { color: var(--gray-700); }

/* ── Stat tiles ───────────────────────────────────────────────────────────── */
.coach-stat-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(140px, 1fr)); gap: .75rem; margin-bottom: 1.5rem; }
.coach-stat-tile {
  background: #fff; border: 1px solid var(--gray-200); border-radius: .75rem; padding: 1rem;
  display: flex; align-items: center; gap: .75rem;
}
.coach-stat-icon {
  width: 40px; height: 40px; border-radius: .6rem; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 1.05rem;
  background: rgba(37,99,235,.1); color: var(--coach-ai-1);
}
.coach-stat-icon.is-purple { background: rgba(22,163,74,.12); color: #16a34a; }
.coach-stat-icon.is-cyan   { background: rgba(37,99,235,.1); color: var(--coach-ai-1); }
.coach-stat-icon.is-amber  { background: #fef3c7; color: #b45309; }
.coach-stat-icon.is-flame  { background: #ffedd5; color: #c2410c; }
.coach-stat-val { font-size: 1.25rem; font-weight: 800; color: var(--gray-900); line-height: 1.1; }
.coach-stat-label { font-size: .72rem; color: var(--gray-500); font-weight: 500; }
.coach-stat-tile { transition: transform .15s, box-shadow .15s; }
.coach-stat-tile:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(15,23,42,.06); }

/* ── AI badge ─────────────────────────────────────────────────────────────── */
.coach-ai-badge {
  display: inline-flex; align-items: center; gap: .35rem; padding: .25rem .65rem;
  border-radius: 99px; font-size: .68rem; font-weight: 700; letter-spacing: .04em; text-transform: uppercase;
  background: var(--coach-ai-gradient); color: #fff;
}

/* ── Panels ───────────────────────────────────────────────────────────────── */
.coach-panel { background: #fff; border: 1px solid var(--gray-200); border-radius: .85rem; padding: 1.35rem; margin-bottom: 1.25rem; }
.coach-panel-head { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1rem; }
.coach-panel-title { font-size: 1rem; font-weight: 700; color: var(--gray-900); margin: 0; display: flex; align-items: center; gap: .5rem; }
.coach-panel-title i { color: var(--coach-ai-2); }

/* ── Topic bars ───────────────────────────────────────────────────────────── */
.coach-topic-row { display: flex; align-items: center; gap: .85rem; padding: .6rem 0; border-bottom: 1px solid var(--gray-100); }
.coach-topic-row:last-child { border-bottom: none; }
.coach-topic-icon {
  width: 32px; height: 32px; border-radius: .5rem; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: .85rem; color: #fff;
}
.coach-topic-icon.is-weak   { background: #ef4444; }
.coach-topic-icon.is-ok     { background: #f59e0b; }
.coach-topic-icon.is-strong { background: #22c55e; }
.coach-topic-body { flex: 1; min-width: 0; }
.coach-topic-top { display: flex; justify-content: space-between; align-items: baseline; gap: .5rem; font-size: .84rem; margin-bottom: .3rem; }
.coach-topic-name { font-weight: 600; color: var(--gray-900); }
.coach-topic-articles { color: var(--gray-400); font-size: .74rem; font-weight: 400; }
.coach-topic-pct { font-weight: 700; color: var(--gray-900); white-space: nowrap; }
.coach-topic-track { height: 8px; border-radius: 99px; background: var(--gray-100); overflow: hidden; }
.coach-topic-fill { height: 100%; border-radius: 99px; transition: width .6s cubic-bezier(.4,0,.2,1); }
.coach-topic-fill.is-weak   { background: linear-gradient(90deg,#f87171,#ef4444); }
.coach-topic-fill.is-ok     { background: linear-gradient(90deg,#fbbf24,#f59e0b); }
.coach-topic-fill.is-strong { background: linear-gradient(90deg,#4ade80,#22c55e); }
.coach-topic-change { font-size: .72rem; font-weight: 700; white-space: nowrap; }
.coach-topic-change.is-up   { color: #16a34a; }
.coach-topic-change.is-down { color: #dc2626; }

/* ── Score ring (mirrors .result-score-ring's conic-gradient technique) ────── */
@property --ring-deg {
  syntax: '<angle>';
  inherits: false;
  initial-value: 0deg;
}
.coach-score-ring {
  width: 96px; height: 96px; border-radius: 50%; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center;
  background: conic-gradient(var(--ring-color, var(--coach-ai-1)) var(--ring-deg, 0deg), var(--gray-100) 0deg);
  transition: --ring-deg 1s cubic-bezier(.16,1,.3,1);
}
.coach-score-ring-inner {
  width: 76px; height: 76px; border-radius: 50%; background: #fff;
  display: flex; flex-direction: column; align-items: center; justify-content: center;
}
.coach-score-ring-val { font-size: 1.15rem; font-weight: 800; color: var(--gray-900); line-height: 1; }
.coach-score-ring-lbl { font-size: .58rem; font-weight: 600; color: var(--gray-400); text-transform: uppercase; margin-top: .15rem; }

/* ── Empty / "coming soon" placeholder (never a bare one-liner) ────────────── */
.coach-empty-card {
  position: relative; overflow: hidden;
  background: linear-gradient(180deg, #fafaff, #fff);
  border: 1px dashed var(--gray-300); border-radius: .85rem; padding: 1.5rem; margin-bottom: 1.25rem;
}
.coach-empty-head { display: flex; align-items: center; gap: .75rem; margin-bottom: 1rem; }
.coach-empty-icon {
  width: 44px; height: 44px; border-radius: .65rem; flex-shrink: 0;
  display: flex; align-items: center; justify-content: center; font-size: 1.2rem; color: #fff;
  background: var(--coach-ai-gradient);
}
.coach-empty-title { font-size: .92rem; font-weight: 700; color: var(--gray-900); margin: 0 0 .15rem; }
.coach-empty-sub { font-size: .78rem; color: var(--gray-500); margin: 0; }
.coach-ghost-line { height: 10px; border-radius: 5px; background: var(--gray-100); margin-bottom: .55rem; position: relative; overflow: hidden; }
.coach-ghost-line::after {
  content: ""; position: absolute; inset: 0; transform: translateX(-100%);
  background: linear-gradient(90deg, transparent, rgba(37,99,235,.12), transparent);
  animation: coach-shimmer 1.8s ease-in-out infinite;
}
@keyframes coach-shimmer { 100% { transform: translateX(100%); } }
.coach-ghost-line.w-90 { width: 90%; } .coach-ghost-line.w-75 { width: 75%; }
.coach-ghost-line.w-60 { width: 60%; } .coach-ghost-line.w-40 { width: 40%; }

/* ── CTA banner ───────────────────────────────────────────────────────────── */
.coach-cta {
  border-radius: .85rem; padding: 1.5rem; margin-bottom: 1.25rem; text-align: center;
  background: var(--coach-ai-gradient); color: #fff;
}
.coach-cta.is-neutral { background: #fff; border: 1px solid var(--gray-200); color: inherit; text-align: left; padding: 1.1rem 1.35rem; }
.coach-cta-title { font-size: 1.05rem; font-weight: 700; margin: 0 0 .35rem; }
.coach-cta-sub { font-size: .84rem; opacity: .9; margin: 0 0 1.1rem; max-width: 480px; margin-left: auto; margin-right: auto; }
.coach-cta.is-neutral .coach-cta-sub { margin-left: 0; margin-right: 0; opacity: 1; color: var(--gray-500); }
.btn-coach-primary {
  display: inline-flex; align-items: center; gap: .5rem; background: #fff; color: var(--coach-ai-2);
  border: none; font-weight: 700; font-size: .88rem; padding: .65rem 1.5rem; border-radius: .55rem;
  transition: transform .12s, box-shadow .12s; text-decoration: none;
}
.btn-coach-primary:hover { transform: translateY(-1px); box-shadow: 0 6px 20px rgba(0,0,0,.18); color: var(--coach-ai-2); }
.btn-coach-outline {
  display: inline-flex; align-items: center; gap: .5rem; background: transparent; color: var(--coach-ai-2);
  border: 1.5px solid var(--coach-ai-2); font-weight: 700; font-size: .85rem; padding: .55rem 1.3rem; border-radius: .55rem;
  transition: background .12s; text-decoration: none;
}
.btn-coach-outline:hover { background: rgba(234,88,12,.08); color: var(--coach-ai-2); }

/* ── Onboarding wizard ────────────────────────────────────────────────────── */
.coach-onboard-grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 1.25rem; align-items: start; }
.coach-feature-list { list-style: none; margin: 0; padding: 0; }
.coach-feature-list li { display: flex; align-items: flex-start; gap: .65rem; padding: .55rem 0; border-bottom: 1px solid var(--gray-100); font-size: .84rem; color: var(--gray-700); }
.coach-feature-list li:last-child { border-bottom: none; }
.coach-feature-list i { color: #22c55e; margin-top: .15rem; flex-shrink: 0; }
@media (max-width: 767px) {
  .coach-onboard-grid { grid-template-columns: 1fr; }
  .coach-hero { padding: 1.5rem 1.25rem; }
  .coach-hero-title { font-size: 1.35rem; }
}

/* ── Instructor note ──────────────────────────────────────────────────────── */
/* One consistent "face" for the trainer's voice everywhere it speaks
   (session intros, coach's note, theory takeaway, misconception patterns) —
   the icon glyph can vary per spot, but the round gradient badge stays the
   same so it reads as the same trainer talking to you across every page. */
.coach-instructor-note {
  display: flex; align-items: flex-start; gap: .65rem; font-size: .87rem;
  color: var(--gray-700); background: var(--gray-50, #f8fafc); border: 1px solid var(--gray-200, #e2e8f0);
  border-radius: .6rem; padding: .75rem .9rem; margin-bottom: 1rem;
}
.coach-instructor-note > i {
  flex-shrink: 0; width: 28px; height: 28px; border-radius: 50%;
  background: var(--coach-ai-gradient); color: #fff; font-style: normal;
  display: flex; align-items: center; justify-content: center; font-size: .85rem;
  box-shadow: 0 2px 5px rgba(37,99,235,.3);
}

/* ── Locked / paywalled content blocks — frosted-glass pane over sharp
   content underneath (the content itself is never blurred; the overlay's
   own backdrop-filter does the blurring, which reads as far more "premium
   SaaS paywall" than blurring the content directly) ─────────────────────── */
.coach-locked-block { position: relative; }
.coach-locked-block.is-locked > .row { pointer-events: none; user-select: none; }
.coach-locked-overlay {
  position: absolute; inset: 0; display: flex; flex-direction: column; align-items: center; justify-content: center;
  gap: .5rem; text-align: center; padding: 1rem;
  background: rgba(255,255,255,.55);
  backdrop-filter: blur(7px) saturate(1.3);
  -webkit-backdrop-filter: blur(7px) saturate(1.3);
  border-radius: .6rem;
  border: 1px solid rgba(255,255,255,.6);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.8);
}
.coach-locked-overlay i { font-size: 1.4rem; color: var(--coach-ai-2); }
.coach-locked-title { font-size: .86rem; font-weight: 700; color: var(--gray-900); }
.coach-lock-cta {
  display: inline-flex; align-items: center; gap: .4rem; background: var(--coach-ai-gradient); color: #fff;
  font-weight: 700; font-size: .8rem; padding: .5rem 1.2rem; border-radius: .5rem; text-decoration: none;
  transition: transform .12s, box-shadow .12s;
}
.coach-lock-cta:hover { color: #fff; opacity: .92; transform: translateY(-1px); box-shadow: 0 6px 16px rgba(234,88,12,.3); }

/* ── Locked preview card (practice/drill teasers) — same frosted-glass pane */
.coach-preview-card { position: relative; overflow: hidden; }
.coach-preview-card .coach-locked-overlay { border-radius: .5rem; }

/* ── Small per-row action buttons (topic drill / share) ───────────────────── */
.coach-topic-actions { display: flex; align-items: center; gap: .5rem; flex-wrap: wrap; justify-content: flex-end; }
.coach-drill-btn {
  display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px;
  border-radius: .4rem; border: 1.5px solid var(--coach-ai-2); color: var(--coach-ai-2); background: transparent;
  font-size: .72rem; text-decoration: none; transition: background .12s, transform .12s;
}
.coach-drill-btn:hover { background: rgba(234,88,12,.08); color: var(--coach-ai-2); transform: scale(1.08); }
.coach-drill-btn.is-locked { opacity: .55; border-color: var(--gray-300); color: var(--gray-400); }
.coach-drill-btn.is-locked:hover { border-color: var(--coach-ai-2); color: var(--coach-ai-2); opacity: .85; }
.coach-share-btn {
  display: inline-flex; align-items: center; gap: .4rem; background: transparent; color: var(--coach-ai-2);
  border: 1.5px solid var(--coach-ai-2); font-weight: 700; font-size: .76rem; padding: .35rem .9rem;
  border-radius: .5rem; transition: background .12s;
}
.coach-share-btn:hover { background: rgba(234,88,12,.08); }

/* ── Referral link input (refer page) ─────────────────────────────────────── */
.coach-refer-link { display: flex; gap: .5rem; max-width: 480px; margin: 0 auto; }
.coach-refer-link input {
  flex: 1; min-width: 0; border: 1.5px solid var(--gray-200); border-radius: .5rem;
  padding: .55rem .8rem; font-size: .84rem; color: var(--gray-700); background: var(--gray-50);
}
.coach-refer-link .coach-share-btn { flex-shrink: 0; padding: .55rem 1rem; }
@media (max-width: 480px) { .coach-refer-link { flex-direction: column; } }

/* ── Trust line / badges (upgrade page) ───────────────────────────────────── */
.coach-trust-line { font-size: .82rem; color: var(--gray-500); }
.coach-trust-line i { color: var(--coach-ai-2); margin-right: .35rem; }
.coach-trust-line strong { color: var(--gray-900); font-weight: 800; }
.coach-trust-badges { display: flex; justify-content: center; gap: 1.25rem; flex-wrap: wrap; margin-top: 1rem; }
.coach-trust-badges span { display: inline-flex; align-items: center; gap: .35rem; font-size: .74rem; color: var(--gray-500); }
.coach-trust-badges i { color: #16a34a; }

/* ── Free vs Pro comparison table (upgrade page) ──────────────────────────── */
.coach-compare-table { background: #fff; border: 1px solid var(--gray-200); border-radius: .85rem; overflow: hidden; }
.coach-compare-row {
  display: grid; grid-template-columns: 1fr 84px 84px; align-items: center;
  padding: .65rem 1rem; font-size: .8rem; color: var(--gray-700);
  border-bottom: 1px solid var(--gray-100);
}
.coach-compare-row:last-child { border-bottom: none; }
.coach-compare-row > div:not(.coach-compare-feature) { text-align: center; }
.coach-compare-head {
  background: var(--gray-50); font-size: .68rem; font-weight: 700; text-transform: uppercase;
  letter-spacing: .04em; color: var(--gray-500); padding: .55rem 1rem;
}
.coach-compare-feature { font-weight: 500; }
.coach-compare-row .is-yes { color: #16a34a; font-weight: 700; }
.coach-compare-row .is-locked { color: var(--gray-300); }
@media (max-width: 480px) {
  .coach-compare-row { grid-template-columns: 1fr 60px 60px; font-size: .74rem; }
}

/* ── Duration plan picker (upgrade page) ──────────────────────────────────── */
.coach-plan-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: .75rem; }
.coach-plan-card {
  position: relative; cursor: pointer; text-align: center; border-radius: .75rem;
  border: 2px solid var(--gray-200); padding: 1.1rem .75rem; transition: border-color .12s, box-shadow .12s;
}
.coach-plan-card:hover { border-color: var(--coach-ai-2); }
.coach-plan-card.is-selected { border-color: var(--coach-ai-2); box-shadow: 0 0 0 3px rgba(234,88,12,.12); }
.coach-plan-card.is-recommended { border-color: #fed7aa; }
.coach-plan-badge {
  position: absolute; top: -.6rem; left: 50%; transform: translateX(-50%);
  background: var(--coach-ai-gradient); color: #fff; font-size: .62rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .04em; padding: .2rem .55rem; border-radius: 99px; white-space: nowrap;
}
.coach-plan-label { font-size: .8rem; font-weight: 600; color: var(--gray-500); margin-bottom: .35rem; }
.coach-plan-price { font-size: 1.4rem; font-weight: 800; color: var(--gray-900); line-height: 1; }
.coach-plan-sub { font-size: .72rem; color: var(--gray-400); margin-top: .35rem; }
.coach-plan-save {
  display: inline-block; margin-left: .3rem; background: #dcfce7; color: #15803d;
  font-weight: 700; padding: .05rem .4rem; border-radius: 99px; font-size: .68rem;
}
@media (max-width: 575px) { .coach-plan-grid { grid-template-columns: 1fr; } }

/* ── Exam Simulation — locked (already-navigated-past) questions ─────────── */
.q-locked-badge {
  display: inline-flex; align-items: center; gap: .3rem; font-size: .68rem; font-weight: 700;
  color: #b45309; background: #fef3c7; padding: .2rem .55rem; border-radius: 99px;
}
.q-option-locked { cursor: not-allowed; opacity: .72; }
.q-option-locked:hover { border-color: inherit !important; background: inherit !important; }

/* ── Pass/fail result banner (exam sim) ───────────────────────────────────── */
.coach-passfail-banner { border-radius: .85rem; padding: 1.5rem; margin-bottom: 1.25rem; text-align: center; color: #fff; }
.coach-passfail-banner.is-pass { background: linear-gradient(120deg, #16a34a, #22c55e); }
.coach-passfail-banner.is-fail { background: linear-gradient(120deg, #dc2626, #ef4444); }
.coach-passfail-title { font-size: 1.3rem; font-weight: 800; margin: 0 0 .25rem; }
.coach-passfail-sub { font-size: .88rem; opacity: .92; margin: 0; }
.coach-passfail-banner.js-celebrate { position: relative; overflow: hidden; }
.coach-confetti-bit {
  position: absolute; top: -10%; pointer-events: none; user-select: none;
  animation: coach-confetti-fall 1.8s ease-in forwards;
}
@keyframes coach-confetti-fall {
  0%   { transform: translateY(0) rotate(0deg); opacity: 1; }
  100% { transform: translateY(160px) rotate(60deg); opacity: 0; }
}

/* ── Weekly plan checklist ─────────────────────────────────────────────────── */
.coach-plan-week { transition: background .15s, border-color .15s; }
.coach-plan-week.is-studied { background: #f0fdf4; border-color: #bbf7d0 !important; }
.coach-plan-check { position: relative; display: inline-flex; cursor: pointer; }
.coach-plan-check input { position: absolute; opacity: 0; width: 18px; height: 18px; margin: 0; cursor: pointer; }
.coach-plan-check span {
  width: 18px; height: 18px; border-radius: .3rem; border: 1.5px solid var(--gray-300); display: inline-block;
  transition: background .12s, border-color .12s; position: relative; flex-shrink: 0;
}
.coach-plan-check input:checked ~ span { background: #22c55e; border-color: #22c55e; }
.coach-plan-check input:checked ~ span::after {
  content: ''; position: absolute; left: 5px; top: 1px; width: 5px; height: 9px;
  border: solid #fff; border-width: 0 2px 2px 0; transform: rotate(45deg);
}

/* ── Mindmap reveal (Topic Study View) ────────────────────────────────────── */
.coach-mindmap-wrap { overflow-x: auto; opacity: 0; transform: scale(.96); transition: opacity .5s ease-out, transform .5s cubic-bezier(.16,1,.3,1); }
.coach-mindmap-wrap.is-revealed { opacity: 1; transform: scale(1); }
.coach-mindmap-wrap svg { max-width: 100%; height: auto; }

/* ── NEC reference chips (clickable, AI plain-English lookup) ─────────────── */
.nec-chip {
  display: inline-flex; align-items: center; gap: .25rem; border: none; cursor: pointer;
  background: rgba(37,99,235,.09); color: var(--coach-ai-1); font: inherit; font-weight: 600;
  padding: .05rem .4rem; border-radius: .35rem; transition: background .12s;
}
.nec-chip::after { content: 'ⓘ'; font-size: .8em; opacity: .7; }
.nec-chip:hover { background: rgba(37,99,235,.18); }
.nec-popover { max-width: 280px; }
.nec-popover .popover-body { font-size: .8rem; line-height: 1.55; }

/* ── Guided Study Plan ────────────────────────────────────────────────────── */
.coach-plan-progress { height: 8px; border-radius: 99px; background: var(--gray-100); overflow: hidden; }
.coach-plan-progress-fill { height: 100%; border-radius: 99px; background: var(--coach-ai-gradient); transition: width .8s cubic-bezier(.16,1,.3,1); }

.coach-plan-grid-cards, .coach-curriculum-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: .85rem; }
.coach-plan-card {
  display: flex; flex-direction: column; gap: .5rem;
  border: 1.5px solid var(--gray-200); border-radius: .75rem; padding: 1rem;
  background: #fff; transition: border-color .15s, box-shadow .15s, transform .15s;
}
.coach-plan-card.is-current { border-color: var(--coach-ai-2); box-shadow: 0 6px 18px rgba(234,88,12,.1); }
.coach-plan-card.is-done { border-color: #bbf7d0; background: #f8fffb; }
.coach-plan-card.is-locked { background: var(--gray-50); opacity: .75; }
.coach-plan-card.is-skipped { border-style: dashed; }

.coach-plan-card-top { display: flex; align-items: center; justify-content: space-between; gap: .5rem; flex-wrap: wrap; }
.coach-plan-card-status {
  display: inline-flex; align-items: center; gap: .3rem; font-size: .68rem; font-weight: 700;
  text-transform: uppercase; letter-spacing: .03em; color: var(--gray-400);
}
.coach-plan-card.is-current .coach-plan-card-status { color: var(--coach-ai-2); }
.coach-plan-card.is-done .coach-plan-card-status { color: #16a34a; }

.coach-plan-card-importance {
  font-size: .64rem; font-weight: 700; padding: .15rem .5rem; border-radius: 99px; white-space: nowrap;
}
.coach-plan-card-importance.is-high   { background: #fee2e2; color: #b91c1c; }
.coach-plan-card-importance.is-medium { background: #fef3c7; color: #b45309; }
.coach-plan-card-importance.is-low    { background: var(--gray-100); color: var(--gray-500); }

/* Below 60% on the latest assessment — shown regardless of lock/status
   since every topic is open anyway; this is what tells a student where to
   actually spend time. */
.coach-plan-card.has-weak-score { box-shadow: inset 3px 0 0 #ef4444; }
.coach-plan-card-weak-flag {
  display: inline-flex; align-items: center; gap: .3rem; font-size: .64rem; font-weight: 700;
  padding: .15rem .5rem; border-radius: 99px; white-space: nowrap; background: #fee2e2; color: #b91c1c;
}
.coach-plan-card-score-val.is-weak { color: #dc2626; }

.coach-plan-card-title { font-weight: 700; font-size: .95rem; color: var(--gray-900); line-height: 1.25; }
.coach-plan-card.is-locked .coach-plan-card-title { color: var(--gray-400); }

.coach-plan-card-score { display: flex; align-items: baseline; gap: .35rem; }
.coach-plan-card-score-val { font-size: 1.5rem; font-weight: 800; color: var(--gray-900); line-height: 1; }
.coach-plan-card-score-lbl { font-size: .7rem; color: var(--gray-400); }

.coach-plan-card-meta { display: flex; flex-direction: column; gap: .2rem; font-size: .74rem; color: var(--gray-500); }
.coach-plan-card-meta i { margin-right: .35rem; color: var(--coach-ai-1); width: 14px; text-align: center; }

.coach-plan-card-sub { font-size: .78rem; color: var(--gray-500); flex: 1; }

.coach-plan-card .btn-coach-primary { padding: .55rem 1rem; font-size: .82rem; margin-top: auto; }
.coach-plan-resume-link {
  background: none; border: none; color: var(--coach-ai-2); font-weight: 600; font-size: .78rem;
  text-decoration: underline; text-align: left; margin-top: auto; padding: 0;
}

/* ── Study session modal (guided plan → Theory/Flashcards/Practice) ─────── */
#studySessionModal .modal-content { border-radius: .85rem; border: none; }
#studySessionModal .modal-body { padding: 1.5rem 2rem; }
@media (min-width: 992px)  { #studySessionModal .modal-dialog { max-width: 90vw; } }
@media (min-width: 1400px) { #studySessionModal .modal-dialog { max-width: 1400px; } }
.coach-skip-link {
  background: none; border: none; color: var(--gray-400); font-size: .78rem;
  text-decoration: underline; padding: 0;
}
.coach-skip-link:hover { color: var(--gray-600); }

/* ── Topic overview + per-subsection step chips (curriculum list) ────────── */
.coach-topic-overview { font-size: .88rem; color: var(--gray-600); line-height: 1.6; }

/* ── "How this works" panel — sits above the subsection grid so a first-time
   visitor knows what Theory/Flashcards/Test actually means before diving in. */
.coach-howto-panel { background: var(--gray-50); border: 1px solid var(--gray-200); border-radius: .75rem; padding: 1rem 1.1rem; }
.coach-howto-step { display: flex; gap: .7rem; align-items: flex-start; margin-bottom: .7rem; }
.coach-howto-step:last-of-type { margin-bottom: .85rem; }
.coach-howto-num {
  flex-shrink: 0; width: 22px; height: 22px; border-radius: 50%; background: var(--coach-ai-gradient); color: #fff;
  font-size: .72rem; font-weight: 800; display: flex; align-items: center; justify-content: center; margin-top: .1rem;
}
.coach-howto-step div { display: flex; flex-direction: column; gap: .1rem; }
.coach-howto-step strong { font-size: .84rem; color: var(--gray-900); }
.coach-howto-step span { font-size: .78rem; color: var(--gray-500); line-height: 1.5; }
.coach-howto-trust {
  display: flex; align-items: flex-start; gap: .5rem; font-size: .78rem; color: var(--gray-600); line-height: 1.5;
  margin: 0; padding-top: .8rem; border-top: 1px dashed var(--gray-200);
}
.coach-howto-trust i { color: #16a34a; flex-shrink: 0; margin-top: .15rem; }
.coach-subsection-steps { display: flex; gap: .75rem; margin: .5rem 0 .75rem; flex-wrap: wrap; }
.coach-subsection-steps span { display: inline-flex; align-items: center; gap: .3rem; font-size: .72rem; color: var(--gray-400); }
.coach-subsection-steps span.is-done { color: #16a34a; }
.coach-subsection-steps i { font-size: .78rem; }

/* ── Subsection step tabs (Theory / Flashcards / Test) ────────────────────── */
.coach-substep-tabs { display: flex; gap: .4rem; margin-bottom: 1rem; border-bottom: 1px solid var(--gray-200); }
.coach-substep-tabs button {
  display: inline-flex; align-items: center; gap: .4rem; background: none; border: none;
  padding: .6rem .9rem; font-size: .84rem; font-weight: 600; color: var(--gray-400);
  border-bottom: 2px solid transparent; margin-bottom: -1px; cursor: pointer;
}
.coach-substep-tabs button.is-active { color: var(--coach-ai-2); border-bottom-color: var(--coach-ai-2); }
.coach-substep-tabs button:hover:not(.is-active) { color: var(--gray-600); }

/* ── Ask-a-doubt box ───────────────────────────────────────────────────────── */
.js-doubt-box .coach-explain-result { margin-top: .75rem; }

/* ── Video (Theory step) ──────────────────────────────────────────────────
   Blended into the same .coach-panel as the text — content left, video right
   — rather than a separate card, so it reads as one unit. Click opens the
   site-wide #videoModal (public/js/video-modal.js) instead of an
   always-loaded embed. .coach-video-embed below is only the non-YouTube
   fallback (Vimeo/Loom/direct host) — see _subsection_body.php. */
.coach-theory-with-video { display: flex; gap: 1.5rem; align-items: flex-start; }
.coach-theory-text-col { flex: 1 1 auto; min-width: 0; }
.coach-theory-video-col {
  flex: 0 0 240px; display: block; text-decoration: none; padding-top: .1rem;
}
.coach-video-thumb { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; border-radius: .6rem; overflow: hidden; background: var(--gray-950); box-shadow: 0 4px 14px rgba(15, 23, 42, .12); transition: box-shadow .2s ease, transform .2s ease; }
.coach-theory-video-col:hover .coach-video-thumb, .coach-theory-video-col:focus-visible .coach-video-thumb { box-shadow: 0 8px 22px rgba(15, 23, 42, .2); transform: translateY(-2px); }
.coach-video-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.coach-video-thumb-play {
  position: absolute; inset: 0; margin: auto; width: 50px; height: 50px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center; background: var(--coach-ai-2); color: #fff; font-size: 1.4rem;
  box-shadow: 0 4px 12px rgba(0, 0, 0, .35); transition: transform .2s ease;
}
.coach-theory-video-col:hover .coach-video-thumb-play { transform: scale(1.1); }
.coach-video-thumb-play i { margin-left: 3px; }
.coach-video-watch {
  display: flex; align-items: center; gap: .35rem; margin-top: .55rem; font-size: .82rem; font-weight: 700;
  color: var(--coach-ai-2); line-height: 1.3;
}
@media (max-width: 767px) {
  .coach-theory-with-video { flex-direction: column-reverse; gap: 1rem; }
  .coach-theory-video-col { flex-basis: auto; width: 100%; }
}

.coach-video-embed { position: relative; width: 100%; padding-top: 56.25%; border-radius: .6rem; overflow: hidden; background: var(--gray-950); margin-bottom: .5rem; }
.coach-video-embed iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.coach-video-caption {
  display: flex; align-items: center; gap: .4rem; font-size: .78rem; color: var(--gray-500);
  margin: 0 0 1.25rem; font-weight: 600;
}
.coach-video-caption i { color: var(--coach-ai-2); }

/* ── Scannable theory: glance strip, TL;DR, comparison table ────────────────── */
.coach-listen-btn {
  font-size: .68rem; font-weight: 700; letter-spacing: .02em; flex-shrink: 0;
  background: var(--primary-50); color: var(--coach-ai-1); border: 1px solid var(--primary-100);
  border-radius: 99px; padding: .3rem .7rem; cursor: pointer; transition: background .12s;
}
.coach-listen-btn:hover { background: var(--primary-100); }
.coach-listen-btn.is-speaking { background: var(--coach-ai-2); color: #fff; border-color: var(--coach-ai-2); }

.coach-glance { display: flex; gap: 1rem; flex-wrap: wrap; margin-bottom: .9rem; padding-bottom: .8rem; border-bottom: 1px dashed var(--gray-200); }
.coach-glance-item { font-size: .74rem; color: var(--gray-500); }
.coach-glance-item b { color: var(--gray-900); font-weight: 700; }
.coach-glance-item.is-exam { color: var(--coach-ai-2); }
.coach-glance-item.is-exam b { color: var(--coach-ai-2); }

.coach-tldr { list-style: none; margin: 0 0 1rem; padding: 0; display: flex; flex-direction: column; gap: .5rem; }
.coach-tldr li {
  display: flex; gap: .55rem; align-items: flex-start; font-size: .85rem; line-height: 1.55; color: var(--gray-800);
  background: var(--primary-50); border: 1px solid var(--primary-100); border-radius: .55rem; padding: .55rem .7rem;
}
.coach-kind {
  font-size: .6rem; font-weight: 700; letter-spacing: .03em; padding: .12rem .4rem; border-radius: .3rem;
  flex-shrink: 0; margin-top: .1rem; white-space: nowrap;
}
.coach-kind.is-rule   { background: #ffedd5; color: #c2410c; }
.coach-kind.is-rating { background: var(--primary-100); color: var(--coach-ai-1); }
.coach-kind.is-gotcha { background: #fef3c7; color: #b45309; }
.coach-kind.is-def    { background: var(--gray-200); color: var(--gray-700); }

.coach-cmp-table { width: 100%; border-collapse: collapse; margin: 0 0 1rem; font-size: .8rem; }
.coach-cmp-table th { text-align: left; font-size: .66rem; text-transform: uppercase; letter-spacing: .05em; color: var(--gray-400); font-weight: 700; padding: .4rem .5rem; border-bottom: 1px solid var(--gray-200); }
.coach-cmp-table td { padding: .55rem .5rem; border-bottom: 1px solid var(--gray-100); color: var(--gray-700); vertical-align: top; line-height: 1.5; }
.coach-cmp-table tr:last-child td { border-bottom: none; }
.coach-cmp-table td.coach-cmp-name { color: var(--gray-900); font-weight: 700; white-space: nowrap; }

.coach-full-exp { margin: 0 0 .5rem; font-size: .83rem; }
.coach-full-exp summary {
  cursor: pointer; font-weight: 700; color: var(--coach-ai-1); list-style: none; display: flex; align-items: center; gap: .4rem; font-size: .8rem;
}
.coach-full-exp summary::-webkit-details-marker { display: none; }
.coach-full-exp summary::before { content: "▸"; font-size: .7em; transition: transform .15s; }
.coach-full-exp[open] summary::before { transform: rotate(90deg); }
.coach-full-exp-body { margin-top: .7rem; padding-top: .7rem; border-top: 1px solid var(--gray-100); }
.coach-full-exp-body p { font-size: .85rem; line-height: 1.7; color: var(--gray-700); margin: 0 0 .8rem; }
.coach-full-exp-body p:last-child { margin-bottom: 0; }

.coach-mistakes { list-style: none; margin: 0; padding: 0; display: flex; flex-direction: column; gap: .4rem; }
.coach-mistakes li { display: flex; gap: .5rem; align-items: flex-start; font-size: .84rem; line-height: 1.5; color: var(--gray-700); }
.coach-mistakes li i { color: #b45309; flex-shrink: 0; margin-top: .2rem; font-size: .78em; }

/* ── Formulas panel ────────────────────────────────────────────────────────── */
.coach-formula-panel { background: linear-gradient(180deg, var(--primary-50), #fff); border-color: var(--primary-100); }
.coach-formula-row { padding: .5rem 0; border-bottom: 1px solid var(--primary-100); }
.coach-formula-row:last-child { border-bottom: none; }
.coach-formula-code {
  display: block; font-family: 'IBM Plex Mono', 'Courier New', monospace; font-size: .85rem; font-weight: 600;
  color: var(--coach-ai-1); background: none; padding: 0;
}
.coach-formula-desc { display: block; font-size: .78rem; color: var(--gray-500); margin-top: .15rem; }

/* ── Explain / review cards ───────────────────────────────────────────────── */
.coach-review-card { background: #fff; border: 1px solid var(--gray-200); border-radius: .65rem; padding: 1rem; margin-bottom: .75rem; }
.coach-review-q { font-size: .85rem; font-weight: 600; color: var(--gray-900); margin-bottom: .4rem; }
.coach-review-answer { font-size: .8rem; color: #dc2626; margin-bottom: .25rem; }
.coach-review-ref { font-size: .74rem; color: var(--gray-400); }
.coach-explain-result {
  margin-top: .75rem; padding: .75rem .9rem; border-radius: .55rem; font-size: .82rem; line-height: 1.6;
  background: linear-gradient(180deg, var(--primary-50), #fff); border: 1px solid var(--primary-100); color: var(--gray-700);
}

/* ── Revenue features (plan/12-study-coach-revenue.md) ─────────────────── */

/* Free lesson badge (_curriculum_body.php) */
.coach-free-badge { display: inline-flex; align-items: center; gap: .25rem; vertical-align: middle; font-size: .68rem; font-weight: 800; letter-spacing: .03em; text-transform: uppercase; color: #047857; background: #d1fae5; border-radius: 999px; padding: .12rem .5rem; }

/* Daily task + streak (_daily_task.php) */
.coach-today { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; background: linear-gradient(135deg, #fff7ed, #fff); border: 1px solid #fed7aa; border-radius: .85rem; padding: 1rem 1.15rem; margin-bottom: 1.25rem; }
.coach-today.is-done { background: linear-gradient(135deg, #ecfdf5, #fff); border-color: #a7f3d0; }
.coach-today-streak { display: flex; flex-direction: column; align-items: center; justify-content: center; min-width: 74px; padding: .4rem .6rem; border-radius: .75rem; background: #fff; border: 1px solid #fde4c8; line-height: 1.1; }
.coach-today-streak .bi-fire { color: #f97316; font-size: 1.15rem; }
.coach-today-streak-val { font-size: 1.35rem; font-weight: 800; color: var(--gray-900); }
.coach-today-streak-lbl { font-size: .65rem; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-500); }
.coach-today-body { flex: 1 1 240px; min-width: 0; }
.coach-today-eyebrow { display: flex; align-items: center; gap: .35rem; font-size: .7rem; font-weight: 800; text-transform: uppercase; letter-spacing: .06em; color: #c2410c; }
.coach-today.is-done .coach-today-eyebrow { color: #047857; }
.coach-today-title { font-weight: 800; color: var(--gray-900); font-size: 1rem; margin-top: .15rem; }
.coach-today-sub { font-size: .84rem; color: var(--gray-600); }
.coach-today-action .btn-coach-primary { white-space: nowrap; }
@media (max-width: 575px) { .coach-today-action { width: 100%; } .coach-today-action .btn-coach-primary { width: 100%; justify-content: center; } }

/* Exam readiness (_readiness.php) */
.coach-readiness-verdict { font-size: .72rem; font-weight: 800; border-radius: 999px; padding: .2rem .65rem; background: #fee2e2; color: #b91c1c; }
.coach-readiness.is-borderline .coach-readiness-verdict { background: #fef3c7; color: #b45309; }
.coach-readiness.is-on_track .coach-readiness-verdict { background: #d1fae5; color: #047857; }
.coach-readiness-top { display: flex; align-items: center; gap: 1rem; flex-wrap: wrap; margin-bottom: .9rem; }
.coach-readiness-score { font-size: 2.4rem; font-weight: 800; line-height: 1; background: var(--coach-ai-gradient); -webkit-background-clip: text; background-clip: text; color: transparent; }
.coach-readiness-line { flex: 1 1 260px; font-size: .9rem; color: var(--gray-700); }
.coach-readiness-bar { position: relative; height: 12px; border-radius: 999px; background: var(--gray-100); margin: 1.6rem 0 .5rem; }
.coach-readiness-fill { height: 100%; border-radius: 999px; background: var(--coach-ai-gradient); transition: width 1s ease; }
.coach-readiness-mark { position: absolute; top: -6px; bottom: -6px; width: 2px; background: var(--gray-900); }
.coach-readiness-mark span { position: absolute; bottom: 100%; left: 50%; transform: translateX(-50%); margin-bottom: 2px; font-size: .66rem; font-weight: 800; white-space: nowrap; color: var(--gray-700); }
.coach-readiness-note { font-size: .74rem; color: var(--gray-500); margin: 0 0 1rem; }
.coach-readiness-gains { position: relative; border-top: 1px dashed var(--gray-200); padding-top: .9rem; }
.coach-readiness-gains-title { font-size: .8rem; font-weight: 800; color: var(--gray-800); margin-bottom: .5rem; display: flex; align-items: center; gap: .4rem; }
.coach-readiness-gains-list { margin: 0; padding-left: 1.2rem; font-size: .86rem; }
.coach-readiness-gains-list li { margin-bottom: .3rem; }
.coach-readiness-gains-list li strong { float: right; color: #047857; }
.coach-readiness-gains-list small { color: var(--gray-500); }
.coach-readiness-gains.is-locked { min-height: 150px; }
.coach-readiness-gains.is-locked .coach-readiness-gains-list { filter: blur(5px); user-select: none; pointer-events: none; }
.coach-readiness-lock { position: absolute; inset: 2.2rem 0 0; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: .45rem; text-align: center; font-size: .84rem; font-weight: 600; color: var(--gray-800); }
.coach-readiness-lock .bi-lock-fill { color: var(--coach-ai-2); font-size: 1.1rem; }

/* Exam result + guarantee (_outcome.php) */
.coach-outcome { scroll-margin-top: 90px; }
.coach-outcome-card { display: flex; gap: 1rem; background: #fff; border: 1px solid var(--gray-200); border-left: 4px solid var(--coach-ai-1); border-radius: .85rem; padding: 1.1rem 1.2rem; margin-bottom: 1.25rem; }
.coach-outcome-card.is-guarantee { border-left-color: #059669; background: linear-gradient(135deg, #ecfdf5, #fff); }
.coach-outcome-icon { width: 42px; height: 42px; flex-shrink: 0; border-radius: .7rem; display: flex; align-items: center; justify-content: center; font-size: 1.25rem; color: #fff; background: var(--coach-ai-gradient); }
.coach-outcome-card.is-guarantee .coach-outcome-icon { background: #059669; }
.coach-outcome-body { flex: 1; min-width: 0; }
.coach-outcome-title { font-weight: 800; color: var(--gray-900); font-size: 1.02rem; }
.coach-outcome-sub { font-size: .86rem; color: var(--gray-600); margin: .2rem 0 .75rem; }
.coach-outcome-choices { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: .75rem; }
.coach-outcome-choice { position: relative; }
.coach-outcome-choice input { position: absolute; opacity: 0; }
.coach-outcome-choice span { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem 1rem; border: 1.5px solid var(--gray-200); border-radius: 999px; font-weight: 700; font-size: .86rem; cursor: pointer; transition: border-color .15s, background .15s; }
.coach-outcome-choice input:checked + span { border-color: var(--coach-ai-1); background: #eff6ff; color: var(--coach-ai-1); }
.coach-outcome-choice input:focus-visible + span { outline: 2px solid var(--coach-ai-1); outline-offset: 2px; }
@media (max-width: 575px) { .coach-outcome-card { flex-direction: column; } }

/* Upgrade page: exam-date hint, guarantee, bundle, pass rate, quotes */
.coach-plan-hint { font-size: .86rem; color: var(--gray-700); margin-bottom: .9rem; display: flex; align-items: center; justify-content: center; gap: .4rem; flex-wrap: wrap; }
.coach-guarantee { display: flex; gap: .9rem; align-items: flex-start; background: linear-gradient(135deg, #ecfdf5, #fff); border: 1px solid #a7f3d0; border-radius: .85rem; padding: 1rem 1.15rem; margin-bottom: 1rem; }
.coach-guarantee.is-bundle { background: linear-gradient(135deg, #f5f3ff, #fff); border-color: #ddd6fe; }
.coach-guarantee-icon { width: 40px; height: 40px; flex-shrink: 0; border-radius: .65rem; display: flex; align-items: center; justify-content: center; font-size: 1.2rem; color: #fff; background: #059669; }
.coach-guarantee.is-bundle .coach-guarantee-icon { background: #6d28d9; }
.coach-guarantee-title { font-weight: 800; color: var(--gray-900); }
.coach-guarantee-sub { font-size: .86rem; color: var(--gray-600); }
.coach-pass-rate { font-size: .95rem; color: var(--gray-700); text-align: center; }
.coach-pass-rate strong { font-size: 1.5rem; color: #047857; }
.coach-pass-rate span { color: var(--gray-500); font-size: .8rem; }
.coach-quote { margin: 1rem 0 0; padding: .85rem 1rem; border-left: 3px solid var(--coach-ai-1); background: #f8fafc; border-radius: 0 .6rem .6rem 0; }
.coach-quote p { margin: 0 0 .35rem; font-size: .9rem; color: var(--gray-800); }
.coach-quote footer { font-size: .76rem; color: var(--gray-500); }

/* ── Test results page (coach/test_result.php) ─────────────────────────── */
.coach-result-topics { display: flex; flex-direction: column; gap: .5rem; }
.coach-result-topic { display: flex; justify-content: space-between; align-items: center; gap: .75rem; padding: .55rem .75rem; border: 1px solid var(--gray-200); border-radius: .55rem; font-size: .85rem; }
.coach-result-topic-name { font-weight: 600; color: var(--gray-900); }
.coach-result-topic-move { white-space: nowrap; color: var(--gray-500); }
.coach-result-topic-move strong { color: var(--gray-900); }
.coach-review-topic { font-size: .7rem; font-weight: 700; text-transform: uppercase; letter-spacing: .04em; color: var(--gray-400); margin-bottom: .25rem; }
.coach-review-correct { font-size: .8rem; color: #15803d; font-weight: 600; margin-bottom: .35rem; }
.coach-review-expl { font-size: .8rem; color: var(--gray-700); background: var(--gray-50, #f8fafc); border-radius: .45rem; padding: .5rem .65rem; margin-bottom: .35rem; }
.coach-explain-result { white-space: pre-line; }
@media (max-width: 575px) {
  .coach-result-topic { flex-direction: column; align-items: flex-start; gap: .2rem; }
}

/* ── Public /coach page for logged-out visitors (coach/landing.php) ─────── */
.coach-landing-ctas { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: 1.2rem; }
.coach-landing-login {
  display: inline-flex; align-items: center; color: #fff; border: 1px solid rgba(255,255,255,.45);
  font-weight: 600; font-size: .88rem; padding: .62rem 1.3rem; border-radius: .55rem; background: transparent;
}
.coach-landing-login:hover { color: #fff; border-color: #fff; background: rgba(255,255,255,.08); }
.coach-landing-example { display: flex; flex-direction: column; gap: .75rem; }
.coach-landing-bar-top { display: flex; justify-content: space-between; font-size: .84rem; color: var(--gray-700); margin-bottom: .25rem; }
.coach-landing-bar-top strong.is-weak { color: #dc2626; }
.coach-landing-bar-top strong.is-ok { color: #d97706; }
.coach-landing-bar-top strong.is-strong { color: #059669; }
.coach-landing-track { height: 8px; border-radius: 999px; background: var(--gray-100); overflow: hidden; }
.coach-landing-fill { height: 100%; border-radius: 999px; }
.coach-landing-fill.is-weak { background: #ef4444; }
.coach-landing-fill.is-ok { background: #f59e0b; }
.coach-landing-fill.is-strong { background: #10b981; }
.coach-landing-verdict { font-size: .84rem; background: #fffbeb; border: 1px solid #fde68a; border-radius: .6rem; padding: .6rem .8rem; color: #78350f; }
.coach-landing-verdict i { color: #d97706; margin-right: .35rem; }
@media (max-width: 480px) {
  .coach-landing-ctas .btn { width: 100%; justify-content: center; }
}