.xp-weight-space-programming { max-width: 760px; margin: 0 auto; padding: 2.5rem 1.25rem 4rem; color: #0b3a3a; font-family: "Source Sans 3", sans-serif; font-size: 1.15rem; line-height: 1.6; }
.xp-weight-space-programming h1 { font-family: "Barlow Condensed", sans-serif; font-size: clamp(2.3rem, 7vw, 3.8rem); line-height: 1.05; margin: .5rem 0 1rem; }
.xp-weight-space-programming h2 { font-family: "Barlow Condensed", sans-serif; font-size: 2rem; margin: 0 0 .6rem; }
.xp-weight-space-programming h3 { font-family: "Barlow Condensed", sans-serif; font-size: 1.5rem; margin: 0; }
.xp-weight-space-programming section { margin-top: 2.75rem; border-top: 2px solid #0b3a3a; padding-top: 1.1rem; }
.xp-weight-space-programming p { margin: 0 0 1rem; }
.xp-weight-space-programming a { color: #a3241b; }
.xp-weight-space-programming a:focus-visible, .xp-weight-space-programming button:focus-visible, .xp-weight-space-programming summary:focus-visible { outline: 3px solid #a3241b; outline-offset: 2px; }
.xp-weight-space-programming .tag, .xp-weight-space-programming .hint { font-family: "IBM Plex Mono", monospace; font-size: .85rem; }
.xp-weight-space-programming .tag { color: #a3241b; font-weight: 600; }
.xp-weight-space-programming .dek { font-size: 1.3rem; }
.xp-weight-space-programming .short { background: #fff; border-left: 6px solid #a3241b; padding: 1rem 1.25rem; }
.xp-weight-space-programming .short h2 { font-size: 1.4rem; }
.xp-weight-space-programming .short p { margin: 0; }
.xp-weight-space-programming .follow { margin-top: 2rem; font-weight: 600; }
.xp-weight-space-programming .video { position: relative; aspect-ratio: 16 / 9; margin-top: 2rem; }
.xp-weight-space-programming .video iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.xp-weight-space-programming .lab { background: #0b3a3a; color: #ecfbf3; border-radius: 8px; padding: 1.25rem; }
.xp-weight-space-programming .lab .hint { color: #cdeee4; margin: .5rem 0 .9rem; }
.xp-weight-space-programming .budget { display: flex; gap: .5rem; flex-wrap: wrap; margin-bottom: 1rem; }
.xp-weight-space-programming .budget button { font: 600 1rem "IBM Plex Mono", monospace; min-width: 64px; padding: .5rem .8rem; border: 2px solid #7df0b5; background: transparent; color: #ecfbf3; border-radius: 4px; cursor: pointer; }
.xp-weight-space-programming .budget button[aria-pressed="true"] { background: #7df0b5; color: #0b3a3a; }
.xp-weight-space-programming .meter { display: grid; grid-template-columns: 8.5rem 1fr 3.8rem; gap: .6rem; align-items: center; margin-bottom: .55rem; font: 400 .9rem "IBM Plex Mono", monospace; }
.xp-weight-space-programming .track { height: 16px; background: #145a58; border-radius: 3px; overflow: hidden; display: block; }
.xp-weight-space-programming .fill { display: block; height: 100%; width: 0; background: #7df0b5; transition: width .35s ease; }
.xp-weight-space-programming .meter.bad .fill { background: #ff7a6e; }
.xp-weight-space-programming .val { text-align: right; font-weight: 600; }
.xp-weight-space-programming blockquote { margin: 0 0 1.25rem; padding-left: 1rem; border-left: 4px solid #2f7d78; }
.xp-weight-space-programming cite { display: block; font-style: normal; font-size: .95rem; margin-top: .25rem; }
.xp-weight-space-programming details { border-bottom: 1px solid #2f7d78; padding: .6rem 0; }
.xp-weight-space-programming summary { cursor: pointer; font-weight: 600; }
.xp-weight-space-programming details p { margin: .5rem 0 0; }
@media (prefers-reduced-motion: reduce) { .xp-weight-space-programming .fill { transition: none; } }
