:root{font-family:system-ui,-apple-system,sans-serif;color:#213d47;font-size:14px;color-scheme:light}*{box-sizing:border-box}body{margin:0}html,body,#map{width:100%;height:100%;overflow:hidden}#map{position:fixed;inset:0;background:#e3ecec}#panel{position:fixed;left:16px;top:16px;width:330px;max-height:calc(100dvh - 70px);overflow:auto;z-index:800;background:rgba(255,255,255,.96);border:1px solid #d2ddde;box-shadow:0 4px 25px #24434e26;border-radius:14px;padding:20px}header{position:relative}.eyebrow{font-size:10px;letter-spacing:.11em;color:#59727c;margin-right:85px;line-height:1.7}.badge{display:inline-block;color:#73500f;background:#fff1cf;border-radius:4px;padding:1px 4px;letter-spacing:0}h1{font-size:24px;line-height:1.2;margin:12px 0 8px;font-weight:680}#date{margin:0;font-size:12px;color:#4b636b}#collapse{position:absolute;right:0;top:0;padding:7px 9px;background:white;color:#31505b;border:1px solid #b5cbd0;border-radius:6px;cursor:pointer}.intro{font-size:12px;line-height:1.5;margin:14px 0;color:#42616a}label{display:block;font-weight:600;margin-top:13px;font-size:12px}select{width:100%;margin-top:5px;padding:8px;border:1px solid #c2d2d4;background:white;color:inherit;border-radius:6px}input[type=range]{width:100%;accent-color:#397e90;margin:10px 0 1px}output{float:right;font-variant-numeric:tabular-nums}.hint{font-size:10.5px;color:#62777d;line-height:1.5;margin:5px 0 14px}.rank-scale-labels{display:flex;justify-content:space-between;font-size:10px;color:#64747a;margin:3px 0 8px}#counts{font-size:11px;color:#57717a;margin:9px 0}details{font-size:12px;line-height:1.55;margin-top:13px}summary{cursor:pointer;font-weight:650}details p{margin:9px 0}#model{font-size:10px;overflow-wrap:anywhere;color:#687c83}#error{color:#9b382b;font-size:12px}#mapNote{position:fixed;bottom:30px;left:16px;z-index:750;background:#ffffffed;border-radius:6px;padding:7px 12px;font-size:11px;max-width:calc(100% - 32px);pointer-events:none}.leaflet-top.leaflet-left{left:auto;right:14px;top:12px}.leaflet-top.leaflet-left .leaflet-control{margin-left:0;margin-right:0}.leaflet-popup-content-wrapper{border-radius:12px}.leaflet-popup-content{margin:19px 22px;line-height:1.5;max-height:70dvh;overflow:auto;max-width:calc(100vw - 85px)}.cell-title{font-size:18px;font-weight:700;margin:0 0 4px}.cell-subtitle{font-size:11px;color:#637981;margin:0 0 11px}.cell-rank{font-size:20px;color:#ad412c;margin:7px 0}.cell-rank small{font-size:11px;color:#61717a}.cell-note{font-size:11px;color:#687a80}.condition-grid{display:grid;grid-template-columns:1fr 1fr;gap:5px 12px;margin:10px 0}.condition-grid div{font-size:11px;background:#f3f7f7;padding:7px;border-radius:4px}.condition-grid strong{font-size:14px;display:block}table{border-collapse:collapse;width:100%;font-size:11px;margin-top:8px}td,th{border-bottom:1px solid #dbe4e5;padding:5px;text-align:left;vertical-align:top}td:last-child{text-align:right;font-variant-numeric:tabular-nums}.up{color:#aa432c}.down{color:#296d96}.contribution-bar{display:inline-block;height:5px;vertical-align:middle;border-radius:2px;margin-left:4px}.worldcover-inset{margin:12px 0;padding:12px;background:#f6f8f6;border:1px solid #d8e1da;border-radius:8px;font-size:11px}.worldcover-inset figcaption{font-weight:600}.worldcover-native-canvas{display:block;width:min(100%,calc(270px * var(--cell-aspect,1)));height:auto;margin:10px auto;image-rendering:pixelated;border:1px solid #708378;touch-action:pan-y pinch-zoom}.worldcover-summary,.worldcover-note{font-size:10px;line-height:1.5}.worldcover-orientation{font-size:10px;text-align:center}.worldcover-key{display:flex;flex-wrap:wrap;gap:10px;font-size:10px}.worldcover-key-item{display:flex;align-items:center;gap:4px}.worldcover-swatch{width:12px;height:12px;background:#d5d0c4;display:inline-block}.worldcover-swatch.natural{background:#31835d}.worldcover-swatch.unknown{background:repeating-linear-gradient(45deg,#eee9ef,#eee9ef 3px,#ad98b0 3px,#ad98b0 4px)}.worldcover-value{min-height:28px;font-size:10px}.cells{pointer-events:none}.stale{color:#a45710;font-weight:600}.loading{color:#6a7c83;font-size:11px}.leaflet-container{font-family:inherit}a{color:#277787}
@media(max-width:600px){#panel{left:8px;top:8px;width:min(290px,calc(100vw - 64px));padding:14px;max-height:65dvh}h1{font-size:20px}.eyebrow{font-size:9px}#collapse{font-size:11px;padding:6px}#mapNote{font-size:10px;left:8px;bottom:27px;max-width:calc(100% - 16px)}.leaflet-popup-content{margin:16px;max-height:62dvh}.cell-title{font-size:16px}.cell-rank{font-size:18px}#panel.collapsed h1{font-size:18px}.condition-grid{gap:4px}}

@media(max-width:600px){body.cell-open #panel{visibility:hidden}.worldcover-native-canvas{width:min(100%,calc(210px * var(--cell-aspect,1)))}}



.leaflet-popup-content p{margin:8px 0}.worldcover-swatch.tree{background:#176847}.worldcover-swatch.shrub{background:#31835d}.worldcover-swatch.grass{background:#75a987}.condition-grid small{display:block;color:#61747a;margin-top:3px}

.leaflet-popup-content section{width:100%;min-width:0}.leaflet-popup-content table{table-layout:fixed}.leaflet-popup-content th,.leaflet-popup-content td,.cell-note{overflow-wrap:anywhere}

/* The title definition is available on hover, keyboard focus, and tap. */
.panel-heading{display:flex;align-items:flex-start;justify-content:space-between;gap:10px}.panel-heading .title-help{flex:1;min-width:0}.panel-heading h1{margin:0 0 8px}.panel-heading #collapse{position:static;flex:0 0 auto}
.title-help{position:relative}.title-definition-button{display:block;width:100%;padding:0;border:0;background:none;color:inherit;font:inherit;line-height:inherit;text-align:left;cursor:help}.title-definition-button span{text-decoration:underline dotted #8ba5aa;text-underline-offset:4px;text-decoration-thickness:1px}.title-definition-button:focus-visible{outline:2px solid #397e90;outline-offset:4px;border-radius:3px}.definition-tip{position:absolute;top:100%;left:0;width:100%;z-index:15;margin-top:4px;padding:13px 14px;background:#fff;border:1px solid #a9c3c9;border-radius:9px;box-shadow:0 6px 20px #213d4733;color:#31505b;font-size:12px;line-height:1.5;overflow-wrap:anywhere}.definition-tip strong{font-size:12px}.definition-tip p{margin:7px 0 0}

.definition-tip::before{content:"";position:absolute;top:-5px;left:0;right:0;height:5px}

/* Main-panel explainer and accessible two-choice comparison control. */
.pipeline-card ul{margin:7px 0;padding-left:17px;color:#4d656d;font-size:11px;line-height:1.48}.pipeline-card li+li{margin-top:3px}
.how-link{display:inline-flex;align-items:center;gap:7px;margin-top:8px;padding:0;border:0;background:transparent;color:#276c7c;font:inherit;font-size:12px;font-weight:650;cursor:pointer}.how-link:hover{text-decoration:underline}.info-icon{display:inline-grid;place-items:center;width:17px;height:17px;border:1.5px solid currentColor;border-radius:50%;font-family:serif;font-size:12px;font-weight:700;font-style:normal;line-height:1}
.rank-toggle{display:grid;grid-template-columns:1fr 1fr;gap:5px;margin:13px 0 0;padding:0;border:0;min-width:0}.rank-toggle legend{padding:0;font-size:12px;font-weight:600}.rank-toggle label{position:relative;margin:6px 0 0;cursor:pointer}.rank-toggle input{position:absolute;opacity:0;width:1px;height:1px}.rank-toggle label span{display:flex;align-items:center;justify-content:center;min-height:36px;padding:6px;border:1px solid #c2d2d4;border-radius:7px;background:#fff;color:#36535c;text-align:center;font-size:11px;line-height:1.25}.rank-toggle input:checked+span{background:#e8f2f2;border-color:#418394;color:#1e5b6b;box-shadow:inset 0 0 0 1px #418394}.rank-toggle input:focus-visible+span{outline:3px solid #88c5d0;outline-offset:2px}
#howDialog{width:min(940px,calc(100vw - 24px));max-width:none;max-height:88dvh;overflow:auto;padding:0;border:1px solid #cbd9da;border-radius:18px;color:#213d47;background:#fbfdfc;box-shadow:0 16px 55px #122c3550}#howDialog::backdrop{background:#152a32a8;backdrop-filter:blur(2px)}.how-head{position:sticky;top:0;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;gap:16px;padding:22px 26px 15px;background:#fbfdfcf2;border-bottom:1px solid #dfe8e7;backdrop-filter:blur(8px)}.how-head h2{margin:5px 0;font-size:24px;line-height:1.2}.how-head p{margin:4px 0;color:#526d75;font-size:13px;line-height:1.5}.dialog-close{flex:0 0 auto;width:36px;height:36px;border:1px solid #cbd9da;border-radius:50%;background:white;color:#31505b;font-size:24px;line-height:1;cursor:pointer}.pipeline-map{margin:18px 22px 12px;padding:17px;border:1px solid #dae5e3;border-radius:15px;background:linear-gradient(145deg,#f5f9f7,#f2f6f8)}.assessment-node{display:grid;justify-items:center;text-align:center;margin:0 auto 14px;padding:10px 14px;width:max-content;max-width:100%;border:1px solid #bfd0d2;border-radius:12px;background:#fff;box-shadow:0 2px 8px #31505b0c}.assessment-node span,.step{font-size:9px;letter-spacing:.09em;font-weight:750;color:#55727a}.assessment-node strong{font-size:15px}.assessment-node small{font-size:10px;color:#718187}.branch-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px}.pipeline-card,.pipeline-node{min-width:0;padding:13px;border:1px solid #d2dfdf;border-radius:11px;background:#fff;box-shadow:0 2px 9px #31505b0b}.pipeline-card h3,.pipeline-node h3,.automation-grid h3{margin:5px 0;font-size:14px;line-height:1.3}.pipeline-card p,.pipeline-node p,.automation-grid p{margin:5px 0;font-size:11px;line-height:1.48;color:#4d656d}.pipeline-card small{font-size:9px;color:#6b7e83;line-height:1.4}.pipeline-card.landscape{border-top:3px solid #849a7c}.pipeline-card.calendar{border-top:3px solid #8e91b0}.pipeline-card.environment{border-top:3px solid #4b9a9c}.flow-arrow{text-align:center;height:29px;color:#63818a;font-size:23px;line-height:27px}.preparation{max-width:740px;margin:auto;border-color:#b9d0d1;background:#faffff}.preparation h3{font-size:14px}.flow-chain{display:grid;grid-template-columns:minmax(0,1fr) 26px minmax(0,1fr) 26px minmax(0,1fr);align-items:stretch;gap:5px}.chain-arrow{display:grid;place-items:center;color:#66828a;font-size:20px}.model-node{border-top:3px solid #68849c}.rank-node{border-top:3px solid #b88653}.publish-node{border-top:3px solid #54876a}.automation-grid{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:12px 22px}.automation-grid section{padding:12px 14px;border:1px solid #d9e3e2;border-radius:10px;background:#fff}.scope-note{margin:12px 22px 22px;padding:13px 15px;border-left:4px solid #c48b44;border-radius:6px;background:#fff6e8;color:#554a37;font-size:12px;line-height:1.55}.scope-note strong{color:#473b2b}
@media(max-width:650px){#howDialog{width:calc(100vw - 16px);max-height:92dvh;border-radius:14px}.how-head{padding:16px 17px 12px}.how-head h2{font-size:20px}.how-head p{font-size:12px}.pipeline-map{margin:12px 10px 9px;padding:10px}.branch-grid{grid-template-columns:1fr;gap:7px}.pipeline-card,.pipeline-node{padding:10px}.pipeline-card p,.pipeline-node p,.automation-grid p{font-size:10.5px}.flow-arrow{height:22px;line-height:21px;font-size:20px}.flow-chain{grid-template-columns:1fr;gap:4px}.chain-arrow{height:20px;font-size:0}.chain-arrow::before{content:"↓";font-size:19px}.automation-grid{grid-template-columns:1fr;gap:7px;margin:9px 10px}.scope-note{margin:9px 10px 13px;padding:11px;font-size:11px}.rank-toggle label span{min-height:40px;padding:5px;font-size:10.5px}}

.worldcover-native-canvas:focus-visible{outline:3px solid #236f82;outline-offset:3px}


/* Cell-first panel heading and compact, readable selected-cell details. */
.panel-heading{display:block}
.panel-heading .title-help{width:100%}
.panel-heading h1{margin:0 0 7px}
.panel-meta-row{display:flex;align-items:center;justify-content:space-between;gap:8px}
.panel-meta-row #date{flex:1;min-width:0}
.panel-meta-row #collapse{position:static;flex:0 0 auto;white-space:nowrap;padding:6px 8px;font-size:11px}
/* The top-percent slider includes lower ranks as the handle moves right. */
#top{-webkit-appearance:none;appearance:none;display:block;width:100%;height:12px;margin:14px 0 0;padding:0;border:1px solid #b7c6c9;border-radius:999px;background:linear-gradient(90deg,#d63b2d,#f6a25f,#f3edd8,#81b9cb,#326b9c);cursor:pointer}
#top::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border:2px solid #fff;border-radius:50%;background:#315c6b;box-shadow:0 0 0 1px #315c6b,0 2px 4px #152a324d;cursor:grab}
#top::-moz-range-thumb{width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:#315c6b;box-shadow:0 0 0 1px #315c6b,0 2px 4px #152a324d;cursor:grab}
#top:focus-visible{outline:3px solid #8bc1ca;outline-offset:4px}
.rank-scale-labels span:first-child{color:#a34330}
.rank-scale-labels span:last-child{color:#326b9c}
.leaflet-popup-content{margin:14px 16px;max-height:74dvh;line-height:1.42}
.leaflet-popup-content section{width:100%;min-width:0}
.cell-title{font-size:18px;margin:0 0 5px}
.cell-subtitle{display:flex;flex-wrap:wrap;gap:3px 12px;font-size:11px;color:#526a72;margin:0 0 7px}
.cell-subtitle b{color:#304e58}
.cell-rank{margin:6px 0 1px;color:#ad412c}
.cell-rank strong{font-size:19px}
.cell-rank small{display:block;margin-top:1px;font-size:11px;color:#586e76}
.condition-grid{gap:5px 8px;margin:7px 0 10px}
.condition-group-title{grid-column:1/-1;margin:4px 0 0;padding-top:4px;border-top:1px solid #dbe5e5;font-size:11px;color:#365862}
.condition-group-title:first-child{border-top:0;padding-top:0}
.condition-grid .condition-card{min-width:0;padding:6px}
.condition-card span{display:block;font-size:10px;color:#536970;line-height:1.3;overflow-wrap:anywhere}
.condition-card strong{font-size:13px}
.condition-card small{font-size:9px}
.score-explanation h3{margin:10px 0 2px;font-size:14px}
.score-intro{margin:2px 0 6px!important;font-size:10px;color:#61767c}
.score-directions{display:grid;grid-template-columns:1fr 1fr;gap:8px}
.factor-group{min-width:0;padding:7px;background:#f5f8f8;border-radius:5px}
.factor-group h4{margin:0 0 4px;font-size:10px;color:#405b64}
.factor-group ul,.score-input-list{margin:0;padding:0;list-style:none}
.factor-group li{display:flex;justify-content:space-between;align-items:flex-start;gap:5px;padding:3px 0;border-top:1px solid #e1e8e8;font-size:10px;line-height:1.3}
.factor-group li span{min-width:0;overflow-wrap:anywhere}
.factor-group li b{flex:0 0 auto;font-size:9px;white-space:nowrap}
.up{color:#9b4431}.down{color:#2d6c91}.neutral{color:#52676d}
.no-factors{margin:0!important;font-size:10px;color:#718087}
.score-explanation details{margin-top:7px;padding-top:6px;border-top:1px solid #dbe4e5}
.score-explanation details summary{font-size:11px}
.input-help,.score-note{font-size:9px;color:#677980;margin:4px 0!important}
.score-input-list{display:grid;grid-template-columns:1fr 1fr;gap:3px 8px}
.score-input-list li{min-width:0;padding:4px;border-radius:4px;background:#f5f8f8;display:grid;grid-template-columns:minmax(0,1fr) auto;gap:1px 4px}
.input-label{font-size:9px;line-height:1.25;overflow-wrap:anywhere}
.input-effect{font-size:8px;white-space:nowrap}
.input-value{grid-column:1/-1;font-size:8px;color:#526970;line-height:1.2;overflow-wrap:anywhere}
.worldcover-inset{margin:8px 0;padding:9px}
.worldcover-inset figcaption{font-size:11px;line-height:1.35}
.worldcover-summary,.worldcover-size,.worldcover-clip-note,.worldcover-value,.worldcover-note{font-size:9px;line-height:1.35;margin:4px 0}
.worldcover-summary{font-weight:650;color:#35545e}
.worldcover-size{font-variant-numeric:tabular-nums;color:#566c72}
.worldcover-native-canvas{width:min(100%,calc(240px * var(--cell-aspect,1)));margin:5px auto;max-height:260px}
.worldcover-clip-note{text-align:center;color:#52676e}
.worldcover-legend{margin-top:6px;font-size:10px}
.worldcover-key{display:grid;grid-template-columns:1fr;gap:4px;margin-top:5px}
.worldcover-key-item{gap:6px;font-size:9px}
.worldcover-swatch{flex:0 0 13px;width:13px;height:13px;border:1px solid #7d8982}
.worldcover-swatch.natural{background:#176847}
.worldcover-swatch.other{background:#c9cbc7}
.worldcover-swatch.unknown{background:repeating-linear-gradient(45deg,#eee9ef,#eee9ef 3px,#ad98b0 3px,#ad98b0 4px)}
@media(max-width:600px){
 .panel-heading h1{font-size:20px}
 .panel-meta-row #date{font-size:11px}
 .leaflet-popup-content{margin:12px;max-height:68dvh;max-width:calc(100vw - 48px)}
 .cell-rank strong{font-size:17px}
 .score-input-list{grid-template-columns:1fr}
 .worldcover-native-canvas{width:min(100%,calc(210px * var(--cell-aspect,1)));max-height:220px}
}

label[for=top] output,label[for=minveg] output{float:none;margin-left:.22em}

/* Selected-cell drawer leaves the main controls in place on wide screens. */
.cell-panel[hidden],.cell-panel-show[hidden]{display:none!important}
.cell-panel{position:fixed;z-index:900;right:16px;top:16px;bottom:16px;width:min(66vw,calc(100vw - 380px));min-width:0;display:flex;flex-direction:column;background:#fffffffa;border:1px solid #c9d9db;border-radius:14px;box-shadow:0 12px 40px #17343e38;overflow:hidden}
.cell-panel-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;flex:0 0 auto;padding:12px 17px;border-bottom:1px solid #dce6e6;color:#3d5c65;font-size:12px;font-weight:700;background:#f8fbfa}
.cell-panel-toolbar button,.cell-panel-show{padding:7px 12px;border:1px solid #a8c1c7;border-radius:7px;background:white;color:#245a69;font:inherit;font-size:12px;font-weight:650;cursor:pointer}
.cell-panel-toolbar button:hover,.cell-panel-show:hover{background:#eaf4f5}
.cell-panel-toolbar button:focus-visible,.cell-panel-show:focus-visible{outline:3px solid #88c5d0;outline-offset:2px}
.cell-panel-show{position:fixed;z-index:900;right:16px;top:104px;box-shadow:0 3px 14px #17343e2b}
.cell-panel{container-type:inline-size}
.cell-panel-body{flex:1;min-height:0;overflow:auto;padding:16px}
.cell-panel-grid{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);grid-template-areas:"identity analysis" "landcover analysis";gap:8px 16px;align-items:start}
.cell-overview,.cell-analysis{min-width:0}
.cell-overview{grid-area:identity}.cell-analysis{grid-area:analysis}.cell-landcover{grid-area:landcover;min-width:0}
.cell-panel p{margin:6px 0}
.cell-panel .cell-title{font-size:20px}
.cell-panel .cell-rank{margin:11px 0 12px}
.cell-panel .condition-grid{margin:0 0 13px}
.cell-panel .score-explanation h3{margin-top:14px}
.cell-panel .worldcover-native-canvas{width:min(100%,calc(360px * var(--cell-aspect,1)));max-height:360px;margin:0 auto;flex:0 1 auto}
.worldcover-dimensions{display:grid;grid-template-columns:27px minmax(0,1fr);gap:4px 6px;align-items:center;width:max-content;max-width:100%;margin:11px auto 4px}
.worldcover-width{grid-column:2;display:block;text-align:center;color:#48646d;font-size:10px;font-variant-numeric:tabular-nums;border-bottom:1px solid #92a8aa;padding:0 0 4px}
.worldcover-canvas-row{grid-column:1/-1;display:grid;grid-template-columns:27px minmax(0,1fr);gap:6px;align-items:center;min-width:0}
.worldcover-height{display:block;writing-mode:vertical-rl;transform:rotate(180deg);text-align:center;color:#48646d;font-size:10px;font-variant-numeric:tabular-nums;border-left:1px solid #92a8aa;padding-left:4px;justify-self:center}
.worldcover-canvas-row .worldcover-native-canvas{min-width:0}
@media(min-width:701px) and (max-width:1100px){.cell-panel{width:clamp(310px,52vw,calc(100vw - 380px))}}
@media(max-width:700px){.cell-panel{inset:auto 8px 8px;height:68dvh;width:auto;border-radius:11px}.cell-panel-body{padding:13px}.cell-panel-show{top:auto;bottom:85px;right:8px}}

/* Let the native-pixel image fill the available detail column. */
.cell-panel .worldcover-dimensions{width:min(100%,320px)}
.cell-panel .worldcover-canvas-row .worldcover-native-canvas{width:100%;max-height:none}
.cell-panel .worldcover-inset figcaption{font-size:12px}
.cell-panel .worldcover-summary{font-size:10.5px}
.cell-panel .worldcover-note,.cell-panel .worldcover-value{font-size:10px}
.cell-panel .cell-subtitle{font-size:12px}
.cell-panel .condition-card span{font-size:11px}
.cell-panel .condition-card strong{font-size:15px}
.cell-panel .factor-group li{font-size:11px}

/* A small source line applies to every card in its weather or vegetation group. */
.condition-grid .condition-source{grid-column:1/-1;margin:0 0 4px;color:#60767c;font-size:10px;line-height:1.35}
.condition-grid .condition-source a{color:#3d7180;text-decoration:underline;text-decoration-color:#a6c7ce;text-underline-offset:2px}
.condition-grid .condition-source a:hover{text-decoration-color:currentColor}

/* Vegetation filter scale: grey at the 10% study floor, green at 100%. */
#minveg{-webkit-appearance:none;appearance:none;display:block;width:100%;height:12px;margin:14px 0 2px;padding:0;border:1px solid #aebbb5;border-radius:999px;background:linear-gradient(90deg,#969e9f 0%,#cbd4cb 22%,#9cbea0 50%,#4c9a69 78%,#176847 100%);cursor:pointer}
#minveg::-webkit-slider-thumb{-webkit-appearance:none;appearance:none;width:22px;height:22px;border:2px solid #fff;border-radius:50%;background:#326f52;box-shadow:0 0 0 1px #326f52,0 2px 4px #152a324d;cursor:grab}
#minveg::-moz-range-thumb{width:18px;height:18px;border:2px solid #fff;border-radius:50%;background:#326f52;box-shadow:0 0 0 1px #326f52,0 2px 4px #152a324d;cursor:grab}
#minveg:focus-visible{outline:3px solid #8fc6a5;outline-offset:4px}

.veg-scale-labels{display:flex;justify-content:space-between;margin:3px 0 8px;font-size:10px}
.veg-scale-labels span:first-child{color:#737d7f}
.veg-scale-labels span:last-child{color:#176847}

.condition-grid .condition-missing-note{grid-column:1/-1;margin:2px 0 7px;color:#526a72;font-size:10px;line-height:1.45}

/* Gaps retain their exact corrected-grid disposition without implying a score. */
.coverage-toggle{display:flex;align-items:center;gap:8px;margin-top:12px;cursor:pointer}
.coverage-toggle input{width:16px;height:16px;margin:0;accent-color:#426f79}
.coverage-legend{display:grid;grid-template-columns:1fr;gap:4px;margin-top:7px;color:#60747a;font-size:10px;line-height:1.25}
.coverage-legend span{display:flex;align-items:center;gap:6px}
.coverage-legend [hidden]{display:none!important}
.coverage-legend small{font-size:9px;color:#708087}
.coverage-swatch{flex:0 0 14px;width:14px;height:14px;background:#e7eceb;border:1px solid #000}
.coverage-swatch.below-floor{background:#f0f1ee;border:1px dashed #727772}
.coverage-swatch.unresolved{background:#eee7ee;border:1px dashed #805685}
.cell-panel.status-open{width:min(430px,calc(100vw - 380px));min-width:300px}
.cell-status{max-width:55ch;font-size:13px;line-height:1.5}
.cell-status .cell-title{font-size:21px;margin:0 0 9px}
.cell-status .cell-subtitle{margin-bottom:16px}
.cell-status-note{margin-top:20px!important;padding:10px;background:#f0f4f4;border-radius:6px;color:#435f68}
.gap-inputs{margin:14px 0;padding:10px 12px;background:#f3f7f7;border-radius:7px}
.gap-inputs h3{font-size:13px;margin:0 0 6px}
.gap-inputs ul{margin:0 0 8px;padding-left:18px}
.gap-inputs li{margin:4px 0}
.gap-inputs p{font-size:11px;color:#526a72}
.worldcover-retry{margin-left:6px;padding:3px 7px;border:1px solid #a8c1c7;border-radius:5px;background:#fff;color:#245a69;cursor:pointer}
@media(max-width:700px){.cell-panel.status-open{inset:auto 8px 8px;width:auto;min-width:0}}

/* Consistent form typography, contrast and touch targets. */

/* Form controls did not inherit the panel font: the two selects rendered at
   the browser default 13.33px against 12px labels. */
select,button,input{font-family:inherit}
select{font-size:12px}

/* Contrast: all three measured below the 4.5:1 AA floor for normal text. */
.veg-scale-labels span:first-child{color:#5e696b}
.coverage-legend small{color:#59676d}
#model{color:#5b6e75}

/* Interaction feedback. The panel and cell drawer toggle the `hidden`
   attribute, which cannot be transitioned from CSS, so this covers the states
   that can move: hover, focus and selection. */
@media(prefers-reduced-motion:no-preference){
 #collapse,.how-link,.cell-panel-toolbar button,.cell-panel-show,.dialog-close,
 .worldcover-retry,summary,select{transition:background-color .15s ease,border-color .15s ease,color .15s ease}
 .rank-toggle label span{transition:background-color .15s ease,border-color .15s ease,box-shadow .15s ease,color .15s ease}
 #top::-webkit-slider-thumb,#minveg::-webkit-slider-thumb{transition:transform .12s ease,box-shadow .12s ease}
 #top:active::-webkit-slider-thumb,#minveg:active::-webkit-slider-thumb{transform:scale(1.12)}
}

/* Preserve a map corridor beside the drawer; its own width chooses columns. */
@media(min-width:1101px){.cell-panel{width:min(54vw,calc(100vw - 470px))}}

/* The 8-9px tier was tuned for the old narrow Leaflet popup. The drawer is
   several hundred px wide, so the detail text has room to be legible. */
.cell-panel .input-label{font-size:11px;line-height:1.35}
.cell-panel .input-effect{font-size:10px}
.cell-panel .input-value{font-size:10px;line-height:1.35}
.cell-panel .factor-group li b{font-size:10px}
.cell-panel .condition-card small{font-size:10px}
.cell-panel .input-help,.cell-panel .score-note{font-size:10.5px}
.cell-panel .no-factors{font-size:11px}
.cell-panel .score-intro{font-size:11px}
.cell-panel .worldcover-summary,.cell-panel .worldcover-size,
.cell-panel .worldcover-clip-note{font-size:10.5px}

@media(max-width:700px){
 /* Keep controls scrollable while leaving room to explore the map. */
 #panel{max-height:45dvh}
 #panel::after{content:'';display:block;position:sticky;bottom:-14px;height:26px;
  margin:-26px -14px -14px;border-radius:0 0 14px 14px;pointer-events:none;
  background:linear-gradient(rgba(255,255,255,0),rgba(255,255,255,.96))}

 /* Touch targets. Every one of these measured under 44px. */
 #collapse{min-height:44px;padding:8px 12px;font-size:12px}
 .how-link{min-height:44px;font-size:13px}
 select{min-height:44px;padding:10px 8px}
 summary{min-height:44px;display:flex;align-items:center}
 .coverage-toggle{min-height:44px}
 .coverage-toggle input{width:24px;height:24px}

 /* Keep the 12px gradient band but give the control a 44px hit area: the
    gradient is painted at its old height and centred, so the track looks the
    same while the draggable region more than triples. */
 #top,#minveg{height:44px;border:0;margin:6px 0 0;
  background-repeat:no-repeat;background-position:center;background-size:100% 12px}

 /* "Raised the score" / "Lowered the score" stayed two-up in a 374px drawer,
    wrapping every label to four lines. Only .score-input-list collapsed. */
 .score-directions{grid-template-columns:1fr;gap:6px}

 /* Smallest remaining panel text. */
 .coverage-legend small{font-size:10px}
 .rank-toggle label span{font-size:11.5px}
}

/* Use the drawer's real width, including split-screen and browser zoom. */
@container (max-width:650px){
 .cell-panel-grid{grid-template-columns:minmax(0,1fr);grid-template-areas:"identity" "analysis" "landcover"}
 .cell-landcover{border-top:1px solid #dce6e6;padding-top:8px}
 .cell-panel .worldcover-canvas-row .worldcover-native-canvas{width:min(100%,calc(220px * var(--cell-aspect,1)));max-height:220px}
 .cell-panel .worldcover-dimensions{width:max-content;max-width:100%}
}
@container (max-width:430px){
 .score-directions,.score-input-list{grid-template-columns:minmax(0,1fr)}
 .factor-group li{gap:10px}
}
@media(max-width:700px){
 #panel{left:8px;top:8px;width:min(330px,calc(100vw - 64px));max-height:45dvh;padding:14px}
 body.cell-open #panel{visibility:hidden}
 body.cell-open #mapNote{display:none}
 body.cell-open .leaflet-bottom{bottom:calc(68dvh + 16px)}
 .cell-panel-toolbar{padding:7px 13px}
 .cell-panel-toolbar button,.cell-panel-show,.worldcover-retry{min-height:44px}
 .dialog-close{width:44px;height:44px}
 .rank-toggle label span{min-height:44px}
}
.visually-hidden{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap;border:0}
#mapCursor{display:none;position:fixed;width:18px;height:18px;transform:translate(-50%,-50%);border:2px solid #163e50;border-radius:50%;box-shadow:0 0 0 2px white;pointer-events:none;z-index:700}
#map:focus-visible~#mapCursor{display:block}
.keyboard-hint{display:none}
#map:focus-visible~#mapNote .keyboard-hint{display:inline}
#map:focus-visible{outline:3px solid #236f82;outline-offset:-3px}

.filter-help{position:relative;display:flex;align-items:center;gap:6px;margin-top:13px}.filter-help label{flex:1;min-width:0;margin-top:0}.filter-help-button{flex:0 0 auto;display:inline-flex;align-items:center;justify-content:center;padding:0;border:0;background:none;color:#276c7c;cursor:help}.filter-help-button:focus-visible{outline:2px solid #397e90;outline-offset:3px;border-radius:50%}
/* The note now carries only the keyboard hint, so it appears with keyboard focus. */
#mapNote{display:none}#map:focus-visible~#mapNote{display:block}

.how-link[hidden]{display:none}

.feature-details{margin-top:10px}.feature-details summary{font-weight:600;font-size:11px}.feature-group{margin:10px 0 4px;font-weight:650;font-size:11px;color:#31505b}.feature-table{font-size:10px;table-layout:fixed;width:100%}.feature-table td{padding:4px 5px;vertical-align:top;word-break:break-word}.feature-table td:first-child{width:46%}.feature-table td:nth-child(2){width:16%;text-align:left}.feature-table td:last-child{width:38%;text-align:left;color:#55707a}.feature-column{font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:9px;color:#6b7f87;overflow-wrap:anywhere}.feature-note{font-size:10px;color:#62777d;margin:8px 0 2px}

.feature-source-link{color:#277787;text-decoration:underline;text-underline-offset:2px}.feature-source-link:hover{text-decoration-thickness:2px}

.model-facts{font-size:10.5px;line-height:1.5;color:#4b636b;margin:10px 0 0}

.condition-card.has-value{background:#e9f5ea}.condition-card.missing-value{background:#fbeaea}.delta.up{color:#b23b23;font-weight:600}.delta.down{color:#25639a;font-weight:600}.input-source{grid-column:1/-1;font-size:9px;line-height:1.25;color:#6b7f87;overflow-wrap:anywhere}.input-source a{color:#277787}

.weekly-run{margin:12px 22px 22px;padding:14px 16px;border:1px solid #d9e3e2;border-radius:12px;background:#fff}.weekly-run h3{margin:0 0 10px;font-size:14px;line-height:1.3}.weekly-steps{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin:0;padding:0;list-style:none;counter-reset:wk}.weekly-steps li{min-width:0;padding:10px;border:1px solid #dbe6e5;border-top:3px solid #4b9a9c;border-radius:9px;background:#f7fbfa;counter-increment:wk}.weekly-steps b{display:block;margin-bottom:4px;font-size:12px;line-height:1.3}.weekly-steps b::before{content:counter(wk) ". ";color:#55727a}.weekly-steps span{display:block;font-size:10.5px;line-height:1.45;color:#4d656d;overflow-wrap:anywhere}
@media(max-width:650px){.weekly-run{margin:9px 10px 13px;padding:11px}.weekly-steps{grid-template-columns:1fr;gap:6px}}
@media(min-width:651px) and (max-width:900px){.weekly-steps{grid-template-columns:repeat(2,minmax(0,1fr))}}

.fire-swatch{display:inline-block;flex:0 0 11px;width:11px;height:11px;margin-right:6px;vertical-align:-1px;background:#000;box-shadow:0 0 0 1px #fff,0 0 0 2px #000}.fire-toggle span{display:inline-flex;align-items:center}.fire-note{margin:2px 0 8px 22px;font-size:10px;color:#5d737a}.fire-line{display:flex;align-items:flex-start;gap:6px;margin:8px 0;font-size:11px;font-weight:600;color:#1b1b1b;line-height:1.4}.fire-line .fire-swatch{margin-top:2px}.fire-cells{pointer-events:none}.cell-overview .score-explanation{margin-top:14px}.cell-overview .score-directions{grid-template-columns:1fr}.factor-rows{margin:0;padding:0;list-style:none}.factor-group .factor-rows li{display:block;padding:5px 0;border-top:1px solid #e1e8e8}.factor-head{display:flex;justify-content:space-between;align-items:baseline;gap:8px;font-size:10.5px;line-height:1.3}.factor-name{min-width:0;overflow-wrap:anywhere}.factor-value{flex:0 0 auto;color:#526970;white-space:nowrap}.factor-bar{height:5px;margin-top:4px;border-radius:3px;background:#e6eded;overflow:hidden}.factor-bar i{display:block;height:100%;border-radius:3px}.factor-bar.up i{background:#c0432c}.factor-bar.down i{background:#2d6c91}
