/* ============================================================
   Topic-wise Mock Tests - modern, compact, mobile-first
   ============================================================ */
.min-w-0 { min-width:0; }
.tw-wrap { padding-top:1rem; padding-bottom:2.5rem; }
@media (min-width:768px){ .tw-wrap { padding-top:1.5rem; } }

/* ---- compact page header ---- */
.tw-head { background:linear-gradient(135deg,#eff6ff 0%,#eef2ff 100%); border:1px solid #dbe6fb; border-radius:1.1rem; padding:.95rem 1rem; margin:.75rem 0 1.1rem; }
.tw-head-main { display:flex; gap:.8rem; align-items:flex-start; }
.tw-head-icon { flex:0 0 42px; height:42px; border-radius:12px; background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.2rem; box-shadow:0 4px 12px rgba(37,99,235,.25); }
.tw-eyebrow { font-size:.68rem; font-weight:700; letter-spacing:.6px; text-transform:uppercase; color:#4f46e5; line-height:1.2; margin-bottom:.15rem; }
.tw-head h1 { font-size:1.2rem; font-weight:700; margin:0; line-height:1.3; color:#0f172a; overflow-wrap:anywhere; }
.tw-head p { margin:.25rem 0 0; font-size:.86rem; color:#475569; line-height:1.5; }
@media (min-width:768px){ .tw-head { padding:1.15rem 1.3rem; } .tw-head h1 { font-size:1.45rem; } .tw-head-icon { flex-basis:48px; height:48px; font-size:1.35rem; } }

/* ---- small stat pills ---- */
.tw-stats { display:flex; flex-wrap:wrap; gap:.4rem; margin-top:.8rem; }
.tw-stat { display:inline-flex; align-items:center; gap:.35rem; background:#fff; border:1px solid #e2e8f0; border-radius:999px; padding:.22rem .7rem; font-size:.78rem; color:#475569; white-space:nowrap; }
.tw-stat i { color:#2563eb; font-size:.85rem; }
.tw-stat b { color:#0f172a; font-weight:700; }

/* ---- section titles ---- */
.tw-title { font-size:1.02rem; font-weight:700; margin:0 0 .75rem; display:flex; align-items:center; gap:.45rem; color:#0f172a; }
.tw-title::before { content:""; width:4px; height:1.05em; border-radius:4px; background:linear-gradient(#2563eb,#4f46e5); }

/* ---- subject cards ---- */
.subject-card { display:flex; gap:.8rem; align-items:center; background:#fff; border:1px solid #e8edf5; border-radius:1rem; padding:.85rem; height:100%; text-decoration:none; color:inherit; transition:.18s; }
.subject-card:hover { transform:translateY(-2px); box-shadow:0 8px 22px rgba(37,99,235,.1); border-color:#bfdbfe; color:inherit; }
.subject-icon { flex:0 0 46px; width:46px; height:46px; border-radius:13px; background:#eff6ff; color:#2563eb; display:flex; align-items:center; justify-content:center; font-size:1.3rem; position:relative; }
.subject-no { position:absolute; top:-6px; left:-6px; background:#2563eb; color:#fff; font-size:.6rem; font-weight:700; border-radius:999px; padding:1px 5px; }
.subject-card h2, .subject-card h3 { font-size:.98rem; font-weight:700; margin:0; line-height:1.3; }
.subject-card p { font-size:.78rem; color:#64748b; margin:.15rem 0 .35rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.subject-meta { font-size:.74rem; color:#64748b; display:flex; flex-wrap:wrap; gap:.15rem .7rem; }
.subject-go { margin-left:auto; color:#94a3b8; flex:0 0 auto; }
.subject-card:hover .subject-go { color:#2563eb; }

/* ---- chapter rows ---- */
.chapter-row { display:flex; align-items:center; gap:.75rem; background:#fff; border:1px solid #e8edf5; border-radius:.95rem; padding:.7rem .85rem; text-decoration:none; color:inherit; transition:.15s; }
.chapter-row:hover { border-color:#93c5fd; background:#f8fbff; color:inherit; }
.chapter-no { flex:0 0 34px; height:34px; border-radius:10px; background:#eff6ff; color:#2563eb; font-weight:700; display:flex; align-items:center; justify-content:center; font-size:.85rem; }
.chapter-row h2, .chapter-row h3 { font-size:.95rem; font-weight:600; margin:0; line-height:1.35; overflow-wrap:anywhere; }
.chapter-row small { color:#64748b; font-size:.76rem; }
.chapter-row .bi-chevron-right { margin-left:auto; color:#94a3b8; flex:0 0 auto; }

/* ---- test cards ---- */
.test-card { background:#fff; border:1px solid #e8edf5; border-radius:1rem; padding:.95rem; height:100%; display:flex; flex-direction:column; transition:.18s; }
.test-card:hover { box-shadow:0 8px 22px rgba(37,99,235,.09); border-color:#bfdbfe; }
.test-card-top { display:flex; align-items:center; gap:.5rem; margin-bottom:.5rem; }
.test-badge { font-size:.65rem; font-weight:700; padding:.15rem .5rem; border-radius:999px; background:#dcfce7; color:#15803d; }
.test-card h2, .test-card h3 { font-size:.93rem; font-weight:600; line-height:1.4; margin:0 0 .5rem; overflow-wrap:anywhere; }
.test-pills { display:flex; flex-wrap:wrap; gap:.3rem; margin-bottom:.75rem; }
.test-pills span { font-size:.72rem; background:#f1f5f9; color:#475569; border-radius:999px; padding:.12rem .55rem; }
.test-card .btn { margin-top:auto; }

/* ---- test page ---- */
.tw-start-card { background:#fff; border:1px solid #e8edf5; border-radius:1.1rem; padding:1rem; margin-bottom:1rem; }
.tw-start-card .btn-start { background:linear-gradient(135deg,#2563eb,#4f46e5); border:0; color:#fff; font-weight:600; border-radius:.9rem; padding:.7rem 1.4rem; box-shadow:0 6px 16px rgba(37,99,235,.28); width:100%; }
.tw-start-card .btn-start:hover { filter:brightness(1.06); color:#fff; }
@media (min-width:576px){ .tw-start-card .btn-start { width:auto; min-width:240px; } }
.tw-facts { display:grid; grid-template-columns:repeat(2,1fr); gap:.5rem; margin-bottom:.9rem; }
@media (min-width:576px){ .tw-facts { grid-template-columns:repeat(4,1fr); } }
.tw-fact { background:#f8fafc; border:1px solid #eef2f7; border-radius:.8rem; padding:.55rem .65rem; text-align:center; }
.tw-fact i { color:#2563eb; }
.tw-fact b { display:block; font-size:.95rem; color:#0f172a; line-height:1.3; }
.tw-fact span { font-size:.7rem; color:#64748b; }

.tw-side-card { background:#fff; border:1px solid #e8edf5; border-radius:1.1rem; padding:1rem; margin-bottom:.9rem; }
.tw-side-card h2 { font-size:.9rem; font-weight:700; margin:0 0 .7rem; }
.tw-test-links { display:grid; grid-template-columns:repeat(auto-fill,minmax(130px,1fr)); gap:.4rem; }
.tw-test-links a { display:flex; align-items:center; gap:.4rem; font-size:.8rem; padding:.45rem .6rem; border-radius:.7rem; border:1px solid #e2e8f0; color:#334155; text-decoration:none; line-height:1.25; min-width:0; }
.tw-test-links a span { overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; }
.tw-test-links a:hover { border-color:#93c5fd; background:#f8fbff; }
.tw-test-links a.on { background:#2563eb; border-color:#2563eb; color:#fff; }
.tw-test-links a em { font-style:normal; flex:0 0 22px; height:22px; border-radius:7px; background:#eff6ff; color:#2563eb; font-size:.7rem; font-weight:700; display:flex; align-items:center; justify-content:center; }
.tw-test-links a.on em { background:rgba(255,255,255,.22); color:#fff; }
.tw-link-card { display:flex; align-items:center; gap:.7rem; background:#fff; border:1px solid #e8edf5; border-radius:.95rem; padding:.7rem .85rem; text-decoration:none; color:#0f172a; margin-bottom:.55rem; font-size:.88rem; font-weight:600; transition:.15s; }
.tw-link-card i.lead { flex:0 0 34px; height:34px; border-radius:10px; background:#eff6ff; color:#2563eb; display:flex; align-items:center; justify-content:center; }
.tw-link-card i.go { margin-left:auto; color:#94a3b8; }
.tw-link-card:hover { border-color:#93c5fd; background:#f8fbff; color:#0f172a; }
.tw-nav-btns { display:flex; justify-content:space-between; gap:.5rem; margin-top:1rem; }
.tw-nav-btns .btn { border-radius:.8rem; font-size:.85rem; }

/* ---- article + custom html ---- */
.topic-article { background:#fff; border:1px solid #e8edf5; border-radius:1.1rem; padding:1.1rem; overflow-wrap:anywhere; }
@media (min-width:768px){ .topic-article { padding:1.6rem 1.9rem; } }
.rich-content .ql-align-center, .topic-article .ql-align-center { text-align:center; }
.rich-content .ql-align-right, .topic-article .ql-align-right { text-align:right; }
.rich-content .ql-align-justify, .topic-article .ql-align-justify { text-align:justify; }
.topic-article img { max-width:100%; height:auto; border-radius:.6rem; }
.topic-article table { width:100%; border-collapse:collapse; display:block; overflow-x:auto; }
.topic-article table td, .topic-article table th { border:1px solid #e2e8f0; padding:.45rem .6rem; }
.topic-article iframe, .topic-custom-html iframe { max-width:100%; }
.topic-custom-html { max-width:100%; overflow-x:auto; }
.topic-custom-html img, .topic-custom-html video { max-width:100%; height:auto; }
.topic-chip { display:inline-flex; align-items:center; gap:.35rem; background:#f1f5f9; border-radius:999px; padding:.3rem .8rem; font-size:.82rem; color:#334155; }

/* ---------- Test engine (full-screen, mobile friendly) ---------- */
#examApp { position:fixed; inset:0; z-index:2000; background:#f1f5f9; display:none; flex-direction:column; }
#examApp.show { display:flex; }
.ex-top { background:#fff; border-bottom:1px solid #e2e8f0; padding:.55rem .9rem; display:flex; align-items:center; gap:.6rem; }
.ex-title { font-weight:600; font-size:.92rem; flex:1; min-width:0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ex-timer { font-variant-numeric:tabular-nums; font-weight:700; background:#eff6ff; color:#1d4ed8; padding:.3rem .7rem; border-radius:999px; font-size:.9rem; white-space:nowrap; }
.ex-timer.warn { background:#fee2e2; color:#b91c1c; }
.ex-body { flex:1; display:flex; min-height:0; }
.ex-main { flex:1; overflow-y:auto; padding:1rem; }
.ex-card { max-width:820px; margin:0 auto; background:#fff; border-radius:1.1rem; padding:1.2rem; border:1px solid #e2e8f0; }
.ex-qno { font-size:.8rem; color:#64748b; font-weight:600; margin-bottom:.5rem; display:flex; justify-content:space-between; }
.ex-qtext { font-size:1.05rem; font-weight:500; margin-bottom:1rem; white-space:pre-wrap; }
.ex-qimg { max-width:100%; max-height:320px; border-radius:.6rem; border:1px solid #e2e8f0; margin-bottom:1rem; }
.ex-opt { display:flex; gap:.7rem; align-items:flex-start; width:100%; text-align:left; background:#fff; border:2px solid #e2e8f0; border-radius:.9rem; padding:.75rem .9rem; margin-bottom:.6rem; cursor:pointer; transition:.12s; }
.ex-opt:hover { border-color:#93c5fd; }
.ex-opt.sel { border-color:#2563eb; background:#eff6ff; }
.ex-opt .k { flex:0 0 28px; height:28px; border-radius:50%; background:#f1f5f9; display:flex; align-items:center; justify-content:center; font-weight:700; font-size:.85rem; }
.ex-opt.sel .k { background:#2563eb; color:#fff; }
.ex-opt img { max-width:100%; max-height:140px; display:block; margin-top:.4rem; border-radius:.5rem; }
.ex-bottom { background:#fff; border-top:1px solid #e2e8f0; padding:.6rem .9rem; display:flex; gap:.5rem; align-items:center; justify-content:space-between; }
.ex-pal { width:270px; background:#fff; border-left:1px solid #e2e8f0; padding:1rem; overflow-y:auto; }
.ex-pal-grid { display:grid; grid-template-columns:repeat(5,1fr); gap:.45rem; }
.ex-pb { aspect-ratio:1; border-radius:.6rem; border:1px solid #cbd5e1; background:#fff; font-size:.8rem; font-weight:600; cursor:pointer; padding:0; }
.ex-pb.ans { background:#16a34a; color:#fff; border-color:#16a34a; }
.ex-pb.mark { background:#f59e0b; color:#fff; border-color:#f59e0b; }
.ex-pb.cur { outline:3px solid #2563eb; outline-offset:1px; }
.ex-legend span { display:inline-block; width:12px; height:12px; border-radius:3px; margin-right:4px; vertical-align:-1px; }
@media (max-width:820px){
  .ex-pal { position:fixed; right:0; top:0; bottom:0; transform:translateX(100%); transition:.2s; z-index:2100; box-shadow:-8px 0 30px rgba(0,0,0,.15); }
  .ex-pal.open { transform:none; }
  .ex-main { padding:.7rem; }
  .ex-card { padding:1rem; }
}

/* ---------- Result ---------- */
.res-score { background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; border-radius:1.4rem; padding:1.6rem; text-align:center; }
.res-score .big { font-size:3rem; font-weight:800; line-height:1.1; }
.res-box { background:#fff; border:1px solid #eef0f4; border-radius:1rem; padding:.9rem; text-align:center; height:100%; }
.res-box .n { font-size:1.4rem; font-weight:700; }
.rv-card { background:#fff; border:1px solid #eef0f4; border-radius:1.1rem; padding:1.1rem; margin-bottom:1rem; }
.rv-opt { border:1.5px solid #e2e8f0; border-radius:.75rem; padding:.55rem .8rem; margin-bottom:.45rem; font-size:.92rem; }
.rv-opt.ok { background:#dcfce7; border-color:#22c55e; }
.rv-opt.bad { background:#fee2e2; border-color:#ef4444; }
.rv-opt img { max-width:100%; max-height:130px; display:block; margin-top:.35rem; border-radius:.4rem; }
.rv-exp { background:#f8fafc; border-left:4px solid #2563eb; border-radius:.5rem; padding:.7rem .9rem; font-size:.9rem; margin-top:.7rem; }
.rv-exp img { max-width:100%; border-radius:.5rem; margin-top:.5rem; }

/* ============================================================
   v2 - richer colour design (compact header kept small)
   ============================================================ */
.tw-body { background:linear-gradient(180deg,#eaf1ff 0,#f6f8fc 340px,#f8fafc 100%) no-repeat; }

.tone-0 { --g1:#2563eb; --g2:#4f46e5; --soft:#eff6ff; }
.tone-1 { --g1:#059669; --g2:#10b981; --soft:#ecfdf5; }
.tone-2 { --g1:#ea580c; --g2:#f59e0b; --soft:#fff7ed; }
.tone-3 { --g1:#7c3aed; --g2:#a855f7; --soft:#f5f3ff; }
.tone-4 { --g1:#db2777; --g2:#f472b6; --soft:#fdf2f8; }
.tone-5 { --g1:#0891b2; --g2:#22d3ee; --soft:#ecfeff; }

/* compact gradient header */
.tw-head { position:relative; overflow:hidden; background:linear-gradient(135deg,#1e3a8a 0%,#2563eb 55%,#6366f1 100%); border:0; color:#fff; padding:.9rem 1rem; box-shadow:0 12px 30px rgba(37,99,235,.28); }
.tw-head::before { content:""; position:absolute; right:-40px; top:-60px; width:190px; height:190px; border-radius:50%; background:rgba(255,255,255,.10); }
.tw-head::after { content:""; position:absolute; right:70px; bottom:-70px; width:130px; height:130px; border-radius:50%; background:rgba(255,255,255,.07); }
.tw-head > * { position:relative; z-index:1; }
.tw-head-icon { background:rgba(255,255,255,.18); border:1px solid rgba(255,255,255,.28); box-shadow:none; backdrop-filter:blur(4px); }
.tw-eyebrow { display:inline-block; background:rgba(255,255,255,.16); color:#e0e7ff; padding:.12rem .55rem; border-radius:999px; font-size:.64rem; margin-bottom:.3rem; }
.tw-head h1 { color:#fff; font-size:1.15rem; }
.tw-head p { color:rgba(255,255,255,.86); font-size:.84rem; }
.tw-stat { background:rgba(255,255,255,.14); border:1px solid rgba(255,255,255,.26); color:#e0e7ff; backdrop-filter:blur(4px); }
.tw-stat i { color:#bfdbfe; }
.tw-stat b { color:#fff; }
@media (min-width:768px){ .tw-head { padding:1.05rem 1.4rem; } .tw-head h1 { font-size:1.35rem; } }

/* section title */
.tw-title { font-size:1.05rem; }

/* subject cards */
.subject-card { position:relative; overflow:hidden; border:1px solid #e3e9f4; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.subject-card::before { content:""; position:absolute; left:0; top:0; bottom:0; width:4px; background:linear-gradient(var(--g1,#2563eb),var(--g2,#4f46e5)); }
.subject-card:hover { transform:translateY(-3px); box-shadow:0 14px 30px rgba(15,23,42,.10); border-color:var(--g1,#bfdbfe); }
.subject-icon { background:linear-gradient(135deg,var(--g1,#2563eb),var(--g2,#4f46e5)); color:#fff; box-shadow:0 6px 14px rgba(15,23,42,.15); }
.subject-no { background:#fff; color:var(--g1,#2563eb); box-shadow:0 1px 4px rgba(15,23,42,.2); }
.subject-meta span { background:var(--soft,#eff6ff); color:var(--g1,#2563eb); border-radius:999px; padding:0 .5rem; font-weight:600; }
.subject-go { width:28px; height:28px; border-radius:50%; background:var(--soft,#eff6ff); color:var(--g1,#2563eb); display:flex; align-items:center; justify-content:center; font-size:.75rem; }
.subject-card:hover .subject-go { background:var(--g1,#2563eb); color:#fff; }

/* chapter rows */
.chapter-row { border:1px solid #e3e9f4; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.chapter-row:hover { background:#fff; border-color:var(--g1,#93c5fd); box-shadow:0 10px 24px rgba(15,23,42,.08); transform:translateY(-2px); }
.chapter-no { background:linear-gradient(135deg,var(--g1,#2563eb),var(--g2,#4f46e5)); color:#fff; box-shadow:0 4px 10px rgba(15,23,42,.15); }
.chapter-row small { background:var(--soft,#eff6ff); color:var(--g1,#2563eb); border-radius:999px; padding:.05rem .5rem; font-weight:600; }
.chapter-row .bi-chevron-right { width:26px; height:26px; border-radius:50%; background:var(--soft,#eff6ff); color:var(--g1,#2563eb); display:flex; align-items:center; justify-content:center; font-size:.72rem; }

/* test cards */
.test-card { position:relative; overflow:hidden; border:1px solid #e3e9f4; box-shadow:0 2px 8px rgba(15,23,42,.04); padding-top:1.1rem; }
.test-card::before { content:""; position:absolute; left:0; right:0; top:0; height:4px; background:linear-gradient(90deg,var(--g1,#2563eb),var(--g2,#4f46e5)); }
.test-card:hover { transform:translateY(-3px); box-shadow:0 14px 30px rgba(15,23,42,.10); border-color:var(--g1,#bfdbfe); }
.test-badge { background:linear-gradient(135deg,#16a34a,#22c55e); color:#fff; }
.test-pills span { background:var(--soft,#f1f5f9); color:#334155; }
.test-pills span i { color:var(--g1,#2563eb); }
.test-card .btn-primary { background:linear-gradient(135deg,var(--g1,#2563eb),var(--g2,#4f46e5)); border:0; font-weight:600; }

/* test page start card */
.tw-start-card { border:1px solid #dbe6fb; background:linear-gradient(180deg,#ffffff,#f8fbff); box-shadow:0 10px 26px rgba(37,99,235,.10); }
.tw-fact { background:#fff; border:1px solid #e3e9f4; }
.tw-fact i { display:inline-flex; width:28px; height:28px; align-items:center; justify-content:center; border-radius:9px; background:#eff6ff; margin-bottom:.15rem; }
.tw-side-card { border:1px solid #e3e9f4; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.tw-test-links a.on { background:linear-gradient(135deg,#2563eb,#4f46e5); border-color:transparent; box-shadow:0 6px 14px rgba(37,99,235,.25); }
.tw-link-card { border:1px solid #e3e9f4; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.tw-link-card i.lead { background:linear-gradient(135deg,#2563eb,#4f46e5); color:#fff; }
.tw-link-card:hover { transform:translateY(-2px); box-shadow:0 10px 22px rgba(15,23,42,.08); }

/* article */
.topic-article { border:1px solid #e3e9f4; box-shadow:0 2px 10px rgba(15,23,42,.04); }
.topic-article h2, .topic-article h3 { color:#1e3a8a; }
.topic-article blockquote { border-left:4px solid #6366f1; background:#f5f7ff; padding:.6rem 1rem; border-radius:.5rem; }

/* ============================================================
   Question Papers
   ============================================================ */
.qp-tile { display:flex; flex-direction:column; align-items:center; text-align:center; gap:.55rem; background:#fff; border:1px solid #e3e9f4; border-radius:1.1rem; padding:1.1rem .7rem; height:100%; text-decoration:none; color:inherit; box-shadow:0 2px 8px rgba(15,23,42,.04); transition:.18s; position:relative; overflow:hidden; }
.qp-tile::before { content:""; position:absolute; left:0; right:0; top:0; height:4px; background:linear-gradient(90deg,var(--g1,#2563eb),var(--g2,#4f46e5)); }
.qp-tile:hover { transform:translateY(-3px); box-shadow:0 14px 30px rgba(15,23,42,.10); border-color:var(--g1,#bfdbfe); color:inherit; }
.qp-logo { width:64px; height:64px; border-radius:18px; background:var(--soft,#eff6ff); display:flex; align-items:center; justify-content:center; overflow:hidden; flex:0 0 auto; border:1px solid #e8edf5; }
.qp-logo img { width:100%; height:100%; object-fit:contain; padding:6px; }
.qp-logo-text { background:linear-gradient(135deg,var(--g1,#2563eb),var(--g2,#4f46e5)); color:#fff; font-weight:800; font-size:1.3rem; border:0; }
.qp-tile h2, .qp-tile h3 { font-size:.95rem; font-weight:700; margin:0; line-height:1.3; overflow-wrap:anywhere; }
.qp-tile small { color:#64748b; font-size:.76rem; }
.qp-tile .qp-count { background:var(--soft,#eff6ff); color:var(--g1,#2563eb); border-radius:999px; padding:.1rem .6rem; font-size:.72rem; font-weight:600; }

.qp-year { display:flex; align-items:center; gap:.6rem; margin:1.2rem 0 .6rem; font-weight:800; color:#1e3a8a; font-size:1.05rem; }
.qp-year::after { content:""; flex:1; height:1px; background:linear-gradient(90deg,#c7d7f5,transparent); }
.qp-paper { display:flex; align-items:center; gap:.8rem; background:#fff; border:1px solid #e3e9f4; border-radius:1rem; padding:.75rem .9rem; text-decoration:none; color:inherit; box-shadow:0 2px 8px rgba(15,23,42,.04); transition:.15s; }
.qp-paper:hover { transform:translateY(-2px); border-color:var(--g1,#93c5fd); box-shadow:0 10px 24px rgba(15,23,42,.08); color:inherit; }
.qp-paper-ico { flex:0 0 42px; height:42px; border-radius:12px; background:linear-gradient(135deg,#ef4444,#f97316); color:#fff; display:flex; align-items:center; justify-content:center; font-size:1.2rem; }
.qp-paper h3 { font-size:.93rem; font-weight:600; margin:0; line-height:1.35; overflow-wrap:anywhere; }
.qp-paper small { color:#64748b; font-size:.74rem; }
.qp-paper .go { margin-left:auto; flex:0 0 auto; width:28px; height:28px; border-radius:50%; background:#eff6ff; color:#2563eb; display:flex; align-items:center; justify-content:center; font-size:.75rem; }

/* paper post */
.qp-section { margin-bottom:1.1rem; }
.qp-viewer { background:#fff; border:1px solid #e3e9f4; border-radius:1.1rem; overflow:hidden; box-shadow:0 2px 10px rgba(15,23,42,.05); }
.qp-viewer-bar { display:flex; align-items:center; justify-content:space-between; gap:.5rem; padding:.6rem .9rem; background:#f8fafc; border-bottom:1px solid #e8edf5; font-size:.85rem; font-weight:600; }
.qp-viewer iframe { display:block; width:100%; height:72vh; min-height:420px; border:0; background:#f1f5f9; }
.qp-dl { background:linear-gradient(135deg,#eff6ff,#eef2ff); border:1px solid #cddcfa; border-radius:1.1rem; padding:1.1rem; text-align:center; }
.qp-dl-ico { width:56px; height:56px; border-radius:16px; background:linear-gradient(135deg,#ef4444,#f97316); color:#fff; display:inline-flex; align-items:center; justify-content:center; font-size:1.6rem; box-shadow:0 8px 18px rgba(239,68,68,.25); }
.qp-dl h2 { font-size:1.05rem; font-weight:700; margin:.6rem 0 .1rem; }
.qp-dl .btn-dl { background:linear-gradient(135deg,#2563eb,#4f46e5); border:0; color:#fff; font-weight:600; border-radius:.9rem; padding:.7rem 1.6rem; box-shadow:0 8px 18px rgba(37,99,235,.28); }
.qp-dl .btn-dl:hover { color:#fff; filter:brightness(1.06); }
.qp-dl .btn-dl.ready { background:linear-gradient(135deg,#16a34a,#22c55e); box-shadow:0 8px 18px rgba(22,163,74,.28); }
.qp-count-wrap { display:none; margin-top:.9rem; }
.qp-time { font-size:2rem; font-weight:800; font-variant-numeric:tabular-nums; color:#1e3a8a; line-height:1; }
.qp-bar { height:8px; border-radius:99px; background:#dbe6fb; overflow:hidden; margin:.7rem auto .4rem; max-width:340px; }
.qp-bar > div { height:100%; width:0; background:linear-gradient(90deg,#2563eb,#6366f1); transition:width 1s linear; }
.qp-faq .accordion-item { border:1px solid #e3e9f4; border-radius:.9rem !important; overflow:hidden; margin-bottom:.5rem; }
.qp-faq .accordion-button { font-weight:600; font-size:.93rem; }
.qp-faq .accordion-button:not(.collapsed) { background:#eff6ff; color:#1e3a8a; box-shadow:none; }

/* ============================================================
   v3 - small, clean LIGHT-BLUE header + search + share bar
   ============================================================ */
.tw-body { background:#f5f8fd; }
.tw-wrap { padding-top:.9rem; }

.tw-head { background:#eaf2fd; border:1px solid #d5e4f8; color:#0f172a; box-shadow:none; border-radius:1rem; padding:.7rem .9rem; margin:.4rem 0 .9rem; }
.tw-head::before, .tw-head::after { display:none; }
.tw-head-main { gap:.65rem; align-items:center; }
.tw-head-icon { flex:0 0 36px; height:36px; border-radius:10px; background:#2563eb; border:0; color:#fff; font-size:1.05rem; box-shadow:none; backdrop-filter:none; }
.tw-eyebrow { background:none; color:#2563eb; padding:0; margin:0 0 .05rem; font-size:.66rem; border-radius:0; }
.tw-head h1 { color:#0f2a56; font-size:1.05rem; font-weight:700; }
.tw-head p { color:#475f85; font-size:.8rem; margin-top:.15rem; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.tw-stats { margin-top:.55rem; gap:.35rem; }
.tw-stat { background:#fff; border:1px solid #d5e4f8; color:#47607f; backdrop-filter:none; font-size:.72rem; padding:.15rem .6rem; }
.tw-stat i { color:#2563eb; }
.tw-stat b { color:#0f2a56; }
@media (min-width:768px){ .tw-head { padding:.8rem 1.1rem; } .tw-head h1 { font-size:1.2rem; } .tw-head-icon { flex-basis:40px; height:40px; } .tw-head p { font-size:.85rem; } }

/* search */
.tw-search { position:relative; margin:0 0 1rem; }
.tw-search input { width:100%; height:48px; border:1px solid #d6e0ee; border-radius:.9rem; background:#fff; padding:0 2.6rem; font-size:.95rem; outline:none; box-shadow:0 1px 3px rgba(15,23,42,.04); -webkit-appearance:none; appearance:none; }
.tw-search input::-webkit-search-cancel-button { display:none; }
.tw-search input:focus { border-color:#2563eb; box-shadow:0 0 0 4px rgba(37,99,235,.12); }
.tw-search-ico { position:absolute; left:.95rem; top:50%; transform:translateY(-50%); color:#64748b; pointer-events:none; }
.tw-search-clear { position:absolute; right:.6rem; top:50%; transform:translateY(-50%); border:0; background:#eef2f7; color:#475569; width:26px; height:26px; border-radius:50%; line-height:1; font-size:1.1rem; padding:0; }
.tw-search-results { position:absolute; left:0; right:0; top:calc(100% + 6px); z-index:50; background:#fff; border:1px solid #dde6f3; border-radius:.9rem; box-shadow:0 14px 34px rgba(15,23,42,.15); max-height:60vh; overflow-y:auto; padding:.3rem; }
.tw-sr { display:flex; align-items:center; gap:.7rem; padding:.55rem .6rem; border-radius:.7rem; text-decoration:none; color:inherit; }
.tw-sr:hover { background:#f1f6fe; color:inherit; }
.tw-sr-ico { flex:0 0 34px; height:34px; border-radius:10px; background:#eaf2fd; color:#2563eb; display:flex; align-items:center; justify-content:center; }
.tw-sr-txt { min-width:0; flex:1; display:flex; flex-direction:column; line-height:1.3; }
.tw-sr-txt b { font-size:.88rem; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tw-sr-txt small { font-size:.72rem; color:#64748b; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.tw-sr .bi-chevron-right { color:#94a3b8; font-size:.75rem; }
.tw-sr-empty { padding:.9rem; text-align:center; color:#64748b; font-size:.88rem; }

/* share bar */
.tw-share { display:flex; align-items:center; gap:.6rem; flex-wrap:wrap; background:#fff; border:1px solid #e3e9f4; border-radius:1rem; padding:.6rem .8rem; margin:0 0 1rem; box-shadow:0 2px 8px rgba(15,23,42,.04); }
.tw-share-label { font-weight:700; font-size:.85rem; color:#0f2a56; display:flex; align-items:center; gap:.4rem; }
.tw-share-label i { color:#2563eb; }
.tw-share-btns { display:flex; flex-wrap:wrap; gap:.4rem; }
.tw-sb { display:inline-flex; align-items:center; gap:.4rem; border:0; border-radius:999px; padding:.4rem .8rem; font-size:.8rem; font-weight:600; color:#fff; text-decoration:none; line-height:1; cursor:pointer; transition:.15s; }
.tw-sb:hover { transform:translateY(-1px); filter:brightness(1.06); color:#fff; }
.tw-sb i { font-size:1rem; }
.tw-sb.wa { background:#25d366; } .tw-sb.tg { background:#229ed9; } .tw-sb.fb { background:#1877f2; } .tw-sb.x { background:#111827; }
.tw-sb.cp { background:#eef2f7; color:#334155; } .tw-sb.cp:hover { color:#334155; }
.tw-sb.nat { background:#2563eb; }
.tw-sb[hidden] { display:none; }
.tw-share.compact { padding:.45rem .6rem; }
@media (max-width:575.98px){
  .tw-share { padding:.55rem .6rem; gap:.45rem; }
  .tw-share-btns { width:100%; display:grid; grid-template-columns:repeat(auto-fit,minmax(44px,1fr)); }
  .tw-sb { justify-content:center; padding:.6rem .4rem; border-radius:.8rem; }
  .tw-sb span { display:none; }
  .tw-sb.cp span, .tw-sb.nat span { display:none; }
  .tw-sb i { font-size:1.2rem; }
}