/* First-paint styles: the session check still owns access to the application. */
#seafix-demo.is-starting { --sf-ui-scale: 1; zoom: 1; }
#seafix-demo.is-starting > .sf-phone { display: none !important; }
#seafix-demo #sf-startup {
  position: fixed; inset: 0; z-index: 1000; display: grid; place-items: center;
  padding: 24px; background: light-dark(#f5f5f7, #111113); color: light-dark(#17191d, #f5f5f7);
  font-family: inherit;
}
#seafix-demo #sf-startup[hidden] { display: none !important; }
#seafix-demo .sf-startup-content { display: grid; justify-items: center; gap: 16px; max-width: 100%; text-align: center; }
#seafix-demo .sf-startup-lockup { display: flex; align-items: center; gap: 24px; width: max-content; max-width: 100%; text-align: left; }
#seafix-demo .sf-startup-brand { display: flex; align-items: center; gap: 12px; flex-shrink: 0; }
#seafix-demo .sf-startup-brand > img { display: block; flex-shrink: 0; width: 46px; height: 46px; border-radius: 11px; }
#seafix-demo .sf-startup-name { font-size: 26px; line-height: 1.5; font-weight: 500; letter-spacing: -1px; white-space: nowrap; }
#seafix-demo .sf-startup-message-block { display: flex; align-items: flex-start; gap: 24px; }
#seafix-demo .sf-startup-divider { display: block; width: 1px; flex-shrink: 0; height: var(--sf-startup-divider-height, 0px); margin-top: 4px; background: light-dark(#a7afb8, #646f7b); transition: height .65s cubic-bezier(.22,1,.36,1); }
#seafix-demo .sf-startup-lines { display: grid; overflow: visible; }
#seafix-demo .sf-startup-line { display: block; height: 34px; font-size: 21px; line-height: 34px; font-weight: 400; letter-spacing: -.4px; white-space: nowrap; opacity: 0; transform: translateY(8px); filter: blur(3px); transition: opacity .65s ease, transform .65s cubic-bezier(.22,1,.36,1), filter .65s ease; }
#seafix-demo .sf-startup-line.is-visible { opacity: 1; transform: none; filter: none; }
#seafix-demo #sf-startup.is-resetting :is(.sf-startup-line, .sf-startup-divider) { transition: none; }
/* Keep the accessible loading status without a visible bar or extra caption. */
#seafix-demo #sf-startup-progress {
  position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0;
  overflow: hidden; clip-path: inset(50%); white-space: nowrap; border: 0;
}
@media (prefers-reduced-motion: reduce) {
  #seafix-demo :is(.sf-startup-line, .sf-startup-divider) { transition: none; }
}
@media (max-width: 560px) {
  #seafix-demo .sf-startup-lockup, #seafix-demo .sf-startup-message-block { gap: 16px; }
  #seafix-demo .sf-startup-brand { gap: 10px; }
  #seafix-demo .sf-startup-brand > img { width: 40px; height: 40px; }
  #seafix-demo .sf-startup-name { font-size: 22px; letter-spacing: -.8px; }
  #seafix-demo .sf-startup-line { font-size: 18px; }
}
@media (max-width: 420px) {
  #seafix-demo #sf-startup { padding: 16px; }
  #seafix-demo .sf-startup-lockup, #seafix-demo .sf-startup-message-block { gap: 10px; }
  #seafix-demo .sf-startup-brand { gap: 7px; }
  #seafix-demo .sf-startup-brand > img { width: 31px; height: 31px; border-radius: 8px; }
  #seafix-demo .sf-startup-name { font-size: 17px; letter-spacing: -.6px; }
  #seafix-demo .sf-startup-line { font-size: 14px; letter-spacing: -.25px; }
}
#seafix-demo #sf-startup-message { margin: 0; max-width: 380px; font-size: 14px; line-height: 1.6; }
#seafix-demo #sf-startup-retry {
  min-height: 44px; padding: 10px 18px; border: 1px solid light-dark(#d5d7dd, #50545d);
  border-radius: 12px; background: light-dark(#e8e9ed, #303238); color: inherit;
  font: inherit; font-size: 14px; font-weight: 600; cursor: pointer;
}
#seafix-demo :is(#sf-startup-progress, #sf-startup-message, #sf-startup-retry)[hidden] { display: none !important; }
#seafix-demo #sf-startup-retry:focus-visible { outline: 2px solid currentColor; outline-offset: 3px; }