.viz-osi{border:1px solid var(--color-border);background:var(--color-surface);border-radius:4px;margin:1.5rem 0;padding:1.25rem 1.5rem}.viz-osi__stack{flex-direction:column;gap:3px;display:flex}.viz-osi__layer{text-align:left;border:1px solid var(--color-border);border-left:3px solid var(--color-secondary);background:var(--color-surface-2);width:100%;color:var(--color-text-muted);cursor:pointer;font-family:var(--font-mono);border-radius:2px;grid-template-columns:2.5rem 1fr auto auto;align-items:center;gap:.75rem;padding:.55rem .75rem;font-size:.8rem;transition:border-color .15s,background .15s,transform .15s;display:grid}.viz-osi__layer:hover{border-left-color:var(--color-primary)}.viz-osi__layer--active{border-color:var(--color-primary);border-left-color:var(--color-primary);color:var(--color-text)}.viz-osi__layer--wrapped{background:var(--color-primary-glow);border-left-color:var(--color-primary)}.viz-osi__layer--pulse{transform:translate(4px)}.viz-osi__num{color:var(--color-primary);font-weight:700}.viz-osi__name{color:var(--color-text)}.viz-osi__pdu{color:var(--color-accent);font-size:.68rem}.viz-osi__proto{color:var(--color-text-faint);font-size:.68rem}.viz-osi__controls{margin:1rem 0}.viz-osi__detail{border:1px solid var(--color-border);border-left:3px solid var(--color-primary);background:var(--color-surface-2);color:var(--color-text-muted);border-radius:0 2px 2px 0;padding:.875rem 1rem;font-size:.88rem}.viz-osi__detail strong{color:var(--color-text);font-family:var(--font-mono)}.viz-osi__detail-pdu{font-family:var(--font-mono);color:var(--color-accent);margin-left:.5rem;font-size:.7rem}.viz-osi__detail p{margin:.5rem 0 0}.viz-osi__detail-proto{color:var(--color-text-faint);font-size:.78rem}@media (width<=640px){.viz-osi__layer{grid-template-columns:2rem 1fr}.viz-osi__pdu,.viz-osi__proto{display:none}}@media (prefers-reduced-motion:reduce){.viz-osi__layer{transition:none}.viz-osi__layer--pulse{transform:none}}