:root{color:#f7f7f7;font-synthesis:none;text-rendering:optimizelegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background:#050505;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif}*{box-sizing:border-box;min-width:0}img{max-width:100%}html{background:#050505;width:100%;max-width:100%;overflow-x:hidden}body{width:100%;min-width:320px;max-width:100vw;min-height:100svh;margin:0;overflow-x:hidden}button,input{font:inherit}button{border:0}button,input[type=range]{touch-action:manipulation}button:focus-visible,input:focus-visible{outline:none}#root{width:100%;max-width:100vw;min-height:100svh;overflow-x:hidden}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border:0;width:1px;height:1px;padding:0;position:absolute;overflow:hidden}.app-shell{--brand-accent:#fff;--brand-accent-strong:#e5e5e5;--corner-panel:0;--corner-control:0;--control-selected:#d8d8d8;--control-selected-soft:#c9c9c9;--guitar-accent:#1f7f86;--guitar-accent-strong:#155f75;--guitar-accent-soft:#1f7f8638;--guitar-accent-line:#4bacb294;--brand-background:#050505;--panel:#202020;--panel-strong:#272727;--panel-border:#ffffff21;--text:#f7f7f7;--muted:#b7b7b7;--quiet:#777;--dark:#111;--shadow:0 16px 34px #00000052;--shell-padding:12px;width:100%;max-width:100vw;min-height:100dvh;padding:calc(var(--shell-padding) + env(safe-area-inset-top)) calc(var(--shell-padding) + env(safe-area-inset-right)) calc(var(--shell-padding) + env(safe-area-inset-bottom)) calc(var(--shell-padding) + env(safe-area-inset-left));color:var(--text);background:linear-gradient(#ffffff09,#0000 220px),#050505;overflow-x:hidden}.branding-header,.iphone-audio-notice,.app-tabs,.practice-layout,.settings-panel,.app-footer{width:min(100%,1040px);margin:0 auto}.branding-header{padding:0 2px 14px;display:grid}.brand-logo-panel{border-bottom:1px solid #ffffff24;justify-content:flex-start;align-items:center;gap:14px;width:100%;min-width:0;height:78px;display:flex;overflow:hidden}.brand-logo{object-fit:contain;object-position:left center;flex:0 auto;width:min(100%,460px);min-width:0;height:auto;max-height:74px;display:block}.brand-line{min-width:0;color:var(--text);text-align:right;text-transform:uppercase;flex:auto;gap:2px;line-height:1.25;display:grid}.brand-name{letter-spacing:.04em;font-size:clamp(1.05rem,4.2vw,1.72rem);font-weight:700;line-height:1}.brand-service{color:var(--muted);letter-spacing:.14em;font-size:clamp(.58rem,2vw,.78rem);font-weight:650;line-height:1.1}.brand-copy{display:none}.iphone-audio-notice{color:#d9eeee;text-align:left;background:#1f7f861f;border:1px solid #4bacb257;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:10px;margin-bottom:10px;padding:9px 9px 9px 10px;font-size:.78rem;font-weight:650;line-height:1.35;display:grid;position:relative}.iphone-audio-notice p{margin:0}.iphone-audio-notice button{border-radius:var(--corner-control);color:#f3fbfb;text-transform:uppercase;background:#0003;border:1px solid #ffffff29;justify-content:center;align-items:center;width:26px;min-width:26px;height:26px;min-height:26px;padding:0;font-family:inherit;font-size:.9rem;font-weight:800;line-height:1;display:inline-flex}.eyebrow,.tagline,.app-footer{color:var(--muted)}.eyebrow{color:#d2d2d2;letter-spacing:.16em;text-transform:uppercase;margin:0;font-size:.7rem;font-weight:800}h1,h2,p{margin:0}h1{letter-spacing:.02em;text-transform:uppercase;font-size:clamp(2.15rem,8vw,3.8rem);font-weight:600;line-height:1}h2{letter-spacing:0;margin-top:2px;font-size:1.08rem;font-weight:650;line-height:1.2}.tagline{color:#9b9b9b;margin-top:0;font-size:.86rem}.practice-layout{gap:12px;min-width:0;display:grid}.practice-main-wrap{min-width:0;display:grid;position:relative}.practice-side-stack{align-content:start;gap:12px;display:grid}.edge-tabs{justify-content:flex-end;align-items:center;gap:6px;margin:0;display:flex}.metronome-heading-actions{flex:none;justify-content:flex-end;align-items:center;gap:10px;padding:3px 2px 3px 12px;display:flex}.compact-timer-badge{appearance:none;border-radius:var(--corner-control);min-width:78px;min-height:38px;color:var(--text);box-shadow:none;background:#00000038;border:1px solid #ffffff24;place-items:center;gap:2px;padding:5px 10px;font-family:inherit;line-height:1;display:inline-grid}.compact-timer-badge span{color:var(--muted);letter-spacing:.11em;text-transform:uppercase;font-size:.54rem;font-weight:800}.compact-timer-badge strong{color:var(--text);font-variant-numeric:tabular-nums;letter-spacing:0;font-size:.98rem;font-weight:800}.compact-timer-badge.running{background:#1f7f862e;border-color:#4bacb27a}.edge-tab-button{appearance:none;border-radius:var(--corner-control);color:#d7e8e8;width:38px;min-width:38px;height:38px;box-shadow:none;letter-spacing:.02em;background:#0000003d;border:1px solid #ffffff24;justify-content:center;align-items:center;gap:6px;padding:0;font-family:inherit;font-size:.72rem;font-weight:700;line-height:1;display:inline-flex}.edge-tab-label{clip:rect(0 0 0 0);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.edge-tab-icon{color:currentColor;flex:none;width:17px;height:17px;position:relative}.timer-icon{border:2px solid;border-radius:50%}.timer-icon:before,.timer-icon:after{content:"";transform-origin:50% 0;background:currentColor;border-radius:999px;width:2px;position:absolute;top:50%;left:50%}.timer-icon:before{height:6px;transform:translate(-50%,-1px)}.timer-icon:after{height:5px;transform:translate(-50%,-1px)rotate(95deg)}.tempo-icon{background:linear-gradient(currentColor 0 0) 2px 10px/3px 8px no-repeat,linear-gradient(currentColor 0 0) 8px 6px/3px 12px no-repeat,linear-gradient(currentColor 0 0) 14px 2px/3px 16px no-repeat}.edge-tab-button:hover{background:#1f7f8629;border-color:#4bacb280}.app-tabs{border-radius:var(--corner-panel);background:#00000038;border:1px solid #ffffff1a;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-bottom:10px;padding:4px;display:none}.app-tabs button{border-radius:var(--corner-control);min-height:31px;color:var(--muted);letter-spacing:.02em;background:0 0;border:1px solid #0000;font-size:.88rem;font-weight:650}.app-tabs button.selected{color:#050505;background:var(--control-selected);border-color:#ffffff2e}.panel{border:1px solid var(--panel-border);border-radius:var(--corner-panel);background:var(--panel);min-width:0;box-shadow:var(--shadow);padding:12px;position:relative;overflow-x:hidden}.metronome-panel{transition:border-color .18s}.panel-heading{justify-content:space-between;align-items:flex-start;gap:14px;margin-bottom:12px;display:flex}.panel-heading-actions{flex:none;align-items:center;gap:8px;display:flex}.panel-toggle-button{appearance:none;border-radius:var(--corner-control);min-width:76px;height:28px;color:var(--muted);box-sizing:border-box;text-align:center;background:#181818;border:1px solid #ffffff24;flex:none;justify-content:center;align-items:center;padding:0 8px;font-family:inherit;font-size:.72rem;font-weight:650;line-height:1;display:inline-flex}.panel-toggle-button:hover{color:var(--text);border-color:var(--guitar-accent-line);background:#1f7f861f}.mode-switch-button{appearance:none;border-radius:var(--corner-control);min-width:74px;height:28px;color:var(--muted);box-sizing:border-box;background:#181818;border:1px solid #ffffff24;flex:none;justify-content:center;align-items:center;gap:8px;padding:0 8px;font-family:inherit;line-height:1;display:inline-flex}.mode-switch-button strong{min-width:18px;color:inherit;letter-spacing:.02em;text-align:left;text-transform:uppercase;font-size:.72rem;font-weight:750}.mode-switch-track{background:#0f0f0f;border:1px solid #ffffff29;width:26px;height:14px;position:relative}.mode-switch-track span{background:var(--quiet);width:8px;height:8px;transition:transform .16s,background-color .16s;position:absolute;top:2px;left:2px}.mode-switch-button.enabled{color:#f3fbfb;border-color:var(--guitar-accent-line);background:#1f7f8633}.mode-switch-button.enabled .mode-switch-track{background:#1f7f8647;border-color:#4bacb299}.mode-switch-button.enabled .mode-switch-track span{background:#f3fbfb;transform:translate(12px)}.mode-switch-button:hover{color:var(--text);border-color:var(--guitar-accent-line)}.collapsed-card{background:#181818;justify-content:space-between;align-items:center;gap:14px;padding-block:12px;display:flex}.collapsed-card div{gap:4px;display:grid}.collapsed-card span{color:var(--quiet);font-size:.82rem;font-weight:650}.metronome-title-label,.panel-title-label{color:#d8d8d8;letter-spacing:.24em;font-size:clamp(.98rem,2.2vw,1.16rem);font-weight:850}.panel-title-label{font-size:clamp(.9rem,1.8vw,1.04rem)}.tempo-card{border-radius:var(--corner-panel);background:#242424;border:1px solid #ffffff1c;align-items:center;gap:16px;margin:16px 0 18px;padding:20px clamp(16px,4vw,28px);display:grid}.metronome-panel.playing .tempo-card{background:#203235;border-color:#4bacb28f;box-shadow:inset 0 0 0 1px #4bacb21f}.bpm-display,.timer-display{color:var(--text);font-variant-numeric:tabular-nums;justify-content:center;align-items:flex-end;margin:10px 0;display:flex}.tempo-card .bpm-display{margin:0}.bpm-display span{font-size:clamp(3.35rem,20vw,5.8rem);font-weight:750;line-height:.86}.bpm-display small{color:var(--quiet);margin:0 0 .55rem 8px;font-size:1rem;font-weight:650}.tempo-builder-compact-status{--tempo-progress:0%;background:linear-gradient(90deg, #ffffff2e 0%, #ffffff21 var(--tempo-progress), transparent var(--tempo-progress), transparent 100%), #0e0e0e;width:min(100%,760px);color:inherit;text-align:inherit;border:1px solid #ffffff3d;grid-template-columns:auto minmax(100px,1fr) auto auto;align-items:center;gap:8px 14px;margin:-4px auto 0;padding:9px 12px;font-family:inherit;transition:background .22s;display:grid;position:relative;overflow:hidden;box-shadow:inset 0 0 0 1px #0000006b,0 8px 18px #0000002e}.tempo-builder-compact-status:disabled{cursor:default}.tempo-builder-compact-status div{justify-content:flex-start;align-items:center;gap:10px;display:flex}.tempo-builder-compact-status div,.tempo-builder-compact-status p,.tempo-builder-compact-status small{z-index:1;position:relative}.tempo-builder-compact-status span{color:#d8d8d8;letter-spacing:.12em;text-transform:uppercase;font-size:.62rem;font-weight:850;line-height:1}.tempo-builder-compact-status strong{color:var(--text);font-size:.76rem;font-weight:850;line-height:1}.tempo-builder-compact-status p{color:#efefef;text-align:center;font-size:.74rem;font-weight:750;line-height:1}.tempo-builder-compact-status small{color:#d8d8d8;letter-spacing:.08em;text-align:right;text-transform:uppercase;white-space:nowrap;font-size:.66rem;font-weight:750;line-height:1}.tempo-builder-compact-status .tempo-change-status{color:#f3fbfb}.count-in-overlay{z-index:4;border-radius:inherit;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:radial-gradient(circle,#1f7f8621,#0000 26rem),#020202f0;place-items:center;padding:18px;display:grid;position:absolute;inset:0}.count-in-display{width:min(100%,420px);color:var(--text);font-variant-numeric:tabular-nums;box-shadow:none;background:0 0;border:0;place-items:center;gap:8px;display:grid}.count-in-display small{color:var(--guitar-accent-line);letter-spacing:.16em;text-transform:uppercase;font-size:clamp(.8rem,2vw,1rem);font-weight:750;line-height:1}.count-in-display span{color:var(--text);text-shadow:0 0 42px #1f7f8657,0 20px 70px #00000094;font-size:clamp(8rem,34vw,18rem);font-weight:760;line-height:.78;animation:.18s ease-out count-in-pop}@keyframes count-in-pop{0%{opacity:.7;transform:scale(.94)}to{opacity:1;transform:scale(1)}}.timer-display{border-radius:var(--corner-panel);background:#242424;border:1px solid #ffffff1c;justify-content:center;align-items:center;min-height:128px;margin:6px 0 14px;padding-bottom:0;font-size:clamp(2.55rem,13vw,4.55rem);font-weight:750;line-height:1}.timer-panel{grid-template-rows:auto auto auto auto auto;align-content:center;display:grid}.timer-panel .panel-heading{align-self:start}.stepper{grid-template-columns:46px minmax(0,1fr) 46px;align-items:center;gap:10px;width:100%;max-width:720px;margin-inline:auto;display:grid}.stepper button,.stepper input,.segmented-control button,.preset-grid button,.sound-mode-control button,.custom-minutes input,.practice-mode-grid input,.primary-action,.secondary-action{border-radius:var(--corner-control);min-width:0;min-height:38px;color:var(--text);box-shadow:none;background:#181818;border:1px solid #ffffff29}.stepper button,.stepper input{min-height:44px}.stepper button{color:var(--text);background:#2b2b2b;border-color:#fff3;font-size:1.2rem;font-weight:500}.stepper input,.custom-minutes input,.practice-mode-grid input{text-align:center;border:1px solid #ffffff24;width:100%;font-size:1.2rem;font-weight:650}.stepper input:focus-visible,.custom-minutes input:focus-visible,.practice-mode-grid input:focus-visible{border-color:var(--guitar-accent-line);background:#202020}.stepper input::-webkit-outer-spin-button{appearance:none;margin:0}.stepper input::-webkit-inner-spin-button{appearance:none;margin:0}.custom-minutes input::-webkit-outer-spin-button{appearance:none;margin:0}.custom-minutes input::-webkit-inner-spin-button{appearance:none;margin:0}.practice-mode-grid input::-webkit-outer-spin-button{appearance:none;margin:0}.practice-mode-grid input::-webkit-inner-spin-button{appearance:none;margin:0}.stepper input,.custom-minutes input,.practice-mode-grid input{appearance:textfield}button:focus-visible{border-color:#ffffff4d}.custom-minutes{border-radius:var(--corner-control);background:#181818;border:1px solid #ffffff24;grid-column:span 2;place-items:center;gap:4px;min-height:42px;margin:0;padding:6px 8px;display:grid}.custom-minutes.selected{border-color:var(--guitar-accent-line);color:#f3fbfb;background:var(--guitar-accent-strong)}.custom-minutes span{color:var(--muted);letter-spacing:.08em;text-transform:uppercase;font-size:.62rem;font-weight:700;line-height:1}.custom-minutes.selected span,.custom-minutes.selected input{color:#f3fbfb}.custom-time-fields{grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;width:100%;display:grid}.custom-time-field{grid-template-columns:minmax(0,1fr) auto;align-items:baseline;gap:3px;min-width:0;display:grid}.custom-minutes input{background:0 0;border:0;min-height:auto;padding:0;font-size:.92rem;line-height:1}.custom-time-field small{color:var(--quiet);letter-spacing:.02em;text-transform:uppercase;font-size:.52rem;font-weight:750;line-height:1}.custom-minutes.selected .custom-time-field small{color:#f3fbfbb8}.custom-minutes input::placeholder{color:var(--quiet);opacity:1}.timer-repeat{border-top:1px solid #ffffff1a;justify-content:space-between;align-items:center;gap:14px;margin:14px 0 0;padding:12px 0 0;display:flex}.timer-repeat span{gap:3px;display:grid}.timer-repeat strong{color:var(--text);font-size:.9rem;font-weight:650}.timer-repeat small{color:var(--quiet);font-size:.76rem}.timer-repeat input{width:44px;height:24px;accent-color:var(--guitar-accent);flex:none}.practice-mode-panel{border-top:1px solid #ffffff1a;margin:0 0 16px;padding:12px 0 0}.practice-mode-card .practice-mode-panel{border-top:0;margin:8px 0 0;padding:0}.practice-mode-description{color:var(--muted);margin:0;font-size:.84rem;font-weight:650;line-height:1.35}.practice-mode-grid{grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:8px;display:grid}.practice-mode-grid label{gap:5px;display:grid}.practice-mode-grid span{color:var(--quiet);letter-spacing:.04em;text-transform:uppercase;font-size:.72rem;font-weight:700}.practice-mode-grid input{min-height:36px;font-size:.95rem}.bpm-slider{width:100%;max-width:720px;accent-color:var(--guitar-accent);margin:0 auto}.volume-control{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:12px;max-width:520px;margin:0 auto 10px;display:grid}.volume-control span{color:var(--muted);font-size:.78rem;font-weight:650}.volume-control input{width:100%;accent-color:var(--guitar-accent)}.metronome-mid-controls{gap:10px;width:min(100%,360px);margin:0 auto 14px;display:grid}.metronome-mid-controls .volume-control{grid-template-columns:86px minmax(0,1fr);max-width:none;margin:0}.count-in-toggle{border-top:1px solid #ffffff17;justify-content:space-between;align-items:center;gap:14px;max-width:none;margin:0;padding:10px 0 0;display:flex}.count-in-toggle span{gap:2px;display:grid}.count-in-toggle strong{color:var(--text);font-size:.86rem;font-weight:650}.count-in-toggle small{color:var(--quiet);font-size:.72rem}.count-in-toggle input{width:44px;height:24px;accent-color:var(--guitar-accent);flex:none}.segmented-control,.preset-grid,.sound-mode-control{gap:8px;display:grid}.segmented-control{grid-template-columns:repeat(5,minmax(0,1fr));max-width:none;margin-inline:0}.preset-grid{grid-template-columns:repeat(6,minmax(0,1fr));gap:6px}.sound-mode-control{grid-template-columns:repeat(6,minmax(0,1fr));width:100%;max-width:680px;margin:0}.segmented-control button,.preset-grid button,.sound-mode-control button{color:var(--muted);border-color:#ffffff24;font-size:.76rem;font-weight:600}.preset-grid button,.preset-grid .custom-minutes{min-height:42px}.preset-grid button.selected,.sound-mode-control button.selected{border-color:var(--guitar-accent-line);color:#f3fbfb;background:var(--guitar-accent-strong)}.segmented-control button.selected{border-color:var(--guitar-accent-line);color:var(--text);background:var(--guitar-accent-soft)}.beat-sound-grid{--beat-gap:7px;--beat-max:86px;grid-template-columns:repeat(var(--beat-count,6), minmax(0, 1fr));gap:var(--beat-gap);width:min(100%, calc(var(--beat-count,6) * var(--beat-max) + (var(--beat-count,6) - 1) * var(--beat-gap)));justify-content:center;justify-items:stretch;margin:14px 0;margin-inline:auto;display:grid}.beat-sound-button{min-width:0;min-height:50px;color:var(--muted);background:#ffffff0e;border:1px solid #0000;border-radius:0;align-content:center;gap:3px;padding:6px 5px;transition:background-color .12s,border-color .12s,color .12s,transform .12s;display:grid}.beat-sound-button span{color:#7c7c7c;font-size:.68rem;font-weight:650}.beat-sound-button strong{text-overflow:ellipsis;white-space:nowrap;font-size:clamp(.62rem,2.3vw,.82rem);font-weight:750;line-height:1.1;overflow:hidden}.beat-sound-button.strong{color:#050505;background:var(--control-selected);border-color:#ffffffd9}.beat-sound-button.strong span{color:#555}.beat-sound-button.soft{color:#d8d8d8;background:#ffffff1f;border-color:#ffffff1a}.beat-sound-button.kick{color:#f4f4f4;background:#ffffff29;border-color:#ffffff24}.beat-sound-button.snare{color:#050505;background:var(--control-selected-soft);border-color:#ffffffd1}.beat-sound-button.snare span{color:#555}.beat-sound-button.hat{color:#d0d0d0;background:#ffffff12;border-color:#ffffff1a}.beat-sound-button.silent{color:#666;background:#ffffff09;border-color:#ffffff0f}.beat-sound-button.active{border-color:var(--guitar-accent-line);color:#f7ffff;background:#174e56;transform:translateY(-1px);box-shadow:inset 0 0 0 1px #a8ecef61,0 0 0 1px #1f7f862e}.beat-sound-button.active span,.beat-sound-button.active strong{color:inherit}.action-grid{grid-template-columns:1.35fr 1fr;gap:10px;margin-top:12px;display:grid}.play-row{margin:10px 0 24px;display:grid}.play-action{min-height:50px;font-size:1.08rem}.metronome-bottom-controls{grid-template-columns:1fr;align-items:stretch;gap:12px;margin-top:0;display:grid}.metronome-bottom-options{gap:8px;min-width:0;padding-top:12px;padding-left:0;display:grid;position:relative}.metronome-bottom-options:before{content:"";background:#ffffff1f;width:auto;height:1px;position:absolute;inset:0 0 auto}.primary-action,.secondary-action{letter-spacing:.08em;text-transform:uppercase;min-height:38px;font-weight:800}.primary-action{border-color:var(--guitar-accent-line);color:#f3fbfb;background:var(--guitar-accent-strong);box-shadow:none}.secondary-action{color:var(--text);background:#0000002e;border-color:#fff3}.app-footer{letter-spacing:.08em;text-align:center;text-transform:uppercase;flex-wrap:wrap;justify-content:center;gap:6px 9px;padding:12px 2px 0;font-size:.72rem;font-weight:700;line-height:1.4;display:flex}.footer-brand-mark{object-fit:contain;opacity:.82;flex-basis:100%;width:min(46vw,170px);max-height:46px;margin:4px auto 2px;display:block}.install-app{letter-spacing:0;text-transform:none;flex-basis:100%;justify-items:center;gap:6px;margin-bottom:2px;display:grid}.install-app-button{border:1px solid var(--guitar-accent-line);border-radius:var(--corner-control);color:#f3fbfb;letter-spacing:.08em;text-transform:uppercase;background:#1f7f8652;min-height:32px;padding:0 14px;font-family:inherit;font-size:.72rem;font-weight:800}.install-app-message{max-width:min(100%,420px);color:var(--muted);letter-spacing:0;text-align:center;text-transform:none;font-size:.72rem;font-weight:650;line-height:1.4}.app-footer a{color:var(--muted);text-underline-offset:3px;text-decoration-color:#ffffff47}.footer-separator{color:#ffffff47}.app-footer a:hover{color:var(--text);-webkit-text-decoration-color:var(--guitar-accent-line);text-decoration-color:var(--guitar-accent-line)}.settings-panel{max-width:680px}.settings-list{gap:0;margin:18px 0 0;display:grid}.settings-list div{border-top:1px solid #ffffff1a;grid-template-columns:minmax(108px,.42fr) minmax(0,1fr);gap:14px;padding:14px 0;display:grid}.settings-list dt{color:var(--quiet);letter-spacing:.06em;text-transform:uppercase;font-size:.78rem;font-weight:700}.settings-list dd{color:var(--text);margin:0;font-size:.96rem}button{cursor:pointer;transition:transform .15s,filter .15s,border-color .15s,background-color .15s}button:hover{filter:brightness(1.04);border-color:#ffffff47}button:active{transform:translateY(1px)scale(.99)}@media (width>=720px){.app-shell{padding:16px}.branding-header{padding-bottom:14px}.brand-logo-panel{width:100%;height:88px}.brand-logo{width:540px;max-height:82px}.brand-name{font-size:1.72rem}.brand-service{font-size:.78rem}.brand-copy{grid-template-columns:minmax(0,1fr);align-items:end}.brand-copy .eyebrow,.brand-copy h1,.brand-copy .tagline{grid-column:1}.brand-copy .tagline{text-align:left;max-width:260px;padding-bottom:0}.practice-layout{grid-template-columns:minmax(0,1fr);align-items:start}.practice-side-stack{align-content:start;height:auto}.practice-side-stack.both-side-panels{grid-template-rows:auto auto;align-content:start}.practice-side-stack.both-side-panels .practice-mode-card,.practice-side-stack.both-side-panels .timer-panel{min-height:0}.practice-layout.main-centered{justify-content:center;align-items:stretch;width:min(100%,1040px)}.practice-layout.main-centered .practice-main-wrap{min-height:min(620px,100dvh - 190px)}.metronome-panel{flex-direction:column;display:flex}.practice-layout.main-centered .metronome-panel{min-height:inherit;justify-content:space-between;gap:clamp(8px,1.25vh,16px);padding:clamp(14px,2vw,22px)}.practice-layout.main-centered .tempo-card{margin:0;padding-block:clamp(16px,2.8vh,30px)}.practice-layout.main-centered .bpm-display span{font-size:clamp(3.75rem,11vw,6.6rem)}.practice-layout.main-centered .beat-sound-grid{--beat-max:108px;margin-block:0}.practice-layout.main-centered .beat-sound-button{min-height:clamp(50px,5.8vh,64px)}.practice-layout.main-centered .metronome-mid-controls{width:min(100%,430px);margin-block:0}.practice-layout.main-centered .play-row{margin:0 0 12px}.practice-layout.main-centered .play-action{min-height:clamp(48px,5.4vh,58px);font-size:clamp(1.08rem,2.2vw,1.28rem)}.metronome-panel .edge-tab-button{box-shadow:none}.metronome-panel .metronome-bottom-controls{grid-template-columns:minmax(108px,.28fr) minmax(0,1fr);margin-top:0}.metronome-panel .metronome-bottom-options{padding-top:0;padding-left:16px}.metronome-panel .metronome-bottom-options:before{width:1px;height:auto;top:6px;bottom:6px;right:auto}.panel{padding:16px}}@media (width>=1100px){.practice-layout{grid-template-columns:minmax(0,1.14fr) minmax(310px,.86fr);align-items:stretch}.practice-side-stack{height:100%}.practice-side-stack.both-side-panels{grid-template-rows:auto minmax(0,1fr);align-content:stretch}.practice-side-stack.both-side-panels>div{min-height:0;display:grid}.practice-layout.main-centered{grid-template-columns:minmax(0,1fr)}.practice-side-stack.both-side-panels .practice-mode-card,.metronome-panel{height:100%}.compact-timer-badge{display:none}.compact-timer-badge.persistent{display:inline-grid}.footer-brand-mark{display:none}.metronome-panel .tempo-card,.metronome-panel .action-grid,.metronome-panel .play-row{margin-top:auto}.practice-layout.main-centered .tempo-card,.practice-layout.main-centered .action-grid,.practice-layout.main-centered .play-row{margin-top:0}}@media (width>=720px) and (orientation:portrait){.practice-layout.main-centered{width:min(100%,980px)}.practice-layout.main-centered .practice-main-wrap{min-height:min(1000px,100dvh - 92px)}.practice-layout.main-centered .metronome-panel{gap:clamp(9px,1.2vh,16px);padding:clamp(15px,2.3vw,22px)}.practice-layout.main-centered .tempo-card{padding-block:clamp(16px,2.4vh,28px)}.practice-layout.main-centered .bpm-display span{font-size:clamp(4rem,11.5vw,6.8rem)}.practice-layout.main-centered .play-action{min-height:clamp(50px,5.6vh,62px)}.practice-layout.main-centered+.app-footer{padding-top:8px}.practice-layout.main-centered+.app-footer .footer-brand-mark{width:min(34vw,130px);max-height:34px;margin-block:0}}@media (width<=430px){.app-shell{--shell-padding:10px}.panel{padding:12px}.tempo-card{padding-inline:12px}.tempo-builder-compact-status{grid-template-columns:auto minmax(72px,1fr);gap:7px 10px;width:100%}.tempo-builder-compact-status p{text-align:right}.tempo-builder-compact-status small{text-align:left}.tempo-builder-compact-status .tempo-bars-left{text-align:right}.stepper{grid-template-columns:42px minmax(0,1fr) 42px;gap:8px}.brand-logo-panel{gap:10px;height:70px}.brand-logo{width:min(56vw,250px);max-height:66px}.brand-name{font-size:clamp(.92rem,3.6vw,1.06rem)}.brand-service{font-size:.58rem}.preset-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:6px}.segmented-control,.action-grid,.stepper{gap:10px}.segmented-control button,.preset-grid button,.sound-mode-control button,.custom-minutes{min-width:0;padding-inline:4px}.metronome-heading-actions{padding-left:6px}.compact-timer-badge{min-width:70px;padding-inline:8px}.metronome-mid-controls{width:100%}.beat-sound-grid{grid-template-columns:repeat(var(--beat-count,6), minmax(0, 1fr));gap:5px;width:100%}.sound-mode-control{gap:4px}.sound-mode-control button{min-width:0;padding-inline:2px;font-size:.58rem}.beat-sound-button{min-height:60px;padding:9px 3px}}
