/* Classroom refinement: source-map colors, compact header, flexible SVG comparison. */
.app{grid-template-rows:70px minmax(0,1fr) 106px;gap:10px;padding-top:0}
.topbar{min-height:0;padding-top:0;padding-bottom:0}
.brand{gap:9px}
.brand h1{font-size:clamp(22px,1.99vw,38px);line-height:1.08;letter-spacing:2px}
.brand-mark,.brand-mark .lab-icon{width:49px;height:44px}
.utilities button{min-height:44px;padding:7px 14px}

/* A 图上的选中色块显示原像素色，不对亚热带等填色额外增饱和。 */
.map-stage #highlight:not(.wind-highlight){filter:none;opacity:1}
.map-stage.selected>#mapImage{filter:grayscale(.94) brightness(.78)}

body[data-lab-mode=monsoon] .controls .intro{font-size:14px;line-height:1.48;margin-bottom:10px;padding:10px 8px 10px 39px}
body[data-lab-mode=monsoon] .controls .choice{min-height:52px;padding:8px 10px;font-size:18px}
body[data-lab-mode=monsoon] .controls .stack{gap:8px}
body[data-lab-mode=monsoon] .controls .subhead{margin:13px 0 8px}
body[data-lab-mode=monsoon] .controls .note{margin-top:11px;padding:9px;font-size:12px;line-height:1.5}
body[data-lab-mode=monsoon] .feedback{display:flex;flex-direction:column;overflow:hidden}
body[data-lab-mode=monsoon] .feedback .section-heading{flex:none;margin-bottom:9px;min-height:56px;padding:8px}
body[data-lab-mode=monsoon] #feedback{display:flex;flex-direction:column;min-height:0;gap:8px;overflow:auto;scrollbar-width:thin}
body[data-lab-mode=monsoon] .wind-card{flex:none;padding:10px 13px;margin:0;border-radius:15px}
body[data-lab-mode=monsoon] .wind-card h3{font-size:21px;line-height:1.2;margin-bottom:6px}
body[data-lab-mode=monsoon] .wind-card h3 .lab-icon{width:24px;height:24px}
body[data-lab-mode=monsoon] .facts{font-size:15px;gap:4px 8px;line-height:1.25;grid-template-columns:52px 1fr}
body[data-lab-mode=monsoon] .facts dt,body[data-lab-mode=monsoon] .facts dd{padding:2px 4px}
body[data-lab-mode=monsoon] .task{flex:none;margin:0;padding:10px 12px}
body[data-lab-mode=monsoon] .task h3{font-size:19px;margin-bottom:5px}
body[data-lab-mode=monsoon] .task p{font-size:15px;line-height:1.35;margin-bottom:7px}
body[data-lab-mode=monsoon] .task button{min-height:40px;padding:5px}

.workspace.climate-layout.compare-expanded{grid-template-columns:minmax(0,1fr) minmax(0,1.02fr);gap:12px}
.workspace.compare-expanded>.controls{display:none}
.workspace.compare-expanded>.map-panel{grid-column:1}
.workspace.compare-expanded>.feedback{grid-column:2}
.map-city:before{border-color:#17262d}
.map-city .city-tooltip{padding:0;color:#171b1d;font-family:'SimSun','宋体',serif;font-size:14px;font-weight:400;background:transparent;border:0;box-shadow:none;text-shadow:none}
.map-city.added-marker .city-tooltip{display:block;bottom:calc(50% + 10px);left:50%;transform:translateX(-50%)}
.map-city[data-label-position="east"] .city-tooltip{left:calc(50% + 10px);right:auto;top:50%;bottom:auto;transform:translateY(-50%)}
.map-city[data-label-position="west"] .city-tooltip{left:auto;right:calc(50% + 10px);top:50%;bottom:auto;transform:translateY(-50%)}

.climate-feedback .section-heading{flex:none;min-height:54px;padding:7px 10px;margin-bottom:7px}
.climate-feedback .section-heading h2{font-size:23px}
.climate-feedback .compare-toolbar{font-size:14px;font-weight:700;margin-bottom:7px;gap:6px}
.climate-feedback .compare-toolbar button{flex:none}
.climate-feedback .charts{gap:7px;grid-template-rows:repeat(2,minmax(0,1fr))}
.climate-feedback .charts:has(.chart-card:only-child){grid-template-rows:minmax(0,1fr)}
.climate-feedback .charts.two{grid-template-columns:1fr;grid-template-rows:repeat(2,minmax(0,1fr));justify-items:center}
.climate-feedback .charts.two .chart-card{width:min(100%,670px,calc((100dvh - 390px)*1.2));height:100%}
.climate-feedback:has(.charts.two){padding:10px}
.climate-feedback:has(.charts.two) .section-heading{height:50px;min-height:50px;padding:4px 9px;margin-bottom:5px}
.climate-feedback:has(.charts.two) .section-heading h2{font-size:21px}
.climate-feedback:has(.charts.two) .section-heading .lab-icon{width:30px;height:32px}
.climate-feedback:has(.charts.two) .compare-toolbar{position:absolute;z-index:4;top:15px;right:12px;width:auto;height:42px;margin:0;gap:9px;font-size:13px}
.climate-feedback:has(.charts.two) .compare-toolbar button{min-height:36px;padding:5px 10px}
.climate-feedback:has(.charts.two) .chart-heading{min-height:28px}
.climate-feedback:has(.charts.two) .remove-city{min-height:26px;width:26px;height:26px}
.climate-feedback:has(.charts.two) .climate-reveal>.primary{min-height:40px;padding:5px}
.climate-feedback .charts.multi{grid-template-columns:repeat(2,minmax(0,1fr));grid-template-rows:repeat(2,minmax(0,1fr))}
.climate-feedback .chart-card{display:flex;flex-direction:column;min-height:0;overflow:hidden;border-radius:12px}
.climate-feedback .chart-heading{flex:none;min-height:32px;padding:2px 7px!important;align-items:center}
.climate-feedback .chart-heading h3,.climate-feedback .charts.multi .chart-heading h3{font-size:15px;line-height:1.2}
.climate-feedback .remove-city,.climate-feedback .charts.multi .remove-city{min-height:30px;width:30px;height:30px;font-size:19px}
.vector-chart{flex:1;min-height:0;background:#fffefa;padding:2px 3px 4px}
.climate-svg{display:block;width:100%;height:100%;font-family:'Microsoft YaHei',sans-serif;background:#fffefa}
.climate-svg .axis-title{font-size:14px;font-weight:800;fill:#18293d}
.climate-svg .axis-label{font-size:12px;font-weight:650;fill:#273e50}
.charts.multi .climate-svg .axis-label{font-size:18px}
.charts.multi .climate-svg .axis-title{font-size:18px}
.climate-svg .climate-grid{stroke:#a8b6c1;stroke-width:.8}
.climate-svg .chart-axis{stroke:#30465a;stroke-width:1.6}
.climate-svg .rain-bar{fill:#16c4b0;stroke:#009b9b;stroke-width:.8}
.climate-svg .temp-line{fill:none;stroke:#ed3a2d;stroke-width:3.5;stroke-linecap:round;stroke-linejoin:round}
.climate-svg .temp-point{fill:#ee392b;stroke:#fff;stroke-width:1.2}
.climate-reveal{flex:none;margin-top:8px}
.climate-reveal>.primary{min-height:48px;font-size:18px}
.comparison-answer{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;margin-top:7px;max-height:145px;overflow:auto}
.comparison-answer .answer{margin:0!important;padding:7px 9px;font-size:14px;line-height:1.25;background:#005c7de8;border:1px solid #86e9ff;border-left:4px solid #ffe178}
.comparison-answer strong{display:block;font-size:13px;color:#ffec9a;margin-bottom:2px}
.comparison-answer p{font-size:17px!important;line-height:1.27!important;font-weight:900;color:#fff}
.climate-feedback .legend-list{margin-top:6px}
.climate-feedback .empty-state{min-height:0}

@media(min-width:1800px){.app{grid-template-rows:72px minmax(0,1fr) 108px;gap:11px}.brand h1{font-size:38px}.brand-mark,.brand-mark .lab-icon{width:49px;height:44px}body[data-lab-mode=monsoon] .wind-card{padding:11px 14px}body[data-lab-mode=monsoon] .facts{font-size:16px}body[data-lab-mode=monsoon] .wind-card h3{font-size:22px}.workspace.climate-layout.compare-expanded{grid-template-columns:minmax(0,1fr) minmax(850px,49vw)}}
@media(max-width:1500px){.workspace.climate-layout.compare-expanded{grid-template-columns:minmax(0,1fr) minmax(610px,51vw)}.brand h1{font-size:clamp(22px,2.2vw,33px)}.brand-mark,.brand-mark .lab-icon{width:43px;height:40px}body[data-lab-mode=monsoon] .wind-card h3{font-size:19px}body[data-lab-mode=monsoon] .facts{font-size:14px}}
@media(max-width:1500px){.climate-feedback:has(.charts.two) .compare-toolbar{font-size:12px;gap:5px}.climate-feedback:has(.charts.two) .compare-toolbar button{font-size:12px;padding:4px 7px}.climate-feedback:has(.charts.two) .section-heading h2{font-size:18px}}
@media(max-height:800px) and (min-width:981px){.app{grid-template-rows:61px minmax(0,1fr) 84px;gap:8px}.brand h1{font-size:27px}.brand-mark,.brand-mark .lab-icon{width:39px;height:36px}body[data-lab-mode=monsoon] .feedback .section-heading{min-height:46px}body[data-lab-mode=monsoon] .wind-card{padding:7px 10px}body[data-lab-mode=monsoon] .wind-card h3{font-size:17px}body[data-lab-mode=monsoon] .facts{font-size:12px;gap:2px 6px}body[data-lab-mode=monsoon] .task h3{font-size:16px}body[data-lab-mode=monsoon] .task p{font-size:13px}.climate-feedback .section-heading{min-height:46px}.climate-feedback .section-heading h2{font-size:19px}.climate-reveal>.primary{min-height:40px}.comparison-answer{max-height:105px}.comparison-answer p{font-size:13px!important}}
@media(max-width:980px){.app{grid-template-rows:none}.workspace.climate-layout.compare-expanded{grid-template-columns:1fr;grid-template-rows:560px auto}.workspace.compare-expanded>.map-panel,.workspace.compare-expanded>.feedback{grid-column:1}.workspace.compare-expanded>.controls{display:none}.climate-feedback .charts{grid-template-rows:none}.climate-feedback .charts.two{grid-template-rows:repeat(2,auto)}.climate-feedback .charts.two .chart-card{width:min(100%,670px);height:auto}.climate-feedback .chart-card{min-height:280px}.vector-chart{min-height:230px}}