/* ATLAS · committree.css — update-history tree in #reel (mounted by js/committree.js).
   Faux glass only: layered gradients, no backdrop-filter (card scrolls inside #app). */

#reel-inner.has-ct{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,440px);
  column-gap:clamp(32px,5vw,100px);align-items:start}
#reel-inner.has-ct > .eyebrow{grid-column:1/-1}
#reel-inner.has-ct #reel-lead{grid-column:1;grid-row:2}
#commit-tree{grid-column:2;grid-row:2;margin-top:26px;min-width:0;
  opacity:0;transform:translateY(34px);
  transition:opacity .9s var(--ease),transform 1.05s var(--ease)}
#commit-tree.ct-in{opacity:1;transform:none}

#commit-tree .ct-eyebrow{margin-bottom:18px}

.ct-card{position:relative;overflow:hidden;border-radius:22px;color:#fff;
  padding:26px 26px 26px 92px;
  background:
    linear-gradient(150deg,rgba(255,255,255,.09),rgba(255,255,255,.02) 34%,rgba(255,255,255,0) 62%),
    linear-gradient(180deg,#171a22,#0e1015 76%,#0b0d12);
  border:1px solid rgba(255,255,255,.08);
  box-shadow:0 32px 70px -32px rgba(11,13,20,.55),0 10px 28px -14px rgba(11,13,20,.35),
    inset 0 1px 0 rgba(255,255,255,.07)}
.ct-card::before{content:"";position:absolute;inset:0;border-radius:inherit;pointer-events:none;
  background:radial-gradient(120% 60% at 16% 0%,rgba(255,255,255,.09),rgba(255,255,255,0) 55%)}

.ct-rail{position:absolute;left:22px;top:0;width:56px;height:100%;display:block;pointer-events:none;overflow:visible}
.ct-trunk{stroke:rgba(255,255,255,.22);stroke-width:2;stroke-linecap:round}
.ct-branch{stroke:rgba(128,140,255,.5);stroke-width:2;stroke-linecap:round}
.ct-conn{stroke:rgba(255,255,255,.13);stroke-width:1.5;stroke-linecap:round}
.ct-node{fill:#141823;stroke:#8a96ff;stroke-width:2;
  transform:scale(0);transform-box:fill-box;transform-origin:center;
  transition:transform .65s cubic-bezier(.34,1.56,.64,1)}
.ct-node-latest{fill:var(--green);stroke:rgba(193,255,0,.32);stroke-width:5}
.ct-in .ct-node{transform:scale(1)}
.ct-halo{fill:none;stroke:rgba(193,255,0,.5);stroke-width:1.5;opacity:0;
  transform-box:fill-box;transform-origin:center}
.ct-in .ct-halo{animation:ctPulse 3.2s cubic-bezier(.4,0,.2,1) 1.6s infinite}
@keyframes ctPulse{
  0%{transform:scale(.42);opacity:.55}
  70%{transform:scale(2);opacity:0}
  100%{transform:scale(2);opacity:0}}

.ct-rows{list-style:none;margin:0;padding:0}
.ct-row{padding:13px 0;opacity:0;transform:translateX(24px);
  transition:opacity .7s var(--ease),transform .85s var(--ease)}
.ct-in .ct-row{opacity:1;transform:none}
.ct-top{display:flex;align-items:center;flex-wrap:wrap;gap:8px}
.ct-hash{font-family:var(--mono);font-size:11px;letter-spacing:.03em;color:rgba(255,255,255,.92);
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);
  border-radius:9px;padding:4px 9px;transition:border-color .3s var(--ease)}
.ct-row:hover .ct-hash{border-color:rgba(255,255,255,.3)}
.ct-tag{font-family:var(--mono);font-size:9px;letter-spacing:.18em;text-transform:uppercase;
  color:var(--green);background:rgba(193,255,0,.1);border:1px solid rgba(193,255,0,.28);
  border-radius:100px;padding:3px 9px 2px}
.ct-date{margin-left:auto;font-family:var(--mono);font-size:11px;letter-spacing:.04em;
  font-variant-numeric:tabular-nums;color:rgba(255,255,255,.45)}
.ct-msg{margin:8px 0 0;font-size:14px;line-height:1.5;color:rgba(255,255,255,.76);
  transition:color .3s var(--ease)}
.ct-row:hover .ct-msg{color:rgba(255,255,255,.95)}

@media (max-width:900px){
  #reel-inner.has-ct{display:block}
  #commit-tree{margin-top:56px;max-width:560px}
}
@media (max-width:480px){
  .ct-card{padding:22px 18px 22px 78px;border-radius:18px}
  .ct-rail{left:12px}
}

#commit-tree.ct-reduced,
#commit-tree.ct-reduced .ct-row,
#commit-tree.ct-reduced .ct-node{opacity:1;transform:none;transition:none}
#commit-tree.ct-reduced .ct-node{transform:scale(1)}
#commit-tree.ct-reduced .ct-halo{animation:none}
@media (prefers-reduced-motion:reduce){
  #commit-tree,#commit-tree .ct-row{opacity:1;transform:none;transition:none}
  #commit-tree .ct-node{transform:scale(1);transition:none}
  #commit-tree .ct-halo{animation:none}
}
