.comparison-nav-slot{display:flex;align-items:center}
.compare-btn{background:#edf4fc!important;color:#154f8e!important;border-color:#a9c4e2!important;white-space:normal;line-height:1.2;text-align:center}
.compare-btn:hover,.compare-btn:focus{background:#dfeefa!important;border-color:#6f9dcc!important}

.comparison-page{max-width:1500px;margin:0 auto;padding:24px;color:var(--ink)}
.comparison-hero{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,470px);gap:28px;align-items:center;margin-bottom:20px;padding:28px 30px;background:linear-gradient(135deg,#f7fbff 0%,#edf4fc 100%);border:1px solid #cbd9e8;border-radius:14px}
.comparison-back{display:inline-flex;align-items:center;gap:7px;min-height:42px;margin:0 0 22px;padding:9px 14px;border:2px solid #1b5b9a;border-radius:7px;background:#fff;color:#154f8e;font-size:14px;font-weight:800;box-shadow:0 2px 7px rgba(21,79,142,.14);cursor:pointer}
.comparison-back:hover,.comparison-back:focus{background:#dfeefa;border-color:#0f4279;color:#0f4279;text-decoration:none}
.comparison-back:focus-visible{outline:3px solid #f9bf3b;outline-offset:3px}
.comparison-kicker{margin:0 0 8px;color:#476789;font-size:12px;font-weight:800;letter-spacing:.12em}
.comparison-hero h1{margin:0;max-width:900px;color:#102947;font-size:clamp(25px,3vw,38px);line-height:1.12}
.comparison-intro{max-width:850px;margin:12px 0 0;color:#4a6078;font-size:15px;line-height:1.55}
.comparison-target-card{align-self:stretch;display:flex;align-items:center;padding:20px 22px;background:#fff;border:1px solid #c5d4e4;border-radius:12px;box-shadow:0 6px 20px rgba(23,56,91,.07)}
.comparison-target-card>div{display:flex;flex-direction:column;gap:5px;width:100%}
.comparison-target-card .shiny-html-output>div{display:flex;flex-direction:column;gap:5px;width:100%}
.comparison-target-card strong{display:block;font-size:18px;color:#122a45}
.comparison-target-card>div>span:not(.comparison-target-label){color:#526b84;font-size:13px}
.comparison-target-label{color:#1b5b9a;font-size:11px;font-weight:800;letter-spacing:.09em;text-transform:uppercase}
.comparison-target-stats{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:10px}
.comparison-target-stats span{padding:8px;background:#f4f7fa;border-radius:7px;color:#52677c;font-size:11px;line-height:1.3}
.comparison-target-stats b{display:block;color:#163b64;font-size:13px;margin-bottom:2px}

.comparison-layout{display:grid;grid-template-columns:300px minmax(0,1fr);gap:20px;align-items:start}
.comparison-controls{position:sticky;top:86px;padding:20px}
.comparison-controls h2{margin:0 0 5px;font-size:18px}
.comparison-controls>.hint{margin:0 0 20px;line-height:1.45}
.comparison-controls label,.comparison-controls legend{display:block;margin:17px 0 7px;color:#304b68;font-size:12px;font-weight:800;letter-spacing:.03em}
.comparison-controls fieldset{margin:0;padding:0;border:0}
.comparison-controls .form-group{margin-bottom:10px}
.comparison-controls .checkbox{margin:9px 0;color:#263d56;font-size:13px}
.comparison-controls input[type=checkbox]{accent-color:#1f5a9d}
.comparison-controls select.form-control{border-color:var(--control-border);min-height:36px}
.filter-checks .shiny-options-group{display:flex;flex-wrap:wrap;gap:7px 10px}
.filter-checks .checkbox-inline{display:inline-flex;align-items:center;min-width:66px;margin:0;padding-left:19px;color:#263d56;font-size:12px}
.grade-checks .checkbox-inline{min-width:31px}
.filter-hint{margin:5px 0 0;color:#66798e;font-size:11px;line-height:1.4}
.filter-explainer{margin:12px 0 4px;padding:10px 11px;background:#f7f9fb;border:1px solid #d9e2eb;border-radius:6px;color:#52677c;font-size:11px;line-height:1.45}
.filter-explainer summary{cursor:pointer;color:#294d73;font-weight:800}
.filter-explainer p{margin:8px 0 0}
.match-note{margin-top:15px;padding:12px 13px;background:#f4f7fa;border-left:3px solid #6f9dcc;color:#476078;font-size:12px;line-height:1.45}
.match-note b{color:#173c65}
.match-warning{margin:8px 0 0;color:#8a4b13}
.scope-explanation{margin:9px 0 0;padding-top:9px;border-top:1px solid #d5dee7;color:#52677c}

.comparison-map-card{overflow:hidden}
.comparison-map-card>header,.comparison-results>header{display:flex;align-items:flex-start;justify-content:space-between;gap:18px;padding:16px 18px;border-bottom:1px solid var(--border)}
.comparison-map-card h2,.comparison-results h2{margin:0;font-size:17px}
.comparison-map-card header .hint,.comparison-results header .hint{margin:4px 0 0}
.indicator-display-toggle{flex:0 0 auto;padding:2px 0;color:#304b68;font-size:12px;font-weight:700;white-space:nowrap}
.indicator-display-toggle .form-group,.indicator-display-toggle .checkbox{margin:0}
.indicator-display-toggle input[type=checkbox]{accent-color:#1f5a9d}
.comparison-map-wrap{background:#eef2f5}
.comparison-map-wrap .leaflet-container{font-family:inherit;background:#e8eef3}
.comparison-map-wrap .leaflet-overlay-pane svg{width:auto!important;height:auto!important}
.comparison-map-wrap .leaflet-popup-content,.comparison-map-wrap .leaflet-tooltip{font-size:12px;line-height:1.45}
.comparison-inline-legend{display:flex;gap:13px;align-items:center;flex-wrap:wrap;color:#52677c;font-size:11px;white-space:nowrap}
.comparison-inline-legend span{display:inline-flex;align-items:center;gap:5px}
.map-key{display:inline-block;width:10px;height:10px;border-radius:50%;border:1px solid #fff;box-shadow:0 0 0 1px rgba(21,44,69,.25)}
.map-key.target{background:#c38b00}.map-key.peer{background:#1f5a9d}.map-key.manual{background:#6f42a8}.map-key.other{background:#9aa8b8}

.comparison-manual{position:relative;z-index:20;margin-top:20px;overflow:visible}
.comparison-manual .selectize-dropdown{z-index:1050;max-height:340px;overflow-y:auto}
.comparison-manual>header{padding:16px 18px;border-bottom:1px solid var(--border)}
.comparison-manual h2{margin:0;font-size:17px}
.comparison-manual header .hint{margin:4px 0 0}
.comparison-manual-body{display:grid;grid-template-columns:minmax(0,1fr) minmax(260px,.65fr);gap:18px;align-items:end;padding:16px 18px 18px}
.comparison-manual-picker{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:10px;align-items:end}
.comparison-manual-picker .form-group{margin:0}
.comparison-manual-picker label{display:block;margin:0 0 6px;color:#304b68;font-size:12px;font-weight:800}
.comparison-manual-picker .selectize-input{min-height:38px}
.clear-manual-button,.comparison-share-button,.comparison-download-button{min-height:38px;border:1px solid #a9c4e2;border-radius:6px;background:#fff;color:#154f8e;padding:8px 12px;font-size:12px;font-weight:700;cursor:pointer;white-space:nowrap}
.clear-manual-button:hover,.clear-manual-button:focus,.comparison-share-button:hover,.comparison-share-button:focus,.comparison-download-button:hover,.comparison-download-button:focus{background:#edf4fc;border-color:#6f9dcc}
.manual-empty-note,.manual-ok-note{margin:0;padding:10px 12px;border-radius:6px;background:#f4f7fa;color:#52677c;font-size:12px}
.manual-compatibility-warning{padding:10px 12px;border-left:4px solid #c77b22;border-radius:4px;background:#fff7e8;color:#72471f;font-size:12px;line-height:1.45}
.comparison-share{display:flex;align-items:center;gap:9px;flex:0 0 auto}
.comparison-share-button,.comparison-download-button{min-height:34px}
.comparison-copy-status{color:#2c6b4f;font-size:11px;font-weight:700;min-width:62px}
.comparison-share-help{position:relative;flex:0 0 auto}
.comparison-share-help summary{display:grid;place-items:center;width:22px;height:22px;border:1px solid #8eabc8;border-radius:50%;background:#edf4fc;color:#154f8e;font-size:12px;font-weight:800;cursor:pointer;list-style:none}
.comparison-share-help summary::-webkit-details-marker{display:none}
.comparison-share-help summary:hover,.comparison-share-help summary:focus{background:#dceafa;border-color:#4d7faf;outline:2px solid transparent}
.comparison-share-help-popover{display:none;position:absolute;z-index:20;top:30px;right:-8px;width:320px;padding:11px 12px;border:1px solid #a9c4e2;border-radius:7px;background:#fff;box-shadow:0 8px 22px rgba(21,43,68,.18);color:#405970;font-size:12px;font-weight:500;line-height:1.45;white-space:normal}
.comparison-share-help[open] .comparison-share-help-popover,.comparison-share-help:hover .comparison-share-help-popover,.comparison-share-help:focus-within .comparison-share-help-popover{display:block}

.comparison-results{position:relative;z-index:1;margin-top:20px;overflow:hidden}
.comparison-results .dataTables_wrapper{padding:14px 16px 18px}
.comparison-results table.dataTable{border-collapse:collapse!important}
.comparison-results .dataTables_scrollBody{overflow-x:auto!important}
.comparison-results table.dataTable thead th{padding:9px;background:#eef3f8;color:#294763;border-bottom:1px solid #c4d2df;font-size:11px;line-height:1.2;text-transform:uppercase;letter-spacing:.03em;white-space:pre-line!important;vertical-align:bottom}
.comparison-results table.dataTable tbody td{padding:10px 9px;border-bottom:1px solid #e0e7ee;color:#233950;font-size:12px;vertical-align:top;white-space:nowrap}
.comparison-results table.dataTable tbody tr:first-child td{background:#fff8e5;font-weight:700}
.comparison-results .dataTables_info,.comparison-results .dataTables_paginate{font-size:11px;color:#63758a}
.comparison-method{margin-top:20px;padding:0}
.comparison-method details{padding:18px 20px}
.comparison-method summary{cursor:pointer;color:#173f6c;font-weight:800}
.comparison-method p{max-width:1000px;color:#52677c;font-size:13px;line-height:1.55}

@media(max-width:1100px){
  .comparison-hero{grid-template-columns:1fr}
  .comparison-layout{grid-template-columns:1fr}
  .comparison-controls{position:static;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 20px}
  .comparison-controls h2,.comparison-controls>.hint,.comparison-controls .match-note{grid-column:1/-1}
}
@media(max-width:700px){
  .comparison-page{padding:12px}
  .comparison-manual-body,.comparison-manual-picker{grid-template-columns:1fr}
  .clear-manual-button{width:100%}
  .comparison-hero{padding:20px 18px;gap:18px}
  .comparison-target-stats{grid-template-columns:1fr}
  .comparison-controls{display:block}
  .comparison-map-card>header,.comparison-results>header{display:block}
  .indicator-display-toggle{margin-top:12px;white-space:normal}
  .comparison-inline-legend{margin-top:10px}
  .comparison-map-wrap .leaflet-container{height:480px!important}
  html,body{max-width:100%;overflow-x:hidden}
  .topbar,.purpose-strip,.comparison-page,.comparison-hero,.comparison-layout,.comparison-controls,.comparison-map-card,.comparison-manual,.comparison-results{min-width:0;max-width:100%}
  .comparison-results .dataTables_wrapper{max-width:100%;overflow-x:auto}
  .comparison-results .dataTables_scroll{max-width:100%}
  .comparison-share-help-popover{position:fixed;left:12px;right:12px;width:auto}
}
@media print{
  .comparison-page{max-width:none;padding:0}
  .comparison-back,.comparison-controls,.comparison-map-card,.comparison-manual,.comparison-share{display:none!important}
  .comparison-layout{display:block}
  .comparison-results{break-inside:avoid}
}

.comparison-download-intro{margin:0 0 14px;color:#52677c;line-height:1.5}
.modal-dialog .shiny-options-group{max-height:360px;overflow:auto;padding:4px 8px;border:1px solid #d5dee8;border-radius:6px;background:#f8fafc}
