.mod-paragraph{font-size:1.4rem!important;margin:2rem auto 1.5rem!important;max-width:80ch;text-wrap:balance;text-align:center;line-height:1.8;color:color-mix(in srgb,var(--block-text) 85%,transparent);& b{color:var(--accent-color)}}.mods-container{display:flex;flex-direction:column;justify-content:space-around;width:100%;align-items:center;gap:1.5rem;padding-bottom:1rem;.mod-group{width:90%;max-width:800px;border-radius:25px;border:1px solid color-mix(in srgb,var(--block-border) 45%,transparent);overflow:hidden;background:linear-gradient(135deg,color-mix(in srgb,var(--block-border) 20%,transparent) 50%,color-mix(in srgb,var(--accent-color) 15%,transparent) 95%);.mod-title-header{margin-block:0;padding:1rem 1.5rem;border-bottom:1px solid color-mix(in srgb,var(--block-border) 30%,transparent);& h3{font-size:1.5rem;font-weight:700;letter-spacing:.05rem;flex-shrink:0;white-space:nowrap;color:var(--text-color)}}}& details{display:flex;flex-direction:column;align-items:stretch;width:100%;min-height:120px;contain:layout paint;border-bottom:1px solid rgba(255,255,255,.05);&:last-child{border-bottom:none}& summary{display:grid;grid-template-columns:110px auto;align-items:center;position:relative;padding:1.3rem;& img{width:100px;height:100px;object-fit:contain;transition:width .3s ease-out,height .3s ease-out;display:block}.material-symbols-rounded.arrow{position:absolute;top:25px;right:25px;color:#f3f3f3;transition:all .15s ease-in-out;opacity:.15}.mod-text{display:flex;flex-direction:column;align-items:start;gap:.5rem;& h4{margin-left:.7rem;font-size:1.6rem;font-family:var(--font-title);text-align:left;transition:all .3s ease-out}& p{color:color-mix(in srgb,var(--block-text) 70%,var(--block-border));font-size:1rem;text-align:left;transition:all .3s ease-out;margin:0 1.3rem;line-height:1.3}}}.mod-expanded{display:none}&[open]{border-bottom:1px solid color-mix(in srgb,var(--block-border) 30%,transparent);.material-symbols-rounded.arrow{transform:rotate(180deg);opacity:1}& summary{padding-bottom:1.5rem;border-bottom:1px solid color-mix(in srgb,var(--block-border) 30%,transparent)}.mod-expanded{display:flex;flex-direction:column;justify-content:center;align-items:center;gap:1rem;background:color-mix(in srgb,var(--block-color) 25%,transparent);& nav{display:flex;justify-content:center;align-items:center;gap:1.4rem;padding-block:1.3rem .3rem;& a{display:flex;justify-content:center;align-items:center;gap:.7rem;text-decoration:none;opacity:.5;color:var(--block-text);border-radius:12px;background:color-mix(in srgb,var(--block-border) 20%,transparent);outline:1px solid color-mix(in srgb,var(--block-border) 30%,transparent);padding:.2rem .7rem;transition:background .15s ease-in,outline .2s ease-in-out,opacity .2s ease-in;&:hover{background:color-mix(in srgb,var(--block-border) 30%,transparent);outline:1px solid color-mix(in srgb,var(--block-border) 40%,transparent);opacity:.75}&.active{background:color-mix(in srgb,var(--block-border) 90%,transparent);border:2px solid color-mix(in srgb,var(--block-border) 95%,transparent);box-shadow:0 0 20px 5px var(--block-shadow);opacity:1}& span{color:var(--accent-color)}}}.mod-features{width:100%;.tab-content{display:none;&.active{display:flex;justify-content:center;align-items:center;flex-direction:column;& h5{font-size:1.3rem;margin-block:.1rem .7rem}& ul,ol{display:flex;flex-wrap:wrap;flex-direction:column;max-width:50ch;gap:1.2rem;color:color-mix(in srgb,var(--block-text) 80%,var(--block-border));margin-inline:3rem;list-style-type:none;& li{line-height:1.5;&:before{content:"✓";padding-right:.5rem;color:var(--accent-color);text-shadow:var(--accent-color) 0 0 10px;font-size:1.4rem}& code{background:color-mix(in srgb,var(--accent-color) 20%,transparent);padding:.3rem .6rem;border-radius:8px}}}& ol{counter-reset:step;& li{counter-increment:step;&:before{content:counter(step) ".";padding-right:.5rem;color:var(--accent-color);text-shadow:var(--accent-color) 0 0 10px;font-size:1.2rem}}}.mod-author{padding:1rem 0;width:90%;border-top:1px solid color-mix(in srgb,var(--block-border) 20%,transparent);margin-top:2rem;display:flex;justify-content:space-between;align-items:center;& p{margin:0;font-size:1rem;font-style:italic;opacity:.65}.btn-info,.btn-download{display:none}}}}}}}}}.tab-content[data-content=info].active .btn-info,.tab-content[data-content=download].active .btn-download{display:flex!important;align-items:center;gap:.7rem;color:var(--block-text);border-radius:15px;text-decoration:none;background:color-mix(in srgb,var(--block-border) 20%,transparent);outline:1px solid color-mix(in srgb,var(--block-border) 70%,var(--block-text));padding:.5rem 1rem;background:color-mix(in srgb,var(--block-border) 80%,transparent);font-family:GTAArtDeco;font-weight:600;transition:all .2s;&:hover{background:color-mix(in srgb,var(--block-border) 50%,transparent);outline:1px solid color-mix(in srgb,var(--block-border) 60%,transparent)}.material-symbols-rounded{color:color-mix(in srgb,var(--block-text) 70%,transparent)}}details.mod:hover summary>.material-symbols-rounded.arrow{opacity:1}@media(max-width:660px){.mod-paragraph{text-align:start;font-size:1.1rem;max-width:33ch;margin-inline:1.3rem;line-height:1.8}.mod-title-header{&:before,&:after{width:20vw}}.mods-container{gap:3rem;& details{max-width:380px;& summary{.material-symbols-rounded.arrow{top:12px;right:12px}.mod-text{gap:.6rem;& p{font-size:.9rem}}}&[open]{.mod-expanded{& nav{flex-direction:column;margin-bottom:1rem;& a{justify-content:center;width:100%;padding:1rem 2rem;text-transform:uppercase;&.active{font-weight:800}& span{font-size:1.5rem}}}.mod-features{.tab-content{&.active{& h5{font-size:1.5rem}& ul,ol{text-align:start;& li{line-height:1.6}}.mod-author{& p{font-size:.95rem;line-height:1.25}.btn-info,.btn-download{font-size:1rem}}}}}}}}}}