html:has(body.elc-ielts-player-fullscreen-body),
body.elc-ielts-player-fullscreen-body {
	margin: 0;
	padding: 0;
	height: 100%;
	background: #f3f4f6;
}

.elc-ielts-reading-player {
	font-family: 'Inter', sans-serif;
	display: flex;
	flex-direction: column;
	height: calc(100vh - 24px);
	margin: 12px 8px 12px 8px;
	border-radius: 18px;
	overflow: hidden;
	box-shadow: 0 10px 30px rgba(0, 0, 0, 0.08);
}

@media (max-width: 900px) {
	.elc-ielts-reading-player {
		margin-left: 16px;
	}
}

.elc-irp-close {
	background: none;
	border: none;
	font-size: 20px;
	color: #6b7280;
	cursor: pointer;
	padding: 4px 8px;
	border-radius: 8px;
	line-height: 1;
	transition: background 0.15s, color 0.15s;
}

.elc-irp-close:hover {
	background: #f3f4f6;
	color: #1f2937;
}

.elc-irp-topbar {
	display: flex;
	align-items: center;
	gap: 16px;
	background: #fff;
	color: #1f2937;
	border-bottom: 1px solid #e5e7eb;
	padding: 14px 24px;
	flex: 0 0 auto;
}

.elc-irp-title {
	flex: 1;
	font-size: 15px;
}

.elc-irp-timer {
	font-size: 18px;
	font-weight: 700;
	font-variant-numeric: tabular-nums;
	background: #f3f4f6;
	color: #1f2937;
	padding: 4px 14px;
	border-radius: 999px;
}

.elc-irp-timer-warn {
	background: #dc2626;
}

.elc-irp-submit {
	background: #4B8EDE;
	color: #fff;
	border: none;
	border-radius: 999px;
	padding: 8px 20px;
	font-weight: 600;
	cursor: pointer;
}

.elc-irp-submit:disabled {
	background: #6b7280;
	cursor: default;
}

.elc-irp-body {
	flex: 1 1 auto;
	overflow: hidden;
}

.elc-irp-split {
	display: flex;
	height: 100%;
}

.elc-irp-col {
	box-sizing: border-box;
	min-width: 0;
	overflow-y: auto;
	padding: 24px 28px;
}

.elc-irp-col-passage {
	flex: 0 0 55%;
	background: #fff;
	border-right: 1px solid #e5e7eb;
	line-height: 1.8;
	position: relative;
}

/* Nội dung dán từ Word/Google Docs có thể mang font-family inline. Passage
 * đầu ra luôn dùng Inter, kể cả các thẻ con có style font riêng. */
.elc-irp-col-passage,
.elc-irp-col-passage * {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
}

.elc-irp-col-questions {
	flex: 0 0 45%;
	background: #f2f2f7;
}

@media (max-width: 900px) {
	.elc-irp-split {
		flex-direction: column;
	}

	.elc-irp-col-passage,
	.elc-irp-col-questions {
		flex: 1 1 auto;
	}
}

/* ---------- Đáy màn hình: chuyển Passage + dải số câu hỏi ---------- */

.elc-irp-bottombar {
	flex: 0 0 auto;
	background: #fff;
	border-top: 1px solid #e5e7eb;
	padding: 10px 24px;
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.elc-irp-switcher {
	display: flex;
	gap: 8px;
	flex: 0 0 auto;
}

.elc-irp-switch-pill {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	background: #f3f4f6;
	border: 1px solid transparent;
	border-radius: 10px;
	padding: 6px 14px;
	cursor: pointer;
	font-size: 12px;
	color: #374151;
}

.elc-irp-switch-pill.elc-irp-switch-active {
	background: #EBF7FF;
	border-color: #4B8EDE;
	color: #4B8EDE;
}

.elc-irp-switch-title {
	font-weight: 700;
}

.elc-irp-switch-progress {
	font-variant-numeric: tabular-nums;
}

.elc-irp-qnav {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
	flex: 1 1 auto;
}

.elc-irp-qnav-btn {
	width: 30px;
	height: 30px;
	border-radius: 50%;
	border: 1px solid #e5e7eb;
	background: #fff;
	color: #374151;
	font-size: 12px;
	font-weight: 600;
	cursor: pointer;
}

.elc-irp-qnav-btn.elc-irp-qnav-answered {
	background: #4B8EDE;
	border-color: #4B8EDE;
	color: #fff;
}

.elc-irp-qnav-btn.elc-irp-qnav-current-passage {
	box-shadow: 0 0 0 2px #EBF7FF;
}

.elc-irp-passage-content {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
	font-size: 18px;
	line-height: 1.8;
}

.elc-irp-passage-content p,
.elc-irp-passage-content li,
.elc-irp-passage-content blockquote,
.elc-irp-passage-content div,
.elc-irp-passage-content span,
.elc-irp-passage-content figcaption {
	font-size: 18px;
	margin-bottom: 1em;
}

.elc-irp-passage-content p {
	text-indent: 2em;
}

.elc-irp-passage h2 {
	font-size: 18px;
	margin-top: 0;
}

.elc-irp-hl-controls {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 10px;
	font-size: 12px;
	color: #6b7280;
	margin-bottom: 10px;
	font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

.elc-irp-passage-num {
	color: #4B8EDE;
	font-weight: 700;
}

.elc-irp-group {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 16px;
	padding: 18px 20px;
	margin-bottom: 18px;
}

.elc-irp-instructions {
	background: #EBF7FF;
	color: #4B8EDE;
	font-weight: 600;
	padding: 10px 14px;
	margin: -18px -20px 14px;
	border-radius: 16px 16px 0 0;
	white-space: pre-line;
}

/* Editor trực quan lưu hướng dẫn bằng thẻ <p> - bỏ margin kẻo cộng dồn với white-space pre-line thành cách dòng đôi. */
.elc-irp-instructions p {
	margin: 0;
}

.elc-irp-instructions ul,
.elc-irp-instructions ol {
	margin: 4px 0;
	padding-left: 22px;
}

.elc-irp-wordbank {
	background: #f8fafc;
	border-left: 3px solid #EBF7FF;
	border-radius: 10px;
	padding: 10px 14px;
	margin-bottom: 12px;
	font-size: 13px;
}

.elc-irp-optionlist {
	margin: 6px 0 0;
	padding-left: 18px;
}

.elc-irp-optionlist li {
	margin-bottom: 4px;
}

.elc-irp-question {
	margin-bottom: 16px;
	padding: 10px 12px;
	border-radius: 10px;
}

.elc-irp-prompt {
	margin: 0 0 8px;
	font-weight: 600;
	font-size: 16px;
}

.elc-irp-qnum {
	color: #4B8EDE;
	font-weight: 700;
}

.elc-irp-option {
	display: block;
	margin-bottom: 4px;
	cursor: pointer;
	font-size: 16px;
}

.elc-irp-input input[type="text"],
.elc-irp-input select {
	width: 100%;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 8px 12px;
	font-size: 16px;
	box-sizing: border-box;
}

.elc-irp-question.elc-irp-correct {
	background: #ecfdf5;
}

.elc-irp-question.elc-irp-wrong {
	background: #EBF7FF;
}

/* ---------- Kéo-thả dạng Matching Heading/Feature/Ending (khung hộp danh sách kiểu DOL + ô thả cho từng câu) ---------- */

.elc-irp-dragbank {
	display: flex;
	flex-direction: column;
	gap: 6px;
	padding: 12px;
	margin-bottom: 16px;
	background: #f8fafc;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
}

/* Bố cục 2 cột: danh sách lựa chọn (trái) + câu hỏi/ô thả (phải) - kéo ngang nhanh hơn kéo dọc. */
.elc-irp-draglayout {
	display: grid;
	grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
	gap: 16px;
	align-items: start;
}

.elc-irp-draglayout .elc-irp-dragbank {
	margin-bottom: 0;
	position: sticky;
	top: 12px;
	z-index: 1;
}

@media (max-width: 700px) {
	.elc-irp-draglayout {
		grid-template-columns: minmax(0, 1fr);
	}

	.elc-irp-draglayout .elc-irp-dragbank {
		position: static;
	}
}

.elc-irp-dragbank-title {
	font-weight: 700;
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.03em;
	color: #6b7280;
	padding: 0 4px 4px;
}

.elc-irp-dragchip {
	display: flex;
	align-items: center;
	gap: 8px;
	background: #fff;
	border: 1px solid #e5e7eb;
	color: #1f2937;
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 16px;
	cursor: grab;
	user-select: none;
}

.elc-irp-dragchip:hover {
	border-color: #4B8EDE;
}

.elc-irp-dragchip:active {
	cursor: grabbing;
}

.elc-irp-dragchip-handle {
	color: #9ca3af;
	font-size: 14px;
	line-height: 1;
}

.elc-irp-dragchip-label {
	font-weight: 700;
	color: #4B8EDE;
}

.elc-irp-dragchip-text {
	flex: 1;
}

.elc-irp-dragchip.is-used {
	opacity: 0.5;
}

.elc-irp-dragchip.is-selected {
	background: #EBF7FF;
	border-color: #4B8EDE;
}

.elc-irp-dropzones {
	display: flex;
	flex-direction: column;
	gap: 8px;
}

/* Trong khối kéo-thả matching, bỏ margin/padding của .elc-irp-question để các câu gần nhau hơn. */
.elc-irp-dropzones .elc-irp-question {
	margin-bottom: 0;
	padding: 0;
}

.elc-irp-dropzone {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 8px;
	min-height: 40px;
	border: 2px dashed #cbd5e1;
	border-radius: 10px;
	padding: 8px 12px;
	cursor: pointer;
}

.elc-irp-dropzone.is-dragover {
	border-color: #4B8EDE;
	background: #EBF7FF;
}

.elc-irp-dropzone.is-filled {
	border-style: solid;
	border-color: #e5e7eb;
	background: #f8fafc;
	cursor: default;
}

.elc-irp-dropzone-placeholder {
	color: #9ca3af;
	font-size: 15px;
}

.elc-irp-dropzone-label {
	font-size: 16px;
	font-weight: 600;
}

.elc-irp-dropzone-clear {
	background: none;
	border: none;
	color: #9ca3af;
	cursor: pointer;
	font-size: 13px;
	padding: 2px 6px;
}

.elc-irp-dropzone-clear:hover {
	color: #dc2626;
}

.elc-irp-dropzone.elc-irp-correct {
	background: #ecfdf5;
	border-color: #16a34a;
}

.elc-irp-dropzone.elc-irp-wrong {
	background: #EBF7FF;
	border-color: #dc2626;
}

/* ---------- Lưới tick dạng Matching Info (hàng = câu hỏi, cột = chữ cái đoạn văn A-H) ---------- */

.elc-irp-matrix-wrap {
	container-type: inline-size;
	min-width: 0;
	margin-bottom: 14px;
	border: 1px solid #e5e7eb;
	border-radius: 12px;
}

.elc-irp-matrix {
	border-collapse: collapse;
	table-layout: fixed;
	width: 100%;
	font-size: 16px;
}

.elc-irp-matrix th,
.elc-irp-matrix td {
	border: 1px solid #eef1f5;
	text-align: center;
	vertical-align: middle;
}

.elc-irp-matrix thead th {
	background: #f8fafc;
	color: #4B8EDE;
	font-weight: 700;
	font-style: italic;
	padding: 10px 6px;
	min-width: 0;
}

.elc-irp-matrix .elc-irp-matrix-prompt {
	text-align: left;
	font-weight: 600;
	background: #fff;
	padding: 10px 12px;
	white-space: normal;
	overflow-wrap: anywhere;
	word-break: normal;
}

.elc-irp-matrix td.elc-irp-matrix-cell {
	padding: 0;
}

.elc-irp-matrix-tick {
	display: flex;
	justify-content: center;
	align-items: center;
	min-height: 44px;
	padding: 12px 0;
	cursor: pointer;
	margin: 0;
}

.elc-irp-matrix-tick input[type="radio"] {
	width: 20px;
	height: 20px;
	margin: 0;
	accent-color: #4B8EDE;
	cursor: pointer;
}

.elc-irp-matrix tbody tr:hover td {
	background: #f8fafc;
}

.elc-irp-matrix tr.elc-irp-correct th,
.elc-irp-matrix tr.elc-irp-correct td {
	background: #ecfdf5;
}

.elc-irp-matrix tr.elc-irp-wrong th,
.elc-irp-matrix tr.elc-irp-wrong td {
	background: #EBF7FF;
}

.elc-irp-matrix td.elc-irp-cell-correct {
	background: #d1fae5 !important;
	box-shadow: inset 0 0 0 2px #16a34a;
}

.elc-irp-matrix td.elc-irp-cell-wrong {
	background: #fee2e2 !important;
	box-shadow: inset 0 0 0 2px #dc2626;
}

.elc-irp-matrix tr.elc-irp-flash th,
.elc-irp-matrix tr.elc-irp-flash td {
	background: #EBF7FF;
}

.elc-irp-matrix-review {
	margin-bottom: 10px;
	padding: 10px 12px;
	border-radius: 10px;
	border: 1px solid #d1d1d6;
	background: #fff;
}

.elc-irp-matrix-review.elc-irp-correct {
	background: #fff;
}

.elc-irp-matrix-review.elc-irp-wrong {
	background: #fff;
}

.elc-irp-matrix-review .elc-irp-answer-review {
	margin-top: 2px;
}

.elc-irp-review-head {
	display: flex;
	align-items: baseline;
	gap: 10px;
}

.elc-irp-review-head .elc-irp-qnum {
	font-weight: 700;
}

/* ---------- Văn bản điền khuyết (note/form/summary completion - input inline trong văn bản) ---------- */

.elc-irp-note {
	border: 1px solid #e5e7eb;
	border-radius: 12px;
	padding: 18px 22px;
	margin-bottom: 14px;
	font-size: 16px;
	line-height: 2.3;
}

.elc-irp-note h2,
.elc-irp-note h3,
.elc-irp-note h4 {
	margin: 10px 0 4px;
	line-height: 1.4;
}

.elc-irp-note ul,
.elc-irp-note ol {
	margin: 4px 0;
	padding-left: 24px;
}

.elc-irp-note h2 {
	font-size: 22px;
}

.elc-irp-note h3 {
	font-size: 19px;
}

.elc-irp-note h4 {
	font-size: 16px;
}

/* Bảng trong văn bản điền khuyết (soạn bằng cú pháp | ô 1 | ô 2 |) */

.elc-irp-note-table-wrap {
	overflow-x: auto;
	margin: 10px 0;
}

.elc-irp-note-table {
	border-collapse: collapse;
	width: 100%;
	line-height: 1.7;
}

.elc-irp-note-table th,
.elc-irp-note-table td {
	border: 1px solid #d1d5db;
	padding: 10px 12px;
	text-align: left;
	vertical-align: middle;
}

.elc-irp-note-table th {
	background: #EBF7FF;
	font-weight: 700;
}

.elc-irp-gap {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	margin: 0 4px;
	vertical-align: middle;
}

.elc-irp-gap-num {
	color: #4B8EDE;
	font-weight: 700;
	font-size: 13px;
}

/* Ô điền kiểu gạch chân ____________ như đề thi thật - KHÔNG khung, KHÔNG bo góc. */
.elc-irp-gap input[type="text"] {
	width: 150px;
	border: none;
	border-bottom: 2px solid #9ca3af;
	border-radius: 0;
	background: transparent;
	padding: 2px 8px;
	font-size: 16px;
	line-height: 1.4;
	text-align: center;
}

.elc-irp-gap input[type="text"]:focus {
	outline: none;
	border-bottom-color: #4B8EDE;
	box-shadow: none;
	background: #EBF7FF;
}

.elc-irp-gap-correct input[type="text"] {
	border-bottom-color: #16a34a;
	color: #166534;
	font-weight: 600;
}

.elc-irp-gap-wrong input[type="text"] {
	border-bottom-color: #dc2626;
	color: #991b1b;
	font-weight: 600;
	text-decoration: line-through;
}

.elc-irp-gap.elc-irp-flash input[type="text"] {
	box-shadow: 0 0 0 3px #4B8EDE;
}

.elc-irp-answer-review {
	margin-top: 8px;
	/* Không đặt font-size riêng - kế thừa đúng size của câu hỏi (.elc-irp-prompt, cùng nằm trong .elc-irp-question) để đồng bộ, không bị nhỏ hơn. */
}

.elc-irp-review-label-correct {
	font-weight: 700;
	color: #16a34a;
}

.elc-irp-review-label-wrong {
	font-weight: 700;
	color: #dc2626;
}

.elc-irp-review-correct-answer {
	color: #111827;
	margin-top: 2px;
}

.elc-irp-review-correct-answer strong {
	color: #16a34a;
}

.elc-irp-explanation {
	color: #374151;
	margin-top: 4px;
	/* Không đặt font-size riêng - kế thừa đúng size của câu hỏi hiện tại (.elc-irp-prompt), đồng bộ theo yêu cầu, tránh nhỏ/nhạt hơn phần câu hỏi. */
}

.elc-irp-explanation p {
	margin: 0 0 6px;
}

.elc-irp-explanation p:last-child,
.elc-irp-explanation ul:last-child,
.elc-irp-explanation ol:last-child {
	margin-bottom: 0;
}

.elc-irp-score-banner {
	background: linear-gradient(120deg, #4B8EDE, #4B8EDE);
	color: #fff;
	border-radius: 14px;
	padding: 14px 18px;
	margin-bottom: 20px;
	font-size: 15px;
}

.elc-irp-error {
	padding: 24px;
	color: #991b1b;
}

.elc-irp-question.elc-irp-flash {
	box-shadow: 0 0 0 3px #4B8EDE;
}

.elc-irp-evidence-btn {
	margin-top: 6px;
}

/* ---------- Modal (xác nhận nộp bài / kết quả) ---------- */

.elc-irp-modal-overlay {
	position: fixed;
	inset: 0;
	background: rgba(15, 23, 42, 0.5);
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 100000;
}

.elc-irp-modal-box {
	background: #fff;
	border-radius: 22px;
	padding: 28px 32px;
	max-width: 420px;
	width: 90%;
	text-align: center;
	box-shadow: 0 20px 60px rgba(0, 0, 0, 0.25);
}

.elc-irp-modal-box h3 {
	margin-top: 0;
	font-size: 20px;
}

.elc-irp-modal-actions {
	display: flex;
	gap: 10px;
	justify-content: center;
	margin-top: 20px;
}

/* Modal nhập ghi chú (style macOS) */

.elc-irp-note-modal {
	max-width: 480px;
	text-align: left;
}

.elc-irp-note-input {
	width: 100%;
	height: 180px;
	border: 1px solid #d1d5db;
	border-radius: 8px;
	padding: 10px 12px;
	font-size: 14px;
	font-family: inherit;
	box-sizing: border-box;
	resize: vertical;
	margin: 12px 0 0;
	line-height: 1.5;
}

.elc-irp-note-input:focus {
	outline: none;
	border-color: #4B8EDE;
	box-shadow: 0 0 0 3px rgba(75, 142, 222, 0.15);
}

/* ---------- Highlight/note lúc làm bài Reading (KHÔNG lưu server) ---------- */

.elc-irp-hl-toolbar {
	position: absolute;
	display: none;
	align-items: center;
	gap: 6px;
	background: #1f2937;
	padding: 6px 8px;
	border-radius: 10px;
	z-index: 100001;
	box-shadow: 0 8px 20px rgba(0, 0, 0, 0.25);
}

.elc-irp-hl-swatch {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 2px solid #fff;
	cursor: pointer;
	padding: 0;
}

.elc-irp-hl-note-btn,
.elc-irp-hl-erase-btn {
	background: transparent;
	border: none;
	color: #fff;
	cursor: pointer;
	font-size: 14px;
	padding: 2px 4px;
}

.elc-irp-hl-yellow { background: #fef08a; }
.elc-irp-hl-green { background: #bbf7d0; }
.elc-irp-hl-blue { background: #EBF7FF; }
.elc-irp-hl-pink { background: #fbcfe8; }

mark.elc-irp-hl {
	border-radius: 2px;
	cursor: pointer;
}

mark.elc-irp-hl-noted {
	border-bottom: 2px dotted #6b7280;
}

mark.elc-irp-evidence-mark {
	background: #fde68a;
	border-radius: 2px;
}

/* ---------- Listening: KHÔNG chia đôi màn hình - 1 cột dọc + khung nổi góc phải ---------- */

.elc-ilp-single-col {
	height: 100%;
	overflow-y: auto;
	max-width: 1200px;
	margin: 0 auto;
	padding: 24px 28px 60px;
	line-height: 1.8;
	font-size: 16px;
}

.elc-ilp-questions-col {
	margin-top: 12px;
}

.elc-ilp-cornernav {
	position: fixed;
	top: 150px;
	right: 24px;
	width: 264px;
	max-height: 55vh;
	overflow-y: auto;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 16px;
	padding: 16px;
	box-shadow: 0 8px 24px rgba(0, 0, 0, 0.1);
	z-index: 500;
}

.elc-ilp-cornernav .elc-irp-qnav-btn {
	width: 38px;
	height: 38px;
	font-size: 14px;
}

.elc-ilp-cornernav-head {
	font-weight: 700;
	margin-bottom: 10px;
	font-size: 13px;
	color: #374151;
}

.elc-ilp-cornernav-grid {
	display: flex;
	flex-wrap: wrap;
	gap: 6px;
}

@media (max-width: 900px) {
	.elc-ilp-cornernav {
		display: none;
	}
}

/* Audio player (Listening) - thanh cố định ở đáy, trong bottombar phía trên dải Section */

.elc-ilp-bottombar {
	flex-direction: column;
	align-items: stretch;
	gap: 8px;
	padding: 8px 24px 10px;
}

.elc-ilp-audiobar {
	display: flex;
	align-items: center;
	gap: 14px;
	border-bottom: 1px solid #f1f5f9;
	padding-bottom: 8px;
}

.elc-ilp-audiobar .elc-ilp-audio {
	flex: 1 1 auto;
	height: 40px;
	margin: 0;
}

.elc-ilp-speed-label {
	flex: 0 0 auto;
	font-size: 13px;
	white-space: nowrap;
}

.elc-ilp-speed-label select {
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 4px 8px;
	margin-left: 6px;
}

.elc-ilp-audiobar .elc-irp-btn-ghost {
	flex: 0 0 auto;
	white-space: nowrap;
}

.elc-ilp-bottom-row {
	display: flex;
	align-items: center;
	gap: 20px;
	flex-wrap: wrap;
}

.elc-irp-btn-ghost {
	background: #f3f4f6;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 6px 12px;
	font-size: 13px;
	cursor: pointer;
}

.elc-irp-btn-ghost:hover {
	background: #e5e7eb;
}

.elc-irp-btn-ghost.is-active {
	background: #4B8EDE;
	border-color: #4B8EDE;
	color: #fff;
}

/* ---------- Từ vựng: gạch chân + hộp thoại nghĩa (chỉ hiện sau khi nộp bài, xem lời giải) ---------- */

.elc-irp-vocab-word {
	border-bottom: 1.5px dotted rgba(75, 142, 222, 0.4);
	cursor: pointer;
}

.elc-irp-vocab-word:hover {
	border-bottom-color: rgba(75, 142, 222, 0.85);
}

.elc-irp-vocab-popup {
	position: absolute;
	width: 260px;
	background: #ffffff;
	padding: 16px 18px;
	border-radius: 14px;
	border: 1px solid rgba(0, 0, 0, 0.06);
	box-shadow: 0 10px 28px rgba(0, 0, 0, 0.18);
	z-index: 100002;
	font-family: -apple-system, BlinkMacSystemFont, 'SF Pro Display', 'Segoe UI', Roboto, sans-serif;
}

.elc-irp-vocab-popup[hidden] {
	display: none;
}

.elc-irp-vocab-popup-header {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: 10px;
}

.elc-irp-vocab-popup-close {
	background: none;
	border: none;
	font-size: 12px;
	font-weight: 600;
	color: #9ca3af;
	cursor: pointer;
	padding: 4px 2px;
	line-height: 1;
}

.elc-irp-vocab-popup-close:hover {
	color: #1f2937;
}

.elc-irp-vocab-popup-star {
	background: #f3f4f6;
	border: none;
	border-radius: 999px;
	font-size: 11px;
	font-weight: 600;
	line-height: 1;
	color: #6b7280;
	cursor: pointer;
	padding: 6px 12px;
}

.elc-irp-vocab-popup-star.is-starred {
	background: #fef3c7;
	color: #92400e;
}

.elc-irp-vocab-popup-word {
	font-size: 19px;
	font-weight: 700;
	color: #1f2937;
}

.elc-irp-vocab-popup-phonetic {
	font-size: 13px;
	color: #6b7280;
	margin-top: 2px;
}

.elc-irp-vocab-popup-pos {
	display: inline-block;
	font-size: 11px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #4B8EDE;
	font-weight: 600;
	margin-top: 8px;
}

.elc-irp-vocab-popup-meaning {
	font-size: 15px;
	font-weight: 600;
	color: #1f2937;
	margin-top: 6px;
}

.elc-irp-vocab-popup-example {
	font-size: 13px;
	font-style: italic;
	color: #6b7280;
	margin-top: 8px;
}

.elc-irp-vocab-popup-example:empty,
.elc-irp-vocab-popup-meaning:empty {
	display: none;
}

.elc-ilp-transcript {
	font-size: 14px;
	line-height: 1.8;
}

.elc-ilp-transcript:empty {
	display: none;
}

/* Writing submit page */

.elc-iws-body {
	flex: 1 1 auto;
	overflow-y: auto;
	display: flex;
	flex-wrap: wrap;
	gap: 24px;
	padding: 24px;
}

/* Khung đề - bo góc Mac OS, nền trắng (trước đây thả nổi không khung, hoà lẫn nền xám của thân trang). */
.elc-iws-prompt {
	flex: 1 1 320px;
	line-height: 1.8;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 18px;
	padding: 22px 24px;
	box-sizing: border-box;
}

.elc-iws-chart {
	max-width: 100%;
	border-radius: 10px;
	margin-bottom: 12px;
	display: block;
}

.elc-iws-editor {
	flex: 1 1 380px;
}

/*
 * height/background khai báo tường minh (KHÔNG chỉ dựa vào thuộc tính
 * rows="22" hay để nền mặc định) vì theme Blocksy có luật CSS toàn cục
 * `textarea { height: var(--theme-form-field-height, 40px); background-color:
 * var(--theme-form-field-background-initial-color) }` áp cho MỌI textarea
 * trên site kể cả ngoài <form> - luật đó thắng vì khối này trước đây không tự
 * khai báo nên rows bị vô hiệu (ô chỉ cao 40px) và nền bị ngả màu theo theme
 * thay vì trắng thật. ~42 dòng ở font-size 17px/line-height 1.6 - không giới
 * hạn max-height vì .elc-iws-body đã tự cuộn (overflow-y: auto).
 */
.elc-iws-editor textarea {
	width: 100%;
	height: 1170px;
	min-height: 320px;
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 18px;
	padding: 20px 22px;
	font-size: 17px;
	line-height: 1.6;
	box-sizing: border-box;
	font-family: inherit;
	resize: vertical;
}

.elc-iws-footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 8px;
}

.elc-iws-history {
	flex: 1 1 100%;
	border-top: 1px solid #f3f4f6;
	padding-top: 16px;
}

.elc-iws-history-row {
	background: #f9fafb;
	border-radius: 10px;
	padding: 10px 14px;
	margin-bottom: 8px;
	font-size: 14px;
}

.elc-iws-grade {
	margin-top: 6px;
	font-size: 14px;
}

.elc-iws-comment {
	color: #6b7280;
	font-size: 13px;
	margin-top: 4px;
}

/* Từ vựng theo bài (Flashcard + Trắc nghiệm) */

#elc-ielts-vocab-practice {
	font-family: 'Inter', sans-serif;
	max-width: 1400px;
	margin: 0 auto;
}

/* ===== Sidebar TRÁI (Flashcard/Bài tập) thay cho thanh ngang tối màu cũ -
   elc-vocab KHÔNG có khái niệm tab này nên dùng kiểu nav dọc nhẹ nhàng, không
   phải thanh đen bôi active kiểu cũ. ===== */
.elc-ivp-layout {
	display: flex;
	align-items: flex-start;
	gap: 24px;
}

.elc-ivp-sidebar {
	flex: 0 0 190px;
	display: flex;
	flex-direction: column;
	gap: 6px;
	position: sticky;
	top: 24px;
}

.elc-ivp-tab {
	display: block;
	width: 100%;
	text-align: left;
	background: #fff;
	border: 1px solid #e5e7eb;
	color: #4b5563;
	font-weight: 600;
	font-size: 14px;
	padding: 12px 14px;
	border-radius: 10px;
	cursor: pointer;
	font-family: inherit;
}

.elc-ivp-tab:hover {
	border-color: #EBF7FF;
}

.elc-ivp-tab.active {
	background: #EBF7FF;
	border-color: #4B8EDE;
	color: #4B8EDE;
}

/* Không còn khung/viền/nền bao ngoài toàn bộ nội dung - từng khối con (thẻ,
   wordlist, câu hỏi) tự có khung riêng, giống cách elc-vocab không bọc 1
   khung lớn quanh cả trang flashcard. */
.elc-ivp-body {
	flex: 1;
	min-width: 0;
	text-align: center;
}

@media (max-width: 700px) {
	.elc-ivp-layout {
		flex-direction: column;
	}

	.elc-ivp-sidebar {
		flex-direction: row;
		width: 100%;
		position: static;
	}

	.elc-ivp-tab {
		flex: 1;
		text-align: center;
	}
}

/* ===== Flashcard - đồng bộ tinh thần với elc-vocab-flashcard.js/.css (thẻ
   lật 3D, sao đánh dấu góc trên phải, danh sách từ bên dưới) nhưng phóng to
   hơn nữa (860px) để không bị lọt thỏm trên màn hình rộng - vẫn co giãn tốt
   trên máy nhỏ nhờ dùng max-width thay vì width cố định. ===== */

.elc-ivp-fcvariants {
	display: flex;
	gap: 8px;
	justify-content: center;
	margin-bottom: 16px;
	flex-wrap: wrap;
}

.elc-ivp-card {
	position: relative;
	perspective: 1200px;
	height: 500px;
	max-width: 860px;
	cursor: pointer;
	margin: 16px auto 20px;
}

.elc-ivp-card-inner {
	position: relative;
	width: 100%;
	height: 100%;
	transition: transform 0.5s;
	transform-style: preserve-3d;
}

.elc-ivp-card.flipped .elc-ivp-card-inner {
	transform: rotateY(180deg);
}

.elc-ivp-card-front,
.elc-ivp-card-back {
	position: absolute;
	inset: 0;
	backface-visibility: hidden;
	border-radius: 18px;
	border: 1px solid #e5e7eb;
	box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08), 0 1px 2px rgba(0, 0, 0, 0.04);
	background: #fff;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	padding: 32px;
	box-sizing: border-box;
	text-align: center;
}

.elc-ivp-card-back {
	transform: rotateY(180deg);
}

.elc-ivp-star {
	position: absolute;
	top: 14px;
	right: 16px;
	z-index: 2;
	background: none;
	border: none;
	font-size: 26px;
	line-height: 1;
	color: #d1d5db;
	cursor: pointer;
	padding: 4px;
}

.elc-ivp-star.starred {
	color: #f59e0b;
}

.elc-ivp-card-word {
	font-size: 54px;
	font-weight: 700;
	color: #1f2937;
}

.elc-ivp-card-phonetic {
	color: #6b7280;
	font-size: 18px;
	margin-top: 12px;
}

.elc-ivp-card-audio {
	margin-top: 12px;
}

.elc-ivp-card-pos {
	font-size: 13px;
	text-transform: uppercase;
	letter-spacing: 0.05em;
	color: #4B8EDE;
	font-weight: 600;
}

.elc-ivp-card-meaning {
	font-size: 28px;
	font-weight: 600;
	margin-top: 10px;
}

.elc-ivp-card-example {
	font-style: italic;
	color: #6b7280;
	margin-top: 12px;
}

.elc-ivp-card-image {
	max-width: 100%;
	max-height: 80px;
	margin-top: 12px;
	border-radius: 8px;
}

.elc-ivp-hint {
	color: #9ca3af;
	font-size: 13px;
	margin-bottom: 16px;
}

/* ===== Chế độ "Gõ đáp án" - đồng bộ thuật toán + giao diện với elc-vocab
   (xem elc-vocab-frontend.css): thẻ KHÔNG lật 3D, ô gõ là 1 đường gạch dưới
   (chỗ khuyết từ ___) kiểu macOS, sau khi kiểm tra lộ từ đúng + mặt sau. ===== */
.elc-ivp-typing-toggle {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 13px;
	color: #4b5563;
	cursor: pointer;
	margin-bottom: 12px;
}

.elc-ivp-card-typing {
	perspective: none;
	height: auto;
	min-height: 500px;
	cursor: default;
}

.elc-ivp-card-typing .elc-ivp-card-front {
	position: relative;
	inset: auto;
	min-height: 500px;
	justify-content: center;
	gap: 8px;
}

/* Selector dư bậc CỐ Ý để thắng CSS input mặc định của theme Blocksy (selector 1 class bị theme đè lại thành khung hộp). */
input[type="text"].elc-ivp-typed-input {
	margin-top: 18px;
	width: 100%;
	max-width: 460px;
	padding: 8px 10px;
	font-size: 28px;
	font-weight: 600;
	text-align: center;
	font-family: inherit;
	color: #1f2937;
	background: transparent;
	border: none;
	border-bottom: 2.5px solid #d1d5db;
	border-radius: 0;
	box-shadow: none;
	box-sizing: border-box;
	transition: border-color 0.15s ease;
}

input[type="text"].elc-ivp-typed-input::placeholder {
	font-size: 16px;
	font-weight: 400;
	color: #b3b8c2;
}

input[type="text"].elc-ivp-typed-input:focus {
	outline: none;
	border: none;
	border-bottom: 2.5px solid #4B8EDE;
	box-shadow: none;
}

.elc-ivp-typed-ok {
	color: #065f46;
}

.elc-ivp-typed-bad {
	color: #991b1b;
}

.elc-ivp-typed-you {
	color: #6b7280;
	font-size: 15px;
}

.elc-ivp-grades {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 12px;
	max-width: 860px;
	margin: 0 auto;
}

.elc-ivp-grade {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 2px;
	border: none;
	border-radius: 12px;
	padding: 12px 8px;
	font-weight: 700;
	font-size: 14px;
	cursor: pointer;
}

.elc-ivp-grade small {
	font-weight: 400;
	font-size: 11px;
	opacity: 0.75;
}

/* Màu pastel nhạt y hệt .elc-vocab-grade-* (nền nhạt + chữ đậm màu), KHÔNG
   dùng màu đặc/chói như bản cũ. */
.elc-ivp-grade-again { background: #fee2e2; color: #991b1b; }
.elc-ivp-grade-hard { background: #ffedd5; color: #9a3412; }
.elc-ivp-grade-good { background: #ecfdf5; color: #065f46; }
.elc-ivp-grade-easy { background: #EBF7FF; color: #075985; }

.elc-ivp-grade:hover {
	filter: brightness(0.95);
}

.elc-ivp-wordlist {
	background: #fff;
	border: 1px solid #e5e7eb;
	border-radius: 14px;
	box-shadow: 0 1px 3px rgba(0, 0, 0, 0.06), 0 1px 2px rgba(0, 0, 0, 0.04);
	padding: 20px 24px;
	margin: 24px auto 0;
	max-width: 860px;
	text-align: left;
}

.elc-ivp-wordlist h3 {
	margin-top: 0;
	font-size: 16px;
}

.elc-ivp-wordlist table {
	width: 100%;
	border-collapse: collapse;
	font-size: 14px;
}

.elc-ivp-wordlist th {
	text-align: left;
	color: #6b7280;
	font-size: 12px;
	text-transform: uppercase;
	padding: 8px;
	border-bottom: 1px solid #e5e7eb;
}

.elc-ivp-wordlist td {
	padding: 10px 8px;
	border-bottom: 1px solid #f3f4f6;
}

.elc-ivp-star-small {
	background: none;
	border: none;
	font-size: 18px;
	line-height: 1;
	color: #d1d5db;
	cursor: pointer;
}

.elc-ivp-star-small.starred {
	color: #f59e0b;
}

@media (max-width: 700px) {
	.elc-ivp-card {
		height: 340px;
	}

	.elc-ivp-card-word {
		font-size: 28px;
	}
}

.elc-ivp-mcq-options {
	display: flex;
	flex-direction: column;
	gap: 6px;
	margin-top: 10px;
}

.elc-ivp-mcq-option {
	text-align: left;
	background: #f9fafb;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	padding: 8px 12px;
	cursor: pointer;
	font-size: 14px;
}

.elc-ivp-mcq-option:hover {
	background: #EBF7FF;
}

.elc-ivp-mcq-option.elc-ivp-mcq-correct {
	background: #ecfdf5;
	border-color: #16a34a;
	font-weight: 600;
}

/* ===== 52Hz UI refresh 08/2026: IELTS vocabulary practice ===== */

#elc-ielts-vocab-practice {
	--elc-ivp-ink: #172033;
	--elc-ivp-muted: #667085;
	--elc-ivp-border: #dde3ec;
	--elc-ivp-accent: #4B8EDE;
	--elc-ivp-accent-dark: #4B8EDE;
	--elc-ivp-shadow: 0 8px 24px rgba(30, 41, 59, 0.07), 0 1px 2px rgba(30, 41, 59, 0.04);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: var(--elc-ivp-ink);
}

.elc-ivp-layout {
	display: grid;
	grid-template-columns: 220px minmax(0, 1fr);
	gap: 28px;
}

.elc-ivp-sidebar {
	width: auto;
	padding: 12px;
	border: 1px solid var(--elc-ivp-border);
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.97);
	box-shadow: var(--elc-ivp-shadow);
}

.elc-ivp-tab {
	min-height: 42px;
	padding: 10px 12px;
	border: 1px solid transparent;
	border-radius: 10px;
	background: transparent;
	font-family: 'Inter', sans-serif;
	font-size: 14px;
	font-weight: 500;
	color: #344054;
}

.elc-ivp-tab:hover {
	border-color: transparent;
	background: #f5f7fa;
}

.elc-ivp-tab.active {
	border-color: transparent;
	background: #EBF7FF;
	color: #4B8EDE;
	font-weight: 600;
}

.elc-ivp-fcvariants .elc-ielts-btn,
.elc-ivp-body .elc-ielts-btn,
.elc-ivp-mcq-option {
	min-height: 38px;
	padding: 8px 15px;
	border-radius: 11px;
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 600;
}

.elc-ivp-card-front,
.elc-ivp-card-back,
.elc-ivp-wordlist {
	border-color: var(--elc-ivp-border);
	border-radius: 18px;
	box-shadow: var(--elc-ivp-shadow);
}

.elc-ivp-card-word,
.elc-ivp-card-phonetic,
.elc-ivp-card-meaning,
.elc-ivp-card-example {
	font-family: 'Lora', Georgia, serif;
}

.elc-ivp-card-word {
	font-size: clamp(42px, 4vw, 56px);
	line-height: 1.05;
	color: #253047;
}

.elc-ivp-card-meaning {
	font-size: clamp(24px, 2.4vw, 30px);
	line-height: 1.35;
	color: #344054;
}

.elc-ivp-card-pos,
.elc-ivp-hint,
.elc-ivp-typing-toggle,
.elc-ivp-grade,
.elc-ivp-wordlist,
.elc-ivp-mcq-option {
	font-family: 'Inter', sans-serif;
}

.elc-ivp-mcq-option {
	border-color: var(--elc-ivp-border);
	background: #fafbfc;
}

@media (max-width: 700px) {
	.elc-ivp-layout {
		display: flex;
		gap: 18px;
	}

	.elc-ivp-sidebar {
		padding: 8px;
		box-sizing: border-box;
		overflow-x: auto;
	}

	.elc-ivp-tab {
		min-width: max-content;
	}

	.elc-ivp-card {
		height: 380px;
	}
}

/* ===== Flashcard IELTS 0.9.14: Lora + khung/chữ lớn hơn 30% ===== */
#elc-ielts-vocab-practice,
#elc-ielts-vocab-practice button,
#elc-ielts-vocab-practice input,
#elc-ielts-vocab-practice textarea,
#elc-ielts-vocab-practice select,
#elc-ielts-vocab-practice table {
	font-family: 'Lora', Georgia, serif;
}

.elc-ivp-tab,
.elc-ivp-card-word,
.elc-ivp-card-phonetic,
.elc-ivp-card-pos,
.elc-ivp-card-meaning,
.elc-ivp-card-example,
.elc-ivp-card-phrase,
.elc-ivp-hint,
.elc-ivp-typing-toggle,
.elc-ivp-grade,
.elc-ivp-wordlist,
.elc-ivp-mcq-option {
	font-family: 'Lora', Georgia, serif;
}

.elc-ivp-card {
	height: 650px;
	max-width: 1118px;
	margin-top: 21px;
	margin-bottom: 26px;
}

.elc-ivp-card-front,
.elc-ivp-card-back {
	padding: 42px;
	border-radius: 22px;
}

.elc-ivp-card-word {
	font-size: clamp(58px, 5.2vw, 76px);
}

.elc-ivp-card-phonetic {
	font-size: 25px;
	margin-top: 16px;
}

.elc-ivp-card-pos {
	font-size: 17px;
}

.elc-ivp-card-meaning {
	font-size: clamp(31px, 3.1vw, 39px);
}

.elc-ivp-card-example,
.elc-ivp-card-phrase {
	font-size: 24px;
	line-height: 1.55;
	margin-top: 16px;
}

.elc-ivp-card-example {
	font-style: italic;
}

.elc-ivp-card-phrase {
	font-style: normal;
	font-weight: 700;
	color: #344054;
}

.elc-ivp-card-image {
	max-height: 104px;
	margin-top: 16px;
}

.elc-ivp-star {
	top: 18px;
	right: 21px;
	font-size: 34px;
}

.elc-ivp-hint {
	font-size: 17px;
	margin-bottom: 21px;
}

.elc-ivp-card-typing,
.elc-ivp-card-typing .elc-ivp-card-front {
	min-height: 650px;
}

input[type="text"].elc-ivp-typed-input {
	max-width: 598px;
	font-size: 36px;
	padding: 10px 13px;
}

.elc-ivp-typing-toggle {
	gap: 10px;
	font-size: 18px;
	font-weight: 600;
	margin-bottom: 16px;
}

.elc-ivp-typing-toggle input[type="checkbox"] {
	width: 19px;
	height: 19px;
}

.elc-ivp-grades {
	max-width: 1118px;
	gap: 16px;
}

.elc-ivp-grade {
	border-radius: 16px;
	padding: 16px 10px;
	font-size: 18px;
}

.elc-ivp-grade small {
	font-size: 14px;
}

.elc-ivp-wordlist {
	max-width: 1118px;
	padding: 26px 31px;
	margin-top: 31px;
	border-radius: 18px;
}

.elc-ivp-wordlist h3 {
	font-size: 21px;
}

.elc-ivp-wordlist table {
	font-size: 18px;
}

.elc-ivp-wordlist th {
	font-size: 16px;
	padding: 10px;
}

.elc-ivp-wordlist td {
	padding: 13px 10px;
}

.elc-ivp-wordlist-phrase {
	font-weight: 700;
}

.elc-ivp-star-small {
	font-size: 23px;
}

/* Ba nút đổi chế độ giữ nguyên kích thước, chỉ đổi sang kiểu nút macOS. */
.elc-ivp-fcvariants .elc-ielts-btn {
	min-height: 38px;
	padding: 8px 15px;
	border: 1px solid #d0d5dd;
	border-radius: 10px;
	background: rgba(255, 255, 255, 0.96);
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.7);
	color: #344054;
	font-family: 'Lora', Georgia, serif;
	font-size: 13px;
	font-weight: 600;
}

.elc-ivp-fcvariants .elc-ielts-btn:not(.elc-ielts-btn-outline) {
	border-color: #4B8EDE;
	background: #4B8EDE;
	color: #fff;
	box-shadow: 0 1px 2px rgba(75, 142, 222, 0.22), inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.elc-ivp-fcvariants .elc-ielts-btn:hover {
	filter: brightness(0.98);
}

@media (max-width: 700px) {
	.elc-ivp-card {
		height: 442px;
	}

	.elc-ivp-card-typing,
	.elc-ivp-card-typing .elc-ivp-card-front {
		min-height: 442px;
	}

	.elc-ivp-card-word {
		font-size: 40px;
	}

	.elc-ivp-card-phonetic {
		font-size: 21px;
	}

	.elc-ivp-card-example,
	.elc-ivp-card-phrase {
		font-size: 19px;
	}

	.elc-ivp-wordlist {
		overflow-x: auto;
	}
}

/* ===== IELTS vocabulary practice UI: giao diện ổn định trước khi nối SRS ===== */
#elc-ielts-vocab-practice {
	--ivp-blue: #4B8EDE;
	--ivp-green: #16a66a;
	--ivp-red: #d92d20;
	--ivp-surface: #ffffff;
	--ivp-subtle: #f5f5f7;
	--ivp-line: #d9dee7;
	--ivp-text: #202636;
	--ivp-muted: #737b8c;
}

/* Bỏ chuyển động lật 3D. Click chỉ đổi mặt đang hiển thị. */
#elc-ielts-vocab-practice .elc-ivp-card {
	perspective: none;
}

#elc-ielts-vocab-practice .elc-ivp-card-inner {
	transform: none;
	transition: none;
	transform-style: flat;
}

#elc-ielts-vocab-practice .elc-ivp-card.flipped .elc-ivp-card-inner {
	transform: none;
}

#elc-ielts-vocab-practice .elc-ivp-card-back {
	display: none;
	transform: none;
}

#elc-ielts-vocab-practice .elc-ivp-card.flipped .elc-ivp-card-front {
	display: none;
}

#elc-ielts-vocab-practice .elc-ivp-card.flipped .elc-ivp-card-back {
	display: flex;
}

#elc-ielts-vocab-practice .elc-ivp-card-pos {
	font-size: 20px;
	font-style: italic;
	font-weight: 600;
	text-transform: none;
	letter-spacing: 0;
	margin-top: 12px;
}

#elc-ielts-vocab-practice .elc-ivp-card-phrase,
#elc-ielts-vocab-practice .elc-ivp-wordlist-phrase {
	font-style: normal;
	font-weight: 400;
}

#elc-ielts-vocab-practice .elc-ivp-wordlist h3 {
	color: #4B8EDE;
	font-weight: 700;
	text-transform: uppercase;
}

#elc-ielts-vocab-practice .elc-ivp-card-pos {
	font-size: 27px;
	font-weight: 400;
}
#elc-ielts-vocab-practice .elc-ivp-practice-panel h2 {
	color: #4B8EDE;
	text-transform: uppercase;
}

/* Final laptop overrides: giữ zoom 100% ở màn 13–14 inch. */
@media (min-width: 901px) and (max-width: 1600px) and (max-height: 900px) {
	#elc-ielts-vocab-practice .elc-ivp-layout { grid-template-columns: 190px minmax(0, 1fr); gap: 18px; }
	#elc-ielts-vocab-practice .elc-ivp-sidebar { padding: 8px; }
	#elc-ielts-vocab-practice .elc-ivp-tab { min-height: 36px; padding: 8px 10px; }
	#elc-ielts-vocab-practice .elc-ivp-card { height: clamp(410px, calc(100vh - 250px), 500px); margin-top: 8px; margin-bottom: 10px; }
	#elc-ielts-vocab-practice .elc-ivp-card-front,
	#elc-ielts-vocab-practice .elc-ivp-card-back { padding: 30px; }
	#elc-ielts-vocab-practice .elc-ivp-card-typing,
	#elc-ielts-vocab-practice .elc-ivp-card-typing .elc-ivp-card-front { min-height: 410px; }
	#elc-ielts-vocab-practice .elc-ivp-practice-panel { min-height: 340px; padding: 30px; margin: 16px auto; }
	#elc-ielts-vocab-practice .elc-ivp-quiz-card { min-height: 400px; padding: 30px; margin: 16px auto; }
	#elc-ielts-vocab-practice .elc-ivp-auto-options { gap: 9px; margin: 20px 0 18px; }
	#elc-ielts-vocab-practice .elc-ivp-auto-option { min-height: 58px; padding: 11px 14px; font-size: 16px; }
	#elc-ielts-vocab-practice .elc-ivp-match-grid { gap: 8px; margin: 12px auto; }
	#elc-ielts-vocab-practice .elc-ivp-match-tile { min-height: 108px; padding: 12px; border-radius: 14px; font-size: 16px; }
	#elc-ielts-vocab-practice .elc-ivp-wordlist { margin-top: 18px; padding: 20px 24px; }
}

/* 0.9.35: căn đường phân cách tiêu đề đúng nhịp 14px như ELC Vocab. */
#elc-ielts-vocab-practice .elc-irp-topbar {
	margin: 0 0 14px;
	border-bottom-color: #e2e6ed;
}
#elc-ielts-vocab-practice .elc-ivp-more-link {
	display: inline-flex;
	min-height: 38px;
	flex: 0 0 auto;
	align-items: center;
	justify-content: center;
	padding: 8px 13px;
	border: 1px solid #cfd8e5;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 1px 2px rgba(16, 24, 40, .04);
	font: 600 14px/1.2 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	color: #4B8EDE;
	text-decoration: none;
}
#elc-ielts-vocab-practice .elc-ivp-more-link:hover {
	border-color: #EBF7FF;
	background: #EBF7FF;
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-hint {
	min-height: 24px;
	margin: 0 auto 12px;
}

#elc-ielts-vocab-practice #elc-ivp-controls {
	min-height: 82px;
}

#elc-ielts-vocab-practice .elc-ivp-grade {
	border: 1px solid rgba(31, 41, 55, 0.06);
	box-shadow: 0 1px 2px rgba(16, 24, 40, 0.06), inset 0 1px 0 rgba(255,255,255,.72);
	transition: transform .14s ease, box-shadow .14s ease, opacity .14s ease;
}

#elc-ielts-vocab-practice .elc-ivp-grade:not(:disabled):hover {
	transform: translateY(-1px);
	box-shadow: 0 5px 14px rgba(16, 24, 40, 0.09), inset 0 1px 0 rgba(255,255,255,.72);
}

#elc-ielts-vocab-practice .elc-ivp-grade:disabled {
	opacity: .42;
	cursor: default;
	filter: saturate(.7);
}

/* Công cụ IPA / Từ loại nằm cạnh nút sao trong chế độ gõ. */
#elc-ielts-vocab-practice .elc-ivp-card-tools {
	position: absolute;
	top: 18px;
	right: 20px;
	z-index: 3;
	display: flex;
	align-items: center;
	gap: 8px;
}

#elc-ielts-vocab-practice .elc-ivp-typing-switches {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 10px;
	flex-wrap: wrap;
}

#elc-ielts-vocab-practice .elc-ivp-auto-toggle {
	padding: 7px 12px;
	border: 1px solid #cfd5df;
	border-radius: 10px;
	background: #f5f5f7;
	box-shadow: 0 1px 2px rgba(16,24,40,.05), inset 0 1px 0 #fff;
}

#elc-ielts-vocab-practice .elc-ivp-auto-toggle:has(input:checked) {
	border-color: #EBF7FF;
	background: #EBF7FF;
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-auto-next {
	margin-top: 8px;
}

#elc-ielts-vocab-practice .elc-ivp-card-tools .elc-ivp-star {
	position: static;
	display: inline-grid;
	place-items: center;
	width: 38px;
	height: 34px;
	padding: 0;
	font-size: 27px;
}

#elc-ielts-vocab-practice .elc-ivp-tool {
	min-height: 34px;
	padding: 6px 12px;
	border: 1px solid #cfd5df;
	border-radius: 10px;
	background: rgba(255,255,255,.94);
	box-shadow: 0 1px 2px rgba(16,24,40,.06), inset 0 1px 0 #fff;
	color: #4b5565;
	font-family: 'Lora', Georgia, serif;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}

#elc-ielts-vocab-practice .elc-ivp-tool.active {
	border-color: #EBF7FF;
	background: #EBF7FF;
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-tool:disabled {
	opacity: .38;
	cursor: default;
}

#elc-ielts-vocab-practice .elc-ivp-typed-feedback {
	min-height: 44px;
	margin-top: 16px;
	font-size: 34px;
	font-weight: 700;
	letter-spacing: .02em;
}

#elc-ielts-vocab-practice .elc-ivp-char-correct {
	color: #19a866;
}

#elc-ielts-vocab-practice .elc-ivp-char-wrong {
	color: #e5484d;
}

#elc-ielts-vocab-practice .elc-ivp-card-word.elc-ivp-typed-ok {
	color: #10b865;
}

#elc-ielts-vocab-practice .elc-ivp-card-word.elc-ivp-typed-bad {
	color: #e5484d;
}

#elc-ielts-vocab-practice .elc-ivp-typed-you {
	color: #e5484d;
}

#elc-ielts-vocab-practice .elc-ivp-typing-check {
	min-height: 96px;
	margin-bottom: 14px;
}

#elc-ielts-vocab-practice .elc-ivp-typing-check .elc-ielts-btn {
	min-height: 48px;
	padding: 11px 24px;
	border-radius: 12px;
	font-size: 17px;
}

/* Quiz + Nối: khung trắng, nút kiểu macOS, chưa tác động lịch SRS. */
#elc-ielts-vocab-practice .elc-ivp-practice-panel,
#elc-ielts-vocab-practice .elc-ivp-quiz-card,
#elc-ielts-vocab-practice .elc-ivp-match-complete,
#elc-ielts-vocab-practice .elc-ivp-empty {
	width: 100%;
	max-width: 1118px;
	margin: 28px auto;
	padding: 42px;
	border: 1px solid var(--ivp-line);
	border-radius: 22px;
	background: var(--ivp-surface);
	box-shadow: 0 12px 34px rgba(31,41,55,.07), 0 1px 2px rgba(31,41,55,.04);
	box-sizing: border-box;
}

#elc-ielts-vocab-practice .elc-ivp-practice-panel {
	display: grid;
	place-content: center;
	justify-items: center;
	min-height: 420px;
	padding: 46px;
	border-radius: 20px;
	box-shadow: 0 10px 28px rgba(20,35,60,.07);
	text-align: center;
}

#elc-ielts-vocab-practice .elc-ivp-quiz-card {
	min-height: 520px;
	padding: 46px;
	border-radius: 20px;
	box-shadow: 0 10px 28px rgba(20,35,60,.07);
	text-align: center;
}

#elc-ielts-vocab-practice .elc-ivp-practice-panel h2,
#elc-ielts-vocab-practice .elc-ivp-quiz-card h2 {
	margin: 10px 0 8px;
	font-size: 33px;
	color: var(--ivp-text);
}

#elc-ielts-vocab-practice .elc-ivp-quiz-intro h2 {
	margin: 0 0 10px;
	color: #4B8EDE;
	font: 700 33px/1.2 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	text-transform: uppercase;
}

#elc-ielts-vocab-practice .elc-ivp-quiz-intro p {
	max-width: 620px;
	margin: 0 0 24px;
	color: #667085;
}

#elc-ielts-vocab-practice .elc-ivp-kicker,
#elc-ielts-vocab-practice .elc-ivp-quiz-meta {
	color: #5d6472;
	font-size: 16px;
	font-style: italic;
	font-weight: 600;
}

#elc-ielts-vocab-practice .elc-ivp-practice-setup {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 14px;
	flex-wrap: wrap;
	margin: 24px 0;
}

#elc-ielts-vocab-practice .elc-ivp-segmented,
#elc-ielts-vocab-practice .elc-ivp-round-select {
	display: inline-flex;
	align-items: center;
	gap: 3px;
	padding: 4px;
	border: 1px solid #d7dce5;
	border-radius: 12px;
	background: #f3f4f6;
}

#elc-ielts-vocab-practice .elc-ivp-round-select span {
	padding: 0 8px;
	color: #667085;
	font-size: 13px;
}

#elc-ielts-vocab-practice .elc-ivp-round-select select {
	min-height: 34px;
	padding: 5px 30px 5px 10px;
	border: 0;
	border-radius: 9px;
	background-color: #fff;
	box-shadow: 0 1px 4px rgba(31,41,55,.13);
	color: #172033;
	font-family: 'Lora', Georgia, serif;
	font-size: 13px;
	font-weight: 600;
}

#elc-ielts-vocab-practice .elc-ivp-segment,
#elc-ielts-vocab-practice .elc-ivp-round {
	min-height: 34px;
	padding: 7px 13px;
	border: 0;
	border-radius: 9px;
	background: transparent;
	color: #4b5565;
	font-size: 13px;
	font-weight: 600;
	cursor: pointer;
}

#elc-ielts-vocab-practice .elc-ivp-segment.active,
#elc-ielts-vocab-practice .elc-ivp-round.active {
	background: #fff;
	box-shadow: 0 1px 4px rgba(31,41,55,.13);
	color: #172033;
}

#elc-ielts-vocab-practice .elc-ivp-primary {
	min-height: 44px;
	padding: 10px 22px;
	border: 1px solid #4B8EDE;
	border-radius: 12px;
	background: var(--ivp-blue);
	box-shadow: 0 2px 6px rgba(75, 142, 222,.22), inset 0 1px 0 rgba(255,255,255,.22);
	color: #fff;
	font-family: 'Lora', Georgia, serif;
	font-size: 15px;
	font-weight: 700;
	cursor: pointer;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	max-width: 1118px;
	margin: 0 auto 14px;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar .elc-ivp-practice-setup {
	justify-content: flex-start;
	margin: 0;
}

/* Quiz đang làm: đồng bộ cụm nút rời + bóng macOS với ELC Vocab. */
#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-practice-setup {
	gap: 8px;
	padding: 0;
	border: 0;
	background: transparent;
	box-shadow: none;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-segmented {
	gap: 8px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-segment {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 40px;
	padding: 8px 14px;
	border: 1px solid #d8dee8;
	border-radius: 10px;
	background: #fff;
	box-shadow: 0 5px 14px rgba(31,41,55,.10), 0 1px 3px rgba(31,41,55,.08);
	color: #344054;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-segment.active {
	border-color: #EBF7FF;
	background: #EBF7FF;
	box-shadow: 0 6px 16px rgba(75, 142, 222,.16), 0 1px 3px rgba(31,41,55,.08);
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-round-select {
	gap: 6px;
	padding: 0;
	border: 0;
	border-radius: 0;
	background: transparent;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-round-select span {
	padding: 0;
	font: 500 13px/1.2 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-round-select select {
	min-width: 92px;
	min-height: 40px;
	padding: 6px 28px 6px 10px;
	border: 1px solid #d7dde7;
	border-radius: 10px;
	box-shadow: 0 5px 14px rgba(31,41,55,.10), 0 1px 3px rgba(31,41,55,.08);
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 14px;
}

#elc-ielts-vocab-practice .elc-ivp-practice-toolbar--live .elc-ivp-practice-progress {
	min-width: 46px;
	color: #344054;
	font: 600 14px/1 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	text-align: right;
	white-space: nowrap;
}

/* Quiz/Nối dùng đúng một hàng điều khiển như ELC Vocab. */
#elc-ielts-vocab-practice .elc-ivp-unified-toolbar {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 12px;
	width: 100%;
	max-width: 1118px;
	margin: 0 auto 10px;
}

#elc-ielts-vocab-practice .elc-ivp-unified-toolbar .elc-ivp-study-toolbar,
#elc-ielts-vocab-practice .elc-ivp-unified-toolbar .elc-ivp-practice-toolbar {
	margin: 0;
}

#elc-ielts-vocab-practice .elc-ivp-unified-toolbar .elc-ivp-practice-toolbar {
	flex: 0 0 auto;
}

#elc-ielts-vocab-practice .elc-ivp-quiz-card h2 {
	margin: 0 0 16px;
	font: 700 38px/1.3 'Lora', Georgia, serif;
}

#elc-ielts-vocab-practice .elc-ivp-auto-options {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 12px;
	margin: 30px 0 24px;
}

#elc-ielts-vocab-practice .elc-ivp-auto-option {
	display: flex;
	align-items: center;
	gap: 12px;
	min-height: 68px;
	padding: 14px 16px;
	border: 1px solid #d4dce7;
	border-radius: 13px;
	background: #fff;
	color: #252b39;
	font-family: 'Lora', Georgia, serif;
	font-size: 18px;
	font-weight: 500;
	text-align: left;
	cursor: pointer;
}

#elc-ielts-vocab-practice .elc-ivp-auto-option span {
	display: inline-grid;
	place-items: center;
	flex: 0 0 30px;
	height: 30px;
	border-radius: 9px;
	background: #f0f2f5;
	font-family: 'Inter', sans-serif;
	font-size: 13px;
	font-weight: 700;
}

#elc-ielts-vocab-practice .elc-ivp-auto-option.correct {
	border-color: #89d8b5;
	background: #edf9f3;
	color: #087443;
}

#elc-ielts-vocab-practice .elc-ivp-auto-option.wrong {
	border-color: #f2aaaa;
	background: #fff0f0;
	color: #b42318;
}

#elc-ielts-vocab-practice .elc-ivp-result-value {
	display: block;
	font-size: 72px;
	font-weight: 700;
	color: #16a66a;
}

#elc-ielts-vocab-practice .elc-ivp-match-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 12px;
	max-width: 1118px;
	margin: 18px auto;
}

#elc-ielts-vocab-practice .elc-ivp-match-tile {
	min-height: 150px;
	padding: 18px;
	border: 1px solid #d7dce5;
	border-radius: 17px;
	background: #fff;
	box-shadow: 0 5px 16px rgba(31,41,55,.06);
	color: #202636;
	font-size: 18px;
	font-weight: 400;
	cursor: pointer;
	transition: transform .14s ease, border-color .14s ease, box-shadow .14s ease;
}

#elc-ielts-vocab-practice .elc-ivp-match-tile.english {
	background: #EBF7FF;
	border-color: #EBF7FF;
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-match-tile.selected {
	transform: translateY(-2px);
	border-color: #4B8EDE;
	box-shadow: 0 0 0 3px rgba(75, 142, 222,.13), 0 8px 20px rgba(31,41,55,.08);
}

#elc-ielts-vocab-practice .elc-ivp-match-tile.matched {
	opacity: 0;
	pointer-events: none;
}

#elc-ielts-vocab-practice .elc-ivp-match-complete {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 18px;
	padding: 20px 26px;
}

@media (max-width: 900px) {
	#elc-ielts-vocab-practice .elc-ivp-unified-toolbar {
		justify-content: center;
		flex-wrap: wrap;
	}

	#elc-ielts-vocab-practice .elc-ivp-match-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}
}

@media (max-width: 700px) {
	#elc-ielts-vocab-practice .elc-ivp-card-tools {
		top: 12px;
		right: 12px;
	}

	#elc-ielts-vocab-practice .elc-ivp-grades {
		grid-template-columns: repeat(2, 1fr);
	}

	#elc-ielts-vocab-practice #elc-ivp-controls {
		min-height: 164px;
	}

	#elc-ielts-vocab-practice .elc-ivp-auto-options {
		grid-template-columns: 1fr;
	}

	#elc-ielts-vocab-practice .elc-ivp-practice-toolbar,
	#elc-ielts-vocab-practice .elc-ivp-match-complete {
		align-items: stretch;
		flex-direction: column;
	}

	#elc-ielts-vocab-practice .elc-ivp-practice-panel,
	#elc-ielts-vocab-practice .elc-ivp-quiz-card {
		padding: 24px 18px;
	}

	#elc-ielts-vocab-practice .elc-ivp-match-tile {
		min-height: 110px;
		font-size: 16px;
	}
}

/* Laptop 13–14 inch: bố cục compact tự động, không cần đổi browser zoom. */
@media (min-width: 901px) and (max-width: 1600px) and (max-height: 900px) {
	#elc-ielts-vocab-practice .elc-ivp-layout { grid-template-columns: 190px minmax(0, 1fr); gap: 18px; }
	#elc-ielts-vocab-practice .elc-ivp-sidebar { padding: 8px; }
	#elc-ielts-vocab-practice .elc-ivp-tab { min-height: 36px; padding: 8px 10px; }
	#elc-ielts-vocab-practice .elc-ivp-card { height: clamp(410px, calc(100vh - 250px), 500px); margin-top: 12px; margin-bottom: 16px; }
	#elc-ielts-vocab-practice .elc-ivp-card-front,
	#elc-ielts-vocab-practice .elc-ivp-card-back { padding: 30px; }
	#elc-ielts-vocab-practice .elc-ivp-card-typing,
	#elc-ielts-vocab-practice .elc-ivp-card-typing .elc-ivp-card-front { min-height: 410px; }
	#elc-ielts-vocab-practice .elc-ivp-practice-panel { min-height: 340px; padding: 30px; margin: 16px auto; }
	#elc-ielts-vocab-practice .elc-ivp-quiz-card { min-height: 400px; padding: 30px; margin: 16px auto; }
	#elc-ielts-vocab-practice .elc-ivp-auto-options { margin: 20px 0 18px; gap: 9px; }
	#elc-ielts-vocab-practice .elc-ivp-auto-option { min-height: 58px; padding: 11px 14px; font-size: 16px; }
	#elc-ielts-vocab-practice .elc-ivp-match-grid { gap: 8px; margin: 12px auto; }
	#elc-ielts-vocab-practice .elc-ivp-match-tile { min-height: 108px; padding: 12px; border-radius: 14px; font-size: 16px; }
	#elc-ielts-vocab-practice .elc-ivp-wordlist { margin-top: 18px; padding: 20px 24px; }
}

/* ===== IELTS vocabulary 0.9.21: thanh học Mac đồng nhất + khoảng cách gọn ===== */
#elc-ielts-vocab-practice .elc-irp-topbar {
	padding: 8px 0 14px;
	background: transparent;
}

#elc-ielts-vocab-practice .elc-irp-title {
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 18px;
	font-weight: 700;
	line-height: 1.4;
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-course-link {
	display: inline-flex;
	align-items: center;
	min-height: 34px;
	padding: 5px 12px;
	border: 1px solid #cfd8e5;
	border-radius: 10px;
	background: rgba(255, 255, 255, .96);
	box-shadow: 0 1px 2px rgba(16, 24, 40, .06), inset 0 1px 0 #fff;
	color: #4B8EDE;
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
	text-decoration: none;
}

#elc-ielts-vocab-practice .elc-ivp-course-link:hover {
	border-color: #EBF7FF;
	background: #EBF7FF;
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-title-separator {
	padding: 0 4px;
	color: #7b8798;
}

#elc-ielts-vocab-practice .elc-ivp-study-toolbar {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0 auto 4px;
	flex-wrap: nowrap;
}

#elc-ielts-vocab-practice .elc-ivp-study-toolbar .elc-ivp-fcvariants,
#elc-ielts-vocab-practice .elc-ivp-study-toolbar .elc-ivp-typing-switches {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 8px;
	margin: 0;
	flex-wrap: nowrap;
}

#elc-ielts-vocab-practice .elc-ivp-study-toolbar .elc-ielts-btn,
#elc-ielts-vocab-practice .elc-ivp-study-toolbar .elc-ivp-typing-toggle {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
	min-height: 40px;
	margin: 0;
	padding: 8px 14px;
	border: 1px solid #cfd5df;
	border-radius: 10px;
	background: rgba(255, 255, 255, .96);
	box-shadow: 0 1px 2px rgba(16, 24, 40, .06), inset 0 1px 0 #fff;
	color: #344054;
	font-family: 'Inter', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
	font-size: 14px;
	font-weight: 600;
	line-height: 1;
	white-space: nowrap;
}

#elc-ielts-vocab-practice .elc-ivp-study-toolbar .elc-ielts-btn:not(.elc-ielts-btn-outline),
#elc-ielts-vocab-practice .elc-ivp-study-toolbar .elc-ivp-typing-toggle.active {
	border-color: #EBF7FF;
	background: #EBF7FF;
	box-shadow: 0 1px 3px rgba(75, 142, 222, .12), inset 0 1px 0 rgba(255, 255, 255, .9);
	color: #4B8EDE;
}

#elc-ielts-vocab-practice .elc-ivp-study-count {
	margin: 4px auto 6px;
}

#elc-ielts-vocab-practice .elc-ivp-card {
	margin-top: 8px;
	margin-bottom: 10px;
}

#elc-ielts-vocab-practice .elc-ivp-hint {
	min-height: 0;
	margin: 4px auto 6px;
}

#elc-ielts-vocab-practice #elc-ivp-controls {
	min-height: 0;
	margin-top: 6px;
}

#elc-ielts-vocab-practice .elc-ivp-auto-next {
	margin-top: 0;
}

#elc-ielts-vocab-practice .elc-ivp-grades {
	margin-top: 0;
}

#elc-ielts-vocab-practice .elc-ivp-grade {
	min-height: 62px;
	justify-content: center;
}

#elc-ielts-vocab-practice .elc-ivp-card-back .elc-ivp-card-meaning {
	color: #4B8EDE;
}

/* 0.9.24: vùng chân thẻ có chiều cao ổn định để bảng từ không nhảy. */
#elc-ielts-vocab-practice .elc-ivp-card-footer {
	min-height: 112px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: flex-start;
	gap: 6px;
	box-sizing: border-box;
}

#elc-ielts-vocab-practice .elc-ivp-card-footer .elc-ivp-hint,
#elc-ielts-vocab-practice .elc-ivp-card-footer .elc-ivp-typing-check {
	margin-top: 6px;
	margin-bottom: 0;
}

#elc-ielts-vocab-practice .elc-ivp-quiz-meta {
	color: #4B8EDE;
	font-size: 19px;
}

#elc-ielts-vocab-practice .elc-ivp-match-toolbar {
	justify-content: center;
}

#elc-ielts-vocab-practice .elc-ivp-next-match-inline {
	flex: 0 0 auto;
	min-height: 40px;
	padding: 9px 18px;
}

@media (max-width: 900px) {
	#elc-ielts-vocab-practice .elc-ivp-study-toolbar {
		justify-content: flex-start;
		overflow-x: auto;
		padding-bottom: 4px;
	}
}

@media (max-width: 700px) {
	#elc-ielts-vocab-practice #elc-ivp-controls {
		min-height: 0;
	}

	#elc-ielts-vocab-practice .elc-ivp-course-link {
		display: flex;
		width: fit-content;
		margin-bottom: 5px;
	}

	#elc-ielts-vocab-practice .elc-ivp-title-separator {
		display: none;
	}
}

/* Giữ màu tiêu đề Nối sau toàn bộ các lớp tương thích cũ phía trên. */
#elc-ielts-vocab-practice .elc-ivp-practice-panel h2 {
	color: #4B8EDE;
	text-transform: uppercase;
}

.elc-irp-ungraded{position:relative;flex:0 0 auto;background:#fff3d8;color:#7c561d;padding:7px 18px;font:13px/1.5 Inter,Arial,sans-serif;text-align:center}.elc-irp-figure{max-width:100%;height:auto;display:block;margin:12px 0}

.elc-irp-multiple{border:1px solid #d9e2ef;border-radius:12px;padding:18px;margin:16px 0}.elc-irp-multiple legend{font-weight:600;padding:0 8px}.elc-irp-multiple-option{display:flex;align-items:baseline;gap:10px;padding:12px;border-radius:8px;cursor:pointer}.elc-irp-multiple-option:has(input:checked){background:#eaf3ff}.elc-irp-multiple-option input{width:18px;height:18px;flex-shrink:0;accent-color:#4285df}.elc-irp-multiple-count{color:#526580;font-size:14px;margin:12px 0 0}
/* Matching Information: reserve answer columns, wrap long prompts instead of hiding A–H. */
.elc-irp-matrix .elc-irp-matrix-choice-col{width:38px}
@container (max-width:560px){
 .elc-irp-matrix{display:block;width:100%;border:0}
 .elc-irp-matrix colgroup,.elc-irp-matrix thead{display:none}
 .elc-irp-matrix tbody{display:block;width:100%}
 .elc-irp-matrix tr.elc-irp-matrix-row{display:grid;grid-template-columns:repeat(var(--elc-irp-matrix-count),minmax(0,1fr));border-bottom:1px solid #e5e7eb}
 .elc-irp-matrix tr.elc-irp-matrix-row:last-child{border-bottom:0}
 .elc-irp-matrix tr .elc-irp-matrix-prompt{display:block;grid-column:1/-1;width:auto;padding:13px 12px 7px;border:0;position:static;white-space:normal;overflow-wrap:anywhere;line-height:1.6}
 .elc-irp-matrix td.elc-irp-matrix-cell{display:block;min-width:0;border:0;padding:0}
 .elc-irp-matrix-tick{flex-direction:column;gap:7px;padding:8px 0 13px;min-height:60px}
 .elc-irp-matrix-tick:before{content:attr(data-label);color:#4b8ede;font-weight:700;font-size:13px;line-height:1}
 .elc-irp-matrix-tick:has(input:checked){background:#edf5ff}
}

/* Reading text and independently adjustable pane widths. */
.elc-irp-passage-content,.elc-irp-passage-content :is(p,div,span,li,blockquote){text-align:justify!important;text-justify:inter-word;font-size:var(--reader-size,18px)!important;line-height:1.8!important}
.elc-irp-col-questions :is(.elc-irp-prompt,.elc-irp-option,.elc-irp-multiple-option,.elc-irp-dragchip-text,.elc-irp-note,p,li,label){font-size:var(--reader-size,18px)!important}
.elc-irp-reader-tools{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-bottom:12px}
.elc-irp-reader-tools button{padding:5px 10px;min-width:38px;cursor:pointer}
.elc-irp-divider{flex:0 0 10px;cursor:col-resize;touch-action:none;background:#e8edf5;position:relative}
.elc-irp-divider:hover,.elc-irp-divider:focus-visible{background:#a7c9f5;outline:2px solid #438ce7;outline-offset:-2px}
.elc-irp-split.is-resizing{user-select:none}
@media(min-width:901px){.elc-irp-split .elc-irp-col-passage{flex:0 0 calc(var(--passage-ratio,55%) - 5px)}.elc-irp-split .elc-irp-col-questions{flex:1 1 0}}
@media(max-width:900px){.elc-irp-divider{display:none}}

/* Compact Reading tools, with monochrome outline icons. */
.elc-irp-reader-tools{flex-wrap:wrap;gap:6px;min-height:34px}
.elc-irp-reader-tools :is(button,output,.elc-irp-reader-pen){box-sizing:border-box;height:32px;display:inline-flex;align-items:center;justify-content:center}
.elc-irp-reader-tools button{border:1px solid #d9dee7;border-radius:8px;background:linear-gradient(#fff,#f3f4f6);color:#344054;font:500 13px/1 -apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif;padding:0 10px;box-shadow:0 1px 2px #1018280a}
.elc-irp-reader-tools button:hover{background:#eaf1fa;border-color:#bdcce0}
.elc-irp-reader-tools button:focus-visible{outline:2px solid #438ce7;outline-offset:2px}
.elc-irp-reader-tools output{min-width:42px;color:#667085;font-size:13px;font-variant-numeric:tabular-nums}
.elc-irp-reader-pen{width:26px;color:#667085}
.elc-irp-pen-icon{display:inline-block;width:19px;height:19px;vertical-align:middle;flex-shrink:0}
.elc-irp-reader-tools #elc-irp-hl-clear-btn{margin-left:6px;white-space:nowrap;min-width:auto}