.downloads-main{
--dl-columns:3;
--dl-cat-columns:2;
--dl-font:var(--fz0);
font-size:var(--dl-font);
}
.dl-hero,
.dl-sec{
width:100%;
max-width:var(--pw3);
margin:0 auto var(--gt1);
}
.dl-stats{
list-style:none;
display:flex;
flex-wrap:wrap;
gap:var(--gd2) var(--gap);
margin:0;
padding:0;
}
.dl-stats li{
display:flex;
align-items:baseline;
gap:var(--gd5);
margin:0;
padding:0;
font-size:var(--dl-font);
line-height:1.4;
color:var(--tx3);
}
.dl-stats li::before,
.dl-grid>li::before{
display:none;
}
.dl-stat-n{
font-family:var(--ff2);
font-weight:calc(700 + var(--fw-offset));
color:var(--cl1);
}
.dl-sec-head{
margin:0 0 var(--gd2);
}
.dl-sec-title{
display:flex;
align-items:center;
gap:var(--gd3);
margin:0;
font-family:var(--ff2);
font-size:var(--dl-font);
font-weight:calc(700 + var(--fw-offset));
color:var(--tx1);
}
.dl-grid{
list-style:none;
display:grid;
gap:var(--gd2);
margin:0;
padding:0;
}
.dl-grid>li{
min-width:0;
margin:0;
padding:0;
}
.dl-grid-3{
grid-template-columns:repeat(var(--dl-columns),minmax(0,1fr));
}
.dl-sec-cats .dl-grid{
display:block;
column-count:var(--dl-cat-columns);
column-gap:var(--gap);
}
.dl-card,
.dl-cat-card{
display:flex;
align-items:center;
gap:var(--gd2);
height:100%;
min-width:0;
padding:var(--gd3) var(--gd2);
border:0;
border-radius:var(--br1);
background:var(--bg3);
color:var(--tx1);
text-decoration:none;
transition:background-color .15s ease,color .15s ease;
}
.dl-card:focus-visible,
.dl-cat-card:focus-visible{
outline:2px solid var(--cl1);
outline-offset:3px;
}
.dl-card-icon{
width:28px;
height:28px;
flex:0 0 28px;
object-fit:contain;
border-radius:var(--br1);
}
span.dl-card-icon,
.dl-cat-ic{
display:inline-flex;
align-items:center;
justify-content:center;
color:var(--cl1);
}
.dl-card-icon svg{
width:100%;
height:100%;
display:block;
}
.dl-card-icon svg:not([fill="none"]),
.dl-cat-ic svg:not([fill="none"]){
fill:currentColor;
}
.dl-card-icon svg[stroke]:not([stroke="none"]),
.dl-card-icon svg [stroke]:not([stroke="none"]),
.dl-cat-ic svg[stroke]:not([stroke="none"]),
.dl-cat-ic svg [stroke]:not([stroke="none"]){
stroke:currentColor!important;
}
.dl-card-icon svg [fill]:not([fill="none"]),
.dl-cat-ic svg [fill]:not([fill="none"]){
fill:currentColor!important;
}
.dl-card-body{
display:flex;
flex-direction:column;
flex:1 1 auto;
min-width:0;
gap:2px;
}
.dl-card-name,
.dl-cat-name{
min-width:0;
font-weight:calc(600 + var(--fw-offset));
font-size:var(--dl-font);
line-height:1.3;
overflow:hidden;
text-overflow:ellipsis;
white-space:nowrap;
}
.dl-card-sub{
display:flex;
flex-wrap:wrap;
align-items:baseline;
gap:0 var(--gd3);
min-width:0;
}
.dl-card-ver,
.dl-card-time,
.dl-cat-n{
font-size:var(--dl-font);
line-height:1.4;
overflow-wrap:anywhere;
color:var(--tx3);
}
.dl-card-ver,
.dl-card-time{
font-size:var(--fz2);
}
.dl-card-ver{
color:var(--tx2);
}
.dl-card-time{
color:var(--cl1);
}
.dl-cat-top{
display:flex;
align-items:center;
gap:var(--gd3);
width:100%;
min-width:0;
}
.dl-cat-ic{
width:28px;
height:28px;
flex:0 0 28px;
}
.dl-cat-ic svg{
width:100%;
height:100%;
display:block;
object-fit:contain;
}
.dl-cat-name{
flex:1 1 auto;
}
.dl-cat-n{
flex:0 0 auto;
margin-left:auto;
font-variant-numeric:tabular-nums;
}
.dl-weekly{
display:flex;
flex-wrap:wrap;
align-items:center;
gap:var(--gd4) var(--gd2);
min-width:0;
font-size:var(--dl-font);
line-height:1.4;
}
.dl-weekly-label{
color:var(--tx3);
}
.dl-weekly-link{
display:inline-flex;
align-items:center;
gap:var(--gd3);
min-width:0;
color:var(--tx1);
text-decoration:none;
}
.dl-weekly-name{
min-width:0;
font-weight:calc(600 + var(--fw-offset));
overflow-wrap:anywhere;
}
.dl-weekly-link:hover{
color:var(--cl1);
text-decoration:none;
}
.dl-weekly-link:hover .dl-weekly-name{
text-decoration:underline;
text-decoration-thickness:2px;
text-underline-offset:2px;
}
.dl-weekly-link:focus-visible{
outline:2px solid var(--cl1);
outline-offset:3px;
}
.dl-sec-cats .dl-grid>li{
break-inside:avoid;
}
.dl-cat-card{
min-height:44px;
padding:var(--gd4) var(--gd2);
background:transparent;
}
.dl-cat-name{
font-weight:var(--fw1);
line-height:1.66;
}
.dl-card:hover,
.dl-cat-card:hover{
background:var(--hv2);
color:var(--cl1);
text-decoration:none;
}
.dl-cat-card:hover .dl-cat-name{
text-decoration:underline;
text-decoration-thickness:2px;
text-underline-offset:2px;
}
@media(max-width:900px){
.dl-sec{
--dl-columns:2;
--dl-cat-columns:2;
}
}
@media(max-width:560px){
.dl-sec{
--dl-columns:1;
--dl-cat-columns:1;
}
}
@media(prefers-reduced-motion:reduce){
.dl-card,
.dl-cat-card{
transition:none;
}
}