:root {
  --ink: #20221d;
  --ink-soft: #62625b;
  --cream: #e8e3d5;
  --paper: #f3f0e8;
  --accent: #ff5b34;
  --accent-dark: #e94c28;
  --mint: #d7ef69;
  --mint-dark: #536211;
  --line: rgba(32, 34, 29, .18);
}

body { font-family: "DM Sans", sans-serif; }
.site-header { height: 84px; padding-top: 0; padding-bottom: 0; }
.brand { font-size: 18px; letter-spacing: -.04em; }
.brand-mark { position: relative; display: inline-block; width: 28px; height: 28px; flex: 0 0 28px; color: transparent; background: transparent; border-radius: 0; }
.brand-mark i { position: absolute; display: block; width: 12px; height: 12px; background: var(--accent); border-radius: 50%; }
.brand-mark i:first-child { left: 0; top: 8px; }
.brand-mark i:nth-child(2) { right: 0; top: 0; }
.brand-mark i:last-child { right: 0; bottom: 0; }
.site-nav { margin-left: auto; }
.nav-logout { display: inline-flex; }
.nav-logout button { padding: 0; color: inherit; background: none; border: 0; font: inherit; font-weight: 650; cursor: pointer; }
.nav-logout button:hover { color: var(--accent); }
.header-cta { display: inline-flex; align-items: center; justify-content: space-between; gap: 22px; min-height: 50px; margin-left: 18px; padding: 0 20px; color: white; background: var(--ink); font-size: 14px; font-weight: 700; text-decoration: none; }
.menu-toggle { display: none; width: 42px; height: 42px; padding: 8px; background: transparent; border: 0; cursor: pointer; }
.menu-toggle span { display: block; width: 24px; height: 2px; margin: 5px auto; background: var(--ink); transition: transform .2s; }
.simple-footer { background: var(--mint); border: 0; }
.page-heading h1, .form-intro h1, .calendar-toolbar h2 { font-family: "Instrument Serif", serif; font-weight: 400; }

@media (max-width: 760px) {
  .site-nav { display: none; }
  .site-header { align-items: center; flex-direction: row; }
  .header-cta { margin-left: auto; min-height: 42px; padding: 0 14px; }
  .menu-toggle { display: block; }
  .site-header.menu-open .site-nav { position: absolute; top: 83px; right: 0; left: 0; display: flex; align-items: flex-start; flex-direction: column; gap: 22px; padding: 30px 6vw; background: var(--paper); border-bottom: 1px solid var(--line); box-shadow: 0 20px 30px rgba(32,34,29,.08); }
  .site-header.menu-open .menu-toggle span:first-child { transform: translateY(3.5px) rotate(45deg); }
  .site-header.menu-open .menu-toggle span:last-child { transform: translateY(-3.5px) rotate(-45deg); }
}

@media (max-width: 430px) {
  .brand > span:last-child { display: none; }
}

.auth-layout { display: grid; grid-template-columns: .9fr 1.1fr; gap: clamp(40px, 9vw, 120px); align-items: center; min-height: 620px; }
.auth-copy h1, .auth-message h1 { margin: 22px 0; font: 400 clamp(58px, 7vw, 98px)/.88 "Instrument Serif", serif; letter-spacing: -.045em; }
.auth-copy h1 em, .auth-message h1 em { color: var(--accent); font-weight: 400; }
.auth-copy > p { max-width: 500px; font-size: 18px; line-height: 1.65; }
.auth-form { display: grid; gap: 22px; padding: clamp(28px, 5vw, 48px); background: #fffdf8; border: 1px solid var(--line); box-shadow: 0 20px 60px rgba(32,34,29,.08); }
.auth-name-row { display: grid; grid-template-columns: 1fr 1fr; gap: 16px; }
.check-field { display: flex; align-items: flex-start; gap: 11px; color: var(--ink-soft); font-weight: 500; }
.check-field input { width: 18px; min-height: 18px; margin-top: 2px; }
.auth-switch { margin: 0; font-size: 14px; text-align: center; }
.auth-switch a { color: var(--accent-dark); font-weight: 700; }
.auth-message { max-width: 760px; margin: 60px auto; text-align: center; }
.auth-message.wide { max-width: 900px; }
.auth-message > p { max-width: 610px; margin: 0 auto 32px; font-size: 17px; }
.auth-message-icon { width: 64px; height: 64px; display: grid; place-items: center; margin: 0 auto 24px; background: var(--mint); border-radius: 50%; font-size: 25px; }
.totp-qr { width: 230px; max-width: 100%; margin: 0 auto; padding: 14px; background: white; border: 1px solid var(--line); }
.totp-qr svg { width: 100%; height: auto; display: block; }
.totp-secret { display: block; overflow-wrap: anywhere; margin-top: 8px; padding: 10px; background: #ece8de; }
.recovery-codes { max-width: 500px; display: grid; grid-template-columns: 1fr 1fr; gap: 10px; margin: 28px auto 36px; }
.recovery-codes code { padding: 12px; background: white; border: 1px solid var(--line); font-size: 16px; }
.booking-account { display: flex; flex-direction: column; padding: 15px 17px; background: var(--mint); border-radius: 9px; }
.booking-account span, .booking-account small { font-size: 12px; color: #4e551f; }
.admin-invite { display: grid; grid-template-columns: 1fr 1fr 1.4fr auto; gap: 15px; align-items: end; margin-bottom: 26px; padding: 24px; background: #fffdf8; border: 1px solid var(--line); }
.admin-invite h2 { grid-column: 1/-1; font: 36px "Instrument Serif", serif; }

@media (max-width: 800px) {
  .auth-layout { grid-template-columns: 1fr; min-height: 0; }
  .admin-invite { grid-template-columns: 1fr; }
}
@media (max-width: 520px) {
  .auth-name-row, .recovery-codes { grid-template-columns: 1fr; }
}