/* Foundry admin. Builds on audit.css tokens. */
.fd-page { max-width: 1240px; margin: 0 auto; padding: 22px 22px 70px; font-size: 15px; }
.fd-top { display: flex; align-items: flex-end; gap: 16px; flex-wrap: wrap; margin-bottom: 18px; }
.fd-top h1 { margin: 2px 0 0; font-size: 26px; font-weight: 700; letter-spacing: -.02em; }
.fd-kicker { font-size: 12px; font-weight: 650; letter-spacing: .05em; text-transform: uppercase; color: var(--brand-int); }
.fd-tabs { margin-left: auto; display: inline-flex; gap: 6px; }
.fd-tab { border: 1px solid var(--hairline); background: var(--surface); color: var(--muted); font: inherit; font-size: 14px;
  font-weight: 600; border-radius: 999px; padding: 6px 14px; cursor: pointer; }
.fd-tab:hover { border-color: var(--brand-int); color: var(--text); }
.fd-tab.is-on { border-color: var(--brand-int); color: var(--brand-int); background: var(--brand-soft); }
.fd-pane[hidden] { display: none; }
.fd-sub { margin: 0 0 16px; color: var(--muted); max-width: 820px; }
.fd-panel { border: 1px solid var(--hairline); border-radius: 12px; background: var(--bg-elev); padding: 16px 18px; margin-bottom: 16px; }
.fd-panel[hidden] { display: none; }
.fd-kpis { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; margin-bottom: 16px; }
.fd-kpis.sm .fd-kv { font-size: 20px; }
@media (max-width: 900px) { .fd-kpis { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
.fd-kpi { border: 1px solid var(--hairline); border-radius: 12px; background: var(--bg-elev); padding: 14px 16px; }
.fd-kl { font-size: 12px; font-weight: 650; text-transform: uppercase; letter-spacing: .04em; color: var(--muted); }
.fd-kv { font-size: 26px; font-weight: 700; margin: 4px 0 2px; }
.fd-ks { color: var(--muted); font-size: 13px; }
.fd-head { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; margin-bottom: 10px; }
.fd-head h2 { margin: 0; font-size: 17px; }
.fd-head > :last-child:not(h2) { margin-left: auto; }
.fd-legend { display: flex; gap: 14px; flex-wrap: wrap; color: var(--muted); font-size: 13px; margin-left: auto; }
.fd-legend i { display: inline-block; width: 10px; height: 10px; border-radius: 3px; margin-right: 5px; vertical-align: -1px; }
.fd-table { width: 100%; border-collapse: collapse; }
.fd-table th { text-align: left; font-size: 12px; color: var(--muted); font-weight: 650; padding: 9px 10px; border-bottom: 1px solid var(--hairline); white-space: nowrap; }
.fd-table th[data-sort] { cursor: pointer; } .fd-table th[data-sort]:hover { color: var(--text); }
.fd-table th.is-sorted { color: var(--brand-int); }
.fd-table th[data-dir="asc"]::after { content: " \2191"; } .fd-table th[data-dir="desc"]::after { content: " \2193"; }
.fd-table td { padding: 10px; border-bottom: 1px solid var(--hairline); }
.fd-table tr:last-child td { border-bottom: 0; }
.fd-table .n { text-align: right; font-variant-numeric: tabular-nums; }
.fd-row { cursor: pointer; } .fd-row:hover td, .fd-row:focus td { background: var(--brand-soft); outline: none; }
.fd-code { color: var(--faint); font-size: 12px; margin-left: 4px; }
.fd-mix { display: flex; height: 9px; width: 220px; max-width: 100%; border-radius: 9px; overflow: hidden; background: var(--hairline); }
.fd-mix span { display: block; height: 100%; }
.fd-rank { font-size: 12px; font-weight: 650; border: 1px solid var(--rc); color: var(--rc); border-radius: 999px; padding: 1px 9px; }
.fd-none { color: var(--faint); font-size: 13px; }
.fd-note { color: var(--muted); font-size: 13px; margin: 0 0 10px; }
.fd-search, .fd-select { font: inherit; font-size: 14px; color: var(--text); background: var(--surface); border: 1px solid var(--hairline); border-radius: 999px; padding: 6px 12px; }
.fd-search { min-width: 260px; margin-left: auto; }
.fd-search:focus, .fd-select:focus { outline: none; border-color: var(--brand-int); }

/* one learner */
.ln-ranks { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 12px; }
.ln-rank { border: 1px solid var(--hairline); border-radius: 10px; padding: 10px 12px; }
.ln-rh { display: flex; justify-content: space-between; gap: 8px; margin-bottom: 6px; } .ln-rh span { color: var(--muted); font-size: 13px; }
.ln-rank ul { list-style: none; margin: 0; padding: 0; }
.ln-m { display: grid; grid-template-columns: 92px 1fr auto; gap: 8px; padding: 5px 0; border-top: 1px solid var(--hairline); font-size: 13px; }
.ln-k { color: var(--muted); } .ln-s { color: var(--muted); white-space: nowrap; }
.ln-m.is-done .ln-s { color: var(--success); } .ln-m.is-locked { opacity: .55; }

/* courses */
.fd-courses { display: grid; grid-template-columns: 340px minmax(0, 1fr); gap: 16px; align-items: start; }
@media (max-width: 1000px) { .fd-courses { grid-template-columns: 1fr; } }
.fd-list { position: sticky; top: calc(var(--topbar-h) + 12px); max-height: calc(100vh - var(--topbar-h) - 40px); overflow-y: auto; }
.cr-rank { margin-bottom: 12px; }
.cr-rh { font-weight: 700; font-size: 13px; text-transform: uppercase; letter-spacing: .05em; color: var(--brand-int); padding: 6px 0; border-bottom: 1px solid var(--hairline); }
.cr-rh span { color: var(--faint); text-transform: none; letter-spacing: 0; font-weight: 500; }
.cr-course { font-size: 12px; color: var(--faint); padding: 8px 0 2px 6px; }
.cr-item { display: flex; align-items: center; gap: 4px; border-radius: 8px; }
.cr-item.is-on { background: var(--brand-soft); }
.cr-open { flex: 1; min-width: 0; display: flex; gap: 8px; align-items: center; text-align: left; border: 0; background: none; font: inherit;
  font-size: 14px; color: var(--text); padding: 6px; cursor: pointer; border-radius: 8px; }
.cr-open:hover .cr-title { color: var(--brand-int); }
.cr-title { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-gone { color: var(--muted); text-decoration: line-through; padding: 6px; }
.cr-kind { width: 22px; height: 22px; border-radius: 6px; border: 1px solid var(--hairline); display: inline-grid; place-items: center;
  font-size: 11px; font-weight: 700; color: var(--muted); flex: none; }
.cr-kind.k-challenge { color: #B45309; border-color: #B45309; } .cr-kind.k-practice { color: #0F766E; border-color: #0F766E; }
.cr-kind.k-check { color: #7c3aed; border-color: #7c3aed; } .cr-kind.k-video { color: var(--brand-int); border-color: var(--brand-int); }
.cr-badge { font-size: 11px; font-weight: 650; border: 1px solid; border-radius: 6px; padding: 0 6px; color: #7c3aed; flex: none; }
.cr-badge.console { color: var(--success); }
.cr-move { display: inline-flex; }
.cr-move button { border: 0; background: none; color: var(--faint); cursor: pointer; padding: 2px 5px; font-size: 13px; border-radius: 6px; }
.cr-move button:hover:not(:disabled) { color: var(--brand-int); background: var(--surface); }
.cr-move button:disabled { opacity: .3; cursor: default; }
.cr-src { color: var(--muted); font-size: 13px; }
.cr-form { display: flex; flex-direction: column; gap: 12px; }
.cr-form label { display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--muted); }
.cr-form label.cr-inline { flex-direction: row; align-items: center; gap: 6px; color: var(--text); }
.cr-form input:not([type=checkbox]), .cr-form select, .cr-form textarea {
  font: inherit; font-size: 14px; font-weight: 400; color: var(--text); background: var(--surface);
  border: 1px solid var(--hairline); border-radius: 8px; padding: 7px 10px; }
.cr-form input:focus, .cr-form select:focus, .cr-form textarea:focus { outline: none; border-color: var(--brand-int); }
.cr-form input[readonly] { color: var(--muted); background: var(--bg); }
.cr-form textarea { resize: vertical; line-height: 1.5; }
.cr-mono { font-family: ui-monospace, Consolas, monospace; font-size: 13px !important; }
.cr-hint { font-weight: 400; color: var(--faint); }
.cr-hint code { font-size: 12px; }
.cr-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; align-items: end; }
.cr-set { border: 1px solid var(--hairline); border-radius: 10px; padding: 10px 14px 14px; margin: 0; display: flex; flex-direction: column; gap: 10px; }
.cr-set legend { font-weight: 650; padding: 0 4px; }
.cr-ex[hidden] { display: none; }
.cr-q, .cr-link { border-top: 1px dashed var(--hairline); padding-top: 10px; display: flex; flex-direction: column; gap: 8px; }
.cr-link { display: grid; }
.cr-q > .btn-ghost, .cr-link > .btn-ghost { align-self: flex-start; }
.cr-actions { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; border-top: 1px solid var(--hairline); padding-top: 12px; }
.cr-actions a.btn-ghost { text-decoration: none; }
.cr-status { font-size: 13px; color: var(--muted); }
.cr-status.ok { color: var(--success); } .cr-status.bad { color: var(--danger, #C0392B); }
#crRemove.is-armed { color: var(--danger, #C0392B); border-color: var(--danger, #C0392B); }
.cr-video[hidden] { display: none; }

/* the course library and the builder */
.fd-pill { border: 1px solid var(--hairline); border-radius: 999px; padding: 4px 12px; background: var(--surface); font: inherit;
  font-size: 13px; font-weight: 550; color: var(--text); cursor: pointer; }
.fd-pill:hover { border-color: var(--brand-int); }
.fd-pill.is-on { border-color: var(--brand-int); color: var(--brand-int); background: var(--brand-soft); }
.cr-filters { display: flex; gap: 6px; flex-wrap: wrap; margin: 4px 0 12px; }
.cr-top-actions { display: flex; gap: 8px; margin-left: auto; align-self: flex-start; }
.cr-top-actions .btn-primary:disabled { opacity: .55; cursor: not-allowed; }
.cr-lib td { vertical-align: middle; }
.cr-ct { font-weight: 600; } .cr-cm { color: var(--muted); font-size: 12px; }
.cr-chips { display: flex; gap: 4px; }
.cr-st { font-size: 12px; font-weight: 650; border: 1px solid; border-radius: 999px; padding: 2px 9px; white-space: nowrap; }
.cr-st.s-pub { color: var(--success); } .cr-st.s-edit { color: #7c3aed; } .cr-st.s-new { color: var(--brand-int); }
.cr-removed { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; border-top: 1px solid var(--hairline); margin-top: 12px; padding-top: 12px; font-size: 13px; color: var(--muted); }
.cr-bh { display: flex; align-items: center; gap: 12px; flex-wrap: wrap; padding-bottom: 12px; border-bottom: 1px solid var(--hairline); }
.cr-bt { flex: 1; min-width: 240px; } .cr-bt h2 { margin: 2px 0 0; font-size: 19px; }
.cr-cols { display: grid; grid-template-columns: 300px minmax(0, 1fr); gap: 18px; padding-top: 14px; }
@media (max-width: 1000px) { .cr-cols { grid-template-columns: 1fr; } }
.cr-stages { display: flex; flex-direction: column; gap: 6px; }
.cr-stage { display: flex; align-items: center; gap: 4px; border: 1px solid var(--hairline); border-radius: 10px; background: var(--surface); padding: 2px; }
.cr-stage.is-sel { border-color: var(--brand-int); box-shadow: 0 0 0 1px var(--brand-int) inset; }
.cr-sm { flex: 1; min-width: 0; display: flex; flex-direction: column; }
.cr-sk { font-size: 11px; color: var(--muted); font-weight: 600; }
.cr-stt { font-weight: 600; font-size: 13px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.cr-add { border: 1px dashed var(--hairline); border-radius: 10px; padding: 9px; background: none; color: var(--brand-int); font: inherit; font-size: 13px; font-weight: 600; cursor: pointer; }
.cr-add:hover { border-color: var(--brand-int); }
.cr-editor .fd-head { align-items: flex-start; }
.cr-editor .fd-head > div { flex: 1; }
.cr-et { margin: 0; font-size: 18px; }

/* generate with AI and drafts. AI-drafted text stays purple until a person reviews it. */
.fd-ic { width: 15px; height: 15px; flex: none; vertical-align: -2px; }
.btn-primary .fd-ic, .btn-ghost .fd-ic { margin-right: 5px; }
.ai-tag { display: inline-flex; align-items: center; gap: 4px; font-size: 12px; font-weight: 650; color: #7c3aed;
  border: 1px solid #7c3aed; border-radius: 999px; padding: 1px 9px; white-space: nowrap; }
.ai-tag .fd-ic { width: 12px; height: 12px; }
.cr-st.s-ai { color: #7c3aed; } .cr-st.s-bad { color: var(--danger, #C0392B); }
.cr-badge.ai { color: #7c3aed; } .cr-badge.warn { color: #B45309; }
.cr-drafts { border: 1px solid var(--hairline); border-radius: 10px; padding: 6px 12px 4px; margin: 4px 0 14px; }
.cr-drafts h3 { font-size: 14px; margin: 6px 0 2px; }
.gen-glyph { width: 34px; height: 34px; border-radius: 9px; display: grid; place-items: center; color: #7c3aed; border: 1px solid #7c3aed; flex: none; }
.gen-glyph .fd-ic { width: 18px; height: 18px; }
.gen .cr-bh .fd-note { margin: 4px 0 0; }
.gen-form { padding-top: 14px; max-width: 860px; }
.gen-q { width: 100%; }
.gen-picked { display: flex; flex-wrap: wrap; gap: 6px; }
.gen-src { display: inline-flex; align-items: center; gap: 4px; font-size: 13px; border: 1px solid var(--hairline); border-radius: 999px; padding: 2px 4px 2px 10px; background: var(--surface); }
.dr-meta .gen-src { padding-right: 10px; }
.gen-src a { color: inherit; }
.gen-src button { border: 0; background: none; color: var(--faint); cursor: pointer; font-size: 15px; line-height: 1; padding: 0 4px; border-radius: 50%; }
.gen-src button:hover { color: var(--danger, #C0392B); }
.gen-results { display: flex; flex-direction: column; max-height: 300px; overflow-y: auto; }
.gen-results:empty { display: none; }
.gen-hit { display: flex; gap: 10px; align-items: center; padding: 8px 2px; border-top: 1px solid var(--hairline); }
.gen-hit > div { flex: 1; min-width: 0; }
.gen-ht { font-weight: 600; font-size: 14px; }
.gen-hs { color: var(--muted); font-size: 12px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gen-ticks { display: flex; flex-wrap: wrap; gap: 8px; }
.gen-tick { flex-direction: row !important; align-items: center; gap: 7px !important; border: 1px solid var(--hairline); border-radius: 10px;
  padding: 6px 10px; color: var(--text) !important; cursor: pointer; }
.gen-tick:has(input:checked) { border-color: var(--brand-int); background: var(--brand-soft); }
.dr-meta { display: flex; flex-wrap: wrap; gap: 6px; align-items: center; padding: 10px 0 0; }
.dr-why { margin: 12px 0 0; font-size: 13px; color: #B45309; } .dr-why.ok { color: var(--success); }
.cr-review { display: flex; gap: 8px; align-items: center; flex-wrap: wrap; border: 1px solid #7c3aed; border-radius: 10px;
  padding: 9px 12px; color: var(--muted); font-size: 14px; margin-bottom: 12px; }
.cr-review.is-ok { border-color: var(--hairline); color: var(--success); }
.cr-problem { border: 1px solid #B45309; color: #B45309; border-radius: 10px; padding: 8px 12px; font-size: 13px; margin: 0 0 12px; }
.dr-redraft { display: flex; gap: 8px; align-items: flex-end; flex-wrap: wrap; border: 1px dashed #7c3aed; border-radius: 10px; padding: 10px 12px; margin-bottom: 12px; }
.dr-redraft[hidden] { display: none; }
.dr-redraft label { flex: 1; min-width: 240px; display: flex; flex-direction: column; gap: 4px; font-size: 13px; font-weight: 600; color: var(--muted); }
.dr-redraft input { font: inherit; font-size: 14px; color: var(--text); background: var(--surface); border: 1px solid var(--hairline); border-radius: 8px; padding: 7px 10px; }
#drDiscard.is-armed, #drRemoveStage.is-armed { color: var(--danger, #C0392B); border-color: var(--danger, #C0392B); }
.btn-primary:disabled { opacity: .55; cursor: not-allowed; }
.cr-st.s-rev { color: #B45309; }
.gen-hit .btn-ghost:disabled { opacity: .4; cursor: default; }