*,:before,:after{box-sizing:border-box;margin:0;padding:0}body{color:#69422b;background-color:#f3ece4;width:100%;font-family:DM Sans,Arial,Helvetica,sans-serif;overflow-y:auto}header{text-align:center;padding:2rem}.hook_examples{flex-direction:column;align-items:center;gap:2rem;width:100%;padding-bottom:4rem;display:flex}.hook_examples .wrapper{border:2px solid #927768;border-radius:2rem;width:40rem;max-width:100%;padding:2rem;transition:all .3s;box-shadow:-6px 6px #927768}.hook_examples .wrapper button{color:#fff;cursor:pointer;background-color:#69422b;border:none;border-radius:5rem;padding:1rem 1.6rem;font-family:inherit;font-size:1rem;transition:all .3s}.hook_examples .wrapper .wrapper_content{flex-direction:column;gap:1rem;display:flex}.hook_examples .wrapper .wrapper_content .content_main{background-color:#fff;border:1px solid #bbb;border-radius:1rem;overflow:hidden}.hook_examples .wrapper .wrapper_content .content{flex-direction:column;display:flex}.hook_examples .wrapper .wrapper_content .content .content_head{border-bottom:1px solid #bbb;padding:1rem}.hook_examples .wrapper .wrapper_content .content .content_body{white-space:pre-wrap;word-break:break-all;max-height:30vh;padding:1rem;line-height:1.4;overflow-y:auto}.hook_examples .wrapper .action{gap:.8rem;display:inline-flex}