/* Chat Detective — shared animated atmosphere, navigation and floating overlays.
   Deliberately route-neutral: one visual shell for home, game and studio. */

/* The procedural mist now lives outside the SPA view so it survives navigation.
   It stays behind the actual content, never intercepts mouse or touch input,
   and does not contribute to the document's scrollable height. */
body.cdh-dark[data-view] > .cde-global-mist{
  position:fixed;
  inset:0;
  top:0;
  left:0;
  right:0;
  bottom:0;
  width:100%;
  height:100dvh;
  z-index:0;
  transform:none;
  pointer-events:none;
  overflow:hidden;
  background:#070916;
  isolation:isolate;
}
body.cdh-dark[data-view] > .page-shell{
  position:relative;
  z-index:1;
}

/* Keep one exact header geometry, typography and glass treatment on every route. */
body.cdh-dark[data-view] .site-header{
  position:relative;
  z-index:5000;
  width:min(100%,1280px);
  max-width:1280px;
  height:68px;
  padding:0 18px;
  gap:18px;
  overflow:visible;
  border:0;
  border-bottom:1px solid rgba(246,217,255,.25);
  border-radius:0;
  background:linear-gradient(180deg,rgba(224,204,247,.10),rgba(13,16,38,.06) 74%,rgba(13,16,38,.02));
  -webkit-backdrop-filter:blur(22px) saturate(150%);
  backdrop-filter:blur(22px) saturate(150%);
  box-shadow:inset 0 1px rgba(255,255,255,.095),0 6px 28px rgba(4,3,18,.12);
}
body.cdh-dark[data-view] .site-header .brand{
  gap:12px;
}
body.cdh-dark[data-view] .site-header .brand span{
  max-width:none;
  font-family:Inter,'Segoe UI',system-ui,sans-serif;
  font-size:21px;
  font-weight:800;
  letter-spacing:.035em;
  line-height:1.08;
  color:#f8f8fa;
}
body.cdh-dark[data-view] .site-header .brand .cdh-logo{
  width:43px;
  height:43px;
  color:#ed3a5b;
}
body.cdh-dark[data-view] .desktop-nav{
  margin-left:clamp(15px,4vw,70px);
  gap:clamp(22px,2.2vw,32px);
}
body.cdh-dark[data-view] .desktop-nav .nav-link{
  height:100%;
  font-size:14px;
  font-weight:500;
}
/* "Режимы" should be in the same place on every page, linking back to
   the home mode picker (including from the game and submission editor). */
body.cdh-dark[data-view]:not([data-view="home"]) .desktop-nav .cde-header-modes{
  display:inline-flex!important;
}
body.cdh-dark[data-view]:not([data-view="home"]) .mobile-nav .cde-mobile-modes{
  display:block!important;
}
body.cdh-dark[data-view] .site-header .cd-settings-trigger,
body.cdh-dark[data-view] .site-header #login-button{
  position:relative;
  isolation:isolate;
  overflow:hidden;
  border:1px solid rgba(252,227,255,.45);
  border-radius:9px;
  background:linear-gradient(120deg,rgba(250,232,255,.19),rgba(21,24,47,.15) 55%,rgba(235,102,175,.11));
  -webkit-backdrop-filter:blur(12px) saturate(145%);
  backdrop-filter:blur(12px) saturate(145%);
  box-shadow:inset 0 1px rgba(255,255,255,.23),0 4px 12px rgba(6,3,20,.15);
  transition:background .27s ease,border-color .27s ease,box-shadow .3s ease,transform .3s cubic-bezier(.2,.8,.2,1);
}
body.cdh-dark[data-view] .site-header .cd-settings-trigger::before,
body.cdh-dark[data-view] .site-header #login-button::before{
  content:"";
  position:absolute;
  inset:-45% auto -45% -63%;
  width:48%;
  background:linear-gradient(95deg,transparent,rgba(255,252,255,.28),transparent);
  transform:skewX(-24deg);
  opacity:0;
  pointer-events:none;
  transition:transform .62s cubic-bezier(.18,.75,.26,1),opacity .22s ease;
}
body.cdh-dark[data-view] .site-header .cd-settings-trigger:hover::before,
body.cdh-dark[data-view] .site-header #login-button:hover::before{
  opacity:.9;
  transform:skewX(-24deg) translateX(380%);
}
body.cdh-dark[data-view] .site-header .cd-settings-trigger:hover,
body.cdh-dark[data-view] .site-header #login-button:hover{
  transform:translateY(-2px);
  background:linear-gradient(120deg,rgba(255,239,255,.25),rgba(71,35,80,.21),rgba(236,79,146,.24));
  border-color:rgba(255,221,244,.83);
  box-shadow:inset 0 1px rgba(255,255,255,.36),0 6px 22px rgba(228,36,99,.21);
}

/* The settings popover is non-modal, but it must layer above the entire
   studio and game surface — even the panels with positioned descendants. */
body.cdh-dark[data-view] .site-header .cd-settings-anchor{
  position:relative;
  z-index:100;
}
body.cdh-dark[data-view] .site-header .cd-settings-panel,
body.cdh-dark[data-view] .site-header .cd-account-menu{
  z-index:6000;
}
body.cdh-dark[data-view] .mobile-nav{
  position:relative;
  z-index:4500;
}

@media(max-width:780px){
  body.cdh-dark[data-view] .site-header{
    height:58px;
    padding:0 10px;
  }
  body.cdh-dark[data-view] .desktop-nav{display:none}
  body.cdh-dark[data-view] .mobile-menu-toggle{display:inline-flex}
}
@media(max-width:520px){
  body.cdh-dark[data-view] .site-header{padding:0 5px}
  body.cdh-dark[data-view] .site-header .brand span{font-size:16px}
  body.cdh-dark[data-view] .site-header .brand .cdh-logo{width:36px;height:36px}
}
@media(prefers-reduced-motion:reduce){
  body.cdh-dark[data-view] .site-header .cd-settings-trigger::before,
  body.cdh-dark[data-view] .site-header #login-button::before{transition:none}
}