/*
 * What is left of the document's own styling.
 *
 * The interface is a React island now (adr-011) and brings its own stylesheet,
 * injected at startup. Everything that used to live here — cards, buttons,
 * chips, the toolbar, the dialogs — moved with it. What remains is the page
 * underneath: a background so nothing flashes white before React mounts, and
 * the three mount points.
 */
:root {
  color-scheme: dark;
  --kv-bg: #14161f;
}

html,
body {
  margin: 0;
  min-height: 100%;
  background: var(--kv-bg);
  color: white;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, sans-serif;
}

/* The islands lay themselves out and paint their own background. */
#view-setup,
#view-unlock,
#view-main {
  display: block;
  min-height: 100dvh;
}

/* Explicit, or the id selectors above would out-specify the attribute and the
   hidden screens would stay on top of the vault. */
#view-setup[hidden],
#view-unlock[hidden],
#view-main[hidden] {
  display: none;
}