/* ════════════════════════════════════════════════════════════════
           * DEBTOR SEARCH — Premium Navy·Gold redesign  (dsx- namespace)
           * Scoped to #pg-dashboard. This <style> sits in the body, so it
           * loads AFTER ket-theme.css and wins the cascade. !important is used
           * ONLY to defeat ket-theme's own !important rules (inputs/table/card).
           * ════════════════════════════════════════════════════════════════ */
          #pg-dashboard {
            --dsx-px: clamp(16px, 3.6vw, 44px);
            --dsx-navy:var(--brand-navy); --dsx-navy-d:#08192e; --dsx-gold:var(--brand-gold); --dsx-gold-br:#e3c785;
            padding:0 !important; background:transparent !important;
          }
          .dsx-wrap { display:flex; flex-direction:column; min-height:calc(100vh - var(--tb-header-h)); font-family:'Sarabun',sans-serif; color:var(--tb-text); }

          /* ── HERO MASTHEAD ── */
          .dsx-hero { position:relative; overflow:hidden; padding:38px var(--dsx-px) 36px;
            background:linear-gradient(158deg,#08192e 0%,var(--brand-navy) 56%,#15315e 100%); }
          .dsx-hero::before { content:''; position:absolute; inset:0; pointer-events:none;
            background:radial-gradient(ellipse 58% 92% at 88% 24%, rgba(200,169,106,.14) 0%, transparent 60%); }
          /* คืนเส้นทองวิ่งเดิม (เจ้าของขอ 2026-06-24) — animate เฉพาะ 3px line เปลืองน้อย */
          .dsx-hero::after { content:''; position:absolute; left:0; right:0; bottom:0; height:3px;
            background:linear-gradient(90deg,transparent,var(--brand-gold) 26%,#efd9a3 50%,var(--brand-gold) 74%,transparent);
            background-size:200% 100%; animation:dsxGold 9s linear infinite; }
          @keyframes dsxGold { to { background-position:200% 0; } }
          .dsx-hero-inner { position:relative; }

          .dsx-hero-top { display:flex; align-items:flex-start; justify-content:space-between; gap:18px; flex-wrap:wrap; margin-bottom:20px; }
          .dsx-eyebrow { font-size:10px; letter-spacing:.2em; text-transform:uppercase; color:var(--dsx-gold); font-weight:700;
            display:inline-flex; align-items:center; gap:9px; margin-bottom:8px; }
          .dsx-eyebrow::before { content:''; width:24px; height:1px; background:linear-gradient(90deg,var(--dsx-gold),transparent); }
          .dsx-h1 { margin:0; font-family:'Cinzel','Sarabun',serif; font-size:clamp(22px,3vw,30px); font-weight:700; color:#fff;
            letter-spacing:.02em; line-height:1.15; text-shadow:0 2px 18px rgba(0,0,0,.28); }
          .dsx-sub { margin-top:7px; font-size:12.5px; color:rgba(255,255,255,.5); }
          .dsx-sub .dsx-link { color:var(--dsx-gold-br); background:none; border:none; cursor:pointer; font:inherit; text-decoration:underline; padding:0; }

          .dsx-hero-actions { display:flex; gap:9px; align-items:center; flex-wrap:wrap; }
          .dsx-btn-ghost, .dsx-btn-gold { font-family:inherit; font-size:13px; font-weight:700; cursor:pointer;
            padding:10px 18px; border-radius:8px; display:inline-flex; align-items:center; gap:7px; white-space:nowrap;
            transition:background .18s, color .18s, border-color .18s, box-shadow .18s; }
          .dsx-btn-ghost { background:rgba(255,255,255,.06); color:rgba(255,255,255,.82); border:1px solid rgba(255,255,255,.18); }
          .dsx-btn-ghost:hover { background:rgba(255,255,255,.13); color:#fff; }
          .dsx-btn-gold { background:linear-gradient(180deg,#d9ba7a,var(--brand-gold)); color:#0a1e3d; border:1px solid var(--brand-gold); box-shadow:0 6px 18px rgba(200,169,106,.28); }
          .dsx-btn-gold:hover { background:linear-gradient(180deg,#e6ca86,#d2b478); box-shadow:0 8px 22px rgba(200,169,106,.42); }
          /* gold-outline — แอ็กชันรองบน hero (รับชำระด่วน = filled gold หลักของหน้า, 2026-06-11) */
          .dsx-btn-goldline { font-family:inherit; font-size:13px; font-weight:700; cursor:pointer;
            padding:10px 18px; border-radius:8px; display:inline-flex; align-items:center; gap:7px; white-space:nowrap;
            background:rgba(200,169,106,.08); color:var(--dsx-gold-br); border:1px solid rgba(200,169,106,.55);
            transition:background .18s, color .18s, border-color .18s, box-shadow .18s; }
          .dsx-btn-goldline:hover { background:rgba(200,169,106,.18); color:#fff; border-color:var(--dsx-gold-br); }
          .dsx-btn-gold:focus-visible, .dsx-btn-goldline:focus-visible, .dsx-btn-ghost:focus-visible { outline:2px solid var(--dsx-gold-br); outline-offset:2px; }

          /* ── Quick Pay ปุ่มต่อแถว/การ์ด (เจ้าของขอรับชำระด่วนบนหน้าค้นหา 2026-06-11) ── */
          #pg-dashboard #globalResults .dsx-pay-btn { width:32px; height:32px; border-radius:9px; flex:none;
            border:1.5px solid rgba(200,169,106,.65); background:#fff; color:var(--dsx-gold-deep,#a07d3a);
            font-size:13px; cursor:pointer; display:inline-flex; align-items:center; justify-content:center;
            transition:background .15s, color .15s, border-color .15s, box-shadow .15s; }
          #pg-dashboard #globalResults .dsx-pay-btn:hover { background:linear-gradient(180deg,#d9ba7a,var(--brand-gold));
            color:#0a1e3d; border-color:var(--brand-gold); box-shadow:0 4px 12px rgba(200,169,106,.4); }
          #pg-dashboard #globalResults .dsx-pay-btn:focus-visible { outline:2px solid var(--dsx-gold-deep,#a07d3a); outline-offset:2px; }
          .dsx-pay-card-btn { font-family:inherit; font-size:12px; font-weight:700; cursor:pointer; margin-left:auto;
            padding:6px 13px; border-radius:8px; border:1.5px solid rgba(200,169,106,.65); background:#fff;
            color:var(--dsx-gold-deep,#a07d3a); display:inline-flex; align-items:center; gap:6px; white-space:nowrap;
            transition:background .15s, color .15s, border-color .15s, box-shadow .15s; }
          .dsx-pay-card-btn:hover { background:linear-gradient(180deg,#d9ba7a,var(--brand-gold)); color:#0a1e3d; border-color:var(--brand-gold); }
          .dsx-pay-card-btn:focus-visible { outline:2px solid var(--dsx-gold-deep,#a07d3a); outline-offset:2px; }

          /* search box — พระเอกของหน้า (ขยายใหญ่ + gold glow, 2026-06-05) */
          .dsx-searchbox { display:flex; align-items:center; background:rgba(255,255,255,.09);
            border:2px solid rgba(200,169,106,.55); border-radius:14px; overflow:hidden;
            /* ponytail: ตัด backdrop-filter — searchbox อยู่บน hero gradient ทึบ 100% เบลอไม่มีผลภาพ แต่สร้าง composited layer + jank ตอน keyboard เปิด (iOS) */
            transition:border-color .2s, background .2s, box-shadow .2s;
            box-shadow:0 14px 44px rgba(5,15,35,.45), 0 4px 18px rgba(200,169,106,.16), inset 0 1px 0 rgba(255,255,255,.10); }
          .dsx-searchbox:focus-within { border-color:var(--dsx-gold-br); background:rgba(255,255,255,.13);
            box-shadow:0 0 0 4px rgba(200,169,106,.20), 0 18px 54px rgba(200,169,106,.20); }
          .dsx-search-ic { padding:0 8px 0 24px; color:rgba(200,169,106,.95); font-size:20px; flex:none; }
          /* scope ด้วย #pg-dashboard ให้ชนะ ket-theme `input[type="text"]` glass rule
           * (0,1,1 > .dsx-search-input 0,1,0 — เคยทำช่องค้นหาบน hero เป็นกล่องขาว;
           * precedent เดียวกับ #pg-collateral .col-search-box input) */
          #pg-dashboard .dsx-search-input { flex:1; min-width:0; padding:20px 16px !important; font-size:17px !important;
            border:none !important; background:transparent !important; color:#fff !important; outline:none !important; box-shadow:none !important;
            -webkit-backdrop-filter:none !important; backdrop-filter:none !important; border-radius:0 !important; font-family:inherit !important; caret-color:var(--dsx-gold); }
          #pg-dashboard .dsx-search-input:focus { background:transparent !important; box-shadow:none !important; border-color:transparent !important; animation:none !important; }
          #pg-dashboard .dsx-search-input::placeholder { color:rgba(255,255,255,.4) !important; letter-spacing:.01em; }
          .dsx-search-x { border:none; background:transparent; color:rgba(255,255,255,.4); font-size:20px; line-height:1; padding:0 8px; cursor:pointer; transition:color .15s; }
          .dsx-search-x:hover { color:#fff; }
          .dsx-search-divider { width:1px; align-self:stretch; margin:9px 0; background:rgba(255,255,255,.16); }
          .dsx-group { border:none !important; background:transparent !important; color:rgba(255,255,255,.92) !important;
            font-size:13px !important; font-weight:600 !important; padding:0 14px !important; cursor:pointer; outline:none !important;
            box-shadow:none !important; font-family:inherit !important; min-height:62px; }
          .dsx-group option { color:#1f2a44; }
          .dsx-search-go { border:none; background:var(--dsx-gold); color:#0a1e3d; font-weight:800; font-size:15px; padding:0 32px;
            min-height:64px; cursor:pointer; display:flex; align-items:center; gap:8px; transition:background .15s; letter-spacing:.02em; flex:none; }
          .dsx-search-go:hover { background:#d9ba7a; }
          .dsx-hint { margin-top:11px; font-size:12px; color:rgba(255,255,255,.36); }
          .dsx-hint b { color:rgba(200,169,106,.9); font-weight:700; background:rgba(255,255,255,.08); padding:1px 7px; border-radius:4px; font-family:var(--tb-mono); }

          /* status filter chips — ย้ายจาก KPI tiles ใน hero ลงมาที่ toolbar (2026-06-05)
           * เจ้าของไม่ต้องการ KPI ใหญ่ — เหลือ chip เล็กพร้อมตัวเลขกำกับ ฟิลเตอร์ได้เหมือนเดิม */
          .dsx-status-chips { display:inline-flex; gap:6px; flex-wrap:wrap; align-items:center;
            padding-right:12px; margin-right:4px; border-right:1px solid var(--tb-line); }
          .dsx-stat-dot { width:7px; height:7px; border-radius:50%; flex:none; display:inline-block; }
          .dsx-chip-cnt { font-size:11px; font-weight:800; font-variant-numeric:tabular-nums;
            color:var(--tb-muted); background:rgba(15,42,82,.07); padding:1px 7px; border-radius:10px; }
          .dsx-chip.dash-kpi-tab.on { background:var(--dsx-navy); border-color:var(--dsx-navy); color:#fff;
            box-shadow:0 2px 10px rgba(15,42,82,.22); }
          .dsx-chip.dash-kpi-tab.on .dsx-chip-cnt { background:rgba(255,255,255,.18); color:var(--dsx-gold-br); }

          /* ── TOOLBAR ── */
          .dsx-toolbar { display:flex; align-items:center; justify-content:space-between; gap:14px 18px; flex-wrap:wrap;
            padding:12px var(--dsx-px); border-bottom:1px solid var(--tb-line);
            /* คืนฝ้าแก้วเดิม (เจ้าของขอ 2026-06-24) */
            background:rgba(255,255,255,.7); -webkit-backdrop-filter:blur(18px); backdrop-filter:blur(18px); }
          .dsx-tb-left, .dsx-tb-right { display:flex; align-items:center; gap:10px; flex-wrap:wrap; }
          .dsx-tb-left { min-width:0; }

          .dsx-chip { font-family:inherit; font-size:12.5px; font-weight:600; cursor:pointer; padding:7px 14px; border-radius:20px;
            border:1.5px solid var(--tb-line); background:#fff; color:var(--tb-text-2); display:inline-flex; align-items:center; gap:6px;
            transition:background .15s, color .15s, border-color .15s, box-shadow .15s; white-space:nowrap; }
          .dsx-chip i { font-size:11px; opacity:.8; }
          .dsx-chip:hover { border-color:var(--dsx-gold); color:var(--dsx-navy); background:#faf7f0; }
          .dsx-chip.ever-court.on { background:#f3eeff; border-color:#7c3aed; color:#5b21b6; box-shadow:0 2px 8px rgba(124,58,237,.16); }
          .dsx-chip-writeoff.on { background:var(--dsx-navy); border-color:var(--dsx-navy); color:var(--dsx-gold-br); box-shadow:0 2px 10px rgba(15,42,82,.22); }

          .dsx-recent { display:flex; align-items:center; gap:8px; flex-wrap:wrap; min-width:0; }
          .dsx-recent-lbl { font-size:10px; font-weight:700; color:var(--tb-faint); text-transform:uppercase; letter-spacing:.06em; white-space:nowrap; }
          .dsx-recent-chips { display:flex; gap:6px; flex-wrap:wrap; }
          .srch-recent-chip { font-family:inherit; font-size:12px; cursor:pointer; padding:4px 12px; border-radius:16px;
            border:1px dashed var(--tb-line); background:var(--tb-bg-2); color:var(--tb-text-2); transition:all .15s; display:inline-flex; align-items:center; gap:5px; }
          .srch-recent-chip::before { content:'\f1da'; font-family:'Font Awesome 6 Free'; font-weight:400; font-size:9px; opacity:.5; }
          .srch-recent-chip:hover { border-style:solid; border-color:var(--dsx-gold); color:var(--dsx-navy); background:#fff; }

          .dsx-count { font-size:12.5px; color:var(--tb-muted); font-weight:600; white-space:nowrap; }
          .dsx-count b { color:var(--dsx-navy); font-weight:800; font-variant-numeric:tabular-nums; }
          .dsx-count .dsx-count-sel { color:var(--dsx-gold-deep,#a07d3a); }

          .dsx-sort { display:inline-flex; align-items:center; gap:6px; color:var(--tb-muted); font-size:12px; }
          .dsx-sort > i { font-size:12px; }
          .dsx-sort select { border:1.5px solid var(--tb-line) !important; border-radius:8px !important; background:#fff !important;
            font-size:12.5px !important; font-weight:600 !important; color:var(--tb-text) !important; padding:7px 10px !important; cursor:pointer; font-family:inherit !important; }

          .dsx-seg { display:inline-flex; border:1.5px solid var(--tb-line); border-radius:9px; overflow:hidden; background:#fff; }
          .dsx-seg-btn { border:none; background:transparent; color:var(--tb-muted); cursor:pointer; padding:8px 12px; font-size:13px;
            min-width:38px; display:inline-flex; align-items:center; justify-content:center; transition:background .15s, color .15s; }
          .dsx-seg-btn + .dsx-seg-btn { border-left:1.5px solid var(--tb-line); }
          .dsx-seg-btn:hover { background:var(--tb-bg-2); color:var(--dsx-navy); }
          .dsx-seg-btn.on { background:var(--dsx-navy); color:var(--dsx-gold-br); }

          /* ── BODY / RESULTS ── */
          .dsx-body { width:100%; padding:22px var(--dsx-px) 60px; }
          #pg-dashboard #globalResults { margin-top:0 !important; }

          /* results shell (overrides ket-theme .srch-results .card / global .card) */
          /* ponytail: ตัด backdrop-filter — re-blur ทั้งแผงทุกเฟรมตอน scroll ตาราง + sticky header = แลค. bg ทึบ .97 หน้าตาเหมือนเดิม */
          #pg-dashboard #globalResults .dsx-rcard { background:rgba(255,255,255,.97) !important;
            border:1px solid var(--glass-border) !important; border-radius:16px !important;
            box-shadow:0 18px 44px rgba(15,42,82,.07), inset 0 1px 0 rgba(255,255,255,.9) !important; overflow:hidden; }
          #pg-dashboard #globalResults .dsx-rcard-hd { display:flex; align-items:center; gap:10px; padding:13px 20px;
            border-bottom:1px solid var(--tb-line-soft); font-weight:800; font-size:13.5px; color:var(--dsx-navy); }
          #pg-dashboard #globalResults .dsx-rcard-hd .dsx-hd-ic { color:var(--dsx-gold-deep,#a07d3a); }

          /* premium table (override ket-theme th/td/tr !important) */
          .dsx-tbl-wrap { overflow:auto; }
          #pg-dashboard #globalResults table.dsx-tbl { width:100%; border-collapse:separate !important; border-spacing:0; font-size:13.5px; }
          #pg-dashboard #globalResults .dsx-tbl thead th { position:sticky; top:0; z-index:2;
            background:linear-gradient(180deg,#f3f5f9,#eef1f6) !important; color:var(--dsx-navy) !important; font-weight:700 !important;
            font-size:11px !important; letter-spacing:.04em !important; text-transform:uppercase !important; text-align:left !important;
            padding:11px 14px !important; border-bottom:1.5px solid var(--tb-line) !important; white-space:nowrap; }
          #pg-dashboard #globalResults .dsx-tbl thead th.dsx-sortable { cursor:pointer; user-select:none; }
          #pg-dashboard #globalResults .dsx-tbl thead th.dsx-sortable:hover { color:var(--dsx-gold-deep,#a07d3a) !important; }
          #pg-dashboard #globalResults .dsx-tbl thead th .dsx-sort-ar { margin-left:5px; opacity:.35; font-size:9px; }
          #pg-dashboard #globalResults .dsx-tbl thead th.dsx-sorted .dsx-sort-ar { opacity:1; color:var(--dsx-gold-deep,#a07d3a); }
          #pg-dashboard #globalResults .dsx-tbl tbody td { padding:11px 14px !important; border-bottom:1px solid var(--tb-line-soft) !important;
            background:transparent !important; vertical-align:middle; color:var(--tb-text); }
          #pg-dashboard #globalResults .dsx-tbl tbody tr { transition:background .12s; cursor:pointer; }
          #pg-dashboard #globalResults .dsx-tbl tbody tr:nth-child(even) td { background:rgba(244,246,250,.5) !important; }
          #pg-dashboard #globalResults .dsx-tbl tbody tr:hover td { background:var(--tb-gold-soft) !important; }
          #pg-dashboard #globalResults .dsx-tbl tbody tr.dsx-kbd td { background:rgba(200,169,106,.22) !important; box-shadow:inset 3px 0 0 var(--dsx-gold); }
          #pg-dashboard #globalResults .dsx-tbl.dsx-compact tbody td { padding:6px 14px !important; }
          #pg-dashboard #globalResults .dsx-tbl.dsx-compact thead th { padding:8px 14px !important; }
          #pg-dashboard #globalResults .dsx-cno { color:var(--dsx-navy); font-weight:700; font-family:var(--tb-mono); white-space:nowrap; }
          #pg-dashboard #globalResults .dsx-name { font-weight:600; color:var(--tb-text); }
          #pg-dashboard #globalResults .dsx-name:hover { color:var(--dsx-navy); }
          #pg-dashboard #globalResults .dsx-sub2 { font-size:11px; color:var(--tb-muted); }
          #pg-dashboard #globalResults .dsx-chk { width:15px; height:15px; cursor:pointer; accent-color:var(--dsx-navy); }
          #pg-dashboard #globalResults .srch-hl { background:rgba(200,169,106,.34); color:inherit; border-radius:3px; padding:0 2px; }
          #pg-dashboard #globalResults .dsx-od { display:inline-block; border-radius:5px; padding:2px 9px; font-size:11px; font-weight:700; font-variant-numeric:tabular-nums; }
          #pg-dashboard #globalResults .dsx-od.hi { background:var(--tb-red-bg); color:#b91c1c; }
          #pg-dashboard #globalResults .dsx-od.mid { background:var(--tb-amber-bg); color:#92600b; }
          #pg-dashboard #globalResults .dsx-od.ok { color:var(--tb-green); font-size:13px; }

          /* card grid view */
          .dsx-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(290px,1fr)); gap:14px; }
          /* ponytail: ตัด backdrop-filter — การ์ดผลค้นหา (grid/มือถือ) อาจมีถึง ~500 ใบ เบลอทุกใบ = GPU อ่วมตอน scroll. bg ทึบ .96 แทน */
          .dsx-card { position:relative; background:rgba(255,255,255,.96);
            border:1px solid var(--glass-border); border-left:3px solid var(--tb-line); border-radius:14px; padding:15px 16px 14px; cursor:pointer;
            box-shadow:0 8px 22px rgba(15,42,82,.05); transition:transform .16s, box-shadow .16s, border-color .16s; }
          .dsx-card:hover { transform:translateY(-2px); box-shadow:0 16px 34px rgba(15,42,82,.12); }
          .dsx-card.s-OVERDUE { border-left-color:var(--tb-red); }
          .dsx-card.s-NORMAL { border-left-color:var(--tb-green); }
          .dsx-card.s-DORMANT { border-left-color:#6d28d9; }
          .dsx-card.s-COURT { border-left-color:#7c3aed; }
          .dsx-card.s-CLOSED, .dsx-card.s-WRITEOFF { border-left-color:#9aa6bb; }
          .dsx-card-top { display:flex; align-items:flex-start; justify-content:space-between; gap:10px; margin-bottom:9px; }
          .dsx-card-name { font-size:15px; font-weight:700; color:var(--tb-text); line-height:1.25; }
          .dsx-card-cno { font-size:11.5px; color:var(--dsx-navy); font-weight:700; font-family:var(--tb-mono); margin-top:2px; }
          .dsx-card-rows { display:flex; flex-direction:column; gap:5px; font-size:12.5px; color:var(--tb-text-2); margin:9px 0 11px; }
          .dsx-card-rows .r { display:flex; align-items:center; gap:8px; }
          .dsx-card-rows .r i { width:14px; color:var(--tb-faint); font-size:11px; text-align:center; flex:none; }
          .dsx-card-rows .r span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
          .dsx-card-foot { display:flex; align-items:center; justify-content:space-between; gap:8px; padding-top:10px; border-top:1px solid var(--tb-line-soft); }
          .dsx-card-foot .badge-s { font-size:11px; }
          .dsx-card-chk { position:absolute; top:13px; right:13px; }

          /* empty / loading */
          .dsx-empty, .dsx-loading { text-align:center; padding:48px 22px; color:var(--tb-muted); background:rgba(255,255,255,.62);
            border:1px solid var(--glass-border); border-radius:16px; box-shadow:0 10px 28px rgba(15,42,82,.05); }
          .dsx-empty .dsx-empty-ic { font-size:34px; color:var(--dsx-gold); opacity:.55; margin-bottom:12px; }
          .dsx-empty-title { font-size:16px; font-weight:800; color:var(--tb-text); }
          .dsx-empty-sub { font-size:12.5px; color:var(--tb-muted); margin-top:7px; }
          .dsx-empty code, .dsx-empty-sub code { background:var(--tb-bg-2); border:1px solid var(--tb-line-soft); border-radius:4px; padding:1px 6px; font-family:var(--tb-mono); font-size:11.5px; color:var(--dsx-navy); }
          .dsx-spin { color:var(--dsx-gold-deep,#a07d3a); }

          /* ปุ่ม "แสดงเพิ่ม" — มือถือตัดผลลัพธ์เหลือชุดแรก กันหน้ายาว */
          .dsx-more-btn { display:block; width:100%; margin-top:12px; padding:13px; border-radius:12px;
            border:1.5px dashed var(--tb-line); background:rgba(255,255,255,.7); color:var(--dsx-navy);
            font-family:inherit; font-size:13.5px; font-weight:700; cursor:pointer; }
          .dsx-more-btn:active { background:var(--tb-gold-soft); }

          /* ═══════ iOS spring — entrance + hover รายชื่อลูกค้า (เจ้าของเลือก 2026-06-16) ═══════
             GPU-safe: transform/opacity ล้วน (ห้ามใส่ blur กลับ). entrance เล่นเฉพาะตอนค้นหาใหม่
             (gate .dsx-anim จาก JS — ไม่เล่นซ้ำตอน sort/density/view) และเฉพาะ ~24 ใบ/แถวแรกที่เห็นบนจอ
             กัน 500 ใบ animate พร้อมกันตอน render. ลบบล็อกนี้ + flag _dsxAnimate ใน JS เพื่อ revert. */
          @keyframes dsxIosCard { 0%{opacity:0;transform:translate3d(0,12px,0) scale(.94);} 100%{opacity:1;transform:translate3d(0,0,0) scale(1);} }
          @keyframes dsxIosRow  { 0%{opacity:0;transform:translate3d(0,10px,0);}            100%{opacity:1;transform:translate3d(0,0,0);} }

          /* ปิด ket-fadeIn เดิมบนแถวตาราง + ตั้ง transition hover (transform spring) */
          #pg-dashboard #globalResults .dsx-tbl tbody tr { animation:none; transition:transform .18s cubic-bezier(.34,1.4,.64,1); }
          #pg-dashboard #globalResults .dsx-card { transition:transform .2s cubic-bezier(.34,1.4,.64,1), box-shadow .2s ease; }

          /* ENTRANCE (เฉพาะ .dsx-anim = ค้นหาใหม่) — สปริง overshoot นุ่ม */
          /* fill = backwards: ซ่อนตอน delay (0% state) แต่ไม่ค้าง transform หลังจบ → hover lift ทำงานต่อได้ */
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card { animation:dsxIosCard .55s cubic-bezier(.34,1.4,.64,1) backwards; }
          #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr   { animation:dsxIosRow  .5s  cubic-bezier(.34,1.4,.64,1) backwards; }
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(1), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(1) {animation-delay:0s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(2), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(2) {animation-delay:.03s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(3), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(3) {animation-delay:.06s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(4), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(4) {animation-delay:.09s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(5), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(5) {animation-delay:.12s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(6), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(6) {animation-delay:.15s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(7), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(7) {animation-delay:.18s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(8), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(8) {animation-delay:.21s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(9), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(9) {animation-delay:.24s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(10), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(10) {animation-delay:.27s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(11), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(11) {animation-delay:.30s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(12), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(12) {animation-delay:.33s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(n+13), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(n+13) {animation-delay:.36s}
          #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card:nth-child(n+25), #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr:nth-child(n+25) {animation:none}

          /* HOVER / ACTIVE — ยกตัวสปริง (เงา hover เดิมคงไว้จาก .dsx-card:hover) */
          #pg-dashboard #globalResults .dsx-card:hover { transform:translateY(-3px) scale(1.01); }
          #pg-dashboard #globalResults .dsx-card:active { transform:scale(.985); transition:transform .1s cubic-bezier(.4,0,.6,1); }
          #pg-dashboard #globalResults .dsx-tbl tbody tr:hover { transform:translateY(-1px); }

          @media (prefers-reduced-motion: reduce){
            #pg-dashboard #globalResults.dsx-anim .dsx-grid .dsx-card,
            #pg-dashboard #globalResults.dsx-anim .dsx-tbl tbody tr { animation:none !important; }
            #pg-dashboard #globalResults .dsx-card:hover,
            #pg-dashboard #globalResults .dsx-card:active,
            #pg-dashboard #globalResults .dsx-tbl tbody tr:hover { transform:none !important; }
          }

          /* ── responsive ── */
          @media (max-width:760px) {
            .dsx-searchbox { flex-wrap:wrap; }
            /* scope #pg-dashboard ให้ specificity เท่า base rule (1,1,0) — ไม่งั้น flex/order ไม่ทำงาน */
            #pg-dashboard .dsx-search-input { flex:1 1 100%; order:1; }
            .dsx-search-ic { order:0; }
            .dsx-search-divider { display:none; }
            .dsx-group { flex:1 1 auto; border-top:1px solid rgba(255,255,255,.14) !important; min-height:46px; }
            .dsx-search-go { flex:1 1 auto; min-height:46px; justify-content:center; }
            .dsx-tb-right { width:100%; justify-content:space-between; }
            .dsx-sort { flex:1 1 auto; }
            .dsx-sort select { flex:1; }
          }

          /* ── มือถือ (≤640px): ตัดของตกแต่ง เหลือ ค้นหา + ฟิลเตอร์ + ผลลัพธ์ ──
           * เจ้าของขอ 2026-06-06: หน้าค้นหาบนมือถือยาวเกิน ไม่ต้องโชว์รายละเอียดเท่าคอม */
          @media (max-width:640px) {
            /* hero กระชับ: ซ่อน eyebrow/meta/คีย์ลัด (จอสัมผัสไม่ได้ใช้) */
            .dsx-hero { padding:14px var(--dsx-px) 16px; }
            .dsx-eyebrow, .dsx-sub, .dsx-hint { display:none; }
            .dsx-hero-top { margin-bottom:12px; gap:10px; }
            .dsx-h1 { font-size:18px; }
            .dsx-btn-ghost { display:none !important; }   /* ซ้ำกับปุ่ม × ในช่องค้นหา */
            .dsx-btn-gold, .dsx-btn-goldline { padding:8px 14px; font-size:12.5px; }
            .dsx-pay-card-btn { min-height:44px; padding:8px 16px; font-size:13px; }  /* touch target จอสัมผัส */
            .dsx-searchbox { border-radius:11px; box-shadow:0 8px 24px rgba(5,15,35,.35); }
            #pg-dashboard .dsx-search-input { padding:13px 12px !important; }
            .dsx-group { min-height:44px; }
            .dsx-search-go { min-height:44px; font-size:14px; }

            /* toolbar: chip สถานะแถวเดียวเลื่อนข้าง แทนการตกหลายบรรทัด */
            .dsx-toolbar { padding:8px var(--dsx-px); gap:8px; }
            .dsx-tb-left { flex-wrap:nowrap; overflow-x:auto; -webkit-overflow-scrolling:touch;
              scrollbar-width:none; width:100%; padding-bottom:2px; }
            .dsx-tb-left::-webkit-scrollbar { display:none; }
            .dsx-status-chips { flex-wrap:nowrap; }
            .dsx-chip { flex:none; }
            #srchRecentRow { display:none !important; }    /* ค้นหาล่าสุด — ตัดออกบนมือถือ */
            .dsx-seg { display:none; }                     /* สลับตาราง/การ์ด+ความหนาแน่น — มือถือบังคับการ์ด */
            .dsx-tb-right { gap:8px; }

            /* ผลลัพธ์: การ์ดคอลัมน์เดียว กระชับ */
            .dsx-body { padding:12px var(--dsx-px) 24px; }
            .dsx-grid { grid-template-columns:1fr; gap:11px; }
            .dsx-card { padding:14px 15px 12px; }

            /* ── LUX facelift มือถือ (2026-06-11): การ์ดทอง-นาวี โทนหรู ──
             * คงโครง compact ตามมติเจ้าของ 2026-06-06 — เปลี่ยนเฉพาะผิว.
             * ตัด backdrop-blur บนการ์ด (จอมือถือ scroll ลื่นขึ้น, พื้นไล่เฉดแทน) */
            .dsx-hero { padding:16px var(--dsx-px) 18px; }
            .dsx-h1 { font-size:20px; }
            .dsx-card {
              background:linear-gradient(160deg,#ffffff 0%,#fdfbf6 62%,#f7f1e3 100%);
              -webkit-backdrop-filter:none; backdrop-filter:none;
              border:1px solid rgba(200,169,106,.40);
              border-left-width:4px;
              border-radius:16px;
              box-shadow:0 8px 22px rgba(15,42,82,.08), inset 0 1px 0 #fff;
            }
            /* Passbook band: หัวการ์ดเป็นแถบนาวี ชื่อขาว + เลขสัญญาทอง (full-bleed
             * ด้วย negative margin เท่ากับ padding การ์ด) — มือถือเท่านั้น */
            .dsx-card-top {
              /* padding ขวา 46px เว้นที่ให้ checkbox (absolute top-right) ไม่ทับ chip ค้างงวด */
              margin:-14px -15px 11px; padding:11px 46px 10px 15px;
              background:linear-gradient(158deg,#0c2244 0%,var(--brand-navy) 58%,#16335f 100%);
              border-radius:15px 15px 0 0;
              border-bottom:2px solid rgba(200,169,106,.55);
            }
            .dsx-card-name { font-size:16px; font-weight:800; color:#fff; }
            .dsx-card-name .dsx-sub2 { color:rgba(255,255,255,.55); }
            .dsx-card-cno { color:#e3c785; margin-top:3px; }
            .dsx-card-top .dsx-od.ok { color:#4ade80; }
            .dsx-card-chk { accent-color:var(--brand-gold); }
            .dsx-card-rows { font-size:13px; }
            .dsx-card-rows .r i { color:var(--brand-gold); }
            .dsx-card-foot { border-top:1px dashed rgba(200,169,106,.45); padding-top:10px; }
            .dsx-pay-card-btn { background:linear-gradient(180deg,#fffdf8,#f6ecd6); box-shadow:0 2px 8px rgba(200,169,106,.22); }
            .dsx-chip { border-color:rgba(200,169,106,.42); box-shadow:0 1px 4px rgba(15,42,82,.05); }
            .dsx-chip-cnt { background:rgba(200,169,106,.16); color:#7c5c1d; }
            .dsx-toolbar { background:rgba(252,250,245,.92); border-bottom:1px solid rgba(200,169,106,.30);
              -webkit-backdrop-filter:none; backdrop-filter:none; }
            .dsx-more-btn { border:1.5px solid rgba(200,169,106,.55); background:linear-gradient(180deg,#fffdf8,#f8f2e4);
              color:var(--brand-navy); box-shadow:0 4px 14px rgba(15,42,82,.07); }
            .dsx-empty, .dsx-loading { background:linear-gradient(160deg,#ffffff,#faf6ec);
              border-color:rgba(200,169,106,.35); }
          }
          @media (max-width:480px) {
            .dsx-status-chips { padding-right:0; margin-right:0; border-right:none; }
            #pg-dashboard .dsx-search-input { padding:16px 12px !important; font-size:16px !important; }
            .dsx-search-ic { padding-left:16px; font-size:17px; }
          }
          @media (min-width:900px) { .dsx-tbl-wrap { max-height:calc(100vh - 322px); } }
          @media (prefers-reduced-motion:reduce) {
            .dsx-hero::after { animation:none; }
            .dsx-card, .dsx-card:hover { transition:none; transform:none; }
          }