.social{--surface: rgb(255 255 255 / .035);--surface-strong: rgb(255 255 255 / .06);--hover: rgb(255 255 255 / .07);--line: rgb(255 255 255 / .08);--text: #e7e9ee;--soft: #9aa3b5;--accent: #8b5cf6;--accent-2: #ec4899;--gradient: linear-gradient(135deg, var(--accent), var(--accent-2));--radius-lg: 1.25rem;--radius-md: .85rem;--shadow: 0 1px 0 rgb(255 255 255 / .04) inset, 0 12px 32px -16px rgb(0 0 0 / .6);position:relative;isolation:isolate;display:grid;grid-template-columns:220px minmax(0,1fr) 260px;align-items:start;gap:1.25rem;margin-top:2rem;color:var(--text)}.social:before{content:"";position:absolute;inset:-4rem 0 auto;z-index:-1;height:28rem;background:radial-gradient(40% 60% at 25% 20%,rgb(139 92 246 / .16),transparent 70%),radial-gradient(35% 50% at 80% 10%,rgb(236 72 153 / .12),transparent 70%);filter:blur(20px);pointer-events:none}@media(max-width:1080px){.social{grid-template-columns:200px minmax(0,1fr)}.social .right{display:none}}@media(max-width:700px){.social{grid-template-columns:minmax(0,1fr)}.social .left .me{display:none}}.social aside{position:sticky;top:1.25rem;display:grid;gap:1.25rem}@media(max-width:700px){.social aside{position:static}}.social .card,.social .post{padding:1.1rem;border:1px solid var(--line);border-radius:var(--radius-lg);background:var(--surface);box-shadow:var(--shadow);backdrop-filter:blur(12px)}.social h2{margin:0 0 .85rem;color:var(--soft);font-size:.72rem;font-weight:600;letter-spacing:.12em;text-transform:uppercase}.social .muted{color:var(--soft)}.social button,.social input[type=text]{width:auto;margin:0;box-shadow:none;font:inherit;font-size:.92rem;line-height:1.3}.social button{padding:.55rem .85rem;border:none;border-radius:var(--radius-md);background:transparent;color:var(--text);cursor:pointer;transition:background .15s,color .15s,transform .1s}.social button:hover:not(:disabled){background:var(--hover)}.social button:active:not(:disabled){transform:scale(.97)}.social button:focus-visible,.social input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.social input[type=text]{flex:1;min-width:0;height:auto;padding:.7rem 1.1rem;border:1px solid var(--line);border-radius:999px;background:#00000040;color:var(--text);transition:border-color .15s,background .15s}.social input[type=text]::placeholder{color:var(--soft)}.social input[type=text]:focus{border-color:#8b5cf699;background:#00000059}.avatar{display:inline-grid;flex:none;place-items:center;width:2.6rem;height:2.6rem;border-radius:50%;background:linear-gradient(hsl(var(--hue) 60% 32%),hsl(calc(var(--hue) + 40) 60% 22%)) padding-box,linear-gradient(135deg,hsl(var(--hue) 90% 70%),hsl(calc(var(--hue) + 60) 90% 60%)) border-box;border:2px solid transparent;font-size:1.25rem;line-height:1}.avatar.sm{width:1.9rem;height:1.9rem;border-width:1.5px;font-size:.9rem}.avatar.lg{width:4.25rem;height:4.25rem;border-width:3px;font-size:2.1rem;box-shadow:0 10px 30px -10px #8b5cf699}.social .me{display:grid;justify-items:center;gap:.6rem;padding-block:1.4rem;background:linear-gradient(180deg,rgb(139 92 246 / .14),transparent 60%),var(--surface);text-align:center}.social .me strong{font-size:1.05rem}.social .live{display:flex;align-items:center;gap:.55rem;margin:0;color:var(--soft);font-size:.85rem;cursor:pointer}.social .live input{position:relative;flex:none;width:2.2rem;height:1.25rem;margin:0;border:none;border-radius:999px;background:#ffffff26;appearance:none;cursor:pointer;transition:background .2s}.social .live input:after{content:"";position:absolute;top:.15rem;left:.15rem;width:.95rem;height:.95rem;border-radius:50%;background:#fff;box-shadow:0 1px 3px #0006;transition:transform .2s}.social .live input:checked{background:var(--gradient)}.social .live input:checked:after{transform:translate(.95rem)}.social .feeds{display:grid;justify-content:stretch;gap:.2rem;padding:.5rem}.social .feeds button{display:flex;justify-content:flex-start;align-items:center;gap:.7rem;color:var(--soft);font-weight:500;text-align:left}.social .feeds button>span:first-child{display:grid;place-items:center;width:2rem;height:2rem;border-radius:.65rem;background:var(--surface-strong);font-size:1rem;transition:background .15s}.social .feeds button:hover:not(:disabled){color:var(--text)}.social .feeds button.active{background:var(--surface-strong);color:var(--text);font-weight:600}.social .feeds button.active>span:first-child{background:var(--gradient);box-shadow:0 6px 16px -6px #ec4899b3}.social .badge{margin-left:auto;min-width:1.4rem;padding:.1rem .45rem;border-radius:999px;background:var(--accent-2);color:#fff;font-size:.72rem;font-weight:700;text-align:center}@media(max-width:700px){.social .feeds{display:flex;gap:.4rem;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x proximity;scrollbar-width:none}.social .feeds::-webkit-scrollbar{display:none}.social .feeds button{flex:none;gap:.45rem;padding:.35rem .75rem .35rem .35rem;border-radius:999px;white-space:nowrap;scroll-snap-align:start}.social .feeds button>span:first-child{width:1.6rem;height:1.6rem;border-radius:50%;font-size:.85rem}.social .badge{margin-left:.15rem}}.social .center{display:grid;grid-template-columns:minmax(0,1fr);gap:1.25rem;min-width:0}.social .composer{display:flex;align-items:center;gap:.75rem}.social .composer button{padding-inline:1.3rem;border-radius:999px;background:var(--gradient);box-shadow:0 8px 20px -8px #ec4899b3;color:#fff;font-weight:600}.social .composer button:hover:not(:disabled){background:var(--gradient);filter:brightness(1.1)}.social .new-posts{position:sticky;top:1.25rem;z-index:1;justify-self:center;padding:.6rem 1.3rem;border:1px solid rgb(255 255 255 / .2);border-radius:999px;background:var(--gradient);box-shadow:0 10px 30px -8px #8b5cf6cc;color:#fff;font-weight:600;animation:float-in .35s ease-out}.social .new-posts:hover:not(:disabled){background:var(--gradient);filter:brightness(1.1)}.social .new-posts[hidden]{display:none}@keyframes float-in{0%{opacity:0;transform:translateY(-8px)}}#posts{display:grid;gap:1.25rem}.social .post{display:grid;gap:.9rem;transition:border-color .2s,transform .2s}.social .post:hover{border-color:#ffffff21}.social .post.fresh{animation:arrive .6s cubic-bezier(.2,.8,.2,1)}@keyframes arrive{0%{opacity:0;transform:translateY(-14px) scale(.98);border-color:var(--accent)}}@media(prefers-reduced-motion:reduce){.social .post.fresh,.social .new-posts{animation:none}}.social .post>header{display:flex;align-items:center;gap:.75rem}.social .post>header div{display:grid;gap:.1rem}.social .post>header strong{color:var(--text);font-weight:600}.social .post>header small{font-size:.8rem;text-transform:capitalize}.social .text{margin:0;color:var(--text);font-size:1rem;line-height:1.55}.social .photo{position:relative;display:grid;place-items:center;overflow:hidden;aspect-ratio:16 / 9;margin-inline:-1.1rem;font-size:4.5rem;text-shadow:0 10px 30px rgb(0 0 0 / .35)}.social .photo:after{content:"";position:absolute;inset:0;background:linear-gradient(transparent 60%,#00000040)}.photo.sunset{background:linear-gradient(160deg,#fb923c,#ec4899 55%,#4338ca)}.photo.forest{background:linear-gradient(160deg,#a7f3d0,#10b981 50%,#065f46)}.photo.mountain{background:linear-gradient(170deg,#e0f2fe,#94a3b8 50%,#334155)}.photo.warm{background:radial-gradient(circle at 50% 40%,#fde68a,#f59e0b 45%,#9a3412)}.photo.night{background:linear-gradient(170deg,#0f172a,#312e81 55%,#7c3aed)}.photo.ocean{background:linear-gradient(180deg,#38bdf8,#7dd3fc 48%,#fde68a 48%,#fcd34d)}.social .preview{display:flex;overflow:hidden;border:1px solid var(--line);border-radius:var(--radius-md);background:#0003;color:inherit;text-decoration:none;transition:border-color .15s,background .15s}.social .preview:hover{border-color:#8b5cf680;background:#0000004d}.social .preview-image{display:grid;flex:none;place-items:center;width:7.5rem;background:linear-gradient(135deg,#f43f5e,#8b5cf6);color:#fff;font-size:.85rem;font-weight:700;letter-spacing:.02em}.social .preview-body{display:grid;gap:.3rem;padding:.85rem 1rem}.social .preview-body small{color:var(--soft);font-size:.72rem;letter-spacing:.08em}.social .preview-body strong{line-height:1.35}.social .poll{display:grid;gap:.5rem}.social .poll .option{display:flex;justify-content:space-between;padding:.7rem 1rem;border:1px solid var(--line);border-radius:var(--radius-md);background:linear-gradient(90deg,#8b5cf673,#ec489959) no-repeat 0 0 / var(--percent) 100%,#0003;text-align:left;transition:background-size .6s cubic-bezier(.2,.8,.2,1),border-color .15s}.social .poll .option:hover:not(:disabled){border-color:#8b5cf699;background-color:#ffffff0d}.social .poll .option:disabled{opacity:1;cursor:default}.social .poll .option.chosen{border-color:var(--accent);font-weight:600}.social .weather{display:flex;flex-wrap:wrap;align-items:center;gap:1.1rem;padding:1.25rem;border-radius:var(--radius-md);background:radial-gradient(circle at 15% 20%,rgb(255 255 255 / .25),transparent 40%),linear-gradient(135deg,#0ea5e9,#6366f1);color:#f0f9ff}.social .weather p{margin:0;opacity:.9}.social .weather-icon{font-size:3.2rem;filter:drop-shadow(0 6px 12px rgb(0 0 0 / .25))}.social .temp{color:#fff;font-size:2.2rem;font-weight:700;letter-spacing:-.02em}.social .weather ul{display:flex;gap:.5rem;margin:0 0 0 auto;padding:0;list-style:none;text-align:center}.social .weather li{display:grid;margin:0;padding:.5rem .8rem;border-radius:.75rem;background:#ffffff26}.social .event{display:flex;align-items:center;gap:.9rem;padding:.9rem;border:1px solid var(--line);border-radius:var(--radius-md);background:#0003}.social .date{display:grid;flex:none;width:3.4rem;overflow:hidden;border-radius:.75rem;background:#fff;box-shadow:0 6px 16px -8px #0009;text-align:center}.social .date small{padding:.15rem;background:var(--gradient);color:#fff;font-size:.68rem;font-weight:700;text-transform:uppercase}.social .date strong{padding:.2rem 0 .3rem;color:#111;font-size:1.4rem}.social .event-body{display:grid;flex:1;gap:.2rem}.social .pill{border:1px solid var(--line);border-radius:999px}.social .pill.active{border-color:transparent;background:#22c55e26;color:#4ade80;font-weight:600}.social .counts{display:flex;justify-content:space-between;font-size:.83rem}.social .counts:has(span:empty+span:empty){display:none}.social .actions{display:grid;grid-template-columns:1fr 1fr;gap:.4rem;padding-top:.75rem;border-top:1px solid var(--line)}.social .actions button{color:var(--soft);font-weight:500}.social .actions button:hover:not(:disabled){color:var(--text)}.social .actions .liked{background:#ec48991f;color:#f472b6;font-weight:600}.social .actions .liked:hover:not(:disabled){background:#ec48992e;color:#f472b6}.social .comments{display:grid;gap:.5rem;margin:0;padding:0;list-style:none}.social .comments:empty{display:none}.social .comments li{display:flex;align-items:flex-start;gap:.55rem;margin:0}.social .comments p{margin:0;padding:.5rem .85rem;border-radius:.25rem 1rem 1rem;background:var(--surface-strong);font-size:.9rem;line-height:1.4}.social .comments strong{margin-right:.2rem;font-weight:600}.social .reply{display:flex;margin:0}.social .reply input[type=text]{padding-block:.55rem;font-size:.88rem}.social .contacts ul,.social .activity ol{display:grid;gap:.2rem;margin:0;padding:0;list-style:none}.social .contacts li{display:flex;align-items:center;gap:.65rem;margin:0;padding:.35rem .4rem;border-radius:.65rem;font-size:.9rem;opacity:.5;transition:opacity .3s,background .15s}.social .contacts li:hover{background:var(--hover)}.social .contacts li.online{opacity:1}.social .contacts .avatar{position:relative}.social .contacts li.online .avatar:after{content:"";position:absolute;right:-3px;bottom:-3px;width:.6rem;height:.6rem;border:2px solid #161a22;border-radius:50%;background:#22c55e}.social .activity ol{position:relative;gap:.65rem;padding-left:1rem}.social .activity ol:before{content:"";position:absolute;top:.4rem;bottom:.4rem;left:.2rem;width:2px;border-radius:1px;background:var(--line)}.social .activity li{position:relative;margin:0;font-size:.84rem;line-height:1.4;animation:arrive .4s ease-out}.social .activity li:before{content:"";position:absolute;top:.4rem;left:-1rem;width:.55rem;height:.55rem;border-radius:50%;background:var(--line)}.social .activity li:first-child:before{background:var(--gradient);box-shadow:0 0 0 3px #8b5cf640}.social .activity li+li{animation:none;color:var(--soft)}.social .activity p{margin:0;font-size:.84rem}
