/* ==========================================================================
   AXI-x Archive v0.1 — the score.                      (extension; not SNX core)
   Reuses the sketchbook's frame rule (sketch.css) for the thumbnail proportion.
   ========================================================================== */
.ar-sheet{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px 8px;margin-top:14px}
.ar-day{appearance:none;border:0;background:transparent;padding:0;margin:0;display:block;width:100%;text-align:left;cursor:pointer;color:var(--snx-ink);font:inherit;container-type:inline-size;min-width:0}
.ar-day .ar-thumb{display:grid;--snx-row:calc(100cqw/var(--snx-union)*var(--sk-rowk));grid-auto-rows:var(--snx-row);border-width:1px}
.ar-day .ar-thumb .snx-b,.ar-day .ar-thumb .snx-o{display:block}
.ar-day .ar-thumb .snx-plane1::after{transform:translate(calc(100cqw/var(--snx-union)),calc(var(--snx-row)*.375))}
/* law 5: the record is flat — plane 0 only unless depth is switched on */
.ar-sheet[data-depth=off] .ar-thumb .snx-plane1::after{display:none}
.ar-sheet[data-depth=off] .ar-thumb .ar-was-glass{opacity:1;mix-blend-mode:normal}
.ar-label{display:block;font-family:var(--snx-mono);font-size:9px;letter-spacing:.06em;color:var(--snx-ink-60);margin-top:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.ar-label b{font-weight:600;color:var(--snx-ink)}
.ar-day[data-era="1"] .ar-label b{color:var(--snx-dusk)}
.ar-day[data-differs] .ar-thumb{outline:2px dashed var(--snx-signal);outline-offset:-2px}
.ar-day[data-verdict=veto] .ar-thumb{opacity:.5}
.ar-day.is-current .ar-thumb{box-shadow:0 0 0 3px var(--snx-paper),0 0 0 5px var(--snx-signal)}
.ar-day:focus-visible{outline:none}
.ar-day:focus-visible .ar-thumb{box-shadow:0 0 0 3px var(--snx-paper),0 0 0 5px var(--snx-signal)}
.ar-key{display:flex;gap:14px 16px;flex-wrap:wrap;font-family:var(--snx-mono);font-size:10px;letter-spacing:.06em;color:var(--snx-ink-60);margin-top:10px}
.ar-key span{display:inline-flex;align-items:center;gap:6px}
.ar-key i{width:14px;height:14px;display:inline-block;border:1px solid var(--snx-ink-18);background:var(--snx-chalk)}
/* the desk and the second desk */
.ar-desks{display:grid;grid-template-columns:1fr;gap:14px;margin-top:14px}
.ar-desks[data-two] {grid-template-columns:1fr 1fr}
@media (max-width:1023px){.ar-desks[data-two]{grid-template-columns:1fr}}
.ar-desk::after{content:attr(data-day) ' · ' attr(data-era) ' · ' attr(data-score);position:absolute;left:5px;top:4px;z-index:8;pointer-events:none;font-family:var(--snx-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--snx-ink-60);background:rgba(251,250,241,.88);padding:2px 5px;white-space:nowrap}
.ar-then::after{content:attr(data-day) ' · as today\'s engine draws it';position:absolute;left:5px;top:4px;z-index:8;pointer-events:none;font-family:var(--snx-mono);font-size:9px;letter-spacing:.08em;text-transform:uppercase;color:var(--snx-ai-deep);background:rgba(251,250,241,.88);padding:2px 5px;white-space:nowrap}
.ar-gridlines{display:none}.reveal .ar-gridlines{display:block}
/* law 6: the crossfade */
::view-transition-old(root),::view-transition-new(root){animation-duration:300ms;animation-timing-function:ease}
::view-transition-group(root){animation-duration:0s}
