.library-container { max-width:1240px; }
.library-hero { max-width:880px; margin:2.5rem 0 2rem; }
.library-hero h1 { color:var(--cyan); font:700 clamp(2.5rem,6vw,4.5rem)/1.05 var(--font-display); margin:.6rem 0 1.2rem; }
.library-key { color:var(--text-dim); line-height:1.8; font-size:.78rem; max-width:78ch; margin-top:1.2rem; }
.library-key strong { color:var(--text); }
.library-browse { margin-top:1.5rem; }
.library-filters { grid-template-columns:2fr 1fr 1fr 1fr auto; align-items:end; }
.library-filters input, .library-filters select { min-width:0; }
#library-count { margin:1.5rem 0; }
#library-grid { scroll-margin-top:6rem; }
.library-pagination { display:flex; justify-content:center; align-items:center; gap:1.25rem; margin:2rem 0; }
.library-pagination button:disabled { opacity:.4; cursor:default; }
.library-card .thumbnail-frame { aspect-ratio:16/10; }
.library-card .thumbnail-frame img { object-fit:contain; background:#070d16; }
.library-card .thumbnail-frame::before { display:none; }
.library-card .stack-list { margin-bottom:1rem; }
.library-card .project-card-meta a, .library-card .project-card-meta span { height:auto; min-height:1.55rem; line-height:1.6; padding-block:.15rem; }
.library-card[data-document-status="Exercise"] .card-badge span::before { background:var(--amber,#f4c471); box-shadow:none; animation:none; }
.related-lab-notes { display:grid; gap:.7rem; margin:1rem 0; list-style:none; }
.related-lab-notes a { color:var(--cyan); line-height:1.5; }
.lab-document .project-hero { grid-template-columns:1fr; }
.lab-document .project-cover { display:none; }
.lab-document .project-hero-copy { max-width:900px; }
.lab-document .project-title { max-width:24ch; }
.lab-document .project-body { max-width:88ch; margin-inline:auto; }
.lab-document .project-body figure { margin:1.5rem 0; }
.lab-document .project-body figure img { display:block; width:100%; height:auto; object-fit:contain; border:1px solid var(--border); }
.lab-document .project-body figcaption { color:var(--text-dim); font-size:.8rem; line-height:1.6; padding:.7rem 0; }
.lab-document .project-body blockquote { margin:1rem 0; border-left:2px solid var(--cyan); padding:.2rem 1rem; background:color-mix(in srgb,var(--cyan) 4%,transparent); }
.lab-document .project-body ol, .lab-document .project-body ul { line-height:1.8; }
.lab-document .project-actions { flex-wrap:wrap; }
.lab-document.light-mode .code-block,
.lab-document.light-mode .project-body pre { background:var(--bg-elev-2); }
.lab-document.light-mode .project-body pre code { color:var(--text); }
.lab-document .lightbox { --text:#f1f1f1; --text-faint:#b4c1ca; --cyan:#00f7ff; --border:rgba(0,247,255,.2); --border-strong:rgba(0,247,255,.5); }
@media(max-width:1050px) { .library-filters { grid-template-columns:repeat(2,minmax(0,1fr)); } .library-filters .filter-search { grid-column:1/-1; } }
@media(max-width:600px) { .library-filters { grid-template-columns:1fr; } .library-pagination { gap:.6rem; font-size:.75rem; } .library-pagination .button { padding-inline:.7rem; } }
@media print {
  body.lab-document, .lab-document * { color:#000!important; background:transparent!important; text-shadow:none!important; box-shadow:none!important; filter:none!important; animation:none!important; }
  body.lab-document { background:#fff!important; font:11pt/1.45 Arial,sans-serif; }
  .lab-document canvas, .lab-document .aurora, .lab-document .topbar, .lab-document .cursor, .lab-document .scroll-progress, .lab-document footer, .lab-document .project-actions, .lab-document .doc-controls, .lab-document .related-projects, .lab-document .breadcrumb, .lab-document .stack-list { display:none!important; }
  .lab-document .container { width:100%; max-width:none; padding:0; }
  .lab-document .page-main { padding-top:0; }
  .lab-document .project-body { max-width:none; }
  .lab-document .doc-section, .lab-document pre { border:0; overflow:visible; }
  .lab-document h1, .lab-document h2, .lab-document h3, .lab-document summary { break-after:avoid; }
  .lab-document figure { break-inside:avoid; }
  .lab-document .project-body img { max-height:7in; width:auto!important; max-width:100%; margin:auto; }
}
/* Reading views keep the complete lab available, with setup and practice filters. */
.lab-reader-views { display:flex; flex-wrap:wrap; gap:.5rem; margin:0 0 .5rem; }
.lab-reader-views button { padding:.65rem .9rem; border:1px solid var(--border); border-radius:6px; color:var(--cyan); background:var(--surface); font:inherit; cursor:pointer; }
.lab-reader-views button[aria-pressed="true"] { background:color-mix(in srgb,var(--cyan) 15%,var(--surface)); border-color:var(--cyan); }
.lab-reader-views button:focus-visible { outline:2px solid var(--cyan); outline-offset:3px; }
.lab-reader-count { color:var(--muted); font-size:.85rem; margin:0 0 1rem; }
.lab-document .doc-section[hidden] { display:none; }

/* One readable ink color throughout project and lab documents. The text token
   also keeps the light theme legible without changing the screenshot pixels. */
@media screen {
  body[data-page] .project-body,
  body[data-page] .project-body :is(summary, p, li, blockquote, figcaption, td, th, dt, dd, span, strong, em, small, code, pre, h1, h2, h3, h4, h5, h6, a),
  body[data-page] :is(.project-hero-summary, .project-meta dd, .embed-note, .gallery-item figcaption, .lab-reader-count),
  body[data-page] .project-card .project-summary { color:var(--text); }
  body[data-page] .project-body a { text-decoration:underline; text-underline-offset:.2em; }
}
@media print {
  .lab-reader-views,.lab-reader-count { display:none!important; }
  .lab-document .doc-section[hidden] { display:block!important; }
}