@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@100;200;300;400;500;600;700&display=swap";@import"https://fonts.googleapis.com/css2?family=Playpen+Sans+Thai:wght@100..800&display=swap";.loading-warp{position:fixed;top:0;left:0;width:100vw;height:100vh;z-index:2147483647;background-size:cover;background-position:center;background-image:url(https://thasalabaanrao.net/pictures/Banner03.jpg);opacity:0;pointer-events:none}.loading-warp.fade-in{animation:blurFadeIn .8s cubic-bezier(.16,1,.3,1) forwards;pointer-events:all}.loading-warp.fade-out{animation:blurFadeOut .6s cubic-bezier(.16,1,.3,1) forwards;pointer-events:none}.loading-screen.new{--accent: #3b82f6;--accent-2: #60a5fa;--surface: rgba(15, 23, 42, .65);--surface-border: rgba(255, 255, 255, .08);--text: #f8fafc;position:relative;width:100%;height:100%;padding:0 20px;color:var(--text);display:flex;flex-direction:column;align-items:center;justify-content:center;background-color:#070d19bf;backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);overflow:hidden}.loading-card.glass{background:var(--surface);border:1px solid var(--surface-border);box-shadow:0 15px 40px #0006;padding:32px 40px;border-radius:20px;display:flex;flex-direction:column;align-items:center;gap:12px}.animate-fade-up{opacity:0;transform:translateY(30px) scale(.95);animation:slideUpFade .8s cubic-bezier(.16,1,.3,1) .2s forwards}.animate-fade-up.delay{animation-delay:.4s}@keyframes blurFadeIn{0%{opacity:0;backdrop-filter:blur(0px)}to{opacity:1;backdrop-filter:blur(16px)}}@keyframes blurFadeOut{0%{opacity:1;backdrop-filter:blur(16px)}to{opacity:0;backdrop-filter:blur(0px)}}@keyframes slideUpFade{to{opacity:1;transform:translateY(0) scale(1)}}.bg-orb{position:absolute;width:420px;height:420px;border-radius:50%;filter:blur(100px);opacity:.25;animation:float 15s ease-in-out infinite;pointer-events:none}.orb-1{background:var(--accent);top:-10%;left:-10%}.orb-2{background:#1e293b;bottom:-10%;right:-10%}@keyframes float{0%,to{transform:translateY(0) scale(1)}50%{transform:translateY(-20px) scale(1.05)}}.logo-stack{position:relative;max-width:100px;max-height:100px;display:flex;align-items:center;justify-content:center}.logo-image{width:64px;height:64px;border-radius:14px;object-fit:cover;box-shadow:0 4px 15px #0006}.logo-stack .halo{position:absolute;inset:-12px;border-radius:50%;background:radial-gradient(closest-side,rgba(59,130,246,.25),transparent);filter:blur(10px);animation:breathe 3s ease-in-out infinite;z-index:-1}@keyframes breathe{0%,to{transform:scale(.9);opacity:.5}50%{transform:scale(1.1);opacity:1}}.spinner{margin-top:8px}.spinner-svg{width:60px;height:60px;transform-origin:center;animation:spin 2s linear infinite}.spinner-svg .track{fill:none;stroke:#ffffff0d;stroke-width:4}.spinner-svg .arc{fill:none;stroke:var(--accent);stroke-width:4;stroke-linecap:round;stroke-dasharray:80 200;stroke-dashoffset:0;animation:dash 1.5s ease-in-out infinite}@keyframes spin{to{transform:rotate(360deg)}}@keyframes dash{0%{stroke-dasharray:1 200;stroke-dashoffset:0}50%{stroke-dasharray:90 200;stroke-dashoffset:-35}to{stroke-dasharray:90 200;stroke-dashoffset:-124}}.loading-text{font-size:1.1rem;font-weight:600;margin-top:10px;letter-spacing:.5px;color:var(--text)}.loading-tip{font-size:.9rem;color:#94a3b8;min-height:20px}.loading-message{font-size:.85rem;color:#64748b;margin-top:20px}.loading-progress{width:280px;height:6px;background-color:#ffffff14;border-radius:999px;overflow:hidden;margin-top:10px;position:relative}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--accent-2));border-radius:inherit;box-shadow:0 0 10px #3b82f666}.loading-progress.is-indeterminate .progress-fill{position:absolute;width:40%;animation:indet 1.5s cubic-bezier(.65,0,.35,1) infinite}@keyframes indet{0%{left:-40%;width:40%}50%{left:30%;width:60%}to{left:100%;width:40%}}.notfound-container{min-height:100vh;width:100%;display:flex;align-items:center;justify-content:center;background-color:#f8fafc;padding:20px}.notfound-content{background:#fff;padding:50px 40px;border-radius:24px;box-shadow:0 10px 40px #0000000d;text-align:center;max-width:480px;width:100%}.notfound-icon{color:#94a3b8;margin-bottom:24px;display:flex;justify-content:center;animation:float-icon 3s ease-in-out infinite}.notfound-title{font-size:1.5rem;font-weight:700;color:#1e293b;margin-bottom:12px}.notfound-message{font-size:.95rem;color:#64748b;line-height:1.6;margin-bottom:32px}.notfound-actions{display:flex;gap:16px;justify-content:center;flex-wrap:wrap}.notfound-btn{display:flex;align-items:center;gap:8px;padding:12px 24px;border-radius:99px;font-size:.95rem;font-weight:600;cursor:pointer;transition:all .2s ease;border:none}.btn-outline{background:transparent;border:2px solid #e2e8f0;color:#475569}.btn-outline:hover{background:#f1f5f9;border-color:#cbd5e1}.btn-primary{background:#3b82f6;color:#fff;box-shadow:0 4px 14px #3b82f64d}.btn-primary:hover{background:#2563eb;transform:translateY(-2px)}.animate-fade-up{animation:fadeUp .6s cubic-bezier(.16,1,.3,1) forwards}@keyframes fadeUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}@keyframes float-icon{0%,to{transform:translateY(0)}50%{transform:translateY(-10px)}}*{font-family:IBM Plex Sans Thai,sans-serif;box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}@keyframes fade{0%{opacity:0}to{opacity:1}}@keyframes fadeIn{0%{transform:scale(.95);opacity:0}to{transform:scale(1);opacity:1}}@keyframes fadeOut{0%{transform:scale(1);opacity:1}to{transform:scale(.95);opacity:0}}@keyframes scale-up{0%{scale:.95;opacity:0}to{scale:1;opacity:1}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.animate-fade-top{transform:translateY(50px)}.animate-fade-left{transform:translate(50px)}.animate-fade-right{transform:translate(-50px)}.animate-fade-bottom{transform:translateY(-50px)}.animate-fade-right,.animate-fade-left,.animate-fade-top,.animate-fade-bottom{opacity:0;will-change:opacity,transform,filter;filter:blur(5px);transition:all .8s cubic-bezier(.25,1,.5,1)!important}.animate-fade-top.show,.animate-fade-left.show,.animate-fade-right.show,.animate-fade-bottom.show{opacity:1;transform:translate(0);filter:blur(0)}.delay-1{transition-delay:.1s!important}.delay-2{transition-delay:.25s!important}.delay-3{transition-delay:.4s!important}.delay-4{transition-delay:.55s!important}.delay-5{transition-delay:.7s!important}.show:hover{transition-delay:0s!important}
