.lg-page { --acc: #f97316; --paper: #faf9f7; }

.lg-hero { padding: 150px 0 44px; background: var(--paper); border-bottom: 1px solid var(--line); }
.lg-hero .container { max-width: 1100px; }
.lg-tabs { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 34px; }
.lg-tabs a {
  padding: 9px 16px;
  font-size: 13.5px;
  font-weight: 600;
  color: var(--ink-soft);
  background: #fff;
  border: 1px solid var(--line);
  border-radius: var(--radius-pill);
  transition: color .2s, border-color .2s, background .2s;
}
.lg-tabs a:hover { color: var(--ink); border-color: rgba(15, 15, 40, .18); }
.lg-tabs a.is-on { color: #fff; background: var(--ink); border-color: var(--ink); }
.lg-hero h1 {
  margin: 0 0 12px;
  font-size: clamp(36px, 5vw, 64px);
  font-weight: 600;
  line-height: 1.05;
  letter-spacing: -.04em;
}
.lg-date { margin: 0; font-size: 14px; color: var(--muted); }

.lg-layout {
  display: grid;
  grid-template-columns: 240px minmax(0, 1fr);
  gap: 72px;
  max-width: 1100px;
  padding-top: 56px;
  padding-bottom: 110px;
}

.lg-toc { position: sticky; top: 110px; align-self: start; }
.lg-toc b { display: block; margin-bottom: 14px; font-size: 12.5px; font-weight: 600; color: var(--muted); }
.lg-toc ol { margin: 0; padding: 0; list-style: none; border-left: 1px solid var(--line); }
.lg-toc a {
  display: block;
  margin-left: -1px;
  padding: 7px 0 7px 16px;
  font-size: 13.5px;
  line-height: 1.4;
  color: var(--muted);
  border-left: 2px solid transparent;
  transition: color .2s, border-color .2s;
}
.lg-toc a:hover { color: var(--ink); }
.lg-toc a.is-on { color: var(--ink); font-weight: 600; border-color: var(--acc); }

.lg-doc { min-width: 0; font-size: 16px; line-height: 1.75; color: var(--ink-soft); }
.lg-doc .lg-lead { margin: 0 0 8px; font-size: 18px; line-height: 1.7; color: var(--ink); }
.lg-doc h2 {
  margin: 52px 0 16px;
  font-size: 22px;
  font-weight: 600;
  line-height: 1.3;
  letter-spacing: -.02em;
  color: var(--ink);
  scroll-margin-top: 110px;
}
.lg-doc p { margin: 0 0 16px; }
.lg-doc a { color: var(--ink); text-decoration: underline; text-decoration-color: rgba(249, 115, 22, .5); text-underline-offset: 3px; }
.lg-doc a:hover { text-decoration-color: var(--acc); }
.lg-doc strong { font-weight: 600; color: var(--ink); }
.lg-doc ul, .lg-doc ol { margin: 0 0 18px; padding: 0; list-style: none; }
.lg-doc li { position: relative; margin: 0 0 9px; padding-left: 22px; }
.lg-doc ul li::before {
  content: "";
  position: absolute;
  left: 4px;
  top: .72em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--acc);
}
.lg-doc ol.lg-rights { counter-reset: r; }
.lg-doc ol.lg-rights li { counter-increment: r; padding-left: 30px; }
.lg-doc ol.lg-rights li::before {
  content: counter(r, lower-alpha) ")";
  position: absolute;
  left: 0;
  font-weight: 600;
  color: var(--acc);
}
.lg-doc code { padding: 2px 6px; font-size: 13px; background: #f3f2ef; border-radius: 6px; }

.lg-card {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  margin: 20px 0 8px;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 18px;
  overflow: hidden;
}
.lg-card div { padding: 16px 20px; border-bottom: 1px solid var(--line); }
.lg-card div:nth-child(odd) { border-right: 1px solid var(--line); }
.lg-card div:nth-last-child(-n+2) { border-bottom: 0; }
.lg-card dt { font-size: 12.5px; color: var(--muted); }
.lg-card dd { margin: 2px 0 0; font-size: 15px; font-weight: 600; color: var(--ink); overflow-wrap: anywhere; }
.lg-card dd a { text-decoration: none; }
.lg-fill { color: #c2410c; font-weight: 500; }

.lg-table { margin: 20px 0 8px; border: 1px solid var(--line); border-radius: 18px; overflow: hidden; }
.lg-table table { width: 100%; border-collapse: collapse; font-size: 14.5px; line-height: 1.55; }
.lg-table th {
  padding: 13px 18px;
  font-size: 12.5px;
  font-weight: 600;
  text-align: left;
  color: var(--muted);
  background: var(--paper);
  border-bottom: 1px solid var(--line);
}
.lg-table td { padding: 14px 18px; vertical-align: top; border-bottom: 1px solid var(--line); }
.lg-table tr:last-child td { border-bottom: 0; }
.lg-table td:first-child { color: var(--ink); }

@media (max-width: 900px) {
  .lg-layout { grid-template-columns: minmax(0, 1fr); gap: 0; padding-top: 32px; }
  .lg-toc { display: none; }
}
@media (max-width: 640px) {
  .lg-hero { padding: 112px 0 30px; }
  .lg-tabs { gap: 6px; margin-bottom: 24px; }
  .lg-tabs a { padding: 8px 13px; font-size: 12.5px; }
  .lg-hero h1 { font-size: 34px; }
  .lg-layout { padding-bottom: 80px; }
  .lg-doc { font-size: 15px; }
  .lg-doc .lg-lead { font-size: 16px; }
  .lg-doc h2 { margin-top: 40px; font-size: 19px; }
  .lg-card { grid-template-columns: minmax(0, 1fr); }
  .lg-card div:nth-child(odd) { border-right: 0; }
  .lg-card div:nth-last-child(2) { border-bottom: 1px solid var(--line); }
  .lg-table { border: 0; border-radius: 0; overflow: visible; }
  .lg-table thead { display: none; }
  .lg-table table, .lg-table tbody, .lg-table tr, .lg-table td { display: block; width: 100%; }
  .lg-table tr { margin-bottom: 10px; padding: 14px 16px; border: 1px solid var(--line); border-radius: 14px; }
  .lg-table td { padding: 0; border: 0; }
  .lg-table td + td { margin-top: 6px; font-size: 13.5px; color: var(--muted); }
  .lg-table td[data-th]::before { content: attr(data-th) ": "; font-weight: 600; color: var(--ink-soft); }
}