/* Shared answer-card styles: panel, inline practice and account history. */
  .pq{ border:1px solid var(--border); border-radius:14px; padding:18px 20px; background:#fff; margin-bottom:12px; }
  .pq-head{ display:flex; align-items:baseline; justify-content:space-between; gap:12px; margin-bottom:9px; }
  .pq-n{ font-size:10px; letter-spacing:.12em; text-transform:uppercase; color:var(--faint); font-weight:600; }
  .pq-q{ font-size:16px; line-height:1.45; letter-spacing:-.01em; margin:0 0 14px; }
  .pq-block{ padding:12px 14px; border-radius:10px; margin-bottom:9px; }
  .pq-block.land{ background:#f4f8f5; border:1px solid #dcebe2; }
  .pq-block.gap{ background:#fbf4f4; border:1px solid #f0dcda; }
  .pq-block.add{ background:var(--panel); border:1px solid var(--line); }
  .pq-lbl{ font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; margin-bottom:6px; }
  .pq-block.land .pq-lbl{ color:var(--ok); } .pq-block.gap .pq-lbl{ color:var(--rec); }
  .pq-block.add .pq-lbl{ color:var(--dim); }
  .pq-quote{ font-size:13.5px; line-height:1.6; font-style:italic; border-left:2px solid var(--field); padding-left:11px; margin:0 0 8px; }
/* STAR rows, on story questions only. Three tints carry COVERAGE (said it / said some of it /
   nothing yet); the words stay coaching, so colour is the only thing doing the grading. */
.pq-note{ font-size:13.5px; line-height:1.6; color:var(--dim); margin:0 0 10px; }
.pq-star{ border:1px solid var(--line); border-radius:10px; overflow:hidden; margin-bottom:9px; }
.pq-sr{ display:grid; grid-template-columns:76px 1fr; gap:12px; padding:11px 13px;
        border-bottom:1px solid var(--line); align-items:start; }
.pq-sr:last-child{ border-bottom:none; }
.pq-sr.full{ background:#f4f8f5; }
.pq-sr.part{ background:#fdfaf4; }
.pq-sr.none{ background:#fbf4f4; }
.pq-sr.evidence{ background:#f4f8f5; }
.pq-sr.neutral{ background:#fbf4f4; }
.pq-sk{ display:flex; align-items:center; gap:6px; font-size:10px; letter-spacing:.1em;
        text-transform:uppercase; font-weight:700; color:var(--dim); padding-top:2px; }
.pq-sr.full .pq-sk{ color:var(--ok); }
.pq-sr.part .pq-sk{ color:var(--warn); }
.pq-sr.none .pq-sk{ color:#a8433c; }
.pq-sr.evidence .pq-sk{ color:#356752; }
.pq-sr.neutral .pq-sk{ color:#a8433c; }
.pq-mk{ font-size:11px; width:13px; display:inline-block; }
.pq-sv{ font-size:13px; line-height:1.55; margin:0; }
.pq-sq{ font-style:italic; }
.pq-sa{ color:var(--dim); }
.pq-sa b{ color:var(--text); font-weight:600; }
@media (max-width:520px){ .pq-sr{ grid-template-columns:1fr; gap:4px; } }
  .pq-body{ font-size:13.5px; line-height:1.6; margin:0; }
  .pq-body ul{ margin:0; padding-left:18px; }
  .pq-note-line{ display:block; margin-top:4px; font-size:12px; color:var(--dim); }
  .pq-reference a{ color:inherit; text-decoration:underline; }
  .pq-footnote{ font-size:11px; color:var(--dim); margin-top:8px; }
  .pq-bar{ font-size:11px; font-weight:600; letter-spacing:.02em; padding:2px 8px;
           border-radius:999px; border:1px solid var(--line); color:var(--dim);
           white-space:nowrap; margin-left:auto; }
  .pq-bar.meets{ color:var(--text); border-color:var(--field); }
  .pq-bar.below{ color:var(--rec); border-color:var(--rec); }
  .pq-inferred{ font-size:12px; color:var(--dim); margin:0 0 10px; }
  .pq-inferred b{ color:var(--text); font-weight:600; }
  .pq-v{ font-size:11px; font-weight:600; border-radius:5px; padding:3px 8px; border:1px solid var(--border); color:var(--dim); white-space:nowrap; }
  .pq-v.strong{ color:var(--ok); border-color:#cfe7db; }
  .pq-v.adequate{ color:var(--warn); border-color:#eedcc0; }
  .pq-v.weak, .pq-v.not_demonstrated{ color:var(--rec); border-color:#f0d2d0; }

.sample-scope { color:var(--dim); font-size:13px; line-height:1.5; margin:0 0 18px; }
/* Single-question practice: verdict, STAR evidence, one next step, then the host's action. */
.sample-head h2 { font-size:22px; line-height:1.25; letter-spacing:-.02em; margin:0; text-wrap:balance; }
.sample-head p { margin:8px 0 0; font-size:14px; line-height:1.5; max-width:58ch; }
.sample-star { border:1px solid var(--line); border-radius:10px; overflow:hidden; margin:14px 0 0; }
.sample-row { display:grid; grid-template-columns:70px 1fr 1.5fr; gap:12px; padding:9px 13px; border-bottom:1px solid var(--line); align-items:start; }
.sample-star.single .sample-row { grid-template-columns:70px 1fr; }
.sample-row:last-child { border-bottom:0; }
.sample-row.cols { padding:7px 13px; background:rgba(52,73,71,.05); font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:var(--faint); }
.sample-row.cols span:last-child { color:var(--ok); }
.sample-row.full { background:#f4f8f5; }
.sample-row.part { background:#fdfaf4; }
.sample-row.none { background:#fbf4f4; }
.sample-slot { font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:var(--ok); padding-top:2px; }
.sample-row.part .sample-slot { color:var(--warn); }
.sample-row.none .sample-slot { color:var(--rec); }
.sample-row.same .sample-slot { color:var(--dim); }
.sample-before { font-size:12px; line-height:1.45; color:var(--dim); font-style:italic; margin:0; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.sample-row.open .sample-before { display:block; -webkit-line-clamp:unset; overflow:visible; }
.sample-more { display:block; border:0; background:none; padding:2px 0 0; font:500 11px inherit; font-family:inherit; color:var(--ok); cursor:pointer; text-decoration:underline; text-underline-offset:2px; }
.sample-more:focus-visible { outline:2px solid var(--ok); outline-offset:2px; border-radius:2px; }
.sample-after { font-size:13px; line-height:1.5; margin:0; color:var(--text); }
.sample-star.pair .sample-after.improved { font-weight:600; }
.sample-star.pair .sample-after:not(.improved) { color:var(--dim); font-style:italic; }
.sample-before.empty, .sample-after.empty { font-style:normal; color:var(--dim); }
.sample-add { display:block; margin-top:3px; font-size:12px; color:var(--dim); }
.sample-add b { font-weight:600; color:var(--warn); }
.sample-tag { display:inline-block; margin-left:6px; padding:1px 6px; border-radius:999px; background:rgba(70,126,120,.12); color:#2f5f5a; font-size:9px; letter-spacing:.06em; font-weight:600; font-style:normal; vertical-align:1px; white-space:nowrap; }
.sample-tag.down { background:rgba(148,114,58,.12); color:var(--warn); }
.sample-next { display:grid; grid-template-columns:auto 1fr; gap:12px; align-items:start; margin:14px 0 0; padding:13px 15px 13px 14px; border-radius:10px; background:rgba(70,126,120,.12); border-left:3px solid var(--ok); }
.sample-next-mark { width:26px; height:26px; border-radius:50%; background:var(--ok); color:#fffaf1; display:grid; place-items:center; font-size:13px; font-weight:700; margin-top:1px; }
.sample-next span { display:block; font-size:10px; letter-spacing:.1em; text-transform:uppercase; font-weight:700; color:#2f5f5a; margin-bottom:3px; }
.sample-next p { margin:0; font-size:13.5px; line-height:1.5; color:var(--text); font-weight:500; }
.sample-more-details { margin:14px 0 0; }
.sample-more-details > summary { cursor:pointer; font-size:12px; color:var(--dim); font-weight:500; text-decoration:underline; text-underline-offset:3px; list-style:none; }
.sample-more-details > summary::-webkit-details-marker { display:none; }
.sample-more-details[open] > summary { margin-bottom:10px; }
.sample-question { font-size:13px; line-height:1.5; margin:0 0 12px; }
.sample-answers { display:grid; grid-template-columns:1fr 1fr; gap:14px; }
.sample-answers .sample-answer:only-child { grid-column:1 / -1; }
.sample-answer h4 { font-size:10px; letter-spacing:.1em; text-transform:uppercase; color:var(--faint); margin:0 0 6px; }
.sample-answer p, .sample-answer li { font-size:12.5px; line-height:1.55; color:var(--dim); margin:0 0 10px; }
.sample-answer ul { margin:0 0 10px; padding-left:18px; }
.sample-transcript-text { white-space:pre-wrap; overflow-wrap:anywhere; margin:10px 0; padding:12px 16px; border-left:2px solid var(--field,var(--line)); }
.sample-answer blockquote { font-size:12.5px; line-height:1.55; color:var(--dim); margin:0; }
.sample-concern { font-size:13px; line-height:1.6; color:var(--rec); }
@media (max-width:520px) {
  .sample-row, .sample-star.single .sample-row { grid-template-columns:1fr; gap:3px; padding:8px 12px; }
  .sample-row.cols { display:none; }
  .sample-star.pair .sample-before::before { content:"First · "; font-style:normal; font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--faint); }
  .sample-star.pair .sample-after::before { content:"Second · "; font-style:normal; font-size:10px; letter-spacing:.08em; text-transform:uppercase; font-weight:700; color:var(--ok); }
  .sample-answers { grid-template-columns:1fr; }
}
/* Map the public-page theme to the same card tokens used in the account shell. */
#practice-content { --text:#2f3732; --faint:#7a837b; --border:#dcded5; --panel:#fffcf7; --field:#b1c4bb; --ok:#356752; --warn:#94723a; --rec:#a8433c; }
#practice-content .sample-head h2 { color:#303c35; }

.sample-transcript-label { font-size:12px; font-weight:600; margin:0 0 8px; }
#practice-content { --dim:#69716e; --line:rgba(52,73,71,.15); }