:root{--primary: #005bc2;--primary-alt: #3d82f8;--primary-container: #d3e3fd;--on-primary: #ffffff;--surface: #f8f9ff;--surface-low: #f0f2fb;--surface-lowest: #ffffff;--surface-high: #e3e6f5;--surface-highest: #d6d9ee;--on-surface: #1c2032;--on-surface-variant: #5a5f75;--on-surface-muted: #8b90a7;--success: #1a7f50;--success-surface: #e6f4ee;--error: #b3261e;--error-surface: #fce8e6;--warning: #b35c00;--font-display: "Manrope", sans-serif;--font-body: "Inter", sans-serif;--s1: 4px;--s2: 8px;--s3: 12px;--s4: 16px;--s5: 24px;--s6: 32px;--s7: 48px;--s8: 64px;--s9: 96px;--r-sm: 8px;--r-md: 12px;--r-lg: 20px;--r-xl: 28px;--r-full: 9999px;--shadow-card: 0 4px 24px -4px rgba(28,32,50,.07), 0 1px 4px rgba(28,32,50,.04);--shadow-hover: 0 16px 48px -8px rgba(28,32,50,.12), 0 4px 12px rgba(28,32,50,.06);--shadow-float: 0 32px 80px -16px rgba(28,32,50,.1), 0 8px 24px rgba(28,32,50,.06);--ease: cubic-bezier(.2, 0, 0, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--t-fast: .15s;--t-std: .28s;--t-slow: .48s}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth}body{font-family:var(--font-body);background:var(--surface);color:var(--on-surface);line-height:1.6;min-height:100vh;overflow-x:hidden;-webkit-font-smoothing:antialiased}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.hidden{display:none!important}.bg-canvas{position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;overflow:hidden;background:var(--surface)}.bg-orb{position:absolute;border-radius:50%;filter:blur(80px);opacity:.4;animation:orbFloat 12s ease-in-out infinite}.orb-1{width:600px;height:600px;background:radial-gradient(circle,#c2d8ff 0%,transparent 70%);top:-200px;left:-150px;animation-duration:14s}.orb-2{width:400px;height:400px;background:radial-gradient(circle,#d4e3ff 0%,transparent 70%);top:40%;right:-100px;animation-duration:10s;animation-delay:-4s}.orb-3{width:300px;height:300px;background:radial-gradient(circle,#e8f0ff 0%,transparent 70%);bottom:10%;left:30%;animation-duration:16s;animation-delay:-8s}.bg-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(rgba(0,91,194,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(0,91,194,.035) 1px,transparent 1px);background-size:40px 40px}@keyframes orbFloat{0%,to{transform:translate(0) scale(1)}33%{transform:translate(30px,-20px) scale(1.05)}66%{transform:translate(-20px,15px) scale(.97)}}.app-nav{position:sticky;top:0;z-index:100;padding:var(--s4) var(--s6);backdrop-filter:blur(20px) saturate(180%);-webkit-backdrop-filter:blur(20px) saturate(180%);background:#f8f9ffd1;border-bottom:1px solid rgba(0,91,194,.06);animation:slideDown var(--t-slow) var(--ease) both}.nav-inner{max-width:1100px;margin:0 auto;display:flex;align-items:center;justify-content:space-between}.logo{display:flex;align-items:center;gap:var(--s2);text-decoration:none;color:var(--on-surface)}.logo-mark{width:38px;height:38px;background:linear-gradient(135deg,var(--primary),var(--primary-alt));border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 12px #005bc240;transition:var(--t-std) var(--ease-spring)}.logo-mark .material-symbols-rounded{font-size:22px;color:#fff;animation:float 4s ease-in-out infinite}.logo:hover .logo-mark{transform:rotate(-8deg) scale(1.08)}.logo-text{font-family:var(--font-display);font-size:20px;font-weight:800;letter-spacing:-.03em}.logo-badge{font-size:10px;font-weight:700;background:var(--primary-container);color:var(--primary);padding:2px 7px;border-radius:var(--r-full);letter-spacing:.04em;text-transform:uppercase}.nav-links{display:flex;align-items:center;gap:var(--s4)}.nav-link{font-size:14px;font-weight:500;color:var(--on-surface-variant);text-decoration:none;padding:var(--s2) var(--s3);border-radius:var(--r-full);transition:color var(--t-fast),background var(--t-fast)}.nav-link:hover{color:var(--primary);background:var(--surface-low)}.nav-cta-link{display:flex;align-items:center;gap:var(--s1);font-size:14px;font-weight:600;color:var(--primary);background:var(--primary-container);text-decoration:none;padding:var(--s2) var(--s4);border-radius:var(--r-full);transition:var(--t-std) var(--ease)}.nav-cta-link .material-symbols-rounded{font-size:18px}.nav-cta-link:hover{background:#005bc226;transform:translateY(-1px)}.main-wrapper{max-width:1100px;margin:0 auto;padding:0 var(--s6) var(--s9)}.hero-section{padding:var(--s9) 0 var(--s8);text-align:center;animation:fadeUp var(--t-slow) var(--ease) both}.hero-eyebrow{display:inline-flex;align-items:center;gap:var(--s2);font-size:13px;font-weight:600;color:var(--primary);background:var(--primary-container);padding:6px 14px;border-radius:var(--r-full);margin-bottom:var(--s5);letter-spacing:.02em}.eyebrow-dot{width:7px;height:7px;background:var(--primary);border-radius:50%;animation:pulse 2s ease-in-out infinite}.hero-headline{font-family:var(--font-display);font-size:clamp(3rem,7vw,5rem);font-weight:900;line-height:1.08;letter-spacing:-.04em;margin-bottom:var(--s5);color:var(--on-surface)}.headline-gradient{background:linear-gradient(135deg,var(--primary) 0%,#3d82f8 50%,#6ea5ff 100%);-webkit-background-clip:text;background-clip:text;color:transparent}.hero-subtext{max-width:540px;margin:0 auto var(--s6);font-size:1.125rem;color:var(--on-surface-variant);line-height:1.7}.hero-stats{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:var(--s3)}.stat-chip{display:flex;align-items:center;gap:var(--s2);font-size:14px;font-weight:500;color:var(--on-surface-variant);background:var(--surface-lowest);border-radius:var(--r-full);padding:8px 16px;box-shadow:var(--shadow-card)}.stat-chip .material-symbols-rounded{font-size:18px;color:var(--primary)}.upload-section{display:flex;justify-content:center;padding-bottom:var(--s9);animation:fadeUp var(--t-slow) var(--ease) .1s both}.upload-card{width:100%;max-width:560px;background:var(--surface-lowest);border-radius:var(--r-xl);box-shadow:var(--shadow-float);padding:var(--s6);position:relative;overflow:hidden}.upload-card:before{content:"";position:absolute;top:0;left:0;right:0;height:3px;background:linear-gradient(90deg,var(--primary),var(--primary-alt),#6ea5ff);border-radius:var(--r-xl) var(--r-xl) 0 0}.upload-step{animation:stepIn var(--t-std) var(--ease-spring) both}.drop-zone{position:relative;border-radius:var(--r-lg);overflow:hidden;cursor:pointer;outline:none;min-height:320px;display:flex;align-items:center;justify-content:center;transition:var(--t-std) var(--ease)}.drop-zone:focus-visible{box-shadow:0 0 0 3px var(--primary-container),0 0 0 5px var(--primary)}.drop-zone-bg{position:absolute;top:0;right:0;bottom:0;left:0;background:var(--surface-low);background-image:radial-gradient(circle at 50% 40%,rgba(0,91,194,.05) 0%,transparent 60%);border-radius:var(--r-lg);border:2px dashed transparent;transition:var(--t-std) var(--ease);background-clip:padding-box;box-shadow:inset 0 0 0 2px #005bc226}.drop-zone-content{position:relative;z-index:1;display:flex;flex-direction:column;align-items:center;gap:var(--s3);padding:var(--s7) var(--s6)}.drop-icon-wrap{position:relative;width:80px;height:80px;display:flex;align-items:center;justify-content:center}.drop-icon{font-size:44px;background:linear-gradient(135deg,var(--primary),var(--primary-alt));-webkit-background-clip:text;background-clip:text;color:transparent;animation:float 3.5s ease-in-out infinite;position:relative;z-index:1}.drop-icon-ring{position:absolute;border-radius:50%;border:2px solid rgba(0,91,194,.12);animation:expandRing 3.5s ease-out infinite}.ring-1{width:60px;height:60px;animation-delay:0s}.ring-2{width:80px;height:80px;animation-delay:1s}.drop-primary{font-family:var(--font-display);font-size:1.3rem;font-weight:700;color:var(--on-surface)}.drop-secondary{font-size:14px;color:var(--on-surface-muted)}.drop-hint{font-size:12px;color:var(--on-surface-muted);margin-top:var(--s1)}.drop-overlay{position:absolute;top:0;right:0;bottom:0;left:0;background:#005bc21a;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:var(--s3);border-radius:var(--r-lg);border:2px solid var(--primary);opacity:0;pointer-events:none;transition:opacity var(--t-fast);z-index:10}.drop-overlay .material-symbols-rounded{font-size:52px;color:var(--primary);animation:bounce .6s ease-in-out infinite alternate}.drop-overlay p{font-family:var(--font-display);font-weight:700;font-size:1.1rem;color:var(--primary)}.drop-zone.is-dragging .drop-overlay{opacity:1}.drop-zone.is-dragging .drop-zone-bg{box-shadow:inset 0 0 0 2px var(--primary)}.preview-header{display:flex;align-items:center;gap:var(--s4);background:var(--surface-low);border-radius:var(--r-lg);padding:var(--s4) var(--s5);margin-bottom:var(--s3)}.preview-icon-wrap{width:52px;height:52px;background:var(--primary-container);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;flex-shrink:0}.preview-file-icon{font-size:28px;color:var(--primary)}.preview-meta{flex:1;min-width:0}.preview-filename{font-family:var(--font-display);font-weight:700;font-size:1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.preview-size{font-size:13px;color:var(--on-surface-muted)}.preview-type-tag{display:inline-block;font-size:12px;font-weight:600;color:var(--primary);background:var(--primary-container);padding:4px 12px;border-radius:var(--r-full);margin-bottom:var(--s5);letter-spacing:.02em}.preview-actions{display:flex;gap:var(--s3)}.uploading-animation{position:relative;width:100px;height:100px;margin:0 auto var(--s5);display:flex;align-items:center;justify-content:center}.upload-orbit{position:absolute;top:0;right:0;bottom:0;left:0;border-radius:50%;border:2px solid var(--primary-container);animation:orbit 2s linear infinite}.orbit-dot{width:10px;height:10px;background:var(--primary);border-radius:50%;position:absolute;top:-5px;left:50%;transform:translate(-50%);box-shadow:0 0 8px 2px #005bc266}.uploading-center-icon{font-size:48px;background:linear-gradient(135deg,var(--primary),var(--primary-alt));-webkit-background-clip:text;background-clip:text;color:transparent;position:relative;z-index:1}.uploading-label{font-family:var(--font-display);font-size:1.2rem;font-weight:700;text-align:center;margin-bottom:var(--s1)}.uploading-filename{font-size:14px;color:var(--on-surface-muted);text-align:center;margin-bottom:var(--s5);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.progress-track{position:relative;height:8px;background:var(--surface-high);border-radius:var(--r-full);overflow:hidden;margin-bottom:var(--s3)}.progress-fill{height:100%;width:0%;background:linear-gradient(90deg,var(--primary),var(--primary-alt));border-radius:var(--r-full);transition:width .25s ease;position:relative;z-index:1}.progress-shimmer{position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(90deg,transparent 0%,rgba(255,255,255,.4) 50%,transparent 100%);animation:shimmer 1.5s ease infinite}.progress-meta{display:flex;justify-content:space-between;font-size:13px;font-weight:600;color:var(--on-surface-variant)}.success-burst{position:relative;width:88px;height:88px;margin:0 auto var(--s5);display:flex;align-items:center;justify-content:center}.burst-ring{position:absolute;border-radius:50%;border:2px solid rgba(26,127,80,.25)}.ring-a{width:88px;height:88px;animation:successRing 1s var(--ease-spring) both}.ring-b{width:110px;height:110px;animation:successRing 1s var(--ease-spring) .1s both}.success-check{width:68px;height:68px;background:linear-gradient(135deg,#1a7f50,#34a853);border-radius:50%;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px #1a7f504d;animation:popIn .5s var(--ease-spring) both}.success-check .material-symbols-rounded{font-size:36px;color:#fff}.success-title{font-family:var(--font-display);font-size:1.75rem;font-weight:800;letter-spacing:-.02em;text-align:center;margin-bottom:var(--s2)}.success-sub{font-size:15px;color:var(--on-surface-variant);text-align:center;margin-bottom:var(--s5)}.link-row{display:flex;align-items:center;gap:var(--s2);background:var(--surface-low);border-radius:var(--r-lg);padding:var(--s2);margin-bottom:var(--s5);box-shadow:inset 0 0 0 1px #0000000d}.link-chip{display:flex;align-items:center;gap:var(--s2);flex:1;padding:var(--s1) var(--s3);min-width:0}.link-chip-icon{font-size:18px;color:var(--on-surface-muted);flex-shrink:0}.link-chip input{flex:1;border:none;background:transparent;font-family:var(--font-body);font-size:14px;font-weight:500;color:var(--on-surface);outline:none;min-width:0}.success-actions{display:flex;gap:var(--s3)}.error-icon-wrap{width:80px;height:80px;background:var(--error-surface);border-radius:50%;display:flex;align-items:center;justify-content:center;margin:0 auto var(--s5);animation:popIn .5s var(--ease-spring) both}.error-icon{font-size:40px;color:var(--error)}.error-title{font-family:var(--font-display);font-size:1.5rem;font-weight:800;text-align:center;margin-bottom:var(--s2)}.error-message{font-size:14px;color:var(--on-surface-variant);text-align:center;margin-bottom:var(--s5)}.error-actions{display:flex;gap:var(--s3);justify-content:center}.btn-primary{display:inline-flex;align-items:center;gap:var(--s2);background:linear-gradient(135deg,var(--primary),var(--primary-alt));color:var(--on-primary);border:none;padding:0 var(--s6);height:52px;border-radius:var(--r-full);font-family:var(--font-body);font-weight:600;font-size:15px;cursor:pointer;box-shadow:0 4px 16px #005bc240;transition:transform var(--t-std) var(--ease-spring),box-shadow var(--t-std) var(--ease)}.btn-primary .material-symbols-rounded{font-size:20px}.btn-primary:hover{transform:translateY(-3px);box-shadow:0 8px 28px #005bc259}.btn-primary:active{transform:translateY(-1px)}.btn-primary.full-width{width:100%;justify-content:center}.btn-secondary{display:inline-flex;align-items:center;gap:var(--s2);background:var(--surface-low);color:var(--on-surface);border:none;padding:0 var(--s5);height:48px;border-radius:var(--r-full);font-family:var(--font-body);font-weight:600;font-size:14px;cursor:pointer;text-decoration:none;transition:background var(--t-fast),transform var(--t-std) var(--ease-spring)}.btn-secondary .material-symbols-rounded{font-size:18px}.btn-secondary:hover{background:var(--surface-high);transform:translateY(-2px)}.btn-ghost{display:inline-flex;align-items:center;gap:var(--s2);background:transparent;color:var(--on-surface-variant);border:none;padding:0 var(--s4);height:48px;border-radius:var(--r-full);font-family:var(--font-body);font-weight:500;font-size:14px;cursor:pointer;transition:background var(--t-fast),color var(--t-fast)}.btn-ghost .material-symbols-rounded{font-size:18px}.btn-ghost:hover{background:var(--surface-high);color:var(--on-surface)}.btn-icon{width:40px;height:40px;border:none;background:var(--surface-high);border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;color:var(--on-surface-variant);transition:background var(--t-fast),color var(--t-fast);flex-shrink:0}.btn-icon:hover{background:var(--surface-highest);color:var(--on-surface)}.btn-icon .material-symbols-rounded{font-size:20px}.btn-copy{width:48px;height:48px;border:none;background:var(--primary);border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;flex-shrink:0;transition:var(--t-std) var(--ease-spring)}.btn-copy:hover{transform:scale(1.08);background:var(--primary-alt)}.btn-copy .material-symbols-rounded{font-size:22px}.features-strip{display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s5);margin-bottom:var(--s9);animation:fadeUp var(--t-slow) var(--ease) .2s both}.feature-card{background:var(--surface-lowest);border-radius:var(--r-xl);padding:var(--s6);box-shadow:var(--shadow-card);transition:transform var(--t-std) var(--ease-spring),box-shadow var(--t-std) var(--ease)}.feature-card:hover{transform:translateY(-6px);box-shadow:var(--shadow-hover)}.feature-icon-wrap{width:52px;height:52px;background:linear-gradient(135deg,var(--primary-container),rgba(0,91,194,.05));border-radius:var(--r-md);display:flex;align-items:center;justify-content:center;margin-bottom:var(--s4)}.feature-icon-wrap .material-symbols-rounded{font-size:26px;color:var(--primary)}.feature-card h3{font-family:var(--font-display);font-size:1.1rem;font-weight:700;letter-spacing:-.02em;margin-bottom:var(--s2)}.feature-card p{font-size:14px;color:var(--on-surface-variant);line-height:1.65}.app-footer{text-align:center;padding:var(--s6) 0 var(--s7);font-size:13px;color:var(--on-surface-muted);border-top:1px solid rgba(0,0,0,.05)}.app-footer a{color:var(--primary);text-decoration:none;font-weight:500}.app-footer a:hover{text-decoration:underline}.toast{position:fixed;bottom:var(--s6);left:50%;transform:translate(-50%) translateY(80px);background:var(--on-surface);color:#f0f2fb;padding:var(--s3) var(--s5);border-radius:var(--r-md);display:flex;align-items:center;gap:var(--s3);box-shadow:var(--shadow-float);z-index:1000;font-size:14px;font-weight:500;white-space:nowrap;transition:transform var(--t-std) var(--ease-spring),opacity var(--t-std) var(--ease);opacity:0;pointer-events:none}.toast.is-visible{transform:translate(-50%) translateY(0);opacity:1;pointer-events:auto}.toast-icon{font-size:20px;color:#34a853}.toast.is-error .toast-icon{color:#f28b82}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-8px)}}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.6;transform:scale(.85)}}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeUp{0%{opacity:0;transform:translateY(24px)}to{opacity:1;transform:translateY(0)}}@keyframes stepIn{0%{opacity:0;transform:scale(.96) translateY(12px)}to{opacity:1;transform:scale(1) translateY(0)}}@keyframes expandRing{0%{opacity:.7;transform:scale(.7)}to{opacity:0;transform:scale(1.6)}}@keyframes orbit{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes shimmer{0%{transform:translate(-100%)}to{transform:translate(300%)}}@keyframes popIn{0%{opacity:0;transform:scale(.5)}to{opacity:1;transform:scale(1)}}@keyframes successRing{0%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}@keyframes bounce{0%{transform:translateY(-4px)}to{transform:translateY(4px)}}@media (max-width: 800px){.features-strip{grid-template-columns:1fr}.nav-links{display:none}.main-wrapper{padding:0 var(--s4) var(--s7)}.hero-section{padding:var(--s7) 0 var(--s6)}.upload-card{padding:var(--s5)}.success-actions{flex-direction:column}}@media (max-width: 480px){.hero-headline{font-size:2.4rem}.hero-stats{gap:var(--s2)}.stat-chip{font-size:12px;padding:6px 12px}.drop-zone-content{padding:var(--s6) var(--s4)}}