.learning-context{width:100%;color:var(--text-primary);text-align:left}
.learning-context-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 0 24px;border-bottom:1px solid var(--border-dim)}
.learning-context-actions{display:flex;align-items:center;justify-content:flex-end;gap:8px;flex-wrap:wrap}
.learning-context .learning-eyebrow{margin:0 0 7px;color:var(--accent);font:700 10px/1.2 var(--font-mono);letter-spacing:.1em;text-transform:uppercase}
.learning-context .learning-home-link{color:inherit;text-decoration:none}.learning-context .learning-home-link:hover{text-decoration:underline}
.learning-context h1{margin:0;color:var(--text-primary);font:700 30px/1.2 var(--font-display);letter-spacing:-.02em}
.learning-context .learning-lede{max-width:680px;margin:8px 0 0;color:var(--text-secondary);font-size:14px;line-height:1.5}
.learning-context .learning-nav{display:flex;gap:2px;overflow-x:auto;border-bottom:1px solid var(--border-dim)}
.learning-context .learning-nav a{position:relative;display:inline-flex;min-height:44px;align-items:center;border:0;border-radius:0;background:transparent;color:var(--text-secondary);padding:0 14px;font:600 12px/1 var(--font-sans);text-decoration:none;white-space:nowrap}
.learning-context .learning-nav a:hover{background:var(--accent-bg);color:var(--accent)}
.learning-context .learning-nav a.active{color:var(--accent)}
.learning-context .learning-nav a.active::after{position:absolute;right:10px;bottom:-1px;left:10px;height:2px;border-radius:2px 2px 0 0;background:var(--accent);content:""}
.learning-context .learning-context-button{display:inline-flex;min-height:34px;align-items:center;justify-content:center;border:1px solid var(--border-dim);border-radius:8px;background:transparent;color:var(--text-secondary);padding:0 13px;font:700 11px/1 var(--font-sans);text-decoration:none}
.learning-context [hidden]{display:none!important}
.learning-context .learning-context-button:hover{border-color:var(--accent);color:var(--accent)}
body.personal-learning-portfolio .learning-context{width:100%;margin:0 0 22px}
body.personal-learning-portfolio .lab-hero{width:100%;text-align:left}
body.personal-learning-portfolio .lab-hero h1{font-size:24px}
@media(max-width:760px){.learning-context-hero{align-items:flex-start;flex-direction:column;padding:22px 0 18px}.learning-context-actions{justify-content:flex-start}.learning-context h1{font-size:26px}}