.trap-board{transition:box-shadow .32s;position:relative}.trap-board[data-glow=danger]{box-shadow:0 0 0 1px color-mix(in srgb, var(--danger) 55%, transparent), 0 0 42px color-mix(in srgb, var(--danger) 26%, transparent)}.trap-board[data-glow=good]{box-shadow:0 0 0 1px #97a67099,0 0 36px #97a6703d}.trap-board[data-shake="1"]{animation:.26s trap-shake}.trap-flash{z-index:20;pointer-events:none;border:1px solid color-mix(in srgb, var(--danger) 55%, transparent);background:color-mix(in srgb, var(--bg) 86%, transparent);color:var(--danger);letter-spacing:.24em;text-transform:uppercase;white-space:nowrap;padding:.4rem .85rem;font-size:11px;font-weight:600;animation:1.1s forwards trap-flash;position:absolute;top:14%;left:50%}.trap-flash[data-tone=good]{color:#b3c38a;border-color:#97a67099}@keyframes trap-flash{0%{opacity:0;transform:translate(-50%,6px)}18%{opacity:1;transform:translate(-50%)}72%{opacity:1;transform:translate(-50%)}to{opacity:0;transform:translate(-50%,-4px)}}@keyframes trap-shake{0%,to{transform:translate(0)}25%{transform:translate(-5px)}75%{transform:translate(5px)}}@media (prefers-reduced-motion:reduce){.trap-flash{animation-duration:1.6s;animation-timing-function:step-end}.trap-board[data-shake="1"]{animation:none}}.trap-mini{aspect-ratio:1;border:1px solid var(--border);grid-template-columns:repeat(8,1fr);width:100%;display:grid;overflow:hidden}.trap-mini>div{aspect-ratio:1;position:relative}.trap-mini .l{background:var(--board-light)}.trap-mini .d{background:var(--board-dark)}.trap-mini .hl:after{content:"";background:color-mix(in srgb, var(--danger) 38%, transparent);position:absolute;inset:0}.trap-mini.board-neon{border-color:#5eefff80;box-shadow:0 0 14px -4px #5eefff80}.trap-mini.board-neon>div{box-shadow:inset -1px -1px 0 var(--neon-line)}.trap-mini .pc{z-index:1;position:absolute;inset:4%}.trap-move{font-variant-numeric:tabular-nums}.trap-move[data-kind=mistake]{color:var(--danger)}.trap-move[aria-current=step]{background:color-mix(in srgb, var(--accent) 18%, transparent);color:var(--fg);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--accent) 50%, transparent)}.trap-move[aria-current=step][data-kind=mistake]{background:color-mix(in srgb, var(--danger) 16%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb, var(--danger) 55%, transparent);color:var(--danger)}
