/* Comunidad v8.15. Scoped layout; existing posts keep their original actions. */
body.community-mode { background:#0c1020; }
.community-mode .site-header { display:none; }
.community-mode main { padding-top:0; }
.social-layout { display:grid; grid-template-columns:230px minmax(0,620px) 270px; gap:36px; width:min(1260px,calc(100% - 48px)); margin:0 auto; align-items:start; padding:26px 0 60px; }
.social-left,.social-right { position:sticky; top:26px; min-width:0; max-height:calc(100dvh - 52px); overflow-y:auto; scrollbar-width:thin; }
.social-brand { display:flex; align-items:center; gap:12px; margin:0 0 28px; text-decoration:none; color:#fff; font-weight:850; letter-spacing:.12em; }
.social-brand img { width:42px; height:42px; object-fit:cover; border-radius:12px; }
.social-brand small { display:block; margin-top:4px; font-size:.65rem; color:#a69cb7; letter-spacing:.18em; text-transform:uppercase; }
.social-nav { display:grid; gap:7px; margin-bottom:28px; }
.social-nav button { width:100%; display:flex; align-items:center; gap:12px; padding:12px; text-align:left; border:0; border-radius:10px; background:transparent; color:#c6c4d3; font:inherit; font-size:.88rem; cursor:pointer; }
.social-nav button span { width:22px; color:#b5a3d4; font-size:1.35rem; }
.social-nav button[aria-pressed=true] { background:#22223c; color:#fff; font-weight:700; }
.social-nav button[hidden],.social-main [hidden] { display:none; }
.social-search label { display:block; font-size:.8rem; font-weight:700; margin-bottom:10px; }
.social-search input { width:100%; border:1px solid #323448; border-radius:10px; background:#131729; color:white; padding:11px; font:inherit; font-size:.82rem; }
.social-search-results { margin-top:12px; max-height:40dvh; overflow:auto; }
.social-person { display:flex; align-items:center; gap:8px; margin:0 0 17px; min-width:0; }
.social-person>a { display:flex; gap:10px; align-items:center; min-width:0; flex:1; color:#eae8f4; text-decoration:none; }
.social-person img { flex:none; width:38px; height:38px; border-radius:50%; object-fit:cover; background:#24243b; }
.social-person span { min-width:0; }
.social-person strong,.social-person small { display:block; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.social-person strong { font-size:.8rem; }.social-person small { margin-top:3px; color:#9293a8; font-size:.72rem; }
.social-person button { background:none; border:0; color:#bfabfa; font-weight:700; font-size:.74rem; cursor:pointer; padding:5px; }
.social-right { padding-top:12px; }.social-right h2 { font-weight:700;line-height:1.5; font-size:.8rem; color:#9695ab; margin:32px 0 20px; }
.social-profile-link { font-size:.75rem; color:#b4a8cf; }.social-signature { color:#64667e; font-size:.73rem; line-height:1.7; margin-top:30px; }
.social-back { display:block; padding:18px 0; font-size:.8rem; color:#aaa3b9; text-decoration:none; }.social-shortcuts { display:flex; gap:14px; }.social-shortcuts a { color:#8f899e; font-size:.73rem; }
.social-main { min-width:0; }.social-feed-tabs { display:flex; gap:22px; margin:0 0 18px; border-bottom:1px solid #25293c; }
.social-feed-tabs button { padding:0 0 12px; border:0; border-bottom:2px solid transparent; background:none; color:#8f8c9f; cursor:pointer; font-size:.9rem; font-weight:700; }.social-feed-tabs button[aria-pressed=true] { color:#eee9f6; border-bottom-color:#b398dc; }
.community-mode .community-feed { width:100%; }.community-mode .community-post { margin:0 0 28px; border-radius:12px; box-shadow:none; background:#111628; border-color:#272d42; }
.community-mode .community-post-image img { max-height:680px; }.community-mode .community-post-header { padding:14px; }.community-mode .community-post-header time { font-size:.66rem; }
.community-mode .community-feed-empty { padding:40px 20px; }.community-mode .community-feed-empty h3 { font-size:1.4rem; }
.social-panel-heading { display:flex; justify-content:space-between; align-items:center; gap:16px; margin:0 0 20px; }.social-panel-heading h1 { font-size:1.4rem; margin:0; }.social-panel-heading .button { font-size:.72rem; }
.social-muted { color:#aaa8bd; font-size:.8rem; line-height:1.6; }.social-error,.social-empty { border:1px solid #39324c; border-radius:14px; padding:22px; background:#17172a; }.social-form-error { color:#ffb6b9; font-size:.8rem; white-space:pre-wrap; }.social-form-error:empty { display:none; }
.mission-card { border:1px solid #30324a; border-radius:16px; background:#13172b; padding:18px; margin-bottom:24px; }.mission-card h2 { margin:12px 0 18px; font-size:1.35rem; overflow-wrap:anywhere; }.mission-heading { display:flex; align-items:center; justify-content:space-between; gap:10px; }.mission-count { font-size:.75rem; color:#bcb2ca; }
.mission-visual { display:grid; grid-template-columns:minmax(0,1fr) minmax(190px,.9fr); gap:12px; margin-bottom:20px; align-items:start; }
.mission-cover { display:block; width:100%; aspect-ratio:3/4; max-height:360px; object-fit:cover; border-radius:10px; background:#1c2039; }
.mission-slots { display:grid; gap:8px; max-height:360px; overflow-y:auto; padding-right:3px; }
.mission-slot { display:flex; align-items:center; gap:9px; min-width:0; padding:6px; background:#090c15; border:1px solid #303246; border-radius:9px; color:white; text-decoration:none; min-height:65px; }
.mission-slot>span:not(.mission-avatar):not(.combat-role):not(.slot-question) { min-width:0; flex:1; }.mission-slot strong { display:block; font-size:.76rem; overflow-wrap:anywhere; }.mission-slot small { display:block; font-size:.65rem; color:#9d99b1; margin-top:3px; }.mission-slot.vacant { background:#030409; color:#7f8093; font-size:.72rem; }.slot-question { display:grid; place-items:center; width:48px; flex:none; height:50px; color:white; font-size:1.75rem; font-weight:700; }
.mission-avatar { display:inline-block; flex:none; width:52px; height:52px; overflow:hidden; border-radius:8px; background:linear-gradient(145deg,#706086,#2c345d); }.mission-avatar img { display:block; width:100%; height:100%; object-fit:cover; }
.combat-role { display:inline-flex; align-items:center; gap:6px; font-size:.7rem; color:#c5c1d6; }.combat-role img { width:26px; height:26px; object-fit:contain; }.mission-slot .combat-role { flex:none; font-size:0; margin-left:auto; }.mission-slot .combat-role img { width:24px; height:24px; }.role-unset { font-size:.7rem; color:#a9a4b7; }
.mission-card>time { display:block; color:#e6d5fa; font-size:.86rem; font-weight:700; line-height:1.5; }.mission-description { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.85rem; color:#d0ccdd; line-height:1.65; }.mission-actions { display:flex; flex-wrap:wrap; gap:10px; margin-top:20px; }.mission-actions .button { font-size:.7rem; padding:10px 12px; }.mission-cover-preview { width:100%; max-height:220px; object-fit:contain; background:#0b0d1b; border-radius:10px; }.mission-cover-preview[hidden] { display:none; }
.character-role-picker { border:1px solid #343348; border-radius:12px; padding:14px; }.role-choices { display:flex; flex-wrap:wrap; gap:10px; }.role-choices label { flex:1; display:flex; align-items:center; justify-content:center; gap:8px; padding:10px; border:1px solid #343348; border-radius:10px; cursor:pointer; font-size:.75rem; }.role-choices label:has(input:checked) { background:#38324c; border-color:#c2a1ea; }.role-choices img { width:34px; height:34px; }.character-crop-editor { display:flex; align-items:center; gap:16px; }.character-crop-editor>.mission-avatar { width:88px; height:88px; }.character-crop-editor .mission-avatar .mission-avatar { width:100%; height:100%; }.character-crop-editor label { flex:1; min-width:0; }
.character-choice-list,.chat-recipient-list { display:grid; gap:9px; max-height:45dvh; overflow-y:auto; }.character-choice { display:flex; align-items:center; gap:12px; padding:12px; border:1px solid #38344e; border-radius:10px; cursor:pointer; }.character-choice:has(input:checked) { border-color:#c7a2ef; background:#302742; }.character-choice:has(input:disabled) { opacity:.65; }.character-choice input { width:auto; }.character-choice strong,.character-choice small { display:block; }.character-choice small { color:#a6a2b7; font-size:.75rem; margin:4px 0; }.character-choice a { display:block; font-size:.75rem; margin-top:5px; }
.chat-layout { display:grid; grid-template-columns:180px minmax(0,1fr); border:1px solid #303249; border-radius:14px; overflow:hidden; background:#111527; min-height:500px; }
#chatThreads { border-right:1px solid #303249; padding:8px; max-height:70dvh; overflow:auto; }.chat-thread { display:flex; gap:8px; align-items:center; padding:10px 6px; width:100%; background:none; border:0; border-radius:8px; color:#e5def0; cursor:pointer; text-align:left; }.chat-thread.is-selected { background:#2b2540; }.chat-thread .mission-avatar { width:34px; height:38px; }.chat-thread>span:last-child { min-width:0; }.chat-thread strong { display:block; font-size:.72rem; overflow-wrap:anywhere; }.chat-thread small { display:block; font-size:.63rem; color:#aaa2bc; margin-top:4px; }
#chatConversation { min-width:0; display:flex; flex-direction:column; height:70dvh; min-height:480px; max-height:800px; }#chatConversation>p { padding:16px; }.chat-header { display:flex; align-items:center; gap:10px; padding:13px; border-bottom:1px solid #303249; }.chat-header .mission-avatar { width:38px; height:40px; }.chat-header strong { font-size:.84rem; }.chat-header small { display:block; font-size:.66rem; color:#aaa2bc; margin-top:4px; }
.chat-messages { flex:1; min-height:0; overflow-y:auto; padding:16px 12px; display:flex; flex-direction:column; gap:12px; }.chat-message { align-self:flex-start; background:#25273e; border-radius:12px 12px 12px 3px; padding:10px 12px; max-width:90%; }.chat-message.is-own { align-self:flex-end; background:#493966; border-radius:12px 12px 3px 12px; }.chat-message strong { font-size:.65rem; color:#c9b0e8; }.chat-message p { white-space:pre-wrap; overflow-wrap:anywhere; font-size:.83rem; line-height:1.5; margin:5px 0; }.chat-message time { font-size:.58rem; color:#aaa4bb; }.chat-compose { display:flex; flex-wrap:wrap; align-items:end; gap:8px; padding:12px; border-top:1px solid #303249; }.chat-compose textarea { min-width:0; flex:1; resize:vertical; max-height:180px; background:#0b1020; border:1px solid #3c3552; border-radius:9px; color:white; padding:10px; font:inherit; font-size:.8rem; }.chat-compose .button { padding:12px; font-size:.7rem; }.chat-compose .social-form-error { flex-basis:100%; }#chatReadError { margin:0; padding:0 12px; }
.social-layout button:focus-visible,.social-layout a:focus-visible { outline:2px solid #d4b3fd; outline-offset:3px; }
@media(min-width:1500px){.social-layout{grid-template-columns:240px minmax(0,680px) 280px;width:min(1320px,calc(100% - 60px));gap:48px}}
@media(max-width:1100px){.social-layout{grid-template-columns:200px minmax(0,1fr);gap:25px;width:calc(100% - 36px)}.social-right{display:none}.social-left{grid-column:1}.social-main{grid-column:2}}
@media(max-width:720px){.social-layout{display:flex;flex-direction:column;width:100%;gap:16px;padding:14px 12px 40px}.social-left{position:static;width:100%;max-height:none;overflow:visible}.social-brand{margin-bottom:15px}.social-nav{display:flex;gap:4px;margin-bottom:14px}.social-nav button{justify-content:center;font-size:.72rem;padding:10px 5px;gap:5px}.social-nav button span{font-size:1rem;width:auto}.social-search{margin-top:10px}.social-search label{font-size:.72rem}.social-search-results:has(.social-muted){display:none}.social-search-results{max-height:180px}.social-back{padding:12px 0;font-size:.72rem}.social-shortcuts{display:none}.social-main{width:100%}.community-mode .community-post{margin-inline:0}.community-mode .community-post-image img{max-height:540px}.mission-card{padding:12px}.mission-visual{grid-template-columns:minmax(0,.9fr) minmax(175px,1fr);gap:8px}.mission-cover{aspect-ratio:3/5}.mission-avatar{width:40px;height:46px}.mission-slot{gap:6px;padding:4px}.mission-slot strong{font-size:.68rem}.mission-slot .combat-role img{width:21px;height:21px}.slot-question{width:36px}.mission-slot.vacant{font-size:.65rem}.chat-layout{grid-template-columns:1fr}#chatThreads{display:flex;gap:6px;border-right:0;border-bottom:1px solid #303249;max-height:120px;overflow-x:auto}.chat-thread{width:155px;flex:none}.chat-header{padding:10px}#chatConversation{height:65dvh;min-height:400px}.social-panel-heading h1{font-size:1.2rem}.role-choices label{padding:8px 4px;gap:4px}.role-choices img{width:26px;height:26px}.role-choices{gap:5px}.character-crop-editor{align-items:start}.character-crop-editor>.mission-avatar{width:68px;height:68px}}

.social-mobile-account { display:none; }
@media(max-width:1100px){.social-mobile-account{display:block;margin-top:18px;font-size:.8rem}.social-mobile-account button{border:0;background:none;color:#c9b0ed;cursor:pointer}}
.social-layout .sr-only { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.mission-avatar.is-equipment img { transform:scale(2.2); transform-origin:50% var(--portrait-focus,12%); }
.role-choices { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); }
.role-choices label { display:grid; grid-template-columns:auto auto; justify-content:center; gap:6px; min-width:0; }
.role-choices label span { grid-column:1/-1; text-align:center; }

/* Pending conversations (count chats, not individual messages). */
.chat-pending-count, .social-nav button span.chat-pending-count { display:inline-flex; align-items:center; justify-content:center; width:auto; min-width:18px; height:18px; padding:0 5px; margin-left:5px; flex-shrink:0; border-radius:999px; background:#e3384f; color:#fff; font-size:11px; font-weight:800; line-height:1; }
.chat-pending-dot { width:9px; height:9px; flex:0 0 9px; border-radius:50%; background:#f34660; margin-left:auto; box-shadow:0 0 0 2px #f3466020; }
