.hub-main{
width:var(--pw3);margin:0 auto;
}
.hub-hero{
margin:var(--gap) auto;
text-align:center;
}
.hub-hero p{
font-size:20px;
color:var(--tx2);
margin:0 auto;
max-width:700px;
line-height:1.6;
}
.hub-empty{
display:none;
padding:var(--gap);
color:var(--tx2);
font-size:var(--fz1);
background-color:var(--bg2);
border:var(--bw1) solid var(--bc1);
border-radius:var(--br1);
box-shadow:var(--fbs);
text-align:center;
margin-top:var(--gap);
}
.hub-landing{
margin-bottom:var(--gap);
}
.hub-landing-grid{
display:grid;
grid-template-columns:repeat(2,1fr);
gap:var(--gap);
}
.hub-landing-section{
background-color:var(--bg2);
border:var(--bw1) solid var(--bc1);
border-radius:var(--br1);
padding:var(--gap);
box-shadow:var(--fbs);
display:flex;
flex-direction:column;
min-width:0;
overflow:hidden;
}
.hub-landing-header{
display:flex;
align-items:flex-start;
justify-content:space-between;
gap:var(--gd2);
margin-bottom:var(--gap);
margin-left:calc(var(--gap) * -1);
margin-right:calc(var(--gap) * -1);
padding:0 var(--gap) var(--gd2);
border-bottom:var(--bw1) solid var(--bc1);
min-width:0;
}
.hub-landing-title{
display:flex;
align-items:flex-start;
gap:12px;
min-width:0;
overflow:hidden;
}
.hub-landing-icon{
width:32px;
height:32px;
flex-shrink:0;
display:flex;
align-items:center;
justify-content:center;
margin-top:2px;
}
.hub-landing-icon svg{
width:32px;
height:32px;
fill:var(--cl1);
}
.hub-landing-title>div{
min-width:0;
overflow:hidden;
}
.hub-landing-title h2{
font-family:var(--ff2);
font-size:24px;
font-weight:700;
color:var(--cl1);
margin:0;
text-transform:uppercase;
letter-spacing:1px;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.hub-landing-title p{
font-size:16px;
color:var(--tx2);
margin:4px 0 0;
line-height:1.4;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.hub-landing-link{
display:inline-flex;
align-items:center;
gap:8px;
padding:8px 14px;
background-color:var(--bg3);
border-radius:var(--br0);
font-size:16px;
font-weight:600;
color:var(--tx1);
white-space:nowrap;
flex-shrink:0;
}
.hub-landing-link:hover{
background-color:var(--hv1);
color:var(--cl1);
}
.hub-landing-link svg{
width:16px;
height:16px;
fill:var(--tx2);
stroke:var(--tx2);
}
.hub-landing-link:hover svg{
fill:var(--cl1);
stroke:var(--cl1);
}
.hub-landing-count{
background-color:var(--cl1);
color:var(--blk);
padding:2px 8px;
border-radius:10px;
font-size:13px;
font-weight:700;
}
.hub-landing-items{
display:flex;
flex-direction:column;
gap:var(--gd2);
flex:1;
min-width:0;
}
.hub-landing-item{
display:flex;
flex-direction:column;
gap:4px;
padding-left:20px;
position:relative;
min-width:0;
}
.hub-landing-item::before{
content:"•";
position:absolute;
left:0;
top:0;
color:var(--cl1);
font-weight:800;
font-size:20px;
line-height:1.4;
pointer-events:none;
}
.hub-landing-item-top{
display:flex;
align-items:center;
justify-content:space-between;
gap:12px;
min-width:0;
}
.hub-landing-item h3{
font-size:var(--fz1);
font-weight:600;
margin:0;
color:var(--tx1);
line-height:1.4;
min-width:0;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}
.hub-landing-item-desc{
font-size:14px;
color:var(--tx2);
line-height:1.5;
white-space:nowrap;
overflow:hidden;
text-overflow:ellipsis;
}