.app{--surface: rgba(15, 23, 42, .65);--surface-2: rgba(30, 41, 59, .55);--border: rgba(148, 163, 184, .12);--text: #e2e8f0;--muted: #94a3b8;--accent: #818cf8;--accent-2: #22d3ee;--danger: #f87171;--success: #4ade80;--glow: rgba(129, 140, 248, .35);--layout-gap: clamp(1.25rem, 3vw, 2.5rem);--page-pad-x: clamp(1rem, 4vw, 2.5rem);--page-pad-y: clamp(1.5rem, 4vw, 3rem);position:relative;isolation:isolate;width:100%;max-width:min(72rem,100%);margin:0 auto;padding:var(--page-pad-y) var(--page-pad-x) clamp(2rem,6vw,4rem)}.app:before{content:"";position:fixed;inset:-40% -20% auto;height:70vh;background:radial-gradient(ellipse 80% 50% at 50% -20%,rgba(129,140,248,.22),transparent 55%),radial-gradient(ellipse 60% 40% at 100% 0%,rgba(34,211,238,.12),transparent 50%),radial-gradient(ellipse 50% 35% at 0% 20%,rgba(167,139,250,.1),transparent 45%);pointer-events:none;z-index:-1}.app-header{margin:0 0 clamp(1.25rem,3vw,2rem);max-width:min(42rem,100%)}.app-header h1{margin:0 0 .35rem;font-size:clamp(1.55rem,4vw,1.85rem);font-weight:700;letter-spacing:-.03em;background:linear-gradient(120deg,#f8fafc,#c7d2fe 45%,#67e8f9);-webkit-background-clip:text;background-clip:text;color:transparent}.app .tagline{margin:0;color:var(--muted);font-size:.9rem;max-width:36rem;line-height:1.55}.card{position:relative;background:var(--surface);backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:clamp(1rem,2vw,1.35rem);padding:clamp(1.25rem,2.8vw,2rem) clamp(1.25rem,3vw,2.25rem);border:1px solid var(--border);box-shadow:0 4px 24px #00000059,0 0 0 1px #ffffff0a inset;transition:box-shadow .35s ease,border-color .35s ease}.layout-grid{display:grid;grid-template-columns:1fr;gap:var(--layout-gap);align-items:start}@media (min-width: 900px){.layout-grid{grid-template-columns:minmax(0,1.12fr) minmax(0,.88fr);gap:0;column-gap:var(--layout-gap)}}.panel{min-width:0}.panel-controls{display:flex;flex-direction:column;gap:clamp(.85rem,2vw,1.15rem)}.panel-section{display:flex;flex-direction:column;gap:0}.panel-preview{display:flex;flex-direction:column;gap:clamp(.65rem,1.5vw,.9rem)}@media (min-width: 900px){.panel-preview{padding-left:var(--layout-gap);margin-left:0;border-left:1px solid var(--border);min-height:14rem}}.preview-heading{margin:0 0 .15rem;font-size:.72rem;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:#64748b}.card:focus-within{border-color:#818cf847;box-shadow:0 4px 28px #0006,0 0 0 1px #818cf81f,0 0 40px -12px var(--glow)}.field{display:flex;flex-direction:column;gap:.4rem;margin-bottom:clamp(.85rem,2vw,1.1rem)}.panel-section .field:last-of-type{margin-bottom:clamp(.75rem,2vw,1rem)}.field label{font-size:.78rem;font-weight:600;color:#cbd5e1;letter-spacing:.02em}.field input,.field select{font:inherit;color:var(--text);padding:.65rem .75rem;border-radius:.65rem;border:1px solid rgba(148,163,184,.2);background:#02061773;transition:border-color .2s ease,box-shadow .2s ease,background .2s ease}.field input::placeholder{color:#64748b}.field input:hover:not(:disabled),.field select:hover:not(:disabled){border-color:#94a3b859}.field input:focus,.field select:focus{outline:none;border-color:#818cf8a6;box-shadow:0 0 0 3px #818cf833;background:#020617a6}.field select{cursor:pointer;-webkit-appearance:none;-moz-appearance:none;appearance:none;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%2394a3b8' stroke-width='2'%3E%3Cpath d='M6 9l6 6 6-6'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:right .65rem center;padding-right:2.25rem}.actions-row{display:flex;flex-wrap:wrap;gap:.65rem;align-items:center;margin-top:.15rem}button{font:inherit;cursor:pointer;border-radius:.65rem;border:none;padding:.65rem 1.25rem;font-weight:600;font-size:.9rem;transition:transform .15s ease,box-shadow .2s ease,background .2s ease,opacity .2s ease}button:active:not(:disabled){transform:scale(.97)}button:disabled{cursor:not-allowed;opacity:.45}.btn-primary{background:linear-gradient(135deg,#6366f1,#4f46e5,#4338ca);color:#fff;box-shadow:0 2px 12px #4f46e573,0 0 0 1px #ffffff14 inset}.btn-primary:hover:not(:disabled){background:linear-gradient(135deg,#818cf8,#6366f1 55%,#4f46e5);box-shadow:0 4px 20px #6366f180,0 0 0 1px #ffffff1a inset}.btn-primary:focus-visible{outline:none;box-shadow:0 0 0 3px #818cf873,0 2px 12px #4f46e573}.download-control-row{display:flex;flex-wrap:wrap;gap:.5rem;margin:.65rem 0 .5rem}.btn-cancel{background:#7f1d1d8c;color:#fecaca;border:1px solid rgba(248,113,113,.35)}.btn-cancel:hover:not(:disabled){background:#991b1ba6;color:#fff}.btn-cancel:focus-visible{outline:none;box-shadow:0 0 0 3px #f8717159}.error{margin:0;padding:.75rem .85rem;border-radius:.65rem;background:#7f1d1d59;border:1px solid rgba(248,113,113,.35);color:#fecaca;font-size:.875rem;line-height:1.45}.info-block{margin:0;padding:0;border:none;animation:fade-up .45s ease both}.info-block h2{margin:0 0 .45rem;font-size:1.02rem;font-weight:600;color:#f1f5f9;letter-spacing:-.02em;line-height:1.35}.meta{font-size:.85rem;color:var(--muted);margin:0}.thumb{margin-top:.65rem;width:100%;max-width:100%;border-radius:.75rem;border:1px solid var(--border);box-shadow:0 12px 40px #00000059;transition:transform .35s ease,box-shadow .35s ease;content-visibility:auto}.thumb:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 16px 48px #00000073}.download-panel{margin:0;padding:clamp(1rem,2.5vw,1.2rem) clamp(.9rem,2vw,1.15rem);border-radius:1rem;background:linear-gradient(145deg,#020617bf,#0f172aa6);border:1px solid rgba(129,140,248,.15);box-shadow:0 0 32px -8px #6366f133,0 0 0 1px #ffffff08 inset;animation:fade-up .4s ease both}.download-panel.is-active{border-color:#818cf847;box-shadow:0 0 40px -6px #6366f159,0 0 0 1px #ffffff0a inset}.progress-steps{display:flex;justify-content:space-between;gap:.35rem;margin-bottom:1rem}.progress-step{flex:1;text-align:center;position:relative;min-width:0}.step-bubble{position:relative;z-index:1;display:inline-flex;align-items:center;justify-content:center;width:1.85rem;height:1.85rem;margin:0 auto .35rem;border-radius:50%;font-size:.7rem;font-weight:700;color:#64748b;background:#1e293be6;border:2px solid rgba(148,163,184,.25);transition:color .25s ease,background .25s ease,border-color .25s ease,box-shadow .35s ease,transform .25s ease}.progress-step.done .step-bubble{color:#022c22;background:linear-gradient(145deg,#4ade80,#22c55e);border-color:#4ade8099;box-shadow:0 0 16px #4ade8059}.progress-step.current .step-bubble{color:#fff;background:linear-gradient(145deg,#818cf8,#6366f1);border-color:#a5b4fcd9;box-shadow:0 0 20px #818cf88c;transform:scale(1.06);animation:step-pulse 2s ease-in-out infinite}.step-label{display:block;font-size:.68rem;font-weight:600;color:#64748b;letter-spacing:.03em;text-transform:uppercase;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress-step.done .step-label{color:#86efac}.progress-step.current .step-label{color:#c7d2fe}.progress-head{display:flex;justify-content:space-between;align-items:center;gap:.75rem;margin-bottom:.65rem}.progress-title{font-size:.88rem;font-weight:600;color:#e2e8f0;letter-spacing:-.01em}.progress-pct-pill{flex-shrink:0;min-width:3rem;padding:.25rem .55rem;text-align:center;font-size:.8rem;font-weight:700;font-variant-numeric:tabular-nums;color:#eef2ff;background:#6366f159;border:1px solid rgba(165,180,252,.35);border-radius:999px;box-shadow:0 0 20px #6366f140}.progress-track{position:relative;height:1rem;border-radius:999px;background:#020617a6;box-shadow:inset 0 1px 3px #00000073,0 0 0 1px #94a3b814;overflow:hidden}.progress-track:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;border-radius:inherit;padding:1px;background:linear-gradient(90deg,#818cf826,#22d3ee1f,#818cf826);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:exclude;pointer-events:none}.progress-fill-wrap{position:absolute;top:3px;right:3px;bottom:3px;left:3px;border-radius:inherit;overflow:hidden}.progress-fill{height:100%;width:0%;min-width:0;border-radius:inherit;background:linear-gradient(105deg,#6366f1,#8b5cf6,#22d3ee 70%,#818cf8);background-size:220% 100%;box-shadow:0 0 24px #818cf88c,0 0 12px #22d3ee40;transition:width .35s cubic-bezier(.22,1,.36,1);will-change:width,transform;animation:fill-shimmer 2.8s linear infinite}.progress-track.complete .progress-fill{animation:none;background-size:100% 100%;box-shadow:0 0 28px #4ade8073;background:linear-gradient(105deg,#22c55e,#4ade80,#86efac)}.progress-track.indeterminate .progress-fill{width:38%;min-width:4.5rem;animation:indeterminate-slide 1.25s ease-in-out infinite,fill-shimmer 2.2s linear infinite;transition:none}.progress-track.indeterminate:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:repeating-linear-gradient(-60deg,transparent,transparent 8px,rgba(255,255,255,.04) 8px,rgba(255,255,255,.04) 16px);animation:stripes .7s linear infinite;pointer-events:none;border-radius:inherit}.progress-detail-grid{margin:.85rem 0 0;padding:.75rem .75rem .7rem;display:flex;flex-direction:column;gap:.45rem;border-radius:.65rem;background:#02061773;border:1px solid rgba(148,163,184,.1)}.progress-detail-grid .detail-row{display:grid;grid-template-columns:minmax(5.75rem,7rem) minmax(0,1fr);column-gap:clamp(.65rem,2vw,1.1rem);align-items:baseline;margin:0}.progress-detail-grid .detail-row-span{margin-top:.2rem;padding-top:.5rem;border-top:1px solid rgba(148,163,184,.1)}.progress-detail-grid dt{margin:0;font-size:.68rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:#64748b}.progress-detail-grid dd{margin:0;font-size:.84rem;font-weight:600;font-variant-numeric:tabular-nums;color:#e2e8f0;word-break:break-word}.progress-detail-grid .detail-filename{font-weight:500;font-size:.8rem;color:#94a3b8;line-height:1.35}.done{margin:0;padding:.75rem .9rem;border-radius:.65rem;background:#064e3b66;border:1px solid rgba(74,222,128,.35);color:#bbf7d0;font-size:.875rem;display:flex;align-items:center;gap:.5rem;animation:fade-up .35s ease both}.done:before{content:"";width:1.25rem;height:1.25rem;flex-shrink:0;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%234ade80' stroke-width='2.5'%3E%3Cpath d='M20 6L9 17l-5-5'/%3E%3C/svg%3E") center / contain no-repeat}.inline-status{margin:.2rem 0 0;font-size:.8rem;color:#a5b4fc;display:flex;align-items:center;gap:.45rem}.inline-status:before{content:"";width:.55rem;height:.55rem;border-radius:50%;background:#818cf8;box-shadow:0 0 10px #818cf8;animation:pulse-dot 1s ease-in-out infinite}.preview-empty,.preview-pending,.preview-unavailable{flex:1;display:flex;flex-direction:column;justify-content:center;gap:.45rem;padding:clamp(1rem,3vw,1.75rem) clamp(.75rem,2vw,1rem);border-radius:.85rem;border:1px dashed rgba(148,163,184,.2);background:#02061759;min-height:clamp(10rem,28vw,14rem)}.preview-empty-title,.preview-pending{font-size:.9rem;font-weight:600;color:#cbd5e1}.preview-empty-text{font-size:.82rem;color:var(--muted);line-height:1.5;max-width:22rem}.preview-pending{margin:0;text-align:center;color:#a5b4fc;font-weight:500}.preview-unavailable{margin:0;text-align:center;font-size:.85rem;color:#fca5a5;border-color:#f8717140;background:#450a0a40}.skeleton-block{margin:0;padding:0;border:none;display:flex;flex-direction:column;gap:.65rem}.skel{border-radius:.5rem;background:linear-gradient(100deg,#1e293b99 20%,#334155bf,#1e293b99 60%);background-size:200% 100%;animation:shimmer 1.2s ease-in-out infinite}.skel-title{height:1.1rem;width:72%;margin-bottom:.65rem}.skel-line{height:.72rem;width:100%;margin-bottom:.45rem}.skel-line.short{width:42%}.skel-thumb{order:-1;height:clamp(140px,22vw,200px);width:100%;max-width:none;margin:0 0 .25rem}@keyframes fade-up{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}@keyframes fill-shimmer{0%{background-position:100% 0}to{background-position:0% 0}}@keyframes indeterminate-slide{0%{transform:translate(-100%)}to{transform:translate(265%)}}@keyframes stripes{to{transform:translate(16px)}}@keyframes step-pulse{0%,to{box-shadow:0 0 20px #818cf88c}50%{box-shadow:0 0 28px #818cf8bf}}@keyframes pulse-dot{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.85)}}@media (max-width: 899px){.panel-preview{margin-top:clamp(.35rem,1.2vw,.65rem);padding-top:var(--layout-gap);border-top:1px solid var(--border)}}@media (prefers-reduced-motion: reduce){.thumb:hover{transform:none}.progress-fill{animation:none}.progress-track.indeterminate .progress-fill{animation:none;opacity:.85}.progress-track.indeterminate:after{animation:none}.progress-step.current .step-bubble{animation:none}.inline-status:before{animation:none}.info-block,.download-panel,.done{animation:none}.skel{animation:none;background:#1e293b99}}:root{font-family:Plus Jakarta Sans,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5;font-weight:400;color:#e2e8f0;background-color:#060a12;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}*,*:before,*:after{box-sizing:border-box}body{margin:0;min-height:100vh;color-scheme:dark}#root{min-height:100vh}