@import"https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@300;400;500;600;700&family=Roboto+Condensed:ital,wght@0,300;0,400;0,600;0,700;1,400&display=swap";:root{--color-navy: #1C3163;--color-navy-dark: #152549;--color-navy-mid: #243d7a;--color-gold: #D4AF37;--color-gold-light: #F5CB5C;--color-gold-dark: #d39e29;--color-ivory: #f7f2e8;--color-ivory-dark: #ede5d5;--color-bg: var(--color-ivory);--color-surface: #ffffff;--color-surface-hover: var(--color-ivory-dark);--color-surface-elevated: #faf7f1;--color-primary: var(--color-gold);--color-primary-light: var(--color-gold-light);--color-primary-dark: var(--color-gold-dark);--color-primary-dim: rgba(212, 175, 55, .15);--color-btn: var(--color-gold);--color-btn-light: var(--color-gold-light);--color-btn-dim: rgba(212, 175, 55, .15);--color-accent: var(--color-navy);--color-accent-mid: var(--color-navy-mid);--color-text: var(--color-navy);--color-text-muted: #5b6b8a;--color-text-inverse: #ffffff;--color-error: #c0392b;--color-success: #1a7a4a;--color-warning: #b8860b;--font-sans: "Roboto Condensed", "Noto Sans Thai", "Helvetica Neue", Arial, sans-serif;--radius-sm: 4px;--radius-md: 8px;--radius-lg: 14px;--radius-xl: 20px;--radius-full: 9999px;--shadow-sm: 0 1px 3px rgba(28, 49, 99, .08);--shadow-md: 0 4px 16px rgba(28, 49, 99, .1);--shadow-lg: 0 10px 32px rgba(28, 49, 99, .14);--shadow-glow: 0 0 18px rgba(212, 175, 55, .25);--gradient-gold: linear-gradient(135deg, var(--color-gold-light) 0%, var(--color-gold-dark) 100%);--gradient-navy: linear-gradient(135deg, var(--color-navy-mid) 0%, var(--color-navy) 100%);--gradient-brand: linear-gradient(135deg, var(--color-navy) 0%, var(--color-navy-mid) 50%, var(--color-gold-dark) 100%);--transition-fast: .15s cubic-bezier(.4, 0, .2, 1);--transition-normal: .25s cubic-bezier(.4, 0, .2, 1)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--color-bg);color:var(--color-text);line-height:1.55;letter-spacing:.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;min-height:100vh;scrollbar-gutter:stable}a{color:var(--color-navy);text-decoration:none;transition:color var(--transition-fast)}a:hover{color:var(--color-gold-dark)}input,select,textarea{font-family:var(--font-sans);color:var(--color-text)}button{font-family:var(--font-sans);cursor:pointer}.layout-container{max-width:1280px;margin:0 auto;padding:0 1rem}@media (min-width: 768px){.layout-container{padding:0 1.5rem}}.main-content{flex:1;padding:1.5rem 0 3rem}@media (max-width: 767px){.main-content{padding:.75rem 0 2rem}}.glass{background:#f7f2e8eb;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);border-bottom:1px solid rgba(212,175,55,.2)}.card{background:var(--color-surface);border-radius:var(--radius-lg);padding:1.5rem;box-shadow:var(--shadow-md);border:1px solid rgba(28,49,99,.06);transition:transform var(--transition-fast),box-shadow var(--transition-fast)}@media (hover: hover){.card:hover{transform:translateY(-2px);box-shadow:var(--shadow-lg)}}@media (max-width: 768px){.card{padding:1rem}}.btn-primary{background:var(--gradient-gold);color:var(--color-navy);font-weight:700;font-family:var(--font-sans);letter-spacing:.04em;text-transform:uppercase;font-size:.875rem;padding:.7rem 1.5rem;border-radius:var(--radius-md);border:none;transition:all var(--transition-fast);box-shadow:0 3px 12px #d4af374d}.btn-primary:hover{transform:translateY(-1px);box-shadow:0 6px 20px #d4af3773;filter:brightness(1.05)}.btn-primary:disabled{opacity:.5;cursor:not-allowed;transform:none}@media (max-width: 768px){.btn-primary,.btn-secondary{padding:.85rem 1.25rem;font-size:.95rem}}.btn-secondary{background:transparent;color:var(--color-navy);font-weight:600;font-family:var(--font-sans);letter-spacing:.03em;font-size:.875rem;padding:.7rem 1.5rem;border-radius:var(--radius-md);border:1.5px solid rgba(28,49,99,.25);transition:all var(--transition-fast)}.btn-secondary:hover{border-color:var(--color-navy);background:#1c31630d}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.input{width:100%;padding:.75rem 1rem;background:var(--color-ivory);border:1.5px solid rgba(28,49,99,.18);border-radius:var(--radius-md);color:var(--color-text);font-family:var(--font-sans);font-size:.9rem;transition:border-color var(--transition-fast),box-shadow var(--transition-fast)}.input:focus{outline:none;border-color:var(--color-gold);box-shadow:0 0 0 3px var(--color-primary-dim)}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:var(--color-ivory-dark)}::-webkit-scrollbar-thumb{background:#1c316340;border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--color-navy)}@keyframes fadeIn{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}.animate-fade-in{animation:fadeIn var(--transition-normal) forwards}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}.gold-bar{height:3px;background:var(--gradient-gold);border-radius:var(--radius-full)}.badge{display:inline-flex;align-items:center;padding:.2rem .65rem;border-radius:var(--radius-full);font-size:.72rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}.badge-active{background:#1a7a4a1f;color:var(--color-success);border:1px solid rgba(26,122,74,.25)}.badge-inactive{background:#1c316314;color:var(--color-text-muted);border:1px solid rgba(28,49,99,.15)}.badge-gold{background:#d4af3726;color:var(--color-gold-dark);border:1px solid rgba(212,175,55,.3)}.mobile-only{display:block}.desktop-only{display:none}@media (min-width: 768px){.mobile-only{display:none}.desktop-only{display:block}}.responsive-grid{display:grid;grid-template-columns:1fr;gap:1rem}@media (min-width: 768px){.responsive-grid.grid-2{grid-template-columns:repeat(2,1fr)}.responsive-grid.grid-3{grid-template-columns:repeat(3,1fr)}.responsive-grid.grid-4{grid-template-columns:repeat(4,1fr)}}.responsive-flex{display:flex;flex-direction:column;gap:1rem}@media (min-width: 768px){.responsive-flex{flex-direction:row;align-items:center}}.stack-on-mobile{display:flex;flex-direction:column;gap:1rem}@media (min-width: 768px){.stack-on-mobile{flex-direction:row}}.hide-on-mobile{display:none}@media (min-width: 768px){.hide-on-mobile{display:inherit}}.app-wrapper{min-height:100vh;display:flex;flex-direction:column}.main-content{flex:1;padding:2rem 0}