:root {
  --warn: #ffad3b;
}

body {
  font-family: sans-serif;
  line-height: 1.5;
}

.back-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  font-size: 0.9em;
  text-decoration: underline;
}

.back-link:hover {
  color: var(--title-link);
  text-decoration: underline;
}

h1 {
  margin-bottom: 1.5rem;
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--border);
  color: var(--fg);
  font-size: 1.5rem;
  font-weight: 700;
}

dl {
  margin-top: 0;
}

dt {
  margin-top: 1.5rem;
  margin-bottom: 0.45rem;
  color: var(--title-link);
  font-size: 1.08em;
  font-weight: 600;
}

dt:first-of-type {
  margin-top: 0;
}

dt a:link,
dt a:visited {
  color: var(--title-link);
  text-decoration: none;
}

dt a:hover {
  color: var(--accent);
  text-decoration: underline;
}

.section-toggle {
  display: inline-flex;
  align-items: center;
  gap: 0.35rem;
  padding: 0;
  border: 0;
  color: var(--title-link);
  background: transparent;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.section-toggle:hover {
  color: var(--accent);
  text-decoration: underline;
}

.section-toggle:focus-visible {
  outline: 2px solid var(--accent);
  outline-offset: var(--focus-offset);
}

.section-toggle-icon {
  display: inline-block;
  transition: transform 120ms ease-out;
}

.section-toggle[aria-expanded="false"] .section-toggle-icon {
  transform: rotate(-90deg);
}

.browser-code-index[hidden] {
  display: none;
}

dd {
  margin-left: 0;
  margin-bottom: 1rem;
  padding: 0.1rem 0 0.1rem 1rem;
  border-left: 2px solid var(--border);
  color: var(--fg-muted);
}

.script-groups {
  margin-top: 0.75rem;
}

.script-group {
  margin: 0;
}

.script-group + .script-group {
  margin-top: 1.25rem;
}

.script-group h2 {
  margin: 0 0 0.65rem;
  color: var(--fg-soft);
  font-size: 1rem;
}

.script-list {
  margin: 0;
  padding: 0 0 0 0.3rem;
  list-style: none;
}

.script-list li + li {
  margin-top: 0.65rem;
}

.script-list a {
  font-weight: 600;
}

.script-list p {
  margin: 0.3rem 0 0 0.75rem;
}

.script-meta {
  color: var(--fg-soft);
  font-size: 0.85rem;
}

strong {
  color: var(--warn);
  font-weight: 700;
}

@media (prefers-reduced-motion: reduce) {
  .section-toggle-icon {
    transition: none;
  }
}