:root{--bg-primary:#08080a;--bg-secondary:#111115;--bg-tertiary:#191921;--accent-gold:#f59e0b;--accent-gold-rgb:245, 158, 11;--accent-gold-hover:#d97706;--accent-red:#dc2626;--accent-red-hover:#b91c1c;--accent-green:#10b981;--accent-green-rgb:16, 185, 129;--text-primary:#f3f4f6;--text-secondary:#a1a1aa;--text-muted:#52525b;--border-color:#27272a;--border-glow:#f59e0b26;--shadow-sm:0 2px 4px #00000080;--shadow-md:0 4px 12px #0009;--shadow-lg:0 8px 24px #000c;--glow-gold:0 0 15px #f59e0b59;--glow-gold-lg:0 0 25px #f59e0b80;--glow-green:0 0 15px #10b98159;--glass-bg:#111115cc;--glass-border:#ffffff0d;--glass-blur:blur(12px);--font-epic:"Cinzel", serif;--font-ui:"Inter", sans-serif;--font-thai:"Sarabun", sans-serif;--transition-fast:.2s cubic-bezier(.4, 0, .2, 1);--transition-normal:.3s cubic-bezier(.4, 0, .2, 1);--transition-slow:.5s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-primary);color:var(--text-primary);font-family:var(--font-thai), var(--font-ui), sans-serif;line-height:1.6;overflow-x:hidden}::-webkit-scrollbar{width:10px;height:10px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:var(--bg-tertiary);border:2px solid var(--bg-primary);transition:var(--transition-fast);border-radius:6px}::-webkit-scrollbar-thumb:hover{background:var(--accent-gold);box-shadow:var(--glow-gold)}#root{flex-direction:column;min-height:100vh;display:flex}main{flex-grow:1}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes pulseGlow{0%,to{box-shadow:0 0 10px #f59e0b4d}50%{box-shadow:0 0 22px #f59e0b99}}@keyframes float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes spin-slow{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes slideInRight{0%{transform:translate(100%)}to{transform:translate(0)}}.animate-fade-in{animation:fadeIn var(--transition-normal) forwards}.font-epic{font-family:var(--font-epic)}.text-gold{color:var(--accent-gold)}.gradient-text-gold{background:linear-gradient(135deg, #fff 10%, var(--accent-gold) 60%, var(--accent-gold-hover) 100%);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.btn{cursor:pointer;transition:all var(--transition-fast);font-weight:600;font-family:var(--font-thai), var(--font-ui), sans-serif;border:none;border-radius:8px;justify-content:center;align-items:center;gap:8px;padding:10px 20px;text-decoration:none;display:inline-flex}.btn-gold{background:linear-gradient(135deg, var(--accent-gold), var(--accent-gold-hover));color:#000;box-shadow:var(--glow-gold)}.btn-gold:hover{box-shadow:var(--glow-gold-lg);filter:brightness(1.1);transform:translateY(-2px)}.btn-gold:active{transform:translateY(0)}.btn-outline{border:1px solid var(--accent-gold);color:var(--accent-gold);background:0 0}.btn-outline:hover{box-shadow:var(--glow-gold);background:#f59e0b1a;transform:translateY(-2px)}.btn-danger{background:var(--accent-red);color:#fff}.btn-danger:hover{background:var(--accent-red-hover);transform:translateY(-2px)}.btn-dark{background:var(--bg-tertiary);color:var(--text-primary);border:1px solid var(--border-color)}.btn-dark:hover{background:var(--border-color);color:#fff;transform:translateY(-2px)}.glass-panel{background:var(--glass-bg);border:1px solid var(--glass-border);-webkit-backdrop-filter:var(--glass-blur);backdrop-filter:var(--glass-blur);box-shadow:var(--shadow-lg);border-radius:12px}.input-field{background:var(--bg-primary);border:1px solid var(--border-color);width:100%;color:var(--text-primary);font-family:var(--font-thai), sans-serif;transition:all var(--transition-fast);border-radius:8px;padding:12px 16px;font-size:1rem}.input-field:focus{border-color:var(--accent-gold);box-shadow:var(--glow-gold);outline:none}.section-title{font-family:var(--font-epic);text-transform:uppercase;letter-spacing:2px;margin-bottom:2rem;font-size:2.2rem;font-weight:800;display:inline-block;position:relative}.section-title:after{content:"";background:linear-gradient(90deg, transparent, var(--accent-gold), transparent);width:100%;height:2px;position:absolute;bottom:-8px;left:0}.no-scrollbar::-webkit-scrollbar{display:none}.no-scrollbar{-ms-overflow-style:none;scrollbar-width:none}