/* Site chrome around the portal: text summary, site footer, share menu, and the privacy page. */
.al-summary, .al-site-foot, .al-page {
  --al-bg: #F8F6F1; --al-panel: #FFFFFF; --al-fg: #11151B; --al-fg2: #3E4652; --al-line: #E1E5EB; --al-mark: #FFE58A;
  background: var(--al-bg); color: var(--al-fg); font-family: var(--font-anthropic-sans);
  padding-inline: clamp(16px, 4vw, 48px);
}
body.is-dark .al-summary, body.is-dark .al-site-foot { --al-bg: #0C0F14; --al-panel: #141922; --al-fg: #F1F4F8; --al-fg2: #B9C2D0; --al-line: #262E3B; }
@media (prefers-color-scheme: dark) {
  .al-page { --al-bg: #0C0F14; --al-panel: #141922; --al-fg: #F1F4F8; --al-fg2: #B9C2D0; --al-line: #262E3B; --al-mark: #6B5A12; color-scheme: dark; }
  body.al-page-body { background: #0C0F14; }
}
.al-wrap { max-width: 1320px; margin-inline: auto; }
.al-summary a, .al-site-foot a, .al-page a { color: inherit; text-underline-offset: 2px; }
.al-eyebrow { margin: 0; font-size: 13px; letter-spacing: .08em; text-transform: uppercase; color: var(--al-fg2); }

.al-summary { padding-block: 8px 32px; }
.al-summary .al-wrap { border-top: 1px solid var(--al-line); padding-top: 28px; display: grid; gap: 12px; }
.al-summary h2 { margin: 0; font-family: var(--font-anthropic-serif); font-weight: 400; font-size: clamp(1.3rem, 2vw, 1.7rem); }
.al-summary p { margin: 0; max-width: 80ch; font-size: 15px; line-height: 1.55; color: var(--al-fg2); }
.al-tables { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 22rem), 1fr)); gap: 20px; margin-block: 8px; align-items: start; }
.al-tablewrap { overflow-x: auto; }
.al-table { width: 100%; border-collapse: collapse; font-size: 13px; font-variant-numeric: tabular-nums; }
.al-table caption { text-align: left; font-size: 15px; font-weight: 500; padding-bottom: 6px; color: var(--al-fg); }
.al-table th, .al-table td { text-align: left; padding: 5px 8px 5px 0; border-bottom: 1px solid var(--al-line); font-weight: 400; }
.al-table thead th { color: var(--al-fg2); font-size: 12px; }
.al-table .num { text-align: right; padding-right: 0; }
.al-summary .al-note { font-size: 13px; }

.al-site-foot { padding-block: 0 40px; font-size: 13px; color: var(--al-fg2); }
.al-site-foot .al-wrap { display: flex; flex-wrap: wrap; gap: 8px 24px; justify-content: space-between; border-top: 1px solid var(--al-line); padding-top: 16px; }
.al-site-foot p { margin: 0; }
.al-site-foot nav { display: flex; flex-wrap: wrap; gap: 4px 16px; }

/* Share and download controls, added by growth.js */
.al-actions { display: inline-flex; gap: 6px; align-items: center; position: relative; }
.al-menu { position: absolute; top: calc(100% + 6px); right: 0; z-index: 20; min-width: 190px; display: grid; padding: 4px; background: var(--cds-surface-popover); border: 1px solid var(--cds-border); border-radius: var(--cds-radius); box-shadow: var(--cds-shadow-popover); }
.al-menu[hidden] { display: none; }
.al-menu a, .al-menu button { font: inherit; font-size: var(--cds-font-size-caption); text-align: left; color: var(--color-fg); background: transparent; border: 0; border-radius: 8px; padding: 7px 10px; cursor: pointer; text-decoration: none; }
.al-menu a:hover, .al-menu button:hover, .al-menu a:focus-visible, .al-menu button:focus-visible { background: var(--color-border-line); }
.al-panel-head { display: flex; flex-wrap: wrap; gap: 8px; justify-content: space-between; align-items: start; }
.al-panel-head > div { display: grid; gap: 2px; }
@media (max-width: 620px) { .al-hide-narrow { display: none; } }

/* Privacy page */
body.al-page-body { background: #F8F6F1; }
.al-page { min-height: 100vh; padding-block: 32px 48px; }
.al-page main { max-width: 72ch; margin-inline: auto; font-size: 16px; line-height: 1.6; }
.al-page h1 { font-family: var(--font-anthropic-serif); font-weight: 400; font-size: clamp(1.7rem, 3vw, 2.3rem); margin: 8px 0 16px; }
.al-page h2 { font-size: 18px; font-weight: 600; margin: 28px 0 6px; }
.al-page p, .al-page ul { margin: 0 0 12px; }
.al-page li { margin-bottom: 4px; }
.al-page .al-back { font-size: 14px; }
.al-page .al-meta { color: var(--al-fg2); font-size: 14px; }
mark.al-ph { background: var(--al-mark); color: inherit; padding: 0 3px; border-radius: 3px; font-weight: 600; }
.al-offscreen { position: fixed; top: -1000px; left: 0; opacity: 0; }
@media (max-width: 620px) {
  #story .fm-tools { flex-wrap: wrap; flex-shrink: 1; min-width: 0; margin-left: 0; }
  #story .al-actions .al-menu { right: auto; left: 0; }
}
