@import"https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;700&family=Space+Grotesk:wght@500;600;700&display=swap";:root{font-family:DM Sans,system-ui,sans-serif;color:#f5f5f7;background:#101116;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;background:radial-gradient(ellipse at 50% -10%,#25213c,#101116 47%);min-height:100vh}.app-shell{max-width:720px;margin:0 auto;padding:22px 18px 36px}.topbar{display:flex;align-items:center;gap:11px;padding:2px 0 25px}.brand-mark{width:43px;height:43px;border-radius:14px;display:grid;place-items:center;color:#171321;background:linear-gradient(135deg,#d9b8ff,#9c7bff)}.brand-name{font:700 21px Space Grotesk,sans-serif;letter-spacing:-.7px}.brand-name span{color:#bba2ff}.brand-sub{font-size:9px;letter-spacing:1.7px;color:#8d8b9b;margin-top:2px}.local-pill{margin-left:auto;border:1px solid #30313b;background:#1a1b22;border-radius:99px;padding:7px 11px;font-size:11px;color:#c4c2ce;display:flex;align-items:center;gap:7px}.local-pill span{width:6px;height:6px;background:#7be0b0;border-radius:50%}.hero{padding:18px 0 25px}.eyebrow{font-size:10px;letter-spacing:1.7px;color:#b8a3ff;display:flex;align-items:center;gap:7px;font-weight:700}.hero h1{font:700 clamp(34px,8vw,49px)/1.08 "Space Grotesk",sans-serif;letter-spacing:-1.7px;margin:17px 0 12px}.hero h1 span{color:#b8a3ff}.hero p{color:#a8a7b5;font-size:14px;line-height:1.6;margin:0}.panel{border:1px solid #2b2b37;background:linear-gradient(145deg,#1f1f2af5,#17171ff7);border-radius:21px;padding:19px;margin:0 0 15px;box-shadow:0 12px 35px #00000012}.section-title{display:flex;align-items:center;gap:11px;margin-bottom:19px}.icon-box{width:39px;height:39px;border-radius:12px;background:#332d4b;color:#c3b0ff;display:grid;place-items:center;flex-shrink:0}.section-title h2{font:600 16px Space Grotesk,sans-serif;margin:0 0 4px}.section-title p{font-size:11px;color:#92919f;margin:0;line-height:1.5}.dropzone{width:100%;min-height:153px;border:1px dashed #5a4b80;border-radius:15px;background:#242132;color:#f5f2ff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;cursor:pointer}.upload-icon{width:43px;height:43px;display:grid;place-items:center;border-radius:13px;background:#40355f;color:#c7b7ff}.dropzone strong{font-size:13px}.dropzone span{font-size:10px;color:#aaa5bc;text-align:center;padding:0 8px}.file-card{display:flex;align-items:center;gap:10px;padding:12px;background:#252531;border-radius:13px}.file-icon{width:42px;height:42px;border-radius:11px;background:#39304e;color:#c8b4ff;display:grid;place-items:center;flex-shrink:0}.file-meta{min-width:0;flex:1}.file-meta strong{display:block;font-size:12px;overflow-wrap:anywhere}.file-meta span{display:block;color:#a09eae;font-size:10px;margin-top:5px}.icon-button{background:none;border:0;color:#aaa7b8;padding:7px}.preview{width:100%;max-height:300px;object-fit:contain;background:#08080b;border-radius:12px;margin-top:12px}.field-label{display:block;color:#c9c7d3;font-size:12px;font-weight:600;margin:17px 0 9px}.segmented{display:grid;grid-template-columns:repeat(4,1fr);gap:6px}.segmented button{background:#22222c;border:1px solid #353541;color:#b7b5c3;border-radius:10px;padding:11px 3px;font-size:11px;font-weight:600}.segmented button.active{background:#3a3156;border-color:#a58aff;color:#e3d8ff}.mode-card{display:flex;align-items:flex-start;gap:10px;padding:12px;background:#252331;border:1px solid #403653;border-radius:13px}.mode-symbol{width:32px;height:32px;display:grid;place-items:center;border-radius:10px;background:#3b3155;color:#c5b0ff;flex-shrink:0}.mode-copy{flex:1}.mode-copy strong{font-size:12px}.mode-copy p{font-size:10px;color:#a8a5b7;line-height:1.55;margin:5px 0 0}.mode-tag{font-size:8px;letter-spacing:.8px;color:#9ee4c0;background:#23392f;padding:5px 6px;border-radius:6px}.select{width:100%;background:#22222c;color:#e5e3ed;border:1px solid #393945;border-radius:11px;padding:12px;font:inherit;font-size:12px;outline:none}.primary-button{display:flex;justify-content:center;align-items:center;gap:9px;width:100%;padding:14px;border:0;border-radius:12px;margin-top:21px;background:linear-gradient(100deg,#c6adff,#9a80ff);color:#171321;font-weight:700;font-size:13px;cursor:pointer}.primary-button:disabled{opacity:.5;cursor:not-allowed}.secondary-button{width:100%;padding:11px;border:1px solid #49414e;background:#28232e;color:#e8dfea;border-radius:11px;margin-top:8px}.progress-wrap{margin-top:17px}.progress-heading{display:flex;justify-content:space-between;gap:12px;font-size:10px;color:#a5a3b1;margin-bottom:8px}.progress-heading strong{color:#d5c8ff}.progress-track{height:5px;background:#35333e;border-radius:99px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,#a58aff,#e1b7ff);transition:width .25s}.error-box{display:flex;align-items:flex-start;gap:8px;margin-top:12px;padding:11px;border-radius:10px;background:#42282c;color:#ffb9be;font-size:11px;line-height:1.5}.empty-state{border:1px dashed #393844;border-radius:14px;padding:24px 16px;display:flex;align-items:center;flex-direction:column;text-align:center;gap:8px}.empty-icon{width:44px;height:44px;border-radius:14px;background:#292633;color:#9d94b6;display:grid;place-items:center;margin-bottom:3px}.empty-state strong{font-size:12px}.empty-state span{font-size:10px;color:#92909f;line-height:1.5;max-width:260px}.zip-button{margin:0 0 12px}.clip-list{display:flex;flex-direction:column;gap:8px}.clip-item{display:flex;align-items:center;gap:11px;padding:11px;background:#24242e;border-radius:12px}.clip-number{width:37px;height:37px;border-radius:10px;background:#3a3152;color:#d4c5ff;display:grid;place-items:center;font:600 13px Space Grotesk,sans-serif}.clip-info{flex:1;min-width:0}.clip-info strong{display:block;font-size:11px}.clip-info span{display:flex;align-items:center;gap:5px;color:#9d9baa;font-size:10px;margin-top:5px}.download-link{width:35px;height:35px;border-radius:10px;background:#38314d;color:#d1bfff;display:grid;place-items:center;text-decoration:none}.privacy-note{display:flex;gap:9px;align-items:flex-start;padding:14px 4px;color:#9b9aa8;font-size:10px;line-height:1.6}.privacy-note svg{color:#8ad8b2;flex-shrink:0;margin-top:1px}.privacy-note strong{color:#c9c6d4}footer{text-align:center;font-size:10px;color:#777583;padding:14px 0 8px}footer span{color:#b5a1ff;padding:0 4px}.fine-print{text-align:center;font-size:9px;line-height:1.6;color:#666573;max-width:480px;margin:0 auto}.spin{animation:spin 1s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(min-width:600px){.app-shell{padding-top:32px}.panel{padding:23px}.hero{padding-top:24px}}
