:root{--bg:#f0f9ff;--bg2:#f5faff;--fg:#062a33;--mut:#5b7177;--surf:#fff;--sea:#e3f0f0;--acc:#0369a1;--grad:linear-gradient(135deg, #2563eb, #0284c7, #059669);--font-display:"Space Grotesk", "Anuphan", system-ui, sans-serif;--font-body:"Anuphan", "Space Grotesk", system-ui, sans-serif;--font-mono:"JetBrains Mono", ui-monospace, monospace}:root[data-theme=dark]{--bg:#06121f;--bg2:#071a2b;--fg:#e6f1fa;--mut:#9fb8cc;--surf:#0d2438;--sea:#10293f;--acc:#38bdf8}*,:before,:after{box-sizing:border-box}html{-webkit-text-size-adjust:100%}body{background:var(--bg);color:var(--fg);font-family:var(--font-body);margin:0;line-height:1.6;overflow-x:clip}img,svg,video{max-width:100%;display:block}a{color:inherit}@keyframes vt-out{to{opacity:0;filter:blur(4px)}}@keyframes vt-in{0%{opacity:0;filter:blur(4px)}}::view-transition-old(root){animation:.18s both vt-out}::view-transition-new(root){animation:.18s both vt-in}@media (prefers-reduced-motion:reduce){::view-transition-group(*),::view-transition-old(*),::view-transition-new(*){animation:none!important}}@media (prefers-reduced-motion:no-preference){html{scroll-behavior:smooth}}:root[data-theme=dark]{color-scheme:dark;scrollbar-color:#fff3 transparent}html.thm-anim body,html.thm-anim body :not(.thm,.thm *),html.thm-anim body :not(.thm,.thm *):before,html.thm-anim body :not(.thm,.thm *):after{transition:background-color .3s,color .3s,border-color .3s,fill .3s,stroke .3s,box-shadow .3s!important}@media (prefers-reduced-motion:reduce){html.thm-anim body,html.thm-anim body *,html.thm-anim body :before,html.thm-anim body :after{transition:none!important}}.astro-route-announcer{clip:rect(0 0 0 0);clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;top:0;left:0;overflow:hidden}.navwrap{z-index:30;pointer-events:none;justify-content:center;height:46px;margin:0 0 -60px;display:flex;position:sticky;top:14px}.navwrap>*{pointer-events:auto}.sw{-webkit-backdrop-filter:blur(16px)saturate(1.4);scrollbar-width:none;background:#062a33bf;border-radius:999px;align-items:center;gap:2px;width:max-content;max-width:calc(100% - 20px);padding:6px;transition:background .4s,box-shadow .4s;display:flex;position:relative;overflow-x:auto;box-shadow:inset 0 0 0 1px #ffffff2e,0 14px 34px -10px #0007}.sw::-webkit-scrollbar{display:none}.sw>a:not(.lang),.sw>button:not(.thm){z-index:1;white-space:nowrap;box-sizing:border-box;cursor:pointer;color:#d6e6e8;background:0 0;border:0;border-radius:999px;flex:none;align-items:center;height:33px;padding:0 15px;font:600 13px/1 Anuphan,Space Grotesk,sans-serif;text-decoration:none;transition:color .3s;display:inline-flex;position:relative}.sw>.nmtab{letter-spacing:-.01em;padding:0 16px;font:700 13px/1 Space Grotesk,Anuphan,sans-serif}.sw>.nmtab .hi{fill:currentColor;width:15px;height:15px;display:none}.sw>.on:not(.lang):not(.thm){color:#062a33}.sw .ind{z-index:0;opacity:0;background:#fff;border-radius:999px;width:0;position:absolute;top:6px;bottom:6px;left:0}.sw[data-ind] .ind{opacity:1;transition:left .5s cubic-bezier(.3,1.3,.5,1),width .5s cubic-bezier(.3,1.3,.5,1)}.sw:not([data-ind])>.on{background:#fff}.sw a:focus-visible,.sw button:focus-visible{outline-offset:2px;outline:2px solid #38bdf8}.sw .lang,.sw .thm{z-index:1;box-sizing:border-box;cursor:pointer;background:color-mix(in srgb, currentColor 8%, transparent);color:#fff;border:0;border-radius:999px;flex:none;justify-content:center;align-items:center;height:33px;margin:0 0 0 2px;padding:0 11px;line-height:0;text-decoration:none;transition:background .3s,color .3s;display:inline-flex;position:relative}.sw .lang:hover,.sw .thm:hover{background:color-mix(in srgb, currentColor 14%, transparent)}.sw .lang{gap:5px}.sw .lang svg{fill:none;stroke:currentColor;stroke-width:1.6px;opacity:.8;flex:none;width:14px;height:14px;transition:transform .6s cubic-bezier(.2,.8,.2,1)}.sw .lang:hover svg{transform:rotate(180deg)}.sw .lang .lf{margin:0;font:600 13px/1 Anuphan,Space Grotesk,sans-serif}.sw .thm svg{opacity:.85;flex:none;width:15px;height:15px;margin:0;transition:transform .6s cubic-bezier(.3,1.4,.5,1);display:block;overflow:visible;transform:rotate(90deg)}.sw .thm svg *{transform-box:view-box;transform-origin:12px 12px}.sw .thm .tb{fill:currentColor;transition:transform .5s cubic-bezier(.3,1.4,.5,1);transform:scale(.56)}.sw .thm .tm{transition:transform .5s cubic-bezier(.2,.8,.2,1);transform:translate(9px,-9px)}.sw .thm .tr{fill:none;stroke:currentColor;stroke-width:2px;stroke-linecap:round;transition:transform .5s cubic-bezier(.3,1.4,.5,1),opacity .3s}.sw .thm.dk svg{transform:rotate(0)}.sw .thm.dk .tb{transform:scale(.9)}.sw .thm.dk .tm{transform:none}.sw .thm.dk .tr{opacity:0;transform:rotate(-60deg)scale(.4)}.sw .thm:hover svg{transform:rotate(135deg)}.sw .thm.dk:hover svg{transform:rotate(-18deg)}:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw{background:#ffffffde;box-shadow:inset 0 0 0 1px #062a3314,0 16px 36px -16px #062a3355}:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw>a:not(.lang),:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw>button:not(.thm){color:#45636a}:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw>.on:not(.lang):not(.thm){color:#fff}:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw:not([data-ind])>.on,:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw .ind{background:#062a33}:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw .lang,:root:not([data-theme=dark]) .navwrap[data-tone=light] .sw .thm{color:#062a33}:root[data-theme=dark] .sw{background:#0a1b2dcc;box-shadow:inset 0 0 0 1px #ffffff1f,0 14px 34px -12px #000a}:root[data-theme=dark] .sw>a:not(.lang),:root[data-theme=dark] .sw>button:not(.thm){color:#c5d8e6}:root[data-theme=dark] .sw>.on:not(.lang):not(.thm){color:#06121f}:root[data-theme=dark] .sw .ind,:root[data-theme=dark] .sw:not([data-ind])>.on{background:#e6f1fa}.dd{-webkit-backdrop-filter:blur(24px)saturate(1.4);color:#062a33;background:#fffffff2;border-radius:24px;width:min(820px,100vw - 20px);padding:16px;position:absolute;top:60px;left:50%;transform:translate(-50%);box-shadow:0 30px 70px -24px #062a3377,inset 0 0 0 1px #062a3312}.dd[hidden]{display:none}.dd.show{animation:.35s cubic-bezier(.2,.9,.2,1) ddin}@keyframes ddin{0%{opacity:0;transform:translate(-50%,-10px)scale(.98)}}.dd .mh{align-items:center;gap:10px;padding:0 4px 12px;display:flex}.dd .mh b{color:#062a33;font:700 16px Space Grotesk,Anuphan,sans-serif}.dd .mh small{color:#5b7177;margin-right:auto;font:500 11px Anuphan,sans-serif}.dd .mh .ar{width:32px;height:32px;color:inherit;cursor:pointer;background:#062a330d;border:0;border-radius:50%;justify-content:center;align-items:center;padding:0;font:600 16px system-ui;display:flex}.dd .mh .ar:hover{color:#fff;background:#062a33}.dd .mh .ar:focus-visible,.dd .mc:focus-visible{outline-offset:2px;outline:2px solid #0369a1}.dd .mt{scroll-snap-type:x mandatory;scrollbar-width:none;gap:12px;padding-bottom:4px;display:flex;overflow-x:auto}.dd .mt::-webkit-scrollbar{display:none}.dd .mc{scroll-snap-align:start;border-radius:16px;flex:0 0 240px;text-decoration:none;transition:transform .3s;display:block;overflow:hidden}.dd a.mc{cursor:pointer}.dd a.mc:hover{transform:translateY(-4px)}.dd .mc .mi{height:140px;position:relative;overflow:hidden}.dd .mc .mi>img{object-fit:cover;object-position:top;width:100%;height:100%}.dd .mc .mi .mp{justify-content:center;gap:8px;height:100%;padding-top:12px;display:flex}.dd .mc .mi .mp img{object-fit:contain;border-radius:9px;width:62px;height:auto}.dd .mc .mi .mapp{background:radial-gradient(80% 90% at 50% 100%,#3b82f655,#0000 70%),#0f172a;justify-content:center;align-items:flex-start;padding:14px 14px 0;display:flex;position:absolute;inset:0}.dd .mc .mi .mapp img{border-radius:8px 8px 0 0;width:100%;height:auto;box-shadow:0 10px 24px -10px #000c}.dd .mc .mtx{justify-content:space-between;align-items:center;gap:8px;padding:10px 12px;display:flex}.dd .mc .mtx b{color:inherit;font:700 15px Space Grotesk,Anuphan,sans-serif}.dd .mc .mtx small{opacity:.8;font:600 10px JetBrains Mono,monospace}.dd .mc.wip .mi img{filter:grayscale();opacity:.7}.dd .mst{white-space:nowrap;color:#0f766e;letter-spacing:.08em;background:#fff5f2e6;border:3px solid #0f766e;border-radius:8px;padding:4px 10px;font:700 13px Space Grotesk,Anuphan,sans-serif;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)rotate(-10deg)}:root[data-theme=dark] .dd{color:#e6f1fa;background:#0b1d30f2;box-shadow:0 30px 70px -24px #000c,inset 0 0 0 1px #ffffff1c}:root[data-theme=dark] .dd .mh b{color:#e6f1fa}:root[data-theme=dark] .dd .mh small{color:#9fb8cc}:root[data-theme=dark] .dd .mh .ar{color:#e6f1fa;background:#ffffff14}:root[data-theme=dark] .dd .mh .ar:hover{color:#06121f;background:#e6f1fa}:root[data-theme=dark] .dd .mc{box-shadow:inset 0 0 0 1px #ffffff14}:root[data-theme=dark] .dd .mh .ar:focus-visible,:root[data-theme=dark] .dd .mc:focus-visible{outline-color:#38bdf8}@media (width<=820px){.navwrap{top:10px}.sw{padding:4px}.sw>a:not(.lang),.sw>button:not(.thm){padding:0 10px;font-size:12px}.sw>.nmtab{min-width:64px;padding:0 12px}.navwrap .dd{width:auto;position:fixed;top:64px;left:10px;right:10px;transform:none}.dd.show{animation-name:ddin-m}@keyframes ddin-m{0%{opacity:0;transform:translateY(-10px)scale(.98)}}}@media (width<=480px){.sw{gap:0}.sw>a:not(.lang),.sw>button:not(.thm){padding:0 8px}.sw>.nmtab{min-width:0;padding:0 11px}.sw>.nmtab .hi{display:block}.sw>.nmtab .nm{clip-path:inset(50%);white-space:nowrap;width:1px;height:1px;position:absolute;overflow:hidden}.sw .lang,.sw .thm{padding:0 9px}}@media (width<=359px){.sw>a:not(.lang),.sw>button:not(.thm){padding:0 6px;font-size:11.5px}.sw>.nmtab{padding:0 9px}.sw .lang,.sw .thm{margin-left:1px;padding:0 8px}.sw .lang svg{display:none}}@media (prefers-reduced-motion:reduce){.sw,.sw *,.dd,.dd *{transition:none!important;animation:none!important}}#hmcur{z-index:9999;pointer-events:none;position:fixed;top:0;left:0}#hmcur span{color:#fff;background:#0d9488;border-radius:50%;justify-content:center;align-items:center;width:14px;height:14px;font:700 0 Anuphan,sans-serif;transition:all .35s cubic-bezier(.3,1.3,.5,1);display:flex;position:absolute;top:-7px;left:-7px}#hmcur.big span{background:#062a33e6;width:80px;height:80px;font-size:15px;top:-40px;left:-40px;box-shadow:0 0 0 1px #ffffff40}#hmcur.mini span{opacity:.5;width:8px;height:8px;top:-4px;left:-4px}#hmcur.off span{opacity:0}:root[data-theme=dark] #hmcur span{background:#38bdf8}:root[data-theme=dark] #hmcur.big span{color:#fff;background:linear-gradient(135deg,#0c4a6ef0,#1e3a8af0);box-shadow:0 0 0 1px #7dd3fc66,0 12px 30px -10px #000c}
