@import "https://fonts.googleapis.com/css2?family=IBM+Plex+Sans+Thai:wght@400;500;600;700&family=Manrope:wght@400;500;600;700;800&display=swap";:root{color:#17233c;font-synthesis:none;background:#eaf0f8;font-family:Manrope,IBM Plex Sans Thai,system-ui,sans-serif}*{box-sizing:border-box}body{min-width:320px;margin:0}button{font:inherit}.app{--ink:#18233e;--muted:#69758e;--surface:#fff;--canvas:#eef3f9;--line:#dce4ef;--blue:#1c69d4;--deep:#0b162d;background:var(--canvas);min-height:100vh;color:var(--ink);display:flex}.app.dark{--ink:#f4f7fc;--muted:#a3b0c6;--surface:#111d32;--canvas:#091426;--line:#22314d;--deep:#07101f}.sidebar{background:var(--deep);color:#fff;border-right:1px solid #ffffff14;flex-direction:column;align-items:center;gap:14px;width:92px;padding:24px 0;display:flex}.brand-mark{background:linear-gradient(135deg,#2c84ec,#0d3c88);border-radius:12px;place-items:center;width:39px;height:39px;display:grid;box-shadow:0 8px 20px #0005}.brand-mark span{font-size:22px;font-weight:800}.brand{display:none}nav{gap:10px;margin-top:40px;display:grid}.nav-button,.icon-button{color:var(--muted);cursor:pointer;background:0 0;border:0;place-items:center;display:grid}.nav-button{color:#9db0ce;border-radius:13px;width:47px;height:47px}.nav-button.active,.nav-button:hover{color:#fff;background:#1c69d4}.sidebar-footer{color:#9db0ce;margin-top:auto}.workspace{flex:1;min-width:0}.topbar{border-bottom:1px solid var(--line);background:color-mix(in srgb,var(--surface) 94%,transparent);justify-content:space-between;align-items:center;height:80px;padding:0 42px;display:flex}.breadcrumb{letter-spacing:.1em;color:var(--muted);font-size:12px;font-weight:700}.breadcrumb b{color:var(--ink)}.breadcrumb i{margin:0 10px;font-style:normal}.header-actions{align-items:center;gap:11px;display:flex}.icon-button{border-radius:9px;width:34px;height:34px}.icon-button:hover{background:var(--canvas);color:var(--ink)}.locale-button{border:1px solid var(--line);background:var(--surface);height:34px;color:var(--ink);cursor:pointer;border-radius:8px;padding:0 11px;font-size:12px;font-weight:700}.profile{border:0;border-left:1px solid var(--line);color:var(--ink);text-align:left;background:0 0;align-items:center;gap:8px;padding-left:16px;display:flex}.profile>span{color:#fff;background:#294d86;border-radius:50%;place-items:center;width:31px;height:31px;font-size:10px;font-weight:800;display:grid}.profile div{display:grid}.profile b{font-size:11px}.profile small{color:var(--muted);font-size:9px}.content{max-width:1320px;margin:auto;padding:44px}.hero-panel{color:#fff;background:radial-gradient(circle at 85% 10%,#2e78dc 0%,#16478d 17%,#10254c 43%,#0b1730 75%);border-radius:19px;min-height:268px;padding:40px 42px;position:relative;overflow:hidden}.hero-panel:after{content:"";border:1px solid #75b2ff65;border-radius:50%;width:380px;height:380px;position:absolute;top:-200px;right:-110px;box-shadow:0 0 0 45px #75b2ff12,0 0 0 90px #75b2ff0d}.eyebrow,.panel>small{letter-spacing:.12em;color:#a9c8f6;font-size:10px;font-weight:800}.pulse{background:#78d5bd;border-radius:50%;width:7px;height:7px;margin-right:8px;display:inline-block;box-shadow:0 0 0 4px #78d5bd22}.hero-panel h1{letter-spacing:-.05em;margin:22px 0 8px;font-size:43px;line-height:1}.hero-panel h2{margin:0;font-family:IBM Plex Sans Thai,sans-serif;font-size:20px}.hero-panel p{color:#d3e2fb;max-width:535px;margin-top:13px;font-size:13px;line-height:1.7}.ready{color:#ddebff;background:#6aabff16;border:1px solid #83bcff5a;border-radius:30px;align-items:center;gap:8px;margin-top:25px;padding:8px 12px;font-size:11px;display:inline-flex}.signal-grid{grid-template-columns:repeat(3,1fr);gap:16px;margin:22px 0;display:grid}.signal-grid article,.panel{background:var(--surface);border:1px solid var(--line);border-radius:15px;box-shadow:0 8px 25px #0813260b}.signal-grid article{align-items:center;gap:12px;padding:19px;display:flex}.icon{border-radius:12px;place-items:center;width:40px;height:40px;display:grid}.blue{color:#1c69d4;background:#d9e9ff}.cyan{color:#168b9a;background:#d9f5f8}.violet{color:#7055d8;background:#ece5ff}.signal-grid div{gap:2px;display:grid}.signal-grid small{color:var(--muted);font-size:10px;font-weight:600}.signal-grid strong{font-size:13px}.signal-grid em{color:#24a176;margin-left:auto;font-size:9px;font-style:normal;font-weight:800}.lower-grid{grid-template-columns:1.15fr .85fr;gap:18px;display:grid}.panel{padding:25px}.panel-heading{border-bottom:1px solid var(--line);justify-content:space-between;align-items:start;padding-bottom:18px;display:flex}.panel-heading small,.panel>small{color:#1c69d4;letter-spacing:.13em;font-size:9px;font-weight:800}.panel-heading h3,.next-panel h3{margin:7px 0 0;font-size:18px}.panel-heading>span{color:var(--muted);background:var(--canvas);border-radius:7px;padding:7px 10px;font-size:12px;font-weight:800}.module-list{display:grid}.module-row{border-bottom:1px solid var(--line);align-items:center;gap:14px;padding:13px 0;display:flex}.module-row:last-child{border:0}.module-row span{color:#1c69d4;font-size:10px;font-weight:800}.module-row b{font-size:12px}.module-row i{background:#5cbb97;border-radius:50%;width:7px;height:7px;margin-left:auto}.next-panel{flex-direction:column;display:flex}.next-panel h3{margin-top:8px}.next-panel p{color:var(--muted);margin-top:18px;font-family:IBM Plex Sans Thai,sans-serif;font-size:13px;line-height:1.75}.progress{background:var(--canvas);border-radius:99px;height:8px;margin-top:auto;overflow:hidden}.progress span{border-radius:inherit;background:linear-gradient(90deg,#1c69d4,#52a1ff);width:17%;height:100%;display:block}.progress-label{color:var(--muted);justify-content:space-between;margin-top:10px;font-size:10px;display:flex}.progress-label b{color:#1c69d4}.swagger-link{color:#fff;cursor:pointer;background:#1c69d4;border:0;border-radius:9px;justify-content:space-between;align-items:center;margin-top:25px;padding:11px 14px;font-size:11px;font-weight:700;display:flex}.swagger-link svg{transform:rotate(-90deg)}.modal-backdrop{-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);z-index:20;background:#020813aa;place-items:center;padding:20px;display:grid;position:fixed;inset:0}.signin-modal{color:#f5f8fd;background:#13213a;border:1px solid #2c4268;border-radius:18px;gap:14px;width:min(410px,100%);padding:32px;display:grid;position:relative;box-shadow:0 25px 70px #0008}.signin-modal h2{margin:2px 0;font-size:23px}.signin-modal p{color:#aab7cc;margin:0 0 7px;font-size:12px;line-height:1.6}.modal-eyebrow{color:#64a7ff;letter-spacing:.14em;font-size:9px;font-weight:800}.signin-modal label{color:#c8d5ea;gap:7px;font-size:11px;font-weight:700;display:grid}.signin-modal input{color:#fff;height:42px;font:inherit;background:#091426;border:1px solid #304769;border-radius:8px;padding:0 11px}.modal-close{color:#aab7cc;cursor:pointer;background:0 0;border:0;font-size:23px;position:absolute;top:14px;right:16px}.signin-message{color:#88d9bc;background:#1d6b5d33;border-radius:7px;padding:10px;font-size:11px}.signin-modal .swagger-link{margin-top:3px}.admin-page{gap:18px;display:grid}.admin-tabs{flex-wrap:wrap;gap:8px;display:flex}.admin-tabs button{background:var(--surface);border:1px solid var(--line);color:var(--ink);cursor:pointer;border-radius:8px;padding:9px 13px}.admin-tabs button.active{color:#fff;background:#1c69d4;border-color:#1c69d4}.admin-card{background:var(--surface);border:1px solid var(--line);border-radius:14px;padding:22px;overflow:auto}.admin-card h2{margin:0 0 16px;font-size:17px}table{border-collapse:collapse;width:100%;font-size:12px}th,td{text-align:left;border-bottom:1px solid var(--line);padding:12px}th{color:var(--muted);text-transform:uppercase;font-size:10px}.create-form{grid-template-columns:1fr 1fr 1fr auto;align-items:end;gap:10px;display:grid}.create-form input{border:1px solid var(--line);background:var(--canvas);height:40px;color:var(--ink);border-radius:8px;padding:0 10px}.create-form .swagger-link{height:40px;margin:0}@media (width<=760px){.create-form{grid-template-columns:1fr}.sidebar{display:none}.topbar{height:66px;padding:0 18px}.content{padding:20px}.hero-panel{min-height:250px;padding:28px}.hero-panel h1{font-size:35px}.profile div,.profile>svg,.header-actions>.icon-button:first-child{display:none}.signal-grid,.lower-grid{grid-template-columns:1fr}.signal-grid{gap:10px}.hero-panel:after{right:-220px}.breadcrumb{font-size:10px}}