/* Theme colors use VS Code workbench identifiers directly. */
:root {
 color-scheme: dark;
 --vscode-editor-background: #1f1f1f; --vscode-editor-foreground: #cccccc;
 --vscode-sideBar-background: #181818; --vscode-foreground: #cccccc;
 --vscode-panel-border: #2b2b2b; --vscode-focusBorder: #0078d4;
 font: 1rem/1.4 Tahoma, Arial, sans-serif;
 background: var(--vscode-editor-background); color: var(--vscode-editor-foreground);
}
* { box-sizing: border-box; }
body { margin: 0; padding: .25rem; font-size: .875rem; }
h1,h2,h3,p { margin: 0; }
h1 { font-size: .875rem; font-weight: 400; }
h2 { font-size: 1.125rem; font-weight: 400; }
h3 { font-size: .875rem; margin: .75rem 0 .25rem; }
p { margin: .35rem 0; overflow-wrap: anywhere; }
button,input,textarea,select { font: inherit; max-width: 100%; min-width: 0; }
button { color: var(--vscode-button-secondaryForeground); background: var(--vscode-button-secondaryBackground); border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); border-radius: 2px; min-height: 1.875rem; padding: .25rem .6rem; cursor: pointer; }
button:hover:enabled { color: var(--vscode-button-secondaryHoverForeground,var(--vscode-button-secondaryForeground)); background: var(--vscode-button-secondaryHoverBackground); }
button:active:enabled,button[aria-pressed=true] { background: var(--vscode-inputOption-activeBackground,var(--vscode-button-secondaryHoverBackground)); border-color: var(--vscode-inputOption-activeBorder,var(--vscode-focusBorder)); }
button:active:enabled:not(.primary),button[aria-pressed=true]:not(.primary) { color: var(--vscode-button-secondaryActiveForeground,var(--vscode-button-secondaryForeground)); }
button.primary { color: var(--vscode-button-foreground); background: var(--vscode-button-background); border-color: var(--vscode-button-border,var(--vscode-contrastBorder,transparent)); }
button.primary:hover:enabled { color: var(--vscode-button-hoverForeground,var(--vscode-button-foreground)); background: var(--vscode-button-hoverBackground); }
button.primary:active:enabled { color: var(--vscode-button-activeForeground,var(--vscode-button-foreground)); background: var(--vscode-inputOption-activeBackground,var(--vscode-button-secondaryHoverBackground)); }
button:disabled,input:disabled,textarea:disabled,select:disabled { opacity: .65; cursor: default; }
input:not([type=checkbox]):not([type=range]),textarea,select { width: 100%; min-height: 1.875rem; padding: .25rem .4rem; border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); border-radius: 0; color: var(--vscode-input-foreground); background: var(--vscode-input-background); border-color: var(--vscode-input-border,var(--vscode-contrastBorder,var(--vscode-panel-border))); }
input[readonly] { background: var(--vscode-button-secondaryBackground); }
select { color: var(--vscode-dropdown-foreground); background: var(--vscode-dropdown-background); border-color: var(--vscode-dropdown-border,var(--vscode-contrastBorder,var(--vscode-panel-border))); }
input::placeholder,textarea::placeholder { color: var(--vscode-input-placeholderForeground); opacity: 1; }
input,textarea { caret-color: var(--vscode-editorCursor-foreground); }
input[type=checkbox],input[type=range],meter { accent-color: var(--vscode-textLink-foreground); }
input[type=checkbox] { vertical-align: middle; margin: 0 .35rem 0 0; }
label { display: block; margin: .55rem 0 .2rem; }
small,.subtle,.count { font-size: .75rem; color: var(--vscode-descriptionForeground); }
small { display: block; margin: .25rem 0; overflow-wrap: anywhere; }
.fields { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,14rem),1fr)); gap: 0 .75rem; }
.fields>div { min-width: 0; }
#notice-settings .fields { grid-template-columns: repeat(2,minmax(0,1fr)); max-width: 48rem; align-items: end; }
#notice-settings .notice-branches .fields { grid-template-columns: repeat(auto-fit,minmax(min(100%,14rem),1fr)); }
.notice-branches summary { min-height: 1.875rem; padding-block: .3rem; }
.actions { display: flex; align-items: center; flex-wrap: wrap; gap: .3rem; }
form>button { margin-top: .5rem; }
details>summary { cursor: pointer; overflow-wrap: anywhere; }
details[open]>summary { margin-bottom: .5rem; }
*:focus-visible { outline: 2px solid var(--vscode-focusBorder); outline-offset: 2px; }
::selection { color: var(--vscode-editor-selectionForeground,var(--vscode-editor-foreground)); background: var(--vscode-editor-selectionBackground); }
* { scrollbar-color: var(--vscode-scrollbarSlider-background) var(--vscode-editor-background); scrollbar-width: thin; }
[hidden] { display: none !important; }
.sr-only,.skip:not(:focus) { position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.skip:focus { display: block; padding: .5rem; color: var(--vscode-textLink-foreground); }
.app-header { color: var(--vscode-titleBar-activeForeground); background: var(--vscode-titleBar-activeBackground); display: flex; align-items: center; flex-wrap: wrap; gap: .2rem .5rem; border-bottom: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); min-height: 2.125rem; }
.app-header h1 { display: flex; align-items: center; gap: .3rem; font-weight: 700; white-space: nowrap; }
.app-header h1 img { flex: none; }
.menu-bar { position: relative; display: flex; align-items: center; flex-wrap: wrap; }
.app-menu { position: relative; }
.app-menu>summary { display: flex; align-items: center; min-height: 1.875rem; padding: .2rem .4rem; margin: 0 !important; }
.app-menu>summary::-webkit-details-marker { display: none; }
.app-menu[open]>summary,.app-menu>summary:hover { color: var(--vscode-menubar-selectionForeground,var(--vscode-titleBar-activeForeground)); background: var(--vscode-menubar-selectionBackground,var(--vscode-toolbar-hoverBackground)); }
.menu-items { position: absolute; top: 100%; left: 0; z-index: 5; width: 15rem; max-width: calc(100vw - 1rem); color: var(--vscode-menu-foreground); background: var(--vscode-menu-background); border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); padding: .2rem; box-shadow: 2px 3px 6px var(--vscode-widget-shadow); }
.menu-items button { color: inherit; display: block; text-align: left; width: 100%; border: 1px solid transparent; background: transparent; }
.menu-items button:hover:enabled,.menu-items button:focus-visible { color: var(--vscode-menu-selectionForeground); background: var(--vscode-menu-selectionBackground); }
#bookmark-menu { position: static; }
#bookmark-menu-list { max-height: min(18rem,50vh); overflow-y: auto; }
#bookmark-menu-list button { overflow-wrap: anywhere; }
.menu-items p { padding: .4rem; font-size: .8125rem; }
.appearance { display: flex; align-items: center; }
.subscription-mode { gap: .25rem; }
.appearance label { margin: 0; font-size: .75rem; }
.appearance select { width: auto; max-width: min(13rem,calc(100vw - 1rem)); min-height: 1.5rem; padding: .1rem .25rem; }
.voice-bar { padding: .1rem .2rem; }
.voice-actions { gap: .1rem; padding-left: .4rem; border-left: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); }
.voice-actions button { color: inherit; position: relative; display: inline-flex; justify-content: center; gap: .35rem; align-items: center; min-width: 1.875rem; padding: .25rem .35rem; background: transparent; border-color: transparent; }
.voice-actions button:hover:enabled { background: var(--vscode-toolbar-hoverBackground); border-color: var(--vscode-toolbar-hoverOutline,transparent); }
.voice-actions button[aria-pressed=true] { background: var(--vscode-toolbar-activeBackground); border-color: var(--vscode-contrastBorder,var(--vscode-panel-border)); }
.voice-actions #mute { margin-left: .35rem; }
#mute[aria-pressed=true]::after,#deafen[aria-pressed=true]::after { content: ''; position: absolute; width: 1.1rem; height: 2px; background: var(--mute-mark,var(--vscode-errorForeground)); transform: rotate(-45deg); }
#audio-status,#output-status { font-size: .75rem; color: inherit; margin: 0; }
.level { display: flex; align-items: center; gap: .4rem; font-size: .75rem; margin-left: auto; }
.level label { margin: 0; }
.level meter { width: 4rem; height: .8rem; }
#speaking { min-width: 7rem; }
#audio-settings,#notice-settings,#appearance-settings,#nickname-settings,#self-description-settings,#bookmark-settings,#talk-request-settings,#away-settings,#poke-settings,#channel-editor,#kick-panel,#channel-position-panel,#channel-delete-settings,#connection-info-panel { font-size: .8125rem; }
#audio-settings>summary,#notice-settings>summary,#appearance-settings>summary,#nickname-settings>summary,#self-description-settings>summary,#bookmark-settings>summary,#talk-request-settings>summary,#away-settings>summary,#poke-settings>summary,#channel-editor>summary,#kick-panel>summary,#channel-position-panel>summary,#channel-delete-settings>summary,#connection-info-panel>summary { min-height: 1.875rem; padding: .3rem .4rem; }
#audio-settings[open] { color: var(--vscode-foreground); background: var(--vscode-sideBar-background); order: 2; flex-basis: 100%; border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); padding: .4rem; }
#notice-settings:not([open]),#appearance-settings:not([open]),#nickname-settings:not([open]),#self-description-settings:not([open]),#bookmark-settings:not([open]),#talk-request-settings:not([open]),#away-settings:not([open]),#poke-settings:not([open]),#channel-editor:not([open]),#kick-panel:not([open]),#channel-position-panel:not([open]),#channel-delete-settings:not([open]),#connection-info-panel:not([open]) { display: none; }
#notice-settings,#appearance-settings,#nickname-settings,#self-description-settings,#bookmark-settings,#talk-request-settings,#away-settings,#poke-settings,#channel-editor,#kick-panel,#channel-position-panel,#channel-delete-settings,#connection-info-panel { padding: .4rem; margin: .5rem 0; border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); background: var(--vscode-sideBar-background); color: var(--vscode-foreground); }
#theme-files { overflow: hidden; }
#voice-permission,#talk-request-status,#talk-request-pending,#output-recovery { order: 1; flex-basis: 100%; margin: .2rem .4rem; }
#ptt-help { font-size: .75rem; color: var(--vscode-descriptionForeground); }
#voice-permission { color: inherit; }
#mic-level-help { margin-top: .5rem; }
#error { border: 1px solid var(--vscode-inputValidation-errorBorder); color: var(--vscode-inputValidation-errorForeground,var(--vscode-editor-foreground)); background: var(--vscode-inputValidation-errorBackground); padding: .5rem; }
#app-status { display: inline; font-size: .75rem; color: var(--vscode-descriptionForeground); }
#app-status:empty { display: none; }
.setup-grid { display: grid; grid-template-columns: repeat(auto-fit,minmax(min(100%,30rem),1fr)); gap: .5rem; }
.connection-card:not([open]),.identity-card:not(:has(#identity-settings[open],#identity-form:not([hidden]))) { display: none; }
.connection-card,.identity-card { margin: .5rem 0; padding: .75rem; border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); background: var(--vscode-sideBar-background); }
.connection-card>summary { font-weight: bold; }
.connection-card section>h2 { font-size: 1rem; margin: .5rem 0; }
.identity-card h2 { font-size: 1rem; margin-bottom: .25rem; }
#identity-readiness { font-size: .75rem; color: var(--vscode-descriptionForeground); }
#identity-lock { margin: .25rem 0; }
#backup-status,#identity-status { font-size: .8125rem; color: var(--vscode-descriptionForeground); }
#identity-settings form+form { border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); margin-top: .75rem; padding-top: .25rem; }
#identity-settings p { max-width: 75ch; }
#connection-advanced,.diagnostics { margin: .75rem 0; }
pre { font-size: .75rem; white-space: pre-wrap; overflow-wrap: anywhere; overflow: auto; max-height: 18rem; }
.daily-client { margin-top: .3rem; }
.workspace { display: grid; grid-template-columns: minmax(17rem,35%) minmax(0,1fr); gap: .25rem; }
.workspace>section { min-width: 0; border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); background: var(--vscode-editor-background); }
.workspace>.channel-panel { color: var(--vscode-sideBar-foreground,var(--vscode-foreground)); background: var(--vscode-sideBar-background); display: flex; flex-direction: column; min-height: 22rem; }
.server-tab { display: flex; gap: .4rem; align-items: center; padding: .3rem .4rem; color: var(--vscode-sideBarTitle-foreground,var(--vscode-sideBar-foreground,var(--vscode-foreground))); background: var(--vscode-sideBarSectionHeader-background,var(--vscode-sideBar-background)); border-bottom: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); }
#server-tree { padding: .2rem; overflow: auto; flex: 1; min-height: 12rem; max-height: 55vh; max-height: min(55dvh,40rem); }
.tree-content { position: relative; width: 100%; }
.tree-row { display: flex; align-items: center; gap: .3rem; min-height: 1.5rem; padding: .15rem .3rem .15rem calc(.3rem + var(--depth,0)*1rem); cursor: default; overflow-wrap: anywhere; }
.tree-content>.tree-row { position: absolute; left: 0; right: 0; }
.tree-row:hover:not([aria-selected=true]) { color: var(--vscode-list-hoverForeground,inherit); background: var(--vscode-list-hoverBackground); }
.tree-row[aria-selected=true] { color: var(--vscode-list-activeSelectionForeground); background: var(--vscode-list-activeSelectionBackground); outline: 1px solid var(--vscode-contrastActiveBorder,transparent); outline-offset: -1px; }
.tree-row[aria-selected=true] .ts-icon { color: var(--vscode-list-activeSelectionIconForeground,var(--vscode-list-activeSelectionForeground)); }
.tree-row.tree-drop-target { outline: 2px solid var(--vscode-list-dropBetweenBackground,var(--vscode-focusBorder)); outline-offset: -2px; }
.tree-row[draggable=true] { cursor: grab; user-select: none; }
.tree-row[data-current=true] .tree-label { font-weight: bold; }
.tree-row .tree-label { min-width: 0; }
.tree-toggle { width: .75rem; height: .75rem; flex: 0 0 .75rem; color: var(--vscode-descriptionForeground); }
.tree-toggle::before { content: ''; display: block; width: 0; height: 0; margin: .15rem; border-left: .35rem solid currentColor; border-top: .25rem solid transparent; border-bottom: .25rem solid transparent; }
.tree-row[aria-expanded=true] .tree-toggle::before { transform: rotate(90deg); }
.tree-row:not([aria-expanded]) .tree-toggle::before { display: none; }
.tree-row[aria-selected=true] .tree-toggle { color: inherit; }
.tree-count { margin-left: auto; font-size: .75rem; padding-left: .5rem; }
.tree-row[aria-selected=true] .tree-count { color: inherit; }
.tree-row[aria-selected=true]:focus-visible { outline: 2px solid var(--vscode-list-focusOutline,var(--vscode-focusBorder)); outline-offset: -2px; }
.join-controls { border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); padding: .35rem .5rem .5rem; background: var(--vscode-sideBar-background); }
.join-controls label { font-size: .75rem; margin: .15rem 0; }
.join-row { display: flex; gap: .3rem; }
.join-row select { flex: 1; }
.join-row button { flex-shrink: 0; }
.info-panel { padding: .65rem; overflow: auto; container: person-info / inline-size; }
.info-panel h2 { color: var(--vscode-textLink-foreground); padding-bottom: .35rem; border-bottom: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); }
#current-channel { color: var(--vscode-descriptionForeground); font-size: .75rem; }
#selection-info dl { display: grid; grid-template-columns: max-content minmax(0,1fr); gap: .35rem 1rem; margin: .75rem 0; }
#selection-info dt { font-weight: bold; }
#selection-info dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
#selection-info p { white-space: pre-wrap; }
@container person-info (max-width: 30rem) {
 #selection-info dl { grid-template-columns: minmax(0,1fr); gap: .15rem; }
 #selection-info dd { margin-bottom: .35rem; }
}
#identity-note { border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); padding-top: .5rem; margin-top: 1rem; }
#people-settings { margin-top: .75rem; }
#clients { list-style: none; margin: .25rem 0 0; padding: 0; max-height: 15rem; overflow: auto; }
#clients li { display: grid; grid-template-columns: minmax(0,1fr) 3rem auto; align-items: center; gap: .15rem .4rem; padding: .35rem; border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); }
#clients .name { grid-column: 1/-1; overflow-wrap: anywhere; }
#clients label { font-size: .75rem; grid-column: 1/-1; margin: 0; }
#clients input { width: 100%; min-width: 0; }
#clients output { font-size: .75rem; font-variant-numeric: tabular-nums; }
#clients button { font-size: .75rem; }
#clients .person-mute { grid-column: 1/-1; justify-self: start; }
.text-panel { overflow: auto; grid-column: 1/-1; display: flex; flex-direction: column; min-height: 26rem; }
#pokes { position: fixed; inset: auto 1rem 1rem auto; margin: 0; width: min(28rem,calc(100vw - 2rem)); max-height: calc(100dvh - 2rem); box-sizing: border-box; overflow: auto; padding: 1rem; border: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); border-radius: .65rem; color: var(--vscode-editor-foreground); background: var(--vscode-editor-background); box-shadow: 0 8px 24px var(--vscode-widget-shadow); }
#poke-summary { margin: 0; font-size: 1.125rem; }
#poke-list { max-height: min(40dvh,16rem); overflow: auto; padding-inline-start: 1.25rem; margin: .5rem 0; overflow-wrap: anywhere; white-space: pre-wrap; }
#poke-list time { color: var(--vscode-descriptionForeground); font-size: .75rem; }
#poke-limit { margin: .25rem 0; }
.empty { padding: .5rem; font-size: .8125rem; color: var(--vscode-descriptionForeground); }
#messages { flex: 1; min-height: 8rem; height: 12rem; overflow: auto; padding: .25rem .4rem; overflow-wrap: anywhere; scrollbar-gutter: stable; }
#messages p { margin: .2rem 0; padding: 0; white-space: pre-wrap; }
#messages .message-meta { color: var(--vscode-textLink-foreground); font-size: .8125rem; }
#messages .message-body { display: inline; }
#new-messages { align-self: flex-start; margin: .25rem; }
.chat-tabs { overflow-x: auto; flex-shrink: 0; display: flex; gap: .1rem; flex-wrap: nowrap; padding: .2rem .25rem 0; background: var(--vscode-editorGroupHeader-tabsBackground); border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); }
#private-chats { display: contents; }
.conversation-controls { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; flex-shrink: 0; }
#conversation-status { flex: 1 1 12rem; margin: 0; padding: .2rem .4rem; overflow-wrap: anywhere; }
#close-conversation { margin: .1rem .25rem; min-height: 1.625rem; }
.private-chat-name { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.chat-tabs button { flex-shrink: 0; max-width: min(20rem,100%); white-space: nowrap; background: var(--vscode-tab-inactiveBackground); color: var(--vscode-tab-inactiveForeground); display: flex; gap: .35rem; align-items: center; border-radius: 0; border-bottom: 0; min-height: 1.625rem; }
.chat-tabs button[aria-pressed=true] { background: var(--vscode-tab-activeBackground); color: var(--vscode-tab-activeForeground); border-color: var(--vscode-tab-activeBorder,var(--vscode-contrastBorder,var(--vscode-panel-border))); }
.chat-tabs button:hover:enabled { background: var(--vscode-tab-hoverBackground,var(--vscode-tab-activeBackground)); color: var(--vscode-tab-hoverForeground,var(--vscode-tab-activeForeground)); }
#chat { position: relative; padding: .3rem .4rem; background: var(--vscode-sideBar-background); flex-shrink: 0; display: grid; grid-template-columns: minmax(0,1fr) auto auto; gap: .25rem .4rem; }
#chat .fields { grid-column: 1/-1; grid-template-columns: repeat(auto-fit,minmax(min(100%,12rem),1fr)); max-width: 36rem; }
#chat .fields>div { display: flex; align-items: center; gap: .35rem; }
#chat label { margin: 0; font-size: .75rem; }
#chat .fields label { flex-shrink: 0; }
#chat .fields select { min-height: 1.5rem; padding: .1rem .25rem; }
#chat>label { grid-column: 1/-1; }
#message { grid-column: 1; }
.composer-footer { display: contents; }
#emoji-open { grid-column: 2; grid-row: 3; }
#send { grid-column: 3; grid-row: 3; }
#emoji-feedback:empty { display: none; }
.emoji-image { width: 1.2em; height: 1.2em; vertical-align: -.2em; }
.emoji-suggestions { position: absolute; bottom: 100%; left: .5rem; z-index: 5; max-height: min(18rem,40dvh); overflow: auto; background: var(--vscode-menu-background); color: var(--vscode-menu-foreground); border: 1px solid var(--vscode-menu-border,var(--vscode-panel-border)); }
.emoji-suggestions button { display: block; width: 100%; text-align: left; }
.emoji-suggestions button[aria-current=true] { background: var(--vscode-list-activeSelectionBackground); color: var(--vscode-list-activeSelectionForeground); }
#emoji-dialog { width: min(30rem,calc(100vw - 2rem)); max-height: min(36rem,90dvh); overflow: auto; }
.emoji-heading { display: flex; justify-content: space-between; align-items: center; gap: 1rem; }
#emoji-search, #emoji-category, #emoji-tone { display: block; width: 100%; }
#emoji-results { display: grid; grid-template-columns: repeat(auto-fill,minmax(2.75rem,1fr)); gap: .2rem; }
#emoji-results button { min-width: 2.75rem; min-height: 2.75rem; font-size: 1.35rem; padding: .2rem; }
#message-help { grid-column: 1/-1; margin: 0; }
#message-bytes { font-variant-numeric: tabular-nums; }
#message-bytes[data-over-limit=true] { color: var(--vscode-errorForeground); font-weight: bold; }
.connection-bar { color: var(--vscode-statusBar-foreground); background: var(--vscode-statusBar-background); display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: .2rem .75rem; min-height: 1.75rem; padding: .2rem .4rem; border-top: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); font-size: .75rem; }
.install-status { display: flex; align-items: center; flex-wrap: wrap; gap: .35rem; }
.install-status button { min-height: 1.5rem; padding: .1rem .35rem; font-size: .75rem; }
#status { margin: 0; }
#connection-detail,#app-status { color: inherit; }
.ts-icon { display: inline-block; flex: 0 0 1rem; width: 1rem; height: 1rem; background: currentColor; color: var(--vscode-icon-foreground); mask: var(--icon-shape) center/contain no-repeat; }
.icon-server { --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 2h18v8H3zm2 2v4h14V4zm-2 8h18v8H3zm2 2v4h14v-4zM6 5h3v2H6zm0 10h3v2H6zm5-10h7v2h-7zm0 10h7v2h-7zM11 20h2v2h-2z'/%3E%3C/svg%3E"); }
.icon-channel,.icon-chat { --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 3h18v13H11l-6 5v-5H3zm2 2v9h2v3l3-3h9V5zM7 7h10v2H7zm0 4h7v2H7z'/%3E%3C/svg%3E"); }
.icon-client {
 --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath fill-rule='evenodd' d='M8 1a7 7 0 1 0 0 14A7 7 0 0 0 8 1zM4 5a5 5 0 0 1 8 0l-.8.6a4 4 0 0 0-6.4 0z'/%3E%3C/svg%3E");
 background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cdefs%3E%3ClinearGradient id='blue' x2='0' y2='1'%3E%3Cstop stop-color='%238db6d8'/%3E%3Cstop offset='.32' stop-color='%2338679b'/%3E%3Cstop offset='.52' stop-color='%231a4a7e'/%3E%3Cstop offset='.82' stop-color='%23336fa5'/%3E%3Cstop offset='1' stop-color='%237ba6c9'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ccircle cx='8' cy='8' r='7.25' fill='%23c6d6e3'/%3E%3Ccircle cx='8' cy='8' r='6.5' fill='url(%23blue)' stroke='%231b3555'/%3E%3Cpath d='M4.4 4.7a4.8 4.8 0 0 1 7.2 0' fill='none' stroke='%23c0d8eb' stroke-width='.8' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E") center/contain no-repeat;
 mask: none;
}
.icon-client-speaking {
 background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cdefs%3E%3ClinearGradient id='blue' x2='0' y2='1'%3E%3Cstop stop-color='%23d1f4ff'/%3E%3Cstop offset='.32' stop-color='%235dc9ff'/%3E%3Cstop offset='.52' stop-color='%23168ee0'/%3E%3Cstop offset='.82' stop-color='%2349bfff'/%3E%3Cstop offset='1' stop-color='%23a2eaff'/%3E%3C/linearGradient%3E%3C/defs%3E%3Ccircle cx='8' cy='8' r='7.25' fill='%23c6d6e3'/%3E%3Ccircle cx='8' cy='8' r='6.5' fill='url(%23blue)' stroke='%231b3555'/%3E%3Cpath d='M4.4 4.7a4.8 4.8 0 0 1 7.2 0' fill='none' stroke='%23ffffff' stroke-width='.8' stroke-linecap='round' opacity='.7'/%3E%3C/svg%3E") center/contain no-repeat;
}
.icon-client-muted {
 --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='5' y='1' width='6' height='9' rx='3'/%3E%3Cpath d='M3 6v2a5 5 0 0 0 10 0V6M8 13v2H5m3 0h3M8 9l6 6m0-6-6 6' fill='none' stroke='black' stroke-width='1.5'/%3E%3C/svg%3E");
 background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Crect x='5' y='1' width='6' height='9' rx='3' fill='%23c5cfd8' stroke='%2336516b'/%3E%3Cpath d='M3 6v2a5 5 0 0 0 10 0V6M8 13v2H5m3 0h3' fill='none' stroke='%2336516b' stroke-width='1.5'/%3E%3Cpath d='M8 9l6 6m0-6-6 6' fill='none' stroke='%23f6eeee' stroke-width='3'/%3E%3Cpath d='M8 9l6 6m0-6-6 6' fill='none' stroke='%23b72d2d' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
.icon-client-local-muted {
 --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='6' cy='4' r='3'/%3E%3Cpath d='M1 15v-3a5 5 0 0 1 8-4M9 9l6 6m0-6-6 6' fill='none' stroke='black' stroke-width='2'/%3E%3C/svg%3E");
 background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Ccircle cx='6' cy='4' r='3' fill='%23c5cfd8' stroke='%2336516b'/%3E%3Cpath d='M1 15v-3a5 5 0 0 1 8-4' fill='%23c5cfd8' stroke='%2336516b'/%3E%3Cpath d='M9 9l6 6m0-6-6 6' fill='none' stroke='%23f6eeee' stroke-width='3'/%3E%3Cpath d='M9 9l6 6m0-6-6 6' fill='none' stroke='%23b72d2d' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
.icon-client-deafened {
 --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 10V8a6 6 0 0 1 12 0v2M8 9l6 6m0-6-6 6' fill='none' stroke='black' stroke-width='2'/%3E%3Crect x='1' y='7' width='4' height='6' rx='1'/%3E%3Crect x='11' y='7' width='4' height='6' rx='1'/%3E%3C/svg%3E");
 background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='M2 10V8a6 6 0 0 1 12 0v2' fill='none' stroke='%23c5cfd8' stroke-width='3'/%3E%3Cpath d='M2 10V8a6 6 0 0 1 12 0v2' fill='none' stroke='%2336516b' stroke-width='1.5'/%3E%3Crect x='1' y='7' width='4' height='6' rx='1' fill='%23c5cfd8' stroke='%2336516b'/%3E%3Crect x='11' y='7' width='4' height='6' rx='1' fill='%23c5cfd8' stroke='%2336516b'/%3E%3Cpath d='M8 9l6 6m0-6-6 6' fill='none' stroke='%23f6eeee' stroke-width='3'/%3E%3Cpath d='M8 9l6 6m0-6-6 6' fill='none' stroke='%23b72d2d' stroke-width='1.8'/%3E%3C/svg%3E") center/contain no-repeat;
}
.icon-connect { --icon-shape: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 3h9v2H6v14h7v2H4zm10 3 7 6-7 6v-5H9v-2h5z'/%3E%3C/svg%3E"); }
@media (min-width:60.01rem) and (min-height:48rem) {
 .daily-client { height: var(--daily-space,calc(100dvh - 10rem)); min-height: 0; display: grid; }
 .workspace { min-height: 0; grid-template-rows: minmax(0,1fr) minmax(15rem,30%); }
 .channel-panel,.text-panel { min-height: 0; }
 #server-tree { min-height: 3rem; }
 #messages { height: auto; min-height: 3rem; }
 body:has(#connection-settings[open],#identity-settings[open],#identity-form:not([hidden]),#audio-settings[open],#notice-settings[open],#appearance-settings[open],#nickname-settings[open],#self-description-settings[open],#bookmark-settings[open],#talk-request-settings[open],#away-settings[open],#poke-settings[open],#channel-editor[open],#kick-panel[open],#channel-position-panel[open],#channel-delete-settings[open],#connection-info-panel[open]) .daily-client { height: auto; display: block; }
 body:has(#connection-settings[open],#identity-settings[open],#identity-form:not([hidden]),#audio-settings[open],#notice-settings[open],#appearance-settings[open],#nickname-settings[open],#self-description-settings[open],#bookmark-settings[open],#talk-request-settings[open],#away-settings[open],#poke-settings[open],#channel-editor[open],#kick-panel[open],#channel-position-panel[open],#channel-delete-settings[open],#connection-info-panel[open]) .workspace { grid-template-rows: auto auto; }
 body:has(#connection-settings[open],#identity-settings[open],#identity-form:not([hidden]),#audio-settings[open],#notice-settings[open],#appearance-settings[open],#nickname-settings[open],#self-description-settings[open],#bookmark-settings[open],#talk-request-settings[open],#away-settings[open],#poke-settings[open],#channel-editor[open],#kick-panel[open],#channel-position-panel[open],#channel-delete-settings[open],#connection-info-panel[open]) .text-panel { min-height: 26rem; }
 body:has(#connection-settings[open],#identity-settings[open],#identity-form:not([hidden]),#audio-settings[open],#notice-settings[open],#appearance-settings[open],#nickname-settings[open],#self-description-settings[open],#bookmark-settings[open],#talk-request-settings[open],#away-settings[open],#poke-settings[open],#channel-editor[open],#kick-panel[open],#channel-position-panel[open],#channel-delete-settings[open],#connection-info-panel[open]) .channel-panel { min-height: 22rem; }
}
@media (max-width:42rem) {
 body { padding: .25rem; }
 .workspace { grid-template-columns: minmax(0,1fr); }
 .info-panel,.text-panel { grid-column: 1; }
 .channel-panel { min-height: 18rem; }
 .level { margin-left: 0; min-width: 0; max-width: 100%; flex-wrap: wrap; }
 #speaking { min-width: 0; }
 .subscription-mode { min-width: 0; max-width: 100%; flex-wrap: wrap; }
 .menu-items { position: fixed; top: var(--menu-top,auto); left: .5rem; max-height: var(--menu-max-height,50dvh); overflow-y: auto; overscroll-behavior: contain; }
 .fields,#notice-settings .fields { grid-template-columns: minmax(0,1fr); }
 #selection-info dl { grid-template-columns: minmax(0,1fr); gap: .15rem; }
 #selection-info dd { margin-bottom: .35rem; }
 .voice-actions { border-left: 0; padding-left: 0; }
 #chat .fields { grid-template-columns: minmax(0,1fr); }
}
@media (pointer:coarse) {
 .tree-row { align-items: center; }
}
@media (forced-colors:active) {
 .tree-row[aria-selected=true] { forced-color-adjust: none; background: Highlight; color: HighlightText; }
 .tree-row[aria-selected=true]:focus-visible { outline-color: HighlightText; }
 .tree-row.tree-drop-target { outline-color: Highlight; }
 button[aria-pressed=true] { border: 2px solid ButtonText; }
 .ts-icon { background: CanvasText; }
 .tree-row[aria-selected=true] .ts-icon { background: HighlightText; }
 .icon-client { mask: var(--icon-shape) center/contain no-repeat; }
 .voice-actions { --tool-ink: ButtonText; --mute-mark: ButtonText; }
 .voice-actions button::before,.voice-actions button::after { forced-color-adjust: none; }
}
.voice-actions button:not(#show-connect):not(#ptt)::before {
 content: ''; width: 1rem; height: 1rem; flex-shrink: 0; background: var(--tool-ink,var(--vscode-icon-foreground)); mask: var(--tool-icon) center/contain no-repeat;
}
#disconnect { --tool-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M4 3h9v2H6v14h7v2H4zm13 4-5 5 5 5 1.4-1.4-2.6-2.6H22v-2h-6.2l2.6-2.6z'/%3E%3C/svg%3E"); }
#reconnect { --tool-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M19 4v3a8 8 0 1 0 1 9l-1.8-1a6 6 0 1 1-1-7H14v2h7V4z'/%3E%3C/svg%3E"); }
#identity-lock { --tool-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M7 10V7a5 5 0 0 1 10 0v3h3v12H4V10zm2 0h6V7a3 3 0 0 0-6 0zm-3 2v8h12v-8zm5 2h2v4h-2z'/%3E%3C/svg%3E"); }
#mute { --tool-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M12 2a4 4 0 0 0-4 4v6a4 4 0 0 0 8 0V6a4 4 0 0 0-4-4zm-2 4a2 2 0 0 1 4 0v6a2 2 0 0 1-4 0zM5 10h2v2a5 5 0 0 0 10 0v-2h2v2a7 7 0 0 1-6 7v2h3v2H8v-2h3v-2a7 7 0 0 1-6-7z'/%3E%3C/svg%3E"); }
#deafen,#audio-resume { --tool-icon: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M3 12a9 9 0 0 1 18 0v8h-6v-9h4a7 7 0 0 0-14 0h4v9H3zm2 1v5h2v-5zm12 0v5h2v-5z'/%3E%3C/svg%3E"); }
html { scroll-padding-block: .5rem; }
button,input,textarea,select,[tabindex] { scroll-margin-block: .25rem; }
/* TS3's two split panes are adjustable by pointer and keyboard. */
.workspace { grid-template-columns: minmax(17rem,var(--tree-width,35%)) .25rem minmax(0,1fr); gap: 0; }
.channel-panel { grid-column: 1; grid-row: 1; }
.info-panel { grid-column: 3; grid-row: 1; }
.text-panel { grid-row: 3; }
.pane-splitter { background: var(--vscode-sideBar-background); touch-action: none; }
.pane-splitter:hover,.pane-splitter:focus-visible { background: var(--vscode-list-hoverBackground); }
#tree-splitter { grid-column: 2; grid-row: 1; cursor: col-resize; }
#chat-splitter { grid-column: 1/-1; grid-row: 2; height: .25rem; display: none; cursor: row-resize; }
.resizing-panes { user-select: none; }
@media (min-width:60.01rem) and (min-height:48rem) {
 .workspace { grid-template-rows: minmax(0,1fr) .25rem minmax(19rem,var(--chat-height,30%)); }
 #chat-splitter { display: block; }
 body:has(#connection-settings[open],#identity-settings[open],#identity-form:not([hidden]),#audio-settings[open],#notice-settings[open],#appearance-settings[open],#nickname-settings[open],#self-description-settings[open],#bookmark-settings[open],#talk-request-settings[open],#away-settings[open],#poke-settings[open],#channel-editor[open],#kick-panel[open],#channel-position-panel[open],#channel-delete-settings[open],#connection-info-panel[open]) #chat-splitter { display: none; }
 body:has(#connection-settings[open],#identity-settings[open],#identity-form:not([hidden]),#audio-settings[open],#notice-settings[open],#appearance-settings[open],#nickname-settings[open],#self-description-settings[open],#bookmark-settings[open],#talk-request-settings[open],#away-settings[open],#poke-settings[open],#channel-editor[open],#kick-panel[open],#channel-position-panel[open],#channel-delete-settings[open],#connection-info-panel[open]) .workspace { grid-template-rows: auto 0 auto; }
}
@media (max-width:42rem) {
 .workspace { grid-template-columns: minmax(0,1fr); gap: .25rem; }
 .channel-panel,.info-panel,.text-panel { grid-column: 1; grid-row: auto; }
 .pane-splitter { display: none !important; }
}
.chat-tabs button[data-unread=true] { font-weight: bold; }
.unread-count { font-variant-numeric: tabular-nums; }

textarea { resize: vertical; min-height: 6rem; }
#talker-status:empty,#kick-status:empty,#channel-position-status:empty,#channel-action-status:empty { display: none; }
#channel-editor small,#kick-panel small,#channel-position-panel small,#channel-delete-settings small { display: block; max-width: 75ch; }

#connection-info-panel p { max-width: 75ch; }
#connection-info-summary { display: grid; grid-template-columns: max-content minmax(0,1fr); gap: .35rem 1rem; }
#connection-info-summary dt { font-weight: bold; }
#connection-info-summary dd { margin: 0; overflow-wrap: anywhere; white-space: pre-wrap; }
#connection-info-table { width: 100%; max-width: 48rem; border-collapse: collapse; table-layout: fixed; margin: .75rem 0; font-variant-numeric: tabular-nums; }
#connection-info-table caption { text-align: left; margin-bottom: .35rem; }
#connection-info-table th,#connection-info-table td { text-align: right; padding: .35rem; overflow-wrap: anywhere; border-bottom: 1px solid var(--vscode-contrastBorder,var(--vscode-panel-border)); }
#connection-info-table th:first-child { text-align: left; width: 44%; }
@media (max-width: 42rem) {
 #connection-info-summary { grid-template-columns: minmax(0,1fr); gap: .15rem; }
 #connection-info-summary dd { margin-bottom: .35rem; }
 #connection-info-table th:first-child { width: 38%; }
}

/* Component-specific compact sizing must not shrink touch targets. */
@media (pointer: coarse) {
 button,
 input:not([type=checkbox]),
 select,
 .tree-row,
 details > summary {
  min-height: 2.75rem !important;
 }
 label:has(input[type=checkbox]),
 label:has(input[type=radio]) {
  display: flex;
  align-items: center;
  min-height: 2.75rem;
 }
 .tree-row { align-items: center; }
}