.lab-blog .xb-lab { color:var(--ink); font:15px/1.65 var(--sans); min-width:0; }
.lab-blog .xb-lab * { box-sizing:border-box; }
.lab-blog .xb-variant { position:relative; margin:0 0 82px; min-width:0; scroll-margin-top:76px; }
.lab-blog .xb-variant-heading { display:flex; align-items:baseline; gap:12px; padding:0 0 12px; margin-bottom:18px; border-bottom:3px solid var(--red); }
.lab-blog .xb-variant-number { color:var(--red); font:700 13px/1 var(--mono); }
.lab-blog .xb-variant-heading h2 { margin:0; font:800 23px/1.2 var(--sans); letter-spacing:-.025em; }
.lab-blog .xb-filters { display:flex; flex-wrap:wrap; gap:12px; align-items:flex-end; margin-bottom:18px; }
.lab-blog .xb-field { display:flex; flex:1 1 100px; flex-direction:column; gap:5px; min-width:0; font:12px/1.3 var(--sans); color:var(--muted); }
.lab-blog .xb-field>span { display:block; }
.lab-blog .xb-field select { width:100%; min-width:0; height:40px; padding:6px 6px 6px 10px; border:1px solid var(--rule); border-radius:0; color:var(--ink); background:#292929; font:14px/1.4 var(--sans); }
.lab-blog .xb-title { display:block; width:fit-content; max-width:100%; color:var(--ink); overflow-wrap:anywhere; }
.lab-blog .xb-title:hover { color:#ff6470; }
.lab-blog .xb-lab time { color:var(--muted); font:11px/1.5 var(--mono); white-space:nowrap; }
.lab-blog .xb-tag { font:11px/1.5 var(--sans); overflow-wrap:anywhere; }
.lab-blog .xb-pagination { display:flex; flex-wrap:wrap; gap:12px; justify-content:space-between; align-items:center; margin-top:22px; padding-top:12px; border-top:1px solid var(--rule); }
.lab-blog .xb-result-count { font:12px/1.5 var(--sans); color:var(--muted); }
.lab-blog .xb-page-buttons { display:flex; flex-wrap:wrap; gap:4px; align-items:center; }
.lab-blog .xb-page-buttons button { min-width:32px; min-height:36px; padding:5px 7px; border:1px solid var(--rule); border-radius:0; background:transparent; color:var(--ink); font:12px/1.4 var(--sans); }
.lab-blog .xb-page-buttons button[aria-current=page] { background:var(--red); border-color:var(--red); color:#fff; }
.lab-blog .xb-page-buttons button:disabled { opacity:.35; cursor:default; }
.lab-blog .xb-page-gap { color:var(--muted); padding:0 4px; }
.lab-blog .xb-empty { margin:0; padding:36px 14px; border:1px solid var(--rule); color:var(--muted); font:15px/1.5 var(--sans); }
.lab-blog .xb-lab :is(a,button,select):focus-visible { outline:2px solid var(--red); outline-offset:3px; }
/* The index uses continuous rules; individual articles need no status marker. */
.lab-blog .xb-index .xb-filters { padding:13px; border:1px solid #68585a; border-left:4px solid var(--red); background:#29292a; }
.lab-blog .xb-index-table { position:relative; border:1px solid #68585a; border-top:3px solid var(--red); background:#29292a; }
.lab-blog .xb-index-head,.lab-blog .xb-index-row { display:grid; grid-template-columns:minmax(0,1fr) 91px 92px; gap:10px; padding:13px 12px; }
.lab-blog .xb-index-head { border-bottom:1px solid var(--red); color:#f1949b; font:11px/1.3 var(--sans); }
.lab-blog .xb-index-row { position:relative; border-bottom:1px solid #504749; align-items:start; }
.lab-blog .xb-index-row:last-child { border-bottom:0; }
.lab-blog .xb-index-name .xb-title { font:600 15px/1.65 var(--sans); }
.lab-blog .xb-index-date { padding-top:3px; }
.lab-blog .xb-index-tags { display:flex; flex-wrap:wrap; gap:3px 6px; padding-top:3px; color:var(--muted); }
.lab-blog .xb-index-row:hover { background:#3c3033; }

@media (max-width:430px) {
  .lab-blog .xb-index-head { grid-template-columns:1fr; }
  .lab-blog .xb-index-head span:not(:first-child) { display:none; }
  .lab-blog .xb-index-row { grid-template-columns:minmax(0,1fr) auto; gap:6px 12px; }
  .lab-blog .xb-index-name { grid-column:1/-1; }
  .lab-blog .xb-index-tags { justify-content:flex-end; }
}