/* Shared Electric Aether theme for every member workspace. */
:root {
  --aether-blue: #3f8cff;
  --aether-violet: #8f5cff;
  --aether-pink: #e944bd;
  --aether-action: linear-gradient(105deg, #536bff, #9360ff 47%, #d743ae);
  --aether-surface: linear-gradient(145deg, rgba(14,12,25,.97), rgba(4,5,10,.98));
  --aether-edge: linear-gradient(135deg, rgba(66,141,255,.55), rgba(143,77,255,.2) 38%, rgba(226,54,188,.48));
}
.app-body, .portal-page {
  --blue: var(--aether-blue);
  --purple: var(--aether-violet);
  --pink: var(--aether-pink);
  --line: rgba(155,126,255,.16);
  background: radial-gradient(ellipse at 72% 22%,rgba(109,49,222,.13),transparent 23%), radial-gradient(ellipse at 20% 80%,rgba(48,91,255,.08),transparent 27%), radial-gradient(ellipse at 92% 72%,rgba(235,46,175,.09),transparent 24%), #030305;
}
.app-body .app-glow {
  background: radial-gradient(ellipse 480px 650px at -210px 70%,#030305 72%,rgba(30,113,255,.4) 73%,rgba(20,95,238,.12) 78%,transparent 86%),radial-gradient(ellipse 400px 620px at calc(100% + 260px) 40%,#030305 70%,rgba(160,25,211,.33) 71%,rgba(151,26,198,.1) 80%,transparent 91%);
  background-size:auto;
  mask-image:none;
}
.app-body .sidebar, .creator-app .c-sidebar { background:rgba(3,3,5,.92); border-color:rgba(155,126,255,.16); }
.app-body .app-brand { font-family:'Chakra Petch',sans-serif; letter-spacing:.3em; }
.app-body .side-nav { gap:7px; }
.app-body .side-nav button { border:1px solid transparent; font-family:'Chakra Petch',sans-serif; font-weight:500; }
.app-body .side-nav button.active {
  border-color:transparent;
  background:linear-gradient(110deg,#0e1528,#1c1026) padding-box,linear-gradient(110deg,#3f8cff99,#8f5cff55,#e944bd99) border-box;
  box-shadow:0 0 18px #7850ff12,inset 0 1px #ffffff06;
}
.app-body .side-nav button.active span { color:#ad80ff; }
.app-body .side-nav button:hover { color:white; background-color:#8f5cff0a; }
.app-body :is(.panel,.creator-card,.campaign-card,.resource-card,.resource-grid>article,.ticket,.sidebar-card,.admin-card), .portal-page .portal-card {
  border:1px solid transparent;
  border-radius:20px;
  background:var(--aether-surface) padding-box,var(--aether-edge) border-box;
  box-shadow:inset 0 1px #ffffff0a,0 15px 40px #0005,0 0 24px #683aff0f;
}
.app-body .metric {
  border:1px solid transparent;
  border-radius:15px;
  background:linear-gradient(135deg,#101e36,#080a12) padding-box,linear-gradient(135deg,#3f8cffb0,#7950ff33) border-box;
  box-shadow:0 0 20px #3f8cff0a,inset 0 1px #ffffff06;
}
.app-body .metric:nth-child(even) { background:linear-gradient(135deg,#25112d,#0d0813) padding-box,linear-gradient(135deg,#e944bd99,#8f5cff33) border-box; }
.app-body .metric strong { color:#f4f0ff; }
.app-body .metric>span, .app-body .metric>div>span { color:#b4a7c9; }
.app-body .metric small { color:#a498b6; }
.app-body .metric-grid { gap:14px; }
.app-body .dashboard-grid { gap:18px; margin-top:18px; }
.app-body :is(h1,h2,h3), .portal-page :is(h1,h2) { font-family:'Chakra Petch',sans-serif; }
.app-body .topbar h1 { font-size:clamp(21px,2vw,29px); letter-spacing:-.04em; }
.app-body .panel-head h2 { font-size:19px; }
.app-body :is(.primary-action,.drawer .primary-action), .portal-page .portal-form .button {
  background:var(--aether-action);
  border:1px solid rgba(230,195,255,.22);
  border-radius:999px;
  color:#fff;
  box-shadow:0 6px 22px rgba(127,78,255,.25);
  font-family:'Chakra Petch',sans-serif;
}
.app-body .primary-action:hover, .portal-page .portal-form .button:hover { filter:brightness(1.1); box-shadow:0 6px 28px rgba(127,78,255,.4); }
.app-body :is(.campaign-card button,.resource-grid button,.ticket button), .portal-page .demo-access button {
  border:1px solid rgba(171,136,255,.38);
  border-radius:999px;
  background:rgba(10,8,18,.68);
  color:#dbd2e6;
  padding:10px 14px;
  font-family:'Chakra Petch',sans-serif;
}
.app-body :is(.campaign-card button,.resource-grid button,.ticket button):hover, .portal-page .demo-access button:hover { background:rgba(78,50,130,.35); border-color:#a879f5; }
.app-body .progress i { background:linear-gradient(90deg,#3f8cff,#8f5cff 50%,#e944bd); }
.app-body .campaign-hero { background:linear-gradient(115deg,#405fff24,#9744db30 58%,#d440af20); border:1px solid #a478ff22; }
.app-body .sparkline path { stroke:#9360ff; }
.app-body :is(.panel-head button,.panel-action) { color:#c262fa; }
.app-body :is(.drawer,.notification-popover) { background:#090710; border-color:rgba(155,126,255,.25); box-shadow:0 15px 45px #0008; }
.app-body :is(.search,#role-switcher,.period-button,.filter-bar select,.drawer select) { border-color:rgba(171,136,255,.24); background:#0b0912; }
.app-body :focus-visible, .portal-page :focus-visible { outline:2px solid #ad80ff; outline-offset:3px; }
.portal-page .login-story { background:radial-gradient(ellipse at 10% 65%,#3f8cff16,transparent 60%),radial-gradient(ellipse at 95% 20%,#8f5cff20,transparent 55%),transparent; }
.portal-page .login-panel { background:transparent; }
.portal-page .portal-card { border-radius:28px; }
.portal-page .portal-card h2 { letter-spacing:-.04em; }
.portal-page .demo-access { background:#8f5cff06; border-color:rgba(155,126,255,.18); border-radius:15px; }
.portal-page .portal-form input { border-color:rgba(171,136,255,.24); background:#08070e; border-radius:10px; }
.portal-page .portal-form input:focus { border-color:#9360ff; }
@media(max-width:700px) {
  .app-body .app-glow { opacity:.65; }
  .app-body .topbar { flex-wrap:wrap; gap:12px; padding-block:16px; }
  .app-body .topbar h1 { font-size:20px; }
  .app-body .panel-head h2 { font-size:17px; }
  .app-body .dashboard-grid { gap:14px; }
}
@media(prefers-reduced-motion:reduce) { .app-body *, .portal-page * { animation:none !important; transition:none !important; } }
/* Allow dense team tables and attention rows to fit narrow workspaces. */
.app-body :is(.dashboard-grid,.admin-grid,.campaign-grid,.creator-card-grid,.resource-grid)>* { min-width:0; }
.app-body .attention-item { grid-template-columns:34px minmax(0,1fr) auto 15px; }
.app-body .attention-item span:nth-child(2) { min-width:0; }
@media(max-width:700px) {
  .app-body .dashboard-grid { grid-template-columns:minmax(0,1fr); }
  .app-body .panel-head { gap:10px; flex-wrap:wrap; }
  .app-body .attention-item { gap:8px; }
  .app-body .attention-item small { line-height:1.5; }
}