.demo-launch{display:flex;align-items:center;gap:12px;width:100%;margin-top:16px;padding:12px 14px;text-align:left;border:1px solid #a873ff4d;border-radius:9px;background:linear-gradient(110deg,#8749ff1c,#8749ff05);font-size:14px;font-weight:650}.demo-launch-icon{display:grid;place-items:center;border-radius:50%;width:33px;height:33px;background:#aa75ff;color:#101019;font-size:13px;padding-left:2px}.demo-launch-caption{display:block;color:var(--muted);font-size:11px;font-weight:400;margin-top:3px}.demo-launch-arrow{margin-left:auto;color:#c8a9ff;font-size:25px}.demo-dialog{width:min(1100px,calc(100vw - 32px));padding:28px}.demo-layout{display:grid;grid-template-columns:1.05fr 1fr;gap:28px;align-items:start}.demo-visual{min-width:0}.demo-visual img{width:100%;height:auto;aspect-ratio:3/2;border-radius:10px;display:block;object-fit:contain}.demo-live-label{display:flex;align-items:center;gap:8px;margin:15px 0 10px;color:#d3b8ff;font-size:12px}.demo-dot{width:7px;height:7px;border-radius:50%;background:#687584}.is-playing .demo-dot{background:#9de9b5;box-shadow:0 0 10px #9de9b560}.demo-visual p{font-size:13px;line-height:1.7;color:var(--muted);max-width:340px}.demo-selects{display:grid;gap:12px;margin-bottom:20px}.demo-selects label,.demo-source-label{display:grid;gap:7px;color:var(--muted);font-size:11px;font-weight:550}.demo-dialog select{width:100%;max-width:100%;min-height:41px;padding:9px 12px;border:1px solid #45505b;border-radius:7px;background:#192229;color:#eef0f8;font:inherit;font-size:13px}.demo-controls{display:grid;grid-template-columns:1fr 1fr;gap:17px 20px}.demo-control{display:grid;grid-template-columns:1fr auto;align-items:center;gap:8px;font-size:12px;color:#ecedf5}.demo-control output{color:#cba9ff;font-variant-numeric:tabular-nums;font-size:11px}.demo-dialog input[type=range]{grid-column:1/-1;width:100%;margin:0;height:24px;cursor:pointer;accent-color:#b180ff}.demo-dialog input:focus-visible,.demo-dialog select:focus-visible{outline:2px solid #bc91ff;outline-offset:4px}.demo-toggles{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:22px}.demo-toggles .outline{font-size:11px;min-height:39px;padding:9px 12px}.demo-toggles [aria-pressed=true]{border-color:#cda9ff;background:#8b4cff25;color:#e2ceff}.demo-reset{margin-left:auto;background:none;color:var(--muted);font-size:12px;text-decoration:underline;text-underline-offset:4px}.demo-meter-row{display:flex;gap:12px;align-items:center;margin-top:18px;color:#94a1ae;font-size:10px}.demo-meter-row meter{width:100%;height:8px;appearance:none}.demo-meter-row meter::-webkit-meter-bar{background:#273139;border:0;border-radius:8px}.demo-meter-row meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#9860ff,#9de9b5);border-radius:8px}.demo-player{padding:20px;margin-top:26px;background:#070d125c;border:1px solid var(--line);border-radius:11px}.demo-transport{display:grid;grid-template-columns:110px 1fr 1fr;align-items:end;gap:20px}.demo-transport .buy-button{min-width:0;min-height:43px;padding:10px 15px}.demo-volume-label{display:grid;grid-template-columns:1fr auto;align-items:center;gap:9px;color:var(--muted);font-size:11px;min-width:0}.demo-volume-label output{font-variant-numeric:tabular-nums;color:#cfb5ff}.demo-volume-label input{height:27px!important}#demo-status{font-size:12px;line-height:1.6;color:#cab4e9;margin-top:14px;min-height:20px}.demo-footer{display:flex;gap:20px;align-items:center;justify-content:space-between;padding-top:20px}.demo-footer p{font-size:12px;line-height:1.7}.demo-footer .small{font-size:10px}.demo-footer .outline{flex-shrink:0;font-size:12px}.demo-dialog [hidden]{display:none!important}@media(max-width:760px){.demo-dialog{padding:20px}.demo-layout{grid-template-columns:1fr;gap:20px}.demo-visual img{max-height:190px}.demo-visual p,.demo-meter-row{display:none}.demo-live-label{justify-content:center;margin-bottom:0;font-size:11px}.demo-selects{grid-template-columns:1fr 1fr;gap:10px}.demo-selects label{min-width:0}.demo-dialog select{font-size:12px;padding:8px}.demo-controls{gap:12px 18px}.demo-player{padding:14px;margin-top:20px}.demo-transport{grid-template-columns:85px 1fr;gap:14px}.demo-volume-label{grid-column:1/-1}.demo-transport .buy-button{font-size:13px}.demo-footer{align-items:flex-start;flex-direction:column;gap:14px}.demo-footer .outline{width:100%}.demo-dialog .dialog-top{margin-bottom:18px}.demo-dialog .dialog-top h2{font-size:23px}.demo-selects select{white-space:normal}}@media(prefers-reduced-motion:reduce){.demo-dot{box-shadow:none!important}}

.is-brooo .demo-controls{grid-template-columns:1fr}.is-brooo .demo-transport{grid-template-columns:110px 1fr}

.product[data-product=diddler] .demo-launch{border-color:#fa6baf66;background:linear-gradient(110deg,#b52b6730,#b52b6708)}.product[data-product=diddler] .demo-launch-icon{background:#fa90c2;color:#300b20}.product[data-product=diddler] .demo-launch-arrow{color:#ff9ccc}
.demo-dialog.is-diddler{border:1px solid #bb4e8080;background:radial-gradient(ellipse at 12% 0,#56203955,transparent 54%),linear-gradient(150deg,#1e131f,#121019 75%);box-shadow:0 24px 90px #000b,0 0 50px #c33b7814}.is-diddler .eyebrow,.is-diddler .demo-live-label,.is-diddler .demo-control output,.is-diddler .demo-volume-label output{color:#ffacd3}.is-diddler .demo-visual img{aspect-ratio:1410/1116;border:1px solid #a54e713d}.is-diddler .demo-visual p{max-width:100%}.is-diddler select{background:#251620;border-color:#78425f;color:#ffe8f3}.is-diddler input[type=range]{accent-color:#f383b9}.is-diddler input:focus-visible,.is-diddler select:focus-visible{outline-color:#ff9dcc}.is-diddler .demo-control-rotary{grid-column:1/-1;padding:13px 15px;border:1px solid #ed83b24d;background:linear-gradient(100deg,#ad3b6c20,#7b30450a);border-radius:9px}.is-diddler .demo-control-rotary>span{font-size:14px;font-weight:650;color:#ffdbec}.is-diddler .demo-player{border-color:#a05b793d;background:#140c126b}.is-diddler .demo-transport .buy-button{background:#f48dbd;color:#2b0d1d;border-color:#f48dbd}.is-diddler .demo-toggles [aria-pressed=true]{border-color:#ef8fbd;background:#cb497c26;color:#ffd7e9}.is-diddler #demo-status{color:#e5b4cc}.is-diddler .demo-meter-row meter::-webkit-meter-optimum-value{background:linear-gradient(90deg,#ba3b79,#ffb8d6)}.is-diddler .demo-meter-row meter::-moz-meter-bar{background:linear-gradient(90deg,#ba3b79,#ffb8d6)}.demo-tempo{color:#c3a8b6;font-size:10px;font-variant-numeric:tabular-nums}.demo-panic{border-color:#bd687e;color:#ffc0cf}.is-diddler.is-safety-muted .demo-panic{background:#762239;border-color:#fc8ba6;color:#fff}.demo-safety{font-size:12px;line-height:1.6;color:#ffd0da;border:1px solid #b65a75;background:#6022384d;border-radius:8px;padding:10px 12px;margin:12px 0 0}.is-diddler .demo-footer .outline{border-color:#dc84ae;color:#ffcfE6}
@media(max-width:760px){.is-diddler .demo-visual img{max-height:230px}.is-diddler .demo-controls{gap:11px 16px}.is-diddler .demo-control-rotary{padding:10px 12px}.is-diddler .demo-toggles{gap:7px}.is-diddler .demo-safety{font-size:11px}}