.tc{position:relative;display:grid;gap:16px;padding:18px;border-radius:16px;border:1px solid hsl(var(--border-subtle,var(--border)));background:radial-gradient(70% 60% at 50% 45%,hsl(var(--primary)/.05),transparent 70%),hsl(var(--background));min-width:0}.tc-top{display:flex;align-items:center;gap:14px}.tc-play{flex:none;width:46px;height:46px;border-radius:50%;border:0;display:grid;place-items:center;cursor:pointer;background:hsl(var(--primary));color:hsl(var(--primary-foreground))}.tc-play svg{width:20px;height:20px}.tc-now{display:grid;gap:5px}.tc-bpm{display:inline-flex;align-items:baseline;gap:6px}.tc-bpm b{display:inline-block;min-width:3ch;font-size:30px;line-height:1;font-weight:700;font-variant-numeric:tabular-nums;color:hsl(var(--text-primary))}.tc-bpm small,.tc-where{font:600 10.5px/1.3 IBM Plex Mono,ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:hsl(var(--text-muted))}.tc-beats{display:inline-flex;gap:6px}.tc-beats i{width:7px;height:7px;border-radius:50%;background:hsl(var(--text-muted)/.35)}.tc-beats i[data-one]{background:hsl(var(--text-muted)/.6)}.tc-beats i[data-lit]{background:hsl(var(--primary));box-shadow:0 0 10px hsl(var(--primary)/.7)}.tc-where{margin-left:auto;display:grid;justify-items:end;gap:4px;font-variant-numeric:tabular-nums}.tc-where span{min-width:9ch;text-align:right}.tc-stair{position:relative;height:150px;border-radius:10px;background:hsl(var(--surface));border:1px solid hsl(var(--border-subtle,var(--border)))}.tc-stair svg{position:absolute;inset:0;width:100%;height:100%;clip-path:inset(0 round 10px)}.tc-fill{fill:hsl(var(--text-muted)/.08)}.tc-line{fill:none;stroke:hsl(var(--text-muted)/.45);stroke-width:2;vector-effect:non-scaling-stroke;stroke-linejoin:round}.tc-fill.is-lit{fill:hsl(var(--primary)/.16)}.tc-line.is-lit{stroke:hsl(var(--primary));stroke-width:2.5}.tc-tag{transform:translate(-50%,calc(-100% - 7px));font:600 11px/1 IBM Plex Mono,ui-monospace,monospace;font-variant-numeric:tabular-nums;color:hsl(var(--text-secondary));pointer-events:none}.tc-dot,.tc-tag{position:absolute}.tc-dot{left:0;top:0;width:14px;height:14px;margin:-7px 0 0 -7px;border-radius:50%;background:hsl(var(--primary));box-shadow:0 0 0 3px hsl(var(--primary)/.25),0 0 16px hsl(var(--primary)/.65);will-change:transform}.tc-set{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px}.tc-word{font-size:14px;font-weight:600;color:hsl(var(--text-secondary))}.tc-nudge{display:inline-flex;align-items:center;gap:8px}.tc-nudge button{width:30px;height:30px;border-radius:50%;border:1px solid hsl(var(--border));background:hsl(var(--surface));font:inherit;font-size:16px;line-height:1;cursor:pointer}.tc-nudge b,.tc-nudge button{color:hsl(var(--text-primary))}.tc-nudge b{min-width:3ch;text-align:center;font-size:17px;font-weight:700;font-variant-numeric:tabular-nums}.tc-mode{display:inline-flex;gap:2px;padding:2px;border-radius:8px;border:1px solid hsl(var(--border));background:hsl(var(--surface))}.tc-mode button{font:inherit;font-size:13px;font-weight:600;padding:5px 12px;border-radius:6px;border:0;background:transparent;color:hsl(var(--text-secondary));cursor:pointer}.tc-mode button[aria-checked=true]{background:hsl(var(--primary)/.16);color:hsl(var(--primary-ink));box-shadow:inset 0 0 0 1px hsl(var(--primary)/.5)}.tc-again{margin-left:auto;font:inherit;font-size:14px;font-weight:700;padding:8px 14px;border-radius:999px;border:1px solid hsl(var(--primary)/.6);background:hsl(var(--primary)/.1);color:hsl(var(--primary-ink));cursor:pointer}.tc-rule{margin-left:auto;font:600 10.5px/1.3 IBM Plex Mono,ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase;color:hsl(var(--text-muted))}.tc button:focus-visible{outline:2px solid hsl(var(--primary));outline-offset:2px}@media (max-width:560px){.tc{padding:14px;gap:14px}.tc-stair{height:120px}.tc-bpm b{font-size:26px}.tc-set{gap:12px 16px}.tc-again,.tc-rule{margin-left:0}}