/* ===== Base ===== */
body {
  margin: 0;
  background: radial-gradient(circle at center, #0b120d 0%, #020403 70%);
  font-family: "JetBrains Mono", "IBM Plex Mono", monospace;
  color: #3aff7a;
}

/* ===== Center CRT ===== */
.desk {
  min-height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
}

/* ===== Bezel ===== */
.crt-frame {
  background: linear-gradient(145deg, #1a1f1c, #050705);
  padding: 28px;
  border-radius: 24px;
  box-shadow:
    0 40px 120px rgba(0,0,0,0.9),
    inset 0 0 20px rgba(255,255,255,0.03);
}

/* ===== FIXED CRT SCREEN ===== */
.crt-screen {
  position: relative;
  width: 960px;
  height: 620px;               /* 👈 FIXED HEIGHT */
  max-width: 90vw;
  max-height: 85vh;

  background: radial-gradient(
    ellipse at center,
    rgba(10,20,14,0.95) 0%,
    rgba(2,4,3,0.98) 70%
  );

  padding: 36px 64px 48px;
  border-radius: 18px;

  font-size: 18px;
  line-height: 1.7;

  overflow: hidden;            /* 👈 prevents growth */

  box-shadow:
    inset 0 0 60px rgba(58,255,122,0.08),
    inset 0 0 140px rgba(0,0,0,0.9);

  text-shadow: 0 0 6px rgba(58,255,122,0.25);

  animation: flicker 6s infinite;
}

/* ===== Flicker ===== */
@keyframes flicker {
  0% { opacity: 1; }
  3% { opacity: 0.97; }
  6% { opacity: 1; }
  100% { opacity: 1; }
}

/* ===== Boot text ===== */
.boot {
  font-size: 16px;
  line-height: 1.6;
  margin: 0;
  white-space: pre-wrap;
}

/* ===== Status bar ===== */
.status-line {
  display: flex;
  justify-content: space-between;
  font-size: 13px;
  margin-bottom: 24px;
  color: rgba(58,255,122,0.75);
}

/* ===== Content spacing ===== */
pre { margin: 0; white-space: pre-wrap; }
.title { margin-bottom: 48px; }
.section { margin-bottom: 56px; }

/* ===== Prompt ===== */
.prompt-line {
  display: flex;
  align-items: center;
  font-size: 18px;
}

.prompt { margin-right: 6px; }

/* ===== Cursor ===== */
.cursor {
  width: 10px;
  height: 22px;
  background: rgba(58,255,122,0.9);
  animation: blink 1.1s steps(1) infinite;
}

@keyframes blink {
  0%,49% { opacity: 1; }
  50%,100% { opacity: 0; }
}

/* ===== Scanlines ===== */
.crt-screen::before {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 18px;
  background: repeating-linear-gradient(
    to bottom,
    rgba(255,255,255,0.03),
    rgba(255,255,255,0.03) 1px,
    rgba(0,0,0,0) 2px,
    rgba(0,0,0,0) 4px
  );
}

/* ===== Vignette ===== */
.crt-screen::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  border-radius: 18px;
  background: radial-gradient(
    ellipse at center,
    rgba(0,0,0,0) 40%,
    rgba(0,0,0,0.75) 100%
  );
}
