/* VShell phone loader (T-145 S5): the loader's own screens. The phone page
   from the Mac brings its own CSS; these names start with vsl- so they do
   not meet it. */
:root { --vsl-bg: #f6f6f4; --vsl-fg: #1d1d1b; --vsl-dim: #6b6b66; --vsl-accent: #2f6fde; }
@media (prefers-color-scheme: dark) {
  :root { --vsl-bg: #161615; --vsl-fg: #ececea; --vsl-dim: #9a9a94; --vsl-accent: #6c9cf0; }
}
html, body { margin: 0; min-height: 100%; background: var(--vsl-bg); color: var(--vsl-fg);
  font: 16px/1.4 -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; }
.vsl-screen { position: fixed; inset: 0; z-index: 2147483000; display: flex; align-items: center;
  justify-content: center; padding: 16px; box-sizing: border-box; text-align: center;
  background: var(--vsl-bg); color: var(--vsl-fg); }
.vsl-screen[hidden] { display: none; }
.vsl-box { max-width: 26em; }
.vsl-box h1 { font-size: 1.25em; margin: 0 0 0.5em; }
.vsl-box p { color: var(--vsl-dim); margin: 0 0 1em; }
.vsl-screen[data-state="connecting"] h1 { font-weight: normal; color: var(--vsl-dim); }
.vsl-box button { font: inherit; padding: 0.6em 1.4em; border-radius: 8px; border: 0;
  background: var(--vsl-accent); color: #fff; }
.vsl-banner { position: fixed; left: 0; right: 0; top: 0; z-index: 2147482000; padding: 6px 16px;
  padding-top: calc(6px + env(safe-area-inset-top)); text-align: center; font-size: 14px;
  background: #b7791f; color: #fff; }
.vsl-banner[hidden] { display: none; }
.vsl-noscript { padding: 16px; }
