/* NEXQUOTE Q&A "Trọng tâm · 11 câu" (LỆNH 21, 24/10/2026): the eleven tiles at the top of the Q&A home, the card (question, figure,
   answer, source), the figures' light plate and motion (qa-focus.js), and the presenter's "Nếu hỏi xoáy" list. The figure's resting
   style is its last frame: .qf-static (the export) or reduced motion switch the animations off and the figure stands complete. */
.qf-home{margin:0 0 30px}
.qf-hh{display:flex;align-items:baseline;gap:18px;margin:2px 0 12px}
.qf-hh h2{font-size:clamp(22px,1.7vw,32px);font-weight:600;margin:0;color:var(--qtext)}
.qf-hh span{color:var(--qmuted);font-size:16px}
.qf-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px}
#qa100-root .qf-tile{display:flex;gap:12px;align-items:flex-start;text-align:left;background:#141f32;border:1px solid #34445c;border-top:3px solid var(--qblue);border-radius:6px;color:var(--qtext);padding:12px 14px;min-height:78px}
#qa100-root .qf-tile:hover{background:#1b2b44;border-color:var(--qblue)}
.qf-n{font-family:'JetBrains Mono',monospace;color:var(--qblue);font-size:15px;padding-top:3px}
.qf-tile b{font-weight:500;font-size:clamp(17px,1.2vw,24px);line-height:1.3}

.qf-card{display:flex;flex-direction:column;min-height:100%}
.qf-top{display:flex;justify-content:space-between;gap:20px;color:var(--qmuted);font-size:15px}
.qf-k{color:var(--qblue);font-weight:600;letter-spacing:1.2px;text-transform:uppercase}
.qf-q{font-size:clamp(26px,min(2.3vw,4.2vh),46px);line-height:1.2;font-weight:600;margin:8px 0 16px}
.qf-body{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(22px,3vw,60px);align-items:center;flex:1}
.qf-fig{margin:0;background:#e8edf4;border-radius:14px;padding:clamp(10px,1vw,20px)}
.qf-svg{display:block;width:100%;height:auto;max-height:calc(100vh - 300px)}
.qf-a{font-size:clamp(20px,min(1.75vw,3.3vh),36px);line-height:1.45;margin:0;color:var(--qtext)}
.qf-src{margin:18px 0 0;color:var(--qmuted);font-size:clamp(15px,1vw,20px)}
@media screen and (max-width:900px){.qf-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.qf-body{grid-template-columns:1fr}.qf-svg{max-height:none}}

/* the plate: white models, blue data, amber problem */
.qf-svg text{font-family:Inter,Arial,sans-serif}
.qf-svg .zt1{font-size:28px;font-weight:700}.qf-svg .zt2{font-size:22px;font-weight:600}.qf-svg .zt3{font-size:18px;font-weight:500}.qf-svg .zb{font-weight:700}
.qf-svg .zci{fill:#18222f}.qf-svg .zcd{fill:#566579}.qf-svg .zcb{fill:#1d5fc8}.qf-svg .zca{fill:#9a5700}.qf-svg .zcw{fill:#fff}
.qf-svg .zw{fill:#fff;stroke:#c9d3e0;stroke-width:1.5}
.qf-svg .zbs{fill:#e2edff;stroke:#3b7be0;stroke-width:1.5}
.qf-svg .zgs{fill:#f1f4f8;stroke:#cfd7e2;stroke-width:1.5}
.qf-svg .zas{fill:#fff0d9;stroke:#e0952b;stroke-width:1.5}
.qf-svg .zfb{fill:#3b7be0}.qf-svg .zfa{fill:#e0952b}.qf-svg .zfg{fill:#aeb9c8}.qf-svg .zfd{fill:#7d8a9c}
.qf-svg .zwall{fill:#2e3d52}
.qf-svg .zbadge{fill:#e2edff;stroke:#3b7be0;stroke-width:2}
.qf-svg .zstamp{fill:#fff7ea;stroke:#d9861a;stroke-width:2;stroke-dasharray:6 4}
.qf-svg .zwin{fill:rgba(59,123,224,.12);stroke:#3b7be0;stroke-width:1.5;stroke-dasharray:6 5}
.qf-svg .zhl{fill:#cfe0ff}
.qf-svg .ztag{fill:#e2edff}
.qf-svg .ztagd{fill:#fff;stroke:#3b7be0;stroke-width:1.5;stroke-dasharray:5 4}
.qf-svg .zask{fill:#fff0d9;stroke:#e0952b;stroke-width:2}
.qf-svg .zsw2{fill:#dbe6f5;stroke:#9fb3cf;stroke-width:1.5}
.qf-svg .zswk{fill:#3b7be0}
.qf-svg .zokb{fill:#3b7be0}
.qf-svg .zgz{fill:none;stroke-width:26}.qf-svg .zgr{stroke:#e0952b}.qf-svg .zgy{stroke:#f6cf8f}.qf-svg .zgb{stroke:#a9c8f7}
.qf-svg .zlgr{fill:#e0952b}.qf-svg .zlgy{fill:#f6cf8f}
.qf-svg .zdoor{fill:#f1f4f8;stroke:#cfd7e2;stroke-width:1.5}
.qf-svg .zbelt{fill:#cdd6e2}
.qf-svg .zclock{fill:#fff;stroke:#566579;stroke-width:3}
.qf-svg .zst{fill:none;stroke-width:3;stroke-linecap:round;stroke-linejoin:round}
.qf-svg .zsi{stroke:#18222f}.qf-svg .zsa{stroke:#e0952b}.qf-svg .zsb{stroke:#3b7be0}.qf-svg .zsd{stroke:#aeb9c8}.qf-svg .zsw{stroke:#fff}
.qf-svg .zthick{stroke-width:4}.qf-svg .zneedle{stroke-width:6}
.qf-svg .zck{stroke:#3b7be0;stroke-width:4}
.qf-svg .zbl,.qf-svg .zal{fill:none;stroke-width:3;stroke-linecap:round}.qf-svg .zbl{stroke:#3b7be0}.qf-svg .zal{stroke:#e0952b}

/* motion (≤ 1.2 s); the resting style is the last frame */
.qf-svg .qf-in{animation:qfIn .34s cubic-bezier(.2,.7,.2,1) var(--d,0ms) both}
@keyframes qfIn{from{opacity:0;transform:translateY(10px)}}
.qf-svg .qf-dr{stroke-dasharray:1 1;animation:qfDr .42s ease-out var(--d,0ms) both}
@keyframes qfDr{from{stroke-dashoffset:1}}
.qf-svg .qf-in.qf-slide{animation-name:qfSlide;animation-duration:.5s}
@keyframes qfSlide{from{opacity:0;transform:translateX(90px)}}
.qf-svg .qf-in.qf-bn{animation-name:qfBn;animation-duration:.6s}
@keyframes qfBn{0%{opacity:0;transform:translateX(40px)}35%{opacity:1;transform:translateX(-34px)}70%{transform:translateX(8px)}100%{transform:none}}
.qf-svg .qf-nd{transform:rotate(var(--a));transform-origin:210px 250px;animation:qfNd .7s cubic-bezier(.45,.05,.3,1) .4s both}
@keyframes qfNd{from{transform:rotate(0deg)}}
.qf-svg .zswk{transform:translateX(40px);animation:qfSw .9s ease-in-out .3s both}
@keyframes qfSw{0%{transform:none}30%{transform:translateX(40px)}60%{transform:none}100%{transform:translateX(40px)}}
.qf-svg .qf-mv{transform:translateX(570px);animation:qfMv 1s cubic-bezier(.4,0,.2,1) .2s both}
@keyframes qfMv{from{transform:none}}
.qf-static .qf-svg *{animation:none!important}
/* the export (dev/exporter/capture.mjs, build_print.py): the card alone on its page, without the Q&A's bar, footer and key hint */
.qf-export .q-top,.qf-export .q-footer,.qf-export .qf-keys{display:none!important}
.qf-export .q-body{padding:56px 77px 48px}   /* (calm: qa100.css stops every animation in the Q&A layer) */

/* presenter: the follow-ups (never on the audience card) */
.qp-xoay{margin:6px 0 14px;padding-left:20px}
.qp-xoay li{margin:8px 0;line-height:1.45}
.qp-xoay b{color:#f0b45a;font-weight:600;display:block}
.qp-quick .qp-follow{display:block;width:100%;text-align:left}
.qp-steps{margin:6px 0 14px;padding-left:24px}
.qp-steps li{margin:6px 0;line-height:1.4;color:#9eb2dc}
.qp-steps li.on{color:#fff;font-weight:600}
.qp-steps li.on::marker{color:#7fb0ff}
/* LỆNH 37 · presenter, in the pitch: the words being said (normal), the next beat's words big in an amber frame, a small run / wait status */
.qp-root .qp-beat-say{font-size:20px}
.qp-root .qp-label.qp-lb{font-size:14px}
.qp-next{margin:22px 0 14px;padding:18px 24px 22px;border:2px solid #f0b45a;border-radius:12px;background:rgba(240,180,90,.07)}
.qp-root .qp-next .qp-label{margin-top:0;color:#f0b45a;font-size:15px;letter-spacing:1.4px;font-weight:600}
.qp-root .qp-nextsay{margin:10px 0 0;font-size:clamp(32px,2.6vw,46px);line-height:1.3;font-weight:600;color:#fff;text-wrap:pretty}
.qp-next-end{border-color:#34445c;background:none}
.qp-next-end .qp-nextsay{color:#9eb2dc;font-weight:500}
.qp-root .qp-busy{margin:6px 0 0;font-size:16px;color:#9eb2dc}
.qp-root .qp-busy[data-busy="true"]{color:#7fb0ff}
