/* Topsoil Commons: the shared kit. Every page links this file before
   its own style block, so the base, the bar, and the shared pieces
   are written once here and nowhere else. Pages set their own palette
   variables (:root) and keep only the rules that are theirs alone. */

*{box-sizing:border-box}
body{margin:0;background:var(--bg, var(--paper, #fbfaf7));color:var(--ink);
  font-family:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;
  line-height:1.5;-webkit-font-smoothing:antialiased}
a{color:var(--ink)}
.wrap{max-width:980px;margin:0 auto;padding:0 20px}

.commons-bar{display:flex;flex-wrap:wrap;gap:4px 18px;align-items:center;
  max-width:1060px;margin:0 auto;padding:10px 20px 8px;font-size:14px;
  border-bottom:1px solid var(--line);position:sticky;top:0;
  background:var(--bg, var(--paper, #fbfaf7));z-index:5}
.commons-bar .brand,.commons-bar .wordmark{font-weight:600}
.commons-bar a{color:var(--ink);text-decoration:none;display:inline-flex;
  align-items:center;min-height:44px}
.commons-bar a:hover{text-decoration:underline}
.commons-bar .current{font-weight:700;display:inline-flex;align-items:center;
  min-height:44px}

.skip{position:absolute;left:12px;top:-60px;
  background:var(--bg, var(--paper, #fbfaf7));color:var(--ink);
  padding:10px 12px;font-size:14px}
.skip:focus{top:8px}

a:focus-visible,summary:focus-visible,button:focus-visible{
  outline:2px solid var(--ink);outline-offset:2px}
[id]{scroll-margin-top:72px}

footer{border-top:1px solid var(--line)}
.endline{text-align:center;font-size:15px;color:var(--ink)}

@media (prefers-reduced-motion: reduce){
  *,*::before,*::after{transition:none !important;animation:none !important}
}

@media print{
  .commons-bar,.skip,.share{display:none}
  body{background:#fff;color:#000}
  a{color:#000}
  header{display:block}
  .row,.demo,.liferow,tr{break-inside:avoid}
}