/* IaBula homepage identity, scoped to the existing public auth pages. */
@font-face { font-family: "Instrument Sans"; src: url("/brand/fonts/instrument-sans-latin-variable.woff2") format("woff2"); font-style: normal; font-weight: 400 700; font-display: swap; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) { background: #fbfcfd; color: #122335; font-family: "Instrument Sans", system-ui, sans-serif; font-synthesis: none; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .portal-header { max-width: 1160px; padding: 22px 32px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .brand { font-size: 23px; font-weight: 600; color: #122335; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .brand img { width: 40px; height: 40px; object-fit: contain; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .login-brand-api { padding: 3px 6px; border: 1px solid #e2e7eb; border-radius: 5px; color: #526273; font-size: 10px; font-weight: 500; letter-spacing: .04em; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .header-context { color: #607182; letter-spacing: 0; font-size: 13px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .portal-main { padding: 42px 20px 64px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .auth-card { width: min(100%, 460px); padding: 36px; border-color: #e2e7eb; border-radius: 20px; box-shadow: 0 8px 30px rgba(18,35,53,.04); }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .eyebrow { color: #08796a; font-size: 12px; font-weight: 600; letter-spacing: .02em; text-transform: none; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) h1 { color: #122335; font-size: 32px; font-weight: 550; line-height: 1.2; letter-spacing: -.025em; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .lede { color: #526273; font-size: 15px; line-height: 1.65; margin-bottom: 26px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) label { color: #27394b; font-size: 14px; font-weight: 550; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) input { border-color: #d5dfe5; border-radius: 10px; font-size: 16px; min-height: 48px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) input:focus { border-color: #9caaa9; box-shadow: 0 0 0 3px rgba(8,121,106,.07); outline: none; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) :focus-visible { outline: 2px solid #08796a; outline-offset: 3px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) input:focus-visible { outline: none; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) a { color: #155ec9; font-weight: 550; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .brand { color: #122335; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .button { font-weight: 600; border-radius: 10px; font-size: 15px; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .button-primary { background: #155ec9; color: #fff; box-shadow: 0 3px 8px rgba(21,94,201,.12); }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .button-primary:hover { background: #104fae; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .button-github { border: 1px solid #d5dfe5; background: #fff; color: #27394b; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .button-github:hover { background: #f8fafc; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .switch-copy { color: #526273; font-size: 14px; line-height: 1.7; }
body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .portal-footer { color: #607182; letter-spacing: 0; font-size: 12px; }
@media (max-width: 600px) {
  body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .portal-header { padding: 18px 20px; }
  body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .header-context { display: none; }
  body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .portal-main { padding-block: 20px 40px; }
  body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .auth-card { padding: 26px 24px; border-radius: 16px; }
  body:is([data-page="login"], [data-page="signup"], [data-page="forgot-password"], [data-page="verify-email"]) .portal-footer { padding-inline: 20px; font-size: 11px; }
}
