.sg-tool{--sg-bg:#0a0a1a;--sg-bg-alt:#12122a;--sg-surface:rgba(255, 255, 255, 0.04);--sg-surface-hover:rgba(255, 255, 255, 0.08);--sg-surface-active:rgba(255, 255, 255, 0.12);--sg-text:rgba(255, 255, 255, 0.9);--sg-text-muted:rgba(255, 255, 255, 0.5);--sg-text-dim:rgba(255, 255, 255, 0.3);--sg-accent:#6C5CE7;--sg-accent-glow:rgba(108, 92, 231, 0.4);--sg-chord-color:#5B7FFF;--sg-chord-glow:rgba(91, 127, 255, 0.3);--sg-melody-color:#00D68F;--sg-melody-glow:rgba(0, 214, 143, 0.3);--sg-bass-color:#FF9F43;--sg-bass-glow:rgba(255, 159, 67, 0.3);--sg-live-color:#E056FF;--sg-live-glow:rgba(224, 86, 255, 0.3);--sg-border:rgba(255, 255, 255, 0.08);--sg-border-hover:rgba(255, 255, 255, 0.15);--sg-transition:150ms ease;--sg-transition-slow:300ms ease;--sg-radius:8px;--sg-radius-sm:4px;--sg-radius-lg:12px}@keyframes sg-keyboard-shimmer{0%{background-position:200% 0}100%{background-position:-200% 0}}.ag-keyboard-wrapper{margin-bottom:1rem;overflow-x:auto;-webkit-overflow-scrolling:touch;border-radius:var(--sg-radius-lg,12px);border:1px solid var(--sg-border,rgba(255,255,255,.08));background:var(--sg-surface,rgba(255,255,255,.04));padding:.75rem}.ag-keyboard{display:flex;position:relative;height:var(--sg-keyboard-height,100px);min-width:100%;user-select:none}.ag-key{position:relative;flex:1;background:linear-gradient(180deg,#f8f8f8 0,#e8e8e8 100%);border:1px solid rgba(0,0,0,.15);border-radius:0 0 4px 4px;cursor:pointer;transition:background 150ms ease,box-shadow 150ms ease;z-index:1}.ag-key:hover{background:linear-gradient(180deg,#fff 0,#f0f0f0 100%)}.ag-key:active{background:linear-gradient(180deg,#e0e0e0 0,#d0d0d0 100%)}.ag-key::after{content:attr(data-label);position:absolute;bottom:3px;left:50%;transform:translateX(-50%);font-size:.5rem;color:rgba(0,0,0,.35);font-weight:600;pointer-events:none;white-space:nowrap}.ag-key--black{position:absolute;width:60%;height:60%;background:linear-gradient(180deg,#333 0,#111 100%);border:1px solid rgba(0,0,0,.3);border-radius:0 0 3px 3px;z-index:2;flex:none}.ag-key--black:hover{background:linear-gradient(180deg,#444 0,#222 100%)}.ag-key--black:active{background:linear-gradient(180deg,#222 0,#000 100%)}.ag-key--black::after{display:none}.ag-key--active-chord{background:linear-gradient(180deg,var(--sg-chord-color) 0,color-mix(in srgb,var(--sg-chord-color) 70%,#000))!important;box-shadow:0 0 12px var(--sg-chord-glow)}.ag-key--active-chord::after{color:rgba(255,255,255,.7)}.ag-key--active-melody{background:linear-gradient(180deg,var(--sg-melody-color) 0,color-mix(in srgb,var(--sg-melody-color) 70%,#000))!important;box-shadow:0 0 12px var(--sg-melody-glow)}.ag-key--active-melody::after{color:rgba(255,255,255,.7)}.ag-key--active-bass{background:linear-gradient(180deg,var(--sg-bass-color) 0,color-mix(in srgb,var(--sg-bass-color) 70%,#000))!important;box-shadow:0 0 12px var(--sg-bass-glow)}.ag-key--active-bass::after{color:rgba(255,255,255,.7)}.ag-key--active-live{background:linear-gradient(180deg,var(--sg-live-color) 0,color-mix(in srgb,var(--sg-live-color) 70%,#000))!important;box-shadow:0 0 12px var(--sg-live-glow)}.ag-key--active-live::after{color:rgba(255,255,255,.7)}.ag-key--active-chord.ag-key--active-melody{box-shadow:0 0 12px var(--sg-chord-glow),0 0 12px var(--sg-melody-glow)}.ag-keyboard--loading{background:linear-gradient(90deg,rgba(255,255,255,.02) 0,rgba(255,255,255,.06) 50%,rgba(255,255,255,.02) 100%);background-size:200% 100%;animation:sg-keyboard-shimmer 1.5s ease-in-out infinite;border-radius:4px}@media (max-width:768px){.ag-keyboard{height:80px;min-width:400px}.ag-key::after{display:none}}.ag-tool{color:rgba(255,255,255,.9)}.ag-note-display{font-size:2.5rem;font-weight:800;color:rgba(255,255,255,.95);min-height:3.5rem;font-variant-numeric:tabular-nums}@media (max-width:576px){.ag-note-display{font-size:2rem}}/*# sourceMappingURL=index.bundle.css.map */