.site-page {
  margin: 0;
  color: #293f32;
  background: #f7f8f3;
  font-family: var(--font-ui);
  font-size: 16px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.site-page *, .site-page *::before, .site-page *::after { box-sizing: border-box; }
.site-page a { color: #2e4937; text-underline-offset: 4px; }
.site-page a:hover { color: #42693b; }
.site-page :focus-visible { outline: 3px solid #3d6b49; outline-offset: 4px; border-radius: 3px; }
.site-header, .site-navigation, .site-main, .site-footer {
  width: min(100% - 40px, 760px);
  margin-inline: auto;
  min-width: 0;
}
.site-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding-block: 24px 20px; }
.site-brand { display: inline-flex; align-items: center; gap: 10px; min-height: 44px; text-decoration: none; }
.site-brand img { flex: none; }
.site-brand span { font-family: var(--font-game); font-size: 24px; font-weight: 700; line-height: 1.4; }
.back-to-game { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; padding: 7px 12px; border: 1px solid #b9c6b4; border-radius: 8px; font-size: 14px; line-height: 1.5; text-align: center; text-decoration: none; }
.site-navigation { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px 16px; padding-block: 4px 16px; border-bottom: 1px solid #d8dfd1; }
.page-navigation, .language-navigation, .footer-navigation { display: flex; flex-wrap: wrap; align-items: center; min-width: 0; gap: 4px; }
.page-navigation a, .language-navigation a, .footer-navigation a { display: inline-flex; align-items: center; min-height: 44px; padding: 8px 10px; font-size: 14px; line-height: 1.5; text-decoration: none; border-radius: 6px; }
.page-navigation a[aria-current], .language-navigation a[aria-current] { color: #243e2a; background: #e5ecdf; font-weight: 650; }
.page-navigation a:hover, .language-navigation a:hover, .footer-navigation a:hover { background: #edf1e7; }
.language-navigation { gap: 0; }
.language-navigation a { font-size: 13px; }
.site-main { padding-block: 40px 32px; }
.document-heading { margin-bottom: 32px; }
.document-heading h1 { margin: 0 0 14px; font-family: var(--font-game); font-weight: 700; font-size: clamp(28px, 5vw, 36px); line-height: 1.4; letter-spacing: -.4px; }
.document-summary { margin: 0; color: #50634f; font-size: 17px; line-height: 1.8; }
.document-actions { display:flex; flex-wrap:wrap; gap:12px; margin-top:22px; }
.document-actions a { display:inline-flex; align-items:center; justify-content:center; min-height:46px; padding:9px 18px; border:1px solid #9eb09b; border-radius:8px; text-decoration:none; font-weight:650; }
.document-actions a:first-child { background:#2e4937; color:#fffefa; border-color:#2e4937; }
.document-actions a:first-child:hover { background:#42693b; }
.world-photo { margin:24px 0; }
.world-photo img { display:block; width:100%; height:auto; aspect-ratio:2; border:1px solid #d6dfce; border-radius:10px; background:#e5ecdf; }
.world-photo figcaption { margin-top:8px; color:#62745c; font-size:12px; }
.document-updated { margin: 14px 0 0; color: #62745c; font-size: 13px; }
.document-updated time { margin-inline-start: 8px; }
.document-contents { padding: 20px 24px; margin-bottom: 36px; background: #eef2e8; border-radius: 10px; }
.document-contents h2 { margin: 0 0 8px; font-size: 16px; }
.document-contents ol { margin: 0; padding-inline-start: 24px; }
.guide-contents ol { list-style:none; padding-inline-start:0; }
.document-contents a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 7px; font-size: 14px; line-height: 1.7; }
.document-section { margin-block: 32px; }
.document-section h2, .operator-card h2 { margin: 0 0 12px; font-size: 20px; line-height: 1.5; font-weight: 650; scroll-margin-top: 20px; }
.document-section p { margin: 0 0 14px; }
.build-walkthrough { margin-top:24px; }
.build-walkthrough > section { margin-top:28px; }
.build-walkthrough h3 { margin:0 0 10px; font-size:17px; line-height:1.6; }
.build-walkthrough .world-photo { margin-top:16px; }
.public-discoveries { margin-block:32px 40px; padding-bottom:28px; border-bottom:1px solid #d8dfd1; scroll-margin-top:20px; }
.public-discoveries h2 { margin:0 0 12px; font-size:20px; line-height:1.5; }
.public-discoveries > p { margin:0 0 16px; }
.public-place-list { display:grid; grid-template-columns:repeat(2, minmax(0, 1fr)); gap:12px; padding:0; margin:20px 0; list-style:none; }
.public-place-list li { min-width:0; }
.public-place-card { display:block; height:100%; padding:20px; border:1px solid #cbd7c3; border-radius:10px; background:#fffefa; text-decoration:none; }
.public-place-card:hover { border-color:#718d68; background:#eef2e8; }
.public-place-preview { margin:0 0 16px; padding:12px; border-radius:8px; background:#e8eee8; }
.public-place-canvas { display:block; width:min(100%, 192px); height:auto; aspect-ratio:96 / 70; margin-inline:auto; }
.public-place-canvas[hidden] { display:none; }
.public-place-preview-note { margin-top:8px; color:#50634f; font-size:12px; line-height:1.6; }
.public-place-card h3 { margin:0 0 8px; font-size:18px; }
.public-place-card p { margin:4px 0; font-size:14px; }
.public-discoveries .public-place-time { font-size:12px; color:#62745c; }
.public-place-visit { display:inline-block; margin-top:12px; font-size:14px; font-weight:650; text-decoration:underline; text-underline-offset:4px; }
.public-discoveries-note, .public-discoveries-status { padding:16px; background:#eef2e8; border-radius:8px; }
.document-section ul, .document-section ol { margin: 12px 0 0; padding-inline-start: 23px; }
.document-section li { padding-inline-start: 3px; margin-block: 9px; }
.document-section .document-links { list-style: none; padding: 0; margin-top: 10px; }
.document-links li { padding: 0; margin: 0; }
.document-links a { display: inline-flex; align-items: center; min-height: 44px; padding-block: 7px; }
.operator-card { margin-top: 40px; padding: 24px; border: 1px solid #d6dfce; border-radius: 10px; background: #fffefa; }
.operator-card p { margin: 0 0 14px; color: #50634f; font-size: 14px; }
.operator-card dl { margin: 0; }
.operator-card dl > div { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 16px; }
.operator-card dt { width: 64px; color: #62745c; font-size: 14px; }
.operator-card dd { min-width: 0; margin: 0; }
.operator-card dd a { display: inline-flex; align-items: center; min-height: 44px; }
.site-footer { padding-block: 20px max(28px, env(safe-area-inset-bottom)); border-top: 1px solid #d8dfd1; }
.footer-navigation a { padding-inline: 0 18px; font-size: 13px; }
.site-footer p { color: #62745c; font-size: 12px; margin: 12px 0 0; }
.skip-link { position: absolute; top: 8px; left: 12px; z-index: 1; padding: 10px 16px; border-radius: 6px; background: #fffefa; transform: translateY(-200%); }
.skip-link:focus { transform: translateY(0); }
@media (max-width: 480px) {
  .site-header, .site-navigation, .site-main, .site-footer { width: calc(100% - 32px); }
  .site-header { gap: 12px; padding-block: 16px 12px; }
  .site-brand { gap: 7px; }
  .site-brand span { font-size: 21px; }
  .site-brand img { width: 30px; height: 30px; }
  .back-to-game { flex-shrink: 0; max-width: none; padding-inline: 8px; font-size: 12px; white-space: nowrap; }
  .site-navigation { align-items: flex-start; }
  .page-navigation { gap: 0; }
  .page-navigation a { padding-inline: 9px; font-size: 13px; }
  .language-navigation { width: 100%; }
  .site-main { padding-top: 28px; }
  .document-heading { margin-bottom: 24px; }
  .document-summary { font-size: 16px; }
  .document-contents { padding: 16px 18px; }
  .document-section { margin-block: 28px; }
  .document-section h2, .operator-card h2 { font-size: 18px; }
  .public-place-list { grid-template-columns:1fr; }
  .public-discoveries h2 { font-size:18px; }
  .public-place-card { padding:18px; }
  .operator-card { padding: 20px 18px; }
  .operator-card dl > div { gap: 2px 8px; }
  .operator-card dt { width: 100%; }
}
