/* =========================================================
   v1.21 — Motion System v2 · uniform whole-interface grammar
   Adds shared tab continuity, list/result arrival, live progress,
   counter changes and truthful transient operational states.
   ========================================================= */
:root{
  --motion-loop-slow:1.35s;
  --motion-loop-medium:.92s;
  --motion-distance-xs:3px;
  --motion-distance-sm:5px;
  --motion-selection-ring:0 0 0 2px rgba(var(--accent-rgb),.055);
}

/* Uniform selected/current treatment: continuity, not bounce. */
.delivery-card.active,.community-item.active,.proposal-card.selected,.review-output-card.active,
.output-card-v15.active,.asset-v18-card.active,.platform-card.active,.account-card.active,
.action-card-v118.active,.conv-item.active{
  transform:translateY(-1px);
  box-shadow:var(--motion-selection-ring);
}

/* Sliding active indicator for true tab strips. */
.cf-motion-tabs-v121{position:relative!important}
.cf-motion-tabs-v121>.cf-tab-indicator-v121{
  position:absolute;left:0;bottom:0;height:2px;width:0;border-radius:99px;background:var(--accent);
  pointer-events:none;z-index:4;opacity:0;transform:translateX(0);
  transition:transform var(--motion-small) var(--ease-emphasis),width var(--motion-small) var(--ease-emphasis),opacity var(--motion-fast) var(--ease-standard);
  box-shadow:0 0 10px rgba(var(--accent-rgb),.18)
}
.cf-motion-tabs-v121.cf-tab-ready-v121>.cf-tab-indicator-v121{opacity:1}
.cf-motion-tabs-v121>button.active{border-bottom-color:transparent!important}

/* New/updated items: one-shot only. */
@keyframes cf-item-arrive-v121{
  from{opacity:0;transform:translateY(var(--motion-distance-sm)) scale(.997)}
  to{opacity:1;transform:none}
}
@keyframes cf-item-update-v121{
  0%{box-shadow:0 0 0 0 rgba(var(--accent-rgb),.18)}
  100%{box-shadow:0 0 0 7px rgba(var(--accent-rgb),0)}
}
.cf-motion-enter-v121{animation:cf-item-arrive-v121 var(--motion-medium) var(--ease-enter)}
.cf-motion-updated-v121{animation:cf-item-update-v121 var(--motion-large) var(--ease-exit)}

/* Numerics don't jump horizontally when counters update. */
.cf-motion-counter-v121{font-variant-numeric:tabular-nums;display:inline-block;transform-origin:center}

/* Real job progress only: subtle moving sheen while 0 < progress < 100. */
.job.cf-job-live-v121 .progress{position:relative;overflow:hidden}
.job.cf-job-live-v121 .progress i{position:relative;overflow:hidden}
.job.cf-job-live-v121 .progress i::after{
  content:"";position:absolute;inset:0;width:42%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.18),transparent);
  transform:translateX(-150%);animation:cf-progress-sheen-v121 1.45s linear infinite
}
@keyframes cf-progress-sheen-v121{to{transform:translateX(350%)}}
.job>div:first-child b::before{
  content:"";width:6px;height:6px;border-radius:50%;display:inline-block;margin-right:6px;vertical-align:1px;background:var(--text-faint)
}
.job.cf-job-live-v121>div:first-child b::before{background:var(--accent);animation:cf-state-breathe-v120 var(--motion-loop-medium) ease-in-out infinite}
.job.cf-job-done-v121>div:first-child b::before{background:var(--good)}

/* Same state grammar across operation/status badges. Continuous motion only means ongoing activity. */
[data-cf-state-v121="processing"]>i,[data-cf-state-v121="syncing"]>i{
  background:var(--accent)!important;animation:cf-state-breathe-v120 var(--motion-loop-medium) ease-in-out infinite
}
[data-cf-state-v121="waiting"]>i{
  background:var(--warn)!important;animation:cf-state-breathe-v120 var(--motion-loop-slow) ease-in-out infinite
}
[data-cf-state-v121="success"]>i{background:var(--good)!important;animation:none!important}
[data-cf-state-v121="error"]>i{background:var(--bad)!important;animation:none!important}
[data-cf-state-v121="uncertain"]>i{background:var(--warn)!important;animation:none!important}
[data-cf-state-v121="paused"]>i{background:var(--text-faint)!important;animation:none!important}

/* Active pane continuity shared across CNT/Radar/Publish/Analyze/Operation. */
.cf-pane-transition-v121{transform-origin:top center}

/* Buttons using v1.20/v1.21 transient states keep width reasonably stable. */
button[data-motion-state-v120]{min-width:max-content}

/* Mobile: the moving tab indicator must remain part of the scrollable strip. */
@media(max-width:780px){
  .cf-motion-tabs-v121>.cf-tab-indicator-v121{bottom:0}
}

/* Reduced motion is a first-class mode, not an afterthought. */
@media(prefers-reduced-motion:reduce){
  .cf-motion-tabs-v121>.cf-tab-indicator-v121{transition:none!important}
  .cf-motion-enter-v121,.cf-motion-updated-v121{animation:none!important}
  .job.cf-job-live-v121 .progress i::after,.job.cf-job-live-v121>div:first-child b::before,
  [data-cf-state-v121="processing"]>i,[data-cf-state-v121="syncing"]>i,[data-cf-state-v121="waiting"]>i{animation:none!important}
  .delivery-card.active,.community-item.active,.proposal-card.selected,.review-output-card.active,
  .output-card-v15.active,.asset-v18-card.active,.platform-card.active,.account-card.active,
  .action-card-v118.active,.conv-item.active{transform:none!important}
}


/* =========================================================
   v1.24 — Community C03–C06 + Discover Dossier depth
   ========================================================= */
.community-depth-v124,.dossier-depth-v124{display:grid;gap:9px}
.depth-tabs-v124{display:flex;gap:3px;overflow:auto;border-bottom:1px solid var(--stroke-subtle);padding-bottom:3px}
.depth-tabs-v124 button{height:31px;border:0;border-radius:7px;background:transparent;color:var(--text-muted);padding:0 9px;font-size:9.5px;white-space:nowrap}
.depth-tabs-v124 button.active{background:var(--surface-selected);color:var(--text-primary)}
.depth-pane-v124{display:none}.depth-pane-v124.active{display:grid;gap:8px;animation:cf-motion-enter-v121 var(--motion-small) var(--ease-enter) both}
.depth-card-v124{border:1px solid var(--stroke-subtle);border-radius:9px;background:var(--surface-inset);padding:9px;display:grid;gap:6px}
.depth-card-v124>h4{margin:0;font-size:10.5px}.depth-card-v124>p{margin:0;color:var(--text-muted);font-size:9.3px;line-height:1.45}
.depth-kv-v124{display:grid;grid-template-columns:minmax(90px,120px) minmax(0,1fr);gap:7px;padding:5px 0;border-bottom:1px solid var(--stroke-subtle);font-size:9.2px}.depth-kv-v124:last-child{border-bottom:0}.depth-kv-v124 span{color:var(--text-muted)}
.depth-actions-v124{display:flex;gap:5px;flex-wrap:wrap}
.community-candidate-v124{display:none;border:1px solid var(--ai-border);background:var(--ai-surface);border-radius:8px;padding:8px;margin:7px 0;gap:6px}.community-candidate-v124.open{display:grid;animation:cf-motion-enter-v121 var(--motion-small) var(--ease-enter) both}.community-candidate-v124 b{font-size:9.8px;color:var(--ai-text)}.community-candidate-v124 p{margin:0;font-size:9.2px;line-height:1.45;color:var(--text-secondary)}
.community-save-state-v124{font-size:8.8px;color:var(--text-muted);margin-left:auto}.community-save-state-v124.saved{color:var(--good)}
.community-item.filtered-v124{display:none!important}
.community-operation-v124{display:grid;grid-template-columns:28px minmax(0,1fr) auto;gap:7px;align-items:center;padding:7px;border:1px solid var(--stroke-subtle);border-radius:8px;background:var(--surface-primary)}
.community-operation-v124>i{width:27px;height:27px;display:grid;place-items:center;border:1px solid var(--stroke-subtle);border-radius:7px;font-style:normal;color:var(--accent)}.community-operation-v124 b{display:block;font-size:9.8px}.community-operation-v124 p{margin:2px 0 0;font-size:8.8px;line-height:1.35;color:var(--text-muted)}
.community-result-v124{border-left:2px solid var(--accent);padding:6px 8px;background:var(--surface-inset);border-radius:0 7px 7px 0;font-size:9px;color:var(--text-secondary)}
.observation-inference-v124{display:grid;grid-template-columns:1fr 1fr;gap:7px}.observation-inference-v124>div{border:1px solid var(--stroke-subtle);border-radius:8px;padding:8px;background:var(--surface-primary)}.observation-inference-v124 b{font-size:9.5px}.observation-inference-v124 p{font-size:8.8px;line-height:1.4;color:var(--text-muted);margin:3px 0 0}
.dossier-shell-v124{display:grid;gap:9px}.dossier-hero-v124{border:1px solid var(--stroke-subtle);border-radius:10px;background:linear-gradient(180deg,var(--surface-primary),var(--surface-inset));padding:10px;display:grid;gap:7px}.dossier-hero-v124 h3{font-size:12px;margin:0}.dossier-hero-v124 p{font-size:9.3px;color:var(--text-muted);line-height:1.45;margin:0}.dossier-meta-v124{display:flex;gap:5px;flex-wrap:wrap}
.dossier-grid-v124{display:grid;grid-template-columns:1fr 1fr;gap:7px}.dossier-list-v124{display:grid;gap:6px}.dossier-row-v124{display:grid;grid-template-columns:30px minmax(0,1fr) auto;gap:7px;align-items:start;padding:8px;border:1px solid var(--stroke-subtle);border-radius:8px;background:var(--surface-primary)}.dossier-row-v124>i{width:28px;height:28px;border-radius:7px;border:1px solid var(--stroke-subtle);display:grid;place-items:center;font-style:normal;color:var(--accent);font-size:8px}.dossier-row-v124 b{display:block;font-size:9.6px}.dossier-row-v124 p{font-size:8.7px;line-height:1.4;color:var(--text-muted);margin:2px 0 0}.dossier-row-v124 small{font-size:8px;color:var(--text-faint);text-align:right}
.dossier-claim-v124{border:1px solid var(--stroke-subtle);border-radius:8px;padding:8px;display:grid;gap:5px;background:var(--surface-primary)}.dossier-claim-v124 header{display:flex;gap:6px;align-items:center}.dossier-claim-v124 header b{font-size:9.6px}.dossier-claim-v124 p{margin:0;font-size:8.9px;line-height:1.45;color:var(--text-secondary)}
.dossier-gap-job-v124{display:none;border:1px solid var(--ai-border);background:var(--ai-surface);border-radius:8px;padding:8px;gap:7px}.dossier-gap-job-v124.open{display:grid}.dossier-gap-progress-v124{height:4px;border-radius:99px;background:var(--surface-secondary);overflow:hidden}.dossier-gap-progress-v124>i{display:block;height:100%;width:0;background:var(--accent);transition:width var(--motion-medium) var(--ease-standard)}
.dossier-source-form-v124{display:grid;gap:7px}.dossier-source-form-v124 label{display:grid;gap:4px;font-size:8.8px;color:var(--text-muted)}.dossier-source-form-v124 input,.dossier-source-form-v124 textarea,.dossier-source-form-v124 select{border:1px solid var(--stroke-subtle);border-radius:7px;background:var(--surface-input);padding:7px;color:var(--text-primary);font-size:9.5px}.dossier-source-form-v124 textarea{min-height:74px;resize:vertical}
.dossier-following-v124{color:var(--good)!important;border-color:color-mix(in srgb,var(--good) 35%,var(--stroke-subtle))!important}
@media(max-width:680px){.observation-inference-v124,.dossier-grid-v124{grid-template-columns:1fr}.depth-kv-v124{grid-template-columns:1fr;gap:2px}.dossier-row-v124{grid-template-columns:28px minmax(0,1fr)}.dossier-row-v124 small{grid-column:2;text-align:left}.community-operation-v124{grid-template-columns:28px minmax(0,1fr)}.community-operation-v124>.btn{grid-column:1/-1;justify-self:end}}
@media(prefers-reduced-motion:reduce){.depth-pane-v124.active{animation:none!important}.dossier-gap-progress-v124>i{transition:none!important}}

/* v1.24 mobile depth surfaces remain opaque/readable over dense workspaces. */
#communityDepthDrawerV124,#communityNativeDrawerV124,#communityHistoryDrawerV124,#dossierDrawerV124,#dossierSourceDrawerV124{background:var(--surface-primary)!important}
@media(max-width:680px){
 #communityDepthDrawerV124,#communityNativeDrawerV124,#communityHistoryDrawerV124,#dossierDrawerV124,#dossierSourceDrawerV124{right:6px!important;left:6px!important;top:58px!important;width:auto!important;max-width:none!important;max-height:calc(100dvh - 124px)!important;border-radius:11px!important}
 #communityDepthDrawerV124 .drawer-body,#communityNativeDrawerV124 .drawer-body,#communityHistoryDrawerV124 .drawer-body,#dossierDrawerV124 .drawer-body,#dossierSourceDrawerV124 .drawer-body{max-height:calc(100dvh - 174px)!important}
}