/* Community feed — phone-first, uses the app's Lumen theme variables (light + dark). */
.fd-share{white-space:nowrap}
.fd-list{display:grid;gap:16px;margin:8px 0 16px}
.fd-card{background:var(--l-surface,var(--l-raised));border:1px solid var(--l-line);border-radius:22px;overflow:hidden;box-shadow:0 1px 0 #ffffff08 inset}
.fd-card.is-hidden{opacity:.72;border-style:dashed}
.fd-head{display:flex;align-items:center;gap:11px;padding:12px 14px}
.fd-head>div{flex:1;min-width:0;display:grid}
.fd-head strong{font-size:15px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.fd-head strong em{font-style:normal;font-size:11px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;margin-left:6px;padding:2px 7px;border-radius:99px;background:var(--l-accent-soft);color:var(--l-accent-ink)}
.fd-head small{color:var(--l-muted);font-size:12.5px}
.fd-avatar{width:38px;height:38px;border-radius:50%;display:grid;place-items:center;font-weight:800;background:linear-gradient(135deg,var(--l-accent),var(--l-accent-line));color:var(--l-accent-ink);flex:none}
.fd-more{position:relative}
.fd-more summary{list-style:none;cursor:pointer;min-width:44px;min-height:44px;display:grid;place-items:center;border-radius:12px;color:var(--l-muted);letter-spacing:1px}
.fd-more summary::-webkit-details-marker{display:none}
.fd-more[open] summary{background:var(--l-bg2)}
.fd-more>div{position:absolute;right:0;top:48px;z-index:5;display:grid;min-width:150px;background:var(--l-raised);border:1px solid var(--l-line2);border-radius:14px;padding:6px;box-shadow:0 14px 40px #0004}
.fd-more button{all:unset;cursor:pointer;padding:12px 12px;border-radius:9px;font-size:15px}
.fd-more button:hover,.fd-more button:focus-visible{background:var(--l-bg2)}
.fd-more [data-fd-delete]{color:var(--l-danger)}
.fd-frame{background:#000;display:grid;place-items:center;max-height:min(78vh,720px);overflow:hidden}
.fd-media{display:block;width:100%;height:auto;max-height:min(78vh,720px);object-fit:contain;background:#000}
.fd-caption{margin:0;padding:12px 16px 2px;font-size:15px;line-height:1.5;overflow-wrap:anywhere}
.fd-foot{display:flex;align-items:center;padding:6px 8px 10px}
.fd-like{all:unset;cursor:pointer;display:inline-flex;align-items:center;gap:6px;min-height:44px;padding:0 12px;border-radius:12px;font-size:16px;color:var(--l-muted)}
.fd-like span{font-size:21px;line-height:1;transition:transform .18s}
.fd-like.is-on{color:var(--l-danger)}
.fd-like.is-on span{transform:scale(1.15)}
.fd-like:focus-visible{outline:2px solid var(--l-accent-line)}
.fd-flag{margin:0 14px 10px;padding:8px 12px;border-radius:12px;background:var(--l-accent-soft);font-size:13px}
.fd-empty{text-align:center;padding:42px 18px;border:1px dashed var(--l-line2);border-radius:22px;color:var(--l-muted)}
.fd-empty span{font-size:34px;color:var(--l-accent-line)}
.fd-empty h2{color:inherit;margin:8px 0 6px;font-size:22px}
.fd-empty p{margin:0}
.fd-loading,.fd-error{color:var(--l-muted);text-align:center;padding:24px 8px;margin:0}
.fd-error{color:var(--l-danger)}
.fd-rules{font-size:13px;line-height:1.55;color:var(--l-muted);margin:14px 2px 90px}
.fd-compose{display:grid;gap:10px}
.fd-pick{display:grid;justify-items:center;gap:4px;text-align:center;padding:26px 16px;border:1.5px dashed var(--l-accent-line);border-radius:18px;background:var(--l-accent-soft);cursor:pointer;position:relative}
.fd-pick input{position:absolute;inset:0;opacity:0;cursor:pointer}
.fd-pick span{font-size:30px;line-height:1}
.fd-pick small{color:var(--l-muted);font-size:12.5px}
.fd-pick.is-compact{padding:12px;grid-template-columns:auto 1fr;justify-items:start;text-align:left}
.fd-pick.is-compact small{display:none}
.fd-pick.is-compact strong::after{content:' · change'}
.fd-preview{display:grid;gap:6px;justify-items:center}
.fd-preview img,.fd-preview video{max-width:100%;max-height:38vh;border-radius:14px;background:#000}
.fd-preview small{color:var(--l-muted)}
.fd-compose .field-label{display:flex;justify-content:space-between}
.fd-compose .field-label small{color:var(--l-muted);font-weight:500}
.fd-progress{height:8px;border-radius:99px;background:var(--l-bg2);overflow:hidden}
.fd-progress span{display:block;height:100%;width:0;background:var(--l-accent-line);transition:width .2s}
.fd-more-card span{color:var(--l-accent-line)}
@media (min-width:760px){.fd-list{max-width:620px;margin-inline:auto}.fd-rules{max-width:620px;margin-inline:auto}}
/* Auto-renewal consent on the membership page */
.renew-consent{display:flex;gap:12px;align-items:flex-start;margin:18px 0 6px;padding:14px 16px;border:1px solid var(--l-line2);border-radius:16px;background:var(--l-raised);font-size:14px;line-height:1.55;cursor:pointer}
.renew-consent input{width:22px;height:22px;flex:none;margin-top:1px;accent-color:var(--l-accent-line)}
.renew-consent.needs-consent{border-color:var(--l-danger);box-shadow:0 0 0 3px #c23a2b22}
.renew-consent a{font-weight:600}
/* Terms page */
.terms{max-width:760px;margin-inline:auto;line-height:1.65}
.terms h2{font-size:clamp(19px,4.6vw,23px);margin:30px 0 8px}
.terms ul{padding-left:20px;display:grid;gap:8px}
.terms small{color:var(--l-muted,#5d6670)}
.terms-back{margin:40px 0 60px}
/* Readability fixes: the app-wide heading/strong color rule must not darken text on dark panels. */
html body .site-boot-notice .site-boot-card h1{color:#f2f6ed}
html body .video-avatar-stage .video-avatar-pin strong{color:var(--va-lime,#d5fc73)}
html body[data-page=videoavatar] #app .video-avatar-intro details>summary{background:transparent!important;color:var(--va-ink,#f2f6ed)!important;box-shadow:none!important}
html[data-theme=light] body[data-page=videoavatar] #app h1 em{color:#4d6b0e}
