/* Catalog navigation and reference studies share the existing paper-and-pencil UI. */
.category-tabs{flex-wrap:wrap;gap:8px}
.category-count{font-size:.8em;opacity:.65;font-variant-numeric:tabular-nums}
.lesson-reference{margin-top:18px;border-top:1px solid var(--line);padding-top:14px;text-align:left}
.lesson-reference summary{display:flex;align-items:center;gap:8px;cursor:pointer;font-weight:600;min-height:44px;color:var(--purple)}
.lesson-reference summary:focus-visible{outline:3px solid #a692d0;outline-offset:3px;border-radius:8px}
.lesson-reference img{display:block;width:100%;max-height:40dvh;object-fit:contain;border-radius:12px;background:#fff;margin:10px auto}
.lesson-reference p,.lesson-reference small{display:block;font-size:12px;line-height:1.6;color:var(--muted)}
.lesson-reference a{display:inline-flex;align-items:center;gap:6px;min-height:44px;color:var(--purple);font-size:12px}
.reference-modal{max-width:700px}
@media(min-width:1800px){.lesson-grid{grid-template-columns:repeat(auto-fit,minmax(250px,1fr))}.card-art{height:210px}.card-art svg.lesson-art{height:200px;width:240px}}
@media(max-width:600px){.category-tabs{flex-wrap:wrap;overflow:visible}.category-tabs .pill{min-height:40px}.lesson-reference img{max-height:32dvh}}