body{font-family:sans-serif;background:#111;color:#eee;text-align:center;margin:0;padding:20px}#keyboard{margin-top:20px;display:flex;justify-content:center;flex-wrap:wrap;gap:8px}.keyboard-row{display:flex;justify-content:center;margin-bottom:8px}.key{width:40px;height:50px;border-radius:6px;background:#333;display:flex;flex-direction:column;justify-content:center;align-items:center;color:#fff;font-size:12px;cursor:pointer;transition:background .1s;padding:4px 0;box-sizing:border-box}.key.active{background:#bbb;color:#111}.keyboard-col{display:flex;flex-direction:column;align-items:center;margin-right:8px}.chord-btn{display:inline-block;min-width:60px;min-height:48px;margin:4px;padding:6px 10px;background:#222;color:#fff;border:none;border-radius:6px;font-size:16px;cursor:pointer;transition:background .1s;text-align:center;vertical-align:middle;-webkit-user-select:none;user-select:none}.chord-btn.active{background:#bbb;color:#111}.chord-numeral{font-size:18px;font-weight:700;display:block}.chord-name{font-size:14px;display:block}