@import "https://fonts.googleapis.com/css2?family=Noto+Serif+Thai:wght@400;600;700&family=Sarabun:wght@300;400;500;600;700&display=swap";:root{--bg-primary:#0a0514;--bg-secondary:#130a2b;--gold:#d4af37;--gold-light:#f9e596;--gold-dark:#aa8222;--gold-glow:#d4af3766;--mystic-purple:#8a2be2;--mystic-pink:#ff1493;--mystic-blue:#4169e1;--mystic-glow:#8a2be280;--text-primary:#fdfbf7;--text-secondary:#cbb9df;--text-muted:#807299;--border-glass:#ffffff14;--border-gold:#d4af374d;--glass-bg:#130a2b99;--glass-bg-hover:#23144bb3;--shadow-glass:0 8px 32px 0 #0000005e;--shadow-glow:0 0 20px var(--mystic-glow);--shadow-gold:0 0 15px var(--gold-glow);--radius:16px;--radius-lg:24px;--radius-full:9999px;--font-heading:"Noto Serif Thai", serif;--font-body:"Sarabun", sans-serif;--indigo:#8a2be2;--indigo-light:#a95ce8}*{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;font-size:16px}body{font-family:var(--font-body);background-color:var(--bg-primary);color:var(--text-primary);background-image:radial-gradient(circle at 15%,#8a2be214 0%,#0000 50%),radial-gradient(circle at 85% 30%,#4169e114 0%,#0000 50%),radial-gradient(circle at 50% 80%,#d4af370d 0%,#0000 50%);min-height:100vh;line-height:1.6;overflow-x:hidden}body:before{content:"";opacity:.35;z-index:-1;pointer-events:none;background-image:radial-gradient(1px 1px at 20px 30px,#fffc,#0000),radial-gradient(1px 1px at 40px 70px,#fff9,#0000),radial-gradient(2px 2px at 90px 40px,#d4af37cc,#0000),radial-gradient(1px 1px at 160px 120px,#ffffffb3,#0000);background-repeat:repeat;background-size:200px 200px;width:100%;height:100%;animation:16s ease-in-out infinite starsTwinkle;position:fixed;top:0;left:0}#root{flex-direction:column;min-height:100vh;display:flex}h1,h2,h3,h4,h5,h6{font-family:var(--font-heading);letter-spacing:.02em;font-weight:600;line-height:1.3}.text-gradient-gold{color:var(--gold-light);text-shadow:0 0 20px #d4af3733}.text-gradient-mystic{color:#e0c3fc;text-shadow:0 0 20px #e0c3fc26}a{color:inherit;text-decoration:none;transition:all .3s}button{font-family:var(--font-body);cursor:pointer;border:none;outline:none}input,select,textarea{font-family:var(--font-body);border:1px solid var(--border-glass);color:var(--text-primary);border-radius:var(--radius);background:#ffffff0d;outline:none;transition:all .3s}input:focus,select:focus,textarea:focus{border-color:var(--mystic-purple);background:#ffffff14;box-shadow:0 0 10px #8a2be233}.container{z-index:1;max-width:1100px;margin:0 auto;padding:0 20px;position:relative}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(12px);border:1px solid var(--border-glass);border-radius:var(--radius);box-shadow:var(--shadow-glass);transition:all .4s cubic-bezier(.175,.885,.32,1.275)}.glass-panel-hover:hover{box-shadow:var(--shadow-glass), 0 0 20px #8a2be226;border-color:#d4af374d;transform:translateY(-4px)}.glass-nav{-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-glass);background:#0a0514b3;box-shadow:0 4px 30px #0003}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#8a2be24d;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--mystic-purple)}@keyframes fadeIn{0%{opacity:0;filter:blur(4px);transform:translateY(20px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes slideUp{0%{opacity:0;filter:blur(6px);transform:translateY(40px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes slideDown{0%{opacity:0;filter:blur(4px);transform:translateY(-30px)}to{opacity:1;filter:blur();transform:translateY(0)}}@keyframes float{0%,to{transform:translateY(0)rotate(0)}50%{transform:translateY(-18px)rotate(1deg)}}@keyframes float-slow{0%,to{transform:translateY(0)rotate(0)}25%{transform:translateY(-15px)rotate(1deg)}50%{transform:translateY(-25px)rotate(2deg)}75%{transform:translateY(-15px)rotate(1deg)}to{transform:translateY(0)rotate(0)}}@keyframes pulse-glow{0%,to{box-shadow:0 0 15px var(--mystic-glow);opacity:.8}50%{opacity:1;box-shadow:0 0 40px #8a2be2e6,inset 0 0 20px #8a2be24d}}@keyframes pulse-glow-gold{0%,to{box-shadow:0 0 15px var(--gold-glow);opacity:.85}50%{opacity:1;box-shadow:0 0 35px #d4af37cc,inset 0 0 15px #d4af3733}}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}@keyframes starsTwinkle{0%{opacity:.15;filter:blur(1px);transform:scale(.8)}50%{opacity:.6;filter:blur();transform:scale(1.1)}to{opacity:.15;filter:blur(1px);transform:scale(.8)}}@keyframes magicSparkle{0%,to{opacity:0;filter:blur(8px);transform:scale(0)rotate(0)}50%{opacity:1;filter:blur();transform:scale(1.2)rotate(180deg)}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes mysticalGlow{0%,to{text-shadow:0 0 10px #8a2be24d,0 0 20px #8a2be21a;filter:brightness()}50%{text-shadow:0 0 20px #8a2be2cc,0 0 40px #8a2be266,0 0 60px #d4af3733;filter:brightness(1.1)}}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.fade-in{animation:1.4s cubic-bezier(.25,.46,.45,.94) forwards fadeIn}.slide-up{animation:1.8s cubic-bezier(.34,1.56,.64,1) forwards slideUp}.float-anim{animation:6s ease-in-out infinite float}.btn-magic{background:linear-gradient(135deg, var(--mystic-purple), #4a5abf);color:#fff;border-radius:var(--radius-full);z-index:1;border:1px solid #fff3;padding:12px 32px;font-weight:600;transition:all .3s;position:relative;overflow:hidden;box-shadow:0 4px 15px #8a2be266}.btn-magic:before{content:"";z-index:-1;background:linear-gradient(90deg,#0000,#ffffff4d,#0000);width:50%;height:100%;transition:all .5s;position:absolute;top:0;left:-100%;transform:skew(-20deg)}.btn-magic:hover{border-color:var(--gold-light);transform:translateY(-2px);box-shadow:0 8px 25px #8a2be299}.btn-magic:hover:before{left:150%}.glow-effect{background:radial-gradient(circle, var(--mystic-glow) 0%, transparent 70%);filter:blur(20px);z-index:-1;pointer-events:none;border-radius:50%;width:150px;height:150px;position:absolute}.chat-page-root{overflow:hidden}.chat-page-root .navbar-desktop{position:relative}.chat-page-root footer{display:none!important}.glow-gold{background:radial-gradient(circle, var(--gold-glow) 0%, transparent 70%);filter:blur(20px);z-index:-1;pointer-events:none;border-radius:50%;width:150px;height:150px;position:absolute}@media (width<=640px){.nav-links-desktop{display:none!important}.nav-hamburger,.nav-bottom-bar{display:block!important}main{padding-bottom:80px}.container{padding:0 16px}}@media (width>=641px) and (width<=1024px){.container{padding:0 20px}}.back-button:focus-visible{outline:2px solid var(--gold-light);outline-offset:2px}@media (prefers-reduced-motion:reduce){*{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0}to{opacity:1}}@keyframes slideDown{0%{opacity:0}to{opacity:1}}@keyframes float{0%{transform:none}to{transform:none}}@keyframes float-slow{0%{transform:none}to{transform:none}}@keyframes pulse-glow{0%{box-shadow:0 0 15px var(--mystic-glow)}to{box-shadow:0 0 15px var(--mystic-glow)}}@keyframes pulse-glow-gold{0%{box-shadow:0 0 15px var(--gold-glow)}to{box-shadow:0 0 15px var(--gold-glow)}}@keyframes shimmer{0%,to{opacity:.7}50%{opacity:1}}@keyframes twinkle{0%,to{opacity:.3}50%{opacity:1}}@keyframes float-anim{0%,to{transform:translateY(0)}50%{transform:translateY(-clamp(4px, 1vw, 6px))}}}