:root{--font-sans:ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Noto Sans Thai","Noto Sans",Arial,sans-serif;color-scheme:dark;--bg0:#05070f;--bg1:#070b16;--bg2:#0a1224;--text:#e7eefc;--muted:#9fb0d0;--faint:rgba(231,238,252,.08);--aqua:#22d3ee;--aqua2:#06b6d4;--blue:#3b82f6;--purple:#a855f7;--pink:#f472b6;--card:rgba(10,18,36,.62);--card2:rgba(8,14,28,.78);--border:rgba(148,163,184,.16);--border2:rgba(34,211,238,.18);--shadow:0 18px 50px rgba(0,0,0,.55);--shadow2:0 10px 30px rgba(0,0,0,.45);--radius:18px;--ring:rgba(34,211,238,.35);--danger:#fb7185;--ok:#34d399}*{box-sizing:border-box}body,html{height:100%}body{font-family:var(--font-sans);margin:0;color:var(--text);background:radial-gradient(1200px 600px at 22% 18%,rgba(34,211,238,.18),transparent 60%),radial-gradient(900px 520px at 78% 22%,rgba(168,85,247,.16),transparent 60%),radial-gradient(900px 520px at 70% 80%,rgba(59,130,246,.12),transparent 55%),linear-gradient(180deg,var(--bg0),var(--bg2));overflow-x:hidden}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:radial-gradient(circle at 10% 20%,hsla(0,0%,100%,.08) 0 1px,transparent 2px) 0 0/180px 180px,radial-gradient(circle at 70% 35%,hsla(0,0%,100%,.06) 0 1px,transparent 2px) 0 0/220px 220px,radial-gradient(circle at 30% 80%,hsla(0,0%,100%,.05) 0 1px,transparent 2px) 0 0/260px 260px;opacity:.55;mix-blend-mode:screen}a{color:inherit}a,a:hover{text-decoration:none}pre{overflow-x:auto}.shell{min-height:100vh;display:flex;flex-direction:column}.content{flex:1 1;padding:28px 16px 56px}.container{width:min(1080px,100%);margin:0 auto}.header{position:-webkit-sticky;position:sticky;top:0;z-index:20;border-bottom:1px solid rgba(148,163,184,.1);background:linear-gradient(180deg,rgba(5,7,15,.82),rgba(5,7,15,.58));-webkit-backdrop-filter:blur(14px);backdrop-filter:blur(14px)}.headerInner{width:min(1200px,100%);margin:0 auto;padding:12px 16px;gap:16px}.brand,.headerInner{display:flex;align-items:center}.brand{gap:10px;-webkit-user-select:none;-moz-user-select:none;user-select:none}.brandLogo{height:44px;width:auto;display:block;filter:drop-shadow(0 8px 22px rgba(34,211,238,.25)) drop-shadow(0 10px 30px rgba(168,85,247,.18))}.nav{display:flex;align-items:center;gap:10px;flex:1 1;justify-content:center}.nav a{color:rgba(231,238,252,.84);padding:9px 12px;border-radius:999px;border:1px solid transparent;transition:transform .12s ease,border-color .12s ease,background .12s ease,color .12s ease}.nav a:hover{background:hsla(0,0%,100%,.04);border-color:rgba(148,163,184,.18);transform:translateY(-1px)}.nav a[data-active=true]{color:#051018;background:linear-gradient(135deg,rgba(34,211,238,.92),rgba(59,130,246,.92));border-color:rgba(34,211,238,.45);box-shadow:0 12px 26px rgba(34,211,238,.18)}.row{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.navToggle{display:none;border:1px solid rgba(148,163,184,.18);background:hsla(0,0%,100%,.03);color:rgba(231,238,252,.92);border-radius:14px;padding:10px 12px;cursor:pointer}.navMobile{display:none;padding:0 16px 14px}.navMobileInner{display:grid;grid-gap:8px;gap:8px;border:1px solid rgba(148,163,184,.14);border-radius:16px;background:rgba(10,18,36,.55);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);padding:10px}.navMobile a{padding:10px 12px;border-radius:14px;border:1px solid rgba(148,163,184,.12);background:hsla(0,0%,100%,.02)}.navMobile a[data-active=true]{color:#051018;background:linear-gradient(135deg,rgba(34,211,238,.92),rgba(59,130,246,.92));border-color:rgba(34,211,238,.45)}@media (max-width:860px){.nav{justify-content:flex-end}}@media (max-width:820px){.nav{display:none}.navToggle{display:inline-flex;align-items:center;gap:8px}.navMobile[data-open=true]{display:block}.brandLogo{height:40px}}.card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.cardPad{padding:18px}.cardSoft{background:var(--card2);border-color:rgba(148,163,184,.14);box-shadow:var(--shadow2)}.cardGlow{position:relative;overflow:hidden}.cardGlow:before{content:"";position:absolute;inset:-2px;background:radial-gradient(600px 160px at 20% 0,rgba(34,211,238,.25),transparent 60%),radial-gradient(540px 160px at 80% 0,rgba(168,85,247,.22),transparent 60%);opacity:.85;pointer-events:none}.cardGlow>*{position:relative}.title{font-size:34px;line-height:1.08;margin:0 0 10px;letter-spacing:.2px}.h2{font-size:18px;font-weight:800}.h2,.h3{margin:0}.h3{font-size:15px;font-weight:900}.subtitle{margin:0;color:rgba(231,238,252,.78);line-height:1.55}.muted{color:rgba(231,238,252,.72)}.help{font-size:12px;color:rgba(231,238,252,.65)}.divider{height:1px;background:linear-gradient(90deg,transparent,rgba(148,163,184,.22),transparent);margin:16px 0}.hrSoft{height:1px;background:rgba(148,163,184,.14);margin:12px 0}.btn{-webkit-appearance:none;-moz-appearance:none;appearance:none;border:1px solid rgba(148,163,184,.22);background:hsla(0,0%,100%,.03);color:rgba(231,238,252,.92);padding:10px 14px;border-radius:14px;cursor:pointer;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:800;transition:transform .12s ease,box-shadow .12s ease,border-color .12s ease,background .12s ease,filter .12s ease}.btn:hover{transform:translateY(-1px);border-color:rgba(148,163,184,.32)}.btn:active{transform:translateY(0)}.btnPrimary{border-color:rgba(34,211,238,.38);background:linear-gradient(135deg,rgba(34,211,238,.92),rgba(59,130,246,.92));color:#051018;box-shadow:0 14px 34px rgba(34,211,238,.18)}.btnPrimary:hover{filter:brightness(1.04);box-shadow:0 18px 44px rgba(34,211,238,.22)}.btnGhost{background:hsla(0,0%,100%,.02)}.btnDanger{border-color:rgba(251,113,133,.35);background:rgba(251,113,133,.1)}.btnDanger:hover{background:rgba(251,113,133,.14)}.btnIcon{padding:10px 12px;border-radius:14px}.input,select,textarea{width:100%;padding:11px 12px;border-radius:14px;border:1px solid rgba(148,163,184,.22);background:rgba(4,8,18,.55);color:rgba(231,238,252,.95);outline:none;box-shadow:0 0 0 0 transparent;transition:box-shadow .12s ease,border-color .12s ease,background .12s ease}.input:focus,select:focus,textarea:focus{border-color:rgba(34,211,238,.42);box-shadow:0 0 0 5px var(--ring);background:rgba(4,8,18,.72)}label{color:rgba(231,238,252,.78);font-weight:800;font-size:13px}.alert{padding:12px;border-radius:14px;border:1px solid rgba(148,163,184,.18);background:hsla(0,0%,100%,.03);color:rgba(231,238,252,.92)}.alertOk{border-color:rgba(52,211,153,.28);background:rgba(52,211,153,.08)}.alertError{border-color:rgba(251,113,133,.34);background:rgba(251,113,133,.1)}.badge{display:inline-flex;align-items:center;gap:8px;padding:6px 10px;border-radius:999px;font-weight:900;font-size:12px;border:1px solid rgba(148,163,184,.18);background:hsla(0,0%,100%,.02)}.badgeAqua{border-color:rgba(34,211,238,.22);background:rgba(34,211,238,.1)}.badgePurple{border-color:rgba(168,85,247,.24);background:rgba(168,85,247,.1)}.grid2{display:grid;grid-template-columns:1.15fr .85fr;grid-gap:16px;gap:16px}@media (max-width:960px){.grid2{grid-template-columns:1fr}}.cards3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:12px;gap:12px}@media (max-width:980px){.cards3{grid-template-columns:repeat(2,minmax(0,1fr))}}@media (max-width:720px){.cards3{grid-template-columns:1fr}}.stack{display:grid;grid-gap:12px;gap:12px}.pillRow{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}.pill{display:inline-flex;align-items:center;gap:8px;padding:7px 12px;border-radius:999px;border:1px solid rgba(148,163,184,.16);background:hsla(0,0%,100%,.02);color:rgba(231,238,252,.86);font-weight:900;font-size:12px}.dot{width:9px;height:9px;border-radius:99px;background:rgba(148,163,184,.35);box-shadow:0 0 0 4px rgba(148,163,184,.08)}.dotOk{background:rgba(52,211,153,.9);box-shadow:0 0 0 4px rgba(52,211,153,.12)}.dotBad{background:rgba(251,113,133,.9);box-shadow:0 0 0 4px rgba(251,113,133,.12)}.kpis{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));grid-gap:10px;gap:10px;margin-top:14px}@media (max-width:720px){.kpis{grid-template-columns:1fr}}.kpi{padding:12px;border-radius:16px;border:1px solid rgba(148,163,184,.14);background:hsla(0,0%,100%,.02)}.kpi .num{font-size:18px;font-weight:900;letter-spacing:.2px}.kpi .lab{font-size:12px;color:rgba(231,238,252,.7);margin-top:4px}.cardLink{display:block;padding:16px;border-radius:18px;border:1px solid rgba(148,163,184,.16);background:hsla(0,0%,100%,.02);transition:transform .12s ease,border-color .12s ease,background .12s ease}.cardLink:hover{transform:translateY(-1px);border-color:rgba(34,211,238,.24);background:hsla(0,0%,100%,.03)}.footer{border-top:1px solid rgba(148,163,184,.1);padding:26px 16px 34px;background:linear-gradient(180deg,rgba(10,18,36,.18),rgba(5,7,15,.12))}.footerInner{width:min(1200px,100%);margin:0 auto;display:flex;gap:16px;justify-content:space-between;align-items:flex-start;flex-wrap:wrap}.footerBrand{display:flex;align-items:center;gap:12px}.footerBrand img{height:38px;width:auto}.footerLinks{display:flex;gap:10px;flex-wrap:wrap;align-items:center}.footerLinks a{padding:8px 10px;border-radius:999px;border:1px solid rgba(148,163,184,.14);background:hsla(0,0%,100%,.02);color:rgba(231,238,252,.84)}.footerLinks a:hover{border-color:rgba(34,211,238,.22)}.small{font-size:12px;color:rgba(231,238,252,.65);margin:8px 0 0}.qr{width:min(380px,100%);border-radius:16px;border:1px solid rgba(148,163,184,.18);overflow:hidden;box-shadow:var(--shadow2)}