:root{
  --vb-bg:#080f12;
  --vb-side:#081215;
  --vb-side2:#071014;
  --vb-panel:#10191d;
  --vb-line:#334148;
  --vb-line-soft:#27343a;
  --vb-gold:#e8a04b;
  --vb-gold2:#f5b94d;
  --vb-ink:#d9e0e1;
  --vb-muted:#91a0a4;
}

/* =========================================================
   PAGE + SIDEBAR SHOULD FEEL LIKE ONE SURFACE
========================================================= */

body.vb-shell-active{
  padding-left:224px;
  background:var(--vb-bg);
}

/* Canonical shell owns the outer homepage layout as well as subpages. */
body.vb-shell-active .app-shell{
  display:block;
  width:100%;
  min-width:0;
  min-height:100vh;
}
body.vb-shell-active .app-shell>.sidebar,
body.vb-shell-active .app-shell>.mobile-menu{display:none}
body.vb-shell-active .app-shell>.workspace{
  display:block;
  width:100%;
  max-width:none;
  min-width:0;
  margin:0;
}

.vb-shell{
  position:fixed;
  z-index:9000;
  inset:0 auto 0 0;

  width:224px;
  height:100vh;

  display:flex;
  flex-direction:column;

  background:
    linear-gradient(
      180deg,
      var(--vb-side),
      var(--vb-side2)
    );

  border-right:1px solid var(--vb-line-soft);

  color:var(--vb-ink);

  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    -apple-system,
    "Segoe UI",
    sans-serif;
}

/* no visible scrollbar */
.vb-shell,
.vb-shell *{
  scrollbar-width:none;
  -ms-overflow-style:none;
}

.vb-shell::-webkit-scrollbar,
.vb-shell *::-webkit-scrollbar{
  width:0;
  height:0;
  display:none;
}

.vb-shell-scroll{
  flex:1 1 auto;
  min-height:0;

  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
}

.vb-shell-footer{padding:9px 8px;border-top:1px solid var(--vb-line-soft)}
.vb-shell-footer .vb-path-link{color:#d8b171}

/* =========================================================
   BRAND — V ONLY
========================================================= */





/* =========================================================
   NAV
========================================================= */

.vb-nav-group{
  padding:13px 8px 3px;
}

.vb-nav-title{
  margin:0 7px 7px;

  color:#738a91;

  font-size:11px;
  line-height:1;

  font-weight:900;

  letter-spacing:.15em;
}

.vb-nav-group-toggle{
  width:calc(100% - 14px);
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:2px 0 4px;
  border:0;
  background:transparent;
  font-family:inherit;
  text-align:left;
  cursor:pointer;
}
.vb-nav-group-toggle b{color:#8da0a5;font-size:12px;transition:transform .16s ease}
.vb-nav-group.is-open>.vb-nav-group-toggle b{transform:rotate(180deg)}
.vb-nav-group-toggle:hover,.vb-nav-group-toggle:focus-visible{color:#d7b97e}
.vb-nav-group-toggle:focus-visible{outline:1px solid #805f31;outline-offset:3px}
.vb-nav-group-body[hidden]{display:none!important}

.vb-nav-link{
  width:100%;

  display:flex;
  align-items:center;

  gap:10px;

  min-height:35px;

  margin:1px 0;
  padding:8px 9px;

  border:1px solid transparent;
  border-radius:7px;

  background:transparent;

  color:#c9d2d3;

  text-decoration:none;
  text-align:left;

  font-size:14px;
  line-height:1.1;
  font-weight:750;

  cursor:pointer;

  transition:
    color .13s ease,
    border-color .13s ease,
    background .13s ease;
}

button.vb-nav-link{
  font-family:inherit;
}

.vb-nav-link:hover{
  color:#fff0d8;

  border-color:#38494e;

  background:
    linear-gradient(
      90deg,
      rgba(94,43,25,.20),
      rgba(9,18,22,.20)
    );
}

.vb-nav-link.is-active{
  color:#fff;

  border-color:#49575b;

  background:
    linear-gradient(
      90deg,
      rgba(112,52,28,.28),
      rgba(14,25,29,.72)
    );

  box-shadow:
    inset 3px 0
    var(--vb-gold);
}

.vb-nav-icon{
  width:20px;

  flex:0 0 20px;

  text-align:center;

  color:var(--vb-gold);

  font-size:16px;
  line-height:1;
}

/* =========================================================
   MEMBERS COLLAPSIBLE
========================================================= */

.vb-members-toggle b{
  margin-left:auto;

  color:var(--vb-gold);

  font-size:14px;

  transition:
    transform .15s ease;
}

.vb-members-group{
  margin:3px 1px 5px;
  padding:2px;
  border:1px solid rgba(89,111,116,.42);
  border-radius:7px;
  background:linear-gradient(90deg,rgba(19,34,38,.66),rgba(8,18,21,.24));
}
.vb-members-group>.vb-nav-link{margin:0}
.vb-members-group .vb-members-menu.is-open{border-top:1px solid rgba(77,98,103,.24);margin-top:2px;padding-top:2px}

.vb-members-toggle.is-open b{
  transform:rotate(180deg);
}

.vb-members-menu{
  overflow:hidden;

  max-height:0;

  opacity:.4;

  transition:
    max-height .20s ease,
    opacity .16s ease;
}

.vb-members-menu.is-open{
  max-height:190px;
  opacity:1;
}

.vb-nav-child{
  min-height:32px;

  padding-left:28px;

  font-size:13px;

  background:
    rgba(5,13,16,.45);
}

.vb-nav-child .vb-nav-icon{
  width:17px;
  flex-basis:17px;

  font-size:13px;
}

/* =========================================================
   BOTTOM
========================================================= */

.vb-nav-bottom{
  flex:0 0 auto;

  margin:8px 9px 12px;
  padding-top:9px;

  border-top:1px solid var(--vb-line-soft);

  background:var(--vb-side2);
}

.vb-nav-bottom a{
  display:block;

  padding:8px;

  border-radius:7px;

  text-align:center;
  text-decoration:none;

  font-size:13px;
  font-weight:850;
}

.vb-login{
  color:#e0e5e5;
}

.vb-join{
  margin-top:5px;

  border:1px solid #e49648;

  background:
    linear-gradient(
      #7b421f,
      #301c10
    );

  color:#ffd29a;
}

/* =========================================================
   NORMAL VALBASE SUBPAGES
========================================================= */

.vb-page{
  max-width:1180px;

  margin:0 auto;

  padding:48px 28px;

  color:var(--vb-ink);

  font-family:
    Inter,
    ui-sans-serif,
    system-ui,
    sans-serif;
}

.vb-eyebrow{
  color:var(--vb-gold);

  font-size:12px;
  font-weight:900;
  letter-spacing:.16em;
}

.vb-page h1{
  margin:8px 0 10px;

  font-size:
    clamp(2rem,4vw,3.8rem);
}

.vb-page p{
  max-width:700px;

  color:var(--vb-muted);

  line-height:1.6;
}

.vb-page-grid{
  display:grid;

  grid-template-columns:
    repeat(
      auto-fit,
      minmax(220px,1fr)
    );

  gap:14px;

  margin-top:30px;
}

.vb-page-card{
  padding:18px;

  border:1px solid var(--vb-line);
  border-radius:9px;

  background:var(--vb-panel);
}

.vb-page-card b{
  display:block;

  margin-bottom:5px;

  color:#fff;
}

.vb-page-card span{
  color:var(--vb-muted);

  font-size:.94rem;
}

/* =========================================================
   MAIN INDEX — ENLARGE THE TINY TEXT
========================================================= */

body.vb-shell-active .workspace{
  background:
    radial-gradient(
      circle at 80% 10%,
      #17282d 0,
      transparent 30%
    ),
    var(--vb-bg);
}

body.vb-shell-active .destination-card small{
  font-size:9px;
}

body.vb-shell-active .looking-strip span{
  font-size:9px;
}

body.vb-shell-active .entity small{
  font-size:9px;
}

body.vb-shell-active .tags span{
  font-size:8px;
}

body.vb-shell-active .panel header button{
  font-size:10px;
}

body.vb-shell-active .toolbox-grid b{
  font-size:8px;
}

body.vb-shell-active .toolbox-grid small{
  font-size:7px;
}

body.vb-shell-active .popular{
  font-size:11px;
}

body.vb-shell-active .footer-brand span{
  font-size:8px;
}

/* =========================================================
   MOBILE
========================================================= */

@media(max-width:860px){

  body.vb-shell-active{
    padding-left:0;
  }

  .vb-shell{
    position:sticky;
    top:0;

    width:100%;
    height:58px;

    flex-direction:row;

    overflow:hidden;
  }

  

  

  .vb-shell-scroll{
    display:flex;

    overflow-x:auto;
    overflow-y:hidden;
  }

  .vb-nav-group{
    display:flex;
    align-items:center;

    padding:6px 0;
  }

  .vb-nav-title,
  .vb-nav-bottom{
    display:none;
  }

  .vb-nav-group-toggle{display:none}
  .vb-nav-group-body{display:flex!important}
  .vb-members-group{display:flex;margin:0;padding:0;border:0;background:none}

  .vb-nav-link{
    width:auto;

    min-width:42px;

    justify-content:center;

    padding:8px;

    font-size:0;
  }

  .vb-nav-icon{
    font-size:17px;
  }

  .vb-members-menu{
    display:flex;

    max-height:none;

    opacity:1;
  }

  .vb-members-toggle{
    display:none;
  }

  .vb-page{
    padding:34px 20px;
  }
}

/* =========================================================
   FINAL VALBASE UI POLISH
========================================================= */

/* Public sign-in stays independent from the sidebar navigation. */
.vb-admin-entry{border:0;background:none;padding:0;color:inherit;font:inherit;cursor:pointer}
.auth-modal [hidden]{display:none!important}
.vb-admin-entry:focus-visible{outline:2px solid #f5b659;outline-offset:4px}
.vb-online-panel{margin:12px 24px 80px;padding:20px;border:1px solid #31484c;background:#0a161b}
.vb-online-panel h2{font:600 20px Georgia,serif;color:#edc88d;margin:0 0 10px}
.vb-online-panel p{font:14px/1.6 Arial,sans-serif;color:#9ab1b8;margin:8px 0 16px}
.vb-online-grid{display:grid;grid-template-columns:repeat(20,minmax(0,1fr));gap:8px}
.vb-online-slot{position:relative;display:grid;place-items:center;aspect-ratio:1;border:1px solid #476451;border-radius:4px;background:#162724;color:#efc985;text-decoration:none;font:600 14px Arial,sans-serif;min-width:0}
.vb-online-slot img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:4px}
.vb-online-empty{border-color:#24383e;background:#0c1b20}
.vb-online-dot{position:absolute;right:3px;bottom:3px;width:8px;height:8px;border-radius:50%;background:#69d68a;border:2px solid #0b1817;box-shadow:0 0 5px #69d68a66}
.vb-online-slot:focus-visible{outline:2px solid #f5b659;outline-offset:3px}
@media(max-width:1000px){.vb-online-grid{grid-template-columns:repeat(10,minmax(0,1fr))}}
@media(max-width:600px){.vb-online-grid{grid-template-columns:repeat(5,minmax(0,1fr))}.vb-online-panel{margin:12px 12px 80px;padding:14px}}
body.vb-shell-active .vb-discord-login{
  position:static;
  z-index:150;
  display:inline-flex;
  align-items:center;
  gap:9px;
  min-height:42px;
  padding:10px 16px;
  border:1px solid #b77d39;
  border-radius:5px;
  background:linear-gradient(180deg,#784516,#28190d);
  color:#ffe0af;
  font:600 13px/1.2 Arial,sans-serif;
  box-shadow:0 4px 16px #0007;
  cursor:pointer;
}
.vb-shell-account{flex:0 0 auto;padding:8px;border-top:1px solid var(--vb-line-soft);background:#071014}
.vb-account-identity{display:flex;align-items:center;gap:8px;min-width:0;padding:0 3px 8px;color:#d9e0e1;font-size:12px}
.vb-account-identity[hidden],.vb-account-identity img[hidden]{display:none}
.vb-account-identity img{width:28px;height:28px;border-radius:50%;object-fit:cover;flex:none}
.vb-account-identity span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.vb-shell-account .vb-discord-login{width:100%;justify-content:center}
.vb-discord-login svg{width:20px;height:20px}
.vb-discord-login:hover{border-color:#f5b659;background:#784516}
.vb-discord-login.is-logout{
  border-color:#59646c!important;
  background:linear-gradient(180deg,#3f4850,#20262b)!important;
  color:#d1d7dc!important;
  box-shadow:0 4px 14px #0006!important;
  opacity:.78;
}
.vb-discord-login.is-logout:hover{border-color:#7d8a94!important;background:linear-gradient(180deg,#4b555e,#282f35)!important;opacity:1}
.vb-discord-login.is-busy{cursor:wait;opacity:.58}
.vb-discord-login:focus-visible,.toolbox-password-login:focus-visible{outline:2px solid #f5b659;outline-offset:4px}
body.vb-shell-active .workspace,body.vb-shell-active .vb-page{padding-bottom:76px}
.auth-modal{position:fixed;inset:0;margin:auto;max-width:calc(100vw - 28px);max-height:calc(100dvh - 32px);overflow:auto}
.auth-modal::backdrop{background:rgba(0,0,0,.76)}
@media(max-width:600px){
  .vb-shell-account{position:fixed;left:max(12px,env(safe-area-inset-left));bottom:max(12px,env(safe-area-inset-bottom));z-index:9001;padding:0;border:0;background:none}
  .vb-shell-account .vb-discord-login{width:auto;min-height:40px;padding:9px 12px;font-size:12px}
}

/*
 * 3x larger V brand.
 * Old mark was ~42 px.
 */




/*
 * Make section labels and nav more readable.
 */
.vb-nav-title{
  font-size:12px !important;
  letter-spacing:.16em !important;
}

.vb-nav-link{
  min-height:38px !important;

  padding:
    9px
    10px !important;

  font-size:15px !important;
}

.vb-nav-child{
  min-height:34px !important;

  font-size:14px !important;
}

/*
 * Login / Join are buttons now.
 */
.vb-nav-bottom button{
  display:block;

  width:100%;

  padding:9px;

  border-radius:7px;

  font-family:inherit;
  font-size:14px;
  font-weight:850;

  text-align:center;

  cursor:pointer;
}

.vb-login{
  border:1px solid transparent;

  background:transparent;

  color:#e0e5e5;
}

.vb-login:hover{
  border-color:#39484d;

  background:#101a1e;
}

.vb-join{
  margin-top:6px;

  border:1px solid #e49648;

  background:
    linear-gradient(
      #7b421f,
      #301c10
    );

  color:#ffd29a;
}

/*
 * Homepage tiny text was too tiny.
 */
body.vb-shell-active .destination-card small{
  font-size:10px !important;
}

body.vb-shell-active .looking-strip span{
  font-size:10px !important;
}

body.vb-shell-active .entity small{
  font-size:10px !important;
}

body.vb-shell-active .tags span{
  font-size:9px !important;
}

body.vb-shell-active .panel header button{
  font-size:11px !important;
}

body.vb-shell-active .toolbox-grid b{
  font-size:9px !important;
}

body.vb-shell-active .toolbox-grid small{
  font-size:8px !important;
}

body.vb-shell-active .popular{
  font-size:12px !important;
}

/*
 * Sidebar and content use the same visual family.
 */
.vb-shell{
  background:
    radial-gradient(
      circle at 80% 8%,
      rgba(48,74,69,.16),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      #081215,
      #080f12
    ) !important;

  border-right:
    1px solid #334148 !important;
}

@media(max-width:860px){

  

  

  .vb-nav-link{
    font-size:0 !important;
  }
}

/* ValBase brand mark: old gold flowing into weathered silver */




/* Reliable two-metal V inside the existing gold/silver frame */




/* Keep the gold/silver frame; restore a clean gold V inside */








/* ValBase unified sidebar brand dimensions */




/* =========================================================
   FINAL VALBASE UI POLISH
========================================================= */

/*
 * 3x larger V brand.
 * Old mark was ~42 px.
 */




/*
 * Make section labels and nav more readable.
 */
.vb-nav-title{
  font-size:12px !important;
  letter-spacing:.16em !important;
}

.vb-nav-link{
  min-height:38px !important;

  padding:
    9px
    10px !important;

  font-size:15px !important;
}

.vb-nav-child{
  min-height:34px !important;

  font-size:14px !important;
}

/*
 * Login / Join are buttons now.
 */
.vb-nav-bottom button{
  display:block;

  width:100%;

  padding:9px;

  border-radius:7px;

  font-family:inherit;
  font-size:14px;
  font-weight:850;

  text-align:center;

  cursor:pointer;
}

.vb-login{
  border:1px solid transparent;

  background:transparent;

  color:#e0e5e5;
}

.vb-login:hover{
  border-color:#39484d;

  background:#101a1e;
}

.vb-join{
  margin-top:6px;

  border:1px solid #e49648;

  background:
    linear-gradient(
      #7b421f,
      #301c10
    );

  color:#ffd29a;
}

/*
 * Homepage tiny text was too tiny.
 */
body.vb-shell-active .destination-card small{
  font-size:10px !important;
}

body.vb-shell-active .looking-strip span{
  font-size:10px !important;
}

body.vb-shell-active .entity small{
  font-size:10px !important;
}

body.vb-shell-active .tags span{
  font-size:9px !important;
}

body.vb-shell-active .panel header button{
  font-size:11px !important;
}

body.vb-shell-active .toolbox-grid b{
  font-size:9px !important;
}

body.vb-shell-active .toolbox-grid small{
  font-size:8px !important;
}

body.vb-shell-active .popular{
  font-size:12px !important;
}

/*
 * Sidebar and content use the same visual family.
 */
.vb-shell{
  background:
    radial-gradient(
      circle at 80% 8%,
      rgba(48,74,69,.16),
      transparent 34%
    ),
    linear-gradient(
      180deg,
      #081215,
      #080f12
    ) !important;

  border-right:
    1px solid #334148 !important;
}

@media(max-width:860px){

  

  

  .vb-nav-link{
    font-size:0 !important;
  }
}

/* Shared sidebar logo: identical geometry and typography on every page. */
.vb-brand{
  box-sizing:border-box;
  display:grid;
  place-items:center;
  flex:0 0 152px;
  width:100%;
  height:152px;
  min-height:152px;
  padding:0;
  border-bottom:1px solid var(--vb-line-soft);
  color:var(--vb-gold);
  text-decoration:none;
}
@media(max-width:860px){
  .vb-brand{
    flex:0 0 68px;
    width:68px;
    height:58px;
    min-height:58px;
    padding:7px;
    border-bottom:0;
    border-right:1px solid var(--vb-line-soft);
  }
}

/* Canonical forged emblem; grid centers the glyph independently of page styles. */
.vb-shell .vb-brand-mark{display:grid;place-items:center;isolation:isolate;box-sizing:border-box}
.vb-shell .vb-brand-mark::before{grid-area:1 / 1;align-self:center;justify-self:center;text-align:center}
.vb-shell .vb-brand-mark{position:relative;width:118px;height:118px;border:3px solid transparent;border-radius:24px;font-size:0;background:radial-gradient(circle at 50% 34%,rgba(244,185,88,.18),rgba(11,24,25,.98) 66%) padding-box,linear-gradient(145deg,#ffe2a0 0%,#d78a31 25%,#794116 54%,#efa94d 78%,#7e8d8f 100%) border-box;box-shadow:inset 0 0 0 1px rgba(255,225,157,.23),inset 0 0 0 3px rgba(54,30,13,.62),inset 0 0 34px rgba(231,146,42,.12),0 2px 0 rgba(255,214,133,.22),0 9px 26px rgba(0,0,0,.48),0 0 24px rgba(226,145,48,.18)}
.vb-shell .vb-brand-mark::before{content:"V";display:block;color:#efa348;-webkit-text-fill-color:#efa348;-webkit-text-stroke:1px #51250e;font:900 84px/.94 Cinzel,Georgia,"Times New Roman",serif;text-shadow:0 -1px 0 #fff0b2,1px 0 0 #b95b1f,-1px 0 0 #ffd279,0 2px 0 #8b421b,0 4px 0 #3d1d0d,0 7px 10px rgba(0,0,0,.82);filter:drop-shadow(0 0 8px rgba(242,166,68,.25));transform:translateY(-2px)}
.vb-shell .vb-brand-mark::after{content:"";position:absolute;right:20px;bottom:15px;left:20px;height:2px;background:linear-gradient(90deg,transparent,#94501d 9%,#f3b852 32%,#fff0b4 50%,#aab4b5 72%,#75451f 91%,transparent);box-shadow:0 1px 0 #000,0 0 6px rgba(235,164,67,.22)}
@media(max-width:860px){.vb-shell .vb-brand-mark{width:56px;height:56px;border-width:2px;border-radius:13px}.vb-shell .vb-brand-mark::before{font-size:39px;-webkit-text-stroke:.65px #51250e;transform:translateY(-1px)}.vb-shell .vb-brand-mark::after{right:10px;bottom:7px;left:10px;height:1px}}