:root{--ink:#171717;--muted:#77756f;--line:#e9e8e3;--paper:#fff;--soft:#f6f6f3;--green:#cdfc52;--green-dark:#bff03b;--orange:#ff6c36;--sidebar:244px;--radius:18px}*{box-sizing:border-box}html{font-size:16px}body{margin:0;background:var(--soft);color:var(--ink);font-family:"DM Sans",system-ui,sans-serif;min-width:320px}button,input,select{font:inherit}.app-shell{min-height:100vh;display:grid;grid-template-columns:var(--sidebar) 1fr}.sidebar{position:fixed;inset:0 auto 0 0;width:var(--sidebar);background:#181818;color:#fff;padding:26px 18px 18px;display:flex;flex-direction:column;z-index:10}.brand{display:flex;align-items:center;gap:10px;color:#fff;text-decoration:none;font:800 27px/1 "Manrope",sans-serif;letter-spacing:-1.6px;padding:0 8px 29px}.brand svg{width:29px;fill:var(--green)}.brand-cut{fill:none;stroke:#181818;stroke-width:3.2;stroke-linecap:round;stroke-linejoin:round}.new-video{width:100%;border:0;border-radius:11px;background:var(--green);color:#151515;display:grid;grid-template-columns:28px 1fr auto;align-items:center;text-align:left;padding:10px 11px;font-weight:700;cursor:pointer;transition:.2s}.new-video:hover{background:#dbff75;transform:translateY(-1px)}.plus{width:25px;height:25px;background:#111;color:#fff;display:grid;place-items:center;border-radius:7px;font-size:19px;font-weight:400}.new-video kbd{font-family:inherit;font-size:11px;background:#a9d72f;padding:3px 6px;border-radius:5px}nav{margin-top:24px;display:grid;gap:5px}.nav-item{border:0;background:transparent;color:#aaa9a5;border-radius:9px;padding:10px;display:flex;align-items:center;gap:12px;text-align:left;cursor:pointer;font-weight:600}.nav-item:hover{background:#282828;color:#fff}.nav-item svg,.source-tab svg,.privacy-note svg{width:19px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round}.sidebar-spacer{flex:1}.credit-card{border:1px solid #373737;background:#222;border-radius:13px;padding:14px;margin-bottom:9px}.credit-row{display:flex;justify-content:space-between;font-size:12px;color:#aaa}.credit-row span{color:#fff;font-weight:700}.meter{height:5px;background:#3c3c3c;border-radius:6px;margin:11px 0}.meter i{display:block;width:36%;height:100%;background:var(--green);border-radius:6px}.credit-card button{border:0;background:transparent;color:var(--green);padding:0;font-size:13px;font-weight:700;cursor:pointer}.profile-button{border:0;background:transparent;color:#fff;border-radius:10px;padding:9px 6px;display:flex;gap:9px;align-items:center;text-align:left;cursor:pointer}.profile-button:hover{background:#252525}.avatar{width:34px;height:34px;border-radius:50%;background:#f0b59e;color:#402014;display:grid;place-items:center;font-weight:800;font-size:12px}.profile-copy{display:grid;gap:2px;min-width:0}.profile-copy strong{font-size:13px}.profile-copy small{font-size:11px;color:#858585;overflow:hidden;text-overflow:ellipsis}.dots{margin-left:auto;color:#777;letter-spacing:1px}main{grid-column:2;min-height:100vh}.topbar{height:68px;background:rgba(246,246,243,.88);backdrop-filter:blur(12px);border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;padding:0 34px;position:sticky;top:0;z-index:5}.crumb{display:flex;gap:10px;align-items:center;font-size:14px}.crumb span,.crumb b{color:#aaa;font-weight:500}.top-actions{display:flex;gap:8px}.icon-button,.mobile-menu{width:36px;height:36px;border:1px solid #dfded9;background:#fff;border-radius:10px;cursor:pointer;font-weight:700}.bell{position:relative}.bell span{position:absolute;width:6px;height:6px;border-radius:50%;background:var(--orange);right:7px;top:7px}.mobile-menu{display:none}.workspace{max-width:800px;margin:0 auto;padding:70px 32px 55px}.intro{text-align:center;margin-bottom:31px}.eyebrow{font:800 11px/1 "Manrope",sans-serif;letter-spacing:1.8px;color:#84827b}.intro h1,.processing-card h1,.placeholder-view h1{font:800 clamp(34px,5vw,52px)/1.04 "Manrope",sans-serif;letter-spacing:-2.5px;margin:15px 0 13px}.intro p{max-width:640px;margin:auto;color:#6f6d67;font-size:17px;line-height:1.55}.creator-card{background:#fff;border:1px solid #e4e3de;border-radius:22px;box-shadow:0 18px 55px rgba(26,26,24,.07);padding:12px}.source-tabs{display:grid;grid-template-columns:1fr 1fr;background:#f2f2ef;border-radius:12px;padding:4px;gap:4px}.source-tab{height:45px;border:0;background:transparent;color:#777;border-radius:9px;font-weight:700;display:flex;justify-content:center;align-items:center;gap:8px;cursor:pointer}.source-tab.selected{background:#fff;color:#191919;box-shadow:0 2px 8px rgba(0,0,0,.07)}.source-panel{padding:27px 14px 21px}.source-panel>label,.option-field>span{display:block;font-size:13px;font-weight:700;margin-bottom:9px}.url-field{height:59px;border:1.5px solid #d4d3cd;border-radius:12px;display:flex;align-items:center;padding:0 8px 0 16px;transition:.2s}.url-field:focus-within{border-color:#171717;box-shadow:0 0 0 3px rgba(205,252,82,.42)}.youtube-mark{color:#fa3c32;font-size:14px;margin-right:12px}.url-field input{border:0;outline:0;flex:1;min-width:0;font-size:15px}.paste-btn{border:0;background:#f0f0ed;border-radius:8px;padding:8px 12px;font-size:13px;font-weight:700;cursor:pointer}.supported{display:flex;align-items:center;gap:7px;flex-wrap:wrap;margin-top:13px;color:#aaa;font-size:11px}.supported b{font-weight:600;color:#8c8a84;border:1px solid #e8e7e2;border-radius:20px;padding:4px 8px}.upload-panel{padding-bottom:19px}.drop-zone{width:100%;height:151px;border:1.5px dashed #cbc9c1;background:#fafaf8;border-radius:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;cursor:pointer;color:#171717}.drop-zone.dragging{border-color:#101010;background:#f1ffd0}.drop-zone>span:last-child{color:#888;font-size:13px}.upload-icon{width:39px;height:39px;display:grid;place-items:center;background:#fff;border:1px solid #e4e3df;border-radius:11px;margin-bottom:3px}.upload-icon svg{width:22px;fill:none;stroke:#111;stroke-width:1.8}.options-grid{border-top:1px solid var(--line);display:grid;grid-template-columns:1.35fr 1fr 1fr;gap:10px;padding:21px 14px 10px}.option-field select{width:100%;height:45px;border:1px solid #dfded9;border-radius:10px;background:#fff;padding:0 12px;color:#333;outline:none}.feature-row{display:grid;grid-template-columns:1fr 1fr;gap:10px;padding:0 14px 20px}.check-card{border:1px solid #e4e3df;border-radius:11px;padding:12px;display:flex;gap:10px;align-items:center;cursor:pointer}.check-card input{position:absolute;opacity:0}.check{width:21px;height:21px;border-radius:6px;background:#181818;position:relative;flex:none}.check:after{content:"✓";position:absolute;color:var(--green);font-size:13px;left:5px;top:1px}.check-card input:not(:checked)+.check{background:#fff;border:1px solid #ccc}.check-card input:not(:checked)+.check:after{display:none}.check-card strong,.check-card small{display:block}.check-card strong{font-size:13px}.check-card small{font-size:11px;color:#96938c;margin-top:2px}.generate-button{width:calc(100% - 28px);margin:0 14px;height:54px;border:0;border-radius:12px;background:#181818;color:#fff;font-weight:800;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:10px;transition:.2s}.generate-button:hover{background:#2d2d2d;transform:translateY(-1px)}.generate-button .sparkle{color:var(--green);font-size:18px}.generate-button .arrow{position:absolute;margin-left:610px}.generation-note{text-align:center;color:#aaa;font-size:12px;margin:11px 0 4px}.privacy-note{display:flex;justify-content:center;align-items:center;gap:7px;color:#97958f;font-size:12px;margin-top:20px}.privacy-note svg{width:14px}.hidden{display:none!important}.processing-view{max-width:780px;padding-top:110px}.processing-card{text-align:center}.processing-art{width:130px;height:130px;margin:0 auto 29px;position:relative;background:#202020;border-radius:28px;display:grid;place-items:center;overflow:hidden;box-shadow:0 18px 42px rgba(0,0,0,.16)}.video-frame{width:58px;height:85px;border:2px solid var(--green);border-radius:8px;position:relative}.video-frame span,.video-frame i,.video-frame b{position:absolute;left:8px;height:5px;border-radius:5px;background:#fff}.video-frame span{bottom:26px;width:40px}.video-frame i{bottom:17px;width:31px}.video-frame b{bottom:8px;width:36px}.scan-line{position:absolute;width:85px;height:2px;background:var(--green);box-shadow:0 0 11px var(--green);animation:scan 1.8s ease-in-out infinite}@keyframes scan{0%,100%{transform:translateY(-42px)}50%{transform:translateY(42px)}}.processing-card h1{font-size:38px;letter-spacing:-1.8px}.processing-card p{color:#777}.progress-track{height:10px;background:#e5e5e0;border-radius:10px;overflow:hidden;margin-top:31px}.progress-track i{display:block;width:0;height:100%;background:var(--green-dark);transition:width .5s}.progress-meta{display:flex;justify-content:space-between;margin-top:9px;font-size:13px;color:#8d8b84}.progress-meta span:first-child{font-weight:800;color:#333}.process-steps{display:flex;justify-content:center;gap:26px;margin-top:35px;font-size:13px;color:#aaa}.process-steps .done{color:#333}.results-view{padding:46px clamp(24px,4vw,64px) 70px;max-width:1400px;margin:auto}.results-header{display:flex;justify-content:space-between;align-items:end;gap:20px}.results-header h1{font:800 40px/1.1 "Manrope";letter-spacing:-1.8px;margin:9px 0}.results-header p{color:#85827b;margin:0}.back-button{border:0;background:transparent;padding:0;color:#777;cursor:pointer;font-weight:600}.result-actions{display:flex;gap:9px}.secondary-button,.dark-button{height:42px;border-radius:10px;padding:0 16px;font-weight:700;cursor:pointer}.secondary-button{background:#fff;border:1px solid #deddd8}.dark-button{background:#181818;color:#fff;border:0}.results-toolbar{display:flex;justify-content:space-between;align-items:center;margin:37px 0 17px}.score-key{font-size:13px;color:#777}.score-key i{display:inline-block;width:8px;height:8px;background:var(--green-dark);border-radius:50%;margin-right:7px}.results-toolbar select{border:1px solid #deddd8;border-radius:9px;background:#fff;padding:9px 13px}.clips-grid{display:grid;grid-template-columns:repeat(5,minmax(190px,1fr));gap:16px}.clip-card{background:#fff;border:1px solid #e1e0db;border-radius:15px;overflow:hidden;box-shadow:0 7px 25px rgba(0,0,0,.04);transition:.2s}.clip-card:hover{transform:translateY(-3px);box-shadow:0 12px 30px rgba(0,0,0,.09)}.clip-preview{aspect-ratio:9/14;background:linear-gradient(160deg,var(--tone1),var(--tone2));position:relative;display:flex;align-items:center;justify-content:center;overflow:hidden}.clip-preview:before{content:"";position:absolute;width:150%;height:48%;bottom:-9%;background:rgba(0,0,0,.34);transform:rotate(-8deg)}.person{width:58%;height:72%;position:absolute;bottom:0;background:linear-gradient(#d6a07c 0 23%,#242424 23%);border-radius:48% 48% 10% 10%}.caption{z-index:2;align-self:flex-end;margin-bottom:16%;text-align:center;font:800 16px/1.15 "Manrope";color:#fff;text-shadow:0 2px 10px #000}.caption span,.caption b{display:block}.caption b{color:var(--green);font-size:20px}.score{position:absolute;top:10px;left:10px;z-index:2;background:rgba(18,18,18,.85);color:#fff;padding:6px 8px;border-radius:7px;font-size:11px;font-weight:700}.score strong{color:var(--green);font-size:13px}.duration{position:absolute;right:10px;bottom:10px;z-index:2;background:rgba(0,0,0,.7);color:#fff;padding:4px 6px;border-radius:5px;font-size:11px}.clip-info{padding:13px}.clip-info h3{font-size:14px;line-height:1.35;margin:0 0 9px;min-height:38px}.clip-buttons{display:grid;grid-template-columns:1fr 38px;gap:7px}.clip-buttons button{height:36px;border-radius:8px;border:1px solid #deddd8;background:#fff;font-size:12px;font-weight:700;cursor:pointer}.clip-buttons button:first-child{background:#1b1b1b;color:#fff;border-color:#1b1b1b}.placeholder-view{text-align:center;padding-top:150px}.placeholder-view .empty-icon{font-size:48px}.placeholder-view p{color:#777;margin-bottom:25px}.toast{position:fixed;right:25px;bottom:25px;background:#181818;color:#fff;padding:13px 18px;border-radius:10px;box-shadow:0 10px 35px rgba(0,0,0,.2);font-weight:600;font-size:13px;transform:translateY(80px);opacity:0;transition:.3s;z-index:40}.toast.show{transform:translateY(0);opacity:1}.modal-backdrop{position:fixed;inset:0;background:rgba(0,0,0,.57);backdrop-filter:blur(5px);z-index:50;display:grid;place-items:center;padding:24px}.modal{background:#fff;border-radius:20px;max-width:760px;width:100%;display:grid;grid-template-columns:330px 1fr;position:relative;overflow:hidden}.modal-close{position:absolute;right:13px;top:13px;width:32px;height:32px;border:0;border-radius:50%;background:#efefec;font-size:21px;cursor:pointer;z-index:3}.modal-preview{min-height:530px;background:linear-gradient(155deg,#774ab2,#111);display:flex;justify-content:center;position:relative;overflow:hidden}.modal-preview:before{content:"";width:64%;height:68%;position:absolute;bottom:0;background:linear-gradient(#d39a76 0 22%,#171717 22%);border-radius:45% 45% 0 0}.modal-content{padding:60px 34px 30px}.modal-content h2{font:800 28px/1.1 "Manrope";letter-spacing:-1px}.modal-content label{font-size:13px;font-weight:700}.modal-content input{display:block;width:100%;height:46px;margin-top:8px;border:1px solid #dddcd7;border-radius:9px;padding:0 12px}.edit-options{display:flex;gap:7px;margin:20px 0}.edit-options button{border:1px solid #dddcd7;background:#fff;border-radius:8px;padding:8px 10px;font-size:12px;font-weight:700}.edit-options button.selected{background:#eaffad;border-color:#bee447}.modal-content .generate-button{width:100%;margin:35px 0 0}.menu-open .sidebar{transform:translateX(0)}@media(max-width:1180px){.clips-grid{grid-template-columns:repeat(3,minmax(190px,1fr))}}@media(max-width:800px){.app-shell{display:block}.sidebar{transform:translateX(-102%);transition:.25s;box-shadow:10px 0 40px rgba(0,0,0,.25)}main{grid-column:auto}.mobile-menu{display:block}.topbar{padding:0 18px}.workspace{padding:46px 18px}.intro h1{font-size:36px}.creator-card{padding:9px}.options-grid{grid-template-columns:1fr}.feature-row{grid-template-columns:1fr}.generate-button .arrow{position:static;margin-left:auto}.generate-button{padding:0 17px}.results-view{padding:32px 18px}.results-header{align-items:flex-start;flex-direction:column}.clips-grid{grid-template-columns:repeat(2,minmax(150px,1fr))}.modal{grid-template-columns:1fr;max-height:90vh;overflow:auto}.modal-preview{min-height:320px}.modal-content{padding:30px 24px}.process-steps{flex-direction:column;gap:9px}.crumb span,.crumb b{display:none}}@media(max-width:480px){.source-tabs{grid-template-columns:1fr}.supported b:nth-last-child(-n+2){display:none}.clips-grid{grid-template-columns:1fr 1fr;gap:10px}.clip-info{padding:10px}.result-actions{width:100%}.result-actions button{flex:1}.results-header h1{font-size:33px}.modal-backdrop{padding:10px}}