/* MAWS shared theme: Material Design 2, "Foothill" palette.
   Every page links this file; page-specific layout stays in each page's own <style>. */

@font-face{font-family:"Roboto";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/roboto-latin.woff2) format("woff2")}
@font-face{font-family:"Roboto Condensed";font-style:normal;font-weight:100 900;font-display:swap;src:url(fonts/roboto-condensed-latin.woff2) format("woff2")}

:root{
  /* Surfaces */
  --bg:#ECEFF0;
  --surface:#FFFFFF;
  --surface-sub:#F4F6F6;
  /* Brand: slate-teal primary, sun-amber secondary */
  --primary:#1F4A5A;
  --primary-dark:#14323D;
  --on-primary:#FFFFFF;
  --on-primary-med:rgba(255,255,255,.72);
  --secondary:#E8A33D;
  --link:#1D5E75;
  /* Text and lines (M2 emphasis levels) */
  --hi:rgba(14,28,34,.87);
  --med:rgba(14,28,34,.62);
  --low:rgba(14,28,34,.42);
  --divider:rgba(14,28,34,.12);
  /* Weather semantics: only used to mean these things */
  --temp:#C9602A;
  --dew:#3D7C8B;
  --rain:#2F6DB5;
  --bolt:#D99A1E;
  --ok:#2E7D32;
  --warn:#C8661A;
  --crit:#B3261E;
  --night:rgba(31,74,90,.15);
  /* M2 elevation */
  --sh1:0 2px 1px -1px rgba(0,0,0,.14),0 1px 1px 0 rgba(0,0,0,.10),0 1px 3px 0 rgba(0,0,0,.09);
  --sh4:0 2px 4px -1px rgba(0,0,0,.2),0 4px 5px 0 rgba(0,0,0,.14),0 1px 10px 0 rgba(0,0,0,.12);
  --sh8:0 5px 5px -3px rgba(0,0,0,.2),0 8px 10px 1px rgba(0,0,0,.14),0 3px 14px 2px rgba(0,0,0,.12);
  /* Type and shape */
  --font:"Roboto","Helvetica Neue",Arial,system-ui,sans-serif;
  --font-num:"Roboto Condensed","Roboto","Arial Narrow",sans-serif;
  --radius:4px;
}

*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--hi);font-family:var(--font);font-size:14px;line-height:1.5;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}
a{color:var(--link)}
a:focus-visible,button:focus-visible,summary:focus-visible,input:focus-visible,[tabindex]:focus-visible{outline:2px solid var(--secondary);outline-offset:2px}
svg{display:block}
code{font-size:.92em}
.num{font-variant-numeric:tabular-nums}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}

/* ---------- App bar with fixed tabs ---------- */
.appbar{background:var(--primary);color:var(--on-primary);box-shadow:var(--sh4);position:relative;z-index:2}
.appbar-row{max-width:1088px;margin:0 auto;display:flex;align-items:center;justify-content:space-between;gap:16px;height:64px;padding:0 24px}
.brand{display:flex;align-items:center;gap:14px;min-width:0;color:inherit;text-decoration:none}
.brand svg{flex:none}
.brand-name{font-size:20px;font-weight:500;letter-spacing:.15px;white-space:nowrap}
.brand-sub{font-size:12px;color:var(--on-primary-med);letter-spacing:.4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.appbar-meta{font-size:12px;color:var(--on-primary-med);text-align:right;white-space:nowrap}
.appbar-meta b{display:block;font-size:14px;font-weight:500;color:var(--on-primary)}
.tabs{max-width:1088px;margin:0 auto;display:flex;overflow-x:auto;padding:0 12px;scrollbar-width:none}
.tabs::-webkit-scrollbar{display:none}
.tabs a{flex:none;position:relative;display:block;padding:0 16px;line-height:48px;font-size:14px;font-weight:500;letter-spacing:1.25px;text-transform:uppercase;color:var(--on-primary-med);text-decoration:none}
.tabs a:hover{color:var(--on-primary)}
.tabs a[aria-current="page"]{color:var(--on-primary)}
.tabs a[aria-current="page"]::after{content:"";position:absolute;left:0;right:0;bottom:0;height:2px;background:var(--secondary)}

/* ---------- Page layout ---------- */
.wrap{max-width:1088px;margin:0 auto;padding:24px;display:grid;gap:16px}
.wrap > *{min-width:0}
.site-foot{max-width:1088px;margin:0 auto;padding:0 24px 32px;font-size:12px;color:var(--med)}
.site-foot a{color:var(--med)}

/* ---------- Cards ---------- */
.card{background:var(--surface);border-radius:var(--radius);box-shadow:var(--sh1);min-width:0}
.card-head{display:flex;align-items:baseline;justify-content:space-between;gap:4px 12px;flex-wrap:wrap;padding:16px 16px 0}
.card-head h2{font-size:20px;font-weight:500;letter-spacing:.15px;margin:0;line-height:1.3}
.card-body{padding:16px}
.card-foot{padding:12px 16px;border-top:1px solid var(--divider);font-size:12px;color:var(--med)}
.caption{font-size:12px;color:var(--med);letter-spacing:.4px}
.overline{font-size:10px;font-weight:500;letter-spacing:1.5px;text-transform:uppercase;color:var(--med)}
.empty{color:var(--med)}

/* Label/value list with hairline dividers */
.list{margin:0;padding:0 16px 8px}
.list > div{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:10px 0;border-top:1px solid var(--divider)}
.list > div:first-child{border-top:0}
.list dt{color:var(--med)}
.list dd{margin:0;font-weight:500;font-variant-numeric:tabular-nums;text-align:right}
.list dd small{display:block;font-weight:400;font-size:12px;color:var(--med)}

/* Ruled grid of readings */
.readouts{display:grid;grid-template-columns:repeat(var(--cols,4),minmax(0,1fr));margin:0;border-top:1px solid var(--divider)}
.readouts > div{padding:12px 16px;border-left:1px solid var(--divider);min-width:0}
.readouts > div:first-child{border-left:0}
.readouts dt{margin:0}
.readouts dd{margin:4px 0 0;font-size:22px;font-variant-numeric:tabular-nums;line-height:1.3}
.readouts dd small{font-size:14px;color:var(--med);margin-left:2px}
.readouts .sub{font-size:12px;color:var(--med)}

/* Chart legend */
.key{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:12px;color:var(--med)}
.key i{display:inline-block;width:12px;height:10px;margin-right:6px;vertical-align:-1px}
.key i.line{height:2px;width:14px;vertical-align:3px}

/* Secondary tabs (in-card) */
.subtabs{display:flex;overflow-x:auto;padding:0 8px;border-bottom:1px solid var(--divider);scrollbar-width:none}
.subtabs::-webkit-scrollbar{display:none}
.subtabs a,.subtabs button{flex:none;position:relative;display:block;background:none;border:0;margin:0;padding:0 16px;line-height:48px;font:500 14px/48px var(--font);letter-spacing:1.25px;text-transform:uppercase;color:var(--med);text-decoration:none;cursor:pointer}
.subtabs a:hover,.subtabs button:hover{color:var(--hi)}
.subtabs [aria-current="page"],.subtabs [aria-selected="true"]{color:var(--primary)}
.subtabs [aria-current="page"]::after,.subtabs [aria-selected="true"]::after{content:"";position:absolute;left:0;right:0;bottom:-1px;height:2px;background:var(--primary)}

/* M2 data table */
.table-wrap{overflow-x:auto}
.data-table{width:100%;border-collapse:collapse;font-variant-numeric:tabular-nums}
.data-table th{font-size:12px;font-weight:500;color:var(--med);letter-spacing:.4px;text-align:right;padding:0 16px;height:48px;border-bottom:1px solid var(--divider);white-space:nowrap}
.data-table td,.data-table tbody th{padding:10px 16px;border-bottom:1px solid var(--divider);text-align:right;vertical-align:top}
.data-table th:first-child,.data-table td:first-child,.data-table tbody th{text-align:left}
.data-table tbody th{font-weight:400;color:var(--hi);font-size:14px;height:auto;white-space:normal;letter-spacing:0}
.data-table tbody tr:last-child > *{border-bottom:0}
.data-table small{display:block;font-size:12px;color:var(--med)}

/* Ad slot */
.ad-slot{display:flex;align-items:center;justify-content:center;min-height:250px}

@media (max-width:640px){
  .appbar-row{height:56px;padding:0 16px}
  .brand-sub{display:none}
  .tabs{padding:0 4px}
  .tabs a{padding:0 12px}
  .wrap{padding:12px;gap:12px}
  .site-foot{padding:0 12px 24px}
  .readouts{grid-template-columns:repeat(2,minmax(0,1fr))}
  .readouts > div:nth-child(odd){border-left:0}
  .readouts > div:nth-child(n+3){border-top:1px solid var(--divider)}
}
