.pk-ab{--pk-bg:#0d1118;--pk-surface:#151b24;--pk-surface-2:#1b2430;--pk-line:#2b3542;--pk-text:#efeee7;--pk-muted:#a0a59b;--pk-on:#b2ff3a;--pk-off:#ff843d;--pk-accent:var(--pk-off);border:1px solid var(--pk-line);background:radial-gradient(120% 80% at 0% 0%, color-mix(in srgb, var(--pk-accent) 9%, transparent), transparent 55%), linear-gradient(180deg, var(--pk-surface-2), var(--pk-surface) 60%, #121820);max-width:880px;color:var(--pk-text);-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;border-radius:26px;outline:none;margin:0 auto;padding:22px;font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,sans-serif;transition:background .6s;position:relative;box-shadow:0 30px 80px -30px #000c,inset 0 1px #ffffff0d}.pk-ab.is-on{--pk-accent:var(--pk-on)}.pk-ab:focus-visible{box-shadow:0 0 0 2px color-mix(in srgb, var(--pk-accent) 60%, transparent)}.pk-ab__head{justify-content:space-between;align-items:flex-start;gap:16px;margin-bottom:16px;display:flex}.pk-ab__eyebrow{letter-spacing:.18em;text-transform:uppercase;color:var(--pk-muted);font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace}.pk-ab__title{letter-spacing:-.01em;margin:8px 0 0;font-size:20px;font-weight:650}.pk-ab__title span{color:var(--pk-muted);font-weight:450}.pk-ab__badge{border:1px solid var(--pk-line);letter-spacing:.06em;color:var(--pk-text);cursor:help;background:#ffffff08;border-radius:999px;flex-shrink:0;align-items:center;gap:8px;padding:8px 12px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;display:inline-flex}.pk-ab__badge svg{width:14px;height:14px;color:var(--pk-accent);transition:color .4s}.pk-ab__badge-tip{z-index:5;border:1px solid var(--pk-line);letter-spacing:0;width:260px;color:var(--pk-muted);opacity:0;pointer-events:none;background:#0f141b;border-radius:14px;padding:12px 14px;font:400 12.5px/1.45 Inter,system-ui,sans-serif;transition:all .2s;position:absolute;top:62px;right:22px;transform:translateY(-4px)}.pk-ab__badge:hover+.pk-ab__badge-tip,.pk-ab__badge:focus+.pk-ab__badge-tip{opacity:1;transform:none}.pk-ab__lane{border:1px solid var(--pk-line);background:#0b0f15;border-radius:16px;position:relative;overflow:hidden}.pk-ab__clip-head{background:color-mix(in srgb, var(--pk-accent) 16%, #121821);border-bottom:1px solid color-mix(in srgb, var(--pk-accent) 30%, transparent);letter-spacing:.08em;height:26px;color:var(--pk-text);justify-content:space-between;align-items:center;padding:0 12px;font:600 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;transition:background .45s,border-color .45s;display:flex}.pk-ab__clip-head b{color:var(--pk-accent);font-weight:700;transition:color .45s}.pk-ab__canvas-wrap{cursor:pointer;height:150px;position:relative}.pk-ab canvas{width:100%;height:100%;display:block}.pk-ab__hover-time{color:var(--pk-text);pointer-events:none;opacity:0;background:#000000b3;border-radius:6px;padding:3px 6px;font:600 10px/1 ui-monospace,Menlo,monospace;transition:opacity .15s;position:absolute;top:8px;transform:translate(-50%)}.pk-ab__canvas-wrap:hover .pk-ab__hover-time{opacity:1}.pk-ab__loading{letter-spacing:.14em;color:var(--pk-muted);place-items:center;font:600 11px/1 ui-monospace,Menlo,monospace;display:grid;position:absolute;inset:0}.pk-ab__transport{grid-template-columns:auto auto 1fr auto;align-items:center;gap:18px;margin-top:18px;display:grid}.pk-ab__play{border:1px solid var(--pk-line);width:58px;height:58px;color:var(--pk-text);background:linear-gradient(#232d3a,#161d27);border-radius:18px;place-items:center;transition:transform .15s,border-color .3s;display:grid;position:relative;box-shadow:inset 0 1px #ffffff12,0 8px 20px -10px #000000e6}.pk-ab__play:hover{border-color:color-mix(in srgb, var(--pk-accent) 55%, var(--pk-line))}.pk-ab__play:active{transform:scale(.94)}.pk-ab__play svg{width:22px;height:22px}.pk-ab__play .pk-i-pause,.pk-ab.is-playing .pk-ab__play .pk-i-play{display:none}.pk-ab.is-playing .pk-ab__play .pk-i-pause{display:block}.pk-ab__play:after{content:"";border:1px solid var(--pk-accent);opacity:0;border-radius:21px;transition:opacity .3s;position:absolute;inset:-4px}.pk-ab.is-playing .pk-ab__play:after{opacity:.35;animation:1.8s ease-out infinite pk-pulse}@keyframes pk-pulse{0%{opacity:.45;transform:scale(1)}to{opacity:0;transform:scale(1.18)}}.pk-ab__switch{align-items:center;gap:12px;display:flex}.pk-ab__switch-label{gap:6px;display:grid}.pk-ab__switch-label small{letter-spacing:.2em;color:var(--pk-muted);font:600 10px/1 ui-monospace,Menlo,monospace}.pk-ab__switch-label strong{min-width:112px;font-size:14px;font-weight:650;transition:color .4s}.pk-ab__toggle{border:1px solid var(--pk-line);letter-spacing:.12em;background:#0b0f15;border-radius:16px;grid-template-columns:1fr 1fr;align-items:center;width:132px;height:50px;padding:0;font:700 12px/1 ui-monospace,Menlo,monospace;display:grid;position:relative;box-shadow:inset 0 2px 8px #0009}.pk-ab__toggle span{z-index:2;text-align:center;color:var(--pk-muted);transition:color .3s;position:relative}.pk-ab:not(.is-on) .pk-ab__toggle .pk-t-off,.pk-ab.is-on .pk-ab__toggle .pk-t-on{color:#0b0f15}.pk-ab__knob{z-index:1;background:linear-gradient(180deg, color-mix(in srgb, var(--pk-accent) 100%, #fff 18%), var(--pk-accent));width:calc(50% - 4px);height:calc(100% - 8px);box-shadow:0 0 22px -2px color-mix(in srgb, var(--pk-accent) 70%, transparent), inset 0 1px 0 #ffffff80;border-radius:12px;transition:transform .42s cubic-bezier(.65,-.35,.3,1.35),background .4s,box-shadow .4s;position:absolute;top:4px;left:4px}.pk-ab.is-on .pk-ab__knob{transform:translate(100%)}.pk-ab__led{background:var(--pk-accent);width:10px;height:10px;box-shadow:0 0 12px var(--pk-accent);border-radius:50%;flex-shrink:0;transition:background .4s,box-shadow .4s}.pk-ab__hint{white-space:nowrap;background:var(--pk-on);color:#0b0f15;letter-spacing:.1em;pointer-events:none;border-radius:9px;padding:6px 10px;font:700 10px/1 ui-monospace,Menlo,monospace;transition:opacity .3s;animation:1.6s ease-in-out infinite pk-bob;position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%)}.pk-ab__hint:after{content:"";border:5px solid #0000;border-top-color:var(--pk-on);margin-left:-5px;position:absolute;top:100%;left:50%}.pk-ab.has-toggled .pk-ab__hint{opacity:0}@keyframes pk-bob{50%{transform:translate(-50%,-4px)}}.pk-ab__lcd{border:1px solid var(--pk-line);color:var(--pk-accent);letter-spacing:.04em;text-shadow:0 0 10px color-mix(in srgb, var(--pk-accent) 50%, transparent);background:#0a0d12;border-radius:12px;justify-self:center;padding:10px 14px;font:600 15px/1 ui-monospace,SFMono-Regular,Menlo,monospace;transition:color .4s}.pk-ab__lcd em{color:var(--pk-muted);text-shadow:none;font-style:normal}.pk-ab__viz{align-items:flex-end;gap:10px;height:50px;display:flex}.pk-ab__spectrum{border:1px solid var(--pk-line);background:#0a0d12;border-radius:10px;width:150px;height:50px}.pk-ab__meters{gap:4px;height:50px;display:flex}.pk-ab__meter{border:1px solid var(--pk-line);background:#0a0d12;border-radius:4px;width:7px;height:100%;position:relative;overflow:hidden}.pk-ab__meter i{background:linear-gradient(0deg, var(--pk-accent) 0%, var(--pk-accent) 70%, #ffd54a 86%, #ff5a4a 100%);background-position:bottom;background-size:100% 48px;height:0%;position:absolute;bottom:0;left:0;right:0}.pk-ab__foot{color:var(--pk-muted);margin:14px 2px 0;font-size:12.5px;line-height:1.5}.pk-ab__foot kbd{border:1px solid var(--pk-line);color:var(--pk-text);border-radius:5px;padding:1px 6px;font:600 11px ui-monospace,Menlo,monospace}@media (max-width:680px){.pk-ab{border-radius:22px;padding:16px}.pk-ab__head{flex-direction:column}.pk-ab__badge-tip{top:118px;left:16px;right:auto}.pk-ab__canvas-wrap{height:120px}.pk-ab__transport{grid-template-columns:auto 1fr;gap:14px}.pk-ab__switch{justify-self:end}.pk-ab__switch-label{display:none}.pk-ab__lcd{justify-self:start}.pk-ab__viz{justify-self:end}.pk-ab__spectrum{width:110px}}@media (prefers-reduced-motion:reduce){.pk-ab *,.pk-ab{transition:none!important;animation:none!important}}