/* ============================================================
   FORMATIX — หน้าที่เหลือบน UI v2: Other · Store · Account · Settings · Policy + ท้ายเว็บ (docs/แผนปรับโฉมหน้าเว็บ.md P6)
   ใช้ฐานเดียวกับหน้าใหม่ (หัวเรื่องใหญ่ · ช่องว่าง · เส้นบาง) และลดพื้นผิวกล่อง ≥ 80%
   คงไว้ตามข้อ 5.1: กระเป๋า Drex (แผงเดียว), ฟอร์ม, ป๊อปอัป, ภาพตัวอย่างธีม/สินค้า · ระบบบัญชี/โปรไฟล์ยังเด่นเท่าเดิม
   ทุกกฎผูก html[data-ui="v2"] — มือถือ/โหมดแอปไม่โดน
   ============================================================ */
html[data-ui="v2"] :is(#view-other, #view-store, #view-account, #view-settings, #view-policy) .shell {
  max-width: 1440px;
  padding: 0 clamp(24px, 3.4vw, 56px);
}
html[data-ui="v2"] :is(#view-other, #view-store, #view-account, #view-settings, #view-policy) .section-title {
  font-size: clamp(44px, 4.6vw, 80px);
  line-height: 1.05;
  letter-spacing: -.015em;
}

/* ---------- แผงตั้งค่า/บัญชี/นโยบาย: เป็นส่วนคั่นด้วยเส้นบาง ไม่ใช่การ์ด ---------- */
html[data-ui="v2"] :is(#view-account, #view-settings, #view-policy) .panel-card {
  padding: 30px 0;
  border: 0;
  border-top: var(--hair);
  border-radius: 0;
  background: none;
  box-shadow: none;
}
html[data-ui="v2"] :is(#view-account, #view-settings, #view-policy) .panel-card.is-danger {
  border-top-color: color-mix(in oklab, var(--danger) 40%, transparent);
}
html[data-ui="v2"] #view-policy .pol-body { max-width: 72ch; }

/* แท็บ/ตัวเลือกแบบแบ่งส่วน → แคปซูลแยกชิ้น ไม่มีรางพื้นหลัง */
html[data-ui="v2"] :is(#view-account, #view-settings, #view-policy, #view-store) .segmented {
  gap: 8px;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
html[data-ui="v2"] :is(#view-account, #view-settings, #view-policy, #view-store) .segmented .seg {
  border-radius: var(--pill);
  background: transparent;
  box-shadow: inset 0 0 0 1px var(--line);
}
html[data-ui="v2"] :is(#view-account, #view-settings, #view-policy, #view-store) .segmented .seg.is-on {
  color: var(--ink);
  background: color-mix(in oklab, var(--ink) 9%, transparent);
  box-shadow: none;
}

/* แท็บของหน้า Other: เส้นใต้แท็บเลื่อนตามแท็บ — ระหว่างเลื่อนห้ามดันหน้าให้กว้างจนเกิด scroll แนวนอน */
html[data-ui="v2"] #otherSeg { overflow-x: clip; }

/* ---------- Other · Information: ตัวเลขสรุปเป็นตัวใหญ่ + เส้นบาง · ช่องทางติดต่อเป็นแถวลิงก์ ---------- */
html[data-ui="v2"] :is(#view-other, #view-social) .ostats { gap: 0 40px; }
html[data-ui="v2"] :is(#view-other, #view-social) .ostat,
html[data-ui="v2"] :is(#view-other, #view-social) .ostat:first-child {
  padding: 22px 0 18px;
  border: 0;
  border-top: var(--hair);
  border-radius: 0;
  background: none;
}
html[data-ui="v2"] :is(#view-other, #view-social) .ostat:hover { transform: none; }
html[data-ui="v2"] :is(#view-other, #view-social) .ostat b { font-size: clamp(40px, 3.6vw, 60px); }
html[data-ui="v2"] :is(#view-other, #view-social) .ctiles { gap: 0 40px; }
html[data-ui="v2"] :is(#view-other, #view-social) .ctile {
  grid-template-columns: auto minmax(0, 1fr);
  align-items: center;
  column-gap: 16px;
  padding: 18px 0;
  border: 0;
  border-top: var(--hair);
  border-radius: 0;
  background: none;
}
html[data-ui="v2"] :is(#view-other, #view-social) a.ctile:hover { transform: none; box-shadow: none; }
html[data-ui="v2"] :is(#view-other, #view-social) .ctile-ico { grid-row: span 3; width: 44px; height: 44px; margin: 0; border-radius: 50%; background: none; box-shadow: inset 0 0 0 1px var(--line); }
html[data-ui="v2"] :is(#view-other, #view-social) a.ctile:hover .ctile-ico { transform: none; background: var(--accent); color: var(--on-accent); box-shadow: none; }

/* ---------- Store: กระเป๋า Drex เป็นแผงกระจกแผงเดียว · สินค้าเหลือแค่ภาพตัวอย่าง + ข้อความใต้ภาพ ---------- */
html[data-ui="v2"] #view-store .sx-wallet {
  background: var(--lg-bg, var(--glass));
  -webkit-backdrop-filter: var(--lg-blur);
          backdrop-filter: var(--lg-blur);
  box-shadow: var(--lg-shadow), inset 0 0 0 1px var(--lg-edge);
  border: 0;
}
html[data-ui="v2"] #view-store .sx-coinart { background: none; }
html[data-ui="v2"] #view-store .sx-card {
  overflow: visible;
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
}
html[data-ui="v2"] #view-store .sx-card:hover { transform: none; box-shadow: none; }
html[data-ui="v2"] #view-store .sx-prev { overflow: hidden; border-radius: var(--r-xl); transition: translate var(--dur-3) var(--ease-out), box-shadow var(--dur-3) var(--ease-out); }
html[data-ui="v2"] #view-store .sx-card:hover .sx-prev { translate: 0 -4px; box-shadow: var(--shadow-lg); }
html[data-ui="v2"] #view-store .sx-earn {
  padding: 28px 0 0;
  border: 0;
  border-top: var(--hair);
  border-radius: 0;
  background: none;
}
html[data-ui="v2"] #view-store .sx-earn-grid { gap: 0 40px; }
html[data-ui="v2"] #view-store .sx-earn-item {
  padding: 16px 0;
  border-bottom: var(--hair);
  border-radius: 0;
  background: none;
}

/* ---------- ท้ายเว็บ: กว้างเท่าหน้าใหม่ · จอ 1024–1279 ลิงก์ลงแถวของตัวเอง (ไม่บีบชื่อแบรนด์) ---------- */
html[data-ui="v2"] .footer-in { max-width: 1600px; padding: 0 clamp(24px, 3.4vw, 56px); }
@media (max-width: 1279px) {
  html[data-ui="v2"] .footer-in { grid-template-columns: minmax(0, 1fr) auto; }
  html[data-ui="v2"] .footer-links { grid-column: 1 / -1; grid-row: 2; margin-left: -10px; }
}