/* CB Production · V30.190 · Studio banner, header avatar and settings fix */

#cb-client-pilot .cb-power-profile{
  position:relative;
  display:grid;
  grid-template-columns:auto minmax(0,1fr) auto;
  gap:28px;
  align-items:center;
  min-height:220px;
  margin:0 0 22px;
  padding:32px 34px;
  overflow:hidden;
  border:1px solid rgba(255,255,255,.09);
  border-radius:26px;
  background:
    radial-gradient(circle at 88% 10%,rgba(197,132,76,.22),transparent 34%),
    linear-gradient(90deg,rgba(4,4,4,.97) 0%,rgba(7,7,7,.90) 36%,rgba(10,8,7,.72) 66%,rgba(28,15,9,.58) 100%),
    url('/cb-profile-studio-banner-v30189.jpg') center 46%/cover no-repeat;
  color:#fff;
  box-shadow:0 26px 70px rgba(52,34,20,.16);
  isolation:isolate;
}

#cb-client-pilot .cb-power-profile::before{
  content:'';
  position:absolute;
  z-index:-1;
  inset:0;
  opacity:.27;
  background:
    repeating-linear-gradient(112deg,transparent 0 48px,rgba(255,255,255,.025) 49px 50px),
    linear-gradient(90deg,transparent 0 62%,rgba(184,112,55,.08));
  pointer-events:none;
}

.cb-power-avatar-wrap{
  position:relative;
  width:126px;
  height:126px;
  flex:0 0 auto;
}

.cb-power-avatar,
.cb-profile-avatar-preview{
  position:relative;
  display:grid;
  place-items:center;
  width:100%;
  height:100%;
  overflow:hidden;
  border:1px solid rgba(221,165,105,.55);
  border-radius:50%;
  background:linear-gradient(145deg,#c18b58,#75502d);
  color:#fff;
  box-shadow:0 0 0 7px rgba(255,255,255,.035),0 24px 50px rgba(0,0,0,.34);
  font-size:28px;
  font-weight:900;
  letter-spacing:-.04em;
}

.cb-power-avatar img,
.cb-profile-avatar-preview img,
#cb-pilot-avatar img,
.cb-stream-account-mark img{
  width:100%;
  height:100%;
  display:block;
  object-fit:cover;
}

.cb-power-avatar-edit{
  position:absolute;
  right:-2px;
  bottom:3px;
  display:grid;
  place-items:center;
  width:38px;
  height:38px;
  padding:0;
  border:3px solid #12100e;
  border-radius:50%;
  background:#f5eee5;
  color:#1a120c;
  box-shadow:0 8px 24px rgba(0,0,0,.30);
  cursor:pointer;
  font-size:17px;
  transition:transform .2s ease,background .2s ease;
}

.cb-power-avatar-edit:hover{transform:scale(1.08);background:#d9a16c}

.cb-power-identity h2{
  max-width:680px;
  margin:0;
  color:#fff!important;
  font-size:clamp(34px,4vw,58px)!important;
  line-height:.92!important;
  font-weight:820!important;
  letter-spacing:-.055em!important;
}

.cb-power-meta{
  display:flex;
  flex-wrap:wrap;
  gap:8px;
  margin-top:18px;
}

.cb-power-meta span{
  display:inline-flex;
  align-items:center;
  min-height:30px;
  padding:0 12px;
  border:1px solid rgba(255,255,255,.13);
  border-radius:999px;
  background:rgba(255,255,255,.055);
  color:rgba(255,255,255,.72);
  font-size:11px;
  font-weight:700;
}

.cb-power-meta span:first-child{
  border-color:rgba(210,162,115,.36);
  color:#e6b683;
}

.cb-power-metrics{
  display:grid;
  grid-template-columns:repeat(2,minmax(96px,1fr));
  min-width:240px;
  border-top:1px solid rgba(255,255,255,.14);
  border-bottom:1px solid rgba(255,255,255,.14);
}

.cb-power-metric{
  padding:18px 19px;
  border-right:1px solid rgba(255,255,255,.12);
}

.cb-power-metric:last-child{border-right:0}
.cb-power-metric strong,.cb-power-metric span{display:block}
.cb-power-metric strong{
  color:#fff;
  font-size:30px;
  line-height:1;
  font-weight:820;
  letter-spacing:-.045em;
}
.cb-power-metric span{
  margin-top:8px;
  color:rgba(255,255,255,.45);
  font-size:9px;
  font-weight:800;
  letter-spacing:.1em;
  text-transform:uppercase;
}

/* The small account identity now uses the actual photo too. */
#cb-pilot-avatar{
  overflow:hidden!important;
  padding:0!important;
  border-radius:50%!important;
  background:linear-gradient(145deg,#c18b58,#75502d)!important;
  color:#fff!important;
  font-size:10px!important;
}

.cb-stream-account-mark{
  overflow:hidden!important;
  padding:0!important;
  background:linear-gradient(145deg,#c18b58,#75502d)!important;
  color:#fff!important;
}

/* Avatar editor inside Settings. */
#cb-client-pilot #cb-profile-form{grid-column:span 2}
.cb-profile-avatar-editor{
  display:grid;
  grid-template-columns:92px minmax(0,1fr);
  gap:18px;
  align-items:center;
  margin:2px 0 22px;
  padding:17px;
  border:1px solid #ded4c8;
  border-radius:16px;
  background:#f7f1e9;
}
.cb-profile-avatar-preview{width:92px;height:92px;border-color:#c99a6d;color:#fff;font-size:22px;box-shadow:none}
.cb-profile-avatar-copy b{display:block;color:#1c1510;font-size:16px}
.cb-profile-avatar-copy p{margin:5px 0 12px;color:#776d64;font-size:12px;line-height:1.45}
.cb-profile-avatar-actions{display:flex;flex-wrap:wrap;gap:7px}
.cb-profile-avatar-actions button{
  min-height:36px;
  padding:0 13px;
  border:1px solid #d5c7b8;
  border-radius:999px;
  background:#fff;
  color:#221a14;
  cursor:pointer;
  font-size:11px;
  font-weight:800;
}
.cb-profile-avatar-actions button.primary{border-color:#17120e;background:#17120e;color:#fff}
.cb-profile-avatar-actions button[hidden]{display:none}

.cb-avatar-toast{
  position:fixed;
  z-index:20000;
  right:24px;
  bottom:24px;
  max-width:320px;
  padding:14px 17px;
  border:1px solid rgba(255,255,255,.12);
  border-radius:14px;
  background:#14110f;
  color:#fff;
  box-shadow:0 20px 55px rgba(0,0,0,.32);
  font-size:13px;
  opacity:0;
  transform:translateY(12px);
  pointer-events:none;
  transition:.25s ease;
}
.cb-avatar-toast.show{opacity:1;transform:none}

@media(max-width:1080px){
  #cb-client-pilot .cb-power-profile{grid-template-columns:auto minmax(0,1fr);gap:22px}
  .cb-power-metrics{grid-column:1/-1;width:100%;min-width:0}
}

@media(max-width:760px){
  #cb-client-pilot .cb-power-profile{
    grid-template-columns:1fr;
    gap:18px;
    min-height:0;
    padding:24px 20px;
    border-radius:20px;
  }
  .cb-power-avatar-wrap{width:96px;height:96px}
  .cb-power-avatar-edit{width:34px;height:34px;font-size:15px}
  .cb-power-identity h2{font-size:38px!important}
  .cb-power-meta{margin-top:14px}
  #cb-client-pilot .cb-power-profile{background-position:center,center,62% center}
  .cb-power-metrics{grid-column:auto;grid-template-columns:repeat(2,1fr)}
  .cb-power-metric{padding:15px 11px}
  .cb-power-metric strong{font-size:25px}
  .cb-power-metric span{font-size:8px}
  #cb-client-pilot #cb-profile-form{grid-column:auto}
  .cb-profile-avatar-editor{grid-template-columns:76px minmax(0,1fr);padding:13px;gap:13px}
  .cb-profile-avatar-preview{width:76px;height:76px}
  .cb-avatar-toast{right:12px;bottom:90px;left:12px;max-width:none}
}

@media(max-width:430px){
  .cb-power-metrics{grid-template-columns:1fr}
  .cb-power-metric{display:flex;align-items:center;justify-content:space-between;border-right:0;border-bottom:1px solid rgba(255,255,255,.1)}
  .cb-power-metric:last-child{border-bottom:0}
  .cb-power-metric span{margin:0;text-align:right}
}