:root {
  --background:#070a13; --surface:#101626; --surface-2:#151d31; --foreground:#f6f8ff;
  --muted:#98a4ba; --cyan:#67e8f9; --violet:#9b7cff; --border:#27314a;
  color-scheme:dark;
}
*{box-sizing:border-box}
body{margin:0;background:radial-gradient(circle at 50% -10%,#17234a 0,#090d1a 35%,var(--background) 70%);color:var(--foreground);font-family:Inter,ui-sans-serif,system-ui,-apple-system,"Segoe UI",sans-serif;font-size:16px;min-height:100vh}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.2;background-image:linear-gradient(rgba(103,232,249,.04) 1px,transparent 1px),linear-gradient(90deg,rgba(103,232,249,.04) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to bottom,#000,transparent 75%)}
button{font:inherit;cursor:pointer}a{color:inherit}button:focus-visible,a:focus-visible,summary:focus-visible{outline:3px solid var(--cyan);outline-offset:4px}
main{position:relative;min-height:100vh;display:flex;flex-direction:column}
header{height:88px;margin:0 6%;display:flex;justify-content:space-between;align-items:center;border-bottom:1px solid rgba(152,164,186,.18)}
.brand{display:inline-flex;align-items:center;gap:11px;color:#fff;font-size:23px;font-weight:500;letter-spacing:-.7px;text-decoration:none}.brand img{width:40px;height:40px}.brand-name strong{font-weight:800;background:linear-gradient(100deg,var(--cyan),#a78bfa);background-clip:text;-webkit-background-clip:text;color:transparent}.header-note{color:var(--muted);font-size:13px;letter-spacing:.4px}
.workspace{width:min(740px,calc(100% - 40px));margin:64px auto 64px}.intro{text-align:center;margin-bottom:38px}.eyebrow{display:inline-flex;padding:7px 12px;border:1px solid rgba(103,232,249,.25);border-radius:999px;background:rgba(103,232,249,.06);font-size:11px;letter-spacing:2px;color:var(--cyan);font-weight:750}
h1{font-size:60px;letter-spacing:-3.4px;line-height:1.04;margin:23px 0 18px;font-weight:750}h1 span{background:linear-gradient(100deg,var(--cyan),var(--violet));background-clip:text;-webkit-background-clip:text;color:transparent}.intro p{color:var(--muted);line-height:1.6}
.upload-card{position:relative;background:linear-gradient(145deg,rgba(21,29,49,.97),rgba(12,17,30,.97));border:1px solid var(--border);border-radius:24px;padding:28px;box-shadow:0 28px 80px rgba(0,0,0,.38),0 0 0 1px rgba(103,232,249,.025) inset;overflow:hidden}.upload-card:before{content:"";position:absolute;width:220px;height:220px;right:-120px;top:-130px;border-radius:50%;background:var(--violet);filter:blur(70px);opacity:.16;pointer-events:none}
.card-top{position:relative;display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;font-size:14px}i{font:12px ui-monospace,monospace;color:var(--cyan);margin-right:12px}.limit{font-size:12px;color:#c6cfdf;background:#1b243a;border:1px solid #33415f;border-radius:999px;padding:7px 11px}
.dropzone{position:relative;display:flex;width:100%;min-height:250px;align-items:center;justify-content:center;flex-direction:column;gap:14px;border:1px dashed #435474;border-radius:16px;color:var(--foreground);background:linear-gradient(145deg,rgba(17,30,51,.7),rgba(12,19,34,.8));transition:.18s ease}.dropzone:hover,.dropzone.dragging{border-color:var(--cyan);background:rgba(30,47,73,.8);transform:translateY(-1px)}.upload-icon{display:grid;place-items:center;width:64px;height:64px;border-radius:19px;background:linear-gradient(135deg,var(--cyan),var(--violet));color:#07101c;margin-bottom:7px;font-size:39px;font-weight:700;box-shadow:0 12px 30px rgba(82,191,232,.25)}.dropzone strong{font-size:21px}.dropzone>span:not(.upload-icon){font-size:14px;color:#aebbd0}.dropzone u{color:var(--cyan);text-underline-offset:3px}.dropzone small{font-size:11px;letter-spacing:1.2px;margin-top:12px;color:#8493ad}
fieldset{border:0;margin:28px 0 0;padding:0}legend{font-size:14px;margin-bottom:17px}.durations{display:flex;gap:8px}.durations button{flex:1;padding:12px 4px;border:1px solid #313c56;border-radius:10px;background:#0e1422;color:#b5c0d3;font-size:14px;transition:.15s}.durations button:hover{border-color:#64769e}.durations .selected{background:linear-gradient(110deg,var(--cyan),#8dd8fb);color:#08111f;border-color:transparent;font-weight:750;box-shadow:0 8px 24px rgba(103,232,249,.16)}.duration-note{font-size:12px;color:#8e9bb1;margin:14px 0 0}
.under-card{display:flex;justify-content:space-between;color:#91a0b8;font-size:12px;margin:18px 4px 34px;gap:15px}.under-card span:first-child{color:#a5dce7}
details{border-top:1px solid rgba(152,164,186,.2);border-bottom:1px solid rgba(152,164,186,.2);padding:19px 3px;font-size:14px;color:#bec8d9}summary{list-style:none;cursor:pointer;display:flex;justify-content:space-between}details p{font-size:14px;line-height:1.8;color:var(--muted)}
.results{margin:31px 0}.results-head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:18px}.results-head h2{margin:0}h2{font-size:18px;margin-bottom:18px}h2 span{color:#8492a9;font-size:14px;margin-left:7px}.file-row{display:flex;align-items:center;gap:14px;border:1px solid var(--border);padding:18px;border-radius:13px;margin-bottom:10px;background:rgba(16,22,38,.9);box-shadow:0 10px 30px rgba(0,0,0,.15)}.file-row>span{color:var(--cyan)}.file-info{flex:1;min-width:0}.file-info strong{display:block;font-size:14px;overflow-wrap:anywhere}.file-info p,.file-info a{display:block;font-size:12px;color:#9aa8be;margin:7px 0;overflow-wrap:anywhere}.file-info a{color:#99e8f1}.file-info .error{color:#ff9d9d}.copy{white-space:nowrap;background:linear-gradient(120deg,rgba(103,232,249,.12),rgba(155,124,255,.12));color:#a8eff7;border:1px solid #3a6474;border-radius:9px;padding:10px 12px;font-size:12px}.copy:hover{border-color:var(--cyan);background:rgba(103,232,249,.16)}.copy-all{font-weight:700;padding-inline:14px}progress{width:100%;height:4px;accent-color:var(--cyan)}
footer{margin:auto 6% 0;padding:26px 0;display:flex;justify-content:space-between;align-items:center;border-top:1px solid rgba(152,164,186,.18);color:#8390a5;font-size:12px}.small{font-size:17px;color:#dce5f3}.small img{width:30px;height:30px}
[hidden]{display:none!important}
@media(max-width:600px){header{height:76px;margin-inline:20px}.brand{font-size:20px}.brand img{width:35px;height:35px}.header-note{font-size:11px}.workspace{margin-top:42px}h1{font-size:44px;letter-spacing:-2.3px}.upload-card{padding:18px;border-radius:19px}.durations{gap:5px}.durations button{font-size:13px;padding:11px 3px}.under-card{flex-direction:column;align-items:center}.dropzone small{letter-spacing:.5px}.file-row{flex-wrap:wrap}.copy{margin-left:auto}footer{margin-inline:20px}.small{font-size:15px}footer>span:nth-child(2){display:none}}
@media(max-width:420px){.durations{display:grid;grid-template-columns:repeat(3,minmax(0,1fr))}.card-top{gap:8px;flex-wrap:wrap}.header-note{max-width:86px;text-align:right}.dropzone small{max-width:220px;line-height:1.7}.results-head{align-items:flex-start;flex-direction:column}.copy-all{margin-left:0}}