body.has-site-reactive-scene{
  --site-scene-beat:0;
  --site-scene-energy:.08;
  background:#05070b;
}

body.has-site-reactive-scene:not(.page-community)::before{
  content:"";
  position:fixed;
  inset:0 0 auto 0;
  z-index:40;
  height:7.5rem;
  pointer-events:none;
  background:linear-gradient(180deg, rgba(6,8,12,.88), rgba(6,8,12,.56) 58%, rgba(6,8,12,0) 100%);
}

body.page-community.has-site-reactive-scene::before,
body.page-community.has-site-reactive-scene .siteReactiveScene{
  content:none !important;
  display:none !important;
}

.siteReactiveScene{
  position:fixed;
  inset:0;
  z-index:0;
  overflow:hidden;
  pointer-events:none;
  contain:layout paint style;
}

.siteReactiveScene::before,
.siteReactiveScene::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
}

.siteReactiveScene--public::before{
  background:
    radial-gradient(circle at 14% 18%, rgba(217,124,43,.16), transparent 24%),
    radial-gradient(circle at 84% 14%, rgba(112,148,174,.12), transparent 24%),
    radial-gradient(circle at 50% 74%, rgba(217,124,43,.08), transparent 28%),
    linear-gradient(180deg, rgba(6,8,12,.08), rgba(7,10,14,.22) 44%, rgba(4,6,10,.58));
  opacity:calc(.82 + (var(--site-scene-energy) * .24));
  transform:scale(calc(1 + (var(--site-scene-beat) * .06)));
  transform-origin:center center;
}

.siteReactiveScene--public::after{
  background:
    linear-gradient(90deg, rgba(6,8,12,.58), transparent 18%, transparent 82%, rgba(6,8,12,.58)),
    linear-gradient(180deg, rgba(255,255,255,.018), transparent 18%, transparent 78%, rgba(4,6,10,.62)),
    repeating-linear-gradient(90deg, rgba(255,255,255,.016) 0 1px, transparent 1px 72px);
  opacity:calc(.84 + (var(--site-scene-energy) * .08));
}

.siteReactiveScene__canvas{
  display:block;
  width:100vw;
  height:100vh;
  opacity:.94;
  transform:translateZ(0);
  will-change:transform, opacity;
}

.publicModeControls{
  display:inline-flex;
  align-items:center;
  gap:8px;
  flex-wrap:wrap;
  margin-left:10px;
  flex:0 0 auto;
}

.publicModeControls__button{
  min-height:38px;
  min-width:58px;
  justify-content:center;
  padding-inline:12px;
}

.publicModeControls__button.is-active{
  border-color:rgba(144,201,246,.58);
  background:linear-gradient(180deg, rgba(110,152,182,.28), rgba(40,58,76,.36));
  color:#fff;
  box-shadow:0 10px 24px rgba(112,166,210,.16);
}

.publicModeControls--compact .publicModeControls__button{
  min-height:36px;
}

@media (min-width: 1040px){
  html.has-site-lite-controls:not(.layout-embedded) .publicModeControls{
    position:fixed;
    top:calc(env(safe-area-inset-top, 0px) + 18px);
    right:clamp(16px, 2.4vw, 30px);
    z-index:54;
    margin-left:0;
    padding:8px;
    border:1px solid rgba(255,255,255,.09);
    border-radius:16px;
    background:rgba(7,10,14,.74);
    box-shadow:0 18px 46px rgba(0,0,0,.28);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
  }
  html.has-site-lite-controls:not(.layout-embedded) .has-public-mode-controls{
    margin-right:clamp(176px, 13vw, 220px);
    padding-top:clamp(42px, 3vw, 52px);
    align-items:flex-start;
  }
  html.has-site-lite-controls:not(.layout-embedded) body.page-community .communityTopbar{
    align-items:flex-start;
  }
  html.has-site-lite-controls:not(.layout-embedded) body.page-community .communityTopbar__right{
    padding-right:clamp(176px, 13vw, 220px);
    padding-top:clamp(42px, 3vw, 52px);
    align-items:flex-start;
  }
}

html.site-lite body.has-site-reactive-scene{
  --site-scene-beat:0;
  --site-scene-energy:.04;
}

html.site-lite body.has-site-reactive-scene::before,
html.site-lite .siteReactiveScene,
html.site-lite .radioHub__scene,
html.site-lite .statsHub__backdrop,
html.site-lite .playerHub__backdrop,
html.site-lite .profileHub__backdrop,
html.site-lite .marketHub__backdrop,
html.site-lite .newsHub__backdrop,
html.site-lite .basesHub__backdrop,
html.site-lite .baseHub__backdrop,
html.site-lite .baseCreateHub__backdrop,
html.site-lite .mapHub__backdrop,
html.site-lite .votePage__backdrop,
html.site-lite .radioHub__backdrop{
  display:none !important;
}

html.site-lite body.has-site-reactive-scene .statsHub::after,
html.site-lite body.has-site-reactive-scene .playerHub::after,
html.site-lite body.has-site-reactive-scene .profileHub::after,
html.site-lite body.has-site-reactive-scene .marketHub::after,
html.site-lite body.has-site-reactive-scene .newsHub::after,
html.site-lite body.has-site-reactive-scene .basesHub::after,
html.site-lite body.has-site-reactive-scene .baseHub::after,
html.site-lite body.has-site-reactive-scene .baseCreateHub::after,
html.site-lite body.has-site-reactive-scene .mapHub::after,
html.site-lite body.has-site-reactive-scene .votePage::after,
html.site-lite body.has-site-reactive-scene .communityPublicTabs::after,
html.site-lite body.has-site-reactive-scene .webchatFront::after{
  content:none !important;
}

html.site-lite body.has-site-reactive-scene .statsHub,
html.site-lite body.has-site-reactive-scene .playerHub,
html.site-lite body.has-site-reactive-scene .profileHub,
html.site-lite body.has-site-reactive-scene .marketHub,
html.site-lite body.has-site-reactive-scene .newsHub,
html.site-lite body.has-site-reactive-scene .basesHub,
html.site-lite body.has-site-reactive-scene .baseHub,
html.site-lite body.has-site-reactive-scene .baseCreateHub,
html.site-lite body.has-site-reactive-scene .mapHub,
html.site-lite body.has-site-reactive-scene .votePage,
html.site-lite body.has-site-reactive-scene .communityPublicTabs,
html.site-lite body.has-site-reactive-scene .webchatFront,
html.site-lite .radioHub{
  background:linear-gradient(180deg, rgba(8,10,14,.92), rgba(7,10,14,.98)) !important;
}

html.site-lite body.has-site-reactive-scene .rust-panel,
html.site-lite body.has-site-reactive-scene .panel,
html.site-lite body.has-site-reactive-scene .sitePanel,
html.site-lite .radioHub__hero,
html.site-lite .mapHub__hero,
html.site-lite .mapHub__board{
  box-shadow:0 14px 32px rgba(0,0,0,.22) !important;
}

body.has-site-reactive-scene main.wrap{
  position:relative;
  z-index:1;
  background:transparent;
  isolation:isolate;
}

body.has-site-reactive-scene .statsHub,
body.has-site-reactive-scene .playerHub,
body.has-site-reactive-scene .profileHub,
body.has-site-reactive-scene .marketHub,
body.has-site-reactive-scene .newsHub,
body.has-site-reactive-scene .basesHub,
body.has-site-reactive-scene .baseHub,
body.has-site-reactive-scene .baseCreateHub,
body.has-site-reactive-scene .mapHub,
body.has-site-reactive-scene .votePage,
body.has-site-reactive-scene .communityPublicTabs,
body.has-site-reactive-scene .webchatFront{
  position:relative;
  isolation:isolate;
  background:
    radial-gradient(circle at 14% 0%, rgba(217,124,43,.12), transparent 26rem),
    radial-gradient(circle at 86% 12%, rgba(110,146,174,.08), transparent 28rem),
    linear-gradient(180deg, rgba(7,10,14,.28), rgba(7,10,14,.54) 42%, rgba(7,10,14,.78)) !important;
}

body.has-site-reactive-scene .statsHub::after,
body.has-site-reactive-scene .playerHub::after,
body.has-site-reactive-scene .profileHub::after,
body.has-site-reactive-scene .marketHub::after,
body.has-site-reactive-scene .newsHub::after,
body.has-site-reactive-scene .basesHub::after,
body.has-site-reactive-scene .baseHub::after,
body.has-site-reactive-scene .baseCreateHub::after,
body.has-site-reactive-scene .mapHub::after,
body.has-site-reactive-scene .votePage::after,
body.has-site-reactive-scene .communityPublicTabs::after,
body.has-site-reactive-scene .webchatFront::after{
  content:"";
  position:absolute;
  inset:0;
  pointer-events:none;
  background:
    linear-gradient(90deg, rgba(255,255,255,.018) 0 1px, transparent 1px 70px),
    linear-gradient(0deg, rgba(255,255,255,.014) 0 1px, transparent 1px 38px);
  opacity:calc(.08 + (var(--site-scene-energy) * .08));
  mix-blend-mode:screen;
}

body.has-site-reactive-scene .statsHub__shell,
body.has-site-reactive-scene .playerHub__shell,
body.has-site-reactive-scene .profileHub__shell,
body.has-site-reactive-scene .marketHub__shell,
body.has-site-reactive-scene .newsHub__shell,
body.has-site-reactive-scene .basesHub__shell,
body.has-site-reactive-scene .baseHub__shell,
body.has-site-reactive-scene .baseCreateHub__shell,
body.has-site-reactive-scene .mapHub__shell,
body.has-site-reactive-scene .votePage__shell,
body.has-site-reactive-scene .communityPublicTabs__body,
body.has-site-reactive-scene .communityPublicTabs__head,
body.has-site-reactive-scene .webchatFront__shell{
  position:relative;
  z-index:1;
}

body.has-site-reactive-scene .statsHub__backdrop,
body.has-site-reactive-scene .playerHub__backdrop,
body.has-site-reactive-scene .newsHub__backdrop,
body.has-site-reactive-scene .basesHub__backdrop,
body.has-site-reactive-scene .baseHub__backdrop,
body.has-site-reactive-scene .baseCreateHub__backdrop,
body.has-site-reactive-scene .mapHub__backdrop,
body.has-site-reactive-scene .votePage__backdrop{
  opacity:calc(.12 + (var(--site-scene-energy) * .08));
}

body.has-site-reactive-scene.is-site-reactive .rust-panel,
body.has-site-reactive-scene.is-site-reactive .panel.panel--soft,
body.has-site-reactive-scene.is-site-reactive .votePage__hero,
body.has-site-reactive-scene.is-site-reactive .votePage__card{
  box-shadow:
    0 20px 52px rgba(0,0,0,.28),
    0 0 0 1px rgba(217,124,43,.06);
}

@media (max-width: 860px){
  body.has-site-reactive-scene::before{
    height:5.25rem;
  }

  .siteReactiveScene--public::after{
    background:
      linear-gradient(90deg, rgba(6,8,12,.52), transparent 10%, transparent 90%, rgba(6,8,12,.52)),
      linear-gradient(180deg, rgba(255,255,255,.012), transparent 16%, transparent 82%, rgba(4,6,10,.6));
  }
}

@media (max-width: 640px){
  .publicModeControls{
    width:100%;
    justify-content:stretch;
  }

  .publicModeControls__button{
    flex:1 1 0;
    justify-content:center;
  }
}
