:root{--font-mono: "Share Tech Mono", ui-monospace, "SF Mono", Menlo, monospace;--font-body: "Barlow", system-ui, -apple-system, "Helvetica Neue", sans-serif}*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}body,html{background:#0f0f0f;color:#e8e8e8;font-family:var(--font-body);height:100%;overflow:hidden;-webkit-text-size-adjust:100%;text-size-adjust:100%}.app{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f0f0f;color:#e8e8e8;display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding-left:1.5rem;padding-right:1.5rem;padding-top:max(1rem,env(safe-area-inset-top));padding-bottom:.5rem;gap:.75rem;user-select:none;-webkit-user-select:none;overflow:clip}@media (hover: none) and (pointer: coarse){.browser-mode .app{padding-bottom:max(.75rem,env(safe-area-inset-bottom))}}@media (hover: none) and (pointer: coarse) and (max-width: 767px){.browser-mode .app{gap:.4rem}.browser-mode .controls{gap:.3rem}.browser-mode .controls-grid{row-gap:.6rem}.browser-mode .display{padding:.3rem 1rem}}@media (max-height: 840px) and (max-width: 767px){.app{gap:.4rem;padding-top:max(.5rem,env(safe-area-inset-top))}.app-header{margin-bottom:0}.display{padding:.6rem 1rem .5rem}.section-grid{gap:.4rem 1.5rem}.controls{gap:.4rem}.btn-row{margin-top:.25rem}.version-footer{margin-top:.1rem}}@media (max-height: 750px) and (max-width: 767px){.app{gap:.25rem}.display{padding:.4rem 1rem}.section-grid{gap:.3rem 1.5rem}.controls{gap:.25rem}.section-divider{margin:.1rem 0}}.app-header{display:flex;flex-direction:column;align-items:center;width:100%;max-width:440px;margin-bottom:.1rem}.app-header-row{display:flex;align-items:center;width:100%}.app-header-text{flex:1;text-align:center}.app-header-spacer{width:32px;flex-shrink:0}.app-title{font-family:var(--font-mono);font-size:1.1rem;letter-spacing:.2em;text-transform:uppercase;color:#f5c842;text-align:center}.app-subtitle{font-family:var(--font-mono);font-size:.55rem;letter-spacing:.1em;text-transform:uppercase;color:#888;text-align:center}.display{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:.5rem;width:100%;max-width:440px;flex:1 1 0;min-height:178px;background:#1a1a1a;border:1px solid #2a2a2a;border-radius:4px;padding:1rem 1rem .75rem;position:relative}.exercise-label{font-size:.75rem;letter-spacing:.25em;text-transform:uppercase;color:#aaa;font-family:var(--font-mono);min-height:1em;animation:label-fade-in .2s ease}@keyframes label-fade-in{0%{opacity:0}to{opacity:1}}.exercise-label--set{color:#f5c842}.exercise-number{font-family:var(--font-mono);font-size:clamp(5rem,18vw,8rem);line-height:1;color:#f5c842;font-weight:700;text-shadow:0 0 30px rgba(245,200,66,.3);transition:color .15s,text-shadow .15s,transform .15s;min-width:3ch;text-align:center;transform:scale(1)}.exercise-number.flash{color:#ccc;text-shadow:0 0 40px rgba(200,200,200,.4);transform:scale(1.06)}.exercise-number.idle{color:#444;text-shadow:none}.exercise-number.looping{color:#f5c842;text-shadow:0 0 30px rgba(245,200,66,.3)}.exercise-number.done{color:#4caf7d;text-shadow:0 0 30px rgba(76,175,125,.3);font-size:clamp(1.5rem,5vw,2.2rem);letter-spacing:.1em;text-transform:lowercase}.next-exercise{font-family:var(--font-mono);font-size:clamp(1.4rem,5vw,2rem);color:#ccc;letter-spacing:.05em;min-height:1.2em;text-align:center;transition:opacity .6s ease}.next-exercise .next-label{font-size:.6em;color:#888;letter-spacing:.2em;text-transform:uppercase;margin-right:.3em}.status-label{font-size:.6em;color:#444;letter-spacing:.2em;text-transform:uppercase;font-family:Share Tech Mono,monospace}.status-label--dim{color:#555}.countdown-display{font-family:var(--font-mono);font-size:clamp(5rem,18vw,8rem);line-height:1;color:#ff4500;text-shadow:0 0 40px rgba(255,69,0,.3);min-width:3ch;text-align:center}.idle-summary{font-family:var(--font-mono);font-size:.7rem;letter-spacing:.1em;color:#777;text-align:center;padding:.4rem 0 .2rem;min-height:1.2em;display:-webkit-box;-webkit-line-clamp:2;line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.beat-dots{display:flex;gap:.6rem;margin-top:.3rem;flex-wrap:wrap;justify-content:center;max-width:320px}.beat-dot{width:9px;height:9px;border-radius:50%;background:#555;transition:background .05s}.beat-dot.inactive{background:#555}.beat-dot.active{background:#ff4500}.beat-dot.beat1.active{background:#fff}.bar-progress{display:flex;gap:4px;margin-top:.3rem}.bar-block{height:5px;background:#555;border-radius:2px;transition:background .1s}.bar-block.done{background:#888}.bar-block.current{background:#f5c842}.bar-block.loop-current{background:#f5c842;opacity:.5}.bar-block.countin-done{background:#7a2200}.bar-block.countin-current{background:#ff4500}.bar-progress-continuous{display:flex;align-items:center;gap:8px;margin-top:.3rem}.bar-progress-track{width:192px;height:5px;background:#555;border-radius:2px;overflow:hidden;flex-shrink:0}.bar-progress-fill{height:100%;border-radius:2px;background:#f5c842;transition:width .15s}.bar-progress-fill.loop{opacity:.5}.bar-progress-counter{font-family:var(--font-mono);font-size:.6rem;letter-spacing:.08em;color:#555;white-space:nowrap}.bar-progress-counter.near-end{color:#f5c842}.controls{display:flex;flex-direction:column;gap:.4rem;width:100%;max-width:440px}.section-divider{width:100%;height:1px;background:#1e1e1e;margin:.15rem 0}.section-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:.4rem 1.5rem}.controls-grid{grid-template-columns:repeat(3,1fr);column-gap:.75rem;row-gap:1rem}@media (max-width: 767px){.controls-grid{grid-template-columns:1fr 1fr}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.controls-grid{grid-template-columns:1fr 1fr}}@media (max-width: 380px){.sel-btn{font-size:.65rem;letter-spacing:.02em}}.control-group{display:flex;flex-direction:column;gap:.3rem;min-width:0}.control-group.full-width{grid-column:1 / -1}.control-group label{font-size:.6rem;letter-spacing:.15em;text-transform:uppercase;color:#888;font-family:var(--font-mono)}.control-group.secondary label{color:#888}.control-group.dimmed label{opacity:.5}.bpm-widget{display:flex;align-items:center;height:44px}.bpm-btn{width:44px;height:44px;background:#1a1a1a;border:1px solid #333;color:#ccc;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;transition:background .1s,color .1s;flex-shrink:0;font-family:var(--font-mono)}.bpm-btn:active{background:#2a2a2a;color:#fff}.bpm-btn:disabled{opacity:.25;cursor:default}.bpm-btn.left{border-right:none;border-radius:4px 0 0 4px}.bpm-btn.right{border-left:none;border-radius:0 4px 4px 0}.bpm-tap{flex:1;height:44px;background:#1a1a1a;border:1px solid #333;color:#f5c842;font-family:var(--font-mono);font-size:1rem;text-align:center;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;transition:background .08s;min-width:40px}.bpm-tap:active{background:#252525}.bpm-tap.tapped{background:#222}.bpm-tap-label{font-size:.5rem;color:#555;letter-spacing:.08em;-webkit-user-select:none;user-select:none}.bpm-tap *{-webkit-user-select:none;user-select:none}.stepper{display:flex;align-items:center;height:44px}.stepper-btn{width:44px;height:44px;background:#1a1a1a;border:1px solid #333;color:#ccc;font-size:1.2rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;transition:background .1s;flex-shrink:0;font-family:var(--font-mono)}.stepper-btn:active{background:#2a2a2a;color:#fff}.stepper-btn:disabled{opacity:.25;cursor:default}.stepper-btn.left{border-right:none;border-radius:4px 0 0 4px}.stepper-btn.right{border-left:none;border-radius:0 4px 4px 0}.stepper-val{flex:1;height:44px;background:#1a1a1a;border:1px solid #333;border-left:none;border-right:none;color:#e8e8e8;font-family:var(--font-mono);font-size:1rem;text-align:center;display:flex;align-items:center;justify-content:center;min-width:40px}.range-row{display:flex;align-items:center;gap:.5rem;width:100%}.range-row input{flex:1;min-width:0;height:44px;background:#1a1a1a;border:1px solid #333;color:#e8e8e8;font-family:var(--font-mono);font-size:1rem;padding:.4rem .5rem;text-align:center;border-radius:4px}.range-row input:focus{outline:none}.range-row input[readonly]{cursor:pointer}.range-row input[readonly]:active{border-color:#f5c842}.range-row input.invalid,.pick-trigger-btn.invalid{border-color:#a33}.range-row input:disabled{opacity:.25;cursor:default}.range-row span{font-size:.7rem;color:#777}.selector-row{display:flex;gap:.4rem;flex-wrap:nowrap}.sel-btn{background:#1a1a1a;border:1px solid #333;color:#bbb;font-family:var(--font-mono);font-size:.75rem;padding:0 .65rem;cursor:pointer;transition:all .1s;letter-spacing:.05em;height:44px;border-radius:4px;display:flex;align-items:center;justify-content:center;flex:1}.sel-btn:active{background:#252525}.sel-btn.active{background:#1e1e1e;border-color:#ff4500;color:#ff4500}.sel-btn:disabled{opacity:.25;cursor:default}.subdiv-group{grid-column:1 / -1}@media (max-width: 767px){.subdiv-group{grid-column:auto}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.subdiv-group{grid-column:auto}}.subdiv-btn{padding:0}.subdiv-svg{display:block;overflow:visible;color:inherit;width:auto;height:22px}.check-row{display:flex;align-items:center;gap:.5rem}.check-row span{font-size:.75rem;color:#aaa;font-family:var(--font-mono)}.check-row.disabled{opacity:.25}.countin-row{display:flex;flex-direction:column;gap:.3rem}input[type=range]{flex:1;-webkit-appearance:none;-moz-appearance:none;appearance:none;height:6px;background:#333;border-radius:3px;outline:none;padding:8px 0}input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:28px;height:28px;border-radius:50%;background:#f5c842;cursor:pointer}input[type=range]::-moz-range-thumb{width:28px;height:28px;border-radius:50%;background:#f5c842;cursor:pointer;border:none}.vol-wrap{display:flex;align-self:stretch}.vol-label-btn{display:flex;align-items:center;gap:.4rem;background:#1e1e1e;border:1px solid #444;color:#bbb;padding:0 .75rem;border-radius:8px;cursor:pointer;transition:background .1s;flex-shrink:0;font-family:var(--font-mono);font-size:.65rem;letter-spacing:.1em;text-transform:uppercase;width:100%}.vol-label-btn:active{background:#2a2a2a;color:#fff}.vol-label-btn.active{border-color:#f5c842;color:#f5c842}.vol-slider-row{display:flex;align-items:center;gap:.6rem;width:100%;max-width:440px;position:absolute;bottom:100%;left:0;background:#1a1a1a;border:1px solid #333;border-radius:8px;padding:.75rem 1rem;margin-bottom:.4rem;z-index:10}.vol-slider-row span{font-family:var(--font-mono);font-size:.65rem;color:#777;letter-spacing:.1em;text-transform:uppercase;white-space:nowrap}.btn-row{display:flex;gap:.5rem;width:100%;max-width:440px;margin-top:1rem;position:relative}.btn-group{display:flex;gap:.5rem;flex:1}.btn-group-stop{display:flex}.action-btn{flex:1;padding:1rem;font-family:var(--font-mono);font-size:.85rem;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;transition:background .15s,color .15s,border-color .15s;border:1px solid #f5c842;border-radius:8px;background:#f5c842;color:#0f0f0f}.action-btn:active{background:#d4aa30;border-color:#d4aa30}.action-btn.secondary{background:#1e1e1e;border-color:#444;color:#bbb}.action-btn.secondary:active{background:#2a2a2a;color:#fff;border-color:#666}.action-btn.pause-active{background:#1e1e1e;border-color:#ccc;color:#ccc}.action-btn.pause-active:active{background:#2a2a2a;border-color:#fff;color:#fff}.action-btn.stop{background:#1e1e1e;border-color:#7a2200;color:#c44}.action-btn.stop:active{background:#2a2a2a;color:#ff4500;border-color:#ff4500}.action-btn.loop-active{border-color:#f5c842;color:#0f0f0f;background:#f5c842}.action-btn.loop-active:active{background:#d4aa30;border-color:#d4aa30}.action-btn:disabled{opacity:.3;cursor:default}.error-msg{font-size:.7rem;color:#ff4500;font-family:var(--font-mono);letter-spacing:.1em}.version-footer{font-family:var(--font-mono);font-size:.5rem;color:#444;letter-spacing:.15em;margin-top:auto}.rotate-overlay{display:none;position:fixed;top:0;right:0;bottom:0;left:0;background:#0f0f0f;z-index:200;align-items:center;justify-content:center;flex-direction:column;gap:1rem}.rotate-overlay p{font-family:var(--font-mono);font-size:.75rem;color:#666;letter-spacing:.15em;text-transform:uppercase;text-align:center}@media (max-height: 500px) and (max-width: 900px){.rotate-overlay{display:flex}}.help-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0f0f0f;z-index:100;display:flex;align-items:flex-start;justify-content:center;padding:max(2rem,env(safe-area-inset-top)) 1.5rem max(2rem,env(safe-area-inset-bottom));overflow-y:auto;-webkit-overflow-scrolling:touch}.help-content{max-width:400px;width:100%;display:flex;flex-direction:column;gap:1rem}.help-scroll-fade{position:fixed;bottom:0;left:0;right:0;height:80px;background:linear-gradient(to bottom,transparent,#0f0f0f);pointer-events:none;z-index:101;transition:opacity .3s}.help-close-x{align-self:flex-end;background:#1e1e1e;border:1px solid #555;border-radius:4px;color:#aaa;font-family:var(--font-mono);font-size:.85rem;cursor:pointer;padding:.4rem .7rem;line-height:1}.help-close-x:active{color:#fff;border-color:#888;background:#2a2a2a}.help-close-bottom{display:none;align-self:center;margin-top:.5rem;background:#1e1e1e;border:1px solid #555;border-radius:4px;color:#aaa;font-family:var(--font-mono);font-size:.65rem;letter-spacing:.2em;text-transform:uppercase;cursor:pointer;padding:.6rem 1.5rem;position:relative;z-index:102}.help-close-bottom:active{color:#fff;border-color:#888;background:#2a2a2a}@media (hover: none) and (pointer: coarse) and (min-width: 768px){.help-content{max-width:640px!important;gap:1.25rem!important}.help-title{font-size:1.1rem!important}.help-section h3{font-size:1rem!important}.help-section p,.help-section ul{font-size:1.05rem!important;line-height:1.7!important}}.help-title{font-family:var(--font-mono);font-size:1.1rem;letter-spacing:.2em;text-transform:uppercase;color:#f5c842}.help-section{display:flex;flex-direction:column;gap:.3rem}.help-section h3{font-family:var(--font-mono);font-size:.85rem;letter-spacing:.15em;text-transform:uppercase;color:#ff4500;font-weight:400}.help-section p,.help-section ul{font-family:var(--font-mono);font-size:.9rem;color:#888;line-height:1.6;letter-spacing:.03em}.help-section li{margin-bottom:.4rem}.help-section li:last-child{margin-bottom:0}.help-section a{color:#aaa}.help-section-support a{color:#f5c842}.settings-menu-wrap{position:relative;width:32px;flex-shrink:0;display:flex;align-items:center}.settings-menu-btn{background:none;border:none;color:#666;font-family:var(--font-body);font-size:1.3rem;cursor:pointer;padding:0;letter-spacing:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.settings-menu-btn:active{color:#aaa}.settings-menu-panel{position:absolute;top:calc(100% + .4rem);right:0;background:#1a1a1a;border:1px solid #333;border-radius:4px;min-width:190px;z-index:50;overflow:hidden}.settings-menu-item{display:block;width:100%;padding:.75rem .9rem;background:none;border:none;border-bottom:1px solid #222;color:#ccc;font-family:var(--font-mono);font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;cursor:pointer;text-align:left}.settings-menu-item:last-child{border-bottom:none}.settings-menu-item:active{background:#222}.settings-menu-item--help{border-bottom:2px solid #333!important}.settings-menu-item--destructive{color:#a04040}@keyframes pulse-amber{0%,to{color:#666}50%{color:#f5c842}}.settings-menu-btn-pulse{animation:pulse-amber 2s ease-in-out infinite}@media (hover: none) and (pointer: coarse) and (min-width: 768px) and (min-height: 700px){.app{background:#0f0f0f!important}.app-header{max-width:700px!important}.app-title{font-size:1.8rem}.app-subtitle{font-size:.7rem}.display,.controls,.btn-row,.vol-slider-row{max-width:700px!important}.sel-btn,.compact-sel-btn{height:52px;font-size:.9rem}.range-row input,.bpm-widget{height:52px}.bpm-btn{width:52px;height:52px;font-size:1.3rem}.bpm-tap{height:52px;font-size:1.1rem}.stepper{height:52px}.stepper-btn{width:52px;height:52px;font-size:1.3rem}.stepper-val{height:52px;font-size:1.1rem}.action-btn{padding:1.1rem;font-size:.95rem}.help-close-bottom{font-size:.85rem;padding:.8rem 2.5rem}.check-row,.check-row span{font-size:.95rem}.check-row input{width:20px!important;height:20px!important}.control-group label{font-size:.7rem}.idle-summary{font-size:.85rem}.version-footer{font-size:.6rem}.beat-dots{max-width:none}}@media (hover: none) and (pointer: coarse) and (min-width: 900px) and (min-height: 600px) and (orientation: landscape){.app{justify-content:space-evenly;padding:1.5rem 2rem;gap:.75rem}.display{min-height:18dvh}.controls{gap:.9rem}.controls-grid{column-gap:.5rem}.section-grid{gap:.7rem 1.5rem}.idle-summary{font-size:.85rem}.bpm-btn,.stepper-btn{width:40px}}@media (hover: none) and (pointer: coarse) and (min-width: 768px) and (min-height: 700px) and (orientation: portrait){.app{justify-content:flex-start;padding:1.5dvh 2.5rem;gap:1dvh}.display{min-height:26dvh;flex:1!important;gap:1rem}.app-title{font-size:2rem!important}.controls{gap:1dvh}.section-grid{gap:.9dvh 1.5rem}.section-divider{margin:.5dvh 0}.btn-row{margin-top:1.2dvh}.exercise-label{font-size:.8rem}.exercise-number{font-size:clamp(7rem,12dvh,12rem)}.exercise-number.done{font-size:clamp(1.8rem,3dvh,3rem)}.countdown-display{font-size:clamp(7rem,12dvh,12rem)}.next-exercise{font-size:clamp(2rem,2.8dvh,3.2rem)}.idle-summary{font-size:1rem}.beat-dot{width:11px;height:11px}.bar-block,.bar-progress-track{height:7px;border-radius:3px}.bar-progress-fill{height:7px}.bar-progress-counter{font-size:clamp(.75rem,1.4dvh,1.1rem)}.help-overlay{padding-top:max(3.5rem,env(safe-area-inset-top))}.control-group label{font-size:.7rem}.check-row span{font-size:1rem}.sel-btn,.compact-sel-btn,.range-row input,.bpm-widget{height:58px}.bpm-btn{width:58px;height:58px}.bpm-tap,.stepper{height:58px}.stepper-btn{width:58px;height:58px}.stepper-val{height:58px}}@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait){.app-header,.display,.controls,.btn-row,.vol-slider-row{max-width:640px}}@media (hover: hover) and (min-width: 1024px){.app{padding-bottom:.6rem}.help-overlay{padding-top:3.5rem}.help-content,.app-header{max-width:560px}.app-subtitle{font-size:.6rem}.display,.controls,.btn-row,.vol-slider-row{max-width:560px}.control-group label{font-size:.72rem}.idle-summary{font-size:.8rem}.check-row span{font-size:.85rem}.version-footer{font-size:.6rem}.exercise-number,.countdown-display{font-size:clamp(4rem,10vw,6rem)}.bpm-btn:hover{background:#252525;color:#fff}.bpm-tap:hover{background:#212121}.stepper-btn:hover{background:#252525;color:#fff}.sel-btn:hover:not(:disabled){background:#252525;color:#ccc}.compact-sel-btn:hover:not(:disabled){background:#252525;color:#ccc}.action-btn:hover:not(:disabled){filter:brightness(1.08)}.vol-label-btn:hover{background:#252525}.pick-trigger-btn:hover:not(:disabled){background:#252525;border-color:#555}.ex-mode-btn:hover:not(:disabled):not(.active){background:#252525;color:#888}}@media (hover: hover) and (min-width: 1440px){.app-header,.display,.controls,.btn-row,.vol-slider-row{max-width:700px}.exercise-number,.countdown-display{font-size:clamp(5rem,8vw,8rem)}.next-exercise{font-size:clamp(1.4rem,2.5vw,2.4rem)}.idle-summary{font-size:.9rem}}.compact-sel-btn{background:#1a1a1a;border:1px solid #333;color:#ccc;font-family:var(--font-mono);font-size:.75rem;padding:0 .75rem;cursor:pointer;transition:all .1s;letter-spacing:.05em;height:44px;border-radius:4px;display:flex;align-items:center;white-space:nowrap;width:100%;min-width:0;justify-content:center}.compact-sel-btn:active{background:#252525}.compact-sel-btn.open{border-color:#f5c842;color:#f5c842}.compact-sel-btn:disabled{opacity:.25;cursor:default}.compact-popup{position:fixed;background:#1c1c1c;border:1px solid #383838;box-shadow:0 -4px 16px #0009;display:flex;flex-wrap:wrap;gap:.4rem;padding:.5rem;z-index:50;border-radius:4px}.compact-popup-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:49;background:#0006}.bpm-widget-row{display:flex;align-items:center;gap:.4rem;width:100%}.bpm-widget-row .bpm-widget{flex:1}.gear-visible .bpm-widget-row{gap:2px}.gear-visible .bpm-btn.right{border-radius:0 4px 4px 0}.bpm-timesig-row{display:flex;gap:.75rem;grid-column:1 / -1}.bpm-timesig-row .bpm-group,.bpm-timesig-row .timesig-group{flex:1;min-width:0}.bpm-timesig-row.gear-visible .bpm-group{flex:3}.bpm-timesig-row.gear-visible .timesig-group{flex:2}@media (min-width: 768px){.bpm-timesig-row{display:contents}.bpm-timesig-row .bpm-group,.bpm-timesig-row .timesig-group{min-width:0}}.bpm-gear-btn{width:36px;height:44px;flex-shrink:0;background:#1a1a1a;border:1px solid #333;color:#777;font-size:1.25rem;line-height:1;cursor:pointer;border-radius:4px;display:flex;align-items:center;justify-content:center;transition:background .1s,color .1s}.bpm-gear-btn:active{background:#2a2a2a}.bpm-gear-btn.active{border-color:#f5c842;color:#f5c842}.bpm-auto-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:49}.bpm-auto-popup{position:fixed;z-index:50;background:#1c1c1c;border:1px solid #383838;box-shadow:0 -4px 16px #0009;border-radius:6px;padding:.9rem;display:flex;flex-direction:column;gap:.8rem;min-width:240px}.bpm-auto-row{display:flex;align-items:center;gap:.4rem;flex-wrap:nowrap}.bpm-auto-label{font-size:.65rem;color:#888;white-space:nowrap;min-width:28px}.bpm-auto-stepper{display:flex;align-items:center;height:32px}.bpm-auto-step-btn{width:32px;height:32px;background:#1a1a1a;border:1px solid #333;color:#ccc;font-size:1.1rem;cursor:pointer;display:flex;align-items:center;justify-content:center;-webkit-user-select:none;user-select:none;transition:background .1s;flex-shrink:0;font-family:var(--font-mono)}.bpm-auto-step-btn:active{background:#2a2a2a;color:#fff}.bpm-auto-step-btn.left{border-right:none;border-radius:4px 0 0 4px}.bpm-auto-step-btn.right{border-left:none;border-radius:0 4px 4px 0}.bpm-auto-step-val{min-width:32px;height:32px;background:#1a1a1a;border:1px solid #333;border-left:none;border-right:none;color:#e8e8e8;font-family:var(--font-mono);font-size:.85rem;text-align:center;display:flex;align-items:center;justify-content:center}.bpm-auto-unit-row{display:flex;gap:.3rem}.bpm-auto-unit-row .sel-btn{height:32px;font-size:.65rem;min-width:40px;flex:1}.bpm-auto-master-toggle{width:100%;padding:.45rem .6rem;background:#1a1a1a;border:1px solid #444;border-radius:4px;color:#bbb;font-family:var(--font-mono);font-size:.8rem;cursor:pointer;text-align:center;transition:background .1s,border-color .1s,color .1s}.bpm-auto-master-toggle:active{background:#252525}.bpm-auto-master-toggle.active{border-color:#f5c842;color:#f5c842;background:#1e1c12}.bpm-auto-inner{display:flex;flex-direction:column;gap:.6rem}.bpm-auto-disabled{opacity:.35;pointer-events:none;display:flex;flex-direction:column;gap:.6rem}.bpm-auto-trigger-label{font-size:.6rem;color:#555;text-align:center;letter-spacing:.06em;padding:.1rem 0;margin-bottom:-.4rem}.bpm-auto-secondary{border-top:1px solid #2a2a2a;padding-top:.6rem}.bpm-auto-random-toggle{background:none;border:none;color:#555;font-family:var(--font-mono);font-size:.65rem;cursor:pointer;padding:.2rem 0;text-align:left;transition:color .1s}.bpm-auto-random-toggle:active{color:#888}.bpm-auto-random-toggle.active{color:#bbb}@media (hover: none) and (pointer: coarse) and (min-width: 768px) and (min-height: 700px){.compact-sel-btn{height:52px;font-size:.9rem}}@media (hover: none) and (pointer: coarse) and (min-width: 768px) and (min-height: 700px) and (orientation: portrait){.compact-sel-btn{height:58px}}.numpad-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;z-index:59;background:#00000080}.numpad-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:60;background:#1c1c1c;border:1px solid #383838;border-radius:10px;padding:1rem;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 8px 32px #000c;min-width:min(280px,88vw)}.numpad-header{font-family:var(--font-body);font-size:.65rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase;color:#666;text-align:center}.numpad-display{font-family:var(--font-mono);font-size:2.2rem;color:#f5c842;text-align:center;min-height:3rem;background:#141414;border:1px solid #2a2a2a;border-radius:6px;display:flex;align-items:center;justify-content:center;letter-spacing:.05em}.numpad-display.empty{color:#444}.numpad-display.placeholder{color:#555}.numpad-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:.35rem}.letterpad-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:.25rem;margin-bottom:.4rem}.letter-key{font-size:.85rem!important}.numpad-key{height:52px;background:#252525;border:1px solid #333;color:#ccc;font-family:var(--font-mono);font-size:1.2rem;border-radius:5px;cursor:pointer;display:flex;align-items:center;justify-content:center;user-select:none;-webkit-user-select:none}.numpad-key:active{background:#383838;color:#fff;border-color:#555}.numpad-key.fn{color:#777;font-size:1rem;font-family:var(--font-body)}.numpad-actions{display:flex;gap:.4rem}.numpad-cancel{flex:1;height:46px;background:#1c1c1c;border:1px solid #383838;color:#888;font-family:var(--font-body);font-size:.85rem;border-radius:5px;cursor:pointer}.numpad-cancel:active{background:#2a2a2a;color:#ccc}.numpad-ok{flex:2;height:46px;background:#f5c842;border:1px solid #f5c842;color:#0f0f0f;font-family:var(--font-body);font-size:.9rem;font-weight:600;border-radius:5px;cursor:pointer}.numpad-ok:active{background:#d4ac38}.numpad-ok:disabled{opacity:.3;cursor:default}.app-toast{position:absolute;bottom:.5rem;left:0;right:0;text-align:center;font-family:var(--font-mono);font-size:.65rem;letter-spacing:.1em;color:#f5c842;pointer-events:none;animation:appToastFade 1.8s ease forwards}@keyframes appToastFade{0%{opacity:1}60%{opacity:1}to{opacity:0}}.letter-mode-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:60;background:#1c1c1c;border:1px solid #383838;border-radius:10px;padding:1.4rem 1.2rem 1rem;display:flex;flex-direction:column;gap:.7rem;width:min(320px,calc(100vw - 2.5rem));text-align:center}.letter-mode-popup-title{font-family:var(--font-mono);font-size:1.1rem;color:#f5c842;letter-spacing:.03em}.letter-mode-popup-body{font-family:var(--font-body);font-size:.85rem;color:#aaa;line-height:1.5}.letter-mode-popup-ok{height:44px;background:#f5c842;border:none;color:#0f0f0f;font-family:var(--font-body);font-size:.9rem;font-weight:600;border-radius:5px;cursor:pointer;margin-top:.2rem}.letter-mode-popup-ok:active{background:#e0b530}.picker-popup{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);z-index:60;background:#1c1c1c;border:1px solid #383838;border-radius:10px;padding:1rem;display:flex;flex-direction:column;gap:.6rem;box-shadow:0 8px 32px #000c;min-width:min(280px,88vw);max-height:90vh;overflow-y:auto}.picker-chips{display:flex;flex-wrap:wrap;gap:.3rem;min-height:2.2rem;padding:.4rem;background:#141414;border:1px solid #2a2a2a;border-radius:6px}.picker-chips-empty{color:#444;font-family:var(--font-body);font-size:.75rem;display:flex;align-items:center}.picker-chip{background:#2a2a2a;border:1px solid #f5c842;color:#f5c842;font-family:var(--font-mono);font-size:.8rem;padding:.2rem .45rem;border-radius:4px;cursor:pointer;user-select:none;-webkit-user-select:none}.picker-chip:active{background:#3a3210;border-color:#ff4500;color:#ff4500}.picker-divider{height:1px;background:#2a2a2a}.picker-add-btn{height:46px;background:#252525;border:1px solid #383838;color:#ccc;font-family:var(--font-body);font-size:.85rem;border-radius:5px;cursor:pointer}.picker-add-btn:active{background:#383838;color:#fff}.picker-add-btn:disabled{opacity:.25;cursor:default}.picker-done-btn{height:46px;background:#f5c842;border:1px solid #f5c842;color:#0f0f0f;font-family:var(--font-body);font-size:.9rem;font-weight:600;border-radius:5px;cursor:pointer}.picker-done-btn:active{background:#d4ac38}.ex-control-row{display:flex;gap:.5rem;align-items:stretch;width:100%}.ex-control-row .range-row{flex:1;width:auto;min-width:0;margin:0}.ex-control-row .pick-trigger-btn{flex:1}.ex-mode-toggle{display:flex;flex-direction:column;flex-shrink:0;width:46px;height:44px;border-radius:4px;overflow:hidden;border:1px solid #2a2a2a}.ex-mode-btn{flex:1;background:#1c1c1c;border:none;color:#555;font-family:var(--font-body);font-size:.6rem;font-weight:600;letter-spacing:.04em;cursor:pointer;line-height:1}.ex-mode-btn+.ex-mode-btn{border-top:1px solid #2a2a2a}.ex-mode-btn.active{background:#252525;color:#f5c842}.ex-mode-btn:disabled{opacity:.3;cursor:default}.pick-trigger-btn{width:100%;height:44px;background:#1c1c1c;border:1px solid #2a2a2a;color:#ccc;font-family:var(--font-mono);font-size:.85rem;border-radius:5px;cursor:pointer;text-align:center;padding:0 .5rem;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.pick-trigger-btn:active{background:#252525;border-color:#f5c842}.pick-trigger-btn:disabled{opacity:.25;cursor:default}.pick-trigger-btn.empty{color:#555}@media (hover: none) and (pointer: coarse) and (min-width: 768px) and (min-height: 700px){.numpad-key{height:60px;font-size:1.3rem}.numpad-ok,.numpad-cancel,.pick-trigger-btn{height:52px}.ex-mode-toggle{height:52px;width:50px}}@media (hover: none) and (pointer: coarse) and (min-width: 768px) and (min-height: 700px) and (orientation: portrait){.numpad-key{height:64px}.numpad-ok,.numpad-cancel{height:56px}.pick-trigger-btn,.ex-mode-toggle{height:58px}}.mute-hint{position:absolute;bottom:.5rem;left:0;right:0;text-align:center;font-family:var(--font-body);font-size:12px;color:#888;pointer-events:none;animation:mute-hint-in .4s ease forwards}.mute-hint.fading{animation:mute-hint-out .4s ease forwards}@keyframes mute-hint-in{0%{opacity:0}to{opacity:1}}@keyframes mute-hint-out{0%{opacity:1}to{opacity:0}}.subdiv-dots{display:flex;gap:.25rem;justify-content:center;padding:1.5rem .5rem .5rem;box-sizing:border-box;width:100%}.subdiv-dot{flex:0 1 16px;min-width:4px;height:8px;max-width:12px;border-radius:3px;background:#333;transition:background .05s}.subdiv-dot.beat{background:#555}.subdiv-dot.active{background:#ff4500}.subdiv-dot.beat.active{background:#fff}.display--metro{gap:.35rem;justify-content:center}.display--metro .next-exercise{font-size:.85rem;min-height:0}.beat-dots.tappable{gap:.5rem;max-width:none;flex-wrap:nowrap;width:100%;padding:0 .5rem;box-sizing:border-box}.beat-dots.tappable .beat-dot{flex:0 1 44px;height:auto;aspect-ratio:1;min-width:0;cursor:pointer;-webkit-tap-highlight-color:transparent}.beat-dot.accent{background:#f5c842}.beat-dot.accent.active{background:#fff;box-shadow:0 0 6px #f5c842b3}.beat-dot.silent{background:#2a2a2a;outline:1px dashed #444;outline-offset:-1px}.beat-dot.silent.active{background:#2a2a2a}.beat-dot.subdiv{width:5px;height:5px;background:#3a3a3a;cursor:default}.beat-dot.subdiv.active{background:#666}
