.recorder-float{position:fixed;right:24px;bottom:24px;z-index:500;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif}.recorder-float.dragging{-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.recorder-float.panel-below .fade-enter,.recorder-float.panel-below .fade-leave-to{-webkit-transform:translateY(-8px);transform:translateY(-8px)}.recorder-float.dragging .recorder-trigger,.recorder-float.dragging .recorder-trigger:hover{-webkit-transform:none;transform:none;cursor:-webkit-grabbing;cursor:grabbing}.recorder-float.dragging .panel-header{cursor:-webkit-grabbing;cursor:grabbing}.recorder-panel{position:absolute;right:0;bottom:calc(100% + 12px);width:280px;max-width:calc(100vw - 40px);background:#fff;border-radius:12px;-webkit-box-shadow:0 8px 32px rgba(0,0,0,.16);box-shadow:0 8px 32px rgba(0,0,0,.16);max-height:calc(100vh - 140px);overflow:hidden auto}.recorder-float.panel-below .recorder-panel{bottom:auto;top:calc(100% + 12px)}.panel-header{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;position:sticky;top:0;z-index:1;padding:10px 14px;background:#f7f9fc;border-bottom:1px solid #eef1f6;cursor:move;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.panel-title{font-size:14px;font-weight:600;color:#2c3e50}.panel-close{color:#9aa4b2;cursor:pointer}.panel-close:hover{color:#e74c3c}.panel-body{padding:12px 14px 14px}.status-line{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;font-size:13px;color:#6c757d;margin-bottom:8px}.dot{width:8px;height:8px;border-radius:50%;background:#c5ccd6;margin-right:6px}.dot.active{background:#e74c3c;-webkit-animation:recorder-dot 1s infinite;animation:recorder-dot 1s infinite}.dot.paused{background:#faad14;-webkit-animation:none;animation:none}@-webkit-keyframes recorder-dot{0%,to{opacity:1}50%{opacity:.2}}@keyframes recorder-dot{0%,to{opacity:1}50%{opacity:.2}}.time-block{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:baseline;-ms-flex-align:baseline;align-items:baseline;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;margin-bottom:4px}.time-main{font-size:24px;font-weight:700;color:#2c3e50;font-family:Courier New,monospace;line-height:1.2}.time-main.small{font-size:15px;color:#6c757d}.time-sub{font-size:12px;color:#adb5bd}.meta-line{-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;font-size:12px;color:#8c98a8;margin:8px 0 6px}.btn-line,.meta-line{display:-webkit-box;display:-ms-flexbox;display:flex}.btn-line{margin-top:10px;gap:5px}.btn-line .toggle-btn{-webkit-box-flex:1;-ms-flex:1;flex:1}.btn-line .pause-btn{-webkit-box-flex:0;-ms-flex:none;flex:none}.tips{margin-top:10px;font-size:12px;line-height:1.6;color:#9aa4b2;background:#f7f9fc;border-radius:8px;padding:8px 10px}.panel-link{color:#409eff}.panel-link,.recover-line{margin-top:10px;text-align:center;font-size:12px;cursor:pointer}.recover-line{padding:6px 10px;color:#d46b08;background:#fff7e6;border:1px solid #ffd591;border-radius:8px}.recover-line:hover{background:#fff1cc}.recorder-trigger{display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-align:center;-ms-flex-align:center;align-items:center;height:46px;padding:0 16px;border-radius:23px;background:#409eff;color:#fff;font-size:16px;cursor:pointer;-webkit-box-shadow:0 6px 18px rgba(64,158,255,.4);box-shadow:0 6px 18px rgba(64,158,255,.4);-webkit-transition:all .25s;transition:all .25s;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none}.recorder-trigger:hover{-webkit-transform:translateY(-2px);transform:translateY(-2px)}.recorder-trigger.recording{background:#e74c3c;-webkit-box-shadow:0 6px 18px rgba(231,76,60,.4);box-shadow:0 6px 18px rgba(231,76,60,.4)}.recorder-trigger.paused{background:#faad14;-webkit-box-shadow:0 6px 18px rgba(250,173,20,.4);box-shadow:0 6px 18px rgba(250,173,20,.4)}.recorder-trigger.paused .trigger-dot{-webkit-animation:none;animation:none;opacity:.65}.trigger-time{font-size:13px;font-family:Courier New,monospace;margin-left:8px}.trigger-dot{width:8px;height:8px;border-radius:50%;background:#fff;margin-left:8px;-webkit-animation:recorder-dot 1s infinite;animation:recorder-dot 1s infinite}.fade-enter-active,.fade-leave-active{-webkit-transition:opacity .2s,-webkit-transform .2s;transition:opacity .2s,-webkit-transform .2s;transition:opacity .2s,transform .2s;transition:opacity .2s,transform .2s,-webkit-transform .2s}.fade-enter,.fade-leave-to{opacity:0;-webkit-transform:translateY(8px);transform:translateY(8px)}