/* 41 · 乌龟冬眠指南 —— 视觉母题「温度分层曲线 / 水位带」
   独立布局：左侧四层温度带 SVG + 输入曲线；右侧物种体况表单；结果用横向档位条 + 准备清单。 */
.b29.th-wrap {
    --b29-bg: #f0f7f8;
    --b29-surface: #fcffff;
    --b29-surface-2: #eaf4f6;
    --b29-ink: #1e2c31;
    --b29-sub: #4e6268;
    --b29-muted: #85999f;
    --b29-line: #dcebec;
    --b29-line-strong: #c0d8dc;
    --b29-accent: #277591;
    --b29-accent-2: #b8793c;
    --b29-tint: #e2f1f5;
    --b29-radius: 18px;
    --b29-radius-sm: 10px;
}
:root[data-theme="dark"] .b29.th-wrap {
    --b29-bg: #0e161a;
    --b29-surface: #18252b;
    --b29-surface-2: #1e3037;
    --b29-ink: #e8f2f5;
    --b29-sub: #b2c8ce;
    --b29-muted: #86a0a7;
    --b29-line: #2a4048;
    --b29-line-strong: #38555f;
    --b29-accent: #7fc4de;
    --b29-accent-2: #e0ad74;
    --b29-tint: #1c3943;
}
.th-hero h1 em { font-style: normal; color: var(--b29-accent-2); display: block; font-size: .57em; margin-top: 10px; }
.th-console { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, .95fr); gap: 0;
    border: 1px solid var(--b29-line); border-radius: var(--b29-radius); overflow: hidden; box-shadow: var(--b29-shadow); }
.th-chart { padding: 26px; background: var(--b29-surface-2); }
.th-tag { font-family: var(--b29-mono); font-size: 11.5px; letter-spacing: .16em; color: var(--b29-accent); margin-bottom: 11px; }
.th-chart h2 { font-size: var(--b29-xl); margin-bottom: 12px; }
.th-curve { width: 100%; height: auto; display: block; background: var(--b29-surface); border: 1px solid var(--b29-line); border-radius: var(--b29-radius-sm); }
.th-band--active { fill: #d9eef0; }
.th-band--ref { fill: #cfe7e2; }
.th-band--cold { fill: #f2e6ce; }
.th-band--risk { fill: #f6dddd; }
:root[data-theme="dark"] .th-band--active { fill: #1d3b42; }
:root[data-theme="dark"] .th-band--ref { fill: #1d3a36; }
:root[data-theme="dark"] .th-band--cold { fill: #3a3220; }
:root[data-theme="dark"] .th-band--risk { fill: #3d2527; }
.th-band-label { font-size: 11px; fill: var(--b29-ink); text-anchor: middle; font-family: var(--b29-font); font-weight: 700; }
.th-axis { font-size: 10.5px; fill: var(--b29-muted); font-family: var(--b29-mono); }
.th-axis-line { stroke: var(--b29-muted); stroke-width: 1.5; }
.th-line { fill: none; stroke: var(--b29-accent-2); stroke-width: 3; stroke-linejoin: round; stroke-linecap: round; }
.th-dot { fill: var(--b29-surface); stroke: var(--b29-accent-2); stroke-width: 3; }
.th-foot { font-size: 10.5px; fill: var(--b29-muted); font-family: var(--b29-font); }
.th-legend { margin-top: 10px; font-size: var(--b29-xs); color: var(--b29-muted); display: flex; align-items: center; gap: 8px; }
.th-legend-i { width: 18px; height: 3px; border-radius: 2px; background: var(--b29-accent-2); }
.th-side { padding: 24px; background: var(--b29-surface); border-left: 1px solid var(--b29-line); display: flex; flex-direction: column; gap: 12px; }
.th-side-title { font-size: var(--b29-sm); font-weight: 800; letter-spacing: .1em; color: var(--b29-accent); }

.th-verdict { padding: 20px 22px; border-radius: var(--b29-radius); background: var(--b29-tint);
    border-left: 5px solid var(--b29-accent); font-size: var(--b29-sm); line-height: 1.85; margin-bottom: 20px; }
.th-verdict--warn { background: var(--b29-warn-tint); border-left-color: var(--b29-warn); }
.th-verdict--danger { background: var(--b29-danger-tint); border-left-color: var(--b29-danger); }
.th-verdict-title { display: block; font-size: var(--b29-lg); font-weight: 800; margin-bottom: 7px; color: var(--b29-ink); }
.th-verdict b { color: var(--b29-accent); }
.th-checklist { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 12px; }
.th-check { padding: 16px 17px; border-radius: var(--b29-radius-sm); background: var(--b29-surface); border: 1px solid var(--b29-line); }
.th-check > span { display: inline-block; font-size: var(--b29-xs); font-weight: 800; color: var(--b29-accent);
    background: var(--b29-tint); padding: 2px 9px; border-radius: 999px; margin-bottom: 9px; }
.th-check b { display: block; font-size: var(--b29-sm); margin-bottom: 4px; }
.th-check small { display: block; font-size: var(--b29-xs); color: var(--b29-muted); line-height: 1.75; }

@media (max-width: 900px) {
    .th-console { grid-template-columns: minmax(0, 1fr); }
    .th-side { border-left: 0; border-top: 1px solid var(--b29-line); }
    .th-checklist { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 560px) {
    .th-chart, .th-side { padding: 18px 16px; }
    .th-checklist { grid-template-columns: minmax(0, 1fr); }
}
