:root{color-scheme:light;--acid:#b8ff3d;--ink:#171a18;--muted:#6b716c;--metal:#d7d7d2;--line:rgba(24,28,25,.2);--display:#101612}
*{box-sizing:border-box}
html,body{min-height:100%;margin:0}
body{background:#101310;color:var(--ink);font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif}
button,input{font:inherit}
.peq-page{min-height:100vh;padding:22px clamp(16px,4vw,64px) 48px;background:radial-gradient(circle at 50% -20%,rgba(104,119,105,.22) 0,transparent 44%),linear-gradient(120deg,rgba(255,255,255,.018) 1px,transparent 1px),#111411;background-size:auto,5px 5px,auto}
.peq-topbar{max-width:1040px;margin:0 auto 48px;display:flex;align-items:center;justify-content:space-between;font:700 10px/1.2 "Courier New",monospace;letter-spacing:.13em}
.peq-brand{display:flex;align-items:center;gap:10px;color:#d9ded8;text-decoration:none}.peq-brand b{color:#8fcf35}.peq-brand__mark{display:grid;place-items:center;width:30px;height:30px;border:1px solid #596159;background:#181c19;color:var(--acid);box-shadow:inset 0 1px rgba(255,255,255,.13),0 2px 8px rgba(0,0,0,.35);font-size:9px}
.peq-engine-state{display:flex;align-items:center;gap:8px;color:#879087}.peq-engine-state i{width:7px;height:7px;border-radius:50%;background:#64aa16;box-shadow:0 0 0 3px rgba(100,170,22,.12)}
.peq-intro{max-width:1040px;margin:0 auto 23px}.peq-intro p{margin:0 0 6px;font:700 9px/1.2 "Courier New",monospace;letter-spacing:.17em;color:#7f8b80}.peq-intro h1{margin:0;font-size:clamp(38px,7vw,74px);line-height:.9;letter-spacing:-.06em;color:#e7ebe6}.peq-intro span{display:block;margin-top:12px;color:#a1aaa2;font-size:14px}
.peq-shell{position:relative;max-width:1040px;margin:0 auto;border:1px solid #777a75;border-radius:11px;background:linear-gradient(115deg,rgba(255,255,255,.72),transparent 22%),repeating-linear-gradient(92deg,rgba(255,255,255,.045) 0 1px,rgba(0,0,0,.018) 1px 3px),linear-gradient(#dcdcd7,#c5c6c1);box-shadow:0 28px 60px rgba(0,0,0,.48),0 5px 12px rgba(0,0,0,.28),inset 0 1px #fff,inset 0 -1px rgba(0,0,0,.25);padding:24px 32px 28px}
.peq-shell:before{content:"";position:absolute;inset:5px;border:1px solid rgba(255,255,255,.65);border-radius:7px;pointer-events:none}
.peq-screw{position:absolute;width:10px;height:10px;border-radius:50%;background:radial-gradient(circle at 35% 30%,#f7f7f4,#858782 58%,#444 100%);box-shadow:0 1px 2px rgba(0,0,0,.45)}.peq-screw:after{content:"";position:absolute;width:6px;height:1px;left:2px;top:4.5px;background:#5f615d;transform:rotate(-24deg)}.peq-screw--tl{left:11px;top:11px}.peq-screw--tr{right:11px;top:11px}.peq-screw--bl{left:11px;bottom:11px}.peq-screw--br{right:11px;bottom:11px}
.peq-panel-head{display:flex;justify-content:space-between;align-items:center;padding:3px 5px 17px}.peq-panel-head strong{display:block;font-size:17px;letter-spacing:-.03em}.peq-panel-head small{display:block;margin-top:2px;font:700 7px/1.2 "Courier New",monospace;letter-spacing:.19em;color:#6e746e}.peq-head-actions{display:flex;align-items:center;gap:9px}.peq-small-btn,.peq-ab{height:32px;border:1px solid #737871;border-radius:4px;background:linear-gradient(#f1f1ed,#b9bab5);box-shadow:0 2px 3px rgba(0,0,0,.2),inset 0 1px #fff;color:#333832;font:700 8px/1 "Courier New",monospace;letter-spacing:.12em;cursor:pointer}.peq-small-btn{padding:0 14px}.peq-small-btn:active,.peq-ab:active{transform:translateY(1px);box-shadow:inset 0 2px 4px rgba(0,0,0,.2)}.peq-ab{display:flex;align-items:center;gap:7px;padding:0 11px}.peq-ab i{width:7px;height:7px;border-radius:50%;background:#5c635d;box-shadow:inset 0 1px 2px rgba(0,0,0,.55)}.peq-ab[aria-pressed="true"] i{background:#ffb12f;box-shadow:0 0 8px rgba(255,177,47,.8)}
.peq-display{position:relative;height:190px;border:3px solid #30352f;border-radius:6px;background:radial-gradient(circle at 50% 80%,rgba(184,255,61,.06),transparent 55%),linear-gradient(#0b100c,#111913);box-shadow:inset 0 0 30px rgba(0,0,0,.8),0 1px #fff;overflow:hidden;padding-right:35px}.peq-display canvas{width:100%;height:100%;display:block}.peq-display__labels{position:absolute;left:13px;right:47px;bottom:9px;display:flex;justify-content:space-between;color:rgba(193,218,189,.37);font:7px/1 "Courier New",monospace}.peq-meter{position:absolute;right:11px;top:13px;bottom:19px;width:11px;border:1px solid #293329;background:#050705;overflow:visible}.peq-meter i{position:absolute;left:1px;right:1px;bottom:1px;height:2%;background:linear-gradient(to top,#73d31a 0 78%,#ffd22b 90%,#ff563c);transition:height 45ms linear}.peq-meter b{position:absolute;bottom:-13px;left:-4px;color:#586258;font:6px/1 "Courier New",monospace}.peq-readout{position:absolute;left:13px;right:46px;top:9px;display:flex;justify-content:space-between;color:#7fe51f;font:700 7px/1 "Courier New",monospace;letter-spacing:.11em}.peq-readout b{color:#80907f;font-weight:400}
.peq-controls{display:grid;grid-template-columns:repeat(6,1fr);margin:0 5px;border-left:1px solid rgba(0,0,0,.11)}.peq-control{min-width:0;display:flex;flex-direction:column;align-items:center;padding:21px 6px 17px;border-right:1px solid rgba(0,0,0,.13);box-shadow:inset 1px 0 rgba(255,255,255,.38);cursor:ns-resize}.peq-control__name{font-size:10px;font-weight:800;letter-spacing:.06em}.peq-control__freq{margin-top:3px;color:#777d76;font:7px/1 "Courier New",monospace;letter-spacing:.1em}.peq-control output{margin-top:8px;min-width:52px;padding:3px 5px;border:1px solid rgba(0,0,0,.18);border-radius:2px;background:#b8bab4;box-shadow:inset 0 1px 2px rgba(0,0,0,.15);color:#2d342e;text-align:center;font:700 8px/1 "Courier New",monospace}
.peq-fader{--position:50%;position:relative;width:68px;height:134px;margin-top:9px;background:repeating-linear-gradient(to bottom,transparent 0 11px,rgba(45,51,46,.34) 11px 12px,transparent 12px 22px);cursor:ns-resize;touch-action:none;user-select:none}.peq-fader:before{content:"";position:absolute;left:50%;top:7px;bottom:7px;width:7px;transform:translateX(-50%);border-radius:5px;background:linear-gradient(90deg,#313632,#777c77 43%,#222622 58%,#141714);box-shadow:inset 1px 0 rgba(255,255,255,.18),inset 0 2px 5px rgba(0,0,0,.75),0 1px rgba(255,255,255,.6)}.peq-fader:after{content:"0";position:absolute;right:4px;top:50%;transform:translateY(-50%);color:#717871;font:6px/1 "Courier New",monospace}.peq-fader__cap{position:absolute;z-index:2;left:50%;bottom:clamp(0px,calc(var(--position) - 10px),114px);width:46px;height:20px;transform:translateX(-50%);border:1px solid #575d57;border-radius:6px;background:linear-gradient(180deg,#f1f2ef 0,#c4c7c3 35%,#929792 55%,#d9dbd7 100%);box-shadow:0 3px 5px rgba(0,0,0,.35),inset 0 1px #fff;pointer-events:none;transition:filter 80ms ease,box-shadow 80ms ease}.peq-fader__cap i{position:absolute;left:6px;right:6px;top:9px;height:2px;background:#242a25;box-shadow:0 1px rgba(255,255,255,.45)}.peq-fader input{position:absolute;z-index:-1;width:1px;height:1px;left:50%;top:50%;opacity:0;pointer-events:none}.peq-fader.is-dragging .peq-fader__cap{filter:brightness(1.08);box-shadow:0 4px 8px rgba(0,0,0,.42),inset 0 1px #fff,0 0 0 2px rgba(101,167,24,.35)}.peq-control:focus-within .peq-fader__cap{outline:2px solid #65a718;outline-offset:2px}
.peq-file{margin:0 5px 15px;border:1px dashed rgba(31,37,32,.34);border-radius:5px;background:rgba(255,255,255,.18);transition:.15s}.peq-file.is-dragging{border-color:#63a516;background:rgba(184,255,61,.08)}.peq-load{width:100%;min-height:61px;display:flex;align-items:center;justify-content:center;gap:13px;border:0;background:transparent;color:#30352f;cursor:pointer}.peq-load__icon{display:grid;place-items:center;width:27px;height:27px;border:1px solid #697069;border-radius:50%;font-weight:300;font-size:17px}.peq-load b,.peq-load small{display:block;text-align:left}.peq-load b{font:800 10px/1.3 "Courier New",monospace;letter-spacing:.12em}.peq-load small{margin-top:4px;color:#737972;font:7px/1.2 "Courier New",monospace;letter-spacing:.08em}
.peq-transport{display:grid;grid-template-columns:42px auto 1fr auto;align-items:center;gap:13px;margin:0 5px}.peq-play{position:relative;width:42px;height:34px;border:1px solid #5e645e;border-radius:4px;background:linear-gradient(#f2f2ee,#afb1ac);box-shadow:0 3px 4px rgba(0,0,0,.25),inset 0 1px #fff;cursor:pointer}.peq-play i{position:absolute;left:16px;top:10px;width:0;height:0;border-top:7px solid transparent;border-bottom:7px solid transparent;border-left:11px solid #293029}.peq-play.is-playing i{left:13px;width:12px;height:13px;border:0;border-left:4px solid #293029;border-right:4px solid #293029}.peq-play:disabled,.peq-export:disabled{opacity:.44;cursor:not-allowed}.peq-time{font:700 8px/1 "Courier New",monospace;color:#4e554e;font-variant-numeric:tabular-nums}.peq-seek{width:100%;height:3px;accent-color:#609d1a;cursor:pointer}.peq-export{height:34px;padding:0 18px;border:1px solid #23331d;border-radius:4px;background:linear-gradient(#caff6f,#8dcf2b);box-shadow:0 3px 5px rgba(0,0,0,.23),inset 0 1px rgba(255,255,255,.62);color:#16200f;font:800 8px/1 "Courier New",monospace;letter-spacing:.1em;cursor:pointer}.peq-export.is-busy{animation:peqPulse 1s ease infinite}
.peq-note{max-width:800px;margin:19px auto 0;color:#8d968e;text-align:center;font-size:11px;line-height:1.6}.peq-note b{color:#c4cbc4}
@keyframes peqPulse{50%{filter:brightness(1.18)}}
@media(max-width:900px){.peq-controls{grid-template-columns:repeat(3,1fr)}.peq-control:nth-child(-n+3){border-bottom:1px solid rgba(0,0,0,.13)}}
@media(max-width:680px){.peq-page{padding-inline:10px}.peq-topbar{margin-bottom:34px}.peq-engine-state{display:none}.peq-shell{padding:20px 14px 22px}.peq-display{height:150px}.peq-controls{grid-template-columns:repeat(2,1fr)}.peq-control:nth-child(-n+4){border-bottom:1px solid rgba(0,0,0,.13)}.peq-transport{grid-template-columns:42px 1fr auto}.peq-time{display:none}.peq-seek{grid-column:2/4;grid-row:2}.peq-export{padding-inline:11px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}