/* Free-test player. Display layer only: everything below HIDES or REVEALS
   server-rendered markup, or styles chrome that FreeTest.js injects. With JS
   off no state class is present and none of this applies.
   ⛔ Never use display:none on content a crawler needs that is not ALSO in the
   raw HTML — hiding is fine (content stays in the DOM), removing is not. */

/* ---- start screen ---- */
.free-test.ftp-start [data-question],
.free-test.ftp-start .ft-verbal,
.free-test.ftp-start .free-test__rubric,
.free-test.ftp-start .free-test__nav { display: none; }

/* Not a card any more: the start controls sit in the section heading block
   as plain text, so they carry no box of their own. */
.ftp-startcard { margin: 20px 0 18px; }
.ftp-startcard__facts {
  margin: 0 0 6px; font: 500 15px/1.5 'IBM Plex Mono', monospace; color: #14203A;
}
.ftp-startcard__note { margin: 0 0 18px; font-size: 14px; color: #5A6478; max-width: 560px; }
.ftp-btn {
  display: inline-block; padding: 11px 22px; border-radius: 4px; border: 1.5px solid #1257E8;
  font-size: 16px; font-weight: 500; color: #fff; background: #1257E8; cursor: pointer;
}
.ftp-btn:hover { background: #0A45B8; border-color: #0A45B8; }
.ftp-btn--ghost { color: #1257E8; background: #fff; }
.ftp-btn--ghost:hover { background: #EEF4FF; color: #1257E8; }
.ftp-btn[disabled] { opacity: .45; cursor: default; }
.ftp-btn[disabled]:hover { background: #1257E8; }
.ftp-btn--ghost[disabled]:hover { background: #fff; }

/* ---- playing ---- */
.free-test.ftp-playing { background: #EDF0F4; border-radius: 12px; padding: 0 0 24px; }
.free-test.ftp-playing .free-test__rubric { display: none; }
.free-test.ftp-playing .free-test__score-summary { display: none; }
/* One question at a time. Hide by class, keep in DOM. */
.free-test.ftp-playing [data-question] { display: none; }
.free-test.ftp-playing [data-question].ftp-current { display: block; }
/* Verbal: hide whole passage groups except the current one; inside the current
   group the passage stays visible beside/above the current question. */
.free-test.ftp-playing .ft-verbal { display: none; }
.free-test.ftp-playing .ft-verbal.ftp-current-group { display: grid; }
/* Solutions are sealed until review — the mock-test rule. */
.free-test.ftp-playing .free-test-solution { display: none; }

/* Chrome bar */
.ftp-bar {
  display: flex; align-items: center; justify-content: space-between; gap: 16px;
  padding: 14px 20px; border-bottom: 1px solid #DDE3EC; margin-bottom: 24px;
  flex-wrap: wrap;
}
.ftp-bar__name { font-weight: 600; font-size: 17px; color: #14203A; }
.ftp-bar__timer {
  display: inline-flex; align-items: center; gap: 6px;
  font: 500 16px/1 'IBM Plex Mono', monospace; color: #14203A;
  font-variant-numeric: tabular-nums;
}
.ftp-bar__timer svg { width: 18px; height: 18px; display: block; color: #1257E8; }
.ftp-bar__timer.is-low { color: #C42B1C; }
.ftp-bar__count { font-weight: 500; font-size: 15px; color: #14203A; }
.ftp-bar__count span { color: #5A6478; font-size: 13px; }

/* The question card */
.free-test.ftp-playing .free-test__form { max-width: 860px; margin: 0 auto; padding: 0 20px; }
.free-test.ftp-playing [data-question].ftp-current,
.free-test.ftp-playing .ft-verbal.ftp-current-group {
  background: #fff; border: 1px solid #E4E9F1; border-radius: 10px; padding: 28px;
  margin: 0;
}
.free-test.ftp-playing .ft-verbal.ftp-current-group [data-question] { border: 0; padding: 0; }

/* Controls row */
.ftp-controls {
  display: flex; justify-content: space-between; gap: 12px;
  max-width: 860px; margin: 20px auto 0; padding: 0 20px;
}

/* Progress dots ride along while playing (reuse of the existing nav) */
.free-test.ftp-playing .free-test__nav { margin: 0 auto 20px; max-width: 860px; padding: 0 20px; }

/* ---- review ---- */
.ftp-result {
  background: #fff; border: 1px solid #E4E9F1; border-radius: 10px;
  padding: 32px; text-align: center; margin: 0 0 32px;
}
.ftp-result h3 { margin: 0 0 6px; font-size: 20px; color: #14203A; }
.ftp-result__score { margin: 0 0 10px; font: 500 44px/1.1 'IBM Plex Mono', monospace; color: #14203A; }
.ftp-result__band { margin: 0 0 6px; font-size: 17px; color: #14203A; }
.ftp-result__timeout { margin: 0 0 6px; font-size: 15px; color: #C42B1C; }
.ftp-result__review-note { margin: 0 0 18px; font-size: 14px; color: #5A6478; }
/* In review everything is visible again — the stacked fallback, now marked. */
.free-test.ftp-review .ftp-startcard { display: none; }

@media (max-width: 640px) {
  .ftp-bar { padding: 12px 14px; }
  .free-test.ftp-playing [data-question].ftp-current,
  .free-test.ftp-playing .ft-verbal.ftp-current-group { padding: 18px; }
}