/* Vanity public-site visual system: black and white surfaces with restrained cyan accents. */
:root {
  --v-ink: #101010;
  --v-deep: #171717;
  --v-panel: #1a1a1a;
  --v-panel-raised: #222222;
  --v-line: #2b2b2b;
  --v-text: #f2f2f2;
  --v-muted: #a6a6a6;
  --v-soft: #777777;
  --v-brand: #f2f2f2;
  --v-brand-deep: #bdbdbd;
  --v-brand-light: #ffffff;
  --v-glow: rgba(102, 102, 102,  .3);
  --v-radius: 18px;
}

body[data-design="vanity-2026"] {
  background: var(--v-ink) !important;
  color: var(--v-text) !important;
  color-scheme: dark;
  font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif;
  --clr-bg: var(--v-ink);
  --clr-bg2: var(--v-deep);
  --clr-surface: var(--v-panel);
  --clr-surface2: var(--v-panel-raised);
  --clr-green: var(--v-brand);
  --clr-green2: var(--v-brand-light);
  --clr-teal: var(--v-brand);
  --clr-green-dim: var(--v-brand-deep);
  --clr-white: var(--v-text);
  --clr-grey: var(--v-muted);
  --clr-grey2: var(--v-soft);
  --clr-border: var(--v-line);
  --lg-accent: var(--v-brand);
}
body[data-design="vanity-2026"] ::selection { color: #ffffff; background: var(--v-brand-deep); }
body[data-design="vanity-2026"] :focus-visible { outline: 2px solid #ffffff; outline-offset: 3px; }
body[data-design="vanity-2026"] a { transition: color .2s ease, border-color .2s ease, background .2s ease, transform .2s ease; }

/* Floating site navigation. */
body[data-design="vanity-2026"] .nav {
  height: 72px; padding: 0 clamp(16px, 4vw, 62px); background: rgba(16, 16, 16,  .76);
  border: 1px solid rgba(242, 242, 242,  .12); border-radius: 15px; inset: 14px clamp(14px, 3vw, 48px) auto;
  width: auto; backdrop-filter: blur(18px); -webkit-backdrop-filter: blur(18px);
  box-shadow: 0 12px 40px rgba(0, 0, 0,  .18);
}
body[data-design="vanity-2026"] .nav.scrolled { background: rgba(16, 16, 16,  .96); border-color: rgba(242, 242, 242,  .09); }
body[data-design="vanity-2026"] .nav__container { width: 100%; max-width: 1420px; margin: 0 auto; }
body[data-design="vanity-2026"] .nav__logo-text,
body[data-design="vanity-2026"] .nav__logo-wrap > span:first-child { color: var(--v-text) !important; font-size: 1.14rem; letter-spacing: .035em; }
body[data-design="vanity-2026"] .nav__logo-sub,
body[data-design="vanity-2026"] .nav__logo-wrap > span:last-child { color: #a6a6a6 !important; letter-spacing: .13em; }
body[data-design="vanity-2026"] .nav__links { gap: clamp(14px, 2.2vw, 34px); }
body[data-design="vanity-2026"] .nav__links a { color: #d9d9d9; font-size: .88rem; }
body[data-design="vanity-2026"] .nav__links a:hover,
body[data-design="vanity-2026"] .nav__links a.active { color: #ffffff; }
body[data-design="vanity-2026"] .nav__hamburger span { background: #f8f8f8; }
body[data-design="vanity-2026"] .mobile-menu { background: rgba(16, 16, 16,  .98); border: 1px solid var(--v-line); border-radius: 16px; }
body[data-design="vanity-2026"] .mobile-menu a { color: var(--v-text); }

/* Home page: open split composition with live server information. */
body[data-design="vanity-2026"][data-redesign="home"] .nav:not(.scrolled) { background: rgba(16, 16, 16,  .58); }
body[data-design="vanity-2026"] .hero {
  min-height: min(850px, 100svh); padding: 126px clamp(24px, 8vw, 136px) 82px;
  display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .7fr); gap: clamp(32px, 7vw, 110px);
  align-items: center; background: var(--v-ink); isolation: isolate;
}
body[data-design="vanity-2026"] .hero__photo { opacity: .49; background-position: center 43%; transform: scale(1.025); }
body[data-design="vanity-2026"] .hero__glow {
  background: linear-gradient(90deg, rgba(12, 12, 12,  .96) 0%, rgba(12, 12, 12,  .76) 43%, rgba(12, 12, 12,  .30) 100%),
    linear-gradient(0deg, var(--v-ink) 0%, transparent 32%, rgba(12, 12, 12, .2) 100%),
    radial-gradient(70% 65% at 72% 42%, rgba(255, 255, 255, .23), transparent 75%);
}
body[data-design="vanity-2026"] .hero__content { max-width: 730px; text-align: left; margin: 0; transform:translateY(-20px); }
body[data-design="vanity-2026"] .hero__logo-img { width: 88px; height: 88px; margin: 0 0 19px; object-fit: contain; }
body[data-design="vanity-2026"] .hero__eyebrow { margin: 0 0 14px; color: #eeeeee !important; font-size: .76rem; letter-spacing: .2em; }
body[data-design="vanity-2026"] .hero__eyebrow::before,
body[data-design="vanity-2026"] .hero__eyebrow::after { display: none; }
body[data-design="vanity-2026"] .hero__title { max-width: 750px; font-size: clamp(3.25rem, 6.2vw, 6.25rem); line-height: .88; letter-spacing: -.075em; text-align: left; }
body[data-design="vanity-2026"] .hero__title span { display: block; margin-top: .16em; color: #ffffff !important; }
body[data-design="vanity-2026"] .hero__subtitle { max-width: 620px; margin: 26px 0 0; color: #dbdbdb !important; font-size: clamp(1rem, 1.25vw, 1.13rem); line-height: 1.75; text-align: left; }
body[data-design="vanity-2026"] .hero__badges { display:none; }
body[data-design="vanity-2026"] .hero__subtitle { max-width:700px; font-size:1.02rem; line-height:1.62; }
body[data-design="vanity-2026"] .hb { border-color: rgba(255, 255, 255, .17); background: rgba(16, 16, 16, .55); color: #e7e7e7; backdrop-filter: blur(8px); }
body[data-design="vanity-2026"] .hb--orange,
body[data-design="vanity-2026"] .hb--amber,
body[data-design="vanity-2026"] .hb--green { color: #e9e9e9; }
body[data-design="vanity-2026"] .hero__actions { justify-content: flex-start; gap: 12px; flex-wrap:wrap; }
body[data-design="vanity-2026"] .hero__actions .btn { border-radius: 7px; padding: 15px 22px; }
body[data-design="vanity-2026"] .hero__actions .btn--primary { background: var(--v-brand); box-shadow: 0 10px 34px rgba(255, 255, 255, .25); }
body[data-design="vanity-2026"] .hero__actions .btn--secondary { border-color: rgba(244, 244, 244, .4); color: #fbfbfb; }
body[data-design="vanity-2026"] .hero-server-card {
  position: relative; z-index: 2; justify-self: end; width: min(100%, 398px); padding: 25px;
  border: 1px solid rgba(242, 242, 242, .16); border-radius: 18px; background: linear-gradient(145deg, rgba(34, 34, 34, .92), rgba(16, 16, 16, .94));
  backdrop-filter: blur(18px); box-shadow: 0 28px 90px rgba(0, 0, 0, .38); color: var(--v-text);
}
body[data-design="vanity-2026"] .hero-server-card__top { display: flex; flex-direction: column; gap: 17px; }
body[data-design="vanity-2026"] .hero-server-card__eyebrow { color: #aeaeae; font-size: .7rem; font-weight: 700; letter-spacing: .18em; }
body[data-design="vanity-2026"] .hero-server-card__state { display: flex; align-items: center; gap: 9px; color: #f2f2f2; font-size: .85rem; }
body[data-design="vanity-2026"] .hero-server-card__state i { display: inline-block; width: 8px; height: 8px; border-radius: 100%; background: #737373; }
body[data-design="vanity-2026"] .hero-server-card__players { display: grid; grid-template-columns: 1fr 1fr; margin: 25px 0; padding: 19px 0; border-block: 1px solid var(--v-line); }
body[data-design="vanity-2026"] .hero-server-card__players div + div { padding-left: 22px; border-left: 1px solid var(--v-line); }
body[data-design="vanity-2026"] .hero-server-card__players strong,
body[data-design="vanity-2026"] .hero-server-card__players span { display: block; }
body[data-design="vanity-2026"] .hero-server-card__players strong { color: white; font-size: 2rem; line-height: 1.1; letter-spacing: -.05em; }
body[data-design="vanity-2026"] .hero-server-card__players span { margin-top: 6px; color: #bdbdbd; font-size: .75rem; }
body[data-design="vanity-2026"] .hero-server-card__bottom { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: #b2b2b2; font-size: .76rem; }
body[data-design="vanity-2026"] .hero-server-card__bottom a { color: #eeeeee; font-weight: 700; }
body[data-design="vanity-2026"] .hero-server-card__bottom a:hover { color: white; transform: translateX(2px); }
body[data-design="vanity-2026"] .hero__scroll { bottom: 34px; left: clamp(24px, 8vw, 136px); color: #b3b3b3 !important; }
body[data-design="vanity-2026"] .stats-bar { border-block: 1px solid var(--v-line); background: #171717; }
body[data-design="vanity-2026"] .stats-bar__inner { max-width: 1180px; }
body[data-design="vanity-2026"] .stat-item__num { color: #fbfbfb; }
body[data-design="vanity-2026"] .stat-item__label { color: #adadad; }

/* Editorial sections, cards, teasers and calls to action. */
body[data-design="vanity-2026"] .section { padding-block: clamp(76px, 10vw, 142px); background: var(--v-ink) !important; }
body[data-design="vanity-2026"] .section[style*="background"] { background: #171717 !important; }
body[data-design="vanity-2026"] .section__inner { width: min(1200px, calc(100% - 48px)); }
body[data-design="vanity-2026"] .section__header { max-width: 700px; margin-bottom: 50px; }
body[data-design="vanity-2026"] .section__tag { color: var(--v-brand-light); letter-spacing: .18em; }
body[data-design="vanity-2026"] .section__title { color: #f5f5f5; font-size: clamp(2.4rem, 5vw, 4.4rem); letter-spacing: -.06em; }
body[data-design="vanity-2026"] .section__title span { color: var(--v-brand-light); }
body[data-design="vanity-2026"] .section__desc { color: #bdbdbd; }
body[data-design="vanity-2026"] .feature-card,
body[data-design="vanity-2026"] .about-card,
body[data-design="vanity-2026"] .stat-card {
  border: 1px solid var(--v-line); border-radius: 13px; background: linear-gradient(150deg, rgba(34, 34, 34, .96), rgba(26, 26, 26, .96));
  box-shadow: none; transition: transform .25s ease, border-color .25s ease, background .25s ease;
}
body[data-design="vanity-2026"] .feature-card:hover,
body[data-design="vanity-2026"] .about-card:hover { transform: translateY(-5px); border-color: rgba(255, 255, 255, .45); background: #222222; }
body[data-design="vanity-2026"] .feature-card__num,
body[data-design="vanity-2026"] .feature-card__icon { color: #dddddd; }
body[data-design="vanity-2026"] .feature-card__title,
body[data-design="vanity-2026"] .about-card__title { color: #f4f4f4; }
body[data-design="vanity-2026"] .feature-card__desc,
body[data-design="vanity-2026"] .about-card__desc { color: #b9b9b9; }
body[data-design="vanity-2026"] .about-visual__frame { border-color: rgba(255, 255, 255, .14) !important; background: linear-gradient(145deg, #222222, #171717) !important; }
body[data-design="vanity-2026"] .about-badge { border: 1px solid var(--v-line); background: #1a1a1a; }
body[data-design="vanity-2026"] .btn--primary { background: var(--v-brand); color: white; }
body[data-design="vanity-2026"] .btn--secondary { border-color: rgba(240, 240, 240, .3); color: #f4f4f4; }
body[data-design="vanity-2026"] .btn--primary:hover,
body[data-design="vanity-2026"] .btn--secondary:hover { transform: translateY(-2px); box-shadow: 0 12px 32px var(--v-glow); }
body[data-design="vanity-2026"] .teasers,
body[data-design="vanity-2026"] .account-page,
body[data-design="vanity-2026"] .portal-page,
body[data-design="vanity-2026"] .shop-page,
body[data-design="vanity-2026"] .apply-page,
body[data-design="vanity-2026"] .calendar-page { color: var(--v-text); }
body[data-design="vanity-2026"] .teasers__item,
body[data-design="vanity-2026"] .teaser-card,
body[data-design="vanity-2026"] .application-card,
body[data-design="vanity-2026"] .portal-card,
body[data-design="vanity-2026"] .shop-card { background: #1a1a1a; border-color: var(--v-line); color: var(--v-text); }
body[data-design="vanity-2026"] .teasers__item figcaption { color: #f2f2f2; }
body[data-design="vanity-2026"] .teasers__intro p,
body[data-design="vanity-2026"] .teaser-post__intro p { color: #bdbdbd; }

/* Shared page mastheads. */
body[data-design="vanity-2026"] .cine-hero {
  min-height: 460px !important; padding: 160px max(24px, calc((100vw - 1180px) / 2)) 76px !important;
  background: #151515; border-bottom: 1px solid var(--v-line); isolation: isolate;
}
body[data-design="vanity-2026"] .cine-hero__media { opacity: .48; filter: saturate(.72); }
body[data-design="vanity-2026"] .cine-hero__scrim { background: linear-gradient(90deg, rgba(8, 8, 8, .94), rgba(8, 8, 8, .5) 70%), linear-gradient(0deg, #101010 0%, transparent 50%); }
body[data-design="vanity-2026"] .cine-hero__grain { opacity: .08; }
body[data-design="vanity-2026"] .cine-hero__inner { max-width: 1180px; margin: 0 auto; }
body[data-design="vanity-2026"] .cine-eyebrow,
body[data-design="vanity-2026"] .rules-hero__meta { color: #d2d2d2 !important; }
body[data-design="vanity-2026"] .cine-title { color: #f6f6f6 !important; font-size: clamp(3rem, 8vw, 6rem); letter-spacing: -.075em; }
body[data-design="vanity-2026"] .cine-title span { color: #dedede !important; }
body[data-design="vanity-2026"] .cine-sub { color: #cccccc !important; }

/* Rulebook: readable dark handbook, monochrome status and category controls. */
body[data-design="vanity-2026"][data-page="rules"] { background: var(--v-ink) !important; color: var(--v-text) !important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-statsbar,
body[data-design="vanity-2026"][data-page="rules"] .rules-body { background: var(--v-ink) !important; border-color: var(--v-line) !important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-statsbar { border-block: 1px solid var(--v-line); }
body[data-design="vanity-2026"][data-page="rules"] .rstat__val { color: #dedede !important; }
body[data-design="vanity-2026"][data-page="rules"] .rstat__lbl,
body[data-design="vanity-2026"][data-page="rules"] .rules-sidebar__label { color: #a2a2a2 !important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-sidebar { background: transparent !important; border-color: var(--v-line) !important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-content,
body[data-design="vanity-2026"][data-page="rules"] .rules-category,
body[data-design="vanity-2026"][data-page="rules"] .rule-item,
body[data-design="vanity-2026"][data-page="rules"] .rules-info { color: var(--v-text) !important; background: #1a1a1a !important; border-color: var(--v-line) !important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-callout,
body[data-design="vanity-2026"][data-page="rules"] .rules-info__item,
body[data-design="vanity-2026"][data-page="rules"] .rules-sec-head,
body[data-design="vanity-2026"][data-page="rules"] .rcbtn { color:var(--v-text)!important; background:#1a1a1a!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-sec-title,
body[data-design="vanity-2026"][data-page="rules"] .rule-num { color:#dedede!important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-sec-desc,
body[data-design="vanity-2026"][data-page="rules"] .rcbtn__count,
body[data-design="vanity-2026"][data-page="rules"] .rules-empty { color:#aeaeae!important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-sec-icon,
body[data-design="vanity-2026"][data-page="rules"] .rules-sec-badge { color:#eeeeee!important; background:rgba(255, 255, 255, .15)!important; }
body[data-design="vanity-2026"][data-page="rules"] .rules-info__eyebrow { color:#dedede!important; }
body[data-design="vanity-2026"][data-page="rules"] #sidebarCats button,
body[data-design="vanity-2026"][data-page="rules"] .category-btn,
body[data-design="vanity-2026"][data-page="rules"] .rules-sidebar button { color: #c7c7c7 !important; background: #1a1a1a !important; border-color: var(--v-line) !important; }
body[data-design="vanity-2026"][data-page="rules"] #sidebarCats button:hover,
body[data-design="vanity-2026"][data-page="rules"] #sidebarCats button.active,
body[data-design="vanity-2026"][data-page="rules"] .category-btn.active { color: #eeeeee !important; background: rgba(255, 255, 255, .14) !important; border-color: rgba(255, 255, 255, .45) !important; }
body[data-design="vanity-2026"][data-page="rules"] h1,
body[data-design="vanity-2026"][data-page="rules"] h2,
body[data-design="vanity-2026"][data-page="rules"] h3 { color: #f6f6f6 !important; }
body[data-design="vanity-2026"][data-page="rules"] p,
body[data-design="vanity-2026"][data-page="rules"] .rule-description { color: #c1c1c1 !important; }
body[data-design="vanity-2026"][data-page="rules"] [style*="#ff"],
body[data-design="vanity-2026"][data-page="rules"] [style*="orange"] { color: #dfdfdf !important; }

/* Player profile and account pages retain data and behavior while leaving light surfaces behind. */
body[data-design="vanity-2026"][data-page="profile"] { --clr-bg:#101010; --clr-bg2:#171717; --clr-surface:#1a1a1a; --clr-surface2:#222222; --clr-white:#f2f2f2; --clr-navy:#f2f2f2; --clr-grey:#a6a6a6; --clr-grey2:#777777; --clr-border:#2b2b2b; --clr-green:#f2f2f2; --clr-teal:#f2f2f2; background:var(--v-ink)!important; color:var(--v-text)!important; }
body[data-design="vanity-2026"][data-page="profile"] .account-page { background:transparent!important; }
body[data-design="vanity-2026"][data-page="profile"] .profile-hero,
body[data-design="vanity-2026"][data-page="profile"] .pstat,
body[data-design="vanity-2026"][data-page="profile"] .psection,
body[data-design="vanity-2026"][data-page="profile"] .app-item,
body[data-design="vanity-2026"][data-page="profile"] .char-card,
body[data-design="vanity-2026"][data-page="profile"] .modal { background:#1a1a1a!important; color:var(--v-text)!important; border-color:var(--v-line)!important; box-shadow:0 16px 48px rgba(0, 0, 0, .2)!important; }
body[data-design="vanity-2026"][data-page="profile"] .profile-hero__banner { background:linear-gradient(115deg,#222222,#171717 64%,#2f2f2f)!important; }
body[data-design="vanity-2026"][data-page="profile"] .profile-hero__name,
body[data-design="vanity-2026"][data-page="profile"] .pstat__num,
body[data-design="vanity-2026"][data-page="profile"] .psection__title,
body[data-design="vanity-2026"][data-page="profile"] .char-card__name,
body[data-design="vanity-2026"][data-page="profile"] .app-item__type { color:#f7f7f7!important; }
body[data-design="vanity-2026"][data-page="profile"] .char-card__job,
body[data-design="vanity-2026"][data-page="profile"] .profile-hero__role { color:#e2e2e2!important; }
body[data-design="vanity-2026"][data-page="profile"] .input-field,
body[data-design="vanity-2026"][data-page="profile"] input,
body[data-design="vanity-2026"][data-page="profile"] select,
body[data-design="vanity-2026"][data-page="profile"] textarea { color:#f5f5f5!important; background:#171717!important; border-color:var(--v-line)!important; }

/* Login: full-bleed in-game artwork and a single floating glass sign-in panel. */
body[data-design="vanity-2026"][data-page="login"] { background:var(--v-ink)!important; overflow-x:hidden; }
body[data-design="vanity-2026"][data-page="login"] .login-wrap { position:relative; display:block; min-height:100svh; padding:0; }
body[data-design="vanity-2026"][data-page="login"] .login-visual { position:absolute!important; inset:0; height:100%; min-height:100%; background:#101010; }
body[data-design="vanity-2026"][data-page="login"] .login-visual__img { inset:0; transform:none; background-position:center 42%; filter:saturate(.78); }
body[data-design="vanity-2026"][data-page="login"] .login-visual__overlay { background:linear-gradient(90deg,rgba(8, 8, 8, .2) 0%,rgba(8, 8, 8, .43) 43%,rgba(8, 8, 8, .9) 72%,#101010 100%),linear-gradient(0deg,rgba(8, 8, 8, .44),transparent 55%),radial-gradient(60% 70% at 25% 45%,rgba(255, 255, 255, .2),transparent 80%); }
body[data-design="vanity-2026"][data-page="login"] .login-visual__grid { display:none; }
body[data-design="vanity-2026"][data-page="login"] .login-visual__content { padding:clamp(130px,18vh,190px) clamp(26px,9vw,150px); max-width:750px; }
body[data-design="vanity-2026"][data-page="login"] .login-visual__brand { font-size:clamp(2.6rem,6vw,5rem); letter-spacing:-.06em; }
body[data-design="vanity-2026"][data-page="login"] .login-visual__brand span { color:#dedede!important; }
body[data-design="vanity-2026"][data-page="login"] .login-perks { gap:10px; }
body[data-design="vanity-2026"][data-page="login"] .login-perks li { color:#e3e3e3; }
body[data-design="vanity-2026"][data-page="login"] .login-panel { position:relative; z-index:3; min-height:100svh; width:100%; align-items:center; justify-content:flex-end; padding:96px clamp(20px,8vw,120px) 36px; background:transparent; }
body[data-design="vanity-2026"][data-page="login"] .login-card { max-width:430px; padding:clamp(27px,4vw,44px); border:1px solid rgba(242, 242, 242, .16); border-radius:18px; background:rgba(16, 16, 16, .78); backdrop-filter:blur(18px); box-shadow:0 28px 90px rgba(0, 0, 0, .38); }
body[data-design="vanity-2026"][data-page="login"] .login-card__eyebrow { color:#e0e0e0; }
body[data-design="vanity-2026"][data-page="login"] .login-card__title { color:#f7f7f7; font-size:2.7rem; }
body[data-design="vanity-2026"][data-page="login"] .login-card__sub,
body[data-design="vanity-2026"][data-page="login"] .login-terms { color:#b8b8b8; }
body[data-design="vanity-2026"][data-page="login"] .login-terms a,
body[data-design="vanity-2026"][data-page="login"] .login-back { color:#dfdfdf; }
body[data-design="vanity-2026"][data-page="login"] .login-divider::before,
body[data-design="vanity-2026"][data-page="login"] .login-divider::after { background:var(--v-line); }

/* Policies, FAQ, forms, tables and team listings share one dark paper surface. */
body[data-design="vanity-2026"].legal-wrap,
body[data-design="vanity-2026"].legal-page,
body[data-design="vanity-2026"].policy-page { color:var(--v-text)!important; background:var(--v-ink)!important; color-scheme:dark; }
body[data-design="vanity-2026"] .legal-hero { color:var(--v-text)!important; background:#171717!important; border-bottom:1px solid var(--v-line); }
body[data-design="vanity-2026"] .legal-hero__eyebrow,
body[data-design="vanity-2026"] .legal-hero__meta { color:#dedede!important; }
body[data-design="vanity-2026"] .legal-hero__title { color:#f6f6f6!important; }
body[data-design="vanity-2026"] .legal-body { color:var(--v-text)!important; }
body[data-design="vanity-2026"] .legal-body h2,
body[data-design="vanity-2026"] .legal-body h3 { color:#f6f6f6!important; }
body[data-design="vanity-2026"] .legal-body p,
body[data-design="vanity-2026"] .legal-body li { color:#c0c0c0!important; }
body[data-design="vanity-2026"] .legal-contact,
body[data-design="vanity-2026"] .legal__todo { color:#e9e9e9!important; background:#1a1a1a!important; border-color:rgba(255, 255, 255, .48)!important; }
body[data-design="vanity-2026"] .legal-contact h3,
body[data-design="vanity-2026"] .legal__todo strong { color:#f5f5f5!important; }
body[data-design="vanity-2026"] .legal-wrap main,
body[data-design="vanity-2026"] .legal-content,
body[data-design="vanity-2026"] .policy-content { color:var(--v-text)!important; background:transparent!important; }
body[data-design="vanity-2026"] .legal-wrap h1,
body[data-design="vanity-2026"] .legal-wrap h2,
body[data-design="vanity-2026"] .legal-content h1,
body[data-design="vanity-2026"] .legal-content h2,
body[data-design="vanity-2026"] .legal-content h3 { color:#f6f6f6!important; }
body[data-design="vanity-2026"] .legal-wrap p,
body[data-design="vanity-2026"] .legal-wrap li,
body[data-design="vanity-2026"] .legal-content p,
body[data-design="vanity-2026"] .legal-content li { color:#c0c0c0!important; }
body[data-design="vanity-2026"] .legal-wrap a,
body[data-design="vanity-2026"] .legal-content a { color:#dddddd; }
body[data-design="vanity-2026"] .faq-item,
body[data-design="vanity-2026"] .faq-card,
body[data-design="vanity-2026"] .faq-cat,
body[data-design="vanity-2026"] .faq-cta,
body[data-design="vanity-2026"] .team-card,
body[data-design="vanity-2026"] .job-card,
body[data-design="vanity-2026"] .position-card,
body[data-design="vanity-2026"] .calendar-card,
body[data-design="vanity-2026"] .application-item { color:var(--v-text)!important; background:#1a1a1a!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] .about-section,
body[data-design="vanity-2026"] .about-section--alt,
body[data-design="vanity-2026"] .portal,
body[data-design="vanity-2026"] .portal__main,
body[data-design="vanity-2026"] .apply-page,
body[data-design="vanity-2026"] .apply-form-wrap,
body[data-design="vanity-2026"] .apply-form,
body[data-design="vanity-2026"] .jobs,
body[data-design="vanity-2026"] .reno-page,
body[data-design="vanity-2026"] .anv-wrap { color:var(--v-text)!important; background:var(--v-ink)!important; }
body[data-design="vanity-2026"] .category-card,
body[data-design="vanity-2026"] .portal-card,
body[data-design="vanity-2026"] .portal-stat,
body[data-design="vanity-2026"] .kal-ev-card,
body[data-design="vanity-2026"] .kal-upcoming,
body[data-design="vanity-2026"] .ev-modal,
body[data-design="vanity-2026"] .srv-card,
body[data-design="vanity-2026"] .reno-card,
body[data-design="vanity-2026"] .member-card,
body[data-design="vanity-2026"] .job-item,
body[data-design="vanity-2026"] .application-card,
body[data-design="vanity-2026"] .q-block,
body[data-design="vanity-2026"] .login-required-box,
body[data-design="vanity-2026"] .no-char-alert { color:var(--v-text)!important; background:#1a1a1a!important; border-color:var(--v-line)!important; box-shadow:0 14px 44px rgba(0, 0, 0, .16); }
body[data-design="vanity-2026"] .page-header,
body[data-design="vanity-2026"] .kal-hero,
body[data-design="vanity-2026"] .srv-hero,
body[data-design="vanity-2026"] .anv-header,
body[data-design="vanity-2026"] .jobs__intro { color:var(--v-text)!important; background:#171717!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] .page-header h1,
body[data-design="vanity-2026"] .kal-hero__title,
body[data-design="vanity-2026"] .srv-hero__title,
body[data-design="vanity-2026"] .anv-header__title,
body[data-design="vanity-2026"] .reno-title,
body[data-design="vanity-2026"] .jobs__intro h1 { color:#f6f6f6!important; }
body[data-design="vanity-2026"] .kal-hero__sub,
body[data-design="vanity-2026"] .srv-hero__sub,
body[data-design="vanity-2026"] .anv-header__sub,
body[data-design="vanity-2026"] .reno-desc,
body[data-design="vanity-2026"] .jobs__intro p { color:#bdbdbd!important; }
body[data-design="vanity-2026"] .accordion-item,
body[data-design="vanity-2026"] .accordion-item__header,
body[data-design="vanity-2026"] .accordion-item__body,
body[data-design="vanity-2026"] .anv-table-wrap,
body[data-design="vanity-2026"] .data-table { color:var(--v-text)!important; background:#1a1a1a!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] .accordion-item__title,
body[data-design="vanity-2026"] .portal-card__title,
body[data-design="vanity-2026"] .portal-stat__value,
body[data-design="vanity-2026"] .member-name,
body[data-design="vanity-2026"] .srv-card__name,
body[data-design="vanity-2026"] .kal-ev-card__title { color:#f4f4f4!important; }
body[data-design="vanity-2026"] .accordion-item__body-inner,
body[data-design="vanity-2026"] .portal-stat__label,
body[data-design="vanity-2026"] .portal-stat__sub,
body[data-design="vanity-2026"] .footer-bottom,
body[data-design="vanity-2026"] .footer__bottom { color:#aeaeae!important; }
body[data-design="vanity-2026"] .form-input,
body[data-design="vanity-2026"] .input-field,
body[data-design="vanity-2026"] .cs-trigger,
body[data-design="vanity-2026"] .cs-dropdown,
body[data-design="vanity-2026"] .cs-option { color:#f2f2f2!important; background:#171717!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] .kal-month-nav__btn,
body[data-design="vanity-2026"] .btn-icon,
body[data-design="vanity-2026"] .view-btn { color:#d0d0d0!important; background:#222222!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] .faq-cat__title,
body[data-design="vanity-2026"] .team-card h2,
body[data-design="vanity-2026"] .team-card h3,
body[data-design="vanity-2026"] .job-card h2,
body[data-design="vanity-2026"] .position-card h2 { color:#f4f4f4!important; }
body[data-design="vanity-2026"] input,
body[data-design="vanity-2026"] select,
body[data-design="vanity-2026"] textarea { color:#f5f5f5!important; background:#171717!important; border:1px solid var(--v-line)!important; border-radius:8px; }
body[data-design="vanity-2026"] input::placeholder,
body[data-design="vanity-2026"] textarea::placeholder { color:#919191!important; }
body[data-design="vanity-2026"] table { color:#ececec; border-color:var(--v-line); }
body[data-design="vanity-2026"] th { color:#dddddd; background:#1a1a1a; }
body[data-design="vanity-2026"] td { border-color:var(--v-line); }
body[data-design="vanity-2026"] footer,
body[data-design="vanity-2026"] .footer { color:#a1a1a1; background:#101010!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] footer a:hover,
body[data-design="vanity-2026"] .footer a:hover { color:#dddddd; }
body[data-design="vanity-2026"] .cookie-banner,
body[data-design="vanity-2026"] #cookieBanner { color:#f5f5f5; background:rgba(26, 26, 26, .97); border:1px solid var(--v-line); box-shadow:0 18px 55px rgba(0, 0, 0, .36); }

/* Keep public pages, player portal and login on one palette. The layout borrows
   Destiny's cinematic hierarchy while all brand colors remain Vanity's own. */
body[data-design="vanity-2026"] .hero__title,
body[data-design="vanity-2026"] .section__title,
body[data-design="vanity-2026"] .cine-title,
body[data-design="vanity-2026"] .login-card__title { font-family: Inter, system-ui, -apple-system, "Segoe UI", sans-serif; font-weight: 750; }
body[data-design="vanity-2026"] .hero__title span,
body[data-design="vanity-2026"] .section__title span,
body[data-design="vanity-2026"] .cine-title span,
body[data-design="vanity-2026"] .login-visual__brand span { color: var(--v-brand-light)!important; }
body[data-design="vanity-2026"] .section__tag,
body[data-design="vanity-2026"] .cine-eyebrow,
body[data-design="vanity-2026"] .hero__eyebrow,
body[data-design="vanity-2026"] .hero-server-card__bottom a,
body[data-design="vanity-2026"] .legal-wrap a,
body[data-design="vanity-2026"] .legal-content a { color: var(--v-brand-light)!important; }
body[data-design="vanity-2026"] .hero-server-card,
body[data-design="vanity-2026"] .login-card { border-color: rgba(242, 242, 242, .14); background: rgba(26, 26, 26, .88); }
body[data-design="vanity-2026"] .feature-card,
body[data-design="vanity-2026"] .about-card,
body[data-design="vanity-2026"] .stat-card,
body[data-design="vanity-2026"] .portal-card,
body[data-design="vanity-2026"] .portal-stat,
body[data-design="vanity-2026"] .profile-hero,
body[data-design="vanity-2026"] .pstat,
body[data-design="vanity-2026"] .psection,
body[data-design="vanity-2026"] .app-item,
body[data-design="vanity-2026"] .char-card,
body[data-design="vanity-2026"] .faq-item,
body[data-design="vanity-2026"] .faq-card,
body[data-design="vanity-2026"] .team-card,
body[data-design="vanity-2026"] .job-card,
body[data-design="vanity-2026"] .position-card,
body[data-design="vanity-2026"] .calendar-card,
body[data-design="vanity-2026"] .teaser-card,
body[data-design="vanity-2026"] .application-card { background-color: var(--v-panel)!important; border-color: var(--v-line)!important; }
body[data-design="vanity-2026"] .nav,
body[data-design="vanity-2026"] .mobile-menu { border-color: rgba(242, 242, 242, .12); }
body[data-design="vanity-2026"] .nav.scrolled { background: rgba(16, 16, 16, .96); }
body[data-design="vanity-2026"][data-page="login"] .discord-btn-lg {
  background: var(--v-brand)!important; color:#ffffff!important; box-shadow:0 10px 28px rgba(255, 255, 255, .24)!important;
}
body[data-design="vanity-2026"][data-page="login"] .discord-btn-lg:hover { background:var(--v-brand-deep)!important; box-shadow:0 14px 32px rgba(255, 255, 255, .32)!important; }
body[data-design="vanity-2026"][data-page="login"] .steam-btn-lg {
  background:#222222!important; color:#f2f2f2!important; border-color:#2b2b2b!important;
}
body[data-design="vanity-2026"][data-page="login"] .steam-btn-lg:hover {
  background:#2c2c2c!important; color:#ffffff!important; border-color:var(--v-brand-light)!important;
}
body[data-design="vanity-2026"] input,
body[data-design="vanity-2026"] select,
body[data-design="vanity-2026"] textarea,
body[data-design="vanity-2026"] .form-input,
body[data-design="vanity-2026"] .input-field { background:var(--v-deep)!important; color:var(--v-text)!important; border-color:var(--v-line)!important; }
body[data-design="vanity-2026"] .section[style*="background"] { background-color:var(--v-deep)!important; }
body[data-design="vanity-2026"] footer,
body[data-design="vanity-2026"] .footer { background:var(--v-ink)!important; color:var(--v-muted)!important; }
body[data-design="vanity-2026"] .hero__glow { background:
  linear-gradient(90deg,rgba(16, 16, 16, .96),rgba(16, 16, 16, .76) 43%,rgba(16, 16, 16, .3)),
  linear-gradient(0deg,var(--v-ink),transparent 36%,rgba(16, 16, 16, .2)),
  radial-gradient(70% 65% at 72% 42%,rgba(255, 255, 255, .17),transparent 75%)!important; }
body[data-design="vanity-2026"] .hero-server-card { background:linear-gradient(145deg,rgba(34, 34, 34, .94),rgba(16, 16, 16, .95))!important; }
body[data-design="vanity-2026"] .feature-card,
body[data-design="vanity-2026"] .about-card,
body[data-design="vanity-2026"] .stat-card { background:linear-gradient(150deg,#222222,#1a1a1a)!important; }
body[data-design="vanity-2026"] .feature-card__icon,
body[data-design="vanity-2026"] .feature-card__num,
body[data-design="vanity-2026"] .rstat__val,
body[data-design="vanity-2026"] .rules-sec-title,
body[data-design="vanity-2026"] .rule-num { color:var(--v-brand-light)!important; }
body[data-design="vanity-2026"] .cine-hero__scrim { background:
  linear-gradient(90deg,rgba(16, 16, 16, .94),rgba(16, 16, 16, .52) 70%),
  linear-gradient(0deg,var(--v-ink),transparent 54%)!important; }
body[data-design="vanity-2026"][data-page="login"] .login-visual__overlay { background:
  linear-gradient(90deg,rgba(16, 16, 16, .2),rgba(16, 16, 16, .55) 43%,rgba(16, 16, 16, .94) 74%,var(--v-ink)),
  linear-gradient(0deg,rgba(16, 16, 16, .55),transparent 60%),
  radial-gradient(60% 70% at 25% 45%,rgba(255, 255, 255, .16),transparent 80%)!important; }
body[data-design="vanity-2026"][data-page="login"] .login-card { background:rgba(26, 26, 26, .9)!important; border-color:rgba(242, 242, 242, .16)!important; }

@media (max-width: 900px) {
  body[data-design="vanity-2026"] .nav { height:64px; inset:10px 10px auto; padding-inline:16px; }
  body[data-design="vanity-2026"] .hero { min-height:900px; min-height:100svh; padding:132px 28px 90px; display:flex; flex-direction:column; align-items:stretch; justify-content:center; gap:32px; }
  body[data-design="vanity-2026"] .hero__title { font-size:clamp(3.3rem,12vw,6rem); }
  body[data-design="vanity-2026"] .hero__subtitle { max-width:650px; }
  body[data-design="vanity-2026"] .hero__actions > .btn--secondary:not(.hero__discord) { display:none; }
  body[data-design="vanity-2026"] .hero-server-card { justify-self:stretch; align-self:flex-start; width:min(100%,470px); }
  body[data-design="vanity-2026"] .hero__scroll { display:none; }
  body[data-design="vanity-2026"] .cine-hero { min-height:390px!important; padding-top:145px!important; }
  body[data-design="vanity-2026"][data-page="login"] .login-wrap { min-height:100svh; }
  body[data-design="vanity-2026"][data-page="login"] .login-visual { inset:0; height:100%; min-height:100%; }
  body[data-design="vanity-2026"][data-page="login"] .login-visual__content,
  body[data-design="vanity-2026"][data-page="login"] .login-perks { display:none; }
  body[data-design="vanity-2026"][data-page="login"] .login-panel { position:relative; min-height:100svh; padding:96px 20px 145px; align-items:flex-start; justify-content:center; }
  body[data-design="vanity-2026"][data-page="login"] .login-card { width:min(100%,500px); }
}
@media (max-width: 600px) {
  body[data-design="vanity-2026"] .nav { border-radius:12px; }
  body[data-design="vanity-2026"] .hero { padding:120px 20px 70px; }
  body[data-design="vanity-2026"] .hero__logo-img { width:68px; height:68px; margin-bottom:16px; }
  body[data-design="vanity-2026"] .hero__subtitle { font-size:.97rem; }
  body[data-design="vanity-2026"] .hero__badges { display:none; }
  body[data-design="vanity-2026"] .hb { padding:7px 11px; font-size:.74rem; }
  body[data-design="vanity-2026"] .hero-server-card { padding:20px; }
  body[data-design="vanity-2026"] .stats-bar__inner { grid-template-columns:repeat(2,minmax(0,1fr)); }
  body[data-design="vanity-2026"] .section__inner { width:min(100% - 36px,1200px); }
  body[data-design="vanity-2026"] .cine-hero { min-height:340px!important; padding:130px 20px 52px!important; }
  body[data-design="vanity-2026"] .rules-body { padding-inline:18px!important; }
  body[data-design="vanity-2026"][data-page="login"] .login-visual__overlay { background:linear-gradient(0deg,#101010 0%,rgba(8, 8, 8, .76) 55%,rgba(8, 8, 8, .32) 100%); }
  body[data-design="vanity-2026"][data-page="login"] .login-visual__content { padding:118px 22px 20px; }
  body[data-design="vanity-2026"][data-page="login"] .login-panel { padding-inline:14px; }
  body[data-design="vanity-2026"][data-page="login"] .login-card { padding:22px 18px; }
  body[data-design="vanity-2026"][data-page="login"] .login-card__title { font-size:2.3rem; }
  body[data-design="vanity-2026"][data-page="login"] .login-card__sub { margin:10px 0 18px; font-size:.9rem; }
  body[data-design="vanity-2026"][data-page="login"] .discord-btn-lg,
  body[data-design="vanity-2026"][data-page="login"] .steam-btn-lg { padding:12px 14px; }
  body[data-design="vanity-2026"][data-page="login"] .steam-btn-lg { margin-top:8px; }
  body[data-design="vanity-2026"][data-page="login"] .login-divider { margin:15px 0; }
  body[data-design="vanity-2026"][data-page="login"] .login-back { margin-top:15px; }
}
@media (prefers-reduced-motion: reduce) {
  body[data-design="vanity-2026"] *, body[data-design="vanity-2026"] *::before, body[data-design="vanity-2026"] *::after { scroll-behavior:auto!important; animation-duration:.01ms!important; animation-iteration-count:1!important; transition-duration:.01ms!important; }
}