/* 総本家たぬき村 ガレージマーケット — ブランド色: 輪郭#3A2B20 / チャコール#4A4642 / トープ#A88E74 / クリーム#E8D8C4 / 背景#F4EEE6 */
:root{--ink:#3A2B20;--char:#4A4642;--taupe:#A88E74;--cream:#E8D8C4;--bg:#F4EEE6;--paper:#FBF7F1;--line:#d9c9b4;--ok:#4d6b3a;--okbg:#e4ecd8;--few:#8a5a12;--fewbg:#f6e6c3;--no:#7a716a;--nobg:#e6dfd6;--danger:#8e2f26;
  --serif:"Hiragino Mincho ProN","Yu Mincho","YuMincho","Noto Serif JP",serif;--sans:"Hiragino Sans","Hiragino Kaku Gothic ProN","Yu Gothic UI","Noto Sans JP",Meiryo,sans-serif;--r:14px}
*{box-sizing:border-box}html{scroll-behavior:smooth}
body{margin:0;background:var(--bg);color:var(--ink);font:16px/1.85 var(--sans);-webkit-text-size-adjust:100%;overflow-wrap:anywhere}
body::before{content:"";position:fixed;inset:0;z-index:-1;background:radial-gradient(60rem 30rem at 85% -5%,#efe2cf 0,transparent 60%),radial-gradient(40rem 26rem at -10% 40%,#eee3d3 0,transparent 60%)}
img{max-width:100%;height:auto}a{color:var(--ink);text-underline-offset:.2em;text-decoration-color:var(--taupe)}a:hover{text-decoration-color:var(--ink)}
:focus-visible{outline:3px solid var(--taupe);outline-offset:3px;border-radius:4px}
.skip{position:absolute;left:-999px;top:0;background:var(--ink);color:var(--bg);padding:.6rem 1rem;z-index:99}.skip:focus{left:0}
h1,h2,h3{font-family:var(--serif);line-height:1.4;letter-spacing:.02em}h1{font-size:clamp(1.55rem,5vw,2.1rem);margin:.2rem 0 1rem}h2{font-size:1.25rem;margin:2rem 0 .6rem}h3{font-size:1.05rem;margin:.5rem 0 .2rem}
.top{position:sticky;top:0;z-index:20;display:flex;align-items:center;justify-content:space-between;gap:.8rem;padding:.55rem max(1rem,calc((100vw - 68rem)/2));background:rgba(244,238,230,.92);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.brand{display:flex;align-items:center;gap:.6rem;text-decoration:none;font-family:var(--serif);font-weight:700;line-height:1.2}.brand small{display:block;font:500 .7rem var(--sans);color:var(--char);letter-spacing:.08em}.brand img{border-radius:50%;background:var(--cream);padding:2px}
.top nav{display:flex;align-items:center;gap:.2rem}.top nav a{padding:.5rem .7rem;text-decoration:none;border-radius:999px;font-size:.92rem}.top nav a[aria-current]{background:var(--cream)}.top nav a.btn{padding:.5rem 1rem;margin-left:.3rem}
main{display:block}main.narrow{max-width:46rem;margin:0 auto;padding:1.5rem 1rem 4rem}main.wide{max-width:none;padding:0 0 4rem}
.panel{background:var(--paper);border:1px solid var(--line);border-radius:var(--r);padding:clamp(1.1rem,3.5vw,2rem);box-shadow:0 1px 0 #fff inset,0 8px 24px -16px rgba(58,43,32,.35)}.wide-panel{max-width:68rem;margin:1.5rem auto}main.wide .panel{margin:1.5rem max(1rem,calc((100vw - 68rem)/2))}
.crumb{font-size:.9rem;margin:0}.note{font-size:.88rem;color:var(--char)}.date{color:var(--char);margin:0}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:.4rem;font:600 1rem/1.2 var(--sans);background:var(--ink);color:var(--bg);border:2px solid var(--ink);border-radius:999px;padding:.85rem 1.6rem;min-height:3rem;text-decoration:none;cursor:pointer;transition:transform .15s,background .15s,box-shadow .15s}
.btn:hover{background:#51392a;box-shadow:0 6px 16px -8px rgba(58,43,32,.6)}.btn:active{transform:translateY(1px)}.btn:disabled{opacity:.5;cursor:wait}.btn.ghost{background:transparent;color:var(--ink)}.btn.ghost:hover{background:var(--cream)}.btn.sm{min-height:2.75rem;padding:.4rem 1rem;font-size:.9rem}.btn.danger{background:var(--danger);border-color:var(--danger)}
.notice{padding:.8rem 1rem;border-radius:10px;background:var(--cream);border-left:5px solid var(--taupe)}.notice.ok{background:var(--okbg);border-color:var(--ok)}.notice.warn{background:var(--fewbg);border-color:var(--few)}.notice.err{background:#f3d9d4;border-color:var(--danger)}
.tag{display:inline-block;border-radius:6px;padding:.05rem .55rem;font-size:.82rem;font-weight:600;background:var(--cream);white-space:nowrap}.tag.ok{background:var(--okbg);color:var(--ok)}.tag.few{background:var(--fewbg);color:var(--few)}.tag.no{background:var(--nobg);color:var(--no)}
dl.kv{display:grid;grid-template-columns:minmax(5rem,8rem) 1fr;gap:.55rem 1rem;margin:1rem 0}dl.kv dt{color:var(--char);font-size:.92rem}dl.kv dd{margin:0}
.rules{padding-left:1.2rem}.rules li{margin:.2rem 0}
.price{display:grid;gap:.8rem;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));margin:.8rem 0}.price>div{background:var(--bg);border:1px dashed var(--taupe);border-radius:12px;padding:.8rem 1rem}.price b{font-family:var(--serif)}.price span{display:block;font-size:1.5rem;font-weight:700;font-family:var(--serif)}.price small{font-size:.8rem;font-weight:400;font-family:var(--sans);margin-left:.3rem}.price p{margin:.3rem 0 0;font-size:.88rem}
/* ===== トップ ===== */
.hero{display:grid;gap:1.5rem;align-items:center;max-width:68rem;margin:0 auto;padding:2rem 1rem 1rem;grid-template-columns:1.1fr .9fr}
.eyebrow{display:inline-block;margin:0;padding:.15rem .8rem;border:1px solid var(--taupe);border-radius:999px;font-size:.82rem;letter-spacing:.12em;color:var(--char)}
.hero h1{font-size:clamp(2rem,7vw,3.4rem);line-height:1.2;margin:.8rem 0}.hero h1 span{font-size:.62em;display:block;color:var(--char);letter-spacing:.12em;margin-top:.3rem}.lead{max-width:30rem}
.cta{font-size:1.1rem;padding:1rem 2rem}.next{list-style:none;padding:0;margin:1.2rem 0 0;display:flex;flex-wrap:wrap;gap:.5rem}.next a{display:flex;gap:.6rem;align-items:center;padding:.4rem .9rem;background:var(--paper);border:1px solid var(--line);border-radius:999px;text-decoration:none}.next a.off{opacity:.55}
.stage-wrap{justify-self:center;width:min(100%,26rem)}
.stage{position:relative;aspect-ratio:1/1.12;display:grid;place-items:end center;perspective:900px;touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none}.stage.grab{cursor:grabbing}.stage:focus-visible{outline-offset:6px;border-radius:50%}
.spot{position:absolute;inset:6% 4% 8%;border-radius:50%;background:radial-gradient(circle at 50% 38%,#f9f1e6 0,var(--cream) 62%,#dcc8ae 100%);box-shadow:0 20px 40px -24px rgba(58,43,32,.5) inset}
.spot::after{content:"";position:absolute;inset:-3%;border:2px dashed var(--taupe);border-radius:50%;opacity:.7;animation:spin 60s linear infinite}
.mugi-box{position:relative;width:78%;height:92%;display:grid;place-items:end center;transform-style:preserve-3d}
.mugi-box::after{content:"";position:absolute;left:12%;right:12%;bottom:-1%;height:7%;border-radius:50%;background:radial-gradient(closest-side,rgba(58,43,32,.38),transparent);transform:scaleX(var(--sh,1));z-index:0}
.mugi-img{position:relative;z-index:1;pointer-events:none;max-width:100%;max-height:100%;width:auto;height:auto;object-fit:contain;transform-origin:50% 90%;will-change:transform;filter:drop-shadow(0 6px 8px rgba(58,43,32,.18));animation:enter .9s cubic-bezier(.2,.8,.2,1) both}
.stage.idle .mugi-box{animation:sway 6s ease-in-out 1.2s infinite}
.turn-ctl{position:relative;z-index:3;display:flex;align-items:center;justify-content:center;gap:.8rem;margin-top:.6rem}.turn-ctl button{width:2.75rem;height:2.75rem;border-radius:50%;border:2px solid var(--ink);background:var(--paper);color:var(--ink);font-size:1rem;cursor:pointer}.turn-ctl button:hover{background:var(--cream)}.hint{font-size:.88rem;color:var(--char);min-width:11rem;text-align:center}
@keyframes spin{to{transform:rotate(360deg)}}@keyframes enter{from{opacity:0;transform:translateY(14px) scale(.97)}}@keyframes sway{0%,100%{transform:rotateY(-5deg)}50%{transform:rotateY(5deg)}}
.band{background:linear-gradient(var(--cream),#efe3d1);padding:2.2rem 0;margin-top:1.5rem}.band .wrap,.wrap{max-width:68rem;margin:0 auto;padding:0 1rem}section.wrap{padding-top:1.2rem}
.steps{list-style:none;counter-reset:s;display:grid;grid-template-columns:repeat(3,1fr);gap:1rem;padding:0}.steps li{counter-increment:s;background:var(--paper);border-radius:var(--r);padding:1rem;border:1px solid var(--line)}.steps li::before{content:counter(s);display:grid;place-items:center;width:2rem;height:2rem;border-radius:50%;background:var(--ink);color:var(--bg);font-family:var(--serif);margin-bottom:.4rem}.steps b{display:block;font-family:var(--serif)}.steps span{font-size:.9rem}
.cards{display:grid;grid-template-columns:repeat(auto-fill,minmax(13rem,1fr));gap:1rem}.card{display:block;background:var(--paper);border:1px solid var(--line);border-radius:var(--r);overflow:hidden;text-decoration:none;transition:transform .2s,box-shadow .2s}.card:hover{transform:translateY(-3px);box-shadow:0 14px 24px -16px rgba(58,43,32,.5)}
.card img,.card .ph{width:100%;aspect-ratio:4/3;object-fit:cover;display:block;background:var(--cream)}.card h3,.card p,.card .pr{margin-left:.9rem;margin-right:.9rem}.card p{font-size:.88rem;color:var(--char);margin-top:0}.card .pr{display:block;font-weight:700;margin-bottom:.9rem}
.more{text-align:right}.newslist{list-style:none;padding:0;margin:0}.newslist li{display:flex;gap:1rem;padding:.7rem 0;border-bottom:1px solid var(--line)}.newslist time{color:var(--char);min-width:6rem;font-variant-numeric:tabular-nums}
.tabs{display:flex;flex-wrap:wrap;gap:.4rem;margin:.5rem 0 1.2rem}.tabs a{padding:.35rem 1rem;border:1px solid var(--taupe);border-radius:999px;text-decoration:none}.tabs a[aria-current]{background:var(--ink);color:var(--bg);border-color:var(--ink)}
.gallery{display:grid;grid-template-columns:repeat(auto-fill,minmax(12rem,1fr));gap:.6rem;margin:1rem 0}.gallery img{width:100%;border-radius:10px;aspect-ratio:4/3;object-fit:cover}.price-one{font:700 1.3rem var(--serif)}
.sticky-cta{position:fixed;left:0;right:0;bottom:0;padding:.6rem 1rem calc(.6rem + env(safe-area-inset-bottom));background:linear-gradient(transparent,rgba(244,238,230,.95) 40%);display:none;justify-content:center;z-index:15}.sticky-cta .btn{width:100%;max-width:26rem;box-shadow:0 8px 20px -8px rgba(58,43,32,.6)}
.foot{display:flex;flex-wrap:wrap;gap:1rem;justify-content:space-between;max-width:68rem;margin:0 auto;padding:1.5rem 1rem 6rem;border-top:1px solid var(--line);font-size:.88rem;color:var(--char)}.foot .links{display:flex;gap:1rem;flex-wrap:wrap}
/* ===== 予約画面(動きを抑えた落ち着いた画面) ===== */
.calm .top nav a:not(.btn){display:none}.cal{margin:1.2rem 0}.cal h2{margin:.5rem 0}.cal .g{display:grid;grid-template-columns:repeat(7,1fr);gap:.3rem;text-align:center}.cal .w{font-style:normal;font-size:.8rem;color:var(--char)}
.day{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:3.6rem;border-radius:10px;text-decoration:none;font-size:.85rem}.day b{font-size:1rem}.day small{font-size:.66rem;line-height:1.2}.day.none{color:#c9bba8}.day.ok{background:var(--okbg);color:var(--ok);border:1px solid var(--ok)}.day.few{background:var(--fewbg);color:var(--few);border:1px solid var(--few)}.day.no{background:var(--nobg);color:var(--no)}a.day:hover{box-shadow:0 0 0 3px var(--taupe)}
.form h2{font-size:1.1rem;border-bottom:1px solid var(--line);padding-bottom:.3rem}.form label{display:block;margin:1rem 0 .2rem;font-weight:600}.form input:not([type=radio],[type=checkbox]),.form select,.form textarea,.fld{display:block;width:100%;font:inherit;padding:.75rem;border:1.5px solid var(--taupe);border-radius:10px;background:#fff;color:var(--ink);min-height:3rem}
.form textarea{min-height:7rem}.form .chk,.slot label{font-weight:400}.chk{display:flex;gap:.6rem;align-items:flex-start}.chk input{width:1.3rem;height:1.3rem;margin-top:.3rem;flex:none}
.slot{border:1px solid var(--taupe);border-radius:12px;margin:.8rem 0;padding:.5rem 1rem;background:var(--bg)}.slot legend{font:700 1.1rem var(--serif);padding:0 .4rem}.slot label{display:flex;gap:.5rem;align-items:center;padding:.55rem 0;margin:0;min-height:2.8rem}.slot input{width:1.2rem;height:1.2rem}.slot .off{opacity:.5}
/* ===== 管理画面 ===== */
body.admin{background:#f1ebe2}body.admin::before{display:none}.adm{display:grid;grid-template-columns:13rem 1fr;min-height:100vh}.adm-nav{background:var(--ink);color:var(--bg);padding:1rem .8rem;position:sticky;top:0;align-self:start;height:100vh;overflow:auto}.adm-nav a{display:block;color:var(--bg);text-decoration:none;padding:.55rem .8rem;border-radius:8px;margin:.1rem 0}.adm-nav a[aria-current]{background:rgba(255,255,255,.16)}.adm-nav a:hover{background:rgba(255,255,255,.1)}.adm-nav .who{font-size:.8rem;opacity:.8;padding:.5rem .8rem;border-top:1px solid rgba(255,255,255,.2);margin-top:1rem}.adm-nav h2{color:var(--cream);font-size:1rem;padding:0 .8rem;margin:.3rem 0 .8rem}
.adm-main{padding:1.2rem clamp(.8rem,3vw,2rem) 4rem;min-width:0}.adm-main h1{font-size:1.5rem}.adm-main h2{font-size:1.1rem;margin-top:1.8rem}.adm-top{display:none}
.box{background:#fff;border:1px solid var(--line);border-radius:12px;padding:1rem;margin:.8rem 0;overflow-x:auto}.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(11rem,1fr));gap:.8rem}.stat{background:#fff;border:1px solid var(--line);border-radius:12px;padding:.8rem 1rem}.stat b{display:block;font:700 1.9rem var(--serif)}.stat.warn{border-color:var(--few);background:var(--fewbg)}.stat.bad{border-color:var(--danger);background:#f3d9d4}
table.t{border-collapse:collapse;width:100%;font-size:.92rem}.t th,.t td{padding:.5rem .6rem;border-bottom:1px solid var(--line);text-align:left;vertical-align:top}.t th{font-size:.8rem;color:var(--char);white-space:nowrap}.t tr:hover td{background:#faf5ec}
.inl{display:flex;flex-wrap:wrap;gap:.6rem;align-items:end}.inl label{font-size:.85rem;font-weight:600}.inl .fld{min-height:2.6rem;padding:.4rem .6rem}.adm-main .btn{min-height:2.75rem;padding:.45rem 1.1rem;font-size:.92rem}
.flash{padding:.7rem 1rem;border-radius:10px;margin:.6rem 0;background:var(--okbg);border-left:5px solid var(--ok)}.flash.err{background:#f3d9d4;border-color:var(--danger)}
.mini-cal{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;font-size:.8rem}.mini-cal .d{min-height:4.2rem;border:1px solid var(--line);border-radius:8px;padding:.2rem .3rem;background:#fff;text-decoration:none}.mini-cal .d.ev{background:var(--okbg);border-color:var(--ok)}.mini-cal .d.cx{background:var(--nobg)}.mini-cal .d small{display:block;line-height:1.3}
.login{max-width:24rem;margin:10vh auto;padding:1.5rem;background:#fff;border:1px solid var(--line);border-radius:14px}
/* ===== 小さな画面 ===== */
@media (max-width:760px){.hero{grid-template-columns:1fr;padding-top:1rem}.stage-wrap{order:-1;width:min(100%,19rem)}.steps{grid-template-columns:1fr}.top nav a:not(.btn){display:none}.sticky-cta{display:flex}body.home .foot{padding-bottom:6.5rem}
  .newslist li{flex-direction:column;gap:0}dl.kv{grid-template-columns:1fr;gap:.1rem}dl.kv dd{margin-bottom:.6rem}.adm{grid-template-columns:1fr}.adm-nav{position:static;height:auto;display:none}.adm-nav.open{display:block}.adm-top{display:flex;justify-content:space-between;align-items:center;background:var(--ink);color:var(--bg);padding:.6rem 1rem;position:sticky;top:0;z-index:10}.adm-top button{background:none;border:1px solid var(--bg);color:var(--bg);border-radius:8px;padding:.4rem .8rem;font:inherit}
  .t.stack thead{display:none}.t.stack tr{display:block;border-bottom:2px solid var(--line);padding:.4rem 0}.t.stack td{display:flex;gap:.6rem;border:0;padding:.15rem .3rem}.t.stack td::before{content:attr(data-l);min-width:5rem;color:var(--char);font-size:.8rem}}
@media (prefers-reduced-motion:reduce){*,*::before,*::after{animation:none!important;transition:none!important;scroll-behavior:auto!important}}
@media print{.top,.sticky-cta,.foot,.adm-nav,.adm-top{display:none}}

/* =====================================================================
   公開画面デザイン(2026-10 本格改修)
   - ブランド色(輪郭の茶/チャコール/トープ/クリーム)を基準に、ガレージの木箱色(kraft)を差し色として追加。
   - 対象は公開画面のセレクター(.home / .booking-page / body:not(.admin) の公開共通部品)に限定。管理画面(.admin, .adm-*)は変更しない。
   - 無限アニメーションは「自動の動きを止める」(.motion-off)と prefers-reduced-motion で停止する。
   ===================================================================== */
:root{--kraft:#B7834F;--kraft-d:#8C5F33;--kraft-l:#E2BE93;--night:#2E241D;--display:"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP","Noto Sans CJK JP","Yu Gothic UI","Yu Gothic",Meiryo,sans-serif;--ease-pop:cubic-bezier(.34,1.56,.64,1);--ease-out:cubic-bezier(.2,.8,.2,1)}

/* ---------- 公開共通: ヘッダー・フッター・見出し ---------- */
body:not(.admin) .top{box-shadow:0 1px 0 rgba(255,255,255,.6) inset}
body:not(.admin) .brand img{transition:transform .35s var(--ease-pop)}
body:not(.admin) .brand:hover img{transform:rotate(-12deg) scale(1.12)}
body:not(.admin) .top nav a:not(.btn){position:relative;transition:background .2s}
body:not(.admin) .top nav a:not(.btn):hover{background:rgba(232,216,196,.7)}
body:not(.admin) .top nav a.btn{box-shadow:0 3px 0 var(--night);transition:transform .15s,box-shadow .15s}
body:not(.admin) .top nav a.btn:hover{transform:translateY(-2px);box-shadow:0 5px 0 var(--night)}
body:not(.admin) .top nav a.btn:active{transform:translateY(2px);box-shadow:0 1px 0 var(--night)}
body:not(.admin) .panel h1{font-family:var(--display);font-weight:900;letter-spacing:.01em}
body:not(.admin) .foot{position:relative;align-items:center}
body:not(.admin) .foot::before{content:"";flex:none;width:3rem;height:3rem;border-radius:50%;background:var(--cream) url("mugi-front.webp") center 18%/120% auto no-repeat;box-shadow:0 0 0 3px var(--paper),0 0 0 4px var(--line)}
body:not(.admin) .foot>div:first-of-type{flex:1}
body:not(.admin) main .cards .card{transition:transform .25s var(--ease-out),box-shadow .25s}
body:not(.admin) main .cards .card:hover{transform:translateY(-5px) rotate(-.6deg);box-shadow:6px 8px 0 rgba(58,43,32,.14)}

/* ---------- トップ全体 ---------- */
.home main{overflow-x:clip}
.home{background-image:radial-gradient(rgba(58,43,32,.07) 1.2px,transparent 1.6px);background-size:24px 24px}
.home .btn{font-family:var(--display)}
.home .cta{position:relative;overflow:hidden;font-weight:800;font-size:1.08rem;padding:1.05rem 1.6rem 1.05rem 2rem;box-shadow:0 6px 0 var(--night),0 14px 24px -12px rgba(58,43,32,.6);transition:transform .15s,box-shadow .15s,background .15s}
.home .cta:hover{transform:translateY(-2px);box-shadow:0 8px 0 var(--night),0 18px 26px -12px rgba(58,43,32,.6)}
.home .cta:active{transform:translateY(5px);box-shadow:0 1px 0 var(--night)}
.home .cta::after{content:"";position:absolute;inset:0;background:linear-gradient(105deg,transparent 35%,rgba(255,255,255,.28) 50%,transparent 65%);transform:translateX(-120%);animation:cta-shine 4.5s ease-in-out 2s infinite;pointer-events:none}
.home .cta-arrow{display:inline-grid;place-items:center;width:1.9rem;height:1.9rem;border-radius:50%;background:var(--kraft);color:var(--paper);font-style:normal;margin-left:.3rem;transition:transform .25s var(--ease-pop)}
.home .cta:hover .cta-arrow{transform:translateX(4px) rotate(-8deg)}
.home section h2{font-family:var(--display);font-weight:900;font-size:clamp(1.75rem,4.4vw,2.8rem);line-height:1.2;letter-spacing:.01em;margin:.2rem 0 1.4rem}
.home section h2::after{content:"";display:block;width:3.4rem;height:.42rem;margin-top:.55rem;border-radius:99px;background:var(--kraft);transform:rotate(-2deg)}
.home .kicker{margin:0;font:800 .74rem/1 var(--display);letter-spacing:.32em;color:var(--kraft-d)}
.home .kicker::before{content:"";display:inline-block;width:.55rem;height:.55rem;margin-right:.5rem;border-radius:2px;background:var(--kraft);transform:rotate(45deg) translateY(-1px)}
.home section.wrap{padding-top:3.2rem;padding-bottom:1.5rem}
.home .band{padding:3.4rem 0 3.6rem;margin-top:2rem}

/* スクロール登場(JS有効時だけ隠し状態にする) */
.fx-ready .rv{opacity:0;transform:translateY(26px);filter:blur(5px);transition:opacity .7s var(--ease-out),transform .8s var(--ease-out),filter .7s;transition-delay:calc(var(--i,0) * var(--stg,70ms))}
.fx-ready h2.rv{transform:translateY(18px) scale(1.06);filter:blur(8px)}
.fx-ready .rv.in{opacity:1;transform:none;filter:none}

/* ---------- ヒーロー ---------- */
.home .hero{position:relative;isolation:isolate;grid-template-columns:1.08fr .92fr;gap:2rem;padding:3.2rem 1rem 3.6rem;min-height:min(46rem,calc(100svh - 4rem))}
.home .hero::before{content:"";position:absolute;inset:4% -6% 0 38%;z-index:-2;border-radius:48% 52% 40% 60%;background:repeating-radial-gradient(ellipse at 70% 55%,transparent 0 34px,rgba(126,104,75,.08) 35px 36px,transparent 37px 67px);pointer-events:none}
.home .hero-word{position:absolute;inset:0 -4vw;z-index:-1;display:flex;flex-direction:column;justify-content:center;pointer-events:none;user-select:none;font:900 clamp(5rem,17vw,15rem)/.84 var(--display);letter-spacing:-.03em;color:transparent;-webkit-text-stroke:2px rgba(168,142,116,.38);translate:calc(var(--px,0) * -26px) calc(var(--py,0) * -14px);transition:translate .4s var(--ease-out)}
.home .hero-word span{display:block;white-space:nowrap;animation:word-drift 22s ease-in-out infinite alternate}
.home .hero-word span+span{padding-left:22vw;animation-direction:alternate-reverse}
.home .hero-text{position:relative;z-index:1}
.home .eyebrow{display:inline-block;margin:0;padding:.35rem .95rem;border:2px dashed var(--kraft-d);border-radius:8px;background:var(--paper);color:var(--kraft-d);font:800 .82rem var(--display);letter-spacing:.14em;transform:rotate(-3deg);animation:stamp .7s var(--ease-pop) .15s both}
.home .hero-title{margin:1rem 0 1.1rem;font:inherit;line-height:1}
.home .hero-title .ht-a{display:block;font:900 clamp(2.5rem,6.6vw,4.9rem)/1.06 var(--display);letter-spacing:.005em;color:var(--ink);text-shadow:.06em .06em 0 var(--cream),.09em .09em 0 rgba(168,142,116,.55);animation:wipe-in 1s var(--ease-out) .25s both}
.home .hero-title .ht-b{display:inline-block;margin-top:.8rem;padding:.38rem 1rem .45rem;background:var(--ink);color:var(--bg);font:800 clamp(1.05rem,2.5vw,1.5rem)/1.2 var(--display);letter-spacing:.22em;border-radius:6px;transform:rotate(-2.2deg);box-shadow:5px 5px 0 var(--kraft);animation:pop-in .7s var(--ease-pop) .75s both}
.home .lead{max-width:31rem;animation:rise .8s var(--ease-out) .9s both}
.home .hero-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.8rem 1rem;margin-top:1.4rem;animation:rise .8s var(--ease-out) 1.05s both}
.home .hero-sub{border-width:2px;font-weight:700}
.home .next-label{margin:1.5rem 0 0;font:800 .74rem var(--display);letter-spacing:.24em;color:var(--kraft-d);animation:rise .8s var(--ease-out) 1.15s both}
.home .next{margin-top:.45rem;animation:rise .8s var(--ease-out) 1.2s both}
.home .next a{border:2px solid var(--ink);background:var(--paper);font-weight:700;box-shadow:0 3px 0 var(--ink);transition:transform .2s var(--ease-pop),box-shadow .2s}
.home .next a:hover{transform:translateY(-3px) rotate(-1.5deg);box-shadow:0 6px 0 var(--ink)}
.home .next a.off{border-style:dashed;box-shadow:none}
.home .stage-wrap{position:relative;z-index:1;width:min(100%,28rem);animation:rise 1s var(--ease-out) .35s both}
.home .mugi-label{position:relative;z-index:3;font:900 1.05rem var(--display);letter-spacing:.2em;text-align:center;margin:0 0 -.4rem;transform:rotate(-5deg);color:var(--kraft-d)}
.home .stage{touch-action:pan-y}
.home .spot{translate:calc(var(--px,0) * 10px) calc(var(--py,0) * 8px);transition:translate .4s var(--ease-out)}
.home .stage.pon .mugi-img{animation:pon-squash .5s var(--ease-pop)}
.home .mugi-fx{position:absolute;left:50%;top:58%;width:0;height:0;z-index:4;pointer-events:none}
.home .leaf{position:absolute;left:-.55rem;top:-.35rem;width:1.1rem;height:.7rem;border-radius:0 100% 0 100%;background:linear-gradient(135deg,#7f9d4a,var(--ok));box-shadow:inset -1px -1px 0 rgba(0,0,0,.15);animation:leaf-fly var(--d,1.2s) cubic-bezier(.2,.7,.4,1) forwards}
.home .leaf.alt{background:linear-gradient(135deg,var(--kraft-l),var(--kraft))}
.home .mugi-bubble{position:absolute;z-index:5;left:-2%;top:6%;margin:0;max-width:11rem;padding:.55rem .95rem;background:var(--paper);border:2.5px solid var(--ink);border-radius:18px;font:800 .92rem/1.35 var(--display);color:var(--ink);box-shadow:4px 4px 0 var(--ink);opacity:0;transform:scale(.6) rotate(-6deg);transform-origin:85% 110%;transition:opacity .2s,transform .3s var(--ease-pop);pointer-events:none}
.home .mugi-bubble::after{content:"";position:absolute;right:1.3rem;bottom:-.62rem;width:1rem;height:1rem;background:var(--paper);border-right:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:rotate(45deg) skew(8deg,8deg)}
.home .mugi-bubble.show{opacity:1;transform:scale(1) rotate(-3deg)}
.home .pon-count{position:absolute;z-index:5;right:-2%;top:30%;margin:0;display:flex;flex-direction:column;align-items:center;line-height:1;color:var(--ink);pointer-events:none;transform:rotate(6deg)}
.home .pon-count b{font:900 clamp(2.2rem,5vw,3.2rem)/1 var(--display);color:var(--kraft);-webkit-text-stroke:2px var(--ink);text-shadow:3px 3px 0 var(--ink)}
.home .pon-count small{font:900 .9rem var(--display);letter-spacing:.2em;margin-top:.2rem}
.home .pon-count.bump b{animation:bump .4s var(--ease-pop)}
.home .stickers{list-style:none;margin:0;padding:0;position:absolute;inset:0;z-index:4;pointer-events:none;translate:calc(var(--px,0) * 18px) calc(var(--py,0) * 12px);transition:translate .4s var(--ease-out)}
.home .stickers li{position:absolute;padding:.3rem .75rem;border-radius:999px;font:800 .8rem var(--display);letter-spacing:.08em;border:2px solid var(--ink);box-shadow:3px 3px 0 var(--ink);animation:bob 3.6s ease-in-out infinite}
.home .stickers li:nth-child(1){left:-4%;top:46%;background:var(--paper);rotate:-8deg}
.home .stickers li:nth-child(2){right:-3%;top:62%;background:var(--kraft-l);rotate:7deg;animation-delay:-1.2s}
.home .stickers li:nth-child(3){left:6%;bottom:21%;background:var(--ink);color:var(--bg);rotate:-4deg;animation-delay:-2.3s}
.home .mugi-controls{display:flex;justify-content:center;align-items:center;gap:.8rem;margin-top:.8rem}
.home .mugi-controls .btn{min-width:44px;min-height:44px;padding:.35rem .8rem;border-width:2px;box-shadow:0 3px 0 var(--ink);transition:transform .15s,box-shadow .15s,background .15s}
.home .mugi-controls .btn:active{transform:translateY(3px);box-shadow:0 0 0 var(--ink)}
.home #mugi-hint{font-size:.82rem;font-weight:700;min-width:12em;text-align:center;margin:0}
.home .mugi-howto{margin:.35rem 0 0;text-align:center;font-size:.76rem;color:var(--char)}
.home .motion-toggle{display:block;margin:.3rem auto 0;background:transparent;border:0;text-decoration:underline;text-underline-offset:3px;color:var(--char);font:inherit;font-size:.8rem;cursor:pointer;min-height:44px}
.home .motion-toggle:disabled{cursor:default}

/* ---------- 区切りテープ ---------- */
.home .market-ribbon{position:relative;z-index:3;width:108%;margin:.6rem -4% 0;overflow:visible;background:transparent;color:var(--bg);padding:.85rem 0;transform:rotate(-1.6deg);border-block:7px solid var(--ink);border-image:repeating-linear-gradient(-45deg,var(--kraft) 0 12px,var(--ink) 12px 24px) 7;box-shadow:0 10px 24px -14px rgba(0,0,0,.6)}
.home .market-ribbon::after{content:"";position:absolute;inset:0;z-index:-1;background:var(--ink)}
.home .market-ribbon .tape{position:absolute;left:0;right:0;top:-.4rem;bottom:-.4rem;z-index:-2;background:repeating-linear-gradient(-45deg,var(--kraft-l) 0 22px,var(--cream) 22px 44px);transform:rotate(3.4deg);box-shadow:0 6px 16px -10px rgba(0,0,0,.5)}
.home .market-ribbon span{display:block;width:max-content;max-width:none;white-space:nowrap;font:900 .95rem var(--display);letter-spacing:.16em;animation:market-marquee 32s linear infinite}

/* ---------- ご利用の流れ ---------- */
.home .band-flow{position:relative;margin-top:0;padding-top:4.6rem;background-color:#EADBC6;background-image:radial-gradient(rgba(58,43,32,.13) 1.6px,transparent 2px);background-size:22px 22px}
.home .band-flow .wrap{display:grid;grid-template-columns:1fr}
.home .band-flow .peek{grid-row:3;grid-column:1;justify-self:end;align-self:start;position:relative;z-index:0;width:clamp(5rem,9vw,7.2rem);height:auto;margin-right:6%;transform:translateY(-62%) rotate(-6deg);pointer-events:none;filter:drop-shadow(0 4px 4px rgba(58,43,32,.2))}
.fx-ready .band-flow .peek.rv{opacity:1;filter:none;transform:translateY(-8%) rotate(0deg);transition:transform .9s var(--ease-pop) .3s}
.fx-ready .band-flow .peek.rv.in{transform:translateY(-62%) rotate(-6deg)}
.home .steps{grid-row:3;grid-column:1;position:relative;z-index:1;gap:1.2rem;margin:0}
.home .steps::before{content:"";position:absolute;left:12%;right:12%;top:2.3rem;border-top:3px dashed var(--kraft);z-index:-1}
.home .steps li{position:relative;background:var(--paper);border:2.5px solid var(--ink);border-radius:16px;padding:1.2rem 1.2rem 1.3rem;box-shadow:5px 5px 0 var(--ink);transition:transform .25s var(--ease-pop),box-shadow .25s}
.home .steps li:hover{transform:translate(-2px,-4px) rotate(-1deg);box-shadow:8px 9px 0 var(--ink)}
.home .steps li::before{width:2.6rem;height:2.6rem;background:var(--kraft);color:var(--paper);font:900 1.2rem var(--display);border:2.5px solid var(--ink);transform:rotate(-8deg);margin-bottom:.6rem}
.home .steps b{font-family:var(--display);font-weight:900;font-size:1.15rem}

/* ---------- マーケットと相談 ---------- */
.home .sec-price .price{gap:1.2rem;margin:.4rem 0 1.4rem}
.home .sec-price .price>div{position:relative;background:var(--paper);border:2.5px solid var(--ink);border-radius:16px;padding:1.6rem 1.3rem 1.3rem;box-shadow:6px 6px 0 var(--ink);overflow:hidden;transition:transform .25s var(--ease-pop),box-shadow .25s}
.home .sec-price .price>div:hover{transform:translate(-2px,-4px) rotate(-.6deg);box-shadow:9px 10px 0 var(--ink)}
.home .sec-price .price>div::before{content:"";position:absolute;left:0;right:0;top:0;height:.55rem;background:var(--kraft)}
.home .sec-price .price>div+div::before{background:var(--ok)}
.home .sec-price .price>div::after{content:"A";position:absolute;right:1rem;top:1rem;display:grid;place-items:center;width:2.4rem;height:2.4rem;border-radius:50%;border:2.5px solid var(--ink);font:900 1.1rem var(--display);background:var(--cream);transform:rotate(10deg)}
.home .sec-price .price>div+div::after{content:"B";background:var(--okbg)}
.home .sec-price .price b{font-family:var(--display);font-weight:900;font-size:1rem;letter-spacing:.06em}
.home .sec-price .price span{font:900 clamp(1.7rem,3.6vw,2.3rem)/1.2 var(--display);margin:.3rem 0}
.home .sec-price .rules{list-style:none;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(15rem,1fr));gap:.7rem}
.home .sec-price .rules li{position:relative;margin:0;padding:.75rem 1rem .75rem 2.9rem;background:var(--paper);border:2px dashed var(--taupe);border-radius:12px;font-weight:600;transition:border-color .2s,transform .2s}
.home .sec-price .rules li:hover{border-color:var(--ink);border-style:solid;transform:translateY(-2px)}
.home .sec-price .rules li::before{content:"";position:absolute;left:.85rem;top:50%;width:1.35rem;height:1.35rem;margin-top:-.68rem;border-radius:50%;background:var(--ink) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M5 10.5l3.2 3L15 6.5' fill='none' stroke='%23F4EEE6' stroke-width='2.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/80% no-repeat}

/* ---------- 注目の商品(ガレージの棚) ---------- */
.home .band-shelf{position:relative;margin-top:2.6rem;padding-top:4.6rem;background-color:var(--char);background-image:radial-gradient(rgba(255,255,255,.07) 1.6px,transparent 2px),linear-gradient(180deg,#4f4a45,var(--night));background-size:22px 22px,100% 100%;color:var(--bg)}
.home .band-shelf::before{content:"";position:absolute;left:0;right:0;top:0;height:2.6rem;background:repeating-linear-gradient(90deg,var(--kraft) 0 32px,var(--paper) 32px 64px);-webkit-mask:linear-gradient(#000 0 0) top/100% calc(100% - 14px) no-repeat,radial-gradient(circle 16px at 50% 0,#000 97%,transparent) bottom/32px 14px repeat-x;mask:linear-gradient(#000 0 0) top/100% calc(100% - 14px) no-repeat,radial-gradient(circle 16px at 50% 0,#000 97%,transparent) bottom/32px 14px repeat-x;filter:drop-shadow(0 4px 2px rgba(0,0,0,.3))}
.home .band-shelf h2{color:var(--bg)}
.home .band-shelf .kicker{color:var(--kraft-l)}
.home .band-shelf .more a{color:var(--bg);text-decoration-color:var(--kraft-l);font-weight:700}
.home .band-shelf .cards{gap:1.3rem;padding-bottom:1rem;background:linear-gradient(transparent calc(100% - 14px),var(--kraft-d) calc(100% - 14px),#6e4a28 100%);border-radius:0 0 4px 4px}
.home .band-shelf .card{position:relative;border:3px solid var(--night);border-radius:12px;color:var(--ink);background:var(--paper);box-shadow:0 10px 0 -2px rgba(0,0,0,.25)}
.home .band-shelf .card:hover{transform:translateY(-8px) rotate(-1.2deg);box-shadow:0 18px 0 -4px rgba(0,0,0,.25)}
.home .band-shelf .card h3{font-family:var(--display);font-weight:800}
.home .band-shelf .card .ph{background:repeating-linear-gradient(-45deg,var(--cream) 0 14px,#e1cfb7 14px 28px)}
.home .crate{perspective:900px}
.home .crate img,.home .crate .ph{transform:translateY(14px) scale(.94);opacity:.4;transition:transform .7s var(--ease-pop),opacity .5s;transition-delay:calc(var(--i,0) * 160ms + 520ms)}
.home .crate.open img,.home .crate.open .ph{transform:none;opacity:1}
.home .crate-lid{position:absolute;z-index:2;left:0;top:0;width:100%;aspect-ratio:4/3;display:grid;place-items:center;pointer-events:none;background:repeating-linear-gradient(180deg,var(--kraft) 0 23%,var(--kraft-d) 23% 25%);box-shadow:inset 0 0 0 4px rgba(58,43,32,.35);transform-origin:50% 0;transition:transform .9s cubic-bezier(.5,-.35,.3,1.25),opacity .25s;transition-delay:calc(var(--i,0) * 160ms + 150ms),calc(var(--i,0) * 160ms + 950ms)}
.home .crate-lid::before,.home .crate-lid::after{content:"";position:absolute;top:10%;bottom:10%;width:10%;background:rgba(58,43,32,.18)}
.home .crate-lid::before{left:8%}.home .crate-lid::after{right:8%}
.home .crate-lid i{position:relative;padding:.35rem .8rem;background:var(--paper);color:var(--ink);font:900 .78rem var(--display);font-style:normal;letter-spacing:.18em;border:2px solid var(--ink);transform:rotate(-4deg)}
.home .crate-lid i::before{content:"GARAGE"}
.home .crate.open .crate-lid{transform:rotateX(-112deg);opacity:0}

/* ---------- お知らせ ---------- */
.home .sec-news .newslist li{align-items:center;padding:.85rem .6rem;border-bottom:2px dashed var(--line);border-radius:10px;transition:background .2s,transform .2s var(--ease-out)}
.home .sec-news .newslist li:hover{background:var(--paper);transform:translateX(6px)}
.home .sec-news .newslist time{display:inline-block;min-width:auto;padding:.1rem .6rem;border-radius:6px;background:var(--ink);color:var(--bg);font:700 .82rem var(--display);letter-spacing:.04em}
.home .sec-news .newslist a{font-weight:700}

/* ---------- アクセス ---------- */
.home .band-access{position:relative;margin-top:3rem;background:var(--ink);color:var(--bg);padding:4rem 0}
.home .band-access::before,.home .band-access::after{content:"";position:absolute;left:0;right:0;height:14px;background:repeating-linear-gradient(-45deg,var(--kraft) 0 16px,var(--night) 16px 32px)}
.home .band-access::before{top:0}.home .band-access::after{bottom:0}
.home .band-access .wrap{display:grid;grid-template-columns:1fr auto;align-items:end;gap:1.5rem}
.home .band-access h2{color:var(--bg)}.home .band-access .kicker{color:var(--kraft-l)}
.home .band-access a{color:var(--bg);text-decoration-color:var(--kraft-l)}
.home .band-access .note{color:#d9ccbd}
.home .band-access .btn.ghost{color:var(--bg);border-color:var(--bg);border-width:2px}.home .band-access .btn.ghost:hover{background:rgba(255,255,255,.1)}
.home .access-mugi{width:clamp(7rem,15vw,11rem);margin-bottom:-1rem}
.home .access-mugi img{display:block;filter:drop-shadow(0 8px 10px rgba(0,0,0,.4));transform-origin:50% 100%;animation:sway2 5s ease-in-out infinite}

/* ---------- 最後の予約導線 ---------- */
.home .sec-final{text-align:center;padding-top:3.4rem!important}
.home .final-lead{font:900 clamp(1.3rem,3.2vw,1.9rem)/1.4 var(--display);margin:0 0 1.2rem}

/* ---------- スクロールに合わせて進むムギ ---------- */
.mugi-track{position:fixed;left:0;right:0;top:0;height:0;z-index:19;pointer-events:none}
.mugi-track .trail{position:absolute;left:0;top:0;width:100%;height:3px;background:linear-gradient(90deg,var(--kraft),var(--kraft-d));transform:scaleX(0);transform-origin:0 50%}
.mugi-track img{position:absolute;top:3px;left:0;width:2.4rem;height:auto;opacity:0;transform:scaleX(-1);transition:opacity .3s;filter:drop-shadow(0 2px 2px rgba(58,43,32,.3))}
.mugi-track.show img{opacity:1}
.mugi-track.back img{transform:none}
.mugi-track.walking img{animation:trot .26s ease-in-out infinite alternate}

/* ---------- 予約画面(落ち着いた演出) ---------- */
.booking-page .booking-panel{position:relative;border:2.5px solid var(--ink);border-radius:18px;box-shadow:7px 7px 0 var(--ink);overflow:hidden;padding-top:clamp(1.6rem,4vw,2.4rem)}
.booking-page .booking-panel::before{content:"";position:absolute;left:0;right:0;top:0;height:8px;background:repeating-linear-gradient(-45deg,var(--kraft) 0 12px,var(--ink) 12px 24px)}
.booking-page .booking-panel h1{font-size:clamp(1.6rem,5vw,2.3rem)}
.booking-page .booking-progress{display:flex;list-style:none;gap:0;padding:0;margin:0 0 1.4rem;counter-reset:none;position:relative}
.booking-page .booking-progress li{flex:1;position:relative;display:flex;align-items:center;justify-content:center;gap:.4rem;padding:.55rem .4rem;border:2px solid var(--ink);border-left-width:0;background:var(--paper);font:700 .82rem var(--display);color:var(--char);text-align:center;line-height:1.3}
.booking-page .booking-progress li:first-child{border-left-width:2px;border-radius:999px 0 0 999px}
.booking-page .booking-progress li:last-child{border-radius:0 999px 999px 0}
.booking-page .booking-progress [aria-current="step"]{background:var(--ink);color:var(--bg)}
.booking-page .booking-progress [aria-current="step"]::before{content:"";flex:none;width:1.5rem;height:1.5rem;border-radius:50%;background:var(--cream) url("mugi-front.webp") center 16%/130% auto no-repeat;box-shadow:0 0 0 2px var(--bg);animation:hop .7s var(--ease-pop) .2s both}
.booking-page .booking-progress li:has(~ [aria-current="step"]){background:var(--cream);color:var(--ink)}
.booking-page .crumb a{font-weight:700}
.booking-page .price b,.booking-page .price span{font-family:var(--display);font-weight:900}
.booking-page .price>div{background:var(--paper);border:2px solid var(--line);border-top:5px solid var(--kraft)}
.booking-page .price>div+div{border-top-color:var(--ok)}
/* カレンダー */
.booking-page .cal{background:var(--bg);border:2px solid var(--line);border-radius:14px;padding:.8rem}
.booking-page .cal h2{font-family:var(--display);font-weight:900;font-size:1.25rem}
.booking-page .day{border-radius:12px;transition:transform .2s var(--ease-pop),box-shadow .2s}
.booking-page a.day{border-width:2px;font-weight:700}
.booking-page a.day:hover{transform:translateY(-3px) scale(1.05);box-shadow:0 4px 0 var(--ink)}
.booking-page a.day:focus-visible{outline:3px solid var(--ink);outline-offset:2px}
.fx-ready.booking-page .cal .day:not(.none){animation:day-in .45s var(--ease-pop) both;animation-delay:calc(var(--i,0) * 35ms)}
/* フォーム: 見出し */
.booking-page .form h2{display:flex;align-items:center;gap:.6rem;margin-top:2.2rem;padding:0 0 .5rem;font-family:var(--display);font-weight:900;font-size:1.2rem;border-bottom:2.5px solid var(--ink)}
.booking-page .form h2::before{content:"";flex:none;width:.7rem;height:1.2rem;border-radius:3px;background:var(--kraft)}
/* フォーム: 時間と種別(大きな選択カード) */
.booking-page .slot{position:relative;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem;border:2px solid var(--line);border-radius:16px;margin:1rem 0;padding:1.5rem .8rem .8rem;background:var(--bg);transition:border-color .2s,box-shadow .2s,background .2s}
.booking-page .slot legend{position:absolute;top:-.85rem;left:.9rem;padding:.15rem .8rem;border-radius:8px;background:var(--ink);color:var(--bg);font:900 1rem var(--display);letter-spacing:.04em}
.booking-page .slot.slot-active{border-color:var(--ink);background:var(--paper);box-shadow:4px 4px 0 var(--ink)}
.booking-page .slot:focus-within{border-color:var(--ink)}
.booking-page .slot label{position:relative;display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .55rem;margin:0;padding:.8rem .85rem;min-height:3.6rem;border:2px solid var(--taupe);border-radius:12px;background:#fff;font-weight:700;cursor:pointer;transition:transform .18s var(--ease-pop),border-color .18s,background .18s,box-shadow .18s}
.booking-page .slot label:not(.off):hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:0 3px 0 var(--ink)}
.booking-page .slot label .opt{font-family:var(--display);font-weight:800}
.booking-page .slot label .tag{margin-left:auto}
.booking-page .slot label.off{cursor:not-allowed;opacity:.62;background:repeating-linear-gradient(-45deg,#f3ece3 0 8px,#ebe2d6 8px 16px);border-style:dashed}
.booking-page .slot input[type=radio]{appearance:none;-webkit-appearance:none;flex:none;width:1.45rem;height:1.45rem;margin:0;border:2.5px solid var(--ink);border-radius:50%;background:#fff;display:grid;place-items:center;transition:background .2s,box-shadow .2s}
.booking-page .slot input[type=radio]:checked{background:radial-gradient(circle,var(--kraft) 0 38%,#fff 42%);box-shadow:0 0 0 3px rgba(183,131,79,.35);animation:check-pop .35s var(--ease-pop)}
.booking-page .slot input[type=radio]:disabled{border-color:var(--no);background:transparent}
.booking-page .slot input[type=radio]:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.booking-page .slot label.slot-selected,.booking-page .slot label:has(input:checked){background:var(--ink);color:var(--bg);border-color:var(--ink);outline:0;box-shadow:0 4px 0 var(--kraft)}
.booking-page .slot label:has(input:checked) input[type=radio],.booking-page .slot label.slot-selected input[type=radio]{border-color:var(--bg);background:radial-gradient(circle,var(--kraft) 0 38%,var(--bg) 42%)}
.booking-page .slot label:has(input:checked) .tag,.booking-page .slot label.slot-selected .tag{background:var(--bg)}
.booking-page .slot .note{grid-column:1/-1;margin:.1rem 0 0}
.booking-page .selection-note{position:relative;margin:.8rem 0 0;padding:.85rem 1rem .85rem 3.4rem;border:2px dashed var(--taupe);border-left:2px dashed var(--taupe);border-radius:14px;background:var(--bg);font-size:.92rem;font-weight:600;min-height:3.2rem}
.booking-page .selection-note::before{content:"";position:absolute;left:.75rem;top:50%;width:2.1rem;height:2.1rem;margin-top:-1.05rem;border-radius:50%;background:var(--cream) url("mugi-front.webp") center 16%/130% auto no-repeat;box-shadow:0 0 0 2px var(--ink)}
.booking-page .selection-note.picked{border-style:solid;border-color:var(--ink);background:var(--paper);animation:note-flash .6s var(--ease-out)}
.booking-page .selection-note.picked::before{animation:hop .6s var(--ease-pop)}
/* フォーム: 入力欄 */
.booking-page .form label{font-family:var(--display);font-weight:800;font-size:.95rem}
.booking-page .form input:not([type=radio],[type=checkbox]),.booking-page .form select,.booking-page .form textarea{margin-top:.35rem;border:2px solid var(--taupe);border-radius:12px;font-family:var(--sans);font-weight:400;font-size:1rem;transition:border-color .2s,box-shadow .2s,background .2s}
.booking-page .form input:not([type=radio],[type=checkbox]):hover,.booking-page .form textarea:hover,.booking-page .form select:hover{border-color:var(--char)}
.booking-page .form input:not([type=radio],[type=checkbox]):focus,.booking-page .form textarea:focus,.booking-page .form select:focus{border-color:var(--ink);box-shadow:0 0 0 4px rgba(168,142,116,.35);outline:0}
.booking-page .form input:focus-visible,.booking-page .form textarea:focus-visible,.booking-page .form select:focus-visible{outline:2px solid var(--ink);outline-offset:2px}
.booking-page .form label.is-bad input,.booking-page .form label.is-bad textarea{border-color:var(--danger);background:#fff7f5}
.booking-page .field-err{display:flex;align-items:flex-start;gap:.45rem;margin:.35rem 0 0;color:var(--danger);font-weight:700;font-size:.88rem;line-height:1.5;animation:err-in .3s var(--ease-out)}
.booking-page .field-err::before{content:"!";flex:none;display:grid;place-items:center;width:1.25rem;height:1.25rem;margin-top:.1rem;border-radius:50%;background:var(--danger);color:#fff;font:900 .8rem var(--display)}
.booking-page .form.slot-bad .slot:not(.slot-active){border-color:var(--danger)}
/* フォーム: 選択チップ(JS有効時。送信用selectは残したまま) */
.booking-page .form label.has-chips{margin-bottom:0}
.booking-page .form label.has-chips select{position:absolute;width:1px;height:1px;min-height:0;padding:0;margin:0;opacity:0;pointer-events:none;overflow:hidden}
.booking-page .chips{display:flex;flex-wrap:wrap;gap:.55rem;margin:.5rem 0 .4rem}
.booking-page .chip{min-height:2.9rem;min-width:3.6rem;padding:.45rem 1.1rem;border:2px solid var(--taupe);border-radius:999px;background:#fff;color:var(--ink);font:700 .95rem var(--display);cursor:pointer;transition:transform .18s var(--ease-pop),background .18s,border-color .18s,box-shadow .18s}
.booking-page .chip:hover{border-color:var(--ink);transform:translateY(-2px);box-shadow:0 3px 0 var(--ink)}
.booking-page .chip[aria-checked="true"]{background:var(--ink);border-color:var(--ink);color:var(--bg);box-shadow:0 3px 0 var(--kraft)}
.booking-page .chip:focus-visible{outline:3px solid var(--kraft);outline-offset:2px}
.booking-page .chip.pop{animation:check-pop .35s var(--ease-pop)}
.booking-page .park-warn{margin:.4rem 0;padding:.7rem 1rem;border-radius:12px;background:var(--fewbg);border:2px solid var(--few);color:var(--few);font-weight:700;font-size:.9rem}
/* 相談欄の登場 */
.booking-page #consult:not([hidden]){margin-top:1rem;padding:.2rem 1rem 1rem;border:2px dashed var(--ok);border-radius:16px;background:#f6f8f0;animation:consult-in .45s var(--ease-out)}
.booking-page #consult h2{border-bottom-color:var(--ok)}.booking-page #consult h2::before{background:var(--ok)}
/* 注意事項・同意 */
.booking-page .form .rules{list-style:none;padding:.8rem 1rem;margin:.6rem 0;background:var(--bg);border-radius:12px;border:2px solid var(--line)}
.booking-page .form .rules li{position:relative;padding-left:1.3rem}
.booking-page .form .rules li::before{content:"";position:absolute;left:0;top:.72em;width:.55rem;height:.55rem;border-radius:2px;background:var(--kraft);transform:rotate(45deg)}
.booking-page .form .chk{margin-top:1rem;padding:1rem 1.1rem;border:2.5px dashed var(--taupe);border-radius:14px;background:#fff;cursor:pointer;font-family:var(--sans);font-weight:600;transition:border-color .2s,background .2s}
.booking-page .form .chk:hover{border-color:var(--ink)}
.booking-page .form .chk:has(input:checked){border-style:solid;border-color:var(--ok);background:var(--okbg)}
.booking-page .form .chk{line-height:1.6;align-items:center}
.booking-page .form .chk input{appearance:none;-webkit-appearance:none;width:1.6rem;height:1.6rem;margin-top:0;border:2.5px solid var(--ink);border-radius:7px;background:#fff;cursor:pointer;transition:background .2s}
.booking-page .form .chk input:checked{background:var(--ok) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M4.5 10.5l3.6 3.5L15.5 6' fill='none' stroke='%23fff' stroke-width='3' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") center/85% no-repeat;border-color:var(--ok);animation:check-pop .35s var(--ease-pop)}
.booking-page .form .chk input:focus-visible{outline:3px solid var(--ink);outline-offset:3px}
.booking-page .form .chk.is-bad{border-color:var(--danger);border-style:solid}
/* 入力の進み具合 */
.booking-page .ready-meter{position:sticky;bottom:calc(.6rem + env(safe-area-inset-bottom));z-index:6;margin:1.4rem 0 1rem;padding:.55rem 1rem .5rem;border-radius:16px;background:var(--ink);color:var(--bg);box-shadow:0 10px 24px -10px rgba(58,43,32,.7);transition:background .3s}
.booking-page .rm-track{position:relative;height:2.7rem}
.booking-page .rm-track::before{content:"";position:absolute;left:1.2rem;right:2.6rem;bottom:.55rem;border-top:3px dashed rgba(244,238,230,.35)}
.booking-page .rm-fill{position:absolute;left:1.2rem;right:2.6rem;bottom:.5rem;height:4px;border-radius:4px;background:var(--kraft-l);transform:scaleX(0);transform-origin:0 50%;transition:transform .5s var(--ease-out)}
.booking-page .rm-mugi{position:absolute;bottom:0;left:0;width:2.6rem;height:2.6rem;border-radius:50%;object-fit:cover;object-position:50% 12%;background:var(--cream);box-shadow:0 0 0 2px var(--bg);transition:left .55s var(--ease-pop)}
.booking-page .rm-goal{position:absolute;right:0;bottom:.15rem;display:grid;place-items:center;width:2.2rem;height:1.9rem;border-radius:.9rem .9rem 3px 3px;background:repeating-linear-gradient(180deg,var(--kraft) 0 4px,var(--kraft-d) 4px 6px);color:var(--paper);font:900 .62rem var(--display);letter-spacing:.05em}
.booking-page .rm-text{margin:.2rem 0 0;font:700 .84rem var(--display);text-align:center}
.booking-page .form.is-ready .ready-meter{background:var(--ok)}
.booking-page .form.is-ready .rm-mugi{animation:hop .7s var(--ease-pop) 2}
/* 送信ボタン(typeや送信内容は変更しない) */
.booking-page .form>button.btn,.booking-page #booking-submit{width:100%;min-height:3.6rem;margin-top:.4rem;font:800 1.1rem var(--display);box-shadow:0 6px 0 var(--night);transition:transform .15s,box-shadow .15s,background .15s}
.booking-page .form>button.btn:hover:not(:disabled),.booking-page #booking-submit:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 8px 0 var(--night)}
.booking-page .form>button.btn:active:not(:disabled),.booking-page #booking-submit:active:not(:disabled){transform:translateY(5px);box-shadow:0 1px 0 var(--night)}
.booking-page .form.is-ready>button.btn{background:var(--kraft-d);border-color:var(--kraft-d);animation:ready-glow 1.4s ease-in-out 2}
.booking-page #booking-submit:disabled{opacity:.5;cursor:not-allowed;transform:none;box-shadow:0 2px 0 var(--night)}
/* 内容確認 */
.booking-page dl.kv{padding:1.1rem 1.2rem;background:#fff;border:2px dashed var(--taupe);border-radius:14px;position:relative}
.booking-page dl.kv dt{font-weight:800;font-family:var(--display);color:var(--char)}
.booking-page #turnstile-status{padding:.85rem 1rem;border:2px solid var(--line);border-radius:12px;font-size:.9rem;background:var(--bg)}
.booking-page .notice{border-radius:12px}

/* ---------- 動きの停止 ---------- */
.home.motion-off *,.home.motion-off *::before,.home.motion-off *::after,.booking-page.motion-off *,.booking-page.motion-off *::before,.booking-page.motion-off *::after{animation:none!important;transition:none!important}
.motion-off .rv{opacity:1!important;transform:none!important;filter:none!important}
.motion-off .crate-lid{display:none}
.motion-off .crate img,.motion-off .crate .ph{transform:none;opacity:1}
.motion-off .band-flow .peek{transform:translateY(-62%) rotate(-6deg)!important}
.motion-off .hero-word,.motion-off .stickers,.motion-off .spot{translate:none}
.motion-off .mugi-track{display:none}

/* ---------- キーフレーム ---------- */
@keyframes market-marquee{to{transform:translateX(-50%)}}
@keyframes cta-shine{0%,70%{transform:translateX(-120%)}100%{transform:translateX(120%)}}
@keyframes word-drift{from{transform:translateX(-3%)}to{transform:translateX(3%)}}
@keyframes stamp{from{opacity:0;transform:scale(1.8) rotate(-12deg)}to{opacity:1;transform:rotate(-3deg)}}
@keyframes wipe-in{from{clip-path:inset(0 100% 0 0);transform:translateX(-12px)}to{clip-path:inset(0 0 0 0)}}
@keyframes pop-in{from{opacity:0;transform:scale(.4) rotate(-12deg)}to{opacity:1;transform:rotate(-2.2deg)}}
@keyframes rise{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}
@keyframes pon-squash{0%{scale:1 1;translate:0 0}25%{scale:1.1 .86;translate:0 4%}55%{scale:.94 1.08;translate:0 -9%}80%{scale:1.03 .97;translate:0 1%}100%{scale:1 1;translate:0 0}}
@keyframes leaf-fly{0%{opacity:0;transform:translate(0,0) scale(.3) rotate(0)}12%{opacity:1}45%{transform:translate(calc(var(--dx) * .7),var(--dy)) scale(1) rotate(calc(var(--rot) * .5))}100%{opacity:0;transform:translate(var(--dx),2.5rem) scale(.9) rotate(var(--rot))}}
@keyframes bump{0%{transform:scale(1)}40%{transform:scale(1.35) rotate(-6deg)}100%{transform:scale(1)}}
@keyframes bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-7px)}}
@keyframes sway2{0%,100%{transform:rotate(-2.5deg)}50%{transform:rotate(2.5deg)}}
@keyframes trot{from{translate:0 0;rotate:-3deg}to{translate:0 -3px;rotate:3deg}}
@keyframes hop{0%{transform:translateY(0)}40%{transform:translateY(-6px) rotate(-8deg)}100%{transform:translateY(0)}}
@keyframes day-in{from{opacity:0;transform:scale(.7)}to{opacity:1;transform:none}}
@keyframes check-pop{0%{transform:scale(.7)}60%{transform:scale(1.15)}100%{transform:scale(1)}}
@keyframes note-flash{0%{box-shadow:0 0 0 0 rgba(183,131,79,.55)}100%{box-shadow:0 0 0 12px rgba(183,131,79,0)}}
@keyframes err-in{from{opacity:0;transform:translateY(-4px)}to{opacity:1;transform:none}}
@keyframes consult-in{from{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:none}}
@keyframes ready-glow{0%,100%{box-shadow:0 6px 0 var(--night),0 0 0 0 rgba(183,131,79,.6)}50%{box-shadow:0 6px 0 var(--night),0 0 0 10px rgba(183,131,79,0)}}

/* ---------- 小さな画面 ---------- */
@media (max-width:760px){
  .home .hero{grid-template-columns:1fr;gap:.6rem;padding:1.4rem 1rem 2.6rem;min-height:0}
  .home .hero::before{inset:0 -20% 45%}
  .home .hero-word{justify-content:flex-start;padding-top:2rem;font-size:clamp(4.2rem,24vw,8rem)}
  .home .stage-wrap{order:-1;width:min(100%,21rem)}
  .home .stickers li{font-size:.72rem;padding:.2rem .6rem}
  .home .mugi-bubble{left:-4%;top:2%;font-size:.84rem;max-width:9.5rem}
  .home .pon-count{right:-4%}
  .home .hero-actions .btn{flex:1 1 100%}
  .home .market-ribbon span{font-size:.82rem}
  .home .steps::before{left:2.3rem;right:auto;top:1.5rem;bottom:1.5rem;border-top:0;border-left:3px dashed var(--kraft)}
  .home .band-flow .peek{width:4.6rem;margin-right:2%}
  .home .band-access .wrap{grid-template-columns:1fr auto}
  .home .access-mugi{width:5.6rem}
  .booking-page .slot{grid-template-columns:1fr}
  .home .band-shelf .cards{grid-template-columns:repeat(2,minmax(0,1fr));gap:.8rem}
  .home .band-shelf .card h3{font-size:.92rem}.home .band-shelf .card p{font-size:.8rem}
  .home .sec-news .newslist li{align-items:flex-start;gap:.3rem}
  .booking-page .booking-progress li{font-size:.72rem;padding:.45rem .2rem}
  .booking-page .booking-progress [aria-current="step"]::before{width:1.2rem;height:1.2rem}
  .booking-page .booking-panel{box-shadow:4px 4px 0 var(--ink)}
}
@media (prefers-reduced-motion:reduce){.home .market-ribbon span,.home .hero-word span,.home .stickers li{animation:none!important}.home .cards .card:hover,.home .cta:hover,.home .steps li:hover{transform:none}.mugi-track{display:none}}
