@import "https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700;800;900&family=Noto+Sans+Thai:wght@300;400;500;600;700;800&display=swap";.toast-container{z-index:9999;gap:var(--space-3);pointer-events:none;flex-direction:column;display:flex;position:fixed;top:24px;right:24px}@keyframes toast-enter{0%{opacity:0;transform:translate(120%)scale(.9)}to{opacity:1;transform:translate(0)scale(1)}}@keyframes toast-exit{0%{opacity:1;transform:translate(0)scale(1)}to{opacity:0;transform:translate(120%)scale(.9)}}.toast{align-items:center;gap:var(--space-3);border-radius:var(--radius-xl);font-size:var(--font-size-sm);pointer-events:auto;will-change:transform, opacity;min-width:280px;max-width:420px;padding:14px 20px;font-weight:600;display:flex;position:relative;overflow:hidden;box-shadow:0 10px 25px -5px #00000026,0 8px 10px -6px #00000026}.toast.enter{animation:.4s cubic-bezier(.34,1.56,.64,1) forwards toast-enter}.toast.exit{animation:.3s cubic-bezier(.47,0,.745,.715) forwards toast-exit}.toast-icon{background:#ffffff40;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;font-size:12px;font-weight:800;display:flex;box-shadow:inset 0 1px 1px #fff3}.toast-message{flex:1;line-height:1.4}.toast-success{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%);border:1px solid #10b98133}.toast-error{color:#fff;background:linear-gradient(135deg,#ef4444 0%,#dc2626 100%);border:1px solid #ef444433}.toast-info{color:#fff;background:linear-gradient(135deg,#3b82f6 0%,#2563eb 100%);border:1px solid #3b82f633}@keyframes toast-progress{0%{width:100%}to{width:0%}}.toast-progress-bar{background:#fff6;height:3.5px;animation-name:toast-progress;animation-timing-function:linear;animation-fill-mode:forwards;position:absolute;bottom:0;left:0}@media (width<=640px){.toast-container{top:16px;left:16px;right:16px}.toast{width:100%;min-width:auto}@keyframes toast-enter-mobile{0%{opacity:0;transform:translateY(-50px)}to{opacity:1;transform:translateY(0)}}@keyframes toast-exit-mobile{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-50px)}}.toast.enter{animation:.35s cubic-bezier(.34,1.56,.64,1) forwards toast-enter-mobile}.toast.exit{animation:.25s cubic-bezier(.47,0,.745,.715) forwards toast-exit-mobile}}.loader-center{justify-content:center;align-items:center;gap:var(--space-4);flex-direction:column;width:100%;min-height:300px;display:flex}.loader{justify-content:center;align-items:center;display:flex;position:relative}.loader-sm{width:24px;height:24px}.loader-md{width:44px;height:44px}.loader-lg{width:64px;height:64px}.loader-ring{border:2.5px solid var(--gray-100);border-top:2.5px solid var(--primary-500);border-radius:50%;animation:.8s cubic-bezier(.5,.1,.4,.9) infinite loaderSpin;position:absolute;inset:0}.loader:after{content:"";border:2px solid #0000;border-bottom:2px solid var(--primary-300);opacity:.6;border-radius:50%;animation:1.2s linear infinite loaderSpinReverse;position:absolute;inset:8px}.loader-lg:after{inset:12px}.loader-sm:after{border-width:1.5px;inset:4px}@keyframes loaderSpin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes loaderSpinReverse{0%{transform:rotate(360deg)}to{transform:rotate(0)}}.loader-text{font-size:var(--font-size-sm);color:var(--text-muted);letter-spacing:.5px;font-weight:600;animation:2s ease-in-out infinite pulse}@keyframes pulse{0%,to{opacity:.5}50%{opacity:1}}:root{--primary-50:#f973160a;--primary-100:#f9731614;--primary-200:#fed7aa;--primary-300:#fdba74;--primary-400:#fb923c;--primary-500:#f97316;--primary-600:#ea580c;--primary-700:#c2410c;--primary-800:#9a3412;--primary-900:#7c2d12;--primary-gradient:linear-gradient(135deg, #f97316, #ea580c);--kuru-50:#f973160a;--kuru-100:#f9731614;--kuru-200:#fed7aa;--kuru-300:#fdba74;--kuru-400:#fb923c;--kuru-500:#f97316;--kuru-600:#ea580c;--kuru-700:#c2410c;--kuru-gradient:linear-gradient(135deg, #f97316, #ea580c);--deca-50:#eff6ff;--deca-100:#dbeafe;--deca-200:#bfdbfe;--deca-300:#93c5fd;--deca-400:#60a5fa;--deca-500:#3b82f6;--deca-600:#2563eb;--deca-700:#1d4ed8;--deca-gradient:linear-gradient(135deg, #3b82f6, #2563eb);--gray-50:#f9fafb;--gray-100:#f3f4f6;--gray-200:#e5e7eb;--gray-300:#d1d5db;--gray-400:#9ca3af;--gray-500:#6b7280;--gray-600:#4b5563;--gray-700:#374151;--gray-800:#1f2937;--gray-900:#111827;--success:#16a34a;--success-bg:#f0fdf4;--success-border:#bbf7d0;--warning:#d97706;--warning-bg:#fffbeb;--warning-border:#fde68a;--error:#dc2626;--error-bg:#fef2f2;--error-border:#fecaca;--info:#2563eb;--surface-bg:#fff;--surface-page:#fff;--surface-card:#fff;--surface-elevated:#fff;--surface-muted:#fff;--border-light:#1118271f;--border-default:#1118274d;--text-primary:#111827;--text-secondary:#4b5563;--text-muted:#6b7280;--text-inverse:#fff;--font-sans:"Inter", "Noto Sans Thai", system-ui, -apple-system, sans-serif;--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;--font-size-5xl:3rem;--font-size-6xl:3.75rem;--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;--space-24:6rem;--space-32:8rem;--radius-sm:.25rem;--radius-md:.25rem;--radius-lg:0;--radius-xl:.25rem;--radius-2xl:.25rem;--radius-full:9999px;--shadow-xs:0 1px 2px #0000000d;--shadow-sm:0 1px 3px #00000014, 0 1px 2px #0000000a;--shadow-md:0 4px 6px -1px #00000014, 0 2px 4px -2px #0000000a;--shadow-lg:0 10px 15px -3px #00000014, 0 4px 6px -4px #00000008;--shadow-xl:0 20px 25px -5px #00000014, 0 8px 10px -6px #00000008;--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-base:.2s cubic-bezier(.4, 0, .2, 1);--transition-slow:.3s cubic-bezier(.4, 0, .2, 1);--container-max:1100px;--header-height:60px}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;overflow-x:hidden}body{font-family:var(--font-sans);font-size:var(--font-size-base);color:var(--text-primary);background-color:var(--surface-page);min-height:100dvh;padding-bottom:env(safe-area-inset-bottom);line-height:1.6;overflow-x:hidden}a{color:inherit;text-decoration:none}ul,ol{list-style:none}img{max-width:100%;display:block}button{cursor:pointer;touch-action:manipulation;background:0 0;border:none;font-family:inherit}input,select,textarea{font-family:inherit;font-size:inherit;touch-action:manipulation}.container{width:100%;max-width:var(--container-max);padding-left:var(--space-4);padding-right:var(--space-4);margin:0 auto}.sr-only{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.btn{justify-content:center;align-items:center;gap:var(--space-2);padding:var(--space-3) var(--space-5);font-size:var(--font-size-sm);border-radius:var(--radius-lg);transition:all var(--transition-base);white-space:nowrap;touch-action:manipulation;border:1px solid #0000;font-weight:600;line-height:1.25;display:inline-flex}.btn:hover:not(:disabled){transform:translateY(-1px)}.btn:active{transform:scale(.98)}.btn:disabled{opacity:.5;cursor:not-allowed;transform:none}.btn-primary{background:var(--primary-600);color:#fff;box-shadow:var(--shadow-sm)}.btn-primary:hover:not(:disabled){background:var(--primary-700);box-shadow:var(--shadow-md)}.btn-secondary{background:var(--deca-600);color:#fff;box-shadow:var(--shadow-sm)}.btn-secondary:hover:not(:disabled){background:var(--deca-700);box-shadow:var(--shadow-md)}.btn-ghost{color:var(--text-secondary);background:0 0;border:1px solid #0000}.btn-ghost:hover:not(:disabled){background:var(--gray-50);border-color:var(--border-default);color:var(--text-primary)}.btn-outline{border:1px solid var(--border-default);color:var(--text-secondary);background:0 0}.btn-outline:hover:not(:disabled){background:var(--gray-50);border-color:var(--text-primary);color:var(--text-primary)}.btn-danger{background:var(--error);color:#fff}.btn-danger:hover:not(:disabled){background:#b91c1c}.btn-sm{padding:var(--space-2) var(--space-3);font-size:var(--font-size-xs)}.btn-lg{padding:var(--space-4) var(--space-8);font-size:var(--font-size-base)}.btn-full{width:100%}.input-group{gap:var(--space-1);flex-direction:column;display:flex}.input-label{font-size:var(--font-size-sm);color:var(--text-secondary);font-weight:500}.input{width:100%;padding:10px var(--space-4);background:var(--surface-bg);border:1px solid var(--border-default);border-radius:var(--radius-lg);color:var(--text-primary);font-size:var(--font-size-base);transition:all var(--transition-base);outline:none}.input::placeholder{color:var(--text-muted);font-size:var(--font-size-sm);opacity:.85}.input:focus{border-color:var(--primary-500);box-shadow:0 0 0 3px #f973161f}.input-error{border-color:var(--error)!important;box-shadow:0 0 0 3px #dc26261a!important}.error-message{font-size:var(--font-size-xs);color:var(--error);margin-top:2px}.card{background:var(--surface-card);border:1px solid var(--border-light);border-radius:var(--radius-xl);box-shadow:var(--shadow-sm)}.drawer-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:2000;opacity:0;visibility:hidden;transition:opacity var(--transition-base), visibility var(--transition-base);will-change:opacity;background:#0f172a80;justify-content:flex-end;display:flex;position:fixed;inset:0}.drawer-overlay.open{opacity:1;visibility:visible}.drawer-container{background:var(--surface-card);border-left:1px solid var(--border-light);width:100%;max-width:500px;height:100dvh;transition:transform var(--transition-base);will-change:transform;flex-direction:column;display:flex;overflow:hidden;transform:translate(100%);box-shadow:-10px 0 30px #0003}.drawer-overlay.open .drawer-container{transform:translate(0,0)}@media (width<=640px){.drawer-container{border-left:none;border-radius:0;max-width:100%;transform:translateY(100%)}}.empty-state{text-align:center;padding:var(--space-16) var(--space-4);flex-direction:column;justify-content:center;align-items:center;display:flex}.empty-icon{width:56px;height:56px;margin:0 auto var(--space-4);background:var(--gray-100);color:var(--text-muted);font-size:var(--font-size-xl);border-radius:50%;justify-content:center;align-items:center;display:flex}.empty-state h3{font-size:var(--font-size-lg);color:var(--text-primary);margin-bottom:var(--space-2);font-weight:600}.empty-state p{color:var(--text-muted);font-size:var(--font-size-sm);margin-bottom:var(--space-1)}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}@keyframes slideInUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes fadeInDown{0%{opacity:0;transform:translateY(-12px)}to{opacity:1;transform:translateY(0)}}@keyframes slideInRightSmall{0%{opacity:0;transform:translate(16px)}to{opacity:1;transform:translate(0)}}@keyframes spin{to{transform:rotate(360deg)}}.animate-fade-in{animation:.3s ease-out both fadeIn}.animate-fade-in-up{animation:.35s ease-out both fadeInUp}.animate-fade-in-down{animation:.3s ease-out both fadeInDown}.animate-scale-in{animation:.35s ease-out both fadeInUp}.delay-1{animation-delay:50ms;animation-fill-mode:both}.delay-2{animation-delay:.1s;animation-fill-mode:both}.delay-3{animation-delay:.15s;animation-fill-mode:both}.delay-4{animation-delay:.2s;animation-fill-mode:both}.delay-5{animation-delay:.25s;animation-fill-mode:both}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:var(--gray-100)}::-webkit-scrollbar-thumb{background:var(--gray-300);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--gray-400)}
