/* ===== SKILL 999 — ธีมกลาง (แก้ที่เดียว มีผลทุกหน้า) ===== */
@import url('https://fonts.googleapis.com/css2?family=Mali:wght@600;700;800&family=Noto+Sans+Thai:wght@700;800;900&display=swap');

:root{
  --ink:#253451;
  /* พาสเทลหมวด (พื้น B / เข้ม C) */
  --peachB:#fff1e2;--peachC:#ff8a5c;--blueB:#e6f2ff;--blueC:#4aa3e0;
  --lavB:#efe8ff;--lavC:#9b7ede;--mintB:#e4fff1;--mintC:#22c98a;
  --sblueB:#e8f4ff;--sblueC:#5a9bd8;--aquaB:#e2fbff;--aquaC:#26b8c9;--lemB:#fffada;--lemC:#e6b520;
  /* สีสดสำหรับหัวข้อ/แอ็กเซนต์ */
  --c-blue:#2f9be6;--c-orange:#ff9327;--c-green:#28c281;--c-purple:#9a72e6;
  --c-pink:#ff6fa5;--c-gold:#ffb121;--c-red:#ff6b6b;
}

/* ---------- หัวข้อสีสด เส้นขอบขาว (index มอบให้ทุกหน้า) ---------- */
.vtitle{
  font-family:'Mali','Noto Sans Thai',sans-serif;font-weight:900;line-height:1.06;letter-spacing:.3px;
  -webkit-text-stroke:2.6px #fff;paint-order:stroke fill;
  text-shadow:0 3px 0 rgba(30,20,60,.12), 0 8px 18px rgba(30,20,60,.30);
}
.vtitle .em{-webkit-text-stroke:0;text-shadow:none}

/* สีตัวอักษร (ใช้ได้ทุกที่) */
.cb{color:var(--c-blue)}  .co{color:var(--c-orange)}  .cg{color:var(--c-green)}
.cp{color:var(--c-purple)}.ck{color:var(--c-pink)}    .cy{color:var(--c-gold)}
.cbr{color:#c9781c}

/* หัวข้อรองสี+ขอบขาวบาง (อ่านชัดบนภาพ) */
.vline{font-weight:800;-webkit-text-stroke:1.4px #fff;paint-order:stroke fill;
  text-shadow:0 2px 7px rgba(20,17,46,.38)}

/* หัวข้อรองบนพื้นภาพ (ตัวขาว เงาเข้ม อ่านชัด) */
.vsub{color:#fff;font-weight:800;text-shadow:0 2px 8px rgba(20,17,46,.55),0 1px 0 rgba(20,17,46,.35)}

/* ---------- แสงวาวบนปุ่ม/ช่อง (ใส่คลาส gloss) ---------- */
.gloss{position:relative;overflow:hidden}
.gloss::after{content:"";position:absolute;left:7px;right:7px;top:5px;height:40%;
  border-radius:60% 60% 42% 42%/70% 70% 42% 42%;
  background:linear-gradient(#ffffffe0,#ffffff10);pointer-events:none;z-index:1}
.gloss>*{position:relative;z-index:2}

/* ---------- พื้นฉากสว่างมาตรฐาน ---------- */
.sky-bg{position:fixed;inset:0;z-index:0;overflow:hidden;
  background:linear-gradient(180deg,#bfe6ff 0%,#d8f7ff 42%,#c3f3d3 100%)}
.sky-bg img{position:absolute;bottom:0;left:50%;transform:translateX(-50%);
  width:max(100vw,calc(100vh*1.79));opacity:.92}
.sky-bg::after{content:"";position:absolute;inset:0;
  background:linear-gradient(180deg,rgba(255,255,255,.22),rgba(255,255,255,.04) 32%,rgba(255,255,255,.40))}