/* Native dimensional toy instruments; no hovering required. */
.music-screen{max-width:1080px;margin:auto;padding:0 14px 18px}.music-screen[hidden]{display:none}.music-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:6px 0}.music-heading h1{margin:0;color:#7759a3;font-size:30px}.music-heading button{min-height:50px;padding:10px 20px;border-radius:22px;background:#ffe799;border:3px solid white;color:#79508e;font-family:inherit;font-weight:800;font-size:18px;box-shadow:0 4px #d2ad6b}.music-heading button:disabled{opacity:.55}.music-heading .ready{animation:music-ready 1.8s ease-in-out infinite}.music-picker{display:flex;gap:8px;margin:10px 0}.music-picker button{flex:1;min-width:0;min-height:76px;border:3px solid white;border-radius:20px;background:linear-gradient(#fff9df,#eddcf6);box-shadow:0 4px #b7a4cc;color:#76548e;padding:6px;touch-action:manipulation}.music-picker button[aria-pressed=true]{background:#ffe6a0;border-color:#fff4d5}.music-picker strong{display:block;font-size:13px}.instrument-icon{display:block;width:44px;height:36px;margin:auto;background:center/contain no-repeat}.instrument-icon.drums{background-image:url('music-drums.svg')}.instrument-icon.piano{background:repeating-linear-gradient(90deg,#fff 0 7px,#45516a 8px 10px);border:5px solid #876295;border-radius:7px}.instrument-icon.xylophone{background:linear-gradient(90deg,#ef7d83 0 20%,#f1cb64 20% 40%,#9ccc7c 40% 60%,#70c8cf 60% 80%,#b596d3 80%);border:4px solid #af805c;border-radius:7px}.instrument-icon.guitar{background:#df9b56;border:4px solid #a96942;border-radius:45%;box-shadow:inset 0 0 0 9px #ffe0a0}.instrument-icon.saxophone{background:linear-gradient(110deg,#f7d977,#d9963f);border:4px solid #b58237;border-radius:8px 8px 50% 50%}.music-progress{height:10px;border:2px solid white;border-radius:20px;background:#dfd3ef;overflow:hidden;flex:1}.music-progress span{display:block;height:100%;background:linear-gradient(90deg,#91d8ce,#ffd27b,#df9fcc);transition:width .15s}.music-meter{display:flex;gap:12px;align-items:center;color:#7f6295;font-weight:800;margin:10px 3px}.music-room{padding:12px 20px 20px;border:5px solid #fffcf0;border-radius:30px;background:radial-gradient(ellipse at 50% 5%,#fffbdf,transparent 60%),linear-gradient(#d2e7e9 0 75%,#d8b5aa 75%,#f0d8bd);box-shadow:0 6px #a7bcc7;overflow:hidden}.music-room h2{margin:0 0 4px;text-align:center;font-size:20px;color:#8b6c8e}.music-instrument{height:clamp(300px,calc(100svh - 325px),520px);position:relative;touch-action:none;user-select:none;-webkit-user-select:none;display:flex;justify-content:center;align-items:center}.music-note{touch-action:none;user-select:none;cursor:pointer;font-family:inherit;font-weight:800;font-size:15px;color:#876181;border:0;box-sizing:border-box}.music-note span{pointer-events:none}.music-note.held,.music-note.played{filter:brightness(1.1)}.music-note.played{animation:music-press .25s ease-out}.music-note:focus-visible{outline:4px solid #9566c7;outline-offset:2px}.music-keys{position:relative;width:94%;height:77%;padding:12px 10px 17px;background:linear-gradient(#806292,#433757);border:8px solid #705382;border-radius:22px;display:flex;gap:3px;box-shadow:0 10px #4a345b,0 15px 12px #6b58743b}.white-key{flex:1;min-width:0;background:linear-gradient(90deg,#e8e6dd,#fffdf3 28%,#f8f5e9 80%,#cec8bf);border-radius:0 0 9px 9px;box-shadow:inset 0 -8px #ddd4c5,0 4px #b8afa7;display:flex;align-items:flex-end;justify-content:center;padding-bottom:17px}.black-key{position:absolute;z-index:2;top:12px;width:7.5%;height:58%;background:linear-gradient(90deg,#252437,#595566,#191a2c);border-radius:0 0 7px 7px;box-shadow:0 7px 3px #29253899,inset 0 -6px #101222;color:white}.black-key span{font-size:0}.music-bars{display:flex;align-items:center;gap:8px;width:94%;height:85%;padding:18px;background:linear-gradient(#bd936a,#896747);border-radius:25px;box-shadow:0 9px #745235}.music-bars button{flex:1;min-width:0;height:calc(95% - var(--bar)*5%);background:linear-gradient(100deg,#ffffff50,transparent 40%),var(--color);border:3px solid #ffffff70;border-radius:15px;box-shadow:inset 0 -8px #69526644,0 7px #735056;position:relative}.music-bars button:before,.music-bars button:after{content:'';position:absolute;left:calc(50% - 5px);width:10px;height:10px;border-radius:50%;background:#67525780}.music-bars button:before{top:15%}.music-bars button:after{bottom:15%}.music-drum-kit{width:96%;height:94%;position:relative}.music-drum-kit button{position:absolute;border:7px solid #fff0d4;border-radius:50%;box-shadow:0 9px #bb7797,inset 0 0 0 8px #eed7c0,0 12px 12px #7d5b8130;background:radial-gradient(ellipse at 36% 22%,#fffcdf,#e1cad2);display:flex;align-items:center;justify-content:center}.music-drum-kit .kick{width:32%;height:45%;left:34%;top:52%;border:12px solid #db7294;box-shadow:0 10px #ac5076,inset 0 0 0 7px #ffecd0;background:radial-gradient(#fff9db,#d4dbe7)}.music-drum-kit .tom{width:28%;height:34%;left:26%;top:13%}.music-drum-kit .snare{width:29%;height:35%;left:62%;top:41%}.music-drum-kit .crash,.music-drum-kit .hat{width:29%;height:23%;background:repeating-radial-gradient(ellipse,#f4d47d 0 4px,#e8bc64 5px 7px);border-color:#fce9a5;box-shadow:0 6px #b99658}.music-drum-kit .crash{left:1%;top:2%}.music-drum-kit .hat{right:1%;top:4%}.music-guitar{position:relative;width:87%;height:73%;border-radius:42% 34% 35% 44%;background:radial-gradient(ellipse at 70% 20%,#ffe4af,#e3a160 55%,#b67042);border:10px solid #ae734b;box-shadow:0 10px #845136,inset 0 0 0 7px #ffdda0,0 16px 12px #71576144}.guitar-hole{position:absolute;left:35%;top:25%;width:29%;height:49%;border:7px solid #efd294;border-radius:50%;background:radial-gradient(#37273a,#624055);box-shadow:0 0 0 5px #a97245}.music-guitar button{position:absolute;top:calc(12% + var(--string)*13%);left:5%;right:5%;height:12%;background:transparent;text-align:right;color:#704d45}.music-guitar button:before{content:'';position:absolute;left:0;right:8%;top:50%;height:3px;background:linear-gradient(#fff7db,#a38a67);box-shadow:0 2px #8c604450}.music-sax{position:relative;width:85%;height:90%;border-radius:23% 15% 38% 25%;border:12px solid #e7bd6c;background:linear-gradient(115deg,#ffedb1,#cc8d36 45%,#ffe5a0 58%,#bf8238);box-shadow:inset 0 0 0 5px #ffedac,0 9px #a7804c;display:grid;grid-template-columns:repeat(4,1fr);gap:14px;padding:24px 13%}.music-sax button{border-radius:50%;background:radial-gradient(circle at 35% 20%,#fffbde,#efd8ab 60%,#c19c70);border:4px solid #fff2c9;box-shadow:0 6px #a08052;font-size:21px}.sax-bell{position:absolute;right:-5%;bottom:-4%;width:28%;height:25%;border:8px solid #ffe6a2;border-radius:50%;background:radial-gradient(#75512b,#bd8843);pointer-events:none}.sax-neck{position:absolute;right:12%;top:-8%;width:20%;height:12%;border-top:14px solid #ead195;border-radius:50%;pointer-events:none}.music-tile{background:linear-gradient(140deg,#d1ece4,#e6d6f2,#ffd4a7);color:#775c98}.music-cover{background:radial-gradient(#fff6d7,#bdcddf);border:4px solid white;border-radius:24px}.music-cover img{width:90%;height:90%;object-fit:contain}
@keyframes music-press{35%{translate:0 3px;filter:brightness(1.25)}100%{translate:0 0}}@keyframes music-ready{50%{scale:1.04}}@media(max-width:600px){.music-screen{padding:0 8px 15px}.music-heading h1{font-size:26px}.music-heading button{font-size:15px;padding:8px 13px}.music-picker{gap:4px}.music-picker button{padding:4px 0;border-width:2px;min-height:68px;border-radius:14px}.music-picker strong{font-size:10px}.instrument-icon{width:34px;height:29px}.music-room{padding:10px 5px 12px;border-width:4px}.music-instrument{height:clamp(290px,calc(100svh - 310px),470px)}.music-bars{padding:10px;gap:4px}.music-bars button{border-width:2px;border-radius:9px}.music-note{font-size:12px}.music-sax{gap:10px;padding:16px 8%;border-width:8px}.music-drum-kit .kick{border-width:8px}.music-drum-kit button{border-width:5px}.music-keys{width:98%;padding:8px 4px 12px;border-width:5px}.black-key{top:8px}.music-guitar{width:94%;border-width:7px}}@media(orientation:landscape) and (max-height:600px){.music-instrument{height:260px}.music-picker button{min-height:60px}.instrument-icon{height:25px}}@media(prefers-reduced-motion:reduce){.music-screen *{animation:none!important}}

.music-sax{width:88%;height:96%;border:0;border-radius:0;box-shadow:none;background:url('music-sax.svg') 10% center/auto 96% no-repeat;padding:14px 2% 14px 57%;grid-template-columns:repeat(2,1fr);gap:13px}.music-sax button{min-width:48px;min-height:48px}.sax-neck,.sax-bell{display:none}.instrument-icon.saxophone{background:transparent url('music-sax.svg') center/contain no-repeat;border:0;border-radius:0}.music-guitar:before{content:'';position:absolute;left:-9%;top:37%;width:34%;height:25%;background:linear-gradient(#977654,#5f4650);border:4px solid #bd8b59;border-radius:8px;box-shadow:0 5px #76514a}@media(max-width:600px){.music-sax{padding-left:52%;gap:9px}.music-sax button{min-width:42px}}
.music-guitar{width:65%;margin-left:22%;border-radius:43% 35% 35% 43%}.music-guitar:before{left:-43%;top:40%;width:64%;height:19%;background:repeating-linear-gradient(90deg,transparent 0 23px,#d7b888 24px 26px),linear-gradient(#9d754b,#5f4650)}.music-guitar button{left:-38%;right:4%;top:calc(29% + var(--string)*7%);height:7%}.music-guitar button:before{right:12%;height:2px}.music-guitar button span{position:relative;background:#f8dfaf;padding:0 5px;border-radius:8px}.music-drum-kit button:after{content:'';position:absolute;width:5%;height:50%;background:linear-gradient(90deg,#aaa1a4,#eee6dc,#a89ba2);top:105%;left:48%;z-index:-1;pointer-events:none}.music-drum-kit{isolation:isolate}.music-drum-kit .kick:after{width:10%;height:16%;border-radius:5px;background:#9e86a5;left:45%;top:94%}@media(max-width:600px){.music-guitar{width:69%;margin-left:22%}.music-guitar button{font-size:12px}.music-instrument{height:clamp(270px,calc(100svh - 310px),430px)}}
