/* ch8.css — chapter 8 widgets. --lk-* tokens only. */
.c8-btns{display:flex;gap:.4rem;flex-wrap:wrap;margin:.2rem 0 .8rem}
.c8-btns button,.c8-lane{font-family:var(--lk-utility);font-size:.82rem;font-weight:600;cursor:pointer;padding:.35rem .8rem;border-radius:3px;border:1px solid var(--lk-cobalt);background:var(--lk-paper-light);color:var(--lk-cobalt)}
.c8-btns button[aria-pressed="true"],.c8-lane[aria-pressed="true"]{background:var(--lk-cobalt);color:var(--lk-paper-light)}
.c8-btns button:focus-visible,.c8-lane:focus-visible{outline:2px solid var(--lk-cobalt);outline-offset:2px}
.c8-ctr{grid-template-columns:repeat(auto-fit,minmax(140px,1fr))}
body.lk .c8-check{flex-direction:row;flex-wrap:nowrap;align-items:center;gap:.5rem;align-self:end;grid-column:1 / -1}
.c8-check span{flex:1;min-width:0}
.c8-check input{accent-color:var(--lk-cobalt);width:1rem;height:1rem}
#w-hier .w-out{margin-bottom:.2rem}

/* fragment explorer */
.c8-lanes{display:grid;grid-template-columns:repeat(16,1fr);gap:3px;margin:.2rem 0 .9rem}
.c8-lane{padding:.3rem 0;font-family:var(--lk-mono);font-size:.72rem;text-align:center}
.c8-frags{display:grid;grid-template-columns:2fr 1fr 1fr;gap:1rem;margin-bottom:.8rem;align-items:start}
.c8-ftitle{font:600 .72rem var(--lk-mono);color:var(--lk-ink);margin-bottom:.3rem;min-height:2.2em}
.c8-fgrid{display:grid;gap:1px;background:var(--lk-rule-soft);border:1px solid var(--lk-rule)}
.c8-fc{display:block;aspect-ratio:1;font:.52rem/1 var(--lk-mono);color:var(--lk-rule);background:var(--lk-paper);text-align:center;padding-top:28%;overflow:hidden;transition:background .14s}
.c8-fc.on{background:var(--lk-cobalt);color:var(--lk-paper-light);font-weight:700}
.c8-fB .c8-fc.on{background:var(--lk-forest)}
.c8-fC .c8-fc.on{background:var(--lk-vermilion)}
@media(max-width:640px){
  .c8-lanes{grid-template-columns:repeat(8,1fr)}
  .c8-frags{grid-template-columns:1fr 1fr}
  .c8-fA{grid-column:1 / -1}
  #w-hier .w-out{grid-template-columns:repeat(2,minmax(0,1fr))}
  #w-hier .w-stat .v{font-size:.95rem}
}
@media(prefers-reduced-motion:reduce){.c8-fc{transition:none}}
