/* VOXGAB Patch 27 — premium chat shell. Legacy engine IDs are preserved underneath. */
html, body { height:100%; }
body { margin:0; overflow:hidden; background:#06111d !important; color:#e8f4ff; }
#external_wrap { height:100%; min-height:100%; overflow:hidden; }
.voxgab-dashboard { --vg-bg:#06111d; --vg-panel:rgba(7,25,41,.90); --vg-panel2:rgba(8,31,52,.78); --vg-line:rgba(71,165,255,.28); --vg-cyan:#20b9ff; --vg-blue:#1688ff; --vg-text:#f7fbff; --vg-muted:#8faac0; height:100vh; min-height:640px; background:radial-gradient(circle at 73% 14%, rgba(0,126,255,.12), transparent 28%), linear-gradient(135deg,#06111d 0%,#071a2a 52%,#04101c 100%); color:var(--vg-text); font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif; overflow:hidden; }
.voxgab-dashboard *, .voxgab-dashboard *::before, .voxgab-dashboard *::after { box-sizing:border-box; }
.voxgab-dashboard button, .voxgab-dashboard input { font:inherit; }
.voxgab-glass { background:linear-gradient(180deg,rgba(9,35,58,.94),rgba(6,25,42,.92)); border:1px solid var(--vg-line); box-shadow:inset 0 1px 0 rgba(255,255,255,.03),0 14px 36px rgba(0,0,0,.18); border-radius:16px; }
.voxgab-appbar { height:64px; display:grid; grid-template-columns:230px auto minmax(250px,420px) auto 190px; align-items:center; gap:20px; padding:0 28px; border-bottom:1px solid rgba(53,145,226,.22); background:rgba(3,16,27,.92); box-shadow:0 8px 30px rgba(0,0,0,.18); position:relative; z-index:40; }
.voxgab-app-logo { color:#fff; text-decoration:none; font-size:27px; font-weight:800; letter-spacing:-1.3px; white-space:nowrap; }
.voxgab-app-logo strong { color:#21b9ff; font-weight:800; }
.voxgab-topnav { display:flex; gap:8px; align-items:center; }
.voxgab-topnav-item { min-height:40px; padding:0 14px; border:1px solid transparent; border-radius:10px; background:transparent; color:#afc4d6; cursor:pointer; display:inline-flex; align-items:center; gap:8px; transition:.18s ease; }
.voxgab-topnav-item:hover { color:#fff; background:rgba(37,133,219,.10); }
.voxgab-topnav-item.is-active { color:#fff; border-color:rgba(39,171,255,.55); background:linear-gradient(180deg,rgba(22,136,255,.32),rgba(13,94,192,.27)); box-shadow:0 0 22px rgba(22,136,255,.22); }
.voxgab-top-search { height:40px; border:1px solid rgba(125,183,231,.28); border-radius:10px; background:rgba(6,24,39,.78); display:flex; align-items:center; gap:8px; padding:0 12px; position:relative; }
.voxgab-top-search > i { color:#86a4bc; }
.voxgab-top-search input { width:100%; border:0; outline:0; background:transparent; color:#eaf5ff; }
.voxgab-top-search input::placeholder { color:#6e899f; }
.voxgab-search-results { position:absolute; top:46px; left:0; right:0; padding:8px; border:1px solid var(--vg-line); border-radius:12px; background:#071b2c; box-shadow:0 18px 45px rgba(0,0,0,.38); z-index:90; }
.voxgab-search-result { width:100%; min-height:38px; padding:8px 10px; border:0; border-radius:8px; background:transparent; color:#dcecff; text-align:left; cursor:pointer; }
.voxgab-search-result:hover { background:rgba(25,151,245,.12); color:#fff; }
.voxgab-app-actions { display:flex; gap:10px; align-items:center; }
.voxgab-icon-button { width:40px; height:40px; border:1px solid rgba(127,180,225,.24); border-radius:10px; background:rgba(10,32,51,.68); color:#b9d8f1; cursor:pointer; position:relative; }
.voxgab-icon-button:hover { color:#fff; border-color:rgba(49,179,255,.56); box-shadow:0 0 18px rgba(32,185,255,.12); }
.voxgab-user-orb { width:42px; height:42px; padding:3px; border:1px solid rgba(49,179,255,.56); border-radius:50%; background:rgba(24,111,194,.15); overflow:hidden; cursor:pointer; }
.voxgab-user-orb img { width:100%; height:100%; object-fit:cover; border-radius:50%; }
.voxgab-mini-badge { position:absolute; min-width:18px; height:18px; line-height:18px; top:-5px; right:-6px; padding:0 5px; border-radius:999px; background:#e7355f; color:#fff; font-size:10px; font-weight:800; }
.voxgab-app-tagline { color:#8fc8ff; font-size:9px; letter-spacing:4px; line-height:1.8; text-align:right; white-space:nowrap; }
.voxgab-app-tagline span { color:#609ed4; }
.voxgab-workspace { height:calc(100vh - 64px); display:grid; grid-template-columns:280px minmax(0,1fr) 300px; gap:14px; padding:14px 18px 16px; overflow:hidden; }
.voxgab-left-rail, .voxgab-right-rail { min-height:0; overflow:auto; scrollbar-width:thin; scrollbar-color:rgba(41,162,242,.35) transparent; }
.voxgab-left-rail { display:flex; flex-direction:column; gap:10px; padding-right:2px; }
.voxgab-right-rail { display:flex; flex-direction:column; gap:12px; padding-left:2px; }
.voxgab-profile-card { padding:16px; }
.voxgab-profile-top { display:grid; grid-template-columns:58px 1fr 28px; gap:12px; align-items:center; }
.voxgab-profile-avatar { width:58px; height:58px; border-radius:50%; object-fit:cover; border:1px solid #1cbcff; box-shadow:0 0 24px rgba(28,188,255,.28); }
.voxgab-profile-copy strong { display:block; font-size:16px; }
.voxgab-profile-copy > span { display:block; margin-top:2px; color:#8da8be; font-size:12px; }
.voxgab-profile-copy small { display:block; margin-top:5px; color:#52df8f; font-size:11px; }
.voxgab-profile-copy small i { display:inline-block; width:7px; height:7px; margin-right:5px; border-radius:50%; background:#37df81; box-shadow:0 0 8px rgba(55,223,129,.55); }
.voxgab-profile-gear { align-self:start; width:28px; height:28px; border:0; background:transparent; color:#8ab8e2; cursor:pointer; }
.voxgab-profile-card blockquote { margin:14px 0 12px; color:#65baf5; font-size:12px; font-style:italic; line-height:1.35; }
.voxgab-outline-button { min-height:36px; padding:0 14px; border:1px solid rgba(56,184,255,.65); border-radius:8px; background:rgba(23,111,181,.10); color:#eef8ff; cursor:pointer; }
.voxgab-outline-button:hover { background:rgba(29,150,234,.17); box-shadow:0 0 18px rgba(32,185,255,.11); }
.voxgab-profile-card > .voxgab-outline-button { width:100%; }
.voxgab-side-nav { display:flex; flex-direction:column; gap:3px; padding:4px 0; }
.voxgab-side-link { width:100%; min-height:40px; padding:0 14px; display:grid; grid-template-columns:24px 1fr auto; align-items:center; gap:8px; border:0; border-left:3px solid transparent; border-radius:8px; background:transparent; color:#a9c1d5; text-align:left; text-decoration:none; cursor:pointer; }
.voxgab-side-link i { color:#78aee1; }
.voxgab-side-link:hover, .voxgab-side-link.is-active { color:#fff; background:linear-gradient(90deg,rgba(18,122,222,.26),rgba(13,61,99,.20)); border-left-color:#1ab7ff; box-shadow:0 0 18px rgba(28,169,255,.06); }
.voxgab-side-link b { min-width:20px; height:20px; line-height:20px; padding:0 6px; border-radius:999px; background:#cc3157; color:#fff; font-size:10px; text-align:center; }
.voxgab-rail-section { padding:14px; }
.voxgab-section-title { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:10px; }
.voxgab-section-title strong { font-size:13px; }
.voxgab-section-title button { padding:0; border:0; background:transparent; color:#3dc1ff; font-size:10px; cursor:pointer; }
.voxgab-friend-preview { display:flex; flex-direction:column; gap:5px; }
.voxgab-friend-row { width:100%; display:grid; grid-template-columns:34px 1fr 20px; gap:8px; align-items:center; padding:5px 2px; border:0; background:transparent; color:#dcecff; text-align:left; cursor:pointer; }
.voxgab-friend-row > span:nth-child(2) strong, .voxgab-friend-row > span:nth-child(2) small { display:block; }
.voxgab-friend-row > span:nth-child(2) strong { font-size:11px; font-weight:600; }
.voxgab-friend-row > span:nth-child(2) small { margin-top:2px; color:#43d987; font-size:9px; }
.voxgab-friend-row > i { color:#78b8ef; }
.voxgab-avatar-dot { position:relative; width:31px; height:31px; }
.voxgab-avatar-dot img { width:31px; height:31px; object-fit:cover; border-radius:50%; border:1px solid rgba(180,218,247,.7); }
.voxgab-avatar-dot i { position:absolute; width:8px; height:8px; right:-1px; bottom:1px; border:2px solid #07192a; border-radius:50%; background:#33dc73; }
.voxgab-trending-row { width:100%; min-height:26px; display:flex; align-items:center; justify-content:space-between; gap:8px; padding:2px 0; border:0; background:transparent; color:#b9cfe0; cursor:pointer; text-align:left; }
.voxgab-trending-row:hover { color:#fff; }
.voxgab-trending-row span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:11px; }
.voxgab-trending-row small { color:#7996ae; font-size:9px; white-space:nowrap; }
.voxgab-muted { color:#718da3; font-size:10px; line-height:1.4; }

.voxgab-chat-column { min-width:0; min-height:0; display:grid; grid-template-rows:auto auto minmax(0,1fr) auto; gap:10px; }
.voxgab-room-card { min-height:118px; padding:14px 16px; display:grid; grid-template-columns:86px minmax(0,1fr) auto; gap:16px; align-items:start; position:relative; overflow:hidden; }
.voxgab-room-card::after { content:""; position:absolute; width:180px; height:50px; right:-40px; bottom:-28px; border:1px solid rgba(20,158,255,.25); border-radius:50%; transform:rotate(-10deg); box-shadow:0 0 30px rgba(0,119,255,.18); pointer-events:none; }
.voxgab-room-visual { width:86px; height:86px; display:flex; align-items:center; justify-content:center; border:1px solid rgba(57,174,255,.35); border-radius:13px; background:radial-gradient(circle at 50% 30%,rgba(54,153,255,.45),rgba(9,42,69,.92) 62%); color:#7ad3ff; font-size:30px; box-shadow:inset 0 0 24px rgba(33,144,255,.15); }
.voxgab-room-titleline { display:flex; align-items:center; flex-wrap:wrap; gap:10px; }
.voxgab-room-titleline h1 { margin:0; font-size:27px; line-height:1; }
.voxgab-room-titleline > span { color:#a9c5dc; font-size:12px; }
.voxgab-room-heading > p { margin:6px 0 0; color:#9db6ca; font-size:12px; }
.voxgab-room-actions { display:flex; gap:8px; align-items:center; z-index:1; }
.voxgab-room-card #wrap_topic { margin-top:10px; }
.voxgab-room-card #room_topic { color:#aac0d2; font-size:11px; }
.voxgab-room-card #room_topic > .topic { color:#57c8ff !important; font-weight:700; }
.voxgab-room-card #menu_private { display:none !important; }
.voxgab-room-card #room_topic .voxgab-room-match-context { margin-top:8px; gap:5px; }
.voxgab-room-card #room_topic .voxgab-find-similar { min-height:28px; padding:4px 9px; }
.voxgab-room-card #room_topic .voxgab-interest-caption { min-width:64px; }
.voxgab-room-card #room_topic .voxgab-similar-inline { display:none; }
.voxgab-room-notice { min-height:38px; padding:0 14px; border:1px solid rgba(57,153,236,.28); border-radius:10px; display:flex; align-items:center; gap:10px; background:linear-gradient(90deg,rgba(12,85,149,.45),rgba(14,55,91,.52)); color:#c3daec; font-size:11px; }
.voxgab-room-notice i { color:#4dbdff; }
.voxgab-chat-stage { min-height:0 !important; height:auto !important; overflow:hidden !important; border:1px solid rgba(51,142,215,.24); border-radius:15px; background:linear-gradient(180deg,rgba(3,19,32,.92),rgba(4,17,29,.96)) !important; }
.voxgab-chat-stage #wrap_chat { height:100% !important; display:grid !important; grid-template-rows:minmax(0,1fr) auto; background:transparent !important; }
.voxgab-chat-stage #warp_show_chat { min-height:0 !important; height:auto !important; overflow:hidden !important; }
.voxgab-chat-stage #container_show_chat, .voxgab-chat-stage #inside_wrap_chat, .voxgab-chat-stage #show_chat { height:100% !important; min-height:0 !important; background:transparent !important; }
.voxgab-chat-stage #show_chat { padding:0 !important; border:0 !important; }
.voxgab-chat-stage #show_chat > ul { height:100% !important; padding:18px 16px 16px !important; overflow-y:auto !important; overflow-x:hidden !important; scrollbar-width:thin; scrollbar-color:rgba(46,157,237,.28) transparent; }
.voxgab-chat-stage .ch_logs { position:relative; display:flex !important; align-items:flex-start; gap:10px; width:100%; min-height:52px; margin:0 0 10px !important; padding:0 !important; background:transparent !important; border:0 !important; }
.voxgab-chat-stage .chat_avatar_wrap { width:38px !important; min-width:38px; height:38px !important; margin:2px 0 0 !important; float:none !important; }
.voxgab-chat-stage .avatar_chat { width:38px !important; height:38px !important; border-radius:50% !important; object-fit:cover; border:1px solid rgba(159,208,244,.68); }
.voxgab-chat-stage .my_text { float:none !important; width:auto !important; max-width:min(72%,650px); }
.voxgab-chat-stage .my_text p { position:relative; display:inline-block; min-width:120px; margin:0 !important; padding:22px 12px 10px !important; border:1px solid rgba(124,170,205,.15); border-radius:12px !important; background:#142a3e !important; color:#e7f1f8 !important; line-height:1.42; box-shadow:0 4px 18px rgba(0,0,0,.12); }
.voxgab-chat-stage .username { position:absolute; top:6px; left:12px; color:#f4f8fc !important; font-size:10px; font-weight:800; }
.voxgab-chat-stage .logs_date { position:absolute; top:6px; left:calc(100% + 8px); width:max-content; color:#6f8ba1 !important; font-size:8px !important; }
.voxgab-chat-stage .delete_log { opacity:.35; margin-left:7px; }
.voxgab-chat-stage .chat_video_wrap ~ .delete_log { opacity:1 !important; color:#dff4ff !important; font-weight:800; text-shadow:0 1px 3px rgba(0,0,0,.75); }
.voxgab-chat-stage .ch_logs.voxgab-own-message { flex-direction:row-reverse; }
.voxgab-chat-stage .ch_logs.voxgab-own-message .my_text { margin-left:auto; display:flex; justify-content:flex-end; }
.voxgab-chat-stage .ch_logs.voxgab-own-message .my_text p { background:linear-gradient(180deg,#0e72e7,#075fc5) !important; border-color:#1e9aff; box-shadow:0 0 18px rgba(17,134,255,.13); }
.voxgab-chat-stage .ch_logs.voxgab-own-message .username { left:auto; right:12px; }
.voxgab-chat-stage .ch_logs.voxgab-own-message .logs_date { left:auto; right:calc(100% + 8px); }
.voxgab-chat-stage .ch_logs.system { justify-content:center; min-height:34px; opacity:.75; }
.voxgab-chat-stage .ch_logs.system .chat_avatar_wrap { display:none !important; }
.voxgab-chat-stage .ch_logs.system .my_text { max-width:86%; }
.voxgab-chat-stage .ch_logs.system .my_text p { min-width:0; padding:7px 11px !important; border-style:dashed; background:rgba(40,87,119,.17) !important; font-size:10px; }
.voxgab-chat-stage .ch_logs.system .username { position:static; margin-right:4px; }
.voxgab-chat-stage #show_chat .chat_image { max-width:min(400px,100%) !important; border-radius:10px; }
.voxgab-chat-stage #top_chat_container { height:auto !important; min-height:64px; padding:9px 10px 10px; border-top:1px solid rgba(68,151,215,.18); background:rgba(5,20,32,.92) !important; }
.voxgab-chat-stage #container_input { height:auto !important; }
.voxgab-chat-stage #main_input, .voxgab-chat-stage #input_table, .voxgab-chat-stage #inside_group { width:100% !important; }
.voxgab-chat-stage #input_table, .voxgab-chat-stage #inside_group { height:44px !important; }
.voxgab-chat-stage #inside_group { border:1px solid rgba(104,161,204,.30) !important; border-radius:11px !important; background:rgba(8,29,46,.95) !important; overflow:hidden; }
.voxgab-chat-stage #td_input { background:transparent !important; }
.voxgab-chat-stage #content { height:42px !important; padding:0 12px !important; border:0 !important; background:transparent !important; color:#e7f4ff !important; box-shadow:none !important; }
.voxgab-chat-stage #content::placeholder { color:#7894a9; }
.voxgab-chat-stage #emo_item, .voxgab-chat-stage #send_image { width:42px !important; min-width:42px; height:42px !important; border:0 !important; background:transparent !important; color:#8ebce1 !important; text-align:center; }
.voxgab-chat-stage #submit_button { min-width:104px; height:44px !important; margin-left:8px; border:1px solid #25b4ff !important; border-radius:10px !important; background:linear-gradient(180deg,#179cff,#0879ec) !important; color:#fff !important; box-shadow:0 0 20px rgba(16,142,255,.22); font-weight:700; }
.voxgab-chat-utility { min-height:30px; padding:0 8px; display:flex; align-items:center; gap:14px; color:#7694aa; font-size:10px; }
.voxgab-chat-utility > span { margin-right:auto; }
.voxgab-chat-utility button { border:0; background:transparent; color:#91abc0; cursor:pointer; }
.voxgab-chat-utility button:hover { color:#fff; }

.voxgab-right-card { padding:16px; }
.voxgab-card-title { display:flex; align-items:flex-start; gap:10px; }
.voxgab-card-title > i { color:#39baff; font-size:22px; margin-top:2px; }
.voxgab-card-title h2 { margin:0; font-size:18px; line-height:1.1; }
.voxgab-card-title p { margin:4px 0 0; color:#91abc1; font-size:10px; line-height:1.4; }
.voxgab-mode-card { width:100%; min-height:84px; margin-top:14px; padding:12px; display:grid; grid-template-columns:48px 1fr 18px; gap:12px; align-items:center; border:1px solid rgba(92,150,197,.24); border-radius:13px; background:rgba(16,42,64,.78); color:#eaf5ff; text-align:left; }
button.voxgab-mode-card { cursor:pointer; }
.voxgab-mode-card.is-live { border-color:#17a9ff; background:linear-gradient(90deg,rgba(18,110,213,.42),rgba(9,62,120,.45)); box-shadow:0 0 22px rgba(20,147,255,.28), inset 0 0 18px rgba(20,145,255,.08); }
.voxgab-mode-card.is-soon { opacity:.67; }
.voxgab-mode-icon { width:48px; height:48px; display:flex; align-items:center; justify-content:center; border-radius:13px; background:rgba(75,153,226,.18); color:#8ed6ff; font-size:20px; }
.voxgab-mode-card strong, .voxgab-mode-card small { display:block; }
.voxgab-mode-card strong { font-size:14px; }
.voxgab-mode-card strong em { display:inline-block; margin-left:5px; padding:3px 6px; border-radius:999px; background:rgba(38,184,95,.18); color:#69e99a; font-size:9px; font-style:normal; }
.voxgab-mode-card.is-soon strong em { background:rgba(148,163,184,.14); color:#b7c4cf; }
.voxgab-mode-card small { margin-top:5px; color:#9bb4c8; font-size:10px; line-height:1.35; }
.voxgab-live-toggle { margin-left:auto; width:36px; height:20px; padding:2px; border-radius:999px; background:#138df5; box-shadow:0 0 12px rgba(19,141,245,.35); }
.voxgab-live-toggle i { display:block; width:16px; height:16px; margin-left:auto; border-radius:50%; background:#fff; }
.voxgab-right-interest-list { display:flex; flex-wrap:wrap; gap:7px; margin:15px 0 12px; }
.voxgab-right-interest-list span { padding:7px 10px; border:1px solid rgba(111,173,221,.27); border-radius:999px; background:rgba(42,86,119,.20); color:#c4d9e9; font-size:10px; }
.voxgab-right-interest-list .is-empty { color:#6f8ca2; }
.voxgab-right-actions { display:grid; grid-template-columns:1fr 1fr; gap:8px; }
.voxgab-right-actions button, .voxgab-safety-card > button { min-height:38px; border:1px solid rgba(49,177,255,.38); border-radius:9px; background:rgba(20,97,158,.13); color:#6dccff; cursor:pointer; font-size:10px; }
.voxgab-stat-grid { display:grid; grid-template-columns:repeat(3,1fr); gap:8px; margin-top:14px; }
.voxgab-stat-grid div { padding:10px 6px; border:1px solid rgba(81,150,203,.20); border-radius:10px; background:rgba(15,38,57,.52); text-align:center; }
.voxgab-stat-grid strong { display:block; color:#f7fbff; font-size:16px; }
.voxgab-stat-grid span { display:block; margin-top:3px; color:#7897ad; font-size:8px; }
.voxgab-safety-card > button { margin-top:13px; padding:0; border:0; background:transparent; text-align:left; }

/* Keep legacy panels functional as overlays, but visually align them to the new shell. */
#wrap_footer { display:none !important; }
.panels { z-index:120 !important; border-left:1px solid rgba(47,165,246,.28) !important; background:#071722 !important; box-shadow:none !important; }
.panels .top_option { background:#071722 !important; border-color:rgba(47,165,246,.18) !important; }
.panels .panel_element { background:#071722 !important; }
#matching_panel { width:350px !important; }
#private_panel { z-index:130 !important; }

@media (max-width: 1180px) {
    .voxgab-appbar { grid-template-columns:190px auto minmax(210px,1fr) auto; padding:0 18px; }
    .voxgab-app-tagline { display:none; }
    .voxgab-workspace { grid-template-columns:240px minmax(0,1fr) 270px; padding-left:12px; padding-right:12px; }
    .voxgab-profile-card blockquote, .voxgab-trending { display:none; }
    .voxgab-right-card { padding:13px; }
}

@media (max-width: 960px) {
    body, #external_wrap, .voxgab-dashboard { overflow:auto !important; }
    .voxgab-dashboard { min-height:100vh; height:auto; }
    .voxgab-appbar { position:sticky; top:0; grid-template-columns:150px 1fr auto; gap:10px; height:58px; padding:0 12px; }
    .voxgab-topnav { display:none; }
    .voxgab-top-search { max-width:none; }
    .voxgab-app-actions { justify-self:end; }
    .voxgab-workspace { height:auto; min-height:calc(100vh - 58px); grid-template-columns:1fr; gap:10px; padding:10px; overflow:visible; }
    .voxgab-left-rail, .voxgab-right-rail { overflow:visible; }
    .voxgab-left-rail { display:grid; grid-template-columns:1fr; }
    .voxgab-profile-card { display:none; }
    .voxgab-side-nav { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:5px; padding:0; }
    .voxgab-side-link { min-height:48px; grid-template-columns:1fr; justify-items:center; gap:2px; padding:5px; border-left:0; border-bottom:2px solid transparent; text-align:center; font-size:9px; }
    .voxgab-side-link i { font-size:16px; }
    .voxgab-side-link b { position:absolute; }
    .voxgab-rail-section { display:none; }
    .voxgab-chat-column { min-height:760px; grid-template-rows:auto auto minmax(560px,68vh) auto; }
    .voxgab-right-rail { display:grid; grid-template-columns:1fr 1fr; }
    .voxgab-live-stats, .voxgab-safety-card { display:none; }
    .voxgab-room-card { grid-template-columns:64px 1fr auto; min-height:100px; padding:12px; }
    .voxgab-room-visual { width:64px; height:64px; }
    .voxgab-room-titleline h1 { font-size:22px; }
}

@media (max-width: 660px) {
    .voxgab-appbar { grid-template-columns:120px 1fr auto; }
    .voxgab-app-logo { font-size:22px; }
    .voxgab-top-search { height:38px; }
    .voxgab-top-search input { min-width:0; }
    .voxgab-app-actions .voxgab-icon-button { display:none; }
    .voxgab-user-orb { width:38px; height:38px; }
    .voxgab-workspace { padding:8px; }
    .voxgab-side-nav { grid-template-columns:repeat(5,1fr); overflow-x:auto; }
    .voxgab-side-link span { display:none; }
    .voxgab-chat-column { min-height:700px; grid-template-rows:auto auto minmax(520px,70vh) auto; }
    .voxgab-room-card { grid-template-columns:1fr auto; }
    .voxgab-room-visual { display:none; }
    .voxgab-room-heading { min-width:0; }
    .voxgab-room-titleline { display:block; }
    .voxgab-room-titleline > span { display:block; margin-top:5px; }
    .voxgab-room-actions .voxgab-outline-button { display:none; }
    .voxgab-room-card #room_topic .voxgab-room-match-context { width:100%; }
    .voxgab-room-card #room_topic .voxgab-room-interest-wrap, .voxgab-room-card #room_topic .voxgab-user-interest-wrap { width:100%; }
    .voxgab-room-notice { font-size:9px; line-height:1.35; padding:8px 10px; }
    .voxgab-chat-stage .my_text { max-width:80%; }
    .voxgab-chat-stage #show_chat > ul { padding:12px 10px !important; }
    .voxgab-chat-stage #inputt_right { width:54px !important; }
    .voxgab-chat-stage #submit_button { min-width:50px; width:50px !important; font-size:0; }
    .voxgab-chat-stage #submit_button i { font-size:16px; }
    .voxgab-right-rail { grid-template-columns:1fr; }
    .voxgab-live-modes { display:none; }
    .voxgab-right-card { padding:12px; }
    .voxgab-right-actions { grid-template-columns:1fr; }
    .voxgab-chat-utility > span { display:none; }
    .voxgab-chat-utility { justify-content:flex-end; }
    #matching_panel { width:100% !important; max-width:100vw !important; }
}
/* Defeat legacy responsive geometry for the chat engine only inside the new shell. */
.voxgab-dashboard #container_chat.voxgab-chat-stage {
    width:100% !important;
    max-width:none !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
    clear:none !important;
    border-radius:15px !important;
}
.voxgab-dashboard #wrap_chat,
.voxgab-dashboard #warp_show_chat,
.voxgab-dashboard #container_show_chat,
.voxgab-dashboard #inside_wrap_chat,
.voxgab-dashboard #show_chat {
    width:100% !important;
    max-width:none !important;
    margin-left:0 !important;
    margin-right:0 !important;
    float:none !important;
}

/* VOXGAB Patch 28 — right rail fidelity + integrated admin control center. */
.voxgab-right-rail { gap:14px; }
.voxgab-right-card {
    padding:18px;
    border-radius:18px;
    background:
        radial-gradient(circle at 100% 0, rgba(18,125,255,.12), transparent 42%),
        linear-gradient(180deg,rgba(7,31,52,.96),rgba(5,23,39,.94));
    border-color:rgba(42,153,246,.32);
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035),0 0 22px rgba(20,147,255,.045);
}
.voxgab-card-title { gap:12px; align-items:center; }
.voxgab-card-title > i {
    flex:0 0 38px; width:38px; height:38px; margin:0;
    display:flex; align-items:center; justify-content:center;
    border-radius:12px; color:#65caff; font-size:20px;
    background:linear-gradient(180deg,rgba(31,143,239,.22),rgba(16,82,145,.16));
    border:1px solid rgba(62,177,255,.22);
    box-shadow:inset 0 0 18px rgba(30,150,255,.08);
}
.voxgab-card-title h2 { font-size:18px; letter-spacing:-.2px; }
.voxgab-card-title p { font-size:11px; }
.voxgab-mode-card { min-height:96px; padding:14px; border-radius:15px; }
.voxgab-mode-card.is-live { box-shadow:0 0 28px rgba(20,147,255,.30), inset 0 0 24px rgba(20,145,255,.10); }
.voxgab-mode-icon { width:52px; height:52px; border-radius:15px; }
.voxgab-right-interest-list span { padding:8px 12px; }
.voxgab-right-actions button { min-height:42px; }
.voxgab-stat-grid { gap:9px; margin-top:16px; }
.voxgab-stat-grid div {
    min-height:86px; padding:12px 6px 10px;
    display:grid; grid-template-columns:auto auto; align-content:center; justify-content:center; column-gap:6px;
    border-color:rgba(64,160,226,.24);
    background:linear-gradient(180deg,rgba(12,46,72,.76),rgba(8,30,49,.70));
}
.voxgab-stat-grid i { align-self:center; color:#55c1ff; font-size:16px; text-shadow:0 0 12px rgba(50,181,255,.35); }
.voxgab-stat-grid .voxgab-stat-online { color:#46e987; font-size:10px; text-shadow:0 0 10px rgba(70,233,135,.45); }
.voxgab-stat-grid strong { align-self:center; font-size:17px; line-height:1; }
.voxgab-stat-grid span { grid-column:1 / -1; margin-top:7px; font-size:9px; color:#8ca7bb; }
.voxgab-safety-card { margin-bottom:2px; }

/* Admin launcher mirrors the circular control language from the approved mockup. */
.voxgab-admin-launch { color:#7bcfff; }
.voxgab-admin-launch:hover { color:#fff; box-shadow:0 0 22px rgba(28,167,255,.22); }

/* Full admin dashboard sheet. Existing IDs and AJAX endpoints stay unchanged. */
#main_option.panelone {
    width:540px !important;
    max-width:calc(100vw - 24px) !important;
    margin-right:-540px !important;
    border-left:1px solid rgba(47,170,255,.34) !important;
    background:
        radial-gradient(circle at 100% 0,rgba(13,126,255,.14),transparent 30%),
        linear-gradient(180deg,#071b2d 0%,#051421 100%) !important;
    box-shadow:none !important;
    color:#eaf6ff !important;
    scrollbar-color:rgba(40,161,244,.42) transparent;
}
#main_option .top_option {
    width:calc(100% - 36px) !important;
    height:64px !important;
    margin:0 18px !important;
    padding:10px 0 !important;
    display:flex; align-items:center; justify-content:space-between;
    border-bottom:1px solid rgba(65,156,224,.18) !important;
    background:transparent !important;
}
#main_option .close_option { width:42px; height:42px; float:none; }
#main_option .top_icon_close {
    width:42px; height:42px; margin:0 !important; display:flex; align-items:center; justify-content:center;
    border:1px solid rgba(106,166,214,.22); border-radius:12px; color:#ddecf7; font-size:20px !important;
    background:rgba(10,40,63,.72); cursor:pointer;
}
#main_option .inner_top_option { float:none; height:auto; display:flex; gap:7px; }
#main_option .top_icon {
    width:42px; height:42px; margin:0 !important; display:flex; align-items:center; justify-content:center;
    border:1px solid rgba(74,154,217,.20); border-radius:12px; color:#83b9df; font-size:18px !important;
    background:rgba(9,34,55,.65); cursor:pointer; transition:.18s ease;
}
#main_option .top_icon:hover, #main_option .top_icon.voxgab-admin-active {
    color:#fff; border-color:rgba(37,177,255,.58); background:linear-gradient(180deg,rgba(20,135,232,.30),rgba(11,78,143,.28));
    box-shadow:0 0 20px rgba(21,145,244,.16);
}
#main_option .voxgab-admin-heading { padding:18px 24px 8px; }
#main_option .voxgab-admin-heading > span { color:#61c7ff; font-size:9px; font-weight:800; letter-spacing:3px; }
#main_option .voxgab-admin-heading h2 { margin:6px 0 4px; color:#fff; font-size:26px; line-height:1.05; letter-spacing:-.6px; }
#main_option .voxgab-admin-heading p { margin:0; color:#829eb3; font-size:11px; line-height:1.45; }
#main_option .panel_element { width:100% !important; margin:0 !important; padding:8px 24px 42px !important; background:transparent !important; cursor:default; }
#main_option #top_setting_option { display:grid; grid-template-columns:1fr 1fr; gap:8px; padding:0 0 18px !important; border-bottom:1px solid rgba(72,151,211,.16); }
#main_option #top_setting_option .setting_option_button,
#main_option #top_setting_option.voxgab-rbac-grid > .sub_button,
#main_option #admin_users_shortcut {
    width:100% !important; min-height:44px; margin:0 !important; float:none !important;
    border:1px solid rgba(78,153,211,.20) !important; border-radius:11px !important;
    background:rgba(17,48,72,.76) !important; color:#bcd2e3 !important; font-size:12px; font-weight:600;
}
#main_option #top_setting_option .selected_element,
#main_option #top_setting_option .setting_option_button:hover,
#main_option #top_setting_option.voxgab-rbac-grid > .sub_button:hover,
#main_option #admin_users_shortcut:hover {
    color:#fff !important; border-color:rgba(35,177,255,.54) !important;
    background:linear-gradient(180deg,rgba(19,142,236,.40),rgba(12,95,168,.34)) !important;
    box-shadow:0 0 18px rgba(25,157,248,.12);
}
#main_option #container_setting { padding-top:18px !important; }
#main_option .setting_part h3, #main_option .sub_color { color:#4bc8ff !important; font-size:20px; margin:0 0 14px; }
#main_option .small_text { color:#809db2 !important; line-height:1.45; }
#main_option input, #main_option select, #main_option textarea {
    min-height:40px; border:1px solid rgba(87,157,211,.22) !important; border-radius:9px !important;
    background:rgba(13,39,59,.88) !important; color:#eef8ff !important; outline:none;
}
#main_option textarea { min-height:92px; }
#main_option input:focus, #main_option select:focus, #main_option textarea:focus { border-color:rgba(41,182,255,.65) !important; box-shadow:0 0 0 2px rgba(35,165,246,.10); }
#main_option .sub_button, #main_option .full_button {
    min-height:42px; border:1px solid rgba(49,175,249,.34) !important; border-radius:10px !important;
    background:linear-gradient(180deg,rgba(20,108,176,.28),rgba(11,69,117,.24)) !important; color:#e8f6ff !important;
}
#main_option .sub_button:hover, #main_option .full_button:hover { border-color:#22b8ff !important; box-shadow:0 0 18px rgba(30,168,250,.14); }
#main_option .setting_message_zone, #main_option .option_setting, #main_option .container_element {
    border-color:rgba(69,143,198,.16) !important;
}
#main_option .container_element, #main_option .all_room {
    margin:6px 0; border:1px solid rgba(72,146,203,.16); border-radius:10px; background:rgba(12,37,57,.64) !important;
}
#main_option .clear_panel { height:24px; }

@media (max-width: 960px) {
    #main_option.panelone { width:min(540px,100vw) !important; max-width:100vw !important; margin-right:-100vw !important; }
}
@media (max-width: 660px) {
    #main_option.panelone { width:100% !important; max-width:100vw !important; margin-right:-100vw !important; }
    #main_option .top_option { width:calc(100% - 24px) !important; margin:0 12px !important; }
    #main_option .voxgab-admin-heading { padding:16px 16px 6px; }
    #main_option .panel_element { padding:8px 16px 32px !important; }
    #main_option #top_setting_option { grid-template-columns:1fr; }
    .voxgab-stat-grid div { min-height:78px; }
}

/* Patch 29 — narrower legacy sheets + VOXGAB profile treatment. */
@media (min-width: 961px) {
    .panels.panelone {
        width:275px !important;
        max-width:275px !important;
        margin-right:-275px !important;
    }
    #main_option.panelone {
        width:440px !important;
        max-width:440px !important;
        margin-right:-440px !important;
    }
    #matching_panel.panelone { width:305px !important; max-width:305px !important; margin-right:-305px !important; }
}

/* Profile / settings sheet: remove the legacy gray-brown visual language. */
#tools_panel {
    background:
        radial-gradient(circle at 100% 0,rgba(20,148,255,.11),transparent 32%),
        linear-gradient(180deg,#071b2d 0%,#05131f 100%) !important;
    border-left:1px solid rgba(44,171,255,.28) !important;
    box-shadow:none !important;
    color:#dceeff !important;
}
#tools_panel .top_option,
#tools_panel .panel_element,
#tools_panel .profile_info,
#tools_panel .profile_zone,
#tools_panel .profile_section,
#tools_panel .details,
#tools_panel .details_last {
    background:transparent !important;
    color:#dceeff !important;
}
#tools_panel .top_option { border-bottom:1px solid rgba(61,158,226,.18) !important; }
#tools_panel .panel_element { padding-left:14px !important; padding-right:14px !important; }
#tools_panel #profile_menu {
    display:grid !important;
    grid-template-columns:1fr 1fr;
    gap:6px;
    margin:0 0 14px !important;
}
#tools_panel #profile_menu .profile_button {
    width:100% !important;
    min-height:38px;
    margin:0 !important;
    float:none !important;
    border:1px solid rgba(74,158,219,.22) !important;
    border-radius:9px !important;
    background:rgba(16,47,70,.76) !important;
    color:#b8d1e4 !important;
    font-weight:600;
}
#tools_panel #profile_menu .profile_button.selected_element,
#tools_panel #profile_menu .profile_button:hover {
    color:#fff !important;
    border-color:rgba(36,185,255,.66) !important;
    background:linear-gradient(180deg,rgba(17,156,239,.75),rgba(10,113,186,.72)) !important;
    box-shadow:0 0 18px rgba(20,166,246,.16);
}
#tools_panel .sub_color,
#tools_panel .change_avatar,
#tools_panel .profile_section > p:first-child { color:#31c4ff !important; }
#tools_panel label,
#tools_panel .custom_element_title,
#tools_panel .small_text { color:#9bb7cb !important; }
#tools_panel input,
#tools_panel select,
#tools_panel textarea,
#tools_panel .background_box {
    border:1px solid rgba(79,157,214,.24) !important;
    border-radius:8px !important;
    background:rgba(11,37,56,.92) !important;
    color:#edf8ff !important;
    box-shadow:none !important;
}
#tools_panel input:focus,
#tools_panel select:focus,
#tools_panel textarea:focus {
    outline:none !important;
    border-color:rgba(40,187,255,.72) !important;
    box-shadow:0 0 0 2px rgba(31,171,243,.10) !important;
}
#tools_panel textarea::placeholder,
#tools_panel input::placeholder { color:#6f8da4 !important; }
#tools_panel .sub_button,
#tools_panel .full_button,
#tools_panel button[type="submit"] {
    border:1px solid rgba(48,177,248,.34) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,rgba(22,112,181,.34),rgba(11,74,124,.30)) !important;
    color:#eaf7ff !important;
}
#tools_panel .sub_button:hover,
#tools_panel .full_button:hover,
#tools_panel button[type="submit"]:hover {
    border-color:#26baff !important;
    background:linear-gradient(180deg,rgba(24,145,226,.48),rgba(12,91,151,.40)) !important;
    box-shadow:0 0 18px rgba(30,174,250,.13);
}
#tools_panel #profile_personal img,
#tools_panel .profile_avatar,
#tools_panel #avatar_profile {
    border-radius:12px !important;
    border:1px solid rgba(43,183,255,.38) !important;
    box-shadow:0 0 22px rgba(26,154,235,.12);
}
#tools_panel .voxgab-chat-interest-list label,
#tools_panel .voxgab-chat-interest-list button,
#tools_panel .voxgab-chat-interest-list span {
    border-color:rgba(69,167,230,.28) !important;
    background:rgba(18,62,91,.58) !important;
    color:#cbe4f6 !important;
}

/* Uploader is a first-class overlay in the rebuilt shell. */
#upload_box {
    position:fixed !important;
    top:50% !important;
    left:50% !important;
    width:min(360px,calc(100vw - 28px)) !important;
    margin:0 !important;
    transform:translate(-50%,-50%);
    padding:14px !important;
    border:1px solid rgba(39,181,255,.42) !important;
    border-radius:14px !important;
    background:linear-gradient(180deg,#0a2438,#061725) !important;
    box-shadow:0 24px 70px rgba(0,0,0,.58),0 0 30px rgba(23,154,244,.12) !important;
    color:#eaf7ff !important;
    z-index:1000000 !important;
}
#upload_box #upload_header { height:30px !important; padding:0 0 8px !important; }
#upload_box .close_upload { color:#8fcfff !important; cursor:pointer; }
#upload_box .fileUpload,
#upload_box .submit_image {
    border:1px solid rgba(46,181,251,.40) !important;
    background:linear-gradient(180deg,rgba(23,126,202,.40),rgba(9,80,137,.34)) !important;
    color:#eef9ff !important;
}
#upload_box #display_file { padding:8px 2px; color:#94b5cc; font-size:12px; overflow-wrap:anywhere; }
#upload_box #warnupload { height:auto !important; min-height:20px; color:#ff8f9e !important; font-size:13px !important; }

@media (max-width: 960px) {
    .panels.panelone,
    #main_option.panelone,
    #matching_panel.panelone {
        width:min(420px,100vw) !important;
        max-width:100vw !important;
        margin-right:-100vw !important;
    }
}
@media (max-width: 660px) {
    .panels.panelone,
    #main_option.panelone,
    #matching_panel.panelone {
        width:100% !important;
        max-width:100vw !important;
        margin-right:-100vw !important;
    }
    #tools_panel .panel_element { padding-left:12px !important; padding-right:12px !important; }
}


/* Patch 30 — compact right rail, explicit current mode, protected-media proof, robust upload chooser. */
.voxgab-right-rail { padding-right:0; }
.voxgab-mode-card.is-current { cursor:default; }
.voxgab-mode-card.is-current > i:last-child { color:#52dc9a; }
.voxgab-protected-media-card { background:linear-gradient(180deg,rgba(7,31,52,.96),rgba(5,23,39,.94)) !important; }
.voxgab-protection-list { display:grid; gap:8px; margin-top:14px; }
.voxgab-protection-list span { display:flex; align-items:flex-start; gap:8px; color:#9fb9cc; font-size:10px; line-height:1.4; }
.voxgab-protection-list i { width:14px; margin-top:1px; color:#4ed894; text-align:center; }
.voxgab-protection-list span:last-child i { color:#56c7ff; }
#upload_box .voxgab-file-field {
    display:grid; gap:8px; margin-top:2px;
}
#upload_box .voxgab-file-field > label {
    display:flex; align-items:center; gap:8px; color:#b9d9ee; font-size:12px; font-weight:700;
}
#upload_box .voxgab-file-input {
    position:static !important; width:100% !important; height:auto !important; overflow:visible !important;
    opacity:1 !important; clip:auto !important; clip-path:none !important; white-space:normal !important;
    padding:8px !important; border:1px solid rgba(46,181,251,.34) !important; border-radius:9px !important;
    background:rgba(6,28,45,.86) !important; color:#b9d9ee !important; cursor:pointer;
}
#upload_box .voxgab-file-input::file-selector-button {
    margin-right:10px; padding:8px 11px; border:1px solid rgba(46,181,251,.42); border-radius:7px;
    background:linear-gradient(180deg,rgba(23,126,202,.44),rgba(9,80,137,.38)); color:#eef9ff; cursor:pointer;
}
#upload_box #display_file:not(:empty) {
    margin-top:8px; padding:8px 10px !important; border:1px solid rgba(63,166,230,.20); border-radius:8px; background:rgba(5,24,39,.78); color:#c8e8fb;
}
/* Patch 31: remove dark side-shadow from the static right rail and all legacy sheets. */
.voxgab-right-rail .voxgab-glass,
.voxgab-right-card {
    box-shadow:inset 0 1px 0 rgba(255,255,255,.035) !important;
}
.panels, #main_option.panelone, #tools_panel, #matching_panel, #private_panel {
    box-shadow:none !important;
}
@media (max-width:960px){ .voxgab-protected-media-card{ display:none; } }

/* Patch 32 — panel containment/compactness and restore proven Patch 22 uploader client path. */
html, body {
    max-width:100% !important;
    overflow-x:hidden !important;
}

/* Legacy slide-in sheets intentionally sit beyond the right edge while closed.
   Clip them at the viewport so they cannot create a horizontally pannable page. */
.panels.panelone,
#main_option.panelone,
#matching_panel.panelone,
#private_panel.panelone,
#tools_panel.panelone {
    max-height:100dvh !important;
    overflow-x:hidden !important;
    overscroll-behavior-x:none;
}

@media (min-width: 961px) {
    .panels.panelone {
        width:250px !important;
        max-width:250px !important;
        margin-right:-250px !important;
    }
    #tools_panel.panelone {
        width:260px !important;
        max-width:260px !important;
        margin-right:-260px !important;
    }
    #matching_panel.panelone {
        width:285px !important;
        max-width:285px !important;
        margin-right:-285px !important;
    }
    #main_option.panelone {
        width:400px !important;
        max-width:400px !important;
        margin-right:-400px !important;
    }
}

/* Compact admin/settings controls. */
#main_option .top_option { padding:10px 14px !important; }
#main_option .voxgab-admin-heading { padding:12px 16px 6px !important; }
#main_option .voxgab-admin-heading h2 { font-size:22px !important; }
#main_option .voxgab-admin-heading p { font-size:10px !important; }
#main_option .panel_element { padding:6px 16px 26px !important; }
#main_option #top_setting_option { gap:6px !important; padding-bottom:12px !important; }
#main_option #top_setting_option .setting_option_button,
#main_option #top_setting_option.voxgab-rbac-grid > .sub_button,
#main_option #admin_users_shortcut {
    min-height:42px !important;
    padding:8px 10px !important;
    font-size:12px !important;
    border-radius:8px !important;
}
#main_option #container_setting { padding-top:12px !important; }
#main_option .setting_part h3,
#main_option .sub_color { font-size:18px !important; margin-bottom:10px !important; }
#main_option input,
#main_option select,
#main_option textarea {
    min-height:38px !important;
    padding:7px 9px !important;
    border-radius:9px !important;
    font-size:13px !important;
}
#main_option textarea { min-height:72px !important; }
#main_option .sub_button,
#main_option .full_button {
    min-height:40px !important;
    padding:8px 10px !important;
    border-radius:9px !important;
}
#main_option .setting_message_zone,
#main_option .option_setting,
#main_option .container_element { padding-top:8px !important; padding-bottom:8px !important; }
#main_option .clear_panel { height:14px !important; }

/* Keep the exact proven Patch 22 file-input mechanism functional while matching the new shell. */
#upload_box .fileUpload {
    position:relative !important;
    display:block !important;
    width:100% !important;
    height:44px !important;
    line-height:44px !important;
    overflow:hidden !important;
    border:1px solid rgba(46,181,251,.40) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,rgba(23,126,202,.40),rgba(9,80,137,.34)) !important;
    color:#eef9ff !important;
    text-align:center !important;
}
#upload_box .fileUpload input.upload {
    position:absolute !important;
    inset:0 !important;
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    opacity:0 !important;
    cursor:pointer !important;
    font-size:100px !important;
}
#upload_box .submit_image {
    min-height:42px !important;
    border:1px solid rgba(46,181,251,.40) !important;
    background:linear-gradient(180deg,rgba(23,126,202,.40),rgba(9,80,137,.34)) !important;
    color:#eef9ff !important;
}


/* Patch 34 — definitive right-sheet containment and compact Admin/Settings geometry. */
html, body, .voxgab-dashboard {
    max-width:100%;
    overflow-x:hidden !important;
}

/* Every legacy sheet is viewport-pinned and owns its horizontal scrolling behavior. */
.panels.panelone,
#main_option.panelone,
#tools_panel.panelone,
#chat_panel.panelone,
#private_panel.panelone,
#matching_panel.panelone {
    box-sizing:border-box !important;
    overflow-x:hidden !important;
    max-width:100vw !important;
}
.panels.panelone *,
#main_option.panelone *,
#tools_panel.panelone *,
#chat_panel.panelone *,
#private_panel.panelone *,
#matching_panel.panelone * {
    box-sizing:border-box;
    min-width:0;
    max-width:100%;
}

/* Desktop: compact sheets. Closed margin must exactly equal the sheet width because legacy JS animates `right`. */
@media (min-width: 769px) {
    .panels.panelone,
    #chat_panel.panelone,
    #private_panel.panelone {
        width:250px !important;
        max-width:250px !important;
        margin-right:-250px !important;
    }
    #tools_panel.panelone {
        width:255px !important;
        max-width:255px !important;
        margin-right:-255px !important;
    }
    #matching_panel.panelone {
        width:280px !important;
        max-width:280px !important;
        margin-right:-280px !important;
    }
    #main_option.panelone {
        width:360px !important;
        max-width:360px !important;
        margin-right:-360px !important;
    }
}

/* Admin content must never grow wider than the sheet. */
#main_option .top_option,
#main_option .voxgab-admin-heading,
#main_option .panel_element,
#main_option #top_setting_option,
#main_option #container_setting,
#main_option .setting_part,
#main_option .setting_message_zone,
#main_option .option_setting,
#main_option .container_element,
#main_option #site_title,
#main_option #site_domain {
    width:100% !important;
    max-width:100% !important;
    margin-left:0 !important;
    margin-right:0 !important;
}
#main_option .top_option {
    padding:8px 12px !important;
}
#main_option .voxgab-admin-heading {
    padding:10px 12px 5px !important;
}
#main_option .voxgab-admin-heading h2 {
    font-size:20px !important;
    margin:4px 0 3px !important;
}
#main_option .panel_element {
    padding:5px 12px 20px !important;
}
#main_option #top_setting_option {
    gap:5px !important;
    padding-bottom:10px !important;
}
#main_option #top_setting_option .setting_option_button,
#main_option #top_setting_option.voxgab-rbac-grid > .sub_button,
#main_option #admin_users_shortcut {
    min-height:38px !important;
    padding:6px 8px !important;
    font-size:11px !important;
}
#main_option #container_setting {
    padding-top:10px !important;
}
#main_option .setting_part h3,
#main_option .sub_color {
    font-size:14px !important;
    margin:0 0 8px !important;
}
#main_option .option_setting,
#main_option .setting_message_zone,
#main_option .container_element {
    padding-top:6px !important;
    padding-bottom:6px !important;
}
#main_option .option_left {
    padding:4px 0 !important;
}
#main_option .option_left label {
    max-width:58% !important;
    line-height:1.25 !important;
    font-size:12px !important;
}
#main_option .option_left select {
    width:38% !important;
    min-height:34px !important;
}
#main_option input,
#main_option select,
#main_option textarea {
    max-width:100% !important;
    min-height:34px !important;
    padding:6px 8px !important;
    font-size:12px !important;
}
#main_option textarea {
    min-height:62px !important;
    resize:vertical !important;
}
#main_option #site_title_left,
#main_option #site_domain_left {
    width:34% !important;
}
#main_option #site_title_right,
#main_option #site_domain_right {
    width:66% !important;
}
#main_option #my_title,
#main_option #my_domain,
#main_option .news_title_zone,
#main_option .setting_msg,
#main_option .time_zone_select {
    width:100% !important;
    max-width:100% !important;
    float:none !important;
}
#main_option .small_text,
#main_option .setting_hint {
    font-size:9px !important;
    line-height:1.3 !important;
}
#main_option .sub_button,
#main_option .full_button {
    min-height:36px !important;
    padding:6px 8px !important;
}
#main_option .clear_panel {
    height:10px !important;
}

/* Phones/tablets: sheet owns the viewport; never create a second horizontal canvas. */
@media (max-width: 768px) {
    .panels.panelone,
    #main_option.panelone,
    #tools_panel.panelone,
    #chat_panel.panelone,
    #private_panel.panelone,
    #matching_panel.panelone {
        width:100vw !important;
        max-width:100vw !important;
        margin-right:-100vw !important;
    }
    #main_option .panel_element {
        padding-left:12px !important;
        padding-right:12px !important;
    }
}


/* Patch 35 — restore legacy panel motion contract.
   IMPORTANT: do not force `right` or `left` here. The BoomChat panel engine
   opens/closes sheets by animating `right`; overriding it with !important
   blocks every panel and can leave invisible fixed layers over the UI. */
@media (min-width: 769px) {
    .panels.panelone,
    #chat_panel.panelone,
    #private_panel.panelone {
        width:250px !important;
        max-width:250px !important;
        margin-right:-250px !important;
    }
    #tools_panel.panelone {
        width:255px !important;
        max-width:255px !important;
        margin-right:-255px !important;
    }
    #matching_panel.panelone {
        width:280px !important;
        max-width:280px !important;
        margin-right:-280px !important;
    }
    #main_option.panelone {
        width:350px !important;
        max-width:350px !important;
        margin-right:-350px !important;
    }
}

/* Patch 36 — unified right-side panel design.
   Profile (tools_panel) is the visual master. This block deliberately does
   not touch `right`/`left` so the recovered legacy slide animation remains
   authoritative. Admin/Settings keeps its larger geometry. */
:root {
    --vox-panel-bg-top:#071b2d;
    --vox-panel-bg-bottom:#05131f;
    --vox-panel-line:rgba(44,171,255,.28);
    --vox-panel-line-soft:rgba(61,158,226,.18);
    --vox-panel-card:rgba(16,47,70,.76);
    --vox-panel-card-hover:rgba(21,66,96,.82);
    --vox-panel-text:#dceeff;
    --vox-panel-muted:#8faabd;
    --vox-panel-cyan:#31c4ff;
}

/* Standard sheets all inherit the Profile visual shell. */
#chat_panel,
#profile_panel,
#private_panel,
#matching_panel,
#history_panel,
#addon_panel {
    background:
        radial-gradient(circle at 100% 0,rgba(20,148,255,.11),transparent 32%),
        linear-gradient(180deg,var(--vox-panel-bg-top) 0%,var(--vox-panel-bg-bottom) 100%) !important;
    border-left:1px solid var(--vox-panel-line) !important;
    color:var(--vox-panel-text) !important;
    box-shadow:none !important;
}

/* Same top bar rhythm as Profile. */
#chat_panel .top_option,
#profile_panel .top_option,
#private_panel .top_option,
#matching_panel .top_option,
#history_panel .top_option,
#addon_panel .top_option {
    min-height:72px !important;
    padding:14px 14px 10px !important;
    background:transparent !important;
    border-bottom:1px solid var(--vox-panel-line-soft) !important;
    box-sizing:border-box !important;
}

#chat_panel .close_option,
#profile_panel .close_option,
#private_panel .close_option,
#matching_panel .close_option,
#history_panel .close_option,
#addon_panel .close_option {
    width:44px !important;
    height:44px !important;
    margin:0 !important;
    float:left !important;
}

#chat_panel .top_icon_close,
#profile_panel .top_icon_close,
#private_panel .close_private,
#matching_panel .top_icon_close,
#history_panel .top_icon_close,
#addon_panel .top_icon_close {
    width:44px !important;
    height:44px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    border:1px solid rgba(73,164,225,.25) !important;
    border-radius:11px !important;
    background:rgba(14,49,73,.72) !important;
    color:#dff3ff !important;
    font-size:20px !important;
    line-height:1 !important;
    cursor:pointer !important;
    box-sizing:border-box !important;
}

#chat_panel .top_icon_close:hover,
#profile_panel .top_icon_close:hover,
#private_panel .close_private:hover,
#matching_panel .top_icon_close:hover,
#history_panel .top_icon_close:hover,
#addon_panel .top_icon_close:hover {
    border-color:#27baff !important;
    background:rgba(20,103,158,.55) !important;
    color:#fff !important;
}

#chat_panel .inner_top_option,
#profile_panel .inner_top_option,
#private_panel .inner_top_option,
#matching_panel .inner_top_option,
#history_panel .inner_top_option,
#addon_panel .inner_top_option {
    min-height:44px !important;
    margin-left:54px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-end !important;
    gap:4px !important;
    box-sizing:border-box !important;
}

/* Chat-panel mode icons become Profile-style outlined controls. */
#chat_panel .inner_top_option .top_icon {
    width:38px !important;
    height:38px !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(73,164,225,.23) !important;
    border-radius:10px !important;
    background:rgba(15,49,72,.72) !important;
    color:#9bcce9 !important;
    font-size:17px !important;
    line-height:1 !important;
    cursor:pointer !important;
    box-sizing:border-box !important;
}
#chat_panel .inner_top_option .top_icon:hover,
#chat_panel .inner_top_option .selected_element {
    color:#fff !important;
    border-color:#27baff !important;
    background:linear-gradient(180deg,rgba(17,156,239,.75),rgba(10,113,186,.72)) !important;
    box-shadow:0 0 18px rgba(20,166,246,.13) !important;
}

/* Unified content padding. */
#chat_panel .panel_element,
#profile_panel .panel_element,
#private_panel .panel_element,
#matching_panel .panel_element,
#history_panel .panel_element,
#addon_panel .panel_element {
    padding:12px 14px 28px !important;
    background:transparent !important;
    color:var(--vox-panel-text) !important;
    box-sizing:border-box !important;
}

/* Profile-style tab treatment on Friends. */
#chat_panel .voxgab-panel-tabs,
#chat_panel #menu_friend {
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:6px !important;
    margin:0 0 14px !important;
}
#chat_panel .voxgab-panel-tabs .friend_button,
#chat_panel #menu_friend .friend_button {
    width:100% !important;
    min-height:38px !important;
    margin:0 !important;
    float:none !important;
    border:1px solid rgba(74,158,219,.22) !important;
    border-radius:9px !important;
    background:var(--vox-panel-card) !important;
    color:#b8d1e4 !important;
    font-weight:600 !important;
    box-sizing:border-box !important;
}
#chat_panel .voxgab-panel-tabs .friend_button.selected_element,
#chat_panel #menu_friend .friend_button.selected_element,
#chat_panel .voxgab-panel-tabs .friend_button:hover,
#chat_panel #menu_friend .friend_button:hover {
    color:#fff !important;
    border-color:rgba(36,185,255,.66) !important;
    background:linear-gradient(180deg,rgba(17,156,239,.75),rgba(10,113,186,.72)) !important;
    box-shadow:0 0 18px rgba(20,166,246,.14) !important;
}

/* Shared panel empty state. */
.voxgab-panel-empty {
    min-height:220px;
    padding:38px 12px 26px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:flex-start;
    text-align:center;
    color:var(--vox-panel-muted);
    box-sizing:border-box;
}
.voxgab-panel-empty .voxgab-empty-icon {
    width:64px;
    height:64px;
    margin-bottom:14px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(50,181,250,.27);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(23,104,166,.35),rgba(10,61,101,.30));
    color:#79d1ff;
    font-size:28px;
    box-shadow:0 0 20px rgba(31,171,243,.08);
}
.voxgab-panel-empty strong {
    display:block;
    color:#f2f9ff;
    font-size:17px;
    line-height:1.25;
}
.voxgab-panel-empty p {
    max-width:210px;
    margin:7px auto 0 !important;
    color:#8faabd !important;
    font-size:11px !important;
    line-height:1.45 !important;
}

/* Room list: same glass cards and cyan selected state as Profile tabs. */
#chat_panel .voxgab-room-list,
#chat_panel #container_user_room {
    display:flex !important;
    flex-direction:column !important;
    gap:7px !important;
    margin:0 !important;
    padding:0 !important;
}
#chat_panel .roombutton.voxgab-panel-row,
#chat_panel .roombutton {
    min-height:48px !important;
    width:100% !important;
    margin:0 !important;
    padding:0 12px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) auto !important;
    align-items:center !important;
    border:1px solid rgba(74,158,219,.18) !important;
    border-radius:10px !important;
    background:var(--vox-panel-card) !important;
    color:#d8eafa !important;
    box-sizing:border-box !important;
}
#chat_panel .roombutton:hover {
    background:var(--vox-panel-card-hover) !important;
    border-color:rgba(60,178,244,.36) !important;
}
#chat_panel .roombutton.selected_element,
#chat_panel .roombutton.hoverroom {
    color:#fff !important;
    border-color:rgba(36,185,255,.72) !important;
    background:linear-gradient(180deg,rgba(17,156,239,.82),rgba(10,113,186,.78)) !important;
    box-shadow:0 0 18px rgba(20,166,246,.12) !important;
}
#chat_panel .room_name,
#chat_panel .room_count {
    width:auto !important;
    float:none !important;
    padding:0 !important;
}
#chat_panel .room_name p,
#chat_panel .room_count p {
    margin:0 !important;
    line-height:1.25 !important;
}
#chat_panel .room_name p { color:inherit !important; font-weight:600 !important; }
#chat_panel .room_count { text-align:right !important; }
#chat_panel .room_type,
#chat_panel .room_userin { color:#8faabd !important; font-size:10px !important; }
#chat_panel .selected_element .room_type,
#chat_panel .selected_element .room_userin { color:#dff5ff !important; }

/* Friends: turn legacy list rows into the same card language. */
#chat_panel #friend_container > ul { margin:0 !important; padding:0 !important; list-style:none !important; }
#chat_panel .users_option.voxgab-panel-row,
#chat_panel .users_option,
#chat_panel .container_friend.voxgab-panel-row,
#chat_panel .container_friend {
    width:100% !important;
    margin:0 0 7px !important;
    padding:9px 10px !important;
    border:1px solid rgba(74,158,219,.18) !important;
    border-radius:10px !important;
    background:var(--vox-panel-card) !important;
    color:#d8eafa !important;
    box-sizing:border-box !important;
}
#chat_panel .users_option:hover,
#chat_panel .container_friend:hover {
    border-color:rgba(60,178,244,.36) !important;
    background:var(--vox-panel-card-hover) !important;
}
#chat_panel .open_user { min-height:42px !important; display:flex !important; align-items:center !important; }
#chat_panel .avatar_userlist {
    width:38px !important;
    height:38px !important;
    margin:0 9px 0 0 !important;
    border:1px solid rgba(53,187,255,.42) !important;
    border-radius:50% !important;
    object-fit:cover !important;
}
#chat_panel .usertarget { color:#eaf6ff !important; font-weight:600 !important; }
#chat_panel .option_list,
#chat_panel .user_option_list { background:#0b2436 !important; border-color:rgba(59,170,234,.24) !important; }
#chat_panel .friend_top,
#chat_panel .friend_bottom { background:transparent !important; }
#chat_panel .friend_name p { color:#eaf6ff !important; }

/* Direct-message notification rows. */
#chat_panel .voxgab-private-row,
#chat_panel .element.voxgab-panel-row,
#chat_panel .element.sub_element {
    min-height:50px !important;
    margin:0 0 7px !important;
    padding:0 10px !important;
    display:grid !important;
    grid-template-columns:minmax(0,1fr) 34px !important;
    align-items:center !important;
    border:1px solid rgba(74,158,219,.18) !important;
    border-radius:10px !important;
    background:var(--vox-panel-card) !important;
    color:#d8eafa !important;
    box-sizing:border-box !important;
}
#chat_panel .element.selected_element {
    border-color:rgba(36,185,255,.60) !important;
    background:linear-gradient(180deg,rgba(17,126,195,.56),rgba(10,84,137,.52)) !important;
}
#chat_panel .element_name,
#chat_panel .delete_element { width:auto !important; float:none !important; }
#chat_panel .element_name p { margin:0 !important; color:#eef8ff !important; font-weight:600 !important; }
#chat_panel .delete_element { text-align:right !important; }
#chat_panel .delete_element button {
    width:30px !important;
    height:30px !important;
    border:0 !important;
    border-radius:8px !important;
    background:transparent !important;
    color:#6f91a8 !important;
}
#chat_panel .delete_element button:hover { background:rgba(255,76,100,.10) !important; color:#ff7f91 !important; }
#chat_panel .remove_private { font-size:15px !important; }

/* Generic lists loaded into chat_panel (users/search/ignore) receive the same cards. */
#chat_panel .container_element,
#chat_panel .sub_element:not(.roombutton):not(.element):not(.container_friend) {
    border-color:rgba(74,158,219,.18) !important;
    border-radius:10px !important;
}

/* Private conversation panel follows Profile shell too. */
#private_panel .private_target {
    margin:0 auto 0 0 !important;
    color:#31c4ff !important;
    font-weight:700 !important;
    font-size:14px !important;
}
#private_panel .add_friend_button {
    width:38px !important;
    height:38px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    margin:0 !important;
    border:1px solid rgba(73,164,225,.23) !important;
    border-radius:10px !important;
    background:rgba(15,49,72,.72) !important;
    color:#9bcce9 !important;
    font-size:17px !important;
    cursor:pointer !important;
}
#private_panel #show_private,
#private_panel #private_content,
#private_panel .background_box {
    border-color:rgba(79,157,214,.24) !important;
    background:rgba(11,37,56,.92) !important;
    color:#edf8ff !important;
}
#private_panel #submit_private {
    border:1px solid rgba(36,185,255,.66) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,rgba(17,156,239,.82),rgba(10,113,186,.78)) !important;
    color:#fff !important;
}

/* Keep Admin/Settings larger, exactly as requested; only harmonize shell tones. */
#main_option {
    background:
        radial-gradient(circle at 100% 0,rgba(20,148,255,.10),transparent 32%),
        linear-gradient(180deg,var(--vox-panel-bg-top) 0%,var(--vox-panel-bg-bottom) 100%) !important;
    border-left:1px solid var(--vox-panel-line) !important;
    box-shadow:none !important;
}

/* Preserve the recovered movement contract. Widths only; never override right/left. */
@media (min-width:769px) {
    #chat_panel.panelone,
    #profile_panel.panelone,
    #history_panel.panelone,
    #addon_panel.panelone {
        width:255px !important;
        max-width:255px !important;
        margin-right:-255px !important;
    }
    #tools_panel.panelone {
        width:255px !important;
        max-width:255px !important;
        margin-right:-255px !important;
    }
    #matching_panel.panelone {
        width:280px !important;
        max-width:280px !important;
        margin-right:-280px !important;
    }
    #main_option.panelone {
        width:350px !important;
        max-width:350px !important;
        margin-right:-350px !important;
    }
}

@media (max-width:768px) {
    .voxgab-panel-empty { min-height:180px; padding-top:28px; }
    #chat_panel .top_option,
    #profile_panel .top_option,
    #private_panel .top_option,
    #matching_panel .top_option,
    #history_panel .top_option,
    #addon_panel .top_option { min-height:66px !important; padding:11px 12px 9px !important; }
}

/* ========================================================================== */
/* Patch 37 — compact unified chat-panel toolbar                              */
/* My Chats / Rooms / Direct Messages / Friends / Ignore share this header.   */
/* Keep the legacy panel movement/loader contract untouched.                   */
/* ========================================================================== */
#chat_panel .top_option {
    min-height:58px !important;
    padding:10px 10px 9px 8px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:8px !important;
    border-bottom:1px solid var(--vox-panel-line-soft) !important;
    box-sizing:border-box !important;
}

#chat_panel .close_option {
    width:36px !important;
    height:36px !important;
    margin:0 !important;
    float:none !important;
    flex:0 0 36px !important;
}

#chat_panel .top_icon_close {
    width:36px !important;
    height:36px !important;
    margin:0 !important;
    border-radius:9px !important;
    font-size:16px !important;
    flex:0 0 36px !important;
}

#chat_panel .inner_top_option {
    min-height:36px !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:7px !important;
    flex:1 1 auto !important;
    min-width:0 !important;
    box-sizing:border-box !important;
}

#chat_panel .inner_top_option .top_icon {
    width:36px !important;
    height:36px !important;
    min-width:36px !important;
    margin:0 !important;
    border-radius:9px !important;
    font-size:16px !important;
    flex:0 0 36px !important;
}

/* Keep the complete toolbar on one baseline even on narrower desktop panels. */
#chat_panel .top_option,
#chat_panel .inner_top_option {
    white-space:nowrap !important;
}

@media (max-width:660px) {
    #chat_panel .top_option {
        min-height:54px !important;
        padding:9px 8px 8px 7px !important;
        gap:6px !important;
    }
    #chat_panel .close_option,
    #chat_panel .top_icon_close,
    #chat_panel .inner_top_option .top_icon {
        width:34px !important;
        height:34px !important;
        min-width:34px !important;
        flex-basis:34px !important;
    }
    #chat_panel .inner_top_option {
        min-height:34px !important;
        gap:5px !important;
    }
}

/* ========================================================================== */
/* Patch 38 — structural chat-panel toolbar fix                               */
/* X + Users + Rooms + Messages + Friends + Ignore are one real toolbar.      */
/* This replaces the legacy separate close wrapper for #chat_panel only.       */
/* ========================================================================== */
#chat_panel .voxgab-chat-panel-header {
    min-height:50px !important;
    height:auto !important;
    width:90% !important;
    margin:9px auto 0 !important;
    padding:0 0 8px !important;
    display:block !important;
    border-bottom:1px solid var(--vox-panel-line-soft) !important;
    box-sizing:border-box !important;
}

#chat_panel .voxgab-chat-toolbar {
    width:100% !important;
    min-height:31px !important;
    height:31px !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap:4px !important;
    white-space:nowrap !important;
    box-sizing:border-box !important;
}

#chat_panel .voxgab-chat-toolbar .top_icon,
#chat_panel .voxgab-chat-toolbar .top_icon_close {
    width:31px !important;
    height:31px !important;
    min-width:31px !important;
    flex:0 0 31px !important;
    margin:0 !important;
    padding:0 !important;
    float:none !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(73,164,225,.28) !important;
    border-radius:8px !important;
    background:rgba(15,49,72,.76) !important;
    color:#a8d9f4 !important;
    font-size:14px !important;
    line-height:1 !important;
    box-sizing:border-box !important;
}

#chat_panel .voxgab-chat-toolbar .voxgab-toolbar-close {
    width:28px !important;
    height:28px !important;
    min-width:28px !important;
    flex-basis:28px !important;
    margin-left:-2px !important;
    margin-right:2px !important;
    border-radius:8px !important;
    color:#e8f7ff !important;
    font-size:13px !important;
}

#chat_panel .voxgab-chat-toolbar .top_icon:hover,
#chat_panel .voxgab-chat-toolbar .top_icon_close:hover,
#chat_panel .voxgab-chat-toolbar .selected_element {
    border-color:#27baff !important;
    background:linear-gradient(180deg,rgba(21,126,192,.82),rgba(11,89,143,.82)) !important;
    color:#fff !important;
    box-shadow:0 0 16px rgba(39,186,255,.12) !important;
}

@media (max-width:660px) {
    #chat_panel .voxgab-chat-panel-header {
        width:92% !important;
        min-height:46px !important;
        margin-top:8px !important;
        padding-bottom:7px !important;
    }
    #chat_panel .voxgab-chat-toolbar {
        height:29px !important;
        min-height:29px !important;
        gap:3px !important;
    }
    #chat_panel .voxgab-chat-toolbar .top_icon,
    #chat_panel .voxgab-chat-toolbar .top_icon_close {
        width:29px !important;
        height:29px !important;
        min-width:29px !important;
        flex-basis:29px !important;
        font-size:13px !important;
    }
    #chat_panel .voxgab-chat-toolbar .voxgab-toolbar-close {
        width:26px !important;
        height:26px !important;
        min-width:26px !important;
        flex-basis:26px !important;
        margin-left:-2px !important;
        margin-right:2px !important;
    }
}

/* Patch 40 — online user rows: remove legacy gray theme and tighten avatar/name alignment. */
#chat_panel .users_option .open_user,
#chat_panel #container_user .open_user {
    width:100% !important;
    min-height:42px !important;
    height:auto !important;
    padding:7px 9px !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    gap:8px !important;
    overflow:hidden !important;
    border:1px solid rgba(74,158,219,.18) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,rgba(13,48,72,.94),rgba(9,36,55,.94)) !important;
    box-sizing:border-box !important;
}
#chat_panel .users_option .open_user:hover,
#chat_panel #container_user .open_user:hover {
    background:linear-gradient(180deg,rgba(17,63,94,.98),rgba(11,45,68,.98)) !important;
    border-color:rgba(60,178,244,.34) !important;
}
#chat_panel #container_user .avatar_userlist {
    flex:0 0 38px !important;
    margin:0 !important;
}
#chat_panel #container_user .open_user p.usertarget {
    flex:1 1 auto !important;
    width:auto !important;
    min-width:0 !important;
    margin:0 !important;
    padding:0 !important;
    text-align:left !important;
    line-height:1.25 !important;
    color:#eaf6ff !important;
    font-weight:600 !important;
}
#chat_panel #container_user .open_user p.usertarget s {
    text-decoration:none !important;
}

/* Patch 41: composer formatting bar + readable message typography */
.voxgab-dashboard #main_emoticon {
    display:flex !important;
    align-items:center;
    gap:5px;
    min-height:38px;
    padding:5px 7px !important;
    margin:0 0 7px !important;
    border:1px solid rgba(65,154,220,.24);
    border-radius:10px;
    background:linear-gradient(180deg,rgba(10,38,59,.96),rgba(6,28,45,.96)) !important;
    box-shadow:none !important;
}
.voxgab-dashboard #main_emoticon .bar_options { float:none !important; display:flex; align-items:center; margin:0 !important; padding:0 !important; }
.voxgab-dashboard #main_emoticon .bar_options_item {
    display:flex !important;
    align-items:center;
    justify-content:center;
    width:30px;
    height:28px;
    margin:0 !important;
    padding:0 !important;
    border:1px solid rgba(92,171,229,.22);
    border-radius:7px;
    background:rgba(13,48,73,.72) !important;
    color:#9bc9ea !important;
    transition:border-color .15s ease,background .15s ease,color .15s ease,box-shadow .15s ease;
}
.voxgab-dashboard #main_emoticon .bar_options_item:hover,
.voxgab-dashboard #main_emoticon .bar_options_item.sel_item {
    border-color:#17aff7;
    background:rgba(15,118,191,.28) !important;
    color:#eaf8ff !important;
    box-shadow:0 0 10px rgba(19,159,236,.13);
}
.voxgab-dashboard #main_emoticon .icon_bar { margin:0 !important; font-size:14px !important; color:inherit !important; }
.voxgab-dashboard #main_emoticon .wrap_picker { display:flex; align-items:center; margin-left:4px; }
.voxgab-dashboard #main_emoticon .picker {
    width:22px !important;
    height:22px !important;
    margin:0 !important;
    border:1px solid rgba(130,196,242,.45);
    border-radius:6px;
    box-shadow:inset 0 0 0 2px rgba(3,20,33,.65);
}
.voxgab-chat-stage .my_text p {
    font-family:Inter,ui-sans-serif,-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,Arial,sans-serif !important;
    font-size:14px;
    letter-spacing:.005em;
}
.voxgab-chat-stage .my_text p a {
    color:#55cfff !important;
    text-decoration-color:rgba(85,207,255,.7);
    text-decoration-thickness:1px;
    text-underline-offset:2px;
    overflow-wrap:anywhere;
}
.voxgab-chat-stage .my_text p strong,
.voxgab-chat-stage .my_text p b { color:inherit; font-weight:750; }
.voxgab-chat-stage .my_text p u { color:inherit; text-decoration-thickness:1px; text-underline-offset:2px; }
.voxgab-chat-stage .my_text p i,
.voxgab-chat-stage .my_text p em { color:inherit; }

/* Patch 41: real Interest Matching toggle state */
.voxgab-interest-card .voxgab-live-toggle {
    appearance:none;
    -webkit-appearance:none;
    flex:0 0 auto;
    display:block;
    margin-left:auto;
    width:36px;
    height:20px;
    padding:2px;
    border:0;
    border-radius:999px;
    background:#138df5;
    box-shadow:0 0 12px rgba(19,141,245,.35);
    cursor:pointer;
}
.voxgab-interest-card .voxgab-live-toggle i { display:block; width:16px; height:16px; margin-left:auto; border-radius:50%; background:#fff; transition:margin .16s ease,background .16s ease; }
.voxgab-interest-card.is-disabled .voxgab-live-toggle { background:#23465f; box-shadow:none; }
.voxgab-interest-card.is-disabled .voxgab-live-toggle i { margin-left:0; background:#8ba6b9; }
.voxgab-interest-card.is-disabled .voxgab-right-interest-list { opacity:.48; }
.voxgab-interest-card.is-disabled [data-vox-action="matching"] { opacity:.45; cursor:not-allowed; border-color:rgba(102,157,196,.18); color:#6f8da2; }

/* Patch 41: bounded external video/social embeds */
.voxgab-chat-stage .chat_video_wrap {
    display:block;
    width:min(400px,100%);
    max-width:400px;
    margin:7px 0 2px;
    border:1px solid rgba(68,166,232,.32);
    border-radius:11px;
    overflow:hidden;
    background:#061b2c;
    line-height:0;
}
.voxgab-chat-stage .chat_video_embed {
    display:block;
    width:100%;
    max-width:400px;
    height:auto;
    aspect-ratio:16/9;
    max-height:400px;
    border:0;
    background:#071a29;
}
.voxgab-chat-stage .chat_video_social_wrap .chat_video_x { aspect-ratio:auto; height:400px; }

/* Patch 41: rules panel matches the modern slide-over surface */
.voxgab-dashboard #rules_panel .panel_element { color:#dcebf6; }
.voxgab-dashboard #rules_panel #rules_box { padding:4px 2px 18px; }
.voxgab-dashboard #rules_panel #rules_box h3 { margin:4px 0 8px; color:#39c7ff !important; font-size:18px; }
.voxgab-dashboard #rules_panel #rules_box h4 { margin:0 0 14px; color:#9cb7ca; font-size:12px; font-weight:500; line-height:1.45; }
.voxgab-dashboard #rules_panel #rules_box ul { margin:0; padding:0; list-style:none; }
.voxgab-dashboard #rules_panel #rules_box li { margin:0 0 9px; padding:10px 11px; border:1px solid rgba(64,150,214,.22); border-radius:10px; background:rgba(14,47,70,.58); }
.voxgab-dashboard #rules_panel #rules_box li strong { color:#eef8ff; }
.voxgab-dashboard #rules_panel #rules_box li p { margin:4px 0 0; color:#98b2c5; line-height:1.45; }
.voxgab-chat-stage .chat_video_social_wrap .chat_video_fallback {
    display:block;
    padding:9px 11px;
    border-top:1px solid rgba(68,166,232,.22);
    background:rgba(8,34,52,.96);
    color:#64d2ff !important;
    font-size:11px;
    line-height:1.3;
    text-decoration:none;
}
.voxgab-chat-stage .chat_video_social_wrap .chat_video_fallback:hover { color:#eaf8ff !important; background:rgba(11,55,82,.96); }
.voxgab-dashboard .voxgab-find-similar:disabled,
.voxgab-dashboard .voxgab-find-similar.is-disabled { opacity:.45; cursor:not-allowed; filter:saturate(.4); }

/* Patch 42 — Manage Users final VOXGAB treatment. */
#main_option .voxgab-admin-user-tabs {
    grid-template-columns:repeat(2,minmax(0,1fr)) !important;
    gap:10px !important;
    padding:0 0 16px !important;
}
#main_option .voxgab-admin-user-tabs .view_user_button {
    width:100% !important;
    min-height:42px !important;
    margin:0 !important;
    float:none !important;
    border:1px solid rgba(74,164,225,.34) !important;
    border-radius:12px !important;
    background:rgba(12,42,65,.86) !important;
    color:#d5e8f7 !important;
    font-weight:700 !important;
    font-size:14px !important;
    letter-spacing:.1px;
    box-shadow:none !important;
}
#main_option .voxgab-admin-user-tabs .view_user_button:hover,
#main_option .voxgab-admin-user-tabs .view_user_button.selected_element {
    color:#fff !important;
    border-color:rgba(27,185,255,.82) !important;
    background:linear-gradient(180deg,rgba(20,154,242,.68),rgba(11,102,182,.62)) !important;
    box-shadow:0 8px 24px rgba(0,139,255,.12) !important;
}
#main_option .voxgab-admin-user-groups {
    padding-top:14px !important;
    border-top:1px solid rgba(76,151,207,.18) !important;
}
#main_option .voxgab-admin-user-section {
    width:100% !important;
    margin:0 0 14px !important;
    padding:0 !important;
}
#main_option .voxgab-admin-user-section .title_user_quart {
    width:auto !important;
    height:auto !important;
    padding:0 2px 8px !important;
    margin:0 !important;
    text-align:left !important;
    color:#58c9ff !important;
    font-size:16px !important;
    line-height:1.25 !important;
    font-weight:800 !important;
}
#main_option .voxgab-admin-user-list {
    display:grid;
    gap:8px;
}
#main_option .voxgab-admin-user-row {
    margin:0 !important;
    min-height:48px !important;
    padding:0 !important;
    border:1px solid rgba(70,153,211,.28) !important;
    border-radius:12px !important;
    background:rgba(10,38,59,.88) !important;
    overflow:hidden;
}
#main_option .voxgab-admin-user-row:hover {
    border-color:rgba(39,179,255,.54) !important;
    background:rgba(13,48,74,.96) !important;
}
#main_option .voxgab-admin-user-row .wrap_element {
    min-height:48px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding:0 10px 0 14px !important;
}
#main_option .voxgab-admin-user-row .element_name {
    flex:1 1 auto !important;
    min-width:0 !important;
}
#main_option .voxgab-admin-user-row .element_name p {
    margin:0 !important;
    color:#f4fbff !important;
    font-size:15px !important;
    font-weight:700 !important;
    overflow:hidden;
    text-overflow:ellipsis;
    white-space:nowrap;
}
#main_option .voxgab-admin-user-row .delete_element button {
    width:34px !important;
    height:34px !important;
    min-height:34px !important;
    padding:0 !important;
    display:grid !important;
    place-items:center !important;
    border:1px solid rgba(0,113,156,.20) !important;
    border-radius:9px !important;
    background:rgba(0, 113, 156, 0.07) !important;
    color:#00719c !important;
}
#main_option .voxgab-admin-user-row .delete_element button:hover {
    border-color:rgba(255,103,126,.52) !important;
    background:rgba(255,72,96,.14) !important;
    color:#fff !important;
}
#main_option .voxgab-admin-user-row .delete_element i { font-size:15px !important; }
#main_option .admin_user_empty {
    width:100% !important;
    height:auto !important;
    min-height:74px !important;
    margin:0 !important;
    padding:14px !important;
    box-sizing:border-box !important;
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    justify-content:center !important;
    gap:7px !important;
    border:1px dashed rgba(73,157,218,.26) !important;
    border-radius:12px !important;
    background:rgba(10,35,55,.62) !important;
    color:#8faabd !important;
}
#main_option .admin_user_empty i { color:#59c9ff !important; font-size:18px !important; opacity:.9; }
#main_option .admin_user_empty p {
    margin:0 !important;
    padding:0 !important;
    color:#93adbf !important;
    font-size:13px !important;
    line-height:1.35 !important;
}
@media (max-width:660px) {
    #main_option .voxgab-admin-user-tabs { gap:8px !important; }
    #main_option .voxgab-admin-user-tabs .view_user_button { min-height:40px !important; font-size:13px !important; }
}

/* Patch 43 — center Manage Users remove action icon precisely. */
#main_option .voxgab-admin-user-row .delete_element {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    align-self:stretch !important;
}
#main_option .voxgab-admin-user-row .delete_element button {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    line-height:1 !important;
}
#main_option .voxgab-admin-user-row .delete_element i.remove_element {
    margin:0 !important;
    padding:0 !important;
    width:auto !important;
    height:auto !important;
    line-height:1 !important;
    display:block !important;
    transform:none !important;
}


/* Patch 48 Hotfix 3 — X embeds render at X's supported 550px canvas and are
   scaled as one complete document into the available chat width. This avoids
   the clipped/cropped iframe seen on both desktop and mobile. */
.voxgab-chat-stage .ch_logs.voxgab-social-message .my_text {
    width:min(550px, calc(100% - 56px)) !important;
    max-width:min(550px, calc(100% - 56px)) !important;
    min-width:0 !important;
}
.voxgab-chat-stage .ch_logs.voxgab-social-message .my_text > p {
    display:block !important;
    width:100% !important;
    max-width:100% !important;
    min-width:0 !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
}
.voxgab-chat-stage .chat_video_social_wrap {
    display:block !important;
    width:100% !important;
    max-width:550px !important;
    min-width:0 !important;
    overflow:visible !important;
    box-sizing:border-box !important;
    line-height:0 !important;
}
.voxgab-chat-stage .chat_x_viewport {
    position:relative !important;
    display:block !important;
    width:100% !important;
    min-width:0 !important;
    height:450px;
    overflow:hidden !important;
    border-radius:11px 11px 0 0 !important;
    background:#15202b !important;
}
.voxgab-chat-stage .chat_x_viewport .chat_video_x {
    position:absolute !important;
    top:0 !important;
    left:0 !important;
    display:block !important;
    width:550px !important;
    min-width:550px !important;
    max-width:none !important;
    height:820px !important;
    max-height:none !important;
    aspect-ratio:auto !important;
    transform-origin:0 0 !important;
    border:0 !important;
    background:#15202b !important;
}
.voxgab-chat-stage .ch_logs.voxgab-social-message .chat_video_fallback {
    width:100% !important;
    box-sizing:border-box !important;
    line-height:1.3 !important;
}

/* Phase 2 / Patch 1 Hotfix 1: text messages should grow horizontally before vertically.
   Media/social messages keep their dedicated sizing rules. */
.voxgab-chat-stage .ch_logs:not(.voxgab-media-message):not(.voxgab-social-message):not(.voxgab-x-message) .my_text {
    width:max-content !important;
    max-width:min(80%,760px) !important;
    flex:0 1 max-content !important;
}
.voxgab-chat-stage .ch_logs:not(.voxgab-media-message):not(.voxgab-social-message):not(.voxgab-x-message) .my_text > p {
    display:block !important;
    width:max-content !important;
    max-width:100% !important;
    min-width:120px !important;
    overflow-wrap:break-word !important;
    word-break:normal !important;
    white-space:normal !important;
}

/* ========================================================================== */
/* Phase 2 / Patch 6 Hotfix 2 — PM visibility, private conversation, logout  */
/* ========================================================================== */
@keyframes voxgabDmGlow {
    0%, 100% { box-shadow:0 0 0 rgba(48,197,255,0); }
    45% { box-shadow:0 0 20px rgba(48,197,255,.42); }
}
@keyframes voxgabDmBadgePulse {
    0%, 100% { transform:scale(1); }
    50% { transform:scale(1.12); }
}
.voxgab-dm-badge[hidden] { display:none !important; }
.voxgab-dm-notify-target.voxgab-dm-unread {
    position:relative;
    color:#f2fbff !important;
    animation:voxgabDmGlow 1.8s ease-in-out infinite;
}
.voxgab-dm-notify-target.voxgab-dm-unread > i { color:#38c7ff !important; }
.voxgab-side-link.voxgab-dm-unread {
    background:linear-gradient(90deg,rgba(18,122,222,.30),rgba(13,61,99,.22)) !important;
    border-left-color:#32c8ff !important;
}
.voxgab-side-link.voxgab-dm-unread::after {
    content:'✦';
    position:absolute;
    right:7px;
    top:4px;
    color:#76dcff;
    font-size:9px;
    text-shadow:0 0 8px rgba(69,205,255,.85);
}
.voxgab-dm-unread .voxgab-dm-badge,
.voxgab-dm-badge:not([hidden]) {
    background:#0fb8f6 !important;
    color:#03131f !important;
    box-shadow:0 0 14px rgba(44,199,255,.58);
    font-weight:800;
    animation:voxgabDmBadgePulse 1.7s ease-in-out infinite;
}

/* Private conversation: independent of the legacy theme bubble colors. */
#private_panel.panelthree {
    width:min(430px,calc(100vw - 28px)) !important;
    height:min(560px,calc(100dvh - 92px)) !important;
    max-height:560px !important;
    padding:0 !important;
    border:1px solid rgba(45,178,246,.32) !important;
    border-radius:18px !important;
    background:linear-gradient(180deg,#071d2f 0%,#051725 100%) !important;
    box-shadow:0 22px 58px rgba(0,0,0,.42),0 0 0 1px rgba(35,174,247,.05) !important;
    overflow:hidden !important;
}
#private_panel .top_option {
    width:100% !important;
    min-height:70px !important;
    margin:0 !important;
    padding:12px 14px !important;
    display:flex !important;
    align-items:center !important;
    gap:10px !important;
    background:linear-gradient(180deg,rgba(12,47,73,.96),rgba(7,30,47,.96)) !important;
    border-bottom:1px solid rgba(61,181,245,.22) !important;
}
#private_panel .close_option { flex:0 0 44px !important; float:none !important; }
#private_panel .inner_top_option {
    height:auto !important;
    flex:1 1 auto !important;
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:10px !important;
    float:none !important;
}
#private_panel .private_target {
    margin:0 !important;
    padding:0 !important;
    color:#f2f8fc !important;
    font-size:18px !important;
    font-weight:800 !important;
    letter-spacing:.01em;
}
#private_panel .panel_element {
    width:100% !important;
    height:calc(100% - 70px) !important;
    min-height:0 !important;
    margin:0 !important;
    padding:12px !important;
    display:flex !important;
    flex-direction:column !important;
    gap:10px !important;
    cursor:default !important;
    background:#061827 !important;
}
#private_panel #private_chat {
    flex:1 1 auto !important;
    min-height:0 !important;
    overflow:hidden !important;
}
#private_panel #private_chat ul,
#private_panel #show_private {
    width:100% !important;
    height:100% !important;
    margin:0 !important;
    padding:14px !important;
    overflow-x:hidden !important;
    overflow-y:auto !important;
    border:1px solid rgba(64,160,220,.18) !important;
    border-radius:14px !important;
    background:linear-gradient(180deg,#082137 0%,#071d30 100%) !important;
}
#private_panel #show_private li {
    width:auto !important;
    min-width:0 !important;
    max-width:82% !important;
    margin:5px 0 9px !important;
    padding:9px 11px 7px !important;
    border:1px solid transparent !important;
    border-radius:14px !important;
    color:#eef8ff !important;
    line-height:1.35 !important;
    box-shadow:0 6px 14px rgba(0,0,0,.12) !important;
}
#private_panel #show_private li.hunter_private {
    float:left !important;
    clear:both !important;
    background:#0d3b5a !important;
    border-color:rgba(70,181,244,.24) !important;
    border-bottom-left-radius:5px !important;
}
#private_panel #show_private li.target_private {
    float:right !important;
    clear:both !important;
    background:linear-gradient(180deg,#0d78bd,#09669f) !important;
    border-color:rgba(91,208,255,.34) !important;
    border-bottom-right-radius:5px !important;
}
#private_panel #show_private li p { margin:0 !important; color:inherit !important; }
#private_panel .ptime,
#private_panel .ptime2 {
    margin-top:4px !important;
    padding:0 !important;
    color:#9bb8ca !important;
    font-size:10px !important;
    opacity:.82 !important;
}
#private_panel .target_private .ptime,
#private_panel .target_private .ptime2 { color:#d1efff !important; }
#private_panel #private_input_wrap {
    flex:0 0 50px !important;
    width:100% !important;
    height:50px !important;
}
#private_panel #private_input,
#private_panel #input_private,
#private_panel #priv_inside { min-height:50px !important; height:50px !important; }
#private_panel #input_private {
    border:1px solid rgba(52,175,240,.28) !important;
    border-radius:12px !important;
    background:#09233a !important;
}
#private_panel #private_content {
    width:100% !important;
    height:48px !important;
    padding:0 13px !important;
    border:0 !important;
    background:transparent !important;
    color:#eef9ff !important;
    font-size:14px !important;
    outline:0 !important;
}
#private_panel #private_content::placeholder { color:#7896aa !important; }
#private_panel #p_image {
    width:48px !important;
    color:#79bee6 !important;
    background:transparent !important;
}
#private_panel #submit_private {
    min-width:70px !important;
    height:50px !important;
    border:0 !important;
    border-radius:11px !important;
    background:linear-gradient(180deg,#17aaf3,#0878c2) !important;
    box-shadow:0 8px 20px rgba(4,125,195,.24) !important;
    color:#fff !important;
}

/* Logout dialog aligned with the VOXGAB shell instead of the legacy grey theme. */
#logout_box.voxgab-logout-modal {
    width:min(390px,calc(100vw - 32px)) !important;
    min-height:0 !important;
    height:auto !important;
    margin:0 !important;
    padding:24px !important;
    top:50% !important;
    left:50% !important;
    transform:translate(-50%,-50%) !important;
    border:1px solid rgba(52,184,249,.30) !important;
    border-radius:18px !important;
    background:radial-gradient(circle at 50% 0,rgba(29,150,226,.12),transparent 40%),linear-gradient(180deg,#082137,#061724) !important;
    color:#eaf7ff !important;
    box-shadow:0 30px 80px rgba(0,0,0,.56),0 0 0 9999px rgba(1,9,16,.62) !important;
}
#logout_box .voxgab-logout-close {
    width:38px !important;
    height:38px !important;
    margin:0 !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    float:right !important;
    border:1px solid rgba(83,173,230,.24) !important;
    border-radius:10px !important;
    background:#0c2b43 !important;
    color:#dff4ff !important;
    cursor:pointer;
}
#logout_box .voxgab-logout-mark {
    width:58px;
    height:58px;
    margin:8px auto 12px;
    display:flex;
    align-items:center;
    justify-content:center;
    border:1px solid rgba(52,190,255,.38);
    border-radius:18px;
    background:linear-gradient(180deg,rgba(17,141,216,.34),rgba(8,73,119,.28));
    color:#62d5ff;
    font-size:23px;
}
#logout_box .logout_h2 {
    clear:both;
    margin:0 0 8px !important;
    padding:0 !important;
    color:#f3fbff !important;
    font-size:24px !important;
}
#logout_box .logout_text {
    margin:0 auto 20px !important;
    padding:0 !important;
    max-width:300px;
    color:#98b4c7 !important;
    font-size:13px !important;
    line-height:1.55 !important;
}
#logout_box .voxgab-logout-actions {
    display:grid;
    grid-template-columns:1fr 1fr;
    gap:10px;
}
#logout_box .voxgab-logout-actions .out_button {
    width:100% !important;
    min-height:46px !important;
    margin:0 !important;
    float:none !important;
    border:1px solid rgba(62,161,222,.30) !important;
    border-radius:11px !important;
    background:#0c2a41 !important;
    color:#e8f7ff !important;
    font-size:14px !important;
}
#logout_box .voxgab-logout-actions .voxgab-logout-confirm {
    border-color:rgba(52,188,255,.55) !important;
    background:linear-gradient(180deg,#139fe7,#0876ba) !important;
    color:#fff !important;
}

/* ========================================================================== */
/* Phase 2 / Patch 6 Hotfix 3 — desktop PM containment + stable logout modal */
/* ========================================================================== */
@media (min-width:769px) {
    /* Desktop only: keep every PM bubble inside the conversation viewport. */
    #private_panel #show_private {
        display:flex !important;
        flex-direction:column !important;
        align-items:stretch !important;
        box-sizing:border-box !important;
    }
    #private_panel #show_private li {
        float:none !important;
        clear:none !important;
        box-sizing:border-box !important;
        width:auto !important;
        min-width:0 !important;
        max-width:calc(100% - 28px) !important;
        overflow-wrap:anywhere !important;
        word-break:break-word !important;
    }
    #private_panel #show_private li.hunter_private {
        align-self:flex-start !important;
    }
    #private_panel #show_private li.target_private {
        align-self:flex-end !important;
    }
    #private_panel #show_private li p {
        max-width:100% !important;
        overflow-wrap:anywhere !important;
        word-break:break-word !important;
    }

    /* Desktop logout must be centered from its first painted frame. */
    #logout_box.voxgab-logout-modal {
        position:fixed !important;
        top:50% !important;
        left:50% !important;
        right:auto !important;
        bottom:auto !important;
        margin:0 !important;
        transform:translate(-50%,-50%) !important;
        transform-origin:center center !important;
    }
}

/* Phase 2 / Patch 6 Hotfix 4 — friends panel cleanup and live friend preview. */
#chat_panel #friend_container > ul {
    width:100% !important;
    margin:0 !important;
    padding:0 !important;
    display:flex !important;
    flex-direction:column !important;
    gap:8px !important;
    list-style:none !important;
    box-sizing:border-box !important;
}
#chat_panel .voxgab-friend-card {
    width:100% !important;
    min-height:68px !important;
    margin:0 !important;
    padding:10px 12px !important;
    display:grid !important;
    grid-template-columns:44px minmax(0,1fr) auto !important;
    align-items:center !important;
    gap:10px !important;
    border:1px solid rgba(74,158,219,.26) !important;
    border-radius:13px !important;
    background:linear-gradient(180deg,rgba(14,52,78,.96),rgba(9,38,58,.96)) !important;
    box-sizing:border-box !important;
    overflow:hidden !important;
}
#chat_panel .voxgab-friend-profile,
#chat_panel .voxgab-friend-action {
    appearance:none !important;
    border:0 !important;
    padding:0 !important;
    margin:0 !important;
    background:transparent !important;
    color:inherit !important;
    cursor:pointer !important;
}
#chat_panel .voxgab-friend-profile {
    width:44px !important;
    height:44px !important;
}
#chat_panel .voxgab-friend-avatar-wrap {
    position:relative !important;
    width:44px !important;
    height:44px !important;
    display:block !important;
}
#chat_panel .voxgab-friend-card .avatar_userlist {
    width:44px !important;
    height:44px !important;
    margin:0 !important;
    float:none !important;
    display:block !important;
    border-radius:50% !important;
    border:1px solid rgba(53,187,255,.50) !important;
    object-fit:cover !important;
}
#chat_panel .voxgab-presence-dot {
    position:absolute !important;
    right:0 !important;
    bottom:1px !important;
    width:10px !important;
    height:10px !important;
    border:2px solid #09263a !important;
    border-radius:50% !important;
    background:#7892a5 !important;
}
#chat_panel .voxgab-presence-dot.is-online { background:#2ee58b !important; }
#chat_panel .voxgab-presence-dot.is-away { background:#ffc857 !important; }
#chat_panel .voxgab-friend-main {
    min-width:0 !important;
    text-align:center !important;
    justify-self:stretch !important;
}
#chat_panel .voxgab-friend-name,
#chat_panel .voxgab-friend-state {
    display:block !important;
    overflow:hidden !important;
    text-overflow:ellipsis !important;
    white-space:nowrap !important;
}
#chat_panel .voxgab-friend-name {
    color:#f2f8fc !important;
    font-size:16px !important;
    line-height:1.2 !important;
    font-weight:800 !important;
}
#chat_panel .voxgab-friend-state {
    margin-top:3px !important;
    color:#8fadc1 !important;
    font-size:11px !important;
}
#chat_panel .voxgab-friend-actions {
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    gap:6px !important;
}
#chat_panel .voxgab-friend-action {
    width:38px !important;
    height:38px !important;
    display:flex !important;
    align-items:center !important;
    justify-content:center !important;
    border:1px solid rgba(64,166,229,.30) !important;
    border-radius:10px !important;
    background:rgba(11,48,73,.82) !important;
    color:#bfe8ff !important;
    font-size:16px !important;
}
#chat_panel .voxgab-friend-action:hover {
    border-color:#28baff !important;
    background:rgba(15,91,139,.74) !important;
    color:#fff !important;
}
#chat_panel .voxgab-friend-remove {
    color:#f4f8fb !important;
}
#chat_panel .voxgab-pending-card {
    width:100% !important;
    margin:0 0 8px !important;
    padding:10px 12px !important;
    border:1px solid rgba(74,158,219,.24) !important;
    border-radius:13px !important;
    background:linear-gradient(180deg,rgba(14,52,78,.96),rgba(9,38,58,.96)) !important;
    box-sizing:border-box !important;
}
#chat_panel .voxgab-pending-card .friend_top {
    display:grid !important;
    grid-template-columns:40px minmax(0,1fr) 40px !important;
    align-items:center !important;
    min-height:44px !important;
}
#chat_panel .voxgab-pending-profile {
    grid-column:1 !important;
    width:40px !important;
    height:40px !important;
    border:1px solid rgba(64,166,229,.30) !important;
    border-radius:10px !important;
    background:rgba(11,48,73,.82) !important;
    color:#bfe8ff !important;
}
#chat_panel .voxgab-pending-card .friend_name {
    grid-column:2 !important;
    width:auto !important;
    float:none !important;
    text-align:center !important;
}
#chat_panel .voxgab-pending-card .friend_name p {
    margin:0 !important;
    padding:0 !important;
    text-align:center !important;
    font-weight:800 !important;
}
#chat_panel .voxgab-pending-actions {
    margin-top:9px !important;
    display:grid !important;
    grid-template-columns:1fr 1fr !important;
    gap:8px !important;
}
#chat_panel .voxgab-pending-actions .friend_menu_button {
    width:100% !important;
    min-height:38px !important;
    margin:0 !important;
    float:none !important;
    border-radius:9px !important;
}
/* Keep the active friend's nickname visually centered even with action controls. */
#chat_panel .voxgab-friend-card .voxgab-friend-main { padding-left:6px !important; }

/* VOXGAB Phase 2 / Patch 6 Hotfix 6 — narrow Friends panel containment.
   The Friends drawer is intentionally narrow on desktop. Keep the identity
   column readable and move actions beneath it instead of squeezing the name. */
#chat_panel .voxgab-friend-card {
    grid-template-columns:44px minmax(0,1fr) !important;
    grid-template-rows:auto auto !important;
    column-gap:12px !important;
    row-gap:7px !important;
    align-items:center !important;
    min-height:88px !important;
}
#chat_panel .voxgab-friend-profile {
    grid-column:1 !important;
    grid-row:1 / span 2 !important;
    align-self:center !important;
    justify-self:center !important;
}
#chat_panel .voxgab-friend-main {
    grid-column:2 !important;
    grid-row:1 !important;
    width:100% !important;
    min-width:0 !important;
    padding:0 !important;
    align-self:end !important;
    justify-self:stretch !important;
    text-align:center !important;
}
#chat_panel .voxgab-friend-name {
    width:100% !important;
    overflow:visible !important;
    text-overflow:clip !important;
    white-space:normal !important;
    overflow-wrap:anywhere !important;
    word-break:break-word !important;
    text-align:center !important;
    font-size:15px !important;
    line-height:1.15 !important;
}
#chat_panel .voxgab-friend-state {
    text-align:center !important;
}
#chat_panel .voxgab-friend-actions {
    grid-column:2 !important;
    grid-row:2 !important;
    width:100% !important;
    min-width:0 !important;
    justify-content:center !important;
    align-self:start !important;
}
#chat_panel .voxgab-friend-action {
    flex:0 0 38px !important;
}

/* VOXGAB Phase 2 / Patch 6 Hotfix 7 — desktop Rooms + Activity visual cleanup.
   Desktop-only ownership: do not modify mobile48.css/js. */

/* Similar Rooms: remove the inherited legacy theme grey from result cards/actions. */
#matching_panel .voxgab-matching-context {
    border-color:rgba(49,196,255,.24) !important;
    background:linear-gradient(180deg,rgba(12,48,73,.90),rgba(8,34,53,.90)) !important;
    color:#b8d3e5 !important;
}
#matching_panel .voxgab-matching-context strong {
    color:#eef9ff !important;
}
#matching_panel .voxgab-match-card {
    border:1px solid rgba(74,158,219,.24) !important;
    background:linear-gradient(180deg,rgba(14,49,73,.94),rgba(8,32,50,.96)) !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.02) !important;
}
#matching_panel .voxgab-match-room-name {
    color:#66d3ff !important;
}
#matching_panel .voxgab-match-score,
#matching_panel .voxgab-match-meta,
#matching_panel .voxgab-match-reason {
    color:#a8bfd1 !important;
    opacity:1 !important;
}
#matching_panel .voxgab-match-tags span {
    border:1px solid rgba(49,196,255,.12) !important;
    background:rgba(26,105,151,.22) !important;
    color:#d9effc !important;
}
#matching_panel .voxgab-match-enter.sub_button {
    width:100% !important;
    min-height:42px !important;
    border:1px solid rgba(36,185,255,.66) !important;
    border-radius:9px !important;
    background:linear-gradient(180deg,rgba(17,156,239,.84),rgba(10,113,186,.80)) !important;
    color:#fff !important;
    font-weight:700 !important;
    box-shadow:0 0 16px rgba(20,166,246,.08) !important;
}
#matching_panel .voxgab-match-enter.sub_button:hover,
#matching_panel .voxgab-match-enter.sub_button:focus-visible {
    border-color:#55d0ff !important;
    background:linear-gradient(180deg,rgba(27,174,249,.94),rgba(11,127,205,.92)) !important;
    box-shadow:0 0 18px rgba(20,166,246,.18) !important;
}

/* Activity/History: retire the legacy theme background_box and flat list. */
#history_panel .panel_element {
    width:100% !important;
    height:calc(100% - 74px) !important;
    margin:0 !important;
    padding:12px 14px 24px !important;
    overflow:hidden !important;
}
#history_panel #history_container {
    height:100% !important;
    overflow-y:auto !important;
    overflow-x:hidden !important;
    padding:0 !important;
    background:transparent !important;
    scrollbar-width:thin;
    scrollbar-color:rgba(54,180,245,.38) transparent;
}
#history_panel #ul_history,
#history_panel .background_box {
    width:100% !important;
    min-height:100% !important;
    height:auto !important;
    margin:0 !important;
    padding:0 !important;
    list-style:none !important;
    background:transparent !important;
    color:#dceeff !important;
    border:0 !important;
    box-sizing:border-box !important;
}
#history_panel #ul_history > li {
    width:100% !important;
    margin:0 0 8px !important;
    padding:9px 11px !important;
    border:1px solid rgba(74,158,219,.18) !important;
    border-radius:10px !important;
    background:linear-gradient(180deg,rgba(14,48,71,.90),rgba(8,33,51,.92)) !important;
    color:#e6f4ff !important;
    line-height:1.35 !important;
    overflow:hidden !important;
    box-sizing:border-box !important;
}
#history_panel #ul_history > li.system {
    border-color:rgba(127,151,169,.14) !important;
    background:rgba(9,31,47,.76) !important;
    color:#92aabd !important;
}
#history_panel .datechat {
    color:#6f91a8 !important;
    font-size:10px !important;
    font-weight:700 !important;
}
#history_panel .username {
    color:#31c4ff !important;
    font-weight:800 !important;
}
#history_panel #history_container a {
    color:#58ceff !important;
    text-decoration:none !important;
}
#history_panel #history_container a:hover {
    color:#fff !important;
    text-decoration:underline !important;
}
#history_panel #ul_history img,
#history_panel #ul_history video,
#history_panel #ul_history iframe,
#history_panel #ul_history blockquote,
#history_panel #ul_history .twitter-tweet,
#history_panel #ul_history .voxgab-x-embed {
    max-width:100% !important;
    box-sizing:border-box !important;
}
#history_panel #search_history {
    width:min(150px,48%) !important;
    height:38px !important;
    margin:0 !important;
    padding:0 10px !important;
    border:1px solid rgba(74,158,219,.25) !important;
    border-radius:9px !important;
    outline:0 !important;
    background:rgba(8,31,48,.94) !important;
    color:#eaf7ff !important;
    box-sizing:border-box !important;
}
#history_panel #search_history:focus {
    border-color:#29baff !important;
    box-shadow:0 0 0 2px rgba(41,186,255,.10) !important;
}
#history_panel .inner_top_option .top_icon {
    color:#a9d8f2 !important;
}

/* VOXGAB — DM Conversation Header (single row, vertically centered) */
#private_panel .voxgab-dm-conversation-header {
    width: calc(100% - 36px) !important;
    margin: 16px auto 0 !important;
    padding: 0 16px !important;
    display: flex !important;
    align-items: center !important;          /* vertical center */
    justify-content: space-between !important;
    gap: 12px !important;
    min-height: 56px !important;             /* comfortable single-row height */
    height: 56px !important;
    box-sizing: border-box !important;
    border: 1px solid rgba(74, 158, 219, 0.34) !important;
    border-radius: 15px !important;
    background: linear-gradient(180deg, rgba(14, 52, 78, 0.97), rgba(9, 38, 58, 0.97)) !important;
    overflow: hidden !important;
}

#private_panel .voxgab-dm-conversation-name {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: flex !important;
    align-items: center !important;          /* vertical center of the name */
    justify-content: center !important;      /* horizontal center of the name */
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

#private_panel .voxgab-dm-conversation-name .private_target {
    display: block !important;
    width: 100% !important;
    margin: 0 !important;
    padding: 0 8px !important;
    text-align: center !important;
    color: #f2f8fc !important;
    font-size: 18px !important;
    line-height: 1.2 !important;
    font-weight: 800 !important;
    overflow: hidden !important;
    text-overflow: ellipsis !important;
    white-space: nowrap !important;
}

#private_panel .voxgab-dm-conversation-actions {
    flex: 0 0 auto !important;
    display: flex !important;
    align-items: center !important;          /* vertical center of the buttons */
    justify-content: center !important;
    gap: 8px !important;
    height: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
}

#private_panel .voxgab-dm-conversation-action,
#private_panel .voxgab-dm-conversation-actions .add_friend_button {
    width: 40px !important;
    min-width: 40px !important;
    height: 40px !important;
    min-height: 40px !important;
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
    justify-content: center !important;
    border: 1px solid rgba(64, 166, 229, 0.30) !important;
    border-radius: 10px !important;
    background: rgba(11, 48, 73, 0.82) !important;
    color: #f4f8fb !important;
    font-size: 16px !important;
    line-height: 1 !important;
    cursor: pointer !important;
}

#private_panel .voxgab-dm-conversation-action:hover,
#private_panel .voxgab-dm-conversation-actions .add_friend_button:hover {
    border-color: #28baff !important;
    background: rgba(15, 91, 139, 0.74) !important;
    color: #fff !important;
}

#private_panel .voxgab-dm-conversation-action i,
#private_panel .voxgab-dm-conversation-actions .add_friend_button i {
    margin: 0 !important;
    padding: 0 !important;
    line-height: 1 !important;
}

/* VOXGAB Phase 2 / Patch 6 Hotfix 15 — Security Review visual alignment only.
   Scope is intentionally limited to Admin > Security review. */
#main_option #setting_security {
    color:#d9e9f5 !important;
}

#main_option #setting_security > .setting_message_zone,
#main_option #setting_security #security_summary,
#main_option #setting_security #security_policy_panel,
#main_option #setting_security #security_subjects,
#main_option #setting_security #security_detail {
    box-sizing:border-box !important;
    width:100% !important;
    margin:10px 0 !important;
    padding:12px !important;
    border:1px solid rgba(73,155,214,.22) !important;
    border-radius:12px !important;
    background:linear-gradient(180deg,rgba(13,44,67,.94),rgba(8,31,49,.96)) !important;
    color:#d9e9f5 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.015) !important;
}

#main_option #setting_security #security_summary p,
#main_option #setting_security #security_policy_panel p,
#main_option #setting_security #security_subjects p,
#main_option #setting_security #security_detail p {
    color:#c9ddea !important;
}

#main_option #setting_security #security_summary strong,
#main_option #setting_security #security_policy_panel strong,
#main_option #setting_security #security_subjects strong,
#main_option #setting_security #security_detail strong,
#main_option #setting_security label {
    color:#edf8ff !important;
}

#main_option #setting_security .small_text {
    color:#86a7bd !important;
}

#main_option #setting_security .security_subject_row,
#main_option #setting_security .security_policy_row,
#main_option #setting_security #security_policy_panel > .top_separator,
#main_option #setting_security #security_detail > .top_separator {
    box-sizing:border-box !important;
    margin:8px 0 !important;
    padding:10px !important;
    border:1px solid rgba(67,145,202,.16) !important;
    border-radius:10px !important;
    background:rgba(10,35,54,.70) !important;
}

#main_option #setting_security .security_policy_input,
#main_option #setting_security .background_box,
#main_option #setting_security .news_title_zone,
#main_option #setting_security select,
#main_option #setting_security input {
    border:1px solid rgba(78,158,214,.26) !important;
    background:#0b2b43 !important;
    color:#edf8ff !important;
    box-shadow:none !important;
}

#main_option #setting_security .security_policy_input:disabled,
#main_option #setting_security input:disabled,
#main_option #setting_security select:disabled {
    background:#0a2437 !important;
    color:#91aabb !important;
    opacity:1 !important;
}

#main_option #setting_security .success {
    color:#55e2a4 !important;
}

#main_option #setting_security .error {
    color:#ff8c9c !important;
}

/* Phase 4B — user settings width refinement.
   Keep the recovered legacy slide contract: the closed margin must exactly
   match the desktop sheet width. Mobile remains a full viewport sheet. */
@media (min-width:769px) {
    #tools_panel.panelone {
        width:420px !important;
        max-width:420px !important;
        margin-right:-420px !important;
    }
}

/* VOXGAB Phase 5 / Patch 5 — Media Review visual alignment hotfix.
   Scope: Media Review shortcut + Media Review empty state only. */
#main_option #media_review_shortcut {
    width:100% !important;
    min-height:38px !important;
    margin:0 !important;
    padding:6px 8px !important;
    float:none !important;
    border:1px solid rgba(78,153,211,.20) !important;
    border-radius:8px !important;
    background:rgba(17,48,72,.76) !important;
    color:#bcd2e3 !important;
    font-size:11px !important;
    font-weight:600 !important;
    box-sizing:border-box !important;
}
#main_option #media_review_shortcut:hover {
    color:#fff !important;
    border-color:rgba(35,177,255,.54) !important;
    background:linear-gradient(180deg,rgba(19,142,236,.40),rgba(12,95,168,.34)) !important;
    box-shadow:0 0 18px rgba(25,157,248,.12) !important;
}
#main_option #media_review_list .empty_element {
    width:100% !important;
    margin:10px 0 0 !important;
    padding:16px 14px !important;
    border:1px solid rgba(73,155,214,.22) !important;
    border-radius:12px !important;
    background:linear-gradient(180deg,rgba(13,44,67,.94),rgba(8,31,49,.96)) !important;
    color:#d9e9f5 !important;
    box-shadow:inset 0 1px 0 rgba(255,255,255,.015) !important;
    box-sizing:border-box !important;
}
#main_option #media_review_list .empty_element i {
    color:#55e2a4 !important;
}
#main_option #media_review_list .empty_element p {
    margin:0 !important;
    background:transparent !important;
    color:#d9e9f5 !important;
}