/* P4 only. Default is readable linear flow; JS opts into measured native sticky. */
.yokocho-ramen .yk-header{position:fixed;inset:0 0 auto}
.admin-bar.yokocho-ramen .yk-header{top:var(--yk-shell-admin-offset,32px)}
.ykr-page{background:var(--yk-ink);overflow-wrap:normal}
.ykr-page section{position:relative;isolation:isolate}
.ykr-page img,.ykr-page video{display:block;width:100%;height:100%;object-fit:cover}
.ykr-page h1,.ykr-page h2{color:white;text-transform:uppercase;font-weight:400;letter-spacing:-.045em;margin:0 0 32px;line-height:1}
.ykr-page h1 span,.ykr-page h2 span{display:block}
.ykr-page h2{font:400 36px/1 var(--yk-extended);letter-spacing:-.045em}
.ykr-prose{font:400 16px/1.6 var(--yk-body);letter-spacing:-.02em}
.ykr-prose p{margin:0 0 25.6px}
.ykr-prose p:last-child{margin-bottom:0}
.ykr-hero{min-height:100svh;display:flex;align-items:center;overflow:hidden}
.ykr-hero-image{position:absolute;inset:0}
.ykr-hero:after{content:'';position:absolute;inset:0;z-index:1;pointer-events:none;background:linear-gradient(0deg,var(--yk-ink),transparent 22%),linear-gradient(90deg,var(--yk-ink),#11362ad9 27%,transparent 65%)}
.ykr-hero-copy{width:52.56%;padding:0 41px;position:relative;z-index:2}
.ykr-hero-copy:before{content:'';position:absolute;inset:-55px auto auto 0;width:274px;height:183px;background:url('../homepage/ramen.webp') center/contain no-repeat;z-index:-1}
.ykr-hero h1{font:400 67px/.8 var(--yk-extended);letter-spacing:-.06em;margin-bottom:30px}
.ykr-hero h1 span:first-child{font:400 44px/.8 var(--yk-wide)}
.ykr-hero h1 span+span{margin-top:5px}
.ykr-hero .yk-eyebrow{line-height:.8;letter-spacing:.36em;margin-bottom:30px}
.ykr-hero .ykr-prose{width:80%;max-width:none}
.ykr-intro-stage{position:relative;overflow:hidden}
.ykr-film-track,.ykr-film-stage,.ykr-banner-track{display:contents}
.ykr-video-layer{height:75svh;min-height:420px;position:relative;background:var(--yk-ink)}
.ykr-video-layer:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,var(--yk-ink),transparent 35%)}
.ykr-varieties{position:absolute;bottom:30px;left:20px;right:20px;text-align:center;z-index:1;font:400 clamp(12px,1.8vw,26px)/1.3 var(--yk-extended);margin:0}
.ykr-intro-mask{display:none}
.ykr-bowl-layer{position:relative;min-height:100svh;display:flex;align-items:center;justify-content:center;background:var(--yk-ink)}
.ykr-bowl-background{position:absolute;inset:0}
.ykr-bowl-layer:after{content:'';position:absolute;inset:0;z-index:3;pointer-events:none;background:linear-gradient(0deg,var(--yk-ink),transparent 32%),linear-gradient(180deg,#010a0740,transparent 50%)}
.ykr-intro-copy{position:absolute;top:18%;left:10%;right:10%;text-align:center;z-index:1;overflow-wrap:anywhere}
.ykr-intro-copy h2{font-size:63px;line-height:.9;margin:0 auto 6px;max-width:900px}
.ykr-intro-copy p{display:inline;background:var(--yk-gold);color:var(--yk-ink);font:400 26px/1.4 var(--yk-extended);text-transform:uppercase;padding:3px 15px;box-decoration-break:clone;-webkit-box-decoration-break:clone}
.ykr-bowl-layer .ykr-bowl{position:absolute;z-index:2;bottom:0;left:50%;transform:translateX(-50%);width:min(900px,85%);height:auto;object-fit:contain}
.ykr-signatures{background:linear-gradient(var(--yk-ink),var(--yk-green) 50%,var(--yk-ink));padding:20px}
.ykr-signatures:before{content:'';position:absolute;inset:0 0 auto;height:clamp(100px,20svh,220px);background:linear-gradient(var(--yk-ink),transparent);pointer-events:none;z-index:5}
.ykr-photo-track,.ykr-progress{display:none}
.ykr-signature{margin:0 0 70px;scroll-margin-top:150px}
.ykr-inline-photo{height:75svh;min-height:380px;max-height:900px;border-radius:42px;overflow:hidden}
.ykr-signature-text{padding:45px 25px;max-width:620px;margin:auto}
.ykr-signature h2{font-size:26px;margin-bottom:20px}
.ykr-jp{font-size:28px;font-weight:700;color:var(--yk-gold);margin:0 0 15px}
.ykr-mosaic{padding:20px;background:radial-gradient(ellipse at center,var(--yk-green),var(--yk-ink) 80%)}
.ykr-mosaic:after{content:'';position:absolute;inset:0;pointer-events:none;z-index:2;background:linear-gradient(90deg,var(--yk-ink),transparent 6%,transparent 94%,var(--yk-ink))}
.ykr-page .yk-bento-tile{position:relative;overflow:hidden;border-radius:24px;background:var(--yk-deep)}
.ykr-page .ykh-caption{position:absolute;bottom:0;inset-inline:0;margin:0;padding:35px 20px 15px;background:linear-gradient(transparent,#010a07dd);font-size:14px;z-index:2}
.ykr-made{display:grid;grid-template-columns:1fr 1fr;min-height:100svh;padding:0 20px;background:linear-gradient(var(--yk-green),var(--yk-ink))}
.ykr-made-photo{position:relative;min-height:0;border-radius:24px 0 0 24px;overflow:hidden}
.ykr-made-photo img{position:absolute;inset:0}
.ykr-made-photo:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(0deg,var(--yk-ink),transparent 30%),linear-gradient(90deg,var(--yk-ink),transparent 10%)}
.ykr-made-copy{position:relative;align-self:center;padding:90px 34px 160px;z-index:1}
.ykr-made-copy:after{content:'';position:absolute;z-index:-1;bottom:60px;right:5%;width:80%;height:300px;background:url('../homepage/chef.webp') center/contain no-repeat;pointer-events:none}
.ykr-made .yk-button{margin-top:36px;min-height:32px;padding:8px 30px}
.ykr-closing{position:relative;height:auto;aspect-ratio:1672/790;overflow:hidden}
.ykr-closing:after{content:'';position:absolute;inset:0;pointer-events:none;background:linear-gradient(180deg,var(--yk-ink),transparent 18%,transparent 65%,var(--yk-ink))}
.yokocho-ramen .yk-footer{background:var(--yk-ink)}
.ykr-page .ykh-video-toggle{position:absolute;z-index:5;bottom:70px;right:24px;width:44px;height:44px;border:1px solid white;border-radius:50%;background:#010a07cc;color:white;cursor:pointer;opacity:0}
.ykr-page .ykh-video-toggle:focus-visible,.ykr-page .ykh-video-toggle:hover{opacity:1}
.ykr-page video[controls]+noscript+.ykh-video-toggle{opacity:1}
.ykr-viewport-probe{position:absolute;width:0;height:100svh;visibility:hidden;pointer-events:none}
.ykr-intro.ykr-motion{height:var(--ykr-scene-height,300svh)}
.ykr-motion .ykr-intro-stage{height:var(--ykr-stage-height,100svh);position:sticky;top:var(--ykr-sticky-top,0px)}
.ykr-motion .ykr-video-layer{position:absolute;inset:0;height:100%;min-height:0}
.ykr-motion .ykr-intro-mask{display:block;position:absolute;inset:0;z-index:3;background:var(--yk-ink);transform:translateY(var(--ykr-mask-y,0px));-webkit-mask-image:linear-gradient(#fff 0 0),var(--ykr-mask-image,url('../ramen/intro-mask.svg'));mask-image:linear-gradient(#fff 0 0),var(--ykr-mask-image,url('../ramen/intro-mask.svg'));-webkit-mask-repeat:no-repeat;mask-repeat:no-repeat;-webkit-mask-position:0 0,50% 50%;mask-position:0 0,50% 50%;-webkit-mask-size:100% 100%,var(--ykr-mask-size,65% 76%);mask-size:100% 100%,var(--ykr-mask-size,65% 76%);-webkit-mask-composite:xor;mask-composite:exclude;mask-mode:alpha;pointer-events:none}
.ykr-motion .ykr-bowl-layer{height:100%;min-height:0;position:absolute;inset:0;z-index:4;clip-path:inset(var(--ykr-bowl-inset,100%) 0 0);pointer-events:none}
.ykr-motion .ykr-intro-copy{transform:translateY(var(--ykr-title-y,150px));opacity:var(--ykr-title-opacity,.8)}
/* A tall translation traverses in full before its contained bottom-aligned hold. */
.ykr-intro.ykr-motion.ykr-flow-banner{height:auto}
.ykr-flow-banner .ykr-intro-stage{position:static;height:auto;overflow:visible}
.ykr-flow-banner .ykr-film-track{display:block;position:relative;height:var(--ykr-film-height)}
.ykr-flow-banner .ykr-film-stage{display:block;position:sticky;top:0;height:var(--ykr-film-stage-height);overflow:hidden}
.ykr-flow-banner .ykr-banner-track{display:block;position:relative;height:var(--ykr-banner-height)}
.ykr-flow-banner .ykr-bowl-layer{position:sticky;top:var(--ykr-sticky-top);height:var(--ykr-stage-height);clip-path:none;overflow:hidden}
.ykr-signatures.ykr-sticky{display:grid;grid-template-columns:calc((100% - 66px)/2) 1fr;gap:10px;padding:0}
.ykr-sticky .ykr-photo-track{display:block;min-width:0}
.ykr-sticky .ykr-photo-stage{position:sticky;top:0;height:100svh;overflow:hidden}
.ykr-photo{position:absolute;inset:20px;border-radius:45px;overflow:hidden;opacity:var(--ykr-photo-opacity,0)}
.ykr-photo:first-child{opacity:1}
.ykr-sticky .ykr-inline-photo{display:none}
.ykr-sticky .ykr-signature{min-height:100svh;display:flex;align-items:center;margin:0;padding:140px 70px 100px 45px}
.ykr-sticky .ykr-signature-text{padding:0;width:100%;max-width:calc((100vw - 66px)/2 - 100px);margin:0}
.ykr-sticky .ykr-signature .ykr-prose{width:67%}
.ykr-signatures .ykr-progress{display:block;position:absolute;inset:0 max(12px,env(safe-area-inset-right)) 0 0;z-index:6;margin:0;padding:0;pointer-events:none}
/* A full-height containing rail lets CSS pin the links without scroll writes. */
.ykr-progress ol{display:flex;position:sticky;top:calc(50svh - 88px);width:44px;flex-direction:column;gap:0;list-style:none;margin:0 0 0 auto;padding:0;pointer-events:auto}
.ykr-progress li{margin:0;padding:0;background:none;width:auto;height:auto}
.ykr-progress a{display:flex;align-items:center;justify-content:center;width:44px;height:44px;position:relative;text-decoration:none;border-radius:8px;outline-offset:0}
.ykr-progress a:after{content:'';width:17px;height:3px;background:var(--yk-mid);box-shadow:0 0 2px var(--yk-ink)}
.ykr-progress a[aria-current]:after{width:26px;background:var(--yk-gold)}
.ykr-progress a:focus-visible{outline:2px solid var(--yk-gold);background:#010a07dd}
.ykr-progress a span{position:absolute;right:48px;max-width:min(230px,65vw);width:max-content;white-space:normal;overflow-wrap:anywhere;pointer-events:none;opacity:0;background:#010a07f2;color:white;padding:8px 12px;border-radius:5px;font:400 12px/1.4 var(--yk-body);transition:opacity .15s}
.ykr-progress a:hover span,.ykr-progress a:focus-visible span,.ykr-progress a[data-touched] span{opacity:1}
.ykr-sticky .ykr-progress{right:12px}
.ykr-sticky .ykr-progress a{height:28px}
.ykr-sticky .ykr-progress ol{top:calc(50svh - 56px)}
.ykr-signature:focus{outline:none}
.ykr-signature:focus-visible h2{text-decoration:underline;text-decoration-color:var(--yk-gold);text-underline-offset:7px}
/* Shared endpoint colour removes the seam without touching Bento geometry. */
.ykr-mosaic{background:linear-gradient(180deg,var(--yk-ink),var(--yk-green))}
.ykr-mosaic:after{mask-image:linear-gradient(#fff,transparent);-webkit-mask-image:linear-gradient(#fff,transparent)}
@media(max-width:999px){.ykr-hero-copy{width:64%;padding-inline:28px}.ykr-hero h1{font-size:50px}.ykr-hero h1 span:first-child{font-size:34px}.ykr-hero .ykr-prose{max-width:450px}.ykr-intro-copy h2{font-size:45px}.ykr-intro-copy p{font-size:18px}.ykr-made{padding:0 15px;gap:10px}.ykr-made-copy{padding:65px 20px 100px}.ykr-made h2{font-size:28px}.ykr-made-photo{min-height:800px}.ykr-sticky .ykr-signature{padding:130px 40px 80px 10px}.ykr-signature h2{font-size:22px}.ykr-sticky .ykr-progress{right:26px}}
@media(min-width:601px) and (max-height:649px){.ykr-hero-copy{padding-top:160px;padding-bottom:70px}.ykr-hero{min-height:100svh}}
@media(max-width:600px){
 .ykr-hero{min-height:0;display:block;padding-top:110px;background:radial-gradient(ellipse at left,var(--yk-green),var(--yk-ink))}
 .ykr-hero .ykr-hero-image{position:relative;height:65svh;min-height:370px;object-position:70% center;order:2}
 .ykr-hero{display:flex;flex-direction:column;align-items:stretch}
 .ykr-hero-copy{width:100%;padding:55px 24px 40px;order:1;background:linear-gradient(0deg,var(--yk-ink),transparent 45%)}
 .ykr-hero .ykr-prose{width:100%}
 .ykr-hero-copy:before{top:10px;width:220px;height:147px}
 .ykr-hero:after{inset:auto 0 0;height:65svh;background:linear-gradient(0deg,var(--yk-ink),transparent 20%,transparent 75%,var(--yk-ink))}
 .ykr-hero h1{font-size:clamp(37px,10vw,55px)}.ykr-hero h1 span:first-child{font-size:.67em}
 .ykr-page .yk-eyebrow{font-size:12px;letter-spacing:.25em;margin-bottom:26px}
 .ykr-prose{font-size:16px;line-height:1.65}.ykr-prose p{margin-bottom:25px}
 .ykr-video-layer{height:75svh;min-height:400px}.ykr-varieties{font-size:12px;line-height:1.7;bottom:30px}
 .ykr-bowl-layer{min-height:75svh;overflow:hidden}.ykr-intro-copy{top:12%;left:20px;right:20px}.ykr-intro-copy h2{font-size:clamp(28px,8vw,40px)}.ykr-intro-copy p{font-size:12px;line-height:1.8;padding:3px 8px}.ykr-bowl-layer .ykr-bowl{width:110%;max-width:none}
 .ykr-signatures{padding:20px 12px}.ykr-signature{margin-bottom:25px}.ykr-inline-photo{min-height:370px;height:75svh;border-radius:28px}.ykr-signature-text{padding:35px 12px 55px}.ykr-signature h2{font-size:clamp(19px,5.5vw,26px);line-height:1.15}.ykr-jp{font-size:27px}
 .ykr-mosaic{padding:0 12px 25px}.ykr-page .yk-bento-tile{border-radius:20px}
 .ykr-made{grid-template-columns:1fr;padding:0 12px;gap:0}.ykr-made-photo{min-height:0;height:80svh;border-radius:24px}.ykr-made-copy{padding:45px 12px 110px}.ykr-made h2{font-size:clamp(24px,7vw,32px);line-height:1.1}.ykr-made-copy:after{bottom:15px;height:220px}.ykr-made .yk-button{font-size:12px;white-space:normal;max-width:100%}
 .ykr-closing{aspect-ratio:1.25}.ykr-closing img{object-position:center}
}
@media(max-width:999px){
 .ykr-intro{--ykr-mask-size:90% 78%}
 .ykr-motion .ykr-intro-copy{top:clamp(95px,16svh,145px)}
 .ykr-motion .ykr-bowl-layer .ykr-bowl{width:min(110%,760px)}
}
@media(max-width:767px){
 .ykr-intro-copy,.ykr-motion .ykr-intro-copy{top:17svh;left:20px;right:20px}
 .ykr-bowl-layer .ykr-bowl,.ykr-motion .ykr-bowl-layer .ykr-bowl{width:min(175%,850px);max-width:none;bottom:auto;top:62%;transform:translate(-50%,-50%);mask-image:linear-gradient(#000 75%,transparent);-webkit-mask-image:linear-gradient(#000 75%,transparent)}
 .ykr-intro:not(.ykr-motion) .ykr-bowl-layer{min-height:0;flex-direction:column;padding-top:110px}
 .ykr-intro:not(.ykr-motion) .ykr-intro-copy{position:relative;inset:auto;width:calc(100% - 40px)}
 .ykr-intro:not(.ykr-motion) .ykr-bowl-layer .ykr-bowl{position:relative;inset:auto;transform:none;margin:40px 0 0;flex-shrink:0}
 .ykr-signatures{padding:0 0 35px;background:var(--yk-ink)}
 .ykr-signature{margin:0;padding:0 0 40px;background:linear-gradient(#0c3026 75%,var(--yk-ink));scroll-margin-top:100px}
 .ykr-inline-photo{position:relative;height:76svh;min-height:420px;max-height:none;border-radius:0}
 .ykr-inline-photo:after{content:'';position:absolute;inset:0;background:linear-gradient(var(--yk-ink),transparent 14%),linear-gradient(transparent 44%,#0c302680 70%,#0c3026 100%);pointer-events:none}
 .ykr-signature-text{position:relative;z-index:1;max-width:none;padding:0 60px 32px 24px;margin:-100px 0 0;background:none;overflow-wrap:anywhere}
 .ykr-signature h2{font-size:clamp(18px,5.2vw,26px);line-height:1.15;margin:0 0 24px}
 .ykr-jp{font-size:27px;margin-bottom:20px}
 .ykr-signature .ykr-prose{line-height:1.65}
 .ykr-signatures .ykr-progress{right:max(2px,env(safe-area-inset-right))}
 .ykr-progress a:after{background:#729589}
 .ykr-page .ykh-video-toggle{display:none!important}
 .ykr-page video::-webkit-media-controls{display:none!important}
}
@media(max-height:500px){
 .ykr-motion .ykr-intro-copy{top:95px}
 .ykr-intro-copy h2{font-size:clamp(25px,5vw,38px)}
 .ykr-motion .ykr-bowl-layer .ykr-bowl{width:min(75%,600px);max-height:65%;object-fit:contain}
 .ykr-signature-text{padding-right:60px}
}
@media(prefers-reduced-motion:reduce){.ykr-page *{scroll-behavior:auto!important}}