.calculator-program-library,
.calculator-program-detail { max-width: 88rem; }
.program-filters { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); align-items: end; }
.program-filter-actions, .program-source-actions { display: flex; flex-wrap: wrap; gap: .75rem; }
.program-source-actions [hidden] { display: none !important; }
.program-results-heading, .program-card__heading, .program-source-heading { align-items: start; display: flex; flex-wrap: wrap; gap: 1rem; justify-content: space-between; }
.program-card-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 20rem), 1fr)); }
.program-card { display: flex; flex-direction: column; }
.program-card > .button { align-self: start; margin-top: auto; }
.program-facts, .program-digest { display: grid; gap: .75rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 11rem), 1fr)); }
.program-facts div, .program-digest div { border-left: .2rem solid var(--color-border); min-width: 0; padding-left: .75rem; }
.program-facts dt, .program-digest dt { color: var(--color-text-muted); font-size: .8rem; font-weight: 700; text-transform: uppercase; }
.program-facts dd, .program-digest dd { margin: .25rem 0 0; overflow-wrap: anywhere; }
.program-empty { text-align: center; }
.program-hero { display: grid; gap: 1.5rem; }
.program-download-card { background: var(--color-surface-subtle); border: 1px solid var(--color-border); border-radius: var(--radius-md); padding: 1rem; }
.program-download-card .button { margin: .25rem .5rem .25rem 0; }
.program-detail-grid { display: grid; gap: 1rem; }
.program-source-view { background: var(--color-surface-subtle); border: 1px solid var(--color-border); border-radius: var(--radius-md); font-family: var(--font-family-mono); line-height: 1.55; max-height: 38rem; overflow: auto; }
.program-source-view:focus { outline: .2rem solid var(--color-focus); outline-offset: .15rem; }
.program-source-view ol { counter-reset: line; margin: 0; min-width: max-content; padding: 1rem 1rem 1rem 4.5rem; }
.program-source-view li { border-left: 1px solid var(--color-border); min-height: 1.55em; padding: 0 .75rem; white-space: pre; }
.program-source-view li::marker { color: var(--color-text-muted); }
.program-source-view code { color: var(--color-text); font: inherit; }
.program-digest code { overflow-wrap: anywhere; word-break: break-all; }
.program-guide-callout { border-left: .25rem solid var(--color-action); padding: .75rem 1rem; }
.program-memory-note { background: var(--color-surface-subtle); border-left: .25rem solid var(--color-action); margin: 0 0 1rem; padding: .75rem 1rem; }
.program-memory-note strong { color: var(--color-text); }
.program-simulator__inputs { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 12rem), 1fr)); }
.program-simulator__actions { display: flex; flex-wrap: wrap; gap: .75rem; margin-top: 1rem; }
.program-simulator__output { background: var(--color-surface-subtle); border: 1px solid var(--color-border); border-radius: var(--radius-md); display: grid; gap: .35rem; margin-top: 1rem; padding: 1rem; }
.program-simulator__output span { color: var(--color-text-muted); font-size: .8rem; font-weight: 700; text-transform: uppercase; }
.program-simulator__output strong { font-size: 1.25rem; overflow-wrap: anywhere; }
.program-screen-preview { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); justify-items: start; max-width: 100%; }
.program-screen-preview[hidden], .program-screen-preview [hidden] { display: none !important; }
.program-screen-preview__calculator { background: #9c2925; border: .2rem solid #661512; border-radius: 1.35rem 1.35rem 2rem 2rem; box-shadow: 0 .45rem 0 #5c1512, 0 .75rem 1.2rem #0003; color: #fff; max-width: 100%; min-width: 0; padding: 1rem; width: 24rem; }
.program-screen-preview__model { font-size: .8rem; font-weight: 700; letter-spacing: .04em; margin: 0 0 .65rem; text-align: center; }
.program-screen-preview__display { background: #fafaf5; border: .45rem solid #28252b; border-radius: .35rem; color: #20232b; min-height: 17rem; overflow: hidden; }
.program-screen-preview__bar { align-items: center; background: #59637d; color: #fff; display: flex; font-size: .75rem; font-weight: 700; justify-content: space-between; letter-spacing: .08em; padding: .3rem .5rem; }
.program-screen-preview__bar span { color: #8ee079; }
.program-screen-preview__display pre { color: #20232b; font-family: var(--font-family-mono); font-size: clamp(.6rem, 2.5vw, .82rem); line-height: 1.35; margin: 0; min-height: 14.5rem; overflow-wrap: anywhere; padding: .6rem; white-space: pre-wrap; }
.program-screen-preview__keys { display: grid; gap: .25rem; grid-template-columns: repeat(5, 1fr); margin-top: .75rem; }
.program-screen-preview__keys span { background: #f0eee8; border-radius: .25rem; color: #30313c; font-size: .55rem; font-weight: 700; padding: .4rem .1rem; text-align: center; }
.program-screen-preview form { max-width: 100%; width: 24rem; }
.program-screen-preview form .field__control { max-width: 100%; }
@media (forced-colors: active) { .program-screen-preview__calculator, .program-screen-preview__display, .program-screen-preview__keys span { border: 1px solid CanvasText; color: CanvasText; } }
.guide-contents ol { columns: 2 16rem; }
.guide-contents li { break-inside: avoid; margin-bottom: .5rem; }
.guide-troubleshooting { display: grid; gap: 1rem; }
.guide-troubleshooting div { border-left: .2rem solid var(--color-border); padding-left: 1rem; }
.guide-troubleshooting dt { font-weight: 700; }
.guide-troubleshooting dd { margin: .35rem 0 0; }
.source-reading-guide pre { background: var(--color-surface-subtle); border: 1px solid var(--color-border); border-radius: var(--radius-md); overflow: auto; padding: 1rem; }
@media (min-width: 48rem) { .program-hero { grid-template-columns: minmax(0, 1.4fr) minmax(18rem, .8fr); } .program-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 22rem) { .program-filter-actions .button, .program-source-actions .button { width: 100%; } .program-source-view { font-size: .8rem; } }
