:root{--ink:#17171b;--sub:#4b4b54;--paper:#fff;--ground:#f2f1ed;--line:#dedbd2;--dark:#0e0e11;--accent:#ff8a1f;--soft:#fff0e0;--error:#b0312a;font-family:system-ui,"Noto Sans JP",sans-serif;color:var(--ink);background:var(--ground);line-height:1.8}
.layout>*{min-width:0}.day-tabs{max-width:100%}
*{box-sizing:border-box}[hidden]{display:none!important}body{margin:0}.wrap{max-width:1120px;margin:auto;padding:0 32px}header{background:var(--dark);color:var(--paper)}.brand{display:flex;align-items:center;gap:20px;min-height:80px;font-size:28px;font-weight:900}.brand span{font-size:13px}.badge{margin-left:auto;border:1px solid var(--accent);padding:4px 10px;color:var(--accent)}.intro{padding:48px 0 24px}.eyebrow{font-weight:800;letter-spacing:.13em;color:var(--sub);font-size:12px;margin:0}h1{font-size:clamp(25px,4vw,42px);margin:8px 0}h2{font-size:23px;margin:8px 0 24px}p{margin:12px 0}.notice{background:var(--soft);border-left:4px solid var(--accent);padding:16px 20px;border-radius:4px}.notice p{font-size:14px}.steps{list-style:none;display:flex;gap:8px;padding:0;margin:28px 0}.steps li{flex:1;border-bottom:3px solid var(--line);padding:12px 4px;color:var(--sub);font-size:14px}.steps [aria-current]{border-color:var(--accent);color:var(--ink);font-weight:700}.layout{display:grid;grid-template-columns:1fr 1.1fr;gap:24px;align-items:start}.card{background:var(--paper);border:1px solid var(--line);border-radius:8px;padding:28px}label{display:flex;flex-direction:column;gap:6px;font-size:14px;font-weight:700;margin-bottom:20px}input,select,button{font:inherit;min-height:48px;border:1px solid var(--line);border-radius:6px;background:var(--paper);color:var(--ink);padding:10px 12px;min-width:0;width:100%}input,select{font-weight:400}button{cursor:pointer;font-weight:700}button:hover:not(:disabled){border-color:var(--ink)}button:disabled{cursor:not-allowed;opacity:.55}.primary{background:var(--accent);border-color:var(--accent);min-height:56px}.times,.actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.hint{font-size:13px;color:var(--sub)}.error{color:var(--error);font-weight:700}.error:empty{display:none}.slots{display:grid;grid-template-columns:repeat(6,1fr);gap:6px;margin:20px 0;font-variant-numeric:tabular-nums}.slots button{font-size:12px;padding:8px 2px;min-height:44px}.busy{background:var(--ground);text-decoration:line-through}.legend{display:flex;gap:16px;font-size:12px}.legend span:last-child{background:var(--ground);padding:0 8px}.summary{font-weight:700;border-block:1px solid var(--line);padding:14px 0}#details,#confirm,#done{max-width:720px;margin:auto}dl{display:grid;grid-template-columns:140px 1fr;gap:12px}dt{color:var(--sub)}dd{margin:0;overflow-wrap:anywhere}footer{padding:40px 0;font-size:12px;color:var(--sub)}:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
@media(max-width:767px){.wrap{padding:0 20px}.brand{gap:10px;min-height:64px}.brand>span:not(.badge){display:none}.intro{padding-top:32px}.layout{grid-template-columns:1fr}.card{padding:20px}.notice{padding:14px}.steps li{font-size:12px}.slots{grid-template-columns:repeat(4,1fr)}.actions{grid-template-columns:1fr}dl{grid-template-columns:1fr;gap:2px}dd{margin-bottom:12px}h2{font-size:21px}}
.wrap{max-width:1312px}.brand-name{color:var(--paper);text-decoration:none;white-space:nowrap}.brand nav{margin-left:auto;display:flex;align-items:center;gap:24px}.brand nav a{font-size:12px;letter-spacing:.08em;color:var(--paper);text-decoration:none;padding:12px 0}.brand nav .nav-booking{color:var(--ink);background:var(--accent);padding:12px 20px;border-radius:4px}.badge{margin-left:0;font-size:10px!important}.intro{display:grid;grid-template-columns:1fr 1fr;gap:40px;align-items:center;padding:48px 0}.intro .eyebrow{color:var(--error)}.intro figure{margin:0;position:relative;border-radius:6px;overflow:hidden;background:var(--dark)}.intro img{display:block;width:100%;height:280px;object-fit:cover}.intro figcaption{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(transparent,var(--dark));padding:48px 24px 16px;color:var(--paper);font-weight:900;font-size:28px;letter-spacing:.08em}.intro figcaption span{font-size:12px;margin-left:10px}.studio-tags{display:flex;flex-wrap:wrap;gap:6px}.studio-tags span{border:1px solid var(--line);padding:3px 10px;font-size:12px}.hero-link{display:inline-flex;gap:40px;color:var(--ink);font-weight:700;text-decoration:none;border-bottom:2px solid var(--accent);padding:12px 0;margin-top:14px}.booking-heading{display:flex;align-items:baseline;gap:20px;margin-top:44px;scroll-margin-top:20px}.booking-heading .eyebrow{font-size:32px;letter-spacing:.02em;color:var(--ink)}.booking-heading h2{font-size:16px;margin:0}.booking-heading>span{margin-left:auto;font-size:12px;color:var(--sub)}.layout{grid-template-columns:310px minmax(0,1fr)}#choose{position:sticky;top:20px}.selection-box{background:var(--ground);padding:16px;margin:20px 0;display:flex;flex-direction:column;gap:8px}.selection-box>span,.selection-box small{font-size:12px;color:var(--sub)}.selection-box strong{font-size:15px;font-variant-numeric:tabular-nums}.calendar-title{display:flex;gap:16px;align-items:center;justify-content:space-between}.calendar-title h2{margin-bottom:8px}.demo-label{font-size:11px;border:1px solid var(--line);padding:4px 8px;white-space:nowrap}.calendar-toolbar{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:20px 0}.calendar-toolbar button{width:auto;font-size:12px}.calendar-toolbar strong{font-size:14px;text-align:center}.calendar-scroll{max-height:560px;overflow:auto;overscroll-behavior:contain;border:1px solid var(--line);border-radius:4px}.calendar{width:100%;border-collapse:separate;border-spacing:0;table-layout:fixed;font-size:12px;font-variant-numeric:tabular-nums}.calendar th,.calendar td{text-align:center;border-bottom:1px solid var(--line);border-right:1px solid var(--line);height:44px;padding:0}.calendar thead th{position:sticky;top:0;z-index:1;background:var(--dark);color:var(--paper);font-size:11px;padding:4px}.calendar tr>th:first-child{width:60px}.calendar tbody th{background:var(--ground);font-weight:500}.calendar td>span{display:grid;place-items:center;height:44px;color:var(--sub);background:var(--ground)}.calendar button{border:0;border-radius:0;min-height:44px;padding:0;color:var(--sub)}.calendar button:hover{background:var(--soft)}.calendar .selected-slot,.calendar .selected-slot button{background:var(--soft);color:var(--ink)}.calendar .selected-slot button{box-shadow:inset 3px 0 var(--accent);font-weight:900}.calendar button:focus-visible{outline-offset:-4px}.day-tabs{display:none}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}.guide{border-top:1px solid var(--line);margin-top:64px;padding-top:40px;scroll-margin-top:20px}.guide ol{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;list-style:none;padding:0}.guide li{padding:24px;background:var(--paper);border-radius:6px}.guide strong{font-size:17px}.guide p{font-size:14px;color:var(--sub)}
@media(min-width:768px) and (max-width:1023px){.brand-name span,.badge{display:none}.layout{grid-template-columns:260px minmax(0,1fr)}.card{padding:16px}.intro{gap:24px}.intro img{height:240px}.calendar-title{display:block}.booking-heading>span{display:none}}
@media(max-width:767px){.brand{min-height:64px}.brand-name span,.brand nav>a:not(.nav-booking),.badge{display:none}.brand nav{gap:0}.brand nav .nav-booking{font-size:11px;padding:10px 12px;min-height:44px}.intro{grid-template-columns:1fr;gap:24px;padding:28px 0}.intro img{height:190px}.intro figcaption{font-size:24px}.intro p{font-size:14px}h1{font-size:clamp(23px,6.4vw,32px)}.booking-heading{flex-wrap:wrap;gap:4px 16px;margin-top:32px}.booking-heading .eyebrow{font-size:28px}.booking-heading>span{width:100%;margin-left:0}.layout{grid-template-columns:1fr}.layout #availability{order:0}.layout #choose{order:1;position:static}.calendar-title{display:block}.calendar-title h2{font-size:21px}.calendar-toolbar{gap:6px}.calendar-toolbar strong{font-size:11px}.calendar-toolbar button{padding:8px;font-size:11px}.day-tabs{display:flex;gap:6px;overflow-x:auto;padding:4px 2px 10px}.day-tabs button{flex:0 0 68px;padding:6px;font-size:11px}.day-tabs [aria-pressed=true]{background:var(--dark);color:var(--paper)}.calendar .other-day{display:none}.calendar-scroll{max-height:360px}.legend{gap:8px;flex-wrap:wrap}.legend span{font-size:11px}.guide{margin-top:40px}.guide ol{grid-template-columns:1fr;gap:12px}.guide li{padding:20px}}
.deal-panel{display:flex;flex-direction:column;gap:4px;padding:14px;background:var(--paper);border-left:4px solid var(--accent);line-height:1.5}
.deal-kicker{color:var(--sub);font-size:11px;font-weight:700}
.deal-panel #deal-current{color:var(--ink);font-size:16px;line-height:1.45}
.deal-panel #deal-saving{color:#9c3600;font-size:14px;font-weight:800}
.deal-panel #deal-next{display:block;color:var(--sub);font-size:12px;margin-top:4px}
.deal-tiers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px}
.deal-tier{display:flex;flex-direction:column;gap:2px;border-top:3px solid var(--line);padding:7px 2px;font-size:10px;line-height:1.4;color:var(--sub)}
.deal-tier strong{font-size:12px;color:var(--ink)}
.deal-tier.is-reached{border-color:var(--accent);background:var(--soft)}
.deal-tier.is-reached strong{color:#9c3600}
.selection-box .deal-note{font-size:11px;line-height:1.5}
.price-panel{display:flex;flex-direction:column;gap:3px;background:var(--accent);color:var(--ink);padding:14px;line-height:1.5}
.price-panel>span{font-size:12px;color:var(--ink);font-weight:800}
.price-panel>strong{color:var(--ink);font-size:25px;line-height:1.35;overflow-wrap:anywhere;font-variant-numeric:tabular-nums}
.price-panel>small{font-size:11px;color:var(--ink)}
.price-panel[data-kind=needs-rule]>strong{font-size:16px}
.price-live{display:flex;flex-direction:column;gap:4px;padding:20px 24px;margin:20px 0;background:var(--accent);color:var(--ink);border-left:5px solid var(--accent);line-height:1.45}
.price-live>span{color:var(--ink);font-size:14px;font-weight:800}
.price-live>strong{color:var(--ink);font-size:clamp(28px,5vw,40px);font-variant-numeric:tabular-nums;overflow-wrap:anywhere}
.price-live>small{color:var(--ink);font-size:12px;line-height:1.6}
/* Keep all seven days available on phones; scroll only the timetable. */
.duration-panel{border:0;padding:0;margin:0 0 28px;min-width:0}
.duration-panel legend{font-size:22px;font-weight:800;margin-bottom:14px}
.duration-status{font-size:14px;font-weight:700}
.custom-duration select{font-size:16px;font-weight:700;min-height:52px}
.duration-deal{margin:10px 0 0;font-size:14px;font-weight:700;color:#9c3600;background:var(--soft);border-radius:4px;padding:8px 12px}
.duration-deal[hidden]{display:none}
.layout.calendar-first{grid-template-columns:minmax(0,1fr)}
.calendar-filters{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin-block:16px}
.calendar-filters>*{min-width:0}
.date-note{display:block;margin-top:6px;font-size:13px;font-weight:700;color:var(--error)}
.date-note:empty{display:none}
input[type=date],select{min-width:0;max-width:100%;width:100%}
.chosen-start{font-size:20px;font-weight:800;margin:0 0 12px}
.change-date{margin-bottom:20px}
#choose{scroll-margin-top:20px}
#choose .times{grid-template-columns:1fr}
@media(max-width:767px){.calendar-filters{grid-template-columns:1fr}input[type=date]{appearance:none;min-height:48px}#choose h2{font-size:21px}}
.calendar-swipe-hint{display:none;background:var(--soft);color:var(--ink);padding:10px 8px;text-align:center;font-size:12px;font-weight:700;border-radius:4px}
.calendar thead th.today-column{background:var(--accent);color:var(--ink)}
.today-badge{display:block;font-size:12px;font-weight:900;line-height:1.5}
.calendar td.today-column{border-left:2px solid var(--accent);border-right:2px solid var(--accent)}
.calendar thead th.chosen-day{background:var(--soft);color:var(--ink);box-shadow:inset 0 -3px var(--accent)}
.chosen-badge{display:block;font-size:12px;font-weight:900;line-height:1.5;color:#9c3600}
.calendar td.chosen-day:not(.selected-slot){background:#fffaf4}
@media(max-width:767px){
 .calendar-swipe-hint{display:block}
 .day-tabs{display:none}
 .calendar .other-day{display:table-cell}
 .calendar{min-width:620px}
 .calendar-scroll{max-width:100%;max-height:440px}
 .calendar tr>th:first-child{position:sticky;left:0;z-index:2}
 .calendar thead tr>th:first-child{z-index:3}
}
.brand-name{display:inline-flex;align-items:center;min-height:44px;flex-shrink:0}
.brand-logo{display:block;width:144px;height:auto;max-height:64px;object-fit:contain}
@media(max-width:767px){.brand-logo{width:112px;max-height:56px}}
#test-payment-link{display:block;min-height:56px;margin:20px 0;padding:14px 18px;border-radius:6px;background:var(--accent);color:var(--ink);font-weight:800;text-align:center;text-decoration:none}
#test-payment-link:hover{filter:brightness(.95)}

.selected-bar{display:flex;flex-wrap:wrap;align-items:baseline;gap:2px 10px;margin:4px 0 16px;padding:12px 16px;border:2px solid var(--accent);border-radius:6px;background:var(--soft);font-size:14px}.selected-bar>span:first-child{font-size:12px;font-weight:800;color:#9c3600}.selected-bar strong{font-size:18px;font-variant-numeric:tabular-nums}.selected-bar-price{margin-left:auto;font-size:18px;font-weight:800}.selected-bar.is-empty{display:block;border:1px dashed var(--line);background:none;color:var(--sub);font-size:13px}
@media(max-width:767px){.selected-bar strong,.selected-bar-price{font-size:16px}.selected-bar-price{margin-left:0}}

/* PC: no left panel — the calendar takes the full width and the 選択中 bar holds price, saving and the next step. */
.selected-bar-saving{font-size:13px;font-weight:800;color:#9c3600}
.selected-bar-next{display:none}
.selected-bar-error{flex-basis:100%;margin:0;color:var(--error);font-weight:700;font-size:13px}.selected-bar-error:empty{display:none}
@media(min-width:768px){
  .layout,.layout.calendar-first{grid-template-columns:minmax(0,1fr)}
  .layout #choose{display:none}
  .selected-bar:not(.is-empty){align-items:center;padding:14px 16px 14px 20px}
  .selected-bar-next{display:block;width:auto;min-height:48px;padding:10px 22px;margin-left:12px}
}

/* PC: bottom bar with the chosen slot and the next step, while the 選択中 bar is off screen. */
.float-bar{display:none}
@media(min-width:768px){
  .float-bar.is-visible{display:flex;align-items:center;gap:12px;position:fixed;left:0;right:0;bottom:0;z-index:30;padding:10px max(24px,calc((100% - 1248px)/2));background:var(--paper);border-top:3px solid var(--accent);box-shadow:0 -6px 20px rgba(0,0,0,.10);font-size:14px}
  .float-bar strong{font-size:17px;font-variant-numeric:tabular-nums}
  .float-bar-price{margin-left:auto;font-size:18px;font-weight:800}
  .float-bar .primary{width:auto;min-height:48px;padding:10px 22px}
  .float-bar-error{color:var(--error);font-weight:700;font-size:13px}.float-bar-error:empty{display:none}
  body.has-float-bar{padding-bottom:76px}
}
@media (prefers-reduced-motion:no-preference){.float-bar.is-visible{animation:float-bar-in .18s ease-out}@keyframes float-bar-in{from{transform:translateY(100%)}to{transform:none}}}
.consent{display:flex;flex-direction:row;flex-wrap:wrap;align-items:center;gap:4px 2px;margin:18px 0 20px;font-size:14px;line-height:1.6}.consent input{width:22px;height:22px;min-height:0;margin:0 4px 0 0;accent-color:var(--accent)}.consent a{color:var(--ink);font-weight:700}