/* Themed sites: shared skeleton. Loaded first; the layout file (docs.css, editorial.css, ...) follows in the same
   theme.css and carries each site's real look. Colours, fonts, radius and density arrive as CSS variables from the
   site's "theme" block (see themeVars in build.mjs). System fonts only, no JavaScript, no external requests.
   This file only resets what style.css does and gives every component a neutral default. */
:root { --maxw: 1080px; --d: var(--dens, 1); }
body { background: var(--bg); color: var(--ink); font-family: var(--font); font-size: 17px; line-height: 1.65; }
h1, h2, h3, h4 { font-family: var(--font-head); color: var(--ink); line-height: 1.2; }
a { color: var(--accent-ink); }
.wrap { max-width: var(--maxw); }
.sr-only { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip: rect(0 0 0 0); white-space: nowrap; border: 0; }
.skip { color: var(--ink); }
:focus-visible { outline: 3px solid var(--accent-ink); outline-offset: 2px; }
.site-header :focus-visible { outline-color: var(--head-ink); }
.site-footer :focus-visible { outline-color: var(--foot-ink); }

/* header and wordmark */
.site-header { border: 0; border-bottom: 1px solid var(--line); background: var(--head-bg); color: var(--head-ink); }
.header-row { padding-top: 14px; padding-bottom: 14px; }
.brand { color: var(--head-ink); display: inline-flex; align-items: center; gap: 10px; text-decoration: none; }
.logo-text { font-family: var(--font-head); font-weight: 700; font-size: 1.25rem; letter-spacing: -.01em; line-height: 1.1; }
.logo-mark { height: 32px; width: 32px; flex: none; display: block; }
.site-header nav a { color: var(--head-ink); border-radius: var(--radius); }
.site-header nav a:hover { background: transparent; }
.site-header nav a[aria-current="page"] { background: transparent; color: var(--head-ink); }

/* hero (home) */
.t-hero { padding: calc(52px * var(--d)) 0 calc(40px * var(--d)); }
.t-hero .hero-grid { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(0, 1fr); gap: 36px; align-items: start; }
.t-hero h1 { font-size: clamp(1.9rem, 4.4vw, 2.8rem); margin: 0 0 14px; letter-spacing: -.015em; }
.t-hero .lede { color: var(--muted); font-size: 1.12rem; margin: 0; max-width: 38em; }
.eyebrow { margin: 0 0 10px; font-size: .78rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; color: var(--accent-ink); }
.hero-panel { border: 1px solid var(--line); background: var(--surface); border-radius: var(--radius); padding: 20px 22px; }
.hero-panel h2 { margin: 0 0 8px; font-size: 1rem; }
.hero-panel ul { margin: 0; padding-left: 1.1em; }
.hero-panel li { margin: .35em 0; }
.t-note { margin-bottom: 8px; }
.t-note .disclosure-note, .article .disclosure-note { margin: 18px 0; border-radius: var(--radius); }
.t-intro, .t-topics, .t-feature { padding-top: calc(24px * var(--d)); padding-bottom: calc(24px * var(--d)); }
.t-intro h2 { margin-top: 0; }
.t-topics > h2 { margin: 0 0 calc(18px * var(--d)); font-size: 1.5rem; }
.t-soon { color: var(--muted); font-size: .92rem; margin-top: 18px; }

/* entries (home lists) */
.entries { display: grid; gap: calc(20px * var(--d)); }
.entry { display: grid; gap: 10px; }
.entry-cover { display: block; overflow: hidden; background: var(--surface); }
.entry-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.entry-ph { display: flex; flex-direction: column; justify-content: flex-end; padding: 14px 16px; text-decoration: none; color: var(--ink); }
.entry-body { min-width: 0; }
.entry-kicker { margin: 0 0 6px; display: flex; gap: 10px; align-items: baseline; font-size: .78rem; font-weight: 700; letter-spacing: .06em; text-transform: uppercase; color: var(--muted); }
.entry-no { font-variant-numeric: tabular-nums; }
.entry h3, .entry h4 { margin: 0 0 6px; font-size: 1.2rem; }
.entry h3 a, .entry h4 a, .feature h2 a { color: var(--ink); text-decoration: none; }
.entry h3 a:hover, .entry h4 a:hover, .feature h2 a:hover { text-decoration: underline; text-underline-offset: 3px; }
.entry-ex { margin: 0 0 8px; color: var(--muted); font-size: .97rem; }
.entry-meta { margin: 0; display: flex; flex-wrap: wrap; gap: 4px 14px; font-size: .82rem; color: var(--muted); }
.group-head h3 { margin: 0 0 4px; font-size: 1.2rem; }
.group-blurb { margin: 0 0 14px; color: var(--muted); font-size: .95rem; }
.group { margin: 0 0 calc(34px * var(--d)); }
.feature { display: grid; gap: 18px; }
.feature-cover { display: block; overflow: hidden; }
.feature-cover img { display: block; width: 100%; height: 100%; object-fit: cover; }
.feature h2 { margin: 0 0 10px; }

/* simple pages and articles */
.page, .article { max-width: 800px; padding-top: calc(36px * var(--d)); padding-bottom: calc(56px * var(--d)); }
.page h1, .article h1 { font-size: clamp(1.9rem, 4.2vw, 2.7rem); margin: 0 0 14px; letter-spacing: -.015em; }
.page .prose h2, .article .prose h2 { font-size: 1.45rem; margin: 2em 0 .5em; }
.prose { max-width: 44rem; }
.article .art-head .eyebrow { margin-bottom: 8px; }
.meta { color: var(--muted); }
.art-cover { margin: 0 0 28px; }
.art-cover img { display: block; width: 100%; height: auto; object-fit: cover; }
.facts { margin: 0; display: flex; flex-wrap: wrap; gap: 8px 22px; font-size: .88rem; }
.facts dt { font-size: .72rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.facts dd { margin: 0; color: var(--ink); font-weight: 600; }
.toc ol { margin: 0; padding-left: 1.1em; }
.toc li { margin: .3em 0; font-size: .92rem; }
.toc-title { margin: 0 0 6px; font-size: .78rem; font-weight: 700; letter-spacing: .07em; text-transform: uppercase; color: var(--muted); }
.table-wrap { border-radius: var(--radius); }
table { font-size: .95rem; }
thead th { background: var(--surface); color: var(--ink); }
tbody th { background: transparent; }
th, td { border-bottom-color: var(--line); }
.table-wrap { border-color: var(--line); }
code { background: var(--surface); }
blockquote { border-left-color: var(--accent); color: var(--muted); }
.faq { border-top-color: var(--line); }
.sources { border-top-color: var(--line); }
.cta-box { background: var(--surface); border: 2px solid var(--accent); border-radius: var(--radius); }
.cta-box a { color: var(--ink); text-decoration-color: var(--accent); }
.crumbs, .crumbs a, .crumbs li + li::before { color: var(--muted); }
.crumbs [aria-current="page"] { color: var(--ink); }
.draft-banner { border-radius: var(--radius); }
.shot img { border-color: var(--line); }
.shot figcaption { color: var(--muted); }
.demo-band { padding-top: calc(24px * var(--d)); padding-bottom: calc(24px * var(--d)); }
.demo-band .demo-intro { color: var(--muted); }
.demo-band .demo-link a { font-weight: 700; }

/* footer */
.site-footer { margin-top: calc(48px * var(--d)); background: var(--foot-bg); color: var(--foot-ink); border: 0; padding: 36px 0 26px; }
.site-footer .brand { color: var(--foot-ink); }
.site-footer a { color: var(--foot-ink); }
.site-footer nav a { color: var(--foot-ink); font-weight: 600; }
.footer-tag { color: var(--foot-ink); opacity: .86; }
.footer-disclosure { border-top: 1px solid color-mix(in srgb, var(--foot-ink) 28%, transparent); }
.footer-disclosure p { color: var(--foot-ink); opacity: .9; }
.footer-note { margin-top: 6px !important; font-size: .82rem !important; opacity: .78 !important; }

/* docs sidebar markup exists only on the docs layout; hidden everywhere else just in case */
.docs-toggle, .docs-toggle-label { display: none; }

@media (max-width: 860px) {
  .t-hero .hero-grid { grid-template-columns: 1fr; gap: 22px; }
  .page, .article { padding-top: 26px; padding-bottom: 40px; }
}
@media (max-width: 760px) {
  body { font-size: 16.5px; }
  .header-row { gap: 6px 16px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; animation: none !important; scroll-behavior: auto !important; } }

/* LEDGER layout (3plbillingsoftware.com): finance. Serif type on paper, ink and gold, a narrow column, ruled lines,
   a real table for the article list, numbered entries in a left margin, tabular figures, double rules for totals. */
.theme-ledger { --maxw: 840px; font-size: 17.5px; line-height: 1.7; font-variant-numeric: lining-nums tabular-nums; }
.theme-ledger h1, .theme-ledger h2, .theme-ledger h3, .theme-ledger h4 { font-weight: 700; letter-spacing: -.005em; }

/* header: double rule under a small-caps masthead */
.theme-ledger .site-header { border-top: 5px solid var(--ink); border-bottom: 3px double var(--ink); background: var(--bg); }
.theme-ledger .header-row { padding-top: 14px; padding-bottom: 12px; }
.theme-ledger .logo-text { font-size: 1.28rem; font-variant: small-caps; letter-spacing: .05em; font-weight: 700; }
.theme-ledger .brand:not(:has(.logo-mark)) .logo-text::after { content: ""; display: inline-block; width: 9px; height: 9px; margin-left: .55em; background: var(--accent); transform: rotate(45deg); vertical-align: .12em; }
.theme-ledger .site-header nav { gap: 0 4px; }
.theme-ledger .site-header nav a { padding: 4px 11px; font-size: .86rem; font-variant: small-caps; letter-spacing: .08em; font-weight: 700; border-radius: 0; color: var(--ink); }
.theme-ledger .site-header nav a:hover { color: var(--accent-ink); }
.theme-ledger .site-header nav a[aria-current="page"] { box-shadow: inset 0 -2px 0 var(--accent); color: var(--ink); }

/* home */
.theme-ledger .t-hero { padding: calc(46px * var(--d)) 0 calc(26px * var(--d)); }
.theme-ledger .t-hero .hero-grid { grid-template-columns: 1fr; gap: 26px; }
.theme-ledger .eyebrow { font-variant: small-caps; text-transform: none; letter-spacing: .12em; font-size: .92rem; color: var(--accent-ink); font-weight: 700; display: flex; align-items: center; gap: 12px; }
.theme-ledger .eyebrow::after { content: ""; flex: 1; border-top: 1px solid var(--ink); }
.theme-ledger .t-hero h1 { font-size: clamp(2rem, 4.8vw, 2.9rem); line-height: 1.1; letter-spacing: -.012em; font-weight: 700; margin-bottom: 14px; }
.theme-ledger .t-hero .lede { font-size: 1.12rem; color: var(--muted); font-style: italic; max-width: 36em; }
.theme-ledger .hero-panel { border: 0; border-top: 2px solid var(--ink); border-bottom: 3px double var(--ink); border-radius: 0; background: transparent; padding: 10px 0 8px; }
.theme-ledger .hero-panel h2 { font-size: .86rem; font-variant: small-caps; letter-spacing: .12em; margin-bottom: 4px; color: var(--muted); font-weight: 700; }
.theme-ledger .hero-panel ul { list-style: none; padding: 0; counter-reset: pn; }
.theme-ledger .hero-panel li { counter-increment: pn; display: grid; grid-template-columns: 2.6rem 1fr; margin: 0; padding: 7px 0; border-top: 1px solid var(--line); font-size: .97rem; line-height: 1.45; }
.theme-ledger .hero-panel li:first-child { border-top: 0; }
.theme-ledger .hero-panel li::before { content: counter(pn, decimal-leading-zero); color: var(--accent-ink); font-weight: 700; font-size: .9rem; }
.theme-ledger .t-intro { padding-top: 14px; }
.theme-ledger .t-intro .prose { max-width: none; }
.theme-ledger .t-intro h2 { font-size: 1.45rem; padding-bottom: 6px; border-bottom: 1px solid var(--ink); }
.theme-ledger .t-topics > h2 { font-size: .95rem; font-variant: small-caps; letter-spacing: .14em; margin-bottom: 8px; }

/* the ledger: a real table with ruled rows and columns */
.theme-ledger table.ledger { width: 100%; min-width: 0; table-layout: auto; border-collapse: collapse; border-top: 2px solid var(--ink); border-bottom: 3px double var(--ink); font-size: .96rem; line-height: 1.45; }
.theme-ledger table.ledger th, .theme-ledger table.ledger td { padding: 12px 12px; border-bottom: 1px solid var(--line); border-right: 1px solid var(--line); vertical-align: top; text-align: left; background: transparent; }
.theme-ledger table.ledger th:last-child, .theme-ledger table.ledger td:last-child { border-right: 0; }
.theme-ledger table.ledger thead th { font-size: .78rem; font-variant: small-caps; letter-spacing: .1em; font-weight: 700; color: var(--muted); border-bottom: 1px solid var(--ink); padding-top: 8px; padding-bottom: 8px; }
.theme-ledger table.ledger .lg-no { width: 3.2rem; text-align: right; color: var(--accent-ink); font-weight: 700; }
.theme-ledger table.ledger .lg-cat { width: 8.2rem; color: var(--muted); font-size: .88rem; }
.theme-ledger table.ledger .lg-date { width: 6.8rem; text-align: right; color: var(--muted); font-size: .88rem; white-space: nowrap; }
.theme-ledger table.ledger tbody th { font-weight: 400; }
.theme-ledger table.ledger tbody th a { font-size: 1.12rem; font-weight: 700; color: var(--ink); text-decoration-color: var(--accent); text-decoration-thickness: 2px; text-underline-offset: 3px; }
.theme-ledger table.ledger tbody th a:hover { color: var(--accent-ink); }
.theme-ledger table.ledger .lg-ex { display: block; margin-top: 3px; color: var(--muted); font-size: .88rem; font-style: italic; }
.theme-ledger table.ledger tbody tr:hover { background: var(--surface); }
.theme-ledger table.ledger tbody tr:last-child th, .theme-ledger table.ledger tbody tr:last-child td { border-bottom: 0; }

/* articles: narrow, numbered entries with a margin rule, small framed cover, ruled facts */
.theme-ledger .article, .theme-ledger .page { max-width: 840px; }
.theme-ledger .crumbs { font-size: .84rem; font-style: italic; }
.theme-ledger .article h1, .theme-ledger .page h1 { font-size: clamp(1.9rem, 4.5vw, 2.7rem); line-height: 1.12; letter-spacing: -.012em; }
.theme-ledger .art-head .eyebrow { font-size: .9rem; }
.theme-ledger .facts { display: grid; grid-template-columns: repeat(4, auto); justify-content: stretch; gap: 0; margin: 14px 0 6px; border-top: 2px solid var(--ink); border-bottom: 3px double var(--ink); }
.theme-ledger .facts > div { padding: 8px 12px; border-right: 1px solid var(--line); }
.theme-ledger .facts > div:last-child { border-right: 0; }
.theme-ledger .facts dt { font-size: .72rem; font-variant: small-caps; letter-spacing: .1em; font-weight: 700; color: var(--muted); text-transform: none; }
.theme-ledger .facts dd { font-weight: 700; font-size: .95rem; }
.theme-ledger .art-cover { float: right; width: 270px; margin: 26px 0 18px 30px; padding: 6px; background: #fff; border: 1px solid var(--ink); }
.theme-ledger .art-cover img { aspect-ratio: 4 / 3; filter: saturate(.8) contrast(1.03); }
.theme-ledger .art-grid { clear: none; }
.theme-ledger .prose { position: relative; max-width: none; padding-left: 3.4rem; margin-top: 8px; counter-reset: ent; }
.theme-ledger .prose::before { content: ""; position: absolute; left: 2.6rem; top: 0; bottom: 0; border-left: 1px solid var(--line); }
.theme-ledger .prose > * { max-width: 40rem; }
.theme-ledger .prose > .table-wrap, .theme-ledger .prose > .shot { max-width: none; }
.theme-ledger .prose > h2 { position: relative; counter-increment: ent; font-size: 1.5rem; line-height: 1.2; margin: 2em 0 .5em; padding-top: 10px; border-top: 1px solid var(--ink); }
.theme-ledger .prose > h2::before { content: counter(ent, decimal-leading-zero); position: absolute; left: -3.4rem; top: 12px; width: 2.4rem; text-align: right; font-size: .95rem; font-weight: 700; color: var(--accent-ink); background: var(--bg); padding-right: 2px; }
.theme-ledger .prose h3 { font-size: 1.15rem; margin: 1.5em 0 .3em; }
.theme-ledger .prose li::marker { color: var(--accent-ink); }
.theme-ledger blockquote { border-left: 3px double var(--ink); padding-left: 1.1em; font-style: italic; color: var(--ink); }
.theme-ledger .table-wrap { border: 0; border-top: 2px solid var(--ink); border-bottom: 3px double var(--ink); border-radius: 0; margin: 1.4em 0; }
.theme-ledger table { font-size: .92rem; min-width: 460px; line-height: 1.45; font-variant-numeric: lining-nums tabular-nums; }
.theme-ledger thead th { background: transparent; font-size: .76rem; font-variant: small-caps; letter-spacing: .1em; font-weight: 700; color: var(--muted); border-bottom: 1px solid var(--ink); }
.theme-ledger tbody th { background: transparent; font-weight: 700; }
.theme-ledger th, .theme-ledger td { padding: 8px 12px; border-right: 1px solid var(--line); }
.theme-ledger th:last-child, .theme-ledger td:last-child { border-right: 0; }
.theme-ledger tbody tr:nth-child(even) { background: color-mix(in srgb, var(--surface) 55%, transparent); }
.theme-ledger .cta-box { margin: 2.6em 0 1.4em; padding: 16px 6px; background: transparent; border: 0; border-top: 3px double var(--ink); border-bottom: 3px double var(--ink); border-radius: 0; }
.theme-ledger .cta-box a { font-size: 1.1rem; font-style: italic; font-weight: 400; color: var(--ink); }
.theme-ledger .faq { border-top: 2px solid var(--ink); }
.theme-ledger .faq h3 { font-size: 1.1rem; margin: 1.4em 0 .15em; }
.theme-ledger .sources { border-top: 1px solid var(--ink); }
.theme-ledger .sources h2 { font-size: .95rem; font-variant: small-caps; letter-spacing: .12em; }
.theme-ledger .disclosure-note { border: 0; border-top: 1px solid var(--ink); border-bottom: 1px solid var(--ink); background: transparent; border-radius: 0; font-weight: 400; font-style: italic; }
.theme-ledger .shot img { border-radius: 0; border-color: var(--ink); }
.theme-ledger .demo-band h2 { font-size: 1.45rem; padding-bottom: 6px; border-bottom: 1px solid var(--ink); }
.theme-ledger .site-footer { margin-top: 56px; border-top: 6px double var(--x-goldLight); }
.theme-ledger .site-footer .logo-text { color: #fff; }
.theme-ledger .site-footer .brand:not(:has(.logo-mark)) .logo-text::after { background: var(--x-goldLight); }

@media (max-width: 720px) {
  .theme-ledger { font-size: 17px; }
  .theme-ledger .prose { padding-left: 0; }
  .theme-ledger .prose::before { display: none; }
  .theme-ledger .prose > h2::before { position: static; display: inline-block; width: auto; margin-right: .7em; padding: 0; }
  .theme-ledger .art-cover { float: none; width: 100%; margin: 16px 0; }
  .theme-ledger .facts { grid-template-columns: 1fr 1fr; }
  .theme-ledger .facts > div:nth-child(2) { border-right: 0; }
  .theme-ledger .facts > div:nth-child(n+3) { border-top: 1px solid var(--line); }
  /* ledger table turns into stacked entries */
  .theme-ledger table.ledger, .theme-ledger table.ledger tbody, .theme-ledger table.ledger tr, .theme-ledger table.ledger th, .theme-ledger table.ledger td { display: block; }
  .theme-ledger table.ledger thead { display: none; }
  .theme-ledger table.ledger tr { padding: 12px 0 12px 0; border-bottom: 1px solid var(--line); display: grid; grid-template-columns: 2.4rem 1fr; }
  .theme-ledger table.ledger th, .theme-ledger table.ledger td { border: 0; padding: 0; width: auto !important; text-align: left !important; }
  .theme-ledger table.ledger .lg-no { grid-row: 1 / span 3; padding-top: 2px; }
  .theme-ledger table.ledger .lg-cat, .theme-ledger table.ledger .lg-date { margin-top: 4px; }
}
