/* ── sitemap page styles ── */
.sitemap-wrap {
  max-width: 960px;
  margin: 18px auto;
  padding: 0 12px;
  display: flex;
  flex-direction: column;
  gap: 20px;
}

.sitemap-header {
  text-align: center;
}

.sitemap-sub {
  font-size: 13px;
  opacity: 0.6;
  letter-spacing: 1px;
  margin-top: 4px;
  font-family: 'MS Gothic', 'ms gothic', monospace;
}

/* node grid */
.sitemap-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
}

.sitemap-node {
  position: relative;
  padding: 10px 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.node-title {
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1.5px;
  text-shadow: 0 0 8px var(--purple);
  font-family: 'MS Gothic', 'ms gothic', monospace;
  border-bottom: 1px dashed rgba(123,85,161,0.4);
  padding-bottom: 4px;
  margin-bottom: 2px;
}

.node-url {
  font-size: 10px;
  opacity: 0.6;
  font-family: 'MS Gothic', 'ms gothic', monospace;
  letter-spacing: 0.5px;
}

.node-url a {
  color: var(--purple-light) !important;
  text-decoration: none;
}

.node-url a:hover {
  color: #fff !important;
  text-decoration: underline;
}

.node-pages {
  list-style: none;
  font-size: 12px;
  line-height: 1.9;
  font-family: 'Bitter', Georgia, serif;
}

.node-pages li::before {
  content: "› ";
  opacity: 0.5;
}

/* status tags */
.node-tag {
  display: inline-block;
  font-size: 9px;
  letter-spacing: 1.5px;
  padding: 2px 5px;
  border: 1px solid;
  font-family: 'MS Gothic', 'ms gothic', monospace;
  margin-top: auto;
  align-self: flex-start;
}

.node-tag.wip {
  border-color: rgba(123,85,161,0.6);
  color: var(--purple-light);
  background: rgba(123,85,161,0.1);
}

.node-tag.planned {
  border-color: rgba(61, 32, 96, 0.8);
  color: var(--purple-mid);
  background: rgba(61, 32, 96, 0.2);
}

.node-tag.done {
  border-color: rgba(100, 200, 100, 0.4);
  color: #7ec87e;
  background: rgba(100, 200, 100, 0.05);
}

/* tree block */
.sitemap-tree-block {
  padding: 16px;
}

.sitemap-tree {
  font-family: 'MS Gothic', 'ms gothic', 'MS PGothic', monospace;
  font-size: 11px;
  line-height: 2;
  letter-spacing: 0.5px;
  white-space: pre;
  overflow-x: auto;
  color: var(--purple);
  text-shadow: 0 0 4px rgba(123,85,161,0.5);
  background: transparent;
  padding: 0;
  border: none;
}

@media (max-width: 780px) {
  .sitemap-grid {
    grid-template-columns: repeat(2, 1fr);
  }
}

@media (max-width: 480px) {
  .sitemap-grid {
    grid-template-columns: 1fr;
  }
}