/* 予約・購入・会員・管理ページ 共通（index.html の .btn / .nav と同じ見た目） */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0}
html,body{overflow-x:clip}
body{background:var(--paper);color:var(--sumi);font-family:var(--font-body);font-size:var(--t-body);line-height:2.05;
  -webkit-font-smoothing:antialiased;font-weight:300;font-feature-settings:"palt" 1;letter-spacing:.02em}
body::before{content:"";position:fixed;inset:0;z-index:-10;pointer-events:none;opacity:.9;
  background:radial-gradient(120% 80% at 50% -8%,var(--ai-100),transparent 62%),radial-gradient(80% 60% at 90% 105%,var(--ai-100),transparent 60%)}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
:focus-visible{outline:1px solid var(--focus);outline-offset:4px}
.wrap{max-width:1120px;margin:0 auto;padding:0 var(--s-md)}
.narrow{max-width:760px}
.en{font-family:var(--font-en);font-style:italic;font-weight:300;font-size:1.05rem;letter-spacing:.08em;color:var(--ai-700)}
.nav{position:fixed;inset:0 0 auto;z-index:90;border-bottom:1px solid transparent}
.nav.stuck{background:rgba(253,253,254,.9);backdrop-filter:blur(20px);border-bottom-color:var(--line)}
.nav-in{display:flex;align-items:center;gap:var(--s-md);max-width:1120px;margin:0 auto;padding:1.1rem var(--s-md)}
.logo img{height:38px;width:auto}
.nav-links{display:flex;gap:1.5rem;margin-left:auto}
.nav-links a{font-size:var(--t-sm);color:var(--sumi-2);white-space:nowrap;font-weight:400}
.nav-act{display:flex;gap:.6rem;margin-left:auto}
.nav-links+.nav-act{margin-left:0}
@media(max-width:900px){.nav-links{display:none}}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.68rem 1.5rem;border-radius:var(--r-pill);
  font-size:var(--t-sm);font-weight:400;white-space:nowrap;border:1px solid var(--sumi);cursor:pointer;letter-spacing:.04em;
  font-family:inherit;transition:background var(--d-1) var(--e-out),color var(--d-1)}
.btn-p{background:var(--ai-900);color:var(--on-accent)}.btn-p:hover{background:var(--ai-800)}
.btn-g{border-color:var(--line);color:var(--sumi-2);background:transparent}.btn-g:hover{border-color:var(--sumi);color:var(--sumi)}
.btn-lg{padding:.95rem 2.2rem;font-size:.95rem}
.btn[disabled]{opacity:.45;cursor:default}
.page{padding:9rem 0 var(--s-xl);min-height:70vh}
.page h1{font-family:var(--font-display);font-weight:500;font-size:var(--t-h2);letter-spacing:.04em;line-height:1.5;margin-bottom:1rem}
.page h2{font-family:var(--font-display);font-weight:500;font-size:1.2rem;letter-spacing:.04em;margin:var(--s-lg) 0 1rem;
  padding-top:1.2rem;border-top:1px solid var(--ai-600);line-height:1.6}
.page h2:first-of-type{margin-top:var(--s-md)}
.lead{color:var(--sumi-2);max-width:60ch}
.crumb{font-size:var(--t-sm);color:var(--sumi-3);margin-bottom:1.4rem}
.note{background:var(--ai-050);border-left:2px solid var(--ai-500);padding:1.1rem 1.3rem;margin:1.4rem 0;font-size:var(--t-sm);color:var(--sumi-2);line-height:1.95}
.note a,.lead a,.sm a{border-bottom:1px solid var(--ai-500)}
.sm{font-size:var(--t-sm);color:var(--sumi-3)}
.ok{color:var(--ai-800);background:var(--ai-100);padding:.6rem 1rem;border-radius:var(--r-sm)}
.msg{min-height:1.5em;font-size:var(--t-sm);color:var(--sumi-2)}
.card{background:var(--paper);border:1px solid var(--line);padding:1.6rem 1.8rem;border-radius:var(--r-sm);box-shadow:var(--shadow)}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:1.2rem;margin-bottom:var(--s-md)}
.card .tag{font-family:var(--font-en-ui);font-size:var(--t-xs);letter-spacing:.18em;color:var(--ai-600);text-transform:uppercase}
.card .big{font-family:var(--font-display);font-size:2.2rem;line-height:1.3;margin:.3rem 0}
.card .big small{font-size:1rem;color:var(--sumi-3)}
.card .btn{margin-top:.8rem}
.form{display:grid;gap:1rem;margin:var(--s-md) 0}
.form label{display:grid;gap:.3rem;font-size:var(--t-sm);color:var(--sumi-2)}
input[type=text],input[type=email],input[type=search],select{width:100%;padding:.75rem 1rem;border:1px solid var(--line-2);border-radius:var(--r-sm);
  background:var(--paper);font:inherit;font-size:1rem;color:var(--sumi)}
input:focus,select:focus{outline:none;border-color:var(--ai-700)}
.inline{display:flex;gap:.6rem;flex-wrap:wrap;align-items:center;margin:1rem 0}
.inline input,.inline select{width:auto;min-width:200px}
.tbl{width:100%;border-collapse:collapse;font-size:var(--t-sm);line-height:1.7}
.tbl th,.tbl td{text-align:left;padding:.7rem .6rem;border-bottom:1px solid var(--line);vertical-align:top}
.tbl th{font-weight:500;color:var(--sumi-3);font-size:var(--t-xs);letter-spacing:.08em}
.tbl tr.dim{color:var(--sumi-3)}
.tbl form{display:inline}
.tbl .btn{padding:.35rem 1rem}
footer{border-top:1px solid var(--line);padding:2rem 0}
.f-bot{display:flex;justify-content:space-between;font-size:var(--t-xs);color:var(--sumi-3)}
/* 予約ページ */
.steps{display:grid;grid-template-columns:minmax(0,1fr);gap:var(--s-md)}
.step{min-width:0;opacity:.4;pointer-events:none;transition:opacity var(--d-2)}
.step.on{opacity:1;pointer-events:auto}
.step h2{margin-top:0;border-top:none;padding-top:0}
.step h2 span{font-family:var(--font-en);font-style:italic;color:var(--ai-600);margin-right:.6rem}
.opts{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:.8rem}
.opt{border:1px solid var(--line);padding:1rem 1.2rem;border-radius:var(--r-sm);cursor:pointer;background:var(--paper);text-align:left;font:inherit;color:inherit;line-height:1.7}
.opt:hover{border-color:var(--ai-600)}
.opt.sel{border-color:var(--ai-900);box-shadow:inset 0 0 0 1px var(--ai-900)}
.opt .nm{font-weight:500;display:block}
.opt .pr{font-family:var(--font-display);font-size:1.15rem}
.opt .sm{display:block}
.days{display:flex;gap:.5rem;overflow-x:auto;padding-bottom:.5rem;scrollbar-width:thin}
.day{flex:0 0 auto;border:1px solid var(--line);border-radius:var(--r-sm);padding:.5rem .9rem;cursor:pointer;background:var(--paper);font:inherit;color:inherit;line-height:1.5;text-align:center}
.day .d{display:block;font-family:var(--font-en-ui);font-size:1.1rem}
.day .w{display:block;font-size:var(--t-xs);color:var(--sumi-3)}
.day.sel{border-color:var(--ai-900);background:var(--ai-900);color:var(--on-accent)}.day.sel .w{color:var(--ai-300)}
.times{display:flex;flex-wrap:wrap;gap:.5rem;margin-top:1rem}
.time{border:1px solid var(--line);border-radius:var(--r-pill);padding:.4rem 1.1rem;cursor:pointer;background:var(--paper);font:inherit;font-size:var(--t-sm);color:inherit}
.time.sel{background:var(--ai-900);color:var(--on-accent);border-color:var(--ai-900)}
.summary{background:var(--ai-050);padding:1rem 1.3rem;border-radius:var(--r-sm);margin-bottom:1rem;font-size:var(--t-sm);color:var(--sumi-2)}