:root{--md-sys-color-primary:#006a6a;--md-sys-color-on-primary:#fff;--md-sys-color-primary-container:#6ff5f5;--md-sys-color-on-primary-container:#002020;--md-sys-color-secondary:#4a6363;--md-sys-color-on-secondary:#fff;--md-sys-color-secondary-container:#cce8e8;--md-sys-color-on-secondary-container:#051f1f;--md-sys-color-tertiary:#4b6078;--md-sys-color-on-tertiary:#fff;--md-sys-color-tertiary-container:#d3e4ff;--md-sys-color-on-tertiary-container:#041c31;--md-sys-color-error:#ba1a1a;--md-sys-color-on-error:#fff;--md-sys-color-error-container:#ffdad6;--md-sys-color-on-error-container:#410002;--md-sys-color-outline:#6f7979;--md-sys-color-background:#fafdfd;--md-sys-color-on-background:#191c1c;--md-sys-color-surface:#fafdfd;--md-sys-color-on-surface:#191c1c;--md-sys-color-surface-variant:#dae5e4;--md-sys-color-on-surface-variant:#3f4948;--md-sys-color-inverse-surface:#2d3131;--md-sys-color-inverse-on-surface:#f4eff4;--md-sys-typescale-h1-font:"Outfit", sans-serif;--md-sys-typescale-h1-size:3.5rem;--md-sys-typescale-body-font:"Inter", sans-serif;--elevation-1:0px 1px 3px 1px #00000026, 0px 1px 2px 0px #0000004d;--elevation-2:0px 2px 6px 2px #00000026, 0px 1px 2px 0px #0000004d;--elevation-3:0px 1px 3px 0px #0000004d, 0px 4px 8px 3px #00000026;transition:background-color .3s,color .3s}@media (prefers-color-scheme:dark){:root{--md-sys-color-primary:#4edada;--md-sys-color-on-primary:#003737;--md-sys-color-primary-container:#004f4f;--md-sys-color-on-primary-container:#6ff5f5;--md-sys-color-secondary:#b1cccc;--md-sys-color-on-secondary:#1c3535;--md-sys-color-secondary-container:#334b4b;--md-sys-color-on-secondary-container:#cce8e8;--md-sys-color-tertiary:#b3c8e8;--md-sys-color-on-tertiary:#1c314b;--md-sys-color-tertiary-container:#334861;--md-sys-color-on-tertiary-container:#d3e4ff;--md-sys-color-background:#191c1c;--md-sys-color-on-background:#e0e3e3;--md-sys-color-surface:#191c1c;--md-sys-color-on-surface:#e0e3e3;--md-sys-color-surface-variant:#3f4948;--md-sys-color-on-surface-variant:#bec9c8;--md-sys-color-outline:#889392}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--md-sys-typescale-body-font);background-color:var(--md-sys-color-background);color:var(--md-sys-color-on-background);flex-direction:column;min-height:100vh;line-height:1.5;display:flex}#app{flex-direction:column;flex:1;gap:2rem;width:100%;max-width:1200px;margin:0 auto;padding:2rem;display:flex}header{text-align:center}h1{font-family:var(--md-sys-typescale-h1-font);font-size:var(--md-sys-typescale-h1-size);color:var(--md-sys-color-primary);letter-spacing:-.02em;font-weight:700}.upload-card{background:var(--md-sys-color-surface-variant);text-align:center;border:2px dashed var(--md-sys-color-outline);cursor:pointer;border-radius:28px;padding:3rem;transition:all .3s cubic-bezier(.4,0,.2,1)}.upload-card:hover,.upload-card.drag-over{background:var(--md-sys-color-primary-container);border-color:var(--md-sys-color-primary);box-shadow:var(--elevation-2);transform:translateY(-2px)}.upload-card .icon{color:var(--md-sys-color-primary);margin-bottom:1rem;font-size:48px}.hidden{display:none!important}.top-toolbar{color:#f1f3f4;z-index:100;background-color:#323639;border-radius:24px;align-items:center;gap:12px;width:max-content;height:48px;margin:0 auto 1.5rem;padding:0 16px;display:flex;box-shadow:0 2px 6px #0003}.toolbar-section{align-items:center;gap:8px;display:flex}.toolbar-divider{background-color:#fff3;width:1px;height:24px;margin:0 4px}.icon-btn{color:#f1f3f4;cursor:pointer;background:0 0;border:none;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;padding:0;transition:background-color .2s;display:flex}.icon-btn:hover{background-color:#ffffff1a}.icon-btn.active{color:#8ab4f8;background-color:#fff3}.icon-btn.active .material-symbols-outlined{font-variation-settings:"FILL" 1}.icon-btn:active{transform:scale(.95)}.icon-btn .material-symbols-outlined{font-size:20px}.toolbar-text{white-space:nowrap;font-family:Inter,sans-serif;font-size:14px;font-weight:500}.zoom-text{text-align:center;width:48px}.toolbar-input{color:#f1f3f4;text-align:center;background-color:#1a1b1c;border:1px solid #fff3;border-radius:4px;outline:none;width:40px;height:28px;font-family:Inter,sans-serif;font-size:14px;transition:border-color .2s}.toolbar-input:focus{border-color:#8ab4f8}.toolbar-input::-webkit-outer-spin-button{-webkit-appearance:none;margin:0}.toolbar-input::-webkit-inner-spin-button{-webkit-appearance:none;margin:0}.toolbar-select{color:#f1f3f4;cursor:pointer;background-color:#1a1b1c;border:1px solid #fff3;border-radius:4px;outline:none;height:28px;padding:0 8px;font-family:Inter,sans-serif;font-size:14px}.toolbar-text-btn{color:#f1f3f4;cursor:pointer;background:0 0;border:none;border-radius:16px;align-items:center;gap:6px;height:32px;padding:0 12px;font-family:Inter,sans-serif;font-size:14px;font-weight:500;transition:background-color .2s;display:flex}.toolbar-text-btn:hover{background-color:#ffffff1a}.toolbar-text-btn .material-symbols-outlined{font-size:18px}.score-navigation-wrapper{flex:1;justify-content:center;align-items:center;gap:1rem;width:100%;display:flex;position:relative}.nav-side-btn{background-color:var(--md-sys-color-primary-container);color:var(--md-sys-color-on-primary-container);cursor:pointer;width:56px;height:56px;box-shadow:var(--elevation-1);border:none;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;transition:all .2s cubic-bezier(.4,0,.2,1);display:flex}.nav-side-btn:hover{background-color:var(--md-sys-color-primary);color:var(--md-sys-color-on-primary);box-shadow:var(--elevation-2);transform:scale(1.05)}.nav-side-btn:active{transform:scale(.95)}.nav-side-btn .material-symbols-outlined{font-size:32px}#viewer-section:fullscreen{background-color:var(--md-sys-color-background);padding:1rem}#viewer-canvas{flex:1;gap:2rem;width:100%;min-height:300px;transition:opacity .5s;display:flex;position:relative}.music-container{box-shadow:var(--elevation-1);background:#f4ecd8;border:1px solid #d4c8a8;border-radius:28px;flex:1;width:100%;padding:1.5rem;overflow-y:auto}.music-container-full{background:#f4ecd8;border:1px solid #d4c8a8;border-radius:28px;flex:1;width:100%;padding-bottom:2rem;position:relative;overflow:auto}#viewer-canvas.full-score-view .music-container-full{background:#f4ecd8;border:none;border-radius:0}.music-container-full>div{width:100%}.music-container-full svg{margin:0 auto;display:block!important}#viewer-section:fullscreen .music-container-full svg{margin:0 auto}#viewer-canvas.full-score-view .music-container{justify-content:center;align-items:center;max-width:1200px;margin:0 auto;display:flex;overflow-y:hidden}#viewer-canvas.full-score-view .music-container>div{max-height:100%;width:100%!important;height:100%!important;display:none!important;position:relative!important}#viewer-canvas.full-score-view .music-container>div.active-page{justify-content:center;align-items:center;display:flex!important}#viewer-canvas.full-score-view .music-container>div.active-page svg{object-fit:contain;max-height:100%;margin:0 auto}#viewer-section:fullscreen .music-container{max-height:calc(100vh - 80px);box-shadow:none;border:none;border-radius:0;padding:.5rem}.music-container svg{height:auto!important}.music-container-full>div{flex-wrap:wrap;justify-content:center;gap:2rem;display:flex}.double-page #music-container>div{flex:1;min-width:45%}.double-page #music-container{column-count:2;column-gap:2rem;display:block}.double-page #music-container svg{break-inside:avoid;margin-bottom:1rem}.loader{border:5px solid var(--md-sys-color-primary-container);border-bottom-color:var(--md-sys-color-primary);box-sizing:border-box;border-radius:50%;width:48px;height:48px;margin:-24px 0 0 -24px;animation:1s linear infinite rotation;display:inline-block;position:absolute;top:50%;left:50%}@keyframes rotation{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.fade-in{animation:.6s cubic-bezier(.4,0,.2,1) forwards fadeIn}.splash-container{text-align:center;color:var(--md-sys-color-primary);flex-direction:column;justify-content:center;align-items:center;gap:1rem;padding:4rem;font-weight:500;display:flex}.splash-container .loader{margin:0;position:static}