/* Shared lab chrome. Deliberately minimal so each demo's own styling dominates. */
:root{
  --ink:#0b0b0c; --paper:#f4f2ee; --mute:#7a766e; --line:#d9d5cd; --accent:#1a4d3a;
  --font-display:"Instrument Serif",ui-serif,Georgia,serif;
  --font-ui:"Inter",system-ui,-apple-system,"Segoe UI",sans-serif;
  --font-mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--paper);color:var(--ink);font-family:var(--font-ui);
  -webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
a{color:inherit}
img{max-width:100%;display:block}

/* Fixed back-to-index pill present on every demo page */
.lab-nav{position:fixed;left:16px;top:16px;z-index:9999;display:flex;gap:8px;align-items:center;
  font-family:var(--font-mono);font-size:11px;letter-spacing:.04em;text-transform:uppercase}
.lab-nav a{background:rgba(10,10,12,.82);color:#fff;text-decoration:none;padding:7px 12px;
  border-radius:999px;backdrop-filter:blur(12px);border:1px solid rgba(255,255,255,.14)}
.lab-nav a:hover{background:#000}
.lab-nav .tag{background:rgba(255,255,255,.7);color:var(--ink);padding:7px 12px;border-radius:999px;
  border:1px solid var(--line);backdrop-filter:blur(12px)}

/* Source note block — every demo states which video it came from and what is verbatim */
.lab-note{position:fixed;right:16px;bottom:16px;z-index:9999;max-width:330px;
  background:rgba(10,10,12,.88);color:#e9e7e2;border:1px solid rgba(255,255,255,.14);
  border-radius:14px;padding:14px 16px;font-size:12px;line-height:1.5;backdrop-filter:blur(14px)}
.lab-note h4{margin:0 0 6px;font-size:11px;letter-spacing:.09em;text-transform:uppercase;color:#8f8a82;
  font-family:var(--font-mono);font-weight:500}
.lab-note code{font-family:var(--font-mono);font-size:11px;background:rgba(255,255,255,.1);
  padding:1px 5px;border-radius:4px}
.lab-note details summary{cursor:pointer;color:#8f8a82;margin-top:8px;font-size:11px}
@media (max-width:760px){.lab-note{display:none}}

@media (prefers-reduced-motion:reduce){
  *{animation-duration:.001ms!important;animation-iteration-count:1!important;
    transition-duration:.001ms!important;scroll-behavior:auto!important}
}