*{margin:0;padding:0;box-sizing:border-box}body{background:#0a0a0a;color:#ccc;font:14px/1.6 SF Mono,Fira Code,monospace;max-width:980px;margin:0 auto;padding:20px}h1{text-align:center;color:#fff;margin-bottom:20px;letter-spacing:4px}h3{color:#888;margin-bottom:8px}.zones{display:flex;gap:12px;margin-bottom:12px}.zone{flex:1;min-width:180px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;border:2px dashed #333;border-radius:8px;padding:24px 12px;cursor:pointer;transition:border-color .2s,background .2s}.zone:hover,.zone.drag{border-color:#666;background:#111}.zone.loaded{border-color:#4a4;border-style:solid}.zone-icon{min-height:34px;font-size:24px;display:grid;place-items:center}.hint{font-size:11px;color:#555}#text-input{width:100%;padding:10px;margin-bottom:12px;background:#111;color:#ccc;border:1px solid #333;border-radius:6px;resize:vertical;font:inherit}#text-input::placeholder{color:#444}.options{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-bottom:12px;color:#777;font-size:12px}.options label{display:flex;align-items:center;gap:8px}.options select{background:#111;color:#ddd;border:1px solid #333;border-radius:6px;padding:6px 8px;font:inherit}.options .range-option{display:flex;align-items:stretch;flex-direction:column;gap:4px;min-width:min(320px,100%)}.range-head{display:flex;justify-content:space-between;gap:12px}.check-option{color:#999;white-space:nowrap}.check-option input{accent-color:#777}.options input[type=range]{width:100%;accent-color:#777}#fourier-span-label{color:#ddd;white-space:nowrap}.actions{display:flex;gap:8px;margin-bottom:12px;flex-wrap:wrap}.actions button{flex:1;min-width:100px;padding:10px;background:#1a1a1a;color:#ddd;border:1px solid #333;border-radius:6px;cursor:pointer;font:inherit;font-weight:700;letter-spacing:1px;transition:background .2s,border-color .2s}.actions button:hover{background:#222;border-color:#555}.actions button:active{background:#333}.actions button:disabled{cursor:not-allowed;opacity:.45;background:#111;border-color:#222}.status{text-align:center;padding:6px;margin-bottom:12px;min-height:28px;font-size:13px;color:#666}.status.ok{color:#4a4}.status.err{color:#c44}.hidden{display:none!important}#output{display:flex;flex-direction:column;gap:16px}.panel{background:#111;border:1px solid #222;border-radius:8px;padding:16px}#preview{width:100%;max-width:512px;height:auto;image-rendering:pixelated;display:block;margin-bottom:8px}#extract-preview{width:100%;max-width:512px;height:auto;display:block;margin-bottom:8px}#text-content{background:#0a0a0a;padding:12px;border-radius:4px;max-height:200px;overflow:auto;white-space:pre-wrap;word-break:break-all;font-size:12px;margin-bottom:8px}audio{width:100%;margin-bottom:8px}a{color:#68f;text-decoration:none;font-size:13px}a:hover{text-decoration:underline}@media(max-width:600px){.zones{flex-direction:column}.zone{min-width:unset}.actions{flex-direction:column}.actions button{min-width:unset}}