/* Specimen gauge: logo chips on a depth rail, pinned to the left edge. Cards open on hover, focus and arrival. Hidden on narrow screens where the plate needs the width. */
.gauge{--gh:min(64vh,600px);--chip:clamp(20px,calc(var(--gh) * var(--pitch,.066) - 5px),34px);--rail-x:8px;
  position:absolute;left:max(16px,env(safe-area-inset-left,0px));top:50%;transform:translateY(-50%);width:calc(var(--chip) + var(--rail-x) + 6px);pointer-events:auto}
.g-head,.g-foot{display:flex;justify-content:space-between;gap:10px;font-size:8.5px;letter-spacing:.2em;text-transform:uppercase;color:var(--dim);white-space:nowrap;width:max-content;min-width:100%}
.g-head{margin-bottom:12px}
.g-foot{margin-top:12px}
.g-head b,.g-foot b{font-weight:400;color:var(--lumen);font-variant-numeric:tabular-nums;letter-spacing:.1em}
.g-body{position:relative;height:var(--gh)}

.g-rail{position:absolute;left:0;top:0;bottom:0;width:1px;background:var(--line)}
.g-rail::before{content:"";position:absolute;left:0;top:0;bottom:0;width:6px;
  background:repeating-linear-gradient(to bottom,var(--line) 0 1px,transparent 1px 8px)}
.g-fill{position:absolute;left:-1px;top:0;width:3px;height:0;background:linear-gradient(to bottom,transparent,var(--lumen));box-shadow:0 0 10px var(--lumen)}
.g-mark{position:absolute;left:-5px;width:12px;height:1px;background:var(--lumen);box-shadow:0 0 8px var(--lumen);pointer-events:none}
.g-mark::after{content:"";position:absolute;left:-2px;top:-2px;width:5px;height:5px;border-radius:50%;background:var(--lumen)}

.g-item{position:absolute;left:calc(var(--rail-x) + 6px);display:block;width:var(--chip);height:var(--chip);padding:0;border:0;background:none;cursor:pointer;transform:translateY(-50%);color:var(--dim)}
.g-item::before{content:"";position:absolute;right:100%;top:50%;width:calc(var(--rail-x) + 6px);height:1px;background:var(--line);transition:background .25s,box-shadow .25s}
.g-chip{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;overflow:hidden;
  background:rgba(4,7,10,.72);border:1px solid var(--line-hi);border-radius:9px;
  font-size:11px;font-weight:600;color:var(--acc);
  opacity:.5;filter:saturate(.55);transition:opacity .25s,filter .25s,transform .25s,border-color .25s,box-shadow .25s}
.g-chip img{width:100%;height:100%;padding:3px;object-fit:contain;display:block}
.g-item.past .g-chip{opacity:.78;filter:saturate(.85)}
.g-item:hover .g-chip,.g-item:focus-visible .g-chip{opacity:1;filter:none;transform:scale(1.14);border-color:var(--acc)}
.g-item.on{z-index:2}
.g-item.on .g-chip{opacity:1;filter:none;transform:scale(1.2);border-color:var(--acc);box-shadow:0 0 16px -2px var(--acc),inset 0 0 8px -4px var(--acc)}
.g-item.on::before,.g-item:hover::before,.g-item:focus-visible::before{background:var(--acc);box-shadow:0 0 6px var(--acc)}
.g-item:focus-visible{outline:0}
.g-item:focus-visible .g-chip{outline:1px solid var(--lumen);outline-offset:3px}

.g-card{position:absolute;left:calc(100% + 14px);top:50%;display:flex;flex-direction:column;gap:1px;padding:5px 12px 5px 10px;
  background:var(--glass);border:1px solid var(--line);border-left:2px solid var(--acc);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);
  white-space:nowrap;text-align:left;pointer-events:none;opacity:0;transform:translate(-8px,-50%);transition:opacity .22s,transform .22s}
.g-card b{font-size:11px;font-weight:500;letter-spacing:.06em;color:var(--bone);line-height:1.3}
.g-card small{font-size:8.5px;letter-spacing:.16em;color:var(--dim);font-variant-numeric:tabular-nums;line-height:1.3}
.g-item.on .g-card b{color:var(--acc)}
.g-item:hover,.g-item:focus-visible{z-index:3}
.g-item:hover .g-card,.g-item:focus-visible .g-card,.g-item.on .g-card{opacity:1;transform:translate(0,-50%)}

@media (max-width:760px){.gauge{display:none}}
@media (prefers-reduced-motion:reduce){.g-chip,.g-card,.g-item::before{transition:none}.g-card{transform:translate(0,-50%)}}