html{scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}


/* Page */
.tc{--ink:#1c2733;--text:#3d4752;--muted:#6b7480;--rule:#dfe3e8;--wash:#f3f5f8;--bg:#fff;--navy:#1f3a5f;--teal:#2a8c83;--gold:#9a7413;--gold-bg:#fbf4dc;color:var(--text)}
.tc ul{list-style:none;margin:0;padding:0}
.tc li{margin:0}
.tc a{color:var(--navy);text-decoration:none;border-bottom:0}
.tc a:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.tc h2{font-size:1.7rem;line-height:1.2;color:var(--ink);margin:0;padding:0}
.tc-kicker{margin:0 0 .25rem;font:700 .78rem 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.14em;text-transform:uppercase;color:var(--teal)}

/* Area colours */
.a-cv{--ac:#1f3a5f}.a-ml{--ac:#2a9187}.a-pg{--ac:#4a7fb8}.a-sy{--ac:#b8901c}.a-rp{--ac:#7a6aa8}

/* Recognition */
.tc-hon{display:flex;align-items:center;gap:1rem;margin:1.75rem 0 0;padding:1rem 1.25rem;border-radius:12px;background:var(--gold-bg);border:1px solid rgba(184,144,28,.28)}
.tc-hon-i{flex:0 0 2.6rem;height:2.6rem;border-radius:50%;background:#b8901c;color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.15rem}
.tc-hon p{margin:0;line-height:1.45}
.tc-hon b{display:block;color:var(--ink);font-size:1.02rem}
.tc-hon p span{display:block;font-size:.88rem;color:var(--muted)}

/* Teaching areas */
.tc-areas{margin-top:2.75rem}
.tc-areas h2{margin-bottom:1rem}
.tc-bar{display:flex;gap:4px;height:12px;margin:0 0 1.25rem}
.tc-bar span{background:var(--ac);border-radius:6px}
.tc-arl{display:grid;grid-template-columns:repeat(auto-fit,minmax(14rem,1fr));gap:1rem}
.tc-ar{display:flex;gap:.9rem;align-items:flex-start;padding:1.1rem 1.1rem 1rem;border:1px solid var(--rule);border-radius:12px;background:linear-gradient(180deg,color-mix(in srgb,var(--ac) 7%,var(--bg)),var(--bg) 70%)}
.tc-ai{flex:0 0 2.5rem;height:2.5rem;border-radius:10px;background:var(--ac);color:#fff;display:flex;align-items:center;justify-content:center;font-size:1.05rem}
.tc-an{margin:0;font:400 .82rem 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.06em;text-transform:uppercase;color:var(--muted)}
.tc-an b{font-size:1.35rem;letter-spacing:0;color:var(--ac);margin-right:.2rem}
.tc-ar h3{margin:.15rem 0 .55rem;font:700 1rem/1.35 'PT Serif',Georgia,serif;color:var(--ink)}
.tc-au{margin:0;display:flex;flex-wrap:wrap;gap:.3rem}
.tc-au span{font:700 .72rem/1 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.03em;color:var(--ac);background:color-mix(in srgb,var(--ac) 10%,var(--bg));border-radius:4px;padding:.3rem .42rem}

/* Teaching history by role */
.tr-hist-h{margin-top:3.25rem}
.tr-chips{display:flex;flex-wrap:wrap;gap:.45rem;margin-top:1rem}
.tr-chip{display:inline-flex;align-items:center;gap:.45rem;font:700 .88rem/1 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.03em;color:var(--text);background:none;border:1px solid var(--rule);border-radius:999px;padding:.48rem .85rem;cursor:pointer}
.tr-chip i{width:.6rem;height:.6rem;border-radius:50%;background:var(--ac)}
.tr-chip:hover{border-color:var(--navy)}
.tr-chip.on{background:var(--navy);border-color:var(--navy);color:#fff}
.tr-chip.on[data-f]:not([data-f="all"]){background:var(--ac);border-color:var(--ac)}
.tr-chip.on i{background:#fff}
.tr-chip:focus-visible{outline:2px solid var(--teal);outline-offset:2px}
.tc [hidden]{display:none!important}
.tr-roles{position:relative;margin-top:1.75rem;padding-left:2.25rem}
.tr-roles:before{content:"";position:absolute;left:.55rem;top:.6rem;bottom:1.5rem;width:2px;background:linear-gradient(180deg,var(--k-cur,#3fb8ad),var(--rule) 30%)}
.tr-role{position:relative;padding:0 0 2.5rem}
.tr-node{position:absolute;left:-2.25rem;top:.35rem;width:1.15rem;height:1.15rem;border-radius:50%;background:var(--bg);border:3px solid var(--navy)}
.tr-role.is-current .tr-node{border-color:#2e7d4f;box-shadow:0 0 0 4px color-mix(in srgb,#2e7d4f 18%,transparent)}
.tr-rh{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem;margin-bottom:1rem}
.tr-kick{margin:0 0 .2rem;font:700 .8rem 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.12em;text-transform:uppercase;color:var(--navy)}
.tr-role.is-current .tr-kick{color:#2e7d4f}
.tr-rh h2{font:700 1.4rem/1.25 'PT Serif',Georgia,serif;color:var(--ink);margin:0}
.tr-meta{margin:.35rem 0 0;font-size:.92rem;line-height:1.5;color:var(--muted)}
.tr-cnt{flex:0 0 auto;margin:0;text-align:center;font:400 .72rem 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.08em;text-transform:uppercase;color:var(--muted);padding:.45rem .7rem;border:1px solid var(--rule);border-radius:10px}
.tr-cnt b{display:block;font-size:1.35rem;letter-spacing:0;color:var(--navy);line-height:1.1}
.tr-units{display:grid;grid-template-columns:repeat(auto-fill,minmax(15.5rem,1fr));gap:.85rem}
.tr-u{display:flex;flex-direction:column;padding:.85rem 1rem .9rem;border:1px solid var(--rule);border-top:3px solid var(--ac);border-radius:10px;background:var(--bg)}
.tr-top{display:flex;justify-content:space-between;align-items:center;gap:.5rem}
.tr-code{font:700 .9rem 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.04em;color:var(--ac)}
.tr-inst{font:700 .7rem 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.06em;color:var(--muted);background:var(--wash);border-radius:4px;padding:.2rem .45rem}
.tr-u h3{margin:.35rem 0 .25rem;font:700 1rem/1.35 'PT Serif',Georgia,serif;color:var(--ink)}
.tr-alt{margin:0 0 .25rem;font-size:.8rem;font-style:italic;color:var(--muted)}
.tr-terms{display:flex;flex-wrap:wrap;gap:.35rem;margin:auto 0 0;padding-top:.6rem}
.tr-terms span{font:700 .76rem/1 'PT Sans Narrow','Arial Narrow',sans-serif;letter-spacing:.03em;white-space:nowrap;color:var(--ac);background:color-mix(in srgb,var(--ac) 12%,var(--bg));border:1px solid color-mix(in srgb,var(--ac) 30%,transparent);border-radius:999px;padding:.32rem .65rem}
.tr-note{margin:.9rem 0 0;font-size:.9rem;font-style:italic;color:var(--muted)}
.tr-empty{margin:1rem 0 0;padding:1rem 1.25rem;background:var(--wash);border-radius:8px}

@media only screen and (max-width:37.5em){
  .tr-roles{padding-left:1.6rem}
  .tr-roles:before{left:.35rem}
  .tr-node{left:-1.6rem;width:1rem;height:1rem}
  .tr-rh h2{font-size:1.2rem}
  .tr-chips{flex-wrap:nowrap;overflow-x:auto;max-width:100%;padding-bottom:.25rem}
  .tr-chip{white-space:nowrap}
}