:root {
  --color-brand: #660066;
  --color-theme: #9c7f3d;
  --color-theme-hover: #7c5c2d;
  --color-text: #333;
  --color-muted: #666;
  --color-border: #d6d0c7;
  --color-surface: #f7f5f0;
  --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  --font-serif: "Yu Mincho", "Hiragino Mincho ProN", "MS Mincho", serif;
  --content-max: 1100px;
}

*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body {
  margin: 0;
  color: var(--color-text);
  background: #fff;
  font-family: var(--font-sans);
  font-size: 1rem !important;
  line-height: 1.8;
}
.gist p, #search-p { font-family: var(--font-sans) !important; font-size: 1rem !important; line-height: 1.8; }
#index-contents { width: min(calc(100% - 2rem), var(--content-max)) !important; margin-inline: auto !important; }
.page-section { width: min(calc(100% - 2rem), var(--content-max)); margin-inline: auto; }
#title, #subtitle { font-family: var(--font-sans) !important; }
#subtitle { border-left: 10px solid var(--color-brand) !important; padding: .75rem 1rem !important; font-size: 1.5rem !important; }
.gist h3, .gist h4 { font-family: var(--font-sans) !important; }
img { max-width: 100%; height: auto; }
a { color: var(--color-brand); }
a:hover, a:focus-visible { color: var(--color-theme-hover); }
a[style*="#CD619B"], a[style*="205, 97, 155"] { color: var(--color-brand) !important; }
.list-class a { font-size: .875rem !important; }
.site-main { min-height: 50vh; }
.site-container {
  width: min(calc(100% - 2rem), var(--content-max));
  margin-inline: auto;
}
.page-title, .section-title {
  border-left: 10px solid var(--color-brand);
  padding-left: 1rem;
  color: var(--color-text);
  font-family: var(--font-sans);
  font-weight: 600;
  line-height: 1.3;
}
.page-title { margin: 2rem 0; font-size: clamp(1.75rem, 3vw, 2.25rem); }
.section-title { margin: 2rem 0 1rem; font-size: clamp(1.25rem, 2vw, 1.75rem); }
.last-updated { color: var(--color-muted); font-size: .875rem; text-align: right; }
.header-fallback {
  width: min(calc(100% - 2rem), var(--content-max));
  margin: 1rem auto;
  padding: .75rem 1rem;
  border: 1px solid var(--color-border);
  background: var(--color-surface);
}
.header-fallback__list {
  display: flex;
  flex-wrap: wrap;
  gap: .25rem .75rem;
  margin: 0;
  padding: 0;
  list-style: none;
}
.header-fallback__list li { margin: 0; }
.header-fallback[hidden] { display: none !important; }
#footer { display: none !important; }
.site-back-to-top {
  position: fixed;
  right: 1rem;
  bottom: 1rem;
  z-index: 1001;
  display: flex;
  width: 4.375rem;
  height: 4.375rem;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  border-radius: 50%;
  background: var(--color-brand);
  color: #fff !important;
  opacity: .8;
  text-decoration: none;
  transition: opacity .2s ease, background-color .2s ease;
}
.site-back-to-top::before {
  content: "▲";
  font-size: 1.5rem;
  line-height: 1;
}
.site-back-to-top::after {
  content: "TOP";
  margin-top: .2rem;
  font-size: .75rem;
  line-height: 1;
}
.site-back-to-top:hover,
.site-back-to-top:focus-visible {
  background: var(--color-theme-hover);
  color: #fff !important;
  opacity: 1;
}
.site-back-to-top:focus-visible {
  outline: 3px solid var(--color-brand);
  outline-offset: 3px;
}

@media (max-width: 768px) {
  .site-container { width: min(calc(100% - 1.5rem), var(--content-max)); }
  .page-title { margin-block: 1.5rem; }
  .site-footer__copyright { text-align: left; }
}

@media (prefers-reduced-motion: reduce) {
  .site-back-to-top { transition: none; }
}
