html,body{margin:0;min-height:100%;font-family:Inter,Arial,sans-serif;background:#eef3f6;color:#102534}
:root{--navy:#082c3d;--title:#103d37;--green:#07976a;--green-dark:#077653;--border:#d9e2e7;--muted:#6c7b86;--panel:#fff;--shadow:0 5px 18px rgba(18,52,68,.07)}
*{box-sizing:border-box}button,select,input{font:inherit}button,select{cursor:pointer}.small{font-size:11px;color:var(--muted)}
#app{min-height:100vh;background:#eef3f6;padding-left:220px}.dashboardShell{width:100%;max-width:1900px;margin:0 auto;padding:22px 24px 18px}
.routingSidebar{position:fixed;z-index:1200;left:0;top:0;bottom:0;width:220px;background:linear-gradient(180deg,#071f2d,#07384d);color:#fff;box-shadow:8px 0 24px rgba(0,0,0,.15);display:flex;flex-direction:column}
.routingSidebarHeader{padding:21px 17px 15px;border-bottom:1px solid rgba(255,255,255,.11)}.routingHome{display:block;color:#fff;text-decoration:none;font-weight:800;font-size:13.5px;margin-bottom:20px}.routingHome span{color:#2ed7a3}.routingSidebarTitle{font-size:21.6px;font-weight:800}.routingSidebarSubtitle{margin-top:7px;font-size:10px;text-transform:uppercase;letter-spacing:.15em;color:#9fb4c0}.routingSidebarList{overflow-y:auto;padding:10px 8px 18px}.routingKeyButton{width:100%;border:0;background:transparent;color:#dbe6ec;text-align:left;border-radius:8px;padding:9px 10px;margin:2px 0;display:grid;grid-template-columns:44px 1fr;gap:8px;align-items:center}.routingKeyButton strong{font-size:11.7px;color:#fff}.routingKeyButton span{font-size:11px;line-height:1.25;color:#b7c7d0}.routingKeyButton:hover{background:rgba(255,255,255,.08)}.routingKeyButton.active{background:linear-gradient(90deg,#0d9569,#10b67c)}.routingKeyButton.active span{color:#effff8}
.marketHeader{display:flex;align-items:center;justify-content:space-between;gap:18px;margin-bottom:14px}.marketHeading h1{margin:0;color:var(--title);font-size:27px;line-height:1.1;letter-spacing:-.03em}.marketHeading .small{margin-top:5px}.headerActions{display:flex;align-items:flex-end;gap:12px}.marketPicker{width:220px}.marketPicker span,.filterBox label{display:block;margin-bottom:5px;font-size:10px;font-weight:800;color:#64747f;text-transform:uppercase;letter-spacing:.07em}.marketPicker select,.filterBox select{width:100%;padding:9px 10px;border:1px solid #c8d4dc;border-radius:8px;background:#fff;color:#203d4c;font-size:11px}.badge{background:#e5f7f0;color:#087654;border-radius:999px;padding:5px 10px;font-size:10px;font-weight:800;margin-bottom:6px}
.dashboardSummaryCard{margin-bottom:12px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);overflow:visible}.dashboardSummaryCard .filterBar{border:0;border-radius:0;box-shadow:none;margin-bottom:0;padding-bottom:10px}.dashboardSummaryCard .metrics{margin:0;padding:0 12px 12px}.dashboardSummaryCard .metricCard{box-shadow:none}
.filterBar{position:relative;display:grid;grid-template-columns:minmax(110px,.72fr) minmax(165px,1.15fr) minmax(150px,1fr) auto auto;gap:10px;align-items:end;padding:12px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow);margin-bottom:10px}.quickFilter{min-width:0}.resetButton,.moreFilters>summary{height:36px;border:1px solid #bfd0d8;border-radius:8px;background:#fff;color:#315263;font-size:11px;font-weight:800;display:flex;align-items:center;justify-content:center;padding:0 12px;white-space:nowrap}.resetButton:hover,.moreFilters>summary:hover{border-color:var(--green);color:var(--green-dark)}.moreFilters>summary{list-style:none}.moreFilters>summary::-webkit-details-marker{display:none}.moreFiltersOpenLabel{display:none}.moreFilters[open] .moreFiltersClosedLabel{display:none}.moreFilters[open] .moreFiltersOpenLabel{display:inline}.moreFiltersPanel{max-height:min(70vh,620px);overflow-y:auto;position:absolute;z-index:1150;right:0;top:48px;width:min(760px,calc(100vw - 270px));padding:14px;background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:0 14px 34px rgba(13,47,64,.18)}.moreFiltersPanelHeader{position:sticky;top:-14px;z-index:1;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:0 0 10px;margin-bottom:10px;border-bottom:1px solid var(--border);background:#fff;color:#315263;font-size:13px}.closeMoreFilters{border:1px solid #bfd0d8;border-radius:8px;background:#fff;color:#315263;font:inherit;font-weight:700;min-height:36px;padding:0 10px;cursor:pointer}.closeMoreFilters:hover{border-color:var(--green);color:var(--green-dark)}.closeMoreFilters:focus-visible,.moreFilters>summary:focus-visible{outline:2px solid var(--green);outline-offset:2px}.filterGrid{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.timelapseBox{margin-top:12px;padding-top:12px;border-top:1px solid #e3e9ec}.timelapseTitle{font-size:11px;font-weight:800;color:#24475a;margin-bottom:9px}.timelapseGrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.timelineActions{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;margin-top:10px}.timelineActions button{border:0;border-radius:7px;padding:8px 13px;background:var(--green);color:#fff;font-size:11px;font-weight:800}.timelapsePeriod{margin-top:7px;color:var(--muted);font-size:10px}.marketContextRow{min-height:20px;margin:0 2px 9px}.period{font-size:11px;font-weight:700;color:#60727e}
.metrics{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-bottom:12px}.card,.mapCard,.insightsCard,.tableCard,.analysisDrawer,.chartCard{background:#fff;border:1px solid var(--border);border-radius:12px;box-shadow:var(--shadow)}.metricCard{min-height:78px;padding:12px 14px;display:flex;align-items:center;gap:11px}.metricIcon{width:36px;height:36px;display:grid;place-items:center;flex:0 0 auto;border-radius:50%;background:#e7f7f1;color:var(--green);font-size:15.3px;font-weight:800}.metricLabel{font-size:10px;color:#6a7984;text-transform:uppercase;letter-spacing:.04em}.metricValue{margin-top:4px;font-size:19.8px;line-height:1.1;font-weight:800;color:#193746;letter-spacing:-.025em}.metricRange{font-size:13.5px}
.dashboardWorkspace{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(390px,.82fr);gap:12px;align-items:start}.mapCard{min-width:0;overflow:hidden}.panelHeader{height:54px;padding:10px 13px;border-bottom:1px solid #e2e8eb;display:flex;align-items:center;justify-content:space-between;gap:12px}.panelTitle{font-size:12.6px;font-weight:800;color:#173b4f}.panelSubtext{margin-top:2px;font-size:10px;color:var(--muted)}.mapStatusGroup{display:flex;flex-direction:column;align-items:flex-end;gap:3px}.boundaryStatus{font-size:9px;font-weight:800;color:#087c57;text-transform:uppercase;letter-spacing:.04em}.boundaryStatus.error{color:#9b3d3d}.notice{font-size:10px;color:#56707d;text-align:right}.mapViewport{position:relative;height:605px;background:#dce6eb}.mapViewport #map{width:100%;height:100%}.mapCenterButton{position:absolute;z-index:1000;top:82px;left:10px;width:32px;height:32px;padding:0;border:1px solid #aebbc2;border-radius:3px;background:#fff;color:#203d4c;box-shadow:0 1px 4px rgba(0,0,0,.22);font-size:17.1px;font-weight:800;line-height:30px}.mapCenterButton:hover{background:#f2f7f8;color:var(--green-dark)}.mapCenterButton:focus-visible{outline:3px solid rgba(7,151,106,.3);outline-offset:2px}.legend{position:absolute;z-index:1000;left:12px;bottom:12px;max-width:calc(100% - 24px);background:rgba(255,255,255,.96);border:1px solid #cad6dc;border-radius:10px;box-shadow:0 6px 18px rgba(22,52,68,.14);font-size:10px}.legendHeader{list-style:none;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:8px 10px;color:#173b4f;font-weight:800}.legendHeader::-webkit-details-marker{display:none}.legendBody{padding:0 10px 9px;display:flex;gap:10px;flex-wrap:wrap}.legendItem{white-space:nowrap}.dot{display:inline-block;width:8px;height:8px;border-radius:50%;margin-right:4px}.insightsColumn{display:grid;gap:12px;min-width:0}.insightsCard{overflow:hidden}.analysisTabs{display:grid;grid-template-columns:repeat(2,1fr);border-bottom:1px solid #dde5e9}.analysisTab{border:0;border-right:1px solid #e2e8eb;background:#f6f9fa;color:#647581;padding:11px 7px;font-size:10px;font-weight:800}.analysisTab:last-child{border-right:0}.analysisTab.active{background:#fff;color:var(--green-dark);box-shadow:inset 0 -3px 0 var(--green)}.tabPanel{padding:13px}.tabPanel[hidden]{display:none!important}.rankingCard{border:0;background:#fff}.sectionTitleRow,.secondaryInsightHeader{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.sectionTitleRow b,.secondaryInsightHeader b{font-size:13.5px;color:#173b4f}.rankingNote{font-size:10px;color:#7a8790;margin-top:3px}.rankToggle{display:flex;border:1px solid #c7d2d8;border-radius:7px;overflow:hidden}.rankToggle button{border:0;background:#fff;padding:6px 8px;font-size:9px;font-weight:800}.rankToggle button.active{background:var(--green);color:#fff}.compactRankingControls{display:flex;gap:7px;margin:9px 0 3px}.compactRankingControls select{width:auto;min-width:118px;padding:6px 7px;border:1px solid #ccd7dd;border-radius:7px;background:#fff;color:#294958;font-size:10px}.rankingChartWrap{height:285px}.rankingList{min-height:300px;padding-top:10px}.neighbourhoodRankRow{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:9px;align-items:center;padding:8px 0;border-bottom:1px solid #edf1f3}.neighbourhoodRankNumber{width:20px;height:20px;display:grid;place-items:center;border-radius:50%;background:#edf4f5;color:#526b77;font-size:9px;font-weight:800}.neighbourhoodRankDetails{min-width:0}.neighbourhoodRankLabel{display:flex;justify-content:space-between;gap:8px;margin-bottom:5px;font-size:10px}.neighbourhoodRankLabel strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#244657}.neighbourhoodRankLabel span{color:#7a8790;white-space:nowrap}.neighbourhoodRankTrack{height:6px;overflow:hidden;border-radius:999px;background:#e8eef0}.neighbourhoodRankTrack span{display:block;height:100%;border-radius:inherit}.neighbourhoodRankTrack span.top{background:#0a9b6c}.neighbourhoodRankTrack span.bottom{background:#c52b2b}.neighbourhoodRankValue{font-size:10px;color:#173b4f;white-space:nowrap}.rankingEmpty{padding:30px 12px;text-align:center;color:#71808a;font-size:11px}.recentSalesCard{overflow:hidden}.tableHeader{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;border-bottom:1px solid #e3e8ec}.tableHeader b{font-size:12.6px;color:#173b4f}.viewAllLabel{font-size:10px;color:var(--green-dark);font-weight:700}.tableWrap{height:244px;overflow:auto}table{width:100%;border-collapse:collapse;font-size:10px}th,td{padding:8px 8px;text-align:left;border-bottom:1px solid #edf1f3}th{position:sticky;top:0;z-index:1;background:#f6f9fa;color:#63717c;font-weight:800}th.sortable{cursor:pointer}#propertyTableBody tr{cursor:pointer}#propertyTableBody tr:hover{background:#f4fbf8}td.price,td.date{white-space:nowrap}
.analysisDrawer{margin-top:12px;overflow:hidden}.analysisDrawer>summary{list-style:none;cursor:pointer;padding:12px 14px;font-size:11px;font-weight:800;color:#173b4f}.analysisDrawer>summary::-webkit-details-marker{display:none}.analysisDrawer>summary:after{content:'＋';float:right;color:var(--green)}.analysisDrawer[open]>summary:after{content:'−'}.analysisContent{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:0 12px 12px}.chartCard{padding:11px;box-shadow:none}.chartCard b{font-size:11px}.chartWrap{height:220px;margin-top:7px}.dashboardFooter{display:flex;gap:18px;align-items:center;padding:16px 3px 0;color:#71808a;font-size:10px}.dashboardFooter strong{color:#315261}.popup-address,.popup-price{font-weight:700}
@media(max-width:1200px){#app{padding-left:190px}.routingSidebar{width:190px}.filterBar{grid-template-columns:repeat(4,1fr) auto auto}.dashboardWorkspace{grid-template-columns:1fr}.mapViewport{height:520px}.insightsColumn{grid-template-columns:1fr 1fr}.analysisContent{grid-template-columns:1fr}.moreFiltersPanel{width:min(720px,calc(100vw - 230px))}}
@media(max-width:800px){#app{padding-left:0;padding-top:116px}.dashboardShell{padding:14px 12px}.routingSidebar{left:0;right:0;top:0;bottom:auto;width:auto;height:116px}.routingSidebarHeader{padding:9px 12px 5px}.routingHome{display:none}.routingSidebarTitle{font-size:16.2px}.routingSidebarSubtitle{font-size:9px}.routingSidebarList{display:flex;overflow-x:auto;overflow-y:hidden;padding:5px 8px}.routingKeyButton{flex:0 0 auto;width:auto;min-width:92px;grid-template-columns:1fr;gap:2px;padding:6px 8px}.routingKeyButton span{max-width:120px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.marketHeader{align-items:flex-start}.headerActions{align-items:flex-start}.badge{display:none}.filterBar{grid-template-columns:1fr 1fr}.moreFiltersPanel{top:100%;left:0;right:auto;width:100%}.filterGrid{grid-template-columns:1fr 1fr}.metrics{grid-template-columns:1fr 1fr}.insightsColumn{grid-template-columns:1fr}.mapViewport{height:480px}.analysisContent{grid-template-columns:1fr}}
@media(max-width:520px){.marketHeader{display:block}.headerActions{margin-top:12px}.marketPicker{width:100%}.filterBar{grid-template-columns:1fr}.filterGrid,.timelapseGrid{grid-template-columns:1fr}.metrics{grid-template-columns:1fr}.mapViewport{height:450px}.dashboardFooter{flex-direction:column;align-items:flex-start;gap:4px}}
/* Keep the map dashboard usable on narrow screens without overlaying its data. */
@media (max-width: 800px) {
.routingSidebarHeader { display: none; }
.routingSidebarList { height: 100%; align-items: center; padding: 6px 10px; }
.routingKeyButton { min-height: 48px; margin: 0; }
.filterBar > .quickFilter { min-width: 0; }
.moreFiltersPanel { max-height: min(60vh, 520px); }
.tableWrap { max-width: 100%; overflow-x: auto; }
.tableWrap table { min-width: 460px; }
}
@media (max-width: 520px) {
.dashboardShell { padding: 12px 10px 18px; }
.marketHeader { margin-bottom: 10px; }
.filterBar { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.filterBar .propertyTypeQuickFilter { grid-column: 1 / -1; }
.filterBar .moreFilters { min-width: 0; }
.filterBar .moreFilters > summary, .filterBar .resetButton { width: 100%; }
.filterBar .moreFilters[open] { grid-column: 1 / -1; }
.filterBar .moreFilters[open] ~ .resetButton { grid-column: 1 / -1; }
.moreFiltersPanel { position: static; width: 100%; max-height: none; overflow: visible; margin-top: 8px; padding: 12px; box-shadow: none; }
.moreFiltersPanelHeader { position: static; }
.filterGrid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.timelapseGrid { grid-template-columns: 1fr; }
.metrics { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.metricCard { min-width: 0; min-height: 80px; padding: 10px; gap: 8px; }
.metricIcon { width: 30px; height: 30px; }
.metricValue { overflow-wrap: anywhere; }
.mapPanelHeader { height: auto; min-height: 54px; flex-wrap: wrap; }
.mapStatusGroup { align-items: flex-start; }
.mapViewport { height: clamp(320px, 55vh, 450px); }
.sectionTitleRow { flex-wrap: wrap; }
.compactRankingControls { flex-wrap: wrap; }
.compactRankingControls select { flex: 1 1 140px; min-width: 0; }
}
/* Shared rankings layout for streets and neighbourhoods. */
.localRankings .rankingHeader{display:flex;align-items:center;flex-wrap:wrap;gap:8px;padding:12px 12px 8px}
.localRankings .rankingHeader h2{margin:0;font-size:15px;line-height:1.3;color:#173b4f}
.localRankings #rankingContext{margin-right:auto;color:#6c7b86;font-size:12px}
.localRankings .rankToggle{flex:0 0 auto}
.localRankings .rankToggle button{min-height:36px;padding:7px 10px;font-size:12px}
.localRankings .rankingToolbar{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;padding:0 12px 12px}
.localRankings .rankingToolbar label{min-width:0;font-size:12px;font-weight:700;color:#536976}
.localRankings .rankingToolbar select{display:block;width:100%;min-height:36px;margin-top:4px;padding:6px 9px;border:1px solid #c8d4dc;border-radius:7px;background:#fff;color:#203d4c;font-size:13px}
.localRankings .analysisTab{min-height:42px;padding:8px;font-size:13px}
.localRankings .tabPanel{padding:4px 12px 12px}
.localRankings .rankingList{min-height:0;padding:0}
.localRankings .rankRow{display:grid;grid-template-columns:24px minmax(0,1fr) auto;gap:9px;align-items:center;width:100%;min-height:62px;padding:9px 3px;border:0;border-bottom:1px solid #e9eef0;background:#fff;color:#173b4f;text-align:left}
.localRankings .rankRow:last-child{border-bottom:0}
.localRankings .rankRow:not(:disabled):hover,.localRankings .rankRow.selected{background:#eef8f3}
.localRankings .rankRow.selected{box-shadow:inset 3px 0 0 var(--green)}
.localRankings .rankRow:disabled{cursor:default;opacity:1}
.localRankings .rankNumber{display:grid;place-items:center;width:22px;height:22px;border-radius:50%;background:#edf4f5;color:#526b77;font-size:11px;font-weight:800}
.localRankings .rankDetails{display:flex;min-width:0;flex-direction:column;gap:2px}
.localRankings .rankLabel{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;font-weight:700}
.localRankings .rankCount{font-size:11px;color:#617581}
.localRankings .rankTrack{height:4px;margin-top:4px;overflow:hidden;border-radius:999px;background:#e8eef0}
.localRankings .rankFill{display:block;height:100%;border-radius:inherit;background:var(--green)}
.localRankings .rankValue{white-space:nowrap;font-size:13px;font-variant-numeric:tabular-nums}
.localRankings .rankingEmpty{min-height:0;margin:0;padding:20px 8px;text-align:center;font-size:13px;line-height:1.5;color:#617581}
.localRankings .rankingShowAll{display:none;width:100%;margin-top:8px;padding:9px;border:1px solid #c8d4dc;border-radius:8px;background:#fff;color:var(--green-dark);font-size:13px;font-weight:700}
@media(max-width:600px){
.localRankings .rankingHeader{gap:6px}
.localRankings .rankingHeader h2{flex:1 0 auto}
.localRankings #rankingContext{display:none}
.localRankings .rankToggle button{min-height:44px}
.localRankings .rankingToolbar select{min-height:44px}
.localRankings .rankingList:not(.expanded) .rankRow:nth-child(n+6){display:none}
.localRankings .rankingShowAll:not([hidden]){display:block}
}
.neighborhoodOutlineInfo:not([hidden]){position:absolute;z-index:1001;top:12px;right:12px;max-width:min(70%,320px);padding:8px 10px;border:1px solid #b6d8c6;border-radius:8px;background:rgba(255,255,255,.96);box-shadow:0 2px 8px rgba(8,44,61,.12);color:#164d37;font-size:12px;font-weight:700;line-height:1.35;pointer-events:none}
@media(max-width:520px){.neighborhoodOutlineInfo:not([hidden]){max-width:calc(100% - 78px);font-size:11px}}