/* Approved global UX V02. Loaded only by the opt-in shell, after page styles. */
.yokocho-shell .yk-header{background:transparent!important;isolation:isolate}
.yk-header-glass{position:absolute;inset:0 0 auto;height:184px;pointer-events:none;z-index:-1}
.yk-header-glass i,.yk-header-glass>span{position:absolute;inset:0}
.yk-header-glass i:nth-child(1){backdrop-filter:blur(8.7px);-webkit-backdrop-filter:blur(8.7px);mask-image:linear-gradient(#000 0%,#000 17%,transparent 45%);-webkit-mask-image:linear-gradient(#000 0%,#000 17%,transparent 45%)}
.yk-header-glass i:nth-child(2){backdrop-filter:blur(5.4px);-webkit-backdrop-filter:blur(5.4px);mask-image:linear-gradient(transparent 7%,#000 24%,#000 37%,transparent 65%);-webkit-mask-image:linear-gradient(transparent 7%,#000 24%,#000 37%,transparent 65%)}
.yk-header-glass i:nth-child(3){backdrop-filter:blur(3px);-webkit-backdrop-filter:blur(3px);mask-image:linear-gradient(transparent 29%,#000 50%,transparent 82%);-webkit-mask-image:linear-gradient(transparent 29%,#000 50%,transparent 82%)}
.yk-header-glass i:nth-child(4){backdrop-filter:blur(.9px);-webkit-backdrop-filter:blur(.9px);mask-image:linear-gradient(transparent 55%,#000 75%,transparent);-webkit-mask-image:linear-gradient(transparent 55%,#000 75%,transparent)}
.yk-header-glass>span{background:linear-gradient(to bottom,rgba(0,8,6,.94),rgba(0,14,10,.62) 26%,rgba(0,19,13,.28) 52%,rgba(0,19,13,.06) 75%,transparent)}
.yokocho-shell .yk-languages{--yk-language-x:0%;position:relative;display:flex;align-items:center;justify-content:center;justify-self:start;width:118px;height:40px;padding:4px;gap:0;border:1px solid #f4fff86b;border-radius:24px;background:rgba(0,32,23,.26);box-shadow:inset 0 0 15px #8addb017;backdrop-filter:blur(9px);-webkit-backdrop-filter:blur(9px);font:700 12px/1 var(--yk-body);letter-spacing:.02em;isolation:isolate;touch-action:pan-y;user-select:none}
.yokocho-shell .yk-languages:has(a[aria-current][lang^="en"]){--yk-language-x:100%}
.yokocho-shell .yk-language-thumb{position:absolute;top:4px;left:4px;width:calc(50% - 4px);height:30px;border-radius:19px;background:#f6bd43;box-shadow:0 2px 8px #0008;transform:translateX(var(--yk-language-drag,var(--yk-language-x)));transition:transform .2s cubic-bezier(.22,.8,.3,1);pointer-events:none}
.yokocho-shell .yk-languages.is-dragging .yk-language-thumb{transition:none}
.yokocho-shell .yk-languages a,.yokocho-shell .yk-language-unavailable{position:relative;display:grid;place-items:center;flex:1;min-width:0;height:32px;padding:0;border-radius:20px;color:#f4f3ea;text-decoration:none;touch-action:pan-y;-webkit-user-drag:none}
.yokocho-shell .yk-languages a[aria-current]{color:#11281c;text-decoration:none}
.yokocho-shell .yk-languages.is-switching a{color:#f4f3ea}
.yokocho-shell .yk-languages.is-switching a[data-language-target]{color:#11281c}
.yk-language-unavailable{opacity:.45;cursor:not-allowed}
.yokocho-shell .yk-languages a:focus-visible{outline-offset:1px}
.yokocho-shell .yk-menu{position:static}
.yokocho-shell .yk-header-bar>.yk-languages,.yokocho-shell .yk-header-bar>.yk-brand,.yokocho-shell .yk-header-booking,.yokocho-shell .yk-menu summary{position:relative;z-index:3}
.yokocho-shell .yk-menu-icon{gap:6px}
.yokocho-shell .yk-menu-icon span{height:2px;transition:transform .3s}
.yokocho-shell .yk-menu[open] .yk-menu-icon span:first-child{transform:translateY(4px) rotate(45deg)}
.yokocho-shell .yk-menu[open] .yk-menu-icon span:last-child{opacity:1;transform:translateY(-4px) rotate(-45deg)}
.yokocho-shell .yk-menu-overlay{position:fixed;inset:var(--yk-shell-admin-offset,0px) 0 0;overflow:auto;overscroll-behavior:contain;background:#00251b;color:#f5f0e4;z-index:1;opacity:1;transition:opacity .2s ease}
.yk-menu-panel{position:relative;isolation:isolate;min-height:100%;padding:140px clamp(30px,6vw,100px) 34px;display:flex;flex-direction:column}
.yk-menu-panel:before{content:"";position:absolute;inset:0;z-index:-1;background:radial-gradient(circle at 82% 53%,#114c387a,transparent 46%),linear-gradient(120deg,#00180f,#001e16)}
.yk-menu-stage{position:relative;z-index:4;flex:1;display:flex;align-items:center;padding-block:28px}
.yk-menu-group{width:min(58%,790px)}
.yokocho-shell .yk-menu .yk-menu-nav{position:relative;inset:auto;width:100%;padding:0;margin:0;background:none;border:0;box-shadow:none;display:block}
.yokocho-shell .yk-menu .yk-menu-nav ul{list-style:none;margin:0;padding:0}
.yokocho-shell .yk-menu .yk-menu-nav li{margin:0;padding:0}
.yokocho-shell .yk-menu .yk-menu-nav a{display:block;position:relative;width:fit-content;max-width:100%;padding:4px 0;font:400 clamp(36px,5.3vw,84px)/1.1 var(--yk-display);letter-spacing:-.035em;text-transform:uppercase;text-decoration:none;color:#f5f0e4;transition:color .2s,transform .25s;overflow-wrap:anywhere}
.yokocho-shell .yk-menu .yk-menu-nav .sub-menu{padding-left:24px}
.yokocho-shell .yk-menu .yk-menu-nav .sub-menu a{font-size:clamp(22px,3vw,40px)}
.yokocho-shell .yk-menu-nav a:hover,.yokocho-shell .yk-menu-nav a:focus-visible,.yokocho-shell .yk-menu-nav a[aria-current]{color:#f6bd43}
.yokocho-shell .yk-menu-nav a:hover{transform:translateX(9px)}
.yk-menu-illustration{position:absolute;z-index:2;right:4%;top:51%;transform:translateY(-50%);width:min(38%,550px);aspect-ratio:1080/1201;pointer-events:none;isolation:isolate}
.yk-menu-illustration img{display:block;width:100%;height:100%;object-fit:contain;filter:drop-shadow(0 10px 18px #003a2290);mask-image:linear-gradient(#000 0%,#000 62%,rgba(0,0,0,.96) 70%,rgba(0,0,0,.8) 78%,rgba(0,0,0,.42) 89%,transparent);-webkit-mask-image:linear-gradient(#000 0%,#000 62%,rgba(0,0,0,.96) 70%,rgba(0,0,0,.8) 78%,rgba(0,0,0,.42) 89%,transparent)}
.yk-menu-illustration:after{content:"";position:absolute;inset:61% -3% -1%;background:linear-gradient(transparent,rgba(0,34,25,.2) 35%,#00251b);z-index:3}
.yk-menu-bottom{position:relative;z-index:6;color:#e6c98d;font:400 10px/1.8 var(--yk-body);letter-spacing:.15em;text-transform:uppercase}
.yk-menu-bottom strong{color:#f6bd43;font-size:13px;letter-spacing:.07em}
.yokocho-shell .yk-menu-booking{display:block;margin-top:32px}
.yokocho-shell .yk-menu-booking .yk-button{width:auto;min-height:48px;padding:14px 24px;background:var(--yk-gold);color:var(--yk-deep);border:1px solid var(--yk-gold);border-radius:5px;font:400 13px/1.4 var(--yk-extended);letter-spacing:.02em}
.yk-menu-steps{position:absolute;inset:0;overflow:hidden;pointer-events:none;z-index:10}
.yk-menu-steps i{position:absolute;top:0;left:0;width:20.1%;height:100%;background:#f6bd43;transform:translateY(-102%)}
.yk-menu[data-state="opening"] .yk-menu-steps i,.yk-menu[open]:not([data-state]) .yk-menu-steps i{animation:yk-menu-stairs .55s cubic-bezier(.56,.09,.25,1) forwards}
.yk-menu-steps i:nth-child(2){left:20%}.yk-menu-steps i:nth-child(3){left:40%}.yk-menu-steps i:nth-child(4){left:60%}.yk-menu-steps i:nth-child(5){left:80%}
.yk-menu[data-state="opening"] .yk-menu-steps i:nth-child(2){animation-delay:55ms}.yk-menu[data-state="opening"] .yk-menu-steps i:nth-child(3){animation-delay:110ms}.yk-menu[data-state="opening"] .yk-menu-steps i:nth-child(4){animation-delay:165ms}.yk-menu[data-state="opening"] .yk-menu-steps i:nth-child(5){animation-delay:220ms}
.yk-menu-group,.yk-menu-illustration,.yk-menu-bottom{opacity:1;transition:opacity .16s ease}
.yokocho-shell .yk-menu[data-state="closing"] .yk-menu-overlay,.yk-menu[data-state="closing"] .yk-menu-group,.yk-menu[data-state="closing"] .yk-menu-illustration,.yk-menu[data-state="closing"] .yk-menu-bottom{opacity:0}
@keyframes yk-menu-stairs{0%{transform:translateY(-102%)}52%{transform:translateY(0)}100%{transform:translateY(102%)}}
@media(max-width:760px){
 .yk-header-glass{height:165px}
 .yokocho-shell .yk-languages{width:84px;height:36px;font-size:11px;padding:3px}
 .yokocho-shell .yk-language-thumb{top:3px;left:3px;height:28px;width:calc(50% - 3px)}
 .yokocho-shell .yk-languages a,.yokocho-shell .yk-language-unavailable{height:28px}
 .yokocho-shell .yk-header-bar{padding-inline:14px;gap:0}
 .yk-menu-panel{padding:120px 23px 32px}
 .yk-menu-stage{padding-block:24px 292px}
 .yk-menu-group{width:100%}
 .yokocho-shell .yk-menu .yk-menu-nav a{font-size:clamp(25px,7.8vw,42px);padding:6px 0}
 .yokocho-shell .yk-menu-booking{margin-top:24px}
 .yk-menu-illustration{width:min(60%,230px);top:auto;bottom:60px;right:3%;transform:none;opacity:.92}
 .yk-menu-bottom{font-size:8px;letter-spacing:.1em;gap:10px}
 .yk-menu-bottom strong{font-size:12px}
 .yokocho-shell .yk-menu-booking .yk-button{font-size:11px}
}
@media(min-width:761px) and (max-height:650px){.yokocho-shell .yk-menu .yk-menu-nav a{font-size:clamp(32px,7vh,48px)}.yk-menu-illustration{width:min(32%,390px)}}
@media(max-width:360px){.yokocho-shell .yk-header-bar{padding-inline:10px}.yokocho-shell .yk-languages{width:70px}}
@media(prefers-reduced-motion:reduce){.yk-menu-steps{display:none}.yokocho-shell .yk-menu-overlay,.yk-menu-group,.yk-menu-illustration,.yk-menu-bottom,.yokocho-shell .yk-language-thumb,.yokocho-shell .yk-menu-nav a{transition:none}}

/* P3: an opaque header joins the sticky category bar without showing content
   through the glass. The gradient ends in the bar's own background colour. */
body.page-template-yokocho-menu.yokocho-shell .yk-header{background:linear-gradient(var(--yk-ink),var(--yk-deep))!important}
body.page-template-yokocho-menu .yk-header-glass{display:none}
body.page-template-yokocho-menu .ykm-tabs{padding-top:0}

@media(max-width:760px){
 .yk-menu-panel{padding-bottom:0}
 .yk-menu-stage{padding-block:24px calc(108px + env(safe-area-inset-bottom))}
 .yk-menu-illustration{position:fixed;z-index:2;top:auto;right:-2%;bottom:calc(82px + env(safe-area-inset-bottom));width:min(82vw,330px);max-width:330px;transform:none;opacity:.42}
 .yk-menu-bottom{position:fixed;inset:auto 0 0;z-index:6;min-height:78px;padding:12px 23px max(12px,env(safe-area-inset-bottom));box-shadow:0 -12px 28px rgba(0,0,0,.2);font-size:9px;letter-spacing:.08em}
}
@media(max-width:760px) and (max-height:520px){
 .yokocho-shell .yk-menu .yk-menu-nav a{padding-block:4px}
 .yokocho-shell .yk-menu-booking{margin-top:12px}
}

/* Reveal menu content during the existing opening only. */
@media (prefers-reduced-motion:no-preference){
 .yk-menu[data-state="opening"] .yk-menu-group{animation:yk-menu-reveal-links .8s linear both}
 .yk-menu[data-state="opening"] .yk-menu-illustration,.yk-menu[data-state="opening"] .yk-menu-bottom{animation:yk-menu-reveal-art .8s linear both}
}
@keyframes yk-menu-reveal-links{0%,50%{opacity:0}75%,100%{opacity:1}}
@keyframes yk-menu-reveal-art{0%,65%{opacity:0}96%,100%{opacity:var(--yk-menu-art-opacity,1)}}
@media(max-width:760px){.yk-menu-illustration{--yk-menu-art-opacity:.42}}

/* Keep approved contrast when blur is unavailable or transparency is reduced. */
@media(prefers-reduced-transparency:reduce){.yk-header-glass i{backdrop-filter:none;-webkit-backdrop-filter:none}}
