/* Native controls and read-only task guidance share the canonical UI tokens. */
.practice-selectors{display:grid;grid-template-columns:minmax(230px,1fr) minmax(260px,1.2fr);gap:20px;align-items:stretch;max-width:1120px;margin:0 auto 24px;padding:0;border:0}
.practice-level-selection,.practice-level-recommendation{min-width:0;margin:0;padding:20px;border:1px solid var(--line);border-radius:var(--ui-radius,14px);background:var(--card)}
.practice-level-selection{display:grid;grid-template-columns:minmax(0,1fr);align-content:start;gap:8px}
.control-kicker{display:block;color:var(--muted);font:600 .78rem/1.4 var(--sans);letter-spacing:.025em}
.practice-level-selection label{font:600 .94rem/1.5 var(--sans);color:var(--ink)}
#practice-difficulty{display:block;appearance:auto;width:100%;min-height:48px;margin:0;padding:10px 14px;border:1px solid color-mix(in srgb,var(--ink) 30%,var(--line));border-radius:10px;background:var(--paper,var(--card));color:var(--ink);font:600 1rem/1.4 var(--sans);text-align:left;cursor:pointer}
#practice-difficulty:focus-visible{outline:3px solid var(--green);outline-offset:3px}
#practice-difficulty-note{margin:2px 0 0;font:.85rem/1.6 var(--sans);color:var(--muted)}
.practice-level-recommendation{display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;gap:8px;background:color-mix(in srgb,var(--green) 4%,var(--card))}
#practice-recommended-level{font:650 1.15rem/1.4 var(--sans);color:var(--ink)}
.practice-level-recommendation .practice-recommendation{flex:none;width:100%;margin:0;font:.88rem/1.6 var(--sans);color:var(--ink)}
.practice-selection-mode{display:inline-flex;align-items:center;gap:6px;margin-top:auto;padding:5px 9px;border:1px solid var(--line);border-radius:7px;color:var(--ink);background:var(--card);font:600 .78rem/1.5 var(--sans)}
.practice-selection-mode[data-mode="manual"]{border-color:color-mix(in srgb,var(--green) 45%,var(--line))}
.practice-selectors .practice-pool-note{grid-column:1/-1;margin:-6px 0 0;font:.85rem/1.6 var(--sans);color:var(--muted)}
.task-how{display:grid;gap:7px;margin:12px 0 14px;max-width:70ch}
.task-copy .task-instruction,.task-copy .task-verified-progress,.task-copy .task-claim-note,.task-copy .task-timing{margin:0;font-size:.88rem;line-height:1.65;color:var(--ink)}
.task-copy .task-verified-progress{font-weight:600}
.task-copy .task-claim-note,.task-copy .task-timing{font-size:.8rem;color:var(--muted)}
.task-criteria-details{margin:1px 0 0;font-size:.82rem;color:var(--muted)}
.task-criteria-details summary{min-height:40px;display:flex;align-items:center;cursor:pointer;font-weight:600;color:var(--ink)}
.task-criteria-details p{margin:4px 0 0;line-height:1.6}
.task-row .task-progress>div{display:flex;justify-content:space-between;gap:10px;font-size:.85rem}
.task-row .task-progress progress{display:block;width:100%;height:7px;margin:10px 0 0;border:0;accent-color:var(--green)}
.task-row .task-action{display:flex;flex-direction:column;align-items:stretch;gap:8px;justify-content:center;min-width:140px}
.task-row .task-action .button{min-height:44px;white-space:normal;font-size:.88rem}
.task-row .task-mark>svg{width:24px;height:24px;stroke:currentColor}
.task-row .task-rewards{gap:7px 10px;font-size:.82rem}
.task-row .task-rewards>span{font-size:.76rem;letter-spacing:0;text-transform:none}
.rank-acquisition{max-width:66ch;line-height:1.65;color:var(--muted);font-size:.9rem}
.practice-study-task>p{font-size:.82rem;line-height:1.6;color:var(--muted);margin:7px 0}
#page-practice .practice-study-task small{font-size:.8rem;line-height:1.5}
/* Unscored feedback keeps the editable answer and retry path visible. */
#page-practice .practice-card:has(#result[data-grade="unscored"]:not([hidden])) #answer-form{display:block}
@media(max-width:700px){.practice-selectors{grid-template-columns:minmax(0,1fr);gap:12px}.practice-level-selection,.practice-level-recommendation{padding:16px}.practice-selectors .practice-pool-note{margin:0}.task-row .task-action{min-width:0}.task-how{margin:10px 0}.task-row .task-action .button{width:100%}}
@media(prefers-reduced-motion:reduce){.practice-selectors *,.task-how *{scroll-behavior:auto;transition:none}}
