/* ToolCMS V3.1.82 (c) ToolWorld https://www.toolworld.cn/ */
*{box-sizing:border-box;margin:0;padding:0}
body{margin:0;padding:0;font-family:inherit;font-size:14px;line-height:1.6}
.media-tone-container{max-width:100%;margin:0 auto;padding:16px;color:var(--text-1,#e2e8f0)}
.media-tone-panel{background:linear-gradient(160deg,#1e293b 0%,#0f172a 100%);border:1px solid var(--border,#334155);border-radius:var(--radius,16px);padding:24px;box-shadow:0 12px 40px rgba(0,0,0,.35)}
.media-tone-tuner{text-align:center;background:rgba(0,0,0,.35);border-radius:var(--radius,16px);padding:18px 10px 14px;margin-bottom:20px}
.media-tone-readout{font-size:44px;font-weight:700;font-variant-numeric:tabular-nums;color:#f8fafc;letter-spacing:1px}
.media-tone-note{font-size:20px;font-weight:600;color:#38bdf8;margin-top:2px}
.media-tone-octave-bar{height:4px;background:rgba(148,163,184,.25);border-radius:2px;margin:12px 20px 0;overflow:hidden}
.media-tone-section{margin-bottom:18px}
.media-tone-section-title{font-size:13px;font-weight:600;color:#94a3b8;letter-spacing:1px;margin-bottom:10px;text-transform:uppercase}
.media-tone-waves{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.media-tone-wavecard{display:flex;flex-direction:column;align-items:center;gap:6px;padding:12px 6px;border:1px solid rgba(148,163,184,.3);border-radius:var(--radius-sm,10px);cursor:pointer;color:#94a3b8;transition:all .15s;user-select:none;background:rgba(255,255,255,.03)}
.media-tone-wavecard:hover{border-color:#38bdf8;color:#e2e8f0}
.media-tone-wavecard.media-tone-wave-on{border-color:#38bdf8;color:#38bdf8;background:rgba(56,189,248,.1)}
.media-tone-waveicon{width:70px;height:26px}
.media-tone-wavecard span{font-size:12px}
.media-tone-sliderrow{display:flex;justify-content:space-between;align-items:baseline;margin-bottom:6px}
.media-tone-sliderlabel{font-size:13px;color:#94a3b8}
.media-tone-sliderval{font-size:15px;font-weight:600;color:#f8fafc;font-variant-numeric:tabular-nums}
.media-tone-range{-webkit-appearance:none;width:100%;height:6px;border-radius:3px;background:rgba(148,163,184,.3);outline:none}
.media-tone-range::-webkit-slider-thumb{-webkit-appearance:none;width:18px;height:18px;border-radius:50%;background:#38bdf8;cursor:pointer;border:3px solid #0f172a;box-shadow:0 0 0 1px #38bdf8}
.media-tone-range::-moz-range-thumb{width:18px;height:18px;border-radius:50%;background:#38bdf8;cursor:pointer;border:3px solid #0f172a}
.media-tone-scaleticks{display:flex;justify-content:space-between;font-size:11px;color:#64748b;margin-top:4px;font-variant-numeric:tabular-nums}
.media-tone-seg{display:flex;gap:8px;flex-wrap:wrap}
.media-tone-segbtn{padding:8px 18px;border:1px solid rgba(148,163,184,.3);border-radius:var(--radius-sm,8px);background:rgba(255,255,255,.03);color:#cbd5e1;cursor:pointer;font-size:13px;transition:all .15s}
.media-tone-segbtn:hover{border-color:#38bdf8}

.media-tone-segbtn.media-tone-segon{background:#38bdf8;color:#0f172a;font-weight:600;border-color:#38bdf8}
.media-tone-actions{display:flex;justify-content:center;margin:20px 0 14px}
.media-tone-playbtn{display:flex;align-items:center;gap:10px;padding:16px 42px;border-radius:40px;border:none;background:linear-gradient(135deg,#38bdf8,#0ea5e9);color:#0f172a;font-size:16px;font-weight:700;cursor:pointer;box-shadow:0 8px 24px rgba(14,165,233,.4);transition:transform .1s}
.media-tone-playbtn:hover{transform:translateY(-2px)}

.media-tone-playbtn.media-tone-playing{background:linear-gradient(135deg,#f87171,#ef4444);box-shadow:0 8px 24px rgba(239,68,68,.4)}
.media-tone-playicon{font-size:16px}
.media-tone-toolbar{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}
.media-tone-btn{padding:8px 14px;border:1px solid rgba(148,163,184,.3);border-radius:var(--radius-sm,8px);background:rgba(255,255,255,.04);color:#cbd5e1;cursor:pointer;font-size:12px;transition:all .15s}
.media-tone-btn:hover{border-color:#38bdf8;color:#f8fafc}

.media-tone-btn:disabled{opacity:.4;cursor:not-allowed}
.media-tone-nowplaying{text-align:center;margin-top:12px;font-size:13px;color:#64748b}
.media-tone-message{margin-top:10px;padding:8px 12px;border-radius:var(--radius-sm,8px);font-size:13px;display:none;text-align:center}
.media-tone-message.show{display:block}
.media-tone-message.success{background:rgba(34,197,94,.15);color:#4ade80}
.media-tone-message.error{background:rgba(239,68,68,.15);color:#f87171}
.media-tone-footer{display:flex;justify-content:space-between;align-items:center;margin-top:16px;padding-top:12px;border-top:1px solid var(--border-light,rgba(148,163,184,.15));font-size:12px;color:#64748b}
.media-tone-footer-right{margin-left:auto}
@media(max-width:640px){.media-tone-panel{padding:16px}.media-tone-readout{font-size:34px}.media-tone-waves{grid-template-columns:1fr 1fr}.media-tone-footer{flex-direction:column;gap:4px;text-align:center}.media-tone-playbtn{width:100%;justify-content:center}}