@font-face {
    font-family: "Vanguard Martel";
    src: url("fonts/cinzel-latin.woff2?v=20260804-1") format("woff2");
    font-style: normal;
    font-weight: 400 700;
    font-display: fallback;
}

:root {
    --v-bg: #080908;
    --v-bg-soft: #12110e;
    --v-panel: #11110f;
    --v-panel-raised: #1a1712;
    --v-panel-recessed: #0b0b0a;
    --v-gold: #c0913c;
    --v-gold-bright: #e7bd67;
    --v-gold-dark: #604820;
    --v-bronze: #765225;
    --v-burgundy: #5f110d;
    --v-burgundy-hover: #841b13;
    --v-parchment: #ddd0b8;
    --v-parchment-muted: #c2b59e;
    --v-ink: #251b13;
    --v-green: #61b65f;
    --v-red: #bd554a;
    --v-line: rgba(185, 138, 53, 0.54);
    --v-shadow: 0 8px 24px rgba(0, 0, 0, 0.72);
    --v-edge-highlight: #c59242;
    --v-edge-shadow: #2a1a0a;
    --v-surface-grain: repeating-linear-gradient(135deg, rgba(255, 239, 190, 0.018) 0 1px, rgba(0, 0, 0, 0.022) 1px 4px);
    --v-left: 220px;
    --v-right: 235px;
    --v-gap: 14px;
    --v-max: 1540px;
    --v-font-display: "Vanguard Martel", "Palatino Linotype", Georgia, serif;
    --v-font-body: Georgia, "Times New Roman", serif;
}

* {
    box-sizing: border-box;
}

html {
    min-width: 0;
    background: var(--v-bg);
}

body.vanguard-site {
    min-width: 0 !important;
    min-height: 100vh;
    margin: 0;
    color: var(--v-parchment);
    background-color: var(--v-bg);
    background-image:
        linear-gradient(rgba(5, 5, 4, 0.93), rgba(8, 8, 7, 0.97)),
        url("images/header/bgs/00.jpg");
    background-position: top center;
    background-size: cover;
    background-attachment: fixed;
    font-family: var(--v-font-body);
    font-size: 15px;
    line-height: 1.45;
    letter-spacing: 0;
    text-rendering: optimizeLegibility;
    -webkit-font-smoothing: antialiased;
}

body.vanguard-site a {
    color: inherit;
}

body.vanguard-site a:hover {
    color: inherit;
}

body.vanguard-site button,
body.vanguard-site input,
body.vanguard-site select,
body.vanguard-site textarea {
    font: inherit;
    letter-spacing: 0;
}

body.vanguard-site img {
    max-width: 100%;
}

.sr-only {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.v-hero {
    position: relative;
    min-height: 206px;
    border-bottom: 1px solid #3e2d16;
    background-color: #090908;
    background-image: url("images/vanguard/hero-fortress.webp?v=20260804-3");
    background-repeat: no-repeat;
    background-position: center 48%;
    background-size: cover;
    box-shadow: 0 10px 32px rgba(0, 0, 0, 0.88);
}

.v-hero::after {
    content: "";
    position: absolute;
    inset: auto 0 0;
    height: 5px;
    background: linear-gradient(90deg, #1a130b, #9c702e 32%, #392510 50%, #9c702e 68%, #1a130b);
    opacity: 0.72;
}

.v-hero-shade {
    position: absolute;
    inset: 0;
    background:
        linear-gradient(90deg, rgba(4, 5, 5, 0.16) 0%, rgba(4, 5, 5, 0.28) 42%, rgba(4, 5, 5, 0.06) 70%, rgba(4, 5, 5, 0.22) 100%),
        linear-gradient(0deg, rgba(4, 4, 3, 0.88) 0%, rgba(4, 4, 3, 0.04) 62%);
}

.v-hero-inner {
    position: relative;
    z-index: 1;
    max-width: var(--v-max);
    min-height: 206px;
    margin: 0 auto;
    padding: 10px 26px 0;
}

.v-brand {
    position: absolute;
    top: 17px;
    left: 30px;
    display: flex;
    width: 390px;
    height: 172px;
    align-items: center;
    justify-content: center;
    transition: filter 160ms ease, transform 160ms ease;
}

.v-brand:hover {
    filter: brightness(1.12);
    transform: translateY(-1px);
}

.v-brand img {
    width: 100%;
    max-height: 170px;
    object-fit: contain;
}

.v-hero-copy {
    position: absolute;
    top: 38px;
    left: 34%;
    width: min(510px, calc(66% - 300px));
    text-shadow: 0 2px 5px #000, 0 0 16px rgba(0, 0, 0, 0.86);
}

.v-hero-copy p,
.v-hero-title {
    margin: 0;
    color: var(--v-gold-bright);
    font-family: "Vanguard Martel", Georgia, serif;
    font-weight: 700;
    text-transform: uppercase;
    letter-spacing: 0;
}

.v-hero-copy p {
    font-size: 22px;
}

.v-hero-title {
    margin-top: 2px;
    font-size: 32px;
    line-height: 1.13;
}

.v-hero-tags {
    display: flex;
    margin-top: 13px;
    color: #e4c77f;
    font-size: 14px;
    font-weight: 700;
    text-transform: uppercase;
}

.v-hero-tags span {
    display: inline-flex;
    align-items: center;
}

.v-hero-tags span:not(:last-child)::after {
    content: "+";
    margin: 0 13px;
    color: var(--v-gold);
}

.v-actions {
    position: absolute;
    right: 19%;
    bottom: 18px;
    left: 26.6%;
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
}

.v-action {
    position: relative;
    display: flex;
    min-width: 0;
    height: 66px;
    padding: 7px 8px;
    align-items: center;
    border: 1px solid #795526;
    border-radius: 2px;
    color: var(--v-parchment) !important;
    background: linear-gradient(180deg, #252622 0%, #111311 48%, #080a09 100%);
    box-shadow:
        inset 0 0 0 2px #070706,
        inset 0 1px 0 rgba(255, 222, 151, 0.16),
        0 4px 10px rgba(0, 0, 0, 0.76);
    text-decoration: none !important;
    transition: border-color 150ms ease, background-color 150ms ease, transform 150ms ease;
}

.v-action::after {
    content: "";
    position: absolute;
    inset: 3px;
    border: 1px solid rgba(185, 138, 53, 0.22);
    pointer-events: none;
}

.v-action:hover {
    border-color: var(--v-gold-bright);
    background: linear-gradient(180deg, #31312b 0%, #171816 50%, #0b0c0b 100%);
    transform: translateY(-1px);
}

.v-action:active {
    transform: translateY(1px);
}

.v-action-primary {
    border-color: #b78836;
    background: linear-gradient(180deg, #761a13 0%, #54100c 54%, #300806 100%);
}

.v-action-primary:hover {
    background: linear-gradient(180deg, #93231a 0%, #67150f 54%, #3a0b07 100%);
}

.v-action img {
    position: relative;
    z-index: 1;
    flex: 0 0 36px;
    width: 36px;
    height: 36px;
    margin-right: 7px;
    object-fit: contain;
}

.v-action span {
    position: relative;
    z-index: 1;
    display: flex;
    min-width: 0;
    flex-direction: column;
    line-height: 1.1;
}

.v-action strong {
    overflow: hidden;
    color: #f1ddb1;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 12.5px;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.v-action small {
    margin-top: 5px;
    overflow: hidden;
    color: #bfae90;
    font-family: Arial, sans-serif;
    font-size: 10px;
    text-overflow: ellipsis;
    text-transform: uppercase;
    white-space: nowrap;
}

.v-mobile-toggle,
.v-mobile-close,
.v-nav-scrim {
    display: none;
}

.v-page {
    width: min(var(--v-max), calc(100% - 36px));
    margin: 0 auto;
    padding-top: 9px;
}

.v-announcement {
    display: flex;
    min-height: 44px;
    padding: 8px 14px;
    align-items: center;
    border: 1px solid #4a361b;
    color: var(--v-parchment-muted);
    background: linear-gradient(180deg, #171714, #0d0e0c);
    box-shadow: inset 0 0 0 2px #080807, 0 4px 12px rgba(0, 0, 0, 0.52);
    font-size: 13px;
}

.v-announcement-icon {
    width: 16px;
    height: 16px;
    margin-right: 9px;
    border: 1px solid #c89a47;
    border-radius: 50%;
    box-shadow: inset 0 0 0 3px #2b1d0e;
    background: #9f6c26;
}

.v-announcement > strong {
    margin-right: 12px;
    color: var(--v-gold-bright);
    font-family: "Vanguard Martel", Georgia, serif;
    text-transform: uppercase;
}

.v-announcement-copy {
    display: flex;
    min-width: 0;
    flex: 1;
    align-items: center;
    overflow: hidden;
    white-space: nowrap;
}

.v-announcement-copy > span:not(.v-separator) {
    overflow: hidden;
    text-overflow: ellipsis;
}

.v-separator {
    margin: 0 15px;
    color: var(--v-gold);
}

.v-inline-status {
    display: flex;
    margin-left: 16px;
    align-items: center;
    color: var(--v-parchment-muted) !important;
    font-family: Arial, sans-serif;
    font-size: 11px;
    text-decoration: none !important;
    text-transform: uppercase;
    white-space: nowrap;
}

.v-inline-status.is-online > span:nth-child(2) {
    color: var(--v-green);
}

.v-inline-status.is-offline > span:nth-child(2) {
    color: var(--v-red);
}

.v-status-dot {
    display: inline-block;
    width: 9px;
    height: 9px;
    margin-right: 7px;
    border: 1px solid rgba(255, 255, 255, 0.25);
    border-radius: 50%;
    background: var(--v-red);
    box-shadow: 0 0 7px rgba(189, 85, 74, 0.55);
}

.is-online .v-status-dot {
    background: var(--v-green);
    box-shadow: 0 0 7px rgba(97, 182, 95, 0.6);
}

.v-status-count {
    margin-left: 16px;
    color: #d3b96f;
}

.v-layout {
    display: grid;
    grid-template-columns: var(--v-left) minmax(0, 1fr) var(--v-right);
    gap: var(--v-gap);
    margin-top: 0;
    align-items: start;
}

.v-main > .v-announcement {
    margin-bottom: 13px;
}

.v-left-sidebar,
.v-right-sidebar,
.v-main {
    min-width: 0;
}

.v-left-sidebar,
.v-right-sidebar {
    display: grid;
    gap: 12px;
}

.v-nav-section,
.v-side-panel {
    position: relative;
    overflow: hidden;
    border: 1px solid #523a1c;
    background: linear-gradient(180deg, rgba(24, 23, 19, 0.98), rgba(11, 12, 10, 0.99));
    box-shadow: inset 0 0 0 2px #080807, var(--v-shadow);
}

.v-panel-title,
.v-section-heading h2,
.v-section-heading h1 {
    margin: 0;
    color: var(--v-gold-bright);
    font-family: "Vanguard Martel", Georgia, serif;
    font-weight: 700;
    letter-spacing: 0;
    text-transform: uppercase;
}

.v-panel-title {
    position: relative;
    min-height: 38px;
    padding: 8px 10px 7px;
    border-bottom: 1px solid #60451f;
    background: linear-gradient(180deg, #211d16, #11110e);
    font-size: 14px;
    text-align: center;
}

.v-panel-title::before,
.v-panel-title::after {
    content: "";
    position: absolute;
    top: 50%;
    width: 14px;
    height: 1px;
    background: #896228;
}

.v-panel-title::before {
    left: 8px;
}

.v-panel-title::after {
    right: 8px;
}

.v-nav-list {
    padding: 4px 7px 7px;
}

.v-nav-link {
    display: grid;
    min-height: 31px;
    padding: 5px 7px;
    grid-template-columns: 22px minmax(0, 1fr) 12px;
    gap: 6px;
    align-items: center;
    border-bottom: 1px solid rgba(138, 99, 43, 0.27);
    color: #d4c8b3 !important;
    font-size: 13px;
    text-decoration: none !important;
    transition: color 130ms ease, background-color 130ms ease, padding-left 130ms ease;
}

.v-nav-link:last-child {
    border-bottom: 0;
}

.v-nav-link:hover,
.v-nav-link.is-active {
    padding-left: 10px;
    color: var(--v-gold-bright) !important;
    background: rgba(115, 66, 23, 0.23);
}

.v-nav-icon {
    width: 20px;
    height: 20px;
    object-fit: contain;
    filter: sepia(0.72) saturate(1.45) hue-rotate(352deg) brightness(1.08);
    transition: filter 130ms ease, transform 130ms ease;
}

.v-nav-link:hover .v-nav-icon,
.v-nav-link.is-active .v-nav-icon {
    filter: sepia(0.4) saturate(1.65) hue-rotate(350deg) brightness(1.28);
    transform: translateX(1px);
}

.v-nav-text {
    min-width: 0;
}

.v-nav-arrow {
    color: var(--v-gold);
    font-size: 19px;
    line-height: 1;
    text-align: right;
}

.v-start-action {
    min-height: 51px;
    margin: 3px 0 6px;
    padding: 6px 8px;
    grid-template-columns: 38px minmax(0, 1fr) 12px;
    gap: 7px;
    border: 1px solid #73552a;
    box-shadow: inset 0 0 0 2px #090908, inset 0 0 12px rgba(176, 116, 40, 0.08);
    text-transform: uppercase;
}

.v-start-action .v-nav-icon {
    width: 34px;
    height: 34px;
    justify-self: center;
    filter: sepia(0.72) saturate(1.7) hue-rotate(350deg) brightness(1.18);
}

.v-start-action .v-nav-text {
    display: flex;
    flex-direction: column;
    justify-content: center;
    line-height: 1.08;
}

.v-start-action strong {
    color: #f1d39b;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 14px;
}

.v-start-action small {
    margin-top: 3px;
    color: #d7b66e;
    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 700;
}

.v-start-action--primary {
    border-color: #a2732d;
    color: #f0d7a2 !important;
    background: linear-gradient(180deg, #741a13, #430c08);
    font-weight: 700;
}

.v-start-action--download {
    color: #e2ded2 !important;
    background: linear-gradient(180deg, #1d2931, #10161b);
}

.v-start-action--download .v-nav-icon {
    width: 30px;
    height: 30px;
    filter: sepia(0.35) saturate(0.75) hue-rotate(350deg) brightness(1.45);
}

.v-start-action--download strong {
    color: #eee6d8;
}

.v-start-action:hover,
.v-start-action.is-active {
    padding-left: 10px;
    background-color: rgba(115, 66, 23, 0.23);
}

.v-frame {
    position: relative;
    border: 1px solid #5c421f;
    border-radius: 2px;
    background: var(--v-panel);
    box-shadow: inset 0 0 0 2px #080807, var(--v-shadow);
}

.v-frame::before {
    content: "";
    position: absolute;
    inset: 3px;
    z-index: 0;
    border: 1px solid rgba(185, 138, 53, 0.18);
    pointer-events: none;
}

.v-frame > * {
    position: relative;
    z-index: 1;
}

.v-welcome {
    min-height: 268px;
    overflow: hidden;
    background-color: #100b08;
    background-image:
        linear-gradient(90deg, rgba(20, 8, 5, 0.97) 0%, rgba(20, 8, 5, 0.9) 39%, rgba(12, 8, 6, 0.35) 62%, rgba(5, 5, 4, 0.08) 100%),
        url("images/vanguard/hero-fortress.webp?v=20260804-3");
    background-position: center, 70% center;
    background-size: cover;
}

.v-welcome-copy {
    display: flex;
    width: 59%;
    min-height: 268px;
    padding: 25px 25px 18px 35px;
    flex-direction: column;
    justify-content: center;
    text-shadow: 0 2px 4px #000;
}

.v-eyebrow {
    margin: 0;
    color: #dec27c;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 16px;
    text-transform: uppercase;
}

.v-welcome h1 {
    margin: 0;
    color: #e5b85a;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 39px;
    line-height: 1.08;
    text-transform: uppercase;
}

.v-welcome h3 {
    margin: 6px 0 9px;
    color: #e0b75c;
    font-family: Georgia, serif;
    font-size: 15px;
    text-transform: uppercase;
}

.v-welcome-copy > p:not(.v-eyebrow) {
    max-width: 510px;
    margin: 0;
    color: #dccdb5;
    font-size: 14px;
    line-height: 1.45;
}

.v-facts {
    display: grid;
    max-width: 550px;
    margin-top: 15px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 5px;
}

.v-facts > div {
    min-width: 0;
    padding: 8px 10px;
    border: 1px solid #503719;
    background: rgba(11, 9, 7, 0.82);
    box-shadow: inset 0 0 0 1px rgba(185, 138, 53, 0.12);
}

.v-facts span,
.v-facts strong {
    display: block;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.v-facts span {
    color: #aa956f;
    font-family: Arial, sans-serif;
    font-size: 9px;
    text-transform: uppercase;
}

.v-facts strong {
    margin-top: 2px;
    color: #eee2c8;
    font-size: 12px;
}

.v-section {
    margin-top: 13px;
}

.v-section-heading {
    display: flex;
    min-height: 31px;
    padding: 0 8px;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid #6b4d22;
}

.v-section-heading h2,
.v-section-heading h1 {
    font-size: 14px;
}

.v-section-heading > a {
    color: #b69a60 !important;
    font-family: Arial, sans-serif;
    font-size: 10px;
    text-decoration: none !important;
    text-transform: uppercase;
}

.v-section-heading > a:hover {
    color: var(--v-gold-bright) !important;
}

.v-feature-grid {
    display: grid;
    margin-top: 9px;
    grid-template-columns: repeat(6, minmax(0, 1fr));
    gap: 7px;
}

.v-feature-card {
    display: flex;
    min-width: 0;
    min-height: 174px;
    padding: 12px 9px 10px;
    align-items: center;
    flex-direction: column;
    color: var(--v-parchment) !important;
    text-align: center;
    text-decoration: none !important;
    transition: border-color 150ms ease, background-color 150ms ease, transform 150ms ease;
}

.v-feature-card:hover {
    border-color: #b88537;
    background: #19160f;
    transform: translateY(-2px);
}

.v-feature-icon {
    display: flex;
    width: 66px;
    height: 66px;
    margin-bottom: 8px;
    align-items: center;
    justify-content: center;
    border: 1px solid #5d431e;
    background: radial-gradient(circle, #2c2417 0%, #11100d 67%);
    box-shadow: inset 0 0 0 3px #080807, 0 3px 10px rgba(0, 0, 0, 0.65);
}

.v-feature-icon img {
    width: 58px;
    height: 58px;
    object-fit: contain;
}

.v-feature-card h3 {
    margin: 0 0 5px;
    color: var(--v-gold-bright);
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 13px;
    line-height: 1.2;
    text-transform: uppercase;
}

.v-feature-card p {
    margin: 0;
    color: #c8bca8;
    font-size: 12px;
    line-height: 1.3;
}

.v-section-action {
    display: flex;
    margin-top: 8px;
    justify-content: center;
}

.v-button,
.v-small-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #96672a;
    border-radius: 2px;
    color: #ead7af !important;
    background: linear-gradient(180deg, #68140e, #390a07);
    box-shadow: inset 0 0 0 2px #170403;
    font-family: "Vanguard Martel", Georgia, serif;
    text-decoration: none !important;
    text-transform: uppercase;
    transition: border-color 140ms ease, background-color 140ms ease;
}

.v-button {
    min-width: 230px;
    min-height: 31px;
    padding: 5px 20px;
    font-size: 11px;
}

.v-button span {
    margin-left: 17px;
    color: var(--v-gold-bright);
    font-size: 18px;
}

.v-button:hover,
.v-small-button:hover {
    border-color: var(--v-gold-bright);
    background: linear-gradient(180deg, #851d14, #4a0d08);
}

.v-news-grid {
    display: grid;
    margin-top: 8px;
    grid-template-columns: repeat(auto-fit, minmax(275px, 1fr));
    gap: 9px;
}

.v-news-card {
    display: grid;
    min-height: 132px;
    overflow: hidden;
    grid-template-columns: 88px minmax(0, 1fr);
    color: var(--v-ink);
    background: #dbc6a4;
}

.v-news-art {
    min-height: 132px;
    border-right: 1px solid #6b4c24;
    background-image:
        linear-gradient(rgba(30, 8, 4, 0.12), rgba(30, 8, 4, 0.42)),
        url("images/vanguard/hero-fortress.webp?v=20260804-3");
    background-position: 72% center;
    background-size: auto 155px;
}

.v-news-copy {
    padding: 10px 11px 8px;
}

.v-news-copy time {
    display: block;
    color: #63431d;
    font-family: Arial, sans-serif;
    font-size: 9px;
    font-weight: 700;
}

.v-news-copy h3 {
    margin: 2px 0 4px;
    color: #2b1a0e;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 14px;
    line-height: 1.2;
}

.v-news-copy p {
    margin: 0 0 5px;
    color: #473421;
    font-size: 11px;
    line-height: 1.3;
}

.v-news-copy a {
    color: #5c260b !important;
    font-family: Arial, sans-serif;
    font-size: 10px;
    font-weight: 700;
    text-decoration: none !important;
    text-transform: uppercase;
}

.v-empty-state {
    min-height: 90px;
    margin-top: 8px;
    padding: 30px;
    color: var(--v-parchment-muted);
    text-align: center;
}

.v-side-panel {
    padding-bottom: 10px;
}

.v-server-state {
    display: flex;
    padding: 13px 12px 4px;
    align-items: center;
    justify-content: center;
    color: var(--v-red);
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 13px;
    text-transform: uppercase;
}

.v-server-state.is-online {
    color: var(--v-green);
}

.v-player-count {
    margin: 4px 0 10px;
    color: #cab47d;
    font-family: Arial, sans-serif;
    font-size: 10px;
    text-align: center;
    text-transform: uppercase;
}

.v-player-count strong {
    color: #ecce80;
}

.v-small-button {
    width: calc(100% - 24px);
    min-height: 28px;
    margin: 0 12px;
    padding: 5px 8px;
    font-size: 10px;
}

.v-ranking-list {
    margin: 0;
    padding: 6px 9px 9px;
    list-style: none;
}

.v-ranking-list li {
    display: grid;
    min-height: 58px;
    grid-template-columns: 24px 48px minmax(0, 1fr);
    align-items: center;
    border-bottom: 1px solid rgba(185, 138, 53, 0.23);
}

.v-ranking-list li:last-child {
    border-bottom: 0;
}

.v-rank-number {
    color: var(--v-gold-bright);
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 14px;
    font-weight: 700;
    text-align: center;
}

.v-rank-avatar {
    display: flex;
    width: 48px;
    height: 52px;
    align-items: center;
    justify-content: center;
    overflow: hidden;
}

.v-rank-avatar img {
    max-width: 56px;
    max-height: 56px;
    object-fit: contain;
}

.v-rank-copy {
    display: flex;
    min-width: 0;
    padding-left: 7px;
    flex-direction: column;
}

.v-rank-copy a,
.v-rank-copy strong {
    overflow: hidden;
    color: #e4b85c !important;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 12px;
    line-height: 1.25;
    text-decoration: none !important;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.v-rank-copy small {
    color: #c2b399;
    font-family: Arial, sans-serif;
    font-size: 10px;
}

.v-empty-row {
    display: block !important;
    min-height: 0 !important;
    padding: 18px 6px;
    color: var(--v-parchment-muted);
    text-align: center;
}

.v-side-empty,
.v-boss-kill {
    display: flex;
    min-height: 86px;
    padding: 12px;
    align-items: center;
    justify-content: center;
    text-align: center;
}

.v-side-empty img,
.v-boss-kill > img {
    width: 56px;
    height: 56px;
    margin-right: 9px;
    object-fit: contain;
}

.v-side-empty p {
    margin: 0;
    color: #c7b89e;
    font-size: 12px;
}

.v-boss-kill {
    justify-content: flex-start;
    text-align: left;
}

.v-boss-kill div {
    display: flex;
    min-width: 0;
    flex-direction: column;
}

.v-boss-kill strong {
    color: var(--v-gold-bright);
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 12px;
    line-height: 1.2;
    text-transform: uppercase;
}

.v-boss-kill span,
.v-boss-kill small {
    color: #c5b49a;
    font-size: 10px;
}

.v-content-panel {
    min-height: 500px;
    overflow: hidden;
    padding: 7px;
    background: #11100e;
}

.v-content-heading {
    min-height: 40px;
    padding: 0 12px;
    background: linear-gradient(180deg, #241e15, #12110d);
}

.v-content-heading h1 {
    font-size: 17px;
}

.v-page-content {
    min-height: 430px;
    padding: 16px;
    overflow-x: auto;
    color: var(--v-ink);
    background: #e1cfaf;
    box-shadow: inset 0 0 20px rgba(75, 48, 23, 0.28);
}

.v-page-content a {
    color: #5c260b !important;
}

.v-static-copy {
    width: min(820px, 100%);
    margin: 0 auto;
    color: #2e2117;
    font-family: "Vanguard Martel", Georgia, serif;
    font-size: 14px;
    line-height: 1.65;
}

.v-static-copy > p:first-child {
    margin-top: 0;
    color: #4b2b17;
    font-size: 15px;
}

.v-static-copy section + section {
    margin-top: 22px;
    padding-top: 18px;
    border-top: 1px solid rgba(86, 48, 18, 0.28);
}

.v-static-copy h2 {
    margin: 0 0 8px;
    color: #5a2800;
    font-size: 18px;
}

.v-static-copy p,
.v-static-copy ul {
    margin: 0 0 12px;
}

.v-static-copy ul {
    padding-left: 20px;
}

.v-static-copy li + li {
    margin-top: 5px;
}

.v-static-note {
    padding: 12px 14px;
    border-left: 3px solid #7a3d11;
    background: rgba(91, 46, 14, 0.08);
}

.v-page-content img {
    height: auto;
}

.v-page-content table {
    max-width: 100%;
}

.v-page-content .InnerTableContainer,
.v-page-content .TableContent {
    font-size: 13px;
    line-height: 1.4;
}

.v-page-content .v-item-image-fallback {
    opacity: 0.58;
}

.v-page-content .Box,
.v-page-content .Border_2,
.v-page-content .Border_3,
.v-page-content .BoxContent {
    width: auto;
    min-width: 0;
}

/* Typography and color system matched to the approved composition. */
.v-hero-copy p,
.v-hero-title,
.v-hero-tags,
.v-action strong,
.v-announcement > strong,
.v-panel-title,
.v-start-action strong,
.v-eyebrow,
.v-welcome h1,
.v-welcome h3,
.v-section-heading h1,
.v-section-heading h2,
.v-feature-card h3,
.v-button,
.v-small-button,
.v-news-copy h3,
.v-server-state,
.v-rank-number,
.v-rank-copy a,
.v-rank-copy strong,
.v-boss-kill strong,
.v-content-heading h1,
.v-static-copy h2 {
    font-family: var(--v-font-display);
    font-weight: 700;
    letter-spacing: 0;
}

.v-hero-copy p,
.v-hero-title,
.v-hero-tags,
.v-action strong,
.v-announcement > strong,
.v-panel-title,
.v-start-action strong,
.v-eyebrow,
.v-welcome h1,
.v-welcome h3,
.v-section-heading h1,
.v-section-heading h2,
.v-feature-card h3,
.v-button,
.v-small-button,
.v-server-state,
.v-rank-number,
.v-rank-copy a,
.v-rank-copy strong,
.v-boss-kill strong,
.v-content-heading h1 {
    text-shadow: 0 1px 0 rgba(18, 10, 4, 0.98), 0 0 6px rgba(168, 112, 38, 0.14);
}

.v-action small,
.v-inline-status,
.v-facts span,
.v-section-heading > a,
.v-news-copy time,
.v-news-copy a,
.v-player-count,
.v-rank-copy small,
.v-footer {
    font-family: var(--v-font-body);
}

.v-hero-copy p,
.v-hero-title,
.v-panel-title,
.v-section-heading h1,
.v-section-heading h2,
.v-feature-card h3,
.v-rank-number,
.v-boss-kill strong,
.v-content-heading h1 {
    color: var(--v-gold-bright);
}

.v-hero-tags {
    color: #dfc17d;
}

.v-action strong,
.v-start-action strong,
.v-button,
.v-small-button {
    color: #efd39a !important;
}

.v-action small,
.v-start-action small {
    color: #cbb88f;
}

.v-announcement,
.v-nav-link,
.v-welcome-copy > p:not(.v-eyebrow),
.v-feature-card p,
.v-side-empty p,
.v-boss-kill span,
.v-boss-kill small {
    color: #c9bda8;
}

.v-nav-link {
    font-family: var(--v-font-body);
    font-size: 13px;
}

.v-welcome h1 {
    color: #e9b95d;
}

.v-welcome h3,
.v-feature-card h3,
.v-rank-copy a,
.v-rank-copy strong {
    color: #dfb45d !important;
}

.v-facts strong {
    color: #e4d7bf;
}

.v-news-copy time {
    color: #6a471f;
}

.v-news-copy h3 {
    color: #2d1b0d;
}

.v-news-copy p {
    color: #493522;
}

.v-page-content,
.v-page-content table,
.v-page-content input,
.v-page-content select,
.v-page-content textarea,
.v-page-content button {
    color: var(--v-ink);
    font-family: var(--v-font-body);
}

.v-page-content h1,
.v-page-content h2,
.v-page-content h3,
.v-page-content h4,
.v-page-content h5,
.v-page-content h6 {
    color: #54280e;
    font-family: var(--v-font-display);
    letter-spacing: 0;
}

.v-page-content th {
    font-family: var(--v-font-display);
    letter-spacing: 0;
}

.v-page-content .fa {
    font-family: FontAwesome !important;
}

.v-page-content .glyphicon {
    font-family: "Glyphicons Halflings" !important;
}

.v-footer {
    margin-top: 17px;
    border-top: 1px solid #4e371b;
    color: #a99d88;
    background: rgba(7, 8, 7, 0.97);
    box-shadow: 0 -4px 16px rgba(0, 0, 0, 0.55);
    font-family: var(--v-font-body);
    font-size: 10px;
}

.v-footer > div {
    display: flex;
    width: min(var(--v-max), calc(100% - 36px));
    min-height: 43px;
    margin: 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 18px;
}

.v-footer nav {
    display: flex;
    align-items: center;
}

.v-footer nav a {
    padding: 0 13px;
    border-left: 1px solid #65471f;
    color: #c6b9a2 !important;
    text-decoration: none !important;
}

.v-footer nav a:last-child {
    border-right: 1px solid #65471f;
}

.v-footer-credit {
    color: #887d6b;
    text-align: right;
}

.v-footer-credit a {
    color: #aa946a !important;
}

.vanguard-site a:focus-visible,
.vanguard-site button:focus-visible,
.vanguard-site input:focus-visible,
.vanguard-site select:focus-visible,
.vanguard-site textarea:focus-visible {
    outline: 2px solid var(--v-gold-bright);
    outline-offset: 2px;
}

/* Homepage ornamental finish. These overrides stay scoped away from MyAAC inner pages. */
.vanguard-home .v-hero {
    border-bottom-color: #7e5928;
    box-shadow:
        inset 0 -1px 0 rgba(218, 165, 76, 0.24),
        inset 0 -14px 24px rgba(0, 0, 0, 0.32),
        0 10px 32px rgba(0, 0, 0, 0.88);
}

.vanguard-home .v-hero::after {
    height: 6px;
    background:
        linear-gradient(180deg, rgba(235, 188, 93, 0.42), transparent 1px),
        linear-gradient(90deg, #140e07, #7d5623 26%, #c48d3a 48%, #24160a 50%, #c48d3a 52%, #7d5623 74%, #140e07);
    box-shadow: 0 2px 0 #030303, 0 -1px 0 rgba(0, 0, 0, 0.8);
}

.vanguard-home .v-hero-shade {
    background:
        linear-gradient(90deg, rgba(3, 4, 4, 0.28) 0%, rgba(4, 5, 5, 0.18) 38%, rgba(4, 5, 5, 0.04) 68%, rgba(3, 3, 3, 0.22) 100%),
        linear-gradient(0deg, rgba(3, 3, 2, 0.91) 0%, rgba(3, 3, 2, 0.04) 62%);
}

.vanguard-home .v-hero-copy p,
.vanguard-home .v-hero-title {
    background: none;
    color: #edc777;
    -webkit-text-fill-color: #edc777;
    filter: none;
    text-shadow: 0 2px 1px #000, 0 0 7px rgba(198, 139, 47, 0.24);
}

.vanguard-home .v-hero-title {
    position: relative;
}

.vanguard-home .v-hero-title::after {
    content: "";
    position: absolute;
    right: 0;
    bottom: -8px;
    left: 0;
    height: 2px;
    background: linear-gradient(90deg, #2b1d0d, #9a6c2e 14%, #d1a454 50%, #9a6c2e 86%, transparent);
    box-shadow: 0 1px 0 rgba(0, 0, 0, 0.9);
}

.vanguard-home .v-hero-tags {
    margin-top: 16px;
    text-shadow: 0 1px 2px #000, 0 0 7px rgba(174, 117, 40, 0.18);
}

.vanguard-home .v-hero-tags span:not(:last-child)::after {
    width: 5px;
    height: 5px;
    margin: 0 16px;
    background: #cf9b43;
    box-shadow: 0 0 0 1px #513414, 0 0 5px rgba(211, 156, 67, 0.32);
    content: "";
    flex: 0 0 5px;
    transform: rotate(45deg);
}

.vanguard-home .v-action {
    isolation: isolate;
    border-color: #8a622b;
    background-image:
        radial-gradient(circle at 50% -20%, rgba(210, 164, 81, 0.13), transparent 57%),
        var(--v-surface-grain),
        linear-gradient(180deg, #292a25 0%, #171815 47%, #080a09 100%);
    box-shadow:
        inset 0 0 0 2px #070706,
        inset 0 0 0 3px rgba(191, 137, 53, 0.2),
        inset 0 2px 0 rgba(255, 225, 157, 0.14),
        inset 0 -3px 5px rgba(0, 0, 0, 0.74),
        0 4px 10px rgba(0, 0, 0, 0.78);
}

.vanguard-home .v-action::before {
    position: absolute;
    z-index: 0;
    inset: 5px;
    border-top: 1px solid rgba(236, 200, 132, 0.12);
    border-bottom: 1px solid rgba(0, 0, 0, 0.72);
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.18), transparent 15%, transparent 85%, rgba(0, 0, 0, 0.18));
    content: "";
    pointer-events: none;
}

.vanguard-home .v-action::after {
    border-color: rgba(210, 158, 66, 0.34);
    box-shadow: inset 0 0 5px rgba(0, 0, 0, 0.62);
}

.vanguard-home .v-action-primary {
    border-color: #c18c37;
    background-image:
        radial-gradient(circle at 50% -15%, rgba(255, 186, 82, 0.18), transparent 58%),
        var(--v-surface-grain),
        linear-gradient(180deg, #8b2118 0%, #64140f 46%, #330806 100%);
}

.vanguard-home .v-action-account {
    background-image:
        radial-gradient(circle at 50% -20%, rgba(227, 177, 90, 0.15), transparent 58%),
        var(--v-surface-grain),
        linear-gradient(180deg, #30281c 0%, #1e1b15 50%, #0b0b09 100%);
}

.vanguard-home .v-action-download {
    background-image:
        radial-gradient(circle at 50% -20%, rgba(151, 188, 203, 0.12), transparent 58%),
        var(--v-surface-grain),
        linear-gradient(180deg, #26323a 0%, #182127 48%, #090e11 100%);
}

.vanguard-home .v-action-discord {
    background-image:
        radial-gradient(circle at 50% -20%, rgba(115, 130, 190, 0.14), transparent 58%),
        var(--v-surface-grain),
        linear-gradient(180deg, #252a32 0%, #171b21 48%, #090b0e 100%);
}

.vanguard-home .v-action:hover {
    border-color: #e0b459;
    filter: brightness(1.08);
}

.vanguard-home .v-action:active {
    box-shadow:
        inset 0 0 0 2px #070706,
        inset 0 4px 9px rgba(0, 0, 0, 0.74),
        0 2px 5px rgba(0, 0, 0, 0.72);
}

.vanguard-home .v-action img {
    filter: drop-shadow(0 2px 2px rgba(0, 0, 0, 0.86));
}

.vanguard-home .v-action-account img {
    filter: brightness(0) saturate(100%) invert(77%) sepia(31%) saturate(830%) hue-rotate(355deg) brightness(95%) contrast(87%) drop-shadow(0 2px 2px rgba(0, 0, 0, 0.86));
}

.vanguard-home .v-page {
    background-image: linear-gradient(90deg, transparent, rgba(175, 119, 43, 0.035) 50%, transparent);
}

.vanguard-home .v-nav-section,
.vanguard-home .v-side-panel,
.vanguard-home .v-feature-card {
    border-color: #66491f;
    background-image:
        radial-gradient(circle at 50% -20%, rgba(185, 137, 53, 0.11), transparent 52%),
        var(--v-surface-grain),
        linear-gradient(180deg, rgba(25, 24, 19, 0.99), rgba(9, 10, 9, 0.995));
    box-shadow:
        inset 0 0 0 2px #070706,
        inset 0 0 18px rgba(0, 0, 0, 0.64),
        0 6px 18px rgba(0, 0, 0, 0.66);
}

.vanguard-home .v-frame::before {
    inset: 3px;
    border-color: rgba(203, 150, 61, 0.27);
    box-shadow: inset 0 0 7px rgba(0, 0, 0, 0.72);
}

.vanguard-home .v-frame::after,
.vanguard-home .v-nav-section::after,
.vanguard-home .v-announcement::after {
    position: absolute;
    z-index: 4;
    inset: 2px;
    background:
        linear-gradient(var(--v-edge-highlight), var(--v-edge-highlight)) left top / 14px 1px no-repeat,
        linear-gradient(var(--v-edge-highlight), var(--v-edge-highlight)) left top / 1px 14px no-repeat,
        linear-gradient(var(--v-edge-highlight), var(--v-edge-highlight)) right top / 14px 1px no-repeat,
        linear-gradient(var(--v-edge-highlight), var(--v-edge-highlight)) right top / 1px 14px no-repeat,
        linear-gradient(#68471e, #68471e) left bottom / 14px 1px no-repeat,
        linear-gradient(#68471e, #68471e) left bottom / 1px 14px no-repeat,
        linear-gradient(#68471e, #68471e) right bottom / 14px 1px no-repeat,
        linear-gradient(#68471e, #68471e) right bottom / 1px 14px no-repeat;
    content: "";
    opacity: 0.92;
    pointer-events: none;
}

.vanguard-home .v-nav-section > *,
.vanguard-home .v-announcement > * {
    position: relative;
    z-index: 1;
}

.vanguard-home .v-panel-title {
    border-bottom-color: #745324;
    background-image:
        var(--v-surface-grain),
        linear-gradient(180deg, #2b2419 0%, #18150f 48%, #0d0d0b 100%);
    box-shadow: inset 0 1px 0 rgba(235, 197, 119, 0.1), inset 0 -2px 5px rgba(0, 0, 0, 0.68);
    text-shadow: 0 1px 0 #000, 0 0 7px rgba(188, 132, 47, 0.18);
}

.vanguard-home .v-panel-title::before,
.vanguard-home .v-panel-title::after {
    width: 20px;
    height: 5px;
    background: linear-gradient(90deg, transparent, #9b6c2d 35%, #d4a04b 50%, #9b6c2d 65%, transparent);
    clip-path: polygon(0 40%, 38% 40%, 50% 0, 62% 40%, 100% 40%, 100% 60%, 62% 60%, 50% 100%, 38% 60%, 0 60%);
    transform: translateY(-50%);
}

.vanguard-home .v-nav-list {
    background: linear-gradient(90deg, rgba(0, 0, 0, 0.16), transparent 50%, rgba(0, 0, 0, 0.16));
}

.vanguard-home .v-nav-link {
    border-bottom-color: rgba(163, 116, 49, 0.31);
    background: linear-gradient(180deg, rgba(255, 255, 255, 0.018), rgba(0, 0, 0, 0.09));
    box-shadow: inset 0 1px 0 rgba(255, 235, 193, 0.018);
}

.vanguard-home .v-nav-link:hover,
.vanguard-home .v-nav-link.is-active {
    background: linear-gradient(90deg, rgba(121, 70, 23, 0.34), rgba(89, 50, 18, 0.13));
    box-shadow: inset 3px 0 0 #a8762f, inset 0 1px 0 rgba(239, 198, 114, 0.06);
}

.vanguard-home .v-start-action {
    border-color: #8f672b;
    box-shadow:
        inset 0 0 0 2px #080706,
        inset 0 0 0 3px rgba(204, 151, 61, 0.2),
        inset 0 2px 0 rgba(255, 223, 151, 0.11),
        inset 0 -3px 5px rgba(0, 0, 0, 0.64),
        0 3px 8px rgba(0, 0, 0, 0.58);
}

.vanguard-home .v-start-action--primary {
    background-image: var(--v-surface-grain), linear-gradient(180deg, #8a2118 0%, #59110c 52%, #2e0705 100%);
}

.vanguard-home .v-start-action--download {
    background-image: var(--v-surface-grain), linear-gradient(180deg, #283640 0%, #182229 52%, #090e11 100%);
}

.vanguard-home .v-announcement {
    position: relative;
    isolation: isolate;
    border-color: #65491f;
    background-image:
        radial-gradient(circle at 18% -100%, rgba(204, 151, 62, 0.11), transparent 42%),
        var(--v-surface-grain),
        linear-gradient(180deg, #1d1b16 0%, #0b0c0a 100%);
    box-shadow:
        inset 0 0 0 2px #070706,
        inset 0 1px 0 rgba(239, 199, 117, 0.08),
        0 4px 12px rgba(0, 0, 0, 0.58);
}

.vanguard-home .v-announcement-icon {
    position: relative;
    flex: 0 0 17px;
    width: 17px;
    height: 17px;
    border: 0;
    border-radius: 0;
    background: none;
    box-shadow: none;
}

.vanguard-home .v-announcement-icon::before {
    position: absolute;
    top: 1px;
    left: 0;
    width: 16px;
    height: 12px;
    background: linear-gradient(180deg, #efc267, #9a6927);
    clip-path: polygon(0 34%, 35% 34%, 100% 0, 100% 78%, 35% 51%, 0 51%);
    content: "";
    filter: drop-shadow(0 1px 1px #000);
}

.vanguard-home .v-announcement-icon::after {
    position: absolute;
    top: 9px;
    left: 5px;
    width: 3px;
    height: 7px;
    background: #b17a31;
    content: "";
    transform: rotate(-16deg);
}

.vanguard-home .v-separator {
    width: 5px;
    height: 5px;
    margin: 0 15px;
    background: #bf8a38;
    box-shadow: 0 0 0 1px #35220e;
    flex: 0 0 5px;
    transform: rotate(45deg);
}

.vanguard-home .v-welcome {
    border-color: #745326;
    box-shadow:
        inset 0 0 0 2px #070605,
        inset 0 0 28px rgba(0, 0, 0, 0.66),
        0 7px 20px rgba(0, 0, 0, 0.68);
}

.vanguard-home .v-welcome-copy {
    background: linear-gradient(90deg, rgba(35, 10, 6, 0.33), transparent 92%);
}

.vanguard-home .v-welcome h1 {
    font-size: 42px;
}

.vanguard-home .v-facts > div {
    border-color: #65471f;
    background-image: var(--v-surface-grain), linear-gradient(180deg, rgba(24, 19, 13, 0.9), rgba(7, 7, 6, 0.9));
    box-shadow: inset 0 0 0 1px rgba(203, 147, 54, 0.2), inset 0 1px 0 rgba(255, 226, 162, 0.06), 0 2px 6px rgba(0, 0, 0, 0.48);
}

.vanguard-home .v-section-heading {
    position: relative;
    border-bottom-color: #775525;
    background-image: linear-gradient(90deg, rgba(161, 109, 39, 0.06), transparent 44%, rgba(161, 109, 39, 0.04));
    box-shadow: 0 1px 0 #030303;
}

.vanguard-home .v-section-heading h2 {
    display: flex;
    align-items: center;
}

.v-heading-mark {
    display: inline-block;
    width: 6px;
    height: 6px;
    margin-right: 7px;
    border: 1px solid #d2a04c;
    box-shadow: inset 0 0 0 1px #3b250e, 0 0 4px rgba(202, 146, 55, 0.24);
    flex: 0 0 6px;
    transform: rotate(45deg);
}

.vanguard-home .v-feature-card {
    overflow: hidden;
    border-color: #6d4d20;
}

.vanguard-home .v-feature-card:hover {
    border-color: #c18d3c;
    background-image:
        radial-gradient(circle at 50% -20%, rgba(209, 157, 63, 0.17), transparent 54%),
        var(--v-surface-grain),
        linear-gradient(180deg, #292318, #100f0b);
}

.vanguard-home .v-feature-icon {
    position: relative;
    border-color: #8a6229;
    background-image:
        radial-gradient(circle at 46% 35%, rgba(196, 144, 54, 0.18), transparent 38%),
        var(--v-surface-grain),
        linear-gradient(145deg, #2e2619, #0b0b09 66%);
    box-shadow:
        inset 0 0 0 3px #070706,
        inset 0 0 0 4px rgba(196, 143, 53, 0.2),
        inset 0 0 13px rgba(0, 0, 0, 0.72),
        0 4px 10px rgba(0, 0, 0, 0.72);
}

.vanguard-home .v-feature-icon::before {
    position: absolute;
    inset: 4px;
    border: 1px solid rgba(219, 165, 71, 0.22);
    content: "";
    pointer-events: none;
}

.vanguard-home .v-button,
.vanguard-home .v-small-button {
    position: relative;
    border-color: #b57d2e;
    background-image:
        radial-gradient(circle at 50% -30%, rgba(255, 191, 90, 0.2), transparent 58%),
        var(--v-surface-grain),
        linear-gradient(180deg, #7d1b13 0%, #54100b 48%, #2b0705 100%);
    box-shadow:
        inset 0 0 0 2px #160302,
        inset 0 0 0 3px rgba(204, 148, 55, 0.2),
        inset 0 2px 0 rgba(255, 217, 136, 0.13),
        inset 0 -3px 5px rgba(0, 0, 0, 0.68),
        0 3px 8px rgba(0, 0, 0, 0.62);
}

.vanguard-home .v-button:hover,
.vanguard-home .v-small-button:hover {
    border-color: #e1b055;
    background-image:
        radial-gradient(circle at 50% -30%, rgba(255, 198, 100, 0.24), transparent 58%),
        var(--v-surface-grain),
        linear-gradient(180deg, #98241a 0%, #68140e 48%, #350806 100%);
}

.vanguard-home .v-button:active,
.vanguard-home .v-small-button:active {
    box-shadow: inset 0 0 0 2px #160302, inset 0 4px 8px rgba(0, 0, 0, 0.74), 0 1px 3px rgba(0, 0, 0, 0.62);
    transform: translateY(1px);
}

.vanguard-home .v-news-card {
    border-color: #765329;
    background-color: #dbc5a1;
    background-image:
        radial-gradient(circle at 18% 15%, rgba(255, 245, 211, 0.52), transparent 35%),
        radial-gradient(circle at 88% 82%, rgba(117, 70, 28, 0.17), transparent 43%),
        repeating-linear-gradient(8deg, rgba(70, 42, 20, 0.028) 0 1px, transparent 1px 4px),
        linear-gradient(135deg, #e7d6b8 0%, #d7c09a 54%, #cbb087 100%);
    box-shadow:
        inset 0 0 0 2px #362312,
        inset 0 0 0 3px rgba(226, 190, 124, 0.42),
        inset 0 0 16px rgba(88, 50, 21, 0.2),
        0 5px 13px rgba(0, 0, 0, 0.62);
}

.vanguard-home .v-news-art {
    position: relative;
    border-right: 3px double #67451f;
    box-shadow: inset 0 0 0 3px rgba(31, 18, 9, 0.58), inset 0 0 11px rgba(0, 0, 0, 0.6);
}

.vanguard-home .v-news-art::after {
    position: absolute;
    inset: 4px;
    border: 1px solid rgba(215, 166, 80, 0.32);
    content: "";
    pointer-events: none;
}

.vanguard-home .v-server-state,
.vanguard-home .v-player-count {
    background: linear-gradient(90deg, transparent, rgba(0, 0, 0, 0.2) 50%, transparent);
}

.vanguard-home .v-ranking-list li {
    border-bottom-color: rgba(185, 138, 53, 0.3);
    background: linear-gradient(90deg, rgba(181, 128, 46, 0.025), transparent 28%, rgba(0, 0, 0, 0.12));
}

.vanguard-home .v-rank-avatar {
    position: relative;
    width: 48px;
    height: 52px;
}

.vanguard-home .v-rank-avatar img {
    width: 64px;
    max-width: none;
    height: 64px;
    max-height: none;
    flex: 0 0 64px;
    transform: translate(-16px, -16px);
}

.vanguard-home .v-rank-copy small {
    color: #cdbb95;
    font-family: var(--v-font-body);
    line-height: 1.25;
}

.vanguard-home .v-side-empty,
.vanguard-home .v-boss-kill {
    background-image: radial-gradient(circle at center, rgba(153, 104, 35, 0.05), transparent 66%), var(--v-surface-grain);
}

.vanguard-home .v-side-empty img,
.vanguard-home .v-boss-kill > img {
    border: 1px solid #68491f;
    background: radial-gradient(circle, #2a2115, #0a0a08 70%);
    box-shadow: inset 0 0 0 3px #070706, inset 0 0 0 4px rgba(196, 143, 53, 0.16), 0 3px 8px rgba(0, 0, 0, 0.58);
}

.vanguard-home .v-footer {
    border-top-color: #68491f;
    background-image: var(--v-surface-grain), linear-gradient(180deg, rgba(13, 13, 11, 0.99), rgba(5, 6, 5, 0.99));
    box-shadow: inset 0 1px 0 rgba(214, 160, 67, 0.07), 0 -4px 16px rgba(0, 0, 0, 0.55);
}

@media (max-width: 1499px) {
    :root {
        --v-left: 208px;
        --v-right: 224px;
        --v-gap: 12px;
    }

    .v-hero-inner {
        padding-right: 18px;
        padding-left: 18px;
    }

    .v-brand {
        top: 25px;
        left: 24px;
        width: 330px;
        height: 156px;
    }

    .v-brand img {
        max-height: 148px;
    }

    .v-hero-copy {
        left: 34%;
        width: min(470px, calc(66% - 240px));
    }

    .v-actions {
        right: 274px;
        left: 358px;
    }

    .v-action {
        padding-right: 6px;
        padding-left: 6px;
    }

    .v-action img {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
        margin-right: 5px;
    }

    .v-action strong {
        font-size: 11.5px;
    }

    .v-announcement {
        font-size: 12px;
    }
}

@media (max-width: 1365px) {
    .v-actions {
        right: 20px;
        left: 300px;
    }
}

@media (max-width: 1400px) and (min-width: 1241px) {
    .v-action strong {
        font-size: 10.75px;
    }
}

@media (max-width: 1240px) {
    .v-feature-grid {
        grid-template-columns: repeat(3, minmax(0, 1fr));
    }

    .v-feature-card {
        min-height: 145px;
    }
}

@media (max-width: 1100px) {
    .v-actions {
        right: 20px;
        left: 300px;
    }

    .v-hero-copy {
        left: 340px;
        width: calc(100% - 370px);
    }

    .v-status-count {
        display: none;
    }
}

@media (max-width: 1099px) {
    body.vanguard-site {
        background-attachment: scroll;
    }

    html.v-nav-open,
    body.v-nav-open {
        overflow: hidden;
    }

    .v-hero {
        min-height: 344px;
    }

    .v-hero-inner {
        min-height: 344px;
    }

    .v-brand {
        top: 0;
        left: 16px;
        width: 290px;
        height: 132px;
    }

    .v-brand img {
        max-height: 130px;
    }

    .v-hero-copy {
        top: 39px;
        right: 70px;
        left: 330px;
        width: auto;
    }

    .v-hero-copy p {
        font-size: 17px;
    }

    .v-hero-title {
        font-size: 24px;
    }

    .v-actions {
        right: 18px;
        bottom: 14px;
        left: 18px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .v-mobile-toggle {
        position: absolute;
        top: 16px;
        right: 16px;
        display: flex;
        width: 42px;
        height: 38px;
        padding: 8px;
        flex-direction: column;
        justify-content: space-between;
        border: 1px solid #8c6227;
        border-radius: 2px;
        background: #161511;
        cursor: pointer;
    }

    .v-mobile-toggle > span:not(.sr-only) {
        display: block;
        width: 100%;
        height: 2px;
        background: var(--v-gold-bright);
    }

    .v-page {
        width: min(100% - 22px, 900px);
        padding-top: 9px;
    }

    .v-announcement {
        min-height: 48px;
    }

    .v-announcement-copy {
        white-space: normal;
    }

    .v-layout {
        grid-template-columns: minmax(0, 1fr);
    }

    .v-left-sidebar {
        position: fixed;
        top: 0;
        bottom: 0;
        left: 0;
        z-index: 1001;
        display: block;
        width: min(330px, calc(100% - 46px));
        padding: 48px 12px 18px;
        overflow-y: auto;
        background: #0b0b09;
        box-shadow: 12px 0 34px rgba(0, 0, 0, 0.85);
        transform: translateX(-105%);
        transition: transform 180ms ease;
        scrollbar-color: #765225 #0b0b09;
        scrollbar-width: thin;
    }

    .v-left-sidebar::-webkit-scrollbar {
        width: 7px;
    }

    .v-left-sidebar::-webkit-scrollbar-track {
        background: #0b0b09;
    }

    .v-left-sidebar::-webkit-scrollbar-thumb {
        border: 1px solid #0b0b09;
        background: #765225;
    }

    .v-left-sidebar .v-nav-section {
        margin-bottom: 12px;
    }

    .v-nav-open .v-left-sidebar {
        transform: translateX(0);
    }

    .v-mobile-close {
        position: absolute;
        top: 8px;
        right: 10px;
        display: block;
        width: 34px;
        height: 34px;
        padding: 0;
        border: 1px solid #795526;
        color: var(--v-gold-bright);
        background: #171511;
        font-size: 26px;
        line-height: 1;
        cursor: pointer;
    }

    .v-nav-scrim {
        position: fixed;
        inset: 0;
        z-index: 1000;
        display: block;
        visibility: hidden;
        background: rgba(0, 0, 0, 0.72);
        opacity: 0;
        transition: opacity 180ms ease, visibility 180ms ease;
    }

    .v-nav-open .v-nav-scrim {
        visibility: visible;
        opacity: 1;
    }

    .v-right-sidebar {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .v-welcome-copy {
        width: 67%;
    }

    .v-footer > div {
        width: calc(100% - 22px);
        padding: 10px 0;
        flex-wrap: wrap;
        justify-content: center;
        text-align: center;
    }
}

@media (max-width: 640px) {
    .v-hero {
        min-height: 420px;
        background-position: 62% center;
    }

    .v-hero-inner {
        min-height: 420px;
        padding: 0 11px;
    }

    .v-brand {
        top: 3px;
        left: 10px;
        width: 250px;
        height: 116px;
    }

    .v-brand img {
        max-height: 114px;
    }

    .v-hero-copy {
        top: 119px;
        right: 12px;
        left: 12px;
        text-align: center;
    }

    .v-hero-copy p {
        font-size: 16px;
    }

    .v-hero-title {
        font-size: 22px;
    }

    .v-hero-tags {
        justify-content: center;
        font-size: 11px;
    }

    .v-hero-tags span:not(:last-child)::after {
        margin: 0 7px;
    }

    .v-actions {
        right: 10px;
        bottom: 12px;
        left: 10px;
        gap: 6px;
    }

    .v-action {
        height: 64px;
        padding: 7px;
    }

    .v-action img {
        flex-basis: 32px;
        width: 32px;
        height: 32px;
    }

    .v-action strong {
        font-size: 11px;
    }

    .v-action small {
        font-size: 9px;
    }

    .v-announcement {
        display: grid;
        grid-template-columns: 18px auto minmax(0, 1fr);
        gap: 5px;
    }

    .v-announcement-icon {
        margin: 0;
    }

    .v-announcement > strong {
        margin: 0;
    }

    .v-inline-status {
        grid-column: 1 / -1;
        margin: 3px 0 0 23px;
    }

    .v-welcome {
        min-height: 330px;
        background-position: center, 66% center;
    }

    .v-welcome-copy {
        width: 100%;
        min-height: 330px;
        padding: 26px 21px 18px;
        background: rgba(21, 9, 6, 0.72);
    }

    .v-welcome h1 {
        font-size: 31px;
    }

    .v-facts {
        grid-template-columns: 1fr;
    }

    .v-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .v-feature-card {
        min-height: 168px;
    }

    .v-page-content {
        padding-right: 8px;
        padding-left: 8px;
        overflow-x: hidden;
    }

    .v-page-content .TableContainer,
    .v-page-content .TableContainer .Table1,
    .v-page-content .TableContainer .Table2,
    .v-page-content .TableContainer .Table3,
    .v-page-content .TableContainer .Table4,
    .v-page-content .TableContainer .Table5,
    .v-page-content .TableContainer table {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .v-page-content .TableContainer td {
        min-width: 0 !important;
        overflow-wrap: anywhere;
    }

    .v-page-content .LabelV,
    .v-page-content [class^="LabelV"] {
        width: 105px !important;
    }

    .v-page-content input:not([type="checkbox"]):not([type="radio"]):not([type="image"]):not([type="submit"]):not([type="button"]),
    .v-page-content select,
    .v-page-content textarea {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
    }

    .v-page-content .OptionContainer {
        display: inline-flex;
        margin: 3px 10px 3px 0 !important;
        align-items: center;
    }

    .v-page-content .DoNotBreak {
        white-space: normal;
    }

    .v-news-grid,
    .v-right-sidebar {
        grid-template-columns: minmax(0, 1fr);
    }

    .v-news-card {
        grid-template-columns: 78px minmax(0, 1fr);
    }

    .v-footer nav {
        flex-wrap: wrap;
        justify-content: center;
    }

    .v-footer-credit {
        width: 100%;
        text-align: center;
    }
}

@media (prefers-reduced-motion: reduce) {
    *,
    *::before,
    *::after {
        scroll-behavior: auto !important;
        transition-duration: 0.01ms !important;
        animation-duration: 0.01ms !important;
        animation-iteration-count: 1 !important;
    }
}
