.hero {
  min-height: 58vh;
  display: grid;
  align-content: center;
  border-bottom: 1px solid #252525;
  padding-bottom: 58px;
}

/* Light archive theme: readable page-level components on the white site. */
.entry,
.layer,
.archive-status-grid article,
.private-entry {
  border-color: #d6d6d6 !important;
  background: #fff !important;
  color: #171717 !important;
}
.entry span,
.entry p,
.layer p,
.status,
.private-entry p,
.login-status { color: #666 !important; }
.entry:hover,
.layer:hover {
  border-color: #707070 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
.knowledge-card-grid { align-items: start; }
.knowledge-card {
  min-height: 0;
  height: auto;
  align-self: start;
  border-color: #cfcfcf !important;
  border-radius: 0;
  background: #fff !important;
  color: #171717 !important;
  padding: 24px;
  box-shadow: none !important;
}
.knowledge-card:hover,
.knowledge-card:focus-visible {
  border-color: #555 !important;
  background: #ffffff !important;
  box-shadow: none !important;
}
.knowledge-card-meta,
.knowledge-card footer { color: #666 !important; }
.knowledge-card h3 {
  margin-top: 24px;
  color: #171717 !important;
}
.knowledge-card > p { color: #4f4f4f !important; }
.knowledge-card footer {
  margin-top: 22px;
  padding-top: 0;
}
.knowledge-card-intro p,
.knowledge-card-intro a { color: #4f4f4f !important; }
.hero h1 {
  font-size: clamp(58px, 10vw, 132px);
  line-height: 0.96;
  letter-spacing: 0;
}
.section {
  margin-top: 96px;
}
.section-head {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 18px;
  border-bottom: 1px solid #252525;
  padding-bottom: 17px;
}
.section-head h2 {
  margin: 0;
  font-size: clamp(28px, 4vw, 48px);
}
.section-head p {
  margin: 0;
  color: #777;
}
.entry-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 32px;
}
.entry,
.layer {
  display: block;
  border: 1px solid #2a2a2a;
  background: #101010;
  color: #eee;
  text-decoration: none;
  transition:
    transform 0.18s ease,
    border-color 0.18s ease,
    box-shadow 0.18s ease,
    background 0.18s ease;
}
.entry {
  height: 136px;
  box-sizing: border-box;
  padding: 22px 24px;
}
.entry span {
  color: #777;
  font-size: 12px;
  letter-spacing: 0.7px;
}
.entry h3 {
  font-size: 23px;
  margin: 18px 0 7px;
}
.entry p,
.layer p,
.status {
  color: #999;
  line-height: 1.55;
}
.entry p {
  font-size: 13px;
  margin: 0;
}
.entry:hover,
.layer:hover {
  transform: translateY(-3px);
  border-color: #777;
  background: #121212;
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.32);
}
.architecture {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 24px;
  margin-top: 32px;
}
.layer {
  padding: 25px;
}
.layer b {
  display: block;
  font-size: 22px;
  margin-bottom: 10px;
}

.archive-status-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 24px;
  margin-top: 32px;
}

.knowledge-card-section {
  position: relative;
}

.knowledge-card-intro {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 28px;
  margin-top: 26px;
}

.knowledge-card-intro p {
  max-width: 760px;
  margin: 0;
  color: #929a95;
  font-size: 16px;
  line-height: 1.8;
}

.knowledge-card-intro a {
  flex: 0 0 auto;
  border-bottom: 1px solid #59665f;
  color: #c7cec9;
  padding: 6px 0;
  text-decoration: none;
}

.knowledge-card-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
  margin-top: 34px;
}

.knowledge-card {
  position: relative;
  display: flex;
  min-height: 240px;
  box-sizing: border-box;
  flex-direction: column;
  border: 1px solid #2d3831;
  border-radius: 18px;
  background:
    radial-gradient(circle at 88% 12%, rgba(111, 143, 124, 0.14), transparent 10rem),
    linear-gradient(150deg, #141815, #0f1110 68%);
  color: #edf0ee;
  padding: 24px;
  text-decoration: none;
  transition:
    transform 0.22s ease,
    border-color 0.22s ease,
    box-shadow 0.22s ease;
}

.knowledge-card:hover,
.knowledge-card:focus-visible {
  transform: translateY(-4px);
  border-color: #65776c;
  box-shadow: 0 20px 42px rgba(0, 0, 0, 0.3);
  outline: none;
}

.knowledge-card-meta {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  color: #75827a;
  font-size: 10px;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.knowledge-card h3 {
  margin: 34px 0 13px;
  color: #f1f4f2;
  font-size: clamp(21px, 2.3vw, 29px);
  line-height: 1.28;
}

.knowledge-card > p {
  margin: 0;
  color: #9da6a0;
  font-size: 14px;
  line-height: 1.75;
}

.knowledge-card footer {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-top: auto;
  padding-top: 24px;
  color: #69756e;
  font-size: 10px;
  letter-spacing: 0.08em;
}

.knowledge-card.is-guide {
  cursor: default;
}

.knowledge-card.is-guide:hover {
  transform: none;
  border-color: #2d3831;
  box-shadow: none;
}

.archive-status-grid article {
  min-height: 132px;
  border: 1px solid #2a2a2a;
  background: #101010;
  padding: 22px;
}

.archive-status-grid span {
  display: block;
  color: #777;
  font-size: 12px;
  letter-spacing: 0.8px;
}

.archive-status-grid strong {
  display: block;
  margin-top: 28px;
  color: #f1f1f1;
  font-size: clamp(19px, 1.8vw, 27px);
  font-weight: 650;
  line-height: 1.38;
  overflow-wrap: normal;
  word-break: keep-all;
}

.archive-timeline {
  margin-top: 32px;
  border-top: 1px solid #2a2a2a;
}

.archive-row {
  display: grid;
  grid-template-columns: 120px 82px minmax(0, 1fr);
  gap: 22px;
  align-items: baseline;
  border-bottom: 1px solid #2a2a2a;
  color: #eee;
  padding: 24px 0;
  text-decoration: none;
  transition:
    border-color 0.18s ease,
    transform 0.18s ease;
}

.archive-row:hover,
.archive-row:focus-visible {
  transform: translateX(4px);
  border-color: #777;
  outline: none;
}

.archive-row time {
  color: #777;
  font-size: 13px;
  letter-spacing: 0.8px;
  white-space: nowrap;
}

.archive-row span {
  color: #aaa;
  font-size: 13px;
}

.archive-row h3 {
  margin: 0;
  color: #f2f2f2;
  font-size: clamp(18px, 2.2vw, 27px);
  line-height: 1.35;
}

.archive-row p {
  grid-column: 3;
  margin: 6px 0 0;
  color: #888;
  font-size: 13px;
  line-height: 1.7;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}
.private-entry {
  border: 1px solid #292929;
  background: #0e0e0e;
  padding: 26px;
  margin-top: 32px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 22px;
}
.private-entry p {
  color: #999;
  margin: 7px 0 0;
  line-height: 1.7;
}
.private-login {
  display: flex;
  gap: 8px;
}
.private-login input {
  background: #080808;
  color: #eee;
  border: 1px solid #333;
  padding: 11px;
}
.button {
  border: 1px solid #383838;
  background: #151515;
  color: #ddd;
  padding: 11px 15px;
  white-space: nowrap;
  cursor: pointer;
}
.login-status {
  color: #aaa;
  margin-top: 8px;
}
@media (max-width: 1050px) {
  .knowledge-card-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
  .archive-status-grid {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 700px) {
  .hero {
    min-height: auto;
    padding: 40px 0 52px;
  }
  .section {
    margin-top: 68px;
  }
  .entry-grid,
  .architecture,
  .knowledge-card-grid,
  .archive-status-grid {
    grid-template-columns: 1fr;
    gap: 18px;
  }
  .archive-row {
    grid-template-columns: 1fr;
    gap: 8px;
    padding: 22px 0;
  }
  .archive-row p {
    grid-column: auto;
  }
  .private-entry,
  .section-head,
  .knowledge-card-intro,
  .private-login {
    align-items: stretch;
    flex-direction: column;
  }
  .entry,
  .archive-status-grid article {
    height: auto;
    min-height: 132px;
  }
  .entry h3 {
    margin-top: 16px;
  }
}

/* Final light-component cascade. */
.entry,.layer,.archive-status-grid article,.private-entry{border-color:#d6d6d6!important;background:#fff!important;color:#171717!important}
.entry span,.entry p,.layer p,.status,.private-entry p,.login-status{color:#666!important}
.entry:hover,.layer:hover{border-color:#707070!important;background:#fff!important;box-shadow:none!important}
.knowledge-card-grid{align-items:start}
.knowledge-card{min-height:0!important;height:auto!important;align-self:start;border-color:#cfcfcf!important;border-radius:0!important;background:#fff!important;color:#171717!important;box-shadow:none!important}
.knowledge-card:hover,.knowledge-card:focus-visible{border-color:#555!important;background:#fff!important;box-shadow:none!important}
.knowledge-card-meta,.knowledge-card footer{color:#666!important}
.knowledge-card h3{margin-top:24px;color:#171717!important}
.knowledge-card>p{color:#4f4f4f!important}
.knowledge-card footer{margin-top:22px;padding-top:0}
.knowledge-card-intro p,.knowledge-card-intro a{color:#4f4f4f!important}