@layer components{.jh-stage{cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;background:radial-gradient(70% 60% at 50% 62%,#1f2329 0%,#0a0b0d 65%,#000 100%);padding:0}.jh-hud{z-index:2;pointer-events:none;justify-content:space-between;align-items:flex-start;display:flex;position:absolute;top:16px;left:24px;right:24px}.jh-time{letter-spacing:-.03em;font-size:22px;font-weight:600;line-height:1.1}.jh-sub{color:var(--on-dark-dim);margin-top:3px;font-size:13px}.jh-pace{letter-spacing:-.03em;font-size:22px;font-weight:600}.jh-pace span{letter-spacing:0;color:var(--on-dark-dim);font-size:13px;font-weight:500}.jh-count{z-index:2;text-align:center;letter-spacing:-.05em;pointer-events:none;font-size:clamp(60px,13cqh,108px);font-weight:600;line-height:1;position:absolute;top:64px;left:0;right:0}.jh-count span{letter-spacing:-.01em;color:var(--on-dark-dim);font-size:.3em}.jh-count.is-hit{animation:.14s ease-out jh-punch}@keyframes jh-punch{0%{transform:scale(1.12)}}.jh-clock{z-index:2;background:#ffffff14;height:5px;position:absolute;top:0;left:0;right:0}.jh-clock i{background:var(--rn);transform-origin:0;height:100%;display:block}.jh-clock i.is-late{background:#ffb020}.jh-thud{animation:.12s ease-out jh-thud}@keyframes jh-thud{35%{transform:translateY(4px)}}.jh-count.is-done{color:var(--rn);animation:pop .36s var(--ease-pop) both}.jh-scene{pointer-events:none;position:absolute;inset:calc(76px + clamp(60px,13cqh,108px)) 16px 72px}@media (prefers-reduced-motion:reduce){.jh-count.is-hit,.jh-thud,.jh-hammer,.jh-dust{animation:none}}.jh-scene svg{width:100%;height:100%;display:block}.jh-hammer{animation:.11s ease-out jh-hit}@keyframes jh-hit{40%{transform:translateY(12px)}}.jh-dust{animation:jh-dust .52s var(--ease-out) forwards}@keyframes jh-dust{to{transform:translate(var(--dx), var(--dy));opacity:0}}.jh-cue{z-index:2;left:24px;right:24px;bottom:max(28px, calc(env(safe-area-inset-bottom) + 12px));text-align:center;color:var(--on-dark-dim);pointer-events:none;font-size:15px;position:absolute}}