.state-preview{overflow:hidden}.state-preview__stage{gap:var(--spacing-md);border-bottom:1px solid var(--line);background:#0003;flex-direction:column;justify-content:center;align-items:center;min-height:320px;display:flex}.state-preview__sprite{aspect-ratio:192/208;background-repeat:no-repeat;width:min(192px,58vw)}.state-preview__direction-label{gap:var(--spacing-sm);color:var(--muted-strong);align-items:baseline;display:flex}.state-preview__direction-label strong{color:var(--fg);font-variant-numeric:tabular-nums}.state-preview__direction-label small{color:var(--muted)}.state-preview__controls{background:var(--line);grid-template-columns:repeat(2,minmax(0,1fr));gap:1px;display:grid}.state-preview__button{padding:var(--spacing-md);background:var(--bg-elevated);color:var(--muted-strong);cursor:pointer;text-align:left;border:0;flex-direction:column;align-items:flex-start;gap:2px;display:flex}.state-preview__button small{color:var(--muted);font-size:12px}.state-preview__button--active{color:var(--fg);background:#ffbe5c24}.state-preview__directions{border-top:1px solid var(--line);background:var(--line);grid-template-columns:repeat(auto-fit,minmax(72px,1fr));gap:1px;display:grid}.state-preview__direction{padding:var(--spacing-sm);background:var(--bg-elevated);color:var(--muted-strong);cursor:pointer;font:inherit;font-variant-numeric:tabular-nums;border:0}.state-preview__direction--active{color:var(--fg);background:#ffbe5c24}