*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{color:#e0e0e6;display:flex;background:#0f1117;flex-direction:column;align-items: center;min-height:100vh;padding:2rem 1rem;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Noto Sans,Ubuntu,Cantarell,Helvetica Neue,sans-serif}.card{background:#1a1b26;border:1px solid #2a2b3a;border-radius:12px;width:100%;max-width:600px;padding:2rem}h1{margin-bottom:.25rem;font-size:1.5rem}.subtitle{color:#888;margin-bottom:1.5rem;font-size:.9rem}.card.loading .mode-toggle,.card.loading #gen-form,.card.loading .progress-wrap,.card.loading .error-msg,.card.loading .results{display:none}.skeleton{display:flex;flex-direction:column;gap:1.25rem}.card:not(.loading) .skeleton{display:none}.skel-row{position:relative;overflow:hidden;background:#12131d;border-radius:6px}.skel-row:after{content:"";position:absolute;animation:skel-shimmer 1.2s ease-in-out infinite;background:linear-gradient(90deg,#0000,#ffffff0a,#0000);inset:0}@keyframes skel-shimmer{0%{transform:translate(-100%)}to{transform:translate(100%)}}.skel-toggle{border-radius:8px;height:36px}.skel-field{height:56px}.skel-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem}.skel-input{height:56px}.skel-btn{border-radius:8px;height:42px}.mode-toggle{display:flex;overflow:hidden;background:#12131d;border-radius:8px;margin-bottom:1.5rem}.mode-btn{color:#888;cursor:pointer;background:0 0;border:none;flex:1;padding:.5rem;transition:background .15s,color .15s;font-size:.9rem;font-weight:600}.mode-btn.active{color:#fff;background:#6c63ff}.form-grid{display:grid;grid-template-columns:1fr 1fr 1fr;gap:1rem;margin-bottom:1.5rem}.form-grid.two-col{grid-template-columns:1fr 1fr}label{display:flex;color:#aaa;flex-direction:column;gap:.35rem;font-size:.85rem}input[type=number]{color:#e0e0e6;background:#12131d;border:1px solid #333;border-radius:6px;width:100%;padding:.5rem .65rem;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:1rem}input[type=number]:focus,select:focus{outline:none;border-color:#6c63ff}select{color:#e0e0e6;background:#12131d;border:1px solid #333;border-radius:6px;width:100%;padding:.5rem .65rem;font-family:SF Mono,Fira Code,Consolas,monospace;font-size:1rem}.format-label{display:flex;color:#aaa;flex-direction:column;gap:.35rem;margin-bottom:1.5rem;font-size:.85rem}button#generate{color:#fff;cursor:pointer;background:#6c63ff;border:none;border-radius:8px;width:100%;padding:.7rem;transition:background .15s;font-size:1rem;font-weight:600}button#generate:hover:not(:disabled){background:#5a52e0}button#generate:disabled{opacity:.5;cursor:not-allowed}.progress-wrap{display:none;margin-top:1rem}.progress-wrap.visible{display:block}progress{appearance:none;-webkit-appearance:none;border-radius:4px;width:100%;height:8px}progress::-webkit-progress-bar{background:#12131d;border-radius:4px}progress::-webkit-progress-value{background:#6c63ff;border-radius:4px}progress::-moz-progress-bar{background:#6c63ff;border-radius:4px}.results{display:none;opacity:0;margin-top:1.5rem;transition:opacity .3s}.results.visible{display:block;opacity:1}.results video,.results img#preview-img{display:block;background:#000;max-width:100%;margin:0 auto .75rem}a.download-btn{display:inline-block;color:#fff;text-decoration:none;background:#2d8c5a;border-radius:6px;padding:.5rem 1.2rem;transition:background .15s;font-size:.9rem;font-weight:600}a.download-btn:hover{background:#247a4d}.error-msg{color:#f06060;display:none;margin-top:1rem;font-size:.9rem}.error-msg.visible{display:block}@media (max-width:500px){.form-grid,.form-grid.two-col{grid-template-columns:1fr}}