.container{&.contribute{display:flex;position:relative;flex-direction:column;align-items:center;gap:5.25rem;.our-project{width:90%;padding:5.25rem 3.75rem 5.625rem 48%;border:.25rem dashed var(--background-color-primary);border-radius:1.125rem;background:var(--background-color-secondary);background-image:url(/images/contribute/our-project.svg);background-position:50%;background-size:cover;background-repeat:no-repeat;line-height:1.8;h2{margin-bottom:1em}}.steps{display:flex;flex-direction:column;align-items:center;width:100%;max-width:90%;gap:1.5rem;text-align:center;.row{display:flex;position:relative;flex-direction:row;flex-wrap:wrap;align-items:stretch;justify-content:center;width:100%;overflow:hidden;gap:1.125rem;.item{display:flex;flex-grow:1;flex-shrink:1;flex-basis:0;flex-direction:column;gap:1.125rem}.box{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;min-height:10rem;padding:2.25rem;gap:1.125rem;border:.25rem dashed var(--background-color-primary);border-radius:1.125rem;background:var(--background-color-secondary);.index{z-index:1;position:absolute;top:54%;left:12%;transform:translate(-50%,-50%);color:var(--background-color-primary);font-weight:900;font-size:20rem;line-height:1;opacity:.3;pointer-events:none}.description{z-index:2;position:relative;line-height:1.8;text-align:center;a{color:var(--color);font-weight:500;text-decoration:underline;-webkit-text-decoration-style:solid;text-decoration-style:solid;-webkit-text-decoration-color:var(--color);text-decoration-color:var(--color);text-underline-offset:.1875rem;transition:color .24s var(--ease-fluid);&:focus,&:hover{color:var(--color-display)}}}svg{z-index:2;position:relative;transition:stroke .84s var(--ease-fluid)}&.step{min-height:18rem}}}}.color-palette{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;max-width:80%;gap:2rem;.toggle-group{display:flex;position:relative;width:-moz-fit-content;width:fit-content;max-width:100%;margin:0;padding:.375rem;overflow:auto hidden;gap:.5em;border-radius:.375rem;background-color:var(--background-color-secondary);.item{position:relative;button{z-index:2;position:relative;border-radius:.375rem;background-color:transparent;&.active,&:focus,&:hover{transform:none;background-color:transparent;color:var(--color)}}.highlighter{z-index:1;position:absolute;inset:0;border-radius:.375rem;background-color:var(--background-color-primary)}}}.table-wrapper{display:flex;position:relative;max-width:100%;margin:0;padding:0;overflow:auto hidden;border:.375rem solid var(--background-color-secondary);border-radius:.375rem;table{width:max-content;margin:0;padding:0;border:none;border-collapse:collapse;background-color:var(--background-color-secondary);color:inherit;text-align:left;tr{td,th{min-width:13rem;padding:.75rem 1.125rem;border:none;.wrapper{display:inline-flex;align-items:center;gap:.5rem;font-size:var(--font-size-caption);line-height:1}&:first-child{min-width:9rem}}}th{color:var(--color-display)}tbody{tr{background-color:var(--background-color-primary);transition:background-color .24s var(--ease-fluid);&:first-child{td{&:first-child{border-top-left-radius:.375rem}&:last-child{border-top-right-radius:.375rem}}}&:last-child{td{&:first-child{border-bottom-left-radius:.375rem}&:last-child{border-bottom-right-radius:.375rem}}}&:focus,&:hover{background-color:var(--background-color-secondary)}}}}}p{line-height:1.8;text-align:center;text-wrap:balance;a{color:var(--color);font-weight:500;text-decoration:underline;-webkit-text-decoration-style:solid;text-decoration-style:solid;-webkit-text-decoration-color:var(--color);text-decoration-color:var(--color);text-underline-offset:.1875rem;transition:color .24s var(--ease-fluid);&:focus,&:hover{color:var(--color-display)}}}}.contributors{display:flex;position:relative;flex-direction:column;align-items:center;justify-content:center;max-width:40rem;gap:1.5rem;line-height:1.8;text-align:center;scroll-margin-top:12rem;h3{em{color:var(--color);font-style:normal;font-family:var(--font-mono)}}ul{display:flex;flex-wrap:wrap;align-items:center;justify-content:center;width:100%;padding:0;gap:.75rem;list-style:none;.item{display:flex;position:relative;align-items:center;padding:.125rem;gap:.75rem;border-radius:100%;transition:background-color .24s var(--ease-sharp);.avatar{position:relative;width:1.875rem;height:1.875rem;overflow:hidden;border-radius:100%;background-color:var(--background-color-primary);pointer-events:none;img{width:100%;height:100%;object-fit:cover;object-position:center;transition:filter .24s var(--ease-fluid)}}&:focus,&:hover{background-color:var(--background-color-tertiary);.avatar{img{filter:grayscale(100%)}}}}}}@media (max-width:60rem){gap:4.125rem;.our-project{width:100%;padding:1.875rem 1.5rem;background-position:0}.steps{.row{flex-direction:column}}.color-palette{width:100%;max-width:100%;.table-wrapper{width:100%}}.contributors{width:100%;max-width:100%}}}}