/* v0.9.1 review: compact controls and complete, single-workspace explanations. */
.pacific-globe .globe-controls{display:grid!important;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:9px;align-items:end}
.pacific-globe .globe-controls button{align-self:end;min-height:40px;padding:8px 10px;margin:0;line-height:1.2;border:1px solid #b3d3dd;border-radius:10px;font-size:12px}
.pacific-globe .globe-controls label{max-width:none!important;width:100%;font-size:12px;line-height:1.35;margin:0;min-width:0}
.pacific-globe .globe-date{height:40px;padding:8px;min-width:0;font-size:12px;margin:5px 0 0}
.pacific-globe .globe-reset{grid-row:1;grid-column:1}.pacific-globe .globe-spin{grid-row:1;grid-column:2}
.pacific-globe .globe-controls label{grid-row:2;grid-column:1}.pacific-globe .globe-latest{grid-row:2;grid-column:2}
.pacific-globe .globe-view{position:relative}.pacific-globe .globe-content{align-items:start}.pacific-globe .globe-controls button:focus-visible{outline:2px solid #218b87;outline-offset:2px}
.pacific-meaning{margin:13px 0;padding:13px 14px;background:#e9f5f3;border:1px solid #c5e3de;border-radius:11px;border-left:3px solid #299386;font-size:13px;color:#204c61}
.pacific-meaning>strong{font-size:14px}.pacific-meaning p{font-size:12px;line-height:1.5;margin:6px 0!important;color:#365e6b!important}
.compact .pacific-meaning{padding:10px;font-size:11px}.compact .pacific-meaning>strong{font-size:12px}.compact .pacific-meaning p{font-size:11px}.compact .pacific-meaning .pacific-box{display:none}
.globe-status{font-size:11px!important}.globe-information>details{font-size:12px}
.display-loading{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;gap:10px;z-index:8;background:rgba(5,26,42,.56);color:white;font-size:14px;line-height:1.4;font-weight:700;border-radius:inherit;pointer-events:none;padding:12px;text-align:center}
.display-loading[hidden]{display:none!important}.display-spinner{width:21px;height:21px;border-radius:50%;border:3px solid #ffffff50;border-top-color:#bcffe4;animation:loading-spin .9s linear infinite;flex:0 0 auto}
@keyframes loading-spin{to{transform:rotate(360deg)}}
.earth-sky{position:absolute;inset:0;width:100%;height:100%;z-index:4;pointer-events:none}
.live-earth .country-in-toolbar{width:220px;max-width:100%;min-width:155px;margin:0 8px 0 0;align-self:center;font-size:10px;color:#345e71;display:block}
.live-earth .country-in-toolbar select{display:block;width:100%;font-size:12px;height:37px;padding:6px;margin:3px 0 0;background:#fff;border:1px solid #b9d3df;border-radius:8px;color:#204b62}
.live-earth .earth-layer-controls [data-layer=earth]{display:none!important}
.live-earth .earth-layer-controls .earth-control-separator{display:none}
.live-earth .earth-layer-controls .earth-night-toggle{margin-left:0}
.live-earth .earth-layer-controls{align-items:center!important}
.earth-country-card.country-actions-compact{padding:10px!important;margin:0 0 12px;background:#f4faf9;border:1px solid #d7e9e6;font-size:12px}
.country-actions-compact .earth-country-note{font-size:11px;margin:7px 0 0}.country-actions-compact .earth-country-actions{margin:0;gap:7px}
.earth-clear-layer{display:block;margin:0 0 10px;padding:6px 10px!important;font-size:11px!important;min-height:30px}
.celestial-note{font-size:11px;color:#52707d;line-height:1.5;margin-top:10px}
.historical-workspace{display:grid;grid-template-columns:minmax(0,1fr) minmax(300px,360px);gap:18px;align-items:start}
.historical-map-column{position:sticky;top:calc(var(--sticky-header-height,90px) + 14px);min-width:0;min-height:220px;border-radius:13px}
.historical-map-column .grid-status{margin:0 0 9px;font-size:12px;line-height:1.4;min-height:18px}.historical-map-column .grid-tooltip{font-size:12px;padding:9px 0;margin:0;line-height:1.5}
.historical-map-column .display-loading{inset:26px 0 25px;min-height:200px}
.historical-controls-panel{position:relative;min-width:0;max-height:clamp(520px,74vh,780px);overflow:auto;overscroll-behavior:contain;scrollbar-gutter:stable;border:1px solid #cee1e8;border-radius:12px;background:#fff;padding:15px;color:#214c61}
.historical-controls-panel .analysis-controls{grid-template-columns:minmax(0,1fr);gap:10px;margin:12px 0;display:grid}
.historical-controls-panel :is(label,summary){font-size:12px;line-height:1.4}.historical-controls-panel select{width:100%;min-width:0;padding:9px 7px;font-size:12px;color:#1c445b}
.historical-controls-panel .grid-freshness{font-size:10px;padding:8px;margin:9px 0}.historical-controls-panel .grid-explainer{padding:12px;font-size:12px;margin-top:12px}.historical-controls-panel .grid-explainer p{font-size:12px;line-height:1.5}
.historical-controls-panel .grid-legend{grid-template-columns:1fr!important;font-size:11px;padding:11px!important}.historical-controls-panel .legend-note{font-size:10px}
.historical-controls-panel .method-details{font-size:11px;line-height:1.5}.historical-search{display:block;font-weight:750;color:#27566b}
.historical-country-search{display:block;width:100%;margin:5px 0 0;padding:10px 8px;font-size:13px;background:#f7fbfd;border:1px solid #b9d4df;border-radius:8px}
.historical-search-results{padding:5px 0;max-height:210px;overflow:auto;background:white;border:1px solid #c2dbe3;border-radius:8px}
.historical-search-results button{display:block;width:100%;text-align:left;background:white;color:#224e66;border:0;padding:9px;font-size:12px;cursor:pointer}
.historical-search-results button:hover,.historical-search-results button[aria-selected=true]{background:#d9f4ed}.historical-search-results p{font-size:12px;padding:8px}
.lesson-player{margin:8px 0;padding:14px!important;border:1px solid #badbe1;border-radius:14px;background:#f4fafc}
.lesson-stage{display:grid;grid-template-columns:minmax(0,1.65fr) minmax(240px,1fr);align-items:center;gap:18px;min-width:0;margin:10px 0}
.lesson-picture{min-width:0}.lesson-player .enso-schematic{display:block;width:100%;height:auto;max-height:290px;margin:0}
.lesson-caption{border-left:3px solid #50aea1;background:#e7f4f1;border-radius:9px;padding:18px;min-width:0}
.lesson-counter{color:#227e7a;font-size:11px;font-weight:800;letter-spacing:.1em}.lesson-player .lesson-step-title{font-size:21px;color:#173f56;margin:8px 0 12px;line-height:1.25}
.lesson-player .teaching-explanation{font-size:14px!important;line-height:1.65;margin:0!important;color:#2b5364!important}
.lesson-player .teaching-controls{display:flex;flex-wrap:wrap;align-items:center;gap:7px;border-top:1px solid #cde1e7;padding-top:12px}
.lesson-player .teaching-controls button{padding:8px 10px;min-height:37px;font-size:12px}.lesson-player .lesson-audio{display:flex;align-items:center;gap:6px;margin:0 0 0 auto;font-size:12px;color:#27566b}
.lesson-audio input{width:16px;height:16px;margin:0;accent-color:#16887e}.lesson-audio-state{display:block;font-size:11px;color:#507381;line-height:1.4;margin-top:9px}
.lesson-player>.small-note{font-size:10px;line-height:1.4;margin:8px 0 0}.learning-extra{font-size:13px;color:inherit;margin:12px 0}.learning-extra summary{cursor:pointer;font-weight:700;color:inherit}.learning-extra p{font-size:14px!important;line-height:1.6}
.enso-learning{scroll-margin-top:calc(var(--sticky-header-height,90px) + 10px)}
.lesson-dialog{width:min(1220px,96vw);max-width:96vw;max-height:95vh;padding:14px;border:1px solid #b3d9df;border-radius:16px;background:#eff7fa;overflow:auto}.lesson-dialog::backdrop{background:#052231de}.lesson-close{display:block;margin:0 0 10px auto;padding:7px 12px;font-size:12px}.lesson-dialog .lesson-focus{display:none}.lesson-dialog .enso-schematic{max-height:min(400px,45vh)}
@media(min-width:1500px){.historical-workspace{grid-template-columns:minmax(0,1fr) 395px}}
@media(max-width:1000px){.lesson-stage{grid-template-columns:1.35fr minmax(205px,1fr);gap:12px}.lesson-caption{padding:13px}.lesson-player .lesson-step-title{font-size:18px}.lesson-player .teaching-explanation{font-size:13px!important}}
@media(max-width:760px){.live-earth .country-in-toolbar{grid-column:1/-1;width:100%;margin:0}.live-earth .earth-layer-controls .earth-night-toggle{grid-column:auto}.historical-workspace{grid-template-columns:minmax(0,1fr)}.historical-map-column{position:relative;top:0}.historical-controls-panel{max-height:none;overflow:visible;scrollbar-gutter:auto}.historical-controls-panel .analysis-controls{grid-template-columns:repeat(2,minmax(0,1fr))}.lesson-stage{grid-template-columns:1fr}.lesson-player .enso-schematic{max-height:210px}.lesson-caption{padding:11px}.lesson-player .lesson-step-title{font-size:17px;margin:5px 0 8px}.lesson-player .teaching-explanation{font-size:13px!important}.lesson-player .teaching-controls button{flex:0 1 auto}.lesson-player .lesson-audio{margin-left:0}.lesson-dialog{max-height:96vh;padding:10px}.lesson-dialog .enso-schematic{max-height:210px}.lesson-player{padding:10px!important}}
@media(prefers-reduced-motion:reduce){.display-spinner{animation:none!important;border-style:dotted}}

#enso-learning{scroll-margin-top:calc(var(--sticky-header-height,90px) + 12px);padding:20px!important}
#enso-learning>h2{font-size:clamp(22px,2.4vw,30px);line-height:1.25;margin:10px 0 15px}
#enso-learning .learning-tabs{margin:10px 0 14px}
.carbon-coverage{font-size:11px;line-height:1.5;padding:9px 10px;border:1px solid #cfdfec;border-radius:8px;background:#f3f8fc;color:#345f70}

/* Narrow-screen regression: native selects must not size the page from their
   longest option (notably in WebKit). Keep controls in the grid, not clipped. */
.historical-workspace > *,
.historical-controls-panel .analysis-controls > *,
.live-earth .earth-layer-controls > *,
.pacific-globe .globe-controls > *{min-width:0}
.historical-controls-panel :is(select,input),
.live-earth .country-in-toolbar select,
.earth-details-panel :is(select,input),
.pacific-globe .globe-date{min-width:0;max-width:100%;box-sizing:border-box}
.historical-controls-panel,
.earth-details-panel,
.globe-information{overflow-wrap:anywhere}
@media(max-width:760px){
 .earth-workspace{grid-template-columns:minmax(0,1fr)}
 .live-earth .country-in-toolbar{min-width:0}
 .historical-controls-panel .analysis-controls label{min-width:0}
 .globe-content{grid-template-columns:minmax(0,1fr)}
 .globe-view,.globe-information{min-width:0;max-width:100%}
}
@media(max-width:480px){
 /* Full rows keep the complete comparison option readable on a phone. */
 .historical-controls-panel .analysis-controls{grid-template-columns:minmax(0,1fr)}
}
