:root {
  --cw-shell-bg: #03111f;
  --cw-shell-surface: rgba(7, 30, 51, .94);
  --cw-shell-line: rgba(71, 159, 217, .24);
  --cw-shell-text: #f5fbff;
  --cw-shell-muted: #9db0c4;
  --cw-shell-cyan: #28d7f2;
  --cw-shell-blue: #4f86ff;
}

.cw-shell-enabled { padding-top: 92px !important; }
.cw-unified-header {
  position: fixed;
  inset: 0 0 auto;
  z-index: 1000;
  min-height: 84px;
  display: flex;
  align-items: center;
  gap: 20px;
  padding: 12px clamp(16px, 3vw, 38px);
  background: linear-gradient(90deg, rgba(3, 17, 31, .98), rgba(6, 28, 48, .96));
  border-bottom: 1px solid var(--cw-shell-line);
  box-shadow: 0 10px 36px rgba(0, 0, 0, .16);
  backdrop-filter: blur(18px);
}
.cw-unified-brand { display: inline-flex; align-items: center; gap: 11px; min-width: 168px; color: var(--cw-shell-text); text-decoration: none; }
.cw-unified-mark {
  width: 48px; height: 48px; display: grid; place-items: center; border-radius: 16px;
  color: #fff; font: 900 17px/1 Inter, system-ui, sans-serif; letter-spacing: -.06em;
  background: linear-gradient(135deg, #28d7f2, #4f86ff 74%);
  box-shadow: 0 0 28px rgba(40, 215, 242, .32);
}
.cw-unified-brand strong { display: block; font: 900 19px/1.05 Inter, system-ui, sans-serif; letter-spacing: -.04em; }
.cw-unified-brand small { display: block; margin-top: 4px; color: var(--cw-shell-cyan); font: 700 10px/1 Inter, system-ui, sans-serif; }
.cw-unified-nav { display: flex; flex: 1; align-items: center; gap: 8px; overflow-x: auto; scrollbar-width: none; }
.cw-unified-nav::-webkit-scrollbar { display: none; }
.cw-unified-nav a {
  flex: 0 0 auto; padding: 11px 15px; border: 1px solid rgba(97, 144, 184, .14); border-radius: 15px;
  color: #d4e2ef; background: rgba(12, 37, 62, .7); text-decoration: none; font: 800 13px/1 Inter, system-ui, sans-serif;
  transition: .18s ease;
}
.cw-unified-nav a:hover, .cw-unified-nav a.is-active { color: #fff; border-color: rgba(40, 215, 242, .62); background: linear-gradient(135deg, rgba(20, 91, 145, .76), rgba(9, 43, 76, .88)); box-shadow: 0 0 24px rgba(40, 215, 242, .12); }
.cw-unified-home { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; padding: 12px 16px; border-radius: 15px; color: #03111f; background: linear-gradient(135deg, #38dfff, #6d9cff); text-decoration: none; font: 900 13px/1 Inter, system-ui, sans-serif; box-shadow: 0 9px 26px rgba(40, 215, 242, .24); }

.cw-shell-enabled .stream-sidebar { top: 92px; height: calc(100vh - 92px); }
.cw-shell-enabled .login-layout { min-height: calc(100vh - 92px); }
.cw-shell-enabled .shell > .topbar { justify-content: flex-end; }
.cw-shell-enabled .shell > .topbar .brand { display: none; }
.cw-generic .topbar { display: none; }
.cw-generic .shell { padding-top: 0; }

@media (max-width: 880px) {
  .cw-shell-enabled { padding-top: 72px !important; }
  .cw-unified-header { min-height: 64px; gap: 10px; padding: 8px 12px; }
  .cw-unified-brand { min-width: auto; }
  .cw-unified-mark { width: 40px; height: 40px; border-radius: 13px; }
  .cw-unified-brand strong { font-size: 16px; }
  .cw-unified-brand small { display: none; }
  .cw-unified-nav { gap: 6px; }
  .cw-unified-nav a { padding: 9px 11px; border-radius: 12px; font-size: 12px; }
  .cw-unified-home { display: none; }
  .cw-shell-enabled .stream-sidebar { top: 0; height: auto; }
}