:is(.ht,.to-panel) .to-media-fields .to-recorder{padding:0!important;overflow:hidden!important;border:1px solid #e1e8f3!important;border-radius:14px!important;background:linear-gradient(135deg,#fff,#f8fbff)!important;margin-top:12px!important;box-shadow:0 3px 13px #234e7b03}
:is(.ht,.to-panel) .to-recorder .to-recorder-head{display:flex;align-items:center;justify-content:space-between;padding:11px 16px 0;direction:rtl}:is(.ht,.to-panel) .to-recorder-head>span{font-size:11px;font-weight:600;color:#59789e}:is(.ht,.to-panel) .to-recorder-head>small{font-size:9px;color:#a2b0c2!important;display:inline!important;margin:0!important}
:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls{display:flex!important;align-items:center!important;justify-content:space-between!important;gap:15px!important;direction:ltr!important;padding:17px 19px 15px!important;border:0!important}
:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button{box-sizing:border-box!important;display:grid!important;place-items:center!important;flex:0 0 48px!important;width:48px!important;height:48px!important;min-width:48px!important;max-width:48px!important;min-height:48px!important;max-height:48px!important;aspect-ratio:1/1!important;padding:0!important;margin:0!important;line-height:1!important;border:0!important;border-radius:50%!important;transform:none!important;rotate:none!important;clip-path:none!important;background:#f13d67!important;color:#fff!important;box-shadow:0 4px 12px #f13d6726!important;position:relative!important;appearance:none!important;overflow:visible!important;cursor:pointer}
:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button:before,:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button:after{content:none!important;display:none!important}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button svg{display:block!important;width:23px!important;height:23px!important;margin:0!important;transform:none!important;flex-shrink:0!important}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls [data-voice-stop]{background:#ffeaf0!important;color:#ec6d8d!important;box-shadow:none!important}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button:disabled{opacity:.4!important;cursor:default!important}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button:focus-visible{outline:3px solid #a8c9ff!important;outline-offset:4px!important}
.to-rec-center{display:flex;align-items:center;flex-direction:column;gap:5px;min-width:0;flex:1}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls time{font-size:18px!important;line-height:1.4!important;letter-spacing:1.8px!important;font-variant-numeric:tabular-nums;color:#4e6d94!important;direction:ltr}.to-rec-center>[data-voice-phase]{font-size:9px;line-height:1.6;color:#a2b0c1;direction:rtl}.to-rec-signal{display:flex;align-items:center;justify-content:center;gap:3px;height:22px;max-width:100%;opacity:.65}.to-rec-signal i{display:block;width:3px;height:8px;border-radius:5px;background:#bacde6;transform-origin:center}.to-rec-signal i:nth-child(3n){height:17px}.to-rec-signal i:nth-child(2n){height:12px}.to-rec-signal i:nth-child(5n){height:21px}:is(.ht,.to-panel) .to-media-fields .to-recorder>p{margin:0!important;padding:9px 14px!important;border-top:1px solid #edf1f7!important;background:#fbfdff;font-size:10px!important;text-align:center!important;line-height:1.9!important;color:#97a8c0}
.to-recorder[data-recorder-state=recording] .to-rec-signal i{background:#f13d67;animation:to-rec-bars .7s ease-in-out infinite alternate}.to-recorder[data-recorder-state=recording] .to-rec-signal i:nth-child(2n){animation-delay:-.3s}.to-recorder[data-recorder-state=recording] .to-rec-signal i:nth-child(3n){animation-delay:-.5s}.to-recorder[data-recorder-state=recording] [data-voice-phase]{color:#e46b88}.to-recorder[data-recorder-state=ready] [data-voice-phase]{color:#49a28a}.to-recorder[data-recorder-state=ready] .to-rec-signal i{background:#84bea9}.to-recorder[data-recorder-state=error] [data-voice-phase]{color:#d27d62}:is(.ht,.to-panel) .to-media-fields .to-recorder[data-recorder-state=recording] .to-rec-controls [data-voice-stop]{opacity:1!important;background:#ffdae5!important;color:#e53665!important}
@keyframes to-rec-bars{from{transform:scaleY(.45)}to{transform:scaleY(1)}}@media(prefers-reduced-motion:reduce){.to-recorder[data-recorder-state=recording] .to-rec-signal i{animation:none}}
@media(max-width:480px){:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls{padding:14px 15px!important}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls button{flex-basis:44px!important;width:44px!important;height:44px!important;min-width:44px!important;max-width:44px!important;min-height:44px!important;max-height:44px!important}:is(.ht,.to-panel) .to-media-fields .to-recorder .to-rec-controls time{font-size:16px!important}:is(.ht,.to-panel) .to-recorder .to-recorder-head{padding-inline:13px}}
