*,:after,:before{box-sizing:border-box}body,html{margin:0;padding:0;font-family:var(--font-sans,"Inter","Sarabun",system-ui,sans-serif);background-color:var(--color-bg-app,#f4f6f9);color:var(--color-text-primary,#0b1020);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}:root{--color-navy-950:#050c1a;--color-navy-900:#0b1020;--color-navy-800:#121829;--color-navy-700:#1c2540;--color-navy-600:#253060;--color-navy-500:#2e3c7a;--color-navy-400:#3d4f9a;--color-gold-600:#d4a017;--color-gold-500:#f5b800;--color-gold-400:#ffc107;--color-gold-300:#ffca28;--color-gold-200:#ffd95a;--color-gold-100:#fff3cc;--color-status-healthy:#22c55e;--color-status-degraded:#f59e0b;--color-status-down:#ef4444;--color-status-dev:#3b82f6;--color-status-healthy-subtle:rgba(34,197,94,0.12);--color-status-degraded-subtle:rgba(245,158,11,0.12);--color-status-down-subtle:rgba(239,68,68,0.12);--color-status-dev-subtle:rgba(59,130,246,0.12);--color-status-healthy-border:rgba(34,197,94,0.30);--color-status-degraded-border:rgba(245,158,11,0.30);--color-status-down-border:rgba(239,68,68,0.30);--color-status-dev-border:rgba(59,130,246,0.30);--color-text-on-danger:#ffffff}:root,html[data-theme=light]{color-scheme:light;--color-bg-app:#f4f6f9;--color-bg-card:#ffffff;--color-bg-input:#ffffff;--color-bg-subtle:#edf0f5;--color-bg-overlay:rgba(0,0,0,0.40);--color-bg-surface:var(--color-bg-card);--color-bg-muted:var(--color-bg-subtle);--color-text-primary:#0b1020;--color-text-secondary:#5a677d;--color-text-muted:#5e6d82;--color-text-inverse:#ffffff;--color-text-on-gold:#0b1020;--color-border-default:#e2e8f0;--color-border-strong:#c5ced9;--color-border-focus:#f5b800;--color-sidebar-bg:var(--color-navy-900);--color-sidebar-text:rgba(255,255,255,0.85);--color-sidebar-text-muted:rgba(255,255,255,0.45);--color-sidebar-active-bg:rgba(245,184,0,0.15);--color-sidebar-active-text:var(--color-gold-500);--color-sidebar-border:rgba(255,255,255,0.08);--color-sidebar-hover-bg:rgba(255,255,255,0.06);--color-primary:var(--color-gold-500);--color-primary-hover:var(--color-gold-400);--color-primary-active:var(--color-gold-600);--color-primary-subtle:var(--color-gold-100);--color-focus-ring:rgba(245,184,0,0.20);--color-gold-tint:rgba(245,184,0,0.20);--color-scrollbar-thumb:rgba(255,255,255,0.10);--color-bg-sidebar:var(--color-bg-card);--color-bg-active:var(--color-primary-subtle);--color-bg-hover:rgba(0,0,0,0.04);--color-brand-primary:var(--color-primary);--color-brand-primary-light:var(--color-primary-subtle);--color-text-disabled:#b0bec5;--color-error:var(--color-status-down);--color-error-500:var(--color-status-down);--color-error-bg:var(--color-status-down-subtle);--color-error-border:var(--color-status-down-border);--color-success:var(--color-status-healthy);--color-success-500:var(--color-status-healthy);--color-success-bg:var(--color-status-healthy-subtle);--color-success-dark:#15803d;--color-warning:var(--color-status-degraded);--color-warning-500:var(--color-status-degraded);--color-warning-bg:var(--color-status-degraded-subtle);--color-warning-border:var(--color-status-degraded-border);--color-warning-fg:#d97706}.dark,html[data-theme=dark]{color-scheme:dark;--color-bg-app:#0b1020;--color-bg-card:#121829;--color-bg-input:#1c2540;--color-bg-subtle:#172030;--color-bg-overlay:rgba(0,0,0,0.60);--color-bg-surface:var(--color-bg-card);--color-bg-muted:var(--color-bg-subtle);--color-text-primary:#e8ecf4;--color-text-secondary:#a0aec0;--color-text-muted:#8899ad;--color-text-inverse:#0b1020;--color-text-on-gold:#0b1020;--color-border-default:#253060;--color-border-strong:#2e3c7a;--color-border-focus:#f5b800;--color-sidebar-bg:var(--color-navy-900);--color-sidebar-text:rgba(255,255,255,0.85);--color-sidebar-text-muted:rgba(255,255,255,0.45);--color-sidebar-active-bg:rgba(245,184,0,0.15);--color-sidebar-active-text:var(--color-gold-500);--color-sidebar-border:rgba(255,255,255,0.08);--color-sidebar-hover-bg:rgba(255,255,255,0.06);--color-primary:var(--color-gold-500);--color-primary-hover:var(--color-gold-400);--color-primary-active:var(--color-gold-600);--color-primary-subtle:rgba(245,184,0,0.12);--color-bg-sidebar:var(--color-bg-card);--color-bg-active:var(--color-primary-subtle);--color-bg-hover:rgba(255,255,255,0.06);--color-brand-primary:var(--color-primary);--color-brand-primary-light:var(--color-primary-subtle);--color-text-disabled:#5e6d82;--color-error:var(--color-status-down);--color-error-500:var(--color-status-down);--color-error-bg:var(--color-status-down-subtle);--color-error-border:var(--color-status-down-border);--color-success:var(--color-status-healthy);--color-success-500:var(--color-status-healthy);--color-success-bg:var(--color-status-healthy-subtle);--color-success-dark:#4ade80;--color-warning:var(--color-status-degraded);--color-warning-500:var(--color-status-degraded);--color-warning-bg:var(--color-status-degraded-subtle);--color-warning-border:var(--color-status-degraded-border);--color-warning-fg:#fbbf24}@media (prefers-color-scheme:dark){html[data-theme=system]{color-scheme:dark;--color-bg-app:#0b1020;--color-bg-card:#121829;--color-bg-input:#1c2540;--color-bg-subtle:#172030;--color-bg-overlay:rgba(0,0,0,0.60);--color-bg-surface:var(--color-bg-card);--color-bg-muted:var(--color-bg-subtle);--color-text-primary:#e8ecf4;--color-text-secondary:#a0aec0;--color-text-muted:#63758a;--color-text-inverse:#0b1020;--color-text-on-gold:#0b1020;--color-border-default:#253060;--color-border-strong:#2e3c7a;--color-border-focus:#f5b800;--color-primary-subtle:rgba(245,184,0,0.12);--color-bg-sidebar:var(--color-bg-card);--color-bg-active:var(--color-primary-subtle);--color-bg-hover:rgba(255,255,255,0.06);--color-brand-primary:var(--color-primary);--color-brand-primary-light:var(--color-primary-subtle);--color-text-disabled:#5e6d82;--color-error:var(--color-status-down);--color-error-500:var(--color-status-down);--color-error-bg:var(--color-status-down-subtle);--color-error-border:var(--color-status-down-border);--color-success:var(--color-status-healthy);--color-success-500:var(--color-status-healthy);--color-success-bg:var(--color-status-healthy-subtle);--color-success-dark:#4ade80;--color-warning:var(--color-status-degraded);--color-warning-500:var(--color-status-degraded);--color-warning-bg:var(--color-status-degraded-subtle);--color-warning-border:var(--color-status-degraded-border);--color-warning-fg:#fbbf24}}:root{--space-0:0px;--space-1:4px;--space-2:8px;--space-3:12px;--space-4:16px;--space-5:20px;--space-6:24px;--space-8:32px;--space-10:40px;--space-12:48px;--space-16:64px;--space-20:80px;--space-24:96px;--font-sans:"Inter","Sarabun",system-ui,-apple-system,sans-serif;--font-mono:"JetBrains Mono","Fira Code",ui-monospace,monospace;--text-xs:0.75rem;--text-sm:0.875rem;--text-base:1rem;--text-lg:1.125rem;--text-xl:1.25rem;--text-2xl:1.5rem;--text-3xl:1.875rem;--text-4xl:2.25rem;--leading-tight:1.25;--leading-snug:1.375;--leading-normal:1.5;--leading-relaxed:1.625;--font-normal:400;--font-medium:500;--font-semibold:600;--font-bold:700;--tracking-tight:-0.01em;--tracking-normal:0em;--tracking-wide:0.01em;--tracking-wider:0.05em;--radius-none:0px;--radius-sm:4px;--radius-md:8px;--radius-lg:12px;--radius-xl:16px;--radius-2xl:24px;--radius-full:9999px;--shadow-xs:0 1px 2px rgba(11,16,32,0.06);--shadow-sm:0 1px 4px rgba(11,16,32,0.08);--shadow-card:0 1px 4px rgba(11,16,32,0.08),0 4px 16px rgba(11,16,32,0.04);--shadow-md:0 4px 12px rgba(11,16,32,0.10);--shadow-lg:0 8px 24px rgba(11,16,32,0.12);--shadow-dropdown:0 8px 24px rgba(11,16,32,0.12);--shadow-modal:0 20px 60px rgba(11,16,32,0.20)}.dark,html[data-theme=dark]{--shadow-xs:0 1px 2px rgba(0,0,0,0.20);--shadow-sm:0 1px 4px rgba(0,0,0,0.25);--shadow-card:0 1px 4px rgba(0,0,0,0.25),0 4px 16px rgba(0,0,0,0.20);--shadow-md:0 4px 12px rgba(0,0,0,0.30);--shadow-lg:0 8px 24px rgba(0,0,0,0.35);--shadow-dropdown:0 8px 24px rgba(0,0,0,0.35);--shadow-modal:0 20px 60px rgba(0,0,0,0.50)}@media (prefers-color-scheme:dark){html[data-theme=system]{--shadow-xs:0 1px 2px rgba(0,0,0,0.20);--shadow-sm:0 1px 4px rgba(0,0,0,0.25);--shadow-card:0 1px 4px rgba(0,0,0,0.25),0 4px 16px rgba(0,0,0,0.20);--shadow-md:0 4px 12px rgba(0,0,0,0.30);--shadow-lg:0 8px 24px rgba(0,0,0,0.35);--shadow-dropdown:0 8px 24px rgba(0,0,0,0.35);--shadow-modal:0 20px 60px rgba(0,0,0,0.50)}}:root{--z-base:0;--z-raised:10;--z-dropdown:100;--z-sticky:200;--z-modal:300;--z-toast:400;--z-tooltip:500;--transition-fast:100ms ease;--transition-base:150ms ease;--transition-slow:250ms ease;--transition-theme:200ms ease;--locale-currency:"THB";--locale-primary:"th"}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}