/* Scoped teaching components. Color always has a text/shape counterpart. */
.gc-lab {
  --gc-live: #087f75; --gc-live-soft: #d9f0e9;
  --gc-pause: #a0470c; --gc-pause-soft: #fff0db;
  --gc-pending: #6d4ab5; --gc-pending-soft: #eee7fa;
  --gc-ink: #203535; --gc-muted: #536665; --gc-surface: #f4f8f7;
  --gc-line: #c6d8d4; --gc-empty: #e6edeb;
  --gc-error: #b82b41; --gc-paper: #fff;
}
[data-md-color-scheme="slate"] .gc-lab {
  --gc-live: #74dac7; --gc-live-soft: #193d38;
  --gc-pause: #ffbd78; --gc-pause-soft: #44301f;
  --gc-pending: #c6b1fb; --gc-pending-soft: #342a48;
  --gc-ink: #e4efeb; --gc-muted: #b0c3bc; --gc-surface: #20302f;
  --gc-line: #46605b; --gc-empty: #304440;
  --gc-error: #ff9aaa; --gc-paper: #1e252d;
}
.gc-lab {background: var(--gc-surface); border: 1px solid var(--gc-line); border-radius: 10px; margin: 1.6rem 0 2rem; padding: 1.15rem; color: var(--gc-ink); overflow: clip;}
.gc-lab .gc-lab-title {margin: 0; font-size: .92rem;}
.gc-lab .gc-lab-number {font-size: .65rem; color: var(--gc-muted); margin: .25rem 0 .9rem;}
.gc-lab .gc-intro, .gc-lab .gc-footnote {font-size: .68rem; color: var(--gc-muted); margin: .6rem 0;}
.gc-lab .gc-controls {display: flex; flex-wrap: wrap; align-items: center; gap: .45rem; margin: .8rem 0;}
.gc-lab button, .gc-lab select {font: inherit; font-size: .69rem; min-height: 2rem; border-radius: 5px; border: 1px solid var(--gc-line); background: var(--gc-paper); color: var(--gc-ink); padding: .3rem .65rem; cursor: pointer; max-width: 100%;}
.gc-lab button:hover {border-color: var(--gc-live);}
.gc-lab button[aria-pressed="true"], .gc-lab .gc-primary {background: var(--gc-live); color: var(--gc-paper); border-color: var(--gc-live);}
[data-md-color-scheme="slate"] .gc-lab button[aria-pressed="true"], [data-md-color-scheme="slate"] .gc-lab .gc-primary {color: #132a25;}
.gc-lab button:disabled {opacity: .48; cursor: default;}
.gc-lab button:focus-visible, .gc-lab select:focus-visible, .gc-lab input:focus-visible {outline: 3px solid var(--gc-live); outline-offset: 3px;}
.gc-lab label {display: inline-flex; align-items: center; flex-wrap: wrap; gap: .4rem; font-size: .7rem;}
.gc-lab input[type="range"] {accent-color: var(--gc-live); min-width: 110px; flex: 1;}
.gc-lab .gc-steps {margin-left: auto; color: var(--gc-muted); font-variant-numeric: tabular-nums; font-size: .68rem;}
.gc-lab .gc-status {min-height: 3.6em; padding: .8rem 0 .1rem; border-top: 1px solid var(--gc-line); margin-top: .7rem; font-size: .74rem;}
.gc-lab .gc-status strong {color: var(--gc-live);}
.gc-lab .gc-status.gc-danger {color: var(--gc-error);}
.gc-lab .gc-code {display: block; padding: .55rem .7rem; border-radius: 4px; font-family: var(--md-code-font); font-size: .7rem; color: var(--gc-ink); background: var(--gc-paper); overflow-wrap: anywhere;}
.gc-lab svg {display: block; width: 100%; height: auto;}
.gc-lab svg text {fill: var(--gc-ink); font-family: var(--md-text-font); font-size: 13px;}
.gc-lab svg .gc-small {font-size: 11px; fill: var(--gc-muted);}
.gc-lab svg .gc-edge {fill: none; stroke: var(--gc-muted); stroke-width: 1.6;}
.gc-lab svg .gc-edge-new {stroke: var(--gc-live); stroke-width: 2.6;}
.gc-lab .gc-legend {display: flex; gap: .5rem 1rem; flex-wrap: wrap; font-size: .65rem; margin: .7rem 0; color: var(--gc-muted);}
.gc-lab .gc-legend span {display: inline-flex; align-items: center; gap: .3rem;}
.gc-lab .gc-dot {display: inline-block; width: .5rem; height: .5rem; border-radius: 50%; background: var(--gc-live);}
.gc-lab .gc-dot-pause {background: var(--gc-pause);}
.gc-phase-grid {display: grid; grid-template-columns: 1.2fr 1fr 1fr; gap: 4px; margin-top: .7rem;}
.gc-phase-grid [role="row"] {display: contents;}
.gc-phase-grid [role="cell"], .gc-phase-grid [role="columnheader"] {padding: .55rem .35rem; font-size: .66rem; line-height: 1.5; display: flex; align-items: center; justify-content: center; text-align: center;}
.gc-phase-grid .gc-lane-label {justify-content: flex-start; color: var(--gc-muted); font-weight: 600;}
.gc-phase-grid .gc-running {background: var(--gc-live-soft);}
.gc-phase-grid .gc-paused {background: var(--gc-pause-soft);}
.gc-phase-grid .gc-now {outline: 2px solid var(--gc-live); outline-offset: -2px; font-weight: 700;}
.gc-budget-fields {display: flex; flex-wrap: wrap; gap: 1rem; margin: .7rem 0;}
.gc-budget-fields label {flex: 1 1 220px; display: flex;}
.gc-budget-fields output {font-variant-numeric: tabular-nums; font-weight: 700;}
.gc-region {margin: 1rem 0;}
.gc-region-heading {display: flex; gap: .5rem; justify-content: space-between; font-size: .68rem; margin-bottom: .25rem; flex-wrap: wrap;}
.gc-region-bar {display: flex; height: 1.35rem; background: var(--gc-empty); border-radius: 3px; overflow: hidden;}
.gc-region-bar span {background: var(--gc-live); display: block; transition: width .25s ease-out;}
.gc-region[data-selected="true"] .gc-region-heading b::after {content: " · 本次回收"; color: var(--gc-live);}
.gc-region:not([data-selected="true"]) {opacity: .72;}
.gc-budget-summary {display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; font-size: .75rem; margin: 1rem 0; font-variant-numeric: tabular-nums;}
.gc-version-list {list-style: none !important; padding: 0 !important; margin: 1rem 0 !important;}
.gc-version-list li {display: grid; grid-template-columns: 6rem 1fr; padding: .65rem 0; border-bottom: 1px solid var(--gc-line); margin: 0 !important; gap: .6rem; font-size: .75rem;}
.gc-version-list b {font-family: var(--md-code-font);}
.gc-year-note {font-size: .68rem; color: var(--gc-muted);}
@media (max-width: 600px) {
  .gc-lab {padding: .8rem; margin-left: -.15rem; margin-right: -.15rem;}
  .gc-lab button, .gc-lab select {min-height: 44px;}
  .gc-lab select {font-size: 16px;}
  .gc-lab .gc-controls {gap: .4rem;}
  .gc-version-list li {grid-template-columns: 5rem 1fr;}
}
@media (prefers-reduced-motion: reduce) {.gc-region-bar span {transition: none;}}
@media print {
  .gc-lab {break-inside: avoid; border-radius: 0;}
  .gc-lab .gc-controls, .gc-budget-fields {display: none;}
}
