.person-cards{--person-card-w:96px;--person-card-radius:20px;--person-ink:oklch(99% 0 0);--person-shade:oklch(14% .01 80/.84);--person-letter-bg:oklch(20% .01 80);--person-letter-glow:oklch(88% .19 125/.28);margin:-6px calc(var(--gutter,16px) * -1) 0;padding:8px var(--gutter,16px) 6px;overscroll-behavior-x:contain;scroll-padding-inline:var(--gutter,16px);scroll-snap-type:x proximity;scrollbar-width:none;-webkit-overflow-scrolling:touch;gap:10px;list-style:none;display:flex;overflow-x:auto}.person-cards::-webkit-scrollbar{display:none}.person-cards>li{scroll-snap-align:start;flex:none}.person-card{width:var(--person-card-w);aspect-ratio:3/4;isolation:isolate;border-radius:var(--person-card-radius);background:var(--person-letter-bg);box-shadow:var(--kadr-shadow-soft);color:var(--person-ink);font:inherit;cursor:pointer;-webkit-tap-highlight-color:transparent;transition:transform var(--kadr-duration-fast,.15s) var(--kadr-ease-out,ease-out);border:0;justify-content:center;align-items:flex-end;padding:0 8px 9px;text-decoration:none;display:flex;position:relative;overflow:hidden}.person-card:before{z-index:1;background:linear-gradient(0deg, var(--person-shade) 0%, transparent 52%);content:"";pointer-events:none;position:absolute;inset:0}.person-card:after{z-index:3;border-radius:inherit;box-shadow:inset 0 0 0 3px var(--kadr-color-accent), inset 0 0 0 4px var(--kadr-color-accent-line);content:"";opacity:0;pointer-events:none;transition:opacity var(--kadr-duration-fast,.15s) var(--kadr-ease-out,ease-out);position:absolute;inset:0}.person-card__media{z-index:0;position:absolute;inset:0}.person-card__img{z-index:0;object-fit:cover;width:100%;height:100%;transition:transform var(--kadr-duration-normal,.3s) var(--kadr-ease-out,ease-out);position:absolute;inset:0}.person-card__initial{z-index:0;background:radial-gradient(circle at 50% 42%, var(--person-letter-glow) 0%, transparent 62%);color:var(--person-ink);letter-spacing:-.02em;place-items:center;padding-bottom:18px;font-size:34px;font-weight:780;display:grid;position:absolute;inset:0}.person-card__name{z-index:2;max-width:100%;font-size:var(--kadr-text-caption);text-overflow:ellipsis;white-space:nowrap;font-weight:700;line-height:1.2;position:relative;overflow:hidden}.person-card__check{z-index:4;background:var(--kadr-color-accent);width:22px;height:22px;color:var(--kadr-color-on-accent);border-radius:50%;place-items:center;display:grid;position:absolute;top:7px;right:7px;box-shadow:0 2px 6px oklch(14% .01 80/.35)}.person-card.is-active{transform:translateY(-2px)}.person-card.is-active:after{opacity:1}.person-card:active,.person-card.is-active:active{transform:scale(.96)}.person-card:focus-visible{outline:var(--kadr-focus-ring,2px) solid var(--kadr-color-focus);outline-offset:3px}@media (hover:hover) and (pointer:fine){.person-card:hover .person-card__img{transform:scale(1.05)}}.person-card--add{flex-direction:column;align-items:center;gap:6px}.person-card__plus{z-index:2;background:var(--kadr-color-accent);width:26px;height:26px;color:var(--kadr-color-on-accent);transition:transform var(--kadr-duration-fast,.15s) var(--kadr-ease-out,ease-out);border-radius:50%;place-items:center;display:grid;position:relative}@media (hover:hover) and (pointer:fine){.person-card--add:hover .person-card__plus{transform:rotate(90deg)}}.person-sheet-layer>.kadr-sheet__overlay,.person-sheet-layer>.kadr-sheet{z-index:110}.person-sheet__limit{color:var(--kadr-color-text);font-size:var(--kadr-text-body,1rem);margin:0;line-height:1.45}@media (prefers-reduced-motion:reduce){.person-card,.person-card:after,.person-card__img,.person-card__plus{transition:none}.person-card.is-active,.person-card:active,.person-card.is-active:active,.person-card:hover .person-card__img,.person-card--add:hover .person-card__plus{transform:none}}
