/* ════════════════════════════════════════════════════════════
   admin-studio.css — Site Studio surface (lives inside cc-panel).
   Reuses the Command Center tokens (admin-cc.css :root).
   ════════════════════════════════════════════════════════════ */

/* ── breadcrumb + save status bar ── */
.st-bar{display:flex;align-items:center;gap:12px;margin-bottom:14px;flex-wrap:wrap}
.st-crumbs{display:flex;align-items:center;gap:4px;flex-wrap:wrap;flex:1;min-width:0}
.st-crumb{background:none;border:0;color:var(--cc-text-dim);font:600 13px/1 var(--cc-sans);
  cursor:pointer;padding:5px 9px;border-radius:7px;transition:.15s;white-space:nowrap}
.st-crumb:hover{background:var(--cc-surface-2);color:var(--cc-text)}
.st-crumb.root{color:var(--cc-bronze)}
.st-crumb.cur{color:var(--cc-text);cursor:default;background:var(--cc-surface-2)}
.st-sep{color:var(--cc-shale);font-size:12px}
.st-status{font:600 12px/1 var(--cc-mono);min-width:78px;text-align:right}
.st-status.saving{color:var(--cc-bronze)}
.st-status.ok{color:var(--cc-olive)}
.st-status.err{color:var(--cc-terra)}

/* ── grade cards ── */
.st-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(212px,1fr));gap:12px;margin-top:14px}
.st-card{text-align:left;background:var(--cc-surface);border:1px solid var(--cc-border);
  border-radius:12px;padding:16px;cursor:pointer;transition:.16s;color:var(--cc-text);display:block}
.st-card:hover{border-color:var(--cc-bronze);transform:translateY(-2px);background:var(--cc-surface-2)}
.st-card-cyc{font:600 10px/1 var(--cc-mono);letter-spacing:.12em;text-transform:uppercase;color:var(--cc-shale)}
.st-card-nm{font:700 17px/1.2 var(--cc-serif,var(--cc-sans));margin:7px 0 6px;color:var(--cc-text)}
.st-card-meta{font:500 12px/1.3 var(--cc-sans);color:var(--cc-text-dim)}
.st-card-flag{margin-top:9px;font:600 11px/1 var(--cc-mono);color:var(--cc-terra)}
.st-card-ok{margin-top:9px;font:600 11px/1 var(--cc-mono);color:var(--cc-olive)}

/* ── generic list / rows ── */
.st-list{display:flex;flex-direction:column;gap:8px;background:var(--cc-surface);
  border:1px solid var(--cc-border-soft);border-radius:12px;padding:10px;margin:4px 0 14px}
.st-row{display:flex;align-items:center;gap:10px;background:var(--cc-surface-2);
  border:1px solid var(--cc-border-soft);border-radius:9px;padding:9px 11px;transition:.14s}
.st-row.drag{cursor:grab}
.st-row.dragging{opacity:.45}
.st-row.drop-into{border-color:var(--cc-bronze);box-shadow:0 0 0 1px var(--cc-bronze) inset}
.st-row.sys{opacity:.82;border-style:dashed}
.st-grip{color:var(--cc-shale);font-size:15px;cursor:grab;user-select:none}
.st-grip.ghost{cursor:default;color:var(--cc-shale-dim,var(--cc-shale))}
.st-row-ic{font-size:20px;width:26px;text-align:center}
.st-row-ic.big{font-size:30px;width:auto}
.st-row-main{flex:1;min-width:0;display:flex;flex-direction:column;gap:3px}
.st-row-sub{font:500 11px/1.2 var(--cc-sans);color:var(--cc-text-dim)}
.st-row-sub code,code.st-type{font:600 11px var(--cc-mono);color:var(--cc-bronze)}
.st-type{color:var(--cc-text-dim)}
.st-sysnm{font:700 14px/1.2 var(--cc-sans);color:var(--cc-text)}
.st-systag{color:var(--cc-shale);font-weight:600}

/* inline inputs */
.st-inp{background:var(--cc-bg);border:1px solid var(--cc-border-soft);border-radius:7px;
  color:var(--cc-text);font:500 13px/1.2 var(--cc-sans);padding:7px 9px;width:100%}
.st-inp:focus{outline:none;border-color:var(--cc-bronze);background:var(--cc-rail)}
.st-inp.nm{font-weight:600}
.st-inp.en{font-size:12px;color:var(--cc-text-dim)}
.st-inp.q{font-weight:600;font-size:14px}

.st-count{font:600 11px/1 var(--cc-mono);color:var(--cc-text-dim);white-space:nowrap}
.st-count.zero{color:var(--cc-terra)}
.st-track{font:600 10px/1 var(--cc-mono);color:var(--cc-aegean);text-transform:uppercase;letter-spacing:.06em}

/* buttons */
.st-open,.st-edit{background:var(--cc-surface-3);border:1px solid var(--cc-border);color:var(--cc-text);
  font:600 12px/1 var(--cc-sans);padding:8px 12px;border-radius:8px;cursor:pointer;white-space:nowrap;transition:.14s}
.st-open:hover,.st-edit:hover{border-color:var(--cc-bronze);color:var(--cc-bronze)}
.st-edit.ghost{background:none;border-style:dashed;color:var(--cc-shale);cursor:default}
.st-edit.ghost:hover{color:var(--cc-shale);border-color:var(--cc-border-soft)}
.st-del{background:none;border:1px solid var(--cc-border-soft);color:var(--cc-shale);
  width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:13px;transition:.14s;flex:0 0 auto}
.st-del:hover{border-color:var(--cc-terra);color:var(--cc-terra);background:color-mix(in srgb,var(--cc-terra) 8%,transparent)}
.st-tier{background:var(--cc-bg);border:1px solid var(--cc-border-soft);color:var(--cc-text-dim);
  font:600 11px var(--cc-sans);padding:6px 7px;border-radius:7px;cursor:pointer}
.st-add{margin-top:2px;background:linear-gradient(180deg,var(--cc-surface-3),var(--cc-surface-2));
  border:1px solid var(--cc-border);color:var(--cc-bronze);font:700 13px/1 var(--cc-sans);
  padding:11px 16px;border-radius:9px;cursor:pointer;display:inline-flex;align-items:center;gap:7px;transition:.15s}
.st-add:hover{border-color:var(--cc-bronze);background:var(--cc-surface-3)}
.st-add .ai{font-size:15px}

/* key chips (rhapsody letters / slice slugs) */
.st-key{font:700 14px/1 var(--cc-serif,var(--cc-sans));color:var(--cc-bronze);background:var(--cc-bg);
  border:1px solid var(--cc-border);border-radius:7px;min-width:30px;height:30px;display:inline-flex;
  align-items:center;justify-content:center;padding:0 8px}
.st-key.sm{font-size:12px;min-width:26px;height:26px}
.st-key.slug{font-family:var(--cc-mono);font-size:11px}

/* game header */
.st-gamehd{display:flex;align-items:center;gap:14px;background:var(--cc-surface);
  border:1px solid var(--cc-border);border-radius:12px;padding:14px 16px;margin:4px 0 12px}
.st-gamehd-nm{font:700 18px/1.1 var(--cc-serif,var(--cc-sans));color:var(--cc-text)}
.st-gamehd-sub{font:500 12px/1.3 var(--cc-sans);color:var(--cc-text-dim);margin-top:3px}
.st-gamehd-sub code{font:600 11px var(--cc-mono);color:var(--cc-bronze)}
.st-schema{margin-left:auto;font:600 11px/1 var(--cc-mono);color:var(--cc-aegean);
  border:1px solid var(--cc-border);border-radius:20px;padding:6px 11px;white-space:nowrap}

/* tabs */
.st-tabs{display:flex;gap:6px;border-bottom:1px solid var(--cc-border-soft);margin-bottom:14px}
.st-tab{background:none;border:0;border-bottom:2px solid transparent;color:var(--cc-text-dim);
  font:600 13px/1 var(--cc-sans);padding:10px 14px;cursor:pointer;margin-bottom:-1px}
.st-tab.on{color:var(--cc-bronze);border-bottom-color:var(--cc-bronze)}

/* questions */
.st-qlist{display:flex;flex-direction:column;gap:10px;margin:4px 0 14px}
.st-q{background:var(--cc-surface);border:1px solid var(--cc-border-soft);border-radius:11px;padding:12px}
.st-q.dragging{opacity:.45}
.st-q.drop-into{border-color:var(--cc-bronze)}
.st-q-hd{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.st-q-n{font:700 12px/1 var(--cc-mono);color:var(--cc-bronze);background:var(--cc-bg);
  border:1px solid var(--cc-border);border-radius:6px;min-width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center}
.st-opts{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.st-opt{display:flex;align-items:center;gap:8px;background:var(--cc-surface-2);
  border:1px solid var(--cc-border-soft);border-radius:8px;padding:6px 9px;cursor:pointer}
.st-opt.correct{border-color:var(--cc-olive);background:color-mix(in srgb,var(--cc-olive) 12%,transparent)}
.st-opt input[type=radio]{display:none}
.st-opt-dot{width:15px;height:15px;border-radius:50%;border:2px solid var(--cc-shale);flex:0 0 auto;transition:.14s}
.st-opt.correct .st-opt-dot{border-color:var(--cc-olive);background:var(--cc-olive);box-shadow:0 0 0 3px color-mix(in srgb,var(--cc-olive) 20%,transparent)}
.st-inp.o{border:0;background:none;padding:4px 2px}
.st-inp.o:focus{background:var(--cc-bg);border:1px solid var(--cc-border-soft)}

/* texts */
.st-text{background:var(--cc-surface);border:1px solid var(--cc-border-soft);border-radius:11px;padding:12px;margin-bottom:10px}
.st-text-hd{display:flex;align-items:center;gap:9px;margin-bottom:8px}
.st-text-body{width:100%;background:var(--cc-bg);border:1px solid var(--cc-border-soft);border-radius:8px;
  color:var(--cc-text);font:400 13px/1.5 var(--cc-serif,var(--cc-sans));padding:10px;resize:vertical}
.st-text-body:focus{outline:none;border-color:var(--cc-bronze)}

/* empty states */
.st-empty{text-align:center;padding:22px;color:var(--cc-text-dim);font:500 13px var(--cc-sans)}
.st-empty.big{padding:38px 22px}
.st-empty-ic{font-size:44px;opacity:.5;margin-bottom:10px}
.st-empty-t{font:700 16px var(--cc-sans);color:var(--cc-text);margin-bottom:5px}
.st-empty-s{font:500 13px var(--cc-sans);color:var(--cc-text-dim)}

/* badges + confirm detail lines */
.st-badge{font:600 10px/1 var(--cc-mono);padding:3px 7px;border-radius:5px;text-transform:uppercase}
.st-badge.free{color:var(--cc-olive);border:1px solid var(--cc-olive)}
.st-badge.student{color:var(--cc-bronze);border:1px solid var(--cc-bronze)}
.st-badge.teacher{color:var(--cc-aegean);border:1px solid var(--cc-aegean)}
.st-conf-lines{margin-top:12px;display:flex;flex-direction:column;gap:6px}
.st-conf-lines>div{display:flex;justify-content:space-between;font:500 12px var(--cc-sans);
  color:var(--cc-text-dim);border-top:1px solid var(--cc-border-soft);padding-top:6px}
.st-conf-lines b{color:var(--cc-text)}

/* add-game picker grid (rendered into #cc-confirm-modal) */
.st-pickgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:9px;margin:14px 0}
.st-pick{display:flex;flex-direction:column;align-items:flex-start;gap:5px;text-align:left;
  background:var(--cc-surface-2);border:1px solid var(--cc-border);border-radius:10px;padding:12px;cursor:pointer;transition:.14s;color:var(--cc-text)}
.st-pick:hover{border-color:var(--cc-bronze);background:var(--cc-surface-3)}
.st-pick-ic{font-size:22px}
.st-pick-nm{font:700 13px/1.2 var(--cc-sans)}
.st-pick-k{font:600 10px/1 var(--cc-mono);color:var(--cc-shale)}

/* ── paradigm table editor ── */
.pt-axes{display:flex;flex-wrap:wrap;gap:18px;background:var(--cc-surface);
  border:1px solid var(--cc-border-soft);border-radius:11px;padding:13px;margin-bottom:14px}
.pt-axgrp{display:flex;flex-direction:column;gap:7px}
.pt-axlbl{font:600 10px/1 var(--cc-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cc-shale)}
.pt-chips{display:flex;flex-wrap:wrap;gap:6px;align-items:center}
.pt-chip{display:inline-flex;align-items:center;gap:3px;background:var(--cc-surface-2);
  border:1px solid var(--cc-border-soft);border-radius:7px;padding:2px 4px}
.pt-axin{background:none;border:0;color:var(--cc-text);font:600 12px var(--cc-sans);padding:4px 6px;width:118px}
.pt-axin:focus{outline:none}
.pt-x{background:none;border:0;color:var(--cc-shale);cursor:pointer;font-size:11px;padding:0 4px}
.pt-x:hover{color:var(--cc-terra)}
.pt-addax{background:var(--cc-surface-3);border:1px solid var(--cc-border);color:var(--cc-bronze);
  width:26px;height:26px;border-radius:7px;cursor:pointer;font-size:14px}
.pt-entry{background:var(--cc-surface);border:1px solid var(--cc-border-soft);border-radius:11px;padding:12px;margin-bottom:12px}
.pt-entry-hd{display:flex;align-items:center;gap:9px;margin-bottom:10px}
.pt-lemma{flex:0 0 auto;background:var(--cc-bg);border:1px solid var(--cc-border);border-radius:7px;
  color:var(--cc-bronze);font:700 14px var(--cc-serif,var(--cc-sans));padding:7px 10px;min-width:160px}
.pt-meta{flex:1;background:var(--cc-bg);border:1px solid var(--cc-border-soft);border-radius:7px;
  color:var(--cc-text-dim);font:500 12px var(--cc-sans);padding:7px 10px}
.pt-lemma:focus,.pt-meta:focus{outline:none;border-color:var(--cc-bronze)}
.pt-wrap{overflow-x:auto}
.pt{border-collapse:collapse;width:100%;min-width:340px}
.pt th,.pt td{border:1px solid var(--cc-border-soft);padding:0}
.pt-corner{background:var(--cc-rail)}
.pt-colh,.pt-rowh{background:var(--cc-surface-2);color:var(--cc-text-dim);
  font:600 11px var(--cc-sans);padding:7px 9px;text-align:center;white-space:nowrap}
.pt-rowh{text-align:right}
.pt-cell{width:100%;min-width:96px;background:none;border:0;color:var(--cc-text);
  font:500 13px var(--cc-serif,var(--cc-sans));padding:8px 9px;text-align:center}
.pt-cell:focus{outline:none;background:var(--cc-rail);box-shadow:0 0 0 1px var(--cc-bronze) inset}

/* note variant */
.cc-note.warn{border-left:3px solid var(--cc-terra)}

@media(max-width:640px){
  .st-opts{grid-template-columns:1fr}
  .st-row{flex-wrap:wrap}
  .st-row-main{flex-basis:100%;order:5}
}

/* ── Levels & Access panel (inline per-class curriculum) ── */
.st-la{margin-top:18px;background:var(--cc-surface);border:1px solid var(--cc-border);border-radius:12px;padding:14px 16px}
.st-la-hd{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;margin-bottom:12px}
.st-la-title{font:700 15px/1.2 var(--cc-serif,var(--cc-sans));color:var(--cc-text)}
.st-la-sub{font:600 10px/1 var(--cc-mono);color:var(--cc-shale);text-transform:uppercase;letter-spacing:.08em;margin-left:6px}
.st-la-tabs{display:flex;flex-wrap:wrap;gap:5px}
.st-la-cls{background:var(--cc-surface-2);border:1px solid var(--cc-border-soft);color:var(--cc-text-dim);
  font:600 12px/1 var(--cc-sans);padding:7px 11px;border-radius:7px;cursor:pointer;transition:.14s}
.st-la-cls:hover{border-color:var(--cc-bronze);color:var(--cc-text)}
.st-la-cls.on{background:var(--cc-surface-3);border-color:var(--cc-bronze);color:var(--cc-bronze)}
.st-la-enable{display:inline-flex;align-items:center;gap:9px;cursor:pointer;font:600 13px var(--cc-sans);color:var(--cc-text);
  background:var(--cc-surface-2);border:1px solid var(--cc-border-soft);border-radius:8px;padding:9px 12px}
.st-la-enable input{width:16px;height:16px;accent-color:var(--cc-bronze);cursor:pointer}
.st-la-foot{margin-top:12px;font:500 11px/1.4 var(--cc-sans);color:var(--cc-shale);border-top:1px solid var(--cc-border-soft);padding-top:9px}
.st-la-foot code{font:600 11px var(--cc-mono);color:var(--cc-bronze)}

/* ── Add-game picker: Existing/New tabs + categorised grid ── */
.st-pick-tabs{display:flex;gap:6px;margin:6px 0 4px}
.st-pick-tab{background:var(--cc-surface-2);border:1px solid var(--cc-border-soft);color:var(--cc-text-dim);
  font:600 12px/1 var(--cc-sans);padding:8px 13px;border-radius:8px;cursor:pointer;transition:.14s}
.st-pick-tab:hover{border-color:var(--cc-bronze);color:var(--cc-text)}
.st-pick-tab.on{background:var(--cc-surface-3);border-color:var(--cc-bronze);color:var(--cc-bronze)}
.st-pickwrap{max-height:48vh;overflow-y:auto;margin:4px -4px 0;padding:0 4px}
.st-pick-cat{font:700 11px/1 var(--cc-mono);letter-spacing:.08em;text-transform:uppercase;color:var(--cc-bronze);
  margin:12px 2px 6px;padding-top:8px;border-top:1px solid var(--cc-border-soft)}
.st-pick-cat:first-child{border-top:0;padding-top:0;margin-top:4px}
.st-bulkbar{margin:4px 0 14px}

/* ════════════════════════════════════════════════════════════
   PORTED FROM VER1 — Site Studio new-feature styles:
   trivia playtest button · two-button bulkbar · Trivia Subjects
   editor · bulk CSV/JSON import · per-type question editor · istoria embed
   ════════════════════════════════════════════════════════════ */
.st-preview{flex-shrink:0;display:inline-flex;align-items:center;gap:6px;cursor:pointer;
  font:700 12.5px/1 var(--cc-sans);letter-spacing:.04em;color:#1a1206;
  background:linear-gradient(135deg,var(--cc-bronze,#D4AE58),var(--cc-bronze-s,#B8954A));
  border:1px solid var(--cc-bronze-s,#B8954A);border-radius:8px;padding:9px 15px;
  box-shadow:0 6px 16px -8px rgba(212,174,88,.9);transition:transform .12s,filter .12s}
.st-preview:hover{transform:translateY(-1px);filter:brightness(1.06)}
.st-preview:active{transform:translateY(0)}
.st-bulkbar{display:flex;flex-wrap:wrap;gap:9px;margin:4px 0 14px}
/* ════════════════════════════════════════════════════════════
   Trivia Subjects editor (Site Studio section · admin-studio.js)
   ════════════════════════════════════════════════════════════ */
.st-add.ts-entry{color:var(--cc-aegean);border-color:color-mix(in srgb,var(--cc-aegean) 36%,var(--cc-border))}
.st-add.ts-entry:hover{border-color:var(--cc-aegean);color:var(--cc-aegean)}

/* glyph preview (inline line-art from panel.js) */
.ts-glyph{color:var(--cc-bronze);width:26px;height:26px;flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center}
.ts-glyph.big{width:38px;height:38px}
.ts-glyph svg{width:100%;height:100%;display:block}

/* up/down reorder */
.ts-reorder{display:flex;flex-direction:column;gap:2px;flex:0 0 auto}
.ts-arrow{background:var(--cc-surface-3);border:1px solid var(--cc-border-soft);color:var(--cc-text-dim);
  width:22px;height:16px;line-height:1;border-radius:5px;cursor:pointer;font-size:9px;padding:0;transition:.14s}
.ts-arrow:hover:not(:disabled){border-color:var(--cc-bronze);color:var(--cc-bronze)}
.ts-arrow:disabled{opacity:.3;cursor:default}

/* list footer: new key + add + export */
.ts-newrow{display:flex;flex-wrap:wrap;align-items:center;gap:9px;margin-top:4px}
.ts-newrow .st-inp{width:auto;flex:1;min-width:180px;max-width:280px}
.st-add.ts-export{color:var(--cc-aegean);border-color:color-mix(in srgb,var(--cc-aegean) 32%,var(--cc-border));margin-left:auto}
.st-add.ts-export:hover{border-color:var(--cc-aegean);color:var(--cc-aegean)}

/* export-to-code panel */
.ts-code-wrap{margin-top:12px;background:var(--cc-surface);border:1px solid var(--cc-border);border-radius:12px;overflow:hidden}
.ts-code-hd{display:flex;align-items:flex-start;gap:12px;padding:11px 13px;border-bottom:1px solid var(--cc-border-soft);
  font:500 12px/1.4 var(--cc-sans);color:var(--cc-text-dim)}
.ts-code-hd code{font:600 11px var(--cc-mono);color:var(--cc-bronze)}
.ts-code-actions{margin-left:auto;display:flex;gap:6px;flex:0 0 auto}
.ts-code{display:block;width:100%;border:0;background:var(--cc-bg);color:var(--cc-text);
  font:500 12px/1.55 var(--cc-mono);padding:13px;resize:vertical;white-space:pre;tab-size:2}
.ts-code:focus{outline:none}

/* grouped form */
.ts-group{background:var(--cc-surface);border:1px solid var(--cc-border-soft);border-radius:12px;padding:13px 15px;margin-bottom:12px}
.ts-group-h{font:700 11px/1 var(--cc-mono);letter-spacing:.1em;text-transform:uppercase;color:var(--cc-bronze);
  margin-bottom:12px;display:flex;align-items:baseline;gap:9px;flex-wrap:wrap}
.ts-group-note{font:500 10px/1 var(--cc-mono);letter-spacing:.04em;text-transform:none;color:var(--cc-shale)}
.ts-fgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(184px,1fr));gap:11px}
.ts-fcol{display:flex;flex-direction:column;gap:11px}
.ts-field{display:flex;flex-direction:column;gap:5px;min-width:0}
.ts-flabel{font:600 11px/1.2 var(--cc-sans);color:var(--cc-text-dim);display:flex;align-items:center;gap:6px}
.ts-flabel.hot{color:var(--cc-bronze)}
.ts-hot-tag{font:700 8.5px/1 var(--cc-mono);letter-spacing:.1em;text-transform:uppercase;color:#1a1206;
  background:var(--cc-bronze);border-radius:4px;padding:2px 5px}
.ts-bil{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.ts-ro{background:var(--cc-rail);color:var(--cc-text-dim);font-family:var(--cc-mono);cursor:default}
.ts-sel{cursor:pointer;appearance:auto}

/* sections chips */
.ts-secs{display:flex;flex-wrap:wrap;gap:7px;align-items:center}
.ts-sec{display:inline-flex;align-items:center;gap:2px;background:var(--cc-surface-2);
  border:1px solid var(--cc-border-soft);border-radius:8px;padding:2px 3px 2px 2px;transition:.14s}
.ts-sec.start{border-color:color-mix(in srgb,var(--cc-olive) 55%,var(--cc-border));background:color-mix(in srgb,var(--cc-olive) 10%,transparent)}
.ts-sec-star{background:none;border:0;cursor:pointer;font-size:12px;line-height:1;padding:4px 3px;color:var(--cc-shale);transition:.14s}
.ts-sec-star:hover{color:var(--cc-olive)}
.ts-sec.start .ts-sec-star{color:var(--cc-olive)}
.ts-sec-in{background:var(--cc-bg);border:1px solid transparent;border-radius:6px;color:var(--cc-text);
  font:600 13px/1 var(--cc-serif,var(--cc-sans));padding:6px 7px;width:62px;text-align:center}
.ts-sec-in:focus{outline:none;border-color:var(--cc-bronze)}
.ts-sec-x{background:none;border:0;color:var(--cc-shale);cursor:pointer;font-size:11px;padding:0 4px}
.ts-sec-x:hover{color:var(--cc-terra)}
.ts-sec-add{background:var(--cc-surface-3);border:1px solid var(--cc-border);color:var(--cc-bronze);
  width:30px;height:30px;border-radius:8px;cursor:pointer;font-size:15px;transition:.14s}
.ts-sec-add:hover{border-color:var(--cc-bronze);background:var(--cc-surface-2)}

@media(max-width:640px){
  .ts-bil{grid-template-columns:1fr}
  .ts-newrow .st-inp{max-width:none}
  .st-add.ts-export{margin-left:0}
}

/* ── bulk question import (CSV / JSON) ── */
.st-qactions{display:flex;flex-wrap:wrap;gap:9px;align-items:center;margin-top:2px}
.qimp-file{display:none}
.st-add.qimp-btn{color:var(--cc-aegean);border-color:color-mix(in srgb,var(--cc-aegean) 32%,var(--cc-border))}
.st-add.qimp-btn:hover{border-color:var(--cc-aegean);color:var(--cc-aegean)}
.qimp-hint{font:500 11px/1.5 var(--cc-sans);color:var(--cc-text-dim);margin:9px 2px 0}
.qimp-hint code{font:600 10.5px var(--cc-mono);color:var(--cc-bronze)}
.qimp-panel{margin-top:12px;background:var(--cc-surface);border:1px solid var(--cc-border);border-radius:12px;padding:13px 15px}
.qimp-hd{display:flex;align-items:center;gap:8px;font:500 13px var(--cc-sans);color:var(--cc-text);margin-bottom:10px}
.qimp-hd .st-del{margin-left:auto}
.qimp-ok-n{font:700 14px var(--cc-mono);color:var(--cc-olive)}
.qimp-err{color:var(--cc-terra);font-weight:600}
.qimp-errors{background:color-mix(in srgb,var(--cc-terra) 8%,transparent);border:1px solid color-mix(in srgb,var(--cc-terra) 30%,var(--cc-border));
  border-radius:8px;padding:8px 11px;margin-bottom:10px;font:500 11.5px/1.55 var(--cc-mono);color:var(--cc-terra)}
.qimp-preview{display:flex;flex-direction:column;gap:7px;margin-bottom:12px}
.qimp-pq{background:var(--cc-surface-2);border:1px solid var(--cc-border-soft);border-radius:9px;padding:9px 11px}
.qimp-pq>b{display:block;font:600 13px/1.3 var(--cc-sans);color:var(--cc-text);margin-bottom:6px}
.qimp-po{display:flex;flex-wrap:wrap;gap:6px}
.qimp-po span{font:500 11.5px/1 var(--cc-sans);color:var(--cc-text-dim);background:var(--cc-bg);
  border:1px solid var(--cc-border-soft);border-radius:6px;padding:5px 9px}
.qimp-po span.ok{color:var(--cc-olive);border-color:color-mix(in srgb,var(--cc-olive) 55%,var(--cc-border));background:color-mix(in srgb,var(--cc-olive) 10%,transparent)}
.qimp-more{font:600 11px var(--cc-mono);color:var(--cc-shale);padding:2px}
.qimp-actions{display:flex;flex-wrap:wrap;gap:9px;align-items:center}

/* ── reimagined question editor (per-type authoring) ── */
.st-qtype{background:var(--cc-bg);border:1px solid var(--cc-border-soft);color:var(--cc-text);
  font:600 11px var(--cc-sans);padding:5px 7px;border-radius:7px;cursor:pointer;flex:0 0 auto}
.st-qtype:focus{outline:none;border-color:var(--cc-bronze)}
.st-typebadge{font:700 8.5px/1 var(--cc-mono);letter-spacing:.07em;text-transform:uppercase;
  padding:3px 6px;border-radius:5px;flex:0 0 auto;white-space:nowrap}
.st-typebadge.plays{color:var(--cc-olive);border:1px solid color-mix(in srgb,var(--cc-olive) 55%,var(--cc-border))}
.st-typebadge.stored{color:var(--cc-aegean);border:1px solid color-mix(in srgb,var(--cc-aegean) 50%,var(--cc-border))}
.st-q.t-tf{border-left:3px solid color-mix(in srgb,var(--cc-olive) 55%,transparent)}
.st-q.t-fill,.st-q.t-match,.st-q.t-order{border-left:3px solid color-mix(in srgb,var(--cc-aegean) 55%,transparent)}
.st-add.sm{font-size:11px;padding:6px 11px;margin-top:6px}
.st-opt-del{background:none;border:0;color:var(--cc-shale);cursor:pointer;font-size:11px;padding:0 4px;flex:0 0 auto}
.st-opt-del:hover{color:var(--cc-terra)}
.st-opt-dot.off{opacity:.25}
.st-fill{display:flex;flex-direction:column;gap:7px}
.st-fill .st-flabel{font:600 11px var(--cc-sans);color:var(--cc-text-dim)}
.st-fill .st-flabel code{font:600 11px var(--cc-mono);color:var(--cc-bronze)}
.st-fill-sub{font:500 10.5px var(--cc-mono);color:var(--cc-shale);margin-top:4px}
.st-pairs{display:flex;flex-direction:column;gap:7px}
.st-pair{display:flex;align-items:center;gap:8px}
.st-pair-arrow{color:var(--cc-bronze);font-size:13px;flex:0 0 auto}
.st-seq{display:flex;flex-direction:column;gap:6px}
.st-seqitem{display:flex;align-items:center;gap:8px}
.st-seq-n{font:700 12px/1 var(--cc-mono);color:var(--cc-bronze);background:var(--cc-bg);border:1px solid var(--cc-border);
  border-radius:6px;min-width:24px;height:24px;display:inline-flex;align-items:center;justify-content:center;flex:0 0 auto}
.st-embed{width:100%;height:78vh;min-height:560px;border:1px solid var(--cc-border);border-radius:10px;margin-top:14px;background:var(--cc-bg);display:block}
.st-addsel{font:700 12.5px/1 var(--cc-sans);color:var(--cc-bronze);background:linear-gradient(180deg,var(--cc-surface-3),var(--cc-surface-2));
  border:1px solid var(--cc-border);border-radius:9px;padding:11px 14px;cursor:pointer;appearance:auto}
.st-addsel:hover{border-color:var(--cc-bronze);background:var(--cc-surface-3)}
.st-addsel:focus{outline:none;border-color:var(--cc-bronze)}