:root {
  color-scheme: light;
  --wx-bg:#f4f6f8;
  --wx-card:#ffffff;
  --wx-card-2:#f7f8fa;
  --wx-text:#17212b;
  --wx-muted:#65717d;
  --wx-border:#d8dee5;
  --wx-shadow:0 4px 18px rgba(0,0,0,.12);
  --wx-blue:#2f74b5;
  --wx-blue-hover:#3e86c7;
  --wx-top-title:#0d6fa8;
  --wx-chart:#f7f7f7;
  --wx-chart2:#eeeeee;
  --wx-grid:#d9dfe5;
}
html[data-theme="dark"] {
  color-scheme: dark;
  --wx-bg:#242424;
  --wx-card:#3b3b3d;
  --wx-card-2:#323234;
  --wx-text:#f2f3f5;
  --wx-muted:#c0c5cb;
  --wx-border:#56585c;
  --wx-shadow:0 4px 18px rgba(0,0,0,.34);
  --wx-blue:#337ab7;
  --wx-blue-hover:#468dca;
  --wx-top-title:#64b5f6;
  --wx-chart:#36383b;
  --wx-chart2:#2e3033;
  --wx-grid:#52565b;
}
html,body{margin:0;min-height:100%;background:var(--wx-bg)!important;color:var(--wx-text)!important;font-family:Arial,Helvetica,sans-serif}
body{padding:12px;box-sizing:border-box}
a{color:var(--wx-top-title)}
.wxsite{width:min(1120px,100%);margin:0 auto}
.wxsite.embed{width:100%;max-width:none}
.wx-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;margin-bottom:10px}
.wx-title{font-size:20px;font-weight:800;margin:0;color:var(--wx-text)}
.wx-subtitle{color:var(--wx-muted);font-size:12px;margin-top:4px}
.wx-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap;justify-content:flex-end}
.theme-switch{display:flex;gap:4px;padding:4px;border:1px solid var(--wx-border);border-radius:10px;background:var(--wx-card);box-shadow:var(--wx-shadow)}
.theme-switch button{border:0;background:transparent;color:var(--wx-text);border-radius:7px;padding:7px 10px;font-weight:700;cursor:pointer}
.theme-switch button.active{background:var(--wx-blue);color:#fff}
.wx-nav{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}
.wx-nav a{display:inline-block;text-decoration:none;background:var(--wx-card);color:var(--wx-text);border:1px solid var(--wx-border);border-radius:9px;padding:8px 11px;font-weight:700}
.wx-nav a:hover,.wx-nav a.active{background:var(--wx-blue);color:#fff;border-color:var(--wx-blue)}
.wx-card{background:var(--wx-card);border:1px solid var(--wx-border);border-radius:14px;padding:14px;box-shadow:var(--wx-shadow);margin-bottom:12px;overflow:hidden}
.wx-card.flush{padding:0}
.wx-card-title{font-size:14px;font-weight:800;color:var(--wx-muted);margin:0 0 8px}
.wx-updated{color:var(--wx-muted);font-size:12px;line-height:1.35}
.wx-updated span{float:none!important;text-align:right!important;display:block}
.wx-periods{padding:6px 2px}
.wx-periods table{width:100%!important;border-collapse:separate!important;border-spacing:8px 0!important}
.wx-periods td.leetip{background:var(--wx-card-2);border:1px solid var(--wx-border);border-radius:12px;padding:10px 5px!important;color:var(--wx-text)!important}
.wx-periods td.leetip b,.wx-periods td.leetip strong{color:var(--wx-top-title)!important}
.wx-periods .svg-ic{filter:none}
/* Existing WXSIM components */
.flotwrap{background:var(--wx-chart)!important;box-shadow:none!important;border:0!important;border-radius:10px;padding:8px!important}
.flotwrap > div[style*="background:#f7f7f7"]{background:var(--wx-chart)!important}
#graphPanels{margin:4px 0 0!important;display:flex;gap:5px;flex-wrap:wrap}
.graphPanel{margin:0!important;border-radius:8px!important;background:var(--wx-blue)!important;color:#d8e9f8!important;text-shadow:none!important;box-shadow:none!important;padding:8px 10px!important}
.graphPanel.selected,.graphPanel:hover{position:static!important;background:var(--wx-card)!important;color:var(--wx-text)!important;border:1px solid var(--wx-border)!important;box-shadow:none!important}
#wxsimtabs #topPanels{margin:0!important;display:flex;gap:5px;flex-wrap:wrap}
#wxsimtabs .topPanel{margin:0!important;border-radius:8px 8px 0 0!important;background:var(--wx-blue)!important;color:#d8e9f8!important;text-shadow:none!important}
#wxsimtabs .topPanel.selected,#wxsimtabs .topPanel:hover{position:static!important;background:var(--wx-card-2)!important;color:var(--wx-text)!important;border-color:var(--wx-border)!important;box-shadow:none!important}
.wxsimtbl{width:100%!important;background:var(--wx-card-2)!important;border-color:var(--wx-border)!important;color:var(--wx-text)!important;box-shadow:none!important}
.wxsimtbl_header{background:#244f75!important;color:#fff!important;text-shadow:none!important}
.wxsimdata{background:var(--wx-card)!important;color:var(--wx-text)!important}
.wxsimdataodd{background:var(--wx-card-2)!important;color:var(--wx-text)!important}
.wxsimdata:hover,.wxsimdataodd:hover{background:color-mix(in srgb,var(--wx-blue) 18%,var(--wx-card))!important}
.infobox2{background:var(--wx-card-2)!important;color:var(--wx-muted)!important}
.tabs > div[style*="background:#f2f2f2"]{background:var(--wx-card-2)!important}
.le-popup-content-wrapper{background:var(--wx-card)!important;color:var(--wx-text)!important;border-color:var(--wx-border)!important}
small{color:var(--wx-muted)}
/* Highcharts text/SVG after render; JS also uses theme colors */
.highcharts-axis-labels text,.highcharts-axis-title,.highcharts-legend-item text{fill:var(--wx-text)!important;color:var(--wx-text)!important}
.highcharts-grid path{stroke:var(--wx-grid)!important}
/* Embedded pages */
body.wx-embed{padding:0;background:transparent!important}
body.wx-embed .wx-card{margin:0;border-radius:10px;box-shadow:none}
body.wx-embed .theme-switch,body.wx-embed .wx-nav,body.wx-embed .wx-header{display:none}
@media(max-width:760px){
  body{padding:7px}.wx-header{flex-direction:column}.wx-actions{justify-content:flex-start}.wx-periods table{border-spacing:4px 0!important}.col650,.col800{display:none!important}
}