.connections-shell{max-width:620px;background:#f8fcfd}.connections-heading{padding:18px 2px 12px;display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:14px}.connections-heading h1{margin:5px 0 6px;font-size:clamp(32px,9vw,43px);line-height:1.04;letter-spacing:-.045em}.connections-heading p{margin:0;color:var(--ocean-slate);font-size:14px;line-height:1.45}.connection-count{min-width:38px;height:38px;padding:0 10px;display:grid;place-items:center;border-radius:14px;background:var(--ocean-soft-aqua);color:var(--ocean-aqua-deep);font-size:13px;font-weight:800}.connection-list{display:grid;gap:11px}.connection-row{overflow:hidden;border:1px solid var(--ocean-line);border-radius:20px;background:#fff;box-shadow:var(--ocean-shadow-sm);transition:transform .14s ease,box-shadow .14s ease}.connection-row:active{transform:scale(.99)}.connection-main{min-width:0;padding:13px;display:grid;grid-template-columns:78px minmax(0,1fr);gap:13px;color:var(--ocean-ink);text-decoration:none}.connection-avatar{width:78px;height:94px;display:block;border-radius:16px;background:var(--ocean-cloud);object-fit:cover}.connection-avatar-fallback{display:grid;place-items:center;background:linear-gradient(145deg,#BDF5F0,#14D4C4);color:#fff;font:800 30px var(--font-heading)}.connection-copy{min-width:0}.connection-name-line{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:start;gap:7px}.connection-name-line h2{min-width:0;margin:2px 0 5px;overflow:hidden;color:var(--ocean-ink);font-size:clamp(18px,5.6vw,23px);line-height:1.14;text-overflow:ellipsis;white-space:nowrap}.connection-dupr{min-width:45px;padding:5px 6px;display:grid;justify-items:center;border:1.5px solid #72E4DA;border-radius:9px;color:var(--ocean-aqua-deep);background:#fff}.connection-dupr strong{font-size:13px;line-height:1}.connection-dupr small{margin-top:2px;font-size:7px;letter-spacing:.04em}.connection-copy p{margin:0 0 9px;display:flex;flex-wrap:wrap;gap:4px;color:var(--ocean-slate);font-size:11px;line-height:1.4}.connection-copy p strong{color:var(--ocean-aqua-deep)}.connection-copy .player-chip{max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.connection-row-footer{min-height:57px;padding:8px 10px 8px 14px;display:flex;align-items:center;justify-content:space-between;gap:10px;border-top:1px solid var(--ocean-line);background:#fbfefe}.connection-row-footer>span{color:var(--ocean-slate);font-size:10px}.connection-message-button{min-height:40px;padding:8px 13px;border-radius:11px;background:var(--ocean-gradient);color:#fff;font-size:12px;box-shadow:0 5px 14px rgba(20, 212, 196,.18)}.connection-message-button .ui-icon{width:17px;height:17px}.connections-empty{min-height:66vh;padding:34px 18px;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center}.connection-empty-icon{width:78px;height:78px;margin-bottom:20px;display:grid;place-items:center;border-radius:25px;background:var(--ocean-soft-aqua);color:var(--ocean-aqua-deep);box-shadow:var(--ocean-shadow-sm)}.connection-empty-icon .ui-icon{width:36px;height:36px}.connections-empty h1{max-width:410px;margin:8px 0 10px;font-size:clamp(30px,8.4vw,40px);line-height:1.1;letter-spacing:-.04em}.connections-empty p{max-width:410px;margin:0 0 22px;color:var(--ocean-slate);line-height:1.55}.connections-empty .button{width:min(100%,280px)}
.connection-created-shell .content{min-height:calc(100dvh - 64px);display:flex}.connection-celebration{position:relative;isolation:isolate;width:100%;min-height:72vh;padding:28px 8px;display:flex;flex-direction:column;align-items:center;justify-content:center;overflow:hidden;text-align:center}.celebration-court{position:absolute;z-index:-1;inset:12% -14% auto;height:245px;border:1px solid rgba(20, 212, 196,.13);border-radius:50%;background:linear-gradient(90deg,transparent 49.7%,rgba(20, 212, 196,.1) 50%,transparent 50.3%),linear-gradient(rgba(255,255,255,.2),rgba(188,235,238,.2));transform:perspective(420px) rotateX(64deg)}.celebration-court span{position:absolute;background:rgba(20, 212, 196,.12)}.celebration-court span:first-child{inset:50% 0 auto;height:1px}.celebration-court span:last-child{inset:0 auto 0 50%;width:1px}.connected-photos{height:174px;margin:21px 0 8px;display:flex;align-items:center;justify-content:center}.connected-person{position:relative;z-index:1;flex:none}.connected-person-you{animation:connect-from-left .72s cubic-bezier(.2,.8,.2,1) both}.connected-person-other{margin-left:-17px;animation:connect-from-right .72s cubic-bezier(.2,.8,.2,1) both}.connected-person img,.connected-avatar-fallback{width:122px;height:150px;display:block;border:5px solid #fff;border-radius:32px;object-fit:cover;box-shadow:var(--ocean-shadow-md)}.connected-avatar-fallback{display:grid;place-items:center;background:linear-gradient(145deg,#BDF5F0,#14D4C4);color:#fff;font:800 42px var(--font-heading)}.connection-ball{position:relative;z-index:3;width:43px;height:43px;margin:0 -8px;display:block;border:4px solid #fff;border-radius:50%;background:#D7FF3B;box-shadow:var(--ocean-shadow-sm);animation:connection-ball-bounce .9s cubic-bezier(.3,.75,.4,1) .12s both}.connection-ball i{position:absolute;width:5px;height:5px;border-radius:50%;background:#478e65}.connection-ball i:first-child{left:10px;top:10px}.connection-ball i:nth-child(2){right:9px;top:15px}.connection-ball i:last-child{left:17px;bottom:8px}.celebration-confirmation{width:35px;height:35px;margin:-3px 0 8px;display:grid;place-items:center;border-radius:50%;background:var(--ocean-aqua-deep);color:#fff;font-size:20px;font-weight:850;box-shadow:0 6px 18px rgba(20, 212, 196,.22);animation:connection-confirm .35s ease-out .62s both}.connection-celebration h1{margin:5px 0 8px;font-size:clamp(34px,10vw,48px);line-height:1;letter-spacing:-.055em}.connection-celebration>p{max-width:390px;margin:0;color:var(--ocean-slate);font-size:17px;line-height:1.5}.confirmation-actions{width:min(100%,380px);margin-top:25px;display:grid;gap:10px}.confirmation-actions .button{width:100%}.confirmation-text-link{min-height:44px;display:grid;place-items:center;color:var(--ocean-aqua-deep);font-size:13px;font-weight:750;text-decoration:none}@keyframes connect-from-left{from{opacity:.3;transform:translateX(-52px) rotate(-5deg)}to{opacity:1;transform:none}}@keyframes connect-from-right{from{opacity:.3;transform:translateX(52px) rotate(5deg)}to{opacity:1;transform:none}}@keyframes connection-ball-bounce{0%{opacity:0;transform:translateY(-36px) scale(.72)}42%{opacity:1;transform:translateY(8px) scale(1.05,.88)}68%{transform:translateY(-11px) scale(.96,1.04)}100%{transform:none}}@keyframes connection-confirm{from{opacity:0;transform:scale(.45)}to{opacity:1;transform:scale(1)}}
@media(max-width:359px){.connection-main{grid-template-columns:68px minmax(0,1fr);gap:10px;padding:11px}.connection-avatar{width:68px;height:86px}.connection-row-footer{padding-left:11px}.connection-message-button{padding-inline:10px}.connected-person img,.connected-avatar-fallback{width:104px;height:132px}.connected-photos{height:151px}.connection-ball{width:39px;height:39px}.connection-celebration{padding-inline:2px}.connection-celebration h1{font-size:32px}}
@media(prefers-reduced-motion:reduce){.connection-row{transition:none}.connected-person-you,.connected-person-other,.connection-ball,.celebration-confirmation{animation:none}}
.connection-message-button{min-height:44px;padding-block:9px}
