/* Pre-reservation sheet: paper and ink, like the buy box. Works on the dark stage and on paper sections. */
.rsv{width:min(520px, calc(100vw - 32px)); max-height:calc(100dvh - 32px); padding:0; border:0; background:#f4f3f1; color:#0b0b0c; font-family:"JetBrains Mono", ui-monospace, Menlo, Consolas, monospace; font-size:14px; line-height:1.55; overflow:auto}
.rsv::backdrop{background:rgba(6,6,7,.78)}
.rsv[open]{animation:rsv-in .28s ease-out}
@keyframes rsv-in{from{opacity:0; transform:translateY(12px)}}
@media (prefers-reduced-motion: reduce){ .rsv[open]{animation:none} }
.rsv-in{position:relative; padding:28px 28px 24px}
.rsv .sr{position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0 0 0 0); white-space:nowrap}
.rsv-x{position:absolute; top:14px; right:14px; width:36px; height:36px; border:0; background:none; color:inherit; font:inherit; font-size:20px; line-height:1; cursor:pointer}
.rsv-x:hover{background:#e4e2de}
.rsv-k{margin:0 0 10px; font-size:12px; color:#56595f; letter-spacing:.04em}
.rsv-name{margin:0; font-size:clamp(22px,4.6vw,28px); font-weight:600; letter-spacing:-.04em; white-space:pre-wrap}
.rsv-meta{margin:4px 0 0; color:#56595f; font-size:13px}

.rsv-story{margin:18px 0 0; padding-top:16px; border-top:1px solid #dcdbd8; color:#26272b}
.rsv-story b{font-weight:700; color:#0b0b0c}

/* size, email, button */
.rsv-sizes{display:flex; flex-wrap:wrap; gap:8px; margin:20px 0 0; padding:0; border:0}
.rsv-sizes legend{font-size:12px; color:#56595f; margin-bottom:10px; padding:0}
.rsv-sizes label{position:relative}
.rsv-sizes input{position:absolute; opacity:0; inset:0; margin:0}
.rsv-sizes span{display:inline-flex; min-width:48px; justify-content:center; padding:9px 10px; border:1px solid #b8b0aa; cursor:pointer}
.rsv-sizes input:checked + span{border-color:#0b0b0c; background:#0b0b0c; color:#f4f3f1}
.rsv-sizes input:focus-visible + span{outline:2px solid #0b0b0c; outline-offset:2px}
.rsv-row{display:flex; margin-top:18px; border:1px solid #0b0b0c}
.rsv-row:focus-within{box-shadow:0 0 0 1px #0b0b0c}
.rsv-row input{flex:1; min-width:0; padding:13px 14px; border:0; background:transparent; color:inherit; font:inherit; font-size:15px; border-radius:0}
.rsv-row input:focus{outline:none}
.rsv-row button{padding:13px 20px; border:0; border-left:1px solid #0b0b0c; background:#0b0b0c; color:#f4f3f1; font:inherit; letter-spacing:.02em; cursor:pointer; white-space:nowrap}
.rsv-row button:hover{background:#000}
.rsv-row button[disabled]{opacity:.7; cursor:progress}
@media (max-width:420px){ .rsv-row{flex-direction:column} .rsv-row button{border-left:0; border-top:1px solid #0b0b0c} .rsv-in{padding:24px 20px 20px}
  .rsv-sizes{gap:6px} .rsv-sizes span{min-width:44px; padding:10px 6px} }
.rsv-note{margin:10px 0 0; font-size:12px; color:#56595f}
.rsv-note a{color:#0b0b0c}
.rsv-msg{margin:12px 0 0; min-height:1.5em; font-size:13px}
.rsv-msg.err{color:#a3124e}
.rsv.done .rsv-sizes,.rsv.done .rsv-row,.rsv.done .rsv-note{display:none}
.rsv.done .rsv-msg{font-size:15px; color:#0b0b0c}
.rsv.done .rsv-msg b{font-weight:700}