@import url('https://fonts.googleapis.com/css2?family=Inter:wght@300;400;500;600;700&display=swap');
*{margin:0;padding:0;box-sizing:border-box;}

/* ── Тёмная тема (по умолчанию) ── */
:root {
  --bg:          #000;
  --bg1:         #0a0a0a;
  --bg2:         #111;
  --bg3:         #1c1c1e;
  --surface:     #0e0e0e;
  --surface2:    #111;
  --border:      rgba(255,255,255,0.35);
  --border2:     rgba(255,255,255,.1);
  --border3:     rgba(255,255,255,.06);
  --text:        #fff;
  --text80:      rgba(255,255,255,.8);
  --text65:      rgba(255,255,255,.65);
  --text55:      rgba(255,255,255,.55);
  --text45:      rgba(255,255,255,.45);
  --text35:      rgba(255,255,255,.5);
  --text25:      rgba(255,255,255,.25);
  --text20:      rgba(255,255,255,.2);
  --text12:      rgba(255,255,255,.12);
  --hover-bg:    rgba(255,255,255,.04);
  --hover-bg2:   rgba(255,255,255,.2);
  --input-bg:    rgba(255,255,255,.05);
  --header-bg:   rgba(0,0,0,.92);
  --modal-bg:    #0e0e0e;
  --tag-bg:      rgba(255,255,255,.07);
  --tag-bg-hover:rgba(255,255,255,.12);
  --progress-bg: rgba(255,255,255,.07);
  --progress-fill: #fff;
  --row-hover:   rgba(255,255,255,.065);
  --shadow:      rgba(0,0,0,.6);
  --accent-text: rgba(255,255,255,.92);
  --accent-btn:  rgba(255,255,255,.9);
  --accent-btn-text: #000;
  --toast-bg:    #1c1c1e;
  --toast-text:  rgba(255,255,255,.92);
  --yellow:      rgb(255,214,10);
  --border-radius-icons: 20px;
  /* Кружки в шапке: единый размер */
  --list-header-icon: 50px;
  /* Чуть выше 60px, чтобы 50px-кружки не прилипали к краям */
  --list-header-h: 64px;
  /* Аватар в хедере и в меню — один стиль (см. .profile-avatar-btn) */
  --menu-avatar-ring-bg: linear-gradient(135deg, #e0055a, #ff6b35);
  --profile-avatar-glow: 0 4px 16px rgba(224, 5, 90, 0.3);
  --profile-avatar-glow-hover: 0 6px 20px rgba(224, 5, 90, 0.4);
  --bac: #000;
}

html.theme-light-pre body, body.theme-light {
  --bg:          #f2f2f7;
  --bg1:         #f2f2f7;
  --bg2:         #ffffff;
  --bg3:         #e5e5ea;
  --surface:     #ffffff;
  --surface2:    #f8f8fa;
  --border:      rgba(0,0,0,.08);
  --border2:     rgba(0,0,0,.12);
  --border3:     rgba(0,0,0,.06);
  --text:        #0a0a0a;
  --text80:      rgba(0,0,0,.8);
  --text65:      rgba(0,0,0,.65);
  --text55:      rgba(0,0,0,.55);
  --text45:      rgba(0,0,0,.45);
  --text35:      rgba(0,0,0,.4);
  --text25:      rgba(0,0,0,.35);
  --text20:      rgba(0,0,0,.3);
  --text12:      rgba(0,0,0,.1);
  --hover-bg:    rgba(0,0,0,.04);
  --hover-bg2:   rgba(0,0,0,.07);
  --input-bg:    rgba(0,0,0,.04);
  --header-bg:   rgba(242,242,247,.96);
  --modal-bg:    #ffffff;
  --tag-bg:      rgba(0,0,0,.06);
  --tag-bg-hover:rgba(0,0,0,.1);
  --progress-bg: rgba(0,0,0,.08);
  --progress-fill: #0a0a0a;
  --row-hover:   rgba(0,0,0,.045);
  --shadow:      rgba(0,0,0,.15);
  --accent-text: rgba(0,0,0,.9);
  --accent-btn:  #0a0a0a;
  --accent-btn-text: #fff;
  --toast-bg:    #ffffff;
  --toast-text:  rgba(0,0,0,.85);
}

body{background:var(--bg);color:var(--text);font-family:'Inter',-apple-system,sans-serif;min-height:100vh;overflow-x:hidden;transition:background .3s,color .3s;}
html.pwa-splash-on,html.pwa-splash-on body{overflow:hidden;height:100%;touch-action:none;}
#pwa-splash{
  display:none;position:fixed;inset:0;z-index:2147483000;
  align-items:center;justify-content:center;flex-direction:column;
  background:#000;
  -webkit-tap-highlight-color:transparent;
}
html.pwa-splash-on #pwa-splash{display:flex;}
#pwa-splash::before{
  content:'';position:absolute;inset:0;pointer-events:none;
  background:radial-gradient(ellipse 80% 55% at 50% 42%,rgba(45,60,105,.22) 0%,transparent 68%);
}
html.theme-light-pre #pwa-splash{background:#f2f2f7;}
html.theme-light-pre #pwa-splash::before{
  background:radial-gradient(ellipse 80% 55% at 50% 42%,rgba(120,130,200,.12) 0%,transparent 65%);
}
.pwa-splash__inner{
  position:relative;z-index:1;
  perspective:520px;
  transform-style:preserve-3d;
}
.pwa-splash__logo{
  font-size:13px;font-weight:600;letter-spacing:.35em;text-transform:uppercase;
  color:rgba(255,255,255,.25);
  white-space:nowrap;
  animation:pwa-splash-logo 1.15s cubic-bezier(.22,.85,.32,1) forwards;
  will-change:transform,opacity,filter;
}
html.theme-light-pre .pwa-splash__logo{color:rgba(0,0,0,.32);}
@keyframes pwa-splash-logo{
  0%{opacity:.2;transform:translate3d(0,0,-120px) scale(.82);filter:blur(5px);}
  45%{opacity:1;filter:blur(0);}
  100%{opacity:1;transform:translate3d(0,0,28px) scale(1.12);filter:blur(0);}
}
#pwa-splash.pwa-splash--out{
  pointer-events:none;
  transition:opacity .42s ease,visibility 0s linear .42s;
  opacity:0;visibility:hidden;
}
#pwa-splash.pwa-splash--out .pwa-splash__logo{
  transition:transform .38s ease,opacity .38s ease;
  transform:translate3d(0,0,56px) scale(1.28)!important;
  opacity:0;
}
@media (prefers-reduced-motion:reduce){
  .pwa-splash__logo{animation-duration:.01s;animation-fill-mode:forwards;}
  @keyframes pwa-splash-logo{
    to{opacity:1;transform:none;filter:none;}
  }
  #pwa-splash.pwa-splash--out{transition-duration:.12s;}
  #pwa-splash.pwa-splash--out .pwa-splash__logo{transition-duration:.12s;}
}
.page{display:none;}
/* Только min-height — не height/max-height/overflow: иначе WebKit ломает touch-скролл во внутренних overflow при sticky-шапке */
.page.active{
  display:flex;
  flex-direction:column;
  min-height:100vh;
}
@media (max-width:768px){
  .page.vs-edge-swipe--drag{
    box-shadow:-12px 0 32px rgba(0,0,0,.4);
  }
  body.theme-light .page.vs-edge-swipe--drag{
    box-shadow:-10px 0 28px rgba(0,0,0,.14);
  }
}

/* ── Светлая: точечные переопределения ── */
body.theme-light #landing,
body.theme-light #home           { background:var(--bg); }
body.theme-light #movies-page,
body.theme-light #series-page,
body.theme-light #watchlist-page,
body.theme-light #detail-page,
body.theme-light #calendar-page,
body.theme-light #statistics-page { background:var(--bg); }

body.theme-light .list-header,
body.theme-light .detail-header  { background:var(--header-bg); border-color:var(--border); }
body.theme-light .list-logo       { color:var(--text35); }
body.theme-light .list-logo:hover { color:var(--text65); }
body.theme-light .list-header-tabs{ background:var(--tag-bg); border-color:var(--border3); }
body.theme-light .list-header-tab { color:var(--text35); }
body.theme-light .list-header-tab.active{ background:var(--bg2); color:var(--text); box-shadow:0 1px 4px var(--shadow); }
body.theme-light .list-header-tab:not(.active):hover{ color:var(--text65); }
body.theme-light .list-header-tab.calendar-tab{ color:rgba(150,115,0,.9); }
body.theme-light .list-header-tab.calendar-tab.active{ background:rgba(255,214,10,.22); color:rgba(42,32,0,.95); box-shadow:0 1px 4px var(--shadow); }
body.theme-light .list-header-tab.calendar-tab:not(.active):hover{ color:rgba(110,85,0,.95); }
body.theme-light #notif-bell-btn{ background:var(--tag-bg); border-color:var(--border3); }
body.theme-light #notif-bell-btn:hover{ background:var(--tag-bg-hover); border-color:var(--border2); box-shadow:0 0 16px rgba(0,0,0,.12); }
body.theme-light #notif-bell-btn:hover:not(.notif-unread) #notif-bell-svg{ stroke:var(--text) !important; }
body.theme-light .back-btn        { background:var(--tag-bg); border-color:var(--border); color:var(--text55); }
body.theme-light .back-btn:hover  { background:var(--tag-bg-hover); color:var(--text); border-color:var(--border2); box-shadow:0 0 16px rgba(0,0,0,.12); }
body.theme-light .back-btn:hover svg{ stroke:var(--text) !important; }
body.theme-light .list-header-burger.menu-avatar-trigger,
body.theme-light .detail-header .list-header-burger.menu-avatar-trigger{background:var(--menu-avatar-ring-bg);border:none;box-shadow:0 3px 14px rgba(224,5,90,.22);}
body.theme-light .list-header-burger.menu-avatar-trigger:hover,
body.theme-light .detail-header .list-header-burger.menu-avatar-trigger:hover{box-shadow:var(--profile-avatar-glow-hover);}
body.theme-light #desktop-burger-btn.menu-avatar-trigger{background:var(--menu-avatar-ring-bg);border:none;box-shadow:0 3px 14px rgba(224,5,90,.22);}
body.theme-light #desktop-burger-btn.menu-avatar-trigger:hover{box-shadow:var(--profile-avatar-glow-hover);}
body.theme-light .vs-desktop-stats-btn{background:var(--tag-bg);border-color:var(--border3);color:var(--text65);}
body.theme-light .vs-desktop-stats-btn:hover{background:var(--tag-bg-hover);border-color:var(--border2);color:var(--text);box-shadow:0 0 16px rgba(0,0,0,.12);}

body.theme-light .feature-cell    { background:var(--bg2); border-color:var(--border); }
body.theme-light .feature-cell:hover{ background:var(--bg3); }
body.theme-light .feature-title   { color:var(--text80); }
body.theme-light .feature-desc    { color:var(--text45); }
body.theme-light .landing-logo-text{ color:var(--text35); }
body.theme-light .landing-btns    { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .land-btn.ghost  { color:var(--text55); }
body.theme-light .land-btn.ghost:hover{ color:var(--text); }
body.theme-light .land-btn.solid  { background:var(--tag-bg-hover); color:var(--text80); border-color:var(--border); }

body.theme-light .tabs            { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .tab             { color:var(--text45); }
body.theme-light .tab:hover       { color:var(--text80); background:var(--hover-bg2); }
body.theme-light .search-bar      { background:var(--bg2); border-color:var(--border2); box-shadow:0 2px 8px var(--shadow); }
body.theme-light .search-bar:focus-within{ border-color:rgba(0,0,0,.25); }
body.theme-light .search-icon     { color:var(--text35); }
body.theme-light .search-input    { color:var(--text); }
body.theme-light .search-input::placeholder{ color:var(--text25); }
body.theme-light .ac-dropdown     { background:var(--bg2); border-color:var(--border2); }
body.theme-light .home-search-pill{ background:var(--bg); border-color:var(--border2); color:var(--text45); }
body.theme-light .home-search-pill:hover{ background:var(--bg2); color:var(--text65); }
body.theme-light .home-search-pill.active{ background:rgba(0,0,0,.08); border-color:rgba(0,0,0,.22); color:var(--text); }
body.theme-light .ac-item:hover   { background:var(--hover-bg); }
body.theme-light .ac-title        { color:var(--text80); }
body.theme-light .ac-meta         { color:var(--text45); }

body.theme-light table            { background:transparent; }
body.theme-light thead tr         { border-color:var(--border3); }
body.theme-light thead th         { color:var(--text35); }
body.theme-light thead th.sortable:hover{ color:var(--text55); }
body.theme-light tbody tr         { border-color:var(--border3); }
body.theme-light tbody td         { color:var(--text65); }
body.theme-light .col-title       { color:var(--text80); }
body.theme-light .col-title:hover { color:var(--text); }
body.theme-light .col-genre,
body.theme-light .col-year        { color:var(--text45); }
body.theme-light .delete-btn      { color:var(--text20); }
body.theme-light .platform-badge  { background:var(--tag-bg); border-color:var(--border); color:var(--text55); }
body.theme-light .platform-badge:hover{ background:var(--tag-bg-hover); color:var(--text80); }
body.theme-light .tag-pill-icon   { background:var(--tag-bg); border-color:var(--border2); color:var(--text65); }
body.theme-light .tag-pill-icon:hover{ background:var(--tag-bg-hover); }
body.theme-light .page-search     { background:var(--bg2); border-color:var(--border2); }
body.theme-light .page-search input{ color:var(--text); }
body.theme-light .page-search input::placeholder{ color:var(--text25); }
body.theme-light .page-search svg { color:var(--text35); }

body.theme-light .detail-title    { color:var(--text); }
body.theme-light .detail-desc     { color:var(--text55); }
body.theme-light .detail-meta-line { color:var(--text35); }
body.theme-light .detail-overview-toggle { color:var(--text45); }
body.theme-light .detail-overview-toggle:hover { color:var(--text65); }
body.theme-light .badge           { background:var(--tag-bg); border-color:var(--border); color:var(--text55); }
body.theme-light .det-section     { color:var(--text35); }
body.theme-light .actor-chip      { background:var(--tag-bg); border-color:var(--border); color:var(--text55); }
body.theme-light .actor-chip:hover{ background:var(--tag-bg-hover); color:var(--text80); }
body.theme-light .actor-avatar    { background:var(--tag-bg); border-color:var(--border2); }
body.theme-light .actor-circle:hover .actor-avatar{ border-color:rgba(0,0,0,.25); }
body.theme-light .actor-circle-name { color:var(--text45); }
body.theme-light .actor-circle:hover .actor-circle-name{ color:var(--text80); }
body.theme-light .actors-scroll-wrap { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .actors-expand-btn { color:var(--text35); }
body.theme-light .actors-expand-btn:hover{ color:var(--text65); background:var(--hover-bg); }
body.theme-light .director-chip   { background:var(--tag-bg); border-color:var(--border); color:var(--text55); }
body.theme-light .director-chip:hover{ background:var(--tag-bg-hover); color:var(--text80); }
body.theme-light .det-main-btn.in-list { background:#FFD60A; color:#000; }
body.theme-light .det-sec-btn     { border-color:var(--border2); background:var(--tag-bg); color:var(--text55); }
body.theme-light .det-sec-btn:hover{ background:var(--tag-bg-hover); color:var(--text); }
body.theme-light .det-sec-btn.in-list{ border-color:rgba(255,214,10,.42); color:#b38600; background:rgba(255,214,10,.12); }
body.theme-light .det-sec-btn.in-list:hover{ background:rgba(255,214,10,.18); color:#7a5a00; border-color:rgba(255,214,10,.5); }
body.theme-light .det-bell-btn    { border-color:var(--border2); background:var(--tag-bg); color:var(--text45); }
body.theme-light .det-bell-btn:hover{ background:var(--tag-bg-hover); color:var(--text80); }
body.theme-light .det-platform-select-btn{ border-color:var(--border2); background:var(--tag-bg); color:var(--text45); }
body.theme-light .det-platform-select-btn:hover{ background:var(--tag-bg-hover); color:var(--text80); }
body.theme-light .det-platform-select-btn.active{ background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text80); }
body.theme-light .det-heart-btn   { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .det-heart-btn:hover{ background:var(--tag-bg-hover); }
body.theme-light .det-tags-bar    { background:var(--tag-bg); border-color:var(--border2); }
body.theme-light .det-tags-bar-icon{ color:var(--text55); }
body.theme-light .det-tags-bar-scroll .det-tag-btn{ background:var(--tag-bg); border-color:var(--border2); color:var(--text55); }
body.theme-light .det-tags-bar-scroll .det-tag-btn:hover{ background:var(--tag-bg-hover); color:var(--text); border-color:var(--border2); }
body.theme-light .det-tags-bar-scroll .det-tag-btn.active{ background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text); }
body.theme-light .det-tags-bar-scroll .det-tag-btn .det-tag-btn__ico{ opacity:.7; }
body.theme-light .det-tags-bar-scroll .det-tag-btn.active .det-tag-btn__ico{ opacity:1; }
body.theme-light .det-tags-bar-more{ background:var(--tag-bg); border-color:var(--border2); color:var(--text55); }
body.theme-light .det-tags-bar-more:hover{ background:var(--tag-bg-hover); color:var(--text80); border-color:var(--border2); }
body.theme-light .det-tags-bar-empty{ color:var(--text35); }
body.theme-light .det-later-circle:not(.in-list){ color:var(--text55); border-color:var(--border2); background:var(--tag-bg); }
body.theme-light .det-later-circle.in-list{ border-color:rgba(0,122,255,.38); background:rgba(0,122,255,.1); color:#007AFF; }
body.theme-light .det-premiere-value{ color:var(--text80); }
body.theme-light .det-date-input  { background:var(--tag-bg); border-color:var(--border); color:var(--text55); color-scheme:light; }
body.theme-light .det-date-input:hover{ border-color:var(--border2); color:var(--text65); }
body.theme-light .det-date-input:focus{ border-color:var(--border2); color:var(--text80); }
body.theme-light .det-date-input::-webkit-calendar-picker-indicator{ opacity:.45; filter:none; }
body.theme-light .det-action-btn  { border-color:var(--border2); color:var(--text55); }
body.theme-light .det-action-btn:hover{ background:var(--hover-bg); color:var(--text); }
body.theme-light .det-action-btn.accent{ background:var(--accent-btn); color:var(--accent-btn-text); border-color:transparent; }
body.theme-light .ep-picker-box   { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .ep-picker-ctrl .ep-btn{ background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text); }
body.theme-light .ep-picker-ctrl .ep-total{ color:var(--text35); }
body.theme-light .ep-progress-pct{ color:var(--text); }
body.theme-light .det-mark-done-btn{ background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text); }
body.theme-light .det-mark-done-btn:hover{ background:var(--hover-bg2); }
body.theme-light .status-opt      { border-color:var(--border2); background:var(--tag-bg); color:var(--text45); }
body.theme-light .progress-bar-wrap{ background:var(--progress-bg); }
body.theme-light .progress-bar-fill{ background:var(--progress-fill); }
body.theme-light .comment-textarea{ background:var(--tag-bg); border-color:var(--border2); color:var(--text); }
body.theme-light .comment-textarea::placeholder{ color:var(--text25); }
body.theme-light .comment-textarea:focus{ border-color:rgba(0,0,0,.25); }
body.theme-light .comment-save-btn{ background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text55); }
body.theme-light .comment-save-btn:hover{ background:rgba(0,0,0,.12); color:var(--text); }
body.theme-light .det-platform-btn{ background:var(--tag-bg); border-color:var(--border); color:var(--text45); }
body.theme-light .det-platform-btn:hover{ background:var(--tag-bg-hover); color:var(--text80); }
body.theme-light .det-platform-btn.active{ background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text80); }
/* Панель тегов + платформа (список / карточка) */
body.theme-light #tagPicker.tag-picker,
body.theme-light .tag-picker{
  background:var(--modal-bg);
  border-color:var(--border2);
  box-shadow:0 16px 48px var(--shadow);
}
body.theme-light .tag-picker-title,
body.theme-light .tag-picker-divider{ color:var(--text35); }
body.theme-light .tag-icon-btn{
  border-color:var(--border2);
  background:var(--tag-bg);
  color:var(--text45);
}
body.theme-light .tag-icon-btn:hover{
  background:var(--tag-bg-hover);
  border-color:var(--border);
  color:var(--text);
}
body.theme-light .tag-icon-btn.selected{
  background:var(--tag-bg-hover);
  border-color:var(--border2);
  color:var(--text);
}
body.theme-light .platform-opt{
  background:var(--tag-bg);
  border-color:var(--border2);
  color:var(--text45);
}
body.theme-light .platform-opt:hover{
  background:var(--tag-bg-hover);
  color:var(--text);
}
body.theme-light .platform-opt.selected{
  background:var(--tag-bg-hover);
  border-color:var(--border2);
  color:var(--text);
}
body.theme-light .tag-picker-save{
  background:var(--text);
  color:#fff;
}
body.theme-light .tag-picker-save:hover{
  background:rgba(0,0,0,.82);
}
body.theme-light .det-plat-picker{
  background:var(--modal-bg);
  border-color:var(--border2);
  box-shadow:0 12px 40px var(--shadow);
}
body.theme-light .det-plat-picker .det-plat-picker-clear{ color:var(--text35); }
body.theme-light .det-divider     { background:var(--border); }
body.theme-light .det-trailer-btn { background:var(--tag-bg); border-color:var(--border2); color:var(--text55); }
body.theme-light .det-trailer-btn:hover{ background:var(--tag-bg-hover); color:var(--text); }
body.theme-light .detail-poster   { border-color:var(--border); }
body.theme-light .det-comment-row { background:var(--tag-bg) !important; }

body.theme-light .slide-menu      { background:var(--surface2); border-color:var(--border); }
body.theme-light .menu-overlay.open{ background:rgba(0,0,0,.3); }
body.theme-light .menu-close      { background:var(--tag-bg); color:var(--text45); }
body.theme-light .menu-profile    { border-color:var(--border3); }
body.theme-light .profile-name    { color:var(--text); }
body.theme-light .profile-sub     { color:var(--text35); }
body.theme-light .p-stat          { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .p-stat-num      { color:var(--text); }
body.theme-light .p-stat-lbl      { color:var(--text35); }
body.theme-light .menu-row-icon   { background:var(--tag-bg); border-color:var(--border); color:var(--text55); }
body.theme-light .menu-row-icon svg{ opacity:.85; filter:none !important; stroke:currentColor; }
body.theme-light .menu-row-label  { color:var(--text65); }
body.theme-light .menu-row.clickable:hover{ background:var(--hover-bg); }
body.theme-light .menu-section-title{ color:var(--text35); }
body.theme-light .menu-divider    { background:var(--border); }
body.theme-light .menu-card       { background:var(--tag-bg); border-color:var(--border); }
body.theme-light .menu-card-row:hover{ background:var(--hover-bg); }
body.theme-light .menu-card-label { color:var(--text80); }
body.theme-light .menu-card-value { color:var(--text45); }
body.theme-light .security-header:hover{ background:var(--hover-bg); }
body.theme-light .security-chevron{ color:var(--text35); }
body.theme-light .security-body   { border-color:var(--border3); }
body.theme-light .security-input  { background:var(--tag-bg); border-color:var(--border2); color:var(--text); }
body.theme-light .security-input::placeholder{ color:var(--text25); }
body.theme-light .security-input:focus{ border-color:rgba(0,0,0,.25); }
body.theme-light .security-save   { background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text65); }
body.theme-light .profile-edit-input{ background:var(--tag-bg); border-color:var(--border2); color:var(--text); }
body.theme-light .download-btn    { border-color:var(--border); color:var(--text45); }
body.theme-light .download-btn:hover{ border-color:var(--border2); color:var(--text65); }
body.theme-light .toggle-track    { background:var(--tag-bg-hover); border-color:var(--border2); }
body.theme-light .toggle input:checked + .toggle-track{ background:rgba(0,0,0,.75); }
body.theme-light .toggle-track::after{ background:var(--bg3); }
body.theme-light .toggle input:checked + .toggle-track::after{ background:#fff; }
body.theme-light .lang-btn        { border-color:var(--border); color:var(--text45); }
body.theme-light .lang-btn.active { background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text80); }

body.theme-light .add-modal       { background:var(--modal-bg); border-color:var(--border2); }
body.theme-light .add-modal-title { color:var(--text); }
body.theme-light .add-modal-sub   { color:var(--text45); }
body.theme-light .add-input       { background:var(--tag-bg); border-color:var(--border2); color:var(--text); }
body.theme-light .add-input::placeholder{ color:var(--text25); }
body.theme-light .add-label       { color:var(--text45); }
body.theme-light .add-confirm     { background:var(--accent-btn); color:var(--accent-btn-text); }

body.theme-light .confirm-box     { background:var(--modal-bg); border-color:var(--border2); box-shadow:0 20px 60px var(--shadow); }
body.theme-light .kp-mig-panel    { background:var(--modal-bg); border-color:var(--border2); box-shadow:0 24px 80px var(--shadow); }
body.theme-light .kp-mig-title    { color:var(--text); }
body.theme-light .kp-mig-hint,
body.theme-light .kp-mig-summary,
body.theme-light .kp-mig-instruct-full { color:var(--text55); }
body.theme-light .kp-mig-instruct-full { border-color:var(--border2); background:var(--tag-bg); }
body.theme-light .kp-mig-example { background:rgba(0,0,0,.06); color:var(--text65); }
body.theme-light .kp-mig-instruct-toggle { color:rgba(120,90,0,.95); }
body.theme-light .kp-mig-inline-warn { color:rgba(180,50,50,.95); }
body.theme-light .kp-mig-textarea { background:var(--tag-bg); border-color:var(--border2); color:var(--text); }
body.theme-light .kp-mig-table-wrap { border-color:var(--border2); }
body.theme-light .kp-mig-table td   { color:var(--text65); border-color:var(--border3); }
body.theme-light .kp-mig-err      { color:rgba(180,50,50,.95); }
body.theme-light tr.kp-mig-row-bad td { background:rgba(255,80,80,.06); color:var(--text55); }
body.theme-light tr.kp-mig-row-bad td.kp-mig-err { color:rgba(160,40,40,.95); }
body.theme-light .kp-mig-menu-btn { border-color:var(--border2); background:rgba(255,214,10,.14); color:rgba(90,70,0,.95); }
body.theme-light .kp-mig-hint a { color:rgba(140,100,0,.95) !important; }
body.theme-light .confirm-title   { color:var(--text); }
body.theme-light .confirm-msg     { color:var(--text45); }
body.theme-light .confirm-btn.cancel{ background:var(--tag-bg-hover); color:var(--text65); }
body.theme-light .confirm-btn-cancel{ background:var(--tag-bg-hover); color:var(--text65); }
body.theme-light .lp-menu         { background:var(--modal-bg); border-color:var(--border2); }
body.theme-light .lp-item         { color:var(--text80); }
body.theme-light .lp-item:hover   { background:var(--hover-bg); }
body.theme-light .lp-divider      { background:var(--border); }

body.theme-light .view-btn        { background:var(--tag-bg); border-color:var(--border); color:var(--text45); }
body.theme-light .view-btn.active { background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text); }
body.theme-light .view-btn:hover:not(.active){ background:var(--tag-bg-hover); color:var(--text65); }
body.theme-light .view-btn:hover  { border-color:rgba(0,0,0,.22); box-shadow:0 0 16px rgba(0,0,0,.1); }
body.theme-light .rec-btn         { background:var(--tag-bg); border-color:var(--border2); color:var(--text55); }
body.theme-light .rec-btn:hover   { background:var(--tag-bg-hover); color:var(--text); }

body.theme-light .cal-day         { background:var(--bg2); border-color:var(--border); }
body.theme-light .cal-day:hover   { background:var(--bg3); }
body.theme-light .cal-day.today   { border-color:rgba(0,0,0,.28); box-shadow:0 0 0 1px rgba(0,0,0,.06); }
body.theme-light .cal-day.has-events{ background:var(--surface2); }
body.theme-light .cal-day-label   { color:var(--text45); font-weight:600; }
body.theme-light .cal-day.today .cal-day-label{ color:var(--text); font-weight:700; }
body.theme-light .cal-day-num     { color:var(--text); }
body.theme-light .cal-dow-cell    { color:var(--text45); }
body.theme-light .cal-dow-cell::before { background:rgba(0,0,0,.1); }
body.theme-light .cal-event-name  { color:var(--text65); }
body.theme-light .cal-more        { color:var(--text45); }
body.theme-light #cal-day-modal,
body.theme-light .cal-day-modal   { background:var(--modal-bg); border-color:var(--border2); }
body.theme-light .cal-day-overlay { background:rgba(0,0,0,.45); }
body.theme-light .cal-day-modal-title { color:var(--text); }
body.theme-light .cal-day-modal-close { background:var(--tag-bg); color:var(--text55); }
body.theme-light .cal-day-modal-close:hover { background:var(--tag-bg-hover); color:var(--text); }
body.theme-light .cal-day-empty { color:var(--text35); }
body.theme-light .cal-day-row { border-bottom-color:var(--border3); }
body.theme-light .cal-day-row-poster-ph { background:var(--tag-bg); border:1px solid var(--border); box-sizing:border-box; }
body.theme-light .cal-day-row-title { color:var(--text); }
body.theme-light .cal-day-row-sub { color:var(--text45); }
body.theme-light #cal-bg-modal,
body.theme-light .cal-bg-modal    { background:var(--modal-bg); border-color:var(--border2); box-shadow:0 24px 80px var(--shadow); }
body.theme-light .cal-bg-overlay  { background:rgba(0,0,0,.45); }
body.theme-light .cal-bg-modal-head { border-bottom-color:var(--border3); }
body.theme-light .cal-bg-modal-title { color:var(--text); }
body.theme-light .cal-bg-modal-close { background:var(--tag-bg); color:var(--text55); }
body.theme-light .cal-bg-modal-close:hover { background:var(--tag-bg-hover); color:var(--text); }
body.theme-light .cal-bg-modal-hint { color:var(--text45); }
body.theme-light .cal-bg-empty { color:var(--text35); }
body.theme-light .cal-bg-row      { border-color:var(--border3); }
body.theme-light .cal-bg-row:hover { background:var(--tag-bg); }
body.theme-light .cal-bg-row-title { color:var(--text); }
body.theme-light .cal-bg-row-meta { color:var(--text45); }
body.theme-light .cal-bg-row-type { color:var(--text35); }
body.theme-light .cal-bg-row-poster-ph { background:var(--tag-bg); border:1px solid var(--border); box-sizing:border-box; }
body.theme-light .cal-bg-load-btn { background:var(--tag-bg); border-color:var(--border2); color:var(--text); }

body.theme-light #notif-panel.notif-panel-root{ background:var(--modal-bg); border-color:var(--border2); box-shadow:0 8px 32px var(--shadow); }
body.theme-light .notif-panel-title { color:var(--text65); }
body.theme-light .notif-panel-btn-cal { background:var(--tag-bg); border-color:var(--border2); color:var(--text55); }
body.theme-light .notif-panel-btn-readall { color:var(--text35); }
body.theme-light .notif-empty { color:var(--text35); }
body.theme-light .notif-row--unread { background:var(--tag-bg); border-color:var(--border2); }
body.theme-light .notif-row-click:hover { background:var(--tag-bg-hover); }
body.theme-light .notif-row-dismiss { background:rgba(0,0,0,.06); color:var(--text45); }
body.theme-light .notif-row-dismiss:hover { background:rgba(0,0,0,.1); color:var(--text); }
body.theme-light .notif-row-msg--read { color:var(--text55); }
body.theme-light .notif-row-msg--unread { color:var(--text); }
body.theme-light .notif-row-meta { color:var(--text35); }
body.theme-light .tag-filter-active{ background:var(--tag-bg-hover); color:var(--text55); }

body.theme-light .gallery-poster  { border-color:var(--border); }
body.theme-light .gallery-poster-bg{ filter:brightness(.95); }

/* ══════════════════════════════════════════════════════════════
   СВЕТЛАЯ ТЕМА — все фиксы в одном месте
   ════════════════════════════════════════════════════════════ */

/* Меню — currentColor + без invert (иконки видны на светлом фоне) */
body.theme-light .slide-menu { color:var(--text65); }
body.theme-light .slide-menu svg { filter:none !important; opacity:1; }
body.theme-light .slide-menu .toggle-track,
body.theme-light .slide-menu .toggle-track::after { filter:none !important; }
body.theme-light .menu-close { color:var(--text45); }
body.theme-light .menu-close svg { filter:none !important; opacity:1; }
body.theme-light .security-chevron { color:var(--text45) !important; filter:none !important; opacity:1; }

/* Строки меню */
body.theme-light .menu-row-label { color:var(--text65) !important; }
body.theme-light .menu-row.clickable:hover { background:var(--hover-bg); }
body.theme-light .menu-divider { background:var(--border); }
body.theme-light .menu-row-icon { background:var(--tag-bg); border-color:var(--border); }

/* Профиль в боковом меню — имя, подзаголовок (смена аватара — модалка с экрана Друзья) */
body.theme-light .profile-name { color:var(--text) !important; }
body.theme-light .profile-sub  { color:var(--text45) !important; }
body.theme-light .profile-action-tile {
  background:var(--tag-bg) !important; border-color:var(--border2) !important;
}
body.theme-light .profile-avatar-picker-grid { border-top-color:var(--border2) !important; }
body.theme-light .profile-avatar-row-chev { color:var(--text45) !important; opacity:.55 !important; }
body.theme-light #avatarPickerGrid button { filter:none !important; }

/* Настройки — тоггл строки */
body.theme-light .toggle-btn-row { background:var(--tag-bg) !important; border-color:var(--border2) !important; }
body.theme-light .toggle-btn-row span { color:var(--text65) !important; }
body.theme-light .security-header .menu-row-label { color:var(--text) !important; font-weight:600; }
body.theme-light #securityBody > button { color:var(--text45) !important; }
body.theme-light #securityBody > button:hover { color:var(--text) !important; }
body.theme-light #settingsBody .menu-row-label { color:var(--text45) !important; }

/* Язык, кнопки скачивания */
body.theme-light .lang-btn { border-color:var(--border); color:var(--text45); filter:none; }
body.theme-light .lang-btn.active { background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text80); }
body.theme-light .download-btn { border-color:var(--border); color:var(--text45); filter:none; }
body.theme-light .download-btn:hover { color:var(--text65); }

/* Безопасность — поля ввода */
body.theme-light .security-input { background:var(--tag-bg); border-color:var(--border2); color:var(--text); }
body.theme-light .security-input::placeholder { color:var(--text25); }
body.theme-light .security-save { background:var(--tag-bg-hover); border-color:var(--border2); color:var(--text65); }

/* Выход */
body.theme-light .slide-menu [onclick*="logout"] .menu-row-label { color:var(--text65) !important; }

/* Back btn — SVG не инвертировать, уже тёмный фон */
body.theme-light .back-btn svg { filter:none !important; stroke:var(--text55); }
body.theme-light .back-btn { color:var(--text55); }

/* Колокольчик */
body.theme-light #notif-bell-svg,
body.theme-light .notif-bell-list-mobile svg { stroke:rgba(0,0,0,.45) !important; filter:none !important; }
body.theme-light #notif-bell-btn.notif-unread #notif-bell-svg,
body.theme-light .notif-bell-list-mobile.notif-unread svg { stroke:#e0055a !important; filter:drop-shadow(0 0 4px rgba(224,5,90,.35)) !important; }
body.theme-light #notif-badge,
body.theme-light .notif-badge-list-mobile { background:rgba(0,0,0,.15) !important; color:var(--text) !important; }
body.theme-light #notif-badge.notif-badge-active,
body.theme-light .notif-badge-list-mobile.notif-badge-active { background:#e0055a !important; color:#fff !important; box-shadow:0 0 0 1px rgba(255,255,255,.25); }
body.theme-light .notif-bell-list-mobile{ background:var(--tag-bg); border-color:var(--border3); }
body.theme-light .notif-bell-list-mobile:hover{ background:var(--tag-bg-hover); border-color:var(--border); }

/* ── AI Пилюля (Dynamic Island) ── */
body.theme-light .di-pill { background:#fff !important; border-color:rgba(0,0,0,.12) !important; box-shadow:0 4px 20px rgba(0,0,0,.12); }
body.theme-light .di-idle-dot  { filter:none !important; }
body.theme-light .di-idle-label { color:rgba(0,0,0,.55) !important; }
body.theme-light .di-chat-title { color:rgba(0,0,0,.75) !important; }
body.theme-light .di-chat-hdot  { background:rgba(0,0,0,.4) !important; }
body.theme-light .di-msg.ai   { background:rgba(0,0,0,.06) !important; color:rgba(0,0,0,.7) !important; }
body.theme-light .di-msg.user { background:rgba(0,0,0,.1) !important; color:rgba(0,0,0,.85) !important; }
body.theme-light .di-typing span { background:rgba(0,0,0,.35) !important; }
body.theme-light .di-input { background:rgba(0,0,0,.05) !important; border-color:rgba(0,0,0,.12) !important; color:rgba(0,0,0,.8) !important; }
body.theme-light .di-input::placeholder { color:rgba(0,0,0,.3) !important; }
body.theme-light .di-send { background:rgba(0,0,0,.08) !important; border-color:rgba(0,0,0,.12) !important; color:rgba(0,0,0,.55) !important; }
body.theme-light .di-send:hover { background:rgba(0,0,0,.14) !important; color:rgba(0,0,0,.8) !important; }
body.theme-light .di-close-chat { background:rgba(0,0,0,.07) !important; border-color:rgba(0,0,0,.12) !important; color:rgba(0,0,0,.45) !important; }
body.theme-light .di-close-chat:hover { background:rgba(0,0,0,.12) !important; color:rgba(0,0,0,.8) !important; }

/* ── Сердечко — контур в светлой теме ── */
/* В тёмной теме stroke уже rgba(255,255,255,.2) — в светлой делаем видимым */
body.theme-light .reaction-heart svg { stroke:rgba(0,0,0,.25) !important; fill:none; }
body.theme-light .reaction-heart.active svg,
body.theme-light .reaction-heart[data-reaction="❤️"] svg { stroke:#e0055a !important; fill:#e0055a; }
body.theme-light .reaction-heart.love-flash svg { stroke:#e0055a !important; fill:#e0055a; }
body.theme-light #det-reaction-btn.love-flash svg { stroke:#e0055a !important; fill:#e0055a; }
body.theme-light .reaction-heart:hover svg { stroke:rgba(0,0,0,.5) !important; }
body.theme-light .heart-btn { opacity:.45 !important; }
body.theme-light .heart-btn svg { stroke:rgba(0,0,0,.55) !important; fill:none !important; }
body.theme-light .heart-btn.liked { opacity:1 !important; }
body.theme-light .det-heart-btn svg { stroke:rgba(0,0,0,.3); fill:none; }
body.theme-light .det-heart-btn:hover { background:rgba(0,0,0,.05) !important; }

/* Удалить в таблице */
body.theme-light .delete-btn { color:rgba(0,0,0,.2); }
body.theme-light .delete-btn:hover { color:rgba(200,40,40,.7); background:rgba(200,40,40,.07); }

/* Комментарии — кнопки edit/delete не инвертировать */
body.theme-light .det-comment-row button { filter:none !important; }
body.theme-light .det-comment-row button svg { filter:none !important; opacity:.6; }

/* Тег-фильтр */
body.theme-light .tag-filter-active { background:var(--tag-bg-hover); color:var(--text55); }


#landing{background:#0a0a0a;position:relative;overflow:hidden;align-items:center;justify-content:center;}
#landing::before{content:'';position:absolute;top:40%;left:50%;transform:translate(-50%,-50%);width:600px;height:350px;background:radial-gradient(ellipse,rgba(45,60,105,.12) 0%,transparent 70%);pointer-events:none;}
.landing-inner{display:flex;flex-direction:column;align-items:center;position:relative;z-index:1;width:100%;padding:0 24px;}
.landing-logo-text{font-size:15px;font-weight:600;letter-spacing:.35em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:52px;text-align:center;}
.landing-btns{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin-bottom:80px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.08);border-radius:100px;padding:4px;}
.land-btn{padding:10px 26px;border-radius:100px;font-size:14px;font-weight:500;font-family:inherit;cursor:pointer;transition:all .2s;border:none;}
.land-btn.ghost{background:transparent;color:rgba(255,255,255,.5);}
.land-btn.ghost:hover{color:#fff;}
.land-btn.solid{background:rgba(255,255,255,.12);color:rgba(255,255,255,.88);border:1px solid rgba(255,255,255,.12);}
.land-btn.solid:hover{background:rgba(255,255,255,.18);color:#fff;}
.features{width:100%;position:relative;z-index:1;padding:0 32px 80px;max-width:960px;margin:0 auto;}
.features-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;}
.feature-cell{background:#111;border:1px solid rgba(255,255,255,.07);border-radius:18px;padding:28px 24px;transition:background .2s;cursor:default;}
.feature-cell:hover{background:#151515;}
.feature-icon{font-size:26px;margin-bottom:16px;display:block;}
.feature-title{font-size:15px;font-weight:600;color:rgba(255,255,255,.88);margin-bottom:8px;line-height:1.3;}
.feature-desc{font-size:13px;color:rgba(255,255,255,.32);line-height:1.6;}

/* Пока ждём /api/me при наличии токена — не мигать лендингом с «Войти» */
html.vs-session-pending #landing.page{visibility:hidden!important;pointer-events:none!important;}

.di-wrap{position:fixed;top:10px;left:50%;transform:translateX(-50%);z-index:500;pointer-events:none;display:flex;flex-direction:column;align-items:center;}
.di-pill{background:#111;border:1px solid rgba(255,255,255,.1);border-radius:100px;display:flex;align-items:center;justify-content:center;cursor:pointer;pointer-events:all;overflow:hidden;transition:width .38s cubic-bezier(.4,0,.2,1),height .38s cubic-bezier(.4,0,.2,1),border-radius .38s cubic-bezier(.4,0,.2,1),padding .38s cubic-bezier(.4,0,.2,1);}
.di-pill.s-hidden{opacity:0;pointer-events:none;width:36px;height:36px;}
.di-pill.s-idle{width:148px;height:34px;gap:8px;padding:0 14px;}
.di-pill.s-reply{width:148px;height:34px;gap:8px;padding:0 14px;}
.di-pill.s-open{width:370px;border-radius:22px;padding:14px 16px;align-items:flex-start;flex-direction:column;gap:10px;height:auto;cursor:default;}
.di-idle-dot{width:7px;height:7px;border-radius:50%;background:#30d158;flex-shrink:0;box-shadow:0 0 6px #30d158;animation:di-pulse 1.8s ease-in-out infinite;}
.di-pill.s-reply .di-idle-dot{background:#ff6b9d;box-shadow:0 0 6px #ff6b9d;animation:di-pulse-pink 1.8s ease-in-out infinite;}
@keyframes di-pulse-pink{0%,100%{opacity:1;}50%{opacity:0.5;}}
@keyframes bell-ring{0%{transform:rotate(0);}10%{transform:rotate(18deg);}20%{transform:rotate(-16deg);}30%{transform:rotate(14deg);}40%{transform:rotate(-10deg);}50%{transform:rotate(6deg);}60%{transform:rotate(0);}}
@keyframes bell-flash{0%,100%{opacity:1;}50%{opacity:.4;}}
.bell-ringing{animation:bell-ring .6s ease-in-out, bell-flash .6s ease-in-out;transform-origin:top center;}
.notif-bell-wrap{position:relative;display:flex;align-items:center;justify-content:center;}
.di-idle-label{font-size:13px;font-weight:500;color:rgba(255,255,255,.5);white-space:nowrap;}
.di-chat{display:none;flex-direction:column;width:100%;gap:10px;}
.di-pill.s-open .di-chat{display:flex;}
.di-pill.s-open .di-idle-dot,.di-pill.s-open .di-idle-label{display:none;}
.di-chat-header{display:flex;align-items:center;gap:8px;}
.di-chat-hdot{width:6px;height:6px;border-radius:50%;background:rgba(255,255,255,.35);flex-shrink:0;}
.di-chat-title{font-size:13px;font-weight:600;color:rgba(255,255,255,.75);flex:1;}
.di-close-chat{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:50%;width:22px;height:22px;color:rgba(255,255,255,.45);cursor:pointer;font-size:11px;display:flex;align-items:center;justify-content:center;flex-shrink:0;transition:all .15s;}
.di-close-chat:hover{background:rgba(255,255,255,.15);color:#fff;}
.di-messages{max-height:160px;overflow-y:auto;display:flex;flex-direction:column;gap:6px;}
.di-msg{font-size:13px;line-height:1.5;padding:7px 10px;border-radius:10px;max-width:88%;}
.di-msg.ai{background:rgba(255,255,255,.07);color:rgba(255,255,255,.75);align-self:flex-start;}
.di-msg.user{background:rgba(255,255,255,.12);color:rgba(255,255,255,.88);align-self:flex-end;}
.di-input-row{display:flex;gap:8px;align-items:center;}
.di-input{flex:1;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:100px;padding:7px 14px;font-size:13px;color:#fff;font-family:inherit;outline:none;}
.di-input::placeholder{color:rgba(255,255,255,.22);}
.di-send{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.12);border-radius:50%;width:28px;height:28px;color:rgba(255,255,255,.7);cursor:pointer;font-size:14px;flex-shrink:0;transition:background .15s;}
.di-send:hover{background:rgba(255,255,255,.18);color:#fff;}

/* Выше fixed-колокола/аватара (300) и панели уведомлений (400), чтобы меню перекрывало интерфейс */
.menu-overlay{position:fixed;inset:0;background:rgba(0,0,0,0);z-index:450;pointer-events:none;visibility:hidden;transition:background .35s,visibility .35s;}
.menu-overlay.open{background:rgba(0,0,0,.6);pointer-events:all;visibility:visible;}
.header-account-menu{
  display:block;position:fixed;z-index:440;
  background:#18181b;border:0.5px solid rgba(255,255,255,.1);border-radius:18px;overflow:hidden;
  box-shadow:0 8px 40px rgba(0,0,0,.8);
  max-height:min(72vh,calc(100vh - 80px));overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  opacity:0;visibility:hidden;pointer-events:none;
  transform:translateY(-8px) scale(.97);transform-origin:top right;
  transition:opacity .3s ease,transform .3s ease,visibility 0s linear .3s;
}
.header-account-menu.open{
  opacity:1;visibility:visible;pointer-events:auto;
  transform:translateY(0) scale(1);
  transition:opacity .3s ease,transform .3s ease,visibility 0s;
}
.header-account-menu-profile{padding:14px 14px 10px;border-bottom:0.5px solid rgba(255,255,255,.07);}
.header-account-menu-profile-row{display:flex;align-items:center;gap:10px;}
.header-account-menu-av{
  width:38px;height:38px;border-radius:50%;background:#1a1a1e;display:flex;align-items:center;justify-content:center;
  font-size:18px;flex-shrink:0;border:1.5px solid rgba(255,255,255,.12);overflow:hidden;
}
.header-account-menu-name{font-size:13px;font-weight:500;line-height:1.2;color:#fff;}
.header-account-menu-handle{font-size:11px;color:rgba(255,255,255,.3);margin-top:1px;}
.header-account-menu-section{padding:6px;}
.header-account-menu-item{
  display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:11px;cursor:pointer;transition:background .1s;
  color:rgba(255,255,255,.7);
}
.header-account-menu-item:hover{background:rgba(255,255,255,.07);color:#fff;}
.header-account-menu-item svg{width:15px;height:15px;stroke:currentColor;fill:none;stroke-width:1.7;flex-shrink:0;opacity:.7;}
.header-account-menu-item:hover svg{opacity:1;}
.header-account-menu-item-emoji{width:15px;height:15px;display:flex;align-items:center;justify-content:center;font-size:13px;line-height:1;flex-shrink:0;opacity:.7;}
.header-account-menu-item:hover .header-account-menu-item-emoji{opacity:1;}
.header-account-menu-item-label{font-size:13px;flex:1;}
.header-account-menu-item-badge{font-size:10px;padding:2px 7px;border-radius:100px;background:rgba(32,101,212,.2);color:#85B7EB;font-weight:500;}
.header-account-menu-divider{height:0.5px;background:rgba(255,255,255,.07);margin:4px 6px;}
.header-account-menu-item--danger{color:rgba(226,75,74,.8);}
.header-account-menu-item--danger:hover{background:rgba(226,75,74,.08);color:#E24B4A;}
body.theme-light .header-account-menu{background:var(--surface2);border-color:var(--border2);box-shadow:0 8px 32px var(--shadow);}
body.theme-light .header-account-menu-profile{border-bottom-color:var(--border2);}
body.theme-light .header-account-menu-name{color:var(--text);}
body.theme-light .header-account-menu-handle{color:var(--text35);}
body.theme-light .header-account-menu-item{color:var(--text65);}
body.theme-light .header-account-menu-item:hover{background:var(--hover-bg);color:var(--text);}
body.theme-light .header-account-menu-divider{background:var(--border2);}
.list-header-burger.menu-avatar-trigger.open,
#desktop-burger-btn.menu-avatar-trigger.open{
  box-shadow:0 0 0 2px rgba(32,101,212,.55),var(--profile-avatar-glow);
}
.slide-menu{position:fixed;top:0;right:0;width:290px;height:100vh;background:#0c0c0c;border-left:1px solid rgba(255,255,255,.07);z-index:451;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;overflow-y:auto;}
.slide-menu.open{transform:translateX(0);}
.menu-close{
  position:absolute;
  top:calc(env(safe-area-inset-top, 0px) + 20px);
  right:max(16px, env(safe-area-inset-right, 0px));
  background:rgba(255,255,255,.07);
  border:none;
  border-radius:50%;
  width:36px;
  height:36px;
  min-width:36px;
  min-height:36px;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
  color:rgba(255,255,255,.45);
  transition:background .2s,color .2s,transform .2s;
  -webkit-tap-highlight-color:transparent;
  z-index:2;
}
.menu-close:hover{background:rgba(255,255,255,.1);color:#fff;}
/* Под крестиком: safe-area + отступ от статус-бара + высота кнопки + зазор */
.menu-profile{padding:calc(env(safe-area-inset-top, 0px) + 60px) 20px 20px;border-bottom:1px solid rgba(255,255,255,.06);}
.menu-profile-reward-badges{display:none;flex-wrap:wrap;gap:5px;align-items:center;justify-content:flex-start;margin:2px 0 10px;max-width:100%;}
.profile-avatar-btn{width:56px;height:56px;border-radius:50%;background:var(--menu-avatar-ring-bg);border:none;display:flex;align-items:center;justify-content:center;margin-bottom:12px;cursor:default;box-shadow:var(--profile-avatar-glow);}

.profile-name{font-size:15px;font-weight:600;color:#fff;margin-bottom:2px;}
.profile-sub{font-size:12px;color:rgba(255,255,255,.28);}
.profile-action-tile{
  background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:14px;overflow:hidden;
}
.menu-row.menu-row--profile-tile{
  margin:0;width:100%;box-sizing:border-box;border-radius:0;
}
.profile-avatar-row-chev{
  flex-shrink:0;margin-left:4px;opacity:.4;color:rgba(255,255,255,.5);transition:transform .22s cubic-bezier(.4,0,.2,1);
}
.profile-action-tile--picker-open .profile-avatar-row-chev{transform:rotate(180deg);}
.profile-avatar-picker-grid{
  padding:0 14px 14px;border-top:1px solid rgba(255,255,255,.07);
}
.avatar-picker-overlay{
  display:none;position:fixed;inset:0;z-index:920;box-sizing:border-box;
  background:rgba(0,0,0,.5);backdrop-filter:blur(8px);
  -webkit-overflow-scrolling:touch;
}
.avatar-picker-overlay.open{display:block;}
/* Панель: fixed рядом с аватаром (JS); .avatar-picker-pop-in — плавное появление */
.avatar-picker-overlay .avatar-picker-modal{
  opacity:0;
  transform:translateY(12px) scale(0.94);
  transform-origin:50% 0;
  transition:opacity .22s ease,transform .28s cubic-bezier(0.34,1.15,0.64,1);
  will-change:opacity,transform;
}
.avatar-picker-overlay.open.avatar-picker-pop-in .avatar-picker-modal{
  opacity:1;
  transform:translateY(0) scale(1);
}
.avatar-picker-modal{
  position:fixed;left:0;top:0;width:min(340px,calc(100vw - 24px));max-width:340px;max-height:min(72vh,calc(100dvh - 24px));
  overflow-y:auto;margin:0;
  background:#141416;border:1px solid rgba(255,255,255,.1);border-radius:20px;
  padding:20px 18px 18px;box-shadow:0 16px 48px rgba(0,0,0,.55);
  -webkit-overflow-scrolling:touch;
}
.avatar-picker-modal-close{
  position:absolute;top:12px;right:12px;width:32px;height:32px;border:none;border-radius:50%;
  background:rgba(255,255,255,.08);color:rgba(255,255,255,.55);font-size:20px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;font-family:inherit;
}
.avatar-picker-modal-close:hover{background:rgba(255,255,255,.12);color:#fff;}
.avatar-picker-modal-title{font-size:16px;font-weight:600;color:#fff;margin:0 36px 14px 0;}
.avatar-picker-grid--modal{border-top:none;padding:0;}
body.theme-light .avatar-picker-modal{background:var(--surface2);border-color:var(--border2);box-shadow:0 16px 48px var(--shadow);}
body.theme-light .avatar-picker-modal-title{color:var(--text);}
body.theme-light .avatar-picker-modal-close{background:var(--tag-bg);color:var(--text45);}
body.theme-light .avatar-picker-modal-close:hover{background:var(--tag-bg-hover);color:var(--text);}
.profile-stats{display:grid;grid-template-columns:1fr 1fr;gap:7px;margin-top:14px;}
.p-stat{background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:10px;padding:10px 12px;}
.p-stat-num{font-size:17px;font-weight:700;color:#fff;}
.p-stat-lbl{font-size:10px;color:rgba(255,255,255,.25);margin-top:2px;text-transform:uppercase;letter-spacing:.5px;line-height:1.4;}
.p-stat.wide{grid-column:1/-1;display:flex;justify-content:space-between;align-items:center;}
.p-stat.wide .p-stat-inner{display:flex;flex-direction:column;}
.profile-collection-tile{
  grid-column:1/-1;
  display:flex;
  align-items:center;
  gap:10px;
  padding:10px 12px;
  margin:0;
  background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  border-radius:10px;
  cursor:pointer;
  transition:background .15s;
  box-sizing:border-box;
}
.profile-collection-tile:hover{background:rgba(255,255,255,.07);}
.profile-collection-tile:focus-visible{outline:2px solid rgba(55,138,221,.5);outline-offset:2px;}
.profile-collection-tile-icon{
  width:28px;height:28px;border-radius:7px;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.profile-collection-tile-icon svg{opacity:.5;}
.profile-collection-tile-label{font-size:14px;font-weight:500;color:rgba(255,255,255,.62);}
body.theme-light .profile-collection-tile{background:var(--tag-bg);border-color:var(--border);}
body.theme-light .profile-collection-tile:hover{background:var(--hover-bg);}
body.theme-light .profile-collection-tile-icon{background:var(--tag-bg);border-color:var(--border);}
body.theme-light .profile-collection-tile-label{color:var(--text65);}
.profile-edit-input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(--border-radius-icons);padding:9px 12px;font-size:13px;color:#fff;font-family:inherit;outline:none;}
.profile-edit-input::placeholder{color:rgba(255,255,255,.2);}
.profile-edit-save{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:var(--border-radius-icons);padding:9px;font-size:13px;font-weight:500;color:rgba(255,255,255,.7);font-family:inherit;cursor:pointer;transition:all .2s;}
.profile-edit-save:hover{background:rgba(255,255,255,.12);color:#fff;}
.download-btns{display:flex;flex-direction:column;gap:6px;margin-top:2px;}
.download-btn{background:transparent;border:1px solid rgba(255,255,255,.07);border-radius:var(--border-radius-icons);padding:8px 12px;font-size:12px;color:rgba(255,255,255,.35);font-family:inherit;cursor:pointer;text-align:left;transition:all .2s;}
.download-btn:hover{border-color:rgba(255,255,255,.14);color:rgba(255,255,255,.65);}
.menu-section-title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:1px;color:rgba(255,255,255,.18);padding:16px 20px 8px;}
.menu-row{display:flex;align-items:center;gap:12px;padding:12px 20px;transition:background .15s;}
.menu-row.clickable{cursor:pointer;}
.menu-row.clickable:hover{background:rgba(255,255,255,.04);}
.menu-row-icon{width:28px;height:28px;border-radius:7px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.07);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.menu-row-icon svg{opacity:.5;}
.menu-row-label{flex:1;font-size:14px;font-weight:500;color:rgba(255,255,255,.62);}
.menu-friends-badges-wrap{
  display:flex;align-items:center;gap:5px;flex-shrink:0;margin-left:auto;
}
.menu-row-badge--friends{
  flex-shrink:0;font-size:12px;font-weight:600;line-height:1;
  color:#85B7EB;background:rgba(32,101,212,.18);border:0.5px solid rgba(32,101,212,.35);
  padding:3px 9px;border-radius:100px;min-width:1.5em;text-align:center;
}
.menu-row-badge--fr-req{
  flex-shrink:0;font-size:15px;font-weight:700;line-height:1;
  color:#F5C563;background:rgba(239,159,39,.14);border:0.5px solid rgba(239,159,39,.4);
  padding:3px 8px;border-radius:100px;min-width:26px;text-align:center;
}
body.theme-light .menu-row-badge--friends{
  color:var(--link,#2065d4);background:rgba(32,101,212,.1);border-color:rgba(32,101,212,.22);
}
body.theme-light .menu-row-badge--fr-req{
  color:#b87a0a;background:rgba(239,159,39,.12);border-color:rgba(239,159,39,.28);
}
.toggle{position:relative;width:44px;height:26px;flex-shrink:0;}
.toggle input{opacity:0;width:0;height:0;position:absolute;}
.toggle-track{position:absolute;inset:0;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.1);border-radius:100px;transition:background .2s;cursor:pointer;}
.toggle input:checked + .toggle-track{background:rgba(255,255,255,.82);border-color:rgba(255,255,255,.4);}
.toggle-track::after{content:'';position:absolute;top:3px;left:3px;width:18px;height:18px;border-radius:50%;background:#fff;transition:transform .2s;box-shadow:0 1px 4px rgba(0,0,0,.5);}
.toggle input:checked + .toggle-track::after{background:#111;transform:translateX(18px);}
.lang-opts{display:flex;gap:6px;margin:0 20px 4px;}
.lang-btn{flex:1;padding:8px;border-radius:var(--border-radius-icons);border:1px solid rgba(255,255,255,.08);background:transparent;color:rgba(255,255,255,.35);font-size:13px;font-family:inherit;cursor:pointer;transition:all .2s;}
.lang-btn.active{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);color:rgba(255,255,255,.85);}
.menu-divider{height:1px;background:rgba(255,255,255,.05);margin:6px 20px;}
.security-header{display:flex;align-items:center;gap:12px;padding:12px 20px;cursor:pointer;transition:background .15s;user-select:none;}
.security-header:hover{background:rgba(255,255,255,.04);}
.security-chevron{margin-left:auto;color:rgba(255,255,255,.25);transition:transform .25s cubic-bezier(.4,0,.2,1);flex-shrink:0;}
.security-header.open .security-chevron{transform:rotate(180deg);}
.security-body{display:none;flex-direction:column;gap:10px;padding:4px 20px 16px;border-bottom:1px solid rgba(255,255,255,.05);}
.security-body.open{display:flex;}
.security-input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 13px;font-size:13px;color:#fff;font-family:inherit;outline:none;transition:border-color .2s;width:100%;}
.security-input:focus{border-color:rgba(255,255,255,.2);}
.security-input::placeholder{color:rgba(255,255,255,.2);}
.security-save{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.1);border-radius:var(--border-radius-icons);padding:9px;font-size:13px;font-weight:500;color:rgba(255,255,255,.65);font-family:inherit;cursor:pointer;transition:all .2s;width:100%;}
.security-save:hover{background:rgba(255,255,255,.13);color:#fff;}

#home{align-items:center;justify-content:center;background:var(--bac);position:relative;overflow:hidden;}
#home.home-fly-out-active{overflow:visible;}
#home::before{content:'';position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);width:600px;height:350px;background:radial-gradient(ellipse,rgba(45,60,105,.18) 0%,transparent 70%);pointer-events:none;}
/* 54px — визуальный зазор; + safe-area — в PWA (standalone) иначе табы/поиск заезжают под fixed-колокол */
.home-inner{display:flex;flex-direction:column;align-items:center;gap:14px;position:relative;z-index:1;width:100%;max-width:960px;padding:calc(54px + env(safe-area-inset-top, 0px)) 24px 0;box-sizing:border-box;transition:transform .5s cubic-bezier(.4,0,.2,1);}
/* Раньше .home-inner.searching сдвигал блок вверх на 80px — на десктопе логотип обрезался из-за #home { overflow: hidden }. Анимация появления сетки остаётся у .results-grid.visible */
.tabs{display:inline-flex;background:rgba(255,255,255,.08);border-radius:100px;padding:3px;border:1px solid rgba(255,255,255,.20);}
.tab{padding:6px 24px;border-radius:100px;font-size:14px;font-weight:500;cursor:pointer;color:rgba(255,255,255,.45);transition:all .22s;user-select:none;white-space:nowrap;}
.tab:hover{color:rgba(255,255,255,.75);background:rgba(255,255,255,.06);}
.search-wrap{position:relative;width:100%;}
.search-wrap::after{content:'';position:absolute;bottom:-12px;left:10%;right:10%;height:18px;background:radial-gradient(ellipse at center,rgba(180,190,230,.25) 0%,transparent 70%);filter:blur(0px);pointer-events:none;}
.search-autocomplete-stack{position:relative;width:100%;}
.home-search-pills{display:none;flex-wrap:wrap;align-items:center;justify-content:center;gap:8px;margin-top:10px;width:100%;}
.home-search-pill{
  appearance:none;-webkit-appearance:none;
  margin:0;padding:6px 14px;border-radius:999px;font:inherit;font-size:12px;font-weight:500;
  cursor:pointer;white-space:nowrap;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.55);
  transition:background .15s,border-color .15s,color .15s;
}
.home-search-pill:hover{background:rgba(255,255,255,.12);color:rgba(255,255,255,.78);}
.home-search-pill.active{background:rgba(255,255,255,.16);border-color:rgba(255,255,255,.28);color:#fff;}
.search-bar{display:flex;align-items:center;width:100%;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.20);border-radius:100px;padding:12px 16px;transition:border-color .2s;}
.search-bar:focus-within{border-color:rgba(255,255,255,.18);}
.search-icon{color:rgba(255,255,255,.28);margin-right:10px;flex-shrink:0;}
.search-input{flex:1;background:transparent;border:none;outline:none;color:#fff;font-size:15px;font-family:inherit;}
.search-input::placeholder{color:rgba(255,255,255,.25);}
.search-bar-row{display:flex;align-items:stretch;gap:10px;width:100%;}
.search-bar-row .search-bar{flex:1;min-width:0;}
.home-discover-globe{
  flex-shrink:0;display:flex;align-items:center;justify-content:center;
  width:48px;min-width:48px;border-radius:100px;
  background:rgba(30,30,34,.92);border:1px solid rgba(255,255,255,.12);
  color:rgba(255,255,255,.55);cursor:pointer;transition:background .2s,border-color .2s,color .2s,transform .15s;
  -webkit-appearance:none;appearance:none;padding:0;
}
.home-discover-globe:hover{color:rgba(255,255,255,.85);background:rgba(38,38,44,.95);border-color:rgba(255,255,255,.2);}
.home-discover-globe.home-discover-globe--open{
  color:#85B7EB;border-color:rgba(32,101,212,.78);border-width:1.5px;
  background:rgba(32,101,212,.18);
}
.home-discover-panel{
  width:100%;overflow:hidden;max-height:0;opacity:0;
  transition:max-height .4s cubic-bezier(.4,0,.2,1),opacity .28s ease,margin .28s ease;
  margin-top:0;
}
.home-discover-panel.home-discover-panel--open{max-height:min(48vh,320px);opacity:1;margin-top:10px;}
/* Без отдельного «карточного» фона: только ряд капсул на чёрном (как на референсе) */
.home-discover-panel-inner{
  padding:4px 0 0;
  background:transparent;border:none;border-radius:0;
  box-shadow:none;
  backdrop-filter:none;
}
/* Ряд капсул как в референсе (глобальный_filter_working.html) */
.home-discover-pills-row{
  display:flex;width:100%;max-width:100%;margin:0 auto;
  justify-content:center;align-items:center;
  overflow-x:auto;overflow-y:hidden;-webkit-overflow-scrolling:touch;
  padding:4px 8px;scrollbar-width:none;
}
.home-discover-pills-row::-webkit-scrollbar{display:none;}
.home-discover-capsule-row{
  display:flex;flex-wrap:nowrap;align-items:center;justify-content:center;gap:7px;min-width:min-content;margin:0 auto;
}
.home-discover-capsule{
  display:inline-flex;align-items:center;gap:5px;
  margin:0;padding:7px 14px;border-radius:100px;
  font:inherit;font-size:13px;font-weight:500;white-space:nowrap;
  cursor:pointer;flex-shrink:0;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.12);color:rgba(255,255,255,.45);
  transition:background .18s,border-color .18s,color .18s;
  -webkit-appearance:none;appearance:none;
}
.home-discover-capsule:hover{border-color:rgba(255,255,255,.22);color:rgba(255,255,255,.78);}
.home-discover-capsule.active{
  background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.82);
}
.home-discover-capsule-dot{
  width:5px;height:5px;border-radius:50%;background:#2065d4;display:none;margin-right:0;
  flex-shrink:0;
}
.home-discover-capsule.has-val .home-discover-capsule-dot{display:block;}
.home-discover-capsule-txt{line-height:1.2;}
.home-discover-capsule-arr{
  width:11px;height:11px;stroke:currentColor;fill:none;stroke-width:2.2;stroke-linecap:round;
  flex-shrink:0;transition:transform .2s;
}
.home-discover-capsule.active .home-discover-capsule-arr{transform:rotate(180deg);}
.home-discover-capsule:disabled{
  opacity:0.38;cursor:not-allowed;
}
.home-discover-show-wrap{
  width:100%;max-width:100%;margin:12px auto 0;overflow:hidden;
  display:flex;justify-content:center;align-items:center;
  max-height:0;opacity:0;transition:max-height .3s ease,opacity .25s ease,margin .25s ease;
}
.home-discover-panel.home-discover-panel--open .home-discover-show-wrap.home-discover-show-wrap--visible{
  max-height:48px;opacity:1;
}
.home-discover-show-btn{
  width:auto;min-width:0;padding:7px 22px;border-radius:999px;border:none;
  font:inherit;font-size:12px;font-weight:600;letter-spacing:.02em;cursor:pointer;
  background:#2065d4;color:#fff;
  transition:background .15s,filter .15s;
}
.home-discover-show-btn:hover{background:#2a75e8;}
.home-discover-hidden-inputs{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0,0,0,0);}
/* Fixed-дропы вне overflow панели */
.home-discover-overlays{position:fixed;inset:0;pointer-events:none;z-index:10050;}
.home-discover-fdrop{
  position:fixed;pointer-events:auto !important;
  display:none;
  background:rgba(18,18,20,.98);
  border:0.5px solid rgba(255,255,255,.13);
  border-radius:18px;padding:14px;
  z-index:10051;min-width:210px;
  box-shadow:0 8px 32px rgba(0,0,0,.6);
}
.home-discover-fdrop.home-discover-fdrop--open{display:block;}
.home-discover-fdrop--wide{min-width:240px;}
.home-discover-fdrop--range{min-width:230px;}
.home-discover-fdrop-title{
  font-size:10px;font-weight:500;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;
}
.home-discover-flist{
  max-height:200px;overflow-y:auto;display:flex;flex-direction:column;gap:1px;
  scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.1) transparent;
}
.home-discover-flist::-webkit-scrollbar{width:3px;}
.home-discover-flist::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:2px;}
.home-discover-fitem{
  padding:9px 10px;border-radius:10px;font-size:13px;color:rgba(255,255,255,.55);cursor:pointer;
  display:flex;align-items:center;justify-content:space-between;transition:background .1s,color .1s;
}
.home-discover-fitem:hover{background:rgba(255,255,255,.08);color:#fff;}
.home-discover-fitem.on{color:#85B7EB;}
.home-discover-fitem.on::after{
  content:'';width:6px;height:6px;border-radius:50%;background:#2065d4;flex-shrink:0;
}
.home-discover-range-row{display:flex;gap:10px;align-items:flex-start;}
.home-discover-range-col{flex:1;display:flex;flex-direction:column;gap:6px;}
.home-discover-range-lbl{font-size:10px;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.06em;text-align:center;}
.home-discover-range-val{
  background:rgba(255,255,255,.07);border:0.5px solid rgba(255,255,255,.13);border-radius:10px;
  padding:9px;font-size:16px;font-weight:500;color:#fff;text-align:center;cursor:pointer;transition:all .15s;
}
.home-discover-range-val:hover,.home-discover-range-val.home-discover-range-val--sel{
  background:rgba(32,101,212,.2);border-color:rgba(32,101,212,.5);color:#85B7EB;
}
.home-discover-range-sep{font-size:14px;color:rgba(255,255,255,.2);align-self:center;padding-top:18px;}
.home-discover-reset-link{
  display:block;width:100%;margin-top:10px;padding:0;border:none;background:none;
  font:inherit;font-size:12px;color:rgba(255,255,255,.35);cursor:pointer;text-align:center;text-decoration:underline;
}
.home-discover-reset-link:hover{color:rgba(255,255,255,.75);}
.home-discover-num-popup{
  position:fixed;display:none;pointer-events:auto !important;
  background:rgba(18,18,20,.98);
  border:0.5px solid rgba(255,255,255,.13);
  border-radius:12px;z-index:10052;
  width:110px;
  box-shadow:0 4px 20px rgba(0,0,0,.5);
}
.home-discover-num-popup.home-discover-num-popup--open{display:block;}
.home-discover-num-list{max-height:160px;overflow-y:auto;scrollbar-width:none;}
.home-discover-num-list::-webkit-scrollbar{display:none;}
.home-discover-nitem{
  padding:8px 12px;font-size:13px;color:rgba(255,255,255,.55);cursor:pointer;text-align:center;transition:all .1s;
}
.home-discover-nitem:hover{background:rgba(255,255,255,.08);color:#fff;}
.home-discover-nitem.on{color:#85B7EB;font-weight:500;background:rgba(32,101,212,.12);}
.home-discover-more-wrap{width:100%;display:flex;justify-content:center;padding:0 24px 16px;margin-top:4px;}
.home-discover-more-btn{
  min-width:160px;padding:10px 18px;border-radius:100px;
  font:inherit;font-size:14px;font-weight:600;cursor:pointer;
  background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.16);color:rgba(255,255,255,.75);
  transition:background .15s,border-color .15s,color .15s;
}
.home-discover-more-btn:hover{background:rgba(255,255,255,.12);color:#fff;}
body.theme-light .home-discover-panel-inner{background:transparent;border:none;}
body.theme-light .home-discover-capsule{background:var(--bg);border-color:var(--border2);color:var(--text45);}
body.theme-light .home-discover-capsule.active{background:rgba(32,101,212,.12);border-color:rgba(32,101,212,.4);color:#2065d4;}
body.theme-light .home-discover-show-btn{background:#2065d4;color:#fff;}
body.theme-light .home-discover-fdrop{background:var(--bg2);border-color:var(--border2);}
body.theme-light .home-discover-fitem.on{color:#2065d4;}
body.theme-light .home-discover-num-popup{background:var(--bg2);border-color:var(--border2);}
body.theme-light .home-discover-globe{
  background:var(--bg2);
  border-color:var(--border2);
  color:var(--text55);
  box-shadow:0 2px 8px var(--shadow);
}
body.theme-light .home-discover-globe:hover{
  color:var(--text);
  background:var(--tag-bg-hover);
  border-color:var(--border2);
}
body.theme-light .home-discover-globe.home-discover-globe--open{
  color:#2065d4;
  border-color:rgba(32,101,212,.78);
  border-width:1.5px;
  background:rgba(32,101,212,.12);
}
.burger-btn{background:none;border:none;cursor:pointer;padding:2px 4px;display:flex;flex-direction:column;gap:4px;justify-content:center;margin-left:10px;flex-shrink:0;min-width:26px;min-height:22px;box-sizing:content-box;}
.burger-btn.menu-avatar-trigger{gap:0;align-items:center;justify-content:center;padding:0;box-sizing:border-box;}
/* Кнопки меню: аватар копируется из профиля в боковом меню (JS: syncMenuAvatarFacesFromProfile) */
.menu-avatar-trigger{overflow:hidden;}
/* Тот же приём, что у .profile-avatar-btn: градиент на всём круге + свечение; лицо на весь круг (без «ободка» через padding) */
#desktop-burger-btn.menu-avatar-trigger,
.list-header-burger.menu-avatar-trigger,
.detail-header .list-header-burger.menu-avatar-trigger{
  box-sizing:border-box;
  padding:0;
  background:var(--menu-avatar-ring-bg);
  border:none!important;
  box-shadow:var(--profile-avatar-glow);
  transition:box-shadow .2s,transform .2s;
}
#desktop-burger-btn.menu-avatar-trigger:hover,
.list-header-burger.menu-avatar-trigger:hover,
.detail-header .list-header-burger.menu-avatar-trigger:hover{
  box-shadow:var(--profile-avatar-glow-hover);
  transform:scale(1.05);
}
.menu-avatar-face{
  width:100%;
  height:100%;
  min-width:0;
  min-height:0;
  border-radius:50%;
  display:flex;
  align-items:center;
  justify-content:center;
  box-sizing:border-box;
  line-height:1;
  background:transparent;
  pointer-events:none;
  user-select:none;
  -webkit-user-select:none;
}

/* Бургер в хедерах внутренних страниц — только мобилка */
.list-header-burger {
  display: none; /* скрыт на десктопе */
  margin-left: 0;
}

/* Колокольчик в хедерах внутренних страниц — только мобилка */
.list-header-bell {
  display: none; /* скрыт на десктопе */
  margin: 0;
}

/* ── BOTTOM NAV (mobile only) ── */
.bottom-nav {
  display: none; /* скрыт на десктопе */
}

/* Панель уведомлений с привязкой к левому колокольчику */
#notif-panel.notif-panel--from-left {
  right: auto;
  left: max(14px, env(safe-area-inset-left, 0px));
  transform-origin: 0% 0%;
}
#notif-panel.notif-panel--from-left:not(.notif-panel--shown):not(.notif-panel--open) {
  transform: translate3d(0, var(--np-ty), 0) scale(0.9);
}
#notif-bell-btn.notif-unread svg,.notif-bell-list-mobile.notif-unread svg{stroke:#ff375f !important;filter:drop-shadow(0 0 5px rgba(255,55,95,.5));}
#notif-bell-btn.notif-unread:hover svg{stroke:#ff8a9a !important;}
.notif-bell-list-mobile.notif-unread:hover svg{stroke:#ff8a9a !important;}
#notif-badge.notif-badge-active,.notif-badge-list-mobile.notif-badge-active{background:#e0055a !important;color:#fff !important;box-shadow:0 0 0 1px rgba(255,255,255,.2);}
/* Колокол в ряд со строкой поиска: узкая вертикальная «таблетка», высота = капсула поиска (только мобилка — видимость в @media) */
.notif-bell-list-mobile{
  display:none;
  box-sizing:border-box;
  position:relative;
  flex-shrink:0;
  align-items:center;
  justify-content:center;
  margin:0;
  padding:0;
  width:var(--list-header-icon);
  min-width:var(--list-header-icon);
  max-width:var(--list-header-icon);
  height:var(--list-header-icon);
  min-height:var(--list-header-icon);
  max-height:var(--list-header-icon);
  border:1px solid rgba(255,255,255,.06);
  border-radius:50%;
  cursor:pointer;
  background:rgba(255,255,255,.06);
  font:inherit;
  color:inherit;
  -webkit-appearance:none;
  appearance:none;
  transition:background .5s,border-color .5s;
}
.notif-bell-list-mobile:hover{
  background:rgba(255,255,255,.1);
  border-color:rgba(255,255,255,.1);
}
.notif-bell-list-mobile svg{display:block;width:26px;height:23px;}
.ac-dropdown{position:absolute;top:calc(100% + 8px);left:0;right:0;background:rgba(14,14,14,.98);border:1px solid rgba(255,255,255,.1);border-radius:16px;overflow:hidden;z-index:300;opacity:0;transform:translateY(-6px);transition:opacity .18s,transform .18s;pointer-events:none;backdrop-filter:blur(20px);}
.ac-dropdown.open{opacity:1;transform:translateY(0);pointer-events:all;}
.ac-item{display:flex;align-items:center;padding:11px 16px;cursor:pointer;transition:background .12s;border-bottom:1px solid rgba(255,255,255,.04);}
.ac-item:last-child{border-bottom:none;}
.ac-item:hover{background:rgba(255,255,255,.06);}
.ac-title{font-size:14px;font-weight:500;color:rgba(255,255,255,.85);}
.ac-meta{font-size:12px;color:rgba(255,255,255,.3);margin-top:2px;}
.ac-more-btn{
  display:block;width:100%;margin:0;padding:12px 16px;border:none;border-top:1px solid rgba(255,255,255,.08);
  background:transparent;font:inherit;font-size:13px;font-weight:600;color:rgba(255,255,255,.55);
  cursor:pointer;text-align:center;transition:background .12s,color .12s;
}
.ac-more-btn:hover{background:rgba(255,255,255,.06);color:rgba(255,255,255,.85);}
body.theme-light .ac-more-btn{border-top-color:var(--border2);color:var(--text45);}
body.theme-light .ac-more-btn:hover{background:var(--bg);color:var(--text);}
.results-grid{width:100%;display:grid;grid-template-columns:repeat(6,1fr);gap:10px;opacity:0;transform:translateY(16px);transition:opacity .4s,transform .45s;pointer-events:none;}
.results-grid.visible{opacity:1;transform:translateY(0);pointer-events:all;}
.poster-card{display:flex;flex-direction:column;cursor:pointer;transition:transform .2s;-webkit-user-select:none;user-select:none;-webkit-touch-callout:none;}
.poster-card:hover{transform:scale(1.03);}
@keyframes poster-card-fly-to-collection{
  0%{opacity:1;transform:translate3d(0,0,0) scale(1) rotate(0deg);filter:brightness(1);}
  55%{opacity:1;filter:brightness(1.06);}
  100%{opacity:0;transform:translate3d(min(28vw,160px),max(-240px,-28vh),0) scale(0.35) rotate(4deg);filter:brightness(1.08);}
}
.poster-card.poster-card--fly-to-collection{
  pointer-events:none;
  z-index:200;
  position:relative;
  transition:none !important;
  animation:poster-card-fly-to-collection .58s cubic-bezier(.34,.85,.45,1) forwards;
  will-change:transform,opacity;
}
@keyframes poster-card-fly-to-collection-reduced{
  to{opacity:0;transform:scale(.94);}
}
@media (prefers-reduced-motion:reduce){
  .poster-card.poster-card--fly-to-collection{
    animation:poster-card-fly-to-collection-reduced .22s ease-out forwards;
  }
}
.poster-img{width:100%;aspect-ratio:2/3;border-radius:18px;position:relative;overflow:hidden;border:none;background:linear-gradient(135deg,rgba(255,255,255,.4),rgba(255,255,255,.05),rgba(255,255,255,.3));padding:0.4px;}
.poster-bg{position:absolute;inset:0;}
.poster-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.9) 0%,rgba(0,0,0,.04) 55%,transparent 100%);pointer-events:none;}
.poster-rating{position:absolute;top:8px;right:8px;z-index:2;font-size:11px;font-weight:700;background:rgba(20,20,20,.8);color:#FFD60A;border:1px solid rgba(255,214,10,.2);border-radius:6px;padding:2px 7px;}
.poster-year-badge{position:absolute;bottom:42px;left:8px;z-index:2;font-size:11px;font-weight:500;background:rgba(0,0,0,.55);border:1px solid rgba(255,255,255,.1);border-radius:6px;padding:2px 8px;color:rgba(255,255,255,.65);}
.poster-title{display:none;}
.poster-below{display:none;}
.poster-below-genre{font-size:11px;color:rgba(255,255,255,.32);}
.poster-in-list{position:absolute;top:8px;left:8px;z-index:3;background:rgba(20,20,20,.85);border:1px solid rgba(255,214,10,.35);border-radius:6px;padding:2px 8px;font-size:10px;font-weight:600;color:#FFD60A;}
.home-poster-actions{position:absolute;bottom:7px;left:7px;right:7px;display:flex;gap:6px;z-index:6;pointer-events:auto;}
.home-poster-actions .home-poster-btn{pointer-events:auto;}
/* Как Трейлер / Позже (.det-sec-btn): прозрачная «таблетка», рамка, светлее при hover */
.home-poster-btn{
  box-sizing:border-box;width:36px;height:36px;min-width:36px;min-height:36px;padding:0;border-radius:10px;
  cursor:pointer;display:flex;align-items:center;justify-content:center;
  border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);
  backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px);
  transition:background .2s,border-color .2s,color .2s,opacity .2s;
}
.home-poster-btn:hover{
  background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.16);
}
.home-poster-btn:active{background:rgba(255,255,255,.08);}
.home-poster-btn:disabled{opacity:.65;cursor:default;}
.home-poster-btn svg{display:block;flex-shrink:0;}
.home-poster-btn--coll:not(.is-on){color:rgba(255,255,255,.65);}
.home-poster-btn--coll:not(.is-on):hover{color:#fff;}
.home-poster-btn--coll.is-on{color:#30d158;}
.home-poster-btn--coll.is-on:hover{color:#4ade80;border-color:rgba(48,209,88,.35);background:rgba(48,209,88,.1);}
.home-poster-btn--later:not(.is-on){color:rgba(255,255,255,.45);}
.home-poster-btn--later:not(.is-on):hover{color:rgba(255,255,255,.85);}
.home-poster-btn--later .home-poster-later-ico{display:block;}
.home-poster-btn--later .home-poster-later-ico path{fill:none;stroke:currentColor;}
.home-poster-btn--later.is-on{color:#0A84FF;}
.home-poster-btn--later.is-on .home-poster-later-ico path{fill:currentColor;}
.home-poster-btn--later.is-on:hover{color:#409CFF;background:rgba(10,132,255,.08);}
body.theme-light .home-poster-btn{
  border-color:var(--border2);background:var(--tag-bg);
}
body.theme-light .home-poster-btn:hover{background:var(--tag-bg-hover);border-color:var(--border);}
body.theme-light .home-poster-btn--coll:not(.is-on){color:var(--text55);}
body.theme-light .home-poster-btn--coll:not(.is-on):hover{color:var(--text);}
body.theme-light .home-poster-btn--coll.is-on{color:#28a745;}
body.theme-light .home-poster-btn--coll.is-on:hover{color:#22c55e;background:rgba(40,167,69,.1);border-color:rgba(40,167,69,.35);}
body.theme-light .home-poster-btn--later:not(.is-on){color:var(--text45);}
body.theme-light .home-poster-btn--later:not(.is-on):hover{color:var(--text65);}
body.theme-light .home-poster-btn--later.is-on{color:#007AFF;}
body.theme-light .home-poster-btn--later.is-on:hover{color:#0066D6;background:rgba(0,122,255,.08);}
body.theme-light .home-poster-btn--coll:not(.is-on){
  color:var(--text);
  border-color:rgba(0,0,0,.22);
  background:rgba(255,255,255,.92);
  box-shadow:0 1px 4px rgba(0,0,0,.1);
}
body.theme-light .home-poster-btn--coll:not(.is-on):hover{
  background:#fff;
  border-color:rgba(0,0,0,.32);
  color:var(--text);
}

/* Домашний логотип над вкладками */
.home-brand-wordmark{
  font-size:13px;font-weight:600;letter-spacing:.35em;text-transform:uppercase;
  color:rgba(255,255,255,.25);cursor:pointer;transition:color .2s;text-align:center;
}
.home-brand-wordmark:hover{color:rgba(255,255,255,.5);}
body.theme-light .home-brand-wordmark{color:var(--text35);}
body.theme-light .home-brand-wordmark:hover{color:var(--text65);}

/* Уведомления — панель; появление от колокольчика: transform от --np-tx/--np-ty (ставит JS) */
#notif-panel.notif-panel-root{
  --np-tx:0px;
  --np-ty:0px;
  position:fixed;top:52px;right:16px;width:300px;z-index:400;max-height:320px;overflow-y:auto;
  border-radius:14px;padding:14px;
  background:#111;border:1px solid rgba(255,255,255,.1);box-shadow:0 8px 32px rgba(0,0,0,.5);
  display:none;
  opacity:0;
  transform:translate3d(var(--np-tx),var(--np-ty),0) scale(0.9);
  transform-origin:100% 0;
  pointer-events:none;
  transition:opacity .5s ease,transform .5s cubic-bezier(0.22,1,0.36,1);
  will-change:transform,opacity;
}
#notif-panel.notif-panel-root.notif-panel--shown{
  display:block;
}
#notif-panel.notif-panel-root.notif-panel--shown:not(.notif-panel--open){
  opacity:0;
  transform:translate3d(var(--np-tx),var(--np-ty),0) scale(0.9);
  pointer-events:none;
}
#notif-panel.notif-panel-root.notif-panel--shown.notif-panel--open{
  opacity:1;
  transform:translate3d(0,0,0) scale(1);
  pointer-events:auto;
}
.notif-panel-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:10px;}
.notif-panel-title{font-size:13px;font-weight:500;color:rgba(255,255,255,.6);}
.notif-panel-btn-cal{
  background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:7px;
  font-size:11px;color:rgba(255,255,255,.5);cursor:pointer;font-family:inherit;padding:4px 10px;
}
.notif-panel-btn-readall{background:none;border:none;font-size:11px;color:rgba(255,255,255,.3);cursor:pointer;font-family:inherit;}
.notif-list-inner{display:flex;flex-direction:column;gap:8px;}
.notif-empty{font-size:13px;color:rgba(255,255,255,.25);text-align:center;padding:16px 0;}
.notif-row{position:relative;padding:8px 30px 8px 10px;border-radius:var(--border-radius-icons);border:1px solid transparent;background:transparent;}
.notif-row--friend{
  display:flex;align-items:center;gap:10px;padding:8px 10px;
}
.notif-row-friend-body{flex:1;min-width:0;}
.notif-row-friend-actions{
  display:flex;flex-direction:column;gap:6px;flex-shrink:0;
}
.notif-friend-btn{
  width:32px;height:32px;border-radius:50%;padding:0;margin:0;
  display:flex;align-items:center;justify-content:center;
  font-size:20px;font-weight:600;line-height:1;cursor:pointer;font-family:inherit;
  transition:background .12s,transform .1s,color .12s,border-color .12s;
}
.notif-friend-btn:active{transform:scale(.94);}
.notif-friend-btn--accept{
  border:0.5px solid rgba(29,158,117,.45);
  background:rgba(29,158,117,.15);color:#5DCAA5;
}
.notif-friend-btn--accept:hover{background:rgba(29,158,117,.25);color:#7dffc8;}
.notif-friend-btn--decline{
  border:0.5px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);color:rgba(255,255,255,.55);
  font-size:22px;font-weight:500;
}
.notif-friend-btn--decline:hover{background:rgba(255,255,255,.1);color:rgba(255,255,255,.85);}
body.theme-light .notif-friend-btn--accept{
  border-color:rgba(29,158,117,.35);background:rgba(29,158,117,.1);color:#1a7a5c;
}
body.theme-light .notif-friend-btn--decline{
  border-color:var(--border2);background:var(--tag-bg);color:var(--text45);
}
.notif-row--unread{background:rgba(255,255,255,.04);border-color:rgba(255,255,255,.07);}
.notif-row-click{cursor:pointer;transition:background .12s;}
.notif-row-click:hover{background:rgba(255,255,255,.06);}
.notif-row-dismiss{position:absolute;top:4px;right:4px;width:26px;height:26px;padding:0;border:none;border-radius:6px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.45);font-size:18px;line-height:1;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .12s,color .12s;}
.notif-row-dismiss:hover{background:rgba(255,255,255,.14);color:rgba(255,255,255,.85);}
.notif-row-msg{font-size:13px;padding-right:2px;}
.notif-row-msg--read{color:rgba(255,255,255,.5);}
.notif-row-msg--unread{color:rgba(255,255,255,.8);}
.notif-row-meta{font-size:11px;color:rgba(255,255,255,.28);margin-top:3px;}

/* Календарь — модалка дня */
.cal-day-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:800;
  align-items:center;justify-content:center;backdrop-filter:blur(8px);
}
.cal-day-modal{
  background:#111;border:1px solid rgba(255,255,255,.1);border-radius:20px;width:100%;max-width:480px;
  padding:24px;margin:20px;max-height:80vh;overflow-y:auto;
}
.cal-day-modal-head{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px;}
.cal-day-modal-title{font-size:16px;font-weight:600;color:#fff;}
.cal-day-modal-close{
  background:rgba(255,255,255,.07);border:none;border-radius:var(--border-radius-icons);width:28px;height:28px;
  color:rgba(255,255,255,.5);cursor:pointer;font-size:14px;line-height:1;
}
.cal-day-empty{text-align:center;padding:20px;font-size:14px;color:rgba(255,255,255,.25);}
.cal-day-row{display:flex;align-items:center;gap:12px;padding:10px 0;border-bottom:1px solid rgba(255,255,255,.05);}
.cal-day-row:last-child{border-bottom:none;}
.cal-day-row-poster{width:44px;height:62px;object-fit:cover;border-radius:6px;flex-shrink:0;}
.cal-day-row-poster-ph{width:44px;height:62px;background:#1a1a1a;border-radius:6px;flex-shrink:0;}
.cal-day-row-body{flex:1;min-width:0;}
.cal-day-row-title{font-size:16px;font-weight:600;color:#fff;margin-bottom:5px;display:flex;align-items:center;gap:6px;line-height:1.3;}
.cal-day-row-sub{font-size:13px;font-weight:500;color:rgba(255,255,255,.45);line-height:1.4;}
.cal-day-row-click{cursor:pointer;}
.cal-day-row-click:hover{background:rgba(255,255,255,.03);}
body.theme-light .cal-day-row-click:hover{background:var(--tag-bg);}

#movies-page,#series-page,#watchlist-page,#calendar-page,#statistics-page{background:var(--bac);}
/* Высота вьюпорта только у списков; без overflow:hidden — иначе Safari режет touch к внутреннему скроллу */
#movies-page.page.active,
#series-page.page.active,
#watchlist-page.page.active{
  box-sizing:border-box;
  height:100vh;
  max-height:100vh;
  height:100dvh;
  max-height:100dvh;
  min-height:0;
  overflow:hidden;
}
.list-header{
  position:sticky;top:0;z-index:100;
  flex-shrink:0;
  background:var(--bac);backdrop-filter:blur(28px);
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:0 28px;height:var(--list-header-h);
  box-sizing:border-box;
  display:flex;align-items:center;gap:14px;
}
.list-header .list-header-tabs{position:absolute;left:50%;transform:translateX(-50%);}
.detail-header .list-header-tabs{position:absolute;left:50%;transform:translateX(-50%);}
.back-btn{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.15);border-radius:50%;width:var(--list-header-icon);height:var(--list-header-icon);min-width:var(--list-header-icon);min-height:var(--list-header-icon);display:flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,.6);transform:scale(1);transition:background .2s,border-color .2s,color .15s,box-shadow .2s,transform .2s;flex-shrink:0;}
.back-btn:hover{background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.4);box-shadow:0 0 18px rgba(255,255,255,.12);transform:scale(1.05);}
.back-btn svg{width:17px;height:17px;display:block;}
.list-logo{font-size:13px;font-weight:700;letter-spacing:.25em;text-transform:uppercase;color:rgba(255,255,255,.25);cursor:pointer;transition:color .2s;user-select:none;margin-right:4px;}
.list-logo:hover{color:rgba(255,255,255,.6);}
.list-header-tabs{display:inline-flex;background:rgba(255,255,255,.12);border-radius:100px;padding:4px;border:1px solid rgba(255,255,255,.06);align-items:center;}
.list-header-tab{padding:7px 20px;border-radius:100px;font-size:14px;font-weight:500;cursor:pointer;color:rgba(255,255,255,.35);transition:all .2s;}
.list-header-tab.active{background:rgba(255,255,255,.11);color:#fff;}
.list-header-tab:not(.active):hover{color:rgba(255,255,255,.65);}
.list-header-tab.calendar-tab{color:rgba(255,214,10,.58);}
.list-header-tab.calendar-tab.active{background:rgba(255,214,10,.1);color:#FFD60A;}
/* Фикс. блок справа: аватар → статистика → колокол (row-reverse: справа налево) */
.vs-desktop-top-actions{
  position:fixed;top:7px;right:16px;z-index:300;
  display:none;flex-direction:row-reverse;align-items:center;gap:10px;
  pointer-events:none;
}
.vs-desktop-top-actions > *{pointer-events:auto;}
/* Глобальный колокол — круг как у сегментов в шапке */
#notif-bell-btn{
  box-sizing:border-box;width:var(--list-header-icon);height:var(--list-header-icon);padding:0;
  display:none;align-items:center;justify-content:center;flex-shrink:0;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);
  border-radius:50%;cursor:pointer;
  color:rgba(255,255,255,.45);
  transform:scale(1);
  transition:background .2s,border-color .2s,color .15s,box-shadow .2s,transform .2s;
  position:relative;
}
#notif-bell-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.4);color:#fff;box-shadow:0 0 18px rgba(255,255,255,.12);transform:scale(1.05);}
#notif-bell-btn svg{width:24px;height:24px;display:block;stroke:currentColor;}
#notif-bell-btn #notif-badge{top:6px!important;right:6px!important;}
/* Круг «Статистика» слева от аватара (как колокол) */
.vs-desktop-stats-btn{
  appearance:none;-webkit-appearance:none;margin:0;
  box-sizing:border-box;width:var(--list-header-icon);height:var(--list-header-icon);padding:0;
  display:none;align-items:center;justify-content:center;flex-shrink:0;
  background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.15);
  border-radius:50%;cursor:pointer;color:rgba(255,255,255,.40);
  transform:scale(1);
  transition:background .2s,border-color .2s,color .15s,box-shadow .2s,transform .2s;
}
.vs-desktop-stats-btn:hover{
  background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.4);color:#fff;
  box-shadow:0 0 18px rgba(255,255,255,.12);
  transform:scale(1.05);
}
.vs-desktop-stats-btn svg{display:block;}
.vs-icon-stats-hybrid{flex-shrink:0;}
/* Бургер на десктопе — круг справа в группе */
#desktop-burger-btn.menu-avatar-trigger{
  box-sizing:border-box;width:var(--list-header-icon);height:var(--list-header-icon);
  display:none;flex-direction:column;align-items:center;justify-content:center;gap:0;
  border-radius:50%;cursor:pointer;
  overflow:hidden;
}
.table-container{padding:20px 30px 60px;width:100%;max-width:100%;min-width:0;box-sizing:border-box;overflow-x:auto;}
/* Вертикальный скролл строк — в #*-table-body-scroll; шапка таблицы вне скролла. Поиск в list-toolbar-host. */
#movies-page .table-container,
#series-page .table-container,
#watchlist-page .table-container{
  flex:1 1 0;
  min-height:0;
  overflow-x:hidden;
  overflow-y:hidden;
  display:flex;
  flex-direction:column;
  align-items:stretch;
  top: 79px;
  position: relative;
  z-index:0;
}
.list-toolbar-host{
  flex-shrink:0;
  min-width:0;
  position: fixed;
  left:0;
  right:0;
  width:100%;
  max-width:100%;
  box-sizing:border-box;
  top: 84px;
  padding: 0 28px;
  z-index:110;
  background:var(--bac);
  backdrop-filter:blur(28px);
  -webkit-backdrop-filter:blur(28px);
  border-bottom:1px solid rgba(255,255,255,.06);
  display:flex;
  flex-direction:column;
  align-items:stretch;
}
/* Фильтр (актёр, жанр, тег): под строкой поиска, внутри фикс. host — не под ней в потоке */
.filter-bar{
  display:flex;
  align-items:center;
  gap:10px;
  flex-shrink:0;
  width:100%;
  min-width:0;
  box-sizing:border-box;
  padding:0 0 12px 0;
  margin:0;
  border-top:1px solid rgba(255,255,255,.06);
  font-size:13px;
  color:rgba(255,255,255,.5);
}
.filter-bar-lbl{flex-shrink:0;}
.filter-bar-clear{
  background:rgba(255,255,255,.07);
  border:1px solid rgba(255,255,255,.15);
  border-radius:8px;
  padding:4px 12px;
  font-size:12px;
  color:rgba(255,255,255,.75);
  cursor:pointer;
  font-family:inherit;
  max-width:100%;
  text-align:left;
}
.filter-bar-clear:hover{background:rgba(255,255,255,.1);color:#fff;}
body.theme-light .filter-bar{
  border-top-color:var(--border);
  color:var(--text45);
}
body.theme-light .filter-bar-clear{
  background:var(--bg2);
  border-color:var(--border2);
  color:var(--text65);
}
body.theme-light .filter-bar-clear:hover{color:var(--text);}
.list-toolbar-host:has(.filter-bar) .list-toolbar{
  margin-bottom:8px;
}
@media (min-width:769px){
  #movies-page.list-page--filter-open .list-page-stack.table-container,
  #series-page.list-page--filter-open .list-page-stack.table-container{
    top:122px;
  }
}
body.theme-light .list-toolbar-host{
  background:var(--header-bg);
  border-bottom-color:var(--border);
}
#movies-page #movies-gallery-view,
#series-page #series-gallery-view,
#watchlist-page #watchlist-gallery-view{
  flex:1 1 0;
  min-height:0;
  min-width:0;
  width:100%;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
}
.list-table-panel{
  display:flex;
  flex-direction:column;
  width:100%;
  min-width:0;
  flex:1 1 0;
  min-height:0;
  overflow:hidden;
}
.list-table-hscroll{
  flex:1 1 0;
  min-height:0;
  min-width:0;
  width:100%;
  display:flex;
  flex-direction:column;
  overflow-x:auto;
  overflow-y:hidden;
  -webkit-overflow-scrolling:touch;
}
.list-table-body-scroll{
  flex:1 1 0;
  min-height:0;
  min-width:0;
  width:100%;
  overflow-x:visible;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  overscroll-behavior-y:contain;
  touch-action:pan-y;
}
/* Одна таблица (thead+tbody): общий скролл — колонки совпадают с заголовками */
.list-table-body-scroll.list-table-unified{
  overflow:auto;
  touch-action:pan-y pan-x;
}
.list-table-sync{
  table-layout:fixed;
  width:100%;
  border-collapse:collapse;
}
#movies-page #movies-table-body-scroll thead th,
#series-page #series-table-body-scroll thead th,
#watchlist-page #watchlist-table-body-scroll thead th{
  position:sticky;
  top:0;
  z-index:3;
  background:var(--bac);
  backdrop-filter:blur(14px);
  -webkit-backdrop-filter:blur(14px);
  box-shadow:0 1px 0 rgba(255,255,255,.30);
}
body.theme-light #movies-page #movies-table-body-scroll thead th,
body.theme-light #series-page #series-table-body-scroll thead th,
body.theme-light #watchlist-page #watchlist-table-body-scroll thead th{
  background:rgba(242,242,247,.97);
  box-shadow:0 1px 0 rgba(0,0,0,.08);
}
.list-table-scroll{
  min-height:0;
  overflow-x:auto;
  width:100%;
  min-width:0;
}
#movies-page #movies-table-view tbody tr[data-item-id],
#series-page #series-table-view tbody tr[data-item-id],
#watchlist-page #watchlist-table-view tbody tr[data-item-id]{
  min-height:52px;
}
.page-search{display:flex;align-items:center;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.07);border-radius:10px;padding:9px 14px;margin-bottom:16px;max-width:380px;gap:8px;}
.page-search input::-webkit-search-cancel-button{cursor:pointer!important;-webkit-appearance:none;height:18px;width:18px;background:rgba(255,255,255,.15);border-radius:50%;background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='10' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E");background-repeat:no-repeat;background-position:center;margin-right:4px;}
.page-search input{background:transparent;border:none;outline:none;color:#fff;font-size:14px;font-family:inherit;width:100%;}
.page-search input::placeholder{color:rgba(255,255,255,.2);}
.page-search svg{flex-shrink:0;color:rgba(255,255,255,.25);}
/* Панель над таблицей: поиск + рекомендации + вид — одинаковые зазоры */
.list-toolbar{
  display:flex;
  align-items:center;
  gap:10px;
  margin-bottom:16px;
  max-width:100%;
  flex-wrap:wrap;
  flex-shrink:0;
}
.list-toolbar .page-search{
  margin-bottom:0;
  flex:1;
  min-width:0;
  max-width:380px;
}
.list-toolbar .view-toggle{
  display:flex;
  align-items:center;
  gap:4px;
  margin-left:auto;
  flex-shrink:0;
}
.list-toolbar .rec-btn{
  margin-right:0;
  flex-shrink:0;
}
.list-toolbar .view-btn{
  flex-shrink:0;
}
/* Списки: одна строка как на главной — search-bar + вид внутри */
.list-toolbar .list-toolbar-search-bar{
  width:100%;
  max-width:none;
  margin:0;
  box-sizing:border-box;
}
.list-toolbar .list-toolbar-search-bar .view-toggle{
  display:flex;
  align-items:center;
  gap:4px;
  margin-left:10px;
  flex-shrink:0;
}
.list-toolbar .list-toolbar-search-bar .view-btn{
  width:28px;
  height:28px;
  border-radius:var(--border-radius-icons);
}
/* Строка только под колокол (календарь / карточка) — видна с мобилки */
.list-toolbar--mobile-notif-only{display:none;}

/*#detail-page{background:#111;}*/
.detail-header{
  position:sticky;top:0;z-index:100;
  /*background:rgb(17,17,17);*/
  backdrop-filter:blur(28px);
  border-bottom:1px solid rgba(255,255,255,.06);
  padding:0 28px;height:var(--list-header-h);
  box-sizing:border-box;
  display:flex;align-items:center;gap:14px;
}
.detail-content{padding:20px 24px 56px;max-width:1020px;margin:0 auto;width:100%;overflow:hidden;}
.detail-hero{display:grid;grid-template-columns:210px 1fr;gap:28px;margin-bottom:18px;align-items:flex-start;}
/* LEFT COLUMN */
.detail-left{display:flex;flex-direction:column;gap:10px;}
.detail-poster{width:210px;height:315px;border-radius:14px;flex-shrink:0;border:1px solid rgba(255,255,255,.07);overflow:hidden;}
.det-main-btn{width:100%;padding:11px 14px;border-radius:20px;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;border:none;display:flex;align-items:center;justify-content:center;gap:7px;transition:all .2s;}

/* Desktop: mobile action row hidden */
.det-action-row-wrap--mobile { display: none; }
.det-action-row-wrap--desktop { display: block; }
.det-main-btn-circle{width:100%;padding:11px 14px;border-radius:20px;font-size:13px;font-weight:600;font-family:inherit;cursor:pointer;border:none;display:flex;align-items:center;justify-content:center;gap:7px;transition:all .2s;}
.det-main-btn-circle.in-list{background:#2065d4;color:#fff;}
.det-main-btn-circle.in-list:hover{background:#2a75e8;}
.det-main-btn-circle.add{background:rgba(255,255,255,.9);color:#000;}
.det-main-btn-circle.add:hover{background:#fff;}

/* Desktop: det-action-row — вертикальный стек как оригинальный layout */
.det-action-row{display:flex;flex-direction:column;gap:7px;width:100%;}

/* Desktop: det-later-circle и det-bell-circle выглядят как det-sec-btn */
.det-later-circle,.det-bell-circle{padding:9px 10px;border-radius:20px;font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:rgba(255,255,255,.6);transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px;width:100%;}
.det-later-circle .det-later-ico{display:block;}
.det-later-circle .det-later-ico path{fill:none;stroke:currentColor;}
.det-later-circle:not(.in-list){color:rgba(255,255,255,.55);}
.det-later-circle.in-list{border-color:rgba(10,132,255,.42);background:rgba(10,132,255,.12);color:#0A84FF;}
.det-later-circle.in-list .det-later-ico path{fill:currentColor;}
.det-later-circle:disabled{opacity:.5;pointer-events:none;}
.det-bell-circle.notify-on{border-color:rgba(255,214,10,.4);color:#FFD60A;background:rgba(255,214,10,.08);}

/* Desktop: позже + (колокол при наличии) + трейлер в одну строку */
.det-action-row .det-sec-row-inner{display:grid;grid-template-columns:1fr 1fr;gap:7px;}
.det-action-row .det-sec-row-inner:has(.det-bell-circle){grid-template-columns:1fr 1fr 1fr;}

/* Пользовательские списки по TMDB на карточке фильма/сериала */
.det-custom-list-wrap{
  width:100%;
  margin-top:2px;
}
.det-custom-list-wrap .det-custom-list-sub{
  width:100%;
  border-radius:14px;
  background:rgba(255,255,255,.04);
  border:0.5px solid rgba(255,255,255,.08);
}
.det-custom-list-wrap .collection-menu-sub-toggle{
  text-align:center;
  cursor:pointer;
  border-radius:14px;
}
.det-custom-list-wrap .collection-menu-sub-toggle:hover{
  background:rgba(255,255,255,.06);
}
.det-custom-list-wrap .collection-menu-item--sub:is(:hover,.open){
  z-index:35;
}
@media (hover:hover){
  .det-custom-list-wrap .collection-menu-item--sub:hover > .collection-menu-sub{
    display:block;
    position:absolute;
    left:0;
    right:0;
    top:auto;
    bottom:calc(100% + 6px);
    margin:0;
    margin-right:0;
    max-height:min(38vh,280px);
    z-index:40;
  }
}
.det-custom-list-wrap .collection-menu-item--sub.open > .collection-menu-sub{
  left:0!important;
  right:0!important;
  top:auto!important;
  bottom:calc(100% + 6px)!important;
  margin:0!important;
  margin-right:0!important;
  max-height:min(38vh,280px);
  z-index:40;
}
@media (max-width:768px){
  .det-custom-list-wrap .collection-menu-item--sub.open > .collection-menu-sub,
  .det-custom-list-wrap .collection-menu-item--sub:hover > .collection-menu-sub{
    top:100%!important;
    bottom:auto!important;
    margin-top:4px!important;
  }
}

/* Desktop: сердечко */
.det-heart-btn.det-circle-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);cursor:pointer;padding:0;border-radius:20px;width:100%;min-height:36px;flex-shrink:0;transition:background .2s,border-color .2s;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);}
.det-main-btn.accent{background:#FFD60A;color:#000;}
.det-main-btn.accent:hover{background:#ffe340;}
.det-main-btn.in-list{background:#2065d4;color:#fff;}
.det-main-btn.in-list:hover{background:#2a75e8;}
.det-main-btn.add{background:rgba(255,255,255,.9);color:#000;}
.det-main-btn.add:hover{background:#fff;}
.det-sec-row{display:grid;grid-template-columns:1fr 1fr;gap:7px;}
.det-sec-btn{padding:9px 10px;border-radius:20px;font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:rgba(255,255,255,.6);transition:all .2s;display:flex;align-items:center;justify-content:center;gap:5px;}
.det-sec-btn:hover{background:rgba(255,255,255,.09);color:#fff;}
.det-sec-btn.in-list{border-color:rgba(255,214,10,.3);color:#FFD60A;background:rgba(255,214,10,.07);}
.det-sec-btn.in-list:hover{background:rgba(255,214,10,.12);color:#ffe340;border-color:rgba(255,214,10,.38);}
.det-sec-btn--no-trailer{cursor:default;pointer-events:none;}
.det-sec-btn--add-trailer{border-color:rgba(255,80,80,.35);color:#ff8a8a;background:rgba(255,60,60,.08);}
.det-sec-btn--add-trailer:hover{color:#ffb4b4;border-color:rgba(255,120,120,.45);background:rgba(255,60,60,.12);}
.set-trailer-box{max-width:420px;text-align:left;}
.set-trailer-hint{margin-bottom:10px;font-size:13px;line-height:1.35;color:rgba(255,255,255,.55);}
.set-trailer-input{width:100%;box-sizing:border-box;padding:10px 12px;border-radius:10px;border:1px solid rgba(255,255,255,.12);background:rgba(0,0,0,.25);color:#fff;font-size:14px;font-family:inherit;}
.set-trailer-input::placeholder{color:rgba(255,255,255,.35);}
.set-trailer-results{max-height:220px;overflow-y:auto;margin-top:10px;display:flex;flex-direction:column;gap:6px;}
.set-trailer-btns{flex-wrap:wrap;justify-content:flex-end;gap:8px;margin-top:14px;}
.set-trailer-loading,.set-trailer-empty{font-size:13px;color:rgba(255,255,255,.45);padding:8px 0;}
.set-trailer-yt-row{display:flex;align-items:center;gap:10px;width:100%;text-align:left;padding:8px;border-radius:10px;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:#fff;cursor:pointer;font:inherit;}
.set-trailer-yt-row:hover{background:rgba(255,255,255,.08);}
.set-trailer-yt-thumb{width:72px;height:40px;object-fit:cover;border-radius:6px;flex-shrink:0;background:rgba(0,0,0,.3);pointer-events:none;-webkit-user-drag:none;}
.set-trailer-yt-meta{display:flex;flex-direction:column;gap:2px;min-width:0;}
.set-trailer-yt-title{font-size:12px;font-weight:600;line-height:1.25;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.set-trailer-yt-ch{font-size:11px;color:rgba(255,255,255,.45);}
.det-bell-btn{width:100%;padding:9px 14px;border-radius:20px;font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.09);background:rgba(255,255,255,.04);color:rgba(255,255,255,.45);transition:all .2s;display:flex;align-items:center;justify-content:center;gap:6px;}
.det-bell-btn:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.8);}
.det-bell-btn.notify-on{background:rgba(255,214,10,.1);border-color:rgba(255,214,10,.28);color:#FFD60A;}
.det-platform-heart-row{display:flex;align-items:stretch;gap:7px;}
/* Платформа / сердце / теги — тот же визуал, что .det-sec-btn (Трейлер, Позже) */
.det-platform-select-btn{flex:1;min-height:36px;padding:9px 12px;border-radius:20px;font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);color:rgba(255,255,255,.6);transition:all .2s;display:flex;align-items:center;justify-content:space-between;gap:8px;position:relative;}
.det-platform-select-btn:hover{background:rgba(255,255,255,.09);color:#fff;}
.det-platform-select-btn.active{border-color:rgba(255,255,255,.14);background:rgba(255,255,255,.08);color:rgba(255,255,255,.88);}
.det-heart-btn{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.1);cursor:pointer;padding:0;border-radius:20px;width:36px;min-height:36px;flex-shrink:0;transition:background .2s,border-color .2s,color .2s;line-height:1;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.6);}
.det-heart-btn:hover{background:rgba(255,255,255,.09);color:#fff;}
.det-tags-bar{display:flex;align-items:center;gap:7px;width:100%;padding:6px 7px;border-radius:20px;box-sizing:border-box;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);}
.det-tags-bar-icon{flex-shrink:0;display:flex;align-items:center;justify-content:center;color:rgba(255,255,255,.55);}
.det-tags-bar-scroll{flex:1;display:flex;flex-wrap:nowrap;gap:5px;overflow-x:auto;overflow-y:hidden;min-width:0;-webkit-overflow-scrolling:touch;scrollbar-width:none;}
.det-tags-bar-scroll::-webkit-scrollbar{display:none;}
.det-tags-bar-scroll .det-tag-btn{width:auto;min-width:32px;height:auto;min-height:32px;padding:4px 10px;gap:5px;border-radius:10px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.05);display:inline-flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,border-color .15s,color .15s;flex-shrink:0;color:rgba(255,255,255,.85);}
.det-tags-bar-scroll .det-tag-btn:hover{background:rgba(255,255,255,.09);color:#fff;border-color:rgba(255,255,255,.12);}
.det-tags-bar-scroll .det-tag-btn.active{background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.16);color:#fff;}
.det-tag-btn__ico{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.8;}
.det-tag-btn__txt{font-size:11px;font-weight:600;line-height:1.2;white-space:nowrap;max-width:400px;overflow:visible;}
.det-tags-bar-scroll .det-tag-btn.active .det-tag-btn__ico{opacity:1;}
.det-tags-bar-more{flex-shrink:0;width:32px;height:32px;border:1px solid rgba(255,255,255,.1);border-radius:10px;background:rgba(255,255,255,.05);color:rgba(255,255,255,.6);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s,border-color .15s,color .15s;}
.det-tags-bar-more:hover{background:rgba(255,255,255,.09);color:#fff;border-color:rgba(255,255,255,.12);}
.det-tags-bar-empty{font-size:11px;font-weight:500;color:rgba(255,255,255,.35);padding:6px 4px;flex:1;min-width:0;align-self:center;}
/* Полоска тегов над сюжетом скрыта (и мобилка, и десктоп) — теги в карточке «Теги» в сетке деталей */
#detail-page .detail-info .det-tags-bar{display:none !important;}
/* RIGHT COLUMN */
.detail-info{display:flex;flex-direction:column;gap:0;padding-top:2px;overflow:hidden;}
.detail-meta-line{font-size:11px;font-weight:100;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.35);margin-bottom:8px;}
.detail-title{font-size:26px;font-weight:100;letter-spacing:-.4px;line-height:1.18;color:#fff;margin-bottom:10px;}
.detail-genre-tags{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:14px;}
.badge{font-size:11px;font-weight:500;padding:3px 9px;border-radius:100px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.07);color:rgba(255,255,255,.45);}
.badge.rating{color:#FFD60A;border-color:rgba(255,214,10,.18);background:rgba(255,214,10,.07);}
.badge.rating--rt{color:#FA320A;border-color:rgba(250,50,10,.22);background:rgba(250,50,10,.08);}
.detail-overview-block{margin:0 0 14px;}
.detail-desc{font-size:13px;line-height:1.55;color:rgba(255,255,255,.5);margin:0;}
.detail-desc.detail-desc--clamp{display:-webkit-box;-webkit-line-clamp:5;-webkit-box-orient:vertical;overflow:hidden;}
.detail-desc.is-expanded{-webkit-line-clamp:unset;display:block;}
.detail-overview-toggle{margin-top:6px;padding:0;border:none;background:none;font-family:inherit;font-size:12px;font-weight:500;color:rgba(255,255,255,.42);cursor:pointer;text-decoration:underline;text-underline-offset:3px;}
.detail-overview-toggle:hover{color:rgba(255,255,255,.72);}
.det-section{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.09em;color:rgba(255,255,255,.28);margin-bottom:7px;margin-top:16px;display:none;align-items:center;gap:4px;}
.det-section::before{content:'';display:inline-block;width:2px;height:10px;background:rgba(255,214,10,1);border-radius:2px;}
/* Director chip */
.director-chips-row{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:4px;align-items:center;}
.director-chip{display:inline-flex;align-items:center;gap:7px;padding:6px 12px;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:20px;font-size:12px;color:rgba(255,255,255,.65);cursor:pointer;transition:background .15s;}
.director-chip:hover{background:rgba(255,255,255,.1);color:#fff;}
/* Actors section */
.actors-section{margin-top:8px;}
.actors-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px;}
.actors-expand-btn{font-size:11px;font-weight:500;color:rgba(255,255,255,.35);background:none;border:none;cursor:pointer;font-family:inherit;padding:2px 6px;border-radius:6px;transition:color .15s,background .15s;}
.actors-expand-btn:hover{color:rgba(255,255,255,.7);background:rgba(255,255,255,.06);}
/* Scroll row */
.actors-scroll-wrap{
  position:relative;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.07);
  border-radius:14px;
  overflow:hidden;
}
/* Collapsed: single scrollable row, width = 5 circles */
.actors-scroll-wrap.collapsed{
  height:124px;
}
.actors-scroll-wrap.collapsed .actors-scroll{
  flex-wrap:nowrap;
  overflow-x:auto;
  overflow-y:hidden;
  height:100%;
  padding:12px 14px;
  align-items:flex-start;
  box-sizing:border-box;
}
/* Expanded: wraps into multiple rows, fixed max-height with vertical scroll */
.actors-scroll-wrap.expanded{
  height:auto;
  max-height:280px;
  max-width:734px;
  overflow-y:auto;
  overflow-x:hidden;
}
.actors-scroll-wrap.expanded .actors-scroll{
  flex-wrap:wrap;
  overflow:visible;
  cursor:default;
  padding:12px 14px;
  gap:14px 10px;
}
.actors-scroll{display:flex;gap:16px;cursor:grab;user-select:none;-webkit-user-select:none;scrollbar-width:none;box-sizing:border-box;width:100%;}
.actors-scroll::-webkit-scrollbar{display:none;}
.actors-scroll.is-dragging{cursor:grabbing;}
/* Vertical scrollbar for expanded */
.actors-scroll-wrap.expanded::-webkit-scrollbar{width:4px;}
.actors-scroll-wrap.expanded::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:4px;}
.actors-scroll-wrap.expanded{scrollbar-width:thin;scrollbar-color:rgba(255,255,255,.12) transparent;}
/* Actor circle */
.actor-circle{display:flex;flex-direction:column;align-items:center;gap:5px;flex-shrink:0;cursor:pointer;width:64px;}
.actor-circle:hover .actor-avatar{border-color:rgba(255,255,255,.3);}
.actor-circle:hover .actor-circle-name{color:rgba(255,255,255,.85);}
.actor-avatar{width:56px;height:56px;border-radius:50%;background:rgba(255,255,255,.07);border:2px solid rgba(255,255,255,.1);overflow:hidden;display:flex;align-items:center;justify-content:center;transition:border-color .15s;flex-shrink:0;}
.actor-avatar img{width:100%;height:100%;object-fit:cover;pointer-events:none;}
.actor-avatar svg{opacity:.2;}
.actor-circle-name{font-size:10px;font-weight:500;color:rgba(255,255,255,.45);text-align:center;line-height:1.3;width:100%;overflow:hidden;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
/* Скелетон актёров (пока догружается TMDB) */
.actors-section--skeleton .actors-header{justify-content:flex-start;}
.actor-circle--skeleton{cursor:default;pointer-events:none;}
.actor-avatar--skeleton{
  border-color:rgba(255,255,255,.06)!important;
  background:linear-gradient(90deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.12) 45%,rgba(255,255,255,.05) 90%);
  background-size:200% 100%;
  animation:det-actors-sk-shimmer 1.15s ease-in-out infinite;
}
.actor-circle-name--skeleton{
  height:22px;width:48px;border-radius:5px;
  background:linear-gradient(90deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.12) 45%,rgba(255,255,255,.05) 90%);
  background-size:200% 100%;
  -webkit-line-clamp:unset;display:block;
  animation:det-actors-sk-shimmer 1.15s ease-in-out infinite;
  animation-delay:.08s;
}
@keyframes det-actors-sk-shimmer{
  0%{background-position:100% 0;}
  100%{background-position:-100% 0;}
}
@media (prefers-reduced-motion:reduce){
  .actor-avatar--skeleton,.actor-circle-name--skeleton{animation:none;}
}
body.theme-light .actor-avatar--skeleton{
  background:linear-gradient(90deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.09) 45%,rgba(0,0,0,.04) 90%);
  background-size:200% 100%;
  border-color:rgba(0,0,0,.08)!important;
}
body.theme-light .actor-circle-name--skeleton{
  background:linear-gradient(90deg,rgba(0,0,0,.04) 0%,rgba(0,0,0,.09) 45%,rgba(0,0,0,.04) 90%);
  background-size:200% 100%;
}
.actors-row{display:flex;gap:6px;flex-wrap:wrap;margin-bottom:2px;}
.actor-chip{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:7px;padding:3px 9px;font-size:11px;color:rgba(255,255,255,.5);cursor:pointer;transition:background .15s;line-height:1.3;}
.actor-chip:hover{background:rgba(255,255,255,.09);color:rgba(255,255,255,.8);}
/* Bottom rows */
.det-watched-block{margin-top:16px;}
.det-watched-block .det-section{margin-top:0;}
.det-release-block{margin-top:0;}
/* Прямоугольный тег как на Apple TV (не капсула) — дата релиза в карточке */
.det-atv-tag{
  display:inline-flex;
  align-items:center;
  margin-top:6px;
  padding:6px 11px;
  border-radius:6px;
  background:rgba(0,0,0,.52);
  backdrop-filter:blur(12px);
  -webkit-backdrop-filter:blur(12px);
  box-shadow:0 1px 8px rgba(0,0,0,.25);
  font-size:11px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:#fff;
  line-height:1.25;
  max-width:100%;
  box-sizing:border-box;
}
body.theme-light .det-atv-tag{
  background:rgba(0,0,0,.38);
  box-shadow:0 1px 6px rgba(0,0,0,.12);
}
.det-premiere-value{font-size:15px;font-weight:500;color:rgba(255,255,255,.85);letter-spacing:.02em;}

/* ── Карточки эпизодов сезона (кэш TMDB, миниатюра w300) ── */
.det-ep-section{margin-top:18px;}
.det-ep-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:12px;gap:10px;}
.det-ep-section-title{font-size:13px;font-weight:500;color:rgba(255,255,255,.45);letter-spacing:.08em;text-transform:uppercase;}
.det-ep-header-right{display:flex;align-items:center;gap:6px;}
.det-ep-season-nav{
  width:30px;height:30px;border-radius:10px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);color:rgba(255,255,255,.75);font-size:16px;line-height:1;cursor:pointer;padding:0;
}
.det-ep-season-nav:hover:not(:disabled){background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);}
.det-ep-season-nav:disabled{opacity:.25;cursor:default;}
.det-ep-season-badge{
  font-size:12px;color:rgba(255,255,255,.42);
  background:rgba(255,255,255,.06);border:0.5px solid rgba(255,255,255,.1);
  border-radius:20px;padding:4px 10px;white-space:nowrap;
}
.det-ep-scroll{
  display:flex;gap:12px;overflow-x:auto;scroll-snap-type:x mandatory;
  -webkit-overflow-scrolling:touch;padding-bottom:10px;margin:0 -4px;padding-left:4px;padding-right:4px;
  scrollbar-width:none;
}
.det-ep-scroll::-webkit-scrollbar{display:none;}
.det-ep-loading{font-size:13px;color:rgba(255,255,255,.35);padding:12px 4px;}
.det-ep-card{
  flex:0 0 260px;scroll-snap-align:start;border-radius:12px;overflow:hidden;
  background:rgba(255,255,255,.06);border:0.5px solid rgba(255,255,255,.1);
  cursor:default;transition:border-color .2s,transform .15s,opacity .2s;position:relative;
}
.det-ep-card:hover{border-color:rgba(255,255,255,.16);transform:translateY(-2px);}
.det-ep-card--watched{opacity:.62;}
.det-ep-card--current{border-color:#2065d4;border-width:1.5px;box-shadow:0 0 0 1px rgba(32,101,212,.22);}
.det-ep-card--future{opacity:.48;}
.det-ep-still{width:100%;aspect-ratio:16/9;position:relative;background:rgba(0,0,0,.35);overflow:hidden;}
.det-ep-still img{width:100%;height:100%;object-fit:cover;display:block;}
.det-ep-still-ph{
  width:100%;height:100%;display:flex;align-items:center;justify-content:center;
  font-size:26px;color:rgba(255,255,255,.22);background:rgba(255,255,255,.04);
}
.det-ep-still-overlay{
  position:absolute;inset:0;
  background:linear-gradient(to top,rgba(0,0,0,.55) 0%,transparent 55%);pointer-events:none;
}
.det-ep-num{
  position:absolute;top:8px;left:8px;font-size:11px;font-weight:500;letter-spacing:.04em;color:#fff;
  background:rgba(0,0,0,.55);border-radius:6px;padding:3px 8px;backdrop-filter:blur(4px);
}
.det-ep-dot{position:absolute;top:8px;right:8px;width:8px;height:8px;border-radius:50%;}
.det-ep-dot--watched{background:#2065d4;}
.det-ep-dot--current{background:#85B7EB;}
.det-ep-dot--future{background:transparent;border:1.5px solid rgba(255,255,255,.35);}
.det-ep-info{padding:10px 12px 12px;}
.det-ep-title{font-size:13px;font-weight:500;color:rgba(255,255,255,.92);line-height:1.35;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-bottom:4px;}
.det-ep-meta{display:flex;align-items:center;justify-content:space-between;gap:8px;}
.det-ep-date{font-size:12px;color:rgba(255,255,255,.4);}
.det-ep-runtime{font-size:11px;color:rgba(255,255,255,.38);background:rgba(255,255,255,.06);border-radius:4px;padding:2px 6px;}
.det-ep-prog{height:2px;background:rgba(255,255,255,.1);border-radius:2px;margin-top:8px;}
.det-ep-prog-fill{height:100%;background:#2065d4;border-radius:2px;}

body.theme-light .det-ep-section-title{color:var(--text45);}
body.theme-light .det-ep-season-badge{color:var(--text45);background:var(--tag-bg);border-color:var(--border2);}
body.theme-light .det-ep-season-nav{background:var(--tag-bg);border-color:var(--border2);color:var(--text);}
body.theme-light .det-ep-card{background:var(--tag-bg);border-color:var(--border2);}
body.theme-light .det-ep-card--current{border-color:#2065d4;box-shadow:0 0 0 1px rgba(32,101,212,.18);}
body.theme-light .det-ep-title{color:var(--text);}
body.theme-light .det-ep-date,body.theme-light .det-ep-runtime{color:var(--text45);}
body.theme-light .det-ep-loading{color:var(--text35);}

.det-update-date-row{display:flex;align-items:center;justify-content:space-between;margin-top:6px;gap:10px;flex-wrap:wrap;}
.det-date-group{display:flex;align-items:center;gap:8px;flex-shrink:0;}
/* Как .director-chip — тускло, без яркого белого */
.det-date-input{
  background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;
  padding:6px 10px;font-size:12px;font-weight:500;color:rgba(255,255,255,.65);font-family:inherit;outline:none;
  color-scheme:dark;min-width:0;max-width:160px;
}
.det-date-input:hover{border-color:rgba(255,255,255,.11);color:rgba(255,255,255,.75);}
.det-date-input:focus{border-color:rgba(255,255,255,.14);color:rgba(255,255,255,.82);}
.det-date-input::-webkit-calendar-picker-indicator{opacity:.35;filter:invert(1);cursor:pointer;}
.det-date-input::-webkit-calendar-picker-indicator:hover{opacity:.55;}
/* Info cards row */
.det-info-cards{
  display:grid;
  grid-template-columns:repeat(4,1fr);
  gap:10px;
  margin-top:8px;
}
.det-info-cards::-webkit-scrollbar{display:none;}
.det-info-card{
  min-width:0;
  max-width:none;
  height:110px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.10);
  border-radius:14px;
  padding:14px 16px;
  display:flex;
  flex-direction:column;
  justify-content:center;
  align-items:center;
  text-align:center;
  gap:6px;
  box-sizing:border-box;
}
.det-info-card--clickable {
  cursor: pointer;
  transition: background .18s, border-color .18s;
}
.det-info-card--clickable:hover {
  background: rgba(255,255,255,.10);
  border-color: rgba(255,255,255,.18);
}
.det-info-card-label{
  font-size:10px;
  font-weight:600;
  letter-spacing:.06em;
  text-transform:uppercase;
  color:rgba(255,255,255,.35);
  line-height:1.2;
  width:100%;
}
.det-info-card-value{
  font-size:14px;
  font-weight:600;
  color:rgba(255,255,255,.85);
  line-height:1.3;
  width:100%;
}
.det-info-card-value--tags{
  display:flex;
  flex-wrap:wrap;
  gap:6px;
  align-items:center;
  align-content:center;
  justify-content:center;
  font-weight:500;
}
.det-info-card-value--tags .tag-pill-icon{
  flex-shrink:0;
  max-width:100%;
}
.det-info-card-value--tags .tag-pill-label{
  max-width:none;
  overflow:visible;
  text-overflow:clip;
}
.det-info-card-muted{
  font-size:13px;
  font-weight:500;
  color:rgba(255,255,255,.35);
}
.det-info-platform-tv-icon{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  color:rgba(255,255,255,.42);
}
body.theme-light .det-info-card-muted{color:var(--text35);}
body.theme-light .det-info-platform-tv-icon{color:var(--text35);}
.det-info-platform-svg-wrap{
  display:inline-flex;
  align-items:center;
  justify-content:center;
  line-height:0;
}
.det-info-platform-svg{
  width:34px;
  height:34px;
  display:block;
  flex-shrink:0;
}
.det-info-platform-svg-wrap--brand .det-info-platform-svg{
  width:auto;
  max-width:min(100%,140px);
  height:34px;
}
.det-info-platform-fallback-text{
  font-size:14px;
  font-weight:600;
  color:rgba(255,255,255,.85);
}
.det-info-platform--netflix{color:#e50914;}
.det-info-platform--apple{color:#f5f5f7;}
.det-info-platform--hbo{color:#fff;}
.det-info-platform--amazon{color:#ff9900;}
.det-info-platform--fox{color:#fff;}
body.theme-light .det-info-platform--apple{color:var(--text80);}
body.theme-light .det-info-platform--hbo{color:var(--text80);}
body.theme-light .det-info-platform--fox{color:var(--text80);}
body.theme-light .det-info-platform-fallback-text{color:var(--text80);}
body.theme-light .det-info-card{
  background:var(--tag-bg);
  border-color:var(--border);
}
body.theme-light .det-info-card-label{color:var(--text35);}
body.theme-light .det-info-card-value{color:var(--text80);}

/* Comment area */
.det-comment-section{margin-top:18px;}
.comment-textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 14px;font-size:13px;color:#fff;font-family:inherit;outline:none;resize:vertical;min-height:90px;transition:border-color .2s;}
.comment-textarea:focus{border-color:rgba(255,255,255,.18);}
.comment-textarea::placeholder{color:rgba(255,255,255,.2);}
.comment-save-btn{margin-top:8px;padding:9px 20px;border-radius:9px;font-size:13px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.12);background:rgba(255,255,255,.07);color:rgba(255,255,255,.55);transition:all .2s;}
.comment-save-btn:hover{background:rgba(255,255,255,.12);color:#fff;}

/* ── iMessage-стиль заметок ── */
.imsg-wrap { display:flex; flex-direction:column; gap:0; }
.imsg-list  { display:flex; flex-direction:column; gap:2px; margin-bottom:10px; min-height:0; }
.imsg-row   { display:flex; flex-direction:column; align-items:flex-end; margin-bottom:2px; }
.imsg-bubble {
  max-width: 80%;
  background: #007AFF;
  color: #fff;
  border-radius: 20px 20px 5px 20px;
  padding: 9px 14px;
  font-size: 15px;
  line-height: 1.4;
  word-break: break-word;
  position: relative;
  box-shadow: 0 1px 2px rgba(0,0,0,.18);
}
.imsg-text { white-space: pre-wrap; }
.imsg-meta {
  display: flex;
  align-items: center;
  gap: 6px;
  margin-top: 2px;
  padding-right: 4px;
  opacity: 0;
  transition: opacity .15s;
}
.imsg-row:hover .imsg-meta { opacity: 1; }
.imsg-time { font-size: 10px; color: rgba(255,255,255,.35); }
.imsg-btn-edit, .imsg-btn-del {
  background: none; border: none; cursor: pointer;
  padding: 2px; border-radius: 4px;
  display: flex; align-items: center; justify-content: center;
  transition: opacity .15s;
}
.imsg-btn-edit { color: rgba(255,255,255,.35); }
.imsg-btn-edit:hover { color: rgba(255,255,255,.8); }
.imsg-btn-del  { color: rgba(255,80,80,.45); }
.imsg-btn-del:hover  { color: rgba(255,80,80,.9); }
.imsg-edit-ta {
  width: 100%; background: rgba(255,255,255,.12);
  border: 1px solid rgba(255,255,255,.25); border-radius: 8px;
  padding: 6px 9px; font-size: 13px; color: #fff;
  font-family: inherit; outline: none; resize: vertical; min-height: 48px; margin-top: 6px;
}
.imsg-edit-btns { display: flex; gap: 6px; margin-top: 5px; }
.imsg-edit-save, .imsg-edit-cancel {
  padding: 4px 12px; border-radius: 7px; font-size: 12px;
  font-family: inherit; cursor: pointer; border: none;
}
.imsg-edit-save   { background: rgba(255,255,255,.15); color: #fff; }
.imsg-edit-cancel { background: none; border: 1px solid rgba(255,255,255,.1); color: rgba(255,255,255,.45); }
/* Поле ввода — как в iMessage */
.imsg-input-row {
  display: flex; align-items: flex-end; gap: 8px;
  background: rgba(255,255,255,.06);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px;
  padding: 7px 7px 7px 16px;
}
.imsg-input {
  flex: 1; background: none; border: none; outline: none;
  font-size: 15px; color: #fff; font-family: inherit;
  resize: none; overflow: hidden; min-height: 22px; max-height: 100px;
  line-height: 1.45; padding: 0;
}
.imsg-input::placeholder { color: rgba(255,255,255,.25); }
.imsg-send-btn {
  width: 30px; height: 30px; border-radius: 50%; flex-shrink: 0;
  background: #007AFF; border: none; cursor: pointer;
  display: flex; align-items: center; justify-content: center;
  color: #fff; transition: background .15s;
}
.imsg-send-btn:hover { background: #0062cc; }
.imsg-limit { font-size:12px; color:rgba(255,255,255,.25); text-align:center; padding:6px 0; }
/* Светлая тема */
body.theme-light .imsg-bubble { background: #007AFF; }
body.theme-light .imsg-input-row { background: rgba(0,0,0,.04); border-color: rgba(0,0,0,.1); }
body.theme-light .imsg-input { color: #000; }
body.theme-light .imsg-input::placeholder { color: rgba(0,0,0,.3); }
body.theme-light .imsg-time { color: rgba(0,0,0,.35); }
/* Actions (kept for compat) */
.detail-actions{display:flex;gap:6px;flex-wrap:wrap;align-items:center;margin-top:4px;}
.det-action-btn{padding:7px 14px;border-radius:9px;font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:transparent;color:rgba(255,255,255,.55);transition:all .2s;display:inline-flex;align-items:center;gap:5px;}
.det-action-btn:hover{background:rgba(255,255,255,.06);color:#fff;}
.det-action-btn.accent{background:rgba(255,255,255,.9);color:#000;border-color:transparent;}
.det-action-btn.accent:hover{background:#fff;}
.det-action-btn.in-list{border-color:rgba(255,214,10,.3);color:#FFD60A;background:rgba(255,214,10,.07);}
.det-divider{height:1px;background:rgba(255,255,255,.06);margin:14px 0;}
.ep-picker-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:16px;}
@media(max-width:600px){
  /* Узкий экран: сезон | эпизод, прогресс снизу; align-items:start — карточки по высоте контента */
  .ep-picker-grid{
    grid-template-columns:1fr 1fr;
    gap:10px;
    align-items:start;
  }
  .ep-picker-box--progress{
    grid-column:1 / -1;
    flex-direction:row;
    flex-wrap:wrap;
    align-items:center;
    justify-content:space-between;
    gap:10px 14px;
  }
  .ep-picker-box--progress .prog-box-lbl{
    flex:1 1 100%;
    margin-bottom:0;
  }
  .ep-progress-pct{
    flex:0 0 auto;
    min-height:0;
    margin:0;
    font-size:22px;
  }
  .ep-picker-box--progress .det-mark-done-btn{
    flex:1 1 auto;
    min-width:min(100%,200px);
    max-width:100%;
  }
}
@media(max-width:360px){
  .ep-picker-grid{gap:8px;}
  .ep-picker-box{padding:12px 10px;}
}
.ep-picker-box{background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;padding:14px 16px;}
.ep-picker-box--progress{display:flex;flex-direction:column;align-items:stretch;min-height:0;}
.ep-picker-box .prog-box-lbl{font-size:10px;text-transform:uppercase;letter-spacing:.07em;color:rgba(255,255,255,.22);font-weight:600;margin-bottom:10px;}
.ep-progress-pct{
  font-size:26px;font-weight:600;letter-spacing:-0.02em;color:#fff;line-height:1.15;
  margin-bottom:12px;flex:1;display:flex;align-items:center;justify-content:center;min-height:36px;
}
.det-mark-done-btn{
  width:100%;box-sizing:border-box;margin:0;padding:9px 10px;border-radius:10px;font-size:11px;font-weight:600;
  font-family:inherit;cursor:pointer;border:1px solid rgba(52,199,89,.35);
  background:rgba(52,199,89,.12);color:#34c759;transition:background .15s,border-color .15s,opacity .15s;line-height:1.25;
}
.det-mark-done-btn:hover{background:rgba(52,199,89,.2);border-color:rgba(52,199,89,.45);}
.det-mark-done-btn:active{opacity:.88;}
.det-mark-done-btn:disabled{opacity:.45;cursor:default;}
.ep-picker-ctrl{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 8px;row-gap:4px;}
.ep-picker-ctrl .ep-btn{width:28px;height:28px;font-size:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:7px;color:#fff;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:background .15s;flex-shrink:0;}
.ep-picker-ctrl .ep-btn:hover{background:rgba(255,255,255,.14);}
.ep-picker-ctrl .ep-num{font-size:17px;font-weight:600;min-width:26px;text-align:center;flex-shrink:0;}
/* «/ N» на отдельной строке под степпером — не вылезает за карточку на узких колонках */
.ep-picker-ctrl .ep-total{
  flex:1 1 100%;
  text-align:center;
  font-size:11px;
  line-height:1.2;
  color:rgba(255,255,255,.28);
  margin-top:2px;
}
@media(min-width:601px){
  .ep-picker-ctrl{flex-wrap:nowrap;justify-content:flex-start;gap:8px;}
  .ep-picker-ctrl .ep-total{
    flex:0 0 auto;
    margin-top:0;
    text-align:left;
    font-size:12px;
    color:rgba(255,255,255,.25);
  }
}
.status-selector{display:flex;gap:6px;margin-bottom:20px;flex-wrap:wrap;}
.status-opt{padding:7px 16px;border-radius:9px;font-size:12px;font-weight:500;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);color:rgba(255,255,255,.35);font-family:inherit;transition:all .15s;}
.status-opt:hover{background:rgba(255,255,255,.08);color:rgba(255,255,255,.7);}
.status-opt.active-done{background:rgba(48,209,88,.1);border-color:rgba(48,209,88,.3);color:#30d158;}
.status-opt.active-skip{background:rgba(255,159,10,.08);border-color:rgba(255,159,10,.3);color:#ff9f0a;}
.status-opt.active-drop{background:rgba(255,69,58,.08);border-color:rgba(255,69,58,.3);color:#ff453a;}
.progress-bar-wrap{background:rgba(255,255,255,.07);border-radius:100px;height:4px;overflow:hidden;margin:12px 0 6px;}
.progress-bar-fill{height:100%;border-radius:100px;background:#fff;transition:width .4s ease;}
.det-progress-block .progress-bar-fill{background:linear-gradient(90deg,#248a3d,#34c759);box-shadow:0 0 10px rgba(52,199,89,.2);}
/* Скелетон прогресса (первый кадр до TMDB) */
.det-progress-block--skeleton{pointer-events:none;user-select:none;}
.det-progress-block--skeleton .det-prog-sk-val,
.det-progress-block--skeleton .det-prog-sk-lbl,
.det-progress-block--skeleton .det-prog-sk-circle,
.det-progress-block--skeleton .det-prog-sk-line,
.det-progress-block--skeleton .det-prog-sk-dot,
.det-progress-block--skeleton .det-prog-sk-seg,
.det-progress-block--skeleton .det-prog-sk-sel,
.det-progress-block--skeleton .det-prog-sk-btn{background:rgba(255,255,255,.1);}
body.theme-light .det-progress-block--skeleton .det-prog-sk-val,
body.theme-light .det-progress-block--skeleton .det-prog-sk-lbl,
body.theme-light .det-progress-block--skeleton .det-prog-sk-circle,
body.theme-light .det-progress-block--skeleton .det-prog-sk-line,
body.theme-light .det-progress-block--skeleton .det-prog-sk-dot,
body.theme-light .det-progress-block--skeleton .det-prog-sk-seg,
body.theme-light .det-progress-block--skeleton .det-prog-sk-sel,
body.theme-light .det-progress-block--skeleton .det-prog-sk-btn{background:rgba(0,0,0,.08);}
.det-prog-sk-circle--d{width:110px;height:110px;border-radius:50%;}
.det-prog-sk-circle--m{width:100px;height:100px;border-radius:50%;}
.det-prog-sk-val{height:26px;width:44px;margin:0 auto 6px;border-radius:10px;}
.det-prog-sk-lbl{height:10px;width:50px;margin:0 auto;border-radius:4px;}
.det-prog-sk-row-lbl{display:flex;justify-content:space-between;align-items:center;margin-bottom:6px;}
.det-prog-sk-line{display:inline-block;height:10px;border-radius:4px;width:56px;}
.det-prog-sk-line--short{width:36px !important;}
.det-prog-sk-line--wide{width:min(120px,42%) !important;}
.det-prog-sk-line--title{width:72px;margin-bottom:10px;}
.det-prog-sk-m-info .det-prog-sk-line{width:min(92%,200px);margin-bottom:6px;}
.det-prog-sk-m-info .det-prog-sk-line--mid{width:min(88%,190px);}
.det-prog-sk-m-info .det-prog-sk-line--narrow{width:min(78%,170px);margin-bottom:0;}
.det-prog-sk-line--lbl{width:48px;height:9px;margin-bottom:10px;display:block;}
.det-prog-sk-sel{height:34px;border-radius:10px;width:100%;}
.det-prog-sk-line--sub{width:58%;height:9px;margin:8px auto 0;display:block;}
.det-prog-sk-btn{flex:1;min-height:42px;border-radius:14px;}
.det-prog-sk-btn--m{min-height:38px;}
.det-d-season-dots .det-prog-sk-dot,
.det-m-season-dots .det-prog-sk-dot{flex:1;border-radius:3px;}
.det-d-seg-track .det-prog-sk-seg,
.det-m-seg-track .det-prog-sk-seg{flex:1;border-radius:3px;}
/* Деталь сериала: десктоп — кольцо + сетка как в макете; мобилка — отдельная карточка */
.det-progress-mobile{display:none;}
.det-progress-d-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  border-radius:20px;
  padding:22px 24px;
  margin-bottom:4px;
}
.det-d-top-row{display:flex;align-items:center;gap:24px;margin-bottom:20px;}
.det-d-ring-side{flex-shrink:0;}
.det-d-ring-svg{color:#fff;}
#det-d-ring-arc{
  transition:stroke-dasharray 0.78s cubic-bezier(0.33,1,0.68,1);
}
.det-d-stats-side{flex:1;min-width:0;}
.det-d-stats-row{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;}
.det-d-stat-cell{
  background:rgba(255,255,255,.05);
  border-radius:14px;
  padding:12px 10px;
  text-align:center;
}
.det-d-stat-val{font-size:22px;font-weight:600;color:#fff;line-height:1;}
.det-d-stat-lbl{font-size:11px;color:rgba(255,255,255,.38);margin-top:4px;}
.det-d-row-lbl{display:flex;justify-content:space-between;font-size:10px;margin-bottom:6px;}
.det-d-row-lbl-left{font-weight:600;color:rgba(255,255,255,.38);text-transform:uppercase;letter-spacing:.06em;}
.det-d-row-lbl-right{color:rgba(255,255,255,.28);}
.det-d-season-dots{display:flex;gap:5px;margin-bottom:14px;}
.det-d-s-dot{
  height:6px;flex:1;border-radius:3px;background:rgba(255,255,255,.08);
  transition:background-color 0.42s cubic-bezier(0.33,1,0.68,1),background 0.42s cubic-bezier(0.33,1,0.68,1);
  transition-delay:calc(var(--dot-i,0) * 32ms);
}
.det-d-s-dot--done{background:#2065d4;}
.det-d-s-dot--cur{background:#85B7EB;}
.det-d-seg-wrap{margin-bottom:20px;}
.det-d-seg-track{display:flex;gap:3px;height:8px;}
.det-d-seg-cell{
  flex:1;border-radius:3px;background:rgba(255,255,255,.08);
  transition:background-color 0.48s cubic-bezier(0.33,1,0.68,1),background 0.48s cubic-bezier(0.33,1,0.68,1);
  transition-delay:calc(var(--seg-i,0) * 18ms);
}
.det-d-seg-cell--done{background:#2065d4;}
.det-d-seg-cell--cur{background:#85B7EB;}
.det-d-sel-row{display:flex;gap:10px;margin-bottom:20px;}
.det-d-sel-item{
  flex:1;background:rgba(255,255,255,.04);
  border:1px solid rgba(255,255,255,.06);
  border-radius:14px;
  padding:14px 18px;
}
.det-d-sel-lbl{font-size:10px;font-weight:600;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.06em;margin-bottom:10px;}
.det-d-sel-ctrl{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.det-d-sel-btn{
  width:32px;height:32px;border-radius:10px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;
  font-size:18px;color:rgba(255,255,255,.75);cursor:pointer;font-family:inherit;flex-shrink:0;
  transition:background .15s,border-color .15s;
}
.det-d-sel-btn:hover{background:rgba(255,255,255,.1);}
.det-d-sel-val{font-size:28px;font-weight:600;color:#fff;min-width:40px;text-align:center;}
.det-d-sel-total{font-size:11px;color:rgba(255,255,255,.28);text-align:center;margin-top:6px;}
.det-d-btn-row{display:flex;gap:8px;}
.det-d-btn-season{
  flex:1;padding:11px;border-radius:14px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.88);font-size:14px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:background .15s,border-color .15s;
}
.det-d-btn-season:hover{background:rgba(255,255,255,.1);}
.det-d-btn-all{
  flex:1;padding:11px;border-radius:14px;background:#2065d4;border:none;color:#fff;
  font-size:14px;font-weight:600;cursor:pointer;font-family:inherit;
  transition:opacity .15s,filter .15s;
}
.det-d-btn-all:hover{filter:brightness(1.06);}
.det-d-btn-all:disabled,.det-d-btn-season:disabled{opacity:.45;cursor:default;}
body.theme-light .det-progress-d-card{background:rgba(0,0,0,.03);border-color:rgba(0,0,0,.08);}
body.theme-light .det-d-stat-cell{background:rgba(0,0,0,.04);}
body.theme-light .det-d-stat-val{color:#111;}
body.theme-light .det-d-stat-lbl,
body.theme-light .det-d-row-lbl-left{color:rgba(0,0,0,.45);}
body.theme-light .det-d-row-lbl-right{color:rgba(0,0,0,.4);}
body.theme-light .det-d-sel-item{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.06);}
body.theme-light .det-d-sel-lbl,
body.theme-light .det-d-sel-total{color:rgba(0,0,0,.4);}
body.theme-light .det-d-sel-btn{border-color:rgba(0,0,0,.12);background:#fff;color:#333;}
body.theme-light .det-d-s-dot{background:rgba(0,0,0,.08);}
body.theme-light .det-d-seg-cell{background:rgba(0,0,0,.08);}
body.theme-light .det-d-btn-season{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.1);color:#111;}
@media(max-width:600px){
  .det-progress-desktop{display:none;}
  .det-progress-mobile{display:block;}
}
.det-progress-m-card{
  background:rgba(255,255,255,.03);
  border:1px solid rgba(255,255,255,.07);
  border-radius:20px;
  padding:18px 16px;
  margin-bottom:4px;
}
.det-m-ring-row{display:flex;align-items:center;gap:16px;margin-bottom:18px;}
.det-m-ring-svg{flex-shrink:0;color:#fff;}
#det-m-ring-arc{
  transition:stroke-dasharray 0.78s cubic-bezier(0.33,1,0.68,1);
}
.det-m-ring-info{flex:1;min-width:0;}
.det-m-ring-title{font-size:11px;font-weight:600;color:rgba(255,255,255,.38);text-transform:uppercase;letter-spacing:.06em;margin-bottom:6px;}
.det-m-ring-stats{display:flex;flex-direction:column;gap:6px;}
.det-m-ring-stat{display:flex;align-items:baseline;gap:5px;flex-wrap:wrap;}
.det-m-ring-stat span:first-child{font-size:18px;font-weight:600;color:#fff;}
.det-m-ring-stat-lbl{font-size:11px;color:rgba(255,255,255,.38);}
.det-m-row-lbl{display:flex;justify-content:space-between;font-size:10px;margin-bottom:6px;}
.det-m-row-lbl-left{font-weight:600;color:rgba(255,255,255,.38);text-transform:uppercase;letter-spacing:.06em;}
.det-m-row-lbl-right{color:rgba(255,255,255,.28);}
.det-m-season-dots{display:flex;gap:4px;margin-bottom:14px;}
.det-m-s-dot{
  height:5px;flex:1;border-radius:3px;background:rgba(255,255,255,.08);
  transition:background-color 0.42s cubic-bezier(0.33,1,0.68,1),background 0.42s cubic-bezier(0.33,1,0.68,1);
  transition-delay:calc(var(--dot-i,0) * 32ms);
}
.det-m-s-dot--done{background:#2065d4;}
.det-m-s-dot--cur{background:#85B7EB;}
.det-m-seg-wrap{margin-bottom:14px;}
.det-m-seg-track{display:flex;gap:2px;height:7px;}
.det-m-seg-cell{
  flex:1;border-radius:2px;background:rgba(255,255,255,.08);
  transition:background-color 0.48s cubic-bezier(0.33,1,0.68,1),background 0.48s cubic-bezier(0.33,1,0.68,1);
  transition-delay:calc(var(--seg-i,0) * 18ms);
}
.det-m-seg-cell--done{background:#2065d4;}
.det-m-seg-cell--cur{background:#85B7EB;}
@media (prefers-reduced-motion:reduce){
  #det-m-ring-arc,
  #det-d-ring-arc,
  .det-m-s-dot,
  .det-m-seg-cell,
  .det-d-s-dot,
  .det-d-seg-cell{
    transition-duration:0.01ms !important;
    transition-delay:0ms !important;
  }
}
.det-m-sel-row{display:flex;gap:8px;margin-bottom:16px;}
.det-m-sel-item{flex:1;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:14px;padding:12px 14px;}
.det-m-sel-lbl{font-size:10px;font-weight:600;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.05em;margin-bottom:8px;}
.det-m-sel-ctrl{display:flex;align-items:center;justify-content:space-between;gap:6px;}
.det-m-sel-btn{
  width:30px;height:30px;border-radius:9px;border:1px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.06);display:flex;align-items:center;justify-content:center;
  font-size:17px;color:rgba(255,255,255,.75);cursor:pointer;font-family:inherit;flex-shrink:0;
  transition:background .15s,border-color .15s;
}
.det-m-sel-btn:hover{background:rgba(255,255,255,.1);}
.det-m-sel-val{font-size:24px;font-weight:600;color:#fff;min-width:32px;text-align:center;}
.det-m-sel-total{font-size:10px;color:rgba(255,255,255,.28);text-align:center;margin-top:5px;}
.det-m-btn-row{display:flex;gap:8px;}
.det-m-btn-season{
  flex:1;padding:11px;border-radius:14px;background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);color:rgba(255,255,255,.85);font-size:13px;font-weight:600;
  cursor:pointer;font-family:inherit;transition:background .15s,border-color .15s;
}
.det-m-btn-season:hover{background:rgba(255,255,255,.1);}
.det-m-btn-all{
  flex:1;padding:11px;border-radius:14px;background:#2065d4;border:none;color:#fff;
  font-size:13px;font-weight:600;cursor:pointer;font-family:inherit;
  transition:opacity .15s,filter .15s;
}
.det-m-btn-all:hover{filter:brightness(1.06);}
.det-m-btn-all:disabled,.det-m-btn-season:disabled{opacity:.45;cursor:default;}
body.theme-light .det-progress-m-card{background:rgba(0,0,0,.03);border-color:rgba(0,0,0,.08);}
body.theme-light .det-m-ring-title,
body.theme-light .det-m-row-lbl-left{color:rgba(0,0,0,.45);}
body.theme-light .det-m-ring-stat-lbl,
body.theme-light .det-m-row-lbl-right{color:rgba(0,0,0,.4);}
body.theme-light .det-m-ring-stat span:first-child{color:#111;}
body.theme-light .det-m-sel-item{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.06);}
body.theme-light .det-m-sel-lbl,
body.theme-light .det-m-sel-total{color:rgba(0,0,0,.4);}
body.theme-light .det-m-sel-btn{border-color:rgba(0,0,0,.12);background:#fff;color:#333;}
body.theme-light .det-m-s-dot{background:rgba(0,0,0,.08);}
body.theme-light .det-m-seg-cell{background:rgba(0,0,0,.08);}
body.theme-light .det-m-btn-season{background:rgba(0,0,0,.04);border-color:rgba(0,0,0,.1);color:#111;}
.comment-wrap{margin-top:8px;}
.comment-textarea{width:100%;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 14px;font-size:13px;color:#fff;font-family:inherit;outline:none;resize:vertical;min-height:72px;transition:border-color .2s;}
.comment-textarea:focus{border-color:rgba(255,255,255,.18);}
.comment-textarea::placeholder{color:rgba(255,255,255,.2);}
.comment-save-btn{margin-top:8px;padding:8px 18px;border-radius:var(--border-radius-icons);font-size:12px;font-weight:500;font-family:inherit;cursor:pointer;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.08);color:rgba(255,255,255,.5);transition:all .2s;}
.comment-save-btn:hover{background:rgba(255,255,255,.12);color:#fff;}
.det-tag-grid{display:flex;flex-wrap:wrap;gap:5px;margin-bottom:2px;}
.det-platform-row{display:flex;gap:6px;flex-wrap:wrap;}
.det-platform-btn{padding:5px 11px;border-radius:7px;font-size:10px;font-weight:600;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.4);cursor:pointer;transition:all .15s;font-family:inherit;}
.det-platform-btn:hover{background:rgba(255,255,255,.09);color:rgba(255,255,255,.7);}
.det-platform-btn.active{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.18);color:rgba(255,255,255,.85);}
/* Выпадающий выбор платформы на карточке (JS создаёт .det-plat-picker) */
.det-plat-picker{
  position:fixed;z-index:600;box-sizing:border-box;
  background:#111;border:1px solid rgba(255,255,255,.12);border-radius:14px;padding:10px;
  display:flex;flex-wrap:wrap;gap:5px;width:220px;max-width:calc(100vw - 24px);
  box-shadow:0 -4px 32px rgba(0,0,0,.7);
  /* Анимация: появляется снизу вверх */
  opacity:0;
  transform:translateY(10px) scale(0.97);
  transform-origin: 0% 100%;
  transition: opacity .22s ease, transform .25s cubic-bezier(0.22,1,0.36,1);
  pointer-events:none;
}
.det-plat-picker--open {
  opacity:1;
  transform:translateY(0) scale(1);
  pointer-events:auto;
}
.det-plat-picker .det-platform-btn.det-plat-picker-clear{
  width:100%;text-align:left;font-size:11px;color:rgba(255,255,255,.35);
}
.det-divider{height:1px;background:rgba(255,255,255,.06);margin:14px 0;}
.det-trailer-btn{display:inline-flex;align-items:center;gap:8px;padding:9px 16px;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:10px;font-size:13px;color:rgba(255,255,255,.55);cursor:pointer;font-family:inherit;transition:all .2s;}
.det-trailer-btn:hover{background:rgba(255,255,255,.1);color:#fff;}
.det-play-icon{width:22px;height:22px;background:rgba(255,255,255,.1);border-radius:50%;display:flex;align-items:center;justify-content:center;flex-shrink:0;}

.add-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.7);z-index:800;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .22s,visibility .22s;backdrop-filter:blur(10px);}
.add-modal-overlay.open{opacity:1;pointer-events:all;visibility:visible;}
.add-modal{background:#0e0e0e;border:1px solid rgba(255,255,255,.1);border-radius:22px;width:100%;max-width:380px;padding:28px 26px;position:relative;transform:translateY(10px);transition:transform .22s;}
.add-modal-overlay.open .add-modal{transform:translateY(0);}
.add-modal-close{position:absolute;top:14px;right:14px;background:rgba(255,255,255,.07);border:none;border-radius:50%;width:26px;height:26px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,.4);}
.add-modal-title{font-size:16px;font-weight:600;color:#fff;margin-bottom:4px;}
.add-modal-sub{font-size:13px;color:rgba(255,255,255,.3);margin-bottom:22px;}
.add-field{display:flex;flex-direction:column;gap:6px;margin-bottom:14px;}
.add-label{font-size:12px;font-weight:500;color:rgba(255,255,255,.3);}
.add-input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:10px 13px;font-size:14px;color:#fff;font-family:inherit;outline:none;width:100%;}
.add-input::placeholder{color:rgba(255,255,255,.2);}
textarea.add-input{resize:vertical;min-height:80px;}
.add-row{display:flex;gap:10px;}

.trailer-modal-overlay{position:fixed;inset:0;background:rgba(0,0,0,.85);z-index:850;display:flex;align-items:center;justify-content:center;opacity:0;pointer-events:none;visibility:hidden;transition:opacity .25s,visibility .25s;backdrop-filter:blur(4px);}
.trailer-modal-overlay.open{opacity:1;pointer-events:all;visibility:visible;}
.trailer-modal{width:100%;max-width:800px;aspect-ratio:16/9;position:relative;border-radius:16px;overflow:hidden;}
.trailer-modal iframe{width:100%;height:100%;border:none;}
.trailer-modal-close{position:absolute;top:12px;right:12px;background:rgba(0,0,0,.6);border:1px solid rgba(255,255,255,.2);border-radius:50%;width:32px;height:32px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:#fff;font-size:20px;z-index:10;transition:all .2s;font-weight:300;}
.trailer-modal-close:hover{background:rgba(0,0,0,.8);border-color:rgba(255,255,255,.4);}

.add-row .add-field{flex:1;}
.add-confirm{margin-top:6px;padding:12px;border-radius:10px;background:rgba(255,255,255,.88);color:#000;font-size:14px;font-weight:600;font-family:inherit;border:none;cursor:pointer;width:100%;}


/* Gallery view */
.gallery-sort-bar{
  padding:12px 28px 0;
  border-bottom:0.5px solid rgba(255,255,255,.06);
}
.gallery-sort-bar-inner{
  display:flex;align-items:center;flex-wrap:wrap;gap:8px;
  padding-bottom:12px;
}
.gallery-sort-bar .lv2-sort-pill{font-size:12px;padding:6px 14px;}
.gallery-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:12px;padding:20px 28px 60px;}
.gallery-card-meta{
  margin-top:8px;padding:0 2px;min-height:32px;
  display:flex;flex-direction:column;gap:2px;pointer-events:none;
}
.gallery-card-title-line{
  font-size:12px;font-weight:600;line-height:1.25;color:var(--color-text-primary,rgba(255,255,255,.92));
  display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;
}
.gallery-card-year-line{font-size:11px;color:rgba(255,255,255,.35);}
body.theme-light .gallery-card-year-line{color:var(--text45,rgba(0,0,0,.45));}
@media(max-width:768px){
  .gallery-sort-bar{padding:10px 14px 0;}
  .gallery-sort-bar-inner{padding-bottom:10px;}
}
.gallery-card{display:flex;flex-direction:column;cursor:pointer;transition:transform .2s;}
.gallery-card:hover{transform:scale(1.03);}
.gallery-poster{width:100%;aspect-ratio:2/3;border-radius:12px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.07);}
.gallery-poster-bg{position:absolute;inset:0;}
.gallery-poster-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,transparent 55%);}
.gallery-poster-title{position:absolute;bottom:0;left:0;right:0;padding:6px 8px;font-size:11px;font-weight:600;color:#fff;line-height:1.3;}
.gallery-poster-rating{position:absolute;top:6px;right:6px;font-size:10px;font-weight:700;background:rgba(20,20,20,.8);color:#FFD60A;border:1px solid rgba(255,214,10,.2);border-radius:5px;padding:1px 5px;}
.gallery-poster-fav{position:absolute;top:6px;left:6px;font-size:12px;}
.gallery-poster-pct{position:absolute;bottom:0;left:0;right:0;height:3px;background:rgba(255,255,255,.1);}
.gallery-poster-pct-fill{height:100%;background:linear-gradient(90deg,#30d158,#34c759);transition:width .3s;}
@media(max-width:768px){.gallery-grid{padding:14px 14px 40px;grid-template-columns:repeat(3,1fr);}}

/* Календарь: на широком экране — подпись и список; компактный блок (число+точки) скрыт */
.cal-day-inner--compact {
  display: none;
  grid-template-rows: 1fr auto;
  grid-template-columns: minmax(0, 1fr);
  justify-items: center;
  align-items: center;
  flex: 1;
  min-height: 0;
  width: 100%;
  max-width: 100%;
  min-width: 0;
  box-sizing: border-box;
  padding: 4px;
}
.cal-day-inner--wide { display: contents; }
.cal-day-num {
  grid-row: 1;
  align-self: center;
  justify-self: center;
  font-size: 17px;
  font-weight: 700;
  color: rgba(255, 255, 255, 0.95);
  line-height: 1;
  text-align: center;
}
.cal-cell-dots {
  grid-row: 2;
  align-self: end;
  justify-self: center;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 3px;
  max-width: 100%;
  min-width: 0;
  min-height: 12px;
  width: 100%;
  box-sizing: border-box;
}
.cal-cell-dots:empty {
  display: none;
  min-height: 0;
}
.cal-cell-dots .cal-cell-dot {
  width: 4px;
  height: 4px;
  border-radius: 50%;
  flex-shrink: 0;
}
.cal-cell-dots .cal-cell-dot.heart { background: #e0055a; }
.cal-cell-dots .cal-cell-dot.bell { background: #ffd60a; }
.cal-cell-dots .cal-cell-dot.normal { background: #5ac8fa; }
@media (min-width: 769px) {
  .cal-day-inner--compact { display: none !important; }
  .cal-day-inner--wide { display: contents; }
  .cal-day { min-height: 104px; }
  .cal-calendar .cal-dow-cell { font-size: 12px; min-height: 36px; }
  .cal-calendar .cal-day { padding: 11px; }
  .cal-calendar .cal-day-label { font-size: 13px; margin-bottom: 9px; }
  .cal-calendar .cal-event-name { font-size: 14px; }
  .cal-calendar .cal-more { font-size: 13px; }
  /* Таблицы списков: реальные ячейки = выравнивание с thead (без одной ячейки colspan + grid) */
  #movies-page table,
  #series-page table,
  #watchlist-page table {
    table-layout: fixed;
    width: 100%;
  }
  #movies-page table thead th:nth-child(2),
  #movies-page table tbody td:nth-child(2),
  #series-page table thead th:nth-child(2),
  #series-page table tbody td:nth-child(2),
  #watchlist-page table thead th:nth-child(2),
  #watchlist-page table tbody td:nth-child(2) {
    width: auto;
    min-width: 0;
  }
  #movies-page table tbody td.col-title,
  #series-page table tbody td.col-title,
  #watchlist-page table tbody td.col-title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  /* Иначе колонка названия съедает всю ширину — огромная «чёрная» полоса до жанра/метаданных */
  #movies-page #movies-table-view thead th:nth-child(2),
  #movies-page #movies-table-view tbody td:nth-child(2) {
    width: 40%;
    max-width: 400px;
  }
  #series-page #series-table-view thead th:nth-child(2),
  #series-page #series-table-view tbody td:nth-child(2) {
    width: 40%;
    max-width: 400px;
  }
  #watchlist-page #watchlist-table-view thead th:nth-child(2),
  #watchlist-page #watchlist-table-view tbody td:nth-child(2) {
    width: 40%;
    max-width: 400px;
  }
  /* Колонка тегов: одна и та же ширина на Фильмы / Сериалы / Позже (меньше колонок — без растягивания тегов) */
  #movies-page #movies-table-body-scroll col.col-tags,
  #series-page #series-table-body-scroll col.col-tags,
  #watchlist-page #watchlist-table-body-scroll col.col-tags {
    width: 280px !important;
    min-width: 280px;
    max-width: 280px !important;
  }
  #movies-page #movies-table-body-scroll td.tag-cell,
  #series-page #series-table-body-scroll td.tag-cell,
  #watchlist-page #watchlist-table-body-scroll td.tag-cell {
    max-width: 400px;
  }
  /* Десктоп: заголовки по левому краю колонок */
  #movies-page #movies-table-body-scroll thead th,
  #series-page #series-table-body-scroll thead th,
  #watchlist-page #watchlist-table-body-scroll thead th {
    text-align: center;
    vertical-align: middle;
  }
  #movies-page #movies-table-body-scroll thead th:nth-child(1),
  #series-page #series-table-body-scroll thead th:nth-child(1),
  #watchlist-page #watchlist-table-body-scroll thead th:nth-child(1) {
    text-align: center;
    padding-left: 6px;
    padding-right: 6px;
    box-sizing: border-box;
  }
  #movies-page #movies-table-body-scroll thead th:nth-child(7),
  #series-page #series-table-body-scroll thead th:nth-child(7) {
    text-align: center;
  }
  #watchlist-page #watchlist-table-body-scroll thead th:nth-child(6) {
    text-align: center;
  }
  #movies-page #movies-table-body-scroll thead th.col-platform,
  #series-page #series-table-body-scroll thead th.col-platform,
  #watchlist-page #watchlist-table-body-scroll thead th.col-platform {
    text-align: center;
  }
  /* Один скролл на thead+tbody — gutter по-прежнему стабилизирует полосу */
  #movies-page .list-table-body-scroll,
  #series-page .list-table-body-scroll,
  #watchlist-page .list-table-body-scroll {
    scrollbar-gutter: stable;
  }
}

@media(max-width:768px){
  .features{padding:0 16px 60px;}
  .features-grid{grid-template-columns:1fr;gap:8px;}
  /* Бургер в хедере: показываем на мобилке, ставим в правый верхний угол */
  .list-header-burger.menu-avatar-trigger {
    display: flex !important;
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    align-self: center;
    margin-left: 0;
    box-sizing: border-box;
    width: var(--list-header-icon);
    height: var(--list-header-icon);
    min-width: var(--list-header-icon);
    min-height: var(--list-header-icon);
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  /* 3) Колокольчик слева — скрываем везде на мобилке */
  .list-header-bell {
    display: none !important;
  }
  .detail-header .list-header-bell {
    display: none !important;
  }
  /* Перебиваем display:flex !important от notif-bell-list-mobile */
  .notif-bell-list-mobile.list-header-bell {
    display: none !important;
  }
  /* Панель слева не вылезает за экран */
  #notif-panel.notif-panel--from-left {
    max-width: calc(100vw - 28px);
  }
  .list-header {
    position: sticky;
    top: 0;
    z-index: 100;
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    grid-template-rows: auto;
    row-gap: 0;
    column-gap: 10px;
    align-items: center;
    height: auto;
    min-height: 0;
    /* PWA / Safari: не залезать под статус-бар */
    padding: calc(10px + env(safe-area-inset-top, 0px)) max(14px, env(safe-area-inset-right, 0px)) 12px max(14px, env(safe-area-inset-left, 0px));
  }
  .list-header .back-btn{display:none!important;}
  .list-header .list-logo {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
    margin: 0;
    /* Увеличенный логотип с обводкой-пилюлей */
    font-size: 15px;
    letter-spacing: .3em;
    color: rgba(255,255,255,.55);
    padding: 6px 16px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 100px;
    background: rgba(255,255,255,.04);
  }
  body.theme-light .list-header .list-logo {
    color: rgba(0,0,0,.5);
    border-color: rgba(0,0,0,.15);
    background: rgba(0,0,0,.04);
  }
  .list-header .list-header-tabs {
    grid-column: 1 / -1;
    grid-row: 2;
    position: static;
    transform: none;
    left: auto;
    width: 100%;
    max-width: 100%;
    justify-content: center;
    box-sizing: border-box;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex-shrink: 0;
  }
  .list-header .list-header-tabs::-webkit-scrollbar {
    display: none;
  }
  /* Без разделителя между табами и строкой поиска */
  #movies-page .list-header,
  #series-page .list-header,
  #watchlist-page .list-header,
  #calendar-page .list-header {
    border-bottom: none;
  }
  #calendar-page.active ~ .vs-desktop-top-actions #notif-bell-btn {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
  }
  /* Карточка: фикс. колокол убран — в тулбаре под шапкой, как у списков */
  #detail-page.active ~ .vs-desktop-top-actions #notif-bell-btn {
    display: none !important;
    visibility: hidden;
    pointer-events: none;
  }
  .vs-desktop-top-actions{
    top: calc(7px + env(safe-area-inset-top, 0px));
    right: max(16px, env(safe-area-inset-right, 0px));
  }
  .detail-header {
    display: grid;
    grid-template-columns: 1fr auto 1fr;
    grid-template-rows: auto auto;
    row-gap: 10px;
    column-gap: 10px;
    align-items: center;
    height: auto;
    min-height: 0;
    position: fixed;
    top: 0;
    left: 0;
    right: 0;
    z-index: 100;
    padding: calc(env(safe-area-inset-top, 0px) + 10px) max(14px, env(safe-area-inset-right, 0px)) 12px max(14px, env(safe-area-inset-left, 0px));
  }
  /* Скрываем отдельный тулбар с колокольчиком — он переехал в хедер */
  #detail-page .list-toolbar--mobile-notif-only {
    display: none !important;
  }
  .detail-header .back-btn{display:none!important;}
  /* Бургер на detail-header — та же позиция */
  .detail-header .list-header-burger.menu-avatar-trigger {
    display: flex !important;
    grid-column: 3;
    grid-row: 1;
    justify-self: end;
    align-self: center;
    box-sizing: border-box;
    width: var(--list-header-icon);
    height: var(--list-header-icon);
    min-width: var(--list-header-icon);
    min-height: var(--list-header-icon);
    border-radius: 50%;
    align-items: center;
    justify-content: center;
    overflow: hidden;
  }
  .detail-header .list-logo {
    grid-column: 2;
    grid-row: 1;
    justify-self: center;
    margin: 0;
    font-size: 15px;
    letter-spacing: .3em;
    color: rgba(255,255,255,.7);
    padding: 6px 16px;
    border: 1px solid rgba(255,255,255,.25);
    border-radius: 100px;
    background: rgba(255,255,255,.06);
  }
  .detail-header .list-header-tabs {
    grid-column: 1 / -1;
    grid-row: 2;
    position: static;
    transform: none;
    left: auto;
    width: 100%;
    max-width: 100%;
    justify-content: center;
    box-sizing: border-box;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    flex-shrink: 0;
  }
  .detail-header .list-header-tabs::-webkit-scrollbar {
    display: none;
  }
  .table-container,.detail-content{padding:14px 14px 40px;}
  .detail-content {
    padding-top: 0;
    padding-left: 0;
    padding-right: 0;
    padding-bottom: calc(90px + env(safe-area-inset-bottom, 0px));
  }
  /* Постер уходит под хедер — хедер поверх с прозрачным фоном */
  .detail-header {
    background: transparent !important;
    backdrop-filter: none !important;
    border-bottom: none !important;
  }
  .list-toolbar .page-search{max-width:100%;}
  /* Поиск слишком высоко: на мобильных шапка двухрядная + safe-area,
     поэтому сдвигаем toolbar-host вниз, чтобы он начинался под хедером */
  .list-toolbar-host {
    position: relative;
    top: auto;
    left: auto;
    right: auto;
    width: 100%;
    padding: 10px 14px;
    background: var(--bac);
    backdrop-filter: blur(20px);
    -webkit-backdrop-filter: blur(20px);
    z-index: 10;
    border-bottom: 1px solid rgba(255,255,255,.06);
    box-sizing: border-box;
  }
  /* Высота экрана без схлопывания при клавиатуре (100vh на iOS даёт прыжок списков) */
  body{min-height:100vh;min-height:100lvh;}
  .page.active{min-height:100vh;min-height:100lvh;}
  /* Поиск в потоке под шапкой + колокол отдельно справа, одна высота со строкой поиска */
  #movies-page .list-toolbar,
  #series-page .list-toolbar,
  #watchlist-page .list-toolbar,
  #detail-page .list-toolbar--mobile-notif-only{
    position:relative;
    z-index:1;
    margin:0 0 10px 0;
    padding:0;
    max-width:100%;
    background:transparent;
    border:none;
    display:flex;
    flex-direction:row;
    align-items:stretch;
    flex-wrap:nowrap;
    gap:8px;
  }
  #movies-page .list-toolbar .list-toolbar-search-bar,
  #series-page .list-toolbar .list-toolbar-search-bar,
  #watchlist-page .list-toolbar .list-toolbar-search-bar{
    flex:1 1 auto;
    min-width:0;
    width:auto;
    align-self:stretch;
  }
  #detail-page .list-toolbar--mobile-notif-only .list-toolbar-notif-spacer{
    flex:1 1 auto;
    min-width:0;
    min-height:var(--list-header-icon);
    align-self:stretch;
  }
  #movies-page .notif-bell-list-mobile,
  #series-page .notif-bell-list-mobile,
  #watchlist-page .notif-bell-list-mobile,
  #detail-page .notif-bell-list-mobile {
    display: flex !important;
    align-self: center;
    width: var(--list-header-icon);
    min-width: var(--list-header-icon);
    max-width: var(--list-header-icon);
    height: var(--list-header-icon);
    min-height: var(--list-header-icon);
    max-height: var(--list-header-icon);
    border-radius: 50%;
    background: rgba(255,255,255,.07);
    border: 1px solid rgba(255,255,255,.1);
    flex-shrink: 0;
    padding: 0;
    box-sizing: border-box;
  }
  /* Вертикальный скролл только в #*-table-body-scroll (как на десктопе). Иначе скролл цепляется к этому блоку,
     tbody с tr{display:block} даёт битый scrollHeight в портрете; в ландшафте >768 это правило не действует — «как десктоп». */
  #movies-page .list-page-stack.table-container,
  #series-page .list-page-stack.table-container,
  #watchlist-page .list-page-stack.table-container{
    overscroll-behavior:contain;
    top: 0;
    position: relative;
    padding-top: 0;
    flex: 1 1 0;
    min-height: 0;
    overflow-y: hidden;
    overflow-x: hidden;
  }
  /* Переставляем порядок: постер → название → кнопки (мобильный блок внутри detail-info) */
  .detail-hero {
    display:flex;
    flex-direction:column;
    align-items:stretch;
    gap:0;
    margin-bottom:0;
    position:relative;
  }
  /* detail-left — только постер на мобилке */
  .detail-left {
    display: flex;
    flex-direction: column;
  }
  /* Постер — во всю ширину */
  .detail-left .detail-poster {
    align-self:stretch;
    width:100%;
    max-width:100%;
    height:calc(100vw * 1.35);
    flex-shrink:0;
    border-radius:0;
    border:none;
    position:relative;
    margin:0;
    overflow:hidden;
  }
  /* Кнопки: десктоп-блок скрыт, мобильный показан */
  .det-action-row-wrap--desktop { display: none !important; }
  .det-action-row-wrap--mobile  {
    display: block;
    margin: 8px 0 16px;
  }
  /* Название сразу после постера, наезжает на градиент */
  .detail-info {
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:0 16px 12px;
    margin-top:-80px;
    position:relative;
    z-index:2;
  }
  .detail-info .detail-meta-line {
    text-align:center;
    margin-bottom:6px;
  }
  .detail-info .detail-title {
    text-align:center;
    font-size:26px;
    font-weight:700;
    letter-spacing:.15em;
    text-transform:uppercase;
    margin-bottom:10px;
  }
  .detail-info .detail-genre-tags {
    justify-content:center;
    margin-bottom:20px;
  }
  /* Кнопки — внутри detail-info, между тегами и сюжетом */
  .det-action-row-wrap {
    margin: 12px 0 16px;
  }
  .det-main-btn          { order:unset; margin:0; }
  .det-action-row        { order:unset; margin:0; display:flex; align-items:center; gap:10px; }
  .det-sec-row           { order:unset; margin:0; }
  .det-bell-btn          { order:unset; margin:0; }
  .det-platform-heart-row{ order:unset; margin:0; }
  .det-tags-bar          { order:unset; margin:0; }

  /* Один ряд на мобилке: [●коллекция] [●позже] [●колокол] [трейлер] [●сердце] — по центру */
  .det-action-row {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    justify-content: center;
    gap: 8px;
    height: 48px;
    width: 100%;
  }
  /* Убираем обёртку — её дети становятся частью ряда */
  .det-action-row .det-sec-row-inner {
    display: contents;
  }

  /* Круглая кнопка — В коллекции / В список */
  .det-main-btn-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: none;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all .2s;
    font-family: inherit;
  }
  .det-main-btn-circle.in-list { background:#2065d4; color:#fff; }
  .det-main-btn-circle.in-list:hover { background:#2a75e8; }
  .det-main-btn-circle.add { background:rgba(255,255,255,.9); color:#000; }
  .det-main-btn-circle.add:hover { background:#fff; }

  /* Трейлер — растягивается, но не жадничает */
  .det-action-row .det-sec-btn--trailer,
  .det-action-row .det-sec-btn--no-trailer,
  .det-action-row .det-sec-btn--add-trailer {
    flex: 1 1 0;
    min-width: 0;
    max-width: 160px;
    height: 100%;
    border-radius: 20px;
    font-size: 12px;
    padding: 0 12px;
  }

  /* Позже — круг */
  .det-later-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.6);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all .2s;
    font-family: inherit;
  }
  .det-later-circle.in-list {
    border-color: rgba(10,132,255,.45);
    color: #0A84FF;
    background: rgba(10,132,255,.12);
  }
  .det-later-circle:hover { background:rgba(255,255,255,.14); }

  /* Колокольчик — круг как остальные */
  .det-bell-circle {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.07);
    color: rgba(255,255,255,.6);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-shrink: 0;
    transition: all .2s;
    font-family: inherit;
  }
  .det-bell-circle.notify-on {
    border-color: rgba(255,214,10,.5);
    color: #FFD60A;
    background: rgba(255,214,10,.1);
  }
  .det-bell-circle:hover { background:rgba(255,255,255,.12); }

  /* Сердечко — такой же круг как остальные */
  .det-heart-btn.det-circle-btn {
    width: 48px;
    height: 48px;
    border-radius: 50%;
    border: 1px solid rgba(255,255,255,.15);
    background: rgba(255,255,255,.07);
    flex-shrink: 0;
    padding: 0;
  }
  .detail-left .detail-poster img,
  .detail-left .detail-poster .poster-img {
    width:100%;
    height:100%;
    object-fit:cover;
    object-position:center top;
    border-radius:0;
    position:relative;
    z-index:0;
  }
  /* Градиент поверх постера — плавный переход в фон страницы (конец #000 = --bac, без шва с #111) */
  .detail-left .detail-poster::after {
    content:'';
    position:absolute;
    bottom:0; left:0; right:0;
    height:62%;
    z-index:1;
    background: linear-gradient(to bottom,
      rgba(0,0,0,0) 0%,
      rgba(0,0,0,0.12) 28%,
      rgba(0,0,0,0.45) 55%,
      rgba(0,0,0,0.82) 78%,
      #000 100%);
    pointer-events:none;
  }
  body.theme-light .detail-left .detail-poster::after {
    background: linear-gradient(to bottom,
      rgba(242,242,247,0) 0%,
      rgba(242,242,247,0.2) 30%,
      rgba(242,242,247,0.75) 72%,
      var(--bg) 100%);
  }
  /* Кнопки и контент — без отступа от постера, перекрывают градиент */
  .detail-left > *:not(.detail-poster) {
    padding-left:16px;
    padding-right:16px;
  }
  .detail-info{
    width:100%;
    max-width:100%;
    min-width:0;
    box-sizing:border-box;
    padding:0 16px 12px;
    margin-top:-90px;
    position:relative;
    z-index:2;
  }
  /* Название — по центру, как логотип */
  .detail-info .detail-meta-line {
    text-align:center;
    margin-bottom:6px;
    color:rgba(255,255,255,0.3);
  }
  .detail-info .detail-title {
    text-align:center;
    font-size:26px;
    font-weight:100;
    letter-spacing:.15em;
    text-transform:uppercase;
    margin-bottom:10px;
    color:rgba(255,255,255,0.1);
  }
  .detail-info .detail-genre-tags {
    justify-content:center;
    margin-bottom:20px;
  }
  /* Деталь: убираем «Длительность» между «Дата выхода» и «Теги» (фильмы и сериалы) */
  #detail-page .det-info-card--runtime {
    display: none !important;
  }
  #detail-page .det-info-cards {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }
  .det-update-date-row{flex-direction:column;align-items:flex-start;gap:8px;}
  .di-pill.s-open{width:calc(100vw - 32px);}
  .results-grid{grid-template-columns:repeat(3,1fr);gap:12px;}
  
  /* ФИЛЬМЫ: ❤️ — название — платформа — год (жанр, теги, удалить — свайп) */
  #movies-page #movies-table-view table th:nth-child(3),
  #movies-page #movies-table-view table td:nth-child(3),
  #movies-page #movies-table-view table th:nth-child(6),
  #movies-page #movies-table-view table td:nth-child(6),
  #movies-page #movies-table-view table th:nth-child(7),
  #movies-page #movies-table-view table td:nth-child(7) {
    display: none;
  }
  #movies-page .list-swipe-front--movies .list-swipe-col:nth-child(3),
  #movies-page .list-swipe-front--movies .list-swipe-col:nth-child(6),
  #movies-page .list-swipe-front--movies .list-swipe-col:nth-child(7) {
    display: none;
  }
  
  /* СЕРИАЛЫ: ❤️ - Название - Прогресс - Статус - Платформа (скрываем теги, удалить) */
  #series-page #series-table-view table th:nth-child(6),
  #series-page #series-table-view table td:nth-child(6),
  #series-page #series-table-view table th:nth-child(7),
  #series-page #series-table-view table td:nth-child(7) {
    display: none;
  }
  #series-page .list-swipe-front--series .list-swipe-col:nth-child(6),
  #series-page .list-swipe-front--series .list-swipe-col:nth-child(7) {
    display: none;
  }

  /* «Позже»: 🔔 — название — платформа — год; теги и корзина только через свайп */
  #watchlist-page #watchlist-table-view table th:nth-child(5),
  #watchlist-page #watchlist-table-view table td:nth-child(5),
  #watchlist-page #watchlist-table-view table th:nth-child(6),
  #watchlist-page #watchlist-table-view table td:nth-child(6) {
    display: none;
  }
  #watchlist-page .list-swipe-front--watchlist .list-swipe-col:nth-child(5),
  #watchlist-page .list-swipe-front--watchlist .list-swipe-col:nth-child(6) {
    display: none;
  }

  /* Шапка и тело — две таблицы с одним colgroup; без grid на tr (иначе ширины не совпадают с tbody и «плывёт») */
  #movies-page #movies-table-view thead tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  #series-page #series-table-view thead tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  #watchlist-page #watchlist-table-view thead tr {
    border-bottom: 1px solid rgba(255, 255, 255, 0.06);
  }
  #movies-page #movies-table-view thead th,
  #series-page #series-table-view thead th,
  #watchlist-page #watchlist-table-view thead th {
    padding: 8px 5px;
    font-size: 9px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255, 255, 255, 0.38);
    text-align: left;
    line-height: 1.25;
    min-width: 0;
    align-self: auto;
    vertical-align: middle;
  }
  #movies-page #movies-table-view thead th:nth-child(1),
  #series-page #series-table-view thead th:nth-child(1),
  #watchlist-page #watchlist-table-view thead th:nth-child(1) {
    text-align: center;
    padding-left: 2px;
    padding-right: 2px;
  }
  /* Сериалы: короткие заголовки «Прог.» / «Стат.» — table-cell, не flex (иначе ломается выравнивание с tbody) */
  #series-page #series-table-view thead th:nth-child(3),
  #series-page #series-table-view thead th:nth-child(5) {
    font-size: 0;
    line-height: 0;
    text-align: center;
    vertical-align: middle;
    padding-left: 4px;
    padding-right: 4px;
  }
  #series-page #series-table-view thead th:nth-child(3)::before {
    content: 'Прог.';
    font-size: 9px;
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: inherit;
  }
  #series-page #series-table-view thead th:nth-child(5)::before {
    content: 'Стат.';
    font-size: 9px;
    line-height: 1.25;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: inherit;
  }
  #series-page #series-table-view thead th:nth-child(3).sort-asc::after,
  #series-page #series-table-view thead th:nth-child(3).sort-desc::after,
  #series-page #series-table-view thead th:nth-child(5).sort-asc::after,
  #series-page #series-table-view thead th:nth-child(5).sort-desc::after {
    font-size: 9px;
    line-height: 1.25;
    color: inherit;
  }
  body.theme-light #movies-page #movies-table-view thead tr,
  body.theme-light #series-page #series-table-view thead tr,
  body.theme-light #watchlist-page #watchlist-table-view thead tr {
    border-bottom-color: var(--border3);
  }
  body.theme-light #movies-page #movies-table-view thead th,
  body.theme-light #series-page #series-table-view thead th,
  body.theme-light #watchlist-page #watchlist-table-view thead th {
    color: var(--text35);
  }
  /* Одна таблица: colgroup + fixed */
  #movies-page #movies-table-body-scroll table.list-table-sync,
  #series-page #series-table-body-scroll table.list-table-sync,
  #watchlist-page #watchlist-table-body-scroll table.list-table-sync {
    width: 100%;
    max-width: 100%;
    table-layout: fixed;
  }
  #movies-page #movies-table-view thead th:nth-child(2),
  #series-page #series-table-view thead th:nth-child(2),
  #watchlist-page #watchlist-table-view thead th:nth-child(2) {
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  }
  /* td и div в свайпе: без display:-webkit-box — в WKWebView/Safari ломается таблица или grid-строка «Позже».
     Две строки названия — через max-height. */
  #movies-page #movies-table-view tbody td.col-title,
  #series-page #series-table-view tbody td.col-title,
  #watchlist-page #watchlist-table-view tbody td.col-title {
    min-width: 0;
    height: auto !important;
    vertical-align: top;
    white-space: normal;
    overflow: hidden;
    word-break: break-word;
    line-height: 1.28;
    max-height: calc(1.28em * 2 + 4px);
  }
  #movies-page .list-swipe-col.col-title,
  #series-page .list-swipe-col.col-title,
  #watchlist-page .list-swipe-col.col-title {
    min-width: 0;
    white-space: normal;
    overflow: hidden;
    word-break: break-word;
    line-height: 1.28;
    max-height: calc(1.28em * 2 + 4px);
    /* без -webkit-box: в WKWebView на «Позже» с 6 колонками и display:none на 5–6 ломалось авторазмещение grid */
  }
  #movies-page #movies-table-view tbody tr[data-item-id],
  #series-page #series-table-view tbody tr[data-item-id],
  #watchlist-page #watchlist-table-view tbody tr[data-item-id] {
    min-height: 58px;
  }
  /* Скрытые на мобиле th/td не убирают ширину из <col> — таблица становится шире портрета;
     visibility:collapse на <col> в iOS даёт сбои — display:none надёжнее */
  #movies-page #movies-table-view col:nth-child(3),
  #movies-page #movies-table-view col:nth-child(6),
  #movies-page #movies-table-view col:nth-child(7),
  #series-page #series-table-view col:nth-child(6),
  #series-page #series-table-view col:nth-child(7),
  #watchlist-page #watchlist-table-view col:nth-child(5),
  #watchlist-page #watchlist-table-view col:nth-child(6) {
    display: none !important;
  }
  /* colgroup: жёстко сужаем платформу (глобально 106px min-width — без этого колонка съедает название) */
  #movies-page #movies-table-view col.col-platform,
  #series-page #series-table-view col.col-platform,
  #watchlist-page #watchlist-table-view col.col-platform {
    width: 48px !important;
    max-width: 52px !important;
  }
  #series-page #series-table-view col:nth-child(3) {
    width: 52px !important;
    max-width: 56px !important;
  }
  #movies-page #movies-table-view thead th.col-platform,
  #movies-page #movies-table-view tbody td.col-platform,
  #series-page #series-table-view thead th.col-platform,
  #series-page #series-table-view tbody td.col-platform,
  #watchlist-page #watchlist-table-view thead th.col-platform,
  #watchlist-page #watchlist-table-view tbody td.col-platform {
    min-width: 0 !important;
    width: 48px !important;
    max-width: 52px !important;
    box-sizing: border-box;
    padding-left: 2px !important;
    padding-right: 2px !important;
  }
  /* Фильмы: платформа ближе к году */
  #movies-page #movies-table-view thead th.col-platform,
  #movies-page #movies-table-view tbody td.col-platform {
    padding-right: 0 !important;
  }
  #movies-page #movies-table-view thead th:nth-child(5),
  #movies-page #movies-table-view tbody td.col-year {
    padding-left: 4px !important;
  }
  #movies-page .list-table-hscroll,
  #series-page .list-table-hscroll,
  #watchlist-page .list-table-hscroll {
    overflow-x: hidden;
    max-width: 100%;
  }
  #movies-page #movies-table-body-scroll,
  #series-page #series-table-body-scroll,
  #watchlist-page #watchlist-table-body-scroll {
    overflow-x: hidden;
    overflow-y: scroll;
    -webkit-overflow-scrolling: touch;
    min-height: 0;
  }
  /* Свайп: было tr{display:block} — при большом числе строк iOS давал неверный scrollHeight; table-row/table-cell сохраняет нормальную высоту tbody */
  #movies-page #movies-table-view tbody tr:has(.list-swipe-cell),
  #series-page #series-table-view tbody tr:has(.list-swipe-cell),
  #watchlist-page #watchlist-table-view tbody tr:has(.list-swipe-cell) {
    display: table-row;
    width: 100%;
    max-width: 100%;
    box-sizing: border-box;
  }
  #movies-page #movies-table-view tbody tr:has(.list-swipe-cell) > td,
  #series-page #series-table-view tbody tr:has(.list-swipe-cell) > td,
  #watchlist-page #watchlist-table-view tbody tr:has(.list-swipe-cell) > td {
    display: table-cell;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    vertical-align: middle;
  }
  #movies-page .list-swipe-track,
  #series-page .list-swipe-track,
  #watchlist-page .list-swipe-track,
  #movies-page .list-swipe-front,
  #series-page .list-swipe-front,
  #watchlist-page .list-swipe-front {
    max-width: 100%;
    box-sizing: border-box;
  }
  #movies-page .list-swipe-front--movies {
    grid-template-columns: 28px minmax(0, 1fr) 48px 50px;
  }
  #series-page .list-swipe-front--series {
    grid-template-columns: 28px minmax(0, 1fr) 52px 48px 48px;
  }
  /* «Позже» + свайп: не grid на фронте — в WKWebView grid + display:none на 5–6 колонках ломали раскладку (виден только 🔔). Flex устойчив к скрытым соседям. */
  #watchlist-page .list-swipe-front--watchlist {
    display: flex !important;
    flex-direction: row;
    align-items: center;
    gap: 0;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    box-sizing: border-box;
    grid-template-columns: unset !important;
    grid-template-rows: unset !important;
    grid-template-areas: none !important;
  }
  #watchlist-page .list-swipe-front--watchlist .list-swipe-col.col-heart {
    flex: 0 0 28px;
    min-width: 28px;
    max-width: 28px;
  }
  #watchlist-page .list-swipe-front--watchlist .list-swipe-col.col-title {
    flex: 1 1 0%;
    min-width: 0;
  }
  #watchlist-page .list-swipe-front--watchlist .list-swipe-col.col-platform {
    flex: 0 0 48px;
    max-width: 48px;
    min-width: 0;
  }
  #watchlist-page .list-swipe-front--watchlist .list-swipe-col.col-year {
    flex: 0 0 55px;
    max-width: 55px;
    min-width: 0;
  }
  #movies-page .list-swipe-col,
  #series-page .list-swipe-col,
  #watchlist-page .list-swipe-col {
    padding: 8px 5px;
    font-size: 13px;
  }
  /* Фильмы (свайп): платформа вплотную к году */
  #movies-page .list-swipe-col.col-platform {
    padding-right: 0 !important;
  }
  #movies-page .list-swipe-col.col-year {
    padding-left: 4px !important;
  }
  /* Узкие колонки: по центру, без вылезания за сетку */
  #movies-page .list-swipe-col.col-platform,
  #movies-page .list-swipe-col.col-year,
  #series-page .list-swipe-col.col-progress,
  #series-page .list-swipe-col.col-platform,
  #series-page .list-swipe-col.col-status,
  #watchlist-page .list-swipe-col.col-platform,
  #watchlist-page .list-swipe-col.col-year {
    display: flex;
    align-items: center;
    justify-content: center;
    text-align: center;
    min-width: 0;
    overflow: hidden;
  }
  #movies-page .list-swipe-col.col-platform,
  #series-page .list-swipe-col.col-platform,
  #watchlist-page .list-swipe-col.col-platform {
    padding-left: 4px;
    padding-right: 4px;
  }
  #movies-page .list-swipe-col.col-platform .platform-badge,
  #series-page .list-swipe-col.col-platform .platform-badge,
  #watchlist-page .list-swipe-col.col-platform .platform-badge {
    min-width: 0;
  }
  #movies-page #movies-table-view thead th.col-platform,
  #movies-page #movies-table-view thead th:nth-child(5),
  #series-page #series-table-view thead th.col-platform,
  #watchlist-page #watchlist-table-view thead th.col-platform,
  #watchlist-page #watchlist-table-view thead th:nth-child(4) {
    text-align: center;
  }
  #movies-page #movies-table-view tbody tr:not(:has(.list-swipe-cell)) > td[colspan],
  #series-page #series-table-view tbody tr:not(:has(.list-swipe-cell)) > td[colspan],
  #watchlist-page #watchlist-table-view tbody tr:not(:has(.list-swipe-cell)) > td[colspan] {
    display: block;
    width: 100%;
    box-sizing: border-box;
  }

  /* Календарь: компактные плитки — только число и точки (по сериалам) */
  .cal-dow-row {
    gap: 3px;
    margin-bottom: 6px;
    width: 100%;
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .cal-days-area {
    gap: 3px;
    width: 100%;
    grid-template-columns: repeat(7, minmax(0, 1fr));
  }
  .cal-day-inner--compact { display: grid !important; }
  .cal-day-inner--wide { display: none !important; }
  .cal-pad {
    aspect-ratio: 1;
    height: auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    border-radius: 10px;
  }
  .cal-day {
    aspect-ratio: 1;
    height: auto;
    min-height: 0;
    min-width: 0;
    width: 100%;
    max-width: 100%;
    padding: 4px;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    border-radius: 10px;
  }
  .cal-day-inner--compact {
    padding: 3px;
  }
  .cal-day-num {
    font-size: 15px;
    font-weight: 700;
    text-align: center;
  }
  .cal-day.today .cal-day-num { font-weight: 800; color: #fff; }
  .cal-cell-dots { gap: 3px; row-gap: 3px; min-height: 12px; }
  .cal-cell-dots.cal-cell-dots--many { gap: 2px; }
  .cal-cell-dots .cal-cell-dot { width: 4px; height: 4px; }
  .cal-cell-dots.cal-cell-dots--many .cal-cell-dot { width: 3px; height: 3px; }
  #calendar-page .cal-page-body {
    padding: 14px 14px 40px !important;
  }
}
/* Gallery view */
.view-toggle{display:flex;gap:4px;margin-left:auto;} @keyframes rec-spin{to{transform:rotate(360deg)}} .rec-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.1);border-radius:var(--border-radius-icons);padding:6px 12px;font-size:12px;color:rgba(255,255,255,.55);cursor:pointer;font-family:inherit;white-space:nowrap;transition:all .2s;margin-right:4px;display:inline-flex;align-items:center;gap:6px;} .rec-btn:hover{background:rgba(255,255,255,.1);color:#fff;} .rec-btn:disabled{cursor:default;opacity:.8;} .rec-spinner{width:12px;height:12px;border:1.5px solid rgba(255,255,255,.2);border-top-color:rgba(255,255,255,.7);border-radius:50%;animation:rec-spin .7s linear infinite;display:inline-block;flex-shrink:0;} .cal-calendar{width:100%;max-width:100%;} .cal-dow-row{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:8px;} .cal-dow-cell{font-size:9px;font-weight:600;color:rgba(255,255,255,.32);text-align:center;letter-spacing:.02em;padding:0 2px 2px;display:flex;flex-direction:column;align-items:center;gap:5px;justify-content:flex-end;min-height:30px;} .cal-dow-cell::before{content:'';width:55%;max-width:24px;height:3px;border-radius:2px;background:rgba(255,255,255,.12);} .cal-days-area{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;} .cal-pad{min-height:0;} .cal-day{background:#1c1c1e;border:1px solid rgba(255,255,255,.08);border-radius:12px;padding:8px;cursor:pointer;transition:background .15s,border-color .15s,box-shadow .15s;position:relative;display:flex;flex-direction:column;box-sizing:border-box;} .cal-day:hover{background:#2a2a2d;} .cal-day.today{border-color:rgba(255,255,255,.32);box-shadow:0 0 0 1px rgba(255,255,255,.08);} .cal-day.has-events{background:#252528;} .cal-day-label{font-size:10px;color:rgba(255,255,255,.3);margin-bottom:6px;line-height:1.2;} .cal-day.today .cal-day-label{color:rgba(255,255,255,.75);font-weight:600;} .cal-event{display:flex;align-items:flex-start;gap:6px;margin-bottom:4px;min-width:0;} .cal-event-dot{width:5px;height:5px;border-radius:50%;flex-shrink:0;margin-top:4px;} .cal-event-dot.heart{background:#e0055a;} .cal-event-dot.bell{background:#FFD60A;} .cal-event-dot.normal{background:rgba(255,255,255,.3);} .cal-event-name{font-size:11px;color:rgba(255,255,255,.55);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.35;min-width:0;} .cal-more{font-size:10px;color:rgba(255,255,255,.25);margin-top:2px;}
.cal-bg-load-btn{display:inline-flex;align-items:center;gap:8px;padding:8px 12px;border:1px solid rgba(255,255,255,.15);border-radius:10px;background:rgba(255,255,255,.05);color:#fff;font-size:12px;font-family:inherit;cursor:pointer;transition:background .15s,border-color .15s,opacity .15s;white-space:nowrap;}
.cal-bg-load-btn:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.22);}
.cal-bg-load-btn:active{opacity:.92;}
.cal-bg-load-icon{font-size:15px;line-height:1;opacity:.95;}
#cal-bg-overlay{z-index:850;}
.cal-bg-overlay{
  position:fixed;inset:0;z-index:850;display:none;
  background:rgba(0,0,0,.72);align-items:center;justify-content:center;
  backdrop-filter:blur(8px);
}
.cal-bg-modal{
  background:#111;border:1px solid rgba(255,255,255,.1);border-radius:20px;width:100%;max-width:440px;margin:20px;
  max-height:78vh;display:flex;flex-direction:column;box-shadow:0 24px 80px rgba(0,0,0,.55);
}
.cal-bg-modal-head{
  display:flex;align-items:center;justify-content:space-between;padding:20px 20px 12px;
  border-bottom:1px solid rgba(255,255,255,.06);flex-shrink:0;
}
.cal-bg-modal-title{font-size:17px;font-weight:700;color:#fff;display:flex;align-items:center;gap:10px;line-height:1.2;}
.cal-bg-modal-emoji{font-size:18px;line-height:1;}
.cal-bg-modal-close{
  background:rgba(255,255,255,.08);border:none;border-radius:10px;width:36px;height:36px;
  color:rgba(255,255,255,.55);cursor:pointer;font-size:16px;line-height:1;transition:background .15s,color .15s;
}
.cal-bg-modal-close:hover{background:rgba(255,255,255,.12);color:#fff;}
.cal-bg-modal-hint{margin:0;padding:0 20px 16px;font-size:13px;font-weight:500;color:rgba(255,255,255,.48);line-height:1.5;}
.cal-bg-modal-content{overflow-y:auto;padding:0 20px 22px;flex:1;-webkit-overflow-scrolling:touch;}
.cal-bg-empty{text-align:center;padding:32px 18px;font-size:14px;font-weight:500;color:rgba(255,255,255,.38);line-height:1.55;}
.cal-bg-row-poster{width:44px;height:62px;object-fit:cover;border-radius:var(--border-radius-icons);flex-shrink:0;}
.cal-bg-row-poster-ph{width:44px;height:62px;background:#1a1a1a;border-radius:var(--border-radius-icons);flex-shrink:0;}
.cal-bg-row-body{flex:1;min-width:0;}
.cal-bg-row-title{font-size:15px;font-weight:600;color:#fff;margin-bottom:5px;display:flex;align-items:center;gap:6px;flex-wrap:wrap;line-height:1.3;}
.cal-bg-row-meta{font-size:12px;font-weight:500;color:rgba(255,255,255,.45);line-height:1.4;}
.cal-bg-row-type{color:rgba(255,255,255,.32);}
.cal-bg-row-bell{color:#FFD60A;font-size:16px;flex-shrink:0;line-height:1;}
.cal-bg-row{display:flex;align-items:center;gap:14px;padding:14px 0;border-bottom:1px solid rgba(255,255,255,.06);cursor:pointer;transition:background .12s;}
.cal-bg-row:hover{background:rgba(255,255,255,.03);}
.cal-bg-row:last-child{border-bottom:none;}
/* Календарь: крупнее и контрастнее */
.cal-calendar .cal-dow-row{margin-bottom:10px;gap:7px;}
.cal-calendar .cal-dow-cell{font-size:11px;font-weight:700;color:rgba(255,255,255,.46);min-height:34px;gap:6px;}
.cal-calendar .cal-dow-cell::before{width:58%;max-width:28px;height:4px;background:rgba(255,214,10,1);}
.cal-calendar .cal-days-area{gap:7px;}
.cal-calendar .cal-day-label{font-size:12px;font-weight:600;color:rgba(255,255,255,.42);margin-bottom:8px;line-height:1.25;}
.cal-calendar .cal-day.today .cal-day-label{color:rgba(255,255,255,.9);}
.cal-calendar .cal-event{gap:8px;margin-bottom:6px;}
.cal-calendar .cal-event-dot{width:6px;height:6px;margin-top:5px;}
.cal-calendar .cal-event-name{font-size:13px;font-weight:600;color:rgba(255,255,255,.72);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;line-height:1.4;min-width:0;}
.cal-calendar .cal-more{font-size:12px;font-weight:600;color:rgba(255,255,255,.38);margin-top:4px;}
.cal-section-title{font-size:15px;font-weight:600;color:rgba(255,255,255,.88);margin:0 0 6px;}
.cal-section-hint{font-size:12px;color:rgba(255,255,255,.38);margin:0 0 14px;line-height:1.45;}
.cal-apple-sync{margin-bottom:20px;padding:16px 18px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(255,255,255,.03);}
.cal-apple-sync-actions{display:flex;flex-wrap:wrap;gap:10px;margin-top:12px;}
.cal-apple-sync-btn{font-family:inherit;font-size:13px;font-weight:600;padding:10px 16px;border-radius:12px;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.1);color:rgba(255,255,255,.92);cursor:pointer;transition:background .15s,border-color .15s;}
.cal-apple-sync-btn:hover{background:rgba(255,255,255,.14);border-color:rgba(255,255,255,.2);}
.cal-apple-sync-btn--secondary{background:transparent;color:rgba(255,255,255,.55);font-weight:500;}
.cal-apple-sync-btn--secondary:hover{color:rgba(255,255,255,.85);background:rgba(255,255,255,.05);}
.cal-apple-sync-status{font-size:11px;color:rgba(255,255,255,.35);margin:12px 0 0;line-height:1.45;max-width:520px;}
.cal-apple-sync--menu{margin-bottom:0;padding:12px 10px;max-width:100%;box-sizing:border-box;}
.cal-apple-sync--menu .cal-section-title{font-size:13px;}
.cal-apple-sync--menu .cal-section-hint{font-size:11px;margin-bottom:0;line-height:1.4;}
.cal-apple-sync--menu .cal-apple-sync-actions{margin-top:10px;}
.cal-apple-sync--menu .cal-apple-sync-btn{font-size:12px;padding:9px 12px;}
body.theme-light .cal-apple-sync{background:rgba(0,0,0,.03);border-color:rgba(0,0,0,.1);}
body.theme-light .cal-apple-sync-btn{background:rgba(0,0,0,.06);color:var(--text);border-color:rgba(0,0,0,.12);}
body.theme-light .cal-apple-sync-btn:hover{background:rgba(0,0,0,.09);}
body.theme-light .cal-apple-sync-btn--secondary{color:rgba(0,0,0,.5);}
body.theme-light .cal-apple-sync-status{color:rgba(0,0,0,.45);}
.cal-platform-row{display:flex;flex-wrap:wrap;gap:16px;justify-content:flex-start;align-items:center;}
.cal-plat-brand{width:64px;height:64px;border-radius:16px;border:none;cursor:pointer;display:flex;align-items:center;justify-content:center;padding:8px;flex-shrink:0;font-family:system-ui,-apple-system,sans-serif;box-shadow:0 4px 18px rgba(0,0,0,.45);transition:transform .2s ease,box-shadow .2s;outline:none;-webkit-tap-highlight-color:transparent;}
.cal-plat-brand:hover{transform:scale(1.08);box-shadow:0 8px 24px rgba(0,0,0,.5);}
.cal-plat-brand:active{transform:scale(1.03);}
.cal-plat-brand.cal-plat-brand--active{transform:scale(1.06);box-shadow:0 0 0 1px rgba(255,255,255,0.45),0 6px 22px rgba(255,255,255,0.45);}
/* Кнопка с картинкой — убираем padding, картинка заполняет всё */
.cal-plat-brand:has(.cal-plat-img){padding:0;overflow:hidden;}
.cal-plat-img{width:100%;height:100%;object-fit:cover;display:block;border-radius:inherit;}
/* Фоны кнопок — нейтральные, логотип сам несёт цвет бренда */
.cal-plat-netflix{background:#000;}
.cal-plat-hbo{background:#000;}
.cal-plat-disney{background:#000;}
.cal-plat-prime{background:#000;}
.cal-plat-apple{background:#000;}
.cal-plat-hulu{background:#000;}
.cal-plat-amazon{background:#131921;}
.cal-plat-marvel{background:#000;}
.cal-plat-dc{background:#000;}
.cal-plat-peacock{background:#000;}
.cal-plat-pixar{background:#000;}
.cal-plat-paramount{background:#000;}
.cal-plat-crunchyroll{background:#000;}
.cal-plat-amediateka{background:#000;}
.cal-platform-ribbon{display:none;margin-top:18px;border-radius:16px;border:1px solid rgba(255,255,255,.1);background:rgba(0,0,0,.35);overflow:hidden;animation:calRibbonIn .35s ease;}
.cal-platform-ribbon.is-open{display:block;}
@keyframes calRibbonIn{from{opacity:0;transform:translateY(-6px);}to{opacity:1;transform:translateY(0);}}
.cal-platform-ribbon-head{display:flex;align-items:center;justify-content:space-between;padding:12px 14px;border-bottom:1px solid rgba(255,255,255,.08);}
.cal-platform-ribbon-title{font-size:14px;font-weight:600;color:rgba(255,255,255,.92);}
.cal-platform-ribbon-close{background:rgba(255,255,255,.08);border:none;border-radius:var(--border-radius-icons);width:32px;height:32px;color:rgba(255,255,255,.55);cursor:pointer;font-size:15px;line-height:1;font-family:inherit;}
.cal-platform-ribbon-close:hover{background:rgba(255,255,255,.12);color:#fff;}
.cal-platform-ribbon-status{padding:8px 14px;font-size:12px;color:rgba(255,255,255,.4);min-height:0;}
.cal-platform-ribbon-scroll{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;padding:12px 14px 20px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;overscroll-behavior-x:contain;}
.cal-platform-ribbon-scroll::-webkit-scrollbar{height:6px;}
.cal-platform-ribbon-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px;}
.cal-ribbon-card{flex:0 0 112px;width:112px;scroll-snap-align:start;cursor:pointer;transition:transform .15s;}
.cal-ribbon-card:hover{transform:translateY(-3px);}
.cal-ribbon-poster{width:112px;height:168px;border-radius:10px;overflow:hidden;background:#1a1a1a;border:1px solid rgba(255,255,255,.08);margin-bottom:8px;}
.cal-ribbon-poster img{width:100%;height:100%;object-fit:cover;display:block;}
.cal-ribbon-title{font-size:11px;font-weight:500;color:rgba(255,255,255,.82);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cal-ribbon-meta{font-size:9px;color:rgba(255,255,255,.35);margin-top:3px;}
.cal-past-premieres-section{margin-top:24px;}
.cal-past-premieres-scroll{display:flex;gap:14px;overflow-x:auto;overflow-y:hidden;padding:4px 2px 18px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:thin;overscroll-behavior-x:contain;}
.cal-past-premieres-scroll::-webkit-scrollbar{height:6px;}
.cal-past-premieres-scroll::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px;}
.cal-pp-card{flex:0 0 112px;width:112px;scroll-snap-align:start;cursor:pointer;position:relative;transition:transform .15s;}
.cal-pp-card:hover{transform:translateY(-2px);}
.cal-pp-remove{
  position:absolute;top:6px;right:6px;width:24px;height:24px;border-radius:50%;border:none;padding:0;margin:0;
  display:flex;align-items:center;justify-content:center;font-size:15px;line-height:1;font-weight:600;
  color:rgba(255,255,255,.95);background:rgba(0,0,0,.5);cursor:pointer;z-index:2;backdrop-filter:blur(5px);font-family:inherit;
}
.cal-pp-remove:hover{background:rgba(200,45,45,.9);color:#fff;}
.cal-pp-poster{width:112px;height:168px;border-radius:10px;overflow:hidden;background:#1a1a1a;border:1px solid rgba(255,255,255,.08);margin-bottom:8px;}
.cal-pp-poster img{width:100%;height:100%;object-fit:cover;display:block;}
.cal-pp-title{font-size:11px;font-weight:600;color:rgba(255,255,255,.88);line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;}
.cal-pp-meta{font-size:9px;color:rgba(255,255,255,.38);margin-top:3px;}
/* Скелетон «Прошлые премьеры» */
.cal-pp-card--skeleton{pointer-events:none;cursor:default;flex-shrink:0;}
.cal-pp-card--skeleton:hover{transform:none;}
.cal-pp-sk-poster{
  background:linear-gradient(90deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.14) 45%,rgba(255,255,255,.05) 90%);
  background-size:200% 100%;
  animation:cal-pp-sk-shimmer 1.15s ease-in-out infinite;
}
.cal-pp-sk-line{
  border-radius:5px;
  background:linear-gradient(90deg,rgba(255,255,255,.05) 0%,rgba(255,255,255,.12) 45%,rgba(255,255,255,.05) 90%);
  background-size:200% 100%;
  animation:cal-pp-sk-shimmer 1.15s ease-in-out infinite;
}
.cal-pp-sk-line--title{width:92%;height:10px;margin-bottom:5px;}
.cal-pp-sk-line--meta{width:58%;height:7px;}
@keyframes cal-pp-sk-shimmer{
  0%{background-position:200% 0;}
  100%{background-position:-200% 0;}
}
@media (prefers-reduced-motion:reduce){
  .cal-pp-sk-poster,.cal-pp-sk-line{animation:none;}
}
body.theme-light .cal-pp-sk-poster,
body.theme-light .cal-pp-sk-line{
  background:linear-gradient(90deg,rgba(0,0,0,.05) 0%,rgba(0,0,0,.1) 45%,rgba(0,0,0,.05) 90%);
  background-size:200% 100%;
}
.cal-youtube-section{margin-top:36px;margin-bottom:0;overflow:visible;position:relative;}
.cal-yt-header-row{display:flex;align-items:center;gap:10px 14px;margin-bottom:8px;min-width:0;width:100%;flex-wrap:nowrap;}
.cal-yt-header-identity{display:flex;align-items:center;gap:8px;flex-shrink:0;min-width:0;max-width:min(220px,42vw);}
.cal-yt-header-identity .cal-section-title{margin-bottom:0!important;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;}
.cal-yt-channels-host{flex:1;min-width:0;display:flex;align-items:center;position:relative;overflow:visible;}
.cal-youtube-section .cal-section-title{margin-bottom:4px;}
.cal-youtube-status{font-size:12px;color:rgba(255,255,255,.38);margin:0 0 8px;}
.cal-youtube-scroll{display:flex;gap:16px;overflow-x:auto;overflow-y:hidden;padding:4px 2px 24px;scroll-snap-type:x proximity;-webkit-overflow-scrolling:touch;scrollbar-width:none;overscroll-behavior-x:contain;}
.cal-youtube-scroll::-webkit-scrollbar{display:none;}
.cal-youtube-scroll.cal-youtube-scroll--msg{flex-direction:column;align-items:stretch;justify-content:center;overflow-x:hidden;overflow-y:visible;min-height:108px;padding:12px 4px 20px;gap:0;}
.cal-yt-inline-msg{display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;gap:12px;padding:8px 6px;max-width:420px;margin:0 auto;}
.cal-yt-inline-msg-text{font-size:14px;line-height:1.45;color:rgba(255,255,255,.42);margin:0;}
.cal-yt-retry-btn{padding:8px 18px;border-radius:12px;border:0.5px solid rgba(255,255,255,.14);background:rgba(32,101,212,.25);color:rgba(255,255,255,.92);font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;}
.cal-yt-retry-btn:hover{background:rgba(32,101,212,.4);}
body.theme-light .cal-yt-inline-msg-text{color:var(--text45);}
body.theme-light .cal-yt-retry-btn{background:rgba(32,101,212,.2);border-color:var(--border2);color:var(--text);}
.home-empty-search{grid-column:1/-1;font-size:14px;line-height:1.5;color:rgba(255,255,255,.38);padding:16px 12px 8px;text-align:center;max-width:360px;margin:0 auto;}
body.theme-light .home-empty-search{color:var(--text45);}
.list-search-empty{text-align:center;padding:36px 16px!important;font-size:14px;line-height:1.45;color:rgba(255,255,255,.38)!important;}
body.theme-light .list-search-empty{color:var(--text45)!important;}
.cal-pp-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:20px 8px 8px;min-height:72px;}
.cal-pp-empty-text{font-size:13px;line-height:1.45;color:rgba(255,255,255,.38);margin:0;text-align:center;max-width:340px;}
.cal-pp-empty--error .cal-pp-empty-text{color:rgba(255,255,255,.45);}
.cal-pp-retry-btn{padding:7px 16px;border-radius:10px;border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:rgba(255,255,255,.85);font-size:12px;font-weight:500;cursor:pointer;font-family:inherit;}
.cal-pp-retry-btn:hover{background:rgba(255,255,255,.1);}
body.theme-light .cal-pp-empty-text{color:var(--text45);}
body.theme-light .cal-pp-retry-btn{background:var(--tag-bg);border-color:var(--border2);color:var(--text);}
.cal-yt-card{flex:0 0 260px;width:260px;scroll-snap-align:start;cursor:pointer;transition:transform .18s;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.07);border-radius:16px;overflow:hidden;}
.cal-yt-card:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.14);}
.cal-yt-thumb{width:100%;aspect-ratio:16/9;background:#1a1a1a;position:relative;overflow:hidden;}
.cal-yt-thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .3s;}
.cal-yt-card:hover .cal-yt-thumb img{transform:scale(1.04);}
/* Кнопка play — всегда видна, крупнее при наведении */
.cal-yt-play{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background:rgba(0,0,0,.28);}
.cal-yt-play-btn{width:48px;height:48px;border-radius:50%;background:rgba(220,0,0,.92);display:flex;align-items:center;justify-content:center;box-shadow:0 4px 16px rgba(0,0,0,.5);transition:transform .18s,background .18s;}
.cal-yt-card:hover .cal-yt-play-btn{transform:scale(1.12);background:rgba(255,0,0,1);}
.cal-yt-play-btn svg{width:18px;height:18px;fill:#fff;margin-left:3px;}
.cal-yt-body{padding:12px 14px 14px;}
.cal-yt-title{font-size:13px;font-weight:600;color:rgba(255,255,255,.9);line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;margin-bottom:6px;}
.cal-yt-meta{font-size:11px;color:rgba(255,255,255,.35);display:flex;align-items:center;gap:5px;}
.cal-yt-meta-dot{width:10px;height:7px;background:#ff0000;border-radius:2px;flex-shrink:0;}
/* Светлая тема */
body.theme-light .cal-youtube-status{color:var(--text45);}
body.theme-light .cal-yt-card{background:var(--bg2);border-color:var(--border2);}
body.theme-light .cal-yt-title{color:var(--text);}
body.theme-light .cal-yt-meta{color:var(--text45);}
body.theme-light .cal-yt-thumb{background:#e0e0e0;}
.cal-yt-channel-badge{display:inline-flex;align-items:center;gap:5px;font-size:10px;font-weight:600;color:rgba(255,255,255,.4);letter-spacing:.04em;text-transform:uppercase;}
.cal-yt-channel-badge svg{width:14px;height:10px;fill:#ff0000;}
/* Скелет */
.cal-yt-card--sk{pointer-events:none;}
.cal-yt-sk-line{background:rgba(255,255,255,.08);}
.sk-pulse-btn{opacity:.4;}
@keyframes sk-yt-pulse{0%,100%{opacity:.35}50%{opacity:.7}}
.sk-pulse{animation:sk-yt-pulse 1.5s ease-in-out infinite;}
/* Секция каналов — компактная полоска + модалка */
.cal-yt-ch-section{margin-top:18px;padding-top:14px;border-top:1px solid rgba(255,255,255,.06);overflow:visible;position:relative;}
.cal-yt-ch-section--inline{margin-top:0!important;padding-top:0!important;border-top:none!important;}
.cal-yt-ch-section--inline .cal-yt-ch-bar{width:100%;min-width:0;position:relative;overflow:visible;}
.cal-yt-ch-bar{display:flex;align-items:center;gap:8px;position:relative;overflow:visible;}
.cal-yt-ch-label{font-size:10px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:rgba(255,255,255,.32);flex-shrink:0;}
.cal-yt-pills{display:flex;gap:6px;overflow-x:auto;scrollbar-width:none;flex:1;min-width:0;padding:2px 0;}
.cal-yt-pills::-webkit-scrollbar{display:none;}
.cal-yt-pill{display:flex;align-items:center;gap:0;border-radius:100px;border:0.5px solid rgba(255,255,255,.1);background:rgba(255,255,255,.04);white-space:nowrap;flex-shrink:0;transition:background .15s,border-color .15s;min-width:0;}
.cal-yt-pill:hover{background:rgba(255,255,255,.08);border-color:rgba(255,255,255,.16);}
.cal-yt-pill.active{border-color:rgba(32,101,212,.45);background:rgba(32,101,212,.12);}
.cal-yt-pill-hit{display:flex;align-items:center;gap:7px;padding:6px 2px 6px 10px;min-width:0;flex:1;cursor:pointer;border-radius:100px;}
.cal-yt-pill-del{flex-shrink:0;width:26px;height:26px;margin:0 4px 0 0;padding:0;border:none;border-radius:50%;background:transparent;color:rgba(255,255,255,.45);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:color .15s,background .15s;}
.cal-yt-pill-del svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2.2;}
.cal-yt-pill-del:hover,.cal-yt-pill-del:focus-visible{color:#ff6b6b;background:rgba(255,80,80,.12);}
.cal-yt-pill-av{width:22px;height:22px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:#fff;flex-shrink:0;}
.cal-yt-pill-name{font-size:12px;font-weight:500;color:rgba(255,255,255,.58);}
.cal-yt-pill.active .cal-yt-pill-name{color:rgba(255,255,255,.95);}
.cal-yt-pill-check{width:14px;height:14px;border-radius:50%;background:#2065d4;display:none;align-items:center;justify-content:center;flex-shrink:0;}
.cal-yt-pill.active .cal-yt-pill-check{display:flex;}
.cal-yt-pill-check svg{width:8px;height:8px;stroke:#fff;fill:none;stroke-width:3;}
.cal-yt-add{width:32px;height:32px;border-radius:50%;border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;cursor:pointer;flex-shrink:0;transition:background .15s;position:relative;}
.cal-yt-add:hover{background:rgba(255,255,255,.1);}
.cal-yt-add svg{width:14px;height:14px;stroke:rgba(255,255,255,.45);fill:none;stroke-width:2;}
.cal-yt-modal-wrap{position:absolute;right:0;bottom:calc(100% + 8px);z-index:80;width:min(320px,calc(100vw - 32px));pointer-events:none;}
.cal-yt-ch-section--inline .cal-yt-modal-wrap{top:calc(100% + 8px);bottom:auto;left:auto;}
.cal-yt-modal{background:rgba(22,22,24,.98);border:0.5px solid rgba(255,255,255,.12);border-radius:18px;padding:18px 18px 14px;box-shadow:0 12px 40px rgba(0,0,0,.55);opacity:0;transform:translateY(8px) scale(.98);pointer-events:none;transition:opacity .2s,transform .2s;}
.cal-yt-modal.open{opacity:1;transform:translateY(0) scale(1);pointer-events:all;}
.cal-yt-modal-title{font-size:14px;font-weight:600;color:#fff;margin-bottom:4px;}
.cal-yt-modal-sub{font-size:11px;color:rgba(255,255,255,.35);margin-bottom:12px;line-height:1.4;}
.cal-yt-modal-input{width:100%;background:rgba(255,255,255,.07);border:0.5px solid rgba(255,255,255,.12);border-radius:12px;padding:10px 12px;font-size:13px;color:#fff;font-family:inherit;outline:none;margin-bottom:8px;transition:border-color .15s;box-sizing:border-box;}
.cal-yt-modal-input:focus{border-color:rgba(32,101,212,.45);}
.cal-yt-modal-input::placeholder{color:rgba(255,255,255,.25);}
.cal-yt-modal-addbtn{width:100%;padding:9px;border-radius:11px;background:#2065d4;border:none;color:#fff;font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;margin-bottom:12px;transition:background .15s;}
.cal-yt-modal-addbtn:hover{background:#2a75e8;}
.cal-yt-modal-divider{display:flex;align-items:center;gap:8px;margin:0 0 10px;}
.cal-yt-modal-div-line{flex:1;height:0.5px;background:rgba(255,255,255,.08);}
.cal-yt-modal-div-text{font-size:10px;color:rgba(255,255,255,.28);white-space:nowrap;}
.cal-yt-sug-list{display:flex;flex-direction:column;gap:4px;margin-bottom:12px;max-height:200px;overflow-y:auto;}
.cal-yt-sug{display:flex;align-items:center;gap:8px;padding:7px 9px;border-radius:10px;cursor:pointer;transition:background .12s;}
.cal-yt-sug:hover{background:rgba(255,255,255,.06);}
.cal-yt-sug-av{width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:10px;font-weight:600;color:#fff;flex-shrink:0;}
.cal-yt-sug-name{font-size:12px;font-weight:500;color:rgba(255,255,255,.75);}
.cal-yt-sug-desc{font-size:10px;color:rgba(255,255,255,.32);}
.cal-yt-sug-plus{margin-left:auto;width:20px;height:20px;border-radius:50%;border:0.5px solid rgba(255,255,255,.14);display:flex;align-items:center;justify-content:center;flex-shrink:0;}
.cal-yt-sug-plus svg{width:10px;height:10px;stroke:rgba(255,255,255,.45);fill:none;stroke-width:2;}
.cal-yt-modal-done{width:100%;padding:9px;border-radius:12px;background:rgba(255,255,255,.08);border:0.5px solid rgba(255,255,255,.1);color:rgba(255,255,255,.85);font-size:13px;font-weight:500;cursor:pointer;font-family:inherit;}
.cal-yt-modal-done:hover{background:rgba(255,255,255,.12);}
body.theme-light .cal-yt-ch-label{color:var(--text35);}
body.theme-light .cal-yt-pill{background:var(--tag-bg);border-color:var(--border2);}
body.theme-light .cal-yt-pill-name{color:var(--text45);}
body.theme-light .cal-yt-pill.active{background:rgba(32,101,212,.12);border-color:rgba(32,101,212,.35);}
body.theme-light .cal-yt-pill.active .cal-yt-pill-name{color:var(--text);}
body.theme-light .cal-yt-pill-del{color:var(--text45);}
body.theme-light .cal-yt-pill-del:hover,body.theme-light .cal-yt-pill-del:focus-visible{color:#c53030;background:rgba(220,60,60,.1);}
body.theme-light .cal-yt-add{background:var(--tag-bg);border-color:var(--border2);}
body.theme-light .cal-yt-modal{background:var(--bg2);border-color:var(--border2);}
body.theme-light .cal-yt-modal-title{color:var(--text);}
body.theme-light .cal-yt-modal-sub{color:var(--text45);}
body.theme-light .cal-yt-modal-input{background:rgba(0,0,0,.05);border-color:var(--border2);color:var(--text);}
body.theme-light .cal-yt-sug:hover{background:rgba(0,0,0,.05);}
body.theme-light .cal-yt-sug-name{color:var(--text);}
body.theme-light .cal-yt-sug-desc{color:var(--text45);}
body.theme-light .cal-yt-modal-done{background:var(--tag-bg);border-color:var(--border2);color:var(--text);}
body.theme-light .cal-pp-title{color:var(--text);}
body.theme-light .cal-pp-meta{color:var(--text45);}
body.theme-light .cal-pp-remove{background:rgba(255,255,255,.75);color:rgba(0,0,0,.65);}
body.theme-light .cal-pp-remove:hover{background:rgba(220,60,60,.95);color:#fff;}
body.theme-light .cal-platform-ribbon{background:rgba(255,255,255,.85);border-color:rgba(0,0,0,.1);}
body.theme-light .cal-platform-ribbon-head{border-bottom-color:rgba(0,0,0,.08);}
body.theme-light .cal-platform-ribbon-title{color:var(--text)!important;}
body.theme-light .cal-ribbon-title{color:var(--text)!important;}
body.theme-light .cal-section-title{color:var(--text)!important;}
body.theme-light .cal-section-hint{color:rgba(0,0,0,.45)!important;}
/* Скелетоны загрузки */
@keyframes sk-pulse{0%,100%{opacity:.38}50%{opacity:.72}}
.sk{display:block;background:rgba(255,255,255,.09);border-radius:6px;animation:sk-pulse 1.15s ease-in-out infinite}
body.theme-light .sk{background:rgba(0,0,0,.07)}
.sk-table-row td.sk-td{border-bottom:1px solid rgba(255,255,255,.06);padding:13px 10px;vertical-align:middle}
body.theme-light .sk-table-row td.sk-td{border-bottom-color:rgba(0,0,0,.06)}
.sk-td--ico{width:36px;text-align:center}
.sk-circle{width:20px;height:20px;border-radius:50%;margin:0 auto}
.sk-circle--sm{width:16px;height:16px}
.sk-line{height:11px;max-width:100%}
.sk-w-title{width:min(78%,240px)}
.sk-w-mid{width:min(55%,160px)}
.sk-w-sm{width:52px}
.sk-w-year{width:36px}
.sk-w-tags{width:76px}
.sk-w-pct{width:40px}
.cal-loading-skeleton{padding:8px 0 28px;max-width:520px;margin:0 auto}
.cal-sk-dow{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:6px;margin-bottom:10px;padding:0 4px}
.cal-sk-dow .sk{height:10px;width:100%;min-width:0;border-radius:4px}
.cal-sk-grid{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px}
.cal-sk-cell{aspect-ratio:1;border-radius:12px;min-height:44px}
.sk-ribbon-inner{display:flex;gap:10px;padding:10px 14px;overflow:hidden}
.sk-ribbon-card{flex:0 0 88px;width:88px;height:130px;border-radius:10px}
.cal-day-row-click{cursor:pointer;border-radius:10px;margin:0 -8px;padding-left:8px;padding-right:8px;transition:background .12s;}
.cal-day-row-click:hover{background:rgba(255,255,255,.04);}
.notif-row-click:hover{background:rgba(255,255,255,.06)!important;}
.view-btn{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:7px;width:30px;height:30px;display:flex;align-items:center;justify-content:center;cursor:pointer;color:rgba(255,255,255,.35);transform:scale(1);transition:background .2s,border-color .2s,color .15s,box-shadow .2s,transform .2s;}
.view-btn.active{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);color:#fff;}
.view-btn:hover:not(.active){background:rgba(255,255,255,.1);color:rgba(255,255,255,.85);}
.view-btn:hover{border-color:rgba(255,255,255,.4);box-shadow:0 0 18px rgba(255,255,255,.12);transform:scale(1.05);}
.gallery-card{cursor:pointer;transition:transform .2s;}
.gallery-card:hover{transform:scale(1.03);}
.gallery-poster{width:100%;aspect-ratio:2/3;border-radius:12px;position:relative;overflow:hidden;border:1px solid rgba(255,255,255,.07);}
.gallery-poster img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;}
.gallery-poster-bg{position:absolute;inset:0;}
.gallery-overlay{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.85) 0%,transparent 55%);}
.gallery-title{position:absolute;bottom:0;left:0;right:0;padding:6px 8px;font-size:11px;font-weight:600;color:#fff;line-height:1.3;}
.gallery-rating{position:absolute;top:6px;right:6px;font-size:10px;font-weight:700;background:rgba(20,20,20,.8);color:#FFD60A;border:1px solid rgba(255,214,10,.2);border-radius:5px;padding:1px 6px;}
.gallery-fav{position:absolute;top:6px;left:6px;font-size:11px;}
.gallery-pct{position:absolute;bottom:32px;left:8px;font-size:10px;color:rgba(255,255,255,.55);background:rgba(0,0,0,.5);border-radius:4px;padding:1px 5px;}

/* Галерея: карточки в духе Apple TV+ (постер + ранг + типографика снизу) */
.gallery-poster.gallery-poster--stream{
  border-radius:14px;
  border:none;
  box-shadow:0 6px 28px rgba(0,0,0,.4);
}
.gallery-poster--stream .gallery-poster-overlay{
  background:linear-gradient(to top,rgba(0,0,0,.93) 0%,rgba(0,0,0,.55) 32%,rgba(0,0,0,.12) 58%,transparent 78%);
  pointer-events:none;
}
.gallery-ordinal{
  position:absolute;top:2px;left:4px;z-index:3;
  font-size:clamp(28px,8.5vw,42px);font-weight:800;line-height:.88;
  color:rgba(255,255,255,.48);
  text-shadow:0 2px 20px rgba(0,0,0,.45);
  letter-spacing:-.03em;font-variant-numeric:tabular-nums;
  pointer-events:none;
}
.gallery-poster--stream .gallery-title{display:none;}
/* Сериалы: прогресс внизу постера (капсула, без цифр) */
.gallery-progress-wrap{
  position:absolute;left:10px;right:10px;bottom:10px;z-index:5;
  pointer-events:none;
}
.gallery-progress-track{
  height:6px;border-radius:999px;
  background:rgba(255,255,255,.16);
  overflow:hidden;
  box-shadow:inset 0 1px 2px rgba(0,0,0,.35);
}
.gallery-progress-fill{
  height:100%;min-width:0;border-radius:999px;
  background:linear-gradient(90deg,#1f6b32,#34c759);
  box-shadow:0 0 10px rgba(52,199,89,.35);
  transition:width .4s ease;
}
.gallery-poster--stream .gallery-rating{
  top:8px;right:8px;z-index:5;font-size:9px;padding:2px 6px;
  background:rgba(0,0,0,.5);border-color:rgba(255,255,255,.12);
}
.gallery-notify-corner{
  position:absolute;top:8px;left:8px;z-index:6;
  width:26px;height:26px;border-radius:50%;
  background:rgba(0,0,0,.58);
  border:0.5px solid rgba(255,214,10,.4);
  display:flex;align-items:center;justify-content:center;
  pointer-events:none;
  box-shadow:0 2px 10px rgba(0,0,0,.45);
}
.gallery-notify-corner svg{display:block;flex-shrink:0;}
.gallery-poster--stream .gallery-fav{
  top:44px;left:6px;right:auto;z-index:5;font-size:12px;
  filter:drop-shadow(0 1px 4px rgba(0,0,0,.6));
}
body.theme-light .gallery-poster.gallery-poster--stream{
  box-shadow:0 6px 24px rgba(0,0,0,.12);
}
body.theme-light .gallery-poster--stream .gallery-poster-overlay{
  background:linear-gradient(to top,rgba(0,0,0,.88) 0%,rgba(0,0,0,.4) 40%,transparent 75%);
}
body.theme-light .gallery-poster--stream .gallery-ordinal{color:rgba(255,255,255,.42);}

/* Десктоп: меню «⋯» на карточке галереи (фильмы/сериалы) */
.gallery-card-more-wrap{display:none;}
@media (min-width:769px){
  /* Явно восстанавливаем десктопный хедер чтобы не наследовать мобильный grid */
  .list-header {
    position: sticky;
    top: 0;
    z-index: 100;
    display: flex;
    align-items: center;
    gap: 14px;
    height: var(--list-header-h);
    padding: 0 28px;
  }
  .gallery-card-more-wrap{
    display:block;position:absolute;right:8px;bottom:26px;z-index:8;
    pointer-events:none;
  }
  .gallery-card-more-btn{
    pointer-events:auto;width:30px;height:30px;border-radius:50%;border:none;padding:0;
    background:rgba(0,0,0,.48);color:rgba(255,255,255,.92);font-size:18px;line-height:1;
    cursor:pointer;display:flex;align-items:center;justify-content:center;
    box-shadow:0 2px 10px rgba(0,0,0,.4);
    opacity:0;transition:opacity .2s,background .8s,transform .8s;
  }
  .gallery-card-more-btn:hover{background:rgba(0,0,0,.62);}
  .gallery-card:hover .gallery-card-more-wrap .gallery-card-more-btn,
  .gallery-card-more-wrap:focus-within .gallery-card-more-btn{
    opacity:1;
  }
  .gallery-card:has(.gallery-card-menu.open){
    position:relative;
    z-index:50;
  }
  .gallery-card:has(.gallery-card-menu.open) .gallery-poster.gallery-poster--stream{
    overflow:visible;
  }
  .gallery-card-menu{
    display:none;position:absolute;right:0;bottom:calc(100% + 6px);
    min-width:132px;padding:4px 0;border-radius:12px;
    background:#161616;border:1px solid rgba(255,255,255,.12);
    box-shadow:0 10px 32px rgba(0,0,0,.55);
    pointer-events:auto;
    transform-origin:bottom right;
    z-index:2;
  }
  .gallery-card-menu.open{
    display:block;
    animation:gallery-card-menu-in .26s cubic-bezier(.34,1.25,.64,1) both;
  }
  @keyframes gallery-card-menu-in{
    from{opacity:0;transform:translateY(12px) scale(.92);}
    to{opacity:1;transform:translateY(0) scale(1);}
  }
  .gallery-card-menu-del{
    width:100%;margin:0;padding:10px 14px;border:none;background:transparent;
    text-align:left;font-size:13px;font-weight:500;color:rgba(255,100,100,.95);
    cursor:pointer;font-family:inherit;
  }
  .gallery-card-menu-del:hover{background:rgba(255,80,80,.1);}
  .gallery-poster-stream-actions .gallery-card-more-wrap{
    display:block;
    position:static;
    right:auto;
    bottom:auto;
    pointer-events:auto;
  }
  .gallery-poster-stream-actions .gallery-card-more-btn{
    box-sizing:border-box;
    width:32px;height:32px;min-width:32px;min-height:32px;
    padding:0;border-radius:50%;
    border:0.5px solid rgba(255,255,255,.2);
    background:rgba(0,0,0,.72);
    color:#fff;
    font-size:15px;line-height:1;
    cursor:pointer;
    display:flex;align-items:center;justify-content:center;
    box-shadow:none;
    opacity:1;
    transition:background .15s,border-color .15s;
    font-family:inherit;
  }
  .gallery-poster-stream-actions .gallery-card-more-btn:hover{
    background:rgba(255,255,255,.7);
    border-color:rgba(255,255,255,.28);
  }
}
body.theme-light .gallery-card-menu{background:var(--card-bg,#f5f5f7);border-color:var(--border,#ddd);}
body.theme-light .gallery-card-menu-del{color:#c62828;}

/* Таблица фильмов/сериалов: ⋯ → «Добавить в…» + «Удалить» */
.collection-row-more-wrap{position:relative;display:inline-flex;justify-content:center;align-items:center;vertical-align:middle;}
.collection-row-more-wrap:has(.collection-row-menu.open){z-index:200;}
.col-delete:has(.collection-row-menu.open){overflow:visible;}
.collection-row-more-btn{
  width:28px;height:28px;padding:0;border:none;border-radius:50%;cursor:pointer;font-size:16px;line-height:1;
  background:rgba(255,255,255,.06);color:rgba(255,255,255,.75);font-family:inherit;
  display:inline-flex;align-items:center;justify-content:center;
}
.collection-row-more-btn:hover{background:rgba(255,255,255,.1);color:#fff;}
.collection-row-menu{
  display:none;position:absolute;right:0;top:calc(100% + 4px);min-width:168px;
  padding:4px 0;border-radius:12px;background:#1a1a1a;border:1px solid rgba(255,255,255,.12);
  box-shadow:0 12px 40px rgba(0,0,0,.55);z-index:420;
  overflow:visible;
}
.collection-row-menu.open{display:block;}
.collection-menu-item{
  display:block;width:100%;margin:0;padding:10px 14px;border:none;background:transparent;
  text-align:left;font-size:13px;font-weight:500;color:rgba(255,255,255,.88);font-family:inherit;cursor:pointer;
}
.collection-menu-item:hover{background:rgba(255,255,255,.06);}
.collection-menu-item--danger{color:rgba(255,100,100,.95);}
.collection-menu-item--danger:hover{background:rgba(255,80,80,.1);}
.collection-menu-item--sub{
  position:relative;
  z-index:0;
  padding:0;
}
.collection-menu-item--sub:is(:hover,.open){z-index:2;}
.collection-menu-sub-toggle{
  display:block;padding:10px 14px;font-size:13px;font-weight:500;color:rgba(255,255,255,.88);cursor:default;
}
.collection-menu-sub{
  display:none;position:relative;min-width:180px;max-width:min(320px,min(92vw,400px));max-height:min(50vh,280px);overflow-y:auto;
  padding:0;border-radius:12px;background:#121212;border:1px solid rgba(255,255,255,.14);
  box-shadow:0 16px 48px rgba(0,0,0,.65),0 0 0 1px rgba(0,0,0,.35);
}
/* Невидимый мост до курсор не «рвал» :hover в зазоре между «Добавить в…» и панелью */
.collection-menu-sub::before{
  content:'';
  position:absolute;right:-18px;top:0;bottom:0;width:18px;
}
.collection-menu-sub-empty{padding:12px 14px;font-size:12px;color:rgba(255,255,255,.4);line-height:1.35;}
.collection-menu-sub-item{
  display:flex;align-items:flex-start;gap:8px;box-sizing:border-box;width:100%;max-width:none;margin:0;padding:10px 14px;border:none;border-radius:0;
  background:transparent;text-align:left;font-size:13px;color:rgba(255,255,255,.85);font-family:inherit;cursor:pointer;
  -webkit-appearance:none;appearance:none;
}
.collection-menu-sub-item:first-child{border-top-left-radius:11px;border-top-right-radius:11px;}
.collection-menu-sub-item:last-child{border-bottom-left-radius:11px;border-bottom-right-radius:11px;}
.collection-menu-sub-item-txt{
  flex:1;min-width:0;text-align:left;
  white-space:normal;word-break:break-word;overflow-wrap:anywhere;line-height:1.35;
}
.collection-menu-sub-item-check{
  flex-shrink:0;width:1.25em;text-align:right;font-size:14px;font-weight:700;color:#30d158;
  transition:opacity .12s ease;
  padding-top:2px;
}
.collection-menu-sub-item-check::before{content:none;}
.collection-menu-sub-item--in .collection-menu-sub-item-check::before{
  content:'✓';
}
.collection-menu-sub-item:hover{background:rgba(255,255,255,.08);}
@media (hover:hover){
  .collection-menu-item--sub:hover > .collection-menu-sub{
    display:block;position:absolute;right:100%;left:auto;top:0;margin:0;margin-right:-3px;z-index:25;
  }
}
.collection-menu-item--sub.open > .collection-menu-sub{
  display:block;position:absolute;right:100%;left:auto;top:0;margin:0;margin-right:-3px;z-index:25;
}
/* Узкий экран: подменю вниз — иначе уезжает влево за overflow-x:hidden у #movies-table-body-scroll и текст режется до «П…» */
@media (max-width:768px){
  .collection-menu-item--sub.open > .collection-menu-sub,
  .collection-menu-item--sub:hover > .collection-menu-sub{
    left:auto!important;
    right:0!important;
    top:100%!important;
    margin-top:2px!important;
    margin-right:0!important;
    z-index:30;
    max-width:min(calc(100vw - 24px),320px);
  }
  .collection-menu-item--sub.open > .collection-menu-sub::before,
  .collection-menu-item--sub:hover > .collection-menu-sub::before{display:none;}
  /* Пока открыто меню строки — не даём гориз. скроллу чипов тегов наезжать на выпадашку */
  #movies-page #movies-table-view tbody tr:has(.collection-row-menu.open) .tag-cell-pills,
  #series-page #series-table-view tbody tr:has(.collection-row-menu.open) .tag-cell-pills,
  #watchlist-page #watchlist-table-view tbody tr:has(.collection-row-menu.open) .tag-cell-pills{
    overflow-x:hidden;
  }
}
body.theme-light .collection-row-menu{background:var(--card-bg,#f5f5f7);border-color:var(--border,#ddd);}
body.theme-light .collection-menu-item{color:var(--text,#111);}
body.theme-light .collection-menu-sub-toggle{color:var(--text,#111);}
body.theme-light .collection-menu-sub{background:var(--card-bg,#f5f5f7);border-color:var(--border,#ddd);}
body.theme-light .collection-menu-sub-item{color:var(--text,#111);}
body.theme-light .collection-menu-item--danger{color:#c62828;}

/* Галерея: строка «Добавить в…» в меню ⋯ */
.gallery-card-menu-row--sub{position:relative;z-index:0;padding:0;}
.gallery-card-menu-row--sub:is(:hover,.open){z-index:3;}
.gallery-card-menu-sub-toggle{
  display:block;width:100%;margin:0;padding:10px 14px;border:none;background:transparent;
  text-align:left;font-size:13px;font-weight:500;color:rgba(255,255,255,.88);font-family:inherit;cursor:pointer;
}
.gallery-card-menu-sub-toggle:hover{background:rgba(255,255,255,.06);}
.gallery-card-menu-sub{
  display:none;position:relative;min-width:180px;max-width:min(320px,min(92vw,400px));max-height:min(50vh,280px);overflow-y:auto;
  padding:0;border-radius:12px;background:#121212;border:1px solid rgba(255,255,255,.14);
  box-shadow:0 16px 48px rgba(0,0,0,.65),0 0 0 1px rgba(0,0,0,.35);
}
.gallery-card-menu-sub::before{
  content:'';
  position:absolute;right:-18px;top:0;bottom:0;width:18px;
}
@media (hover:hover){
  .gallery-card-menu-row--sub:hover > .gallery-card-menu-sub{
    display:block;position:absolute;right:100%;left:auto;top:0;margin:0;margin-right:-3px;z-index:25;
  }
}
.gallery-card-menu-row--sub.open > .gallery-card-menu-sub{
  display:block;position:absolute;right:100%;left:auto;top:0;margin:0;margin-right:-3px;z-index:25;
}
@media (max-width:768px){
  .gallery-card-menu-row--sub.open > .gallery-card-menu-sub,
  .gallery-card-menu-row--sub:hover > .gallery-card-menu-sub{
    left:auto!important;
    right:0!important;
    top:100%!important;
    margin-top:2px!important;
    margin-right:0!important;
    z-index:30;
    max-width:min(calc(100vw - 24px),320px);
  }
  .gallery-card-menu-row--sub.open > .gallery-card-menu-sub::before,
  .gallery-card-menu-row--sub:hover > .gallery-card-menu-sub::before{display:none;}
}
body.theme-light .gallery-card-menu-sub-toggle{color:var(--text,#111);}
body.theme-light .gallery-card-menu-sub{background:var(--card-bg,#f5f5f7);border-color:var(--border,#ddd);}

/* Пользовательский список: блок «Сериалы» под фильмами */
.lv2-cl-section-hdr{
  margin:20px 0 10px;font-size:11px;font-weight:600;letter-spacing:.06em;text-transform:uppercase;
  color:rgba(255,255,255,.35);
}
body.theme-light .lv2-cl-section-hdr{color:rgba(0,0,0,.4);}
.lv2-grid-view--cl-series{margin-bottom:8px;}

.col-delete:has(.collection-row-more-wrap){width:auto;min-width:40px;}

/* Emoji tags */

.emoji-filter-bar{display:flex;flex-wrap:wrap;gap:6px;padding:0 0 14px;}

.emoji-tag:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);transform:scale(1.1);}

.emoji-tag.disabled{opacity:.25;pointer-events:none;}


.reaction-btn{background:none;border:none;cursor:pointer;font-size:18px;padding:4px;border-radius:var(--border-radius-icons);transition:all .18s;line-height:1;opacity:.35;}
.reaction-btn:hover{opacity:.7;background:rgba(255,255,255,.06);}
.reaction-btn.active{opacity:1;}
/* Active filter indicator */
.tag-filter-active{background:rgba(255,255,255,.08);border-radius:var(--border-radius-icons);padding:6px 12px;font-size:12px;color:rgba(255,255,255,.55);display:inline-flex;align-items:center;gap:6px;cursor:pointer;margin-bottom:12px;}
.tag-filter-active:hover{background:rgba(255,255,255,.12);}

/* ── Reaction button ──────────────────────────────────────── */
.reaction-btn{background:none;border:none;cursor:pointer;padding:2px;font-size:15px;line-height:1;opacity:.3;transition:opacity .2s,transform .15s;}
.reaction-btn:hover{opacity:.7;transform:scale(1.15);}
.reaction-btn.active{opacity:1;}

/* ── Emoji tags ───────────────────────────────────────────── */

.tag-pill{font-size:14px;line-height:1;cursor:pointer;padding:2px;border-radius:6px;transition:transform .15s,background .15s;background:transparent;}
.tag-pill:hover{transform:scale(1.2);}

/* ── Tag picker panel ─────────────────────────────────────── */
.tag-picker-overlay{position:fixed;inset:0;z-index:700;pointer-events:none;visibility:hidden;}
.tag-picker-overlay.open{pointer-events:none;visibility:visible;}
.tag-picker{position:fixed;background:#111;border:1px solid rgba(255,255,255,.12);border-radius:18px;padding:16px;width:min(320px,calc(100vw - 32px));max-width:100%;z-index:701;box-shadow:0 16px 48px rgba(0,0,0,.7);opacity:0;transform:scale(.95) translateY(-8px);transition:opacity .18s,transform .18s;pointer-events:none;max-height:min(480px,70vh);overflow-y:auto;-webkit-overflow-scrolling:touch;}
.tag-picker.open{opacity:1;transform:scale(1) translateY(0);pointer-events:all;}
.tag-picker-title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.25);margin-bottom:10px;}
.tag-picker-grid{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:14px;}
.tag-opt{font-size:18px;width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:10px;cursor:pointer;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);transition:all .15s;}
.tag-opt:hover{background:rgba(255,255,255,.12);transform:scale(1.1);}
.tag-opt.selected{background:rgba(255,255,255,.18);border-color:rgba(255,255,255,.3);}
.tag-picker-divider{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.2);margin:10px 0 8px;}
.platform-opts{display:flex;flex-wrap:wrap;gap:5px;}
.platform-opt{font-size:11px;font-weight:600;padding:4px 10px;border-radius:var(--border-radius-icons);cursor:pointer;background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);color:rgba(255,255,255,.5);transition:all .15s;white-space:nowrap;}
.platform-opt:hover{background:rgba(255,255,255,.1);color:#fff;}
.platform-opt.selected{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);color:#fff;}
.tag-picker-save{width:100%;margin-top:12px;padding:9px;border-radius:10px;background:rgba(255,255,255,.9);color:#000;font-size:13px;font-weight:600;font-family:inherit;border:none;cursor:pointer;transition:background .2s;}
.tag-picker-save:hover{background:#fff;}

/* ── Platform badge in table ──────────────────────────────── */


/* Tags / Reaction / Platform */
.reaction-btn{background:none;border:none;cursor:pointer;font-size:16px;line-height:1;padding:2px;opacity:.3;transition:all .2s;display:inline-flex;align-items:center;}
.reaction-btn:hover{opacity:.7;transform:scale(1.15);}
.reaction-btn.active{opacity:1;transform:scale(1.1);}
.tag-pill{display:inline-flex;align-items:center;justify-content:center;font-size:14px;width:26px;height:26px;border-radius:var(--border-radius-icons);cursor:pointer;background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);transition:all .18s;line-height:1;}
.tag-pill:hover{background:rgba(255,255,255,.12);border-color:rgba(255,255,255,.18);transform:scale(1.08);}
.tag-pill.selected{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);}
.tag-pill.filter-active{background:rgba(255,214,10,.15);border-color:rgba(255,214,10,.4);}
.tags-panel{display:flex;flex-wrap:wrap;gap:6px;padding:14px 16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;}
.tags-panel-section{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.2);margin-bottom:8px;width:100%;}
.platform-select{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:8px 12px;font-size:13px;color:rgba(255,255,255,.8);font-family:inherit;outline:none;cursor:pointer;width:100%;}
.platform-select:focus{border-color:rgba(255,255,255,.2);}
.platform-select option{background:#1a1a1a;color:#fff;}

.col-tags{white-space:nowrap;}
th.col-platform,
td.col-platform{
  width:106px;min-width:106px;max-width:130px;box-sizing:border-box;
  text-align:center;vertical-align:middle;
  white-space:nowrap;font-size:11px;
}
.col-watched{font-size:11px;color:rgba(255,255,255,.25);white-space:nowrap;}
.tag-filter-bar{display:flex;flex-wrap:wrap;gap:6px;padding:10px 0 4px;}
.watched-input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(--border-radius-icons);padding:7px 10px;font-size:13px;color:#fff;font-family:inherit;outline:none;width:140px;}
.watched-input:focus{border-color:rgba(255,255,255,.2);}

/* Reaction button */
.reaction-btn{background:none;border:none;cursor:pointer;font-size:15px;padding:2px;line-height:1;opacity:.35;transition:opacity .2s;}
.reaction-btn:hover{opacity:.7;}
.reaction-btn.active{opacity:1;}

/* Tag pills in table */

.tag-pill{font-size:13px;line-height:1;cursor:pointer;opacity:.7;transition:opacity .15s;padding:0.4px;}
.tag-pill:hover{opacity:1;}
.tag-pill.active-filter{outline:2px solid rgba(255,255,255,.4);border-radius:3px;opacity:1;}

/* Platform badge */


/* Tag picker panel */
.tag-picker{position:fixed;z-index:600;background:#111;border:1px solid rgba(255,255,255,.12);border-radius:16px;padding:14px;box-shadow:0 8px 32px rgba(0,0,0,.6);display:none;flex-direction:column;gap:10px;min-width:240px;}
.tag-picker.open{display:flex;}
.tag-picker-title{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.25);margin-bottom:2px;}
.tag-picker-grid{display:flex;flex-wrap:wrap;gap:6px;}
.tag-pick-btn{font-size:16px;width:36px;height:36px;border-radius:var(--border-radius-icons);border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;line-height:1;}
.tag-pick-btn:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);}
.tag-pick-btn.selected{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.35);}
.tag-pick-close{background:rgba(255,255,255,.06);border:1px solid rgba(255,255,255,.08);border-radius:var(--border-radius-icons);padding:7px;font-size:12px;color:rgba(255,255,255,.4);cursor:pointer;text-align:center;margin-top:2px;font-family:inherit;transition:background .15s;}
.tag-pick-close:hover{background:rgba(255,255,255,.1);color:#fff;}

/* Watched date in detail */
.watched-row{display:flex;align-items:center;gap:10px;margin-bottom:16px;}
.watched-label{font-size:12px;color:rgba(255,255,255,.3);}
.watched-input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:var(--border-radius-icons);padding:6px 10px;font-size:13px;color:#fff;font-family:inherit;outline:none;width:130px;transition:border-color .2s;}
.watched-input:focus{border-color:rgba(255,255,255,.2);}
.watched-save{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.1);border-radius:var(--border-radius-icons);padding:6px 12px;font-size:12px;color:rgba(255,255,255,.5);font-family:inherit;cursor:pointer;transition:all .2s;}
.watched-save:hover{background:rgba(255,255,255,.12);color:#fff;}

/* Reaction & Tags */
.react-btn{background:none;border:none;cursor:pointer;font-size:16px;padding:2px 4px;border-radius:6px;transition:all .2s;line-height:1;}
.react-btn:hover{background:rgba(255,255,255,.06);}
.tag-pill{display:inline-flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:9px;font-size:16px;cursor:pointer;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);transition:all .2s;user-select:none;}
.tag-pill:hover{background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);}
.tag-pill.selected{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);box-shadow:0 0 0 2px rgba(255,255,255,.1);}
.tag-pill.tag-pill--word{width:auto;height:auto;min-height:32px;padding:6px 12px;font-size:11px;font-weight:600;line-height:1.25;max-width:160px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.tag-panel{display:flex;flex-wrap:wrap;gap:8px;padding:14px 16px;background:rgba(255,255,255,.03);border:1px solid rgba(255,255,255,.07);border-radius:14px;}
.tag-panel-section{font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;color:rgba(255,255,255,.2);width:100%;margin-top:4px;}
.platform-btn{padding:5px 12px;border-radius:var(--border-radius-icons);font-size:12px;font-weight:600;cursor:pointer;border:1px solid rgba(255,255,255,.08);background:rgba(255,255,255,.04);color:rgba(255,255,255,.5);transition:all .2s;font-family:inherit;}
.platform-btn:hover{background:rgba(255,255,255,.1);color:#fff;}
.platform-btn.selected{background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.3);color:#fff;}
.watched-input{background:rgba(255,255,255,.05);border:1px solid rgba(255,255,255,.08);border-radius:10px;padding:8px 12px;font-size:13px;color:#fff;font-family:inherit;outline:none;width:140px;transition:border-color .2s;}
.watched-input:focus{border-color:rgba(255,255,255,.2);}
.watched-input::placeholder{color:rgba(255,255,255,.2);}

/* Теги: иконка + подпись (пикер), в таблице — текстовые чипы */
.tag-icon-btn {
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  width:auto;min-height:32px;height:auto;padding:6px 10px;border-radius:var(--border-radius-icons);
  border:1px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);
  cursor:pointer;transition:all .15s;
  color:rgba(255,255,255,.45);
  flex-shrink:0;
  font-family:inherit;
  box-sizing:border-box;
}
.tag-icon-btn__ico{display:inline-flex;align-items:center;justify-content:center;flex-shrink:0;opacity:.88;}
.tag-icon-btn__txt{font-size:11px;font-weight:600;line-height:1.2;text-align:left;max-width:118px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;color:inherit;}
.tag-icon-btn:hover { background:rgba(255,255,255,.1);border-color:rgba(255,255,255,.2);color:rgba(255,255,255,.85); }
.tag-icon-btn.selected { background:rgba(255,255,255,.15);border-color:rgba(255,255,255,.4);color:#fff; }
.tag-icon-btn.disabled { opacity:.25;cursor:default;pointer-events:none; }
.tag-icon-btn svg { width:14px;height:14px;stroke-width:1.8; }
.tag-pill-icon {
  display:inline-flex;align-items:center;justify-content:center;
  width:auto;max-width:100%;min-height:22px;height:auto;padding:2px 8px;border-radius:6px;
  background:rgba(255,255,255,.06);
  border:1px solid rgba(255,255,255,.1);
  color:rgba(255,255,255,.72);
  cursor:pointer;transition:all .15s;
  flex-shrink:0;
  box-sizing:border-box;
}
.tag-pill-icon:hover { background:rgba(255,255,255,.12);color:#fff;border-color:rgba(255,255,255,.18); }
.tag-pill-label{font-size:10px;font-weight:600;line-height:1.2;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100px;}
.tag-pill-icon.tag-pill-add{
  width:28px;min-width:28px;max-width:28px;height:28px;padding:0;justify-content:center;
  border-radius:50%;
  opacity:.5;
  transition:opacity .15s,background .15s,border-color .15s,transform .12s;
}
.tag-pill-icon.tag-pill-add:hover{opacity:1;}
.tag-pill-icon.tag-pill-add .tag-pill-label{display:none;}
.tag-pill-icon.tag-pill-add svg { width:12px;height:12px;stroke-width:2.2; }
/* Reaction SVG heart */
.reaction-heart { cursor:pointer;padding:3px;background:none;border:none;line-height:1;transition:transform .15s; }
.reaction-heart:hover { transform:scale(1.15); }


/* ── Apple-style table ───────────────────────────────────── */
table { border-collapse: collapse; width: 100%; table-layout: fixed; }
thead tr { border-bottom: 1px solid rgba(255,255,255,.06); }
thead th {
  text-align: center;
  font-size: 11px; font-weight: 500;
  letter-spacing: .06em;
  text-transform: uppercase;
  color: rgba(255,255,255,.22);
  padding: 8px 10px;
  white-space: nowrap;
  user-select: none;
}
thead th.sortable { cursor: pointer; }
thead th.sortable:hover { color: rgba(255,255,255,.45); }
thead th.sort-asc::after  { content: ' ↑'; }
thead th.sort-desc::after { content: ' ↓'; }

tbody tr {
  border-bottom: 1px solid rgba(255,255,255,.04);
  transition: background .15s ease;
}
tbody td {
  padding: 10px 10px;
  height: 43px;
  font-size: 13.5px;
  color: rgba(255,255,255,.75);
  vertical-align: middle;
}

/* Title */
.col-title {
  font-weight: 500;
  color: rgba(255,255,255,.92);
  cursor: pointer;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.col-title:hover { color: #fff; }

/* Heart / reaction */
.col-heart { width: 28px; text-align: center; padding: 0 6px !important; }
.reaction-heart {
  cursor: pointer; padding: 2px;
  background: none; border: none;
  display: inline-flex; align-items: center;
  transition: transform .15s, opacity .15s;
  opacity: .9;
}
.reaction-heart svg { stroke: rgba(255,255,255,.2); }
.reaction-heart:hover svg { stroke: rgba(255,255,255,.5); }
.reaction-heart:hover { transform: scale(1.18); opacity: 1; }
@keyframes reaction-love-pop {
  0% { transform: scale(1); filter: drop-shadow(0 0 0 transparent); }
  25% { transform: scale(1.2); filter: drop-shadow(0 0 6px rgba(224, 5, 90, 0.9)) drop-shadow(0 0 16px rgba(224, 5, 90, 0.45)); }
  100% { transform: scale(1); filter: none; }
}
.reaction-heart.love-flash,
#det-reaction-btn.love-flash {
  animation: reaction-love-pop 0.3s ease-out forwards;
}
#det-reaction-btn.love-flash {
  transition: none !important;
}
.reaction-heart.love-flash:hover,
#det-reaction-btn.love-flash:hover { transform: scale(1); }

.heart-btn { background:none;border:none;cursor:pointer;line-height:1;opacity:.3;transition:opacity .2s;padding:2px; }
.heart-btn svg { stroke: rgba(255,255,255,.3); }
.heart-btn:hover { opacity:.6; }
.heart-btn.liked { opacity:1; }

/* Delete */
.col-delete { width: 28px; text-align: center; padding: 0 6px !important; }
.delete-btn {
  background: none; border: none; cursor: pointer;
  color: rgba(255,255,255,.12); padding: 3px;
  border-radius: 6px; display: inline-flex; align-items: center;
  transition: color .15s, background .15s;
}
.delete-btn:hover { color: rgba(255,80,80,.8); background: rgba(255,50,50,.08); }

/* Свайп влево → «Удалить» (как в Заметках iOS) */
.list-swipe-cell {
  padding: 0 !important;
  border-bottom: none !important;
  vertical-align: middle;
}
tbody tr:has(.list-swipe-track) {
  border-bottom: none;
}
/* Grid вместо absolute у кнопки удаления: в iOS WKWebView при быстром скролле
   absolute внутри tbody иногда «липнет» к вьюпорту и дублируется внизу экрана. */
.list-swipe-track {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 88px;
  grid-template-rows: auto;
  align-items: stretch;
  overflow: hidden;
  border-radius: 12px;
  /* Красный только у колонки «Удалить» — иначе фон трека со скруглением просвечивал по углам строки */
  background: transparent;
  -webkit-tap-highlight-color: transparent;
}
.list-swipe-delete-btn {
  grid-column: 2;
  grid-row: 1;
  position: relative;
  z-index: 0;
  width: 100%;
  min-width: 0;
  box-sizing: border-box;
  margin: 0;
  padding: 6px 8px;
  border: none;
  border-radius: 0 12px 12px 0;
  background: rgba(255, 59, 48, 0.98);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 5px;
  font-size: 11px;
  font-weight: 600;
  font-family: inherit;
  letter-spacing: 0.02em;
  cursor: pointer;
  align-self: stretch;
  min-height: 43px;
  line-height: 1.1;
}
.list-swipe-delete-btn svg {
  stroke: #fff;
  opacity: 0.95;
  flex-shrink: 0;
}
.list-swipe-delete-btn:active {
  filter: brightness(1.08);
}
.list-swipe-front {
  grid-column: 1 / -1;
  grid-row: 1;
  position: relative;
  z-index: 1;
  display: grid;
  align-items: center;
  min-height: 43px;
  box-sizing: border-box;
  background: var(--bac);
  border-radius: 12px;
  overflow: hidden;
  border-bottom: 1px solid rgba(255, 255, 255, 0.04);
  transform: translateX(0);
  touch-action: pan-y;
  transition: background .15s ease;
}
/* Подсветка строки только при наведении мыши / трекпада (без «залипания» на тач) */
@media (hover: hover) and (pointer: fine) {
  tbody tr:hover {
    background: var(--row-hover);
  }
  tbody tr:has(.list-swipe-track):hover .list-swipe-front {
    background: rgba(34, 34, 36, 1);
  }
  body.theme-light tbody tr:has(.list-swipe-track):hover .list-swipe-front {
    background: var(--surface2);
  }
}
/* Сетка колонок как у шапки таблицы */
.list-swipe-front--movies {
  grid-template-columns: 28px minmax(0, 1fr) 120px minmax(72px, 0.35fr) 50px minmax(200px, 0.62fr) 28px;
  gap: 0;
}
.list-swipe-front--series {
  grid-template-columns: 28px minmax(0, 1fr) 70px minmax(72px, 0.35fr) 60px minmax(200px, 0.62fr) 28px;
  gap: 0;
}
.list-swipe-front--watchlist {
  grid-template-columns: 28px minmax(0, 1fr) minmax(72px, 0.35fr) 55px minmax(200px, 0.5fr) 28px;
  gap: 0;
}
.list-swipe-col {
  padding: 10px 10px;
  font-size: 13.5px;
  color: rgba(255, 255, 255, 0.75);
  min-width: 0;
  box-sizing: border-box;
}
.list-swipe-col.col-heart,
.list-swipe-col.col-delete {
  padding-left: 6px;
  padding-right: 6px;
  text-align: center;
}
body.theme-light .list-swipe-front {
  background: var(--bg, #fff);
  border-bottom-color: rgba(0, 0, 0, 0.06);
}
body.theme-light .list-swipe-delete-btn {
  background: #ff3b30;
}
/* Светлая тема: фон строки белый — иначе текст остаётся белым и не виден (особенно «Позже») */
body.theme-light .list-swipe-col {
  color: rgba(0, 0, 0, 0.82);
}
body.theme-light .list-swipe-col.col-title {
  color: rgba(0, 0, 0, 0.92);
}

/* Genre */
.col-genre { font-size: 12px; color: rgba(255,255,255,.3); white-space: nowrap; text-align: center; }
.col-year  { font-size: 12px; color: rgba(255,255,255,.3); white-space: nowrap; text-align: center; }

/* Status */
.col-status { text-align: center; }
.status-done { color: rgba(48,209,88,.8); font-size: 13px; }
.status-skip { color: rgba(255,255,255,.25); font-size: 12px; }
.status-drop { color: rgba(255,69,58,.6); font-size: 13px; }
.col-status .series-status-svg { display: block; margin: 0 auto; }

/* Platform badge */
.platform-badge {
  font-size: 10px; font-weight: 600;
  padding: 2px 6px; border-radius: 6px;
  background: rgba(255,255,255,.07);
  border: 1px solid rgba(255,255,255,.1);
  color: rgba(255,255,255,.45);
  letter-spacing: .04em;
  cursor: pointer;
  transition: background .15s;
  display: inline-block;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  vertical-align: middle;
  box-sizing: border-box;
}
.platform-badge:hover { background: rgba(255,255,255,.12); color: rgba(255,255,255,.7); }

/* Прогресс сериала в таблице (узкая колонка) */
.col-progress {
  font-size: 13px;
  white-space: nowrap;
  text-align: center;
  vertical-align: middle;
}

/* Теги: «+» первым в DOM — всегда слева; чипы в зоне с гориз. скроллом; «+» sticky при скролле таблицы */
.tag-cell {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 6px;
  min-width: 0;
  overflow: hidden;
  box-sizing: border-box;
}
.tag-cell-pills {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
  gap: 4px;
  flex: 1 1 0;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
}
.tag-cell-pills::-webkit-scrollbar{height:4px;}
.tag-cell-pills::-webkit-scrollbar-thumb{background:rgba(255,255,255,.15);border-radius:4px;}
.tag-cell-pills--empty{
  overflow-x:hidden;
  mask-image:none;
  -webkit-mask-image:none;
  min-width:0;
}
.list-table-sync td.tag-cell {
  vertical-align: middle;
  box-sizing: border-box;
}
.list-table-sync .list-swipe-col.tag-cell {
  overflow: hidden;
  min-width: 0;
}
.list-table-sync .tag-cell > .tag-pill-add {
  flex: 0 0 auto;
  position:sticky;
  left:0;
  z-index:3;
  background:var(--bac);
  box-shadow:6px 0 10px -4px var(--bac);
}
.list-table-sync .tag-cell-pills > .tag-pill-icon {
  flex: 0 0 auto;
  max-width: 400px;
  overflow: hidden;
}
.list-table-sync .tag-cell-pills .tag-pill-label {
  max-width: 400px;
  min-width: 0;
}
.di-typing { display:inline-flex; gap:4px; align-items:center; padding:4px 0; }
.di-typing span {
  width:6px; height:6px; border-radius:50%;
  background:rgba(255,255,255,.4);
  animation: di-bounce .8s infinite;
}
.di-typing span:nth-child(2) { animation-delay:.15s; }
.di-typing span:nth-child(3) { animation-delay:.3s; }
@keyframes di-bounce {
  0%,80%,100% { transform:translateY(0); opacity:.4; }
  40%          { transform:translateY(-5px); opacity:1; }
}

@keyframes di-pulse {
  0%,100% { opacity:1; box-shadow:0 0 5px #30d158; }
  50%      { opacity:.4; box-shadow:0 0 2px #30d158; }
}

.menu-section { margin-bottom:8px; }
.menu-section-title { font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.7px;color:rgba(255,255,255,.2);padding:8px 20px 4px; }
.menu-card { background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.06);border-radius:14px;margin:0 12px 8px;overflow:hidden; }
.menu-card-row { display:flex;align-items:center;gap:12px;padding:12px 16px;transition:background .15s;cursor:pointer; }
.menu-card-row:hover { background:rgba(255,255,255,.04); }
.menu-card-row:not(:last-child) { border-bottom:1px solid rgba(255,255,255,.05); }
.menu-card-icon { width:30px;height:30px;border-radius:var(--border-radius-icons);display:flex;align-items:center;justify-content:center;flex-shrink:0; }
.menu-card-label { font-size:14px;color:rgba(255,255,255,.8);flex:1; }
.menu-card-value { font-size:13px;color:rgba(255,255,255,.3); }
.menu-card-chevron { color:rgba(255,255,255,.2); }

/* Search clear button */
input[type="search"]::-webkit-search-cancel-button {
  cursor: pointer !important;
  -webkit-appearance: none;
  height: 20px; width: 20px;
  background: rgba(255,255,255,.2);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='12' viewBox='0 0 24 24' fill='none' stroke='white' stroke-width='2.5' stroke-linecap='round'%3E%3Cline x1='18' y1='6' x2='6' y2='18'/%3E%3Cline x1='6' y1='6' x2='18' y2='18'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  transition: background .15s;
  margin-right: 4px;
}
input[type="search"]::-webkit-search-cancel-button:hover {
  background-color: rgba(255,255,255,.35);
}

/* Safari table cell dot fix */
tbody td::after, tbody td::before { content: none !important; display: none !important; }
td { border-spacing: 0; }

/* Custom confirm modal */
.confirm-overlay {
  position: fixed; inset: 0; z-index: 9999;
  background: rgba(0,0,0,.6);
  backdrop-filter: blur(8px);
  display: flex; align-items: center; justify-content: center;
  animation: fadeIn .15s ease;
}
.confirm-box {
  background: #1c1c1e;
  border: 1px solid rgba(255,255,255,.1);
  border-radius: 16px;
  padding: 24px;
  width: 280px;
  text-align: center;
  box-shadow: 0 20px 60px rgba(0,0,0,.6);
}
.confirm-title {
  font-size: 15px; font-weight: 600; color: #fff;
  margin-bottom: 8px;
}
.confirm-msg {
  font-size: 13px; color: rgba(255,255,255,.4);
  margin-bottom: 20px; line-height: 1.5;
}
.confirm-btns {
  display: flex; gap: 8px;
}
.confirm-btn {
  flex: 1; padding: 10px; border-radius: 10px;
  font-size: 14px; font-weight: 500; font-family: inherit;
  cursor: pointer; border: none; transition: all .15s;
}
.confirm-btn-cancel {
  background: rgba(255,255,255,.08);
  color: rgba(255,255,255,.6);
}
.confirm-btn-cancel:hover { background: rgba(255,255,255,.12); }
.confirm-btn-danger {
  background: rgba(255,59,48,.2);
  color: #ff3b30;
  border: 1px solid rgba(255,59,48,.3);
}
.confirm-btn-danger:hover { background: rgba(255,59,48,.3); }

/* Custom confirm dialog */
.confirm-overlay { position:fixed; inset:0; background:rgba(0,0,0,.6); z-index:9999; display:flex; align-items:center; justify-content:center; backdrop-filter:blur(4px); animation:fadeIn .15s ease; }
.confirm-box { background:#1c1c1e; border:1px solid rgba(255,255,255,.1); border-radius:16px; padding:24px; width:280px; box-shadow:0 20px 60px rgba(0,0,0,.6); }
.confirm-title { font-size:15px; font-weight:600; color:#fff; margin-bottom:8px; }
.confirm-msg { font-size:13px; color:rgba(255,255,255,.45); margin-bottom:20px; line-height:1.5; }
.confirm-btns { display:flex; gap:8px; justify-content:flex-end; }
.confirm-btn { padding:8px 18px; border-radius:10px; font-size:13px; font-weight:500; font-family:inherit; cursor:pointer; border:none; transition:all .15s; }
.confirm-btn.cancel { background:rgba(255,255,255,.08); color:rgba(255,255,255,.6); }
.confirm-btn.cancel:hover { background:rgba(255,255,255,.12); }
.confirm-btn.ok { background:#e0055a; color:#fff; }
.confirm-btn.ok:hover { background:#ff0066; }

.kp-mig-overlay { position:fixed; inset:0; z-index:10000; background:rgba(0,0,0,.65); display:none; align-items:center; justify-content:center; padding:16px; backdrop-filter:blur(6px); -webkit-backdrop-filter:blur(6px); overflow-y:auto; }
.kp-mig-panel { background:#1c1c1e; border:1px solid rgba(255,255,255,.1); border-radius:18px; padding:20px; max-width:520px; width:100%; max-height:92vh; overflow:hidden; display:flex; flex-direction:column; gap:12px; box-shadow:0 24px 80px rgba(0,0,0,.55); }
.kp-mig-title { font-size:17px; font-weight:700; color:#fff; margin:0; }
.kp-mig-hint { font-size:12px; line-height:1.45; color:rgba(255,255,255,.42); margin:0; }
.kp-mig-hint-short { margin:0 0 6px 0; }
.kp-mig-instruct-toggle { display:inline-block; background:none; border:none; padding:0; margin:0 0 10px 0; color:#FFD60A; font-size:12px; font-weight:600; cursor:pointer; text-decoration:underline; font-family:inherit; text-align:left; }
.kp-mig-instruct-toggle:hover { opacity:.9; }
.kp-mig-instruct-full { font-size:12px; line-height:1.5; color:rgba(255,255,255,.55); max-height:min(45vh,320px); overflow-y:auto; padding:10px 12px; border-radius:12px; border:1px solid rgba(255,255,255,.1); background:rgba(0,0,0,.22); margin:0 0 10px 0; box-sizing:border-box; }
.kp-mig-instruct-full p { margin:0 0 10px 0; }
.kp-mig-instruct-full p:last-child { margin-bottom:0; }
.kp-mig-example { font-size:11px; white-space:pre-wrap; word-break:break-all; margin:0 0 10px 0; padding:10px; border-radius:var(--border-radius-icons); background:rgba(0,0,0,.35); color:rgba(255,255,255,.78); font-family:ui-monospace,monospace; }
.kp-mig-inline-warn { color:#ff8a80; }
.kp-mig-textarea { width:100%; min-height:140px; max-height:220px; padding:12px 14px; border-radius:12px; border:1px solid rgba(255,255,255,.12); background:rgba(0,0,0,.25); color:rgba(255,255,255,.9); font-size:13px; font-family:ui-monospace,monospace; resize:vertical; box-sizing:border-box; }
.kp-mig-textarea::placeholder { color:rgba(255,255,255,.28); }
.kp-mig-actions { display:flex; flex-wrap:wrap; gap:8px; }
.kp-mig-btn { padding:10px 16px; border-radius:12px; font-size:14px; font-weight:600; font-family:inherit; cursor:pointer; border:none; transition:opacity .15s; }
.kp-mig-btn:disabled { opacity:.45; cursor:not-allowed; }
.kp-mig-btn--ghost { background:rgba(255,255,255,.08); color:rgba(255,255,255,.75); }
.kp-mig-btn--primary { background:linear-gradient(135deg,#FFD60A,#E6A800); color:#1a1400; }
.kp-mig-summary { font-size:13px; color:rgba(255,255,255,.5); }
.kp-mig-table-wrap { max-height:min(40vh,280px); overflow:auto; border:1px solid rgba(255,255,255,.08); border-radius:12px; }
.kp-mig-table { width:100%; border-collapse:collapse; font-size:11px; }
.kp-mig-table td { padding:6px 8px; border-bottom:1px solid rgba(255,255,255,.06); color:rgba(255,255,255,.55); vertical-align:top; word-break:break-all; }
.kp-mig-table tr:last-child td { border-bottom:none; }
.kp-mig-badge { display:inline-block; margin-left:4px; padding:1px 6px; border-radius:6px; background:rgba(255,255,255,.1); color:rgba(255,255,255,.55); font-size:10px; }
.kp-mig-err { color:#ff8a80; font-size:10px; }
tr.kp-mig-row-bad td { background:rgba(255,60,60,.1); }
tr.kp-mig-row-bad td.kp-mig-err { color:#ff6b6b; font-weight:500; }
.kp-mig-menu-btn { width:100%; margin-top:6px; padding:11px 14px; border-radius:10px; border:1px solid rgba(255,255,255,.12); background:rgba(255,214,10,.12); color:#FFD60A; font-size:13px; font-weight:600; font-family:inherit; cursor:pointer; }

/* Long press context menu */
.lp-menu { position:fixed; z-index:9998; background:#1c1c1e; border:1px solid rgba(255,255,255,.12); border-radius:14px; padding:6px; min-width:200px; box-shadow:0 20px 60px rgba(0,0,0,.7); animation:fadeIn .15s ease; }
.lp-item { display:flex; align-items:center; gap:12px; padding:12px 14px; border-radius:10px; font-size:15px; color:rgba(255,255,255,.85); cursor:pointer; transition:background .1s; }
.lp-item:hover, .lp-item:active { background:rgba(255,255,255,.08); }
.lp-item-icon { font-size:18px; width:24px; text-align:center; }
.lp-divider { height:1px; background:rgba(255,255,255,.07); margin:2px 0; }

/* Peek preview */
.peek-overlay { position:fixed; inset:0; z-index:9997; background:rgba(0,0,0,.6); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); display:flex; flex-direction:column; align-items:center; justify-content:center; padding:24px; animation:fadeIn .2s ease; cursor:pointer; -webkit-tap-highlight-color:transparent; }
.peek-modal-inner { display:flex; flex-direction:column; align-items:center; max-width:100%; pointer-events:auto; cursor:default; }
.peek-poster { width:55vw; max-width:220px; aspect-ratio:2/3; border-radius:20px; overflow:hidden; box-shadow:0 30px 80px rgba(0,0,0,.8); margin-bottom:16px; }
.peek-poster img { width:100%; height:100%; object-fit:cover; }
.peek-poster-bg { width:100%; height:100%; }
.peek-title { font-size:18px; font-weight:700; color:#fff; text-align:center; margin-bottom:4px; }
.peek-year  { font-size:14px; color:rgba(255,255,255,.45); text-align:center; margin-bottom:24px; }
.peek-actions { display:flex; flex-direction:column; gap:10px; width:100%; max-width:280px; }
.peek-btn { padding:14px 20px; border-radius:14px; font-size:15px; font-weight:500; font-family:inherit; cursor:pointer; border:none; text-align:center; transition:all .15s; }
.peek-btn.add  { background:rgba(255,255,255,.15); color:#fff; backdrop-filter:blur(10px); }
.peek-btn.later{ display:flex; align-items:center; justify-content:center; min-width:52px; background:rgba(255,255,255,.08); color:rgba(255,255,255,.55); backdrop-filter:blur(10px); }
.peek-btn.later .peek-later-ico{display:block;}
.peek-btn.later .peek-later-ico path{fill:none;stroke:currentColor;}
.peek-btn.later.is-on{background:rgba(10,132,255,.14) !important;color:#0A84FF !important;}
.peek-btn.later.is-on .peek-later-ico path{fill:currentColor;}
body.theme-light .peek-btn.later{ color:var(--text55); background:rgba(0,0,0,.06); }
body.theme-light .peek-btn.later.is-on{ background:rgba(0,122,255,.12) !important; color:#007AFF !important; }
.peek-btn:active { transform:scale(.97); }

/* Apple TV card effect */
.poster-card {
  transform-style: preserve-3d;
  transform-origin: 50%;
}
.poster-card:active {
  transform: translateZ(4rem) scale(0.97);
}
.poster-card .poster-img {
  box-shadow: 0 .25rem .25rem rgba(0,0,0,.13);
  transition: box-shadow 50ms ease-in-out, transform 50ms ease-in-out;
}
.poster-card:active .poster-img {
  box-shadow: 0 1.5rem 2rem .25rem rgba(0,0,0,.35);
}
.poster-reflection {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  background-image: radial-gradient(rgba(255,255,255,.45), transparent 70%);
  transform: translateY(-100%);
  transition: transform 50ms ease-in-out;
  z-index: 4;
  border-radius: 17px;
}
.poster-card:active .poster-reflection {
  transform: translateY(-30%);
}

/* Pull-to-refresh (главная — сетка поиска/рекомендаций; списки; календарь) */
#ptr-root {
  position: fixed;
  top: env(safe-area-inset-top, 0px);
  left: 0;
  right: 0;
  height: 0;
  overflow: hidden;
  z-index: 120;
  pointer-events: none;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  background: transparent;
  transition: height 0.22s cubic-bezier(0.33, 1, 0.68, 1);
}
#ptr-root .ptr-inner {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 10px;
  min-height: 32px;
}
#ptr-root .ptr-icon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  border: 2px solid var(--text25);
  border-top-color: var(--text45);
  box-sizing: border-box;
  transition: border-color 0.15s ease;
}
#ptr-root.ptr-ready .ptr-icon {
  border-top-color: var(--text80);
  border-right-color: var(--text35);
}
#ptr-root.ptr-refreshing .ptr-icon {
  animation: ptr-spin 0.65s linear infinite;
}
@keyframes ptr-spin {
  to { transform: rotate(360deg); }
}

/* ==================== WebKit: touch-скролл по спискам (без overflow:hidden на .page.active) ==================== */
/* Скролл списков: один контейнер (#*-table-body-scroll). Дублируем для всех движков (Firefox responsive тоже). */
@media (max-width: 768px) {
  #movies-list-scroll-root,
  #series-list-scroll-root,
  #watchlist-list-scroll-root {
    flex: 1 1 0% !important;
    min-height: 0 !important;
    overflow-y: hidden !important;
    overflow-x: hidden !important;
    touch-action: manipulation;
  }
}
@supports (-webkit-touch-callout: none) {
  #movies-list-scroll-root,
  #series-list-scroll-root,
  #watchlist-list-scroll-root {
    /* 1 1 auto даёт basis=content и на iOS часто оставляет ~0 высоты у внутреннего overflow */
    flex: 1 1 0% !important;
    min-height: 0 !important;
    overflow-y: hidden !important;
    touch-action: manipulation;
  }
  #movies-table-body-scroll,
  #series-table-body-scroll,
  #watchlist-table-body-scroll {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain;
    touch-action: pan-y;
  }

  #movies-page #movies-table-body-scroll,
  #series-page #series-table-body-scroll,
  #watchlist-page #watchlist-table-body-scroll {
    padding-bottom: calc(80px + env(safe-area-inset-bottom, 0px));
  }

  #movies-page #movies-gallery-view,
  #series-page #series-gallery-view,
  #watchlist-page #watchlist-gallery-view {
    -webkit-overflow-scrolling: touch !important;
    overscroll-behavior-y: contain;
    touch-action: pan-y;
  }

  .list-toolbar,
  .page-search {
    position: relative !important;
    top: auto !important;
  }
}

/* ── BOTTOM NAV: мобильные стили ── */
@media(max-width:768px) {

  /* Главная: место под плавающую нижнюю панель — кнопки «+» / закладка на последнем ряду не перекрываются */
  #home .home-inner{
    padding-bottom: calc(92px + env(safe-area-inset-bottom, 0px));
    box-sizing: border-box;
  }

  /* Скрываем верхние табы из хедера */
  .list-header .list-header-tabs,
  .detail-header .list-header-tabs {
    display: none !important;
  }

  /* Нижняя навбар — плавающая капсула */
  .bottom-nav {
    display: block;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    z-index: 350;
    padding: 0 16px calc(12px + env(safe-area-inset-bottom, 0px));
    pointer-events: none;
    opacity: 0;
    transform: translateY(20px);
    transition: opacity .3s ease, transform .3s cubic-bezier(0.22,1,0.36,1);
    /* Плавное угасание снизу — контент красиво уходит под панель */
    background: linear-gradient(to top,
      rgba(11,11,13,0.45) 0%,
      rgba(11,11,13,0.15) 55%,
      transparent 100%);
  }

  .bottom-nav--visible {
    pointer-events: auto;
    opacity: 1;
    transform: translateY(0);
  }

  .bottom-nav-inner {
    display: flex;
    align-items: center;
    justify-content: space-around;
    background: rgba(30,30,32,0.25);
    backdrop-filter: blur(3px) saturate(180%);
    -webkit-backdrop-filter: blur(3px) saturate(180%);
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 100px;
    padding: 5px 6px;
    box-shadow: 0 2px 20px rgba(0,0,0,.25), 0 1px 0 rgba(255,255,255,.07) inset;
  }

  /* Таб */
  .bn-tab {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 3px;
    padding: 8px 8px;
    border: none;
    background: none;
    border-radius: 100px;
    cursor: pointer;
    color: rgba(255,255,255,.38);
    font-family: inherit;
    font-size: 10px;
    font-weight: 500;
    letter-spacing: .01em;
    transition: color .2s, background .2s;
    min-width: 0;
    flex: 1 1 0;
    max-width: 88px;
    -webkit-tap-highlight-color: transparent;
  }

  .bn-tab .bn-icon {
    width: 22px;
    height: 22px;
    flex-shrink: 0;
    transition: stroke .2s;
  }

  .bn-tab .bn-label {
    line-height: 1;
  }

  /* Активный таб — залитый фон */
  .bn-tab--active {
    background: rgba(255,255,255,.13);
    color: #fff;
  }

  .bn-tab--active .bn-icon {
    stroke: #fff;
  }

  /* Светлая тема */
  body.theme-light .bottom-nav {
    background: linear-gradient(to top, rgba(255,255,255,0.4) 0%, transparent 100%);
  }
  body.theme-light .bottom-nav-inner {
    background: rgba(242,242,247,.6);
    border-color: rgba(0,0,0,.1);
    box-shadow: 0 2px 16px rgba(0,0,0,.1);
  }
  body.theme-light .bn-tab {
    color: rgba(0,0,0,.35);
  }
  body.theme-light .bn-tab--active {
    background: rgba(0,0,0,.08);
    color: rgba(0,0,0,.85);
  }
  body.theme-light .bn-tab--active .bn-icon {
    stroke: rgba(0,0,0,.85);
  }
}
/* ═══════════════════════════════════════
   STATISTICS PAGE
═══════════════════════════════════════ */
:root{
  --st-bg2:rgba(255,255,255,.07);
  --st-text2:rgba(255,255,255,.5);
  --st-text3:rgba(255,255,255,.3);
  --st-border:rgba(255,255,255,.08);
  --st-card-bg:#161618;
}
body.theme-light{
  --st-bg2:rgba(0,0,0,.06);
  --st-text2:rgba(0,0,0,.45);
  --st-text3:rgba(0,0,0,.3);
  --st-border:rgba(0,0,0,.08);
  --st-card-bg:#f5f5f7;
}
/* Текст/цифры в карточках статистики (в т.ч. кольца SVG) — светлый на тёмном фоне */
#statistics-page{
  --color-text-primary:rgba(255,255,255,.92);
}
body.theme-light #statistics-page{
  --color-text-primary:rgba(0,0,0,.88);
}
#statistics-page #sHoursRing text,
#statistics-page #sTmdbRing text{
  fill:rgba(255,255,255,.92);
}
body.theme-light #statistics-page #sHoursRing text,
body.theme-light #statistics-page #sTmdbRing text{
  fill:rgba(0,0,0,.88);
}
.stats-body{
  display:flex;flex-direction:column;height:calc(100vh - var(--list-header-h));overflow-y:auto;
  -webkit-overflow-scrolling:touch;padding:14px;box-sizing:border-box;
}
/* Статистика: узкая центрированная колонка + поля по бокам (как в макете) */
#statistics-page .stats-body{
  width:100%;
  /*max-width:min(1180px, calc(100vw - 48px));*/
  margin-left:auto;
  margin-right:auto;
  box-sizing:border-box;
  padding-top:14px;
  padding-bottom:28px;
  padding-left:max(20px, env(safe-area-inset-left, 0px));
  padding-right:max(20px, env(safe-area-inset-right, 0px));
}
#statistics-page .stats-toolbar{
  margin:0 0 10px;
  padding:0 4px;
  width:100%;
  max-width:100%;
}
#statistics-page .stats-grid{
  padding:4px;
  width:100%;
  max-width:100%;
  align-items:stretch;
  /* 12 колонок: ряды 3+6+3 · 3+3+6 · 6+6 · 8+2+2 (как на референсе) */
  grid-template-columns:repeat(12, minmax(0, 1fr));
}
#statistics-page .stats-grid > .st-card{
  grid-column:span 3;
  min-width:0;
  align-self:stretch;
  display:flex;
  flex-direction:column;
  min-height:0;
  height:auto;
}
#statistics-page .stats-grid > .st-card > .st-card-title{
  flex-shrink:0;
}
#statistics-page .stats-grid > .st-card.st-span2{
  grid-column:span 6;
}
#statistics-page .stats-grid > .st-card.st-hidden{
  display:none;
}
#statistics-page .stats-grid > #sw-heat{
  grid-column:span 8;
}
/* Дек/платформы: узкая колонка (2) только в связке с тепловой 8+2+2. Иначе — как обычная карта (span 3), иначе в ряду из 4 виджетов получается 2+3+3+2=10 и пустота справа. */
@media (min-width:769px){
  #statistics-page .stats-grid > #sw-heat + #sw-dec:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-tags.st-hidden + #sw-dec:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-plat:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-tags.st-hidden + #sw-plat:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-dec + #sw-plat:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-tags.st-hidden + #sw-dec + #sw-plat:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-plat + #sw-dec:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-tags.st-hidden + #sw-plat + #sw-dec:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-dec + #sw-tags.st-hidden + #sw-plat:not(.st-span2),
  #statistics-page .stats-grid > #sw-heat + #sw-plat + #sw-tags.st-hidden + #sw-dec:not(.st-span2),
  #statistics-page .stats-grid > #sw-dec:not(.st-span2):has(+ #sw-plat + #sw-heat),
  #statistics-page .stats-grid > #sw-dec:not(.st-span2):has(+ #sw-tags.st-hidden + #sw-plat + #sw-heat),
  #statistics-page .stats-grid > #sw-plat:not(.st-span2):has(+ #sw-dec + #sw-heat),
  #statistics-page .stats-grid > #sw-plat:not(.st-span2):has(+ #sw-tags.st-hidden + #sw-dec + #sw-heat),
  #statistics-page .stats-grid > #sw-dec:not(.st-span2):has(+ #sw-heat),
  #statistics-page .stats-grid > #sw-dec:not(.st-span2):has(+ #sw-tags.st-hidden + #sw-heat),
  #statistics-page .stats-grid > #sw-plat:not(.st-span2):has(+ #sw-heat),
  #statistics-page .stats-grid > #sw-plat:not(.st-span2):has(+ #sw-tags.st-hidden + #sw-heat),
  #statistics-page .stats-grid > #sw-dec:not(.st-span2) + #sw-plat:not(.st-span2):has(+ #sw-heat),
  #statistics-page .stats-grid > #sw-plat:not(.st-span2) + #sw-dec:not(.st-span2):has(+ #sw-heat){
    grid-column:span 2;
  }
  /* Заполнить ширину ряда при «темповая + актёры» (часто после скрытия тегов между ними в DOM): 8+4=12 */
  #statistics-page .stats-grid > #sw-heat + #sw-actors,
  #statistics-page .stats-grid > #sw-heat + #sw-tags.st-hidden + #sw-actors{
    grid-column:span 4;
  }
  /* Актёры, скрытые теги, тепловая в одном ряду: 6+6=12 */
  #statistics-page .stats-grid > #sw-actors + #sw-tags.st-hidden + #sw-heat{
    grid-column:span 6;
  }
  /* Если дек и платформы скрыты — тепловая на всю ширину (иначе 8 пустых колонок) */
  #statistics-page .stats-grid:has(#sw-dec.st-hidden):has(#sw-plat.st-hidden) > #sw-heat{
    grid-column:span 12;
  }
}
.stats-toolbar{
  display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px;padding:0 4px;align-items:center;
}
.stats-tb-lbl{font-size:11px;color:var(--st-text3);}
.stats-tb-pill{
  padding:4px 10px;border-radius:100px;border:0.5px solid rgba(255,255,255,.15);
  font-size:11px;color:var(--st-text2);cursor:pointer;background:var(--st-card-bg);
  transition:background .12s;
}
body.theme-light .stats-tb-pill{border-color:rgba(0,0,0,.15);}
.stats-tb-pill.on{background:rgba(32,101,212,.15);border-color:transparent;color:#378ADD;}
.stats-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;
  align-items:start;padding:4px;width:100%;box-sizing:border-box;
}
@media(max-width:768px){
  .stats-grid{grid-template-columns:repeat(2,1fr);}
  .st-span2{grid-column:span 2!important;}
  .st-span3{grid-column:span 2!important;}
  #statistics-page .stats-grid{
    grid-template-columns:repeat(2, minmax(0, 1fr));
  }
  /* Скелет загрузки — плитки на всю ширину */
  #statistics-page #statsSkeleton.stats-grid > .st-card{
    grid-column:span 2 !important;
  }
  /*
    Дашборд статистики (только мобилка), порядок строк:
    1) Всего | TMDB  2) Радар  3) Топ режиссёры | Топ актёры  4) Активность по месяцам (на всю ширину)
    5) Десятилетия | Платформы  6) Любимые теги (на всю ширину)  7) Тепловая  8) Streak
  */
  #statistics-page #statsDash.stats-grid{
    grid-auto-flow:row;
  }
  #statistics-page #statsDash.stats-grid > #sw-hours{
    order:1;
    grid-column:1 / span 1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-tmdb{
    order:2;
    grid-column:2 / span 1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-radar{
    order:3;
    grid-column:1 / -1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-dir{
    order:4;
    grid-column:1 / span 1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-actors{
    order:5;
    grid-column:2 / span 1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-act{
    order:6;
    grid-column:1 / -1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-dec{
    order:7;
    grid-column:1 / span 1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-plat{
    order:8;
    grid-column:2 / span 1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-tags{
    order:9;
    grid-column:1 / -1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-heat{
    order:10;
    grid-column:1 / -1 !important;
  }
  #statistics-page #statsDash.stats-grid > #sw-streak{
    order:11;
    grid-column:1 / -1 !important;
  }
  #statistics-page .stats-body{
    max-width:100%;
    padding-left:max(16px, env(safe-area-inset-left, 0px));
    padding-right:max(16px, env(safe-area-inset-right, 0px));
    padding-bottom:calc(96px + env(safe-area-inset-bottom, 0px));
  }
}
.st-card{
  background:var(--st-card-bg);border:0.5px solid var(--st-border);
  border-radius:16px;padding:14px;cursor:grab;min-height:140px;
  transition:border-color .15s;position:relative;
}
.st-card:active{cursor:grabbing;}
.st-card.dragging{opacity:.5;}
.st-card.drag-over{border:1.5px solid #378ADD;}
.st-card.st-hidden{display:none;}
.st-span2{grid-column:span 2;}
.st-span3{grid-column:span 3;}
.st-card-title{
  font-size:10px;font-weight:500;color:var(--st-text2);
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;
  display:flex;align-items:center;justify-content:space-between;
}
.st-actions{display:flex;gap:3px;opacity:0;transition:opacity .15s;}
.st-card:hover .st-actions{opacity:1;}
.st-btn{
  width:20px;height:20px;border-radius:5px;border:0.5px solid var(--st-border);
  background:var(--st-bg2);cursor:pointer;display:flex;align-items:center;
  justify-content:center;font-size:10px;color:var(--st-text3);
}
.st-btn:hover{color:rgba(255,255,255,.8);}
body.theme-light .st-btn:hover{color:rgba(0,0,0,.7);}
.st-big-num{font-size:34px;font-weight:500;color:var(--color-text-primary);line-height:1;}
.st-hours-big{font-size:36px;font-weight:500;color:var(--color-text-primary);line-height:1;text-wrap: nowrap;}
.st-big-sub{font-size:11px;color:var(--st-text3);margin-top:4px;}
/* TMDB block (v3 dashboard) */
.st-tmdb-ring{display:flex;align-items:center;gap:14px;}
.st-tmdb-info{flex:1;min-width:0;}
.st-tmdb-score{font-size:38px;font-weight:500;color:var(--color-text-primary);line-height:1;}
.st-tmdb-sub{font-size:11px;color:var(--st-text3);margin-top:3px;}
.st-tmdb-dist{display:flex;flex-direction:column;gap:4px;margin-top:10px;}
.st-td-row{display:flex;align-items:center;gap:6px;font-size:10px;color:var(--st-text3);}
.st-td-t{flex:1;height:4px;background:var(--st-bg2);border-radius:2px;overflow:hidden;min-width:0;}
.st-td-f{height:100%;border-radius:2px;background:#FFD60A;}
/* Radar row */
.st-radar-inner{display:flex;align-items:center;gap:14px;}
.st-radar-legend{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0;}
/* Bars */
.st-bar-row{display:flex;align-items:center;gap:7px;margin-bottom:8px;}
.st-bar-lbl{
  font-size:11px;color:var(--st-text2);width:90px;flex-shrink:0;
  overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
  cursor:pointer;transition:color .12s;
}
.st-bar-lbl:hover{color:#378ADD;}
.st-bar-track{
  flex:1;height:5px;background:var(--st-bg2);border-radius:3px;
  overflow:hidden;cursor:pointer;
}
.st-bar-track:hover{opacity:.8;}
.st-bar-fill{height:100%;border-radius:3px;transition:width .4s;}
.st-bar-cnt{font-size:11px;color:var(--st-text3);width:18px;text-align:right;}
/* Activity */
.st-act-bars{display:flex;gap:3px;align-items:flex-end;height:65px;}
.st-act-b{
  flex:1;border-radius:2px 2px 0 0;background:var(--st-bg2);min-height:3px;
  cursor:pointer;transition:opacity .12s;
}
.st-act-b:hover{opacity:.7;}
.st-act-b.hi{background:#2065d4;}
.st-act-b.mid{background:#85B7EB;}
.st-act-ms{display:flex;justify-content:space-between;margin-top:4px;}
.st-act-m{font-size:8px;color:var(--st-text3);}
/* Activity v1 — два столбика на месяц (фильмы | сериалы) + кружки */
#statistics-page .st-act-bars-area{
  display:flex;align-items:flex-end;gap:4px;min-height:104px;margin-bottom:16px;
}
#statistics-page .st-act-month-group{
  flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:4px;
}
#statistics-page .st-act-bar-pair{
  display:flex;gap:2px;align-items:flex-end;justify-content:center;width:100%;
  height:86px;
}
#statistics-page .st-act-bar-col{
  flex:1;display:flex;flex-direction:column;align-items:center;gap:3px;min-width:0;max-width:50%;
}
#statistics-page .st-act-bar-val{
  font-size:9px;font-weight:500;color:var(--st-text2);min-height:12px;text-align:center;line-height:1;
}
#statistics-page .st-act-bar-fill{
  width:100%;border-radius:5px 5px 0 0;cursor:pointer;transition:opacity .12s;min-height:3px;
}
#statistics-page .st-act-bar-fill:hover{opacity:.85;}
#statistics-page .st-act-months-row--hidden{display:none!important;}
#statistics-page .st-act-mlbl{
  width:100%;text-align:center;font-size:9px;color:var(--st-text3);line-height:1.1;
}
#statistics-page .st-act-circles-wrap{
  display:flex;flex-direction:row;align-items:center;justify-content:center;gap:6px;margin-top:2px;
}
#statistics-page .st-act-circles-inner{
  flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:6px;
}
#statistics-page .st-act-year-chip{
  font-size:12px;font-weight:600;color:var(--color-text-primary);letter-spacing:.02em;
}
#statistics-page .st-act-year-btn{
  flex-shrink:0;width:32px;height:32px;border-radius:10px;border:0.5px solid var(--st-border);
  background:var(--st-bg2);color:var(--st-text2);font-size:18px;line-height:1;cursor:pointer;
  display:flex;align-items:center;justify-content:center;padding:0;transition:background .15s,color .15s;
}
#statistics-page .st-act-year-btn:hover:not(:disabled){background:var(--st-bg);color:var(--color-text-primary);}
#statistics-page .st-act-year-btn:disabled{opacity:.35;cursor:not-allowed;}
#statistics-page .st-act-stats-circles{
  display:flex;flex-wrap:nowrap;justify-content:center;align-items:flex-start;
  gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;padding-bottom:2px;
  scrollbar-width:thin;width:100%;
}
#statistics-page .st-act-stats-circles .st-act-sc{
  flex:0 0 auto;
}
#statistics-page .st-act-sc{
  display:flex;flex-direction:column;align-items:center;gap:7px;
}
#statistics-page .st-act-sc-ring{
  width:70px;height:70px;border-radius:50%;border:0.5px solid var(--st-border);
  background:var(--st-bg2);display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:1px;cursor:default;transition:transform .15s;
}
#statistics-page .st-act-sc-ring--click{cursor:pointer;}
#statistics-page .st-act-sc-ring--click:hover{transform:scale(1.06);}
#statistics-page .st-act-sc-ring--pos{
  border-color:rgba(29,158,117,.45);background:rgba(29,158,117,.1);
}
#statistics-page .st-act-sc-ring--neg{
  border-color:rgba(226,75,74,.45);background:rgba(226,75,74,.1);
}
#statistics-page .st-act-sc-val{
  font-size:17px;font-weight:500;color:var(--color-text-primary);line-height:1;text-align:center;
}
#statistics-page .st-act-sc-val--pos{color:#1D9E75;}
#statistics-page .st-act-sc-val--neg{color:#E24B4A;}
#statistics-page .st-act-sc-sub{
  font-size:8px;color:var(--st-text2);text-align:center;line-height:1.3;max-width:68px;
}
#statistics-page .st-act-sc-sub--pos{color:#1D9E75;}
#statistics-page .st-act-sc-sub--neg{color:#E24B4A;}
#statistics-page .st-act-sc-lbl{font-size:11px;color:var(--st-text2);text-align:center;}
body.theme-light #statistics-page .st-act-sc-ring--pos{background:rgba(29,158,117,.12);}
body.theme-light #statistics-page .st-act-sc-ring--neg{background:rgba(226,75,74,.1);}
/* Chips */
.st-chip{
  display:inline-flex;align-items:center;gap:4px;padding:4px 10px;
  border-radius:100px;border:0.5px solid var(--st-border);
  background:var(--st-bg2);font-size:11px;color:var(--st-text2);
  margin:0 3px 4px 0;cursor:pointer;transition:border-color .12s;
}
.st-chip:hover{border-color:#378ADD;color:rgba(255,255,255,.85);}
body.theme-light .st-chip:hover{color:rgba(0,0,0,.8);}
.st-chip-txt{max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.st-chip-n{font-weight:500;color:var(--color-text-primary);flex-shrink:0;}
#sTagChips{display:flex;flex-wrap:wrap;align-items:center;gap:0 2px;}
/* Heatmap */
.st-hmap{display:grid;grid-template-columns:repeat(12,1fr);gap:3px;}
.st-hm-c{aspect-ratio:1;border-radius:2px;cursor:pointer;transition:transform .1s;}
.st-hm-c:hover{transform:scale(1.3);}
/* Decade */
.st-dec-row{display:flex;align-items:center;gap:7px;padding:5px 0;border-bottom:0.5px solid var(--st-border);}
.st-dec-row:last-child{border-bottom:none;}
.st-dec-lbl{font-size:10px;color:var(--st-text3);width:34px;flex-shrink:0;}
.st-dec-bar{
  height:14px;border-radius:3px;background:rgba(32,101,212,.25);
  display:flex;align-items:center;padding:0 6px;cursor:pointer;transition:opacity .12s;
}
.st-dec-bar:hover{opacity:.8;}
.st-dec-num{font-size:9px;font-weight:500;color:#378ADD;}
/* Platforms */
.st-plat-wrap{display:flex;flex-wrap:wrap;gap:7px;align-items:flex-end;padding-top:4px;}
.st-plat-bub{
  border-radius:50%;display:flex;flex-direction:column;
  align-items:center;justify-content:center;cursor:pointer;transition:transform .15s;
}
.st-plat-bub:hover{transform:scale(1.08);}
/* Streak */
.st-streak-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.st-sc{aspect-ratio:1;border-radius:3px;background:var(--st-bg2);}
.st-sc.on{background:#2065d4;}
.st-sc.md{background:#85B7EB;}
/* Skeleton */
.st-sk-card{pointer-events:none;}
.st-sk-line{background:var(--st-bg2);}
@keyframes stPulse{0%,100%{opacity:.35}50%{opacity:.75}}
.sk-pulse{animation:stPulse 1.5s ease-in-out infinite;}
/* Panel */
.st-panel-overlay{
  position:fixed;inset:0;background:rgba(0,0,0,.4);z-index:1100;
  opacity:0;pointer-events:none;transition:opacity .25s;
}
.st-panel-overlay.open{opacity:1;pointer-events:all;}
.st-panel{
  position:fixed;top:0;right:0;width:320px;height:100%;
  background:rgb(17,17,19);border-left:0.5px solid var(--st-border);
  z-index:1101;transform:translateX(100%);transition:transform .25s;
  display:flex;flex-direction:column;overflow:hidden;
}
body.theme-light .st-panel{background:#fff;}
.st-panel.open{transform:translateX(0);}
.st-panel-head{
  display:flex;align-items:center;gap:8px;justify-content:space-between;
  padding:14px 16px;border-bottom:0.5px solid var(--st-border);flex-shrink:0;
}
.st-panel-title-wrap{
  flex:1 1 auto;min-width:0;
}
.st-panel-title{font-size:14px;font-weight:500;color:var(--color-text-primary);line-height:1.25;}
.st-panel-head-pager{
  display:flex;align-items:center;gap:5px;flex-shrink:0;
}
.st-panel-pager-info{
  font-size:11px;font-weight:500;color:var(--st-text3);white-space:nowrap;
}
.st-panel-pager-pill{
  appearance:none;-webkit-appearance:none;margin:0;padding:0 10px;min-width:34px;height:30px;
  border-radius:999px;font:inherit;font-size:16px;line-height:1;font-weight:600;
  cursor:pointer;border:0.5px solid var(--st-border);background:var(--st-bg2);color:var(--st-text2);
  display:flex;align-items:center;justify-content:center;
}
.st-panel-pager-pill:disabled{opacity:.35;cursor:default;}
body.theme-light .st-panel-pager-pill{background:#f2f2f7;}
.st-panel-close{
  width:26px;height:26px;border-radius:7px;border:0.5px solid var(--st-border);
  background:var(--st-bg2);cursor:pointer;display:flex;align-items:center;
  justify-content:center;font-size:14px;color:var(--st-text2);
}
.st-panel-body{padding:12px 16px;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch;}
.st-drill-pills{
  display:flex;flex-wrap:wrap;align-items:center;gap:8px;
  margin:0 0 12px 0;padding-bottom:10px;border-bottom:0.5px solid var(--st-border);
}
.st-drill-pill{
  appearance:none;-webkit-appearance:none;margin:0;padding:6px 12px;border-radius:999px;
  font:inherit;font-size:11px;font-weight:600;cursor:pointer;white-space:nowrap;
  background:var(--st-bg2);border:0.5px solid var(--st-border);color:var(--st-text2);
  transition:background .15s,border-color .15s,color .15s;
}
.st-drill-pill:hover{color:var(--color-text-primary);background:var(--st-bg);}
.st-drill-pill.active{
  background:rgba(32,101,212,.18);border-color:rgba(32,101,212,.35);color:var(--color-text-primary);
}
body.theme-light .st-drill-pill{background:#f2f2f7;border-color:rgba(0,0,0,.12);color:var(--text45);}
body.theme-light .st-drill-pill:hover{background:#e8e8ed;color:var(--text);}
body.theme-light .st-drill-pill.active{background:rgba(32,101,212,.12);border-color:rgba(32,101,212,.3);color:var(--text);}
.st-drill-list{display:flex;flex-direction:column;}
.st-film-row{
  display:flex;align-items:center;gap:10px;padding:9px 0;
  border-bottom:0.5px solid var(--st-border);
}
.st-film-row:last-child{border-bottom:none;}
.st-film-poster{
  width:36px;height:54px;border-radius:6px;flex-shrink:0;
  object-fit:cover;background:var(--st-bg2);
}
.st-film-title{font-size:13px;font-weight:500;color:var(--color-text-primary);margin-bottom:2px;}
.st-film-meta{font-size:11px;color:var(--st-text3);}
@media(max-width:768px){
  /* Панель drill по коллекции: не под статус-бар / вырез (viewport-fit=cover в meta) */
  .st-panel{
    width:100%;
    border-left:none;
    border-top:0.5px solid var(--st-border);
    padding-top:env(safe-area-inset-top, 0px);
    padding-bottom:env(safe-area-inset-bottom, 0px);
    height:100dvh;
    max-height:100dvh;
  }
  .stats-body{height:calc(100dvh - var(--list-header-h));}
  .challenges-body{height:calc(100dvh - var(--list-header-h));}
  .friends-body{height:calc(100dvh - var(--list-header-h));}
}

/* ── Марафоны / челленджи (V3 + SVG) ───────────────────────── */
.challenges-body{
  display:flex;flex-direction:column;
  height:calc(100vh - var(--list-header-h));overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:12px 16px 32px;
  box-sizing:border-box;
  width:100%;
  max-width:100%;
  margin:0;
}
/* Марафон v2: колонки со своим скроллом — без прокрутки всего challenges-body */
.challenges-body.challenges-body--marathon-v2{
  overflow:hidden;
  min-height:0;
  padding-bottom:12px;
}
.challenges-body.challenges-body--marathon-v2 .ch-marathon-root--v2{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.ch-marathon-root{
  width:100%;
  max-width:min(980px, calc(100vw - 32px));
  margin:0 auto;
  position:relative;
}
/* Полноширинная сетка марафонов (макет marathon_v2_fullwidth) */
.ch-marathon-root.ch-marathon-root--v2{
  max-width:100%;
  width:calc(100% + 32px);
  margin:-12px -16px 0;
  position:relative;
}
.ch2-page{
  width:100%;
  min-height:0;
  flex:1;
  display:flex;
  flex-direction:column;
}
.ch2-shell{
  width:100%;
  flex:1;
  min-height:0;
  display:grid;
  grid-template-columns:minmax(260px,min(46vw,560px)) 8px minmax(260px,1fr);
  align-items:stretch;
  gap:0;
}
@media(max-width:900px){
  .challenges-body.challenges-body--marathon-v2{
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .challenges-body.challenges-body--marathon-v2 .ch-marathon-root--v2{
    flex:none;
    min-height:0;
  }
  .ch2-page{flex:none;}
  .ch2-shell{
    grid-template-columns:1fr;
    grid-auto-rows:auto;
    flex:none;
    min-height:min(700px,calc(100dvh - var(--list-header-h) - 48px));
  }
  .ch2-split{display:none !important;}
  .ch2-left{overflow:visible;}
  .ch2-left-body{overflow:visible;flex:none;}
  .ch2-right{overflow:visible;}
  .ch2-right-body{overflow:visible;flex:none;}
}
.ch2-left{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  overflow:hidden;
}
.ch2-split{
  position:relative;
  z-index:2;
  width:8px;
  margin:0 -2px;
  flex-shrink:0;
  cursor:col-resize;
  touch-action:none;
  align-self:stretch;
  background:transparent;
  border:none;
  padding:0;
  border-radius:4px;
  transition:background .15s ease;
  font-size:0;
  color:transparent;
  font-family:inherit;
}
.ch2-split:hover,.ch2-split:focus-visible{
  background:var(--hover-bg);
}
.ch2-split:focus-visible{
  outline:2px solid rgba(32,101,212,.45);
  outline-offset:-1px;
}
.ch2-split::after{
  content:'';
  position:absolute;
  left:50%;
  top:10px;
  bottom:10px;
  width:3px;
  transform:translateX(-50%);
  border-radius:3px;
  background:var(--border2);
  pointer-events:none;
}
.ch2-split:hover::after,.ch2-split:focus-visible::after{
  background:rgba(32,101,212,.45);
}
.ch2-right{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  overflow:hidden;
}
.ch2-left-header{
  flex-shrink:0;
  padding:16px 22px 13px;border-bottom:0.5px solid var(--border);
  display:flex;align-items:flex-start;justify-content:space-between;gap:12px;flex-wrap:wrap;
}
.ch2-lh-title{font-size:20px;font-weight:600;letter-spacing:-.2px;color:var(--color-text-primary);}
.ch2-lh-title span{color:var(--text35);}
.ch2-lh-sub{font-size:11px;color:var(--text35);margin-top:2px;}
.ch2-focus-tabs{
  display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  padding:2px 0;margin-top:10px;width:100%;scrollbar-width:thin;
}
.ch2-focus-tabs::-webkit-scrollbar{height:4px;}
.ch2-focus-tabs::-webkit-scrollbar-thumb{background:var(--text12);border-radius:4px;}
.ch2-focus-tab{
  flex:0 0 auto;max-width:min(220px,78vw);padding:8px 12px;border-radius:10px;cursor:pointer;
  border:0.5px solid var(--border2);background:var(--hover-bg);color:var(--color-text-primary);
  font-size:11px;font-weight:600;line-height:1.25;text-align:left;white-space:nowrap;overflow:hidden;
  text-overflow:ellipsis;font-family:inherit;
}
.ch2-focus-tab:hover{border-color:var(--border2);background:var(--hover-bg2);}
.ch2-focus-tab.is-active{
  border-color:rgba(32,101,212,.5);background:rgba(32,101,212,.14);color:var(--color-text-primary);
}
.ch2-left-body{
  padding:16px 22px;
  display:flex;
  flex-direction:column;
  gap:18px;
  flex:1;
  min-width:0;
  min-height:0;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
.ch2-stitle{
  font-size:12px;font-weight:500;color:var(--text35);text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;
}
.ch2-active-wrap{
  background:var(--surface2);border:0.5px solid var(--border);border-radius:16px;overflow:hidden;
}
.ch2-active-top{
  padding:14px 16px;border-bottom:0.5px solid var(--border);
  display:flex;align-items:center;gap:10px;
}
.ch2-a-icon{
  width:38px;height:38px;border-radius:11px;display:flex;align-items:center;justify-content:center;
  font-size:20px;flex-shrink:0;line-height:1;
}
.ch2-a-title{font-size:14px;font-weight:600;color:var(--color-text-primary);}
.ch2-a-meta{font-size:11px;color:var(--text35);margin-top:1px;}
.ch2-a-status{
  margin-left:auto;padding:4px 11px;border-radius:100px;font-size:11px;font-weight:500;
  background:rgba(29,158,117,.1);color:#1D9E75;border:0.5px solid rgba(29,158,117,.2);flex-shrink:0;
}
.ch2-a-status--done{
  background:rgba(32,101,212,.1);
  color:#85B7EB;
  border-color:rgba(32,101,212,.28);
}
.ch2-a-join{
  margin-left:auto;
  font-size:11px;
  font-weight:600;
  padding:6px 10px;
  border-radius:999px;
  border:0.5px solid rgba(32,101,212,.5);
  background:rgba(32,101,212,.12);
  color:#85B7EB;
  font-family:inherit;
  cursor:pointer;
  flex-shrink:0;
  transition:background .15s,border-color .15s;
}
.ch2-a-join:hover{background:rgba(32,101,212,.2);}
.ch2-a-join:disabled{opacity:.65;cursor:default;}
.ch2-view-tabs{display:flex;gap:5px;padding:12px 16px 0;border-bottom:0.5px solid var(--border3);}
.ch2-vtab{
  padding:5px 12px;border-radius:8px 8px 0 0;font-size:11px;color:var(--text35);cursor:pointer;transition:color .15s,border-color .15s,background .15s;
  border:0.5px solid transparent;border-bottom:none;margin-bottom:-0.5px;background:transparent;font-family:inherit;
}
.ch2-vtab.on{
  background:var(--surface2);border-color:var(--border);color:var(--text80);
}
.ch2-vtab:hover:not(.on){color:var(--text55);}
.ch2-view-body{padding:16px;}
.ch2-view{display:none;}
.ch2-view.on{display:block;}
.ch2-hbar-row{display:flex;align-items:center;gap:9px;margin-bottom:8px;}
.ch2-hb-rank{width:18px;font-size:12px;font-weight:700;color:var(--text25);text-align:center;flex-shrink:0;}
.ch2-hb-rank.g{color:#EF9F27;}
.ch2-hb-rank.s{color:#aaa;}
.ch2-hb-av{
  width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700;flex-shrink:0;color:#fff;
}
.ch2-hb-name{
  font-size:12px;
  font-weight:500;
  width:clamp(92px,18vw,170px);
  min-width:0;
  flex-shrink:0;
  color:var(--text65);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ch2-hb-track{
  flex:1;min-width:0;height:22px;background:var(--progress-bg);border-radius:7px;overflow:hidden;position:relative;
}
.ch2-hb-fill{height:100%;border-radius:7px;display:flex;align-items:center;padding:0 8px;}
.ch2-hb-pct{font-size:11px;font-weight:600;color:#fff;}
.ch2-hb-cnt{font-size:10px;color:var(--text35);flex-shrink:0;width:36px;text-align:right;}
.ch2-hb-new{
  font-size:9px;font-weight:600;padding:2px 5px;border-radius:100px;background:rgba(29,158,117,.12);color:#1D9E75;flex-shrink:0;
}
.ch2-radial-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
@media(max-width:520px){.ch2-radial-grid{grid-template-columns:repeat(2,1fr);}}
.ch2-rc{
  display:flex;flex-direction:column;align-items:center;gap:7px;padding:12px 8px;border-radius:14px;
  border:0.5px solid var(--border);background:var(--tag-bg);cursor:default;transition:border-color .15s;
}
.ch2-rc:hover{border-color:var(--border2);}
.ch2-rc.me{border-color:rgba(32,101,212,.22);background:rgba(32,101,212,.06);}
.ch2-rc-name{font-size:11px;font-weight:500;text-align:center;color:var(--color-text-primary);}
.ch2-rc-films{font-size:10px;color:var(--text35);}
.ch2-rc-rank{font-size:9px;font-weight:600;padding:2px 8px;border-radius:100px;}
.ch2-race-hint{font-size:10px;color:var(--text35);margin-bottom:10px;}
.ch2-race-row{display:flex;align-items:center;gap:9px;margin-bottom:8px;}
.ch2-race-av{
  width:24px;height:24px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:9px;font-weight:700;flex-shrink:0;color:#fff;
}
.ch2-race-name{
  font-size:11px;
  width:clamp(92px,18vw,170px);
  min-width:0;
  flex-shrink:0;
  color:var(--text45);
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis;
}
.ch2-race-track{
  flex:1;min-width:0;height:10px;background:var(--progress-bg);border-radius:100px;overflow:hidden;position:relative;
}
.ch2-race-fill{height:100%;border-radius:100px;position:relative;}
.ch2-race-flag{
  position:absolute;right:-2px;top:50%;transform:translateY(-50%);width:8px;height:8px;border-radius:50%;border:1.5px solid var(--bg);
}
.ch2-race-pct{font-size:11px;font-weight:500;width:30px;text-align:right;flex-shrink:0;}
.ch2-stats-bar{display:grid;grid-template-columns:repeat(4,1fr);gap:1px;background:var(--border3);}
.ch2-sb{background:var(--surface2);padding:11px;text-align:center;}
.ch2-sb-val{font-size:17px;font-weight:500;color:var(--color-text-primary);}
.ch2-sb-lbl{font-size:9px;color:var(--text35);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.ch2-earned-row{display:flex;gap:7px;flex-wrap:wrap;}
.ch2-ebadge{
  display:flex;align-items:center;gap:6px;padding:7px 13px;border-radius:12px;border:0.5px solid;cursor:default;
}
.ch2-ebadge .ch-svg{width:18px;height:18px;display:block;}
.ch2-rw-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;}
@media(max-width:520px){.ch2-rw-grid{grid-template-columns:1fr;}}
.ch2-rw-card{
  border-radius:12px;padding:12px;border:0.5px solid;display:flex;align-items:center;gap:9px;cursor:default;
}
.ch2-rw-ico{font-size:22px;flex-shrink:0;}
.ch2-rw-title{font-size:12px;font-weight:500;margin-bottom:1px;color:var(--color-text-primary);}
.ch2-rw-desc{font-size:10px;opacity:.55;line-height:1.3;color:var(--color-text-primary);}
.ch2-rw-tag{display:inline-block;margin-top:4px;padding:2px 7px;border-radius:100px;font-size:9px;font-weight:600;}
.ch2-rw-lock{opacity:.35;filter:grayscale(.85);}
.ch2-right-header{
  flex-shrink:0;
  padding:16px 20px 13px;
  border-bottom:0.5px solid var(--border);
}
.ch2-right-title{font-size:10px;font-weight:500;color:var(--text35);text-transform:uppercase;letter-spacing:.07em;}
.ch2-right-body{
  flex:1;
  min-height:0;
  min-width:0;
  padding:16px 20px;
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:12px;
  align-items:start;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
}
@media(max-width:700px){.ch2-right-body{grid-template-columns:1fr;}}
.ch2-mcard{
  border-radius:15px;padding:15px;border:0.5px solid var(--border);cursor:default;
  transition:transform .16s,border-color .16s;display:flex;flex-direction:column;gap:0;
}
.ch2-mcard:hover{transform:translateY(-2px);border-color:var(--border2);}
.ch2-mcard.ch-mcard-focus{cursor:pointer;}
.ch2-mcard.ch-mcard-focus:hover{border-color:rgba(32,101,212,.28);}
.ch2-mc-top{display:flex;align-items:flex-start;gap:9px;margin-bottom:8px;}
.ch2-mc-icon{
  width:36px;height:36px;border-radius:10px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;color:rgba(255,255,255,.9);
}
.ch2-mc-icon .ch-svg{width:20px;height:20px;}
.ch2-mc-badge{display:inline-flex;padding:2px 8px;border-radius:100px;font-size:9px;font-weight:700;letter-spacing:.04em;}
.ch2-mc-title{font-size:13px;font-weight:500;margin-bottom:3px;line-height:1.3;color:var(--color-text-primary);}
.ch2-mc-desc{font-size:11px;color:var(--text45);line-height:1.4;margin-bottom:9px;}
.ch2-mc-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;flex-wrap:wrap;}
.ch2-mc-meta{font-size:10px;color:var(--text35);}
.ch2-mcard .ch-mcard-join{padding:6px 13px;border-radius:100px;font-size:11px;}
.ch2-empty-card{
  padding:28px 16px;text-align:center;font-size:13px;color:var(--text45);border:0.5px dashed var(--border);
  border-radius:16px;background:var(--surface2);
}
.ch2-active-wrap .ch-m-details-pill{margin:0 16px 16px;}
.ch2-rc svg text{fill:var(--color-text-primary);}
.ch-m-page{display:flex;flex-direction:column;gap:26px;}
.ch-m-hero-title{
  text-align:center;font-size:clamp(22px,5vw,30px);font-weight:700;letter-spacing:-.3px;color:var(--color-text-primary);
}
.ch-m-hero-title span{color:rgba(255,255,255,.28);}
.ch-m-hero-sub{
  text-align:center;font-size:14px;color:rgba(255,255,255,.35);margin-top:4px;margin-bottom:4px;
}
.ch-m-active-head{
  display:flex;align-items:center;justify-content:space-between;gap:10px 14px;
  flex-wrap:wrap;margin-bottom:2px;
}
.ch-m-stitle--active-line{margin-bottom:0;}
.ch-m-active-tabs{
  display:flex;flex-wrap:nowrap;gap:8px;overflow-x:auto;-webkit-overflow-scrolling:touch;
  padding:2px 0;margin:0;scrollbar-width:thin;min-width:0;
  flex:0 1 auto;justify-content:flex-end;
}
.ch-m-active-head .ch-m-active-tabs{
  max-width:100%;
}
@media(max-width:560px){
  .ch-m-active-head{align-items:flex-start;}
  .ch-m-active-head .ch-m-active-tabs{
    width:100%;justify-content:flex-start;padding-bottom:2px;
  }
}
.ch-m-active-tabs::-webkit-scrollbar{height:4px;}
.ch-m-active-tabs::-webkit-scrollbar-thumb{background:rgba(255,255,255,.12);border-radius:4px;}
.ch-m-focus-tab{
  flex:0 0 auto;max-width:min(220px,78vw);padding:10px 14px;border-radius:14px;cursor:pointer;
  border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);color:var(--color-text-primary);
  font-size:12px;font-weight:600;line-height:1.25;text-align:left;
  white-space:nowrap;overflow:hidden;text-overflow:ellipsis;font-family:inherit;
}
.ch-m-focus-tab:hover{border-color:rgba(255,255,255,.2);background:rgba(255,255,255,.06);}
.ch-m-focus-tab.is-active{
  border-color:rgba(32,101,212,.5);background:rgba(32,101,212,.14);color:#fff;
}
.ch-m-section{display:flex;flex-direction:column;gap:12px;}
.ch-m-stitle{
  font-size:10px;font-weight:600;color:rgba(255,255,255,.28);text-transform:uppercase;
  letter-spacing:.07em;margin-bottom:2px;
}
.ch-m-card{
  background:#0c0c0e;border:0.5px solid rgba(255,255,255,.09);border-radius:20px;padding:18px 20px;
  box-sizing:border-box;
}
.ch-m-hero-grid{display:grid;grid-template-columns:auto 1fr;gap:20px;align-items:center;}
@media(max-width:520px){
  .ch-m-hero-grid{grid-template-columns:1fr;justify-items:center;text-align:center;}
  .ch-m-hero-side{width:100%;text-align:left;}
}
.ch-m-ring-wrap{display:flex;justify-content:center;}
.ch-m-ring-svg{display:block;}
.ch-m-ring-abbr{fill:var(--color-text-primary);font-weight:700;}
.ch-m-ring-sub{fill:rgba(255,255,255,.4);font-size:11px;}
.ch-m-ring-label{
  font-size:10px;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.06em;
  display:flex;align-items:center;gap:7px;margin-bottom:8px;
}
.ch-m-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
.ch-m-leg-row{display:flex;align-items:center;justify-content:space-between;margin-bottom:4px;}
.ch-m-leg-name{font-size:13px;color:rgba(255,255,255,.65);}
.ch-m-leg-val{font-size:13px;font-weight:600;}
.ch-m-leg-bar{height:3px;border-radius:2px;margin-top:2px;margin-bottom:10px;max-width:100%;}
.ch-m-leg-bar--mock{opacity:.65;}
.ch-m-mock-wrap{margin-top:4px;}
.ch-m-mock-badge{
  font-size:10px;color:rgba(255,255,255,.45);margin-bottom:10px;padding:8px 12px;border-radius:12px;
  border:0.5px dashed rgba(255,255,255,.18);display:inline-block;line-height:1.35;max-width:100%;
}
.ch-m-mock-hero{
  display:grid;grid-template-columns:auto 1fr;gap:24px;align-items:center;
}
@media(max-width:520px){
  .ch-m-mock-hero{grid-template-columns:1fr;justify-items:center;}
  .ch-m-mock-legend{width:100%;text-align:left;}
}
.ch-m-mock-ring-svg{display:flex;justify-content:center;}
.ch-m-mock-grid2{margin-top:4px;}
.ch-m-stitle--mock{margin-bottom:16px;}
.ch-m-timeline{display:flex;flex-direction:column;gap:8px;}
.ch-m-tl-row{display:flex;align-items:center;gap:10px;}
.ch-m-tl-av{
  width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:#fff;flex-shrink:0;
}
.ch-m-tl-name{width:52px;flex-shrink:0;font-size:12px;color:rgba(255,255,255,.6);}
.ch-m-tl-name--me{color:#fff;font-weight:600;}
.ch-m-tl-track{
  flex:1;height:22px;background:rgba(255,255,255,.05);border-radius:6px;position:relative;overflow:hidden;
  min-width:0;
}
.ch-m-tl-fill{height:100%;border-radius:6px;display:flex;align-items:center;justify-content:flex-end;padding-right:8px;}
.ch-m-tl-pct{font-size:10px;font-weight:600;color:#fff;}
.ch-m-tl-meta{font-size:9px;width:40px;text-align:right;flex-shrink:0;color:rgba(29,158,117,.9);}
.ch-m-tl-meta--dim{color:rgba(255,255,255,.22);}
.ch-m-friends-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:12px;
}
@media(max-width:520px){
  .ch-m-friends-grid{grid-template-columns:repeat(2,1fr);}
}
.ch-m-fcell{
  display:flex;flex-direction:column;align-items:center;gap:8px;padding:14px 10px;border-radius:16px;
  border:0.5px solid rgba(255,255,255,.07);background:rgba(255,255,255,.02);text-align:center;
}
.ch-m-fcell--me{border-color:rgba(32,101,212,.25);background:rgba(32,101,212,.06);}
.ch-m-fcell-pct{font-size:11px;font-weight:700;color:#fff;fill:currentColor;}
.ch-m-fcell-name{font-size:12px;font-weight:500;color:var(--color-text-primary);}
.ch-m-fcell-rank{font-size:9px;font-weight:700;padding:2px 8px;border-radius:100px;background:rgba(255,255,255,.08);color:rgba(255,255,255,.5);}
.ch-m-friends-hint{font-size:11px;color:rgba(255,255,255,.25);margin:8px 0 0;}
.ch-m-status{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-top:10px;}
.ch-m-pill{
  padding:5px 13px;border-radius:100px;font-size:11px;font-weight:500;
  background:rgba(29,158,117,.12);color:#1D9E75;border:0.5px solid rgba(29,158,117,.22);
}
.ch-m-days{font-size:12px;color:rgba(255,255,255,.3);}
.ch-m-grid2{display:grid;grid-template-columns:1fr 1fr;gap:14px;}
@media(max-width:640px){.ch-m-grid2{grid-template-columns:1fr;}}
.ch-m-grid3{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
@media(max-width:900px){.ch-m-grid3{grid-template-columns:repeat(2,1fr);}}
@media(max-width:480px){.ch-m-grid3{grid-template-columns:1fr;}}
.ch-rw-row{display:flex;gap:10px;flex-wrap:wrap;}
.ch-rw-pill{
  display:flex;align-items:center;gap:8px;padding:10px 14px;border-radius:14px;border:0.5px solid;
  min-width:0;
}
.ch-rw-pill--lock{opacity:.45;filter:grayscale(.85);}
.ch-rw-ic{display:flex;align-items:center;justify-content:center;}
.ch-rw-ic .ch-svg{width:20px;height:20px;}
.ch-rw-text{display:flex;flex-direction:column;gap:1px;min-width:0;}
.ch-rw-name{font-size:12px;font-weight:600;}
.ch-rw-desc{font-size:10px;opacity:.65;}
.ch-rw-empty{font-size:12px;color:var(--st-text3);line-height:1.4;}
.ch-mcard{
  border-radius:20px;padding:16px;display:flex;flex-direction:column;gap:10px;
  border:0.5px solid rgba(255,255,255,.08);transition:transform .18s,border-color .18s;
  cursor:default;
}
.ch-mcard-focus{cursor:pointer;}
.ch-mcard-focus:hover{border-color:rgba(32,101,212,.28);}
.ch-mcard:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.14);}
.ch-mcard-top{display:flex;align-items:flex-start;gap:10px;}
.ch-mcard-icon{
  width:42px;height:42px;border-radius:13px;display:flex;align-items:center;justify-content:center;
  flex-shrink:0;color:rgba(255,255,255,.85);
}
.ch-mcard-icon .ch-svg{width:22px;height:22px;}
.ch-mcard-badge{display:inline-flex;padding:3px 9px;border-radius:100px;font-size:9px;font-weight:700;letter-spacing:.04em;}
.ch-mcard-title{font-size:14px;font-weight:600;line-height:1.3;color:var(--color-text-primary);}
.ch-mcard-desc{font-size:11px;color:rgba(255,255,255,.4);line-height:1.4;}
.ch-mcard-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:4px;flex-wrap:wrap;}
.ch-mcard-meta{font-size:11px;color:rgba(255,255,255,.35);}
.ch-mcard-join{
  padding:7px 16px;border-radius:100px;font-size:12px;font-weight:600;border:none;cursor:pointer;
  font-family:inherit;white-space:nowrap;
}
.ch-mcard-join:disabled{opacity:.45;cursor:default;transform:none;}
.ch-svg{flex-shrink:0;}
.ch-f-check .ch-svg{width:16px;height:16px;display:block;}
.challenges-loading,.challenges-err,.challenges-empty{
  font-size:13px;color:var(--st-text3);padding:12px 0;
}
.challenges-details{
  margin-top:12px;font-size:12px;color:var(--st-text2);
}
.challenges-details.ch-m-details:not(.ch-m-details-pill) summary{cursor:pointer;user-select:none;padding:8px 0;}
.ch-m-details-pill{margin-top:14px;}
.ch-m-details-summary-pill{
  list-style:none;display:inline-flex;align-items:center;gap:10px;padding:10px 18px;border-radius:100px;cursor:pointer;
  user-select:none;font-size:12px;font-weight:600;color:rgba(255,255,255,.78);
  background:rgba(255,255,255,.06);border:0.5px solid rgba(255,255,255,.1);
  transition:background .22s ease,border-color .22s ease,box-shadow .22s ease,color .2s ease,transform .18s cubic-bezier(0.4,0,0.2,1);
}
.ch-m-details-summary-pill::-webkit-details-marker{display:none;}
.ch-m-details-summary-pill::marker{content:'';}
.ch-m-details-summary-pill:hover{
  background:rgba(255,255,255,.09);border-color:rgba(255,255,255,.14);
}
.ch-m-details-summary-pill:active{transform:scale(0.98);}
.ch-m-details-summary-pill:focus-visible{
  outline:2px solid rgba(32,101,212,.45);outline-offset:2px;
}
.ch-m-details-summary-pill::after{
  content:'';width:6px;height:6px;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor;
  transform:rotate(45deg);opacity:.75;flex-shrink:0;margin-top:-2px;
  transition:transform .32s cubic-bezier(0.4,0,0.2,1),opacity .2s ease;
}
.ch-m-details-pill[open] .ch-m-details-summary-pill{
  background:rgba(255,255,255,.1);border-color:rgba(32,101,212,.28);color:#fff;
}
.ch-m-details-pill[open] .ch-m-details-summary-pill::after{
  transform:rotate(225deg);margin-top:2px;opacity:.95;
}
.ch-m-details-body{
  display:grid;grid-template-rows:0fr;
  transition:grid-template-rows .38s cubic-bezier(0.4,0,0.2,1);
}
.ch-m-details-pill[open] .ch-m-details-body{grid-template-rows:1fr;}
.ch-m-details-pill[open].ch-m-details-pill--closing .ch-m-details-body{grid-template-rows:0fr;}
@media(prefers-reduced-motion:reduce){
  .ch-m-details-body{transition-duration:.01ms;}
  .ch-m-details-summary-pill,.ch-m-details-summary-pill::after{transition-duration:.01ms;}
}
.ch-m-details-body-inner{overflow:hidden;min-height:0;}
.challenges-film-list{display:flex;flex-direction:column;gap:0;margin-top:6px;}
.ch-m-details-pill .challenges-film-list{margin-top:0;padding-top:10px;}
.challenges-film-row{
  display:flex;align-items:flex-start;gap:10px;padding:8px 0;
  border-bottom:0.5px solid var(--st-border);font-size:13px;color:var(--color-text-primary);
}
.challenges-film-row[data-ch-tmdb]{
  cursor:pointer;border-radius:10px;padding:8px 10px;margin:0 -10px;
  transition:background .15s ease;
}
.challenges-film-row[data-ch-tmdb]:hover{background:rgba(255,255,255,.05);}
.challenges-film-row[data-ch-tmdb]:active{background:rgba(255,255,255,.08);}
.challenges-film-row[data-ch-tmdb]:focus-visible{
  outline:2px solid rgba(32,101,212,.45);outline-offset:2px;
}
.challenges-film-row:last-child{border-bottom:none;}
.challenges-film-row.is-done{opacity:.92;}
.ch-f-check{flex-shrink:0;display:flex;align-items:center;justify-content:center;color:var(--st-text3);}
.challenges-film-row.is-done .ch-f-check{color:#34c759;}
.ch-f-title{flex:1;min-width:0;line-height:1.35;}
.menu-row--challenges .menu-row-label{flex:1;}
.menu-challenge-reward-line{
  margin-left:auto;font-size:15px;letter-spacing:2px;line-height:1;
  flex-shrink:0;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;
}

/* ── Друзья (макет v2) ───────────────────────── */
.friends-body{
  display:flex;flex-direction:column;
  height:calc(100vh - var(--list-header-h));overflow-y:auto;
  -webkit-overflow-scrolling:touch;
  padding:12px 0 32px;
  box-sizing:border-box;width:100%;max-width:100%;margin:0;
}
.friends-body.friends-body--fr-split{
  overflow:hidden;
  min-height:0;
  padding-bottom:12px;
}
.friends-body.friends-body--fr-split .friends-page-root{
  flex:1;
  min-height:0;
  display:flex;
  flex-direction:column;
}
.friends-page-root{
  width:100%;
  max-width:100%;
  margin:0;
  display:flex;flex-direction:column;gap:0;
  flex:1;
  min-height:0;
}
.fr-mock-badge{
  font-size:10px;color:rgba(255,255,255,.45);padding:8px 12px;border-radius:12px;
  border:0.5px dashed rgba(255,255,255,.18);line-height:1.35;max-width:100%;
}
.fr-topbar{display:flex;align-items:center;justify-content:space-between;gap:12px;}
.fr-back-btn{
  width:36px;height:36px;border-radius:50%;border:0.5px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);display:flex;align-items:center;justify-content:center;cursor:pointer;
  flex-shrink:0;padding:0;font-family:inherit;color:inherit;
}
.fr-back-btn svg{width:16px;height:16px;stroke:rgba(255,255,255,.6);fill:none;stroke-width:2;}
.fr-friends-panel-wrap{position:relative;margin-left:auto;}
.fr-trigger{
  display:flex;align-items:center;gap:8px;cursor:pointer;padding:5px 14px 5px 6px;border-radius:100px;
  border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.05);transition:background .15s,border-color .15s;
  font-family:inherit;color:inherit;
}
.fr-trigger:hover{background:rgba(255,255,255,.08);}
.fr-ft-av{
  width:30px;height:30px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:700;color:#fff;
}
.fr-ft-name{font-size:13px;font-weight:500;}
.fr-ft-arrow{width:12px;height:12px;stroke:rgba(255,255,255,.4);fill:none;stroke-width:2;stroke-linecap:round;transition:transform .2s;flex-shrink:0;}
.fr-ft-arrow.open{transform:rotate(180deg);}
.fr-dropdown{
  display:none;position:absolute;top:calc(100% + 8px);right:0;width:min(240px,92vw);
  background:rgba(16,16,18,.98);border:0.5px solid rgba(255,255,255,.12);border-radius:18px;z-index:200;
  overflow:hidden;box-shadow:0 8px 32px rgba(0,0,0,.7);
}
.fr-dropdown.open{display:block;}
.fr-fd-head{padding:12px 14px 8px;font-size:10px;font-weight:600;color:rgba(255,255,255,.3);text-transform:uppercase;letter-spacing:.07em;}
.fr-fd-item{
  display:flex;align-items:center;gap:10px;width:100%;padding:9px 14px;cursor:pointer;transition:background .12s;
  border:none;background:transparent;font:inherit;color:inherit;text-align:left;
}
.fr-fd-item:hover{background:rgba(255,255,255,.05);}
.fr-fd-item.is-active{background:rgba(32,101,212,.1);}
.fr-fd-av{
  width:28px;height:28px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:700;color:#fff;flex-shrink:0;
}
.fr-fd-name{font-size:13px;font-weight:500;flex:1;}
.fr-fd-you{font-size:10px;color:rgba(32,101,212,.8);font-weight:500;}
.fr-fd-online{width:7px;height:7px;border-radius:50%;background:#1D9E75;flex-shrink:0;}
.fr-fd-offline{width:7px;height:7px;border-radius:50%;background:rgba(255,255,255,.2);flex-shrink:0;}
.fr-fd-divider{height:0.5px;background:rgba(255,255,255,.07);margin:4px 0;}
.fr-fd-add{
  display:flex;align-items:center;gap:8px;padding:10px 14px;cursor:pointer;transition:background .12s,color .12s;
  color:rgba(255,255,255,.4);border:none;background:transparent;width:100%;font:inherit;text-align:left;
}
.fr-fd-add:hover{background:rgba(255,255,255,.04);color:#fff;}
.fr-fd-add-icon{
  width:26px;height:26px;border-radius:50%;border:0.5px solid rgba(255,255,255,.15);
  display:flex;align-items:center;justify-content:center;flex-shrink:0;
}
.fr-fd-add-icon svg{width:12px;height:12px;stroke:currentColor;fill:none;stroke-width:2;}
.fr-profile-hero{display:flex;align-items:center;gap:16px;}
.fr-profile-av{
  width:64px;height:64px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:700;flex-shrink:0;border:2px solid rgba(255,255,255,.12);color:#fff;
}
.fr-profile-name{font-size:22px;font-weight:700;margin-bottom:3px;color:var(--color-text-primary);}
.fr-profile-handle{font-size:13px;color:rgba(255,255,255,.35);margin-bottom:8px;}
.fr-profile-badges{display:flex;gap:7px;flex-wrap:wrap;}
.fr-badge-pill{display:flex;align-items:center;gap:5px;padding:4px 10px;border-radius:100px;font-size:11px;font-weight:500;border:0.5px solid;}
.fr-profile-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:10px;}
.fr-ps{
  background:#0c0c0e;border:0.5px solid rgba(255,255,255,.08);border-radius:16px;padding:14px;text-align:center;
}
.fr-ps-val{font-size:22px;font-weight:600;color:var(--color-text-primary);}
.fr-ps-lbl{font-size:10px;color:rgba(255,255,255,.3);margin-top:3px;text-transform:uppercase;letter-spacing:.04em;}
.fr-stitle{font-size:10px;font-weight:600;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.07em;margin-bottom:12px;}
.fr-common-head{display:flex;align-items:baseline;gap:10px;margin-bottom:12px;}
.fr-common-head .fr-stitle{margin-bottom:0;}
.fr-common-count{font-size:11px;color:rgba(255,255,255,.25);}
.fr-common-tabs{display:flex;gap:7px;margin-bottom:14px;}
.fr-ctab{
  padding:6px 16px;border-radius:100px;border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.04);
  font-size:13px;color:rgba(255,255,255,.5);cursor:pointer;transition:all .15s;font-family:inherit;
}
.fr-ctab.is-active{background:rgba(32,101,212,.18);border-color:rgba(32,101,212,.4);color:#85B7EB;font-weight:500;}
.fr-common-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px;}
@media(max-width:640px){.fr-common-grid{grid-template-columns:repeat(3,1fr);}}
.fr-ccard{
  background:#0c0c0e;border:0.5px solid rgba(255,255,255,.08);border-radius:12px;padding:10px;
  display:flex;flex-direction:column;align-items:center;gap:6px;cursor:pointer;transition:border-color .15s;
}
.fr-ccard:hover{border-color:rgba(255,255,255,.16);}
.fr-cposter{width:40px;height:60px;border-radius:7px;display:flex;align-items:center;justify-content:center;font-size:20px;background:rgba(255,255,255,.06);}
.fr-ctitle{font-size:10px;color:rgba(255,255,255,.5);text-align:center;line-height:1.3;}
.fr-rewards-block{background:#0c0c0e;border:0.5px solid rgba(255,255,255,.08);border-radius:20px;padding:18px 20px;}
.fr-rewards-scroll{display:flex;flex-wrap:wrap;gap:8px;}
.fr-rw{
  display:flex;align-items:center;gap:7px;padding:8px 14px;border-radius:14px;border:0.5px solid;cursor:pointer;
  transition:filter .15s;
}
.fr-rw:hover{filter:brightness(1.1);}
.fr-rw-icon{font-size:18px;}
.fr-rw-text{display:flex;flex-direction:column;min-width:0;}
.fr-rw-name{font-size:12px;font-weight:600;line-height:1.2;}
.fr-rw-from{font-size:10px;opacity:.5;}
.fr-m-list{display:flex;flex-direction:column;gap:9px;}
.fr-m-extra-row{display:none !important;}
.fr-m-list.is-expanded .fr-m-extra-row{display:flex !important;}
.fr-m-more-btn{
  align-self:flex-start;margin-top:2px;padding:7px 14px;border-radius:10px;font-size:12px;font-weight:500;
  font-family:inherit;cursor:pointer;color:rgba(132,179,235,.95);
  border:0.5px solid rgba(32,101,212,.4);background:rgba(32,101,212,.12);
  transition:background .12s,border-color .12s;
}
.fr-m-more-btn:hover{background:rgba(32,101,212,.2);border-color:rgba(32,101,212,.55);}
.fr-mrow{
  display:flex;align-items:center;gap:12px;padding:13px 16px;background:#0c0c0e;border:0.5px solid rgba(255,255,255,.08);
  border-radius:16px;cursor:pointer;transition:border-color .15s;
}
.fr-mrow:hover{border-color:rgba(255,255,255,.15);}
.fr-mrow-icon{font-size:22px;flex-shrink:0;}
.fr-mrow-body{flex:1;min-width:0;}
.fr-mrow-title{font-size:13px;font-weight:500;margin-bottom:5px;color:var(--color-text-primary);}
.fr-mrow-prog-wrap{display:flex;align-items:center;gap:8px;}
.fr-mrow-track{flex:1;height:4px;background:rgba(255,255,255,.08);border-radius:2px;overflow:hidden;min-width:0;}
.fr-mrow-fill{height:100%;border-radius:2px;}
.fr-mrow-pct{font-size:11px;font-weight:500;white-space:nowrap;}
.fr-mrow-status{font-size:10px;font-weight:500;padding:3px 9px;border-radius:100px;flex-shrink:0;}
.fr-lists-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;overflow:visible;}
@media(max-width:720px){.fr-lists-grid{grid-template-columns:repeat(2,1fr);}}
@media(max-width:420px){.fr-lists-grid{grid-template-columns:1fr;}}
.fr-lcard{
  background:#0c0c0e;border:0.5px solid rgba(255,255,255,.08);border-radius:18px;padding:16px;cursor:pointer;
  transition:border-color .18s,transform .18s;
}
.fr-lcard:hover{border-color:rgba(255,255,255,.16);transform:translateY(-2px);}
.fr-lcard-posters{display:flex;gap:3px;margin-bottom:10px;height:70px;border-radius:10px;overflow:hidden;}
.fr-lp{flex:1;border-radius:6px;display:flex;align-items:center;justify-content:center;font-size:18px;}
.fr-lp--img{padding:0;overflow:hidden;min-width:0;}
.fr-lp--img img{display:block;width:100%;height:100%;object-fit:cover;}
.fr-lp--ph{min-height:1px;}
.fr-lcard-title{font-size:13px;font-weight:600;margin-bottom:4px;color:var(--color-text-primary);}
.fr-lcard-meta{font-size:11px;color:rgba(255,255,255,.35);}
.fr-lcard--new{
  border-style:dashed;border-color:rgba(255,255,255,.12);background:transparent;
  display:flex;flex-direction:column;align-items:center;justify-content:center;gap:6px;min-height:140px;
}
.fr-lcard-new-ic{
  width:32px;height:32px;border-radius:50%;border:0.5px solid rgba(255,255,255,.15);
  display:flex;align-items:center;justify-content:center;
}
.fr-lcard--list{position:relative;overflow:visible;padding-bottom:46px;}
.fr-lcard-more-btn{
  position:absolute;bottom:12px;right:12px;width:36px;height:36px;border-radius:50%;
  border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);
  color:rgba(255,255,255,.55);cursor:pointer;font-size:17px;line-height:1;
  display:flex;align-items:center;justify-content:center;padding:0;font-family:inherit;
  z-index:3;flex-shrink:0;
}
.fr-lcard-more-btn:hover{background:rgba(255,255,255,.1);color:#fff;}
.fr-lcard-dropdown{
  display:none;position:absolute;bottom:54px;right:8px;top:auto;z-index:40;
  min-width:208px;background:#1a1a1c;border:0.5px solid rgba(255,255,255,.12);
  border-radius:14px;padding:6px;box-shadow:0 8px 28px rgba(0,0,0,.65);
}
.fr-lcard-dropdown.open{display:block;}
.fr-lcard-dd-label{
  font-size:10px;text-transform:uppercase;letter-spacing:.04em;
  color:rgba(255,255,255,.32);padding:8px 12px 4px;
}
.fr-lcard-dd-item{
  display:block;width:100%;text-align:left;padding:9px 12px;border-radius:10px;border:none;background:transparent;
  color:rgba(255,255,255,.78);font-size:13px;cursor:pointer;font-family:inherit;
}
.fr-lcard-dd-item:hover{background:rgba(255,255,255,.08);color:#fff;}
.fr-lcard-dd-item--danger{color:rgba(226,75,74,.9);}
.fr-lcard-dd-item--danger:hover{background:rgba(226,75,74,.12);}
.fr-lcard-dd-access.is-on{color:#85B7EB;font-weight:500;}
.fr-lcard--new.fr-lcard--list{min-height:148px;}

/* Friends page — две колонки + перетаскиваемый разделитель */
.fr-page-wrap-v8{
  display:flex;
  flex-direction:column;
  flex:1;
  min-height:0;
  width:100%;
}
.fr-split-shell{
  display:grid;
  grid-template-columns:minmax(240px,min(36vw,380px)) 8px minmax(260px,1fr);
  flex:1;
  min-height:0;
  width:100%;
  align-items:stretch;
  gap:0;
}
.fr-mock-badge--span{
  flex-shrink:0;
  width:100%;
  box-sizing:border-box;
  margin-bottom:0;
}
.fr-left-v7{
  padding:24px 20px;
  display:flex;
  flex-direction:column;
  gap:20px;
  overflow-y:auto;
  overflow-x:hidden;
  -webkit-overflow-scrolling:touch;
  min-width:0;
  min-height:0;
  container-type:inline-size;
  container-name:fr-left;
}
.fr-l-remove-wrap{
  margin-top:auto;
  padding-top:8px;
  width:100%;
}
.fr-l-remove-btn{
  width:100%;
  padding:10px 12px;
  border-radius:12px;
  font-size:12px;
  font-weight:500;
  font-family:inherit;
  cursor:pointer;
  border:0.5px solid rgba(255,90,90,.35);
  background:rgba(255,60,60,.07);
  color:rgba(255,140,140,.95);
  transition:background .15s,border-color .15s,color .15s;
}
.fr-l-remove-btn:hover{
  background:rgba(255,60,60,.12);
  border-color:rgba(255,90,90,.5);
  color:#ffb4b4;
}
body.theme-light .fr-l-remove-btn{
  border-color:rgba(200,50,50,.35);
  background:rgba(200,50,50,.08);
  color:rgba(160,40,40,.95);
}
body.theme-light .fr-l-remove-btn:hover{
  background:rgba(200,50,50,.12);
  color:#8b2020;
}
.fr-l-prof{
  display:flex;
  flex-direction:column;
  align-items:center;
  gap:11px;
  padding-bottom:20px;
  border-bottom:0.5px solid rgba(255,255,255,.07);
}
.fr-l-av{
  width:72px;height:72px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:22px;font-weight:600;border:2px solid rgba(255,255,255,.12);flex-shrink:0;color:#fff;
}
.fr-l-av,.fr-ft-av,.fr-fp-av,.fr-in-av{position:relative;overflow:hidden;}
.fr-av-photo{
  position:absolute;inset:0;width:100%;height:100%;object-fit:cover;border-radius:50%;
  pointer-events:none;z-index:1;background:#0c0c0c;
}
.fr-l-av .fr-av-emoji{font-size:28px;line-height:1;}
.fr-ft-av .fr-av-emoji{font-size:13px;line-height:1;}
.fr-fp-pill .fr-ft-av .fr-av-emoji{font-size:12px;line-height:1;}
.fr-fp-av .fr-av-emoji{font-size:12px;line-height:1;}
.fr-in-av .fr-av-emoji{font-size:18px;line-height:1;}
.fr-av-editable{cursor:pointer;transition:opacity 1s,box-shadow 1;}
.fr-av-editable:hover{opacity:.92;box-shadow:0 0 0 1px rgb(255,255,255);}
.fr-av-editable:focus{outline:none;box-shadow:0 0 0 2px rgba(32,101,212,.55);}
.fr-av-editable:focus:not(:focus-visible){box-shadow:none;}
.fr-av-editable:focus-visible{outline:none;box-shadow:0 0 0 2px rgba(32,101,212,.55);}
.fr-l-names{text-align:center;}
.fr-l-name{font-size:16px;font-weight:500;}
.fr-l-handle{font-size:11px;color:rgba(255,255,255,.32);margin-top:2px;}
.fr-l-badges{display:flex;gap:5px;flex-wrap:wrap;justify-content:center;margin-top:2px;}
.fr-l-add-btn{
  width:100%;padding:8px;border-radius:12px;font-size:12px;font-weight:500;
  border:0.5px solid rgba(32,101,212,.45);background:rgba(32,101,212,.1);color:#85B7EB;
  cursor:pointer;font-family:inherit;margin-top:4px;
}
.fr-l-stats-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:8px;
}
@container fr-left (min-width: 410px){
  .fr-l-stats-grid{
    grid-template-columns:repeat(4,minmax(0,1fr));
  }
}
.fr-ls{
  background:rgba(255,255,255,0.07);
  border:0.5px solid rgba(255,255,255,0.35);
  border-radius:12px;
  padding:11px;
  text-align:center;
}
.fr-ls-val{font-size:18px;font-weight:500;color:var(--color-text-primary);}
.fr-ls-lbl{font-size:9px;color:rgba(255,255,255,.28);text-transform:uppercase;letter-spacing:.04em;margin-top:2px;}
.fr-l-profiles{
  margin-top:4px;
}
.fr-l-profiles-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
}
.fr-l-profiles-toggle-ic{
  font-size:12px;
  color:rgba(255,255,255,.45);
  transition:transform .15s ease;
}
.fr-l-profiles.is-collapsed .fr-l-profiles-toggle-ic{
  transform:rotate(-90deg);
}
.fr-l-profiles-list{
  display:flex;
  flex-direction:column;
  gap:4px;
  overflow:hidden;
  max-height:520px;
  opacity:1;
  transform:translateY(0);
  transition:max-height .24s ease,opacity .18s ease,transform .18s ease;
}
.fr-l-profiles.is-collapsed .fr-l-profiles-list{
  max-height:0;
  opacity:0;
  transform:translateY(-4px);
  pointer-events:none;
}
.fr-l-profiles-list .fr-fp-item{
  border-radius:12px;
  padding:9px 11px;
  background:rgba(255,255,255,.03);
  border:0.5px solid rgba(255,255,255,.07);
}
.fr-l-profiles-list .fr-fp-item.active{
  background:rgba(32,101,212,.12);
  border-color:rgba(32,101,212,.34);
}
.fr-l-profiles-list .fr-fp-item:hover{background:rgba(255,255,255,.06);}
.fr-l-profiles-list .fr-fp-add{
  margin-top:4px;
  border-radius:12px;
}
.fr-l-marathon-focus{
  margin-top:4px;
  padding-top:14px;
  border-top:0.5px solid rgba(255,255,255,.15);
}
.fr-l-marathon-focus .ch2-stitle{
  margin-bottom:8px;
}
.fr-l-marathon-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
}
.fr-l-marathon-focus > .fr-l-marathon-toggle{
  margin-bottom:10px;
}
.fr-l-marathon-focus.is-collapsed .fr-l-marathon-toggle .fr-l-profiles-toggle-ic{
  transform:rotate(-90deg);
}
.fr-l-marathon-focus-body{
  overflow:hidden;
  max-height:4800px;
  opacity:1;
  transform:translateY(0);
  transition:max-height .28s ease,opacity .2s ease,transform .2s ease;
}
.fr-l-marathon-focus.is-collapsed .fr-l-marathon-focus-body{
  max-height:0;
  opacity:0;
  transform:translateY(-4px);
  pointer-events:none;
}
body.theme-light .fr-l-marathon-focus{
  border-top-color:var(--border);
}
.fr-l-rewards-toggle{
  width:100%;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0;
  border:0;
  background:transparent;
  cursor:pointer;
  text-align:left;
  font-family:inherit;
}
.fr-l-rewards > .fr-l-rewards-toggle{
  margin-bottom:10px;
}
.fr-l-rewards.is-collapsed .fr-l-rewards-toggle .fr-l-profiles-toggle-ic{
  transform:rotate(-90deg);
}
.fr-l-rewards-body{
  overflow:hidden;
  max-height:1200px;
  opacity:1;
  transform:translateY(0);
  transition:max-height .28s ease,opacity .2s ease,transform .2s ease;
}
.fr-l-rewards.is-collapsed .fr-l-rewards-body{
  max-height:0;
  opacity:0;
  transform:translateY(-4px);
  pointer-events:none;
}
.fr-l-sec{
  font-size:12px;font-weight:500;color:var(--text35);text-transform:uppercase;letter-spacing:.07em;
  margin-bottom:9px;
}
.fr-rw-list-v7{display:flex;flex-direction:column;gap:6px;}
.fr-rw-empty-v7{font-size:12px;color:rgba(255,255,255,.28);line-height:1.45;padding:6px 2px 2px;}
.fr-m-empty-v7{font-size:12px;color:rgba(255,255,255,.28);line-height:1.45;padding:6px 2px 10px;}
.fr-rw-v7{
  display:flex;align-items:center;gap:9px;padding:9px 11px;border-radius:12px;border:0.5px solid;
  cursor:default;transition:filter .15s;
}
.fr-rw-v7--clickable{
  cursor:pointer;
  transition:filter .15s,border-color .15s,background .15s;
}
.fr-rw-v7--clickable:hover{
  filter:brightness(1.06);
  border-color:rgba(32,101,212,.36) !important;
}
.fr-rw-v7-ico{font-size:16px;flex-shrink:0;}
.fr-rw-v7-txt{display:flex;flex-direction:column;min-width:0;}
.fr-rw-v7-n{font-size:12px;font-weight:500;line-height:1.2;}
.fr-rw-v7-f{font-size:10px;opacity:.45;}
.fr-rw-v7-status{
  display:inline-flex;
  margin-left:8px;
  padding:1px 6px;
  border-radius:999px;
  font-size:9px;
  font-weight:600;
  letter-spacing:.01em;
  color:#85B7EB;
  background:rgba(32,101,212,.12);
  border:0.5px solid rgba(32,101,212,.28);
  vertical-align:middle;
  opacity:1;
}
body.theme-light .fr-rw-v7-status{
  color:#2a5ca6;
  background:rgba(32,101,212,.1);
  border-color:rgba(32,101,212,.26);
}
.fr-right-v7{
  display:flex;
  flex-direction:column;
  min-width:0;
  min-height:0;
  flex:1;
  overflow:hidden;
  max-width:100%;
  container-type:inline-size;
  container-name:fr-right;
}
.fr-tb-v7{
  display:flex;align-items:center;justify-content:space-between;
  padding:18px 24px 14px;border-bottom:0.5px solid rgba(255,255,255,.07);
  gap:12px;flex-shrink:0;
}
.fr-tb-left{display:flex;align-items:center;gap:8px;min-width:0;}
.fr-back-btn-v7{
  width:32px;height:32px;border-radius:50%;border:0.5px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);align-items:center;justify-content:center;cursor:pointer;
  flex-shrink:0;padding:0;font-family:inherit;color:inherit;
}
.fr-back-btn-v7 svg{width:14px;height:14px;stroke:rgba(255,255,255,.6);fill:none;stroke-width:2;}
.fr-tb-title{font-size:15px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.fr-tb-v7 .fr-friends-panel-wrap{margin-left:0;}
.fr-fp-account-btn{
  width:40px;height:40px;min-width:40px;min-height:40px;
  display:flex;align-items:center;justify-content:center;
  border-radius:50%;
  border:none;
  padding:0;
  cursor:pointer;
  box-sizing:border-box;
  background:var(--menu-avatar-ring-bg);
  box-shadow:var(--profile-avatar-glow);
  transition:box-shadow .2s,transform .2s;
}
.fr-fp-account-btn:hover{box-shadow:var(--profile-avatar-glow-hover);transform:scale(1.04);}
.fr-fp-account-btn .menu-avatar-face{width:100%;height:100%;border-radius:50%;}
body.theme-light .fr-l-profiles-list .fr-fp-item{
  background:var(--tag-bg);
  border-color:var(--border);
}
body.theme-light .fr-l-profiles-list .fr-fp-item:hover{
  background:var(--tag-bg-hover);
}
body.theme-light .fr-l-profiles-toggle-ic{
  color:rgba(8,16,30,.45);
}
.fr-fp-head{
  padding:10px 13px 7px;font-size:9px;font-weight:600;color:rgba(255,255,255,.25);
  text-transform:uppercase;letter-spacing:.07em;
}
.fr-fp-item{
  display:flex;align-items:center;gap:9px;width:100%;padding:8px 13px;cursor:pointer;transition:background .1s;
  border:none;background:transparent;font:inherit;color:inherit;text-align:left;
}
.fr-fp-item:hover{background:rgba(255,255,255,.05);}
.fr-fp-item.active{background:rgba(32,101,212,.09);}
.fr-fp-av{
  width:26px;height:26px;border-radius:50%;display:flex;align-items:center;justify-content:center;
  font-size:10px;font-weight:600;color:#fff;flex-shrink:0;
}
.fr-fp-name{font-size:12px;font-weight:500;flex:1;min-width:0;}
.fr-fp-me{font-size:10px;color:rgba(32,101,212,.75);}
.fr-fp-dot{width:6px;height:6px;border-radius:50%;flex-shrink:0;}
.fr-fp-div{height:0.5px;background:rgba(255,255,255,.07);margin:3px 0;}
.fr-fp-add .fr-fp-add-txt{font-size:13px;}
.fr-incoming{
  padding:14px 24px 12px;
  border-bottom:0.5px solid rgba(255,255,255,.07);
  flex-shrink:0;
}
.fr-incoming-title{
  font-size:10px;font-weight:600;color:rgba(255,255,255,.28);
  text-transform:uppercase;letter-spacing:.07em;margin-bottom:10px;
}
.fr-in-row{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:8px 0;border-bottom:0.5px solid rgba(255,255,255,.05);
}
.fr-in-row:last-child{border-bottom:none;padding-bottom:0;}
.fr-in-left{display:flex;align-items:center;gap:10px;min-width:0;flex:1;}
.fr-in-av{
  width:36px;height:36px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;
  font-size:11px;font-weight:600;border:0.5px solid rgba(255,255,255,.1);color:#fff;
}
.fr-in-name{font-size:13px;font-weight:500;min-width:0;overflow:hidden;text-overflow:ellipsis;flex:1;}
.fr-in-actions{display:flex;gap:6px;flex-shrink:0;flex-wrap:wrap;justify-content:flex-end;}
.fr-in-btn{
  padding:6px 10px;border-radius:8px;font-size:11px;font-weight:500;font-family:inherit;
  border:0.5px solid rgba(255,255,255,.12);background:rgba(255,255,255,.06);color:rgba(255,255,255,.75);
  cursor:pointer;
}
.fr-in-btn--ok{
  border-color:rgba(29,158,117,.35);background:rgba(29,158,117,.12);color:#5DCAA5;
}
.fr-out-hint{
  padding:4px 24px 14px;font-size:11px;color:rgba(255,255,255,.32);
  border-bottom:0.5px solid rgba(255,255,255,.05);
  flex-shrink:0;
}
.fr-main-v7{
  padding:22px 24px;display:flex;flex-direction:column;gap:24px;overflow-y:auto;overflow-x:hidden;flex:1;min-height:0;min-width:0;
}
.fr-peer-head-grid{
  display:grid;
  grid-template-columns:minmax(0,2fr) minmax(0,1fr);
  gap:12px;
  align-items:start;
  width:100%;
  max-width:none;
  min-width:0;
}
.fr-peer-overview{
  display:flex;
  flex-direction:column;
  gap:10px;
  padding:11px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.03);
  border:0.5px solid rgba(255,255,255,.07);
  min-width:0;
  width:100%;
  box-sizing:border-box;
}
.fr-peer-top{display:flex;align-items:center;gap:12px;}
.fr-peer-av{
  width:46px;height:46px;border-radius:50%;
  display:flex;align-items:center;justify-content:center;
  border:1.5px solid rgba(255,255,255,.14);color:#fff;flex-shrink:0;
  position:relative;overflow:hidden;
}
.fr-peer-name{font-size:14px;font-weight:600;line-height:1.2;}
.fr-peer-handle{font-size:11px;color:rgba(255,255,255,.35);margin-top:2px;}
.fr-peer-badges{display:flex;flex-wrap:wrap;gap:5px;}
.fr-peer-stats-grid{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:6px;
}
.fr-peer-stat{
  background:rgba(255,255,255,.04);
  border:0.5px solid rgba(255,255,255,.07);
  border-radius:10px;
  padding:8px 10px;
  text-align:center;
}
.fr-peer-stat-val{font-size:17px;font-weight:600;line-height:1.15;}
.fr-peer-stat-lbl{
  margin-top:2px;
  font-size:9px;
  letter-spacing:.05em;
  text-transform:uppercase;
  color:rgba(255,255,255,.3);
}
.fr-peer-rewards-panel{
  display:flex;
  flex-direction:column;
  gap:8px;
  min-height:100%;
  padding:11px 12px;
  border-radius:16px;
  background:rgba(255,255,255,.03);
  border:0.5px solid rgba(255,255,255,.07);
  min-width:0;
  width:100%;
  box-sizing:border-box;
}
.fr-peer-rewards-title{
  font-size:10px;
  font-weight:500;
  color:rgba(255,255,255,.3);
  text-transform:uppercase;
  letter-spacing:.07em;
  margin-bottom:7px;
}
.fr-peer-rewards-panel .fr-rw-empty-v7{
  font-size:12px;
  color:rgba(255,255,255,.55);
  padding:2px 0 0;
}
.fr-peer-actions{
  display:flex;
  flex-direction:column;
  gap:6px;
}
.fr-peer-actions .fr-l-add-btn{margin-top:0;}
.fr-peer-actions .fr-l-remove-wrap{
  margin-top:0;
  padding-top:0;
}
body.theme-light .fr-peer-overview{
  background:var(--tag-bg);
  border-color:var(--border);
}
body.theme-light .fr-peer-rewards-panel{
  background:var(--tag-bg);
  border-color:var(--border);
}
body.theme-light .fr-peer-handle{color:var(--text45);}
body.theme-light .fr-peer-name{color:var(--text);}
body.theme-light .fr-peer-stat{
  background:var(--tag-bg);
  border-color:var(--border2);
}
body.theme-light .fr-peer-stat-lbl{color:var(--text45);}
body.theme-light .fr-peer-rewards-title{color:var(--text45);}
body.theme-light .fr-peer-rewards-panel .fr-rw-empty-v7{color:var(--text55);}
@media(max-width:1180px){
  .fr-peer-head-grid{
    grid-template-columns:1fr;
  }
}
.fr-page-wrap-v8--skeleton{pointer-events:none;user-select:none;}
.fr-page-wrap-v8--skeleton .fr-l-prof{align-items:center;}
.fr-ls--sk{display:flex;flex-direction:column;align-items:center;gap:8px;}
.fr-sk-line{display:block;border-radius:8px;}
.fr-sk-circle{width:64px;height:64px;border-radius:50%;}
.fr-sk-name{width:190px;height:22px;margin:0 auto 8px;}
.fr-sk-handle{width:140px;height:12px;margin:0 auto;}
.fr-sk-stat-v{width:48px;height:20px;}
.fr-sk-stat-l{width:64px;height:10px;}
.fr-sk-sec{width:120px;height:10px;margin-bottom:10px;}
.fr-sk-row{width:100%;height:48px;border-radius:14px;margin-bottom:8px;}
.fr-sk-title{width:140px;height:18px;}
.fr-sk-pill{width:172px;height:36px;border-radius:999px;}
body.theme-light .fr-page-wrap-v8--skeleton .sk{background:rgba(0,0,0,.08);}
.fr-v7-stitle{
  font-size:12px;font-weight:500;color:var(--text35);text-transform:uppercase;letter-spacing:.07em;
  margin-bottom:10px;
}
.fr-marathons-section{
  margin-top:2px;
  padding-top:14px;
  border-top:0.5px solid rgba(255,255,255,.15);
}
body.theme-light .fr-marathons-section{
  border-top-color:var(--border);
}
.fr-common-head-v7{
  display:flex;align-items:baseline;gap:8px;margin-bottom:10px;
}
.fr-common-head-v7 .fr-v7-stitle{margin-bottom:0;}
.fr-v7-ctabs{display:flex;gap:6px;margin-bottom:13px;}
.fr-v7-common-row{
  display:flex;gap:10px;overflow-x:auto;scrollbar-width:none;padding:2px;
}
.fr-v7-common-row::-webkit-scrollbar{display:none;}
.fr-v7-cm{flex:0 0 100px;cursor:default;}
.fr-v7-cm-poster{
  width:100px;height:150px;border-radius:12px;border:0.5px solid rgba(255,255,255,.08);
  background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;font-size:36px;
  transition:border-color .15s;margin-bottom:7px;
}
.fr-v7-cm:hover .fr-v7-cm-poster{border-color:rgba(255,255,255,.18);}
.fr-v7-cm-t{font-size:11px;color:rgba(255,255,255,.5);text-align:center;line-height:1.3;}
.fr-v7-mrow{
  display:flex;align-items:center;gap:10px;padding:12px 14px;
  background:rgba(255,255,255,.05);border:0.5px solid rgba(255,255,255,.07);border-radius:13px;margin-bottom:8px;
  cursor:default;transition:border-color .15s;
}
.fr-v7-mrow[data-fr-focus-challenge]{cursor:pointer;}
.fr-v7-mrow.is-focus{
  border-color:rgba(32,101,212,.45);
  background:rgba(32,101,212,.08);
  box-shadow:inset 0 0 0 1px rgba(32,101,212,.22);
}
.fr-v7-mrow:last-child{margin-bottom:0;}
.fr-v7-mrow:hover{border-color:rgba(255,255,255,.5);}
.fr-v7-mi{font-size:19px;}
.fr-v7-mb{flex:1;min-width:0;}
.fr-v7-mt{font-size:12px;font-weight:500;margin-bottom:5px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.fr-v7-prow{display:flex;align-items:center;gap:8px;}
.fr-v7-pt{flex:1;height:4px;background:rgba(255,255,255,.07);border-radius:2px;overflow:hidden;}
.fr-v7-pf{height:100%;border-radius:2px;}
.fr-v7-pp{font-size:11px;font-weight:500;}
.fr-v7-mst{font-size:10px;font-weight:500;padding:3px 9px;border-radius:100px;flex-shrink:0;margin-left:8px;}
.fr-m-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:8px;
}
.fr-v7-mjoin{
  font-size:11px;
  font-weight:600;
  padding:6px 10px;
  border-radius:999px;
  border:0.5px solid rgba(32,101,212,.5);
  background:rgba(32,101,212,.12);
  color:#85B7EB;
  font-family:inherit;
  cursor:pointer;
  flex-shrink:0;
  margin-left:8px;
}
.fr-v7-mjoin:hover{background:rgba(32,101,212,.2);}
.fr-v7-mjoin:disabled{opacity:.65;cursor:default;}
.fr-m-list .fr-v7-mrow{margin-bottom:0;}
.fr-m-list .fr-m-extra-row{display:none !important;}
.fr-m-list.is-expanded .fr-m-extra-row{display:flex !important;}
@container fr-right (max-width: 760px){
  .fr-m-list{
    grid-template-columns:1fr;
  }
}
body.theme-light .fr-v7-mjoin{
  border-color:rgba(32,101,212,.35);
  background:rgba(32,101,212,.12);
  color:#2065d4;
}

@media(max-width:900px){
  .friends-body.friends-body--fr-split{
    overflow-y:auto;
    -webkit-overflow-scrolling:touch;
  }
  .friends-body.friends-body--fr-split .friends-page-root{
    flex:none;
    min-height:0;
  }
  .fr-page-wrap-v8{flex:none;}
  .fr-split-shell{
    grid-template-columns:1fr;
    flex:none;
    min-height:min(70vh,720px);
  }
  .fr-split-grip{display:none !important;}
  .fr-left-v7{
    border-bottom:0.5px solid rgba(255,255,255,.07);
    overflow:visible;
    flex:none;
  }
  .fr-right-v7{overflow:visible;}
  .fr-main-v7{overflow:visible;flex:none;}
}

.fr-modal-overlay{
  display:none;position:fixed;inset:0;background:rgba(0,0,0,.6);z-index:500;align-items:center;justify-content:center;
  padding:20px;
}
.fr-modal-overlay.open{display:flex;}
.fr-modal{
  background:rgba(16,16,18,.98);border:0.5px solid rgba(255,255,255,.12);border-radius:22px;padding:24px;
  width:min(320px,100%);box-shadow:0 16px 48px rgba(0,0,0,.8);
}
.fr-modal-title{font-size:16px;font-weight:600;margin-bottom:4px;color:var(--color-text-primary);}
.fr-modal-sub{font-size:13px;color:rgba(255,255,255,.35);margin-bottom:18px;}
.fr-modal-input{
  width:100%;background:rgba(255,255,255,.07);border:0.5px solid rgba(255,255,255,.12);border-radius:12px;
  padding:11px 14px;font-size:14px;color:#fff;font-family:inherit;outline:none;margin-bottom:10px;transition:border-color .15s;
  box-sizing:border-box;
}
.fr-modal-input:focus{border-color:rgba(32,101,212,.5);}
.fr-modal-input::placeholder{color:rgba(255,255,255,.25);}
.fr-modal-btns{display:flex;gap:8px;margin-top:6px;}
.fr-mbtn{flex:1;padding:10px;border-radius:12px;font-size:14px;cursor:pointer;font-family:inherit;}
.fr-mbtn--cancel{background:rgba(255,255,255,.07);border:0.5px solid rgba(255,255,255,.1);color:rgba(255,255,255,.6);}
.fr-mbtn--add{background:#2065d4;border:none;color:#fff;font-weight:500;}

/* Режим «добавить в пользовательский список» на странице Фильмы */
.vs-pick-custom-list-bar{
  display:flex;align-items:center;justify-content:space-between;gap:10px;
  flex-wrap:wrap;
  padding:8px 14px 10px;
  margin:0;
  background:rgba(32,101,212,.14);
  border-bottom:0.5px solid rgba(32,101,212,.22);
  font-size:13px;color:rgba(255,255,255,.82);
}
.vs-pick-custom-list-bar-text{flex:1;min-width:0;line-height:1.35;}
.vs-pick-custom-list-bar-done{
  flex-shrink:0;padding:6px 14px;border-radius:10px;border:none;cursor:pointer;
  font-size:13px;font-weight:500;font-family:inherit;
  background:rgba(255,255,255,.12);color:#fff;
}
.vs-pick-custom-list-bar-done:active{opacity:.85;}
.col-delete--movies{display:flex;align-items:center;justify-content:flex-end;gap:4px;}
.pick-cl-inline-btn{
  min-width:26px;height:26px;padding:0 6px;border-radius:8px;border:0.5px solid rgba(32,101,212,.45);
  background:rgba(32,101,212,.2);color:#fff;font-size:14px;font-weight:600;line-height:1;cursor:pointer;font-family:inherit;
}
.pick-cl-inline-btn:active{opacity:.85;}
.det-sec-btn--pick-cl{font-size:11px;padding:8px 6px;}

/* —— Страницы «Любимые фильмы» / «Любимые сериалы» / пользовательский список —— */
#fav-movies-list-page,
#fav-series-list-page,
#custom-movie-list-page{background:var(--bac);}
#fav-movies-list-page.page.active,
#fav-series-list-page.page.active,
#custom-movie-list-page.page.active{
  box-sizing:border-box;
  height:100vh;
  max-height:100vh;
  height:100dvh;
  max-height:100dvh;
  min-height:0;
  overflow:hidden;
  display:flex;
  flex-direction:column;
}
.fav-ml-scroll{
  flex:1;
  min-height:0;
  overflow-y:auto;
  -webkit-overflow-scrolling:touch;
}
.fav-ml-host{padding-bottom:28px;}
.fr-lcard--clickable{cursor:pointer;transition:transform .12s,border-color .12s,box-shadow .15s;}
.fr-lcard--clickable:hover{border-color:rgba(255,255,255,.5);transform:translateY(-2px);}
.fr-lcard--clickable:focus{outline:none;box-shadow:0 0 0 2px rgba(32,101,212,.45);}
.fr-lcard--clickable:focus:not(:focus-visible){box-shadow:none;}

.lv2-root{width:100%;display:flex;flex-direction:column;}
.lv2-hdr{
  padding:14px 22px;border-bottom:0.5px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:12px;flex-wrap:wrap;
}
.lv2-back{
  width:32px;height:32px;border-radius:50%;border:0.5px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;
  cursor:pointer;flex-shrink:0;padding:0;font:inherit;color:inherit;
}
.lv2-back svg{width:13px;height:13px;stroke:rgba(255,255,255,.6);fill:none;stroke-width:2;}
.lv2-hdr-info{flex:1;min-width:0;}
.lv2-hdr-title{font-size:17px;font-weight:600;color:var(--color-text-primary);}
.lv2-hdr-meta{font-size:11px;color:rgba(255,255,255,.3);margin-top:2px;}
.lv2-hdr-actions{display:flex;align-items:center;gap:7px;flex-wrap:wrap;}
.lv2-hbtn{
  padding:6px 14px;border-radius:100px;border:0.5px solid rgba(255,255,255,.12);
  background:rgba(255,255,255,.05);font-size:12px;color:rgba(255,255,255,.6);
  cursor:pointer;white-space:nowrap;transition:background .15s,color .15s;font-family:inherit;
}
.lv2-hbtn:hover{background:rgba(255,255,255,.09);color:#fff;}
.lv2-hbtn.primary{background:#2065d4;border-color:#2065d4;color:#fff;}
.lv2-hbtn.edit-on{background:rgba(226,75,74,.15);border-color:rgba(226,75,74,.4);color:#E24B4A;}

.lv2-toolbar{
  padding:10px 22px;border-bottom:0.5px solid rgba(255,255,255,.07);
  display:flex;align-items:center;gap:8px;flex-wrap:wrap;
}
.lv2-sort-pill{
  padding:5px 12px;border-radius:100px;border:0.5px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);font-size:11px;color:rgba(255,255,255,.45);
  cursor:pointer;display:flex;align-items:center;gap:4px;user-select:none;font-family:inherit;color:inherit;
  transition:background .15s,border-color .15s,color .15s;
}
.lv2-sort-pill.on{background:rgba(32,101,212,.15);border-color:rgba(32,101,212,.35);color:#85B7EB;}
.lv2-sort-pill svg{width:10px;height:10px;stroke:currentColor;fill:none;stroke-width:2;transition:transform .2s;}
.lv2-sort-pill.desc svg{transform:rotate(180deg);}
.lv2-count-lbl{font-size:12px;color:rgba(255,255,255,.28);margin-left:auto;}
.lv2-view-toggle{display:flex;gap:4px;margin-left:8px;}
.lv2-vbtn{
  width:30px;height:30px;border-radius:8px;border:0.5px solid rgba(255,255,255,.1);
  background:rgba(255,255,255,.04);display:flex;align-items:center;justify-content:center;
  cursor:pointer;padding:0;font:inherit;transition:background .15s,border-color .15s;
}
.lv2-vbtn.on{background:rgba(32,101,212,.15);border-color:rgba(32,101,212,.35);}
.lv2-vbtn svg{width:13px;height:13px;stroke:rgba(255,255,255,.4);fill:none;stroke-width:1.7;}
.lv2-vbtn.on svg{stroke:#85B7EB;}

.lv2-grid-view{
  padding:18px 22px;display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:13px;
}
.lv2-root.list-mode .lv2-grid-view{display:none;}
.lv2-root.list-mode .lv2-list-view{display:flex;}
.lv2-mc{cursor:pointer;position:relative;}
.lv2-mc-poster{
  width:100%;aspect-ratio:2/3;border-radius:11px;border:0.5px solid rgba(255,255,255,.08);
  display:flex;align-items:center;justify-content:center;font-size:34px;position:relative;overflow:hidden;
  background:#111;
}
.lv2-mc-poster img{display:block;width:100%;height:100%;object-fit:cover;}
.lv2-mc-rating{
  position:absolute;top:7px;right:7px;background:rgba(0,0,0,.72);padding:2px 7px;border-radius:100px;
  font-size:10px;font-weight:600;color:#FFD60A;
}
/* Чужие списки, сетка: как макет list_view_v2 — кнопки снизу, по hover карточки */
.lv2-mc-poster .lv2-mc-actions{
  position:absolute;bottom:7px;left:0;right:0;display:flex;justify-content:center;gap:6px;
  opacity:0;transition:opacity .18s;z-index:5;pointer-events:none;
}
.lv2-mc:hover .lv2-mc-poster .lv2-mc-actions{opacity:1;pointer-events:auto;}
.lv2-mc-poster:focus-within .lv2-mc-actions{opacity:1;pointer-events:auto;}
@media (hover:none){
  .lv2-mc-poster .lv2-mc-actions{opacity:1;pointer-events:auto;}
}
.lv2-root.lv2--edit .lv2-mc-poster .lv2-mc-actions{opacity:0!important;pointer-events:none!important;}

/* Те же круги (коллекция / Позже) на галереях «Мои фильмы / сериалы / Позже» и в поиске на главной */
.gallery-poster .lv2-mc-actions{
  position:absolute;bottom:7px;left:0;right:0;display:flex;justify-content:center;gap:6px;
  opacity:0;transition:opacity .18s;z-index:5;pointer-events:none;
}
.gallery-card:hover .gallery-poster .lv2-mc-actions,
.gallery-card:focus-within .gallery-poster .lv2-mc-actions{
  opacity:1;pointer-events:auto;
}
.gallery-card:has(.gallery-card-menu.open) .gallery-poster .lv2-mc-actions{
  opacity:0!important;pointer-events:none!important;
}
.gallery-card:has(.gallery-card-menu.open) .gallery-poster-stream-actions .lv2-mc-actions{
  opacity:0!important;pointer-events:none!important;
}
@media (hover:none){
  .gallery-poster .lv2-mc-actions{opacity:1;pointer-events:auto;}
}
/* Фильмы/сериалы (--stream): (+), флажок и «⋯» в одном ряду по центру */
.gallery-poster-stream-actions{
  position:absolute;left:0;right:0;bottom:7px;z-index:8;
  display:flex;align-items:center;justify-content:center;gap:8px;
  opacity:0;pointer-events:none;transition:opacity .18s;
}
.gallery-poster--stream:has(.gallery-progress-wrap) .gallery-poster-stream-actions{
  bottom:22px;
}
.gallery-card:hover .gallery-poster-stream-actions,
.gallery-card:focus-within .gallery-poster-stream-actions{
  opacity:1;pointer-events:auto;
}
.gallery-poster-stream-actions .lv2-mc-actions{
  position:static!important;
  left:auto!important;right:auto!important;bottom:auto!important;
  opacity:1;pointer-events:auto;z-index:1;
}
@media (hover:none){
  .gallery-poster-stream-actions{opacity:1;pointer-events:auto;}
}
.poster-img .lv2-mc-actions{
  position:absolute;bottom:7px;left:0;right:0;display:flex;justify-content:center;gap:6px;
  opacity:0;transition:opacity .18s;z-index:6;pointer-events:none;
}
.poster-card:hover .poster-img .lv2-mc-actions,
.poster-img:focus-within .lv2-mc-actions{
  opacity:1;pointer-events:auto;
}
@media (hover:none){
  .poster-img .lv2-mc-actions{opacity:1;pointer-events:auto;}
}
/* Главная (поиск): ряд «коллекция / Позже» + ⋯ «Добавить в…» */
.home-poster-stream-actions{
  position:absolute;left:0;right:0;bottom:7px;z-index:8;
  display:flex;align-items:center;justify-content:center;gap:8px;
  opacity:0;pointer-events:none;transition:opacity .18s;
}
.poster-card:hover .poster-img .home-poster-stream-actions,
.poster-img:focus-within .home-poster-stream-actions{
  opacity:1;pointer-events:auto;
}
.poster-img .home-poster-stream-actions .lv2-mc-actions{
  position:static!important;
  left:auto!important;right:auto!important;bottom:auto!important;
  opacity:1;pointer-events:auto;z-index:1;
}
.home-poster-stream-actions .gallery-card-more-wrap{
  display:block;position:static;right:auto;bottom:auto;pointer-events:auto;
}
.home-poster-stream-actions .gallery-card-more-btn{
  box-sizing:border-box;
  width:32px;height:32px;min-width:32px;min-height:32px;
  padding:0;border-radius:50%;
  border:0.5px solid rgba(255,255,255,.2);
  background:rgba(0,0,0,.72);
  color:#fff;
  font-size:15px;line-height:1;
  cursor:pointer;
  display:flex;align-items:center;justify-content:center;
  box-shadow:none;
  opacity:1;
  transition:background .15s,border-color .15s;
  font-family:inherit;
}
.home-poster-stream-actions .gallery-card-more-btn:hover{
  background:rgba(255,255,255,.7);
  border-color:rgba(255,255,255,.28);
}
.poster-card .poster-img .gallery-card-menu{
  display:none;position:absolute;right:0;bottom:calc(100% + 6px);
  min-width:168px;padding:4px 0;border-radius:12px;
  background:#161616;border:1px solid rgba(255,255,255,.12);
  box-shadow:0 10px 32px rgba(0,0,0,.55);
  pointer-events:auto;transform-origin:bottom right;z-index:25;
}
.poster-card .poster-img .gallery-card-menu.open{display:block;}
.poster-card:has(.gallery-card-menu.open) .poster-inner{overflow:visible!important;}
.poster-card:has(.gallery-card-menu.open){
  position:relative;
  z-index:90;
}
.poster-card:has(.gallery-card-menu.open) .poster-img .home-poster-stream-actions .lv2-mc-actions{
  opacity:0!important;pointer-events:none!important;
}
@media (hover:none){
  .home-poster-stream-actions{opacity:1;pointer-events:auto;}
}
.lv2-mc-action-btn{
  width:32px;height:32px;border-radius:50%;background:rgba(0,0,0,.72);border:0.5px solid rgba(255,255,255,.2);
  display:flex;align-items:center;justify-content:center;cursor:pointer;transition:background .15s,border-color .15s;
  padding:0;color:#fff;font:inherit;flex-shrink:0;box-sizing:border-box;
}
.lv2-mc-action-btn:hover{background:rgba(32,101,212,.7);}
.lv2-mc-action-btn svg{display:block;width:13px;height:13px;max-width:13px;max-height:13px;}
.lv2-mc-action-btn.add-on{background:rgba(29,158,117,.8);border-color:rgba(255,255,255,.25);}
.lv2-mc-action-btn.add-on:hover{background:rgba(29,158,117,.92);}
.lv2-mc-action-btn.flag-on{background:rgba(32,101,212,.8);border-color:rgba(255,255,255,.25);}
.lv2-mc-action-btn.flag-on:hover{background:rgba(32,101,212,.92);}
.lv2-dm-item .lv2-dm-ico{width:13px;height:13px;flex-shrink:0;display:block;}
.lv2-dm-item--peer-coll-on{color:#30d158;}
.lv2-dm-item--peer-later-on{color:#85B7EB;}
body.theme-light .lv2-dm-item--peer-coll-on{color:#28a745;}
body.theme-light .lv2-dm-item--peer-later-on{color:#007AFF;}
.lv2-mc-del{
  position:absolute;top:7px;left:7px;width:22px;height:22px;border-radius:50%;
  background:rgba(226,75,74,.85);display:none;align-items:center;justify-content:center;
  font-size:13px;cursor:pointer;z-index:2;border:none;color:#fff;font-family:inherit;
}
.lv2-root.lv2--edit .lv2-mc-del{display:flex;}
.lv2-mc-title{font-size:11px;font-weight:500;margin-top:7px;line-height:1.3;color:var(--color-text-primary);}
.lv2-mc-year{font-size:10px;color:rgba(255,255,255,.3);margin-top:2px;}

.lv2-list-view{padding:8px 22px;display:none;flex-direction:column;}
.lv2-lr{
  display:flex;align-items:center;gap:12px;padding:9px 10px;border-radius:11px;cursor:pointer;
  transition:background .12s;position:relative;border-bottom:0.5px solid rgba(255,255,255,.05);
}
.lv2-lr:last-child{border-bottom:none;}
.lv2-lr:hover{background:rgba(255,255,255,.04);}
.lv2-lr-num{font-size:11px;color:rgba(255,255,255,.2);width:18px;text-align:center;flex-shrink:0;}
.lv2-lr-poster{
  width:36px;height:52px;border-radius:7px;background:#111;display:flex;align-items:center;justify-content:center;
  font-size:18px;flex-shrink:0;border:0.5px solid rgba(255,255,255,.07);overflow:hidden;
}
.lv2-lr-poster img{display:block;width:100%;height:100%;object-fit:cover;}
.lv2-lr-title{font-size:13px;font-weight:500;flex:1;min-width:0;color:var(--color-text-primary);}
.lv2-lr-year{font-size:11px;color:rgba(255,255,255,.35);width:40px;text-align:right;flex-shrink:0;}
.lv2-lr-rating{font-size:12px;font-weight:500;color:#FFD60A;width:32px;text-align:right;flex-shrink:0;}
.lv2-lr-more{
  width:28px;height:28px;border-radius:8px;display:flex;align-items:center;justify-content:center;
  cursor:pointer;color:rgba(255,255,255,.3);font-size:16px;flex-shrink:0;position:relative;
  transition:background .12s;border:none;background:transparent;font-family:inherit;
}
.lv2-lr-more:hover{background:rgba(255,255,255,.07);color:#fff;}
.lv2-dot-menu{
  display:none;position:absolute;right:0;top:34px;background:#1a1a1c;border:0.5px solid rgba(255,255,255,.12);
  border-radius:12px;padding:6px;z-index:100;min-width:172px;box-shadow:0 4px 20px rgba(0,0,0,.7);
}
.lv2-dot-menu.open{display:block;}
.lv2-dm-item{
  display:flex;align-items:center;gap:8px;padding:8px 11px;border-radius:8px;cursor:pointer;
  font-size:12px;color:rgba(255,255,255,.65);transition:background .1s;border:none;background:transparent;
  width:100%;font:inherit;text-align:left;
}
.lv2-dm-item:hover{background:rgba(255,255,255,.07);color:#fff;}
.lv2-dm-item.danger{color:rgba(226,75,74,.8);}
.lv2-dm-item.danger:hover{background:rgba(226,75,74,.1);}
.lv2-lr-del{
  width:22px;height:22px;border-radius:50%;background:rgba(226,75,74,.85);display:none;
  align-items:center;justify-content:center;font-size:12px;cursor:pointer;flex-shrink:0;
  border:none;color:#fff;font-family:inherit;
}
.lv2-root.lv2--edit .lv2-lr-del{display:flex;}
.lv2-root.lv2--edit .lv2-lr-more{display:none;}

.lv2-loading,.lv2-err{padding:24px 22px;font-size:13px;color:rgba(255,255,255,.35);}
.lv2-err{color:rgba(226,75,74,.75);}
