@import url("https://fonts.googleapis.com/css2?family=Kiwi+Maru:wght@300;400;500&display=swap");
*, *::before, *::after {
  box-sizing: border-box;
  margin: 0;
  padding: 0; }

html {
  scroll-behavior: smooth; }

body {
  max-width: 760px;
  margin-left: auto;
  margin-right: auto;
  font-family: "Kiwi Maru", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  font-size: 15px;
  line-height: 1.75;
  color: #333333;
  background-color: #ffffff;
  min-height: 100vh; }
  body div#wrapper {
    padding: 48px 24px 80px; }
    body div#wrapper header.site-header {
      margin-bottom: 48px;
      padding-bottom: 20px;
      border-bottom: 1px solid #e0e0e0;
      display: flex;
      align-items: baseline;
      gap: 24px;
      flex-wrap: wrap; }
      body div#wrapper header.site-header .site-title {
        font-size: 20px;
        font-weight: 500;
        letter-spacing: 0.02em; }
        body div#wrapper header.site-header .site-title a {
          color: #333333;
          text-decoration: none; }
          body div#wrapper header.site-header .site-title a:hover {
            color: #4caf82; }
      body div#wrapper header.site-header nav.site-nav {
        display: flex;
        gap: 16px;
        font-size: 13px;
        flex-wrap: wrap; }
        body div#wrapper header.site-header nav.site-nav a {
          color: #808080;
          text-decoration: none;
          padding: 2px 0;
          border-bottom: 1px solid transparent;
          transition: color 0.15s, border-color 0.15s; }
          body div#wrapper header.site-header nav.site-nav a:hover {
            color: #4caf82;
            border-bottom-color: #4caf82; }
    body div#wrapper article section.post, body div#wrapper article section.page {
      padding: 0; }
      body div#wrapper article section.post h1, body div#wrapper article section.page h1 {
        font-size: 22px;
        font-weight: 500;
        margin: 0 0 6px 0;
        padding: 0;
        line-height: 1.35; }
      body div#wrapper article section.post div.content, body div#wrapper article section.page div.content {
        padding: 0;
        font-size: 15px;
        line-height: 1.75; }
        body div#wrapper article section.post div.content h2, body div#wrapper article section.page div.content h2 {
          font-size: 14px;
          font-weight: 500;
          color: #4caf82;
          margin: 32px 0 10px; }
          body div#wrapper article section.post div.content h2 a, body div#wrapper article section.page div.content h2 a {
            color: #2e8b5a;
            text-decoration: underline; }
            body div#wrapper article section.post div.content h2 a:hover, body div#wrapper article section.page div.content h2 a:hover {
              color: #4caf82; }
        body div#wrapper article section.post div.content h3, body div#wrapper article section.page div.content h3 {
          font-size: 14px;
          font-weight: 500;
          color: #4caf82;
          margin: 32px 0 10px; }
          body div#wrapper article section.post div.content h3 a, body div#wrapper article section.page div.content h3 a {
            color: #2e8b5a;
            text-decoration: underline; }
            body div#wrapper article section.post div.content h3 a:hover, body div#wrapper article section.page div.content h3 a:hover {
              color: #4caf82; }
        body div#wrapper article section.post div.content ul, body div#wrapper article section.page div.content ul {
          padding-left: 20px;
          margin-bottom: 14px; }
          body div#wrapper article section.post div.content ul li, body div#wrapper article section.page div.content ul li {
            list-style-type: disc;
            margin-bottom: 6px; }
        body div#wrapper article section.post div.content a, body div#wrapper article section.page div.content a {
          color: #2e8b5a;
          text-decoration: underline;
          text-underline-offset: 3px; }
          body div#wrapper article section.post div.content a:hover, body div#wrapper article section.page div.content a:hover {
            color: #4caf82; }
        body div#wrapper article section.post div.content p, body div#wrapper article section.page div.content p {
          margin-bottom: 14px;
          padding: 0; }
        body div#wrapper article section.post div.content .lang-section > p:first-child,
        body div#wrapper article section.post div.content .lang-section > p:first-child strong, body div#wrapper article section.page div.content .lang-section > p:first-child,
        body div#wrapper article section.page div.content .lang-section > p:first-child strong {
          color: #808080;
          font-weight: 400; }
        body div#wrapper article section.post div.content code, body div#wrapper article section.page div.content code {
          padding: 2px 6px;
          background-color: #e8e8e8;
          border-radius: 4px;
          font-size: 13px; }
        body div#wrapper article section.post div.content blockquote, body div#wrapper article section.page div.content blockquote {
          margin: 16px 0;
          padding: 16px 20px;
          background-color: #e8e8e8;
          border-left: 3px solid #e0e0e0;
          border-radius: 4px; }
          body div#wrapper article section.post div.content blockquote p, body div#wrapper article section.page div.content blockquote p {
            font-style: italic; }
        body div#wrapper article section.post div.content img, body div#wrapper article section.page div.content img {
          display: block;
          margin-left: auto;
          margin-right: auto;
          max-width: 95%; }
        body div#wrapper article section.post div.content strong, body div#wrapper article section.page div.content strong {
          color: #333333;
          font-weight: 500; }
        body div#wrapper article section.post div.content em, body div#wrapper article section.page div.content em {
          color: #808080;
          font-style: italic; }
      body div#wrapper article section.post span.date, body div#wrapper article section.page span.date {
        margin: 0;
        font-size: 13px;
        color: #808080; }
    body div#wrapper nav#paginator {
      padding: 10px 0 40px 0;
      font-size: 13px; }
      body div#wrapper nav#paginator a {
        color: #2e8b5a;
        text-decoration: underline; }
        body div#wrapper nav#paginator a:hover {
          color: #4caf82; }
    body div#wrapper footer {
      margin-top: 64px;
      padding-top: 20px;
      border-top: 1px solid #e0e0e0;
      font-size: 12px;
      color: #808080;
      display: flex;
      justify-content: space-between;
      flex-wrap: wrap;
      gap: 8px; }
      body div#wrapper footer .footer-links a {
        color: #808080;
        text-decoration: none; }
        body div#wrapper footer .footer-links a:hover {
          color: #4caf82; }
    body div#wrapper a {
      color: #333333;
      text-decoration: none; }
      body div#wrapper a:hover {
        color: #4caf82; }

/* ---------- Language Switcher ---------- */
.lang-switcher {
  display: flex;
  gap: 8px;
  margin-bottom: 36px; }

.lang-btn {
  padding: 5px 14px;
  border-radius: 8px;
  border: 1px solid #e0e0e0;
  background: transparent;
  color: #808080;
  font-family: "Kiwi Maru", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
  font-size: 13px;
  cursor: pointer;
  transition: all 0.15s ease; }
  .lang-btn:hover {
    border-color: #4caf82;
    color: #4caf82; }
  .lang-btn.active {
    background: rgba(76, 175, 130, 0.12);
    color: #4caf82;
    border-color: #4caf82;
    font-weight: 500; }

.lang-section {
  display: block; }

.lang-section.hidden {
  display: none; }

@media (max-width: 600px) {
  body {
    font-size: 14px; }

  body div#wrapper {
    padding: 28px 16px 56px; } }