/* Shared colors for chat, sign-in, and Settings. Theme is set before first paint. */
:root, :root[data-theme="light"] {
  color-scheme: light;
  --text: #173c35;
  --muted: #657a73;
  --subtle: #648071;
  --canvas: #eaf0ed;
  --surface: #ffffff;
  --input: #fbfdfb;
  --header: #f9fbf9;
  --conversation: #eef3ee;
  --hover: #e4f0e9;
  --selected: #e7f2eb;
  --avatar: #dfede6;
  --border: #dce6e1;
  --input-border: #bccfc5;
  --accent: #087f69;
  --primary: #087f69;
  --primary-hover: #086854;
  --sent: #d8efdf;
  --code: #f4f7f5;
  --code-header: #e5eee8;
  --error: #a43131;
  --error-bg: #fff0e8;
  --warning: #833b23;
  --warning-bg: #fff2dc;
  --info: #42705a;
  --info-bg: #e5f1e7;
  --keyword: #6641a5;
  --string: #a3331e;
  --number: #135ca0;
  --comment: #507347;
  --receipt: #087fc3;
  --focus: #87cdb8;
  --pattern: #bdd0c155;
  --highlight: #c1d4c8;
  --toolbar: #ffffff99;
}
:root[data-theme="dark"] {
  color-scheme: dark;
  --text: #eeeeee;
  --muted: #aaaaaa;
  --subtle: #9e9e9e;
  --canvas: #080808;
  --surface: #171717;
  --input: #121212;
  --header: #141414;
  --conversation: #0d0d0d;
  --hover: #292929;
  --selected: #303030;
  --avatar: #2a2a2a;
  --border: #353535;
  --input-border: #505050;
  --accent: #89d8b3;
  --primary: #087f69;
  --primary-hover: #086854;
  --sent: #292929;
  --code: #111111;
  --code-header: #222222;
  --error: #ffaaa0;
  --error-bg: #432922;
  --warning: #f3c783;
  --warning-bg: #40361e;
  --info: #d0d0d0;
  --info-bg: #242424;
  --keyword: #c4a5f3;
  --string: #ffb9a0;
  --number: #95cbff;
  --comment: #a5c493;
  --receipt: #69c8ff;
  --focus: #89d8b3;
  --pattern: #ffffff08;
  --highlight: #454545;
  --toolbar: #171717ee;
  --overlay: #000000a6;
  --video-surface: #080808;
  --shadow-soft: #00000020;
  --shadow-raised: #00000055;
}
select{font:inherit;color:var(--text);background:var(--input);border:1px solid var(--input-border);border-radius:9px;padding:12px;min-height:46px;max-width:100%}
select:focus-visible{outline:3px solid var(--focus);outline-offset:2px}
.appearance-choice{width:100%;max-width:320px}
.settings-dialog .settings-close:hover{color:var(--text)}
.settings-dialog .settings-switch:checked{background:var(--primary);border-color:var(--primary)}

.settings-dialog input.settings-switch:before,.settings-dialog input.settings-switch:checked:before{background:white}

.closed-groups{margin:0 .5rem .5rem;flex:none;max-height:28%;overflow:auto}
.closed-groups>summary{padding:10px 8px;min-height:44px}
.closed-groups .group-list{max-height:none}
.admin-group h3{overflow-wrap:anywhere}.admin-group-members{overflow-wrap:anywhere}