@import"https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@300;400;500;600;700&family=Prompt:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&display=swap";:root{--bg-dark: #090d16;--bg-card: rgba(18, 26, 41, .85);--bg-card-hover: rgba(26, 37, 58, .95);--accent-gold: #d4af37;--accent-gold-hover: #e5c158;--accent-amber: #f59e0b;--border-gold: rgba(212, 175, 55, .35);--border-subtle: rgba(51, 65, 85, .6);--text-white: #ffffff;--text-body: #cbd5e1;--text-muted: #94a3b8}body{font-family:Prompt,IBM Plex Sans Thai,sans-serif;color:var(--text-body);background-color:var(--bg-dark);overflow-x:hidden;letter-spacing:.01em}.bg-mesh-pattern{background-image:radial-gradient(circle at 15% 20%,rgba(212,175,55,.08) 0%,transparent 40%),radial-gradient(circle at 85% 60%,rgba(37,99,235,.08) 0%,transparent 40%)}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:#05080e}::-webkit-scrollbar-thumb{background:#2a364f;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--accent-gold)}h1,h2,h3,h4,h5,h6{font-family:Prompt,sans-serif;letter-spacing:-.01em}.btn-primary{background:linear-gradient(135deg,#d4af37,#b8860b);color:#05080e;font-weight:700;border:1px solid rgba(255,235,170,.3);transition:all .3s cubic-bezier(.16,1,.3,1);box-shadow:0 10px 25px -5px #d4af374d}.btn-primary:hover{transform:translateY(-2px) scale(1.01);box-shadow:0 16px 35px -5px #d4af3773;background:linear-gradient(135deg,#e5c158,#c5a059)}.btn-primary:active{transform:translateY(0)}.btn-secondary{background-color:#121a29d9;color:#fff;border:1px solid var(--border-gold);transition:all .3s ease}.btn-secondary:hover{background-color:#d4af371f;border-color:var(--accent-gold);color:#fef08a;transform:translateY(-2px)}.nav-link{padding:.5rem .9rem;border-radius:.75rem;font-size:.875rem;font-weight:500;color:#94a3b8;transition:all .25s ease}.nav-link:hover,.nav-link.active{color:#fff;background-color:#1e293bb3}.nav-link.active{color:var(--accent-gold);font-weight:600}.mobile-nav-link{display:block;padding:.75rem 1rem;border-radius:.75rem;font-size:.95rem;font-weight:500;color:#cbd5e1;transition:background .2s ease}.mobile-nav-link:hover,.mobile-nav-link.active{background-color:#1e293b;color:var(--accent-gold)}.card-glass{background:var(--bg-card);-webkit-backdrop-filter:blur(16px);backdrop-filter:blur(16px);border:1px solid var(--border-subtle);box-shadow:0 12px 35px -10px #0009;transition:all .35s cubic-bezier(.16,1,.3,1)}.card-glass:hover{border-color:var(--border-gold);box-shadow:0 20px 40px -10px #d4af3726;transform:translateY(-3px)}.hero-opt-btn{background:transparent;color:#94a3b8;border:1px solid transparent}.hero-opt-btn:hover{color:#fff}.hero-opt-btn.active{background:linear-gradient(135deg,#d4af37,#b8860b);color:#05080e;font-weight:700;box-shadow:0 4px 15px #d4af3759}.form-input{width:100%;background-color:#0d131f;border:1px solid #28354d;border-radius:.75rem;padding:.7rem 1rem;font-size:.875rem;color:#fff;transition:border-color .25s ease,box-shadow .25s ease}.form-input:focus{outline:none;border-color:var(--accent-gold);box-shadow:0 0 0 3px #d4af3733}.form-input::placeholder{color:#64748b}.cat-filter-btn,.port-filter-btn{background-color:#0d131f;color:#94a3b8;border:1px solid #28354d}.cat-filter-btn:hover,.port-filter-btn:hover{border-color:#475569;color:#fff}.cat-filter-btn.active,.port-filter-btn.active{background:linear-gradient(135deg,#d4af37,#b8860b);color:#05080e;border-color:var(--accent-gold);font-weight:700}.portrait-gold-frame{position:relative;border-radius:1.5rem;padding:4px;background:linear-gradient(135deg,#d4af3799,#33415566,#d4af3766);box-shadow:0 25px 50px -12px #000c,0 0 30px #d4af3726}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn .4s cubic-bezier(.16,1,.3,1) forwards}