.guest-picker__bar {
  min-height: var(--hdr-h);
  display: flex;
  align-items: center;
  gap: 24px;
  padding: 0 var(--gut);
  background: var(--paper);
  color: var(--ink);
  border-bottom: 1px solid var(--rule);
  font-size: 15px;
  font-weight: 500;
}
.guest-picker__bar a { text-decoration: none; }
.guest-picker__bar a:hover { color: var(--ink); text-decoration: underline; text-underline-offset: 5px; }
.guest-picker__brand { display: block; color: inherit; }
.guest-picker__brand .wordmark { height: 20px; }
.guest-picker__bar-label { margin-left: auto; color: var(--ink-3); }
.guest-picker__back { white-space: nowrap; }

.guest-picker {
  display: grid;
  grid-template-columns: minmax(0, 1.04fr) minmax(0, .96fr);
  min-height: calc(100vh - var(--hdr-h));
  background: var(--paper);
}
.guest-picker__scene { position: relative; min-height: 760px; overflow: hidden; background: var(--night); color: white; }
.guest-picker__hero { width: 100%; height: 100%; position: absolute; inset: 0; object-fit: cover; object-position: 55% center; }
.guest-picker__scene::after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, rgba(12,18,34,.12) 20%, rgba(12,18,34,.12) 45%, rgba(12,18,34,.78) 100%); }
.guest-picker__inset { position: absolute; z-index: 1; top: clamp(28px,4vw,64px); right: clamp(22px,4vw,60px); width: min(37%,240px); margin: 0; padding: 7px 7px 0; background: var(--paper); color: var(--ink); box-shadow: 0 10px 30px rgba(0,0,0,.18); }
.guest-picker__inset img { width: 100%; aspect-ratio: 1.25; object-fit: cover; }
.guest-picker__inset figcaption { padding: 8px 2px 9px; font-size: 12px; }
.guest-picker__scene-copy { position: absolute; z-index: 1; left: clamp(28px,5vw,80px); right: 24px; bottom: clamp(42px,6vw,88px); max-width: 620px; }
.guest-picker__scene-copy p { color: rgba(245,242,236,.9); }
.guest-picker__eyebrow { display: flex; align-items: center; gap: 10px; margin: 0 0 20px; font-size: 12px; font-weight: 600; letter-spacing: .14em; text-transform: uppercase; }
.guest-picker__eyebrow::before { content: ""; width: 7px; height: 7px; background: var(--brass); }
.guest-picker__scene h1 { max-width: 13ch; margin: 0; font-family: var(--serif); font-size: clamp(40px,4.6vw,76px); font-weight: 300; line-height: 1.04; letter-spacing: -.015em; }
.guest-picker__scene-copy > p:last-child { margin: 22px 0 0; font-size: 16px; }

.guest-picker__content { display: flex; align-items: center; justify-content: center; padding: clamp(42px,6vw,90px) clamp(24px,5vw,80px) 120px; }
.guest-picker__content-inner { width: min(100%,550px); }
.guest-picker__content .guest-picker__eyebrow { color: var(--ink); }
.guest-picker__content h2 { margin: 0 0 14px; font-family: var(--serif); font-size: clamp(34px,3.2vw,52px); font-weight: 400; line-height: 1.08; letter-spacing: -.012em; }
.guest-picker__intro { max-width: 44ch; margin: 0 0 28px; color: var(--ink-2); line-height: 1.6; }
.guest-picker__card { padding: clamp(20px,3vw,32px); border: 1px solid var(--rule); background: var(--card); }
.guest-picker__identity { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0 0 16px; border-bottom: 1px solid var(--rule); }
.guest-picker__identity > div { min-width: 0; }
.guest-picker__identity-label { display: block; margin-bottom: 6px; color: var(--ink-2); font-size: 13px; font-weight: 600; }
.guest-picker__identity strong { display: block; overflow-wrap: anywhere; font-family: var(--serif); font-size: 20px; font-weight: 400; }
.guest-picker__identity-email { margin: 5px 0 0; overflow-wrap: anywhere; color: var(--ink-2); font-size: 14px; }
.guest-picker__identity-email:empty { display: none; }
.guest-picker__identity button { flex: none; padding: 8px 0; border: 0; border-bottom: 1px solid currentColor; background: transparent; color: var(--night); cursor: pointer; font-size: 14px; }
.guest-picker__identity button:hover { color: var(--ink); }
.guest-picker__identity button[hidden] { display: none; }
.guest-picker__identity button:focus-visible { outline: 2px solid var(--night); outline-offset: 3px; }
.guest-picker__current-booking { margin: 9px 0 0; color: var(--night); font-size: 14px; }
.guest-picker__current-booking:empty { display: none; }
.guest-picker__filters { display: grid; grid-template-columns: minmax(0, 1fr) minmax(160px, .72fr); gap: 12px; }
.guest-picker__filters > div { min-width: 0; }
.guest-picker__field-label { display: block; margin: 18px 0 7px; font-size: 13px; font-weight: 600; }
.guest-picker__filters input, .guest-picker__filters select { display: block; width: 100%; padding: 11px 12px; border: 1px solid var(--rule); border-radius: 0; background: var(--paper); color: var(--ink); font: 16px var(--sans); }
.guest-picker__filters input:focus, .guest-picker__filters select:focus { outline: 2px solid var(--night); outline-offset: 2px; }
.guest-picker__list { height: 248px; overflow-y: auto; padding: 4px; border: 1px solid var(--rule); background: var(--paper); }
.guest-picker__row { position: relative; display: flex; align-items: center; gap: 12px; min-height: 40px; padding: 6px 10px; cursor: pointer; }
.guest-picker__row:hover, .guest-picker__row:has(input:checked) { background: rgba(20,33,61,.07); }
.guest-picker__row:focus-within { outline: 2px solid var(--night); outline-offset: -2px; }
.guest-picker__row input { position: absolute; top: 0; left: 0; width: 1px; height: 1px; margin: 0; opacity: 0; }
.guest-picker__name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 15px; }
.guest-picker__badge { flex: none; margin-left: auto; padding: 4px 8px; background: var(--paper-2); color: var(--ink-2); font-size: 14px; font-weight: 500; white-space: nowrap; }
.guest-picker__badge[data-status="Current"] { background: rgba(20,33,61,.12); color: var(--night); }
.guest-picker__empty { margin: 10px 0 0; color: var(--ink-2); font-size: 14px; }
.guest-picker__empty[hidden] { display: none; }
.guest-picker__selection { margin: 10px 0 0; color: var(--night); font-size: 14px; }
.guest-picker__selection[hidden] { display: none; }
.guest-picker__actions { display: flex; flex-wrap: wrap; gap: 10px; margin-top: 20px; }
.guest-picker__actions button { display: inline-flex; align-items: center; justify-content: space-between; gap: 28px; min-height: 46px; padding: 11px 16px; border: 1px solid var(--night); background: var(--night); color: var(--paper); cursor: pointer; font-size: 15px; font-weight: 500; transition: background .2s ease, transform .2s ease; }
.guest-picker__actions button:hover:not(:disabled) { background: #22325a; transform: translateY(-2px); }
.guest-picker__actions button:disabled { opacity: .45; cursor: default; }
.guest-picker__actions button[hidden] { display: none; }
.guest-picker__status { min-height: 20px; margin: 14px 0 0; color: var(--ink-2); font-size: 14px; }

@media (max-width: 900px) {
  .guest-picker { grid-template-columns: 1fr; }
  .guest-picker__scene { min-height: 440px; }
  .guest-picker__inset { width: min(30%,180px); }
  .guest-picker__scene h1 { font-size: clamp(36px,6vw,60px); }
  .guest-picker__content { padding: 52px var(--gut) 120px; }
}
@media (max-width: 560px) {
  .guest-picker__bar-label { display: none; }
  .guest-picker__back { margin-left: auto; }
  .guest-picker__scene { min-height: 390px; }
  .guest-picker__scene-copy { left: 24px; bottom: 30px; }
  .guest-picker__scene h1 { max-width: 14ch; font-size: 34px; }
  .guest-picker__inset { top: 18px; right: 18px; width: 126px; }
  .guest-picker__inset figcaption { font-size: 11px; }
  .guest-picker__content { padding-top: 42px; }
  .guest-picker__filters { grid-template-columns: 1fr; gap: 0; }
  .guest-picker__identity { align-items: flex-start; }
}
