/* Community/profile layouts ported from OSRS Clan Finder, with Warframe blue accents. */
.social-shell { --rl-text:#e5e5ee; --rl-muted:#bcbccc; --rl-dim:#a4a6bb; --rl-orange:#a7c3ff; --rl-gold-soft:#a7c3ff; --rl-bg-deep:#111219; --rl-border:#454650; --rl-border-soft:#41434f; --rl-control-hover:#343743; --site-edge:#101117; --site-panel:linear-gradient(180deg,#292b35,#21222b); --site-panel-shadow:inset 0 0 0 1px #3d3f4b,inset 0 3px 0 #ffffff08,inset 0 -3px 0 #0003,0 0 0 1px #30323d,0 3px 6px #0008; --site-inset:linear-gradient(180deg,#171820,#1d1e27); --site-inset-shadow:inset 0 2px 4px #0009,0 1px 0 #ffffff0d; --site-button:linear-gradient(180deg,#343743,#262832); --site-button-shadow:inset 0 0 0 1px #484b59,inset 0 2px 0 #ffffff0a,0 2px 3px #0006; --community-panel:var(--site-panel); --community-panel-shadow:var(--site-panel-shadow); --community-inset:var(--site-inset); --community-inset-shadow:var(--site-inset-shadow); --community-button:var(--site-button); --community-button-shadow:var(--site-button-shadow); width:min(calc(100% - 2 * var(--page-pad)),var(--content)); margin:0 auto; padding:24px 0 48px; color:var(--rl-text); font-family:Arial,Helvetica,sans-serif; }
.social-shell * { box-sizing:border-box; }
.social-shell :is(h1,h2,h3,p,ol,ul,fieldset) { margin:0; padding:0; }
.social-shell a { color:inherit; text-decoration:none; }
.social-shell button { cursor:pointer; font-family:inherit; border:0; background:none; }
.social-shell button:disabled { opacity:.5; cursor:default; }
.social-shell [hidden] { display:none!important; }
.social-shell input,.social-shell select,.social-shell textarea { font:inherit; }
.social-shell fieldset { border:0; }
.social-shell legend { font-size:12px; color:var(--rl-muted); margin-bottom:12px; }
.social-shell :focus-visible { outline:2px solid #a7c3ff; outline-offset:3px; }
.social-shell svg { display:inline-block; vertical-align:middle; flex-shrink:0; }
.cf-composer,.cf-post,.cf-empty,.cf-feedToolbar,.cf-postSkeleton { min-width:0;border:1px solid #0d0e14;border-radius:10px;background:var(--community-panel);box-shadow:var(--community-panel-shadow); }
.cf-composerPrompt,.cf-signInComment { border:1px solid #101117!important;border-radius:5px!important;background:var(--community-inset)!important;box-shadow:var(--community-inset-shadow); }
.cf-primaryButton,.cf-secondaryButton { display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:8px 13px;border:1px solid #101117!important;border-radius:5px;background:var(--community-button)!important;box-shadow:var(--community-button-shadow);color:#a7c3ff!important;font-size:12px;font-weight:800; }
.cf-primaryButton { background:linear-gradient(180deg,#b1c9ff,#799ee9)!important;box-shadow:inset 0 0 0 1px #c8d9ff,inset 0 2px 0 #ffffff40,0 2px 3px #0006;color:#101b32!important; }
.cp-shell { color: var(--rl-text); }
.cp-heading { padding: 14px 0; }
.cp-title { margin: 8px 0 12px; font-weight: 900; }
.cp-intro { max-width: 52ch; color: var(--rl-muted); font-size: 14px; line-height: 1.8; }
.cp-primary,.cp-secondary { display: inline-flex; min-height: 43px; align-items: center; justify-content: center; gap: 8px; padding: 10px 17px; border: 1px solid var(--site-edge); border-radius: 5px; background: linear-gradient(180deg,#ffca72,#edac46); color: #21170c; font-size: 12px; font-weight: 800; text-decoration: none; box-shadow: inset 0 0 0 1px #f6d098,inset 0 2px 0 #ffffff40,0 2px 3px #0006; }
.cp-primary:hover { background: linear-gradient(180deg,#ffd58f,#f3b653); }
.cp-secondary { border-color: var(--site-edge); background: var(--site-button); color: var(--rl-orange); box-shadow: var(--site-button-shadow); }
.cp-secondary:hover { border-color: #ba965e; color: #edc88d; }
.cp-primary:disabled,.cp-secondary:disabled { opacity: .5; cursor: default; }
.cp-toolbar { display: flex; flex-wrap: wrap; gap: 12px; align-items: end; margin: 22px 0; padding: 18px; border: 1px solid var(--site-edge); border-radius: 10px; background: var(--site-panel); box-shadow: var(--site-panel-shadow); }
.cp-field { display: grid; gap: 8px; color: var(--rl-muted); font-size: 12px; font-weight: 700; }
.cp-toolbar .cp-field:first-child { flex: 1; min-width: 160px; }
.cp-field input,.cp-field select,.cp-field textarea { display: block; width: 100%; min-width: 0; border: 1px solid #3a4c54; border-radius: 5px; background: var(--site-inset); padding: 11px 12px; color: var(--rl-text); font-size: 14px; font-weight: 400; border-color: var(--site-edge); box-shadow: var(--site-inset-shadow); }
.cp-field input:focus,.cp-field textarea:focus,.cp-field select:focus { outline: 2px solid #dcaa59; outline-offset: 2px; }
.cp-field textarea { resize: vertical; line-height: 1.7; }
.cp-field input:disabled { opacity: .65; }
.cp-field small,.cp-muted { color: var(--rl-dim); font-size: 12px; font-weight: 400; line-height: 1.7; }
.cp-results { display: flex; align-items: center; justify-content: space-between; gap: 15px; margin: 20px 0; color: var(--rl-muted); font-size: 12px; }
.cp-cards { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 18px; }
.cp-card { display: flex; min-width: 0; flex-direction: column; gap: 17px; padding: 24px; border: 1px solid var(--site-edge); border-radius: 10px; background: var(--site-panel); box-shadow: var(--site-panel-shadow); }
.cp-cardTop { display: flex; align-items: center; gap: 13px; min-width: 0; }
.cp-cardTop > div { min-width: 0; }
.cp-card .cp-muted,.cp-identityText p { overflow-wrap: anywhere; }
.cp-card h2 { margin: 0 0 3px; font-size: 19px; font-weight: 800; overflow-wrap: anywhere; }
.cp-card h2 a:hover { color: var(--rl-orange); }
.cp-card p { margin: 0; }
.cp-avatar { display: flex; width: 60px; height: 60px; flex: 0 0 60px; align-items: center; justify-content: center; overflow: hidden; border: 1px solid #c99b5759; border-radius: 8px; background: var(--site-button); color: #efd5aa; font-size: 22px; font-weight: 800; border-color: var(--site-edge); box-shadow: inset 0 0 0 1px #484b59; }
.cp-avatar img { width: 100%; height: 100%; object-fit: cover; }
.cp-cardBio { min-height: 48px; color: var(--rl-muted); font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.cp-tags { display: flex; flex-wrap: wrap; gap: 7px; }
.cp-tags span { padding: 5px 8px; border: 1px solid var(--site-edge); border-radius: 4px; background: var(--site-inset); color: var(--rl-muted); font-size: 11px; box-shadow: var(--site-inset-shadow); }
.cp-clanLink { display: inline-flex; align-items: center; gap: 7px; color: var(--rl-orange); font-size: 12px; font-weight: 700; }
.cp-clanLink:hover { color: #ffd698; text-decoration: underline; }
.cp-cardBottom { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 17px; border-top: 1px solid #ffffff12; color: var(--rl-muted); font-size: 12px; }
.cp-cardBottom a { color: var(--rl-orange); font-weight: 800; }
.cp-empty { display: grid; justify-items: center; gap: 16px; padding: 65px 25px; border: 1px solid var(--site-edge); border-radius: 10px; background: var(--site-panel); text-align: center; box-shadow: var(--site-panel-shadow); }
.cp-empty > svg { color: var(--rl-gold-soft); }
.cp-empty h2 { margin: 0; color: var(--rl-text); font-size: 24px; font-weight: 800; }
.cp-empty p { max-width: 48ch; margin: 0; color: var(--rl-muted); font-size: 14px; line-height: 1.8; }
.cp-principles { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px; margin-top: 26px; }
.cp-principles > div { padding: 20px 0; }
.cp-principles h3 { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; font-size: 13px; font-weight: 800; }
.cp-principles h3 svg { color: var(--rl-gold-soft); }
.cp-principles p { margin: 0; color: var(--rl-muted); font-size: 12px; line-height: 1.9; }
.cp-breadcrumbs { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 15px; margin: 15px 0 22px; color: var(--rl-muted); font-size: 13px; }
.cp-breadcrumbs a:hover { color: var(--rl-orange); }
.cp-hero { overflow: hidden; margin-bottom: 22px; border: 1px solid var(--site-edge); border-radius: 10px; background: var(--site-panel); box-shadow: var(--site-panel-shadow); }
.cp-heroCover { height: 64px; background: linear-gradient(110deg,#30323e,#242630); border-bottom: 1px solid #41434f; }
.cp-identity { display: flex; flex-wrap: wrap; align-items: start; gap: 20px; padding: 0 24px 24px; }
.cp-identity .cp-avatar { width: 80px; height: 80px; flex-basis: 80px; margin-top: -24px; border: 4px solid #252630; border-radius: 14px; outline: 1px solid #484b59; font-size: 30px; }
.cp-identityText { flex: 1; min-width: 150px; padding-top: 20px; }
.cp-identityText h1 { margin: 0 0 7px; font-size: 28px; line-height: 1.2; font-weight: 900; letter-spacing: -.025em; overflow-wrap: anywhere; }
.cp-profileEyebrow { display: block; margin-bottom: 7px; color: #e9bf78; font-size: 10px; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.cp-identityText p { margin: 0 0 12px; color: var(--rl-dim); font-size: 12px; }
.cp-identityActions { display: flex; flex-wrap: wrap; gap: 9px; padding-top: 24px; }
.cp-column { display: grid; gap: 22px; min-width: 0; }
.cp-panel { min-width: 0; padding: 26px; border: 1px solid var(--site-edge); border-radius: 10px; background: var(--site-panel); scroll-margin-top: 90px; box-shadow: var(--site-panel-shadow); }
.cp-panel h2 { display: flex; align-items: center; gap: 9px; margin: 0 0 10px; color: var(--rl-text); font-size: 18px; font-weight: 800; }
.cp-panel h2 svg { color: var(--rl-gold-soft); flex-shrink: 0; }
.cp-panel > p { margin: 0 0 18px; color: var(--rl-muted); font-size: 13px; line-height: 1.8; }
.cp-profileIntro { padding:0 24px 24px; }
.cp-profileIntro .cp-bio { margin:0; color:var(--rl-muted); font-size:14px; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; }
.cp-profileIntro .cp-tags { margin-top:14px; }
.cp-post { margin-top: 16px; padding-top: 18px; border-top: 1px solid #ffffff14; }
.cp-postHeader { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; }
.cp-postAuthor { display: flex; align-items: center; gap: 10px; min-width: 0; }
.cp-postAuthor .cp-avatar { width: 34px; height: 34px; flex-basis: 34px; border-radius: 50%; font-size: 14px; }
.cp-postAuthor strong { color: var(--rl-text); font-size: 12px; overflow-wrap: anywhere; }
.cp-postAuthor a:hover { color: var(--rl-orange); text-decoration: underline; }
.cp-postHeader time { display: block; margin-top: 4px; color: var(--rl-dim); font-size: 10px; }
.cp-post p { margin: 13px 0; color: var(--rl-muted); font-size: 13px; line-height: 1.8; white-space: pre-wrap; overflow-wrap: anywhere; }
.cp-textButton { display: inline-flex; align-items: center; gap: 6px; color: var(--rl-muted); font-size: 11px; text-decoration: underline; text-underline-offset: 3px; }
.cp-textButton:hover { color: var(--rl-orange); }
.cp-label { display: inline-block; padding: 4px 7px; border: 1px solid var(--site-edge); border-radius: 4px; color: var(--rl-muted); font-size: 10px; font-weight: 600; background: var(--site-inset); box-shadow: var(--site-inset-shadow); }
.cp-form { display: grid; gap: 19px; }
.cp-formRow { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px; }
.cp-formActions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; }
.cp-check { display: flex; gap: 11px; align-items: start; color: var(--rl-text); font-size: 13px; line-height: 1.8; }
.cp-check input { margin-top: 5px; accent-color: #efab4d; }
.cp-choices { display: flex; flex-wrap: wrap; gap: 8px; }
.cp-choices label { cursor: pointer; display: inline-flex; align-items: center; gap: 7px; padding: 8px 10px; border: 1px solid #405158; border-radius: 5px; color: var(--rl-muted); font-size: 12px; }
.cp-choices label:has(input:checked) { border-color: #c99d59; background: #ad7c281c; color: #edcd9b; }
.cp-choices input { accent-color: #d3a45f; }
.cp-notice,.cp-error { padding: 12px 15px; border: 1px solid #789c7966; border-radius: 6px; background: #314c351c; color: #c4dec0; font-size: 13px; line-height: 1.7; }
.cp-error { border-color: #bd6d615c; background: #8b3a3317; color: #f1b6a9; }
.cp-timeline { padding: 0; margin: 22px 0 0; list-style: none; }
.cp-timeline li { position: relative; padding: 0 0 24px 23px; border-left: 1px solid #52696366; }
.cp-timeline li:last-child { padding-bottom: 0; }
.cp-timeline li::before { content: ''; position: absolute; top: 4px; left: -4px; width: 7px; height: 7px; border-radius: 50%; background: #b6c58c; }
.cp-timeline a { display: block; margin: 8px 0; color: var(--rl-text); font-size: 13px; font-weight: 600; line-height: 1.6; }
.cp-timeline a:hover { color: #e7bf81; text-decoration: underline; }
.cp-timeline time { color: var(--rl-dim); font-size: 11px; }
.cp-details summary { cursor: pointer; color: var(--rl-text); font-size: 13px; font-weight: 700; }
.cp-details .cp-form { margin-top: 18px; }
.cp-clanSelect { min-width: 0; margin-top: 18px; }
.cp-clanSelect > label { color: var(--rl-muted); font-size: 12px; font-weight: 700; }
.cp-clanSelect > label > button { height: auto; min-height: 44px; padding: 10px 12px; font-size: 14px; font-weight: 400; }
.cp-clanSelect [role="option"] { min-height: 42px; padding: 10px 12px; font-size: 13px; font-weight: 500; }
.cp-clanSelect [role="listbox"] { margin-top: 6px; }
.cp-clanSelect button > span { overflow-wrap: anywhere; }
.cp-avatarEditor { display: flex; flex-wrap: wrap; align-items: center; gap: 20px; }
.cp-avatarEditor input { display: block; max-width: 100%; color: var(--rl-muted); font-size: 12px; }
.cp-avatarEditor > div { min-width: 0; flex: 1; }
.cp-pagination { display: flex; align-items: center; justify-content: center; gap: 20px; margin-top: 24px; font-size: 12px; }
@media(max-width:1000px) { .cp-cards { grid-template-columns: repeat(2,minmax(0,1fr)); } .cp-panel { padding: 22px; } }
@media(max-width:767px) { .cp-principles { grid-template-columns: 1fr; gap: 0; } .cp-principles > div { padding: 13px 0; } .cp-identity { padding: 0 20px 22px; gap: 17px; } .cp-identityActions { width: 100%; padding-top: 0; } .cp-identity .cp-avatar { width: 80px; height: 80px; flex-basis: 80px; margin-top: -24px; border-radius: 18px; font-size: 30px; } .cp-identityText { padding-top: 15px; } .cp-heroCover { height: 52px; } .cp-identityText h1 { font-size: 26px; } .cp-profileIntro { padding:0 20px 22px; } .cp-formRow { grid-template-columns: 1fr; } }
@media(max-width:479px) { .cp-cards { grid-template-columns: 1fr; } .cp-toolbar { padding: 15px; } .cp-toolbar .cp-field { width: 100%; } .cp-panel { padding: 20px 17px; } .cp-card { padding: 20px; } .cp-empty { padding: 40px 20px; } }
.cp-feedHeading { display:flex; flex-wrap:wrap; justify-content:space-between; align-items:start; gap:10px; }
.cp-feedHeading p { margin:0; }
.cp-feedFilters { display:flex; flex-wrap:wrap; gap:7px; margin:22px 0; }
.cp-feedFilters button { padding:8px 11px; border:1px solid #394e54; border-radius:20px; font-size:11px; color:var(--rl-muted); }
.cp-feedFilters button[aria-pressed="true"] { background:#c49a4b1f; border-color:#be975a; color:#edc88d; }
.cp-feed { display:grid; gap:13px; margin:0; padding:0; list-style:none; }
.cp-feedItem { display:flex; align-items:start; gap:13px; padding:19px; border:1px solid var(--site-edge); border-radius:8px; background:var(--site-inset); scroll-margin-top:100px; box-shadow: var(--site-inset-shadow); }
.cp-feedIcon { display:flex; align-items:center; justify-content:center; flex:0 0 32px; width:32px; height:32px; border-radius:9px; background:#acbbc511; color:var(--rl-muted); }
.cp-feedBody { flex:1; min-width:0; }
.cp-feedMeta { display:flex; flex-wrap:wrap; justify-content:space-between; gap:5px 15px; color:var(--rl-dim); font-size:10px; line-height:1.6; }
.cp-feedItem h3 { margin:8px 0 0; font-size:13px; font-weight:700; line-height:1.6; color:var(--rl-text); overflow-wrap:anywhere; }
.cp-feedItem h3 a:hover { color:#f4cb8b; text-decoration:underline; }
.cp-feedItem p { margin:9px 0 0; color:var(--rl-muted); font-size:12px; line-height:1.8; white-space:pre-wrap; overflow-wrap:anywhere; }
.cp-feedHighlight { padding:23px 20px; border-color:#555968; background:var(--site-panel); }
.cp-feedHighlight .cp-feedIcon { width:39px; height:39px; flex-basis:39px; background:#d4a14c1b; color:#e7bc7b; }
.cp-feedHighlight h3 { font-size:17px; color:#e9e4d5; }
.cp-feedHighlight .cp-feedMeta > span { color:#cfb488; }
.cp-feedSummary { padding:14px 19px; background:var(--site-inset); border: 1px solid var(--site-edge); box-shadow: var(--site-inset-shadow); }
.cp-feedSummary .cp-feedIcon { background:transparent; }
.cp-feedSummary h3 { font-size:12px; }
.cp-feedSummary p { font-size:10px; }
.cp-feedPhoto { width:100%; max-height:440px; margin-top:14px; border-radius:6px; object-fit:contain; background:#071014; }
.cp-feedLinks { display:flex; flex-wrap:wrap; gap:8px 15px; margin-top:10px; font-size:11px; color:var(--rl-gold-soft); }
.cp-feedLinks a:hover { text-decoration:underline; }
.cp-feedEmpty { display:flex; gap:15px; padding:25px 0; color:var(--rl-muted); font-size:13px; line-height:1.8; }
.cp-feedEmpty svg { flex-shrink:0; color:var(--rl-gold-soft); }
.cp-photoComposer { margin-top:20px; padding:15px; border:1px solid var(--site-edge); border-radius:7px; background:var(--site-inset); box-shadow: var(--site-inset-shadow); }
.cp-photoComposer summary { display:flex; align-items:center; gap:10px; color:var(--rl-gold-soft); font-size:12px; font-weight:700; cursor:pointer; }
@media(max-width:600px) { .cp-feedItem { padding:15px 12px; gap:10px; } .cp-feedHighlight h3 { font-size:15px; } .cp-feedHighlight .cp-feedIcon { flex-basis:30px; width:30px; height:30px; } .cp-feedMeta { font-size:9px; } .cp-feedIcon { flex-basis:25px; width:25px; height:25px; } }
.cp-photoManagement { display:grid; gap:16px; margin-top:20px; }
.cp-photoManagement article { display:flex; align-items:start; gap:14px; min-width:0; }
.cp-photoManagement img { width:80px; height:65px; object-fit:cover; border-radius:5px; }
.cp-photoManagement article > div { min-width:0; }
.cp-photoManagement p { margin:0 0 8px; color:var(--rl-muted); overflow-wrap:anywhere; font-size:12px; line-height:1.7; }

.cf-shell {  }
.cf-stream { width:100%; min-width:0; }
.cf-primaryButton {  }
.cf-secondaryButton {  }
.cf-composer {  padding:18px 20px; }
.cf-post {  }
.cf-empty {  }
.cf-composerTop { display:flex; align-items:center; gap:12px; }
.cf-composer .cf-avatar,.cf-postHeader .cf-avatar { flex:0 0 42px; width:42px; height:42px; border:1px solid #101117; border-radius:50%; background:var(--community-button); box-shadow:inset 0 0 0 1px #484b59; color:#f0d3a2; font-size:15px; }
.cf-composerPrompt {  display:flex; flex:1; align-items:center; justify-content:space-between; gap:12px; min-width:0; min-height:44px; padding:11px 16px; color:var(--rl-muted); font-size:14px; text-align:left; }
.cf-composerPrompt:hover { color:var(--rl-text); }
.cf-composerPrompt svg { flex-shrink:0; color:var(--rl-orange); }
.cf-composerForm { margin-top:16px; padding-top:16px; border-top:1px solid var(--rl-border-soft); }
.cf-composerForm > p { margin-bottom:15px; color:var(--rl-muted); font-size:14px; line-height:1.7; }
.cf-feedToolbar {  display:flex; align-items:center; justify-content:space-between; gap:12px; margin:16px 0; padding:10px 12px; color:var(--rl-muted); font-size:12px; }
.cf-feedFilter { flex:0 0 180px; min-width:0; max-width:100%; }
.cf-feedFilter button[aria-haspopup="listbox"] { height:44px; padding:0 14px; border-color:#4b4e5c !important; border-radius:6px; box-shadow:inset 0 1px 0 #ffffff08,0 1px 2px #0003; font-size:13px; font-weight:600; }
.cf-feedFilter button[aria-haspopup="listbox"]:hover,.cf-feedFilter button[aria-expanded="true"] { border-color:#9c855b !important; }
.cf-feedFilter button[aria-haspopup="listbox"]:focus-visible { outline:2px solid #edc582; outline-offset:2px; }
.cf-feedFilter [role="listbox"] { padding:6px; box-shadow:0 12px 28px #0007; }
.cf-feedFilter [role="option"] { min-height:40px; padding:9px 10px; font-size:13px; font-weight:500; }
.cf-composerTools option { background:#22232c; color:var(--rl-text); }
.cf-posts { display:grid; gap:16px; }
.cf-posts .cf-photo { height:clamp(190px,48vw,540px); }
.cf-feedPagination { display:grid; justify-items:center; gap:12px; min-height:56px; margin-top:20px; }
.cf-feedPagination > p { text-align:center; }
.cf-feedLoading { display:grid; gap:16px; }
.cf-postSkeleton {  display:grid; align-content:center; gap:14px; min-height:180px; padding:24px; }
.cf-postSkeleton > span { height:12px; border-radius:4px; background:#3c3f4b; }
.cf-postSkeleton > span:first-child { width:36%; height:22px; }
.cf-postSkeleton > span:last-child { width:72%; }
.cf-post { min-width:0; overflow:hidden; }
.cf-postHeader { display:flex; align-items:start; gap:12px; padding:18px 20px 12px; }
.cf-postHeader > a { flex-shrink:0; border-radius:50%; }
.cf-postIdentity { min-width:0; padding-top:1px; }
.cf-postIdentity h2 { margin:0; font-size:14px; line-height:1.6; font-weight:700; overflow-wrap:anywhere; }
.cf-postIdentity h2 > span { color:var(--rl-muted); font-weight:400; }
.cf-postIdentity h2 a:hover,.cf-activity a:hover { text-decoration:underline; text-underline-offset:3px; }
.cf-postMeta { display:flex; flex-wrap:wrap; align-items:center; gap:3px 6px; margin-top:2px; color:var(--rl-muted); font-size:11px; line-height:1.6; }
.cf-postContent { padding:0 20px 16px; }
.cf-postContent > p { margin:0; color:var(--rl-text); font-size:14px; line-height:1.75; white-space:pre-wrap; overflow-wrap:anywhere; }
.cf-postContent > p + p { margin-top:8px; }
.cf-postContent .cf-activity { font-weight:500; }
.cf-photo { display:block; width:100%; max-height:540px; object-fit:contain; background:var(--rl-bg-deep); }
.cf-imageLink { display:block; }
.cf-postActions { display:flex; flex-wrap:wrap; gap:2px; padding:7px 12px; border-top:1px solid var(--rl-border-soft); background:#15161d33; box-shadow:inset 0 1px 0 #ffffff04; }
.cf-postActions > button.cf-liked { color:var(--rl-orange); background:#ffcf6f0d; }
.cf-postActions a,.cf-postActions > button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:36px; padding:6px 10px; border-radius:5px; color:var(--rl-muted); font-size:12px; font-weight:600; }
.cf-postActions a:hover,.cf-postActions > button:hover { color:var(--rl-text); background:var(--rl-control-hover); }
.cf-summary .cf-postContent > p + p { color:var(--rl-muted); font-size:12px; }
.cf-clanLinks { display:flex; flex-wrap:wrap; gap:6px 14px; margin-top:8px; color:var(--rl-orange); font-size:12px; }
.cf-clanLinks a:hover { text-decoration:underline; }
.cf-more { width:100%; margin-top:20px; }
.cf-empty { display:grid; justify-items:center; gap:12px; padding:32px 20px; text-align:center; }
.cf-empty h2 { font-size:17px; font-weight:700; }
.cf-empty p { color:var(--rl-muted); font-size:14px; line-height:1.7; }
.cf-postInput,.cf-commentForm textarea { width:100%; min-width:0; padding:12px 14px; border:1px solid var(--rl-border); border-radius:5px; background:var(--community-inset); box-shadow:var(--community-inset-shadow); color:var(--rl-text); font:inherit; font-size:14px; line-height:1.6; resize:vertical; }
.cf-postInput:focus,.cf-commentForm textarea:focus { outline:2px solid var(--rl-orange); outline-offset:2px; }
.cf-composerTools { display:flex; align-items:center; flex-wrap:wrap; gap:12px; }
.cf-composerTools > button:first-child { margin-right:auto; }
.cf-composerTools select { min-width:0; max-width:100%; padding:8px; border:1px solid var(--rl-border); border-radius:5px; background:var(--community-button); box-shadow:var(--community-button-shadow); color:var(--rl-muted); font-size:12px; }
.cf-composerForm label,.cf-composerForm small { color:var(--rl-muted); }
.cf-composerForm input[type="file"] { border-color:var(--rl-border); background:var(--community-inset); color:var(--rl-text); box-shadow:var(--community-inset-shadow); }
.cf-inlineButton { display:inline-flex; align-items:center; gap:7px; padding:7px 0; color:var(--rl-orange); font-size:12px; font-weight:600; }
.cf-inlineButton:hover { text-decoration:underline; }
.cf-feedSearch { display:flex; flex:1; align-items:center; width:100%; max-width:400px; min-width:0; min-height:44px; border:1px solid #444652; border-radius:6px; background:#1b1d25; box-shadow:inset 0 1px 2px #0003; }
.cf-feedSearch:focus-within { border-color:#b89b67; box-shadow:0 0 0 2px #edc58224; }
.cf-feedSearch input { flex:1; min-width:0; width:100%; min-height:42px; padding:9px 12px; border:0; border-radius:5px 0 0 5px; background:transparent; color:var(--rl-text); font:inherit; font-size:13px; outline:none; box-shadow:none; }
.cf-feedSearch input:focus { outline:none; box-shadow:none; }
.cf-feedSearch input::placeholder { color:#aaa9ba; opacity:1; }
.cf-feedSearch button { display:grid; flex:0 0 40px; place-items:center; align-self:stretch; min-height:42px; border-left:1px solid #393b46; border-radius:0 5px 5px 0; color:#b9b9c8; }
.cf-feedSearch button:hover,.cf-feedSearch button:focus-visible { background:#333640; color:#ffcf6f; }
.cf-feedSearch button:focus-visible { outline:2px solid #edc582; outline-offset:-4px; }
.cf-reportAction { display:flex; align-items:center; margin-left:auto; }
.cf-reportAction > button,.cf-commentMeta > button { border:0; background:transparent; text-transform:none; font-weight:500; letter-spacing:0; }
.cf-comments { display:grid; gap:14px; padding:18px 20px; border-top:1px solid var(--rl-border-soft); background:#15161d33; }
.cf-comment { display:flex; align-items:flex-start; gap:10px; scroll-margin-top:90px; }
.cf-comment .cf-commentAvatar { width:32px; height:32px; flex:0 0 32px; border:1px solid #101117; border-radius:50%; background:var(--community-button); box-shadow:inset 0 0 0 1px #484b59; color:#f0d3a2; font-size:12px; }
.cf-commentMain { min-width:0; flex:1; }
.cf-commentBubble { width:fit-content; max-width:100%; border:1px solid #101117; border-radius:8px; padding:10px 13px; background:linear-gradient(180deg,#30333f,#262832); box-shadow:inset 0 0 0 1px #3b3e4a,0 1px 2px #0004; font-size:13px; line-height:1.6; overflow-wrap:anywhere; }
.cf-commentBubble strong { display:block; font-size:12px; }
.cf-commentBubble p { margin:2px 0 0; white-space:pre-wrap; }
.cf-commentMeta { display:flex; flex-wrap:wrap; align-items:center; gap:4px 12px; padding:3px 8px; color:var(--rl-muted); font-size:10px; }
.cf-commentMeta > button { min-height:30px; padding:2px; font-size:11px; }
.cf-commentMeta > button svg { width:11px; }
.cf-replyContext { display:block; color:var(--rl-muted); font-size:11px; }
.cf-commentStatus { color:var(--rl-muted); font-size:12px; line-height:1.7; }
.cf-commentForm { display:grid; gap:10px; }
.cf-commentForm > button { justify-self:end; }
.cf-replyingTo { display:flex; gap:12px; align-items:center; color:var(--rl-muted); font-size:12px; }
.cf-replyingTo button { display:grid; place-items:center; width:28px; height:28px; }
.cf-signInComment {  min-height:42px; padding:10px 14px; color:var(--rl-muted); text-align:left; font-size:13px; }
@media(max-width:767px) {
  .cf-composer { padding:14px; }
  .cf-composerPrompt { padding:10px 13px; font-size:13px; }
  .cf-postHeader { padding:16px 16px 10px; }
  .cf-postContent { padding:0 16px 14px; }
  .cf-postMeta { font-size:10px; }
  .cf-postActions { padding-inline:8px; }
  .cf-postActions a,.cf-postActions > button { padding-inline:8px; font-size:11px; }
  .cf-comments { padding:14px 16px; }
  .cf-feedToolbar { gap:8px; padding:10px; }
  .cf-feedFilter { flex-basis:172px; }
  .cf-feedSearch input,.cf-feedSearch button { min-height:42px; }
  .cf-postActions a,.cf-postActions > button { min-height:40px; }
}
@media(max-width:479px) {
  .cf-feedToolbar { flex-direction:column; align-items:stretch; }
  .cf-feedSearch,.cf-feedFilter { width:100%; max-width:none; }
  .cf-feedFilter { flex-basis:auto; }
}

.cf-welcomeGroup { border: 1px solid #454650; border-radius: 8px; background: #22232c; overflow: hidden; }
.cf-welcomeGroup > summary { cursor: pointer; padding: 16px 18px; color: #f1d1a5; font-size: 14px; font-weight: 700; line-height: 1.6; }
.cf-welcomeGroup > summary span { display: block; margin-top: 4px; color: #bcbcc9; font-size: 12px; font-weight: 400; }
.cf-welcomeMembers { display: grid; gap: 10px; padding: 0 10px 10px; }


.social-heading { padding:38px 0 40px; margin-bottom:16px; border-bottom:1px solid #3d414e; }
.social-heading-title { display:flex;align-items:center;gap:10px; }
.social-heading-title img { object-fit:contain; }
.social-heading-title p { font-size:10px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:#a7c3ff;margin-bottom:8px; }
.social-heading-title h1 { font-size:28px;line-height:1.2;letter-spacing:-.025em;font-weight:900; }
.social-shell .social-description { font-size:13px;line-height:1.8;color:var(--rl-muted);margin:18px 0 20px; }
.social-shell .cp-primary { background:linear-gradient(180deg,#b1c9ff,#799ee9);color:#101b32;border:1px solid #101117;box-shadow:inset 0 0 0 1px #c8d9ff,inset 0 2px 0 #ffffff40,0 2px 3px #0006; }
.social-shell .cp-secondary { background:var(--site-button);color:#a7c3ff;border:1px solid #101117;box-shadow:var(--site-button-shadow); }
.social-shell .cp-primary:hover,.social-shell .cf-primaryButton:hover { background:linear-gradient(180deg,#c3d5ff,#91b1f2)!important; }
.social-shell .cp-secondary:hover,.social-shell .cf-secondaryButton:hover { background:linear-gradient(180deg,#3b3e4c,#2b2e39)!important; }
.social-shell .cp-profileEyebrow,.social-shell .cf-welcomeGroup > summary { color:#a7c3ff; }
.social-shell .cp-feedFilters button { border:1px solid #394e54; }
.social-shell .cp-feedFilters button[aria-pressed=true] { border-color:#91b0f5;color:#bed2ff;background:#91b0f51f; }
.social-shell .cf-feedFilter { height:44px;padding:0 14px;border:1px solid #4b4e5c;border-radius:6px;background:var(--site-button);color:var(--rl-text);font-size:13px;font-weight:600;box-shadow:var(--site-button-shadow); }
.social-shell option { background:#252630;color:#e5e5ee; }
.social-shell .cf-postActions button.liked {color:#a7c3ff;background:#91b0f51a;}
.social-shell .cp-check input,.social-shell .cp-choices input {accent-color:#91b0f5;}
.social-shell .cp-choices label:has(input:checked) {border-color:#91b0f5;background:#91b0f51c;color:#bed2ff;}
.social-shell .cp-feedHighlight .cp-feedIcon {color:#a7c3ff;background:#91b0f51b;}
.social-shell .cp-feedHighlight .cp-feedMeta > span {color:#aec2e8;}
.social-shell .cp-breadcrumbs a {display:inline-flex;align-items:center;gap:8px;}
.social-panel-heading {display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:12px;}
.social-shell .social-spaced {margin-top:20px;}
.social-shell .social-friends {list-style:none;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin:20px 0;}
.social-friends li {padding:12px;border:1px solid #41434f;border-radius:5px;min-width:0;}
.social-shell .cp-panel>p {margin-top:18px;}
.social-shell .cp-notice,.social-shell .cp-error {margin-bottom:20px;}
.social-shell [data-notice]:empty {display:none;}
.social-shell .cf-posts .cp-avatar {border-radius:50%;}
.social-shell .cf-commentAvatar {width:32px;height:32px;flex-basis:32px;font-size:12px;}
.social-dialog {width:min(520px,calc(100% - 32px));border:1px solid #555968;border-radius:10px;padding:26px;background:#252630;color:#e5e5ee;}
.social-dialog::backdrop {background:#0009;}
.social-dialog button {cursor:pointer;}
.social-shell .cp-clanLink,.social-shell .cp-cardBottom a {color:#a7c3ff;}
.social-shell .cp-cardBottom a {display:inline-flex;align-items:center;gap:8px;}
.social-shell .cp-feed + .cp-feed {margin-top:13px;}
@media(max-width:767px) { .social-shell {padding-top:16px;} .social-heading{padding-top:22px;padding-bottom:28px;} .social-heading-title h1 {font-size:26px;} .social-friends{grid-template-columns:1fr!important;} }

/* Keep the shared accessible selects within the OSRS toolbar geometry. */
.social-shell .cf-feedToolbar > .panel-select {flex:0 0 220px;width:220px;}
.social-shell .panel-select__trigger {border:1px solid #4b4e5c;border-radius:6px;background:var(--site-button);box-shadow:var(--site-button-shadow);color:var(--rl-text);font-size:13px;font-weight:600;}
.social-shell .cf-feedSearch {flex:1 1 400px;min-width:0;}
.social-shell .social-friends:empty,.social-shell .cf-feedPagination:empty {display:none;}
.site-frame:has(.social-shell) {background:linear-gradient(180deg,#16171e,#111219 650px);min-height:100vh;}
.social-shell {font-family:Lato,Arial,Helvetica,sans-serif;padding-top:32px;}
.social-shell .cp-identityText {padding-bottom:8px;}
.social-shell .social-heading {padding-bottom:50px;}
.social-shell .cp-panel p:last-child {margin-bottom:18px;}
.social-shell .cf-avatar {color:#bed2ff;}
@media(max-width:479px) {.social-shell .cf-feedToolbar > .panel-select {width:100%;flex-basis:auto;} .social-shell .cf-feedSearch {flex-basis:auto;} }
@media(max-width:767px) {.social-shell{padding-top:16px;}.social-shell .social-heading{padding-bottom:28px;}}

.social-dialog {--rl-text:#e5e5ee;--rl-muted:#bcbccc;--rl-dim:#a4a6bb;--site-edge:#101117;--site-inset:linear-gradient(180deg,#171820,#1d1e27);--site-inset-shadow:inset 0 2px 4px #0009;--site-button:linear-gradient(180deg,#343743,#262832);--site-button-shadow:inset 0 0 0 1px #484b59;--rl-orange:#a7c3ff;}
.social-dialog .cp-primary {background:linear-gradient(180deg,#b1c9ff,#799ee9);color:#101b32;box-shadow:inset 0 0 0 1px #c8d9ff,inset 0 2px 0 #ffffff40,0 2px 3px #0006;}