.icon-btn {
    width: 40px; height: 40px; border: 1px solid var(--border); border-radius: 12px;
    display:grid; place-items:center; background: var(--surface); color: var(--muted); cursor:pointer;
    transition: .2s var(--ease);
}
.icon-btn:hover { color: var(--text-strong); border-color: var(--border-strong); transform: translateY(-1px); background: var(--surface-hover); }
.icon-btn.subtle { border:0; background:transparent; }
.mobile-menu { display:none; }
.btn { min-height: 40px; padding: 0 15px; display:inline-flex; align-items:center; justify-content:center; gap:8px; border-radius:12px; border:1px solid var(--border); cursor:pointer; font-weight:700; font-size:13px; transition:.2s var(--ease); }
.btn:hover { transform:translateY(-1px); }
.btn-primary { color:#fff; background:var(--accent); border-color:var(--accent); box-shadow:0 8px 20px rgba(13,156,166,.16); }
.btn-primary:hover { background:var(--accent-strong); }
.btn-secondary { background:var(--surface); color:var(--text); }
.text-button, .text-link { border:0; background:transparent; display:inline-flex; align-items:center; gap:4px; color:var(--muted); font-size:12px; font-weight:700; cursor:pointer; }
.text-button:hover, .text-link:hover { color:var(--accent-strong); }
.status-dot { width:7px; height:7px; display:inline-block; border-radius:50%; background:#36b978; box-shadow:0 0 0 4px rgba(54,185,120,.10); }
.connection-pill { min-height:38px; padding:0 13px; display:inline-flex; align-items:center; gap:8px; border:1px solid var(--border); background:var(--surface); border-radius:12px; color:var(--text); font-size:12px; font-weight:700; box-shadow:var(--shadow-sm); }
.global-search { width:min(350px,30vw); min-height:40px; display:flex; align-items:center; gap:9px; padding:0 11px; background:var(--surface); border:1px solid var(--border); border-radius:12px; color:var(--muted); }
.global-search input { flex:1; min-width:0; border:0; background:transparent; color:var(--text); font-size:12.5px; }
.global-search input::placeholder { color:var(--muted-2); }
.global-search kbd { padding:2px 6px; border:1px solid var(--border); background:var(--surface-2); color:var(--muted); border-radius:6px; font-size:9px; box-shadow:none; }
.notification-btn { position:relative; }
.notification-dot { position:absolute; right:8px; top:8px; width:6px; height:6px; background:#df6c6c; border:2px solid var(--surface-solid); border-radius:50%; }
.profile-chip { height:42px; display:flex; align-items:center; gap:9px; padding:4px 8px 4px 5px; border:1px solid var(--border); border-radius:13px; background:var(--surface); cursor:pointer; }
.profile-copy { display:grid; text-align:left; line-height:1.18; }
.profile-copy strong { font-size:11.5px; color:var(--text-strong); }
.profile-copy small { margin-top:2px; font-size:9px; color:var(--muted); }
.avatar { width:36px; height:36px; flex:0 0 auto; display:grid; place-items:center; border-radius:12px; background:linear-gradient(145deg,var(--accent-soft),color-mix(in srgb,var(--accent-soft) 35%, var(--surface-2))); color:var(--accent-strong); font-weight:800; font-size:11px; border:1px solid color-mix(in srgb,var(--accent) 12%,transparent); }
.avatar-sm { width:31px; height:31px; border-radius:10px; font-size:10px; }
.avatar-lg { width:42px; height:42px; border-radius:13px; }
.avatar-xl { width:66px; height:66px; border-radius:20px; font-size:16px; }
.channel-logo { width:36px; height:36px; flex:0 0 auto; display:grid; place-items:center; border-radius:12px; }
.channel-logo.cyan, .channel-pill.cyan, .mini-channel.cyan { color:#0b8790; background:#e1f7f7; }
.channel-logo.green, .channel-pill.green, .mini-channel.green { color:#168c55; background:#e2f7ec; }
.channel-logo.blue, .channel-pill.blue, .mini-channel.blue { color:#3477d9; background:#e7efff; }
.channel-logo.pink, .channel-pill.pink, .mini-channel.pink { color:#c4507f; background:#fae7ef; }
.channel-logo.violet, .channel-pill.violet, .mini-channel.violet { color:#7759c9; background:#eee9fb; }
html[data-theme="dark"] .channel-logo.cyan, html[data-theme="dark"] .channel-pill.cyan, html[data-theme="dark"] .mini-channel.cyan { background:rgba(29,177,186,.14); color:#68d0d5; }
html[data-theme="dark"] .channel-logo.green, html[data-theme="dark"] .channel-pill.green, html[data-theme="dark"] .mini-channel.green { background:rgba(56,185,117,.13); color:#65d39d; }
html[data-theme="dark"] .channel-logo.blue, html[data-theme="dark"] .channel-pill.blue, html[data-theme="dark"] .mini-channel.blue { background:rgba(73,127,212,.15); color:#83adf1; }
html[data-theme="dark"] .channel-logo.pink, html[data-theme="dark"] .channel-pill.pink, html[data-theme="dark"] .mini-channel.pink { background:rgba(196,80,127,.15); color:#e78bae; }
html[data-theme="dark"] .channel-logo.violet, html[data-theme="dark"] .channel-pill.violet, html[data-theme="dark"] .mini-channel.violet { background:rgba(119,89,201,.16); color:#ad99e8; }
.channel-pill { width:max-content; display:inline-flex; align-items:center; gap:6px; min-height:28px; padding:0 9px; border-radius:9px; font-size:10.5px; font-weight:800; }
.status-pill { width:max-content; display:inline-flex; align-items:center; min-height:26px; padding:0 9px; border-radius:999px; font-size:10px; font-weight:800; background:var(--surface-2); color:var(--muted); border:1px solid var(--border); }
.status-pill.open, .status-pill.active { background:rgba(44,172,112,.10); color:#278c5c; border-color:rgba(44,172,112,.12); }
.status-pill.pending { background:rgba(217,139,50,.10); color:#b56f21; border-color:rgba(217,139,50,.12); }
.status-pill.resolved { background:rgba(92,117,126,.09); color:var(--muted); }
.status-pill.new { background:var(--accent-soft); color:var(--accent-strong); border-color:transparent; }
.trend-pill { width:max-content; display:inline-flex; align-items:center; min-height:25px; padding:0 8px; border-radius:8px; background:rgba(44,172,112,.09); color:#278c5c; font-size:10px; font-weight:800; }
.person-cell { display:flex; align-items:center; gap:10px; min-width:0; }
.person-cell > div { min-width:0; display:grid; }
.person-cell strong { color:var(--text-strong); font-size:12.5px; }
.person-cell small { color:var(--muted); font-size:10.5px; white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
.muted-count { color:var(--muted); font-size:11px; font-weight:700; }


.page-preloader { position:fixed; inset:0; z-index:200; display:grid; place-items:center; background:var(--bg); transition:opacity .32s ease, visibility .32s ease; }
.page-preloader.hide { opacity:0; visibility:hidden; }
.preloader-mark { width:48px; height:48px; display:grid; place-items:center; border-radius:15px; color:#fff; font-size:22px; font-weight:850; background:linear-gradient(145deg,#0b8d96,#2ab3bb); box-shadow:0 12px 36px rgba(13,156,166,.24); animation:preloaderPop 1s ease-in-out infinite alternate; }
@keyframes preloaderPop { to { transform:translateY(-5px) scale(1.04); } }

.toggle-switch { width:45px; height:25px; border:0; border-radius:999px; background:var(--bg-soft); position:relative; cursor:pointer; transition:.2s ease; }
.toggle-switch span { position:absolute; width:19px; height:19px; left:3px; top:3px; border-radius:50%; background:var(--muted-2); transition:.2s ease; }
.toggle-switch.active { background:var(--accent); }
.toggle-switch.active span { transform:translateX(20px); background:#fff; }

.theme-choice-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.theme-choice { padding:12px; border:1px solid var(--border); border-radius:14px; background:var(--surface-2); color:var(--text); text-align:left; cursor:pointer; transition:.2s ease; }
.theme-choice:hover,.theme-choice.active { border-color:var(--accent); box-shadow:0 8px 28px var(--accent-faint); }
.theme-choice strong,.theme-choice small { display:block; }
.theme-choice strong { margin-top:10px; font-size:14.5px; color:var(--text-strong); }
.theme-choice small { margin-top:2px; color:var(--muted); font-size:12px; }
.theme-preview { height:110px; display:grid; grid-template-columns:28% 1fr; grid-template-rows:32% 1fr; gap:7px; padding:10px; border-radius:10px; }
.theme-preview span { display:block; border-radius:5px; }
.theme-preview span:first-child { grid-row:1/-1; }
.light-preview { background:#edf2f3; }
.light-preview span { background:#fff; border:1px solid #dce6e8; }
.dark-preview { background:#10191b; }
.dark-preview span { background:#1d2a2e; border:1px solid #2b3a3e; }