.st-pads{grid-template-columns:repeat(8,minmax(0,1fr));gap:8px;display:grid}.st-live-pads .st-pad{touch-action:none;background:#222c1e;flex-direction:column;justify-content:center;align-items:center;gap:9px;min-width:44px;min-height:82px;padding:12px 6px;display:flex}.st-pad b{font:500 1.25rem var(--font-display);color:var(--st-accent)}.st-pad span{text-wrap:balance;font-size:.7rem}.st-live-pads .st-pad.st-hit,.st-live-pads .st-pad.st-pressed{box-shadow:inset 0 -4px var(--st-accent);background:#647842}.st-quantize{margin-top:18px}.st-instrument-pads{grid-template-columns:repeat(auto-fit,minmax(min(100%,260px),1fr));gap:20px;margin-top:20px;display:grid}.st-live-group{min-width:0}.st-live-group h3{margin:0 0 12px}.st-instrument-pads .st-pads{grid-template-columns:repeat(3,minmax(44px,1fr))}.st-live-group[data-live-group=bilah] .st-pads{grid-template-columns:repeat(5,minmax(44px,1fr))}.st-live-group[data-live-group=kendhang] .st-pads{grid-template-columns:repeat(2,minmax(44px,1fr))}.st-pad[aria-busy=true]{outline:1px dashed var(--st-accent)}@media (width<=800px){.st-pads{grid-template-columns:repeat(4,minmax(0,1fr))}.st-live-group[data-live-group=bilah] .st-pads{grid-template-columns:repeat(3,minmax(44px,1fr))}}@media (prefers-reduced-motion:reduce){.st-pad{transition:none}}.studio-page{--st-accent:#c3f36b;--st-gold:#f2c66c;--st-surface:#1b211b;--st-border:#3d4738;width:min(1520px,100% - 64px);padding-block:42px 80px}.studio-page button,.studio-page input,.studio-page select{font:inherit}.studio-page button,.studio-page select,.studio-page input:not([type=checkbox]):not([type=range]){min-height:44px;color:var(--color-text);background:#242d21;border:1px solid #59644d;border-radius:8px;padding:9px 13px}.studio-page button{cursor:pointer;line-height:1.2}.studio-page button:hover:not(:disabled){border-color:var(--st-accent);background:#34402b}.studio-page button:disabled{opacity:.5;cursor:default}.studio-page :focus-visible{outline:3px solid var(--st-gold);outline-offset:3px}.studio-page label{flex-wrap:wrap;align-items:center;gap:8px;font-size:.85rem;display:flex}.studio-page input[type=range]{accent-color:var(--st-accent);cursor:pointer;max-width:100%;min-height:44px}.studio-page input[type=checkbox]{width:24px;height:24px;accent-color:var(--st-accent)}.studio-page h1{letter-spacing:-.055em;margin:14px 0 18px;font-size:clamp(2rem,4vw,3.5rem);line-height:1.04}.studio-page h2{font:600 1.3rem var(--font-display);letter-spacing:-.04em;margin:0 0 20px}.studio-page h3{font:500 1rem var(--font-display);margin:28px 0 10px}.studio-page p{line-height:1.6}.st-intro{justify-content:space-between;align-items:center;gap:24px;margin-bottom:32px;display:flex}.st-intro>div:first-child{max-width:900px}.st-intro .eyebrow{color:var(--st-accent);letter-spacing:.16em;font-size:.72rem}.st-intro p{color:#bec5b8}.st-mark{border:1px solid var(--st-border);background:repeating-linear-gradient(0deg,#0000,#0000 15px,#303929 16px);border-radius:16px;justify-content:center;align-items:center;gap:12px;width:176px;height:112px;display:flex;position:relative}.st-mark i{background:var(--st-accent);border-radius:3px;width:14px;height:52px}.st-mark i:nth-child(2){background:var(--st-gold);height:72px}.st-mark i:nth-child(3){height:32px}.st-mark i:nth-child(4){height:60px}.st-mark b{letter-spacing:.25em;background:#1b211b;font-size:.62rem;position:absolute;bottom:8px}.st-guide{gap:24px;margin:24px 0 28px;padding:0;list-style:none;display:flex}.st-guide li{color:#c6ceb9;align-items:center;gap:10px;font-size:.85rem;display:flex}.st-guide b{border:1px solid var(--st-border);width:28px;height:28px;color:var(--st-accent);border-radius:50%;flex-shrink:0;place-items:center;font-weight:400;display:grid}.st-desktop-note{display:none}.st-transport{z-index:5;background:#263020;border:1px solid #627944;border-radius:12px;flex-wrap:wrap;align-items:center;gap:18px;padding:18px 22px;display:flex;position:sticky;top:8px;box-shadow:0 12px 24px #0004}.st-transport>label{max-width:250px}.studio-page .st-primary{background:var(--st-accent);color:#15210a;border-color:var(--st-accent);font-weight:700}.studio-page .st-primary:hover:not(:disabled){color:#15210a;background:#d7ff99}.st-buttons{flex-wrap:wrap;gap:8px;display:flex}.st-transport input[type=range]{width:100px}.st-transport output{font-variant-numeric:tabular-nums;min-width:34px;color:var(--st-accent)}#st-bpm{width:80px}#st-status{flex:1;min-width:130px;margin:0;font-size:.8rem}#st-position{font-family:var(--font-display);letter-spacing:.08em;min-width:60px;font-size:1.1rem}.studio-workspace{grid-template-columns:minmax(0,1fr) 260px;align-items:start;gap:20px;margin-top:24px;display:grid}.st-compose{gap:20px;min-width:0;display:grid}.st-panel{border:1px solid var(--st-border);background:var(--st-surface);border-radius:12px;min-width:0;padding:22px}.st-panel-top{justify-content:space-between;align-items:center;gap:12px;margin-bottom:12px;display:flex}.st-panel-top h2{margin:0}.st-panel-top>div{gap:6px;display:flex}.st-pattern-controls,.st-sound-controls{flex-wrap:wrap;align-items:center;gap:8px;margin:14px 0;display:flex}.st-pattern-controls input{width:110px}.st-pattern-controls select{min-width:95px;max-width:180px}.st-sound-controls{border-top:1px solid var(--st-border);gap:12px;padding-top:18px}.st-sound-controls select{max-width:230px}.st-hint{color:#c0c8b8;margin-block:8px 18px;font-size:.8rem}.st-grid-scroll{scrollbar-color:#78904e #10160f;scrollbar-width:thin;background:#10160f;border-radius:8px;max-width:100%;padding:5px 2px 8px;overflow-x:auto}.st-grid{border-spacing:4px;table-layout:fixed;width:100%;min-width:928px}.st-grid th{color:#b1bfa2;height:30px;font-size:.7rem;font-weight:500}.st-grid th:first-child{text-align:left;z-index:2;background:#10160f;width:140px;padding-left:10px;position:sticky;left:0}.st-grid tbody th{color:#e1e6da;font-size:.8rem;font-weight:600}.st-track-number{color:#8da77d;margin-top:4px;font-size:.65rem;font-weight:400;display:block}.st-grid td{width:44px;padding:0}.st-grid .st-quarter{border-left:1px solid #647157;padding-left:5px}.studio-page .st-step{background:#263121;border-color:#394731;border-radius:5px;justify-content:center;align-items:center;width:100%;min-width:44px;min-height:44px;padding:0;display:flex;position:relative}.st-step .st-dot{background:#647657;border-radius:50%;width:6px;height:6px}.st-step .st-velocity{background:#eef9d9;height:2px;position:absolute;bottom:3px;left:4px}.studio-page .st-step[aria-pressed=true]{background:var(--st-accent);border-color:var(--st-accent)}.st-step[aria-pressed=true] .st-dot{background:#2c4717;width:12px;height:12px;box-shadow:0 0 0 5px #96be5055}.studio-page .st-step.st-playhead,.v3-note-grid button.st-playhead{box-shadow:inset 0 0 0 3px var(--st-gold)}.st-grid th.st-playhead{color:var(--st-gold);background:#3c3420}.st-grid tr:nth-child(2n) .st-step[aria-pressed=true]{background:#e2d485;border-color:#e2d485}.st-mixer{background:#1c2319}.st-mixer-rows{gap:14px;display:grid}.st-mixer-track{border-bottom:1px solid var(--st-border);padding-bottom:16px}.st-mixer-track:last-child{border-bottom:0;padding-bottom:0}.st-mixer-track strong{color:#d6e5c7;font-size:.85rem}.st-mix-toggles{gap:6px;margin-block:10px;display:flex}.st-mix-toggles button{flex:1;padding:8px;font-size:.75rem}.studio-page [data-st-mute][aria-pressed=true]{color:#14190f;background:#b08a4b}.studio-page [data-st-solo][aria-pressed=true]{background:var(--st-accent);color:#14190f}.st-mixer-track label{grid-template-columns:38px 1fr 38px;gap:5px;font-size:.7rem;display:grid}.st-mixer-track input{width:100%;min-width:0}.st-mixer-track output{text-align:right;font-variant-numeric:tabular-nums;color:#cadcae}.st-chain #st-chain-list{flex-wrap:wrap;gap:8px;margin:14px 0;display:flex}.st-chain-slot{background:#27371d;border:1px solid #5c6f48;border-radius:8px;align-items:center;display:flex;overflow:hidden}.st-chain-slot span{font:500 .9rem var(--font-display);padding:10px 12px}.studio-page .st-chain-slot button{border:0;border-left:1px solid #5c6f48;border-radius:0;min-width:44px;padding:6px}.st-chain-slot.st-current{box-shadow:0 0 0 2px var(--st-gold)}.st-chain>p:last-child{color:var(--st-accent);margin-bottom:0;font-size:.85rem}.st-project{margin-top:28px}.st-project-columns{grid-template-columns:1fr 1fr;gap:40px;display:grid}.st-project-columns>div>label{flex-direction:column;align-items:stretch;margin-bottom:12px;display:flex}.st-project-columns .st-buttons{margin-bottom:18px}.st-project-columns input,.st-project-columns select{width:100%;min-width:0}.st-project-columns input[type=file]{display:none}.st-project #st-render{margin-right:8px}#st-project-status{color:#d1e3b5;background:#11180f;border-radius:8px;min-height:48px;padding:14px;font-size:.9rem}#st-project-status[role=alert]{color:#ffce88}#st-progress{width:100%;height:12px;accent-color:var(--st-accent);margin-top:22px}#st-filename{overflow-wrap:anywhere;color:var(--st-accent);font-size:.8rem}.st-help{margin-top:20px}.st-help summary{cursor:pointer;align-content:center;min-height:44px;font-size:.95rem}.st-help p{color:#bdc9b3;max-width:850px}.st-foot{justify-content:space-between;gap:20px;margin-top:28px;font-size:.8rem;display:flex}.st-foot a{color:var(--st-accent);align-items:center;min-width:44px;min-height:44px;display:inline-flex}.studio-page [hidden]{display:none!important}@media (width<=1399px){.studio-workspace{grid-template-columns:1fr}.st-mixer-rows{grid-template-columns:repeat(4,minmax(0,1fr));gap:24px}.st-mixer-track{border-bottom:0}.st-transport{position:static}.st-mark{display:none}}@media (width<=800px){.studio-page{width:calc(100% - 32px);padding-top:24px}.st-guide{flex-direction:column;gap:8px}.st-desktop-note{background:#212d18;border:1px solid #596c44;border-radius:10px;align-items:center;gap:10px;padding:14px;display:flex}.st-desktop-note p{margin:0;font-size:.8rem}.st-desktop-note button{flex-shrink:0;width:90px;font-size:.75rem}.st-panel{padding:16px}.st-transport{gap:14px;padding:14px}.st-transport>label{max-width:none}.st-transport .st-buttons{width:100%}.st-transport input[type=range]{width:92px}.st-project-columns{grid-template-columns:1fr;gap:20px}.st-mixer-rows{grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.st-intro{flex-wrap:wrap;margin-bottom:20px}.st-panel-top{flex-wrap:wrap}.st-pattern-controls label{flex-basis:100%}.st-pattern-controls input,.st-pattern-controls select{flex:1}.st-foot{flex-direction:column}.st-sound-controls label{width:100%}.st-sound-controls select{flex:1;max-width:100%}.st-grid th:first-child{width:115px}.st-grid{min-width:900px}}@media (prefers-reduced-motion:reduce){.st-step,.st-pad{transition:none}}.composition-panel{margin-block:22px}.composition-panel p{color:#b9ccc5;max-width:86ch;line-height:1.6}.v3-note-picks{flex-wrap:wrap;gap:8px;margin-block:12px;display:flex}.v3-note-picks button[aria-pressed=true],.v3-note-grid button[aria-pressed=true]{color:#11211c;background:#d3ea99}.v3-note-grid{gap:5px;margin-block:8px;padding-block:12px;display:flex;overflow-x:auto}.v3-note-grid button{flex:0 0 44px;min-width:44px;padding:4px}.kendhang-section{border-top:1px solid #3c5048;min-width:0;padding-block:12px}.kendhang-section p{overflow-wrap:anywhere}.kendhang-section button[aria-pressed=true]{color:#11211c;background:#d3ea99}.v3-mix{border-top:1px solid #3c5048;flex-wrap:wrap;align-items:center;gap:12px;padding-block:12px;display:flex}.v3-mix strong{min-width:130px}.v3-mix label{align-items:center;gap:6px;min-height:44px;display:flex}.v3-mix input[type=range]{max-width:130px;min-height:44px}.v3-mix input[type=checkbox]{width:24px;height:24px}@media (width<=600px){.v3-mix strong{width:100%}.v3-mix label{flex:40%}.v3-mix input[type=range]{width:100%}}