:root {
  --xi-ink: #173f3d;
  --xi-ink-deep: #0e302f;
  --xi-paper: #faf7ee;
  --xi-paper-2: #f3ecdd;
  --xi-line: #d9d8cc;
  --xi-accent: #c86b42;
  --xi-gold: #c79a43;
  --xi-white: #fffdf8;
}

html { scroll-behavior: smooth; background: var(--xi-paper); }
body {
  margin: 0 !important;
  background: var(--xi-paper) !important;
  color: var(--xi-ink-deep);
  font-family: system-ui, -apple-system, "Segoe UI", "Noto Sans JP", sans-serif !important;
  text-rendering: optimizeLegibility;
}

img { max-width: 100%; }
a:focus-visible,
button:focus-visible {
  outline: 3px solid var(--xi-gold) !important;
  outline-offset: 3px !important;
}

.xi-site-nav {
  box-sizing: border-box !important;
  display: flex !important;
  align-items: center !important;
  justify-content: space-between !important;
  gap: 22px !important;
  width: 100% !important;
  padding: 13px clamp(16px, 4vw, 58px) !important;
  border-bottom: 1px solid var(--xi-line) !important;
  background: rgba(250, 247, 238, .97) !important;
  color: var(--xi-ink) !important;
  font: 650 13px/1.2 system-ui, -apple-system, "Segoe UI", "Noto Sans JP", sans-serif !important;
  position: relative !important;
  z-index: 50 !important;
}
.xi-site-nav a { color: inherit !important; text-decoration: none !important; }
.xi-brand {
  display: grid !important;
  grid-template-columns: 34px auto !important;
  grid-template-rows: auto auto !important;
  column-gap: 9px !important;
  flex: 0 0 auto !important;
  gap: 2px !important;
  padding: 4px 0 !important;
  white-space: nowrap !important;
}
.xi-brand-logo { grid-row: 1 / 3 !important; width: 34px !important; height: 34px !important; color: var(--xi-accent) !important; }
.xi-brand-title { grid-column: 2 !important; font-size: 16px !important; font-weight: 850 !important; letter-spacing: .11em !important; }
.xi-brand-sub { grid-column: 2 !important; color: #6f7a70 !important; font-size: 9px !important; font-weight: 650 !important; letter-spacing: .16em !important; }
.xi-site-nav .xi-tabs {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: flex-end !important;
  gap: 3px !important;
  min-width: 0 !important;
}
.xi-site-nav .xi-tabs > a {
  display: grid !important;
  align-content: center !important;
  min-height: 39px !important;
  padding: 5px 10px !important;
  border-radius: 999px !important;
  text-align: center !important;
  white-space: nowrap !important;
}
.xi-site-nav .xi-tabs > a:hover { background: #ede8da !important; }
.xi-site-nav .xi-tabs > a[aria-current="page"] {
  background: var(--xi-ink) !important;
  color: var(--xi-white) !important;
}
.xi-site-nav .xi-tabs small { display: block !important; margin-top: 2px !important; font-size: 9px !important; font-weight: 500 !important; opacity: .78 !important; }
.xi-site-nav .xi-tabs .xi-nav-cta {
  margin-left: 5px !important;
  padding-inline: 14px !important;
  background: var(--xi-accent) !important;
  color: #fff !important;
}
.xi-site-nav .xi-tabs .xi-nav-cta:hover { background: #ad5736 !important; }

.xi-page-tools {
  box-sizing: border-box;
  display: flex;
  justify-content: flex-end;
  width: min(1120px, 92vw);
  margin: 12px auto -4px;
}
.xi-page-tools button {
  border: 1px solid var(--xi-line);
  border-radius: 999px;
  padding: 8px 14px;
  background: var(--xi-white);
  color: var(--xi-ink);
  font: 700 12px/1 system-ui, sans-serif;
  cursor: pointer;
}

.xi-feature-icon {
  display: block;
  width: 58px;
  height: 58px;
  color: var(--xi-ink);
}
.home-card .card-art,
.card .art {
  background: linear-gradient(145deg, #f1eadb, #e4e9df) !important;
  color: var(--xi-ink) !important;
}
.home-card:nth-child(2) .card-art,
.card:nth-child(3n+2) .art { background: linear-gradient(145deg, #e5ebe2, #d5e0d8) !important; }
.home-card:nth-child(3) .card-art,
.card:nth-child(3n) .art { background: linear-gradient(145deg, #f1e2d9, #ead1c2) !important; }
.home-card:nth-child(4) .card-art { background: linear-gradient(145deg, #e5e8e9, #d7dfe1) !important; }
.mark .xi-feature-icon { width: 44px; height: 44px; color: var(--xi-accent); }
.aside-copy > .xi-feature-icon { width: 46px; height: 46px; margin-bottom: 14px; color: #fff; }
.photo-status .xi-feature-icon { width: 46px; height: 46px; margin: 0 auto 8px; }

.hero-art img,
.outings-hero img,
.aside > img,
.hero > img,
.xi-status-hero img {
  border: 1px solid rgba(23, 63, 61, .16) !important;
  box-shadow: 0 18px 50px rgba(24, 50, 45, .12) !important;
}

.xi-site-footer {
  box-sizing: border-box !important;
  display: grid !important;
  grid-template-columns: minmax(220px, 1fr) auto !important;
  align-items: end !important;
  gap: 28px !important;
  margin: 56px 0 0 !important;
  padding: 30px clamp(18px, 5vw, 72px) !important;
  border-top: 1px solid var(--xi-line) !important;
  background: var(--xi-ink) !important;
  color: #f9f5ea !important;
  font: 500 13px/1.6 system-ui, -apple-system, "Segoe UI", "Noto Sans JP", sans-serif !important;
}
.xi-site-footer strong { display: block !important; margin-bottom: 2px !important; font-size: 18px !important; letter-spacing: .11em !important; }
.xi-site-footer p { margin: 0 !important; color: #dfe5dd !important; }
.xi-footer-links { display: flex !important; flex-wrap: wrap !important; justify-content: flex-end !important; gap: 8px 16px !important; }
.xi-site-footer a { color: #fff !important; text-decoration-color: #96b4ac !important; text-underline-offset: 4px !important; }

.xi-status-page {
  width: min(900px, 90vw);
  margin: 0 auto;
  padding: 54px 0 24px;
}
.xi-status-hero {
  display: grid;
  grid-template-columns: 1.05fr .95fr;
  gap: clamp(24px, 5vw, 58px);
  align-items: center;
}
.xi-status-hero img { display: block; width: 100%; height: auto; border-radius: 22px; border: 1px solid var(--xi-line); }
.xi-kicker { margin: 0 0 10px; color: var(--xi-accent); font-size: 12px; font-weight: 800; letter-spacing: .14em; }
.xi-status-page h1 { margin: 0 0 18px; color: var(--xi-ink); font-size: clamp(38px, 7vw, 68px); line-height: .98; letter-spacing: -.045em; }
.xi-status-page .lead { font-size: 17px; line-height: 1.8; }
.xi-status-actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 24px; }
.xi-status-actions a {
  display: inline-flex;
  align-items: center;
  min-height: 46px;
  padding: 0 18px;
  border-radius: 999px;
  background: var(--xi-ink);
  color: #fff;
  font-weight: 750;
  text-decoration: none;
}
.xi-status-actions a.secondary { border: 1px solid var(--xi-line); background: var(--xi-white); color: var(--xi-ink); }
.xi-status-note { margin-top: 30px; padding: 20px 22px; border: 1px solid var(--xi-line); border-radius: 16px; background: var(--xi-white); line-height: 1.75; }

@media (max-width: 980px) {
  .xi-site-nav { display: block !important; padding: 11px 14px 9px !important; }
  .xi-brand { display: inline-grid !important; }
  .xi-site-nav .xi-tabs { justify-content: flex-start !important; gap: 4px !important; margin-top: 8px !important; padding-bottom: 3px !important; overflow-x: auto !important; scrollbar-width: none !important; }
  .xi-site-nav .xi-tabs::-webkit-scrollbar { display: none !important; }
  .xi-site-nav .xi-tabs > a { min-height: 36px !important; padding: 4px 10px !important; }
  .xi-site-nav .xi-tabs .xi-nav-cta { margin-left: 2px !important; }
}

@media (max-width: 680px) {
  .xi-site-footer { grid-template-columns: 1fr !important; align-items: start !important; gap: 18px !important; margin-top: 40px !important; padding: 26px 18px !important; }
  .xi-footer-links { justify-content: flex-start !important; }
  .xi-status-page { padding-top: 34px; }
  .xi-status-hero { grid-template-columns: 1fr; }
  .xi-status-hero img { order: -1; }
}

@media (prefers-reduced-motion: reduce) {
  html { scroll-behavior: auto; }
  *, *::before, *::after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; animation-iteration-count: 1 !important; }
}
