
.panel{display:block!important;background:linear-gradient(180deg,rgba(255,255,255,.96),rgba(248,251,255,.94))!important;border:1px solid #e2eaf2!important;border-radius:22px!important;padding:28px 28px 24px!important;box-shadow:0 12px 28px rgba(148,163,184,.1)!important;position:relative!important;overflow:hidden!important}
.panel::before{content:""!important;position:absolute!important;inset:0 0 auto 0!important;height:5px!important;pointer-events:none!important;background:linear-gradient(90deg,#64b5f6 0%,#81c784 35%,#ffb74d 68%,#e57373 100%)!important}
.q-card{background:#fff;border:2px solid #e2eaf2;border-radius:14px;padding:18px;margin:14px 0;transition:.2s}
.q-card.correct{border-color:#81c784;background:#f1f8e9}
.q-card.wrong{border-color:#e57373;background:#fff5f5}
.q-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}
.q-num{background:#1565c0;color:#fff;padding:3px 10px;border-radius:20px;font-size:12px;font-weight:800}
.q-topic{font-size:11px;color:#90a4ae;font-weight:700}
.q-text{font-size:14px;color:#1f3552;font-weight:600;margin-bottom:10px;line-height:1.7}
.q-code{background:#1e1e2e;color:#cdd6f4;padding:14px;border-radius:10px;font-family:Menlo,monospace;font-size:13px;line-height:1.8;overflow-x:auto;white-space:pre}
.q-code .k{color:#c792ea}
.q-code .s{color:#a6e3a1}
.q-code .n{color:#fab387}
.q-code .c{color:#6e7687;font-style:italic}
.q-code .t{color:#89dceb}
.q-code .f{color:#f9e2af}
.q-blank{display:inline-block;background:#313244;border:1px dashed #f9e2af;color:#f9e2af;padding:2px 6px;border-radius:4px;font-weight:700;min-width:40px}
.q-input{font-family:Menlo,monospace;font-size:13px;padding:6px 10px;border:2px solid #bdd0e3;border-radius:6px;min-width:100px;margin:0 4px}
.q-input:focus{outline:none;border-color:#64b5f6}
.q-input.ok{border-color:#81c784;background:#f1f8e9}
.q-input.ng{border-color:#e57373;background:#fff5f5}
.q-ctrl{display:flex;gap:8px;flex-wrap:wrap;margin-top:10px}
.q-btn{padding:8px 16px;border:none;border-radius:8px;font-size:12px;font-weight:800;cursor:pointer;transition:.15s}
.q-btn.primary{background:#1565c0;color:#fff}
.q-btn.primary:hover{background:#0d47a1}
.q-btn.secondary{background:#eceff1;color:#455a64}
.q-btn.secondary:hover{background:#cfd8dc}
.q-ans{display:none;margin-top:10px;padding:12px;background:#f3f7fb;border-left:4px solid #64b5f6;border-radius:6px;font-size:13px;color:#33475d;line-height:1.8}
.q-ans.show{display:block}
.q-ans b{color:#1565c0}
.score{position:sticky;top:0;z-index:50;background:#fff;border-bottom:1px solid #e2eaf2;padding:8px 20px;display:flex;justify-content:space-between;align-items:center;max-width:1180px;margin:0 auto;font-size:13px;font-weight:700;color:#1f3552;flex-wrap:wrap;gap:10px}
.score-bar{flex:1;min-width:200px;height:10px;background:#e2eaf2;border-radius:5px;overflow:hidden}
.score-fill{height:100%;background:linear-gradient(90deg,#64b5f6,#81c784);transition:width .4s}
.block-head{max-width:1180px;margin:28px auto 0;padding:16px 20px;border-radius:16px 16px 0 0;color:#fff;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:12px}
.block-head.A{background:linear-gradient(135deg,#64b5f6,#1976d2)}
.block-head.B{background:linear-gradient(135deg,#81c784,#388e3c)}
.block-head.C{background:linear-gradient(135deg,#ba68c8,#7b1fa2)}
.block-head h2{margin:0;font-size:18px;font-weight:800}
.block-head .sub{font-size:12px;opacity:.9}
.block-head .bs{display:flex;gap:10px;align-items:center;font-size:13px}
.block-foot{max-width:1180px;margin:0 auto 20px;padding:14px 20px;background:#fff;border:2px solid #e2eaf2;border-top:none;border-radius:0 0 14px 14px;display:flex;justify-content:space-between;align-items:center;flex-wrap:wrap;gap:10px}
.block-foot .bs-result{font-size:14px;font-weight:800;color:#1f3552}
.block-foot .bs-num{font-size:18px;color:#1565c0}

