/* Build 530: /learn (prototype A, .lm) and /exam-pathways/browse (prototype A, .pm). Generated from the approved prototypes. */
.lm{--ind:#3B2E8C;--navy:#150F3D;--lime:#B8D14A;--ink:#1B1830;--mute:#5E5A78;--line:#E4E2EE}
.lm *{box-sizing:border-box}
.lm{margin:0;font:16px/1.5 "Inter",system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:#F7F6FB}
.lm .wrap{max-width:1240px;margin:0 auto;padding:0 16px}
.lm .mx-hero{background:radial-gradient(900px 500px at 85% 0%,#2E2470,transparent 60%),var(--navy);color:#fff;padding:56px 0 52px}
.lm .kick{font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lime);margin:0}
.lm .mx-hero h1{font-size:clamp(32px,4vw,48px);line-height:1.06;letter-spacing:-.03em;margin:8px 0 14px;max-width:18ch}
.lm .lead{color:#D2CDEF;font-size:17px;max-width:60ch;margin:0}
.lm .st5{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:22px;max-width:640px}
.lm .st5 div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px}
.lm .st5 b{display:block;font-size:24px;line-height:1.1}
.lm .st5 span{font-size:11.5px;color:#C9C4E6;font-weight:600}
.lm .st5 .li b{color:var(--lime)}
.lm .mapA-h b{display:block;font-size:15px}
.lm .mapA-h span{font-size:13px;color:#C9C4E6}
.lm /* A */
.hgA{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:36px;align-items:end}
.lm .mapA{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:20px}
.lm .sky{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px;align-items:end;margin:16px 0 12px;min-height:300px}
.lm .sk{display:flex;flex-direction:column;align-items:center;gap:4px}
.lm .sk img{width:26px;height:26px;border-radius:7px;margin-top:4px}
.lm .sk b{font-size:10.5px;letter-spacing:.04em}
.lm .sk small{font-size:10.5px;color:#B5AFDB}
.lm .sk-t{display:flex;flex-direction:column-reverse;gap:3px;width:100%}
.lm .ct{display:grid;place-items:center;height:20px;border-radius:5px;background:var(--c);text-decoration:none;color:#fff;font-size:9.5px;font-weight:700;transition:transform .15s,opacity .2s,box-shadow .2s}
.lm .ct.t0{box-shadow:inset 0 0 0 2px var(--lime)}
.lm .ct.t2{background:color-mix(in srgb,var(--c) 55%,#0F0B2E)}
.lm .ct:hover{transform:scale(1.12)}
.lm .dim .ct{opacity:.18}
.lm .dim .ct.on{opacity:1;box-shadow:0 0 0 2px #fff,0 0 14px var(--c)}
.lm .chips{display:flex;flex-wrap:wrap;gap:6px}
.lm .chipc{display:inline-flex;gap:6px;align-items:center;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:#E7E4F8;border-radius:99px;padding:5px 10px;font:600 12.5px inherit;font-family:inherit;cursor:pointer}
.lm .chipc b{color:var(--k)}
.lm .chipc i{font-style:normal;background:rgba(255,255,255,.12);border-radius:99px;padding:0 6px;font-size:11px}
.lm .chipc.on{background:var(--k);color:#150F3D;border-color:var(--k)}
.lm .chipc.on b{color:#150F3D}
.lm .legend{display:flex;gap:14px;flex-wrap:wrap;margin-top:12px;font-size:12px;color:#C9C4E6}
.lm .legend i{display:inline-block;width:12px;height:12px;border-radius:3px;margin-right:6px;vertical-align:-1px;background:#8E7CC3}
.lm .legend .t0{box-shadow:inset 0 0 0 2px var(--lime)}
.lm .legend .t2{background:#4A3F7A}
.lm /* B */
.mapB{margin-top:26px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:20px}
.lm .flow{width:100%;height:auto;margin-top:10px;font-family:inherit}
.lm .flow text{fill:#E7E4F8;font-size:13px;font-weight:600}
.lm .flow .cnt{fill:#B5AFDB;font-size:12px}
.lm .flow .cc{font-size:18px;font-weight:800}
.lm .fl{fill:none;stroke-opacity:.35;transition:stroke-opacity .2s}
.lm .flow.hl .fl{stroke-opacity:.06}
.lm .flow.hl .fl.on{stroke-opacity:.9}
.lm .cn{cursor:pointer}
.lm /* C */
.hgC{display:grid;grid-template-columns:minmax(0,.85fr) minmax(0,1.15fr);gap:36px;align-items:center}
.lm .tmap{position:relative;height:440px;margin-top:12px}
.lm .tm{position:absolute;padding:3px;text-decoration:none;color:#fff}
.lm .tm-in{display:flex;flex-direction:column;gap:3px;height:100%;padding:12px;border-radius:14px;overflow:hidden;background:linear-gradient(150deg,var(--c),color-mix(in srgb,var(--c) 45%,#150F3D));border:1px solid rgba(255,255,255,.18);transition:transform .15s,box-shadow .15s}
.lm .tm:hover .tm-in{transform:scale(1.02);box-shadow:0 14px 30px rgba(0,0,0,.4)}
.lm .tm.tiny .tm-in{padding:8px;align-items:flex-start}
.lm .tm img{width:28px;height:28px;border-radius:7px;box-shadow:0 0 0 1px rgba(255,255,255,.4)}
.lm .tm b{font-size:14px;line-height:1.2}
.lm .tm small{font-size:11.5px;opacity:.85}
.lm .tm em{font-style:normal;font-size:12px;opacity:.8;margin-top:auto}
.lm /* shared domain section */
.dsec{padding:44px 0}
.lm .dsec-h{display:flex;gap:14px;align-items:center;padding-bottom:12px;border-bottom:3px solid var(--c)}
.lm .dsec-h img{width:48px;height:48px;border-radius:12px}
.lm .dsec-h h2{margin:0;font-size:26px}
.lm .dsec-h span{color:var(--mute);font-size:14px}
.lm .cgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin-top:18px}
.lm .cc2{display:flex;flex-direction:column;gap:8px;background:#fff;border:1px solid var(--line);border-top:4px solid var(--c);border-radius:14px;padding:16px;text-decoration:none;color:var(--ink);transition:transform .15s,box-shadow .15s}
.lm .cc2:hover{transform:translateY(-3px);box-shadow:0 14px 28px -16px rgba(21,15,61,.5)}
.lm .cc2-top{display:flex;justify-content:space-between;align-items:center}
.lm .cc2 code{font-weight:800;color:var(--c);font-size:13px}
.lm .tier{font-size:11px;font-weight:800;border-radius:99px;padding:2px 9px}
.lm .tier.t0{background:#EEF5D2;color:#4D6410}
.lm .tier.t1{background:#E8E5FA;color:#3B2E8C}
.lm .tier.t2{background:#241C5C;color:#fff}
.lm .cc2 b{font-size:16px;line-height:1.25}
.lm .cc2-p{font-size:13.5px;color:var(--mute)}
.lm .cc2-f{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:auto;font-size:12px;color:var(--mute)}
.lm .cc2-f i{font-style:normal;font-weight:800;font-size:11px;border-radius:6px;padding:1px 6px;background:color-mix(in srgb,var(--k) 22%,#fff);color:#2A2350}
@media(max-width:1000px){.lm .hgA,.lm .hgC{grid-template-columns:1fr}
.lm .st5{grid-template-columns:repeat(3,1fr)}
.lm .cgrid{grid-template-columns:1fr 1fr}
.lm .tmap{height:520px}}
@media(max-width:640px){.lm .sky{grid-template-columns:repeat(6,1fr);gap:8px}
.lm .cgrid{grid-template-columns:1fr}
.lm .tmap{height:640px}
.lm .tm b{font-size:12px}
.lm .tm small{display:none}
.lm .mapB{overflow-x:auto}
.lm .flow{min-width:760px}}
.pm{--ind:#3B2E8C;--navy:#150F3D;--lime:#B8D14A;--ink:#1B1830;--mute:#5E5A78;--line:#E4E2EE}
.pm *{box-sizing:border-box}
.pm{margin:0;font:16px/1.5 "Inter",system-ui,-apple-system,Segoe UI,sans-serif;color:var(--ink);background:#F7F6FB}
.pm .wrap{max-width:1240px;margin:0 auto;padding:0 16px}
.pm .mx-hero{background:radial-gradient(900px 500px at 85% 0%,#2E2470,transparent 60%),var(--navy);color:#fff;padding:52px 0 48px}
.pm .kick{font-size:12.5px;font-weight:800;letter-spacing:.12em;text-transform:uppercase;color:var(--lime);margin:0}
.pm .mx-hero h1{font-size:clamp(32px,4vw,48px);line-height:1.06;letter-spacing:-.03em;margin:8px 0 14px;max-width:20ch}
.pm .lead{color:#D2CDEF;font-size:17px;max-width:62ch;margin:0}
.pm .st4{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;margin-top:20px;max-width:560px}
.pm .st4 div{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);border-radius:12px;padding:10px 12px}
.pm .st4 b{display:block;font-size:24px;line-height:1.1}
.pm .st4 span{font-size:11.5px;color:#C9C4E6;font-weight:600}
.pm .st4 .li b{color:var(--lime)}
.pm .srch{display:flex;gap:8px;margin-top:18px;max-width:620px}
.pm .srch input{flex:1;padding:12px 14px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;font:inherit}
.pm .srch button{background:var(--lime);border:0;border-radius:10px;padding:0 18px;font:700 15px inherit;font-family:inherit;color:var(--navy)}
.pm .hgP{display:grid;grid-template-columns:minmax(0,1fr) 260px;gap:30px;align-items:end}
.pm .pt-side{background:rgba(184,209,74,.1);border:1px solid rgba(184,209,74,.35);border-radius:16px;padding:18px}
.pm .pt-side b{font-size:48px;color:var(--lime);display:block;line-height:1}
.pm .pt-side span{font-size:13.5px;color:#D2CDEF}
.pm .land{margin-top:28px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12);border-radius:20px;padding:20px;overflow-x:auto}
.pm .land-h b{display:block;font-size:15px}
.pm .land-h span{font-size:13px;color:#C9C4E6}
.pm /* A periodic table */
.ptab{display:grid;grid-template-columns:110px repeat(6,minmax(130px,1fr));gap:6px;margin-top:16px;min-width:900px}
.pm .pt-h{display:flex;gap:6px;align-items:center;font-size:12.5px;font-weight:700;color:var(--c);padding:4px 6px;border-bottom:2px solid var(--c)}
.pm .pt-h:first-child{border:0}
.pm .pt-l{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:#B5AFDB;display:flex;align-items:center}
.pm .pt-c{display:flex;flex-wrap:wrap;gap:5px;align-content:flex-start;background:rgba(255,255,255,.03);border-radius:10px;padding:5px;min-height:62px}
.pm .el{position:relative;display:flex;flex-direction:column;justify-content:space-between;width:calc(50% - 3px);min-height:56px;padding:6px 7px;border-radius:8px;text-decoration:none;color:#fff;background:linear-gradient(150deg,color-mix(in srgb,var(--c) 55%,#231C5C),color-mix(in srgb,var(--c) 22%,#150F3D));border:1px solid color-mix(in srgb,var(--c) 60%,transparent);transition:transform .15s,opacity .2s}
.pm .el b{font-size:13px;line-height:1.1}
.pm .el small{font-size:9.5px;opacity:.8}
.pm .el i{position:absolute;top:6px;right:6px;width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.35)}
.pm .el.full i{background:var(--lime);box-shadow:0 0 8px var(--lime)}
.pm .el.held{opacity:.55}
.pm .el.held i{background:#F59E0B}
.pm .el:hover{transform:scale(1.06);z-index:2}
.pm .dim .el{opacity:.15}
.pm .dim .el.on{opacity:1;box-shadow:0 0 0 2px #fff}
.pm .ochips{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}
.pm .oc{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.18);color:#E7E4F8;border-radius:99px;padding:4px 10px;font:600 12.5px inherit;font-family:inherit;cursor:pointer}
.pm .oc i{font-style:normal;opacity:.7;margin-left:6px}
.pm .oc.on{background:var(--lime);color:var(--navy)}
.pm .legend{display:flex;gap:16px;flex-wrap:wrap;margin-top:12px;font-size:12px;color:#C9C4E6}
.pm .legend i{display:inline-block;width:9px;height:9px;border-radius:50%;margin-right:6px;background:rgba(255,255,255,.35)}
.pm .legend .full{background:var(--lime)}
.pm .legend .held{background:#F59E0B}
.pm /* B ladders */
.lads{display:grid;grid-template-columns:repeat(6,minmax(150px,1fr));gap:12px;margin-top:16px;min-width:960px}
.pm .ld{background:linear-gradient(180deg,color-mix(in srgb,var(--c) 18%,transparent),transparent 40%);border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:12px}
.pm .ld-h{display:flex;flex-direction:column;gap:2px}
.pm .ld-i{width:40px;height:40px;border-radius:11px;display:grid;place-items:center;background:var(--c);color:#150F3D;margin-bottom:6px}
.pm .ld-h b{font-size:15px}
.pm .ld-h small{color:#B5AFDB;font-size:12px}
.pm .ld-b{position:relative;margin-top:12px;padding-left:16px}
.pm .ld-b:before{content:"";position:absolute;left:5px;top:6px;bottom:6px;width:3px;border-radius:3px;background:linear-gradient(180deg,var(--c),color-mix(in srgb,var(--c) 30%,transparent))}
.pm .rg{position:relative;padding:6px 0 10px}
.pm .rg:before{content:"";position:absolute;left:-15px;top:10px;width:9px;height:9px;border-radius:50%;background:#150F3D;border:2px solid var(--c)}
.pm .rg-l{font-size:10.5px;font-weight:800;letter-spacing:.08em;text-transform:uppercase;color:#B5AFDB}
.pm .rg-s{display:flex;flex-direction:column;gap:4px;margin-top:4px}
.pm .rg-s .empty{display:block;height:6px}
.pm .stn{display:block;padding:6px 8px;border-radius:8px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);text-decoration:none;color:#fff;border-left:3px solid var(--c)}
.pm .stn b{display:block;font-size:12.5px}
.pm .stn small{font-size:10.5px;color:#B5AFDB}
.pm .stn.full{border-left-color:var(--lime)}
.pm .stn.held{opacity:.55}
.pm .stn:hover{background:rgba(255,255,255,.14)}
.pm /* cards */
.list{padding:36px 0 60px}
.pm .fbar{display:flex;flex-wrap:wrap;gap:8px}
.pm .fp{display:inline-flex;gap:6px;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:99px;padding:7px 12px;font:600 13.5px inherit;font-family:inherit;color:var(--ink)}
.pm .fp svg{color:var(--c)}
.pm .fp i{font-style:normal;color:var(--mute);font-size:12px}
.pm .note{color:var(--mute);font-size:14px}
.pm .pgrid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.pm .pc{position:relative;overflow:hidden;display:flex;flex-direction:column;gap:6px;min-height:210px;padding:18px;border-radius:16px;text-decoration:none;color:#fff;background:linear-gradient(150deg,color-mix(in srgb,var(--c) 34%,#231C5C),#1C1650 72%);border:1px solid rgba(255,255,255,.1);transition:transform .2s,box-shadow .2s}
.pm .pc:hover{transform:translateY(-4px);box-shadow:0 18px 36px rgba(21,15,61,.35)}
.pm .pc-top{display:flex;justify-content:space-between;align-items:center}
.pm .pc-i{width:42px;height:42px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.12);color:var(--c);border:1px solid rgba(255,255,255,.18)}
.pm .pill{font-size:11px;font-weight:800;border-radius:99px;padding:3px 9px;background:rgba(255,255,255,.12)}
.pm .pill.full{background:var(--lime);color:#150F3D}
.pm .pill.held{background:#F59E0B;color:#150F3D}
.pm .pc b{font-size:22px;letter-spacing:-.01em;margin-top:6px}
.pm .pc-o{font-size:12.5px;color:color-mix(in srgb,var(--c) 45%,#fff);font-weight:700}
.pm .pc-d{font-size:14px;color:#DCD8F4}
.pm .pc-f{display:flex;justify-content:space-between;margin-top:auto;font-size:12.5px;color:#B5AFDB;position:relative}
.pm .pc-f span{color:var(--lime);font-weight:700}
.pm .pc-wm{position:absolute;right:-24px;bottom:-26px;color:var(--c);opacity:.12;pointer-events:none}
@media(max-width:1000px){.pm .hgP{grid-template-columns:1fr}
.pm .pgrid{grid-template-columns:1fr 1fr}}
@media(max-width:640px){.pm .pgrid{grid-template-columns:1fr}
.pm .st4{grid-template-columns:1fr 1fr}}

.lm,.pm{background:#F7F6FB}
.lm .mx-hero h1,.pm .mx-hero h1{color:#fff}
.lm .micro{padding:44px 0 8px}.lm .micro h2{margin:0;font-size:26px}.lm .micro .lead2{color:var(--mute);margin:4px 0 0}
.lm .mgrid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;margin-top:16px}
.lm .mcard{display:flex;gap:10px;background:#fff;border:1px solid var(--line);border-radius:12px;padding:12px;text-decoration:none;color:var(--ink);transition:transform .15s,border-color .15s}
.lm .mcard:hover{transform:translateY(-2px);border-color:var(--ind)}.lm .mcard img{width:30px;height:30px;border-radius:8px;flex:0 0 30px}.lm .mcard b{display:block;font-size:14px;line-height:1.25}.lm .mcard small{font-size:11.5px;color:var(--mute)}
.lm .inc{display:inline-block;font-size:11px;font-weight:800;border-radius:99px;padding:2px 9px;background:#EEF5D2;color:#4D6410;vertical-align:middle;margin-left:8px}
.lm .dsec{scroll-margin-top:90px}
@media(max-width:1000px){.lm .mgrid{grid-template-columns:1fr 1fr}}@media(max-width:640px){.lm .mgrid{grid-template-columns:1fr}}
.pm .fbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.pm .fbar .lbl{font-size:12px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;color:var(--mute);margin-right:4px}
.pm .fp{text-decoration:none;cursor:pointer}.pm .fp.on{background:var(--ind);border-color:var(--ind);color:#fff}.pm .fp.on svg,.pm .fp.on i{color:#fff}
.pm .frow{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-top:10px}
.pm details.own{margin-top:10px}.pm details.own summary{cursor:pointer;font-size:13.5px;font-weight:700;color:var(--ind)}
.pm .clear{font-size:13.5px;font-weight:700;color:var(--ind)}
.pm .empty{background:#fff;border:1px solid var(--line);border-radius:14px;padding:20px}
.pm .fine{font-size:13px;color:var(--mute);margin-top:22px}
.pm .srch input::placeholder{color:#B5AFDB}
.pm .pt-h svg{width:18px;height:18px}.pm .fp svg{width:16px;height:16px}.pm .pc-i svg{width:22px;height:22px}.pm .pc-wm svg{width:120px;height:120px;stroke-width:1.2}
.pm .pc b{color:#fff}.pm .empty h3{margin-top:0}
.lm .st5 span,.pm .st4 span{display:block;line-height:1.3;margin-top:2px}
.pm .pm-list .note{margin:14px 0 16px;max-width:none}
