{"id":808,"date":"2026-09-01T17:40:56","date_gmt":"2026-09-01T10:40:56","guid":{"rendered":"https:\/\/phayaotv.com\/?page_id=808"},"modified":"2026-09-01T18:08:29","modified_gmt":"2026-09-01T11:08:29","slug":"%e0%b8%ad%e0%b8%b3%e0%b9%80%e0%b8%a0%e0%b8%ad%e0%b9%84%e0%b8%ab%e0%b8%99%e0%b8%ad%e0%b8%a2%e0%b8%b2%e0%b8%81%e0%b8%9e%e0%b8%b1%e0%b8%92%e0%b8%99%e0%b8%b2%e0%b8%94%e0%b9%89%e0%b8%b2%e0%b8%99%e0%b9%83","status":"publish","type":"page","link":"https:\/\/phayaotv.com\/?page_id=808","title":{"rendered":"\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e44\u0e2b\u0e19\u0e2d\u0e22\u0e32\u0e01\u0e1e\u0e31\u0e12\u0e19\u0e32\u0e14\u0e49\u0e32\u0e19\u0e43\u0e14?"},"content":{"rendered":"    <div id=\"pes-app\" class=\"pes-app\"\n        data-ajax-url=\"https:\/\/phayaotv.com\/wp-admin\/admin-ajax.php\"\n        data-nonce=\"42ab75ac95\"\n        data-districts=\"[{&quot;name&quot;:&quot;\\u0e40\\u0e21\\u0e37\\u0e2d\\u0e07\\u0e1e\\u0e30\\u0e40\\u0e22\\u0e32&quot;,&quot;x&quot;:76,&quot;y&quot;:215,&quot;r&quot;:36,&quot;color&quot;:&quot;#FFC145&quot;},{&quot;name&quot;:&quot;\\u0e41\\u0e21\\u0e48\\u0e43\\u0e08&quot;,&quot;x&quot;:61,&quot;y&quot;:132,&quot;r&quot;:30,&quot;color&quot;:&quot;#FFD666&quot;},{&quot;name&quot;:&quot;\\u0e20\\u0e39\\u0e01\\u0e32\\u0e21\\u0e22\\u0e32\\u0e27&quot;,&quot;x&quot;:114,&quot;y&quot;:152,&quot;r&quot;:22,&quot;color&quot;:&quot;#FFB347&quot;},{&quot;name&quot;:&quot;\\u0e14\\u0e2d\\u0e01\\u0e04\\u0e33\\u0e43\\u0e15\\u0e49&quot;,&quot;x&quot;:144,&quot;y&quot;:231,&quot;r&quot;:32,&quot;color&quot;:&quot;#FF8B3D&quot;},{&quot;name&quot;:&quot;\\u0e08\\u0e38\\u0e19&quot;,&quot;x&quot;:171,&quot;y&quot;:139,&quot;r&quot;:30,&quot;color&quot;:&quot;#FF9F45&quot;},{&quot;name&quot;:&quot;\\u0e1b\\u0e07&quot;,&quot;x&quot;:274,&quot;y&quot;:182,&quot;r&quot;:42,&quot;color&quot;:&quot;#FF7A45&quot;},{&quot;name&quot;:&quot;\\u0e40\\u0e0a\\u0e35\\u0e22\\u0e07\\u0e04\\u0e33&quot;,&quot;x&quot;:274,&quot;y&quot;:92,&quot;r&quot;:40,&quot;color&quot;:&quot;#F2653A&quot;},{&quot;name&quot;:&quot;\\u0e40\\u0e0a\\u0e35\\u0e22\\u0e07\\u0e21\\u0e48\\u0e27\\u0e19&quot;,&quot;x&quot;:236,&quot;y&quot;:281,&quot;r&quot;:36,&quot;color&quot;:&quot;#E85D2B&quot;},{&quot;name&quot;:&quot;\\u0e20\\u0e39\\u0e0b\\u0e32\\u0e07&quot;,&quot;x&quot;:258,&quot;y&quot;:33,&quot;r&quot;:26,&quot;color&quot;:&quot;#D6331F&quot;}]\"\n        data-q2=\"{&quot;title&quot;:&quot;\\u0e40\\u0e08\\u0e2d\\u0e1b\\u0e31\\u0e0d\\u0e2b\\u0e32\\u0e2d\\u0e30\\u0e44\\u0e23\\u0e21\\u0e32\\u0e01\\u0e17\\u0e35\\u0e48\\u0e2a\\u0e38\\u0e14\\u0e43\\u0e19\\u0e0a\\u0e35\\u0e27\\u0e34\\u0e15\\u0e1b\\u0e23\\u0e30\\u0e08\\u0e33\\u0e27\\u0e31\\u0e19?&quot;,&quot;options&quot;:[&quot;\\u0e01\\u0e32\\u0e23\\u0e40\\u0e14\\u0e34\\u0e19\\u0e17\\u0e32\\u0e07\\\/\\u0e16\\u0e19\\u0e19\\u0e44\\u0e21\\u0e48\\u0e2a\\u0e30\\u0e14\\u0e27\\u0e01&quot;,&quot;\\u0e44\\u0e1f\\u0e1f\\u0e49\\u0e32\\u0e14\\u0e31\\u0e1a \\u0e44\\u0e1f\\u0e15\\u0e01 \\u0e2a\\u0e32\\u0e22\\u0e40\\u0e04\\u0e40\\u0e1a\\u0e34\\u0e25\\u0e23\\u0e01\\u0e23\\u0e38\\u0e07\\u0e23\\u0e31\\u0e07&quot;,&quot;\\u0e02\\u0e32\\u0e14\\u0e19\\u0e49\\u0e33\\u0e01\\u0e32\\u0e23\\u0e40\\u0e01\\u0e29\\u0e15\\u0e23&quot;,&quot;\\u0e19\\u0e49\\u0e33\\u0e17\\u0e48\\u0e27\\u0e21\\\/\\u0e20\\u0e31\\u0e22\\u0e18\\u0e23\\u0e23\\u0e21\\u0e0a\\u0e32\\u0e15\\u0e34&quot;,&quot;\\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e2d\\u0e32\\u0e0a\\u0e35\\u0e1e \\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e07\\u0e32\\u0e19\\u0e17\\u0e33&quot;,&quot;\\u0e2a\\u0e34\\u0e19\\u0e04\\u0e49\\u0e32\\u0e41\\u0e1e\\u0e07&quot;]}\"\n        data-q3=\"{&quot;title&quot;:&quot;\\u0e2d\\u0e22\\u0e32\\u0e01\\u0e43\\u0e2b\\u0e49\\u0e1e\\u0e30\\u0e40\\u0e22\\u0e32\\u0e1e\\u0e31\\u0e12\\u0e19\\u0e32\\u0e40\\u0e23\\u0e37\\u0e48\\u0e2d\\u0e07\\u0e44\\u0e2b\\u0e19\\u0e01\\u0e48\\u0e2d\\u0e19?&quot;,&quot;options&quot;:[&quot;\\u0e01\\u0e32\\u0e23\\u0e40\\u0e14\\u0e34\\u0e19\\u0e17\\u0e32\\u0e07\\\/\\u0e16\\u0e19\\u0e19\\u0e44\\u0e21\\u0e48\\u0e2a\\u0e30\\u0e14\\u0e27\\u0e01&quot;,&quot;\\u0e44\\u0e1f\\u0e1f\\u0e49\\u0e32\\u0e14\\u0e31\\u0e1a \\u0e44\\u0e1f\\u0e15\\u0e01 \\u0e2a\\u0e32\\u0e22\\u0e40\\u0e04\\u0e40\\u0e1a\\u0e34\\u0e25\\u0e23\\u0e01\\u0e23\\u0e38\\u0e07\\u0e23\\u0e31\\u0e07&quot;,&quot;\\u0e02\\u0e32\\u0e14\\u0e19\\u0e49\\u0e33\\u0e01\\u0e32\\u0e23\\u0e40\\u0e01\\u0e29\\u0e15\\u0e23&quot;,&quot;\\u0e19\\u0e49\\u0e33\\u0e17\\u0e48\\u0e27\\u0e21\\\/\\u0e20\\u0e31\\u0e22\\u0e18\\u0e23\\u0e23\\u0e21\\u0e0a\\u0e32\\u0e15\\u0e34&quot;,&quot;\\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e2d\\u0e32\\u0e0a\\u0e35\\u0e1e \\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e07\\u0e32\\u0e19\\u0e17\\u0e33&quot;,&quot;\\u0e2a\\u0e34\\u0e19\\u0e04\\u0e49\\u0e32\\u0e41\\u0e1e\\u0e07&quot;]}\"\n        data-event-name=\"\">\n      <div class=\"pes-top-tag\" id=\"pesEventTag\">\n  <svg width=\"13\" height=\"13\" viewBox=\"0 0 13 13\" fill=\"none\"><circle cx=\"6.5\" cy=\"6.5\" r=\"5.5\" stroke=\"#fff\" stroke-width=\"1.4\"\/><\/svg>\n  <span id=\"pesEventLabel\">\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e17\u0e35\u0e27\u0e35 \u0e0a\u0e27\u0e19\u0e40\u0e25\u0e48\u0e19<\/span>\n<\/div>\n<h2 class=\"pes-h1\">\u0e1e\u0e30\u0e40\u0e22\u0e32<span class=\"pes-hl\">\u0e02\u0e2d\u0e07\u0e09\u0e31\u0e19\u0e27\u0e31\u0e19\u0e19\u0e35\u0e49<\/span> \ud83d\ude4b<\/h2>\n<p class=\"pes-lead\">\u0e01\u0e14\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e02\u0e2d\u0e07\u0e40\u0e23\u0e32 \u0e41\u0e25\u0e49\u0e27\u0e15\u0e2d\u0e1a\u0e2d\u0e35\u0e01 2 \u0e02\u0e49\u0e2d\u0e2a\u0e31\u0e49\u0e19\u0e46 \u0e14\u0e39\u0e1c\u0e25\u0e23\u0e27\u0e21\u0e02\u0e2d\u0e07\u0e17\u0e38\u0e01\u0e04\u0e19\u0e1a\u0e19\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e44\u0e14\u0e49\u0e17\u0e31\u0e19\u0e17\u0e35!<\/p>\n\n<div class=\"pes-card\">\n\n  <div id=\"pesScreenIntro\">\n    <div class=\"pes-mascot-row\" id=\"pesIntroMascots\"><\/div>\n    <button class=\"pes-start-btn\" id=\"pesStartBtn\">\u0e40\u0e23\u0e34\u0e48\u0e21\u0e40\u0e25\u0e48\u0e19\u0e01\u0e31\u0e19\u0e40\u0e25\u0e22!<\/button>\n    <p class=\"pes-note\">\u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e1a\u0e2d\u0e01\u0e0a\u0e37\u0e48\u0e2d \u0e44\u0e21\u0e48\u0e15\u0e49\u0e2d\u0e07\u0e01\u0e23\u0e2d\u0e01\u0e2d\u0e30\u0e44\u0e23\u0e17\u0e31\u0e49\u0e07\u0e19\u0e31\u0e49\u0e19 \u0e01\u0e14\u0e15\u0e2d\u0e1a\u0e44\u0e14\u0e49\u0e40\u0e25\u0e22<\/p>\n  <\/div>\n\n  <div id=\"pesScreenMap\" style=\"display:none;\">\n    <div class=\"pes-dots\"><div class=\"pes-dot pes-active\"><\/div><div class=\"pes-dot\"><\/div><div class=\"pes-dot\"><\/div><\/div>\n    <p class=\"pes-q-title\">\u0e40\u0e18\u0e2d\u0e21\u0e32\u0e08\u0e32\u0e01\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e44\u0e2b\u0e19\u0e02\u0e2d\u0e07\u0e1e\u0e30\u0e40\u0e22\u0e32?<\/p>\n    <div class=\"pes-map-wrap\">\n      <svg id=\"pesMapSvg\" viewBox=\"0 0 380 330\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><\/svg>\n    <\/div>\n    <p class=\"pes-map-selected\" id=\"pesMapSelectedLabel\">\u0e41\u0e15\u0e30\u0e08\u0e38\u0e14\u0e1a\u0e19\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e02\u0e2d\u0e07\u0e40\u0e18\u0e2d<\/p>\n    <button class=\"pes-primary-btn\" id=\"pesMapNextBtn\" disabled>\u0e16\u0e31\u0e14\u0e44\u0e1b<\/button>\n  <\/div>\n\n  <div id=\"pesScreenQuiz\" style=\"display:none;\">\n    <div class=\"pes-dots\" id=\"pesDots\"><\/div>\n    <p class=\"pes-q-title\" id=\"pesQTitleText\"><\/p>\n    <div class=\"pes-opt-grid\" id=\"pesOptGrid\"><\/div>\n    <button class=\"pes-primary-btn\" id=\"pesNextQBtn\" disabled>\u0e16\u0e31\u0e14\u0e44\u0e1b<\/button>\n  <\/div>\n\n  <div id=\"pesScreenSubmitting\" style=\"display:none;\">\n    <p class=\"pes-loading-note\">\u0e01\u0e33\u0e25\u0e31\u0e07\u0e1a\u0e31\u0e19\u0e17\u0e36\u0e01\u0e04\u0e33\u0e15\u0e2d\u0e1a...<\/p>\n  <\/div>\n\n  <div id=\"pesScreenResults\" style=\"display:none;\">\n    <div class=\"pes-thanks-badge\" id=\"pesThanksMascot\"><\/div>\n    <p class=\"pes-thanks-title\">\u0e40\u0e22\u0e49! \u0e02\u0e2d\u0e1a\u0e04\u0e38\u0e13\u0e17\u0e35\u0e48\u0e21\u0e32\u0e40\u0e25\u0e48\u0e19\u0e14\u0e49\u0e27\u0e22\u0e01\u0e31\u0e19 \ud83c\udf89<\/p>\n    <div class=\"pes-respondent-count\"><span class=\"pes-pulse\"><\/span>\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e19\u0e46 \u0e15\u0e2d\u0e1a\u0e41\u0e25\u0e49\u0e27 <span class=\"pes-n\" id=\"pesRespCount\">0<\/span> \u0e04\u0e19<\/div>\n\n    <p class=\"pes-q-title\">\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e19\u0e46 \u0e21\u0e32\u0e08\u0e32\u0e01\u0e44\u0e2b\u0e19\u0e1a\u0e49\u0e32\u0e07<\/p>\n    <div class=\"pes-map-wrap\">\n      <svg id=\"pesResultMapSvg\" viewBox=\"0 0 380 330\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><\/svg>\n    <\/div>\n\n    <div class=\"pes-view-toggle\" id=\"pesViewToggle\">\n      <button class=\"pes-view-btn pes-view-active\" data-view=\"bar\">\u0e41\u0e1c\u0e19\u0e20\u0e39\u0e21\u0e34\u0e41\u0e17\u0e48\u0e07<\/button>\n      <button class=\"pes-view-btn\" data-view=\"pie\">\u0e41\u0e1c\u0e19\u0e20\u0e39\u0e21\u0e34\u0e27\u0e07\u0e01\u0e25\u0e21<\/button>\n    <\/div>\n    <div id=\"pesResultBlocks\"><\/div>\n\n    <button class=\"pes-kiosk-btn\" id=\"pesKioskBtn\">\u0e2a\u0e48\u0e07\u0e15\u0e48\u0e2d\u0e43\u0e2b\u0e49\u0e04\u0e19\u0e16\u0e31\u0e14\u0e44\u0e1b\u0e40\u0e25\u0e48\u0e19 \ud83d\udc49<\/button>\n\n    <div class=\"pes-results-actions\">\n      <button class=\"pes-btn-refresh\" id=\"pesRefreshBtn\">\u0e23\u0e35\u0e40\u0e1f\u0e23\u0e0a\u0e1c\u0e25<\/button>\n      <button class=\"pes-btn-fb\" id=\"pesFbShareBtn\">\u0e41\u0e0a\u0e23\u0e4c Facebook<\/button>\n      <button class=\"pes-btn-share\" id=\"pesShareBtn\">\u0e41\u0e0a\u0e23\u0e4c\u0e41\u0e1a\u0e1a\u0e2a\u0e33\u0e23\u0e27\u0e08<\/button>\n    <\/div>\n    <div class=\"pes-share-note\" id=\"pesShareNote\">\u0e04\u0e31\u0e14\u0e25\u0e2d\u0e01\u0e25\u0e34\u0e07\u0e01\u0e4c\u0e41\u0e25\u0e30\u0e02\u0e49\u0e2d\u0e04\u0e27\u0e32\u0e21\u0e41\u0e25\u0e49\u0e27 \u0e27\u0e32\u0e07\u0e41\u0e0a\u0e23\u0e4c\u0e44\u0e14\u0e49\u0e40\u0e25\u0e22<\/div>\n  <\/div>\n\n<\/div>\n\n<div class=\"pes-footer-mark\">\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e17\u0e35\u0e27\u0e35 \u00b7 \u0e40\u0e2a\u0e35\u0e22\u0e07\u0e02\u0e2d\u0e07\u0e40\u0e14\u0e47\u0e01\u0e1e\u0e30\u0e40\u0e22\u0e32<\/div>    <\/div>\n    <style>#pes-app{\n  --pes-bg:#FFF6EA; --pes-card:#FFFFFF;\n  --pes-orange:#FF7A45; --pes-orange-deep:#E85D2B; --pes-amber:#FFB347;\n  --pes-blue:#3DA9FC; --pes-blue-deep:#1C7ED6; --pes-sky:#8FE3FF;\n  --pes-teal:#2FB6A6; --pes-pink:#FF6FA5;\n  --pes-ink:#2B2620; --pes-ink-dim:#8A7F70; --pes-line:#F0E2CF;\n  max-width:480px; margin:0 auto; padding:20px 16px 8px;\n  background:var(--pes-bg);\n  background-image:\n    radial-gradient(circle at 8% 6%, rgba(61,169,252,0.20), transparent 40%),\n    radial-gradient(circle at 92% 14%, rgba(255,122,69,0.20), transparent 42%),\n    radial-gradient(circle at 50% 100%, rgba(255,111,165,0.14), transparent 40%);\n  color:var(--pes-ink); font-family:'Sarabun',sans-serif; border-radius:26px;\n}\n#pes-app *{box-sizing:border-box;}\n#pes-app .pes-top-tag{display:inline-flex;align-items:center;gap:6px;background:var(--pes-blue);color:#fff;font-family:'Kanit',sans-serif;font-weight:600;font-size:12.5px;padding:5px 12px;border-radius:999px;margin-bottom:14px;}\n#pes-app .pes-h1{font-family:'Kanit',sans-serif;font-weight:800;font-size:26px;line-height:1.3;margin:0 0 8px;}\n#pes-app .pes-hl{color:var(--pes-pink);}\n#pes-app .pes-lead{font-size:15px;color:var(--pes-ink-dim);line-height:1.7;margin:0 0 18px;}\n#pes-app .pes-mascot-row{display:flex;justify-content:center;gap:6px;margin-bottom:6px;}\n#pes-app .pes-mascot-row svg{width:60px;height:58px;}\n#pes-app .pes-card{background:var(--pes-card);border-radius:22px;padding:22px 18px 20px;box-shadow:0 10px 26px rgba(43,38,32,0.08);border:1px solid var(--pes-line);}\n#pes-app .pes-start-btn,#pes-app .pes-primary-btn{width:100%;padding:17px;border:none;border-radius:16px;background:var(--pes-orange);color:#fff;font-family:'Kanit',sans-serif;font-weight:700;font-size:17px;cursor:pointer;margin-top:6px;}\n#pes-app .pes-start-btn:active,#pes-app .pes-primary-btn:active{background:var(--pes-orange-deep);}\n#pes-app .pes-primary-btn[disabled]{background:#EAD9C4;color:#B8AB98;cursor:not-allowed;}\n#pes-app .pes-note{font-size:12.5px;color:var(--pes-ink-dim);text-align:center;margin-top:10px;line-height:1.6;}\n#pes-app .pes-dots{display:flex;gap:6px;justify-content:center;margin-bottom:16px;}\n#pes-app .pes-dot{width:9px;height:9px;border-radius:50%;background:var(--pes-line);}\n#pes-app .pes-dot.pes-active{background:var(--pes-orange);width:24px;border-radius:5px;}\n#pes-app .pes-q-title{font-family:'Kanit',sans-serif;font-weight:700;font-size:19px;line-height:1.45;margin:0 0 14px;text-align:center;}\n#pes-app .pes-opt-grid{display:grid;grid-template-columns:1fr 1fr;gap:10px;}\n#pes-app .pes-opt-card{background:#FFFCF6;border:2.5px solid var(--pes-line);border-radius:18px;padding:16px 10px;text-align:center;cursor:pointer;transition:border-color .15s ease, transform .1s ease, background .15s ease;min-height:64px;display:flex;align-items:center;justify-content:center;}\n#pes-app .pes-opt-card:active{transform:scale(0.96);}\n#pes-app .pes-opt-card .pes-opt-text{font-size:14px;font-weight:700;line-height:1.4;color:var(--pes-ink);}\n#pes-app .pes-opt-card.pes-selected{border-color:var(--pes-orange);background:#FFF1E6;}\n#pes-app .pes-footer-mark{text-align:center;margin:18px 0 4px;font-size:12px;color:var(--pes-ink-dim);opacity:0.85;}\n\n#pes-app .pes-map-wrap{background:#EAF6FF;border-radius:20px;padding:10px;margin-bottom:10px;}\n#pes-app .pes-map-wrap svg{width:100%;height:auto;display:block;}\n#pes-app .pes-map-node{cursor:pointer;}\n#pes-app .pes-map-node circle.pes-node-fill{transition:transform .15s ease, fill .3s ease;}\n#pes-app .pes-map-node:hover circle.pes-node-fill{transform:scale(1.05);}\n#pes-app .pes-map-node.pes-node-selected circle.pes-node-fill{stroke:#2B2620;stroke-width:3;}\n#pes-app .pes-map-node text{font-family:'Kanit',sans-serif;font-weight:600;fill:#2B2620;pointer-events:none;}\n#pes-app .pes-map-selected{text-align:center;font-family:'Kanit',sans-serif;font-weight:600;font-size:14px;color:var(--pes-blue-deep);margin:0 0 14px;min-height:20px;}\n\n#pes-app .pes-thanks-badge{text-align:center;margin-bottom:4px;}\n#pes-app .pes-thanks-badge svg{width:92px;height:88px;}\n#pes-app .pes-thanks-title{font-family:'Kanit',sans-serif;font-weight:700;font-size:21px;text-align:center;margin:6px 0 12px;}\n#pes-app .pes-respondent-count{display:flex;align-items:center;justify-content:center;gap:8px;font-family:'Kanit',sans-serif;font-size:13px;color:var(--pes-blue-deep);margin-bottom:18px;}\n#pes-app .pes-respondent-count .pes-n{font-weight:700;font-size:16px;}\n#pes-app .pes-pulse{width:8px;height:8px;border-radius:50%;background:var(--pes-blue);animation:pesPulse 1.6s ease-in-out infinite;}\n@keyframes pesPulse{0%,100%{opacity:1;transform:scale(1);}50%{opacity:0.4;transform:scale(0.7);}}\n\n#pes-app .pes-view-toggle{display:flex;gap:8px;margin-bottom:18px;}\n#pes-app .pes-view-btn{flex:1;padding:9px;border-radius:10px;border:1.5px solid var(--pes-line);background:#FFFCF6;color:var(--pes-ink-dim);font-family:'Kanit',sans-serif;font-weight:600;font-size:12.5px;cursor:pointer;}\n#pes-app .pes-view-btn.pes-view-active{background:var(--pes-orange);border-color:var(--pes-orange);color:#fff;}\n\n#pes-app .pes-result-block{margin-bottom:22px;}\n#pes-app .pes-result-block:last-child{margin-bottom:0;}\n#pes-app .pes-result-block .pes-q-title{font-size:15.5px;margin-bottom:12px;}\n#pes-app .pes-bar-row{margin-bottom:10px;}\n#pes-app .pes-bar-top{display:flex;justify-content:space-between;font-size:12.5px;margin-bottom:4px;}\n#pes-app .pes-bar-top .pes-lbl{font-weight:600;color:var(--pes-ink);}\n#pes-app .pes-bar-top .pes-pct{font-family:'Kanit',sans-serif;font-weight:700;color:var(--pes-ink-dim);}\n#pes-app .pes-bar-track{height:11px;background:var(--pes-line);border-radius:6px;overflow:hidden;}\n#pes-app .pes-bar-fill{height:100%;border-radius:6px;width:0%;transition:width .5s ease;}\n#pes-app .pes-pie-wrap{display:flex;align-items:center;gap:16px;margin-bottom:8px;}\n#pes-app .pes-pie-wrap svg{width:104px;height:104px;flex-shrink:0;}\n#pes-app .pes-pie-legend{flex:1;min-width:0;}\n#pes-app .pes-pie-legend-row{display:flex;align-items:center;gap:8px;margin-bottom:7px;font-size:12.5px;}\n#pes-app .pes-pie-legend-row .pes-swatch{width:10px;height:10px;border-radius:3px;flex-shrink:0;}\n#pes-app .pes-pie-legend-row .pes-lbl2{flex:1;color:var(--pes-ink);font-weight:600;}\n#pes-app .pes-pie-legend-row .pes-pct2{font-family:'Kanit',sans-serif;font-weight:700;color:var(--pes-ink-dim);}\n\n#pes-app .pes-kiosk-btn{width:100%;padding:16px;border:none;border-radius:16px;background:var(--pes-teal);color:#fff;font-family:'Kanit',sans-serif;font-weight:700;font-size:16px;cursor:pointer;margin-bottom:12px;}\n#pes-app .pes-kiosk-btn:active{opacity:0.85;}\n#pes-app .pes-results-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:6px;}\n#pes-app .pes-results-actions button{flex:1 1 auto;min-width:100px;padding:12px;border-radius:14px;font-family:'Kanit',sans-serif;font-weight:600;font-size:13px;cursor:pointer;}\n#pes-app .pes-btn-share{background:var(--pes-blue);color:#fff;border:none;}\n#pes-app .pes-btn-fb{background:#1877F2;color:#fff;border:none;}\n#pes-app .pes-btn-refresh{background:transparent;color:var(--pes-ink);border:1.5px solid var(--pes-line);}\n#pes-app .pes-share-note{margin-top:10px;font-size:12.5px;color:var(--pes-ink-dim);text-align:center;display:none;}\n#pes-app .pes-share-note.show{display:block;}\n#pes-app .pes-loading-note{text-align:center;font-size:13.5px;color:var(--pes-ink-dim);padding:20px 0;}\n\n@media (prefers-reduced-motion:reduce){#pes-app *{transition:none !important;animation:none !important;}}<\/style>\n    <script>(function(){\n  var root = document.getElementById('pes-app');\n  if (!root || root.getAttribute('data-pes-init') === '1') return;\n  root.setAttribute('data-pes-init', '1');\n\n  var AJAX_URL = root.getAttribute('data-ajax-url');\n  var NONCE = root.getAttribute('data-nonce');\n  var DISTRICTS = JSON.parse(root.getAttribute('data-districts'));\n  var Q2 = JSON.parse(root.getAttribute('data-q2'));\n  var Q3 = JSON.parse(root.getAttribute('data-q3'));\n  var EVENT_NAME = root.getAttribute('data-event-name');\n  var BAR_COLORS = ['#FF7A45', '#3DA9FC', '#FFB347', '#1C7ED6', '#2FB6A6', '#FF6FA5'];\n\n  if (EVENT_NAME) {\n    document.getElementById('pesEventLabel').textContent = EVENT_NAME;\n  }\n\n  \/* ---- SVG gradient\/face defs (shared mascot art, decorative only here) ---- *\/\n  if (!document.getElementById('pes-svg-defs')) {\n    var defsWrap = document.createElement('div');\n    defsWrap.innerHTML = '<svg id=\"pes-svg-defs\" width=\"0\" height=\"0\" style=\"position:absolute\" aria-hidden=\"true\"><defs>' +\n      '<linearGradient id=\"pesGPeacock\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\"><stop offset=\"0%\" stop-color=\"#4FD8C7\"\/><stop offset=\"100%\" stop-color=\"#1E8C7F\"\/><\/linearGradient>' +\n      '<linearGradient id=\"pesGDino\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\"><stop offset=\"0%\" stop-color=\"#8CE29E\"\/><stop offset=\"100%\" stop-color=\"#3EA35C\"\/><\/linearGradient>' +\n      '<linearGradient id=\"pesGShrimp\" x1=\"0%\" y1=\"0%\" x2=\"100%\" y2=\"100%\"><stop offset=\"0%\" stop-color=\"#FFA372\"\/><stop offset=\"100%\" stop-color=\"#EA5A4A\"\/><\/linearGradient>' +\n      '<radialGradient id=\"pesGHi\" cx=\"35%\" cy=\"30%\" r=\"65%\"><stop offset=\"0%\" stop-color=\"#FFFFFF\" stop-opacity=\"0.55\"\/><stop offset=\"100%\" stop-color=\"#FFFFFF\" stop-opacity=\"0\"\/><\/radialGradient>' +\n      '<\/defs><\/svg>';\n    document.body.insertBefore(defsWrap.firstChild, document.body.firstChild);\n  }\n\n  function faceHappy(cx, eyeY, gap, mouthY){\n    return '<circle cx=\"'+(cx-gap)+'\" cy=\"'+eyeY+'\" r=\"4.6\" fill=\"#20303F\"\/><circle cx=\"'+(cx+gap)+'\" cy=\"'+eyeY+'\" r=\"4.6\" fill=\"#20303F\"\/>' +\n      '<circle cx=\"'+(cx-gap+1.4)+'\" cy=\"'+(eyeY-1.4)+'\" r=\"1.2\" fill=\"#fff\"\/><circle cx=\"'+(cx+gap+1.4)+'\" cy=\"'+(eyeY-1.4)+'\" r=\"1.2\" fill=\"#fff\"\/>' +\n      '<path d=\"M '+(cx-8)+' '+mouthY+' Q '+cx+' '+(mouthY+8)+' '+(cx+8)+' '+mouthY+'\" stroke=\"#20303F\" stroke-width=\"2.2\" fill=\"none\" stroke-linecap=\"round\"\/>' +\n      '<circle cx=\"'+(cx-12)+'\" cy=\"'+(mouthY-2)+'\" r=\"3\" fill=\"#FF9E8A\" opacity=\"0.55\"\/><circle cx=\"'+(cx+12)+'\" cy=\"'+(mouthY-2)+'\" r=\"3\" fill=\"#FF9E8A\" opacity=\"0.55\"\/>';\n  }\n  function mascotPeacock(){\n    return '<svg viewBox=\"0 0 120 110\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">' +\n      '<ellipse cx=\"60\" cy=\"76\" rx=\"23\" ry=\"21\" fill=\"url(#pesGPeacock)\"\/><ellipse cx=\"60\" cy=\"76\" rx=\"23\" ry=\"21\" fill=\"url(#pesGHi)\"\/>' +\n      '<circle cx=\"60\" cy=\"45\" r=\"17\" fill=\"url(#pesGPeacock)\"\/><circle cx=\"60\" cy=\"45\" r=\"17\" fill=\"url(#pesGHi)\"\/>' +\n      '<ellipse cx=\"47\" cy=\"92\" rx=\"5\" ry=\"3\" fill=\"#1E8C7F\"\/><ellipse cx=\"73\" cy=\"92\" rx=\"5\" ry=\"3\" fill=\"#1E8C7F\"\/>' +\n      faceHappy(58, 45, 7, 51) + '<\/svg>';\n  }\n  function mascotDino(){\n    return '<svg viewBox=\"0 0 120 110\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">' +\n      '<ellipse cx=\"58\" cy=\"76\" rx=\"25\" ry=\"22\" fill=\"url(#pesGDino)\"\/><ellipse cx=\"58\" cy=\"76\" rx=\"25\" ry=\"22\" fill=\"url(#pesGHi)\"\/>' +\n      '<circle cx=\"60\" cy=\"43\" r=\"18\" fill=\"url(#pesGDino)\"\/><circle cx=\"60\" cy=\"43\" r=\"18\" fill=\"url(#pesGHi)\"\/>' +\n      '<ellipse cx=\"35\" cy=\"90\" rx=\"6\" ry=\"4.5\" fill=\"#3EA35C\"\/><ellipse cx=\"81\" cy=\"90\" rx=\"6\" ry=\"4.5\" fill=\"#3EA35C\"\/>' +\n      faceHappy(62, 41, 7.5, 49) + '<\/svg>';\n  }\n  function mascotShrimp(){\n    var shape = 'M30 76 C 25 58, 38 34, 62 27 C 84 21, 96 34, 94 45 C 91 36, 80 31, 68 34 C 75 40, 78 49, 74 56 C 82 55, 88 60, 87 67 C 80 65, 73 67, 68 72 C 73 75, 76 81, 72 88 C 65 82, 56 81, 49 83 C 40 85, 33 82, 30 76 Z';\n    return '<svg viewBox=\"0 0 120 110\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">' +\n      '<path d=\"'+shape+'\" fill=\"url(#pesGShrimp)\"\/><path d=\"'+shape+'\" fill=\"url(#pesGHi)\"\/>' +\n      '<path d=\"M63 31 Q 67 18, 76 14\" stroke=\"#EA5A4A\" stroke-width=\"2.2\" fill=\"none\" stroke-linecap=\"round\"\/>' +\n      '<path d=\"M69 33 Q 77 24, 88 22\" stroke=\"#EA5A4A\" stroke-width=\"2.2\" fill=\"none\" stroke-linecap=\"round\"\/>' +\n      faceHappy(66, 36, 6.5, 42) + '<\/svg>';\n  }\n\n  document.getElementById('pesIntroMascots').innerHTML = mascotPeacock() + mascotDino() + mascotShrimp();\n\n  var screenIntro = document.getElementById('pesScreenIntro');\n  var screenMap = document.getElementById('pesScreenMap');\n  var screenQuiz = document.getElementById('pesScreenQuiz');\n  var screenSubmitting = document.getElementById('pesScreenSubmitting');\n  var screenResults = document.getElementById('pesScreenResults');\n\n  var answers = { d: null, b: null, c: null };\n  var qOrder = ['b', 'c'];\n  var qIndex = 0;\n\n  var PROVINCE_BG = 'M 90,25 C 160,5 230,0 270,15 C 310,30 330,70 330,100 C 335,140 330,175 325,200 ' +\n    'C 320,240 300,275 260,300 C 220,325 170,325 140,315 C 100,305 60,290 40,255 ' +\n    'C 20,220 15,180 20,145 C 25,105 40,60 90,25 Z';\n\n  \/* ---- Build the selectable district map ---- *\/\n  function buildMap(svgId, interactive, onSelect){\n    var svg = document.getElementById(svgId);\n    var html = '<path d=\"'+PROVINCE_BG+'\" fill=\"#FDEBDD\" stroke=\"#F0D9BE\" stroke-width=\"2\"\/>';\n    DISTRICTS.forEach(function(d, idx){\n      var cls = 'pes-map-node';\n      html += '<g class=\"'+cls+'\" data-idx=\"'+idx+'\">' +\n        '<circle class=\"pes-node-fill\" cx=\"'+d.x+'\" cy=\"'+d.y+'\" r=\"'+d.r+'\" fill=\"'+d.color+'\" stroke=\"#fff\" stroke-width=\"3\"\/>' +\n        '<text x=\"'+d.x+'\" y=\"'+(d.y+4)+'\" font-size=\"11\" text-anchor=\"middle\">'+d.name+'<\/text>' +\n        '<\/g>';\n    });\n    svg.innerHTML = html;\n    if (interactive){\n      Array.prototype.forEach.call(svg.querySelectorAll('.pes-map-node'), function(node){\n        node.addEventListener('click', function(){\n          Array.prototype.forEach.call(svg.querySelectorAll('.pes-map-node'), function(n){ n.classList.remove('pes-node-selected'); });\n          node.classList.add('pes-node-selected');\n          onSelect(parseInt(node.getAttribute('data-idx'), 10));\n        });\n      });\n    }\n  }\n\n  buildMap('pesMapSvg', true, function(idx){\n    answers.d = idx;\n    document.getElementById('pesMapSelectedLabel').textContent = '\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e41\u0e25\u0e49\u0e27: \u0e2d\u0e33\u0e40\u0e20\u0e2d' + DISTRICTS[idx].name;\n    document.getElementById('pesMapNextBtn').disabled = false;\n  });\n\n  document.getElementById('pesStartBtn').addEventListener('click', function(){\n    screenIntro.style.display = 'none';\n    screenMap.style.display = 'block';\n  });\n\n  document.getElementById('pesMapNextBtn').addEventListener('click', function(){\n    if (answers.d === null) return;\n    screenMap.style.display = 'none';\n    screenQuiz.style.display = 'block';\n    qIndex = 0;\n    renderQuestion();\n  });\n\n  function currentQuestion(){ return qOrder[qIndex] === 'b' ? Q2 : Q3; }\n\n  function renderDots(){\n    var wrap = document.getElementById('pesDots');\n    var html = '<div class=\"pes-dot pes-active\"><\/div>';\n    for (var i = 0; i < qOrder.length; i++){\n      html += '<div class=\"pes-dot' + (i <= qIndex ? ' pes-active' : '') + '\"><\/div>';\n    }\n    wrap.innerHTML = html;\n  }\n\n  function renderQuestion(){\n    var qkey = qOrder[qIndex];\n    var q = currentQuestion();\n    renderDots();\n    document.getElementById('pesQTitleText').textContent = q.title;\n\n    var grid = document.getElementById('pesOptGrid');\n    grid.innerHTML = '';\n    q.options.forEach(function(text, idx){\n      var card = document.createElement('div');\n      card.className = 'pes-opt-card';\n      card.innerHTML = '<div class=\"pes-opt-text\">' + text + '<\/div>';\n      card.addEventListener('click', function(){\n        Array.prototype.forEach.call(grid.children, function(c){ c.classList.remove('pes-selected'); });\n        card.classList.add('pes-selected');\n        answers[qkey] = idx;\n        document.getElementById('pesNextQBtn').disabled = false;\n      });\n      grid.appendChild(card);\n    });\n\n    var nextBtn = document.getElementById('pesNextQBtn');\n    nextBtn.disabled = answers[qkey] === null || answers[qkey] === undefined;\n    nextBtn.textContent = (qIndex === qOrder.length - 1) ? '\u0e2a\u0e48\u0e07\u0e04\u0e33\u0e15\u0e2d\u0e1a' : '\u0e16\u0e31\u0e14\u0e44\u0e1b';\n  }\n\n  document.getElementById('pesNextQBtn').addEventListener('click', function(){\n    var qkey = qOrder[qIndex];\n    if (answers[qkey] === null || answers[qkey] === undefined) return;\n    if (qIndex < qOrder.length - 1){\n      qIndex++;\n      renderQuestion();\n    } else {\n      submitAndShowResults();\n    }\n  });\n\n  function postForm(action, extra){\n    var body = new URLSearchParams(Object.assign({ action: action, nonce: NONCE }, extra || {}));\n    return fetch(AJAX_URL, { method: 'POST', credentials: 'same-origin', body: body }).then(function(res){ return res.json(); });\n  }\n\n  function submitAndShowResults(){\n    screenQuiz.style.display = 'none';\n    screenSubmitting.style.display = 'block';\n    postForm('pes_submit', { d: answers.d, b: answers.b, c: answers.c })\n      .catch(function(err){ console.error('\u0e1a\u0e31\u0e19\u0e17\u0e36\u0e01\u0e04\u0e33\u0e15\u0e2d\u0e1a\u0e44\u0e21\u0e48\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08', err); })\n      .then(function(){\n        screenSubmitting.style.display = 'none';\n        screenResults.style.display = 'block';\n        document.getElementById('pesThanksMascot').innerHTML = mascotShrimp();\n        buildMap('pesResultMapSvg', false, null);\n        loadAndRenderResults();\n        startAutoRefresh();\n      });\n  }\n\n  var currentView = 'bar';\n  var lastResultData = null;\n\n  function renderBarBlock(title, options, arr, total){\n    var maxCount = Math.max.apply(null, arr.concat([1]));\n    var rows = options.map(function(text, idx){\n      var pct = total > 0 ? Math.round((arr[idx] \/ total) * 100) : 0;\n      var share = maxCount > 0 ? (arr[idx] \/ maxCount) : 0;\n      var trackH = Math.round(9 + 6 * share);\n      var pctSize = Math.round(12.5 + 5 * share);\n      return '<div class=\"pes-bar-row\"><div class=\"pes-bar-top\"><span class=\"pes-lbl\">'+text+'<\/span><span class=\"pes-pct\" style=\"font-size:'+pctSize+'px\">'+pct+'%<\/span><\/div>' +\n        '<div class=\"pes-bar-track\" style=\"height:'+trackH+'px\"><div class=\"pes-bar-fill\" style=\"width:'+pct+'%;background:'+BAR_COLORS[idx % BAR_COLORS.length]+'\"><\/div><\/div><\/div>';\n    }).join('');\n    return '<p class=\"pes-q-title\">' + title + '<\/p>' + rows;\n  }\n\n  function pieSegmentsSVG(arr, total){\n    var r = 46, cx = 52, cy = 52, C = 2 * Math.PI * r, offsetAcc = 0, circles = '';\n    if (total <= 0){\n      circles = '<circle cx=\"'+cx+'\" cy=\"'+cy+'\" r=\"'+r+'\" fill=\"none\" stroke=\"#F0E2CF\" stroke-width=\"16\"\/>';\n    } else {\n      arr.forEach(function(v, idx){\n        var frac = v \/ total;\n        if (frac <= 0) return;\n        var dash = frac * C, gap = C - dash;\n        var rotate = (offsetAcc \/ C) * 360 - 90;\n        circles += '<circle cx=\"'+cx+'\" cy=\"'+cy+'\" r=\"'+r+'\" fill=\"none\" stroke=\"'+BAR_COLORS[idx % BAR_COLORS.length]+'\" stroke-width=\"16\" stroke-dasharray=\"'+dash+' '+gap+'\" transform=\"rotate('+rotate+' '+cx+' '+cy+')\"\/>';\n        offsetAcc += dash;\n      });\n    }\n    return '<svg viewBox=\"0 0 104 104\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\">' + circles + '<circle cx=\"'+cx+'\" cy=\"'+cy+'\" r=\"'+(r-11)+'\" fill=\"#FFFFFF\"\/><\/svg>';\n  }\n\n  function renderPieBlock(title, options, arr, total){\n    var pie = pieSegmentsSVG(arr, total);\n    var legend = options.map(function(text, idx){\n      var pct = total > 0 ? Math.round((arr[idx] \/ total) * 100) : 0;\n      return '<div class=\"pes-pie-legend-row\"><span class=\"pes-swatch\" style=\"background:'+BAR_COLORS[idx % BAR_COLORS.length]+'\"><\/span>' +\n        '<span class=\"pes-lbl2\">'+text+'<\/span><span class=\"pes-pct2\">'+pct+'%<\/span><\/div>';\n    }).join('');\n    return '<p class=\"pes-q-title\">' + title + '<\/p><div class=\"pes-pie-wrap\">' + pie + '<div class=\"pes-pie-legend\">' + legend + '<\/div><\/div>';\n  }\n\n  function paintResultMap(districtCounts, total){\n    var svg = document.getElementById('pesResultMapSvg');\n    if (!svg) return;\n    var maxCount = Math.max.apply(null, districtCounts.concat([1]));\n    Array.prototype.forEach.call(svg.querySelectorAll('.pes-map-node'), function(node){\n      var idx = parseInt(node.getAttribute('data-idx'), 10);\n      var d = DISTRICTS[idx];\n      var cnt = districtCounts[idx] || 0;\n      var pct = total > 0 ? Math.round((cnt \/ total) * 100) : 0;\n      var share = maxCount > 0 ? (cnt \/ maxCount) : 0;\n      var displayR = d.r * (0.6 + 0.7 * share);\n      var fillEl = node.querySelector('.pes-node-fill');\n      fillEl.setAttribute('r', displayR);\n      fillEl.setAttribute('fill', d.color);\n      fillEl.setAttribute('opacity', cnt > 0 ? 1 : 0.4);\n      var textEl = node.querySelector('text');\n      textEl.innerHTML = '';\n      var nameSize = 10 + Math.round(3 * share);\n      var countSize = 9 + Math.round(4 * share);\n      var t1 = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'tspan');\n      t1.setAttribute('x', d.x);\n      t1.setAttribute('dy', '-2');\n      t1.setAttribute('font-size', nameSize);\n      t1.textContent = d.name;\n      var t2 = document.createElementNS('http:\/\/www.w3.org\/2000\/svg', 'tspan');\n      t2.setAttribute('x', d.x);\n      t2.setAttribute('dy', (nameSize + 3));\n      t2.setAttribute('font-size', countSize);\n      t2.setAttribute('font-weight', share >= 0.99 && cnt > 0 ? '700' : '400');\n      t2.textContent = cnt + ' \u0e04\u0e19 (' + pct + '%)';\n      textEl.appendChild(t1);\n      textEl.appendChild(t2);\n    });\n  }\n\n  function renderResultBlocks(){\n    if (!lastResultData) return;\n    var total = lastResultData.total || 0;\n    var wrap = document.getElementById('pesResultBlocks');\n    wrap.innerHTML = '';\n\n    var blockB = document.createElement('div');\n    blockB.className = 'pes-result-block';\n    blockB.innerHTML = (currentView === 'pie')\n      ? renderPieBlock(Q2.title, Q2.options, lastResultData.b, total)\n      : renderBarBlock(Q2.title, Q2.options, lastResultData.b, total);\n    wrap.appendChild(blockB);\n\n    var blockC = document.createElement('div');\n    blockC.className = 'pes-result-block';\n    blockC.innerHTML = (currentView === 'pie')\n      ? renderPieBlock(Q3.title, Q3.options, lastResultData.c, total)\n      : renderBarBlock(Q3.title, Q3.options, lastResultData.c, total);\n    wrap.appendChild(blockC);\n  }\n\n  document.getElementById('pesViewToggle').addEventListener('click', function(e){\n    var btn = e.target.closest('.pes-view-btn');\n    if (!btn) return;\n    currentView = btn.getAttribute('data-view');\n    Array.prototype.forEach.call(document.querySelectorAll('.pes-view-btn'), function(b){ b.classList.toggle('pes-view-active', b === btn); });\n    renderResultBlocks();\n  });\n\n  function loadAndRenderResults(){\n    return postForm('pes_results', {}).then(function(res){\n      if (!res || !res.success) return;\n      lastResultData = res.data;\n      document.getElementById('pesRespCount').textContent = res.data.total || 0;\n      paintResultMap(res.data.district || [], res.data.total || 0);\n      renderResultBlocks();\n    }).catch(function(err){ console.error('\u0e42\u0e2b\u0e25\u0e14\u0e1c\u0e25\u0e23\u0e27\u0e21\u0e44\u0e21\u0e48\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08', err); });\n  }\n\n  var refreshTimer = null;\n  function startAutoRefresh(){\n    if (refreshTimer) clearInterval(refreshTimer);\n    refreshTimer = setInterval(loadAndRenderResults, 7000);\n  }\n\n  document.getElementById('pesRefreshBtn').addEventListener('click', loadAndRenderResults);\n\n  document.getElementById('pesKioskBtn').addEventListener('click', function(){\n    if (refreshTimer) clearInterval(refreshTimer);\n    answers = { d: null, b: null, c: null };\n    qIndex = 0;\n    document.getElementById('pesMapSelectedLabel').textContent = '\u0e41\u0e15\u0e30\u0e08\u0e38\u0e14\u0e1a\u0e19\u0e41\u0e1c\u0e19\u0e17\u0e35\u0e48\u0e40\u0e1e\u0e37\u0e48\u0e2d\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e02\u0e2d\u0e07\u0e40\u0e18\u0e2d';\n    document.getElementById('pesMapNextBtn').disabled = true;\n    buildMap('pesMapSvg', true, function(idx){\n      answers.d = idx;\n      document.getElementById('pesMapSelectedLabel').textContent = '\u0e40\u0e25\u0e37\u0e2d\u0e01\u0e41\u0e25\u0e49\u0e27: \u0e2d\u0e33\u0e40\u0e20\u0e2d' + DISTRICTS[idx].name;\n      document.getElementById('pesMapNextBtn').disabled = false;\n    });\n    screenResults.style.display = 'none';\n    screenIntro.style.display = 'block';\n    window.scrollTo({ top: root.offsetTop - 20, behavior: 'smooth' });\n  });\n\n  document.getElementById('pesFbShareBtn').addEventListener('click', function(){\n    var shareUrl = 'https:\/\/www.facebook.com\/sharer\/sharer.php?u=' + encodeURIComponent(location.href);\n    var w = Math.min(900, window.screen.availWidth - 40);\n    var h = Math.min(700, window.screen.availHeight - 40);\n    var win = window.open(shareUrl, 'pesFbShare', 'width=' + w + ',height=' + h + ',resizable=yes,scrollbars=yes');\n    if (!win) { window.open(shareUrl, '_blank'); }\n  });\n\n  document.getElementById('pesShareBtn').addEventListener('click', function(){\n    var msg = '\u0e23\u0e48\u0e27\u0e21\u0e1a\u0e2d\u0e01\u0e27\u0e48\u0e32\u0e40\u0e18\u0e2d\u0e21\u0e32\u0e08\u0e32\u0e01\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e44\u0e2b\u0e19 \u0e41\u0e25\u0e30\u0e2d\u0e22\u0e32\u0e01\u0e43\u0e2b\u0e49\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e40\u0e1b\u0e47\u0e19\u0e41\u0e1a\u0e1a\u0e44\u0e2b\u0e19 \u0e1c\u0e48\u0e32\u0e19\u0e41\u0e1a\u0e1a\u0e2a\u0e33\u0e23\u0e27\u0e08\u0e2a\u0e19\u0e38\u0e01\u0e46 \u0e08\u0e32\u0e01\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e17\u0e35\u0e27\u0e35!';\n    var note = document.getElementById('pesShareNote');\n    if (navigator.share){\n      navigator.share({ title: '\u0e1e\u0e30\u0e40\u0e22\u0e32 \u0e09\u0e31\u0e19\u0e21\u0e32\u0e08\u0e32\u0e01\u0e44\u0e2b\u0e19', text: msg, url: location.href }).catch(function(){});\n    } else if (navigator.clipboard){\n      navigator.clipboard.writeText(msg + ' ' + location.href).then(function(){\n        note.classList.add('show');\n        setTimeout(function(){ note.classList.remove('show'); }, 3000);\n      });\n    }\n  });\n})();<\/script>\n    \n    <div id=\"pes-tv\" class=\"pes-tv\"\n        data-ajax-url=\"https:\/\/phayaotv.com\/wp-admin\/admin-ajax.php\"\n        data-nonce=\"42ab75ac95\"\n        data-districts=\"[{&quot;name&quot;:&quot;\\u0e40\\u0e21\\u0e37\\u0e2d\\u0e07\\u0e1e\\u0e30\\u0e40\\u0e22\\u0e32&quot;,&quot;x&quot;:76,&quot;y&quot;:215,&quot;r&quot;:36,&quot;color&quot;:&quot;#FFC145&quot;},{&quot;name&quot;:&quot;\\u0e41\\u0e21\\u0e48\\u0e43\\u0e08&quot;,&quot;x&quot;:61,&quot;y&quot;:132,&quot;r&quot;:30,&quot;color&quot;:&quot;#FFD666&quot;},{&quot;name&quot;:&quot;\\u0e20\\u0e39\\u0e01\\u0e32\\u0e21\\u0e22\\u0e32\\u0e27&quot;,&quot;x&quot;:114,&quot;y&quot;:152,&quot;r&quot;:22,&quot;color&quot;:&quot;#FFB347&quot;},{&quot;name&quot;:&quot;\\u0e14\\u0e2d\\u0e01\\u0e04\\u0e33\\u0e43\\u0e15\\u0e49&quot;,&quot;x&quot;:144,&quot;y&quot;:231,&quot;r&quot;:32,&quot;color&quot;:&quot;#FF8B3D&quot;},{&quot;name&quot;:&quot;\\u0e08\\u0e38\\u0e19&quot;,&quot;x&quot;:171,&quot;y&quot;:139,&quot;r&quot;:30,&quot;color&quot;:&quot;#FF9F45&quot;},{&quot;name&quot;:&quot;\\u0e1b\\u0e07&quot;,&quot;x&quot;:274,&quot;y&quot;:182,&quot;r&quot;:42,&quot;color&quot;:&quot;#FF7A45&quot;},{&quot;name&quot;:&quot;\\u0e40\\u0e0a\\u0e35\\u0e22\\u0e07\\u0e04\\u0e33&quot;,&quot;x&quot;:274,&quot;y&quot;:92,&quot;r&quot;:40,&quot;color&quot;:&quot;#F2653A&quot;},{&quot;name&quot;:&quot;\\u0e40\\u0e0a\\u0e35\\u0e22\\u0e07\\u0e21\\u0e48\\u0e27\\u0e19&quot;,&quot;x&quot;:236,&quot;y&quot;:281,&quot;r&quot;:36,&quot;color&quot;:&quot;#E85D2B&quot;},{&quot;name&quot;:&quot;\\u0e20\\u0e39\\u0e0b\\u0e32\\u0e07&quot;,&quot;x&quot;:258,&quot;y&quot;:33,&quot;r&quot;:26,&quot;color&quot;:&quot;#D6331F&quot;}]\"\n        data-q2=\"{&quot;title&quot;:&quot;\\u0e40\\u0e08\\u0e2d\\u0e1b\\u0e31\\u0e0d\\u0e2b\\u0e32\\u0e2d\\u0e30\\u0e44\\u0e23\\u0e21\\u0e32\\u0e01\\u0e17\\u0e35\\u0e48\\u0e2a\\u0e38\\u0e14\\u0e43\\u0e19\\u0e0a\\u0e35\\u0e27\\u0e34\\u0e15\\u0e1b\\u0e23\\u0e30\\u0e08\\u0e33\\u0e27\\u0e31\\u0e19?&quot;,&quot;options&quot;:[&quot;\\u0e01\\u0e32\\u0e23\\u0e40\\u0e14\\u0e34\\u0e19\\u0e17\\u0e32\\u0e07\\\/\\u0e16\\u0e19\\u0e19\\u0e44\\u0e21\\u0e48\\u0e2a\\u0e30\\u0e14\\u0e27\\u0e01&quot;,&quot;\\u0e44\\u0e1f\\u0e1f\\u0e49\\u0e32\\u0e14\\u0e31\\u0e1a \\u0e44\\u0e1f\\u0e15\\u0e01 \\u0e2a\\u0e32\\u0e22\\u0e40\\u0e04\\u0e40\\u0e1a\\u0e34\\u0e25\\u0e23\\u0e01\\u0e23\\u0e38\\u0e07\\u0e23\\u0e31\\u0e07&quot;,&quot;\\u0e02\\u0e32\\u0e14\\u0e19\\u0e49\\u0e33\\u0e01\\u0e32\\u0e23\\u0e40\\u0e01\\u0e29\\u0e15\\u0e23&quot;,&quot;\\u0e19\\u0e49\\u0e33\\u0e17\\u0e48\\u0e27\\u0e21\\\/\\u0e20\\u0e31\\u0e22\\u0e18\\u0e23\\u0e23\\u0e21\\u0e0a\\u0e32\\u0e15\\u0e34&quot;,&quot;\\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e2d\\u0e32\\u0e0a\\u0e35\\u0e1e \\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e07\\u0e32\\u0e19\\u0e17\\u0e33&quot;,&quot;\\u0e2a\\u0e34\\u0e19\\u0e04\\u0e49\\u0e32\\u0e41\\u0e1e\\u0e07&quot;]}\"\n        data-q3=\"{&quot;title&quot;:&quot;\\u0e2d\\u0e22\\u0e32\\u0e01\\u0e43\\u0e2b\\u0e49\\u0e1e\\u0e30\\u0e40\\u0e22\\u0e32\\u0e1e\\u0e31\\u0e12\\u0e19\\u0e32\\u0e40\\u0e23\\u0e37\\u0e48\\u0e2d\\u0e07\\u0e44\\u0e2b\\u0e19\\u0e01\\u0e48\\u0e2d\\u0e19?&quot;,&quot;options&quot;:[&quot;\\u0e01\\u0e32\\u0e23\\u0e40\\u0e14\\u0e34\\u0e19\\u0e17\\u0e32\\u0e07\\\/\\u0e16\\u0e19\\u0e19\\u0e44\\u0e21\\u0e48\\u0e2a\\u0e30\\u0e14\\u0e27\\u0e01&quot;,&quot;\\u0e44\\u0e1f\\u0e1f\\u0e49\\u0e32\\u0e14\\u0e31\\u0e1a \\u0e44\\u0e1f\\u0e15\\u0e01 \\u0e2a\\u0e32\\u0e22\\u0e40\\u0e04\\u0e40\\u0e1a\\u0e34\\u0e25\\u0e23\\u0e01\\u0e23\\u0e38\\u0e07\\u0e23\\u0e31\\u0e07&quot;,&quot;\\u0e02\\u0e32\\u0e14\\u0e19\\u0e49\\u0e33\\u0e01\\u0e32\\u0e23\\u0e40\\u0e01\\u0e29\\u0e15\\u0e23&quot;,&quot;\\u0e19\\u0e49\\u0e33\\u0e17\\u0e48\\u0e27\\u0e21\\\/\\u0e20\\u0e31\\u0e22\\u0e18\\u0e23\\u0e23\\u0e21\\u0e0a\\u0e32\\u0e15\\u0e34&quot;,&quot;\\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e2d\\u0e32\\u0e0a\\u0e35\\u0e1e \\u0e44\\u0e21\\u0e48\\u0e21\\u0e35\\u0e07\\u0e32\\u0e19\\u0e17\\u0e33&quot;,&quot;\\u0e2a\\u0e34\\u0e19\\u0e04\\u0e49\\u0e32\\u0e41\\u0e1e\\u0e07&quot;]}\"\n        data-event-name=\"\">\n      <div class=\"pestv-bg-glow\"><\/div>\n<div class=\"pestv-left\">\n  <div class=\"pestv-map-head\">\n    <div class=\"pestv-event-tag\" id=\"pestvEventTag\">\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e17\u0e35\u0e27\u0e35 \u0e0a\u0e27\u0e19\u0e40\u0e25\u0e48\u0e19<\/div>\n    <h1 class=\"pestv-title\">\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e02\u0e2d\u0e07\u0e09\u0e31\u0e19\u0e27\u0e31\u0e19\u0e19\u0e35\u0e49<\/h1>\n  <\/div>\n  <div class=\"pestv-map-wrap\">\n    <svg id=\"pestvMapSvg\" viewBox=\"0 0 380 330\" xmlns=\"http:\/\/www.w3.org\/2000\/svg\"><\/svg>\n  <\/div>\n  <div class=\"pestv-total-row\">\n    <span class=\"pestv-total-label\">\u0e1c\u0e39\u0e49\u0e23\u0e48\u0e27\u0e21\u0e15\u0e2d\u0e1a\u0e17\u0e31\u0e49\u0e07\u0e2b\u0e21\u0e14<\/span>\n    <span class=\"pestv-total-num\" id=\"pestvTotal\">0<\/span>\n    <span class=\"pestv-total-label\">\u0e04\u0e19<\/span>\n    <span class=\"pestv-live-dot\"><\/span>\n  <\/div>\n<\/div>\n\n<div class=\"pestv-right\">\n  <div class=\"pestv-tabs\" id=\"pestvTabs\">\n    <button class=\"pestv-tab pestv-tab-active\" data-view=\"district\">\u0e2d\u0e33\u0e40\u0e20\u0e2d<\/button>\n    <button class=\"pestv-tab\" data-view=\"b\" id=\"pestvTabB\"><\/button>\n    <button class=\"pestv-tab\" data-view=\"c\" id=\"pestvTabC\"><\/button>\n  <\/div>\n  <div class=\"pestv-panel\" id=\"pestvPanel\"><\/div>\n<\/div>    <\/div>\n    <style>#pes-tv{\n  --tv-bg1:#0B1224; --tv-bg2:#151F3B;\n  --tv-orange:#FF7A45; --tv-orange-glow:#FFB37B;\n  --tv-blue:#3DA9FC; --tv-teal:#2FB6A6; --tv-pink:#FF6FA5; --tv-amber:#FFC145;\n  --tv-ink:#F4F1E8; --tv-ink-dim:#9BAAC6; --tv-line:rgba(244,241,232,0.12);\n  position:relative;\n  width:100%; aspect-ratio:16\/9; max-width:1920px; margin:0 auto;\n  display:flex; overflow:hidden;\n  background:linear-gradient(135deg, var(--tv-bg1), var(--tv-bg2));\n  color:var(--tv-ink); font-family:'Sarabun',sans-serif;\n  border-radius:clamp(8px,0.8vw,20px);\n}\n#pes-tv *{box-sizing:border-box;}\n#pes-tv .pestv-bg-glow{\n  position:absolute; inset:0; pointer-events:none;\n  background:\n    radial-gradient(circle at 15% 20%, rgba(61,169,252,0.22), transparent 45%),\n    radial-gradient(circle at 85% 75%, rgba(255,122,69,0.20), transparent 45%),\n    radial-gradient(circle at 60% 10%, rgba(255,111,165,0.14), transparent 40%);\n  animation:pestvDrift 14s ease-in-out infinite alternate;\n}\n@keyframes pestvDrift{\n  0%{ transform:scale(1) translate(0,0); }\n  100%{ transform:scale(1.08) translate(1%,-1%); }\n}\n\n#pes-tv .pestv-left{\n  position:relative; width:58%; padding:2.4vw 1.6vw 2vw 2.4vw;\n  display:flex; flex-direction:column;\n}\n#pes-tv .pestv-right{\n  position:relative; width:42%; padding:2.4vw 2.4vw 2vw 1.4vw;\n  display:flex; flex-direction:column;\n  border-left:1px solid var(--tv-line);\n}\n\n#pes-tv .pestv-event-tag{\n  display:inline-block; font-family:'Kanit',sans-serif; font-weight:600;\n  font-size:clamp(11px,1vw,16px); color:var(--tv-blue);\n  letter-spacing:0.02em; margin-bottom:0.4vw;\n}\n#pes-tv .pestv-title{\n  font-family:'Kanit',sans-serif; font-weight:800;\n  font-size:clamp(20px,2.6vw,42px); line-height:1.15; margin:0 0 1.2vw;\n  background:linear-gradient(90deg, var(--tv-ink), var(--tv-orange-glow));\n  -webkit-background-clip:text; background-clip:text; color:transparent;\n}\n\n#pes-tv .pestv-map-wrap{\n  flex:1; display:flex; align-items:center; justify-content:center;\n  min-height:0;\n}\n#pes-tv .pestv-map-wrap svg{ width:100%; height:100%; max-height:100%; }\n#pes-tv .pestv-node-fill{ transition:fill 0.6s ease, r 0.6s ease; filter:drop-shadow(0 0 6px rgba(0,0,0,0.35)); }\n#pes-tv .pestv-node-leader .pestv-node-fill{ animation:pestvPulse 1.6s ease-in-out infinite; }\n@keyframes pestvPulse{\n  0%,100%{ filter:drop-shadow(0 0 4px currentColor); }\n  50%{ filter:drop-shadow(0 0 16px currentColor); }\n}\n#pes-tv .pestv-map-wrap text{ font-family:'Kanit',sans-serif; fill:#0B1224; pointer-events:none; }\n#pes-tv .pestv-map-wrap .pestv-node-leader text{ font-weight:700; }\n\n#pes-tv .pestv-total-row{\n  display:flex; align-items:baseline; gap:0.6vw; margin-top:1vw;\n  font-family:'Kanit',sans-serif;\n}\n#pes-tv .pestv-total-label{ font-size:clamp(11px,0.95vw,16px); color:var(--tv-ink-dim); }\n#pes-tv .pestv-total-num{\n  font-size:clamp(22px,3vw,48px); font-weight:800; color:var(--tv-orange-glow);\n  min-width:1.4em;\n}\n#pes-tv .pestv-live-dot{\n  width:0.6vw; height:0.6vw; min-width:8px; min-height:8px; border-radius:50%;\n  background:var(--tv-teal); margin-left:auto;\n  animation:pestvBlink 1.4s ease-in-out infinite;\n  box-shadow:0 0 8px var(--tv-teal);\n}\n@keyframes pestvBlink{ 0%,100%{opacity:1;} 50%{opacity:0.25;} }\n\n#pes-tv .pestv-tabs{ display:flex; gap:0.6vw; margin-bottom:1.2vw; }\n#pes-tv .pestv-tab{\n  flex:1; padding:0.8vw 0.6vw; border-radius:clamp(6px,0.6vw,12px);\n  border:1px solid var(--tv-line); background:rgba(255,255,255,0.04);\n  color:var(--tv-ink-dim); font-family:'Kanit',sans-serif; font-weight:600;\n  font-size:clamp(10px,0.85vw,15px); cursor:pointer; text-align:center;\n  transition:background .2s ease, color .2s ease, border-color .2s ease;\n}\n#pes-tv .pestv-tab.pestv-tab-active{\n  background:linear-gradient(135deg, var(--tv-orange), var(--tv-pink));\n  border-color:transparent; color:#fff;\n}\n\n#pes-tv .pestv-panel{ flex:1; min-height:0; display:flex; flex-direction:column; justify-content:center; gap:clamp(10px,1.4vw,22px); }\n#pes-tv .pestv-panel-title{\n  font-family:'Kanit',sans-serif; font-weight:700;\n  font-size:clamp(14px,1.3vw,22px); margin:0 0 0.4vw; color:var(--tv-ink);\n}\n#pes-tv .pestv-row{ display:flex; flex-direction:column; gap:0.3vw; }\n#pes-tv .pestv-row-top{\n  display:flex; justify-content:space-between; align-items:baseline;\n  font-family:'Kanit',sans-serif; font-size:clamp(11px,1vw,17px);\n}\n#pes-tv .pestv-row-top .pestv-row-lbl{ font-weight:600; color:var(--tv-ink); }\n#pes-tv .pestv-row-top .pestv-row-pct{ font-weight:800; }\n#pes-tv .pestv-track{\n  height:clamp(10px,1vw,18px); background:rgba(255,255,255,0.08);\n  border-radius:999px; overflow:hidden; position:relative;\n}\n#pes-tv .pestv-fill{\n  height:100%; border-radius:999px; width:0%;\n  transition:width 0.8s cubic-bezier(.22,1,.36,1);\n  box-shadow:0 0 10px currentColor;\n}\n#pes-tv .pestv-row.pestv-leader .pestv-row-lbl::after{\n  content:\" \\1F451\"; font-size:0.9em;\n}\n\n@media (prefers-reduced-motion:reduce){\n  #pes-tv *{ animation:none !important; }\n}<\/style>\n    <script>(function(){\n  var root = document.getElementById('pes-tv');\n  if (!root || root.getAttribute('data-pestv-init') === '1') return;\n  root.setAttribute('data-pestv-init', '1');\n\n  var AJAX_URL = root.getAttribute('data-ajax-url');\n  var NONCE = root.getAttribute('data-nonce');\n  var DISTRICTS = JSON.parse(root.getAttribute('data-districts'));\n  var Q2 = JSON.parse(root.getAttribute('data-q2'));\n  var Q3 = JSON.parse(root.getAttribute('data-q3'));\n  var EVENT_NAME = root.getAttribute('data-event-name');\n  var COLORS = ['#FF7A45', '#3DA9FC', '#FFC145', '#2FB6A6', '#FF6FA5', '#9B8CFF'];\n  var PESTV_PROVINCE_BG = 'M 90,25 C 160,5 230,0 270,15 C 310,30 330,70 330,100 C 335,140 330,175 325,200 ' +\n    'C 320,240 300,275 260,300 C 220,325 170,325 140,315 C 100,305 60,290 40,255 ' +\n    'C 20,220 15,180 20,145 C 25,105 40,60 90,25 Z';\n\n  if (EVENT_NAME) document.getElementById('pestvEventTag').textContent = EVENT_NAME;\n  document.getElementById('pestvTabB').textContent = Q2.title;\n  document.getElementById('pestvTabC').textContent = Q3.title;\n\n  \/* ---- build static map nodes once ---- *\/\n  var svg = document.getElementById('pestvMapSvg');\n  var html = '<path d=\"'+PESTV_PROVINCE_BG+'\" fill=\"rgba(255,255,255,0.04)\" stroke=\"rgba(255,255,255,0.12)\" stroke-width=\"2\"\/>';\n  DISTRICTS.forEach(function(d, idx){\n    html += '<g class=\"pestv-node\" data-idx=\"'+idx+'\">' +\n      '<circle class=\"pestv-node-fill\" cx=\"'+d.x+'\" cy=\"'+d.y+'\" r=\"'+d.r+'\" fill=\"'+d.color+'\" opacity=\"0.4\" stroke=\"rgba(255,255,255,0.35)\" stroke-width=\"2\"\/>' +\n      '<text class=\"pestv-node-name\" x=\"'+d.x+'\" y=\"'+(d.y-2)+'\" font-size=\"11\" text-anchor=\"middle\" fill=\"#fff\">'+d.name+'<\/text>' +\n      '<text class=\"pestv-node-count\" x=\"'+d.x+'\" y=\"'+(d.y+12)+'\" font-size=\"10\" text-anchor=\"middle\" fill=\"#fff\" opacity=\"0.85\">0<\/text>' +\n      '<\/g>';\n  });\n  svg.innerHTML = html;\n\n  var currentView = 'district';\n  var lastData = null;\n  var lastB = new Array(Q2.options.length).fill(0);\n  var lastC = new Array(Q3.options.length).fill(0);\n\n  function animateNumber(el, from, to, duration){\n    var start = performance.now();\n    function tick(now){\n      var t = Math.min(1, (now - start) \/ duration);\n      var eased = 1 - Math.pow(1 - t, 3);\n      el.textContent = Math.round(from + (to - from) * eased);\n      if (t < 1) requestAnimationFrame(tick);\n    }\n    requestAnimationFrame(tick);\n  }\n\n  function paintMap(districtCounts, total){\n    var maxCount = Math.max.apply(null, districtCounts.concat([1]));\n    var leaderIdx = districtCounts.indexOf(maxCount);\n    Array.prototype.forEach.call(svg.querySelectorAll('.pestv-node'), function(node){\n      var idx = parseInt(node.getAttribute('data-idx'), 10);\n      var d = DISTRICTS[idx];\n      var cnt = districtCounts[idx] || 0;\n      var pct = total > 0 ? Math.round((cnt \/ total) * 100) : 0;\n      var share = maxCount > 0 ? (cnt \/ maxCount) : 0;\n      var displayR = d.r * (0.55 + 0.75 * share);\n      var fillEl = node.querySelector('.pestv-node-fill');\n      fillEl.setAttribute('r', displayR);\n      fillEl.setAttribute('fill', d.color);\n      fillEl.setAttribute('opacity', cnt > 0 ? (0.55 + 0.45 * share) : 0.3);\n      fillEl.style.color = d.color;\n      node.classList.toggle('pestv-node-leader', cnt > 0 && idx === leaderIdx && maxCount > 0);\n      var nameEl = node.querySelector('.pestv-node-name');\n      nameEl.setAttribute('font-size', 10 + Math.round(3 * share));\n      var countEl = node.querySelector('.pestv-node-count');\n      countEl.setAttribute('font-size', 9 + Math.round(4 * share));\n      countEl.textContent = cnt + ' (' + pct + '%)';\n    });\n  }\n\n  function renderPanel(){\n    var panel = document.getElementById('pestvPanel');\n    if (!lastData) return;\n    var total = lastData.total || 0;\n    var rows = [];\n    var title = '';\n\n    if (currentView === 'district'){\n      title = '\u0e21\u0e32\u0e08\u0e32\u0e01\u0e2d\u0e33\u0e40\u0e20\u0e2d\u0e44\u0e2b\u0e19\u0e1a\u0e49\u0e32\u0e07';\n      rows = DISTRICTS.map(function(d, idx){ return { label: d.name, count: lastData.district[idx] || 0 }; });\n    } else if (currentView === 'b'){\n      title = Q2.title;\n      rows = Q2.options.map(function(text, idx){ return { label: text, count: lastData.b[idx] || 0 }; });\n    } else {\n      title = Q3.title;\n      rows = Q3.options.map(function(text, idx){ return { label: text, count: lastData.c[idx] || 0 }; });\n    }\n\n    var maxCount = Math.max.apply(null, rows.map(function(r){ return r.count; }).concat([1]));\n    rows.sort(function(a, b){ return b.count - a.count; });\n\n    var html = '<p class=\"pestv-panel-title\">' + title + '<\/p>';\n    rows.forEach(function(r, idx){\n      var pct = total > 0 ? Math.round((r.count \/ total) * 100) : 0;\n      var share = maxCount > 0 ? (r.count \/ maxCount) : 0;\n      var isLeader = r.count > 0 && r.count === maxCount;\n      var color = COLORS[idx % COLORS.length];\n      var trackHeight = 'clamp(' + (8 + 10 * share) + 'px,' + (0.7 + 0.7 * share) + 'vw,' + (14 + 12 * share) + 'px)';\n      var pctSize = 'clamp(' + (11 + 8 * share) + 'px,' + (1 + 1 * share) + 'vw,' + (18 + 14 * share) + 'px)';\n      html += '<div class=\"pestv-row' + (isLeader ? ' pestv-leader' : '') + '\">' +\n        '<div class=\"pestv-row-top\"><span class=\"pestv-row-lbl\">' + r.label + '<\/span><span class=\"pestv-row-pct\" style=\"color:' + color + ';font-size:' + pctSize + '\">' + pct + '%<\/span><\/div>' +\n        '<div class=\"pestv-track\" style=\"height:' + trackHeight + '\"><div class=\"pestv-fill\" style=\"width:' + pct + '%;background:' + color + ';color:' + color + '\"><\/div><\/div>' +\n        '<\/div>';\n    });\n    panel.innerHTML = html;\n  }\n\n  document.getElementById('pestvTabs').addEventListener('click', function(e){\n    var btn = e.target.closest('.pestv-tab');\n    if (!btn) return;\n    currentView = btn.getAttribute('data-view');\n    Array.prototype.forEach.call(document.querySelectorAll('.pestv-tab'), function(b){ b.classList.toggle('pestv-tab-active', b === btn); });\n    renderPanel();\n    resetAutoRotate();\n  });\n\n  \/* auto-rotate through views every 8s; pauses 20s after manual click *\/\n  var rotateOrder = ['district', 'b', 'c'];\n  var rotateTimer = null;\n  var pauseUntil = 0;\n  function tickRotate(){\n    if (Date.now() < pauseUntil) return;\n    var i = rotateOrder.indexOf(currentView);\n    currentView = rotateOrder[(i + 1) % rotateOrder.length];\n    Array.prototype.forEach.call(document.querySelectorAll('.pestv-tab'), function(b){\n      b.classList.toggle('pestv-tab-active', b.getAttribute('data-view') === currentView);\n    });\n    renderPanel();\n  }\n  function resetAutoRotate(){ pauseUntil = Date.now() + 20000; }\n  rotateTimer = setInterval(tickRotate, 8000);\n\n  function postForm(action, extra){\n    var body = new URLSearchParams(Object.assign({ action: action, nonce: NONCE }, extra || {}));\n    return fetch(AJAX_URL, { method: 'POST', credentials: 'same-origin', body: body }).then(function(res){ return res.json(); });\n  }\n\n  function loadAndRender(){\n    return postForm('pes_results', {}).then(function(res){\n      if (!res || !res.success) return;\n      var prevTotal = lastData ? lastData.total : 0;\n      lastData = res.data;\n      animateNumber(document.getElementById('pestvTotal'), prevTotal, lastData.total || 0, 700);\n      paintMap(lastData.district || [], lastData.total || 0);\n      renderPanel();\n    }).catch(function(err){ console.error('\u0e42\u0e2b\u0e25\u0e14\u0e1c\u0e25\u0e23\u0e27\u0e21\u0e44\u0e21\u0e48\u0e2a\u0e33\u0e40\u0e23\u0e47\u0e08', err); });\n  }\n\n  loadAndRender();\n  setInterval(loadAndRender, 5000);\n})();<\/script>\n    \n","protected":false},"excerpt":{"rendered":"","protected":false},"author":126787289,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_header_footer","meta":{"advanced_seo_description":"","jetpack_seo_html_title":"","jetpack_seo_noindex":false,"jetpack_seo_schema_type":"","_wpcom_ai_launchpad_about_page":false,"_wpcom_ai_launchpad_gallery_page":false,"_wpcom_ai_launchpad_contact_page":false,"_wpcom_ai_launchpad_events_page":false,"_wpcom_ai_launchpad_video_page":false,"_wpcom_ai_launchpad_portfolio_piece":false,"footnotes":""},"class_list":["post-808","page","type-page","status-publish","hentry"],"jetpack_likes_enabled":true,"jetpack_sharing_enabled":true,"jetpack_shortlink":"https:\/\/wp.me\/Ph9MIZ-d2","jetpack-related-posts":[{"id":850,"url":"https:\/\/phayaotv.com\/?page_id=850","url_meta":{"origin":808,"position":0},"title":"\u0e40\u0e21\u0e37\u0e2d\u0e07\u0e1e\u0e30\u0e40\u0e22\u0e32\u0e17\u0e35\u0e48\u0e09\u0e31\u0e19\u0e2d\u0e22\u0e32\u0e01\u0e40\u0e2b\u0e47\u0e19","author":"chaiwat phayaotv","date":"07\/09\/2026","format":false,"excerpt":"","rel":"","context":"Similar post","block_context":{"text":"Similar post","link":""},"img":{"alt_text":"","src":"","width":0,"height":0},"classes":[]}],"amp_enabled":false,"_links":{"self":[{"href":"https:\/\/phayaotv.com\/index.php?rest_route=\/wp\/v2\/pages\/808","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/phayaotv.com\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/phayaotv.com\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/phayaotv.com\/index.php?rest_route=\/wp\/v2\/users\/126787289"}],"replies":[{"embeddable":true,"href":"https:\/\/phayaotv.com\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=808"}],"version-history":[{"count":4,"href":"https:\/\/phayaotv.com\/index.php?rest_route=\/wp\/v2\/pages\/808\/revisions"}],"predecessor-version":[{"id":815,"href":"https:\/\/phayaotv.com\/index.php?rest_route=\/wp\/v2\/pages\/808\/revisions\/815"}],"wp:attachment":[{"href":"https:\/\/phayaotv.com\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=808"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}