.practice-nav, .practice-controls { display: flex; flex-wrap: wrap; align-items: center; gap: .7rem 1rem; margin: 1rem 0; }
.practice-nav a { margin-left: auto; }
.practice-nav [aria-current="page"] { outline: 2px solid var(--gold); outline-offset: 2px; }
.build-form { display: grid; grid-template-columns: repeat(auto-fit, minmax(9rem, 1fr)); align-items: end; gap: .8rem; padding: 1rem; border: 1px solid var(--line); background: var(--surface); border-radius: var(--tn-radius-sm); }
.build-form label, .filter-label { display: grid; gap: .25rem; font-weight: 600; }
.build-form input, .build-form select, .filter-label select, .notebook-item select, .notebook-item textarea, .practice-answer { min-height: 2.65rem; border: 1px solid var(--muted); border-radius: .3rem; padding: .45rem .6rem; background: var(--background); color: var(--ink); }
.practice-note { color: var(--muted); }
.practice-card { margin-top: 1rem; }
.practice-card:empty { display: none; }
.practice-card h2 { margin-top: 0; }
.practice-answer { width: min(18rem, 100%); }
.practice-form { display: flex; flex-wrap: wrap; align-items: end; gap: .7rem; }
.practice-form label { display: grid; gap: .25rem; font-weight: 600; }
.practice-feedback[data-kind="correct"] { color: var(--good); }
.practice-feedback[data-kind="incorrect"], .practice-feedback[data-kind="invalid"] { color: var(--bad); }
.practice-help { margin-top: .75rem; }
.practice-help details, .notebook-item details { margin-top: .75rem; padding: .75rem; background: var(--wash); }
.practice-help p, .notebook-item p { margin: .3rem 0; }
.practice-controls { justify-content: space-between; }
.notebook-list { display: grid; gap: .8rem; margin: 1rem 0; padding: 0; list-style: none; }
.notebook-item { padding: 1rem; border: 1px solid var(--line); background: var(--surface); border-radius: var(--tn-radius-sm); }
.notebook-item h3 { margin: 0 0 .6rem; font-size: 1rem; }
.notebook-item textarea { display: block; width: 100%; min-height: 5rem; margin-top: .5rem; }
.notebook-actions { display: flex; flex-wrap: wrap; gap: .7rem; margin-top: .7rem; }
.resolved-label { color: var(--good); }
@media (max-width: 32rem) { .practice-nav a { margin-left: 0; width: 100%; } }
