@import url('https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Arabic:wght@400;500;600;700&display=swap');
:root{font-family:'IBM Plex Sans Arabic',Tahoma,sans-serif;color:#eef1f5;background:#10131b;font-size:16px;color-scheme:dark;--muted:#9aa4b6;--accent:#c9f279;--line:#303644}*{box-sizing:border-box}body{margin:0}button,a,input{-webkit-tap-highlight-color:transparent}button{font:inherit;cursor:pointer;border:1px solid var(--line);background:#252b38;color:#edf0f5;border-radius:10px;padding:9px 14px;min-height:44px}button:hover{border-color:#94b95a}button:focus-visible,a:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:4px}button:disabled{opacity:.4;cursor:default}button.active,button.selected{background:#c9f27918;border-color:#a1c960;color:var(--accent)}button.primary{background:var(--accent);color:#182214;border:none;font-weight:600}header{height:94px;max-width:1380px;margin:auto;padding:0 40px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #262c38}.brand{color:inherit;text-decoration:none;display:flex;align-items:center;gap:12px}.brand strong{font-size:30px}.mark{display:grid;place-items:center;background:var(--accent);color:#1b2717;font-size:28px;width:42px;height:42px;border-radius:12px}.brand-sub{color:var(--muted);font-size:14px;border-right:1px solid var(--line);padding-right:16px;margin-right:4px}.device{font-size:14px;color:var(--muted)}main{max-width:1380px;margin:32px auto;padding:0 40px;display:grid;grid-template-columns:300px minmax(0,1fr);gap:24px;align-items:start}.panel{background:#191e29;border:1px solid #2b3240;border-radius:20px;padding:26px}.library{min-height:600px;padding:22px;position:sticky;top:20px}.section-title{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:20px}h2{font-size:20px;margin:0;font-weight:600}h3{font-size:18px}.count{font-size:13px;color:var(--muted);background:#262d3a;border-radius:6px;padding:3px 8px}.import{width:100%}.import-options{display:flex;gap:8px;margin-top:10px}.import-options button{flex:1;font-size:14px;padding:7px}.library-empty{text-align:center;padding:48px 0 35px}.library-empty>span{font-size:44px;color:#a2b48a}.library-empty p{font-size:14px;color:var(--muted);line-height:1.9}.library-empty button{font-size:14px}.local-note{border-top:1px solid var(--line);padding-top:20px;color:var(--muted);font-size:13px;line-height:1.8;margin-top:24px}.track-row{display:flex;align-items:center;gap:8px;border-bottom:1px solid #2b3240;padding:12px 0}.track-row button.track-select{border:0;background:transparent;flex:1;min-width:0;text-align:right;padding:8px;font-size:14px;overflow-wrap:anywhere}.track-row.current{border-radius:10px;background:#c9f27910}.track-row.current .track-select{color:var(--accent)}.track-row small{display:block;color:var(--muted);font-size:12px}.delete{background:transparent;border:0;color:var(--muted);padding:4px 10px}.workspace{display:grid;gap:20px;min-width:0}.eyebrow{color:var(--accent);font-size:13px;letter-spacing:.04em}.track-heading{display:flex;justify-content:space-between;align-items:center;gap:20px}.track-heading h1{font-size:28px;margin:10px 0 4px;line-height:1.5;overflow-wrap:anywhere}.track-heading p{color:var(--muted);font-size:14px;margin:0}.track-icon{width:60px;height:60px;display:grid;place-items:center;border:1px solid #475539;background:#c9f27912;border-radius:18px;color:var(--accent);font-size:30px;flex-shrink:0}canvas{display:block;width:100%;height:92px;margin-top:25px}input[type=range]{width:100%;height:24px;accent-color:var(--accent);cursor:pointer;direction:ltr}input:disabled{opacity:.35}#seek{height:12px}.timeline{display:flex;justify-content:space-between;direction:ltr;font-size:13px;color:var(--muted);font-variant-numeric:tabular-nums}.transport{display:flex;justify-content:center;align-items:center;gap:24px;margin:16px 0 24px;direction:ltr}.transport button{font-size:24px;background:transparent;border:0}.transport small{font-size:13px}.transport .play{background:var(--accent);color:#1a2514;border-radius:50%;width:66px;height:66px;font-size:24px}.player-bottom{display:flex;justify-content:space-between;gap:20px;align-items:center;border-top:1px solid var(--line);padding-top:17px}.loop-controls{display:flex;gap:6px;flex-wrap:wrap}.loop-controls button{font-size:13px;padding:7px 10px}.volume{display:flex;align-items:center;gap:10px;font-size:13px;color:var(--muted);min-width:135px;width:165px}.loop-note{font-size:12px;color:var(--muted);margin-top:10px}.text-button{border:0;background:transparent;color:var(--muted);font-size:14px;padding:4px}.mode-tabs{display:grid;grid-template-columns:repeat(3,1fr);padding:5px;background:#10151f;border:1px solid #303746;border-radius:12px;gap:5px}.mode-tabs button{background:transparent;border:1px solid transparent;font-size:15px}.mode-tabs button.active{background:#2d3825;border-color:#50683a;color:var(--accent)}.mode-help{font-size:14px;color:var(--muted);margin:15px 0 26px;min-height:25px}.sliders{display:grid;grid-template-columns:1fr 1fr;gap:35px}.slider-control label,.effect-grid label{font-size:15px;display:block}.slider-control label{display:flex;justify-content:space-between;gap:8px;margin-bottom:12px}output{color:var(--accent);direction:ltr;display:inline-block;font-variant-numeric:tabular-nums}.slider-control output{font-size:19px;font-weight:600}.range-labels{display:flex;justify-content:space-between;color:var(--muted);font-size:12px;margin-top:4px}.speed-presets{display:flex;gap:6px;margin-top:17px;direction:ltr}.speed-presets button{flex:1;min-height:34px;font-size:13px;padding:4px}.pitch-note{font-size:13px;color:var(--muted);line-height:1.7;margin:15px 0 0}.result-strip{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:25px;background:#111722;border-radius:10px;padding:10px 14px;font-size:14px}.result-strip button{font-size:13px;min-height:36px;padding:5px 12px}.subtle{color:var(--muted);font-size:13px}.effect-presets{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:23px}.effect-presets button{font-size:14px;min-height:38px;padding:5px 15px}.effect-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:22px}.effect-grid output{display:block;font-size:13px;color:var(--muted);margin:6px 0 8px}.effect-grid input{margin:0}footer{display:flex;align-items:center;gap:12px;color:#83916e;font-size:14px;padding:5px 8px 30px}footer span{color:var(--muted);flex:1;font-size:12px}footer button{background:none;border:none;color:var(--muted);font-size:13px;padding:3px}#notice{position:fixed;bottom:24px;left:50%;transform:translateX(-50%);background:#d6ecb5;color:#15200d;padding:12px 22px;border-radius:12px;z-index:10;max-width:90%;width:max-content;font-size:14px;box-shadow:0 8px 40px #0005}dialog{background:#202734;color:#eef1f5;border:1px solid #465163;border-radius:20px;padding:30px;max-width:480px;width:calc(100% - 32px);line-height:1.9}dialog::backdrop{background:#050911b0}.dialog-close{float:left;background:none;border:none;font-size:24px}dialog p{color:#b5bece;white-space:pre-line}.record-note{font-size:13px;color:#ffbcad}.recording{color:#ffbcad!important;border-color:#d78170!important}@media(min-width:1500px){main{margin-top:46px}}@media(max-width:1000px){main{grid-template-columns:250px 1fr;padding:0 24px;gap:18px}.panel{padding:20px}.effect-grid{grid-template-columns:repeat(2,1fr)}.player-bottom{flex-wrap:wrap}.sliders{gap:20px}.brand-sub{display:none}}@media(max-width:700px){header{height:78px;padding:0 20px}.brand strong{font-size:27px}.device{font-size:12px}main{display:flex;flex-direction:column;padding:0 14px;margin:18px auto;gap:18px}.library{position:static;min-height:0;width:100%}.library-empty{padding:15px 0}.library-empty>span,.library-empty h3{display:none}.library-empty p{margin:8px 0}.library-empty button{min-height:36px}.local-note{margin-top:12px;padding-top:12px;font-size:12px}.workspace{width:100%}.panel{border-radius:16px;padding:18px}.track-heading h1{font-size:22px}.track-icon{width:48px;height:48px}.mode-tabs button{font-size:14px;padding:9px 3px}.sliders{grid-template-columns:1fr;gap:28px}.effect-grid{gap:22px}.mode-help{margin-bottom:20px}.result-strip{flex-wrap:wrap}.player-bottom{gap:12px}.volume{width:100%}footer{flex-wrap:wrap}.track-row{padding:5px 0}#library{max-height:230px;overflow-y:auto}}
.range-labels{direction:ltr}
