/* The small "I'm a brand" exit on creator signup pages (home and Today when
   signed out, /beta, /beta-confirmed, /beta-welcome, /signin). The site is
   creator-first, so this is never a 50/50 choice: one quiet, always-visible
   pill that sends brands to /for-brands instead of the creator waitlist.
   Shared by app.css pages and the standalone beta.css pages, so every colour
   falls back from the app token to the beta token. Clicks are counted by
   public/js/analytics.js ([data-brand-exit], an aggregate count only). */
.brand-exit{--be-ink:var(--ink-2,var(--mut));--be-line:var(--rule,var(--line));--be-pane:var(--pane,var(--card));
 display:inline-flex;align-items:center;gap:8px;min-height:40px;padding:0 14px 0 6px;border:1px solid var(--be-line);border-radius:999px;
 background:var(--be-pane);color:var(--be-ink);font:inherit;font-size:13.5px;font-weight:500;line-height:1.25;text-decoration:none;white-space:nowrap;
 transition:border-color .15s ease,color .15s ease,background-color .15s ease}
.brand-exit strong{color:var(--violet);font-weight:700}
.brand-exit-ico{display:grid;place-items:center;flex:none;width:28px;height:28px;border-radius:50%;background:color-mix(in srgb,var(--violet) 14%,transparent)}
.brand-exit-ico::before{content:"";width:15px;height:15px;background:var(--violet);-webkit-mask:url("/icons/phosphor/storefront.svg") center/contain no-repeat;mask:url("/icons/phosphor/storefront.svg") center/contain no-repeat}
.brand-exit-go{color:var(--violet);font-weight:700;transition:transform .15s ease}
.brand-exit:hover{border-color:var(--violet);color:var(--ink)}
.brand-exit:hover .brand-exit-go{transform:translateX(2px)}
.brand-exit:focus-visible{outline:2px solid var(--violet);outline-offset:2px}
/* On the dark beta hero: the same pill in white-on-violet glass. */
.brand-exit.is-on-dark{border-color:#ffffff2e;background:#ffffff0f;color:#e4dcf7}
.brand-exit.is-on-dark strong,.brand-exit.is-on-dark .brand-exit-go{color:#fff}
.brand-exit.is-on-dark .brand-exit-ico{background:#ffffff1f}
.brand-exit.is-on-dark .brand-exit-ico::before{background:#fff}
.brand-exit.is-on-dark:hover{border-color:#ffffff66;background:#ffffff1a;color:#fff}
/* A one-line row under a form: "This list is for creators. Work at a brand? Start here". */
.brand-exit-row{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:16px 0 0;padding-top:16px;border-top:1px solid var(--rule,var(--line));font-size:13.5px;line-height:1.45;color:var(--ink-2,var(--mut))}
/* Signed-out only where a page says so (Today); workspace.js keeps data-signed-in current. */
html[data-signed-in] [data-brand-exit-signed-out]{display:none}
.today-brand-exit{margin:12px 0 0}
.si-brand-exit{justify-content:center;text-align:center}
/* Beta pages: the pill sits beside "Sign in" in the dark header. */
.beta-top-links{display:flex;align-items:center;gap:8px}
.beta-top-links>a{flex:none;white-space:nowrap}
@media (max-width:420px){.brand-exit-row .brand-exit{white-space:normal;width:100%}.beta-top-links .brand-exit{padding:0 14px}.beta-top-links .brand-exit-ico,.beta-top-links .brand-exit-go{display:none}}
@media (prefers-reduced-motion:reduce){.brand-exit,.brand-exit-go{transition:none}}
