/* Learn: a black-and-white editorial identity (2026-11-03), loaded after site.css on Learn pages only
   (body[data-skin="learn"]). It changes presentation only: every page keeps its markup, wording and links.
   Black, white and neutral greys; strong type; fine lines; no colour accents, metallic effects or heavy shadows. */
body[data-skin="learn"]{
  --k:#000;--k2:#111;--w:#fff;--g0:#fafafa;--g1:#f3f3f2;--g2:#e4e4e2;--g3:#c9c9c7;--g5:#5f5f5f;--gd:#a6a6a6;--gl:#262626;
  --head:"Inter Tight","Figtree",system-ui,sans-serif;
  --ink:#000;--navy:#000;--mist:#f3f3f2;--line-l:#e4e4e2;--line-d:#262626;--mute-l:#5f5f5f;--mute-d:#a6a6a6;--paper:#fff;
  --mint:#fff;--mint-2:#fff;--mint-ink:#000;--tc:#000;
  background:#fff;color:#000;
}
:root[lang="ar"] body[data-skin="learn"]{--head:"IBM Plex Sans Arabic","Noto Sans Arabic",Tahoma,sans-serif}
body[data-skin="learn"] :focus-visible{outline:2px solid #000;outline-offset:3px}
body[data-skin="learn"] .lx-hero :focus-visible,body[data-skin="learn"] .lx-lh :focus-visible,body[data-skin="learn"] .ex :focus-visible,
body[data-skin="learn"] footer :focus-visible,body[data-skin="learn"] .final :focus-visible,body[data-skin="learn"] .ln-disc :focus-visible,body[data-skin="learn"] .pg-next:focus-visible{outline-color:#fff}

/* ---- header: white, the lockup with room around it, a separate Learn label ---- */
.lnav{position:sticky;top:0;z-index:40;background:#fff;border-bottom:1px solid var(--g2)}
.lnav-in{display:flex;align-items:center;gap:clamp(14px,2.4vw,32px);min-height:96px}
.lnav-logo{display:flex;align-items:center;padding-block:18px;flex:none}
.lnav-logo img{display:block;height:44px;width:auto}
.lnav-label{display:flex;align-items:center;align-self:stretch;padding-inline-start:clamp(14px,2.4vw,32px);border-inline-start:1px solid var(--g2);font:700 19px/1 var(--head);letter-spacing:-.01em;color:#000;text-decoration:none;min-height:44px}
:root[lang="ar"] .lnav-label{font-size:20px}
.lnav-links{display:flex;gap:4px 22px;align-items:center}
.lnav-links a{display:inline-flex;align-items:center;min-height:44px;color:var(--g5);font:500 15px var(--sans);text-decoration:none;border-bottom:1px solid transparent}
.lnav-links a:hover{color:#000;border-bottom-color:#000}
.lnav-r{display:flex;align-items:center;gap:10px;margin-inline-start:auto}
body[data-skin="learn"] .lnav .lang{color:#000;background:none;border:1px solid var(--g2);border-radius:999px;min-height:44px;padding:0 14px;font:500 15px var(--sans);cursor:pointer}
body[data-skin="learn"] .lnav .lang:hover{border-color:#000}
body[data-skin="learn"] .lsw-menu{background:#fff;border:1px solid var(--g2);box-shadow:0 16px 30px -18px rgba(0,0,0,.25);border-radius:4px}
body[data-skin="learn"] .lsw-menu button{color:#000;border-radius:2px}
body[data-skin="learn"] .lsw-menu button:hover{background:var(--g1)}
body[data-skin="learn"] .lsw-menu button[aria-current="true"]{color:#000}
.lnav-back{display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 16px;border-radius:999px;background:#000;color:#fff;font:600 14.5px var(--sans);text-decoration:none;white-space:nowrap}
.lnav-back:hover{background:#262626}
:root[dir="rtl"] .lnav-back .ic{transform:scaleX(-1)}
body[data-skin="learn"] .lnav .burger{display:none;border:1px solid var(--g2);background:#fff;border-radius:999px}
body[data-skin="learn"] .lnav .burger span{background:#000}
body[data-skin="learn"] .menu{background:#fff;color:#000;border-bottom:1px solid var(--g2)}
body[data-skin="learn"] .menu a{color:#000;border-color:var(--g2)}
body[data-skin="learn"] .menu .m-k{color:var(--g5)}
body[data-skin="learn"] .menu .btn{background:#000;color:#fff}
body[data-skin="learn"] .m-lang{border-color:var(--g2)}
body[data-skin="learn"] .m-lang button{color:#000;border-color:var(--g3)}
body[data-skin="learn"] .m-lang button[aria-current="true"]{border-color:#000;color:#000;font-weight:700}
body[data-skin="learn"] .m-lang .ic{color:var(--g5)}
@media (max-width:1100px){.lnav-links{display:none}}
@media (max-width:760px){
  .lnav-in{min-height:76px;gap:12px}
  .lnav-logo img{height:34px}
  .lnav-label{font-size:16px;padding-inline-start:12px}
  .lnav-back{padding:0 12px}.lnav-back span{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  body[data-skin="learn"] .lnav .burger{display:inline-flex}
  body[data-skin="learn"] .lnav .lang{padding:0 10px}
}
@media (max-width:400px){.lnav-logo img{height:30px}.lnav-in{gap:10px}.lnav-label{padding-inline-start:10px}}

/* ---- type ---- */
body[data-skin="learn"] .lx-h1{font:800 clamp(44px,6vw,86px)/.98 var(--head);letter-spacing:-.04em;max-width:13ch}
body[data-skin="learn"] .lx-h1.sm{font-size:clamp(34px,4.4vw,60px);max-width:18ch;line-height:1.02}
:root[lang="ar"] body[data-skin="learn"] .lx-h1{font-weight:700;letter-spacing:0;line-height:1.28;font-size:clamp(36px,4.8vw,66px)}
:root[lang="ar"] body[data-skin="learn"] .lx-h1.sm{font-size:clamp(28px,3.4vw,46px);line-height:1.35}
:root[lang="fr"] body[data-skin="learn"] .lx-h1{font-size:clamp(38px,5.2vw,76px);max-width:15ch}
body[data-skin="learn"] .lx-h1 em{color:inherit}
body[data-skin="learn"] .lx-h2{font:700 clamp(28px,3.2vw,44px)/1.06 var(--head);letter-spacing:-.03em}
:root[lang="ar"] body[data-skin="learn"] .lx-h2{letter-spacing:0;line-height:1.35;font-size:clamp(24px,2.6vw,36px)}
body[data-skin="learn"] .lx-sec-head>p,body[data-skin="learn"] .lx-band-head p{color:var(--g5)}
body[data-skin="learn"] .lx-eyebrow{color:#000;font-weight:600}
body[data-skin="learn"] .lx-lead{color:#cfcfcd}
body[data-skin="learn"] .ic{color:currentColor}

/* ---- hero: black, white type, white line artwork ---- */
body[data-skin="learn"] .lx-hero,body[data-skin="learn"] .lx-hero.sub,body[data-skin="learn"] .lx-lh{background:#000;color:#fff}
body[data-skin="learn"] .lx-hero-in{padding-block:clamp(56px,7vw,112px) clamp(56px,6vw,96px)}
body[data-skin="learn"] .lx-k{color:var(--gd);font:600 13px/1.4 var(--sans);letter-spacing:.12em;text-transform:uppercase}
:root[lang="ar"] body[data-skin="learn"] .lx-k{letter-spacing:0;font-size:15px}
body[data-skin="learn"] .lx-hero-art::after{display:none}
body[data-skin="learn"] .lx-hero-img{border-radius:0;box-shadow:none;-webkit-mask-image:none;mask-image:none;border:1px solid var(--gl)}
body[data-skin="learn"] .lx-search{border-radius:999px;background:transparent;border:1px solid #fff;backdrop-filter:none;-webkit-backdrop-filter:none}
body[data-skin="learn"] .lx-search:focus-within{border-color:#fff;background:#0d0d0d}
body[data-skin="learn"] .lx-search>.ic{color:var(--gd)}
body[data-skin="learn"] .lx-search input{color:#fff}
body[data-skin="learn"] .lx-search input::placeholder{color:#8f8f8f}
body[data-skin="learn"] .lx-search button{background:#fff;color:#000}
body[data-skin="learn"] .lx-search:has(input:focus-visible){outline-color:#fff}
body[data-skin="learn"] .btn{background:#000;color:#fff;border-radius:999px;box-shadow:none}
body[data-skin="learn"] .lx-hero .btn,body[data-skin="learn"] .final .btn,body[data-skin="learn"] .ex .btn{background:#fff;color:#000}
body[data-skin="learn"] .btn:hover{filter:none;opacity:.88}
body[data-skin="learn"] .btn.ghost{background:transparent;color:#fff;border:1px solid #fff}
body[data-skin="learn"] .btn.line{background:transparent;color:#000;border:1px solid #000}
body[data-skin="learn"] .btn.dark{background:#000;color:#fff}
body[data-skin="learn"] .btn.line-dark{background:transparent;color:#000;border:1px solid #000}
body[data-skin="learn"] .lx-cta-2{color:#fff;text-decoration:underline;text-underline-offset:6px}
body[data-skin="learn"] .lx-cta-2:hover{color:#fff;opacity:.75}
body[data-skin="learn"] .lx-stats{color:var(--gd);gap:10px 0;border-top:1px solid var(--gl);padding-top:18px;width:100%}
body[data-skin="learn"] .lx-stats li{padding-inline-end:22px;margin-inline-end:22px;border-inline-end:1px solid var(--gl)}
body[data-skin="learn"] .lx-stats li:last-child{border:0;margin:0;padding:0}
body[data-skin="learn"] .lx-stats .ic{color:#fff}
body[data-skin="learn"] .lx-stats b{color:#fff;font:700 20px var(--head)}

/* ---- topic navigation ---- */
.lx-topnav{background:#fff;border-bottom:1px solid var(--g2)}
.lx-topnav ul{list-style:none;margin:0;padding:0;display:flex;gap:0 28px;overflow-x:auto;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.lx-topnav a{display:flex;align-items:center;min-height:60px;white-space:nowrap;font:600 15px var(--sans);color:var(--g5);text-decoration:none;border-bottom:2px solid transparent;margin-bottom:-1px}
.lx-topnav a:hover,.lx-topnav a.on{color:#000;border-bottom-color:#000}

/* ---- start here: three featured cards and a compact list ---- */
body[data-skin="learn"] .lx-band{background:#fff;border:0}
body[data-skin="learn"] .lx-band>.in{padding-block:clamp(56px,7vw,104px)}
body[data-skin="learn"] .lx-start{gap:32px}
body[data-skin="learn"] .lx-band-head{align-items:end;justify-content:space-between;border-bottom:1px solid #000;padding-bottom:18px}
.lx-feat .lc-t{font-size:clamp(21px,1.9vw,26px)}
body[data-skin="learn"] .sh-list{grid-template-columns:repeat(2,minmax(0,1fr));gap:0 40px}
body[data-skin="learn"] .sh-list li{border-top:1px solid var(--g2)}
body[data-skin="learn"] .sh-step{border:0;border-radius:0;background:none;padding:16px 0;align-items:center}
body[data-skin="learn"] .sh-step:hover{background:none}
body[data-skin="learn"] .sh-step:hover b{text-decoration:underline;text-underline-offset:4px}
body[data-skin="learn"] .sh-n{background:none;border:1px solid #000;color:#000;width:30px;height:30px;font:700 13px var(--head)}
body[data-skin="learn"] .is-done .sh-n{background:#000;color:#fff}
body[data-skin="learn"] .sh-b b{font:600 16.5px/1.35 var(--sans)}
body[data-skin="learn"] .sh-b small{color:var(--g5)}
body[data-skin="learn"] .sh-step .st{top:50%;transform:translateY(-50%)}
body[data-skin="learn"] .cont-item{border:1px solid var(--g2);border-radius:0;background:#fff;transform:none}
body[data-skin="learn"] .cont-item:hover{border-color:#000;transform:none}
body[data-skin="learn"] .cont-img{border-radius:0}
body[data-skin="learn"] .cont-b small{color:var(--g5)}
body[data-skin="learn"] .cont-item .go{color:#000}
body[data-skin="learn"] .lx-ring circle{stroke:var(--g2)}
body[data-skin="learn"] .lx-ring .ring-on{stroke:#000;stroke-linecap:butt}
body[data-skin="learn"] .lx-cont-n{color:var(--g5)}
body[data-skin="learn"] .lx-cont-n b{color:#000}
body[data-skin="learn"] .lx-cont-saved{color:#000}

/* ---- cards ---- */
body[data-skin="learn"] .lc{border:1px solid var(--g2);border-radius:0;background:#fff;color:#000;transition:border-color .2s}
body[data-skin="learn"] .lc:hover{transform:none;box-shadow:none;border-color:#000}
body[data-skin="learn"] .lc:hover .lc-t{text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:5px}
body[data-skin="learn"] .lc-art{aspect-ratio:4/3;background:var(--g1);border-bottom:1px solid var(--g2)}
body[data-skin="learn"] .lc-img{object-position:50% 50%}
body[data-skin="learn"] .lc-body{gap:10px;padding:20px 22px 24px}
body[data-skin="learn"] .lc-top small{color:var(--g5);font:600 12px var(--sans);letter-spacing:.1em;text-transform:uppercase}
:root[lang="ar"] body[data-skin="learn"] .lc-top small{letter-spacing:0;font-size:13.5px}
body[data-skin="learn"] .lc-t{font:700 20px/1.22 var(--head);letter-spacing:-.015em}
:root[lang="ar"] body[data-skin="learn"] .lc-t{letter-spacing:0;line-height:1.45}
body[data-skin="learn"] .lc-d{color:var(--g5)}
body[data-skin="learn"] .lc-meta{color:var(--g5);border-top:1px solid var(--g2);padding-top:12px;margin-top:6px}
body[data-skin="learn"] .lv,body[data-skin="learn"] .lc .lv-beginner,body[data-skin="learn"] .lc .lv-intermediate,body[data-skin="learn"] .lc .lv-advanced,
body[data-skin="learn"] .cm .lv-beginner,body[data-skin="learn"] .cm .lv-intermediate,body[data-skin="learn"] .cm .lv-advanced,
body[data-skin="learn"] .lv-beginner,body[data-skin="learn"] .lv-intermediate,body[data-skin="learn"] .lv-advanced{color:#000;border-color:#000;border-radius:2px}
body[data-skin="learn"] .lv-advanced{background:#000;color:#fff}
body[data-skin="learn"] .lx-lh .lv,body[data-skin="learn"] .lx-lh .lv-beginner,body[data-skin="learn"] .lx-lh .lv-intermediate{color:#fff;border-color:#fff}
body[data-skin="learn"] .lx-lh .lv-advanced{background:#fff;color:#000;border-color:#fff}
body[data-skin="learn"] .st-done,body[data-skin="learn"] .lc .st-done{color:#000;--tkf:#000;--tks:#fff}
body[data-skin="learn"] .st-saved,body[data-skin="learn"] .lc .st-saved{color:#000}
body[data-skin="learn"] .lc.ext{background:var(--g0);border-style:solid}
body[data-skin="learn"] .ext-k{background:#000;color:#fff;border-radius:2px}

/* ---- level paths: compact supporting lists ---- */
body[data-skin="learn"] .lx-paths{background:var(--g0);border-top:1px solid var(--g2)}
body[data-skin="learn"] .lx-path{border:1px solid var(--g2);border-radius:0;background:#fff}
body[data-skin="learn"] .lx-path-art{aspect-ratio:2/1;border-bottom:1px solid var(--g2)}
body[data-skin="learn"] .lx-path-art::after{display:none}
body[data-skin="learn"] .lx-path-img{transform:none}
body[data-skin="learn"] .lx-path:hover .lx-path-img{transform:none}
body[data-skin="learn"] .lx-path-b{padding:20px 24px 24px}
body[data-skin="learn"] .lx-path-h,body[data-skin="learn"] .lp-beginner .lx-path-h,body[data-skin="learn"] .lp-intermediate .lx-path-h,body[data-skin="learn"] .lp-advanced .lx-path-h{color:#000;font:700 26px/1.1 var(--head);letter-spacing:-.02em}
:root[lang="ar"] body[data-skin="learn"] .lx-path-h{letter-spacing:0;line-height:1.4;font-size:24px}
body[data-skin="learn"] .lp-beginner .lx-eyebrow,body[data-skin="learn"] .lp-intermediate .lx-eyebrow,body[data-skin="learn"] .lp-advanced .lx-eyebrow{color:var(--g5)}
body[data-skin="learn"] .lx-path-p,body[data-skin="learn"] .lx-path-meta,body[data-skin="learn"] .lx-pbar p{color:var(--g5)}
body[data-skin="learn"] .lx-path-meta b,body[data-skin="learn"] .lx-pbar b{color:#000}
body[data-skin="learn"] .ln-bar{background:var(--g2);border-radius:0;height:4px}
body[data-skin="learn"] .ln-bar i{background:#000;border-radius:0}
body[data-skin="learn"] .lx-pl a{border-top-color:var(--g2);color:#000}
body[data-skin="learn"] .lx-pl a:hover{color:#000;text-decoration:underline;text-underline-offset:4px}
body[data-skin="learn"] .pl-n{color:var(--g5)}
body[data-skin="learn"] .lx-pl .st{color:var(--g3)}
body[data-skin="learn"] .lx-pl .is-done .st{color:#000;--tkf:#000}
body[data-skin="learn"] .lx-syl{border-top-color:var(--g2)}
body[data-skin="learn"] .lx-syl summary{color:#000}
body[data-skin="learn"] .lx-syl summary em{color:var(--g5)}

/* ---- library ---- */
body[data-skin="learn"] .lx-lib{background:#fff;color:#000;border-top:1px solid var(--g2)}
body[data-skin="learn"] .tc{border-radius:0;border:1px solid var(--g2);transition:border-color .2s}
body[data-skin="learn"] .tc:hover{transform:none;box-shadow:none;border-color:#000}
body[data-skin="learn"] .tc.on{border-color:#000;box-shadow:inset 0 0 0 1px #000}
body[data-skin="learn"] .tc-art{background:var(--g1);border-bottom:1px solid var(--g2)}
body[data-skin="learn"] .tc-img{transform:none}
body[data-skin="learn"] .tc:hover .tc-img{transform:none}
body[data-skin="learn"] .tc-b small{color:var(--g5);font-family:var(--head)}
body[data-skin="learn"] .tc-b b{font:700 17px/1.25 var(--head)}
body[data-skin="learn"] .tc-b em{color:var(--g5)}
body[data-skin="learn"] .lf{border-radius:0;background:var(--g1);border:1px solid var(--g2)}
body[data-skin="learn"] .lf label{color:var(--g5)}
body[data-skin="learn"] .lf input[type=search],body[data-skin="learn"] .lf select{border-radius:0;border-color:var(--g3);color:#000}
body[data-skin="learn"] .lf input[type=search]:focus,body[data-skin="learn"] .lf select:focus{border-color:#000}
body[data-skin="learn"] .lf-chk input{accent-color:#000}
body[data-skin="learn"] .lf-chk:has(input:checked){--bmf:#000;color:#000}
body[data-skin="learn"] .lf-reset{color:#000}
body[data-skin="learn"] .lf-none{border-radius:0;background:var(--g1)}

/* ---- glossary preview, external reading, disclaimer, closing ---- */
body[data-skin="learn"] .lx-gp{background:var(--g1);color:#000;border-top:1px solid var(--g2)}
body[data-skin="learn"] .lx-links a{color:#000;text-decoration:underline;text-underline-offset:5px}
body[data-skin="learn"] .gp{border-radius:0;background:#fff;border:1px solid var(--g2)}
body[data-skin="learn"] .gp:hover{border-color:#000}
body[data-skin="learn"] .gp b{color:#000;font:700 19px/1.25 var(--head)}
body[data-skin="learn"] .gp-d{color:var(--g5)}
body[data-skin="learn"] .gp em{color:#000}
body[data-skin="learn"] .ln-ext{background:#fff;border-top:1px solid var(--g2)}
body[data-skin="learn"] .src{border-radius:0;background:#fff;border:1px solid var(--g2)}
body[data-skin="learn"] .src:hover{border-color:#000}
body[data-skin="learn"] .ln-disc{background:#000;color:#cfcfcd;border-top:1px solid var(--gl)}
body[data-skin="learn"] .final{background:#000;color:#fff;border-top:1px solid var(--gl)}
body[data-skin="learn"] .final .display{font:700 clamp(30px,3.6vw,50px)/1.06 var(--head);letter-spacing:-.03em;color:#fff}
:root[lang="ar"] body[data-skin="learn"] .final .display{letter-spacing:0;line-height:1.35}
body[data-skin="learn"] .final .lead{color:#cfcfcd}

/* ---- lesson header ---- */
body[data-skin="learn"] .rp i{background:#000}
body[data-skin="learn"] .lx-lh-in{padding-block:clamp(40px,5vw,80px)}
body[data-skin="learn"] .lx-lh-img{border-radius:0;box-shadow:none;-webkit-mask-image:none;mask-image:none;border:1px solid var(--gl)}
body[data-skin="learn"] .crumbs{color:#7a7a7a;font-size:14px}
body[data-skin="learn"] .crumbs a{color:#fff;text-decoration:underline;text-decoration-color:#5a5a5a;text-underline-offset:5px}
body[data-skin="learn"] .crumbs a:hover{text-decoration-color:#fff}
body[data-skin="learn"] .lx-paper .crumbs a,body[data-skin="learn"] .lx-art .crumbs a{color:#000}
body[data-skin="learn"] .lx-meta{color:var(--gd);border-top:1px solid var(--gl);padding-top:16px;width:100%}
body[data-skin="learn"] .lx-meta .ic{color:#fff}
body[data-skin="learn"] .sc,body[data-skin="learn"] .sc-egypt,body[data-skin="learn"] .sc-international,body[data-skin="learn"] .sc-mixed{background:none;border:1px solid #5a5a5a;color:#e5e5e5;border-radius:2px}
body[data-skin="learn"] .ln-tg{border-color:#fff;background:transparent;color:#fff}
body[data-skin="learn"] .ln-tg:hover{background:#1a1a1a;border-color:#fff}
body[data-skin="learn"] .ln-tg[aria-pressed="true"]{background:#fff;color:#000;border-color:#fff;--bmf:#000;--tkf:#000;--tks:#fff}

/* ---- reading column ---- */
body[data-skin="learn"] .lx-art{background:#fff;color:#000}
body[data-skin="learn"] .lx-grid{grid-template-columns:minmax(0,240px) minmax(0,1fr);padding-block:clamp(48px,6vw,88px)}
body[data-skin="learn"] .lx-toc{top:120px}
body[data-skin="learn"] .lx-toc-h,body[data-skin="learn"] .lx-toc-m summary{color:#000}
body[data-skin="learn"] .lx-toc ol,body[data-skin="learn"] .lx-toc-m ol{border-inline-start:1px solid var(--g2)}
body[data-skin="learn"] .lx-toc a,body[data-skin="learn"] .lx-toc-m a{color:var(--g5);margin-inline-start:-1px;border-inline-start-width:2px}
body[data-skin="learn"] .lx-toc a:hover{color:#000}
body[data-skin="learn"] .lx-toc a[aria-current="true"]{color:#000;border-inline-start-color:#000}
body[data-skin="learn"] .lx-toc-m{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .lx-body{max-width:68ch;font-size:18.5px;line-height:1.8;gap:26px}
:root[lang="ar"] body[data-skin="learn"] .lx-body{line-height:2}
body[data-skin="learn"] .lx-body .ln-h{font:700 clamp(24px,2.3vw,30px)/1.2 var(--head);letter-spacing:-.02em;margin-bottom:4px}
:root[lang="ar"] body[data-skin="learn"] .lx-body .ln-h{letter-spacing:0;line-height:1.5}
body[data-skin="learn"] .lx-sec{padding-top:6px}
body[data-skin="learn"] .lx-obj{border-radius:0;background:var(--g1);border:0;border-inline-start:3px solid #000}
body[data-skin="learn"] .lx-obj .lx-eyebrow,body[data-skin="learn"] .ex .lx-eyebrow,body[data-skin="learn"] .quiz-wrap .lx-eyebrow,body[data-skin="learn"] .calc .lx-eyebrow{color:#000}
body[data-skin="learn"] .lx-obj .obj{color:#000}
body[data-skin="learn"] .gt{text-decoration-color:#000}
body[data-skin="learn"] .gt:hover,body[data-skin="learn"] .gt[aria-expanded="true"]{background:var(--g1)}
body[data-skin="learn"] .gt-pop{background:#000;color:#e9e9e9;border-radius:2px;box-shadow:0 14px 28px -16px rgba(0,0,0,.45)}
body[data-skin="learn"] .gt-pop b,body[data-skin="learn"] .gt-pop a{color:#fff}
/* diagrams keep every shape and label; their fills move to a grey scale with distinct steps */
body[data-skin="learn"] .fig{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .fig figcaption{color:var(--g5)}
body[data-skin="learn"] .fig figcaption .ic{color:#000}
body[data-skin="learn"] .f-t{fill:#111}
body[data-skin="learn"] .f-m{fill:#5f5f5f}
body[data-skin="learn"] .f-w2{fill:#d9d9d9}
body[data-skin="learn"] .f-redt{fill:#111;font-style:italic}
body[data-skin="learn"] .f-mt{fill:#111;font-weight:700}
body[data-skin="learn"] .f-ax{stroke:#8a8a8a}
body[data-skin="learn"] .f-grid{stroke:#ececea}
body[data-skin="learn"] .f-navy{fill:#3c3c3c}
body[data-skin="learn"] .f-mint{fill:#111}
body[data-skin="learn"] .f-mintl{fill:#d6d6d4}
body[data-skin="learn"] .f-soft{fill:#ececea}
body[data-skin="learn"] .f-soft2{fill:#a9a9a7}
body[data-skin="learn"] .f-off{fill:#f6f6f5;stroke:#c9c9c7}
body[data-skin="learn"] .f-red{fill:#8c8c8a}
body[data-skin="learn"] .f-card{fill:#f6f6f5;stroke:#d6d6d4}
body[data-skin="learn"] .f-arc{stroke:#111}
body[data-skin="learn"] .f-line{stroke:#111}
body[data-skin="learn"] .f-line.real{stroke:#8c8c8a}
body[data-skin="learn"] .f-line.face{stroke:#b5b5b3}
body[data-skin="learn"] .f-dot{fill:#111}
body[data-skin="learn"] .f-dash{stroke:#5f5f5f}
body[data-skin="learn"] .f-dash.m{stroke:#111}
body[data-skin="learn"] .lg::before{background:#111}
body[data-skin="learn"] .lg.real::before{background:#8c8c8a}
body[data-skin="learn"] .lg.face::before{background:repeating-linear-gradient(90deg,#b5b5b3 0 4px,transparent 4px 7px)}
/* calculators */
body[data-skin="learn"] .calc{border-radius:0;background:var(--g1);border:1px solid var(--g2)}
body[data-skin="learn"] .cf label{color:#111}
body[data-skin="learn"] .cf input[type=range]{accent-color:#000}
body[data-skin="learn"] .cf input[type=number]{border-radius:0;border-color:var(--g3)}
body[data-skin="learn"] .cr{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .cr.big b{color:#000}
body[data-skin="learn"] .calc-msg{color:#000;font-weight:600}
body[data-skin="learn"] .calc-chart{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .ef-bar{background:var(--g2);border-radius:0}
body[data-skin="learn"] .ef-bar i{background:#000}
body[data-skin="learn"] .calc-note{color:var(--g5);border-top-color:var(--g2)}
/* worked example, risks, takeaways */
body[data-skin="learn"] .ex{border-radius:0;background:#000;color:#e9e9e9}
body[data-skin="learn"] .ex .lx-eyebrow{color:#fff}
body[data-skin="learn"] .ex .ln-h{color:#fff}
body[data-skin="learn"] .ex-tag{background:#1a1a1a;color:#e9e9e9;border-radius:0;border:1px solid #333}
body[data-skin="learn"] .ex-steps li::before{background:none;border:1px solid #fff;color:#fff}
body[data-skin="learn"] .ex-res{border-top-color:#333}
body[data-skin="learn"] .rm-c{border-radius:0}
body[data-skin="learn"] .risks,body[data-skin="learn"] .mist{background:#fff;border:1px solid var(--g2);border-top:3px solid #000}
body[data-skin="learn"] .mist{border-top-color:var(--g5)}
body[data-skin="learn"] .risks .rm-h,body[data-skin="learn"] .mist .rm-h,body[data-skin="learn"] .tk .rm-h{color:#000}
body[data-skin="learn"] .rm ul,body[data-skin="learn"] .tk ul{color:#111}
body[data-skin="learn"] .tk{border-radius:0;border-color:var(--g2);border-inline-start:3px solid #000}
body[data-skin="learn"] .tk li::marker{color:#000}
/* quiz */
body[data-skin="learn"] .quiz-wrap,body[data-skin="learn"] .srcs{border-top-color:#000}
body[data-skin="learn"] .qz{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .qz-n{background:#000}
body[data-skin="learn"] .opt{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .opt:hover{border-color:#000}
body[data-skin="learn"] .opt input{accent-color:#000}
body[data-skin="learn"] .opt:has(input:checked){border-color:#000;background:var(--g1)}
body[data-skin="learn"] .qz.missing{border-color:#000;box-shadow:0 0 0 3px rgba(0,0,0,.12)}
body[data-skin="learn"] .qz.right{border:2px solid #000;background:#fff}
body[data-skin="learn"] .qz.wrong{border:2px dashed #000;background:#fff}
body[data-skin="learn"] .opt.is-ans{border-color:#000;background:var(--g1);box-shadow:inset 0 0 0 1px #000;font-weight:600}
body[data-skin="learn"] .qz.wrong .opt:has(input:checked):not(.is-ans){border-color:#8c8c8a;background:#fff;text-decoration:line-through;text-decoration-color:#8c8c8a}
body[data-skin="learn"] .qz-fb{border-radius:0;background:var(--g1);color:#111}
body[data-skin="learn"] .right .qz-fb .ok-i,body[data-skin="learn"] .wrong .qz-fb .no-i,body[data-skin="learn"] .right .qz-fb .ok,body[data-skin="learn"] .wrong .qz-fb .no{color:#000;--tkf:#000;--tks:#fff}
/* sources, pager, related */
body[data-skin="learn"] .svr{border-radius:0;background:var(--g1)}
body[data-skin="learn"] .pg{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .pg:hover{border-color:#000;transform:none}
body[data-skin="learn"] .pg .ic{color:#000}
body[data-skin="learn"] .pg-next{background:#000;color:#fff;border-color:#000}
body[data-skin="learn"] .pg-next small{color:var(--gd)}
body[data-skin="learn"] .pg-next .ic{color:#fff}
body[data-skin="learn"] .lx-rel{background:var(--g1);border-top:1px solid var(--g2)}

/* ---- glossary and curriculum pages ---- */
body[data-skin="learn"] .lx-paper,body[data-skin="learn"] .ln-map{background:#fff}
body[data-skin="learn"] .gl{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .gl-d{color:#111}
body[data-skin="learn"] .gl-l{color:#000}
body[data-skin="learn"] .cm{border-radius:0;border-color:var(--g2)}
body[data-skin="learn"] .cm-img{border-radius:0;border:1px solid var(--g2)}
body[data-skin="learn"] .cm-head small{color:var(--g5)}
body[data-skin="learn"] .cm-lv a:hover{color:#000}
body[data-skin="learn"] .cm-lv .st{color:var(--g3)}
body[data-skin="learn"] .cm-lv .is-done .st{color:#000;--tkf:#000}
body[data-skin="learn"] .pl{background:var(--g1);color:var(--g5);border:1px solid var(--g2);border-radius:2px}
body[data-skin="learn"] .cm-start{border-inline-start:3px solid #000}
body[data-skin="learn"] .cm-route a{border-radius:0;background:var(--g1)}
body[data-skin="learn"] .cm-route .sh-n{background:#fff;border:1px solid #000}
body[data-skin="learn"] .cm-route .is-done .sh-n{background:#000;color:#fff}

/* ---- footer ---- */
body[data-skin="learn"] .rh-strip{background:#000;color:#8f8f8f;border-top:1px solid var(--gl)}
body[data-skin="learn"] .rh-strip a{color:#fff}
body[data-skin="learn"] footer{background:#000;border-top:1px solid var(--gl)}
body[data-skin="learn"] footer h2{color:#8f8f8f}
body[data-skin="learn"] footer a{color:#fff}
body[data-skin="learn"] footer .disc{color:#8f8f8f}
.lfoot-logo img{display:block;height:40px;width:auto}

/* ---- responsive ---- */
@media (max-width:980px){
  body[data-skin="learn"] .lx-hero-art{order:0;max-width:520px}
  body[data-skin="learn"] .lx-grid{grid-template-columns:minmax(0,1fr)}
}
@media (max-width:620px){
  body[data-skin="learn"] .lx-hero-art{margin-inline:0}
  body[data-skin="learn"] .lx-feat{grid-template-columns:minmax(0,1fr)}
  body[data-skin="learn"] .sh-list{grid-template-columns:minmax(0,1fr)}
  body[data-skin="learn"] .lx-stats li{padding-inline-end:14px;margin-inline-end:14px}
  body[data-skin="learn"] .lx-body{font-size:17.5px}
  .lx-topnav a{min-height:54px}
}
@media (min-width:621px) and (max-width:980px){body[data-skin="learn"] .lx-feat{grid-template-columns:repeat(3,minmax(0,1fr))}body[data-skin="learn"] .lx-feat .lc-d{display:none}}
/* path and curriculum ticks: outline until a lesson is read */
body[data-skin="learn"] .lx-pl .st,body[data-skin="learn"] .cm-lv .st{--tkf:none;--tks:currentColor;color:#8a8a8a}
body[data-skin="learn"] .lx-pl .is-done .st,body[data-skin="learn"] .cm-lv .is-done .st{--tkf:#000;--tks:#fff;color:#000}
@media (max-width:480px){
  .lnav-in{gap:8px}.lnav-logo img{height:26px}.lnav-label{font-size:15px;padding-inline-start:9px}
  .lnav-r{gap:6px}.lnav-back{width:44px;padding:0;justify-content:center}
  body[data-skin="learn"] .lnav .lang{padding:0 9px;gap:5px}
  body[data-skin="learn"] .lnav .lang>.ic:last-child{display:none}
  body[data-skin="learn"] .lnav .burger{width:44px;height:44px}
}
body[data-skin="learn"] .lc .lv-advanced,body[data-skin="learn"] .cm .lv-advanced,body[data-skin="learn"] .lv.lv-advanced{background:#000;color:#fff;border-color:#000}
body[data-skin="learn"] .lx-lh .lv.lv-advanced{background:#fff;color:#000;border-color:#fff}
body[data-skin="learn"] .lx-lh-img{filter:invert(1)}
@media (max-width:480px){
  .lnav-logo img{height:22px}
  body[data-skin="learn"] .lnav .lang>.ic{display:none}
  body[data-skin="learn"] .lnav .lang{min-width:44px;padding:0 8px;justify-content:center}
}
body[data-skin="learn"] .crumbs a{display:inline-flex;align-items:center;min-height:40px;min-width:24px;justify-content:center}
/* very narrow phones: the logo and "Back to Golden Way" already lead to the main site, so the site menu button steps aside */
@media (max-width:400px){body[data-skin="learn"] .lnav .burger{display:none}}
@media (max-width:340px){.lnav-logo img{height:20px}.lnav-label{font-size:14px;padding-inline-start:8px}}
