:root{--color-bg:#fff;--color-bg-surface:#fafafa;--color-bg-card:#fff;--color-bg-hover:#f4f4f5;--color-accent:#0f766e;--color-accent-hover:#115e59;--color-accent-light:#ecfdf5;--color-accent-bright:#14b8a6;--color-accent-glow:#14b8a62e;--color-text:#09090b;--color-text-secondary:#3f3f46;--color-text-muted:#71717a;--color-text-dim:#a1a1aa;--color-border:#e4e4e7;--color-border-light:#f4f4f5;--color-error:#ef4444;--color-error-bg:#fef2f2;--color-success:#059669;--color-success-bg:#ecfdf5;--font-display:"PixelMplus12-Regular", monospace;--font-body:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", sans-serif;--font-mono:"SF Mono", "JetBrains Mono", "Fira Code", "Fira Mono", "Roboto Mono", monospace;--font-size-xs:.75rem;--font-size-sm:.875rem;--font-size-base:1rem;--font-size-lg:1.125rem;--font-size-xl:1.25rem;--font-size-2xl:1.5rem;--font-size-3xl:2rem;--font-size-4xl:2.5rem;--font-size-5xl:3.5rem;--space-xs:.25rem;--space-sm:.5rem;--space-12:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:3rem;--space-3xl:4rem;--space-4xl:6rem;--max-width:960px;--content-width:720px;--nav-height:56px;--radius-sm:8px;--radius:10px;--radius-lg:14px;--radius-xl:20px;--shadow-sm:0 1px 2px 0 #0000000a;--shadow:0 2px 4px -1px #0000000f, 0 1px 2px -1px #0000000a;--shadow-lg:0 8px 16px -4px #00000014, 0 4px 6px -2px #0000000a;--shadow-glow:0 0 0 3px var(--color-accent-glow);--ease-out:cubic-bezier(.16, 1, .3, 1);--ease-in-out:cubic-bezier(.4, 0, .2, 1);--transition-fast:.12s var(--ease-out);--transition:.2s var(--ease-out);--transition-slow:.32s var(--ease-out)}:root[data-theme=dark]{--color-bg:#09090b;--color-bg-surface:#111113;--color-bg-card:#18181b;--color-bg-hover:#27272a;--color-accent:#2dd4bf;--color-accent-hover:#5eead4;--color-accent-light:#2dd4bf1a;--color-accent-bright:#2dd4bf;--color-accent-glow:#2dd4bf40;--color-text:#fafafa;--color-text-secondary:#d4d4d8;--color-text-muted:#a1a1aa;--color-text-dim:#71717a;--color-border:#27272a;--color-border-light:#1f1f22;--color-error:#f87171;--color-error-bg:#ef44441a;--color-success:#34d399;--color-success-bg:#34d3991a;--shadow-sm:0 1px 2px 0 #0000004d;--shadow:0 2px 4px -1px #0006, 0 1px 2px -1px #0000004d;--shadow-lg:0 8px 16px -4px #00000080, 0 4px 6px -2px #0000004d}*,:before,:after{box-sizing:border-box;margin:0;padding:0}html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}body{font-family:var(--font-body);font-size:var(--font-size-base);color:var(--color-text);background:var(--color-bg);-webkit-font-smoothing:antialiased;min-height:100vh;line-height:1.6}a{color:var(--color-accent);transition:color var(--transition-fast);text-decoration:none}a:hover{color:var(--color-accent-hover)}img{max-width:100%;display:block}button{cursor:pointer;font-family:inherit}input,select,textarea{font-family:inherit;font-size:inherit;color:var(--color-text)}::selection{background:var(--color-accent-light);color:var(--color-text)}.container{width:100%;max-width:var(--max-width);padding:0 var(--space-lg);margin:0 auto}.content-container{width:100%;max-width:var(--content-width);padding:0 var(--space-lg);margin:0 auto}.sr-only{clip:rect(0,0,0,0);border:0;width:1px;height:1px;margin:-1px;padding:0;position:absolute;overflow:hidden}@font-face{font-family:PixelMplus12-Regular;font-style:normal;font-display:optional;src:url(/fonts/PixelMplus12-Regular.ttf)format("truetype")}a:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[tabindex]:focus-visible{box-shadow:var(--shadow-glow);border-radius:var(--radius-sm);transition:box-shadow var(--transition-fast);outline:none}@media (prefers-reduced-motion:reduce){*,:before,:after{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}.navbar{z-index:100;background:var(--color-bg-card);border-bottom:1px solid var(--color-border);height:var(--nav-height);position:sticky;top:0}.navbar-inner{height:100%;max-width:var(--max-width);padding:0 var(--space-lg);align-items:center;gap:var(--space-xl);margin:0 auto;display:flex}.navbar-logo{font-family:var(--font-display);font-size:var(--font-size-lg);color:var(--color-text);white-space:nowrap;transition:color var(--transition-fast);align-items:normal;gap:var(--space-sm);flex-shrink:0;font-weight:700;display:flex}.navbar-logo:hover{color:var(--color-accent)}.navbar-logo-icon{flex-shrink:0}.navbar-links{align-items:center;gap:var(--space-xs);flex:1;list-style:none;display:flex}.navbar-link{padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-muted);border-radius:var(--radius-sm);transition:color var(--transition-fast), background var(--transition-fast);white-space:nowrap;border-bottom:2px solid #0000;font-weight:500;display:block}.navbar-link:hover{color:var(--color-text);background:var(--color-bg-hover)}.navbar-link.active{color:var(--color-text);border-bottom-color:var(--color-accent)}.nav-dropdown{position:relative}.nav-dropdown-trigger{align-items:center;gap:var(--space-xs);padding:var(--space-xs) var(--space-sm);font-size:var(--font-size-sm);color:var(--color-text-muted);border-radius:var(--radius-sm);cursor:pointer;transition:color var(--transition-fast), background var(--transition-fast);background:0 0;border:none;border-bottom:2px solid #0000;font-weight:500;display:flex}.nav-dropdown-trigger:hover{color:var(--color-text);background:var(--color-bg-hover)}.nav-dropdown-trigger.active{color:var(--color-text);border-bottom-color:var(--color-accent)}.nav-dropdown-arrow{transition:transform var(--transition-fast);font-size:.6em}.nav-dropdown.open .nav-dropdown-arrow{transform:rotate(180deg)}.nav-dropdown-menu{margin-top:var(--space-xs);background:var(--color-bg-card);border:1px solid var(--color-border);border-radius:var(--radius);min-width:208px;padding:var(--space-xs);box-shadow:var(--shadow-lg);flex-direction:column;display:none;position:absolute;top:100%;left:0}.nav-dropdown.open .nav-dropdown-menu{display:flex}.nav-dropdown-item{padding:var(--space-sm) var(--space-md);font-size:var(--font-size-sm);color:var(--color-text-muted);border-radius:var(--radius-sm);transition:color var(--transition-fast), background var(--transition-fast);display:block}.nav-dropdown-item:hover{color:var(--color-text);background:var(--color-bg-hover)}.nav-dropdown-item.active{color:var(--color-accent);background:var(--color-accent-light)}.theme-toggle{border:1px solid var(--color-border);border-radius:var(--radius-sm);width:36px;height:36px;color:var(--color-text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;flex-shrink:0;justify-content:center;align-items:center;display:flex}.theme-toggle:hover{color:var(--color-text);background:var(--color-bg-hover)}.breadcrumb{padding:var(--space-md) 0;font-size:var(--font-size-sm);color:var(--color-text-muted);border-bottom:1px solid var(--color-border-light)}.breadcrumb-inner{max-width:var(--max-width);padding:0 var(--space-lg);align-items:center;gap:var(--space-xs);flex-wrap:wrap;margin:0 auto;display:flex}.breadcrumb-item{color:var(--color-text-muted);transition:color var(--transition-fast)}.breadcrumb-item:hover{color:var(--color-text)}.breadcrumb-item.current{color:var(--color-text);font-weight:500}.breadcrumb-sep{color:var(--color-text-dim);user-select:none}.footer{border-top:1px solid var(--color-border);padding:var(--space-4xl) 0 var(--space-xl);margin-top:var(--space-4xl);background:var(--color-bg)}:root[data-theme=dark] .footer{background:var(--color-bg-surface)}.footer-inner{max-width:var(--max-width);padding:0 var(--space-lg);justify-content:space-between;align-items:flex-start;gap:var(--space-xl);flex-wrap:wrap;margin:0 auto;display:flex}.footer-brand{font-family:var(--font-display);font-size:var(--font-size-lg);color:var(--color-text);transition:color var(--transition-fast);font-weight:700}.footer-brand:hover{color:var(--color-accent)}.footer-tagline{color:var(--color-text-muted);font-size:var(--font-size-sm);margin-top:var(--space-xs)}.footer-links{gap:var(--space-lg);display:flex}.footer-links a{font-size:var(--font-size-sm);color:var(--color-text-muted);transition:color var(--transition-fast)}.footer-links a:hover{color:var(--color-text)}.footer-bottom{max-width:var(--max-width);margin:var(--space-xl) auto 0;padding:var(--space-lg) var(--space-lg) 0;border-top:1px solid var(--color-border-light);text-align:center;font-size:var(--font-size-xs);color:var(--color-text-dim)}.footer-badges{margin-top:var(--space-md);justify-content:center;align-items:center;gap:var(--space-lg);flex-wrap:wrap;display:flex}.footer-badge{text-decoration:none;display:inline-block}.footer-badge-img{border:0;outline:none;max-width:100%;height:auto;text-decoration:none;display:block}.footer-badge-dang .footer-badge-img{width:75px}.footer-badge-next .footer-badge-img{width:108px}.footer-badge-aitools .footer-badge-img{width:101px}.footer-badge-img-dark,:root[data-theme=dark] .footer-badge-img-light{display:none}:root[data-theme=dark] .footer-badge-img-dark{display:block}@media (width<=768px){.navbar-inner{gap:var(--space-md);padding:0 var(--space-md)}.navbar-links{gap:0}.navbar-link,.nav-dropdown-trigger{padding:var(--space-xs);font-size:var(--font-size-xs)}.nav-dropdown-menu{min-width:168px}.theme-toggle{width:32px;height:32px}}@media (width<=600px){.navbar-links{-webkit-overflow-scrolling:touch;overflow-x:auto}.footer-inner{text-align:center;flex-direction:column;align-items:center}}