.pc-two-col{grid-template-columns:5fr 7fr;align-items:stretch;gap:3rem;display:grid}.pc-copy{padding-top:.5rem}.pc-visual{background:#f1f1f3;background:lab(95.3428% .194937 -.729167);border-radius:.75rem;justify-content:center;align-items:stretch;padding:1.5rem;display:flex;overflow:hidden}.pc-tree{flex-direction:column;justify-content:center;align-items:center;gap:0;width:100%;display:flex;position:relative}.pc-row{justify-content:center;gap:10px;width:100%;display:flex;position:relative}.pc-row--single .pc-card{min-width:140px}.pc-row--three{padding-top:20px}.pc-row--three .pc-card{flex:1;max-width:180px}.pc-row--two{max-width:62%;padding-top:20px}.pc-row--two .pc-card{flex:1;max-width:180px}.pc-row--three:before{content:"";z-index:1;background:#c3c3c8;background:lab(79.068% .592202 -2.18269);height:2px;position:absolute;top:0;left:calc(16.6667% - 3.33333px);right:calc(16.6667% - 3.33333px)}.pc-row--two:before{content:"";z-index:1;background:#c3c3c8;background:lab(79.068% .592202 -2.18269);height:2px;position:absolute;top:0;left:calc(25% - 2.5px);right:calc(25% - 2.5px)}.pc-row--three .pc-card:before,.pc-row--two .pc-card:before{content:"";z-index:1;background:#c3c3c8;background:lab(79.068% .592202 -2.18269);width:2px;height:20px;position:absolute;top:-20px;left:50%;transform:translate(-50%)}.pc-stem{z-index:1;background:#c3c3c8;background:lab(79.068% .592202 -2.18269);width:2px;height:20px;margin-bottom:-1px;position:relative}.pc-card{z-index:3;background:#fff;border:1.5px solid #e1e1e4;border:1.5px solid lab(89.5255% .392109 -1.45693);border-radius:8px;align-items:flex-start;gap:10px;padding:12px 14px;transition:border-color .3s,box-shadow .3s;display:flex;position:relative}.pc-card__icon{color:#717177;color:lab(47.7134% .956506 -3.63976);background:#f1f1f3;background:lab(95.3428% .194937 -.729167);border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;width:28px;height:28px;margin-top:1px;display:flex}.pc-card__icon svg{width:16px;height:16px}.pc-card__body{flex-direction:column;gap:1px;min-width:0;display:flex}.pc-card__name{color:#07070b;color:lab(1.94666% .435621 -1.59158);white-space:nowrap;text-overflow:ellipsis;font-size:.8rem;font-weight:600;line-height:1.3;overflow:hidden}.pc-card__title{color:#47474d;color:lab(30.3123% .972807 -3.63013);font-size:.7rem;line-height:1.3}.pc-card__model{color:#717177;color:lab(47.7134% .956506 -3.63976);align-items:center;gap:5px;font-size:.68rem;line-height:1.3;display:flex}.pc-card__dot{background:#e5a536;border-radius:50%;flex-shrink:0;width:6px;height:6px}.pc-card.is-live{border-color:#22c55e;box-shadow:0 0 0 1.5px #22c55e40}.pc-card.is-live:after{content:"Active";color:#166534;letter-spacing:.02em;background:#dcfce7;border-radius:100px;padding:1px 7px;font-size:.58rem;font-weight:600;position:absolute;top:-9px;right:10px}.pc-packet{opacity:0;z-index:4;pointer-events:none;background:#22c55e;border-radius:4px;width:16px;height:8px;position:absolute;box-shadow:0 0 6px #22c55e99}.pc-tree .pc-card,.pc-tree .pc-stem,.pc-tree .pc-row--three:before,.pc-tree .pc-row--two:before,.pc-tree .pc-row--three .pc-card:before,.pc-tree .pc-row--two .pc-card:before{opacity:0}@keyframes pcNodeSlide{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}@keyframes pcFadeIn{0%{opacity:0}to{opacity:1}}.pc-tree.is-visible .pc-card{animation:.4s ease-out forwards pcNodeSlide;animation-delay:calc(var(--i) * .14s + 80ms)}.pc-tree.is-visible .pc-stem{animation:.25s forwards pcFadeIn;animation-delay:calc(var(--i) * .14s)}.pc-tree.is-visible .pc-row--three:before{animation:.25s .14s forwards pcFadeIn}.pc-tree.is-visible .pc-row--two:before{animation:.25s .56s forwards pcFadeIn}.pc-tree.is-visible .pc-row--three .pc-card:before,.pc-tree.is-visible .pc-row--two .pc-card:before{animation:.25s forwards pcFadeIn;animation-delay:calc(var(--i) * .14s)}@media (max-width:768px){.pc-two-col{grid-template-columns:1fr}.pc-visual{min-height:320px}.pc-row--two{max-width:75%}}@media (max-width:480px){.pc-card{gap:8px;padding:8px 10px}.pc-card__icon{width:24px;height:24px}.pc-card__icon svg{width:14px;height:14px}.pc-card__name{font-size:.72rem}.pc-card__model{font-size:.62rem}.pc-row--three .pc-card{max-width:140px}}