:root{--primary: #6366f1;--secondary: #8b5cf6;--accent: #06b6d4;--bg-light: #f8fafc;--bg-card: rgba(255, 255, 255, .8);--text-main: #0f172a;--text-muted: #64748b;--glass-border: rgba(0, 0, 0, .05);--glass-bg: rgba(255, 255, 255, .5);--font-main: "Outfit", "Sarabun", sans-serif}*{margin:0;padding:0;box-sizing:border-box;-webkit-font-smoothing:antialiased}a{text-decoration:none!important}body{font-family:var(--font-main);background-color:var(--bg-light);color:var(--text-main);overflow-x:hidden;min-height:100vh;background-image:radial-gradient(circle at 0% 0%,rgba(99,102,241,.05) 0,transparent 40%),radial-gradient(circle at 100% 100%,rgba(139,92,246,.05) 0,transparent 40%),linear-gradient(135deg,#f8fafc,#e2e8f0)}.flex{display:flex!important}.flex-col{flex-direction:column!important}.items-center{align-items:center!important}.justify-center{justify-content:center!important}.justify-between{justify-content:space-between!important}.flex-grow{flex-grow:1!important}.min-h-screen{min-height:100vh!important}.container{width:100%;margin-left:auto;margin-right:auto;padding-left:2rem;padding-right:2rem}@media(min-width:768px){.container{max-width:1000px}}.mx-auto{margin-left:auto!important;margin-right:auto!important}.gap-2{gap:.5rem!important}.gap-3{gap:.75rem!important}.gap-4{gap:1rem!important}.gap-8{gap:2rem!important}.gap-10{gap:2.5rem!important}.mt-8{margin-top:2rem!important}.mt-12{margin-top:3rem!important}.mt-16{margin-top:4rem!important}.mt-24{margin-top:6rem!important}.mb-4{margin-bottom:1rem!important}.mb-8{margin-bottom:2rem!important}.mb-12{margin-bottom:3rem!important}.p-4{padding:1rem!important}.p-6{padding:1.5rem!important}.p-8{padding:2.5rem!important}.p-12{padding:3rem!important}.grid{display:grid!important}.grid-cols-1{grid-template-columns:repeat(1,minmax(0,1fr))!important}@media(min-width:768px){.grid-cols-2{grid-template-columns:repeat(2,minmax(0,1fr))!important}}.text-center{text-align:center!important}.text-5xl{font-size:clamp(2.5rem,8vw,4rem)!important;font-weight:800!important;letter-spacing:-.04em!important;line-height:1.1!important;color:#1e293b!important}.text-2xl{font-size:1.5rem!important}.text-xl{font-size:1.25rem!important}.text-lg{font-size:1.125rem!important}.text-sm{font-size:.875rem!important}.text-xs{font-size:.75rem!important}.bg-clip-text{-webkit-background-clip:text!important;background-clip:text!important}.text-transparent{color:transparent!important}.bg-gradient-to-r{background-image:linear-gradient(to right,var(--primary),var(--secondary))!important}.text-slate-400{color:var(--text-muted)!important}.text-indigo-400{color:var(--primary)!important}.glass{background:var(--glass-bg);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border:1px solid var(--glass-border);border-radius:20px}.glass-card{background:var(--bg-card);backdrop-filter:blur(24px);-webkit-backdrop-filter:blur(24px);border:1px solid var(--glass-border);border-radius:32px;box-shadow:0 20px 25px -5px #0000000d,0 10px 10px -5px #00000005;transition:transform .4s cubic-bezier(.175,.885,.32,1.275)}.btn-primary{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;padding:14px 28px;border-radius:16px;border:none;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);display:inline-flex;align-items:center;justify-content:center;gap:10px;text-decoration:none;box-shadow:0 4px 15px #6366f133}.btn-primary:hover{transform:translateY(-3px) scale(1.02);box-shadow:0 10px 25px #6366f14d;filter:brightness(1.05)}.btn-secondary{background:#00000008;color:var(--text-main);padding:12px 24px;border-radius:14px;border:1px solid rgba(0,0,0,.05);font-weight:500;cursor:pointer;transition:all .3s ease;text-decoration:none}.btn-secondary:hover{background:#0000000f;border-color:#0000001a}.ad-placeholder{min-height:100px;width:100%;display:flex;align-items:center;justify-content:center;background:#00000005;border:1px dashed rgba(0,0,0,.1);border-radius:16px;color:var(--text-muted);font-size:.8rem;margin:12px 0}@keyframes fadeIn{0%{opacity:0;transform:translateY(30px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .8s cubic-bezier(.16,1,.3,1) forwards}@keyframes gradient{0%{background-position:0% 50%}50%{background-position:100% 50%}to{background-position:0% 50%}}.animate-gradient{animation:gradient 6s ease infinite}.bg-purple-500{background-color:#a855f7!important}.text-purple-500{color:#a855f7!important}.bg-indigo-500{background-color:#6366f1!important}.text-indigo-500{color:#6366f1!important}.fixed{position:fixed!important}.inset-0{top:0;right:0;bottom:0;left:0}.z-100{z-index:9999!important}.bg-black\/80{background-color:#0f172ab3!important}.backdrop-blur-sm{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px)}.w-full{width:100%!important}.max-w-4xl{max-width:900px!important}.max-w-lg{max-width:540px!important}.custom-scrollbar::-webkit-scrollbar{width:6px}.custom-scrollbar::-webkit-scrollbar-thumb{background:#0000001a;border-radius:10px}.p-2\.5{padding:.625rem!important}.rounded-xl{border-radius:.75rem!important}.hidden{display:none!important}.upload-dropzone{border:2px dashed rgba(99,102,241,.3);border-radius:1rem;padding:2.5rem;display:flex;flex-direction:column;align-items:center;justify-content:center;transition:all .3s cubic-bezier(.4,0,.2,1);cursor:pointer;background-color:#6366f10d;margin-bottom:0}.upload-dropzone:hover{background-color:#fff;border-color:#6366f1cc;transform:translateY(-3px) scale(1.02);box-shadow:0 10px 25px #6366f14d}.upload-dropzone.dragging{background-color:#6366f133;border-color:#6366f1;transform:scale(.98);box-shadow:inset 0 2px 4px #0000000f}.upload-icon-wrapper{padding:1.25rem;border-radius:9999px;margin-bottom:1.25rem;transition:all .3s cubic-bezier(.4,0,.2,1);background-color:#6366f133;color:#6366f1}.upload-dropzone:hover .upload-icon-wrapper{background-color:#6366f1;color:#fff;transform:scale(1.1) translateY(-3px);box-shadow:0 10px 15px -3px #6366f14d}.upload-dropzone.dragging .upload-icon-wrapper{background-color:#6366f1;color:#fff;transform:scale(1.1)}.upload-text{font-size:1.25rem;font-weight:600;margin-bottom:.5rem;transition:color .3s ease}.upload-dropzone:hover .upload-text{color:#4f46e5}.group:hover .group-hover\:scale-125{transform:scale(1.25)!important}.group:hover .group-hover\:text-indigo-600{color:#4f46e5!important}.group:hover .group-hover\:font-extrabold{font-weight:800!important}.group:hover .group-hover\:text-slate-600{color:#475569!important}.group:hover .group-hover\:scale-110{transform:scale(1.1)!important}.hover\:scale-\[1\.02\]:hover{transform:scale(1.02)!important}.hover\:shadow-xl:hover{box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a!important}.hover\:shadow-indigo-500\/10:hover{box-shadow:0 20px 25px -5px #6366f11a,0 10px 10px -5px #6366f10a!important}.hover\:border-indigo-200:hover{border-color:#c7d2fe!important}.text-slate-800{color:#1e293b!important}.text-slate-500{color:#64748b!important}.font-bold{font-weight:700!important}.transition-all{transition:all .3s ease!important}.transition-colors{transition:color .3s ease!important}.transition-transform{transition:transform .5s ease!important}.duration-300{transition-duration:.3s!important}.duration-500{transition-duration:.5s!important}.block{display:block!important}.h-full{height:100%!important}.rounded-2xl{border-radius:1rem!important}.border{border-width:1px!important}.border-slate-100{border-color:#f1f5f9!important}.btn-primary:hover{transform:scale(1.05)!important;box-shadow:0 25px 50px -12px #6366f14d!important;transition:all .3s ease!important}.btn-primary{transition:all .3s ease!important}.export-format-section{padding:1.35rem 1.25rem 1.5rem;border-radius:24px;background:linear-gradient(155deg,#6366f112,#8b5cf60d 45%,#ffffffbf);border:1px solid rgba(99,102,241,.14);box-shadow:0 4px 24px #6366f112,inset 0 1px #ffffffe6}.export-format-heading{display:flex;align-items:flex-start;gap:.85rem;margin-bottom:1.25rem;padding-bottom:1rem;border-bottom:1px solid rgba(99,102,241,.1)}.export-format-heading-accent{flex-shrink:0;width:2.5rem;height:2.5rem;border-radius:14px;display:flex;align-items:center;justify-content:center;color:#fff;background:linear-gradient(135deg,var(--primary),var(--secondary));box-shadow:0 6px 18px #6366f159}.export-format-heading-text{min-width:0;padding-top:.1rem}.export-format-title{font-size:1.05rem;font-weight:700;letter-spacing:-.02em;color:#1e293b;margin-bottom:.2rem;line-height:1.25}.export-format-subtitle{font-size:.82rem;color:var(--text-muted);line-height:1.45;font-weight:500}.export-format-group{margin-top:1.1rem}.export-format-group:first-of-type{margin-top:0}.export-format-group-label{display:block;font-size:.68rem;font-weight:700;text-transform:uppercase;letter-spacing:.08em;color:#64748b;margin-bottom:.65rem}.export-format-grid{display:grid;gap:.7rem;grid-template-columns:repeat(2,minmax(0,1fr))}@media(min-width:640px){.export-format-grid--office{grid-template-columns:repeat(3,minmax(0,1fr))}}.export-format-card{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:1rem .65rem .95rem;min-height:6.5rem;border-radius:18px;cursor:pointer;border:1px solid rgba(99,102,241,.14);background:#ffffffe0;backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);transition:transform .22s cubic-bezier(.34,1.2,.64,1),box-shadow .22s ease,border-color .22s ease,background .22s ease;font-family:var(--font-main)}.export-format-card:hover{transform:translateY(-3px);border-color:#6366f159;box-shadow:0 14px 32px #6366f124}.export-format-card:focus-visible{outline:none;box-shadow:0 0 0 3px #6366f159}.export-format-card--active{border-color:#6366f18c;background:linear-gradient(165deg,#6366f124,#fffffff2 55%);box-shadow:0 10px 28px #6366f12e,inset 0 1px #ffffffd9}.export-format-card--active:hover{transform:translateY(-2px)}.export-format-card-icon{width:2.85rem;height:2.85rem;border-radius:16px;display:flex;align-items:center;justify-content:center;margin-bottom:.55rem;background:#6366f11c;color:var(--primary);transition:background .22s ease,color .22s ease,box-shadow .22s ease,transform .22s ease}.export-format-card-icon--image{background:#06b6d41a;color:#0891b2}.export-format-card--active .export-format-card-icon{background:linear-gradient(135deg,var(--primary),var(--secondary));color:#fff;box-shadow:0 6px 16px #6366f159;transform:scale(1.04)}.export-format-card--active .export-format-card-icon--image{background:linear-gradient(135deg,#06b6d4,#6366f1);box-shadow:0 6px 16px #06b6d44d}.export-format-card-label{font-size:.8rem;font-weight:600;color:#334155;line-height:1.35;padding:0 .15rem}.export-format-card--active .export-format-card-label{color:#312e81}.export-format-hint{margin-top:1.1rem;padding:.85rem 1rem;border-radius:14px;font-size:.8rem;line-height:1.55;color:#475569;background:#6366f10f;border-left:4px solid var(--primary);box-shadow:inset 0 1px #fff9}