/* pulse view styles — extends the .pulse-grid/.pcol/.pcard rules in terminal.css */

/* ── header ── */
.pulse .phead{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;flex-wrap:wrap}
.ph-l{display:flex;align-items:center;gap:14px;min-width:0}
.ph-l h1{margin:0;font-family:var(--display);font-size:22px;font-weight:650;letter-spacing:-.025em}
.plive{display:inline-flex;align-items:center;gap:7px;height:26px;padding:0 11px;border-radius:999px;border:1px solid var(--line-2);
  background:var(--card);color:var(--text-2);font-size:11.5px;font-weight:600;white-space:nowrap;transition:color .2s,border-color .2s}
.plive i{width:7px;height:7px;border-radius:50%;background:var(--warn);flex-shrink:0}
.plive.ok{border-color:rgba(var(--up-rgb),.28)}
.plive.ok i{background:var(--up);animation:ping 1.8s ease-out infinite}
.plive.bad{color:var(--down);border-color:var(--down-line)}
.plive.bad i{background:var(--down)}
.ph-r{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.seg.pch{padding:3px;border-radius:var(--r)}
.pch button{display:inline-flex;align-items:center;gap:6px;height:30px;padding:0 11px 0 7px}
.pch .chain{width:17px;height:17px;border:0}
.pch .chain svg{width:9px;height:9px}
.pch button[aria-pressed=false] .chain{filter:saturate(.55) brightness(.85)}
.pulse .qb-box .qb-cur{color:var(--mute);font-weight:600;font-size:14px;padding-right:1px}
.pulse .qb-box input{width:62px}
.pulse .qb-box:focus-within{border-color:var(--brand-line);box-shadow:0 0 0 3px rgba(var(--brand-rgb),.08)}
.pmtabs{display:none}

/* ── columns ── */
.pcol-h{min-height:48px}
.pcol-h h3 .pci{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:8px;
  background:var(--card-2);border:1px solid var(--line-2)}
.pcol[data-col=fresh] .pci{color:var(--brand);background:var(--brand-soft);border-color:rgba(var(--brand-rgb),.22)}
.pcol[data-col=stretch] .pci{color:var(--warn);background:var(--warn-soft);border-color:rgba(243,192,79,.22)}
.pcol[data-col=migrated] .pci{color:var(--violet);background:rgba(167,139,250,.1);border-color:rgba(167,139,250,.24)}
.pcol-h .cnt{display:inline-flex;align-items:center;height:19px;padding:0 7px;border-radius:999px;background:var(--card-2);
  border:1px solid var(--line-2);font-size:11px;color:var(--mute)}
.pcol-h .cnt:empty{display:none}
.pch-r{display:flex;align-items:center;gap:6px}
.ptag{display:inline-flex;align-items:center;gap:5px;height:22px;padding:0 8px;border-radius:999px;background:var(--warn-soft);
  border:1px solid var(--warn-line);color:var(--warn);font-size:11px;font-weight:600;letter-spacing:.02em;animation:pop .2s var(--ease)}
.pcf{display:inline-flex;align-items:center;gap:5px;height:26px;padding:0 7px;border-radius:7px;color:var(--mute);font-size:11.5px;font-weight:600;
  transition:background .15s,color .15s}
.pcf:hover{background:var(--hover);color:var(--text)}
.pcf.on{color:var(--brand-text);background:var(--brand-soft);box-shadow:inset 0 0 0 1px var(--brand-line)}
.pcf-v:empty{display:none}

/* ── cards ── */
.pcard{align-items:stretch}
.pcard::before{content:"";position:absolute;left:0;top:12px;bottom:12px;width:2px;border-radius:2px;background:var(--brand);opacity:0;transform:scaleY(.3);
  transition:opacity .2s,transform .25s var(--ease)}
.pcard:hover::before{opacity:1;transform:none}
.pav{position:relative;flex-shrink:0;width:70px;height:70px;padding:4px;display:flex;align-self:center}
.pav-i{display:contents}
.pav .pring{position:absolute;inset:0;border-radius:15px;transition:--p .9s var(--ease),box-shadow .3s;
  background:conic-gradient(from 0deg,var(--brand-2) 0deg,var(--brand) calc(var(--p) * 3.6deg),rgba(255,255,255,.1) calc(var(--p) * 3.6deg) 360deg)}
.pav .pring.hot{box-shadow:0 0 16px -3px rgba(var(--brand-rgb),.6);animation:hotpulse 2.4s ease-in-out infinite}
.pav .pring.full{background:linear-gradient(140deg,#7cf5b4,var(--brand) 45%,var(--cyan))}
.pav .pring.none{background:none;box-shadow:inset 0 0 0 1px var(--line-2);animation:none}
.pcard .pav .av{position:relative;width:62px;height:62px;border-radius:var(--r-lg);box-shadow:0 0 0 2px var(--card),inset 0 1px 0 rgba(255,255,255,.18)}
.pcard:hover .pav .av{box-shadow:0 0 0 2px var(--hover),inset 0 1px 0 rgba(255,255,255,.18)}
.pav .chain{position:absolute;right:-3px;bottom:-3px;z-index:1}
@keyframes hotpulse{0%,100%{box-shadow:0 0 12px -4px rgba(var(--brand-rgb),.45)}50%{box-shadow:0 0 20px -2px rgba(var(--brand-rgb),.75)}}
.pc-main{justify-content:center}
/* the ticker is the identifier: the name gives way first */
.pc-l1 .sym{min-width:0;max-width:calc(100% - 22px);overflow:hidden;text-overflow:ellipsis;flex:0 0 auto}
.pc-l1 .nm{flex:0 1 auto;min-width:0;font-size:13px}
.pc-l1 .copy{flex-shrink:0}
.pc-l2 .age:empty{display:none}
.pc-l2r{display:flex;align-items:center;gap:7px;min-width:0;overflow:hidden;
  -webkit-mask-image:linear-gradient(90deg,#000 calc(100% - 14px),transparent);mask-image:linear-gradient(90deg,#000 calc(100% - 14px),transparent)}
.pc-l2 a,.pc-l2 .ib{display:inline-flex;color:var(--mute);transition:color .15s}
.pc-l2 a:hover,.pc-l2 .ib:hover{color:var(--text)}
.pc-l3{gap:4px}
.pc-l3 .chip{gap:3px}
.pc-l3 .chip.mute{color:var(--faint)}
.pc-bond{display:flex;align-items:center;gap:8px;font-size:11.5px;margin-top:1px}
.pc-bond .k{color:var(--faint);flex-shrink:0}
.pc-bond .bond{flex:1;height:5px;min-width:40px}
.pc-bond b{color:var(--brand);font-size:12px;font-weight:650;flex-shrink:0}
.pc-bond.hot .bond i{background:linear-gradient(90deg,var(--brand-2),var(--brand),#c8ffe0,var(--brand),var(--brand-2));background-size:220% 100%;animation:shine 1.8s linear infinite}
.pc-bond.hot b{text-shadow:0 0 10px rgba(var(--brand-rgb),.6)}
@keyframes shine{from{background-position:120% 0}to{background-position:-100% 0}}
.pc-r{justify-content:flex-start;gap:3px;min-width:86px;padding-top:2px}
.pc-r .pr{display:flex;align-items:center;gap:1px}
.pc-r .pr b{font-weight:600;color:var(--text-2)}
.pc-r .pr .mc{color:var(--text);border-radius:5px;padding:0 3px;margin:0 -3px}
.pbs{display:inline-flex;width:24px;height:4px;border-radius:3px;background:var(--down);overflow:hidden;margin-left:5px;gap:1px}
.pbs i{display:block;height:100%;background:var(--up);border-radius:3px}
.pc-r .qbtn{margin-top:auto;height:26px;padding:0 10px;border-radius:8px}

/* ── motion: first paint streams in, a new launch drops in glowing ── */
.pcard.enter{animation:cardin .7s var(--ease) backwards;animation-delay:calc(var(--i,0) * 45ms)}
.pcard.enter .pring:not(.full):not(.none),.pcard.pin .pring:not(.full):not(.none){animation:ringin 1.1s var(--ease) backwards;animation-delay:calc(var(--i,0) * 45ms + 120ms)}
.pcard.pin{animation:pcin .5s var(--spring),pglow 1.9s var(--ease)}
@keyframes ringin{from{--p:0}}
@keyframes pcin{from{opacity:0;transform:translateY(-14px) scale(.97)}}
@keyframes pglow{0%{background:rgba(var(--brand-rgb),.09);box-shadow:inset 0 0 0 1px var(--brand-line),inset 0 0 30px -6px rgba(var(--brand-rgb),.25)}
  100%{background:rgba(var(--brand-rgb),0);box-shadow:inset 0 0 0 1px rgba(var(--brand-rgb),0),inset 0 0 30px -6px rgba(var(--brand-rgb),0)}}

/* ── skeleton & empty states ── */
.pskel{cursor:default}
.pskel:hover{background:transparent}
.pskel::before{display:none}
.pskel .skel{display:block}
.sk-pav{width:70px;height:70px;border-radius:15px;flex-shrink:0}
.pskel .pc-main{gap:8px}
.pskel .pc-r{gap:7px;align-items:flex-end}
.pmsg{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:46px 22px;color:var(--mute);font-size:12.5px;animation:rise .4s var(--ease)}
.pmsg b{color:var(--text);font-size:14.5px;font-weight:650}
.pmsg p{margin:0;max-width:300px;line-height:1.55}
.pmsg .btn{margin-top:6px}

/* ── min-MC dropdown (inside UI.dropdown's .dd) ── */
.pcfd{width:210px}
.pcfd-h{padding:6px 9px 7px;color:var(--faint);font-size:11.5px;font-weight:600}
.dd .pcfd button.item{justify-content:space-between}
.dd .pcfd button.item.on{color:var(--brand-text)}

/* ── responsive (follows the view's width, dock or not) ── */
@container view (max-width:1500px){
  .pcard{padding:10px 12px;gap:10px}
  .pc-r{min-width:80px}
}
@container view (max-width:1060px){
  .pulse .pmtabs{display:grid;grid-template-columns:repeat(3,1fr);gap:4px;padding:3px;border-radius:var(--r-lg);background:var(--card);
    border:1px solid var(--line);margin-bottom:10px}
  .pmtabs button{height:34px;border-radius:9px;color:var(--mute);font-weight:600;font-size:12.5px;display:flex;align-items:center;justify-content:center;gap:6px;transition:background .15s,color .15s}
  .pmtabs button[aria-pressed=true]{background:#202228;color:var(--text)}
  .pmtabs .n{color:var(--faint);font-size:11px;font-weight:500}
  .pulse .pulse-grid{grid-template-columns:1fr;overflow:hidden}
  .pulse .pcol{display:none;min-height:0}
  .pulse .pcol.m-on{display:flex}
}
@container view (max-width:640px){
  .pulse .phead{gap:10px;margin-bottom:10px}
  .ph-r{width:100%;gap:8px}
  .seg.pch{width:100%;display:grid;grid-template-columns:repeat(4,1fr)}
  .pch button{justify-content:center;padding:0 6px}
  .pulse .qb-box{width:100%}
  .pulse .qb-box input{flex:1;width:auto;min-width:30px}
  .pcard{padding:10px 11px;gap:9px}
  .pav{width:56px;height:56px;padding:3px}
  .pav .pring{border-radius:13px}
  .pcard .pav .av{width:50px;height:50px;border-radius:10px}
  .pc-l1 .nm{display:none}
  .pc-r{min-width:72px}
}