body {
  margin: 0;
}

.scene {
  position: relative;
  width: 100vw;
  height: 100vh;
}

/* Full page background */
.background {
  width: 100%;
  height: 100%;
  object-fit: contain;
}
/* Star garlands */
.stars {
  position: absolute;
  top: 20px;     /* pulls stars INTO the scene */
  width: 220px;
  z-index: 10;
  pointer-events: none;
}

.stars-left {
  left: 0;
}

.stars-right {
  right: 0;
}

/* Cat clock */
.cat {
  position: absolute;
  left: 50%;
  bottom: 0%;              /* ⬅️ near bottom, not middle */
  width: 180px;            /* ⬅️ BIGGER cat */
  transform: translateX(-50%);
  animation: tailMove 1.2s infinite;
}

/* Frame animation */
@keyframes tailMove {
  0%   { content: url("images/cat1.png"); }
  33%  { content: url("images/cat2.png"); }
  66%  { content: url("images/cat3.png"); }
  100% { content: url("images/cat1.png"); }
}
body {
  margin: 0;
}

.scene {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
}

.background {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.book-spine {
  position: absolute;
  right: 18%;
  bottom: 32%;
  width: 80px;
  cursor: pointer;
  z-index: 5;   /* THIS IS CRITICAL */
}
.background {
  width: 100%;
  height: 100%;
  object-fit: cover;
  z-index: 1;
  position: relative;
}

/* Book opening animation */
.book-open {
  position: absolute;
  left: 50%;
  top: 50%;
  width: 400px;
  transform: translate(-50%, -50%);
  z-index: 10;
}

.hidden {
  display: none;
}
.journal-bg {
  background: #f2e6d8;
  font-family: serif;
}

.journal {
  max-width: 900px;
  margin: 40px auto;
  padding: 40px;
  background: #fffaf3;
  box-shadow: 0 0 20px rgba(0,0,0,0.15);
}

.journal-books {
  display: flex;
  gap: 30px;
  margin-top: 30px;
}

.journal-book {
  padding: 25px;
  border: 2px dashed #b89b7c;
  text-decoration: none;
  color: #000;
}
.entry {
  margin-bottom: 30px;
  padding-bottom: 20px;
  border-bottom: 1px dotted #c9b39a;
}

.stars {
  color: goldenrod;
  font-size: 20px;
}

.hidden {
  display: none;
}