/* Painted instrument materials, with independent native touch zones. */
#music-picker .instrument-icon{background:none!important;border:0!important;border-radius:0!important;box-shadow:none!important;width:62px;height:43px}
.music-render{width:100%;height:100%;object-fit:contain;pointer-events:none;user-select:none;-webkit-user-drag:none;display:block}
.drum-visual{filter:drop-shadow(0 9px 5px #3b243755)}.drum-visual .music-render{height:100%;width:100%}.music-drum-kit .drum-stick{z-index:8}.music-drum-kit .played .drum-face{animation:render-drum .32s ease-out!important}.music-drum-kit .crash.played .drum-face,.music-drum-kit .hat.played .drum-face,.music-drum-kit .ride.played .drum-face{animation:render-cymbal .7s ease-out!important}
.music-render-scene{position:relative;width:94%;height:94%;isolation:isolate}.music-artwork{position:absolute;inset:0;filter:drop-shadow(0 14px 9px #34203e55);pointer-events:none}.music-render-controls{position:absolute;display:flex;gap:9px;align-items:stretch;justify-content:center;bottom:4%;left:4%;right:4%;z-index:2}
.music-render-controls>button{flex:1;min-width:0;min-height:54px;border:3px solid #fff8df;border-radius:50%;background:radial-gradient(circle at 33% 18%,#fff8cf,#e7c486 55%,#96703c);box-shadow:0 5px #806445,inset 0 -4px #b39155;color:#674344;font-size:20px;position:relative;padding:5px}.music-render-controls>button.held{transform:translateY(4px);box-shadow:0 1px #806445}.music-render-controls>button.played{animation:render-key .3s ease-out}
.render-piano{width:min(94%,720px);height:95%}.render-piano .music-artwork{inset:0 0 8%}.render-piano .music-keys{top:47%;bottom:24%;height:auto;left:13%;right:13%;width:auto;padding:0;gap:1px;transform:none;border:0;background:transparent;box-shadow:none;border-radius:0}.render-piano .music-keys:before{display:none}.render-piano .white-key{min-height:0;border-radius:0 0 8px 8px;background:transparent;border:0;box-shadow:none;align-items:flex-end;padding:0}.render-piano .white-key span{margin-bottom:3px;background:#fff8e5c9;border-radius:30px;padding:1px 6px;font-size:13px;color:#725483}.render-piano .black-key{position:absolute;flex:none;top:0;height:54%;width:7.5%;min-height:0;background:transparent;box-shadow:none;border:0;border-radius:5px;padding:0}.render-piano .white-key.held,.render-piano .black-key.held{background:#ffdf7955;box-shadow:0 0 14px #fff1a3;transform:none}.render-piano .played{background:#ffeaa955!important}
.render-xylophone{width:min(96%,800px)}.render-xylophone .music-artwork{inset:6% 0 4%}.render-xylophone .music-bars{top:23%;bottom:28%;height:auto;left:7%;right:7%;width:auto;transform:none;padding:0;gap:4px;border:0;box-shadow:none;background:transparent}.render-xylophone .music-bars button{height:100%;border:0;background:transparent;box-shadow:none;border-radius:12px}.render-xylophone .music-bars button:before,.render-xylophone .music-bars button:after{display:none}.render-xylophone .music-bars button span{position:absolute;bottom:5%;left:40%;font-size:16px;color:#fff;text-shadow:0 2px 3px #473150}.render-xylophone .music-bars button.held{background:#fff7ac44;box-shadow:inset 0 0 0 3px #fffad499}
.render-guitar .music-artwork{inset:5% 0 20%}.render-strings{top:34%;bottom:40%;left:15%;right:9%;flex-direction:column;gap:0}.render-strings>button{min-height:20px;padding:0;border:0;background:transparent;border-radius:0;box-shadow:none;flex:1}.render-strings>button:before{content:'';position:absolute;left:0;right:0;top:50%;height:1px;background:#fff1c6a0}.render-strings>button span{position:absolute;right:-5%;top:50%;transform:translateY(-50%);width:24px;height:24px;border-radius:50%;background:#fff4d9;border:2px solid white;font-size:13px;display:grid;place-items:center}.render-strings>button.held:before{height:3px;background:#ffed8f}.render-strings>button.played:before{animation:render-string .3s linear}.render-strings>button.held{background:transparent;box-shadow:none}
.render-saxophone .music-artwork{right:47%;left:1%;bottom:0}.render-saxophone .music-render-controls{left:58%;right:4%;top:15%;bottom:15%;display:grid;grid-template-columns:1fr 1fr;gap:13px}.render-saxophone .music-render-controls>button{min-height:48px}
.render-flute .music-artwork,.render-recorder .music-artwork,.render-trumpet .music-artwork{bottom:26%;top:0}.render-flute .music-render-controls>button{background:radial-gradient(circle at 30% 20%,white,#c1d4de 50%,#758da3);border-color:#edfaff;box-shadow:0 5px #64768e}.render-recorder .music-render-controls>button{background:radial-gradient(circle at 30% 20%,#fffef7,#efd8a9 60%,#b88b54);border-color:#fff8e5}.render-tambourine .music-artwork{bottom:16%;left:15%;right:15%}.render-tambourine .music-render-controls{left:12%;right:12%}.render-tambourine .music-render-controls>button{border-radius:24px}.render-triangle .music-artwork{bottom:0;left:15%;right:15%}.render-triangle .music-render-controls{inset:18% 17% 4%}.render-triangle .triangle-ring{background:transparent;border:0;box-shadow:none;color:#70567a;font-size:18px;align-items:flex-end;display:flex;justify-content:center}.render-triangle .triangle-ring span{position:absolute;bottom:4%;background:#fff8e7e8;border:3px solid #fff;border-radius:24px;padding:6px 20px}
.sounding .render-tambourine .music-artwork{animation:render-shake .4s ease-out}.sounding .render-triangle .music-artwork{animation:render-ring .5s ease-out}.sounding .render-trumpet .music-artwork,.sounding .render-flute .music-artwork,.sounding .render-recorder .music-artwork,.sounding .render-saxophone .music-artwork{animation:render-breath .35s ease-out}
@keyframes render-drum{35%{transform:translateY(3px) scale(1.01,.98)}}@keyframes render-cymbal{20%{transform:rotate(3deg)}45%{transform:rotate(-2deg)}70%{transform:rotate(1deg)}}@keyframes render-key{40%{filter:brightness(1.25);translate:0 3px}}@keyframes render-string{25%,75%{translate:0 2px}50%{translate:0 -2px}}@keyframes render-shake{25%{transform:rotate(3deg)}60%{transform:rotate(-3deg)}}@keyframes render-ring{25%{transform:rotate(2deg)}65%{transform:rotate(-1deg)}}@keyframes render-breath{40%{transform:scale(1.015);filter:drop-shadow(0 12px 8px #ffdc6a55)}}
@media(max-width:650px){.music-render-controls{gap:4px;left:1%;right:1%}.music-render-controls>button{min-height:44px;font-size:15px;border-width:2px}.render-saxophone .music-render-controls{left:55%;right:1%;gap:8px}.render-piano .white-key span{font-size:10px;padding:0 3px}.render-guitar .music-artwork{inset:0 0 22%}.render-strings{top:37%;bottom:38%;left:12%;right:8%}.render-strings>button{min-height:22px}.render-triangle .triangle-ring{min-height:0}.render-tambourine .music-render-controls{left:7%;right:7%}#music-picker .instrument-icon{width:52px;height:40px}}
@media(prefers-reduced-motion:reduce){#music-screen *{animation:none!important;transition:none!important}}

.render-piano .music-artwork,.render-xylophone .music-artwork,.render-guitar .music-artwork{inset:0}
.render-piano .music-keys{top:45%;bottom:23%;left:11%;right:10%}
.render-xylophone .music-bars{top:5%;bottom:26%;left:5%;right:5%;align-items:stretch}
.render-xylophone .music-bars button{height:100%}
.render-strings{top:39%;bottom:35%;left:14%;right:9%;transform:rotate(5deg)}

.kit-hardware{position:absolute;pointer-events:none;z-index:0;display:block}.kit-hardware img{width:100%;height:100%;object-fit:contain}.tom-mount{left:42%;top:35%;width:26%;height:39%}.snare-stand{left:21%;top:70%;width:19%;height:28%}
#home-screen .music-cover-kit{position:absolute;inset:0;isolation:isolate}
#home-screen .music-cover .cover-drum{position:absolute;display:block;filter:drop-shadow(0 4px 2px #48374955)}
#home-screen .music-cover .cover-drum img{width:100%;height:100%;margin:0;object-fit:contain;filter:none}
.cover-crash{left:1%;top:1%;width:30%;height:55%;z-index:1}.cover-hat{left:0;top:45%;width:25%;height:54%;z-index:2}.cover-ride{right:1%;top:1%;width:29%;height:58%;z-index:1}.cover-tom{left:32%;top:20%;width:28%;height:44%;z-index:3}.cover-tom-mid{left:54%;top:23%;width:24%;height:42%;z-index:4}.cover-snare{left:18%;top:59%;width:27%;height:37%;z-index:5}.cover-floor{right:2%;top:51%;width:25%;height:47%;z-index:5}.cover-kick{left:34%;top:47%;width:37%;height:53%;z-index:6}
