*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,sans-serif;background:#0f1117;color:#e8eaed;line-height:1.5}#root{max-width:860px;margin:0 auto;padding:1.5rem}h1{margin:0 0 .25rem;font-size:1.75rem}.subtitle{color:#9aa0a6;margin:0 0 1.5rem}section{background:#1a1d27;border:1px solid #2a2f3a;border-radius:8px;padding:1rem;margin-bottom:1rem}section h2{margin:0 0 .75rem;font-size:1rem;color:#bdc1c6}.row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-bottom:.75rem}label{display:block;margin-bottom:.25rem;font-size:.875rem;color:#9aa0a6}select,input[type=range]{width:100%;max-width:320px;accent-color:#1a73e8}input[type=text],input[type=number]{width:100%;max-width:320px;padding:.5rem;border-radius:6px;border:1px solid #3c4043;background:#0f1117;color:#e8eaed}button{padding:.5rem .875rem;border-radius:6px;border:1px solid #3c4043;background:#2d3139;color:#e8eaed;cursor:pointer}button:hover:not(:disabled){background:#3c4043}button:disabled{opacity:.5;cursor:not-allowed}button.primary{background:#1a73e8;border-color:#1a73e8}button.primary:hover:not(:disabled){background:#1967d2}button.danger{background:#c5221f;border-color:#c5221f}#status{min-height:1.25rem;font-size:.875rem;color:#81c995;white-space:pre-wrap}#player{width:100%;margin-top:.5rem}#versionsList{list-style:none;padding:0;margin:0}#versionsList li{padding:.5rem 0;border-bottom:1px solid #2a2f3a;font-size:.875rem}#versionsList li:last-child{border-bottom:none}.hint{font-size:.8rem;color:#9aa0a6;margin-top:.5rem}.bpm-result{font-size:.9rem;font-weight:600;padding:.2rem .5rem;border-radius:4px}.bpm-high{color:#81c995;background:#81c9951f}.bpm-medium{color:#fdd663;background:#fdd6631f}.bpm-low{color:#f28b82;background:#f28b821f}.tempo-panel{margin:.75rem 0 1rem;padding:.75rem 1rem;border:1px solid #3c4043;border-radius:8px;background:#ffffff08}.panel-subtitle{margin:0 0 .5rem;font-size:.95rem;font-weight:600}.recording-mode-options{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:.5rem}.mode-card{display:flex;flex-direction:column;gap:.25rem;padding:.65rem .75rem;border:1px solid #3c4043;border-radius:8px;cursor:pointer;background:#00000026}.mode-card.selected{border-color:#8ab4f8;background:#8ab4f81a}.mode-card input{position:absolute;opacity:0;pointer-events:none}.mode-title{font-weight:600;font-size:.9rem}.mode-desc{font-size:.78rem;color:#9aa0a6;line-height:1.35}.count-in-display{margin:.5rem 0 1rem;padding:1rem;text-align:center;font-size:2.5rem;font-weight:700;letter-spacing:.05em;border-radius:12px;border:2px solid #8ab4f8;background:#8ab4f81f;color:#8ab4f8;animation:count-pulse .5s ease-out}.count-in-display.go{color:#81c995;border-color:#81c995;background:#81c9951f}@keyframes count-pulse{0%{transform:scale(.92);opacity:.6}to{transform:scale(1);opacity:1}}.click-track-panel{margin:.75rem 0 1rem;padding:.75rem 1rem;border:1px solid #3c4043;border-radius:8px;background:#ffffff08}.quantize-panel{margin:.75rem 0 0;padding:.75rem 1rem;border:1px solid #3c4043;border-radius:8px;background:#8ab4f80f}.quantize-strength-row{margin-top:.65rem}.quantize-strength-row label{display:block;margin-bottom:.35rem;font-size:.85rem}.quantize-strength-row input[type=range]{width:100%}.quantize-strength-labels{display:flex;justify-content:space-between;font-size:.72rem;color:#9aa0a6;margin-top:.25rem}.click-toggle{margin-bottom:.5rem;font-weight:500}video{display:block;margin-top:.5rem}meter{display:block}.link-btn{background:none;border:none;color:#8ab4f8;padding:0;text-decoration:underline;cursor:pointer;font-size:inherit}.link-btn:hover{color:#aac8ff}.riff-viewer-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000bf;display:flex;align-items:flex-start;justify-content:center;padding:1.5rem;overflow-y:auto;z-index:1000}.riff-viewer{background:#1a1d27;border:1px solid #2a2f3a;border-radius:12px;padding:1.25rem;width:100%;max-width:720px;margin-top:2rem}.riff-viewer-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.riff-viewer-header h2{margin:0}.riff-meta-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:.75rem;margin-bottom:.75rem}.meta-card{background:#0f1117;border:1px solid #2a2f3a;border-radius:8px;padding:.75rem;display:flex;flex-direction:column;gap:.25rem}.meta-label{font-size:.75rem;color:#9aa0a6;text-transform:uppercase;letter-spacing:.04em}.meta-value{font-size:1.1rem;font-weight:600;color:#e8eaed}.tuning-strings{margin-bottom:.5rem}.click-section{margin-top:1rem;padding:.75rem;background:#0f1117;border:1px solid #2a2f3a;border-radius:8px}.click-section h3{margin:0 0 .5rem;font-size:1rem;color:#bdc1c6}.tab-section{margin-top:1.25rem;padding-top:1rem;border-top:1px solid #2a2f3a}.tab-section h3{margin:0 0 .75rem;font-size:1rem;color:#bdc1c6}.tab-scroll{overflow-x:auto;background:#0f1117;border:1px solid #2a2f3a;border-radius:8px;padding:.75rem}.tab-notation{margin:0;font-family:SF Mono,Menlo,Consolas,monospace;font-size:.85rem;line-height:1.6;color:#e8eaed}.tab-line{white-space:nowrap}.tab-label{color:#9aa0a6;display:inline-block;min-width:1.5rem}.tab-cells{display:inline}.tab-cell{display:inline-block;min-width:1.5rem;text-align:center}.tab-cell-active{background:#1a73e8;color:#fff;border-radius:2px}.playback-time{margin-top:.25rem}.reference-item-view{border-top:1px solid #3c4043;padding-top:.75rem;margin-top:.75rem}.reference-item-view:first-of-type{border-top:none;padding-top:0;margin-top:0}.reference-item-view h4{margin:0 0 .5rem;font-size:.95rem}.drums-workspace{display:flex;flex-direction:column;gap:0;margin-bottom:1rem;border:1px solid #2a2f3a;border-radius:10px;overflow:hidden}.drums-workspace>section{margin-bottom:0;border:none;border-radius:0;border-bottom:1px solid #2a2f3a}.drums-workspace>section:last-child{border-bottom:none}.drum-lab-lead{margin:.25rem 0 0;font-size:.85rem;color:#9aa0a6;line-height:1.45}.drum-lab-header{display:flex;flex-wrap:wrap;align-items:flex-start;justify-content:space-between;gap:.75rem;margin-bottom:1rem}.drum-lab-header h2{margin:0}.drum-lab-stats{display:flex;align-items:center;gap:.35rem;font-size:.8rem;font-weight:600;color:#bdc1c6;background:#ffffff0a;border:1px solid #3c4043;border-radius:999px;padding:.35rem .75rem;white-space:nowrap}.drum-lab-stat-divider{color:#5f6368;font-weight:400}.drum-lab-toolbar{display:flex;flex-wrap:wrap;align-items:center;gap:1rem;padding:.75rem 1rem;margin-bottom:1rem;background:#ffffff08;border:1px solid #3c4043;border-radius:8px}.drum-lab-toggle{display:flex;align-items:center;gap:.5rem;margin:0;font-size:.875rem;color:#e8eaed;cursor:pointer}.drum-lab-toggle input{accent-color:#1a73e8}.drum-lab-preset-controls{display:flex;flex-wrap:wrap;gap:.75rem;align-items:center}.drum-lab-preset-control{display:flex;align-items:center;gap:.4rem;margin:0;font-size:.8rem;color:#bdc1c6}.drum-lab-preset-control select{font-size:.8rem;padding:.25rem .4rem;max-width:11rem}.drum-option-default{position:absolute;top:.35rem;right:.35rem;font-size:.65rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:#fdd663}.drum-option-card.default-preset{border-color:#fdd66359}.drum-lab-volume{display:flex;align-items:center;gap:.5rem;flex:1;min-width:140px}.drum-lab-volume label{margin:0;white-space:nowrap}.drum-lab-volume input[type=range]{flex:1;max-width:none;min-width:80px}.drum-lab-rebuild{margin-left:auto}.drum-lab-building{padding:1.5rem 1rem;text-align:center;color:#9aa0a6;font-size:.875rem}.drum-lab-building-bar{height:3px;background:linear-gradient(90deg,transparent,#8ab4f8,transparent);background-size:200% 100%;animation:drum-lab-shimmer 1.2s ease-in-out infinite;border-radius:2px;margin-bottom:.75rem}@keyframes drum-lab-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.drum-lab-groups{display:flex;flex-direction:column;gap:1.25rem}.drum-lab-group-title{display:flex;align-items:center;gap:.5rem;margin:0 0 .6rem;font-size:.8rem;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:#9aa0a6}.drum-lab-group-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .35rem;font-size:.7rem;font-weight:700;color:#bdc1c6;background:#ffffff0f;border-radius:999px}.drum-lab-empty{display:flex;flex-direction:column;align-items:center;text-align:center;padding:2rem 1rem;color:#9aa0a6;font-size:.875rem}.drum-lab-empty-inline{padding:1.25rem;gap:.75rem}.drum-lab-empty-icon{font-size:2rem;margin-bottom:.5rem;opacity:.6}.drum-lab-selection{margin-top:1rem;padding:.65rem .85rem;background:#8ab4f814;border:1px solid rgba(138,180,248,.25);border-radius:8px;font-size:.875rem}.drum-lab-selection-label{display:block;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.05em;color:#8ab4f8;margin-bottom:.15rem}.drum-lab-footnote{margin-top:.75rem;margin-bottom:0}.drum-option-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(148px,1fr));gap:.5rem}.drum-option-card{position:relative;display:flex;flex-direction:column;align-items:flex-start;gap:.25rem;padding:.65rem .75rem;min-height:4.25rem;border:1px solid #3c4043;border-radius:8px;background:#ffffff05;color:#e8eaed;cursor:pointer;text-align:left;transition:border-color .15s,background .15s}.drum-option-card:hover{border-color:#5f6368;background:#ffffff0d}.drum-option-card.selected{border-color:#8ab4f8;background:#8ab4f81a;box-shadow:0 0 0 1px #8ab4f833}.drum-option-source{font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.05em;color:#81c995}.drum-option-label{font-weight:600;font-size:.85rem;line-height:1.3}.drum-option-active{position:absolute;top:.45rem;right:.45rem;font-size:.65rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;color:#8ab4f8}.play-along-panel{margin-top:1rem;padding:1rem;border:1px solid #3c4043;border-radius:8px;background:#8ab4f80f}.play-along-actions{align-items:center;gap:.75rem;flex-wrap:wrap}.play-along-add{display:inline-flex;align-items:center;cursor:pointer}.play-along-selected{font-size:.9rem;color:#bdc1c6}.drum-input-row{align-items:flex-end;gap:.75rem;margin-top:.5rem}.play-along-badge{font-size:.75rem;font-weight:600;color:#8ab4f8;margin-left:.35rem}.backing-catalog-quick{margin-top:.75rem}.backing-catalog-list{list-style:none;margin:.35rem 0 0;padding:0;border:1px solid #3c4043;border-radius:6px;overflow:hidden}.backing-catalog-row{display:flex;align-items:center;gap:.5rem;padding:.45rem .65rem;background:#00000026}.backing-catalog-row+.backing-catalog-row{border-top:1px solid #3c4043}.backing-catalog-name{flex:1;font-size:.9rem;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.backing-catalog-meta{font-size:.75rem;color:#9aa0a6}.backing-track-catalog{margin-top:1rem}.backing-track-row button:not(.drum-catalog-saved-remove){font-size:.8rem;padding:.2rem .5rem}.recording-plan{margin:.75rem 0;padding:.65rem .75rem;border:1px solid #3c4043;border-radius:6px;background:#0003}.recording-plan-title{margin:0 0 .4rem;font-size:.8rem;font-weight:600;color:#9aa0a6;text-transform:uppercase;letter-spacing:.04em}.recording-plan-list{list-style:none;margin:0;padding:0;font-size:.88rem}.recording-plan-list li{display:flex;gap:.5rem;padding:.2rem 0}.recording-plan-label{flex:0 0 5.5rem;font-weight:600;color:#8ab4f8}.playback-backing-controls{display:flex;align-items:center;gap:.75rem;flex-wrap:wrap;margin-top:.65rem}.playback-backing-off{opacity:.85}.load-take-panel{margin-top:1rem;padding:1rem 1.1rem;border:2px solid #1a73e8;border-radius:10px;background:#1a73e81f;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:1rem}.load-take-panel-copy{flex:1 1 220px;min-width:0}.load-take-panel-title{margin:0 0 .25rem;font-size:1rem;font-weight:600;color:#e8eaed}.load-take-panel-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.65rem;flex-shrink:0}.load-take-btn{font-size:1rem;font-weight:600;padding:.65rem 1.25rem;box-shadow:0 2px 8px #1a73e859}.load-take-btn:hover:not(:disabled){box-shadow:0 3px 12px #1a73e880}.load-take-download{font-size:.9rem;color:#8ab4f8;text-decoration:underline;text-underline-offset:2px}.load-take-download:hover{color:#aecbf7}.drums-toggle-on{box-shadow:inset 0 0 0 2px #8ab4f880}.drums-toggle-off{opacity:.85}.drum-catalog-header{margin-bottom:1rem}.drum-catalog-header h2{margin:0}.drum-catalog-saved{margin-top:1rem;border:1px solid #3c4043;border-radius:8px;background:#ffffff05;overflow:hidden}.drum-catalog-saved-toggle{display:flex;align-items:center;gap:.5rem;width:100%;padding:.65rem .85rem;border:none;background:transparent;color:#bdc1c6;font-size:.875rem;font-weight:600;text-align:left;cursor:pointer}.drum-catalog-saved-toggle:hover{background:#ffffff08}.drum-catalog-saved-count{display:inline-flex;align-items:center;justify-content:center;min-width:1.25rem;height:1.25rem;padding:0 .35rem;font-size:.7rem;font-weight:600;color:#9aa0a6;background:#ffffff0d;border-radius:999px}.drum-catalog-saved-chevron{margin-left:auto;font-size:.75rem;color:#9aa0a6}.drum-catalog-saved-list{list-style:none;padding:0;margin:0;border-top:1px solid rgba(255,255,255,.06)}.drum-catalog-saved-row{display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:.75rem;padding:.45rem .85rem;font-size:.875rem}.drum-catalog-saved-row+.drum-catalog-saved-row{border-top:1px solid rgba(255,255,255,.04)}.drum-catalog-saved-name{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#e8eaed}.drum-catalog-saved-meta{font-size:.75rem;color:#9aa0a6;white-space:nowrap}.drum-catalog-saved-remove{padding:.15rem .4rem;font-size:.75rem;border:none;background:transparent;color:transparent;cursor:pointer}.drum-catalog-saved-row:hover .drum-catalog-saved-remove,.drum-catalog-saved-remove:focus-visible{color:#9aa0a6}.drum-catalog-saved-remove:hover:not(:disabled){color:#f28b82}.drum-catalog-actions{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:.75rem}.drum-catalog-card{padding:.85rem 1rem;border:1px solid #3c4043;border-radius:8px;background:#ffffff05}.drum-catalog-card-compact{display:flex;flex-direction:column;gap:.5rem}.drum-catalog-card-title{margin:0 0 .35rem;font-size:.875rem;font-weight:600;color:#bdc1c6}.drum-catalog-card-row{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.65rem}.drum-catalog-file-btn{display:inline-flex;align-items:center;padding:.45rem .75rem;font-size:.875rem;border-radius:6px;border:1px solid #3c4043;background:#2d3139;cursor:pointer}.drum-catalog-file-btn:hover{background:#3c4043}.drum-catalog-name-input{flex:1;min-width:120px;max-width:none}.drum-catalog-preview{margin:.5rem 0 0;font-size:.8rem;color:#81c995}.drum-sources{background:#1a1d27;border:1px solid #2a2f3a;border-radius:8px;padding:1rem;margin-bottom:1rem}.drum-sources-header h2{margin:0}.drum-sources-actions{display:flex;flex-wrap:wrap;gap:.5rem;margin:.75rem 0}.drum-sources-add-btn{cursor:pointer}.drum-sources-add-link{background:transparent;border-color:#3c4043;color:#9aa0a6}.drum-sources-empty{margin:0}.drum-sources-list{list-style:none;padding:0;margin:0;display:flex;flex-direction:column;gap:.6rem}.drum-source-card{padding:.75rem .85rem;border:1px solid #3c4043;border-radius:8px;background:#ffffff05}.drum-source-card-top{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center}.drum-source-label-input{flex:1;min-width:140px;max-width:none;padding:.45rem .6rem;border-radius:6px;border:1px solid #3c4043;background:#0f1117;color:#e8eaed;font-size:.875rem}.drum-source-file-badge{font-size:.75rem;color:#81c995;background:#81c9951a;border:1px solid rgba(129,201,149,.25);border-radius:999px;padding:.2rem .6rem;max-width:200px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.drum-source-file-btn{font-size:.8rem;padding:.35rem .65rem;border-radius:6px;border:1px dashed #5f6368;background:transparent;color:#9aa0a6;cursor:pointer}.drum-source-youtube{width:100%;margin-top:.5rem;padding:.45rem .6rem;border-radius:6px;border:1px solid #3c4043;background:#0f1117;color:#e8eaed;font-size:.8rem}.drum-source-analyzing{margin:.5rem 0 0;font-size:.85rem;color:#8ab4f8;font-weight:500}.drum-source-analysis{margin:.5rem 0 0;font-size:.8rem;color:#9aa0a6}.drum-source-card-actions{display:flex;flex-wrap:wrap;gap:.5rem;align-items:center;margin-top:.65rem;padding-top:.65rem;border-top:1px solid rgba(255,255,255,.06)}.drum-source-match{display:flex;align-items:center;gap:.35rem;margin:0;font-size:.8rem;color:#9aa0a6;cursor:pointer}.drum-source-match.active{color:#8ab4f8;font-weight:600}.drum-source-save-row{display:flex;flex-wrap:wrap;gap:.4rem;align-items:center}.drum-source-save-row input{min-width:120px;max-width:160px;padding:.4rem .5rem;border-radius:6px;border:1px solid #3c4043;background:#0f1117;color:#e8eaed}.drum-source-remove{margin-left:auto}.reference-list{list-style:none;padding:0;margin:.75rem 0 0}.reference-item{border:1px solid #3c4043;border-radius:8px;padding:.75rem 1rem;margin-bottom:.75rem;background:#ffffff08}.reference-section{margin-top:1rem;padding-top:1rem;border-top:1px solid #2a2f3a}.catalog-save-row{margin-top:.5rem}.catalog-prompt-summary{font-size:.9rem;color:#9aa0a6}.catalog-save-prompt input[type=text]{width:100%;margin-top:.35rem}.reference-section h3{margin:0 0 .75rem;font-size:1rem;color:#bdc1c6}.youtube-embed iframe{width:100%;max-width:560px;aspect-ratio:16 / 9;border:none;border-radius:8px;background:#000}.youtube-embed a{display:inline-block;margin-top:.35rem}.join-screen{max-width:420px;margin:2rem auto}.join-form{display:flex;flex-direction:column;gap:1rem}.tab-row{display:flex;gap:.5rem;margin-bottom:1rem}.tab{flex:1}.tab.active{background:#1a73e8;border-color:#1a73e8}.error{color:#f28b82;font-size:.875rem}.room-header{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}.room-header-actions{display:flex;align-items:center;gap:.75rem}.member-pill{font-size:.875rem;background:#2d3139;padding:.25rem .625rem;border-radius:999px}.activity-feed{list-style:none;padding:0;margin:0}.activity-item{display:flex;align-items:flex-start;gap:.75rem;padding:.65rem 0;border-bottom:1px solid #2a2f3a;font-size:.875rem}.activity-item:last-child{border-bottom:none}.activity-tag{flex-shrink:0;font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;padding:.2rem .45rem;border-radius:4px;margin-top:.1rem}.activity-tag-song_created{background:#1e3a2f;color:#81c995}.activity-tag-fork_created{background:#2a2438;color:#c4a7e7}.activity-body{flex:1;min-width:0}.activity-summary{display:block}.activity-time{display:block;color:#9aa0a6;font-size:.75rem;margin-top:.15rem}.activity-open{flex-shrink:0;margin-top:.1rem}.fork-badge{font-size:.7rem;font-weight:600;text-transform:uppercase;letter-spacing:.04em;color:#c4a7e7;margin-left:.35rem}.fork-lineage{margin-top:.15rem;font-style:italic}.version-item-fork{border-left:3px solid #5c4d7a;padding-left:.65rem}.fork-compare-section{margin-top:1rem;padding:.85rem;background:#14161c;border:1px solid #2a2f3a;border-radius:8px}.riff-audio-block{margin-top:.75rem}.song-board-list{list-style:none;padding:0;margin:0 0 .75rem}.song-board-list li{padding:.35rem 0}.song-board-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem}.song-board-item .danger{flex-shrink:0}.member-list{list-style:none;padding:0;margin:0 0 .75rem}.member-list-item{display:flex;align-items:center;justify-content:space-between;gap:.75rem;padding:.35rem 0}.version-list li{padding:.75rem 0;border-bottom:1px solid #2a2f3a}.version-row{margin-bottom:.25rem}.badge{display:inline-block;font-size:.7rem;padding:.15rem .45rem;border-radius:4px;margin-left:.35rem;vertical-align:middle}.badge-human{background:#1e3a2f;color:#81c995}.badge-reference{background:#3e2a1e;color:#fdd663}.badge-ai{background:#1e2a3e;color:#8ab4f8}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#000000b3;display:flex;align-items:center;justify-content:center;padding:1rem;z-index:2000}.modal{background:#1a1d27;border:1px solid #2a2f3a;border-radius:12px;padding:1.25rem;max-width:440px;width:100%}.intent-options{display:flex;flex-direction:column;gap:.75rem;margin:1rem 0}.intent-card{text-align:left;display:flex;flex-direction:column;gap:.35rem;padding:.875rem}.intent-card span{font-size:.8rem;color:#9aa0a6}code{background:#0f1117;padding:.15rem .4rem;border-radius:4px;font-size:.9em}