:root{font-family:"Segoe UI","Microsoft JhengHei",sans-serif;color:#20202a;background:#f7f3ff}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(circle at top,#fff5fd 0,#f4f0ff 42%,#eef6ff 100%)}button,input,select{font:inherit}.shell{width:min(880px,calc(100% - 28px));margin:34px auto 70px;display:grid;gap:16px}.card{background:rgba(255,255,255,.88);border:1px solid rgba(121,91,172,.14);border-radius:24px;padding:22px;box-shadow:0 12px 35px rgba(73,48,122,.10);backdrop-filter:blur(14px)}.hero{padding:30px}.badge{display:inline-block;padding:6px 10px;border-radius:999px;background:#ece2ff;color:#6847a7;font-size:12px;font-weight:800;letter-spacing:.08em}h1{font-size:clamp(32px,7vw,52px);margin:12px 0 6px}h2,h3,p{margin-top:0}.hero p{color:#686579;line-height:1.65}.input-row{display:grid;grid-template-columns:1fr auto;gap:10px;margin-top:22px}input,select{border:1px solid #dad1e9;background:#fff;border-radius:14px;padding:13px 15px;outline:none}input:focus,select:focus{border-color:#9672d6;box-shadow:0 0 0 3px rgba(150,114,214,.12)}button{border:0;border-radius:14px;padding:13px 18px;cursor:pointer;background:#7650bd;color:#fff;font-weight:750}button:disabled{opacity:.55;cursor:not-allowed}.error{margin-top:14px;padding:11px 14px;border-radius:12px;background:#fff0f2;color:#a13a49}.result{display:grid;grid-template-columns:180px 1fr;gap:18px}.result img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px;background:#eee}.video-info p{color:#747080}.format-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.format{display:flex;flex-direction:column;align-items:flex-start;background:#f5efff;color:#5e4195;text-align:left}.format strong{font-size:22px}.format span{font-weight:500;font-size:13px;margin-top:3px}.quality-label{display:flex;gap:10px;align-items:center;margin-top:16px;color:#666070}.job-line{display:flex;justify-content:space-between;gap:15px}.progress{height:12px;margin-top:12px;border-radius:999px;background:#eee8f8;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,#7650bd,#ab6fce);transition:width .25s}.download-link{display:block;margin-top:16px;padding:13px 16px;border-radius:14px;background:#2f856a;color:#fff;text-decoration:none;text-align:center;font-weight:750}@media(max-width:650px){.shell{margin-top:16px}.hero,.card{padding:18px;border-radius:20px}.input-row{grid-template-columns:1fr}.result{grid-template-columns:1fr}.result img{max-height:240px}.format-grid{grid-template-columns:1fr}.format{padding:14px 16px}.quality-label{align-items:stretch;flex-direction:column}}
input[type=file]{display:none}.file-button{display:inline-block;border:0;border-radius:14px;padding:13px 18px;cursor:pointer;background:#7650bd;color:#fff;font-weight:750;margin-right:10px}input:focus,select:focus{border-color:#9672d6;box-shadow:0 0 0 3px rgba(150,114,214,.12)}button{border:0;border-radius:14px;padding:13px 18px;cursor:pointer;background:#7650bd;color:#fff;font-weight:750}button:disabled{opacity:.55;cursor:not-allowed}.error{margin-top:14px;padding:11px 14px;border-radius:12px;background:#fff0f2;color:#a13a49}.result{display:grid;grid-template-columns:180px 1fr;gap:18px}.result img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:16px;background:#eee}.video-info p{color:#747080}.format-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.format{display:flex;flex-direction:column;align-items:flex-start;background:#f5efff;color:#5e4195;text-align:left}.format strong{font-size:22px}.format span{font-weight:500;font-size:13px;margin-top:3px}.quality-label{display:flex;gap:10px;align-items:center;margin-top:16px;color:#666070}.job-line{display:flex;justify-content:space-between;gap:15px}.progress{height:12px;margin-top:12px;border-radius:999px;background:#eee8f8;overflow:hidden}.progress div{height:100%;width:0;background:linear-gradient(90deg,#7650bd,#ab6fce);transition:width .25s}.download-link{display:block;margin-top:16px;padding:13px 16px;border-radius:14px;background:#2f856a;color:#fff;text-decoration:none;text-align:center;font-weight:750}@media(max-width:650px){.shell{margin-top:16px}.hero,.card{padding:18px;border-radius:20px}.input-row{grid-template-columns:1fr}.result{grid-template-columns:1fr}.result img{max-height:240px}.format-grid{grid-template-columns:1fr}.format{padding:14px 16px}.quality-label{align-items:stretch;flex-direction:column}}
/* Keep the tool panel visually prominent while the animated background stays behind it. */
.shell{position:relative;z-index:1}.hero{text-align:center}.hero p{max-width:680px;margin-left:auto;margin-right:auto}.input-row{grid-template-columns:1fr}.input-row input{min-height:58px;border:2px solid #d94a91;border-radius:18px}.input-row button{min-height:58px;background:linear-gradient(135deg,#e51b70,#b91468);box-shadow:0 10px 20px rgba(197,27,105,.18)}
[hidden]{display:none!important}
