.sq .tag{position:absolute;top:2px;right:3px;font-size:12px;font-weight:700;line-height:1;padding:1px 3px;border-radius:4px;background:#c0392b;color:#fff;pointer-events:none}
.sq.frz{box-shadow:inset 0 0 0 4px #5fb7ffcc}
.sq.boom{background-image:radial-gradient(#ff8c1acc,transparent 70%)}
#info{color:var(--muted);font-size:.9rem;min-height:1.2em}
a.back{color:var(--accent);text-decoration:none}
button:disabled{opacity:.4;cursor:default}

/* ---- animation layer (ockit.js + anim.js) ---- */
.ock-d{position:absolute;inset:0;pointer-events:none;z-index:1}
.ock-board .sq .pc{position:relative;z-index:2}
@media (update:none){.ock-board .ock-d,.ock-board .ock-d *,.ock-board .ock-a,.ock-board .ock-a .pc{animation:none!important;transition:none!important}}
#rewind:not(:disabled){animation:ockRwReady 2.4s cubic-bezier(.34,1.56,.64,1) infinite}
@keyframes ockRwReady{0%,70%,100%{transform:none}78%{transform:scale(1.06) rotate(-3deg)}86%{transform:scale(.98) rotate(2deg)}}
@media (update:none){#rewind:not(:disabled){animation:none}}