:root{--bg:#050816;--bg-2:#0a1024;--card:rgba(12,18,40,.72);--card-border:rgba(140,120,255,.22);--card-border-bright:rgba(160,140,255,.45);--text:#fff;--text-dim:#a8b0c8;--pink:#d755ff;--purple:#8a5cff;--blue:#3abeff;--grad:linear-gradient(100deg,#d755ff,#3abeff);--radius:26px}*{margin:0;padding:0;box-sizing:border-box}body,html{background:var(--bg);color:var(--text);min-height:100%;font-family:Poppins,Segoe UI,system-ui,sans-serif}body{background:radial-gradient(900px 500px at 15% -5%,rgba(168,85,247,.16),transparent 60%),radial-gradient(800px 500px at 95% 10%,rgba(56,189,248,.1),transparent 60%),radial-gradient(1000px 700px at 50% 110%,rgba(99,60,220,.12),transparent 60%),var(--bg);background-attachment:fixed}.shell{max-width:620px;margin:0 auto;padding:40px 18px 90px}.logo-img{height:88px;width:auto;max-width:92%;object-fit:contain}.brand{flex-direction:column;gap:6px;margin-bottom:34px}.brand,.brand-row{display:flex;align-items:center}.brand-row{gap:14px}.wordmark{font-size:44px;font-weight:500;letter-spacing:.5px}.wordmark .jot{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent;font-weight:600}.tagline{color:var(--text-dim);font-size:15px;font-weight:300}.card{background:var(--card);border:1px solid var(--card-border);border-radius:var(--radius);padding:26px 22px;margin-bottom:22px;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.card.drag{border-color:var(--card-border-bright);box-shadow:0 0 0 3px rgba(168,85,247,.18)}.upload-inner{display:flex;flex-direction:column;align-items:center;text-align:center;gap:10px}.cloud-btn{width:92px;height:92px;border-radius:50%;border:none;cursor:pointer;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,rgba(168,85,247,.85),rgba(79,70,229,.85));box-shadow:0 10px 40px rgba(129,90,250,.45);transition:transform .15s ease}.cloud-btn:hover{transform:scale(1.05)}.upload-title{font-size:24px;font-weight:600;margin-top:6px}.upload-sub{color:var(--text-dim);font-size:15px}.url-row{display:flex;width:100%;margin-top:12px;background:rgba(10,10,26,.6);border:1px solid var(--card-border);border-radius:999px;padding:6px 6px 6px 18px;align-items:center;gap:10px}.url-row input{flex:1 1;background:transparent;border:none;outline:none;color:var(--text);font-size:15px;font-family:inherit;min-width:0}.url-row input::placeholder{color:var(--text-dim)}.btn-grad{border:none;cursor:pointer;color:#fff;font-family:inherit;font-size:15px;font-weight:500;padding:12px 26px;border-radius:999px;background:linear-gradient(100deg,#7c3aed,#6366f1);box-shadow:0 6px 24px rgba(124,58,237,.4);transition:filter .15s ease;white-space:nowrap}.btn-grad:hover{filter:brightness(1.12)}.btn-grad:disabled{opacity:.55;cursor:default}.formats{font-size:13px;margin-top:12px}.formats,.status{color:var(--text-dim)}.status{display:flex;align-items:center;justify-content:center;gap:12px;font-size:15px}.spinner{width:20px;height:20px;border-radius:50%;border:2.5px solid rgba(168,85,247,.25);border-top:2.5px solid var(--purple);animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(1turn)}}.error{border-color:hsla(0,91%,71%,.4);color:#fca5a5;font-size:15px;text-align:center}.file-row{display:flex;align-items:center;gap:14px;margin-bottom:16px}.file-icon{width:52px;height:52px;border-radius:50%;display:grid;place-items:center;background:radial-gradient(circle at 35% 30%,rgba(168,85,247,.5),rgba(49,46,129,.7));flex-shrink:0}.file-name{font-weight:500;font-size:17px;overflow-wrap:anywhere}.file-meta{color:var(--text-dim);font-size:13.5px;margin-top:2px}.wave-wrap{background:rgba(10,10,26,.5);border:1px solid rgba(140,120,255,.14);border-radius:18px;padding:14px 14px 8px;cursor:pointer}.wave-wrap canvas{width:100%;height:64px;display:block}.time-row{display:flex;justify-content:space-between;color:var(--text-dim);font-size:12.5px;padding:6px 2px 0}.controls{display:flex;align-items:center;justify-content:center;gap:22px;margin-top:16px}.ctrl{background:rgba(20,20,46,.7);border:1px solid var(--card-border);color:var(--text);width:52px;height:52px;border-radius:50%;cursor:pointer;display:grid;place-items:center;font-family:inherit;transition:border-color .15s ease}.ctrl:hover{border-color:var(--card-border-bright)}.ctrl.play{width:68px;height:68px;border:none;background:radial-gradient(circle at 35% 30%,rgba(168,85,247,.9),rgba(79,70,229,.9));box-shadow:0 8px 30px rgba(129,90,250,.45)}.ctrl.speed{width:auto;padding:0 20px;border-radius:999px;font-size:14.5px}.trans-head{justify-content:space-between;margin-bottom:18px}.trans-head,.trans-title{display:flex;align-items:center}.trans-title{font-size:19px;font-weight:600;gap:8px}.sparkle{background:var(--grad);-webkit-background-clip:text;background-clip:text;color:transparent}.trans-actions{display:flex;gap:8px}.chip{background:rgba(20,20,46,.7);border:1px solid var(--card-border);color:var(--text);font-family:inherit;font-size:13.5px;padding:8px 14px;border-radius:999px;cursor:pointer;transition:border-color .15s ease}.chip:hover{border-color:var(--card-border-bright)}.seg{display:grid;grid-template-columns:64px 14px 1fr;grid-gap:10px;gap:10px;padding:10px 0;cursor:pointer;border:none;background:none;text-align:left;font-family:inherit;width:100%;color:inherit}.seg:hover .seg-text{color:#fff}.seg-time{color:transparent;background:var(--grad);-webkit-background-clip:text;background-clip:text;font-size:14.5px;font-weight:500;padding-top:1px}.seg-dot-col{display:flex;flex-direction:column;align-items:center}.seg-dot{width:8px;height:8px;border-radius:50%;background:var(--purple);margin-top:7px;flex-shrink:0}.seg-line{flex:1 1;width:1.5px;background:rgba(140,120,255,.18);margin-top:4px}.seg:last-child .seg-line{display:none}.seg-text{color:#cfcbe8;font-size:15.5px;line-height:1.55;font-weight:300}.seg.active .seg-text{color:#fff}.seg.active .seg-dot{box-shadow:0 0 10px var(--purple)}.footer{text-align:center;color:var(--text-dim);font-size:13px;margin-top:30px}@media (max-width:460px){.logo-img{height:58px}.url-row{flex-direction:column;border-radius:20px;padding:12px}.url-row input{width:100%;padding:6px 4px}.btn-grad{width:100%}}@media (prefers-reduced-motion:reduce){*{animation-duration:.01ms!important;transition-duration:.01ms!important}}