:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;font-synthesis:none;text-rendering:optimizelegibility}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}html,body,#root{min-height:100%;margin:0}body{min-width:320px}.app-bar{border-bottom:1px solid;border-color:var(--mui-palette-divider);background:var(--mui-palette-background-paper)!important}.wordmark{letter-spacing:-.04em!important;font-family:Fraunces,Georgia,serif!important;font-size:clamp(2rem,7vw,3rem)!important;font-weight:600!important}.wordmark.small{font-size:1.45rem!important}.brand-lockup{align-items:center;gap:16px;display:flex}.logo-support,.small-logo-support{background:#f6f2e9;border-radius:18px;flex:none;place-items:center;display:grid}.logo-support{width:78px;height:78px}.logo-support img{object-fit:contain;width:64px;height:64px}.small-logo-support{border-radius:12px;width:42px;height:42px}.small-logo-support img{object-fit:contain;width:34px;height:34px}.brand-logo-fallback{border-radius:inherit;color:#35594a;text-transform:lowercase;border:2px solid #35594a;place-items:center;width:100%;height:100%;font-family:Fraunces,Georgia,serif;font-weight:700;display:grid}.unlock-page{background:radial-gradient(circle at 50% 15%, color-mix(in srgb, var(--mui-palette-secondary-main) 15%, transparent), transparent 42%);place-items:center;min-height:100dvh;padding:24px;display:grid}.unlock-card{width:min(100%,440px);padding:clamp(12px,3vw,28px);box-shadow:0 24px 80px color-mix(in srgb, var(--mui-palette-primary-main) 12%, transparent)!important}.library-page{width:min(1180px,100%);margin:0 auto;padding:clamp(24px,5vw,64px) clamp(16px,4vw,40px) 120px}.library-controls{border:1px solid var(--mui-palette-divider);grid-template-columns:minmax(240px,1fr) auto auto;align-items:end;gap:14px;margin-bottom:24px;padding:14px;display:grid;background:var(--mui-palette-background-paper)!important;border-radius:16px!important}.library-control-group .MuiTypography-overline{letter-spacing:.08em;line-height:1.2}.library-controls .MuiToggleButtonGroup-root{flex-wrap:wrap}.library-controls .MuiToggleButton-root{min-height:42px;color:var(--mui-palette-text-secondary);text-transform:none;gap:6px;padding-inline:12px;font-weight:600}.library-controls .MuiToggleButton-root.Mui-selected{color:var(--mui-palette-primary-main);background:color-mix(in srgb, var(--mui-palette-primary-main) 13%, transparent)}.library-controls .MuiToggleButton-root svg{width:19px;height:19px}.library-sort-direction{border:1px solid var(--mui-palette-divider)!important;border-radius:10px!important}.song-grid{grid-template-columns:repeat(auto-fill,minmax(min(280px,100%),1fr));gap:16px;display:grid}.empty-state{text-align:center;border:1px dashed var(--mui-palette-divider);border-radius:18px;place-content:center;gap:6px;min-height:280px;display:grid}.workspace-page{min-height:calc(100dvh - 64px);padding-bottom:104px}.workspace-header,.song-toolbar{border-bottom:1px solid var(--mui-palette-divider);background:var(--mui-palette-background-paper);padding:9px clamp(12px,3vw,32px)}.workspace-header{min-height:76px}.workspace-header h1{font-size:clamp(1.35rem,2.2vw,2rem)}.version-selector{gap:2px;min-width:min(220px,28vw);display:grid}.version-selector-label{justify-content:space-between;gap:12px;display:flex}.version-selector .MuiSelect-select{padding-block:9px}.song-toolbar{flex-wrap:wrap;min-height:64px;gap:6px 14px!important}.song-toolbar>*{flex-shrink:0}.song-toolbar-group{flex-wrap:wrap;align-items:center;gap:8px;padding:2px 0;display:flex}.tonal-controls{flex:720px}.song-actions{border-left:1px solid var(--mui-palette-divider);flex:0 auto;margin-left:auto;padding-left:14px}.song-toolbar-group-label{min-width:max-content;color:var(--mui-palette-text-secondary);flex:none;padding:0 4px 0 0;font-weight:700!important;line-height:1.15!important}.semitone-controls{border:1px solid var(--mui-palette-divider);border-radius:11px;display:flex;overflow:hidden}.semitone-controls .MuiIconButton-root{border-radius:0}.semitone-controls .MuiIconButton-root+.MuiIconButton-root{border-left:1px solid var(--mui-palette-divider)}.song-toolbar-group .MuiInputBase-root,.song-toolbar-group .MuiButton-root,.song-toolbar-group .MuiChip-root,.semitone-controls .MuiIconButton-root{min-height:44px}.song-save-state{min-width:max-content;padding-inline:2px}.document-container{width:min(1080px,100% - 32px);margin:18px auto 180px}.document-container.two-columns{width:min(1500px,100% - 24px)}.editor-toolbar{box-sizing:border-box;border:1px solid var(--mui-palette-divider);background:var(--mui-palette-background-paper);clip-path:inset(0 round 14px 14px 0 0);z-index:5;background-clip:padding-box;border-bottom:0;border-radius:14px 14px 0 0;align-items:center;padding:7px 14px 7px 9px;scroll-padding-inline:9px 14px;position:sticky;top:64px;overflow:auto hidden}.editor-toolbar:after{content:"";flex:0 0 2px}.editor-toolbar .MuiIconButton-root{flex:0 0 44px;width:44px;height:44px}.editor-toolbar .MuiInputBase-root{min-height:44px}.editor-paper{border:1px solid var(--mui-palette-divider);background:var(--mui-palette-background-paper);min-height:62dvh;box-shadow:0 24px 60px color-mix(in srgb, var(--mui-palette-primary-main) 8%, transparent);border-radius:0 0 18px 18px;padding-block:clamp(20px,2.5vw,32px);padding-inline:clamp(42px,4vw,48px) clamp(24px,3vw,36px);position:relative}.editor-paper:focus-within{border-color:color-mix(in srgb, var(--mui-palette-primary-main) 52%, var(--mui-palette-divider));box-shadow:0 0 0 2px color-mix(in srgb, var(--mui-palette-primary-main) 12%, transparent), 0 24px 60px color-mix(in srgb, var(--mui-palette-primary-main) 8%, transparent)}.editor-input{white-space:pre-wrap;outline:none;min-height:50dvh;font-size:1.05rem;line-height:1.55}.editor-input:focus,.editor-input:focus-visible{outline:none!important}.editor-input>*{break-inside:avoid}.document-container.two-columns .editor-input,.presentation-overlay.two-columns .editor-input{column-count:2;column-fill:balance;column-gap:clamp(32px,6vw,96px)}.editor-placeholder{color:var(--mui-palette-text-secondary);pointer-events:none;position:absolute;top:clamp(20px,2.5vw,32px)}.music-line-insert-button{z-index:2;width:32px;height:32px;box-shadow:none;left:8px;transform:translateY(-50%);min-width:32px!important;min-height:32px!important;color:var(--mui-palette-secondary-main)!important;background:0 0!important;padding:0!important;position:absolute!important}.music-line-insert-button:before{content:"";border:1px solid color-mix(in srgb, var(--mui-palette-secondary-main) 38%, transparent);background:var(--mui-palette-background-paper);width:16px;height:16px;box-shadow:0 1px 5px color-mix(in srgb, var(--mui-palette-common-black) 10%, transparent);border-radius:50%;position:absolute}.music-line-insert-button svg{z-index:1;width:11px;height:11px;position:relative}.lyric-line,.music-line{min-height:1.55em;margin:0;line-height:1.55}.music-line{color:var(--mui-palette-text-primary);border-radius:8px;padding-inline:0 8px;font-weight:600;position:relative}.music-line:focus-within{background:color-mix(in srgb, var(--mui-palette-secondary-main) 15%, transparent)}.recognized-chord{color:var(--mui-palette-warning-main);cursor:pointer;border-radius:3px;font-weight:750}.recognized-chord:hover,.recognized-chord:focus{outline:2px solid color-mix(in srgb, var(--mui-palette-warning-main) 55%, transparent);outline-offset:2px}.voicing-carousel{width:100%;padding-block:4px 8px}.voicing-diagram svg{width:100%;height:auto;display:block}@media print{.recognized-chord{color:#000;font-weight:800;text-decoration:underline}}.text-bold{font-weight:700}.text-italic{font-style:italic}.text-underline{text-decoration:underline}.text-strike{text-decoration:line-through}.editor-toolbar-status{min-width:max-content;color:var(--mui-palette-text-secondary);align-self:center;padding-inline:6px}.bottom-player{z-index:20;padding:0 clamp(12px, 3vw, 28px) env(safe-area-inset-bottom);border-top:1px solid var(--mui-palette-divider);background:var(--mui-palette-background-paper);box-shadow:0 -16px 50px color-mix(in srgb, var(--mui-palette-primary-main) 12%, transparent);position:fixed;bottom:0;left:0;right:0}.player-audio-element{clip-path:inset(50%);pointer-events:none;width:1px;height:1px;position:absolute;overflow:hidden}.player-timeline{width:100%;height:40px;position:absolute;top:-20px;left:0}.player-timeline .MuiSlider-root{width:100%;padding:0;position:absolute;inset:0}.playhead-slider{z-index:2}.playhead-slider .MuiSlider-rail{opacity:.28;height:5px}.playhead-slider .MuiSlider-track{height:5px}.playhead-slider .MuiSlider-thumb{width:15px;height:15px}.loop-range-slider{z-index:3;pointer-events:none}.loop-range-slider .MuiSlider-rail{opacity:0}.loop-range-slider .MuiSlider-track{background:color-mix(in srgb, var(--mui-palette-secondary-main) 64%, transparent);border:0;border-radius:999px;height:9px}.loop-range-slider .MuiSlider-thumb{border:2px solid var(--mui-palette-background-paper);width:30px;height:30px;color:var(--mui-palette-secondary-main);box-shadow:0 2px 10px color-mix(in srgb, var(--mui-palette-common-black) 24%, transparent);pointer-events:auto}.loop-range-slider .MuiSlider-thumb:before{color:var(--mui-palette-secondary-contrastText);text-align:center;font-size:.72rem;font-weight:800;line-height:26px}.loop-range-slider .MuiSlider-thumb[data-index="0"]:before{content:"A"}.loop-range-slider .MuiSlider-thumb[data-index="1"]:before{content:"B"}.timeline-marker{z-index:4;cursor:pointer;background:0 0;border:0;width:28px;height:40px;padding:0;position:absolute;top:-18px;transform:translate(-50%)}.timeline-marker span{border:3px solid var(--mui-palette-background-paper);background:var(--mui-palette-error-main);width:22px;height:22px;box-shadow:0 2px 8px color-mix(in srgb, var(--mui-palette-common-black) 24%, transparent);border-radius:50%;margin:9px auto;transition:transform .12s,box-shadow .12s;display:block}.timeline-marker:hover span,.timeline-marker:focus-visible span{box-shadow:0 3px 12px color-mix(in srgb, var(--mui-palette-common-black) 32%, transparent);transform:scale(1.14)}.timeline-marker:focus-visible{outline:2px solid var(--mui-palette-secondary-main);outline-offset:-5px;border-radius:8px}.player-row{min-height:72px}.loop-lock-chip{border:1px solid color-mix(in srgb, var(--mui-palette-secondary-main) 45%, transparent);max-width:150px;color:var(--mui-palette-secondary-main)!important;background:color-mix(in srgb, var(--mui-palette-secondary-main) 9%, transparent)!important}.player-expanded{max-height:min(72dvh,640px);padding:14px 0 22px;overflow:auto}.practice-section{border:1px solid var(--mui-palette-divider);background:color-mix(in srgb, var(--mui-palette-background-default) 38%, transparent);border-radius:16px;padding:14px}.practice-section-heading{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:12px;display:flex}.practice-section-heading .MuiTypography-subtitle1{font-weight:700}.playback-settings-grid{grid-template-columns:minmax(170px,.72fr) repeat(2,minmax(240px,1fr));gap:10px;display:grid}.compact-volume,.adjustment-control{border:1px solid var(--mui-palette-divider);background:var(--mui-palette-background-paper);border-radius:12px;min-width:0;padding:10px 12px}.compact-volume .MuiSlider-root{width:min(180px,100%);margin:7px 8px 0;padding-block:8px;display:block}.adjustment-heading{justify-content:space-between;align-items:center;min-height:30px}.adjustment-heading svg{width:19px;height:19px;color:var(--mui-palette-text-secondary)}.adjustment-stepper{align-items:center;margin-top:7px}.adjustment-stepper .MuiIconButton-root{border:1px solid var(--mui-palette-divider);width:40px;height:40px}.adjustment-stepper .MuiInputBase-root,.adjustment-value{min-width:78px;min-height:40px}.adjustment-stepper .MuiSelect-select{padding-block:8px}.adjustment-value{border:1px solid var(--mui-palette-divider);text-align:center;border-radius:10px;place-items:center;display:grid;font-family:ui-monospace,monospace!important;font-weight:650!important}.pitch-sync-control{margin:6px 0 -4px!important}.pitch-sync-control .MuiFormControlLabel-label{color:var(--mui-palette-text-secondary);font-size:.78rem}.loop-builder{background:var(--mui-palette-background-paper);border-radius:12px;gap:10px;padding:12px;display:grid}.loop-point-controls,.loop-save-controls,.marker-create-controls{flex-wrap:wrap;align-items:center;gap:8px;display:flex}.loop-point-controls .MuiButton-root{justify-content:flex-start;min-width:124px}.loop-point-letter{width:24px;height:24px;color:var(--mui-palette-secondary-contrastText);background:var(--mui-palette-secondary-main);border-radius:50%;place-items:center;margin-right:8px;font-weight:800;display:inline-grid}.loop-point-connector{background:var(--mui-palette-divider);width:26px;height:2px}.loop-duration{background:color-mix(in srgb, var(--mui-palette-secondary-main) 10%, transparent);border-radius:999px;padding:5px 8px}.loop-save-controls .MuiTextField-root,.marker-create-controls .MuiTextField-root{width:min(220px,100%)}.loop-save-controls .MuiSelect-root{min-width:138px}.saved-loop-list{margin-top:12px}.saved-loop-list .MuiTypography-overline{color:var(--mui-palette-text-secondary);font-weight:700}.saved-loop{border:1px solid var(--mui-palette-divider);border-radius:12px;align-items:center;gap:10px;padding:7px 8px;display:flex}.saved-loop[data-active=true]{border-color:var(--mui-palette-secondary-main);background:color-mix(in srgb, var(--mui-palette-secondary-main) 10%, transparent)}.saved-loop>.MuiButton-root{min-width:112px}.marker-create-controls{margin-bottom:10px}.marker-list{flex-wrap:wrap}.marker-list .MuiChip-root{min-height:38px}@media (width>=1000px){.player-expanded{grid-template-columns:minmax(0,2fr) minmax(280px,1fr);align-items:start;width:min(100%,1600px);margin-inline:auto;gap:12px!important;display:grid!important}.playback-section{grid-column:1/-1}}@media (width>=1200px){.player-expanded{padding-block:10px 14px}.practice-section{padding:12px}.practice-section-heading{margin-bottom:8px}.playback-section{grid-template-columns:190px minmax(0,1fr);gap:12px;display:grid}.playback-section>.practice-section-heading{margin:4px 0 0}.playback-settings-grid{grid-template-columns:minmax(210px,.72fr) repeat(2,minmax(260px,1fr));align-items:stretch;gap:8px}.compact-volume,.adjustment-control{padding:8px 10px}.loop-builder{grid-template-columns:auto minmax(390px,1fr);align-items:center;gap:8px 12px;padding:10px}.loop-builder>[role=alert]{grid-column:1/-1}.saved-loop-list{margin-top:8px}}.presentation-overlay{z-index:2000;background:var(--mui-palette-background-default);padding:clamp(28px,7vw,100px);position:fixed;inset:0;overflow:auto}.presentation-overlay .editor-paper{min-height:auto;box-shadow:none;background:0 0;border:0;border-radius:0;padding:0}.presentation-overlay .lyric-line,.presentation-overlay .music-line{break-inside:avoid}.voicing-grid{grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;display:grid}.voicing-card{border:1px solid var(--mui-palette-divider);border-radius:16px;padding:8px}.voicing-card svg{width:100%;height:auto;display:block}.center-progress,.splash{place-items:center;min-height:70dvh;display:grid}.splash{min-height:100dvh}.splash img{object-fit:contain;width:88px;height:88px}@media (width<=599px){.app-bar .MuiToolbar-root{padding-inline:10px}.app-bar .MuiButton-root{gap:0;min-width:44px;font-size:0}.workspace-page{min-height:calc(100dvh - 56px)}.workspace-header{z-index:8;position:sticky;top:56px}.document-container{margin-top:12px}.editor-paper{min-height:65dvh;padding:20px 16px 24px 42px}.editor-placeholder{top:20px;left:42px}.presentation-overlay.two-columns{padding:28px 18px}.presentation-overlay.two-columns .editor-input{column-gap:28px}.wordmark.small{display:none}.bottom-player{padding-inline:10px}.player-row{gap:2px!important}.player-row .MuiIconButton-root{width:42px;height:42px}.loop-lock-chip{display:none!important}.player-expanded{max-height:min(78dvh,680px);padding-top:10px}.practice-section{padding:12px}.practice-section-heading{flex-direction:column;align-items:flex-start;gap:8px}.playback-settings-grid{grid-template-columns:1fr}.loop-point-controls .MuiButton-root{flex:120px}.loop-point-connector{display:none}.loop-save-controls .MuiTextField-root,.loop-save-controls .MuiSelect-root,.loop-save-controls>.MuiButton-root,.marker-create-controls .MuiTextField-root,.marker-create-controls>.MuiButton-root{width:100%}.saved-loop{grid-template-columns:auto 1fr auto;display:grid}.saved-loop>.MuiButton-root{min-width:98px}}@media (width<=899px){.workspace-header{grid-template-columns:44px minmax(0,1fr) 44px 44px;align-items:center;gap:6px!important;display:grid!important}.workspace-header>.MuiBox-root:first-of-type{grid-area:1/2}.workspace-header>button[aria-label="Back to library"]{grid-area:1/1}.workspace-header>button[aria-label="Add to favorites"],.workspace-header>button[aria-label="Remove from favorites"]{grid-area:1/3}.workspace-header>button[aria-label=Version\ actions]{grid-area:1/4}.version-selector{grid-area:2/1/auto/-1;width:100%;min-width:0}.song-toolbar{min-height:58px;padding-block:7px;align-items:stretch!important}.mobile-toolbar-summary{width:100%}.mobile-toolbar-summary .MuiButton-root:first-child{flex:1;justify-content:flex-start}.song-toolbar.mobile-panel-open{z-index:40;max-height:min(78dvh,620px);padding:18px 16px calc(22px + env(safe-area-inset-bottom));border-top:1px solid var(--mui-palette-divider);box-shadow:0 -24px 70px color-mix(in srgb, var(--mui-palette-common-black) 24%, transparent);border-radius:18px 18px 0 0;position:fixed;inset:auto 0 0;overflow:auto}.mobile-panel-heading,.song-toolbar.mobile-panel-open .song-toolbar-group{width:100%}.song-toolbar.mobile-panel-open .song-toolbar-group{border:0;margin:0;padding:8px 0 0}.song-toolbar.mobile-panel-open .song-toolbar-group-label{display:none}.song-toolbar.mobile-panel-open .song-actions{grid-template-columns:repeat(2,minmax(0,1fr));display:grid}.song-toolbar.mobile-panel-open .song-actions>*{width:100%}}@media (width>=600px) and (width<=999px){.playback-settings-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.compact-volume{grid-column:1/-1}}@media (width<=999px){.library-controls{grid-template-columns:1fr;align-items:stretch}.library-control-group{min-width:0}.library-controls .MuiToggleButtonGroup-root{width:100%}.library-controls .MuiToggleButton-root{flex:auto}}@media (orientation:landscape) and (height<=520px){.player-expanded{max-height:72dvh}.presentation-overlay{padding-block:24px}}@media print{.app-bar,.workspace-header,.song-toolbar,.editor-toolbar,.bottom-player{display:none!important}.document-container{width:100%;margin:0}.editor-paper{box-shadow:none;border:0}.music-line{color:#000;font-weight:700}}