/* ALINOVA Video Studio V5 — consolidated CSS; source modules backed up separately. */

/* MODULE: studio.css */
/* ALINOVA VIDEO STUDIO — premium responsive UI v2 */
:root{color-scheme:dark;--bg:#080d17;--panel:#101826;--panel-deep:#0d1625;--panel-raised:#131f31;--stroke:#273346;--stroke-soft:#1e2a3b;--text:#f3f7ff;--muted:#9aabc3;--muted-light:#c0cde0;--cyan:#62d9f5;--blue:#68a5ff;--violet:#ae93ff;--green:#74e9bf;--red:#ff8e9b;--radius:22px;--font:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;scroll-padding-top:84px}
body{background:var(--bg);color:var(--text);font-family:var(--font);font-size:15px;line-height:1.65;margin:0;-webkit-font-smoothing:antialiased;overflow-x:hidden}
body::before{content:"";z-index:-1;position:absolute;top:0;left:0;right:0;height:760px;pointer-events:none;background:radial-gradient(ellipse 540px 420px at 75% 10%,rgba(29,84,126,.24),transparent 78%),radial-gradient(ellipse 660px 460px at 14% 6%,rgba(30,61,121,.17),transparent 80%)}
button,input,select{font:inherit}button{cursor:pointer}a{color:inherit;text-decoration:none}button:disabled{cursor:not-allowed}
::selection{background:#3b7398;color:white}
.icon-sprite{position:absolute;width:0;height:0;overflow:hidden;pointer-events:none}
.icon{display:inline-block;width:20px;height:20px;vertical-align:middle;flex:none;fill:none;stroke:currentColor;stroke-linecap:round;stroke-linejoin:round;stroke-width:1.65}
.container{max-width:1220px;margin:0 auto;padding:0 28px}
:focus-visible{outline:2px solid var(--cyan);outline-offset:3px}
[hidden]{display:none!important}
/* HEADER */
.site-header{position:sticky;top:0;z-index:25;border-bottom:1px solid rgba(125,152,198,.09);background:rgba(8,13,23,.82);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}
.nav-inner{height:78px;display:flex;align-items:center;justify-content:space-between;gap:25px}
.brand{display:inline-flex;align-items:center;gap:12px;flex:none}
.brand-mark{height:38px;width:38px;border:1px solid #6ec6e97a;background:linear-gradient(145deg,#3566a8,#265883 50%,#16466a);box-shadow:0 5px 25px #366baa40,0 0 0 4px #1d395333;border-radius:13px;display:grid;place-items:center;color:#fff}
.brand-mark .icon{height:22px;width:22px;stroke-width:1.5}
.brand-word{font-size:16px;font-weight:860;letter-spacing:.045em;white-space:nowrap}
.brand-light{font-size:12px;letter-spacing:.09em;font-weight:570;margin-left:6px;color:#a0b8cf}
.nav-links{display:flex;gap:34px;align-items:center;margin-left:auto}
.nav-links a{color:#93a3bb;font-weight:650;font-size:13px;transition:color .2s}
.nav-links a:hover,.nav-links a.nav-current{color:#e4f6ff}
.nav-links a.nav-current{position:relative}
.nav-links a.nav-current::after{content:"";position:absolute;bottom:-27px;left:0;right:0;height:2px;border-radius:3px;background:var(--cyan)}
.nav-cta{border:1px solid #334559;background:#15253a;padding:10px 15px 10px 18px;font-weight:700;color:#edf7ff;border-radius:12px;font-size:12px;display:flex;align-items:center;gap:13px;transition:background .2s,transform .2s}
.nav-cta .icon{width:16px;height:16px}
.nav-cta:hover{background:#213a52;transform:translateY(-1px)}
/* HERO */
.hero{display:grid;grid-template-columns:1fr 1.02fr;align-items:center;gap:50px;min-height:520px;padding-top:51px;padding-bottom:65px}
.hero-copy{max-width:535px}
.eyebrow{display:flex;align-items:center;gap:10px;color:#86cee7;letter-spacing:.16em;font-size:10px;font-weight:800}
.eyebrow-dot{height:7px;width:7px;border-radius:50%;background:#4dc4e7;box-shadow:0 0 15px #5ed7f7}
.eyebrow-line{height:1px;width:33px;background:linear-gradient(90deg,#4386ab,transparent)}
.hero h1{font-weight:860;font-size:clamp(54px,5.4vw,84px);line-height:1.06;letter-spacing:-.075em;margin:25px 0 23px}
.gradient-text{background:linear-gradient(95deg,#6fc6fa 2%,#70a7fc 38%,#ad92fd 94%);background-clip:text;-webkit-background-clip:text;color:transparent}
.hero-lead{font-size:16px;line-height:1.85;color:#a5b5cb;max-width:490px;margin:0}
.hero-actions{display:flex;align-items:center;gap:26px;margin-top:31px}
.btn{min-height:50px;border-radius:12px;padding:12px 20px;display:inline-flex;align-items:center;justify-content:center;gap:11px;font-size:13px;font-weight:810;transition:transform .2s,filter .2s,box-shadow .2s}
.btn .icon{width:18px;height:18px}
.btn-primary{color:#071c2d;border:1px solid #86ddfb;background:linear-gradient(110deg,#85e2fb,#6cbdf2);box-shadow:0 12px 30px rgba(66,153,209,.17)}
.btn-primary:hover:not(:disabled){transform:translateY(-2px);filter:brightness(1.05);box-shadow:0 16px 34px #4499df38}
.btn-primary:disabled{opacity:.65}
.hero-secondary{color:#a9bfd7;font-weight:750;font-size:13px;display:flex;align-items:center;gap:10px;transition:color .2s}
.hero-secondary:hover{color:#fff}.hero-secondary .icon{width:16px;height:16px}
.hero-proof{display:flex;gap:17px;flex-wrap:wrap;margin-top:38px}
.hero-proof span{color:#8a9bb3;font-size:11px;white-space:nowrap;display:flex;gap:5px;align-items:center}
.hero-proof .icon{width:13px;height:13px;color:#7bd8bb;stroke-width:2.4}
/* Faux media dashboard */
.hero-art{height:400px;position:relative;display:flex;align-items:center;justify-content:center;isolation:isolate}
.art-glow{position:absolute;inset:24px 0 5px;background:radial-gradient(ellipse,#30659b3a 0%,#58418b14 44%,transparent 71%);filter:blur(17px);z-index:-1}
.art-grid{position:absolute;inset:0;z-index:-2;opacity:.15;background-image:linear-gradient(#4e769b40 1px,transparent 1px),linear-gradient(90deg,#4e769b40 1px,transparent 1px);background-size:33px 33px;mask-image:radial-gradient(circle,#000 12%,transparent 67%)}
.visual-panel{width:min(100%,500px);padding:15px;border:1px solid #43627b99;background:linear-gradient(150deg,#15273d,#0c1424);box-shadow:0 26px 85px #0009,0 0 50px #286cb326;border-radius:21px;transform:rotate(-2.6deg)}
.visual-topline{display:flex;align-items:center;gap:11px;margin:0 2px 12px;color:#97aac2;font-size:10px;letter-spacing:.02em}
.visual-dots{display:flex;gap:4px}.visual-dots i{width:6px;height:6px;background:#6a7e99;border-radius:50%}.visual-dots i:first-child{background:#ff7184}.visual-dots i:nth-child(2){background:#edc577}.visual-dots i:last-child{background:#68d2ae}
.visual-filename{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}
.visual-live{margin-left:auto;white-space:nowrap;color:#73dabb;font-size:9px;font-weight:800}
.visual-video{height:206px;position:relative;overflow:hidden;display:grid;place-items:center;border:1px solid #364d6e;border-radius:12px;background:radial-gradient(circle at 62% 37%,#3946a4b0,transparent 45%),linear-gradient(140deg,#163a5b,#1b244c 44%,#102139 86%)}
.visual-video::before,.visual-video::after{content:"";position:absolute;pointer-events:none;border-radius:50%}
.visual-video::before{width:340px;height:340px;border:50px solid #5798cc24;left:-110px;bottom:-220px;transform:rotate(-15deg)}
.visual-video::after{width:255px;height:255px;right:-58px;top:-158px;border:30px solid #a17bea17}
.visual-light{position:absolute;z-index:1;width:120px;height:120px;border-radius:50%;background:#80bdff2b;filter:blur(33px)}
.visual-play{width:69px;height:69px;z-index:2;border-radius:21px;display:grid;place-items:center;border:1px solid #ffffff66;background:#e6f4ff30;box-shadow:0 10px 60px #80b9fa6b;backdrop-filter:blur(8px)}
.visual-play .icon{width:32px;height:32px;stroke:#fff}
.visual-corners{position:absolute;width:22px;height:22px;z-index:1}.corner-one{top:14px;left:14px;border-left:2px solid #8cc4ff;border-top:2px solid #8cc4ff}.corner-two{bottom:14px;right:14px;border-right:2px solid #8cc4ff;border-bottom:2px solid #8cc4ff}
.visual-wave-label{display:flex;justify-content:space-between;font-size:9px;font-weight:800;letter-spacing:.1em;color:#81a8c8;margin:16px 5px 8px}
.waveform{height:60px;display:flex;align-items:center;gap:4px;padding:0 5px 6px}
.waveform span{flex:1;min-width:2px;border-radius:6px;height:var(--h);background:linear-gradient(0deg,#5bbde7,#8fbafc);opacity:.7}
.waveform span:nth-child(3n){opacity:.95}.waveform span:nth-child(n+22){background:#465e8b;opacity:.8}
.floating-chip{position:absolute;z-index:3;border:1px solid #4b6a83aa;background:linear-gradient(145deg,#1b3349,#101b2c);box-shadow:0 9px 35px #0009;color:#e8f4ff;padding:13px 17px;border-radius:12px;font-size:12px;font-weight:830;display:flex;align-items:center;gap:9px;white-space:nowrap}
.floating-chip .icon{width:17px;height:17px;color:#83c6ff}
.chip-one{left:-4%;top:18%;transform:rotate(-4deg)}.chip-arrow{color:#89a0be;font-size:19px}
.chip-two{right:-4%;bottom:10%;transform:rotate(3deg);gap:8px}
.chip-two small{color:#93acc7;font-size:10px;font-weight:600}
.complete-circle{width:22px;height:22px;background:#23765f;border-radius:50%;display:grid;place-items:center;color:#abffe0}
.complete-circle .icon{height:14px;width:14px;color:inherit;stroke-width:2.5}
.section-divider{height:1px;background:linear-gradient(90deg,transparent,#2c415c,transparent)}
/* SECTION TITLE */
.workspace-section{padding-top:69px}
.section-heading{display:flex;justify-content:space-between;align-items:end;gap:20px;margin-bottom:27px}
.section-kicker{display:block;letter-spacing:.18em;font-size:10px;font-weight:800;color:#81c3e9}
.section-heading h2,.benefits-head h2,.faq-intro h2,.bottom-cta h2{letter-spacing:-.045em;line-height:1.16;font-size:clamp(30px,3.1vw,41px);margin:10px 0}
.section-heading p,.benefits-head p,.faq-intro p{color:#94a5bc;margin:6px 0 0;font-size:14px}
.live-status{display:inline-flex;align-items:center;gap:8px;border:1px solid #265042;background:#10261f;border-radius:99px;padding:8px 12px;font-size:10px;letter-spacing:.1em;color:#8de4b7;font-weight:900;white-space:nowrap}
.live-dot{height:7px;width:7px;background:#76e3ac;border-radius:50%;box-shadow:0 0 0 4px #28785238}
.workspace-grid{display:grid;grid-template-columns:minmax(0,1.62fr) minmax(270px,.79fr);gap:22px;align-items:start}
/* MAIN CARD */
.studio-card,.sidebar-card{border:1px solid #26364a;background:linear-gradient(155deg,#121e2e 0%,#0e1726 72%);border-radius:var(--radius);box-shadow:0 16px 55px #00000029}
.studio-card{overflow:hidden}
.card-titlebar{display:flex;justify-content:space-between;align-items:center;gap:14px;padding:27px 29px 24px;border-bottom:1px solid var(--stroke-soft)}
.card-title-group{display:flex;gap:14px;align-items:center}
.title-icon,.aside-icon{width:45px;height:45px;border-radius:13px;display:grid;place-items:center;color:#8bddf5;background:#1d3a50;border:1px solid #325473;flex:none}
.title-icon .icon{width:23px;height:23px}
.card-titlebar h3{margin:0;font-size:18px;line-height:1.35;letter-spacing:-.03em}
.card-titlebar p{font-size:12px;color:#91a4bb;margin:3px 0 0}
.card-badge{font-size:9px;letter-spacing:.12em;color:#b1bfff;font-weight:860;border:1px solid #4a427d;background:#242044;border-radius:7px;padding:7px 10px;white-space:nowrap}
.form-section{padding:27px 29px 0}
.form-section-separator{border-top:1px solid #213046;margin-top:27px;padding-top:26px}
.section-label{display:flex;align-items:center;gap:11px;font-weight:790;color:#e5eefc;font-size:13px;margin-bottom:17px}
.step-num{width:28px;height:28px;display:grid;place-items:center;border:1px solid #326179;background:#1b3c52;color:#9be0ef;border-radius:8px;font-size:11px;font-weight:900}
.source-switch{display:grid;grid-template-columns:1fr 1fr;gap:6px;border:1px solid #2b3c53;padding:5px;border-radius:12px;background:#0b1422}
.source-tab{border:1px solid transparent;min-height:49px;background:transparent;border-radius:9px;color:#94a9c2;display:flex;justify-content:center;gap:10px;align-items:center;font-size:13px;font-weight:760;transition:.2s}
.source-tab .icon{width:17px;height:17px}
.source-tab:hover{color:#e3f1ff}
.source-tab.selected,.source-tab[aria-selected=true]{background:#243950;border-color:#395574;color:#eef8ff;box-shadow:0 6px 12px #040a1366}
.source-tab.selected .icon{color:#7ddaf8}
.source-pane{margin-top:20px}
.field-label{display:block;font-weight:780;color:#dce7f5;font-size:12px;margin-bottom:10px}
.url-control{position:relative;display:flex;align-items:center}
.url-control input{width:100%;min-height:56px;border:1px solid #36465d;background:#0a1322;border-radius:12px;outline:none;color:#eaf4ff;padding:11px 101px 11px 42px;font-size:13px}
.url-control input::placeholder{color:#768aa4}
.url-control input:focus{border-color:#70b6dc;box-shadow:0 0 0 3px #4194be24}
.url-control .input-icon{position:absolute;left:15px;width:16px;height:16px;color:#7594b5}
.paste-button{position:absolute;right:6px;top:6px;bottom:6px;border:1px solid #3c536b;border-radius:8px;color:#bcdeee;background:#20354b;padding:0 10px;display:flex;align-items:center;gap:5px;font-weight:730;font-size:12px}
.paste-button .icon{width:14px;height:14px}
.paste-button:hover{background:#2a4762}
.helper{display:flex;align-items:flex-start;gap:7px;font-size:11px;color:#8ea2bc;line-height:1.65;margin:10px 0 0}
.helper .icon{height:14px;width:14px;flex:none;margin-top:2px}
.upload-zone{min-height:176px;border:1.5px dashed #436080;border-radius:14px;background:linear-gradient(145deg,#0b192b,#0d172a);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:7px;outline:0;cursor:pointer;padding:23px 12px;text-align:center;transition:.2s}
.upload-zone:hover,.upload-zone.dragging,.upload-zone:focus-visible{background:#11253b;border-color:#6ac1f1}
.upload-icon-wrap{height:44px;width:44px;border:1px solid #3d6683;background:#1c3952;border-radius:13px;display:grid;place-items:center;color:#7bcef3;margin-bottom:4px}
.upload-icon-wrap .icon{width:22px;height:22px}
.upload-title{font-size:14px;font-weight:800;color:#e8f2ff}
.upload-detail{font-size:12px;color:#8fa7bf;margin:0}
.upload-detail span{color:#9bdcff;font-weight:800}
.upload-extensions{font-size:10px;color:#7793ae;border-radius:40px;margin-top:8px}
.file-preview{display:flex;align-items:center;gap:11px;margin-top:12px;padding:12px;background:#12293b;border:1px solid #356178;border-radius:11px}
.file-preview-icon{height:40px;width:40px;border-radius:9px;display:grid;place-items:center;color:#91d6f5;background:#23455a;flex:none}
.file-preview-details{min-width:0;flex:1;display:flex;flex-direction:column}
.file-preview-details strong{font-size:12px;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.file-preview-details small{font-size:11px;color:#94aec5}
.icon-button{height:31px;width:31px;display:grid;place-items:center;background:transparent;border:1px solid #476075;color:#a6c1d4;border-radius:8px}
.icon-button .icon{width:15px;height:15px}
.icon-button:hover{color:#fff}
.output-switch{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.output-option{border:1px solid #314158;background:#0d1728;border-radius:13px;padding:13px 12px;display:flex;align-items:center;gap:11px;position:relative;cursor:pointer;transition:.2s;min-width:0}
.output-option input,.format-pill input{position:absolute;opacity:0;width:1px;height:1px;pointer-events:none}
.output-option.selected{border-color:#4d9ec8;background:linear-gradient(140deg,#12334a,#102338);box-shadow:inset 0 0 0 1px #4d9ec822}
.output-option:hover{border-color:#58728e}
.output-option:focus-within,.format-pill:focus-within{outline:2px solid var(--cyan);outline-offset:2px}
.output-option-icon{height:38px;width:38px;display:grid;place-items:center;border-radius:10px;background:#233a58;color:#9fc8ff;flex:none}
.output-option-icon .icon{width:19px;height:19px}.audio-output{color:#8ad5f2;background:#1d4260}.video-output{color:#bba7ff;background:#32284d}
.output-option-text{display:flex;flex-direction:column;gap:2px;min-width:0}
.output-option-text strong{font-size:12px;color:#e7effb}.output-option-text small{color:#8298b0;line-height:1.4;font-size:10px}
.option-radio{width:15px;height:15px;border:1px solid #62758c;border-radius:50%;margin-left:auto;flex:none}
.output-option.selected .option-radio{border:4px solid #76cbf2;background:#0d2435}
.subtle-notice{margin-top:10px}
.field-row{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:10px}.field-row .field-label{margin:0}
.field-hint{color:#798da6;font-size:11px;text-align:right}
.format-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px}
.format-pill{position:relative;min-width:0;border:1px solid #304056;background:#0c1626;border-radius:11px;padding:12px 3px 10px;display:flex;flex-direction:column;text-align:center;justify-content:center;gap:1px;cursor:pointer;transition:.2s}
.format-pill:hover{border-color:#6c89aa}.format-pill.selected{background:linear-gradient(155deg,#1d465f,#15314a);border-color:#73c0e3;box-shadow:inset 0 0 0 1px #86bde625}
.format-pill strong{font-size:12px;color:#e8f4ff}.format-pill small{color:#829bb6;font-size:10px}.format-pill.selected strong{color:#a8ebff}.format-pill.selected small{color:#98bbd5}
.format-note{margin-top:10px}
.quality-select-wrap{position:relative}
.quality-select-wrap>.icon:first-child{position:absolute;left:15px;top:50%;transform:translateY(-50%);width:17px;height:17px;color:#86bfd6;pointer-events:none}
.quality-select-wrap select{appearance:none;-webkit-appearance:none;width:100%;border:1px solid #36465d;background:#0a1322;border-radius:12px;color:#e0edfa;min-height:51px;padding:10px 38px 10px 45px;outline:0}
.quality-select-wrap select:focus{border-color:#70b6dc;box-shadow:0 0 0 3px #4194be24}
.quality-select-wrap .select-chevron{position:absolute;right:12px;top:50%;transform:translateY(-50%);height:17px;width:17px;pointer-events:none}
.submit-area{margin:29px 29px 26px}
.rights-check{display:flex;align-items:flex-start;gap:11px;font-size:11px;color:#9daec6;cursor:pointer;line-height:1.6}
.rights-check input{position:absolute;opacity:0;width:1px;height:1px}
.check-art{height:19px;width:19px;border:1px solid #5c7189;border-radius:5px;background:#101d2d;flex:none;display:grid;place-items:center;margin-top:1px;color:transparent}
.check-art .icon{width:14px;height:14px;stroke-width:2.4}
.rights-check input:checked+.check-art{background:#49acd9;border-color:#63d5ff;color:#092239}
.rights-check input:focus-visible+.check-art{outline:2px solid #8dd4f9;outline-offset:3px}
.submit-button{width:100%;margin-top:19px;min-height:55px;font-size:14px;border-radius:12px}
.submit-arrow{margin-left:auto}
.submit-button #submitIcon{margin-left:auto}
.submit-caption{display:flex;justify-content:center;align-items:center;gap:7px;flex-wrap:wrap;color:#8196b0;font-size:10px;margin-top:14px}
.submit-caption .icon{width:13px;height:13px;color:#81bdaf}
.caption-separator{color:#53677f}
.job-status{margin:0 29px 29px;padding:16px;border-radius:14px;background:#112638;border:1px solid #30566d}
.status-head{display:flex;align-items:center;gap:12px}
.status-icon{height:39px;width:39px;display:grid;place-items:center;border-radius:11px;background:#20425a;color:#93d9fa;flex:none}
.status-icon .icon{width:19px;height:19px}
.job-status[data-state="running"] .status-icon .icon{animation:spin 2s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
.status-text{display:flex;flex-direction:column;gap:3px;min-width:0}
.status-text strong{font-size:13px;color:#eaf5ff}
.status-text small{color:#98b3ca;font-size:11px;overflow-wrap:anywhere}
.progress-track{height:6px;width:100%;overflow:hidden;background:#254159;border-radius:99px;margin-top:14px}
.progress-track>span{display:block;background:linear-gradient(90deg,#72dfff,#a58cf5);width:38%;height:100%;border-radius:99px;animation:loading 1.7s ease-in-out infinite alternate}
.progress-track.determinate>span{animation:none}
@keyframes loading{from{transform:translateX(-110%)}to{transform:translateX(280%)}}
.job-status[data-state="done"]{background:#0e2a26;border-color:#2c715f}
.job-status[data-state="done"] .status-icon{background:#246b52;color:#9bffcb}
.job-status[data-state="error"]{background:#321b29;border-color:#864159}
.job-status[data-state="error"] .status-icon{background:#70304a;color:#ffb1bf}
.download-button{display:flex;width:100%;margin-top:14px;background:linear-gradient(120deg,#207f7a,#32a690);border:1px solid #65d9ba;color:#eafff6}
.download-button .icon:last-child{margin-left:auto}
.download-button:hover{background:linear-gradient(120deg,#238d88,#39b99f);transform:translateY(-1px)}
/* ASIDE */
.sidebar{display:flex;flex-direction:column;gap:17px}
.sidebar-card{padding:23px}
.aside-heading{display:flex;align-items:center;gap:11px}
.aside-icon{width:37px;height:37px;border-radius:11px}
.aside-icon .icon{width:19px;height:19px}
.violet-icon{background:#292644;border-color:#40396b;color:#b69dff}.mint-icon{background:#16433f;border-color:#2e7165;color:#75dbc0}
.aside-heading h3{font-size:15px;margin:0;letter-spacing:-.02em}
.mini-steps{list-style:none;margin:21px 0 0;padding:0;position:relative;display:grid;gap:21px}
.mini-steps::before{content:"";height:calc(100% - 39px);left:15px;position:absolute;top:18px;border-left:1px dashed #425a74}
.mini-steps li{display:flex;align-items:flex-start;gap:14px;position:relative;z-index:1}
.mini-num{height:31px;width:31px;display:grid;place-items:center;flex:none;color:#afdafa;border:1px solid #4a6987;border-radius:10px;background:#22354b;font-weight:840;font-size:12px}
.mini-steps strong{display:block;font-size:12px;color:#e5f1ff;line-height:1.5}
.mini-steps p{font-size:11px;line-height:1.55;color:#8299b3;margin:4px 0 0}
.aside-copy{margin:16px 0 13px;color:#93a7be;font-size:12px;line-height:1.75}
.source-tags{display:flex;gap:7px;flex-wrap:wrap}
.source-tags span{border:1px solid #354663;border-radius:7px;background:#1b283b;padding:7px 9px;color:#c0d2e9;font-weight:710;font-size:10px}
.source-disclaimer{display:flex;gap:8px;margin-top:17px;padding:10px 0 0;border-top:1px solid #29364a;color:#8b9cb5;font-size:10px;line-height:1.6}
.source-disclaimer .icon{width:15px;height:15px;flex:none}
.spec-list{margin-top:17px}
.spec-list>div{display:flex;align-items:center;justify-content:space-between;gap:6px;padding:12px 0;border-bottom:1px solid #273549}
.spec-list>div:last-child{border:0}
.spec-list span{color:#99abc2;font-size:11px;display:flex;align-items:center;gap:9px}
.spec-list span .icon{width:15px;height:15px;color:#6b9dbb}
.spec-list strong{color:#deeaf8;font-size:11px;font-weight:790;white-space:nowrap}
.limits-footnote{font-size:10px;line-height:1.65;color:#8196ae;background:#0c1928;border-radius:9px;padding:10px;margin:6px 0 0}
/* BENEFITS */
.benefits-section{padding-top:104px;padding-bottom:90px}
.benefits-head{text-align:center;max-width:650px;margin:auto}
.benefits-head h2{font-size:clamp(32px,3.8vw,47px);margin:13px 0 14px}
.muted-heading{color:#91a8c2}
.benefits-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:36px}
.benefit-card{border:1px solid #27364b;border-radius:19px;background:linear-gradient(145deg,#121e30,#0d1524);padding:26px;min-height:240px;display:flex;flex-direction:column;transition:border-color .2s,transform .2s}
.benefit-card:hover{transform:translateY(-4px);border-color:#3d5a7b}
.benefit-icon{height:47px;width:47px;display:grid;place-items:center;border-radius:13px}
.benefit-icon .icon{width:23px;height:23px}
.benefit-icon.blue{background:#163b59;color:#8edcff;border:1px solid #316381}
.benefit-icon.purple{background:#2b244f;color:#b2a0ff;border:1px solid #54498d}
.benefit-icon.green{background:#18403e;color:#79e2c4;border:1px solid #346d63}
.benefit-card h3{font-size:16px;letter-spacing:-.02em;margin:22px 0 7px}
.benefit-card p{font-size:12px;color:#95a8bf;line-height:1.75;margin:0 0 20px}
.benefit-foot{display:flex;align-items:center;gap:7px;color:#8bd2f1;font-size:11px;font-weight:790;margin-top:auto}
.benefit-foot .icon{height:14px;width:14px}
/* FAQ */
.faq-section{display:grid;grid-template-columns:1fr 1.4fr;gap:64px;padding-top:54px;padding-bottom:95px;border-top:1px solid #24354c}
.faq-intro h2{font-size:38px;margin:14px 0 12px}
.faq-intro p{line-height:1.8}
.text-link{display:inline-flex;gap:8px;align-items:center;font-size:12px;color:#84d6fa;margin-top:22px;font-weight:790}
.text-link .icon{width:14px;height:14px}
.faq-list{display:grid;gap:10px}
.faq-list details{border:1px solid #26364b;background:#101a2a;border-radius:12px;overflow:hidden}
.faq-list details[open]{border-color:#42617c;background:#122136}
.faq-list summary{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:15px;cursor:pointer;font-weight:760;padding:17px 19px;font-size:13px;color:#e8f0fd}
.faq-list summary::-webkit-details-marker{display:none}
.faq-list summary .icon{height:17px;width:17px;color:#9badc8;transition:transform .2s}
.faq-list details[open] summary .icon{transform:rotate(180deg)}
.faq-list details p{margin:-3px 19px 18px;color:#9caec5;font-size:12px;line-height:1.85}
/* CTA FOOTER */
.bottom-cta{padding-bottom:74px}
.bottom-cta-inner{border:1px solid #415e7e;border-radius:23px;padding:38px 45px;background:radial-gradient(ellipse at 95% -60%,#3656a866,transparent 65%),linear-gradient(140deg,#152b45,#16213a);display:flex;align-items:center;justify-content:space-between;gap:20px}
.bottom-cta h2{font-size:28px;margin:8px 0 5px}
.bottom-cta p{font-size:12px;color:#afc2d9;margin:0}
.site-footer{border-top:1px solid #26344a;padding:26px 0 30px}
.footer-inner{display:flex;align-items:center;justify-content:space-between;gap:20px;flex-wrap:wrap}
.footer-brand .brand-mark{width:32px;height:32px;border-radius:10px}.footer-brand .brand-mark .icon{width:19px;height:19px}.footer-brand .brand-word{font-size:12px}.footer-brand .brand-light{font-size:10px}
.footer-inner>span{font-size:11px;color:#8294ae}.footer-inner nav{display:flex;gap:22px;font-size:11px;color:#92a5be}.footer-inner nav a:hover{color:#ecf7ff}
/* RESPONSIVE */
@media (max-width:1100px){
 .hero{gap:25px;min-height:490px}.hero h1{font-size:clamp(51px,5vw,67px)}.hero-art{height:360px}.visual-panel{max-width:410px}.visual-video{height:180px}.chip-one{left:-1%}.chip-two{right:-1%}
 .workspace-grid{grid-template-columns:minmax(0,1.48fr) minmax(250px,.85fr)}
 .card-titlebar,.form-section{padding-left:23px;padding-right:23px}.submit-area{margin-left:23px;margin-right:23px}.job-status{margin-left:23px;margin-right:23px}
 .output-option{gap:8px;padding:11px 9px}.output-option-icon{width:33px;height:33px}
 .sidebar-card{padding:19px}
}
@media (max-width:880px){
 .nav-links{gap:18px}.nav-cta{display:none}
 .hero{grid-template-columns:1.1fr .9fr;gap:0;padding-top:37px;padding-bottom:50px}
 .hero h1{font-size:clamp(46px,6vw,68px)}.hero-lead{font-size:14px}
 .visual-panel{max-width:350px}.hero-art{height:300px}
 .visual-video{height:145px}.waveform{height:40px}.floating-chip{font-size:10px;padding:10px 12px}.chip-one{left:-10%;top:14%}.chip-two{right:-7%;bottom:8%}
 .workspace-grid{grid-template-columns:1fr}.sidebar{display:grid;grid-template-columns:1fr 1fr}.limits-card{grid-column:1/-1}
 .faq-section{gap:30px}
}
@media (max-width:600px){
 .container{padding:0 17px}
 .nav-inner{height:66px}.nav-links{display:flex;gap:15px}.nav-links a{font-size:11px}.nav-links a:nth-child(2),.nav-links a:nth-child(3){display:none}
 .brand-mark{width:34px;height:34px;border-radius:10px}.brand-mark .icon{width:19px;height:19px}.brand-word{font-size:13px}.brand-light{font-size:10px}
 .nav-links .nav-current::after{bottom:-22px}
 .hero{display:flex;flex-direction:column;align-items:stretch;min-height:auto;padding-top:52px;padding-bottom:35px;gap:8px}
 .eyebrow{letter-spacing:.12em;font-size:9px}
 .hero h1{font-size:clamp(49px,12vw,66px);margin:18px 0}
 .hero-lead{font-size:14px;line-height:1.85}
 .hero-actions{margin-top:26px;gap:19px}.hero-secondary{font-size:12px}
 .hero-proof{gap:11px 14px;margin-top:27px}
 .hero-proof span{font-size:10px}
 .hero-art{height:280px;margin-top:20px}
 .visual-panel{width:min(90%,380px);transform:rotate(-2deg);padding:11px}
 .visual-video{height:145px}.visual-wave-label{margin-top:12px}
 .floating-chip{font-size:10px;padding:8px 11px}
 .chip-one{left:0;top:12%}.chip-two{right:0;bottom:8%}
 .workspace-section{padding-top:47px}
 .section-heading{align-items:flex-start;gap:14px}.section-heading h2{font-size:30px;margin:8px 0}.section-heading p{font-size:12px}
 .live-status{font-size:0;padding:8px;border-radius:50%}.live-dot{width:8px;height:8px}
 .workspace-grid{gap:14px}
 .studio-card{border-radius:18px}
 .card-titlebar{padding:20px 17px;gap:8px}
 .card-titlebar h3{font-size:16px}.card-titlebar p{font-size:11px}
 .title-icon{width:39px;height:39px;border-radius:11px}
 .title-icon .icon{width:20px;height:20px}
 .card-badge{font-size:8px;padding:6px 7px}
 .form-section{padding:23px 17px 0}.form-section-separator{margin-top:22px;padding-top:22px}
 .source-pane{margin-top:16px}.source-tab{min-height:46px;font-size:12px}
 .url-control input{font-size:12px;padding-left:36px;padding-right:88px}
 .url-control .input-icon{left:12px}.paste-button{font-size:11px;padding:0 8px}
 .output-switch{gap:8px}
 .output-option{padding:12px 9px;gap:8px}
 .output-option-icon{width:32px;height:32px;border-radius:9px}
 .output-option-icon .icon{width:17px;height:17px}
 .output-option-text strong{font-size:11px}.output-option-text small{font-size:9px}
 .option-radio{display:none}
 .format-grid{gap:6px}.format-pill{padding:11px 2px}.format-pill strong{font-size:11px}.format-pill small{font-size:9px}
 .field-hint{font-size:10px}
 .submit-area{margin:24px 17px 22px}.submit-button{margin-top:16px}
 .job-status{margin:0 17px 22px}
 .sidebar{display:grid;grid-template-columns:1fr;gap:13px}.limits-card{grid-column:auto}
 .sidebar-card{padding:20px;border-radius:16px}
 .benefits-section{padding-top:74px;padding-bottom:60px}
 .benefits-head h2{font-size:35px}
 .benefits-grid{grid-template-columns:1fr;gap:12px;margin-top:25px}.benefit-card{min-height:0;padding:22px}
 .benefit-card h3{margin-top:14px}.benefit-card p{margin-bottom:14px}
 .faq-section{display:flex;flex-direction:column;gap:24px;padding-top:48px;padding-bottom:55px}
 .faq-intro h2{font-size:32px}
 .bottom-cta{padding-bottom:55px}
 .bottom-cta-inner{padding:27px 23px;display:flex;flex-direction:column;align-items:flex-start}
 .bottom-cta h2{font-size:26px}
 .footer-inner{justify-content:center;flex-direction:column;text-align:center;gap:17px}.footer-inner nav{gap:18px}
}
@media(max-width:360px){.container{padding:0 12px}.hero h1{font-size:46px}.brand-light{display:none}.hero-actions{gap:12px}.hero-secondary{font-size:11px}.output-option-icon{display:none}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}


/* MODULE: spectrum-v3.css */


/* ==========================================================================
   V3  /  SPECTRUM UI — luminous multi-accent visual language
   ========================================================================== */
:root{
  --bg:#0c1020;
  --panel:#171b32;
  --panel-deep:#101729;
  --panel-raised:#1a2740;
  --stroke:#36415d;
  --stroke-soft:#293552;
  --cyan:#61ddff;
  --blue:#6d9fff;
  --violet:#b391ff;
  --mint:#56e3c0;
  --green:#69edbb;
  --coral:#ff887d;
  --orange:#ffb46b;
  --pink:#f88bcd;
  --yellow:#ffdc76;
}
body{
  background:#0c1020;
  background-image:
    radial-gradient(ellipse 560px 580px at 97% 8%,rgba(112,72,225,.19),transparent 76%),
    radial-gradient(ellipse 620px 430px at -7% 5%,rgba(27,188,213,.12),transparent 79%),
    radial-gradient(ellipse 450px 420px at 8% 40%,rgba(255,136,125,.065),transparent 81%),
    radial-gradient(ellipse 600px 590px at 105% 65%,rgba(107,91,205,.105),transparent 74%),
    #0c1020;
}
body::before{
  background:
    radial-gradient(ellipse 540px 330px at 14% 21%,rgba(41,104,220,.1),transparent 80%),
    radial-gradient(ellipse 480px 300px at 83% 52%,rgba(235,91,177,.1),transparent 77%);
}
::selection{background:#8651c9;color:#fff}
.site-header{border-bottom-color:rgba(160,138,224,.17);background:rgba(13,17,33,.89)}
.brand{gap:10px}
.brand-mark{
  width:42px;height:42px;border:0;border-radius:14px;padding:0;background:transparent;box-shadow:0 0 0 1px rgba(156,164,249,.23),0 5px 23px rgba(156,95,232,.19);
  overflow:hidden;display:block;flex:none;
}
.brand-mark img{display:block;width:100%;height:100%;object-fit:cover}
.brand-word{font-size:16px;letter-spacing:-.025em;font-weight:870}
.nova-word{background:linear-gradient(95deg,#68dafd,#a88fff 52%,#ff92d0);background-clip:text;-webkit-background-clip:text;color:transparent}
.brand-light{font-size:9px;margin-left:8px;letter-spacing:.065em;color:#c0afd8;font-weight:720}
.nav-links .nav-current::after,.nav-links a.nav-current::after{background:linear-gradient(90deg,#48dded,#aa83ff,#ff8dbc)}
.nav-links a:hover{color:#fff}
.nav-cta{border-color:#75549b9c;background:#2a2243}
.nav-cta:hover{background:#372850}
.hero{min-height:510px;padding-top:48px;padding-bottom:51px}
.eyebrow{color:#d9aeff;font-size:10px;font-weight:820}
.eyebrow-dot{background:#b18afc;box-shadow:0 0 14px rgba(181,122,255,.8)}
.eyebrow-line{background:linear-gradient(90deg,#ad70ff,transparent)}
.gradient-text{
  background:linear-gradient(100deg,#62deff 0%,#76a2ff 27%,#ba8eff 52%,#fa85c2 75%,#ffad70 100%);
  -webkit-background-clip:text;background-clip:text;color:transparent;
}
.hero-lead{color:#b6c1d9}
.hero .btn-primary,.submit-button,.bottom-cta .btn-primary{
  background:linear-gradient(108deg,#5edcf2 0%,#768fff 46%,#b382f8 100%);
  border:1px solid #b59aff;color:white;text-shadow:0 1px 1px #23487866;
  box-shadow:0 12px 33px rgba(116,115,242,.22);
}
.hero .btn-primary:hover,.submit-button:hover:not(:disabled),.bottom-cta .btn-primary:hover{box-shadow:0 14px 38px rgba(157,115,242,.33)}
.hero-secondary:hover{color:#f7d1ff}
.hero-proof{margin-top:23px;gap:15px}
.hero-proof .icon{color:#75e2c1}
.hero-categories{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin-top:27px}
.category-token{border:1px solid;display:inline-flex;align-items:center;gap:7px;font-size:10px;letter-spacing:.08em;font-weight:850;padding:7px 10px;border-radius:8px}
.category-token .icon{height:14px;width:14px;stroke-width:2}
.token-coral{color:#ffada2;background:rgba(252,120,101,.12);border-color:rgba(255,136,125,.3)}
.token-lime{color:#a5efb3;background:rgba(93,238,170,.11);border-color:rgba(112,239,167,.32)}
.token-violet{color:#d3b7ff;background:rgba(180,129,255,.13);border-color:rgba(181,145,255,.32)}
.hero-art{isolation:isolate}
.art-glow{background:radial-gradient(ellipse,rgba(143,85,246,.27),rgba(79,198,228,.13) 48%,transparent 75%)}
.visual-panel{
  background:linear-gradient(141deg,#232546,#151d37 47%,#14152d);
  border:1px solid rgba(183,156,255,.46);
  box-shadow:0 30px 86px rgba(0,0,0,.61),0 0 47px rgba(148,93,255,.19);
  transform:rotate(-2.1deg);
}
.visual-video{
  background:
    radial-gradient(circle at 73% 25%,rgba(255,186,97,.37),transparent 25%),
    radial-gradient(circle at 28% 76%,rgba(80,231,206,.5),transparent 28%),
    radial-gradient(circle at 66% 64%,rgba(226,86,176,.53),transparent 30%),
    linear-gradient(123deg,#232959,#53317b 56%,#d66d82);
  border-color:rgba(194,164,255,.44);
}
.visual-video::before{border-color:#75d9ff24}
.visual-video::after{border-color:#ffb7a633}
.visual-play{background:linear-gradient(135deg,#eaebff77,#a35bff44);border:1px solid #fae8ffad}
.visual-play .icon{stroke:#fff}
.visual-light{background:rgba(240,122,220,.31)}
.art-orbit{position:absolute;border-radius:50%;border:1px solid rgba(240,220,255,.32);z-index:0;transform:rotate(33deg)}
.orbit-a{width:230px;height:113px;border-color:rgba(167,226,255,.37)}
.orbit-b{width:128px;height:240px;border-color:rgba(253,185,196,.22)}
.visual-wave-label{color:#c8afed}
.waveform span{background:linear-gradient(0deg,#65ddec,#9d83ff)}
.waveform span:nth-child(4n){background:linear-gradient(0deg,#ff9abf,#ffbb72)}
.waveform span:nth-child(n+22){background:#67638f}
.visual-topline{color:#b4aacd}
.visual-live{color:#89efc3}
.floating-chip{background:linear-gradient(135deg,#282743,#242045);border:1px solid rgba(171,134,255,.5);box-shadow:0 9px 35px #0009}
.chip-one .icon{color:#ff9d8e}.chip-arrow{color:#ffb9cf}
.chip-two{background:linear-gradient(130deg,#183c3c,#1b3043);border-color:#63dca058}
.complete-circle{background:#2c996f}
.section-divider{background:linear-gradient(90deg,transparent,#5e648b,transparent)}
/* QUICK ACTIONS */
.quick-start{padding-top:39px;padding-bottom:24px}
.quick-start-heading{display:flex;align-items:end;justify-content:space-between;gap:22px;margin-bottom:16px}
.quick-start-heading h2{font-size:clamp(20px,2.3vw,26px);letter-spacing:-.04em;margin:8px 0 0;font-weight:840}
.quick-start-heading p{color:#9cacc5;font-size:12px;margin:0 0 4px}
.quick-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.quick-card{position:relative;width:100%;min-width:0;display:flex;align-items:center;text-align:left;gap:13px;border-radius:17px;border:1px solid;padding:18px 17px;overflow:hidden;transition:transform .18s,box-shadow .18s,border-color .18s}
.quick-card::before{content:"";position:absolute;inset:0;pointer-events:none;opacity:.16;background:radial-gradient(circle at 95% 0%,currentColor,transparent 65%)}
.quick-card:hover{transform:translateY(-3px)}
.quick-card:active{transform:translateY(-1px)}
.quick-card-icon{width:47px;height:47px;display:grid;place-items:center;flex:none;border-radius:13px;background:rgba(255,255,255,.09);border:1px solid rgba(255,255,255,.11)}
.quick-card-icon .icon{width:23px;height:23px;stroke-width:1.85}
.quick-card-copy{min-width:0;display:grid;gap:2px;color:#f7f5ff}
.quick-card-copy strong{font-size:13px;font-weight:850}
.quick-card-copy small{font-size:10px;color:#c2c1d9}
.quick-card-arrow{margin-left:auto;width:17px;height:17px;flex:none;opacity:.8}
.quick-video{color:#ffae93;background:linear-gradient(135deg,#3b2737,#2b213a);border-color:#755164}
.quick-video:hover{box-shadow:0 13px 36px #ff857b22;border-color:#ee9a95}
.quick-audio{color:#91f8ba;background:linear-gradient(135deg,#1a3b3b,#1c313c);border-color:#3e756c}
.quick-audio:hover{box-shadow:0 13px 36px #6df4be21;border-color:#8ee5c2}
.quick-link{color:#c9aeff;background:linear-gradient(135deg,#332949,#242b4b);border-color:#685b8c}
.quick-link:hover{box-shadow:0 13px 36px #be9bff20;border-color:#b39cef}
.quick-card-copy strong,.quick-card-copy small{position:relative;z-index:1}
/* WORKSPACE */
.workspace-section{padding-top:37px}
.section-kicker{color:#b49eff}
.section-heading h2,.benefits-head h2,.faq-intro h2,.bottom-cta h2{letter-spacing:-.049em}
.live-status{color:#8ef2c8;background:#14342b;border-color:#3c745b}
.live-status[data-status="offline"]{color:#ffd28b;background:#3d2925;border-color:#805541}
.studio-card,.sidebar-card{
  border-color:#39425d;
  background:linear-gradient(145deg,#1b2036,#131a2e 66%,#11182b);
  box-shadow:0 18px 52px #05071650;
}
.studio-card{position:relative}
.studio-card::before{
  content:"";position:absolute;top:0;left:24px;right:24px;height:3px;border-radius:0 0 8px 8px;
  background:linear-gradient(90deg,#52e4d1,#7b9dff 35%,#ba8eff 66%,#ff98b1 90%,#ffbe74);
}
.card-titlebar{background:linear-gradient(100deg,rgba(102,135,221,.085),rgba(199,101,212,.085));border-bottom-color:#333c59}
.title-icon{background:linear-gradient(135deg,#254e65,#4a3474);border-color:#7569b4;color:#bcddff}
.card-badge{color:#ffd7a1;background:#423342;border-color:#926c72}
.step-num{border-color:#635b8e;background:#2b2c58;color:#c2bcff}
.section-label{font-size:13px}
.form-section-separator{border-color:#35415d}
.source-switch{background:#111a2e;border-color:#414c6b}
.source-tab.selected,.source-tab[aria-selected=true]{background:linear-gradient(100deg,#283d66,#423761);border-color:#7771b9}
.source-tab.selected .icon{color:#aee3ff}
.source-tab:nth-child(2).selected{background:linear-gradient(100deg,#23483d,#30505b);border-color:#69c4a4}
.source-tab:nth-child(2).selected .icon{color:#8ff0c7}
.url-control input,.quality-select-wrap select{background:#11192c;border-color:#424d69}
.url-control input:focus,.quality-select-wrap select:focus{border-color:#a69bff;box-shadow:0 0 0 3px #886ded33}
.paste-button{background:#283b58;border-color:#556b92}
.paste-button:hover{background:#36547a}
.upload-zone{border-color:#617392;background:linear-gradient(140deg,#15243c,#201d3f)}
.upload-zone:hover,.upload-zone.dragging,.upload-zone:focus-visible{border-color:#aa98ff;background:#272049}
.upload-icon-wrap{color:#c5aaff;background:#34305e;border-color:#60519c}
.file-preview{background:#1c3241;border-color:#3c7879}
.output-switch{gap:12px}
.output-option{background:#141a30;border-color:#414e6a;min-height:77px}
.output-option:first-child.selected{border-color:#6dc4b4;background:linear-gradient(125deg,#1c4945,#19313d)}
.output-option:nth-child(2).selected{border-color:#fa9d92;background:linear-gradient(125deg,#4a2a44,#302744)}
.output-option:first-child.selected .option-radio{border-color:#72eed1}
.output-option:nth-child(2).selected .option-radio{border-color:#ff9aa0}
.output-option-icon.audio-output{color:#8cf0c9;background:#26554f}
.output-option-icon.video-output{color:#ffaf94;background:#533549}
.output-option:nth-child(2).selected .output-option-icon.video-output{background:#754456}
.format-grid{gap:9px}
.format-pill{min-height:70px;background:#151d33;border-color:#414969;border-radius:13px}
.format-pill strong{font-size:13px}
.format-pill.selected{box-shadow:inset 0 0 0 1px #ffffff14}
.format-pill:nth-child(1).selected{background:#473050;border-color:#e887c0}
.format-pill:nth-child(1).selected strong{color:#ffb9db}
.format-pill:nth-child(2).selected{background:#23484a;border-color:#78d9c7}
.format-pill:nth-child(2).selected strong{color:#9df5e3}
.format-pill:nth-child(3).selected{background:#313b64;border-color:#899ff2}
.format-pill:nth-child(3).selected strong{color:#bac8ff}
.format-pill:nth-child(4).selected{background:#493c2d;border-color:#e6bc6d}
.format-pill:nth-child(4).selected strong{color:#ffda91}
.format-pill:nth-child(5).selected{background:#313d41;border-color:#93ca9a}
.format-pill:nth-child(5).selected strong{color:#b5f5b4}
.audio-format-panel{background:linear-gradient(105deg,#34223c39,#19293c3b);border-radius:13px;padding:9px 10px 10px;border:1px solid #4e436247}
.rights-check{color:#bac1d6}
.rights-check input:checked+.check-art{background:#6fe0c5;border-color:#88f7d5;color:#132d3d}
.submit-caption .icon{color:#6ff2c5}
.job-status[data-state="done"]{background:linear-gradient(135deg,#163b34,#1d363c)}
.download-button{background:linear-gradient(110deg,#21a28b,#3dbca6);border-color:#79f2ca}
.download-button:hover{background:linear-gradient(110deg,#29b79e,#43ceb2)}
/* SIDE CONTENT GETS DISTINCT COLORS */
.sidebar-card{position:relative;overflow:hidden}
.sidebar-card::before{content:"";position:absolute;top:0;left:0;width:4px;height:100%;opacity:.92}
.how-card::before{background:linear-gradient(180deg,#ffce79,#ff8d83)}
.sources-card::before{background:linear-gradient(180deg,#a792ff,#f18bcf)}
.limits-card::before{background:linear-gradient(180deg,#71edbf,#59c8ee)}
.how-card{background:linear-gradient(130deg,#29233a,#171a30 68%)}
.sources-card{background:linear-gradient(130deg,#282343,#171b33 68%)}
.limits-card{background:linear-gradient(130deg,#1c2e3a,#151b2c 70%)}
.how-card .aside-icon{color:#ffd09d;background:#543a3f;border-color:#916767}
.sources-card .aside-icon{color:#d2b1ff;background:#44375e;border-color:#7a669d}
.limits-card .aside-icon{color:#a5f7d3;background:#294d47;border-color:#4d9a79}
.mini-num{background:#41304f;border-color:#8d6478;color:#ffd2ae}
.mini-steps::before{border-color:#6f506b}
.source-tags span{background:#242b49;border-color:#534e7e}
.source-tags span:nth-child(3n+1){background:#403052;border-color:#875f9d;color:#ebcaff}
.source-tags span:nth-child(3n+2){background:#203e48;border-color:#4e8390;color:#b1edf7}
.source-tags span:nth-child(3n){background:#433244;border-color:#7f607d;color:#f6cbdf}
.limits-footnote{background:#152a31}
/* BENEFITS / FAQ / CTA */
.benefits-section{padding-top:89px}
.benefits-head .muted-heading{background:linear-gradient(90deg,#87cff6,#c59aff,#ffae8d);background-clip:text;-webkit-background-clip:text;color:transparent}
.benefit-card{position:relative;overflow:hidden;border-color:#3d3e62;background:#1a2036;min-height:257px}
.benefit-card::before{content:"";position:absolute;top:0;right:0;width:190px;height:170px;pointer-events:none;opacity:.16;filter:blur(1px);background:radial-gradient(circle at top right,currentColor,transparent 72%)}
.benefit-card-audio{color:#58e8cd;background:linear-gradient(155deg,#194038,#1a2335 68%);border-color:#407e70}
.benefit-card-video{color:#b58bff;background:linear-gradient(155deg,#312b54,#1c233b 68%);border-color:#635a9a}
.benefit-card-privacy{color:#ffb16f;background:linear-gradient(155deg,#453041,#1d2436 68%);border-color:#865d6c}
.benefit-card h3{color:#edf4ff}
.benefit-card p{color:#b6bfd5}
.benefit-icon.blue{background:#1a5851;color:#a2ffe7;border-color:#4d9884}
.benefit-icon.purple{background:#42346c;color:#dbbaff;border-color:#7862ab}
.benefit-icon.green{background:#604044;color:#ffcba4;border-color:#ab796c}
.benefit-foot{color:inherit}
.faq-section{border-top-color:#554969}
.faq-list details{background:#1a1e33;border-color:#3b4560}
.faq-list details[open]{background:#26203e;border-color:#8c70b7}
.faq-list details:nth-child(2n)[open]{background:#23313c;border-color:#72b7bd}
.bottom-cta-inner{
  background:radial-gradient(circle at 93% 0%,rgba(244,116,160,.22),transparent 50%),
  radial-gradient(circle at 13% 100%,rgba(46,215,211,.14),transparent 56%),
  linear-gradient(115deg,#25264b,#3b2652 67%,#4e2d45);
  border-color:#8d6fa7;
}
.site-footer{border-top-color:#43405e}
/* ORIGINAL GUIDE CONTENT / SEARCHABLE HELP */
.editorial-section{padding-top:6px;padding-bottom:73px}
.editorial-intro{max-width:830px;margin:0 auto 25px;text-align:center}
.editorial-intro h2{font-size:clamp(26px,3.2vw,37px);line-height:1.25;letter-spacing:-.045em;margin:12px 0}
.editorial-intro>p{font-size:13px;line-height:1.85;color:#acbad2;margin:0 auto;max-width:780px}
.editorial-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.editorial-card{padding:25px 25px 23px;border-radius:17px;border:1px solid #43496a;background:linear-gradient(135deg,#1d253c,#151c31)}
.editorial-card:nth-child(1){border-color:#477580;background:linear-gradient(135deg,#1d3a43,#15202f)}
.editorial-card:nth-child(2){border-color:#6a608d;background:linear-gradient(135deg,#2d2947,#1b2034)}
.editorial-card:nth-child(3){border-color:#8a5b75;background:linear-gradient(135deg,#382a43,#1b1d33)}
.editorial-card:nth-child(4){border-color:#62816b;background:linear-gradient(135deg,#233a34,#1a2232)}
.editorial-count{display:block;color:#9fc9fa;font-size:10px;letter-spacing:.15em;font-weight:850}
.editorial-card:nth-child(2) .editorial-count{color:#c6b2ff}
.editorial-card:nth-child(3) .editorial-count{color:#ffc0d7}
.editorial-card:nth-child(4) .editorial-count{color:#9fe8c3}
.editorial-card h3{font-size:16px;line-height:1.45;color:#f1f5ff;letter-spacing:-.025em;margin:12px 0 9px}
.editorial-card p{font-size:12px;line-height:1.9;color:#b1bfd3;margin:0}
.editorial-card strong{color:#ebf0fc;font-weight:740}
.editorial-links{display:flex;align-items:center;justify-content:center;gap:12px 20px;flex-wrap:wrap;margin-top:23px;padding-top:18px;border-top:1px solid #383a58;font-size:12px}
.editorial-links span{color:#8199b5}
.editorial-links a{color:#abd9fb;font-weight:730}
.editorial-links a:hover{color:#fff;text-decoration:underline}
@media(max-width:600px){.editorial-section{padding-top:3px;padding-bottom:53px}.editorial-intro h2{font-size:29px}.editorial-grid{grid-template-columns:1fr;gap:10px}.editorial-card{padding:22px}.editorial-links{justify-content:flex-start;gap:10px 16px}.editorial-intro>p{font-size:12px;text-align:left}}
/* V3 RESPONSIVENESS */
@media(max-width:1020px){
 .quick-card{padding:15px 13px;gap:10px}
 .quick-card-icon{width:40px;height:40px;border-radius:11px}
 .quick-card-copy strong{font-size:12px}
 .quick-card-copy small{font-size:10px}
 .quick-card-arrow{display:none}
}
@media(max-width:880px){
 .quick-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
 .quick-card{flex-direction:column;align-items:flex-start}
 .quick-card-copy{min-height:38px}
 .quick-start{padding-top:24px}
 .workspace-section{padding-top:30px}
}
@media(max-width:600px){
 .brand-mark{width:35px;height:35px}
 .brand-word{font-size:13px}.brand-light{font-size:8px;margin-left:5px}
 .hero{padding-top:40px;padding-bottom:27px}
 .hero-categories{margin-top:22px}
 .hero-proof{margin-top:20px}
 .hero-art{margin-top:10px}
 .quick-start{padding-top:24px;padding-bottom:6px}
 .quick-start-heading{display:block;margin-bottom:15px}
 .quick-start-heading h2{font-size:23px}
 .quick-start-heading p{font-size:11px;margin-top:5px}
 .quick-grid{display:grid;grid-template-columns:1fr;gap:9px}
 .quick-card{flex-direction:row;padding:13px 16px;min-height:65px}
 .quick-card-icon{width:39px;height:39px;border-radius:11px}
 .quick-card-copy{min-height:0}
 .quick-card-arrow{display:inline-block}
 .workspace-section{padding-top:31px}
 .format-grid{gap:5px}
 .format-pill{min-height:63px;padding:8px 2px}
 .format-pill strong{font-size:11px}
 .format-pill small{font-size:9px}
 .audio-format-panel{padding:7px 5px 9px}
 .output-option{min-height:63px}
 .section-heading{margin-bottom:18px}
 .benefits-section{padding-top:75px}
 .benefit-card{min-height:0}
}
@media(max-width:370px){
 .brand-light{display:none}
 .hero-categories{gap:5px}
 .category-token{font-size:9px;padding:6px 7px}
}
@media(prefers-reduced-motion:reduce){.art-orbit{animation:none}}


/* MODULE: motion-v4.css */
/* ALINOVA Video Studio V4 — smooth, GPU-friendly card animation & UI polishing */
/* All text and cards remain in the DOM without animation; indexing is independent of JS. */
:root{--motion-ease:cubic-bezier(.2,.72,.25,1);--motion-fast:220ms;--motion-med:360ms}
.quick-start{padding-top:48px}
.quick-start-heading h2{font-weight:880}
.quick-card{
  isolation:isolate;
  overflow:hidden;
  border-width:1px;
  border-radius:19px;
  min-height:104px;
  padding:20px 17px;
  box-shadow:inset 0 1px rgba(255,255,255,.08),0 8px 22px rgba(0,0,0,.14);
  transition:transform var(--motion-med) var(--motion-ease),border-color var(--motion-med),box-shadow var(--motion-med),background var(--motion-med);
  will-change:auto;
}
.quick-card::before{opacity:.19;transition:opacity 300ms,transform 520ms var(--motion-ease);transform:scale(1);z-index:-1}
.quick-card::after{
  content:"";position:absolute;z-index:-1;left:-55%;bottom:-110%;width:120%;height:190%;
  pointer-events:none;transform:rotate(20deg) translateX(-70%);opacity:0;
  background:linear-gradient(90deg,transparent 20%,rgba(255,255,255,.13) 50%,transparent 83%);
  transition:transform 720ms var(--motion-ease),opacity 300ms;
}
.quick-card-icon{width:53px;height:53px;border-radius:16px;box-shadow:0 7px 19px rgba(0,0,0,.12);transition:transform 420ms var(--motion-ease),box-shadow 350ms}
.quick-card-icon .icon{width:25px;height:25px;transition:transform 400ms var(--motion-ease),stroke 220ms}
.quick-card-copy strong{font-size:14px;letter-spacing:-.018em}
.quick-card-copy small{font-size:11px;line-height:1.5;color:#d1cfe6}
.quick-card-arrow{width:18px;height:18px;opacity:.92;transition:transform 350ms var(--motion-ease),opacity 220ms}
.quick-video{background:linear-gradient(129deg,#512b3d,#35243e 72%,#362444);border-color:#9e617a}
.quick-audio{background:linear-gradient(130deg,#1e514b,#1c303f 75%,#1c3d43);border-color:#538d7b}
.quick-link{background:linear-gradient(130deg,#3c2d67,#292948 70%,#36305d);border-color:#786caa}
.quick-video .quick-card-icon{color:#ffd1ad;background:linear-gradient(145deg,#954c58,#704159);border-color:#c47d85}
.quick-audio .quick-card-icon{color:#b6ffdc;background:linear-gradient(145deg,#236d61,#2b545d);border-color:#6bc9aa}
.quick-link .quick-card-icon{color:#e2c5ff;background:linear-gradient(145deg,#6451a0,#534579);border-color:#a08bd6}
.quick-card:hover,.quick-card:focus-visible{transform:translate3d(0,-5px,0);box-shadow:0 17px 34px rgba(4,7,22,.31),inset 0 1px rgba(255,255,255,.13)}
.quick-card:hover::before,.quick-card:focus-visible::before{opacity:.3;transform:scale(1.2)}
.quick-card:hover::after,.quick-card:focus-visible::after{opacity:1;transform:rotate(20deg) translateX(170%)}
.quick-card:hover .quick-card-icon,.quick-card:focus-visible .quick-card-icon{transform:translate3d(0,-3px,0) rotate(-5deg) scale(1.05);box-shadow:0 11px 29px rgba(0,0,0,.2)}
.quick-card:hover .quick-card-icon .icon,.quick-card:focus-visible .quick-card-icon .icon{transform:scale(1.08)}
.quick-card:hover .quick-card-arrow,.quick-card:focus-visible .quick-card-arrow{transform:translateX(4px);opacity:1}
.quick-card:active{transform:translate3d(0,-1px,0) scale(.987)}
.quick-card[aria-pressed="true"]{box-shadow:0 0 0 2px currentColor,inset 0 1px rgba(255,255,255,.19),0 15px 35px #02081858}
.quick-card[aria-pressed="true"] .quick-card-arrow{transform:translateX(4px)}
.original-quality{display:flex;align-items:center;gap:10px;padding:14px;border-radius:13px;background:linear-gradient(110deg,#203b40,#1c2841);border:1px solid #52848d;color:#dcfaee;font-size:12px;font-weight:710}
.original-quality>.icon{width:20px;height:20px;color:#9cf1cf}
.original-quality-mark{margin-left:auto;color:#97d6c4;letter-spacing:.055em;font-size:9px;font-weight:870;white-space:nowrap}
@media (max-width:600px){.original-quality{flex-wrap:wrap}.original-quality-mark{font-size:8px}}
/* Card surfaces */
.studio-card{border-radius:24px;box-shadow:0 24px 65px rgba(0,0,0,.24),0 0 0 1px rgba(184,162,255,.025);transition:box-shadow var(--motion-med)}
.studio-card:focus-within{box-shadow:0 20px 70px rgba(0,0,0,.27),0 0 0 1px rgba(129,125,230,.12)}
.card-titlebar{padding-top:27px;padding-bottom:25px}
.card-titlebar h3{font-size:20px}
.title-icon{height:51px;width:51px;border-radius:16px;box-shadow:0 9px 19px rgba(51,37,93,.28)}
.step-num{transition:background var(--motion-fast),transform var(--motion-fast)}
.form-section:focus-within .step-num{background:#45457e;color:#eff0ff;transform:scale(1.045)}
.source-switch{padding:6px;border-radius:15px}
.source-tab{border-radius:10px;transition:color 200ms,background 200ms,box-shadow 200ms}
.source-tab.selected .icon{transform:translateY(-1px)}
.source-tab .icon{transition:transform var(--motion-med)}
.source-tab:hover .icon{transform:scale(1.15)}
.output-option{border-radius:16px;overflow:hidden;transition:transform 240ms var(--motion-ease),border-color 240ms,box-shadow 240ms}
.output-option::after{content:"";position:absolute;top:0;bottom:0;left:0;width:3px;background:transparent;transition:background 220ms}
.output-option:first-child.selected::after{background:#62ecc1}
.output-option:nth-child(2).selected::after{background:#ffa08f}
.output-option:not(.selected):hover{transform:translateY(-2px);box-shadow:0 9px 20px #080e1e40}
.output-option.selected{box-shadow:inset 0 0 0 1px rgba(255,255,255,.04),0 7px 19px #070c1833}
.output-option-icon{height:43px;width:43px;border-radius:13px;transition:transform 290ms var(--motion-ease)}
.output-option:hover .output-option-icon{transform:rotate(-6deg) scale(1.09)}
.output-option-text strong{font-size:13px}
.output-option-text small{font-size:10px;line-height:1.55}
/* Format chips */
.format-pill{border-radius:15px;min-height:76px;box-shadow:inset 0 1px rgba(255,255,255,.03);transition:transform 220ms var(--motion-ease),background 230ms,border-color 230ms,box-shadow 230ms}
.format-pill:hover{transform:translate3d(0,-3px,0);box-shadow:0 9px 18px rgba(0,0,0,.2)}
.format-pill.selected{transform:translate3d(0,-2px,0);box-shadow:0 7px 17px rgba(2,5,15,.28),inset 0 1px rgba(255,255,255,.1)}
.format-pill:active{transform:scale(.96)}
.format-pill small{font-size:10px}
/* Upload card */
.upload-zone{border-radius:17px;transition:border-color 200ms,background 200ms,transform 250ms var(--motion-ease),box-shadow 250ms}
.upload-zone.dragging,.upload-zone:focus-visible{transform:scale(1.006);box-shadow:0 0 0 3px rgba(157,132,253,.13)}
.upload-icon-wrap{transition:transform 250ms var(--motion-ease);border-radius:16px}
.upload-zone:hover .upload-icon-wrap,.upload-zone.dragging .upload-icon-wrap{transform:translateY(-4px)}
.paste-button{transition:background var(--motion-fast),transform var(--motion-fast)}
.paste-button:active{transform:scale(.96)}
.submit-button{position:relative;overflow:hidden}
.submit-button .icon{transition:transform var(--motion-med)}
.submit-button:hover:not(:disabled) .submit-arrow{transform:translateX(5px)}
.rights-check .check-art{transition:transform 220ms var(--motion-ease),background 220ms}
.rights-check:hover .check-art{transform:scale(1.08)}
/* Explanatory tiles: distinct accents and subtler hover */
.sidebar-card{
  border-radius:21px;
  transition:transform var(--motion-med) var(--motion-ease),box-shadow var(--motion-med),border-color var(--motion-med);
}
.sidebar-card:hover{transform:translateY(-3px);box-shadow:0 19px 37px rgba(0,0,0,.24);border-color:#646389}
.sidebar-card::before{width:4px;transition:width var(--motion-med)}
.sidebar-card:hover::before{width:6px}
.aside-icon{height:43px;width:43px;transition:transform var(--motion-med) var(--motion-ease)}
.sidebar-card:hover .aside-icon{transform:rotate(-5deg) scale(1.075)}
.mini-num{transition:transform 200ms,border-color 200ms}
.mini-steps li:hover .mini-num{transform:scale(1.09);border-color:#ffd09e}
.source-tags span{transition:transform 220ms,background 220ms,border-color 220ms}
.source-tags span:hover{transform:translateY(-2px);border-color:#9a86cd}
/* Benefit cards: layered surfaces and animated directional accents */
.benefit-card{
  border-radius:22px;
  box-shadow:inset 0 1px rgba(255,255,255,.05),0 9px 20px rgba(0,0,0,.13);
  transition:transform var(--motion-med) var(--motion-ease),box-shadow var(--motion-med),border-color var(--motion-med);
}
.benefit-card::after{content:"";position:absolute;bottom:0;left:0;right:0;height:3px;transform-origin:left center;transform:scaleX(.18);transition:transform 450ms var(--motion-ease)}
.benefit-card-audio::after{background:linear-gradient(90deg,#40dba8,#85f6d1)}
.benefit-card-video::after{background:linear-gradient(90deg,#8a7bff,#e3a0ff)}
.benefit-card-privacy::after{background:linear-gradient(90deg,#ffb36f,#ff93a7)}
.benefit-card:hover{transform:translateY(-6px);box-shadow:0 20px 46px #06091566;border-color:#746e9f}
.benefit-card:hover::after{transform:scaleX(1)}
.benefit-icon{height:52px;width:52px;border-radius:16px;transition:transform 380ms var(--motion-ease),box-shadow 350ms}
.benefit-card:hover .benefit-icon{transform:translateY(-4px) rotate(-4deg);box-shadow:0 10px 22px rgba(0,0,0,.23)}
.benefit-foot .icon{transition:transform 230ms}
.benefit-card:hover .benefit-foot .icon{transform:translateX(5px)}
/* Editorial: steady structure, more readable line-length */
.editorial-card{position:relative;overflow:hidden;min-height:247px;box-shadow:inset 0 1px rgba(255,255,255,.05);transition:transform var(--motion-med) var(--motion-ease),box-shadow var(--motion-med),border-color var(--motion-med)}
.editorial-card::before{content:"";position:absolute;right:-55px;top:-95px;width:185px;height:185px;border-radius:50%;background:currentColor;opacity:.045;transition:transform 650ms var(--motion-ease)}
.editorial-card:nth-child(1){color:#87d8df}.editorial-card:nth-child(2){color:#d0b4ff}.editorial-card:nth-child(3){color:#ffa6c7}.editorial-card:nth-child(4){color:#8ce5af}
.editorial-card:hover{transform:translateY(-4px);box-shadow:0 16px 35px rgba(0,0,0,.2);border-color:#8981b2}
.editorial-card:hover::before{transform:scale(1.4) translate(-10px,20px)}
.editorial-card h3,.editorial-card p{color:#f1f5ff}
.editorial-card p{color:#b1bfd3}
.editorial-count{position:relative;z-index:1}
/* FAQ: expand hint */
.faq-list details{transition:border-color var(--motion-med),background var(--motion-med),box-shadow var(--motion-med)}
.faq-list details:hover{border-color:#6f688c}
.faq-list details[open]{box-shadow:0 10px 25px #060b1c37}
.faq-list summary{transition:color 200ms}
.faq-list details:hover summary{color:#fff}
.faq-list summary .icon{transition:transform 300ms var(--motion-ease),color 200ms}
.faq-list details[open] summary .icon{color:#e2c4ff}
.bottom-cta-inner{position:relative;overflow:hidden;box-shadow:0 22px 60px rgba(44,27,78,.25)}
.bottom-cta-inner::after{content:"";position:absolute;right:-80px;bottom:-160px;width:340px;height:340px;border:1px solid #ffe5ff21;border-radius:50%;pointer-events:none}
/* Animation only enhances already-visible content. */
@keyframes studio-card-rise{
 from{opacity:.9;transform:translate3d(0,16px,0) scale(.992)}
 to{opacity:1;transform:translate3d(0,0,0) scale(1)}
}
@keyframes studio-confirm{
 from{transform:translateY(8px);opacity:.85}to{transform:translateY(0);opacity:1}
}
.motion-in:not(.selected):not(.quick-card[aria-pressed="true"]){animation:studio-card-rise 620ms var(--motion-ease)}
.quick-grid .motion-in:nth-child(2),.benefits-grid .motion-in:nth-child(2),.editorial-grid .motion-in:nth-child(2){animation-delay:85ms}
.quick-grid .motion-in:nth-child(3),.benefits-grid .motion-in:nth-child(3),.editorial-grid .motion-in:nth-child(3){animation-delay:170ms}
.editorial-grid .motion-in:nth-child(4),.sidebar .motion-in:nth-child(3){animation-delay:220ms}
.job-status[data-state="done"]{animation:studio-confirm 470ms var(--motion-ease)}
@media (max-width:880px){
 .quick-card{min-height:115px;padding:15px 13px}
 .quick-card-icon{width:43px;height:43px}
 .quick-card-copy strong{font-size:12px}
 .quick-card-copy small{font-size:10px}
}
@media (max-width:600px){
 .quick-start{padding-top:25px}
 .quick-card{min-height:72px;padding:14px 15px;flex-direction:row;border-radius:16px}
 .quick-card-icon{width:42px;height:42px;border-radius:12px}
 .quick-card-copy strong{font-size:13px}
 .quick-card-arrow{display:block}
 .studio-card{border-radius:18px}
 .title-icon{width:43px;height:43px}
 .card-titlebar h3{font-size:17px}
 .sidebar-card{border-radius:18px}
 .editorial-card{min-height:auto;padding:23px}
 .format-pill{min-height:64px}
 .format-pill strong{font-size:11px}
 .output-option-icon{width:33px;height:33px}
 .output-option-text strong{font-size:11px}
}
@media (hover:none){
 .quick-card:hover,.sidebar-card:hover,.benefit-card:hover,.editorial-card:hover,.format-pill:hover{transform:none}
 .quick-card:hover::after{opacity:0}
 .quick-card:hover .quick-card-icon,.sidebar-card:hover .aside-icon,.benefit-card:hover .benefit-icon{transform:none}
}
@media (prefers-reduced-motion:reduce){
 .motion-in,.job-status[data-state="done"]{animation:none!important}
 .quick-card,.quick-card::after,.quick-card::before,.quick-card-icon,.quick-card-icon .icon,
 .quick-card-arrow,.studio-card,.sidebar-card,.sidebar-card::before,.aside-icon,
 .benefit-card,.benefit-card::after,.benefit-icon,.benefit-foot .icon,
 .editorial-card,.editorial-card::before,.source-tab,.output-option,.output-option-icon,
 .format-pill,.upload-zone,.upload-icon-wrap,.step-num,.paste-button,.rights-check .check-art,
 .faq-list details,.faq-list summary,.faq-list summary .icon{transition:none!important}
}


/* MODULE: launch-v5.css */
/* V5 launch-ready mobile and conversion-state refinements. */
.process-steps{display:flex;justify-content:space-between;align-items:center;gap:7px;margin-top:13px;position:relative}
.process-step{display:flex;align-items:center;justify-content:center;gap:6px;flex:1;font-size:10px;font-weight:700;color:#889bb4;transition:color .2s}
.process-step-dot{width:8px;height:8px;border-radius:100%;flex:none;border:1px solid #7186a4;background:#1a2d41;transition:background .2s,border-color .2s,box-shadow .2s}
.process-step.current{color:#addfff}
.process-step.current .process-step-dot{background:#69cffe;border-color:#bdeaff;box-shadow:0 0 0 4px #59c7ff1a}
.process-step.completed{color:#9bf0c8}
.process-step.completed .process-step-dot{background:#65d6a7;border-color:#9cf2c8}
.secondary-status-button{margin-top:14px;border:1px solid #61749d;border-radius:10px;min-height:43px;padding:9px 15px;display:inline-flex;align-items:center;justify-content:center;gap:9px;background:#26314c;color:#dfebff;font-size:12px;font-weight:780;transition:background .18s,border-color .18s}
.secondary-status-button:hover{background:#314362;border-color:#8ca5d2}
.secondary-status-button:active{transform:scale(.985)}
.secondary-status-button .icon{width:16px;height:16px}
#stopUploadButton{border-color:#8a647b;background:#38293e}
#stopUploadButton:hover{background:#56334e}
.preview-duration{color:#9be5d8!important;font-size:10px!important;line-height:1.4;display:block;white-space:normal}
.file-preview{min-height:64px}
.file-preview-details{gap:3px}
.file-preview-details strong{white-space:normal;overflow-wrap:anywhere;line-height:1.5}
#statusMessage{overflow-wrap:anywhere;line-height:1.6}
.status-text{min-width:0;flex:1}
.status-head{align-items:flex-start}
.status-icon{align-self:flex-start}
.upload-zone{touch-action:manipulation}
.studio-card button,.quick-card,.format-pill,.source-tab{touch-action:manipulation}
.url-control input{min-width:0}
@media (max-width:600px){
 .url-control input{font-size:16px;padding-right:87px}
 .source-tab,.paste-button,.btn,.output-option{min-height:44px}
 .quick-card{min-height:72px}
 .studio-card{overflow:hidden}
 .file-preview{gap:10px}
 .file-preview-icon{width:35px;height:35px;flex:none}
 .file-preview-details strong{font-size:11px}
 .process-steps{gap:3px}
 .process-step{font-size:9px;gap:4px}
 .process-step-dot{height:7px;width:7px}
 .status-head{gap:9px}
 .status-icon{width:34px;height:34px}
 .secondary-status-button{width:100%;min-height:45px}
}
@media(prefers-reduced-motion:reduce){.process-step,.process-step-dot,.secondary-status-button{transition:none!important}}


/* V6 security UI: fully absent while Cloudflare keys are not configured. */
.turnstile-zone:not([hidden]){display:grid;gap:10px;padding:15px;margin:4px 0 18px;border:1px solid #607aa5;border-radius:15px;background:linear-gradient(135deg,#1c2843,#22213e);box-shadow:inset 0 1px rgba(255,255,255,.05)}
.turnstile-zone .turnstile-label{font-size:12px;font-weight:850;color:#c5e3ff;letter-spacing:.025em}
.turnstile-zone small{color:#b3c3db;font-size:11px;line-height:1.55}
#turnstileWidget{min-height:64px;max-width:100%;overflow:hidden}
@media(max-width:600px){.turnstile-zone:not([hidden]){padding:11px;gap:9px}.turnstile-zone .turnstile-label{font-size:11px}}

/* V7: audio playback card that remains hidden until a valid conversion finishes. */
.audio-preview:not([hidden]){
  display:grid;gap:11px;padding:16px;margin:15px 0 8px;
  background:linear-gradient(135deg,#1b3e44,#272746 80%);
  border:1px solid #498b91;border-radius:17px;
  box-shadow:inset 0 1px rgba(255,255,255,.07),0 10px 30px rgba(0,0,0,.16)
}
.audio-preview-heading{display:flex;align-items:center;gap:12px;color:#daf9ee}
.audio-preview-heading>.icon{width:39px;height:39px;flex:0 0 auto;padding:9px;border-radius:12px;background:#2a7068;color:#b4ffdb}
.audio-preview-heading span{display:grid;gap:3px;min-width:0}
.audio-preview-heading strong{font-size:13px;letter-spacing:-.014em}
.audio-preview-heading small{font-size:11px;color:#afcfe0;line-height:1.5}
.audio-preview audio{width:100%;min-width:0;max-width:100%;height:52px;display:block;accent-color:#53dbba}
.audio-preview-note{font-size:10px;color:#b0c8d5;line-height:1.65}
@media(max-width:600px){.audio-preview:not([hidden]){padding:13px;gap:9px}.audio-preview-heading strong{font-size:12px}.audio-preview audio{height:50px}}

/* V8 mobile-first interaction polish and transparent result retention. */
.result-actions:not([hidden]){display:grid;grid-template-columns:1fr;gap:10px;margin-top:13px}
.expiry-status{display:flex;align-items:center;gap:10px;padding:12px 13px;border:1px solid #517785;border-radius:12px;background:linear-gradient(110deg,#1a343b,#1c2c40);color:#bdeddd;font-size:11px;line-height:1.6;font-weight:700;font-variant-numeric:tabular-nums}
.expiry-status .icon{width:17px;height:17px;flex-shrink:0;color:#78e1c9}
.expiry-status.urgent{border-color:#b58a54;color:#ffe0a3;background:linear-gradient(110deg,#3c3028,#352d3a)}
.expiry-status.urgent .icon{color:#ffd29a}
.expiry-status.expired{border-color:#b16f82;color:#ffd4da;background:#372833}
.expiry-status.expired .icon{color:#ffc3cb}
.new-conversion-button{display:inline-flex;align-items:center;justify-content:center;gap:10px;padding:12px 17px;min-height:45px;border:1px solid #7c83ab;border-radius:12px;background:linear-gradient(130deg,#37395d,#2c314d);color:#edf1ff;font-weight:790;font-size:12px;transition:transform .22s,border-color .22s,background .22s;cursor:pointer}
.new-conversion-button .icon{height:17px;width:17px;color:#b2daff}
.new-conversion-button:hover{border-color:#b5a4f3;background:linear-gradient(130deg,#484078,#343c67);transform:translateY(-2px)}
.new-conversion-button:active{transform:scale(.98)}
/* Compact the illustration on phones so real conversion actions appear sooner. */
@media(max-width:600px){
  .hero{padding-top:29px;padding-bottom:12px;gap:2px}
  .hero h1{margin:13px 0;font-size:clamp(43px,11.6vw,56px)}
  .hero-lead{font-size:13px;line-height:1.68}
  .hero-actions{margin-top:15px;gap:14px}
  .hero-categories{margin-top:15px}
  .hero-proof{margin-top:12px;gap:7px 12px}
  .hero-art{height:185px;margin-top:2px}
  .visual-panel{padding:9px;border-radius:15px;width:min(89%,375px)}
  .visual-video{height:84px}
  .waveform{height:24px}
  .visual-wave-label{margin-top:6px}
  .floating-chip{font-size:9px;padding:6px 9px}
  .chip-one{left:0;top:5%}
  .chip-two{right:0;bottom:1%}
  .quick-start{padding-top:14px}
  .hero .btn-primary{min-height:44px}
  .expiry-status{font-size:11px}
  .new-conversion-button{min-height:48px;width:100%}
}
@media(max-width:370px){
  .hero-art{height:165px}
  .visual-video{height:72px}
  .hero-actions{gap:9px}
  .hero h1{font-size:44px}
}
@media(prefers-reduced-motion:reduce){.new-conversion-button{transition:none!important}}

/* V9 video/audio preflight status */
.wav-limit-warning:not([hidden]){
  display:flex;align-items:flex-start;gap:9px;
  margin-top:12px;padding:12px 13px;border-radius:11px;
  border:1px solid #bd8d4f;background:linear-gradient(125deg,#402e26,#382d3b);
  color:#ffe1b2;font-size:11px;font-weight:720;line-height:1.6
}
.wav-limit-warning .icon{width:16px;height:16px;flex:none;margin-top:1px;color:#ffd08d}
.file-preview-details .preview-duration{font-variant-numeric:tabular-nums}
@media(max-width:600px){
  .wav-limit-warning:not([hidden]){font-size:11px;padding:11px;gap:8px}
  .file-preview-details{min-width:0}
}