#connected-english-preview .x-today-heading { display:flex; align-items:baseline; flex-wrap:wrap; gap:8px 16px; margin-bottom:24px; }
#connected-english-preview .x-today-heading h2 { margin:0; }
#connected-english-preview .x-guide-notes { display:grid; gap:12px; margin-top:20px; }
#connected-english-preview .x-guide-note-card { min-width:0; padding:16px 20px; border:1px solid var(--x-line); border-left:3px solid var(--x-gold); border-radius:var(--x-radius-sm); background:var(--x-soft); }
#connected-english-preview .x-guide-note-card h3 { margin:0 0 6px; color:var(--x-ink); font-size:var(--x-font-18); font-weight:600; line-height:1.5; }
#connected-english-preview .x-guide-note-card p { margin:0; color:var(--x-muted); font-size:var(--x-font-17); line-height:1.7; word-break:keep-all; overflow-wrap:anywhere; }
#connected-english-preview .x-today-date { color:var(--x-muted); font-size:var(--x-font-18); overflow-wrap:anywhere; }
#connected-english-preview .x-review-card { margin:0; padding:32px; background:var(--x-surface); border-top:4px solid var(--x-gold); }
#connected-english-preview .x-review-count { display:flex; align-items:baseline; flex-wrap:wrap; gap:6px 12px; font-variant-numeric:tabular-nums; }
#connected-english-preview .x-review-count strong { font-size:var(--x-display); line-height:1.2; }
#connected-english-preview .x-review-count span { font-size:var(--x-body); color:var(--x-muted); }
#connected-english-preview .x-review-card .x-track { margin:20px 0 24px; }
#connected-english-preview .x-review-card .x-primary { margin-top:24px; }
#connected-english-preview .x-review-card[data-state="complete"] .x-metric { display:flex; align-items:center; gap:10px; }
#connected-english-preview .x-review-card[data-state="complete"] .x-metric::before { content:'✓'; display:inline-grid; place-items:center; width:1.6em; height:1.6em; border-radius:50%; background:var(--x-gold); color:var(--x-on-gold); }
#connected-english-preview .x-quiz-toolbar { align-items:center; }
#connected-english-preview .x-quiz-toolbar .x-text-button { border:1px solid var(--x-line); padding:10px 14px; border-radius:var(--x-radius-sm); }
#connected-english-preview .x-question-meta { margin:0 0 12px; }
#connected-english-preview .x-quiz-question { padding:24px 0; }
#connected-english-preview .x-quiz-question h2 { margin-bottom:0; }
#connected-english-preview .x-quiz-question .x-hint { margin-bottom:0; }
#connected-english-preview #x-answer-input, #connected-english-preview #x-practice-answer-input { margin-top:8px; min-height:160px; }
#connected-english-preview #x-submit-answer, #connected-english-preview #x-practice-submit { margin-top:20px; }
#connected-english-preview .x-draft-state { min-height:1.5em; }
#connected-english-preview .x-wait-time { margin-bottom:0; }
#connected-english-preview .x-answer-comparison { margin:24px 0 28px; border:1px solid var(--x-line); border-radius:var(--x-radius-lg); overflow:hidden; }
#connected-english-preview .x-answer-comparison .x-summary, #connected-english-preview .x-answer-comparison .x-answer { margin:0; border:0; border-radius:0; background:var(--x-surface); box-shadow:none; }
#connected-english-preview .x-answer-comparison .x-answer { border-top:1px solid var(--x-line); background:var(--x-soft); box-shadow:inset 4px 0 0 var(--x-gold); }
#connected-english-preview .x-answer-comparison .x-answer-label { color:var(--x-muted); }
#connected-english-preview .x-answer-match { --x-match-text:#166534; --x-match-surface:#EFFAF1; --x-match-border:#2D7A43; border:2px solid var(--x-match-border); background:var(--x-match-surface); }
#connected-english-preview .x-answer-match .x-summary, #connected-english-preview .x-answer-match .x-answer { background:var(--x-match-surface); box-shadow:none; }
#connected-english-preview .x-answer-match .x-answer { border-top:1px solid var(--x-match-border); }
#connected-english-preview .x-answer-match .x-english, #connected-english-preview .x-answer-match .x-answer-label { color:var(--x-match-text); }
#connected-english-preview .x-answer-match .x-english { font-weight:600; }
#connected-english-preview .x-answer-match-status { display:flex; align-items:center; gap:10px; margin:0; padding:16px var(--x-panel-padding) 0; color:var(--x-match-text); font-weight:600; }
#connected-english-preview .x-answer-match-check { display:inline-grid; place-items:center; flex:0 0 1.5em; width:1.5em; height:1.5em; border-radius:50%; background:var(--x-match-text); color:var(--x-match-surface); line-height:1; }
#connected-english-preview .x-question-context { white-space:pre-wrap; }
#connected-english-preview .x-answer-explanation { white-space:pre-wrap; padding-top:16px; border-top:1px solid var(--x-line); }
#connected-english-preview .x-rating-title { margin-bottom:12px; }
#connected-english-preview .x-ratings { min-width:0; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
#connected-english-preview .x-ratings .x-button { display:flex; flex-direction:column; align-items:flex-start; gap:8px; min-width:0; min-height:144px; margin:0; padding:18px; text-align:left; color:var(--x-ink); }
#connected-english-preview .x-ratings strong, #connected-english-preview .x-ratings span { min-width:0; max-width:100%; overflow-wrap:anywhere; }
#connected-english-preview .x-ratings strong { display:block; font-size:var(--x-emphasis); font-weight:600; }
#connected-english-preview .x-ratings span { display:block; margin:0; color:var(--x-muted); font-size:var(--x-font-16); font-weight:400; }
#connected-english-preview .x-ratings .x-rating-due { align-self:stretch; margin-top:auto; padding-top:12px; border-top:1px solid var(--x-line); color:var(--x-ink); font-size:var(--x-font-16); font-weight:600; }
#connected-english-preview .x-learning-state { min-width:0; margin:20px 0; padding:var(--x-panel-padding); border:1px solid var(--x-line); border-radius:var(--x-radius-lg); background:var(--x-soft); }
#connected-english-preview .x-learning-state[data-state="complete"] { border-top:4px solid var(--x-gold); }
#connected-english-preview .x-learning-state h2 { margin:0 0 16px; }
#connected-english-preview .x-learning-state > :last-child { margin-bottom:0; }
#connected-english-preview .x-learning-result { display:flex; flex-wrap:wrap; gap:8px 24px; margin:0; }
#connected-english-preview .x-learning-result .x-metric { margin:0; font-variant-numeric:tabular-nums; }
#connected-english-preview .x-learning-state .x-primary { margin-top:24px; }
#connected-english-preview .x-learning-state .x-wait-time { font-size:var(--x-emphasis); font-variant-numeric:tabular-nums; }
#connected-english-preview .x-practice-summary { margin:24px 0 0; background:var(--x-surface); }
#connected-english-preview .x-practice-summary h3 { margin:0 0 8px; }
#connected-english-preview .x-practice-summary .x-metric { font-variant-numeric:tabular-nums; }
#connected-english-preview .x-practice-summary .x-button { margin-top:20px; }
@media(prefers-color-scheme:dark) {
  #connected-english-preview .x-answer-match { --x-match-text:#A7F3B7; --x-match-surface:#14291D; --x-match-border:#70B782; }
}
@media(max-width:600px) {
  #connected-english-preview .x-guide-note-card { padding:16px; }
  #connected-english-preview .x-review-card { padding:24px 20px; }
  #connected-english-preview .x-quiz-question { padding:16px 0 20px; }
  #connected-english-preview .x-ratings .x-button { padding:16px; gap:6px; }
}