/* Shared style for Zevvy's plain content pages: privacy, terms, about, the data
 * report, the tools, welcome, /in and /ca.
 *
 * It uses the same colour tokens as the generated pages in pseo/lib/html.mjs, so
 * the two families look like one site, and the same two rules:
 *   - every a[href] is a 44px box (scripts/phase4-audit.mjs measures that), so
 *     prose never contains an inline link; links are blocks, chips or list rows;
 *   - the light accent is never used for text (#00a877 on white is 3.06:1).
 * Served immutable for a year, so it is listed in scripts/fingerprint.mjs. */
:root{
  --bg:#eef2f0;--surface:#ffffff;--surface-2:#f2f5f4;
  --line:rgba(12,26,22,.14);--line-strong:rgba(12,26,22,.24);
  --text:#0d1513;--text-2:#5b6d68;
  --link:#00693f;
  --btn:#00a877;--btn-ink:#00291d;
  --r:14px;
  --font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;
}
@media (prefers-color-scheme:dark){
  :root{
    --bg:#0a0e0d;--surface:#1a2321;--surface-2:#243130;
    --line:rgba(255,255,255,.16);--line-strong:rgba(255,255,255,.28);
    --text:#f1f7f5;--text-2:#a3b3ae;
    --link:#00d68f;
    --btn:#00d68f;--btn-ink:#00291d;
  }
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--text);font:400 16px/1.6 var(--font);overflow-wrap:break-word}
.wrap{max-width:760px;margin:0 auto;padding:0 16px}
a{color:var(--link)}

.top{border-bottom:1px solid var(--line);background:var(--surface)}
.top .wrap{display:flex;align-items:center;justify-content:space-between;gap:8px}
.brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:4px 8px 4px 0;font-weight:700;font-size:17px;color:var(--text);text-decoration:none;letter-spacing:-.01em}
.brand img{width:26px;height:26px;object-fit:contain}
.top-cta{display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 14px;border-radius:999px;background:var(--btn);color:var(--btn-ink);font-weight:650;font-size:15px;text-decoration:none}

main{padding-bottom:40px}
h1{font-size:28px;line-height:1.2;letter-spacing:-.02em;margin:24px 0 8px}
h2{font-size:20px;line-height:1.3;letter-spacing:-.01em;margin:32px 0 10px}
h3{font-size:17px;line-height:1.35;margin:20px 0 6px}
p{margin:0 0 12px}
ul,ol{margin:0 0 14px;padding-left:22px}
li{margin:0 0 6px}
.lede{font-size:17px;color:var(--text-2);margin-bottom:18px}
.note{font-size:14px;color:var(--text-2)}
.card{background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:14px 16px;margin:0 0 16px}
.card p:last-child,.card ul:last-child{margin-bottom:0}

.figs{display:flex;flex-wrap:wrap;gap:10px;margin:0 0 20px;padding:0;list-style:none}
.figs li{flex:1 1 150px;min-width:0;background:var(--surface);border:1px solid var(--line);border-radius:var(--r);padding:12px 14px;margin:0}
.figs b{display:block;font-size:24px;line-height:1.2;letter-spacing:-.02em}
.figs span{font-size:14px;color:var(--text-2)}

/* tables scroll inside their own box, never the page */
.tbl{overflow-x:auto;margin:0 0 16px;border:1px solid var(--line);border-radius:var(--r);background:var(--surface)}
.tbl table{border-collapse:collapse;width:100%;min-width:420px}
.tbl th,.tbl td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--line);font-size:15px;vertical-align:top}
.tbl th{font-size:14px;color:var(--text-2);font-weight:600}
.tbl tr:last-child td{border-bottom:0}

/* links and buttons: always a 44px box */
.row{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 16px}
.btn,.chip{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 16px;border-radius:999px;font:650 15px/1.2 var(--font);text-decoration:none;cursor:pointer}
.btn{background:var(--btn);color:var(--btn-ink);border:0}
.chip{background:var(--surface);color:var(--link);border:1px solid var(--line-strong)}
.btn:focus-visible,.chip:focus-visible,.brand:focus-visible,.top-cta:focus-visible{outline:2px solid var(--link);outline-offset:2px}

/* form controls on the tool pages */
label{display:block;font-size:14px;font-weight:600;color:var(--text-2);margin:0 0 4px}
input,select{width:100%;min-height:44px;padding:0 12px;border-radius:10px;border:1px solid var(--line-strong);background:var(--surface);color:var(--text);font:400 16px/1.2 var(--font)}
.field{margin:0 0 12px}
.grid2{display:grid;grid-template-columns:1fr;gap:0 12px}
@media (min-width:560px){.grid2{grid-template-columns:1fr 1fr}}

.foot{border-top:1px solid var(--line);margin-top:32px;padding:8px 0 28px}
.foot p{font-size:14px;color:var(--text-2);margin:8px 0}
.foot nav{display:flex;flex-wrap:wrap;gap:0 4px}
.foot nav [hidden]{display:none}
.foot nav a,.foot nav button{display:inline-flex;align-items:center;justify-content:center;min-height:44px;min-width:44px;padding:0 10px 0 0;font:400 14px/1.2 var(--font);color:var(--link);background:none;border:0;cursor:pointer;text-decoration:underline}

/* lists of links (route and city lists): each one a 44px chip */
.links{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 14px;padding:0;list-style:none}
.links li{margin:0}
.links a{display:inline-flex;align-items:center;min-height:44px;min-width:44px;padding:0 14px;border-radius:999px;background:var(--surface);border:1px solid var(--line-strong);font-size:15px;text-decoration:none}