html,body,div,span,applet,object,iframe,h1,h2,h3,h4,h5,h6,p,blockquote,pre,a,abbr,acronym,address,big,cite,code,del,dfn,em,img,ins,kbd,q,s,samp,small,strike,strong,sub,sup,tt,var,b,u,i,center,dl,dt,dd,ol,ul,li,fieldset,form,label,legend,table,caption,tbody,tfoot,thead,tr,th,td,article,aside,canvas,details,embed,figure,figcaption,footer,header,hgroup,menu,nav,output,ruby,section,summary,time,mark,audio,video{margin:0;padding:0;border:0;font-size:100%;font:inherit;vertical-align:baseline}article,aside,details,figcaption,figure,footer,header,hgroup,menu,nav,section{display:block}body{line-height:1}ol,ul{list-style:none}blockquote,q{quotes:none}blockquote:before,blockquote:after,q:before,q:after{content:"";content:none}table{border-collapse:collapse;border-spacing:0}html{font-size:calc(100vw / 1920 * 10);--header-height: 8.4rem;--gap: 2.8rem;--soft: #f9ecdf;--color: #5d3136;--black: #010101;--white: white;--serif: "Space Grotesk", sans-serif;--sans: "Pathway Gothic One", sans-serif}body{width:100vw;height:100vh;margin:0;padding:0;overflow:hidden;font-family:var(--serif);background:#f2e7b7}*{line-height:100%;box-sizing:border-box}button{border:none;background:transparent}.title-start{color:var(--color);font-family:var(--sans);font-size:6rem;left:50%;letter-spacing:.2rem;line-height:1.2;position:absolute;text-align:center;text-transform:uppercase;top:50%;transform:translate(-50%,-50%);z-index:1}canvas#sketch{position:fixed;left:0;top:0;width:100vw;height:100vh;z-index:1;pointer-events:none}ul.fruit_list{position:fixed;z-index:3;display:flex;justify-content:center;align-items:center;left:50vw;top:50vh;transform:translate(-50%,-50%);bottom:10vh;gap:.8vw}li.fruit{-webkit-backdrop-filter:blur(1vw);backdrop-filter:blur(1vw);background-color:#0000000d;border-radius:.6vw;border:2px solid white;box-sizing:border-box;cursor:pointer;padding:1vw;width:7vw;transition:all .2s ease-out}li.fruit:hover{background-color:#ffffffbf;scale:1.15}li.fruit img{width:100%;object-fit:contain;transition:all .2s ease-out}li.fruit:nth-child(1){border-color:#d94827}li.fruit:nth-child(2){border-color:#a7a87a}li.fruit:nth-child(3){border-color:#e3ac42}li.fruit:nth-child(4){border-color:#c85abd}li.fruit:nth-child(5){border-color:#ef4364}li.fruit:nth-child(6){border-color:#9fa342}li.fruit:nth-child(7){border-color:#ff8f4b}li.fruit:nth-child(8){border-color:#e8be48}li.fruit:nth-child(9){border-color:#e7b097}li.fruit:nth-child(10){border-color:#ec838b}li.fruit:nth-child(11){border-color:#ef4e76}@media only screen and (max-width: 579px){ul.fruit_list{flex-wrap:wrap;width:91vw;gap:1vw;bottom:auto}li.fruit{width:14vw;border-radius:2vw;border-width:2px;padding:2.3vw}}