.booking-embed{margin-top:48px;}
.booking-ui{width:100%;}
.booking-section{margin-top:88px;}
.booking-section:first-child{margin-top:0;}
.booking-section-title{
  margin:0 0 20px;
  color:var(--strong);
  font-weight:400;
  line-height:1.8;
  letter-spacing:.1em;
}
.booking-hidden{display:none!important;}
.service-option{
  display:grid;
  width:100%;
  grid-template-columns:34px minmax(0,1fr) auto;
  gap:16px;
  align-items:start;
  min-height:104px;
  padding:24px 0;
  border:0;
  border-bottom:1px solid var(--line-soft);
  background:transparent;
  color:inherit;
  font:inherit;
  font-weight:400;
  text-align:left;
  cursor:pointer;
  transition:opacity .45s ease;
}
.service-option:last-child{border-bottom:0;}
.service-list:hover .service-option{opacity:.45;transition-duration:.2s;}
.service-list .service-option:hover{opacity:1;}
.service-list:has([aria-pressed="true"]) .service-option{opacity:.45;}
.service-list .service-option[aria-pressed="true"]{opacity:1;}
.service-option[aria-pressed="true"]{background:var(--box);padding-inline:16px;}
.service-no{padding-top:9px;color:var(--muted-fg);font-family:var(--font-num);font-size:11px;letter-spacing:.16em;}
.service-name{display:block;color:var(--strong);font-weight:400;letter-spacing:.08em;}
.service-desc{display:block;margin-top:8px;color:var(--sub);font-size:12px;line-height:1.9;}
.service-meta{white-space:nowrap;font-family:var(--font-num);font-size:12px;font-feature-settings:"tnum";}
.spot-examples{margin:28px 0 0;padding:0;color:var(--sub);}
.spot-examples h3{margin:0 0 12px;color:var(--muted-fg);font-size:11px;font-weight:400;line-height:1.8;letter-spacing:.12em;}
.spot-examples p{margin:0;max-width:620px;font-size:12px;line-height:2;letter-spacing:.045em;}
.spot-examples p+p{margin-top:8px;}
.loading-block{min-height:136px;}
.loading-line{height:12px;margin-bottom:12px;background:var(--box);}
.loading-line:nth-child(1){width:82%;}.loading-line:nth-child(2){width:64%;}.loading-line:nth-child(3){width:72%;}
.date-tabs{display:flex;gap:8px;overflow-x:auto;padding:0 0 12px;border-bottom:1px solid var(--line-soft);scrollbar-width:thin;}
.date-tab{flex:0 0 auto;min-width:72px;min-height:56px;padding:8px 12px;border:0;border-bottom:1px solid transparent;background:transparent;color:inherit;font:inherit;cursor:pointer;transition:opacity .45s ease;}
.date-tabs:has([aria-selected="true"]) .date-tab{opacity:.45;}
.date-tabs .date-tab[aria-selected="true"], .date-tabs .date-tab:hover{opacity:1;}
.date-tab[aria-selected="true"]{border-bottom-color:var(--foreground);background:var(--box);}
.date-day{display:block;font-size:12px;}.date-weekday{display:block;color:var(--muted-fg);font-size:10px;}
.time-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(min(100%,112px),1fr));gap:8px;margin-top:24px;}
.time-button{min-height:48px;border:1px solid var(--line-soft);border-radius:2px;background:transparent;color:inherit;font-family:var(--font-num);font-size:13px;cursor:pointer;transition:opacity .45s ease;}
.time-grid:has([aria-pressed="true"]) .time-button{opacity:.45;}
.time-grid .time-button[aria-pressed="true"], .time-grid .time-button:hover{opacity:1;}
.time-button[aria-pressed="true"]{background:var(--strong);color:var(--bg);}
.booking-form{display:grid;gap:24px;}
.booking-field label,.booking-field-label{display:block;margin-bottom:7px;font-size:13px;font-weight:400;}
.booking-field input{width:100%;padding:11px 2px;border:0;border-bottom:1px solid var(--line-soft);border-radius:0;background:transparent;color:var(--foreground);font:inherit;font-weight:400;letter-spacing:.04em;}
.booking-field textarea{width:100%;padding:12px 14px;border:1px solid var(--line-soft);border-radius:2px;background:transparent;color:var(--foreground);font:inherit;font-weight:400;letter-spacing:.04em;}
.booking-field textarea{min-height:132px;resize:vertical;line-height:1.85;}
.booking-field input:focus,.booking-field textarea:focus{border-color:var(--strong);outline:none;}
/* SNSアカウント: 種類プルダウン＋ID/URL入力の2点セット(2026-09-01) */
.booking-sns{display:grid;grid-template-columns:minmax(0,168px) minmax(0,1fr);gap:12px 16px;align-items:end;}
.booking-sns-select{position:relative;display:block;}
.booking-sns-select select{
  width:100%;
  padding:11px 22px 11px 2px;
  border:0;
  border-bottom:1px solid var(--line-soft);
  border-radius:0;
  background:transparent;
  color:var(--foreground);
  font:inherit;
  font-weight:400;
  letter-spacing:.04em;
  line-height:inherit;
  cursor:pointer;
  appearance:none;
  -webkit-appearance:none;
  color-scheme:light;
}
.booking-sns-select select:focus{border-color:var(--strong);outline:none;}
.booking-sns-select select[data-empty="true"]{color:var(--muted-fg);}
.booking-sns-select::after{
  content:"";
  position:absolute;
  right:4px;
  top:50%;
  width:6px;
  height:6px;
  margin-top:-6px;
  border-right:1px solid var(--muted-fg);
  border-bottom:1px solid var(--muted-fg);
  transform:rotate(45deg);
  pointer-events:none;
}
@media (prefers-color-scheme:dark){.booking-sns-select select{color-scheme:dark;}}
:root[data-theme="dark"] .booking-sns-select select{color-scheme:dark;}
:root[data-theme="light"] .booking-sns-select select{color-scheme:light;}
@media (max-width:560px){.booking-sns{grid-template-columns:minmax(0,1fr);}}
.form-optional{color:var(--muted-fg);font-size:11px;}
.booking-submit{min-height:52px;padding:0 24px;border:0;border-radius:2px;background:var(--strong);color:var(--bg);font:inherit;font-size:13px;font-weight:400;letter-spacing:.12em;cursor:pointer;}
.booking-submit:disabled{opacity:.4;cursor:not-allowed;}
.booking-note{margin:10px 0 0;color:var(--sub);font-size:11px;}
.booking-message{margin-top:24px;padding:16px 18px;border-left:2px solid var(--line-soft);background:var(--box);font-size:13px;}
.booking-message[data-tone="error"]{border-left-color:#8a4d4d;}.booking-message[data-tone="success"]{border-left-color:#52795d;}
.booking-message p{margin:0;}.booking-message p+p{margin-top:6px;color:var(--sub);}
/* 決済から戻った直後の確認バナー（段階表示型） */
.booking-confirm{
  --conf-ease:cubic-bezier(.23,1,.58,1);
  --conf-ok:#52795d;
  --conf-ok-bright:#6f9b7b;
  --conf-ok-wash:rgba(82,121,93,.12);
  position:relative;
  overflow:hidden;
  margin-top:24px;
  padding:16px 18px;
  border-left:2px solid var(--line-soft);
  background:var(--box);
  opacity:0;
  transform:translateY(6px);
  transition:opacity .3s var(--conf-ease),transform .3s var(--conf-ease),padding .3s var(--conf-ease),border-left-color .3s var(--conf-ease);
}
.booking-confirm[data-state="pending"],.booking-confirm[data-state="done"]{opacity:1;transform:translateY(0);}
.booking-confirm[data-state="done"]{padding:22px 20px;border-left-color:var(--conf-ok);animation:booking-confirm-settle .5s var(--conf-ease);}
@keyframes booking-confirm-settle{0%{transform:translateY(-5px);}100%{transform:translateY(0);}}
.booking-confirm::after{content:"";position:absolute;inset:0;background:var(--conf-ok-wash);opacity:0;pointer-events:none;}
.booking-confirm[data-state="done"].is-flash::after{animation:booking-confirm-wash .9s var(--conf-ease) forwards;}
@keyframes booking-confirm-wash{0%{opacity:0;}22%{opacity:1;}100%{opacity:0;}}
.booking-confirm-body{display:grid;grid-template-columns:auto 1fr;gap:12px;align-items:start;}
.booking-confirm-mark{position:relative;display:block;width:16px;height:16px;margin-top:4px;}
.booking-confirm-dot{position:absolute;inset:5px;border-radius:50%;background:var(--muted-fg);animation:booking-confirm-breathe 1.5s var(--conf-ease) infinite;}
@keyframes booking-confirm-breathe{0%,100%{opacity:.35;}50%{opacity:1;}}
.booking-confirm[data-state="done"] .booking-confirm-dot{display:none;}
.booking-confirm-check{display:block;width:16px;height:16px;opacity:0;}
.booking-confirm[data-state="done"] .booking-confirm-check{opacity:1;}
.booking-confirm-check path{fill:none;stroke:var(--conf-ok-bright);stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;stroke-dasharray:16;stroke-dashoffset:16;}
.booking-confirm[data-state="done"] .booking-confirm-check path{animation:booking-confirm-draw .5s var(--conf-ease) .08s forwards;}
@keyframes booking-confirm-draw{to{stroke-dashoffset:0;}}
.booking-confirm-lines{display:grid;}
.booking-confirm-line{grid-area:1/1;transition:opacity .2s var(--conf-ease);}
.booking-confirm-line[data-line="done"]{opacity:0;}
.booking-confirm[data-state="done"] .booking-confirm-line[data-line="pending"]{opacity:0;}
.booking-confirm[data-state="done"] .booking-confirm-line[data-line="done"]{opacity:1;transition:opacity .3s var(--conf-ease) .12s;}
.booking-confirm-t1{margin:0;font-size:13px;line-height:1.9;color:var(--foreground);transition:font-size .3s var(--conf-ease),letter-spacing .3s var(--conf-ease),color .3s var(--conf-ease);}
.booking-confirm-t2{margin:5px 0 0;color:var(--sub);font-size:11.5px;line-height:1.9;}
.booking-confirm[data-state="done"] .booking-confirm-t1{color:var(--strong);font-size:15px;letter-spacing:.06em;}
@media (max-width:560px){.service-option{grid-template-columns:28px minmax(0,1fr);}.service-meta{grid-column:2;}.booking-section{margin-top:88px;}}
@media (max-width:560px){
  .booking-confirm{padding:14px 15px;}
  .booking-confirm[data-state="done"]{padding:18px 16px;}
  .booking-confirm[data-state="done"] .booking-confirm-t1{font-size:14px;}
}
@media (prefers-reduced-motion:reduce){
  .booking-confirm,.booking-confirm[data-state="done"]{animation:none;}
  .booking-confirm-dot{animation:none;opacity:.6;}
  .booking-confirm-check path{stroke-dashoffset:0;animation:none;}
  .booking-confirm[data-state="done"].is-flash::after{animation:none;}
}
