/* layout.css - 1-column, continuous sheet, airy spacing */

/* Core layout */
.page {
  min-height: 100vh;
  background: var(--bg);
}

.flow {
  max-width: min(var(--maxw), var(--measure));
  margin: 0 auto;
  padding: var(--s4) var(--s2) var(--s5);
}

/* Top bar (minimal, scroll-away) */
.topbar {
  max-width: min(var(--maxw), var(--measure));
  margin: 0 auto;
  padding: var(--s3) var(--s2) var(--s2);
  text-align: center; /* center the text */
}

.topbar-left {
  display: flex;
  flex-direction: column;
  gap: var(--s-1);
  align-items: center; /* center the items horizontally */
}

.top-kicker {
  font-family: var(--font-ui);
  color: var(--muted);
  font-size: 0.95rem;
  letter-spacing: 0.02em;
}

.top-meta {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s0);
  align-items: baseline;
  color: var(--muted);
  font-size: 0.95rem;
}

.top-link {
  font-weight: 600;
}
.dot {
  color: var(--rule);
}

/* Continuous paper surface for content */

.parents {
  margin-bottom: var(--s3);
  padding-bottom: var(--s2);
  border-bottom: var(--rule-w) solid var(--rule);
}

.parents-title {
  font-weight: 700;
  margin-bottom: var(--s1);
  color: var(--muted);
}

.parents-links {
}

.parent-pill {
  display: block;
  /* Used in sizing properties */
  width: fit-content;
  height: fit-content;
  inline-size: fit-content;
  block-size: fit-content;
}
.parent-pill:hover {
  border-color: var(--accent);
}

.meta-line {
  margin: var(--s1) 0 var(--s3);
}
.meta-item {
  display: inline;
}
.meta-sep {
  color: var(--rule);
  padding: 0 6px;
}
.meta-link {
  font-weight: 600;
}

.body {
  margin: 0;
}

/* Child stack */
.child-stack {
  margin-top: var(--s4);
  padding-top: var(--s3);
  /* border-top: var(--rule-w) solid var(--rule); */
  display: grid;
  gap: var(--s4);
}

.child-block {
  padding-top: var(--s1);
}

.child-title-link {
  display: inline-block;
  font-family: var(--font-ui);
  font-weight: 750;
  font-size: var(--h3);
  margin-bottom: var(--s1);
  text-decoration: none;
  color: var(--ink);
}
.child-title-link:hover {
  color: var(--accent);
  text-decoration: underline;
}

.child-links {
  margin-top: var(--s2);
  padding-top: var(--s2);
  border-top: var(--rule-w) solid var(--rule);
}

.child-links-title {
  color: var(--muted);
  font-weight: 700;
  margin-bottom: var(--s0);
}

.child-links-list {
  margin: 0;
  padding-left: 1.25em;
  font-size: 1rem; /* same as body */
}

.empty-note {
  color: var(--muted);
  padding: var(--s2) 0;
}

.footer {
  margin-top: var(--s5);
  padding-top: var(--s3);
  border-top: var(--rule-w) solid var(--rule);
  color: var(--muted);
}

/* Panels (shared) */
.panel {
  padding: var(--s3);
}

.panel-title {
  font-size: var(--h3);
  margin-bottom: var(--s0);
}
.panel-sub {
  color: var(--muted);
  margin-bottom: var(--s2);
}

.panel-actions {
  display: flex;
  flex-wrap: wrap;
  gap: var(--s0);
  margin-top: var(--s2);
}

.sec-title {
  font-size: var(--h4);
  margin: var(--s3) 0 var(--s1);
}
#sign {
  width: 200px;
  border: 3px solid #80808022;
  margin: 20px auto 0 auto;
}