/* ============================================================
   （店名）鮮魚と串の大衆酒場 — style
   Website: 原井智基 (Tomoki Harai)
   ============================================================ */
:root{
  --ink:#231815;--ink2:#5B4A3F;--paper:#FDF9EF;--cream:#F8F1E1;--line:#D9CDB6;
  --red:#D63F2A;--red2:#A92C1C;--mus:#EBAA2C;--mus2:#B97F12;--ind:#1F3A5F;--ind2:#142844;--sky:#3E78A8;--sky2:#285580;
  --leaf:#4F8A5B;--leaf2:#356A42;--azk:#7B3F55;--azk2:#5A2A3D;--org:#DE7C2B;--org2:#AE5A16;--wood:#B98A52;
  --f-brush:"Potta One","Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;--f-fude:"Yuji Boku","Yu Mincho","Hiragino Mincho ProN",serif;
  --f-pop:"Potta One","M PLUS Rounded 1c","Hiragino Maru Gothic ProN",sans-serif;
  --f-hand:"Yusei Magic","M PLUS Rounded 1c",sans-serif;
  --f-body:"M PLUS Rounded 1c","Hiragino Maru Gothic ProN","Yu Gothic",sans-serif;
  --hh:84px;--inner:min(1120px,92vw);
}
@media (max-width:760px){:root{--hh:62px}}
*,*::before,*::after{box-sizing:border-box}
[hidden]{display:none!important}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hh) + 14px);background:var(--cream)}
body{margin:0;color:var(--ink);font-family:var(--f-body);font-weight:500;font-size:16px;line-height:1.95;letter-spacing:.02em;background:var(--cream) url(../img/tx-paper.webp);overflow-x:clip;-webkit-font-smoothing:antialiased}
img{max-width:100%;height:auto;display:block}
a{color:inherit}
button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer}
h1,h2,h3,h4,p,ul,ol,dl,dd,figure{margin:0;padding:0}
ul,ol{list-style:none}
:focus-visible{outline:3px solid var(--red);outline-offset:3px;border-radius:4px}
.vh{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.skip{position:fixed;left:12px;top:-60px;z-index:300;background:var(--ink);color:var(--paper);padding:8px 14px;border-radius:8px;text-decoration:none}
.skip:focus{top:12px}
.inner{width:var(--inner);margin-inline:auto}
.sp{display:none}
@media (max-width:760px){.sp{display:inline}.pc{display:none}}

/* ---------- header (a wooden beam) ---------- */
.hd{position:sticky;top:0;z-index:60;height:var(--hh);background:#B4814B url(../img/tx-wood.webp) center/1600px 100%;box-shadow:0 3px 0 var(--ink),0 8px 14px -4px rgba(35,24,21,.4)}
.hd__in{width:min(1320px,96vw);height:100%;margin-inline:auto;display:flex;align-items:center;gap:14px}
.hd__logo{display:flex;align-items:center;gap:10px;text-decoration:none;margin-right:auto}
.hd__lan{width:40px;height:auto;transform-origin:50% 0;flex:none;margin-top:6px}
.hd__txt{display:block;line-height:1.1}
.hd__txt small{display:block;font-size:11.5px;font-weight:800;letter-spacing:.1em}
.hd__txt b{display:block;font-family:var(--f-brush);font-weight:400;font-size:34px;letter-spacing:.04em;margin-top:3px}
.hd__nav{display:flex;gap:9px}
.pill{display:inline-flex;align-items:center;justify-content:center;min-height:42px;padding:0 20px;border-radius:999px;border:2.5px solid var(--ink);font-weight:800;font-size:14.5px;letter-spacing:.08em;text-decoration:none;box-shadow:0 3px 0 var(--ink);transition:transform .15s,box-shadow .15s;background:var(--paper);white-space:nowrap}
.pill:hover{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}
.pill--r{background:var(--red) url(../img/tx-kasure.webp) center/cover;color:#fff}
.pill--m{color:#7A5208}
.pill--s{color:var(--sky2)}
.brg{width:46px;height:46px;flex:none;background:var(--ind);border:2.5px solid var(--ink);border-radius:8px;display:flex;align-items:center;justify-content:center;box-shadow:0 3px 0 var(--ink);transition:transform .15s,box-shadow .15s;position:relative;z-index:3}
.brg:hover{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}
.brg i,.brg i::before,.brg i::after{display:block;width:24px;height:3px;border-radius:3px;background:var(--paper);transition:transform .3s,background .2s}
.brg i{position:relative}
.brg i::before,.brg i::after{content:"";position:absolute;left:0}
.brg i::before{top:-8px}.brg i::after{top:8px}
.nav-open .brg i{background:transparent}
.nav-open .brg i::before{transform:translateY(8px) rotate(45deg)}
.nav-open .brg i::after{transform:translateY(-8px) rotate(-45deg)}
@media (max-width:760px){
  .hd__in{gap:8px}
  .hd__lan{width:28px}
  .hd__txt small{font-size:9.5px;letter-spacing:.04em}
  .hd__txt b{font-size:24px;margin-top:1px}
  .hd__nav .pill--m,.hd__nav .pill--s{display:none}
  .pill{min-height:38px;padding:0 14px;font-size:13.5px}
  .brg{width:40px;height:40px}
}

/* ---------- menu drawer: noren drops down ---------- */
.drw{position:fixed;inset:0;z-index:58;visibility:hidden;transition:visibility 0s .62s}
.nav-open .drw{visibility:visible;transition:visibility 0s}
.drw__cloth{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);gap:0}
.drw__cloth i{display:block;height:100%;background:var(--ind) url(../img/tx-indigo.webp);transform:translateY(-102%);transition:transform .56s cubic-bezier(.65,0,.25,1);box-shadow:inset -1px 0 0 rgba(255,255,255,.08)}
.drw__cloth i:nth-child(2),.drw__cloth i:nth-child(4){transition-delay:.05s}
.nav-open .drw__cloth i{transform:none}
.nav-open .drw__cloth i:nth-child(1){transition-delay:0s}
.nav-open .drw__cloth i:nth-child(2){transition-delay:.05s}
.nav-open .drw__cloth i:nth-child(3){transition-delay:.09s}
.nav-open .drw__cloth i:nth-child(4){transition-delay:.13s}
.drw__in{position:absolute;inset:0;overflow:auto;overscroll-behavior:contain;padding:calc(var(--hh) + 18px) 6vw 40px;color:var(--paper);opacity:0;transition:opacity .25s;display:grid;grid-template-columns:1fr minmax(260px,360px);grid-template-rows:auto 1fr;column-gap:48px;align-content:start}
.nav-open .drw__in{opacity:1;transition:opacity .35s .3s}
.drw__logo{grid-column:1/-1;font-family:var(--f-brush);font-size:clamp(34px,4vw,48px);line-height:1.1;margin-bottom:10px}
.drw__list{columns:2;column-gap:40px}
.drw__list li{break-inside:avoid}
.drw__list a{display:block;padding:9px 2px;text-decoration:none;font-family:var(--f-brush);font-size:clamp(20px,2.1vw,27px);line-height:1.4;border-bottom:1.5px dashed rgba(253,249,239,.34);transition:transform .25s,color .2s}
.drw__list a:hover{transform:translateX(9px);color:var(--mus)}
.drw__foot{font-size:14px;line-height:1.7;align-self:start;position:relative;z-index:1}
.drw__live{display:flex;gap:8px;align-items:flex-start;font-weight:700}
.drw__note{margin-top:10px;font-size:12.5px;opacity:.86}
.drw__credit{display:inline-block;margin-top:12px;padding:5px 15px;border-radius:99px;background:var(--paper);color:var(--ink);font-size:13.5px;text-decoration:none}
.drw__credit b{font-weight:800}
.drw__tan{width:170px;margin:18px 0 0 auto;grid-column:2}
@media (max-width:760px){
  .drw__in{display:block;padding:calc(var(--hh) + 10px) 22px 40px}
  .drw__list{columns:1}
  .drw__list a{font-size:21px;padding:7px 2px}
  .drw__foot{margin-top:16px}
  .drw__tan{width:110px;margin-top:6px}
}
.dotlive{flex:none;display:inline-block;width:11px;height:11px;border-radius:50%;margin-top:.5em;background:#999;box-shadow:0 0 0 3px rgba(255,255,255,.14)}
.dotlive.is-open{background:#63D471;animation:livedot 1.8s ease-in-out infinite}
.dotlive.is-prep{background:var(--mus)}
.dotlive.is-closed{background:#B9AFA2}
@keyframes livedot{50%{box-shadow:0 0 0 7px rgba(99,212,113,.18)}}

/* ---------- page change: noren drops ---------- */
.wp{position:fixed;inset:0;z-index:200;display:grid;grid-template-columns:repeat(4,1fr);pointer-events:none}
.wp i{display:block;background:var(--ind) url(../img/tx-indigo.webp);transform:translateY(-104%)}
.wp.down i{transform:none;transition:transform .42s cubic-bezier(.65,0,.3,1)}
.wp.down i:nth-child(2){transition-delay:.04s}.wp.down i:nth-child(3){transition-delay:.08s}.wp.down i:nth-child(4){transition-delay:.12s}
.wp.now i{transition:none!important;transform:none}
.wp.up i{transform:translateY(-104%);transition:transform .5s cubic-bezier(.65,0,.3,1)}
.wp.up i:nth-child(1){transition-delay:.12s}.wp.up i:nth-child(2){transition-delay:.06s}.wp.up i:nth-child(3){transition-delay:.03s}

/* ---------- reveal ---------- */
.js .rv{opacity:0;transform:translateY(26px);transition:opacity .6s,transform .7s cubic-bezier(.2,.9,.3,1.1);transition-delay:var(--d,0s)}
.js .rv.in{opacity:1;transform:none}
.js .rv.st-in{opacity:0;transform:scale(1.5) rotate(var(--rot,-6deg));transition:opacity .16s,transform .32s cubic-bezier(.3,1.4,.5,1);transition-delay:var(--d,0s)}
.js .rv.st-in.in{opacity:1;transform:rotate(var(--rot,-6deg))}
@media (prefers-reduced-motion:reduce){.js .rv,.js .rv.st-in{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* ---------- headings dyed on a hand towel ---------- */
.tnw{position:relative;text-align:center;padding-top:6px;margin-bottom:46px}
.tnw::before{content:"";position:absolute;left:50%;top:14px;width:100vw;margin-left:-50vw;height:7px;background:repeating-linear-gradient(112deg,#C8A46A 0 5px,#9A7743 5px 7px,#E0C48F 7px 11px);box-shadow:0 2px 0 rgba(35,24,21,.25)}
.tns{position:relative;display:inline-block;transform-origin:50% 0;z-index:1}
.tn__peg{position:absolute;top:-4px;width:17px;height:auto;z-index:2}
.tn__peg.l{left:22px}.tn__peg.r{right:22px}
.tn{display:block;margin-top:16px;padding:26px 54px 28px;color:var(--paper);font-family:var(--f-brush);font-weight:400;font-size:clamp(26px,3.4vw,40px);line-height:1.42;letter-spacing:.05em;background:var(--ind) url(../img/tx-indigo.webp);clip-path:polygon(0 1%,3% 0,12% 1%,22% 0,34% .8%,48% 0,62% 1%,75% .2%,88% 1%,97% 0,100% 1%,99.6% 12%,100% 28%,99.4% 44%,100% 60%,99.5% 78%,100% 92%,99.6% 99%,96% 100%,88% 98.6%,78% 100%,64% 98.8%,52% 100%,38% 98.8%,24% 100%,12% 98.8%,4% 100%,.4% 99%,0 90%,.5% 72%,0 56%,.6% 38%,0 20%)}
.tn--r{background:var(--red) url(../img/tx-kasure.webp) center/cover}
.tn--p{background:var(--paper);color:var(--ind)}
.tnw--dark::before{background:repeating-linear-gradient(112deg,#D9BE8C 0 5px,#A98752 5px 7px,#F0DCB3 7px 11px)}
@media (max-width:760px){.tn{padding:22px 34px 24px;font-size:25px}.tnw{margin-bottom:32px}}

/* ---------- big buttons ---------- */
.bb{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:min(660px,100%);min-height:72px;padding:9px 62px;border-radius:999px;text-align:center;text-decoration:none;color:#fff;font-family:var(--f-brush);font-size:clamp(22px,2.2vw,27px);letter-spacing:.16em;line-height:1.25;background:var(--c,var(--red)) url(../img/tx-kasure.webp) center/100% 100%;box-shadow:0 6px 0 var(--cd,var(--red2)),0 14px 18px -8px rgba(35,24,21,.45);transition:transform .16s,box-shadow .16s;border:0}
.bb small{display:block;font-family:var(--f-body);font-weight:700;font-size:12.5px;letter-spacing:.08em;margin-top:2px;opacity:.95}
.bb::after{content:"";position:absolute;right:30px;top:50%;width:18px;height:26px;margin-top:-13px;background:url(../il/chev.svg) center/contain no-repeat;transition:transform .25s cubic-bezier(.3,1.8,.5,1)}
.bb:hover{transform:translateY(3px);box-shadow:0 3px 0 var(--cd,var(--red2)),0 8px 12px -6px rgba(35,24,21,.45)}
.bb:hover::after{transform:translateX(7px)}
.bb:active{transform:translateY(6px);box-shadow:0 0 0 var(--cd,var(--red2))}
.bb--azk{--c:var(--azk);--cd:var(--azk2)}.bb--ind{--c:var(--ind);--cd:var(--ind2)}.bb--sky{--c:var(--sky);--cd:var(--sky2)}.bb--leaf{--c:var(--leaf);--cd:var(--leaf2)}.bb--org{--c:var(--org);--cd:var(--org2)}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:50px;padding:0 30px;border-radius:999px;background:var(--ind);color:var(--paper);border:2.5px solid var(--ink);box-shadow:0 4px 0 var(--ink);font-weight:800;font-size:15px;letter-spacing:.06em;text-decoration:none;transition:transform .15s,box-shadow .15s;cursor:pointer}
.btn::after{content:"";width:9px;height:14px;background:url(../il/chev.svg) center/contain no-repeat;flex:none}
.btn:hover{transform:translateY(2px);box-shadow:0 2px 0 var(--ink)}
.btn--w{background:var(--paper);color:var(--ink)}
.btn--w::after{background-image:url(../il/chev-i.svg)}
.btn--r{background:var(--red)}
.btn--plain::after{display:none}

/* ---------- full window panels ---------- */
.dlg{position:fixed;inset:0;margin:auto;width:min(980px,94vw);max-width:none;max-height:90dvh;padding:0;border:3px solid var(--ink);border-radius:18px;background:var(--paper) url(../img/tx-paper.webp);color:var(--ink);box-shadow:0 10px 0 var(--ink);overflow:auto;overscroll-behavior:contain}
.dlg::backdrop{background:rgba(20,40,68,.66)}
.dlg[open]{animation:dlg .4s cubic-bezier(.3,1.5,.5,1)}
@keyframes dlg{from{transform:translateY(40px) rotate(-1.4deg);opacity:0}}
.dlg__in{padding:34px clamp(18px,4vw,44px) 40px}
.dlg__x{position:sticky;top:12px;float:right;z-index:3;margin:12px 12px -48px 0;width:44px;height:44px;border-radius:50%;background:var(--ink);color:var(--paper);font-size:0;display:flex;align-items:center;justify-content:center}
.dlg__x::before,.dlg__x::after{content:"";position:absolute;width:20px;height:3px;background:currentColor;border-radius:3px;transform:rotate(45deg)}
.dlg__x::after{transform:rotate(-45deg)}
.dlg h2{text-wrap:balance;font-family:var(--f-brush);font-weight:400;font-size:clamp(26px,3vw,34px);line-height:1.35;margin-bottom:8px}
.dlg h3{font-family:var(--f-brush);font-weight:400;font-size:23px;margin:18px 0 8px}
.dlg p+p{margin-top:8px}
.dlg__ul li{padding-left:1.1em;text-indent:-1.1em}
.dlg__ul li::before{content:"・"}
.qa details{border-bottom:2px dashed var(--line);padding:11px 0}
.qa summary{cursor:pointer;font-weight:800;list-style:none;padding-left:36px;position:relative}
.qa summary::-webkit-details-marker{display:none}
.qa summary::before{content:"問";position:absolute;left:0;top:2px;width:27px;height:27px;border-radius:50%;background:var(--ind);color:var(--paper);font:400 14px/27px var(--f-brush);text-align:center}
.qa details p{padding:7px 0 2px 36px;font-size:15px}
.field{display:block;margin-top:12px;font-weight:800;font-size:14.5px}
.field input,.field select,.field textarea{display:block;width:100%;margin-top:4px;padding:10px 12px;font:inherit;font-weight:500;background:#fff;border:2px solid var(--ink);border-radius:9px}

/* ---------- footer ---------- */
.ft{position:relative;margin-top:60px}
.ft__street{position:relative;text-align:center;padding-top:10px}
.ft__bye{font-family:var(--f-hand);font-size:clamp(20px,2.6vw,28px)}
.ft__scene{position:relative;width:min(560px,86vw);margin:10px auto 0}
.ft__shop{width:100%}
.ft__tan{position:absolute;left:-24%;bottom:0;width:26%}
.ft__l1,.ft__l2{position:absolute;top:0;width:11%;transform-origin:50% 0}
.ft__l1{left:-12%}.ft__l2{right:-12%}
.ft__bar{background:var(--ind) url(../img/tx-indigo.webp);color:var(--paper);padding:30px 4vw 26px;text-align:center}
.ft__logo{font-family:var(--f-brush);font-size:38px;line-height:1.2}
.ft__nav{display:flex;flex-wrap:wrap;justify-content:center;gap:2px 24px;margin:10px 0 14px}
.ft__nav a{text-decoration:none;font-weight:700;font-size:14.5px;padding:3px 0;border-bottom:2px solid transparent;transition:border-color .2s}
.ft__nav a:hover{border-color:var(--mus)}
.ft__info{display:inline-block;text-align:left;font-size:14px;line-height:1.75}
.ft__info>div{display:flex;gap:12px}
.ft__info dt{font-weight:800;width:3.4em;flex:none}
.ft__info a{color:inherit}
.ft__sns{display:flex;justify-content:center;gap:12px;margin:12px 0}
.ft__sns a{display:flex;width:42px;height:42px;align-items:center;justify-content:center;border-radius:50%;background:var(--paper);color:var(--ind);transition:transform .25s cubic-bezier(.3,1.8,.5,1)}
.ft__sns a:hover{transform:rotate(-10deg) scale(1.1)}
.ft__sns svg{width:22px;height:22px}
.ft__note{font-size:12.5px;opacity:.88;max-width:680px;margin:0 auto 14px;line-height:1.7}
.credit{display:inline-flex;align-items:center;gap:12px;text-align:left;background:var(--paper);color:var(--ink);border:2.5px solid var(--ink);border-radius:16px;padding:9px 18px;text-decoration:none;box-shadow:0 5px 0 var(--mus);transition:transform .2s,box-shadow .2s}
.credit:hover{transform:translateY(3px);box-shadow:0 2px 0 var(--mus)}
.credit img{width:46px;flex:none}
.credit small{display:block;font-size:11px;line-height:1.3;font-weight:700;letter-spacing:.06em}
.credit b{display:block;font-family:var(--f-brush);font-weight:400;font-size:25px;line-height:1.25}
.credit em{display:block;font-style:normal;font-size:11.5px;line-height:1.4;font-weight:800;color:var(--red2)}
@media (max-width:760px){
  .ft__tan{left:-4%;bottom:-2px;width:22%}
  .ft__l1{left:-6%;width:10%}.ft__l2{right:-6%;width:10%}
  .ft__bar{padding-bottom:84px}
}

/* ---------- fixed helpers ---------- */
.fx{position:fixed;right:18px;bottom:18px;z-index:50;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:0;transform:translateY(14px);pointer-events:none;transition:opacity .3s,transform .3s}
.fx.on{opacity:1;transform:none;pointer-events:auto}
.fx__shop{display:block;text-decoration:none;transform-origin:50% 0}
.fx__str{display:block;width:2px;height:18px;margin:0 auto;background:var(--ink)}
.fx__tag{display:flex;flex-direction:column;align-items:center;width:92px;padding:9px 6px 10px;background:var(--red) url(../img/tx-kasure.webp) center/cover;color:#fff;border:2.5px solid var(--ink);border-radius:10px;box-shadow:0 5px 0 var(--ink);transition:transform .2s}
.fx__shop:hover .fx__tag{transform:scale(1.06)}
.fx__tag b{font-family:var(--f-brush);font-weight:400;font-size:18px;line-height:1.25;text-align:center}
.fx__tag img{width:26px;margin-top:3px;background:var(--paper);border-radius:50%;padding:3px;border:2px solid var(--ink);height:auto}
.fx__top{display:flex;flex-direction:column;align-items:center;justify-content:center;width:56px;height:56px;background:var(--paper);border:2.5px solid var(--ink);border-radius:10px;box-shadow:0 4px 0 var(--ink);font:800 11px/1 var(--f-body);text-decoration:none;transition:transform .15s,box-shadow .15s}
.fx__top:hover{transform:translateY(2px);box-shadow:0 2px 0 var(--ink)}
.fx__top i{display:block;width:13px;height:13px;border-left:3px solid var(--ink);border-top:3px solid var(--ink);transform:rotate(45deg);margin:3px 0 3px}
.sb{display:none}
@media (max-width:760px){
  .fx{right:8px;bottom:70px}
  .fx__shop{display:none}
  .fx__top{width:46px;height:46px}
  .sb{position:fixed;left:0;right:0;bottom:0;z-index:50;display:grid;grid-template-columns:1fr 1fr 1fr;background:var(--paper);border-top:2.5px solid var(--ink);padding-bottom:env(safe-area-inset-bottom)}
  .sb a{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;height:56px;font-weight:800;font-size:11.5px;text-decoration:none;border-right:2.5px solid var(--ink);line-height:1.2}
  .sb a:last-child{border-right:0}
  .sb .sb__m{background:var(--red);color:#fff}
  .sb img{height:24px;width:auto}
  .sb .sb__m img{background:var(--paper);border-radius:50%;padding:2px}
}
.toast{position:fixed;left:50%;bottom:86px;transform:translate(-50%,16px);z-index:220;background:var(--ink);color:var(--paper);padding:9px 22px;border-radius:99px;font-size:14.5px;opacity:0;pointer-events:none;transition:opacity .25s,transform .3s cubic-bezier(.3,1.8,.5,1);white-space:nowrap}
.toast.on{opacity:1;transform:translate(-50%,0)}
.sz{display:inline-flex;align-items:center;gap:6px;font-weight:800;font-size:13px}
.sz button{min-width:38px;height:34px;border:2px solid var(--ink);border-radius:8px;background:var(--paper);font-weight:800;padding:0 8px}
.sz button.on{background:var(--ink);color:var(--paper)}
.seg{display:inline-flex;border:2.5px solid var(--ink);border-radius:999px;overflow:hidden;background:var(--paper)}
.seg button{padding:5px 16px;font-weight:800;font-size:14px;line-height:1.5}
.seg button.on{background:var(--ind);color:var(--paper)}

/* ==================== noren at the door ==================== */
.nr{position:fixed;inset:0;z-index:150;overflow:hidden;background:transparent}
.nr.gone,html:not(.js) .nr,.no-nr .nr{display:none}
@media (prefers-reduced-motion:reduce){
  .fr.is-on .pop,.fr.is-on .tag.sw{animation:none!important;opacity:1;transform:rotate(var(--r,0deg))}
  .fr.is-on .fr__ph{transform:none;transition:none}
  .fx-smoke,.fx-emb,.fx-bub,.fx-lamp{display:none}
}
.nr canvas{position:absolute;inset:0;width:100%;height:100%;display:block}
.nr__css{position:absolute;inset:0;display:grid;grid-template-columns:repeat(4,1fr);perspective:1200px}
.nr__css i{display:flex;align-items:center;justify-content:center;font:400 clamp(70px,16vw,230px)/1 var(--f-brush);color:#FDF9EF;background:var(--ind) url(../img/tx-indigo.webp);box-shadow:inset 3px 0 8px rgba(0,0,0,.28),inset -3px 0 8px rgba(0,0,0,.28);transform-origin:50% 0;transition:transform 1.2s cubic-bezier(.65,0,.25,1)}
.nr.open .nr__css i:nth-child(1){transform:translateX(-120%) rotate(9deg);transition-delay:.12s}
.nr.open .nr__css i:nth-child(2){transform:translateX(-220%) rotate(11deg)}
.nr.open .nr__css i:nth-child(3){transform:translateX(220%) rotate(-11deg)}
.nr.open .nr__css i:nth-child(4){transform:translateX(120%) rotate(-9deg);transition-delay:.12s}
.nr.has-gl .nr__css{display:none}
.nr__say{position:absolute;left:0;right:0;bottom:7vh;text-align:center;color:#FDF9EF;font-family:var(--f-hand);font-size:clamp(17px,2vw,23px);line-height:1.6;transition:opacity .3s;text-shadow:0 2px 8px rgba(0,0,0,.5);pointer-events:none}
.nr__say small{display:block;font-family:var(--f-body);font-size:12.5px;font-weight:700;letter-spacing:.06em;opacity:.9}
.nr.open .nr__say{opacity:0}

/* ==================== hanging frames ==================== */
.hero{--fw:min(760px,56vw,calc((100svh - var(--hh) - 230px)*1.72));--fh:min(calc(var(--fw)*.72),calc(100svh - var(--hh) - 252px));--gap:64px;position:relative;padding-top:30px;padding-bottom:7px;overflow:hidden;background:linear-gradient(rgba(35,24,21,.14),rgba(35,24,21,0) 26px)}
.hero__rope{position:absolute;left:-2%;right:-2%;top:12px;height:9px;background:repeating-linear-gradient(112deg,#C8A46A 0 5px,#9A7743 5px 7px,#E0C48F 7px 11px);box-shadow:0 2px 0 rgba(35,24,21,.3);z-index:2}
.hero__stage{position:relative;height:calc(var(--fh) + 12px);touch-action:pan-y;cursor:grab;user-select:none;-webkit-user-select:none;outline-offset:-4px}
.hero__stage.drag{cursor:grabbing}
.fr{position:absolute;left:50%;top:0;width:var(--fw);height:var(--fh);margin-left:calc(var(--fw)/-2);transform-origin:50% -18px;will-change:transform;visibility:hidden}
.fr.show{visibility:visible}
.fr::before,.fr::after{content:"";position:absolute;top:-19px;width:2.5px;height:21px;background:var(--ink)}
.fr::before{left:16%;transform:rotate(-7deg);transform-origin:50% 100%}.fr::after{right:16%;transform:rotate(7deg);transform-origin:50% 100%}
.fr__b{position:absolute;inset:0;padding:9px;background:#A9773F url(../img/tx-wood.webp) center/900px 100%;border-radius:7px;box-shadow:0 0 0 2.5px var(--ink),0 18px 22px -12px rgba(35,24,21,.6)}
.fr__p{--q:min(1cqw,1.39cqh);position:relative;width:100%;height:100%;overflow:hidden;border-radius:3px;background:#2A1C14;container-type:size;box-shadow:0 0 0 2px rgba(35,24,21,.8)}
.fr__ph{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 50%);transform:scale(1.001);transition:transform 0s}
.fr.is-on .fr__ph{transform:scale(1.07);transition:transform 8s linear}
.fr__dim{position:absolute;inset:0;background:var(--cream);opacity:0;pointer-events:none;transition:opacity .4s;z-index:9}
.fr:not(.is-on) .fr__dim{opacity:.34}
.fr__lk{position:absolute;inset:0;z-index:1}
.fr__lan{position:absolute;left:100%;top:-16px;width:var(--gap);display:flex;justify-content:center;pointer-events:none;transform-origin:50% -4px}
.fr__lan img{width:42px;height:auto}
@media (min-width:761px) and (max-width:1100px){.hero{--fw:min(68vw,calc((100svh - var(--hh) - 230px)*1.72))}}
/* things that come out when a frame reaches the middle */
.pop{position:absolute;z-index:3;opacity:0;pointer-events:none}
.fr.is-on .pop{opacity:1;animation:pp .62s cubic-bezier(.3,1.5,.5,1) both;animation-delay:calc(var(--d,0)*1s)}
.fr.is-on .pop.drop{animation-name:ppd;animation-duration:.8s}
.fr.is-on .pop.stamp{animation-name:pps;animation-duration:.34s;animation-timing-function:cubic-bezier(.3,1.3,.5,1)}
.fr.is-on .pop.fade{animation-name:ppf;animation-duration:.8s}
@keyframes pp{0%{opacity:0;transform:translateY(5cqh) scale(.82) rotate(var(--r,0deg))}100%{opacity:1;transform:rotate(var(--r,0deg))}}
@keyframes ppd{0%{opacity:0;transform:translateY(-34cqh) rotate(calc(var(--r,0deg) + 14deg))}55%{opacity:1;transform:translateY(0) rotate(calc(var(--r,0deg) - 7deg))}78%{transform:rotate(calc(var(--r,0deg) + 3deg))}100%{opacity:1;transform:rotate(var(--r,0deg))}}
@keyframes pps{0%{opacity:0;transform:scale(2.2) rotate(calc(var(--r,0deg) - 14deg))}100%{opacity:1;transform:rotate(var(--r,0deg))}}
@keyframes ppf{0%{opacity:0}100%{opacity:1}}
.pl{left:calc(var(--x)*1cqw);top:calc(var(--y)*1cqh)}
.pr{right:calc(var(--x)*1cqw);top:calc(var(--y)*1cqh)}
.pb{left:calc(var(--x)*1cqw);bottom:calc(var(--y)*1cqh)}
.prb{right:calc(var(--x)*1cqw);bottom:calc(var(--y)*1cqh)}
/* a strip of washi with a brush word */
.wa{background:var(--paper);color:var(--ink);font-family:var(--f-brush);font-weight:400;line-height:1.25;letter-spacing:.06em;padding:.5em .62em;box-shadow:0 calc(var(--q)*.5) calc(var(--q)*1.2) rgba(0,0,0,.4);clip-path:polygon(0 1%,50% 0,100% 1.5%,99% 30%,100% 62%,99% 99%,52% 100%,1% 99%,0 64%,1% 30%)}
.wa--v{writing-mode:vertical-rl;text-orientation:upright;white-space:nowrap;font-size:calc(var(--q)*7.4);letter-spacing:.1em;padding:.56em .44em}
.wa--h{font-size:calc(var(--q)*6.2);white-space:nowrap}
.fr[data-k=party] .wa--h{font-size:calc(var(--q)*5.4)}
.wa--r{background:var(--red) url(../img/tx-kasure.webp) center/cover;color:#fff}
.wa--i{background:var(--ind) url(../img/tx-indigo.webp);color:var(--paper)}
/* a red seal with today's date */
.seal{width:calc(var(--q)*15.5);height:calc(var(--q)*15.5);border-radius:50%;background:var(--red);color:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;line-height:1.05;box-shadow:0 0 0 calc(var(--q)*.5) var(--paper),0 0 0 calc(var(--q)*.75) var(--red),0 calc(var(--q)*1) calc(var(--q)*1.6) rgba(0,0,0,.4);font-family:var(--f-pop)}
.seal span{font-size:calc(var(--q)*3.5)}
.seal b{font-weight:400;font-size:calc(var(--q)*4.4)}
.seal small{font-family:var(--f-body);font-weight:800;font-size:calc(var(--q)*1.9);letter-spacing:.04em;margin-bottom:.3em}
/* a price tag on a string */
.tag{background:var(--mus);color:var(--ink);border:calc(var(--q)*.34) solid var(--ink);border-radius:calc(var(--q)*1.2);padding:calc(var(--q)*.6) calc(var(--q)*2) calc(var(--q)*.9);text-align:center;line-height:1.15;transform-origin:50% calc(var(--q)*-3);box-shadow:0 calc(var(--q)*.7) 0 var(--ink)}
.tag::before{content:"";position:absolute;left:50%;top:calc(var(--q)*-3.4);width:calc(var(--q)*.34);height:calc(var(--q)*3.4);background:var(--ink)}
.tag small{display:block;font-weight:800;font-size:calc(var(--q)*1.95);letter-spacing:.04em}
.tag b{font-family:var(--f-pop);font-weight:400;font-size:calc(var(--q)*6.4);letter-spacing:.01em}
.tag i{font-style:normal;font-weight:800;font-size:calc(var(--q)*2.5)}
.tag em{display:block;font-style:normal;font-weight:700;font-size:calc(var(--q)*1.65)}
.fr.is-on .tag.sw{animation:ppd .8s both,tagsw 3.6s ease-in-out .9s infinite alternate;animation-delay:calc(var(--d,0)*1s),calc(var(--d,0)*1s + .9s)}
@keyframes tagsw{from{transform:rotate(calc(var(--r,0deg) - 3deg))}to{transform:rotate(calc(var(--r,0deg) + 3deg))}}
/* a hand written word bubble */
.say{background:var(--paper);color:var(--ink);font-family:var(--f-hand);font-size:calc(var(--q)*2.75);line-height:1.45;padding:calc(var(--q)*1) calc(var(--q)*1.9);border-radius:calc(var(--q)*2);border:calc(var(--q)*.32) solid var(--ink);box-shadow:calc(var(--q)*.5) calc(var(--q)*.6) 0 var(--ink);white-space:nowrap}
.say::after{content:"";position:absolute;left:var(--tail,18%);bottom:calc(var(--q)*-1.25);width:calc(var(--q)*1.8);height:calc(var(--q)*1.8);background:var(--paper);border-right:calc(var(--q)*.32) solid var(--ink);border-bottom:calc(var(--q)*.32) solid var(--ink);transform:rotate(45deg) skew(8deg,8deg)}
.say--t::after{bottom:auto;top:calc(var(--q)*-1.25);transform:rotate(225deg) skew(8deg,8deg)}
.note{background:var(--paper);color:var(--ink);padding:calc(var(--q)*2.2) calc(var(--q)*2.2) calc(var(--q)*1.6);font-size:calc(var(--q)*2.35);line-height:1.5;box-shadow:0 calc(var(--q)*.6) calc(var(--q)*1.3) rgba(0,0,0,.42)}
.note::before{content:"";position:absolute;left:50%;top:calc(var(--q)*-1.2);width:calc(var(--q)*9);height:calc(var(--q)*2.6);margin-left:calc(var(--q)*-4.5);background:rgba(235,170,44,.72);transform:rotate(-2deg)}
.note h3,.note .h{font-family:var(--f-hand);font-weight:400;font-size:calc(var(--q)*2.5);color:var(--red2);line-height:1.3}
.note ul{font-family:var(--f-brush);font-size:calc(var(--q)*3.7);line-height:1.28}
.live{display:inline-flex;align-items:center;gap:calc(var(--q)*1);background:var(--ink);color:var(--paper);border-radius:99px;padding:calc(var(--q)*.6) calc(var(--q)*2);font-weight:800;font-size:calc(var(--q)*2.15);line-height:1.4;white-space:nowrap}
.live .dotlive{margin:0;width:calc(var(--q)*1.5);height:calc(var(--q)*1.5);box-shadow:none}
/* moving air */
.fx-smoke{position:absolute;z-index:2;pointer-events:none;opacity:0;left:calc(var(--x)*1cqw);top:calc(var(--y)*1cqh);width:1px;height:1px}
.fr.is-on .fx-smoke{opacity:1;transition:opacity 1s .3s}
.fx-smoke i{position:absolute;left:calc(var(--q)*-9);top:calc(var(--q)*-9);width:calc(var(--q)*18);height:calc(var(--q)*18);border-radius:50%;background:radial-gradient(closest-side,rgba(255,255,255,.34),rgba(255,255,255,0));opacity:0;animation:smk 4.6s ease-out infinite;animation-delay:calc(var(--n)*-.92s);animation-play-state:paused}
.fr.is-on .fx-smoke i{animation-play-state:running}
@keyframes smk{0%{transform:translate(0,0) scale(.3);opacity:0}16%{opacity:.82}100%{transform:translate(calc(var(--n)*calc(var(--q)*2.2) - calc(var(--q)*4)),-58cqh) scale(2.5);opacity:0}}
.fx-emb{position:absolute;z-index:2;pointer-events:none;left:calc(var(--x)*1cqw);top:calc(var(--y)*1cqh);width:1px;height:1px}
.fx-emb i{position:absolute;width:calc(var(--q)*.62);height:calc(var(--q)*.62);border-radius:50%;background:#FFB347;box-shadow:0 0 calc(var(--q)*1.1) calc(var(--q)*.3) rgba(255,120,30,.8);opacity:0;animation:emb 2.6s ease-out infinite;animation-delay:calc(var(--n)*-.37s);animation-play-state:paused}
.fr.is-on .fx-emb i{animation-play-state:running}
@keyframes emb{0%{transform:translate(0,0);opacity:0}12%{opacity:1}100%{transform:translate(calc((var(--n) - 3.5)*calc(var(--q)*2.4)),-34cqh);opacity:0}}
.fx-bub{position:absolute;z-index:2;pointer-events:none;left:calc(var(--x)*1cqw);bottom:calc(var(--y)*1cqh);width:var(--w);height:calc(var(--h)*1cqh)}
.fx-bub i{position:absolute;bottom:0;left:calc(var(--n)*11%);width:calc(calc(var(--q)*.5) + var(--n)*calc(var(--q)*.05));aspect-ratio:1;border-radius:50%;background:rgba(255,255,255,.55);box-shadow:inset 0 0 0 calc(var(--q)*.1) rgba(255,255,255,.9);opacity:0;animation:bub 3s linear infinite;animation-delay:calc(var(--n)*-.41s);animation-play-state:paused}
.fr.is-on .fx-bub i{animation-play-state:running}
@keyframes bub{0%{transform:translate(0,0);opacity:0}8%{opacity:.95}50%{transform:translate(calc(var(--q)*.6),calc(var(--h)*-.5cqh))}86%{opacity:.8}100%{transform:translate(calc(var(--q)*-.2),calc(var(--h)*-1cqh));opacity:0}}
.fx-lamp{position:absolute;inset:0;z-index:1;pointer-events:none;background:radial-gradient(60% 50% at 52% 46%,rgba(255,190,90,.34),rgba(255,190,90,0));mix-blend-mode:screen;animation:lamp 3.4s ease-in-out infinite alternate;animation-play-state:paused}
.fr.is-on .fx-lamp{animation-play-state:running}
@keyframes lamp{from{opacity:.45}to{opacity:1}}
/* controls under the frames */
.hero__bar{position:relative;display:flex;align-items:center;justify-content:center;width:min(1320px,96vw);margin:20px auto 0;min-height:38px;gap:12px}
.hero__dots{display:flex;gap:11px;align-items:center}
.hero__dots button{position:relative;width:19px;height:19px;border-radius:50%;border:2.5px solid var(--ink);background:var(--paper);transition:transform .2s cubic-bezier(.3,1.8,.5,1)}
.hero__dots button:hover{transform:scale(1.2)}
.hero__dots button.on{background:var(--red)}
.hero__dots svg{position:absolute;left:-7px;top:-7px;width:28px;height:28px;transform:rotate(-90deg);opacity:0;pointer-events:none}
.hero__dots button.on svg{opacity:1}
.hero__dots circle{fill:none;stroke:var(--red);stroke-width:2.4;stroke-dasharray:75.4;stroke-dashoffset:calc(75.4 - var(--prog,0)*75.4)}
.hero__arr{display:flex;width:38px;height:38px;border-radius:50%;background:var(--paper);border:2.5px solid var(--ink);align-items:center;justify-content:center;box-shadow:0 3px 0 var(--ink);transition:transform .15s,box-shadow .15s;flex:none}
.hero__arr:hover{transform:translateY(2px);box-shadow:0 1px 0 var(--ink)}
.hero__arr img{width:11px;height:auto}
.hero__arr.prev img{transform:scaleX(-1)}
.hero__credit{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:12.5px;line-height:1.4;background:var(--paper);border:2px solid var(--ink);border-radius:99px;padding:3px 14px;text-decoration:none;font-weight:700;transition:background .2s}
.hero__credit:hover{background:var(--egg,#F7D877)}
.hero__credit b{font-weight:800}
.hero__stop{position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:12.5px;font-weight:700;border:2px solid var(--ink);border-radius:99px;padding:3px 12px;background:var(--paper);line-height:1.4}
/* welcome line and big buttons */
.wel{text-align:center;padding:16px 0 0}
.wel__h{text-wrap:balance;display:inline-flex;align-items:center;gap:14px;font-family:var(--f-hand);font-weight:400;font-size:clamp(22px,2.9vw,33px);line-height:1.4}
.wel__h img{width:auto;height:44px;flex:none}
.wel__t{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:2px 12px;font-size:14.5px;font-weight:700;margin-top:2px}
.wel__t time{font-family:var(--f-pop);font-weight:400;font-size:16.5px}
.wel__t .dotlive{margin:0;box-shadow:0 0 0 3px rgba(35,24,21,.1)}
.wel__s{display:inline-flex;align-items:center;gap:7px;font-weight:800}
.bbs{display:flex;flex-direction:column;align-items:center;gap:20px;width:min(660px,90vw);margin:20px auto 0}
@media (max-width:760px){
  .hero{--fw:77vw;--fh:calc(77vw*1.14);--gap:30px;padding-top:26px}
  .fr__b{padding:6px}
  .fr__lan img{width:24px}
  .fr__lan{top:-12px}
  .wa--v{font-size:calc(var(--q)*10)}
  .wa--h{font-size:calc(var(--q)*8)}
  .seal{width:calc(var(--q)*23);height:calc(var(--q)*23)}
  .seal span{font-size:calc(var(--q)*5.4)}.seal b{font-size:calc(var(--q)*6.6)}.seal small{font-size:calc(var(--q)*2.9)}
  .tag{border-width:calc(var(--q)*.6);padding:calc(var(--q)*1) calc(var(--q)*3) calc(var(--q)*1.4);box-shadow:0 calc(var(--q)*1) 0 var(--ink)}
  .tag small{font-size:calc(var(--q)*3.1)}.tag b{font-size:calc(var(--q)*10)}.tag i{font-size:calc(var(--q)*4)}.tag em{font-size:calc(var(--q)*2.8)}
  .say{font-size:calc(var(--q)*4.1);padding:calc(var(--q)*1.6) calc(var(--q)*2.8);border-width:calc(var(--q)*.5)}
  .note{font-size:calc(var(--q)*3.6);padding:calc(var(--q)*3) calc(var(--q)*3) calc(var(--q)*2.2)}
  .note .h{font-size:calc(var(--q)*3.8)}
  .note ul{font-size:calc(var(--q)*5.6)}
  .live{font-size:calc(var(--q)*3.3);padding:calc(var(--q)*1) calc(var(--q)*3);gap:calc(var(--q)*1.5)}
  .live .dotlive{width:calc(var(--q)*2.4);height:calc(var(--q)*2.4)}
  .hero__credit{position:static;transform:none;order:3;width:auto;margin:6px auto 0}
  .hero__bar{flex-wrap:wrap;margin-top:16px}
  .hero__stop{position:static;transform:none}
  .hero__credit{flex-basis:auto}
  .wel{padding:10px 18px 0}
  .wel__h img{height:30px}
  .wel__h{gap:7px;font-size:15.5px}
  .bb{min-height:64px;padding-inline:36px;letter-spacing:.07em;font-size:21px}
  .bb::after{right:16px}
  .fr[data-k=fish] .tag.pl{left:calc(var(--q)*27)}
  .fr[data-k=high] .say{top:auto;bottom:15cqh;left:calc(var(--q)*31)}
  .fr[data-k=party] .wa--h{font-size:calc(var(--q)*6.2)}
  .fr[data-k=party] .seal{top:17cqh}
}

/* ==================== what kind of place ==================== */
.about{padding:70px 0 40px;position:relative}
.ab{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,5vw,70px);align-items:center;padding:44px 0;position:relative}
.ab+.ab{border-top:3px dotted var(--line)}
.ab--r .ab__tx{order:2}
.ab__h{font-family:var(--f-brush);font-weight:400;font-size:clamp(28px,3.3vw,40px);line-height:1.38;letter-spacing:.03em;margin-bottom:14px}
.ab__h em{font-style:normal;color:var(--red)}
.ab__h em.i{color:var(--ind)}
.ab__h em.g{color:var(--leaf2)}
.ab__h em.o{color:var(--org2)}
.ab__p{font-size:16px}
.ab__cnt{font-family:var(--f-pop);font-weight:400;color:var(--red2);font-size:1.2em;padding:0 .1em}
.ab__hand{display:inline-block;margin-top:12px;font-family:var(--f-hand);font-size:17px;line-height:1.5;color:var(--ink);padding-bottom:6px;background:url(../il/ul-m.svg) 0 100%/100% 9px no-repeat}
.ab__pic{position:relative}
.ab__pic>img:first-child{width:100%;filter:drop-shadow(0 7px 9px rgba(35,24,21,.34));transform:rotate(var(--rot,1.2deg))}
.ab--r .ab__pic{--rot:-1.4deg}
.ab__tape{position:absolute;left:50%;top:-6px;width:112px;height:29px;margin-left:-56px;background:rgba(235,170,44,.62);transform:rotate(-3deg);z-index:2}
.ab__dd{position:absolute;z-index:3;height:auto;pointer-events:none}
.ab__say{position:absolute;z-index:4;background:var(--paper);border:2.5px solid var(--ink);border-radius:14px;padding:6px 14px;font-family:var(--f-hand);font-size:15px;line-height:1.45;box-shadow:3px 4px 0 var(--ink);transform:rotate(var(--r,-2deg))}
@media (max-width:760px){
  .about{padding-top:50px}
  .ab{grid-template-columns:1fr;padding:30px 0}
  .ab--r .ab__tx{order:0}
}

/* ==================== dishes ==================== */
.mn{padding:60px 0 20px;position:relative}
.dsh{display:grid;grid-template-columns:1fr 1fr;gap:54px clamp(26px,5vw,70px)}
.ds{position:relative;display:block;text-decoration:none}
.ds__top{position:relative;padding-left:clamp(58px,6.4vw,84px);min-height:clamp(250px,26vw,340px)}
.ds__pic{width:100%;transition:transform .5s cubic-bezier(.3,1.5,.5,1)}
.ds:hover .ds__pic{transform:rotate(-2.5deg) scale(1.03)}
.ds__n{position:absolute;left:0;top:0;z-index:2;writing-mode:vertical-rl;text-orientation:upright;white-space:nowrap;font-family:var(--f-brush);font-weight:400;font-size:clamp(28px,3.4vw,42px);line-height:1.18;letter-spacing:.06em;color:var(--paper);background:var(--c,var(--ind)) url(../img/tx-kasure.webp) center/cover;padding:18px 11px 22px;clip-path:polygon(0 1%,50% 0,100% 1%,97% 40%,100% 74%,96% 99%,52% 100%,3% 98%,0 60%,3% 28%);min-height:58%}
.ds__pop{position:absolute;z-index:3;right:0;top:-6px;background:var(--paper);font-family:var(--f-hand);font-size:clamp(14px,1.45vw,17px);line-height:1.4;padding:5px 14px;border:2.5px solid var(--ink);border-radius:13px;box-shadow:3px 4px 0 var(--ink);transform:rotate(3deg)}
.ds__pop::after{content:"";position:absolute;left:24%;bottom:-8px;width:12px;height:12px;background:var(--paper);border-right:2.5px solid var(--ink);border-bottom:2.5px solid var(--ink);transform:rotate(45deg) skew(8deg,8deg)}
.ds__pr{position:absolute;z-index:3;right:4%;bottom:6%;background:var(--mus);border:2.5px solid var(--ink);border-radius:10px;box-shadow:0 4px 0 var(--ink);padding:1px 13px 3px;font-family:var(--f-pop);font-size:clamp(23px,2.5vw,31px);line-height:1.25;transform:rotate(-3deg);transition:transform .4s cubic-bezier(.3,1.8,.5,1)}
.ds:hover .ds__pr{transform:rotate(3deg) scale(1.06)}
.ds__pr small{font-family:var(--f-body);font-weight:800;font-size:.46em;margin-left:1px}
.ds__tx{margin-top:10px;font-size:15.5px;line-height:1.9}
.ds__tx small{display:block;margin-top:3px;font-size:12.5px;color:var(--ink2)}
@media (max-width:760px){.dsh{grid-template-columns:1fr;gap:34px}.ds__top{padding-left:60px;min-height:0}}

/* the chalk board: real words that follow the calendar */
.bd{position:relative;margin:58px auto 0;width:var(--inner);padding:14px;background:#A9773F url(../img/tx-wood.webp) center/1200px 100%;border-radius:9px;box-shadow:0 0 0 2.5px var(--ink),0 16px 22px -12px rgba(35,24,21,.6)}
.bd__in{position:relative;display:grid;grid-template-columns:1.05fr 1.1fr 1.1fr;gap:clamp(16px,3vw,40px);padding:26px clamp(18px,3vw,38px) 30px;border-radius:3px;background:#2A3E36 url(../img/tx-chalk.webp) center/cover;color:#F5F1E4;font-family:var(--f-hand);box-shadow:0 0 0 2px rgba(35,24,21,.8),inset 0 0 40px rgba(0,0,0,.3);text-shadow:0 0 1px rgba(255,255,255,.5)}
.bd__d{border-right:2px dashed rgba(245,241,228,.34);padding-right:16px}
.bd__d h2{font-family:var(--f-brush);font-weight:400;font-size:clamp(25px,2.8vw,34px);line-height:1.3}
.bd__date{font-size:clamp(20px,2.2vw,26px);line-height:1.3;margin-top:4px;color:#FBE29A}
.bd__msg{font-size:15.5px;line-height:1.65;margin-top:9px}
.bd h3{font-weight:400;font-size:17px;color:#F4B8AA;line-height:1.3;margin-bottom:6px}
.bd__li{font-size:clamp(17px,1.8vw,20px);line-height:1.6}
.bd__li li{display:flex;align-items:baseline;gap:7px}
.bd__li li::after{content:"";order:1;flex:1;border-bottom:2px dotted rgba(245,241,228,.5);transform:translateY(-4px)}
.bd__li b{order:0;font-weight:400}
.bd__li i{order:2;font-style:normal;color:#FBE29A}
.bd__chalk{position:absolute;right:26px;bottom:6px;width:62px;height:9px;border-radius:3px;background:#F5F1E4;transform:rotate(-3deg);box-shadow:0 1px 1px rgba(0,0,0,.4);opacity:.95}
.bd__tan{position:absolute;right:-20px;top:-72px;width:96px;filter:drop-shadow(0 4px 3px rgba(35,24,21,.3))}
.bd__auto{margin-top:8px;font-size:12.5px;line-height:1.6;text-align:right;color:var(--ink2);width:var(--inner);margin-inline:auto;padding-top:8px}
@media (max-width:860px){
  .bd__in{grid-template-columns:1fr;gap:20px}
  .bd__d{border-right:0;border-bottom:2px dashed rgba(245,241,228,.34);padding:0 0 14px}
  .bd__tan{width:70px;top:-52px;right:-6px}
}
.twob{display:grid;grid-template-columns:1fr 1fr;gap:20px;width:min(860px,92vw);margin:52px auto 0}
.twob .bb{width:100%;padding-inline:44px}
.twob .bb::after{right:22px}
@media (max-width:640px){.twob{grid-template-columns:1fr}}

/* ==================== by region ==================== */
.ar{position:relative;padding:50px 0 66px;text-align:center}
.ar__dd{position:absolute;height:auto;pointer-events:none}
@media (max-width:1100px){.ar__dd{display:none}}
.ar__lead{font-size:15px;margin-bottom:18px}
.ar__wrap{display:flex;justify-content:center;gap:clamp(24px,6vw,80px);flex-wrap:wrap}
.ar__t{display:flex;align-items:center;gap:12px;font-family:var(--f-brush);font-size:20px;line-height:1.4;margin-bottom:14px;justify-content:center;white-space:nowrap}
.ar__t::before,.ar__t::after{content:"";flex:1 1 44px;min-width:30px;height:2px;background:var(--ink)}
.ar__btns{display:flex;gap:13px;justify-content:center}
.ar__b{width:92px;height:92px;border-radius:50% 47% 52% 48%/48% 52% 47% 52%;background:var(--leaf) url(../img/tx-kasure.webp) center/cover;color:#fff;font-family:var(--f-brush);font-size:19px;line-height:1.2;box-shadow:0 5px 0 var(--leaf2);transition:transform .35s cubic-bezier(.3,1.8,.5,1),box-shadow .15s}
.ar__b:hover{transform:translateY(-4px) rotate(-5deg);box-shadow:0 9px 0 var(--leaf2)}
.ar__b:active{transform:translateY(5px);box-shadow:0 0 0 var(--leaf2)}
.ar__b[data-tab=std]{background-color:var(--ind);box-shadow:0 5px 0 var(--ind2)}
.ar__b[data-tab=togo]{background-color:var(--org);box-shadow:0 5px 0 var(--org2)}
/* the menu window */
.mld{width:min(1000px,95vw)}
.mld__h{display:flex;flex-wrap:wrap;gap:8px 16px;align-items:center;margin-bottom:10px;padding-right:46px}
.mld__ti{font-family:var(--f-brush);font-size:clamp(26px,3vw,34px);line-height:1.3}
.mld__tabs{display:flex;gap:6px;flex-wrap:wrap;margin:6px 0 14px}
.mld__tabs button{padding:5px 18px;font-weight:800;border:2.5px solid var(--ink);border-radius:999px;background:var(--paper);font-size:14.5px}
.mld__tabs button.on{background:var(--red);color:#fff}
.mlp h3{font-family:var(--f-brush);font-weight:400;font-size:24px;border-block:3px double var(--ink);padding:2px 0;margin:10px 0 4px;display:flex;justify-content:space-between;align-items:baseline}
.mlp h3 small{font-family:var(--f-body);font-size:13px;font-weight:700}
.mlp__cols{columns:2;column-gap:40px}
.mlp__cols section{break-inside:avoid;margin-bottom:14px}
.ml__r{display:flex;align-items:baseline;gap:7px;font-size:var(--ml,15.5px);line-height:1.85}
.ml__n em{font-style:normal;font-size:.72em;font-weight:800;background:var(--red);color:#fff;border-radius:4px;padding:0 5px;margin-left:6px;vertical-align:.12em}
.ml__dot{flex:1;border-bottom:2px dotted var(--line);transform:translateY(-4px);min-width:16px}
.ml__p{font-weight:800;white-space:nowrap}
.ml__p i{font:400 1.08em var(--f-pop)}
.ml__note,.mld__foot{font-size:13px;color:var(--ink2);margin-top:8px}
.big-t .ml__r{--ml:19px}
@media (max-width:640px){.mlp__cols{columns:1}}

/* ==================== news ==================== */
.nw{position:relative;margin-top:40px;padding:66px 0 74px;color:var(--paper);background:var(--ind) url(../img/tx-indigo.webp)}
.nw::before,.nw::after{content:"";position:absolute;left:0;right:0;height:22px;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 1200 22' preserveAspectRatio='none'%3E%3Cpath fill='%23F8F1E1' d='M0 0h1200v8c-60 10-120 12-200 4S860 2 780 10s-140 12-220 4-150-10-230-2-180 12-330-4Z'/%3E%3C/svg%3E") center/100% 100%}
.nw::before{top:-1px}
.nw::after{bottom:-1px;transform:scaleY(-1)}
.nw__seig{position:absolute;inset:0;opacity:.09;pointer-events:none;background:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='40'%3E%3Cg fill='none' stroke='%23fff' stroke-width='1.6'%3E%3Ccircle cx='40' cy='40' r='38'/%3E%3Ccircle cx='40' cy='40' r='28'/%3E%3Ccircle cx='40' cy='40' r='18'/%3E%3Ccircle cx='0' cy='20' r='38'/%3E%3Ccircle cx='0' cy='20' r='28'/%3E%3Ccircle cx='0' cy='20' r='18'/%3E%3Ccircle cx='80' cy='20' r='38'/%3E%3Ccircle cx='80' cy='20' r='28'/%3E%3Ccircle cx='80' cy='20' r='18'/%3E%3C/g%3E%3C/svg%3E")}
.nw>*{position:relative}
.nw__list{width:min(980px,92vw);margin:0 auto}
.nl{display:block}
.nl__a{display:grid;grid-template-columns:172px 1fr;gap:clamp(14px,3vw,30px);align-items:center;width:100%;text-align:left;padding:15px 8px;border-bottom:2px dashed rgba(253,249,239,.3);text-decoration:none;color:inherit;transition:background .2s}
.nl__a:hover{background:rgba(255,255,255,.07)}
.nl__a img{width:100%;aspect-ratio:4/3;object-fit:cover;border-radius:7px;border:2.5px solid var(--paper);transition:transform .4s cubic-bezier(.3,1.5,.5,1)}
.nl__a:hover img{transform:rotate(-2deg) scale(1.03)}
.nl__tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;line-height:1.3}
.nl__new{background:var(--red);color:#fff;font:400 13px/1.2 var(--f-pop);padding:3px 9px;border-radius:5px;transform:rotate(-3deg)}
.nl__cat{background:var(--paper);color:var(--ind);font-weight:800;font-size:12px;padding:3px 10px;border-radius:99px}
.nl__end{border:1.5px solid var(--paper);font-weight:700;font-size:12px;padding:2px 9px;border-radius:99px;opacity:.86}
.nl time{display:block;font:400 15px/1.5 var(--f-pop);margin-top:5px;color:#FBE29A}
.nl__t{display:block;font-weight:700;font-size:15.5px;line-height:1.7}
.nw__more{text-align:center;margin-top:28px}
.nw__auto{text-align:center;font-size:12.5px;opacity:.82;margin-top:14px}
@media (max-width:640px){.nl__a{grid-template-columns:108px 1fr}.nl__t{font-size:14.5px;line-height:1.6}}

/* ==================== lower blocks ==================== */
.low{padding:62px 0 0;text-align:center}
.low__p{max-width:720px;margin:0 auto;font-size:15.5px}
.low__b{display:flex;flex-wrap:wrap;gap:14px;justify-content:center;margin-top:20px}
.rc{display:grid;grid-template-columns:1fr 1fr;gap:clamp(18px,3.4vw,44px);width:min(960px,92vw);margin:0 auto}
.rc__c{display:block;text-decoration:none;width:100%;text-align:center}
.rc__ph{display:block;position:relative;aspect-ratio:4/3;overflow:hidden;border:2.5px solid var(--ink);border-radius:14px;box-shadow:0 7px 0 var(--ink);transform:rotate(var(--r,-.8deg));transition:transform .35s cubic-bezier(.3,1.5,.5,1)}
.rc__c:nth-child(2) .rc__ph{--r:.8deg}
.rc__ph img{width:100%;height:100%;object-fit:cover;object-position:var(--pos,50% 30%);transition:transform .7s}
.rc__c:hover .rc__ph{transform:rotate(0deg) translateY(-3px)}
.rc__c:hover img{transform:scale(1.05)}
.rc__say{position:absolute;left:12px;bottom:12px;background:var(--paper);border:2px solid var(--ink);border-radius:11px;padding:2px 11px;font-family:var(--f-hand);font-size:14.5px;line-height:1.45;text-align:left}
.rc__c .btn{margin-top:18px}
@media (max-width:640px){.rc{grid-template-columns:1fr}}

/* ==================== inner pages ==================== */
.pgh{position:relative;padding:18px 0 30px;text-align:center;overflow:hidden}
.pgh .tnw{margin-bottom:18px}
.pgh__l{max-width:720px;margin:0 auto;padding:0 5vw;font-size:15.5px}
.pgh__t{display:flex;flex-wrap:wrap;justify-content:center;align-items:center;gap:2px 12px;margin-top:6px;font-weight:700;font-size:14.5px}
.pgh__t time{font-family:var(--f-brush);font-size:17px}
.pgh__s{display:inline-flex;gap:7px;align-items:center}
.pgh__s .dotlive{margin:0;box-shadow:0 0 0 3px rgba(35,24,21,.1)}
.pgh__lan{position:absolute;top:16px;width:clamp(44px,5.6vw,76px);transform-origin:50% 0}
.pgh__lan.l{left:8vw}.pgh__lan.r{right:8vw}
.pgh__tan{position:absolute;right:calc(8vw + 96px);bottom:6px;width:88px}
.pgh__bell{position:absolute;left:calc(8vw + 96px);top:40px;width:54px;transform-origin:50% 0}
@media (max-width:760px){.pgh__lan{width:40px}.pgh__lan.l{left:3vw}.pgh__lan.r{right:3vw}.pgh__tan,.pgh__bell{display:none}}
.chip{padding:5px 18px;border:2.5px solid var(--ink);border-radius:999px;background:var(--paper);font-weight:800;font-size:14.5px;line-height:1.5;transition:transform .15s}
.chip:hover{transform:translateY(-2px)}
.chip.on{background:var(--ind);color:var(--paper)}
.chip--d{border-color:var(--paper)}
.chip--d{color:var(--ink)}
.chip--d.on{background:var(--red);color:#fff}

/* ---------- menu ---------- */
.mt{position:sticky;top:var(--hh);z-index:40;background:var(--paper) url(../img/tx-paper.webp);border-block:2.5px solid var(--ink);box-shadow:0 5px 8px -5px rgba(35,24,21,.35)}
.mt__tabs{display:flex;justify-content:center;overflow-x:auto;scrollbar-width:none;padding:0 6px;position:relative}
.mt__tabs::-webkit-scrollbar{display:none}
.mt__tabs a{flex:none;display:flex;align-items:center;gap:6px;padding:7px 13px;text-decoration:none;font-family:var(--f-brush);font-size:16px;line-height:1.3;border-bottom:4px solid transparent;transition:border-color .2s,color .2s}
.mt__tabs a img{height:26px;width:auto;max-width:42px}
.mt__tabs a:hover{color:var(--red2)}
.mt__tabs a.on{border-bottom-color:var(--red);color:var(--red2)}
.mt__opt{display:flex;flex-wrap:wrap;gap:6px 14px;justify-content:center;align-items:center;padding:12px 8px 0}
@media (max-width:760px){.mt__tabs{justify-content:flex-start}.mt__tabs a{font-size:14.5px;padding:6px 9px}.mt__tabs a img{height:22px}.mt__opt{gap:4px 8px;padding:4px 4px 6px}.seg button{padding:3px 11px;font-size:13px}.sz{font-size:12px}.sz button{height:29px;min-width:32px;font-size:12px}}
.mb{padding-top:6px}
.mb .bd{width:100%;margin-top:26px}
.mb__note{font-size:13px;color:var(--ink2);text-align:center;margin-top:28px}
.mc{padding-top:44px}
.mc__h{display:flex;align-items:center;gap:16px;margin-bottom:14px;flex-wrap:wrap}
.mc__i{height:64px;width:auto;max-width:130px}
.mc__t{font-family:var(--f-brush);font-weight:400;font-size:clamp(30px,3.6vw,42px);line-height:1.2}
.mc__l{font-size:15px;line-height:1.7}
.mc__ph{display:grid;grid-template-columns:1.25fr 1fr 1fr;gap:18px;margin-bottom:22px}
.pf{position:relative;aspect-ratio:4/3;background:var(--line);border:2.5px solid var(--ink);border-radius:10px;overflow:hidden;box-shadow:0 5px 0 var(--ink);transform:rotate(var(--r,-.7deg));transition:transform .3s cubic-bezier(.3,1.5,.5,1)}
.pf2{--r:.8deg}.pf3{--r:-.5deg}
.pf:hover{transform:rotate(0) scale(1.015)}
.pf img{width:100%;height:100%;object-fit:cover}
.pf figcaption{position:absolute;left:8px;bottom:8px;background:var(--paper);border:2px solid var(--ink);border-radius:9px;padding:1px 10px;font-family:var(--f-hand);font-size:14px;line-height:1.5}
@media (max-width:640px){.mc__ph{grid-template-columns:1fr 1fr}.pf1{grid-column:1/-1;aspect-ratio:16/9}}
/* strips of paper on the wall */
.strips{position:relative;display:flex;flex-wrap:wrap;gap:22px 10px;justify-content:center;padding:26px 14px 22px;background:#EADBBD;border:2.5px solid var(--ink);border-radius:10px;box-shadow:inset 0 0 40px rgba(120,85,40,.16)}
.strips::before{content:"";position:absolute;inset:6px 6px auto;height:7px;border-radius:3px;background:#8A5F33;box-shadow:0 2px 0 rgba(35,24,21,.4)}
.st{width:88px;position:relative;transform-origin:50% 0}
.st::before{content:"";position:absolute;left:50%;top:-15px;width:7px;height:7px;margin-left:-3.5px;border-radius:50%;background:var(--ink);z-index:2}
.st__b{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:space-between;width:100%;height:274px;padding:14px 2px 9px;background:var(--paper);box-shadow:0 3px 5px rgba(35,24,21,.28);clip-path:polygon(0 0,100% 0,99% 34%,100% 72%,98.5% 100%,1.5% 99.4%,1% 60%,0 28%);transition:background .2s,transform .2s}
.st__b:hover{background:#FFF3C9}
.st__n{writing-mode:vertical-rl;text-orientation:upright;font-family:var(--f-fude);font-weight:400;font-size:27px;line-height:1.05;letter-spacing:.02em;flex:1;white-space:nowrap;display:block;margin-inline:auto}
.st__p{font:400 17px/1.2 var(--f-brush);margin-top:6px;white-space:nowrap}
.st__p i{font-style:normal}
.st__m{position:absolute;left:3px;top:3px;writing-mode:vertical-rl;font-size:10px;font-weight:800;line-height:1;padding:3px 1.5px;background:var(--red);color:#fff;border-radius:3px;letter-spacing:.02em}
.st__m--定番{background:var(--ind)}
.st__m--おすすめ{background:var(--leaf2)}
.st__d{display:none}
.st__c{position:absolute;right:3px;top:3px;min-width:21px;height:21px;border-radius:50%;background:var(--red);color:#fff;font:400 12px/21px var(--f-brush);font-style:normal;text-align:center;display:none}
.st.in .st__c{display:block}
.st.in .st__b{background:#FFEDB0}
[data-view=list] .strips{display:grid;grid-template-columns:1fr 1fr;gap:0 28px;background:var(--paper);padding:10px 18px}
[data-view=list] .strips::before{display:none}
[data-view=list] .st{width:auto;transform:none}
[data-view=list] .st::before{display:none}
[data-view=list] .st__b{display:grid;grid-template-columns:auto 1fr auto;align-items:baseline;column-gap:0;height:auto;padding:9px 34px 9px 4px;text-align:left;background:none;box-shadow:none;clip-path:none;border-bottom:2px dotted var(--line)}
[data-view=list] .st__b:hover{background:rgba(235,170,44,.14)}
[data-view=list] .st.in .st__b{background:rgba(235,170,44,.22)}
[data-view=list] .st__n{writing-mode:horizontal-tb;font-family:var(--f-body);font-weight:800;font-size:16px;line-height:1.5;white-space:normal;display:block;grid-column:2;grid-row:1;margin:0}
[data-view=list] .st__p{grid-column:3;grid-row:1;margin:0 0 0 10px;font-size:17px}
[data-view=list] .st__m{position:static;writing-mode:horizontal-tb;display:inline-block;grid-column:1;grid-row:1;width:max-content;padding:2px 6px;margin-right:8px;font-size:11px;align-self:center}
[data-view=list] .st__d{display:block;grid-column:1/-1;grid-row:2;font-size:13px;line-height:1.55;color:var(--ink2)}
[data-view=list] .st__c{right:4px;top:10px}
.big-t [data-view=list] .st__n{font-size:20px}
.big-t [data-view=list] .st__p{font-size:21px}
.big-t [data-view=list] .st__d{font-size:15.5px}
.big-t .st__n{font-size:27px}
@media (max-width:640px){
  .strips{gap:20px 6px;padding:24px 6px 16px}
  .st{width:calc(25% - 5px);min-width:64px}
  .st__b{height:252px}
  .st__n{font-size:19px}
  .st__p{font-size:14px}
  [data-view=list] .strips{grid-template-columns:1fr;padding:6px 12px}
}
/* tally slip */
.tk{position:fixed;left:18px;bottom:18px;z-index:45;width:min(330px,calc(100vw - 96px));background:var(--paper) url(../img/tx-paper.webp);border:2.5px solid var(--ink);border-radius:13px;box-shadow:0 5px 0 var(--ink);overflow:hidden}
.tk.has{border-color:var(--red2)}
.tk__head{display:flex;justify-content:space-between;align-items:center;gap:8px;width:100%;padding:7px 14px;background:var(--ink);color:var(--paper);line-height:1.4}
.tk__h{font-family:var(--f-brush);font-size:16px;white-space:nowrap}
.tk__sum{font-size:13px;font-weight:700;white-space:nowrap}
.tk__sum b{font:400 18px var(--f-brush);color:#FBE29A;padding:0 1px}
.tk__body{padding:8px 14px 11px;max-height:50vh;overflow:auto}
.tk__list li{display:grid;grid-template-columns:1fr auto auto;gap:8px;align-items:center;padding:4px 0;border-bottom:1.5px dashed var(--line);font-size:13.5px;line-height:1.4}
.tk__st{display:flex;align-items:center;gap:5px}
.tk__st button{width:23px;height:23px;border-radius:50%;border:2px solid var(--ink);font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center;font-size:13px}
.tk__p{font:400 13.5px var(--f-brush);min-width:52px;text-align:right}
.tk__say{font-family:var(--f-hand);font-size:14.5px;line-height:1.5;margin-top:8px;color:var(--red2)}
.tk__row{display:flex;justify-content:space-between;gap:8px;margin-top:6px;font-size:12.5px;font-weight:800}
.tk__clear{text-decoration:underline}
.tk__n{font-size:11.5px;color:var(--ink2);margin-top:4px}
@media (max-width:760px){.tk{left:8px;bottom:66px;width:calc(100vw - 16px)}.tk:not(.has){display:none}}

/* ---------- course ---------- */
.evb{display:grid;grid-template-columns:1fr 1.05fr;gap:clamp(20px,4vw,50px);align-items:center;padding:6px 0 10px}
.evb__ph{aspect-ratio:3/2;border:2.5px solid var(--ink);border-radius:12px;overflow:hidden;box-shadow:0 6px 0 var(--ink);transform:rotate(-1deg)}
.evb__ph img{width:100%;height:100%;object-fit:cover;object-position:60% 30%}
.evb__h{font-family:var(--f-brush);font-weight:400;font-size:clamp(28px,3.6vw,44px);line-height:1.3;color:var(--red2);margin-bottom:8px}
.evb__left{font-weight:700;margin-top:8px}
.evb__left b{font:400 1.5em var(--f-brush);color:var(--red2)}
.evb__say{display:inline-block;font-family:var(--f-hand);font-size:17px;margin-top:8px;padding-bottom:6px;background:url(../il/ul-m.svg) 0 100%/100% 9px no-repeat}
.crs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,30px);padding:50px 0 10px}
.cr{display:flex;flex-direction:column;background:var(--paper);border:2.5px solid var(--ink);border-radius:15px;box-shadow:0 7px 0 var(--ink);overflow:hidden}
.cr__ph{position:relative;aspect-ratio:4/3;overflow:hidden;border-bottom:2.5px solid var(--ink)}
.cr__ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.cr:hover .cr__ph img{transform:scale(1.05)}
.cr__tag{position:absolute;right:10px;top:10px;background:var(--mus);border:2.5px solid var(--ink);border-radius:9px;padding:0 10px;font-family:var(--f-brush);font-size:15px;line-height:1.6;transform:rotate(3deg)}
.cr__b{padding:14px 18px 18px;display:flex;flex-direction:column;flex:1}
.cr__n{font-family:var(--f-brush);font-weight:400;font-size:26px;line-height:1.3}
.cr__p{font-size:13px;font-weight:700;line-height:1.5}
.cr__p b{font:400 34px/1.2 var(--f-brush);color:var(--red2)}
.cr__p small{display:block;font-size:12.5px}
.cr__l{margin:10px 0;font-size:14.5px;line-height:1.7;flex:1}
.cr__l li{padding-left:1em;text-indent:-1em;border-bottom:1.5px dashed var(--line)}
.cr__l li::before{content:"・"}
.cr__say{font-family:var(--f-hand);font-size:15.5px;margin-bottom:10px}
@media (max-width:900px){.evb{grid-template-columns:1fr}.crs{grid-template-columns:1fr}.cr{flex-direction:row;flex-wrap:wrap}.cr__ph{flex:1 0 100%}}
.sim{margin-top:50px;padding:30px clamp(16px,3vw,40px) 34px;background:var(--ind) url(../img/tx-indigo.webp);border-radius:18px;color:var(--paper);border:2.5px solid var(--ink);box-shadow:0 7px 0 var(--ink)}
.sim__ti h2{font-family:var(--f-brush);font-weight:400;font-size:clamp(23px,2.8vw,32px);line-height:1.35}
.sim__ti p{font-size:14.5px}
.sim__g{display:grid;grid-template-columns:1.12fr 1fr;gap:clamp(18px,3vw,36px);margin-top:14px}
.sim__f{border:0;padding:0;margin:0 0 14px}
.sim__f legend,.sim__f .lg{font-weight:800;font-size:14.5px;padding:0;margin-bottom:5px}
.sim__f label{display:inline-block;margin:0 6px 6px 0;cursor:pointer}
.sim__f input[type=radio]{position:absolute;opacity:0}
.sim__f label span{display:block;padding:5px 15px;border-radius:12px;background:rgba(255,255,255,.1);border:2px solid var(--paper);font-weight:800;line-height:1.35;text-align:center}
.sim__f label small{display:block;font-weight:700;font-size:12px}
.sim__f input:checked+span{background:var(--mus);color:var(--ink)}
.sim__f input:focus-visible+span{outline:3px solid #fff;outline-offset:2px}
.stp{display:flex;align-items:center;gap:8px}
.stp button{width:44px;height:44px;border-radius:50%;border:2.5px solid currentColor;font-size:22px;font-weight:800;line-height:1;display:flex;align-items:center;justify-content:center}
.stp output{font:400 38px/1 var(--f-brush);min-width:1.4em;text-align:center}
.sim input[type=range]{width:100%;margin-top:8px;accent-color:var(--mus)}
.slip{position:relative;background:var(--paper);color:var(--ink);padding:16px 20px 16px;border-radius:5px;box-shadow:0 8px 16px -6px rgba(0,0,0,.5);transform:rotate(.6deg)}
.slip__h{font-family:var(--f-brush);font-size:19px;border-bottom:3px double var(--ink);padding-bottom:2px;margin-bottom:5px}
.slip__l>div{display:flex;justify-content:space-between;gap:10px;font-size:14.5px;border-bottom:1.5px dashed var(--line);padding:3px 0}
.slip__l dt{font-weight:800}
.slip__t{text-align:right;font-weight:800;margin-top:5px}
.slip__t b{font:400 36px/1.2 var(--f-brush);color:var(--red2)}
.slip__say{font-family:var(--f-hand);font-size:15px;line-height:1.5;margin-bottom:10px}
.slip .btn{width:100%}
.slip__n{font-size:11.5px;color:var(--ink2);margin-top:8px}
@media (max-width:760px){.sim__g{grid-template-columns:1fr}}
.seat{padding-top:58px}
.seat__h{font-family:var(--f-brush);font-weight:400;font-size:clamp(25px,3vw,34px);line-height:1.3;text-align:center;margin-bottom:22px}
.seat__g{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(14px,2.4vw,28px)}
.st2__ph{display:block;aspect-ratio:4/3;overflow:hidden;border:2.5px solid var(--ink);border-radius:12px;box-shadow:0 5px 0 var(--ink)}
.st2__ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.st2:hover img{transform:scale(1.05)}
.st2 figcaption{margin-top:10px;font-size:14.5px;line-height:1.65}
.st2 figcaption b{display:block;font-family:var(--f-brush);font-weight:400;font-size:21px;line-height:1.3}
@media (max-width:760px){.seat__g{grid-template-columns:1fr}}

/* ---------- shops ---------- */
.sf{margin-bottom:22px;display:flex;flex-direction:column;gap:9px;align-items:center}
.sf__row{display:flex;flex-wrap:wrap;gap:7px;justify-content:center}
.ck{cursor:pointer}
.ck input{position:absolute;opacity:0}
.ck span{display:block;padding:3px 13px 3px 31px;position:relative;font-size:14px;font-weight:700;border:2px solid var(--ink);border-radius:9px;background:var(--paper);line-height:1.6}
.ck span::before{content:"";position:absolute;left:8px;top:50%;width:15px;height:15px;margin-top:-7.5px;border:2px solid var(--ink);border-radius:4px;background:#fff}
.ck input:checked+span{background:#FFEDB0}
.ck input:checked+span::before{background:var(--red)}
.ck input:checked+span::after{content:"";position:absolute;left:13px;top:50%;width:5px;height:9px;margin-top:-7px;border:solid #fff;border-width:0 2.5px 2.5px 0;transform:rotate(45deg)}
.ck input:focus-visible+span{outline:3px solid var(--red);outline-offset:2px}
.sf__c{font-weight:700}
.sf__c b{font:400 24px var(--f-brush);color:var(--red2)}
.sh{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(16px,2.4vw,28px)}
.sc{display:flex;flex-direction:column;background:var(--paper);border:2.5px solid var(--ink);border-radius:15px;box-shadow:0 6px 0 var(--ink);overflow:hidden}
.sc__ph{position:relative;aspect-ratio:3/2;overflow:hidden;border-bottom:2.5px solid var(--ink);background:var(--line)}
.sc__ph img{width:100%;height:100%;object-fit:cover;transition:transform .7s}
.sc:hover .sc__ph img{transform:scale(1.05)}
.sc__st{position:absolute;left:8px;top:8px;display:inline-flex;align-items:center;gap:7px;background:var(--ink);color:var(--paper);border-radius:99px;padding:2px 12px;font-weight:800;font-size:12.5px;line-height:1.6}
.sc__st .dotlive{margin:0;box-shadow:none}
.sc__b{padding:11px 16px 15px;display:flex;flex-direction:column;flex:1}
.sc__a{font-size:12.5px;font-weight:800;color:var(--red2);line-height:1.3}
.sc__n{font-family:var(--f-brush);font-weight:400;font-size:23px;line-height:1.3;margin-bottom:5px}
.sc__d>div{display:flex;gap:9px;font-size:13.5px;line-height:1.6;border-bottom:1.5px dashed var(--line);padding:2px 0}
.sc__d dt{font-weight:800;width:2.6em;flex:none}
.sc__t{display:flex;flex-wrap:wrap;gap:4px;margin:8px 0;flex:1;align-content:flex-start}
.sc__t li{font-size:11.5px;font-weight:800;border:1.5px solid var(--ink);border-radius:99px;padding:0 8px;line-height:1.65}
.sc__btn{display:flex;flex-wrap:wrap;gap:6px}
.sc__btn .btn{min-height:38px;padding:0 14px;font-size:13px;box-shadow:0 3px 0 var(--ink);flex:1 1 auto}
.sh__none{text-align:center;font-weight:700;padding:30px 0}
.sh__none img{width:90px;margin:8px auto 0}
@media (max-width:960px){.sh{grid-template-columns:1fr 1fr}}
@media (max-width:620px){.sh{grid-template-columns:1fr}}

/* ---------- take out ---------- */
.tw{display:grid;grid-template-columns:1fr 1fr;gap:clamp(16px,2.6vw,32px);padding-top:6px}
.twc{display:flex;flex-direction:column;background:var(--paper);border:2.5px solid var(--ink);border-radius:15px;box-shadow:0 6px 0 var(--ink);overflow:hidden}
.twc__ph{aspect-ratio:16/8;overflow:hidden;border-bottom:2.5px solid var(--ink)}
.twc__ph img{width:100%;height:100%;object-fit:cover}
.twc__b{padding:12px 20px 16px}
.twc h2{display:flex;align-items:center;gap:10px;font-family:var(--f-brush);font-weight:400;font-size:25px;line-height:1.3;margin-bottom:4px}
.twc h2 img{height:44px;width:auto}
.twc p{font-size:15px;line-height:1.75}
.twc__live{display:flex;gap:8px;font-weight:800;font-size:14px;margin-top:5px}
.twc__live .dotlive{box-shadow:0 0 0 3px rgba(35,24,21,.1)}
.twc__n{font-size:13px;color:var(--ink2);margin-top:3px}
@media (max-width:700px){.tw{grid-template-columns:1fr}}
.ord{padding-top:50px}
.ord__h h2{font-family:var(--f-brush);font-weight:400;font-size:clamp(25px,3.2vw,38px);line-height:1.3}
.ord__h p{font-size:15px;margin:6px 0 12px;max-width:760px}
.ord__g{display:grid;grid-template-columns:1.62fr 1fr;gap:clamp(16px,2.6vw,30px);align-items:start}
.ord__f{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:14px}
.tcs{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(10px,1.6vw,18px)}
.tc{position:relative;display:grid;grid-template-columns:1fr auto;column-gap:6px;align-items:baseline;background:var(--paper);border:2.5px solid var(--ink);border-radius:13px;padding:0 0 9px;overflow:hidden;box-shadow:0 4px 0 var(--ink);transition:background .2s}
.tc[hidden]{display:none}
.tc.has{background:#FFEDB0}
.tc img{grid-column:1/-1;width:100%;aspect-ratio:4/3;object-fit:cover;border-bottom:2.5px solid var(--ink);margin-bottom:7px}
.tc__m{position:absolute;left:7px;top:7px;font-style:normal;background:var(--red);color:#fff;border-radius:6px;padding:0 7px;font-size:11.5px;font-weight:800;line-height:1.7;z-index:1}
.tc__n{grid-column:1/-1;font-weight:800;font-size:14.5px;line-height:1.4;padding:0 10px}
.tc__d{grid-column:1/-1;font-size:12px;line-height:1.5;color:var(--ink2);padding:2px 10px 5px;min-height:3.4em}
.tc__p{padding-left:10px;font:400 19px/1.2 var(--f-brush);color:var(--red2)}
.tc__p i{font:800 11px var(--f-body);font-style:normal;margin-left:1px}
.tc__s{display:flex;align-items:center;gap:5px;padding-right:9px}
.tc__s button{width:32px;height:32px;border-radius:50%;border:2.5px solid var(--ink);font-weight:800;font-size:16px;line-height:1;display:flex;align-items:center;justify-content:center;background:var(--paper);box-shadow:0 2px 0 var(--ink);transition:transform .1s,box-shadow .1s}
.tc__s button:active{transform:translateY(2px);box-shadow:none}
.tc__s .p{background:var(--red);color:#fff}
.tc__s .n{font:400 16px var(--f-brush);min-width:1em;text-align:center}
.pk{position:sticky;top:calc(var(--hh) + 12px);background:var(--paper);border:2.5px solid var(--ink);border-radius:16px;box-shadow:0 6px 0 var(--ink);padding:12px 16px 14px;max-height:calc(100vh - var(--hh) - 26px);overflow:auto}
.pk__mode{display:flex;margin-bottom:9px}
.pk__mode button{flex:1}
/* a wooden box seen from above */
.obx{position:relative;padding:12px;border-radius:7px;background:#B98A52 url(../img/tx-wood.webp) center/800px 100%;box-shadow:0 0 0 2.5px var(--ink),inset 0 0 0 1px rgba(255,255,255,.2)}
.obx__tier{display:grid;grid-template-columns:repeat(3,1fr);gap:5px}
.obx__c{aspect-ratio:1;background:#6E4A26;border-radius:3px;overflow:hidden;box-shadow:inset 0 2px 5px rgba(0,0,0,.5);position:relative}
.obx__c img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.obx__emp{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;font-family:var(--f-hand);color:var(--paper);font-size:15px;line-height:1.3;text-shadow:0 1px 3px #000;pointer-events:none}
.obx__emp[hidden]{display:none}
.obx__emp img{width:52px;filter:drop-shadow(0 2px 2px rgba(0,0,0,.4))}
.pk__tier{font-family:var(--f-hand);font-size:14.5px;color:var(--red2);text-align:center;margin-top:5px;line-height:1.4}
.pk__l{margin-top:7px}
.pk__l li{display:grid;grid-template-columns:1fr auto auto;gap:8px;font-size:13.5px;line-height:1.5;padding:3px 0;border-bottom:1.5px dashed var(--line)}
.pk__l b{font-weight:700}
.pk__l i{font:400 13.5px var(--f-brush)}
.pk__s>div{display:flex;justify-content:flex-end;align-items:baseline;gap:9px;font-weight:800;font-size:13.5px;margin-top:3px}
.pk__s dt{white-space:nowrap}
.pk__s .tot{border-top:3px double var(--ink);margin-top:5px;padding-top:2px}
.pk__s .tot b{font:400 31px/1.2 var(--f-brush);color:var(--red2)}
.pk__hint{font-family:var(--f-hand);font-size:14.5px;line-height:1.5;min-height:1.5em;color:var(--leaf2)}
.pk .field{margin-top:4px;font-size:13.5px}
.pk .field select{padding:6px 10px}
.pk__go{width:100%;margin-top:9px}
.pk__go:disabled{opacity:.46;cursor:not-allowed;transform:none}
.pk__n{font-size:12px;text-align:center;margin-top:6px;color:var(--ink2)}
.pkm{display:none}
@media (max-width:900px){
  .ord__g{grid-template-columns:1fr}
  .tcs{grid-template-columns:1fr 1fr}
  .pk{position:relative;top:0;max-height:none}
  .pkm{position:fixed;left:8px;right:8px;bottom:18px;z-index:46;display:flex;align-items:center;justify-content:space-between;gap:10px;min-height:48px;padding:0 16px;background:var(--ink);color:var(--paper);border-radius:12px;text-decoration:none;font-weight:800;font-size:14px;box-shadow:0 5px 0 rgba(35,24,21,.35)}
  .pkm__t{white-space:nowrap}
  .pkm__t::after{content:"";display:inline-block;width:8px;height:12px;margin-left:8px;background:url(../il/chev.svg) center/contain no-repeat}
  .pkm__s{white-space:nowrap;font-size:13px}
  .pkm__s b{font:400 18px var(--f-brush);color:#FBE29A}
}
@media (max-width:760px){.pkm{bottom:66px}}
@media (max-width:560px){
  .tc__p{grid-column:1/-1}
  .tc__s{grid-column:1/-1;justify-content:flex-end;padding:3px 9px 0}
}
.slipd{width:min(460px,94vw)}
.ticket{position:relative;background:#FFFEFA;padding:18px 20px 16px;border:2px dashed var(--line);border-radius:5px;font-size:14.5px;line-height:1.7}
.ticket__h{font-family:var(--f-brush);font-size:22px;line-height:1.3;border-bottom:3px double var(--ink);padding-bottom:3px;margin-bottom:6px}
.ticket__d{font-weight:800}
.ticket__l li{display:flex;justify-content:space-between;gap:12px;border-bottom:1.5px dashed var(--line)}
.ticket__l b{font-family:var(--f-brush);font-weight:400;white-space:nowrap}
.ticket__t{text-align:right;font-weight:800;margin-top:4px}
.ticket__t b{font:400 32px/1.2 var(--f-brush);color:var(--red2)}
.ticket__r{display:flex;justify-content:space-between;font-weight:800}
.ticket__n{font-size:12.5px;color:var(--ink2);margin-top:8px}
.ticket__stamp{position:absolute;right:16px;bottom:38px;width:66px;height:66px;border:3.5px solid var(--red);border-radius:50%;display:flex;align-items:center;justify-content:center;color:var(--red);font:400 20px var(--f-brush);transform:rotate(-14deg);opacity:.88}
.ticket--live{position:sticky;top:calc(var(--hh) + 14px);border:2.5px solid var(--ink);box-shadow:0 6px 0 var(--ink);border-radius:12px;background:var(--paper)}
.ticket--live dl>div{display:flex;gap:10px;border-bottom:1.5px dashed var(--line);padding:3px 0}
.ticket--live dt{font-weight:800;width:3.4em;flex:none}
.ticket__say{font-family:var(--f-hand);font-size:15px;line-height:1.5;margin:9px 0;color:var(--red2)}
.ticket--live .btn{width:100%}
.ticket--live .btn:disabled{opacity:.46;cursor:not-allowed;transform:none}
.ticket--live .ticket__stamp{bottom:auto;top:12px;right:14px;width:58px;height:58px;font-size:18px}
.res__tan{width:86px;margin:0 auto 8px}

/* ---------- reservation ---------- */
.rs{display:grid;grid-template-columns:1.5fr 1fr;gap:clamp(18px,3vw,36px);align-items:start;padding-top:8px}
.rsb{background:var(--paper);border:2.5px solid var(--ink);border-radius:15px;box-shadow:0 5px 0 var(--ink);padding:13px 20px 18px;margin-bottom:18px}
.rsb h2{display:flex;align-items:center;gap:9px;font-family:var(--f-brush);font-weight:400;font-size:21px;line-height:1.3;margin-bottom:8px}
.rsb h2 i{font-style:normal;display:flex;width:32px;height:32px;border-radius:50%;background:var(--ind);color:var(--paper);align-items:center;justify-content:center;font-size:15px}
.rsb .field{margin:0}
.cal__h{display:flex;align-items:center;justify-content:center;gap:14px;font-family:var(--f-brush);font-size:19px}
.cal__h b{font-weight:400}
.cal__h button{width:36px;height:36px;border-radius:50%;border:2.5px solid var(--ink);font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center}
.cal__h button:disabled{opacity:.3;cursor:not-allowed}
.cal__w,.cal__g{display:grid;grid-template-columns:repeat(7,1fr);gap:3px}
.cal__w{font-weight:800;font-size:12.5px;text-align:center;margin-top:7px}
.sun{color:var(--red2)}.sat{color:var(--sky2)}
.cal__d{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:50px;border:2px solid transparent;border-radius:9px;line-height:1.15;background:rgba(235,170,44,.1);transition:background .15s}
.cal__d b{font:400 16px var(--f-brush)}
.cal__d i{font-style:normal;font-size:12px;font-weight:800}
button.cal__d:hover:not(:disabled){background:#FFEDB0}
.cal__d.on{background:var(--red)!important;color:#fff!important}
.cal__d.is-today{border-color:var(--ink)}
.cal__d.is-off,.cal__d.is-full{opacity:.34;cursor:not-allowed;background:none}
.cal__d.is-pad{background:none}
.cal__k{display:flex;gap:14px;justify-content:center;font-size:12.5px;font-weight:700;margin-top:6px}
.tms{display:flex;flex-wrap:wrap;gap:6px}
.tm{min-width:68px;min-height:40px;padding:2px 8px;border:2.5px solid var(--ink);border-radius:9px;background:var(--paper);font:400 15px var(--f-brush);line-height:1.15;transition:background .15s}
.tm:hover:not(:disabled){background:#FFEDB0}
.tm.on{background:var(--red);color:#fff}
.tm:disabled{opacity:.34;cursor:not-allowed}
.tm small{display:block;font:800 10px var(--f-body)}
.rsS{display:flex;flex-wrap:wrap;gap:7px}
.rsS label{cursor:pointer}
.rsS input{position:absolute;opacity:0}
.rsS span{display:block;padding:4px 16px;border:2.5px solid var(--ink);border-radius:999px;font-weight:800;background:var(--paper)}
.rsS input:checked+span{background:var(--ind);color:var(--paper)}
.rsS input:focus-visible+span{outline:3px solid var(--red);outline-offset:2px}
@media (max-width:860px){.rs{grid-template-columns:1fr}.ticket--live{position:relative;top:0}}