/* LoveLink's familiar social-feed interface. The brand remains uniquely LoveLink. */
body { background:#f3eff2; }
.social-header { position:sticky; top:0; z-index:30; display:flex; align-items:center; gap:10px; min-height:66px; padding:8px max(5vw,24px); background:#fff; border-bottom:1px solid #e5d4dc; color:#401b2d; }
.social-header .social-brand { color:#401b2d; font-family:'DM Sans',sans-serif; font-size:1.12rem; font-weight:800; letter-spacing:-.02em; }
.social-header .social-brand span { color:#94184f; }
.social-header .social-brand img { width:38px; height:38px; margin-right:8px; }
.social-header .social-quick-actions { display:flex; gap:8px; margin-left:auto; }
.social-round { display:grid; place-items:center; width:42px; height:42px; border:0; border-radius:50%; background:#f1e7ec; color:#7e1645; text-decoration:none; font-size:1.65rem; line-height:1; font-weight:500; cursor:pointer; }
.social-round:hover { background:#94184f; color:#fff; }
.social-header .social-icon-bar { display:flex!important; flex-direction:row!important; align-items:center!important; gap:6px; }
.social-header .social-icon-link { position:relative; display:grid; place-items:center; width:42px; height:42px; padding:0; border:0; border-radius:50%; background:transparent; color:#7e1645; font:700 1.45rem/1 'DM Sans',sans-serif; text-decoration:none; cursor:pointer; }
.social-header .social-icon-link:hover { background:#f1e7ec; }
.social-settings { position:relative; }
.settings-popover { position:absolute; top:calc(100% + 7px); right:0; display:flex; align-items:center; justify-content:space-between; gap:12px; width:172px; padding:10px 12px; border:1px solid #e7d3dc; border-radius:12px; background:#fff; color:#401b2d; box-shadow:0 12px 26px rgba(65,20,43,.16); font-size:.84rem; font-weight:800; }
.settings-popover[hidden] { display:none!important; }
.theme-switch { display:inline-flex; align-items:center; width:42px; height:24px; margin:0; padding:3px; border-radius:999px; background:#c9acba; cursor:pointer; }
.theme-switch input { position:absolute; width:1px; height:1px; opacity:0; }
.theme-switch i { display:block; width:18px; height:18px; border-radius:50%; background:#fff; box-shadow:0 1px 3px rgba(0,0,0,.24); transition:transform .18s ease; }
.theme-switch input:checked + i { transform:translateX(18px); }
.theme-switch:has(input:checked) { background:#94184f; }
.social-header .social-menu { position:absolute; top:calc(100% + 8px); right:max(5vw,24px); display:none; flex-direction:column!important; align-items:stretch; width:min(230px,calc(100vw - 28px)); margin:0; padding:8px; overflow:visible; border:1px solid #e7d3dc; border-radius:14px; background:#fff; box-shadow:0 14px 34px rgba(65,20,43,.18); }
.social-header .social-menu.open { display:flex!important; }
.social-header .social-nav-link { position:relative; display:block; min-height:auto; padding:11px 12px; border-radius:9px; color:#401b2d; text-decoration:none; font-size:.92rem; font-weight:700; }
.social-header .social-nav-link:hover { background:#f7edf1; }
.social-header .social-log-out { color:#ffc7cf; }
.social-header .social-menu .social-log-out { color:#a42a38; }
.social-header .nav-count { position:absolute; top:-2px; right:-2px; display:grid; place-items:center; min-width:18px; height:18px; padding:0 4px; border-radius:999px; background:#e72c46; color:#fff; border:2px solid #fff; font-size:.68rem; }
.social-header .nav-toggle { display:grid; place-items:center; width:42px; height:42px; padding:0; color:#7e1645; border:1px solid #e0cad4; background:#fff; border-radius:10px; font-size:1.4rem; cursor:pointer; }
.social-public-actions { display:flex; align-items:center; gap:9px; margin-left:auto; }
.social-login { display:inline-flex; align-items:center; justify-content:center; min-height:38px; padding:0 13px; border:1px solid #94184f; border-radius:9px; color:#94184f; font-weight:800; text-decoration:none; }
.social-login:hover { background:#94184f; color:#fff; }
.post-search { width:min(720px,100%); margin:0 auto 16px; padding:12px; border:1px solid #e7ccd8; border-radius:14px; background:#fff; box-shadow:0 5px 16px rgba(72,18,46,.06); }
.post-search label { display:block; margin-bottom:6px; color:#69203f; font-size:.85rem; font-weight:800; }
.post-search > div { display:flex; gap:8px; }
.post-search input { min-width:0; flex:1; margin:0; }
.post-search button { width:40px; padding:0; background:#f1e7ec; color:#7e1645; font-size:1.4rem; }
.post-search p { min-height:1.1em; margin:7px 0 0; color:#6a5660; font-size:.85rem; }

.social-compose-card { display:flex; align-items:center; gap:12px; max-width:720px; margin:0 auto 18px; padding:12px 15px; border:1px solid #e5cbd7; border-radius:16px; background:#fff; box-shadow:0 6px 18px rgba(72,18,46,.06); }
.social-avatar { display:grid; flex:0 0 auto; place-items:center; width:42px; height:42px; border-radius:50%; background:linear-gradient(135deg,#8f164c,#e8528b); color:#fff; font-size:1rem; font-weight:800; box-shadow:inset 0 0 0 2px #fff,0 0 0 1px #e8cada; }
.social-compose-prompt { flex:1; padding:11px 15px; border-radius:999px; background:#f1e7ec; color:#6e5963; text-decoration:none; font-weight:600; }
.social-compose-action { display:grid; place-items:center; flex:0 0 auto; width:38px; height:38px; border-radius:50%; background:#94184f; color:#fff; text-decoration:none; font-size:1.45rem; }
.social-feed-heading { max-width:720px; margin-left:auto; margin-right:auto; }
.social-feed-heading h2 { font-family:'DM Sans',sans-serif; font-weight:800; }
.post-show { max-width:720px; margin:12px auto 28px; padding:0; background:transparent; border:0; overflow:visible; }
.post-show-viewport { display:flex; gap:11px; min-height:214px; overflow-x:auto; padding:2px 2px 9px; scroll-snap-type:x mandatory; scrollbar-width:thin; }
.post-show-viewport .show-slide { display:flex!important; flex:0 0 185px; flex-direction:column; min-height:208px; margin:0; padding:15px; border:0; border-radius:17px; background:linear-gradient(145deg,#631033,#ab2862 61%,#e15288); color:#fff; box-shadow:0 7px 17px rgba(81,12,44,.19); scroll-snap-align:start; opacity:.72; transform:scale(.96); transition:opacity .3s,transform .3s; }
.post-show-viewport .show-slide.active { opacity:1; transform:scale(1); animation:storyShake .65s ease both; }
.post-show-viewport .show-slide .post-head { display:block; }
.post-show-viewport .show-slide .anon,.post-show-viewport .show-slide time { color:#fff; }
.post-show-viewport .show-slide time { display:block; margin-top:4px; opacity:.72; }
.post-show-viewport .show-slide p { display:-webkit-box; overflow:hidden; margin:13px 0; -webkit-box-orient:vertical; -webkit-line-clamp:4; font-size:.9rem; line-height:1.35; }
.post-show-viewport .slide-inbox { margin-top:auto; background:#fff; border-color:#fff; color:#8f164c; text-align:center; }
.post-show .show-controls { justify-content:flex-end; margin:8px 2px 0; }
.post-show .show-controls button { width:38px; height:34px; background:#94184f; }
@keyframes storyShake { 0%{transform:scale(.96) translateY(12px)} 55%{transform:scale(1.02) translateY(-3px) rotate(.4deg)} 72%{transform:scale(.99) rotate(-.3deg)} 100%{transform:scale(1) translateY(0)} }

.post { width:min(720px,100%); margin:14px auto; padding:19px; border-radius:17px; box-shadow:0 5px 15px rgba(72,18,46,.055); }
.post .post-head { align-items:center; }
.post .anon::first-letter { color:#94184f; }
.post > p { font-size:1rem; line-height:1.55; }
.post-actions { display:flex; align-items:center; gap:12px; padding-top:5px; }
.notice { max-width:720px; margin:0 auto 20px; border-left:4px solid #94184f; }

.social-inbox { width:min(1000px,100%); margin:0 auto; min-height:650px; border:0; border-radius:17px; box-shadow:0 8px 24px rgba(52,19,37,.10); background:#fff; }
.social-inbox .chat-list { padding:0; background:#fff; border-right:1px solid #e8d9e0; }
.inbox-list-head { display:flex; align-items:center; justify-content:space-between; padding:19px 18px 10px; }
.inbox-list-head h1 { margin:0; font-family:'DM Sans',sans-serif; font-size:1.42rem; font-weight:800; }
.inbox-list-head a { display:grid; place-items:center; width:34px; height:34px; border-radius:50%; background:#f1e7ec; color:#94184f; font-size:2rem; line-height:1; text-decoration:none; }
.social-inbox .chat-list > .muted,.social-inbox .chat-list > .wallet-mini { margin:4px 18px 12px; }
.social-inbox .chat-row { position:relative; min-height:70px; padding:13px 12px 13px 72px; border:0; color:#261d22; }
.social-inbox .chat-row::before { content:attr(data-initial); position:absolute; left:17px; top:12px; display:grid; place-items:center; width:42px; height:42px; border-radius:50%; background:linear-gradient(135deg,#76113e,#df4d85); color:#fff; font-size:.95rem; font-weight:800; }
.social-inbox .chat-row strong { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-family:'DM Sans',sans-serif; font-size:.96rem; }
.social-inbox .chat-row small { display:block; overflow:hidden; margin-top:4px; color:#816b76; text-overflow:ellipsis; white-space:nowrap; }
.social-inbox .chat-row.active { background:#f9e6ee; color:#94184f; }
.social-inbox .conversation { padding:0; background:#fff; }
.social-chat-head { align-items:center; min-height:74px; padding:12px 17px; border-bottom:1px solid #eadde3; background:#fff; }
.social-chat-head .chat-back { display:grid; place-items:center; width:32px; height:32px; border-radius:50%; background:#f1e7ec; color:#94184f; font-size:2rem; line-height:1; text-decoration:none; }
.social-chat-head .chat-avatar { width:40px; height:40px; }
.social-chat-head h2 { margin:0; font-family:'DM Sans',sans-serif; font-size:1rem; font-weight:800; }
.social-chat-head .muted { margin:2px 0 0; }
.social-inbox .messages { padding:17px; background:#fbf8fa; }
.social-inbox .message { max-width:min(78%,460px); padding:10px 13px; border-radius:16px 16px 16px 4px; background:#eee5e9; box-shadow:none; }
.social-inbox .message.mine { border-radius:16px 16px 4px 16px; background:#94184f; color:#fff; }
.social-inbox .message.mine strong,.social-inbox .message.mine span { color:#ffe3ee; }
.social-inbox .message.system,.social-inbox .message.admin { max-width:100%; }
.social-inbox .composer-dock { padding:12px 16px 15px; background:#fff; box-shadow:none; }
.social-inbox .message-form textarea { min-height:52px; padding:13px 15px; border:0; border-radius:22px; background:#f1e7ec; }
.social-inbox .message-form .attach { padding:9px 12px; border:0; border-radius:12px; background:#f7eef2; color:#6e4456; }
.social-inbox .send-message-button { border-radius:12px; background:#94184f; }
.social-inbox .report-action .report-abuse { background:#fff7fa; }

@media (max-width:720px) {
  .social-header { display:grid; grid-template-columns:minmax(0,1fr) auto auto; gap:8px; min-height:58px; padding:8px 14px; }
  .social-header .social-brand { font-size:.92rem; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
  .social-header .social-brand img { width:31px; height:31px; }
  .social-header .social-quick-actions { margin-left:0; }
  .social-header .social-round { width:34px; height:34px; font-size:1.3rem; }
  .social-header .social-icon-bar { grid-column:1/-1; justify-content:space-around; width:100%; padding:3px 0 1px; }
  .social-header .social-icon-link { flex:0 0 42px; }
  .social-header .nav-toggle { display:grid; }
  .social-header .social-menu { top:calc(100% - 1px); right:14px; display:none!important; width:min(255px,calc(100vw - 28px)); overflow:visible; }
  .social-header .social-menu.open { display:flex!important; }
  .social-header .social-menu .social-nav-link { display:block; min-width:0; min-height:auto; padding:12px; }
  .social-public-actions { gap:6px; }
  .social-login { min-height:34px; padding:0 10px; font-size:.82rem; }
  .social-public-actions .nav-join { display:none; }
  .social-compose-card { margin:0 auto 14px; padding:10px 12px; }
  .social-compose-prompt { padding:10px 12px; font-size:.86rem; }
  .post-show { width:100%; }
  .post-show-viewport { min-height:196px; gap:9px; }
  .post-show-viewport .show-slide { flex-basis:154px; min-height:190px; padding:12px; }
  .post-show-viewport .show-slide p { margin:10px 0; font-size:.82rem; }
  .social-inbox { min-height:calc(100dvh - 124px); border-radius:0; box-shadow:none; }
  .social-inbox.has-chat .chat-list { display:none; }
  .social-inbox .chat-list { max-height:none; border:0; }
  .social-inbox .conversation { min-height:calc(100dvh - 124px); }
  .social-inbox .messages { min-height:0; max-height:none; padding:12px; }
  .social-inbox .composer-dock { padding:10px 12px max(12px,env(safe-area-inset-bottom)); }
  .social-inbox .message { max-width:86%; }
}

/* Theme switch: light remains calm and clear; dark reduces glare without losing the LoveLink colours. */
body[data-theme="dark"] { background:#181416; color:#f8f0f4; }
body[data-theme="dark"] .social-header { background:#272326; border-color:#4a4247; color:#fff; }
body[data-theme="dark"] .social-header .social-brand { color:#fff; }
body[data-theme="dark"] .social-header .social-brand span { color:#f7bfd5; }
body[data-theme="dark"] .social-header .social-round { background:#454044; color:#fff; }
body[data-theme="dark"] .social-header .social-icon-link { color:#f7bfd5; }
body[data-theme="dark"] .social-header .social-icon-link:hover { background:#454044; }
body[data-theme="dark"] .social-header .nav-toggle { border-color:#5b5256; background:#454044; color:#fff; }
body[data-theme="dark"] .social-header .social-menu { border-color:#55474d; background:#302a2d; }
body[data-theme="dark"] .settings-popover { border-color:#55474d; background:#302a2d; color:#fff; }
body[data-theme="dark"] .social-header .social-nav-link { color:#fff; }
body[data-theme="dark"] .social-header .social-nav-link:hover { background:#454044; }
body[data-theme="dark"] .social-header .nav-count { border-color:#272326; }
body[data-theme="dark"] .social-compose-card,
body[data-theme="dark"] .post,
body[data-theme="dark"] .social-inbox,
body[data-theme="dark"] .social-inbox .chat-list,
body[data-theme="dark"] .social-inbox .conversation,
body[data-theme="dark"] .social-chat-head,
body[data-theme="dark"] .social-inbox .composer-dock,
body[data-theme="dark"] .post-search { background:#282225; border-color:#514149; color:#f8f0f4; box-shadow:none; }
body[data-theme="dark"] .notice { background:#2d2529; color:#faeff4; border-color:#c43c74; }
body[data-theme="dark"] .social-compose-prompt,
body[data-theme="dark"] .social-inbox .message-form textarea,
body[data-theme="dark"] .social-inbox .message-form .attach,
body[data-theme="dark"] .post-search button { background:#40363c; color:#f7dce8; }
body[data-theme="dark"] .social-inbox .messages { background:#211c1f; }
body[data-theme="dark"] .social-inbox .message { background:#3a3035; color:#fff; }
body[data-theme="dark"] .social-inbox .chat-row { color:#fff; }
body[data-theme="dark"] .social-inbox .chat-row small,
body[data-theme="dark"] .post-search p { color:#d9c0cb; }
body[data-theme="dark"] .social-inbox .chat-row.active { background:#4a2738; color:#fff; }
body[data-theme="dark"] .post-search label { color:#f8dce8; }
body[data-theme="dark"] input,
body[data-theme="dark"] textarea,
body[data-theme="dark"] select { background:#241e21; border-color:#66505a; color:#fff; }