@charset "UTF-8";
:root{--paper:#f4f3ee;--ink:#202d28;--muted:#68736b;--green:#204e42;--lime:#d6edaa;--line:#dddfd6;--white:#fffefb;--red:#923a33;font-family:Inter,"Segoe UI",Arial,sans-serif;color:var(--ink);background:var(--paper);font-synthesis:none;font-size:15px}*{box-sizing:border-box}body{margin:0}button,input,a{-webkit-tap-highlight-color:transparent}button,a,input,summary{touch-action:manipulation}button,input{font:inherit}a{color:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed}button:focus-visible,a:focus-visible,input:focus-visible,summary:focus-visible{outline:3px solid #798e4e;outline-offset:4px}[hidden]{display:none!important}.topbar{max-width:1280px;margin:auto;padding:25px 44px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line)}.wordmark{display:flex;gap:10px;align-items:center;font-size:21px;font-weight:750;text-decoration:none;letter-spacing:-.8px}.brand-icon{display:grid;place-items:center;background:var(--green);color:var(--lime);width:30px;height:32px;border-radius:7px;font-size:25px}.beta{font-size:9px;letter-spacing:1.8px;font-weight:600;color:var(--muted);margin-left:10px}.help-link{font-size:12px;text-decoration:none;padding:10px 0}.help-link span{margin-left:10px}main{max-width:1192px;padding:0 28px;margin:0 auto}.workspace{padding-top:39px}.tool-heading{display:flex;justify-content:space-between;align-items:flex-end;margin-bottom:26px;gap:20px}.eyebrow{font-size:10px;font-weight:700;letter-spacing:2px;color:var(--muted);margin:0 0 13px}h1{font-size:clamp(38px,4.3vw,58px);font-weight:650;letter-spacing:-2.8px;line-height:1.03;margin:0}.title-dot{color:#829344}.intro{color:var(--muted);font-size:14px;margin:14px 0 0;line-height:1.5}.privacy{display:flex;align-items:center;gap:8px;font-size:11px;white-space:nowrap;margin-bottom:3px}.live-dot{height:6px;width:6px;border-radius:50%;background:var(--green);box-shadow:0 0 0 4px #e4e8db}.tool-grid{display:grid;grid-template-columns:1fr 1fr;border:1px solid #d5dacd;border-radius:15px;overflow:hidden;background:var(--white);box-shadow:0 7px 25px #253d2710}.input-panel,.result-panel{padding:26px 30px;min-width:0}.input-panel{border-right:1px solid var(--line)}.result-panel{background:#f0f2e9;display:flex;flex-direction:column}.panel-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:23px}.panel-heading h2{font-size:13px;font-weight:650;margin:0;display:flex;align-items:center;gap:10px}.step{font-family:Consolas,monospace;font-size:10px;color:#68776b;border:1px solid #d6dccf;border-radius:50%;width:23px;height:23px;display:grid;place-items:center}.panel-tag{font-size:8px;font-weight:700;letter-spacing:1.2px;color:#75816f}.dropzone{width:100%;border:1.5px dashed #aab69a;background:#f6f8f0;border-radius:9px;min-height:202px;display:flex;flex-direction:column;align-items:center;justify-content:center;color:var(--ink);gap:8px;transition:background .15s,border-color .15s,transform .15s}.dropzone:hover,.dropzone.dragging{background:#eaf0dd;border-color:var(--green)}.dropzone.dragging{transform:scale(.99)}.upload-symbol{display:grid;place-items:center;width:43px;height:43px;border-radius:50%;background:#e7ecd9;margin-bottom:4px}.upload-symbol svg{width:26px;fill:none;stroke:var(--green);stroke-linecap:round;stroke-linejoin:round;stroke-width:1.5}.dropzone strong{font-size:17px;font-weight:600;letter-spacing:-.5px}.dropzone>span:not(.upload-symbol){font-size:12px;color:var(--muted)}.dropzone .format-note{font-size:10px!important;margin-top:11px;letter-spacing:.15px}.source-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin:12px 0 23px}.small-label{font-size:9px;color:var(--muted)}.text-button{border:0;background:none;color:var(--green);font-size:11px;font-weight:600;padding:8px 0;white-space:nowrap;min-height:32px}.settings{margin-bottom:20px}.settings label{font-size:11px;font-weight:650;display:flex;justify-content:space-between;align-items:center}.settings label span{font-weight:500;font-size:10px;color:var(--muted)}input[type=range]{width:100%;accent-color:var(--green);height:22px;margin:7px 0 0}.range-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:9px}.primary{display:flex;align-items:center;justify-content:space-between;min-height:48px;padding:0 18px;border:1px solid var(--green);border-radius:7px;background:var(--green);color:white;font-weight:600;font-size:13px;width:100%;text-decoration:none;transition:background .15s,transform .1s}.primary:hover{background:#153f34}.primary:active{transform:translateY(1px)}.primary:disabled{background:#e8ebe3;border-color:#e8ebe3;color:#87917f}.primary span{font-size:21px;font-weight:400}.status{font-size:10px;color:var(--muted);text-align:center;line-height:1.6;margin:12px 0 0;min-height:16px}.error{font-size:12px;line-height:1.6;color:var(--red);padding:12px;background:#f9eeea;border-radius:7px;margin:12px 0 0;overflow-wrap:anywhere}.selected{display:flex;align-items:center;gap:12px;min-height:112px;border:1px solid #cdd6bf;border-radius:9px;background:#f6f8f0;padding:18px}.file-icon{font-size:24px;color:var(--green);width:40px;flex-shrink:0;text-align:center}.file-details{min-width:0;flex:1}.file-details strong{font-size:13px;display:block;overflow-wrap:anywhere}.file-details span{display:block;color:var(--muted);font-size:11px;margin-top:6px}audio{width:100%;height:36px;margin:0 0 19px}.progress-copy{display:flex;align-items:center;justify-content:space-between;font-size:11px;gap:10px;padding-top:12px}progress{width:100%;height:5px;accent-color:var(--green);border:0;border-radius:10px;background:#e6eadf}progress::-webkit-progress-bar{background:#e6eadf;border-radius:10px}progress::-webkit-progress-value{background:var(--green);border-radius:10px}.empty-result{display:flex;flex:1;min-height:273px;align-items:center;justify-content:center;flex-direction:column;text-align:center;padding:12px}.empty-result>strong{font-family:Georgia,serif;font-size:21px;font-weight:400;letter-spacing:-.5px;margin-top:26px}.empty-result p{font-size:12px;color:#74806f;line-height:1.8;margin-top:12px}.empty-roll{position:relative;width:205px;height:96px;background:repeating-linear-gradient(to bottom,transparent 0 15px,#dfe5d5 15px 16px),repeating-linear-gradient(to right,transparent 0 33px,#dfe5d5 33px 34px);border-left:2px solid #d4dbca;opacity:.9}.empty-roll i{position:absolute;height:8px;background:#bdc9a7;border-radius:2px;width:34px}.empty-roll i:nth-child(1){top:68px;left:8px}.empty-roll i:nth-child(2){top:52px;left:42px;width:22px}.empty-roll i:nth-child(3){top:36px;left:65px}.empty-roll i:nth-child(4){top:20px;left:100px;width:40px;background:#768d5a}.empty-roll i:nth-child(5){top:36px;left:141px;width:24px}.empty-roll i:nth-child(6){top:52px;left:166px;width:36px}.empty-roll i:nth-child(7){top:84px;left:100px;width:65px;opacity:.4}.result-bottom{border-top:1px solid #dce2d2;display:flex;align-items:center;gap:12px;padding-top:16px;margin-top:22px}.result-bottom p{font-size:10px;line-height:1.65;color:#6c7866;margin:0}.tiny-note{font-family:Georgia,serif;font-size:27px;color:#8c9d77}.under-tool{display:flex;gap:30px;justify-content:center;padding:20px 0 0;color:var(--muted);font-size:10px}.under-tool span span{color:#59734f;margin-right:6px}.result-summary{display:flex;align-items:center;gap:28px;margin:2px 0 20px;font-variant-numeric:tabular-nums}.result-summary>div{display:flex;flex-direction:column;gap:3px}.result-summary strong{font-size:25px;font-weight:600;letter-spacing:-1px}.result-summary div span{font-size:10px;color:var(--muted)}.ready-badge{margin-left:auto;color:var(--green);background:#dfe9ce;padding:6px 8px;font-size:8px;font-weight:700;letter-spacing:1px;border-radius:4px}.roll-shell{background:#fcfdf8;border:1px solid #d9dfce;border-radius:7px;overflow:hidden}canvas{display:block;width:100%;height:190px}.roll-caption{display:flex;justify-content:space-between;font-size:8px;letter-spacing:1px;color:var(--muted);margin-top:8px}.listen-row{display:flex;gap:14px;align-items:center;margin:18px 0}.secondary{border:1px solid #b8c6ac;background:transparent;color:var(--green);padding:10px 13px;border-radius:5px;font-size:11px;min-height:40px;white-space:nowrap}.secondary:hover{background:#e3e9d9}.listen-note{font-size:9px;line-height:1.5;color:var(--muted);max-width:125px}.download{background:var(--lime);border-color:var(--lime);color:var(--green)}.download:hover{background:#cae496}.result-footnote{text-align:center;color:var(--muted);font-size:9px;margin:10px 0 0}.note-details{margin-top:15px;font-size:11px}.note-details summary{cursor:pointer;padding:8px 0;color:var(--green)}.note-table-wrap{max-height:170px;overflow:auto}table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums;font-size:11px}td,th{text-align:left;padding:8px;border-bottom:1px solid var(--line)}th{font-weight:600;color:var(--muted)}.guide{display:grid;grid-template-columns:1fr 1.5fr;gap:65px;padding:65px 0 56px;margin-top:55px;border-top:1px solid var(--line)}.guide h2,.faq h2{font-size:32px;font-family:Georgia,serif;font-weight:400;line-height:1.15;letter-spacing:-1px;margin:0}.guide-content{display:grid;grid-template-columns:1fr 1fr;gap:28px 34px}.guide article h3{font-size:13px;line-height:1.5;margin:0 0 10px;font-weight:650}.guide article p,.faq p{color:var(--muted);font-size:12px;line-height:1.85;margin:0}.faq{display:grid;grid-template-columns:1fr 1.5fr;gap:65px;border-top:1px solid var(--line);padding:50px 0 60px}.faq details{border-bottom:1px solid var(--line)}.faq summary{font-size:12px;cursor:pointer;line-height:1.5;padding:17px 23px 17px 0;position:relative;list-style:none}.faq summary::-webkit-details-marker{display:none}.faq summary:after{content:'+';position:absolute;right:0;color:var(--green);font-size:17px;top:13px}.faq details[open] summary:after{content:'−'}.faq p{padding:0 20px 20px 0}footer{max-width:1192px;padding:25px 28px 36px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:20px;border-top:1px solid var(--line)}footer .wordmark{font-size:17px;gap:0}footer p,footer>span{color:var(--muted);font-size:10px;line-height:1.7}footer a{text-underline-offset:3px}@media(min-width:1450px){.workspace{padding-top:55px}.dropzone{min-height:225px}.input-panel,.result-panel{padding:30px 34px}}@media(max-width:760px){.topbar{padding:18px 22px}.beta{display:none}main{padding:0 20px}.workspace{padding-top:28px}.tool-heading{display:block;margin-bottom:22px}.privacy{margin-top:18px;font-size:10px}.intro{font-size:12px}h1{letter-spacing:-2px;font-size:43px}.tool-grid{grid-template-columns:1fr}.input-panel{border-right:0;border-bottom:1px solid var(--line)}.input-panel,.result-panel{padding:22px}.panel-heading{margin-bottom:18px}.dropzone{min-height:180px}.panel-tag{font-size:7px}.source-row{gap:5px;flex-wrap:wrap;margin-bottom:17px}.small-label{font-size:8px}.text-button{min-height:40px}.empty-result{min-height:230px}.under-tool{gap:9px;flex-wrap:wrap;font-size:8px;justify-content:flex-start;line-height:1.8}.guide,.faq{grid-template-columns:1fr;gap:25px;padding:35px 0;margin-top:30px}.faq{margin-top:0}.guide-content{gap:24px;grid-template-columns:1fr}.guide h2,.faq h2{font-size:29px}.guide h2 br{display:none}footer{padding:22px 20px;flex-wrap:wrap;gap:6px 16px}footer>span{width:100%}footer p{margin-left:auto}.listen-row{gap:10px}.ready-badge{font-size:7px}.result-summary{gap:20px}.result-summary strong{font-size:24px}canvas{height:180px}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{scroll-behavior:auto!important;transition:none!important;animation:none!important}}

.settings .cleanup{display:flex;justify-content:flex-start;gap:7px;font-size:10px;font-weight:400;color:var(--muted);margin-top:12px;min-height:28px;line-height:1.5}.cleanup input{accent-color:var(--green);width:15px;height:15px;margin:0;flex-shrink:0}

/* Review round 2: improve small-text legibility without adding first-screen content. */
.small-label{font-size:10px}.panel-tag{font-size:9px}.status,.result-bottom p,.result-footnote{font-size:11px}.listen-note{font-size:10px}.range-labels{font-size:10px}.guide article p,.faq p{font-size:14px}.faq summary{font-size:14px}.settings .cleanup{font-size:11px}.roll-caption{font-size:10px}@media(max-width:760px){.small-label{font-size:10px}.panel-tag{font-size:8px}.privacy{font-size:11px}.source-row{align-items:flex-start}.guide article p,.faq p{font-size:14px}.result-bottom p{font-size:11px}}

#download[aria-disabled="true"]{opacity:.45;cursor:not-allowed;filter:grayscale(1)}
#listen:disabled{opacity:.45;cursor:not-allowed}

/* Noteform studio: one source, one editable timeline. */
.studio-nav{display:flex;gap:6px;flex-wrap:wrap;margin:22px 0 0;padding-bottom:14px;border-bottom:1px solid var(--line)}.studio-nav a{padding:9px 13px;border-radius:7px;font-size:12px;text-decoration:none;color:var(--muted)}.studio-nav a[aria-current=page]{background:var(--green);color:white}.workspace{padding-top:27px}.import-midi{width:100%;margin:12px 0 0;display:flex;justify-content:space-between}.import-midi.emphasized{background:var(--green);color:white}.clip-panel{padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line);margin:18px 0}.clip-heading,.editor-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;font-size:12px}.clip-panel canvas{display:block;width:100%;height:90px;margin:12px 0;border-radius:7px}.clip-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}.clip-fields button{grid-column:1/-1;justify-self:start}.clip-fields label,.note-editor label{display:block;font-size:10px;color:var(--muted)}.clip-fields input,.note-editor input,.note-editor select{font:inherit;font-size:13px;width:100%;min-height:36px;margin-top:5px;padding:8px;border:1px solid #cbd4c2;border-radius:6px;background:#fffefb;color:var(--ink)}.clip-panel p,.import-info,.note-editor p{font-size:11px;line-height:1.6;color:var(--muted)}.transport{margin:12px 0}.transport>label{display:flex;justify-content:space-between;font-size:11px;color:var(--muted)}.transport input{width:100%;accent-color:var(--green)}.transport-buttons{display:flex;gap:8px;margin-top:8px}.transport-buttons button{font-size:11px;padding:8px 12px}.note-editor{margin:18px 0;padding:17px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.editor-heading>div{display:flex;gap:12px}.note-editor fieldset{display:grid;grid-template-columns:1fr 1fr;gap:10px;border:0;padding:12px 0;margin:0}.note-editor button{font-size:11px}.note-editor fieldset:disabled{opacity:.5}.note-editor .danger{color:#923a33}.batch-tools{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:end;border-top:1px solid var(--line);padding-top:13px;margin:4px 0 14px}.batch-tools button{min-height:36px}.note-editor summary{font-size:11px;cursor:pointer}.quantize-tools{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}.quantize-tools button{grid-column:1/-1;justify-self:start}.wav-download{width:100%;margin-top:10px}.roll-shell canvas{cursor:crosshair;touch-action:none;min-height:200px}.note-details button{padding:3px;min-width:44px}.note-picker-label{margin-top:10px}.result-footnote{line-height:1.6}.note-editor .secondary:disabled{opacity:.4} .note-editor input:invalid{border-color:#a45f40}
@media(max-width:640px){.studio-nav{gap:4px;margin-top:14px}.studio-nav a{font-size:10px;padding:8px 9px}.input-panel,.result-panel{padding:20px}.clip-fields input,.note-editor input,.note-editor select{font-size:16px}.tool-heading h1{font-size:37px}.beta{font-size:8px;letter-spacing:1px;margin-left:2px}.topbar{padding-inline:20px}.batch-tools{grid-template-columns:minmax(0,1fr) auto}.note-editor fieldset{min-width:0}.note-editor label{min-width:0}.transport-buttons{flex-wrap:wrap}}

/* Independent cards avoid an empty column when the editor grows. */
.tool-grid{gap:20px;border:0;background:transparent;box-shadow:none;overflow:visible;align-items:start;grid-template-columns:minmax(0,.88fr) minmax(0,1.12fr)}.input-panel,.result-panel{border:1px solid #d5dacd;border-radius:13px;box-shadow:0 5px 18px #253d2709}.input-panel{background:var(--white)}.midi-mode .tool-grid{grid-template-columns:minmax(240px,.6fr) minmax(0,1.4fr)}.midi-mode .input-panel{position:sticky;top:18px}.result-panel .secondary:disabled{opacity:.45;cursor:not-allowed}.result-summary{flex-wrap:wrap}.note-editor details[open]{margin-bottom:10px}
@media(max-width:760px){.tool-grid,.midi-mode .tool-grid{grid-template-columns:1fr}.midi-mode .input-panel{position:static}.input-panel,.result-panel{border-radius:11px}.tool-grid{gap:16px}}

.open-audio{display:block;margin-top:10px;text-align:left;font-size:11px}
