@import "https://fonts.googleapis.com/css2?family=DM+Sans:ital,opsz,wght@0,9..40,300;0,9..40,400;0,9..40,500;0,9..40,600;0,9..40,700;1,9..40,400&family=DM+Mono:wght@400;500&display=swap";*,:before,:after{box-sizing:border-box}body{color:#111;-webkit-font-smoothing:antialiased;background:#fafafa;margin:0;font-family:DM Sans,system-ui,sans-serif}.app{background:#fafafa;min-height:100vh;padding:32px 16px 64px}.app-header{text-align:center;max-width:680px;margin:0 auto 32px}.app-logo{align-items:center;gap:8px;margin-bottom:8px;display:inline-flex}.app-logo-icon{color:#fff;background:linear-gradient(135deg,#7c3aed,#9b6dff);border-radius:8px;justify-content:center;align-items:center;width:28px;height:28px;font-size:14px;line-height:1;display:flex}.app-logo-name{color:#111;letter-spacing:-.02em;font-size:18px;font-weight:700}.app-tagline{color:#888;margin:0;font-size:13px}.tab-bar-wrap{max-width:680px;margin:0 auto 20px}.tab-bar{background:#fff;border:1.5px solid #ebebeb;border-radius:16px;gap:4px;padding:4px;display:flex}.tab-btn{color:#888;cursor:pointer;background:0 0;border:none;border-radius:12px;flex:1;justify-content:center;align-items:center;gap:6px;padding:9px 12px;font-family:DM Sans,system-ui,sans-serif;font-size:13px;font-weight:500;transition:all .15s;display:flex}.tab-btn:hover:not(.tab-btn--active){color:#7c3aed;background:#f3eeff}.tab-btn--active{color:#fff;background:linear-gradient(135deg,#7c3aed,#9b6dff);font-weight:600;box-shadow:0 2px 8px #7c3aed33}.tab-icon{opacity:.7;font-size:11px}.tab-btn--active .tab-icon{opacity:1}.content-wrap{max-width:680px;margin:0 auto}.card{background:#fff;border:1.5px solid #ebebeb;border-radius:24px;flex-direction:column;gap:16px;padding:28px;display:flex}.label{letter-spacing:.06em;text-transform:uppercase;color:#888;margin-bottom:6px;font-size:12px;font-weight:600;display:block}.format-row{grid-template-columns:1fr auto 1fr;align-items:end;gap:10px;display:grid}.format-arrow{color:#bbb;text-align:center;-webkit-user-select:none;user-select:none;padding-bottom:2px;font-size:16px}.select{color:#111;appearance:none;cursor:pointer;background-color:#fff;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 12 12'%3E%3Cpath fill='%23888' d='M6 8L1 3h10z'/%3E%3C/svg%3E");background-position:right 12px center;background-repeat:no-repeat;border:1.5px solid #ebebeb;border-radius:12px;outline:none;width:100%;padding:10px 36px 10px 14px;font-family:DM Sans,system-ui,sans-serif;font-size:14px;transition:border-color .15s,box-shadow .15s}.select:focus{border-color:#9b6dff;box-shadow:0 0 0 3px #9b6dff26}.select:disabled{opacity:.5;cursor:not-allowed}.file-input{color:#888;cursor:pointer;background:#f3eeff;border:1.5px dashed #9b6dff;border-radius:12px;width:100%;padding:10px 14px;font-family:DM Sans,system-ui,sans-serif;font-size:14px;transition:border-color .15s,box-shadow .15s}.file-input:focus{border-color:#7c3aed;outline:none;box-shadow:0 0 0 3px #7c3aed26}.file-input:disabled{opacity:.5;cursor:not-allowed}.btn-primary{letter-spacing:.02em;color:#fff;cursor:pointer;background:linear-gradient(135deg,#7c3aed,#9b6dff);border:none;border-radius:12px;width:100%;padding:12px 20px;font-family:DM Sans,system-ui,sans-serif;font-size:14px;font-weight:600;transition:opacity .15s,transform .1s,box-shadow .15s;box-shadow:0 2px 12px #7c3aed40}.btn-primary:hover:not(:disabled){opacity:.92;box-shadow:0 4px 16px #7c3aed59}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-primary:disabled{box-shadow:none;cursor:not-allowed;background:#bbb}.btn-ghost{color:#888;cursor:pointer;background:#fff;border:1.5px solid #ebebeb;border-radius:12px;padding:10px 18px;font-family:DM Sans,system-ui,sans-serif;font-size:13px;font-weight:500;transition:border-color .15s,color .15s}.btn-ghost:hover{color:#7c3aed;border-color:#9b6dff}.btn-ghost:disabled{opacity:.4;cursor:not-allowed}.btn-download{color:#fff;cursor:pointer;background:#16a34a;border:none;border-radius:12px;padding:10px 20px;font-family:DM Sans,system-ui,sans-serif;font-size:13px;font-weight:600;transition:opacity .15s}.btn-download:hover{opacity:.88}.btn-download-link{color:#fff;background:#16a34a;border-radius:12px;padding:10px 20px;font-family:DM Sans,system-ui,sans-serif;font-size:13px;font-weight:600;text-decoration:none;transition:opacity .15s;display:inline-block}.btn-download-link:hover{opacity:.88}.btn-row{flex-wrap:wrap;gap:8px;display:flex}.progress-wrap{background:#ebebeb;border-radius:9999px;width:100%;height:4px;overflow:hidden}.progress-fill{background:linear-gradient(90deg,#7c3aed,#9b6dff);border-radius:9999px;height:100%;transition:width .25s}.badge{border-radius:8px;padding:8px 14px;font-family:DM Sans,system-ui,sans-serif;font-size:13px;font-weight:500}.badge--success{color:#16a34a;background:#f0fdf4;border:1px solid #bbf7d0}.badge--error{color:#dc2626;background:#fef2f2;border:1px solid #fecaca}.badge--info{color:#7c3aed;background:#f3eeff;border:1px solid #ddd6fe}.status-row{align-items:center;gap:8px;display:flex}.status-dot{border-radius:50%;flex-shrink:0;width:8px;height:8px;transition:all .3s}.status-dot--ready{background:#16a34a;box-shadow:0 0 6px #16a34a}.status-dot--loading{background:#bbb}.status-text{color:#888;font-size:12px}.engine-badge{color:#7c3aed;background:#f3eeff;border-radius:9999px;margin-left:auto;padding:2px 8px;font-size:11px;font-weight:600}.file-info{color:#888;flex-wrap:wrap;gap:12px;font-size:12px;display:flex}.file-info-sep{color:#bbb}.result-video{background:#000;border-radius:12px;width:100%;max-height:400px;display:block}.result-image{border:1.5px solid #ebebeb;border-radius:12px;max-width:100%;max-height:360px;display:block}.result-audio{border-radius:8px;width:100%}.preview-label{color:#888;margin-bottom:8px;font-size:12px;display:block}.preview-canvas{border:1.5px solid #ebebeb;border-radius:12px;max-width:100%;max-height:180px;display:block}.text-preview{background:#fafafa;border:1.5px solid #ebebeb;border-radius:12px;max-height:200px;padding:14px;overflow:auto}.text-preview-label{letter-spacing:.06em;text-transform:uppercase;color:#888;margin-bottom:8px;font-size:11px;font-weight:600;display:block}.text-preview pre{color:#111;white-space:pre-wrap;word-break:break-all;margin:0;font-family:DM Mono,Fira Code,monospace;font-size:12px}.result-section{flex-direction:column;gap:12px;display:flex}@keyframes progress-pulse{0%{opacity:1}50%{opacity:.4}to{opacity:1}}.progress-fill--pulse{background:linear-gradient(90deg,#7c3aed,#9b6dff,#c4b5fd);animation:1.2s ease-in-out infinite progress-pulse;width:100%!important}.drop-zone{color:#888;cursor:pointer;text-align:center;-webkit-user-select:none;user-select:none;background:#f3eeff;border:1.5px dashed #9b6dff;border-radius:12px;width:100%;padding:20px 14px;font-family:DM Sans,system-ui,sans-serif;font-size:14px;transition:border-color .15s,background .15s,box-shadow .15s;position:relative}.drop-zone input[type=file]{opacity:0;cursor:pointer;width:100%;height:100%;position:absolute;inset:0}.drop-zone--active{color:#7c3aed;background:#ede9ff;border-color:#7c3aed;box-shadow:0 0 0 3px #7c3aed26}.drop-zone:hover:not(.drop-zone--disabled){background:#ede9ff;border-color:#7c3aed}.drop-zone--disabled{opacity:.5;cursor:not-allowed}.drop-zone--disabled input[type=file]{pointer-events:none}.drop-zone-icon{margin-bottom:6px;font-size:20px;display:block}.drop-zone-text{color:inherit;font-size:13px;display:block}.drop-zone-hint{color:#bbb;margin-top:3px;font-size:11px;display:block}