:root{--bg:#031226;--panel:#071d38;--line:#0f5ca8;--blue:#15a6ff;--cyan:#22d3ee;--text:#f6fbff;--muted:#91acd0;--green:#22c55e;--yellow:#ffd34e}*{box-sizing:border-box}body{margin:0;font-family:Arial,"Noto Sans Thai",sans-serif;background:radial-gradient(circle at 80% 0,#063d76 0,#031226 28%,#020b18 72%);color:var(--text)}a{color:inherit;text-decoration:none}.top{height:72px;display:flex;align-items:center;padding:0 32px;border-bottom:1px solid #0a3d72;background:#021023eF;position:sticky;top:0;z-index:20}.brand{display:flex;gap:10px;align-items:center;font-weight:800;letter-spacing:1px}.brandmark{display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:linear-gradient(135deg,#29d7ff,#1262ff);font-size:25px}.brand small{display:block;color:#2db6ff;font-size:10px}.top nav{display:flex;gap:26px;margin-left:50px;color:#d7e7fb}.top-actions{margin-left:auto;display:flex;gap:12px;align-items:center}.search,.pill{border:1px solid #164f87;background:#061a33;padding:11px 16px;border-radius:12px;color:#9ab5d5;min-width:210px}.btn{background:linear-gradient(90deg,#19b8ff,#1675ff);padding:12px 18px;border-radius:12px;font-weight:700}.wrap{max-width:1460px;margin:auto;padding:28px}.hero{display:grid;grid-template-columns:1fr 300px;gap:18px}.hero-main{min-height:360px;border:1px solid #0b5ba3;border-radius:24px;padding:42px;background:linear-gradient(110deg,rgba(3,18,38,.98),rgba(2,27,61,.78)),radial-gradient(circle at 75% 45%,#0862c9,transparent 28%);position:relative;overflow:hidden}.hero-icons{position:absolute;right:40px;top:42px;display:grid;grid-template-columns:repeat(3,84px);gap:18px;transform:rotate(-6deg)}.appicon{width:84px;height:84px;border:1px solid #28a9ff;border-radius:22px;background:linear-gradient(145deg,#0d3157,#08203f);display:grid;place-items:center;font-size:34px;font-weight:900;box-shadow:0 0 24px rgba(32,166,255,.28)}.hero h1{font-size:56px;line-height:1;margin:18px 0 14px;max-width:650px}.hero h1 span{color:#20aaff}.hero p{max-width:650px;color:#bdd1e7;font-size:18px;line-height:1.7}.hero-side,.panel{border:1px solid #0b5ba3;background:#061a33;border-radius:22px;padding:26px}.hero-side{text-align:center}.hero-side .brandmark{margin:0 auto 20px}.features,.cats,.grid,.stats{display:grid;gap:14px}.features{grid-template-columns:repeat(4,1fr);margin-top:20px}.feature,.cat,.stat{border:1px solid #0d4e86;background:#071d38;border-radius:16px;padding:16px}.cats{grid-template-columns:repeat(7,1fr);margin:22px 0}.cat{text-align:center}.section-title{display:flex;justify-content:space-between;align-items:center;margin:26px 0 12px}.grid{grid-template-columns:repeat(6,1fr)}.card{border:1px solid #0f5ca8;background:#061a33;border-radius:18px;overflow:hidden}.card-art{height:150px;display:grid;place-items:center;background:radial-gradient(circle,#0e78bf 0,#06244a 45%,#06162c 100%)}.card-art .appicon{width:92px;height:92px}.card-body{padding:16px}.card h3{margin:0 0 8px}.meta{color:#91acd0;font-size:14px}.price{font-size:26px;color:var(--yellow);font-weight:900;margin:14px 0}.buy{display:block;text-align:center;background:linear-gradient(90deg,#13b8ff,#1582ff);padding:12px;border-radius:11px;font-weight:800}.table{width:100%;border-collapse:collapse}.table th,.table td{padding:14px;border-bottom:1px solid #123a63;text-align:left}.status{padding:5px 9px;border-radius:999px;background:#123b63;color:#c8e1ff;font-size:12px}.stats{grid-template-columns:repeat(4,1fr)}.stat strong{display:block;font-size:28px;margin-top:8px}.admin-layout{display:grid;grid-template-columns:230px 1fr;gap:20px}.side{border:1px solid #0b5ba3;background:#061a33;border-radius:18px;padding:16px;height:max-content}.side a{display:block;padding:12px;border-radius:10px;color:#b9cce2}.side a:hover{background:#0b2c52;color:#fff}.footer{padding:30px;text-align:center;color:#6f8caf}@media(max-width:1100px){.grid{grid-template-columns:repeat(3,1fr)}.cats{grid-template-columns:repeat(4,1fr)}.hero{grid-template-columns:1fr}.hero-icons{opacity:.35}.hero-side{display:none}}@media(max-width:700px){.top nav,.search{display:none}.top{padding:0 14px}.wrap{padding:16px}.hero-main{padding:24px;min-height:420px}.hero h1{font-size:38px}.hero-icons{right:-50px;top:150px}.features{grid-template-columns:1fr 1fr}.grid{grid-template-columns:1fr 1fr}.cats{grid-template-columns:1fr 1fr}.stats{grid-template-columns:1fr 1fr}.admin-layout{grid-template-columns:1fr}.side{display:flex;overflow:auto}.side a{white-space:nowrap}}