/* DartVision v7.44.6 · Hero läuft hinter Header weiter + Avatar-Cropper Fix */
/* Ein gemeinsames, durchgehendes Bühnenbild: Header liegt halbtransparent darüber. */
.dvTopbar{
  position:relative!important;
  overflow:visible!important;
  isolation:isolate!important;
  background:linear-gradient(180deg,rgba(5,5,6,.90),rgba(3,3,4,.78))!important;
  border-bottom:0!important;
  box-shadow:0 10px 24px rgba(0,0,0,.34)!important;
}
.dvTopbar:before{
  content:""!important;
  display:block!important;
  position:absolute!important;
  left:0!important;right:0!important;top:0!important;
  height:calc(var(--dv-top-h) + 276px)!important;
  background:url('../branding/hero-reference-extended-7446.jpg') center top/100% 100% no-repeat!important;
  opacity:1!important;
  z-index:0!important;
  pointer-events:none!important;
  transform:none!important;
}
.dvTopbar:after{display:none!important}
.dvTopbar > *{position:relative!important;z-index:2!important}
/* Headerflächen bleiben lesbar, aber das Bild scheint sichtbar durch. */
.dvTopBrand{background:rgba(4,4,5,.70)!important}
.dvTopNav{background:rgba(5,5,6,.80)!important;backdrop-filter:blur(3px)!important}
.dvTopUtilities{background:transparent!important}
.dvTopMotto{background:rgba(4,4,5,.28)!important}

/* Im Hero selbst keine zweite Bildkopie: die Header-Bühne läuft nahtlos weiter. */
.dvHomeHero,.dvLiveHero{
  background:transparent!important;
  border-top:0!important;
  border-bottom:1px solid rgba(var(--accent-rgb),.26)!important;
  box-shadow:none!important;
  overflow:hidden!important;
  position:relative!important;
  z-index:1!important;
}
.dvHomeHero>.dvHeroReferenceImage,.dvLiveHero>.dvHeroReferenceImage{display:none!important}
#setupOverlay.homeMode .dvHomeHero{background:transparent!important}
#setupOverlay.homeMode .dvHomeHero:before,#setupOverlay.homeMode .dvHomeHero:after{display:none!important;content:none!important}
/* Home-Overlay bleibt unter dem Header, das durchgehende Headerbild liegt darüber und ist nicht klickbar. */
#setupOverlay.homeMode{background:#030202!important}

/* Cropper: echtes Herauszoomen sichtbar machen. */
.avatarZoomRow{display:grid;grid-template-columns:42px minmax(0,1fr) 42px;gap:10px;align-items:center}
.avatarZoomRow>button{width:42px;height:42px;border-radius:12px;border:1px solid rgba(255,255,255,.11);background:linear-gradient(180deg,#171315,#0b090a);color:#fff;font-size:24px;font-weight:900;line-height:1}
.avatarZoomRow>button:hover{border-color:rgba(var(--accent-rgb),.38);background:linear-gradient(180deg,#251316,#100a0b)}
.avatarZoomRow>label{display:grid!important;grid-template-columns:52px minmax(0,1fr)!important;gap:10px!important;align-items:center!important}
.avatarCropZoomValue{text-align:center;font-size:12px;font-weight:900;color:#f4edef;letter-spacing:.08em}
.avatarCropHint{line-height:1.45!important}

@media(max-width:920px){
  .dvTopbar:before{height:calc(var(--dv-top-h) + 190px)!important}
}