.demo-shell{display:grid;grid-template-columns:minmax(280px,.78fr) minmax(0,1.22fr);gap:18px}.upload-panel,.result-panel{min-width:0;border:1px solid color-mix(in srgb,var(--color-text) 15%,transparent);border-radius:20px}.upload-panel{display:grid;align-content:start;gap:16px;padding:20px;background:color-mix(in srgb,var(--color-surface) 94%,var(--color-accent))}.key-field{display:grid;gap:7px}.key-field span{color:var(--color-text);font-size:13px;font-weight:850}.key-field input{width:100%;min-height:46px;box-sizing:border-box;border:1px solid color-mix(in srgb,var(--color-text) 22%,transparent);border-radius:10px;padding:0 13px;background:var(--color-surface);color:var(--color-text);font:inherit}.key-field input:focus{outline:2px solid color-mix(in srgb,var(--color-accent) 55%,transparent);outline-offset:2px}.key-field small{color:var(--color-muted);font-size:12px;line-height:1.55}.drop-zone{display:grid;place-items:center;min-height:230px;padding:28px;border:1px dashed color-mix(in srgb,var(--color-text) 35%,transparent);border-radius:14px;cursor:pointer;text-align:center;transition:border-color .16s ease,transform .16s ease}.drop-zone.dragging{border-color:var(--color-accent);transform:translateY(-2px)}.drop-zone input{position:absolute;width:1px;height:1px;opacity:0}.upload-mark{display:grid;place-items:center;width:46px;height:46px;margin-bottom:18px;border-radius:50%;background:var(--color-text);color:var(--color-surface);font-size:24px}.drop-zone strong{color:var(--color-text);font-size:20px}.drop-zone small{max-width:100%;margin-top:8px;overflow-wrap:anywhere;color:var(--color-muted);line-height:1.5}.progress-row{display:grid;grid-template-columns:1fr auto;gap:8px;color:var(--color-muted);font-size:12px;font-weight:800;letter-spacing:.04em;text-transform:uppercase}.progress-row i{grid-column:1/-1;height:4px;overflow:hidden;border-radius:99px;background:color-mix(in srgb,var(--color-text) 10%,transparent)}.progress-row em{display:block;height:100%;background:var(--color-accent);transition:width .25s ease}.upload-panel button{min-height:48px;border:0;border-radius:10px;background:var(--color-text);color:var(--color-surface);font:inherit;font-weight:850;cursor:pointer}.upload-panel button:disabled{cursor:not-allowed;opacity:.36}.error-message{margin:0;color:#b42318;font-size:14px;font-weight:700;line-height:1.5}.result-panel{overflow:hidden;padding:24px;background:#101411;color:#e9f0e9;box-shadow:0 26px 70px #00000029}.result-panel header{display:flex;align-items:end;justify-content:space-between;gap:20px;padding-bottom:20px;border-bottom:1px solid rgb(255 255 255/.1)}.result-panel header span,.cut-group h3{color:#8d9a90;font:800 10px/1 ui-monospace,monospace;letter-spacing:.1em;text-transform:uppercase}.result-panel h2{margin:0;color:#f5f8f5;font-size:24px}.rhythm-preview{display:grid;gap:12px;margin:20px 0 24px}.preview-screen{display:grid;place-items:center;min-height:190px;border:1px solid rgb(255 255 255/.16);border-radius:10px;transition:background 90ms linear,color 90ms linear}.preview-screen[data-tone=light]{background:#f5f8f5;color:#101411}.preview-screen[data-tone=dark]{background:#050605;color:#f5f8f5}.preview-screen span{align-self:end;font:800 10px/1 ui-monospace,monospace;letter-spacing:.12em;text-transform:uppercase}.preview-screen strong{align-self:start;font:750 clamp(56px,8vw,86px)/1 ui-monospace,monospace}.transport{display:flex;flex-wrap:wrap;align-items:center;gap:8px}.transport button{min-height:38px;min-width:74px;border:1px solid rgb(255 255 255/.16);border-radius:7px;padding:0 13px;background:#202720;color:#eef4ee;font:inherit;font-size:13px;font-weight:800;cursor:pointer}.transport button:disabled{cursor:not-allowed;opacity:.34}.transport span{margin-left:auto;color:#9da89f;font:700 12px/1 ui-monospace,monospace;font-variant-numeric:tabular-nums}.timeline{padding:10px;border:1px solid rgb(255 255 255/.1);border-radius:8px;background:#ffffff09}.waveform{position:relative;display:flex;align-items:center;gap:1px;height:72px;overflow:hidden}.wave-bar{flex:1 1 0;min-width:1px;border-radius:99px;background:#7f9785;opacity:.62}.beat-marker,.cut-marker,.playhead{position:absolute;inset-block:0;width:1px;transform:translate(-50%)}.beat-marker{background:#ffffff2e}.cut-marker{width:2px;background:#f6a44c}.cut-marker.active{width:4px;background:#ff624d}.playhead{width:2px;background:#f5f8f5}.preview-hint{margin:0;color:#8d9a90;font-size:12px;line-height:1.5}.rhythm-preview audio{display:none}.metrics{display:grid;grid-template-columns:repeat(3,1fr);gap:1px;margin:20px 0;background:#ffffff1a}.metrics p{display:grid;gap:6px;margin:0;padding:16px;background:#101411}.metrics span{color:#829086;font:800 10px/1 ui-monospace,monospace}.metrics strong{font:700 28px/1 ui-monospace,monospace}.cut-group{margin-top:22px}.cut-group ol{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;padding:0;list-style:none}.cut-group li{display:flex;justify-content:space-between;gap:8px;padding:9px;border:1px solid rgb(255 255 255/.08);border-radius:6px}.cut-group code,.cut-group li span,.styles p{color:#c8d2ca;font:600 11px/1.4 ui-monospace,monospace}.cut-group li span{color:#77827a}.styles details{padding:11px 0;border-top:1px solid rgb(255 255 255/.08)}.styles summary{display:flex;justify-content:space-between;cursor:pointer;font-size:13px;font-weight:750}.styles details code{display:block;padding-top:10px;line-height:1.8}.result-placeholder{display:grid;gap:16px;padding-top:30px}.result-placeholder i{height:12px;border-radius:3px;background:#ffffff12}@media(max-width:800px){.demo-shell{grid-template-columns:1fr}.cut-group ol{grid-template-columns:repeat(2,minmax(0,1fr))}}.demo-hero[data-astro-cid-aviav6tg]{display:grid;gap:14px;max-width:820px;margin-bottom:30px}.eyebrow[data-astro-cid-aviav6tg]{margin:0;color:var(--color-accent);font-weight:850;letter-spacing:.1em;text-transform:uppercase}h1[data-astro-cid-aviav6tg]{margin:0;color:var(--color-text);font-size:clamp(42px,6vw,68px);line-height:.98;letter-spacing:-.045em}p[data-astro-cid-aviav6tg]{margin:0;color:var(--color-muted);font-size:18px;line-height:1.7}.demo-disabled[data-astro-cid-aviav6tg]{max-width:820px;padding:22px;border:1px solid color-mix(in srgb,var(--color-text) 15%,transparent);border-radius:14px}