/* Question bank, team quiz, skill checklists, search, print. */
/* ── Quiz bank, team quiz, skill checklists, search ── */
.q .why { font-size: .84rem; color: var(--ink-2); border-left: 3px solid var(--p2); padding-left: 10px; }
.bank-list { display: flex; flex-direction: column; gap: 8px; }
.bank-list li { font-size: .88rem; }
.bank-list li b { display: block; }
.bank-list li span { color: var(--ok); font-weight: 600; }
.quiz-tools { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; }

.lesson.teamq { overflow: hidden; }
.lesson.teamq .lesson-head { display: none; }
.tq { position: fixed; inset: 0; z-index: 5; overflow-y: auto; color: #EEF2F8; background: radial-gradient(120% 90% at 85% 0%, #1A3360 0%, #0B1528 62%);
  display: grid; grid-template-rows: auto minmax(0, 1fr) auto; gap: 2.2vmin;
  padding: calc(env(safe-area-inset-top, 0px) + 2.4vmin) max(3vmin, env(safe-area-inset-right, 0px)) calc(env(safe-area-inset-bottom, 0px) + 2vmin) max(3vmin, env(safe-area-inset-left, 0px)); }
.tq-board { display: grid; grid-template-columns: minmax(0, 1fr) auto minmax(0, 1fr); gap: 2vmin; align-items: stretch; }
.tq-team { background: #172A4B; border: 2px solid #33507E; border-radius: 16px; padding: 1.2vmin 2.2vmin; display: flex; align-items: center; justify-content: space-between; gap: 12px; transition: border-color .2s, box-shadow .2s; min-width: 0; }
.tq-team span { font-family: var(--f-display); font-size: clamp(1.1rem, 3.4vmin, 2.3rem); letter-spacing: .02em; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.tq-team b { font-family: var(--f-display); font-size: clamp(2rem, 8vmin, 5.4rem); line-height: 1; color: #E0AE4C; }
.tq-team.on { border-color: #E0AE4C; box-shadow: 0 0 0 4px rgba(224, 174, 76, .25), 0 0 30px rgba(224, 174, 76, .25); }
.tq-team.r { flex-direction: row-reverse; }
.tq-mid { align-self: center; text-align: center; font-family: var(--f-mono); font-size: clamp(.8rem, 2.2vmin, 1.3rem); color: #A9B7CC; }
.tq-mid b { display: block; font-family: var(--f-display); font-size: clamp(1.4rem, 4.6vmin, 3rem); color: #EEF2F8; line-height: 1; }
.tq-body { display: flex; flex-direction: column; justify-content: center; gap: 2.4vmin; min-height: 0; }
.tq-q { font-size: clamp(1.3rem, 4.6vmin, 3.3rem); font-weight: 700; line-height: 1.25; text-align: center; max-width: 34ch; margin: 0 auto; text-wrap: balance; }
.tq-opts { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.8vmin; }
.tq-o { display: flex; align-items: center; gap: 1.6vmin; text-align: left; background: #172A4B; color: #EEF2F8; border: 2px solid #33507E; border-radius: 16px; padding: 1.8vmin 2.2vmin; font-size: clamp(1rem, 3.2vmin, 2.2rem); line-height: 1.25; transition: background .2s, border-color .2s, opacity .2s; }
.tq-o span { flex-shrink: 0; width: 1.9em; height: 1.9em; border-radius: 50%; display: grid; place-items: center; background: #E0AE4C; color: #2B2108; font-family: var(--f-display); font-weight: 700; }
.tq-o:not([disabled]):hover { border-color: #E0AE4C; }
.tq-o[disabled] { cursor: default; }
.tq-o.right { background: #1C5A42; border-color: #57C990; }
.tq-o.right span { background: #57C990; }
.tq-o.wrong { background: #4E2321; border-color: #F28C82; opacity: .75; }
.tq-o.wrong span { background: #F28C82; }
.tq-o.dim { opacity: .45; }
.tq-status { text-align: center; font-size: clamp(1rem, 3.2vmin, 2.1rem); min-height: 1.4em; }
.tq-status b { color: #E0AE4C; }
.tq-status .why { display: block; font-size: clamp(.9rem, 2.4vmin, 1.4rem); color: #C9D4E4; max-width: 60ch; margin: .5vmin auto 0; }
.tq-status .btn { margin: 1.4vmin .4vmin 0; font-size: clamp(.9rem, 2.4vmin, 1.4rem); padding: .5em 1.1em; }
.tq-foot { display: flex; justify-content: space-between; align-items: center; gap: 10px; font-size: .78rem; color: #A9B7CC; }
.tq .btn:not(.primary) { background: #172A4B; color: #EEF2F8; border-color: #33507E; box-shadow: none; }
.tq .btn.primary { background: #E0AE4C; border-color: #E0AE4C; color: #2B2108; box-shadow: none; }
.tq-end { text-align: center; display: flex; flex-direction: column; gap: 2vmin; align-items: center; justify-content: center; }
.tq-end h2 { font-family: var(--f-display); font-size: clamp(2.2rem, 10vmin, 6.5rem); line-height: 1; color: #E0AE4C; }
.tq-end p { font-size: clamp(1rem, 3vmin, 1.8rem); }
.tq.shake .tq-opts { animation: k-shake .45s ease; }
@media (max-width: 600px) { .tq-opts { grid-template-columns: 1fr; } }

.skill .skill-head { display: flex; justify-content: space-between; align-items: baseline; gap: 10px; flex-wrap: wrap; margin-bottom: 6px; }
.skill .skill-head h3 { font-family: var(--f-display); font-size: 1.3rem; letter-spacing: .02em; }
.skill > p { margin-bottom: 12px; color: var(--ink-2); }
.sk-steps { list-style: none; margin: 14px 0; padding: 0; display: flex; flex-direction: column; }
.sk-steps li { display: grid; grid-template-columns: 28px minmax(0, 1fr) auto; gap: 10px; align-items: center; padding: 9px 4px; border-bottom: 1px solid var(--line); }
.sk-steps li:last-child { border-bottom: 0; }
.sk-steps .n { font-family: var(--f-mono); font-size: .8rem; color: var(--ink-3); }
.sk-steps .t { font-size: .92rem; }
.sk-steps .chip { margin-left: 6px; vertical-align: 1px; }
.sk-steps li.pass .t { color: var(--ok); }
.sk-steps li.fail .t { color: var(--bad); }
.sk-btns { display: flex; gap: 6px; }
.sk-b { border: 1px solid var(--line); background: var(--surface); color: var(--ink-2); border-radius: 8px; padding: 5px 10px; font-size: .8rem; font-weight: 700; }
.sk-b.on { background: var(--ok); border-color: var(--ok); color: #fff; }
.sk-b.f.on { background: var(--bad); border-color: var(--bad); }
.sk-result { border-radius: 10px; padding: 10px 14px; font-weight: 700; background: var(--sunk); border: 1px solid var(--line); margin-bottom: 12px; }
.sk-result.go { background: var(--ok-soft); border-color: var(--ok); color: var(--ok); }
.sk-result.nogo { background: var(--bad-soft); border-color: var(--bad); color: var(--bad); }
html.neu .sk-b { border-color: transparent; box-shadow: var(--raise-sm); }
html.neu .sk-b.on { box-shadow: var(--press-sm); }
html.neu .sk-result { border-color: transparent; box-shadow: var(--press-sm); }
html.neu .sk-result.go { border-color: var(--ok); }
html.neu .sk-result.nogo { border-color: var(--bad); }
html.neu .sk-steps li { border-color: rgba(18, 33, 59, .07); }

.search-box { display: flex; gap: 8px; align-items: center; }
.search-box input { flex: 1; min-width: 0; font-size: 1.05rem; padding: 12px 14px; border-radius: 12px; border: 1px solid var(--line); background: var(--surface); }
html.neu .search-box input { border-color: transparent; background: var(--paper); box-shadow: var(--press); }
.sr-sum { font-size: .84rem; color: var(--ink-2); }
.sr-group h3 { font-family: var(--f-display); font-size: 1.15rem; letter-spacing: .02em; margin-bottom: 4px; text-transform: none; }
.sr-group .eyebrow { margin-bottom: 8px; }
.sr-hits { display: flex; flex-direction: column; }
.sr-hit { display: grid; grid-template-columns: 130px minmax(0, 1fr); gap: 2px 12px; text-align: left; background: none; border: 0; border-top: 1px solid var(--line); padding: 9px 2px; width: 100%; }
.sr-hit:hover .w { text-decoration: underline; }
.sr-hit .w { font-size: .76rem; font-weight: 700; color: var(--brass); letter-spacing: .02em; }
.sr-hit .s { font-size: .88rem; color: var(--ink-2); }
.sr-hit mark { background: var(--brass-soft); color: var(--ink); border-radius: 3px; padding: 0 2px; }
html.neu .sr-hit { border-color: rgba(18, 33, 59, .07); }
@media (max-width: 560px) { .sr-hit { grid-template-columns: 1fr; } }
.chips { display: flex; gap: 6px; flex-wrap: wrap; }
.chips .chip { cursor: pointer; border: 0; }

@media print {
  .rail, .topbar, .tabs, main, .lesson-head, .no-print, .toast { display: none !important; }
  body, .lesson { background: #fff !important; color: #000; }
  .lesson { position: static !important; overflow: visible !important; }
  .lesson-body { padding: 0; max-width: none; }
  .skill.panel { box-shadow: none !important; border: 1px solid #888 !important; break-inside: avoid; margin-bottom: 16px; }
  .sk-b { box-shadow: none !important; }
  .sk-b:not(.on) { opacity: .35; }
}
