.player-snapshot{box-sizing:border-box;width:min(980px,100vw);max-width:100vw;height:100dvh;max-height:100dvh;margin:0 0 0 auto;border:0;border-left:1px solid var(--color-border);border-radius:0;padding:var(--space-5);background:var(--color-surface);color:var(--color-text);overflow:auto;box-shadow:var(--shadow-md)}
.player-snapshot::backdrop{background:rgb(8 18 34 / .6)}
.snapshot-header{display:flex;justify-content:space-between;align-items:flex-start;gap:var(--space-4);border-bottom:1px solid var(--color-border);padding-bottom:var(--space-4)}.snapshot-header h2{margin:var(--space-2) 0;font-size:var(--font-h2)}.snapshot-header p,.snapshot-note,.snapshot-direction p,.player-snapshot small{color:var(--color-text-muted);font-size:var(--font-small);line-height:1.5}.snapshot-header>button{flex-shrink:0;font-size:22px}.snapshot-links{display:flex;gap:var(--space-2);flex-wrap:wrap;margin-block:var(--space-4)}.snapshot-metrics{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.snapshot-metric,.snapshot-direction{border:1px solid var(--color-border);border-radius:var(--radius-md);padding:var(--space-3);background:var(--color-surface-raised);min-width:0}.snapshot-metric h4,.snapshot-direction h4{margin:0 0 var(--space-3)}.snapshot-metric>span,.snapshot-metric>small{display:block;font-size:var(--font-small)}.snapshot-metric>strong{display:block;font-size:30px;font-variant-numeric:tabular-nums;color:var(--color-primary-ink)}.snapshot-metric dl{font-size:var(--font-small);margin-bottom:0}.snapshot-metric dl>div{display:flex;justify-content:space-between;gap:var(--space-2);margin-block:var(--space-2)}.snapshot-metric dd{margin:0;font-variant-numeric:tabular-nums}.snapshot-directions{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--space-3)}.snapshot-pair{display:grid;grid-template-columns:1fr auto;gap:var(--space-1);margin-bottom:var(--space-3);font-variant-numeric:tabular-nums}.snapshot-pair small{display:block;text-align:right}.snapshot-pair meter{grid-column:1/-1;width:100%;height:8px;accent-color:var(--color-primary-ink)}.snapshot-direction button{margin-top:var(--space-2)}.player-snapshot section{margin-block:var(--space-5)}.snapshot-selected{max-width:280px;margin:var(--space-4) auto}.snapshot-selected svg{display:block;max-height:290px;width:100%}.snapshot-recent table{min-width:780px}.snapshot-recent .explorer-raw{max-width:110px}.player-snapshot :focus-visible{outline:3px solid var(--color-focus);outline-offset:2px}#snapshotStatus:empty{display:none}
@media(max-width:700px){.player-snapshot{width:100%;padding:var(--space-3)}.snapshot-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}.snapshot-directions{grid-template-columns:1fr}.snapshot-header h2{font-size:20px}.snapshot-metric>strong{font-size:26px}.snapshot-recent{max-width:100%}}