/* Windsor Watchers Crime Map. Scoped cm-prefixed styles so the site restyle can change ww.css freely. */
.cm{--cm-bg:var(--ww-shadow,#0B1405);--cm-card:var(--ww-card,#142410);--cm-lime:var(--ww-lime,#9BE22E);--cm-yellow:var(--ww-yellow,#FFD400);--cm-text:var(--ww-text,#F4F8EA);--cm-muted:var(--ww-muted,#C5D6A0);--cm-rule:rgba(155,226,46,.28);
  max-width:1240px;margin:0 auto;padding:18px 20px 40px;color:var(--cm-text);font-family:var(--ww-sans,"Source Sans Pro",system-ui,sans-serif)}
.cm h1{font-family:var(--ww-display,"Alfa Slab One",Georgia,serif);font-weight:400;font-size:2.4rem;line-height:1.05;margin:.2em 0 .25em;color:var(--cm-yellow);text-shadow:0 2px 0 #000,0 0 18px rgba(255,212,0,.25);letter-spacing:.01em}
.cm h2{font-family:var(--ww-condensed,"Bebas Neue","Arial Narrow",sans-serif);font-weight:400;font-size:1.7rem;letter-spacing:.04em;color:var(--cm-lime);margin:1.4em 0 .4em}
.cm a{color:var(--cm-yellow)}
.cm a:hover,.cm a:focus-visible{color:#fff}
.cm-lede{font-size:1.02rem;max-width:62rem;color:var(--cm-text)}
.cm-range{display:inline-block;margin:.3em 0 .8em;padding:.5em .9em;border:2px solid var(--cm-yellow);border-radius:10px;background:linear-gradient(180deg,rgba(255,212,0,.16),rgba(255,212,0,.04));font-weight:700;color:var(--cm-yellow);box-shadow:0 0 0 3px rgba(0,0,0,.4) inset}
.cm-range span{color:var(--cm-text);font-weight:600}
.cm-layout{display:grid;grid-template-columns:minmax(0,1fr) 340px;grid-template-areas:'map ctl' 'map info';grid-template-rows:auto 1fr;gap:16px 18px;align-items:start}
.cm-controls{grid-area:ctl}.cm-mapwrap{grid-area:map}.cm-side{grid-area:info}
.cm-mapwrap{position:relative;border:3px solid var(--cm-lime);border-radius:14px;overflow:hidden;box-shadow:0 0 0 4px #000,0 10px 30px rgba(0,0,0,.6),0 0 24px rgba(155,226,46,.25)}
#cm-map{height:680px;background:#0B1405}
.cm-panel{background:linear-gradient(180deg,#1a2e12 0%,var(--cm-card) 60%);border:2px solid var(--cm-rule);border-radius:14px;padding:14px 16px;box-shadow:0 8px 24px rgba(0,0,0,.45)}
.cm-panel + .cm-panel{margin-top:14px}
.cm-panel h3{margin:0 0 .5em;font-family:var(--ww-condensed,"Bebas Neue",sans-serif);font-weight:400;font-size:1.35rem;letter-spacing:.05em;color:var(--cm-yellow)}
.cm-field{margin:0 0 12px}
.cm-field label,.cm-field .cm-flabel{display:block;font-size:.8rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--cm-muted);margin-bottom:5px}
.cm select{width:100%;font:inherit;font-size:.95rem;padding:9px 10px;border-radius:9px;border:2px solid var(--cm-lime);background:#0b1405;color:var(--cm-text)}
.cm-seg{display:flex;gap:6px;flex-wrap:wrap}
.cm-seg button,.cm-chips button{font:inherit;font-size:.86rem;font-weight:700;cursor:pointer;border-radius:999px;padding:7px 12px;border:2px solid var(--cm-lime);background:#0b1405;color:var(--cm-lime)}
.cm-seg button[aria-pressed="true"],.cm-chips button[aria-pressed="true"]{background:var(--ww-sheen,linear-gradient(180deg,#c8f65a,#9BE22E 52%,#6aad14));color:#0B1405;border-color:var(--cm-yellow)}
.cm-chips{display:flex;flex-wrap:wrap;gap:6px}
.cm-legend ol{list-style:none;margin:0;padding:0}
.cm-legend li{display:flex;align-items:center;gap:9px;font-size:.9rem;margin:4px 0}
.cm-sw{width:30px;height:18px;border-radius:4px;border:1.5px solid rgba(255,255,255,.55);flex:0 0 auto}
.cm-sw.nodata{background:repeating-linear-gradient(45deg,#141a0c 0 4px,#FFD400 4px 7px)}
.cm-sw.pt{width:18px;height:18px;border-radius:50%;background:var(--cm-yellow);border:3px solid #0B1405;box-shadow:0 0 0 2px var(--cm-yellow)}
.cm-note{font-size:.82rem;color:var(--cm-muted);margin:.5em 0 0}
.cm-info dl{margin:0;display:grid;grid-template-columns:auto 1fr;gap:3px 10px;font-size:.9rem}
.cm-info dt{color:var(--cm-muted)}
.cm-info dd{margin:0}
.cm-big{font-family:var(--ww-display,"Alfa Slab One",serif);font-size:2rem;color:var(--cm-lime);line-height:1.1;margin:.1em 0}
.cm-big.none{font-family:inherit;font-size:1.05rem;font-weight:700;color:var(--cm-yellow)}
.cm-tt.leaflet-tooltip{background:#0B1405;color:#F4F8EA;border:2px solid #FFD400;border-radius:10px;box-shadow:0 8px 22px rgba(0,0,0,.75);font:14px/1.4 "Source Sans Pro",system-ui,sans-serif;padding:9px 12px;max-width:300px;white-space:normal}
.cm-tt.leaflet-tooltip:before{display:none}
.cm-tt b{color:#FFD400}
.cm-tt .v{font-size:1.25rem;font-weight:700;color:#9BE22E}
.cm-lbl.leaflet-tooltip{background:transparent;border:0;box-shadow:none;color:#fff;font:700 12px/1 "Source Sans Pro",sans-serif;text-shadow:0 0 3px #000,0 0 3px #000,0 1px 2px #000;padding:0}
.cm-lbl.leaflet-tooltip:before{display:none}
.cm .leaflet-container{font-family:inherit}
.cm .leaflet-control-attribution{background:rgba(11,20,5,.85);color:#C5D6A0;font-size:11px}
.cm .leaflet-control-attribution a{color:#FFD400}
.cm .leaflet-control-zoom a{background:#0B1405;color:#9BE22E;border-bottom-color:#2c4a17}
.cm-tablewrap{overflow-x:auto;border:2px solid var(--cm-rule);border-radius:12px}
.cm table{border-collapse:collapse;width:100%;font-size:.92rem}
.cm th,.cm td{padding:8px 10px;border-bottom:1px solid rgba(155,226,46,.15);text-align:left;vertical-align:top}
.cm thead th{background:#0f1c0a;color:var(--cm-yellow);font-size:.8rem;text-transform:uppercase;letter-spacing:.05em}
.cm td.num{text-align:right;font-variant-numeric:tabular-nums;font-weight:700;color:var(--cm-lime)}
.cm td.nd{color:var(--cm-yellow);font-weight:600}
.cm tr.is-sel td{background:rgba(255,212,0,.08)}
.cm-sources li{margin:.35em 0;font-size:.9rem}
.cm-fine{font-size:.85rem;color:var(--cm-muted)}
.cm-stamp{display:inline-block;font-family:var(--ww-stamp,"Special Elite",monospace);color:var(--cm-yellow);border:2px dashed var(--cm-yellow);padding:2px 8px;border-radius:6px;transform:rotate(-1.5deg);font-size:.85rem}
@media (max-width: 900px){
  .cm{padding:12px 12px 32px}
  .cm h1{font-size:1.75rem}
  .cm-layout{grid-template-columns:1fr;grid-template-areas:'map' 'ctl' 'info';grid-template-rows:auto}
  #cm-map{height:440px}
}
@media (max-width: 420px){
  #cm-map{height:400px}
  .cm-seg button,.cm-chips button{padding:6px 10px;font-size:.8rem}
}

.cm path.leaflet-interactive:focus{outline:none}
@media (max-width: 600px){
  .cm table{font-size:.84rem}
  .cm th:nth-child(4),.cm td:nth-child(4){display:none}
  .cm th,.cm td{padding:7px 7px}
}

/* Epic pass, 10 Nov 2026: noir tiles without a third-party watermark, glow, cards, mobile sheet. */
.cm-noir-tiles{
  filter:saturate(.3) hue-rotate(72deg) brightness(.72) contrast(1.18);
}
#cm-map{background:#050a03}
.cm path.cm-glow-has{
  filter:drop-shadow(0 0 5px rgba(155,226,46,.9)) drop-shadow(0 0 1px rgba(255,212,0,.4));
}
.cm path.cm-glow-snap{
  filter:drop-shadow(0 0 4px rgba(255,212,0,.65));
}
.cm path.cm-glow-none{
  filter:drop-shadow(0 0 4px rgba(255,212,0,.8));
}
.cm path.cm-glow-sel{
  filter:drop-shadow(0 0 8px rgba(255,212,0,1)) drop-shadow(0 0 2px #9BE22E);
}
@media (prefers-reduced-motion:reduce){
  .cm path.cm-glow-has,.cm path.cm-glow-snap,.cm path.cm-glow-none,.cm path.cm-glow-sel{filter:none}
}
.cm-updated{margin:.15em 0 .55em;color:var(--cm-yellow);font-weight:700;font-size:.92rem}
.cm-map-stamp{
  position:absolute;left:10px;bottom:28px;z-index:500;
  margin:0;padding:4px 8px;border:1px solid var(--cm-yellow);border-radius:8px;
  background:rgba(11,20,5,.88);color:var(--cm-yellow);font-size:11px;font-weight:700;
  pointer-events:none;
}
.cm-tt.leaflet-tooltip{max-width:320px}
.cm-tt .cm-card-k{display:block;font-size:.78rem;letter-spacing:.04em;text-transform:uppercase;color:#C5D6A0;margin-top:4px}
.cm-tt .cm-trend{display:block;margin-top:4px;font-weight:700}
.cm-tt .cm-trend.up{color:#9BE22E}
.cm-tt .cm-trend.down{color:#FFD400}
.cm-tt .cm-trend.same{color:#C5D6A0}
.cm-tt .cm-src{display:block;margin-top:6px;font-size:.8rem;color:#C5D6A0}
.cm-info .cm-trend{display:inline-block;margin:.15em 0;font-weight:700}
.cm-info .cm-trend.up{color:var(--cm-lime)}
.cm-info .cm-trend.down{color:var(--cm-yellow)}
.cm-sheet{display:none}
@media (max-width:900px){
  main.cm{display:flex;flex-direction:column}
  /* Later sections defaulted to order 0, so they stacked above the map (order 1). */
  main.cm > *{order:10}
  main.cm > .crumbs,
  main.cm > h1,
  main.cm > .cm-updated,
  main.cm > .cc-missing-banner{order:0}
  main.cm > .cm-layout{order:1}
  main.cm > #cm-status{order:2}
  main.cm > .cm-lede,
  main.cm > .cm-range{order:5}
  #cm-map{height:min(62vh,520px);min-height:360px}
  .cm-side{display:none}
  .cm-sheet{
    display:block;position:fixed;left:0;right:0;bottom:0;z-index:40;
    max-height:58vh;overflow:auto;
    background:linear-gradient(180deg,#1a2e12 0%,#0B1405 70%);
    border-top:3px solid var(--cm-yellow);
    border-radius:16px 16px 0 0;
    box-shadow:0 -12px 30px rgba(0,0,0,.55);
    padding:10px 16px 20px;
    transform:translateY(110%);
    transition:transform .22s ease;
  }
  .cm-sheet.is-open{transform:translateY(0)}
  .cm-sheet-handle{width:44px;height:4px;border-radius:4px;background:#FFD400;margin:4px auto 8px}
  .cm-sheet-close{
    position:absolute;top:8px;right:10px;font:inherit;font-weight:700;cursor:pointer;
    border:2px solid var(--cm-lime);background:#0B1405;color:var(--cm-lime);
    border-radius:999px;padding:4px 10px
  }
  .cm-controls{position:relative}
}
@media (prefers-reduced-motion:reduce){
  .cm-sheet{transition:none}
}

/* 10 Nov 2026: even pill grids; Lakeshore and Belle River are separate. */
.cm-controls .cm-flabel-sub{margin:8px 0 5px;font-size:.74rem}
.cm-controls .cm-seg,
.cm-controls .cm-chips{
  display:grid;
  gap:6px;
  align-items:stretch;
}
.cm-controls .cm-seg button,
.cm-controls .cm-chips button{
  width:100%;
  min-height:2.25rem;
  height:100%;
  box-sizing:border-box;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  text-align:center;
  line-height:1.15;
  padding:6px 8px;
  white-space:normal;
}
.cm-controls .cm-seg-months{margin-top:6px;grid-template-columns:repeat(4,1fr)}
.cm-controls .cm-seg-wards{margin-top:6px;grid-template-columns:repeat(5,1fr)}
.cm-controls .cm-seg-windsor{grid-template-columns:repeat(2,1fr)}
.cm-controls .cm-seg-towns{grid-template-columns:repeat(3,1fr)}
.cm-controls .cm-chips{grid-template-columns:repeat(3,1fr)}
.cm-controls .cm-count{font-weight:700;margin-left:.2em;opacity:.9}
.cm-controls button[disabled]{opacity:.42;cursor:not-allowed}
@media (max-width:420px){
  .cm-controls .cm-seg button,
  .cm-controls .cm-chips button{font-size:.8rem;padding:6px 6px}
}

/* Per 1,000 residents layer (preview, 12 Nov 2026). Off by default. */
.cm-sw.few{background:repeating-linear-gradient(45deg,#2a2410 0 4px,#c4a574 4px 7px)}
.cm-sw.rate-none{background:#1c2a14;box-shadow:inset 0 0 0 1px rgba(255,255,255,.25)}
.cm-rate-credit{margin-top:.55em}
.cm-rate-credit[hidden]{display:none}
#cm-rate-field #cm-rate-toggle[aria-pressed="true"]{background:var(--ww-sheen,linear-gradient(180deg,#c8f65a,#9BE22E 52%,#6aad14));color:#0B1405;border-color:var(--cm-yellow)}

/* 12 Nov 2026: stop the page sliding sideways on phones and mid-width screens.
   The map wrap is already clipped and is not the source of the overflow.
   On a 390px phone the seven-column Crime Watch ward table is about 15px
   wider than the viewport. On mid-width screens the header reward stamp
   is placed at left 640px and is 448px wide, so it hangs off the page
   until the 640px hide rule kicks in. Clipping the header keeps the stamp
   in place on wide screens and stops it widening the page. The ward table
   scrolls inside its own wrapper, so every column stays reachable. */
header.mast{
  overflow-x:clip;
}
#crime-watch .cm-table-scroll{
  overflow-x:auto;
  max-width:100%;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-x:contain;
}