/* Phase 2A: every rule is scoped to the Speak Clear page. */
.sc-phase2a { max-width: 1380px; }
.sc-phase2a .sc-header { max-width: 680px; margin: -16px auto 48px; }
.sc-phase2a .sc-banner { height: auto; border-radius: 0; }
.sc-phase2a .sc-workspace { display: grid; grid-template-columns: minmax(180px,.65fr) minmax(0,1.6fr) minmax(320px,1.2fr); gap: 24px; align-items: start; }
.sc-phase2a .sc-lesson-selection { display: grid; gap: 14px; min-width: 0; padding-top: 4px; }
.sc-phase2a .sc-lesson-selection > .games-preview-badge { justify-self: start; }
.sc-phase2a .sc-lesson-selection label { font-size: .88rem; font-weight: 800; }
.sc-phase2a select { width: 100%; min-width: 0; min-height: 46px; padding: 9px 24px 9px 10px; border: 1px solid #6095a5; border-radius: 10px; background: #e5f7f9; color: #193f59; font: inherit; font-size: .82rem; }
.sc-phase2a select:focus-visible { outline: 3px solid #1749a3; outline-offset: 3px; }
.sc-phase2a .sc-selected-info { display: grid; gap: 7px; line-height: 1.45; overflow-wrap: anywhere; }
.sc-phase2a .sc-info-label { font-size: .7rem; color: #365968; text-transform: uppercase; letter-spacing: .07em; margin-top: 12px; }
.sc-phase2a .sc-selected-info h2 { font-size: 1.15rem; line-height: 1.4; margin: 0 0 14px; }
.sc-phase2a .sc-selected-info small { color: #365968; }
.sc-phase2a .sc-illustration { padding: 0 8px; border: 0; background: transparent; border-radius: 0; }
.sc-phase2a h2 { margin: 0; font-size: 1.12rem; }
.sc-phase2a .sc-illustration > p { min-height: 42px; margin: 8px 0 18px; line-height: 1.5; }
.sc-phase2a .sc-color-board { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px 8px; padding: 4px 0; }
.sc-phase2a .sc-color-item { height: 100px; }
.sc-phase2a .sc-marker { width: 32px; height: 32px; font-size: .85rem; }
.sc-phase2a .sc-row-number { display: grid; place-items: center; width: 28px; height: 28px; border: 1px solid #4e8092; border-radius: 50%; color: #193f59; background: #f2fbfc; font-size: .8rem; }
.sc-phase2a .sc-metrics { grid-template-columns: .85fr 1.15fr; gap: 12px; margin-bottom: 22px; }
.sc-phase2a .sc-metrics strong { font-size: 1.9rem; }
.sc-phase2a .sc-mic-note { margin: 5px 0 12px; color: #365968; font-size: .75rem; }
.sc-phase2a .sc-word-list { gap: 8px; margin: 0; }
.sc-phase2a .sc-word-row { grid-template-columns: 28px 44px auto minmax(0,1fr); gap: 6px; padding: 6px 4px; min-height: 64px; border: 0; border-bottom: 1px solid #659fae66; border-radius: 0; background: transparent; }
.sc-phase2a .sc-item-mic { display: grid; place-items: center; width: 44px; height: 44px; padding: 10px; border: 1px solid #6591aa; border-radius: 50%; background: #d9f0fa; color: #245d87; opacity: .8; cursor: not-allowed; }
.sc-phase2a .sc-item-mic svg { width: 23px; height: 23px; }
.sc-phase2a .sc-hint { min-height: 44px; min-width: 54px; padding: 5px 8px; font-size: .74rem; }
.sc-phase2a .sc-word-feedback { min-width: 0; line-height: 1.35; overflow-wrap: anywhere; }
.sc-phase2a .sc-word { font-size: .85rem; }
.sc-phase2a .sc-feedback { display: block; font-size: .72rem; margin-top: 3px; }
.sc-phase2a .sc-board-placeholder { display: flex; flex-direction: column; justify-content: center; align-items: center; text-align: center; min-height: 470px; padding: 24px; border: 1px dashed #6b9fac; border-radius: 20px; margin-top: 22px; background: #d8f2f433; }
.sc-phase2a .sc-placeholder-symbol { color: #3b8196; font-size: 3rem; }
.sc-phase2a .sc-board-placeholder h3 { font-size: 1.1rem; line-height: 1.5; }
.sc-phase2a .sc-board-placeholder p { color: #365968; font-size: .85rem; line-height: 1.7; }
.sc-phase2a .sc-controls { margin-top: 30px; gap: 14px; }
.sc-phase2a .sc-controls > p { margin: 0; }
/* Prepared only. Nothing in this phase applies these states. */
.sc-phase2a .sc-color-item.is-incomplete .sc-object { visibility: visible; }
.sc-phase2a .sc-color-item.is-cleared .sc-object,
.sc-phase2a .sc-color-item.is-complete .sc-object { visibility: hidden; }
.sc-phase2a .sc-color-item.is-complete .sc-marker { background: #258441; color: white; border-color: #258441; }
.sc-phase2a .sc-color-item.is-complete .sc-completion { display: inline; color: #185d2b; }
.sc-phase2a .sc-word-row[data-state="idle"] { background: transparent; }
.sc-phase2a .sc-word-row[data-state="listening"] { background: #d7eefc; border-color: #397ba5; }
.sc-phase2a .sc-word-row[data-state="correct"] { background: #d9f0de; border-color: #36854d; }
.sc-phase2a .sc-word-row[data-state="correct"] .sc-row-number { background: #258441; color: white; border-color: #258441; }
.sc-phase2a .sc-word-row[data-state="incorrect"] { background: #ffe6e0; border-color: #bd5a4a; }
.sc-phase2a .sc-word-row[data-state="no-speech"] { background: #fff0ce; border-color: #967126; }
@media (max-width: 1100px) and (min-width: 761px) {
 .sc-phase2a .sc-workspace { grid-template-columns: minmax(0,1.25fr) minmax(300px,1fr); gap: 24px; }
 .sc-phase2a .sc-lesson-selection { grid-column: 1 / -1; grid-template-columns: minmax(200px,1fr) minmax(0,2fr); gap: 10px 20px; }
 .sc-phase2a .sc-lesson-selection label { grid-column: 1; }
 .sc-phase2a .sc-lesson-selection select { grid-column: 1; }
 .sc-phase2a .sc-selected-info { grid-column: 2; grid-row: 1 / 4; align-content: start; }
 .sc-phase2a .sc-info-label { margin-top: 0; }
 .sc-phase2a .sc-selected-info h2 { margin-bottom: 0; }
}
@media (max-width: 760px) {
 .sc-phase2a .sc-workspace { grid-template-columns: minmax(0,1fr); gap: 28px; }
 .sc-phase2a .sc-header { margin-top: -12px; margin-bottom: 36px; }
 .sc-phase2a .sc-lesson-selection { gap: 10px; }
 .sc-phase2a .sc-selected-info { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px 12px; }
 .sc-phase2a .sc-info-label { margin-top: 0; }
 .sc-phase2a .sc-selected-info h2 { margin: 0; }
 .sc-phase2a .sc-selected-info small { width: 100%; }
 .sc-phase2a .sc-illustration { padding: 0; }
 .sc-phase2a .sc-color-item { height: 90px; }
 .sc-phase2a .sc-illustration > p { min-height: 0; }
 .sc-phase2a .sc-board-placeholder { min-height: 290px; }
 .sc-phase2a .sc-word-row { gap: 7px; min-height: 64px; }
 .sc-phase2a .sc-controls { gap: 14px; }
}

/* Owner layout review: retain an accessible selector label without visible copy. */
.sc-phase2a .sc-visually-hidden { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0; }
.sc-phase2a .sc-board-time { justify-items: center; text-align: center; margin: 0 auto 20px; }
.sc-phase2a .sc-board-time > span, .sc-phase2a .sc-board-progress > span { font-size: .8rem; font-weight: 750; }
.sc-phase2a .sc-board-time strong, .sc-phase2a .sc-board-progress strong { font-size: 1.9rem; font-variant-numeric: tabular-nums; line-height: 1.2; }
.sc-phase2a .sc-board-time small { font-size: .7rem; color: #35596a; }
.sc-phase2a .sc-board-progress { justify-items: center; text-align: center; width: min(100%, 320px); margin: 24px auto 0; }

/* End-of-round appearance, matching AMQ. Activated by the local countdown. */
.sc-phase2a .sc-board-stage { position: relative; isolation: isolate; }
.sc-phase2a .sc-timeout { position: absolute; z-index: 4; inset: 0; display: grid; align-content: center; justify-items: center; gap: .85rem; padding: 1rem; text-align: center; background: radial-gradient(ellipse at center, rgb(237 248 249 / 94%) 0 35%, rgb(237 248 249 / 80%) 62%, transparent 100%); }
.sc-phase2a .sc-timeout[hidden] { display: none; }
.sc-phase2a .sc-timeout h2 { color: #20344e; font-size: clamp(1.75rem, 4.5vw, 3rem); font-weight: 900; line-height: 1.1; text-shadow: 0 1px 0 #fff, 0 0 12px #fff; }
.sc-phase2a .sc-timeout .primary-action { margin: 0; }
.sc-phase2a .sc-timeout button:disabled { opacity: 1; cursor: not-allowed; }

.sc-phase2a .sc-hint:disabled { opacity: .55; cursor: not-allowed; }
.sc-phase2a .sc-timeout .primary-action:focus-visible { outline: 3px solid #1749a3; outline-offset: 4px; }

/* A round remains idle at 3:00 until this explicit Start control is pressed. */
.sc-phase2a .sc-start { min-height: 44px; min-width: 100px; margin-bottom: 4px; padding: 8px 22px; background: #ff7f62; color: #000; box-shadow: 0 4px 0 #c85d45; }
.sc-phase2a .sc-start:disabled { opacity: .6; cursor: not-allowed; box-shadow: none; }
.sc-phase2a .sc-start:focus-visible { outline: 3px solid #1749a3; outline-offset: 4px; }

/* Colors-only speech controls; all geometry and approved colors remain intact. */
.sc-phase2a .sc-item-mic:not(:disabled) { opacity: 1; cursor: pointer; }
.sc-phase2a .sc-item-mic:disabled { cursor: not-allowed; }
.sc-phase2a .sc-word-row[data-state="listening"] .sc-item-mic { opacity: 1; background: #b8ddf6; border-color: #246395; }
.sc-phase2a .sc-word-row[data-state="correct"] .sc-feedback { color: #185e2b; }
.sc-phase2a .sc-word-row[data-state="incorrect"] .sc-feedback { color: #8d3022; }
.sc-phase2a .sc-word-row[data-state="no-speech"] .sc-feedback { color: #65490d; }

/* November 1 desktop/laptop layout refinement; speech and timer logic unchanged. */
.sc-phase2a .sc-header { max-width: 510px; margin-top: -36px; margin-bottom: 28px; }
.sc-phase2a .sc-board-time { margin-bottom: 8px; }
.sc-phase2a .sc-board-time strong { font-size: 1.1rem; }
.sc-phase2a .sc-board-progress strong { font-size: .95rem; }
.sc-phase2a .sc-controls { margin-top: 16px; }
.sc-phase2a .sc-back-games { background: #ff7f62; color: #000; }
.sc-phase2a .sc-beta-notice { max-width: 1000px; margin: 32px auto 0; color: #345569; font-size: .8rem; line-height: 1.6; }
.sc-phase2a .sc-beta-notice > p { margin: 6px 0 12px; }
.sc-phase2a .sc-speech-disclosure summary { cursor: pointer; width: fit-content; }
.sc-phase2a .sc-speech-disclosure summary:focus-visible { outline: 3px solid #1749a3; outline-offset: 4px; }
@media (min-width: 1101px) {
 /* The left track is unchanged; the speaking track is 0.72/1.2 = 60% of its old share. */
 .sc-phase2a .sc-workspace { grid-template-columns: minmax(180px,.65fr) minmax(0,2.08fr) minmax(0,.72fr); }
 .sc-phase2a .sc-color-board { grid-template-columns: repeat(3,minmax(0,1fr)); }
 .sc-phase2a .sc-color-item:last-child:nth-child(3n+1) { grid-column: 2; }
 .sc-phase2a .sc-word-list { gap: 4px; }
 .sc-phase2a .sc-word-row { gap: 4px; padding: 2px 0; min-height: 49px; }
}
@media (max-width: 760px) {
 .sc-phase2a .sc-header { max-width: min(75%,510px); margin-top: -32px; margin-bottom: 24px; }
}
@media (max-width: 480px) {
 /* Match the existing AMQ mobile timer rule. */
 .sc-phase2a .sc-board-time strong { font-size: .95rem; }
}

/* Four owner-approved visual adjustments; no game logic changes. */
.sc-phase2a .sc-marker { left: 50%; top: 50%; transform: translate(-50%,-50%); z-index: 2; }
.sc-phase2a .sc-hint,
.sc-phase2a .sc-hint[aria-expanded="true"] { background: var(--sc-hint-color,var(--sc-apprentice-color)); color: #000; }
.sc-phase2a .sc-hint:hover:not(:disabled) { background: var(--sc-hint-color,var(--sc-apprentice-color)); filter: brightness(.96); }
.sc-phase2a .sc-hint:active:not(:disabled) { filter: brightness(.9); }
.sc-phase2a .sc-word-feedback { padding-inline-start: 1ch; }
@media (min-width:1101px) {
 .sc-phase2a #sc-lesson-selector { transform: translateX(50%); }
}

/* Final polish: retain hub image box and speaking-row positions. */
.sc-hub-transparent { aspect-ratio: 732 / 156; object-fit: contain; }
.sc-phase2a[data-sc-apprentice="sienna"] { --sc-hint-color: color-mix(in srgb,var(--sc-apprentice-color) 88%,white); }
.sc-phase2a .sc-mic-note { display: grid; }
.sc-phase2a .sc-instruction-size, .sc-phase2a .sc-instruction-copy { grid-area: 1 / 1; }
.sc-phase2a .sc-instruction-size { visibility: hidden; }

@media (max-width:760px) { .sc-phase2a .sc-status { margin-top: 16px; } }