/**
 * Combo / Profile HUD — тёмная и светлая палитра, изоляция от global dark-theme.css.
 * Классы: .combo-hud, .profile-hud, .home-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud, .giveaway-hud
 */

/* Цвет полосок HP / прогресса (как у босса) — на уровне html для всего проекта */
html.dark {
  --combo-hp-fill: #5dd5fb;
  --combo-hp-track: #27272a;
  /* Подпись на полоске: светлая на тёмном треке, тень — на голубой заливке */
  --combo-progress-bar-text: #e8ecf4;
  --combo-progress-bar-track: #2f3d52;
  /* Мобильная шапка / нижний док — светлее body, отделены от контента */
  --combo-mobile-dock-bg: #2a3548;
  --combo-mobile-dock-border: #4a5d7e;
}

html:not(.dark) {
  --combo-hp-fill: #0891b2;
  --combo-hp-track: #cbd5e1;
  --combo-progress-fill: var(--combo-hp-fill);
  --combo-progress-bar-text: #0f172a;
  --combo-progress-bar-track: #b6c2d0;
  --combo-mobile-dock-bg: #f1f4fa;
  --combo-mobile-dock-border: #b8c4d8;
}

/* Тёмная тема (по умолчанию) */
.combo-hud,
html.dark .combo-hud,
html.dark .home-hud,
html.dark .profile-hud,
html.dark .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud, .giveaway-hud,
html.dark .combo-hud-surface{
  --combo-bg: #0b0e14;
  --combo-surface: #141824;
  --combo-surface-2: #1a2030;
  --combo-surface-hover: #222a3d;
  --combo-header: #0f131c;
  --combo-inset-deep: #0f131c;
  --combo-border: #2a3148;
  --combo-border-hover: #3d4a66;
  --combo-accent: #4d7cfe;
  --combo-accent-soft: rgba(61, 90, 254, 0.15);
  --combo-accent-border: rgba(61, 90, 254, 0.45);
  --combo-queued-bg: rgba(61, 90, 254, 0.12);
  --combo-queued-border: rgba(61, 90, 254, 0.5);
  --combo-queued-glow: rgba(61, 90, 254, 0.12);
  --combo-text: #e8ecf4;
  --combo-text-strong: #f1f4fc;
  --combo-text-secondary: #c5cce0;
  --combo-muted: #8b93a8;
  --combo-muted-deep: #6b7289;
  --combo-accent-text: #9ec0ff;
  --combo-accent-text-bright: #7ba4ff;
  --combo-hp-fill: #5dd5fb;
  --combo-hp-track: #27272a;
  --combo-progress-fill: var(--combo-hp-fill);
  --combo-combo-track: #27272a;
  --combo-shadow: 0 4px 24px rgba(0, 0, 0, 0.35);
  --combo-section-accent: #a78bfa;
  --combo-brigade: #8a5cf5;
  --combo-overlay: rgba(0, 0, 0, 0.7);
  --combo-switch-off: #27272a;
  --combo-switch-knob: #ffffff;
  --combo-option-on-bg: rgba(61, 90, 254, 0.18);
  --combo-option-on-shadow: 0 0 10px rgba(61, 90, 254, 0.12);
  --combo-purple-soft: rgba(138, 92, 245, 0.2);
  --combo-purple-border: rgba(138, 92, 245, 0.45);
  --combo-purple-text: #c4b5fd;
  --combo-success-text: #6ee7b7;
  --combo-success-bg: rgba(16, 185, 129, 0.15);
  --combo-success-border: rgba(16, 185, 129, 0.45);
  --combo-success-bg-hover: rgba(16, 185, 129, 0.28);
  --combo-danger-text: #fda4af;
  --combo-danger-bg: rgba(244, 63, 94, 0.15);
  --combo-danger-border: rgba(244, 63, 94, 0.45);
  --combo-danger-bg-hover: rgba(244, 63, 94, 0.28);
  --combo-warn-text: #fca5a5;
  --combo-warn-bg: rgba(239, 68, 68, 0.12);
  --combo-warn-border: rgba(239, 68, 68, 0.4);
  --combo-amber-text: #fcd34d;
  --combo-amber-bg: rgba(245, 158, 11, 0.15);
  --combo-amber-border: rgba(245, 158, 11, 0.45);
  --combo-damage-text: #67e8f9;
  --combo-orange-text: #fb923c;
}

/* Светлая тема */
html:not(.dark) .combo-hud,
html:not(.dark) .home-hud,
html:not(.dark) .profile-hud,
html:not(.dark) .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud, .giveaway-hud,
html:not(.dark) .combo-hud-surface{
  --combo-bg: #e8ecf4;
  --combo-surface: #ffffff;
  --combo-surface-2: #f1f4fa;
  --combo-surface-hover: #e2e8f4;
  --combo-header: #eef1f8;
  --combo-inset-deep: #f8fafc;
  --combo-border: #c5cdd9;
  --combo-border-hover: #94a3b8;
  --combo-accent: #3d5afe;
  --combo-accent-soft: rgba(61, 90, 254, 0.1);
  --combo-accent-border: rgba(61, 90, 254, 0.35);
  --combo-queued-bg: rgba(61, 90, 254, 0.08);
  --combo-queued-border: rgba(61, 90, 254, 0.45);
  --combo-queued-glow: rgba(61, 90, 254, 0.08);
  --combo-text: #1a2234;
  --combo-text-strong: #0f172a;
  --combo-text-secondary: #334155;
  --combo-muted: #64748b;
  --combo-muted-deep: #94a3b8;
  --combo-accent-text: #2563eb;
  --combo-accent-text-bright: #1d4ed8;
  --combo-hp-fill: #0891b2;
  --combo-hp-track: #cbd5e1;
  --combo-progress-fill: var(--combo-hp-fill);
  --combo-combo-track: #cbd5e1;
  --combo-shadow: 0 4px 20px rgba(15, 23, 42, 0.08);
  --combo-section-accent: #7c3aed;
  --combo-brigade: #7c3aed;
  --combo-overlay: rgba(15, 23, 42, 0.45);
  --combo-switch-off: #cbd5e1;
  --combo-switch-knob: #ffffff;
  --combo-option-on-bg: rgba(61, 90, 254, 0.12);
  --combo-option-on-shadow: 0 0 8px rgba(61, 90, 254, 0.08);
  --combo-purple-soft: rgba(124, 58, 237, 0.1);
  --combo-purple-border: rgba(124, 58, 237, 0.35);
  --combo-purple-text: #6d28d9;
  --combo-success-text: #065f46;
  --combo-success-bg: rgba(16, 185, 129, 0.16);
  --combo-success-border: rgba(5, 120, 105, 0.5);
  --combo-success-bg-hover: rgba(16, 185, 129, 0.26);
  --combo-danger-text: #9f1239;
  --combo-danger-bg: rgba(225, 29, 72, 0.12);
  --combo-danger-border: rgba(190, 18, 60, 0.45);
  --combo-danger-bg-hover: rgba(225, 29, 72, 0.22);
  --combo-warn-text: #b91c1c;
  --combo-warn-bg: rgba(239, 68, 68, 0.1);
  --combo-warn-border: rgba(185, 28, 28, 0.35);
  --combo-amber-text: #b45309;
  --combo-amber-bg: rgba(245, 158, 11, 0.14);
  --combo-amber-border: rgba(180, 83, 9, 0.45);
  --combo-damage-text: #0c4a6e;
  --combo-orange-text: #c2410c;
}

html.dark .combo-hud,
html.dark .home-hud,
html.dark .profile-hud,
html.dark .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .stash-hud,
html:not(.dark) .combo-hud,
html:not(.dark) .home-hud,
html:not(.dark) .profile-hud,
html:not(.dark) .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud{
  background-color: var(--combo-bg) !important;
  color: var(--combo-text) !important;
}

/* Portal-модалки (<dialog>): размытие через ::backdrop, без сплошной «стены» */
.hud-modal-dialog{
  border: 0;
  padding: 1rem;
  margin: 0;
  max-width: none;
  max-height: none;
  width: 100%;
  height: 100%;
  max-height: 100dvh;
  box-sizing: border-box;
  position: fixed;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  background: transparent !important;
  color: inherit;
  overflow: hidden;
  overscroll-behavior: contain;
}

.hud-modal-dialog::backdrop{
  -webkit-backdrop-filter: blur(14px) saturate(125%);
  backdrop-filter: blur(14px) saturate(125%);
  background: rgba(15, 23, 42, 0.14);
}

html.dark .hud-modal-dialog::backdrop{
  background: rgba(0, 0, 0, 0.14);
}

html:not(.dark) .hud-modal-dialog::backdrop{
  background: rgba(15, 23, 42, 0.1);
}

.hud-modal-dialog__frame{
  position: relative;
  z-index: 1;
  flex: 0 1 auto;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  margin: 0;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow-y: auto;
  pointer-events: auto;
}

/* Fallback, если ::backdrop / blur недоступны (часто Telegram WebView) */
.hud-modal-dialog__scrim{
  display: none;
  position: fixed;
  inset: 0;
  z-index: -1;
  pointer-events: none;
  background: rgba(0, 0, 0, 0.28);
}

@supports not (
  (-webkit-backdrop-filter: blur(1px)) or (backdrop-filter: blur(1px))
){
  .hud-modal-dialog::backdrop{
    -webkit-backdrop-filter: none;
    backdrop-filter: none;
    background: rgba(0, 0, 0, 0.28);
  }

  .hud-modal-dialog__scrim{
    display: block;
  }
}

/* Настройки (главная / профиль): лист снизу на мобиле, blur через ::backdrop */
.hud-modal-dialog.profile-settings-hud-dialog{
  align-items: flex-end;
  padding: 0 0 calc(60px + env(safe-area-inset-bottom, 0px));
}

@media (min-width: 640px){
  .hud-modal-dialog.profile-settings-hud-dialog{
    align-items: center;
    padding: 1rem;
  }
}

.hud-modal-dialog.profile-settings-hud-dialog .hud-modal-dialog__frame{
  align-items: flex-end;
}

@media (min-width: 640px){
  .hud-modal-dialog.profile-settings-hud-dialog .hud-modal-dialog__frame{
    align-items: center;
  }
}

html.dark .combo-hud-surface,
html:not(.dark) .combo-hud-surface{
  background-color: var(--combo-surface) !important;
  color: var(--combo-text) !important;
}

/* Вложенный scope внутри панели — фон задаёт родитель (surface), не перекрывать чёрным */
.combo-hud .combo-hud,
.combo-hud .home-hud,
.combo-hud .profile-hud,
.home-hud .combo-hud,
.home-hud .home-hud,
.home-hud .profile-hud,
.profile-hud .combo-hud,
.profile-hud .home-hud,
.profile-hud .profile-hud,
.worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud .combo-hud,
.worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud,
.combo-hud .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud,
.home-hud .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud,
.profile-hud .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud{
  background-color: transparent !important;
}

/* Не даём global html.dark перекрашивать карточки HUD (комбо / главная / профиль) */
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-white,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-slate-50,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-slate-100,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-gray-50,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-white,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-slate-50,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .bg-slate-100{
  background-color: var(--combo-surface) !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='bg-white/'],
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='bg-slate-800/'],
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='bg-white/'],
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='bg-slate-50/']{
  background-color: var(--combo-surface-2) !important;
}

/* Старые gradient-оболочки */
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='from-blue-50'][class*='rounded-xl'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='from-blue-900'][class*='rounded-xl'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='from-blue-950'][class*='rounded-xl'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='from-slate-900'][class*='rounded-2xl'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='from-blue-50/70'][class*='sticky'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='from-blue-50/90'][class*='sticky']{
  background: var(--combo-header) !important;
  background-image: none !important;
  border-color: var(--combo-border) !important;
  color: var(--combo-muted) !important;
}

:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-blue-200'][class*='bg-white/20'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-blue-800'][class*='bg-black/10'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-blue-200/60'][class*='bg-white/20']{
  background: var(--combo-header) !important;
  border-color: var(--combo-border) !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-gray-900,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-800,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-700,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-600,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-500,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .dark\:text-gray-100,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .dark\:text-slate-200,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .dark\:text-slate-300,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .dark\:text-slate-400,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-gray-900,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-800,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-700,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-600,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-500{
  color: var(--combo-text) !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-400,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .text-slate-400{
  color: var(--combo-muted) !important;
}

:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-blue-200'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-blue-300'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-indigo-200'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-indigo-700'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-indigo-800'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-purple-200'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-purple-300'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-purple-700'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-purple-800'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='border-blue-200/40'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='dark:border-blue-700'],
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) [class*='dark:border-blue-800']{
  border-color: var(--combo-border) !important;
}

/* Активные табы / акцент-кнопки — fallback без color-mix (часть Android WebView) */
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary),
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary) {
  background-color: #1a2d4d !important;
  background-image: none !important;
  border: 1px solid var(--combo-accent-border) !important;
  color: #f0fdfa !important;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary) {
  background-color: #2f4fd4 !important;
  border-color: #2563eb !important;
  color: #f8fafc !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary):hover:not(:disabled) {
  background-color: #243a5c !important;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary):hover:not(:disabled) {
  background-color: #3d5afe !important;
}

@supports (background: color-mix(in srgb, red 50%, blue)) {
  html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
    :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary) {
    background-color: color-mix(in srgb, var(--combo-accent) 28%, #0a1628) !important;
  }

  html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
    :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary) {
    background-color: color-mix(in srgb, var(--combo-accent) 82%, #042f2e) !important;
    border-color: color-mix(in srgb, var(--combo-accent) 45%, #0c4a6e) !important;
  }

  html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
    :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary):hover:not(:disabled) {
    background-color: color-mix(in srgb, var(--combo-accent) 42%, #0a1628) !important;
  }

  html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
    :is(.combo-hud-tab-active, .combo-hud-btn-primary, .social-btn-primary):hover:not(:disabled) {
    background-color: color-mix(in srgb, var(--combo-accent) 92%, #042f2e) !important;
  }
}

:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.combo-hud-btn-primary, .social-btn-primary) svg {
  color: inherit !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-tab-brigade,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-tab-brigade{
  background-color: var(--combo-brigade) !important;
  color: #fff !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-section-title,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-section-title{
  background: var(--combo-header) !important;
  background-image: none !important;
  color: var(--combo-section-accent) !important;
  letter-spacing: 0.12em;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) .combo-hud-settings-field,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) select.combo-hud-settings-field,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) .combo-hud-settings-field,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) select.combo-hud-settings-field{
  background-color: var(--combo-surface-2) !important;
  border: 1px solid var(--combo-border) !important;
  border-radius: 0.5rem;
  color: var(--combo-text) !important;
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.04);
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) select.combo-hud-settings-field,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) select.combo-hud-settings-field{
  cursor: pointer;
  padding-right: 1.75rem !important;
  background-image: linear-gradient(45deg, transparent 50%, var(--combo-muted) 50%),
    linear-gradient(135deg, var(--combo-muted) 50%, transparent 50%);
  background-position: calc(100% - 14px) calc(50% + 2px), calc(100% - 9px) calc(50% + 2px);
  background-size: 5px 5px, 5px 5px;
  background-repeat: no-repeat;
  appearance: none;
  -webkit-appearance: none;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) .combo-hud-settings-field:focus,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) select.combo-hud-settings-field:focus,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) .combo-hud-settings-field:focus,
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .giveaway-hud) select.combo-hud-settings-field:focus{
  border-color: var(--combo-accent-border) !important;
  outline: none !important;
  box-shadow: 0 0 0 1px var(--combo-accent-border) !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) select.combo-hud-settings-field option{
  background-color: #141824;
  color: #e8ecf4;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) select.combo-hud-settings-field option{
  background-color: #ffffff;
  color: #1a2234;
}

/* HP / прогресс — трек и заливка (цвет как полоска HP босса) */
.combo-hud-hp-track,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  .combo-hud-hp-track,
.home-hud .home-hud-hp-track,
.profile-hud .profile-hud-hp-track {
  background-color: var(--combo-hp-track) !important;
}

.combo-hud-progress-fill,
.combo-hud-hp-fill,
.home-hud-hp-fill,
.profile-hud-hp-fill,
.summary-achievement-progress-fill,
.summary-achievement-progress-fill-high,
.summary-achievement-progress-track-done,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  .combo-hud-hp-fill,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  .combo-hud-progress-fill {
  background-color: var(--combo-hp-fill) !important;
  background-image: none !important;
}

.combo-hud .combo-hud-combo-track, .home-hud .home-hud-combo-track, .profile-hud .profile-hud-combo-track{
  background-color: var(--combo-combo-track) !important;
}

/* Скрытые checkbox в комбо */
html.dark .combo-hud input.sr-only,
html:not(.dark) .combo-hud input.sr-only, html:not(.dark) .home-hud input.sr-only, html:not(.dark) .profile-hud input.sr-only{
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  padding: 0 !important;
  margin: -1px !important;
  overflow: hidden !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
  border: 0 !important;
  background: transparent !important;
}

/* Светлая тема: блок статуса боя внутри панели */
html:not(.dark) .combo-hud .combo-hud-status-shell, html:not(.dark) .home-hud .home-hud-status-shell, html:not(.dark) .profile-hud .profile-hud-status-shell{
  background: var(--combo-surface-2) !important;
  border-color: var(--combo-border) !important;
}

html:not(.dark) .combo-hud .combo-hud-top-damage-row, html:not(.dark) .home-hud .home-hud-top-damage-row, html:not(.dark) .profile-hud .profile-hud-top-damage-row, html:not(.dark) .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud-top-damage-row{
  background: rgba(255, 255, 255, 0.75) !important;
  border-color: var(--combo-border) !important;
}

/* dark-theme.css заливает «голые» button в slate-700 — сброс внутри HUD */
html.dark
  :is(
    .combo-hud,
    .home-hud,
    .profile-hud,
    .worker-hud,
    .zaruba-hud,
    .dealer-hud,
    .stash-hud,
    .social-hud,
    .weapon-hud,
    .style-hud,
    .summary-hud,
    .giveaway-hud,
    .mobile-nav-hud,
    .nav-hud
  )
  button:not(.combo-hud-btn):not(.combo-hud-collapse-header):not([class*='bg-']):not(.social-name-link) {
  background-color: transparent !important;
  background-image: none !important;
  border-color: transparent !important;
  box-shadow: none !important;
}

html.dark
  :is(
    .combo-hud,
    .home-hud,
    .profile-hud,
    .worker-hud,
    .zaruba-hud,
    .dealer-hud,
    .stash-hud,
    .social-hud,
    .weapon-hud,
    .style-hud,
    .summary-hud,
    .giveaway-hud,
    .mobile-nav-hud,
    .nav-hud
  )
  button:not(.combo-hud-btn):not(.combo-hud-collapse-header):not([class*='bg-']):not(.social-name-link):hover {
  background-color: rgba(255, 255, 255, 0.06) !important;
}

/* Заголовки сворачиваемых панелей (не slate-700 из dark-theme.css) */
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  button.combo-hud-collapse-header {
  background-color: var(--combo-header) !important;
  background-image: none !important;
  border: none !important;
  border-bottom: 1px solid var(--combo-border) !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  color: var(--combo-text-strong) !important;
}

:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  button.combo-hud-collapse-header:hover:not(:disabled) {
  background-color: var(--combo-surface-hover) !important;
}

/* Зарубы — сайдбар «Настройки» / «ЗарубаБот»: заметнее фона shell */
.zaruba-hud .zaruba-aside-section {
  border-color: var(--combo-accent-border) !important;
  box-shadow:
    var(--combo-shadow),
    0 0 0 1px rgba(77, 124, 254, 0.12),
    inset 0 1px 0 rgba(255, 255, 255, 0.05) !important;
}

.zaruba-hud .zaruba-collapse-header-row {
  background: var(--combo-surface-2) !important;
  border-left: 3px solid var(--combo-accent) !important;
}

.zaruba-hud .zaruba-collapse-header-row > button.combo-hud-collapse-header {
  background: transparent !important;
  border: none !important;
  border-bottom: none !important;
  border-radius: 0 !important;
}

.zaruba-hud .zaruba-collapse-header-row > button.combo-hud-collapse-header:hover:not(:disabled) {
  background: var(--combo-surface-hover) !important;
}

.zaruba-hud .zaruba-collapse-header-title {
  color: var(--combo-text-strong) !important;
  letter-spacing: 0.02em;
}

.zaruba-hud .zaruba-tabs {
  background: var(--combo-surface-2) !important;
  border-color: var(--combo-border) !important;
}

.zaruba-hud .zaruba-tabs .combo-hud-btn:not(.combo-hud-tab-active) {
  background: var(--combo-surface) !important;
  color: var(--combo-text-secondary) !important;
  border: 1px solid var(--combo-border) !important;
}

.zaruba-hud .zaruba-tabs .combo-hud-btn:not(.combo-hud-tab-active):hover:not(:disabled) {
  background: var(--combo-surface-hover) !important;
  border-color: var(--combo-border-hover) !important;
  color: var(--combo-text-strong) !important;
}

/* Сводка — клик по иконке таланта (не slate-700 из dark-theme.css) */
.summary-hud button.summary-talent-icon-btn {
  background: transparent !important;
  background-image: none !important;
  color: inherit !important;
  box-shadow: none !important;
}

.summary-hud button.summary-talent-icon-btn:hover:not(:disabled) {
  background: var(--combo-surface-hover) !important;
}

.summary-hud button.summary-talent-info-btn.combo-hud-btn {
  border: 1px solid #7ba4ff !important;
  background: var(--combo-accent) !important;
  background-image: none !important;
  color: #fff !important;
  box-shadow: 0 0 8px rgba(61, 90, 254, 0.55) !important;
  border-radius: 9999px !important;
}

.summary-hud button.summary-talent-info-btn.combo-hud-btn:hover:not(:disabled) {
  background: #5b8fff !important;
  background-image: none !important;
  color: #fff !important;
  border-color: #9ec0ff !important;
  box-shadow: 0 0 10px rgba(123, 164, 255, 0.65) !important;
}

html.dark .summary-hud button.summary-talent-info-btn.combo-hud-btn {
  background-color: var(--combo-accent) !important;
  color: #fff !important;
}

html:not(.dark) .summary-hud button.summary-talent-info-btn.combo-hud-btn {
  background-color: var(--combo-accent) !important;
  color: #fff !important;
  box-shadow: 0 0 6px rgba(61, 90, 254, 0.35) !important;
}

.summary-hud .summary-talent-max-badge {
  border: 1px solid #6ee7b7 !important;
  background: rgba(16, 185, 129, 0.85) !important;
  color: #ecfdf5 !important;
  box-shadow: 0 0 8px rgba(16, 185, 129, 0.5) !important;
}

html:not(.dark) .summary-hud .summary-talent-max-badge {
  background: #10b981 !important;
  border-color: #059669 !important;
  color: #fff !important;
  box-shadow: 0 0 6px rgba(16, 185, 129, 0.35) !important;
}

.summary-hud .summary-achievement-done-badge {
  border: 1px solid #6ee7b7 !important;
  background: rgba(16, 185, 129, 0.85) !important;
  color: #ecfdf5 !important;
  box-shadow: 0 0 8px rgba(16, 185, 129, 0.5) !important;
}

html:not(.dark) .summary-hud .summary-achievement-done-badge {
  background: #10b981 !important;
  border-color: #059669 !important;
  color: #fff !important;
  box-shadow: 0 0 6px rgba(16, 185, 129, 0.35) !important;
}

.summary-hud .summary-achievement-icon {
  background: transparent !important;
  background-image: none !important;
}

.summary-hud button.summary-achievement-expand-btn.combo-hud-btn {
  border-color: var(--combo-amber-border) !important;
  background: var(--combo-amber-soft) !important;
  background-image: none !important;
  color: var(--combo-amber) !important;
  box-shadow: none !important;
}

.summary-hud button.summary-achievement-expand-btn.combo-hud-btn:hover:not(:disabled) {
  background: var(--combo-amber) !important;
  color: #1a1208 !important;
}

.summary-hud .summary-achievement-progress-track {
  background-color: var(--combo-progress-bar-track) !important;
}

.summary-hud .summary-achievement-progress-label,
.combo-hud .summary-achievement-progress-label,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  .combo-hud-progress-bar-label {
  color: var(--combo-progress-bar-text) !important;
}

html.dark
  :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud, .weapon-hud, .style-hud, .summary-hud)
  .combo-hud-progress-bar-label,
html.dark .summary-hud .summary-achievement-progress-label {
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.72);
}

.combo-hud-hp-track.combo-hud-progress-bar-track,
.summary-achievement-progress-track {
  background-color: var(--combo-progress-bar-track) !important;
}

.summary-hud .summary-achievement-progress-track-done {
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2);
}

.summary-hud .summary-achievement-progress-fill,
.summary-hud .summary-achievement-progress-fill-high {
  border-radius: inherit;
}

/* Мобильная шапка и нижняя навигация */
.mobile-nav-hud.mobile-dock-shell-top {
  background-color: var(--combo-mobile-dock-bg) !important;
  border-color: var(--combo-mobile-dock-border) !important;
  box-shadow:
    0 1px 0 color-mix(in srgb, #fff 6%, transparent),
    0 4px 14px rgba(0, 0, 0, 0.2);
}

.mobile-nav-hud.mobile-dock-shell-bottom {
  background-color: var(--combo-mobile-dock-bg) !important;
  border-color: var(--combo-mobile-dock-border) !important;
  box-shadow:
    0 -1px 0 color-mix(in srgb, #fff 5%, transparent),
    0 -4px 14px rgba(0, 0, 0, 0.22);
}

/* Мобильный Safari / PWA: safe area у шапки и дока */
@media (max-width: 767px) {
  .mobile-dock-header-row {
    padding-top: max(0.5rem, env(safe-area-inset-top, 0px));
    min-height: calc(3.5rem + env(safe-area-inset-top, 0px));
  }

  .mobile-overlay-header {
    padding-top: max(0.75rem, env(safe-area-inset-top, 0px));
    padding-bottom: 0.25rem;
  }

  .mobile-dock-shell-bottom {
    padding-bottom: env(safe-area-inset-bottom, 0px);
  }

  /* Safari вне PWA: док в потоке flex */
  html:not(.pwa-standalone) .mobile-dock-shell-bottom {
    flex-shrink: 0;
  }
}

html:not(.dark) .mobile-nav-hud.mobile-dock-shell-top,
html:not(.dark) .mobile-nav-hud.mobile-dock-shell-bottom {
  box-shadow: 0 2px 10px rgba(15, 23, 42, 0.08);
}

/* Попап «Статистика» на мобильном */
.stats-popover-scrim {
  background: rgba(0, 0, 0, 0.45) !important;
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.stats-popover-glass {
  background: color-mix(in srgb, var(--combo-surface) 78%, transparent) !important;
  border-color: var(--combo-border-hover) !important;
  backdrop-filter: blur(18px) saturate(160%);
  -webkit-backdrop-filter: blur(18px) saturate(160%);
  box-shadow:
    var(--combo-shadow),
    0 0 0 1px color-mix(in srgb, var(--combo-accent-border) 25%, transparent);
}

html:not(.dark) .stats-popover-glass {
  background: color-mix(in srgb, var(--combo-surface) 88%, transparent) !important;
}

/* Ссылки на ник в «Братве» — без серой подложки */
.social-hud .social-name-link,
.social-hud button.social-name-link {
  background: transparent !important;
  background-image: none !important;
  border: none !important;
  box-shadow: none !important;
  min-height: 0 !important;
  height: auto !important;
  padding: 0 !important;
}

.social-hud .social-name-link:hover,
.social-hud button.social-name-link:hover {
  background: transparent !important;
}

/* Крупные CTA — чуть толще рамка */
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-btn-primary,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .social-btn-primary {
  border-width: 2px !important;
}

/* ── Семантические кнопки / блоки (читаемы в светлой и тёмной теме) ── */
.combo-hud-text-success {
  color: var(--combo-success-text);
}

.combo-hud-text-danger {
  color: var(--combo-danger-text);
}

.combo-hud-text-warn {
  color: var(--combo-warn-text);
}

.combo-hud-text-amber {
  color: var(--combo-amber-text);
}

.combo-hud-text-damage {
  color: var(--combo-damage-text);
}

.combo-hud-text-orange {
  color: var(--combo-orange-text);
}

.combo-hud-inset-success {
  border: 1px solid var(--combo-success-border);
  background-color: var(--combo-success-bg);
  color: var(--combo-success-text);
}

.combo-hud-inset-danger {
  border: 1px solid var(--combo-warn-border);
  background-color: var(--combo-warn-bg);
  color: var(--combo-warn-text);
}

/* Скругление всех HUD-кнопок (табы, чипы, действия) */
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) button.combo-hud-btn,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-tab-active,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-btn-primary,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .social-btn-primary,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-tab-brigade,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-btn-success,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-btn-danger,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud) .combo-hud-btn-amber {
  border-radius: 0.5rem !important;
}

.dealer-hud button:not(.sr-only),
.zaruba-hud button:not(.sr-only),
.worker-hud button:not(.sr-only),
.stash-hud button:not(.sr-only) {
  border-radius: 0.5rem;
}

.combo-hud-btn-success {
  border-color: var(--combo-success-border) !important;
  background-color: var(--combo-success-bg) !important;
  color: var(--combo-success-text) !important;
}

.combo-hud-btn-success:hover:not(:disabled) {
  background-color: var(--combo-success-bg-hover) !important;
}

.combo-hud-btn-danger {
  border-color: var(--combo-danger-border) !important;
  background-color: var(--combo-danger-bg) !important;
  color: var(--combo-danger-text) !important;
}

.combo-hud-btn-danger:hover:not(:disabled) {
  background-color: var(--combo-danger-bg-hover) !important;
}

/* Семантические CTA с плотным фоном (читаемы на цветных inset-панелях) */
.combo-hud-btn-danger-solid,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  button.combo-hud-btn.combo-hud-btn-danger-solid {
  border: 1px solid #e11d48 !important;
  background-color: #be123c !important;
  background-image: none !important;
  color: #fff !important;
}

.combo-hud-btn-danger-solid:hover:not(:disabled),
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  button.combo-hud-btn.combo-hud-btn-danger-solid:hover:not(:disabled) {
  background-color: #9f1239 !important;
}

.combo-hud-btn-success-solid,
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  button.combo-hud-btn.combo-hud-btn-success-solid {
  border: 1px solid #10b981 !important;
  background-color: #047857 !important;
  background-image: none !important;
  color: #fff !important;
}

.combo-hud-btn-success-solid:hover:not(:disabled),
:is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  button.combo-hud-btn.combo-hud-btn-success-solid:hover:not(:disabled) {
  background-color: #065f46 !important;
}

.combo-hud-badge-success {
  border: 1px solid var(--combo-success-border);
  background-color: var(--combo-success-bg);
  color: var(--combo-success-text);
}

.combo-hud-badge-danger {
  border: 1px solid var(--combo-danger-border);
  background-color: var(--combo-danger-bg);
  color: var(--combo-danger-text);
}

.combo-hud-badge-amber {
  border: 1px solid var(--combo-amber-border);
  background-color: var(--combo-amber-bg);
  color: var(--combo-amber-text);
}

/* Чипы статистики на карточке босса (уб / П / Б / А) */
.combo-hud-boss-stat-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: flex-start;
  flex-wrap: nowrap;
  gap: 2px;
  box-sizing: border-box;
  width: max-content;
  max-width: 100%;
  min-height: 20px;
  height: auto;
  padding: 2px 5px 2px 4px;
  font-size: 9px;
  font-weight: 600;
  line-height: 1.1;
  border-radius: 4px;
  border-width: 1px;
  border-style: solid;
  vertical-align: middle;
  flex: 0 0 auto;
  flex-shrink: 0;
  overflow: visible;
  white-space: nowrap;
  isolation: isolate;
}

@media (min-width: 768px) {
  .combo-hud-boss-stat-chip {
    min-height: 22px;
    padding: 2px 6px 2px 5px;
    font-size: 10px;
    gap: 3px;
  }
}

.combo-hud-boss-stat-chip--status {
  padding-right: 6px;
  padding-top: 3px;
}

.combo-hud-boss-stats-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: flex-start;
  gap: 4px 5px;
  min-width: 0;
  width: 100%;
  line-height: 1;
  row-gap: 4px;
}

.combo-hud-boss-stat-chip__part {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
  flex-shrink: 0;
}

.combo-hud-boss-stat-chip__mode {
  opacity: 0.85;
  text-transform: uppercase;
}

.combo-hud-boss-stat-chip__sep {
  opacity: 0.55;
  font-weight: 700;
  padding: 0 1px;
}

.combo-hud-boss-stat-chip__cost {
  display: inline-flex;
  align-items: center;
  gap: 2px;
  line-height: 1;
  font-size: 9px;
  opacity: 0.95;
  flex-shrink: 0;
}

.combo-hud-boss-stat-chip__cost-icon,
.combo-hud-boss-stat-chip__cost img {
  width: 11px !important;
  height: 11px !important;
  min-width: 11px;
  min-height: 11px;
  flex-shrink: 0;
}

@media (min-width: 768px) {
  .combo-hud-boss-stat-chip__cost {
    font-size: 10px;
  }

  .combo-hud-boss-stat-chip__cost-icon,
  .combo-hud-boss-stat-chip__cost img {
    width: 12px !important;
    height: 12px !important;
    min-width: 12px;
    min-height: 12px;
  }
}

.combo-hud-combo-dot {
  position: absolute;
  top: -2px;
  right: -2px;
  z-index: 3;
  width: 6px;
  height: 6px;
  border-radius: 9999px;
  transform: none;
  box-shadow: 0 0 0 1px var(--combo-surface);
  pointer-events: none;
  background-image: none !important;
}

.combo-hud-combo-dot--ok {
  background-color: #10b981 !important;
  box-shadow:
    0 0 0 1px var(--combo-surface),
    0 0 5px rgba(16, 185, 129, 0.75) !important;
}

.combo-hud-combo-dot--bad {
  background-color: #ef4444 !important;
  box-shadow:
    0 0 0 1px var(--combo-surface),
    0 0 5px rgba(244, 63, 94, 0.55) !important;
}

.combo-hud-combo-dot--load {
  background-color: var(--combo-muted-deep) !important;
  box-shadow: 0 0 0 1px var(--combo-surface) !important;
}

.combo-hud-btn-amber,
html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  button.combo-hud-btn.combo-hud-btn-amber:not(:disabled) {
  border: 1px solid var(--combo-amber-border) !important;
  background-color: var(--combo-amber-bg) !important;
  color: var(--combo-amber-text) !important;
}

html.dark :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  button.combo-hud-btn.combo-hud-btn-amber:hover:not(:disabled) {
  background-color: var(--combo-amber-border) !important;
  filter: brightness(1.05);
}

.combo-hud-row-success {
  background-color: var(--combo-success-bg) !important;
  border-left: 2px solid var(--combo-success-border);
}

/* Светлая тема: пастельные tailwind-цвета на HUD → токены с контрастом */
html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(
    .text-emerald-300,
    .text-emerald-400,
    [class*='text-emerald-300'],
    [class*='text-emerald-400']
  ):not(.combo-hud-tab-active):not(.combo-hud-tab-brigade) {
  color: var(--combo-success-text) !important;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.text-rose-200, .text-rose-300, .text-rose-400, [class*='text-rose-200'], [class*='text-rose-300'], [class*='text-rose-400']):not(
    .combo-hud-tab-active
  ) {
  color: var(--combo-danger-text) !important;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.text-red-300, .text-red-400, [class*='text-red-300'], [class*='text-red-400']) {
  color: var(--combo-warn-text) !important;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(
    .text-amber-200,
    .text-amber-300,
    [class*='text-amber-200'],
    [class*='text-amber-300']
  ) {
  color: var(--combo-amber-text) !important;
}

html:not(.dark) :is(.combo-hud, .home-hud, .profile-hud, .worker-hud, .zaruba-hud, .dealer-hud, .stash-hud, .social-hud)
  :is(.text-orange-400, .text-orange-300, [class*='text-orange-400'], [class*='text-orange-300']) {
  color: var(--combo-orange-text) !important;
}

/* Братва — те же токены accent, что Азарт / Барыга / Боссы (без отдельного cyan) */

.social-hud button:not(.sr-only) {
  border-radius: 0.5rem;
}

.social-hud details summary {
  list-style: none;
}

.social-hud details summary::-webkit-details-marker {
  display: none;
}

.social-hud details[open] summary svg {
  transform: rotate(180deg);
}

.social-hud details summary svg {
  transition: transform 0.15s ease;
}

.social-hud .combo-hud-btn-amber {
  color: var(--combo-amber-text) !important;
  background: var(--combo-amber-bg) !important;
  border-color: var(--combo-amber-border) !important;
}

.social-hud .combo-hud-btn-amber:hover:not(:disabled) {
  filter: brightness(1.08);
}

.social-hud .combo-hud-btn:not(.sr-only) {
  font-size: 0.9375rem;
  line-height: 1.35;
}

@media (max-width: 640px) {
  .social-hud .combo-hud-btn.min-h-\[2\.75rem\] {
    min-height: 2.875rem;
  }
}

/* Ивенты на главной (Меняла, Люська, Ворона) — не slate-700 из dark-theme.css */
:is(.combo-hud, .home-hud, .profile-hud)
  :is(button.combo-hud-event-chip, .combo-hud-event-chip) {
  background-color: var(--combo-surface) !important;
  background-image: none !important;
  border-color: var(--combo-border) !important;
  color: var(--combo-text) !important;
  box-shadow: none !important;
}

:is(.combo-hud, .home-hud, .profile-hud)
  button.combo-hud-event-chip:hover:not(:disabled) {
  background-color: var(--combo-surface-hover) !important;
  border-color: var(--combo-accent-border) !important;
}

/* Розыгрыш — textarea описания приза (токены HUD, не slate из dark-theme) */
.giveaway-hud .giveaway-prize-textarea {
  background-color: var(--combo-surface) !important;
  border-color: var(--combo-border) !important;
  color: var(--combo-text) !important;
}

.giveaway-hud .giveaway-prize-textarea:focus {
  border-color: rgba(127, 61, 255, 0.5) !important;
  border-bottom-color: rgba(127, 61, 255, 0.55) !important;
  box-shadow: 0 0 0 1px rgba(127, 61, 255, 0.2) !important;
}
