/* Avalon lab site: homepage + generated pages under /site/ (scripts/build_lab_site.py).
   Builds on the tokens in public-site.css. Kept in its own file because the site CSP is
   style-src 'self' -- an inline <style> block is silently ignored in production. */

/* homepage */
.lab-hero{padding-block:56px 36px;border-bottom:1px solid var(--line)}
.lab-eyebrow{font-size:12px;letter-spacing:.12em;text-transform:uppercase;color:var(--green);font-weight:700}
.lab-hero h1{font-size:clamp(34px,5.2vw,58px);line-height:1.05;letter-spacing:-.02em;margin:14px 0 18px;max-width:16ch;text-wrap:balance}
.lab-hero h1 em{font-style:normal;background:var(--lime);padding:0 .12em;border-radius:4px}
.lab-hero p.lead{font-size:18px;color:var(--muted);max-width:58ch;margin:0 0 24px}
.lab-cta{display:flex;flex-wrap:wrap;gap:10px}
.lab-cta a{padding:12px 18px;border-radius:999px;font-weight:700;text-decoration:none}
.lab-cta .primary{background:var(--ink);color:#fff}
.lab-cta .ghost{border:1px solid var(--ink);color:var(--ink)}
.lab-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;padding-block:28px}
.lab-stat{background:#fff;border:1px solid var(--line);border-radius:10px;padding:16px}
.lab-stat b{display:block;font-size:30px;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.lab-stat span{font-size:13.5px;color:var(--muted)}
.lab-section{padding-block:40px;border-top:1px solid var(--line)}
.lab-section h2{font-size:28px;letter-spacing:-.01em;margin:6px 0 8px}
.lab-section > .shell > p.sub{color:var(--muted);max-width:60ch;margin:0 0 20px}
.lab-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,320px),1fr));gap:14px}
.lab-card{background:#fff;border:1px solid var(--line);border-radius:12px;padding:20px;display:flex;flex-direction:column;gap:10px}
.lab-card .tag{align-self:flex-start;font-size:12px;font-weight:700;padding:3px 10px;border-radius:999px;background:var(--green-soft);color:var(--green)}
.lab-card .tag.next{background:#f1efe6;color:#6b5d2e}
.lab-card h3{margin:0;font-size:19px}
.lab-card .lab-metric{font-size:26px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.lab-card .lab-metric small{display:block;font-size:13px;font-weight:500;color:var(--muted);letter-spacing:0}
.lab-card p{margin:0;color:var(--muted);font-size:14.5px}
.lab-card .learn{margin-top:auto;font-weight:700;color:var(--green);text-decoration:none}
.lab-steps{display:grid;grid-template-columns:repeat(auto-fit,minmax(220px,1fr));gap:14px}
.lab-steps div{border-left:3px solid var(--lime);padding:4px 0 4px 14px}
.lab-steps h3{margin:0 0 4px;font-size:16px}
.lab-steps p{margin:0;color:var(--muted);font-size:14.5px}
.lab-books{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:14px}
.lab-book{border:1px solid var(--line);border-radius:12px;padding:18px;background:#fff}
.lab-book h3{margin:0 0 6px;font-size:16.5px}
.lab-book p{margin:0 0 10px;color:var(--muted);font-size:14px}
.lab-book a{font-weight:700;color:var(--green);text-decoration:none}
.lab-sub{background:var(--dark);color:#fff;border-radius:16px;padding:28px;display:grid;gap:14px}
.lab-sub h2{color:#fff;margin:0}
.lab-sub p{color:#c9d2c9;margin:0;max-width:56ch}
.lab-sub form{display:flex;flex-wrap:wrap;gap:8px}
.lab-sub input[type=email]{flex:1 1 240px;min-width:0;padding:12px 14px;border-radius:999px;border:0;font-size:15px}
.lab-sub button{padding:12px 20px;border-radius:999px;border:0;background:var(--lime);font-weight:800;cursor:pointer}
.lab-sub button[disabled]{opacity:.6;cursor:default}
.lab-sub .hp{position:absolute;left:-9999px;width:1px;height:1px;opacity:0}
.lab-note{font-size:12.5px;color:var(--muted);max-width:80ch}
.lab-note-wrap{padding-block:20px 40px}

/* generated article / hub pages */
.lab-article{max-width:820px;margin:0 auto;padding:36px 20px 80px}
.lab-crumbs ol{display:flex;flex-wrap:wrap;gap:6px;margin:0 0 22px;padding:0;list-style:none;font-size:12.5px;color:var(--muted)}
.lab-crumbs li+li:before{content:"/";margin-right:6px;color:#b5bbb3}
.lab-crumbs a{color:var(--muted);text-decoration:none}
.lab-crumbs a:hover{color:var(--ink);text-decoration:underline}
.lab-article h1{margin:8px 0 12px;font-size:clamp(30px,4.6vw,46px);line-height:1.08;letter-spacing:-.015em;text-wrap:balance}
.lab-meta{display:flex;flex-wrap:wrap;gap:6px 16px;margin:0 0 22px;color:var(--muted);font-size:12.5px}
.lab-standfirst{font-size:18px;color:var(--muted);margin:0 0 24px}
.lab-tldr{margin:0 0 28px;padding:20px 22px;background:var(--green-soft);border:1px solid #c9dccd;border-radius:12px}
.lab-tldr h2{margin:0 0 4px;font-size:15px;text-transform:uppercase;letter-spacing:.1em;color:var(--green)}
.lab-tldr .period{margin:0 0 14px;color:#31513c;font-size:13px}
.lab-tldr dl{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;margin:0}
.lab-tldr dl div{background:#fff;border:1px solid #d6e5da;border-radius:8px;padding:12px}
.lab-tldr dt{font-size:12px;color:var(--muted)}
.lab-tldr dd{margin:2px 0 0;font-size:22px;font-weight:800;letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.lab-tldr .summary{margin:14px 0 0;font-size:14.5px}
.lab-toc{margin:0 0 30px;padding:16px 20px;border:1px solid var(--line);border-radius:10px;background:#fff}
.lab-toc strong{font-size:12px;text-transform:uppercase;letter-spacing:.1em;color:var(--muted)}
.lab-toc ol{margin:8px 0 0;padding-left:20px}
.lab-toc li{margin:3px 0;font-size:14px}
.lab-toc a{color:var(--green);text-decoration:none}
.lab-body{font-size:16px;color:#2f352f}
.lab-body h2{margin:40px 0 10px;color:var(--ink);font-size:24px;line-height:1.25;scroll-margin-top:90px}
.lab-body h3{margin:26px 0 8px;color:var(--ink);font-size:18px}
.lab-body p,.lab-body li{line-height:1.75}
.lab-body a{color:var(--green)}
.lab-body code{padding:1px 5px;background:#eef1ec;border-radius:4px;font-size:.92em}
.lab-body blockquote{margin:20px 0;padding:12px 18px;border-left:3px solid var(--lime);background:#fff;color:var(--muted)}
.lab-table-wrap{overflow-x:auto;margin:20px 0}
.lab-body table{width:100%;border-collapse:collapse;font-size:14.5px;background:#fff}
.lab-body th,.lab-body td{padding:10px 12px;border:1px solid var(--line);text-align:left;vertical-align:top}
.lab-body th{background:var(--green-soft);color:var(--ink)}
.lab-todo{padding:14px 18px;border:1px dashed #c9b26a;border-radius:8px;background:#fbf6e6;color:#6b5d2e}
.lab-playbook{margin:34px 0;padding:22px;border-radius:12px;background:#fff;border:1px solid var(--line);box-shadow:var(--shadow-soft)}
.lab-playbook h2{margin:0 0 6px;font-size:20px}
.lab-playbook p{margin:0 0 14px;color:var(--muted);font-size:14.5px}
.lab-playbook .lab-cta a{font-size:14px;padding:10px 16px}
.lab-workflow{margin:30px 0;padding:18px 22px;background:var(--green-soft);border:1px solid #c9dccd;border-radius:12px}
.lab-workflow h2{margin:0 0 10px;font-size:18px}
.lab-workflow ul{display:grid;gap:10px;margin:0;padding:0;list-style:none}
.lab-workflow a{font-weight:700;overflow-wrap:anywhere}
.lab-workflow span{display:block;margin-top:2px;color:var(--muted);font-size:14px}
.lab-tools-line{margin:24px 0;padding:12px 16px;background:#fff;border:1px solid var(--line);border-radius:10px;font-size:14.5px;overflow-wrap:anywhere}
.lab-tools-line a{color:var(--green);font-weight:650}
.lab-faq details{border-bottom:1px solid var(--line);padding:12px 0}
.lab-faq summary{cursor:pointer;font-weight:700}
.lab-faq details p{margin:8px 0 0}
.lab-related ul,.lab-children ul{padding-left:20px}
.lab-children li{margin:6px 0}
.lab-children .muted,.lab-muted{color:var(--muted)}
.lab-disclosures{margin-top:40px;padding-top:18px;border-top:1px solid var(--line);display:grid;gap:8px;font-size:12.5px;color:var(--muted)}
.lab-disclosures p{margin:0}
.lab-disclosures .warn{color:#7a3b16;font-weight:650}
.lab-hub-list{display:grid;gap:12px;margin:18px 0;padding:0;list-style:none}
.lab-hub-list li{padding:16px 18px;background:#fff;border:1px solid var(--line);border-radius:10px}
.lab-hub-list a{font-weight:750;color:var(--ink);text-decoration:none}
.lab-hub-list a:hover{color:var(--green)}
.lab-hub-list span{display:block;margin-top:4px;color:var(--muted);font-size:14px}
.lab-tool{margin:0 0 30px;padding:22px;background:#fff;border:1px solid var(--line);border-radius:12px;box-shadow:var(--shadow-soft)}
.lab-tool textarea,.lab-tool input,.lab-tool select{width:100%;max-width:100%;padding:10px 12px;border:1px solid var(--line);border-radius:8px;font:inherit}
.lab-tool button{padding:10px 16px;border:0;border-radius:999px;background:var(--ink);color:#fff;font-weight:700;cursor:pointer}
.lab-children ul.lab-hub-list{padding-left:0}
.lab-hub-list strong{display:block}
.lab-hub-list .kind{display:block;margin:0 0 4px;font-size:11px;font-weight:800;text-transform:uppercase;letter-spacing:.08em;color:var(--green)}

/* Free · Pro · Pro+ tables (content/lab/data/tool-tiers.yaml, written by build_lab_site.py) */
.lab-tiers{margin:34px 0}
.lab-tiers h2{margin:0 0 8px}
.lab-tiers-table{min-width:520px}
.lab-tiers-table thead th{white-space:nowrap}
.lab-tiers-table tbody th{font-weight:600;background:#fff;min-width:150px}
.lab-tiers-table td{font-variant-numeric:tabular-nums}
.lab-tiers-tools th,.lab-tiers-tools td{font-size:13.5px}
.lab-tiers-soon{display:inline-block;margin-left:6px;padding:1px 7px;border-radius:999px;background:#fbf6e6;color:#6b5d2e;font-size:11px;font-weight:700;letter-spacing:.02em;text-transform:uppercase}
.lab-tiers-note{font-size:14px;color:var(--muted)}
@media (max-width:600px){
  .lab-tiers-table{min-width:0;font-size:13px}
  .lab-body .lab-tiers-table th,.lab-body .lab-tiers-table td{padding:8px 6px}
  .lab-tiers-table tbody th{min-width:0}
  .lab-tiers-table thead th{white-space:normal}
  .lab-tiers-tools{min-width:560px}
}

/* ── Design pass 2026-10-04: shared tokens, focus, tool first screen, tool grid, tables ── */
:root{--radius-sm:8px;--radius:12px;--radius-lg:16px;--shadow-card:0 1px 2px rgba(19,23,19,.04),0 8px 24px rgba(19,23,19,.06);--shadow-lift:0 2px 4px rgba(19,23,19,.05),0 14px 34px rgba(19,23,19,.10);--tint:#f4f8f3;--focus-ring:#1e5b3a}
/* one visible keyboard focus everywhere (the tools' lime outline was about 1.2:1 against the page) */
.lab-article a:focus-visible,.lab-article button:focus-visible,.lab-article summary:focus-visible,.lab-article [tabindex]:focus-visible,
.lab-article input:focus-visible,.lab-article select:focus-visible,.lab-article textarea:focus-visible,
.site-header a:focus-visible,.legal-footer a:focus-visible,.lab-section a:focus-visible,.lab-sub input:focus-visible,.lab-sub button:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}

/* tool pages: the tool is the first screen */
.lab-article-tool h1{font-size:clamp(28px,3.6vw,40px);margin:6px 0 10px}
.lab-tool-lead{font-size:clamp(16px,1.6vw,18.5px);color:#4b534b;margin:0 0 12px;max-width:62ch}
.lab-article-tool .lab-meta{margin:0 0 18px}
.lab-tool{border-radius:var(--radius-lg);box-shadow:var(--shadow-card);padding:clamp(14px,2.4vw,26px)}
@media (min-width:1040px){.lab-article-tool .lab-tool{margin-inline:-70px}}
/* the big drop zone shared by every file tool (each tool keeps its own class; these rules give them one look) */
.lab-tool :is(.pt-drop,.ic-drop,.ir-drop,.mg-drop,.ot-drop,.pc-drop,.ps-drop,.rb-drop,.sm-drop,.st-drop,.up-drop,.vm-drop,.vt-drop):not(.is-compact){
  display:grid;justify-items:center;align-content:center;gap:2px;min-height:clamp(170px,24vw,230px);padding:22px 18px;
  border:2px dashed #a9c2b0;border-radius:var(--radius-lg);background-color:var(--tint)}
.lab-tool :is(.pt-drop,.ic-drop,.ir-drop,.mg-drop,.ot-drop,.pc-drop,.ps-drop,.rb-drop,.sm-drop,.st-drop,.up-drop,.vm-drop,.vt-drop):not(.is-compact)::before{
  content:"";width:56px;height:56px;margin-bottom:10px;border-radius:999px;background:#fff url(/assets/icons/upload.svg) center/28px no-repeat;box-shadow:0 2px 10px rgba(30,91,58,.16)}
.lab-tool :is(.pt-drop,.ic-drop,.ir-drop,.mg-drop,.ot-drop,.pc-drop,.ps-drop,.rb-drop,.sm-drop,.st-drop,.up-drop,.vm-drop,.vt-drop):not(.is-compact) strong{font-size:clamp(17px,2vw,21px);letter-spacing:-.01em}
.lab-tool :is(.pt-drop,.ic-drop,.ir-drop,.mg-drop,.ot-drop,.pc-drop,.ps-drop,.rb-drop,.sm-drop,.st-drop,.up-drop,.vm-drop,.vt-drop):is(:hover,.is-over){border-color:var(--green)}
.lab-tool :is(.pt-drop,.ic-drop,.ir-drop,.mg-drop,.ot-drop,.pc-drop,.ps-drop,.rb-drop,.sm-drop,.st-drop,.up-drop,.vm-drop,.vt-drop):focus-visible{outline:3px solid var(--focus-ring);outline-offset:3px}
/* main action in brand green; secondary buttons stay outlined */
.lab-tool :is(.pt-btn,.bc-btn,.ic-btn,.inv-btn,.ir-btn,.mg-btn,.ot-btn,.pc-btn,.ps-btn,.qr-btn,.rb-btn,.sm-btn,.st-btn,.up-btn,.vm-btn,.vt-btn,.yt-btn):not(.ghost),.lab-tool button[type=submit]:not(.ghost){background:var(--green);color:#fff;min-height:42px}
.lab-tool button[type=submit]:not(.ghost){padding-inline:20px}
.lab-tool :is(.pt-btn,.bc-btn,.ic-btn,.inv-btn,.ir-btn,.mg-btn,.ot-btn,.pc-btn,.ps-btn,.qr-btn,.rb-btn,.sm-btn,.st-btn,.up-btn,.vm-btn,.vt-btn,.yt-btn).ghost{min-height:42px}
/* results: download links read as buttons */
.lab-tool :is(.pt-dl,.ic-dl,.ir-dl,.ps-dl,.vm-dl,.vt-dl){display:inline-flex;align-items:center;padding:7px 14px;border-radius:999px;background:var(--green-soft);color:var(--green)}
.lab-tool :is(.pt-dl,.ic-dl,.ir-dl,.ps-dl,.vm-dl,.vt-dl):hover{background:#d6e8da}

/* table of contents after the tool: a compact row of links */
.lab-toc-after{padding:12px 16px;margin:0 0 26px;background:transparent}
.lab-toc-after ol{display:flex;flex-wrap:wrap;gap:6px 8px;margin:8px 0 0;padding:0;list-style:none}
.lab-toc-after li{margin:0}
.lab-toc-after a{display:inline-block;padding:5px 11px;border:1px solid var(--line);border-radius:999px;background:#fff;font-size:13.5px;color:var(--ink)}
.lab-toc-after a:hover{border-color:var(--green);color:var(--green)}

/* /tools/ grid (build_lab_site.tool_grid_html; chips and search switched on by lab-site.js) */
.lab-tool-grid{margin:8px 0 30px}
.lab-tool-grid h2{margin:0 0 12px;font-size:22px}
.lab-article-wide{max-width:1080px}
.lab-article-wide>:not(.lab-tool-grid){max-width:780px}
.lab-filter{display:grid;gap:12px;margin:0 0 16px}
.lab-search{width:100%;max-width:420px;padding:11px 14px 11px 40px;border:1px solid #b9c1b6;border-radius:999px;font:inherit;font-size:15px;color:var(--ink);background:#fff url(/assets/icons/search.svg) 14px center/18px no-repeat}
.lab-chips{display:flex;flex-wrap:wrap;gap:8px}
.lab-chip{display:inline-flex;align-items:center;gap:6px;min-height:36px;padding:6px 14px;border:1px solid #b9c1b6;border-radius:999px;background:#fff;color:var(--ink);font:inherit;font-size:14px;font-weight:650;cursor:pointer}
.lab-chip span{font-size:12px;font-weight:700;color:var(--muted);font-variant-numeric:tabular-nums}
.lab-chip:hover{border-color:var(--green)}
.lab-chip[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.lab-chip[aria-pressed=true] span{color:#d5dbd3}
.lab-chip:focus-visible,.lab-search:focus-visible{outline:3px solid var(--focus-ring);outline-offset:2px}
.lab-tool-cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,250px),1fr));gap:12px;margin:0;padding:0;list-style:none}
.lab-tool-card a{display:flex;gap:14px;align-items:flex-start;height:100%;padding:16px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);color:var(--ink);text-decoration:none;transition:border-color .15s,box-shadow .15s,transform .15s}
.lab-tool-card a:hover{border-color:#b9c9bc;box-shadow:var(--shadow-lift);transform:translateY(-1px)}
.lab-tool-card strong{display:block;font-size:15.5px;line-height:1.3;margin:1px 0 4px}
.lab-tool-text{min-width:0}
.lab-tool-text span{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13.5px;line-height:1.45;color:var(--muted)}
.lab-tool-icon{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:11px;background:#eceee9}
.lab-tool-icon img{display:block;width:22px;height:22px}
.lab-tool-icon.is-pdf{background:#fdecea}
.lab-tool-icon.is-image{background:var(--sky)}
.lab-tool-icon.is-media{background:var(--lilac)}
.lab-tool-icon.is-text{background:var(--mint)}
.lab-tool-icon.is-money{background:#faf1d6}
.lab-filter-empty{margin:14px 0 0}
.lab-home-tools-cta{margin-top:18px}
@media (max-width:600px){.lab-home-tools .lab-tool-card:nth-child(n+5){display:none}}

/* FAQ as a list of cards */
.lab-faq details{margin:8px 0;padding:0;border:1px solid var(--line);border-radius:var(--radius);background:#fff}
.lab-faq summary{padding:14px 18px;list-style-position:inside}
.lab-faq details[open] summary{border-bottom:1px solid var(--line)}
.lab-faq details p{margin:0;padding:12px 18px 16px}
@media (prefers-reduced-motion:reduce){.lab-tool-card a{transition:none}.lab-tool-card a:hover{transform:none}}

/* Free · Pro · Pro+ tables: tier header band, Pro column highlighted */
.lab-body .lab-tiers-table{border-collapse:separate;border-spacing:0;border:1px solid var(--line);border-radius:var(--radius)}
.lab-body .lab-tiers-table th,.lab-body .lab-tiers-table td{border:0;border-bottom:1px solid var(--line)}
.lab-body .lab-tiers-table tbody tr:last-child>*{border-bottom:0}
.lab-body .lab-tiers-table thead th{background:#eef2ec;font-size:13px;letter-spacing:.02em}
.lab-body .lab-tiers-table thead th:first-child{border-top-left-radius:var(--radius)}
.lab-body .lab-tiers-table thead th:last-child{border-top-right-radius:var(--radius)}
.lab-body .lab-tiers-table:has(thead th:nth-child(4)) td:nth-child(3){background:#f3f8ef}
.lab-body .lab-tiers-table:has(thead th:nth-child(4)) thead th:nth-child(3){background:var(--green);color:#fff}
.lab-body .lab-tiers-table tbody tr:nth-child(even) th[scope=row]{background:#fafbf8}
.lab-body .lab-tiers-table td[colspan]{text-align:center;color:var(--green);font-weight:650;background:#fff}