/*
Theme Name: Weerstation Medemblik Pro
Theme URI: https://weerstationmedemblik.nl/
Author: HBP Media
Description: Professioneel responsive weerstation-thema voor Weerstation Medemblik met live clientraw-data, radar- en onweerpopups, historische grafieken en light/dark mode.
Version: 1.8.5
Requires at least: 6.0
Requires PHP: 7.4
Text Domain: weerstation-medemblik-pro
Tags: weather, responsive-layout, custom-logo, custom-menu
*/

:root{
  --bg:#eef4f7;
  --card:#ffffff;
  --panel:#f7fafc;
  --ink:#0f2334;
  --muted:#6f8799;
  --line:#d7e3ec;
  --navy:#062840;
  --navy2:#031726;
  --blue:#1195d9;
  --cyan:#23c8ef;
  --green:#1db784;
  --yellow:#f4c23a;
  --red:#ee5852;
  --shadow:0 18px 55px rgba(12,38,58,.12);
  --max:1460px;
}
html[data-theme="dark"]{
  --bg:#07111b;
  --card:#0c1c29;
  --panel:#122635;
  --ink:#eef7fb;
  --muted:#98afc1;
  --line:#1e394c;
  --navy:#071c2b;
  --navy2:#020b12;
  --blue:#39afeb;
  --cyan:#37d6f4;
  --green:#28c8a0;
  --yellow:#ffd05d;
  --red:#ff6b66;
  --shadow:0 22px 70px rgba(0,0,0,.42);
  color-scheme:dark;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",Arial,sans-serif;line-height:1.5}
a{color:inherit;text-decoration:none}
img{display:block;max-width:100%;height:auto}
button,input,textarea,select{font:inherit}
.screen-reader-text{position:absolute!important;left:-9999px!important}
.wsm-wrap{width:min(var(--max),calc(100% - 34px));margin:0 auto}

/* Header */
.wsm-topbar{background:var(--navy2);color:#d1e3ee;font-size:.78rem}
.wsm-topbar-inner{display:flex;align-items:center;justify-content:space-between;gap:18px;min-height:36px}
.wsm-topbar-left,.wsm-topbar-right{display:flex;align-items:center;gap:18px;flex-wrap:wrap}
.wsm-live-dot{display:inline-block;width:8px;height:8px;border-radius:50%;background:#35d38b;box-shadow:0 0 0 5px rgba(53,211,139,.14);margin-right:7px}
.wsm-brandbar{position:relative;background:linear-gradient(rgba(4,21,34,.24),rgba(4,21,34,.24)),url('assets/images/header-medemblik.webp') center/cover no-repeat;color:#fff;overflow:hidden}
.wsm-brandbar:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(4,19,30,.56),rgba(4,19,30,.08) 60%,rgba(4,19,30,.30));pointer-events:none}
.wsm-brand-inner{position:relative;z-index:1;display:flex;align-items:flex-end;justify-content:space-between;gap:24px;min-height:198px;padding:26px 0}
.wsm-branding{display:flex;align-items:flex-start;gap:18px;max-width:72%}
.wsm-branding img{width:min(430px,48vw);height:auto}
.wsm-brand-copy{padding-bottom:8px}
.wsm-brand-copy strong{display:block;font-size:2.1rem;line-height:1;font-weight:900}
.wsm-brand-copy span{display:block;font-size:.84rem;letter-spacing:.12em;text-transform:uppercase;color:#d7edf7;margin-top:7px}
.wsm-brand-meta{text-align:right;background:rgba(255,255,255,.08);backdrop-filter:blur(8px);border:1px solid rgba(255,255,255,.14);padding:16px 18px;border-radius:18px;min-width:220px}
.wsm-brand-temp{font-size:2.3rem;line-height:1;font-weight:900}
.wsm-brand-desc{font-size:.79rem;color:#e1f3fb;margin-top:7px}
.wsm-brand-sub{font-size:.76rem;color:#cae5f1;margin-top:5px}
.wsm-navbar{position:sticky;top:0;z-index:100;background:linear-gradient(90deg,var(--navy2),var(--navy));color:#fff;box-shadow:0 8px 24px rgba(0,0,0,.14)}
.wsm-nav-inner{display:flex;align-items:center;gap:10px;min-height:56px}
.wsm-nav{flex:1}
.wsm-nav ul{display:flex;align-items:center;gap:4px;list-style:none;margin:0;padding:0}
.wsm-nav a{display:block;padding:17px 14px;border-bottom:3px solid transparent;font-size:.88rem;font-weight:760}
.wsm-nav a:hover,.wsm-nav .current-menu-item>a{border-bottom-color:var(--cyan);background:rgba(255,255,255,.05)}
.wsm-actions{display:flex;align-items:center;gap:6px}
.wsm-icon-btn{width:42px;height:42px;border-radius:11px;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);color:#fff;display:grid;place-items:center;cursor:pointer}
.wsm-icon-btn:hover{background:rgba(255,255,255,.11)}
.wsm-menu-btn{display:none}
.wsm-theme-toggle{position:relative}
.wsm-theme-toggle span{position:absolute;transition:opacity .18s ease, transform .18s ease}
html[data-theme="light"] .wsm-theme-sun{opacity:0;transform:scale(.62) rotate(-25deg)}
html[data-theme="light"] .wsm-theme-moon{opacity:1}
html[data-theme="dark"] .wsm-theme-sun{opacity:1}
html[data-theme="dark"] .wsm-theme-moon{opacity:0;transform:scale(.62) rotate(25deg)}

/* Main dashboard */
.wsm-main{padding:24px 0 56px}
.wsm-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(340px,.72fr);gap:20px;margin-bottom:18px}
.wsm-now{position:relative;overflow:hidden;min-height:400px;border-radius:24px;color:#fff;background:radial-gradient(circle at 75% 18%,rgba(65,211,246,.35),transparent 34%),linear-gradient(130deg,#07314e,#0c6793 58%,#19bcc9);box-shadow:var(--shadow)}
.wsm-now:before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(5,25,39,.14),transparent 40%,rgba(5,25,39,.14));pointer-events:none}
.wsm-now-inner{position:relative;z-index:1;height:100%;padding:32px;display:grid;grid-template-columns:1fr 250px;gap:16px;align-items:center}
.wsm-location{font-size:.82rem;text-transform:uppercase;font-weight:850;letter-spacing:.12em;color:#c8f4ff}
.wsm-now-temp{font-size:clamp(5.3rem,10vw,9rem);line-height:.86;font-weight:950;letter-spacing:-.08em;margin:10px 0}
.wsm-now-desc{font-size:1.35rem;font-weight:780}
.wsm-now-sub{display:flex;gap:16px;flex-wrap:wrap;font-size:.87rem;color:#d7f5fb;margin-top:14px}
.wsm-weather-icon{position:relative;height:220px;display:grid;place-items:center}
.wsm-sun-disc{width:120px;height:120px;border-radius:50%;background:radial-gradient(circle,#fff2ab 0 19%,#ffd663 36%,#faa82e 69%,rgba(255,184,57,.18) 72%);box-shadow:0 0 70px rgba(255,204,72,.55)}
.wsm-cloud{position:absolute;width:170px;height:58px;border-radius:40px;background:linear-gradient(#fff,#dfeef6);bottom:42px;right:10px;box-shadow:0 15px 30px rgba(0,35,55,.18)}
.wsm-cloud:before,.wsm-cloud:after{content:"";position:absolute;border-radius:50%;background:inherit}
.wsm-cloud:before{width:72px;height:72px;left:24px;bottom:16px}
.wsm-cloud:after{width:88px;height:88px;right:15px;bottom:10px}
.wsm-summary{display:grid;grid-template-columns:1fr 1fr;gap:14px}
.wsm-summary-card{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:18px;box-shadow:0 8px 28px rgba(14,43,63,.06)}
.wsm-summary-card small{display:block;font-size:.66rem;color:var(--muted);font-weight:850;text-transform:uppercase;letter-spacing:.08em}
.wsm-summary-card strong{display:block;font-size:1.7rem;line-height:1.08;margin-top:7px}
.wsm-summary-card span{font-size:.76rem;color:var(--muted)}

.wsm-section-head{display:flex;align-items:end;justify-content:space-between;gap:20px;margin:28px 0 14px}
.wsm-section-head h2{margin:0;font-size:1.45rem}
.wsm-section-head p{margin:4px 0 0;color:var(--muted);font-size:.84rem}
.wsm-section-link{font-size:.8rem;font-weight:800;color:var(--blue)}

.wsm-data-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.wsm-metric{position:relative;min-height:138px;background:var(--card);border:1px solid var(--line);border-radius:17px;padding:17px;transition:transform .18s ease, box-shadow .18s ease}
.wsm-metric:hover{transform:translateY(-2px);box-shadow:var(--shadow)}
.wsm-metric-top{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}
.wsm-metric-label{font-size:.73rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}
.wsm-metric-icon{font-size:1.14rem}
.wsm-metric-value{font-size:2rem;line-height:1;font-weight:900;margin:14px 0 8px}
.wsm-metric-sub{font-size:.76rem;color:var(--muted)}
.wsm-chart-btn{position:absolute;right:11px;bottom:10px;border:0;border-radius:8px;background:var(--panel);color:var(--blue);padding:7px 9px;font-size:.72rem;font-weight:800;cursor:pointer}
.wsm-chart-btn:hover{background:var(--blue);color:#fff}

.wsm-grid-two{display:grid;grid-template-columns:1fr 1fr;gap:18px}
.wsm-live-panel,.wsm-box{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 10px 35px rgba(10,40,60,.06)}
.wsm-live-panel-head,.wsm-box-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:15px 17px;border-bottom:1px solid var(--line)}
.wsm-live-panel-head h3,.wsm-box-head h3{margin:0;font-size:1rem}
.wsm-live-panel-head span,.wsm-box-head span{font-size:.72rem;color:var(--muted)}
.wsm-frame-preview{height:330px;position:relative;background:#07111b;cursor:pointer;overflow:hidden}
.wsm-frame-preview iframe{width:150%;height:150%;transform:scale(.667);transform-origin:0 0;border:0;pointer-events:none}
.wsm-frame-cover{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:15px;background:linear-gradient(180deg,transparent 72%,rgba(0,0,0,.45))}
.wsm-enlarge{background:rgba(4,25,38,.86);border:1px solid rgba(255,255,255,.25);color:#fff;padding:8px 11px;border-radius:9px;font-size:.75rem;font-weight:800}
.wsm-station-body{padding:18px;display:grid;grid-template-columns:128px 1fr;gap:16px;align-items:start}
.wsm-station-body img{width:128px;height:128px;object-fit:cover;border-radius:14px}
.wsm-station-body p{margin:0;color:var(--muted);font-size:.88rem}
.wsm-badges{display:flex;gap:8px;flex-wrap:wrap;margin-top:12px}
.wsm-badge{padding:6px 9px;background:var(--panel);border:1px solid var(--line);border-radius:999px;font-size:.72rem;font-weight:800}

.wsm-page-card{background:var(--card);border:1px solid var(--line);border-radius:20px;padding:26px;box-shadow:0 10px 35px rgba(10,40,60,.06)}
.wsm-page-card h1{margin-top:0}
.wsm-page-card h2,.wsm-page-card h3{color:var(--ink)}
.wsm-page-card p,.wsm-page-card li{color:var(--muted)}

.wsm-all-data{background:var(--card);border:1px solid var(--line);border-radius:18px;padding:19px;margin-top:18px}
.wsm-all-data summary{cursor:pointer;font-weight:850}
.wsm-raw-search{margin:15px 0 10px;width:100%;padding:11px 13px;border-radius:10px;border:1px solid var(--line);background:var(--panel);color:var(--ink)}
.wsm-raw-table-wrap{max-height:430px;overflow:auto;border:1px solid var(--line);border-radius:10px}
.wsm-raw-table{width:100%;border-collapse:collapse;font-size:.78rem}
.wsm-raw-table th,.wsm-raw-table td{padding:9px 11px;border-bottom:1px solid var(--line);text-align:left}
.wsm-raw-table th{position:sticky;top:0;z-index:2;background:var(--panel)}

/* modals */
.wsm-modal{position:fixed;inset:0;z-index:200;display:none;align-items:center;justify-content:center;padding:18px;background:rgba(0,8,15,.78);backdrop-filter:blur(8px)}
.wsm-modal.is-open{display:flex}
.wsm-modal-card{width:min(1500px,97vw);height:min(900px,93vh);display:flex;flex-direction:column;background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 25px 100px rgba(0,0,0,.5)}
.wsm-modal-head{height:58px;display:flex;align-items:center;justify-content:space-between;padding:0 17px;border-bottom:1px solid var(--line)}
.wsm-modal-head h3{margin:0}
.wsm-modal-close{border:0;background:var(--panel);color:var(--ink);width:38px;height:38px;border-radius:9px;font-size:1.35rem;cursor:pointer}
.wsm-modal-body{flex:1;min-height:0}
.wsm-modal-body iframe{width:100%;height:100%;border:0;background:#07111b}
.wsm-chart-card{width:min(1100px,96vw);height:auto;max-height:92vh}
.wsm-chart-body{padding:20px;overflow:auto}
.wsm-periods{display:flex;gap:7px;flex-wrap:wrap;margin-bottom:14px}
.wsm-period-btn{padding:8px 11px;border-radius:9px;border:1px solid var(--line);background:var(--panel);color:var(--ink);font-size:.75rem;font-weight:800;cursor:pointer}
.wsm-period-btn.is-active{background:var(--blue);border-color:var(--blue);color:#fff}
.wsm-chart-shell{height:410px;padding:10px;position:relative;border-radius:14px;border:1px solid var(--line);background:var(--panel)}
.wsm-chart-shell svg{width:100%;height:100%;overflow:visible}
.wsm-chart-empty{height:100%;display:grid;place-items:center;text-align:center;color:var(--muted);padding:25px}
.wsm-chart-stats{display:flex;gap:10px;flex-wrap:wrap;margin-top:12px}
.wsm-chart-stat{padding:9px 12px;border-radius:9px;background:var(--panel);border:1px solid var(--line);font-size:.76rem}

/* Footer */
.wsm-footer{margin-top:36px;background:var(--navy2);color:#c8dce7;padding:38px 0 24px}
.wsm-footer-grid{display:grid;grid-template-columns:1.5fr 1fr 1fr;gap:36px}
.wsm-footer-logo{width:330px;max-width:100%;filter:brightness(0) invert(1)}
.wsm-footer h3{color:#fff;font-size:.82rem;text-transform:uppercase;letter-spacing:.08em;margin-top:0}
.wsm-footer p,.wsm-footer li{font-size:.8rem}
.wsm-footer ul{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.wsm-footer-bottom{margin-top:28px;padding-top:16px;border-top:1px solid rgba(255,255,255,.08);display:flex;justify-content:space-between;gap:18px;flex-wrap:wrap;font-size:.78rem;color:#a8c2d0}

/* Responsive */
@media(max-width:1100px){
  .wsm-hero{grid-template-columns:1fr}
  .wsm-summary{grid-template-columns:repeat(4,1fr)}
  .wsm-data-grid{grid-template-columns:repeat(3,1fr)}
}
@media(max-width:860px){
  .wsm-wrap{width:min(var(--max),calc(100% - 24px))}
  .wsm-topbar-right{display:none}
  .wsm-brand-inner{min-height:145px;align-items:flex-start;padding:22px 0}
  .wsm-branding{max-width:100%}
  .wsm-branding img{width:310px;max-width:70vw}
  .wsm-brand-copy{display:none}
  .wsm-brand-meta{display:none}
  .wsm-menu-btn{display:grid}
  .wsm-nav{display:none;position:absolute;left:0;right:0;top:56px;background:var(--navy2);box-shadow:0 20px 45px rgba(0,0,0,.35)}
  .wsm-nav.is-open{display:block}
  .wsm-nav ul{display:block}
  .wsm-nav a{padding:13px 20px}
  .wsm-summary{grid-template-columns:1fr 1fr}
  .wsm-now-inner{grid-template-columns:1fr 180px;padding:26px}
  .wsm-weather-icon{height:170px}
  .wsm-sun-disc{width:92px;height:92px}
  .wsm-cloud{width:126px;height:42px}
  .wsm-data-grid{grid-template-columns:1fr 1fr}
  .wsm-grid-two,.wsm-footer-grid{grid-template-columns:1fr}
}
@media(max-width:560px){
  .wsm-topbar-inner{justify-content:center}
  .wsm-topbar-left span:nth-child(2){display:none}
  .wsm-brandbar{background-position:center top}
  .wsm-branding img{width:290px;max-width:82vw}
  .wsm-main{padding-top:14px}
  .wsm-now{min-height:360px;border-radius:18px}
  .wsm-now-inner{display:block;padding:24px}
  .wsm-now-temp{font-size:5.9rem}
  .wsm-weather-icon{position:absolute;right:12px;top:48px;width:146px;height:132px;opacity:.95}
  .wsm-sun-disc{width:74px;height:74px}
  .wsm-cloud{width:108px;height:40px;bottom:16px}
  .wsm-summary{gap:9px}
  .wsm-summary-card{padding:14px}
  .wsm-summary-card strong{font-size:1.34rem}
  .wsm-data-grid{grid-template-columns:1fr;gap:9px}
  .wsm-grid-two{gap:12px}
  .wsm-frame-preview{height:246px}
  .wsm-station-body{grid-template-columns:1fr}
  .wsm-station-body img{width:100%;height:190px}
  .wsm-modal{padding:6px}
  .wsm-modal-card{width:100vw;height:96vh;border-radius:12px}
  .wsm-chart-shell{height:320px}
  .wsm-footer-bottom{display:block}
  .wsm-footer-bottom span{display:block;margin-top:4px}
}

/* v1.3.0 */

.wsm-radar-single{max-width:100%;}


/* Weather Underground historie */
.wsm-history-link{display:inline-flex;align-items:center;height:38px;padding:0 13px;border-radius:10px;background:rgba(35,200,239,.13);border:1px solid rgba(70,217,247,.30);font-size:.78rem;font-weight:850;letter-spacing:.02em;color:#e9faff;white-space:nowrap}
.wsm-history-link:hover{background:rgba(35,200,239,.24)}
.wsm-history-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(290px,.6fr);gap:18px;margin-bottom:20px}
.wsm-history-intro{position:relative;overflow:hidden;border-radius:22px;padding:28px 30px;color:#fff;background:linear-gradient(125deg,#07314e,#0d6f9c 58%,#18b8c7);box-shadow:var(--shadow)}
.wsm-history-intro:after{content:"";position:absolute;right:-55px;top:-90px;width:270px;height:270px;border-radius:50%;background:rgba(255,255,255,.08)}
.wsm-history-intro>*{position:relative;z-index:1}.wsm-history-intro h1{margin:0 0 9px;font-size:clamp(2rem,4vw,3.2rem);line-height:1.02}.wsm-history-intro p{max-width:800px;margin:0;color:#dcf5fb}
.wsm-history-status{background:var(--card);border:1px solid var(--line);border-radius:22px;padding:22px;display:flex;flex-direction:column;justify-content:center}.wsm-history-status small{font-size:.67rem;font-weight:850;letter-spacing:.08em;text-transform:uppercase;color:var(--muted)}.wsm-history-status strong{font-size:1.25rem;margin-top:6px}.wsm-history-status span{font-size:.78rem;color:var(--muted);margin-top:8px}
.wsm-history-shell{background:var(--card);border:1px solid var(--line);border-radius:22px;box-shadow:0 12px 40px rgba(10,40,60,.07);overflow:hidden}
.wsm-history-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex-wrap:wrap;padding:16px 18px;border-bottom:1px solid var(--line);background:var(--panel)}
.wsm-history-ranges,.wsm-history-tabs{display:flex;gap:7px;flex-wrap:wrap}
.wsm-history-range,.wsm-history-tab{border:1px solid var(--line);background:var(--card);color:var(--ink);border-radius:9px;padding:8px 11px;font-size:.76rem;font-weight:820;cursor:pointer;transition:.15s}
.wsm-history-range:hover,.wsm-history-tab:hover{border-color:var(--blue)}
.wsm-history-range.is-active,.wsm-history-tab.is-active{background:var(--blue);border-color:var(--blue);color:#fff}
.wsm-history-tabs{padding:14px 18px;border-bottom:1px solid var(--line)}
.wsm-history-chart-area{padding:20px}
.wsm-history-chart-title{display:flex;align-items:flex-end;justify-content:space-between;gap:18px;margin-bottom:14px}.wsm-history-chart-title h2{margin:0;font-size:1.25rem}.wsm-history-chart-title p{margin:4px 0 0;font-size:.78rem;color:var(--muted)}
.wsm-history-chart{height:470px;border:1px solid var(--line);border-radius:16px;background:var(--panel);position:relative;padding:12px;overflow:hidden}.wsm-history-chart svg{width:100%;height:100%;overflow:visible}.wsm-history-loading{height:100%;display:grid;place-items:center;color:var(--muted);text-align:center;padding:25px}.wsm-history-error{color:var(--red)}
.wsm-history-legend{display:flex;gap:9px;flex-wrap:wrap;margin:0 0 12px}.wsm-history-legend button{display:inline-flex;align-items:center;gap:7px;border:1px solid var(--line);background:var(--card);color:var(--ink);padding:7px 9px;border-radius:9px;font-size:.73rem;font-weight:800;cursor:pointer}.wsm-history-legend button.is-off{opacity:.42}.wsm-history-dot{width:9px;height:9px;border-radius:50%;background:var(--legend-color)}
.wsm-history-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:14px}.wsm-history-stat{border:1px solid var(--line);background:var(--panel);border-radius:12px;padding:11px 13px}.wsm-history-stat small{display:block;font-size:.64rem;font-weight:850;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}.wsm-history-stat strong{display:block;font-size:1.15rem;margin-top:4px}
.wsm-history-note{margin-top:14px;font-size:.75rem;color:var(--muted)}
.wsm-history-tooltip{position:absolute;display:none;min-width:180px;padding:10px 12px;border-radius:10px;background:rgba(3,20,32,.94);color:#fff;box-shadow:0 12px 35px rgba(0,0,0,.25);font-size:.72rem;pointer-events:none;z-index:5}.wsm-history-tooltip strong{display:block;margin-bottom:5px}.wsm-history-tooltip span{display:block;color:#d7edf7;margin-top:2px}
.wsm-history-actions{display:flex;gap:8px;flex-wrap:wrap}.wsm-history-action{border:1px solid var(--line);background:var(--card);color:var(--blue);padding:8px 11px;border-radius:9px;font-size:.75rem;font-weight:800;cursor:pointer}
@media(max-width:860px){.wsm-history-hero{grid-template-columns:1fr}.wsm-history-stats{grid-template-columns:1fr 1fr}.wsm-history-chart{height:400px}}
@media(max-width:560px){.wsm-history-chart-area{padding:13px}.wsm-history-chart{height:330px}.wsm-history-stats{grid-template-columns:1fr 1fr}.wsm-history-toolbar,.wsm-history-tabs{padding:11px}.wsm-history-intro{padding:22px}.wsm-history-chart-title{display:block}.wsm-history-actions{margin-top:10px}}


/* Performance: radar previews are loaded only when they approach the viewport. */
.wsm-frame-preview iframe[data-src]:not([data-loaded="1"]){opacity:0}
.wsm-frame-preview:has(iframe[data-src]:not([data-loaded="1"])):before{
  content:"Live kaart wordt geladen zodra deze in beeld komt";
  position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;
  color:#b9ced9;background:radial-gradient(circle at 50% 30%,#123954,#07111b 72%);
  font-size:.8rem;font-weight:750;z-index:0
}
.wsm-frame-preview iframe{transition:opacity .2s ease}

/* 15-daagse verwachting – tabdashboard */
.wsm-forecast-section{margin-top:32px}
.wsm-forecast-location{display:inline-flex;margin-bottom:5px;color:var(--blue);font-size:.72rem;font-weight:850;text-transform:uppercase;letter-spacing:.075em}
.wsm-forecast-updated{font-size:.72rem;color:var(--muted);white-space:nowrap}
.wsm-forecast-dashboard{background:var(--card);border:1px solid var(--line);border-radius:22px;overflow:hidden;box-shadow:0 14px 42px rgba(10,40,60,.08)}
.wsm-forecast-tabs{display:grid;grid-template-columns:repeat(6,1fr);background:linear-gradient(180deg,var(--panel),var(--card));border-bottom:1px solid var(--line)}
.wsm-forecast-tab{position:relative;border:0;border-right:1px solid var(--line);background:transparent;color:var(--ink);padding:15px 12px 14px;text-align:left;cursor:pointer;transition:background .18s ease,color .18s ease}
.wsm-forecast-tab:last-child{border-right:0}
.wsm-forecast-tab span{display:block;color:var(--muted);font-size:.64rem;font-weight:800;text-transform:uppercase;letter-spacing:.06em}
.wsm-forecast-tab strong{display:block;margin-top:3px;font-size:.83rem}
.wsm-forecast-tab:after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:transparent}
.wsm-forecast-tab:hover{background:rgba(17,149,217,.06)}
.wsm-forecast-tab.is-active{background:var(--card);color:var(--blue)}
.wsm-forecast-tab.is-active:after{background:var(--blue)}
.wsm-forecast-panel{padding:22px}
.wsm-forecast-panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:24px;margin-bottom:14px}
.wsm-forecast-kicker{display:block;color:var(--blue);font-size:.65rem;font-weight:900;text-transform:uppercase;letter-spacing:.09em}
.wsm-forecast-panel-head h3{margin:4px 0 2px;font-size:1.25rem}
.wsm-forecast-panel-head p{margin:0;color:var(--muted);font-size:.79rem}
.wsm-forecast-current-stat{min-width:150px;text-align:right;padding:10px 12px;border-radius:13px;background:var(--panel);border:1px solid var(--line)}
.wsm-forecast-current-stat small{display:block;color:var(--muted);font-size:.62rem;font-weight:800;text-transform:uppercase}
.wsm-forecast-current-stat strong{display:block;margin-top:3px;font-size:1.55rem;line-height:1;color:var(--ink)}
.wsm-forecast-chart{height:355px;border:1px solid var(--line);border-radius:16px;background:linear-gradient(180deg,var(--panel),var(--card));padding:6px 8px;overflow:hidden}
.wsm-forecast-chart svg{width:100%;height:100%;display:block}
.wsm-forecast-loading{height:100%;min-height:230px;display:grid;place-items:center;color:var(--muted);font-size:.82rem}
.wsm-forecast-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;margin-top:12px}
.wsm-forecast-stats>div{padding:11px 13px;border-radius:12px;background:var(--panel);border:1px solid var(--line)}
.wsm-forecast-stats small{display:block;color:var(--muted);font-size:.61rem;font-weight:800;text-transform:uppercase;letter-spacing:.04em}
.wsm-forecast-stats strong{display:block;margin-top:3px;font-size:1rem}
.wsm-forecast-days{display:grid;grid-template-columns:repeat(15,minmax(92px,1fr));gap:8px;margin-top:14px;overflow-x:auto;padding:1px 1px 7px;scrollbar-width:thin}
.wsm-forecast-day{min-width:92px;padding:10px;border-radius:13px;background:var(--panel);border:1px solid var(--line)}
.wsm-forecast-day-top{display:flex;align-items:flex-start;justify-content:space-between;gap:5px}
.wsm-forecast-day-top strong{display:block;font-size:.72rem}
.wsm-forecast-day-top span:not(.wsm-forecast-day-icon){display:block;color:var(--muted);font-size:.58rem}
.wsm-forecast-day-icon{font-size:1.05rem;line-height:1}
.wsm-forecast-day>b{display:block;margin:11px 0 5px;font-size:1.02rem}
.wsm-forecast-day>small{display:block;height:29px;overflow:hidden;color:var(--muted);font-size:.58rem;line-height:1.3}
.wsm-forecast-day>em{display:block;margin-top:5px;color:var(--muted);font-size:.58rem;font-style:normal;font-weight:800}
@media(max-width:1050px){
  .wsm-forecast-tabs{grid-template-columns:repeat(3,1fr)}
  .wsm-forecast-tab:nth-child(3){border-right:0}
  .wsm-forecast-tab:nth-child(-n+3){border-bottom:1px solid var(--line)}
}
@media(max-width:700px){
  .wsm-forecast-tabs{display:flex;overflow-x:auto}
  .wsm-forecast-tab{min-width:145px;border-bottom:0!important}
  .wsm-forecast-panel{padding:14px}
  .wsm-forecast-panel-head{align-items:stretch;flex-direction:column;gap:10px}
  .wsm-forecast-current-stat{text-align:left;min-width:0}
  .wsm-forecast-chart{height:315px;overflow-x:auto}
  .wsm-forecast-chart svg{min-width:860px}
  .wsm-forecast-stats{grid-template-columns:repeat(2,1fr)}
  .wsm-forecast-updated{display:none}
}


/* Radar en onweerdetectie met beeld, zonder dubbele websiteheader */
.wsm-radar-card{overflow:hidden}
.wsm-radar-preview{
  position:relative;
  display:block;
  width:100%;
  height:330px;
  padding:0;
  border:0;
  background:#06131d;
  overflow:hidden;
  cursor:pointer;
  text-align:left;
}
.wsm-radar-image{
  width:100%;
  height:100%;
  object-fit:cover;
  object-position:center;
  transform:scale(1.01);
  transition:transform .28s ease,filter .28s ease;
}
.wsm-radar-preview:hover .wsm-radar-image{transform:scale(1.035)}
.wsm-radar-shade{
  position:absolute;
  inset:0;
  background:linear-gradient(180deg,transparent 48%,rgba(3,18,29,.78) 100%);
  pointer-events:none;
}
.wsm-radar-label{
  position:absolute;
  left:18px;
  bottom:17px;
  z-index:3;
  color:#fff;
  text-shadow:0 2px 10px rgba(0,0,0,.55)
}
.wsm-radar-label strong{display:block;font-size:1rem}
.wsm-radar-label small{display:block;margin-top:3px;font-size:.72rem;color:#d8edf7}
.wsm-radar-open{
  position:absolute;
  right:16px;
  bottom:16px;
  z-index:4;
  padding:8px 10px;
  border-radius:9px;
  background:rgba(3,28,43,.84);
  border:1px solid rgba(255,255,255,.22);
  color:#fff;
  font-size:.7rem;
  font-weight:850;
  backdrop-filter:blur(5px)
}
.wsm-lightning-preview .wsm-radar-image{
  filter:saturate(.75) brightness(.56) contrast(1.18) hue-rotate(12deg)
}
.wsm-lightning-tint{
  position:absolute;
  inset:0;
  z-index:1;
  background:
    radial-gradient(circle at 72% 32%,rgba(147,94,255,.30),transparent 24%),
    radial-gradient(circle at 38% 58%,rgba(30,195,255,.18),transparent 26%),
    linear-gradient(180deg,rgba(4,13,28,.10),rgba(4,9,23,.50));
  pointer-events:none
}
.wsm-lightning-bolts{position:absolute;inset:0;z-index:2;pointer-events:none}
.wsm-lightning-bolts i{
  position:absolute;
  color:#ffe45d;
  font-style:normal;
  font-size:2.15rem;
  filter:drop-shadow(0 0 9px rgba(255,225,79,.9));
  opacity:.92
}
.wsm-lightning-bolts i:nth-child(1){left:28%;top:30%;transform:rotate(-10deg)}
.wsm-lightning-bolts i:nth-child(2){left:61%;top:43%;transform:rotate(8deg) scale(.86)}
.wsm-lightning-bolts i:nth-child(3){left:75%;top:20%;transform:rotate(-4deg) scale(.72)}
.wsm-lightning-preview:after{
  content:"";
  position:absolute;
  inset:0;
  z-index:2;
  background:linear-gradient(180deg,transparent 48%,rgba(3,10,23,.83) 100%);
  pointer-events:none
}
.wsm-radar-credit{
  margin:7px 3px 0;
  text-align:right;
  color:var(--muted);
  font-size:.62rem
}
.wsm-radar-credit a{color:var(--blue);font-weight:800}
@media(max-width:700px){
  .wsm-radar-preview{height:270px}
  .wsm-radar-label small{max-width:190px}
}

/* Popupfix radar/onweer */
.wsm-modal-body{background:#07111b}.wsm-modal-body iframe{display:block;width:100%;height:100%;border:0;background:#07111b}


/* v1.6.0 – radar popups + tablet/mobile */
html,body{max-width:100%;overflow-x:hidden}
.wsm-nav-inner{position:relative}
.wsm-radar-preview:focus-visible,.wsm-forecast-tab:focus-visible,.wsm-icon-btn:focus-visible,.wsm-history-link:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}

/* Echte Blitzortung-preview rond Medemblik */
.wsm-lightning-preview{background:#07111b}
.wsm-lightning-map-preview{position:absolute;inset:0;width:100%;height:100%;border:0;pointer-events:none;background:#07111b}
.wsm-lightning-preview-shade{position:absolute;inset:0;z-index:2;background:linear-gradient(180deg,rgba(2,10,18,.03) 48%,rgba(2,10,18,.82) 100%);pointer-events:none}
.wsm-lightning-preview .wsm-radar-label,.wsm-lightning-preview .wsm-radar-open{z-index:3}

/* Popup: Buienradar als passende afbeelding, onweerradar als interactieve kaart */
.wsm-modal-body iframe[hidden],.wsm-radar-modal-image-wrap[hidden]{display:none!important}
.wsm-modal-card.is-radar{width:min(790px,96vw);height:min(890px,94vh)}
.wsm-modal-card.is-lightning{width:min(1480px,97vw);height:min(900px,93vh)}
.wsm-radar-modal-image-wrap{flex:1;min-height:0;width:100%;height:100%;display:flex;align-items:center;justify-content:center;padding:14px;background:#07111b}
.wsm-radar-modal-image-wrap img{display:block;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;border-radius:8px}
.wsm-modal-card.is-lightning .wsm-modal-body iframe{display:block;width:100%;height:100%;border:0}

/* Tablet */
@media(max-width:1024px){
  .wsm-wrap{width:min(var(--max),calc(100% - 28px))}
  .wsm-brand-inner{min-height:165px;padding:20px 0}
  .wsm-branding img{width:min(360px,45vw)}
  .wsm-brand-copy strong{font-size:1.7rem}
  .wsm-brand-copy span{font-size:.73rem}
  .wsm-brand-meta{min-width:195px;padding:13px 15px}
  .wsm-brand-temp{font-size:2rem}
  .wsm-nav a{padding-left:10px;padding-right:10px;font-size:.8rem}
  .wsm-hero{grid-template-columns:1fr}
  .wsm-summary{grid-template-columns:repeat(4,1fr)}
  .wsm-data-grid{grid-template-columns:repeat(2,1fr)}
  .wsm-grid-two{grid-template-columns:1fr 1fr}
  .wsm-radar-preview{height:300px}
  .wsm-station-body{grid-template-columns:110px 1fr}
  .wsm-station-body img{width:110px;height:110px}
}

/* Kleine tablet / grote telefoon */
@media(max-width:860px){
  .wsm-wrap{width:calc(100% - 24px)}
  .wsm-topbar-inner{min-height:34px}
  .wsm-topbar-right{display:none}
  .wsm-brand-inner{min-height:135px;align-items:center;padding:18px 0}
  .wsm-branding{max-width:100%;width:100%}
  .wsm-branding img{width:min(320px,72vw)}
  .wsm-brand-copy,.wsm-brand-meta{display:none}
  .wsm-menu-btn{display:grid;flex:0 0 auto}
  .wsm-nav-inner{min-height:54px}
  .wsm-nav{display:none;position:absolute;z-index:120;left:0;right:0;top:54px;max-height:calc(100vh - 80px);overflow-y:auto;background:var(--navy2);border-top:1px solid rgba(255,255,255,.08);box-shadow:0 20px 45px rgba(0,0,0,.4)}
  .wsm-nav.is-open{display:block}
  .wsm-nav ul{display:block}
  .wsm-nav a{padding:14px 18px;border-bottom:1px solid rgba(255,255,255,.07);font-size:.86rem}
  .wsm-actions{margin-left:auto}
  .wsm-summary{grid-template-columns:1fr 1fr}
  .wsm-now-inner{grid-template-columns:minmax(0,1fr) 170px;padding:24px}
  .wsm-data-grid{grid-template-columns:1fr 1fr}
  .wsm-grid-two,.wsm-footer-grid{grid-template-columns:1fr}
  .wsm-radar-preview{height:330px}
  .wsm-section-head{align-items:flex-start;flex-wrap:wrap}
  .wsm-section-head>div{min-width:0}
  .wsm-history-hero{grid-template-columns:1fr}
  .wsm-history-ranges,.wsm-history-tabs{flex-wrap:nowrap;overflow-x:auto;padding-bottom:4px;scrollbar-width:thin}
  .wsm-history-range,.wsm-history-tab{flex:0 0 auto}
  .wsm-history-chart{height:390px;overflow:hidden}
  .wsm-history-chart svg{min-width:0;max-width:100%;width:100%;height:100%}
  .wsm-modal-card.is-radar{width:min(760px,96vw);height:min(860px,94vh)}
  .wsm-modal-card.is-lightning{width:97vw;height:92vh}
}

/* Telefoon */
@media(max-width:560px){
  .wsm-wrap{width:calc(100% - 18px)}
  .wsm-topbar-inner{justify-content:center}
  .wsm-topbar-left span:nth-child(2){display:none}
  .wsm-brandbar{background-position:center top}
  .wsm-brand-inner{min-height:112px;padding:14px 0}
  .wsm-branding img{width:min(285px,82vw)}
  .wsm-history-link{height:36px;padding:0 10px;font-size:.7rem}
  .wsm-icon-btn{width:38px;height:38px}
  .wsm-main{padding:12px 0 42px}
  .wsm-hero{gap:12px}
  .wsm-now{min-height:330px;border-radius:17px}
  .wsm-now-inner{display:block;padding:20px}
  .wsm-now-temp{font-size:clamp(4.6rem,22vw,5.6rem)}
  .wsm-now-desc{font-size:1.12rem;max-width:62%}
  .wsm-now-sub{font-size:.76rem;gap:9px;max-width:65%}
  .wsm-weather-icon{position:absolute;right:6px;top:48px;width:128px;height:120px}
  .wsm-sun-disc{width:68px;height:68px}
  .wsm-cloud{width:96px;height:36px;right:2px;bottom:18px}
  .wsm-summary{grid-template-columns:1fr 1fr;gap:8px}
  .wsm-summary-card{padding:13px}
  .wsm-summary-card strong{font-size:1.28rem}
  .wsm-section-head{margin:22px 0 11px}
  .wsm-section-head h2{font-size:1.22rem}
  .wsm-section-head p{font-size:.76rem}
  .wsm-data-grid{grid-template-columns:1fr;gap:8px}
  .wsm-metric{min-height:126px}
  .wsm-radar-preview{height:255px}
  .wsm-radar-label{left:13px;bottom:13px;max-width:65%}
  .wsm-radar-label strong{font-size:.88rem}
  .wsm-radar-label small{font-size:.65rem}
  .wsm-radar-open{right:11px;bottom:11px;padding:7px 8px;font-size:.64rem}
  .wsm-station-body{grid-template-columns:1fr;padding:14px}
  .wsm-station-body img{width:100%;height:175px}
  .wsm-page-card{padding:18px}
  .wsm-modal{padding:0}
  .wsm-modal-card,.wsm-modal-card.is-radar,.wsm-modal-card.is-lightning{width:100vw;height:100dvh;max-height:none;border-radius:0;border:0}
  .wsm-modal-head{height:54px;flex:0 0 54px;padding:0 12px}
  .wsm-modal-head h3{font-size:.92rem}
  .wsm-radar-modal-image-wrap{padding:8px}
  .wsm-history-intro{padding:18px}
  .wsm-history-chart-area{padding:10px}
  .wsm-history-chart{height:315px;overflow:hidden}
  .wsm-history-chart svg{min-width:0;max-width:100%;width:100%;height:100%}
  .wsm-history-stats{grid-template-columns:1fr 1fr;gap:7px}
  .wsm-footer-bottom{display:block}
  .wsm-footer-bottom span{display:block;margin-top:4px}
}

/* Zeer smalle telefoon */
@media(max-width:390px){
  .wsm-history-link{display:none}
  .wsm-now-desc,.wsm-now-sub{max-width:58%}
  .wsm-weather-icon{right:0;transform:scale(.9);transform-origin:right top}
  .wsm-summary-card strong{font-size:1.15rem}
  .wsm-topbar{font-size:.7rem}
}


/* v1.6.1 – oorspronkelijke radarframe-opzet terug */
.wsm-weather-modal-card{width:min(1500px,97vw);height:min(900px,93vh)}
.wsm-weather-modal-card .wsm-modal-body{padding:0;background:#07111b}
.wsm-weather-modal-card .wsm-modal-body iframe{display:block;width:100%;height:100%;border:0;background:#07111b}
.wsm-frame-preview{height:330px;position:relative;background:#07111b;cursor:pointer;overflow:hidden}
.wsm-frame-preview iframe{display:block;width:150%;height:150%;transform:scale(.667);transform-origin:0 0;border:0;pointer-events:none;background:#07111b}
.wsm-frame-cover{position:absolute;inset:0;display:flex;align-items:flex-end;justify-content:flex-end;padding:15px;background:linear-gradient(180deg,transparent 74%,rgba(0,0,0,.45))}
.wsm-enlarge{background:rgba(4,25,38,.88);border:1px solid rgba(255,255,255,.25);color:#fff;padding:8px 11px;border-radius:9px;font-size:.75rem;font-weight:850;backdrop-filter:blur(4px)}
.wsm-frame-preview:focus-visible{outline:3px solid var(--cyan);outline-offset:3px}

@media(max-width:1024px){
  .wsm-frame-preview{height:300px}
  .wsm-weather-modal-card{width:96vw;height:91vh}
}
@media(max-width:860px){
  .wsm-frame-preview{height:320px}
  .wsm-frame-preview iframe{width:135%;height:135%;transform:scale(.741)}
  .wsm-weather-modal-card{width:97vw;height:92vh}
}
@media(max-width:560px){
  .wsm-frame-preview{height:250px}
  .wsm-frame-preview iframe{width:125%;height:125%;transform:scale(.8)}
  .wsm-frame-cover{padding:10px}
  .wsm-enlarge{padding:7px 9px;font-size:.67rem}
  .wsm-weather-modal-card{width:100vw;height:100dvh;max-height:none;border-radius:0;border:0}
}


/* v1.6.2 – mobiele stabiliteit */
.wsm-frame-preview iframe[src="about:blank"]{background:
  radial-gradient(circle at 50% 44%,rgba(35,200,239,.12),transparent 30%),
  linear-gradient(135deg,#07111b,#0c2231)}
@media(max-width:860px){
  .wsm-navbar{contain:layout paint}
  .wsm-nav{overscroll-behavior:contain;-webkit-overflow-scrolling:touch}
  .wsm-frame-preview{contain:layout paint}
  .wsm-frame-preview iframe{will-change:auto}
}
@media(max-width:560px){
  body{min-width:0}
  .wsm-wrap,.wsm-main,.wsm-hero,.wsm-now,.wsm-summary,.wsm-data-grid,.wsm-grid-two,.wsm-forecast-section,.wsm-history-shell{min-width:0}
  .wsm-frame-preview{height:238px}
  .wsm-frame-preview iframe{width:100%;height:100%;transform:none}
  .wsm-weather-modal-card .wsm-modal-body iframe{width:100%;height:100%;transform:none}
}


/* v1.7.0 – weerkaarten & pluimen */
.wsm-radar-more{display:flex;align-items:center;justify-content:space-between;gap:14px;margin:12px 0 4px;padding:12px 14px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}
.wsm-radar-more span{color:var(--muted);font-size:.75rem}
.wsm-primary-link{display:inline-flex;align-items:center;justify-content:center;border-radius:10px;background:var(--blue);color:#fff;padding:10px 13px;font-size:.78rem;font-weight:850}
.wsm-primary-link:hover{filter:brightness(1.08)}

.wsm-model-page{--plume-member:#4aaad4;--plume-mean:#f0a928}
.wsm-model-hero{display:grid;grid-template-columns:minmax(0,1.55fr) minmax(260px,.5fr);gap:18px;margin-bottom:18px}
.wsm-model-hero>div{padding:30px;border-radius:22px;color:#fff;background:linear-gradient(125deg,#071d2c,#0c5476 55%,#1697ab);box-shadow:var(--shadow)}
.wsm-model-eyebrow{font-size:.68rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:#bfeeff}
.wsm-model-hero h1{margin:7px 0 8px;font-size:clamp(2.1rem,4vw,3.35rem);line-height:1}
.wsm-model-hero p{max-width:850px;margin:0;color:#ddf3fb;line-height:1.55}
.wsm-model-hero aside{display:flex;flex-direction:column;justify-content:center;padding:23px;border-radius:22px;background:var(--card);border:1px solid var(--line)}
.wsm-model-hero aside small{font-size:.65rem;font-weight:850;text-transform:uppercase;letter-spacing:.07em;color:var(--muted)}
.wsm-model-hero aside strong{margin-top:6px;font-size:1.35rem}.wsm-model-hero aside span{margin-top:5px;color:var(--muted);font-size:.8rem}

.wsm-model-main-tabs{display:grid;grid-template-columns:repeat(4,1fr);border:1px solid var(--line);border-radius:17px;overflow:hidden;background:var(--card);margin-bottom:14px}
.wsm-model-main-tabs button{position:relative;border:0;border-right:1px solid var(--line);background:var(--card);color:var(--ink);padding:14px 15px;text-align:left;cursor:pointer}
.wsm-model-main-tabs button:last-child{border-right:0}
.wsm-model-main-tabs button span{display:block;font-size:.61rem;text-transform:uppercase;letter-spacing:.06em;color:var(--muted);font-weight:800}
.wsm-model-main-tabs button strong{display:block;margin-top:3px;font-size:.95rem}
.wsm-model-main-tabs button.is-active{background:var(--panel);color:var(--blue)}
.wsm-model-main-tabs button.is-active:after{content:"";position:absolute;left:14px;right:14px;bottom:0;height:3px;background:var(--blue);border-radius:3px 3px 0 0}

.wsm-model-panel{background:var(--card);border:1px solid var(--line);border-radius:20px;overflow:hidden;box-shadow:0 12px 38px rgba(7,35,51,.07)}
.wsm-model-panel[hidden]{display:none!important}
.wsm-model-panel-head{display:flex;align-items:center;justify-content:space-between;gap:20px;padding:19px 20px;border-bottom:1px solid var(--line)}
.wsm-model-panel-head span{display:block;color:var(--blue);font-size:.64rem;font-weight:900;text-transform:uppercase;letter-spacing:.075em}
.wsm-model-panel-head h2{margin:3px 0 2px;font-size:1.28rem}
.wsm-model-panel-head p{margin:0;color:var(--muted);font-size:.76rem}
.wsm-model-panel-head>b{display:grid;place-items:center;min-width:82px;height:48px;border-radius:12px;background:var(--navy);color:#fff;font-size:.9rem;letter-spacing:.05em}

.wsm-layer-tabs,.wsm-plume-tabs{display:flex;gap:7px;padding:12px 16px;border-bottom:1px solid var(--line);background:var(--panel);overflow-x:auto}
.wsm-layer-tabs button,.wsm-plume-tabs button{flex:0 0 auto;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--ink);padding:8px 12px;font-size:.75rem;font-weight:820;cursor:pointer}
.wsm-layer-tabs button.is-active,.wsm-plume-tabs button.is-active{background:var(--blue);border-color:var(--blue);color:#fff}

.wsm-model-map{height:650px;background:#07111b}
.wsm-model-map iframe{display:block;width:100%;height:100%;border:0;background:#07111b}
.wsm-model-source{margin:0;padding:10px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:.67rem}

.wsm-plume-card{padding:16px}
.wsm-plume-head{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:10px}
.wsm-plume-head strong{font-size:.9rem}.wsm-plume-head span{color:var(--muted);font-size:.68rem}
.wsm-plume-chart{height:445px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(180deg,var(--panel),var(--card));padding:8px;overflow:hidden}
.wsm-plume-chart svg{display:block;width:100%;height:100%}
.wsm-plume-loading{height:100%;display:grid;place-items:center;color:var(--muted);font-size:.8rem;text-align:center;padding:25px}.wsm-plume-error{color:var(--red)}
.wsm-plume-legend{display:flex;gap:18px;align-items:center;margin-top:10px;color:var(--muted);font-size:.68rem}
.wsm-plume-legend span{display:flex;align-items:center;gap:7px}.wsm-plume-legend i{display:block;width:22px;height:3px;border-radius:3px}
.wsm-plume-legend i.members{background:var(--plume-member);opacity:.45}.wsm-plume-legend i.mean{background:var(--plume-mean)}

.wsm-model-info{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin-top:14px}
.wsm-model-info>div{padding:15px;border-radius:14px;background:var(--card);border:1px solid var(--line)}
.wsm-model-info strong{display:block;color:var(--blue);font-size:.78rem}.wsm-model-info span{display:block;margin-top:5px;color:var(--muted);font-size:.7rem;line-height:1.45}

@media(max-width:900px){
  .wsm-model-hero{grid-template-columns:1fr}
  .wsm-model-main-tabs{grid-template-columns:1fr 1fr}
  .wsm-model-main-tabs button:nth-child(2){border-right:0}
  .wsm-model-main-tabs button:nth-child(-n+2){border-bottom:1px solid var(--line)}
  .wsm-model-map{height:560px}
  .wsm-model-info{grid-template-columns:1fr}
}
@media(max-width:600px){
  .wsm-radar-more{align-items:flex-start;flex-direction:column}
  .wsm-model-hero>div{padding:21px}
  .wsm-model-hero h1{font-size:2rem}
  .wsm-model-main-tabs{display:flex;overflow-x:auto}
  .wsm-model-main-tabs button{min-width:145px;border-bottom:0!important}
  .wsm-model-panel-head{align-items:flex-start}.wsm-model-panel-head>b{min-width:64px;height:42px}
  .wsm-model-map{height:72vh;min-height:480px}
  .wsm-plume-card{padding:10px}
  .wsm-plume-chart{height:350px;overflow-x:auto}
  .wsm-plume-chart svg{min-width:760px}
  .wsm-plume-head{align-items:flex-start;flex-direction:column;gap:3px}
}


/* v1.7.1 – frontpage zonder radar-iframes */
.wsm-static-radar-preview,.wsm-static-lightning-preview{
  position:relative;height:330px;overflow:hidden;background:#07131d;cursor:pointer
}
.wsm-static-radar-preview:focus-visible,.wsm-static-lightning-preview:focus-visible{
  outline:3px solid var(--cyan);outline-offset:-3px
}
.wsm-static-map-bg{
  position:absolute;inset:0;background:
    linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),
    linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px),
    radial-gradient(circle at 42% 46%,rgba(18,112,148,.28),transparent 22%),
    linear-gradient(135deg,#173039,#0d252f 42%,#143944 100%);
  background-size:42px 42px,42px 42px,auto,auto
}
.wsm-static-map-bg:after{
  content:"Noordwest-Nederland";position:absolute;right:15px;top:14px;color:rgba(255,255,255,.55);
  font-size:.62rem;font-weight:800;letter-spacing:.06em;text-transform:uppercase
}
.wsm-map-coast{position:absolute;display:block;border:1px solid rgba(132,190,161,.32);background:rgba(78,117,93,.18);transform:rotate(-13deg)}
.coast-a{width:180px;height:255px;left:35%;top:25px;border-radius:55% 30% 45% 40%}
.coast-b{width:105px;height:120px;left:19%;top:145px;border-radius:42% 55% 37% 53%}
.coast-c{width:115px;height:80px;left:58%;top:155px;border-radius:50%}
.wsm-map-marker{position:absolute;z-index:3;left:49%;top:37%;display:flex;align-items:center;gap:5px;color:#fff;font-size:.66rem;font-weight:850;text-shadow:0 2px 7px #000}
.wsm-map-marker i{width:9px;height:9px;border-radius:50%;background:var(--cyan);border:2px solid #fff;box-shadow:0 0 0 5px rgba(35,200,239,.23)}
.wsm-static-radar-preview>img{
  position:absolute;z-index:2;inset:0;width:100%;height:100%;object-fit:cover;opacity:.83;mix-blend-mode:screen
}
.wsm-static-lightning-preview>img{
  display:block;width:100%;height:100%;object-fit:cover;object-position:43% 31%;transform:scale(1.18);transition:transform .25s ease
}
.wsm-static-lightning-preview:hover>img{transform:scale(1.22)}
.wsm-static-radar-preview:after,.wsm-static-lightning-preview:after{
  content:"";position:absolute;z-index:4;inset:0;background:linear-gradient(180deg,transparent 52%,rgba(2,14,23,.88) 100%);pointer-events:none
}
.wsm-static-preview-status{
  position:absolute;z-index:5;left:17px;right:17px;bottom:15px;display:flex;align-items:flex-end;justify-content:space-between;gap:12px;color:#fff
}
.wsm-static-preview-status strong{display:block;font-size:.92rem}
.wsm-static-preview-status small{display:block;margin-top:3px;color:#cae4ee;font-size:.65rem}
.wsm-static-preview-status b{
  flex:0 0 auto;padding:8px 10px;border-radius:9px;background:rgba(3,28,43,.86);border:1px solid rgba(255,255,255,.22);
  font-size:.68rem;backdrop-filter:blur(5px)
}

/* Mobiel/tablet: geen automatische zware kaartcomponenten */
@media(max-width:1024px){
  .wsm-static-radar-preview,.wsm-static-lightning-preview{height:295px}
}
@media(max-width:860px){
  .wsm-static-radar-preview,.wsm-static-lightning-preview{height:320px;contain:layout paint}
}
@media(max-width:560px){
  .wsm-static-radar-preview,.wsm-static-lightning-preview{height:235px}
  .wsm-static-preview-status{left:12px;right:12px;bottom:11px}
  .wsm-static-preview-status span{max-width:67%}
  .wsm-static-preview-status strong{font-size:.8rem}
  .wsm-static-preview-status small{font-size:.58rem}
  .wsm-static-preview-status b{font-size:.62rem;padding:7px 8px}
}


/* v1.7.2 – 15-daagse verwachting zonder grafiek */
.wsm-forecast-panel-head{margin-bottom:12px}
.wsm-forecast-stats{margin-top:0}
.wsm-forecast-days{margin-top:12px}
.wsm-forecast-empty{
  grid-column:1/-1;
  padding:22px;
  border:1px solid var(--line);
  border-radius:13px;
  background:var(--panel);
  color:var(--muted);
  text-align:center;
  font-size:.8rem
}


/* v1.7.3 – landelijk weerbericht + hoofdmetingen in blauw vlak */
.wsm-now-inner{align-items:center}
.wsm-now-inner>div:first-child{min-width:0}
.wsm-now-metrics{
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;
  margin-top:20px;max-width:820px
}
.wsm-now-metrics>div{
  min-width:0;padding:10px 11px;border:1px solid rgba(255,255,255,.15);
  border-radius:12px;background:rgba(3,25,39,.23);backdrop-filter:blur(5px)
}
.wsm-now-metrics small{
  display:block;color:#c9e6f2;font-size:.58rem;font-weight:850;
  text-transform:uppercase;letter-spacing:.05em
}
.wsm-now-metrics strong{
  display:block;margin-top:4px;color:#fff;font-size:.95rem;white-space:nowrap
}
.wsm-now-metrics span{
  display:block;margin-top:3px;color:#c9e6f2;font-size:.58rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.wsm-now-metrics b{font-weight:800}

.wsm-national-forecast{
  min-height:100%;display:flex;flex-direction:column;overflow:hidden;
  border:1px solid var(--line);border-radius:20px;background:var(--card);
  box-shadow:0 10px 34px rgba(6,35,53,.08)
}
.wsm-national-head{
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:12px;
  padding:17px 18px;border-bottom:1px solid var(--line);background:linear-gradient(135deg,var(--panel),var(--card))
}
.wsm-national-head span{
  display:block;color:var(--blue);font-size:.61rem;font-weight:900;
  text-transform:uppercase;letter-spacing:.07em
}
.wsm-national-head h2{margin:3px 0 0;font-size:1.13rem}
.wsm-national-head>b{
  display:grid;place-items:center;width:42px;height:42px;border-radius:11px;
  background:var(--navy);color:#fff;font-size:.75rem;letter-spacing:.05em
}
.wsm-national-window{
  position:relative;flex:1;min-height:240px;max-height:310px;overflow:hidden;
  padding:0 18px;background:
    linear-gradient(var(--card) 0%,transparent 9%),
    linear-gradient(transparent 88%,var(--card) 100%)
}
.wsm-national-track{position:relative}
.wsm-national-track.is-scrolling{animation:wsm-national-scroll 32s linear infinite}
.wsm-national-window:hover .wsm-national-track{animation-play-state:paused}
.wsm-national-copy{padding:15px 0}
.wsm-national-item{padding:0 0 16px;margin:0 0 14px;border-bottom:1px solid var(--line)}
.wsm-national-item:last-child{margin-bottom:0}
.wsm-national-item h3{margin:0 0 6px;font-size:.82rem;line-height:1.3}
.wsm-national-item p{margin:0;color:var(--muted);font-size:.73rem;line-height:1.58}
.wsm-national-foot{
  flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:10px 17px;border-top:1px solid var(--line);background:var(--panel);
  color:var(--muted);font-size:.62rem
}
.wsm-national-foot a{color:var(--blue);font-weight:800}
@keyframes wsm-national-scroll{
  0%,9%{transform:translateY(0)}
  91%,100%{transform:translateY(-50%)}
}
@media(prefers-reduced-motion:reduce){
  .wsm-national-track.is-scrolling{animation:none}
  .wsm-national-window{overflow-y:auto}
}

@media(max-width:1100px){
  .wsm-now-metrics{grid-template-columns:repeat(2,1fr)}
  .wsm-national-window{max-height:300px}
}
@media(max-width:860px){
  .wsm-national-forecast{min-height:330px}
  .wsm-national-window{max-height:260px}
}
@media(max-width:560px){
  .wsm-now{min-height:430px}
  .wsm-now-desc{max-width:100%}
  .wsm-now-sub{max-width:100%;padding-right:100px}
  .wsm-now-metrics{grid-template-columns:1fr 1fr;gap:6px;margin-top:16px}
  .wsm-now-metrics>div{padding:8px}
  .wsm-now-metrics strong{font-size:.82rem}
  .wsm-national-forecast{min-height:340px}
  .wsm-national-window{max-height:270px;padding:0 14px}
  .wsm-national-head{padding:14px}
  .wsm-national-foot{padding:9px 13px}
}


/* v1.7.4 – Chrome mobiel: lichtere eerste render */
@media(max-width:860px){
  .wsm-brand-meta,.wsm-now-metrics>div,.wsm-static-preview-status b,.wsm-enlarge{
    -webkit-backdrop-filter:none!important;
    backdrop-filter:none!important
  }
  .wsm-topbar,.wsm-navbar{backface-visibility:hidden}
}
@media(max-width:560px){
  .wsm-now{contain:layout paint}
  .wsm-national-forecast{contain:layout paint}
}


/* v1.7.5 – klikbare dagen in 15-daagse verwachting */
button.wsm-forecast-day{
  appearance:none;
  -webkit-appearance:none;
  width:auto;
  text-align:left;
  color:var(--ink);
  font:inherit;
  cursor:pointer;
  transition:border-color .18s ease,transform .18s ease,box-shadow .18s ease,background .18s ease
}
button.wsm-forecast-day:hover{
  transform:translateY(-2px);
  border-color:rgba(25,146,201,.45);
  box-shadow:0 8px 22px rgba(10,55,78,.10)
}
button.wsm-forecast-day.is-active{
  border-color:var(--blue);
  background:linear-gradient(180deg,rgba(22,145,198,.10),var(--panel));
  box-shadow:0 0 0 2px rgba(22,145,198,.10)
}
button.wsm-forecast-day.is-active:before{
  content:"Geselecteerd";
  display:block;
  margin-bottom:7px;
  color:var(--blue);
  font-size:.52rem;
  font-weight:900;
  letter-spacing:.06em;
  text-transform:uppercase
}
button.wsm-forecast-day:focus-visible{
  outline:3px solid var(--cyan);
  outline-offset:2px
}


/* v1.8.0 – Meteo Dashboard */
.wsm-meteo-cta{display:flex;align-items:center;justify-content:space-between;gap:18px;margin:14px 0 4px;padding:15px 17px;border:1px solid var(--line);border-radius:15px;background:linear-gradient(135deg,var(--panel),var(--card))}
.wsm-meteo-cta strong{display:block;font-size:.88rem}.wsm-meteo-cta span{display:block;margin-top:3px;color:var(--muted);font-size:.72rem}.wsm-meteo-cta a{flex:0 0 auto;padding:10px 13px;border-radius:10px;background:var(--blue);color:#fff;font-size:.75rem;font-weight:850}

.wsm-meteo-hero{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(245px,.45fr);gap:18px;margin-bottom:18px}
.wsm-meteo-hero>div{padding:30px;border-radius:23px;color:#fff;background:linear-gradient(128deg,#061c2b,#0b5277 55%,#16a6b9);box-shadow:var(--shadow)}
.wsm-meteo-eyebrow{font-size:.66rem;font-weight:900;letter-spacing:.09em;text-transform:uppercase;color:#c9effb}
.wsm-meteo-hero h1{margin:7px 0 9px;font-size:clamp(2.1rem,4vw,3.5rem);line-height:1}.wsm-meteo-hero p{margin:0;max-width:850px;color:#dcf4fb;line-height:1.55}
.wsm-meteo-hero aside{display:flex;flex-direction:column;justify-content:center;padding:23px;border:1px solid var(--line);border-radius:23px;background:var(--card)}
.wsm-meteo-hero aside small{font-size:.63rem;font-weight:850;letter-spacing:.07em;text-transform:uppercase;color:var(--muted)}.wsm-meteo-hero aside strong{margin-top:6px;font-size:1.35rem}.wsm-meteo-hero aside span{margin-top:4px;color:var(--muted);font-size:.75rem}

.wsm-meteo-tabs{display:grid;grid-template-columns:repeat(6,1fr);margin-bottom:14px;border:1px solid var(--line);border-radius:17px;overflow:hidden;background:var(--card)}
.wsm-meteo-tabs button{position:relative;border:0;border-right:1px solid var(--line);background:var(--card);color:var(--ink);padding:13px 12px;text-align:left;cursor:pointer}.wsm-meteo-tabs button:last-child{border-right:0}
.wsm-meteo-tabs button span{display:block;color:var(--muted);font-size:.56rem;font-weight:850;text-transform:uppercase;letter-spacing:.06em}.wsm-meteo-tabs button strong{display:block;margin-top:3px;font-size:.86rem}
.wsm-meteo-tabs button.is-active{background:var(--panel);color:var(--blue)}.wsm-meteo-tabs button.is-active:after{content:"";position:absolute;left:12px;right:12px;bottom:0;height:3px;border-radius:3px 3px 0 0;background:var(--blue)}

.wsm-meteo-panel{overflow:hidden;border:1px solid var(--line);border-radius:20px;background:var(--card);box-shadow:0 12px 38px rgba(8,43,61,.07)}.wsm-meteo-panel[hidden]{display:none!important}
.wsm-meteo-panel-head{display:flex;align-items:center;justify-content:space-between;gap:18px;padding:18px 20px;border-bottom:1px solid var(--line)}
.wsm-meteo-panel-head span{display:block;color:var(--blue);font-size:.61rem;font-weight:900;text-transform:uppercase;letter-spacing:.07em}.wsm-meteo-panel-head h2{margin:3px 0;font-size:1.25rem}.wsm-meteo-panel-head p{margin:0;color:var(--muted);font-size:.73rem}.wsm-meteo-panel-head>strong{flex:0 0 auto;color:var(--muted);font-size:.69rem}
.wsm-meteo-loading{display:grid;place-items:center;min-height:220px;padding:25px;color:var(--muted);text-align:center;font-size:.8rem}.wsm-meteo-error{color:var(--red)}.wsm-meteo-note{margin:0;padding:10px 16px;border-top:1px solid var(--line);color:var(--muted);font-size:.66rem}

.wsm-hours-summary{display:grid;grid-template-columns:repeat(4,1fr);gap:9px;padding:13px 16px;background:var(--panel);border-bottom:1px solid var(--line)}.wsm-hours-summary>div{padding:10px 12px;border:1px solid var(--line);border-radius:11px;background:var(--card)}.wsm-hours-summary small{display:block;color:var(--muted);font-size:.58rem;text-transform:uppercase;font-weight:850}.wsm-hours-summary strong{display:block;margin-top:3px;font-size:.96rem}
.wsm-hours-strip{display:flex;gap:8px;overflow-x:auto;padding:15px;scroll-snap-type:x proximity}.wsm-hour-card{flex:0 0 150px;scroll-snap-align:start;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.wsm-hour-time{display:flex;align-items:flex-start;justify-content:space-between;gap:7px}.wsm-hour-time strong{font-size:.76rem}.wsm-hour-time span{color:var(--muted);font-size:.58rem}.wsm-hour-icon{font-size:1.55rem;margin:8px 0 4px}.wsm-hour-card>b{font-size:1.45rem}.wsm-hour-card>small{display:block;color:var(--muted);font-size:.62rem}.wsm-hour-card>em{display:block;margin:8px 0 7px;font-style:normal;font-size:.67rem;font-weight:760}.wsm-hour-lines{display:grid;gap:3px;color:var(--muted);font-size:.58rem}

.wsm-sunmoon-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:16px}.wsm-astro-card{min-height:150px;padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.wsm-astro-card>span{display:block;font-size:1.8rem}.wsm-astro-card small{display:block;margin-top:10px;color:var(--muted);font-size:.62rem;font-weight:850;text-transform:uppercase}.wsm-astro-card strong{display:block;margin-top:3px;font-size:1.16rem}.wsm-astro-card em{display:block;margin-top:4px;color:var(--muted);font-style:normal;font-size:.65rem}

.wsm-windrose-layout{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(250px,.55fr);gap:14px;padding:16px}.wsm-windrose-chart{min-height:480px;display:grid;place-items:center;border:1px solid var(--line);border-radius:15px;background:var(--panel)}.wsm-windrose-chart svg{width:min(100%,520px);height:auto}.wsm-windrose-stats{display:grid;gap:9px;align-content:start}.wsm-windrose-stats>div{padding:14px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.wsm-windrose-stats small{display:block;color:var(--muted);font-size:.58rem;text-transform:uppercase;font-weight:850}.wsm-windrose-stats strong{display:block;margin-top:3px;font-size:1.1rem}.wsm-windrose-stats span{display:block;margin-top:3px;color:var(--muted);font-size:.62rem}

.wsm-rain-days{display:grid;grid-template-columns:repeat(7,1fr);gap:9px;padding:16px;align-items:end}.wsm-rain-day{display:grid;grid-template-rows:auto 180px auto auto;gap:8px;min-width:0;padding:12px;border:1px solid var(--line);border-radius:13px;background:var(--panel)}.wsm-rain-day>div:first-child strong{display:block;font-size:.7rem}.wsm-rain-day>div:first-child span{display:block;margin-top:2px;color:var(--muted);font-size:.56rem}.wsm-rain-bar{position:relative;display:flex;align-items:flex-end;justify-content:center;width:26px;height:100%;margin:auto;border-radius:9px;background:rgba(15,140,205,.08);overflow:hidden}.wsm-rain-bar i{display:block;width:100%;border-radius:7px 7px 0 0;background:linear-gradient(#43b4ef,#147ab2)}.wsm-rain-day>b{text-align:center;font-size:.8rem}.wsm-rain-day>small{text-align:center;color:var(--muted);font-size:.58rem}

.wsm-air-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;padding:16px}.wsm-air-card{padding:16px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.wsm-air-card small{display:block;color:var(--muted);font-size:.6rem;font-weight:850;text-transform:uppercase}.wsm-air-card strong{display:block;margin-top:5px;font-size:1.55rem}.wsm-air-card span{display:block;margin-top:3px;color:var(--muted);font-size:.65rem}.wsm-air-card.aqi.good{border-color:rgba(38,174,104,.45)}.wsm-air-card.aqi.fair{border-color:rgba(108,184,70,.45)}.wsm-air-card.aqi.moderate{border-color:rgba(230,170,45,.5)}.wsm-air-card.aqi.poor,.wsm-air-card.aqi.verypoor,.wsm-air-card.aqi.extreme{border-color:rgba(224,78,67,.55)}

.wsm-record-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:16px}.wsm-record-card{padding:15px;border:1px solid var(--line);border-radius:14px;background:var(--panel)}.wsm-record-card>span{display:block;font-size:1.45rem}.wsm-record-card small{display:block;margin-top:8px;color:var(--muted);font-size:.58rem;font-weight:850;text-transform:uppercase}.wsm-record-card strong{display:block;margin-top:4px;font-size:1.08rem}.wsm-record-card em{display:block;margin-top:4px;color:var(--muted);font-size:.6rem;font-style:normal}
.wsm-meteo-links{display:flex;gap:8px;flex-wrap:wrap;margin-top:13px}.wsm-meteo-links a{padding:9px 12px;border:1px solid var(--line);border-radius:9px;background:var(--card);color:var(--blue);font-size:.72rem;font-weight:800}

@media(max-width:1000px){.wsm-meteo-tabs{grid-template-columns:repeat(3,1fr)}.wsm-meteo-tabs button:nth-child(3n){border-right:0}.wsm-hours-summary{grid-template-columns:1fr 1fr}.wsm-sunmoon-grid{grid-template-columns:1fr 1fr}.wsm-rain-days{overflow-x:auto;display:flex}.wsm-rain-day{flex:0 0 130px}.wsm-air-grid{grid-template-columns:repeat(3,1fr)}.wsm-record-grid{grid-template-columns:1fr 1fr}}
@media(max-width:760px){.wsm-meteo-hero{grid-template-columns:1fr}.wsm-meteo-tabs{display:flex;overflow-x:auto}.wsm-meteo-tabs button{min-width:130px;flex:0 0 auto}.wsm-windrose-layout{grid-template-columns:1fr}.wsm-windrose-chart{min-height:360px}.wsm-meteo-cta{align-items:flex-start;flex-direction:column}.wsm-meteo-cta a{width:100%;text-align:center}}
@media(max-width:560px){.wsm-meteo-hero>div{padding:21px}.wsm-meteo-hero h1{font-size:2rem}.wsm-meteo-panel-head{align-items:flex-start}.wsm-meteo-panel-head>strong{padding-top:4px}.wsm-hours-summary{grid-template-columns:1fr 1fr;padding:10px}.wsm-hours-strip{padding:10px}.wsm-hour-card{flex-basis:138px}.wsm-sunmoon-grid{grid-template-columns:1fr 1fr;padding:10px}.wsm-astro-card{min-height:135px;padding:12px}.wsm-air-grid{grid-template-columns:1fr 1fr;padding:10px}.wsm-record-grid{grid-template-columns:1fr 1fr;padding:10px}.wsm-windrose-layout{padding:10px}}


/* v1.8.2 – zichtbare kaart onder de neerslagradar */
.wsm-radar-live-map{
  position:absolute;
  inset:0;
  overflow:hidden;
  background:#dfe7ea;
}
.wsm-radar-base-layer,
.wsm-radar-overlay-layer{
  position:absolute;
  inset:0;
  overflow:hidden;
}
.wsm-radar-base-layer{z-index:1}
.wsm-radar-overlay-layer{z-index:2;pointer-events:none}
.wsm-radar-base-layer img,
.wsm-radar-overlay-layer img{
  position:absolute;
  width:256px;
  height:256px;
  max-width:none!important;
  margin:0!important;
  padding:0!important;
  border:0!important;
  user-select:none;
}
.wsm-radar-base-layer img{z-index:1}
.wsm-radar-overlay-layer img{z-index:2;opacity:.78}
.wsm-radar-center{
  position:absolute;
  z-index:5;
  left:50%;
  top:50%;
  transform:translate(-50%,-50%);
  display:flex;
  align-items:center;
  gap:6px;
  color:#fff;
  font-size:.66rem;
  font-weight:900;
  text-shadow:0 1px 5px rgba(0,0,0,.9);
  pointer-events:none;
}
.wsm-radar-center i{
  width:10px;
  height:10px;
  border-radius:50%;
  background:#18c8ef;
  border:2px solid #fff;
  box-shadow:0 0 0 5px rgba(24,200,239,.25),0 2px 6px rgba(0,0,0,.35);
}
.wsm-radar-attribution{
  position:absolute;
  z-index:5;
  right:7px;
  top:7px;
  padding:4px 6px;
  border-radius:5px;
  background:rgba(3,25,39,.70);
  color:#fff;
  font-size:.49rem;
  line-height:1.1;
  pointer-events:none;
}
.wsm-static-radar-preview>.wsm-radar-live-map+ .wsm-static-preview-status{
  z-index:7;
}
@media(max-width:560px){
  .wsm-radar-attribution{font-size:.45rem}
  .wsm-radar-center{font-size:.58rem}
}


/* v1.8.3 – progressieve jaarhistorie */
.wsm-history-progress-note{display:block;margin-top:5px;color:var(--muted);font-size:.58rem;line-height:1.35}


/* v1.8.4 – tablet/mobile navigatiemenu */
@media(max-width:860px){
  /*
   * Belangrijk: geen paint-containment op de sticky navbar.
   * Het uitklapmenu staat absoluut onder de 54px hoge balk en werd door
   * contain:paint volledig afgeknipt, hoewel .is-open correct werd gezet.
   */
  .wsm-navbar{
    contain:none!important;
    overflow:visible!important;
    z-index:500;
  }
  .wsm-nav-inner{
    position:relative;
    overflow:visible!important;
  }
  .wsm-nav{
    display:block;
    visibility:hidden;
    opacity:0;
    pointer-events:none;
    transform:translateY(-8px);
    position:absolute;
    z-index:510;
    left:0;
    right:0;
    top:54px;
    max-height:calc(100dvh - 88px);
    overflow-y:auto;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    background:var(--navy2);
    border-top:1px solid rgba(255,255,255,.08);
    border-radius:0 0 14px 14px;
    box-shadow:0 22px 48px rgba(0,0,0,.42);
    transition:opacity .16s ease,transform .16s ease,visibility 0s linear .16s;
  }
  .wsm-nav.is-open{
    visibility:visible;
    opacity:1;
    pointer-events:auto;
    transform:translateY(0);
    transition:opacity .16s ease,transform .16s ease;
  }
  .wsm-nav ul{
    display:block;
    width:100%;
    margin:0;
    padding:6px 0 10px;
  }
  .wsm-nav li{
    display:block;
    width:100%;
    margin:0;
  }
  .wsm-nav a{
    display:block;
    width:100%;
    padding:14px 18px;
    border-bottom:1px solid rgba(255,255,255,.07);
    border-left:3px solid transparent;
    font-size:.88rem;
  }
  .wsm-nav a:hover,
  .wsm-nav .current-menu-item>a{
    border-bottom-color:rgba(255,255,255,.07);
    border-left-color:var(--cyan);
    background:rgba(255,255,255,.07);
  }
  .wsm-menu-btn{
    position:relative;
    z-index:520;
    font-size:1.25rem;
    line-height:1;
  }
  .wsm-menu-btn span{
    display:block;
    line-height:1;
    transform:translateY(-1px);
  }
  .wsm-navbar.menu-open{
    box-shadow:0 8px 24px rgba(0,0,0,.22);
  }
}
@media(max-width:560px){
  .wsm-nav{
    left:-9px;
    right:-9px;
    max-height:calc(100dvh - 76px);
    border-radius:0 0 12px 12px;
  }
}


/* v1.8.5 – historie schaalt volledig mee op tablet en mobiel */
.wsm-history-chart{
  width:100%;
  max-width:100%;
  min-width:0;
  overflow:hidden!important;
}
.wsm-history-chart svg{
  display:block;
  width:100%!important;
  max-width:100%!important;
  min-width:0!important;
  height:100%!important;
  touch-action:pan-y;
}
.wsm-history-chart-area,
.wsm-history-shell,
.wsm-history-chart-title,
.wsm-history-legend,
.wsm-history-stats{
  min-width:0;
  max-width:100%;
}
@media(max-width:860px){
  .wsm-history-chart{
    height:clamp(320px,52vw,390px);
    padding:8px;
  }
}
@media(max-width:560px){
  .wsm-history-chart{
    height:clamp(270px,78vw,330px);
    padding:5px;
    border-radius:12px;
  }
  .wsm-history-chart-area{padding:9px}
  .wsm-history-legend{gap:5px}
  .wsm-history-legend button{
    padding:6px 7px;
    font-size:.64rem;
  }
}
