@font-face{font-family:"IBM Plex Sans";font-style:normal;font-weight:700;font-display:swap;src:url(/assets/ibm-plex-sans-latin-700-normal-Bxkt5Cjx.woff2) format("woff2")}
/* Tallyscope marketing pages. Mobile-first, no external fonts (system stack). Every rule is scoped to .site (landing pages) or .seo-guide (the link footer inside the app's #root), because the app's own CSS also defines .btn, .card and .chip. */
.site{--bg:#f4f2ed;--surface:#fff;--surface2:#faf9f6;--line:#e2ded4;--line2:#cfc9bb;--ink:#0e2038;--ink2:#4a5a70;--accent:#0f9b86;--accentfg:#0b7565;--accentsoft:#e0f3ef;--amber:#f2a62e;--warnbg:#fdf1d9;--warn:#7a5200;--ok:#0b7565;--bad:#b3391a;--accentink:#0e2038;--band:#0e2038;--bandfg:#eaf0f6;--bandsub:#c4d0de;--shade:rgba(14,32,56,.22)}
.site{margin:0;background:var(--bg);color:var(--ink);font:16px/1.65 ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;-webkit-font-smoothing:antialiased}
.site *,.seo-guide *{box-sizing:border-box}
:is(.site,.seo-guide) a{color:var(--accentfg);text-underline-offset:2px}
:is(.site,.seo-guide) a:hover{color:var(--ink)}
:is(.site,.seo-guide) :focus-visible{outline:2px solid var(--accent);outline-offset:2px;border-radius:3px}
:is(.site,.seo-guide) .skip{position:absolute;left:-999px;top:0;background:var(--band);color:#fff;padding:8px 12px;z-index:10}
:is(.site,.seo-guide) .skip:focus{left:8px;top:8px}
:is(.site,.seo-guide) .wrap{max-width:1040px;margin:0 auto;padding:0 16px}
:is(.site,.seo-guide) .hdr{background:var(--surface);border-bottom:1px solid var(--line);position:relative}
:is(.site,.seo-guide) .hdr .wrap{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 18px;padding-top:10px;padding-bottom:10px}
:is(.site,.seo-guide) .brand{display:flex;align-items:center;gap:10px;color:var(--ink)!important;text-decoration:none;padding:7px 0;margin:-7px 0}
:is(.site,.seo-guide) .brand svg{width:30px;height:30px;display:block;flex:none}
:is(.site,.seo-guide) .brand .wm{font:700 17px/1 "IBM Plex Sans",ui-sans-serif,system-ui,sans-serif;letter-spacing:-.025em}
:is(.site,.seo-guide) .brand .wm span{color:var(--accentfg)}
:is(.site,.seo-guide) .nav{display:flex;flex-wrap:wrap;gap:4px 16px;font-size:14px}
:is(.site,.seo-guide) .nav a{color:var(--ink2);text-decoration:none;padding:4px 0}
:is(.site,.seo-guide) .nav a:hover,:is(.site,.seo-guide) .nav a[aria-current=page]{color:var(--ink);text-decoration:underline}
:is(.site,.seo-guide) .btn{display:inline-block;background:var(--accent);color:var(--accentink)!important;font-weight:600;text-decoration:none;border-radius:7px;padding:11px 20px;border:1px solid var(--accent)}
:is(.site,.seo-guide) .btn:hover{filter:brightness(1.1)}
:is(.site,.seo-guide) .btn.alt{background:var(--surface);border-color:var(--line2);color:var(--ink)!important}
:is(.site,.seo-guide) .btn.sm{padding:7px 14px;font-size:14px}
:is(.site,.seo-guide) .crumbs{font-size:13px;color:var(--ink2);padding:14px 0 0}
:is(.site,.seo-guide) .crumbs ol{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;align-items:center;gap:4px}
:is(.site,.seo-guide) .crumbs li{display:inline-flex;align-items:center}
:is(.site,.seo-guide) .crumbs li+li::before{content:"/";margin-right:4px;color:var(--line2)}
:is(.site,.seo-guide) .hero{padding:28px 0 20px}
:is(.site,.seo-guide) h1{font-size:clamp(28px,5vw,42px);line-height:1.15;margin:8px 0 14px;letter-spacing:-.01em}
:is(.site,.seo-guide) h2{font-size:clamp(21px,3.2vw,26px);line-height:1.25;margin:34px 0 10px}
:is(.site,.seo-guide) h3{font-size:17px;margin:20px 0 6px}
:is(.site,.seo-guide) .lead{font-size:18px;color:var(--ink2);max-width:46em;margin:0 0 20px}
:is(.site,.seo-guide) .cta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:18px 0}
:is(.site,.seo-guide) .note{font-size:14px;color:var(--ink2)}
:is(.site,.seo-guide) :is(main,.gbody) p,:is(.site,.seo-guide) :is(main,.gbody) li{max-width:46em}
:is(.site,.seo-guide) :is(main,.gbody) ul,:is(.site,.seo-guide) :is(main,.gbody) ol{padding-left:22px}
:is(.site,.seo-guide) :is(main,.gbody) li{margin:4px 0}
:is(.site,.seo-guide) .card{background:var(--surface);border:1px solid var(--line);border-radius:10px;padding:16px 18px;margin:16px 0}
:is(.site,.seo-guide) .card.warn{background:var(--warnbg);border-color:var(--warn);color:var(--warn)}
:is(.site,.seo-guide) .grid{display:grid;gap:12px;grid-template-columns:1fr}
:is(.site,.seo-guide) .grid .card{margin:0}
:is(.site,.seo-guide) .table-wrap{overflow-x:auto;margin:16px 0;background:linear-gradient(to right,var(--surface) 30%,transparent) 0 0/40px 100% no-repeat local,linear-gradient(to left,var(--surface) 30%,transparent) 100% 0/40px 100% no-repeat local,radial-gradient(farthest-side at 0 50%,var(--shade),transparent) 0 0/14px 100% no-repeat scroll,radial-gradient(farthest-side at 100% 50%,var(--shade),transparent) 100% 0/14px 100% no-repeat scroll,var(--surface)}
:is(.site,.seo-guide) table{border-collapse:collapse;width:100%;font-size:14.5px;background:transparent}
:is(.site,.seo-guide) th,:is(.site,.seo-guide) td{border:1px solid var(--line);padding:8px 10px;text-align:left;vertical-align:top}
:is(.site,.seo-guide) th{background:color-mix(in srgb,var(--line) 45%,transparent)}
:is(.site,.seo-guide) td.n,:is(.site,.seo-guide) th.n{text-align:right;font-variant-numeric:tabular-nums}
:is(.site,.seo-guide) .ok{color:var(--ok,#0b7565);font-weight:600}:is(.site,.seo-guide) .bad{color:var(--bad,#b3391a);font-weight:600}
:is(.site,.seo-guide) details{background:var(--surface);border:1px solid var(--line);border-radius:8px;margin:8px 0;padding:0 14px}
:is(.site,.seo-guide) summary{cursor:pointer;font-weight:600;padding:12px 0}
:is(.site,.seo-guide) details[open] summary{border-bottom:1px solid var(--line);margin-bottom:8px}
:is(.site,.seo-guide) details p{margin:0 0 12px}
:is(.site,.seo-guide) .related ul{list-style:none;padding:0;display:grid;gap:8px;grid-template-columns:1fr}
:is(.site,.seo-guide) .related li{margin:0;max-width:none}
:is(.site,.seo-guide) .related a{display:block;background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:10px 14px;text-decoration:none;font-weight:600}
:is(.site,.seo-guide) .related a small{display:block;font-weight:400;color:var(--ink2)}
:is(.site,.seo-guide) .band{background:var(--band);color:var(--bandfg);border:1px solid var(--band);border-radius:12px;padding:22px 20px;margin:36px 0 10px}
:is(.site,.seo-guide) .band h2{margin:0 0 6px;color:#fff}.band p{margin:0 0 14px;color:var(--bandsub)}
:is(.site,.seo-guide) .band .btn{color:var(--accentink)!important}:is(.site,.seo-guide) .band .btn.alt{background:#fff;border-color:#fff}
:is(.site,.seo-guide) .band{display:flex;flex-wrap:wrap;gap:10px 12px;align-items:center}:is(.site,.seo-guide) .band h2,:is(.site,.seo-guide) .band p{flex:0 0 100%}:is(.site,.seo-guide) .band p{margin-bottom:4px}:is(.site,.seo-guide) .band .btn{min-height:44px;box-sizing:border-box;display:inline-flex;align-items:center;justify-content:center}
@media(max-width:520px){:is(.site,.seo-guide) .band .btn{flex:1 1 100%}}
:is(.site,.seo-guide) .ftr{border-top:1px solid var(--line);background:var(--surface);margin-top:44px;padding:26px 0;font-size:14px;color:var(--ink2)}
:is(.site,.seo-guide) .ftr .cols{display:grid;gap:18px 16px;grid-template-columns:repeat(2,minmax(0,1fr))}
:is(.site,.seo-guide) .ftr h2{font-size:13px;text-transform:uppercase;letter-spacing:.06em;margin:0 0 8px;color:var(--ink)}
:is(.site,.seo-guide) .ftr ul{list-style:none;padding:0;margin:0}.ftr li{margin:3px 0}
:is(.site,.seo-guide) .ftr a{color:var(--ink2)}
:is(.site,.seo-guide) .meta{font-size:13px;color:var(--ink2)}
:is(.site,.seo-guide) code,:is(.site,.seo-guide) kbd{font:13.5px ui-monospace,SFMono-Regular,Menlo,monospace;background:var(--surface2);border:1px solid var(--line);border-radius:4px;padding:1px 5px}
:is(.site,.seo-guide) pre{background:var(--surface);border:1px solid var(--line);border-radius:8px;padding:12px 14px;overflow-x:auto;white-space:pre-wrap;overflow-wrap:anywhere;font:13px/1.5 ui-monospace,SFMono-Regular,Menlo,monospace}
@media(min-width:640px){:is(.site,.seo-guide) .grid{grid-template-columns:1fr 1fr}:is(.site,.seo-guide) .related ul{grid-template-columns:1fr 1fr}:is(.site,.seo-guide) .ftr .cols{grid-template-columns:repeat(4,minmax(0,1fr))}:is(.site,.seo-guide) .ftr-lang ul{columns:2}}
@media(min-width:900px){:is(.site,.seo-guide) .ftr-lang ul{columns:3}}
@media(min-width:900px){:is(.site,.seo-guide) .grid.three{grid-template-columns:repeat(3,1fr)}:is(.site,.seo-guide) .hero{padding:44px 0 26px}}

:is(.site,.seo-guide) .ftr-btn{font:inherit;color:var(--accentfg);background:none;border:0;padding:0;text-decoration:underline;text-underline-offset:2px;cursor:pointer}
@media(pointer:coarse),(max-width:767px){:is(.site,.seo-guide) .ftr li a,:is(.site,.seo-guide) .ftr-mail a,:is(.site,.seo-guide) .ftr-btn{display:inline-flex;align-items:center;min-height:44px;min-width:44px}:is(.site,.seo-guide) .ftr li{margin:0}}
:is(.site,.seo-guide) details.ftr-lang{background:none;border:0;border-radius:0;margin:18px 0 0;padding:0}
:is(.site,.seo-guide) .ftr-lang summary{display:flex;align-items:center;min-height:44px;margin:0;padding:0;border:0;font-size:13px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:var(--ink)}
:is(.site,.seo-guide) .ftr-lang[open] summary{border:0;margin:0}
:is(.site,.seo-guide) .ftr-lang ul{column-gap:16px}
:is(.site,.seo-guide) .ftr-lang li{break-inside:avoid}
:is(.site,.seo-guide) .ftr-mail{display:flex;flex-wrap:wrap;gap:0 18px}
@media(prefers-reduced-motion:reduce){:is(.site,.seo-guide) *{scroll-behavior:auto!important}}


/* The home page's first paint is the app's own empty state as static markup (seo/home.mjs homeRoot), styled by the app's stylesheet, not this file. This file only styles the site link footer that follows it in #root (.seo-guide), for crawlers and no-JS readers; React replaces it on mount. It uses the app's tokens so it follows the light and dark themes. */
.seo-guide{--surface2:var(--surface-2);--line2:var(--line-strong);--ink2:var(--ink-2);--accentfg:var(--accent-fg);--accentsoft:var(--accent-soft);--warnbg:var(--warn-bg);color:var(--ink);font:15px/1.65 "IBM Plex Sans",ui-sans-serif,system-ui,sans-serif}
.seo-guide .gbody{padding-top:8px}
.seo-guide h2{font-size:clamp(19px,3vw,23px)}
/* Boot background for the app page, matching src/index.css --bg (light). A stored dark choice cannot be read before JS runs, so those visitors see a brief light boot colour. */
/* :where() keeps specificity at zero so the app's own body background always wins once loaded. */
:where(body:not(.site)){background:#f4f2ed}
html[data-theme=dark] :where(body:not(.site)){background:#0a1626}
/* Home footer edges line up with the page content (max-w-6xl, 16/24/32px gutters) */
.seo-guide .wrap{max-width:1152px;padding:0 16px}
@media(min-width:640px){.seo-guide .wrap{padding:0 24px}}
@media(min-width:1024px){.seo-guide .wrap{padding:0 32px}}
:is(.site,.seo-guide) .ftr-lang summary::after{content:"";width:8px;height:8px;margin:-3px 0 0 10px;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg)}
:is(.site,.seo-guide) .ftr-lang[open] summary::after{margin-top:3px;transform:rotate(225deg)}
/* Tool pages: drop zone (hand-over script), sample link, numbered steps */
.site .sr{position:absolute;width:1px;height:1px;margin:-1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.site .try-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 16px;margin:10px 0 2px}
.site .try-row .btn{min-height:44px;display:inline-flex;align-items:center;padding:8px 16px}
.site .try .note{margin:4px 0 0}
.site .steps{counter-reset:s;list-style:none;padding-left:0!important}
.site .steps li{counter-increment:s;position:relative;padding-left:38px;margin:10px 0}
.site .steps li::before{content:counter(s);position:absolute;left:0;top:1px;width:26px;height:26px;border-radius:50%;background:var(--accentsoft);color:var(--accentfg);font-weight:700;text-align:center;line-height:26px}
.site figure.diagram,.site figure.shot{margin:20px 0}
.site figure.shot img{display:block;max-width:100%;height:auto;border:1px solid var(--line);border-radius:8px;background:var(--surface)}
.site figure.shot.narrow img{max-width:375px;width:100%}
.site figure figcaption{font-size:13px;color:var(--ink2);margin-top:8px}
.site dl.defs{margin:12px 0;display:grid;grid-template-columns:max-content 1fr;gap:6px 16px}.site dl.defs dt{font-weight:700}.site dl.defs dd{margin:0}
@media(max-width:600px){.site dl.defs{grid-template-columns:1fr;gap:0}.site dl.defs dd{margin-bottom:8px}}
.site .table-wrap caption,.site table caption{caption-side:top;text-align:left;font-weight:600;padding:0 0 6px}
/* Drop zone: icon, filled "Choose files" button, helper text. The label wraps the real file input (transparent, covers the whole zone), so click, drop and keyboard all work without script. */
.site .try{margin:4px 0 0}
.site .drop{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;text-align:center;width:100%;min-height:176px;padding:22px 16px;border:2px dashed var(--line2);border-radius:12px;background:var(--surface);cursor:pointer}
.site .drop:hover,.site .drop.over{border-color:var(--accent);background:var(--accentsoft)}
.site .drop:has(input:focus-visible){border-color:var(--accent);background:var(--accentsoft);outline:3px solid var(--accent);outline-offset:3px}
.site .drop input{position:absolute;inset:0;width:100%;height:100%;opacity:0;cursor:pointer}
.site .drop-ic{width:36px;height:36px;color:var(--accentfg);flex:none}
.site .drop-t{font-weight:600;font-size:18px}
.site .drop-s{font-size:13px;color:var(--ink2);max-width:34em}
.site .drop-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;margin-top:6px;padding:0 24px;border-radius:7px;background:var(--accent);border:1px solid var(--accent);color:var(--accentink);font-weight:600}
.site .drop:hover .drop-btn{filter:brightness(1.1)}
/* Header: wide screens show the links; up to 600px a native <details> Menu (no script) holds them next to the app button. */
:is(.site,.seo-guide) .hdr-end{display:flex;align-items:center;gap:8px}
.site .menu{display:none}
@media(max-width:600px){
.site .hdr .nav{display:none}
.site .hdr .wrap{flex-wrap:nowrap}
.site .menu{display:block;background:none;border:0;border-radius:0;margin:0;padding:0}
.site .menu summary{list-style:none;display:inline-flex;align-items:center;min-height:44px;min-width:44px;margin:0;padding:0 14px;border:1px solid var(--line2);border-radius:7px;background:var(--surface);color:var(--ink);font-size:14px;font-weight:600}
.site .menu summary::-webkit-details-marker{display:none}
.site .menu[open] summary{margin:0;border:1px solid var(--accent)}
.site .menu nav{position:absolute;left:0;right:0;top:100%;z-index:20;display:flex;flex-direction:column;padding:4px 16px 10px;background:var(--surface);border-bottom:1px solid var(--line2);box-shadow:0 10px 24px var(--shade)}
.site .menu nav a{display:flex;align-items:center;min-height:44px;color:var(--ink);text-decoration:none;font-size:16px;border-top:1px solid var(--line)}
.site .menu nav a:first-child{border-top:0}
.site .menu nav a[aria-current=page]{color:var(--accentfg);font-weight:600}
.site .hdr .btn.sm{min-height:44px;display:inline-flex;align-items:center}
.site .hide-s{display:none}
.site .crumbs a{display:inline-flex;align-items:center;min-height:44px;padding:0 4px}
.site .crumbs{padding-top:4px}
}
.site .scroll-hint{display:none;margin:0 0 6px;font-size:13px;color:var(--ink2)}
@media(max-width:600px){.site .scroll-hint{display:block}}
.site .tcap{margin:16px 0 4px;font-weight:600}
.site .row-break{background:var(--warnbg)}
.site .row-break td:first-child{border-left:4px solid var(--bad)}
.site .mark{display:block;font-size:11px;font-weight:700;line-height:1.3;letter-spacing:.04em;text-transform:uppercase;color:var(--bad)}
/* Dark theme for the static pages. public/theme-init.js (inlined in every page head, allowed by CSP hash) sets data-theme on <html> from the app's saved choice and defaults to light, like the app; the media query covers the case where that script cannot run. Tokens equal the app's dark tokens (src/index.css). */
html[data-theme=dark] .site{--bg:#0a1626;--surface:#0e2038;--surface2:#132a47;--line:#1f3857;--line2:#2d4a6e;--ink:#eaf0f6;--ink2:#a9b6c7;--accent:#2cc4ab;--accentfg:#4fd6bf;--accentsoft:#123a45;--warnbg:#3a2c12;--warn:#f2a62e;--ok:#4fd6bf;--bad:#f28b6b;--band:#0e2038;--shade:rgba(0,0,0,.5);color-scheme:dark}
@media(prefers-color-scheme:dark){html:not([data-theme]) .site{--bg:#0a1626;--surface:#0e2038;--surface2:#132a47;--line:#1f3857;--line2:#2d4a6e;--ink:#eaf0f6;--ink2:#a9b6c7;--accent:#2cc4ab;--accentfg:#4fd6bf;--accentsoft:#123a45;--warnbg:#3a2c12;--warn:#f2a62e;--ok:#4fd6bf;--bad:#f28b6b;--band:#0e2038;--shade:rgba(0,0,0,.5);color-scheme:dark}}
html[data-theme=dark] .site .band{border-color:var(--line2)}
html[data-theme=dark] .site figure.shot img,html[data-theme=dark] .site figure.shot-pair img{border-color:var(--line2)}