/* IELTS Platform — AI Examiner (Claude) */
.ielts-ai-panel { --ai-bg: #f7f9fc; --ai-line: #dde3ec; --ai-ink: #1d2733; --ai-muted: #5b6776; --ai-accent: #2e75b6;
	background: var(--ai-bg); border: 1px solid var(--ai-line); border-radius: 10px; padding: 14px 16px; margin: 14px 0; color: var(--ai-ink); font-size: 14px; line-height: 1.5; }
.ielts-ai-muted { color: var(--ai-muted); }
.ielts-ai-pending { display: flex; gap: 12px; align-items: center; border-left: 4px solid var(--ai-accent); }
.ielts-ai-spinner { width: 22px; height: 22px; flex: 0 0 22px; border-radius: 50%; border: 3px solid #cfe0f3; border-top-color: var(--ai-accent); animation: ielts-ai-spin 0.9s linear infinite; }
@keyframes ielts-ai-spin { to { transform: rotate(360deg); } }

.ielts-ai-head { display: flex; gap: 14px; align-items: flex-start; margin-bottom: 10px; }
.ielts-ai-head h4 { margin: 0 0 4px; font-size: 16px; }
.ielts-ai-head p { margin: 0 0 4px; }
.ielts-ai-band { flex: 0 0 74px; height: 74px; border-radius: 50%; background: var(--ai-accent); color: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; }
.ielts-ai-band span { font-size: 26px; font-weight: 700; line-height: 1; }
.ielts-ai-band small { font-size: 11px; opacity: 0.9; margin-top: 3px; }
.ielts-ai-tag { font-style: normal; font-size: 11px; font-weight: 600; background: #fff3cd; color: #7a5b00; padding: 2px 6px; border-radius: 4px; margin-left: 6px; }
.ielts-ai-teacher-band { font-weight: 600; }
.ielts-ai-warn { background: #fff8e5; border-left: 3px solid #d9a400; padding: 6px 10px; margin: 8px 0; }

.ielts-ai-crits { display: grid; gap: 10px; margin: 8px 0 12px; }
.ielts-ai-crit-head { display: flex; justify-content: space-between; gap: 8px; font-size: 13px; }
.ielts-ai-crit-head strong { font-variant-numeric: tabular-nums; }
.ielts-ai-crit-track { height: 8px; background: #e6ebf2; border-radius: 4px; overflow: hidden; margin-top: 3px; }
.ielts-ai-crit-fill { display: block; height: 100%; border-radius: 4px; }
.ielts-ai-good { background: #2e7d32; }
.ielts-ai-mid { background: #e08e0b; }
.ielts-ai-low { background: #c62828; }
.ielts-ai-crit-note { margin: 4px 0 0; font-size: 12.5px; color: var(--ai-muted, #5b6776); }

.ielts-ai-task { border-top: 1px solid var(--ai-line); padding-top: 10px; margin-top: 10px; }
.ielts-ai-task-title { margin: 0 0 4px; font-size: 15px; }
.ielts-ai-task-title small { font-weight: 400; color: var(--ai-muted); margin-left: 6px; }
.ielts-ai-block { margin: 10px 0; }
.ielts-ai-block h5 { margin: 0 0 4px; font-size: 13.5px; }
.ielts-ai-block ul, .ielts-ai-block ol { margin: 0 0 0 20px; padding: 0; }
.ielts-ai-block li { margin: 2px 0; }
.ielts-ai-block summary { cursor: pointer; color: var(--ai-accent); font-weight: 600; }
.ielts-ai-corrections { list-style: none; margin-left: 0 !important; }
.ielts-ai-corrections li { padding: 5px 0; border-bottom: 1px dashed var(--ai-line); }
.ielts-ai-corrections small { display: block; color: var(--ai-muted); }
.ielts-ai-wrong { color: #b3261e; text-decoration: line-through; text-decoration-color: rgba(179, 38, 30, 0.5); }
.ielts-ai-right { color: #1b6e20; font-weight: 600; }
.ielts-ai-disclaimer { font-size: 12px; color: var(--ai-muted); margin: 10px 0 0; }

.ielts-ai-transcript { margin: 10px 0; }
.ielts-ai-transcript summary { cursor: pointer; color: #2e75b6; font-weight: 600; }
.ielts-ai-line { margin: 4px 0; font-size: 13.5px; }
.ielts-ai-line.is-cand { padding-left: 10px; border-left: 3px solid #8e24aa; }

/* Speaking widget */
.ielts-ai-speaking { border: 1px solid #dde3ec; border-radius: 12px; padding: 16px; margin-top: 12px; background: #fff; }
.ielts-ai-sp-intro h4 { margin-top: 0; }
.ielts-ai-sp-intro ul { margin: 0 0 12px 20px; }
.ielts-ai-sp-unsupported { color: #9a1f1f; font-weight: 600; }
.ielts-ai-sp-top { display: flex; justify-content: space-between; align-items: center; margin-bottom: 8px; }
.ielts-ai-sp-part { background: #8e24aa; color: #fff; font-weight: 700; font-size: 13px; padding: 3px 10px; border-radius: 12px; }
.ielts-ai-sp-clock { font-variant-numeric: tabular-nums; color: #5b6776; }
.ielts-ai-sp-log { max-height: 340px; overflow-y: auto; display: flex; flex-direction: column; gap: 8px; padding: 4px 2px; }
.ielts-ai-sp-msg { max-width: 85%; padding: 8px 12px; border-radius: 12px; white-space: pre-wrap; font-size: 14px; line-height: 1.45; }
.ielts-ai-sp-msg.is-exam { background: #f0f3f8; align-self: flex-start; border-bottom-left-radius: 3px; }
.ielts-ai-sp-msg.is-cand { background: #f3e5f7; align-self: flex-end; border-bottom-right-radius: 3px; }
.ielts-ai-sp-cue { white-space: pre-wrap; background: #fffbea; border: 2px solid #e0b100; border-radius: 10px; padding: 12px 14px; margin: 10px 0; font-size: 15px; line-height: 1.55; }
.ielts-ai-sp-status { min-height: 1.4em; color: #3a4655; margin: 10px 0; }
.ielts-ai-sp-status.is-error { color: #a01b1b; }
.ielts-ai-sp-controls { display: flex; flex-direction: column; align-items: center; gap: 12px; }
.ielts-ai-sp-mic { display: flex; flex-direction: column; align-items: center; gap: 4px; border: 0; background: #8e24aa; color: #fff; width: 96px; height: 96px; border-radius: 50%; cursor: pointer; justify-content: center; font-size: 11px; box-shadow: 0 4px 14px rgba(142, 36, 170, 0.3); }
.ielts-ai-sp-mic:disabled { background: #b9b0bd; box-shadow: none; cursor: not-allowed; }
.ielts-ai-sp-mic.is-listening { background: #c62828; animation: ielts-ai-pulse 1.4s ease-in-out infinite; }
.ielts-ai-sp-mic-label { max-width: 80px; text-align: center; line-height: 1.2; }
@keyframes ielts-ai-pulse { 0%, 100% { box-shadow: 0 0 0 0 rgba(198, 40, 40, 0.45); } 50% { box-shadow: 0 0 0 12px rgba(198, 40, 40, 0); } }
.ielts-ai-sp-row { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.ielts-ai-sp-finish.is-ready { background: #2e7d32 !important; }

/* Progress: band profile tiles + criteria */
.ielts-ai-progress { margin-top: 18px; background: #fff; border: 1px solid #dde3ec; border-radius: 10px; padding: 16px; }
html.ielts-dark .ielts-ai-progress { background: #1e242c; border-color: #36404c; }
.ielts-ai-tiles { display: grid; grid-template-columns: repeat(auto-fit, minmax(118px, 1fr)); gap: 10px; }
.ielts-ai-tile { border: 1px solid #dde3ec; border-top: 4px solid var(--c, #2e75b6); border-radius: 8px; padding: 10px; display: flex; flex-direction: column; gap: 4px; background: #fff; }
.ielts-ai-tile-label { font-size: 12.5px; color: #5b6776; font-weight: 600; }
.ielts-ai-tile-band { font-size: 26px; font-weight: 700; line-height: 1.1; color: #1d2733; font-variant-numeric: tabular-nums; }
.ielts-ai-tile-meter { height: 6px; background: #e6ebf2; border-radius: 3px; overflow: hidden; }
.ielts-ai-tile-meter span { display: block; height: 100%; background: var(--c, #2e75b6); }
.ielts-ai-tile small { color: #7a8594; font-size: 11.5px; }
.ielts-ai-tile-overall { border-top-color: #1d2733; background: #f7f9fc; }
.ielts-ai-crit-section { margin-top: 18px; }
.ielts-ai-crit-grid { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1.4fr); gap: 18px; align-items: start; }
@media (max-width: 720px) { .ielts-ai-crit-grid { grid-template-columns: 1fr; } }
.ielts-ai-chart { width: 100%; height: 200px; }

/* Dark mode (html.ielts-dark from assets/dark-mode.js) */
html.ielts-dark .ielts-ai-panel { --ai-bg: #1e242c; --ai-line: #36404c; --ai-ink: #e6ebf1; --ai-muted: #a6b0bc; }
html.ielts-dark .ielts-ai-speaking, html.ielts-dark .ielts-ai-tile { background: #1e242c; border-color: #36404c; color: #e6ebf1; }
html.ielts-dark .ielts-ai-tile-band { color: #e6ebf1; }
html.ielts-dark .ielts-ai-sp-msg.is-exam { background: #2a323d; }
html.ielts-dark .ielts-ai-sp-msg.is-cand { background: #3a2a42; }
html.ielts-dark .ielts-ai-sp-cue { background: #3a3320; color: #f5ecd0; }
html.ielts-dark .ielts-ai-crit-track, html.ielts-dark .ielts-ai-tile-meter { background: #36404c; }

/* "Checking" panel (0.33.1) */
.ielts-ai-checking { display: block; border-left: 4px solid var(--ai-accent); scroll-margin-top: 90px; }
.ielts-ai-check-top { display: flex; gap: 12px; align-items: center; }
.ielts-ai-check-top > div { flex: 1 1 auto; }
.ielts-ai-check-time { font-variant-numeric: tabular-nums; color: var(--ai-muted); font-size: 13px; }
.ielts-ai-check-bar { height: 6px; background: #e3eaf3; border-radius: 3px; overflow: hidden; margin: 12px 0 10px; }
.ielts-ai-check-bar span { display: block; height: 100%; width: 0; background: var(--ai-accent); border-radius: 3px; transition: width 0.5s ease; }
.ielts-ai-check-steps { list-style: none; margin: 0 0 8px; padding: 0; display: grid; gap: 4px; font-size: 13.5px; }
.ielts-ai-check-steps li { color: var(--ai-muted); padding-left: 24px; position: relative; }
.ielts-ai-check-steps li::before { content: '○'; position: absolute; left: 4px; }
.ielts-ai-check-steps li.is-now { color: var(--ai-ink); font-weight: 600; }
.ielts-ai-check-steps li.is-now::before { content: '●'; color: var(--ai-accent); }
.ielts-ai-check-steps li.is-done { color: #1b6e20; }
.ielts-ai-check-steps li.is-done::before { content: '✓'; color: #1b6e20; }
.ielts-ai-check-note { margin: 6px 0 0; font-size: 12.5px; color: var(--ai-muted); }
.ielts-ai-report { scroll-margin-top: 90px; }
html.ielts-dark .ielts-ai-check-bar { background: #36404c; }

/* Reading / Listening result card (0.33.2) */
.ielts-score-result { scroll-margin-top: 90px; }
.ielts-score-result-counts { display: flex; flex-wrap: wrap; gap: 14px; margin: 4px 0; font-size: 13.5px; }
.ielts-score-result-counts .is-right { color: #1b6e20; font-weight: 600; }
.ielts-score-result-counts .is-wrong { color: #b3261e; font-weight: 600; }
.ielts-score-result-counts .is-blank { color: var(--ai-muted); }
