.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 #1cb0f6}
.sq.boom{box-shadow:inset 0 0 0 4px #ff9600;animation:ockBoomPop .5s cubic-bezier(.34,1.56,.64,1)}
@keyframes ockBoomPop{0%{box-shadow:inset 0 0 0 0 #ff9600}50%{box-shadow:inset 0 0 0 9px #ff9600}100%{box-shadow:inset 0 0 0 4px #ff9600}}
@media (update:none){.sq.boom{animation:none}}
#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}}