
/* Layout: a Cape Ann Current section page. Site topbar, masthead and nav, then the Business section front: headline numbers, then stacked desk boxes, each with its own controls and source line. Brand: Harbor Navy, Deep Teal, Paper and Sand, Lora headlines, system sans body. The live site is light only, so this page commits to the same single light look. */
.econ{
  --navy:#15395B; --teal:#2A8C82; --seafoam:#7FD1C7;
  --paper:#FBF9F5; --sand:#F4EFE6; --panel:#FFFFFF; --ink:#1C2430; --ink-2:#3E4A56; --muted:#5A6672; --line:#DDD6C9; --line-2:#ECE6DB;
  --accent:#1F6F67; --accent-soft:#E3F1EF; --chip:#F4EFE6;
  --s1:#1D5F99; --s2:#C9742A; --s3:#1E9384; --s4:#A2559A; --s5:#5E8FD6; --bench:#5A6672;
  --good:#1F6F67; --bad:#8A5A00; --emp:#15395B; --warn-bg:#FFF4DB;
  --f-display:"Lora", Georgia, "Times New Roman", serif;
  --f-body:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
  --f-data:-apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, Helvetica, Arial, sans-serif;
}
.mast{border-bottom:3px solid var(--navy);padding-bottom:14px}
.mast h1{font-size:clamp(30px,5vw,42px);font-weight:700}
.mast .dek{color:var(--ink-2);max-width:64ch;margin:10px 0 0;font-size:18px}
.econ .kicker{font:700 12px/1 var(--f-body);letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin:0 0 10px}
.econ .kicker a{color:inherit;text-decoration:none}
.asof{font-size:13px;color:var(--muted);display:flex;flex-wrap:wrap;gap:4px 18px;padding:12px 0 0}
.asof b{color:var(--ink-2);font-weight:600}
nav.sec{position:sticky;top:env(safe-area-inset-top,0px);z-index:500;background:var(--paper);display:flex;gap:6px;overflow-x:auto;padding:10px 0;border-bottom:1px solid var(--line);scrollbar-width:none}
nav.sec a{flex:none;font-size:13px;font-weight:600;text-decoration:none;color:var(--navy);padding:4px 11px;border-radius:99px;background:var(--sand)}
nav.sec a:hover,nav.sec a:focus-visible{color:var(--accent);outline:2px solid var(--teal);outline-offset:1px}
.pulse{display:grid;grid-template-columns:repeat(auto-fit,minmax(165px,1fr));gap:1px;background:var(--line);border:1px solid var(--line);border-radius:10px;overflow:hidden;margin-top:20px}
.tile{background:var(--panel);padding:14px 16px;min-width:0}
.tile .lab{font-size:13px;color:var(--ink-2);font-weight:600}
.tile .big{font-family:var(--f-display);font-size:30px;font-weight:700;color:var(--navy);line-height:1.15;margin-top:2px}
.tile .sub{font-size:13px;color:var(--muted)}
.delta{font-size:13px;font-weight:600;white-space:nowrap}
.up{color:var(--bad)} .down{color:var(--good)} .flat{color:var(--muted)}
.up.goodup{color:var(--good)} .down.baddown{color:var(--bad)}
section.desk{margin-top:28px;background:var(--panel);border:1px solid var(--line);border-radius:12px;padding:20px clamp(16px,3vw,26px) 18px;scroll-margin-top:60px;min-width:0}
.dhead{margin-bottom:14px}
.dhead h2{font-size:clamp(22px,3vw,27px);font-weight:700}
.dhead p{margin:6px 0 0;color:var(--ink-2);max-width:68ch}
.eyebrow{font:700 12px/1 var(--f-body);letter-spacing:.09em;text-transform:uppercase;color:var(--accent);margin:0 0 10px;display:block}
.controls{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin:8px 0 12px}
.chip{font:600 13px var(--f-body);border:1px solid var(--line);background:var(--sand);color:var(--navy);border-radius:99px;padding:4px 11px;cursor:pointer;display:inline-flex;align-items:center;gap:6px}
.chip[aria-pressed="true"]{background:var(--navy);color:#fff;border-color:var(--navy)}
.chip:focus-visible,button:focus-visible,input:focus-visible,select:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.sw{width:10px;height:10px;border-radius:2px;display:inline-block;flex:none}
.src{font-size:12.5px;color:var(--muted);margin-top:12px;border-top:1px solid var(--line-2);padding-top:8px}
.src a{color:var(--muted)}
.grid2{display:grid;grid-template-columns:repeat(auto-fit,minmax(300px,1fr));gap:20px}
.grid2>*{min-width:0}
.chart{position:relative;width:100%}
.chart svg{display:block;width:100%;height:auto;overflow:visible}
.chart text{fill:var(--muted);font:11px var(--f-body)}
.chart .gl{stroke:var(--line-2);stroke-width:1}
.chart .ax{stroke:var(--line);stroke-width:1}
.tt{position:absolute;pointer-events:none;background:var(--navy);color:#fff;font:12px/1.4 var(--f-body);padding:6px 8px;border-radius:4px;white-space:nowrap;z-index:5;transform:translate(-50%,-110%)}
.tt b{font-weight:700}
.legend{display:flex;flex-wrap:wrap;gap:4px 14px;font-size:13px;color:var(--ink-2);margin:4px 0 6px}
.legend span{display:inline-flex;align-items:center;gap:6px}
.tbl{overflow-x:auto;border:1px solid var(--line);border-radius:6px}
table{border-collapse:collapse;width:100%;font-size:14px}
th,td{padding:8px 10px;text-align:right;border-bottom:1px solid var(--line-2);white-space:nowrap}
th:first-child,td:first-child{text-align:left}
thead th{font-size:12px;color:var(--ink-2);font-weight:700;background:var(--sand);vertical-align:bottom;white-space:normal;min-width:84px}
thead th button{all:unset;cursor:pointer}
thead th button:focus-visible{outline:2px solid var(--teal)}
tr.total td{font-weight:700;border-top:2px solid var(--navy)}
tr.bench td{color:var(--ink-2);background:var(--paper)}
tr.hl td{background:var(--accent-soft);font-weight:700}
.bars{display:grid;gap:6px}
.bar{display:grid;grid-template-columns:minmax(120px,230px) 1fr auto;gap:10px;align-items:center;font-size:14px}
.bar .nm{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.bar .trk{height:14px;background:var(--line-2);border-radius:0 3px 3px 0;position:relative}
.bar .fill{height:100%;background:var(--s1);border-radius:0 3px 3px 0}
.bar .v{font-size:13px;min-width:120px;text-align:right}
.note{background:var(--accent-soft);padding:10px 12px;font-size:14px;border-left:3px solid var(--teal);margin-top:12px;border-radius:0 6px 6px 0}
.big3{display:grid;grid-template-columns:repeat(auto-fit,minmax(160px,1fr));gap:12px;margin-bottom:14px}
.big3>div{border-top:2px solid var(--navy);padding-top:6px}
.big3 .big{font-family:var(--f-display);font-size:26px;font-weight:700;color:var(--navy)}
.big3 .lab{font-size:13px;color:var(--ink-2)}
.ticker{display:grid;grid-template-columns:repeat(auto-fill,minmax(235px,1fr));gap:12px}
.tk{border:1px solid var(--line);border-radius:8px;padding:14px;display:grid;gap:6px;align-content:start;background:var(--panel)}
.tk .sym{font-size:12px;letter-spacing:.06em;text-transform:uppercase;color:var(--accent);font-weight:700}
.tk h3{font-size:17px;font-weight:700}
.tk .loc{font-size:13px;color:var(--ink-2)}
.tk .row{display:flex;justify-content:space-between;gap:8px;font-size:13px;border-top:1px solid var(--line-2);padding-top:4px}
.tk .row span:last-child{text-align:right;font-weight:600}
#map{position:relative;z-index:0;height:520px;border:1px solid var(--line);border-radius:6px;background:var(--sand)}
.mapbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:10px}
.mapbar input,.mapbar select,.fishbar select{font:14px var(--f-body);padding:6px 10px;border:1px solid var(--line);background:var(--panel);color:var(--ink);border-radius:6px;min-width:0;max-width:100%}
.mapbar input{flex:1 1 220px}
.maplist{max-height:240px;overflow:auto;border:1px solid var(--line);border-radius:6px;margin-top:10px;font-size:14px}
.maplist button{all:unset;display:flex;justify-content:space-between;gap:10px;width:100%;box-sizing:border-box;padding:6px 10px;border-bottom:1px solid var(--line-2);cursor:pointer}
.maplist button:hover,.maplist button:focus-visible{background:var(--sand)}
.maplist small{color:var(--muted)}
.tag{font-size:12px;color:var(--muted)}
.fishbar{display:flex;flex-wrap:wrap;gap:8px 14px;align-items:center;margin:4px 0 10px;font-size:14px}
.fishbar label{display:inline-flex;gap:6px;align-items:center;color:var(--ink-2);font-weight:600;min-width:0;max-width:100%}

.mrow{display:flex;align-items:stretch;border-bottom:1px solid var(--line-2)}
.maplist .mrow>button:first-child{border-bottom:0;flex:1;min-width:0}
.fixlink{all:unset;cursor:pointer;color:var(--accent);font:600 12.5px var(--f-body);text-decoration:underline;padding:4px 10px}
.fixlink:focus-visible{outline:2px solid var(--teal)}
.maplist .fixlink{width:auto;flex:none;display:flex;align-items:center;border-bottom:0;padding:4px 12px}
.fixpanel{margin-top:12px;border:1px solid var(--line);border-radius:8px;background:var(--sand);padding:14px 16px}
.fixhead{display:flex;justify-content:space-between;align-items:center;gap:10px}
.fixgrid{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:10px 14px}
.fixgrid label{display:grid;gap:4px;font-size:13px;font-weight:600;color:var(--ink-2);min-width:0}
.fixgrid .wide{grid-column:1/-1}
.fixgrid input,.fixgrid select,.fixgrid textarea{font:14px var(--f-body);padding:7px 10px;border:1px solid var(--line);background:#fff;color:var(--ink);border-radius:6px;width:100%;min-width:0}
/* Leaflet essentials, inlined because the CSP blocks external stylesheets */
.leaflet-pane,.leaflet-tile,.leaflet-marker-icon,.leaflet-marker-shadow,.leaflet-tile-container,.leaflet-pane>svg,.leaflet-pane>canvas,.leaflet-zoom-box,.leaflet-image-layer,.leaflet-layer{position:absolute;left:0;top:0}
.leaflet-container{overflow:hidden;font:13px var(--f-body);-webkit-tap-highlight-color:transparent;outline-offset:1px}
.leaflet-container a{color:var(--accent)}
.leaflet-pane{z-index:400}.leaflet-overlay-pane{z-index:400}.leaflet-marker-pane{z-index:600}.leaflet-tooltip-pane{z-index:650}.leaflet-popup-pane{z-index:700}
.leaflet-map-pane canvas{z-index:100}.leaflet-map-pane svg{z-index:200}
.leaflet-control{position:relative;z-index:800;pointer-events:auto;float:left;clear:both}
.leaflet-top,.leaflet-bottom{position:absolute;z-index:1000;pointer-events:none}.leaflet-top{top:0}.leaflet-right{right:0}.leaflet-bottom{bottom:0}.leaflet-left{left:0}
.leaflet-top .leaflet-control{margin-top:10px}.leaflet-left .leaflet-control{margin-left:10px}.leaflet-right .leaflet-control{float:right;margin-right:10px}.leaflet-bottom .leaflet-control{margin-bottom:10px}
.leaflet-bar{border:1px solid var(--line);border-radius:4px;background:var(--panel)}
.leaflet-bar a{display:block;width:30px;height:30px;line-height:30px;text-align:center;text-decoration:none;color:var(--ink);font:700 18px var(--f-body);border-bottom:1px solid var(--line)}
.leaflet-bar a:last-child{border-bottom:none}
.leaflet-control-attribution{background:var(--panel);color:var(--muted);font-size:11px;padding:0 6px;opacity:.9}
.leaflet-interactive{cursor:pointer}
.leaflet-grab{cursor:grab}.leaflet-dragging .leaflet-grab{cursor:grabbing}
.leaflet-zoom-animated{transform-origin:0 0}
.leaflet-zoom-anim .leaflet-zoom-animated{transition:transform .25s cubic-bezier(0,0,.25,1)}
.leaflet-popup{position:absolute;text-align:center;margin-bottom:20px}
.leaflet-popup-content-wrapper{background:var(--panel);color:var(--ink);border:1px solid var(--line);border-radius:6px;padding:1px;text-align:left;box-shadow:0 3px 12px #0003}
.leaflet-popup-content{margin:10px 14px;line-height:1.4;min-width:160px}
.leaflet-popup-tip-container{width:40px;height:20px;position:absolute;left:50%;margin-left:-20px;overflow:hidden;pointer-events:none}
.leaflet-popup-tip{width:17px;height:17px;padding:1px;margin:-10px auto 0;transform:rotate(45deg);background:var(--panel);border:1px solid var(--line)}
.leaflet-popup-close-button{position:absolute;top:0;right:0;width:24px;height:24px;font:16px/24px var(--f-body);text-align:center;text-decoration:none;color:var(--muted)}
.leaflet-tooltip{position:absolute;padding:4px 8px;background:var(--navy);color:#fff;border-radius:3px;white-space:nowrap;pointer-events:none;font-size:12px}
.emp-ic{background:var(--emp);color:#fff;font:600 11px var(--f-body);padding:2px 5px;border-radius:2px;white-space:nowrap;border:2px solid var(--panel);box-shadow:0 1px 3px #0005}
@media (max-width:560px){ .bar{grid-template-columns:minmax(0,1fr) auto;column-gap:10px;row-gap:4px} .bar .nm{white-space:normal} .bar .trk{grid-column:1/-1;grid-row:2;height:10px} .bar .v{min-width:0} .bars{gap:10px} .big3{grid-template-columns:1fr 1fr} .big3 .big{font-size:22px} #map{height:420px} section.desk{padding:16px} .tbl table{font-size:13px} .tbl th,.tbl td{padding:7px 8px} .tbl td:first-child,.tbl th:first-child{position:sticky;left:0;z-index:1;background:var(--panel);box-shadow:1px 0 0 var(--line-2)} .tbl thead th:first-child{background:var(--sand)} .tbl tr.bench td:first-child{background:var(--paper)} .tbl tr.hl td:first-child{background:var(--accent-soft)} }
@media (prefers-reduced-motion:reduce){ *{transition:none!important;scroll-behavior:auto!important} }

.econ *{box-sizing:border-box}
.econ h2,.econ h3{font-family:var(--f-display);color:var(--ink);line-height:1.2;margin:0;text-wrap:balance}
.page:has(.econ){max-width:1120px}
.econ{font-size:16px;line-height:1.55}
/* Tabular figures only on sans-serif numbers: in Lora the tnum feature also widens word spaces (Oct. 6, 2026). */
.econ table,.econ .bar .v,.econ .tk .row,.econ .tile .sub,.econ .big3 .lab,.econ .maplist small,.econ .chart text,.econ .tt{font-variant-numeric:tabular-nums}
/* Section links wrap on wide screens; phones keep the sideways scroll */
@media (min-width:900px){ nav.sec{flex-wrap:wrap;overflow:visible} }
@media (max-width:560px){ .ticker{display:flex;overflow-x:auto;padding-bottom:6px} .tk{flex:0 0 250px} }

.econ .tile .sub,.econ .sub{margin:0;display:block}
.econ button{margin-top:0}
.econ textarea{min-height:0}
.econ .mapbar input{width:auto;flex:1 1 220px}
.econ .mapbar select{width:auto}

.chip[aria-pressed="true"] .tag{color:#DCE6EF}
.maplist button:focus-visible{outline:2px solid var(--teal);outline-offset:-2px}
.chart svg:focus-visible,.tbl:focus-visible,.ticker:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
details.dt{margin-top:4px;font-size:13px}
details.dt summary{cursor:pointer;color:var(--navy);font-weight:600;padding:10px 0;display:inline-block}
details.dt .tbl{max-height:300px;overflow:auto;margin-top:2px}
details.dt thead th{position:sticky;top:0;z-index:2}
@media (pointer:coarse){ .chip{min-height:44px;padding-inline:14px} nav.sec a{min-height:44px;display:inline-flex;align-items:center} .fishbar input[type=checkbox]{width:22px;height:22px} .maplist button{min-height:44px} }

.tk .row span:first-child{white-space:nowrap;color:var(--ink-2)}
