.piano{-webkit-user-select:none;user-select:none;touch-action:none;box-sizing:border-box;background:#1d2233;border-radius:14px;width:100%;height:clamp(150px,26vw,230px);padding:8px 6px 6px;position:relative}.piano .pk{box-sizing:border-box;-webkit-tap-highlight-color:transparent;flex-direction:column;justify-content:flex-end;align-items:center;padding-bottom:6px;font-family:Heebo,Arial,sans-serif;transition:background 80ms,transform 80ms;display:flex;position:absolute;top:8px}.piano .pk-white{color:#555;z-index:1;background:#fff;border:1px solid #1d2233;border-radius:0 0 8px 8px;height:calc(100% - 14px)}.piano .pk-black{color:#ddd;z-index:2;background:#232634;border-radius:0 0 6px 6px;height:calc(62% - 8px);font-size:10px}.piano .pk-white.is-down{background:#ffe9a8}.piano .pk-black.is-down{background:#6b5b2a}.piano .pk.is-next{box-shadow:inset 0 -6px #2e9e2b;background:#7dd87a!important}.piano .pk.is-play{background:#6cb8ff!important}.piano .pk.is-right{background:#9be38b!important}.piano .pk.is-wrong{background:#ff8f8f!important}.piano .pk.is-chord{background:#ffd23f!important}.piano .pk-label{pointer-events:none;font-size:clamp(9px,1.4vw,14px);font-weight:700}.piano .pk-black .pk-label{font-size:clamp(7px,1vw,10px)}.piano .pk-hint{color:#999;pointer-events:none;margin-top:2px;font-size:10px}.piano-scroll{-webkit-overflow-scrolling:touch;padding-bottom:4px;overflow-x:auto}.piano-scroll .piano{min-width:560px}.music-card{border:2px solid var(--border,#1d2233);background:var(--card,#fff);border-radius:20px;padding:18px}.music-chip{border:2px solid var(--border,#1d2233);background:var(--card,#fff);border-radius:999px;align-items:center;gap:6px;min-height:44px;padding:8px 14px;font-weight:700;display:inline-flex}.music-chip[aria-pressed=true]{background:var(--yellow,#ffd23f)}.song-notes{direction:ltr;flex-wrap:wrap;justify-content:center;gap:6px;display:flex}.song-notes span{text-align:center;background:#f1f2f6;border-radius:8px;min-width:34px;padding:4px 6px;font-size:14px;font-weight:700}.song-notes span.is-done{color:#2e7d2b;background:#d6f5d1}.song-notes span.is-now{color:#fff;background:#7dd87a;transform:scale(1.12)}@keyframes music-pop{0%{opacity:0;transform:scale(.6)}60%{opacity:1;transform:scale(1.08)}to{transform:scale(1)}}.music-pop{animation:.45s ease-out both music-pop}.piano-bleed{box-sizing:border-box;width:100vw;margin-inline:calc(50% - 50vw);padding:0 6px}@media (width>=900px){.piano-bleed{width:auto;margin-inline:0;padding:0}}.piano-bleed .piano-box{height:clamp(190px,42vh,340px)}.piano-box .piano{height:100%}.piano-bar{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:8px;margin-bottom:8px;display:flex}.piano-move{gap:6px;display:flex}.piano-btn{background:#fff;border:2px solid #1d2233;border-radius:12px;min-height:44px;padding:8px 14px;font-size:15px;font-weight:800}.piano-tip{color:#cfd3e0;font-size:13px}.piano-full{z-index:1000;box-sizing:border-box;background:#141826;flex-direction:column;padding:10px;display:flex;position:fixed;inset:0}.piano-full .piano-box{flex:1;min-height:0}.piano-full .piano{border-radius:10px}.piano-full .pk-label{font-size:clamp(12px,2.2vw,20px)}.piano .pk-label{font-size:clamp(11px,1.6vw,16px)}:is(body:has(.piano-bleed) .wa-fab,body:has(.piano-full) .wa-fab){display:none}