/* Yes! Sure (yes_sure.php · งาน A · 12 พ.ย. 2569) · คลาสขึ้นต้น ys- เท่านั้น · สีตาม rh_tokens.css (กรมท่า #0E1E3D · แดง = ปุ่มทำเงิน · เขียว = LINE เท่านั้น) */
.ys { --n:#0E1E3D; --n2:#17294D; --red:#E2302B; --red2:#C42620; --line:#06C755; --mut:#4A5470; --bd:#E3E6EE; --alt:#F4F5F8; --tag:#EEF0F5; --ok:#1E7B4A; --okbg:#E6F4EC;
	--r:10px; font-family:'Sarabun',sans-serif; color:var(--n); }
.ys *, .ys *::before, .ys *::after { box-sizing:border-box; }
.ys [hidden] { display:none !important; }   /* กล่องที่ตั้ง display เอง (flex/grid) ต้องซ่อนตาม hidden */
.ys-i { width:18px; height:18px; flex:none; fill:none; stroke:currentColor; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
.ys-sr { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap; }

/* ── หัวหน้า: แบบหน้าฝากตัวใหม่ (รูปเต็มกว้าง + ไล่สีกรมท่า) + นกฮูกพื้นใสชิดขอบล่างขวา ── */
.ys-hero { position:relative; overflow:hidden; color:#fff; background:var(--n); }
.ys-bg, .ys-bg img { position:absolute; inset:0; width:100%; height:100%; }
.ys-bg img { object-fit:cover; object-position:center 60%; max-width:none; }
.ys-shade { position:absolute; inset:0; background:linear-gradient(90deg, rgba(10,22,48,.94) 0%, rgba(10,22,48,.78) 45%, rgba(10,22,48,.2) 100%); }
.ys-hin { position:relative; max-width:1240px; margin:0 auto; padding:44px 24px 0; display:flex; align-items:flex-end; gap:24px; min-height:340px; }
.ys-htext { flex:1; min-width:0; display:flex; flex-direction:column; gap:10px; padding-bottom:44px; }
.ys .ys-crumb { background:transparent; padding:0; margin:0; font-size:14px; }
.ys .ys-crumb > li, .ys .ys-crumb a, .ys .ys-crumb > li + li::before { color:#C9CFDC; }
.ys .ys-crumb > li:last-child a { color:#fff; }
.ys-eyebrow { margin:6px 0 0; font-weight:700; font-size:15px; color:#C9CFDC; letter-spacing:.02em; }
.ys .ys-h1 { margin:0; font-size:64px; font-weight:800; line-height:1.05; color:#fff; letter-spacing:-.01em; text-align:left; }
.ys .ys-h1 em { font-style:normal; color:#FF6B63; }
.ys-lead { margin:0; font-size:18px; line-height:1.7; color:#E6E9F0; max-width:600px; }
.ys-stat { margin:0; font-size:15px; color:#C9CFDC; }
.ys-owl { flex:none; width:300px; height:300px; line-height:0; align-self:flex-end; }
.ys-owl { position:relative; }
.ys-owl img, .ys-owl video, .ys-owl canvas { width:100%; height:100%; object-fit:contain; display:block; }

/* ── ฟอร์ม 3 ขั้น ── */
.ys-main { max-width:1240px; margin:0 auto; padding:28px 24px 64px; }
.ys-formwrap { scroll-margin-top:96px; display:grid; grid-template-columns:minmax(0, 1.55fr) minmax(260px, 1fr); gap:40px; align-items:start; }
.ys-form { min-width:0; }
.ys-hp { position:absolute; left:-9999px; width:1px; height:1px; overflow:hidden; }
.ys-bar { display:flex; gap:6px; margin-bottom:6px; }
.ys-bar i { flex:1; height:5px; border-radius:5px; background:var(--bd); transition:background .2s; }
.ys-bar i.on { background:var(--n); }
.ys-stepno { margin:0 0 10px; color:var(--mut); font-size:14px; }
.ys-step { border:0; padding:0; margin:0; min-width:0; display:flex; flex-direction:column; gap:18px; }
.ys-q { display:flex; flex-direction:column; gap:8px; min-width:0; }
.ys-lab { margin:0; font-weight:700; font-size:16px; }
.ys-lab small { font-weight:400; color:var(--mut); font-size:14px; }
.ys-lab label { font-weight:700; margin:0; }
.ys-chips { display:flex; flex-wrap:wrap; gap:8px; }
.ys-chip { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:0 16px; border:1px solid var(--bd); border-radius:999px; background:#fff; color:var(--n);
	font:inherit; font-size:15px; font-weight:600; cursor:pointer; transition:background .15s, border-color .15s; white-space:nowrap; }
.ys-chip:hover { border-color:#9AA6BD; }
.ys-chip[aria-pressed="true"] { background:var(--n); border-color:var(--n); color:#fff; }
.ys-chip:focus-visible, .ys-btn:focus-visible, .ys-link:focus-visible { outline:3px solid #FF8A80; outline-offset:2px; }
.ys-chip.ys-x2 { background:var(--tag); }
.ys-chip.ys-x2[aria-pressed="true"] { background:var(--n); border-color:var(--n); color:#fff; }   /* 11-12 เจ้าของ: "ทำเลไหนก็ได้"/"ใส่เอง" ตอนเลือก = ขาวบนพื้นอ่อนอ่านไม่ออก */
.ys-chip .ys-i { width:16px; height:16px; }
.ys-chip-n { font-weight:400; opacity:.75; font-size:13px; }
.ys-own { display:flex; align-items:center; gap:8px; flex-wrap:wrap; }
.ys-own label { display:flex; align-items:center; gap:6px; font-weight:600; margin:0; }
.ys-own input, .ys-pick input, .ys textarea { font:inherit; font-size:16px; border:1px solid var(--bd); border-radius:var(--r); padding:10px 12px; min-height:44px; color:var(--n); background:#fff; }
.ys-own input { width:130px; }
.ys textarea { width:100%; resize:vertical; }
.ys-hint { margin:0; color:var(--mut); font-size:14px; }
.ys-hint-top { margin-top:-6px; }
.ys-note { margin:4px 0 0; background:var(--alt); border-radius:var(--r); padding:8px 12px; color:var(--mut); font-size:14px; }
.ys-nav { display:flex; gap:10px; margin-top:4px; }
.ys-btn { display:inline-flex; align-items:center; justify-content:center; gap:8px; min-height:48px; padding:0 22px; border-radius:var(--r); border:0; font:inherit; font-size:16px; font-weight:700;
	cursor:pointer; text-decoration:none; transition:background .15s, filter .15s; }
.ys-btn-navy { background:var(--n); color:#fff; } .ys-btn-navy:hover { background:var(--n2); color:#fff; }
.ys-btn-red { background:var(--red); color:#fff; } .ys-btn-red:hover { background:var(--red2); color:#fff; }
.ys-btn-out { background:#fff; color:var(--n); border:1.5px solid var(--n); }
.ys-btn-line { background:var(--line); color:#fff; } .ys-btn-line:hover { filter:brightness(.94); color:#fff; }
.ys-btn[disabled] { opacity:.6; cursor:progress; }
.ys-w100 { width:100%; }
.ys-nav .ys-btn-navy, .ys-nav .ys-btn-red { min-width:180px; }
.ys-link { background:none; border:0; padding:0; font:inherit; color:var(--n); text-decoration:underline; text-underline-offset:3px; cursor:pointer; font-weight:600; }

/* ปฏิทินในหน้า (เดือนไทย · พ.ศ.) */
.ys-cal { border:1px solid var(--bd); border-radius:12px; padding:10px; max-width:360px; background:#fff; }
.ys-cal-h { display:flex; align-items:center; gap:6px; font-weight:700; margin-bottom:6px; }
.ys-cal-h span { flex:1; text-align:center; }
.ys-cal-h button { width:40px; height:40px; border-radius:999px; border:1px solid var(--bd); background:#fff; color:var(--n); cursor:pointer; display:grid; place-items:center; }
.ys-cal-h button[disabled] { opacity:.35; cursor:default; }
.ys-cal-g { display:grid; grid-template-columns:repeat(7, 1fr); gap:2px; text-align:center; }
.ys-cal-g b { font-size:12px; color:var(--mut); font-weight:600; padding:4px 0; }
.ys-cal-g button { height:40px; border:0; border-radius:8px; background:none; font:inherit; font-size:15px; color:var(--n); cursor:pointer; }
@media (hover:hover) { .ys-cal-g button:hover:not([disabled]):not([aria-pressed="true"]) { background:var(--tag); } }   /* 11-13 ดึก iPhone แตะแล้ว hover ค้าง = วันที่เลือกเป็นเทาจางตัวขาว (เจ้าของ "เหมือนค้าง") */
.ys-cal-g button[disabled] { color:#B8BFCD; cursor:default; }
.ys-cal-g button[aria-pressed="true"] { background:var(--n); color:#fff; }

/* ช่องพิมพ์ทำเล + รายชื่อ */
.ys-pick { position:relative; display:flex; align-items:center; }
.ys-pick > .ys-i { position:absolute; left:12px; color:var(--mut); pointer-events:none; }
.ys-pick input { width:100%; padding-left:40px; }
.ys-sug { position:absolute; z-index:30; left:0; right:0; top:calc(100% + 4px); margin:0; padding:6px; list-style:none; background:#fff; border:1px solid var(--bd); border-radius:12px;
	box-shadow:0 10px 30px rgba(14,30,61,.15); max-height:320px; overflow:auto; }
.ys-sug li { padding:10px 12px; border-radius:8px; cursor:pointer; display:flex; gap:8px; align-items:baseline; min-height:44px; }
.ys-sug li[aria-selected="true"], .ys-sug li:hover { background:var(--tag); }
.ys-sug li small { color:var(--mut); font-size:12.5px; flex:none; }
.ys-sug li.ys-sug-none { color:var(--mut); cursor:default; background:none; }
.ys-placed .ys-chip { background:var(--n); color:#fff; border-color:var(--n); }
.ys-placed:not(:empty) { margin-top:8px; gap:6px; }
.ys-placed .ys-chip { min-height:32px; padding:0 8px 0 12px; font-size:13.5px; gap:4px; }   /* รอบ 3 เจ้าของ: ทำเลที่เลือกด้านบน = ป้ายเล็ก */
.ys-placed .ys-chip .ys-i { width:14px; height:14px; }
/* รอบ 3: ย่านแบ่งกลุ่ม · แถบกลุ่ม = ข้อความขีดเส้นใต้ (ไม่ใช่ปุ่มเลือก) · มือถือเลื่อนข้าง · ปุ่มย่าน = .ys-chip เดิม (กดแล้วกรมท่าอยู่ที่เดิม) */
.ys-anyw { margin-bottom:10px; }
.ys-zg { display:flex; gap:4px; overflow-x:auto; scrollbar-width:none; margin:-2px 0 10px; border-bottom:1px solid var(--bd); }
.ys-zg::-webkit-scrollbar { display:none; }
.ys .ys-zc { white-space:normal; text-align:left; line-height:1.3; padding-top:7px; padding-bottom:7px; max-width:100%; }   /* 11-13 ชื่อย่านเต็ม (ยาวสุด 48 ตัว) = ขึ้นบรรทัดได้ ไม่ล้นจอ 360 */
.ys-zt { flex:none; border:0; border-radius:0; background:none; font:inherit; font-size:14.5px; color:var(--mut); padding:8px 10px; min-height:40px; border-bottom:3px solid transparent; margin-bottom:-1px; cursor:pointer; white-space:nowrap; }
.ys-zt[aria-selected="true"] { color:var(--n); font-weight:700; border-bottom-color:var(--n); }
.ys-zt:focus { outline:0; } .ys-zt:focus-visible { outline:3px solid #FF8A80; outline-offset:-3px; }
.ys-zn { display:inline-grid; place-items:center; min-width:18px; height:18px; margin-left:5px; padding:0 4px; border-radius:9px; background:var(--n); color:#fff; font-style:normal; font-size:11.5px; font-weight:700; vertical-align:1px; }
#ys-cm-hint { margin-top:8px; }

/* กล่องขวา "หลังส่งจะเป็นยังไง" (คอม) */
.ys-how { background:var(--alt); border-radius:14px; padding:20px 22px; font-size:15px; position:sticky; top:96px; }
.ys-how b { display:block; font-size:17px; margin-bottom:8px; }
.ys-how ol { margin:0; padding-left:20px; display:flex; flex-direction:column; gap:6px; color:var(--mut); }
.ys-how p { margin:12px 0 0; padding-top:12px; border-top:1px solid var(--bd); font-weight:700; }

/* ── ผล ── */
.ys-res { margin-top:0; display:flex; flex-direction:column; gap:14px; scroll-margin-top:84px; }
@media (max-width:767px) { .ys-res { scroll-margin-top:92px; } }
/* รอบ 3 เจ้าของ "UI ทับตอนแก้ไข": กดแก้ไข = ฟอร์มเปิดเหนือผลเดิม → เว้นระยะ + เส้นคั่น (เดิมหัวผลติดปุ่มต่อไป) */
#ys-top:not([hidden]) ~ #ys-res { margin-top:28px; padding-top:22px; border-top:1px solid var(--bd); }
.ys-rhead { display:flex; align-items:flex-end; gap:16px; flex-wrap:wrap; }
.ys-rtitle { flex:1; min-width:280px; }
.ys .ys-rtitle h2 { margin:0; font-size:28px; font-weight:800; text-align:left; }
.ys-sum { margin:4px 0 0; color:var(--mut); }
.ys-explain { margin:6px 0 0; font-size:13.5px; color:var(--mut); }
.ys-tabs { display:inline-flex; border:1px solid var(--bd); border-radius:999px; overflow:hidden; background:#fff; }
.ys-tabs button { border:0; background:none; font:inherit; font-weight:700; font-size:15px; padding:0 18px; min-height:44px; color:var(--n); cursor:pointer; }
.ys-tabs button.on { background:var(--n); color:#fff; }
.ys-tabs b { font-weight:700; }
.ys-pets { margin:0; font-size:14px; color:var(--mut); background:var(--alt); border-radius:var(--r); padding:8px 12px; }
.ys-grid { display:grid; grid-template-columns:repeat(4, minmax(0,1fr)); gap:16px; }
.ys-pgrid { grid-template-columns:repeat(3, minmax(0,1fr)); }
.ys-card { position:relative; border:1px solid var(--bd); border-radius:14px; overflow:hidden; background:#fff; display:flex; flex-direction:column; min-width:0; }
.ys-card-a { color:inherit; text-decoration:none; display:flex; flex-direction:column; flex:1; }
.ys-card-a:hover, .ys-card-a:focus { color:inherit; text-decoration:none; }
.ys-ph { position:relative; aspect-ratio:4/3; background:linear-gradient(135deg,#D9DEE8,#C3CBD9); overflow:hidden; }
.ys-ph img { width:100%; height:100%; object-fit:cover; display:block; }
.ys-strip { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:3px; padding-top:3px; background:#fff; }   /* 11-14 รูปเล็กใต้ปกการ์ด Yes! Sure (≤ 3 · ช่องสุดท้าย = ดูทั้งหมด) */
.ys-strip-2 { grid-template-columns:repeat(2,minmax(0,1fr)); }
.ys-sp { position:relative; display:block; height:84px; overflow:hidden; background:#E3E6EE; }
.ys-card.ys-hs .ys-mapb { top:calc(75cqw + 97px); }   /* แถวรูปเล็ก 84 + ช่อง 3 = หมุดเลื่อนลงตาม (เดิม 75cqw = ใต้ปก) */
.ys-sp img { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; display:block; }
.ys-pct { position:absolute; left:8px; top:8px; background:var(--n); color:#fff; font-weight:700; font-size:13px; border-radius:7px; padding:2px 9px; }
.ys-pct.lo { background:#4A5470; }
.ys-cmpb { position:absolute; right:8px; top:8px; z-index:2; min-height:32px; border-radius:999px; padding:0 12px; font:inherit; font-size:13px; font-weight:700; border:1px solid var(--bd); background:#fff; color:var(--n); cursor:pointer; }
.ys-cmpb[aria-pressed="true"] { background:var(--n); color:#fff; border-color:var(--n); }
.ys-cb { padding:10px 12px 12px; display:flex; flex-direction:column; gap:3px; flex:1; }
.ys-pr { font-weight:800; font-size:18px; } .ys-pr small { font-weight:400; color:var(--mut); font-size:13px; }
.ys-tt { font-weight:600; font-size:14.5px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ys-meta { color:var(--mut); font-size:13.5px; }
.ys-why { list-style:none; margin:6px 0 0; padding:6px 0 0; border-top:1px solid var(--bd); display:flex; flex-direction:column; gap:1px; font-size:13.5px; }
.ys-why .y { color:var(--ok); } .ys-why .n { color:var(--mut); } .ys-why .m { color:#8A5A00; }
.ys-st { margin-top:6px; display:flex; flex-wrap:wrap; gap:6px; align-items:center; font-size:13px; }
.ys-badge { display:inline-block; background:var(--okbg); color:var(--ok); border-radius:6px; padding:1px 8px; font-weight:700; font-size:12.5px; }
.ys-badge.soon { background:#FDECEA; color:#B3261E; }
.ys-badge.mut { background:var(--tag); color:var(--mut); }
.ys-ask { margin:0 12px 12px; min-height:44px; font-size:15px; }
/* รอบ 3: ปุ่มแผนที่ = มุมขวาบรรทัดราคา (ใต้รูป 4:3 · cqw = กว้างการ์ด) · อยู่นอกลิงก์การ์ด */
.ys-card { container-type:inline-size; }
.ys-mapb { position:absolute; right:10px; top:calc(75cqw + 10px); z-index:2; display:inline-grid; place-items:center; width:36px; height:36px; padding:0; border:1px solid var(--bd); border-radius:50%; background:#fff; color:var(--n); cursor:pointer; }   /* เจ้าของ: เหลือไอคอนหมุด */
.ys-mapb:hover { border-color:#9AA6BD; }
.ys-mapb:focus-visible { outline:3px solid #FF8A80; outline-offset:2px; }
.ys-mapb .ys-i { width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:2; }
.ys-card .ys-pr { padding-right:44px; line-height:36px; }   /* 11-12 เจ้าของ "หมุดบังตัวหนังสือ": บรรทัดราคาสูงเท่าหมุด (36) · หมุดอยู่ในบรรทัดราคาพอดี ไม่ล้นลงบรรทัดชื่อ */
.ys-need { margin:6px 0 0; color:var(--red); font-size:14px; font-weight:700; }   /* "เลือกงบก่อน" */
@media (min-width:768px) { .ys-ask { min-height:40px; } }
/* ข้อมูลห้อง = ตัวหนังสือเทา + ไอคอนเล็ก (เจ้าของ: ป้ายพื้นเทา "แย่งเด่น") · ไอคอนชุดเดียวกับการ์ดหน้าค้นหา rh_cards.css */
.ys-facts { display:flex; flex-wrap:wrap; gap:2px 12px; }
@media (min-width:768px) { .ys-facts { gap:2px 8px; font-size:13px; } .ys-f { gap:4px; } }   /* การ์ดคอมแคบ (4 ใบ/แถว) = บรรทัดเดียว */
.ys-f { display:inline-flex; align-items:center; gap:5px; white-space:nowrap; }
.ys-f::before { content:""; flex:none; width:13px; height:13px; background:currentColor; -webkit-mask:var(--rhi) no-repeat center / contain; mask:var(--rhi) no-repeat center / contain; }
.ys-f-area { --rhi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5'%3E%3Crect x='2.5' y='2.5' width='11' height='11' rx='1.5'/%3E%3Cpath d='M5.5 10.5l5-5M8 5.5h2.5V8'/%3E%3C/svg%3E"); }
.ys-f-room { --rhi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M1.5 12.5v-8M1.5 10h13v2.5M14.5 10V8.2a2 2 0 0 0-2-2H7V10'/%3E%3Ccircle cx='4.3' cy='7.7' r='1.3'/%3E%3C/svg%3E"); }
.ys-f-bath { --rhi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linecap='round'%3E%3Cpath d='M1.5 8h13v1.5a3.5 3.5 0 0 1-3.5 3.5H5a3.5 3.5 0 0 1-3.5-3.5zM3.5 8V3.6A1.6 1.6 0 0 1 6.6 3M4.5 13l-.8 1.5M11.5 13l.8 1.5'/%3E%3C/svg%3E"); }
.ys-f-floor { --rhi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5' stroke-linejoin='round'%3E%3Cpath d='M8 2l6 3-6 3-6-3 6-3zM2 8l6 3 6-3M2 11l6 3 6-3'/%3E%3C/svg%3E"); }
.ys-f-st { --rhi:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='none' stroke='black' stroke-width='1.5'%3E%3Crect x='4' y='1.8' width='8' height='9.5' rx='2.2'/%3E%3Cpath d='M4 7h8M6 14.2l1-2.9M10 14.2l-1-2.9'/%3E%3C/svg%3E"); }
.ys-more { display:flex; flex-direction:column; align-items:center; gap:6px; margin-top:14px; }
.ys-empty, .ys-moreask { background:var(--alt); border-radius:14px; padding:18px 20px; display:flex; flex-wrap:wrap; align-items:center; gap:12px; }
.ys-empty b { font-size:18px; } .ys-empty p, .ys-moreask p { margin:0; flex:1; min-width:220px; color:var(--mut); }
.ys-moreask b { color:var(--n); }
.ys-skel { border:1px solid var(--bd); border-radius:14px; height:340px; background:linear-gradient(90deg, #F1F3F7 25%, #E8EBF1 50%, #F1F3F7 75%); background-size:200% 100%; animation:ys-sk 1.2s linear infinite; }
@keyframes ys-sk { to { background-position:-200% 0; } }
.ys-pcard .ys-cb { gap:4px; }
.ys-pcard .ys-pn { font-weight:800; font-size:16px; }
.ys-pbtns { display:flex; flex-wrap:wrap; gap:8px; margin:10px 12px 12px; }
.ys-pbtns .ys-btn { min-height:44px; font-size:14.5px; padding:0 14px; }
.ys-map { height:520px; border-radius:14px; overflow:hidden; background:#E9EDF3; display:grid; place-items:center; }

.ys-map { display:block; position:relative; }
.ys-map > .ys-hint { position:absolute; inset:0; display:grid; place-items:center; }
/* หมุดแผนที่ = ชุดเดียวกับหลังบ้าน (admin/rh_map.css .rhm-pin/.rhm-cl/.rhm-st · เจ้าของ 12 พ.ย. "ใช้ของหลังบ้าน") */
.ys .rhm-pin { border:2px solid #1e2a7a; background:#fff; color:#1e2a7a; border-radius:999px; padding:2px 9px; font:700 12.5px/1.35 'Sarabun',sans-serif; white-space:nowrap; box-shadow:0 2px 6px rgba(11,17,80,.35); cursor:pointer; position:absolute; top:0; left:0; }   /* 11-12 เจ้าของ "Yes! Sure ตำแหน่งเพี้ยนมาก": relative ทับ absolute ของ MapLibre = หมุดเรียงต่อกัน เลื่อนจากจุดจริงสะสม (บั๊กเดียวกับหลังบ้าน 11-08) */
.ys .rhm-pin small { font-weight:600; opacity:.8; margin-left:4px; font-size:11.5px; }
.ys .rhm-pin.a0 { border-color:#8A93B5; color:#4A5470; }
.ys .rhm-pin.sel { background:#f97316; color:#fff; border-color:#fff; box-shadow:0 0 0 3px rgba(249,115,22,.35), 0 3px 10px rgba(150,60,0,.45); z-index:5; }   /* 11-12 เลิก scale = ตัวหนังสือเบลอ */
.ys .rhm-pin .nm { display:none; position:absolute; top:100%; left:50%; transform:translateX(-50%); margin-top:3px; font-size:11.5px; font-weight:600; color:#151a3a; text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff; max-width:160px; overflow:hidden; text-overflow:ellipsis; pointer-events:none; }
.ys .rhm.z15 .rhm-pin .nm, .ys .rhm-pin.sel .nm { display:block; }
.ys .rhm-cl { display:grid; place-items:center; min-width:54px; padding:5px 9px; border-radius:16px; border:2px solid #fff; background:rgba(30,42,122,.9); color:#fff; box-shadow:0 2px 8px rgba(11,17,80,.35); cursor:pointer; line-height:1.2; font-family:'Sarabun',sans-serif; }
.ys .rhm-cl b { font-size:13px; } .ys .rhm-cl small { font-size:10.5px; opacity:.85; }
.ys .rhm-st { display:none; font-size:11px; font-weight:600; color:#3c4266; text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff; white-space:nowrap; pointer-events:none; border-left:3px solid var(--c, #555b80); padding-left:3px; }
.ys .rhm.z13 .rhm-st { display:block; }
/* 11-13 สไลด์งบ → ย้ายไป rh_bslider.css (ใช้ร่วมหน้าแผนที่) · เหลือที่ผูกกับแผงบนแผนที่ของ Yes! Sure */
.ys-mfp .ys-bs-m { flex-basis:100%; margin-top:4px; }
/* 11-13 (ง) แถบปรับเงื่อนไขเหนือแผนที่ (แบบ 99.co) · ปุ่มมน 2 บรรทัด (หัวเล็ก + ค่า) · แผงตัวเลือกลอยใต้แถบ */
.ys-mf { position:relative; display:flex; gap:8px; margin:0 0 10px; flex-wrap:wrap; }
.ys-mfb { display:inline-flex; align-items:center; gap:6px; min-height:44px; padding:4px 12px 4px 14px; border:1.5px solid var(--bd); border-radius:999px; background:#fff; color:var(--n); font:inherit; cursor:pointer; text-align:left; }
.ys-mfb small { font-size:12px; color:var(--mut); font-weight:600; }
.ys-mfb b { font-size:14.5px; white-space:nowrap; }
.ys-mfb .ys-i { width:16px; height:16px; transition:transform .15s; }
.ys-mfb[aria-expanded="true"] { border-color:var(--n); box-shadow:0 0 0 1px var(--n); }
.ys-mfb[aria-expanded="true"] .ys-i { transform:rotate(180deg); }
.ys-mfb:focus-visible { outline:3px solid #f97316; outline-offset:2px; }
.ys-mfp { position:absolute; z-index:40; left:0; top:calc(100% + 6px); width:min(420px, 100%); display:flex; flex-wrap:wrap; gap:8px; padding:12px; background:#fff; border:1px solid var(--bd); border-radius:14px; box-shadow:0 10px 30px rgba(14,30,61,.18); }
.ys-mf.busy .ys-mfb { opacity:.55; pointer-events:none; }
.ys-mf.busy::after { content:"กำลังคัดใหม่…"; align-self:center; font-size:13.5px; color:var(--mut); }
@media (prefers-reduced-motion: reduce) { .ys-mfb .ys-i { transition:none; } }
@media (max-width:767px) { .ys-mf { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; padding-bottom:2px; } .ys-mf::-webkit-scrollbar { display:none; } .ys-mfb { flex:none; } .ys-mfp { position:fixed; left:12px; right:12px; top:auto; bottom:calc(16px + env(safe-area-inset-bottom, 0px)); width:auto; } html.ys-mf-on #chat { visibility:hidden; } }
/* 11-13 (ข) ป้ายระยะถึงที่ทำงาน/ที่เรียนบนหมุด (แบบ 99.co "14m") · มุมขวาบนของหมุด · หมุดที่ทำงาน = กระเป๋าส้มเข้ม + ชื่อ */
.ys .rhm-pin .wk { position:absolute; right:-6px; top:-11px; font-style:normal; background:#0E1E3D; color:#fff; font-size:10.5px; font-weight:700; line-height:1; padding:3px 5px; border-radius:99px; box-shadow:0 0 0 1.5px #fff; white-space:nowrap; pointer-events:none; }
.ys .rhm-pin.sel .wk { background:#E2302B; }
.ysm-wk { display:inline-flex; align-items:center; gap:4px; padding:3px 8px 3px 5px; border-radius:99px; background:#7a3e00; color:#fff; font:700 12px/1.3 'Sarabun',sans-serif; box-shadow:0 0 0 2px #fff, 0 2px 6px rgba(0,0,0,.3); white-space:nowrap; }
.ysm-wk svg { width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:2; stroke-linejoin:round; }
.ysm-wk b { max-width:140px; overflow:hidden; text-overflow:ellipsis; }
.ysm-pt { width:18px; height:18px; border-radius:50% 50% 50% 0; transform:rotate(-45deg); background:var(--red); border:3px solid #fff; box-shadow:0 1px 4px rgba(0,0,0,.35); }
/* การ์ดลอยล่างแผนที่ (แบบหลังบ้าน) */
.ysm-card { position:absolute; z-index:6; left:10px; right:10px; bottom:10px; max-width:520px; display:flex; background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 6px 24px rgba(14,30,61,.25); }
.ysm-ph { width:132px; flex:none; background:linear-gradient(135deg,#D9DEE8,#C3CBD9); }
.ysm-ph img { width:100%; height:100%; object-fit:cover; display:block; }
.ysm-bd { flex:1; min-width:0; padding:10px 12px; display:flex; flex-direction:column; gap:2px; }
.ysm-bd b { font-size:15.5px; line-height:1.3; padding-right:30px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ysm-m { color:var(--mut); font-size:13.5px; }
.ysm-go { margin-top:6px; border:0; border-radius:0; border-top:1px solid var(--bd); background:none; font:inherit; font-weight:700; color:#1e2a7a; display:flex; justify-content:space-between; align-items:center; min-height:44px; padding:0; cursor:pointer; }
.ysm-go.ysm-ask { color:var(--red); }
.ysm-go i { font-style:normal; font-size:20px; }
.ysm-x { position:absolute; top:6px; right:6px; width:32px; height:32px; border-radius:999px; border:0; background:rgba(14,30,61,.08); color:var(--n); font-size:20px; line-height:1; cursor:pointer; }

/* แถบล่างติดจอ ys-tray เลิกใช้ 11-14 (→ ไพ่ซ้อนหัวเว็บ · rh_saved.js RHSavedOwn) */

/* กล่องเด้ง (เทียบ · ทัก LINE) */
.ys-dlg { position:fixed; inset:0; z-index:1060; background:rgba(10,22,48,.55); display:flex; align-items:center; justify-content:center; padding:16px; }
.ys-dlg[hidden] { display:none; }
.ys-dlg-in { background:#fff; border-radius:16px; width:100%; max-width:560px; max-height:calc(100vh - 32px); overflow:auto; padding:18px 20px 20px; display:flex; flex-direction:column; gap:12px; }
.ys-dlg-head { display:flex; align-items:center; gap:10px; }
.ys .ys-dlg-head h2 { flex:1; margin:0; font-size:21px; font-weight:800; text-align:left; }
.ys-x { width:44px; height:44px; border-radius:999px; border:0; background:var(--tag); color:var(--n); cursor:pointer; display:grid; place-items:center; }
.ys-line-sum { margin:0; display:flex; flex-wrap:wrap; gap:6px; }   /* รอบ 3: ป้ายเล็ก (ชุด .ys-tag หัวผล) */
.ys-line-sum .ys-tag { white-space:normal; }
.ys-tag-b { background:var(--n); color:#fff; }
/* รอบ 3: ทัก LINE บนคอม = QR ให้สแกนด้วยมือถือ */
.ys-lqr { display:flex; gap:16px; align-items:center; border:1px solid var(--bd); border-radius:var(--r); padding:12px; }
.ys-lqr-i { flex:none; width:168px; height:168px; display:grid; place-items:center; color:var(--mut); font-size:13px; }
.ys-lqr-i svg { width:100%; height:100%; display:block; }
.ys-lqr-t { display:flex; flex-direction:column; gap:4px; min-width:0; font-size:14px; color:var(--mut); }
.ys-lqr-t b { color:var(--n); font-size:16px; }
.ys-lqr-k { color:var(--n); font-weight:600; }
.ys-lqr-cp { margin-top:8px; align-self:flex-start; min-height:40px; font-size:14px; }
.ys-sale { display:flex; gap:12px; align-items:center; border:1px solid var(--bd); border-radius:12px; padding:10px 12px; }
.ys-av { width:52px; height:52px; border-radius:50%; object-fit:cover; background:var(--tag); flex:none; display:grid; place-items:center; font-weight:800; color:var(--n); }
.ys-sale-n b { display:block; font-size:16px; } .ys-sale-n span { color:var(--mut); font-size:13.5px; }
.ys-other { align-self:center; font-size:14px; }
.ys-others { display:flex; flex-direction:column; gap:6px; }
.ys-others button { display:flex; gap:10px; align-items:center; border:1px solid var(--bd); border-radius:12px; padding:8px 10px; background:#fff; font:inherit; color:var(--n); cursor:pointer; text-align:left; min-height:52px; }
.ys-others button[aria-pressed="true"] { border-color:var(--n); box-shadow:inset 0 0 0 1px var(--n); }
.ys-others .ys-av { width:40px; height:40px; }
.ys-bubble { align-self:flex-end; max-width:94%; background:var(--line); color:#fff; border-radius:12px 12px 2px 12px; padding:9px 12px; font-size:14px; white-space:pre-wrap; word-break:break-word; }
.ys-err { margin:0; color:#B3261E; font-weight:600; }
.ys-cmp-body { overflow-x:auto; }
.ys-ct { width:100%; border-collapse:collapse; font-size:14px; }
.ys-ct th, .ys-ct td { border-bottom:1px solid var(--bd); padding:8px 6px; text-align:left; vertical-align:top; }
.ys-ct th { color:var(--mut); font-weight:600; width:26%; }
.ys-ct td img { width:100%; aspect-ratio:4/3; object-fit:cover; border-radius:8px; display:block; }
.ys-ct .best { color:var(--ok); font-weight:700; }

@media (max-width:1100px) { .ys-grid { grid-template-columns:repeat(3, minmax(0,1fr)); } .ys-pgrid { grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:900px) { .ys-formwrap { grid-template-columns:minmax(0,1fr); gap:20px; } .ys-how { position:static; order:2; } .ys-grid { grid-template-columns:repeat(2, minmax(0,1fr)); } }
@media (max-width:767px) {
	.ys-hin { padding:72px 16px 0; min-height:0; gap:6px; }
	.ys-shade { background:linear-gradient(180deg, rgba(10,22,48,.55) 0%, rgba(10,22,48,.9) 55%, rgba(10,22,48,.96) 100%); }
	.ys-bg img { object-position:center top; }
	.ys-htext { padding-bottom:22px; gap:6px; }
	.ys .ys-h1 { font-size:40px; }
	.ys-lead { font-size:15.5px; line-height:1.6; }
	.ys-stat { font-size:13.5px; }
	.ys-owl { width:118px; height:118px; margin-right:-8px; }
	.ys-main { padding:20px 16px 40px; }
	.ys-how { display:none; }
	.ys-chip { padding:0 14px; font-size:14.5px; }
	.ys-own input { width:110px; }
	.ys-nav .ys-btn { flex:1; min-width:0; }
	.ys-nav .ys-btn-navy, .ys-nav .ys-btn-red { flex:2; }
	.ys .ys-rtitle h2 { font-size:22px; }
	.ys-tabs { width:100%; } .ys-tabs button { flex:1; padding:0 8px; font-size:14px; }
	.ys-grid { grid-template-columns:minmax(0,1fr); gap:12px; }
	.ys-pgrid { grid-template-columns:minmax(0,1fr); }
	.ys-pcard { flex-direction:row; flex-wrap:wrap; }
	.ys-pcard .ys-ph { width:112px; flex:none; aspect-ratio:auto; min-height:120px; }
	.ys-pcard .ys-cb { flex:1; min-width:0; }
	.ys-pcard .ys-pbtns { flex-basis:100%; margin-top:0; }
	.ys-map { height:60vh; }
	.ys-dlg { align-items:flex-end; padding:0; }
	.ys-dlg-in { border-radius:16px 16px 0 0; max-height:92vh; padding:16px 16px calc(18px + env(safe-area-inset-bottom, 0px)); }
}
@media (prefers-reduced-motion: reduce) { .ys-skel { animation:none; } .ys-bar i, .ys-chip, .ys-btn { transition:none; } }

/* โหมดเซลกรอกแทน (yes_sure.php?sale=1) */
.ys-staff { margin:0 0 14px; background:#FFF4E5; color:#8A5A00; border-radius:10px; padding:10px 14px; font-weight:600; }
.ys-staffout { display:flex; flex-direction:column; gap:8px; background:var(--okbg); border-radius:12px; padding:12px; }
.ys-staffout input { font:inherit; min-height:44px; border:1px solid #CFE8D8; border-radius:8px; padding:0 10px; width:100%; }

/* ── 11-12 รอบปรับตามเจ้าของ (หัวผลเป็นป้าย · การ์ดรหัส+โครงการ · หน้าเทียบใหม่ · ค้นบนแผนที่) ── */
.ys-sum { display:flex; align-items:center; gap:8px; margin:8px 0 0; min-width:0; }
.ys-tags { display:flex; flex-wrap:wrap; gap:6px; min-width:0; }
.ys-tag { display:inline-flex; align-items:center; min-height:30px; padding:0 11px; border-radius:999px; background:var(--tag); color:var(--n); font-size:13.5px; font-weight:600; white-space:nowrap; }
.ys-edit { flex:none; min-height:30px; padding:0 12px; border-radius:999px; border:1.5px solid var(--n); background:#fff; color:var(--n); font:inherit; font-size:13.5px; font-weight:700; cursor:pointer; }
.ys-edit:hover { background:var(--n); color:#fff; }
.ys-edit:focus-visible { outline:3px solid #FF8A80; outline-offset:2px; }
.ys-explain { margin:8px 0 0; }
.ys-tt .ys-code { font-weight:800; }
.ys-how ol strong { color:var(--n); margin-right:4px; }

/* หน้าเทียบ */
#ys-cmp .ys-dlg-in { max-width:940px; }
.ys-cmp-body { flex:none; overflow-x:auto; overflow-y:hidden; -webkit-overflow-scrolling:touch; border:1px solid var(--bd); border-radius:12px; }
.ys-ct { min-width:calc(130px + var(--cols, 3) * 190px); font-size:14px; width:calc(130px + (100% - 130px) * var(--cols, 3) / 3); table-layout:fixed; }   /* รอบ 3 เจ้าของ "ไม่ควรขยายเวลาปิด": กว้างคอลัมน์ = แบบ 3 ห้องเสมอ (× เอาออกแล้วห้องที่เหลือไม่ขยายเต็ม) */
.ys-ct th, .ys-ct td { padding:9px 10px; }
.ys-ct th[scope="row"], .ys-ct-head > th, .ys-ct-act > th { position:sticky; left:0; z-index:1; background:#fff; width:130px; min-width:130px; color:var(--mut); font-weight:600; font-size:13.5px; }
.ys-ct td { min-width:170px; }
.ys-ct-head td { vertical-align:top; padding-top:12px; }
.ys-ct-ph { position:relative; border-radius:10px; overflow:hidden; aspect-ratio:4/3; background:linear-gradient(135deg,#D9DEE8,#C3CBD9); margin-bottom:6px; }
.ys-ct .ys-ct-ph img { position:absolute; inset:0; width:100%; height:100%; max-width:none; object-fit:cover; object-position:center; border-radius:0; aspect-ratio:auto; display:block; }   /* 11-14 เจ้าของ (ไอโฟน) "เทียบห้องเห็นแต่ฝ้าเพดาน": ในเซลล์ตาราง Safari ใช้ขนาดจริงของรูป (720px) = เห็นแค่มุมซ้ายบน → ตรึงรูปเต็มกรอบ (absolute) */
.ys-ct-no { position:absolute; left:6px; top:6px; width:26px; height:26px; border-radius:50%; background:var(--n); color:#fff; font-weight:800; font-size:13.5px; display:grid; place-items:center; box-shadow:0 1px 3px rgba(0,0,0,.3); }
/* × กลมมุมขวารูป = แบบปุ่มลบรูปในฟอร์มเพิ่มอสังหาฯ (.rdz-rm) · พื้นที่กด 36px */
.ys-cx { position:absolute; right:6px; top:6px; width:32px; height:32px; border-radius:50%; border:0; background:rgba(0,0,0,.62); color:#fff; display:grid; place-items:center; cursor:pointer; padding:0; }
.ys-cx::before { content:''; position:absolute; inset:-4px; }
.ys-cx .ys-i { width:16px; height:16px; stroke-width:2.6; }
.ys-cx:hover { background:rgba(0,0,0,.8); }
.ys-cx:focus-visible { outline:3px solid #FF8A80; outline-offset:2px; }
.ys-ct-code { display:block; font-size:15px; }
.ys-ct-pj { display:block; color:var(--mut); font-size:13px; line-height:1.4; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.ys-ct-sec th { background:var(--alt); color:var(--n); font-weight:800; font-size:13.5px; padding:7px 10px; text-align:left; border-bottom:1px solid var(--bd); }
.ys-ct td.best { background:var(--okbg); }
/* ช่องว่างในตารางเทียบ (มีไม่ถึง 3 ห้อง) = กรอบเส้นประกดกลับไปเลือก · แถวอื่นช่องว่างเปล่า */
.ys-ct td.ys-ct-emp { background:transparent; }
.ys-ct-add { width:100%; aspect-ratio:4/3; display:flex; flex-direction:column; align-items:center; justify-content:center; gap:4px; border:1.5px dashed #B8C0D2; border-radius:10px; background:var(--alt); color:var(--n); font:inherit; cursor:pointer; padding:8px; text-align:center; }
.ys-ct-add:hover { border-color:var(--n); }
.ys-ct-add:focus-visible { outline:3px solid #FF8A80; outline-offset:2px; }
.ys-ct-plus { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#fff; border:1px solid var(--bd); font-size:20px; line-height:1; }
.ys-ct-add b { font-size:14px; } .ys-ct-add small { font-size:12px; color:var(--mut); }
.ys-bestt { display:block; font-size:12px; font-weight:700; color:var(--ok); }
.ys-bestt::before { content:'✓ '; }
.ys-ct-act td { display:table-cell; }
/* 11-13 บ่าย ลูกศรเลื่อนด้านบน (ช่องหัวติดซ้าย) · คอมจอกว้างโชว์ครบ 5 ห้องไม่ต้องเลื่อน */
.ys-ct-head > th.ys-ct-navc { vertical-align:bottom; padding-bottom:14px; }
.ys-ct-nav { display:flex; gap:8px; }
.ys-ct-secl { position:sticky; left:10px; }   /* 11-13 บ่าย เจ้าของ "เลื่อนแล้วสั่น": เดิม th ติดซ้ายด้วย + span ติดซ้าย = ซ้อน 2 ชั้นสั่น → ติดที่ span ชั้นเดียว */
.ys-ct-nav[hidden] { display:none; }
.ys-ct-arr { width:40px; height:40px; border-radius:50%; border:1.5px solid var(--n); background:#fff; color:var(--n); font:inherit; font-size:24px; line-height:1; font-weight:700; cursor:pointer; display:grid; place-items:center; padding:0 0 3px; }
.ys-ct-arr:hover:not([disabled]) { background:var(--alt); }
.ys-ct-arr[disabled] { opacity:.3; cursor:default; }
.ys-ct-arr:focus-visible { outline:3px solid #FF8A80; outline-offset:2px; }
@media (min-width:992px) { .ys-ct { width:100%; min-width:calc(130px + var(--cols, 3) * 170px); } #ys-cmp.ys-cmp-wide .ys-dlg-in { max-width:min(1200px, 96vw); } }
/* 11-13 บ่าย ตารางเทียบ: ปุ่ม "ดูรายละเอียด" ใต้ชื่อห้องด้านบน + แถวโครงการ/ย่านเป็นลิงก์ (แบบ LivingInsider · เจ้าของชอบ) */
.ys-ct-top { display:inline-flex; align-items:center; min-height:34px; margin-top:8px; padding:0 12px; border:1.5px solid var(--n); border-radius:8px; color:var(--n); font-size:13.5px; font-weight:700; text-decoration:none; background:#fff; }
.ys-ct-top:hover { background:var(--alt); color:var(--n); }
.ys-ct-lnk { color:var(--n); font-weight:600; text-decoration:underline; text-underline-offset:2px; }
.ys-ct-lnk:hover { color:var(--red2); }
.ys-ct-act .ys-btn { width:100%; min-height:42px; font-size:14.5px; padding:0 10px; margin-bottom:6px; }
.ys-cmp-map { flex:none; height:260px; border-radius:12px; overflow:hidden; background:#E9EDF3; position:relative; }
#ys-cmp .ys-lab { margin-top:2px; }
.ys-cmp-foot { position:sticky; z-index:3; bottom:-20px; background:#fff; padding:8px 0 0; margin-bottom:-4px; }
.ysm-mpin { cursor:default; }
.ys .ysm-mw .rhm-pin .nm { display:block; }   /* แผนที่เล็กหน้าเทียบ: ชื่อโครงการใต้หมุดตลอด */   /* หมุดหน้าเทียบ = แบบแผนที่หลัก (ไม่ต้องกด) */
.ysm-no { width:30px; height:30px; border-radius:50%; background:var(--n); color:#fff; border:2.5px solid #fff; font:800 14px/1 'Sarabun',sans-serif; display:grid; place-items:center; box-shadow:0 2px 6px rgba(11,17,80,.4); }

/* ช่องค้นสถานที่บนแผนที่ (แบบหลังบ้าน .rhm-q) */
.ysm-q { position:absolute; z-index:7; left:10px; top:10px; width:min(360px, calc(100% - 20px)); display:flex; align-items:center; background:#fff; border-radius:12px; box-shadow:0 4px 16px rgba(14,30,61,.2); }
.ysm-q > .ys-i { position:absolute; left:12px; color:var(--mut); pointer-events:none; }
.ysm-q input { width:100%; min-height:44px; border:0; border-radius:12px; padding:0 12px 0 40px; font:inherit; font-size:16px; color:var(--n); background:transparent; }
.ysm-q input:focus { outline:2px solid var(--n); outline-offset:0; }
.ysm-sugg { position:absolute; left:0; right:0; top:calc(100% + 4px); background:#fff; border-radius:12px; box-shadow:0 10px 30px rgba(14,30,61,.2); padding:6px; max-height:300px; overflow:auto; }
.ysm-sugg .gh { padding:8px 10px; color:var(--mut); font-size:13.5px; }
.ysm-opt { display:flex; width:100%; align-items:baseline; gap:8px; min-height:44px; padding:8px 10px; border:0; border-radius:8px; background:none; font:inherit; color:var(--n); text-align:left; cursor:pointer; }
.ysm-opt:hover, .ysm-opt.hl { background:var(--tag); }
.ysm-opt .n { flex:1; min-width:0; font-weight:600; font-size:15px; }
.ysm-opt .sub { flex:none; color:var(--mut); font-size:12.5px; max-width:45%; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ysm-place { display:block; line-height:0; filter:drop-shadow(0 2px 3px rgba(0,0,0,.3)); }
.ysm-look { top:62px; bottom:auto; }   /* การ์ดจุดที่ค้นอยู่ใต้ช่องค้น = เห็นทันทีไม่ต้องเลื่อน (มือถือแผนที่สูงเกินจอ) */
.ysm-look .ysm-bd { padding:12px 14px; }
.ysm-go[disabled] { opacity:.6; cursor:progress; }

@media (max-width:767px) {
	.ys-sum { align-items:flex-start; }
	.ys-tags { flex-wrap:nowrap; overflow-x:auto; scrollbar-width:none; -webkit-overflow-scrolling:touch; margin-right:-4px; padding-bottom:2px; }
	.ys-tags { -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent); mask-image:linear-gradient(90deg,#000 calc(100% - 28px),transparent); }   /* ป้ายที่ล้นจางก่อนถึงปุ่มแก้ไข (ไม่ดูเหมือนทับ) */
	.ys-tags::-webkit-scrollbar { display:none; }
	.ys-explain { font-size:13px; }
	#ys-cmp.ys-dlg { align-items:stretch; }
	#ys-cmp .ys-dlg-in { max-height:100dvh; height:100dvh; border-radius:0; }
	.ys-ct { min-width:calc(96px + var(--cols, 3) * 150px); font-size:13.5px; width:calc(96px + (100% - 96px) * var(--cols, 3) / 3); }
	.ys-ct th[scope="row"], .ys-ct-head > th, .ys-ct-act > th { width:96px; min-width:96px; font-size:12.5px; padding:8px 6px; }
	.ys-ct td { min-width:142px; padding:8px; }
	.ys-cmp-map { height:220px; }
	.ys-cmp-foot { bottom:calc(-18px - env(safe-area-inset-bottom, 0px)); padding-bottom:4px; }
	.ysm-q { right:10px; width:auto; }
}

/* ── 11-12 รอบ 2: แผนที่ = ชุดหลังบ้าน (ปุ่มวนแบบแผนที่ · ตำแหน่งฉัน · สถานที่ใกล้เคียง) · การ์ดโครงการมือถือ ── */
.ysm-top { position:absolute; z-index:7; left:10px; top:10px; right:10px; display:flex; gap:8px; align-items:flex-start; pointer-events:none; }
.ysm-top > * { pointer-events:auto; }
.ysm-top .ysm-q { position:relative; left:auto; top:auto; right:auto; flex:1; width:auto; max-width:360px; }
.ysm-me { flex:none; width:44px; height:44px; border-radius:50%; border:0; background:#fff; color:#1e2a7a; box-shadow:0 4px 16px rgba(14,30,61,.2); display:grid; place-items:center; cursor:pointer; }
.ysm-me[disabled] { opacity:.6; cursor:progress; }
.ysm-poib { position:absolute; z-index:6; left:10px; top:62px; display:inline-flex; align-items:center; gap:3px; min-height:34px; padding:0 12px 0 10px; border:0; border-radius:999px; background:#fff; color:var(--n); box-shadow:0 2px 10px rgba(14,30,61,.18); font:inherit; font-size:13px; font-weight:700; cursor:pointer; }
.ysm-poib i { width:9px; height:9px; border-radius:50%; background:var(--c); border:1.5px solid #fff; box-shadow:0 0 0 1px rgba(0,0,0,.08); }
.ysm-poib span { margin-left:4px; }
.ysm-poib[aria-pressed="false"] { background:#F4F5F8; color:var(--mut); } .ysm-poib[aria-pressed="false"] i { opacity:.35; }
.ysm-poi { border:0; background:none; padding:0; font:600 11.5px/1.2 'Sarabun',sans-serif; color:var(--c); text-shadow:0 0 3px #fff, 0 0 3px #fff, 0 0 2px #fff; white-space:nowrap; max-width:150px; overflow:hidden; text-overflow:ellipsis; cursor:pointer; }
.ysm-look { top:104px; }
/* ปุ่มรูปย่อวนแบบแผนที่ (= admin/rh_map.css .rhm-skin) */
.ys .rhm-skin { display:grid; gap:2px; justify-items:center; width:64px; padding:3px 3px 4px; border:0; border-radius:10px; background:#fff; box-shadow:0 1px 6px rgba(0,0,0,.3); font:inherit; font-size:11px; font-weight:600; line-height:1.3; color:#1a2577; cursor:pointer; }
.ys .rhm-skin:focus-visible { outline:3px solid #1a2577; outline-offset:2px; }
.ys .rhm-skin-i { display:block; width:58px; height:44px; border-radius:7px; background-color:#eff1f4; background-position:center; background-size:cover; }
.ys .rhm-skin.to-g .rhm-skin-i { background-image:linear-gradient(0deg, transparent 44%, #fff 44% 58%, transparent 58%), linear-gradient(90deg, transparent 36%, #fff 36% 48%, transparent 48%), linear-gradient(118deg, transparent 62%, #9dd5f6 62% 76%, transparent 76%), linear-gradient(30deg, #cbe8cc 0 22%, transparent 22%); }
.ys .rhm-skin.to-p .rhm-skin-i { background-color:#f3f3f1; background-image:linear-gradient(0deg, transparent 44%, #fff 44% 58%, transparent 58%), linear-gradient(90deg, transparent 36%, #fff 36% 48%, transparent 48%), linear-gradient(118deg, transparent 62%, #d4dadc 62% 76%, transparent 76%); box-shadow:inset 0 0 0 1px #e2e3e6; }
.ys .rhm-skin.to-d .rhm-skin-i { background-color:#22252b; background-image:linear-gradient(0deg, transparent 44%, #3a3f48 44% 58%, transparent 58%), linear-gradient(90deg, transparent 36%, #3a3f48 36% 48%, transparent 48%), linear-gradient(118deg, transparent 62%, #12161c 62% 76%, transparent 76%); }
/* ห้องของโครงการที่แตะบนแผนที่ (ใต้แผนที่ · ไม่เปลี่ยนแท็บ) */
.ys-mrooms { margin-top:14px; scroll-margin-top:92px; }
.ys-mrooms-h { display:flex; align-items:center; gap:10px; margin:0 0 10px; }
.ys .ys-mrooms-h h3 { flex:1; margin:0; font-size:18px; font-weight:800; text-align:left; }
.ys-mrooms-h .ys-x { width:40px; height:40px; }
@media (max-width:767px) {
	.ys .maplibregl-ctrl-bottom-left .maplibregl-ctrl { margin-bottom:30px; }
	.ysm-top .ysm-q { max-width:none; }
	/* การ์ดโครงการ: ปุ่มเต็มแถวล่าง แบ่งครึ่ง (เจ้าของ "ปุ่มเบียด ตำแหน่งแปลก") */
	.ys-pcard .ys-pbtns { flex-basis:100%; margin:0; padding:10px 12px 12px; border-top:1px solid var(--bd); gap:8px; flex-wrap:nowrap; }
	.ys-pcard .ys-pbtns .ys-btn { flex:1; min-width:0; min-height:44px; padding:0 8px; }
	.ys-mrooms-h h3 { font-size:16.5px; }
}
/* 11-12 เจ้าของ "น้องไปแอบแล้ว": แถบเทียบท้ายจอ (ys-tray) ทับปุ่มลอยน้องคาปิ → ยกปุ่มขึ้นเหนือแถบ (แบบหน้าฝากทรัพย์ rcv-sticky-on) */
/* 11-12 แท็บย่าน: เงาจางที่ขอบที่ยังเลื่อนได้ (ใบ้มือถือว่าปัดได้) · ป้าย "ทีมเช็คสถานะให้ก่อนนัด" (ห้องไม่ได้เช็คเกิน 6 เดือน) */
.ys-zg.fr { -webkit-mask-image:linear-gradient(90deg, #000 calc(100% - 40px), transparent); mask-image:linear-gradient(90deg, #000 calc(100% - 40px), transparent); }
.ys-zg.fl { -webkit-mask-image:linear-gradient(90deg, transparent, #000 40px); mask-image:linear-gradient(90deg, transparent, #000 40px); }
.ys-zg.fl.fr { -webkit-mask-image:linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent); mask-image:linear-gradient(90deg, transparent, #000 40px, #000 calc(100% - 40px), transparent); }
.ys-chk2 { color:var(--n); }
.ys-st .ys-chk { color:#11603A; font-weight:700; }   /* 11-13 บ่าย เช็คว่างล่าสุด ≤ 60 วัน = สีเดียวกับ .rhc-chk */
.ys-st .ys-chk::before { content:""; display:inline-block; width:12px; height:12px; margin-right:3px; vertical-align:-1px; background:currentColor; -webkit-mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat; mask:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' fill='none' stroke='%23000' stroke-width='3.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='M4 12.5l5 5L20 6.5'/%3E%3C/svg%3E") center/contain no-repeat; }
/* 11-12 เจ้าของ "Yes! Sure ทำให้เหมือนหน้าแผนที่" = ชุดเดียวกับ rh_amap.css: ไอคอน/สีประเภท · รูปเล็กตอนซูมใกล้ · ปุ่มกลับไปที่ · ปุ่ม Google Maps · ไม่เบลอ */
.ys .ty-i { width:13px; height:13px; flex:none; display:inline-block; vertical-align:-2px; margin-right:3px; fill:none; stroke:currentColor; stroke-width:2.2; stroke-linecap:round; stroke-linejoin:round; }
.ys .rhm-pin.ty-h:not(.sel) { border-color:#15803d; color:#15803d; }
.ys .rhm-pin.ty-t:not(.sel) { border-color:#7c3aed; color:#7c3aed; }
.ys .rhm-pin.ty-o:not(.sel) { border-color:#92400e; color:#92400e; }
.ys .rhm-pin img.th { display:none; }
.ys .rhm.z15 .rhm-pin.ph { display:flex; align-items:center; justify-content:center; padding:2px 10px 2px 2px; border-radius:12px; }
.ys .rhm.z15 .rhm-pin.ph img.th { display:block; order:-1; width:34px; height:34px; margin-right:7px; border-radius:9px; object-fit:cover; background:#E3E6EE; }
.ys .maplibregl-marker { will-change:auto; }
.ys .rhm-st { height:16px; line-height:16px; }
.ys .ysm-ph { position:relative; }
.ys .ram-gm { position:absolute; left:6px; bottom:6px; padding:3px 9px; border-radius:999px; background:rgba(255,255,255,.95); color:#1a2577; font-size:12px; font-weight:700; line-height:1.4; text-decoration:none; white-space:nowrap; box-shadow:0 2px 8px rgba(11,17,80,.2); }
.ys .ram-gm:hover, .ys .ram-gm:focus { background:#1a2577; color:#fff; text-decoration:none; }
.ys .rhm { container-type:inline-size; }
.ys .ram-back { position:absolute; z-index:9; left:50%; bottom:16px; transform:translateX(-50%); display:inline-flex; align-items:center; gap:5px; max-width:min(230px, calc(100% - 140px)); height:30px; padding:0 11px 0 9px; border:1px solid rgba(26,37,119,.22); border-radius:999px; background:#fff; color:#1a2577; font:inherit; font-size:12.5px; font-weight:600; box-shadow:0 1px 6px rgba(16,22,70,.18); cursor:pointer; }   /* 11-13 = rh_amap.css (ปุ่มขาวเล็ก) */
.ys .ram-back svg { width:14px; height:14px; }
.ys .ram-back:hover { background:#f2f4fa; }
.ys .ram-back[hidden] { display:none; }
.ys .ram-back span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; min-width:0; }
.ys .ram-back svg { flex:none; }
.ys .rhm:has(.ysm-card) .ram-back { bottom:calc(var(--cardh, 120px) + 20px); }
@container (min-width: 820px) { .ys .rhm:has(.ysm-card) .ram-back { left:552px; bottom:20px; transform:none; max-width:calc(100% - 620px); } }   /* 11-12 เจ้าของ "กลับไปมันสูงไป" */
@media (max-width:767px) { .ys .ram-gm { left:5px; bottom:5px; padding:2px 7px; font-size:11px; } }

/* 11-13 ทำเลครบ 3 · หาไม่เจอ = ชี้บนแผนที่ */
.ys-pick input:disabled { background:var(--alt); color:var(--mut); cursor:not-allowed; opacity:1; }
.ys-pfull { margin-top:6px; color:var(--red2); }
.ys-zfull { margin:0; color:var(--mut); }
.ys-car2 { margin-top:8px; align-items:center; }   /* 11-13 ดึก "มีรถมากกว่า 1 คัน" โผล่เมื่อเลือกรถยนต์ */
.ys-car2-l { font-size:14px; color:var(--mut); margin-right:2px; }   /* หัว "รถยนต์กี่คัน" (เจ้าของ: อ่านแล้วนึกว่าเป็นของมอไซค์) */
#ys-pop { touch-action:pan-y; }   /* 11-13 ดึก ปัดซ้าย/ขวาบนรายการย่าน = เปลี่ยนกลุ่ม (แถบด้านบนยังแตะได้) */
#ys-pop.ys-sl-l { animation:ys-sl-l .22s ease-out; } #ys-pop.ys-sl-r { animation:ys-sl-r .22s ease-out; }
@keyframes ys-sl-l { from { transform:translateX(28px); opacity:.35; } } @keyframes ys-sl-r { from { transform:translateX(-28px); opacity:.35; } }
@media (prefers-reduced-motion: reduce) { #ys-pop.ys-sl-l, #ys-pop.ys-sl-r { animation:none; } }   /* 11-13 ดึก ครบ 3 ที่ = หุบรายการย่านเหลือบรรทัดนี้ */
.ys-sug li.ys-sug-miss { flex-wrap:wrap; align-items:center; gap:8px 12px; }
.ys-sug-miss > span { flex:1 1 140px; min-width:0; overflow-wrap:anywhere; }
.ys-sug-map { display:inline-flex; align-items:center; gap:6px; min-height:40px; padding:0 14px; border-radius:99px; border:1.5px solid var(--n); background:#fff; color:var(--n); font:inherit; font-size:14.5px; font-weight:700; cursor:pointer; }
.ys-sug-map:hover, .ys-sug-map:focus-visible { background:var(--n); color:#fff; }
html.ys-pk-on, html.ys-pk-on body { overflow:hidden; }
.ys-pk { position:fixed; inset:0; z-index:2000; background:rgba(14,30,61,.55); display:flex; align-items:center; justify-content:center; padding:24px; }
.ys-pk-c { background:#fff; border-radius:16px; width:min(720px,100%); height:min(640px,100%); display:flex; flex-direction:column; overflow:hidden; box-shadow:0 20px 60px rgba(14,30,61,.35); }
.ys-pk-h { display:flex; align-items:center; gap:10px; padding:12px 12px 12px 18px; border-bottom:1px solid var(--bd); }
.ys-pk-h b { flex:1; font-size:16px; line-height:1.35; }
.ys-pk-x { flex:none; width:44px; height:44px; border:0; background:none; border-radius:50%; color:var(--n); display:grid; place-items:center; cursor:pointer; }
.ys-pk-x:hover { background:var(--tag); }
.ys-pk-mw { position:relative; flex:1; min-height:0; }
.ys-pk .ys-pk-m, .ys-pk .ys-pk-m.maplibregl-map { position:absolute; inset:0; background:#eef0f5; }   /* MapLibre ใส่ .maplibregl-map{position:relative} = กล่องสูง 0 แผนที่หาย */
.ys-pk-c:focus { outline:none; }
.ys-pk-pin { position:absolute; left:50%; top:50%; width:40px; height:40px; margin:-35px 0 0 -20px;   /* ปลายหมุดอยู่ที่ 21/24 ของรูป = 35px → ปลายแตะกลางแผนที่พอดี */ pointer-events:none; z-index:2; color:var(--red); filter:drop-shadow(0 2px 3px rgba(14,30,61,.35)); }
.ys-pk-pin .ys-i { width:40px; height:40px; fill:var(--red); stroke:#fff; stroke-width:1.5; }
.ys-pk-pin .ys-i circle { fill:#fff; stroke:none; }
.ys-pk-f { display:flex; align-items:center; gap:12px; padding:12px 12px 12px 18px; border-top:1px solid var(--bd); }
.ys-pk-n { flex:1; min-width:0; font-weight:600; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.ys-pk-f .ys-btn { flex:none; }
@media (max-width:767px) {
	.ys-pk { padding:0; align-items:stretch; }
	.ys-pk-c { width:100%; height:100%; border-radius:0; }
	.ys-pk-h { padding-top:max(12px, env(safe-area-inset-top, 0px)); }
	.ys-pk-f { padding-bottom:max(12px, env(safe-area-inset-bottom, 0px)); }
}

/* ── 11-13 ค่ำ ปักบนแผนที่ = มีจุดเกาะ: ช่องค้น + ตำแหน่งของฉัน (ชุด .ysm-top) · เส้นรถไฟฟ้า+ชื่อสถานี = ชุดเดิม (rh_yes_map.js) · "ไม่เจอ" บอกทางไปต่อ ── */
.ysm-pk-top { z-index:8; }
.ysm-pk-top .ysm-q { max-width:none; }
.ys-sug-miss > span small { display:block; color:var(--mut); font-size:12.5px; font-weight:400; }