@font-face{font-family:Bravura Text;src:url(/static/media/BravuraText.ff7bb15a.woff2) format("woff2"),url(/static/media/BravuraText.bc38baaf.woff) format("woff");font-weight:700;font-display:swap}@font-face{font-family:Bravura;src:url(/static/media/Bravura.5dba6315.woff2) format("woff2"),url(/static/media/Bravura.d7c2d2ce.woff) format("woff");font-weight:700;font-display:swap}@font-face{font-family:Petaluma;src:url(/static/media/Petaluma.afdbefdf.woff2) format("woff2"),url(/static/media/Petaluma.3091bb25.woff) format("woff");font-weight:700;font-display:swap}@font-face{font-family:Petaluma Script;src:url(/static/media/PetalumaScript.f573ca30.woff2) format("woff2"),url(/static/media/PetalumaScript.a447ebbe.woff) format("woff"),url(/static/media/PetalumaScript.f7c14bc4.otf) format("otf");font-weight:700;font-display:swap}@font-face{font-family:Petaluma Text;src:url(/static/media/PetalumaText.864fd0e3.woff2) format("woff2"),url(/static/media/PetalumaText.0e52d028.woff) format("woff");font-weight:700;font-display:swap}*,:after,:before{box-sizing:border-box}@keyframes spin{0%{transform:rotate(0deg)}to{transform:rotate(1turn)}}body,html{background-color:var(--app-background-color,#000);-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased;outline:none;padding:0;margin:0;box-sizing:border-box;font-size:1.2dvw;color:#dcdcdc}a,body,html{font-family:Trebuchet MS,sans-serif}a{color:#fff;-webkit-text-decoration:bold;text-decoration:bold}a:hover{text-decoration:underline}.userguide{font-family:Trebuchet MS,sans-serif;color:#dcdcdc;text-align:left}.musicfont{font-family:Bravura Text;-moz-osx-font-smoothing:grayscale;-webkit-font-smoothing:antialiased}sup{font-size:.7em}#piano{display:flex;justify-content:space-between;top:37.9dvw;width:100vw;left:0dvw;position:relative;z-index:0}#color-key{display:flex;width:15dvw;height:10dvw;top:6.1dvw;left:.75dvw;opacity:.8;position:absolute;z-index:4}.color-key-container{text-align:left;width:13dvw;height:20dvw;position:absolute;top:2dvw;left:0dvw;margin:.9dvw;padding:.1dvw}#color-key .white{width:1.48dvw;height:7.3dvw;border:.025dvw solid #787878;border-bottom-right-radius:.25dvw .25dvw;border-bottom-left-radius:.25dvw .25dvw}#color-key .black{width:1.1dvw;height:4.8dvw;border-bottom-right-radius:.25dvw .25dvw;border-bottom-left-radius:.25dvw .25dvw}.ck-active{animation:pulse .3s forwards;transform-origin:0dvw 0dvw;stroke:#000;stroke-width:.4;stroke-opacity:1;opacity:1}#color-key .ck-toggled{animation:pulse-key .4s forwards;transform-origin:.5dvw 4dvw;border:0 inset #0a0a0a;border-bottom-right-radius:.25dvw .25dvw;border-bottom-left-radius:.25dvw .25dvw;border-top-right-radius:.15dvw .15dvw;border-top-left-radius:.15dvw .15dvw;box-shadow:0 .1dvw .7dvw 0 #fff;z-index:1;opacity:1}#color-key .ck-toggled-light{border:.07dvw solid #fff}#color-key .inactive-scale-note{border:.05dvw solid #787878;border-bottom-right-radius:.4dvw .4dvw;border-bottom-left-radius:.4dvw .4dvw}.color-key-note-name{position:relative;bottom:0;width:100%;text-align:center;font-size:.8dvw;font-family:Arial Unicode MS,Bravura Text;font-weight:100;color:#1e1e1e;margin-bottom:.3dvw;text-shadow:.06dvw -.05dvw .05dvw hsla(0,0%,100%,.1)}.boxed{position:absolute;top:-.2dvw;left:-.3dvw;width:2dvw;height:2dvw;border:.007dvw solid #6e6e6e;border-radius:.4dvw}:root{--flash-duration:0.6s;--shadow-location:40%;--black-shadow-location:3%;--black-minor-shadow-location:30%;height:0dvw}.key{cursor:pointer;flex-grow:1;position:relative;height:100%;border:.04dvw solid #fff;border-bottom-right-radius:.2dvw .2dvw;border-bottom-left-radius:.2dvw .2dvw;z-index:1}.flash-overlay{box-shadow:0 .6dvw 2.5dvw 0 hsla(0,0%,100%,.8)}.fade-out-overlay,.flash-overlay{opacity:0;position:absolute;top:0;left:0;width:100%;height:100%;z-index:1}.fade-out-overlay{background-color:#787878;box-shadow:0 .1dvw .1dvw .1dvw #2c2c2c;pointer-events:none}@keyframes fade-out-overlay{0%{opacity:1}10%{opacity:.7}15%{opacity:.3}to{opacity:0}}.fade-out-overlay.active{animation:fade-out-overlay .4s ease-out forwards}@keyframes flash-overlay{0%{background-color:#000;opacity:1}10%{background-color:#fff;opacity:1}to{opacity:0}}.flash-overlay.flash{animation:flash-overlay var(--flash-duration) ease-out forwards}@keyframes flash-emo{0%{color:#fff}10%{color:#000}to{color:var(--activeColor)}}.flash-emo{animation:flash-emo var(--flash-duration) ease-out forwards}@keyframes flash-pc-label{0%{fill:#fff}to{fill:#000}}.flash-pc-label{animation:flash-pc-label var(--flash-duration) ease-out forwards}@keyframes overtone-pulse{0%,to{filter:brightness(.9)}50%{filter:brightness(1)}}.overtone-pulse{animation:overtone-pulse .35s ease-out infinite}@keyframes overtone-pulse-emo{0%,to{filter:brightness(.75)}50%{filter:brightness(.95)}}.overtone-pulse-emo{animation:overtone-pulse-emo .35s ease-out infinite}@keyframes overtone-pulse-svg{0%,to{transform:scale(1.065);filter:opacity(1);filter:blur(.015dvw)}50%{transform:scale(1.05);filter:opacity(.9);filter:blur(.02dvw)}}.active-slice.overtone-pulse-svg{animation:pulse-slice .15s forwards,overtone-pulse-svg .35s ease-in-out .15s infinite;transform-origin:0dvw 0dvw}.piano-bars{top:39.4dvw;width:97.7vw;padding-left:.6vw;z-index:1}.piano-bars,.piano-bars-key{display:flex;justify-content:space-between;position:absolute;height:.4dvw}.piano-bars-key{top:8.76vw;width:101vw;padding-left:2.6vw;margin:0 -87.7vw;z-index:4}.bar,.pc-display-note{border:0 solid grey}.active-pc-display{border:.005dvw solid #000;stroke:#000;stroke-width:.01dvw}.white{width:1%;height:10dvw;background:linear-gradient(180deg,#373737,#464646,#787878);border:.04dvw solid rgba(27,27,27,.95);position:relative}.black,.white{display:flex;flex-direction:column;align-items:center;justify-content:flex-end}.black{width:1.2%;height:6.7dvw;background:linear-gradient(180deg,#0f0f0f,#1e1e1e,#282828,#232323);position:absolute;z-index:2}.white .name-display{left:0dvw}.black .name-display{left:-.15dvw}.name-display{position:absolute;font-size:1.5dvw;font-weight:100;text-shadow:.03dvw .03dvw .2dvw #000,.05dvw -.03dvw .2dvw #000,-.05dvw 0 #000;color:#ddd;margin-bottom:.1dvw;z-index:4}.name-display,.scale-degree-display{bottom:0;width:100%;text-align:center;font-family:Arial Unicode MS,Bravura Text}.scale-degree-display{position:relative;font-size:.9dvw;font-weight:900;color:#000;margin-bottom:.65dvw;text-shadow:.06dvw -.05dvw .05dvw hsla(0,0%,100%,.1)}.key-display{position:absolute;top:3.1dvw;left:.7vw;bottom:0;width:100%;text-align:left;font-size:1.5dvw;font-family:Bravura Text;font-weight:100;text-shadow:.03dvw .03dvw .2dvw #000,.05dvw -.03dvw .2dvw #000,-.05dvw 0 #000;margin-bottom:0dvw}.mode-select-container{position:absolute;top:3.1dvw;left:3.3dvw}#chord-container{text-align:left;width:20dvw;height:32dvw;position:absolute;top:3dvw;left:14.5dvw;max-width:20dvw}.chord-display{position:absolute;bottom:0;text-align:center;font-weight:300;color:#bbb;margin:.3dvw;padding:1.3dvw;font-family:Bravura Text;word-spacing:.2dvw}.chord-percent{font-size:1.2dvw;font-family:Trebuchet MS,sans-serif;font-weight:300;vertical-align:middle;text-align:right}.chord-chart-controls{top:-2.7dvw;position:absolute;left:0dvw}.chord-chart{display:flex;flex-wrap:wrap;background-color:#000;color:#fff;padding:.3dvw .75dvw 1.5dvw;position:absolute;top:5.5dvw;right:2dvw;font-family:Bravura Text;font-weight:100;vertical-align:top;text-align:left;max-width:36dvw;min-width:36dvw;min-height:3dvw;max-height:200dvw;z-index:5;margin:0dvw 0dvw 1dvw 2.5dvw;border-spacing:2dvw;border-radius:1dvw;border:.05dvw solid #7d7d7d}.chord{padding:0dvw .25dvw}.chord,.note{cursor:pointer;max-height:min-content}.note{font-family:Bravura Text;padding:0dvw 4.25dvw}.selected-chord{background-color:#3c3c3c;position:relative;border-radius:.8dvw;padding:0dvw .25dvw;max-height:-moz-fit-content;max-height:fit-content;display:inline-block}.chord-space{margin-right:.1dvw}.add-separator,.chart-nav,.copy-chart,.delete-disabled,.delete-entry,.history,.insert-blank-chord,.play-song{margin-left:0dvw;cursor:pointer;font-size:1dvw;font-weight:700;width:2.2dvw;height:2.2dvw;position:absolute;bottom:-.3dvw;padding:0dvw;background-color:#aaa;border-radius:.5dvw}.delete-entry{top:"3dvw";border:.3dvw double red}.delete-disabled,.delete-entry{position:absolute;width:2.2dvw;height:2.2dvw;left:13.5dvw}.delete-disabled{background-color:#606060;border:.28dvw double #030303;color:#000;pointer-events:none}.copy-chart{left:35.5dvw;width:2.2dvw;height:2.2dvw;border:.3dvw double #00f;font-size:1.3dvw;line-height:1dvw}.add-separator{left:11dvw}.add-separator,.insert-blank-chord{width:2.2dvw;height:2.2dvw;border:.3dvw double #00f;font-size:1.1dvw;line-height:1dvw}.insert-blank-chord{left:8.7dvw}.chart-nav{width:2.2dvw;height:2.2dvw;border:.3dvw double #000;font-size:1dvw}.chart-nav.backward{left:4.1dvw}.chart-nav.forward{left:6.3dvw}.play-song{left:-.2dvw;width:4.2dvw;height:2.2dvw;border:.3dvw double #000}.add-separator.add-separator:active,.chart-nav.chart-nav:active,.copy-chart.copy-chart:active,.delete-entry.delete-entry:active,.history.history:active,.insert-blank-chord.insert-blank-chord:active{width:2.2dvw}.play-song.play-song:active{width:4.2dvw}.history{width:2.2dvw;height:2.2dvw;border:.3dvw double #000;font-size:1.4dvw;line-height:1.5dvw}.history.undo{left:30.8vw}.history.redo{left:33dvw}.history.redo-disabled{left:33dvw;background-color:#606060;color:#000;border:.28dvw double #030303;width:2.2dvw;pointer-events:none}.song-and-composer-container{display:flex;justify-content:space-between;width:100%}.song-title,.song-title-input{flex-grow:9;white-space:nowrap;text-align:center;cursor:pointer;font-style:normal;font-family:Bravura Text;font-weight:700}.composer-input,.song-tempo-input,.song-title-input{background-color:#1e1e1e;color:#fff;cursor:text;font-size:1.3dvw}.composer,.composer-input{flex-grow:1;text-align:right}.composer,.composer-input,.song-tempo,.song-tempo-input{white-space:nowrap;cursor:pointer;font-style:normal;font-family:Bravura Text;font-weight:100}.song-tempo,.song-tempo-input{flex-grow:3;text-align:left;font-size:2.2dvw;width:.1dvw}.time-signature{padding:0dvw;text-align:center;-webkit-appearance:none;appearance:none;cursor:pointer;color:#fff;font-style:normal;font-family:Bravura Text;font-weight:700;border:0}.separator{cursor:pointer;top:0;border:0dvw}.selected-separator,.separator{padding:0dvw;text-align:center;-webkit-appearance:none;appearance:none;color:#fff;position:relative;font-family:Bravura Text;max-height:-moz-fit-content;max-height:fit-content}.selected-separator{background-color:#3c3c3c;top:0dvw;border:0dvw solid #acacac;border-radius:1.7dvw}.emo-display{position:absolute;top:2dvw;width:22dvw;left:36.4dvw;height:32dvw;bottom:0;text-align:left;line-height:1.6dvw;font-family:Futura;font-weight:100;color:#eaeaea;z-index:10}.emo-p-root{--activeColor:var(--color-R);color:var(--activeColor)}.emo-min-second{--activeColor:var(--color-m2);color:var(--activeColor)}.emo-maj-second{--activeColor:var(--color-M2);color:var(--activeColor)}.emo-min-third{--activeColor:var(--color-m3);color:var(--activeColor)}.emo-maj-third{--activeColor:var(--color-M3);color:var(--activeColor)}.emo-p-fourth{--activeColor:var(--color-P4);color:var(--activeColor)}.emo-tritone{--activeColor:var(--color-d5);color:var(--activeColor)}.emo-p-fifth{--activeColor:var(--color-P5);color:var(--activeColor)}.emo-min-sixth{--activeColor:var(--color-m6);color:var(--activeColor)}.emo-maj-sixth{--activeColor:var(--color-M6);color:var(--activeColor)}.emo-min-seventh{--activeColor:var(--color-m7);color:var(--activeColor)}.emo-maj-seventh{--activeColor:var(--color-M7);color:var(--activeColor)}#keyboard-inputs{left:.5dvw;height:5dvw;top:22dvw;width:14dvw}#emo-inputs,#keyboard-inputs{text-align:left;display:flex;position:absolute;z-index:4}#emo-inputs{left:27dvw;top:6dvw;padding:.5dvw}#emo-selects{top:0dvw;left:-25dvw;position:absolute}table{top:0dvw;font-size:1.1dvw}td,th{padding:0;margin:0}th{color:#fff;font-weight:600;text-align:center}td{padding:0;margin:0}input{font-family:Trebuchet MS,sans-serif;font-style:italic;font-size:1.1dvw;font-weight:100;background-color:#aaa;color:#000;margin:0;height:1dvw;width:10dvw;padding:.1dvw}.inputs{text-align:left;width:35dvw;padding:.1dvw;margin:.05dvw 0;box-sizing:border-box}.chord-symbol{margin:0dvw;padding:0dvw;font-weight:100;color:#fff;font-family:Bravura Text}.chord-symbol-poly{margin:0dvw;padding:0dvw;font-weight:400;color:#aaa}.chord-symbols{margin:0;padding:0dvw;color:#505050;font-family:Bravura Text}.app-name-text{font-family:American Typewriter,sans-serif;font-weight:300;color:#45cfcf}.app-name-text,.title-text{margin:0dvw;padding:0dvw;top:0;font-size:1.2dvw;text-align:left;text-shadow:#fff 0 0 .1dvw}.title-text{font-family:Arial Unicode MS,Bravura Text;color:#dcdcdc}select{background-color:#000;color:#919191;top:0dvw;position:absolute;border-radius:.4dvw;padding:.3dvw}button{border-radius:1.6dvw;background:linear-gradient(145deg,hsla(0,0%,71.4%,.9),rgba(145,139,130,.8));box-shadow:inset .2dvw .2dvw .4dvw rgba(255,220,150,.15),inset -.2dvw -.2dvw .1dvw hsla(0,0%,100%,.2),.2dvw .2dvw .2dvw .05dvw rgba(0,0,0,.3);border:.1dvw solid #6a6a6a;color:#171717;text-align:center;font-size:.9dvw;padding:0dvw;height:2dvw;transition:all .1s;margin:0dvw;top:0dvw;filter:drop-shadow(0 0 .2dvw rgba(0,0,0,.6))}button,button span{display:inline-block;cursor:pointer;position:relative}button span{transition:.2s}.button:before{content:"";position:absolute;top:0;left:0;display:block;width:100%;height:100%;z-index:-1;transform:scaleY(.1);transition:all 0s}button span:after{position:absolute;opacity:0;right:-1dvw;transition:0s}.button-disabled{background:linear-gradient(0deg,#695e4f,#494139);border:.28dvw double #030303;color:#000;pointer-events:none}button:hover{background:linear-gradient(145deg,#bfb8af,#786f64)}button:active{background:linear-gradient(145deg,hsla(0,0%,40.4%,.8),hsla(0,0%,66.3%,.8));box-shadow:inset .2dvw .2dvw .6dvw rgba(12,7,2,.5),inset -.2dvw -.2dvw .6dvw rgba(229,216,193,.4);color:rgba(0,0,0,.7);opacity:.99}button:active span{padding-left:0dvw}button:hover span:after{opacity:1;right:0}.p-root{--activeColor:linear-gradient(var(--color-R-shadow),var(--color-R) var(--shadow-location))}.black-p-root,.p-root{background-image:var(--activeColor)}.black-p-root{--activeColor:linear-gradient(var(--color-R-black-shadow),var(--color-R) var(--black-shadow-location))}.min-second{--activeColor:linear-gradient(var(--color-m2-shadow),var(--color-m2) var(--shadow-location))}.black-min-second,.min-second{background-image:var(--activeColor)}.black-min-second{--activeColor:linear-gradient(var(--color-m2-black-shadow),var(--color-m2-black) var(--black-shadow-location))}.maj-second{--activeColor:linear-gradient(var(--color-M2-shadow),var(--color-M2) var(--shadow-location))}.black-maj-second,.maj-second{background-image:var(--activeColor)}.black-maj-second{--activeColor:linear-gradient(var(--color-M2-black-shadow),var(--color-M2-black) var(--black-shadow-location))}.min-third{--activeColor:linear-gradient(var(--color-m3-shadow),var(--color-m3) var(--shadow-location))}.black-min-third,.min-third{background-image:var(--activeColor)}.black-min-third{--activeColor:linear-gradient(var(--color-m3-black-shadow),var(--color-m3-black) var(--black-shadow-location))}.maj-third{--activeColor:linear-gradient(var(--color-M3-shadow),var(--color-M3) var(--shadow-location))}.black-maj-third,.maj-third{background-image:var(--activeColor)}.black-maj-third{--activeColor:linear-gradient(var(--color-M3-black-shadow),var(--color-M3-black) var(--black-shadow-location))}.p-fourth{--activeColor:linear-gradient(var(--color-P4-shadow),var(--color-P4) var(--shadow-location))}.black-p-fourth,.p-fourth{background-image:var(--activeColor)}.black-p-fourth{--activeColor:linear-gradient(var(--color-P4-black-shadow),var(--color-P4-black) var(--black-shadow-location))}.tritone{--activeColor:linear-gradient(var(--color-d5-shadow),var(--color-d5) var(--shadow-location))}.black-tritone,.tritone{background-image:var(--activeColor)}.black-tritone{--activeColor:linear-gradient(var(--color-d5-black-shadow),var(--color-d5-black) var(--black-shadow-location))}.p-fifth{--activeColor:linear-gradient(var(--color-P5-shadow),var(--color-P5) var(--shadow-location))}.black-p-fifth,.p-fifth{background-image:var(--activeColor)}.black-p-fifth{--activeColor:linear-gradient(var(--color-P5-black-shadow),var(--color-P5-black) var(--black-shadow-location))}.min-sixth{--activeColor:linear-gradient(var(--color-m6-shadow),var(--color-m6) var(--shadow-location))}.black-min-sixth,.min-sixth{background-image:var(--activeColor)}.black-min-sixth{--activeColor:linear-gradient(var(--color-m6-black-shadow),var(--color-m6-black) var(--black-shadow-location))}.maj-sixth{--activeColor:linear-gradient(var(--color-M6-shadow),var(--color-M6) var(--shadow-location))}.black-maj-sixth,.maj-sixth{background-image:var(--activeColor)}.black-maj-sixth{--activeColor:linear-gradient(var(--color-M6-black-shadow),var(--color-M6-black) var(--black-shadow-location))}.min-seventh{--activeColor:linear-gradient(var(--color-m7-shadow),var(--color-m7) var(--shadow-location))}.black-min-seventh,.min-seventh{background-image:var(--activeColor)}.black-min-seventh{--activeColor:linear-gradient(var(--color-m7-black-shadow),var(--color-m7-black) var(--black-shadow-location))}.maj-seventh{--activeColor:linear-gradient(var(--color-M7-shadow),var(--color-M7) var(--shadow-location))}.black-maj-seventh,.maj-seventh{background-image:var(--activeColor)}.black-maj-seventh{--activeColor:linear-gradient(var(--color-M7-black-shadow),var(--color-M7-black) var(--black-shadow-location))}.colkey-scale-p-root{background-image:linear-gradient(var(--color-R-black-shadow),var(--color-R-shadow) var(--shadow-location))}.colkey-scale-min-second{background-image:linear-gradient(var(--color-m2-black-shadow),var(--color-m2-shadow) var(--shadow-location))}.colkey-scale-maj-second{background-image:linear-gradient(var(--color-M2-black-shadow),var(--color-M2-shadow) var(--shadow-location))}.colkey-scale-min-third{background-image:linear-gradient(var(--color-m3-black-shadow),var(--color-m3-shadow) var(--shadow-location))}.colkey-scale-maj-third{background-image:linear-gradient(var(--color-M3-black-shadow),var(--color-M3-shadow) var(--shadow-location))}.colkey-scale-p-fourth{background-image:linear-gradient(var(--color-P4-black-shadow),var(--color-P4-shadow) var(--shadow-location))}.colkey-scale-tritone{background-image:linear-gradient(var(--color-d5-black-shadow),var(--color-d5-shadow) var(--shadow-location))}.colkey-scale-p-fifth{background-image:linear-gradient(var(--color-P5-black-shadow),var(--color-P5-shadow) var(--shadow-location))}.colkey-scale-min-sixth{background-image:linear-gradient(var(--color-m6-black-shadow),var(--color-m6-shadow) var(--shadow-location))}.colkey-scale-maj-sixth{background-image:linear-gradient(var(--color-M6-black-shadow),var(--color-M6-shadow) var(--shadow-location))}.colkey-scale-min-seventh{background-image:linear-gradient(var(--color-m7-black-shadow),var(--color-m7-shadow) var(--shadow-location))}.colkey-scale-maj-seventh{background-image:linear-gradient(var(--color-M7-black-shadow),var(--color-M7-shadow) var(--shadow-location))}.black-colkey-scale-p-root{background-image:linear-gradient(var(--color-R-black-shadow),var(--color-R-shadow) var(--shadow-location))}.black-colkey-scale-min-second{background-image:linear-gradient(var(--color-m2-black-shadow),var(--color-m2-shadow) var(--shadow-location))}.black-colkey-scale-maj-second{background-image:linear-gradient(var(--color-M2-black-shadow),var(--color-M2-shadow) var(--shadow-location))}.black-colkey-scale-min-third{background-image:linear-gradient(var(--color-m3-black-shadow),var(--color-m3-shadow) var(--shadow-location))}.black-colkey-scale-maj-third{background-image:linear-gradient(var(--color-M3-black-shadow),var(--color-M3-shadow) var(--shadow-location))}.black-colkey-scale-p-fourth{background-image:linear-gradient(var(--color-P4-black-shadow),var(--color-P4-shadow) var(--shadow-location))}.black-colkey-scale-tritone{background-image:linear-gradient(var(--color-d5-black-shadow),var(--color-d5-shadow) var(--shadow-location))}.black-colkey-scale-p-fifth{background-image:linear-gradient(var(--color-P5-black-shadow),var(--color-P5-shadow) var(--shadow-location))}.black-colkey-scale-min-sixth{background-image:linear-gradient(var(--color-m6-black-shadow),var(--color-m6-shadow) var(--shadow-location))}.black-colkey-scale-maj-sixth{background-image:linear-gradient(var(--color-M6-black-shadow),var(--color-M6-shadow) var(--shadow-location))}.black-colkey-scale-min-seventh{background-image:linear-gradient(var(--color-m7-black-shadow),var(--color-m7-shadow) var(--shadow-location))}.black-colkey-scale-maj-seventh{background-image:linear-gradient(var(--color-M7-black-shadow),var(--color-M7-shadow) var(--shadow-location))}@keyframes pulse{0%{transform:scale(1)}to{transform:scale(1.05)}}@keyframes pulse-slice{0%{transform:scale(1)}50%{transform:scale(1.1)}to{transform:scale(1.08)}}@keyframes deactivate-slice{0%{transform:scale(1.09)}10%{transform:scale(1.08)}70%{transform:scale(.98)}to{transform:scale(1)}}@keyframes pulse-key{0%{transform:scale(1)}to{transform:scale(1.07)}}.path{transition:fill .3s ease;opacity:.8}.path.active{animation:pulse 1s infinite}svg{width:100%;height:37dvw}.maj-second,.maj-seventh,.maj-sixth,.maj-third,.min-second,.min-seventh,.min-sixth,.min-third,.p-fifth,.p-fourth,.p-root,.tritone{fill:#ccc}.pie-slice{stroke:#000;stroke-width:.1;stroke-opacity:.3;animation:deactivate-slice .12s forwards}.active-slice,.pie-slice{transition:all .3s ease;transform-origin:0dvw 0dvw}.active-slice{animation:pulse-slice .15s forwards;stroke:#444;stroke-width:.25;stroke-opacity:1;font-weight:700;z-index:10}.pie-center-circle{transition:all .6s ease}.chord-center-circle{transition:fill .4s cubic-bezier(.4,0,.2,1),fill-opacity .5s ease-in-out,stroke-opacity .3s ease}.pie-container{width:37dvw;height:32dvw;padding-bottom:0dvw;position:absolute;top:3.3dvw;right:0dvw}#pie-center-container{display:flex;justify-content:space-between;position:fixed;top:18.3dvw;right:12dvw;width:18vw;height:4dvw;padding-left:0;font-family:Trebuchet MS;color:#fff;z-index:5}#pie-center-container,.pie-chord-symbol{font-weight:100;text-align:center;text-anchor:middle}.pie-chord-symbol{font-family:Bravura Text;margin:0dvw;padding:0dvw;color:#000}.pie-chart{width:36dvw;height:31.5dvw;border-radius:1dvw;padding-bottom:0dvw;padding-top:0dvw;padding-right:0dvw;position:absolute;top:3dvw;left:62.3dvw;background-image:linear-gradient(180deg,#fff 0,#fffed6 15%,#f3c59d 45.5%,#6b758e 48.5%,#27315b 69%,#000);border:.05dvw solid #555;border-spacing:"2dvw";box-shadow:inset 0dvw 0dvw 5dvw .5dvw rgba(0,0,0,.99)}.slider-parent{display:flex;align-items:center;justify-content:left;color:#fff;height:3dvw;left:3dvw}input[type=range]{transform:rotate(-90deg);cursor:pointer;outline:none;width:9dvw;top:0dvw;overflow:hidden}.buble{height:3dvw;position:absolute;font-size:1.4dvw}.App,body,html{user-select:none;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none}.piano-background{background-image:url(/images/pianobackingd1742x892dark.jpg);top:-11.93dvw;height:51.25dvw}.piano-background,.piano-bot-background{background-size:100%;background-position:top;background-repeat:no-repeat;width:100dvw;position:absolute;left:0;z-index:0;opacity:1}.piano-bot-background{background-image:url(/images/pianobottom4dark.jpg);top:49.27dvw;height:2dvw}.background-img{position:fixed;top:0;left:0;width:100%;height:100%;object-fit:cover;z-index:-1;opacity:.55}.palette-option:hover{background-color:#444}.key.overtone:after{content:"";position:absolute;left:0;right:0;top:0;height:.3dvw;background:hsla(0,0%,100%,0);pointer-events:none}.midi-player button:active{width:auto!important}input[type=file]{font-size:.8dvw!important;width:6dvw!important;background-color:hsla(0,0%,100%,.1)!important;border-radius:.2dvw!important;padding:0!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;border:1px solid hsla(0,0%,100%,.1)!important;color:transparent!important;cursor:pointer!important;transition:all .2s ease!important;height:1.8dvw!important;margin:0!important;outline:none!important;overflow:hidden!important}input[type=file]::-webkit-file-upload-button{background:hsla(0,0%,100%,.1)!important;border:none!important;color:hsla(0,0%,100%,.8)!important;font-size:.8dvw!important;cursor:pointer!important;padding:.2dvw .4dvw!important;margin:0!important;border-radius:.2dvw!important;-webkit-backdrop-filter:blur(10px)!important;backdrop-filter:blur(10px)!important;width:100%!important;height:100%!important}.midi-processing-message{background-color:rgba(0,0,0,.6);color:#fff;padding:2rem;border-radius:1rem;font-size:1.5rem;font-weight:700;text-align:center;border:.5dvw solid hsla(0,0%,100%,.3)}.settings-panel-box{padding:.4dvw .5dvw;margin:1dvw 0dvw;border-radius:.4dvw;outline-width:.07dvw;outline-style:solid}.settings-panel-box.dark{background-color:rgba(0,0,0,.5)}.settings-panel-box.light{background-color:hsla(0,0%,48.6%,.45)}.settings-panel-box.warm{background-color:rgba(26,26,26,.6)}.settings-panel-title{margin-bottom:.3dvw}.settings-panel-title.shown{font-weight:700}.settings-panel-title.hidden{font-weight:400}
/*# sourceMappingURL=main.8a3b5911.chunk.css.map */