@font-face {font-family:Poppins;font-style:normal;font-weight:400;font-display:optional;src:url("/fonts/poppins-400.ad5ac72fb1be.woff2") format("woff2");}
@font-face {font-family:Poppins;font-style:normal;font-weight:500;font-display:optional;src:url("/fonts/poppins-500.65bbc43da3eb.woff2") format("woff2");}
@font-face {font-family:Poppins;font-style:normal;font-weight:600;font-display:optional;src:url("/fonts/poppins-600.7154dd772bce.woff2") format("woff2");}
@font-face {font-family:Poppins;font-style:normal;font-weight:700;font-display:optional;src:url("/fonts/poppins-700.4c2ba400b8b8.woff2") format("woff2");}
* { box-sizing: border-box; }
[hidden] { display: none !important; }
:root { font-family: Poppins, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; color: #f4f6fa; background: #0b1016; font-synthesis: none; }
body { margin: 0; min-width: 280px; }
main { min-height: 100svh; display: grid; place-items: center; padding: 32px 20px; background: radial-gradient(ellipse at 50% 48%, #141e2a55, transparent 66%); }
.card { width: min(100%, 610px); padding: 42px 40px 34px; border: 1px solid #344354; border-radius: 14px; background: linear-gradient(120deg, #141d27, #121922); box-shadow: 0 20px 80px #0002; }
h1 { text-align: center; font-size: clamp(26px, 4vw, 36px); letter-spacing: -.9px; margin: 0 0 34px; font-weight: 700; }
.field { margin-bottom: 23px; }
.field > label { display: block; margin-bottom: 9px; font-size: 17px; font-weight: 500; }
input:not([type="checkbox"]), select { width: 100%; height: 54px; padding: 0 16px; border: 1px solid #3a4a5e; border-radius: 9px; background: #1a2430; color: #f4f6fa; font: inherit; font-size: 17px; }
input::placeholder { color: #a3adbc; }
.hint { display: block; color: #8e9bad; font-size: 12px; margin-top: 7px; }
select { appearance: none; padding-right: 45px; cursor: pointer; }
select:invalid { color: #a3adbc; }
select option { color: #f4f6fa; }
.select-wrap { position: relative; }
.select-wrap::after { content: ""; position: absolute; right: 20px; top: 21px; width: 10px; height: 10px; border-bottom: 2px solid #e3e9f0; border-right: 2px solid #e3e9f0; transform: rotate(45deg); pointer-events: none; }
.gender-field { margin-bottom: 26px; }
.consents { display: grid; gap: 13px; margin-bottom: 28px; }
.check { display: flex; align-items: center; gap: 14px; font-size: 16px; line-height: 1.5; }
.check label, label.check { cursor: pointer; }
input[type="checkbox"] { appearance: none; flex: 0 0 23px; width: 23px; height: 23px; margin: 0; border: 2px solid #d9e1ec; border-radius: 4px; background: #161e28; cursor: pointer; display: grid; place-items: center; }
input[type="checkbox"]:checked { background: #0878ff; border-color: #0878ff; }
input[type="checkbox"]:checked::after { content: ""; width: 6px; height: 11px; border: solid white; border-width: 0 2px 2px 0; transform: translateY(-1px) rotate(45deg); }
.text-link { display: inline; padding: 0; border: 0; background: none; color: #3295ff; text-decoration: underline; text-underline-offset: 3px; font: inherit; cursor: pointer; }
.continue { width: 100%; min-height: 58px; padding: 14px; border: 1px solid #1885ff; border-radius: 9px; background: #0878ff; color: white; font: inherit; font-size: 20px; font-weight: 650; cursor: pointer; transition: background .15s, transform .15s; }
.continue:hover { background: #2088ff; }
.continue:active { transform: translateY(1px); }
:focus-visible { outline: 3px solid #72b6ff; outline-offset: 4px; }
#status { font-size: 14px; line-height: 1.6; color: #b8d8ff; margin: 18px 0 0; }
dialog { width: min(90vw, 520px); max-height: 85svh; padding: 28px; border: 1px solid #3a4a5e; border-radius: 14px; background: #151e29; color: #e5eaf2; line-height: 1.6; }
dialog::backdrop { background: #000b; backdrop-filter: blur(4px); }
dialog h2 { margin-top: 0; }
dialog li { margin-bottom: 10px; }
dialog .continue { font-size: 16px; min-height: 46px; }
.rooms-screen { width: min(100%, 740px); }
.rooms-screen h1 { margin-bottom: 12px; }
.welcome { text-align: center; color: #a3adbc; margin: 0 0 32px; line-height: 1.6; }
.rooms-grid { display: grid; grid-template-columns: 1fr; gap: 14px; }
.room-card { display: flex; align-items: center; gap: 16px; padding: 20px; border: 1px solid #344354; border-radius: 12px; background: #1a2430; }
.room-icon { display: inline-grid; place-items: center; width: 44px; height: 44px; border-radius: 12px; background: #0878ff22; color: #72b6ff; font-weight: 650; }
.room-card h2 { flex: 1; font-size: 20px; margin: 0; }
.room-card .continue { width: auto; padding: 12px 22px; font-size: 15px; min-height: 44px; }
.back-button { display: inline-flex; align-items: center; gap: 9px; margin: 0 0 26px; padding: 10px 16px; border: 1px solid #3a4a5e; border-radius: 8px; background: #1a2430; font: inherit; font-size: 14px; color: #e5eaf2; cursor: pointer; }
.back-button:hover { background: #253243; }
.back-button span { font-size: 20px; line-height: 1; }
.room-status { color: #b8d8ff; line-height: 1.6; font-size: 14px; }
@media (max-width: 440px) { .room-card { padding: 15px 12px; gap: 10px; } .room-icon { width: 34px; height: 34px; } .room-card h2 { font-size: 17px; } .room-card .continue { padding: 10px 12px; font-size: 13px; } }
@media (max-width: 520px) { .card { padding: 30px 22px; } h1 { margin-bottom: 30px; } .check { font-size: 14px; gap: 11px; } main { padding: 22px 16px; } }
body:has(.chat-screen:not([hidden])) main {display:none;}
.chat-screen {margin:24px auto;width:min(1200px,calc(100% - 40px));height:calc(100svh - 48px);border:1px solid #344354;border-radius:14px;background:#141d27;overflow:hidden;display:flex;flex-direction:column;}
.chat-header {display:flex;align-items:center;gap:24px;padding:18px 22px;border-bottom:1px solid #344354;}
.chat-header .back-button {margin:0;}
.chat-header h1 {font-size:22px;margin:0;flex:1;text-align:left;}
#connection-status {color:#93d7ad;font-size:13px;}
.chat-layout {display:grid;grid-template-columns:minmax(0,1fr) 240px;flex:1;min-height:0;}
.conversation {display:flex;flex-direction:column;min-width:0;min-height:0;}
#messages {flex:1;overflow-y:auto;padding:20px;overflow-wrap:anywhere;}
.message {padding:14px 0;border-bottom:1px solid #263342;}
.message strong {color:#72b6ff;font-size:14px;}
.message time {float:right;color:#8e9bad;font-size:12px;}
.message p {margin:7px 0 0;line-height:1.6;white-space:pre-wrap;}
.notice {font-size:12px;color:#94a3b8;text-align:center;padding:10px;}
#message-form {display:flex;gap:10px;padding:16px;border-top:1px solid #344354;}
#message-form .continue {width:85px;min-height:48px;font-size:16px;}
#message-input {height:48px;min-width:0;}
.users-panel {border-left:1px solid #344354;padding:22px 18px;overflow:auto;}
.users-panel h2 {font-size:16px;margin:0 0 24px;}
#users-list {list-style:none;padding:0;margin:0;}
#users-list li {display:flex;gap:10px;align-items:center;margin-bottom:20px;font-size:14px;overflow-wrap:anywhere;}
#users-list li::before {content:'';width:8px;height:8px;border-radius:50%;background:#46d787;flex-shrink:0;}
#chat-error {color:#ffc2bb;font-size:13px;padding:0 16px;}
button:disabled {opacity:.5;cursor:wait;}
@media(max-width:600px){.chat-screen{width:100%;height:100svh;margin:0;border-radius:0;}.chat-header{gap:10px;padding:12px;flex-wrap:wrap;}.chat-header h1{font-size:18px;}.chat-layout{grid-template-columns:minmax(0,1fr) 130px;}.users-panel{padding:18px 10px;}.users-panel h2{font-size:13px;}#users-list li{font-size:12px;}#messages{padding:12px;}#message-form{padding:10px;gap:6px;}#message-input{font-size:14px;}#message-form .continue{width:60px;}}
#users-list li::before {display:none;}
.user-avatar {position:relative;display:inline-grid;place-items:center;flex:0 0 34px;width:34px;height:34px;border:1px solid #355779;border-radius:9px;background:#203b56;color:#95cdff;font-size:15px;font-weight:700;}
.user-avatar::after {content:'';position:absolute;right:-3px;bottom:-3px;width:8px;height:8px;border:2px solid #141d27;border-radius:50%;background:#46d787;}
.user-name {min-width:0;overflow-wrap:anywhere;}
@media(max-width:600px){.user-avatar{flex-basis:28px;width:28px;height:28px;font-size:13px;}#users-list li{gap:8px;}}
.message {display:flex;align-items:flex-start;gap:12px;}
.message-content {flex:1;min-width:0;}
.message-avatar {margin-top:1px;}
.message-avatar::after {display:none;}
.user-avatar[role="button"] {cursor:pointer;transition:background .15s;}
.user-avatar[role="button"]:hover {background:#315779;}
.profile-sheet {position:fixed;inset:auto 0 0;margin:0 auto;width:min(100%,520px);max-width:100%;border-radius:20px 20px 0 0;padding:34px 28px 40px;text-align:center;box-shadow:0 -12px 60px #0005;}
.profile-sheet h2 {margin:18px 0 12px;font-size:24px;}
.profile-sheet p {color:#a3adbc;font-size:14px;}
.sheet-avatar {display:inline-grid;place-items:center;width:64px;height:64px;background:#203b56;border:1px solid #355779;border-radius:16px;color:#95cdff;font-size:28px;font-weight:700;}
.sheet-close {position:absolute;top:14px;right:16px;border:1px solid #344354;border-radius:8px;background:#1a2430;color:#dce6f2;width:34px;height:34px;font-size:24px;cursor:pointer;}
.chat-user-tile {display:flex;align-items:center;justify-content:space-between;gap:16px;width:100%;padding:18px 20px;margin-top:24px;border:1px solid #355779;border-radius:12px;background:#203b56;color:#e7f3ff;font:inherit;font-size:16px;cursor:pointer;}
.chat-user-tile:hover {background:#2b4c6b;}
.chat-user-tile > span:last-child {font-size:24px;color:#95cdff;}
.private-chat {width:min(94vw,640px);padding:0;overflow:hidden;}
.private-header {position:relative;display:flex;align-items:center;padding:20px;border-bottom:1px solid #344354;}
.private-header h2 {margin:0;padding-right:40px;font-size:20px;overflow-wrap:anywhere;}
.private-messages {height:min(45svh,340px);padding:20px;overflow:auto;}
.private-messages p {color:#94a3b8;font-size:13px;text-align:center;}
#private-message-form {display:flex;gap:10px;padding:16px;border-top:1px solid #344354;}
#private-message-form input {min-width:0;height:48px;}
#private-message-form .continue {width:80px;font-size:16px;min-height:48px;}
.user-avatar[data-gender="female"] {background:#4a263e;border-color:#804361;color:#ffc1df;}
.user-avatar[data-gender="female"]:hover {background:#62334f;}
.gender-filter {display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:5px;margin:-8px 0 22px;padding:4px;background:#0e1620;border:1px solid #2d3b4c;border-radius:9px;}
.gender-filter button {flex:1;min-width:0;min-height:32px;padding:4px;border:0;border-radius:6px;background:transparent;color:#a3adbc;font:inherit;font-size:17px;cursor:pointer;}
.gender-filter button:first-child {font-size:12px;}
.gender-filter button[aria-pressed="true"] {background:#2b3c50;color:#fff;}
.gender-filter button[data-filter="male"] {color:#95cdff;}
.gender-filter button[data-filter="female"] {color:#ffc1df;}
.gender-filter button[data-filter="female"][aria-pressed="true"] {background:#4a263e;}
.private-chat {width:min(94vw,740px);border-radius:18px;background:#101923;box-shadow:0 30px 100px #0009;}
.private-header {gap:14px;padding:20px 24px;background:#172330;}
.private-heading {min-width:0;flex:1;}
.private-header h2 {font-size:18px;margin:0 0 2px;}
.private-subtitle {font-size:12px;color:#90a2b7;}
.private-header .user-avatar {width:44px;height:44px;flex-basis:44px;font-size:20px;}
.private-header .user-avatar::after {display:none;}
.private-header .sheet-close {top:25px;right:20px;}
.private-messages {height:min(50svh,420px);display:grid;place-items:center;background:radial-gradient(ellipse at center,#20364b33,transparent 75%);}
.private-empty {text-align:center;padding:20px;max-width:360px;}
.empty-chat-icon {display:grid;place-items:center;margin:0 auto 22px;width:62px;height:62px;border:1px solid #355779;border-radius:19px;background:#203b56;color:#95cdff;font-size:28px;}
.private-empty h3 {font-size:20px;margin:0 0 10px;overflow-wrap:anywhere;}
.private-empty p {font-size:14px;line-height:1.7;margin:0 0 26px;}
.preview-note {display:block;font-size:11px;line-height:1.6;color:#7e91a6;}
#private-message-form {padding:18px;background:#172330;}
#private-message-form .continue {width:100px;font-size:14px;white-space:nowrap;}
#private-message-form .continue span {font-size:20px;margin-left:8px;}
#private-preview-status {padding:0 18px 14px;margin:0;color:#9cb3ca;font-size:12px;background:#172330;}
.sheet-avatar[data-gender="female"] {background:#4a263e;border-color:#804361;color:#ffc1df;}
.private-messages {display:flex;flex-direction:column;align-items:stretch;gap:12px;}
.private-messages > p {margin:auto;text-align:center;}
.private-bubble {align-self:flex-start;max-width:85%;padding:12px 15px;border:1px solid #34485e;border-radius:12px 12px 12px 3px;background:#203044;overflow-wrap:anywhere;}
.private-bubble.outgoing {align-self:flex-end;background:#1256a3;border-color:#266bb9;border-radius:12px 12px 3px 12px;}
.private-bubble p {margin:0 0 5px;color:#f1f5fa;text-align:left;white-space:pre-wrap;font-size:14px;line-height:1.6;}
.private-bubble time {display:block;text-align:right;font-size:10px;color:#afc4db;}
.sidebar-tabs {display:flex;gap:4px;padding:4px;margin-bottom:24px;background:#0e1620;border:1px solid #2d3b4c;border-radius:9px;}
.sidebar-tabs button {flex:1;padding:9px 3px;border:0;border-radius:6px;background:transparent;color:#a3adbc;font:inherit;font-size:13px;cursor:pointer;}
.sidebar-tabs button[aria-pressed="true"] {background:#2b3c50;color:#fff;}
#unread-total,.unread-badge {display:inline-grid;place-items:center;min-width:18px;height:18px;padding:0 4px;border-radius:9px;background:#0878ff;color:#fff;font-size:10px;}
.inbox-item {display:flex;align-items:center;gap:10px;width:100%;padding:13px 0;border:0;border-bottom:1px solid #2d3b4c;background:none;color:#eaf1fa;text-align:left;cursor:pointer;}
.inbox-item:hover {background:#203044;}
.inbox-item .user-avatar::after {display:none;}
.inbox-details {flex:1;min-width:0;display:grid;gap:5px;}
.inbox-details strong {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:13px;}
.inbox-details > span {overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:#94a3b8;font-size:11px;}
.inbox-empty {font-size:12px;color:#94a3b8;line-height:1.7;}
@media(max-width:600px){.sidebar-tabs button{font-size:11px;}.inbox-item{gap:6px;}.inbox-details strong{font-size:11px;}}
#entry-form .continue:disabled {background:#293543;border-color:#3a4656;color:#7f8b9b;opacity:1;cursor:not-allowed;transform:none;}
.legal-footer {display:flex;justify-content:center;gap:16px;flex-wrap:wrap;margin-top:24px;font-size:12px;}
.legal-footer a {color:#93a8bf;text-underline-offset:3px;}
.legal-main {display:block;min-height:100svh;padding:42px 20px;}
.legal-document {max-width:850px;margin:auto;background:#141d27;border:1px solid #344354;border-radius:14px;padding:40px;line-height:1.85;color:#c9d3df;}
.legal-document h1 {text-align:left;margin:8px 0 10px;font-size:34px;color:#f4f6fa;}
.legal-brand {color:#72b6ff;font-size:12px;letter-spacing:3px;font-weight:700;margin:0;}
.legal-meta {font-size:13px;color:#8e9bad;}
.legal-document nav {padding:16px 0 24px;border-bottom:1px solid #344354;font-size:14px;}
.legal-document h2 {font-size:21px;line-height:1.45;color:#f4f6fa;margin:34px 0 12px;}
.legal-document p {font-size:15px;overflow-wrap:anywhere;}
.legal-document a {color:#8ac2ff;text-underline-offset:3px;}
.legal-document .back-button {text-decoration:none;color:#e5eaf2;}
.legal-document footer {border-top:1px solid #344354;margin-top:34px;padding-top:22px;font-size:13px;overflow-wrap:anywhere;}
@media(max-width:600px){.legal-main{padding:18px 12px;}.legal-document{padding:24px 20px;}.legal-document h1{font-size:28px;}.legal-document h2{font-size:19px;}.legal-footer{gap:12px;}}
/* Compact consent labels while keeping checkbox targets unchanged. */
#entry-form .consents .check {font-size:13px;line-height:1.6;}
#entry-form .consents .check {color:#9aa7b8;}
#entry-form .consents .text-link {color:#aab8c9;}
/* Responsive mobile browser layout, including safe areas and keyboard resize. */
html,body {min-width:0;max-width:100%;}
body {overflow-x:clip;}
button,a,input,select {-webkit-tap-highlight-color:transparent;}
button {touch-action:manipulation;}
.mobile-controls {display:none;}
.mobile-sidebar:not([open]) {display:none;}
.drawer-header {display:flex;align-items:center;justify-content:space-between;gap:12px;padding:16px;border-bottom:1px solid #344354;}
.drawer-header h2 {margin:0;font-size:17px;}
.drawer-header button {width:44px;height:44px;flex-shrink:0;border:1px solid #344354;border-radius:9px;background:#203044;color:#eaf1fa;font:inherit;font-size:26px;cursor:pointer;}
.drawer-body {min-height:0;flex:1;overflow-y:auto;overscroll-behavior:contain;}
.users-panel {min-width:0;}
.message-content,.check>span {min-width:0;}
@media(max-width:800px),(max-width:1000px) and (max-height:500px){
 main {min-height:100svh;min-height:100dvh;padding:24px max(16px,env(safe-area-inset-right)) 24px max(16px,env(safe-area-inset-left));}
 .card {max-width:520px;padding:28px 22px;}
 .card h1 {font-size:clamp(24px,6.4vw,32px);letter-spacing:-.7px;}
 input:not([type="checkbox"]),select {font-size:16px;}
 .field>label {font-size:16px;}
 .check {align-items:flex-start;}
 input[type="checkbox"] {margin-top:2px;}
 .consents .check {min-height:32px;align-items:center;}
 .room-card .continue {min-height:44px;}
 body:has(.chat-screen:not([hidden])) {overflow:hidden;height:var(--app-height,100dvh);}
 .chat-screen {position:fixed;top:var(--viewport-top,0px);left:0;right:0;margin:0;width:100%;max-width:100%;height:100vh;height:var(--app-height,100dvh);border:0;border-radius:0;padding-top:env(safe-area-inset-top);}
 .chat-header {flex:none;display:grid;grid-template-columns:auto minmax(0,1fr) auto;gap:10px;align-items:center;padding:10px max(12px,env(safe-area-inset-right)) 10px max(12px,env(safe-area-inset-left));}
 .chat-header h1 {font-size:17px;line-height:1.3;text-align:center;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
 .chat-header .back-button {padding:8px 10px;min-height:44px;font-size:13px;}
 #connection-status {font-size:10px;max-width:90px;text-align:right;overflow-wrap:anywhere;}
 .mobile-controls {display:flex;gap:10px;flex:none;padding:8px max(12px,env(safe-area-inset-right)) 10px max(12px,env(safe-area-inset-left));border-bottom:1px solid #344354;}
 .mobile-controls button {display:flex;justify-content:center;align-items:center;gap:8px;flex:1;min-height:44px;border:1px solid #344354;border-radius:9px;background:#1c2a3a;color:#dce8f7;font:inherit;font-size:14px;cursor:pointer;}
 .chat-layout {display:flex;flex:1;min-height:0;min-width:0;}
 .conversation {flex:1;width:100%;max-width:100%;}
 #messages {padding:12px max(14px,env(safe-area-inset-right)) 12px max(14px,env(safe-area-inset-left));overscroll-behavior:contain;-webkit-overflow-scrolling:touch;}
 .message {gap:10px;padding:13px 0;}
 .message strong {font-size:13px;}
 .message time {font-size:10px;margin-left:8px;}
 .message p {font-size:14px;line-height:1.65;}
 .message-avatar {width:32px;height:32px;flex-basis:32px;font-size:14px;}
 #message-form {flex:none;align-items:center;gap:8px;padding:10px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));background:#172330;}
 #message-input {flex:1;width:0;height:46px;padding:0 12px;font-size:16px;}
 #message-form .continue {flex:0 0 64px;width:64px;min-height:46px;padding:10px 8px;font-size:14px;}
 #chat-error {flex:none;max-height:56px;overflow:auto;margin:0;padding:6px 12px;font-size:12px;}
 .mobile-sidebar {position:fixed;inset:var(--viewport-top,0px) 0 auto auto;margin:0;width:min(88vw,360px);max-width:100%;height:var(--app-height,100dvh);max-height:none;padding:env(safe-area-inset-top) 0 env(safe-area-inset-bottom);border:0;border-left:1px solid #344354;border-radius:0;background:#141d27;}
 .mobile-sidebar[open] {display:flex;flex-direction:column;}
 .mobile-sidebar::backdrop {background:#0009;backdrop-filter:blur(2px);}
 .drawer-body .users-panel {width:100%;border:0;padding:20px 16px;overflow:visible;}
 .drawer-body .sidebar-tabs button,.drawer-body .gender-filter button {min-height:44px;font-size:14px;}
 .drawer-body .users-panel h2 {font-size:16px;}
 .drawer-body #users-list li {font-size:14px;gap:12px;min-height:44px;margin-bottom:12px;}
 .drawer-body .user-avatar {width:36px;height:36px;flex-basis:36px;font-size:16px;}
 .drawer-body .inbox-item {min-height:64px;gap:12px;padding:12px 0;}
 .drawer-body .inbox-details strong {font-size:14px;}
 .drawer-body .inbox-details>span {font-size:12px;}
 .profile-sheet {max-height:var(--app-height,100dvh);overflow-y:auto;padding-bottom:max(28px,env(safe-area-inset-bottom));}
 .private-chat {position:fixed;inset:var(--viewport-top,0px) 0 auto;margin:0;width:100%;max-width:100%;height:var(--app-height,100dvh);max-height:none;border:0;border-radius:0;padding-top:env(safe-area-inset-top);}
 .private-chat[open] {display:flex;flex-direction:column;}
 .private-header {flex:none;min-height:76px;padding:12px 16px;gap:12px;}
 .private-header h2 {font-size:17px;}
 .private-header .sheet-close {position:static;width:44px;height:44px;flex-shrink:0;}
 .private-header .user-avatar {width:38px;height:38px;flex-basis:38px;font-size:18px;}
 .private-messages {flex:1;min-height:0;height:auto;padding:16px;overscroll-behavior:contain;}
 .private-bubble {max-width:88%;}
 #private-message-form {flex:none;gap:8px;padding:10px max(12px,env(safe-area-inset-right)) max(10px,env(safe-area-inset-bottom)) max(12px,env(safe-area-inset-left));}
 #private-message-form input {flex:1;width:0;font-size:16px;}
 #private-message-form .continue {flex:0 0 70px;width:70px;padding:8px;font-size:14px;}
 #private-message-form .continue span {display:none;}
 #private-preview-status {flex:none;max-height:60px;overflow:auto;}
 #terms-dialog {max-height:calc(var(--app-height,100dvh) - 32px);padding:24px 20px;overflow-y:auto;}
}
@media(max-width:360px){.card{padding:24px 18px;}main{padding:16px 12px;}.legal-footer{font-size:11px;gap:10px;}.chat-header{gap:6px;}.chat-header .back-button{padding:8px;font-size:12px;}#connection-status{max-width:80px;font-size:9px;}}
.gender-options {padding:0;border:0;min-width:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;}
.gender-options legend {padding:0;margin-bottom:9px;font-size:17px;font-weight:500;}
.gender-options > .gender-option {margin:0;display:flex;align-items:center;gap:13px;min-height:50px;padding:12px 16px;border:1px solid #3a4a5e;border-radius:9px;background:#1a2430;cursor:pointer;font-size:14px;transition:border-color .15s,background .15s;}
.gender-option:has(input:checked) {border-color:#3295ff;background:#1b324c;}
.gender-option:has(input:focus-visible) {outline:3px solid #72b6ff;outline-offset:3px;}
.gender-option input[type="radio"] {appearance:none;flex:0 0 18px;width:18px;height:18px;margin:0;padding:0;border:2px solid #8092a8;border-radius:50%;background:transparent;cursor:pointer;}
.gender-option input[type="radio"]:checked {border-color:#72b6ff;background:#72b6ff;box-shadow:inset 0 0 0 3px #1b324c;}
.gender-option input[type="radio"]:focus-visible {outline:none;}
@media(max-width:800px){.gender-options legend{font-size:16px;}.gender-option{min-height:48px;}}

@media(max-width:800px){.gender-options > .gender-option{gap:6px;padding:10px 7px;font-size:12px;line-height:1.35;min-width:0;}.gender-option input[type="radio"]{width:16px;height:16px;flex-basis:16px;}}
.gender-options > .gender-option:has(input[value="male"]:checked) {border-color:#70aaf0;background:#203952;}
.gender-options > .gender-option:has(input[value="female"]:checked) {border-color:#e6a1be;background:#422d40;}
.gender-option input[value="female"]:checked {border-color:#eda7c6;background:#eda7c6;box-shadow:inset 0 0 0 3px #422d40;}
#entry-form .consents .check > span {transition:color .15s ease,font-weight .15s ease;}
#entry-form .consents .check:has(input:checked) > span {color:#c3cfde;font-weight:500;}
#entry-form .consents .check:has(input:checked) .text-link {color:#c5d7ed;font-weight:500;}

@media(max-width:800px),(max-width:1000px) and (max-height:500px){
 html:has(.chat-screen:not([hidden])) {overflow:hidden;overscroll-behavior:none;}
 body:has(.chat-screen:not([hidden])) {height:100%;overscroll-behavior:none;}
 body:has(.chat-screen:not([hidden])) main {min-height:0;height:100%;padding:0;}
 .chat-screen,#messages,.private-messages {overflow-anchor:none;scroll-behavior:auto;}
}

.reply-action,.block-user {font:inherit;font-size:12px;color:#a9c9ef;background:#203044;border:1px solid #3a4a5e;border-radius:7px;padding:7px 11px;cursor:pointer;}
.block-user {margin-top:10px;color:#e6b3c2;}
.reply-quote {margin:10px 0;padding:7px 10px;border-left:3px solid #74a5d9;background:#1c2a39;color:#aebfd1;font-size:12px;overflow-wrap:anywhere;}
#reply-preview {flex:none;display:flex;align-items:center;justify-content:space-between;gap:10px;background:#203044;border-left:3px solid #74a5d9;padding:9px 12px;color:#bdcfe3;font-size:12px;}
#reply-preview[hidden] {display:none;}
#reply-preview span {min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
#cancel-reply {background:none;border:0;color:#cbd9ea;font-size:24px;cursor:pointer;min-width:36px;min-height:36px;}
#block-status {font-size:13px;color:#b9c8da;}

/* Message options share the existing user sheet. */
.message-content[role="button"] {cursor:pointer;border-radius:10px;padding:8px 10px;margin:-8px -10px;transition:background .15s;}
.message-content[role="button"]:hover {background:#1b2a39;}
.message-content[role="button"]:focus-visible {outline:2px solid #6baaf1;outline-offset:3px;}
.profile-sheet {background:#16222e;text-align:left;padding:32px 24px max(24px,env(safe-area-inset-bottom));}
.sheet-handle {position:absolute;top:12px;left:calc(50% - 22px);width:44px;height:5px;border-radius:6px;background:#3d4b5d;}
.sheet-person {display:flex;align-items:center;gap:16px;margin:8px 40px 22px 0;}
.profile-sheet .sheet-avatar {border-radius:50%;width:52px;height:52px;flex:0 0 52px;font-size:23px;}
.profile-sheet h2 {font-size:20px;margin:0;overflow-wrap:anywhere;}
.profile-sheet .sheet-close {background:transparent;border:0;top:22px;right:14px;}
.sheet-action {display:flex;align-items:center;gap:16px;width:100%;min-height:68px;padding:18px 8px;border:0;border-top:1px solid #334150;border-radius:0;background:transparent;color:#e1e9f3;text-align:left;font:inherit;font-size:15px;cursor:pointer;}
.sheet-action[hidden] {display:none;}
.sheet-action:hover {background:#203040;}
.sheet-action:focus-visible {outline:2px solid #6baaf1;outline-offset:-2px;}
.action-icon {font-size:26px;width:30px;flex:0 0 30px;text-align:center;}
.action-copy {display:grid;gap:6px;min-width:0;}
.action-copy strong {font-weight:500;}
#sheet-reply-preview {font-size:12px;line-height:1.5;color:#94a3b6;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;}
.action-chevron {margin-left:auto;font-size:26px;color:#95a7bc;}
.profile-sheet .block-user {color:#f18aa4;margin:0;padding-left:54px;position:relative;}
.profile-sheet .block-user::before {content:'⊘';position:absolute;left:11px;font-size:27px;}



.retention-summary {margin:20px 0;padding:14px 16px;border:1px solid #34485e;border-left:3px solid #76a6dc;border-radius:8px;background:#172330;color:#b8c6d8;font-size:13px;line-height:1.65;}
.retention-summary strong {color:#e0eaf6;font-size:14px;}
.retention-summary p {margin:6px 0 0;}
/* Shared color-theme controls. */
.theme-switch {display:inline-flex;flex:none;align-items:center;gap:2px;padding:3px;border:1px solid #41536c;border-radius:24px;background:#172538;vertical-align:middle;}
.theme-switch button {display:grid;place-items:center;width:34px;height:30px;border:0;border-radius:20px;background:transparent;color:#9eb0c9;font:inherit;font-size:21px;line-height:1;cursor:pointer;}
.theme-switch button[aria-pressed="true"] {background:#2b71f0;color:#fff;}
#rooms-screen>.theme-switch,.legal-document>.theme-switch {float:right;margin:0 0 14px 14px;}
.private-header .theme-switch {margin-right:34px;}
html[data-theme="light"] {background:#f5f7fb;color:#17263d;color-scheme:light;}
html[data-theme="light"] body {background:#f5f7fb;}
html[data-theme="light"] main {background:radial-gradient(ellipse at 25% 10%,#e6efff,transparent 65%),#f5f7fb;}
html[data-theme="light"] body:has(#entry-screen:not([hidden])) main {background:#f5f7fb;}
html[data-theme="light"] #entry-screen.landing {background:linear-gradient(120deg,#f8fbff,#f5f7fb);border-color:#dbe3ef;box-shadow:0 15px 50px #18365b0a;}
html[data-theme="light"] .home-header,html[data-theme="light"] .home-footer {background:#ffffffb0;border-color:#dce4ee;}
html[data-theme="light"] .home-brand,html[data-theme="light"] .home-footer strong,html[data-theme="light"] .home-guides h2,html[data-theme="light"] .home-entry h2,html[data-theme="light"] #title {color:#15253e;}
html[data-theme="light"] #title span {color:#2d6fe9;}
html[data-theme="light"] .home-main {background:radial-gradient(ellipse at 10% 0,#e8f0ff88,transparent 65%);}
html[data-theme="light"] .home-copy>p,html[data-theme="light"] .home-guides p,html[data-theme="light"] .home-header nav a,html[data-theme="light"] .home-footer a {color:#526782;}
html[data-theme="light"] .home-eyebrow {color:#506f9c!important;}
html[data-theme="light"] .home-entry,html[data-theme="light"] .home-guides article,html[data-theme="light"] .card,html[data-theme="light"] .legal-document {background:#fff;border-color:#dbe3ef;box-shadow:0 8px 30px #274b7410;color:#263a54;}
html[data-theme="light"] .guide-icon {background:#e9f0ff;color:#346ed4;}
html[data-theme="light"] .home-guides a,html[data-theme="light"] .seo-content a,html[data-theme="light"] .seo-links a,html[data-theme="light"] .legal-document a {color:#2464c9;}
html[data-theme="light"] #entry-screen .seo-content {background:#fff;color:#526782;border-color:#dce4ee;}
html[data-theme="light"] .seo-content h2,html[data-theme="light"] .seo-content summary,html[data-theme="light"] .legal-document h1,html[data-theme="light"] .legal-document h2 {color:#172b46;}
html[data-theme="light"] .seo-content details,html[data-theme="light"] .legal-document nav,html[data-theme="light"] .legal-document footer {border-color:#dce4ee;}
html[data-theme="light"] input:not([type="checkbox"]),html[data-theme="light"] select,html[data-theme="light"] .home-entry #username {background:#f7f9fc;color:#243954;border-color:#cbd7e6;}
html[data-theme="light"] input::placeholder {color:#6a7d94;}
html[data-theme="light"] .hint,html[data-theme="light"] .welcome,html[data-theme="light"] .legal-meta,html[data-theme="light"] .notice {color:#60738d;}
html[data-theme="light"] #entry-form .consents .check {color:#66768d;}
html[data-theme="light"] #entry-form .consents .text-link {color:#506e98;}
html[data-theme="light"] #entry-form .consents .check:has(input:checked)>span {color:#253f62;}
html[data-theme="light"] #entry-form .consents .check:has(input:checked) .text-link {color:#205bb5;}
html[data-theme="light"] input[type="checkbox"] {background:#fff;border-color:#8b9cb2;}
html[data-theme="light"] input[type="checkbox"]:checked {background:#2370ed;border-color:#2370ed;}
html[data-theme="light"] .gender-options>.gender-option {background:#fafcff;color:#344b68;border-color:#d4dfec;}
html[data-theme="light"] .gender-options>.gender-option:has(input:checked) {background:#e8f0ff;border-color:#6493e6;}
html[data-theme="light"] .gender-options>.gender-option:has(input[value="female"]:checked) {background:#fceaf2;border-color:#d78ead;}
html[data-theme="light"] .gender-option input[type="radio"] {background:transparent;border-color:#94a6bf;}
html[data-theme="light"] .gender-option input[type="radio"]:checked {background:#3375db;border-color:#3375db;box-shadow:inset 0 0 0 3px #e8f0ff;}
html[data-theme="light"] .gender-option input[value="female"]:checked {background:#bd5f89;border-color:#bd5f89;box-shadow:inset 0 0 0 3px #fceaf2;}
html[data-theme="light"] #entry-form .continue:disabled {background:#e2e8f1;color:#7b8ca3;border-color:#d7dfeb;}
html[data-theme="light"] .room-card,html[data-theme="light"] .back-button,html[data-theme="light"] .sheet-close,html[data-theme="light"] .mobile-controls button {background:#f0f4fa;color:#304c70;border-color:#d2deeb;}
html[data-theme="light"] .room-icon {background:#e6efff;color:#2664ca;}
html[data-theme="light"] .chat-screen,html[data-theme="light"] dialog,html[data-theme="light"] .mobile-sidebar {background:#fff;color:#243954;border-color:#d4dfeb;}
html[data-theme="light"] .chat-header,html[data-theme="light"] .users-panel,html[data-theme="light"] .mobile-controls,html[data-theme="light"] .drawer-header,html[data-theme="light"] #message-form,html[data-theme="light"] #private-message-form {border-color:#d9e2ee;}
html[data-theme="light"] .chat-header,html[data-theme="light"] .private-header,html[data-theme="light"] #message-form,html[data-theme="light"] #private-message-form,html[data-theme="light"] #private-preview-status {background:#f6f9fd;color:#526c89;}
html[data-theme="light"] .message {border-color:#e2e8f1;}
html[data-theme="light"] .message strong {color:#2c65b6;}
html[data-theme="light"] .message time,html[data-theme="light"] .private-subtitle,html[data-theme="light"] .inbox-empty,html[data-theme="light"] .inbox-details>span {color:#657991;}
html[data-theme="light"] #connection-status {color:#247546;}
html[data-theme="light"] .message-content[role="button"]:hover,html[data-theme="light"] .sheet-action:hover,html[data-theme="light"] .inbox-item:hover {background:#edf3fc;}
html[data-theme="light"] .user-avatar,html[data-theme="light"] .sheet-avatar,html[data-theme="light"] .empty-chat-icon {background:#e4efff;color:#2868bb;border-color:#b3cceb;}
html[data-theme="light"] .user-avatar[data-gender="female"],html[data-theme="light"] .sheet-avatar[data-gender="female"] {background:#f9e4ef;color:#a74876;border-color:#e5b2cb;}
html[data-theme="light"] .user-avatar::after {border-color:#fff;}
html[data-theme="light"] .sidebar-tabs,html[data-theme="light"] .gender-filter {background:#eef3fa;border-color:#d5e0ed;}
html[data-theme="light"] .sidebar-tabs button,html[data-theme="light"] .gender-filter button {color:#536c8c;}
html[data-theme="light"] .sidebar-tabs button[aria-pressed="true"],html[data-theme="light"] .gender-filter button[aria-pressed="true"] {background:#d7e6fc;color:#204e91;}
html[data-theme="light"] .gender-filter button[data-filter="female"] {color:#9d416e;}
html[data-theme="light"] .gender-filter button[data-filter="female"][aria-pressed="true"] {background:#f4dce9;}
html[data-theme="light"] .inbox-item {color:#263d5c;border-color:#dce4ee;}
html[data-theme="light"] .private-messages {background:#f9fbfe;}
html[data-theme="light"] .private-messages>p,html[data-theme="light"] .private-empty p {color:#657991;}
html[data-theme="light"] .private-bubble {background:#eaf0f8;border-color:#d4dfed;}
html[data-theme="light"] .private-bubble p {color:#263c59;}
html[data-theme="light"] .private-bubble time {color:#617893;}
html[data-theme="light"] .private-bubble.outgoing {background:#286bd2;border-color:#286bd2;}
html[data-theme="light"] .private-bubble.outgoing p {color:#fff;}
html[data-theme="light"] .private-bubble.outgoing time {color:#d9e7ff;}
html[data-theme="light"] .sheet-action {color:#2b4260;border-color:#dce4ee;}
html[data-theme="light"] #sheet-reply-preview,html[data-theme="light"] #block-status {color:#637991;}
html[data-theme="light"] .profile-sheet .block-user,html[data-theme="light"] .block-user {color:#b13e63;}
html[data-theme="light"] .reply-quote,html[data-theme="light"] #reply-preview,html[data-theme="light"] .retention-summary {background:#edf3fd;color:#4b6485;border-color:#a5bee1;}
html[data-theme="light"] #cancel-reply,html[data-theme="light"] .retention-summary strong {color:#24486d;}
html[data-theme="light"] #chat-error {color:#ac3445;}
html[data-theme="light"] .theme-switch {background:#edf2fa;border-color:#d0dced;}
html[data-theme="light"] .theme-switch button {color:#627b9b;}
html[data-theme="light"] .theme-switch button[aria-pressed="true"] {background:#2b71f0;color:#fff;}
html[data-theme="light"] .drawer-header button {background:#edf2fa;color:#3a5272;border-color:#d0dced;}
@media(max-width:800px),(max-width:1000px) and (max-height:500px){.chat-header{grid-template-columns:auto minmax(0,1fr) auto;gap:6px;}.chat-header #connection-status{grid-column:2;grid-row:2;text-align:center;max-width:none;}.chat-header>.theme-switch{grid-column:3;grid-row:1 / span 2;}.chat-header .back-button{grid-row:1 / span 2;}.theme-switch button{width:30px;height:30px;}.private-header .theme-switch{margin-right:0;}.private-header{gap:8px;}}
@media(max-width:400px){.private-header .theme-switch{padding:2px;}.private-header .theme-switch button{width:25px;height:28px;font-size:18px;}.private-header h2{font-size:15px;}}
html[data-theme="light"] .private-header {border-color:#d9e2ee;}
html[data-theme="light"] .block-user {background:#fff0f5;border-color:#e4c0ce;}
html[data-theme="light"] .profile-sheet .block-user {background:transparent;}
html[data-theme="light"] .room-status,html[data-theme="light"] #status {color:#326298;}

.continue.is-loading {display:flex;align-items:center;justify-content:center;gap:10px;cursor:progress;opacity:1;}
.continue.is-loading::before {content:'';display:inline-block;flex:0 0 16px;width:16px;height:16px;border:2px solid currentColor;border-right-color:transparent;border-radius:50%;animation:button-spin .75s linear infinite;}
@keyframes button-spin {to{transform:rotate(360deg);}}
@media(prefers-reduced-motion:reduce){.continue.is-loading::before{animation:none;border-style:dotted;}}

/* Public composer emoji picker: native Unicode, no external assets or requests. */
#message-form {position:relative;}
#emoji-toggle {display:grid;place-items:center;flex:0 0 42px;width:42px;height:46px;padding:0;border:1px solid #3a4a5e;border-radius:10px;background:#1a2430;color:#bed0e7;cursor:pointer;}
#emoji-toggle:hover,#emoji-toggle[aria-expanded="true"] {background:#29425e;color:#fff;border-color:#6baaf1;}
#emoji-picker {position:absolute;z-index:20;bottom:calc(100% + 6px);left:12px;width:min(304px,calc(100% - 24px));max-height:min(360px,55svh);overflow-y:auto;overscroll-behavior:contain;padding:12px;border:1px solid #42556e;border-radius:14px;background:#172330;color:#e6effb;box-shadow:0 10px 35px #0005;}
.emoji-picker-header {display:flex;align-items:center;justify-content:space-between;gap:8px;margin-bottom:8px;font-size:14px;font-weight:500;}
#emoji-close {width:30px;height:30px;border:0;border-radius:7px;background:transparent;color:inherit;font-size:24px;cursor:pointer;}
#emoji-grid {display:grid;grid-template-columns:repeat(6,minmax(0,1fr));gap:3px;}
#emoji-grid button {display:grid;place-items:center;min-width:0;min-height:39px;padding:4px;border:0;border-radius:8px;background:transparent;font-family:"Apple Color Emoji","Segoe UI Emoji","Noto Color Emoji",sans-serif;font-size:25px;cursor:pointer;}
#emoji-grid button:hover,#emoji-grid button:focus-visible,#emoji-close:hover {background:#2c435d;}
#emoji-toggle:focus-visible,#emoji-close:focus-visible,#emoji-grid button:focus-visible {outline:2px solid #6baaf1;outline-offset:1px;}
.emoji-picker-hint {font-size:11px;color:#a5b6cb;margin:10px 0 0;line-height:1.5;}
html[data-theme="light"] #emoji-toggle {background:#fff;border-color:#c9d6e7;color:#45617f;}
html[data-theme="light"] #emoji-toggle:hover,html[data-theme="light"] #emoji-toggle[aria-expanded="true"] {background:#e8f1ff;border-color:#628dd2;color:#255cae;}
html[data-theme="light"] #emoji-picker {background:#fff;border-color:#c7d6ea;color:#263f5f;box-shadow:0 10px 35px #1d385826;}
html[data-theme="light"] #emoji-grid button:hover,html[data-theme="light"] #emoji-grid button:focus-visible,html[data-theme="light"] #emoji-close:hover {background:#e8f1ff;}
html[data-theme="light"] .emoji-picker-hint {color:#627893;}
@media(max-width:400px){#emoji-toggle {flex-basis:36px;width:36px;}#emoji-grid button {font-size:23px;}}
/* Rounded chat treatment matching the approved desktop/mobile concept. */
.chat-screen {border-radius:18px;background:linear-gradient(125deg,#121e2d,#101925);border-color:#344a65;box-shadow:0 18px 70px #0002;}
.chat-header {display:grid;grid-template-columns:minmax(120px,1fr) minmax(0,2fr) minmax(120px,1fr);grid-template-rows:auto auto;column-gap:16px;row-gap:3px;padding:16px 22px;background:#14213288;}
.chat-header .back-button {grid-column:1;grid-row:1 / 3;justify-self:start;background:transparent;border-color:transparent;color:#9cc9ff;border-radius:24px;}
.chat-header h1 {grid-column:2;grid-row:1;text-align:center;font-size:21px;line-height:1.3;}
.chat-header #connection-status {grid-column:2;grid-row:2;max-width:none;text-align:center;font-size:12px;}
.chat-header>.theme-switch {grid-column:3;grid-row:1 / 3;justify-self:end;}
.chat-layout {grid-template-columns:minmax(0,1fr) 260px;}
.user-avatar,.sheet-avatar,.private-header .user-avatar {border-radius:50%;}
.user-avatar {width:42px;height:42px;flex-basis:42px;font-size:18px;background:linear-gradient(140deg,#489cff,#2865ce);border-color:#528de4;color:#fff;}
.user-avatar[data-gender="female"],.sheet-avatar[data-gender="female"] {background:linear-gradient(140deg,#db8db0,#b85b88);border-color:#d68eae;color:#fff1f8;}
.user-avatar[role="button"]:hover {filter:brightness(1.12);}
.message {gap:16px;padding:16px 0;border-bottom-color:transparent;}
.message-content[role="button"] {padding:8px 10px;border-radius:12px;}
.message p {margin-top:5px;font-size:14px;line-height:1.7;}
.message strong {font-weight:600;color:#6eafff;}
.message:has(.message-avatar[data-gender="female"]) strong {color:#e198ba;}
.message time {font-size:11px;color:#91a3bb;}
.users-panel {padding:20px;background:#12203344;}
.sidebar-tabs {padding:0 0 1px;gap:16px;border:0;border-bottom:1px solid #2d4058;border-radius:0;background:transparent;margin-bottom:22px;}
.sidebar-tabs button {position:relative;padding:10px 6px;border-radius:0;font-size:14px;}
.sidebar-tabs button[aria-pressed="true"] {background:transparent;color:#81b9ff;}
.sidebar-tabs button[aria-pressed="true"]::after {content:'';position:absolute;bottom:-2px;left:0;right:0;height:3px;background:#559df9;border-radius:3px;}
.gender-filter {gap:6px;padding:0;border:0;background:transparent;}
.gender-filter button {border:1px solid #34465f;border-radius:24px;min-height:34px;background:#1b293b;font-size:17px;}
.gender-filter button[aria-pressed="true"] {background:#2160ba;border-color:#5b9bed;color:#fff;}
.gender-filter button[data-filter="female"][aria-pressed="true"] {background:#68405b;border-color:#be81a4;}
#users-list li {gap:12px;margin-bottom:15px;}
#users-list li>.user-avatar::after {display:none;}
#users-list li::after {content:'';width:7px;height:7px;flex:0 0 7px;margin-left:auto;border-radius:50%;background:#62d49a;}
#message-form {margin:10px 16px 16px;padding:7px;gap:9px;border:1px solid #344960;border-radius:16px;background:#1a293b;align-items:center;}
#message-input {border:0;border-radius:10px;background:transparent;box-shadow:none;}
#message-input:focus-visible {outline:2px solid #6baaf1;outline-offset:0;}
#emoji-toggle {border:0;border-radius:50%;background:transparent;color:#b8cbe4;width:40px;flex-basis:40px;}
#message-form .continue {border-radius:12px;min-height:42px;font-size:14px;background:linear-gradient(120deg,#3487ff,#1763e6);}
.private-chat {border-radius:20px;}
.private-bubble {border-radius:16px 16px 16px 4px;}
.private-bubble.outgoing {border-radius:16px 16px 4px 16px;}
#private-message-form input {border-radius:14px;}
#private-message-form .continue {border-radius:12px;}
html[data-theme="light"] .chat-header {background:#f6f9ff;}
html[data-theme="light"] .chat-header .back-button {background:transparent;border-color:transparent;color:#2a66bb;}
html[data-theme="light"] .users-panel {background:#f8faff;}
html[data-theme="light"] .user-avatar {background:linear-gradient(140deg,#4d98f4,#2f6ac9);color:#fff;border-color:#5c94e1;}
html[data-theme="light"] .user-avatar[data-gender="female"],html[data-theme="light"] .sheet-avatar[data-gender="female"] {background:linear-gradient(140deg,#e29ab9,#bc648c);color:#fff;border-color:#cf8aaa;}
html[data-theme="light"] .message:has(.message-avatar[data-gender="female"]) strong {color:#a54273;}
html[data-theme="light"] .sidebar-tabs {background:transparent;border-color:#d5dfeb;}
html[data-theme="light"] .sidebar-tabs button[aria-pressed="true"] {background:transparent;color:#2864b9;}
html[data-theme="light"] .gender-filter {background:transparent;border:0;}
html[data-theme="light"] .gender-filter button {background:#edf3fc;border-color:#d1deed;}
html[data-theme="light"] .gender-filter button[aria-pressed="true"] {background:#2b6ccb;color:#fff;border-color:#2b6ccb;}
html[data-theme="light"] .gender-filter button[data-filter="female"][aria-pressed="true"] {background:#f4dce9;color:#9d416e;border-color:#d9a7c0;}
html[data-theme="light"] #message-form {background:#f2f6fc;border-color:#ccdaec;}
html[data-theme="light"] #message-input,html[data-theme="light"] #emoji-toggle {background:transparent;border:0;}
@media(max-width:800px),(max-width:1000px) and (max-height:500px){
 .chat-screen {border-radius:0;box-shadow:none;}
 .chat-header {grid-template-columns:auto minmax(0,1fr) auto;padding:10px 12px;gap:3px 8px;}
 .chat-header h1 {font-size:17px;}.chat-header #connection-status{font-size:10px;}
 .chat-header .back-button{padding:8px 5px;}
 .chat-layout {display:flex;}
 .user-avatar {width:36px;height:36px;flex-basis:36px;font-size:16px;}
 .message {gap:12px;padding:14px 0;}.message p{font-size:14px;}
 #message-form {margin:6px 10px max(10px,env(safe-area-inset-bottom));padding:6px;gap:6px;border-radius:15px;}
 #message-form .continue {min-height:42px;width:62px;flex-basis:62px;}
 #message-input {height:42px;padding:0 8px;}
 #emoji-toggle {width:34px;flex-basis:34px;height:40px;}
 .private-chat {border-radius:0;}
 .users-panel {background:transparent;}
}
/* Subtle separators between public messages in both themes. */
#messages .message {border-bottom:1px solid #ffffff0d;}
html[data-theme="light"] #messages .message {border-bottom-color:#223d6014;}

/* Join/leave activity is shown by the roster, not public chat notices. */
#messages .notice {display:none;}

.own-profile {display:flex;align-items:center;gap:13px;min-width:0;margin:0 0 18px;padding:16px 13px;border:1px solid #344960;border-radius:13px;background:linear-gradient(120deg,#1b2a3d,#182332);}
.own-profile>.user-avatar {width:48px;height:48px;flex-basis:48px;font-size:22px;}
.own-profile>.user-avatar::after {display:none;}
.own-profile-details {display:grid;gap:3px;min-width:0;}
.own-profile-label {color:#95a7bf;font-size:9px;letter-spacing:1.1px;text-transform:uppercase;}
#own-profile-name {font-size:15px;font-weight:600;color:#edf3fd;overflow-wrap:anywhere;line-height:1.45;}
#own-profile-gender {color:#b2c1d6;font-size:11px;line-height:1.6;}
html[data-theme="light"] .own-profile {background:linear-gradient(120deg,#fff,#eef4fe);border-color:#d0deef;}
html[data-theme="light"] .own-profile-label {color:#637b98;}
html[data-theme="light"] #own-profile-name {color:#203853;}
html[data-theme="light"] #own-profile-gender {color:#536c8b;}

/* Room availability */
.room-details {flex:1;min-width:0;}
.room-unavailable {margin:5px 0 0;color:#97a8bc;font-size:12px;line-height:1.4;}
html[data-theme="light"] .room-unavailable {color:#63748a;}

.private-gif-picker:not([hidden]) {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;padding:12px;max-height:190px;overflow:auto;background:#172330;border-top:1px solid #344354;}
.private-gif-picker button {padding:4px;border:1px solid #34485e;border-radius:10px;background:transparent;cursor:pointer;}
.private-gif-picker img {width:100%;height:70px;object-fit:contain;display:block;}
.private-gif {display:block;width:200px;max-width:100%;height:auto;border-radius:10px;}
.private-gif-toggle {flex:0 0 42px;padding:0;border:1px solid #526a83;border-radius:10px;background:transparent;color:inherit;font-size:12px;font-weight:700;cursor:pointer;}
.private-gif-toggle:disabled {opacity:.45;cursor:default;}
html[data-theme="light"] .private-gif-picker {background:#f6f9fd;border-color:#d9e2ee;}
@media(prefers-reduced-motion:reduce){.private-gif-picker img{visibility:hidden;}.private-gif-picker button::after{content:attr(aria-label);font-size:12px;color:inherit;}}

/* Searchable private GIF tray */
.gif-search-panel[hidden]{display:none!important;}
.gif-search-panel{flex:none;padding:14px 16px 10px;background:#172330;border-top:1px solid #34485e;color:#edf4ff;}
.gif-search-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;font-size:16px;}
.gif-search-close{border:0;background:transparent;color:inherit;font-size:25px;cursor:pointer;}
.gif-search-field{display:flex;gap:8px;align-items:center;border:1px solid #42566d;border-radius:24px;padding:0 12px;background:#101d2b;}
.gif-search-field input{min-width:0;width:100%;height:40px;border:0;background:transparent;border-radius:24px;color:inherit;font-size:14px;}
.gif-search-field span{font-size:24px;color:#97b4d5;}
.gif-search-categories{display:flex;gap:7px;overflow-x:auto;padding:10px 0;scrollbar-width:thin;}
.gif-search-categories button{flex:none;padding:6px 12px;border:1px solid #42566d;border-radius:20px;background:transparent;color:inherit;font-size:12px;cursor:pointer;}
.gif-search-categories button[aria-pressed=true]{background:#286bd2;border-color:#286bd2;color:#fff;}
.gif-search-content{max-height:min(36svh,290px);min-height:150px;overflow:auto;overscroll-behavior:contain;}
.gif-search-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;}
.gif-search-result{padding:0;border:0;border-radius:9px;background:#25364b;overflow:hidden;cursor:pointer;min-height:80px;}
.gif-search-result img{display:block;width:100%;height:95px;object-fit:cover;}
.gif-search-status{font-size:13px;line-height:1.7;text-align:center;color:#a4b9cf;margin:20px 12px;}
.gif-search-panel footer{display:flex;align-items:center;justify-content:space-between;padding-top:9px;font-size:10px;font-weight:600;color:#99abc2;}
.gif-search-retry,.gif-search-more{background:transparent;border:0;color:#78b7ff;font-size:12px;cursor:pointer;padding:5px;}
.private-chat:has(.gif-search-panel:not([hidden])) .private-messages{height:min(23svh,170px);min-height:80px;}
html[data-theme=light] .gif-search-panel{background:#f2f6fb;border-color:#d4dfed;color:#243b57;}
html[data-theme=light] .gif-search-field{background:#fff;border-color:#d4dfed;}
html[data-theme=light] .gif-search-categories button{border-color:#d4dfed;}
html[data-theme=light] .gif-search-status,html[data-theme=light] .gif-search-panel footer{color:#657991;}
html[data-theme=light] .gif-search-retry,html[data-theme=light] .gif-search-more{color:#286bd2;}
@media(max-width:600px){.gif-search-panel{padding:12px;}.gif-search-grid{grid-template-columns:repeat(2,minmax(0,1fr));}.gif-search-content{max-height:min(32svh,270px);min-height:120px;}.gif-search-result img{height:90px;}}

/* Couples identity: shared styling across room, profile and private chat. */
.gender-options > .gender-option:has(input[value="couples"]:checked) {border-color:#b29aef;background:#352b4e;}
.gender-option input[value="couples"]:checked {border-color:#c6b0ff;background:#c6b0ff;box-shadow:inset 0 0 0 3px #352b4e;}
.user-avatar[data-gender="couples"],.sheet-avatar[data-gender="couples"] {background:linear-gradient(140deg,#a18bd7,#7053ab);border-color:#b29aef;color:#fff;}
.user-avatar[data-gender="couples"]:hover {background:#8061bb;}
.message:has(.message-avatar[data-gender="couples"]) strong {color:#c6b0ff;}
.gender-filter button[data-filter="couples"] {font-size:12px;color:#c6b0ff;}
.gender-filter button[data-filter="couples"][aria-pressed="true"] {background:#493968;border-color:#b29aef;color:#fff;}
html[data-theme="light"] .gender-options>.gender-option:has(input[value="couples"]:checked) {background:#efe8fb;border-color:#9772ce;}
html[data-theme="light"] .gender-option input[value="couples"]:checked {background:#8053b9;border-color:#8053b9;box-shadow:inset 0 0 0 3px #efe8fb;}
html[data-theme="light"] .user-avatar[data-gender="couples"],html[data-theme="light"] .sheet-avatar[data-gender="couples"] {background:linear-gradient(140deg,#a18bd7,#7053ab);border-color:#9772ce;color:#fff;}
html[data-theme="light"] .message:has(.message-avatar[data-gender="couples"]) strong {color:#7543a8;}
html[data-theme="light"] .gender-filter button[data-filter="couples"] {color:#7543a8;}
html[data-theme="light"] .gender-filter button[data-filter="couples"][aria-pressed="true"] {background:#e9ddf7;border-color:#b398d5;color:#633391;}

/* Keep online filters in two rows at every viewport width. */
.gender-filter {width:100%;min-width:0;box-sizing:border-box;}
.gender-filter button {box-sizing:border-box;width:100%;max-width:100%;min-width:0;min-height:44px;padding:8px 10px;line-height:1.3;white-space:normal;overflow-wrap:anywhere;}

/* Public landing content stays inside the entry screen; chat layout is unchanged. */
.seo-brand {color:#9abcea;font-size:12px;font-weight:600;letter-spacing:2px;text-align:center;margin:0 0 14px;}
#entry-screen #title {font-size:clamp(25px,4vw,34px);line-height:1.3;margin-bottom:16px;}
.seo-intro {color:#aebed0;text-align:center;font-size:14px;line-height:1.75;margin:0 0 28px;}
.seo-content {border-top:1px solid #334150;margin-top:28px;padding-top:8px;color:#b7c4d3;font-size:14px;line-height:1.85;}
.seo-content h2 {font-size:19px;line-height:1.45;color:#edf3fb;margin:26px 0 10px;}
.seo-content p {margin:10px 0;}.seo-content ol {padding-left:23px;}.seo-content li {margin:9px 0;}
.seo-content a,.seo-links a {color:#a8ceff;text-underline-offset:3px;}
.seo-links {display:flex;gap:12px 22px;flex-wrap:wrap;margin:22px 0;}
.seo-content details {border-top:1px solid #334150;padding:14px 0;}.seo-content summary {cursor:pointer;color:#e2ebf7;font-weight:500;}.seo-content details p {padding-top:4px;}
.seo-content a:focus-visible,.seo-content summary:focus-visible {outline:2px solid #6baaf1;outline-offset:4px;}

body:has(#entry-screen:not([hidden])) main {padding:24px;display:block;background:radial-gradient(ellipse at 25% 12%,#162d4e88,transparent 60%),#0b131e;}
#entry-screen.landing {width:min(100%,1440px);margin:0 auto;border:1px solid #354c68;border-radius:18px;background:linear-gradient(135deg,#0d1929,#101c2a 65%,#101b29);overflow:hidden;box-shadow:0 20px 80px #0002;}
.home-header {display:flex;align-items:center;justify-content:space-between;gap:24px;padding:25px 48px;border-bottom:1px solid #2c3e54;background:#0c1726aa;}
.home-brand {display:flex;align-items:center;gap:12px;color:#eef3fc;text-decoration:none;font-size:27px;font-weight:600;letter-spacing:-.6px;}
.home-header nav,.home-footer nav {display:flex;gap:28px;align-items:center;}
.home-header nav a,.home-footer a {color:#c4cfe0;text-decoration:none;font-size:13px;}
.home-header a:hover,.home-footer a:hover {color:#8dbaff;}
.home-main {padding:36px 48px 24px;background:radial-gradient(ellipse at 0 0,#203f7244,transparent 70%);}
.home-hero {display:grid;grid-template-columns:minmax(0,1.5fr) minmax(340px,1fr);gap:60px;align-items:center;}
.home-eyebrow {font-size:11px!important;letter-spacing:2px;color:#91b3df!important;margin-bottom:18px!important;}
#entry-screen #title {font-size:clamp(38px,4.4vw,62px);line-height:1.15;letter-spacing:-1.8px;text-align:left;margin:0 0 22px;}
#title span {color:#8bb4ff;}
.home-copy>p {font-size:17px;line-height:1.8;color:#b8c9e0;max-width:610px;margin:0;}
.home-entry {padding:25px;border:1px solid #2d4059;border-radius:14px;background:linear-gradient(125deg,#1b2a3d99,#131f2f);box-shadow:0 12px 40px #0002;}
.home-entry h2 {font-size:22px;margin:0 0 18px;letter-spacing:-.4px;}
.home-entry .field {margin-bottom:16px;}.home-entry .field>label,.home-entry .gender-options legend {font-size:13px;}
.home-entry #username {height:46px;font-size:16px;background:#20304488;}
.home-entry .hint {font-size:10px;}
.home-entry .gender-options>.gender-option {padding:10px 7px;gap:6px;font-size:11px;min-height:42px;}
.home-entry .gender-option input {width:14px;height:14px;flex-basis:14px;}
.home-entry .consents {gap:10px;margin-bottom:18px;}
#entry-form .consents .check {font-size:11px;gap:9px;line-height:1.65;}
.home-entry input[type="checkbox"] {width:18px;height:18px;flex-basis:18px;border-width:1px;}
.home-entry .continue {font-size:15px;min-height:46px;background:linear-gradient(110deg,#3686fa,#2368ef);}
.home-entry .continue:disabled {background:#28384b;}
.home-guides {display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;margin-top:30px;}
.home-guides article {display:flex;gap:17px;padding:22px 18px;border:1px solid #2d4058;border-radius:12px;background:linear-gradient(120deg,#18283c,#13202f);}
.guide-icon {display:grid;place-items:center;width:50px;height:50px;flex:0 0 50px;border-radius:50%;background:#28477666;color:#87b8ff;font-size:25px;}
.home-guides h2 {font-size:15px;margin:0 0 7px;}.home-guides p {font-size:12px;line-height:1.75;color:#adbed6;margin:0 0 10px;}.home-guides a {color:#91beff;font-size:12px;font-weight:500;text-decoration:none;}
.home-ad {position:relative;display:grid;place-items:center;min-height:85px;margin-top:22px;border:1px dashed #6d829e;border-radius:8px;background:#34445b66;color:#95a9c5;}
.home-ad>span {position:absolute;top:10px;left:14px;font-size:10px;}.home-ad p {font-size:16px;margin:20px 0 0;}
.home-footer {display:flex;align-items:center;justify-content:space-between;padding:20px 48px;border-top:1px solid #283b52;}.home-footer strong {font-size:14px;color:#bfd3ed;}
#entry-screen .seo-content {margin:0;padding:10px 48px 32px;background:#0d1826;}.seo-content:target,#faq:target {scroll-margin-top:20px;}
@media(max-width:1000px){.home-header{padding:22px 28px;}.home-main{padding:28px;}.home-hero{gap:28px;grid-template-columns:minmax(0,1fr) minmax(330px,1fr);}#entry-screen #title{font-size:42px;}.home-guides article{display:block;}.guide-icon{margin-bottom:14px;}.home-footer{padding:20px 28px;}#entry-screen .seo-content{padding:10px 28px 28px;}}
@media(max-width:700px){body:has(#entry-screen:not([hidden])) main{padding:12px;}.home-header{padding:18px;gap:16px;flex-wrap:wrap;}.home-brand{font-size:23px;}.home-header nav{gap:20px;flex-wrap:wrap;}.home-header nav a{font-size:12px;}.home-main{padding:26px 18px 20px;}.home-hero{grid-template-columns:1fr;gap:26px;}#entry-screen #title{font-size:clamp(34px,8vw,46px);letter-spacing:-1.2px;}.home-copy>p{font-size:14px;}.home-entry{padding:21px 18px;}.home-entry h2{font-size:20px;}.home-entry .gender-options>.gender-option{font-size:11px;}.home-guides{grid-template-columns:1fr;gap:12px;}.home-guides article{display:flex;}.guide-icon{margin:0;}.home-guides h2{font-size:15px;}.home-guides p{font-size:13px;}.home-footer{padding:20px 18px;gap:14px;flex-wrap:wrap;}.home-footer nav{gap:18px;}#entry-screen .seo-content{padding:8px 18px 24px;}.home-ad{min-height:90px;}}

/* Reserve the theme control footprint before branding-cleanup.js mounts it. */
.home-header nav:not(:has(.theme-switch))::after {content:"";display:block;flex:0 0 78px;width:78px;height:38px;}
@media(max-width:800px){.home-header nav:not(:has(.theme-switch))::after{flex-basis:70px;width:70px;}}
