
.staff-admin { width:min(1180px,calc(100% - 32px)); margin:32px auto; }
.staff-toolbar { display:flex; gap:10px; flex-wrap:wrap; margin:16px 0; }
.staff-admin-grid { display:grid; grid-template-columns:minmax(220px,1fr) minmax(0,2fr); gap:18px; }
.staff-queue-item { display:block; width:100%; text-align:left; margin:8px 0; white-space:normal; }
.staff-dialog { width:min(620px,calc(100% - 24px)); max-height:calc(100dvh - 24px); overflow:auto; border:1px solid var(--line,#4b3d4f); border-radius:18px; padding:22px; background:var(--surface,#1d1821); color:var(--text,#f7eff6); box-shadow:0 28px 90px #000c; isolation:isolate; }
.staff-dialog::backdrop { background:#0009; }
.staff-dialog-head { display:flex; justify-content:space-between; align-items:start; gap:12px; }
.staff-dialog-head h2 { margin:0; }
.staff-compose { display:grid; gap:12px; margin-top:16px; }
.staff-compose input:not([type=checkbox]),.staff-compose textarea,.staff-compose select,.staff-toolbar input { min-width:0; width:100%; border:1px solid var(--line,#4b3d4f); border-radius:10px; padding:12px; color:var(--text,#f7eff6); background:var(--bg,#121017); font:inherit; }
.staff-compose textarea { resize:vertical; }
.staff-compose label { display:grid; gap:8px; }
.staff-compose label.check-row { display:flex; align-items:start; }
.staff-status { color:var(--muted,#c0b4c5); white-space:pre-wrap; }
.staff-conversation { max-height:360px; overflow:auto; overscroll-behavior:contain; display:grid; gap:10px; }
.staff-message { border:1px solid var(--line,#4b3d4f); padding:12px; border-radius:12px; background:var(--bg-soft,#251f2a); overflow-wrap:anywhere; }
.staff-message--staff { border-color:#d5a15b66; }
.staff-message time { display:block; font-size:.72rem; color:var(--muted,#c0b4c5); }
.staff-message p { margin:8px 0 0; white-space:pre-wrap; }
.staff-selfie { display:block; max-width:100%; max-height:55dvh; object-fit:contain; margin:15px auto; }
.staff-selfie-placeholder { min-height:200px; background:var(--bg); display:grid; place-items:center; text-align:center; padding:25px; }
.staff-admin label.staff-ad-toggle { display:flex; justify-content:space-between; gap:20px; padding:16px 0; border-bottom:1px solid var(--line); }
.staff-admin label.staff-ad-toggle input { width:22px; height:22px; accent-color:var(--accent); }
.staff-contact { display:flex; flex-direction:column; align-items:start; gap:4px; width:100%; background:#d5a15b0a; border:1px solid #d5a15b44; border-radius:10px; padding:10px; text-align:left; color:var(--text); margin:6px 0 8px; cursor:pointer; }
.staff-contact small { font-size:.7rem; color:var(--muted); }
.real-chatter-badge,.staff-role-badge { display:inline-flex; padding:2px 5px; border:1px solid #81c9ff55; background:#81c9ff0d; border-radius:5px; font-size:.62rem; font-weight:700; margin-inline-start:5px; color:#a9d9fc; vertical-align:middle; white-space:nowrap; }
.staff-role-badge { color:#f3d598; background:#d5a15b11; border-color:#d5a15b66; }
.identity-ages { display:flex; flex-wrap:wrap; gap:4px 9px; font-size:.82rem; line-height:1.5; color:var(--muted); }
.identity-age { display:inline-flex; align-items:center; gap:4px; white-space:nowrap; }
.identity-age b { font-size:1.18rem; line-height:1.3; font-weight:800; }
.identity-age--vrouw b { color:#ff8dbb; } .identity-age--man b { color:#79bfff; }
.identity-age--trans b { color:#cf9eff; } .identity-age--non_binary b { color:#7ddfcf; }
.identity-name--vrouw { color:#ff9abf !important; } .identity-name--man { color:#8fc7ff !important; }
.identity-name--couples { color:#ecc486 !important; } .identity-name--trans { color:#cda8f5 !important; }
.identity-name--non_binary { color:#85dbcb !important; } .identity-name--other { color:#d1c8d7 !important; }
@media(max-width:700px){.staff-admin-grid{grid-template-columns:1fr}.staff-dialog{padding:16px}.staff-conversation{max-height:36dvh}.staff-admin{width:calc(100% - 24px)}}

#dm-replies-info { margin: 4px 12px; font-size: .78rem; } #dm-upgrade { margin: 2px 12px 8px; }

/* Private messages keep their own layout and controls, separate from public chat. */
#dm-dialog { box-sizing:border-box; width:min(1040px,calc(100vw - 20px)); height:min(740px,calc(var(--chat-viewport-height,100dvh) - 20px)); max-height:calc(var(--chat-viewport-height,100dvh) - 20px); padding:0; overflow:hidden; border-color:#453642; border-radius:20px; background:#18151d; box-shadow:0 24px 90px #0008; }
#dm-dialog[open] { grid-template-rows:auto minmax(0,1fr); gap:0; }
#dm-dialog .dm-window-header { gap:12px; padding:16px 20px; border-bottom:1px solid #ffffff12; min-width:0; }
#dm-dialog .dm-window-title { min-width:0; flex:1; }
.dm-window-title > span { color:#aa93a1; font-size:.68rem; text-transform:uppercase; letter-spacing:.12em; }
#dm-dialog h2 { margin:3px 0; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:1.06rem; }
#dm-close,#dm-conversations-toggle,#dm-conversations-back { flex-shrink:0; color:#eee4ec; border:1px solid #ffffff20; background:#ffffff08; border-radius:10px; cursor:pointer; }
#dm-dialog #dm-close { width:40px; padding:0; font-size:1.4rem; }
#dm-conversations-toggle,#dm-conversations-back { display:none; }
.dm-workspace { min-height:0; min-width:0; display:grid; grid-template-columns:250px minmax(0,1fr); }
#dm-sidebar { display:flex; flex-direction:column; min-height:0; background:#ffffff02; border-right:1px solid #ffffff12; }
.dm-sidebar-heading { display:flex; align-items:center; justify-content:space-between; padding:18px 16px 10px; color:#d3c3ce; font-size:.82rem; }
#dm-conversations { flex:1; min-height:0; overflow-y:auto; padding:4px 8px; }
#dm-list .dm-conversation,#dm-conversations .dm-conversation { display:flex; align-items:center; gap:10px; width:100%; border:1px solid transparent; border-radius:12px; background:transparent; padding:12px 9px; color:#e9e1e8; text-align:left; cursor:pointer; }
#dm-list .dm-conversation:hover,#dm-conversations .dm-conversation:hover { background:#ffffff08; }
#dm-conversations .dm-conversation[aria-current=true] { background:#b8365e1c; border-color:#b8365e55; }
.dm-conversation-avatar { display:grid; place-items:center; flex-shrink:0; width:36px; height:36px; overflow:hidden; border-radius:11px; background:linear-gradient(140deg,#653146,#34243d); color:#f4cbdc; font-size:.78rem; font-weight:700; }
.dm-conversation-text { flex:1; min-width:0; display:grid; gap:4px; }
.dm-conversation-text strong { font-size:.82rem; overflow:hidden; white-space:nowrap; text-overflow:ellipsis; }
.dm-conversation-text small { color:#a696a4; font-size:.7rem; }
.dm-unread,#dm-window-count:not(:empty) { background:#ba3c63; color:white; border-radius:20px; min-width:20px; padding:2px 5px; font-size:.7rem; text-align:center; }
.dm-sidebar-note { color:#a696a4; padding:14px 16px; font-size:.7rem; line-height:1.5; border-top:1px solid #ffffff0d; margin:0; }
.dm-thread { min-width:0; min-height:0; display:grid; grid-template-rows:minmax(0,1fr) auto; background:#121017; }
#dm-messages { display:flex; flex-direction:column; align-items:stretch; gap:16px; overflow:auto; overscroll-behavior:contain; scroll-padding-block:24px; padding:24px 20px; }
.dm-message { max-width:86%; width:fit-content; min-width:0; align-self:flex-start; flex-shrink:0; }
.dm-message--mine { align-self:flex-end; }
.dm-message--continued { margin-top:-10px; }
.dm-message-meta { display:flex; align-items:center; gap:8px; margin:0 3px 5px; min-height:16px; color:#b8a5b3; font-size:.68rem; }
.dm-message--mine .dm-message-meta { justify-content:flex-end; }
.dm-message-meta strong { color:#ead9e4; font-size:.75rem; }
.dm-message-meta time { color:#9d8e9b; font-size:.65rem; }
#dm-dialog .dm-message-report { margin-left:auto; padding:0 3px; min-height:20px; height:20px; width:22px; background:transparent; color:#a696a4; border:0; border-radius:4px; cursor:pointer; }
.dm-message-bubble { padding:10px 13px; border-radius:4px 15px 15px; background:#28222e; color:#f3ecf2; font-size:.9rem; line-height:1.5; white-space:pre-wrap; overflow-wrap:anywhere; }
.dm-message--mine .dm-message-bubble { border-radius:15px 4px 15px 15px; background:#a93057; }
.dm-composer { border-top:1px solid #ffffff0d; padding:12px 16px max(12px,env(safe-area-inset-bottom)); background:#1b1720; }
#dm-status:empty { display:none; }
#dm-status { margin:0 0 8px; line-height:1.5; }
#dm-replies-info { margin:0 0 6px; line-height:1.45; }
#dm-upgrade { margin:0 0 8px; padding:5px 9px; font-size:.72rem; min-height:30px !important; }
#dm-form { align-items:stretch; padding:0; }
#dm-input { width:100%; padding:12px 13px; border:1px solid #ffffff20; border-radius:12px; background:#ffffff05; color:#f3ecf2; }
#dm-send { border:0; border-radius:12px; background:#b6355e; color:white; font-weight:650; padding:10px 15px; cursor:pointer; }
#dm-send:disabled { opacity:.5; cursor:wait; }
#dm-dialog button:focus-visible,#dm-input:focus-visible,#dm-messages:focus-visible { outline:2px solid #f69cba; outline-offset:2px; }
#dm-dialog [hidden] { display:none !important; }
#dm-dialog .dm-empty { margin:auto; padding:24px 12px; color:#b2a0ae; text-align:center; font-size:.82rem; }
@media(max-width:640px) {
 #dm-dialog { width:calc(100vw - 12px); max-width:calc(100vw - 12px); height:calc(var(--chat-viewport-height,100dvh) - 12px); max-height:calc(var(--chat-viewport-height,100dvh) - 12px); border-radius:14px; }
 #dm-dialog .dm-window-header { padding:10px; gap:9px; }
 #dm-dialog .dm-window-title > span { display:none; }
 #dm-dialog h2 { font-size:.92rem; }
 #dm-conversations-toggle,#dm-conversations-back { display:inline-flex; align-items:center; gap:5px; padding:7px; font-size:.72rem; }
 .dm-workspace { grid-template-columns:minmax(0,1fr); }
 #dm-sidebar { display:none; }
 #dm-dialog.dm-show-conversations #dm-sidebar { display:flex; border:0; }
 #dm-dialog.dm-show-conversations .dm-thread { display:none; }
 #dm-messages { padding:14px 12px; }
 .dm-message { max-width:91%; }
 .dm-composer { padding:10px; padding-bottom:max(10px,env(safe-area-inset-bottom)); }
 #dm-send { padding:9px 11px; font-size:.78rem; }
}

.abuse-form { display:grid; gap:14px; max-width:900px; }
.abuse-field { display:flex; align-items:center; gap:18px; justify-content:space-between; color:#ddd1dc; }
.abuse-field>span { flex:1; font-size:.85rem; line-height:1.5; }
.abuse-field>span strong { display:block; color:var(--text,#f7eff6); font-size:.9rem; }
.abuse-field>span small { display:block; margin-top:4px; color:var(--muted,#c0b4c5); font-size:.74rem; line-height:1.5; }
.abuse-field>input:not([type=checkbox]),.abuse-field>select { width:min(48%,320px); min-width:0; padding:10px; border-radius:8px; border:1px solid #ffffff25; background:#161219; color:#eee; }
.abuse-field>input[type=checkbox] { width:20px; height:20px; }
#abuse-workspace .panel { margin-top:16px; overflow-wrap:anywhere; }
.abuse-flow { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; margin-top:18px; }
#abuse-workspace .abuse-explain-card { margin:0; padding:16px; }
.abuse-explain-card h3 { margin:0 0 8px; font-size:.92rem; }
.abuse-explain-card p { margin:0; color:var(--muted,#c0b4c5); font-size:.78rem; line-height:1.55; }
.abuse-summary,.abuse-protected { padding:20px; }
.abuse-summary-row,.abuse-protected-row { display:flex; align-items:center; justify-content:space-between; gap:16px; padding:13px 0; border-bottom:1px solid var(--line,#4b3d4f); }
.abuse-summary-row:last-of-type,.abuse-protected-row:last-child { border-bottom:0; }
.abuse-summary>.button { margin-top:18px; }
.abuse-protected-row>div { min-width:0; }
.abuse-protected-row p { margin:4px 0 0; color:var(--muted,#c0b4c5); font-size:.76rem; line-height:1.5; }
.abuse-badge { flex:0 0 auto; display:inline-flex; align-items:center; border:1px solid currentColor; border-radius:999px; padding:4px 9px; font-size:.68rem; font-weight:750; white-space:nowrap; }
.abuse-badge.is-allow { color:#79d5ac; background:#79d5ac12; }
.abuse-badge.is-block { color:#f193ad; background:#f193ad12; }
.abuse-badge.is-protected { color:#e8c47f; background:#e8c47f10; }
@media(max-width:600px){.abuse-field { gap:10px; }.abuse-field>input:not([type=checkbox]),.abuse-field>select{width:45%;}.abuse-field>span{font-size:.78rem;}}

/* Keep safety controls readable alongside shared community form styles. */
#abuse-workspace .abuse-field { display:flex; flex-direction:row; align-items:center; margin:0; }
#abuse-workspace .abuse-field>input[type=checkbox] { flex:0 0 20px; margin:0; }
@media(max-width:600px) {
 #abuse-workspace .abuse-field:not(:has(input[type=checkbox])) { flex-direction:column; align-items:stretch; }
 #abuse-workspace .abuse-field>input:not([type=checkbox]),#abuse-workspace .abuse-field>select { width:100%; max-width:none; }
 #abuse-workspace .abuse-field>span { flex:auto; }
 .abuse-flow { grid-template-columns:1fr; }
 .abuse-summary-row,.abuse-protected-row { align-items:flex-start; flex-direction:column; gap:8px; }
}
@media(min-width:601px) and (max-width:900px) { .abuse-flow { grid-template-columns:repeat(2,minmax(0,1fr)); } }
