:root{--bg: #ffffff;--text: #1a1d21;--muted: #6b7280;--border: #e5e7eb;--accent: #2563eb;--radius: 14px;--shadow: 0 4px 20px rgba(0, 0, 0, .1);--font: "Noto Sans Thai", "Sarabun", system-ui, sans-serif}*{box-sizing:border-box}html,body{margin:0;padding:0;height:100%}body{font-family:var(--font);color:var(--text);font-size:14px;overflow:hidden}[hidden]{display:none!important}button{font-family:inherit;cursor:pointer}input{font-family:inherit}a{color:var(--accent)}#map{position:fixed;top:0;right:0;bottom:0;left:0;z-index:0;background:#e8ecef}.leaflet-container{font-family:var(--font)}.card{background:var(--bg);border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow)}#ui-top{position:fixed;top:0;left:0;right:0;z-index:1100;display:flex;flex-direction:column;gap:8px;padding:10px 12px 0;pointer-events:none}#ui-top .card{pointer-events:auto}#brand{align-self:flex-start;padding:8px 14px;max-width:100%}.brand-row{display:flex;align-items:center;gap:8px;flex-wrap:wrap}.brand-row h1{font-size:16px;font-weight:700;margin:0;line-height:1.3;white-space:nowrap}.brand-sub{color:var(--muted);font-size:12.5px;white-space:nowrap}#sample-badge{background:#fef3c7;color:#92400e;border:1px solid #fde68a;font-size:11.5px;padding:1px 8px;border-radius:999px;white-space:nowrap}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--muted);font-size:13px;font-weight:700;padding:0;flex-shrink:0}.icon-btn:hover{border-color:var(--accent);color:var(--accent)}.brand-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;font-size:12px;color:var(--muted);margin-top:2px}.brand-meta a{color:var(--muted)}.dot-sep{color:var(--border)}#controls{display:flex;gap:8px;align-items:flex-start;flex-wrap:wrap}#search-box{position:relative;width:300px;max-width:100%;flex-shrink:0}#search-box:focus-within{box-shadow:var(--shadow),0 0 0 2px #2563eb59}#search-input{width:100%;border:none;background:transparent;outline:none;padding:9px 14px;font-size:13.5px;border-radius:var(--radius);color:var(--text)}#search-results{position:absolute;top:calc(100% + 6px);left:0;right:0;z-index:60;overflow:hidden}.search-item{display:block;width:100%;text-align:left;background:#fff;border:none;border-bottom:1px solid var(--border);padding:9px 12px;font-size:12.5px;line-height:1.45;color:var(--text)}.search-item:last-child{border-bottom:none}.search-item:hover{background:#eff6ff}.search-empty{padding:10px 12px;color:var(--muted);font-size:12.5px}#filter-bar{display:flex;align-items:center;gap:12px;flex-wrap:wrap;padding:7px 12px;flex:1 1 340px;min-width:0}.pill-group{display:flex;align-items:center;gap:4px;flex-wrap:wrap}.pill-group-label{font-size:11.5px;color:var(--muted);margin-right:2px;white-space:nowrap}.pill{border:1px solid var(--border);background:#fff;color:var(--text);border-radius:999px;font-size:13px;padding:3px 12px;line-height:1.5;white-space:nowrap}.pill:hover{border-color:var(--accent);color:var(--accent)}.pill.on{background:var(--accent);border-color:var(--accent);color:#fff}#live-count{margin-left:auto;font-size:12.5px;color:var(--muted);white-space:nowrap}#score-panel{position:fixed;z-index:1050;top:var(--panel-top, 118px);right:12px;width:360px;max-width:calc(100vw - 24px);max-height:calc(100vh - 140px);overflow-y:auto;padding:16px}.sp-close{position:absolute;top:10px;right:10px;font-size:16px}.sp-head{display:flex;align-items:center;gap:12px;padding-right:30px}.sp-index{font-size:44px;font-weight:700;line-height:1;min-width:58px;text-align:center}.sp-level{font-size:15px;font-weight:700}.sp-sub{font-size:11.5px;color:var(--muted);margin-top:2px}.sp-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;margin-top:14px}.sp-stat{background:#f8fafc;border:1px solid var(--border);border-radius:10px;padding:8px 6px;text-align:center}.sp-stat b{display:block;font-size:16px}.sp-stat span{display:block;font-size:10.5px;color:var(--muted);line-height:1.35;margin-top:2px}.sp-list-head{font-size:12.5px;font-weight:700;margin:14px 0 6px}.sp-list-hint{font-weight:400;color:var(--muted);font-size:11px}.sp-list{list-style:none;margin:0;padding:0}.sp-list li{border:1px solid var(--border);border-radius:10px;padding:7px 10px;margin-bottom:6px;cursor:pointer}.sp-list li:hover{border-color:var(--accent);background:#eff6ff}.sp-item-desc{font-size:12.5px;line-height:1.45;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.sp-item-meta{font-size:11px;color:var(--muted);margin-top:2px}.sp-list li.open{border-color:var(--accent);background:#f8faff}.sp-list li.open .sp-item-desc{display:block;-webkit-line-clamp:unset;overflow:visible}.sp-item-detail{margin-top:8px;cursor:default}.sp-item-badges{display:flex;align-items:center;gap:6px;flex-wrap:wrap}.sp-item-district{font-size:11px;color:var(--muted)}.sp-item-photo{display:block;margin-top:8px}.sp-item-photo img{width:100%;max-height:200px;object-fit:cover;border-radius:8px;display:block;background:#f3f4f6;min-height:60px}.sp-goto{margin-top:8px;font-size:12px;color:var(--accent);border:1px solid var(--border);background:#fff;border-radius:999px;padding:5px 14px}.sp-goto:hover{border-color:var(--accent)}.sp-empty{font-size:12.5px;color:var(--muted);padding:8px 0}.sp-actions{margin-top:12px;display:flex;gap:8px}.btn-primary{background:var(--accent);border:none;color:#fff;border-radius:999px;font-size:13.5px;font-weight:500;padding:8px 18px;flex:1}.btn-primary:hover{background:#1d4ed8}.sp-credit{margin-top:10px;font-size:10.5px;color:var(--muted);text-align:center}.score-pin{filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}.score-pin .pin-body{position:absolute;left:3px;top:3px;width:24px;height:24px;background:var(--accent);border:2px solid #fff;border-radius:50% 50% 50% 0;transform:rotate(-45deg)}.score-pin .pin-body:after{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;background:#fff;border-radius:50%}.report-popup .leaflet-popup-content-wrapper{border-radius:12px;box-shadow:var(--shadow)}.report-popup .leaflet-popup-content{margin:12px 14px;font-family:var(--font)}.popup-desc{font-size:13px;line-height:1.5}.popup-meta{display:flex;align-items:center;gap:6px;flex-wrap:wrap;margin-top:6px}.badge{display:inline-block;font-size:11px;padding:1px 8px;border-radius:999px;border:1px solid transparent;white-space:nowrap}.badge.st-0{background:#fef3c7;color:#92400e;border-color:#fde68a}.badge.st-1{background:#dbeafe;color:#1e40af;border-color:#bfdbfe}.badge.st-2{background:#dcfce7;color:#166534;border-color:#bbf7d0}.badge.st-3{background:#f3f4f6;color:#4b5563;border-color:#e5e7eb}.badge-comm{background:#ffedd5;color:#9a3412;border-color:#fed7aa}.sp-list li .badge-comm{margin-bottom:4px}.popup-district{font-size:11.5px;color:var(--muted)}.popup-date{font-size:11.5px;color:var(--muted);margin-top:4px}.popup-photo{display:block;margin-top:8px}.popup-photo img{width:100%;max-height:140px;object-fit:cover;border-radius:8px;display:block}.modal{position:fixed;top:0;right:0;bottom:0;left:0;z-index:2000;background:#0f172a73;display:flex;align-items:center;justify-content:center;padding:16px}.modal-box{position:relative;max-width:480px;width:100%;max-height:85vh;overflow-y:auto;padding:20px 22px}.modal-box h2{margin:0 0 10px;font-size:17px}.modal-box p{font-size:13px;line-height:1.65;margin:0 0 10px}.modal-close{position:absolute;top:12px;right:12px;font-size:16px}.about-credit{color:var(--muted);font-size:12px!important;margin-bottom:0!important}.about-credit a{color:var(--muted)}.auth-slot{display:inline-flex;align-items:center;gap:8px;margin-left:auto}.auth-email{font-size:12px;color:var(--muted);max-width:150px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.auth-btn{border:1px solid var(--border);background:#fff;color:var(--text);border-radius:999px;font-size:12.5px;padding:3px 12px;white-space:nowrap}.auth-btn:hover{border-color:var(--accent);color:var(--accent)}.auth-intro{font-size:12.5px;color:var(--muted);margin:0 0 12px}.auth-form{display:flex;flex-direction:column;gap:10px}.auth-label,.rp-label{display:flex;flex-direction:column;gap:4px;font-size:12.5px;color:var(--muted);position:relative}.auth-input,.rp-input{width:100%;border:1px solid var(--border);border-radius:10px;padding:9px 12px;font-size:14px;color:var(--text);background:#fff}.auth-input:focus,.rp-input:focus{outline:none;border-color:var(--accent);box-shadow:0 0 0 2px #2563eb33}.auth-error,.rp-error{background:#fef2f2;color:#b91c1c;border:1px solid #fecaca;border-radius:8px;padding:7px 10px;font-size:12.5px}.auth-submit,.rp-submit{margin-top:2px}.auth-toggle{margin-top:14px;font-size:12.5px;color:var(--muted);text-align:center}.auth-switch{border:none;background:none;color:var(--accent);font-size:12.5px;padding:0 2px;font-weight:500}.auth-switch:hover{text-decoration:underline}#corner-bl{position:fixed;left:12px;bottom:12px;z-index:1040;display:flex;flex-direction:column;align-items:flex-start;gap:8px}.btn-report{display:inline-flex;align-items:center;gap:5px;font-size:12.5px;font-weight:700;border-radius:999px;padding:7px 14px;box-shadow:0 3px 10px #ea580c66;background:#ea580c;border:none;color:#fff;cursor:pointer}.btn-report:hover{background:#c2410c;box-shadow:0 4px 14px #ea580c80}.btn-report.on{background:#9a3412}body.report-mode #btn-report{display:none}#report-panel{position:fixed;z-index:1060;top:var(--panel-top, 118px);right:12px;width:360px;max-width:calc(100vw - 24px);max-height:calc(100vh - 140px);overflow-y:auto;padding:16px}.rp-close{position:absolute;top:10px;right:10px;font-size:16px}.rp-head{font-size:16px;font-weight:700;padding-right:30px}.rp-hint{font-size:12px;color:var(--muted);margin:8px 0 12px;background:#f8fafc;border:1px dashed var(--border);border-radius:8px;padding:8px 10px}.rp-hint.ok{color:#166534;background:#f0fdf4;border-color:#bbf7d0;border-style:solid}.rp-form{display:flex;flex-direction:column;gap:11px}.rp-descr{resize:vertical;min-height:64px}.rp-counter{align-self:flex-end;font-size:11px;color:var(--muted);margin-top:-2px}.rp-actions{display:flex;gap:8px;margin-top:4px}.rp-cancel{border:1px solid var(--border);background:#fff;color:var(--text);border-radius:999px;font-size:13.5px;padding:8px 18px}.rp-cancel:hover{border-color:var(--accent)}.rp-submit{flex:1}.rp-submit:disabled{background:#cbd5e1;cursor:not-allowed}.report-pin{filter:drop-shadow(0 2px 4px rgba(0,0,0,.35))}.report-pin .pin-body{position:absolute;left:3px;top:3px;width:24px;height:24px;background:#ea580c;border:2px solid #fff;border-radius:50% 50% 50% 0;transform:rotate(-45deg)}.report-pin .pin-body:after{content:"";position:absolute;top:6px;right:6px;bottom:6px;left:6px;background:#fff;border-radius:50%}body.report-mode #map{cursor:crosshair}body.report-mode #score-panel{display:none!important}#legend{padding:7px 12px;font-size:12px;pointer-events:none}.legend-row{display:flex;align-items:center;gap:7px;line-height:1.7;color:var(--text)}.legend-dot{width:12px;height:12px;border-radius:50%;flex-shrink:0}.legend-traffy{background:#2563eb;border:1.5px solid #fff;box-shadow:0 0 0 1px #cbd5e1}.legend-community{background:#f59e0b;border:2px solid #c2410c}#toast{position:fixed;bottom:28px;left:50%;transform:translate(-50%);z-index:2100;background:#111827eb;color:#fff;font-size:13px;padding:8px 18px;border-radius:999px;opacity:0;transition:opacity .25s;pointer-events:none;max-width:calc(100vw - 32px);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}#toast.show{opacity:1}#loading{position:fixed;top:0;right:0;bottom:0;left:0;z-index:3000;background:#ffffffc7;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px}.spinner{width:34px;height:34px;border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;animation:spin .8s linear infinite}.loading-text{font-size:13.5px;color:var(--muted)}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:640px){#ui-top{padding:8px 8px 0;gap:6px}#brand{align-self:stretch;padding:7px 12px}.brand-row h1{font-size:14.5px}.brand-sub{display:none}.brand-meta{font-size:11px}#controls{flex-direction:column}#search-box{width:100%}#filter-bar{flex:0 0 auto;width:100%;padding:6px 10px;gap:10px;flex-wrap:nowrap;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none}#filter-bar::-webkit-scrollbar{display:none}.pill-group{flex-wrap:nowrap;flex-shrink:0}#live-count{margin-left:4px;flex-shrink:0}#score-panel,#report-panel{top:auto;left:0;right:0;bottom:0;width:100%;max-width:100%;max-height:72vh;border-radius:var(--radius) var(--radius) 0 0;border-bottom:none;padding-bottom:max(16px,env(safe-area-inset-bottom))}#score-panel{max-height:55vh}.auth-slot{margin-left:0}.auth-email{max-width:42vw}#corner-bl{left:8px;bottom:max(8px,env(safe-area-inset-bottom));gap:7px}#legend{padding:6px 10px;font-size:11px;opacity:.95}.leaflet-control-zoom{display:none}}