:root{--color-white: #ffffff;--color-gray-50: #fafafa;--color-gray-100: #f5f5f5;--color-gray-200: #e5e5e5;--color-gray-300: #d4d4d4;--color-gray-400: #a3a3a3;--color-gray-500: #737373;--color-gray-600: #525252;--color-gray-700: #404040;--color-gray-800: #262626;--color-gray-900: #171717;--color-black: #000000;--color-blue-50: #eff6ff;--color-blue-100: #dbeafe;--color-blue-500: #3b82f6;--color-blue-600: #2563eb;--color-blue-700: #1d4ed8;--color-success: #10b981;--color-error: #ef4444;--color-warning: #f59e0b;--font-family: "Inter", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--font-weight-light: 300;--font-weight-normal: 400;--font-weight-medium: 500;--font-weight-semibold: 600;--font-weight-bold: 700;--font-size-xs: .75rem;--font-size-sm: .875rem;--font-size-base: 1rem;--font-size-lg: 1.125rem;--font-size-xl: 1.25rem;--font-size-2xl: 1.5rem;--font-size-3xl: 1.875rem;--font-size-4xl: 2.25rem;--line-height-tight: 1.25;--line-height-normal: 1.5;--line-height-relaxed: 1.75;--space-1: .25rem;--space-2: .5rem;--space-3: .75rem;--space-4: 1rem;--space-5: 1.25rem;--space-6: 1.5rem;--space-8: 2rem;--space-10: 2.5rem;--space-12: 3rem;--space-16: 4rem;--space-20: 5rem;--radius-sm: .375rem;--radius-md: .5rem;--radius-lg: .75rem;--radius-xl: 1rem;--radius-2xl: 1.5rem;--radius-full: 9999px;--shadow-sm: 0 1px 2px 0 rgb(0 0 0 / .05);--shadow-md: 0 4px 6px -1px rgb(0 0 0 / .1), 0 2px 4px -2px rgb(0 0 0 / .1);--shadow-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1);--shadow-xl: 0 20px 25px -5px rgb(0 0 0 / .1), 0 8px 10px -6px rgb(0 0 0 / .1);--shadow-2xl: 0 25px 50px -12px rgb(0 0 0 / .25);--duration-fast: .15s;--duration-normal: .25s;--duration-slow: .35s;--duration-slower: .5s;--ease-in: cubic-bezier(.4, 0, 1, 1);--ease-out: cubic-bezier(0, 0, .2, 1);--ease-in-out: cubic-bezier(.4, 0, .2, 1);--ease-spring: cubic-bezier(.34, 1.56, .64, 1);--glass-bg: rgba(255, 255, 255, .7);--glass-border: rgba(255, 255, 255, .2);--glass-blur: 12px}*{margin:0;padding:0;box-sizing:border-box}html{font-size:16px;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}body{font-family:var(--font-family);font-weight:var(--font-weight-normal);line-height:var(--line-height-normal);color:var(--color-gray-900);background-color:var(--color-gray-50)}.custom-scrollbar::-webkit-scrollbar{width:8px;height:8px}.custom-scrollbar::-webkit-scrollbar-track{background:transparent}.custom-scrollbar::-webkit-scrollbar-thumb{background:var(--color-gray-300);border-radius:var(--radius-full);transition:background var(--duration-normal) var(--ease-out)}.custom-scrollbar::-webkit-scrollbar-thumb:hover{background:var(--color-gray-400)}.custom-scrollbar{scrollbar-width:thin;scrollbar-color:var(--color-gray-300) transparent}.glass{background:var(--glass-bg);border:1px solid var(--glass-border);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur))}.glass-dark{background:#0006;border:1px solid rgba(255,255,255,.1);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur))}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{transform:translateY(10px);opacity:0}to{transform:translateY(0);opacity:1}}@keyframes scaleIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes shimmer{0%{background-position:-1000px 0}to{background-position:1000px 0}}@keyframes spin{to{transform:rotate(360deg)}}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-fadeIn{animation:fadeIn var(--duration-normal) var(--ease-out)}.animate-slideUp{animation:slideUp var(--duration-normal) var(--ease-out)}.animate-scaleIn{animation:scaleIn var(--duration-normal) var(--ease-spring)}.animate-spin{animation:spin 1s linear infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.transition-all{transition:all var(--duration-normal) var(--ease-in-out)}.transition-colors{transition:background-color var(--duration-normal) var(--ease-in-out),border-color var(--duration-normal) var(--ease-in-out),color var(--duration-normal) var(--ease-in-out)}.transition-transform{transition:transform var(--duration-normal) var(--ease-spring)}.hover-lift{transition:transform var(--duration-normal) var(--ease-out),box-shadow var(--duration-normal) var(--ease-out)}.hover-lift:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}.focus-ring:focus-visible{outline:2px solid var(--color-blue-600);outline-offset:2px}.text-gradient{background:linear-gradient(135deg,var(--color-blue-600),var(--color-blue-500));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}.skeleton{background:linear-gradient(90deg,var(--color-gray-200) 0%,var(--color-gray-300) 50%,var(--color-gray-200) 100%);background-size:200% 100%;animation:shimmer 1.5s infinite;border-radius:var(--radius-md)}.gradient-bg{background:linear-gradient(135deg,var(--color-gray-50) 0%,var(--color-white) 50%,var(--color-gray-50) 100%)}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--space-2);padding:var(--space-3) var(--space-6);font-size:var(--font-size-sm);font-weight:var(--font-weight-medium);border-radius:var(--radius-full);border:none;cursor:pointer;transition:all var(--duration-normal) var(--ease-out);white-space:nowrap}.btn-primary{background:var(--color-black);color:var(--color-white);box-shadow:var(--shadow-sm)}.btn-primary:hover:not(:disabled){background:var(--color-gray-800);transform:scale(1.02);box-shadow:var(--shadow-md)}.btn-primary:active:not(:disabled){transform:scale(.98)}.btn-primary:disabled{background:var(--color-gray-200);color:var(--color-gray-400);cursor:not-allowed}.btn-secondary{background:var(--color-white);color:var(--color-gray-700);border:1px solid var(--color-gray-200)}.btn-secondary:hover:not(:disabled){background:var(--color-gray-100);border-color:var(--color-gray-300)}.btn-ghost{background:transparent;color:var(--color-gray-600)}.btn-ghost:hover:not(:disabled){background:var(--color-gray-100);color:var(--color-gray-900)}.card{background:var(--color-white);border:1px solid var(--color-gray-200);border-radius:var(--radius-xl);padding:var(--space-6);box-shadow:var(--shadow-sm);transition:all var(--duration-normal) var(--ease-out)}.card:hover{box-shadow:var(--shadow-md);border-color:var(--color-gray-300)}.badge{display:inline-flex;align-items:center;padding:var(--space-1) var(--space-3);font-size:var(--font-size-xs);font-weight:var(--font-weight-medium);border-radius:var(--radius-full);background:var(--color-gray-100);color:var(--color-gray-700)}.badge-primary{background:var(--color-blue-100);color:var(--color-blue-700)}.badge-success{background:#10b9811a;color:var(--color-success)}.badge-error{background:#ef44441a;color:var(--color-error)}.input{width:100%;padding:var(--space-3) var(--space-4);font-size:var(--font-size-sm);font-family:var(--font-family);color:var(--color-gray-900);background:var(--color-white);border:1px solid var(--color-gray-300);border-radius:var(--radius-lg);transition:all var(--duration-normal) var(--ease-out)}.input:focus{outline:none;border-color:var(--color-blue-500);box-shadow:0 0 0 3px #3b82f61a}.input::placeholder{color:var(--color-gray-400)}.toast{display:flex;align-items:center;gap:var(--space-3);padding:var(--space-4) var(--space-5);border-radius:var(--radius-xl);box-shadow:var(--shadow-xl);animation:slideUp var(--duration-normal) var(--ease-spring);max-width:400px}.toast-success{background:var(--color-white);border:1px solid rgba(16,185,129,.2);color:var(--color-gray-900)}.toast-error{background:var(--color-white);border:1px solid rgba(239,68,68,.2);color:var(--color-gray-900)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);display:flex;align-items:center;justify-content:center;z-index:1000;padding:var(--space-4);animation:fadeIn var(--duration-normal) var(--ease-out)}.modal-content{background:var(--color-white);border-radius:var(--radius-2xl);box-shadow:var(--shadow-2xl);max-width:90vw;max-height:90vh;overflow:auto;animation:scaleIn var(--duration-normal) var(--ease-spring)}.dropdown{position:absolute;background:var(--glass-bg);backdrop-filter:blur(var(--glass-blur));-webkit-backdrop-filter:blur(var(--glass-blur));border:1px solid var(--color-gray-200);border-radius:var(--radius-2xl);box-shadow:var(--shadow-xl);padding:var(--space-4);animation:scaleIn var(--duration-fast) var(--ease-spring);z-index:100}[data-ui-theme=vibrant]{color-scheme:light}[data-ui-theme=vibrant] body{background:#070f1f}.landing-shell-vibrant{color:#e5eeff;background:radial-gradient(circle at 10% 18%,rgba(34,211,238,.2),transparent 36%),radial-gradient(circle at 88% 22%,rgba(244,114,182,.18),transparent 38%),radial-gradient(circle at 50% 84%,rgba(251,146,60,.16),transparent 34%),linear-gradient(180deg,#090f1c,#0a1324 52%,#0a1222)}.landing-shell-vibrant:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url(/assets/landing-glass-bokeh.svg) center / cover no-repeat;opacity:.55;pointer-events:none}.landing-shell-vibrant:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:radial-gradient(circle at center,transparent 36%,rgba(2,6,23,.55) 100%),linear-gradient(180deg,#0206171a,#0206176b);pointer-events:none}.landing-shell-vibrant .landing-header{margin-top:.45rem;padding:.82rem 1.4rem;border:1px solid rgba(192,220,255,.35);border-radius:9999px;background:linear-gradient(135deg,#0f192c9e,#14243a73);backdrop-filter:blur(14px) saturate(145%);-webkit-backdrop-filter:blur(14px) saturate(145%);box-shadow:0 22px 46px #02061759,inset 0 1px #ffffff38}.landing-shell-vibrant .landing-brand{text-shadow:0 0 12px rgba(34,211,238,.22)}.landing-shell-vibrant .landing-theme-toggle,.landing-shell-vibrant .landing-nav-secondary,.landing-shell-vibrant .landing-secondary-cta,.landing-shell-vibrant .landing-start-free{box-shadow:inset 0 1px #fff3}.landing-shell-vibrant .landing-nav-primary{box-shadow:0 12px 26px #0ea5e947}.landing-shell-vibrant .landing-main{position:relative}.landing-shell-vibrant .landing-title{text-shadow:0 8px 24px rgba(2,6,23,.45)}.landing-shell-vibrant .landing-copy{max-width:38rem}.landing-shell-vibrant .landing-hero-card,.landing-shell-vibrant .landing-feature-card,.landing-shell-vibrant .landing-pricing-panel,.landing-shell-vibrant .landing-topup-note{border-color:#a7d0ff47;background:linear-gradient(145deg,#121f35ad,#0f182a70);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);box-shadow:0 20px 44px #02061757,inset 0 1px #ffffff29}.landing-shell-vibrant .landing-feature-card{transition:transform .22s ease,box-shadow .22s ease,border-color .22s ease}.landing-shell-vibrant .landing-feature-card:hover{transform:translateY(-3px);border-color:#7dd3fc7a;box-shadow:0 22px 48px #02061766}.landing-shell-vibrant .landing-workflow-card{box-shadow:0 14px 36px #02061775,inset 0 1px #ffffff1f}.landing-shell-vibrant .landing-mini-stat{box-shadow:inset 0 1px #ffffff24}.landing-shell-vibrant .landing-plan-card{box-shadow:inset 0 1px #ffffff1f}.landing-shell-vibrant .landing-plan-card-highlight{box-shadow:0 12px 32px #0f172a8a,inset 0 1px #ffffff38}.editor-shell-classic{background:linear-gradient(180deg,#f0f4fa9e,#e0e7f1bd),url(/assets/editor-main-bg.png) center / cover no-repeat}.editor-shell-vibrant{color:#e5eeff;background:linear-gradient(180deg,#0e24440d,#122a4c1f),radial-gradient(circle at 11% 10%,rgba(34,211,238,.42),transparent 42%),radial-gradient(circle at 88% 22%,rgba(244,114,182,.42),transparent 43%),radial-gradient(circle at 46% 84%,rgba(251,146,60,.32),transparent 42%),url(/assets/editor-main-bg.png) center / cover no-repeat,linear-gradient(180deg,#080f1d,#0a1222 56%,#091120)}.editor-shell-vibrant:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:url(/assets/landing-glass-bokeh.svg) center / cover no-repeat;opacity:.03;pointer-events:none}.editor-shell-vibrant:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#ffffff24,#ffffff0d);pointer-events:none}.editor-top-strip{position:relative;width:100%;overflow:hidden;border:1px solid rgba(196,224,255,.34);backdrop-filter:blur(14px) saturate(150%);-webkit-backdrop-filter:blur(14px) saturate(150%);box-shadow:0 10px 18px #08142629,inset 0 1px #ffffff4d}.editor-top-strip:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0}.editor-top-strip:after{content:"";position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;pointer-events:none;background:url(/assets/colorful-glass-grain.svg) center / cover no-repeat;mix-blend-mode:soft-light;opacity:.25}.editor-top-strip>*{position:relative;z-index:1}.editor-top-strip-logo{width:fit-content;max-width:calc(100vw - 7.5rem)}.editor-top-strip-vibrant:before{background:linear-gradient(94deg,#50c2d2db,#7084b2c7 52%,#c46688d6)}.editor-top-strip-classic:before{background:linear-gradient(94deg,#3a97a3bd,#4a5276b8 52%,#954663bd)}.editor-top-logo{filter:drop-shadow(0 2px 7px rgba(6,16,32,.36))}.editor-top-icon-btn{color:#f4f9ffe6;border:1px solid transparent}.editor-top-icon-btn:hover{color:#fff;border-color:#ffffff38;background:#ffffff1f}.editor-top-icon-btn:disabled{opacity:.55;cursor:not-allowed}.editor-top-icon-btn:disabled:hover{border-color:transparent;background:transparent}.editor-top-icon-btn.is-active{color:#fff;border-color:#ffffff47;background:#ffffff24}.editor-hamburger-btn{border-width:1px;box-shadow:0 10px 20px #02081847,inset 0 1px #fff3}.editor-hamburger-vibrant{color:#fff;border-color:#ffffff6b;background:linear-gradient(135deg,#0e1828e6,#16243adb)}.editor-hamburger-vibrant:hover{border-color:#ffffff8f;background:linear-gradient(135deg,#121e32f5,#1c2c46eb)}.editor-hamburger-classic{color:#0f172a;border-color:#0f172a40;background:linear-gradient(135deg,#ffffffeb,#e6f1ffe6)}.editor-hamburger-classic:hover{border-color:#0f172a59;background:linear-gradient(135deg,#fffffff5,#eff8fff0)}.editor-header-vibrant:before{content:"";position:absolute;top:.48rem;left:1rem;right:1rem;height:3.1rem;border-radius:9999px;border:1px solid rgba(190,225,255,.35);background:linear-gradient(135deg,#121e349e,#16223a6b);backdrop-filter:blur(14px) saturate(160%);-webkit-backdrop-filter:blur(14px) saturate(160%);box-shadow:0 20px 40px #02061775,inset 0 1px #fff3;pointer-events:none}.editor-header-vibrant:after{content:"";position:absolute;top:.37rem;left:50%;width:min(1080px,88vw);height:.11rem;transform:translate(-50%);border-radius:9999px;background:linear-gradient(90deg,#22d3ee,#818cf8 42%,#f472b6 68%,#fb923c);opacity:.85;pointer-events:none}.editor-header-vibrant>*{position:relative;z-index:1}.editor-logo-frame{border:1px solid rgba(190,225,255,.34);box-shadow:0 16px 34px #02061773,inset 0 1px #ffffff3d;background:linear-gradient(135deg,#121e34bd,#18284480)}.editor-theme-toggle-vibrant{border:1px solid rgba(190,225,255,.35);background:linear-gradient(135deg,#121e34bd,#18284470);box-shadow:0 12px 26px #02061766}.editor-theme-toggle-vibrant:hover{background:linear-gradient(135deg,#182a48d1,#243e668c)}.editor-shell-vibrant .editor-glass-panel,.editor-shell-vibrant .editor-library-panel,.editor-shell-vibrant .editor-help-card{background:linear-gradient(145deg,#4c78b257,#3a5c8c24);backdrop-filter:blur(16px) saturate(152%);-webkit-backdrop-filter:blur(16px) saturate(152%);box-shadow:0 10px 20px #06102229,inset 0 1px #ffffff42}.editor-shell-vibrant .editor-picker-panel{background:linear-gradient(145deg,#1e3a628f,#14284a52);box-shadow:0 12px 24px #06102238,inset 0 1px #ffffff3d}.editor-shell-vibrant .editor-canvas{background:linear-gradient(145deg,#1c3a620f,#1c3a6200),url(/assets/editor-upload-bg.svg) center / cover no-repeat;backdrop-filter:blur(9px) saturate(145%);-webkit-backdrop-filter:blur(9px) saturate(145%);box-shadow:0 10px 20px #08142629,inset 0 1px #ffffff52}.editor-shell-vibrant .editor-canvas:before{content:"";position:absolute;top:0;right:0;bottom:0;left:0;background:linear-gradient(180deg,#02061700,#02061703);pointer-events:none}.editor-shell-vibrant .editor-dropzone-outline{box-shadow:inset 0 0 0 1px #ffffff1a,0 0 20px #38bdf838}.editor-generate-vibrant{color:#fff;text-shadow:0 2px 6px rgba(2,6,23,.78);border:1px solid rgba(255,255,255,.28);background:linear-gradient(115deg,#0f172a,#0d3b66 32%,#2563eb 48%,#9333ea 70%,#f97316);box-shadow:0 16px 34px #0618297a,inset 0 1px #ffffff4d}.editor-generate-vibrant:hover{box-shadow:0 18px 38px #0618298f,inset 0 1px #ffffff59}.editor-generate-vibrant-ready{color:#fff;text-shadow:0 2px 6px rgba(2,6,23,.7);border:1px solid rgba(255,255,255,.34);background:linear-gradient(105deg,#174166,#268fb4,#4e73b4 56%,#8a5fa5,#b46a8f);box-shadow:0 16px 30px #07162861,inset 0 1px #ffffff57}.editor-generate-vibrant-ready:hover{box-shadow:0 18px 36px #07162875,inset 0 1px #fff6}.editor-shell-vibrant .editor-footer{background:linear-gradient(135deg,#34548647,#263e6224);backdrop-filter:blur(12px) saturate(145%);-webkit-backdrop-filter:blur(12px) saturate(145%)}@media(max-width:768px){.landing-shell-vibrant .landing-header{border-radius:1rem;padding:.82rem .95rem}.editor-header-vibrant:before{top:.3rem;left:.5rem;right:.5rem;height:2.65rem}.editor-header-vibrant:after{width:min(720px,90vw)}}