:root{--color-primary:#1d9bf0;--color-primary-hover:#1a8cd8;--color-primary-light:#e8f5fd;--color-primary-bg:#eff6ff;--color-secondary:#536471;--color-secondary-hover:#3d4c56;--color-bg:#fff;--color-bg-primary:#fff;--color-bg-secondary:#f7f9f9;--color-surface:#fff;--color-surface-hover:#f7f9f9;--color-surface-soft:#f8fafc;--color-surface-soft-alt:#f2f8fd;--color-surface-glass-soft:#ffffffb8;--color-surface-glass:#ffffffdb;--color-surface-glass-strong:#ffffffeb;--color-surface-glass-intense:#fffffff5;--color-text-primary:#0f1419;--color-text-secondary:#536471;--color-text-muted:#8b98a5;--color-text-tertiary:#5b6474;--color-text-inverse:#fff;--color-border:#eff3f4;--color-border-soft:#0f172a14;--color-border-strong:#0f172a24;--color-border-accent-soft:#1d9bf03d;--color-border-focus:#1d9bf0;--color-focus-ring:#1d9bf01f;--color-error:#f4212e;--color-danger:#f4212e;--color-error-bg:#fef2f2;--color-error-light:#fef2f2;--color-error-soft:#ef44441f;--color-success:#00ba7c;--color-success-light:#f0fdf4;--color-success-soft:#10b9811f;--color-success-foreground:#0f766e;--color-warning:#ffd400;--color-warning-bg:#fffbeb;--color-warning-light:#fffbeb;--color-warning-soft:#ffd4002e;--color-warning-foreground:#7b6200;--color-error-foreground:#b91c1c;--color-muted-soft:#0f14190d;--color-overlay-soft:#0f172a0a;--color-backdrop:#0f172a7a;--color-media-overlay:#0009;--color-media-overlay-hover:#000c;--gradient-surface-subtle:linear-gradient(180deg, #f7fafcfa 0%, #fffffffa 100%);--gradient-surface-soft:linear-gradient(180deg, #f8fafcfa 0%, #fffffffa 100%);--gradient-page-hero:var(--gradient-page-hero);--gradient-topic-hero:var(--gradient-topic-hero);--gradient-brand-surface:var(--gradient-brand-surface);--gradient-brand-surface-soft:var(--gradient-brand-surface-soft);--space-1:.25rem;--space-2:.5rem;--space-3:.75rem;--space-4:1rem;--space-5:1.25rem;--space-6:1.5rem;--space-8:2rem;--space-10:2.5rem;--space-12:3rem;--space-16:4rem;--space-20:5rem;--font-family:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans Thai", sans-serif;--font-mono:ui-monospace, SFMono-Regular, "SF Mono", Menlo, Consolas, monospace;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:.9375rem;--font-size-md:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:1.875rem;--font-size-4xl:2.25rem;--font-weight-normal:400;--font-weight-medium:500;--font-weight-semibold:600;--font-weight-bold:700;--font-weight-extrabold:800;--line-height-tight:1.25;--line-height-normal:1.5;--line-height-relaxed:1.75;--radius-sm:.25rem;--radius-md:.5rem;--radius-lg:1rem;--radius-xl:1.25rem;--radius-2xl:1.5rem;--radius-full:9999px;--shadow-sm:0 1px 2px #0000000a;--shadow-md:0 2px 8px #00000014;--shadow-lg:0 4px 16px #0000001f;--shadow-xl:0 25px 50px -12px #0f172a38;--z-dropdown:10;--z-sticky:20;--z-modal-backdrop:30;--z-modal:40;--z-toast:50;--transition-fast:.15s ease;--transition-normal:.2s ease;--max-width:1200px;--header-height:53px;--sidebar-width:280px}[data-theme=dark]{--color-primary:#1d9bf0;--color-primary-hover:#4db1f5;--color-primary-light:#1a2c3d;--color-primary-bg:#1d9bf02e;--color-secondary:#8b98a5;--color-secondary-hover:#a3b0bb;--color-bg:#000;--color-bg-primary:#16181c;--color-bg-secondary:#16181c;--color-surface:#16181c;--color-surface-hover:#1d1f23;--color-surface-soft:#1a1d21;--color-surface-soft-alt:#13212c;--color-surface-glass-soft:#16181cbd;--color-surface-glass:#16181cdb;--color-surface-glass-strong:#16181ceb;--color-surface-glass-intense:#16181cf5;--color-text-primary:#e7e9ea;--color-text-secondary:#8b98a5;--color-text-muted:#6e767d;--color-text-tertiary:#9ca8b3;--color-text-inverse:#0f1419;--color-border:#2f3336;--color-border-soft:#ffffff14;--color-border-strong:#ffffff29;--color-border-accent-soft:#1d9bf052;--color-border-focus:#1d9bf0;--color-focus-ring:#1d9bf038;--color-error:#f4212e;--color-danger:#f4212e;--color-error-bg:#2d1215;--color-error-light:#2d1215;--color-error-soft:#f4212e2e;--color-success:#00ba7c;--color-success-light:#0d2b1f;--color-success-soft:#00ba7c2e;--color-success-foreground:#6ee7c7;--color-warning:#ffd400;--color-warning-bg:#2b2500;--color-warning-light:#2b2500;--color-warning-soft:#ffd4002e;--color-warning-foreground:#ffd86b;--color-error-foreground:#ff8a94;--color-muted-soft:#ffffff14;--color-overlay-soft:#ffffff0f;--color-backdrop:#000000b8;--color-media-overlay:#000000a3;--color-media-overlay-hover:#000000d1;--gradient-surface-subtle:linear-gradient(180deg, #181b1ffa 0%, #121418fa 100%);--gradient-surface-soft:linear-gradient(180deg, #1b1f24fa 0%, #121418fa 100%);--gradient-page-hero:linear-gradient(180deg, #0f1419 0%, #16181c 100%);--gradient-topic-hero:linear-gradient(145deg, #1b1710 0%, #14181d 50%, #0f1a25 100%);--gradient-brand-surface:linear-gradient(135deg, #16181c 0%, #13212c 100%);--gradient-brand-surface-soft:linear-gradient(180deg, #1d9bf029, #16181c);--shadow-sm:0 1px 2px #ffffff0a;--shadow-md:0 2px 8px #ffffff0f;--shadow-lg:0 4px 16px #ffffff14;--shadow-xl:0 25px 50px -12px #00000073}
*,:before,:after{box-sizing:border-box}*{margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%;background-color:var(--color-bg-secondary);--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light}html[data-theme=dark]{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark}body{font-family:var(--font-family);font-size:var(--font-size-base);line-height:var(--line-height-normal);color:var(--color-text-primary);background-color:var(--color-bg-secondary);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;letter-spacing:-.01em;transition:background-color var(--transition-normal), color var(--transition-normal)}a{color:var(--color-primary);text-decoration:none}a:hover{text-decoration:underline}::selection{background:var(--color-primary-light);color:var(--color-primary)}:focus-visible{outline:2px solid var(--color-border-focus);outline-offset:2px}img,picture,video,canvas,svg{max-width:100%;display:block}input,button,textarea,select{font:inherit}input,textarea,select{color:var(--color-text-primary)}::placeholder{color:var(--color-text-muted)}button{cursor:pointer}ul,ol{list-style:none}
.visually-hidden{clip:rect(0, 0, 0, 0);white-space:nowrap;border-width:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}.container{width:100%;max-width:var(--max-width);padding-left:var(--space-4);padding-right:var(--space-4);margin-left:auto;margin-right:auto}.flex-center{justify-content:center;align-items:center;display:flex}.text-truncate{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}