@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+Thai:wght@400;500;600;700;800&family=Noto+Serif+Thai:wght@700;800&display=swap');
:root{--ink:#edf2f5;--muted:#aab5bc;--night:#081014;--panel:#101b20;--line:#25343b;--gold:#e5b64d;--red:#b43329;--green:#54d193;--shadow:0 24px 70px rgba(0,0,0,.35)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 80% 5%,#183138 0,transparent 28%),linear-gradient(145deg,#070d10,#0b1418 60%,#101b1e);color:var(--ink);font:16px/1.65 'Noto Sans Thai',sans-serif;min-height:100vh}
body:before{content:"";position:fixed;inset:0;pointer-events:none;opacity:.18;background-image:linear-gradient(rgba(255,255,255,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.025) 1px,transparent 1px);background-size:42px 42px}
.topbar{position:sticky;top:0;z-index:5;display:flex;align-items:center;justify-content:space-between;padding:16px max(5vw,24px);background:rgba(8,16,20,.88);backdrop-filter:blur(14px);border-bottom:1px solid var(--line)}
.brand{color:var(--ink);text-decoration:none;font-weight:800;font-size:1.1rem}.brand span{display:inline-grid;place-items:center;width:38px;height:38px;margin-right:9px;border:1px solid #79622f;color:var(--gold);font-family:serif}
.status{display:flex;gap:9px;align-items:center;color:var(--muted);font-size:.9rem}.status i{width:9px;height:9px;border-radius:50%;background:#758088;box-shadow:0 0 0 5px rgba(117,128,136,.13)}.status.online i{background:var(--green);box-shadow:0 0 0 5px rgba(84,209,147,.13)}
main{width:min(1120px,90vw);margin:auto}.intro{padding:clamp(72px,10vw,130px) 0 60px;max-width:840px}.eyebrow{margin:0 0 10px;color:var(--gold);font-size:.82rem;font-weight:800;letter-spacing:.16em}.intro h1,.panel h2{font-family:'Noto Serif Thai',serif;line-height:1.16;margin:0}.intro h1{font-size:clamp(2.7rem,7vw,5.8rem);letter-spacing:-.055em}.lead{max-width:650px;color:var(--muted);font-size:clamp(1.05rem,2vw,1.25rem);margin:24px 0 30px}.actions{display:flex;gap:12px;flex-wrap:wrap}.actions a,.downloads a,button{border:0;border-radius:3px;padding:13px 22px;font:700 1rem 'Noto Sans Thai';text-decoration:none;cursor:pointer}.primary,button{background:linear-gradient(135deg,#d9a940,#f0c866);color:#17120a}.secondary,.downloads a{border:1px solid #586970;color:var(--ink);background:#142127}.facts{display:flex;gap:0;margin-top:62px;border-block:1px solid var(--line)}.facts div{padding:18px 36px 18px 0;margin-right:36px}.facts strong,.facts span{display:block}.facts strong{font-size:.78rem;color:var(--muted);font-weight:500}.facts span{font-size:1.15rem;font-weight:800;color:#fff}
.panel{display:grid;grid-template-columns:.8fr 1.2fr;gap:clamp(30px,7vw,90px);margin:50px 0;padding:clamp(28px,5vw,58px);background:linear-gradient(145deg,rgba(20,34,40,.94),rgba(12,24,28,.96));border:1px solid var(--line);box-shadow:var(--shadow)}.panel h2{font-size:clamp(2rem,4vw,3.2rem)}.panel>div>p:last-child{color:var(--muted)}form{display:grid;gap:16px}label{display:grid;gap:7px;font-weight:600}input{width:100%;padding:14px 15px;border:1px solid #3b4c54;border-radius:3px;background:#071115;color:#fff;font:500 1rem 'Noto Sans Thai';outline:none}input:focus{border-color:var(--gold);box-shadow:0 0 0 3px rgba(229,182,77,.12)}button:disabled{opacity:.6;cursor:wait}.message{min-height:26px;margin:0;font-weight:600}.message.error{color:#ff9389}.message.success{color:var(--green)}
.downloads{grid-template-columns:.65fr 1.35fr}.downloads ol{list-style:none;padding:0;margin:0;display:grid;gap:12px}.downloads li{display:grid;grid-template-columns:42px 1fr;gap:15px;padding:20px;border:1px solid var(--line);background:#0b1519}.downloads li>span{display:grid;place-items:center;width:36px;height:36px;border:1px solid #6c592c;color:var(--gold);font-weight:800}.downloads strong{font-size:1.1rem}.downloads p{color:var(--muted);margin:2px 0 12px}.downloads a{display:inline-block;padding:9px 15px;font-size:.9rem}footer{width:min(1120px,90vw);margin:70px auto 0;padding:28px 0 40px;border-top:1px solid var(--line);color:var(--muted);font-size:.9rem}
@media(max-width:760px){.topbar{align-items:flex-start}.status span{display:none}.intro{padding-top:60px}.panel,.downloads{grid-template-columns:1fr}.facts{display:grid;grid-template-columns:repeat(3,1fr)}.facts div{padding:15px 8px;margin:0}.intro h1{font-size:2.75rem}.panel{padding:24px}.actions a{flex:1;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}}