.harvest-lesson{
    --bg:#f7f6fb; --panel:#ffffff; --grid:#efeaf4; --line:#d9d4e3; --text:#1f1d2b; --muted:#6b6778;
    --amber:#b45309; --amber-bg:#fdf1e4; --amber-line:#e9b27a;
    --purple:#534ab7; --purple-bg:#eeedfe; --purple-line:#afa9ec;
    --gray-bg:#f4f3f0; --gray-line:#c9c7bf; --gray-text:#5f5e5a;
    --mono:ui-monospace,"SF Mono",Menlo,Consolas,monospace;
    --serif:Georgia,"Times New Roman",serif;
    --sans:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  }
  *{box-sizing:border-box}
  .harvest-lesson{background:var(--bg);color:var(--text);font-family:Arial,sans-serif;line-height:1.6}
  .harvest-lesson .lesson-content{padding:32px 0 0}

  .lead{color:var(--muted);margin:0 0 24px;max-width:760px}

  .tabs{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:16px;margin-bottom:20px}
  .tab{background:var(--panel);border:1px solid var(--line);border-radius:14px;padding:16px 20px;cursor:pointer;text-align:left;font:inherit;color:inherit;transition:border-color .2s,background .2s}
  .tab .k{font-family:var(--mono);font-size:11px;letter-spacing:.18em;text-transform:uppercase;color:var(--muted)}
  .tab h2{font-family:var(--serif);font-size:24px;margin:2px 0 2px;font-weight:600}
  .tab p{margin:0;color:var(--muted);font-size:15px}
  .tab.active{border-color:var(--amber);background:var(--amber-bg)}
  .tab.active .k{color:var(--amber)}
  .tab[data-c="mcp"].active{border-color:var(--purple);background:var(--purple-bg)}
  .tab[data-c="mcp"].active .k{color:var(--purple)}

  .stage{background:var(--panel);border:1px solid var(--line);border-radius:16px;overflow:hidden}
  .canvas{background-color:var(--panel);background-image:linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size:28px 28px;padding:24px}
  .canvas svg{width:100%;height:auto;display:block;max-width:900px;margin:0 auto}
  .bar{display:flex;align-items:center;gap:10px;flex-wrap:wrap;padding:14px 20px;border-top:1px solid var(--line)}
  button.b{font:inherit;font-weight:600;font-size:15px;padding:10px 18px;border-radius:999px;border:1px solid var(--line);background:var(--panel);color:var(--text);cursor:pointer}
  button.b:hover{border-color:#b9b3c7}
  button.b:disabled{opacity:.45;cursor:default}
  button.b.primary{background:var(--amber);border-color:var(--amber);color:#fff}
  .stage[data-c="mcp"] button.b.primary{background:var(--purple);border-color:var(--purple)}
  .dots{display:flex;gap:10px;margin-left:6px}
  .dots button{width:12px;height:12px;border-radius:50%;border:1.5px solid var(--line);display:block;cursor:pointer}
  .dots button.on{background:var(--amber);border-color:var(--amber)}
  .stage[data-c="mcp"] .dots button.on{background:var(--purple);border-color:var(--purple)}
  .status{margin-left:auto;font-family:var(--mono);font-size:13px;color:var(--muted)}
  .cap{padding:18px 24px 6px;font-size:17px;min-height:48px}
  .cap b{font-weight:600}
  .notes{padding:6px 24px 22px;color:var(--muted);font-size:15px;max-width:820px}
  .notes code{font-family:var(--mono);font-size:13px;background:var(--gray-bg);padding:1px 6px;border-radius:5px;color:var(--text)}
  .hidden{display:none}

  /* SVG */
  .harvest-lesson text{font-family:var(--sans)}
  .ttl{font-size:17px;font-weight:600;fill:var(--text)}
  .sub{font-size:13px;font-family:var(--mono);fill:var(--gray-text)}
  .row{font-size:14px;fill:var(--text)}
  .harvest-lesson .pill text{font-family:var(--mono);font-size:12.5px;font-weight:600}
  .box rect{fill:var(--gray-bg);stroke:var(--gray-line);stroke-width:1.2;transition:fill .35s,stroke .35s}
  .box.amber rect{fill:var(--amber-bg);stroke:var(--amber-line)}
  .box.purple rect{fill:var(--purple-bg);stroke:var(--purple-line)}
  .box.amber .ttl{fill:var(--amber)} .box.purple .ttl{fill:var(--purple)}
  .ln{stroke:var(--gray-line);stroke-width:1.5;stroke-dasharray:6 6;fill:none;transition:stroke .35s,opacity .35s}
  .ln.hot{stroke:var(--amber);stroke-width:2.2;stroke-dasharray:none}
  .ln.hot.purple{stroke:var(--purple)}
  .pill rect{stroke-width:1.2;transition:opacity .35s}
  .pill.amber rect{fill:#fff;stroke:var(--amber)} .harvest-lesson .pill.amber text{fill:var(--amber)}
  .pill.gray rect{fill:#fff;stroke:var(--gray-line)} .harvest-lesson .pill.gray text{fill:var(--gray-text)}
  .pill.purple rect{fill:#fff;stroke:var(--purple)} .harvest-lesson .pill.purple text{fill:var(--purple)}
  .pill.red rect{fill:#fdeaea;stroke:#c0392b} .harvest-lesson .pill.red text{fill:#a32d2d}
  .pill.green rect{fill:#eaf3de;stroke:#639922} .harvest-lesson .pill.green text{fill:#3b6d11}
  .ln.red{stroke:#c0392b;stroke-width:2.2;stroke-dasharray:3 5}
  .ln.warn{stroke:#ba7517;stroke-width:2.2;stroke-dasharray:8 5}
  .pill.warn rect{fill:#faeeda;stroke:#ba7517} .harvest-lesson .pill.warn text{fill:#854f0b}
  .v-cond{background:#faeeda;color:#854f0b}
  .tab[data-c="sn"].active{border-color:#639922;background:#eaf3de}
  .tab[data-c="sn"].active .k{color:#3b6d11}
  .stage[data-c="sn"] button.b.primary{background:#3b6d11;border-color:#3b6d11}
  .stage[data-c="sn"] .dots button.on{background:#3b6d11;border-color:#3b6d11}
  .verdict{display:grid;grid-template-columns:1fr auto auto;gap:6px 14px;margin-top:10px;font-size:14px}
  .verdict span{font-family:var(--mono);font-size:12.5px;font-weight:600;padding:2px 8px;border-radius:999px;text-align:center}
  .v-si{background:#eaf3de;color:#3b6d11} .v-no{background:#fdeaea;color:#a32d2d} .v-h{color:var(--muted);font-weight:600;background:none}
  .pill.hid{opacity:0}
  .pill{transition:opacity .35s}
  .lbl{font-family:var(--mono);font-size:12.5px;fill:var(--gray-text);font-weight:600}
  .lbl.hot{fill:var(--amber)}
  .dot{opacity:0;transition:opacity .2s}
  .dot.on{opacity:1}
  .layer{transition:opacity .5s}
  .layer.off{opacity:.12}
  .legend{font-size:13px;fill:var(--gray-text)}

.harvest-lesson{--bg:#fbf9fd;--text:#2d2638;--muted:#655b73;--line:#ded6e8;--grid:#f1ecf7;--purple:#6e4693;--purple-bg:#f1ecf7;--purple-line:#c7b3da;background:var(--bg)}
.harvest-lesson .lead{font-size:18px}
.harvest-lesson .canvas{overflow-x:auto}.harvest-lesson .canvas svg{min-width:650px}.harvest-lesson .dots button{padding:0;min-width:16px;height:16px;background:transparent}.harvest-lesson .dots button.on{background:var(--amber)}
.harvest-lesson button:focus-visible{outline:3px solid var(--purple);outline-offset:4px}
@media(max-width:600px){.harvest-lesson .lesson-content{padding-top:24px}.harvest-lesson .canvas{padding:12px}.harvest-lesson .bar{gap:12px;padding:14px}.harvest-lesson .status{width:100%;margin-left:0}.harvest-lesson .tabs{grid-template-columns:1fr}}
@media(prefers-reduced-motion:reduce){.harvest-lesson *{transition:none!important}.harvest-lesson .dot{display:none}}

/* El contenedor comparte el centrado y ancho de las demás páginas. */
main.harvest-lesson.wrap{margin-inline:auto;min-width:0}
.harvest-lesson .stage,.harvest-lesson .canvas,.harvest-lesson .reference-content{min-width:0;max-width:100%}
.harvest-lesson .dots{flex-wrap:wrap}
@media(max-width:600px){.harvest-lesson .bar .dots{flex-basis:100%;margin-left:0}.harvest-lesson .bar button.b{padding:10px 12px}.harvest-lesson .verdict{gap:6px;font-size:12px}.harvest-lesson .reference-sources a{overflow-wrap:anywhere}}

.harvest-lesson .diagram-scroll-hint{display:none}
@media(max-width:700px){.harvest-lesson .diagram-scroll-hint{display:block;padding:12px 16px;margin:0;color:var(--muted);font-size:13px}.harvest-lesson .canvas:focus-visible{outline:2px solid var(--purple);outline-offset:-2px}}