:root{
  --sidebar-width:410px;
  --topbar-height:60px;
  --detail-width:420px;
  --blue:#1F5FBF;
  --blue-dark:#174A96;
  --blue-soft:#EAF2FF;
  --blue-faint:#F3F7FD;
  --school:#183B66;
  --pool:#145B63;
  --pool-focus:#00A6D6;
  --focus:#FF8A1F;
  --text:#17212B;
  --subtle:#66717C;
  --hairline:rgba(15,23,42,.10);
  --shadow:0 18px 52px rgba(30,50,80,.17);
  --focus-ring:0 0 0 3px rgba(31,95,191,.20);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","Noto Sans KR",Arial,sans-serif;
}
*{box-sizing:border-box}
html,body,#app{width:100%;height:100%;margin:0}
body{overflow:hidden;color:var(--text);background:#e9eef4;font-size:14px;font-weight:400}
button,input{font:inherit}
button{border:1px solid rgba(15,23,42,.09);color:var(--text);cursor:pointer}
button:focus-visible,input:focus-visible,a:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.material-bar{background:rgba(249,251,254,.82);backdrop-filter:saturate(150%) blur(24px);-webkit-backdrop-filter:saturate(150%) blur(24px)}
.material-regular{background:rgba(248,250,253,.88);backdrop-filter:saturate(145%) blur(20px);-webkit-backdrop-filter:saturate(145%) blur(20px)}
.material-thin{background:rgba(255,255,255,.74);backdrop-filter:saturate(140%) blur(14px);-webkit-backdrop-filter:saturate(140%) blur(14px)}
.material-thick{background:rgba(253,254,255,.94);backdrop-filter:saturate(155%) blur(28px);-webkit-backdrop-filter:saturate(155%) blur(28px)}

.app-shell{display:grid;grid-template-rows:var(--topbar-height) 1fr;height:100%}
.topbar{position:relative;z-index:1200;display:flex;align-items:center;justify-content:space-between;padding:0 14px;border-bottom:1px solid var(--hairline);box-shadow:0 1px 8px rgba(15,23,42,.04)}
.brand{display:flex;align-items:center;gap:10px;min-width:0}
.brand-logo{width:42px;height:42px;object-fit:contain;flex:0 0 auto}
.brand-copy{min-width:0}
.eyebrow{font-size:14px;font-weight:600;color:var(--blue-dark);line-height:1.15}
.brand h1{margin:2px 0 0;font-size:20px;line-height:1.15;letter-spacing:-.035em;font-weight:700}
.top-actions{display:flex;align-items:center;gap:8px}
.button{min-height:40px;padding:0 15px;border-radius:12px;font-size:14px;font-weight:600;background:rgba(255,255,255,.80);transition:background .16s ease,transform .16s ease,box-shadow .16s ease,border-color .16s ease}
.button:hover{transform:translateY(-1px)}
.button-primary{color:#fff;background:var(--blue);border-color:transparent}
.button-primary:hover{background:var(--blue-dark)}
.button-primary.is-active{background:#6D3BD1}
.button-secondary:hover{background:#edf3fb}
.icon-button{width:40px;height:40px;border-radius:50%;background:rgba(255,255,255,.80);font-size:16px;font-weight:700}

.workspace{position:relative;min-height:0}
.sidebar{position:absolute;z-index:900;inset:0 auto 0 0;width:var(--sidebar-width);border-right:1px solid var(--hairline)}
.sidebar-scroll{height:100%;overflow:auto;scrollbar-width:thin;scrollbar-color:rgba(80,95,110,.38) transparent}
.control-block{padding:12px;border-bottom:1px solid rgba(15,23,42,.07)}
.search-control{padding-top:14px}
.control-title-row{display:flex;align-items:center;justify-content:flex-start;gap:10px;margin-bottom:9px}
.control-title{font-size:14px;font-weight:700}
.control-help{font-size:14px;font-weight:400;color:var(--subtle)}
.search-box{display:flex;align-items:center;gap:9px;height:46px;padding:0 13px;border:1px solid rgba(31,95,191,.16);border-radius:14px;background:rgba(255,255,255,.82);transition:border-color .16s ease,box-shadow .16s ease,background .16s ease}
.search-box:focus-within{border-color:rgba(31,95,191,.52);box-shadow:var(--focus-ring);background:rgba(255,255,255,.96)}
.search-box span{font-size:18px;color:var(--subtle)}
.search-box input{width:100%;border:0;outline:0;background:transparent;color:var(--text);font-size:14px;font-weight:400}
.search-box input::placeholder{color:#87929D}
.chip-row{display:flex;flex-wrap:wrap;gap:8px}
#regionFilters,#transportFilters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none}
#regionFilters::-webkit-scrollbar,#transportFilters::-webkit-scrollbar{display:none}
#regionFilters{gap:6px}
#regionFilters .chip{padding:0 10px;flex:0 0 auto}
#transportFilters .chip{flex:0 0 auto}
.chip{min-height:34px;padding:0 12px;border-radius:999px;background:rgba(255,255,255,.80);font-size:14px;font-weight:500;transition:background .14s ease,color .14s ease,border-color .14s ease}
.chip:hover{background:#F0F5FB}
.chip.active{color:#fff;background:var(--blue);border-color:transparent}

.list-section{border-top:1px solid var(--hairline)}
.list-heading{position:sticky;top:0;z-index:2;padding:13px 14px;background:rgba(248,250,253,.94);backdrop-filter:blur(18px);border-bottom:1px solid rgba(15,23,42,.06)}
.list-heading div{display:flex;align-items:baseline;gap:5px}
.list-heading strong{font-size:18px;font-weight:700}
.list-heading span{font-size:14px;font-weight:400;color:var(--subtle)}
.school-list{padding:5px 8px 20px}
.school-card{width:100%;display:grid;grid-template-columns:38px 1fr auto;align-items:center;gap:10px;padding:12px 9px;border:0;border-radius:14px;background:transparent;text-align:left;transition:background .14s ease,box-shadow .14s ease}
.school-card:hover{background:rgba(31,95,191,.07)}
.school-card.active{background:rgba(31,95,191,.11);box-shadow:inset 0 0 0 1px rgba(31,95,191,.18)}
.school-badge{width:38px;height:38px;display:grid;place-items:center;border-radius:11px;background:var(--blue);color:#fff;font-size:14px;font-weight:700}
.school-main{min-width:0}
.school-name{display:flex;align-items:center;gap:7px;font-size:16px;font-weight:700;letter-spacing:-.02em;min-width:0}
.school-meta{display:block;margin-top:4px;color:var(--subtle);font-size:14px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.transport-tag{padding:3px 7px;border-radius:7px;background:#E7F3F0;color:var(--pool);font-size:14px;font-weight:600;flex:0 0 auto}
.school-arrow{font-size:18px;font-weight:400;color:#8794A0}
.empty-state{padding:34px 14px;text-align:center;color:var(--subtle);font-size:14px;line-height:1.55}

.map-area{position:absolute;inset:0 0 0 var(--sidebar-width)}
#map{width:100%;height:100%;background:#dbe5e8}
.leaflet-control-attribution{font-size:11px}
.leaflet-control-zoom{border:0!important;box-shadow:0 6px 22px rgba(15,23,42,.14)!important}
.leaflet-control-zoom a{border:0!important;background:rgba(255,255,255,.94)!important}
.map-legend{position:absolute;z-index:800;left:14px;bottom:14px;display:flex;flex-wrap:wrap;gap:12px;padding:10px 13px;border:1px solid rgba(15,23,42,.08);border-radius:14px;box-shadow:0 8px 26px rgba(15,23,42,.10);font-size:14px;font-weight:500}
.map-legend span{display:flex;align-items:center;gap:6px}
.legend-dot{width:9px;height:9px;border-radius:50%;display:inline-block}
.school-dot{background:var(--school)}
.pool-dot{background:var(--pool)}
.used-dot{background:var(--focus)}
.candidate-dot{background:#6D28D9}
.candidate-hint{position:absolute;z-index:850;top:14px;left:50%;transform:translateX(-50%);padding:11px 15px;border:1px solid rgba(109,59,209,.20);border-radius:999px;color:#5B2AA8;font-size:14px;font-weight:600;box-shadow:0 10px 28px rgba(15,23,42,.11)}

.detail-panel,.candidate-panel{position:absolute;z-index:1000;top:14px;right:14px;bottom:14px;width:min(var(--detail-width),calc(100vw - 42px));border:1px solid rgba(15,23,42,.09);border-radius:22px;box-shadow:var(--shadow);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin;scrollbar-color:rgba(80,95,110,.38) transparent}
.detail-panel[hidden],.candidate-panel[hidden]{display:none}
.panel-close,.dialog-close{position:absolute;z-index:2;top:12px;right:12px;width:38px;height:38px;border-radius:50%;background:rgba(235,240,246,.92);font-size:18px;font-weight:500;line-height:1;transition:background .14s ease}
.panel-close:hover,.dialog-close:hover{background:#e4ebf4}
#detailContent,#candidateContent{padding:26px 22px 30px}
.panel-kicker,.dialog-kicker{color:var(--blue);font-size:14px;font-weight:600}
.panel-title{margin:5px 46px 2px 0;font-size:18px;line-height:1.35;letter-spacing:-.035em;font-weight:700}
.panel-subtitle{margin-top:7px;color:var(--subtle);font-size:14px;font-weight:400;line-height:1.5}
.detail-section{margin-top:20px;padding-top:18px;border-top:1px solid var(--hairline)}
.detail-section h3{margin:0 0 11px;font-size:16px;font-weight:700}
.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.metric-grid-3{grid-template-columns:repeat(2,1fr)}
.metric-card{padding:13px;border:1px solid rgba(31,95,191,.08);border-radius:15px;background:rgba(239,245,253,.88)}
.metric-card.wide{grid-column:1/-1}
.metric-card span{display:block;color:var(--subtle);font-size:14px;font-weight:400}
.metric-card strong{display:block;margin-top:5px;font-size:18px;font-weight:700;letter-spacing:-.02em;line-height:1.28}
.metric-card strong.compact{font-size:16px}
.action-row{display:grid;grid-template-columns:1fr 1fr;gap:9px}
.link-button{display:grid;place-items:center;min-height:44px;border-radius:13px;text-decoration:none;font-size:14px;font-weight:600;transition:transform .14s ease,background .14s ease}
.link-button:hover{transform:translateY(-1px)}
.link-button.primary{color:#fff;background:var(--blue)}
.link-button.secondary{color:var(--blue-dark);background:var(--blue-soft);border:1px solid rgba(31,95,191,.12)}
.source-note{margin-top:18px;color:#77838E;font-size:14px;font-weight:400;line-height:1.6}
.usage-school-list{display:grid;gap:7px}
.usage-school{display:grid;grid-template-columns:1fr auto;gap:10px;align-items:center;width:100%;padding:11px 12px;border-radius:12px;background:rgba(244,247,251,.92);font-size:14px;text-align:left}
.usage-school:hover{background:#EDF3FA}
.usage-school-main strong{display:block;font-size:14px;font-weight:600}
.usage-school-main small{display:block;margin-top:3px;color:var(--subtle);font-size:14px;font-weight:400}
.usage-school-value{color:#B84F09;font-size:14px;font-weight:600;white-space:nowrap}

.candidate-tabs{display:flex;gap:8px;align-items:center;margin-top:15px}
.candidate-empty{margin-top:18px;padding:18px;border:1px solid rgba(31,95,191,.10);border-radius:16px;background:rgba(239,245,253,.82)}
.candidate-empty strong{display:block;font-size:16px;font-weight:700}
.candidate-empty p{margin:8px 0 14px;color:var(--subtle);font-size:14px;font-weight:400;line-height:1.6}
.candidate-empty .button{width:100%}
.candidate-tab,.candidate-add{width:38px;height:38px;border-radius:12px;background:rgba(255,255,255,.88);font-size:14px;font-weight:700}
.candidate-tab{box-shadow:inset 0 -3px 0 var(--tab-color)}
.candidate-tab.active{color:#fff;background:var(--tab-color);border-color:transparent;box-shadow:none}
.candidate-add:disabled{opacity:.35;cursor:not-allowed}
.candidate-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;margin-top:13px}
.candidate-overview>div{padding:12px;border-radius:14px;background:#F4F1FB;border:1px solid rgba(109,59,209,.10)}
.candidate-overview span{display:block;color:var(--subtle);font-size:14px;font-weight:400}
.candidate-overview strong{display:block;margin-top:4px;color:#572AA0;font-size:18px;font-weight:700}
.candidate-tools{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin-top:11px}
.danger-button{color:#B42318;background:#FFF1F0;border-color:#FFD0CC}
.radius-group{margin-top:11px;border:1px solid rgba(15,23,42,.07);border-radius:15px;overflow:hidden;background:rgba(255,255,255,.58)}
.radius-head{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:11px 12px;background:rgba(247,249,252,.92)}
.radius-head>div{display:flex;align-items:center;gap:7px;min-width:0}
.radius-head strong{font-size:15px;font-weight:600}
.radius-head small{color:var(--subtle);font-size:14px;font-weight:400}
.radius-swatch{width:10px;height:10px;border-radius:50%;flex:0 0 auto}
.mini-button{min-height:32px;padding:0 10px;border-radius:10px;color:var(--blue-dark);background:var(--blue-soft);font-size:14px;font-weight:600}
.radius-list{max-height:230px;overflow:auto;scrollbar-width:thin}
.radius-school{display:grid;grid-template-columns:22px 1fr auto;gap:9px;align-items:center;padding:10px 12px;border-top:1px solid rgba(15,23,42,.055)}
.radius-school input{width:17px;height:17px;accent-color:#6D3BD1}
.radius-school strong{display:block;font-size:14px;font-weight:600}
.radius-school small{display:block;margin-top:3px;color:var(--subtle);font-size:14px;font-weight:400}
.radius-school b{font-size:14px;font-weight:600;color:#572AA0}
.empty-mini{padding:13px;color:var(--subtle);font-size:14px;line-height:1.5}

.school-marker,.pool-marker,.candidate-marker{display:grid;place-items:center;border-radius:50%;color:#fff;border:2px solid rgba(255,255,255,.98);box-shadow:0 3px 12px rgba(15,23,42,.30);font-weight:700}
.school-marker{width:30px;height:30px;background:var(--school);font-size:14px}
.focus-school-marker{background:var(--focus);transform:scale(1.14);box-shadow:0 0 0 5px rgba(255,138,31,.22),0 4px 14px rgba(15,23,42,.30)}
.used-school-marker{background:var(--focus);transform:scale(1.08);box-shadow:0 0 0 4px rgba(255,138,31,.18),0 3px 12px rgba(15,23,42,.28)}
.pool-marker{width:32px;height:32px;background:var(--pool);font-size:15px}
.selected-pool-marker{background:var(--pool-focus);transform:scale(1.16);box-shadow:0 0 0 5px rgba(0,166,214,.22),0 4px 14px rgba(15,23,42,.30)}
.connected-pool-marker{background:var(--pool-focus);transform:scale(1.10);box-shadow:0 0 0 4px rgba(0,166,214,.18),0 4px 14px rgba(15,23,42,.28)}
.candidate-marker{width:38px;height:38px;background:var(--candidate-color);font-size:14px}
.leaflet-div-icon{background:transparent;border:0}

.school-cluster-wrap{background:transparent!important;border:0!important}
.school-cluster{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;color:#fff;background:rgba(24,59,102,.94);border:3px solid rgba(255,255,255,.96);box-shadow:0 5px 18px rgba(15,23,42,.25);font-size:15px;font-weight:700;backdrop-filter:blur(6px)}
.school-cluster.large{width:50px;height:50px;background:rgba(14,42,78,.96)}

.leaflet-tooltip.map-label,.leaflet-tooltip.candidate-label{border:0;border-radius:9px;background:rgba(255,255,255,.94);color:#24313A;box-shadow:0 3px 12px rgba(15,23,42,.14);font-size:14px;font-weight:600;padding:5px 8px}
.leaflet-tooltip.candidate-label{font-weight:700}
.route-distance-label,.ring-distance-label{display:inline-flex;align-items:center;justify-content:center;white-space:nowrap;border-radius:999px;background:rgba(255,255,255,.94);border:1px solid color-mix(in srgb,var(--label-color) 35%, transparent);color:var(--label-color);box-shadow:0 4px 14px rgba(15,23,42,.16);padding:5px 8px;font-size:14px;font-weight:700;line-height:1;pointer-events:none}
.ring-distance-label{background:rgba(255,255,255,.90)}
.dynamic-label-icon{background:transparent!important;border:0!important;width:auto!important;height:auto!important}

.info-dialog,.dashboard-dialog{padding:0;border:1px solid rgba(15,23,42,.10);border-radius:24px;box-shadow:0 25px 90px rgba(15,23,42,.26);color:var(--text);background:rgba(252,253,255,.94);backdrop-filter:saturate(155%) blur(30px);-webkit-backdrop-filter:saturate(155%) blur(30px);overflow:hidden}
.info-dialog{width:min(560px,calc(100vw - 28px))}
.dashboard-dialog{width:min(1120px,calc(100vw - 36px));max-height:88vh}
.info-dialog::backdrop,.dashboard-dialog::backdrop{background:rgba(20,30,45,.30);backdrop-filter:blur(7px)}
.dialog-shell{position:relative;padding:30px;max-height:88vh;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin}
.info-dialog h2,.dashboard-dialog h2{margin:5px 46px 12px 0;font-size:18px;letter-spacing:-.035em;font-weight:700}
.info-dialog p,.info-dialog li{font-size:14px;font-weight:400;line-height:1.7;color:#4D5A64}
.dialog-note{padding-top:12px;border-top:1px solid var(--hairline)}
.dialog-action{width:100%;margin-top:10px}
.dashboard-filters{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-top:18px;padding:16px;border-radius:17px;background:rgba(239,245,253,.74)}
.dashboard-filter-title{display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:9px}
.dashboard-filter-title strong{font-size:14px;font-weight:700}
.dashboard-filter-title span{font-size:14px;color:var(--subtle)}
.dashboard-chip-row .chip{font-size:14px;min-height:32px}
.dashboard-metrics{display:grid;grid-template-columns:repeat(5,1fr);gap:10px;margin-top:16px}
.dashboard-metrics>div{padding:15px;border-radius:16px;background:rgba(255,255,255,.88);border:1px solid rgba(15,23,42,.07)}
.dashboard-metrics span{display:block;font-size:14px;font-weight:400;color:var(--subtle)}
.dashboard-metrics strong{font-size:18px;font-weight:700}
.dashboard-metrics small{margin-left:4px;color:var(--subtle);font-size:14px}
.dashboard-section{margin-top:18px;padding-top:18px;border-top:1px solid var(--hairline)}
.dashboard-section-head{display:flex;justify-content:space-between;align-items:center;gap:10px;margin-bottom:11px}
.dashboard-section-head h3{margin:0;font-size:16px;font-weight:700}
.dashboard-section-head span{color:var(--subtle);font-size:14px;font-weight:400}
.bar-list{display:grid;gap:9px}
.bar-row{display:grid;grid-template-columns:minmax(190px,310px) 1fr;gap:13px;align-items:center}
.bar-row strong{display:block;font-size:14px;font-weight:600}
.bar-row small{display:block;margin-top:3px;color:var(--subtle);font-size:14px;font-weight:400}
.bar-track{height:12px;border-radius:999px;background:#E8EEF6;overflow:hidden}
.bar-track i{display:block;height:100%;border-radius:999px;background:linear-gradient(90deg,#2F6FCC,#6B9BE0)}
.compare-table{border:1px solid rgba(15,23,42,.08);border-radius:15px;overflow:auto;max-height:320px}
.compare-row{display:grid;grid-template-columns:minmax(150px,1.4fr) repeat(3,minmax(90px,.7fr));gap:8px;padding:11px 13px;border-top:1px solid rgba(15,23,42,.06);font-size:14px;font-weight:400}
.compare-row.header{position:sticky;top:0;background:#F5F8FC;font-weight:700;border-top:0}
.compare-row .better{color:#087A55;font-weight:700}
.compare-row .worse{color:#B54708;font-weight:700}
.toast{position:fixed;z-index:4000;left:50%;bottom:24px;transform:translateX(-50%);padding:12px 17px;border:1px solid rgba(15,23,42,.09);border-radius:999px;box-shadow:var(--shadow);font-size:14px;font-weight:600}

@media(max-width:1100px){
  :root{--sidebar-width:390px;--detail-width:390px}
  .dashboard-metrics{grid-template-columns:repeat(3,1fr)}
  .dashboard-filters{grid-template-columns:1fr 1fr}
  .map-legend{max-width:390px}
}

@media(max-width:760px){
  :root{--topbar-height:56px}
  body{font-size:12px}
  .topbar{padding:0 9px}
  .brand{gap:7px}.brand-logo{width:35px;height:35px}
  .eyebrow{display:none}
  .brand h1{font-size:18px}
  .top-actions{gap:6px}
  .button{min-height:36px;padding:0 10px;font-size:12px;border-radius:11px}
  .wide-only{display:none}
  .icon-button{width:36px;height:36px;font-size:14px}
  .sidebar{width:100%;height:44%;top:auto;bottom:0;border-right:0;border-top:1px solid var(--hairline);border-radius:20px 20px 0 0;box-shadow:0 -10px 36px rgba(15,23,42,.10)}
  .control-block{padding:9px 10px}
  .control-block:not(.search-control){display:none}
  .search-box{height:42px}
  .search-box input{font-size:13px}
  .map-area{inset:0 0 44% 0}
  .map-legend{top:9px;bottom:auto;left:9px;font-size:12px;max-width:calc(100% - 18px);gap:8px;padding:8px 10px}
  .detail-panel,.candidate-panel{top:8px;right:8px;bottom:calc(44% + 8px);width:calc(100vw - 16px);border-radius:18px}
  #detailContent,#candidateContent{padding:22px 16px 26px}
  .panel-kicker,.panel-subtitle,.metric-card span,.source-note,.radius-school strong,.radius-head strong,.radius-school small,.radius-head small,.candidate-empty p{font-size:12px}
  .panel-title{font-size:16px}
  .detail-section h3{font-size:14px}
  .metric-card strong,.candidate-overview strong,.candidate-empty strong{font-size:16px}
  .metric-card strong.compact{font-size:14px}
  .school-name{font-size:14px}
  .school-meta{font-size:12px}
  .transport-tag{font-size:12px}
  .list-heading strong{font-size:16px}.list-heading span{font-size:12px}
  .candidate-hint{top:8px;width:calc(100% - 24px);font-size:12px;text-align:center}
  .dashboard-dialog{width:calc(100vw - 14px);max-height:92vh}
  .dialog-shell{padding:22px 16px}
  .dashboard-dialog h2,.info-dialog h2{font-size:16px}
  .dashboard-filters{grid-template-columns:1fr;padding:12px}
  .dashboard-filter-title strong,.dashboard-filter-title span{font-size:12px}
  .dashboard-metrics{grid-template-columns:repeat(2,1fr)}
  .dashboard-metrics strong{font-size:16px}.dashboard-metrics span,.dashboard-metrics small{font-size:12px}
  .dashboard-section-head h3{font-size:14px}.dashboard-section-head span,.bar-row strong,.bar-row small,.compare-row{font-size:12px}
  .bar-row{grid-template-columns:1fr;gap:6px}
  .compare-row{grid-template-columns:minmax(120px,1.4fr) repeat(3,80px);min-width:480px}
  .chip,.dashboard-chip-row .chip{font-size:12px;min-height:30px;padding:0 10px}
  .link-button{font-size:12px;min-height:40px}
  .info-dialog p,.info-dialog li{font-size:12px}
  .leaflet-tooltip.map-label,.leaflet-tooltip.candidate-label,.route-distance-label,.ring-distance-label{font-size:12px}
  .usage-school-main strong,.usage-school-main small,.usage-school-value{font-size:12px}
}
.dynamic-label-icon .route-distance-label,.dynamic-label-icon .ring-distance-label{transform:translate(-50%,-50%)}
.better{color:#087A55!important}.worse{color:#B54708!important}

/* V5 — hierarchy, comparison and material consistency */
.detail-section-first{margin-top:14px;padding-top:0;border-top:0}
.school-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
.school-summary-grid .metric-card{min-height:92px;display:flex;flex-direction:column;justify-content:space-between}
.school-summary-grid .metric-card strong{overflow-wrap:anywhere}
.school-summary-grid .metric-card small{display:block;margin-top:5px;color:var(--subtle);font-size:14px;font-weight:500}
.section-title-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}
.section-title-row h3{margin:0}
.section-title-row>span{color:var(--subtle);font-size:14px;font-weight:500}
.compare-mini-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:9px}
.compare-mini-grid>div{min-width:0;padding:13px;border-radius:15px;background:rgba(239,245,253,.88);border:1px solid rgba(31,95,191,.08)}
.compare-mini-grid span{display:block;color:var(--subtle);font-size:14px;font-weight:500}
.compare-mini-grid strong{display:block;margin-top:6px;font-size:15px;font-weight:700;line-height:1.35;overflow-wrap:anywhere}
.compare-mini-grid small{display:block;margin-top:5px;color:var(--subtle);font-size:14px;font-weight:500}
.compare-mini-grid .compare-delta{background:rgba(255,248,237,.88)}
.candidate-school-search{margin-top:2px;height:44px}
.candidate-search-results{margin-top:10px;border:1px solid rgba(15,23,42,.07);border-radius:14px;overflow:auto;max-height:310px;background:rgba(247,249,252,.74);scrollbar-width:thin}
.candidate-search-results .radius-school:first-child{border-top:0}
.dashboard-empty{border:1px dashed rgba(31,95,191,.18);border-radius:14px;background:rgba(239,245,253,.52)}

/* Keep interactive sizes and focus treatment consistent */
.button,.icon-button,.chip,.mini-button,.candidate-tab,.candidate-add,.link-button,.school-card,.usage-school{touch-action:manipulation}
input[type="search"]{caret-color:var(--blue)}

@media(max-width:760px){
  .detail-panel,.candidate-panel{
    top:auto;
    left:0;
    right:0;
    bottom:0;
    width:100%;
    height:44%;
    max-height:44%;
    border-radius:20px 20px 0 0;
    border-left:0;
    border-right:0;
    border-bottom:0;
    box-shadow:0 -12px 38px rgba(15,23,42,.16);
  }
  #detailContent,#candidateContent{padding:20px 16px 28px}
  .school-summary-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .school-summary-grid .metric-card{min-height:82px}
  .school-summary-grid .metric-card small,.section-title-row>span,.compare-mini-grid span,.compare-mini-grid small{font-size:12px}
  .compare-mini-grid{grid-template-columns:1fr}
  .compare-mini-grid strong{font-size:14px}
  .candidate-search-results{max-height:210px}
}

@media(max-width:760px){
  .info-dialog,.dashboard-dialog{
    position:fixed;
    inset:auto 0 0 0;
    width:100%;
    max-width:none;
    max-height:44%;
    margin:0;
    border-radius:20px 20px 0 0;
    border-left:0;
    border-right:0;
    border-bottom:0;
    box-shadow:0 -12px 38px rgba(15,23,42,.16);
  }
  .info-dialog::backdrop,.dashboard-dialog::backdrop{background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none}
  .dialog-shell{max-height:44vh;overflow:auto;padding:20px 16px 28px}
}

/* V6 — school-complex pool comparison workflow */
:root{
  --pool:#663D73;
  --pool-focus:#14B8D4;
  --candidate-school:#EC4899;
}
.pool-dot{background:var(--pool)}
.comparison-dot{background:var(--candidate-school)}
.candidate-school-marker{
  background:var(--candidate-school);
  transform:scale(1.10);
  box-shadow:0 0 0 4px rgba(236,72,153,.18),0 4px 14px rgba(15,23,42,.30)
}

/* School summary: destination full width + four 2x2 metrics */
.school-summary-grid-v6{grid-template-columns:repeat(2,minmax(0,1fr))}
.school-summary-grid-v6 .pool-summary-card{grid-column:1/-1;min-height:78px}
.school-summary-grid-v6 .metric-card:not(.pool-summary-card){min-height:86px}
.metric-card small{display:block;margin-top:5px;color:var(--subtle);font-size:14px;font-weight:500}
.budget-grid .metric-card{min-height:82px}

/* Candidate comparison table */
.school-compare-table-wrap{
  overflow:auto;
  border:1px solid rgba(31,95,191,.10);
  border-radius:16px;
  background:rgba(255,255,255,.72);
  scrollbar-width:thin;
  box-shadow:inset 0 1px 0 rgba(255,255,255,.72)
}
.school-compare-table{width:100%;min-width:610px;border-collapse:separate;border-spacing:0;font-size:14px}
.school-compare-table th,.school-compare-table td{padding:11px 12px;border-bottom:1px solid rgba(15,23,42,.07);border-right:1px solid rgba(15,23,42,.055);text-align:left;vertical-align:middle;line-height:1.45}
.school-compare-table th:last-child,.school-compare-table td:last-child{border-right:0}
.school-compare-table tbody tr:last-child th,.school-compare-table tbody tr:last-child td{border-bottom:0}
.school-compare-table thead th{position:sticky;top:0;z-index:1;background:rgba(242,247,253,.96);font-weight:700;color:#24313A;white-space:nowrap}
.school-compare-table thead th:first-child{left:0;z-index:2}
.school-compare-table tbody th{position:sticky;left:0;z-index:1;background:rgba(249,251,254,.97);font-weight:600;white-space:nowrap;color:#44515D}
.school-compare-table td{font-weight:500;min-width:128px}
.candidate-col-dot{display:inline-block;width:9px;height:9px;margin-right:6px;border-radius:50%;vertical-align:1px}
.table-route-actions{display:flex;flex-wrap:wrap;gap:6px}
.table-route-actions a{display:inline-flex;align-items:center;justify-content:center;min-height:32px;padding:0 9px;border-radius:9px;background:var(--blue-soft);color:var(--blue-dark);text-decoration:none;font-size:14px;font-weight:600;border:1px solid rgba(31,95,191,.10)}
.table-route-actions a:hover{background:#DDEBFF}
.table-route-actions a:focus-visible{box-shadow:var(--focus-ring);outline:none}
.table-note{margin:9px 2px 0;color:var(--subtle);font-size:14px;font-weight:400;line-height:1.5}

/* Candidate influence cards become quick-select controls */
.candidate-overview-v6{overflow:visible}
.radius-summary-card{
  position:relative;
  min-width:0;
  min-height:78px;
  padding:12px;
  border-radius:14px;
  background:rgba(247,243,253,.90);
  border:1px solid color-mix(in srgb,var(--radius-color) 18%, transparent);
  text-align:left;
  transition:transform .14s ease,background .14s ease,box-shadow .14s ease,border-color .14s ease
}
.radius-summary-card:hover,.radius-summary-card:focus-visible{transform:translateY(-1px);background:rgba(255,255,255,.96);border-color:color-mix(in srgb,var(--radius-color) 42%, transparent);box-shadow:0 10px 26px rgba(30,50,80,.12)}
.radius-summary-card>span:first-child{display:block;color:var(--subtle);font-size:14px;font-weight:500}
.radius-summary-card>strong{display:block;margin-top:4px;color:var(--radius-color);font-size:18px;font-weight:700}
.radius-popover{
  position:absolute;z-index:30;left:50%;top:calc(100% + 8px);transform:translateX(-50%);
  display:none;width:250px;max-height:150px;overflow:auto;padding:10px 12px;
  border:1px solid rgba(15,23,42,.10);border-radius:12px;background:rgba(253,254,255,.97);
  color:#3B4650;font-size:14px!important;font-weight:500!important;line-height:1.55!important;
  box-shadow:0 14px 36px rgba(15,23,42,.18);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  pointer-events:none
}
.radius-summary-card:hover .radius-popover,.radius-summary-card:focus-visible .radius-popover{display:block}
.radius-summary-card:first-child .radius-popover{left:0;transform:none}
.radius-summary-card:last-child .radius-popover{left:auto;right:0;transform:none}
.candidate-overview-note{margin:8px 2px 0;color:var(--subtle);font-size:14px;font-weight:400;line-height:1.5}

/* Direct comparison-school selection */
.compare-school-row{display:grid;grid-template-columns:22px minmax(0,1fr) auto;gap:9px;align-items:center;padding:10px 12px;border-top:1px solid rgba(15,23,42,.055);background:rgba(255,255,255,.34);transition:background .14s ease,box-shadow .14s ease}
.compare-school-row:first-child{border-top:0}
.compare-school-row:hover{background:rgba(31,95,191,.055)}
.compare-school-row.selected{background:rgba(236,72,153,.08);box-shadow:inset 3px 0 0 var(--candidate-school)}
.compare-school-row input{width:17px;height:17px;accent-color:var(--candidate-school)}
.compare-school-row strong{display:block;font-size:14px;font-weight:600}
.compare-school-row small{display:block;margin-top:3px;color:var(--subtle);font-size:14px;font-weight:400}
.compare-school-row b{font-size:14px;font-weight:700;color:#B03070;white-space:nowrap}

/* Distinguish pool marker from school marker at a glance */
.pool-marker{background:var(--pool);box-shadow:0 3px 12px rgba(70,28,78,.34)}
.selected-pool-marker,.connected-pool-marker{background:var(--pool-focus)}

@media(max-width:760px){
  .school-summary-grid-v6{grid-template-columns:repeat(2,minmax(0,1fr))}
  .school-summary-grid-v6 .pool-summary-card{min-height:68px}
  .school-summary-grid-v6 .metric-card:not(.pool-summary-card){min-height:74px}
  .metric-card small,.table-note,.candidate-overview-note,.compare-school-row strong,.compare-school-row small,.compare-school-row b{font-size:12px}
  .school-compare-table{font-size:12px;min-width:560px}
  .school-compare-table th,.school-compare-table td{padding:9px 10px}
  .table-route-actions a{min-height:30px;padding:0 8px;font-size:12px}
  .radius-summary-card{min-height:68px;padding:10px}
  .radius-summary-card>span:first-child{font-size:12px}
  .radius-summary-card>strong{font-size:16px}
  .radius-popover{font-size:12px!important;width:210px;max-height:120px}
}

/* V7 — compact material hierarchy and candidate-linked color semantics */
:root{
  --sidebar-width:330px;
  --detail-width:404px;
}

/* Keep typography in the established PC 14–20px / mobile 12–18px range while reducing vertical waste. */
.control-block{padding:10px 11px}
.search-control{padding-top:12px}
.search-box{height:42px;padding:0 12px;border-radius:13px}
.list-heading{padding:10px 12px}
.school-list{padding:4px 7px 14px}
.school-card{grid-template-columns:36px 1fr auto;gap:9px;padding:9px 8px;border-radius:13px}
.school-badge{width:36px;height:36px;border-radius:10px}
.school-meta{margin-top:2px}

#detailContent,#candidateContent{padding:20px 18px 22px}
.panel-title{margin-top:3px}
.detail-section{margin-top:14px;padding-top:12px}
.detail-section-first{margin-top:10px}
.detail-section h3{margin-bottom:8px}
.section-title-row{margin-bottom:8px}
.info-grid{gap:7px}
.metric-card{padding:9px 10px;border-radius:13px}
.metric-card strong{margin-top:3px;line-height:1.20}
.metric-card small{margin-top:3px}
.school-summary-grid-v6 .pool-summary-card{min-height:58px}
.school-summary-grid-v6 .metric-card:not(.pool-summary-card){min-height:64px}
.budget-grid .metric-card{min-height:60px}
.source-note{margin-top:12px;line-height:1.45}
.action-row{gap:7px}
.link-button{min-height:40px;border-radius:12px}
.usage-school-list{gap:5px}
.usage-school{padding:8px 10px;border-radius:11px}
.usage-school-main small{margin-top:2px}

/* Candidate influence cards: click-only disclosure. No hover popover. */
.candidate-tabs{margin-top:11px;gap:7px}
.candidate-tab,.candidate-add{width:36px;height:36px;border-radius:11px}
.candidate-overview{gap:7px;margin-top:10px}
.radius-summary-card{min-height:64px;padding:9px 10px;border-radius:13px;transform:none!important}
.radius-summary-card:hover{background:rgba(255,255,255,.96);box-shadow:none}
.radius-summary-card.active{background:color-mix(in srgb,var(--radius-color) 10%, white);border-color:color-mix(in srgb,var(--radius-color) 55%, transparent);box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--radius-color) 16%, transparent)}
.radius-summary-card>strong{margin-top:2px}
.radius-popover,.candidate-overview-note{display:none!important}
.candidate-tools{gap:7px;margin-top:9px}
.candidate-school-search{height:40px;margin-top:0}
.candidate-search-results{margin-top:7px;max-height:280px;border-radius:12px}
.compare-school-row{grid-template-columns:20px minmax(0,1fr) auto;gap:8px;padding:7px 9px}
.compare-school-row strong{line-height:1.25}
.compare-school-row small{margin-top:1px;line-height:1.3}
.compare-school-row.selected{background:color-mix(in srgb,var(--linked-color,var(--candidate-school)) 9%, white);box-shadow:inset 3px 0 0 var(--linked-color,var(--candidate-school))}
.compare-school-row input{accent-color:var(--linked-color,var(--candidate-school))}
.compare-school-row b{color:var(--linked-color,var(--candidate-school))}

/* Comparison table: denser but still scannable. */
.school-compare-table-wrap{border-radius:13px}
.school-compare-table th,.school-compare-table td{padding:8px 9px;line-height:1.3}
.table-route-actions{gap:5px}
.table-route-actions a{min-height:30px;padding:0 8px;border-radius:8px}
.table-note{margin-top:6px;line-height:1.4}

/* A comparison-school marker inherits the associated candidate color. */
.candidate-school-marker{
  background:var(--candidate-school-color,var(--candidate-school));
  transform:scale(1.10);
  box-shadow:0 0 0 4px color-mix(in srgb,var(--candidate-school-color,var(--candidate-school)) 20%, transparent),0 4px 14px rgba(15,23,42,.30)
}

/* Slightly tighter panel controls and focus treatment. */
.button{min-height:38px;border-radius:11px}
.panel-close,.dialog-close{width:36px;height:36px;top:10px;right:10px}
.dialog-shell{padding:24px;scrollbar-gutter:stable}
.dashboard-filters{gap:12px;padding:13px}

@media(max-width:1100px){
  :root{--sidebar-width:320px;--detail-width:380px}
}

@media(max-width:760px){
  :root{--topbar-height:56px}
  #detailContent,#candidateContent{padding:16px 14px 20px}
  .detail-section{margin-top:11px;padding-top:10px}
  .school-summary-grid-v6 .pool-summary-card{min-height:52px}
  .school-summary-grid-v6 .metric-card:not(.pool-summary-card){min-height:58px}
  .metric-card{padding:8px 9px}
  .budget-grid .metric-card{min-height:56px}
  .radius-summary-card{min-height:58px;padding:8px 9px}
  .candidate-search-results{max-height:190px}
  .compare-school-row{padding:7px 8px}
  .school-compare-table th,.school-compare-table td{padding:7px 8px}
  .dialog-shell{padding:18px 14px 22px}
}

/* V8 — dedicated bottom comparison workspace */
:root{
  --comparison-height:238px;
  --comparison-collapsed-height:62px;
}

.map-area,.detail-panel,.candidate-panel{transition:bottom .22s ease}
.workspace.comparison-open .map-area{bottom:var(--comparison-height)}
.workspace.comparison-open .detail-panel,
.workspace.comparison-open .candidate-panel{bottom:calc(var(--comparison-height) + 14px)}
.workspace.comparison-open.comparison-collapsed .map-area{bottom:var(--comparison-collapsed-height)}
.workspace.comparison-open.comparison-collapsed .detail-panel,
.workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:calc(var(--comparison-collapsed-height) + 14px)}

.comparison-panel{
  position:absolute;
  z-index:990;
  left:calc(var(--sidebar-width) + 12px);
  right:12px;
  bottom:12px;
  height:calc(var(--comparison-height) - 18px);
  border:1px solid rgba(15,23,42,.09);
  border-radius:18px;
  box-shadow:0 14px 40px rgba(30,50,80,.16);
  overflow:hidden;
  display:grid;
  grid-template-rows:auto 1fr;
}
.comparison-panel[hidden]{display:none}
.comparison-panel.collapsed{height:50px;grid-template-rows:50px 0}
.comparison-panel.collapsed .comparison-content{display:none}
.comparison-panel-head{
  min-height:50px;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:14px;
  padding:8px 10px 8px 14px;
  border-bottom:1px solid rgba(15,23,42,.07);
  background:rgba(248,251,255,.74);
}
.comparison-heading{display:flex;align-items:baseline;gap:10px;min-width:0}
.comparison-heading span{font-size:14px;font-weight:700;color:var(--blue-dark);white-space:nowrap}
.comparison-heading strong{font-size:15px;font-weight:700;color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.comparison-panel-actions{display:flex;align-items:center;gap:6px;flex:0 0 auto}
.mini-panel-button{
  min-height:32px;
  padding:0 10px;
  border-radius:9px;
  background:rgba(255,255,255,.82);
  border:1px solid rgba(15,23,42,.08);
  color:#41505F;
  font-size:14px;
  font-weight:600;
}
.mini-panel-button:hover{background:#EEF4FB}
.mini-panel-button:focus-visible{outline:none;box-shadow:var(--focus-ring)}
.comparison-content{
  min-height:0;
  overflow:auto;
  padding:8px 10px 10px;
  scrollbar-gutter:stable;
  scrollbar-width:thin;
  overscroll-behavior:contain;
}

/* The comparison table uses the horizontal room of the map instead of the right detail card. */
.comparison-panel .school-compare-table-wrap{border-radius:12px;max-height:none;overflow:auto}
.comparison-panel .school-compare-table{width:max-content;min-width:100%;font-size:14px}
.comparison-panel .school-compare-table th,
.comparison-panel .school-compare-table td{padding:6px 9px;line-height:1.25}
.comparison-panel .school-compare-table th:first-child,
.comparison-panel .school-compare-table tbody th{
  width:104px;
  min-width:104px;
  max-width:104px;
}
.comparison-panel .school-compare-table td,
.comparison-panel .school-compare-table thead th:not(:first-child){min-width:138px}
.comparison-panel .table-route-actions{flex-wrap:nowrap;gap:4px}
.comparison-panel .table-route-actions a{min-height:28px;padding:0 7px;border-radius:8px}
.comparison-panel .table-note{margin:5px 2px 0;font-size:14px;line-height:1.35}

/* Budget units stay inline with their values to reduce unnecessary card height. */
.budget-grid .metric-card{min-height:54px}
.budget-grid .metric-card strong{white-space:nowrap}

@media(max-width:1100px) and (min-width:761px){
  :root{--comparison-height:226px}
  .comparison-panel .school-compare-table td,
  .comparison-panel .school-compare-table thead th:not(:first-child){min-width:128px}
}

@media(max-width:760px){
  :root{--comparison-collapsed-height:54px}
  .comparison-panel{
    left:8px;
    right:8px;
    bottom:0;
    height:44%;
    border-radius:18px 18px 0 0;
    z-index:1100;
  }
  .comparison-panel.collapsed{
    left:8px;
    right:8px;
    bottom:44%;
    height:46px;
    border-radius:14px;
    grid-template-rows:46px 0;
  }
  .workspace.comparison-open .map-area{bottom:44%}
  .workspace.comparison-open .detail-panel,
  .workspace.comparison-open .candidate-panel{bottom:0}
  .workspace.comparison-open.comparison-collapsed .map-area{bottom:44%}
  .workspace.comparison-open.comparison-collapsed .detail-panel,
  .workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:0}
  .comparison-panel-head{min-height:46px;padding:7px 8px 7px 11px}
  .comparison-heading{gap:7px}
  .comparison-heading span{font-size:12px}
  .comparison-heading strong{font-size:13px}
  .mini-panel-button{min-height:30px;padding:0 8px;font-size:12px}
  .comparison-content{padding:7px 8px 9px}
  .comparison-panel .school-compare-table{font-size:12px}
  .comparison-panel .school-compare-table th,
  .comparison-panel .school-compare-table td{padding:6px 7px}
  .comparison-panel .school-compare-table th:first-child,
  .comparison-panel .school-compare-table tbody th{width:92px;min-width:92px;max-width:92px}
  .comparison-panel .school-compare-table td,
  .comparison-panel .school-compare-table thead th:not(:first-child){min-width:120px}
  .comparison-panel .table-route-actions a{font-size:12px;min-height:28px;padding:0 6px}
  .comparison-panel .table-note{font-size:12px}
}

/* V9 — floating multi-school candidate comparison + operational dashboard */
#poolTypeFilters{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;-ms-overflow-style:none;gap:6px}
#poolTypeFilters::-webkit-scrollbar{display:none}
#poolTypeFilters .chip{flex:0 0 auto}

/* Keep the legend subordinate to the map content. */
.map-legend{
  top:14px;
  bottom:auto;
  left:14px;
  gap:8px;
  padding:7px 10px;
  border-radius:12px;
  font-size:14px;
  box-shadow:0 6px 18px rgba(15,23,42,.09);
}
.map-legend .legend-dot{width:8px;height:8px}

/* Candidate comparison is a floating material panel; it no longer resizes the map. */
.workspace.comparison-open .map-area,
.workspace.comparison-open.comparison-collapsed .map-area{bottom:0}
.workspace.comparison-open .detail-panel,
.workspace.comparison-open .candidate-panel,
.workspace.comparison-open.comparison-collapsed .detail-panel,
.workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:14px}
.comparison-panel{
  left:calc(var(--sidebar-width) + 14px);
  right:calc(var(--detail-width) + 28px);
  bottom:14px;
  height:auto;
  max-height:min(340px,calc(100% - 28px));
  border-radius:18px;
  display:grid;
  grid-template-rows:auto minmax(0,1fr);
  box-shadow:0 18px 52px rgba(30,50,80,.18);
  backdrop-filter:saturate(155%) blur(28px);
  -webkit-backdrop-filter:saturate(155%) blur(28px);
}
.comparison-panel.collapsed{height:48px;max-height:48px;grid-template-rows:48px 0}
.comparison-panel-head{min-height:48px;padding:7px 9px 7px 13px}
.comparison-heading span{font-size:14px}
.comparison-heading strong{font-size:14px;color:var(--subtle);font-weight:600}
.comparison-content{max-height:286px;padding:8px 9px 9px}

.comparison-switcher{display:flex;gap:6px;overflow-x:auto;margin:0 0 7px;padding:1px;scrollbar-width:none}
.comparison-switcher::-webkit-scrollbar{display:none}
.comparison-switch{flex:0 0 auto;min-height:30px;padding:0 10px;border-radius:9px;background:rgba(255,255,255,.82);font-size:14px;font-weight:600}
.comparison-switch::before{content:"";display:inline-block;width:7px;height:7px;margin-right:6px;border-radius:50%;background:var(--switch-color);vertical-align:1px}
.comparison-switch.active{color:#fff;background:var(--switch-color);border-color:transparent}
.comparison-switch.active::before{background:#fff}
.comparison-empty{padding:16px;border:1px dashed rgba(31,95,191,.18);border-radius:12px;background:rgba(245,248,252,.78);color:var(--subtle);font-size:14px;line-height:1.45}

.candidate-comparison-table-wrap{overflow:auto;border:1px solid rgba(15,23,42,.08);border-radius:12px;background:rgba(255,255,255,.76);scrollbar-width:thin;overscroll-behavior:contain}
.candidate-comparison-table{width:100%;min-width:700px;border-collapse:separate;border-spacing:0;font-size:14px}
.candidate-comparison-table th,.candidate-comparison-table td{padding:7px 8px;border-bottom:1px solid rgba(15,23,42,.065);border-right:1px solid rgba(15,23,42,.05);vertical-align:middle;text-align:left;line-height:1.28}
.candidate-comparison-table thead th{position:sticky;top:0;z-index:1;background:rgba(245,248,252,.96);font-weight:700;color:#394655}
.candidate-comparison-table th:first-child{width:104px;min-width:104px;max-width:104px}
.candidate-comparison-table td:nth-child(2),.candidate-comparison-table td:nth-child(3){min-width:150px}
.candidate-comparison-table td:nth-child(4){width:88px;min-width:88px}
.candidate-comparison-table td:nth-child(5){min-width:218px}
.candidate-comparison-table tbody tr:last-child th,.candidate-comparison-table tbody tr:last-child td{border-bottom:0}
.candidate-comparison-table strong{display:block;font-weight:700}
.candidate-comparison-table small{display:block;margin-top:2px;color:var(--subtle);font-size:14px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:190px}
.comparison-route-groups{display:grid;grid-template-columns:1fr 1fr;gap:5px}
.comparison-route-groups>span{display:flex;align-items:center;gap:4px;min-width:0}
.comparison-route-groups b{font-size:14px;color:var(--subtle);font-weight:600}
.comparison-route-groups a{display:grid;place-items:center;min-height:28px;padding:0 6px;border-radius:8px;background:var(--blue-soft);color:var(--blue-dark);text-decoration:none;font-size:14px;font-weight:600;white-space:nowrap}
.comparison-route-groups a:hover{background:#DCEAFF}
.comparison-panel .table-note{margin:6px 2px 0;font-size:14px;line-height:1.35;color:var(--subtle)}

/* Dashboard: tables are primary, charts are supplemental. */
.dashboard-chart-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-top:14px}
.dashboard-chart-card{padding:13px;border:1px solid rgba(15,23,42,.075);border-radius:16px;background:rgba(255,255,255,.76)}
.dashboard-chart-card .dashboard-section-head{margin-bottom:10px}
.donut-layout{display:grid;grid-template-columns:126px 1fr;align-items:center;gap:16px;min-height:132px}
.donut-chart{position:relative;width:118px;height:118px;border-radius:50%;box-shadow:inset 0 0 0 1px rgba(15,23,42,.04)}
.donut-chart i{position:absolute;inset:25px;border-radius:50%;background:rgba(252,253,255,.96);box-shadow:0 0 0 1px rgba(15,23,42,.04)}
.donut-legend{display:grid;gap:7px;min-width:0}
.donut-legend>div{display:grid;grid-template-columns:10px minmax(72px,1fr) auto auto;align-items:center;gap:7px;font-size:14px}
.donut-key{width:9px;height:9px;border-radius:50%}
.donut-legend strong{font-weight:600;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.donut-legend b{font-weight:700;white-space:nowrap}
.donut-legend small{color:var(--subtle);font-size:14px;white-space:nowrap}
.dashboard-pool-table-wrap{max-height:360px;overflow:auto;border:1px solid rgba(15,23,42,.08);border-radius:14px;background:rgba(255,255,255,.78);scrollbar-width:thin}
.dashboard-pool-table{width:100%;border-collapse:separate;border-spacing:0;font-size:14px}
.dashboard-pool-table th,.dashboard-pool-table td{padding:8px 10px;border-bottom:1px solid rgba(15,23,42,.06);text-align:left;vertical-align:middle}
.dashboard-pool-table thead th{position:sticky;top:0;z-index:1;background:#F5F8FC;font-weight:700}
.dashboard-pool-table tbody tr:last-child td{border-bottom:0}
.dashboard-pool-table td:first-child{min-width:260px}
.dashboard-pool-table td:first-child strong{display:block;font-weight:700}
.dashboard-pool-table td:first-child small{display:block;margin-top:2px;color:var(--subtle);font-size:14px;font-weight:400;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:340px}
.pool-share{display:grid;grid-template-columns:48px minmax(86px,1fr);align-items:center;gap:8px;min-width:150px}
.pool-share b{font-weight:700}
.pool-share i{display:block;height:6px;border-radius:999px;background:#E6EDF7;overflow:hidden}
.pool-share em{display:block;height:100%;border-radius:inherit;background:var(--blue)}

@media(max-width:1100px) and (min-width:761px){
  .comparison-panel{right:14px;max-height:320px}
  .dashboard-chart-grid{grid-template-columns:1fr}
}

@media(max-width:760px){
  .map-legend{top:8px;left:8px;max-width:calc(100% - 16px);padding:6px 8px;gap:7px;font-size:12px}
  .workspace.comparison-open .map-area,
  .workspace.comparison-open.comparison-collapsed .map-area{bottom:44%}
  .comparison-panel{
    left:8px;
    right:8px;
    bottom:8px;
    max-height:calc(44% - 16px);
    border-radius:16px;
    z-index:1200;
  }
  .comparison-panel.collapsed{bottom:8px;height:44px;max-height:44px;grid-template-rows:44px 0}
  .comparison-panel-head{min-height:44px;padding:6px 7px 6px 10px}
  .comparison-heading span,.comparison-heading strong,.comparison-switch,.candidate-comparison-table,.comparison-route-groups b,.comparison-route-groups a,.comparison-panel .table-note{font-size:12px}
  .comparison-content{max-height:calc(44vh - 62px);padding:7px}
  .candidate-comparison-table{min-width:650px}
  .candidate-comparison-table th,.candidate-comparison-table td{padding:6px 7px}
  .candidate-comparison-table small{font-size:12px}
  .comparison-route-groups a{min-height:27px;padding:0 5px}
  .dashboard-chart-grid{grid-template-columns:1fr}
  .dashboard-chart-card{padding:10px}
  .donut-layout{grid-template-columns:104px 1fr;gap:12px;min-height:112px}
  .donut-chart{width:96px;height:96px}
  .donut-chart i{inset:21px}
  .donut-legend>div{grid-template-columns:9px minmax(58px,1fr) auto auto;gap:5px;font-size:12px}
  .donut-legend small{font-size:12px}
  .dashboard-pool-table{font-size:12px;min-width:650px}
  .dashboard-pool-table th,.dashboard-pool-table td{padding:7px 8px}
  .dashboard-pool-table td:first-child small{font-size:12px}
}

/* V10 — fixed candidate comparison, compact analytical table, report-style dashboard */
:root{
  --comparison-fixed-height:336px;
}

@media(min-width:761px){
  /* Candidate comparison has priority when it is open. Keep its height stable and shorten right-side panels. */
  .comparison-panel{
    height:var(--comparison-fixed-height);
    max-height:var(--comparison-fixed-height);
    min-height:var(--comparison-fixed-height);
  }
  .comparison-panel.collapsed{
    height:48px;
    min-height:48px;
    max-height:48px;
  }
  .workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
  .workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{
    bottom:calc(var(--comparison-fixed-height) + 28px);
  }
  .workspace.comparison-open.comparison-collapsed .detail-panel,
  .workspace.comparison-open.comparison-collapsed .candidate-panel{
    bottom:14px;
  }
}

.comparison-content{
  min-height:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
  padding:8px 9px 9px;
}
.comparison-switcher{flex:0 0 auto}
.candidate-comparison-table-wrap{
  flex:1 1 auto;
  min-height:0;
  overflow:auto;
  overscroll-behavior:contain;
  -webkit-overflow-scrolling:touch;
  scrollbar-gutter:stable;
}
.comparison-panel .table-note{flex:0 0 auto}

/* Comparison table: fixed, purposeful widths so multiple schools remain scannable. */
.candidate-comparison-table{
  width:100%;
  min-width:860px;
  table-layout:fixed;
}
.candidate-comparison-table th,
.candidate-comparison-table td{padding:7px 8px}
.candidate-comparison-table th:nth-child(1),
.candidate-comparison-table td:nth-child(1){width:112px}
.candidate-comparison-table th:nth-child(2),
.candidate-comparison-table td:nth-child(2){width:86px;text-align:center}
.candidate-comparison-table th:nth-child(3),
.candidate-comparison-table td:nth-child(3){width:106px}
.candidate-comparison-table th:nth-child(4),
.candidate-comparison-table td:nth-child(4){width:158px}
.candidate-comparison-table th:nth-child(5),
.candidate-comparison-table td:nth-child(5){width:104px}
.candidate-comparison-table th:nth-child(6),
.candidate-comparison-table td:nth-child(6){width:92px}
.candidate-comparison-table th:nth-child(7),
.candidate-comparison-table td:nth-child(7){width:176px}
.candidate-comparison-table strong{font-size:14px;line-height:1.25}
.candidate-comparison-table small{
  margin-top:2px;
  font-size:14px;
  line-height:1.2;
  color:#7A8490;
  max-width:145px;
}
.candidate-comparison-table .numeric-cell strong,
.candidate-comparison-table .transport-cell{white-space:nowrap}
.candidate-comparison-table .route-cell{padding-left:6px;padding-right:6px}
.comparison-route-groups{grid-template-columns:1fr;gap:3px}
.comparison-route-groups>span{gap:3px}
.comparison-route-groups b{width:30px;flex:0 0 30px;font-size:14px}
.comparison-route-groups a{min-height:27px;padding:0 6px;font-size:14px}
.change-increase{color:#1F5FBF!important}
.change-decrease{color:#D13A32!important}
.change-neutral{color:#66717C!important}

/* Dashboard filters stay on a single line per category on desktop/tablet. */
.dashboard-dialog{width:min(1200px,calc(100vw - 36px))}
.dashboard-filters{
  grid-template-columns:minmax(390px,1.4fr) minmax(340px,1.2fr) minmax(170px,.65fr);
  gap:14px;
  align-items:start;
}
.dashboard-chip-row{
  flex-wrap:nowrap;
  overflow-x:auto;
  scrollbar-width:none;
  -ms-overflow-style:none;
  gap:6px;
}
.dashboard-chip-row::-webkit-scrollbar{display:none}
.dashboard-chip-row .chip{flex:0 0 auto}

/* Charts summarize composition; detailed values remain in the tables below. */
.dashboard-chart-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.dashboard-chart-card{min-width:0}
.donut-layout{grid-template-columns:118px minmax(0,1fr);gap:13px;min-height:128px}
.donut-chart{width:112px;height:112px}
.donut-chart i{
  inset:24px;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:0;
  color:var(--text);
}
.donut-chart i strong{font-size:18px;font-weight:700;line-height:1.05}
.donut-chart i small{margin-top:3px;font-size:14px;font-weight:500;color:var(--subtle)}
.donut-legend{gap:6px}
.donut-legend>div{grid-template-columns:9px minmax(60px,1fr) auto auto;gap:6px}

@media(max-width:1100px) and (min-width:761px){
  :root{--comparison-fixed-height:318px}
  .dashboard-filters{grid-template-columns:minmax(330px,1.25fr) minmax(300px,1.1fr) minmax(150px,.6fr);gap:10px}
  .dashboard-chart-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .donut-layout{grid-template-columns:96px minmax(0,1fr);gap:9px}
  .donut-chart{width:90px;height:90px}
  .donut-chart i{inset:20px}
  .donut-chart i strong{font-size:16px}
}

@media(max-width:760px){
  .comparison-content{display:flex;overflow:hidden}
  .candidate-comparison-table{min-width:780px;table-layout:fixed}
  .candidate-comparison-table th:nth-child(1),.candidate-comparison-table td:nth-child(1){width:98px}
  .candidate-comparison-table th:nth-child(2),.candidate-comparison-table td:nth-child(2){width:76px}
  .candidate-comparison-table th:nth-child(3),.candidate-comparison-table td:nth-child(3){width:92px}
  .candidate-comparison-table th:nth-child(4),.candidate-comparison-table td:nth-child(4){width:140px}
  .candidate-comparison-table th:nth-child(5),.candidate-comparison-table td:nth-child(5){width:90px}
  .candidate-comparison-table th:nth-child(6),.candidate-comparison-table td:nth-child(6){width:86px}
  .candidate-comparison-table th:nth-child(7),.candidate-comparison-table td:nth-child(7){width:164px}
  .candidate-comparison-table strong,.candidate-comparison-table small,.comparison-route-groups b,.comparison-route-groups a{font-size:12px}
  .dashboard-filters{grid-template-columns:1fr}
  .dashboard-chart-grid{grid-template-columns:1fr}
  .dashboard-chip-row{overflow-x:auto}
  .donut-chart i strong{font-size:16px}
  .donut-chart i small{font-size:12px}
}


/* V11 — dual-view dashboard: school analysis + pool analysis */
.donut-chart i{font-style:normal}
.donut-chart i strong,.donut-chart i small{font-style:normal}

.dashboard-view-switch{
  display:inline-flex;
  align-items:center;
  gap:4px;
  margin:2px 0 4px;
  padding:4px;
  border:1px solid rgba(15,23,42,.08);
  border-radius:14px;
  background:rgba(239,245,253,.78);
}
.dashboard-view-button{
  min-height:34px;
  padding:0 14px;
  border:0;
  border-radius:10px;
  background:transparent;
  color:#52606D;
  font-size:14px;
  font-weight:600;
  transition:background .16s ease,color .16s ease,box-shadow .16s ease;
}
.dashboard-view-button:hover{background:rgba(255,255,255,.72)}
.dashboard-view-button.active{background:#fff;color:var(--blue-dark);box-shadow:0 2px 8px rgba(31,95,191,.10)}
.dashboard-view-button:focus-visible{box-shadow:var(--focus-ring)}

.dashboard-distance-card{
  margin-top:12px;
  padding:13px 15px;
  border:1px solid rgba(15,23,42,.075);
  border-radius:16px;
  background:rgba(255,255,255,.76);
}
.distance-bars{display:grid;gap:8px}
.distance-bar-row{display:grid;grid-template-columns:88px minmax(120px,1fr) 50px;align-items:center;gap:10px;font-size:14px}
.distance-bar-row strong{font-weight:600;color:#485565}
.distance-bar-row>span{height:8px;border-radius:999px;background:#E5ECF6;overflow:hidden}
.distance-bar-row>span i{display:block;height:100%;border-radius:inherit;background:linear-gradient(90deg,#2F6FD4,#6A8FE0)}
.distance-bar-row b{text-align:right;font-weight:700;color:#253241}

.dashboard-school-table-wrap{
  max-height:380px;
  overflow:auto;
  border:1px solid rgba(15,23,42,.08);
  border-radius:14px;
  background:rgba(255,255,255,.78);
  scrollbar-width:thin;
  scrollbar-gutter:stable;
}
.dashboard-school-table{
  width:100%;
  min-width:900px;
  border-collapse:separate;
  border-spacing:0;
  font-size:14px;
}
.dashboard-school-table th,.dashboard-school-table td{padding:8px 10px;border-bottom:1px solid rgba(15,23,42,.06);text-align:left;vertical-align:middle;white-space:nowrap}
.dashboard-school-table thead th{position:sticky;top:0;z-index:2;background:#F5F8FC;font-weight:700}
.dashboard-school-table tbody tr:last-child td{border-bottom:0}
.dashboard-school-row,.dashboard-pool-row{cursor:pointer;transition:background .14s ease}
.dashboard-school-row:hover,.dashboard-pool-row:hover{background:rgba(31,95,191,.055)}
.dashboard-school-row:focus-visible,.dashboard-pool-row:focus-visible{outline:none;box-shadow:inset var(--focus-ring)}
.dashboard-school-table td:first-child strong{font-weight:700}

/* Pool table no longer spends vertical room on addresses; details remain in the map card. */
.dashboard-pool-table td:first-child{min-width:220px}
.dashboard-pool-table td:first-child strong{margin:0}

@media(max-width:760px){
  .dashboard-view-switch{width:100%;display:grid;grid-template-columns:1fr 1fr}
  .dashboard-view-button{font-size:12px;min-height:32px;padding:0 9px}
  .dashboard-distance-card{padding:10px 11px}
  .distance-bar-row{grid-template-columns:72px minmax(100px,1fr) 42px;gap:7px;font-size:12px}
  .dashboard-school-table{font-size:12px;min-width:820px}
  .dashboard-school-table th,.dashboard-school-table td{padding:7px 8px}
}

/* V12 — adaptive sidebar, four-stage comparison panel, three-tier typography */
:root{
  --sidebar-width:320px;
  --comparison-current-height:250px;
}

/* Map-first adaptive sidebar. The handle remains available when the card is hidden. */
.sidebar{
  width:var(--sidebar-width);
  transition:transform .24s cubic-bezier(.2,.8,.2,1),opacity .2s ease;
  will-change:transform;
}
.map-area{
  inset:0 0 0 var(--sidebar-width);
  transition:left .24s cubic-bezier(.2,.8,.2,1),bottom .22s ease;
}
.sidebar-toggle{
  position:absolute;
  z-index:1120;
  top:50%;
  left:calc(var(--sidebar-width) - 16px);
  width:32px;
  height:52px;
  transform:translateY(-50%);
  display:grid;
  place-items:center;
  padding:0;
  border:1px solid rgba(15,23,42,.10);
  border-radius:12px;
  color:#425163;
  background:rgba(252,253,255,.88);
  box-shadow:0 8px 24px rgba(30,50,80,.13);
  font-size:17px;
  font-weight:700;
  transition:left .24s cubic-bezier(.2,.8,.2,1),background .16s ease,box-shadow .16s ease;
}
.sidebar-toggle:hover{background:rgba(255,255,255,.98);box-shadow:0 10px 28px rgba(30,50,80,.17)}
.sidebar-toggle:focus-visible{outline:none;box-shadow:var(--focus-ring),0 10px 28px rgba(30,50,80,.15)}
.workspace.sidebar-collapsed .sidebar{transform:translateX(-100%);opacity:0;pointer-events:none}
.workspace.sidebar-collapsed .map-area{left:0}
.workspace.sidebar-collapsed .sidebar-toggle{left:8px}

/* Comparison panel expands into space released by the sidebar and/or right panel. */
.comparison-panel{
  left:calc(var(--sidebar-width) + 14px);
  right:14px;
  bottom:14px;
  height:var(--comparison-current-height);
  min-height:0;
  max-height:calc(100% - 28px);
  grid-template-rows:auto minmax(0,1fr);
  transition:left .24s cubic-bezier(.2,.8,.2,1),right .2s ease,height .22s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease;
}
.workspace:has(.detail-panel:not([hidden])) .comparison-panel,
.workspace:has(.candidate-panel:not([hidden])) .comparison-panel{right:calc(var(--detail-width) + 28px)}
.workspace.sidebar-collapsed .comparison-panel{left:14px}
.comparison-panel.collapsed{
  height:48px;
  min-height:48px;
  max-height:48px;
  grid-template-rows:48px 0;
}
.comparison-panel.resizing{transition:left .24s cubic-bezier(.2,.8,.2,1),right .2s ease,box-shadow .18s ease}
.workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
.workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{bottom:calc(var(--comparison-current-height) + 28px)}
.workspace.comparison-open.comparison-collapsed .detail-panel,
.workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:14px}

.comparison-resize-handle{
  position:absolute;
  z-index:4;
  left:50%;
  top:2px;
  width:56px;
  height:14px;
  transform:translateX(-50%);
  padding:0;
  border:0;
  background:transparent;
  cursor:ns-resize;
  touch-action:none;
}
.comparison-resize-handle span{
  display:block;
  width:34px;
  height:4px;
  margin:4px auto 0;
  border-radius:999px;
  background:rgba(91,105,119,.34);
  transition:background .14s ease,width .14s ease;
}
.comparison-resize-handle:hover span,.comparison-resize-handle:focus-visible span{width:40px;background:rgba(31,95,191,.52)}
.comparison-panel-head{padding-top:11px}
.icon-only-button{
  width:34px;
  min-width:34px;
  height:34px;
  min-height:34px;
  padding:0;
  display:grid;
  place-items:center;
  border-radius:10px;
  font-size:17px;
  font-weight:700;
  line-height:1;
}

/* Consistent material controls and whitespace. */
.button{min-height:38px;padding:0 13px;border-radius:11px}
.icon-button{width:38px;height:38px}
.chip{min-height:32px;padding:0 11px}
.search-box{height:44px}
.panel-close,.dialog-close{width:34px;height:34px}
.dialog-shell{padding:22px;scrollbar-gutter:stable}
.detail-panel,.candidate-panel,.comparison-panel,.dialog-shell,.sidebar-scroll{overscroll-behavior:contain}

/* PC typography: 13–19px. */
body{font-size:13px}
.brand h1{font-size:19px}
.eyebrow,.button,.control-title,.control-help,.search-box input,.chip,.list-heading span,.school-meta,.transport-tag,
.panel-kicker,.panel-subtitle,.metric-card span,.metric-card small,.link-button,.source-note,.usage-school,.usage-school-main strong,.usage-school-main small,.usage-school-value,
.candidate-overview span,.radius-summary-card>span:first-child,.candidate-overview-note,.compare-school-row strong,.compare-school-row small,
.info-dialog p,.info-dialog li,.dashboard-filter-title strong,.dashboard-filter-title span,.dashboard-chip-row .chip,.dashboard-metrics span,.dashboard-metrics small,
.dashboard-section-head span,.bar-row strong,.bar-row small,.dashboard-view-button,.distance-bar-row,.dashboard-school-table,.dashboard-pool-table,
.comparison-heading span,.comparison-heading strong,.comparison-switch,.candidate-comparison-table,.candidate-comparison-table small,.comparison-route-groups b,.comparison-route-groups a,.comparison-panel .table-note,
.leaflet-tooltip.map-label,.leaflet-tooltip.candidate-label,.route-distance-label,.ring-distance-label{font-size:13px}
.school-name,.detail-section h3,.dashboard-section-head h3,.candidate-empty strong{font-size:15px}
.list-heading strong,.panel-title,.metric-card strong,.candidate-overview strong,.donut-chart i strong{font-size:17px}
.metric-card strong.compact,.info-dialog h2,.dashboard-dialog h2{font-size:16px}
.school-badge,.school-marker{font-size:13px}

/* Tablet typography: 11–17px and slightly tighter material geometry. */
@media (min-width:768px) and (max-width:1279px){
  :root{--sidebar-width:292px;--detail-width:360px}
  body{font-size:11px}
  .brand h1{font-size:17px}
  .eyebrow,.button,.control-title,.control-help,.search-box input,.chip,.list-heading span,.school-meta,.transport-tag,
  .panel-kicker,.panel-subtitle,.metric-card span,.metric-card small,.link-button,.source-note,.usage-school,.usage-school-main strong,.usage-school-main small,.usage-school-value,
  .candidate-overview span,.radius-summary-card>span:first-child,.candidate-overview-note,.compare-school-row strong,.compare-school-row small,
  .info-dialog p,.info-dialog li,.dashboard-filter-title strong,.dashboard-filter-title span,.dashboard-chip-row .chip,.dashboard-metrics span,.dashboard-metrics small,
  .dashboard-section-head span,.bar-row strong,.bar-row small,.dashboard-view-button,.distance-bar-row,.dashboard-school-table,.dashboard-pool-table,
  .comparison-heading span,.comparison-heading strong,.comparison-switch,.candidate-comparison-table,.candidate-comparison-table small,.comparison-route-groups b,.comparison-route-groups a,.comparison-panel .table-note,
  .leaflet-tooltip.map-label,.leaflet-tooltip.candidate-label,.route-distance-label,.ring-distance-label{font-size:11px}
  .school-name,.detail-section h3,.dashboard-section-head h3,.candidate-empty strong{font-size:13px}
  .list-heading strong,.panel-title,.metric-card strong,.candidate-overview strong,.donut-chart i strong{font-size:15px}
  .metric-card strong.compact,.info-dialog h2,.dashboard-dialog h2{font-size:14px}
  .school-badge,.school-marker{font-size:11px}
  .button{min-height:36px;padding:0 11px}
  .chip{min-height:30px;padding:0 9px}
  .search-box{height:42px}
  .control-block{padding:10px}
  .school-card{padding:10px 8px}
  .school-badge{width:34px;height:34px}
  .sidebar-toggle{width:30px;height:48px;left:calc(var(--sidebar-width) - 15px);font-size:15px}
  .workspace.sidebar-collapsed .sidebar-toggle{left:7px}
  .dashboard-dialog{width:min(1160px,calc(100vw - 24px))}
  .dialog-shell{padding:18px}
}

/* Mobile typography: 10–16px. Sidebar remains a bottom card but can also be collapsed. */
@media (max-width:767px){
  :root{--topbar-height:54px;--detail-width:100%}
  body{font-size:10px}
  .brand h1{font-size:16px}
  .eyebrow{display:none}
  .button,.control-title,.control-help,.search-box input,.chip,.list-heading span,.school-meta,.transport-tag,
  .panel-kicker,.panel-subtitle,.metric-card span,.metric-card small,.link-button,.source-note,.usage-school,.usage-school-main strong,.usage-school-main small,.usage-school-value,
  .candidate-overview span,.radius-summary-card>span:first-child,.candidate-overview-note,.compare-school-row strong,.compare-school-row small,
  .info-dialog p,.info-dialog li,.dashboard-filter-title strong,.dashboard-filter-title span,.dashboard-chip-row .chip,.dashboard-metrics span,.dashboard-metrics small,
  .dashboard-section-head span,.bar-row strong,.bar-row small,.dashboard-view-button,.distance-bar-row,.dashboard-school-table,.dashboard-pool-table,
  .comparison-heading span,.comparison-heading strong,.comparison-switch,.candidate-comparison-table,.candidate-comparison-table small,.comparison-route-groups b,.comparison-route-groups a,.comparison-panel .table-note,
  .leaflet-tooltip.map-label,.leaflet-tooltip.candidate-label,.route-distance-label,.ring-distance-label{font-size:10px}
  .school-name,.detail-section h3,.dashboard-section-head h3,.candidate-empty strong{font-size:12px}
  .list-heading strong,.panel-title,.metric-card strong,.candidate-overview strong,.donut-chart i strong{font-size:14px}
  .metric-card strong.compact,.info-dialog h2,.dashboard-dialog h2{font-size:13px}
  .icon-button,.panel-close,.dialog-close,.icon-only-button{font-size:16px}
  .topbar{padding:0 8px}
  .brand-logo{width:32px;height:32px}
  .button{min-height:34px;padding:0 9px}
  .icon-button{width:34px;height:34px}
  .chip{min-height:28px;padding:0 8px}
  .search-box{height:40px}
  .sidebar{width:100%;transform:translateY(0)}
  .map-area{inset:0 0 44% 0}
  .sidebar-toggle{
    top:auto;
    left:10px;
    bottom:calc(44% - 16px);
    width:48px;
    height:30px;
    transform:none;
    font-size:14px;
    border-radius:10px;
  }
  .workspace.sidebar-collapsed .sidebar{transform:translateY(100%)}
  .workspace.sidebar-collapsed .map-area{left:0;bottom:0}
  .workspace.sidebar-collapsed .sidebar-toggle{left:10px;bottom:10px}
  .comparison-panel,
  .workspace.sidebar-collapsed .comparison-panel{
    left:8px;
    right:8px!important;
    bottom:8px;
    height:var(--comparison-current-height);
    max-height:calc(100% - 16px);
  }
  .workspace:has(.detail-panel:not([hidden])) .comparison-panel,
  .workspace:has(.candidate-panel:not([hidden])) .comparison-panel{right:8px}
  .comparison-panel-head{min-height:44px;padding:10px 7px 6px 10px}
  .comparison-resize-handle{top:1px}
  .comparison-content{padding:6px 7px 8px}
  .icon-only-button{width:30px;min-width:30px;height:30px;min-height:30px}
  .workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
  .workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{bottom:0}
  .dialog-shell{padding:16px 13px 20px}
}

/* Final font-range guardrails for tablet/mobile controls and map chrome. */
@media (min-width:768px) and (max-width:1279px){
  .search-box span,.school-arrow,.icon-button,.panel-close,.dialog-close,.mini-panel-button,.candidate-tab,.candidate-add,.school-cluster{font-size:15px}
}
@media (max-width:767px){
  .search-box span,.school-arrow,.school-cluster{font-size:14px}
}

/* V13 — map chrome simplification, unified edge toggles, two-state comparison layout */
.leaflet-control-attribution{
  margin:0!important;
  padding:2px 6px!important;
  border-radius:8px 0 0 0;
  background:rgba(255,255,255,.78)!important;
  color:#6b7280!important;
  font-size:10px!important;
  line-height:1.2!important;
  box-shadow:none!important;
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.leaflet-control-attribution a{color:#5f6872!important;text-decoration:none!important;font-weight:500}
.leaflet-control-attribution .leaflet-attribution-flag{display:none!important}
.leaflet-control-zoom{display:none!important}

/* One visual system for fold / unfold controls. */
.edge-toggle{
  position:absolute;
  z-index:1305;
  width:34px;
  height:34px;
  min-width:34px;
  min-height:34px;
  padding:0;
  display:grid;
  place-items:center;
  border:1px solid rgba(15,23,42,.10);
  border-radius:11px;
  background:rgba(253,254,255,.94);
  box-shadow:0 8px 24px rgba(30,50,80,.14);
  color:#425466;
  line-height:1;
  transition:background .16s ease,box-shadow .16s ease,transform .22s cubic-bezier(.2,.8,.2,1),left .24s cubic-bezier(.2,.8,.2,1),top .22s ease;
  backdrop-filter:saturate(150%) blur(18px);
  -webkit-backdrop-filter:saturate(150%) blur(18px);
}
.edge-toggle:hover{background:rgba(255,255,255,.99);box-shadow:0 10px 28px rgba(30,50,80,.18)}
.edge-toggle:focus-visible{outline:none;box-shadow:var(--focus-ring),0 10px 28px rgba(30,50,80,.16)}
.edge-toggle .toggle-glyph{
  display:block;
  width:18px;
  height:18px;
  line-height:17px;
  text-align:center;
  font-size:19px;
  font-weight:700;
  transform-origin:50% 50%;
  transition:transform .2s cubic-bezier(.2,.8,.2,1);
}
.sidebar-toggle{
  left:calc(var(--sidebar-width) - 17px)!important;
  top:50%!important;
  bottom:auto!important;
  transform:translateY(-50%)!important;
  border-radius:0 11px 11px 0;
}
.sidebar-toggle .toggle-glyph{transform:rotate(180deg)}
.sidebar-toggle.is-collapsed .toggle-glyph{transform:rotate(0deg)}
.workspace.sidebar-collapsed .sidebar-toggle{
  left:0!important;
  border-radius:0 11px 11px 0;
}

/* Comparison panel uses the full available map width; right details sit above it. */
.comparison-panel{
  left:calc(var(--sidebar-width) + 14px)!important;
  right:14px!important;
  bottom:14px!important;
  height:var(--comparison-current-height)!important;
  max-height:calc(100% - 28px)!important;
  min-height:0!important;
  grid-template-rows:auto minmax(0,1fr)!important;
  overflow:visible!important;
  transition:left .24s cubic-bezier(.2,.8,.2,1),right .22s ease,height .24s cubic-bezier(.2,.8,.2,1),box-shadow .18s ease!important;
}
.workspace.sidebar-collapsed .comparison-panel{left:14px!important}
.workspace:has(.detail-panel:not([hidden])) .comparison-panel,
.workspace:has(.candidate-panel:not([hidden])) .comparison-panel{right:14px!important}
.comparison-panel.collapsed{
  height:48px!important;
  min-height:48px!important;
  max-height:48px!important;
  grid-template-rows:48px 0!important;
}
.comparison-content{
  min-height:0;
  overflow:hidden;
}
.candidate-comparison-table-wrap{
  max-height:100%!important;
  overflow:auto!important;
  overscroll-behavior:contain;
  scrollbar-gutter:stable;
}
.workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
.workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{
  bottom:calc(var(--comparison-current-height) + 28px)!important;
}
.workspace.comparison-open.comparison-collapsed .detail-panel,
.workspace.comparison-open.comparison-collapsed .candidate-panel{
  bottom:76px!important;
}
.comparison-edge-toggle{
  left:50%;
  top:-17px;
  transform:translateX(-50%);
  border-radius:11px;
}
.comparison-edge-toggle .toggle-glyph{transform:rotate(90deg)}
.comparison-edge-toggle.is-collapsed .toggle-glyph{transform:rotate(-90deg)}
.comparison-panel-head{
  min-height:48px!important;
  padding:8px 12px!important;
  align-items:center!important;
}
.comparison-panel-actions{margin-left:auto}

/* Remove legacy resize affordance entirely. */
.comparison-resize-handle{display:none!important}

@media (min-width:768px) and (max-width:1279px){
  .edge-toggle{width:32px;height:32px;min-width:32px;min-height:32px}
  .edge-toggle .toggle-glyph{font-size:17px;width:16px;height:16px;line-height:15px}
  .sidebar-toggle{left:calc(var(--sidebar-width) - 16px)!important}
  .comparison-edge-toggle{top:-16px}
  .comparison-panel{left:calc(var(--sidebar-width) + 10px)!important;right:10px!important;bottom:10px!important}
  .workspace.sidebar-collapsed .comparison-panel{left:10px!important}
  .workspace:has(.detail-panel:not([hidden])) .comparison-panel,
  .workspace:has(.candidate-panel:not([hidden])) .comparison-panel{right:10px!important}
  .workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
  .workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{bottom:calc(var(--comparison-current-height) + 20px)!important}
  .workspace.comparison-open.comparison-collapsed .detail-panel,
  .workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:68px!important}
}

@media (max-width:767px){
  .sidebar-toggle{
    left:50%!important;
    top:auto!important;
    bottom:calc(44% - 16px)!important;
    transform:translateX(-50%)!important;
    border-radius:11px 11px 0 0;
  }
  .sidebar-toggle .toggle-glyph{transform:rotate(-90deg)}
  .sidebar-toggle.is-collapsed .toggle-glyph{transform:rotate(90deg)}
  .workspace.sidebar-collapsed .sidebar-toggle{
    left:50%!important;
    bottom:0!important;
    border-radius:11px 11px 0 0;
  }
  .comparison-panel,
  .workspace.sidebar-collapsed .comparison-panel{
    left:8px!important;
    right:8px!important;
    bottom:8px!important;
  }
  .workspace:has(.detail-panel:not([hidden])) .comparison-panel,
  .workspace:has(.candidate-panel:not([hidden])) .comparison-panel{right:8px!important}
  .comparison-edge-toggle{top:-15px}
  .workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
  .workspace.comparison-open:not(.comparison-collapsed) .candidate-panel,
  .workspace.comparison-open.comparison-collapsed .detail-panel,
  .workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:0!important}
}

/* V14 — attached edge-tabs and symmetric fold / unfold motion */
:root{
  --edge-visible:34px;
  --edge-overlap:8px;
}

/* The toggle tabs sit one visual layer below the cards so they feel physically attached. */
.sidebar-toggle{
  z-index:899!important;
  width:calc(var(--edge-visible) + var(--edge-overlap))!important;
  height:var(--edge-visible)!important;
  min-width:calc(var(--edge-visible) + var(--edge-overlap))!important;
  min-height:var(--edge-visible)!important;
  left:calc(var(--sidebar-width) - var(--edge-overlap))!important;
  top:50%!important;
  bottom:auto!important;
  transform:translateY(-50%)!important;
  border-radius:0 11px 11px 0!important;
  overflow:visible!important;
}
.sidebar-toggle .toggle-glyph{
  position:absolute!important;
  top:0!important;
  right:0!important;
  width:var(--edge-visible)!important;
  height:var(--edge-visible)!important;
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
  text-align:center!important;
  font-size:18px!important;
  font-weight:700!important;
  transform:none!important;
}
.workspace.sidebar-collapsed .sidebar-toggle{
  left:calc(-1 * var(--edge-overlap))!important;
  border-radius:0 11px 11px 0!important;
}
.workspace.sidebar-collapsed .sidebar-toggle .toggle-glyph{transform:none!important}

/* Comparison toggle is a sibling of the card so it can truly sit below the card layer. */
.comparison-edge-toggle{
  z-index:989!important;
  width:var(--edge-visible)!important;
  height:calc(var(--edge-visible) + var(--edge-overlap))!important;
  min-width:var(--edge-visible)!important;
  min-height:calc(var(--edge-visible) + var(--edge-overlap))!important;
  left:calc(50% + (var(--sidebar-width) / 2))!important;
  top:auto!important;
  bottom:calc(var(--comparison-current-height) + 14px - var(--edge-overlap))!important;
  transform:translateX(-50%)!important;
  border-radius:11px 11px 0 0!important;
  overflow:visible!important;
  transition:
    background .16s ease,
    box-shadow .16s ease,
    left .24s cubic-bezier(.2,.8,.2,1),
    bottom .28s cubic-bezier(.22,1,.36,1)!important;
}
.comparison-edge-toggle .toggle-glyph{
  position:absolute!important;
  left:0!important;
  top:0!important;
  width:var(--edge-visible)!important;
  height:var(--edge-visible)!important;
  display:grid!important;
  place-items:center!important;
  line-height:1!important;
  text-align:center!important;
  font-size:18px!important;
  font-weight:700!important;
  transform:none!important;
}
.workspace.sidebar-collapsed .comparison-edge-toggle{left:50%!important}
.comparison-edge-toggle.is-collapsed .toggle-glyph{transform:none!important}

/* Keep the comparison contents alive while the card height animates so closing is as smooth as opening. */
.comparison-panel{
  overflow:hidden!important;
  grid-template-rows:48px minmax(0,1fr)!important;
  transition:
    left .24s cubic-bezier(.2,.8,.2,1),
    right .22s ease,
    height .28s cubic-bezier(.22,1,.36,1),
    max-height .28s cubic-bezier(.22,1,.36,1),
    box-shadow .18s ease!important;
}
.comparison-panel.collapsed{
  grid-template-rows:48px minmax(0,1fr)!important;
}
.comparison-content{
  display:block!important;
  min-height:0!important;
  overflow:hidden!important;
  opacity:1;
  transform:translateY(0);
  transition:
    opacity .18s ease,
    transform .28s cubic-bezier(.22,1,.36,1)!important;
  will-change:opacity,transform;
}
.comparison-panel.collapsed .comparison-content{
  display:block!important;
  opacity:0;
  transform:translateY(-6px);
  pointer-events:none;
}

/* Ensure the right-side panels follow the same calm timing as the comparison card. */
.detail-panel,.candidate-panel{
  transition:bottom .28s cubic-bezier(.22,1,.36,1)!important;
}

@media (min-width:768px) and (max-width:1279px){
  :root{--edge-visible:32px;--edge-overlap:8px}
  .sidebar-toggle .toggle-glyph,.comparison-edge-toggle .toggle-glyph{font-size:16px!important}
  .comparison-edge-toggle{
    bottom:calc(var(--comparison-current-height) + 10px - var(--edge-overlap))!important;
  }
}

@media (max-width:767px){
  :root{--edge-visible:32px;--edge-overlap:8px}
  .sidebar-toggle{
    z-index:899!important;
    left:50%!important;
    top:auto!important;
    bottom:calc(44% - var(--edge-overlap))!important;
    width:var(--edge-visible)!important;
    height:calc(var(--edge-visible) + var(--edge-overlap))!important;
    min-width:var(--edge-visible)!important;
    min-height:calc(var(--edge-visible) + var(--edge-overlap))!important;
    transform:translateX(-50%)!important;
    border-radius:11px 11px 0 0!important;
  }
  .sidebar-toggle .toggle-glyph{
    left:0!important;
    right:auto!important;
    top:0!important;
    width:var(--edge-visible)!important;
    height:var(--edge-visible)!important;
    font-size:16px!important;
  }
  .workspace.sidebar-collapsed .sidebar-toggle{
    left:50%!important;
    bottom:calc(-1 * var(--edge-overlap))!important;
    border-radius:11px 11px 0 0!important;
  }
  .comparison-edge-toggle{
    left:50%!important;
    bottom:calc(var(--comparison-current-height) + 8px - var(--edge-overlap))!important;
  }
  .comparison-edge-toggle .toggle-glyph{font-size:16px!important}
}

@media (prefers-reduced-motion:reduce){
  .comparison-panel,.comparison-content,.comparison-edge-toggle,.detail-panel,.candidate-panel,.sidebar,.sidebar-toggle,.map-area{
    transition-duration:.01ms!important;
  }
}

/* V15 — unified chevrons, edge-tab placement, and candidate-switch map focus */
/* Hidden means hidden: prevent a detached comparison toggle from remaining on the map. */
.comparison-edge-toggle[hidden],
.sidebar-toggle[hidden]{display:none!important}

/* Use one identical glyph (>) and rotate it for every direction.
   This avoids the different font shapes of < > ⌃ ⌄ while keeping the visual meaning. */
.edge-toggle .toggle-glyph{
  position:absolute!important;
  inset:0!important;
  width:100%!important;
  height:100%!important;
  display:flex!important;
  align-items:center!important;
  justify-content:center!important;
  padding:0!important;
  margin:0!important;
  line-height:1!important;
  text-align:center!important;
  font-family:Arial,"Segoe UI",sans-serif!important;
  font-size:18px!important;
  font-weight:700!important;
  transform-origin:50% 50%!important;
  pointer-events:none!important;
}

/* Left panel toggle: attached near the search field / upper-right border. */
.sidebar-toggle{
  z-index:899!important;
  top:22px!important;
  bottom:auto!important;
  left:calc(var(--sidebar-width) - var(--edge-overlap))!important;
  transform:none!important;
  border-radius:0 11px 11px 0!important;
}
.sidebar-toggle .toggle-glyph{transform:rotate(180deg)!important}
.sidebar-toggle.is-collapsed .toggle-glyph{transform:rotate(0deg)!important}
.workspace.sidebar-collapsed .sidebar-toggle{
  left:calc(-1 * var(--edge-overlap))!important;
  top:22px!important;
}

/* Comparison toggle: attached to the upper-left edge of the comparison card. */
.comparison-edge-toggle{
  z-index:989!important;
  left:calc(var(--sidebar-width) + 28px)!important;
  top:auto!important;
  bottom:calc(var(--comparison-current-height) + 14px - var(--edge-overlap))!important;
  transform:none!important;
  border-radius:11px 11px 0 0!important;
}
.comparison-edge-toggle .toggle-glyph{transform:rotate(90deg)!important}
.comparison-edge-toggle.is-collapsed .toggle-glyph{transform:rotate(-90deg)!important}
.workspace.sidebar-collapsed .comparison-edge-toggle{left:28px!important}

@media (min-width:768px) and (max-width:1279px){
  .edge-toggle .toggle-glyph{font-size:16px!important}
  .sidebar-toggle,
  .workspace.sidebar-collapsed .sidebar-toggle{top:20px!important}
  .comparison-edge-toggle{
    left:calc(var(--sidebar-width) + 24px)!important;
    bottom:calc(var(--comparison-current-height) + 10px - var(--edge-overlap))!important;
  }
  .workspace.sidebar-collapsed .comparison-edge-toggle{left:24px!important}
}

@media (max-width:767px){
  /* Mobile keeps the left panel as a bottom sheet, so its toggle sits on the top edge. */
  .sidebar-toggle{
    left:50%!important;
    top:auto!important;
    bottom:calc(44% - var(--edge-overlap))!important;
    transform:translateX(-50%)!important;
    border-radius:11px 11px 0 0!important;
  }
  .sidebar-toggle .toggle-glyph{transform:rotate(-90deg)!important}
  .sidebar-toggle.is-collapsed .toggle-glyph{transform:rotate(90deg)!important}
  .workspace.sidebar-collapsed .sidebar-toggle{
    left:50%!important;
    top:auto!important;
    bottom:calc(-1 * var(--edge-overlap))!important;
  }
  .comparison-edge-toggle{
    left:22px!important;
    bottom:calc(var(--comparison-current-height) + 8px - var(--edge-overlap))!important;
    transform:none!important;
  }
  .comparison-edge-toggle .toggle-glyph{font-size:16px!important}
  .workspace.sidebar-collapsed .comparison-edge-toggle{left:22px!important}
}

/* V15 alignment correction: center the chevron in the visible tab portion, not the overlapped part. */
.sidebar-toggle .toggle-glyph{
  left:auto!important;
  right:0!important;
  top:0!important;
  bottom:auto!important;
  width:var(--edge-visible)!important;
  height:var(--edge-visible)!important;
}
.comparison-edge-toggle .toggle-glyph{
  left:0!important;
  right:auto!important;
  top:0!important;
  bottom:auto!important;
  width:var(--edge-visible)!important;
  height:var(--edge-visible)!important;
}
@media(max-width:767px){
  .sidebar-toggle .toggle-glyph{
    left:0!important;
    right:auto!important;
    top:0!important;
    width:var(--edge-visible)!important;
    height:var(--edge-visible)!important;
  }
}

/* V16 — restrained materials, shared controls, three-tier typography. */
:root{
  --font-base:13px;--font-item:15px;--font-value:17px;--font-title:19px;
  --control-height:40px;--compact-height:32px;--control-radius:12px;
  --panel-radius:20px;--card-radius:12px;--panel-space:24px;
  --surface-border:1px solid rgba(15,23,42,.10);
  --shadow:0 12px 32px rgba(30,50,80,.14);
}
body{font-size:var(--font-base);font-weight:400}
body.initializing .map-area{visibility:hidden}
body.initializing .sidebar,body.initializing .sidebar-toggle,body.initializing .map-area{transition:none!important}
.brand h1{font-size:var(--font-title);font-weight:700}
.button,.chip,.boundary-toggle,.dashboard-view-button,.mini-panel-button,.link-button,
.search-box input,.school-meta,.transport-tag,.control-title,.control-help,.list-heading span,
.panel-kicker,.panel-subtitle,.metric-card span,.metric-card small,.source-note,.usage-school,
.usage-school-main strong,.usage-school-main small,.usage-school-value,.compare-school-row strong,.compare-school-row small,
.candidate-overview span,.candidate-overview-note,.radius-summary-card>span:first-child,.candidate-empty p,
.info-dialog p,.info-dialog li,.dialog-note,.dialog-kicker,.dashboard-filter-title strong,.dashboard-filter-title span,
.dashboard-metrics span,.dashboard-metrics small,.dashboard-section-head span,.dashboard-school-table,.dashboard-pool-table,
.dashboard-school-table small,.dashboard-pool-table small,.donut-legend,.donut-legend small,.donut-chart i small,
.bar-row strong,.bar-row small,.distance-bar-row,.comparison-heading span,.comparison-heading strong,
.candidate-comparison-table,.candidate-comparison-table strong,.candidate-comparison-table small,
.comparison-route-groups b,.comparison-route-groups a,.comparison-panel .table-note,.empty-state,.empty-mini,
.boundary-status,.boundary-label,.toast,.leaflet-tooltip.map-label,.leaflet-tooltip.candidate-label,
.route-distance-label,.ring-distance-label,.leaflet-control-attribution,.leaflet-control-attribution a{font-size:var(--font-base)!important}
.school-name,.detail-section h3,.dashboard-section-head h3,.candidate-empty strong{font-size:var(--font-item)!important}
.panel-title,.list-heading strong,.metric-card strong,.candidate-overview strong,.radius-summary-card strong,
.dashboard-metrics strong,.donut-chart i strong{font-size:var(--font-value)!important;font-weight:700}
.metric-card strong.compact,.info-dialog h2,.dashboard-dialog h2{font-size:var(--font-item)!important}
.eyebrow,.school-badge,.school-marker,.candidate-marker,.candidate-tab,.candidate-add{font-size:var(--font-base)!important}
.school-cluster{font-size:var(--font-title)!important}
.source-note,.school-meta,.panel-subtitle,.metric-card span,.boundary-status,.dialog-note{font-weight:500}
.control-title,.dashboard-filter-title strong,.detail-section h3,.dashboard-section-head h3{font-weight:600}
.metric-card strong,.dashboard-metrics strong,.compare-school-row b,.numeric-cell{white-space:nowrap;font-variant-numeric:tabular-nums}
i{font-style:normal}
.button,.link-button,.dashboard-view-button{
  min-height:var(--control-height);border-radius:var(--control-radius);padding:0 12px;
  display:inline-flex;align-items:center;justify-content:center;gap:8px;font-weight:600;
}
.button:hover{transform:none}
.button,.brand h1{white-space:nowrap}
.button.mobile-filter-toggle{display:none}
.button:active:not(:disabled),.link-button:active,.dashboard-view-button:active{filter:brightness(.96)}
.chip,.boundary-toggle{min-height:var(--compact-height);padding:0 8px;border-radius:8px;font-weight:500}
.icon-button,.panel-close,.dialog-close,.icon-only-button{
  width:var(--control-height);height:var(--control-height);min-width:var(--control-height);min-height:var(--control-height);
  padding:0;border-radius:var(--control-radius);display:grid;place-items:center;font-size:var(--font-title);line-height:1;
}
.candidate-tab,.candidate-add{width:var(--control-height);height:var(--control-height);border-radius:var(--control-radius)}
button:disabled{cursor:not-allowed;opacity:.45}
button:focus-visible,a:focus-visible,input:focus-visible,[tabindex="0"]:focus-visible{
  outline:2px solid var(--blue);outline-offset:2px;box-shadow:var(--focus-ring);
}
.search-box{height:var(--control-height);padding:0 12px;gap:8px;border-radius:var(--control-radius)}
.search-box:focus-within{outline:2px solid var(--blue);outline-offset:2px;box-shadow:var(--focus-ring)}
.search-box input:focus-visible{outline:none;box-shadow:none}
.search-box input::placeholder{color:#74818D}
.search-box span{font-size:var(--font-item)}
.top-actions,.chip-row,.candidate-tabs,.candidate-tools,.action-row{gap:8px}
.control-block{padding:12px}
.control-title-row{margin-bottom:8px}
.detail-panel,.candidate-panel,.comparison-panel,.info-dialog,.dashboard-dialog{border:var(--surface-border);border-radius:var(--panel-radius);box-shadow:var(--shadow)}
.material-thick,.info-dialog,.dashboard-dialog{background:rgba(253,254,255,.94);backdrop-filter:saturate(130%) blur(20px);-webkit-backdrop-filter:saturate(130%) blur(20px)}
.material-regular{background:rgba(248,250,253,.91);backdrop-filter:saturate(125%) blur(16px);-webkit-backdrop-filter:saturate(125%) blur(16px)}
.material-bar{background:rgba(249,251,254,.9);backdrop-filter:saturate(125%) blur(16px);-webkit-backdrop-filter:saturate(125%) blur(16px)}
.metric-card,.candidate-overview>div,.dashboard-metrics>div,.dashboard-chart-card,.dashboard-distance-card,.candidate-empty{border-radius:var(--card-radius);padding:12px}
#detailContent,#candidateContent{padding:24px 16px 16px}
.detail-section{margin-top:16px;padding-top:16px}
.detail-section-first{margin-top:12px;padding-top:0}
.info-grid,.dashboard-metrics,.candidate-overview{gap:8px}
.dashboard-chart-grid{gap:16px}
.dashboard-filters{gap:16px;padding:16px;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.6fr)}
.dashboard-chip-row{flex-wrap:wrap;overflow:visible}
.dashboard-section{margin-top:24px;padding-top:16px}
.dashboard-dialog,.info-dialog{max-height:calc(100dvh - 32px);overflow:hidden}
.dialog-shell{padding:var(--panel-space);max-height:calc(100dvh - 34px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable}
.dialog-close{top:12px;right:12px}
.dialog-shell h2{margin:4px calc(var(--control-height) + 8px) 16px 0}
.dashboard-school-table-wrap,.dashboard-pool-table-wrap{max-height:40dvh;overscroll-behavior:contain}
.comparison-content{display:flex!important;flex-direction:column;gap:8px}
.comparison-switcher{flex:0 0 auto;gap:8px;margin:0}
.candidate-comparison-table-wrap{flex:1 1 auto;min-height:0;max-height:none!important}
.comparison-panel .table-note{flex:0 0 auto;margin:0}
.distance-bar-row>span i,.bar-track i{background:#2F6FD4}
.edge-toggle .toggle-glyph{font-size:0!important}
.chevron-icon{display:block;width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg)}
.boundary-label-anchor{pointer-events:none}
.boundary-label{position:absolute;transform:translate(-50%,-50%);white-space:nowrap;color:#475569;font-weight:600;line-height:1.3;text-shadow:0 1px 2px #fff,1px 0 2px #fff,-1px 0 2px #fff,0 -1px 2px #fff}
.boundary-label-region{font-weight:700;color:#334155}
@media(min-width:768px){
  .detail-panel,.candidate-panel{height:fit-content;max-height:calc(100% - 28px)}
  .workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
  .workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{max-height:calc(100% - var(--comparison-current-height) - 42px)}
  .workspace.comparison-open.comparison-collapsed .detail-panel,
  .workspace.comparison-open.comparison-collapsed .candidate-panel{max-height:calc(100% - 90px)}
}
@media(min-width:768px) and (max-width:1279px){
  :root{--font-base:11px;--font-item:13px;--font-value:15px;--font-title:17px;--control-height:36px;--compact-height:32px;--panel-space:20px;--sidebar-width:280px;--detail-width:328px}
  .control-block{padding:12px}
  .dashboard-filters{grid-template-columns:minmax(0,1.2fr) minmax(0,1fr) minmax(0,.7fr);gap:12px}
  .dashboard-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .donut-layout{grid-template-columns:80px minmax(0,1fr);gap:8px}
  .donut-chart{width:80px;height:80px}
  .donut-chart i{inset:18px}
  .donut-legend>div{grid-template-columns:8px minmax(0,1fr) auto auto;gap:4px}
}
@media(max-width:767px){
  :root{--font-base:10px;--font-item:12px;--font-value:14px;--font-title:16px;--control-height:36px;--compact-height:32px;--panel-space:16px;--panel-radius:16px;--card-radius:12px}
  .topbar{padding:0 8px}
  .brand,.top-actions{gap:4px}
  .sidebar{width:100%;height:44%;top:auto;bottom:0;left:0;border-right:0;border-top:var(--surface-border);border-radius:16px 16px 0 0}
  .control-block:not(.search-control){display:none}
  .brand-logo{width:28px;height:28px}
  .top-actions .button{padding:0 8px}
  .wide-only{display:none}
  .button.button.mobile-filter-toggle{display:inline-flex;flex:0 0 auto}
  .mobile-filter-toggle.is-active{background:var(--blue-soft);color:var(--blue-dark);border-color:rgba(31,95,191,.3)}
  .search-control{display:flex;align-items:center;gap:8px}
  .search-control .search-box{flex:1;min-width:0}
  .sidebar.mobile-filters-open .control-block:not(.search-control){display:block}
  .control-block{padding:8px 12px}
  .school-list{padding:4px 8px 16px}
  .school-card{padding:8px;gap:8px}
  .dashboard-filters{grid-template-columns:1fr;gap:12px;padding:12px}
  .dashboard-chart-grid{grid-template-columns:1fr;gap:12px}
  .dashboard-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .dashboard-dialog,.info-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}
  .dialog-shell{max-height:calc(100dvh - 18px)}
  .dialog-close{top:8px;right:8px}
  .dashboard-view-switch{display:grid;grid-template-columns:1fr 1fr;width:100%}
  .dashboard-view-button{padding:0 8px}
  .map-area{inset:0 0 44% 0}
  .workspace:has(.detail-panel:not([hidden])) .map-area,.workspace:has(.candidate-panel:not([hidden])) .map-area,
  .workspace.comparison-open .map-area,.workspace.comparison-open.comparison-collapsed .map-area{inset:0}
  .workspace:has(.detail-panel:not([hidden])) .sidebar,.workspace:has(.candidate-panel:not([hidden])) .sidebar{visibility:hidden;pointer-events:none}
  .workspace:has(.detail-panel:not([hidden])) .sidebar-toggle,.workspace:has(.candidate-panel:not([hidden])) .sidebar-toggle{visibility:hidden}
  .workspace.comparison-open .sidebar,.workspace.comparison-open .sidebar-toggle{visibility:hidden;pointer-events:none}
  .detail-panel,.candidate-panel{top:auto;left:8px;right:8px;bottom:8px!important;width:auto;height:44%;max-height:none}
  .workspace.comparison-open:not(.comparison-collapsed) .detail-panel,
  .workspace.comparison-open:not(.comparison-collapsed) .candidate-panel{bottom:calc(var(--comparison-current-height) + 48px)!important;height:18%;min-height:112px}
  .workspace.comparison-open.comparison-collapsed .detail-panel,
  .workspace.comparison-open.comparison-collapsed .candidate-panel{bottom:96px!important;height:36%}
  #detailContent,#candidateContent{padding:20px 12px 12px}
  .candidate-hint{width:calc(100% - 16px);font-size:var(--font-base)}
  .comparison-panel-head{padding:8px 12px!important}
  .comparison-heading{min-width:0}
  .comparison-heading strong{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
  .comparison-content{padding:8px 12px}
  .toast{max-width:calc(100vw - 24px);white-space:normal;text-align:center;border-radius:12px}
}
@media(max-width:359px){.brand-logo{display:none}}
@media(prefers-reduced-transparency:reduce){.material-bar,.material-regular,.material-thick,.info-dialog,.dashboard-dialog{background:#F9FBFE;backdrop-filter:none;-webkit-backdrop-filter:none}}

/* V17 — fixed region colors and compact, single-line comparison routes. */
#regionFilters{flex-wrap:wrap;overflow:visible;gap:8px}
#regionFilters .chip{padding:0 8px}
.region-chip{display:inline-flex;align-items:center;justify-content:center;gap:4px}
.region-chip::before{content:"";width:6px;height:6px;flex:0 0 6px;border-radius:50%;background:var(--region-color)}
.region-chip.active{color:#23364D;background:color-mix(in srgb,var(--region-color) 12%,#fff);border-color:color-mix(in srgb,var(--region-color) 45%,#fff)}
.boundary-label-region{color:var(--region-color,#334155)}
.candidate-comparison-table{min-width:944px}
.candidate-comparison-table th,.candidate-comparison-table td{padding:4px 8px;vertical-align:middle}
.candidate-comparison-table th:nth-child(7),.candidate-comparison-table td:nth-child(7){width:280px}
.candidate-comparison-table .route-cell{padding:4px 8px}
.comparison-route-groups{display:grid;grid-template-columns:1fr 1fr;gap:8px;white-space:nowrap}
.comparison-route-groups>span{display:flex;align-items:center;justify-content:flex-start;gap:4px;min-width:0}
.comparison-route-groups b{width:auto;flex:0 0 auto;font-weight:600}
.comparison-route-groups a{min-height:32px;border-radius:8px;padding:0 6px;font-weight:500}
.comparison-route-groups a:hover{background:var(--blue-soft);border-color:var(--blue)}
.comparison-route-groups a:active{filter:brightness(.96)}
@media(min-width:768px) and (max-width:1279px){
  .candidate-comparison-table{min-width:860px}
  .candidate-comparison-table th:nth-child(7),.candidate-comparison-table td:nth-child(7){width:244px}
}
@media(max-width:767px){
  .candidate-comparison-table{min-width:816px}
  .candidate-comparison-table th,.candidate-comparison-table td{padding:4px 6px}
  .candidate-comparison-table th:nth-child(7),.candidate-comparison-table td:nth-child(7){width:224px}
  .candidate-comparison-table .route-cell{padding:4px 6px}
  .comparison-route-groups{gap:8px}
  .comparison-route-groups a{padding:0 4px}
}

/* V18 — shared modal shell, restrained materials, and table-led analysis. */
.info-dialog,.dashboard-dialog{position:fixed;inset:0;margin:auto}
.info-dialog{width:min(560px,calc(100vw - 32px))}
.dashboard-dialog{width:min(1200px,calc(100vw - 32px))}
.modal-shell{display:flex;flex-direction:column;padding:0;max-height:calc(100dvh - 34px);overflow:hidden;scrollbar-gutter:auto}
.dialog-header{display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:var(--panel-space);border-bottom:var(--surface-border);flex:0 0 auto}
.dialog-header>div{min-width:0}
.dialog-header h2{margin:4px 0 0;font-size:var(--font-title)!important;font-weight:700;line-height:1.3}
.dialog-header .dialog-close{position:static;flex:0 0 var(--control-height);margin:0}
.dialog-body{padding:16px var(--panel-space) var(--panel-space);flex:1 1 auto;min-height:0;overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;scrollbar-width:thin}
.info-dialog .dialog-body>p:first-child{margin-top:0}
.info-dialog::backdrop,.dashboard-dialog::backdrop{background:rgba(20,30,45,.3);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.analysis-toolbar{display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap}
.analysis-toolbar .dashboard-view-switch{display:inline-flex;width:auto;gap:4px;padding:4px;border:var(--surface-border);border-radius:calc(var(--control-radius) + 4px);background:rgba(235,241,250,.8)}
.analysis-toolbar .dashboard-view-button{border:1px solid transparent;border-radius:calc(var(--control-radius) - 4px);background:transparent;color:#536478;margin:0}
.analysis-toolbar .dashboard-view-button.active{background:rgba(255,255,255,.96);border-color:rgba(31,95,191,.18);color:var(--blue-dark);box-shadow:none}
.analysis-toolbar-actions,.analysis-settings-actions{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.analysis-mobile-filters-toggle,.analysis-burden-settings-toggle{display:none}
.analysis-filters .dashboard-filters{margin:16px 0 0;border-radius:var(--card-radius);border:var(--surface-border);background:rgba(239,245,253,.65)}
.analysis-scope,.analysis-note,.analysis-source,.analysis-rule-summary,.analysis-error{font-size:var(--font-base);font-weight:500;line-height:1.5;color:#566577}
.analysis-scope{margin:12px 0}
.analysis-tabs{display:flex;gap:8px;flex-wrap:wrap;margin:16px 0}
.analysis-tab.active{color:var(--blue-dark);background:var(--blue-soft);border-color:rgba(31,95,191,.3)}
.analysis-results{animation:analysis-reveal .12s ease-out}
@keyframes analysis-reveal{from{opacity:.5}to{opacity:1}}
.analysis-metrics{grid-template-columns:repeat(auto-fit,minmax(140px,1fr));margin-top:0}
.analysis-metric-value{display:flex;align-items:baseline;gap:4px;white-space:nowrap}
.analysis-metric-value small{margin:0}
.analysis-note{margin:12px 0 0}
.analysis-source{margin:24px 0 0;padding-top:12px;border-top:var(--surface-border)}
.analysis-section{margin-top:24px;padding-top:16px}
.analysis-table-wrap{overflow:auto;max-height:42dvh;overscroll-behavior:contain;scrollbar-width:thin;border:var(--surface-border);border-radius:var(--card-radius)}
.analysis-region-wrap{max-height:none}
.analysis-table{width:100%;border-collapse:separate;border-spacing:0;font-size:var(--font-base);font-weight:400;line-height:1.5;min-width:940px}
.analysis-table th,.analysis-table td{padding:8px 12px;text-align:left;border-bottom:1px solid rgba(15,23,42,.07);white-space:nowrap;vertical-align:middle;font-variant-numeric:tabular-nums}
.analysis-table thead th{position:sticky;top:0;z-index:1;background:#F2F6FB;font-weight:600}
.analysis-table tbody th{font-weight:600}
.analysis-table tr:last-child>*{border-bottom:0}
.analysis-table tr[data-dashboard-school-id],.analysis-table tr[data-dashboard-pool-name],.analysis-table tr[data-analysis-region]{cursor:pointer}
.analysis-table tr[data-dashboard-school-id]:hover,.analysis-table tr[data-dashboard-pool-name]:hover,.analysis-table tr[data-analysis-region]:hover{background:rgba(31,95,191,.05)}
.analysis-table .analysis-empty{padding:24px;text-align:center;white-space:normal;color:var(--subtle)}
.analysis-region-name{display:inline-flex;align-items:center;gap:8px}
.analysis-region-name i{width:8px;height:8px;border-radius:50%;background:var(--region-color);flex:0 0 8px}
.analysis-status{display:inline-flex;align-items:center;min-height:24px;padding:0 8px;border-radius:8px;color:#566577;background:#F0F3F7;font-weight:500}
.analysis-status.is-exceeded{color:var(--blue-dark);background:var(--blue-soft)}
.analysis-burden-settings{padding:16px;border:var(--surface-border);border-radius:var(--card-radius);background:rgba(239,245,253,.55);margin-bottom:16px}
.analysis-field-grid{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:16px}
.analysis-field{display:flex;flex-direction:column;gap:4px;min-width:0;font-size:var(--font-base);font-weight:600;color:#425369}
.analysis-control{width:100%;min-width:0;height:var(--control-height);padding:0 12px;border:1px solid rgba(15,23,42,.14);border-radius:var(--control-radius);background:rgba(255,255,255,.95);font-family:inherit;font-size:var(--font-base);font-weight:400;color:var(--text)}
.analysis-control:hover{border-color:rgba(31,95,191,.4)}
.analysis-control:focus-visible{outline:2px solid var(--blue);outline-offset:2px;box-shadow:var(--focus-ring)}
.analysis-control[aria-invalid="true"]{border-color:#C13B35}
.analysis-settings-actions{margin-top:16px}
.analysis-error{margin:8px 0 0;color:#B52D29}
.analysis-error:empty{display:none}
.analysis-sort-field{min-width:200px;flex-direction:row;align-items:center;gap:8px;white-space:nowrap}
.analysis-sort-field select{width:180px}
.analysis-pool-bars{display:grid;gap:12px}
.analysis-pool-bar{display:grid;grid-template-columns:minmax(100px,200px) minmax(40px,1fr) auto;align-items:center;gap:8px;font-size:var(--font-base)}
.analysis-pool-bar>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.analysis-pool-bar strong{font-weight:700;white-space:nowrap}
.analysis-bar-track{height:8px;border-radius:4px;background:#E7EDF5;overflow:hidden}
.analysis-bar-track i{display:block;height:100%;background:#2F6FD4;border-radius:4px}
@media(min-width:768px) and (max-width:1279px){
  .analysis-field-grid{grid-template-columns:repeat(3,minmax(0,1fr))}
  .analysis-table{min-width:880px}
}
@media(max-width:767px){
  .info-dialog,.dashboard-dialog{width:calc(100vw - 16px)}
  .modal-shell{max-height:calc(100dvh - 18px)}
  .dialog-header{gap:8px}
  .dialog-body{padding-top:12px}
  .analysis-toolbar .dashboard-view-button,.analysis-toolbar-actions .button{padding:0 8px}
  .analysis-mobile-filters-toggle,.analysis-burden-settings-toggle{display:inline-flex}
  .analysis-filters:not(.is-expanded) .dashboard-filters{display:none}
  .analysis-filters .dashboard-filters{margin-top:12px}
  .analysis-tabs{margin:12px 0}
  .analysis-metrics{grid-template-columns:repeat(2,minmax(0,1fr))}
  .analysis-burden-settings{padding:12px}
  .analysis-burden-settings:not(.is-expanded) .analysis-burden-controls{display:none}
  .analysis-field-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:8px}
  .analysis-field-grid .analysis-field:last-child{grid-column:1/-1}
  .analysis-table{min-width:820px}
  .analysis-table th,.analysis-table td{padding:8px}
  .analysis-table-wrap{max-height:44dvh}
  .analysis-region-wrap{max-height:none}
  .analysis-distribution-head{flex-wrap:wrap;gap:8px}
  .analysis-sort-field{min-width:0;width:100%;justify-content:space-between}
  .analysis-sort-field select{width:180px}
  .analysis-section .dashboard-section-head{align-items:flex-start;gap:8px}
  .analysis-section .dashboard-section-head>span{max-width:50%;text-align:right}
}
@supports(transition-behavior:allow-discrete){
  .info-dialog,.dashboard-dialog,.filter-dialog{opacity:0;transform:translateY(4px);transition:opacity .14s ease,transform .14s ease,display .14s allow-discrete,overlay .14s allow-discrete}
  .info-dialog[open],.dashboard-dialog[open],.filter-dialog[open]{opacity:1;transform:translateY(0)}
  @starting-style{.info-dialog[open],.dashboard-dialog[open],.filter-dialog[open]{opacity:0;transform:translateY(4px)}}
}
@media(prefers-reduced-motion:reduce){
  .analysis-results{animation:none}
  .info-dialog,.dashboard-dialog,.filter-dialog{transition:none!important;transform:none}
}
@media(prefers-reduced-motion:reduce){.map-area,.sidebar,.edge-toggle,.detail-panel,.candidate-panel,.comparison-panel,.comparison-content{transition:none!important}}
@media(prefers-reduced-transparency:reduce){
  .info-dialog::backdrop,.dashboard-dialog::backdrop{background:rgba(20,30,45,.3);backdrop-filter:none;-webkit-backdrop-filter:none}
}

/* V19 — chart-first analysis and one filtered map scope. */
.region-chip::before{content:none;display:none}
.usage-line-toggle{display:flex;align-items:center;gap:8px;min-height:var(--control-height);font-size:var(--font-base);font-weight:500;cursor:pointer;border-radius:var(--control-radius)}
.usage-line-toggle input{width:16px;height:16px;margin:0;accent-color:var(--blue);flex:0 0 16px}
.usage-line-toggle:has(input:focus-visible){outline:2px solid var(--blue);outline-offset:2px}
.usage-line-tooltip{font-family:inherit;font-size:var(--font-base);font-weight:500;max-width:260px;white-space:normal;border:var(--surface-border);border-radius:8px;background:rgba(253,254,255,.97);box-shadow:var(--shadow)}
.analysis-chart-bars{display:grid;gap:12px}
.analysis-chart-row{display:grid;grid-template-columns:minmax(88px,1.2fr) minmax(44px,1fr) auto;align-items:center;gap:8px;font-size:var(--font-base);font-weight:400}
.analysis-chart-row>span:first-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-weight:500}
.analysis-chart-row strong{font-weight:700;white-space:nowrap;font-variant-numeric:tabular-nums}
.analysis-chart-track{height:8px;background:#E7EDF5;border-radius:4px;overflow:hidden}
.analysis-chart-track i{display:block;height:100%;border-radius:4px}
.dashboard-chart-card,.dashboard-distance-card{border:var(--surface-border);border-radius:var(--card-radius);padding:16px;background:rgba(255,255,255,.8)}
.dashboard-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:16px}
.dashboard-section,.dashboard-distance-card{margin-top:24px}
.donut-layout{gap:16px}
.donut-legend>div{gap:8px}
@media(max-width:767px){.dashboard-chart-grid{grid-template-columns:1fr;gap:12px;margin-top:12px}.dashboard-chart-card,.dashboard-distance-card{padding:12px}.dashboard-section,.dashboard-distance-card{margin-top:16px}.analysis-chart-row{grid-template-columns:minmax(90px,1.2fr) minmax(32px,1fr) auto}.usage-line-control{padding-top:4px;padding-bottom:4px}}

/* V20 — fixed modal controls and restored selection connections. */
.button.mobile-filter-toggle.is-active{background:var(--blue-soft);color:var(--blue-dark);border-color:rgba(31,95,191,.3)}
.search-control{display:flex;align-items:center;gap:8px}.search-control .search-box{flex:1;min-width:0}.button.mobile-filter-toggle{display:inline-flex;flex:0 0 auto}
.filter-dialog{position:fixed;inset:0;margin:auto;padding:0;width:min(560px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:hidden;color:var(--text);border:var(--surface-border);border-radius:var(--panel-radius);box-shadow:var(--shadow)}
.filter-dialog .control-block{display:block!important;padding:16px 0;border-bottom:var(--surface-border)}.filter-dialog .control-block:first-child{padding-top:0}.filter-dialog .control-block:last-child{border-bottom:0;padding-bottom:0}
.filter-dialog .control-title-row{margin-bottom:8px}.filter-dialog .chip-row{flex-wrap:wrap;gap:8px}
.dialog-footer{display:flex;justify-content:space-between;gap:8px;padding:16px var(--panel-space);border-top:var(--surface-border);flex:0 0 auto}.dialog-footer>div{display:flex;gap:8px}
.filter-dialog::backdrop{background:rgba(20,30,45,.3);backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px)}
.region-chip.active{color:#fff;background:var(--blue);border-color:transparent}
.usage-colored-pool{background:var(--usage-pool-color)!important}.usage-colored-pool.selected-pool-marker,.usage-colored-pool.connected-pool-marker{outline:2px solid #fff;outline-offset:2px}
.analysis-header-main{display:flex;align-items:center;gap:24px;flex-wrap:wrap;flex:1;min-width:0}.analysis-header-main .dashboard-view-switch{display:flex;width:auto;gap:4px;padding:4px;border:var(--surface-border);border-radius:16px;background:rgba(235,241,250,.8)}
.analysis-header-main .dashboard-view-button{margin:0;border:1px solid transparent;border-radius:8px;background:transparent;color:#536478}.analysis-header-main .dashboard-view-button.active{background:rgba(255,255,255,.96);border-color:rgba(31,95,191,.18);color:var(--blue-dark);box-shadow:none}
.analysis-toolbar:has(>.analysis-mobile-filters-toggle:only-child){justify-content:flex-end}
.dashboard-chart-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.donut-layout{grid-template-columns:104px minmax(0,1fr);gap:12px}.donut-chart{width:104px;height:104px}.donut-chart i{inset:22px}.donut-legend>div{grid-template-columns:8px minmax(0,1fr) auto auto;gap:8px}
@media(min-width:768px) and (max-width:1279px){.dashboard-chart-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media(max-width:1023px){.dashboard-chart-grid{grid-template-columns:1fr}}
@media(max-width:767px){.filter-dialog{width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.analysis-header-main{display:block}.analysis-header-main .dashboard-view-switch{margin-top:12px;width:max-content;max-width:100%}.dialog-footer{padding:12px var(--panel-space)}}
@media(prefers-reduced-transparency:reduce){.filter-dialog{background:#F9FBFE;backdrop-filter:none;-webkit-backdrop-filter:none}.filter-dialog::backdrop{backdrop-filter:none;-webkit-backdrop-filter:none}}