/* 1.26 — light, compact mobile workspace inspired by the supplied design. */
.kh-studio #mapSection{--ks-ink:#10264c;--ks-cyan:#00aaba;background:#fff;border:1px solid #dbe7f2;border-radius:24px;overflow:hidden;box-shadow:0 10px 42px #16385912;color:var(--ks-ink)}
.kh-studio #mapSection [hidden],.ks-google-dialog [hidden]{display:none!important}
.kh-studio #mapSection .kh-map-signature{background:#fff;color:#10264c;border-bottom:0;padding:18px 20px 8px}.kh-studio .kh-map-signature h2{font-size:clamp(21px,3vw,30px);letter-spacing:-.4px}.kh-studio .kh-map-kicker{color:#617891}.kh-studio .kh-map-ribbon{display:none}
.kh-studio #mapSection .mapbar{background:#fff;padding:10px 16px;gap:10px}.kh-studio #mapSection .mapbox{border-radius:18px;margin:0 12px;overflow:hidden;isolation:isolate}.kh-studio #map{min-height:440px;height:min(68svh,720px)}
.ks-livebar{display:flex;align-items:center;gap:10px;padding:9px 12px;border:1px solid #d6e5f0;border-radius:13px;background:#f9fcff;margin-bottom:10px}.ks-status{font-size:12px;font-weight:600;display:flex;gap:7px;align-items:center;margin-right:auto}.ks-status:before{content:'';flex:0 0 8px;height:8px;border-radius:50%;background:#e29a1a}.ks-livebar[data-state=ready] .ks-status:before{background:#00bac5}.ks-livebar[data-state=offline] .ks-status:before{background:#8b98a9}
.ks-time-wrap{display:flex;flex-direction:column;line-height:1.3;white-space:nowrap}.ks-time-wrap small{font-size:9px;color:#64748b}.ks-clock{font:700 15px var(--f-body,sans-serif);font-variant-numeric:tabular-nums;color:#10264c}.ks-refresh{background:white;border:1px solid #c8dceb;border-radius:9px;width:36px;height:36px;color:#245386;display:grid;place-items:center;cursor:pointer}.ks-refresh:disabled{opacity:.5}.ks-icon{display:inline-flex;align-items:center;justify-content:center}.ks-icon svg{width:22px;height:22px}
.ks-health{margin:6px 0;font-size:11px;color:#4c647d}.ks-health summary{cursor:pointer;min-height:28px;padding:6px 0}.ks-health-list{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}.ks-source{padding:9px;border-radius:9px;background:#f1f6fa;display:flex;flex-direction:column}.ks-source b{color:#193759}.ks-source small{font-size:10px}.ks-health-note{line-height:1.65}
.ks-modes{display:flex;gap:5px;padding:5px;border:1px solid #cce4eb;border-radius:30px;background:#f4fbfc;margin:8px 0;max-width:470px}.ks-modes button{min-height:42px;flex:1;border:0;border-radius:24px;font:600 14px var(--f-body,sans-serif);color:#18445e;background:transparent;display:flex;gap:6px;align-items:center;justify-content:center;cursor:pointer}.ks-modes button:first-child{background:#073d53;color:#fff}.ks-modes button:last-child{color:#009aab;background:#fff;box-shadow:0 0 0 1px #66d8dc}.ks-modes button:hover{background:#d9f6f7;color:#143959}
.ks-tools{border:1px solid #dae5ef;border-radius:12px;font-size:12px;margin-bottom:8px}.ks-tools>summary{padding:10px 13px;font-weight:600;cursor:pointer;min-height:40px;box-sizing:border-box}.ks-tools-body{padding:8px;max-height:55svh;overflow:auto;background:#f6fafd}.ks-tools #khMapLens{display:block!important;margin:8px 0;padding:8px;box-shadow:none}.ks-tools .kh-experience{margin:0}.ks-tools .kh-map-toolbar{flex-wrap:wrap}.ks-tools .kh-map-filters{margin:6px 0}
.ks-area-row{display:flex;gap:7px;margin:8px 0}.ks-area-row select{flex:1;width:0;min-width:0;height:41px;border:1px solid #cbdcec;background:#fff;color:#1d3d66;border-radius:11px;padding:5px 8px;font:500 13px var(--f-body,sans-serif)}.ks-coverage{font-size:10px;color:#65758b;margin:5px 0!important}.ks-area-link{display:inline-block;padding:5px 0 10px;font-size:12px;color:#007d94}.ks-road-note{font-size:11px;color:#50667a;line-height:1.65}
.ks-quick{display:grid;grid-template-columns:repeat(4,1fr);padding:14px 8px 16px;gap:6px;background:white}.ks-quick button{display:flex;align-items:center;flex-direction:column;gap:7px;border:0;background:transparent;color:#112d51;cursor:pointer;font:600 13px var(--f-body,sans-serif);min-height:86px}.ks-quick .ks-icon{width:54px;height:54px;border-radius:50%;background:#eae0ff;color:#8050ef;box-shadow:inset 0 -6px 15px #ffffff90}.ks-quick .ks-icon svg{width:29px;height:29px}.ks-quick-traffic .ks-icon{background:#ffecd0;color:#f28c00}.ks-quick-wifi .ks-icon{background:#d7efff;color:#168af3}.ks-quick-help .ks-icon{background:#ffe0e4;color:#f54e62}.ks-quick button:hover .ks-icon{transform:translateY(-2px)}
.kh-studio #mapSection .search{border:1px solid #c9ddef;border-radius:16px;background:white}.kh-studio #mapSection #q{font-size:15px}.kh-studio #mapSection button:focus-visible,.ks-google-dialog button:focus-visible,.ks-google-dialog a:focus-visible,.ks-tools summary:focus-visible{outline:3px solid #09aebe;outline-offset:3px}.kh-studio #mapSection .kh-map-area-tag{border:1px solid #cce0ed;color:#255c7b;background:#f4fbfc}
.ks-new{animation:ks-flash 1.4s ease-out}@keyframes ks-flash{0%{box-shadow:0 0 0 4px #00c8d455;background:#dcfbfb}100%{box-shadow:0 0 0 0 transparent;background:#f9fcff}}
.ks-google-dialog{box-sizing:border-box;width:min(1180px,calc(100vw - 32px));max-width:none;height:min(900px,calc(100dvh - 30px));max-height:none;padding:0;border:1px solid #b8d1dd;border-radius:22px;color:#133452;background:#fff;box-shadow:0 25px 100px #071f3f66;overflow:auto}.ks-google-dialog::backdrop{background:#081f37cc}.ks-google-dialog>header{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:12px 18px;background:#fff}.ks-google-dialog h2{font:700 20px var(--f-body,sans-serif);margin:0}.ks-google-dialog button{min-width:44px;min-height:42px;padding:6px 12px;border:1px solid #b9dae3;border-radius:10px;background:white;color:#0d526d;font:600 14px var(--f-body,sans-serif);cursor:pointer}.ks-google-message{font:500 12px/1.65 var(--f-body,sans-serif);background:#eef9fa;padding:8px 16px;margin:0}.ks-google-stage{position:relative;width:100%;height:calc(100% - 225px);min-height:280px;background:#e9f1f5}.ks-google-stage gmp-map-3d{display:block;width:100%;height:100%}.ks-google-controls{display:flex;gap:8px;justify-content:center;padding:8px}.ks-google-hint{font:400 11px/1.6 var(--f-body,sans-serif);margin:5px 16px}.ks-google-dialog>a{display:inline-block;margin:6px 16px 12px;color:#008599;font-size:13px}
.ki-screen>.kt-preview{position:absolute;inset:0;width:100%;height:100%;border-radius:0}.ki-poster-play{position:absolute;right:12px;bottom:16px;z-index:3;display:grid;place-items:center;width:47px;height:47px;border-radius:50%;border:3px solid #fff;background:#02adbccc;color:#fff;font-size:20px;cursor:pointer;box-shadow:0 0 0 5px #05b7cd33}.ki-thai-clock{position:absolute;right:8px;top:8px;z-index:3;padding:4px 7px;border-radius:7px;background:#0c2545cb;color:white;font:500 10px var(--f-body,sans-serif);font-variant-numeric:tabular-nums;pointer-events:none}.ki-thai-clock:before{content:'เวลาไทย ';opacity:.8}.ki-player[data-day=night] .ki-thai-clock:after{content:' ☾'}.ki-player[data-day=day] .ki-thai-clock:after{content:' ☀'}.ki-screen video,.ki-screen iframe{z-index:4}.ki-player .ki-controls .ki-play{background:#009eaf}.ki-player .ki-status.is-live{color:#62e6cb}
@media(max-width:600px){.kh-studio #mapSection{border-radius:19px}.kh-studio #mapSection .mapbar{padding:8px 10px}.kh-studio .kh-map-signature{padding:13px 12px 4px}.kh-studio .kh-map-signature h2{font-size:22px}.kh-studio #map{min-height:400px;height:58svh}.ks-status{font-size:10px}.ks-livebar{padding:7px 8px;gap:7px}.ks-clock{font-size:13px}.ks-quick button{font-size:12px}.ks-quick .ks-icon{width:48px;height:48px}.ks-google-dialog{width:100vw;height:100dvh;border-radius:0;border:0;max-height:100dvh}.ks-google-dialog>header{padding:10px}.ks-google-dialog h2{font-size:17px}.ks-google-stage{height:calc(100% - 245px)}.kh-studio .mapbox .leaflet-control-attribution{max-width:85%;font-size:8px!important}}
@media(prefers-reduced-motion:reduce){.ks-new{animation:none}.ks-quick .ks-icon{transition:none;transform:none!important}}
.kh-no-motion .ks-new{animation:none}
body.kh-focus-map.kh-studio #mapSection .mapbox{margin:0!important;width:100%!important}body.kh-focus-map.kh-studio #map{height:100%;min-height:180px}body.kh-focus-map.kh-studio .ks-quick{flex:none;padding:7px 5px}body.kh-focus-map.kh-studio .ks-quick button{min-height:64px;gap:4px;font-size:11px}body.kh-focus-map.kh-studio .ks-quick .ks-icon{width:35px;height:35px}body.kh-focus-map.kh-studio .ks-quick svg{width:23px;height:23px}

@font-face{font-family:KH24LocalThai;src:url('../fonts/ibm-plex-thai-regular.ttf') format('truetype');font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:KH24LocalThai;src:url('../fonts/ibm-plex-thai-semibold.ttf') format('truetype');font-weight:600 800;font-style:normal;font-display:swap}
.kh-studio,.kh-local-cctv{--f-body:KH24LocalThai,'IBM Plex Sans Thai',sans-serif}
.ki-player .ki-thai-clock{z-index:5}