:root{--bg: var(--tg-theme-bg-color, #1a1a1a);--fg: var(--tg-theme-text-color, #f2f2f2);--muted: var(--tg-theme-hint-color, #8a8a8a);--accent: var(--tg-theme-button-color, #ef4444);--accent-fg: var(--tg-theme-button-text-color, #ffffff);--section-bg: var(--tg-theme-secondary-bg-color, #232323);--link: var(--tg-theme-link-color, #6ab7ff);--safe-top: env(safe-area-inset-top);--safe-bottom: env(safe-area-inset-bottom)}*{box-sizing:border-box;-webkit-tap-highlight-color:transparent}html,body{margin:0;padding:0;height:100%;background:var(--bg);color:var(--fg);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,system-ui,sans-serif;overscroll-behavior:none}#app{min-height:100%;display:flex;flex-direction:column;padding:calc(var(--safe-top) + .75rem) .75rem calc(var(--safe-bottom) + .75rem);gap:.75rem}header{text-align:center}header h1{margin:0;font-size:1.25rem;letter-spacing:.06em}.subtitle{margin:.15rem 0 0;color:var(--muted);font-size:.75rem}.status{background:var(--section-bg);padding:.6rem .85rem;border-radius:.65rem;font-size:.85rem;text-align:center;font-variant-numeric:tabular-nums}.tempo-bar{display:flex;align-items:center;gap:.6rem;background:var(--section-bg);padding:.45rem .75rem;border-radius:.65rem}.tempo-icon{background:transparent;border:1px solid var(--muted);color:var(--fg);border-radius:.4rem;width:2.1rem;height:2.1rem;font-size:1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:0}.tempo-icon.active{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}.tempo-display{flex:1;text-align:center;font-variant-numeric:tabular-nums;font-size:.95rem;font-weight:600;letter-spacing:.02em}.tempo-tap{background:transparent;border:1px solid var(--muted);color:var(--fg);border-radius:.4rem;padding:.3rem .65rem;font-size:.75rem;cursor:pointer;min-width:3rem}.tempo-tap:active{transform:scale(.95)}.tempo-tap.tapping{background:var(--accent);color:var(--accent-fg);border-color:var(--accent)}.tracks{flex:1;min-height:4rem;position:relative}.tracks-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:.5rem}.tracks-empty{margin:0;padding:1rem .5rem;text-align:center;color:var(--muted);font-size:.85rem;font-style:italic}.track{background:var(--section-bg);border-radius:.6rem;padding:.6rem .75rem;display:flex;align-items:center;gap:.5rem;font-size:.85rem}.track.muted{opacity:.45}.track-name{flex:1;font-weight:500}.track-duration{color:var(--muted);font-size:.75rem;font-variant-numeric:tabular-nums;min-width:2.5rem;text-align:right}.track-btn{background:transparent;border:1px solid var(--muted);color:var(--fg);border-radius:.4rem;padding:.3rem .55rem;font-size:.75rem;cursor:pointer;min-width:2.6rem}.track-btn.danger{border-color:#ef444480;color:#ef4444}.track-btn:active{transform:scale(.96)}.controls{display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.5rem 0}.record-btn{width:5.5rem;height:5.5rem;border-radius:50%;border:none;background:var(--accent);color:var(--accent-fg);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .12s ease,opacity .12s ease;box-shadow:0 6px 24px #0000004d}.record-btn:active{transform:scale(.96)}.record-btn[disabled]{opacity:.5;cursor:not-allowed}.record-btn .dot{display:block;width:1.6rem;height:1.6rem;border-radius:50%;background:var(--accent-fg);transition:border-radius .12s ease}.record-btn.recording .dot{border-radius:.25rem;width:1.4rem;height:1.4rem;animation:pulse 1s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.45}}.hint{margin:0;color:var(--muted);font-size:.8rem;text-align:center}.hint-quiet{font-size:.7rem;opacity:.7}footer{display:flex;flex-direction:column;align-items:stretch;gap:.5rem}.send-btn{background:var(--accent);color:var(--accent-fg);border:none;padding:.85rem 1rem;border-radius:.6rem;font-size:.95rem;font-weight:600;cursor:pointer;transition:opacity .12s ease,transform .12s ease}.send-btn:active{transform:scale(.98)}.send-btn[disabled]{opacity:.4;cursor:not-allowed}.micro{margin:0;text-align:center;color:var(--muted);font-size:.65rem;font-family:ui-monospace,SF Mono,Menlo,monospace}