.lens{--cap:2.75rem;--stem:1rem;gap:1.75rem;display:grid}.lens-readout{align-items:center;gap:1.25rem;display:flex}.lens-grade{aspect-ratio:1;border-radius:var(--radius-card);inline-size:clamp(5rem,4rem + 3vw,6.5rem);color:var(--on-calm);background:var(--calm);box-shadow:inset 0 2px 0 var(--shine), 0 5px 0 var(--calm-edge);flex:none;align-content:center;place-items:center;gap:.125rem;display:grid}.lens-grade[data-u]{color:var(--ink);background:var(--paper-sunk);box-shadow:inset 0 0 0 2px var(--paper-deep), 0 5px 0 var(--paper-edge)}.lens-grade-label{font-size:var(--text-meta);font-weight:var(--font-weight-bold);line-height:1}.lens-grade-value{font-family:var(--font-display);font-size:var(--text-display);font-weight:var(--font-weight-extrabold);font-variant-numeric:tabular-nums;line-height:1}.lens-facts{gap:.375rem;min-inline-size:0;display:grid}.lens-score{font-family:var(--font-display);font-size:var(--text-headline);font-weight:var(--font-weight-extrabold);font-variant-numeric:tabular-nums;color:var(--ink);line-height:1}.lens-score span{font-family:var(--font-sans);font-size:var(--text-body);font-weight:var(--font-weight-semibold);color:var(--ink-soft)}.lens-next{font-size:var(--text-caption);font-weight:var(--font-weight-semibold);font-variant-numeric:tabular-nums;color:var(--ink-soft);text-wrap:pretty;line-height:1.4}.lens-line{gap:.5rem;display:grid}.lens-pins{block-size:2rem;position:relative}.lens-pin{--lane:0rem;aspect-ratio:1;inline-size:2rem;font-size:var(--text-caption);font-weight:var(--font-weight-bold);font-variant-numeric:tabular-nums;color:var(--calm-ink);background:var(--section-ground,var(--paper));box-shadow:inset 0 0 0 2px var(--calm-wash);cursor:pointer;transition:background-color var(--duration-hover) var(--ease-out), color var(--duration-hover) var(--ease-out);border-radius:.5rem;place-items:center;display:grid;position:absolute;inset-block-end:var(--lane);inset-inline-start:calc(var(--cap) / 2 + (100% - var(--cap)) * var(--at));translate:-50%}.lens-pin:after{content:"";inline-size:2px;block-size:calc(var(--lane) + var(--stem));background:var(--calm);opacity:.45;position:absolute;inset-block-start:100%;inset-inline-start:50%;translate:-50%}.lens-pin[data-reached]{background:var(--calm-wash)}.lens-pin[data-current]{color:var(--on-calm);background:var(--calm);box-shadow:0 3px 0 var(--calm-edge)}.lens-pin[data-current]:after{opacity:1;inline-size:3px}.lens-slider{inline-size:100%}.lens-control{block-size:var(--cap);cursor:grab;touch-action:pan-y;align-items:center;display:flex;position:relative}.lens-slider[data-dragging] .lens-control{cursor:grabbing}.lens-track{border-radius:var(--radius-key);background:var(--paper-sunk);block-size:1.75rem;inline-size:100%;box-shadow:inset 0 0 0 2px var(--paper-deep), inset 0 3px 0 var(--paper-deep);position:relative;overflow:hidden}.lens-fill{inline-size:calc(var(--cap) / 2 + (100% - var(--cap)) * var(--score));border-radius:var(--radius-key);background:var(--ink);box-shadow:inset 0 -3px 0 var(--ink-edge);position:absolute;inset-block:0;inset-inline-start:0}.lens-thumb{inline-size:var(--cap);block-size:var(--cap);border-radius:var(--radius-key);place-items:center;display:grid}.lens-cap{--lift:4px;--edge:var(--gold-edge);inline-size:var(--cap);block-size:var(--cap);border-radius:var(--radius-key);background:var(--gold);grid-auto-flow:column;place-items:center;gap:3px;display:grid}.lens-cap span{background:var(--gold-edge);border-radius:1px;block-size:.75rem;inline-size:2px}.lens-cap span:nth-child(2){block-size:1rem}.lens-slider[data-dragging] .lens-cap{--press:var(--press-depth)}.lens-thumb:has(:focus-visible) .lens-cap{outline:3px solid var(--ink);outline-offset:3px}.lens-scale{padding-inline:calc(var(--cap) / 2 - .25rem);font-size:var(--text-meta);font-weight:var(--font-weight-semibold);font-variant-numeric:tabular-nums;color:var(--ink-soft);justify-content:space-between;display:flex}@media (width<40rem){.lens-readout{gap:1rem}.lens-pins{block-size:4rem}.lens-pin{inline-size:1.75rem}.lens-pin[data-lane="1"]{--lane:2.125rem}}