.cam-card{position:relative;max-width:100%;min-width:0;border-radius:14px;overflow:hidden;background:var(--c-card);box-shadow:0 2px 12px #00000059;contain:layout paint;content-visibility:auto;contain-intrinsic-size:300px 460px;transition:transform .22s ease,box-shadow .22s ease;border:1px solid rgba(255,255,255,.04)}.cam-card.touched{transform:translateY(-4px) scale(1.015);box-shadow:0 12px 40px #0000008c,0 0 0 1px #ec3f6847;border-color:#ec3f6833}.cam-card.touched .thumb-wrap img{animation:card-live 2.4s ease-in-out infinite}.cam-card.touched .thumb-wrap:after{opacity:1;animation:live-sweep 2.4s ease-in-out infinite}.cam-card:hover{transform:translateY(-4px) scale(1.015);box-shadow:0 12px 40px #0000008c,0 0 0 1px #ec3f6847;border-color:#ec3f6833}.thumb-link{display:block;position:relative}.thumb-wrap{position:relative;aspect-ratio:4/5;background:#111;overflow:hidden}.thumb-wrap img{position:relative;z-index:1;width:100%;height:100%;object-fit:cover;object-position:50% 30%;transition:transform .4s ease,filter .4s ease;will-change:transform,filter}.thumb-fallback{position:absolute;inset:0;z-index:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:radial-gradient(circle at 30% 20%,rgba(236,63,104,.22),transparent 55%),radial-gradient(circle at 70% 80%,rgba(184,230,58,.1),transparent 60%),linear-gradient(160deg,#1a1118,#0c0c10);color:#fff;font-family:Space Grotesk,sans-serif}.tf-mark{font-size:38px;font-weight:800;letter-spacing:-.02em;color:#ec3f68eb;text-shadow:0 4px 18px rgba(236,63,104,.35);line-height:1}.tf-name{font-size:13px;font-weight:700;max-width:80%;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;opacity:.92}.tf-live{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:700;letter-spacing:.12em;padding:3px 8px;border-radius:999px;background:#00000080;border:1px solid rgba(236,63,104,.4)}.tf-dot{width:5px;height:5px;border-radius:50%;background:#ff4d4d;animation:livePulse 2.2s ease-in-out infinite}.thumb-wrap.thumb-failed img{display:none}.cam-card:hover .thumb-wrap img{animation:card-live 2.4s ease-in-out infinite}@keyframes card-live{0%,to{transform:scale(1.06);filter:brightness(1) saturate(1)}50%{transform:scale(1.1);filter:brightness(1.08) saturate(1.12)}}.thumb-wrap:after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 30%,rgba(255,255,255,.08) 50%,transparent 70%);transform:translate(-120%);pointer-events:none;opacity:0;transition:opacity .2s ease}.cam-card:hover .thumb-wrap:after{opacity:1;animation:live-sweep 2.4s ease-in-out infinite}@keyframes live-sweep{0%{transform:translate(-120%)}to{transform:translate(120%)}}.overlay{position:absolute;left:0;right:0;bottom:0;padding:52px 10px 10px;background:linear-gradient(180deg,transparent 0%,rgba(8,8,8,.18) 45%,rgba(8,8,8,.97) 100%);pointer-events:none;transition:padding .25s ease}.cam-card:hover .overlay{padding-top:60px}.overlay-name{font-family:Space Grotesk,sans-serif;font-weight:700;font-size:14px;color:#fff;display:flex;align-items:center;gap:6px;line-height:1.2;text-shadow:0 1px 2px rgba(0,0,0,.4);letter-spacing:-.01em;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.overlay-subject{font-size:11px;color:#ffffffbf;margin-top:2px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.flag{font-size:9px;font-weight:700;color:#ffffffb3;letter-spacing:.05em}.viewers{position:absolute;top:8px;right:8px;display:inline-flex;align-items:center;gap:5px;background:#000000b8;color:#fff;padding:4px 8px;border-radius:999px;font-size:10px;font-weight:700;letter-spacing:.02em}@keyframes livePulse{0%,to{box-shadow:0 0 #b8e63ab3}60%{box-shadow:0 0 0 5px #b8e63a00}}.live-dot{width:6px;height:6px;border-radius:50%;background:var(--c-accent);animation:livePulse 2.2s ease-in-out infinite}.badges-top-left{position:absolute;top:8px;left:8px;display:flex;flex-direction:column;gap:4px;align-items:flex-start}.badge{padding:3px 7px;border-radius:5px;font-size:9px;font-weight:800;letter-spacing:.06em;text-transform:uppercase;pointer-events:none}.badge.hd{background:#ec3f68f2;color:#fff;box-shadow:inset 0 1px #ffffff2e}.badge.new{background:#b8e63af2;color:#0e0e0e;box-shadow:inset 0 1px #ffffff40}.tip-btn{position:absolute;bottom:48px;right:8px;background:linear-gradient(135deg,#ec3f68d9,#ec3f68a6);color:#fff;border:none;width:34px;height:34px;border-radius:50%;cursor:pointer;z-index:3;line-height:1;text-decoration:none;display:inline-flex;align-items:center;justify-content:center;transition:transform .12s ease,background .15s ease,box-shadow .15s ease}.tip-btn:hover{background:linear-gradient(135deg,#ec3f68f2,#ec3f68cc);box-shadow:0 4px 16px #ec3f6859}.tip-btn:active{transform:scale(.9)}.fav-btn{position:absolute;bottom:8px;right:8px;background:#000000b8;color:#fff;border:none;width:34px;height:34px;border-radius:50%;cursor:pointer;z-index:3;line-height:1;transition:transform .12s ease,background-color .15s ease}.fav-btn:hover{background:#000000e6}.fav-btn:active{transform:scale(.9)}.fav-btn.active{background:var(--c-primary);box-shadow:inset 0 1px #ffffff2e,0 2px 10px #ec3f6838}.fav-btn.active svg{fill:#fff}.info-link{position:absolute;bottom:10px;left:10px;color:#ffffffa6;font-size:18px;line-height:1;text-decoration:none;z-index:3;padding:4px;transition:color .15s}.info-link:hover{color:var(--c-primary)}