/* So sánh văn bản (/cong-cu/soat-trung-lap). Tệp nạp ở mọi trang → mọi lớp có tiền tố stl-. */
.chinh:has(> .stl) { max-width: 1280px; }
.stl-an { position: absolute !important; width: 1px; height: 1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; }
.stl-dau { margin-bottom: 12px; max-width: 900px; }
.stl-dau h1 { margin-bottom: 4px; }
.stl-hai { display: grid; gap: 14px; grid-template-columns: minmax(0, 1fr); }
@media (min-width: 900px) { .stl-hai { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); } }
.stl-o { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.stl-o__dau { display: flex; justify-content: space-between; align-items: baseline; gap: 8px; }
.stl-o__ten { font-weight: 700; font-size: 1.05rem; }
.stl-chu { width: 100%; min-height: 220px; padding: 10px 12px; border: 1px solid #cfd6d1; border-radius: var(--r-nho); font: inherit; line-height: 1.6; resize: vertical; }
.stl-chu:focus { border-color: var(--c); outline: 3px solid var(--c-nhat); }
.stl-chinh { display: flex; flex-wrap: wrap; gap: 12px 16px; align-items: flex-end; margin-top: 14px; }
.stl-n { min-width: 180px; }
.stl-goi-y { flex: 1 1 100%; margin: 0; }
.stl-so-lieu { list-style: none; margin: 0 0 12px; padding: 0; display: grid; gap: 8px; grid-template-columns: repeat(auto-fit, minmax(170px, 1fr)); }
.stl-so-lieu li { background: var(--the); border: 1px solid var(--vien); border-radius: var(--r-nho); padding: 10px 14px; display: flex; flex-direction: column; }
.stl-so-lieu b { font-size: 1.6rem; color: var(--c-dam); line-height: 1.2; }
.stl-so-lieu span { font-size: .8125rem; color: var(--phu); }
.stl-tab { display: flex; gap: 6px; overflow-x: auto; margin-bottom: 12px; }
.stl-tab [role="tab"] { flex: none; min-height: 44px; padding: 8px 16px; border-radius: 999px; border: 1px solid var(--vien); background: var(--the);
  color: var(--chu); font: inherit; font-weight: 700; cursor: pointer; }
.stl-tab [role="tab"][aria-selected="true"] { background: var(--c-dam); border-color: var(--c-dam); color: #fff; }
.stl-xem { white-space: pre-wrap; overflow-wrap: anywhere; line-height: 1.75; max-height: 70vh; overflow: auto; padding: 10px 12px; background: #fbfbf9;
  border: 1px solid var(--vien); border-radius: var(--r-nho); }
.stl-xem h3, .stl-hai h3 { font-size: 1rem; }
mark.stl-trung { background: #fbe3a6; color: inherit; border-radius: 3px; padding: 0 1px; }
del.stl-bot { background: var(--do-nhat); color: #8f1c13; text-decoration: line-through; text-decoration-thickness: 1px; }
ins.stl-them { background: var(--xanh-la-nhat); color: #145a2a; text-decoration: underline; text-decoration-thickness: 1px; }
.stl-khac-dau { display: flex; flex-wrap: wrap; gap: 10px 16px; align-items: center; margin-bottom: 10px; }
.stl-chu-giai { margin: 0; display: flex; gap: 10px; }
.stl-kieu { display: inline-flex; border: 1px solid var(--c-vien); border-radius: 999px; overflow: hidden; }
.stl-kieu label { position: relative; cursor: pointer; }
.stl-kieu input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.stl-kieu span { display: block; padding: 8px 16px; font-weight: 700; color: var(--c-dam); }
.stl-kieu input:checked + span { background: var(--c-dam); color: #fff; }
.stl-kieu input:focus-visible + span { outline: 3px solid var(--nhan); outline-offset: -3px; }
.stl-ds { margin: 0; padding-left: 1.4em; }
.stl-ds li { margin-bottom: 10px; line-height: 1.6; }
#stl-bao:empty { display: none; }
#stl-bao { margin-top: 12px; }