:root{color-scheme:light;font-family:Inter,ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;color:#151923;background:#f4f6f8;font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;--ink: #151923;--ink-soft: #293140;--muted: #687386;--subtle: #929caf;--canvas: #f4f6f8;--panel: #ffffff;--panel-strong: #ffffff;--paper: #fafbfc;--line: #dde3ec;--line-strong: #cbd4e1;--accent: #136dff;--accent-strong: #0b54d6;--accent-soft: #e8f1ff;--warm: #ff755f;--warm-soft: #fff1ed;--success: #17845b;--warning: #b97809;--danger: #c73a3a;--shadow-soft: 0 22px 70px rgba(18, 24, 38, .1);--shadow-tight: 0 12px 32px rgba(18, 24, 38, .08);--ease-out: cubic-bezier(.16, 1, .3, 1);--radius: 8px}*{box-sizing:border-box}html{min-height:100%}body{min-height:100%;margin:0;overflow-x:hidden;background:linear-gradient(120deg,rgba(19,109,255,.06),transparent 34%),linear-gradient(28deg,rgba(255,117,95,.06),transparent 28%),linear-gradient(180deg,#fbfcfd 0%,var(--canvas) 58%,#edf1f6 100%)}body:before{position:fixed;inset:0;z-index:-1;content:"";background-image:linear-gradient(90deg,rgba(21,25,35,.035) 1px,transparent 1px),linear-gradient(180deg,rgba(21,25,35,.03) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:linear-gradient(180deg,rgba(0,0,0,.56),transparent 72%);mask-image:linear-gradient(180deg,rgba(0,0,0,.56),transparent 72%);opacity:.72;pointer-events:none}body:after{position:fixed;inset:0;z-index:-1;content:"";background-image:url(/surface-grain.png);background-size:180px 180px;opacity:.32;pointer-events:none}button,input{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid rgba(23,107,255,.22);outline-offset:2px}.app-shell{display:grid;grid-template-columns:minmax(0,1fr) minmax(310px,370px);gap:16px;min-height:100vh;padding:20px}.login-shell{display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.72fr);gap:16px;min-height:100vh;padding:20px}.login-visual,.login-panel{position:relative;min-width:0;border:1px solid rgba(150,163,184,.34);border-radius:var(--radius);background:var(--panel);box-shadow:var(--shadow-soft);overflow:hidden;animation:panel-rise .52s var(--ease-out) both}.login-visual{min-height:calc(100vh - 40px);background:#151923}.login-visual img:not(.brand-mark){width:100%;height:100%;object-fit:cover}.login-visual:after{position:absolute;inset:0;content:"";background:linear-gradient(90deg,#0a0f1ad6,#0a0f1a57 48%,#0a0f1a1f),linear-gradient(180deg,transparent 42%,rgba(10,15,26,.46));pointer-events:none}.login-visual-copy{position:absolute;left:clamp(22px,5vw,64px);bottom:clamp(24px,6vw,70px);z-index:1;display:grid;gap:11px;width:min(560px,calc(100% - 44px));color:#fff}.login-visual-copy .brand-mark{width:52px;height:52px}.login-visual-copy .eyebrow{color:#9dcbff}.login-visual-copy h1{margin:0;color:#fff;font-size:3rem;line-height:1;letter-spacing:0}.login-panel{align-self:stretch;display:grid;align-content:center;gap:22px;min-height:calc(100vh - 40px);padding:clamp(22px,4vw,42px);animation-delay:80ms}.loading-panel{grid-column:1 / -1;place-self:center;display:grid;place-items:center;gap:18px;width:min(320px,100%);min-height:220px}.login-heading{display:flex;align-items:center;gap:13px}.login-heading h2{margin:0;color:var(--ink);font-size:2rem;line-height:1}.login-icon{display:grid;place-items:center;width:48px;height:48px;border:1px solid rgba(23,107,255,.2);border-radius:var(--radius);background:var(--accent-soft);color:var(--accent-strong)}.login-form{display:grid;gap:10px}.login-form label{color:var(--ink-soft);font-size:.86rem;font-weight:850}.login-form input{width:100%;height:54px;padding:0 14px;border:1px solid var(--line-strong);border-radius:var(--radius);outline:none;background:linear-gradient(180deg,#fff,#f8fafc);color:var(--ink);font-size:1rem;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}.login-form input:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px #176bff1c}.login-submit{width:100%;margin-top:8px}.login-footnote{display:inline-flex;align-items:center;gap:8px;min-height:34px;color:var(--muted);font-size:.83rem;font-weight:800}.workspace,.queue-panel{position:relative;min-width:0;border:1px solid rgba(150,163,184,.34);border-radius:var(--radius);background:var(--panel);box-shadow:var(--shadow-soft);overflow:hidden;animation:panel-rise .52s var(--ease-out) both}.workspace{display:flex;flex-direction:column;gap:14px;min-height:calc(100vh - 40px);padding:20px}.workspace:before{display:none}.queue-panel{display:flex;flex-direction:column;gap:13px;min-height:calc(100vh - 40px);padding:18px;animation-delay:70ms}.topbar,.download-form,.active-card,.empty-state,.queue-header,.queue-summary,.queue-list{position:relative;z-index:1}.topbar,.queue-header,.form-heading,.form-footer,.action-row,.progress-topline,.progress-metrics,.brand,.status-pill,.empty-bullets,.meta-line,.status-line,.trust-row,.platform-strip{display:flex;align-items:center}.topbar,.queue-header,.form-heading,.form-footer,.progress-topline,.progress-metrics{justify-content:space-between}.brand{gap:12px;min-width:0}.brand-mark{width:44px;height:44px;flex:0 0 auto;border-radius:var(--radius);box-shadow:0 10px 22px #136dff33}.brand h1,.active-details h2,.queue-header h2,.empty-state h2{margin:0;color:var(--ink);line-height:1.06;letter-spacing:0}.brand h1{max-width:640px;font-size:1.82rem;font-weight:850}.active-details h2{max-width:820px;font-size:1.76rem;font-weight:850}.queue-header h2{font-size:1.18rem}.empty-state h2{max-width:420px;font-size:1.72rem}.brand-line{margin:5px 0 0;color:var(--muted);font-size:.92rem;font-weight:720}.eyebrow{margin:0 0 5px;color:var(--accent);font-size:.72rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase}.status-line{gap:8px}.status-line .eyebrow{margin:0}.status-dot{width:9px;height:9px;flex:0 0 auto;border-radius:50%;background:var(--subtle);box-shadow:0 0 0 4px #8a94a629}.status-dot.downloading,.status-dot.probing,.status-dot.processing{background:var(--accent);box-shadow:0 0 0 4px #176bff29}.status-dot.finished{background:var(--success);box-shadow:0 0 0 4px #17845b29}.status-dot.failed{background:var(--danger);box-shadow:0 0 0 4px #c73a3a29}.status-pill{gap:8px;min-height:34px;padding:0 11px;border:1px solid rgba(23,107,255,.2);border-radius:999px;background:linear-gradient(180deg,#ffffffd1,#e8f1ffd1),var(--accent-soft);color:var(--accent-strong);font-size:.8rem;font-weight:800;white-space:nowrap;box-shadow:0 8px 18px #136dff14}.session-cluster{display:inline-flex;align-items:center;gap:8px}.download-form{position:relative;display:grid;gap:11px;min-width:0;padding:13px;border:1px solid rgba(149,162,182,.42);border-radius:var(--radius);background:linear-gradient(180deg,#fffffffa,#f9fbfdfa),var(--panel-strong);box-shadow:0 1px #fffc inset,var(--shadow-tight);overflow:hidden}.download-form:before{position:absolute;inset:0 0 auto;height:2px;content:"";background:linear-gradient(90deg,var(--accent),#39a9ff,var(--warm))}.download-form label{color:var(--ink-soft);font-size:.86rem;font-weight:850}.url-row{display:grid;grid-template-columns:minmax(0,1fr) 48px auto;gap:8px;min-width:0}.url-input-wrap{position:relative;min-width:0}.url-input-wrap input{width:100%;height:54px;padding:0 142px 0 16px;border:1px solid var(--line-strong);border-radius:var(--radius);outline:none;background:linear-gradient(180deg,#fff,#f8fafc);color:var(--ink);font-size:1rem;transition:border-color .16s ease,box-shadow .16s ease,background .16s ease,transform .16s ease}.url-input-wrap input::placeholder{color:#98a2b3}.url-input-wrap input:focus{border-color:var(--accent);background:#fff;box-shadow:0 0 0 4px #176bff1c,0 12px 24px #1f283712}.detected-platform{position:absolute;top:50%;right:10px;transform:translateY(-50%);max-width:124px;overflow:hidden;padding:6px 8px;border-radius:7px;background:var(--ink);color:#fff;font-size:.72rem;font-weight:850;text-overflow:ellipsis;white-space:nowrap}.icon-button,.primary-button,.secondary-button,.segmented-control button,.ghost-link{display:inline-flex;align-items:center;justify-content:center;border:0;cursor:pointer;text-decoration:none;transition:transform .16s ease,border-color .16s ease,background .16s ease,color .16s ease,box-shadow .16s ease,opacity .16s ease}.icon-button{width:48px;height:54px;border:1px solid var(--line-strong);border-radius:var(--radius);background:linear-gradient(180deg,#fff,#f8fafc);color:var(--ink)}.paste-button{gap:8px}.paste-button span{display:none}.icon-button:hover,.icon-button:focus-visible{border-color:var(--accent);background:#fff;color:var(--accent)}.icon-button.subtle{width:40px;height:40px}.primary-button{gap:9px;min-width:144px;height:54px;padding:0 18px;border-radius:var(--radius);background:linear-gradient(135deg,#111827,#155ee8 64%,#24a6ff);color:#fff;font-weight:900;box-shadow:0 14px 28px #136dff3d,0 1px #ffffff42 inset}.primary-button:hover,.primary-button:focus-visible{background:linear-gradient(135deg,#0b1220,var(--accent) 62%,#2ea7ff);transform:translateY(-2px)}.primary-button:disabled,.secondary-button:disabled,.secondary-button.disabled,.icon-button:disabled{cursor:not-allowed;opacity:.46;pointer-events:none;transform:none}.segmented-control{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));min-height:42px;overflow:hidden;border:1px solid var(--line-strong);border-radius:var(--radius);background:#eef2f7;box-shadow:0 1px #ffffffb3 inset}.segmented-control button{gap:7px;padding:0 12px;background:transparent;color:var(--muted);font-size:.85rem;font-weight:850}.segmented-control button[aria-pressed=true]{background:linear-gradient(135deg,#111827,#27344f);color:#fff;box-shadow:0 1px #ffffff1f inset}.platform-strip,.trust-row{flex-wrap:wrap;justify-content:flex-end;gap:7px}.platform-strip span,.trust-row span,.empty-bullets span{display:inline-flex;align-items:center;gap:6px;min-height:30px;padding:0 9px;border:1px solid var(--line);border-radius:999px;background:#ffffffd1;color:var(--muted);font-size:.76rem;font-weight:800;white-space:nowrap;box-shadow:0 1px #ffffffb8 inset}.trust-row span:nth-child(2){border-color:#176bff2e;background:#e8f0ffc7;color:var(--accent-strong)}.trust-row{justify-content:flex-end}.inline-error,.job-error{margin:0;color:var(--danger);font-size:.92rem;font-weight:760}.job-error{padding:12px;border:1px solid rgba(199,58,58,.2);border-radius:var(--radius);background:#c73a3a12}.active-card{position:relative;display:grid;grid-template-columns:minmax(280px,42%) minmax(0,1fr);gap:0;flex:1;min-width:0;min-height:404px;border:1px solid rgba(151,164,184,.4);border-radius:var(--radius);background:linear-gradient(180deg,#fffffffc,#f9fbfdfc),var(--panel-strong);box-shadow:0 1px #ffffffd1 inset,var(--shadow-tight);overflow:hidden;animation:panel-rise .56s var(--ease-out) .12s both}.media-preview{position:relative;display:grid;place-items:center;min-height:340px;overflow:hidden;background:linear-gradient(145deg,#151923fa,#252e3ff0),#151923;color:#fff}.media-preview:before{position:absolute;inset:0;z-index:1;content:"";background:linear-gradient(120deg,rgba(255,255,255,.08),transparent 42%,rgba(0,0,0,.16));opacity:.7;pointer-events:none}.media-preview img{width:100%;height:100%;object-fit:cover}.media-preview img[src$="clipvault-media.jpg"]{object-position:center}.media-preview:after{position:absolute;inset:0;z-index:1;content:"";background:linear-gradient(180deg,#15192300,#1519235c);pointer-events:none}.media-badge{position:absolute;left:14px;bottom:14px;z-index:2;max-width:calc(100% - 28px);overflow:hidden;padding:8px 10px;border:1px solid rgba(255,255,255,.22);border-radius:999px;background:#ffffffeb;color:var(--ink);font-size:.76rem;font-weight:900;text-overflow:ellipsis;white-space:nowrap}.active-details{display:flex;flex-direction:column;justify-content:space-between;gap:20px;min-width:0;padding:24px}.active-copy{display:grid;gap:10px;min-width:0}.meta-line{flex-wrap:wrap;gap:8px;margin:0}.meta-line span{color:var(--muted);font-size:.92rem;font-weight:750}.meta-line span+span:before{content:"/";padding-right:8px;color:#a6afbd}.progress-wrap{display:grid;gap:12px}.progress-topline span,.progress-metrics span{color:var(--muted);font-size:.85rem;font-weight:750}.progress-topline strong{color:var(--ink);font-size:1.03rem}.progress-track{position:relative;height:11px;overflow:hidden;border-radius:999px;background:#e5eaf1}.progress-track span{display:block;position:relative;height:100%;min-width:8px;border-radius:inherit;background:linear-gradient(90deg,#176bff,#33a3ff);transition:width .26s cubic-bezier(.2,.7,.25,1);overflow:hidden}.progress-track span:after{position:absolute;inset:0;content:"";background:linear-gradient(90deg,transparent,rgba(255,255,255,.42),transparent);transform:translate(-100%);animation:progress-glide 1.8s ease-in-out infinite}.is-complete .progress-track span{background:linear-gradient(90deg,#17845b,#42bd83)}.is-failed .progress-track span{background:linear-gradient(90deg,#c73a3a,#ef7676)}.progress-metrics{gap:12px;flex-wrap:wrap}.action-row{flex-wrap:wrap;gap:9px}.secondary-button{gap:9px;min-height:44px;padding:0 14px;border:1px solid var(--line-strong);border-radius:var(--radius);background:#f8fafc;color:var(--ink);font-weight:880}.secondary-button:hover,.secondary-button:focus-visible,.ghost-link:hover,.ghost-link:focus-visible{border-color:var(--accent);background:var(--accent-soft);color:var(--accent-strong)}.ghost-link{gap:8px;min-height:44px;padding:0 6px;border:1px solid transparent;border-radius:var(--radius);color:var(--muted);font-weight:850}.empty-state{position:relative;display:grid;grid-template-columns:minmax(250px,.86fr) minmax(330px,1.14fr);align-items:center;flex:1;gap:28px;min-width:0;min-height:404px;padding:30px;border:1px solid rgba(151,164,184,.36);border-radius:var(--radius);background:linear-gradient(135deg,#e8f1ffe6,#fff1ed47 46%,#fffffff0),#fff;text-align:left;box-shadow:0 1px #ffffffd6 inset,var(--shadow-tight);overflow:hidden}.empty-copy{display:grid;gap:12px;min-width:0}.empty-copy p:not(.eyebrow){max-width:410px;margin:0;color:var(--muted);font-size:.98rem;font-weight:720;line-height:1.5}.empty-art{justify-self:end;width:min(100%,560px);aspect-ratio:16 / 9;height:auto;border:1px solid rgba(151,164,184,.34);border-radius:var(--radius);box-shadow:0 22px 46px #12182629;object-fit:cover;object-position:center}.empty-bullets{justify-content:flex-start;flex-wrap:wrap;gap:8px;max-width:100%;min-width:0}.queue-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px}.queue-summary span{display:grid;gap:3px;min-width:0;padding:10px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--muted);font-size:.73rem;font-weight:800;text-align:center;box-shadow:0 1px #ffffffd1 inset}.queue-summary strong{color:var(--ink);font-size:1.05rem}.queue-list{display:grid;align-content:start;gap:8px;overflow:auto;padding:1px 2px 2px}.queue-item{display:grid;grid-template-columns:52px minmax(0,1fr) 24px;gap:11px;align-items:center;width:100%;min-height:68px;padding:7px;border:1px solid var(--line);border-radius:var(--radius);background:#ffffffe0;color:inherit;text-align:left;cursor:pointer;transition:border-color .16s ease,background .16s ease,box-shadow .16s ease,transform .16s ease}.queue-item:hover,.queue-item:focus-visible{border-color:var(--accent);background:#fff;box-shadow:0 10px 22px #1f283714;transform:translateY(-1px)}.queue-item.active{border-color:#176bffb8;background:#fff;box-shadow:0 0 0 3px #176bff1c}.queue-thumb{display:grid;place-items:center;width:52px;height:52px;overflow:hidden;border-radius:7px;background:linear-gradient(135deg,#151923f2,#323a4beb),#151923;background-position:center;background-size:cover;color:#fff}.queue-copy{display:grid;gap:4px;min-width:0}.queue-copy strong,.queue-copy small{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.queue-copy strong{color:var(--ink);font-size:.91rem}.queue-copy small{color:var(--muted);font-size:.78rem;font-weight:750}.queue-progress{display:block;width:100%;height:4px;overflow:hidden;border-radius:999px;background:#e7ecf3}.queue-progress span{display:block;height:100%;min-width:4px;border-radius:inherit;background:linear-gradient(90deg,var(--accent),#3fa7ff);transition:width .26s var(--ease-out)}.queue-item.finished .queue-progress span{background:linear-gradient(90deg,var(--success),#42bd83)}.queue-item.failed .queue-progress span{background:linear-gradient(90deg,var(--danger),#ef7676)}.queue-empty{display:grid;place-items:center;gap:12px;min-height:220px;padding:18px;border:1px solid var(--line);border-radius:var(--radius);background:#fff;color:var(--muted);text-align:center;box-shadow:0 1px #ffffffd1 inset}.queue-empty img{width:142px;max-width:74%;height:auto;border-radius:var(--radius);box-shadow:0 14px 28px #1218261a}.queue-empty p{margin:0;font-weight:800}.status-success{color:var(--success)}.status-failed{color:var(--danger)}.spin{animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes panel-rise{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes media-breathe{0%{opacity:.24;transform:translate(-18%)}to{opacity:.46;transform:translate(8%)}}@keyframes progress-glide{to{transform:translate(100%)}}@keyframes soft-float{0%{transform:translateY(0)}to{transform:translateY(-5px)}}@media(prefers-reduced-motion:reduce){*,*:before,*:after{animation-duration:.01ms!important;animation-iteration-count:1!important;scroll-behavior:auto!important;transition-duration:.01ms!important}}@media(max-width:1120px){.app-shell,.login-shell{grid-template-columns:1fr}.login-visual,.login-panel{min-height:auto}.login-visual{min-height:360px}.workspace,.queue-panel{min-height:auto}.queue-list{max-height:420px}}@media(max-width:760px){body:before{opacity:.42}.app-shell,.login-shell{display:block;padding:10px;width:auto;max-width:100%;overflow-x:hidden}.login-visual,.login-panel{width:100%;max-width:100%;box-shadow:none}.login-visual{min-height:250px}.login-visual-copy{left:18px;bottom:18px;width:calc(100% - 36px)}.login-visual-copy h1{font-size:2rem}.login-panel{gap:18px;margin-top:12px;padding:20px}.login-heading h2{font-size:1.72rem}.workspace,.queue-panel{width:100%;max-width:100%;box-shadow:none}.workspace{gap:12px;padding:14px}.queue-panel{margin-top:12px;padding:14px}.topbar,.form-heading,.form-footer{align-items:flex-start;flex-direction:column;gap:12px}.status-pill{min-height:32px}.session-cluster{width:100%;justify-content:space-between}.brand{align-items:flex-start}.brand-mark{width:42px;height:42px}.brand h1{font-size:1.42rem}.brand-line{font-size:.88rem}.url-row{grid-template-columns:minmax(0,1fr)}.url-input-wrap input{height:52px;padding-right:16px}.detected-platform{position:static;display:inline-flex;max-width:100%;margin-top:8px;transform:none}.url-row>.paste-button{display:inline-flex;width:100%}.paste-button span{display:inline;font-weight:850}.download-form,.empty-state{width:100%}.download-form,.form-heading,.form-footer,.url-row,.segmented-control,.platform-strip,.trust-row{min-width:0;max-width:100%}.primary-button{position:sticky;bottom:10px;z-index:2;grid-column:1 / -1;min-width:0;width:100%}.segmented-control,.trust-row,.platform-strip{width:100%}.platform-strip,.trust-row{display:grid;grid-template-columns:repeat(auto-fit,minmax(112px,1fr))}.platform-strip span,.trust-row span,.segmented-control button span{min-width:0;overflow:hidden;text-overflow:ellipsis}.platform-strip span,.trust-row span{justify-content:center}.segmented-control button{min-width:0}.active-card{grid-template-columns:1fr;min-height:0}.media-preview{width:100%;min-height:0;aspect-ratio:16 / 9}.empty-state{grid-template-columns:1fr;gap:18px;min-height:0;padding:18px;text-align:center}.empty-art{justify-self:center;width:100%;max-width:520px;order:-1}.empty-copy{justify-items:center}.empty-copy p:not(.eyebrow){max-width:360px}.empty-bullets{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));width:min(100%,360px)}.empty-bullets span{justify-content:center}.active-details{padding:18px}.active-details h2{font-size:1.45rem}.progress-metrics{align-items:flex-start;flex-direction:column;gap:4px}.secondary-button{flex:1 1 136px}}@media(max-width:420px){.download-form{padding:12px}.platform-strip{grid-template-columns:repeat(2,minmax(0,1fr))}.trust-row{grid-template-columns:1fr}.platform-strip span,.trust-row span{font-size:.72rem}.queue-summary{grid-template-columns:1fr}}
