.realm {
    display: grid;
    width: 100%;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    margin: 0;
    padding: 25px clamp(22px, 4vw, 54px);
    gap: 25px;
    border-top: 1px solid rgba(201, 151, 62, .5);
    border-bottom: 1px solid rgba(201, 151, 62, .5);
    background: linear-gradient(90deg, rgba(8, 9, 8, .99), rgba(34, 27, 22, .98), rgba(8, 9, 8, .99));
    box-shadow: inset 0 1px rgba(255, 227, 155, .05), 0 15px 36px rgba(0, 0, 0, .42);
}
.realm > div { min-width: 0; }
.realm small {
    display: block;
    margin-bottom: 6px;
    color: #9d927f;
    font: 700 10px Arial, sans-serif;
    letter-spacing: 1.2px;
    text-transform: uppercase;
}
.realm strong {
    display: block;
    color: #efd18a;
    font: 700 14px Arial, sans-serif;
}
.realm-status-line,
.faction-counts { display: inline-flex !important; align-items: center; gap: 9px; }
.server-status { display: inline-block; width: 14px; height: 14px; flex: 0 0 14px; border-radius: 50%; }
.server-status.online {
    border: 1px solid #d1ff91;
    background: #91e72e;
    box-shadow: 0 0 6px #91e72e, 0 0 15px rgba(145, 231, 46, .9), 0 0 28px rgba(118, 205, 39, .54);
    animation: realmStatusPulse 2s ease-in-out infinite;
}
.server-status.offline { border: 1px solid #858585; background: #5b5b5b; box-shadow: inset 0 1px 2px rgba(255,255,255,.15); }
.alliance-count { color: #80aaff; }
.horde-count { color: #f07968; }
.faction-separator { color: #7f766c; }

.home-realm-card .realm {
    display: flex;
    min-height: 100%;
    padding: 30px 28px;
    flex-direction: column;
    gap: 22px;
    border: 1px solid rgba(201, 151, 62, .58);
    background: linear-gradient(155deg, rgba(29, 24, 20, .99), rgba(8, 10, 8, .99));
    box-shadow: 0 20px 50px rgba(0,0,0,.62), inset 0 0 30px rgba(139, 220, 56, .025);
}
.home-realm-card .realm::before {
    content: "Realmstatus";
    display: block;
    padding-bottom: 17px;
    border-bottom: 1px solid rgba(201,151,62,.28);
    color: #f2d38a;
    font: 400 27px Georgia, serif;
    text-align: center;
    text-transform: uppercase;
}
.home-realm-card .realm > div {
    padding: 0 4px 14px;
    border-bottom: 1px solid rgba(201,151,62,.12);
}
.home-realm-card .realm > div:last-child { border-bottom: 0; padding-bottom: 0; }
.home-realm-card .realm small { font-size: 11px; }
.home-realm-card .realm strong { font-size: 16px; }
.home-realm-card .realm-main-status strong { color: #bfff55; font-size: 23px; }

@keyframes realmStatusPulse {
    0%,100% { transform: scale(.94); box-shadow: 0 0 5px #91e72e, 0 0 12px rgba(145,231,46,.75); }
    50% { transform: scale(1.14); box-shadow: 0 0 9px #91e72e, 0 0 22px rgba(145,231,46,1), 0 0 34px rgba(118,205,39,.7); }
}

@media (max-width: 1050px) { .realm { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 650px) { .realm { grid-template-columns: 1fr; padding: 22px; } }