.footer-links, .info-inline-links {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: .4rem 1.25rem;
}
.footer-links a, .info-back {
  display: inline-flex;
  align-items: center;
  min-height: 30px;
  font-size: .86rem;
}
.footer-links a:hover, .info-back:hover, .footer-links [aria-current] {
  color: var(--ink);
  text-decoration: underline;
  text-underline-offset: .23em;
}
.guide-link, .info-prose a:not(.button), .info-feature-list a {
  color: var(--accent);
  text-decoration: underline;
  text-underline-offset: .2em;
}
.info-header-links {
  margin-inline-start: auto;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  align-items: center;
  gap: .4rem .8rem;
  color: var(--muted);
}
.info-back { color: var(--ink); font-weight: 600; margin-inline-end: .35rem; }
.info-header-links .language-control { margin: 0; }
.info-header-links .language-control select { min-height: 40px; font-size: .9rem; }
.info-header-links .icon-btn { min-width: 44px; min-height: 44px; }
.info-main { max-width: 76rem; margin-inline: auto; }
.info-reading { max-width: 78rem; }
.info-hero { padding-block: clamp(2.6rem, 7vw, 5rem) clamp(2.1rem, 5vw, 3.6rem); }
.info-reading .info-hero { padding-block: clamp(2.3rem, 5vw, 4.5rem) clamp(1.8rem, 4vw, 3rem); }
.info-hero .eyebrow, .info-example .eyebrow {
  font-size: .75rem;
  text-transform: uppercase;
  color: var(--green);
  margin: 0 0 .9rem;
}
.info-hero h1 {
  font-size: clamp(2.6rem, 6vw, 5.4rem);
  font-weight: 650;
  line-height: 1.03;
  letter-spacing: -.058em;
  margin: 0;
  text-wrap: balance;
}
.info-reading h1 { overflow-wrap: anywhere; hyphens: auto; }
.info-lede {
  max-width: 56ch;
  font-size: clamp(1.05rem, 1.65vw, 1.35rem);
  line-height: 1.65;
  color: var(--muted);
  margin: 1.25rem 0 0;
}
.info-reading .info-lede { max-width: 66ch; }
.info-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1.5rem; }
.info-actions .button { min-height: 42px; padding: .7rem 1rem; font-size: .92rem; }
.info-example {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  align-items: center;
  gap: clamp(1.5rem, 4.5vw, 4rem);
  padding: clamp(1.2rem, 4vw, 3rem);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.info-main h2 {
  font-size: clamp(1.35rem, 2.4vw, 2rem);
  line-height: 1.2;
  letter-spacing: -.035em;
  margin: 0 0 .7rem;
}
.info-example p:not(.eyebrow), .info-feature-list p { color: var(--muted); line-height: 1.65; margin: 0; }
.info-table table { border-collapse: collapse; width: 100%; text-align: left; font-variant-numeric: tabular-nums; }
.info-table caption { text-align: left; color: var(--muted); font-size: .85rem; margin-bottom: .4rem; }
.info-table th, .info-table td { padding: .55rem clamp(.25rem, 1.7vw, .9rem); border-bottom: 1px solid var(--line); }
.info-table th:first-child { padding-inline-start: 0; }
.info-table td:last-child, .info-table th:last-child { padding-inline-end: 0; }
.info-table thead th { font-size: .85rem; font-weight: 550; color: var(--muted); }
.info-table tbody th { font-weight: 600; }
.info-table time { display: block; font-size: 1.2rem; font-weight: 650; }
.info-kind { display: inline-block; margin-top: .18rem; padding: .16rem .42rem; border-radius: 4px; font-size: .77rem; }
.info-kind.work { background: var(--work); }
.info-kind.personal { background: var(--personal); }
.info-kind.night { background: var(--night); }
.info-feature-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 2.5rem;
  margin-block: clamp(2rem, 5vw, 4rem);
}
.info-feature-list > div { border-top: 1px solid var(--line); padding: 1.35rem 0; }
.info-feature-list a { display: inline-block; margin-top: .7rem; }
.info-source { padding-top: 1.5rem; border-top: 1px solid var(--line); }
.info-prose { font-size: 1.07rem; line-height: 1.68; max-width: 68ch; }
.info-prose p, .info-prose ol { margin: 0 0 .85rem; }
.info-prose h3 { font-size: 1.17rem; line-height: 1.35; margin: 1.45rem 0 .5rem; }
.info-prose ol { padding-inline-start: 1.45rem; }
.info-prose li + li { margin-top: .4rem; }
.info-prose kbd { font-size: .9em; padding: .08em .32em; border: 1px solid var(--line); background: var(--surface); border-radius: 4px; }
.guide-layout { display: grid; grid-template-columns: clamp(13rem, 19vw, 15rem) minmax(0, 1fr); gap: clamp(1.6rem, 4vw, 3.5rem); align-items: start; }
.guide-nav { position: sticky; top: 1.5rem; display: grid; padding: .95rem; background: var(--surface); border: 1px solid var(--line); border-radius: 12px; }
.guide-nav h2 { grid-column: 1 / -1; font-size: .94rem; font-weight: 650; letter-spacing: .015em; margin: .15rem .4rem .4rem; }
.guide-nav a { display: flex; align-items: center; min-height: 2.45rem; padding: .44rem .4rem; border-radius: 5px; line-height: 1.35; color: var(--muted); }
.guide-nav a:hover, .guide-nav a:focus-visible { background: var(--surface-2); }
.guide-nav a:hover { color: var(--accent); text-decoration: underline; }
.guide-layout .info-prose { max-width: none; min-width: 0; overflow-wrap: break-word; }
.guide-layout .info-prose > section > :where(p, ol, ul), .legal-sections > .info-note p { max-width: 84ch; }
.guide-sections > section, .legal-sections > section { padding-block: clamp(1.2rem, 2.7vw, 2rem); border-top: 1px solid var(--line); scroll-margin-top: 1.25rem; }
.guide-sections > section > :last-child, .legal-sections > section > :last-child { margin-block-end: 0; }
.guide-sections > section:first-child { padding-block-start: .15rem; border-top: 0; }
.guide-sections .info-note { margin-bottom: 0; }
.guide-sections > section:target h2, .legal-sections > section:target h2 { color: var(--accent); }
.info-note { border-inline-start: 2px solid var(--green); background: var(--surface); padding: .75rem 1rem; border-radius: 0 8px 8px 0; margin-bottom: 1rem; }
.legal-sections > .info-note { padding: clamp(.9rem, 2vw, 1.45rem); border-radius: 0 12px 12px 0; margin-bottom: clamp(1.2rem, 2.7vw, 2rem); }
.info-note p:last-child { margin: 0; }
.info-footer { border-top: 1px solid var(--line); margin-top: 3rem; }
.sitemap-directory ul { padding: 0; margin: 0; list-style: none; }
.sitemap-tools, .sitemap-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: clamp(.85rem, 2vw, 1.5rem);
}
.sitemap-tool, .sitemap-page-link, .sitemap-topics a {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  column-gap: .9rem;
}
.sitemap-tool {
  min-height: 100%;
  align-content: center;
  row-gap: .4rem;
  padding: clamp(1.05rem, 3vw, 2rem);
  background: var(--surface);
  border: 1px solid var(--line);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
}
.sitemap-tool strong { font-size: clamp(1.25rem, 2.1vw, 1.65rem); letter-spacing: -.025em; }
.sitemap-tool span, .sitemap-page-link span {
  grid-column: 1;
  color: var(--muted);
  line-height: 1.55;
}
.sitemap-tool span { font-size: 1.04rem; }
.sitemap-tool::after, .sitemap-page-link::after, .sitemap-topics a::after {
  content: '';
  grid-column: 2;
  grid-row: 1 / span 2;
  width: .45rem;
  height: .45rem;
  border: solid var(--muted);
  border-width: 1.5px 1.5px 0 0;
  transform: rotate(45deg);
}
.sitemap-tool:hover { border-color: var(--accent); }
.sitemap-tool:hover strong, .sitemap-page-link:hover strong, .sitemap-topics a:hover { color: var(--accent); }
.sitemap-sections { gap: clamp(1.5rem, 4.5vw, 4rem); margin-top: clamp(1.65rem, 5vw, 4rem); }
.sitemap-section { min-width: 0; }
.sitemap-section li { border-top: 1px solid var(--line); }
.sitemap-section li:last-child { border-bottom: 1px solid var(--line); }
.sitemap-topics a, .sitemap-page-link { min-height: 44px; padding: .6rem .45rem .6rem 0; font-size: 1.02rem; }
.sitemap-page-link { row-gap: .15rem; }
.sitemap-page-link strong { font-weight: 650; }
.sitemap-section > .guide-link { display: inline-flex; align-items: center; min-height: 44px; margin-top: .45rem; }
.sitemap-topics a::after { grid-row: 1; }
.sitemap-tool:hover::after, .sitemap-page-link:hover::after, .sitemap-topics a:hover::after { border-color: var(--accent); }
.brand > svg { flex: none; }
.brand > span { white-space: nowrap; font-size: clamp(17px, 2.35vw, 32px); letter-spacing: -.055em; }
.privacy-banner {
  position: fixed;
  z-index: 20;
  inset-inline: 16px;
  bottom: max(16px, env(safe-area-inset-bottom));
  max-width: 46rem;
  margin-inline: auto;
  padding: 1rem 1.15rem;
  border: 1px solid var(--line);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: 0 10px 38px #0002;
}
.privacy-banner h2 { margin: 0 0 .35rem; font-size: 1.1rem; line-height: 1.25; }
.privacy-banner p, .privacy-dialog p { margin: 0; color: var(--muted); }
.privacy-banner-copy { font-size: .93rem; line-height: 1.55; }
.privacy-banner-copy p + p { margin-top: .25rem; }
.privacy-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .45rem .65rem; }
.privacy-banner .privacy-actions { margin-top: .8rem; }
.privacy-actions .button, .privacy-actions .privacy-link { min-height: 40px; font-size: .88rem; }
.privacy-actions .button { white-space: normal; }
.privacy-actions .privacy-link { display: inline-flex; align-items: center; padding-inline: .25rem; }
.privacy-link { color: var(--accent); text-decoration: underline; text-underline-offset: .2em; }
.privacy-purpose { border-top: 1px solid var(--line); padding-block: .75rem; }
.privacy-purpose h3, .privacy-purpose label { margin: 0 0 .25rem; font-weight: 650; font-size: 1rem; }
.privacy-purpose .check-label { display: inline-flex; gap: .6rem; align-items: center; min-height: 32px; cursor: pointer; }
.privacy-dialog .privacy-detail { margin-top: .65rem; font-size: .88rem; }
.privacy-dialog .dialog-actions { justify-content: flex-end; }
.privacy-close { font-size: 1.4rem; line-height: 1; }
.focus-mode .privacy-banner { display: none; }
@media (max-width: 780px) {
  .guide-layout { grid-template-columns: minmax(0, 1fr); }
  .guide-nav { position: static; }
}
@media (320px <= width <= 780px) {
  .guide-nav { grid-template-columns: repeat(2, minmax(0, 1fr)); column-gap: .5rem; }
}
@media (max-width: 720px) {
  .info-example, .info-feature-list { grid-template-columns: minmax(0, 1fr); }
  .info-header-links { gap: .15rem .75rem; }
  .footer:has(.footer-links) { flex-wrap: wrap; }
}
@media (max-width: 560px) {
  .sitemap-tools, .sitemap-sections { grid-template-columns: minmax(0, 1fr); }
  .info-reading .info-hero h1 { font-size: clamp(2rem, 8.8vw, 2.6rem); }
  .info-topbar {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    align-content: center;
    gap: .15rem .55rem;
    height: auto;
    min-height: 75px;
    padding-block: .65rem;
  }
  .info-header-links { margin-inline-start: 0; }
  .info-header-links .info-back { margin-inline-end: auto; }
}
@media (max-width: 390px) {
  .info-table th, .info-table td { font-size: .86rem; }
}

@media (max-width: 460px) {
  .brand { gap: 6px; }
  .brand > svg { width: 22px; height: 22px; }
  .brand > span { font-size: clamp(15px, 3.7vw, 17px); }
  .privacy-banner { inset-inline: 10px; padding: .8rem .9rem; }
}
@media (max-width: 345px) {
  .topbar:not(.info-topbar) { gap: 5px; }
  .topbar:not(.info-topbar) .brand > svg { width: 19px; height: 19px; }
  .topbar:not(.info-topbar) .brand > span { font-size: 14px; }
  .header-actions .language-control { margin-right: 0; }
  .header-actions .language-control select { width: 67px; }
}
