/* Shared section navigation for all capability-center pages. */
body.ability-page {
  --ability-rail-width: 195px;
  padding-left: var(--ability-rail-width);
}
body.ability-page .ability-rail {
  box-sizing: border-box;
  position: fixed;
  top: 74px;
  right: auto;
  bottom: 0;
  left: 0;
  z-index: 20;
  display: block;
  width: var(--ability-rail-width);
  height: auto;
  margin: 0;
  padding: 30px 18px;
  overflow-y: auto;
  overscroll-behavior: contain;
  border: 0;
  border-right: 1px solid #e3eaf4;
  border-radius: 0;
  background: #fff;
  color: #18304d;
  font-family: "Microsoft YaHei", "PingFang SC", sans-serif;
  font-size: 13px;
  line-height: 1.5;
}
body.ability-page .ability-rail h2 {
  margin: 0 10px 7px;
  padding: 0;
  color: #18304d;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: normal;
}
body.ability-page .ability-rail p {
  display: block;
  margin: 0 10px 27px;
  padding: 0;
  color: #91a0b3;
  font-size: 11px;
  font-weight: 400;
  line-height: 1.7;
  letter-spacing: normal;
}
body.ability-page .ability-rail a {
  box-sizing: border-box;
  display: block;
  min-height: 44px;
  margin: 0 0 7px;
  padding: 12px;
  border: 0;
  border-radius: 7px;
  background: transparent;
  color: #697d99;
  font-size: 13px;
  font-weight: 600;
  line-height: 20px;
  letter-spacing: normal;
  text-align: left;
  text-decoration: none;
}
body.ability-page .ability-rail a:hover { color: #285de5; background: #f6f8fc; }
body.ability-page .ability-rail a[aria-current="page"] { color: #285de5; background: #eef4ff; }
body.ability-page .ability-rail a:focus-visible { outline: 2px solid #2960e9; outline-offset: 2px; }
@media (max-width: 900px) {
  body.ability-page { padding-left: 0; }
  body.ability-page .ability-rail {
    position: relative;
    top: auto;
    right: auto;
    bottom: auto;
    left: auto;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: 8px;
    width: 100%;
    padding: 14px 20px;
    overflow: visible;
    border-right: 0;
    border-bottom: 1px solid #e3eaf4;
  }
  body.ability-page .ability-rail h2 { flex-basis: 100%; margin: 0; font-size: 16px; line-height: 24px; }
  body.ability-page .ability-rail p { display: none; }
  body.ability-page .ability-rail a { min-height: 44px; margin: 0; padding: 12px 10px; }
}
body.ability-page .ability-resource-heading{margin:24px 12px 10px;color:#8a98ab;font-size:11px;font-weight:600}body.ability-page .ability-resource-nav{display:flex;flex-direction:column;gap:0}body.ability-page .ability-resource-nav a{font-weight:500}body.ability-page .ability-resource-nav a[aria-current=page]{font-weight:700}@media(max-width:900px){body.ability-page .ability-resource-heading{width:100%;margin:8px 0 0}body.ability-page .ability-resource-nav{width:100%;flex-direction:row;flex-wrap:wrap;gap:8px}}
/* Override the original workshop.css nav margin/centering for this shared rail only. */
body.ability-page .ability-resource-nav{width:100%;margin:0;align-items:stretch;justify-content:flex-start}body.ability-page .ability-resource-nav a{width:100%;text-align:left}@media(max-width:900px){body.ability-page .ability-resource-nav a{width:auto}}