:root {
  --color: #1f2328;
  --muted: #57606a;
  --link: #0969da;
  --border: #d0d7de;
  --bg: #ffffff;
  --surface: #f6f8fa;
}

[data-theme="dark"] {
  --color: #e6edf3;
  --muted: #7d8590;
  --link: #38bdf8;
  --border: #30363d;
  --bg: #0d1117;
  --surface: #161b22;
}

body { background: var(--bg); color: var(--color); }

#theme-toggle {
  position: fixed;
  top: 1rem;
  right: 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--color);
  padding: 0.4rem 0.7rem;
  border-radius: 6px;
  cursor: pointer;
  z-index: 100;
}

#to-top {
  position: fixed;
  bottom: 1.5rem;
  right: 1rem;
  background: var(--surface);
  border: 1px solid var(--border);
  color: var(--color);
  padding: 0.4rem 0.7rem;
  border-radius: 6px;
  cursor: pointer;
  z-index: 100;
}

#content {
  max-width: 800px;
  margin: 0 auto;
  padding: 2rem 1.5rem;
  font-family: system-ui, -apple-system, sans-serif;
  color: var(--color);
  line-height: 1.7;
}

/* Headings */
.lbs-heading-1 { font-size: 2em;   font-weight: 700; margin: 1.5em 0 0.5em; }
.lbs-heading-2 { font-size: 1.5em; font-weight: 600; margin: 2.5em 0 0.6em; border-bottom: 1px solid var(--border); padding-bottom: 0.3em; }
.lbs-heading-3 { font-size: 1.2em; font-weight: 600; margin: 1.3em 0 0.3em; }

/* Paragraph / Inline */
.lbs-paragraph { margin: 0.75em 0; }
.lbs-strong    { font-weight: 700; }

/* Image */
.lbs-image { max-width: 100%; height: auto; border-radius: 50%; }

/* Header */
.lbs-header {
  position: sticky;
  top: 0;
  z-index: 50;
  background: var(--bg);
  border-bottom: 1px solid var(--border);
  margin: -2rem -1.5rem 1.5rem;
  padding: 0.6rem 1.5rem;
}
.lbs-header .lbs-paragraph:first-child { margin: 0 0 0.3rem; font-size: 1.2em; font-weight: 700; letter-spacing: 0.05em; color: var(--color); }
.lbs-header .lbs-paragraph:not(:first-child) { margin: 0; font-size: 0.9em; font-weight: normal; }

/* Scroll offset for sticky header */
.lbs-heading-1,
.lbs-heading-2,
.lbs-heading-3 { scroll-margin-top: 60px; }

/* Link */
a { color: var(--link); }
a:hover { text-decoration: underline; }

/* HR */
.lbs-hr { border: none; border-top: 1px solid var(--border); margin: 2em 0; }

/* List */
.lbs-ul      { margin: 0.5em 0; padding-left: 1.8em; }
.lbs-list-item { margin: 0.2em 0; }

/* Silent table */
.lbs-table-silent { width: 100%; }
.lbs-table-silent thead { display: none; }
.lbs-table-silent th,
.lbs-table-silent td { border: none; background: none; vertical-align: middle; padding: 0 1.5rem 0 0; }
.lbs-table-silent td:last-child { padding-right: 0; }

/* Table */
.lbs-table:not(.lbs-table-silent) { border-collapse: collapse; margin: 1em 0; width: 100%; }
.lbs-table:not(.lbs-table-silent) th,
.lbs-table:not(.lbs-table-silent) td { padding: 0.5em 1em; border: 1px solid var(--border); }
.lbs-table:not(.lbs-table-silent) thead th { background: var(--surface); }
.lbs-table:not(.lbs-table-silent) td[rowspan] { background: var(--surface); white-space: nowrap; width: 1%; }

/* Details */
.lbs-details { margin: 1em 0; border: 1px solid var(--border); border-radius: 6px; padding: 0.5em 1em; background: var(--surface); }
.lbs-summary { cursor: pointer; font-weight: 600; }

/* Footer */
.lbs-footer { margin-top: 3rem; padding-top: 1rem; border-top: 1px solid var(--border); color: var(--muted); font-size: 0.9em; }

@media (max-width: 700px) {
  #content { font-size: 0.9em; }

  .lbs-table:not(.lbs-table-silent) td[rowspan] { white-space: normal; width: auto; }

  .lbs-table-silent,
  .lbs-table-silent tbody,
  .lbs-table-silent tr,
  .lbs-table-silent td { display: block; width: 100%; }
  .lbs-table-silent td { padding: 0; text-align: center; }

  .lbs-header { padding: 0.5rem 1rem; margin-bottom: 4rem; }
  .lbs-header .lbs-paragraph:first-child { font-size: 1em; }
  .lbs-header .lbs-paragraph:not(:first-child) { font-size: 0.75em; line-height: 1.6; }
  .lbs-header .lbs-paragraph:not(:first-child) a { white-space: nowrap; }
}
