:root{color-scheme:dark;--bg:#101114;--panel:#191a1f;--line:#2b2d34;--muted:#92949e;--text:#f5f5f6;--accent:#c7f36b;--accent-dark:#a8d84c;--red:#ff7777}
*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;min-height:100vh;overflow-x:hidden}
.ambient{position:fixed;pointer-events:none;filter:blur(100px);opacity:.11;border-radius:50%;z-index:-1}.ambient-one{width:380px;height:380px;background:#b7ec59;top:80px;left:-240px}.ambient-two{width:340px;height:340px;background:#7a83b8;right:-240px;top:520px}
.shell{width:min(760px,100%);margin:0 auto;padding:0 25px calc(38px + env(safe-area-inset-bottom))}
.topbar{height:82px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ffffff10}.brand{display:flex;align-items:center;gap:10px;color:var(--text);font-size:20px;font-weight:750;letter-spacing:-.8px;text-decoration:none}.brand-mark,.brand-mini{display:grid;place-items:center;background:var(--accent);color:#171a10;font-weight:900;border-radius:10px;width:29px;height:29px;font-size:17px}.brand-dot{color:var(--accent)}.platform-pill,.secure,.ready-pill{font-size:9px;letter-spacing:1.35px;color:#b8bac2;font-weight:700}.pulse{display:inline-block;width:6px;height:6px;border-radius:50%;background:var(--accent);margin:0 7px 1px 0;box-shadow:0 0 10px #c7f36b88}
.hero{padding:58px 0 34px}.eyebrow,.step-label{font-size:10px;letter-spacing:1.8px;font-weight:800;color:var(--accent)}.eyebrow-line{display:inline-block;width:23px;height:1px;background:var(--accent);vertical-align:middle;margin:0 8px 3px 0}h1{font-size:clamp(43px,8vw,68px);line-height:.99;letter-spacing:-3.8px;margin:19px 0 16px;font-weight:760}h1 span{color:var(--accent)}.intro{max-width:470px;color:#a6a7af;line-height:1.65;font-size:14px;margin:0}
.panel{background:linear-gradient(145deg,#1c1d22,#17181c);border:1px solid #ffffff12;border-radius:19px;padding:25px;margin-bottom:28px;box-shadow:0 20px 60px #0002}.panel-heading,.library-heading{display:flex;justify-content:space-between;align-items:center;margin-bottom:25px}.panel h2,.library-heading h2{font-size:20px;letter-spacing:-.6px;margin:7px 0 0}.secure{font-size:8px;color:#8e9098}.secure span{color:var(--accent);font-size:10px;margin-right:4px}
.field-label{display:block;font-size:9px;font-weight:800;letter-spacing:1.5px;color:#a7a9b1;margin:0 0 9px}.url-row{display:flex;gap:8px}input[type=url]{width:100%;min-width:0;background:#101115;border:1px solid #34363d;border-radius:10px;padding:15px 14px;color:white;font:inherit;font-size:13px;outline:none}input[type=url]:focus{border-color:#a9d957}.secondary-btn{border:1px solid #3a3c43;background:#25262c;color:#eee;border-radius:10px;padding:0 17px;font-weight:650;font-size:12px}.hint{font-size:11px;line-height:1.55;color:#858791;margin:10px 0 0}.or-divider{display:flex;align-items:center;gap:12px;color:#696b74;font-size:9px;font-weight:700;letter-spacing:1px;margin:22px 0}.or-divider:before,.or-divider:after{content:"";height:1px;background:#303139;flex:1}
.upload-zone{min-height:112px;border:1px dashed #484a52;border-radius:12px;display:flex;align-items:center;justify-content:center;flex-direction:column;gap:6px;background:#ffffff03;cursor:pointer;text-align:center}.upload-zone:active{background:#c7f36b0c}.upload-zone input{display:none}.upload-icon{width:26px;height:26px;border-radius:8px;background:#c7f36b18;color:var(--accent);display:grid;place-items:center;font-size:18px}.upload-title{font-size:12px;font-weight:700}.upload-subtitle{font-size:10px;color:#81838d}
.primary-btn{margin-top:17px;width:100%;border:0;border-radius:10px;background:var(--accent);color:#171a10;font-weight:850;font-size:11px;letter-spacing:.7px;padding:16px 18px;display:flex;align-items:center;justify-content:space-between;cursor:pointer;transition:background .15s,transform .15s}.primary-btn:hover{background:#d6ff85}.primary-btn:active{transform:scale(.99)}.primary-btn:disabled{opacity:.55;cursor:wait}.error{color:var(--red);font-size:12px;margin:12px 0 0}
.preview-panel{padding-bottom:22px}.ready-pill{color:var(--accent);font-size:9px}.video-frame{background:#08090b;border-radius:12px;overflow:hidden;aspect-ratio:16/9;display:grid;place-items:center}.video-frame video{width:100%;height:100%;object-fit:contain}.video-details{display:flex;justify-content:space-between;align-items:center;padding:16px 1px 8px}.video-copy h3{font-size:14px;margin:0 0 5px;max-width:470px;overflow-wrap:anywhere}.video-copy p{font-size:10px;color:#898b95;margin:0}.format-tag{border:1px solid #41434a;border-radius:6px;padding:6px 8px;font-size:8px;color:#c2c4ca;font-weight:800;letter-spacing:1px}.save-btn{justify-content:center;gap:12px}.save-note{text-align:center;margin-top:10px}.status{font-size:11px;text-align:center;color:var(--accent);min-height:14px;margin:9px 0 0}.progress-wrap{margin-top:16px}.progress-head{display:flex;justify-content:space-between;font-size:10px;color:#aeb0b8;margin-bottom:7px}.progress-track{height:4px;background:#33353c;border-radius:10px;overflow:hidden}.progress-track div{height:100%;width:0;background:var(--accent);transition:width .2s}
.library-section{padding:10px 0 30px}.library-heading{margin-bottom:17px}.library-heading h2{font-size:19px}.text-btn{background:none;border:0;color:#aeb0b7;font-size:10px;cursor:pointer}.history-list{display:flex;flex-direction:column;gap:9px}.empty-state{border:1px solid #ffffff10;border-radius:13px;padding:25px;text-align:center;color:#8d8f98}.empty-icon{font-size:22px;color:#646771}.empty-state p{font-size:12px;color:#d1d2d6;margin:8px 0 5px}.empty-state span:last-child{font-size:10px}.history-item{display:flex;align-items:center;gap:12px;padding:11px;background:#191a1f;border:1px solid #ffffff10;border-radius:11px}.history-thumb{width:66px;height:47px;flex-shrink:0;background:#292b31;border-radius:6px;display:grid;place-items:center;color:var(--accent);font-size:18px;overflow:hidden}.history-thumb img{width:100%;height:100%;object-fit:cover}.history-info{min-width:0;flex:1}.history-info strong{display:block;font-size:11px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.history-info span{display:block;font-size:9px;color:#858791;margin-top:5px}.history-action{border:1px solid #41434a;background:#25262b;color:#e6e6e8;padding:8px 10px;border-radius:7px;font-size:9px;font-weight:700}
footer{border-top:1px solid #ffffff12;padding-top:18px;display:flex;align-items:center;gap:9px;color:#70727b;font-size:8px;letter-spacing:1px}.brand-mini{width:19px;height:19px;border-radius:6px;font-size:11px}.footer-right{margin-left:auto;letter-spacing:0;text-align:right;font-size:9px}
@media(max-width:520px){.shell{padding-left:18px;padding-right:18px}.topbar{height:70px}.hero{padding-top:47px}.panel{padding:19px;border-radius:15px}.secure{font-size:7px}.footer-right{max-width:145px}.url-row{gap:6px}.secondary-btn{padding:0 12px}}

.youtube-frame iframe{width:100%;height:100%;border:0}
.youtube-notice{margin-top:16px;padding:14px 15px;background:#ffffff06;border:1px solid #ffffff12;border-radius:10px}
.youtube-notice strong{font-size:12px;color:#f2f2f3}
.youtube-notice p{font-size:11px;line-height:1.6;color:#999ba4;margin:7px 0 9px}
.youtube-notice a{font-size:11px;color:var(--accent);font-weight:750;text-decoration:none}
.youtube-notice a:hover{text-decoration:underline}