/* ============================================================
   JUJU v4 皮 · 整套(juju-skin.css)
   靛紫中性 · 干净分层 · 明度台阶
   --------------------------------------------------------------
   接法:在 app.css → juju-theme-dark.css 之后再加载本文件。
   滑动选中指示条需配套 juju-skin.js(调用 initJujuNavIndicator())。
   只换皮:挂真实类名,不改 DOM 结构/id、API、权限、SSE、功能出口。
   作用域:深色 html[data-theme="dark"] 为主,文末附浅色切换 html[data-theme="light"]。
   依据:JUJU-视觉动效规范-v4.md。基线已含 step2(身份色头像/柔光/右栏去重),本皮在其上叠加。
   ============================================================ */

/* ============================================================
   0 · 共享基建:中性桌面 + 外壳
   ============================================================ */
html[data-theme="dark"]{ background:#0B0B0D; }
html[data-theme="dark"] body::before{
  content:none; display:none; background:none;
}
html[data-theme="dark"] body::after{
  content:none; display:none; background:none; opacity:0;
}
/* 外壳透明,露出桌面;面板各自上玻璃/实色。Codex:如外层容器类名不同,补到这里。 */
html[data-theme="dark"] .juju-app,
html[data-theme="dark"] .juju-shell,
html[data-theme="dark"] .juju-root{ position:relative; z-index:1; background:transparent; }

/* ============================================================
   1 · 左侧栏 .juju-sidebar(通透玻璃)
   ============================================================ */
html[data-theme="dark"] .juju-sidebar{
  position:relative; z-index:3; padding:14px 10px;
  background:rgba(30,30,35,.42);
border-right:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.16);
}
html[data-theme="dark"] .juju-sidebar::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:-1;
  background:linear-gradient(180deg, rgba(0,0,0,.14), transparent 72px);
}
/* 统一栏距:内容文字全部对齐 22px(=10 padding + 12 内缩);盒子内缩 10px */
html[data-theme="dark"] .juju-logo-row{ padding:6px 12px 2px; }
html[data-theme="dark"] .juju-session-head{ padding:16px 12px 6px; }
html[data-theme="dark"] .juju-space-section-head{ padding:2px 12px 7px; }

/* 发起会话 → 幽灵描边 */
html[data-theme="dark"] .juju-new-chat{
  margin:14px 0 12px; background:transparent; color:#F1F1F4;
  border:1px solid rgba(255,255,255,.14); box-shadow:none; border-radius:11px; font-weight:500; min-height:37px;
  transition:background .18s cubic-bezier(.22,.78,.3,1), border-color .18s, transform .12s;
}
html[data-theme="dark"] .juju-new-chat:hover{ background:rgba(255,255,255,.06); border-color:#F1F1F4; }
html[data-theme="dark"] .juju-new-chat:active{ transform:scale(.985); }

/* 导航 + 滑动选中指示条(配 juju-skin.js) */
html[data-theme="dark"] .juju-primary-nav{ position:relative; }
html[data-theme="dark"] .juju-navind{
  position:absolute; left:0; width:100%; border-radius:9px; background:rgba(255,255,255,.06); z-index:0; pointer-events:none;
  transition:transform .42s cubic-bezier(.34,1.32,.5,1), height .42s cubic-bezier(.34,1.32,.5,1);
}
html[data-theme="dark"] .juju-navind::before{ content:""; position:absolute; left:3px; top:9px; bottom:9px; width:2.5px; border-radius:2px; background:#F1F1F4; }
html[data-theme="dark"] .juju-nav-item{ position:relative; z-index:1; padding:0 12px; color:#9595A0; background:transparent; border-radius:9px; transition:color .22s; }
html[data-theme="dark"] .juju-nav-item:hover{ color:#F1F1F4; }
html[data-theme="dark"] .juju-nav-item.active{ color:#F1F1F4; background:transparent; }
html[data-theme="dark"] .juju-primary-nav:not(:has(.juju-navind)) .juju-nav-item.active{ background:rgba(255,255,255,.06); }
html[data-theme="dark"] .juju-nav-icon{ opacity:.85; }
html[data-theme="dark"] .juju-unread{ font-family:'SF Mono','JetBrains Mono',monospace; color:#9595A0; }

/* 分区标签 / 计数 → mono 弱色 */
html[data-theme="dark"] .juju-section-label,
html[data-theme="dark"] .juju-space-section-head > span:first-child{
  font-family:'SF Mono','JetBrains Mono',ui-monospace,monospace; font-size:11px; letter-spacing:.06em; color:#616169; text-transform:none;
}
html[data-theme="dark"] .juju-session-count,
html[data-theme="dark"] .juju-space-section-count{ font-family:'SF Mono','JetBrains Mono',monospace; color:#616169; }

/* 搜索 */
html[data-theme="dark"] .juju-sidebar-search{ margin:0 0 8px; padding:0 12px; background:rgba(255,255,255,.04); border:0; border-radius:9px; transition:background .16s; }
html[data-theme="dark"] .juju-sidebar-search:focus-within{ background:rgba(255,255,255,.07); box-shadow:0 0 0 2px rgba(255,255,255,.10); }
html[data-theme="dark"] #groupSearch{ background:transparent; }

/* 会话项 */
html[data-theme="dark"] .juju-space{ margin:0; padding:9px 12px; border:0; border-radius:10px; background:transparent; transition:background .16s; }
html[data-theme="dark"] .juju-space:hover{ background:rgba(255,255,255,.06); }
html[data-theme="dark"] .juju-space.active{ background:rgba(255,255,255,.065); }
html[data-theme="dark"] .juju-space:focus{ outline:none; }
html[data-theme="dark"] .juju-space:focus-visible{ outline:2px solid #F1F1F4; outline-offset:-2px; }

/* 底部用户条 */
html[data-theme="dark"] .juju-sidebar-foot{ padding:12px 12px 2px; border-top:1px solid rgba(255,255,255,.09); background:transparent; }

/* ============================================================
   2 · 中间主区 .juju-main(深色画布 + 玻璃顶栏 + 队友卡 + 浮动命令条)
   ============================================================ */
html[data-theme="dark"] .juju-main{ position:relative; z-index:2; background:transparent; }
html[data-theme="dark"] .juju-messages{ background:transparent; }

/* 顶栏 → 玻璃(盖在滚动内容上,模糊最明显) */
html[data-theme="dark"] .juju-thread-header{
  position:relative; z-index:5;
  background:rgba(24,24,28,.58);
border-bottom:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.16);
}
html[data-theme="dark"] .juju-title{ font-weight:600; letter-spacing:0; }
html[data-theme="dark"] .juju-subtitle{ color:#9595A0; }
html[data-theme="dark"] .juju-live em,
html[data-theme="dark"] #sseText{ font-family:'SF Mono','JetBrains Mono',monospace; font-size:11px; color:#9595A0; }
html[data-theme="dark"] .juju-round-button{ color:#9595A0; background:transparent; border:0; border-radius:8px; transition:color .15s, background .15s, transform .12s; }
html[data-theme="dark"] .juju-round-button:hover{ color:#F1F1F4; background:rgba(255,255,255,.05); }
html[data-theme="dark"] .juju-round-button:active{ transform:scale(.94); }

/* 队友在岗 hero */
html[data-theme="dark"] .juju-team-hero h2{ font-size:19px; font-weight:600; letter-spacing:0; }
html[data-theme="dark"] .juju-team-hero p{ color:#9595A0; font-size:12.5px; }
html[data-theme="dark"] .juju-btn.primary{ background:#F1F1F4; color:#0B0B0D; border:1px solid #F1F1F4; border-radius:10px; font-weight:500; transition:opacity .15s, transform .12s; }
html[data-theme="dark"] .juju-btn.primary:hover{ opacity:.92; }
html[data-theme="dark"] .juju-btn.primary:active{ transform:scale(.97); }
html[data-theme="dark"] .juju-btn.plain{ background:rgba(255,255,255,.04); color:#9595A0; border:1px solid rgba(255,255,255,.14); border-radius:10px; transition:.15s; }
html[data-theme="dark"] .juju-btn.plain:hover{ color:#F1F1F4; border-color:#F1F1F4; }

/* 队友卡:通透卡面 + spring 悬停(身份色头像/柔光/药丸沿用 step2) */
html[data-theme="dark"] .juju-life-grid{ gap:13px; }
html[data-theme="dark"] .juju-life-card{
  background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:16px; box-shadow:none;
  transition:transform .42s cubic-bezier(.34,1.32,.5,1), border-color .25s, box-shadow .35s, background .25s;
}
html[data-theme="dark"] .juju-life-card.empty{ background:rgba(255,255,255,.025); border-color:rgba(255,255,255,.07); }
html[data-theme="dark"] .juju-life-card:hover{
  transform:translateY(-3px); border-color:rgba(255,255,255,.14); background:rgba(255,255,255,.065);
  box-shadow:0 16px 34px rgba(0,0,0,.34);
}
html[data-theme="dark"] .juju-life-role{ color:#9595A0; }
/* mini 按钮 */
html[data-theme="dark"] .juju-mini-btn{ background:transparent; color:#9595A0; border:1px solid rgba(255,255,255,.14); border-radius:9px; transition:.15s; }
html[data-theme="dark"] .juju-mini-btn:hover{ color:#F1F1F4; border-color:#F1F1F4; }
html[data-theme="dark"] .juju-mini-btn:active{ transform:scale(.96); }
html[data-theme="dark"] .juju-mini-btn.primary{ background:rgba(255,255,255,.065); color:#F1F1F4; border-color:rgba(255,255,255,.14); }

/* 活儿流水 */
html[data-theme="dark"] .juju-flow-panel{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:14px; }

/* —— 浮动命令条(队友主视图保留)——
   Codex:在 .juju-team-dashboard 内末尾加这段 markup,并把发送接到现有
   "@队友 / 派活 / 发消息" 流程(沿用 #teamNewTask 或 composer 的 send):
   <div class="juju-team-cmd">
     <span class="cmd-caret">›</span>
     <input class="cmd-input" placeholder="对队友说点什么 —— 帮我把这周的需求拆成任务">
     <button class="cmd-at">@ 队友</button>
     <button class="cmd-send" aria-label="发送">↑</button>
   </div>
*/
html[data-theme="dark"] .juju-team-cmd{
  position:sticky; bottom:16px; margin:18px 0 4px; z-index:6;
  display:flex; align-items:center; gap:11px; padding:6px 6px 6px 16px; border-radius:15px;
  background:rgba(255,255,255,.96); border:1px solid rgba(0,0,0,.13);
box-shadow:0 12px 34px rgba(0,0,0,.28), inset 0 .5px 0 rgba(255,255,255,.85);
  transition:border-color .25s;
}
html[data-theme="dark"] .juju-team-cmd:focus-within{ border-color:#1A1A1C; }
html[data-theme="dark"] .juju-team-cmd .cmd-caret{ font-family:'SF Mono',monospace; color:#9B9BA1; }
html[data-theme="dark"] .juju-team-cmd .cmd-input{ flex:1; border:0; outline:0; background:none; font-size:14px; color:#1A1A1C; padding:11px 0; }
html[data-theme="dark"] .juju-team-cmd .cmd-input::placeholder{ color:#9B9BA1; }
html[data-theme="dark"] .juju-team-cmd .cmd-at{ font:500 11.5px/1 'SF Mono',monospace; color:#6A6A70; padding:6px 9px; border-radius:8px; border:1px solid rgba(0,0,0,.08); background:none; cursor:pointer; }
html[data-theme="dark"] .juju-team-cmd .cmd-send{ width:36px; height:36px; border-radius:10px; border:0; background:#1A1A1C; color:#FFF; font-size:16px; cursor:pointer; transition:transform .2s cubic-bezier(.34,1.32,.5,1); }
html[data-theme="dark"] .juju-team-cmd .cmd-send:hover{ transform:translateY(-1px) scale(1.04); }
html[data-theme="dark"] .juju-team-cmd .cmd-send:active{ transform:scale(.94); }
html[data-theme="dark"] .juju-main.team-mode .juju-messages{ padding-bottom:104px; }
html[data-theme="dark"] .juju-main.team-mode .juju-team-cmd{ position:absolute; left:24px; right:24px; bottom:18px; margin:0; }
html[data-theme="dark"] .juju-team-cmd .cmd-label{
  flex:0 0 auto;
  max-width:112px;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#6A6A70;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
}
html[data-theme="dark"] .juju-team-cmd .cmd-input.phantom{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html[data-theme="dark"] .juju-loading-guide .juju-team-cmd,
html[data-theme="dark"] .juju-welcome .juju-team-cmd{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin:0 !important;
  width:100%;
}

/* ============================================================
   3 · 右栏 .juju-agent-panel(通透玻璃 + 紧凑面板)
   ============================================================ */
html[data-theme="dark"] .juju-agent-panel{
  position:relative; z-index:3;
  background:rgba(30,30,35,.42);
border-left:1px solid rgba(255,255,255,.09);
  box-shadow:inset 0 .5px 0 rgba(255,255,255,.16);
}
html[data-theme="dark"] .juju-agent-panel::before{
  content:""; position:absolute; inset:0; pointer-events:none; z-index:-1;
  background:linear-gradient(180deg, rgba(0,0,0,.14), transparent 72px);
}
/* 面板卡在玻璃上保持扁平,只有 stats/空态是抬起的小面 */
html[data-theme="dark"] .juju-panel-card{ background:transparent; border:0; box-shadow:none; }
html[data-theme="dark"] .juju-panel-title{ font-size:13px; font-weight:600; }
html[data-theme="dark"] .juju-panel-caption{ color:#616169; font-size:11.5px; }
html[data-theme="dark"] .juju-progress-overview{ gap:8px; }
html[data-theme="dark"] .juju-progress-stat{ background:rgba(255,255,255,.04); border:1px solid rgba(255,255,255,.09); border-radius:12px; }
html[data-theme="dark"] .juju-progress-stat b{ font-family:'SF Mono','JetBrains Mono',monospace; font-size:21px; letter-spacing:0; }
html[data-theme="dark"] .juju-progress-stat span{ color:#9595A0; font-size:10.5px; }
html[data-theme="dark"] .juju-progress-empty,
html[data-theme="dark"] .juju-project-empty{ border:1px dashed rgba(255,255,255,.14); border-radius:11px; color:#616169; }
html[data-theme="dark"] .juju-progress-empty b{ color:#9595A0; }
/* mini 按钮(添加 / 打开中心)沿用主区的 .juju-mini-btn 皮 */

/* ============================================================
   4 · 质量地板
   ============================================================ */
html[data-theme="dark"] :focus-visible{ outline:2px solid #F1F1F4; outline-offset:2px; border-radius:4px; }
@media (prefers-reduced-motion:reduce){
  html[data-theme="dark"] .juju-navind,
  html[data-theme="dark"] .juju-life-card,
  html[data-theme="dark"] .juju-new-chat,
  html[data-theme="dark"] .juju-nav-item,
  html[data-theme="dark"] .juju-round-button,
  html[data-theme="dark"] .juju-team-cmd .cmd-send{ transition:none; }
}

/* ============================================================
   5 · 浅色切换 html[data-theme="light"]
   ============================================================ */
html[data-theme="light"]{ background:#E9E9E6; }
html[data-theme="light"] body::before{
  content:none; display:none; background:none;
}
html[data-theme="light"] body::after{ content:none; display:none; background:none; opacity:0; }
html[data-theme="light"] .juju-app,
html[data-theme="light"] .juju-shell,
html[data-theme="light"] .juju-root{ background:transparent; }

/* light · 左栏 */
html[data-theme="light"] .juju-sidebar{ background:rgba(255,255,255,.5);border-right:1px solid rgba(0,0,0,.08); box-shadow:inset 0 .5px 0 rgba(255,255,255,.85); }
html[data-theme="light"] .juju-sidebar::before{ background:linear-gradient(180deg, rgba(255,255,255,.25), transparent 72px); }
html[data-theme="light"] .juju-new-chat{ color:#1A1A1C; border-color:rgba(0,0,0,.13); }
html[data-theme="light"] .juju-new-chat:hover{ background:rgba(0,0,0,.04); border-color:#1A1A1C; }
html[data-theme="light"] .juju-nav-item{ color:#6A6A70; }
html[data-theme="light"] .juju-nav-item:hover,
html[data-theme="light"] .juju-nav-item.active{ color:#1A1A1C; }
html[data-theme="light"] .juju-navind{ background:rgba(0,0,0,.05); }
html[data-theme="light"] .juju-navind::before{ background:#1A1A1C; }
html[data-theme="light"] .juju-primary-nav:not(:has(.juju-navind)) .juju-nav-item.active{ background:rgba(0,0,0,.05); }
html[data-theme="light"] .juju-section-label,
html[data-theme="light"] .juju-space-section-head > span:first-child,
html[data-theme="light"] .juju-session-count,
html[data-theme="light"] .juju-space-section-count{ color:#9B9BA1; }
html[data-theme="light"] .juju-sidebar-search{ background:rgba(0,0,0,.025); }
html[data-theme="light"] .juju-space:hover{ background:rgba(0,0,0,.04); }
html[data-theme="light"] .juju-space.active{ background:rgba(0,0,0,.05); }
html[data-theme="light"] .juju-space:focus-visible{ outline-color:#1A1A1C; }
html[data-theme="light"] .juju-sidebar-foot{ border-top:1px solid rgba(0,0,0,.08); }

/* light · 主区 */
html[data-theme="light"] .juju-main,
html[data-theme="light"] .juju-messages{ background:transparent; }
html[data-theme="light"] .juju-main{ position:relative; }
html[data-theme="light"] .juju-thread-header{ background:rgba(255,255,255,.66);border-bottom:1px solid rgba(0,0,0,.08); box-shadow:inset 0 .5px 0 rgba(255,255,255,.85); }
html[data-theme="light"] .juju-subtitle,
html[data-theme="light"] .juju-live em,
html[data-theme="light"] #sseText{ color:#6A6A70; }
html[data-theme="light"] .juju-round-button{ color:#6A6A70; }
html[data-theme="light"] .juju-round-button:hover{ color:#1A1A1C; background:rgba(0,0,0,.04); }
html[data-theme="light"] .juju-team-hero p{ color:#6A6A70; }
html[data-theme="light"] .juju-btn.primary{ background:#1A1A1C; color:#FFF; border-color:#1A1A1C; }
html[data-theme="light"] .juju-btn.plain{ background:rgba(0,0,0,.025); color:#6A6A70; border-color:rgba(0,0,0,.13); }
html[data-theme="light"] .juju-btn.plain:hover{ color:#1A1A1C; border-color:#1A1A1C; }
html[data-theme="light"] .juju-life-card{ background:rgba(0,0,0,.022); border-color:rgba(0,0,0,.08); }
html[data-theme="light"] .juju-life-card.empty{ background:rgba(0,0,0,.012); border-color:rgba(0,0,0,.06); }
html[data-theme="light"] .juju-life-card:hover{ background:rgba(0,0,0,.04); border-color:rgba(0,0,0,.13); box-shadow:0 16px 34px rgba(0,0,0,.09); }
html[data-theme="light"] .juju-life-role{ color:#6A6A70; }
html[data-theme="light"] .juju-avatar.life-online .juju-avatar-expression,
html[data-theme="light"] .juju-avatar.life-idle .juju-avatar-expression{ display:none; }
html[data-theme="light"] .juju-mini-btn{ color:#6A6A70; border-color:rgba(0,0,0,.13); }
html[data-theme="light"] .juju-mini-btn:hover{ color:#1A1A1C; border-color:#1A1A1C; }
html[data-theme="light"] .juju-mini-btn.primary{ background:rgba(0,0,0,.05); color:#1A1A1C; }
html[data-theme="light"] .juju-flow-panel{ background:rgba(0,0,0,.022); border-color:rgba(0,0,0,.08); }
html[data-theme="light"] .juju-team-cmd{
  z-index:6; display:flex; align-items:center; gap:11px; padding:6px 6px 6px 16px; border-radius:15px;
  background:rgba(255,255,255,.96); border:1px solid rgba(0,0,0,.13);
box-shadow:0 12px 34px rgba(0,0,0,.12), inset 0 .5px 0 rgba(255,255,255,.85);
  transition:border-color .25s;
}
html[data-theme="light"] .juju-team-cmd:focus-within{ border-color:#1A1A1C; }
html[data-theme="light"] .juju-team-cmd .cmd-caret{ font-family:'SF Mono',monospace; color:#9B9BA1; }
html[data-theme="light"] .juju-team-cmd .cmd-input{ flex:1; border:0; outline:0; background:none; font-size:14px; color:#1A1A1C; padding:11px 0; }
html[data-theme="light"] .juju-team-cmd .cmd-input::placeholder{ color:#9B9BA1; }
html[data-theme="light"] .juju-team-cmd .cmd-at{ font:500 11.5px/1 'SF Mono',monospace; color:#6A6A70; padding:6px 9px; border-radius:8px; border:1px solid rgba(0,0,0,.08); background:none; cursor:pointer; }
html[data-theme="light"] .juju-team-cmd .cmd-send{ width:36px; height:36px; border-radius:10px; border:0; background:#1A1A1C; color:#FFF; font-size:16px; cursor:pointer; transition:transform .2s cubic-bezier(.34,1.32,.5,1); }
html[data-theme="light"] .juju-team-cmd .cmd-send:hover{ transform:translateY(-1px) scale(1.04); }
html[data-theme="light"] .juju-team-cmd .cmd-send:active{ transform:scale(.94); }
html[data-theme="light"] .juju-main.team-mode .juju-messages{ padding-bottom:104px; }
html[data-theme="light"] .juju-main.team-mode .juju-team-cmd{ position:absolute; left:24px; right:24px; bottom:18px; margin:0; }
html[data-theme="light"] .juju-team-cmd .cmd-label{
  flex:0 0 auto;
  max-width:112px;
  overflow:hidden;
  text-overflow:ellipsis;
  color:#6A6A70;
  font-size:12px;
  font-weight:600;
  white-space:nowrap;
}
html[data-theme="light"] .juju-team-cmd .cmd-input.phantom{
  display:block;
  overflow:hidden;
  text-overflow:ellipsis;
  white-space:nowrap;
}
html[data-theme="light"] .juju-loading-guide .juju-team-cmd,
html[data-theme="light"] .juju-welcome .juju-team-cmd{
  position:relative !important;
  left:auto !important;
  right:auto !important;
  bottom:auto !important;
  margin:0 !important;
  width:100%;
}

/* light · 右栏 */
html[data-theme="light"] .juju-agent-panel{ background:rgba(255,255,255,.5);border-left:1px solid rgba(0,0,0,.08); box-shadow:inset 0 .5px 0 rgba(255,255,255,.85); }
html[data-theme="light"] .juju-agent-panel::before{ background:linear-gradient(180deg, rgba(255,255,255,.25), transparent 72px); }
html[data-theme="light"] .juju-panel-caption{ color:#9B9BA1; }
html[data-theme="light"] .juju-progress-stat{ background:rgba(0,0,0,.022); border-color:rgba(0,0,0,.08); }
html[data-theme="light"] .juju-progress-stat span{ color:#6A6A70; }
html[data-theme="light"] .juju-progress-empty,
html[data-theme="light"] .juju-project-empty{ border-color:rgba(0,0,0,.13); color:#9B9BA1; }
html[data-theme="light"] .juju-progress-empty b{ color:#6A6A70; }

/* ============================================================
   UX V · Direction B clean layering
   Order: keep this block at the very end of juju-skin.css.
   ============================================================ */

html[data-theme="dark"]{
  --bg-app:#0F0F13;
  --bg-chrome:#15151B;
  --surface-1:#1B1B22;
  --surface-2:#23232C;
  --inset:#0C0C10;
  --line:rgba(255,255,255,.07);
  --line-2:rgba(255,255,255,.11);
  --edge-hi:rgba(255,255,255,.04);
  --elev-1:0 1px 2px rgba(0,0,0,.40);
  --elev-2:0 2px 8px rgba(0,0,0,.36), 0 14px 32px rgba(0,0,0,.30);
  --ink:#F1F1F4;
  --muted:#9A9AAB;
  --faint:#62626C;
}
html[data-theme="light"]{
  --bg-app:#F4F4F2;
  --bg-chrome:#FBFBFA;
  --surface-1:#FFFFFF;
  --surface-2:#F7F7F5;
  --inset:#ECECEA;
  --line:rgba(0,0,0,.08);
  --line-2:rgba(0,0,0,.12);
  --edge-hi:rgba(255,255,255,.88);
  --elev-1:0 1px 2px rgba(0,0,0,.10);
  --elev-2:0 2px 8px rgba(0,0,0,.10), 0 14px 32px rgba(0,0,0,.06);
  --ink:#1A1A1C;
  --muted:#66666E;
  --faint:#9A9A9D;
}

html[data-theme] body::before,
html[data-theme] body::after{
  content:none !important;
  display:none !important;
  background:none !important;
  opacity:0 !important;
}

html[data-theme],
html[data-theme] body,
html[data-theme] #appView,
html[data-theme] .juju-app,
html[data-theme] .juju-shell,
html[data-theme] .juju-root{
  background:var(--bg-app) !important;
}

html[data-theme] .juju-main,
html[data-theme] .juju-messages,
html[data-theme] .juju-team-dashboard{
  background:var(--bg-app) !important;
}

html[data-theme] .juju-sidebar,
html[data-theme] .juju-agent-panel,
html[data-theme] .juju-thread-header{
  background:var(--bg-chrome) !important;
  box-shadow:none !important;
}
html[data-theme] .juju-sidebar{ border-right:1px solid var(--line) !important; }
html[data-theme] .juju-agent-panel{ border-left:1px solid var(--line) !important; }
html[data-theme] .juju-thread-header{ border-bottom:1px solid var(--line) !important; }
html[data-theme] .juju-sidebar::before,
html[data-theme] .juju-agent-panel::before{
  content:none !important;
  display:none !important;
  background:none !important;
}

html[data-theme] .juju-life-card,
html[data-theme] .juju-task-line,
html[data-theme] .juju-progress-stat,
html[data-theme] .juju-flow-panel{
  background:var(--surface-1) !important;
  border:1px solid var(--line-2) !important;
  border-radius:14px !important;
  box-shadow:var(--elev-1), inset 0 1px 0 var(--edge-hi) !important;
}
html[data-theme] .juju-life-card{
  min-height:0 !important;
  grid-template-rows:auto auto auto auto !important;
  gap:10px !important;
  padding:15px !important;
  transition:background .18s cubic-bezier(.2,0,0,1), box-shadow .18s cubic-bezier(.2,0,0,1), transform .18s cubic-bezier(.2,0,0,1), border-color .18s cubic-bezier(.2,0,0,1) !important;
}
html[data-theme] .juju-life-card.empty{ grid-template-rows:auto auto auto !important; }
html[data-theme] .juju-life-card:hover{
  background:var(--surface-2) !important;
  box-shadow:var(--elev-2), inset 0 1px 0 var(--edge-hi) !important;
  transform:translateY(-2px) !important;
}
html[data-theme] .juju-task-line{
  transform:none !important;
  transition:background .18s cubic-bezier(.2,0,0,1), border-color .18s cubic-bezier(.2,0,0,1), box-shadow .18s cubic-bezier(.2,0,0,1) !important;
}
html[data-theme] .juju-task-line:hover{
  background:var(--surface-2) !important;
  box-shadow:var(--elev-1), inset 0 1px 0 var(--edge-hi) !important;
  transform:none !important;
}
html[data-theme] .juju-task-card[data-status],
html[data-theme] .juju-result-card[data-status],
html[data-theme] .juju-review-card[data-status],
html[data-theme] .juju-project-task[data-status],
html[data-theme] .juju-task-line[data-status]{
  box-shadow:var(--elev-1), inset 0 1px 0 var(--edge-hi) !important;
}
html[data-theme] .juju-task-line[data-status]:hover{
  box-shadow:var(--elev-1), inset 0 1px 0 var(--edge-hi) !important;
}

html[data-theme] .juju-composer,
html[data-theme] .juju-team-cmd,
html[data-theme] #groupSearch,
html[data-theme] .juju-sidebar-search{
  background:var(--inset) !important;
  border:1px solid var(--line) !important;
  box-shadow:none !important;
}
html[data-theme] .juju-composer,
html[data-theme] .juju-team-cmd{
  border-radius:15px !important;
}
html[data-theme] .juju-composer:focus-within,
html[data-theme] .juju-team-cmd:focus-within,
html[data-theme] .juju-sidebar-search:focus-within{
  border-color:rgba(139,121,245,.55) !important;
  box-shadow:0 0 0 2px rgba(139,121,245,.40) !important;
}
html[data-theme] .juju-team-cmd .cmd-input,
html[data-theme] .juju-team-cmd .cmd-label{
  color:var(--ink) !important;
}
html[data-theme] .juju-team-cmd .cmd-caret,
html[data-theme] .juju-team-cmd .cmd-input::placeholder,
html[data-theme] .juju-team-cmd .cmd-at{
  color:var(--muted) !important;
}
html[data-theme] .juju-team-cmd .cmd-at{ border-color:var(--line) !important; }
html[data-theme] .juju-team-cmd .cmd-send{
  background:#8B79F5 !important;
  color:#fff !important;
}

html[data-theme] .juju-life-task{
  min-height:0 !important;
  padding:2px 0 0 !important;
  border:0 !important;
  border-radius:0 !important;
  background:transparent !important;
  box-shadow:none !important;
}
html[data-theme] button.juju-life-task:hover{ border-color:transparent !important; }
html[data-theme] .juju-life-actions{ align-self:start !important; }
html[data-theme] .juju-life-aura{ opacity:.06 !important; }
html[data-theme] .juju-avatar-expression,
html[data-theme] .juju-life-sweat-drop,
html[data-theme] .juju-avatar-confetti{
  display:none !important;
}

html[data-theme] .juju-life-state{
  background:rgba(255,255,255,.08) !important;
  color:#C9C9D2 !important;
}
html[data-theme="light"] .juju-life-state{
  background:rgba(0,0,0,.07) !important;
  color:#5A5A60 !important;
}
html[data-theme] .juju-life-card[data-life="failed"] .juju-life-state,
html[data-theme] .juju-life-card[data-life="blocked"] .juju-life-state,
html[data-theme] .juju-life-card:has(.life-failed) .juju-life-state,
html[data-theme] .juju-life-card:has(.fx-scratch) .juju-life-state,
html[data-theme] .juju-life-card:has(.juju-life-task[data-status="failed"]) .juju-life-state,
html[data-theme] .juju-life-card:has(.juju-life-task[data-status="blocked"]) .juju-life-state{
  background:rgba(240,162,59,.16) !important;
  color:#F0A23B !important;
}

html[data-theme] .juju-task-status.s-todo,
html[data-theme] .juju-task-status.s-queued{
  background:rgba(154,154,171,.16) !important;
  color:var(--muted) !important;
}
html[data-theme] .juju-task-status.s-doing{
  background:rgba(139,121,245,.16) !important;
  color:#8B79F5 !important;
}
html[data-theme] .juju-task-status.s-review,
html[data-theme] .juju-task-status.s-blocked{
  background:rgba(240,162,59,.16) !important;
  color:#F0A23B !important;
}
html[data-theme] .juju-task-status.s-failed{
  background:rgba(242,85,90,.16) !important;
  color:#F2555A !important;
}
html[data-theme] .juju-task-status.s-accepted{
  background:rgba(56,204,138,.16) !important;
  color:#38CC8A !important;
}

html[data-theme] .juju-task-bar,
html[data-theme] .juju-task-bar.sm{
  display:block !important;
  height:4px !important;
  margin-top:8px !important;
  border-radius:3px !important;
  background:var(--inset) !important;
}
html[data-theme] .juju-task-bar i{
  display:block !important;
  min-width:0 !important;
  background:#8B79F5 !important;
}

html[data-theme] .juju-thread-header #chatName,
html[data-theme] .juju-title,
html[data-theme] .juju-life-name,
html[data-theme] .juju-team-hero h2,
html[data-theme] .juju-progress-stat b{
  letter-spacing:0 !important;
}

html[data-theme="light"] .juju-life-card,
html[data-theme="light"] .juju-task-line,
html[data-theme="light"] .juju-progress-stat,
html[data-theme="light"] .juju-flow-panel{
  background:#FFFFFF !important;
}
html[data-theme="light"] .juju-life-card:hover,
html[data-theme="light"] .juju-task-line:hover{
  background:var(--surface-2) !important;
}

@media (prefers-reduced-motion:reduce){
  html[data-theme] .juju-life-card,
  html[data-theme] .juju-task-line,
  html[data-theme] .juju-team-cmd .cmd-send{
    transition:none !important;
    transform:none !important;
  }
  html[data-theme] .juju-life-card:hover{ transform:none !important; }
}
