/* lowkeyagents.com shared brand tokens. Source of truth: brand/BRAND.md
   (values copied from lowkey/packages/web/app/globals.css). Light and dark follow the
   visitor's system setting, like the app. Pages use these variables; no raw hex in page CSS
   except third-party mocks (the Stripe and email previews on /signup/). */

@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;
  src:url(/fonts/inter-latin.woff2) format("woff2");
  unicode-range:U+0000-00FF,U+0131,U+0152-0153,U+02BB-02BC,U+02C6,U+02DA,U+02DC,U+0304,U+0308,U+0329,U+2000-206F,U+20AC,U+2122,U+2191,U+2193,U+2212,U+2215,U+FEFF,U+FFFD}
@font-face{font-family:"Inter";font-style:normal;font-weight:400 700;font-display:swap;
  src:url(/fonts/inter-latin-ext.woff2) format("woff2");
  unicode-range:U+0100-02BA,U+02BD-02C5,U+02C7-02CC,U+02CE-02D7,U+02DD-02FF,U+0304,U+0308,U+0329,U+1D00-1DBF,U+1E00-1E9F,U+1EF2-1EFF,U+2020,U+20A0-20AB,U+20AD-20C0,U+2113,U+2C60-2C7F,U+A720-A7FF}

:root{
  --page:#ffffff; --panel:#f7f7f7; --card:#efefef; --hov:#e5e5e5; --pressed:#dbdbdb;
  --ink:#0f0f0f; --ink-2:#404040; --ink-3:#5c5c5c; --ink-4:#8a8a8a;
  --line:#e5e5e5; --line-hard:#d4d4d4;
  --accent:#4f46e5; --accent-text:#4338ca; --on-accent:#ffffff;
  --accent-wash:color-mix(in srgb,var(--accent) 10%,transparent);
  --ok:#16a34a; --warn-ink:#92400e; --warn-surface:#fffbeb; --warn-line:#fde68a;
  --font:"Inter",ui-sans-serif,system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;
  --mono:ui-monospace,SFMono-Regular,Menlo,monospace;
  color-scheme:light dark;
  /* old page variable names, kept so page CSS reads the kit */
  --bg:var(--page); --muted:var(--ink-3); --quote:var(--panel); --accent2:var(--accent-text); --field:var(--page);
}
@media (prefers-color-scheme:dark){:root{
  --page:#0c0c0c; --panel:#141414; --card:#1c1c1c; --hov:#262626; --pressed:#333333;
  --ink:#f0f0f0; --ink-2:#b5b5b5; --ink-3:#8a8a8a; --ink-4:#666666;
  --line:#262626; --line-hard:#3a3a3a;
  --accent:#818cf8; --accent-text:#a5b4fc; --on-accent:#ffffff;
  --accent-wash:color-mix(in srgb,var(--accent) 14%,transparent);
  --ok:#4ade80; --warn-ink:#fcd34d; --warn-surface:rgba(120,53,15,.3); --warn-line:rgba(180,83,9,.5);
  --field:var(--panel);
}}

html,body{font-family:var(--font) !important;-webkit-font-smoothing:antialiased;font-feature-settings:"cv11"}
::selection{background:color-mix(in srgb,var(--accent) 30%,transparent)}

/* shared top bar */
.lk-topnav{position:sticky;top:0;z-index:30;display:flex;align-items:center;justify-content:space-between;
  gap:16px;padding:13px 22px;background:color-mix(in srgb,var(--page) 88%,transparent);
  backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border-bottom:1px solid var(--line)}
.lk-topnav picture,.lk-lockup{display:block;height:24px;width:auto}
.lk-brand{display:flex;align-items:center;text-decoration:none}
.lk-navlinks{display:flex;gap:4px;align-items:center}
.lk-navlinks a{color:var(--ink-3);text-decoration:none;font-size:14px;padding:6px 11px;border-radius:7px}
.lk-navlinks a:hover{color:var(--ink);background:var(--hov)}
.lk-navlinks a.docs{color:var(--ink-2);border:1px solid var(--line-hard)}
.lk-navlinks a.docs:hover{color:var(--ink)}

/* links in running text */
a.inline{color:var(--accent-text);text-decoration:none;border-bottom:1px solid color-mix(in srgb,var(--accent) 35%,transparent)}
a.inline:hover{border-color:var(--accent)}

.draftbar{background:var(--warn-surface) !important;color:var(--warn-ink) !important;border-bottom:1px solid var(--warn-line) !important}
@media(max-width:760px){.lk-topnav{padding:11px 16px}}