:root{--shell-line:rgba(255,255,255,.14);--shell-text:#f5f5f7;--shell-muted:#a1a1a6;--shell-green:#44d7b6}.site-nav{width:min(1160px,calc(100% - 48px));height:72px;margin:18px auto 28px;padding:0 22px;display:flex;align-items:center;justify-content:space-between;position:relative;z-index:20;background:rgba(24,25,29,.72);border:1px solid var(--shell-line);border-radius:18px;box-shadow:0 12px 40px rgba(0,0,0,.2),inset 0 1px rgba(255,255,255,.1);backdrop-filter:blur(28px) saturate(150%);-webkit-backdrop-filter:blur(28px) saturate(150%)}.site-brand{color:var(--shell-text);font-size:18px;text-decoration:none}.site-brand b{font-weight:750}.site-brand i{font-style:normal;color:var(--shell-green);margin:0 4px}.site-links{display:flex;gap:8px}.site-links a{padding:8px 12px;border-radius:10px;color:#d1d1d6;text-decoration:none;font-size:13px}.site-links a:hover,.site-links a.active{background:rgba(255,255,255,.09);color:#fff}.site-footer-shell{width:min(1160px,calc(100% - 48px));margin:30px auto 0;padding:34px 4px 40px;border-top:1px solid var(--shell-line);display:grid;grid-template-columns:1fr auto;gap:20px;color:var(--shell-muted)}.site-footer-shell p{margin:5px 0 0;font-size:13px}.site-footer-shell small{grid-column:1/-1;font-size:12px}.footer-links{display:flex;gap:22px;align-items:center}.footer-links a{color:var(--shell-muted);text-decoration:none;font-size:13px}.footer-links a:hover{color:#fff}@media(max-width:760px){.site-nav{width:calc(100% - 28px);height:62px;margin:10px auto 20px;padding:0 14px;border-radius:15px}.site-links{gap:0}.site-links a{padding:7px 7px;font-size:12px}.site-footer-shell{width:calc(100% - 28px);grid-template-columns:1fr;padding-bottom:28px}.footer-links{gap:16px;flex-wrap:wrap}.site-footer-shell small{grid-column:auto}}
body{background:linear-gradient(145deg,#08090b 0%,#111316 52%,#090a0c 100%);background-attachment:fixed;color:var(--shell-text)}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(105deg,rgba(68,215,182,.055),transparent 34%,rgba(255,125,104,.045) 74%,transparent);z-index:-1}.container{max-width:760px}.header h1{color:#f5f5f7}.subtitle,.upload-hint,.conv-desc,.footer{color:var(--shell-muted)}.step,.progress-section,.result-section,.error-section{background:rgba(255,255,255,.075);border:1px solid var(--shell-line);box-shadow:0 22px 60px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.1);backdrop-filter:blur(22px) saturate(135%)}.step h2,.conv-title,.file-name,.progress-label,.result-text h3{color:#f5f5f7}.upload-zone{background:rgba(5,6,8,.35);border-color:rgba(255,255,255,.18)}.upload-zone:hover,.upload-zone.dragover{background:rgba(68,215,182,.08);border-color:var(--shell-green)}.upload-link{color:var(--shell-green)}.file-info,.conv-card{background:rgba(5,6,8,.36);border-color:rgba(255,255,255,.12)}.conv-card:hover,.conv-card.selected{background:rgba(68,215,182,.1);border-color:rgba(68,215,182,.55)}.step-number,.btn-convert{background:linear-gradient(145deg,#44d7b6,#59a8f5);color:#07120f}.btn-convert:hover{box-shadow:0 12px 30px rgba(68,215,182,.2)}.progress-bar-track{background:rgba(255,255,255,.1)}.progress-bar-fill{background:var(--shell-green)}.result-card{background:rgba(68,215,182,.09);border-color:rgba(68,215,182,.22)}.error-card{background:rgba(255,125,104,.09);border-color:rgba(255,125,104,.24)}
body{background:linear-gradient(145deg,#07090b 0%,#121518 48%,#0d0b0e 100%)}.container{max-width:800px}.header{margin-bottom:38px}.header h1{color:#fff;text-shadow:0 8px 28px rgba(0,0,0,.28)}.subtitle{color:#b7bac0}.step,.progress-section,.result-section,.error-section{border-radius:22px;background:linear-gradient(145deg,rgba(255,255,255,.105),rgba(255,255,255,.055));border-color:rgba(255,255,255,.16);box-shadow:0 26px 70px rgba(0,0,0,.34),inset 0 1px rgba(255,255,255,.16);overflow:hidden}.step{padding:27px}.step-header{margin-bottom:20px}.step h2{font-size:20px;color:#f7f7f8}.step-number{width:34px;height:34px;box-shadow:0 8px 22px rgba(68,215,182,.2),inset 0 1px rgba(255,255,255,.35)}.upload-zone{min-height:238px;border:1px dashed rgba(255,255,255,.25);border-radius:17px;background:rgba(5,7,9,.42);box-shadow:inset 0 1px rgba(255,255,255,.035)}.upload-zone:hover,.upload-zone.dragover{background:rgba(68,215,182,.075);border-color:rgba(68,215,182,.7);box-shadow:inset 0 0 35px rgba(68,215,182,.035)}.upload-icon{filter:drop-shadow(0 12px 20px rgba(0,0,0,.32))}.upload-text{color:#e1e2e5;font-size:16px}.upload-link{color:#58dfc0;font-weight:700;text-decoration:none}.upload-link:hover{color:#8af0d8}.upload-hint{color:#92969e}.file-info,.conv-card{background:rgba(8,10,12,.46);border-color:rgba(255,255,255,.14);border-radius:15px}.file-name,.conv-title{color:#f3f3f5}.file-size,.conv-desc,.progress-percent,.result-text p{color:#aeb1b8}.conv-card:hover,.conv-card.selected{background:rgba(68,215,182,.105);border-color:rgba(68,215,182,.56);box-shadow:inset 0 1px rgba(255,255,255,.08),0 12px 30px rgba(0,0,0,.2)}.btn-convert{border-radius:13px;background:linear-gradient(135deg,#58dfc0,#72b8ff);box-shadow:0 14px 32px rgba(68,215,182,.16),inset 0 1px rgba(255,255,255,.38)}.footer{color:#aeb2bb;border-top-color:rgba(255,255,255,.1)}@media(max-width:760px){.step{padding:20px}.upload-zone{min-height:210px}.subtitle{font-size:13px}}
.queue-section{margin:22px 0;padding:25px;background:linear-gradient(145deg,rgba(255,255,255,.09),rgba(255,255,255,.045));border:1px solid rgba(255,255,255,.15);border-radius:20px;box-shadow:inset 0 1px rgba(255,255,255,.12)}.queue-heading{display:flex;justify-content:space-between;gap:24px;align-items:start;margin-bottom:18px}.queue-kicker{color:#58dfc0;font-size:11px;font-weight:800;letter-spacing:1.2px}.queue-heading h2{color:#f7f7f8;font-size:20px;margin:5px 0 0}.queue-heading p{max-width:260px;margin:2px 0 0;color:#aeb2bb;font-size:12px;text-align:right}.queue-list{display:grid;gap:9px}.queue-job{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 14px;border:1px solid rgba(255,255,255,.1);border-radius:13px;background:rgba(5,7,9,.35)}.queue-job b{display:block;color:#e8e8eb;font-size:14px}.queue-job small{display:block;margin-top:3px;color:#aeb2bb;font-size:12px}.queue-job a{padding:7px 11px;border:1px solid rgba(68,215,182,.35);border-radius:9px;color:#6ee9cd;font-size:13px;font-weight:700;text-decoration:none}.queue-job.processing{border-color:rgba(68,215,182,.32)}.queue-job.done{border-color:rgba(68,215,182,.38)}.queue-job.failed{border-color:rgba(255,125,104,.38)}@media(max-width:560px){.queue-heading{display:block}.queue-heading p{text-align:left;margin-top:9px}.queue-section{padding:20px}}
.conversion-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.conv-card{min-height:168px;padding:25px 22px;border:1px solid rgba(255,255,255,.14);border-radius:18px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;isolation:isolate}.conv-card:before{content:"";position:absolute;inset:0;background:linear-gradient(145deg,rgba(255,255,255,.035),transparent 60%);z-index:-1}.conv-card:hover{transform:translateY(-4px);border-color:rgba(255,255,255,.28);background:rgba(255,255,255,.075)}.conv-card.selected{transform:translateY(-2px);background:linear-gradient(145deg,rgba(68,215,182,.17),rgba(68,215,182,.075));border-color:rgba(68,215,182,.72);box-shadow:0 16px 34px rgba(0,0,0,.25),inset 0 1px rgba(255,255,255,.12),0 0 0 1px rgba(68,215,182,.1)}.conv-card.selected::after{top:12px;right:12px;width:25px;height:25px;background:var(--shell-green);color:#06120f;font-size:14px;font-weight:800;box-shadow:0 8px 18px rgba(68,215,182,.24)}.conv-icon{font-size:32px;margin-bottom:14px;line-height:1.25;filter:drop-shadow(0 9px 16px rgba(0,0,0,.25))}.conv-title{font-size:15px;font-weight:750}.conv-desc{font-size:12px;margin-top:5px}.progress-section{padding:0;background:transparent;border:0;box-shadow:none;overflow:visible}.progress-bar-container{padding:22px 24px;background:linear-gradient(145deg,rgba(255,255,255,.1),rgba(255,255,255,.055));border:1px solid rgba(255,255,255,.16);border-radius:18px;box-shadow:0 20px 50px rgba(0,0,0,.28),inset 0 1px rgba(255,255,255,.12);backdrop-filter:blur(22px)}.progress-info{margin-bottom:13px}.progress-label{color:#e7e8ea;font-weight:650}.progress-percent{color:#68e2c5;font-weight:750;font-variant-numeric:tabular-nums}.progress-bar-track{height:9px;background:rgba(255,255,255,.1);border-radius:9px;box-shadow:inset 0 1px 3px rgba(0,0,0,.3)}.progress-bar-fill{background:linear-gradient(90deg,#44d7b6,#72b8ff);border-radius:9px;box-shadow:0 0 16px rgba(68,215,182,.32)}@media(max-width:560px){.conversion-grid{grid-template-columns:1fr}.conv-card{min-height:145px;padding:21px}}
.compat-notice{display:flex;gap:10px;align-items:flex-start;max-width:760px;margin:16px auto 0;padding:12px 15px;border:1px solid rgba(255,196,92,.26);border-radius:14px;background:rgba(255,183,77,.08);color:rgba(255,235,196,.86);font-size:13px;line-height:1.6;text-align:left;backdrop-filter:blur(18px)}.compat-notice strong{flex:0 0 auto;color:#ffd58a;font-weight:650}@media(max-width:640px){.compat-notice{display:block}.compat-notice strong{display:block;margin-bottom:3px}}
