:root{--color-deep-purple:#241a59;--color-coral:#ff6e6f;--color-a:#ffe9ec;--color-light-purple:#f3f1ff;--color-background:#f7f6fc;--color-surface:#fff;--feedback-good:#1ee878;--feedback-ok:#369bff;--feedback-off:#ff5542;--feedback-omitted:#ff5542;--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light only;color:var(--color-deep-purple);background:var(--color-background);font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box}body{color:var(--color-deep-purple);background:var(--color-background);margin:0}.app-shell{min-height:100svh;color:var(--color-deep-purple);background:var(--color-background);flex-direction:column;padding:24px;display:flex}.app-header{width:100%;max-width:1440px;margin:0 auto 16px}.app-header-inner{justify-content:space-between;align-items:flex-start;gap:16px;display:flex}.eyebrow{color:var(--color-deep-purple);letter-spacing:.08em;text-transform:uppercase;margin:0 0 8px;font-size:.76rem;font-weight:700}h1,h2,h3,h4,p{margin-top:0}h1{margin-bottom:0;font-size:clamp(2rem,4vw,3.4rem);line-height:1}.brand-logo{align-items:center;width:min(200px,100% - 64px);min-height:44px;display:flex}.brand-logo img{width:100%;height:auto;display:block}h2{margin-bottom:0;font-size:clamp(1.35rem,2vw,2rem);line-height:1.08}h3{margin-bottom:14px;font-size:1rem}h4{color:var(--color-deep-purple);letter-spacing:.04em;text-transform:uppercase;margin:0 0 10px;font-size:.78rem}button,input{font:inherit}.settings-toggle,.settings-close,.tempo-stepper button{border:1px solid var(--color-light-purple);color:var(--color-coral);background:var(--color-surface);cursor:pointer;border-radius:8px}.settings-toggle{width:44px;height:44px;color:var(--color-deep-purple);background:0 0;border:0;border-radius:999px;place-items:center;padding:0;font-weight:800;display:grid}.settings-toggle:hover{background:var(--color-light-purple)}.icon{flex:none;width:1.25rem;height:1.25rem;display:block}.settings-toggle .icon{width:1.9rem;height:1.9rem}.quick-settings-row{grid-template-columns:minmax(0,1fr);gap:10px;width:min(100%,760px);margin-bottom:16px;display:grid}.quick-settings-row.with-feedback-legend{grid-template-columns:max-content minmax(220px,1fr)}.quick-settings{border:1px solid var(--color-light-purple);background:var(--color-surface);border-radius:8px;align-items:stretch;gap:18px;width:100%;padding:16px 18px;display:flex}.quick-settings.tempo-only{width:max-content;max-width:100%;display:block}.quick-tempo-control{flex:1 1 0;min-width:0}.quick-setting-field{flex:1 1 0;place-items:center;min-width:0;display:grid}.quick-settings:not(.tempo-only) .tempo-stepper{justify-content:center;margin-inline:auto}.quick-settings-label{color:var(--color-deep-purple);letter-spacing:.04em;text-transform:uppercase;margin-bottom:10px;font-size:.76rem;font-weight:800;display:block}.tempo-stepper{justify-content:flex-start;align-items:center;gap:12px;width:max-content;max-width:100%;display:flex}.tempo-readout{min-width:140px;color:var(--color-deep-purple);justify-content:center;align-items:baseline;display:flex}.tempo-readout span{margin:0;font-size:.86rem;font-weight:800}.switch-row{min-height:42px;color:var(--color-deep-purple);cursor:pointer;grid-template-columns:auto 1fr;align-items:center;gap:8px;margin-top:12px;font-size:.9rem;font-weight:700;display:grid}.switch-row input{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;block-size:1px;inline-size:1px;position:absolute;overflow:hidden}.switch-track{border:1px solid var(--color-light-purple);background:var(--color-light-purple);border-radius:999px;align-items:center;width:44px;height:26px;padding:3px;transition:background .12s,border-color .12s;display:inline-flex}.switch-thumb{background:var(--color-surface);border-radius:999px;width:18px;height:18px;transition:transform .12s;box-shadow:0 1px 3px #241a593d}.switch-row input:checked+.switch-track{border-color:var(--color-coral);background:var(--color-coral)}.switch-row input:checked+.switch-track .switch-thumb{transform:translate(18px)}.switch-row input:focus-visible+.switch-track{outline-offset:2px;outline:3px solid #ff6e6f33}.hear-rhythm-main{background:0 0;border:0;border-radius:0;grid-template-columns:auto auto;align-self:center;gap:12px;width:max-content;min-height:50px;margin:0;padding:0;font-size:1rem}.hear-rhythm-main .switch-track{grid-area:1/2}.hear-rhythm-main>span:last-child{grid-area:1/1}.settings-panel{border:1px solid var(--color-light-purple);background:var(--color-surface)}.tempo-stepper input{width:96px;min-height:46px;color:var(--color-deep-purple);font-variant-numeric:tabular-nums;text-align:center;appearance:textfield;background:0 0;border:0;border-radius:0;padding:0;font-size:2.25rem;font-weight:800;line-height:1}.tempo-stepper input::-webkit-inner-spin-button{appearance:none;margin:0}.tempo-stepper input::-webkit-outer-spin-button{appearance:none;margin:0}.tempo-stepper button{border-color:var(--color-coral);min-width:58px;min-height:40px;color:var(--color-coral);place-items:center;padding:4px 6px;font-weight:800;line-height:1;display:grid;container-type:inline-size}.tempo-stepper button>span{font-variant-numeric:tabular-nums;white-space:nowrap;max-width:100%;font-size:clamp(1rem,65cqi,2rem);display:block}.tempo-stepper button:hover{background:var(--color-a)}.tempo-stepper button:disabled{border-color:var(--color-light-purple);color:#a8a2bd;background:var(--color-surface);cursor:not-allowed}.tempo-stepper button:disabled:hover{background:var(--color-surface)}.quick-settings-divider{background:var(--color-light-purple);flex:0 0 1px;width:1px}.feedback-legend{color:var(--color-deep-purple);grid-template-columns:repeat(2,minmax(0,1fr));align-content:center;gap:12px 16px;font-size:.84rem;font-weight:700;display:grid}.feedback-legend-card{border:1px solid var(--color-light-purple);background:var(--color-surface);border-radius:8px;padding:16px 18px;display:grid}.feedback-legend-item{grid-template-columns:auto minmax(0,1fr) auto;align-items:center;gap:7px;min-width:0;display:grid}.feedback-legend-item strong,.feedback-combo strong{font-variant-numeric:tabular-nums}.feedback-combo{color:var(--color-coral);grid-column:1/-1;justify-content:center;align-items:baseline;gap:7px;display:inline-flex}.feedback-marker{background:var(--feedback-omitted);forced-color-adjust:none;border-radius:999px;flex:none;width:11px;height:11px;display:inline-block}.feedback-marker.triangle{background:0 0;border-bottom:11px solid;border-left:6px solid #0000;border-right:6px solid #0000;border-radius:0;width:0;height:0}.feedback-marker.good{border-bottom-color:var(--feedback-good)}.feedback-marker.ok{border-bottom-color:var(--feedback-ok)}.feedback-marker.off{border-bottom-color:var(--feedback-off)}.rhythm-feedback-good{fill:var(--feedback-good)}.rhythm-feedback-ok{fill:var(--feedback-ok)}.rhythm-feedback-off{fill:var(--feedback-off)}.rhythm-feedback-omitted{fill:var(--feedback-omitted)}.rhythm-feedback-pending{fill:#8a9692}.rhythm-feedback-marker{stroke:none;stroke-width:0;forced-color-adjust:none}.workspace-grid{flex:1 0 auto;grid-template-columns:minmax(0,65fr) minmax(320px,35fr);gap:18px;width:100%;max-width:1440px;margin:0 auto;display:grid}.settings-adjustment-notice{bottom:max(18px, env(safe-area-inset-bottom));z-index:30;border:1px solid var(--color-coral);width:min(100% - 28px,560px);color:var(--color-surface);background:var(--color-deep-purple);text-align:center;pointer-events:none;border-radius:8px;padding:11px 15px;font-size:.82rem;font-weight:700;line-height:1.35;position:fixed;left:50%;transform:translate(-50%);box-shadow:0 8px 24px #241a5933}.settings-closed .workspace-grid{grid-template-columns:minmax(0,1fr)}.practice-panel,.settings-panel{border-radius:8px}.practice-panel{min-width:0;padding:20px 0 24px;display:flex}.practice-main-stack{width:100%}.notation-shell{border:1px solid var(--color-light-purple);background:var(--color-surface);border-radius:8px;overflow:hidden}.notation-scroll{padding:clamp(6px,1vw,12px);position:relative;overflow:hidden;container-type:inline-size}.measure-feedback-lane{pointer-events:none;place-items:center;height:clamp(30px,6.67cqi,40px);display:grid}.measure-count-in-stage{align-content:center;justify-items:center;gap:clamp(4px,1.16cqi,7px);display:grid}.measure-count-in-label{color:#655f79;font-size:clamp(.5rem,1.92cqi,.72rem);font-weight:800}.measure-count-in-beats{justify-content:center;align-items:center;gap:clamp(6px,2cqi,12px);height:clamp(10px,2.67cqi,16px);display:flex}.measure-count-in-beat{border:clamp(1px, .33cqi, 2px) solid var(--color-coral);background:0 0;border-radius:50%;width:clamp(8px,2.33cqi,14px);height:clamp(8px,2.33cqi,14px)}.measure-count-in-beat-filled{background:var(--color-coral)}.measure-feedback-text{color:var(--color-deep-purple);font-size:1.1rem;font-weight:900;line-height:1;animation:.45s ease-out both measure-feedback-pop}.measure-feedback-text.good{color:var(--feedback-good)}.measure-feedback-text.ok{color:var(--feedback-ok)}.measure-feedback-text.off{color:var(--feedback-off)}.rhythm-preview{width:100%}.rhythm-preview.is-main-measure{max-width:100%}.rhythm-preview svg{width:100%;height:auto;display:block}.practice-status-row{min-height:24px;color:var(--color-deep-purple);justify-content:center;margin-top:10px;font-size:.86rem;font-weight:800;display:flex}.transport-row{justify-content:center;gap:10px;margin-top:10px;display:flex}.transport-button{border:1px solid var(--color-surface);width:56px;min-width:56px;height:56px;min-height:56px;color:var(--color-deep-purple);background:var(--color-surface);cursor:pointer;border-radius:999px;place-items:center;padding:0;display:inline-grid}.transport-button:hover{border-color:var(--color-deep-purple);color:var(--color-surface);background:var(--color-deep-purple)}.transport-button:first-child{border-color:var(--color-coral);color:var(--color-surface);background:var(--color-coral)}.transport-button:first-child:hover{border-color:var(--color-deep-purple);color:var(--color-surface);background:var(--color-deep-purple)}.transport-button:nth-child(2){border-color:var(--color-surface)}.transport-button:nth-child(2):hover{border-color:var(--color-deep-purple)}.transport-button .icon{width:1.65rem;height:1.65rem}.tap-area{border:1px solid var(--color-coral);width:100%;min-height:132px;color:var(--color-deep-purple);background:var(--color-a);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;border-radius:8px;place-items:center;margin-top:18px;display:grid;position:relative}.tap-area-device-hint{color:var(--color-coral);text-align:center;margin:16px 0 -8px;font-size:.8rem;font-weight:700;line-height:1.4}.app-footer{width:100%;max-width:1440px;padding:8px 0 max(4px, env(safe-area-inset-bottom));color:#736c87;text-align:center;margin:24px auto 0;font-size:.76rem;font-weight:600}.tap-area.is-active{border-color:var(--color-coral);background:var(--color-a)}.tap-area:active,.tap-area.is-active:active{background:var(--color-a);transform:translateY(1px)}.tap-area-label{pointer-events:none;-webkit-user-select:none;user-select:none;font-size:1.6rem;font-weight:800}@keyframes measure-feedback-pop{0%{opacity:0;transform:translateY(6px)scale(.9)}18%{opacity:1;transform:translateY(0)scale(1)}72%{opacity:1}to{opacity:0;transform:translateY(-8px)scale(1.02)}}.tap-area small{color:var(--color-deep-purple);pointer-events:none;-webkit-user-select:none;user-select:none;margin-top:-22px;font-size:.84rem;font-weight:700}.invalid-pool{border:1px solid var(--color-coral);color:var(--color-deep-purple);background:var(--color-light-purple);border-radius:8px;padding:28px}.diagnostics-panel{border:1px solid var(--color-light-purple);background:var(--color-light-purple);border-radius:8px;margin-top:14px;padding:12px}.diagnostics-header{justify-content:space-between;align-items:baseline;gap:12px;margin-bottom:8px;display:flex}.diagnostics-header h3{margin:0;font-size:.9rem}.diagnostics-header-actions{flex-wrap:wrap;justify-content:flex-end;gap:6px;display:flex}.diagnostics-export-button{border:1px solid var(--color-surface);min-height:30px;color:var(--color-deep-purple);background:var(--color-surface);border-radius:7px;justify-content:center;align-items:center;padding:4px 9px;font-size:.75rem;font-weight:800;text-decoration:none;display:inline-flex}.diagnostics-input-mode{border:1px solid var(--color-light-purple);color:var(--color-deep-purple);background:var(--color-surface);border-radius:7px;flex-wrap:wrap;align-items:center;gap:6px 14px;margin:0 0 10px;padding:8px 10px;font-size:.78rem;font-weight:700;display:flex}.diagnostics-input-mode legend{color:var(--color-deep-purple);padding:0 4px;font-weight:800}.diagnostics-input-mode label{align-items:center;gap:5px;display:inline-flex}.diagnostics-input-mode small{color:var(--color-deep-purple);flex-basis:100%;font-weight:600}.diagnostics-remark{color:var(--color-deep-purple);gap:5px;margin-bottom:10px;font-size:.78rem;font-weight:800;display:grid}.diagnostics-remark textarea{resize:vertical;border:1px solid var(--color-light-purple);min-height:46px;color:var(--color-deep-purple);background:var(--color-surface);font:inherit;border-radius:7px;padding:8px 10px;font-weight:600}.diagnostics-remark textarea:focus{border-color:var(--color-coral);outline:3px solid #ff6e6f2e}.diagnostics-remark-actions{color:var(--color-deep-purple);flex-wrap:wrap;align-items:center;gap:8px;margin:-2px 0 10px;font-size:.78rem;font-weight:700;display:flex}.diagnostics-header span,.diagnostics-meta,.diagnostics-empty{color:var(--color-deep-purple);font-size:.78rem;font-weight:700}.diagnostics-empty{margin:0}.diagnostics-subsection{margin-top:12px}.diagnostics-header-compact{margin-top:10px}.diagnostics-meta{flex-wrap:wrap;gap:6px 12px;margin-bottom:8px;display:flex}.diagnostics-table-wrap{overflow-x:auto}.diagnostics-table{border-collapse:collapse;width:100%;min-width:760px;font-size:.78rem}.diagnostics-table-compact{min-width:620px}.diagnostics-table th,.diagnostics-table td{border-top:1px solid var(--color-light-purple);text-align:left;white-space:nowrap;padding:6px 8px}.diagnostics-table th{color:var(--color-deep-purple);text-transform:uppercase;font-size:.72rem}.settings-panel{padding:18px;position:relative;overflow-y:auto}.settings-close,.settings-backdrop{display:none}.settings-section{border-bottom:1px solid var(--color-light-purple);padding-bottom:20px}.settings-section+.settings-section{padding-top:18px}.field-label{color:var(--color-deep-purple);gap:8px;margin-top:12px;font-size:.9rem;font-weight:700;display:grid}.field-label input{border:1px solid var(--color-coral);border-radius:8px;width:100%;min-height:38px;padding:6px 10px}.timing-calibration-settings{border-top:1px solid var(--color-light-purple);margin-top:22px;padding-top:18px}.timing-calibration-settings h3{margin-bottom:6px}.timing-calibration-settings>p{color:#655f79;margin-bottom:12px;font-size:.82rem;line-height:1.45}.timing-calibration-settings>.timing-calibration-device-note{color:#736c87;margin-top:-5px;font-size:.76rem}.timing-calibration-setting-row{grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;min-height:58px;display:grid}.timing-calibration-source,.timing-calibration-value{display:block}.timing-calibration-source{font-size:.88rem;font-weight:800}.timing-calibration-value{color:#655f79;font-variant-numeric:tabular-nums;margin-top:3px;font-size:.76rem}.timing-calibration-actions{justify-content:flex-end;align-items:center;gap:7px;display:flex}.timing-calibration-actions button,.calibration-dialog-actions button,.calibration-primary-action{border:1px solid var(--color-coral);min-height:36px;color:var(--color-deep-purple);background:var(--color-surface);cursor:pointer;border-radius:8px;padding:7px 11px;font-size:.78rem;font-weight:800}.timing-calibration-actions button:hover,.calibration-dialog-actions button:hover{background:var(--color-a)}.timing-calibration-actions .timing-calibration-reset{color:#655f79;background:0 0;border-color:#0000}.timing-calibration-actions .timing-calibration-action,.calibration-dialog-actions .calibration-primary-action,.calibration-primary-action{color:var(--color-surface);background:var(--color-coral)}.timing-calibration-actions .timing-calibration-action:hover{border-color:var(--color-deep-purple);color:var(--color-surface);background:var(--color-deep-purple)}.timing-calibration-dialog{border:1px solid var(--color-coral);width:min(560px,100% - 32px);min-height:360px;max-height:calc(100svh - 32px);color:var(--color-deep-purple);background:var(--color-surface);border-radius:8px;margin:auto;padding:28px;overflow-y:auto}.timing-calibration-dialog-running{height:475px}.timing-calibration-dialog::backdrop{background:#241a596b}.timing-calibration-close{border:1px solid var(--color-light-purple);width:38px;height:38px;color:var(--color-deep-purple);background:var(--color-surface);cursor:pointer;border-radius:8px;place-items:center;padding:0;display:grid;position:absolute;top:16px;right:16px}.timing-calibration-close:hover{border-color:var(--color-coral);background:var(--color-a)}.timing-calibration-content{text-align:center;flex-direction:column;justify-content:center;align-items:center;min-height:302px;padding:38px 0 0;display:flex}.timing-calibration-content-preparing{height:100%;min-height:100%;padding-top:0}.timing-calibration-content h2{margin-bottom:24px}.timing-calibration-content>p:not(.timing-calibration-prompt){max-width:410px;margin-bottom:22px;line-height:1.5}.timing-calibration-prompt,.timing-calibration-result{margin-bottom:24px;font-size:1.15rem;font-weight:800}.timing-calibration-prompt{color:var(--color-coral);line-height:1.45}.timing-calibration-prompt-preparing{max-width:none;margin-bottom:0}.timing-calibration-prompt-keyboard{white-space:nowrap}.calibration-count-in-stage{opacity:1;align-content:center;justify-items:center;gap:12px;width:min(100%,260px);height:78px;margin-bottom:18px;transition:opacity .2s;display:grid}.calibration-count-in-label{color:#655f79;font-size:.78rem;font-weight:800}.calibration-count-in-beats{justify-content:center;align-items:center;gap:14px;height:20px;display:flex}.calibration-count-in-beat{border:2px solid var(--color-coral);background:0 0;border-radius:50%;width:16px;height:16px}.calibration-count-in-beat-filled{background:var(--color-coral)}.calibration-count-in-stage-fading{opacity:0}.calibration-tap-area{border:1px solid var(--color-coral);width:100%;min-height:190px;color:var(--color-deep-purple);background:var(--color-a);cursor:pointer;touch-action:none;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;border-radius:8px;place-items:center;font-size:1.6rem;font-weight:800;display:grid}.calibration-tap-area:active{transform:translateY(1px)}.calibration-keys{justify-content:center;align-items:center;gap:14px;min-height:150px;display:flex}.calibration-keys kbd{border:1px solid var(--color-coral);background:var(--color-a);width:72px;height:72px;font:inherit;border-radius:8px;place-items:center;font-size:1.45rem;font-weight:800;display:grid}.calibration-dialog-actions{justify-content:center;gap:10px;display:flex}.pattern-group+.pattern-group{margin-top:18px}.pattern-group-header{justify-content:flex-start;align-items:center;gap:10px;margin-bottom:10px;display:flex}.pattern-group-header h4{margin-bottom:0}.pattern-bulk-actions{flex-wrap:wrap;justify-content:flex-start;gap:6px;display:flex}.pattern-bulk-actions button{border:1px solid var(--color-coral);min-height:28px;color:var(--color-surface);background:var(--color-coral);cursor:pointer;border-radius:8px;padding:0 8px;font-size:.72rem;font-weight:700}.pattern-bulk-actions button:hover{border-color:var(--color-deep-purple);color:var(--color-surface);background:var(--color-deep-purple)}.pattern-grid{flex-wrap:wrap;align-items:stretch;gap:8px;display:flex}.pattern-tile{border:1px solid var(--color-light-purple);width:auto;min-height:104px;color:var(--color-deep-purple);background:var(--color-surface);text-align:left;cursor:pointer;border-radius:8px;place-items:center;padding:7px 8px;display:grid;position:relative}.pattern-tile:hover{border-color:var(--color-coral)}.pattern-tile.is-selected{border-color:var(--color-coral);color:var(--color-deep-purple);background:var(--color-a);box-shadow:inset 0 0 0 1px var(--color-coral)}.pattern-tile.is-disabled,.pattern-tile.is-disabled:hover{color:#77718c;box-shadow:none;cursor:not-allowed;background:#eeecf3;border-color:#d8d4e5}.pattern-tile.is-disabled .rhythm-preview{opacity:.48;filter:grayscale()}.pattern-tile .pattern-disabled-reason{color:#625b78;text-align:center;background:#f7f6fcf0;border-radius:5px;padding:2px 4px;font-size:.62rem;font-weight:800;line-height:1.2;position:absolute;bottom:5px;left:5px;right:5px}.pattern-tile span{font-size:.82rem;font-weight:700;line-height:1.18;display:block}.pattern-tile .rhythm-preview{pointer-events:none;width:auto;max-width:100%}.pattern-tile svg{width:auto;max-width:min(320px,100%);height:auto;display:block;overflow:visible}@media (width<=980px){.app-header,.app-header-inner{align-items:flex-start}.workspace-grid,.settings-open .workspace-grid,.settings-closed .workspace-grid{grid-template-columns:1fr}.settings-panel{z-index:20;border-radius:0;max-height:none;padding:22px;position:fixed;inset:0;overflow-y:auto}.settings-backdrop{z-index:19;cursor:pointer;background:#241a5961;border:0;display:block;position:fixed;inset:0}.settings-close{z-index:1;place-items:center;width:38px;height:38px;margin-left:auto;font-size:1.35rem;line-height:1;display:grid;position:sticky;top:0}}@media (width>=981px){.app-shell{padding:22px 24px}.app-header{margin-bottom:8px}.settings-open .settings-panel{inline-size:100%;align-self:start;max-height:calc(100svh - 140px)}.practice-panel{min-height:calc(100svh - 136px);padding:12px 0 18px}.is-normal-mode .practice-panel{align-items:center}.is-normal-mode .practice-main-stack{margin-block:auto}.quick-settings-row{margin-bottom:12px}.practice-panel .tempo-stepper button{min-width:56px;min-height:40px;padding-inline:12px}.practice-panel .tempo-stepper input{width:96px;min-height:50px;padding-inline:0}.hear-rhythm-main{min-height:50px;padding-inline:14px}.transport-button{width:58px;min-width:58px;height:58px;min-height:58px}.transport-button .icon{width:1.75rem;height:1.75rem}}@media (width<=640px){.app-shell{padding:14px}.brand-logo{width:min(160px,100% - 54px)}.practice-panel{padding:0}.quick-settings-row.with-feedback-legend{grid-template-columns:minmax(0,1.16fr) minmax(0,.84fr);gap:8px;width:100%}.quick-settings-row.with-feedback-legend .quick-settings.tempo-only{width:100%;display:flex;container:tempo-card/inline-size}.quick-settings-row.with-feedback-legend .quick-tempo-control{width:100%;position:relative}.quick-settings-row.with-feedback-legend .tempo-stepper{grid-template-columns:auto auto auto;justify-content:center;align-items:center;display:grid;position:absolute;top:50%;left:0;transform:translateY(-50%)}.quick-settings{grid-template-columns:minmax(0,1.15fr) 1px minmax(0,.85fr);gap:8px;width:100%;padding:10px;display:grid}.feedback-legend-card{padding:10px}.quick-settings-label{margin-bottom:7px;font-size:.66rem}.tempo-stepper{gap:8px;width:100%}.tempo-stepper button{min-width:42px;min-height:32px;padding:3px 4px}.tempo-readout{min-width:78px}.tempo-stepper input{width:54px;min-height:42px;font-size:1.55rem}.tempo-readout span{font-size:.64rem}.hear-rhythm-main{grid-template-columns:minmax(0,auto) auto;justify-content:center;gap:5px;width:100%;max-width:100%;min-height:42px;font-size:.76rem}.feedback-legend{grid-template-columns:minmax(0,1fr);gap:8px 3px;font-size:.66rem}.feedback-combo{grid-column:auto}.feedback-legend-item{gap:3px}.feedback-marker{width:8px;height:8px}.feedback-marker.triangle{border-bottom-width:9px;border-left-width:5px;border-right-width:5px}.timing-calibration-dialog{border:0;border-radius:0;width:100%;max-width:none;height:100%;max-height:none;padding:22px}.timing-calibration-content{min-height:calc(100svh - 44px);padding-top:44px}.timing-calibration-content-preparing{min-height:100%;padding-top:0}.timing-calibration-prompt-keyboard{font-size:.8rem}}@media (width<=400px){.app-shell{padding-inline:8px}}@container tempo-card (width<=180px){.quick-tempo-control{grid-template-rows:auto 1fr;display:grid}.quick-settings-row.with-feedback-legend .tempo-stepper{grid-template-columns:auto auto;grid-template-areas:"readout readout""decrease increase";justify-content:center;align-self:center;gap:5px 8px;position:static;transform:none}.tempo-stepper button:first-child{grid-area:decrease}.tempo-readout{grid-area:readout}.tempo-stepper button:last-child{grid-area:increase}}.rhythm-preview.is-main-measure .vf-stem path{stroke-width:1.7px;transform:translate(-.1px)}@media (width<=340px){.tempo-stepper button{min-width:38px;min-height:30px;padding:3px}.tempo-readout{min-width:60px}.tempo-stepper input{width:40px;font-size:1.3rem}.tempo-readout span{font-size:.58rem}.timing-calibration-prompt-keyboard{font-size:.7rem}}
