.recording-manager[data-v-a03c1f80]{padding:0}.header[data-v-a03c1f80]{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding:0 4px}.stats[data-v-a03c1f80]{display:flex;align-items:center}.count[data-v-a03c1f80]{font-size:14px;color:#606266;font-weight:500}.empty-state[data-v-a03c1f80]{text-align:center;padding:40px 0}.remark-cell[data-v-a03c1f80]{cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color .2s;min-height:20px;color:#606266}.remark-cell[data-v-a03c1f80]:hover{background-color:#f5f7fa}.remark-cell[data-v-a03c1f80]:empty:before{content:"点击添加备注";color:#c0c4cc}[data-v-a03c1f80] .recording-manager-dialog .el-dialog__body{padding:20px}[data-v-a03c1f80] .el-table .el-table__cell{padding:8px 0}.piano-container[data-v-375b85f7]{min-height:100vh;background:#f2f2f7;padding:2rem;font-family:Segoe UI,Tahoma,Geneva,Verdana,sans-serif}.header-section[data-v-375b85f7]{text-align:center;margin-bottom:1.5rem}.page-title[data-v-375b85f7]{font-size:2.2rem;font-weight:700;color:#0b0b0c;margin:0 0 .3rem}.page-subtitle[data-v-375b85f7]{font-size:1rem;color:#4b5563;margin:0;font-weight:400}.main-content[data-v-375b85f7]{display:grid;grid-template-columns:240px 1fr 240px;gap:1.5rem;align-items:start;max-width:1300px;margin:0 auto 1.5rem;padding:0 1rem}.left-controls[data-v-375b85f7],.right-controls[data-v-375b85f7]{display:flex;flex-direction:column;gap:1rem}.piano-section[data-v-375b85f7]{display:flex;justify-content:center;align-items:center}.piano[data-v-375b85f7]{position:relative;display:flex;height:260px;width:100%;max-width:800px;background:linear-gradient(145deg,#2c3e50,#34495e);padding:18px;border-radius:16px;box-shadow:0 15px 30px #0000004d,inset 0 2px 10px #ffffff1a}.key[data-v-375b85f7]{position:relative;border:1px solid #2c3e50;cursor:pointer;transition:all .1s ease;display:flex;justify-content:center;align-items:flex-end;user-select:none}.key.white[data-v-375b85f7]{width:54px;height:100%;background:linear-gradient(145deg,#fff,#f8f9fa);border-bottom-left-radius:6px;border-bottom-right-radius:6px;margin:0 1px;box-shadow:0 4px 8px #0000001a}.key.white[data-v-375b85f7]:hover{background:linear-gradient(145deg,#f8f9fa,#e9ecef);transform:translateY(1px)}.key.white[data-v-375b85f7]:active,.key.white.active[data-v-375b85f7]{background:linear-gradient(145deg,#e9ecef,#dee2e6);box-shadow:0 2px 4px #0003 inset;transform:translateY(3px)}.key.black[data-v-375b85f7]{width:36px;height:65%;background:linear-gradient(145deg,#495057,#212529);position:absolute;top:18px;z-index:10;border-radius:0 0 4px 4px;box-shadow:0 6px 12px #0006}.key.black[data-v-375b85f7]:hover{background:linear-gradient(145deg,#343a40,#495057);transform:translateY(1px)}.key.black[data-v-375b85f7]:active,.key.black.active[data-v-375b85f7]{background:linear-gradient(145deg,#212529,#343a40);box-shadow:0 2px 6px #0009 inset;transform:translateY(2px)}.key-label[data-v-375b85f7]{font-size:12px;font-weight:600;padding-bottom:12px;pointer-events:none;opacity:.7;transition:opacity .2s}.key.white .key-label[data-v-375b85f7]{color:#6c757d}.key.black .key-label[data-v-375b85f7]{color:#adb5bd}.key:hover .key-label[data-v-375b85f7]{opacity:1}.keyboard-mapping-compact[data-v-375b85f7]{background:#ffffff0d;border-radius:8px;padding:.75rem}.mapping-row[data-v-375b85f7]{display:flex;align-items:center;margin-bottom:.3rem;font-size:.85rem}.mapping-row[data-v-375b85f7]:last-child{margin-bottom:0}.mapping-label[data-v-375b85f7]{font-weight:600;color:#000;min-width:40px;margin-right:.5rem}.mapping-keys[data-v-375b85f7]{color:#8e8e93;font-family:Courier New,monospace;font-size:.8rem}.control-group[data-v-375b85f7]{background:#ffffff1a;backdrop-filter:blur(10px);border-radius:12px;padding:1rem;border:1px solid rgba(60,60,67,.12);height:fit-content;box-sizing:border-box;overflow:hidden}.control-title[data-v-375b85f7]{color:#000;font-size:.95rem;font-weight:600;margin:0 0 .75rem;display:flex;align-items:center}.control-title[data-v-375b85f7]:before{content:"";width:3px;height:16px;background:#f2f2f7;border-radius:2px;margin-right:.4rem}.button-column[data-v-375b85f7]{display:flex;flex-direction:column;gap:.6rem;align-items:stretch;width:100%;box-sizing:border-box}.control-button[data-v-375b85f7]{width:100%!important;height:38px!important;border-radius:8px!important;font-weight:500!important;font-size:.85rem!important;transition:all .3s ease!important;box-shadow:0 2px 8px #00000026!important;display:flex!important;align-items:center!important;justify-content:center!important;padding:0 8px!important;min-height:38px!important;max-height:38px!important;box-sizing:border-box!important;margin:0!important;flex-shrink:0!important}.control-button[data-v-375b85f7]:hover{transform:translateY(-2px);box-shadow:0 6px 20px #00000040}.record-btn.is-disabled[data-v-375b85f7]{opacity:.6}.record-btn[data-v-375b85f7]:not(.is-disabled){background:linear-gradient(135deg,#ff6b6b,#ee5a24);border:none}.record-btn[data-v-375b85f7]:not(.is-disabled):hover{background:linear-gradient(135deg,#ee5a24,#ff6b6b)}.status-indicator[data-v-375b85f7]{display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.5rem .8rem;background:#ffffff1a;backdrop-filter:blur(10px);border-radius:8px;border:1px solid rgba(60,60,67,.12);transition:all .3s ease;font-size:.8rem;width:100%;height:38px;box-sizing:border-box}.status-indicator.active[data-v-375b85f7]{background:#3c3c431f;box-shadow:0 4px 20px #0000001a}.status-icon[data-v-375b85f7]{font-size:1rem;color:#8e8e93}.status-text[data-v-375b85f7]{color:#000;font-weight:500;min-width:60px;text-align:center}.practice-section-compact[data-v-375b85f7]{max-width:1300px;margin:0 auto;padding:0 1rem}.practice-collapse[data-v-375b85f7]{border:none;background:#ffffff1a;backdrop-filter:blur(10px);border-radius:12px;overflow:hidden;border:1px solid rgba(60,60,67,.12)}[data-v-375b85f7] .practice-collapse .el-collapse-item__header{background:transparent;color:#000;font-weight:600;font-size:.95rem;border:none;padding:1rem}[data-v-375b85f7] .practice-collapse .el-collapse-item__content{background:transparent;border:none;padding:0 1rem 1rem}.practice-section-content[data-v-375b85f7]{color:#000}[data-v-375b85f7] .practice-tabs .el-tabs__header{background:linear-gradient(135deg,#007aff26,#764ba233);border-radius:12px;padding:.8rem;margin-bottom:1rem;border:1px solid rgba(255,255,255,.1)}[data-v-375b85f7] .practice-tabs .el-tabs__nav{border:none!important}[data-v-375b85f7] .practice-tabs .el-tabs__active-bar{display:none!important}[data-v-375b85f7] .practice-tabs .el-tabs__nav-wrap:after{display:none}[data-v-375b85f7] .practice-tabs .el-tabs__item{color:#fff!important;border:none!important;background:linear-gradient(135deg,#667eea4d,#764ba24d)!important;border-radius:8px!important;margin-right:.5rem!important;margin-bottom:.3rem!important;padding:8px 16px!important;transition:all .3s ease!important;font-weight:600!important;font-size:.9rem!important;text-shadow:0 1px 3px rgba(0,0,0,.4)!important;border:1px solid rgba(60,60,67,.12)!important}[data-v-375b85f7] .practice-tabs .el-tabs__item.is-active{color:#fff!important;background:#f2f2f7!important;font-weight:700!important;text-shadow:0 1px 3px rgba(0,0,0,.6)!important;border:1px solid rgba(255,255,255,.3)!important;box-shadow:0 4px 15px #667eea4d!important}[data-v-375b85f7] .practice-tabs .el-tabs__item:hover{color:#fff!important;background:linear-gradient(135deg,#667eea80,#764ba280)!important;text-shadow:0 1px 3px rgba(0,0,0,.5)!important;transform:translateY(-1px)!important;box-shadow:0 2px 8px #007aff26!important}.sheet-music-compact[data-v-375b85f7]{background:#00000040;padding:1rem;border-radius:12px;display:flex;flex-wrap:wrap;gap:.6rem;justify-content:center;line-height:1.2}.sheet-bar[data-v-375b85f7]{display:inline-flex;flex-wrap:wrap;gap:.25rem;padding-right:.6rem;border-right:2px solid rgba(60,60,67,.12);margin-right:.6rem}.sheet-bar[data-v-375b85f7]:last-child{border-right:none;margin-right:0;padding-right:0}.sheet-note[data-v-375b85f7]{font-family:SF Mono,Courier New,monospace;font-size:.9rem;font-weight:600;color:#3b3f58;background:#eceff5;width:28px;height:28px;line-height:28px;border-radius:6px;display:inline-block;text-align:center;border:1px solid #c8cce0;box-shadow:0 2px 1px #0000000d,inset 0 1px 2px #fff;transition:all .2s ease-out}.sheet-note[data-v-375b85f7]:hover{background:#dfe3ec;border-color:#b9bfcf;transform:translateY(-1px);box-shadow:0 3px 6px #0000001a,inset 0 1px 2px #fff}@media (max-width: 1200px){.main-content[data-v-375b85f7]{grid-template-columns:220px 1fr 220px;gap:1rem;max-width:1100px}}@media (max-width: 1024px){.main-content[data-v-375b85f7]{grid-template-columns:1fr;gap:1rem;padding:0 .5rem}.left-controls[data-v-375b85f7],.right-controls[data-v-375b85f7]{flex-direction:row;justify-content:center;gap:1rem}.control-group[data-v-375b85f7]{flex:1;max-width:300px}.piano-container[data-v-375b85f7]{padding:1rem}.page-title[data-v-375b85f7]{font-size:2rem}}@media (max-width: 768px){.left-controls[data-v-375b85f7],.right-controls[data-v-375b85f7]{flex-direction:column;gap:.75rem}.control-group[data-v-375b85f7]{max-width:none}.piano[data-v-375b85f7]{height:220px;padding:15px;max-width:600px}.key.white[data-v-375b85f7]{width:46px}.key.black[data-v-375b85f7]{width:30px}.page-title[data-v-375b85f7]{font-size:1.8rem}.page-subtitle[data-v-375b85f7]{font-size:.9rem}}@media (max-width: 480px){.piano-container[data-v-375b85f7]{padding:.5rem}.control-group[data-v-375b85f7]{padding:1rem}.main-content[data-v-375b85f7]{gap:.75rem}.piano[data-v-375b85f7]{height:200px;padding:12px;max-width:500px}.key.white[data-v-375b85f7]{width:40px}.key.black[data-v-375b85f7]{width:26px}}.content-sections[data-v-375b85f7]{margin-top:40px;display:flex;flex-direction:column;gap:20px;max-width:1200px;margin-left:auto;margin-right:auto;padding:0 20px}