.cs-shortcuts {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .5rem;
  margin-bottom: .7rem;
}
.cs-shortcuts a {
  display: inline-flex;
  align-items: center;
  min-height: 44px;
  padding: .35rem .8rem;
  border: 1px solid #c5d0dd;
  border-radius: 2rem;
  color: #213758;
  font-size: .875rem;
  font-weight: 650;
}
.cs-situations { max-width: 68rem; margin: clamp(2rem, 5vw, 4rem) auto; }
.cs-situations h2 { margin-bottom: 1rem; font-size: clamp(1.6rem, 4vw, 2.45rem); }
.cs-panel { border-top: 1px solid #bdcad7; }
.cs-panel:last-child { border-bottom: 1px solid #bdcad7; }
.cs-panel summary {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: .75rem;
  min-height: 60px;
  padding: .8rem .45rem;
  cursor: pointer;
  color: #152946;
  font-size: clamp(1rem, 2.4vw, 1.3rem);
  font-weight: 720;
  list-style: none;
}
.cs-panel summary::-webkit-details-marker { display: none; }
.cs-panel summary::after {
  content: "";
  flex: 0 0 .52rem;
  height: .52rem;
  margin: 0 .35rem .25rem 0;
  border-right: 2px solid currentColor;
  border-bottom: 2px solid currentColor;
  transform: rotate(45deg);
}
.cs-panel[open] summary::after { transform: rotate(225deg); margin-block: .25rem 0; }
.cs-body { padding: 0 .5rem .8rem; scroll-margin-top: 5rem; }
.cs-body p { max-width: 65ch; margin: .15rem 0 .5rem; }
.cs-body ul { display: flex; flex-wrap: wrap; gap: .15rem 1.4rem; padding: 0; margin: 0; list-style: none; }
.cs-body a {
  display: inline-flex;
  align-items: center;
  gap: .2rem;
  min-height: 44px;
  color: #1943a4;
  font-weight: 650;
  text-decoration: underline;
  text-underline-offset: .2em;
}
.cs-body .cs-permalink { color: #53647b; font-size: .85rem; font-weight: 500; }
@media (max-width: 600px) {
  .cs-shortcuts { gap: .15rem .4rem; }
  .cs-shortcuts a { font-size: .8rem; padding: .25rem .65rem; }
  .cs-body ul { display: block; }
}