.workflow-library { padding-top: 8px; }
.library-note { color: var(--muted); font-size: 14px; max-width: 85ch; margin: -20px 0 30px; }
.library-controls { display: flex; align-items: end; gap: 24px; padding-block: 24px; border-block: 1px solid var(--rule); }
.browse-switch { display: flex; align-self: end; border: 1px solid var(--rule); min-height: 46px; flex-shrink: 0; }
.browse-switch button { border: 0; background: transparent; color: var(--muted); padding: 10px 18px; font-size: 14px; }
.browse-switch button[aria-pressed="true"] { background: var(--forest); color: white; }
.control-label { display: flex; flex-direction: column; gap: 7px; font-size: 13px; font-weight: 500; min-width: 0; }
.control-label input, .control-label select { display: block; width: 100%; min-height: 46px; font: 400 15px/1.4 var(--sans); color: var(--ink); border: 1px solid var(--rule-strong, #76877a); border-radius: 3px; padding: 10px 12px; background: var(--paper); }
.control-label select { padding-right: 28px; }
.control-label input:focus, .control-label select:focus { outline: 2px solid #598063; outline-offset: 2px; }
.control-label input[aria-invalid="true"] { border-color: #964431; }
.search-control { flex: 1; }
.collection-count { color: var(--muted); font-size: 12px; padding-block: 19px; }
.scenario-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 22px; align-items: stretch; }
.scenario-card { display: flex; flex-direction: column; min-width: 0; background: #fff; border: 1px solid var(--rule); border-radius: 5px; padding: 27px 25px 22px; }
.scenario-team { color: var(--forest); font-size: 12px; margin-bottom: 17px; }
.scenario-card h3 { font-size: 23px; line-height: 1.22; letter-spacing: -.025em; }
.scenario-pain { font-size: 16px; color: var(--muted); margin: 16px 0 22px; flex: 1; }
.scenario-toggle, .scenario-close { display: flex; align-items: center; justify-content: space-between; gap: 12px; font-size: 14px; cursor: pointer; color: var(--forest); background: transparent; border: 0; padding-block: 12px; text-align: left; }
.scenario-toggle[aria-expanded="true"] .functional-icon { transform: rotate(180deg); }
.scenario-toggle:hover, .scenario-close:hover { text-decoration: underline; text-underline-offset: 3px; }
.scenario-detail { grid-column: 1 / -1; border: 1px solid var(--rule); border-left: 3px solid var(--forest); border-radius: 4px; background: var(--paper); padding: 28px; font-size: 16px; min-width: 0; }
.scenario-detail-heading { display: flex; align-items: start; justify-content: space-between; gap: 24px; margin-bottom: 24px; }
.scenario-detail-heading h3 { font-size: 25px; line-height: 1.3; scroll-margin-top: 20px; }
.scenario-close { flex-shrink: 0; }
.scenario-detail-columns { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 28px; }
.scenario-role-columns { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.scenario-detail h4 { margin: 17px 0 8px; font-size: 16px; font-weight: 500; }
.scenario-detail h4:first-child { margin-top: 0; }
.scenario-detail p, .scenario-detail li { color: var(--muted); }
.scenario-detail ul { padding-left: 18px; margin: 6px 0 14px; }
.scenario-detail li + li { margin-top: 8px; }
.scenario-detail .role-task { border: 0; padding: 8px 0; background: transparent; color: var(--forest); text-decoration: underline; text-underline-offset: 3px; text-align: left; font-size: 16px; }
.scenario-detail .scenario-research-date { font-size: 14px; margin-top: 24px; }
.scenario-research { border-top: 1px solid var(--rule); padding-top: 16px; margin-top: 16px; }
.scenario-research summary { cursor: pointer; font-size: 14px; color: var(--forest); padding-block: 8px; }
.scenario-research[open] summary { margin-bottom: 16px; }
.scenario-research summary::marker, .assumption-details summary::marker, .calculation-method summary::marker { color: var(--forest); }
.scenario-evidence { margin-top: 20px; border-top: 1px solid var(--rule); padding-top: 16px; }
.scenario-evidence a { overflow-wrap: anywhere; text-decoration: underline; text-underline-offset: 3px; }
.source-meta { display: block; font-size: 12px; margin-top: 4px; }
.scenario-evidence .evidence-notice { font-size: 14px; margin-top: 16px; }
.scenario-detail-footer { display: flex; justify-content: flex-end; border-top: 1px solid var(--rule); margin-top: 20px; padding-top: 8px; }
.estimate-workflow { display: flex; justify-content: space-between; align-items: center; gap: 12px; width: 100%; border: 0; border-top: 1px solid var(--rule); background: transparent; color: var(--forest); padding: 18px 0 0; margin-top: 10px; font-size: 14px; text-align: left; }
.estimate-workflow:hover { text-decoration: underline; text-underline-offset: 4px; }
.outline-button { background: transparent; color: var(--forest); border-color: var(--rule); margin-top: 30px; }
.outline-button:hover { background: var(--mist); }
.empty-workflows { padding: 32px 0; }
.empty-workflows .button { margin-top: 20px; }
.capacity-section { background: var(--mist); margin-bottom: 105px; }
.capacity-layout { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, .95fr); gap: 60px; align-items: start; }
.capacity-form { display: flex; flex-direction: column; gap: 20px; min-width: 0; }
.capacity-form > .field-hint { margin-top: -12px; }
.input-pair { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; align-items: end; }
.field-hint { font-size: 12px; font-weight: 400; color: var(--muted); line-height: 1.65; max-width: 60ch; }
.assumption-details { border-top: 1px solid #bac8bd; padding-top: 16px; }
.assumption-details summary { cursor: pointer; font-size: 14px; color: var(--forest); }
.assumption-details[open] summary { margin-bottom: 20px; }
.assumption-details > p, .assumption-details > .control-label { margin-block: 16px; }
.check-label { display: flex; align-items: start; gap: 10px; font-size: 13px; margin: 20px 0; }
.check-label input { width: 17px; height: 17px; accent-color: var(--forest); flex-shrink: 0; }
#role-mix { border-top: 1px solid var(--rule); padding-top: 17px; margin-top: 20px; }
#role-mix h3 { font-size: 16px; margin-bottom: 8px; }
.role-share { display: grid; grid-template-columns: 1fr 85px; align-items: center; gap: 16px; margin-top: 14px; }
.role-share input { text-align: right; }
.form-error { color: #843926; background: #fff0e6; border-left: 3px solid #964431; padding: 12px 15px; font-size: 13px; }
.reset-calculator { align-self: start; color: var(--forest); text-decoration: underline; text-underline-offset: 4px; padding: 4px 0; background: none; border: 0; font-size: 12px; }
.capacity-results { background: var(--forest); color: var(--paper); padding: 36px; border-radius: 5px; min-width: 0; }
.capacity-results :focus-visible { outline-color: var(--paper); }
.estimate-label { font-size: 12px; color: #c5d9ca; margin-bottom: 20px; }
.result-context { font-size: 19px; line-height: 1.4; max-width: 30ch; }
.weekly-result { display: flex; align-items: center; gap: 22px; margin-block: 15px 0; }
.weekly-result strong { font-family: var(--serif); font-size: clamp(65px, 7vw, 100px); font-weight: 400; line-height: 1.15; font-variant-numeric: tabular-nums; letter-spacing: -.02em; }
.weekly-result span { font-size: 14px; line-height: 1.5; }
.result-range { font-size: 12px; color: #d5e3d8; margin: 5px 0 24px; }
#capacity-meter { display: block; width: 100%; height: 11px; appearance: none; border: 0; background: #56745f; border-radius: 4px; overflow: hidden; }
#capacity-meter::-webkit-meter-bar { background: #56745f; border: 0; height: 11px; border-radius: 4px; }
#capacity-meter::-webkit-meter-optimum-value { background: #c5ddba; border-radius: 4px; }
#capacity-meter::-moz-meter-bar { background: #c5ddba; }
.result-caption { color: #d5e3d8; font-size: 12px; margin-top: 9px; }
.year-results { display: grid; grid-template-columns: .8fr 1.2fr; gap: 25px; border-block: 1px solid #5b7663; padding-block: 25px; margin-block: 28px 20px; }
.year-results strong { display: block; font-family: var(--serif); font-size: clamp(32px, 3vw, 45px); font-weight: 400; line-height: 1.2; letter-spacing: -.015em; overflow-wrap: anywhere; }
.year-results span { display: block; color: #d5e3d8; font-size: 12px; margin-top: 8px; }
.value-explanation { font-size: 13px; line-height: 1.8; color: #d5e3d8; }
.cash-results { border-top: 1px solid #5b7663; margin-top: 25px; padding-top: 22px; }
.cash-results h3 { font-size: 17px; }
.cash-results dl { margin-block: 17px; font-size: 12px; }
.cash-results dl > div { display: flex; gap: 20px; justify-content: space-between; margin-block: 10px; }
.cash-results dd { margin: 0; text-align: right; font-variant-numeric: tabular-nums; }
.cash-results p { font-size: 12px; color: #d5e3d8; }
.result-next { border-top: 1px solid #5b7663; padding-top: 23px; margin-top: 28px; }
.result-next p { font-size: 13px; }
.result-next .button { margin-top: 19px; }
.calculation-method { border-top: 1px solid #bac8bd; margin-top: 37px; padding-top: 20px; font-size: 13px; }
.calculation-method summary { cursor: pointer; color: var(--forest); }
.method-copy { columns: 2; column-gap: 45px; padding-top: 17px; }
.method-copy p { break-inside: avoid; color: var(--muted); font-size: 12px; margin-bottom: 16px; }
.inline-link { text-decoration: underline; text-underline-offset: 3px; }
#library-status { margin-bottom: 18px; }
#library-status button { margin-left: 12px; }
@media (max-width: 1100px) {
  .library-controls { flex-wrap: wrap; gap: 18px; }
  .library-controls > .control-label { flex: 1; }
  .scenario-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .capacity-layout { gap: 30px; }
  .capacity-results { padding: 27px; }
  .input-pair { gap: 13px; }
}
@media (max-width: 900px) {
  .scenario-detail-columns { grid-template-columns: 1fr; gap: 20px; }
}
@media (max-width: 600px) {
  .scenario-grid { grid-template-columns: 1fr; }
  .scenario-detail { padding: 22px; }
  .scenario-detail-heading { flex-direction: column; gap: 8px; }
}
@media screen and (max-width: 820px) {
  .library-note { margin-top: -10px; }
  .library-controls > .search-control { flex-basis: 100%; }
  .capacity-layout { grid-template-columns: 1fr; gap: 35px; }
  .capacity-results { padding: 30px; }
  .weekly-result strong { font-size: 90px; }
  .year-results strong { font-size: 42px; }
  .method-copy { columns: 1; }
  .capacity-section { margin-bottom: 75px; }
}
@media screen and (max-width: 600px) {
  .control-label input, .control-label select { font-size: 16px; }
  .scenario-card { padding: 24px; }
  .browse-switch button { padding-inline: 14px; }
  .library-controls { gap: 15px; }
  .library-controls > .control-label { flex-basis: 100%; }
  .input-pair { grid-template-columns: 1fr; gap: 17px; }
  .capacity-results { padding: 26px 23px; }
  .weekly-result strong { font-size: 76px; }
  .weekly-result { gap: 17px; }
  .year-results { gap: 18px; }
  .year-results strong { font-size: 35px; }
  .cash-results dl > div { gap: 12px; }
}
@media print {
  .library-controls, .browse-switch, #show-all-workflows, .reset-calculator, .result-next { display: none; }
  .scenario-grid { display: block; }
  .scenario-card { break-inside: avoid; margin-bottom: 16px; }
  .scenario-toggle, .scenario-close, .estimate-workflow { display: none; }
  .scenario-detail { border-color: black; margin-block: 16px; }
  .scenario-detail-columns { display: block; }
  .capacity-layout { display: block; }
  .capacity-results { margin-top: 25px; color: black; background: white; border: 1px solid black; }
  .capacity-results p, .capacity-results span { color: black; }
}

@media (forced-colors: active) {
  .browse-switch button[aria-pressed="true"] { background: Highlight; color: HighlightText; border: 1px solid Highlight; }
  .scenario-card, .scenario-detail, .scenario-toggle, .scenario-close { border-color: CanvasText; }
}

/* Calculator labels and explanations remain readable at each breakpoint. */
.control-label, .assumption-details summary, .check-label, .reset-calculator, .value-explanation, .result-next p, .method-copy p { font-size: 14px; }
.control-label input, .control-label select { font-size: 16px; min-height: 48px; }
.method-copy p, .field-hint { max-width: 60ch; }
.capacity-section { margin-bottom: 0; }
@media screen and (min-width: 821px) and (max-width: 1100px) {
  .input-pair { grid-template-columns: 1fr; }
}
@media print {
  .scenario-pain { min-height: 0; }
  .capacity-section { margin-bottom: 0; }
  .capacity-results { break-inside: auto; }
  .method-copy { columns: 1; }
  details::details-content { content-visibility: visible; }
}
