.piano-keyboard-wrapper{--pk-white-top:#fff;--pk-white-mid:#f8f8f8;--pk-white-bottom:#e8e8e8;--pk-black-edge:#0a0a0a;--pk-black-mid:#262626;--pk-key-border:#bbb;--pk-label-color:#888;--pk-anim-duration-highlight:.2s;--pk-anim-duration-press:80ms;--pk-anim-duration-release:.15s;--pk-anim-easing:ease-out;--pk-anim-hover-scale:1;background:var(--pk-bg,transparent);border-radius:var(--pk-radius,.5rem);width:100%;padding:var(--pk-padding,.5rem);overflow:auto hidden}.piano-keyboard-wrapper[data-fit=parent]{width:100%;height:100%;padding:0;overflow:hidden}.piano-keyboard-wrapper[data-fit=parent] .piano-keyboard-svg{width:100%;height:100%}.piano-keyboard-svg{min-width:100%;display:block}.piano-keyboard-wrapper .pk-key path[data-fill-anim=true]{transition:fill var(--pk-anim-duration-highlight,.2s) var(--pk-anim-easing,ease-out)}.piano-keyboard-wrapper .pk-key{transform-box:fill-box;transform-origin:bottom;transition:transform var(--pk-anim-duration-press,80ms) var(--pk-anim-easing,ease-out)}.piano-keyboard-wrapper .pk-key:hover{transform:scale(var(--pk-anim-hover-scale,1))}.piano-keyboard-wrapper[data-animations=off] .pk-key,.piano-keyboard-wrapper[data-animations=off] .pk-key path{transition:none!important;transform:none!important}.piano-keyboard-wrapper .pk-indicator{fill:var(--pk-indicator-color,#1e293b);transition:fill var(--pk-anim-duration-highlight,.2s) var(--pk-anim-easing,ease-out), filter var(--pk-anim-duration-highlight,.2s) var(--pk-anim-easing,ease-out)}.piano-keyboard-wrapper .pk-indicator[data-active=true]{fill:var(--pk-indicator-glow,#3b82f6);filter:drop-shadow(0 0 var(--pk-indicator-glow-size,6px) var(--pk-indicator-glow,#3b82f6))}.piano-keyboard-wrapper[data-indicator-pulse=on] .pk-indicator[data-active=true]{animation:pk-indicator-pulse var(--pk-indicator-pulse-duration,1.5s) ease-in-out infinite}@keyframes pk-indicator-pulse{0%,to{filter:drop-shadow(0 0 var(--pk-indicator-glow-size,6px) var(--pk-indicator-glow,#3b82f6));opacity:1}50%{filter:drop-shadow(0 0 calc(var(--pk-indicator-glow-size,6px) * 2.2) var(--pk-indicator-glow,#3b82f6));opacity:.72}}.piano-keyboard-wrapper[data-animations=off] .pk-indicator{transition:none!important;animation:none!important}[data-theme=dark] .piano-keyboard-wrapper{--pk-white-top:#f0f0f0;--pk-white-bottom:#d8d8d8}.piano-keyboard-wrapper[data-theme=crystal]{--pk-white-active-top:#93c5fd;--pk-white-active-bottom:#1d4ed8;--pk-white-tonic-top:#fde68a;--pk-white-tonic-bottom:#d97706}