:root{
  --zuni-accent:#ef1b24;
  --zuni-accent-soft:rgba(239,27,36,.12);
  --zuni-surface:#0b0f14;
  --zuni-surface-2:#111821;
  --zuni-surface-3:#161f2a;
  --zuni-line:rgba(255,255,255,.075);
  --zuni-line-strong:rgba(255,255,255,.13);
  --zuni-text:#f4f6f8;
  --zuni-muted:#8f9aa8;
}
.ops-app{
  background:
    radial-gradient(circle at 8% -12%,rgba(239,27,36,.085),transparent 28%),
    radial-gradient(circle at 80% -20%,rgba(255,255,255,.035),transparent 34%),
    var(--zuni-surface);
}
.ops-topbar{
  height:76px;
  padding:0 22px;
  background:rgba(8,11,16,.9);
  border-bottom:1px solid var(--zuni-line);
  box-shadow:0 12px 36px rgba(0,0,0,.18);
}
.ops-brand{gap:14px}
.zuni-brand-icon-header{
  display:none!important;
}
.ops-brand::before{
  content:"";
  width:42px;
  height:42px;
  flex:0 0 42px;
  position:relative;
  border:6px solid #f5f7fa;
  border-right-color:transparent;
  border-radius:50%;
  box-shadow:0 8px 24px rgba(0,0,0,.28);
}
.ops-brand::after{
  content:"";
  width:10px;
  height:10px;
  position:absolute;
  left:44px;
  top:38px;
  border-radius:50%;
  background:var(--zuni-accent);
  box-shadow:0 0 0 4px rgba(239,27,36,.11);
}
.ops-brand p{color:#7f8a99;letter-spacing:.16em;font-size:9px}
.ops-brand h1{
  font-size:21px;
  letter-spacing:-.02em;
  font-weight:780;
}
.ops-top-actions{gap:9px}
.ops-icon-button,.ops-logout,.zuni-lang-control{
  border-radius:12px!important;
  border-color:var(--zuni-line)!important;
  background:rgba(255,255,255,.025)!important;
}
.ops-status{
  border-radius:999px;
  background:rgba(255,255,255,.025);
  padding:8px 12px;
}
.ops-workspace{
  height:calc(100vh - 76px);
  grid-template-columns:minmax(310px,340px) minmax(560px,1fr) minmax(300px,340px);
}
.ops-inbox-panel,.ops-context-panel{
  background:rgba(12,17,24,.88);
  backdrop-filter:blur(20px);
}
.ops-inbox-heading{padding:22px 18px 14px}
.ops-inbox-heading h2{font-size:22px;letter-spacing:-.025em}
.ops-count{
  border-radius:999px;
  background:var(--zuni-accent-soft);
  color:#ff8b91;
}
.ops-view-nav{
  margin:0 12px 12px;
  padding:4px;
  border:1px solid var(--zuni-line);
  border-radius:14px;
  background:rgba(255,255,255,.018);
}
.ops-view-nav button{
  border-radius:10px;
  padding:9px 6px;
}
.ops-view-nav button.active{
  background:rgba(255,255,255,.07);
  color:#fff;
}
.ops-channels{gap:9px;padding:4px 12px 14px}
.ops-channel{
  padding:12px;
  border-radius:15px;
  background:linear-gradient(180deg,rgba(255,255,255,.035),rgba(255,255,255,.018));
}
.ops-channel:hover,.ops-channel.active{
  border-color:rgba(239,27,36,.38);
  background:linear-gradient(180deg,rgba(239,27,36,.08),rgba(255,255,255,.02));
}
.ops-channel-icon{
  border-radius:12px;
  background:#1a222d;
  color:#dfe6ef;
}
.ops-channel.active .ops-channel-icon{
  background:var(--zuni-accent-soft);
  color:#ff9ba0;
}
.ops-search{
  margin:0 12px 12px;
  min-height:44px;
  border-radius:13px;
  background:rgba(255,255,255,.022);
}
.ops-filters{padding:0 12px 12px}
.ops-filters button{
  padding:7px 10px;
  border-radius:999px;
}
.ops-filters button.active{
  color:#fff;
  border-color:rgba(239,27,36,.35);
  background:var(--zuni-accent-soft);
}
.ops-list{padding:0 9px 14px}
.ops-list-item{
  padding:13px 10px;
  border-radius:15px;
}
.ops-list-item.active,.ops-list-item:hover{
  background:rgba(255,255,255,.038);
  border-color:var(--zuni-line);
}
.ops-avatar{
  width:40px;height:40px;
  background:linear-gradient(145deg,#222c38,#151c25);
}
.ops-center-panel{
  background:
    radial-gradient(circle at 50% 0%,rgba(255,255,255,.028),transparent 30%),
    #0b1016;
}
.ops-center-header{
  min-height:84px;
  padding:16px 20px;
  background:rgba(12,17,24,.78);
  backdrop-filter:blur(16px);
}
.ops-center-header h2{font-size:19px;letter-spacing:-.02em}
.ops-pill{padding:7px 10px}
.ops-center-body{padding:24px}
.ops-message{
  max-width:min(68%,620px);
  padding:11px 13px;
  border-radius:16px;
  background:#151d27;
  border-color:rgba(255,255,255,.07);
  box-shadow:0 7px 22px rgba(0,0,0,.09);
}
.ops-message.outbound{
  background:rgba(239,27,36,.10);
  border-color:rgba(239,27,36,.22);
}
.ops-composer{
  margin:0 14px 14px;
  padding:10px;
  grid-template-columns:auto minmax(0,1fr) auto;
  border:1px solid var(--zuni-line);
  border-radius:18px;
  background:rgba(17,24,33,.92);
  box-shadow:0 16px 40px rgba(0,0,0,.22);
  backdrop-filter:blur(18px);
}
.ops-composer textarea{
  min-height:44px;
  max-height:132px;
  border-radius:13px;
  padding:12px 14px;
  background:rgba(0,0,0,.20);
  border-color:var(--zuni-line);
  color:var(--zuni-text);
}
.ops-composer textarea:focus{
  border-color:rgba(239,27,36,.45);
  box-shadow:0 0 0 3px rgba(239,27,36,.08);
}
.ops-compose-tools button,.ops-composer>button{
  height:42px;
  border-radius:12px;
}
.ops-composer>button:not(:disabled){
  background:var(--zuni-accent);
  border-color:var(--zuni-accent);
  color:#fff;
  font-weight:800;
  box-shadow:0 8px 22px rgba(239,27,36,.22);
}
.ops-context-tabs{
  height:58px;
  background:rgba(8,11,16,.35);
}
.ops-context-tabs button.active::after{background:var(--zuni-accent)}
.ops-context-body{padding:16px}
.ops-context-section{
  border-radius:16px;
  background:rgba(255,255,255,.024);
}
.zuni-send-confirm{
  grid-column:2 / 4;
  padding:0 4px 2px;
}
.zuni-send-status{
  grid-column:2 / 4;
  color:var(--zuni-muted);
}
:root[data-zuni-theme="light"] .ops-app{
  --zuni-surface:#f6f7f9;
  --zuni-surface-2:#fff;
  --zuni-surface-3:#f0f2f5;
  --zuni-line:rgba(17,24,39,.09);
  --zuni-line-strong:rgba(17,24,39,.14);
  --zuni-text:#111827;
  --zuni-muted:#697586;
}
:root[data-zuni-theme="light"] .ops-topbar,
:root[data-zuni-theme="light"] .ops-inbox-panel,
:root[data-zuni-theme="light"] .ops-context-panel,
:root[data-zuni-theme="light"] .ops-center-header{
  background:rgba(255,255,255,.9);
}
:root[data-zuni-theme="light"] .ops-center-panel{background:#f7f8fa}
:root[data-zuni-theme="light"] .ops-brand::before{border-color:#111;border-right-color:transparent}
:root[data-zuni-theme="light"] .ops-message{background:#fff}
@media(max-width:1180px){
  .ops-workspace{grid-template-columns:310px minmax(480px,1fr)}
}
@media(max-width:760px){
  .ops-topbar{height:66px;padding:0 12px}
  .ops-workspace{height:calc(100vh - 66px)}
  .ops-brand::before{width:36px;height:36px;flex-basis:36px;border-width:5px}
  .ops-brand::after{left:38px;top:34px;width:9px;height:9px}
  .ops-composer{margin:0 8px 8px}
}