/* Tarleaks public site: the legal documents (/terms/, /privacy/, /legal/*, /partners/agreement/,
   /partners/commission-schedule/)
   and the partner rules page (/partners/program-rules/).
   Loaded after site.css through head_extra (scripts/site/pages/legal.py, partner_rules.py), with ?v=<content hash>.
   Rules: tokens from site.css only; logical properties only, so the same rules mirror under dir="rtl";
   the pages read without JavaScript. The print rules at the end make each document print as a plain, numbered text. */
@layer components{

.legal-doc > * + *{margin-block-start:var(--s-4)}
.legal-head > * + *{margin-block-start:var(--s-3)}
.legal-head h1{margin:0}
.legal-head .lead{max-inline-size:60ch}
.legal-version{display:inline-block;margin:0;padding:4px 12px;border:1px solid var(--border);border-radius:var(--r-pill);
  background:var(--surface-1);color:var(--text-2);font-size:var(--fs-small);font-weight:650}
.legal-live{color:var(--success-text)}
.legal-draft{padding:var(--s-3) var(--s-4);border:1px solid var(--border);border-inline-start:4px solid var(--warn-text);
  border-radius:var(--r-sm);background:var(--surface-1);color:var(--text)}
.legal-draft p{margin:0;max-inline-size:70ch}
.legal-draft p + p{margin-block-start:var(--s-1)}
.legal-print{margin:0}
.legal-print [hidden],.legal-live[hidden]{display:none!important}

.legal-body > * + *{margin-block-start:var(--s-3)}
.legal-body h2{margin-block:var(--s-7) var(--s-2);scroll-margin-block-start:calc(var(--header-h) + var(--s-4))}
.legal-body h3{margin-block:var(--s-5) var(--s-1)}
.legal-body ul{padding-inline-start:1.3em;list-style:disc}
.legal-body li + li{margin-block-start:var(--s-2)}
.legal-body code{font-family:var(--font-mono);font-size:.92em;background:var(--code-bg);padding:1px 6px;border-radius:var(--r-xs)}

/* A numbered clause hangs its number in the margin, so the text lines up and the number can be quoted. */
:is(.legal-body,.rules-example) p.clause{position:relative;padding-inline-start:3.4em;scroll-margin-block-start:calc(var(--header-h) + var(--s-4))}
:is(.legal-body,.rules-example) .clause__n{position:absolute;inset-inline-start:0;inset-block-start:0;font-variant-numeric:tabular-nums;font-weight:700;color:var(--text-3)}
:is(.legal-body,.rules-example) p.clause:target{background:var(--brand-soft);border-radius:var(--r-xs)}
.legal-body p.clause ~ ul{margin-inline-start:3.4em}

/* The "In short" box */
.legal-body blockquote.legal-short{margin-inline:0;padding:var(--s-4) var(--s-5);background:var(--surface-1);
  border:1px solid var(--border);border-inline-start:4px solid var(--brand);border-radius:var(--r-md)}
.legal-short > * + *{margin-block-start:var(--s-2)}
.legal-short p:first-child{font-weight:700;margin:0}

.legal-body .tablewrap{margin-block:var(--s-3) var(--s-4)}
.legal-body .tablewrap table{min-inline-size:min(520px,100%)}
.legal-body .tablewrap :is(th,td){vertical-align:top;text-align:start}

.legal-supplement{margin-block-start:var(--s-7)}
.legal-supplement h2{scroll-margin-block-start:calc(var(--header-h) + var(--s-4))}

.legal-ask{margin-block-start:var(--s-6)}
.legal-rules{margin-block-start:var(--s-3)}
.legal-more{margin-block-start:var(--s-7);padding-block-start:var(--s-4);border-block-start:1px solid var(--border)}
.legal-more h2{font-size:var(--fs-h3);margin-block-start:0}
.legal-more ul{list-style:none;padding:0;display:grid;gap:var(--s-1)}
.legal-more a{display:inline-flex;align-items:center;min-block-size:var(--target)}


/* Worked examples and the rules page */
.rules-example{margin-block:var(--s-3);padding:var(--s-3) var(--s-4);background:var(--surface-1);border:1px solid var(--border);
  border-inline-start:4px solid var(--brand);border-radius:var(--r-sm)}
.rules-example > * + *{margin-block-start:var(--s-2)}
.rules-example p{font-size:15.5px}
.rules-example ul{padding-inline-start:1.3em;list-style:disc}
.rules-example .src{font-size:var(--fs-small);color:var(--text-3)}
.rules-body h2{margin-block-start:var(--s-7);scroll-margin-block-start:calc(var(--header-h) + var(--s-4))}
.rules-body section > * + *{margin-block-start:var(--s-3)}
.rules-body ul{padding-inline-start:1.3em;list-style:disc}
.rules-body li + li{margin-block-start:var(--s-2)}
.rules-body .tablewrap :is(th,td){vertical-align:top;text-align:start}
.rules-body ul.rules-links,ul.rules-links{list-style:none;padding:0;display:flex;flex-wrap:wrap;gap:var(--s-2) var(--s-5);margin-block:var(--s-4)}
.rules-links a{display:inline-flex;align-items:center;min-block-size:var(--target)}
}

/* ------------------------------------------------------------------ print */
@page{margin:18mm 16mm}
@media print{
  .site-header,.drawer,.site-footer,.skip-link,.crumbs,.onpage,[data-legal-toc],.legal-print,.legal-live,.legal-more,.legal-ask,
  .legal-rules,.legal-actions,.cta-band,.btn-row,.rules-links,.sticky-cta,.ov{display:none!important}
  body{background:#fff;color:#000;font-size:11pt;line-height:1.45}
  main.page,.container-reading{max-inline-size:none;padding:0;margin:0}
  .legal-head h1{font-size:22pt}
  .legal-head .lead{font-size:11pt}
  .legal-version{border:0;padding:0;background:none;color:#000}
  .legal-body h2,.rules-body h2{font-size:14pt;margin-block:14pt 4pt;break-after:avoid;page-break-after:avoid}
  .legal-body h3{break-after:avoid;page-break-after:avoid}
  .legal-body p.clause,.legal-body li,.legal-body tr,.rules-example{break-inside:avoid;page-break-inside:avoid}
  .legal-body blockquote.legal-short{background:none;border:1px solid #000;border-inline-start-width:3pt}
  .clause__n{color:#000}
  :is(.legal-body,.rules-example) p.clause:target{background:none}
  .tablewrap{overflow:visible!important;border:0!important}
  .tablewrap table{min-inline-size:0!important;inline-size:100%;font-size:10pt;border-collapse:collapse}
  .tablewrap :is(th,td){border:.5pt solid #000;padding:3pt 5pt}
  a,a:visited{color:#000;text-decoration:underline}
  .legal-body a[href^="http"]::after{content:" (" attr(href) ")";font-size:9pt;word-break:break-all}
  .legal-body a[href^="mailto:"]::after{content:""}
}