/* ==========================================================================
   themes/light.css
   Light theme — "book cream" (warm, softer, less white glare)
   ========================================================================== */

:root[data-theme="light"],
body[data-theme="light"],
:root.light-theme,
body.light-theme,
.theme-light{
  --transition: .16s ease-in-out;

  /* ------------------------------------------------------------------------
     Core palette (book-like warm paper)
     ------------------------------------------------------------------------ */
  --cream-ink:      #2f241d;   /* основной текст */
  --cream-ink-soft: #4a3a30;   /* полутёмный текст */
  --cream-muted:    #7b6a5f;   /* вторичный текст */

  --cream-0:        #f2e9dd;   /* фон страницы */
  --cream-1:        #f8f1e7;   /* карточки/панели */
  --cream-2:        #efe4d6;   /* вторичные поверхности */
  --cream-3:        #e6d7c4;   /* тёплый слой/hover */
  --cream-border:   #d8c3ad;   /* рамки */
  --cream-border-strong:#c6ab8f;

  /* ------------------------------------------------------------------------
     UI tokens
     ------------------------------------------------------------------------ */
  --surface:        var(--cream-1);
  --surface-2:      var(--cream-2);
  --surface-3:      var(--cream-3);

  --text:           var(--cream-ink);
  --muted:          var(--cream-muted);
  --border:         var(--cream-border);

  --card-bg:        var(--surface);
  --card-brd:       var(--border);

  --shadow-sm:      0 1px 2px rgba(73, 45, 25, .10);
  --shadow-md:      0 8px 22px rgba(73, 45, 25, .10);
  --shadow-lg:      0 16px 36px rgba(73, 45, 25, .14);
  --card-shadow:    0 3px 14px rgba(73,45,25,.08), 0 1px 0 rgba(73,45,25,.06);
  --hover-shadow:   0 7px 24px rgba(73,45,25,.12);

  --overlay: rgba(39, 26, 17, .16);
  --overlay-fallback: rgba(39, 26, 17, .24);
  --drawer-blur: 6px;
  --drawer-sat: 1.06;

  --header-bg-color:#f0e4d6; /* fallback for Firefox if gradient fails */
  --header-bg:      linear-gradient(135deg, #f3e8db 0%, #e9d8c4 100%);

  --hero-border:    var(--cream-border);
  --hero-bg-color:  #efdfcb; /* fallback */
  --hero-bg:        linear-gradient(135deg, #f0e2d1 0%, #e5d0b8 100%);
  --hero-shadow:    0 12px 28px rgba(120, 73, 36, .14);

  /* ------------------------------------------------------------------------
     Accent (cinnamon / caramel)
     ------------------------------------------------------------------------ */
  --accent:         #a5683d;
  --accent-600:     #a5683d;
  --accent-700:     #8f5732;
  --accent-800:     #77482b;
  --accent-300:     #d8ab87;
  --accent-100:     #f1decc;

  --focus-ring-color: color-mix(in srgb, var(--accent-600) 34%, transparent);

  --link:           #7e4d2b;
  --link-hover:     #653b22;

  --danger:         #c24141;
  --success:        #1f8a4c;
  --warning:        #b97409;
  --info:           var(--accent-600);

  /* ------------------------------------------------------------------------
     Inputs / buttons
     ------------------------------------------------------------------------ */
  --input-bg:       #fcf7f1;
  --input-fg:       var(--text);
  --input-brd:      var(--cream-border);
  --input-focus:    var(--accent-600);

  --btn-primary-bg:        var(--accent-600);
  --btn-primary-hover-bg:  var(--accent-700);
  --btn-primary-active-bg: var(--accent-800);
  --btn-primary-fg:        #ffffff;
  --btn-primary-brd:       transparent;

  --btn-secondary-bg:      #f3e8db;
  --btn-secondary-hover-bg:#e8d8c5;
  --btn-secondary-active-bg:#decab4;
  --btn-secondary-fg:      var(--text);
  --btn-secondary-brd:     var(--cream-border);

  --btn-ghost-bg:          transparent;
  --btn-ghost-fg:          var(--accent-700);
  --btn-ghost-hov:         #efe2d3;
  --btn-outline-bg:        #f8f1e7;
  --btn-outline-fg:        var(--accent-700);
  --btn-outline-br:        var(--accent-300);
  --btn-outline-hov:       #f1e4d6;

  /* aliases for legacy usage */
  --btn-bg:                var(--btn-primary-bg);
  --btn-hover-bg:          var(--btn-primary-hover-bg);
  --btn-active-bg:         var(--btn-primary-active-bg);
  --btn-fg:                var(--btn-primary-fg);
  --btn-brd:               var(--btn-primary-brd);

  /* media-player bridge */
  --c-surface:             var(--surface);
  --c-text:                var(--text);
  --c-text-muted:          var(--muted);
  --c-border:              var(--border);
  --c-accent:              var(--accent);

  /* like/subscription chips */
  --like-on-bg:            #f7e1db;
  --like-on-brd:           #e7bfb2;
  --like-on-tx:            #7a231d;

  --sub-on-bg:             #f4e9de;
  --sub-on-fg:             #5f412d;
  --sub-on-brd:            #d7b89d;

  /* fanfic cover */
  --cover-bg:              var(--surface-2);
  --cover-brd:             var(--border);

  /* ------------------------------------------------------------------------
     Reader / editor / dropdown tokens
     ------------------------------------------------------------------------ */
  --surface-0:             #f7eee3;
  --surface-1:             var(--surface);
  --ink:                   var(--text);
  --ink-muted:             var(--muted);

  --border-color:          var(--border);
  --focus-ring:            #d6b08f;
  --hover-bg:              rgba(73,45,25,.06);
  --hover-bg-strong:       rgba(73,45,25,.10);

  --input-ink:             var(--input-fg);
  --input-border:          var(--input-brd);
  --placeholder:           #9d8575;

  --dropdown-bg:           #f8f1e7;
  --dropdown-border:       var(--border);
  --dropdown-shadow:       0 10px 26px rgba(73,45,25,.16);

  --ql-toolbar-bg:         #f2e7db;
  --ql-toolbar-border:     var(--border);
  --ql-container-bg:       #fbf5ee;
  --ql-editor-bg:          #fbf5ee;
  --ql-ink:                var(--text);
  --ql-placeholder:        #8e7869;
  --ql-icon:               #5f4a3d;
  --ql-border:             var(--border);

  --chip-bg:               #efe3d4;
  --chip-border:           var(--border);

  --scrollbar-track:       rgba(73,45,25,.13);
  --scrollbar-thumb:       rgba(121,88,64,.55);

  /* audio accents (warm, not neon-blue) */
  --qa-brd:                rgba(165,104,61,.42);
  --qa-bg1:                rgba(165,104,61,.11);
  --qa-bg2:                rgba(165,104,61,.03);
  --qa-accent-1:           #b97847;
  --qa-accent-2:           #d39b5f;

  /* range */
  --range-track:           #e2cfbb;
  --range-brd:             #d5bda5;
  --range-thumb:           var(--accent-600);
  --range-thumb-brd:       rgba(0,0,0,.08);
  --range-thumb-shadow:    0 2px 8px rgba(0,0,0,.18);

  /* status pills */
  --mf-status-progress-bg: #f2e1cf;
  --mf-status-progress-brd:#dec0a1;
  --mf-status-progress-fg: #6f472b;

  --mf-status-done-bg:     #e9f7ef;
  --mf-status-done-brd:    #86d4a7;
  --mf-status-done-fg:     #0f5b39;

  --mf-status-frozen-bg:   #e7edf8;
  --mf-status-frozen-brd:  #b5c3df;
  --mf-status-frozen-fg:   #31456f;

  --mf-size-bg:            #f5e4d2;
  --mf-size-brd:           #e8c7a4;
  --mf-size-fg:            #6c4228;

  /* review tokens */
  --rv-bg:                 #f6ebdf;
  --rv-border:             #ddc8b2;
  --rv-radius:             14px;
  --rv-pad:                14px 16px;
  --rv-shadow:             0 8px 24px rgba(73,45,25,.10);
  --rv-text:               var(--text);
  --rv-muted:              var(--muted);
  --rv-link:               var(--link);
  --rv-focus:              #d3a278;

  --rv-like-bg:            #efe3d4;
  --rv-like-border:        #d9c4ae;
  --rv-like-text:          #4a372b;
  --rv-like-liked-bg:      #f2ddd6;
  --rv-like-liked-text:    #7a231d;

  --rv-editor-bg:          #fbf5ee;
  --rv-editor-border:      #d8c3ad;

  /* character/wiki cards */
  --char-card-bg:          var(--surface);
  --char-card-brd:         var(--border);
  --char-title:            var(--text);
  --char-muted:            var(--muted);
  --char-link:             var(--link);
  --char-link-hover:       var(--link-hover);

  --wiki-h2-color:         var(--text);
  --wiki-section-brd:      var(--border);
  --wiki-section-bg:       #fbf5ee;

  --thumb-bg:              #f2e7db;
  --thumb-brd:             #dcc7b2;
  --thumb-hover-bg:        #e9dccd;

  --modal-bg:              rgba(39,26,17,.72);
  --modal-brd:             #b89c84;

  /* admin */
  --admin-bg:              var(--cream-0);
  --admin-ink:             var(--text);
  --admin-muted:           var(--muted);
  --admin-surface:         var(--surface);
  --admin-border:          var(--border);
  --admin-accent:          var(--accent-600);
  --admin-focus:           #d4b398;
  --admin-danger:          var(--danger);

  /* misc aliases */
  --background:            var(--cream-0);
  --bg:                    var(--cream-0);
  --text-primary:          var(--text);
  --text-secondary:        var(--muted);
  --panel:                 var(--surface-2);
  --cn-panel:              color-mix(in srgb, var(--surface) 92%, #ffffff 8%);
  --cn-text:               var(--text);
  --cn-border:             rgba(95,67,42,.18);
}

/* --------------------------------------------------------------------------
   Theme application (with Firefox-safe fallback color)
   -------------------------------------------------------------------------- */
html[data-theme="light"] body,
body.light-theme{
  background-color: var(--cream-0);
  background-image:
    radial-gradient(1200px 480px at 20% -10%, rgba(177,114,58,.10), transparent 60%),
    radial-gradient(900px 420px at 100% 0%, rgba(120,78,42,.07), transparent 62%),
    linear-gradient(180deg, #f5ede2 0%, var(--cream-0) 240px, var(--cream-0) 100%);
  color: var(--text);
}

/* Selection */
html[data-theme="light"] ::selection,
body.light-theme ::selection{
  background: #e7cfb7;
  color: #2a1f18;
}

/* Links */
html[data-theme="light"] a,
body.light-theme a{
  color: var(--link);
  text-decoration-color: color-mix(in srgb, var(--link) 45%, transparent);
}
html[data-theme="light"] a:hover,
body.light-theme a:hover{
  color: var(--link-hover);
}

/* Inputs */
html[data-theme="light"] input[type="text"],
html[data-theme="light"] input[type="email"],
html[data-theme="light"] input[type="password"],
html[data-theme="light"] input[type="search"],
html[data-theme="light"] textarea,
html[data-theme="light"] select,
body.light-theme input[type="text"],
body.light-theme input[type="email"],
body.light-theme input[type="password"],
body.light-theme input[type="search"],
body.light-theme textarea,
body.light-theme select{
  background: var(--input-bg);
  color: var(--input-fg);
  border: 1px solid var(--input-brd);
  transition: border-color var(--transition), box-shadow var(--transition), background-color var(--transition);
}

html[data-theme="light"] input:focus,
html[data-theme="light"] textarea:focus,
html[data-theme="light"] select:focus,
body.light-theme input:focus,
body.light-theme textarea:focus,
body.light-theme select:focus{
  outline: none;
  border-color: var(--input-focus);
  box-shadow: 0 0 0 3px var(--focus-ring-color);
}

/* Buttons (primary by default; custom classes can override) */
html[data-theme="light"] button,
html[data-theme="light"] input[type="button"],
html[data-theme="light"] input[type="submit"],
html[data-theme="light"] .button,
html[data-theme="light"] .btn,
body.light-theme button,
body.light-theme input[type="button"],
body.light-theme input[type="submit"],
body.light-theme .button,
body.light-theme .btn{
  background: var(--btn-bg);
  color: var(--btn-fg);
  border: 1px solid var(--btn-brd);
  transition: background-color var(--transition), color var(--transition), box-shadow var(--transition), border-color var(--transition);
}

html[data-theme="light"] button:hover,
html[data-theme="light"] input[type="button"]:hover,
html[data-theme="light"] input[type="submit"]:hover,
html[data-theme="light"] .button:hover,
html[data-theme="light"] .btn:hover,
body.light-theme button:hover,
body.light-theme input[type="button"]:hover,
body.light-theme input[type="submit"]:hover,
body.light-theme .button:hover,
body.light-theme .btn:hover{
  background: var(--btn-hover-bg);
}

html[data-theme="light"] button:active,
html[data-theme="light"] input[type="button"]:active,
html[data-theme="light"] input[type="submit"]:active,
html[data-theme="light"] .button:active,
html[data-theme="light"] .btn:active,
body.light-theme button:active,
body.light-theme input[type="button"]:active,
body.light-theme input[type="submit"]:active,
body.light-theme .button:active,
body.light-theme .btn:active{
  background: var(--btn-active-bg);
}

html[data-theme="light"] button:focus-visible,
html[data-theme="light"] input[type="button"]:focus-visible,
html[data-theme="light"] input[type="submit"]:focus-visible,
html[data-theme="light"] .button:focus-visible,
html[data-theme="light"] .btn:focus-visible,
body.light-theme button:focus-visible,
body.light-theme input[type="button"]:focus-visible,
body.light-theme input[type="submit"]:focus-visible,
body.light-theme .button:focus-visible,
body.light-theme .btn:focus-visible{
  outline: none;
  box-shadow: 0 0 0 3px var(--focus-ring-color);
}

/* Support badge */
:root[data-theme="light"] .role-badge--support,
body.light-theme .role-badge--support{
  border-color: #dac6b1;
  box-shadow: 0 1px 0 rgba(0,0,0,.04), 0 2px 10px rgba(73,45,25,.10);
}

/* Collections modal/panel */
.light-theme #collection-panel,
.light-theme .col-modal,
[data-theme="light"] #collection-panel,
[data-theme="light"] .col-modal{
  --col-bg: #f8f0e6;
  --col-text: #3c2c1f;
  --col-border: rgba(95,67,42,.22);
  --col-shadow: 0 24px 60px rgba(90,60,34,.28);
  --col-scrim: rgba(42,30,22,.58);

  --col-primary: #b47440;
  --col-primary-contrast: #ffffff;
  --col-focus: rgba(180,116,64,.30);

  --col-input-bg: rgba(255,255,255,.68);
  --col-input-brd: rgba(95,67,42,.28);
  --col-chip-bg: rgba(180,116,64,.10);
  --col-chip-brd: rgba(180,116,64,.28);
  --col-chip-text: #3c2c1f;
  --col-scroll: rgba(180,116,64,.42);
  --col-hover: rgba(180,116,64,.12);
}

/* Reader tokens */
.light-theme,
[data-theme="light"]{
  --r-card-bg: #f8f0e5;
  --r-card-brd: #d8c3ad;
  --r-ink: #2f241d;
  --r-muted: #8a7566;

  --r-ctrl-bg: #fbf5ee;
  --r-ctrl-brd: #d8c3ad;

  --r-chip-bg: #efe3d4;
  --r-chip-brd: #ddc8b2;
  --r-chip-ink: #3a2a20;

  --r-accent: #a5683d;
  --r-accent-ink: #ffffff;
  --r-accent-brd: #a5683d;
  --r-focus: rgba(165,104,61,.34);
  --r-link: #7e4d2b;
  --r-link-hover: #653b22;

  --r-tab-indicator: #a5683d;
  --r-tab-ink-active: #2f241d;
  --r-tab-ink: #8a7566;

  --r-scrim: rgba(50,34,25,.56);
  --r-shadow: rgba(73,49,35,.30);
}

/* Support page polish */
.light-theme .support-shell .form-card,
[data-theme="light"] .support-shell .form-card{
  background: #f9f1e7;
  border-color: #d8c3ad;
  box-shadow: 0 10px 24px rgba(134, 96, 54, .12);
}

.light-theme .support-shell .button,
[data-theme="light"] .support-shell .button{
  background: var(--accent-600);
  color: #fff;
  border-color: var(--accent-700);
}

.light-theme .ticket:hover,
[data-theme="light"] .ticket:hover{
  border-color: var(--accent-600);
  box-shadow: 0 12px 28px rgba(134,96,54,.14);
}

/* Hint cards (if used directly by classes) */
.light-theme .hint-card,
[data-theme="light"] .hint-card{
  background: var(--surface-2);
  border: 1px solid var(--border);
  color: var(--text);
}

/* ========================================================================
   LIGHT HOTFIX — deeper book-like cream (put THIS at the very end of file)
   ======================================================================== */
:root[data-theme="light"],
body[data-theme="light"],
:root.light-theme,
body.light-theme,
.theme-light{
  /* Главный сдвиг в более тёмный/книжный тон */
  --cream-0: #e7dac8 !important;   /* page bg */
  --cream-1: #efe1cf !important;   /* cards */
  --cream-2: #e4d2bc !important;   /* elevated/hover */
  --cream-3: #dcc6ad !important;
  --cream-border: #cdb498 !important;
  --cream-border-strong: #b99978 !important;

  --surface: var(--cream-1) !important;
  --surface-2: var(--cream-2) !important;
  --surface-3: var(--cream-3) !important;
  --background: var(--cream-0) !important;
  --card-bg: var(--cream-1) !important;
  --card-brd: var(--cream-border) !important;
  --border: var(--cream-border) !important;

  --text: #2f241d !important;
  --muted: #766458 !important;

  --input-bg: #f5ebde !important;
  --input-brd: #cdb498 !important;

  --header-bg-color: #deccb5 !important; /* Firefox fallback */
  --header-bg: linear-gradient(135deg, #e6d6c1 0%, #d9c2a6 100%) !important;

  --hero-bg-color: #dfccb3 !important;   /* Firefox fallback */
  --hero-bg: linear-gradient(135deg, #e6d5bf 0%, #d6b999 100%) !important;

  --btn-secondary-bg: #e7d6c1 !important;
  --btn-secondary-hover-bg: #dcc6ad !important;
  --btn-secondary-active-bg: #d2b79a !important;
}

/* Бэкграунд страницы (чтобы не оставался "почти белым") */
html[data-theme="light"] body,
body.light-theme{
  background-color: var(--cream-0) !important;
  background-image:
    radial-gradient(1200px 520px at 10% -8%, rgba(122, 78, 42, .14), transparent 62%),
    radial-gradient(1000px 460px at 100% 0%, rgba(95, 58, 31, .10), transparent 64%),
    linear-gradient(180deg, #eadfce 0%, var(--cream-0) 260px, var(--cream-0) 100%) !important;
  color: var(--text) !important;
}

/* Поджимаем слишком белые карточки/панели на главной и списках */
html[data-theme="light"] .info-card,
html[data-theme="light"] .h-card,
html[data-theme="light"] .card,
html[data-theme="light"] .form-card,
html[data-theme="light"] .panel,
html[data-theme="light"] .hero,
html[data-theme="light"] .home-hero,
html[data-theme="light"] .guest-hero,
body.light-theme .info-card,
body.light-theme .h-card,
body.light-theme .card,
body.light-theme .form-card,
body.light-theme .panel,
body.light-theme .hero,
body.light-theme .home-hero,
body.light-theme .guest-hero{
  background: var(--cream-1) !important;
  border-color: var(--cream-border) !important;
  box-shadow: 0 8px 24px rgba(73,45,25,.12) !important;
}

/* Инпут поиска/плашки часто зашиты в #fff — перебиваем */
html[data-theme="light"] input,
html[data-theme="light"] textarea,
html[data-theme="light"] select,
body.light-theme input,
body.light-theme textarea,
body.light-theme select{
  background: var(--input-bg) !important;
  border-color: var(--input-brd) !important;
  color: var(--text) !important;
}

/* =======================================================================
   LIGHT THEME GUARD: не даём глобальным button-правилам ломать backdrop
   ======================================================================= */
html[data-theme="light"] .app-drawer .drawer-backdrop,
body.light-theme .app-drawer .drawer-backdrop,
:root[data-theme="light"] .app-drawer .drawer-backdrop,
:root.light-theme .app-drawer .drawer-backdrop{
  background: none !important;
  background-image: none !important;
  background-color: var(--overlay, rgba(39, 26, 17, .16)) !important;
  border: 0 !important;
  color: transparent !important;
}

/* ========================================================================
   LIGHT buttons final: нейтральные по умолчанию, без поломки backdrop/active
   ======================================================================== */

/* 1) Дефолтные кнопочные токены = secondary */
:root[data-theme="light"],
body[data-theme="light"],
:root.light-theme,
body.light-theme,
.theme-light{
  --btn-bg:         var(--btn-secondary-bg);
  --btn-hover-bg:   var(--btn-secondary-hover-bg);
  --btn-active-bg:  var(--btn-secondary-active-bg);
  --btn-fg:         var(--btn-secondary-fg);
  --btn-brd:        var(--btn-secondary-brd);
}

/* 2) Нейтральный вид только для обычных контролов.
      КРИТИЧНО: исключаем drawer-backdrop и активные like/sub состояния */
html[data-theme="light"] :where(
  button,
  input[type="button"],
  input[type="submit"],
  a.button, a.btn,
  button.button, button.btn
):not(.btn-primary):not(.btn--primary):not(.button--primary):not(.is-primary):not([data-variant="primary"])
:not(.drawer-backdrop):not(.app-drawer__backdrop):not(.drawer-overlay):not([data-drawer-backdrop]):not([id*="drawer-backdrop"])
:not(.is-liked):not(.liked):not([data-liked="1"]):not([data-like-active="1"]):not(.like-active)
:not(.is-subscribed):not(.subscribed):not([data-subscribed="1"]):not([data-sub-active="1"]):not(.sub-active),
body.light-theme :where(
  button,
  input[type="button"],
  input[type="submit"],
  a.button, a.btn,
  button.button, button.btn
):not(.btn-primary):not(.btn--primary):not(.button--primary):not(.is-primary):not([data-variant="primary"])
:not(.drawer-backdrop):not(.app-drawer__backdrop):not(.drawer-overlay):not([data-drawer-backdrop]):not([id*="drawer-backdrop"])
:not(.is-liked):not(.liked):not([data-liked="1"]):not([data-like-active="1"]):not(.like-active)
:not(.is-subscribed):not(.subscribed):not([data-subscribed="1"]):not([data-sub-active="1"]):not(.sub-active){
  background: var(--btn-secondary-bg);
  color: var(--btn-secondary-fg);
  border: 1px solid var(--btn-secondary-brd);
  box-shadow: 0 1px 0 rgba(73,45,25,.05);
}

html[data-theme="light"] :where(
  button,
  input[type="button"],
  input[type="submit"],
  a.button, a.btn,
  button.button, button.btn
):not(.btn-primary):not(.btn--primary):not(.button--primary):not(.is-primary):not([data-variant="primary"])
:not(.drawer-backdrop):not(.app-drawer__backdrop):not(.drawer-overlay):not([data-drawer-backdrop]):not([id*="drawer-backdrop"])
:not(.is-liked):not(.liked):not([data-liked="1"]):not([data-like-active="1"]):not(.like-active)
:not(.is-subscribed):not(.subscribed):not([data-subscribed="1"]):not([data-sub-active="1"]):not(.sub-active):hover,
body.light-theme :where(
  button,
  input[type="button"],
  input[type="submit"],
  a.button, a.btn,
  button.button, button.btn
):not(.btn-primary):not(.btn--primary):not(.button--primary):not(.is-primary):not([data-variant="primary"])
:not(.drawer-backdrop):not(.app-drawer__backdrop):not(.drawer-overlay):not([data-drawer-backdrop]):not([id*="drawer-backdrop"])
:not(.is-liked):not(.liked):not([data-liked="1"]):not([data-like-active="1"]):not(.like-active)
:not(.is-subscribed):not(.subscribed):not([data-subscribed="1"]):not([data-sub-active="1"]):not(.sub-active):hover{
  background: var(--btn-secondary-hover-bg);
  border-color: var(--cream-border-strong);
}

/* 3) Явный restore активных лайков */
html[data-theme="light"] :is(
  .like-btn.is-liked, .like-btn.liked, .like-btn.like-active, .like-btn[data-liked="1"],
  .btn-like.is-liked, .btn-like.liked, .btn-like[data-liked="1"],
  [data-action="like"][aria-pressed="true"], [data-like][aria-pressed="true"]
),
body.light-theme :is(
  .like-btn.is-liked, .like-btn.liked, .like-btn.like-active, .like-btn[data-liked="1"],
  .btn-like.is-liked, .btn-like.liked, .btn-like[data-liked="1"],
  [data-action="like"][aria-pressed="true"], [data-like][aria-pressed="true"]
){
  background: var(--like-on-bg) !important;
  color: var(--like-on-tx) !important;
  border-color: var(--like-on-brd) !important;
}

/* 4) Явный restore активных подписок */
html[data-theme="light"] :is(
  .sub-btn.is-subscribed, .sub-btn.subscribed, .sub-btn.sub-active, .sub-btn[data-subscribed="1"],
  .subscription-btn.is-subscribed, .subscription-btn.subscribed, .subscription-btn[data-subscribed="1"],
  [data-action="subscribe"][aria-pressed="true"], [data-subscribe][aria-pressed="true"]
),
body.light-theme :is(
  .sub-btn.is-subscribed, .sub-btn.subscribed, .sub-btn.sub-active, .sub-btn[data-subscribed="1"],
  .subscription-btn.is-subscribed, .subscription-btn.subscribed, .subscription-btn[data-subscribed="1"],
  [data-action="subscribe"][aria-pressed="true"], [data-subscribe][aria-pressed="true"]
){
  background: var(--sub-on-bg) !important;
  color: var(--sub-on-fg) !important;
  border-color: var(--sub-on-brd) !important;
}