.book-shell {
  max-width: 760px;
  margin: 0 auto;
  padding: clamp(2.5rem, 6vw, 4rem) 0 5rem;
}
.book-intro { text-align: center; margin-bottom: 2.4rem; }
.book-intro p { color: var(--ink-soft); max-width: 50ch; margin: 0 auto; }

.book-card {
  background: var(--white);
  border: 1px solid var(--line);
  border-radius: 24px;
  padding: clamp(1.6rem, 4vw, 2.4rem);
}

.book-card h3 {
  font-size: 1.1rem;
  margin-bottom: 1rem;
}

.date-row {
  display: flex;
  gap: 0.6rem;
  overflow-x: auto;
  padding-bottom: 0.3rem;
  margin-bottom: 2rem;
}
.date-chip {
  flex: 0 0 auto;
  min-width: 78px;
  text-align: center;
  border: 1.5px solid var(--line);
  border-radius: 14px;
  padding: 0.8em 0.6em;
  cursor: pointer;
  background: var(--cream);
}
.date-chip .dow { font-size: 0.76rem; color: var(--ink-soft); display: block; }
.date-chip .dom { font-family: var(--font-display); font-size: 1.35rem; display: block; margin: 0.15rem 0; }
.date-chip .mon { font-size: 0.72rem; color: var(--ink-soft); display: block; }
.date-chip:hover { border-color: var(--moss); }
.date-chip.selected { background: var(--moss); border-color: var(--moss); }
.date-chip.selected .dow, .date-chip.selected .dom, .date-chip.selected .mon { color: var(--white); }

.time-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.7rem;
  margin-bottom: 2rem;
}
.time-slot {
  border: 1.5px solid var(--line);
  border-radius: 12px;
  padding: 0.75em 0.5em;
  text-align: center;
  font-size: 0.92rem;
  font-weight: 500;
  cursor: pointer;
  background: var(--cream);
}
.time-slot:hover { border-color: var(--moss); }
.time-slot.selected { background: var(--moss); border-color: var(--moss); color: var(--white); }
.time-slot.taken { opacity: 0.35; text-decoration: line-through; cursor: not-allowed; pointer-events: none; }

.tz-note { font-size: 0.8rem; color: var(--ink-soft); margin-bottom: 2rem; text-align: center; }

.book-form { display: none; }
.book-form.active { display: block; animation: fadein 0.35s ease; }
.book-form .q-block { margin-bottom: 1.2rem; }

.book-summary {
  background: var(--moss-light);
  border-radius: 14px;
  padding: 1rem 1.2rem;
  font-size: 0.94rem;
  margin-bottom: 1.6rem;
}
.book-summary strong { color: var(--moss-dark); }

.book-confirm { display: none; text-align: center; }
.book-confirm.active { display: block; animation: fadein 0.35s ease; }
.book-confirm .check {
  width: 60px; height: 60px; border-radius: 50%;
  background: var(--moss-light); color: var(--moss);
  display: flex; align-items: center; justify-content: center;
  margin: 0 auto 1.2rem; font-size: 1.8rem;
}
.book-confirm h2 { margin-bottom: 0.4em; }
.book-confirm p { color: var(--ink-soft); max-width: 44ch; margin: 0 auto 0.5em; }
.confirm-detail {
  display: inline-block;
  margin: 1.2rem 0 1.6rem;
  background: var(--cream);
  border: 1px solid var(--line);
  border-radius: 14px;
  padding: 1rem 1.6rem;
  font-weight: 600;
}

@media (max-width: 560px) {
  .time-grid { grid-template-columns: repeat(2, 1fr); }
}