/* Local graphics: a decorative frame and the real province outline, never invented weather. */
.bt .kh-brand-name{display:block}.kh-home-intro{margin:14px 16px;padding:20px 22px;border:1px solid #bfdae9;border-radius:16px;background:radial-gradient(ellipse at top right,#c9f5f755,transparent 65%),#fff;box-shadow:0 5px 20px #17486308;color:#163852}
.kh-intro-kicker{font:700 11px/1.6 var(--f-body);letter-spacing:.7px;color:#087393}.kh-home-intro h1{font:700 clamp(20px,2.5vw,30px)/1.55 var(--f-display);margin:4px 0 7px;color:#123b65}.kh-home-intro h1 span{color:#087993}.kh-home-intro>p{font:400 14px/1.85 var(--f-body);margin:0;color:#36546a;max-width:960px}.kh-data-guide{margin-top:8px;font:400 12px/1.9 var(--f-body);color:#39536b}.kh-data-guide summary{cursor:pointer;color:#075985;font-weight:600;min-height:32px;line-height:32px}.kh-data-guide p{margin:7px 0}.kh-data-guide a{color:#075985;text-decoration:underline;text-underline-offset:3px}
#mapSection .kh-map-signature{position:relative;isolation:isolate;display:flex;align-items:center;gap:11px;padding:15px 17px;min-height:78px;background:radial-gradient(ellipse at 85% 15%,#167ba870,transparent 65%),linear-gradient(115deg,#082d51,#104a71 62%,#075e74);color:#fff;overflow:hidden;flex:none;border-top:1px solid #50cde970;border-bottom:1px solid #a1efff70}
.kh-water-emblem{width:44px;height:44px;border:1px solid #80e3f7a8;display:grid;place-items:center;border-radius:14px;background:linear-gradient(140deg,#ffffff26,#67e8f907);box-shadow:0 0 18px #67e8f923,inset 0 1px #ffffff55;flex:none}.kh-water-emblem svg{width:36px;height:36px}.kh-map-kicker{font:600 10px/1.6 var(--f-body);color:#afeef8;letter-spacing:1px}.kh-map-signature h2{font:700 clamp(15px,1.8vw,21px)/1.65 var(--f-display);margin:0;letter-spacing:.15px}.kh-map-area-tag{margin-left:auto;white-space:nowrap;border:1px solid #85e5f76b;border-radius:20px;padding:4px 10px;font:600 11px/1.6 var(--f-body);color:#d9faff;background:#061c3b55}
.kh-map-ribbon{position:absolute;inset:auto 0 0;width:100%;height:64px;z-index:-1;fill:none;stroke:#67e8f9;stroke-width:.8;opacity:.24;pointer-events:none}.kh-map-signature:after{content:'';position:absolute;width:5px;height:5px;border-radius:50%;background:#c5f5fc;right:29%;top:20px;box-shadow:72px 24px 0 -1px #b7f5ff,-90px 15px 0 -1px #b7f5ff;opacity:.42;pointer-events:none}
#mapSection .mapbar{background:radial-gradient(ellipse at 100% 0,#cef4f96b,transparent 60%),linear-gradient(125deg,#f8fcff,#edf8ff)}#mapSection .mapbox{position:relative}.kh-map-aura{position:absolute;inset:0;z-index:410;pointer-events:none;border:1px solid #83eafb8c;box-shadow:inset 0 0 22px #00bef00d,inset 0 1px 0 #c0f3ff88}.kh-map-aura:before,.kh-map-aura:after{content:'';position:absolute;width:22px;height:22px;border-color:#bbf4ffb3;border-style:solid;pointer-events:none}.kh-map-aura:before{left:4px;top:4px;border-width:2px 0 0 2px}.kh-map-aura:after{right:4px;bottom:4px;border-width:0 2px 2px 0}
#map .kh-district-marker span{box-shadow:0 2px 8px #00162bc9,0 0 8px #4bcddd26}#map .kcm-pin{box-shadow:0 2px 7px #14244b8c,0 0 0 3px #a78bfa25}#map .kh-news-pin{box-shadow:0 2px 7px #14244b80,0 0 0 3px #fbbf2425}#map .kh-water-pin:not(.help){box-shadow:0 0 0 2px #fff,0 3px 8px #001a399c}.kh-weather-pin{box-shadow:0 2px 8px #12345c80,0 0 0 3px #7dd3fc30}
.kh-emblem-wave{animation:kh-soft-wave 5s ease-in-out infinite}.kh-map-ribbon{animation:kh-ribbon-light 7s ease-in-out infinite}@keyframes kh-soft-wave{0%,100%{transform:translateY(-.7px)}50%{transform:translateY(.7px)}}@keyframes kh-ribbon-light{0%,100%{opacity:.17}50%{opacity:.32}}
.kh-no-motion .kh-emblem-wave,.kh-no-motion .kh-map-ribbon{animation:none}.kh-no-motion #map *{animation:none!important}.kh-page-away *,.kh-offscreen *{animation-play-state:paused!important}body.kh-picking .kh-map-aura{display:none}
body.kh-map-open .kh-map-signature{display:none!important}
.kh-fanpage{position:fixed;left:14px;bottom:18px;z-index:1250;display:flex;align-items:center;border:1px solid #8dc9ff;border-radius:14px;background:linear-gradient(135deg,#0a51af,#153f80);box-shadow:0 5px 16px #07366e2b;color:#fff;max-width:190px;isolation:isolate}.kh-fanpage[hidden]{display:none!important}.kh-fanpage a{display:flex;gap:8px;align-items:center;padding:8px 5px 8px 10px;text-decoration:none;color:#fff;min-height:48px}.kh-fb-icon{display:grid;place-items:center;width:26px;height:30px}.kh-fb-icon svg{width:24px;height:24px}.kh-fanpage small,.kh-fanpage b{display:block}.kh-fanpage small{font:400 10px/1.5 var(--f-body);color:#e0efff}.kh-fanpage b{font:700 12px/1.5 var(--f-body);letter-spacing:.4px}.kh-fanpage button{align-self:stretch;display:grid;place-items:center;min-width:34px;min-height:44px;background:transparent;color:#fff;border:0;border-left:1px solid #ffffff24;cursor:pointer;border-radius:0 13px 13px 0}.kh-fanpage button svg{width:17px;height:17px}.kh-fanpage button:hover{background:#ffffff20}.kh-fanpage a:focus-visible,.kh-fanpage button:focus-visible{outline:3px solid #fbbf24;outline-offset:3px}.kh-social-footer{padding:16px 16px 26px;text-align:center;font:500 12px/1.7 var(--f-body);background:#f5faff;color:#254c73}.kh-social-footer a{color:inherit;display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:36px;text-decoration:none}.kh-social-footer svg{width:17px;height:17px;color:#0866c5}
body.kh-map-open .kh-fanpage,body.kh-picking .kh-fanpage{display:none!important}
@media(max-width:880px){.kh-home-intro{margin:10px 10px;padding:15px}.kh-home-intro h1 span{display:block}.kh-home-intro>p{font-size:13px}.kh-data-guide{font-size:12px}.kh-fanpage{left:10px;bottom:calc(86px + env(safe-area-inset-bottom,0px))}.kh-social-footer{padding-bottom:calc(90px + env(safe-area-inset-bottom,0px))}#mapSection .kh-map-signature{padding:12px 11px;gap:8px;min-height:70px}.kh-map-area-tag{font-size:10px;padding:3px 7px}.kh-water-emblem{width:36px;height:38px;border-radius:11px}.kh-water-emblem svg{width:31px;height:31px}.kh-map-kicker{font-size:9px;letter-spacing:.25px}}
@media(max-width:360px){.kh-map-area-tag{display:none}.kh-home-intro h1{font-size:20px}}
@media(prefers-reduced-motion:reduce){.kh-emblem-wave,.kh-map-ribbon,#map *{animation:none!important}}
/* Keep the added map and both CCTV menu labels reachable on tablet/smaller desktops. */
@media(min-width:621px) and (max-width:1500px){.top{flex-wrap:wrap;gap:6px 14px}.top .topnav{display:flex;order:5;flex-basis:100%;width:100%;gap:2px;padding:2px 0;overflow-x:auto}.top .topnav a{padding:6px 9px;font-size:13px}.top .brand{margin-right:auto}}
