.learner-layout{max-width:1240px;margin:auto;padding:0 28px}.learner-header{display:flex;align-items:center;justify-content:space-between;padding:22px 0;gap:16px}.learner-header .brand{padding:0;color:var(--ink,#24313a);display:flex;align-items:center;gap:10px}.learner-header .brand svg{width:34px;height:34px}.learner-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap;border-top:1px solid #ddd;border-bottom:1px solid #ddd;padding:8px 0}.learner-nav>a,.learner-nav summary{display:block;padding:10px 12px;text-decoration:none;color:#47555b;cursor:pointer;border-radius:6px}.learner-nav a[aria-current]{background:#e8eee9;color:#254c42;font-weight:700}.learner-nav details{position:relative}.learner-nav details>div{position:absolute;right:0;z-index:30;width:190px;background:#fff;border:1px solid #ddd;box-shadow:0 8px 24px #0001;padding:10px;border-radius:8px}.learner-nav details a{display:block;padding:10px;color:#344b43}.learner-layout main{padding:28px 0;min-width:0}.learner-heading h1{font-size:28px;margin:0 0 12px}.learner-heading p{color:#607068;margin:0 0 28px}.learner-entry-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.learner-entry{border:1px solid #dce2dc;border-radius:10px;padding:24px;background:white;display:flex;flex-direction:column;align-items:flex-start}.learner-entry>div{display:flex;align-items:center;gap:14px}.learner-entry>div svg{width:30px;height:30px;color:#587469}.learner-entry h2{font-size:23px;margin:0}.learner-entry p{margin:18px 0 24px;color:#5b6962;line-height:1.7}.learner-entry>a{margin-top:auto}.learner-entry a svg{width:17px;height:17px}.learner-summary{display:flex;flex-wrap:wrap;gap:24px;margin:24px 0;color:#607068}.learner-layout .auth-layout{grid-template-columns:minmax(0,1fr);max-width:500px;margin:auto}.learner-layout .auth-story{display:none}.learner-layout .foot{margin-top:36px;padding:20px 0}.learner-layout .library-grid{grid-template-columns:repeat(3,minmax(0,1fr))}.learner-resume{margin-bottom:18px}@media(max-width:760px){.learner-layout{padding:0 16px}.learner-header{padding:16px 0}.learner-header .brand{font-size:20px}.learner-nav{gap:0}.learner-nav>a,.learner-nav summary{padding:10px 8px;font-size:14px}.learner-layout main{padding:22px 0}.learner-entry-grid{grid-template-columns:1fr;gap:12px}.learner-entry{padding:18px}.learner-entry h2{font-size:21px}.learner-entry p{margin:12px 0 16px}.learner-heading h1{font-size:25px}.learner-layout .library-grid{grid-template-columns:1fr}.learner-summary{gap:12px;font-size:14px}.learner-nav details>div{right:auto;left:0}.learner-layout .hero{padding:24px 18px}}

.learner-header .brand{margin:0}.learner-nav details{margin:0}.learner-header .button{max-width:65%;overflow-wrap:anywhere}

/* Header entitlement badge & redeem button */
.header-right{display:flex;align-items:center;gap:10px;flex-wrap:wrap;justify-content:flex-end}
.entitlement-badge{display:inline-flex;align-items:center;padding:6px 12px;background:#f0f4f2;border:1px solid #d4deda;border-radius:20px;font-size:12px;color:#24443b;text-decoration:none;font-weight:600;white-space:nowrap;transition:background .15s}
.entitlement-badge:hover{background:#e3ece7;border-color:#b9cac2}
.entitlement-badge.active{background:#eaf5ef;border-color:#b8deca;color:#18533a}
.redeem-btn{padding:8px 14px;min-height:36px;font-size:13px;white-space:nowrap;font-weight:600}
.learner-header .button{max-width:none}
.topic-status-badge{font-size:11px;font-weight:600;padding:3px 8px;border-radius:6px;letter-spacing:.02em;display:inline-block;white-space:nowrap}
.status-free{color:#1b6d39;background:#e8f5ec;border:1px solid #c2e7cc}
.status-unlocked{color:#205493;background:#e7f2f9;border:1px solid #bbd8ec}
.status-locked{color:#9a3412;background:#fff7ed;border:1px solid #ffedd5}
.topic-locked{opacity:.92}
.topic-redeem-link{color:#c2410c;font-weight:600;text-decoration:none}
@media(max-width:760px){
.header-right{gap:6px;width:100%;justify-content:flex-start;margin-top:8px}
.learner-header{flex-direction:column;align-items:flex-start;gap:8px}
.entitlement-badge{font-size:11px;padding:4px 9px}
.redeem-btn{padding:6px 10px;min-height:32px;font-size:12px}
.account-btn{padding:6px 10px;min-height:32px;font-size:12px}
}