body{color:#fff;text-align:center;background:#181c26;margin:0;font-family:Arial,sans-serif}canvas{touch-action:none;background:#f1f5f9;border:2px solid #64748b;max-width:95%;height:auto}#stage{line-height:0;display:inline-block;position:relative;overflow:hidden}#win[hidden]{display:none}#win{pointer-events:none;position:absolute;inset:0}#confetti i{image-rendering:pixelated;box-sizing:border-box;border:2px solid #00000059;animation:linear infinite confetti-fall;position:absolute;top:-30px}@keyframes confetti-fall{0%{transform:translate(0)}to{transform:translate(var(--drift), 680px)}}#banner{color:#1b1b1f;text-transform:uppercase;background:#facc15;border:6px solid #1b1b1f;flex-direction:column;gap:12px;padding:24px 36px;font-family:Courier New,monospace;font-weight:900;line-height:1.1;animation:.6s steps(6,end) both banner-pop;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);box-shadow:8px 8px #1b1b1f,inset 0 0 0 4px #fff7b0}#banner span{letter-spacing:4px;text-shadow:4px 4px #ef4444;font-size:56px}#banner small{font-size:18px}@keyframes banner-pop{0%{transform:translate(-50%,-50%)scale(0)}to{transform:translate(-50%,-50%)scale(1)}}#win.lose #confetti i{border:0;line-height:1}#win.lose #banner{background:#9ca3af;box-shadow:8px 8px #1b1b1f,inset 0 0 0 4px #d1d5db}#win.lose #banner span{text-shadow:4px 4px #7f1d1d}
