.fova-server-news {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: clamp(18px, 1.5vw, 40px);
    width: 100%;
    padding: clamp(18px, 1.5vw, 40px);
    padding-right: 184px;
    background: rgba(255, 252, 237, .97);
    border: 3px solid #4f4737;
    box-shadow: 0 10px 24px rgba(31, 22, 12, .2);
}

.fova-server-panel {
    display: flex;
    flex-direction: column;
    min-width: 0;
    padding: clamp(18px, 1.5vw, 36px);
    background: #fffcf0;
    border: 1px solid #c2ab72;
}

.fova-server-panel h2 {
    margin: 0 0 22px;
    padding: 16px 8px;
    color: #fff0bb;
    background: linear-gradient(110deg, #642c20, #984b35, #642c20);
    border: 1px solid #c8a256;
    font-size: clamp(22px, 1.65vw, 38px);
    line-height: 1.3;
    font-weight: 700;
    text-align: center;
}

.fova-server-cay_cuoc h2 {
    background: linear-gradient(110deg, #1a4034, #38654a, #1a4034);
}

.fova-server-tabs {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 20px;
}

.fova-server-tabs button {
    min-width: 0;
    min-height: 48px;
    padding: 12px 4px;
    color: #fff5c2;
    background: linear-gradient(#a69359, #7d6c39);
    border: 1px solid #d8c38f;
    border-radius: 2px;
    font: inherit;
    font-size: clamp(15px, 1.05vw, 25px);
    font-weight: 700;
    cursor: pointer;
}

.fova-server-tabs button[aria-selected="true"] {
    background: linear-gradient(#ac6754, #773727);
    border-color: #b57b51;
}

.fova-server-tabs button:hover,
.fova-server-more:hover {
    filter: brightness(1.1);
}

.fova-server-tabs button:focus-visible,
.fova-server-more:focus-visible,
.fova-server-articles a:focus-visible {
    outline: 2px solid #9b541a;
    outline-offset: 2px;
}

.fova-server-panels {
    flex: 1;
    min-height: clamp(300px, 22vw, 600px);
}

.fova-server-category[hidden] {
    display: none;
}

.fova-server-articles {
    margin: 0;
    padding: 0;
    list-style: none;
}

.fova-server-articles li {
    border-bottom: 1px solid #c8bfa8;
}

.fova-server-articles a {
    display: flex;
    align-items: center;
    gap: 16px;
    min-height: clamp(54px, 4vw, 88px);
    padding: 12px 0;
    color: #494238;
    font-size: clamp(15px, 1.05vw, 25px);
    line-height: 1.5;
    text-decoration: none;
}

.fova-server-article-title {
    flex: 1;
    min-width: 0;
    overflow-wrap: anywhere;
}

.fova-server-articles time {
    flex: 0 0 auto;
    color: #75654b;
    font-size: .85em;
    white-space: nowrap;
}

.fova-server-articles a:hover {
    color: #ad521f;
    text-decoration: none;
}

.fova-server-empty {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: clamp(300px, 22vw, 600px);
    margin: 0;
    padding: 24px;
    color: #8c7b5a;
    font-size: clamp(16px, 1.05vw, 25px);
    text-align: center;
}

.fova-server-more {
    align-self: center;
    margin-top: 24px;
    padding: 12px 34px;
    color: #754319;
    background: linear-gradient(#f4e5b7, #dcc486);
    border: 1px solid #b4975e;
    font-size: clamp(16px, 1vw, 24px);
    font-weight: 700;
    text-decoration: none;
}

.fova-server-switch {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 12px;
    margin-bottom: 20px;
}

.fova-server-switch a,
.fova-article-server {
    display: inline-block;
    padding: 10px 18px;
    color: #73502d;
    background: #eee1ba;
    border: 1px solid #c2a66a;
    font-size: 16px;
    text-decoration: none;
}

.fova-server-switch a[aria-current="page"] {
    color: #fff2cb;
    background: #75402d;
}

.fova-article-server {
    margin: 18px 0;
}

@media screen and (max-width: 1220px) {
    .fova-server-news {
        padding-right: 18px;
    }
}

@media screen and (max-width: 767px) {
    .fova-server-news {
        grid-template-columns: minmax(0, 1fr);
        gap: 16px;
        padding: 12px;
        border-width: 2px;
    }

    .fova-server-panel { padding: 14px; }
    .fova-server-panel h2 { margin-bottom: 16px; font-size: 24px; }
    .fova-server-tabs { gap: 6px; }
    .fova-server-tabs button { padding: 10px 3px; font-size: 14px; }
    .fova-server-panels,
    .fova-server-empty { min-height: 160px; }
    .fova-server-articles a { flex-direction: column; align-items: flex-start; gap: 4px; }
    .fova-server-more { margin-top: 18px; }
}
