/* =========================================================
   boot.css — the terminal loading screen (js/components/boot-screen.js)
   Only visible while <html> has .is-booting, which a tiny script in
   index.html adds on the first visit of a session. A small window in
   the middle of the screen, not a full-page takeover.
   ========================================================= */

.boot { display: none; }

html.is-booting .boot {
  display: flex;
  position: fixed;
  inset: 0;
  z-index: 100;                       /* above the content and every effect */
  align-items: center;
  justify-content: center;
  padding: var(--space-6);
  background: var(--bg);
  /* Failsafe: even if the script never runs, the screen leaves by itself */
  animation: boot-out .32s var(--ease) 3.5s forwards;
}
html.is-booting body { overflow: hidden; }

html.is-booting .boot.is-leaving { animation: boot-out .32s var(--ease) forwards; }
.boot.is-leaving .boot__window { animation: boot-shrink .32s var(--ease) forwards; }

@keyframes boot-out    { to { opacity: 0; visibility: hidden; } }
@keyframes boot-in     { from { opacity: 0; transform: translateY(6px) scale(.98); } }
@keyframes boot-shrink { to { transform: scale(.97); } }

.boot__window {
  width: min(320px, 100%);
  background: var(--surface);
  border: 1px solid var(--line-control);
  border-radius: var(--radius);
  overflow: hidden;
  animation: boot-in .3s var(--ease);
}

.boot__bar {
  position: relative;
  display: flex;
  align-items: center;
  gap: 6px;
  height: 32px;
  padding: 0 var(--space-3);
  border-bottom: 1px solid var(--border);
}
.boot__dot {
  width: 8px;
  height: 8px;
  border-radius: 50%;
  background: var(--line-control);
}
.boot__title {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font: 400 var(--text-caption) / 1 var(--font-mono);
  color: var(--muted);
  pointer-events: none;
}

.boot__screen {
  margin: 0;
  padding: var(--space-4);
  min-height: calc(4 * 1.7em + 2 * var(--space-4));   /* 4 lines: no jump while typing */
  font: 400 var(--text-caption) / 1.7 var(--font-mono);
  color: var(--muted);
  white-space: pre;
  overflow: hidden;
}
.boot__cmd { color: var(--text); }
.boot__ok  { color: var(--accent); }
.boot__caret {
  display: inline-block;
  width: .6em;
  height: 1.1em;
  vertical-align: -.2em;
  background: var(--accent);
  animation: boot-blink 1s steps(1) infinite;
}
@keyframes boot-blink { 50% { opacity: 0; } }