body{margin:0;background:#faf7f0;color:#283f34;font:16px/1.7 system-ui}
main{max-width:860px;margin:auto;padding:24px}
label{display:grid;gap:6px;margin:12px 0}
input,button{box-sizing:border-box;min-height:46px;padding:9px 12px;font:inherit;border:1px solid #cfc7b8;border-radius:8px}
input{max-width:100%;background:#fff}
button{cursor:pointer;background:#e7eee6;color:#203f30;margin:4px}
button:disabled{cursor:default;opacity:.6}
form,article{padding:18px;margin:16px 0;background:#fff;border:1px solid #ded5c6;border-radius:12px}
#status{min-height:1.7em}#slots{display:flex;flex-wrap:wrap;gap:8px}
#slots article{flex:1 1 230px;margin:0}
button:focus-visible,input:focus-visible{outline:3px solid #618777;outline-offset:2px}
#slots dl{margin:8px 0;overflow-wrap:anywhere}
#slots dt{font-weight:700}
#slots dd{margin:0 0 6px;white-space:pre-wrap}

.booking-page{background:#f6f4ed;color:#243d31}
.booking-page main{max-width:1080px;padding:clamp(14px,4vw,36px)}
.booking-hero{padding:clamp(22px,5vw,48px);border-radius:24px;background:#234c3c;color:#fffdf7}
.booking-hero h1{font-size:clamp(32px,6vw,52px);line-height:1.2;margin:12px 0}
.booking-hero p,.booking-policy p{margin:0}
.booking-brand{font-weight:700;letter-spacing:.08em}
.booking-brand span{display:block;font-size:.78rem;color:#d7e9de;letter-spacing:.12em}
.booking-policy{display:flex;flex-wrap:wrap;gap:4px 12px;align-items:baseline;margin:16px 0;padding:12px 18px;
  border:1px solid #e8d8b7;border-radius:12px;background:#fbf1dc;color:#59401d}
.booking-layout{display:grid;grid-template-columns:minmax(0,1.18fr) minmax(0,1fr);gap:16px;align-items:start}
.booking-panel,.booking-page #booking{min-width:0;margin:0;padding:clamp(14px,3vw,24px);background:#fffefa;
  border:1px solid #dddcd1;border-radius:18px;box-shadow:0 4px 18px #253c3010}
.booking-layout h2{margin:0 0 12px;font-size:1.2rem}
.booking-step{display:inline-grid;place-items:center;width:1.65em;height:1.65em;border-radius:50%;background:#e5eee6;color:#234c3c}
.booking-date{display:flex;flex-wrap:wrap;align-items:end;gap:8px;margin-bottom:14px}
.booking-date label{margin:0}
.booking-page input,.booking-page textarea{width:100%;background:#fff;color:inherit}
.booking-page textarea{box-sizing:border-box;min-height:88px;padding:9px 12px;font:inherit;
  border:1px solid #cfc7b8;border-radius:8px;resize:vertical}
.booking-page textarea:focus-visible{outline:3px solid #618777;outline-offset:2px}
.booking-page button{margin:0;font-weight:650}
.booking-page #slots{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,135px),1fr));gap:8px}
.booking-page #slots article{display:grid;gap:6px;padding:9px;text-align:center;background:#f7f9f5;border-color:#dce5da}
.booking-page #slots strong{font-size:.9rem;font-variant-numeric:tabular-nums}
.booking-page #slots button[aria-pressed=true],.booking-page #submit{background:#245240;border-color:#245240;color:#fff}
.booking-page #selected{margin:0;padding:8px 12px;border-radius:8px;background:#edf3ec;font-weight:650}
.booking-page #status{margin:10px 0;color:#4d4935}
.booking-page #status:empty{display:none}
.booking-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:12px}
@media(max-width:760px){.booking-layout{grid-template-columns:1fr}.booking-hero{border-radius:18px}}