/* ============================================================================
 * Full Courses — styles
 * Every selector is namespaced .fc-* so this file can be dropped into
 * apps/web next to content2.css without touching existing rules.
 * Colours/fonts come from the app's "Gilded Signal / Luna" tokens
 * (gilded-signal-1001.css, typography-system-906.css). The fallbacks below
 * only apply in the standalone preview where those files are not loaded.
 * ========================================================================== */
:root {
  --fc-bg: var(--bg, #120e0b);
  --fc-surface: var(--surface, #1c1510);
  --fc-surface2: var(--surface2, #281d14);
  --fc-surface3: var(--surface3, #352719);
  --fc-border: var(--border, #6f5631);
  --fc-line: var(--gilded-line, rgba(228, 186, 97, .28));
  --fc-gold: var(--gilded-gold, #e4ba61);
  --fc-gold-bright: var(--gilded-gold-bright, #f4d88f);
  --fc-teal: var(--teal, #5bd7c4);
  --fc-teal-dim: var(--teal-dim, rgba(91, 215, 196, .11));
  --fc-violet: var(--violet, #d1b4ff);
  --fc-blue: var(--blue, #91baff);
  --fc-rose: var(--rose, #e99fcf);
  --fc-text: var(--text, #f8efdc);
  --fc-dim: var(--text-dim, #b9a88f);
  --fc-font-body: var(--ac-font-body, 'Nunito Sans', system-ui, sans-serif);
  --fc-font-display: var(--ac-font-display, 'Instrument Serif', Georgia, serif);
  --fc-font-data: var(--ac-font-data, 'JetBrains Mono', ui-monospace, monospace);
  /* domain colours reuse the app's section-label hues */
  --fc-delivery: #f5a46f;
  --fc-content: var(--fc-blue);
  --fc-mindset: var(--fc-violet);
  --fc-done: var(--fc-teal);
}

.fc-root { color: var(--fc-text); font-family: var(--fc-font-body); font-size: 17px; line-height: 1.6; }
.fc-root *, .fc-root *::before, .fc-root *::after { box-sizing: border-box; }
:where(.fc-root) button { font: inherit; color: inherit; }
.fc-root :focus-visible { outline: 2px solid var(--fc-gold-bright); outline-offset: 2px; border-radius: 6px; }

/* ---------- page lead (matches .gilded-page-lead) ---------- */
.fc-lead { padding: 4px 0 25px; margin: 0 0 30px; border-bottom: 1px solid rgba(228, 186, 97, .24); }
.fc-kicker { font: 900 15px/1.25 var(--fc-font-data); letter-spacing: 3px; text-transform: uppercase; color: var(--fc-gold); }
.fc-lead h1 { margin: 8px 0 9px; font: 400 48px/1.02 var(--fc-font-display); letter-spacing: -1.2px; color: #fff8e8; }
.fc-lead p { margin: 0; max-width: 735px; color: #afa28e; font-weight: 700; }
.fc-back { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 12px 6px 8px; border: 1px solid var(--fc-line); border-radius: 999px; background: transparent; color: var(--fc-dim); font-size: 15px; font-weight: 800; cursor: pointer; }
.fc-back:hover { color: var(--fc-text); border-color: var(--fc-gold); }

/* ---------- panels ---------- */
.fc-panel {
  position: relative; border: 1px solid rgba(252, 211, 77, .22); border-radius: 16px; padding: 26px;
  background:
    radial-gradient(circle at 88% 0, rgba(252, 211, 77, .10), transparent 34%),
    radial-gradient(circle at 8% 100%, rgba(167, 139, 250, .07), transparent 36%),
    linear-gradient(145deg, rgba(24, 22, 18, .98), rgba(12, 15, 18, .98));
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .03);
}
.fc-section-title { margin: 0 0 14px; padding-bottom: 7px; border-bottom: 1px solid rgba(252, 211, 77, .18); font: 500 25px/1.4 var(--fc-font-display); letter-spacing: .6px; text-transform: uppercase; color: #fbbf24; }

/* ---------- stats strip ---------- */
/* small progress dashboard, top-right of the library header */
.fc-lib-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 28px; }
.fc-lib-head > div:first-child { flex: 1; min-width: 0; }
.fc-lib-head h1 { margin-bottom: 0; }
.fc-stats { flex: none; display: grid; grid-template-columns: repeat(2, auto); gap: 8px; }
.fc-stat { min-width: 104px; padding: 8px 12px; border: 1px solid rgba(255, 255, 255, .08); border-radius: 10px; background: rgba(255, 255, 255, .025); }
.fc-stat-label { font: 800 10.5px/1.2 var(--fc-font-body); letter-spacing: 1.2px; text-transform: uppercase; color: #8f8f8f; white-space: nowrap; }
.fc-stat-value { margin-top: 3px; font: 700 18px/1.1 var(--fc-font-data); color: var(--fc-text); white-space: nowrap; }
.fc-stat-value small { font-size: 12px; color: #8f8f8f; font-weight: 600; }

/* ---------- continue card ---------- */
.fc-continue { display: grid; grid-template-columns: 220px 1fr auto; gap: 22px; align-items: center; margin-bottom: 30px; padding: 18px; cursor: pointer; }
.fc-continue:hover { border-color: rgba(252, 211, 77, .45); }
.fc-thumb { position: relative; aspect-ratio: 16/9; border-radius: 10px; overflow: hidden; background: linear-gradient(135deg, #2a1d12, #0d1114); border: 1px solid rgba(255,255,255,.08); }
.fc-thumb video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: .75; pointer-events: none; }
.fc-thumb .fc-play-dot { position: absolute; left: 50%; top: 50%; width: 52px; height: 52px; margin: -26px 0 0 -26px; border-radius: 50%; background: rgba(244, 216, 143, .92); display: grid; place-items: center; box-shadow: 0 8px 24px rgba(0,0,0,.45); }
.fc-thumb .fc-play-dot::after { content: ''; margin-left: 4px; border-left: 15px solid #261a0b; border-top: 9px solid transparent; border-bottom: 9px solid transparent; }
.fc-thumb-bar { position: absolute; left: 0; right: 0; bottom: 0; height: 4px; background: rgba(0,0,0,.5); }
.fc-thumb-bar i { display: block; height: 100%; background: var(--fc-gold); }
.fc-continue-title { margin: 4px 0 2px; font: 400 29px/1.1 var(--fc-font-display); color: #fff8e8; }
.fc-continue-meta { color: var(--fc-dim); font-size: 15px; font-weight: 700; }

/* ---------- buttons ---------- */
.fc-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 18px; border-radius: 10px; border: 1px solid transparent; font-weight: 900; font-size: 16px; cursor: pointer; white-space: nowrap; text-decoration: none; }
.fc-btn-gold { background: linear-gradient(105deg, #f4d88f, #bd8d36); color: #261a0b; box-shadow: 0 7px 18px rgba(0,0,0,.24); }
.fc-btn-gold:hover { filter: brightness(1.06); }
.fc-btn-ghost { background: transparent; border-color: var(--fc-line); color: var(--fc-text); }
.fc-btn-ghost:hover { border-color: var(--fc-gold); }
.fc-btn-small { padding: 6px 12px; font-size: 14px; border-radius: 8px; }
.fc-link { background: none; border: 0; padding: 0; color: var(--fc-gold); font-weight: 800; cursor: pointer; text-decoration: underline; text-underline-offset: 3px; }

/* ---------- course cards ---------- */
.fc-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 18px; }
.fc-card { display: flex; flex-direction: column; gap: 14px; padding: 22px; border-radius: 16px; border: 1px solid rgba(255, 255, 255, .09); background: linear-gradient(160deg, rgba(40, 29, 20, .9), rgba(18, 14, 11, .95)); cursor: pointer; transition: border-color .15s, transform .15s; min-height: 280px; }
.fc-card:hover { border-color: rgba(228, 186, 97, .55); transform: translateY(-2px); }
/* course illustration (assets/img/*.svg) with the progress ring on top */
.fc-card-img { position: relative; margin: -22px -22px 2px; height: 148px; overflow: hidden; border-radius: 15px 15px 0 0; background: #0b0806; }
.fc-card-img img { display: block; width: 100%; height: 100%; object-fit: cover; transition: transform .4s; }
.fc-card:hover .fc-card-img img { transform: scale(1.04); }
.fc-card-img::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 55%, rgba(26, 19, 13, .95)); pointer-events: none; }
.fc-card-img .fc-ring { position: absolute; top: 12px; right: 12px; z-index: 1; --size: 52px; box-shadow: 0 6px 18px rgba(0,0,0,.45); }
.fc-card-img .fc-ring::before { inset: 5px; background: rgba(18, 13, 9, .92); }
.fc-card-img .fc-ring span { font-size: 13px; }
.fc-card-tailored { border-color: rgba(91, 215, 196, .28); }
.fc-card-tailored:hover { border-color: rgba(91, 215, 196, .6); }
.fc-card-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.fc-level { display: inline-flex; align-items: center; gap: 8px; font: 900 13px/1 var(--fc-font-data); letter-spacing: 2.4px; text-transform: uppercase; color: var(--fc-gold); }
.fc-level-pips { display: inline-flex; gap: 3px; }
.fc-level-pips i { width: 7px; height: 7px; border-radius: 2px; background: rgba(228, 186, 97, .22); }
.fc-level-pips i.on { background: var(--fc-gold); }
.fc-card h3 { margin: 6px 0 0; font: 400 28px/1.05 var(--fc-font-display); color: #fff8e8; }
.fc-theme { margin-top: 4px; font: 800 15px/1.3 var(--fc-font-body); color: var(--fc-gold-bright); }
.fc-card p { margin: 0; color: var(--fc-dim); font-size: 16px; font-weight: 600; line-height: 1.5; }
.fc-card-meta { display: flex; flex-wrap: wrap; gap: 6px 14px; margin-top: auto; font: 600 13.5px/1.3 var(--fc-font-data); color: #8f8f8f; }
.fc-card-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; padding-top: 14px; border-top: 1px solid rgba(255,255,255,.07); }
.fc-card-status { font-size: 14px; font-weight: 800; color: var(--fc-dim); }
.fc-card-status.done { color: var(--fc-done); }

/* progress ring */
.fc-ring { --p: 0; --size: 64px; --c: var(--fc-gold); position: relative; flex: none; width: var(--size); height: var(--size); border-radius: 50%; background: conic-gradient(var(--c) calc(var(--p) * 1%), rgba(255,255,255,.08) 0); display: grid; place-items: center; }
.fc-ring::before { content: ''; position: absolute; inset: 6px; border-radius: 50%; background: #17110c; }
.fc-ring span { position: relative; font: 800 15px/1 var(--fc-font-data); color: var(--fc-text); }
.fc-ring.done { --c: var(--fc-done); }

/* the recommended path 1 -> 2 -> 3 */
.fc-path { display: flex; align-items: center; gap: 10px; margin: 30px 0 14px; font: 900 13px/1 var(--fc-font-data); letter-spacing: 2.4px; text-transform: uppercase; color: var(--fc-dim); }
.fc-path::after { content: ''; flex: 1; height: 1px; background: linear-gradient(90deg, var(--fc-line), transparent); }

/* tailored card (wide, first) */
.fc-tailored-card { display: grid; grid-template-columns: 1fr 1.15fr; gap: 24px; padding: 26px; margin-bottom: 8px; border-color: rgba(91, 215, 196, .35); background:
  radial-gradient(circle at 92% 10%, rgba(91, 215, 196, .14), transparent 40%),
  radial-gradient(circle at 0% 100%, rgba(228, 186, 97, .12), transparent 45%),
  linear-gradient(145deg, rgba(24, 22, 18, .98), rgba(12, 15, 18, .98)); }
.fc-tailored-card .fc-kicker { color: var(--fc-teal); }
.fc-tailored-card h3 { margin: 8px 0 8px; font: 400 36px/1.05 var(--fc-font-display); color: #fff8e8; }
.fc-tailored-card p { margin: 0; color: var(--fc-dim); font-weight: 600; }
.fc-focus-trio { display: grid; gap: 10px; align-content: center; }
.fc-focus-chip { display: flex; align-items: center; gap: 12px; padding: 11px 14px; border-radius: 12px; border: 1px dashed rgba(255,255,255,.14); background: rgba(255,255,255,.02); font-weight: 800; font-size: 15px; color: var(--fc-dim); }
.fc-focus-chip b { font: 900 12px/1 var(--fc-font-data); letter-spacing: 1.8px; text-transform: uppercase; min-width: 82px; }
.fc-focus-chip.is-set { border-style: solid; color: var(--fc-text); background: rgba(255,255,255,.035); }
/* the latest analysis' three headline videos on the library card */
.fc-pick { display: grid; grid-template-columns: 24px 1fr auto; gap: 12px; align-items: center; width: 100%; padding: 11px 14px; border-radius: 12px; border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.03); text-align: left; cursor: pointer; }
.fc-pick:hover { border-color: rgba(228,186,97,.55); background: rgba(255,255,255,.05); }
.fc-pick.is-done { border-color: rgba(91,215,196,.35); }
.fc-pick-body { min-width: 0; display: grid; gap: 2px; }
.fc-pick-dom { font: 700 12.5px/1.2 var(--fc-font-data); color: var(--fc-dim); }
.fc-pick-dom b { font-weight: 900; letter-spacing: 1.6px; text-transform: uppercase; }
.fc-pick-title { font-weight: 800; font-size: 15.5px; line-height: 1.3; color: var(--fc-text); }
.fc-pick-dur { font: 700 13px/1 var(--fc-font-data); color: var(--fc-dim); white-space: nowrap; }
.fc-pick.is-done .fc-pick-dur { color: var(--fc-done); }
/* focus summary under each analysis in the tailored course */
.fc-module-focus { margin: -2px 18px 10px; display: grid; gap: 3px; }
.fc-module-talk { font-size: 14px; font-weight: 800; color: var(--fc-text); margin-bottom: 2px; }
.fc-focus-line { font-size: 14px; font-weight: 700; color: var(--fc-dim); }
.fc-focus-line b { display: inline-block; min-width: 76px; font: 900 11.5px/1 var(--fc-font-data); letter-spacing: 1.4px; text-transform: uppercase; }
.fc-focus-line em { font-weight: 600; opacity: .8; }
.fc-d-delivery { color: var(--fc-delivery); } .fc-d-content { color: var(--fc-content); } .fc-d-mindset { color: var(--fc-mindset); } .fc-d-general { color: var(--fc-dim); }

/* ---------- course view ---------- */
.fc-course-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 24px; }
.fc-course-progress { min-width: 260px; }
.fc-bar { height: 8px; border-radius: 99px; background: rgba(255,255,255,.08); overflow: hidden; }
.fc-bar i { display: block; height: 100%; border-radius: 99px; background: linear-gradient(90deg, #bd8d36, #f4d88f); transition: width .4s; }
.fc-bar.done i { background: var(--fc-done); }
.fc-bar-label { display: flex; justify-content: space-between; margin-bottom: 7px; font: 700 14px/1.2 var(--fc-font-data); color: var(--fc-dim); }
.fc-bar-label b { color: var(--fc-text); }

.fc-layout { display: grid; grid-template-columns: minmax(0, 1fr) 390px; gap: 22px; align-items: start; }

/* player */
.fc-player { position: relative; border-radius: 14px; overflow: hidden; background: #000; border: 1px solid rgba(255,255,255,.09); aspect-ratio: 16/9; }
.fc-player video { display: block; width: 100%; height: 100%; background: #000; }
.fc-captions { position: absolute; left: 50%; bottom: 58px; transform: translateX(-50%); max-width: 86%; padding: 6px 12px; border-radius: 8px; background: rgba(0,0,0,.72); color: #fff; font-size: 19px; font-weight: 700; line-height: 1.35; text-align: center; pointer-events: none; }
.fc-captions:empty { display: none; }
.fc-player-note { position: absolute; left: 14px; top: 14px; display: flex; gap: 8px; align-items: center; padding: 6px 8px 6px 12px; border-radius: 999px; background: rgba(12, 10, 8, .86); border: 1px solid var(--fc-line); font-size: 14px; font-weight: 800; color: var(--fc-text); }
.fc-player-note button { border: 0; background: rgba(255,255,255,.08); border-radius: 999px; padding: 3px 10px; cursor: pointer; font-weight: 800; font-size: 13px; }
.fc-unavailable { position: absolute; inset: 0; display: grid; place-items: center; text-align: center; padding: 24px; color: var(--fc-dim); background: radial-gradient(circle at 50% 30%, rgba(228,186,97,.1), transparent 50%), #0c0a08; }
.fc-unavailable strong { display: block; font: 400 30px/1.1 var(--fc-font-display); color: var(--fc-text); margin-bottom: 6px; }

/* up next overlay */
.fc-upnext { position: absolute; inset: 0; display: grid; place-items: center; background: rgba(8, 6, 4, .82); backdrop-filter: blur(3px); }
.fc-upnext-box { text-align: center; max-width: 440px; padding: 20px; }
.fc-upnext-done { display: inline-flex; align-items: center; gap: 8px; margin-bottom: 14px; padding: 6px 14px; border-radius: 999px; background: var(--fc-teal-dim); border: 1px solid rgba(91,215,196,.4); color: var(--fc-teal); font-weight: 900; font-size: 15px; }
.fc-upnext-box h4 { margin: 4px 0 18px; font: 400 32px/1.1 var(--fc-font-display); color: #fff8e8; }
.fc-upnext-count { font: 800 14px/1 var(--fc-font-data); letter-spacing: 2px; text-transform: uppercase; color: var(--fc-dim); }
.fc-upnext-actions { display: flex; gap: 10px; justify-content: center; }

/* toolbar under the player */
.fc-toolbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 12px 0 0; }
.fc-seg { display: inline-flex; padding: 3px; border-radius: 10px; background: rgba(255,255,255,.04); border: 1px solid rgba(255,255,255,.08); }
.fc-seg button { border: 0; background: transparent; padding: 5px 10px; border-radius: 7px; cursor: pointer; font: 700 14px/1 var(--fc-font-data); color: var(--fc-dim); }
.fc-seg button.on { background: rgba(228,186,97,.18); color: var(--fc-gold-bright); }
.fc-tool-btn { border: 1px solid rgba(255,255,255,.1); background: rgba(255,255,255,.03); border-radius: 9px; padding: 6px 12px; cursor: pointer; font-size: 14px; font-weight: 800; color: var(--fc-dim); }
.fc-tool-btn.on { color: var(--fc-gold-bright); border-color: rgba(228,186,97,.45); }
.fc-tool-btn:disabled { opacity: .4; cursor: default; }

/* lesson detail */
.fc-lesson { margin-top: 18px; }
.fc-lesson-top { display: flex; justify-content: space-between; align-items: flex-start; gap: 16px; }
.fc-lesson h2 { margin: 6px 0 10px; font: 400 36px/1.08 var(--fc-font-display); color: #fff8e8; }
.fc-chips { display: flex; flex-wrap: wrap; gap: 7px; margin-bottom: 18px; }
.fc-chip { display: inline-flex; align-items: center; gap: 6px; padding: 4px 10px; border-radius: 999px; border: 1px solid rgba(255,255,255,.12); font-size: 13.5px; font-weight: 800; color: var(--fc-dim); background: rgba(255,255,255,.025); }
.fc-chip.kind-exercise { color: var(--fc-teal); border-color: rgba(91,215,196,.35); background: var(--fc-teal-dim); }
.fc-chip.dom-delivery { color: var(--fc-delivery); border-color: rgba(245,164,111,.35); }
.fc-chip.dom-content { color: var(--fc-content); border-color: rgba(145,186,255,.35); }
.fc-chip.dom-mindset { color: var(--fc-mindset); border-color: rgba(209,180,255,.35); }
.fc-chip.skill { font-family: var(--fc-font-data); font-weight: 700; font-size: 12.5px; }

/* watched status pill — the "clearly highlight when watched" requirement */
.fc-status { flex: none; display: inline-flex; align-items: center; gap: 8px; padding: 7px 14px; border-radius: 999px; font-size: 14px; font-weight: 900; border: 1px solid rgba(255,255,255,.12); color: var(--fc-dim); white-space: nowrap; }
.fc-status.progress { color: var(--fc-gold-bright); border-color: rgba(228,186,97,.4); }
.fc-status.done { color: #0f2a25; background: var(--fc-done); border-color: var(--fc-done); box-shadow: 0 0 0 4px rgba(91,215,196,.12); }
.fc-check { width: 18px; height: 18px; flex: none; }

.fc-tabs { display: flex; gap: 4px; border-bottom: 1px solid rgba(255,255,255,.09); margin-bottom: 18px; }
.fc-tabs button { border: 0; background: none; padding: 10px 14px; cursor: pointer; font-weight: 900; font-size: 15px; color: var(--fc-dim); border-bottom: 2px solid transparent; margin-bottom: -1px; }
.fc-tabs button.on { color: var(--fc-gold-bright); border-bottom-color: var(--fc-gold); }
.fc-desc { margin: 0 0 18px; font-size: 18px; line-height: 1.65; color: #eadcc2; max-width: 760px; }
.fc-takeaways { margin: 0 0 20px; padding: 0; list-style: none; display: grid; gap: 8px; }
.fc-takeaways li { position: relative; padding: 10px 14px 10px 40px; border-radius: 10px; background: rgba(255,255,255,.025); border: 1px solid rgba(255,255,255,.06); font-weight: 700; font-size: 16px; }
.fc-takeaways li::before { content: attr(data-n); position: absolute; left: 12px; top: 10px; font: 800 13px/1.9 var(--fc-font-data); color: var(--fc-gold); }
.fc-task { margin: 0 0 20px; padding: 16px 18px; border-radius: 12px; border: 1px solid rgba(91,215,196,.35); background: var(--fc-teal-dim); }
.fc-task b { display: block; margin-bottom: 4px; font: 900 13px/1.2 var(--fc-font-data); letter-spacing: 2px; text-transform: uppercase; color: var(--fc-teal); }
.fc-related { display: grid; gap: 8px; }
.fc-related-item { display: flex; align-items: center; gap: 12px; padding: 12px 14px; border-radius: 12px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.02); cursor: pointer; text-align: left; width: 100%; }
.fc-related-item:hover { border-color: var(--fc-gold); }
.fc-related-item .t { flex: 1; font-weight: 800; }
.fc-related-item .m { font: 700 13px/1 var(--fc-font-data); color: var(--fc-dim); }
.fc-subhead { margin: 22px 0 10px; font: 900 13px/1.2 var(--fc-font-data); letter-spacing: 2px; text-transform: uppercase; color: var(--fc-dim); }

/* transcript */
.fc-transcript-tools { display: flex; gap: 10px; align-items: center; margin-bottom: 10px; }
.fc-search { flex: 1; padding: 9px 12px; border-radius: 10px; border: 1px solid rgba(255,255,255,.12); background: rgba(0,0,0,.25); color: var(--fc-text); font: 600 15px var(--fc-font-body); }
.fc-transcript { max-height: 460px; overflow: auto; padding-right: 6px; scroll-behavior: smooth; }
.fc-seg-row { display: grid; grid-template-columns: 58px 1fr; gap: 10px; width: 100%; padding: 7px 10px; border: 0; border-radius: 8px; background: none; text-align: left; cursor: pointer; font-size: 16px; line-height: 1.5; color: #d9cab0; }
.fc-seg-row:hover { background: rgba(255,255,255,.04); }
.fc-seg-row time { font: 700 13px/1.9 var(--fc-font-data); color: #8d7f69; }
.fc-seg-row.now { background: rgba(228,186,97,.12); color: #fff8e8; }
.fc-seg-row.now time { color: var(--fc-gold); }
.fc-seg-row mark { background: rgba(244,216,143,.35); color: inherit; border-radius: 3px; padding: 0 2px; }
.fc-note { font-size: 13.5px; color: #8d7f69; font-weight: 600; }

/* curriculum sidebar */
.fc-curriculum { position: sticky; top: 16px; max-height: calc(100vh - 32px); display: flex; flex-direction: column; padding: 0; overflow: hidden; }
.fc-curr-head { padding: 18px 18px 14px; border-bottom: 1px solid rgba(255,255,255,.08); }
.fc-curr-head h3 { margin: 0 0 10px; font: 400 25px/1.1 var(--fc-font-display); color: #fff8e8; }
.fc-curr-filter { display: flex; gap: 6px; margin-top: 12px; }
.fc-curr-body { overflow: auto; padding: 6px 0 12px; }
.fc-module { border-bottom: 1px solid rgba(255,255,255,.05); }
.fc-module-head { display: flex; align-items: center; gap: 10px; width: 100%; padding: 14px 18px 10px; border: 0; background: none; cursor: pointer; text-align: left; }
.fc-module-head .t { flex: 1; font: 900 13px/1.3 var(--fc-font-data); letter-spacing: 1.4px; text-transform: uppercase; color: var(--fc-gold); }
.fc-module-head .c { font: 700 13px/1 var(--fc-font-data); color: var(--fc-dim); }
.fc-module-head .c.done { color: var(--fc-done); }
.fc-module-head .chev { width: 10px; height: 10px; border-right: 2px solid var(--fc-dim); border-bottom: 2px solid var(--fc-dim); transform: rotate(45deg); transition: transform .15s; margin-top: -4px; }
.fc-module.closed .chev { transform: rotate(-45deg); margin-top: 0; }
.fc-module.closed .fc-items { display: none; }
.fc-module-why { margin: -2px 18px 10px; font-size: 14px; line-height: 1.5; color: var(--fc-dim); font-weight: 600; }
.fc-items { list-style: none; margin: 0; padding: 0 8px 8px; }
.fc-item { display: grid; grid-template-columns: 26px 1fr auto; gap: 10px; align-items: center; width: 100%; padding: 9px 10px; border: 1px solid transparent; border-left-width: 3px; border-radius: 10px; background: none; cursor: pointer; text-align: left; }
.fc-item:hover { background: rgba(255,255,255,.035); }
.fc-item .t { font-weight: 800; font-size: 15px; line-height: 1.3; color: var(--fc-text); }
.fc-item .s { display: flex; gap: 8px; align-items: center; margin-top: 3px; font: 700 12px/1 var(--fc-font-data); color: #8d7f69; }
.fc-item .d { font: 700 12.5px/1 var(--fc-font-data); color: var(--fc-dim); }
.fc-item.is-exercise { margin-left: 18px; width: calc(100% - 18px); }
.fc-item.is-exercise .s .x { color: var(--fc-teal); letter-spacing: 1.4px; }
.fc-item.is-active { background: linear-gradient(105deg, rgba(244,216,143,.16), rgba(189,141,54,.08)); border-color: rgba(228,186,97,.45); }
.fc-item.is-done { border-left-color: var(--fc-done); }
.fc-item.is-done .t { color: #cfe9e3; }
.fc-item.is-done .s .w { color: var(--fc-done); }
.fc-item.is-unavailable { opacity: .45; }

/* status icon: empty circle / partial ring / filled check */
.fc-si { --p: 0; width: 22px; height: 22px; border-radius: 50%; display: grid; place-items: center; background: conic-gradient(var(--fc-gold) calc(var(--p) * 1%), rgba(255,255,255,.14) 0); }
.fc-si::before { content: ''; width: 16px; height: 16px; border-radius: 50%; background: #18110c; }
.fc-si.done { background: var(--fc-done); }
.fc-si.done::before { width: 10px; height: 6px; border-radius: 0; background: none; border-left: 2.5px solid #0f2a25; border-bottom: 2.5px solid #0f2a25; transform: translateY(-1px) rotate(-45deg); }
.fc-item.is-active .fc-si:not(.done)::before { background: #2a1e12; box-shadow: inset 0 0 0 4px #2a1e12, inset 0 0 0 9px var(--fc-gold); }

/* empty state for tailored */
.fc-empty { text-align: center; padding: 44px 26px; }
.fc-empty h2 { margin: 8px 0 10px; font: 400 40px/1.08 var(--fc-font-display); color: #fff8e8; }
.fc-empty p { margin: 0 auto 22px; max-width: 620px; color: var(--fc-dim); font-weight: 600; }
.fc-how { display: grid; grid-template-columns: repeat(3, minmax(0,1fr)); gap: 14px; margin: 28px 0 26px; text-align: left; }
.fc-how > div { padding: 18px; border-radius: 14px; border: 1px solid rgba(255,255,255,.08); background: rgba(255,255,255,.025); }
.fc-how b { display: block; margin-bottom: 6px; font: 900 13px/1.2 var(--fc-font-data); letter-spacing: 2px; text-transform: uppercase; }
.fc-how span { font-size: 15.5px; color: var(--fc-dim); font-weight: 600; line-height: 1.5; }
.fc-preview-banner { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 18px; padding: 10px 14px; border-radius: 12px; border: 1px dashed rgba(209,180,255,.5); color: var(--fc-violet); font-weight: 800; font-size: 15px; }

/* toast */
.fc-toast { position: fixed; left: 50%; bottom: 26px; transform: translate(-50%, 20px); opacity: 0; z-index: 2000; display: flex; align-items: center; gap: 10px; padding: 12px 18px; border-radius: 12px; background: #0f2a25; border: 1px solid var(--fc-done); color: #d6f7f0; font-weight: 900; box-shadow: 0 18px 40px rgba(0,0,0,.45); transition: opacity .25s, transform .25s; pointer-events: none; }
.fc-toast.show { opacity: 1; transform: translate(-50%, 0); }

/* ---------- responsive ---------- */
@media (max-width: 1360px) { .fc-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 1180px) {
  .fc-layout { grid-template-columns: 1fr; }
  .fc-curriculum { position: static; max-height: none; }
}
@media (max-width: 760px) {
  .fc-lead h1 { font-size: 36px; }
  .fc-grid, .fc-how, .fc-tailored-card { grid-template-columns: 1fr; }
  .fc-lib-head { flex-direction: column; gap: 16px; }
  .fc-stats { grid-template-columns: 1fr 1fr; width: 100%; }
  .fc-continue { grid-template-columns: 1fr; }
  .fc-course-head { flex-direction: column; align-items: stretch; }
  .fc-lesson h2 { font-size: 29px; }
  .fc-lesson-top { flex-direction: column; }
  .fc-captions { font-size: 15px; bottom: 50px; }
}
@media (prefers-reduced-motion: reduce) { .fc-root * { transition: none !important; scroll-behavior: auto !important; } }

/* playback-speed selector under the player: small and neutral grey */
.fc-toolbar .fc-seg { padding: 2px; border-radius: 8px; background: rgba(255,255,255,.025); border-color: rgba(255,255,255,.06); }
.fc-toolbar .fc-seg button { padding: 3px 7px; border-radius: 6px; font-size: 11.5px; font-weight: 600; color: #8f8f8f; }
.fc-toolbar .fc-seg button:hover { color: #c4c4c4; }
.fc-toolbar .fc-seg button.on { background: rgba(255,255,255,.09); color: #e2e2e2; }

/* JP1127 (B3): "Watch the lesson" on a coach exercise card (Delivery, Content, Mindset) -> Full Courses */
.fc-watch { display: inline-flex; align-items: center; gap: 10px; max-width: 100%; margin-top: 14px; padding: 8px 16px 8px 12px; border: 1px solid var(--fc-line); border-radius: 999px; background: rgba(228, 186, 97, .08); color: var(--fc-gold-bright); font: 800 13.5px/1.25 var(--fc-font-body); text-align: left; cursor: pointer; transition: background .15s, border-color .15s; }
.fc-watch:hover { background: rgba(228, 186, 97, .16); border-color: var(--fc-gold); }
.fc-watch:focus-visible { outline: 2px solid var(--fc-gold); outline-offset: 2px; }
.fc-watch-play { flex: none; width: 0; height: 0; border-left: 9px solid currentColor; border-top: 6px solid transparent; border-bottom: 6px solid transparent; }
.fc-watch-text { display: flex; flex-direction: column; gap: 2px; min-width: 0; overflow: hidden; }
.fc-watch small { font-weight: 700; font-size: 12px; color: var(--fc-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; max-width: min(42ch, 100%); }
.fc-item.fc-flash { animation: fc-flash 1.1s ease-in-out 2; }
@keyframes fc-flash { 50% { box-shadow: 0 0 0 3px rgba(244, 216, 143, .55); } }
@media (prefers-reduced-motion: reduce) { .fc-item.fc-flash { animation: none; box-shadow: 0 0 0 3px rgba(244, 216, 143, .55); } }