#feature-04-container{
  --bg:var(--pink-soft);--panel:#fff9fc;--panel-hi:#fff;--line:rgba(135,36,38,.16);
  --ink:#2a1215;--ink-soft:#6a454d;--ink-dim:#987f84;--plum:#872426;--gold:#b58433;
  --c-clap:#b58433;--c-snare:#c75b91;--c-hat:#4a8a9a;--c-kick:#355f88;
  --c-tom:#795a91;--c-conga:#cf665c;--c-crash:#d89b28;--c-snap:#3c9c8c;
  --serif:var(--font-serif);--sans:var(--font-sans);--mono:var(--font-mono);
}
#feature-04-container.feature-container .card{
  background:linear-gradient(180deg,var(--surface-color),var(--pink-soft));
  border-radius:18px;
  box-shadow:0 24px 60px -34px rgba(92,21,23,.14);
}
#feature-04-container.feature-container .panel{
  background:linear-gradient(180deg,#fff,var(--pink-soft));
}
#feature-04-container footer.foot{
  background:linear-gradient(180deg,#fff,var(--pink-soft));
  border:1px solid var(--line);
  border-radius:18px;
  color:var(--ink);
  padding:18px;
}
#feature-04-container.feature-container .rhythm-step::after{
  background:rgba(135,36,38,.3);
}
#feature-04-container .actions{align-items:flex-start}
#feature-04-container .rhythm-play-volume{display:grid;gap:8px;width:min(100%,250px)}
#feature-04-container .rhythm-play-volume .slider-row{grid-template-columns:56px minmax(50px,1fr) 44px;gap:8px}
#feature-04-container.feature-container .btn-play.is-live{
  background:linear-gradient(135deg,var(--plum),var(--gold));
  color:#fff;
}
#feature-04-container body::before{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
    background-image:radial-gradient(rgba(255,255,255,.028) 1px, transparent 1px);
    background-size:23px 23px;
  }#feature-04-container body::after{
    content:"";position:fixed;inset:0;pointer-events:none;z-index:0;
    background:radial-gradient(130% 130% at 50% -10%, transparent 52%, rgba(0,0,0,.62));
  }#feature-04-container .app{position:relative;z-index:1;max-width:1180px;margin:0 auto;padding:clamp(20px,4vw,46px)}#feature-04-container .dim{color:var(--ink-soft)}#feature-04-container .sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}#feature-04-container .masthead{display:flex;justify-content:space-between;align-items:flex-end;gap:28px;flex-wrap:wrap;margin-bottom:22px}#feature-04-container .brand{display:flex;align-items:flex-end;gap:18px}#feature-04-container .brand-mark{width:56px;height:56px;border-radius:16px;flex:0 0 auto;display:grid;place-items:center;
    background:linear-gradient(135deg,var(--plum),var(--gold));box-shadow:0 14px 34px -10px rgba(213,127,154,.6)}#feature-04-container .brand-mark svg{width:30px;height:30px;color:#2a1b22}#feature-04-container .eyebrow{font-family:var(--mono);font-size:.66rem;letter-spacing:.28em;text-transform:uppercase;color:var(--gold);margin:0 0 8px}#feature-04-container .display{margin:0;font-family:var(--serif);font-weight:900;font-size:clamp(2.7rem,8.4vw,5.4rem);line-height:.86;letter-spacing:-.02em}#feature-04-container .display em{font-style:italic;font-weight:600;color:var(--plum)}#feature-04-container .tagline{margin:12px 0 0;max-width:52ch;color:var(--ink-soft);font-size:.96rem}#feature-04-container .console{min-width:262px;flex:0 1 320px;background:linear-gradient(180deg,var(--panel-hi),var(--panel));
    border:1px solid var(--line);border-radius:18px;padding:16px 18px 14px;box-shadow:0 24px 60px -24px rgba(0,0,0,.7)}#feature-04-container .console-top{display:flex;justify-content:space-between;align-items:center;font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;color:var(--ink-soft);margin-bottom:12px}#feature-04-container .live-dot{width:9px;height:9px;border-radius:50%;background:var(--ink-dim);box-shadow:0 0 0 3px rgba(255,255,255,.05)}#feature-04-container .console.is-live .live-dot{background:var(--plum);animation:feature04-pulse 1.1s ease-in-out infinite}@keyframes feature04-pulse{0%,100%{box-shadow:0 0 0 3px rgba(213,127,154,.28)}50%{box-shadow:0 0 0 9px rgba(213,127,154,0)}}#feature-04-container .lcd{position:relative;background:#0e0b12;border:1px solid #2b2433;border-radius:10px;padding:10px 12px;margin-bottom:14px;overflow:hidden}#feature-04-container .lcd-grid{height:120px;background:repeating-linear-gradient(90deg,transparent 0 13px,rgba(255,255,255,.03) 13px 14px)}#feature-04-container .lcd-bar{position:absolute;left:0;bottom:0;width:100%;height:30%;transform:scaleY(0);transform-origin:bottom;
    background:linear-gradient(0deg,var(--plum),var(--gold));opacity:.55;filter:saturate(1.4);will-change:transform}#feature-04-container .lcd-meta{display:flex;justify-content:space-between;font-family:var(--mono);font-size:.6rem;letter-spacing:.1em;color:var(--ink-dim);padding-top:8px}#feature-04-container .knob-row{display:flex;justify-content:space-between;gap:14px;margin-bottom:12px}#feature-04-container .knob{width:74px;display:flex;flex-direction:column;align-items:center;gap:7px}#feature-04-container .knob-label{font-family:var(--mono);font-size:.56rem;letter-spacing:.16em;text-transform:uppercase;color:var(--ink-soft)}#feature-04-container .knob-val{font-family:var(--mono);font-size:.7rem;font-weight:700;color:var(--gold)}#feature-04-container .console-hint{font-family:var(--mono);font-size:.58rem;letter-spacing:.05em;color:var(--ink-dim);text-align:center;margin:0}#feature-04-container .card{position:relative;overflow:hidden;background:linear-gradient(180deg,rgba(36,30,41,.94),rgba(28,23,34,.94));
    border:1px solid var(--line);border-radius:24px;padding:clamp(20px,3.4vw,38px);
    box-shadow:0 44px 96px -34px rgba(0,0,0,.72);transition:border-color .35s ease}#feature-04-container .card::before{content:"";position:absolute;inset:0 0 auto 0;height:4px;
    background:linear-gradient(90deg,var(--c-kick),var(--c-clap),var(--c-hat),var(--c-snap),var(--c-crash))}#feature-04-container .card:hover{border-color:rgba(213,127,154,.3)}#feature-04-container .card-head{display:flex;justify-content:space-between;align-items:flex-end;gap:22px;flex-wrap:wrap}#feature-04-container .card-head h2{font-family:var(--serif);font-weight:600;font-size:clamp(1.6rem,3vw,2.2rem);margin:0;letter-spacing:-.01em}#feature-04-container .card-head p{margin:8px 0 0;color:var(--ink-soft);font-size:.9rem;max-width:56ch}#feature-04-container .tool-sub{font-family:var(--mono);font-size:.68rem;letter-spacing:.2em;text-transform:uppercase;color:var(--gold)}#feature-04-container .chip{font-family:var(--mono);font-size:.72rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold);
    border:1px solid rgba(226,178,76,.35);border-radius:999px;padding:7px 14px;white-space:nowrap}#feature-04-container .panel{margin-top:26px;background:linear-gradient(180deg,var(--panel),rgba(30,25,36,.72));border:1px solid var(--line);border-radius:18px;padding:18px}#feature-04-container .panel-title{font-family:var(--mono);font-size:.7rem;letter-spacing:.18em;text-transform:uppercase;color:var(--ink-soft);
    display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}#feature-04-container .panel-title .hint{letter-spacing:0;text-transform:none;color:var(--ink-dim);font-size:.66rem}#feature-04-container .actions{display:flex;flex-wrap:wrap;gap:12px;margin-bottom:18px}#feature-04-container .btn{font-family:var(--sans);font-weight:600;font-size:.92rem;cursor:pointer;border-radius:12px;padding:13px 20px;
    border:1px solid transparent;transition:transform .16s,box-shadow .16s,background .16s}#feature-04-container .btn:focus-visible{outline:2px solid var(--plum);outline-offset:2px}#feature-04-container .btn:active{transform:translateY(1px)}#feature-04-container .btn-play{background:linear-gradient(135deg,var(--plum),#c86f8b);color:#2a1520;min-width:150px;font-size:1rem;padding:14px 24px}#feature-04-container .btn-play:hover{box-shadow:0 14px 32px -10px rgba(213,127,154,.72)}#feature-04-container .btn-play.is-live{background:linear-gradient(135deg,#2b2433,#3a3145);color:var(--ink)}#feature-04-container .btn-ghost{background:transparent;border-color:var(--line);color:var(--ink)}#feature-04-container .btn-ghost:hover{border-color:var(--plum);color:var(--plum)}#feature-04-container .transport{display:flex;flex-direction:column;gap:12px}#feature-04-container .slider-row{display:grid;grid-template-columns:66px 1fr auto;align-items:center;gap:14px}#feature-04-container .slider-row .lab{font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-soft)}#feature-04-container .slider-row .val{font-family:var(--mono);font-size:.8rem;font-weight:700;color:var(--gold);min-width:64px;text-align:right}#feature-04-container .slider{-webkit-appearance:none;appearance:none;width:100%;height:6px;border-radius:6px;cursor:pointer;
    background:linear-gradient(90deg,var(--plum),var(--gold)) no-repeat;background-size:calc(var(--p,50) * 1%) 100%;background-color:var(--line)}#feature-04-container .slider::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:var(--ink);
    border:3px solid var(--plum);box-shadow:0 3px 10px rgba(0,0,0,.5);transition:transform .12s}#feature-04-container .slider::-webkit-slider-thumb:hover{transform:scale(1.14)}#feature-04-container .slider::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:var(--ink);border:3px solid var(--plum);box-shadow:0 3px 10px rgba(0,0,0,.5)}#feature-04-container .select{position:relative;display:inline-flex;align-items:center;cursor:pointer}#feature-04-container .select::after{content:"";position:absolute;right:14px;width:8px;height:8px;border-right:2px solid var(--ink-soft);
    border-bottom:2px solid var(--ink-soft);transform:translateY(-2px) rotate(45deg);pointer-events:none}#feature-04-container .select select{appearance:none;-webkit-appearance:none;font-family:var(--mono);font-size:.8rem;color:var(--ink);
    background:var(--panel-hi);border:1px solid var(--line);border-radius:10px;padding:12px 34px 12px 16px;cursor:pointer}#feature-04-container .select select:focus-visible{outline:2px solid var(--plum);outline-offset:2px}#feature-04-container .grid-scroll{overflow-x:auto;overflow-y:hidden;padding-bottom:6px;-webkit-overflow-scrolling:touch;touch-action:pan-x;overscroll-behavior-x:contain}#feature-04-container .rhythm-grid{display:grid;grid-template-columns:116px repeat(var(--cols,16),minmax(24px,1fr));gap:6px;min-width:640px}#feature-04-container .rhythm-corner, #feature-04-container .rhythm-step-number{font-family:var(--mono);font-size:.72rem;color:var(--ink-soft);text-align:center}#feature-04-container .rhythm-corner{position:sticky;left:0;z-index:3;background:var(--panel);color:var(--gold);border-right:1px solid var(--line)}#feature-04-container .rhythm-instrument{display:contents}#feature-04-container .rhythm-instrument .name{margin:0;padding:0 3px 0 0;min-width:0;overflow:hidden;color:var(--ink);font-family:var(--mono);
    font-size:.7rem;font-weight:700;letter-spacing:.03em;white-space:nowrap;text-align:left;
    display:flex;align-items:center;gap:5px;cursor:pointer;position:sticky;left:0;z-index:3;
    background:var(--panel);border-right:1px solid var(--line);transition:color .12s,opacity .12s}#feature-04-container .rhythm-instrument .name:hover{color:var(--gold)}#feature-04-container .rhythm-instrument .name:focus-visible{outline:2px solid var(--gold);outline-offset:-2px;border-radius:4px}#feature-04-container .rhythm-instrument .name.is-dim{opacity:.45}#feature-04-container .name-text{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1 1 auto}#feature-04-container .rhythm-instrument .dot{width:9px;height:9px;border-radius:50%;flex:0 0 auto}#feature-04-container .track-actions{flex:0 0 auto;display:inline-flex;gap:2px;margin-left:auto}#feature-04-container .ta-btn{width:15px;height:15px;padding:0;line-height:1;font-family:var(--mono);font-size:.52rem;font-weight:700;color:var(--ink-soft);
    background:var(--panel-hi);border:1px solid var(--line);border-radius:4px;cursor:pointer;transition:all .12s}#feature-04-container .ta-btn:hover{border-color:var(--plum);color:var(--ink)}#feature-04-container .ta-btn.is-muted{background:var(--ink-dim);border-color:var(--ink-dim);color:#16121a}#feature-04-container .ta-btn.is-soloed{background:var(--gold);border-color:var(--gold);color:#2a1b22}#feature-04-container .rhythm-step{position:relative;width:100%;aspect-ratio:1;min-width:0;padding:0;border:1px solid var(--line);border-radius:5px;
    background:rgba(255,255,255,.02);cursor:pointer;transition:border-color .12s,outline-color .12s,opacity .12s}#feature-04-container .rhythm-step::before{content:"";position:absolute;inset:0;border-radius:4px;background:var(--c);
    opacity:0;transition:opacity .1s;pointer-events:none}#feature-04-container .rhythm-step::after{content:"";position:absolute;left:-1px;top:22%;bottom:22%;width:3px;border-radius:2px;
    background:rgba(244,239,232,.3);pointer-events:none;display:none}#feature-04-container .rhythm-step:hover{border-color:var(--plum)}#feature-04-container .rhythm-step:focus-visible{outline:2px solid var(--plum);outline-offset:1px}#feature-04-container .rhythm-step.beat-start::after{display:block}#feature-04-container .rhythm-step.is-active{border-color:var(--c)}#feature-04-container .rhythm-step.is-active::before{opacity:calc(var(--prob,100) / 100 * .92)}#feature-04-container .rhythm-step.is-dim{opacity:.28;filter:grayscale(.8)}#feature-04-container .rhythm-step.is-current{outline:2px solid var(--ink);outline-offset:2px}#feature-04-container .rhythm-step.is-selected{outline:2px solid var(--gold);outline-offset:1px}#feature-04-container .rhythm-status{margin-top:14px;min-height:1.4em;font-family:var(--mono);font-size:.78rem;color:var(--ink-soft)}#feature-04-container .step-inspector{display:none;flex-direction:column;gap:10px;margin-top:14px;padding:14px 16px;border:1px solid var(--line);
    border-radius:14px;background:linear-gradient(180deg,var(--panel-hi),var(--panel));box-shadow:0 14px 30px -18px rgba(0,0,0,.8)}#feature-04-container .step-inspector.open{display:flex}#feature-04-container .inspector-rows{display:flex;flex-direction:column;gap:10px}#feature-04-container #fxRows .slider-row{grid-template-columns:92px 1fr auto}#feature-04-container #fxRows .lab{font-size:.58rem;letter-spacing:.06em}#feature-04-container #fxRows .hint-line{margin-top:2px}#feature-04-container .step-inspector-head{display:flex;justify-content:space-between;align-items:center;gap:10px;
    font-family:var(--mono);font-size:.68rem;letter-spacing:.14em;text-transform:uppercase;color:var(--gold)}#feature-04-container .step-inspector-close{width:24px;height:24px;padding:0;line-height:1;border:1px solid var(--line);border-radius:6px;
    background:var(--panel-hi);color:var(--ink-soft);font-size:.75rem;cursor:pointer}#feature-04-container .step-inspector-close:hover{border-color:var(--plum);color:var(--plum)}#feature-04-container .preset-row{display:flex;gap:8px;margin-top:16px;align-items:center;flex-wrap:wrap}#feature-04-container .preset-row .preset-input{flex:1 1 130px;min-width:0;background:var(--panel-hi);border:1px solid var(--line);border-radius:10px;
    color:var(--ink);font-family:var(--mono);font-size:.78rem;padding:9px 12px}#feature-04-container .preset-row .preset-input:focus{outline:2px solid var(--plum);outline-offset:1px}#feature-04-container .preset-row .btn{padding:9px 13px;font-size:.76rem}#feature-04-container .preset-row .preset-select{flex:1 1 150px;min-width:0;background:var(--panel-hi);border:1px solid var(--line);
    border-radius:10px;color:var(--ink);font-family:var(--mono);font-size:.78rem;padding:9px 12px;cursor:pointer}#feature-04-container .preset-row .preset-select:focus{outline:2px solid var(--plum);outline-offset:1px}#feature-04-container .ta-btn.fx{position:relative;width:auto;min-width:15px;padding:0 2px;font-size:.46rem;letter-spacing:-.03em}#feature-04-container .ta-btn.fx .pip{position:absolute;left:50%;top:50%;width:3px;height:3px;border-radius:50%;background:currentColor;
    transform:translate(calc(var(--p,0) * 4px - 1px), -50%);transition:transform .1s;pointer-events:none}#feature-04-container .ta-btn.is-active{background:var(--plum);border-color:var(--plum);color:#2a1520}#feature-04-container [hidden]{display:none!important}#feature-04-container .rhythm-step, #feature-04-container .ta-btn, #feature-04-container .name{touch-action:pan-x}#feature-04-container .slider, #feature-04-container input[type=range], #feature-04-container .select select{touch-action:none}#feature-04-container button{-webkit-tap-highlight-color:transparent;tap-highlight-color:transparent}#feature-04-container .hint-line{font-family:var(--mono);font-size:.62rem;color:var(--ink-dim);margin-top:16px;letter-spacing:.02em}#feature-04-container .foot{margin-top:30px;display:flex;justify-content:space-between;gap:16px;flex-wrap:wrap;font-family:var(--mono);
    font-size:.66rem;letter-spacing:.08em;color:var(--ink-dim)}#feature-04-container .foot .keys{display:flex;gap:10px;flex-wrap:wrap}#feature-04-container kbd{font-family:var(--mono);font-size:.62rem;background:var(--panel-hi);border:1px solid var(--line);border-radius:6px;
    padding:2px 7px;color:var(--ink-soft);box-shadow:0 2px 0 rgba(0,0,0,.4)}#feature-04-container .reveal{opacity:0;transform:translateY(26px);transition:opacity .7s ease,transform .7s cubic-bezier(.2,.7,.2,1)}#feature-04-container .reveal.in{opacity:1;transform:none}@media (max-width:760px){#feature-04-container .masthead{align-items:flex-start}#feature-04-container .console{flex:1 1 100%;min-width:0} }@media (max-width:520px){#feature-04-container .slider-row{grid-template-columns:52px 1fr auto;gap:10px}#feature-04-container .slider-row .val{min-width:auto}#feature-04-container .knobs{gap:16px 20px}
  }@media (prefers-reduced-motion:reduce){#feature-04-container .reveal{transition:none;opacity:1;transform:none}#feature-04-container .console.is-live .live-dot{animation:none}
  }