.stratagem-inner {
  max-width: 1080px;
  margin-inline: auto;
}

.stratagem-lead {
  max-width: 70ch;
}

.stratagem-nav {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 250px), 1fr));
  gap: .6rem;
  margin: 1.5rem 0;
}

.stratagem-nav a {
  display: flex;
  align-items: center;
  min-height: 3rem;
  padding: .55rem .7rem;
  border: 1px solid var(--border-color);
  text-align: left;
}

.stratagem-nav a:hover,
.stratagem-nav a:focus-visible {
  background: var(--spoiler-header-hover);
}

.stratagem-search {
  display: grid;
  gap: .4rem;
  margin-bottom: 2rem;
  padding: .9rem;
  border: 1px solid var(--border-color);
  background: var(--table-row-alt);
}

.stratagem-search label {
  color: var(--heading-color);
  font-weight: bold;
}

.stratagem-search input {
  width: 100%;
  min-width: 0;
  min-height: 2.5rem;
  padding: .45rem .6rem;
  border: 1px solid var(--border-color);
  background: var(--bg-color);
  color: var(--text-color);
  font: inherit;
}

.stratagem-search p {
  margin: 0;
  font-size: .85em;
}

.stratagem-section {
  margin-top: 2.4rem;
  border-top: 1px solid var(--border-color);
}

.stratagem-section > h2 {
  margin-bottom: .8rem;
}

.stratagem-subsection {
  margin-top: 1.8rem;
}

.stratagem-section h4 {
  margin-top: 1.3rem;
}

.stratagem-section p,
.stratagem-section li {
  overflow-wrap: break-word;
}

.stratagem-section > p,
.stratagem-subsection > p,
.stratagem-card-body > p {
  margin: .6rem 0;
}

.stratagem-section ul,
.stratagem-card-body ul {
  margin: .6rem 0 .85rem 1.6rem;
}

.stratagem-card {
  margin: .65rem 0;
  border: 1px solid var(--border-color);
  background: var(--spoiler-content-bg);
  scroll-margin-top: 1rem;
}

.stratagem-card > summary {
  padding: .65rem .8rem;
  background: var(--spoiler-header-bg);
  color: var(--link-color);
  font-weight: bold;
  cursor: pointer;
}

.stratagem-card > summary:hover,
.stratagem-card > summary:focus-visible {
  background: var(--spoiler-header-hover);
}

.stratagem-card[open] > summary {
  border-bottom: 1px solid var(--border-color);
}

.stratagem-card:target {
  outline: 2px solid var(--link-color);
  outline-offset: 2px;
}

.stratagem-card-body {
  padding: .55rem .9rem .8rem;
}

.stratagem-card-body p {
  text-align: left;
}

.stratagem-table-caption {
  margin: 1.2rem 0 -.7rem !important;
  color: var(--heading-color);
  font-weight: bold;
}

.stratagem-table-wrap {
  max-width: 100%;
  overflow-x: auto;
  scrollbar-width: thin;
  scrollbar-color: var(--link-color) var(--table-header-bg);
}

.stratagem-table-wrap .stratagem-table {
  width: 100%;
  min-width: 570px;
  margin: 1rem 0;
  font-size: .82em;
}

.stratagem-table th {
  font-weight: bold;
}

body.stratagem-filtering .stratagem-table-caption,
body.stratagem-filtering .stratagem-table-wrap,
body.stratagem-filtering .stratagem-section > p,
body.stratagem-filtering .stratagem-section > ul,
body.stratagem-filtering .stratagem-section > h4,
body.stratagem-filtering .stratagem-subsection > p,
body.stratagem-filtering .stratagem-subsection > ul {
  display: none;
}

@media (max-width: 768px) {
  .stratagem-card-body {
    padding-inline: .7rem;
  }
}
