/* ===== Mist-RO — ธีมพาสเทลน่ารัก สบาย ๆ (โหลดทับ style.css) =====
   ปรับสีหลักทั้งเว็บได้ที่ตัวแปรด้านล่าง */
:root{
  --ink:#5b4a6b; --ink2:#7d6a8c; --muted:#a393b3;
  --cream:#fffafd; --sand1:#fff0f6; --sand2:#ffd9e8; --sand3:#ffb8d2; --sand4:#ff9cc2;
  --brown:#ff7eb0; --brown-d:#8a4f9e; --brown-dd:#6e4a8a;
  --gold:#ffc94d; --gold-l:#fff1b8; --gold-d:#f0a92a;
  --red:#ff6f9f; --green:#4fc98f; --blue:#5fb3f5; --purple:#a58cf5;
  --pink:#ff8fbb; --pink-d:#f06a9f; --sky:#7cc8ff; --mint:#7fdcb4; --lemon:#ffd66b; --lav:#b9a4ff; --peach:#ffb38a;
  --r:22px;
}
body{color:var(--ink)}
h1,h2,h3,h4,.plaque,.sec-head h2,.notice-title,.tabs button,.pill-btn,.hex,.btn,.readmore,.sign b,.gpanel-hd h1,.page-title,.woe-tab,.rtabs button,.gc-castle{font-family:'Mali','Prompt',sans-serif}
a:hover{color:var(--pink-d)}

/* ---------- แถบเมนูบน: ขาวใส ๆ ---------- */
.topbar{background:rgba(255,255,255,.88);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border-bottom:3px solid #ffd3e5;box-shadow:0 6px 18px rgba(255,120,170,.18)}
.tb-list>li>a:not(.hex){color:var(--ink);font-weight:600;border-radius:16px;transition:background .15s,color .15s,transform .15s}
.tb-list>li>a small{color:var(--muted)}
.tb-list>li>a:not(.hex):hover,.tb-list>li>a.on{color:var(--pink-d);background:#fff0f6;transform:translateY(-1px)}
.tb-list>li>a.on small{color:var(--pink)}
.nav-toggle{color:var(--pink-d)}
.hex{clip-path:none;border-radius:999px;height:44px;min-width:128px;box-shadow:0 4px 0 rgba(0,0,0,.12),0 6px 14px rgba(255,110,160,.25);border:2px solid #fff;transition:transform .15s,filter .15s}
.hex:hover{transform:translateY(-2px) scale(1.03)}
.hex-green{background:linear-gradient(180deg,#8ff0c2,#3fc98a);box-shadow:0 4px 0 #2ea572,0 8px 16px rgba(63,201,138,.3)}
.hex-red{background:linear-gradient(180deg,#ffa9cb,#ff6fa3);box-shadow:0 4px 0 #e0558a,0 8px 16px rgba(255,111,163,.3)}
.sub{background:#fff;border:2px solid #ffd3e5;border-radius:20px;box-shadow:0 14px 30px rgba(255,120,170,.22)}
.sub a{border-radius:12px;color:var(--ink)}
.sub a:hover{background:#fff0f6;color:var(--pink-d)}

/* ---------- หัวเว็บ ---------- */
.hero-tag{background:rgba(255,255,255,.82);color:var(--ink);text-shadow:none;border:2px solid #fff;border-radius:999px;box-shadow:0 6px 16px rgba(255,120,170,.2)}
.hero-tag span{color:var(--pink-d)}
.pill-btn{border:3px solid #fff;border-radius:999px;height:46px;font-size:16px;box-shadow:0 5px 0 rgba(0,0,0,.1),0 10px 18px rgba(90,60,120,.18);transition:transform .15s,filter .15s}
.pill-btn:hover{transform:translateY(-3px) scale(1.03)}
.pill-btn i{background:#fff;color:inherit}
.pill-green{background:linear-gradient(180deg,#8ff0c2,#3fc98a)} .pill-green i{color:#2ea572}
.pill-red{background:linear-gradient(180deg,#ffa9cb,#ff6fa3)} .pill-red i{color:#e0558a}
.pill-blue{background:linear-gradient(180deg,#9fd8ff,#4fa9f0)} .pill-blue i{color:#3a8fd6}
.stat{background:rgba(255,255,255,.88);border:2px solid #fff;border-radius:999px;color:var(--ink);box-shadow:0 6px 14px rgba(90,60,120,.15)}
.stat span{color:var(--muted)}
.stat b{color:var(--brown-d)}
.stat b.on{color:#2eb87a} .stat b.off{color:#ff5c8a}

/* ---------- ป้ายซ้าย-ขวา: พาสเทลหลายสี ---------- */
.sign{border-radius:24px;color:#fff;border:3px solid #fff;
  background:linear-gradient(180deg,var(--c1,#ffb3d0),var(--c2,#ff85b3));
  box-shadow:0 6px 0 var(--c3,#e8699c),0 12px 22px rgba(90,60,120,.18)}
.sign::after{inset:6px;border-radius:17px;border:2px dashed rgba(255,255,255,.55)}
.sign-ic{background:#fff;color:var(--c3,#e8699c);box-shadow:0 3px 0 rgba(0,0,0,.08)}
.sign b{text-shadow:0 2px 0 rgba(0,0,0,.12)}
.sign small{color:rgba(255,255,255,.9)}
.sign:hover{transform:translateY(-4px) rotate(-1deg);filter:brightness(1.04)}
.signs .sign:nth-child(6n+1){--c1:#ffb3d0;--c2:#ff85b3;--c3:#e8699c}
.signs .sign:nth-child(6n+2){--c1:#a9dcff;--c2:#6cbdf7;--c3:#4a9ddb}
.signs .sign:nth-child(6n+3){--c1:#a8f0cf;--c2:#5fd3a0;--c3:#3fb482}
.signs:last-child .sign:nth-child(6n+1){--c1:#d2c2ff;--c2:#a98cf5;--c3:#8a6de0}
.signs:last-child .sign:nth-child(6n+2){--c1:#ffe39a;--c2:#ffc53d;--c3:#e8a91c}
.signs:last-child .sign:nth-child(6n+3){--c1:#ffcfb0;--c2:#ff9f6e;--c3:#ea8150}

/* ---------- สไลด์ ---------- */
.show-slider{background:#fff;border-radius:26px;box-shadow:0 0 0 4px #ffd3e5,0 14px 30px rgba(90,60,120,.2)}
.slide,.slides,.slide img{border-radius:18px}
.sl-arrow{background:rgba(255,255,255,.9);color:var(--pink-d);border:3px solid #fff;box-shadow:0 4px 10px rgba(0,0,0,.15)}
.sl-arrow:hover{background:#fff;transform:translateY(-50%) scale(1.08)}
.sl-dots button{background:rgba(255,255,255,.75)}
.sl-dots button.on{background:var(--pink)}

/* ---------- ประกาศ ---------- */
.notice{background:rgba(255,255,255,.93);border:3px solid #fff;border-radius:26px;box-shadow:0 0 0 3px #ffd3e5,0 14px 30px rgba(90,60,120,.18)}
.notice-title{color:var(--pink-d);text-shadow:none}
.notice-title::before{content:"✿ ";color:var(--lemon)}
.notice-list li{border-top:2px dotted #ffe0ec}
.ntext{color:var(--ink)}
.ntag{border-radius:999px;border:0;padding:3px 0}
.ntag-news{color:#fff;background:linear-gradient(180deg,#9fd8ff,#4fa9f0)}
.ntag-event{color:#fff;background:linear-gradient(180deg,#ffb3d0,#ff7eb0)}
.ndate{color:var(--muted)}

/* ---------- แท็บข่าว + การ์ดข่าว ---------- */
.tabs button{border:3px solid #fff;background:rgba(255,255,255,.85);color:var(--ink2);border-radius:999px;box-shadow:0 4px 0 #ffd3e5,0 8px 14px rgba(90,60,120,.12)}
.tabs button:hover{color:var(--pink-d);transform:translateY(-2px)}
.tabs button.on{background:linear-gradient(180deg,#ffb3d0,#ff7eb0);color:#fff;border-color:#fff;box-shadow:0 4px 0 #e8699c,0 8px 16px rgba(255,111,163,.3)}
.ncard{border-radius:26px;border:3px solid #fff;box-shadow:0 0 0 2px #ffe0ec,0 12px 26px rgba(90,60,120,.15)}
.ncard:hover{transform:translateY(-6px) rotate(-.4deg);box-shadow:0 0 0 2px #ffc2da,0 20px 34px rgba(255,111,163,.22)}
.ncard-img{border-radius:18px}
.ncard-ph{background:radial-gradient(circle at 50% 38%,#ffe9f2,#ffb3d0 60%,#ff8fbb)}
.ph-update{background:radial-gradient(circle at 50% 38%,#e6fff3,#a8f0cf 60%,#5fd3a0)}
.ph-event{background:radial-gradient(circle at 50% 38%,#fff0e6,#ffcfb0 60%,#ff9f6e)}
.ph-promotion{background:radial-gradient(circle at 50% 38%,#fffbe6,#ffe39a 60%,#ffc53d)}
.ph-system{background:radial-gradient(circle at 50% 38%,#f3eeff,#d2c2ff 60%,#a98cf5)}
.ncard-ph em{text-shadow:0 2px 0 rgba(0,0,0,.15)}
.tag{border-radius:999px;padding:1px 12px;background:var(--blue)}
.tag-update{background:var(--green)} .tag-event{background:var(--pink)} .tag-promotion{background:var(--gold-d)} .tag-system{background:var(--purple)}
.ncard-body h3 a:hover{color:var(--pink-d)}
.readmore{height:30px;border-radius:999px;background:linear-gradient(180deg,#ffb3d0,#ff7eb0);box-shadow:0 3px 0 #e8699c;transition:transform .15s}
.readmore:hover{transform:translateY(-2px)}
.pager button{color:var(--ink2)}
.pager button:hover{background:#fff0f6}
.pager button.on{background:linear-gradient(180deg,#ffb3d0,#ff7eb0);box-shadow:0 3px 0 #e8699c}

/* ---------- แร้งกิ้ง / กิลด์วอร์ / แฟนเพจ ---------- */
.plaque{border-radius:999px;border:3px solid #fff;text-shadow:0 2px 0 rgba(0,0,0,.12);
  background:linear-gradient(180deg,#c9b6ff,#9d84f0);box-shadow:0 5px 0 #7f64d6,0 10px 20px rgba(90,60,120,.22)}
.plaque::before,.plaque::after{background:#fff;box-shadow:0 0 0 3px rgba(255,255,255,.4)}
.plaque-gold{color:#fff;text-shadow:0 2px 0 rgba(0,0,0,.12);background:linear-gradient(180deg,#ffb3d0,#ff7eb0);box-shadow:0 5px 0 #e8699c,0 10px 20px rgba(255,111,163,.25)}
.card-in{border-radius:24px;border:3px solid #fff;box-shadow:0 0 0 2px #ffe0ec,0 12px 26px rgba(90,60,120,.15)}
.rtabs{border-bottom:2px dotted #ffd3e5}
.rtabs button{border-radius:999px;color:var(--muted)}
.rtabs button.on{background:linear-gradient(180deg,#ffb3d0,#ff7eb0);color:#fff;box-shadow:0 3px 0 #e8699c;border-bottom:0;margin-bottom:6px}
.rtbl td{border-color:#fbe3ee}
.rtbl tbody tr:nth-child(even) td{background:#fffafc}
.rn{border-radius:14px}
.rn-1{background:linear-gradient(180deg,#ffe39a,#ffc53d)}
.rn-2{background:linear-gradient(180deg,#d7e6ff,#9fbde8)}
.rn-3{background:linear-gradient(180deg,#ffcfb0,#ff9f6e)}
.rt-name{color:var(--ink)}
.woe-tab{border-radius:999px;border:2px solid #fff;color:#fff;background:linear-gradient(180deg,#ffb3d0,#ff7eb0);box-shadow:0 4px 0 #e8699c,0 8px 14px rgba(255,111,163,.25)}
.woe-tab:hover{color:#fff}
.gcard{border-radius:24px}
.gcard::before,.gcard::after{border-color:#ffc2da}
.castle{border-radius:22px;background:linear-gradient(180deg,#c9b6ff,#9d84f0);box-shadow:0 5px 0 #7f64d6,0 10px 18px rgba(90,60,120,.2)}
.sec-head h2{color:var(--brown-d)}

/* ---------- หน้าแนะนำ / หน้าทั่วไป ---------- */
.gmenu,.gpanel{border-radius:26px;border-top:0;box-shadow:0 0 0 3px #fff,0 0 0 6px #ffd3e5,0 14px 30px rgba(90,60,120,.18)}
.gmenu-title{color:var(--pink-d)}
.gmenu-list a{border-radius:999px;border:2px solid #ffe0ec;color:var(--ink2)}
.gmenu-list a:hover{background:#fff0f6;color:var(--pink-d);transform:translateX(3px)}
.gmenu-list a.on{background:linear-gradient(90deg,#fff0f6,#fff);border-color:#ffb3d0;color:var(--pink-d)}
.gmenu-list a.on::before{background:var(--pink);border-radius:999px}
.gpanel-hd{background:linear-gradient(180deg,#fff,#fff4f9);border-bottom:2px dotted #ffd3e5}
.gpanel-hd h1{color:var(--brown-d)}
.gpanel-upd{background:var(--lav);border-radius:999px}
.gpanel-upd b{border-radius:999px}
.page-title{color:var(--brown-d)}
.panel{border:3px solid #fff;border-radius:24px;box-shadow:0 0 0 2px #ffe0ec,0 12px 26px rgba(90,60,120,.12)}
.panel-title{color:var(--pink-d)}
.btn{border-radius:999px}
.btn-gold{background:linear-gradient(180deg,#ffb3d0,#ff7eb0);box-shadow:0 5px 0 #e8699c,0 10px 18px rgba(255,111,163,.25)}
.btn-gold:hover{transform:translateY(-2px)}
.field input[type=text],.field input[type=password],.field input[type=email],.field input[type=search]{border-radius:16px;border:2px solid #ffd3e5}
.field input:focus{border-color:var(--pink);box-shadow:0 0 0 4px rgba(255,143,187,.2)}
.alert{border-radius:18px}
.captcha-row img{border-color:#ffd3e5;border-radius:14px}
.captcha-re{border-color:#ffd3e5;background:#fff0f6;color:var(--pink-d);border-radius:999px}
.captcha-re:hover{background:#ffe0ec}

/* เนื้อหาที่ย้ายจากเว็บเก่า */
.legacy{--mist-r:22px;--mist-shadow:0 0 0 2px #ffe0ec,0 10px 22px rgba(90,60,120,.12)}
.legacy .box-sv,.legacy .well,.legacy .box-donate{border:3px solid #fff!important}
.legacy .line-box{border-top:2px dotted #ffc2da}
.legacy .table thead th{background:#fff0f6;color:var(--brown-d)}

/* ---------- ท้ายเว็บ ---------- */
.ft{background:linear-gradient(180deg,#fff,#fff0f6);border-top:4px solid #ffd3e5;color:var(--ink2)}
.ft-text>b{color:var(--brown-d)}
.ft-text>span{color:var(--pink)}
.ft-links a{color:var(--ink2)}
.ft-links a:hover{color:var(--pink-d)}
.ft-btn{border:2px solid #ffc2da;color:var(--pink-d);background:#fff;border-radius:999px;box-shadow:0 3px 0 #ffd3e5}
.ft-btn:hover{background:#fff0f6;color:var(--pink-d);transform:translateY(-1px)}
.to-top{background:linear-gradient(180deg,#ffb3d0,#ff7eb0);border:3px solid #fff;box-shadow:0 5px 0 #e8699c,0 8px 16px rgba(255,111,163,.3)}

/* แถบนับถอยหลังกิลด์วอร์ */
.side-woe{background:rgba(255,255,255,.95);color:var(--ink);border:3px solid #fff;border-radius:999px;box-shadow:0 0 0 2px #ffd3e5,0 8px 18px rgba(90,60,120,.15)}
.war-main .side-woe{border-radius:999px}
.side-woe b{color:var(--pink-d)}
.side-woe.live b{color:#ff4f86}

/* สไลด์หน้าแรก: สัดส่วนตามรูปสไลด์เดิม 855x335 และให้ป้ายซ้าย-ขวาสูงเท่าสไลด์ */
.slides{aspect-ratio:855/335;background:#fff}
.showcase{align-items:stretch}
.signs{justify-content:space-between;gap:10px}
.signs .sign{flex:1;min-height:0;padding:6px 10px}
.signs .sign-ic{width:34px;height:34px;margin-bottom:3px}
.signs .sign-ic svg{width:20px;height:20px}
.show-slider{display:flex;flex-direction:column;justify-content:center}
@media (max-width:1000px){.signs .sign{min-height:96px}}

/* =====================================================================
   โทนฟ้า-น้ำเงินให้เข้ากับโลโก้ MIST (ทับโทนชมพูด้านบน)
   ฟ้า #40a5f4 · น้ำเงิน #3975d1 · กรม #173f9e · ฟ้าอ่อน #d4e4f2 · ฟ้าน้ำแข็ง #8bdcfa
   ชมพูโพริง/ทองมงกุฎ ใช้เป็นสีเน้นเล็กน้อย
   ===================================================================== */
:root{
  --ink:#1f3566; --ink2:#43598a; --muted:#7f93b8;
  --cream:#f8fbff; --sand1:#eaf4ff; --sand2:#d4e4f2; --sand3:#a9d2f7; --sand4:#8bdcfa;
  --brown:#3975d1; --brown-d:#173f9e; --brown-dd:#12306f;
  --m-sky:#40a5f4; --m-blue:#3975d1; --m-navy:#173f9e; --m-ice:#8bdcfa; --m-pale:#d4e4f2; --m-line:#cfe3f7;
  --pink:#ff8fbb; --pink-d:#3975d1; --gold:#ffcb45; --gold-d:#e9a51a;
  --btn-blue:linear-gradient(180deg,#9fdcff 0%,#40a5f4 45%,#3975d1 100%);
  --btn-pink:linear-gradient(180deg,#ffc2d9 0%,#ff8fbb 50%,#f0679e 100%);
}
a:hover{color:var(--m-sky)}

/* ปุ่มหลักสไตล์ตัวอักษรโลโก้: ไล่ฟ้า→น้ำเงิน ขอบขาวหนา ขอบนูนกรมท่าด้านล่าง + แสงวิ้งตอนชี้ */
.pill-btn,.hex,.readmore,.btn-gold,.woe-tab,.tabs button.on,.rtabs button.on,.pager button.on{position:relative;overflow:hidden}
.pill-btn::after,.hex::after,.readmore::after,.btn-gold::after,.woe-tab::after{content:"";position:absolute;top:0;bottom:0;left:-60%;width:40%;pointer-events:none;
  background:linear-gradient(105deg,transparent,rgba(255,255,255,.65),transparent);transform:skewX(-20deg);transition:left .5s ease}
.pill-btn:hover::after,.hex:hover::after,.readmore:hover::after,.btn-gold:hover::after,.woe-tab:hover::after{left:120%}

.pill-green,.hex-green,.readmore,.btn-gold,.woe-tab,.tabs button.on,.rtabs button.on,.pager button.on,.to-top{
  background:var(--btn-blue);color:#fff;text-shadow:0 1px 0 rgba(23,63,158,.45);box-shadow:0 5px 0 var(--m-navy),0 10px 18px rgba(23,63,158,.28)}
.pill-green i{color:var(--m-blue)}
.pill-red,.hex-red{background:var(--btn-pink);color:#fff;text-shadow:0 1px 0 rgba(160,40,90,.35);box-shadow:0 5px 0 #c84a80,0 10px 18px rgba(240,103,158,.3)}
.pill-red i{color:#e05a92}
.pill-blue{background:#fff;color:var(--m-navy);border-color:#fff;box-shadow:0 0 0 2px var(--m-sky) inset,0 5px 0 var(--m-pale),0 10px 18px rgba(23,63,158,.18)}
.pill-blue i{background:var(--m-sky);color:#fff}
.pill-blue:hover{color:var(--m-navy)}
.woe-tab:hover,.readmore:hover{color:#fff}

/* เมนูบน */
.topbar{background:rgba(255,255,255,.9);border-bottom:3px solid var(--m-line);box-shadow:0 6px 18px rgba(23,63,158,.14)}
.tb-list>li>a:not(.hex){color:var(--m-navy)}
.tb-list>li>a:not(.hex):hover,.tb-list>li>a.on{color:var(--m-blue);background:#eaf4ff}
.tb-list>li>a.on small{color:var(--m-sky)}
.nav-toggle{color:var(--m-navy)}
.sub{border-color:var(--m-line);box-shadow:0 14px 30px rgba(23,63,158,.18)}
.sub a:hover{background:#eaf4ff;color:var(--m-blue)}

/* หัวเว็บ */
.hero-tag{box-shadow:0 6px 16px rgba(23,63,158,.18)}
.hero-tag span{color:var(--m-blue)}
.stat{box-shadow:0 6px 14px rgba(23,63,158,.14)}
.stat b{color:var(--m-navy)}

/* ป้าย 6 ป้าย: โทนฟ้าไล่เฉด */
.sign{box-shadow:0 6px 0 var(--c3),0 12px 22px rgba(23,63,158,.2)}
.signs .sign:nth-child(6n+1){--c1:#9fdcff;--c2:#40a5f4;--c3:#2a7fd0}
.signs .sign:nth-child(6n+2){--c1:#8fc4ff;--c2:#3975d1;--c3:#1f56ad}
.signs .sign:nth-child(6n+3){--c1:#b4ecff;--c2:#5cc4f0;--c3:#2f97c9}
.signs:last-child .sign:nth-child(6n+1){--c1:#b4ecff;--c2:#5cc4f0;--c3:#2f97c9}
.signs:last-child .sign:nth-child(6n+2){--c1:#9fdcff;--c2:#40a5f4;--c3:#2a7fd0}
.signs:last-child .sign:nth-child(6n+3){--c1:#8fc4ff;--c2:#3975d1;--c3:#1f56ad}
.sign b{text-shadow:0 2px 0 rgba(23,63,158,.35)}

/* กล่องทั่วไป: ขาวครีม ขอบฟ้าอ่อน */
.show-slider{box-shadow:0 0 0 4px var(--m-line),0 14px 30px rgba(23,63,158,.2)}
.sl-arrow{color:var(--m-blue)}
.sl-dots button.on{background:var(--m-sky)}
.notice,.card-in,.ncard,.panel,.side-woe{box-shadow:0 0 0 2px var(--m-line),0 12px 26px rgba(23,63,158,.14)}
.notice{box-shadow:0 0 0 3px var(--m-line),0 14px 30px rgba(23,63,158,.16)}
.notice-title{color:var(--m-navy)}
.notice-title::before{content:"✦ ";color:var(--gold)}
.notice-list li{border-top-color:#e3eefa}
.ntag-news{background:var(--btn-blue)}
.ntag-event{background:var(--btn-pink)}
.tabs button{box-shadow:0 4px 0 var(--m-line),0 8px 14px rgba(23,63,158,.1);color:var(--ink2)}
.tabs button:hover{color:var(--m-blue)}
.ncard:hover{box-shadow:0 0 0 2px var(--m-sky),0 20px 34px rgba(23,63,158,.2)}
.ncard-body h3 a:hover{color:var(--m-blue)}
.ncard-ph{background:radial-gradient(circle at 50% 38%,#ffffff,#cfeaff 55%,#8bc6f5)}
.ph-update{background:radial-gradient(circle at 50% 38%,#ffffff,#c9f3ff 55%,#7fd3ef)}
.ph-event{background:radial-gradient(circle at 50% 38%,#ffffff,#ffe0ec 55%,#ffb0cd)}
.ph-promotion{background:radial-gradient(circle at 50% 38%,#ffffff,#fff0c4 55%,#ffd36b)}
.ph-system{background:radial-gradient(circle at 50% 38%,#ffffff,#d9e4ff 55%,#9fb4f0)}
.ncard-ph em{color:var(--m-navy);text-shadow:0 1px 0 #fff}
.tag{background:var(--m-blue)} .tag-update{background:#2fb3c9} .tag-event{background:#f0679e} .tag-promotion{background:var(--gold-d)} .tag-system{background:#5a6fd6}
.pager button:hover{background:#eaf4ff}

/* ป้ายหัวข้อ: ริบบิ้นน้ำเงินขอบทอง แบบแถบในโลโก้ */
.plaque,.plaque-gold{color:#fff;border:3px solid #ffd978;text-shadow:0 2px 0 rgba(10,30,90,.45);
  background:linear-gradient(180deg,#5fb8ff 0%,#3975d1 55%,#173f9e 100%);
  box-shadow:0 0 0 2px #fff,0 5px 0 2px #0f2b70,0 12px 22px rgba(23,63,158,.3)}
.plaque::before,.plaque::after{background:radial-gradient(circle at 35% 30%,#ffffff,#8bdcfa 55%,#2a7fd0);box-shadow:0 0 0 2px #ffd978}
.rtabs{border-bottom-color:var(--m-line)}
.rtbl td{border-color:#e3eefa}
.rtbl tbody tr:nth-child(even) td{background:#f6faff}
.rn-2{background:linear-gradient(180deg,#e3edf9,#a9bcd6)}
.gcard::before,.gcard::after{border-color:#a9d2f7}
.castle{background:var(--btn-blue);box-shadow:0 5px 0 var(--m-navy),0 10px 18px rgba(23,63,158,.22)}
.side-woe b{color:var(--m-blue)}
.side-woe.live b{color:#f0679e}

/* หน้าแนะนำ / ฟอร์ม */
.gmenu,.gpanel{box-shadow:0 0 0 3px #fff,0 0 0 6px var(--m-line),0 14px 30px rgba(23,63,158,.16)}
.gmenu-title{color:var(--m-navy)}
.gmenu-list a{border-color:#e3eefa}
.gmenu-list a:hover{background:#eaf4ff;color:var(--m-blue)}
.gmenu-list a.on{background:linear-gradient(90deg,#eaf4ff,#fff);border-color:var(--m-sky);color:var(--m-navy)}
.gmenu-list a.on::before{background:var(--m-sky)}
.gpanel-hd{background:linear-gradient(180deg,#fff,#f1f8ff);border-bottom-color:var(--m-line)}
.gpanel-upd{background:var(--m-blue)}
.panel-title{color:var(--m-navy)}
.field input[type=text],.field input[type=password],.field input[type=email],.field input[type=search]{border-color:var(--m-line)}
.field input:focus{border-color:var(--m-sky);box-shadow:0 0 0 4px rgba(64,165,244,.2)}
.captcha-row img{border-color:var(--m-line)}
.captcha-re{border-color:var(--m-line);background:#eaf4ff;color:var(--m-blue)}
.captcha-re:hover{background:#d9ecff}
.legacy{--mist-shadow:0 0 0 2px var(--m-line),0 10px 22px rgba(23,63,158,.12)}
.legacy .line-box{border-top-color:#a9d2f7}
.legacy .table thead th{background:#eaf4ff;color:var(--m-navy)}

/* ท้ายเว็บ */
.ft{background:linear-gradient(180deg,#fff,#eaf4ff);border-top-color:var(--m-line)}
.ft-text>b{color:var(--m-navy)}
.ft-text>span{color:var(--m-sky)}
.ft-links a:hover{color:var(--m-blue)}
.ft-btn{border-color:var(--m-sky);color:var(--m-blue);box-shadow:0 3px 0 var(--m-line)}
.ft-btn:hover{background:#eaf4ff;color:var(--m-navy)}

/* =====================================================================
   ลดความแบ๊ว: ฟอนต์เรียบ, มุมมนพอดี, เส้นขอบบาง, เงาเบา, ไม่เอียงไม่เด้ง
   ===================================================================== */
h1,h2,h3,h4,.plaque,.sec-head h2,.notice-title,.tabs button,.pill-btn,.hex,.btn,.readmore,.sign b,.gpanel-hd h1,.page-title,.woe-tab,.rtabs button,.gc-castle{font-family:'Kanit','Prompt',sans-serif}
.tb-list>li>a:not(.hex){border-radius:10px}
.pill-btn,.hex,.readmore,.btn,.woe-tab,.tabs button,.rtabs button,.ft-btn,.captcha-re,.pager button{border-radius:12px!important}
.pill-btn{border-width:2px;font-weight:600;letter-spacing:.5px}
.pill-btn i{border-radius:8px}
.pill-green,.hex-green,.readmore,.btn-gold,.woe-tab,.tabs button.on,.rtabs button.on,.pager button.on,.to-top,.castle{box-shadow:0 3px 0 var(--m-navy),0 6px 14px rgba(23,63,158,.22)}
.pill-red,.hex-red{box-shadow:0 3px 0 #c84a80,0 6px 14px rgba(240,103,158,.24)}
.pill-btn:hover,.hex:hover{transform:translateY(-2px)}
.hero-tag,.stat{border-radius:12px}

.sign{border-radius:16px;border-width:2px}
.sign::after{display:none}
.sign-ic{border-radius:12px}
.sign:hover{transform:translateY(-3px)}

.show-slider{border-radius:18px}
.slide,.slides,.slide img{border-radius:12px}
.notice,.card-in,.ncard,.panel,.gmenu,.gpanel{border-radius:16px;border-width:1px;border-color:var(--m-line)}
.side-woe,.war-main .side-woe{border-radius:14px}
.notice-title::before{content:none}
.ncard{padding:12px}
.ncard:hover{transform:translateY(-4px)}
.ncard-img{border-radius:12px}
.tag,.ntag{border-radius:6px}
.tabs button{border-width:1px;border-color:var(--m-line)}

.plaque,.plaque-gold{border-radius:12px;border-width:2px}
.gmenu-list a{border-radius:10px;border-width:1px}
.gmenu-list a:hover{transform:none}
.gmenu-list a.on::before{border-radius:2px}
.gpanel-upd,.gpanel-upd b{border-radius:8px}
.field input[type=text],.field input[type=password],.field input[type=email],.field input[type=search]{border-radius:10px}
.captcha-row img{border-radius:10px}
.to-top{border-radius:14px;border-width:2px}

/* =====================================================================
   ปุ่มคมชัด (แนวเว็บเกมยุคใหม่): ขอบ 1px, ไล่สีสั้น, เงาแน่นไม่ฟุ้ง, ฟอนต์ Prompt หนา
   ===================================================================== */
body{-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizeLegibility}
h1,h2,h3,h4,.plaque,.sec-head h2,.notice-title,.tabs button,.pill-btn,.hex,.btn,.readmore,.sign b,.gpanel-hd h1,.page-title,.woe-tab,.rtabs button,.gc-castle{font-family:'Prompt',sans-serif}
:root{
  --cb-blue:linear-gradient(180deg,#4d9ede 0%,#1270ec 100%);
  --cb-blue-bd:#0f5fc9;
  --cb-white:linear-gradient(180deg,#ffffff 0%,#eef3f9 100%);
  --cb-white-bd:rgba(28,119,195,.35);
  --cb-text:#2c4a6b;
}
.pill-btn::after,.hex::after,.readmore::after,.btn-gold::after,.woe-tab::after{background:linear-gradient(105deg,transparent,rgba(255,255,255,.45),transparent)}

/* ปุ่มหลัก: น้ำเงินคม */
.pill-red,.hex-red,.readmore,.btn-gold,.woe-tab,.tabs button.on,.rtabs button.on,.pager button.on,.to-top,.castle{
  background:var(--cb-blue)!important;color:#fff!important;text-shadow:none!important;
  border:1px solid var(--cb-blue-bd)!important;box-shadow:inset 0 1px 0 rgba(255,255,255,.35),0 4px 12px rgba(28,119,195,.35)!important}
/* ปุ่มรอง: ขาวขอบฟ้า */
.pill-green,.hex-green,.pill-blue,.ft-btn,.tabs button,.captcha-re,.sl-arrow{
  background:var(--cb-white)!important;color:var(--cb-text)!important;text-shadow:none!important;
  border:1px solid var(--cb-white-bd)!important;box-shadow:inset 0 1px 0 #fff,0 2px 6px rgba(28,119,195,.12)!important}
.tabs button.on{border-color:var(--cb-blue-bd)!important}

/* ปุ่มหัวเว็บ REGISTER / DOWNLOAD / FACEBOOK */
.pill-btn{height:46px!important;padding:0 20px 0 12px!important;border-radius:8px!important;font-size:15px!important;font-weight:600!important;letter-spacing:.6px!important;gap:10px!important}
.pill-btn i{width:26px!important;height:26px!important;border-radius:6px!important;font-size:12px!important}
.pill-green i,.pill-blue i{background:var(--cb-blue)!important;color:#fff!important}
.pill-red i{background:rgba(255,255,255,.22)!important;color:#fff!important}
.pill-btn:hover,.hex:hover{transform:translateY(-1px)!important;filter:none!important}
.pill-green:hover,.hex-green:hover,.pill-blue:hover,.ft-btn:hover,.tabs button:hover,.captcha-re:hover{background:#fff!important;border-color:#1c77c3!important;color:#12467f!important}
.pill-red:hover,.hex-red:hover,.readmore:hover,.btn-gold:hover,.woe-tab:hover{filter:brightness(1.06)!important}

/* ปุ่มเมนูบน */
.hex{height:40px!important;min-width:118px!important;border-radius:8px!important;font-weight:600!important;letter-spacing:.4px}
.hex small{opacity:.75}

/* แท็บข่าว / ปุ่มอ่านต่อ / เลขหน้า: ทรงแคปซูลเล็ก คม */
.tabs button{height:36px!important;min-width:110px!important;padding:0 18px!important;font-size:14px!important;font-weight:600!important;border-radius:999px!important}
.readmore{height:30px!important;padding:0 18px!important;border-radius:999px!important;font-size:12px!important;letter-spacing:.4px!important}
.pager button{border-radius:999px!important}
.btn{border-radius:10px!important;font-weight:600!important}
.btn-lg{height:50px!important;font-size:17px!important}
.woe-tab{border-radius:999px!important}
.rtabs button.on{margin-bottom:6px}
.ft-btn{border-radius:8px!important}
.to-top{border-radius:10px!important}
.hex-red small{color:rgba(255,255,255,.85)!important;opacity:1!important} .hex-green small{color:#6b84a3!important;opacity:1!important}