/* Test-specific learning context. */
.test-rationale { max-width: 700px; margin-top: 42px; padding: 24px 0; border-top: 2px solid var(--ink); border-bottom: 1px solid var(--line); }
.test-rationale h2 { max-width: 590px; margin: 0; font-size: 34px; line-height: 1.06; }
.test-rationale p:not(.eyebrow) { max-width: 650px; margin: 16px 0 0; color: var(--muted); font: 16px/1.5 "Trebuchet MS", sans-serif; }
@media (max-width: 700px) { .test-rationale h2 { font-size: 31px; } }
.practice-page { padding: 66px 0 80px; }.practice-shell { max-width: 920px; }.practice-page h1 { max-width: 760px; font-size: 58px; line-height: .98; letter-spacing: -.05em; }.practice-intro { max-width: 690px; margin: 23px 0 0; color: var(--copy); font: 18px/1.5 "Trebuchet MS", sans-serif; }.reflection-copy { min-width: 0; }.reflection-copy h2 { max-width: 490px; margin: 0; font-size: 37px; line-height: 1.04; }.reflection-copy > p:not(.eyebrow) { margin: 20px 0 0; color: var(--muted); font: 17px/1.5 "Trebuchet MS", sans-serif; }.reflection-card { display: grid; grid-template-columns: 290px minmax(0, 1fr); gap: 58px; align-items: start; margin-top: 48px; padding: 34px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }.reflection-card-face { display: flex; width: 290px; aspect-ratio: 9 / 16; flex-direction: column; justify-content: space-between; padding: 26px 24px; border: 2px solid #b79752; outline: 1px solid #6e542a; outline-offset: -8px; background: linear-gradient(145deg, #171512, #30261b 47%, #16130f); color: #e6c66e; text-align: center; }.reflection-card-face span, .reflection-card-face > i { font: 700 10px/1 "Trebuchet MS", sans-serif; letter-spacing: .12em; text-transform: uppercase; }.reflection-card-face b { font-size: 51px; line-height: .92; }.reflection-card-face > p { max-width: 245px; margin: 0 auto; color: #f0e6cf; font-size: 21px; line-height: 1.18; }.card-emblem { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 12px; color: #bc9b54; }.card-emblem i { height: 1px; background: currentColor; }.card-emblem strong { padding: 7px 8px; border: 1px solid currentColor; font: 700 9px/1 "Trebuchet MS", sans-serif; letter-spacing: .12em; }.practice-link { display: inline-block; margin-top: 26px; color: var(--teal); font: 700 11px/1 "Trebuchet MS", sans-serif; letter-spacing: .06em; text-transform: uppercase; }.test-instructions { max-width: 650px; margin: 20px 0 0; color: var(--muted); font: 15px/1.45 "Trebuchet MS", sans-serif; }.chart-test { margin-top: 30px; padding: 26px; border: 1px solid var(--line); border-radius: 8px; background: var(--panel); }.test-charts { display: grid; grid-template-columns: 1fr 1fr; gap: 28px; }.test-chart { padding: 18px; border: 1px solid var(--line); }.test-chart header { display: flex; justify-content: space-between; gap: 12px; font: 700 11px/1 "Trebuchet MS", sans-serif; letter-spacing: .06em; text-transform: uppercase; }.test-chart header b { color: var(--coral); }.test-chart svg { display: block; width: 100%; height: auto; aspect-ratio: 4 / 3; margin-top: 17px; background: repeating-linear-gradient(to bottom, transparent 0 43px, var(--chart-grid) 43px 44px); }.test-chart polyline { fill: none; stroke: var(--teal); stroke-width: 2.5; }.test-chart:nth-child(2) polyline { stroke: var(--coral); }.future-mask { fill: color-mix(in srgb, var(--panel) 94%, var(--ink)); stroke: var(--muted); stroke-dasharray: 3 3; }.future-divider { stroke: var(--muted); stroke-width: .8; stroke-dasharray: 3 3; }.test-chart.is-revealed .future-mask, .test-chart.is-revealed .future-divider { display: none; }.test-chart button { width: 100%; min-height: 40px; margin-top: 16px; border: 1px solid var(--ink); border-radius: 4px; background: transparent; color: var(--ink); font: 700 11px/1 "Trebuchet MS", sans-serif; cursor: pointer; letter-spacing: .05em; text-transform: uppercase; }.test-chart button:hover { background: var(--teal-pale); }.test-result { margin: 13px 0 0; color: var(--muted); font: 14px/1.4 "Trebuchet MS", sans-serif; }.test-feedback { margin: 23px 0 0; color: var(--ink); font: 700 16px/1.4 Georgia, "Times New Roman", serif; }@media (max-width: 700px) { .practice-page { padding: 46px 0 56px; }.practice-page h1 { font-size: 43px; }.reflection-card { grid-template-columns: 1fr; gap: 30px; padding: 20px; }.reflection-card-face { width: min(290px, 100%); margin: 0 auto; }.reflection-copy h2 { font-size: 31px; }.reflection-card-face b { font-size: 42px; }.chart-test { padding: 14px; }.test-charts { grid-template-columns: 1fr; gap: 16px; } }