.bn-share { display:inline-flex; align-items:center; flex-wrap:wrap; gap:.4rem; position:relative; vertical-align:middle; isolation:isolate; }
.bn-share-button { display:inline-grid; place-items:center; width:2.4rem; height:2.4rem; padding:0; border:1px solid var(--app-border, #53697b); border-radius:.7rem; background:var(--app-surface-2, #122638); color:var(--app-text-primary, #f3f8fc); cursor:pointer; font-size:1.25rem; }
.bn-share-button:hover:not(:disabled),.bn-share-button:focus-visible { color:var(--app-accent, #15cde1); border-color:currentColor; outline:2px solid transparent; outline-offset:3px; }
.bn-share-button.is-copied { color:var(--app-accent, #15cde1); border-color:currentColor; }
.bn-share-button:disabled { opacity:.45; cursor:not-allowed; }
.bn-share-status { position:absolute; z-index:10; left:50%; bottom:calc(100% + .42rem); max-width:min(13rem, 58vw); padding:.36rem .58rem; border:1px solid color-mix(in srgb,var(--app-accent, #15cde1) 42%,transparent); border-radius:999px; color:var(--app-text-primary, #f3f8fc); background:color-mix(in srgb,var(--app-surface-2, #122638) 88%,#000); box-shadow:0 .5rem 1.2rem rgba(0,0,0,.28),0 0 1rem color-mix(in srgb,var(--app-accent, #15cde1) 18%,transparent); font-size:.72rem; font-weight:700; line-height:1.15; white-space:nowrap; pointer-events:none; opacity:0; transform:translate(-50%,.55rem) scale(.94); transform-origin:center bottom; will-change:transform,opacity; }
.bn-share-status.is-visible { animation:bn-share-copy-confirmation 1.9s cubic-bezier(.2,.8,.25,1) forwards; }
@keyframes bn-share-copy-confirmation { 0% { opacity:0; transform:translate(-50%,.55rem) scale(.94); } 13% { opacity:1; transform:translate(-50%,0) scale(1); } 65% { opacity:1; transform:translate(-50%,-.35rem) scale(1); } 100% { opacity:0; transform:translate(-50%,-1.45rem) scale(.98); } }
@media (prefers-reduced-motion:reduce) { .bn-share-status.is-visible { animation-duration:.01ms; } }
.bn-share-fallback { display:flex; flex-direction:column; gap:.3rem; flex-basis:100%; max-width:22rem; font-size:.8rem; }
.bn-share-fallback[hidden] { display:none; }
.bn-share-fallback input { width:100%; min-width:0; padding:.55rem; border:1px solid var(--app-border, #53697b); border-radius:.5rem; background:var(--app-surface-2, #122638); color:var(--app-text-primary, #f3f8fc); }
body:has(.community-shell) { --page:#071521; --surface:#102536; --text:#edf6fc; --muted:#aec4d4; --line:#29465b; --accent:#53deea; margin:0; min-height:100vh; font-family:system-ui,-apple-system,sans-serif; color:var(--text); background:radial-gradient(ellipse at 15% 0%,#164459 0,transparent 55%),var(--page); color-scheme:dark; }
body:has(.community-shell) * { box-sizing:border-box; }
[data-theme="light"] body:has(.community-shell) { --page:#eff5f8; --surface:#fff; --text:#17344a; --muted:#4b6478; --line:#cbdce5; --accent:#006d7c; background:radial-gradient(ellipse at 15% 0%,#d1f2f4 0,transparent 55%),var(--page); color-scheme:light; }
@media(prefers-color-scheme:light) {
    html:not([data-theme="dark"]) body:has(.community-shell) { --page:#eff5f8; --surface:#fff; --text:#17344a; --muted:#4b6478; --line:#cbdce5; --accent:#006d7c; background:var(--page); color-scheme:light; }
}
.community-nav { max-width:1160px; padding:1.5rem 2rem; margin:auto; display:flex; justify-content:space-between; align-items:center; }
.community-brand { display:flex; align-items:center; color:var(--text); text-decoration:none; font-size:1.5rem; font-weight:750; letter-spacing:-.05em; }
.community-brand>img { width:2.2rem; height:2.2rem; object-fit:contain; margin-right:.55rem; }
.community-brand>span { color:var(--accent); }
.community-login { color:var(--text); text-decoration:none; border:1px solid var(--line); border-radius:2rem; padding:.65rem 1rem; font-size:.9rem; }
.community-shell { max-width:1160px; margin:1rem auto 3rem; padding:0 2rem; display:grid; grid-template-columns:minmax(0,1.9fr) minmax(250px,1fr); align-items:start; gap:1.5rem; }
.community-post,.community-invite { background:var(--surface); border:1px solid var(--line); border-radius:1.4rem; padding:2rem; box-shadow:0 18px 60px #00000012; }
.community-post-head { display:flex; align-items:start; justify-content:space-between; gap:1rem; }
.community-eyebrow { font-size:.65rem; font-weight:750; letter-spacing:.14em; color:var(--accent); line-height:1.8; margin:0 0 .7rem; }
.community-post time { font-size:.8rem; color:var(--muted); }
.community-storefront { display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; gap:.8rem 1.2rem; margin:1.5rem 0; padding:1rem 1.1rem; border:1px solid var(--line); border-radius:1rem; background:var(--page); color:var(--text); text-decoration:none; }
.community-storefront:hover { border-color:var(--accent); }
.community-storefront:focus-visible { outline:2px solid var(--accent); outline-offset:4px; }
.community-storefront-publisher { display:flex; flex-direction:column; gap:.2rem; min-width:0; flex:1 1 10rem; overflow-wrap:anywhere; }
.community-storefront-publisher .community-eyebrow { margin:0; }
.community-storefront-publisher strong { font-size:1rem; line-height:1.4; }
.community-storefront-action { display:inline-flex; align-items:center; gap:.65rem; color:var(--accent); font-size:.85rem; font-weight:700; }
.community-post h1 { font-size:clamp(1.6rem,3vw,2.5rem); line-height:1.2; letter-spacing:-.04em; margin:1.6rem 0; overflow-wrap:anywhere; }
.community-message { white-space:pre-wrap; overflow-wrap:anywhere; font-size:1.05rem; line-height:1.8; }
.community-gallery { display:grid; gap:1rem; margin-top:1.5rem; }
.community-image { max-width:100%; width:100%; max-height:620px; object-fit:contain; border-radius:1rem; background:var(--page); }
.community-video { max-width:100%; width:100%; max-height:620px; border-radius:1rem; background:#000; }
.community-rich-media { position:relative; display:block; overflow:hidden; border:1px solid var(--line); border-radius:1rem; background:var(--surface); background:color-mix(in srgb,var(--surface) 82%,var(--page)); color:var(--text); text-decoration:none; }
.community-rich-media-video { background:#000; }
.community-rich-media-frame { display:block; width:100%; aspect-ratio:16/9; border:0; background:#000; }
.community-rich-media-details { display:flex; align-items:center; gap:.75rem; padding:.8rem 1rem; color:var(--text); text-decoration:none; background:var(--surface); }
.community-rich-media-details strong,.community-rich-media-details small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.community-rich-media-details strong { flex:1; min-width:0; font-size:.9rem; }
.community-rich-media-details small { color:var(--muted); font-size:.75rem; }
.community-rich-media-provider { color:var(--accent); font-size:.68rem; font-weight:750; letter-spacing:.08em; text-transform:uppercase; }
.community-link-card { display:grid; grid-template-columns:minmax(9rem,30%) 1fr auto; min-height:7.4rem; transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease; }
.community-link-card:hover,.community-link-card:focus-visible { transform:translateY(-2px); border-color:var(--accent); box-shadow:0 15px 32px #0000001f; outline:none; }
.community-rich-media-thumbnail { width:100%; height:100%; min-height:7.4rem; object-fit:cover; background:var(--page); }
.community-rich-media-content { display:flex; flex-direction:column; justify-content:center; gap:.35rem; min-width:0; padding:1rem; }
.community-rich-media-content strong,.community-rich-media-content small { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.community-rich-media-content strong { font-size:1rem; }
.community-rich-media-content small { color:var(--muted); font-size:.78rem; }
.community-rich-media-open { align-self:center; margin-right:1rem; color:var(--accent); font-size:1.4rem; }
.community-engagement { display:flex; flex-wrap:wrap; gap:1rem; border-top:1px solid var(--line); padding-top:1.3rem; margin-top:1.5rem; color:var(--muted); font-size:.85rem; }
.community-engagement>a { color:var(--accent); flex-basis:100%; font-weight:650; text-decoration:none; }
.community-invite { position:sticky; top:1.5rem; border-top:3px solid var(--accent); }
.community-invite h2 { line-height:1.3; font-size:1.8rem; letter-spacing:-.03em; }
.community-invite p { line-height:1.7; }
.community-join { display:flex; align-items:center; justify-content:space-between; gap:1rem; padding:1rem 1.1rem; border-radius:.8rem; background:#007e92; color:#fff; font-weight:700; text-decoration:none; margin:1.5rem 0 1rem; }
.community-note { color:var(--muted); font-size:.8rem; }
.community-footer { text-align:center; font-size:.8rem; color:var(--muted); margin:3rem 1rem; }
.community-post .bn-share-button { background:var(--page); color:var(--text); border-color:var(--line); }
.community-post .bn-share-status { color:var(--muted); }
.community-post .bn-share-fallback input { background:var(--page); color:var(--text); border-color:var(--line); }
@media(max-width:800px) { .community-shell { grid-template-columns:1fr; padding:0 1rem; } .community-invite { position:static; } .community-nav { padding:1rem; } .community-post,.community-invite { padding:1.3rem; } .community-link-card { grid-template-columns:minmax(6.5rem,32%) 1fr auto; } }
@media(max-width:520px) { .community-link-card { grid-template-columns:1fr auto; } .community-rich-media-thumbnail { grid-column:1/-1; max-height:14rem; } }
