/* VoicerInn Theme Zones v2: appended after all existing styles to control sectors.
   Native theme colors apply by default. .vintheme overrides take precedence; do not alter users' cosmetic name colors. */
body[data-vz-shell] .app { background:var(--vz-shell-background, var(--ui-bg, #111827))!important;color:var(--vz-shell-text, var(--ui-text, #e8f2ff))!important; }
body[data-vz-shell] .topbar {background:var(--vz-shell-surface,var(--vz-shell-background, var(--ui-bg, #111827)))!important;border-color:var(--vz-shell-border, var(--ui-border, #364b66))!important;color:var(--vz-shell-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-shell] .brand strong, body[data-vz-shell] .channel-head strong {color:var(--vz-shell-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-shell] .brand span, body[data-vz-shell] .channel-head small {color:var(--vz-shell-muted, var(--ui-muted, #9fb4ca))!important}
body[data-vz-channels] .sidebar, body[data-vz-channels] .channels-scroll {background:var(--vz-channels-background, var(--ui-bg, #111827))!important;border-color:var(--vz-channels-border, var(--ui-border, #364b66))!important;color:var(--vz-channels-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-channels] .sidebar .channel:not([data-type="voice"]):not(.private-room-channel),body[data-vz-channels] .sidebar .channel-tree:not(:has(> .channel-row .channel[data-type="voice"])) .name {color:var(--vz-channels-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-channels] .sidebar .channel:not([data-type="voice"]):hover {background:var(--vz-channels-surface, var(--ui-panel, #172534))!important}
body[data-vz-channels] .sidebar .channel:not([data-type="voice"]).active{background:var(--vz-channels-surface, var(--ui-panel, #172534))!important;border-color:var(--vz-channels-accent, var(--accent-a, #20d5ff))!important;box-shadow:inset 3px 0 0 var(--vz-channels-accent, var(--accent-a, #20d5ff))}
body[data-vz-channels] .sidebar .section-head, body[data-vz-channels] .sidebar .channel-tree{border-color:var(--vz-channels-border, var(--ui-border, #364b66))!important}
body[data-vz-channels] .sidebar .section-head small{color:var(--vz-channels-muted, var(--ui-muted, #9fb4ca))!important}
body[data-vz-voice] .sidebar .channel[data-type="voice"],body[data-vz-voice] .sidebar .private-room-channel {background:var(--vz-voice-surface, var(--ui-panel, #172534))!important;color:var(--vz-voice-text, var(--ui-text, #e8f2ff))!important;border-color:var(--vz-voice-border, var(--ui-border, #364b66))!important}
body[data-vz-voice] .sidebar .channel[data-type="voice"].active{box-shadow:inset 3px 0 0 var(--vz-voice-accent, var(--accent-a, #20d5ff))!important}
body[data-vz-voice] .voice-dock,body[data-vz-voice] .voice-dock.disconnected,body[data-vz-voice] .voice-member,body[data-vz-voice] .voice-help {background:var(--vz-voice-background, var(--ui-bg, #111827))!important;color:var(--vz-voice-text, var(--ui-text, #e8f2ff))!important;border-color:var(--vz-voice-border, var(--ui-border, #364b66))!important}
body[data-vz-voice] .voice-icon-btn,body[data-vz-voice] .voice-controls button{background:var(--vz-voice-surface, var(--ui-panel, #172534))!important;color:var(--vz-voice-text, var(--ui-text, #e8f2ff))!important;border-color:var(--vz-voice-border, var(--ui-border, #364b66))!important}
body[data-vz-voice] .voice-status,body[data-vz-voice] #voiceStatus{color:var(--vz-voice-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-voice] .voice-info small,body[data-vz-voice] .voice-copy small{color:var(--vz-voice-muted, var(--ui-muted, #9fb4ca))!important}
body[data-vz-voice] .mic-meter i{background:var(--vz-voice-accent, var(--accent-a, #20d5ff))!important}
body[data-vz-people] .members-pane,body[data-vz-people] .members,body[data-vz-people] .right-pane-section {background:var(--vz-people-background, var(--ui-bg, #111827))!important;border-color:var(--vz-people-border, var(--ui-border, #364b66))!important;color:var(--vz-people-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-people] .members-head,body[data-vz-people] .right-pane-tabs,body[data-vz-people] .people-search{background:var(--vz-people-surface, var(--ui-panel, #172534))!important;border-color:var(--vz-people-border, var(--ui-border, #364b66))!important;color:var(--vz-people-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-people] .member,body[data-vz-people] .people-row,body[data-vz-people] .right-pane-tab{color:var(--vz-people-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-people] .member:hover,body[data-vz-people] .people-row:hover,body[data-vz-people] .right-pane-tab.active{background:var(--vz-people-surface, var(--ui-panel, #172534))!important;border-color:var(--vz-people-accent, var(--accent-a, #20d5ff))!important}
body[data-vz-chat]:not([data-vz-dm-active]) .main,body[data-vz-chat]:not([data-vz-dm-active]) #vi243ChatArea {background:var(--vz-chat-background, var(--ui-bg, #111827))!important;color:var(--vz-chat-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-chat]:not([data-vz-dm-active]) .messages{color:var(--vz-chat-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-chat]:not([data-vz-dm-active]) .msg-body,body[data-vz-chat] .message-content{color:var(--vz-chat-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-chat]:not([data-vz-dm-active]) .msg-time,body[data-vz-chat] .system{color:var(--vz-chat-muted, var(--ui-muted, #9fb4ca))!important}
body[data-vz-chat]:not([data-vz-dm-active]) .message:hover,body[data-vz-chat]:not([data-vz-dm-active]) .msg-row:hover{background:var(--vz-chat-surface, var(--ui-panel, #172534))!important}
body[data-vz-chat]:not([data-vz-dm-active]) .msg-row{border-color:var(--vz-chat-border, var(--ui-border, #364b66))!important}
/* DM background is intentionally transparent so shared wallpaper is never covered. */
body[data-vz-dm] .dm-list-panel,body[data-vz-dm] #messagesPaneSection,body[data-vz-dm] .dm-search{background:var(--vz-dm-surface, var(--ui-panel, #172534))!important;border-color:var(--vz-dm-border, var(--ui-border, #364b66))!important}
body[data-vz-dm] .dm-list-panel .channel,body[data-vz-dm] #directMessages .channel{color:var(--vz-dm-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-dm] .dm-list-panel .channel.active{border-color:var(--vz-dm-accent, var(--accent-a, #20d5ff))!important}
body[data-vz-dm] .vi-web-dm-window,body[data-vz-dm] .vi-web-dm-panel{border-color:var(--vz-dm-border, var(--ui-border, #364b66))!important;color:var(--vz-dm-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-composer] .composer,body[data-vz-composer] .composer textarea,body[data-vz-composer] #chatInput{background:var(--vz-composer-background, var(--ui-bg, #111827))!important;border-color:var(--vz-composer-border, var(--ui-border, #364b66))!important;color:var(--vz-composer-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-composer] .composer textarea::placeholder{color:var(--vz-composer-muted, var(--ui-muted, #9fb4ca))!important}
body[data-vz-composer] .composer button[type="submit"]{background:var(--vz-composer-accent, var(--accent-a, #20d5ff))!important;color:var(--vz-composer-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-settings] .settings-card,body[data-vz-settings] .settings-content{background:var(--vz-settings-background, var(--ui-bg, #111827))!important;color:var(--vz-settings-text, var(--ui-text, #e8f2ff))!important;border-color:var(--vz-settings-border, var(--ui-border, #364b66))!important}
body[data-vz-settings] .setting-block,body[data-vz-settings] .settings-nav,body[data-vz-settings] .settings-footer{background:var(--vz-settings-surface, var(--ui-panel, #172534))!important;border-color:var(--vz-settings-border, var(--ui-border, #364b66))!important;color:var(--vz-settings-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-settings] .settings-nav button.active{border-color:var(--vz-settings-accent, var(--accent-a, #20d5ff))!important}
body[data-vz-settings] .settings-card small{color:var(--vz-settings-muted, var(--ui-muted, #9fb4ca))!important}
body[data-vz-hub] .hub-panel,body[data-vz-hub] .hub-card,body[data-vz-hub] .game-card{background-color:var(--vz-hub-background, var(--ui-bg, #111827))!important;border-color:var(--vz-hub-border, var(--ui-border, #364b66))!important;color:var(--vz-hub-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-hub] .hub-panel-head{color:var(--vz-hub-accent, var(--accent-a, #20d5ff))!important}
/* Keep Hub illustrations and approved independent card gradients intact. */
body[data-vz-radio] .vi-radio-panel,body[data-vz-radio] .vi-radio-card,body[data-vz-radio] .vi-radio-station{background:var(--vz-radio-background, var(--ui-bg, #111827))!important;border-color:var(--vz-radio-border, var(--ui-border, #364b66))!important;color:var(--vz-radio-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-radio] .vi-radio-panel button.active{border-color:var(--vz-radio-accent, var(--accent-a, #20d5ff))!important}
body[data-vz-dialogs] .modal-card,body[data-vz-dialogs] .context-menu,body[data-vz-dialogs] .floating{background:var(--vz-dialogs-background, var(--ui-bg, #111827))!important;border-color:var(--vz-dialogs-border, var(--ui-border, #364b66))!important;color:var(--vz-dialogs-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-dialogs] .modal-head{background:var(--vz-dialogs-surface, var(--ui-panel, #172534))!important;color:var(--vz-dialogs-text, var(--ui-text, #e8f2ff))!important}
body[data-vz-buttons] button.primary,body[data-vz-buttons] .primary{background:var(--vz-buttons-accent, var(--accent-a, #20d5ff))!important;color:var(--vz-buttons-text, var(--ui-text, #e8f2ff))!important;border-color:var(--vz-buttons-border, var(--ui-border, #364b66))!important}
body[data-vz-buttons] button.ghost,body[data-vz-buttons] .icon-action{background:var(--vz-buttons-background, var(--ui-bg, #111827))!important;color:var(--vz-buttons-text, var(--ui-text, #e8f2ff))!important;border-color:var(--vz-buttons-border, var(--ui-border, #364b66))!important}
body[data-vz-buttons] button.ghost:hover,body[data-vz-buttons] .icon-action:hover{background:var(--vz-buttons-surface, var(--ui-panel, #172534))!important}
/* Self-contained editor: not affected by the active theme's hard-coded legacy settings rules. */
.vz-editor.hidden{display:none!important}.vz-editor{position:fixed;inset:0;z-index:2147480000;display:grid;place-items:center;background:rgba(0,0,0,.72);padding:16px;color:#eaf2ff;font-family:inherit}
.vz-editor-card{width:min(780px,95vw);max-height:90vh;display:flex;flex-direction:column;min-height:0;background:#111d30;border:1px solid #3a506f;border-radius:16px;box-shadow:0 24px 90px rgba(0,0,0,.55);overflow:hidden}
.vz-editor-head{display:flex;align-items:center;justify-content:space-between;padding:15px 19px;border-bottom:1px solid #33465f}.vz-editor-head strong{font-size:18px}.vz-editor-head button{background:#1c3148;color:#fff;border:1px solid #456181;border-radius:8px;width:36px;height:33px;cursor:pointer}
.vz-editor-description{margin:0;padding:12px 19px;color:#b3c5d9;font-size:13px;line-height:1.45}.vz-editor-layout{display:grid;grid-template-columns:minmax(166px,220px) minmax(0,1fr);min-height:0;overflow:hidden;flex:1}.vz-editor-nav{padding:10px;overflow:auto;border-right:1px solid #33465f;display:flex;flex-direction:column;gap:4px}.vz-editor-nav button{border:1px solid transparent;background:transparent;color:#b4c8e3;border-radius:9px;padding:10px;text-align:left;cursor:pointer;min-height:38px}.vz-editor-nav button.active{background:#1e3b53;color:#fff;border-color:#24bde5}
.vz-editor-fields{display:grid;grid-template-columns:1fr;align-content:start;overflow:auto;gap:7px;padding:15px}.vz-editor-field{display:grid;grid-template-columns:22px minmax(0,1fr) 54px;align-items:center;gap:12px;padding:8px 12px;border:1px solid #344a67;background:#17273d;border-radius:10px;color:#e6f0ff;font-size:13px}.vz-editor-field input[type=color]{width:54px;height:36px;padding:2px;cursor:pointer;border:1px solid #536c86;background:#152439}.vz-editor-field input[type=checkbox]{width:17px;height:17px;accent-color:#25c7ef}.vz-editor-footer{display:flex;align-items:center;justify-content:flex-end;gap:10px;padding:12px 18px;border-top:1px solid #344a64}.vz-editor-footer button{border:1px solid #526a86;border-radius:9px;padding:10px 16px;cursor:pointer;background:#1b3048;color:#e8f4ff}.vz-editor-footer #vzDone{background:#127d9d;border-color:#2caaca;color:white}
@media(max-width:560px){.vz-editor-layout{grid-template-columns:120px minmax(0,1fr)}.vz-editor-nav button{font-size:11px;padding:7px}.vz-editor-field{grid-template-columns:20px minmax(0,1fr) 44px;gap:6px;font-size:12px}.vz-editor-field input[type=color]{width:43px}}

/* Independent DM palette in the integrated chat. Wallpaper stays on its own layer. */
body[data-vz-dm][data-vz-dm-active] .main{background:var(--vz-dm-background, var(--ui-main,#101729))!important;color:var(--vz-dm-text,var(--ui-text,#edf5ff))!important}
body[data-vz-dm][data-vz-dm-active] .msg-body{color:var(--vz-dm-text,var(--ui-text,#edf5ff))!important}
body[data-vz-dm][data-vz-dm-active] .msg-time{color:var(--vz-dm-muted,var(--ui-muted,#b3c3d1))!important}
body[data-vz-dm] .vi-web-dm-window{background:var(--vz-dm-background,var(--ui-panel,#0d1627))!important;color:var(--vz-dm-text,var(--ui-text,#eef5ff))!important;--vi-dm-accent:var(--vz-dm-accent,var(--accent-a,#20c7ed))}
body[data-vz-dm] .vi-web-dm-titlebar,body[data-vz-dm] .vi-web-dm-composer{background:var(--vz-dm-surface,var(--ui-raised,#111d30))!important;border-color:var(--vz-dm-border,var(--ui-border,#3e4d67))!important}
body[data-vz-dm] .vi-web-dm-history:not(.has-wallpaper){background:var(--vz-dm-background,var(--ui-main,#0d1627))!important}
body[data-vz-dm] .vi-web-dm-msg{border-color:var(--vz-dm-border,var(--ui-border,#3e4d67))!important;color:var(--vz-dm-text,var(--ui-text,#f3f7fe))!important}

/* Native theme coverage for controls left behind by legacy hard-coded palette rules. */
body[data-vz-channels] .channel-head,body[data-vz-channels] .channel-group-head{background:var(--vz-channels-surface)!important;border-color:var(--vz-channels-border)!important;color:var(--vz-channels-text)!important}
body[data-vz-channels] .sidebar .channel .count{background:var(--vz-channels-surface)!important;color:var(--vz-channels-muted)!important;border-color:var(--vz-channels-border)!important}
body[data-vz-voice] .voice-panel,body[data-vz-voice] .voice-controls,body[data-vz-voice] .voice-status-panel{background:var(--vz-voice-background)!important;border-color:var(--vz-voice-border)!important;color:var(--vz-voice-text)!important}
body[data-vz-voice] .voice-dock button:hover,body[data-vz-voice] .voice-controls button:hover{border-color:var(--vz-voice-accent)!important}
body[data-vz-people] .member small,body[data-vz-people] .people-row small,body[data-vz-people] .member-state{color:var(--vz-people-muted)!important}
body[data-vz-chat]:not([data-vz-dm-active]) .channel-head,body[data-vz-chat]:not([data-vz-dm-active]) .chat-header{background:var(--vz-chat-surface)!important;border-color:var(--vz-chat-border)!important;color:var(--vz-chat-text)!important}
body[data-vz-chat]:not([data-vz-dm-active]) .msg-head .msg-time{color:var(--vz-chat-muted)!important}
body[data-vz-settings] .settings-card button:not(.primary):hover,body[data-vz-settings] .settings-nav button:hover{border-color:var(--vz-settings-accent)!important}
body[data-vz-settings] .settings-card input:not([type=color]):not([type=checkbox]),body[data-vz-settings] .settings-card select,body[data-vz-settings] .settings-card textarea{background:var(--vz-settings-surface)!important;color:var(--vz-settings-text)!important;border-color:var(--vz-settings-border)!important}
body[data-vz-radio] .vi-radio-panel button:hover{border-color:var(--vz-radio-accent)!important}
body[data-vz-composer] .composer button{border-color:var(--vz-composer-border)!important}
body[data-vz-dialogs] .modal-card input:not([type=color]),body[data-vz-dialogs] .modal-card select{background:var(--vz-dialogs-surface)!important;color:var(--vz-dialogs-text)!important;border-color:var(--vz-dialogs-border)!important}
/* Native themed scrollbars; keep draggable thumb and proper light/dark contrast. */
body[data-vz-settings] .settings-content,body[data-vz-settings] .settings-nav,
body[data-vz-channels] .channels-scroll,body[data-vz-people] .members,
body[data-vz-chat] .messages{scrollbar-width:thin;scrollbar-color:var(--vz-settings-accent) transparent}
body[data-vz-channels] .channels-scroll{scrollbar-color:var(--vz-channels-accent) transparent}
body[data-vz-people] .members{scrollbar-color:var(--vz-people-accent) transparent}
body[data-vz-chat] .messages{scrollbar-color:var(--vz-chat-accent) transparent}
body[data-vz-settings] .settings-content::-webkit-scrollbar,body[data-vz-settings] .settings-nav::-webkit-scrollbar,
body[data-vz-channels] .channels-scroll::-webkit-scrollbar,body[data-vz-people] .members::-webkit-scrollbar,
body[data-vz-chat] .messages::-webkit-scrollbar{width:8px;height:8px}
body[data-vz-settings] .settings-content::-webkit-scrollbar-thumb,body[data-vz-settings] .settings-nav::-webkit-scrollbar-thumb{background:var(--vz-settings-border);border-radius:99px}
body[data-vz-channels] .channels-scroll::-webkit-scrollbar-thumb{background:var(--vz-channels-border);border-radius:99px}
body[data-vz-people] .members::-webkit-scrollbar-thumb{background:var(--vz-people-border);border-radius:99px}
body[data-vz-chat] .messages::-webkit-scrollbar-thumb{background:var(--vz-chat-border);border-radius:99px}


/* Theme consistency v2.2: top header, in-app messages and all feedback overlays. */
body[data-theme-mode][data-vz-shell] .topbar,
body[data-theme-mode][data-vz-shell].has-user-bg .topbar,
body[data-theme-mode][data-vz-shell] .top-actions,
body[data-theme-mode][data-vz-shell] .channel-head {
  background:var(--vz-shell-surface)!important;
  border-color:var(--vz-shell-border)!important;
  color:var(--vz-shell-text)!important;
}
body[data-theme-mode][data-vz-shell] .channel-head {background:transparent!important}
body[data-theme-mode][data-vz-shell] .topbar :is(strong,small,.channel-head strong,.channel-head small) {color:var(--vz-shell-text)!important}
body[data-theme-mode][data-vz-shell] .topbar .channel-head small {color:var(--vz-shell-muted)!important}
body[data-vz-shell] .topbar .identity {background:var(--vz-shell-background)!important;border-color:var(--vz-shell-border)!important}
body[data-vz-shell] .topbar .icon-action,
body[data-vz-shell] .topbar .ghost {background:var(--vz-shell-background)!important;border-color:var(--vz-shell-border)!important;color:var(--vz-shell-text)!important;box-shadow:none!important}
body[data-vz-shell] .topbar .icon-action:hover,
body[data-vz-shell] .topbar .ghost:hover {background:var(--vz-shell-surface)!important;border-color:var(--vz-shell-accent)!important}
body[data-theme-mode][data-vz-dialogs] .app-notification,
body[data-theme-mode][data-vz-dialogs] #notificationStack .app-notification,
body[data-theme-mode][data-vz-dialogs] .toast,
body[data-theme-mode][data-vz-dialogs] .system {
 background:var(--vz-dialogs-background)!important;
 border:1px solid var(--vz-dialogs-border)!important;
 color:var(--vz-dialogs-text)!important;
 box-shadow:0 12px 28px rgba(0,0,0,.18)!important;
}
body[data-vz-dialogs] .app-notification :is(.notify-copy strong,.notify-body,.notify-sender) {color:var(--vz-dialogs-text)!important}
body[data-vz-dialogs] .app-notification :is(.notify-close,.notify-copy small) {color:var(--vz-dialogs-muted)!important}
body[data-vz-dialogs] .app-notification .notify-icon {background:var(--vz-dialogs-surface)!important;color:var(--vz-dialogs-accent)!important;border:1px solid var(--vz-dialogs-border)!important}
body[data-vz-dialogs] .toast.error {border-color:#c45166!important;color:var(--vz-dialogs-text)!important}
body[data-vz-dialogs] .app-notification:hover {border-color:var(--vz-dialogs-accent)!important}
body[data-vz-dialogs] .vz-editor-card {background:var(--vz-dialogs-background)!important;border-color:var(--vz-dialogs-border)!important;color:var(--vz-dialogs-text)!important}
body[data-vz-dialogs] .vz-editor-head,body[data-vz-dialogs] .vz-editor-footer,body[data-vz-dialogs] .vz-editor-nav {border-color:var(--vz-dialogs-border)!important}
body[data-vz-dialogs] .vz-editor-description,body[data-vz-dialogs] .vz-editor-nav button {color:var(--vz-dialogs-muted)!important}
body[data-vz-dialogs] .vz-editor-field {background:var(--vz-dialogs-surface)!important;border-color:var(--vz-dialogs-border)!important;color:var(--vz-dialogs-text)!important}
body[data-vz-dialogs] .vz-editor-nav button.active {background:var(--vz-dialogs-surface)!important;border-color:var(--vz-dialogs-accent)!important;color:var(--vz-dialogs-text)!important}