.room-booking [hidden], .booking-dialog [hidden] { display: none !important; }
.room-booking { border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); }
.booking-layout { display: grid; grid-template-columns: .7fr 1.3fr; gap: 48px; max-width: 800px; margin: 45px auto 0; align-items: start; }
.booking-availability { display: flex; align-items: center; gap: 20px; padding-bottom: 22px; }
.booking-availability__number { font: 400 80px/1 var(--serif); letter-spacing: -.045em; min-width: 1.1em; }
.booking-availability__copy { font-size: 13px; line-height: 1.7; }
.booking-availability__copy strong { font-weight: 500; }
.booking-availability__copy span { display: block; color: var(--muted); font-size: 12px; }
.booking-refresh { min-height: 44px; background: none; border: 0; border-bottom: 1px solid #a1978b; padding: 5px 0; font-size: 12px; }
.booking-form { padding: 30px; background: #f5f0eb; border: 1px solid var(--line); border-radius: 3px; }
.booking-form h3 { font-size: 32px; margin-bottom: 10px; }
.booking-form__intro { font-size: 13px; line-height: 1.8; margin-bottom: 24px; }
.booking-fields { margin: 0; padding: 0; border: 0; min-width: 0; }
.booking-field { display: grid; gap: 7px; min-width: 0; }
.booking-field label { font-size: 12px; }
.booking-field input { width: 100%; min-height: 46px; border: 1px solid #bdb3a9; border-radius: 3px; background: var(--paper); color: var(--ink); font: inherit; font-size: 16px; padding: 10px 12px; }
.booking-field [aria-invalid="true"] { border-color: #8a3c33; }
.booking-privacy { font-size: 11px; line-height: 1.8; margin: 20px 0; color: var(--muted); }
.booking-form .button { width: 100%; }
.room-booking button:disabled, .booking-dialog button:disabled { opacity: .55; cursor: default; }
.booking-status { font-size: 13px; line-height: 1.8; margin-top: 17px; }
.booking-status.is-error { color: #8a3c33; }
.booking-status.is-success { color: #58634f; }
.booking-trap { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.booking-own { margin-top: 45px; border-top: 1px solid var(--line); padding-top: 28px; }
.booking-own > h3 { font-size: 34px; }
.booking-own > p { max-width: 650px; margin-top: 12px; font-size: 12px; color: var(--muted); }
.booking-own__list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px; margin-top: 22px; }
.booking-card { min-width: 0; padding: 24px; border: 1px solid var(--line); border-radius: 3px; }
.booking-card__state { color: #58634f; font-size: 10px; letter-spacing: .12em; text-transform: uppercase; margin-bottom: 11px; }
.booking-card h4 { font-family: var(--serif); font-size: 28px; font-weight: 400; line-height: 1.2; margin: 0; overflow-wrap: anywhere; }
.booking-card__details { font-size: 12px; margin-top: 9px; }
.booking-card__names { margin: 14px 0 0; padding: 0; list-style: none; font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.booking-card__note { color: var(--muted); font-size: 12px; line-height: 1.7; margin-top: 13px; }
.booking-card__action { display: block; background: none; border: 0; border-bottom: 1px solid #a1978b; font-size: 12px; min-height: 44px; padding: 5px 0; margin-top: 15px; }
.booking-dialog { position: fixed; width: min(100% - 32px, 490px); max-height: calc(100dvh - 32px); padding: 32px; overflow-y: auto; border: 1px solid var(--line); border-radius: 4px; color: var(--ink); background: var(--paper); }
.booking-dialog::backdrop { background: rgb(49 44 38 / .42); }
body:has(.booking-dialog[open]) { overflow: hidden; }
.booking-dialog h2 { font-size: 38px; margin-bottom: 18px; }
.booking-dialog > p { font-size: 14px; }
.booking-dialog__actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 24px; }
.booking-button--plain { border-color: #bdb3a9; background: transparent; }
@media (max-width: 850px) {
  .booking-layout { grid-template-columns: 1fr; gap: 30px; }
  .booking-form { max-width: 600px; width: 100%; margin-inline: auto; }
}
@media (max-width: 600px) {
  .booking-layout { margin-top: 30px; }
  .booking-availability__number { font-size: 68px; }
  .booking-form { padding: 24px 20px; }
  .booking-own__list { grid-template-columns: 1fr; gap: 15px; }
  .booking-dialog { padding: 26px 22px; }
  .booking-dialog h2 { font-size: 34px; }
  .booking-dialog__actions .button { width: 100%; }
}