/* Parallel method routes, resource relationships, and combinations. */
body.ai-atelier #activity-stage[data-activity="history"] { color-scheme: dark; color: #d4e4f2; background: transparent; border: 0; box-shadow: none; padding: 0; border-radius: 0; }
.method-map { --mm-line: #4b6782; --mm-ink: #dbe9f5; --mm-muted: #9eb8ce; color: var(--mm-ink); min-width: 0; }
body.ai-atelier #activity-stage .method-map :is(h2,h3,h4) { color: #e1edf7; }
.method-map .mm-heading { display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; margin-bottom: 18px; }
.method-map .mm-eyebrow { color: #9cb8d1; font-size: 10px; letter-spacing: .14em; }
body.ai-atelier #activity-stage .method-map .mm-heading h3 { color: #e7eef6; font-size: 25px; line-height: 1.55; letter-spacing: .04em; font-weight: 500; margin: 6px 0 0; }
.method-map .mm-parallel-label { display: inline-block; white-space: nowrap; color: #c5d5d9; font-size: 11px; padding: 5px 11px; border-block: 1px solid #617b89; }
.method-map .ov-history-tabs { gap: 8px; padding-bottom: 14px; margin: 0 !important; border-bottom: 1px solid #3b526b; }
body.ai-atelier #activity-stage .method-map .ov-history-tabs button { color: #a8bfd3; background: #102337; border: 1px solid #4c6882; box-shadow: none; padding: 8px 15px; }
body.ai-atelier #activity-stage .method-map .ov-history-tabs button[aria-pressed="true"] { color: #e0f2ff; background: #25455e; border-color: #9ac5df; box-shadow: inset 0 -2px #a0cce3; }

/* These are mechanisms on one continuous field, with distinct shapes and scale. */
.method-map .mm-atlas { display: grid; grid-template-columns: 1fr 1fr 1.15fr 1.1fr; position: relative; padding: 24px 20px 0; border: 1px solid #405b74; border-top: 0; background: radial-gradient(ellipse at 70% 0,#29425566,transparent 70%),#0d2030; overflow: hidden; }
.method-map .mm-route { position: relative; min-width: 0; padding: 15px 6px 19px; display: flex; flex-direction: column; align-items: center; color: #c4d9e8; }
.method-map .mm-route-rules { --mm-route: #d9c098; padding-top: 10px; }
.method-map .mm-route-learning { --mm-route: #a4d0bf; padding-top: 36px; }
.method-map .mm-route-deep { --mm-route: #bdc0e1; padding-top: 0; }
.method-map .mm-route-generation { --mm-route: #bad5e9; padding-top: 25px; }
.method-map .mm-knowledge-source { color: #b7cedd; display: grid; gap: 2px; text-align: center; min-height: 49px; }
.method-map .mm-knowledge-source small { font-size: 9px; color: #91adbf; letter-spacing: .05em; }
.method-map .mm-knowledge-source strong { font-size: 14px; font-weight: 500; color: var(--mm-route); }
.method-map .mm-mechanism { display: block; width: 100%; max-width: 220px; height: auto; flex-shrink: 0; pointer-events: none; }
.method-map .mm-art-line { stroke: var(--mm-route,#9dc7df); stroke-width: 1.5; opacity: .7; }
.method-map .mm-art-node { fill: #17364c; stroke: var(--mm-route,#9dc7df); stroke-width: 1.4; }
.method-map .mm-art-paper { fill: #17364c; stroke: var(--mm-route,#9dc7df); stroke-width: 1.4; }
.method-map .mm-art-window { stroke: var(--mm-route,#9dc7df); stroke-width: 1.4; fill: #102b40; }
.method-map .mm-art-unknown { stroke: var(--mm-route,#9dc7df); stroke-width: 1.4; stroke-dasharray: 3 3; }
.method-map .mm-route-deep .mm-art-line { opacity: .3; }
.method-map .mm-route-deep .mm-mechanism { max-width: 260px; margin-top: 2px; }
.method-map .mm-route-generation .mm-art-paper { fill: #c9dbe8; stroke: #d0e4f3; }
.method-map .mm-route-generation .mm-art-line { stroke: #617d91; opacity: 1; }
.method-map .mm-route-generation .mm-art-unknown { stroke: #7a6342; }
body.ai-atelier #activity-stage .method-map button.mm-method-anchor { display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 6px; color: #d9e7f2; background: transparent; border: 1px solid #526b81; border-bottom: 2px solid var(--mm-route); border-radius: 3px; box-shadow: none; min-height: 66px; width: 92%; padding: 9px 8px !important; margin-top: 14px; text-align: center; }
body.ai-atelier #activity-stage .method-map button.mm-method-anchor:hover { background: #25435a; border-color: var(--mm-route); }
body.ai-atelier #activity-stage .method-map button.mm-method-anchor[aria-pressed="true"] { color: #f0f6fa; background: #29445b; border-color: var(--mm-route); box-shadow: inset 0 -3px var(--mm-route); }
.method-map .mm-method-anchor small { color: #a3bacb; font-size: 10px; line-height: 1.5; }
.method-map .mm-method-anchor strong { color: inherit; font-size: 17px; font-weight: 500; line-height: 1.7; }
.method-map .mm-route-selected .mm-knowledge-source strong { color: #f0e9da; }
.method-map .mm-mechanism-caption { font-size: 11px; color: #9fb6ca; margin: 8px 0 0; text-align: center; }
.method-map .mm-stage-note { font-size: 10px; color: #a8bdcd; line-height: 1.7; text-align: center; max-width: 210px; margin: 6px 3px 0; }
.method-map .mm-parallel-horizon { grid-column: 1/-1; border-top: 1px solid #5e7b8e; margin: 0 6px; padding: 12px 0 15px; text-align: center; position: relative; }
.method-map .mm-parallel-horizon span { color: #a2bbcc; font-size: 11px; line-height: 1.8; }
.method-map .mm-focus-strip { display: grid; grid-template-columns: .8fr 1.1fr 1.2fr; align-items: stretch; gap: 22px; margin: 0; padding: 21px 24px; border: 1px solid #405b74; border-top: 0; background: #142a3d; }
.method-map .mm-focus-strip > .ov-symbol { display: none; }
.method-map .mm-focus-strip .ex-panel { grid-column: auto; grid-row: auto; border: 0; border-left: 1px solid #4f6c83; border-radius: 0; padding: 0 0 0 20px; background: transparent; }
.method-map .mm-focus-strip .ex-panel > strong { color: #d7e7f4; font-size: 15px; font-weight: 500; }
.method-map .mm-focus-strip .ex-panel p { color: #a9c0d3; font-size: 13px; line-height: 1.8; margin: 6px 0 0; }
.method-map .mm-selected-source { display: grid; align-content: center; gap: 8px; }
.method-map .mm-selected-source small { color: #9bb3c9; font-size: 10px; }
.method-map .mm-selected-source strong { color: #d3e2ed; font-size: 19px; font-weight: 500; }

/* A selected resource connects only to the original renderer's needs list. */
.method-map .mm-support-field { position: relative; border: 1px solid #405b74; border-top: 0; padding: 20px 22px 15px; background: #0d2030; min-width: 0; }
.method-map .mm-resource-pool { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 50px; position: relative; margin: 0 5% 105px; }
body.ai-atelier #activity-stage .method-map button.mm-resource-anchor { display: flex; flex-direction: row; align-items: center; justify-content: center; gap: 8px; padding: 10px 13px; min-width: 0; min-height: 75px; color: #b8cfe1; background: #142f44; border: 1px solid #5b7c97; border-radius: 36px; box-shadow: none; font-size: 14px; position: relative; z-index: 2; }
body.ai-atelier #activity-stage .method-map button.mm-resource-anchor[aria-pressed="true"] { color: #eaf5fc; background: #31556d; border-color: #c2dbea; box-shadow: 0 0 0 4px #8dc0d60e; }
.method-map .mm-resource-art { width: 55px; height: 43px; flex-shrink: 0; }
.method-map .mm-supported-methods { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 18px; position: relative; z-index: 2; }
.method-map .mm-supported-method { min-width: 0; display: flex; flex-direction: column; align-items: center; color: #849fb6; position: relative; }
.method-map .mm-supported-method .mm-mechanism { width: 82%; max-width: 180px; opacity: .45; }
.method-map .mm-supported-method > strong { color: #9fb6c9; font-size: 16px; font-weight: 500; margin: 3px 0 7px; }
.method-map .mm-method-port { font-size: 10px; color: #8ba4b9; border-top: 1px solid #4d697e; min-width: 80%; padding-top: 8px; text-align: center; line-height: 1.6; }
.method-map .mm-supported-lit { --mm-route: #c4deeb; }
.method-map .mm-supported-lit .mm-mechanism { opacity: 1; }
.method-map .mm-supported-lit > strong { color: #e0edf6; }
.method-map .mm-supported-lit .mm-method-port { border-color: #bdd8e7; color: #d3e8f5; }
.method-map .mm-support-links { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 1; overflow: visible; pointer-events: none; max-width: none; }
.method-map .mm-support-links path { stroke: #adcfe3; stroke-width: 1.6; }
.method-map .mm-support-links circle { fill: #d2e6f1; stroke: #0d2030; stroke-width: 1.5; }
.method-map .mm-support-summary { display: flex; gap: 6px; flex-wrap: wrap; color: #b5cbdd; background: #172d40; border: 1px solid #405b74; border-top: 0; margin: 0; padding: 13px 23px; font-size: 13px; line-height: 1.8; }
.method-map .mm-support-summary strong { color: #d6e9f5; font-weight: 500; }
.method-map .mm-original-support { margin-top: 12px; color: #9eb9cf; font-size: 11px; }
.method-map .mm-original-support summary { cursor: pointer; min-height: 30px; line-height: 1.8; }
.method-map .mm-original-support .ov-history-map { background: #edf4f1; border-radius: 6px; padding: 10px; max-height: none; margin: 8px 0; pointer-events: none; }

/* Retrieval, generation and checking occupy one shared composition surface. */
.method-map[data-mm-tab="combine"] > .ex-question { color: #bfd2e3; border: 0; font-size: 17px; padding: 0; margin: 18px 0 14px; }
.method-map .mm-combination-board { border: 1px solid #4b667e; background: radial-gradient(ellipse at center,#31495c55,transparent 65%),#0d2030; padding: 28px 25px 20px; }
.method-map .mm-combination-flow { display: grid; grid-template-columns: 1fr 40px 1.2fr 40px 1fr; gap: 12px; align-items: center; padding: 0; margin: 0; border: 0; }
.method-map .mm-combination-port { display: flex; flex-direction: column; align-items: center; min-width: 0; }
.method-map .mm-combination-port > .ov-symbol { display: none; }
.method-map .mm-combination-port > .mm-mechanism { max-width: 220px; width: 100%; margin-bottom: 16px; }
.method-map .mm-combination-port > small { color: #a7c1d5; font-size: 12px; letter-spacing: .07em; }
.method-map .mm-combination-port > strong { color: #dcebf5; font-size: 22px; font-weight: 500; margin-top: 8px; }
.method-map .mm-combination-1 > .mm-mechanism { max-width: 270px; }
.method-map .mm-combination-1 .mm-art-paper { fill: #b5cadc; stroke: #d4e3ee; }
.method-map .mm-combination-1 .mm-art-line { stroke: #617c91; opacity: 1; }
.method-map .mm-combination-flow > .ov-flow-arrow { font-size: 30px; color: #92b6cf; pointer-events: none; }
.method-map .mm-combination-caption { color: #a9bfd1; margin: 28px 0 0; padding-top: 16px; border-top: 1px solid #446076; text-align: center; font-size: 13px; line-height: 1.8; }
.method-map .mm-reading-note { margin-top: 12px; color: #a8bfd3; font-size: 12px; }
.method-map .mm-reading-note > summary { cursor: pointer; min-height: 32px; line-height: 1.8; color: #b2cadf; }
body.ai-atelier #activity-stage .method-map .mm-reading-note .ex-note { color: #aec4d8; background: #142b40; border-left-color: #7897ae; font-size: 12px !important; margin: 7px 0 0; }

@media (max-width: 1000px) {
  .method-map .mm-heading { align-items: flex-start; }
  .method-map .mm-parallel-label { font-size: 10px; padding-inline: 7px; }
  .method-map .mm-atlas { padding: 19px 11px 0; }
  .method-map .mm-route { padding-inline: 3px; }
  .method-map .mm-method-anchor strong { font-size: 15px; }
  .method-map .mm-method-anchor small { font-size: 9px; }
  .method-map .mm-knowledge-source strong { font-size: 12px; }
  .method-map .mm-focus-strip { gap: 15px; padding: 18px; }
  .method-map .mm-resource-pool { gap: 20px; margin-inline: 1%; }
  body.ai-atelier #activity-stage .method-map button.mm-resource-anchor { font-size: 12px; gap: 4px; padding-inline: 7px; }
  .method-map .mm-resource-art { width: 40px; }
  .method-map .mm-supported-method > strong { font-size: 14px; }
}
@media (max-width: 700px) {
  .method-map .mm-heading { display: block; }
  body.ai-atelier #activity-stage .method-map .mm-heading h3 { font-size: 21px; }
  .method-map .mm-parallel-label { margin-top: 10px; font-size: 10px; }
  .method-map .ov-history-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 6px; }
  body.ai-atelier #activity-stage .method-map .ov-history-tabs button { font-size: 11px; padding: 8px 5px; min-width: 0; }
  .method-map .mm-atlas { grid-template-columns: repeat(2,minmax(0,1fr)); padding: 18px 10px 0; }
  .method-map .mm-route { padding: 10px 4px 15px; }
  .method-map .mm-route-learning,.method-map .mm-route-generation { padding-top: 25px; }
  .method-map .mm-knowledge-source { min-height: 43px; }
  .method-map .mm-knowledge-source strong { font-size: 13px; }
  .method-map .mm-route .mm-mechanism { max-width: 180px; }
  body.ai-atelier #activity-stage .method-map button.mm-method-anchor { width: 95%; min-height: 62px; padding: 8px 5px !important; margin-top: 7px; }
  .method-map .mm-method-anchor strong { font-size: 15px; }
  .method-map .mm-mechanism-caption { font-size: 10px; }
  .method-map .mm-parallel-horizon { padding-block: 10px; text-align: left; }
  .method-map .mm-parallel-horizon span { font-size: 10px; }
  .method-map .mm-focus-strip { grid-template-columns: 1fr; gap: 15px; padding: 18px; }
  .method-map .mm-focus-strip .ex-panel { padding: 0; border: 0; border-top: 1px solid #456079; padding-top: 13px; }
  .method-map .mm-selected-source { gap: 3px; }
  .method-map .mm-selected-source strong { font-size: 18px; }
  .method-map .mm-support-field { padding: 16px 12px; }
  .method-map .mm-resource-pool { gap: 7px; margin: 0 0 80px; }
  body.ai-atelier #activity-stage .method-map button.mm-resource-anchor { flex-direction: column; gap: 1px; min-height: 86px; border-radius: 8px; font-size: 10px; padding: 5px; }
  .method-map .mm-resource-art { height: 38px; width: 49px; }
  .method-map .mm-supported-methods { grid-template-columns: repeat(2,minmax(0,1fr)); gap: 25px 16px; }
  .method-map .mm-supported-method > strong { font-size: 14px; }
  .method-map .mm-supported-method .mm-mechanism { width: 90%; max-width: 150px; }
  .method-map .mm-method-port { font-size: 9px; padding-top: 7px; }
  .method-map .mm-support-links path { stroke-width: 1.1; opacity: .65; }
  .method-map .mm-support-summary { font-size: 11px; padding: 11px 14px; }
  .method-map .mm-combination-board { padding: 20px 17px; }
  .method-map .mm-combination-flow { display: flex; flex-direction: column; align-items: stretch; gap: 16px; }
  .method-map .mm-combination-port { display: grid; grid-template-columns: 110px minmax(0,1fr); column-gap: 17px; text-align: left; align-items: center; }
  .method-map .mm-combination-port > .mm-mechanism { grid-column: 1; grid-row: 1 / span 2; width: 110px; margin: 0; }
  .method-map .mm-combination-port > small { grid-column: 2; align-self: end; font-size: 11px; }
  .method-map .mm-combination-port > strong { grid-column: 2; align-self: start; font-size: 19px; margin: 4px 0 0; }
  .method-map .mm-combination-flow > .ov-flow-arrow { display: block !important; width: 30px; text-align: center; transform: rotate(90deg); align-self: center; line-height: 1; }
  .method-map .mm-combination-caption { font-size: 11px; text-align: left; margin-top: 21px; }
}
@media print {
  body.ai-atelier #activity-stage[data-activity="history"], .method-map { background: #fff; color: #213c52; box-shadow: none; }
  .method-map .mm-support-links { display: none; }
}