/* KAVACH Question Bank — Style A
   Self-contained: a theme's own rules for buttons, headings and paragraphs are
   usually more specific than ours, so anything a theme habitually restyles is
   pinned here rather than left to inherit. */

.kqb{
  --kqb:#0d9488;--kqb-ink:#111827;--kqb-mut:#6b7280;--kqb-line:#e8eaee;
  color:var(--kqb-ink);text-align:left;max-width:100%;
  font-size:16px;line-height:1.6;
}
.kqb *{box-sizing:border-box}

/* Themes paint headings with a gradient (background-clip:text plus a
   transparent fill). Our markup sits inside their content area and inherited
   it, which rendered chapter names and badges as pale smudges. */
.kqb .kqb-hero-title,.kqb .kqb-hero-desc,.kqb .kqb-hero-meta,
.kqb .kqb-unit-name,.kqb .kqb-unit-blurb,.kqb .kqb-unit-num,
.kqb .kqb-q-title,.kqb .kqb-qnum,.kqb .kqb-type,.kqb .kqb-marks,
.kqb .kqb-count,.kqb .kqb-star,.kqb .kqb-answer,.kqb .kqb-answer *{
  -webkit-text-fill-color:currentColor;
  background-image:none;
  -webkit-background-clip:border-box;
  background-clip:border-box;
}

.kqb-empty{padding:20px;border:1px dashed #d5d8dd;border-radius:12px;color:var(--kqb-mut);background:#fff}

/* ---------- hero ---------- */
.kqb-hero{background:#fff;border-radius:16px;padding:20px 18px;margin:0 0 14px;
  box-shadow:0 1px 2px rgba(16,24,40,.05)}
.kqb .kqb-hero-title{margin:0 0 6px;font-size:22px;line-height:1.25;font-weight:700;
  letter-spacing:-.01em;color:var(--kqb-ink)}
.kqb .kqb-hero-desc{margin:0 0 14px;color:var(--kqb-mut);font-size:14px;line-height:1.55}
.kqb .kqb-hero-meta{margin:0;color:var(--kqb-mut);font-size:13px}
.kqb .kqb-hero-meta strong{color:var(--kqb-ink);font-size:17px}
.kqb-hy{color:#b45309}

/* ---------- toolbar ---------- */
.kqb-toolbar{display:flex;gap:8px;flex-wrap:wrap;margin:0 0 12px}

/* ---------- chapter ---------- */
.kqb-unit{background:#fff;border-radius:14px;margin:0 0 10px;overflow:hidden;
  box-shadow:0 1px 2px rgba(16,24,40,.05)}
.kqb-unit-head{display:flex;align-items:flex-start;gap:11px;width:100%;padding:15px 14px;
  text-align:left;cursor:pointer}
.kqb .kqb-unit-num{flex:0 0 26px;height:26px;border-radius:8px;text-align:center;
  background:#eef6f5;color:var(--kqb);font-weight:700;font-size:13px;line-height:26px}
.kqb-unit-text{flex:1;min-width:0}
.kqb .kqb-unit-name{display:block;font-weight:650;font-size:15.5px;line-height:1.35;color:var(--kqb-ink)}
.kqb .kqb-unit-blurb{display:block;color:var(--kqb-mut);font-size:12.5px;margin-top:3px;line-height:1.45}
.kqb-unit-meta{flex:0 0 auto;display:flex;gap:7px;align-items:center;font-size:11.5px;color:var(--kqb-mut)}
.kqb .kqb-split{white-space:nowrap;color:var(--kqb-mut);font-size:11.5px}
.kqb .kqb-star{color:#b45309;background:#fef4e2;border-radius:20px;padding:2px 8px;font-size:11.5px}
.kqb-chev{flex:0 0 auto;width:8px;height:8px;margin-top:8px;
  border-right:2px solid #9aa3af;border-bottom:2px solid #9aa3af;
  transform:rotate(45deg);transition:transform .2s}
[aria-expanded="true"] .kqb-chev{transform:rotate(-135deg)}
.kqb-unit-body{border-top:1px solid var(--kqb-line)}

/* ---------- long / short divider ----------
   The paper itself is split: long answers first, then short notes. The band
   says which half you are in, how many are in it and what each is worth, so
   the two never run together the way a flat list let them. It reuses the
   label-then-rule device the answer bodies already use for their sections. */
.kqb-group{display:block}
.kqb-group + .kqb-group{border-top:1px solid var(--kqb-line)}
.kqb-group.is-hidden{display:none}
.kqb-group-head{display:flex;align-items:center;gap:10px;padding:11px 14px;
  background:#f7f8fa;border-bottom:1px solid var(--kqb-line)}
.kqb .kqb-group-label{flex:0 0 auto;font-weight:800;font-size:11px;line-height:1.4;
  letter-spacing:.11em;text-transform:uppercase;color:#4b5563}
.kqb-group-rule{flex:1 1 auto;min-width:12px;height:1px;background:var(--kqb-line)}
.kqb .kqb-group-meta{flex:0 0 auto;font-size:11px;line-height:1.4;color:var(--kqb-mut);
  white-space:nowrap}

/* The long half is the one worth the most marks, so it carries the subject
   colour; the short half stays neutral underneath it. */
.kqb-group.is-long .kqb-group-head{background:#f4faf9;border-left:3px solid var(--kqb)}
.kqb-group.is-short .kqb-group-head{border-left:3px solid #d8dce1}
.kqb-group.is-long .kqb-group-label{color:var(--kqb)}
@supports (background:color-mix(in srgb,red 8%,white)){
  .kqb-group.is-long .kqb-group-head{background:color-mix(in srgb,var(--kqb) 7%,#fff)}
  .kqb-group.is-long .kqb-group-rule{background:color-mix(in srgb,var(--kqb) 22%,#fff)}
}

/* ---------- question ---------- */
.kqb-q{border-bottom:1px solid var(--kqb-line)}
.kqb-q:last-child{border-bottom:0}
.kqb-group-body > .kqb-q:last-child{border-bottom:0}
.kqb-q.is-hidden{display:none}
.kqb-q-head{display:block;width:100%;padding:14px;text-align:left;cursor:pointer}
.kqb-q-row{display:flex;align-items:center;gap:7px;margin-bottom:7px}
/* A long question's badge is filled, a short note's is outlined. Under search,
   where the two bands are out of view, the badge alone still says which is
   which — and "Q3" vs "SN3" reads the way the questions are actually spoken
   about, so the numbering restarts in each half instead of running 1–12. */
.kqb .kqb-qnum{background:var(--kqb);color:#fff;-webkit-text-fill-color:#fff;
  border-radius:6px;padding:2px 7px;font-weight:700;font-size:11px;line-height:1.45;
  letter-spacing:.01em;min-width:26px;text-align:center}
.kqb .kqb-q.is-short .kqb-qnum{background:#fff;color:var(--kqb-mut);
  -webkit-text-fill-color:var(--kqb-mut);box-shadow:inset 0 0 0 1px #d8dce1}
.kqb .kqb-type{background:#f2f3f6;color:#4b5563;border-radius:6px;padding:3px 8px;
  font-weight:600;font-size:10.5px;line-height:1.4;letter-spacing:.07em}
.kqb .kqb-q.is-long .kqb-type{background:#f4faf9;color:var(--kqb)}
@supports (background:color-mix(in srgb,red 8%,white)){
  .kqb .kqb-q.is-long .kqb-type{background:color-mix(in srgb,var(--kqb) 10%,#fff)}
}
.kqb .kqb-marks{border:1px solid var(--kqb-line);color:var(--kqb-mut);border-radius:6px;
  padding:3px 7px;font-weight:600;font-size:11px;line-height:1.4}
.kqb-q-row .kqb-chev{margin-left:auto;margin-top:0}
.kqb .kqb-q-title{display:block;font-weight:600;font-size:15.5px;line-height:1.45;color:var(--kqb-ink)}
.kqb-q[data-open="1"] .kqb-q-head{background:linear-gradient(#fbfdfd,#fff)}
.kqb-answer{padding:2px 14px 20px}

/* ---------- answer body ---------- */
.kqb-answer h4.mqb-sec{display:flex;align-items:center;gap:8px;margin:20px 0 9px;
  font-weight:700;font-size:11.5px;line-height:1.4;letter-spacing:.09em;
  text-transform:uppercase;color:var(--kqb)}
.kqb-answer .mqb-sec-bar{order:2;flex:1;height:1px;background:var(--kqb-line)}
.kqb-answer p,.kqb-answer li{font-size:15px;line-height:1.62;margin:8px 0;
  hyphens:none;-webkit-hyphens:none;overflow-wrap:break-word}
.kqb-answer .mqb-def{background:#f1f8f7;border:0;border-radius:11px;padding:12px 14px;margin:10px 0}
.kqb-answer .mqb-pts{margin:9px 0;padding:0;list-style:none}
.kqb-answer .mqb-pts li{position:relative;padding-left:17px}
.kqb-answer .mqb-pts li:before{content:"";position:absolute;left:3px;top:.62em;width:5px;height:5px;
  border-radius:50%;background:var(--kqb);opacity:.55}
.kqb-answer .mqb-callout{background:#fffaf0;border-left:3px solid #e0a12a;border-radius:11px;  padding:12px 14px;margin:12px 0}

/* The books label their asides — CLINICAL PEARL, EXAM TIP, DANGER / REMEMBER.
   The label is lifted out as a chip so the eye can sort them at a glance in
   the last 48 hours, which is exactly when these boxes get read. */
.kqb-answer .mqb-callout-label{display:inline-block;margin:0 0 6px;padding:2px 8px;
  border-radius:20px;background:#f6ecd4;color:#8a6300;font-weight:700;font-size:10.5px;
  line-height:1.5;letter-spacing:.08em;text-transform:uppercase}
.kqb-answer .mqb-callout > p:first-of-type{margin-top:0}
.kqb-answer .mqb-callout > p:last-child{margin-bottom:0}
.kqb-answer .mqb-callout.is-danger{background:#fdf3f2;border-left-color:#c0392b}
.kqb-answer .mqb-callout.is-danger .mqb-callout-label{background:#f8dedb;color:#9b2c20}
.kqb-answer .mqb-callout.is-verify{background:#f4f6f8;border-left-color:#7b8794}
.kqb-answer .mqb-callout.is-verify .mqb-callout-label{background:#e3e8ec;color:#4b5563}
/* These are the author's own reminders to re-check a figure against current
   guidance ("NEEDS VERIFICATION"). Students do not see them; anyone who can
   edit the site does, with a note saying so, so they stay easy to find and fix.
   Delete the display:none line to show them to everyone. */
.kqb-answer .mqb-callout.is-verify{display:none}
.kqb.kqb-show-verify .kqb-answer .mqb-callout.is-verify{display:block;
  outline:1px dashed #7b8794;outline-offset:-1px}
.kqb.kqb-show-verify .kqb-answer .mqb-callout.is-verify:before{
  content:"Editors only — hidden from students";display:block;margin:0 0 6px;
  font-size:10.5px;letter-spacing:.06em;text-transform:uppercase;color:#7b8794}
.kqb-answer .mqb-def > p:first-child{margin-top:0}
.kqb-answer .mqb-def > p:last-child{margin-bottom:0}
.kqb-answer .mqb-fig{margin:14px 0;text-align:center}
.kqb-answer .mqb-fig img{max-width:100%;height:auto;border-radius:10px}
.kqb-answer .mqb-figcap{display:block;margin-top:7px;font-size:12.5px;color:var(--kqb-mut)}
.kqb-answer .mqb-tablewrap{overflow-x:auto;margin:14px 0;border:1px solid var(--kqb-line);
  border-radius:11px;-webkit-overflow-scrolling:touch}
.kqb-answer .mqb-table{border-collapse:collapse;width:100%;font-size:14px;min-width:300px}
.kqb-answer .mqb-table th,.kqb-answer .mqb-table td{padding:9px 11px;text-align:left;
  vertical-align:top;border-bottom:1px solid var(--kqb-line)}
.kqb-answer .mqb-table th{background:#fafbfc;font-weight:650;font-size:12.5px;
  letter-spacing:.02em;text-transform:uppercase;color:#4b5563}
.kqb-answer .mqb-table tr:last-child td{border-bottom:0}
.kqb-answer .mqb-fig{margin:14px 0;text-align:center}
.kqb-answer .mqb-fig img,.kqb-answer .mqb-fig svg{max-width:100%;height:auto;border-radius:10px}
.kqb-answer .mqb-figcap{color:var(--kqb-mut);font-size:12.5px;font-style:italic;margin-top:6px}


/* ---------- subject rail ---------- */
.kqb-rail{position:sticky;top:0;z-index:20;margin:0 0 14px;padding:9px 0 8px;
  background:rgba(255,255,255,.93);backdrop-filter:blur(10px);
  -webkit-backdrop-filter:blur(10px);border-bottom:1px solid var(--kqb-line)}
.kqb-rail-in{display:flex;gap:7px;overflow-x:auto;scrollbar-width:none;-webkit-overflow-scrolling:touch}
.kqb-rail-in::-webkit-scrollbar{display:none}
.kqb .kqb-chip{flex:0 0 auto;display:flex;align-items:center;gap:6px;padding:7px 12px;
  background:#fff;border:1px solid var(--kqb-line);border-radius:999px;
  font-size:13px;font-weight:600;white-space:nowrap;text-decoration:none;color:var(--kqb-ink)}
.kqb .kqb-chip .kqb-dot{width:7px;height:7px;border-radius:50%;background:var(--kqb)}
.kqb .kqb-chip.is-on{background:var(--kqb);border-color:var(--kqb);color:#fff;-webkit-text-fill-color:#fff}
.kqb .kqb-chip.is-on .kqb-dot{background:#fff}
.kqb button.kqb-more{flex:0 0 auto;width:auto !important;padding:7px 12px !important;
  border:1px dashed #cfd4da !important;border-radius:999px !important;background:#fff !important;
  font-size:13px !important;font-weight:600 !important;color:var(--kqb-mut) !important;cursor:pointer}

/* ---------- all-subjects sheet ---------- */
.kqb-sheet{position:fixed;inset:0;z-index:9999;display:none}
.kqb-sheet.is-open{display:block}
.kqb-veil{position:absolute;inset:0;background:rgba(17,24,39,.42)}
.kqb-panel{position:absolute;left:0;right:0;bottom:0;max-height:82vh;overflow:auto;
  background:#fff;border-radius:18px 18px 0 0;padding:8px 14px 26px}
.kqb-grab{width:38px;height:4px;border-radius:4px;background:#d8dce1;margin:8px auto 12px}
.kqb-panel h3{margin:0 0 10px;font-size:16px;color:var(--kqb-ink)}
.kqb-sgroup{margin:0 0 16px}
.kqb-sgroup h4{margin:0 0 7px;font-size:11px;letter-spacing:.08em;text-transform:uppercase;
  color:var(--kqb-mut);font-weight:700}
.kqb .kqb-srow{display:flex;align-items:center;gap:10px;padding:11px 10px;border-radius:11px;
  border:1px solid var(--kqb-line);margin-bottom:6px;text-decoration:none;color:var(--kqb-ink)}
.kqb .kqb-srow.is-on{border-color:var(--kqb);background:#f4faf9}
.kqb-sdot{width:9px;height:9px;border-radius:50%;background:var(--kqb);flex:0 0 auto}
.kqb-sname{flex:1;font-weight:600;font-size:14.5px}
.kqb-smeta{font-size:11.5px;color:var(--kqb-mut);white-space:nowrap}

/* ---------- breadcrumb + toolbar rows ---------- */
.kqb-crumb{font-size:11.5px;letter-spacing:.06em;text-transform:uppercase;
  color:var(--kqb-mut);margin-bottom:7px}
.kqb-toolbar{display:block}
.kqb-trow{display:flex;gap:8px;margin-top:8px;max-width:360px}
.kqb .kqb-trow button.kqb-btn{flex:1 1 0;min-width:0;white-space:nowrap;
  overflow:hidden;text-overflow:ellipsis;text-align:center}

/* ---------- chapter jump ---------- */
.kqb-jump{display:flex;gap:7px;overflow-x:auto;margin:0 0 12px;padding-bottom:2px;scrollbar-width:none}
.kqb-jump::-webkit-scrollbar{display:none}
.kqb .kqb-jump a{flex:0 0 auto;padding:6px 11px;background:#fff;border:1px solid var(--kqb-line);
  border-radius:8px;font-size:12.5px;color:var(--kqb-mut);white-space:nowrap;max-width:190px;
  overflow:hidden;text-overflow:ellipsis;text-decoration:none}
.kqb-unit{scroll-margin-top:66px}

/* ---------- subject grid ----------
   The year is a heading over its subjects now, not a line repeated on all
   fourteen cards. What each card carries instead is the thing worth comparing
   across subjects: how much there is, and how it splits. */
.kqb-year{margin:0 0 26px}
.kqb-year:last-child{margin-bottom:0}
.kqb .kqb-year-name{display:flex;align-items:center;gap:10px;margin:0 0 11px;
  font-weight:800;font-size:11.5px;line-height:1.4;letter-spacing:.11em;
  text-transform:uppercase;color:var(--kqb-mut)}
.kqb .kqb-year-name:after{content:"";flex:1;height:1px;background:var(--kqb-line)}
.kqb-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:12px}
.kqb-card{display:flex;flex-direction:column;gap:5px;background:#fff;border-radius:14px;
  padding:16px 18px 15px;text-decoration:none;color:inherit;
  box-shadow:0 1px 2px rgba(16,24,40,.05);border-top:3px solid var(--kqb)}
.kqb-card:hover{box-shadow:0 3px 10px rgba(16,24,40,.09)}
.kqb .kqb-card-name{display:block;font-weight:700;font-size:16.5px;line-height:1.3;
  letter-spacing:-.01em;color:var(--kqb-ink)}
.kqb .kqb-card-meta{display:block;color:var(--kqb-mut);font-size:12.5px}
.kqb-card-split{display:flex;flex-wrap:wrap;gap:5px;margin-top:5px}
.kqb .kqb-pill{border-radius:20px;padding:2px 9px;font-size:11px;line-height:1.55;font-weight:600}
.kqb .kqb-pill.is-long{background:#f4faf9;color:var(--kqb)}
.kqb .kqb-pill.is-short{background:#f2f3f6;color:#4b5563}
.kqb .kqb-pill.is-hy{background:#fef4e2;color:#b45309}
@supports (background:color-mix(in srgb,red 8%,white)){
  .kqb .kqb-pill.is-long{background:color-mix(in srgb,var(--kqb) 11%,#fff)}
}
.kqb .kqb-card-name,.kqb .kqb-card-meta,.kqb .kqb-pill,.kqb .kqb-year-name{
  -webkit-text-fill-color:currentColor;background-image:none;
  -webkit-background-clip:border-box;background-clip:border-box}

/* ---------- theme button reset ----------
   The chapter and question rows are buttons so the keyboard can reach them,
   and themes style every button on the page. Without this an opened question
   turned into a solid coloured block. */
.kqb button.kqb-unit-head,.kqb button.kqb-q-head,.kqb button.kqb-btn,
.kqb button.kqb-unit-head:hover,.kqb button.kqb-q-head:hover,
.kqb button.kqb-unit-head:focus,.kqb button.kqb-q-head:focus,.kqb button.kqb-btn:focus,
.kqb button.kqb-unit-head:active,.kqb button.kqb-q-head:active,
.kqb button.kqb-unit-head[aria-expanded="true"],.kqb button.kqb-q-head[aria-expanded="true"]{
  background:#fff !important;background-image:none !important;
  color:var(--kqb-ink) !important;-webkit-text-fill-color:currentColor !important;
  border:0 !important;border-radius:0 !important;box-shadow:none !important;text-shadow:none !important;
  text-transform:none !important;letter-spacing:normal !important;font-family:inherit !important;
  font-size:16px !important;font-weight:400 !important;line-height:1.6 !important;
  min-height:0 !important;width:100% !important;transform:none !important;outline:0;
}
.kqb button.kqb-unit-head:hover,.kqb button.kqb-q-head:hover{background:#fcfdfd !important}
.kqb-q[data-open="1"] button.kqb-q-head{background:linear-gradient(#fbfdfd,#fff) !important}
.kqb button.kqb-unit-head:focus-visible,.kqb button.kqb-q-head:focus-visible,
.kqb button.kqb-btn:focus-visible{outline:2px solid var(--kqb);outline-offset:-2px}

.kqb button.kqb-btn{width:auto !important;border:1px solid var(--kqb-line) !important;
  border-radius:10px !important;padding:10px 14px !important;font-size:14px !important;
  font-weight:600 !important;background:#fff !important}
.kqb button.kqb-btn.is-on{background:var(--kqb) !important;color:#fff !important;
  -webkit-text-fill-color:#fff !important;border-color:var(--kqb) !important}
.kqb input.kqb-search{flex:1 1 200px;min-width:0;font-size:16px !important;
  padding:11px 14px !important;border:1px solid var(--kqb-line) !important;border-radius:10px !important;
  background:#fff !important;color:var(--kqb-ink) !important;box-shadow:none !important;
  height:auto !important;text-transform:none !important}

/* ---------- phones ---------- */
@media (max-width:640px){
  .kqb{font-size:15px}
  .kqb-hero{padding:16px 14px;border-radius:13px}
  .kqb .kqb-hero-title{font-size:19px}
  .kqb-unit{border-radius:12px;margin-bottom:9px}
  .kqb-unit-head{padding:13px 11px}
  .kqb-q-head{padding:13px 11px}
  .kqb-answer{padding:2px 11px 18px}
  .kqb-answer p,.kqb-answer li{font-size:15px}
  .kqb-answer .mqb-def,.kqb-answer .mqb-callout{padding:11px 12px}
  .kqb-answer .mqb-table th,.kqb-answer .mqb-table td{padding:8px 9px}
  .kqb button.kqb-unit-head,.kqb button.kqb-q-head{font-size:15px !important}
  .kqb-trow{max-width:none}
  .kqb-rail{padding:8px 0 7px}
  /* The chapter row is already carrying a name, a blurb, a count and a chevron;
     the split would squeeze the name into a column two words wide. */
  .kqb .kqb-split{display:none}
  .kqb-group-head{padding:10px 11px;gap:8px}
  .kqb .kqb-group-label{font-size:10.5px;letter-spacing:.09em}
  .kqb .kqb-group-meta{font-size:10.5px}
}

/* Under ~400px the marks note is the first thing that can go — the band still
   names the half, and every row underneath repeats the marks anyway. */
@media (max-width:400px){
  .kqb .kqb-group-meta{display:none}
}

/* ---------- search feedback ---------- */
.kqb .kqb-search-note{margin:8px 0 0;font-size:12.5px;color:var(--kqb-mut)}
.kqb-q.is-answer-hit .kqb-q-title:after{content:"  · in answer";font-weight:400;
  font-size:12px;color:var(--kqb-mut)}

/* ---------- link to the answer's own page ---------- */
.kqb .kqb-answer .kqb-permalink{margin:18px 0 0;padding-top:12px;border-top:1px solid var(--kqb-line);font-size:13px}
.kqb .kqb-answer .kqb-permalink a{color:var(--kqb);text-decoration:none;font-weight:600}

/* ---------- one answer on its own page ---------- */
.kqb-single{max-width:860px;margin:0 auto;padding:18px 0 40px}
.kqb .kqb-bc{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:0 0 12px;padding:0 4px;
  font-size:12.5px;color:var(--kqb-mut)}
.kqb .kqb-bc a{color:var(--kqb-mut);text-decoration:none}
.kqb .kqb-bc a:hover{color:var(--kqb)}
.kqb-single-head .kqb-q-row{flex-wrap:wrap}
.kqb .kqb-single-head .kqb-hero-title{font-size:24px;margin:4px 0 8px}
.kqb .kqb-qnum.is-sn{background:#fff;color:var(--kqb-mut);-webkit-text-fill-color:var(--kqb-mut);
  box-shadow:inset 0 0 0 1px #d8dce1}
.kqb .kqb-single-head .kqb-star{white-space:nowrap}
.kqb-single-body .kqb-answer{padding:6px 20px 24px}
.kqb-pn{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin:14px 0}
.kqb .kqb-pn a{display:block;background:#fff;border-radius:12px;padding:12px 14px;text-decoration:none;
  color:var(--kqb-ink);font-size:14px;line-height:1.4;box-shadow:0 1px 2px rgba(16,24,40,.05)}
.kqb .kqb-pn a span{display:block;font-size:11.5px;font-weight:700;color:var(--kqb);margin-bottom:3px}
.kqb .kqb-pn-next{grid-column:2;text-align:right}
.kqb-book{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;
  background:#fff;border-left:3px solid var(--kqb);border-radius:12px;padding:12px 16px;margin:14px 0}
.kqb .kqb-book p{margin:0;font-size:14px;color:var(--kqb-ink)}
.kqb .kqb-book a{font-weight:700;color:var(--kqb);text-decoration:none;white-space:nowrap}
.kqb-more-list{padding:16px 18px}
.kqb .kqb-more-title{margin:0 0 10px;font-size:15px;font-weight:700;color:var(--kqb-ink)}
.kqb-more-list ol{list-style:none;margin:0;padding:0}
.kqb-more-list li{margin:0;border-bottom:1px solid var(--kqb-line)}
.kqb-more-list li:last-child{border-bottom:0}
.kqb .kqb-more-list li a{display:flex;gap:9px;padding:9px 0;text-decoration:none;color:var(--kqb-ink);
  font-size:14px;line-height:1.45}
.kqb .kqb-more-list li.is-on a{font-weight:700;color:var(--kqb)}
.kqb .kqb-more-num{flex:0 0 34px;font-size:11.5px;font-weight:700;color:var(--kqb-mut);padding-top:2px}
.kqb .kqb-more-hy{color:#b45309}
.kqb .kqb-more-all{margin:12px 0 0;font-size:13.5px}
.kqb .kqb-more-all a{color:var(--kqb);font-weight:600;text-decoration:none}
@media (max-width:640px){
  .kqb-single{padding:10px 0 28px}
  .kqb .kqb-single-head .kqb-hero-title{font-size:20px}
  .kqb-single-body .kqb-answer{padding:4px 12px 18px}
  .kqb-pn{grid-template-columns:1fr}
  .kqb .kqb-pn-next{grid-column:1}
}