@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;450;500;550;600&display=swap";:root{font-family:DM Sans,Arial,sans-serif;color:#202520;background:#f7f6f2;font-synthesis:none;font-weight:400;--olive:#495d35;--muted:#5f635c;--rule:#a3a69b;--sage:#e8ecde}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,a{touch-action:manipulation}button{font:inherit;cursor:pointer}a{color:inherit}button:disabled{cursor:wait;opacity:.65}button:focus-visible,a:focus-visible{outline:3px solid #78885f;outline-offset:5px}button{color:inherit}h1,h2,p{margin:0}h1,h2,.wordmark{font-family:Georgia,Times New Roman,serif;font-weight:400}html{scroll-behavior:smooth;scroll-padding-top:24px}.page-shell{max-width:1560px;margin:auto;padding:0 4.1%}.site-header{height:78px;border-bottom:1px solid var(--rule);display:flex;align-items:center;justify-content:space-between}.wordmark{display:flex;align-items:center;gap:18px;font-size:36px;letter-spacing:-1.3px;text-decoration:none}.staff-mark{width:54px;height:28px;display:flex;flex-direction:column;justify-content:space-between}.staff-mark i{height:1px;background:currentColor;width:100%}nav{display:flex;align-items:center;gap:44px;font-size:15px}nav a{text-decoration:none}nav button{border:0;background:transparent;padding:12px 0}nav a:hover,nav button:hover{color:var(--olive);text-decoration:underline;text-underline-offset:5px}.intro{padding:27px 0 25px}.intro h1{font-size:clamp(48px,5.85vw,91px);letter-spacing:-.055em;line-height:1.16;white-space:nowrap}.intro p{font-size:clamp(17px,1.55vw,23px);line-height:1.5;letter-spacing:-.025em;margin-top:15px;color:#53584f}.workspace{display:grid;grid-template-columns:55.3% 44.7%;border:1px solid var(--rule);min-height:550px}.upload-side{padding:36px;background:#fff;min-width:0;display:flex}.drop-zone{border:1px dashed #a7aaa0;width:100%;min-height:470px;padding:48px 20px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;transition:background .2s,border-color .2s}.upload-icon{width:68px;height:76px;color:var(--olive);margin-bottom:15px}.drop-zone h2{font-size:clamp(28px,2.7vw,40px);line-height:1.15;letter-spacing:-.045em}.file-hint{color:var(--muted);font-size:16px;margin-top:15px}.file-hint span{padding:0 10px}.button{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:52px;padding:14px 28px;border:1px solid transparent;border-radius:3px;font-size:16px;font-weight:500;text-decoration:none;transition:background .18s,transform .18s}.primary{background:var(--olive);color:#fff}.primary:hover:not(:disabled){background:#394a28}.primary:active:not(:disabled){transform:translateY(1px)}.choose-button{margin-top:36px;width:min(100%,375px)}.text-button{border:0;background:none;padding:5px 0;text-decoration:underline;text-underline-offset:4px;color:var(--olive);display:inline-flex;align-items:center;justify-content:center;gap:7px;font-size:15px}.sample-button{margin-top:24px}.file-input{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%)}.drag-active .drop-zone{background:#eef2e8;border:2px dashed var(--olive)}.preview-side{border-left:1px solid var(--rule);background:var(--sage);padding:24px 26px 25px;display:flex;flex-direction:column;min-width:0}.preview-header{min-height:25px;display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:4px}.preview-label{font-size:11px;letter-spacing:.18em;font-weight:550;color:#364327}.score-paper{background:#faf9f4;flex:1;min-height:350px;height:392px;max-height:420px;overflow:auto;scrollbar-width:thin}.sample-notation{display:block;width:100%;height:100%;object-fit:contain;padding:10px 12px}.preview-side h2{font-size:clamp(23px,2.1vw,32px);letter-spacing:-.04em;line-height:1.17;margin-top:17px}.preview-side>p{font-size:14px;line-height:1.55;margin-top:8px}.how-it-works{display:grid;grid-template-columns:repeat(3,1fr);gap:36px;margin:30px 0 38px}.how-it-works article{border-top:1px solid var(--rule);padding-top:9px}.how-it-works article>span{font-size:15px;color:var(--olive);font-weight:550}.how-it-works h2{font-size:29px;line-height:1.3;letter-spacing:-.05em;margin-top:2px}.how-it-works p{font-size:16px;line-height:1.45;color:#62655d;margin-top:9px;letter-spacing:-.015em}footer{border-top:1px solid var(--rule);padding:13px 0 20px;display:flex;justify-content:space-between;align-items:center;gap:20px;color:var(--muted);font-size:13px}footer p a{text-decoration:none}footer p a:hover{text-decoration:underline}footer .text-button{font-size:13px}.filename{max-width:100%;overflow-wrap:anywhere;font-size:16px;font-weight:500;margin-top:18px}.review-note{max-width:360px;font-size:14px;color:var(--muted);line-height:1.55;margin-top:20px}.retention-note{font-size:12px;color:#75796f;margin-top:24px;line-height:1.5}.has-file .text-button{margin-top:20px}.status-track{font-size:14px;color:var(--olive);display:flex;align-items:center;gap:8px;margin-top:24px;line-height:1.5}.status-dot{height:7px;width:7px;min-width:7px;border-radius:100%;background:var(--olive);animation:pulse 1.4s ease-in-out infinite}.spinning{animation:spin 2.5s linear infinite}.success-symbol{margin-bottom:22px;color:var(--olive)}.download-button{width:min(100%,375px);margin-top:28px}.result-detail{font-size:14px;color:var(--olive);margin-top:16px}.quiet-button{border:0;background:none;font-size:12px;color:var(--muted);margin-top:16px;padding:5px 10px;text-decoration:underline;text-underline-offset:3px}.error-message{font-size:13px;line-height:1.5;padding:12px 16px;background:#f8eeea;color:#873f30;margin-top:20px;max-width:400px;border-left:2px solid #ab5c45;text-align:left}.preview-tabs{display:flex;gap:2px;flex-shrink:0}.preview-tabs button{font-size:11px;background:none;border:0;padding:6px 7px;color:var(--muted)}.preview-tabs button[aria-pressed=true]{color:var(--olive);box-shadow:inset 0 -1px var(--olive)}.score-paper iframe{width:100%;height:100%;min-height:390px;border:0}.source-image{width:100%;height:100%;object-fit:contain}.notation-result{width:100%;min-height:390px;background:#fff}.notation-canvas{overflow:hidden}.preview-message{font-size:13px;padding:20px;color:var(--muted);line-height:1.5}.notation-canvas svg{max-width:100%}.active-preview .score-paper{background:#fff}dialog{max-width:560px;width:calc(100% - 36px);padding:40px;border:1px solid var(--rule);border-radius:4px;background:#f7f6f2;color:#202520}dialog::backdrop{background:#20252070;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px)}dialog h2{font-size:32px;letter-spacing:-.04em;margin:8px 0 20px}dialog p{font-size:15px;line-height:1.7;margin-top:15px;color:#53584f}dialog a{color:var(--olive);text-underline-offset:3px}.icon-button{background:none;border:0;display:flex;padding:7px}.dialog-close{position:absolute;right:15px;top:15px}.dialog-done{margin-top:27px;min-width:120px}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{50%{opacity:.3}}.site-header{height:72px}.intro{padding-top:20px}.workspace{min-height:550px}.score-paper{max-height:412px}@media(min-width:1600px){.page-shell{padding:0 60px}.intro h1{font-size:91px}}@media(max-width:1050px){.page-shell{padding:0 32px}.intro h1{font-size:6.1vw}.intro p{max-width:800px;font-size:18px}.workspace{min-height:505px;grid-template-columns:53% 47%}.upload-side{padding:24px}.drop-zone{padding:30px 16px;min-height:440px}.drop-zone h2{font-size:31px}.preview-side{padding:22px 20px}.score-paper{min-height:325px;max-height:350px}.file-hint{font-size:14px}.how-it-works{gap:24px}.how-it-works h2{font-size:26px}.how-it-works p{font-size:14px}.preview-header{flex-wrap:wrap}.preview-label{font-size:10px}.preview-side h2{font-size:26px}}@media(max-width:740px){.page-shell{padding:0 22px}.site-header{height:73px}.wordmark{font-size:29px;gap:11px}.staff-mark{width:35px;height:22px}nav{gap:20px;font-size:13px}.intro{padding:29px 0 25px}.intro h1{font-size:clamp(40px,8.8vw,62px);white-space:normal;letter-spacing:-.055em;max-width:570px;line-height:1.05}.intro p{font-size:16px;line-height:1.5;margin-top:17px;max-width:520px}.workspace{display:flex;flex-direction:column}.upload-side{padding:20px}.drop-zone{min-height:350px;padding:35px 18px}.drop-zone h2{font-size:32px}.upload-icon{width:53px;height:62px;margin-bottom:16px}.choose-button{margin-top:28px}.button{font-size:15px;min-height:50px}.sample-button{margin-top:20px}.preview-side{border-left:0;border-top:1px solid var(--rule);padding:20px}.score-paper{height:360px;max-height:360px;min-height:300px;flex:auto}.sample-notation{padding:5px 10px}.preview-side h2{font-size:27px;margin-top:16px}.preview-side>p{font-size:13px}.how-it-works{grid-template-columns:1fr;gap:23px;margin:28px 0 30px}.how-it-works h2{font-size:27px;margin-top:4px}.how-it-works p{font-size:15px;max-width:480px}.how-it-works article{padding-top:9px}footer{align-items:flex-start;flex-direction:column;gap:12px;padding:16px 0 24px}.review-note{font-size:13px}.preview-tabs button{font-size:11px}.preview-label{font-size:10px}.has-file{min-height:390px}.error-message{font-size:12px}dialog{padding:30px 24px}dialog h2{font-size:30px}.filename{font-size:15px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation:none!important;transition:none!important}}
