/* ===== ตลาดวันนี้บนหน้าแรก v2 (1 ต.ค. 2026) — A แถบใต้ hero · B ป้าย LIVE บนการ์ดเครื่องมือ · C ปุ่มเมนู · D ป้ายติดมุมจอ ===== */
.mk-seg{fill:none;stroke-width:12;opacity:.3}
.mk-seg.b0{stroke:#2F6FB5}.mk-seg.b1{stroke:#6FA7DA}.mk-seg.b2{stroke:#AFC2D4}.mk-seg.b3{stroke:#F2B35A}.mk-seg.b4{stroke:#E8891A}
[data-b="0"] .mk-seg.b0,[data-b="1"] .mk-seg.b1,[data-b="2"] .mk-seg.b2,[data-b="3"] .mk-seg.b3,[data-b="4"] .mk-seg.b4{opacity:1}
.mk-nd{transform-box:view-box;transform-origin:60px 62px;transform:rotate(-90deg);transition:transform 1.6s cubic-bezier(.2,.8,.25,1)}
.mk-nd path,.mk-nd circle{fill:#fff}

/* C · ปุ่มเมนู */
.mkn[hidden]{display:none}
.mkn{display:inline-flex;align-items:center;gap:8px;padding:6px 12px 6px 11px;border-radius:999px;border:1px solid #C9D6E3;background:#fff;
  color:var(--deep,#0E2F49);text-decoration:none;font-size:13.5px;white-space:nowrap;transition:border-color .2s}
.mkn:hover{border-color:var(--orange,#E8891A)}
.mkn-dot{width:8px;height:8px;border-radius:50%;background:#0C9A5C;box-shadow:0 0 0 3px rgba(12,154,92,.18)}
.mkn-l{color:var(--body,#3E4C5A)}
.mkn-long{margin-left:.2em}
.mkn-z{font-weight:500;padding:1px 9px;border-radius:999px;background:#EEF3F8;color:#3E4C5A}
.mkn[data-b="3"] .mkn-z,.mkn[data-b="4"] .mkn-z{background:#FDEFD9;color:#B8620A}
.mkn[data-b="0"] .mkn-z,.mkn[data-b="1"] .mkn-z{background:#E3EEF9;color:#2F6FB5}

/* A · แถบตลาดวันนี้ */
.mkb[hidden]{display:none}
.mkb{padding:56px 60px 60px;background:var(--paper,#FBF8F2)}
.mkb-in{max-width:1160px;margin:0 auto;border-radius:28px;padding:36px 40px 30px;color:#C3D1DE;position:relative;overflow:hidden;
  background:radial-gradient(700px 300px at 85% -10%,rgba(232,137,26,.16),transparent 70%),linear-gradient(135deg,#0F3150,#0B2439 65%,#123A5A);
  box-shadow:0 30px 60px -30px rgba(8,24,40,.55)}
.mkb-head{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 18px;margin-bottom:26px}
.mkb-k{flex-basis:100%;display:inline-flex;align-items:center;gap:9px;font-family:"IBM Plex Mono",monospace;font-size:12px;letter-spacing:.12em;color:#3DDC97}
.mkb-k i{width:8px;height:8px;border-radius:50%;background:#3DDC97;box-shadow:0 0 0 4px rgba(61,220,151,.18)}
.mkb h2{margin:0;font-size:clamp(26px,3vw,36px);font-weight:500;color:#fff;line-height:1.25}
.mkb h2 b{font-weight:500;color:#F2A649;margin-left:.25em}
.mkb-head p{margin:0;font-size:14px;color:#8FA6BC}
.mkb-grid{display:grid;grid-template-columns:1fr 1.1fr 1.1fr;gap:16px}
.mkb-meter,.mkb-sig,.mkb-deep{border-radius:20px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);padding:18px 20px;text-decoration:none;color:inherit;min-width:0}
.mkb-meter{display:flex;flex-direction:column;align-items:center;text-align:center;transition:border-color .2s,transform .2s}
.mkb-meter:hover{border-color:rgba(242,166,73,.6);transform:translateY(-2px)}
.mkb-meter .mk-g{width:min(190px,100%);height:auto}
.mkb-sc{display:flex;align-items:baseline;gap:6px;margin-top:4px}
.mkb-sc b{font-family:"IBM Plex Mono",monospace;font-size:46px;line-height:1;color:#fff;font-weight:500}
.mkb-sc span{font-family:"IBM Plex Mono",monospace;font-size:14px;color:#6F879C}
.mkb-meter em{font-style:normal;font-size:15px;color:#F2B35A;margin:6px 0 4px;padding:3px 14px;border-radius:999px;border:1px solid rgba(242,179,90,.45)}
.mkb-meter[data-b="0"] em,.mkb-meter[data-b="1"] em{color:#8CC0EE;border-color:rgba(140,192,238,.45)}.mkb-meter[data-b="2"] em{color:#DCE6F0;border-color:rgba(220,230,240,.35)}
.mkb-meter small{font-size:12px;color:#6F879C}
.mkb-t{display:block;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.1em;color:#F2A649;margin-bottom:8px}
.mkb-row{display:grid;grid-template-columns:1fr auto 78px;align-items:center;gap:10px;padding:11px 0;border-bottom:1px solid rgba(255,255,255,.08);text-decoration:none;color:#C3D1DE;font-size:14.5px}
.mkb-row:last-child{border-bottom:0}
.mkb-row b{font-family:"IBM Plex Mono",monospace;font-size:20px;color:#fff;font-weight:500}
.mkb-row em{font-style:normal;justify-self:end;font-size:12px;border-radius:999px;padding:2px 10px;border:1px solid rgba(255,255,255,.22);color:#C3D1DE;white-space:nowrap}
.mkb-row em.warn{color:#F2A649;border-color:rgba(242,166,73,.5)}.mkb-row em.ok{color:#3DDC97;border-color:rgba(61,220,151,.45)}
.mkb-row:hover span{color:#fff}
.mkb-deep a{display:grid;grid-template-columns:1fr auto;align-items:center;gap:2px 10px;padding:9px 12px;margin-top:8px;border-radius:14px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);text-decoration:none;color:inherit;transition:border-color .2s,background-color .2s}
.mkb-deep a:hover{border-color:rgba(242,166,73,.55);background:rgba(255,255,255,.07)}
.mkb-deep small{font-size:12px;color:#8FA6BC}
.mkb-deep b{grid-column:1;font-size:15px;font-weight:500;color:#fff}
.mkb-deep i{grid-row:1/3;grid-column:2;font-style:normal;color:#F2A649}
.mkb-ft{display:flex;flex-wrap:wrap;align-items:center;gap:12px 20px;margin-top:24px}
.mkb-ft small{font-size:12.5px;color:#6F879C}

/* B · ป้าย LIVE บนการ์ด Dashboard */
.tcard.live .ill{position:relative}
.tlive{position:absolute;left:10px;top:10px;z-index:2;display:inline-flex;align-items:center;gap:7px;padding:4px 11px;border-radius:999px;
  background:rgba(14,47,73,.88);color:#fff;font-family:"IBM Plex Mono",monospace;font-size:11.5px;letter-spacing:.06em;backdrop-filter:blur(4px)}
.tlive i{width:7px;height:7px;border-radius:50%;background:#3DDC97;box-shadow:0 0 0 3px rgba(61,220,151,.25)}
.tcard.live{border-color:var(--orange,#E8891A);box-shadow:6px 6px 0 var(--orange,#E8891A)}


/* D · ป้ายติดมุมจอ — ขึ้นหลังเลื่อนผ่านแถบ A · จางหายเมื่อถึง footer · กด × ซ่อนถึงสิ้นวัน */
.mkp{position:fixed;left:18px;bottom:18px;z-index:80;display:grid;grid-template-columns:auto auto;align-items:center;gap:2px 4px;
  padding:8px 8px 6px 12px;border-radius:18px;background:#0E2F49;color:#DCE6F0;box-shadow:0 14px 34px rgba(8,24,40,.35);
  opacity:0;transform:translateY(12px);pointer-events:none;transition:opacity .45s,transform .45s}
.mkp.on{opacity:1;transform:none;pointer-events:auto}
.mkp[hidden]{display:none}
.mkp-a{display:flex;align-items:center;gap:10px;text-decoration:none;color:inherit}
.mkp .mk-g{width:52px;height:auto}
.mkp-t small{display:block;font-size:11px;color:#9FB3C6}
.mkp-t b{font-weight:500;color:#fff;font-size:14px;display:flex;align-items:baseline;gap:8px;white-space:nowrap}
.mkp-z{font-style:normal;font-size:15px;color:#F2B35A}
.mkp[data-b="0"] .mkp-z,.mkp[data-b="1"] .mkp-z{color:#8CC0EE}.mkp[data-b="2"] .mkp-z{color:#DCE6F0}
.mkp-sc{font-family:"IBM Plex Mono",monospace;font-size:11.5px;color:#6F879C}
.mkp-go{font-size:13px;color:#0E2F49;background:#F2A649;border-radius:999px;padding:5px 11px;margin-left:4px;white-space:nowrap}
.mkp-x{border:0;background:transparent;color:#8FA5B9;font-size:18px;line-height:1;width:28px;height:28px;border-radius:50%;cursor:pointer}
.mkp-x:hover{background:rgba(255,255,255,.08);color:#fff}
.mkp-note{grid-column:1/-1;font-size:10.5px;color:#6F879C;padding-left:2px}
@media(max-width:640px){.mkp{left:10px;right:10px;bottom:10px;grid-template-columns:1fr auto}.mkp-go{margin-left:auto}}
@media(prefers-reduced-motion:reduce){.mkp{transition:none}}

@media(max-width:1000px){.mkb-grid{grid-template-columns:1fr 1fr}.mkb-meter{grid-row:span 2}}
@media(max-width:940px){.mkb{padding:44px 26px}}
@media(max-width:640px){
  .mkb{padding:36px 14px}.mkb-in{padding:26px 18px 22px;border-radius:22px}
  .mkb-grid{grid-template-columns:1fr}.mkb-meter{grid-row:auto}
  .mkn{padding:4px 5px 4px 9px;gap:6px;font-size:12.5px}.mkn-long{display:none}.mkn-z{padding:1px 8px}
  /* เมนูมือถือ: เผื่อที่ให้ปุ่มอารมณ์ตลาด + ปุ่มลองเครื่องมือฟรี อยู่บรรทัดเดียว */
  .nav{gap:10px;padding-left:14px!important;padding-right:14px!important}.nav .cta{gap:8px}
  .nav .cta .btn{padding:7px 12px!important;font-size:12.5px!important;white-space:nowrap}
}
@media(max-width:380px){.nav{gap:6px}.nav .flogo{width:80px;height:auto}.mkn{gap:4px;padding:3px 4px 3px 7px;font-size:11.5px}.mkn-dot{width:6px;height:6px}.mkn-z{padding:1px 6px}.nav .cta{gap:6px}.nav .cta .btn{padding:6px 9px!important;font-size:11.5px!important}}
@media(prefers-reduced-motion:reduce){.mk-nd{transition:none}}

/* ป้ายมุมจอหลบแถบขอความยินยอมคุกกี้ (PDPA) — มือถือทั้งสองอยู่ล่างจอเต็มความกว้าง จะซ้อนกัน */
body:has(.ckbar:not([hidden])) .mkp{display:none}
