.tut{--mut:#bfbdbd;--mut2:#8b8a99;--a:120 70 255;color:#fff;-webkit-font-smoothing:antialiased;font-size:15px;line-height:1.5}.tut svg.i{width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round;flex:none}.tut svg.i.s{width:14px;height:14px}.tut svg.i.xs{width:12px;height:12px}.tut svg.i.l{width:20px;height:20px}.tut .tile{width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,rgb(var(--a)),rgb(var(--a)/.6));flex:none;box-shadow:0 6px 18px rgb(var(--a)/.35)}.tut .tile svg{width:19px;height:19px}.tut .tp{gap:12px;padding:10px 12px 10px 10px;border-radius:18px;background:rgba(0,0,0,.28);border:1px solid rgba(255,255,255,.05)}.tut .tp,.tut .tp-play{display:flex;align-items:center}.tut .tp-play{width:42px;height:42px;border-radius:50%;border:0;justify-content:center;background:rgba(255,255,255,.1);color:#fff;flex:none}.tut .tp-play svg{width:16px;height:16px;fill:currentColor;stroke:none}.tut .tp-play .pl{margin-left:2px}.tut .playing .tp-play,.tut .tp.on .tp-play{background:rgb(var(--a));box-shadow:0 0 22px rgb(var(--a)/.65)}.tut .tp-wave{flex:1;height:34px;min-width:0;overflow:hidden}.tut .tp-time{font-size:12px;color:var(--mut);font-variant-numeric:tabular-nums;white-space:nowrap}.tut .tp-time b{color:#fff;font-weight:500}.tut .wave{display:flex;align-items:center;gap:2px;height:100%}.tut .wave i{display:block;flex:1;border-radius:2px;background:rgba(255,255,255,.18);min-width:2px}.tut .wave i.on{background:rgb(var(--a))}.tut .tp-err{margin:8px 0 0;font-size:12px;color:#fca5a5}.tut .tp-play{cursor:pointer}.tut .tp-play:focus-visible,.tut .tp-wave:focus-visible{outline:2px solid #8c5cff;outline-offset:2px}