/* Round 27, lane A (Oct 31 2026): the header, the footer, the legal and help pages, the 404. Loads AFTER r26.css.
   AGREED.md items 1 to 14 (review/header-footer-oct31). Tokens from polish.css only; no important flag; no inline style.
   Phone first: 412 wide is the check. Every tap target is 44px (links in a running sentence are exempt). */

/* ---- header: one row, three plain links, a 2px ink rule (items 1 to 4) ---- */
.top{padding:0;background:var(--bg);box-shadow:none;border-bottom:2px solid var(--edge)}
.top .brandrow{display:flex;flex-wrap:nowrap;align-items:center;justify-content:space-between;gap:var(--sp2);row-gap:0;min-height:56px}
.top .brand{flex:none;min-height:44px;min-width:44px;gap:var(--sp2);font-size:18px}
.top .brand .mark{width:28px;height:28px;margin:0;flex:none}
.top .nav{flex:none;flex-wrap:nowrap;width:auto;margin:0;padding:0;overflow:visible;gap:0;
  -webkit-mask-image:none;mask-image:none}
.top .navlink{flex:none;text-wrap:nowrap;min-height:44px;padding:0 var(--sp3);font-size:14px;font-weight:600;border-radius:8px;color:var(--muted)}
.top .navlink:hover{color:var(--ink);background:var(--s3);text-decoration:none}
.top .navlink.on{color:var(--ink);background:var(--s3)}
/* The wordmark, the mark and three links do not fit one 44px row under 440px, so the mark stands alone there (the link keeps
   its aria-label and the page h1 says the name). From 441px the wordmark returns beside the links. */
@media (max-width:440px){
  .top .brand > span{display:none}
  .top .navlink{padding:0 var(--sp3)}
}
@media (max-width:380px){ .top .navlink{font-size:13px;padding:0 var(--sp2)} }
@media (min-width:441px) and (max-width:560px){
  .top .brand{font-size:16px;gap:6px}
  .top .navlink{font-size:13px;padding:0 var(--sp2)}
}
@media (min-width:1000px){
  .top .brandrow{min-height:64px}
  .top .brand{font-size:21px}
  .top .brand .mark{width:30px;height:30px}
  .top .navlink{font-size:15px;padding:0 var(--sp4)}
}

/* ---- footer: three equal groups, one legal row, three short paragraphs (items 5 to 8) ---- */
.foot{padding:var(--sp5) 0 var(--sp6)}
.foot .foot-cols{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--sp3) var(--sp5);margin:0}
.foot .foot-col{min-width:0}
.foot .foot-help{grid-column:1 / -1}
.foot .foot-help .footnav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 var(--sp5)}
.foot .foot-h{margin:0;font-size:var(--t1);line-height:1.4}
.foot .footnav{display:flex;flex-direction:column;list-style:none;margin:0;padding:0;gap:0}
.foot .footnav a{display:flex;align-items:center;min-height:44px;padding:0;color:var(--ink);font-size:var(--t2);font-weight:500;line-height:1.25}
.foot .footnav a:hover{text-decoration:underline;text-underline-offset:3px}
.foot .foot-legalrow{margin:var(--sp3) 0 0;padding:var(--sp2) 0 0;border-top:1px solid var(--line)}
.foot .foot-legalrow .footnav{flex-direction:row;flex-wrap:wrap;gap:0 var(--sp5)}
.foot .foot-fine{margin:var(--sp3) 0 0;max-width:78ch}
.foot .foot-fine p,.foot .foot-fine p a:not([class]){font-size:13px;line-height:1.6}
.foot .foot-fine p{margin:0 0 12px;color:var(--muted)}
.foot .foot-fine p:last-child{margin-bottom:0}
.foot .foot-fine p a:not([class]){display:inline;min-height:0;padding:0;color:var(--ink);text-decoration:underline;text-underline-offset:2px}
@media (min-width:720px){
  .foot .foot-cols{grid-template-columns:repeat(3,minmax(0,1fr))}
  .foot .foot-help{grid-column:auto}
  .foot .foot-help .footnav{display:flex}
  .foot .footnav a{min-height:36px}
  .foot .foot-legalrow .footnav a{min-height:40px}
}

/* ---- a legal page: title and lead first; the contents wait in a closed fold on a phone (items 11, 12) ---- */
.toc-fold{margin:0 0 var(--sp4);border-top:1px solid var(--line);border-bottom:1px solid var(--line)}
.toc-fold > summary{display:flex;align-items:center;min-height:44px;font-weight:700;cursor:pointer}
.toc-fold ul{list-style:none;margin:0;padding:0 0 var(--sp2)}
.toc-fold li a{display:flex;align-items:center;min-height:44px}
.rail-grid > .rail{display:none}
@media (min-width:1000px){
  .rail-grid > .rail{display:block}
  .toc-fold{display:none}
}
.last-changed{margin:var(--sp5) 0 0}

/* ---- the sources tables on a phone: name and rows on one line, the coverage line under it, a 1px rule (item 13) ---- */
@media (max-width:640px){
  .prose table.cov.src-tbl tr{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:2px var(--sp3);padding:var(--sp3) 0;border-bottom:1px solid var(--line)}
  .prose table.cov.src-tbl td{padding:0}
  .prose table.cov.src-tbl td[data-label]::before{content:none}
  .prose table.cov.src-tbl td:nth-child(1){grid-column:1;font-weight:700;color:var(--ink)}
  .prose table.cov.src-tbl td:nth-child(2){grid-column:2;text-align:right;font-weight:700;white-space:nowrap;color:var(--ink)}
  .prose table.cov.src-tbl td:nth-child(3){grid-column:1 / -1;font-size:var(--t1);line-height:1.4;color:var(--muted)}
  .prose table.cov.src-tbl td.n::after{content:" rows"}
  .prose table.cov.src-tbl td.n1::after{content:" row"}
}

/* ---- Help and Takedown: one button per address, and Copy address beside it (item 14, r3069) ---- */
.helpmail,.helpbox .helpmail{display:flex;flex-wrap:wrap;align-items:center;gap:var(--sp2);margin:var(--sp3) 0 var(--sp2)}
.helpmail .btn{display:inline-flex;align-items:center;min-height:44px;overflow-wrap:anywhere;text-decoration:none}
.helpmail .copy-btn[hidden]{display:none}
.helpmail .copy-btn{cursor:pointer;font-family:inherit}

/* ---- the 404: one column, one blue button, one second way back (r3069) ---- */
.nf-go{margin:var(--sp5) 0 var(--sp2)}
.nf-go .btn{display:inline-flex;align-items:center;min-height:44px;text-decoration:none}
.nf-or{margin:0;font-size:var(--t2)}
.nf-or a{display:inline-flex;align-items:center;min-height:44px}