:root {
      --bg-primary: #eef2f6;
      --bg-secondary: #ffffff;
      --bg-tertiary: #f8fafc;
      --bg: var(--bg-primary);
      --panel: var(--bg-secondary);
      --surface-subtle: var(--bg-tertiary);
      --text: #384252;
      --muted: #8b94a3;
      --border: rgba(15, 23, 42, 0.05);
      --border-strong: rgba(15, 23, 42, 0.09);
      --bubble-out: #e9edf2;
      --bubble-in: #ffffff;
      --shadow: rgba(15, 23, 42, 0.06);
      --shadow-soft: 0 1px 2px rgba(15, 23, 42, 0.03);
      --shadow-card: 0 1px 2px rgba(15, 23, 42, 0.03), 0 4px 14px rgba(15, 23, 42, 0.035);
      --shadow-panel: 0 1px 2px rgba(15, 23, 42, 0.03), 0 6px 20px rgba(15, 23, 42, 0.04);
      --radius-panel: 18px;
      --radius-card: 14px;
      --radius-control: 12px;
      --radius-small: 10px;
      --space-1: 8px;
      --space-2: 12px;
      --space-3: 16px;
      --space-4: 24px;
      --space-5: 32px;
      --shell-gap: 16px;
      --shell-pad: 16px;
      --accent: #5b8def;
      --accent-soft: #aeb9ff;
      --surface-elevated: var(--bg-secondary);
      --font-brand-rounded: Inter, system-ui, "Segoe UI", sans-serif;
      --invite-accent: #b8860b;
      --invite-bg: linear-gradient(145deg, #f6efd9, #efe2b8);
      --invite-border: #c89f22;
      --invite-glow: rgba(200, 159, 34, 0.28);
      --scrollbar-track: rgba(15, 23, 42, 0.03);
      --scrollbar-thumb: rgba(15, 23, 42, 0.14);
      --scrollbar-thumb-hover: rgba(15, 23, 42, 0.22);
    }

    [data-theme="dark"] {
      --bg-primary: #11151b;
      --bg-secondary: #181d24;
      --bg-tertiary: #151a21;
      --bg: var(--bg-primary);
      --panel: var(--bg-secondary);
      --surface-subtle: var(--bg-tertiary);
      --surface-elevated: #1c222b;
      --text: #e6eaf0;
      --muted: #9ca6b4;
      --border: rgba(255, 255, 255, 0.06);
      --border-strong: rgba(255, 255, 255, 0.1);
      --bubble-in: #1c222b;
      --bubble-out: #232c38;
      --shadow: rgba(0, 0, 0, 0.35);
      --shadow-soft: 0 1px 2px rgba(0, 0, 0, 0.18);
      --shadow-card: 0 1px 2px rgba(0, 0, 0, 0.2), 0 4px 14px rgba(0, 0, 0, 0.24);
      --shadow-panel: 0 1px 2px rgba(0, 0, 0, 0.2), 0 6px 20px rgba(0, 0, 0, 0.26);
      --accent: #6b9df5;
      --accent-soft: #8eb4f8;
      --invite-accent: #e8c547;
      --invite-bg: color-mix(in srgb, #e8c547 12%, #181d24);
      --invite-border: rgba(232, 197, 71, 0.35);
      --invite-glow: rgba(232, 197, 71, 0.12);
      --scrollbar-track: rgba(255, 255, 255, 0.03);
      --scrollbar-thumb: rgba(255, 255, 255, 0.12);
      --scrollbar-thumb-hover: rgba(255, 255, 255, 0.2);
      --font-brand-rounded: "Nunito", "Varela Round", "Segoe UI", system-ui, sans-serif;
    }

    /* ── Light theme visual polish (tokens + surfaces; layout unchanged) ── */
    [data-theme="light"] body {
      font-size: 15px;
      font-weight: 400;
      letter-spacing: -0.011em;
      -webkit-font-smoothing: antialiased;
    }

    /* Shell card layout — desktop only (@media min-width 921px block below) */

    [data-theme="light"] .col-user .panel-scroll {
      padding: 0 var(--space-2) var(--space-3);
    }

    [data-theme="light"] .col-user .profile-info {
      padding: var(--space-2) var(--space-1) var(--space-3);
      margin: 0 0 var(--space-2);
      border-bottom: none;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      gap: var(--space-2);
    }

    [data-theme="light"] .col-user .profile-label {
      font-size: 11px;
      font-weight: 400;
      letter-spacing: 0.02em;
      text-transform: none;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
    }

    [data-theme="light"] .col-user .profile-value {
      font-size: 14px;
      font-weight: 500;
      line-height: 1.35;
    }

    [data-theme="light"] .col-user .profile-line:first-child .profile-value {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 90%, transparent);
    }

    [data-theme="light"] .col-user #profileDisplayNickname {
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
    }

    [data-theme="light"] .col-user .panel-head,
    [data-theme="light"] .col-dialogs .panel-head {
      padding: var(--space-3) var(--space-3) var(--space-2);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      border-bottom: none;
      background: transparent;
    }

    [data-theme="light"] .profile-tabs-wrap {
      gap: var(--space-3);
      margin-top: 0;
    }

    [data-theme="light"] .profile-tabs {
      gap: var(--space-1);
    }

    [data-theme="light"] .profile-tab {
      border-radius: var(--radius-control);
      border: none;
      font-size: 13px;
      padding: 6px var(--space-2);
      background: transparent;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
      transition: background-color 160ms ease, color 160ms ease;
    }

    [data-theme="light"] .profile-tab-label {
      font-size: 13px;
      font-weight: 500;
    }

    [data-theme="light"] .profile-tab .profile-tab-icon {
      opacity: 0.65;
    }

    [data-theme="light"] .profile-tab:hover {
      background: color-mix(in srgb, var(--accent) 4%, transparent);
      color: var(--text);
    }

    [data-theme="light"] .profile-tab:hover .profile-tab-icon,
    [data-theme="light"] .profile-tab.profile-tab-active .profile-tab-icon {
      opacity: 0.9;
      color: color-mix(in srgb, var(--accent) 75%, var(--text));
    }

    [data-theme="light"] .profile-tab.profile-tab-active {
      background: color-mix(in srgb, var(--accent) 7%, transparent);
      box-shadow: none;
      padding-left: var(--space-2);
      color: var(--text);
      border-radius: var(--radius-control);
    }

    [data-theme="light"] .profile-tab-panels {
      border: none;
      background: transparent;
      box-shadow: none;
      border-radius: 0;
      padding: 0;
    }

    [data-theme="light"] .profile-tab-panels input,
    [data-theme="light"] .profile-tab-panels .secondary {
      border-color: var(--border);
      border-radius: var(--radius-control);
      background: var(--bg-secondary);
    }

    [data-theme="light"] .col-user .profile-footer {
      gap: var(--space-1);
      padding-top: var(--space-3);
      margin-top: auto;
    }

    [data-theme="light"] .col-user .profile-actions {
      gap: 2px;
    }

    [data-theme="light"] .col-user .profile-action-btn {
      border-radius: var(--radius-control);
      font-size: 14px;
      font-weight: 400;
      transition: background-color 160ms ease, color 160ms ease;
    }

    [data-theme="light"] .col-user .profile-action-btn:not(.profile-action-btn--premium):not(.profile-action-btn--premium-owned) {
      border: none;
      background: transparent;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    [data-theme="light"] .col-user .profile-action-btn:not(.profile-action-btn--premium):not(.profile-action-btn--premium-owned):hover {
      background: color-mix(in srgb, var(--accent) 5%, transparent);
      color: var(--text);
    }

    [data-theme="light"] .col-user .profile-action-btn:hover .profile-action-icon {
      color: color-mix(in srgb, var(--accent) 65%, var(--text));
    }

    [data-theme="light"] .dialogs-scroll-strip {
      padding: var(--space-2) var(--space-2) var(--space-3) var(--space-3);
    }

    [data-theme="light"] .dialogs.dialogs-rail {
      gap: 0;
      padding: 0;
    }

    [data-theme="light"] .dialogs .status.empty-dlg-hint {
      font-size: 13px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 90%, transparent);
      line-height: 1.5;
    }

    [data-theme="light"] .dialog-item {
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      padding: 7px 0 7px 12px;
      transition: background-color 140ms ease;
    }

    [data-theme="light"] .dialog-item::after {
      background: rgba(0, 0, 0, 0.06);
    }

    [data-theme="light"] .dialog-item:hover {
      background: rgba(0, 0, 0, 0.02);
      box-shadow: none;
    }

    [data-theme="light"] .dialog-item:active {
      background: rgba(0, 0, 0, 0.035);
    }

    [data-theme="light"] .dialog-item.active {
      outline: none;
      background: rgba(59, 130, 246, 0.06);
      box-shadow: inset 2px 0 0 #3b82f6;
    }

    [data-theme="light"] .channel-rail-item--official-news {
      background: rgba(59, 130, 246, 0.03);
    }

    [data-theme="light"] .channel-rail-item--official-news:hover {
      background: rgba(59, 130, 246, 0.06);
    }

    [data-theme="light"] .channel-rail-item--official-news.active {
      background: rgba(59, 130, 246, 0.09);
      box-shadow: inset 2px 0 0 #3b82f6;
    }

    [data-theme="light"] .channel-rail-item--official-news .channel-rail-official-title {
      font-weight: 700;
      color: color-mix(in srgb, #0f172a 92%, #0369a1);
    }

    [data-theme="light"] .dialog-peer-line strong {
      font-size: 14px;
      font-weight: 600;
      letter-spacing: -0.01em;
      color: var(--text);
    }

    [data-theme="light"] .dialog-item .dlg-preview,
    [data-theme="light"] .channel-rail-official-sub {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      line-height: 1.25;
      margin-top: 0;
    }

    [data-theme="light"] .dialog-item-body {
      gap: 2px;
    }

    [data-theme="light"] .dialog-level {
      font-size: 10px;
      font-weight: 400;
      opacity: 0.72;
    }

    [data-theme="light"] .panel-head {
      font-weight: 500;
      font-size: 14px;
      border-bottom-color: transparent;
      background: transparent;
    }

    [data-theme="light"] button.primary,
    [data-theme="light"] button.secondary {
      border-radius: 12px;
      border-color: var(--border);
    }

    [data-theme="light"] button.primary:hover {
      filter: brightness(0.96);
    }

    [data-theme="light"] button.secondary:hover {
      background: var(--surface-subtle);
      border-color: var(--border-strong);
    }

    [data-theme="light"] .btn-pastel {
      border-radius: 12px;
      background: var(--surface-subtle);
      color: var(--muted);
      border-color: var(--border);
    }

    [data-theme="light"] .btn-pastel:hover {
      background: var(--bg-secondary);
      color: var(--text);
      border-color: var(--border-strong);
    }

    [data-theme="light"] *::-webkit-scrollbar {
      width: 10px;
      height: 10px;
    }

    [data-theme="light"] *::-webkit-scrollbar-thumb {
      background-color: var(--scrollbar-thumb);
      border: 2px solid var(--scrollbar-track);
    }

    /* ── Light theme: central chat area polish ── */
    [data-theme="light"] .chat-main {
      background: #ffffff;
    }

    [data-theme="light"] .messages {
      gap: 10px;
      padding: var(--space-3) var(--space-3) var(--space-4);
    }

    [data-theme="light"] .messages.olone-chat-bg--system {
      background-color: #f4f5f7;
      background-image: none;
    }

    [data-theme="light"] .empty-chat {
      font-size: 14px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      letter-spacing: 0;
    }

    [data-theme="light"] .chat-header {
      background: #ffffff;
      border-bottom: none;
      box-shadow: 0 1px 0 rgba(15, 23, 42, 0.03);
    }

    [data-theme="light"] .olone-chat-header__title {
      font-size: 15px;
      font-weight: 600;
      letter-spacing: -0.015em;
    }

    [data-theme="light"] .olone-chat-header__subtitle {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
    }

    [data-theme="light"] .olone-chat-header-menu,
    [data-theme="light"] .reaction-pop,
    [data-theme="light"] .emoji-picker {
      box-shadow: var(--shadow-panel);
    }

    [data-theme="light"] .bubble.in {
      background: #ffffff;
      border: none;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
      padding: 8px 13px 7px;
    }

    [data-theme="light"] .bubble.out {
      background: #e9edf2;
      border: none;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.03);
      padding: 8px 13px 7px;
    }

    [data-theme="light"] .bubble.in:hover,
    [data-theme="light"] .bubble.out:hover {
      box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }

    [data-theme="light"] .bubble .bubble-body {
      line-height: 1.52;
      font-weight: 400;
    }

    [data-theme="light"] .bubble .meta {
      margin-top: 5px;
      font-size: 10px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 82%, transparent);
      opacity: 1;
    }

    [data-theme="light"] .bubble.selected {
      outline: none;
      background: color-mix(in srgb, var(--accent) 7%, var(--bubble-in));
      box-shadow:
        0 0 0 2px color-mix(in srgb, var(--accent) 28%, transparent),
        0 4px 14px rgba(15, 23, 42, 0.08);
      transform: none;
    }

    [data-theme="light"] .bubble.out.selected {
      background: color-mix(in srgb, var(--accent) 5%, #e9edf2);
    }

    [data-theme="light"] .timeline-day-sep span,
    [data-theme="light"] .timeline-floating-day span {
      background: color-mix(in srgb, #ffffff 85%, #f4f5f7);
      border: none;
      box-shadow: none;
      color: color-mix(in srgb, var(--muted) 85%, transparent);
      font-size: 11px;
      font-weight: 400;
    }

    [data-theme="light"] .timeline-floating-day span {
      backdrop-filter: none;
    }

    [data-theme="light"] .reaction-chip {
      border: none;
      background: color-mix(in srgb, #ffffff 92%, #f4f5f7);
      box-shadow: none;
      transition: background-color 140ms ease;
    }

    [data-theme="light"] .reaction-chip:hover {
      transform: none;
      background: #ffffff;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    }

    [data-theme="light"] .reaction-chip.mine {
      border: none;
      background: color-mix(in srgb, var(--accent) 7%, #ffffff);
      box-shadow: none;
    }

    [data-theme="light"] .reaction-chip small {
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 85%, transparent);
    }

    [data-theme="light"] .reaction-add {
      border: none;
      background: transparent;
      color: color-mix(in srgb, var(--muted) 82%, transparent);
    }

    [data-theme="light"] .reaction-add:hover {
      background: color-mix(in srgb, #ffffff 80%, transparent);
      color: var(--muted);
      box-shadow: none;
    }

    [data-theme="light"] .composer {
      background: #ffffff;
      border-top: none;
      box-shadow: none;
    }

    [data-theme="light"] .composer-inner {
      background: #f4f5f7;
      border: none;
      box-shadow: none;
    }

    [data-theme="light"] #messageInput.composer-input {
      font-size: 15px;
      font-weight: 400;
      line-height: 1.5;
    }

    [data-theme="light"] .send-fab {
      background: color-mix(in srgb, var(--accent) 92%, #ffffff);
      color: #ffffff;
      box-shadow: none;
    }

    [data-theme="light"] .send-fab:hover {
      background: var(--accent);
      color: #ffffff;
      filter: none;
    }

    [data-theme="light"] .composer-attach-preview {
      border: none;
      background: #f4f5f7;
      box-shadow: none;
    }

    [data-theme="light"] .bubble-file-card {
      border: none;
      background: #ffffff;
      box-shadow: 0 1px 2px rgba(15, 23, 42, 0.04);
    }

    [data-theme="light"] .bubble-file-card:hover {
      border: none;
      background: #ffffff;
      box-shadow: 0 1px 3px rgba(15, 23, 42, 0.05);
    }

    [data-theme="light"] .col-chat-row > .chat-main {
      border-right-color: rgba(15, 23, 42, 0.05);
    }

    [data-theme="light"] .modal {
      border: none;
      box-shadow: var(--shadow-panel);
    }

    [data-theme="light"] .profile-settings-sheet,
    [data-theme="light"] .settings-nested-sheet,
    [data-theme="light"] .ui-display-hint-card {
      border: none;
      background: var(--surface-subtle);
      box-shadow: none;
    }

    [data-theme="light"] .profile-settings-title {
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.05em;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
    }

    [data-theme="light"] .icon-btn.inactive-mail {
      background: var(--surface-subtle);
      color: var(--muted);
      border-color: var(--border);
    }

    [data-theme="light"] .admin-grant-input {
      font-size: 15px;
      border-color: var(--border);
      border-radius: 12px;
    }

    [data-theme="light"] .profile-tab-stub-hint {
      font-size: 14px;
    }

    /* ── Light theme: desktop premium card shell (≥921px; mobile.css untouched) ── */
    @media (min-width: 921px) {
      [data-theme="light"] body:not(.app-guest) {
        background: #eef2f6;
      }

      [data-theme="light"] .messenger-shell:not(.hidden) {
        padding: var(--shell-pad);
        gap: var(--shell-gap);
        background: #eef2f6;
        border-top: none;
        box-sizing: border-box;
      }

      [data-theme="light"] .messenger-shell > .panel-card,
      [data-theme="light"] .messenger-shell > .col-chat {
        border-radius: var(--radius-panel);
        background: #ffffff;
        border: none !important;
        box-shadow: var(--shadow-panel);
        overflow: hidden;
      }

      [data-theme="light"] .col-user .panel-scroll {
        padding: 0 var(--space-3) var(--space-3);
      }

      [data-theme="light"] .col-user .panel-head,
      [data-theme="light"] .col-dialogs .panel-head {
        padding: var(--space-4) var(--space-3) var(--space-2);
      }

      [data-theme="light"] .col-user .profile-info {
        padding: var(--space-1) 0 var(--space-4);
        margin: 0;
        gap: var(--space-3);
      }

      [data-theme="light"] .col-user #profileDisplayNickname {
        font-size: 16px;
        font-weight: 600;
        letter-spacing: -0.02em;
      }

      [data-theme="light"] .profile-tabs-wrap {
        gap: var(--space-4);
      }

      [data-theme="light"] .col-user .profile-footer {
        padding: var(--space-2) 0 var(--space-1);
        gap: var(--space-1);
      }

      [data-theme="light"] .dialogs-scroll-strip {
        padding: var(--space-2) var(--space-3) var(--space-3);
      }

      [data-theme="light"] .col-dialogs .dialogs-nav-sticky {
        padding: 0 var(--space-3);
        gap: var(--space-3);
        background: #ffffff;
      }

      [data-theme="light"] .col-dialogs .dialogs-col-title {
        padding: 12px 0 20px;
        font-size: 28px;
        font-weight: 700;
        letter-spacing: -0.03em;
        text-transform: none;
        color: var(--text);
        border-bottom: none;
        background: transparent;
      }

      [data-theme="light"] .col-dialogs .dialogs-filter-pills {
        display: flex;
        flex-wrap: nowrap;
        gap: 4px;
        padding-bottom: var(--space-1);
      }

      [data-theme="light"] .col-dialogs .dialogs-filter-pills .profile-tab {
        flex: 1 1 0;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 7px 6px;
        border-radius: 999px;
        border: none;
        font-size: 12px;
        font-weight: 500;
        background: transparent;
        color: color-mix(in srgb, var(--muted) 92%, transparent);
        transition: background-color 160ms ease, color 160ms ease;
      }

      [data-theme="light"] .col-dialogs .dialogs-filter-pills .profile-tab-icon-wrap {
        width: 16px;
        height: 16px;
      }

      [data-theme="light"] .col-dialogs .dialogs-filter-pills .profile-tab-icon {
        width: 14px;
        height: 14px;
      }

      [data-theme="light"] .col-dialogs .dialogs-filter-pills .profile-tab:hover {
        background: color-mix(in srgb, var(--accent) 5%, transparent);
        color: var(--text);
      }

      [data-theme="light"] .col-dialogs .dialogs-filter-pills .profile-tab.profile-tab-active {
        background: color-mix(in srgb, var(--accent) 12%, transparent);
        color: var(--accent);
        box-shadow: none;
        padding-left: 6px;
      }

      [data-theme="light"] .col-dialogs .profile-tab-panels--aux {
        border: none;
        background: transparent;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
        max-height: none;
        overflow: visible;
        min-height: 0;
      }

      [data-theme="light"] .col-user .col-user-panel-head {
        display: none;
      }

      [data-theme="light"] .col-user .profile-sidebar-hero {
        padding-top: var(--space-4);
      }

      [data-theme="light"] .col-user .profile-sidebar-nav .profile-action-btn.profile-action-btn--active,
      [data-theme="light"] .col-user .profile-sidebar-nav .profile-action-btn:focus-visible {
        background: color-mix(in srgb, var(--accent) 7%, transparent);
        color: var(--text);
      }

      [data-theme="light"] .dialogs-search-stack {
        gap: var(--space-2);
      }

      [data-theme="light"] .dialogs.dialogs-rail {
        gap: 0;
      }

      [data-theme="light"] .dialog-item {
        padding: 7px 0 7px 12px;
      }

      [data-theme="light"] .dialog-item.active {
        background: rgba(59, 130, 246, 0.06);
        box-shadow: inset 2px 0 0 #3b82f6;
      }

      [data-theme="light"] .col-chat-row > .chat-main {
        border-right: none !important;
      }

      [data-theme="light"] .chat-header {
        padding: var(--space-2) var(--space-3);
        box-shadow: 0 1px 0 rgba(15, 23, 42, 0.025);
      }

      [data-theme="light"] .chat-header::after {
        display: none;
      }

      [data-theme="light"] .messages {
        padding: var(--space-3) var(--space-4) var(--space-4);
      }

      [data-theme="light"] .composer-row {
        margin: var(--space-2) var(--space-3) var(--space-3);
      }

      [data-theme="light"] .composer-inner {
        border-radius: var(--radius-control);
        min-height: 44px;
      }

      [data-theme="light"] .empty-chat {
        background: #f4f5f7;
      }
    }

    /* ── Dark theme visual polish (mirrors light principles; dark palette) ── */
    [data-theme="dark"] body {
      font-size: 15px;
      font-weight: 400;
      letter-spacing: -0.011em;
      -webkit-font-smoothing: antialiased;
    }

    [data-theme="dark"] .col-user .panel-scroll {
      padding: 0 var(--space-2) var(--space-3);
    }

    [data-theme="dark"] .col-user .profile-info {
      padding: var(--space-2) var(--space-1) var(--space-3);
      margin: 0 0 var(--space-2);
      border-bottom: none;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      gap: var(--space-2);
    }

    [data-theme="dark"] .col-user .profile-label {
      font-size: 11px;
      font-weight: 400;
      letter-spacing: 0.02em;
      text-transform: none;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
    }

    [data-theme="dark"] .col-user .profile-value {
      font-size: 14px;
      font-weight: 500;
      line-height: 1.35;
    }

    [data-theme="dark"] .col-user .profile-line:first-child .profile-value {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 90%, transparent);
    }

    [data-theme="dark"] .col-user #profileDisplayNickname {
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
    }

    [data-theme="dark"] .col-user .panel-head,
    [data-theme="dark"] .col-dialogs .panel-head {
      padding: var(--space-3) var(--space-3) var(--space-2);
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      border-bottom: none;
      background: transparent;
    }

    [data-theme="dark"] .profile-tabs-wrap {
      gap: var(--space-3);
      margin-top: 0;
    }

    [data-theme="dark"] .profile-tabs {
      gap: var(--space-1);
    }

    [data-theme="dark"] .profile-tab {
      border-radius: var(--radius-control);
      border: none;
      font-size: 13px;
      padding: 6px var(--space-2);
      background: transparent;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
      transition: background-color 160ms ease, color 160ms ease;
    }

    [data-theme="dark"] .profile-tab-label {
      font-size: 13px;
      font-weight: 500;
    }

    [data-theme="dark"] .profile-tab .profile-tab-icon {
      opacity: 0.65;
    }

    [data-theme="dark"] .profile-tab:hover {
      background: color-mix(in srgb, var(--accent) 6%, transparent);
      color: var(--text);
    }

    [data-theme="dark"] .profile-tab:hover .profile-tab-icon,
    [data-theme="dark"] .profile-tab.profile-tab-active .profile-tab-icon {
      opacity: 0.9;
      color: color-mix(in srgb, var(--accent) 75%, var(--text));
    }

    [data-theme="dark"] .profile-tab.profile-tab-active {
      background: color-mix(in srgb, var(--accent) 10%, transparent);
      box-shadow: none;
      padding-left: var(--space-2);
      color: var(--text);
      border-radius: var(--radius-control);
    }

    [data-theme="dark"] .profile-tab-panels {
      border: none;
      background: transparent;
      box-shadow: none;
      border-radius: 0;
      padding: 0;
    }

    [data-theme="dark"] .profile-tab-panels input,
    [data-theme="dark"] .profile-tab-panels .secondary {
      border-color: var(--border);
      border-radius: var(--radius-control);
      background: var(--bg-tertiary);
    }

    [data-theme="dark"] .col-user .profile-footer {
      gap: var(--space-1);
      padding-top: var(--space-3);
      margin-top: auto;
    }

    [data-theme="dark"] .col-user .profile-actions {
      gap: 2px;
    }

    [data-theme="dark"] .col-user .profile-action-btn {
      border-radius: var(--radius-control);
      font-size: 14px;
      font-weight: 400;
      transition: background-color 160ms ease, color 160ms ease;
    }

    [data-theme="dark"] .col-user .profile-action-btn:not(.profile-action-btn--premium):not(.profile-action-btn--premium-owned) {
      border: none;
      background: transparent;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    [data-theme="dark"] .col-user .profile-action-btn:not(.profile-action-btn--premium):not(.profile-action-btn--premium-owned):hover {
      background: color-mix(in srgb, var(--accent) 8%, transparent);
      color: var(--text);
    }

    [data-theme="dark"] .col-user .profile-action-btn:hover .profile-action-icon {
      color: color-mix(in srgb, var(--accent) 70%, var(--text));
    }

    [data-theme="dark"] .profile-action-btn--premium {
      border: none;
      background: color-mix(in srgb, #e8c547 14%, #181d24);
      color: #e8d898;
      text-shadow: none;
      font-weight: 600;
      letter-spacing: 0.02em;
      box-shadow: none;
    }

    [data-theme="dark"] .profile-action-btn--premium:hover {
      border: none;
      background: color-mix(in srgb, #e8c547 20%, #181d24);
      color: #f0e4b0;
      box-shadow: none;
      transform: none;
    }

    [data-theme="dark"] .profile-action-btn--premium .profile-action-icon--premium {
      color: #e8c547 !important;
      filter: none;
    }

    [data-theme="dark"] .profile-action-btn--premium-owned {
      border: none;
      background: color-mix(in srgb, #e8c547 10%, #181d24);
      color: #e8d898;
    }

    [data-theme="dark"] .dialogs-scroll-strip {
      padding: var(--space-2) var(--space-2) var(--space-3) var(--space-3);
    }

    [data-theme="dark"] .dialogs.dialogs-rail {
      gap: 0;
      padding: 0;
    }

    [data-theme="dark"] .dialogs .status.empty-dlg-hint {
      font-size: 13px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 90%, transparent);
      line-height: 1.5;
    }

    [data-theme="dark"] .dialog-item {
      background: transparent;
      border: none;
      border-radius: 0;
      box-shadow: none;
      padding: 7px 0 7px 12px;
      transition: background-color 140ms ease;
    }

    [data-theme="dark"] .dialog-item:hover {
      background: rgba(255, 255, 255, 0.025);
      box-shadow: none;
    }

    [data-theme="dark"] .dialog-item:active {
      background: rgba(255, 255, 255, 0.04);
    }

    [data-theme="dark"] .dialog-item.active {
      outline: none;
      background: rgba(59, 130, 246, 0.05);
      box-shadow: inset 2px 0 0 #3b82f6;
    }

    [data-theme="dark"] .channel-rail-item--official-news {
      background: rgba(59, 130, 246, 0.02);
    }

    [data-theme="dark"] .channel-rail-item--official-news:hover {
      background: rgba(59, 130, 246, 0.045);
    }

    [data-theme="dark"] .channel-rail-item--official-news.active {
      background: rgba(59, 130, 246, 0.08);
      box-shadow: inset 2px 0 0 #38bdf8;
    }

    [data-theme="dark"] .dialog-peer-line strong {
      font-size: 14px;
      font-weight: 600;
      letter-spacing: -0.01em;
      color: var(--text);
    }

    [data-theme="dark"] .channel-rail-official-title {
      font-size: 14px;
      font-weight: 600;
      letter-spacing: -0.01em;
      color: var(--text);
    }

    [data-theme="dark"] .channel-rail-item--official-news .channel-rail-official-title {
      font-weight: 700;
      color: color-mix(in srgb, #f0f9ff 90%, #7dd3fc);
    }

    [data-theme="dark"] .dialog-item .dlg-preview,
    [data-theme="dark"] .channel-rail-official-sub {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      line-height: 1.25;
      margin-top: 0;
    }

    [data-theme="dark"] .dialog-item-body {
      gap: 2px;
    }

    [data-theme="dark"] .dialog-level {
      font-size: 10px;
      font-weight: 400;
      opacity: 0.72;
    }

    [data-theme="dark"] .panel-head {
      font-weight: 500;
      font-size: 14px;
      border-bottom-color: transparent;
      background: transparent;
    }

    [data-theme="dark"] button.primary,
    [data-theme="dark"] button.secondary {
      border-radius: var(--radius-control);
      border-color: var(--border);
    }

    [data-theme="dark"] button.secondary {
      background: var(--bg-tertiary);
    }

    [data-theme="dark"] button.secondary:hover {
      background: color-mix(in srgb, var(--accent) 6%, var(--bg-tertiary));
      border-color: var(--border-strong);
    }

    [data-theme="dark"] .btn-pastel {
      border-radius: var(--radius-control);
      background: var(--bg-tertiary);
      color: var(--muted);
      border: none;
    }

    [data-theme="dark"] .btn-pastel:hover {
      background: color-mix(in srgb, var(--accent) 6%, var(--bg-tertiary));
      color: var(--text);
    }

    [data-theme="dark"] .chat-main {
      background: var(--panel);
    }

    [data-theme="dark"] .messages {
      gap: 10px;
      padding: var(--space-3) var(--space-3) var(--space-4);
    }

    [data-theme="dark"] .messages.olone-chat-bg--system {
      background-color: var(--bg-tertiary);
      background-image: none;
    }

    [data-theme="dark"] .empty-chat {
      font-size: 14px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      letter-spacing: 0;
    }

    [data-theme="dark"] .chat-header {
      background: var(--panel);
      border-bottom: none;
      box-shadow: 0 1px 0 rgba(0, 0, 0, 0.22);
    }

    [data-theme="dark"] .olone-chat-header__title {
      font-size: 15px;
      font-weight: 600;
      letter-spacing: -0.015em;
    }

    [data-theme="dark"] .olone-chat-header__subtitle {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
    }

    [data-theme="dark"] .olone-chat-header-menu,
    [data-theme="dark"] .reaction-pop,
    [data-theme="dark"] .emoji-picker {
      border: none;
      background: var(--panel);
      box-shadow: var(--shadow-panel);
    }

    [data-theme="dark"] .bubble.in {
      background: var(--bubble-in);
      border: none;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
      padding: 8px 13px 7px;
    }

    [data-theme="dark"] .bubble.out {
      background: var(--bubble-out);
      border: none;
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
      padding: 8px 13px 7px;
    }

    [data-theme="dark"] .bubble.in:hover,
    [data-theme="dark"] .bubble.out:hover {
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.24);
    }

    [data-theme="dark"] .bubble .bubble-body {
      line-height: 1.52;
      font-weight: 400;
    }

    [data-theme="dark"] .bubble .meta {
      margin-top: 5px;
      font-size: 10px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 82%, transparent);
      opacity: 1;
    }

    [data-theme="dark"] .bubble.selected {
      outline: none;
      background: color-mix(in srgb, var(--accent) 10%, var(--bubble-in));
      box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent) 35%, transparent);
      transform: none;
    }

    [data-theme="dark"] .bubble.out.selected {
      background: color-mix(in srgb, var(--accent) 8%, var(--bubble-out));
    }

    [data-theme="dark"] .timeline-day-sep span,
    [data-theme="dark"] .timeline-floating-day span {
      background: color-mix(in srgb, var(--panel) 80%, var(--bg-tertiary));
      border: none;
      box-shadow: none;
      color: color-mix(in srgb, var(--muted) 85%, transparent);
      font-size: 11px;
      font-weight: 400;
    }

    [data-theme="dark"] .timeline-floating-day span {
      backdrop-filter: none;
    }

    [data-theme="dark"] .reaction-chip {
      border: none;
      background: color-mix(in srgb, var(--bubble-in) 88%, var(--bg-tertiary));
      box-shadow: none;
      transition: background-color 140ms ease;
    }

    [data-theme="dark"] .reaction-chip:hover {
      transform: none;
      background: var(--bubble-in);
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.18);
    }

    [data-theme="dark"] .reaction-chip.mine {
      border: none;
      background: color-mix(in srgb, var(--accent) 12%, var(--bubble-in));
      box-shadow: none;
    }

    [data-theme="dark"] .reaction-chip small {
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 85%, transparent);
    }

    [data-theme="dark"] .reaction-add {
      border: none;
      background: transparent;
      color: color-mix(in srgb, var(--muted) 82%, transparent);
    }

    [data-theme="dark"] .reaction-add:hover {
      background: color-mix(in srgb, var(--panel) 70%, transparent);
      color: var(--muted);
      box-shadow: none;
    }

    [data-theme="dark"] .composer {
      background: var(--panel);
      border-top: none;
      box-shadow: none;
    }

    [data-theme="dark"] .composer-inner {
      background: var(--bg-tertiary);
      border: none;
      box-shadow: none;
    }

    [data-theme="dark"] #messageInput.composer-input {
      font-size: 15px;
      font-weight: 400;
      line-height: 1.5;
    }

    [data-theme="dark"] .send-fab {
      background: color-mix(in srgb, var(--accent) 88%, #11151b);
      color: #ffffff;
      box-shadow: none;
    }

    [data-theme="dark"] .send-fab:hover {
      background: var(--accent);
      color: #ffffff;
      filter: none;
    }

    [data-theme="dark"] .composer-attach-preview {
      border: none;
      background: var(--bg-tertiary);
      box-shadow: none;
    }

    [data-theme="dark"] .bubble-file-card {
      border: none;
      background: var(--bubble-in);
      box-shadow: 0 1px 2px rgba(0, 0, 0, 0.2);
    }

    [data-theme="dark"] .bubble-file-card:hover {
      border: none;
      background: var(--bubble-in);
      box-shadow: 0 1px 3px rgba(0, 0, 0, 0.24);
    }

    [data-theme="dark"] .col-chat-row > .chat-main {
      border-right-color: transparent;
    }

    [data-theme="dark"] .modal {
      border: none;
      background: var(--panel);
      box-shadow: var(--shadow-panel);
    }

    [data-theme="dark"] .modal-backdrop--glass {
      background: rgba(8, 10, 14, 0.62);
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

    [data-theme="dark"] .profile-settings-sheet,
    [data-theme="dark"] .settings-nested-sheet,
    [data-theme="dark"] .ui-display-hint-card {
      border: none;
      background: var(--bg-tertiary);
      box-shadow: none;
    }

    [data-theme="dark"] .profile-settings-title {
      font-size: 11px;
      font-weight: 500;
      letter-spacing: 0.05em;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
    }

    [data-theme="dark"] .modal--premium {
      background: var(--panel);
      box-shadow: var(--shadow-panel);
    }

    [data-theme="dark"] .premium-modal-title {
      color: #e8d898;
      text-shadow: none;
      font-weight: 700;
    }

    [data-theme="dark"] .premium-crown-wrap {
      background: color-mix(in srgb, #e8c547 16%, #181d24);
      border: none;
      box-shadow: none;
    }

    [data-theme="dark"] .premium-crown-wrap svg {
      filter: none;
    }

    [data-theme="dark"] .icon-btn.inactive-mail {
      background: var(--bg-tertiary);
      color: var(--muted);
      border: none;
    }

    [data-theme="dark"] .admin-grant-input {
      font-size: 15px;
      border-color: var(--border);
      border-radius: var(--radius-control);
      background: var(--bg-tertiary);
    }

    [data-theme="dark"] .profile-tab-stub-hint {
      font-size: 14px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 90%, transparent);
    }

    /* ── Dark theme: desktop premium card shell (≥921px) ── */
    @media (min-width: 921px) {
      [data-theme="dark"] body:not(.app-guest) {
        background: #11151b;
      }

      [data-theme="dark"] .messenger-shell:not(.hidden) {
        padding: var(--shell-pad);
        gap: var(--shell-gap);
        background: #11151b;
        border-top: none;
        box-sizing: border-box;
      }

      [data-theme="dark"] .messenger-shell > .panel-card,
      [data-theme="dark"] .messenger-shell > .col-chat {
        border-radius: var(--radius-panel);
        background: #181d24;
        border: none !important;
        box-shadow: var(--shadow-panel);
        overflow: hidden;
      }

      [data-theme="dark"] .col-user .panel-scroll {
        padding: 0 var(--space-3) var(--space-3);
      }

      [data-theme="dark"] .col-user .panel-head,
      [data-theme="dark"] .col-dialogs .panel-head {
        padding: var(--space-4) var(--space-3) var(--space-2);
      }

      [data-theme="dark"] .col-user .profile-info {
        padding: var(--space-1) 0 var(--space-4);
        margin: 0;
        gap: var(--space-3);
      }

      [data-theme="dark"] .col-user #profileDisplayNickname {
        font-size: 16px;
        font-weight: 600;
        letter-spacing: -0.02em;
      }

      [data-theme="dark"] .profile-tabs-wrap {
        gap: var(--space-4);
      }

      [data-theme="dark"] .col-user .profile-footer {
        padding: var(--space-2) 0 var(--space-1);
        gap: var(--space-1);
      }

      [data-theme="dark"] .dialogs-scroll-strip {
        padding: var(--space-2) var(--space-3) var(--space-3);
      }

      [data-theme="dark"] .col-dialogs .dialogs-nav-sticky {
        padding: 0 var(--space-3);
        gap: var(--space-3);
        background: #181d24;
      }

      [data-theme="dark"] .col-dialogs .dialogs-col-title {
        padding: 12px 0 20px;
        font-size: 28px;
        font-weight: 700;
        letter-spacing: -0.03em;
        text-transform: none;
        color: var(--text);
        border-bottom: none;
        background: transparent;
      }

      [data-theme="dark"] .col-dialogs .dialogs-filter-pills {
        display: flex;
        flex-wrap: nowrap;
        gap: 4px;
        padding-bottom: var(--space-1);
      }

      [data-theme="dark"] .col-dialogs .dialogs-filter-pills .profile-tab {
        flex: 1 1 0;
        min-width: 0;
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 4px;
        padding: 7px 6px;
        border-radius: 999px;
        border: none;
        font-size: 12px;
        font-weight: 500;
        background: transparent;
        color: color-mix(in srgb, var(--muted) 92%, transparent);
        transition: background-color 160ms ease, color 160ms ease;
      }

      [data-theme="dark"] .col-dialogs .dialogs-filter-pills .profile-tab-icon-wrap {
        width: 16px;
        height: 16px;
      }

      [data-theme="dark"] .col-dialogs .dialogs-filter-pills .profile-tab-icon {
        width: 14px;
        height: 14px;
      }

      [data-theme="dark"] .col-dialogs .dialogs-filter-pills .profile-tab:hover {
        background: color-mix(in srgb, var(--accent) 8%, transparent);
        color: var(--text);
      }

      [data-theme="dark"] .col-dialogs .dialogs-filter-pills .profile-tab.profile-tab-active {
        background: color-mix(in srgb, var(--accent) 16%, transparent);
        color: color-mix(in srgb, var(--accent) 82%, #fff);
        box-shadow: none;
        padding-left: 6px;
      }

      [data-theme="dark"] .col-dialogs .profile-tab-panels--aux {
        border: none;
        background: transparent;
        box-shadow: none;
        border-radius: 0;
        padding: 0;
        max-height: none;
        overflow: visible;
        min-height: 0;
      }

      [data-theme="dark"] .col-user .col-user-panel-head {
        display: none;
      }

      [data-theme="dark"] .col-user .profile-sidebar-hero {
        padding-top: var(--space-4);
      }

      [data-theme="dark"] .dialogs-search-stack {
        gap: var(--space-2);
      }

      [data-theme="dark"] .dialogs.dialogs-rail {
        gap: 0;
      }

      [data-theme="dark"] .dialog-item {
        padding: 7px 0 7px 12px;
      }

      [data-theme="dark"] .dialog-item.active {
        background: rgba(59, 130, 246, 0.05);
        box-shadow: inset 2px 0 0 #3b82f6;
      }

      [data-theme="dark"] .col-chat-row > .chat-main {
        border-right: none !important;
      }

      [data-theme="dark"] .chat-header {
        padding: var(--space-2) var(--space-3);
        box-shadow: 0 1px 0 rgba(0, 0, 0, 0.2);
      }

      [data-theme="dark"] .messages {
        padding: var(--space-3) var(--space-4) var(--space-4);
      }

      [data-theme="dark"] .composer-row {
        margin: var(--space-2) var(--space-3) var(--space-3);
      }

      [data-theme="dark"] .composer-inner {
        border-radius: var(--radius-control);
        min-height: 44px;
      }

      [data-theme="dark"] .empty-chat {
        background: var(--bg-tertiary);
      }
    }

    * {
      box-sizing: border-box;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    *::-webkit-scrollbar {
      width: 8px;
      height: 8px;
    }

    *::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
      border-radius: 100px;
    }

    *::-webkit-scrollbar-thumb {
      background-color: var(--scrollbar-thumb);
      border-radius: 100px;
      border: 2px solid var(--scrollbar-track);
      background-clip: padding-box;
    }

    *::-webkit-scrollbar-thumb:hover {
      background-color: var(--scrollbar-thumb-hover);
    }

    *::-webkit-scrollbar-corner {
      background: var(--scrollbar-track);
    }
    html, body {
      height: 100%;
    }
    body {
      margin: 0;
      font-family: Inter, system-ui, "Segoe UI", sans-serif;
      background: var(--bg);
      color: var(--text);
      min-height: 100vh;
      display: flex;
      flex-direction: column;
      transition: background-color 240ms ease, color 240ms ease;
    }

    .app {
      flex: 1;
      display: flex;
      flex-direction: column;
      min-height: 0;
      min-width: 0;
      width: 100%;
    }

    /* Гостевой экран: мессенджер скрыт до входа */
    body.app-guest {
      overflow: hidden;
      background:
        radial-gradient(ellipse 120% 70% at 50% -15%, color-mix(in srgb, var(--text) 7%, transparent), transparent 55%),
        var(--bg);
    }

    body.app-guest .messenger-shell {
      display: none !important;
    }

    body.app-guest .pre-chat-wrap {
      position: fixed;
      inset: 0;
      z-index: 2500;
      flex: none;
      width: 100%;
      height: 100%;
      max-height: none;
      box-sizing: border-box;
    }

    /* Landing / auth: centered card */
    .pre-chat-wrap {
      flex: 1;
      display: grid;
      place-items: center;
      padding: 20px;
      overflow: auto;
    }

    .pre-chat-card {
      width: min(1100px, 100%);
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 16px;
      box-shadow: 0 18px 40px var(--shadow);
      overflow: hidden;
      transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease, box-shadow 240ms ease;
    }

    .pre-chat-card.landingLayout,
    .pre-chat-card.authLayout {
      box-shadow:
        0 28px 70px var(--shadow),
        0 0 0 1px color-mix(in srgb, var(--border) 72%, transparent);
    }

    .pre-chat-card.landingLayout {
      width: min(420px, 100%);
      max-height: min(92vh, 900px);
    }

    .pre-chat-card.landingLayout .sidebar-inner {
      border-right: none;
    }

    .pre-chat-card.landingLayout .brand {
      display: none;
    }

    .pre-chat-card.authLayout {
      width: min(900px, 100%);
      max-height: min(92vh, 900px);
    }

    .pre-chat-card.authLayout .brand span {
      font-family: var(--font-brand-rounded);
      font-weight: 800;
      font-size: 1.35rem;
      letter-spacing: 0.06em;
    }

    .sidebar-inner {
      display: grid;
      grid-template-rows: auto auto;
      background: var(--panel);
      transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
    }

    /* Full-viewport messenger */
    .messenger-shell {
      flex: 1;
      display: grid;
      grid-template-columns: minmax(220px, 260px) minmax(240px, 300px) minmax(0, 1fr);
      grid-template-rows: 1fr;
      min-height: 0;
      background: var(--bg);
      border-top: 1px solid var(--border);
    }

    .messenger-shell.profile-open {
      grid-template-columns: minmax(200px, 240px) minmax(220px, 280px) minmax(0, 1fr);
    }

    .panel-card {
      background: var(--panel);
      border-right: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      min-height: 0;
      min-width: 0;
    }

    /* Поиск перенесён внутрь main.col-chat (узкая колонка справа от переписки на ПК) */
    .col-chat-row {
      display: flex;
      flex-direction: row;
      flex: 1;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
    }

    .col-chat-row > .chat-main {
      border-right: 1px solid var(--border);
    }

    .group-chats-rail-wrap--topics #groupChatsRail {
      display: none !important;
    }

    .gc-topics-rail {
      display: flex;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      min-width: 0;
    }

    .gc-topics-rail-top {
      flex-shrink: 0;
    }

    .gc-topics-rail-scroll {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
    }

    .gc-topics-rail-head {
      padding: 10px 12px 6px;
      flex-shrink: 0;
    }

    .gc-topics-rail-top {
      flex-shrink: 0;
    }

    .gc-topics-rail-body {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      align-items: stretch;
    }

    .gc-topics-back-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      width: 100%;
      padding: 9px 12px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 88%, var(--bg));
      color: var(--text);
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      transition: background 0.15s ease, border-color 0.15s ease, transform 0.12s ease;
    }

    .gc-topics-back-btn:hover {
      background: color-mix(in srgb, var(--accent, #5b8def) 10%, transparent);
      border-color: color-mix(in srgb, var(--accent, #5b8def) 35%, var(--border));
      transform: translateX(-1px);
    }

    .gc-topics-back-icon {
      font-size: 16px;
      line-height: 1;
      opacity: 0.85;
    }

    .gc-topics-rail-search-wrap {
      padding: 0 12px 8px;
      flex-shrink: 0;
    }

    .gc-topics-search {
      display: block;
      width: 100%;
      box-sizing: border-box;
      height: 36px;
      margin: 0;
      padding: 0 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--text);
      font-size: 13px;
      line-height: 36px;
    }

    .gc-topics-search::placeholder {
      color: color-mix(in srgb, var(--text) 45%, transparent);
    }

    .gc-topics-list {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      padding: 6px 8px 10px;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .gc-topic-item {
      position: relative;
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 10px;
      width: 100%;
      padding: 10px 12px 10px 10px;
      border: 1px solid transparent;
      border-radius: 14px;
      background: color-mix(in srgb, var(--panel) 70%, transparent);
      color: var(--text);
      text-align: left;
      cursor: pointer;
      transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, transform 0.12s ease;
    }

    .gc-topic-item:hover {
      background: color-mix(in srgb, var(--accent, #5b8def) 10%, var(--panel));
      border-color: color-mix(in srgb, var(--accent, #5b8def) 28%, transparent);
      transform: translateX(1px);
    }

    .gc-topic-item--active {
      background: color-mix(in srgb, var(--accent, #5b8def) 18%, var(--panel));
      border-color: color-mix(in srgb, var(--accent, #5b8def) 55%, transparent);
      box-shadow: inset 3px 0 0 var(--accent, #5b8def);
      padding-left: 7px;
    }

    .gc-topic-item--pinned .gc-topic-item__icon::after {
      content: "📌";
      position: absolute;
      top: -4px;
      right: -4px;
      font-size: 9px;
    }

    .gc-topic-item--closed .gc-topic-item__lock {
      display: inline;
    }

    .gc-topic-item__icon {
      position: relative;
      flex-shrink: 0;
      width: 38px;
      height: 38px;
      border-radius: 11px;
      background: color-mix(in srgb, var(--accent, #5b8def) 12%, var(--bg));
      border: 1px solid color-mix(in srgb, var(--accent, #5b8def) 22%, var(--border));
      display: grid;
      place-items: center;
      font-size: 20px;
      line-height: 1;
    }

    .gc-topic-item__body {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .gc-topic-item__title-row {
      display: flex;
      align-items: center;
      gap: 6px;
      min-width: 0;
    }

    .gc-topic-item__title {
      font-weight: 600;
      font-size: 14px;
      line-height: 1.2;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .gc-topic-item__lock {
      display: none;
      font-size: 11px;
      opacity: 0.7;
      flex-shrink: 0;
    }

    .gc-topic-item__preview {
      font-size: 12px;
      color: var(--muted, rgba(255, 255, 255, 0.55));
      line-height: 1.25;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      width: 100%;
    }

    .gc-topic-item__badge {
      position: absolute;
      top: 8px;
      right: 8px;
      min-width: 18px;
      height: 18px;
      padding: 0 5px;
      border-radius: 9px;
      background: var(--accent, #5b8def);
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      display: grid;
      place-items: center;
    }

    .gc-topic-item__gear {
      position: absolute;
      bottom: 6px;
      right: 8px;
      font-size: 12px;
      opacity: 0.5;
    }

    .gc-topic-item:hover .gc-topic-item__gear {
      opacity: 1;
    }

    .gc-topics-add-btn {
      margin: 0 10px 10px;
      padding: 10px;
      border-radius: 10px;
      border: 1px dashed var(--border);
      background: transparent;
      color: var(--text);
      cursor: pointer;
      transition: background 0.15s ease;
    }

    .gc-topics-add-btn:hover {
      background: color-mix(in srgb, var(--accent, #5b8def) 10%, transparent);
    }

    .gc-topics-empty-hint {
      margin: 12px 10px;
      font-size: 13px;
      line-height: 1.4;
      color: var(--muted);
      text-align: center;
    }

    .gc-slow-mode-banner {
      margin: 0 12px 8px;
      padding: 10px 12px;
      border-radius: 10px;
      background: color-mix(in srgb, #e53935 12%, var(--panel));
      border: 1px solid color-mix(in srgb, #e53935 35%, var(--border));
      color: var(--text);
      font-size: 13px;
      font-weight: 600;
    }

    .advanced-chat-toggle {
      display: flex;
      align-items: flex-start;
      gap: 12px;
      padding: 14px;
      margin: 8px 0 12px;
      border-radius: 14px;
      border: 1px solid var(--border);
      background: linear-gradient(
        135deg,
        color-mix(in srgb, var(--accent, #5b8def) 8%, transparent),
        color-mix(in srgb, var(--panel) 90%, transparent)
      );
      cursor: pointer;
      transition: border-color 0.2s ease, box-shadow 0.2s ease;
    }

    .advanced-chat-toggle:hover {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 45%, var(--border));
      box-shadow: 0 4px 20px color-mix(in srgb, var(--accent, #5b8def) 12%, transparent);
    }

    .advanced-chat-toggle--on {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 55%, var(--border));
      box-shadow: 0 0 0 1px color-mix(in srgb, var(--accent, #5b8def) 25%, transparent);
    }

    .advanced-chat-toggle input {
      margin-top: 3px;
      accent-color: var(--accent, #5b8def);
    }

    .advanced-chat-toggle-text strong {
      display: block;
      font-size: 14px;
      margin-bottom: 4px;
    }

    .advanced-chat-toggle-text span {
      font-size: 12px;
      color: var(--muted, rgba(255, 255, 255, 0.55));
      line-height: 1.35;
    }

    #gcAdvancedOptions.hidden {
      display: none;
    }

    .gc-topic-emoji-row {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
    }

    .gc-topic-emoji-btn {
      flex-shrink: 0;
      width: 48px;
      height: 48px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--accent, #5b8def) 10%, var(--panel));
      font-size: 24px;
      line-height: 1;
      cursor: pointer;
      transition: border-color 0.15s ease, transform 0.12s ease;
    }

    .gc-topic-emoji-btn:hover {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 45%, var(--border));
      transform: scale(1.04);
    }

    .gc-topic-name-wrap {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .gc-topic-emoji-picker {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      padding: 8px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--bg);
      max-height: 140px;
      overflow-y: auto;
    }

    .gc-topic-emoji-picker.hidden {
      display: none;
    }

    .gc-topic-emoji-opt {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      border: 1px solid transparent;
      background: transparent;
      font-size: 20px;
      cursor: pointer;
      transition: background 0.12s ease, border-color 0.12s ease;
    }

    .gc-topic-emoji-opt:hover,
    .gc-topic-emoji-opt--picked {
      background: color-mix(in srgb, var(--accent, #5b8def) 14%, transparent);
      border-color: color-mix(in srgb, var(--accent, #5b8def) 35%, transparent);
    }

    /* Модалки тем — :not(.hidden), иначе #id перебивает .hidden и окно не закрывается */
    #gcTopicCreateModal:not(.hidden),
    #gcTopicSettingsModal:not(.hidden),
    #gcTopicDeleteModal:not(.hidden) {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: max(16px, env(safe-area-inset-top)) 16px max(16px, env(safe-area-inset-bottom));
    }

    /* ── Topic modals (settings / create / delete) — isolated from global checkbox styles ── */
    .gc-topic-modal {
      width: min(440px, calc(100vw - 24px));
      max-width: 100%;
      max-height: min(90vh, 720px);
      flex-shrink: 0;
      box-sizing: border-box;
      border: 1px solid color-mix(in srgb, var(--border) 88%, var(--text) 8%);
      border-radius: 16px;
      background: var(--panel);
      color: var(--text);
      box-shadow:
        0 0 0 1px color-mix(in srgb, var(--text) 6%, transparent),
        0 24px 64px color-mix(in srgb, #000 48%, transparent);
      display: flex;
      flex-direction: column;
      overflow: hidden;
    }

    .gc-topic-modal__head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 18px 20px 14px;
      flex-shrink: 0;
      border-bottom: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
      background: color-mix(in srgb, var(--panel) 94%, var(--bg));
    }

    .gc-topic-modal__title {
      margin: 0;
      font-size: 18px;
      font-weight: 700;
      line-height: 1.25;
      letter-spacing: -0.02em;
      color: var(--text);
    }

    .gc-topic-modal__scroll {
      flex: 1 1 auto;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      padding: 18px 20px;
      display: flex;
      flex-direction: column;
      gap: 22px;
      scrollbar-gutter: stable;
    }

    .gc-topic-modal__scroll::-webkit-scrollbar {
      width: 8px;
    }

    .gc-topic-modal__scroll::-webkit-scrollbar-thumb {
      background: color-mix(in srgb, var(--muted) 35%, transparent);
      border-radius: 8px;
    }

    .gc-topic-modal__foot {
      flex-shrink: 0;
      padding: 14px 20px 18px;
      border-top: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
      background: color-mix(in srgb, var(--panel) 92%, var(--bg));
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .gc-topic-section {
      display: flex;
      flex-direction: column;
      gap: 12px;
      min-width: 0;
    }

    .gc-topic-section__head {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .gc-topic-section__title {
      margin: 0;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.07em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .gc-topic-section__desc {
      margin: 0;
      font-size: 12px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--muted) 92%, var(--text));
    }

    .gc-topic-field {
      display: flex;
      flex-direction: column;
      gap: 6px;
      min-width: 0;
    }

    .gc-topic-field__label {
      font-size: 13px;
      font-weight: 600;
      color: var(--text);
    }

    .gc-topic-control {
      display: block;
      width: 100%;
      max-width: 100%;
      min-width: 0;
      box-sizing: border-box;
      height: 42px;
      padding: 0 12px;
      font: inherit;
      font-size: 14px;
      line-height: 1.2;
      color: var(--text);
      background: var(--bg);
      border: 1px solid var(--border);
      border-radius: 10px;
      transition: border-color 0.15s ease, box-shadow 0.15s ease;
    }

    .gc-topic-control:hover {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 35%, var(--border));
    }

    .gc-topic-control:focus-visible {
      outline: none;
      border-color: color-mix(in srgb, var(--accent, #5b8def) 55%, var(--border));
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #5b8def) 22%, transparent);
    }

    select.gc-topic-control {
      cursor: pointer;
      padding-right: 32px;
    }

    .gc-topic-icon-name {
      display: flex;
      flex-direction: row;
      align-items: flex-start;
      gap: 12px;
      min-width: 0;
    }

    .gc-topic-modal .gc-topic-emoji-btn {
      flex: 0 0 48px;
      width: 48px;
      height: 48px;
      margin: 0;
    }

    .gc-topic-icon-name__fields {
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .gc-topic-modal .gc-topic-emoji-picker {
      margin-top: 4px;
    }

    .gc-topic-switch-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
    }

    .gc-topic-switch {
      display: flex;
      flex-direction: row;
      align-items: flex-start;
      gap: 12px;
      padding: 12px 14px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
      background: color-mix(in srgb, var(--bg) 55%, var(--panel));
      transition: border-color 0.15s ease, background 0.15s ease;
      min-width: 0;
    }

    .gc-topic-switch:hover {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 28%, var(--border));
      background: color-mix(in srgb, var(--accent, #5b8def) 6%, var(--panel));
    }

    .gc-topic-switch:has(.gc-topic-switch__input:focus-visible) {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 45%, var(--border));
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--accent, #5b8def) 18%, transparent);
    }

    .gc-topic-switch__input {
      flex: 0 0 18px;
      width: 18px;
      height: 18px;
      margin: 2px 0 0;
      cursor: pointer;
      accent-color: var(--accent, #5b8def);
    }

    .gc-topic-switch__content {
      flex: 1 1 auto;
      min-width: 0;
      display: block;
      cursor: pointer;
    }

    .gc-topic-switch__title {
      display: block;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.35;
      color: var(--text);
    }

    .gc-topic-switch__desc {
      display: block;
      margin-top: 4px;
      font-size: 12px;
      font-weight: 400;
      line-height: 1.45;
      color: var(--muted);
      white-space: normal;
      word-wrap: break-word;
      overflow-wrap: anywhere;
    }

    .gc-topic-modal__danger {
      width: 100%;
      box-sizing: border-box;
      padding: 11px 14px;
      font-size: 14px;
      font-weight: 600;
      border-radius: 10px;
      transition: background 0.15s ease, border-color 0.15s ease;
    }

    .gc-topic-modal__actions {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 10px;
    }

    .gc-topic-modal__actions .secondary,
    .gc-topic-modal__actions .primary {
      flex: 1 1 120px;
      min-width: 0;
      min-height: 42px;
      padding: 0 16px;
      font-size: 14px;
      font-weight: 600;
      border-radius: 10px;
      transition: background 0.15s ease, border-color 0.15s ease, transform 0.1s ease;
    }

    .gc-topic-modal__actions .secondary:active,
    .gc-topic-modal__actions .primary:active {
      transform: scale(0.98);
    }

    .gc-topic-modal__intro {
      margin: 0;
      font-size: 14px;
      line-height: 1.5;
      color: var(--muted);
    }

    @media (max-width: 480px) {
      .gc-topic-modal__head,
      .gc-topic-modal__scroll,
      .gc-topic-modal__foot {
        padding-left: 16px;
        padding-right: 16px;
      }

      .gc-topic-icon-name {
        flex-wrap: wrap;
      }

      .gc-topic-modal__actions {
        flex-direction: column;
      }

      .gc-topic-modal__actions .secondary,
      .gc-topic-modal__actions .primary {
        flex: 1 1 auto;
        width: 100%;
      }
    }

    .panel-head {
      flex-shrink: 0;
      padding: 12px 14px;
      font-weight: 700;
      font-size: 14px;
      border-bottom: 1px solid var(--border);
      background: var(--panel);
    }

    .panel-scroll {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .col-user .panel-scroll {
      display: flex;
      flex-direction: column;
    }

    .col-user .settings {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-height: 0;
    }

    .col-user .profile-footer {
      margin-top: auto;
      width: 100%;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-info {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-line {
      display: flex;
      flex-direction: column;
      gap: 2px;
      line-height: 1.35;
    }

    .profile-label {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .profile-value {
      font-size: 15px;
      font-weight: 600;
      color: var(--text);
      word-break: break-all;
    }

    .profile-value.profile-display-with-crown {
      display: inline-flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 6px;
    }

    .premium-crown-inline {
      display: inline-flex;
      align-items: center;
      vertical-align: middle;
      flex-shrink: 0;
      color: #e8c547;
      filter: drop-shadow(0 0 5px rgba(232, 197, 71, 0.5));
    }

    .premium-crown-inline svg {
      display: block;
    }

    .friend-row-id-sub {
      margin-top: 3px;
      font-size: 11px;
      font-weight: 600;
      color: var(--muted);
      word-break: break-all;
      line-height: 1.3;
    }

    .profile-viewer-internal-id-line {
      font-size: 12px;
      font-weight: 650;
      color: var(--muted);
      margin: 0 0 4px;
      word-break: break-all;
      line-height: 1.35;
    }

    [data-theme="light"] .premium-crown-inline {
      color: #b8891f;
    }

    .friend-row-id .premium-crown-inline,
    .dialog-peer-line .premium-crown-inline,
    .profile-card .premium-crown-inline {
      margin-left: 2px;
    }

    .dialog-peer-line .premium-crown-inline {
      opacity: 0.75;
      filter: drop-shadow(0 0 3px rgba(232, 197, 71, 0.28));
    }

    .profile-action-btn--premium-owned {
      border-color: rgba(201, 162, 39, 0.55);
      background: linear-gradient(
        165deg,
        rgba(201, 162, 39, 0.12) 0%,
        rgba(201, 162, 39, 0.04) 100%
      );
      color: #e8d898;
      cursor: default;
    }

    .profile-action-btn--premium-owned:hover {
      transform: none;
    }

    .admin-premium-section {
      margin-top: 0;
      padding-top: 0;
      border-top: none;
    }

    .admin-grant-row {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      margin-top: 8px;
    }

    .admin-grant-input {
      flex: 1 1 160px;
      min-width: 140px;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--text);
      font-size: 14px;
    }

    .profile-tabs-wrap {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-top: 4px;
    }

    .dialogs-tab-toolbar {
      display: flex;
      flex-direction: column;
      gap: 6px;
      min-width: 0;
    }

    .channels-tab-toolbar-combo {
      display: flex;
      align-items: stretch;
      gap: 8px;
      min-width: 0;
      flex-wrap: nowrap;
    }

    .channels-tab-toolbar-combo .olone-search-field {
      flex: 1 1 auto;
      min-width: 0;
    }

    .channels-tab-toolbar-combo .olone-search-field input[type="search"] {
      width: 100%;
      padding-right: 44px;
    }

    .channels-tab-toolbar-combo .olone-search-field input[type="search"]::-webkit-search-cancel-button,
    .channel-discovery-modal-field .olone-search-field input[type="search"]::-webkit-search-cancel-button {
      -webkit-appearance: none;
      appearance: none;
      display: none;
    }

    .channels-tab-toolbar-combo .olone-search-field input[type="search"]::-webkit-search-decoration,
    .channels-tab-toolbar-combo .olone-search-field input[type="search"]::-webkit-search-results-button,
    .channel-discovery-modal-field .olone-search-field input[type="search"]::-webkit-search-decoration,
    .channel-discovery-modal-field .olone-search-field input[type="search"]::-webkit-search-results-button {
      display: none;
    }

    .channel-toolbar-icon-btn {
      flex: 0 0 auto;
    }

    .modal--channel-discovery {
      width: min(480px, calc(100vw - 28px));
      max-height: min(88vh, 680px);
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .channel-discovery-modal-body {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding-top: 4px;
      min-height: 0;
    }

    .channel-discovery-modal-field .olone-search-field {
      width: 100%;
    }

    .channel-discovery-modal-field .olone-search-field input[type="search"] {
      padding-right: 44px;
    }

    .channel-discovery-status {
      font-size: 13px;
      color: var(--muted);
      min-height: 18px;
      padding: 0 2px;
    }

    .channel-discovery-results {
      min-height: 0;
      max-height: min(52vh, 420px);
      overflow-y: auto;
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding-right: 2px;
    }

    .channel-discovery-card {
      display: grid;
      grid-template-columns: 44px minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      min-height: 76px;
      padding: 12px 14px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
      background: color-mix(in srgb, var(--panel) 88%, transparent);
    }

    .channel-discovery-card--compact {
      min-height: 72px;
    }

    button.channel-discovery-card {
      width: 100%;
      margin: 0;
      font: inherit;
      color: inherit;
      text-align: left;
      appearance: none;
      cursor: pointer;
    }

    .channel-discovery-card:focus-within {
      border-color: color-mix(in srgb, var(--accent, #4a7cff) 38%, var(--border));
    }

    .channel-discovery-card:has(.channel-discovery-card-avatar.channel-icon-host) {
      grid-template-columns: 56px minmax(0, 1fr) auto;
    }

    .channel-discovery-card-avatar {
      flex: 0 0 auto;
      width: 44px;
      height: 44px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0;
      font-weight: normal;
      background: color-mix(in srgb, var(--accent, #4a7cff) 10%, var(--panel));
      color: var(--text);
      overflow: hidden;
      border: 1px solid color-mix(in srgb, var(--accent, #4a7cff) 18%, transparent);
    }

    .channel-discovery-card-avatar.channel-icon-host {
      padding: 0;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
    }

    .channel-discovery-card-avatar.rail-avatar--img-wrap {
      padding: 0;
      background: color-mix(in srgb, var(--panel) 70%, transparent);
    }

    .channel-discovery-card-avatar .rail-avatar-img:not(.olone-user-avatar-fallback-active) {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
      display: block;
      border-radius: 50%;
    }

    .channel-discovery-card-body {
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .channel-discovery-card-title {
      font-size: 15px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.25;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .channel-discovery-card-subline,
    .channel-discovery-card-handle,
    .channel-discovery-card-meta {
      font-size: 12px;
      color: var(--muted);
      line-height: 1.35;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .channel-discovery-card-desc {
      font-size: 12px;
      color: color-mix(in srgb, var(--text) 72%, var(--muted));
      line-height: 1.35;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .channel-discovery-card-actions {
      display: flex;
      flex-wrap: nowrap;
      gap: 6px;
      margin-top: 0;
      align-items: center;
      justify-content: flex-end;
    }

    .channel-discovery-card-actions--compact {
      flex-direction: column;
      align-items: stretch;
      min-width: 108px;
    }

    .channel-discovery-card-btn {
      height: 36px;
      min-height: 36px;
      padding: 0 12px;
      font-size: 12px;
      font-weight: 650;
      white-space: nowrap;
    }

    .channel-discovery-card-actions .secondary,
    .channel-discovery-card-actions .primary {
      min-height: 32px;
      padding: 6px 10px;
      font-size: 12px;
      border-radius: 10px;
    }

    .channel-discovery-preview {
      display: flex;
      flex-direction: column;
      gap: 12px;
      min-height: 0;
      max-height: min(52vh, 420px);
      overflow-y: auto;
    }

    .channel-discovery-preview.hidden {
      display: none !important;
    }

    .channel-discovery-preview-back {
      align-self: flex-start;
      border: none;
      background: transparent;
      color: var(--accent, #6b9fff);
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      padding: 0;
    }

    .channel-discovery-preview-card {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
      background: color-mix(in srgb, var(--panel) 90%, transparent);
    }

    .channels-rail-filter-empty {
      padding: 10px 12px;
      font-size: 13px;
      color: var(--muted);
      text-align: center;
    }

    .channels-rail-filter-empty {
      padding: 10px 12px;
      font-size: 13px;
      color: var(--muted);
      text-align: center;
    }

    .channel-search-results--rail {
      max-height: 160px;
      overflow-y: auto;
      margin-top: 4px;
    }

    .channel-search-results--rail:empty {
      display: none;
    }

    .dialogs-nav-sticky {
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      min-width: 0;
      z-index: 2;
    }

    .dialogs-search-stack {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
    }

    .dialogs-rail-search-wrap {
      position: relative;
      min-width: 0;
      margin: 0;
    }

    .dialogs-rail-search-combo {
      display: flex;
      align-items: stretch;
      gap: 8px;
      min-width: 0;
    }

    .dialogs-rail-search-combo .olone-search-field {
      flex: 1 1 auto;
      min-width: 0;
    }

    .dialogs-rail-search-combo .olone-search-field input[type="search"] {
      width: 100%;
      padding-right: 44px;
    }

    .dialogs-rail-search-combo .olone-search-field input[type="search"]::-webkit-search-cancel-button {
      -webkit-appearance: none;
      appearance: none;
      display: none;
    }

    .dialogs-rail-search-combo .olone-search-field input[type="search"]::-webkit-search-decoration,
    .dialogs-rail-search-combo .olone-search-field input[type="search"]::-webkit-search-results-button {
      display: none;
    }

    .add-friend-search-btn {
      position: relative;
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 42px;
      min-width: 42px;
      height: 42px;
      padding: 0;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border, #383c48) 82%, transparent);
      background: color-mix(in srgb, var(--panel, #15171c) 72%, var(--bg, #0c0d10));
      color: var(--text, #e8eaef);
      cursor: pointer;
      transition: background 0.18s ease, border-color 0.18s ease, transform 0.15s ease;
    }

    .add-friend-search-btn:hover {
      background: color-mix(in srgb, var(--accent, #4a7cff) 14%, var(--panel, #15171c));
      border-color: color-mix(in srgb, var(--accent, #4a7cff) 38%, var(--border, #383c48));
    }

    .add-friend-search-btn:active {
      transform: scale(0.96);
    }

    .add-friend-search-btn svg {
      width: 20px;
      height: 20px;
      display: block;
    }

    .add-friend-search-btn-badge {
      position: absolute;
      top: -5px;
      right: -5px;
      min-width: 18px;
      height: 18px;
      padding: 0 5px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 11px;
      font-weight: 800;
      line-height: 1;
      color: var(--panel, #15171c);
      background: linear-gradient(145deg, #6b9fff, color-mix(in srgb, #6b9fff 45%, #4a63d9));
      box-shadow:
        0 0 0 2px color-mix(in srgb, var(--panel, #15171c) 92%, transparent),
        0 2px 8px rgba(74, 99, 217, 0.35);
      pointer-events: none;
      z-index: 1;
    }

    .friend-search-modal-header {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 6px;
      min-width: 0;
    }

    .friend-search-incoming-link {
      border: none;
      background: transparent;
      padding: 0;
      margin: 0;
      font-size: 13px;
      font-weight: 600;
      color: var(--accent, #6b9fff);
      cursor: pointer;
      text-align: left;
      text-decoration: none;
    }

    .friend-search-incoming-link:hover {
      text-decoration: underline;
    }

    .modal--friend-search {
      width: min(440px, calc(100vw - 28px));
      max-height: min(88vh, 640px);
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .friend-search-modal-body {
      display: flex;
      flex-direction: column;
      gap: 12px;
      padding-top: 4px;
      min-height: 0;
    }

    .friend-search-modal-field .olone-search-field {
      width: 100%;
    }

    .friend-search-modal-card-wrap {
      min-height: 0;
      max-height: min(42vh, 320px);
      overflow-y: auto;
    }

    .friend-search-modal-card-wrap .profile-card.peer-search-card {
      margin: 0;
      cursor: pointer;
    }

    .peer-search-card-id {
      font-size: 12px;
      color: var(--muted, #8b919e);
      margin-top: 2px;
    }

    .col-dialogs .profile-tab-panels--aux {
      border: none;
      border-radius: 0;
      padding: 0;
      background: transparent;
      box-shadow: none;
      min-height: 0;
      max-height: none;
      overflow: visible;
    }

    .col-dialogs .profile-tab-panels--aux .create-channel-trigger-wrap {
      margin: 0;
    }

    .col-dialogs .profile-tab-panels--aux .create-channel-open-btn {
      width: 100%;
      padding-top: 10px;
      padding-bottom: 10px;
      border-radius: 12px;
    }

    .col-dialogs .dialogs-rail-search-wrap .olone-search-field,
    .col-dialogs .channels-tab-toolbar-combo .olone-search-field {
      width: 100%;
    }

    .rail-search-suggestions {
      position: absolute;
      left: 0;
      right: 0;
      top: calc(100% + 4px);
      z-index: 12;
      max-height: 220px;
      overflow-y: auto;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--panel);
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.18);
    }

    .rail-search-suggestions.hidden {
      display: none !important;
    }

    .rail-search-suggestion {
      display: block;
      width: 100%;
      text-align: left;
      border: none;
      background: transparent;
      color: var(--text);
      padding: 8px 10px;
      font-size: 13px;
      cursor: pointer;
    }

    .rail-search-suggestion:hover,
    .rail-search-suggestion:focus-visible {
      background: color-mix(in srgb, var(--accent) 8%, transparent);
    }

    .profile-sidebar-hero {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 12px;
      text-align: center;
      padding: 4px 0 8px;
    }

    .profile-sidebar-avatar {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      overflow: hidden;
      position: relative;
      flex-shrink: 0;
      background: color-mix(in srgb, var(--accent) 8%, var(--panel));
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 22px;
      font-weight: 700;
      color: var(--muted);
      letter-spacing: 0.02em;
    }

    .profile-sidebar-avatar.rail-avatar--img-wrap .rail-avatar-img:not(.olone-user-avatar-fallback-active) {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 50%;
    }

    .profile-sidebar-hero .profile-info {
      width: 100%;
      align-items: center;
    }

    .profile-sidebar-hero .profile-line {
      align-items: center;
    }

    .profile-sidebar-nav {
      width: 100%;
    }

    .profile-v2-mini {
      cursor: pointer;
      border-radius: 14px;
      padding: 8px 6px 10px;
      transition: background 140ms ease, transform 140ms ease;
      width: 100%;
      text-align: center;
    }

    .profile-v2-mini:hover,
    .profile-v2-mini:focus-visible {
      background: color-mix(in srgb, var(--accent) 7%, transparent);
      outline: none;
    }

    .profile-v2-hero {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 0;
      width: 100%;
    }

    .profile-v2-hero-top {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      padding-bottom: 2px;
    }

    .profile-v2-hero-avatar-wrap {
      position: relative;
      padding: 3px;
      border-radius: 50%;
      background: transparent;
      flex-shrink: 0;
    }

    .profile-v2-hero-avatar-wrap.is-premium {
      background: linear-gradient(135deg, #f5d076 0%, #d4a017 48%, #f5e6a8 100%);
      box-shadow: 0 0 20px rgba(212, 160, 23, 0.28);
    }

    .profile-v2-hero-avatar-wrap.rep-ring-excellent:not(.is-premium) {
      background: linear-gradient(135deg, #22c55e, #16a34a);
      box-shadow: 0 0 18px rgba(34, 197, 94, 0.38);
    }

    .profile-v2-hero-avatar-wrap.rep-ring-good:not(.is-premium) {
      background: linear-gradient(135deg, #34d399, #14b8a6);
      box-shadow: 0 0 18px rgba(52, 211, 153, 0.34);
    }

    .profile-v2-hero-avatar-wrap.rep-ring-neutral:not(.is-premium) {
      background: linear-gradient(135deg, #facc15, #eab308);
      box-shadow: 0 0 16px rgba(250, 204, 21, 0.28);
    }

    .profile-v2-hero-avatar-wrap.rep-ring-questionable:not(.is-premium) {
      background: linear-gradient(135deg, #fb923c, #f97316);
      box-shadow: 0 0 16px rgba(251, 146, 60, 0.32);
    }

    .profile-v2-hero-avatar-wrap.rep-ring-negative:not(.is-premium) {
      background: linear-gradient(135deg, #ef4444, #dc2626);
      box-shadow: 0 0 16px rgba(239, 68, 68, 0.34);
    }

    .profile-v2-hero-avatar-wrap.is-premium.rep-ring-excellent {
      background: linear-gradient(135deg, #22c55e 0%, #f5d076 42%, #d4a017 58%, #22c55e 100%);
      box-shadow: 0 0 22px rgba(34, 197, 94, 0.28), 0 0 16px rgba(212, 160, 23, 0.24);
    }

    .profile-v2-hero-avatar-wrap.is-premium.rep-ring-good {
      background: linear-gradient(135deg, #34d399 0%, #f5d076 42%, #d4a017 58%, #34d399 100%);
      box-shadow: 0 0 22px rgba(52, 211, 153, 0.26), 0 0 16px rgba(212, 160, 23, 0.24);
    }

    .profile-v2-hero-avatar-wrap.is-premium.rep-ring-neutral {
      background: linear-gradient(135deg, #facc15 0%, #f5d076 42%, #d4a017 58%, #facc15 100%);
      box-shadow: 0 0 20px rgba(250, 204, 21, 0.24), 0 0 16px rgba(212, 160, 23, 0.24);
    }

    .profile-v2-hero-avatar-wrap.is-premium.rep-ring-questionable {
      background: linear-gradient(135deg, #fb923c 0%, #f5d076 42%, #d4a017 58%, #fb923c 100%);
      box-shadow: 0 0 20px rgba(251, 146, 60, 0.26), 0 0 16px rgba(212, 160, 23, 0.24);
    }

    .profile-v2-hero-avatar-wrap.is-premium.rep-ring-negative {
      background: linear-gradient(135deg, #ef4444 0%, #f5d076 42%, #d4a017 58%, #ef4444 100%);
      box-shadow: 0 0 20px rgba(239, 68, 68, 0.26), 0 0 16px rgba(212, 160, 23, 0.24);
    }

    .profile-v2-rep-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      font-weight: 650;
      line-height: 1.3;
      padding: 3px 9px;
      border-radius: 999px;
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
    }

    .profile-v2-milestone-badge {
      display: inline-flex;
      align-items: center;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.02em;
      padding: 2px 8px;
      border-radius: 999px;
      color: color-mix(in srgb, var(--muted) 82%, var(--text));
      border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
      background: color-mix(in srgb, var(--panel) 94%, transparent);
    }

    .profile-v2-streak-card {
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding: 14px 16px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      text-align: left;
      width: 100%;
    }

    .profile-v2-streak-card.is-gold {
      border-color: color-mix(in srgb, #d4a017 45%, var(--border));
      background: linear-gradient(135deg, color-mix(in srgb, #fce9a8 18%, var(--panel)), color-mix(in srgb, var(--panel) 96%, transparent));
      box-shadow: 0 2px 12px rgba(212, 160, 23, 0.12);
    }

    .profile-v2-streak-card--mini {
      padding: 10px 12px;
      margin-top: 2px;
      text-align: center;
      align-items: center;
    }

    .profile-v2-streak-head {
      font-size: 12px;
      font-weight: 750;
      color: var(--text);
    }

    .profile-v2-streak-current {
      font-size: 15px;
      font-weight: 800;
      color: var(--text);
      font-variant-numeric: tabular-nums;
    }

    .profile-v2-streak-best {
      font-size: 11px;
      font-weight: 600;
      color: var(--muted);
    }

    .profile-v2-empty-state {
      padding: 20px 18px;
      border-radius: 14px;
      border: 1px dashed color-mix(in srgb, var(--border) 90%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      font-size: 14px;
      font-weight: 650;
      color: var(--muted);
      text-align: center;
      line-height: 1.45;
    }

    .profile-v2-empty-state-title {
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
      margin-bottom: 6px;
    }

    .profile-v2-empty-state-hint {
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1.45;
    }

    .profile-v2-stat-grid--quad {
      grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .profile-v2-mini-streak {
      width: 100%;
      margin-top: 6px;
      padding: 6px 8px;
      border-radius: 9px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 94%, transparent);
      font-size: 12px;
      font-weight: 700;
      color: var(--text);
      text-align: center;
    }

    .profile-v2-mini--v31 .profile-v2-hero-identity--compact {
      gap: 4px;
    }

    .profile-v2-mini--v31 .profile-v2-trust-badge-wrap {
      margin: 0 auto;
    }

    .profile-v2-hero-identity--compact .profile-v2-trust-badge {
      font-size: 11px;
      padding: 2px 8px;
    }

    .profile-v2-rep-trust-label {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      font-weight: 700;
      line-height: 1.35;
    }

    .profile-v3-activity-list--merged .profile-v3-activity-row {
      justify-content: flex-start;
      gap: 8px;
    }

    .profile-v3-activity-list--merged .profile-v3-activity-row span:first-child {
      flex-shrink: 0;
    }

    .profile-v3-activity-list--merged .profile-v3-activity-row span:last-child {
      text-align: left;
      color: var(--text);
    }

    .profile-v3-rep-timeline {
      display: flex;
      flex-direction: column;
      gap: 6px;
      padding: 12px 14px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
    }

    .profile-v3-rep-timeline-row {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      font-size: 12px;
      font-weight: 650;
      line-height: 1.4;
    }

    .profile-v3-rep-timeline-row.is-milestone {
      color: var(--text);
      font-weight: 700;
    }

    .profile-v3-rep-dynamics {
      display: flex;
      flex-direction: column;
      gap: 10px;
      padding: 14px 16px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
    }

    .profile-v3-rep-dynamics-head {
      font-size: 11px;
      font-weight: 700;
      color: var(--muted);
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }

    .profile-v3-rep-dynamics-rows {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .profile-v3-rep-dynamics-row {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 15px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
      line-height: 1.2;
    }

    .profile-v3-rep-dynamics-row.is-up { color: #22c55e; }
    .profile-v3-rep-dynamics-row.is-down { color: #ef4444; }

    .profile-v3-rep-dynamics-net {
      margin-top: 2px;
      padding-top: 8px;
      border-top: 1px solid color-mix(in srgb, var(--border) 86%, transparent);
      font-size: 13px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.35;
    }

    .profile-v3-rep-dynamics-net-val.is-up { color: #22c55e; }
    .profile-v3-rep-dynamics-net-val.is-down { color: #ef4444; }
    .profile-v3-rep-dynamics-net-val.is-flat { color: var(--muted); }

    .profile-v3-rep-trend-line {
      padding: 10px 14px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      font-size: 13px;
      font-weight: 700;
      color: var(--text);
      text-align: center;
      line-height: 1.35;
    }

    .profile-v2-rep-last-change {
      font-size: 11px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1.4;
      margin-top: -4px;
    }

    .profile-v3-user-preview-trend {
      font-size: 11px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.35;
    }

    .profile-v3-rep-30d {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .profile-v3-rep-30d-cell {
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      text-align: center;
    }

    .profile-v3-rep-30d-val {
      font-size: 20px;
      font-weight: 800;
      line-height: 1.1;
      font-variant-numeric: tabular-nums;
    }

    .profile-v3-rep-30d-val.is-up { color: #22c55e; }
    .profile-v3-rep-30d-val.is-down { color: #ef4444; }

    .profile-v3-rep-30d-lbl {
      margin-top: 3px;
      font-size: 10px;
      font-weight: 650;
      color: var(--muted);
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }

    .profile-v3-rep-trend-placeholder {
      padding: 14px 16px;
      border-radius: 12px;
      border: 1px dashed color-mix(in srgb, var(--border) 90%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      font-size: 12px;
      font-weight: 650;
      color: var(--muted);
      line-height: 1.45;
      text-align: center;
    }

    #profileViewerAbout .profile-viewer-about {
      margin: 0;
    }

    #profileViewerAbout.hidden {
      display: none;
    }

    .profile-v2-reputation--interactive {
      cursor: pointer;
      transition: transform 140ms ease, box-shadow 140ms ease;
    }

    .profile-v2-reputation--interactive:hover {
      transform: translateY(-1px);
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.06);
    }

    .profile-v2-trust-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 11px;
      font-weight: 650;
      padding: 3px 9px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      line-height: 1.3;
    }

    .profile-v3-completeness {
      padding: 14px 16px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
    }

    .profile-v3-completeness-label {
      font-size: 12px;
      font-weight: 650;
      color: var(--text);
      margin-bottom: 8px;
    }

    .profile-v3-completeness-bar {
      height: 8px;
      border-radius: 999px;
      background: color-mix(in srgb, var(--border) 70%, transparent);
      overflow: hidden;
    }

    .profile-v3-completeness-bar > span {
      display: block;
      height: 100%;
      border-radius: inherit;
      background: linear-gradient(90deg, #34d399, #22c55e);
      transition: width 240ms ease;
    }

    .profile-v3-achievements-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .profile-v3-achievement {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      padding: 10px 12px;
      border-radius: 11px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      font-size: 12px;
      font-weight: 650;
      line-height: 1.35;
      color: var(--text);
    }

    .profile-v3-achievement-ic {
      flex-shrink: 0;
      font-size: 16px;
      line-height: 1.2;
    }

    .profile-v3-show-all-btn {
      margin-top: 10px;
      width: 100%;
      min-height: 36px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 94%, transparent);
      color: var(--muted);
      font-size: 12px;
      font-weight: 650;
      cursor: pointer;
    }

    .profile-v3-activity-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding: 14px 16px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
    }

    .profile-v3-activity-row {
      display: flex;
      justify-content: space-between;
      gap: 12px;
      font-size: 12px;
      line-height: 1.4;
    }

    .profile-v3-activity-row span:first-child {
      color: var(--muted);
      font-weight: 600;
    }

    .profile-v3-activity-row span:last-child {
      color: var(--text);
      font-weight: 650;
      text-align: right;
    }

    .modal--reputation-details {
      max-width: 420px;
    }

    .profile-v3-rep-details-body {
      display: flex;
      flex-direction: column;
      gap: 14px;
      padding: 4px 2px 8px;
    }

    .profile-v3-rep-details-score {
      font-size: 40px;
      font-weight: 800;
      line-height: 1;
      font-variant-numeric: tabular-nums;
    }

    .profile-v3-rep-details-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    .profile-v3-rep-details-stat {
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      text-align: center;
    }

    .profile-v3-rep-details-stat-val {
      font-size: 18px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
    }

    .profile-v3-rep-details-stat-lbl {
      font-size: 10px;
      font-weight: 600;
      color: var(--muted);
      margin-top: 2px;
    }

    .profile-v3-rep-changes {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .profile-v3-rep-change {
      display: flex;
      justify-content: space-between;
      gap: 10px;
      font-size: 12px;
      font-weight: 650;
      padding: 8px 10px;
      border-radius: 9px;
      background: color-mix(in srgb, var(--panel) 94%, transparent);
    }

    .profile-v3-rep-change.is-up { color: #22c55e; }
    .profile-v3-rep-change.is-down { color: #ef4444; }

    .profile-v3-user-preview {
      position: fixed;
      z-index: 12050;
      width: min(280px, calc(100vw - 24px));
      padding: 14px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 98%, transparent);
      box-shadow: 0 12px 32px rgba(0, 0, 0, 0.14);
      pointer-events: none;
    }

    .profile-v3-user-preview-top {
      display: flex;
      gap: 10px;
      align-items: center;
      margin-bottom: 10px;
    }

    .profile-v3-user-preview-avatar {
      width: 44px;
      height: 44px;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      font-weight: 700;
      background: color-mix(in srgb, var(--accent) 10%, var(--panel));
      flex-shrink: 0;
      overflow: hidden;
    }

    .profile-v3-user-preview-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .profile-v3-user-preview-name {
      font-size: 14px;
      font-weight: 750;
      line-height: 1.25;
    }

    .profile-v3-user-preview-stats {
      display: grid;
      grid-template-columns: repeat(2, 1fr);
      gap: 6px;
      margin: 10px 0;
      font-size: 11px;
      font-weight: 650;
      color: var(--muted);
    }

    .profile-v3-user-preview-open {
      width: 100%;
      min-height: 34px;
      border-radius: 10px;
      border: none;
      background: color-mix(in srgb, var(--accent) 14%, transparent);
      color: var(--text);
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
      pointer-events: auto;
    }

    .profile-v3-user-preview.hidden {
      display: none !important;
      pointer-events: none;
    }

    @media (max-width: 520px) {
      .profile-v3-achievements-grid {
        grid-template-columns: 1fr;
      }
    }

    .profile-v2-appearance-block {
      width: 100%;
      padding: 0 10px 8px;
    }

    .profile-v2-appearance-title {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
      margin: 0 0 10px;
    }

    .profile-v2-cover-preview-row {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-bottom: 8px;
    }

    .profile-v2-cover-preview-thumb {
      flex: 1;
      min-width: 0;
      height: 52px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      overflow: hidden;
    }

    .profile-cover-picker-section {
      margin-bottom: 12px;
    }

    .profile-cover-picker-section-title {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: var(--muted);
      margin: 0 0 6px;
    }

    .profile-cover-picker-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
    }

    .profile-cover-pick.is-locked {
      opacity: 0.42;
      cursor: not-allowed;
    }

    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn.rep-ring-excellent .profile-viewer-avatar,
    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn.rep-ring-good .profile-viewer-avatar,
    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn.rep-ring-neutral .profile-viewer-avatar,
    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn.rep-ring-questionable .profile-viewer-avatar,
    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn.rep-ring-negative .profile-viewer-avatar {
      box-shadow: none;
    }

    .profile-viewer-avatar-btn.rep-ring-excellent .profile-viewer-avatar {
      box-shadow: 0 0 0 3px #22c55e, 0 0 20px rgba(34, 197, 94, 0.32);
    }

    .profile-viewer-avatar-btn.rep-ring-good .profile-viewer-avatar {
      box-shadow: 0 0 0 3px #34d399, 0 0 20px rgba(52, 211, 153, 0.28);
    }

    .profile-viewer-avatar-btn.rep-ring-neutral .profile-viewer-avatar {
      box-shadow: 0 0 0 3px #facc15, 0 0 18px rgba(250, 204, 21, 0.24);
    }

    .profile-viewer-avatar-btn.rep-ring-questionable .profile-viewer-avatar {
      box-shadow: 0 0 0 3px #fb923c, 0 0 18px rgba(251, 146, 60, 0.28);
    }

    .profile-viewer-avatar-btn.rep-ring-negative .profile-viewer-avatar {
      box-shadow: 0 0 0 3px #ef4444, 0 0 18px rgba(239, 68, 68, 0.28);
    }

    .profile-viewer-avatar-btn.is-premium.rep-ring-excellent .profile-viewer-avatar {
      box-shadow: 0 0 0 3px #22c55e, 0 0 0 6px #d4a017, 0 0 24px rgba(34, 197, 94, 0.26);
    }

    .profile-v2-hero-avatar {
      width: 88px;
      height: 88px;
      font-size: 26px;
      border: none;
      box-shadow: 0 4px 16px rgba(0, 0, 0, 0.16);
    }

    .profile-v2-hero-identity {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      width: 100%;
      min-width: 0;
    }

    .profile-v2-hero-name {
      font-size: 24px;
      font-weight: 700;
      line-height: 1.15;
      color: var(--text);
      letter-spacing: -0.02em;
    }

    .profile-v2-premium-pill {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 22px;
      padding: 2px 10px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.03em;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
    }

    .profile-v2-premium-pill.is-premium {
      color: #5c4208;
      background: linear-gradient(135deg, #fce9a8 0%, #e8c04a 42%, #f5d87a 100%);
      border-color: color-mix(in srgb, #d4a017 55%, transparent);
      box-shadow: 0 1px 6px rgba(212, 160, 23, 0.22);
    }

    .profile-v2-hero-online {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      font-size: 12px;
      color: var(--muted);
      font-weight: 600;
      margin-top: 1px;
    }

    .profile-v2-status-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--muted) 70%, transparent);
      flex-shrink: 0;
      box-shadow: 0 0 0 2px color-mix(in srgb, var(--panel) 80%, transparent);
    }

    .profile-v2-status-dot.online {
      background: #22c55e;
      box-shadow: 0 0 0 2px color-mix(in srgb, #22c55e 24%, transparent);
    }

    .profile-v2-hero-divider {
      width: 100%;
      height: 1px;
      margin: 12px 0 10px;
      background: color-mix(in srgb, var(--border) 85%, transparent);
    }

    .profile-v2-hero-reputation-wrap {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      text-align: center;
      padding: 0 4px;
    }

    .profile-v2-hero-rep-label {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 90%, transparent);
    }

    .profile-v2-hero-rep-score {
      font-size: 28px;
      font-weight: 800;
      line-height: 1;
      font-variant-numeric: tabular-nums;
      letter-spacing: -0.02em;
    }

    .profile-v2-hero-rep-status {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      font-size: 12px;
      font-weight: 650;
      line-height: 1.35;
      color: var(--muted);
    }

    .profile-v2-hero-rep-status:has(.profile-v2-rep-empty-title) {
      flex-direction: column;
      align-items: center;
      gap: 3px;
    }

    .profile-v2-rep-empty-title {
      font-size: 13px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.35;
    }

    .profile-v2-rep-empty-hint {
      font-size: 11px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1.4;
      max-width: 220px;
    }

    .profile-v2-stat-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      width: 100%;
    }

    .profile-v2-stat-grid--compact {
      gap: 6px;
    }

    .profile-v2-stat-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 3px;
      min-height: 58px;
      padding: 10px 8px;
      border-radius: 11px;
      border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
      background: color-mix(in srgb, var(--panel) 94%, transparent);
      text-align: center;
    }

    .profile-v2-stat-grid--compact .profile-v2-stat-card {
      min-height: 52px;
      padding: 8px 6px;
    }

    .profile-v2-stat-card-value {
      font-size: 18px;
      font-weight: 800;
      color: var(--text);
      font-variant-numeric: tabular-nums;
      line-height: 1.1;
    }

    .profile-v2-stat-grid--compact .profile-v2-stat-card-value {
      font-size: 16px;
    }

    .profile-v2-stat-card-label {
      font-size: 11px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1.2;
    }

    .profile-v2-rep-tier-green .profile-v2-hero-rep-score,
    .profile-v2-rep-tier-green .profile-v2-rep-score,
    .profile-v2-rep-tier-green .profile-v2-hero-rep-status,
    .profile-v2-rep-tier-green .profile-v2-rep-status {
      color: #22c55e;
    }

    .profile-v2-rep-tier-lime .profile-v2-hero-rep-score,
    .profile-v2-rep-tier-lime .profile-v2-rep-score,
    .profile-v2-rep-tier-lime .profile-v2-hero-rep-status,
    .profile-v2-rep-tier-lime .profile-v2-rep-status {
      color: #34d399;
    }

    .profile-v2-rep-tier-muted .profile-v2-hero-rep-score,
    .profile-v2-rep-tier-muted .profile-v2-rep-score,
    .profile-v2-rep-tier-muted .profile-v2-hero-rep-status,
    .profile-v2-rep-tier-muted .profile-v2-rep-status {
      color: #facc15;
    }

    .profile-v2-rep-tier-orange .profile-v2-hero-rep-score,
    .profile-v2-rep-tier-orange .profile-v2-rep-score,
    .profile-v2-rep-tier-orange .profile-v2-hero-rep-status,
    .profile-v2-rep-tier-orange .profile-v2-rep-status {
      color: #fb923c;
    }

    .profile-v2-rep-tier-red .profile-v2-hero-rep-score,
    .profile-v2-rep-tier-red .profile-v2-rep-score,
    .profile-v2-rep-tier-red .profile-v2-hero-rep-status,
    .profile-v2-rep-tier-red .profile-v2-rep-status {
      color: #ef4444;
    }

    .profile-v2-hero-public {
      padding: 0 10px 4px;
      align-items: flex-start;
    }

    .profile-v2-hero-public.profile-v2-hero-public--v31 {
      padding: 0 6px 2px;
      gap: 4px;
    }

    .profile-v2-hero-public--v31 .profile-v2-hero-identity {
      gap: 4px;
    }

    .profile-v2-hero-public--v31 .profile-v2-hero-name {
      font-size: 22px;
      line-height: 1.15;
    }

    .profile-v2-hero-public--v31 .profile-v2-trust-badge {
      font-size: 12px;
      padding: 3px 10px;
    }

    @media (max-width: 640px) {
      .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar,
      .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn {
        width: 62px;
        height: 62px;
      }

      .profile-v2-hero-public--v31 .profile-v2-hero-name {
        font-size: 19px;
      }

      .profile-v2-hero-public--v31 .profile-v2-hero-id {
        font-size: 11px;
        margin-top: 0;
      }

      .profile-v2-hero-public--v31 .profile-v2-hero-online {
        font-size: 11px;
      }
    }

    .profile-v2-hero-public .profile-v2-hero-identity {
      align-items: flex-start;
    }

    .profile-v2-hero-public .profile-v2-hero-reputation-wrap {
      align-items: flex-start;
      text-align: left;
      width: 100%;
    }

    .profile-v2-hero-id {
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
      font-variant-numeric: tabular-nums;
      margin-top: 2px;
    }

    .profile-v2-identity-row.profile-v2-hero-mode .profile-v2-identity-legacy {
      display: none;
    }

    .profile-v2-identity-row.profile-v2-hero-mode.is-premium .profile-viewer-avatar {
      box-shadow:
        0 0 0 3px #d4a017,
        0 0 22px rgba(212, 160, 23, 0.28),
        0 4px 16px rgba(0, 0, 0, 0.14);
    }

    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar {
      width: 88px;
      height: 88px;
      font-size: 26px;
    }

    .profile-v2-identity-row.profile-v2-hero-mode .profile-viewer-avatar-btn {
      margin-top: -56px;
    }

    .profile-v2-sections {
      display: flex;
      flex-direction: column;
      gap: 22px;
      margin-bottom: 8px;
    }

    .profile-v2-block {
      margin-bottom: 0;
    }

    .profile-v2-block-title {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
      margin: 0 0 12px;
    }

    .profile-v2-reputation {
      display: flex;
      flex-direction: column;
      gap: 14px;
      padding: 20px 20px 18px;
      border-radius: 16px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      box-shadow: 0 2px 12px rgba(0, 0, 0, 0.04);
    }

    .profile-v2-reputation.profile-v2-rep-empty-state {
      align-items: flex-start;
      gap: 10px;
    }

    .profile-v2-rep-status {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      font-weight: 700;
      color: var(--text);
    }

    .profile-v2-rep-status-dot {
      font-size: 12px;
      line-height: 1;
    }

    .profile-v2-rep-score {
      font-size: 42px;
      font-weight: 800;
      line-height: 1;
      font-variant-numeric: tabular-nums;
      letter-spacing: -0.03em;
    }

    .profile-v2-rep-meta {
      font-size: 12px;
      color: var(--muted);
      line-height: 1.5;
    }

    .profile-v2-rep-votes {
      display: flex;
      gap: 14px;
      font-size: 13px;
      font-weight: 650;
      color: var(--muted);
      margin-top: 2px;
    }

    .profile-v2-rep-actions {
      display: flex;
      gap: 8px;
      margin-top: 4px;
    }

    .profile-v2-rep-btn {
      flex: 1;
      min-height: 38px;
      border-radius: 11px;
      border: 1px solid color-mix(in srgb, var(--border) 90%, transparent);
      background: color-mix(in srgb, var(--panel) 90%, transparent);
      color: var(--text);
      font-size: 13px;
      font-weight: 650;
      cursor: pointer;
      transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
    }

    .profile-v2-rep-btn:hover:not(:disabled) {
      background: color-mix(in srgb, var(--accent) 9%, transparent);
      transform: translateY(-1px);
    }

    .profile-v2-rep-btn:disabled {
      opacity: 0.45;
      cursor: default;
    }

    .profile-v2-rep-btn.is-active {
      border-color: color-mix(in srgb, var(--accent) 40%, var(--border));
      background: color-mix(in srgb, var(--accent) 12%, transparent);
    }

    .profile-v2-stats-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    .profile-v2-stat-cell,
    .profile-v2-stats-grid .profile-v2-stat-card {
      min-height: 72px;
      padding: 14px 12px;
      border-radius: 12px;
    }

    .profile-v2-stats-grid .profile-v2-stat-card-value {
      font-size: 22px;
    }

    .profile-v2-stat-cell {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 4px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      text-align: center;
    }

    .profile-v2-stat-value {
      font-size: 22px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
      color: var(--text);
      line-height: 1;
    }

    .profile-v2-stat-label {
      font-size: 11px;
      color: var(--muted);
      font-weight: 650;
      line-height: 1.2;
    }

    .profile-v2-stat-secondary {
      margin-top: 12px;
      display: flex;
      flex-wrap: wrap;
      gap: 8px 14px;
      font-size: 12px;
      color: var(--muted);
      line-height: 1.45;
    }

    .profile-v2-social-pills {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .profile-v2-social-pill {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      min-height: 38px;
      padding: 0 14px;
      border-radius: 11px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      color: var(--text);
      font-size: 13px;
      font-weight: 650;
      text-decoration: none;
      transition: background 140ms ease, border-color 140ms ease, transform 140ms ease;
    }

    .profile-v2-social-pill:hover {
      background: color-mix(in srgb, var(--accent) 9%, transparent);
      border-color: color-mix(in srgb, var(--accent) 28%, var(--border));
      transform: translateY(-1px);
    }

    .profile-v2-social-pill-ic {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 18px;
      height: 18px;
      font-size: 14px;
      line-height: 1;
      flex-shrink: 0;
    }

    .profile-v2-channels-list {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-v2-channel-card {
      display: grid;
      grid-template-columns: 54px minmax(0, 1fr);
      gap: 14px;
      align-items: center;
      padding: 15px 16px;
      border-radius: 18px;
      border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
      background:
        linear-gradient(145deg, color-mix(in srgb, var(--panel) 92%, transparent) 0%, color-mix(in srgb, var(--bubble-in) 86%, transparent) 100%);
      cursor: pointer;
      transition: transform 0.28s cubic-bezier(0.34, 1.2, 0.64, 1), box-shadow 0.28s ease, border-color 0.28s ease;
      text-align: left;
      width: 100%;
      color: inherit;
      font: inherit;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
        0 10px 28px rgba(0, 0, 0, 0.14);
      position: relative;
      overflow: hidden;
    }

    .profile-v2-channel-card::before {
      content: "";
      position: absolute;
      inset: 0 auto 0 0;
      width: 3px;
      background: linear-gradient(180deg, color-mix(in srgb, var(--nitro-accent, #7ea2ff) 70%, transparent), transparent);
      opacity: 0.55;
    }

    .profile-v2-channel-card:hover {
      transform: translateY(-2px) scale(1.01);
      border-color: color-mix(in srgb, var(--nitro-accent, var(--accent)) 28%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 16px 40px rgba(0, 0, 0, 0.2);
    }

    .profile-v2-channel-avatar {
      width: 54px;
      height: 54px;
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(145deg, color-mix(in srgb, var(--accent) 14%, var(--panel)), color-mix(in srgb, var(--panel) 94%, transparent));
      font-size: 15px;
      font-weight: 800;
      color: var(--muted);
      overflow: hidden;
      flex-shrink: 0;
      box-shadow: 0 8px 22px rgba(0, 0, 0, 0.22);
      border: 1px solid color-mix(in srgb, #fff 8%, transparent);
    }

    .profile-v2-channel-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .profile-v2-channel-title {
      font-size: 16px;
      font-weight: 800;
      line-height: 1.2;
      letter-spacing: -0.02em;
      color: var(--text);
    }

    .profile-v2-channel-subs {
      font-size: 11px;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      font-weight: 650;
      margin-top: 3px;
      letter-spacing: 0.02em;
    }

    .profile-v2-channel-preview {
      display: none;
    }

    .profile-v2-social-slot-list {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-v2-social-slot {
      display: grid;
      grid-template-columns: 120px minmax(0, 1fr) auto;
      gap: 8px;
      align-items: center;
    }

    .profile-v2-social-slot select,
    .profile-v2-social-slot input {
      min-height: 36px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--panel);
      color: var(--text);
      font-size: 13px;
      padding: 0 10px;
    }

    .profile-v2-visibility-grid {
      display: grid;
      gap: 8px;
    }

    .profile-v2-visibility-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      font-size: 13px;
    }

    @media (max-width: 400px) {
      .profile-v2-stats-grid {
        grid-template-columns: 1fr;
      }

      .profile-v2-social-slot {
        grid-template-columns: 1fr;
      }
    }

    .profile-tabs {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
    }

    .profile-tab {
      flex: 1 1 calc(50% - 6px);
      min-width: 0;
      display: grid;
      grid-template-columns: 26px minmax(0, 1fr);
      align-items: center;
      justify-items: stretch;
      column-gap: 8px;
      row-gap: 0;
      padding: 2px 10px;
      font-size: 12px;
      font-weight: 600;
      border-radius: 9px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
    }

    .profile-tab[data-tab="all"] {
      position: relative;
    }

    .profile-tab-unread-badge {
      position: absolute;
      top: 2px;
      right: 6px;
      min-width: 16px;
      height: 16px;
      padding: 0 4px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, #78a9ff 55%, var(--border));
      background: linear-gradient(160deg, #6f9bff, #4f7de8);
      color: #fff;
      font-size: 10px;
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0 0 2px color-mix(in srgb, var(--panel) 88%, transparent);
      line-height: 1;
      pointer-events: none;
      z-index: 1;
    }

    .profile-tab-icon-wrap {
      width: 26px;
      height: 26px;
      display: flex;
      align-items: center;
      justify-content: center;
      justify-self: center;
      flex-shrink: 0;
    }

    .profile-tab-icon {
      width: 19px;
      height: 19px;
      display: block;
      flex-shrink: 0;
      opacity: 0.78;
      transition: opacity 180ms ease;
    }

    .profile-tab:hover .profile-tab-icon,
    .profile-tab.profile-tab-active .profile-tab-icon {
      opacity: 1;
    }

    .profile-tab-label {
      min-width: 0;
      line-height: 1;
      font-size: 12px;
      font-weight: 600;
      letter-spacing: 0.01em;
      display: flex;
      align-items: center;
    }

    .profile-tab:hover {
      color: var(--text);
      border-color: var(--muted);
    }

    .profile-tab.profile-tab-active {
      color: var(--text);
      background: var(--panel);
      border-color: var(--muted);
    }

    .profile-tab-panels {
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 10px 10px 12px;
      background: var(--bg);
      min-height: 52px;
      max-height: 240px;
      overflow-y: auto;
      box-shadow: inset 0 1px 2px var(--shadow);
    }

    .friends-list-root {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .friends-list-wrap {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-height: 0;
      padding: 4px 0;
    }

    .profile-tab-panel.hidden {
      display: none;
    }

    .profile-tab-stub-hint {
      font-size: 13px;
      color: var(--muted);
      line-height: 1.45;
      margin: 0;
      padding: 6px 2px;
    }

    .profile-view-controls {
      display: flex;
      gap: 8px;
      flex-wrap: wrap;
      margin-bottom: 8px;
    }

    .profile-view-controls .secondary {
      padding: 7px 10px;
      font-size: 12px;
      border-radius: 9px;
    }

    .profile-view-search {
      display: none;
    }

    .profile-view-search .secondary {
      flex: 0 0 auto;
      padding: 8px 12px;
      font-size: 12px;
      border-radius: 9px;
    }


    .modal.modal--profile-viewer {
      width: min(860px, 94vw);
      max-height: 95vh;
      display: flex;
      flex-direction: column;
      gap: 8px;
      overflow-y: auto;
      overflow-x: hidden;
    }

    .profile-viewer-layout {
      display: grid;
      grid-template-columns: 380px 1fr;
      gap: 20px;
      min-height: 0;
    }

    .profile-viewer-left {
      border: 1px solid var(--border);
      border-radius: 12px;
      background: color-mix(in srgb, var(--bubble-in) 92%, transparent);
      padding: 9px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-width: 0;
      align-content: start;
    }

    /* ===== Profile Nitro — 2-column identity + panels ===== */
    .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: minmax(320px, 372px) minmax(300px, 428px);
      gap: 14px;
      align-items: start;
      justify-content: center;
      max-width: 820px;
      margin: 0 auto;
    }

    .profile-viewer-layout.profile-nitro-layout.profile-v15-layout-premium {
      filter: drop-shadow(0 28px 64px rgba(147, 112, 219, 0.12));
    }

    .profile-nitro-layout:not(.profile-nitro-edit) #profileEditHero {
      display: none !important;
    }

    .profile-nitro-layout.profile-nitro-edit #profileNitroCard {
      display: none !important;
    }

    .profile-viewer-left {
      border: none;
      background: transparent;
      padding: 0;
      gap: 10px;
    }

    .profile-nitro-card {
      --nitro-accent: #7ea2ff;
      --nitro-glow: rgba(126, 162, 255, 0.22);
      --rep-glow: rgba(34, 197, 94, 0.32);
      position: relative;
      overflow: hidden;
      border-radius: 24px;
      border: 1px solid color-mix(in srgb, var(--nitro-accent) 22%, var(--border));
      background:
        radial-gradient(ellipse 120% 80% at 50% -20%, color-mix(in srgb, var(--nitro-accent) 14%, transparent), transparent 55%),
        linear-gradient(180deg, color-mix(in srgb, #1a2038 42%, var(--panel)) 0%, color-mix(in srgb, var(--panel) 96%, transparent) 38%, color-mix(in srgb, var(--bubble-in) 92%, transparent) 100%);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset,
        0 28px 64px rgba(0, 0, 0, 0.26),
        0 0 0 1px color-mix(in srgb, #000 18%, transparent);
    }

    .profile-nitro-card::before {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      background: radial-gradient(ellipse 90% 55% at 50% -8%, var(--nitro-glow), transparent 62%);
      pointer-events: none;
      z-index: 0;
      opacity: 0.85;
    }

    .profile-nitro-card > * {
      position: relative;
      z-index: 1;
    }

    .profile-nitro-card.is-premium {
      --nitro-accent: #e8b84a;
      --nitro-glow: rgba(232, 184, 74, 0.34);
      --rep-glow: rgba(212, 160, 23, 0.42);
      border-color: color-mix(in srgb, #d4a017 42%, var(--border));
      background:
        radial-gradient(ellipse 130% 75% at 50% -12%, rgba(212, 160, 23, 0.28), transparent 58%),
        radial-gradient(ellipse 80% 50% at 100% 100%, rgba(139, 92, 246, 0.08), transparent 55%),
        linear-gradient(180deg, color-mix(in srgb, #2a2210 38%, var(--panel)) 0%, color-mix(in srgb, var(--panel) 96%, transparent) 40%, color-mix(in srgb, var(--bubble-in) 92%, transparent) 100%);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 14%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 22%, transparent),
        0 32px 72px rgba(0, 0, 0, 0.32),
        0 0 88px rgba(212, 160, 23, 0.14);
    }

    .profile-nitro-cover {
      height: 88px;
      position: relative;
      overflow: hidden;
      border-radius: 24px 24px 0 0;
      background: linear-gradient(135deg, rgba(90, 145, 255, 0.28), rgba(120, 200, 120, 0.18));
      filter: saturate(0.62) brightness(0.78);
    }

    .profile-nitro-cover::before {
      content: "";
      position: absolute;
      inset: 0;
      background:
        radial-gradient(ellipse 70% 90% at 18% 12%, rgba(255, 255, 255, 0.06), transparent 52%),
        radial-gradient(ellipse 55% 70% at 88% 28%, color-mix(in srgb, var(--nitro-accent) 12%, transparent), transparent 58%);
      pointer-events: none;
      z-index: 1;
      opacity: 0.65;
    }

    .profile-nitro-cover::after {
      content: "";
      position: absolute;
      inset: 0;
      background:
        linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.22) 48%, rgba(0, 0, 0, 0.88) 100%),
        radial-gradient(ellipse 100% 70% at 50% 110%, color-mix(in srgb, var(--nitro-glow) 40%, transparent), transparent 68%);
      pointer-events: none;
      z-index: 2;
    }

    .profile-nitro-body {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 0 18px 10px;
      margin-top: -46px;
      position: relative;
      z-index: 2;
      gap: 10px;
    }

    .profile-nitro-avatar-stage {
      position: relative;
      width: 120px;
      height: 120px;
      display: grid;
      place-items: center;
      margin: 0 auto 6px;
      z-index: 3;
      filter: drop-shadow(0 18px 36px rgba(0, 0, 0, 0.38));
    }

    .profile-nitro-avatar-ambient {
      position: absolute;
      inset: -14px;
      border-radius: 50%;
      pointer-events: none;
      z-index: 0;
      transition: box-shadow 0.4s ease, background 0.4s ease;
    }

    .profile-nitro-avatar-stage.trust-trusted .profile-nitro-avatar-ambient {
      background: radial-gradient(circle, rgba(34, 197, 94, 0.26) 0%, transparent 68%);
      box-shadow: 0 0 34px rgba(34, 197, 94, 0.22);
    }

    .profile-nitro-avatar-stage.trust-neutral .profile-nitro-avatar-ambient {
      background: radial-gradient(circle, rgba(139, 92, 246, 0.22) 0%, rgba(99, 102, 241, 0.1) 48%, transparent 72%);
      box-shadow: 0 0 30px rgba(99, 102, 241, 0.18);
    }

    .profile-nitro-avatar-stage.trust-negative .profile-nitro-avatar-ambient {
      background: radial-gradient(circle, rgba(239, 68, 68, 0.24) 0%, rgba(251, 146, 60, 0.12) 52%, transparent 72%);
      box-shadow: 0 0 32px rgba(239, 68, 68, 0.2);
    }

    @keyframes profile-nitro-avatar-float {
      0%, 100% { transform: translateY(0) scale(1); opacity: 0.28; }
      50% { transform: translateY(-5px) scale(1.15); opacity: 0.55; }
    }

    .profile-nitro-avatar-particle {
      position: absolute;
      width: 4px;
      height: 4px;
      border-radius: 50%;
      animation: profile-nitro-avatar-float 9s ease-in-out infinite;
      pointer-events: none;
    }

    .profile-nitro-avatar-particle:nth-child(1) {
      top: 10%;
      left: 16%;
      background: #a78bfa;
      animation-delay: 0s;
    }

    .profile-nitro-avatar-particle:nth-child(2) {
      top: 68%;
      right: 14%;
      background: #6ee7b8;
      animation-delay: -3s;
    }

    .profile-nitro-avatar-particle:nth-child(3) {
      bottom: 12%;
      left: 72%;
      background: #93c5fd;
      animation-delay: -6s;
    }

    .profile-nitro-avatar-ring {
      position: relative;
      z-index: 1;
      border-radius: 50%;
    }

    .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      content: "";
      position: absolute;
      inset: -7px;
      border-radius: 50%;
      padding: 3px;
      background: linear-gradient(135deg, #fff6d8, #f5d98b, #d4a017, #fff6d8, #c9a227, #f5d98b);
      background-size: 280% 280%;
      animation: profile-nitro-premium-shimmer 10s ease-in-out infinite;
      -webkit-mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      pointer-events: none;
      opacity: 1;
      filter: drop-shadow(0 0 22px rgba(245, 217, 139, 0.62));
    }

    @keyframes profile-nitro-premium-shimmer {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }

    .profile-nitro-avatar-btn {
      width: 108px;
      height: 108px;
      border-radius: 50%;
      border: 4px solid color-mix(in srgb, var(--panel) 92%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 88%, transparent);
      box-shadow:
        0 20px 48px rgba(0, 0, 0, 0.38),
        0 0 0 1px color-mix(in srgb, #fff 8%, transparent) inset;
      display: grid;
      place-items: center;
      overflow: hidden;
      cursor: default;
      padding: 0;
      font: inherit;
      color: inherit;
    }

    .profile-nitro-avatar-img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .profile-nitro-avatar-fallback {
      font-size: 34px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: var(--text);
    }

    .profile-nitro-identity {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      width: 100%;
      position: relative;
      padding: 8px 10px 2px;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-identity::before,
    .profile-nitro-card.is-premium .profile-nitro-identity::before {
      content: "";
      position: absolute;
      inset: -6px -14px;
      border-radius: 22px;
      background: radial-gradient(ellipse 100% 85% at 50% 0%, color-mix(in srgb, var(--panel) 88%, transparent), transparent 72%);
      z-index: -1;
      pointer-events: none;
    }

    .profile-nitro-name {
      font-size: 32px;
      font-weight: 850;
      line-height: 1.06;
      letter-spacing: -0.035em;
      word-break: break-word;
    }

    .profile-nitro-card.is-premium .profile-nitro-name {
      text-shadow: 0 0 28px rgba(245, 217, 139, 0.22);
    }

    .profile-nitro-premium {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: #f5d98b;
      background: color-mix(in srgb, #d4a017 22%, transparent);
      border: 1px solid color-mix(in srgb, #d4a017 40%, transparent);
    }

    .profile-nitro-level-badge {
      display: inline-flex;
      align-items: center;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
      background: color-mix(in srgb, var(--bubble-in) 72%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
    }

    .profile-nitro-card.tier-level1 {
      --nitro-accent: #7b8494;
      --nitro-glow: rgba(120, 130, 150, 0.08);
      border-radius: 18px;
      box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
    }

    .profile-nitro-card.tier-level1::before {
      display: none;
    }

    .profile-nitro-card.tier-level1 .profile-nitro-cover {
      height: 112px;
      border-radius: 18px 18px 0 0;
      background: linear-gradient(135deg, rgba(72, 82, 98, 0.42), rgba(48, 54, 66, 0.5));
    }

    .profile-nitro-card.tier-level1 .profile-nitro-cover::before,
    .profile-nitro-card.tier-level1 .profile-nitro-cover::after {
      display: none;
    }

    .profile-nitro-card.tier-level1 .profile-nitro-body {
      margin-top: -52px;
      gap: 8px;
      padding: 0 16px 16px;
    }

    .profile-nitro-card.tier-level1 .profile-nitro-avatar-stage {
      width: 108px;
      height: 108px;
      filter: none;
    }

    .profile-nitro-card.tier-level1 .profile-nitro-avatar-btn {
      width: 96px;
      height: 96px;
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.2);
    }

    .profile-nitro-card.tier-level1 .profile-nitro-name {
      font-size: 22px;
    }

    .profile-nitro-card:not(.is-premium) .profile-nitro-avatar-particle {
      display: none;
    }

    .profile-nitro-card.tier-level2 {
      --nitro-accent: #6b8cce;
      --nitro-glow: rgba(90, 130, 200, 0.2);
      --rep-glow: rgba(99, 179, 237, 0.38);
      border-color: color-mix(in srgb, #6b8cce 28%, var(--border));
    }

    .profile-nitro-card.tier-level2 .profile-nitro-cover {
      height: 92px;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-reputation-ring.is-positive .profile-nitro-reputation-ring-donut,
    .profile-nitro-card.tier-level2 .profile-nitro-reputation-ring.is-seed .profile-nitro-reputation-ring-donut {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #63b3ed 26%, transparent),
        0 0 52px rgba(99, 179, 237, 0.28),
        0 0 88px rgba(34, 197, 94, 0.12);
    }

    .profile-nitro-card.is-premium .profile-nitro-reputation-ring-score {
      font-size: 34px;
    }

    .profile-nitro-card.is-premium .profile-nitro-cover {
      height: 96px;
      filter: saturate(0.88) brightness(0.92);
    }

    .profile-nitro-card.is-premium .profile-nitro-cover::before {
      opacity: 0.55;
      background:
        radial-gradient(ellipse 80% 90% at 8% 8%, rgba(196, 160, 255, 0.22), transparent 54%),
        radial-gradient(ellipse 60% 70% at 92% 12%, rgba(255, 196, 120, 0.18), transparent 58%);
    }

    .profile-nitro-card.is-premium .profile-nitro-cover::after {
      background:
        linear-gradient(180deg, transparent 0%, rgba(0, 0, 0, 0.18) 42%, rgba(0, 0, 0, 0.92) 100%),
        radial-gradient(ellipse 110% 80% at 50% 115%, rgba(147, 112, 219, 0.22), transparent 70%);
    }

    .profile-nitro-card.is-premium .profile-nitro-avatar-stage {
      filter: drop-shadow(0 26px 52px rgba(0, 0, 0, 0.46)) drop-shadow(0 0 52px rgba(212, 160, 23, 0.34));
    }

    .profile-nitro-card.is-premium .profile-nitro-avatar-btn {
      border-color: color-mix(in srgb, #f5d98b 35%, var(--panel));
      box-shadow:
        0 24px 52px rgba(0, 0, 0, 0.42),
        0 0 36px rgba(212, 160, 23, 0.16),
        0 0 0 1px color-mix(in srgb, #f5d98b 18%, transparent) inset;
    }

    .profile-nitro-card:not(.is-premium) .profile-nitro-avatar-ambient {
      background: none !important;
      box-shadow: none !important;
    }

    .profile-viewer-layout.profile-nitro-layout.tier-level1-profile {
      grid-template-columns: 1fr;
      max-width: 420px;
      margin: 0 auto;
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) {
      border: none;
      background: transparent;
      padding: 6px 2px 4px;
      box-shadow: none;
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) .profile-nitro-about-quote {
      font-size: 19px;
      line-height: 1.68;
      font-weight: 450;
      border-left: none;
      padding: 0;
      color: color-mix(in srgb, var(--text) 96%, var(--muted));
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) .profile-nitro-about-hero-inner {
      position: relative;
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) .profile-nitro-about-quote::before {
      content: "\201C";
      display: block;
      font-size: 44px;
      line-height: 0.9;
      font-weight: 800;
      color: color-mix(in srgb, var(--nitro-accent, #6b8cce) 48%, transparent);
      margin-bottom: 2px;
    }

    .profile-v9-tags {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 6px;
      margin-top: 2px;
    }

    .profile-v9-tag {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 650;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
      background: color-mix(in srgb, var(--bubble-in) 78%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
    }

    .profile-v9-header-story {
      display: flex;
      flex-direction: column;
      gap: 5px;
      width: 100%;
      margin-top: 4px;
      text-align: left;
    }

    .profile-v9-story-line {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      font-size: 12px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--text) 86%, var(--muted));
    }

    .profile-v9-story-line-ic {
      flex: 0 0 auto;
      width: 16px;
      text-align: center;
    }

    .profile-v9-social-row {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      width: 100%;
      margin-top: 2px;
    }

    .profile-v9-mutual {
      font-size: 12px;
      line-height: 1.4;
      color: color-mix(in srgb, #6ee7b8 70%, var(--text));
      text-align: center;
    }

    .profile-v9-thanks {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
    }

    .profile-v9-thanks-count {
      font-size: 12px;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
    }

    .profile-v9-thanks-btn {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 7px 14px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, #fbbf24 35%, var(--border));
      background: color-mix(in srgb, #fbbf24 10%, transparent);
      color: color-mix(in srgb, var(--text) 92%, #fbbf24);
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
    }

    .profile-v9-thanks-btn:disabled,
    .profile-v9-thanks-btn.is-thanked {
      opacity: 0.72;
      cursor: default;
    }

    .profile-v9-featured-card {
      display: flex;
      gap: 16px;
      padding: 18px;
      border-radius: 20px;
      border: 1px solid color-mix(in srgb, #fbbf24 24%, var(--border));
      background:
        radial-gradient(ellipse 100% 80% at 0% 0%, rgba(251, 191, 36, 0.1), transparent 58%),
        linear-gradient(145deg, color-mix(in srgb, var(--panel) 90%, transparent), color-mix(in srgb, var(--bubble-in) 84%, transparent));
      text-align: left;
      width: 100%;
      cursor: pointer;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
        0 14px 36px rgba(0, 0, 0, 0.16);
      transition: transform 0.28s ease, box-shadow 0.28s ease;
    }

    .profile-v9-featured-card:hover {
      transform: translateY(-2px);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 18px 44px rgba(0, 0, 0, 0.22);
    }

    .profile-v9-featured-avatar {
      width: 60px;
      height: 60px;
      border-radius: 18px;
      display: grid;
      place-items: center;
      font-weight: 800;
      font-size: 15px;
      background: linear-gradient(145deg, color-mix(in srgb, var(--panel) 88%, transparent), color-mix(in srgb, var(--bubble-in) 82%, transparent));
      border: 1px solid color-mix(in srgb, #fff 8%, transparent);
      overflow: hidden;
      flex: 0 0 auto;
      box-shadow: 0 10px 24px rgba(0, 0, 0, 0.2);
    }

    .profile-v9-featured-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .profile-v9-featured-body {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .profile-v9-featured-title {
      font-size: 17px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: var(--text);
    }

    .profile-v9-featured-desc {
      font-size: 13px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
    }

    .profile-v9-featured-meta {
      font-size: 11px;
      color: color-mix(in srgb, var(--muted) 92%, var(--text));
    }

    .profile-v9-highlights-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-v9-highlight-item {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 13px;
      line-height: 1.5;
      color: color-mix(in srgb, var(--text) 86%, var(--muted));
      padding: 4px 0;
    }

    .profile-v9-highlight-dot {
      width: 8px;
      height: 8px;
      margin-top: 5px;
      border-radius: 50%;
      background: color-mix(in srgb, #6ee7b8 70%, var(--muted));
      flex: 0 0 auto;
    }

    .profile-v9-tags-picker {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .profile-v9-tag-pick {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 6px 11px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 80%, transparent);
      font-size: 12px;
      cursor: pointer;
    }

    .profile-v9-tag-pick.is-on {
      border-color: color-mix(in srgb, #6ee7b8 45%, var(--border));
      background: color-mix(in srgb, #6ee7b8 12%, transparent);
    }

    .profile-v91-rep-social-proof {
      display: flex;
      flex-direction: column;
      gap: 6px;
      width: 100%;
      margin-top: 2px;
      text-align: center;
    }

    .profile-v91-rep-highlight {
      font-size: 12px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    .profile-v91-rep-highlight em {
      font-style: normal;
      color: color-mix(in srgb, #fbbf24 75%, var(--text));
      font-weight: 650;
    }

    .profile-v91-rep-thanks {
      font-size: 12px;
      line-height: 1.4;
      color: color-mix(in srgb, #6ee7b8 70%, var(--text));
    }

    .profile-v91-endorsements-block {
      margin-top: 14px;
    }

    .profile-v91-endorsements-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .profile-v91-endorsements-list li {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      font-size: 13px;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
    }

    .profile-v91-endorsements-list li span:last-child {
      color: var(--muted);
      font-weight: 700;
    }

    .profile-v91-endorsement-pick-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 8px;
    }

    .profile-v91-endorsement-pick {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      padding: 11px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 82%, transparent);
      color: var(--text);
      font-size: 13px;
      font-weight: 650;
      cursor: pointer;
      text-align: left;
    }

    .profile-v91-endorsement-pick:hover {
      border-color: color-mix(in srgb, #6ee7b8 40%, var(--border));
      background: color-mix(in srgb, #6ee7b8 10%, transparent);
    }

    .profile-v10-status {
      font-size: 13px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
      text-align: center;
      padding: 0 4px;
    }

    .profile-nitro-card.is-premium .profile-v10-status {
      padding: 6px 12px;
      border-radius: 999px;
      background: linear-gradient(135deg, rgba(212, 160, 23, 0.16), rgba(139, 92, 246, 0.1));
      border: 1px solid color-mix(in srgb, #d4a017 28%, transparent);
    }

    .profile-v10-interest-tags {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 5px;
      margin-top: 2px;
    }

    .profile-v10-interest-tag {
      display: inline-flex;
      padding: 3px 9px;
      border-radius: 999px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: color-mix(in srgb, #93c5fd 80%, var(--text));
      background: color-mix(in srgb, #3b82f6 12%, transparent);
      border: 1px solid color-mix(in srgb, #3b82f6 22%, transparent);
    }

    .profile-v10-focus {
      width: 100%;
      margin-top: 2px;
      padding: 10px 12px;
      border-radius: 14px;
      background: color-mix(in srgb, var(--bubble-in) 55%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
      text-align: left;
      box-shadow: 0 1px 0 color-mix(in srgb, #fff 4%, transparent) inset;
    }

    .profile-nitro-card.is-premium .profile-v10-focus {
      border-color: color-mix(in srgb, #d4a017 22%, var(--border));
      background: linear-gradient(135deg, color-mix(in srgb, #d4a017 8%, transparent), color-mix(in srgb, var(--bubble-in) 55%, transparent));
    }

    .profile-nitro-card.tier-level1 .profile-v10-focus,
    .profile-nitro-card.tier-level1 .profile-v10-strength,
    .profile-nitro-card.tier-level1 .profile-v10-interest-tags {
      display: none;
    }

    .profile-v10-focus-label {
      display: block;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 92%, var(--text));
      margin-bottom: 4px;
    }

    .profile-v10-focus-text {
      font-size: 12px;
      line-height: 1.4;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    .profile-v10-strength {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 5px 11px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 700;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
      background: color-mix(in srgb, var(--bubble-in) 78%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
    }

    .profile-v10-strength--known {
      color: #fbbf24;
      border-color: color-mix(in srgb, #fbbf24 35%, transparent);
      background: color-mix(in srgb, #fbbf24 10%, transparent);
    }

    .profile-v10-strength--legend {
      color: #f5d98b;
      border-color: color-mix(in srgb, #d4a017 40%, transparent);
      background: linear-gradient(135deg, rgba(212, 160, 23, 0.14), rgba(139, 92, 246, 0.08));
    }

    .profile-v10-member-card {
      text-align: center;
      padding: 8px 4px 4px;
    }

    .profile-v10-member-label {
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      margin-bottom: 8px;
      opacity: 0.8;
    }

    .profile-v10-member-tenure {
      font-size: 26px;
      font-weight: 800;
      line-height: 1.15;
      letter-spacing: -0.03em;
      color: var(--text);
    }

    .profile-v10-member-sub {
      margin-top: 6px;
      font-size: 12px;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
      font-style: italic;
    }

    @keyframes profile-v10-cover-shift {
      0%, 100% { background-position: 0% 50%; }
      50% { background-position: 100% 50%; }
    }

    #profileViewerMemberSince.profile-nitro-panel {
      border: none;
      background: transparent;
      box-shadow: none;
      backdrop-filter: none;
      padding: 4px 2px 8px;
    }

    .profile-nitro-card.is-premium.premium-theme-royal_blue {
      --nitro-accent: #6ea8ff;
      --nitro-glow: rgba(110, 168, 255, 0.28);
      border-color: color-mix(in srgb, #6ea8ff 38%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 12%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #6ea8ff 24%, transparent),
        0 32px 72px rgba(0, 0, 0, 0.3),
        0 0 80px rgba(110, 168, 255, 0.12);
    }

    .profile-nitro-card.is-premium.premium-theme-midnight {
      --nitro-accent: #a78bfa;
      --nitro-glow: rgba(167, 139, 250, 0.26);
      border-color: color-mix(in srgb, #a78bfa 36%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #a78bfa 22%, transparent),
        0 32px 72px rgba(0, 0, 0, 0.32),
        0 0 80px rgba(167, 139, 250, 0.1);
    }

    .profile-nitro-card.is-premium.premium-theme-obsidian {
      --nitro-accent: #94a3b8;
      --nitro-glow: rgba(148, 163, 184, 0.22);
      border-color: color-mix(in srgb, #94a3b8 32%, var(--border));
    }

    .profile-nitro-card.is-premium.premium-theme-gold {
      --nitro-accent: #e8b84a;
    }

    .profile-nitro-meta {
      display: none;
      font-size: 12px;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
    }

    .profile-v10-tags-picker {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .profile-v10-tag-pick {
      display: inline-flex;
      padding: 6px 11px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 80%, transparent);
      font-size: 12px;
      font-weight: 650;
      cursor: pointer;
    }

    .profile-v10-tag-pick.is-on {
      border-color: color-mix(in srgb, #60a5fa 45%, var(--border));
      background: color-mix(in srgb, #60a5fa 12%, transparent);
    }

    .profile-v10-status-input {
      width: 100%;
      margin-top: 4px;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 82%, transparent);
      color: var(--text);
      font-size: 13px;
    }

    /* ===== PROFILE V11 — Identity cosmetics ===== */
    .profile-v11-identity-title {
      font-size: 12px;
      font-weight: 750;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: color-mix(in srgb, #93c5fd 78%, var(--text));
      padding: 2px 10px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, #60a5fa 28%, transparent);
      background: color-mix(in srgb, #3b82f6 10%, transparent);
    }

    .profile-v11-identity-title--epic {
      color: #c4b5fd;
      border-color: color-mix(in srgb, #a78bfa 35%, transparent);
      background: color-mix(in srgb, #8b5cf6 12%, transparent);
    }

    .profile-v11-identity-title--legendary {
      color: #f5d98b;
      border-color: color-mix(in srgb, #d4a017 42%, transparent);
      background: linear-gradient(135deg, rgba(212, 160, 23, 0.18), rgba(139, 92, 246, 0.1));
      box-shadow: 0 0 24px rgba(212, 160, 23, 0.14);
    }

    .profile-v115-identity-story {
      font-size: 12px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--text) 86%, var(--muted));
      text-align: center;
      padding: 0 8px;
      max-width: 100%;
    }

    .profile-nitro-card.has-identity-legendary {
      border-color: color-mix(in srgb, #d4a017 48%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 12%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 28%, transparent),
        0 32px 72px rgba(0, 0, 0, 0.3),
        0 0 96px rgba(212, 160, 23, 0.18);
    }

    .profile-nitro-card.has-identity-legendary.is-premium .profile-nitro-avatar-ring::before {
      opacity: 0.55;
    }

    .profile-v11-identity-showcase {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 6px;
      width: 100%;
      margin-top: 4px;
      padding: 0 2px;
    }

    .profile-v11-showcase-chip {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      max-width: 100%;
      padding: 5px 10px;
      border-radius: 999px;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      background: color-mix(in srgb, var(--bubble-in) 50%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 58%, transparent);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .profile-v11-showcase-chip--title {
      color: color-mix(in srgb, #fbbf24 80%, var(--text));
      border-color: color-mix(in srgb, #fbbf24 30%, transparent);
    }

    .profile-v11-showcase-chip--bg {
      color: color-mix(in srgb, #93c5fd 78%, var(--text));
      border-color: color-mix(in srgb, #60a5fa 28%, transparent);
    }

    .profile-v11-showcase-chip--ach {
      color: color-mix(in srgb, #6ee7b8 75%, var(--text));
      border-color: color-mix(in srgb, #34d399 28%, transparent);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_trusted {
      background: linear-gradient(145deg, #1e3a5f 0%, #0f2744 45%, #1a4d3e 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_l2_slate {
      background: linear-gradient(145deg, #2a3140 0%, #3d4a5c 50%, #1e2430 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_l2_ocean {
      background: linear-gradient(145deg, #0f2a3d 0%, #1e4a6b 55%, #0d2137 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_messages_100,
    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_messages_1k {
      background: linear-gradient(145deg, #1a2e4a 0%, #2d4a6e 55%, #152238 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_friends_10,
    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_thanks_5 {
      background: linear-gradient(145deg, #1a2f2a 0%, #2d5a4a 55%, #142820 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_veteran {
      background: linear-gradient(145deg, #2a2418 0%, #5c4a28 50%, #1e1a12 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_thanks_500 {
      background: linear-gradient(135deg, #3d2208 0%, #b45309 42%, #7c2d12 100%);
      background-size: 200% 200%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_infamous,
    .profile-nitro-cover.identity-cover-negative,
    .profile-v14-featured-bg.identity-cover-negative {
      background: linear-gradient(145deg, #1a0505 0%, #4c0519 42%, #12080c 100%);
      box-shadow: inset 0 0 48px rgba(127, 29, 29, 0.22);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_community_legend {
      background: linear-gradient(135deg, #3d2e07 0%, #7c5e10 28%, #c9a227 52%, #5b21b6 100%);
      background-size: 220% 220%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_infamous {
      background: linear-gradient(145deg, #2a0a0a 0%, #4c0519 42%, #1f1018 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_channel_creator {
      background: linear-gradient(145deg, #1a2e4a 0%, #234e77 55%, #16324f 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_rising_creator {
      background: linear-gradient(145deg, #1f2f5c 0%, #3b4f9a 50%, #1e3a5f 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_influencer {
      background: linear-gradient(135deg, #312e81 0%, #6d28d9 45%, #be185d 100%);
      background-size: 200% 200%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_community_star {
      background: linear-gradient(135deg, #422006 0%, #b45309 40%, #7c3aed 100%);
      background-size: 200% 200%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_olone_legend {
      background: linear-gradient(135deg, #1a1208 0%, #d4a017 35%, #7c3aed 68%, #0f172a 100%);
      background-size: 240% 240%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_prem_golden_halo {
      background: linear-gradient(135deg, #2a2210 0%, #d4a017 45%, #f5d98b 70%, #5b21b6 100%);
      background-size: 200% 200%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_prem_royal_pulse {
      background: linear-gradient(135deg, #0f1f3d 0%, #2563eb 42%, #6ea8ff 100%);
      background-size: 200% 200%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_prem_obsidian_flame {
      background: linear-gradient(135deg, #0b0f14 0%, #334155 35%, #d4a017 68%, #1e1b4b 100%);
      background-size: 220% 220%;
    }

    .profile-nitro-cover.identity-cover-animated {
      animation: profile-v10-cover-shift 18s ease-in-out infinite;
    }

    /* ===== PROFILE V12 — Prestige & Seasonal Identity ===== */
    .profile-nitro-cover {
      overflow: hidden;
    }

    .profile-nitro-cover.identity-cover-prestige-legendary {
      box-shadow: inset 0 0 0 1px color-mix(in srgb, #d4a017 35%, transparent);
    }

    .profile-nitro-cover.identity-cover-prestige-mythic {
      box-shadow:
        inset 0 0 0 1px color-mix(in srgb, #e879f9 42%, transparent),
        inset 0 -24px 48px rgba(168, 85, 247, 0.12);
    }

    .profile-v12-cover-particles {
      position: absolute;
      inset: 0;
      pointer-events: none;
      overflow: hidden;
      z-index: 0;
    }

    .profile-v12-cover-particles::before,
    .profile-v12-cover-particles::after {
      content: "";
      position: absolute;
      border-radius: 50%;
      filter: blur(18px);
      opacity: 0.55;
      animation: profile-v12-particle-drift 14s ease-in-out infinite;
    }

    .profile-v12-cover-particles--legendary::before {
      width: 120px;
      height: 120px;
      top: -20%;
      left: 10%;
      background: rgba(212, 160, 23, 0.35);
    }

    .profile-v12-cover-particles--legendary::after {
      width: 90px;
      height: 90px;
      bottom: -10%;
      right: 8%;
      background: rgba(139, 92, 246, 0.28);
      animation-delay: -6s;
    }

    .profile-v12-cover-particles--mythic::before {
      width: 140px;
      height: 140px;
      top: -24%;
      right: 6%;
      background: rgba(236, 72, 153, 0.32);
    }

    .profile-v12-cover-particles--mythic::after {
      width: 110px;
      height: 110px;
      bottom: -16%;
      left: 12%;
      background: rgba(168, 85, 247, 0.38);
      animation-delay: -7s;
    }

    @keyframes profile-v12-particle-drift {
      0%,
      100% {
        transform: translate(0, 0) scale(1);
      }
      50% {
        transform: translate(12px, -8px) scale(1.08);
      }
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_early_adopter {
      background: linear-gradient(145deg, #1a2438 0%, #3b4f72 55%, #152238 100%);
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_winter_2025 {
      background: linear-gradient(135deg, #0f2744 0%, #60a5fa 42%, #dbeafe 100%);
      background-size: 200% 200%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_season_founder {
      background: linear-gradient(135deg, #14532d 0%, #22c55e 38%, #166534 100%);
      background-size: 220% 220%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_anniversary {
      background: linear-gradient(135deg, #312e81 0%, #d4a017 45%, #7c3aed 100%);
      background-size: 220% 220%;
    }

    :is(.profile-nitro-cover, .profile-v14-featured-bg).idbg_prem_mythic_aura {
      background: linear-gradient(135deg, #0b0f14 0%, #7c3aed 32%, #ec4899 58%, #d4a017 100%);
      background-size: 260% 260%;
    }

    .profile-nitro-card.has-identity-mythic {
      border-color: color-mix(in srgb, #c084fc 58%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 14%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #a855f7 34%, transparent),
        0 36px 80px rgba(0, 0, 0, 0.34),
        0 0 120px rgba(168, 85, 247, 0.22);
    }

    .profile-nitro-card.has-identity-premium-frame {
      animation: profile-v12-premium-frame-pulse 6s ease-in-out infinite;
    }

    .profile-nitro-card.has-identity-premium-frame::after {
      content: "";
      position: absolute;
      inset: -1px;
      border-radius: inherit;
      pointer-events: none;
      border: 1px solid transparent;
      background:
        linear-gradient(var(--surface), var(--surface)) padding-box,
        linear-gradient(120deg, rgba(212, 160, 23, 0.65), rgba(168, 85, 247, 0.45), rgba(96, 165, 250, 0.55)) border-box;
      -webkit-mask:
        linear-gradient(#fff 0 0) padding-box,
        linear-gradient(#fff 0 0);
      mask:
        linear-gradient(#fff 0 0) padding-box,
        linear-gradient(#fff 0 0);
      -webkit-mask-composite: xor;
      mask-composite: exclude;
      opacity: 0.72;
      z-index: 0;
    }

    @keyframes profile-v12-premium-frame-pulse {
      0%,
      100% {
        filter: none;
      }
      50% {
        filter: drop-shadow(0 0 18px rgba(212, 160, 23, 0.12));
      }
    }

    .profile-v12-showcase-frame {
      width: 100%;
      margin-top: 4px;
      padding: 6px 8px 4px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 28%, transparent);
    }

    .profile-v12-showcase-frame--epic {
      border-color: color-mix(in srgb, #a78bfa 32%, transparent);
      box-shadow: 0 0 20px rgba(139, 92, 246, 0.08);
    }

    .profile-v12-showcase-frame--legendary {
      border-color: color-mix(in srgb, #d4a017 42%, transparent);
      box-shadow: 0 0 28px rgba(212, 160, 23, 0.12);
    }

    .profile-v12-showcase-frame--mythic {
      border-color: color-mix(in srgb, #c084fc 48%, transparent);
      box-shadow:
        0 0 32px rgba(168, 85, 247, 0.16),
        inset 0 0 24px rgba(236, 72, 153, 0.06);
    }

    .profile-v12-showcase-prestige-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 14px;
      height: 14px;
      margin-left: 4px;
      padding: 0 4px;
      border-radius: 999px;
      font-size: 8px;
      font-weight: 800;
      letter-spacing: 0.06em;
      color: #fff7ed;
      background: linear-gradient(135deg, #d4a017, #a855f7);
    }

    .profile-v12-showcase-chip--legendary {
      border-color: color-mix(in srgb, #d4a017 38%, transparent);
      color: color-mix(in srgb, #fcd34d 82%, var(--text));
    }

    .profile-v12-showcase-chip--mythic {
      border-color: color-mix(in srgb, #c084fc 42%, transparent);
      color: color-mix(in srgb, #e9d5ff 84%, var(--text));
      box-shadow: 0 0 16px rgba(168, 85, 247, 0.14);
    }

    .profile-v12-seasonal-badge {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 16px;
      height: 16px;
      margin-left: 4px;
      border-radius: 999px;
      font-size: 10px;
      line-height: 1;
      vertical-align: middle;
      background: color-mix(in srgb, var(--bubble-in) 70%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    }

    .profile-v115-story-sep {
      opacity: 0.55;
      padding: 0 2px;
    }

    .profile-v12-title-glow {
      text-shadow: 0 0 18px rgba(212, 160, 23, 0.35);
    }

    .profile-v12-evolution-editor {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin-top: 10px;
    }

    .profile-v12-evolution-chain {
      padding: 10px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 55%, transparent);
    }

    .profile-v12-evolution-head {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-bottom: 8px;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--text) 78%, var(--muted));
    }

    .profile-v12-evolution-steps {
      display: flex;
      align-items: center;
      gap: 4px;
      flex-wrap: wrap;
    }

    .profile-v12-evolution-step {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 4px 8px;
      border-radius: 999px;
      font-size: 10px;
      font-weight: 700;
      color: color-mix(in srgb, var(--muted) 92%, var(--text));
      border: 1px dashed color-mix(in srgb, var(--border) 78%, transparent);
      opacity: 0.55;
    }

    .profile-v12-evolution-step.is-earned {
      opacity: 1;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      border-style: solid;
      border-color: color-mix(in srgb, #34d399 30%, transparent);
      background: color-mix(in srgb, #10b981 8%, transparent);
    }

    .profile-v12-evolution-step.is-current {
      border-color: color-mix(in srgb, #fbbf24 42%, transparent);
      box-shadow: 0 0 12px rgba(251, 191, 36, 0.12);
    }

    .profile-v12-evolution-arrow {
      opacity: 0.35;
      font-size: 10px;
    }

    #profileViewerIdentityEvolution {
      display: none !important;
    }

    /* ===== PROFILE V13 — Visual Excellence Pass ===== */
    .profile-nitro-card.tier-level1 .profile-nitro-reputation-ring-donut {
      width: 148px;
      height: 148px;
      padding: 8px;
    }

    .profile-nitro-card.tier-level1 .profile-nitro-reputation-ring-score {
      font-size: 34px;
    }

    .profile-nitro-card.tier-level1 .profile-nitro-reputation-ring::before {
      opacity: 0.35;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-body {
      gap: 20px;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-reputation-ring {
      order: 0;
      padding: 22px 0 10px;
    }

    .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 30px;
      text-shadow: 0 0 36px rgba(245, 217, 139, 0.38);
    }

    .profile-nitro-card.is-premium .profile-v115-identity-story,
    .profile-nitro-card.is-premium .profile-v115-story-title.profile-v12-title-glow {
      text-shadow: 0 0 24px rgba(212, 160, 23, 0.42);
    }

    .profile-v12-title-glow {
      text-shadow: 0 0 28px rgba(212, 160, 23, 0.55), 0 0 10px rgba(245, 217, 139, 0.38);
    }

    .profile-v12-showcase-frame {
      padding: 10px 10px 8px;
      border-radius: 16px;
      background:
        linear-gradient(180deg, color-mix(in srgb, var(--bubble-in) 36%, transparent), color-mix(in srgb, var(--panel) 24%, transparent));
    }

    .profile-v11-identity-showcase {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
      width: 100%;
      margin-top: 0;
      padding: 0;
    }

    .profile-v13-showcase-tile {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-height: 72px;
      padding: 10px 8px 8px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
      background:
        linear-gradient(180deg, color-mix(in srgb, var(--bubble-in) 72%, transparent), color-mix(in srgb, var(--panel) 88%, transparent));
      box-shadow: 0 8px 20px rgba(0, 0, 0, 0.12);
      overflow: hidden;
      text-align: center;
    }

    .profile-v13-showcase-tile::before {
      content: attr(data-rarity);
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      padding: 3px 6px 0;
      font-size: 8px;
      font-weight: 800;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      opacity: 0.92;
    }

    .profile-v13-showcase-tile::after {
      content: "";
      position: absolute;
      inset: 0 auto 0 0;
      width: 3px;
      border-radius: 14px 0 0 14px;
      background: color-mix(in srgb, var(--border) 80%, transparent);
    }

    .profile-v13-showcase-tile--common::after { background: #94a3b8; }
    .profile-v13-showcase-tile--rare::after { background: #60a5fa; }
    .profile-v13-showcase-tile--epic::after { background: #a78bfa; }
    .profile-v13-showcase-tile--legendary::after {
      background: linear-gradient(180deg, #fcd34d, #d4a017);
      box-shadow: 0 0 12px rgba(212, 160, 23, 0.35);
    }
    .profile-v13-showcase-tile--mythic::after {
      background: linear-gradient(180deg, #e879f9, #a855f7);
      box-shadow: 0 0 14px rgba(168, 85, 247, 0.38);
    }

    .profile-v13-showcase-tile-ic {
      font-size: 18px;
      line-height: 1;
      margin-top: 8px;
    }

    .profile-v13-showcase-tile-name {
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0.03em;
      line-height: 1.25;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
      max-width: 100%;
      overflow: hidden;
      text-overflow: ellipsis;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
    }

    .profile-v13-showcase-tile--legendary {
      border-color: color-mix(in srgb, #d4a017 34%, transparent);
      box-shadow: 0 10px 24px rgba(212, 160, 23, 0.12);
    }

    .profile-v13-showcase-tile--mythic {
      border-color: color-mix(in srgb, #c084fc 38%, transparent);
      box-shadow: 0 12px 28px rgba(168, 85, 247, 0.16);
    }

    .profile-v13-showcase-tile-kind {
      font-size: 8px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 82%, var(--text));
    }

    /* ===== PROFILE V14 — Showcase First Pass ===== */
    .profile-nitro-card.tier-level2 .profile-nitro-body {
      gap: 10px;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-reputation-ring {
      padding: 8px 0 4px;
    }

    #profileViewerModal:not(.profile-ui-baseline-v15) #profileNitroIdentityShowcase {
      display: none !important;
    }

    #profileNitroMobilePerson,
    #profileNitroMobileChannel {
      display: none !important;
    }

    .profile-nitro-metrics {
      opacity: 0.68;
      gap: 6px;
      margin-top: 0;
      padding-top: 2px;
    }

    .profile-nitro-metric {
      padding: 6px 8px;
      min-height: 50px;
      border-radius: 12px;
      border-color: color-mix(in srgb, var(--border) 32%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 24%, transparent);
    }

    .profile-nitro-metric-val {
      font-size: 17px;
      font-weight: 750;
      color: color-mix(in srgb, var(--text) 82%, var(--muted));
    }

    .profile-nitro-metric-lbl {
      font-size: 8px;
      letter-spacing: 0.08em;
      opacity: 0.82;
    }

    .profile-nitro-metric-ic {
      font-size: 14px;
      opacity: 0.72;
    }

    .profile-nitro-panel#profileViewerFeaturedIdentity {
      padding: 0;
      overflow: hidden;
      border: none;
      background: transparent;
      box-shadow: none;
    }

    .profile-v14-featured-card {
      position: relative;
      overflow: hidden;
      border-radius: 20px;
      min-height: 196px;
      border: 1px solid color-mix(in srgb, var(--border) 58%, transparent);
      background: color-mix(in srgb, var(--panel) 88%, transparent);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
        0 16px 40px rgba(0, 0, 0, 0.18);
    }

    .profile-v14-featured-card--rare {
      border-color: color-mix(in srgb, #60a5fa 32%, var(--border));
    }

    .profile-v14-featured-card--epic {
      border-color: color-mix(in srgb, #a78bfa 36%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #a78bfa 18%, transparent),
        0 18px 44px rgba(99, 102, 241, 0.14);
    }

    .profile-v14-featured-card--legendary {
      border-color: color-mix(in srgb, #d4a017 42%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 22%, transparent),
        0 20px 48px rgba(212, 160, 23, 0.16);
    }

    .profile-v14-featured-card--mythic {
      border-color: color-mix(in srgb, #c084fc 44%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 12%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #c084fc 26%, transparent),
        0 22px 52px rgba(168, 85, 247, 0.2),
        0 0 64px rgba(168, 85, 247, 0.12);
    }

    .profile-v14-featured-card.is-premium-frame {
      border-color: color-mix(in srgb, #e8b84a 48%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 14%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 28%, transparent),
        0 24px 56px rgba(212, 160, 23, 0.22),
        0 0 72px rgba(212, 160, 23, 0.14);
    }

    .profile-v14-featured-bg {
      position: absolute;
      inset: 0;
      z-index: 0;
      background-size: 200% 200%;
    }

    .profile-v14-featured-bg.is-animated {
      animation: profile-v12-cover-shift 14s ease-in-out infinite;
    }

    .profile-v14-featured-scrim {
      position: absolute;
      inset: 0;
      z-index: 1;
      background:
        linear-gradient(180deg, rgba(0, 0, 0, 0.08) 0%, rgba(0, 0, 0, 0.42) 52%, rgba(0, 0, 0, 0.82) 100%),
        radial-gradient(ellipse 90% 60% at 50% 100%, rgba(0, 0, 0, 0.35), transparent 68%);
      pointer-events: none;
    }

    .profile-v14-featured-body {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-end;
      gap: 8px;
      min-height: 196px;
      padding: 18px 18px 16px;
      text-align: left;
    }

    .profile-v14-featured-kicker {
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.18em;
      text-transform: uppercase;
      color: color-mix(in srgb, #fff 72%, transparent);
      opacity: 0.88;
    }

    .profile-v14-featured-title {
      font-size: 28px;
      font-weight: 850;
      letter-spacing: -0.03em;
      line-height: 1.08;
      color: #fff;
      text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
    }

    .profile-v14-featured-card--legendary .profile-v14-featured-title,
    .profile-v14-featured-card--mythic .profile-v14-featured-title {
      text-shadow:
        0 0 32px rgba(212, 160, 23, 0.42),
        0 2px 20px rgba(0, 0, 0, 0.5);
    }

    .profile-v14-featured-card.is-premium-frame .profile-v14-featured-title {
      font-size: 30px;
      text-shadow:
        0 0 36px rgba(245, 217, 139, 0.55),
        0 2px 22px rgba(0, 0, 0, 0.52);
    }

    .profile-v14-featured-bg-name {
      font-size: 11px;
      font-weight: 650;
      color: color-mix(in srgb, #fff 78%, transparent);
      letter-spacing: 0.04em;
    }

    .profile-v14-featured-achievement {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 2px;
      padding: 8px 12px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, #fff 18%, transparent);
      background: color-mix(in srgb, #000 38%, transparent);
      backdrop-filter: blur(8px);
      max-width: 100%;
    }

    .profile-v14-featured-achievement-ic {
      font-size: 22px;
      line-height: 1;
      flex-shrink: 0;
    }

    .profile-v14-featured-achievement-meta {
      display: flex;
      flex-direction: column;
      gap: 2px;
      min-width: 0;
    }

    .profile-v14-featured-achievement-name {
      font-size: 13px;
      font-weight: 750;
      color: #fff;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .profile-v14-featured-achievement-rarity {
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: color-mix(in srgb, #f5d98b 82%, #fff);
    }

    .profile-v14-featured-badges {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      margin-top: 2px;
    }

    .profile-nitro-panels {
      gap: 10px;
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) .profile-nitro-about-quote {
      font-size: 15px;
      line-height: 1.55;
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) .profile-nitro-about-quote::before {
      font-size: 32px;
      line-height: 0.85;
      margin-bottom: 0;
    }

    .profile-nitro-panel#profileViewerAbout:not(.profile-nitro-panel--about-hero) {
      padding: 4px 2px 2px;
    }

    .profile-nitro-panel--about-hero {
      padding: 16px 16px 12px;
    }

    .profile-nitro-panel--about-hero .profile-nitro-about-quote {
      font-size: 17px;
      line-height: 1.58;
    }

    .profile-nitro-panel--about-hero .profile-nitro-about-quote::before {
      font-size: 38px;
    }

    .profile-nitro-panel--social-tail {
      opacity: 0.88;
      padding-top: 12px;
      margin-top: 2px;
      border-top: 1px solid color-mix(in srgb, var(--border) 38%, transparent);
    }

    .profile-nitro-card.is-premium {
      border-width: 2px;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 16%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 32%, transparent),
        0 0 0 4px color-mix(in srgb, #d4a017 10%, transparent),
        0 32px 72px rgba(0, 0, 0, 0.34),
        0 0 96px rgba(212, 160, 23, 0.2);
    }

    .profile-nitro-card.is-premium::before {
      opacity: 1;
      background:
        radial-gradient(ellipse 100% 60% at 50% -10%, rgba(232, 184, 74, 0.42), transparent 62%),
        radial-gradient(ellipse 70% 45% at 100% 100%, rgba(139, 92, 246, 0.12), transparent 58%);
    }

    .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      opacity: 0.72;
      box-shadow:
        0 0 0 3px rgba(212, 160, 23, 0.35),
        0 0 48px rgba(212, 160, 23, 0.38);
    }

    @media (min-width: 769px) {
      .profile-nitro-body {
        gap: 10px;
        padding: 0 18px 12px;
      }

      .profile-nitro-metrics {
        gap: 5px;
      }

      .profile-nitro-metric {
        padding: 5px 6px;
        min-height: 48px;
      }

      .profile-v14-featured-card {
        min-height: 188px;
      }

      .profile-v14-featured-body {
        min-height: 188px;
        padding: 16px 16px 14px;
      }
    }

    /* ===== PROFILE V15 — Prestige Identity Pass ===== */
    @keyframes profile-v15-mythic-breathe {
      0%, 100% { opacity: 0.72; transform: scale(1); }
      50% { opacity: 1; transform: scale(1.03); }
    }

    @keyframes profile-v15-premium-rim {
      0%, 100% { opacity: 0.55; }
      50% { opacity: 0.95; }
    }

    @keyframes profile-v15-mythic-shimmer {
      0% { transform: translateX(-120%) skewX(-12deg); }
      100% { transform: translateX(220%) skewX(-12deg); }
    }

    .profile-nitro-card.tier-level2 .profile-nitro-avatar-stage {
      width: 120px;
      height: 120px;
      filter: drop-shadow(0 22px 44px rgba(0, 0, 0, 0.42)) drop-shadow(0 0 28px rgba(99, 179, 237, 0.18));
    }

    .profile-nitro-card.tier-level2 .profile-nitro-avatar-btn {
      width: 108px;
      height: 108px;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-name {
      font-size: 32px;
    }

    .profile-v115-identity-story {
      font-size: 13px;
      font-weight: 650;
      letter-spacing: 0.02em;
    }

    .profile-v115-story-title {
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
    }

    .profile-nitro-card.is-premium {
      --nitro-accent: #c4a0ff;
      --nitro-glow: rgba(196, 160, 255, 0.32);
      --rep-glow: rgba(167, 139, 250, 0.38);
      border: 2px solid color-mix(in srgb, #a78bfa 38%, #d4a017 22%);
      background:
        radial-gradient(ellipse 120% 85% at 0% 0%, rgba(147, 112, 219, 0.28), transparent 58%),
        radial-gradient(ellipse 100% 75% at 100% 0%, rgba(255, 196, 120, 0.16), transparent 55%),
        radial-gradient(ellipse 80% 60% at 50% 100%, rgba(88, 28, 135, 0.18), transparent 62%),
        linear-gradient(180deg, #18122e 0%, #12101c 42%, #0a0a10 100%);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 12%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #9333ea 22%, transparent),
        0 0 0 5px color-mix(in srgb, #d4a017 8%, transparent),
        0 36px 80px rgba(0, 0, 0, 0.42),
        0 0 120px rgba(147, 112, 219, 0.18),
        0 0 64px rgba(255, 196, 120, 0.08);
    }

    .profile-nitro-card.is-premium::before {
      opacity: 1;
      background:
        radial-gradient(ellipse 90% 55% at 12% -8%, rgba(196, 160, 255, 0.38), transparent 62%),
        radial-gradient(ellipse 70% 50% at 92% 8%, rgba(255, 196, 120, 0.22), transparent 58%),
        radial-gradient(ellipse 60% 45% at 50% 110%, rgba(88, 28, 135, 0.2), transparent 65%);
    }

    .profile-nitro-card.is-premium::after {
      content: "";
      position: absolute;
      inset: -1px;
      border-radius: inherit;
      pointer-events: none;
      z-index: 0;
      background: linear-gradient(135deg, rgba(255, 196, 120, 0.42), rgba(167, 139, 250, 0.38), rgba(255, 196, 120, 0.32));
      opacity: 0.55;
      animation: profile-v15-premium-rim 5s ease-in-out infinite;
      mask: linear-gradient(#fff 0 0) content-box, linear-gradient(#fff 0 0);
      mask-composite: exclude;
      -webkit-mask-composite: xor;
      padding: 2px;
    }

    .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 34px;
      text-shadow:
        0 0 40px rgba(196, 160, 255, 0.45),
        0 0 18px rgba(255, 196, 120, 0.28);
    }

    .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      opacity: 0.88;
      box-shadow:
        0 0 0 3px rgba(196, 160, 255, 0.42),
        0 0 0 6px rgba(255, 196, 120, 0.14),
        0 0 56px rgba(147, 112, 219, 0.42),
        0 0 32px rgba(255, 196, 120, 0.22);
    }

    .profile-nitro-card.is-premium .profile-nitro-avatar-stage {
      filter: drop-shadow(0 28px 56px rgba(0, 0, 0, 0.5)) drop-shadow(0 0 48px rgba(147, 112, 219, 0.32)) drop-shadow(0 0 24px rgba(255, 196, 120, 0.18));
    }

    .profile-v15-featured-panel {
      order: -1;
    }

    .profile-v15-featured-card {
      position: relative;
      overflow: hidden;
      border-radius: 22px;
      min-height: 248px;
      isolation: isolate;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 24px 56px rgba(0, 0, 0, 0.28);
    }

    .profile-v15-featured-card--common {
      border: 1px solid color-mix(in srgb, var(--border) 62%, transparent);
      background: linear-gradient(180deg, color-mix(in srgb, #64748b 18%, transparent), color-mix(in srgb, var(--panel) 92%, transparent));
    }

    .profile-v15-featured-card--common .profile-v15-featured-atmosphere {
      background: radial-gradient(ellipse 90% 70% at 50% 0%, rgba(148, 163, 184, 0.22), transparent 68%);
    }

    .profile-v15-featured-card--rare {
      border: 1px solid color-mix(in srgb, #60a5fa 38%, transparent);
      box-shadow:
        0 0 0 1px color-mix(in srgb, #60a5fa 14%, transparent),
        0 20px 48px rgba(59, 130, 246, 0.16);
    }

    .profile-v15-featured-card--rare .profile-v15-featured-atmosphere {
      background:
        radial-gradient(ellipse 80% 60% at 20% 0%, rgba(96, 165, 250, 0.32), transparent 62%),
        radial-gradient(ellipse 70% 55% at 100% 100%, rgba(14, 165, 233, 0.14), transparent 58%);
    }

    .profile-v15-featured-card--epic {
      border: 1px solid color-mix(in srgb, #a78bfa 42%, transparent);
      box-shadow:
        0 0 0 1px color-mix(in srgb, #a78bfa 18%, transparent),
        0 22px 52px rgba(99, 102, 241, 0.2),
        0 0 48px rgba(139, 92, 246, 0.1);
    }

    .profile-v15-featured-card--epic .profile-v15-featured-atmosphere {
      background:
        radial-gradient(ellipse 85% 65% at 15% 10%, rgba(167, 139, 250, 0.38), transparent 60%),
        radial-gradient(ellipse 75% 60% at 90% 90%, rgba(76, 29, 149, 0.28), transparent 62%);
    }

    .profile-v15-featured-card--legendary {
      border: 1px solid color-mix(in srgb, #d4a017 48%, transparent);
      box-shadow:
        0 0 0 1px color-mix(in srgb, #d4a017 24%, transparent),
        0 24px 56px rgba(212, 160, 23, 0.22),
        0 0 64px rgba(212, 160, 23, 0.12);
    }

    .profile-v15-featured-card--legendary .profile-v15-featured-atmosphere {
      background:
        radial-gradient(ellipse 90% 70% at 20% 0%, rgba(245, 217, 139, 0.32), transparent 58%),
        radial-gradient(ellipse 80% 65% at 85% 100%, rgba(180, 83, 9, 0.22), transparent 62%);
    }

    .profile-v15-featured-card--mythic {
      border: 1px solid color-mix(in srgb, #e879f9 52%, #d4a017 18%);
      box-shadow:
        0 0 0 1px color-mix(in srgb, #e879f9 28%, transparent),
        0 28px 64px rgba(168, 85, 247, 0.28),
        0 0 88px rgba(232, 121, 249, 0.16),
        0 0 120px rgba(212, 160, 23, 0.08);
    }

    .profile-v15-featured-card--mythic .profile-v15-featured-atmosphere {
      background:
        radial-gradient(ellipse 100% 75% at 50% -10%, rgba(232, 121, 249, 0.42), transparent 58%),
        radial-gradient(ellipse 80% 70% at 0% 100%, rgba(124, 58, 237, 0.32), transparent 62%),
        radial-gradient(ellipse 80% 70% at 100% 100%, rgba(245, 217, 139, 0.18), transparent 62%);
      animation: profile-v15-mythic-breathe 6s ease-in-out infinite;
    }

    .profile-v15-featured-card.is-mythic-league {
      min-height: 288px;
      transform: translateZ(0);
    }

    .profile-v15-featured-card.is-mythic-league .profile-v15-featured-shimmer {
      display: block;
    }

    .profile-v15-featured-card.is-premium-frame:not(.profile-v15-featured-card--mythic) {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #d4a017 22%, transparent),
        0 0 0 4px color-mix(in srgb, #9333ea 10%, transparent),
        0 26px 60px rgba(147, 112, 219, 0.18);
    }

    .profile-v15-featured-atmosphere {
      position: absolute;
      inset: 0;
      z-index: 1;
      pointer-events: none;
      mix-blend-mode: screen;
    }

    .profile-v15-featured-shimmer {
      display: none;
      position: absolute;
      inset: 0;
      z-index: 4;
      pointer-events: none;
      overflow: hidden;
    }

    .profile-v15-featured-shimmer::after {
      content: "";
      position: absolute;
      top: -20%;
      left: 0;
      width: 42%;
      height: 140%;
      background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.16), transparent);
      animation: profile-v15-mythic-shimmer 5.5s ease-in-out infinite;
    }

    .profile-v15-featured-card .profile-v14-featured-body {
      min-height: 248px;
      padding: 22px 20px 18px;
      gap: 10px;
    }

    .profile-v15-featured-card.is-mythic-league .profile-v14-featured-body {
      min-height: 288px;
    }

    .profile-v15-featured-card .profile-v14-featured-title {
      font-size: 34px;
      font-weight: 900;
      letter-spacing: -0.04em;
    }

    .profile-v15-featured-card--mythic .profile-v14-featured-title,
    .profile-v15-featured-card.is-mythic-league .profile-v14-featured-title {
      font-size: 38px;
      text-shadow:
        0 0 48px rgba(232, 121, 249, 0.55),
        0 0 24px rgba(245, 217, 139, 0.38),
        0 2px 24px rgba(0, 0, 0, 0.55);
    }

    .profile-v15-featured-card .profile-v14-featured-kicker {
      font-size: 10px;
      letter-spacing: 0.22em;
      color: color-mix(in srgb, #fff 82%, transparent);
    }

    .profile-v15-featured-card .profile-v14-featured-achievement {
      padding: 10px 14px;
      border-radius: 16px;
      border-color: color-mix(in srgb, #fff 24%, transparent);
      background: color-mix(in srgb, #000 48%, transparent);
    }

    .profile-v15-featured-card .profile-v14-featured-achievement-ic {
      font-size: 26px;
    }

    .profile-nitro-metrics.profile-v15-traits {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 6px 10px;
      opacity: 0.52;
      padding: 8px 4px 2px;
      margin-top: 4px;
      border-top: 1px solid color-mix(in srgb, var(--border) 22%, transparent);
    }

    .profile-v15-trait {
      font-size: 11px;
      font-weight: 600;
      line-height: 1.35;
      color: color-mix(in srgb, var(--muted) 92%, var(--text));
      letter-spacing: 0.01em;
      padding: 0;
      border: none;
      background: none;
      min-height: 0;
    }

    .profile-v15-trait::before {
      content: "·";
      margin-right: 6px;
      opacity: 0.45;
    }

    .profile-v15-trait:first-child::before {
      content: none;
      margin: 0;
    }

    .profile-nitro-metrics.profile-v15-traits .profile-nitro-metric {
      all: unset;
      display: inline;
    }

    .profile-nitro-metrics:not(.profile-v15-traits) {
      margin-top: 6px;
    }

    .profile-v15-blind-test .profile-nitro-premium,
    .profile-v15-blind-test .premium-crown-inline,
    .profile-v15-blind-test .profile-nitro-level-badge {
      display: none !important;
    }

    @media (min-width: 769px) {
      .profile-v15-featured-card {
        min-height: 268px;
      }

      .profile-v15-featured-card .profile-v14-featured-body {
        min-height: 268px;
      }

      .profile-v15-featured-card.is-mythic-league {
        min-height: 304px;
      }

      .profile-v15-featured-card.is-mythic-league .profile-v14-featured-body {
        min-height: 304px;
      }
    }

    /* ===== PROFILE V16 — Social Identity Pass ===== */
    .profile-v16-featured-person .profile-v14-featured-kicker,
    .profile-v16-featured-person .profile-v14-featured-achievement-rarity,
    .profile-v16-featured-person .profile-v14-featured-badges,
    .profile-v16-featured-person .profile-v15-featured-shimmer {
      display: none;
    }

    .profile-v16-featured-person .profile-v14-featured-bg {
      opacity: 0.42;
      filter: saturate(0.72) brightness(0.72);
    }

    .profile-v16-featured-person .profile-v14-featured-scrim {
      background:
        linear-gradient(180deg, rgba(8, 10, 18, 0.15) 0%, rgba(8, 10, 18, 0.62) 52%, rgba(8, 10, 18, 0.94) 100%);
    }

    .profile-v16-person-body {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      justify-content: flex-end;
      gap: 10px;
      min-height: 248px;
      padding: 22px 20px 18px;
      text-align: left;
    }

    .profile-v16-person-kicker {
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.2em;
      text-transform: uppercase;
      color: color-mix(in srgb, #fff 68%, transparent);
    }

    .profile-v16-person-role {
      font-size: 13px;
      font-weight: 700;
      line-height: 1.45;
      color: color-mix(in srgb, #fff 88%, transparent);
      max-width: 100%;
    }

    .profile-v16-person-known-label {
      font-size: 10px;
      font-weight: 750;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: color-mix(in srgb, #fbbf24 72%, #fff);
      margin-top: 4px;
    }

    .profile-v16-person-quote {
      margin: 0;
      padding: 0;
      border: none;
      font-size: 26px;
      font-weight: 850;
      line-height: 1.18;
      letter-spacing: -0.03em;
      color: #fff;
      text-shadow: 0 2px 24px rgba(0, 0, 0, 0.45);
    }

    .profile-v16-person-valued {
      font-size: 13px;
      line-height: 1.5;
      color: color-mix(in srgb, #fff 76%, transparent);
      max-width: 100%;
    }

    .profile-v16-person-channel {
      font-size: 12px;
      line-height: 1.45;
      color: color-mix(in srgb, #93c5fd 82%, #fff);
      padding: 8px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, #fff 14%, transparent);
      background: color-mix(in srgb, #000 32%, transparent);
      max-width: 100%;
    }

    .profile-v16-person-rewards-foot {
      font-size: 10px;
      line-height: 1.4;
      color: color-mix(in srgb, #fff 52%, transparent);
      opacity: 0.82;
      margin-top: 2px;
    }

    .profile-v16-recognition {
      margin-top: 10px;
      padding: 10px 12px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, #fbbf24 22%, var(--border));
      background: color-mix(in srgb, #fbbf24 8%, transparent);
      font-size: 12px;
      line-height: 1.5;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
      text-align: center;
    }

    .profile-v16-recognition em {
      font-style: normal;
      font-weight: 750;
      color: color-mix(in srgb, #fbbf24 78%, var(--text));
    }

    .profile-v16-common-ground-host {
      width: 100%;
      margin-top: 2px;
    }

    .profile-v16-common-ground {
      padding: 10px 12px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 42%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 32%, transparent);
      text-align: left;
    }

    .profile-v16-common-ground-title {
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      margin-bottom: 6px;
    }

    .profile-v16-common-ground-list {
      margin: 0;
      padding: 0;
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .profile-v16-common-ground-list li {
      font-size: 12px;
      line-height: 1.4;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    .profile-v16-member-story-list {
      margin: 0;
      padding: 0;
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-v16-member-story-item {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 14px;
      line-height: 1.5;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    .profile-v16-member-story-item::before {
      content: "•";
      color: color-mix(in srgb, var(--nitro-accent, #7ea2ff) 72%, var(--muted));
      font-weight: 800;
      line-height: 1.35;
    }

    .profile-nitro-card.is-premium.profile-v16-premium-soft {
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #a78bfa 18%, transparent),
        0 24px 56px rgba(0, 0, 0, 0.28),
        0 0 48px rgba(147, 112, 219, 0.1);
    }

    .profile-nitro-card.is-premium.profile-v16-premium-soft::after {
      opacity: 0.32;
      animation: none;
    }

    .profile-nitro-card.is-premium.profile-v16-premium-soft .profile-nitro-premium {
      opacity: 0.78;
      font-size: 10px;
      letter-spacing: 0.08em;
    }

    .profile-nitro-card.is-premium.profile-v16-premium-soft .profile-v15-featured-card.is-mythic-league,
    .profile-nitro-card.is-premium.profile-v16-premium-soft .profile-v15-featured-card.is-mythic-league .profile-v14-featured-body,
    .profile-nitro-card.is-premium.profile-v16-premium-soft .profile-v16-person-body {
      min-height: 248px;
    }

    .profile-nitro-card.profile-v16-community-legend:not(.is-premium) {
      border-color: color-mix(in srgb, #d4a017 46%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 12%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 28%, transparent),
        0 28px 64px rgba(0, 0, 0, 0.32),
        0 0 72px rgba(212, 160, 23, 0.16);
    }

    .profile-nitro-card.profile-v16-community-legend:not(.is-premium) .profile-v16-person-quote {
      text-shadow:
        0 0 28px rgba(212, 160, 23, 0.38),
        0 2px 20px rgba(0, 0, 0, 0.48);
    }

    @media (min-width: 769px) {
      .profile-v16-person-body {
        min-height: 268px;
      }

      .profile-v16-person-quote {
        font-size: 28px;
      }
    }

    /* ===== PROFILE V17 — Living Community Identity ===== */
    .profile-v17-presence-list,
    .profile-v17-activity-feed {
      margin: 0;
      padding: 0;
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-v17-presence-item,
    .profile-v17-activity-item {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      font-size: 14px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    .profile-v17-presence-ic,
    .profile-v17-activity-ic {
      flex-shrink: 0;
      font-size: 16px;
      line-height: 1.2;
    }

    .profile-v17-recognition-recent {
      margin-top: 8px;
      padding-top: 8px;
      border-top: 1px solid color-mix(in srgb, var(--border) 36%, transparent);
      font-size: 11px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      text-align: center;
    }

    .profile-v17-recognition-recent strong {
      display: block;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
      margin-bottom: 4px;
    }

    .profile-v17-timeline {
      position: relative;
      margin: 0;
      padding: 4px 0 4px 18px;
      list-style: none;
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .profile-v17-timeline::before {
      content: "";
      position: absolute;
      left: 5px;
      top: 8px;
      bottom: 8px;
      width: 2px;
      border-radius: 999px;
      background: linear-gradient(
        180deg,
        color-mix(in srgb, var(--nitro-accent, #7ea2ff) 55%, transparent),
        color-mix(in srgb, var(--border) 70%, transparent)
      );
    }

    .profile-v17-timeline-item {
      position: relative;
      display: grid;
      grid-template-columns: 52px 1fr;
      gap: 10px;
      padding: 10px 0 10px 8px;
    }

    .profile-v17-timeline-item::before {
      content: "";
      position: absolute;
      left: -15px;
      top: 16px;
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--nitro-accent, #7ea2ff) 78%, #fff);
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--panel) 92%, transparent);
    }

    .profile-v17-timeline-year {
      font-size: 13px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    .profile-v17-timeline-text {
      font-size: 14px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    .profile-v17-featured-channel {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .profile-v17-featured-channel-kicker {
      font-size: 10px;
      font-weight: 750;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
    }

    .profile-v17-featured-empty {
      font-size: 14px;
      line-height: 1.55;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
      font-style: italic;
      padding: 8px 2px 4px;
    }

    .profile-v17-featured-card .profile-v9-featured-desc {
      font-size: 14px;
      line-height: 1.5;
    }

    .profile-v17-featured-audience {
      font-size: 12px;
      font-weight: 650;
      color: color-mix(in srgb, #93c5fd 78%, var(--text));
    }

    .profile-v17-featured-status {
      font-size: 11px;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
    }

    #profileViewerModal.profile-ui-baseline-v15 .profile-v17-ui-block {
      display: none !important;
    }

    #profileViewerModal.profile-ui-baseline-v15 #profileNitroIdentityShowcase:not(.hidden) {
      display: block !important;
    }

    .profile-v11-identity-editor {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 8px;
    }

    .profile-v11-identity-editor select {
      width: 100%;
      min-height: 36px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 82%, transparent);
      color: var(--text);
      font-size: 13px;
      padding: 0 10px;
    }

    .profile-nitro-trust {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      padding: 4px 10px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 650;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      background: color-mix(in srgb, var(--bubble-in) 70%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    }

    .profile-nitro-trust.trust-high,
    .profile-nitro-trust.trust-very_high {
      color: #9fd4ff;
      border-color: color-mix(in srgb, #7ea2ff 35%, transparent);
      background: color-mix(in srgb, #7ea2ff 12%, transparent);
    }

    .profile-nitro-online {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      font-weight: 650;
      color: var(--muted);
    }

    .profile-nitro-online-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #5a6270;
    }

    .profile-nitro-online-dot.online {
      background: #2ecc71;
      box-shadow: 0 0 0 2px color-mix(in srgb, #2ecc71 25%, transparent);
    }

    .profile-nitro-reputation-ring {
      width: 100%;
      margin-top: 0;
      padding: 8px 0 4px;
      text-align: center;
      position: relative;
    }

    .profile-nitro-reputation-ring::before {
      content: "";
      position: absolute;
      left: 4%;
      right: 4%;
      top: 0;
      bottom: 8%;
      background: radial-gradient(ellipse 72% 68% at 50% 46%, var(--rep-glow), transparent 74%);
      pointer-events: none;
      opacity: 0.92;
      z-index: 0;
    }

    .profile-nitro-reputation-ring > * {
      position: relative;
      z-index: 1;
    }

    .profile-nitro-reputation-ring-hit {
      cursor: pointer;
      border: none;
      background: transparent;
      padding: 0;
      margin: 0;
      width: 100%;
      font: inherit;
      color: inherit;
    }

    .profile-nitro-reputation-ring-layout {
      display: grid;
      grid-template-columns: 1fr;
      align-items: center;
      justify-items: center;
      gap: 0;
    }

    .profile-nitro-reputation-ring-donut-wrap {
      grid-column: 1;
      grid-row: 1;
    }

    .profile-nitro-reputation-ring-donut {
      width: 168px;
      height: 168px;
      border-radius: 50%;
      padding: 8px;
      display: grid;
      place-items: center;
      margin: 0 auto;
      transition: transform 0.38s cubic-bezier(0.34, 1.35, 0.64, 1), box-shadow 0.38s ease, filter 0.38s ease;
      position: relative;
    }

    .profile-nitro-reputation-ring-donut::before {
      content: "";
      position: absolute;
      inset: 4px;
      border-radius: 50%;
      background: radial-gradient(circle at 50% 38%, color-mix(in srgb, #fff 10%, transparent), transparent 58%);
      pointer-events: none;
      z-index: 2;
    }

    .profile-nitro-reputation-ring-donut::after {
      content: "";
      position: absolute;
      inset: -10px;
      border-radius: 50%;
      background: radial-gradient(circle, var(--rep-glow), transparent 70%);
      opacity: 0.72;
      pointer-events: none;
      z-index: -1;
      transition: opacity 0.35s ease, transform 0.35s ease;
    }

    .profile-nitro-reputation-ring-hit:hover .profile-nitro-reputation-ring-donut,
    .profile-nitro-reputation-ring-hit:focus-visible .profile-nitro-reputation-ring-donut {
      transform: scale(1.04);
    }

    .profile-nitro-reputation-ring-hit:hover .profile-nitro-reputation-ring-donut::after,
    .profile-nitro-reputation-ring-hit:focus-visible .profile-nitro-reputation-ring-donut::after {
      opacity: 0.92;
      transform: scale(1.06);
    }

    .profile-nitro-reputation-ring.is-positive .profile-nitro-reputation-ring-donut {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #22c55e 22%, transparent),
        0 0 44px rgba(34, 197, 94, 0.28),
        0 0 72px rgba(34, 197, 94, 0.12);
    }

    .profile-nitro-reputation-ring.is-negative .profile-nitro-reputation-ring-donut {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #ef4444 22%, transparent),
        0 0 44px rgba(239, 68, 68, 0.28),
        0 0 72px rgba(239, 68, 68, 0.12);
    }

    .profile-nitro-reputation-ring.is-seed .profile-nitro-reputation-ring-donut {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #8b5cf6 20%, transparent),
        0 0 44px rgba(139, 92, 246, 0.26),
        0 0 68px rgba(34, 197, 94, 0.14);
    }

    .profile-nitro-card.is-premium .profile-nitro-reputation-ring {
      --rep-glow: rgba(245, 217, 139, 0.42);
    }

    .profile-nitro-card.is-premium .profile-nitro-reputation-ring.is-positive .profile-nitro-reputation-ring-donut,
    .profile-nitro-card.is-premium .profile-nitro-reputation-ring.is-seed .profile-nitro-reputation-ring-donut {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #f5d98b 38%, transparent),
        0 0 64px rgba(212, 160, 23, 0.44),
        0 0 112px rgba(212, 160, 23, 0.2),
        inset 0 0 36px rgba(212, 160, 23, 0.12);
      animation: profile-v101-rep-breathe 3.8s ease-in-out infinite;
    }

    .profile-nitro-card.is-premium .profile-nitro-reputation-ring-donut {
      width: 176px;
      height: 176px;
    }

    @keyframes profile-v101-rep-breathe {
      0%, 100% { filter: drop-shadow(0 0 8px rgba(212, 160, 23, 0.2)); }
      50% { filter: drop-shadow(0 0 18px rgba(212, 160, 23, 0.38)); }
    }

    .profile-nitro-card.tier-level2 .profile-nitro-reputation-ring.is-positive .profile-nitro-reputation-ring-donut {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #63b3ed 20%, transparent),
        0 0 38px rgba(99, 179, 237, 0.22),
        0 0 64px rgba(34, 197, 94, 0.1);
    }

    .profile-nitro-reputation-ring-hole {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background:
        radial-gradient(circle at 50% 28%, color-mix(in srgb, var(--panel) 82%, #121820), color-mix(in srgb, var(--panel) 96%, #0d1118));
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 2px;
      position: relative;
      border: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
      box-shadow: inset 0 8px 24px rgba(0, 0, 0, 0.28);
      z-index: 1;
    }

    .profile-nitro-reputation-ring-score {
      font-size: 32px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.04em;
      color: var(--text);
    }

    .profile-nitro-reputation-ring.is-positive .profile-nitro-reputation-ring-score {
      color: #86efac;
    }

    .profile-nitro-reputation-ring.is-negative .profile-nitro-reputation-ring-score {
      color: #fca5a5;
    }

    .profile-nitro-reputation-ring-score-label {
      font-size: 11px;
      font-weight: 650;
      color: var(--muted);
    }

    .profile-nitro-reputation-ring-seed {
      position: absolute;
      bottom: 20px;
      font-size: 20px;
      line-height: 1;
      opacity: 0.42;
      pointer-events: none;
    }

    .profile-nitro-reputation-ring:not(.is-empty) .profile-nitro-reputation-ring-seed {
      display: none;
    }

    .profile-nitro-reputation-ring-side {
      display: none !important;
    }

    .profile-nitro-reputation-ring-side--left {
      grid-column: 1;
      grid-row: 1;
    }

    .profile-nitro-reputation-ring-side--right {
      grid-column: 3;
      grid-row: 1;
    }

    .profile-nitro-reputation-ring-side-ic {
      font-size: 17px;
      line-height: 1;
    }

    .profile-nitro-reputation-ring-side-val {
      font-size: 17px;
      font-weight: 800;
      line-height: 1.1;
    }

    .profile-nitro-reputation-ring-side--left .profile-nitro-reputation-ring-side-val {
      color: #22c55e;
    }

    .profile-nitro-reputation-ring-side--right .profile-nitro-reputation-ring-side-val {
      color: #ef4444;
    }

    .profile-nitro-reputation-ring-side-lbl {
      font-size: 9px;
      font-weight: 650;
      color: var(--muted);
      line-height: 1.2;
      max-width: 74px;
    }

    .profile-nitro-reputation-ring-foot {
      display: none !important;
      margin-top: 8px;
      font-size: 11px;
      font-weight: 650;
      color: color-mix(in srgb, var(--text) 78%, var(--muted));
      line-height: 1.35;
    }

    .profile-nitro-reputation-ring.is-empty .profile-nitro-reputation-ring-side {
      opacity: 0.38;
    }

    .profile-nitro-reputation-ring-votes {
      margin-top: 8px;
      display: flex;
      justify-content: center;
      gap: 8px;
    }

    /* ===== PROFILE V15.2 — Reputation Card ===== */
    .profile-v152-rep-card {
      width: 100%;
      border-radius: 16px;
      border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
      background:
        linear-gradient(165deg, color-mix(in srgb, var(--bubble-in) 68%, transparent), color-mix(in srgb, var(--panel) 88%, transparent));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 7%, transparent) inset,
        0 16px 40px rgba(0, 0, 0, 0.24);
      padding: 14px 14px 12px;
      box-sizing: border-box;
    }

    .profile-nitro-card.is-premium .profile-v152-rep-card {
      border-color: color-mix(in srgb, #d4a017 28%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 9%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 14%, transparent),
        0 18px 44px rgba(0, 0, 0, 0.28);
    }

    .profile-v152-rep-hit {
      cursor: pointer;
      border: none;
      background: transparent;
      padding: 0;
      margin: 0;
      width: 100%;
      font: inherit;
      color: inherit;
      text-align: left;
    }

    .profile-v152-rep-hit:hover .profile-nitro-reputation-ring-donut,
    .profile-v152-rep-hit:focus-visible .profile-nitro-reputation-ring-donut {
      transform: scale(1.04);
    }

    .profile-v152-rep-hit:hover .profile-nitro-reputation-ring-donut::after,
    .profile-v152-rep-hit:focus-visible .profile-nitro-reputation-ring-donut::after {
      opacity: 0.92;
      transform: scale(1.06);
    }

    .profile-v152-rep-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 12px;
      padding: 0 2px;
    }

    .profile-v152-rep-title {
      font-size: 13px;
      font-weight: 750;
      letter-spacing: 0.02em;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    .profile-v152-rep-chevron {
      font-size: 18px;
      line-height: 1;
      color: color-mix(in srgb, var(--muted) 82%, var(--text));
      opacity: 0.72;
    }

    .profile-v152-rep-body {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 1px minmax(0, 1fr);
      align-items: center;
      gap: 0 12px;
      min-height: 152px;
    }

    .profile-v152-rep-left {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      min-width: 0;
    }

    .profile-v152-rep-divider {
      align-self: stretch;
      width: 1px;
      background: color-mix(in srgb, var(--border) 88%, transparent);
      opacity: 0.9;
    }

    .profile-v152-rep-status {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.01em;
      color: color-mix(in srgb, var(--text) 84%, var(--muted));
    }

    .profile-v152-rep-status.is-positive {
      color: #86efac;
    }

    .profile-v152-rep-status.is-negative {
      color: #fca5a5;
    }

    .profile-v152-rep-status.is-seed {
      color: color-mix(in srgb, #c4b5fd 88%, var(--muted));
    }

    .profile-v152-rep-status.is-neutral {
      color: color-mix(in srgb, #fbbf24 88%, var(--muted));
    }

    .profile-v152-rep-stats {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 14px;
      min-width: 0;
      padding: 4px 2px 4px 4px;
    }

    .profile-v152-rep-stat {
      display: grid;
      grid-template-columns: 28px 1fr;
      grid-template-rows: auto auto;
      column-gap: 10px;
      row-gap: 2px;
      align-items: center;
    }

    .profile-v152-rep-stat-ic {
      grid-row: 1 / span 2;
      font-size: 20px;
      line-height: 1;
      text-align: center;
    }

    .profile-v152-rep-stat-val {
      font-size: 22px;
      font-weight: 800;
      line-height: 1.05;
      letter-spacing: -0.03em;
      color: var(--text);
    }

    .profile-v152-rep-stat--pos .profile-v152-rep-stat-val {
      color: #86efac;
    }

    .profile-v152-rep-stat--neg .profile-v152-rep-stat-val {
      color: #fca5a5;
    }

    .profile-v152-rep-stat-lbl {
      font-size: 11px;
      font-weight: 650;
      line-height: 1.25;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
    }

    .profile-v152-rep-card .profile-nitro-reputation-ring-donut {
      width: 152px;
      height: 152px;
      padding: 7px;
    }

    .profile-nitro-card.is-premium .profile-v152-rep-card .profile-nitro-reputation-ring-donut {
      width: 156px;
      height: 156px;
    }

    .profile-v152-rep-card .profile-nitro-reputation-ring-score {
      font-size: 34px;
    }

    .profile-nitro-card.is-premium .profile-v152-rep-card .profile-nitro-reputation-ring-score {
      font-size: 36px;
    }

    .profile-nitro-reputation-ring:has(.profile-v152-rep-card) {
      padding: 10px 0 6px;
    }

    .profile-nitro-reputation-ring:has(.profile-v152-rep-card)::before {
      opacity: 1;
      left: 0;
      right: 0;
      top: -4%;
      bottom: -2%;
    }

    .profile-nitro-card.tier-level2 .profile-nitro-reputation-ring:has(.profile-v152-rep-card) {
      padding: 14px 0 8px;
    }

    /* ===== PROFILE V18 / V18.2 — Reference Match Pass ===== */
    #profileViewerModal.profile-ui-v18 .modal.modal--profile-viewer {
      width: min(1160px, 97vw);
    }

    #profileViewerModal.profile-ui-v18 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: minmax(320px, 360px) minmax(480px, 1fr);
      gap: 14px;
      max-width: 1140px;
      width: 100%;
      align-items: stretch;
    }

    #profileViewerModal.profile-ui-v18 .profile-viewer-layout.profile-nitro-layout.profile-v15-layout-premium {
      filter: none;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card {
      border-radius: 18px;
      border-width: 1px;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 14px 36px rgba(0, 0, 0, 0.22);
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium {
      border: 2px solid color-mix(in srgb, #d4a017 46%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 22%, transparent),
        0 16px 40px rgba(0, 0, 0, 0.26);
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium .profile-nitro-cover {
      filter: saturate(0.9) brightness(0.9);
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium .profile-nitro-name {
      text-shadow: none;
      color: #f8f0dc;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      animation: none;
      filter: none;
      inset: -6px;
      padding: 3px;
      background: linear-gradient(135deg, #fff8e8, #f5d98b, #d4a017, #c9a227);
      opacity: 1;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-cover {
      height: 52px !important;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.tier-level2 .profile-nitro-cover,
    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium .profile-nitro-cover {
      height: 56px !important;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-body {
      margin-top: -30px;
      gap: 5px;
      padding: 0 12px 8px;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-avatar-stage {
      width: 84px;
      height: 84px;
      margin-bottom: 2px;
      filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.28));
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium .profile-nitro-avatar-stage {
      filter: drop-shadow(0 10px 22px rgba(0, 0, 0, 0.28));
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-avatar-btn {
      width: 76px;
      height: 76px;
      font-size: 24px;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-name {
      font-size: 22px;
      line-height: 1.1;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 24px;
    }

    #profileViewerModal.profile-ui-v18 #profileNitroStatus,
    #profileViewerModal.profile-ui-v18 #profileNitroTags,
    #profileViewerModal.profile-ui-v18 #profileNitroInterestTags,
    #profileViewerModal.profile-ui-v18 #profileNitroBadges,
    #profileViewerModal.profile-ui-v18 #profileNitroMeta {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v18 #profileNitroMetrics:not(.profile-v18-quick-stats) {
      display: none !important;
    }

    .profile-v18-user-id {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 3px;
      margin-top: 2px;
      width: 100%;
    }

    .profile-v18-user-id-label {
      font-size: 10px;
      font-weight: 650;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
    }

    .profile-v18-user-id-row {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 5px 10px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 55%, transparent);
      cursor: pointer;
      font: inherit;
      color: inherit;
    }

    .profile-v18-user-id-row:hover {
      border-color: color-mix(in srgb, var(--border) 92%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 72%, transparent);
    }

    .profile-v18-user-id-val {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.02em;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
    }

    .profile-v18-user-id-copy {
      display: grid;
      place-items: center;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      opacity: 0.82;
    }

    .profile-v18-title-line {
      display: flex;
      justify-content: center;
      margin-top: 2px;
    }

    .profile-v18-title-badge {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 4px 12px;
      border-radius: 999px;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 70%, transparent);
    }

    .profile-v18-title-badge.is-premium {
      color: #f5d98b;
      border: 1.5px solid color-mix(in srgb, #d4a017 48%, transparent);
      background: color-mix(in srgb, #d4a017 16%, transparent);
      box-shadow: 0 0 0 1px color-mix(in srgb, #d4a017 12%, transparent);
    }

    .profile-v18-quick-stats {
      width: 100%;
      padding: 4px 2px 2px;
      margin-top: 0;
    }

    .profile-v18-quick-stats-line {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 4px 6px;
      font-size: 11px;
      font-weight: 650;
      line-height: 1.35;
      color: color-mix(in srgb, var(--muted) 92%, var(--text));
    }

    .profile-v18-quick-stats-sep {
      opacity: 0.55;
    }

    /* V18.2 reputation card */
    .profile-v182-rep-card {
      width: 100%;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
      background:
        linear-gradient(165deg, color-mix(in srgb, var(--bubble-in) 68%, transparent), color-mix(in srgb, var(--panel) 88%, transparent));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 7%, transparent) inset,
        0 14px 36px rgba(0, 0, 0, 0.22);
      padding: 12px 12px 10px;
      box-sizing: border-box;
    }

    .profile-v182-rep-hit {
      cursor: pointer;
      border: none;
      background: transparent;
      padding: 0;
      margin: 0;
      width: 100%;
      font: inherit;
      color: inherit;
      text-align: left;
    }

    .profile-v182-rep-head {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 10px;
      padding: 0 2px;
    }

    .profile-v182-rep-title {
      font-size: 13px;
      font-weight: 750;
      color: color-mix(in srgb, var(--text) 92%, var(--muted));
    }

    .profile-v182-rep-chevron {
      font-size: 18px;
      line-height: 1;
      color: color-mix(in srgb, var(--muted) 82%, var(--text));
      opacity: 0.72;
    }

    .profile-v182-rep-top {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      align-items: center;
      gap: 12px 14px;
      padding: 0 2px 8px;
    }

    .profile-v182-rep-ring-col {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .profile-v182-rep-donut {
      width: 112px !important;
      height: 112px !important;
      padding: 6px !important;
    }

    .profile-v182-rep-hole {
      min-height: 0;
    }

    .profile-v182-rep-hole .profile-nitro-reputation-ring-score,
    .profile-v182-rep-hole .profile-nitro-reputation-ring-score-label {
      display: none !important;
    }

    .profile-v182-rep-score-col {
      display: flex;
      flex-direction: column;
      gap: 4px;
      min-width: 0;
    }

    .profile-v182-rep-score {
      font-size: 36px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.04em;
      color: #86efac;
    }

    .profile-v182-rep-score-col.is-negative .profile-v182-rep-score {
      color: #fca5a5;
    }

    .profile-v182-rep-score-col.is-neutral .profile-v182-rep-score {
      color: #fbbf24;
    }

    .profile-v182-rep-score-col.is-seed .profile-v182-rep-score {
      color: color-mix(in srgb, #c4b5fd 92%, var(--text));
    }

    .profile-v182-rep-status {
      font-size: 13px;
      font-weight: 700;
      color: #86efac;
    }

    .profile-v182-rep-score-col.is-negative .profile-v182-rep-status {
      color: #fca5a5;
    }

    .profile-v182-rep-score-col.is-neutral .profile-v182-rep-status {
      color: #fbbf24;
    }

    .profile-v182-rep-score-col.is-seed .profile-v182-rep-status {
      color: color-mix(in srgb, #c4b5fd 88%, var(--muted));
    }

    .profile-v182-rep-stats {
      display: flex;
      flex-direction: column;
      gap: 8px;
      padding: 8px 2px 0;
      border-top: 1px solid color-mix(in srgb, var(--border) 68%, transparent);
    }

    .profile-v182-rep-stat-line {
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .profile-v182-rep-stat-ic {
      font-size: 18px;
      line-height: 1;
      width: 24px;
      text-align: center;
    }

    .profile-v182-rep-stat-val {
      font-size: 22px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.03em;
      color: var(--text);
    }

    .profile-v182-rep-stat-line--pos .profile-v182-rep-stat-val {
      color: #86efac;
    }

    .profile-v182-rep-stat-line--neg .profile-v182-rep-stat-val {
      color: #fca5a5;
    }

    .profile-v182-rep-stat-text {
      font-size: 12px;
      font-weight: 650;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
    }

    #profileViewerModal.profile-ui-v18 .profile-v12-showcase-frame {
      padding: 5px 6px 4px;
      border-radius: 12px;
      background: color-mix(in srgb, var(--bubble-in) 28%, transparent);
    }

    #profileViewerModal.profile-ui-v18 .profile-v11-identity-showcase {
      gap: 5px;
    }

    #profileViewerModal.profile-ui-v18 .profile-v13-showcase-tile {
      min-height: 44px;
      padding: 5px 4px 4px;
      border-radius: 10px;
      gap: 3px;
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v18 .profile-v13-showcase-tile::before {
      display: none;
    }

    #profileViewerModal.profile-ui-v18 .profile-v13-showcase-tile-ic {
      font-size: 13px;
      margin-top: 0;
    }

    #profileViewerModal.profile-ui-v18 .profile-v13-showcase-tile-kind {
      font-size: 7px;
      letter-spacing: 0.1em;
    }

    #profileViewerModal.profile-ui-v18 .profile-v13-showcase-tile-name {
      font-size: 9px;
      -webkit-line-clamp: 1;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-panels {
      gap: 10px;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-panel {
      padding: 12px 14px 10px;
      border-radius: 14px;
    }

    #profileViewerModal.profile-ui-v18 #profileViewerAbout {
      padding: 12px 14px;
    }

    #profileViewerModal.profile-ui-v18 .profile-nitro-about-quote {
      font-size: 14px;
      line-height: 1.48;
    }

    #profileViewerModal.profile-ui-v18 #profileViewerFeaturedProject {
      padding: 0;
      border: none;
      background: transparent;
      box-shadow: none;
    }

    .profile-v182-featured-hero {
      display: grid;
      grid-template-columns: minmax(240px, 46%) minmax(0, 1fr);
      gap: 0;
      width: 100%;
      min-height: 168px;
      padding: 0;
      border-radius: 16px;
      border: 1px solid color-mix(in srgb, var(--border) 68%, transparent);
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      overflow: hidden;
      text-align: left;
      cursor: pointer;
      color: inherit;
      font: inherit;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset,
        0 16px 40px rgba(0, 0, 0, 0.2);
      transition: transform 0.22s ease, box-shadow 0.22s ease;
    }

    .profile-v182-featured-hero:hover {
      transform: translateY(-1px);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 20px 44px rgba(0, 0, 0, 0.26);
    }

    .profile-v182-featured-banner {
      position: relative;
      min-height: 168px;
      background: linear-gradient(145deg, #1e3a5f 0%, #0f172a 55%, #312e81 100%);
      display: grid;
      place-items: center;
      overflow: hidden;
    }

    .profile-v182-featured-banner--default {
      background: linear-gradient(145deg, #1e3a5f 0%, #0f172a 55%, #312e81 100%);
    }

    .profile-v182-featured-banner img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .profile-v182-featured-banner-fallback {
      font-size: 28px;
      font-weight: 800;
      color: color-mix(in srgb, #fff 82%, transparent);
      letter-spacing: 0.06em;
    }

    .profile-v182-featured-content {
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 6px;
      padding: 18px 20px 16px;
      min-width: 0;
    }

    .profile-v182-featured-kicker {
      font-size: 9px;
      font-weight: 750;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 86%, var(--text));
    }

    .profile-v182-featured-title {
      font-size: 20px;
      font-weight: 800;
      letter-spacing: -0.02em;
      line-height: 1.15;
      color: var(--text);
    }

    .profile-v182-featured-desc {
      font-size: 13px;
      line-height: 1.45;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .profile-v182-featured-meta {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px 12px;
      margin-top: 4px;
      font-size: 12px;
      font-weight: 650;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
    }

    .profile-v182-featured-status {
      display: inline-flex;
      align-items: center;
      gap: 5px;
    }

    .profile-v182-featured-status-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #5a6270;
    }

    .profile-v182-featured-status.is-active .profile-v182-featured-status-dot,
    .profile-v182-featured-status.is-online .profile-v182-featured-status-dot {
      background: #22c55e;
      box-shadow: 0 0 0 2px color-mix(in srgb, #22c55e 24%, transparent);
    }

    .profile-v182-featured-status.is-growing .profile-v182-featured-status-dot {
      background: #fbbf24;
    }

    #profileViewerModal.profile-ui-v18 .profile-v182-channels-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    #profileViewerModal.profile-ui-v18 .profile-v182-channels-grid .profile-nitro-project-card {
      min-height: 88px;
    }

    /* ===== PROFILE V19 — Messenger social card (reference-first) ===== */
    #profileViewerModal.profile-ui-v19 .modal.modal--profile-viewer {
      max-width: min(1160px, calc(100vw - 32px));
    }

    #profileViewerModal.profile-ui-v19 .profile-viewer-layout.profile-nitro-layout {
      max-width: 1140px;
      margin: 0 auto;
      gap: 14px;
    }

    #profileViewerModal.profile-ui-v19 #profileNitroIdentityShowcase,
    #profileViewerModal.profile-ui-v19 .profile-v11-identity-showcase,
    #profileViewerModal.profile-ui-v19 .profile-v12-showcase-frame,
    #profileViewerModal.profile-ui-v19 .profile-v13-showcase-tile,
    #profileViewerModal.profile-ui-v19 .profile-v14-featured-achievement-rarity,
    #profileViewerModal.profile-ui-v19 .profile-nitro-showcase-rarity {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v19 .profile-nitro-card.is-premium {
      border-width: 1px;
      box-shadow: 0 0 0 1px color-mix(in srgb, #f5c542 22%, transparent);
    }

    #profileViewerModal.profile-ui-v19 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      opacity: 0.55;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-identity-line {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      align-items: center;
      gap: 4px 6px;
      margin-top: 2px;
      font-size: 11px;
      font-weight: 600;
      line-height: 1.35;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      text-align: center;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-identity-sep {
      opacity: 0.45;
    }

    #profileViewerModal.profile-ui-v19 .profile-v182-rep-card {
      margin-top: 6px;
      flex: 1 1 auto;
    }

    #profileViewerModal.profile-ui-v19 .profile-v182-rep-donut {
      width: 120px !important;
      height: 120px !important;
    }

    #profileViewerModal.profile-ui-v19 .profile-v182-rep-score {
      font-size: 34px !important;
    }

    #profileViewerModal.profile-ui-v19 #profileNitroMetrics.profile-v19-metrics-grid {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      width: 100%;
      margin-top: 8px;
      padding-top: 8px;
      border-top: 1px solid color-mix(in srgb, var(--border) 24%, transparent);
      opacity: 1;
    }

    #profileViewerModal.profile-ui-v19 .profile-nitro-metric {
      min-height: 58px;
      padding: 8px 10px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 36%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 28%, transparent);
    }

    #profileViewerModal.profile-ui-v19 .profile-nitro-metric-val {
      font-size: 18px;
      font-weight: 800;
      color: var(--text);
    }

    #profileViewerModal.profile-ui-v19 .profile-nitro-metric-lbl {
      font-size: 9px;
      letter-spacing: 0.06em;
      text-transform: none;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-card {
      min-height: 64px;
      max-width: none;
      padding: 8px 6px;
      border-radius: 12px;
      border-color: color-mix(in srgb, var(--border) 70%, transparent);
      box-shadow: none;
      gap: 4px;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-frame {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      border-color: color-mix(in srgb, var(--border) 55%, transparent);
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-ic {
      font-size: 14px;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-name {
      font-size: 9px;
      font-weight: 600;
      line-height: 1.2;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v19 .profile-v19-achievements-panel .profile-nitro-showcase-card--mythic {
      border-color: color-mix(in srgb, var(--border) 70%, transparent);
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-user-info-list {
      list-style: none;
      margin: 0;
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    #profileViewerModal.profile-ui-v19 .profile-v19-user-info-item {
      display: flex;
      align-items: flex-start;
      gap: 8px;
      font-size: 13px;
      line-height: 1.35;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    #profileViewerModal.profile-ui-v19 #profileViewerV2Sections {
      display: flex;
      flex-direction: column;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerAchievements:not(.hidden) {
      order: 1;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerAbout:not(.hidden) {
      order: 2;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerMemberSince:not(.hidden) {
      order: 3;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerFeaturedProject:not(.hidden) {
      order: 4;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerChannelsList:not(.hidden) {
      order: 5;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerSocialPills:not(.hidden) {
      order: 6;
    }

    #profileViewerModal.profile-ui-v19 #profileViewerFeaturedProject .profile-v9-featured-card {
      width: 100%;
    }

    #profileViewerModal.profile-ui-v19 .profile-v182-featured-hero {
      display: none !important;
    }

    /* ===== PROFILE V20 — Social passport rebuild ===== */
    #profileViewerModal.profile-ui-v20 .modal.modal--profile-viewer {
      width: min(1200px, calc(100vw - 40px));
      max-width: 1200px;
      max-height: min(860px, calc(100vh - 40px));
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v20 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 40% 60%;
      max-width: none;
      width: 100%;
      gap: 14px;
      margin: 0;
      align-items: stretch;
      min-height: 0;
      max-height: calc(100% - 52px);
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v20 .profile-viewer-left {
      border: 1px solid color-mix(in srgb, var(--border) 48%, transparent);
      border-radius: 20px;
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      padding: 0;
      min-height: 0;
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v20 .profile-viewer-right {
      min-height: 0;
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-panels {
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-height: 0;
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v20 #profileNitroIdentityShowcase,
    #profileViewerModal.profile-ui-v20 .profile-v11-identity-showcase,
    #profileViewerModal.profile-ui-v20 .profile-v12-showcase-frame,
    #profileViewerModal.profile-ui-v20 .profile-v13-showcase-tile,
    #profileViewerModal.profile-ui-v20 .profile-nitro-showcase-rarity,
    #profileViewerModal.profile-ui-v20 #profileViewerMemberSince {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-card {
      border: none;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      min-height: 0;
      height: 100%;
      display: flex;
      flex-direction: column;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-card::before,
    #profileViewerModal.profile-ui-v20 .profile-nitro-card::after {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-cover {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-card.is-premium {
      box-shadow: none;
      border: none;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      opacity: 0.45;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-body {
      flex: 1;
      display: flex;
      flex-direction: column;
      margin-top: 0;
      padding: 18px 16px 14px;
      gap: 8px;
      min-height: 0;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-avatar-stage {
      width: 72px;
      height: 72px;
      margin: 0 auto 4px;
      filter: none;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-avatar-btn {
      width: 64px;
      height: 64px;
      font-size: 22px;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-name {
      font-size: 20px;
      text-align: center;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-status-line {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 4px 8px;
      font-size: 11px;
      font-weight: 600;
      line-height: 1.35;
      color: color-mix(in srgb, var(--muted) 86%, var(--text));
      text-align: center;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-status-sep {
      opacity: 0.4;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-status-badge.is-premium {
      color: color-mix(in srgb, #e8b84a 88%, #fff);
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-host {
      flex: 1 1 50%;
      min-height: 260px;
      display: flex;
      align-items: stretch;
      margin-top: 4px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-passport {
      flex: 1;
      display: flex;
      flex-direction: column;
      border-radius: 16px;
      border: 1px solid color-mix(in srgb, var(--border) 42%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 22%, transparent);
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-hit {
      flex: 1;
      display: flex;
      flex-direction: column;
      justify-content: center;
      padding: 16px 14px 12px;
      cursor: pointer;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-hero {
      display: flex;
      align-items: center;
      gap: 14px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-donut {
      width: 132px !important;
      height: 132px !important;
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-hole {
      width: 78px;
      height: 78px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col {
      display: flex;
      flex-direction: column;
      gap: 4px;
      min-width: 0;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score {
      font-size: 40px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.03em;
      color: #22c55e;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col.is-negative .profile-v20-rep-score {
      color: #ef4444;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col.is-neutral .profile-v20-rep-score {
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col.is-seed .profile-v20-rep-score {
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-status {
      font-size: 13px;
      font-weight: 600;
      line-height: 1.25;
      color: #22c55e;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col.is-negative .profile-v20-rep-status {
      color: #ef4444;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col.is-neutral .profile-v20-rep-status,
    #profileViewerModal.profile-ui-v20 .profile-v20-rep-score-col.is-seed .profile-v20-rep-status {
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-stats {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-top: 14px;
      padding-top: 12px;
      border-top: 1px solid color-mix(in srgb, var(--border) 28%, transparent);
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-rep-stat {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.2;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
    }

    #profileViewerModal.profile-ui-v20 #profileNitroMetrics.profile-v20-social-grid {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      flex-shrink: 0;
      margin-top: 0;
      padding-top: 0;
      border-top: none;
      opacity: 1;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-metric {
      min-height: 54px;
      padding: 8px 10px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 34%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 20%, transparent);
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-metric-val {
      font-size: 17px;
      font-weight: 800;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-metric-lbl {
      font-size: 9px;
      text-transform: none;
      letter-spacing: 0.04em;
    }

    #profileViewerModal.profile-ui-v20 #profileViewerAbout:not(.hidden) {
      order: 1;
    }

    #profileViewerModal.profile-ui-v20 #profileViewerFeaturedProject:not(.hidden) {
      order: 2;
    }

    #profileViewerModal.profile-ui-v20 #profileViewerChannelsList:not(.hidden) {
      order: 3;
    }

    #profileViewerModal.profile-ui-v20 #profileViewerSocialPills:not(.hidden) {
      order: 4;
    }

    #profileViewerModal.profile-ui-v20 #profileViewerAchievements:not(.hidden) {
      order: 5;
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-panel {
      padding: 10px 12px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 14%, transparent);
    }

    #profileViewerModal.profile-ui-v20 .profile-nitro-panel-title {
      font-size: 9px;
      margin-bottom: 6px;
    }

    #profileViewerModal.profile-ui-v20 #profileViewerFeaturedProject .profile-v9-featured-card {
      width: 100%;
      min-height: 84px;
      padding: 12px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 44%, transparent);
      background: color-mix(in srgb, var(--panel) 70%, transparent);
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-channels-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-channels-grid .profile-nitro-project-card {
      min-height: 76px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-card {
      min-height: 58px;
      max-width: none;
      padding: 6px 4px;
      border-radius: 10px;
      border-color: color-mix(in srgb, var(--border) 65%, transparent);
      box-shadow: none;
      gap: 3px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-frame {
      width: 24px;
      height: 24px;
      border-radius: 7px;
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-ic {
      font-size: 12px;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-name {
      font-size: 8px;
      font-weight: 600;
    }

    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v20 .profile-v20-achievements-panel .profile-nitro-showcase-card--mythic {
      border-color: color-mix(in srgb, var(--border) 65%, transparent);
      box-shadow: none;
    }

    /* ===== PROFILE V21 — Pixel match (V18.3 reference) ===== */
    #profileViewerModal.profile-ui-v21 .modal.modal--profile-viewer {
      width: min(1240px, calc(100vw - 32px));
      max-width: 1240px;
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v21 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 40% 60%;
      gap: 16px;
      max-width: 1200px;
      width: 100%;
      margin: 0 auto;
      align-items: stretch;
    }

    #profileViewerModal.profile-ui-v21 #profileNitroIdentityShowcase,
    #profileViewerModal.profile-ui-v21 .profile-v11-identity-showcase,
    #profileViewerModal.profile-ui-v21 .profile-v12-showcase-frame,
    #profileViewerModal.profile-ui-v21 .profile-v13-showcase-tile,
    #profileViewerModal.profile-ui-v21 .profile-nitro-showcase-rarity,
    #profileViewerModal.profile-ui-v21 #profileViewerMemberSince,
    #profileViewerModal.profile-ui-v21 #profileNitroStatus,
    #profileViewerModal.profile-ui-v21 #profileNitroTags,
    #profileViewerModal.profile-ui-v21 #profileNitroInterestTags,
    #profileViewerModal.profile-ui-v21 #profileNitroBadges,
    #profileViewerModal.profile-ui-v21 #profileNitroMeta {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-card {
      border-radius: 18px;
      border-width: 1px;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 14px 36px rgba(0, 0, 0, 0.22);
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-card.is-premium {
      border: 2px solid color-mix(in srgb, #d4a017 46%, var(--border));
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset,
        0 0 0 1px color-mix(in srgb, #d4a017 22%, transparent),
        0 16px 40px rgba(0, 0, 0, 0.26);
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-card.is-premium .profile-nitro-name {
      color: #f8f0dc;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      animation: none;
      inset: -7px;
      padding: 3px;
      background: linear-gradient(135deg, #fff8e8, #f5d98b, #d4a017, #c9a227);
      opacity: 1;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-cover {
      height: 72px !important;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-card.tier-level2 .profile-nitro-cover,
    #profileViewerModal.profile-ui-v21 .profile-nitro-card.is-premium .profile-nitro-cover {
      height: 76px !important;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-body {
      margin-top: -42px;
      gap: 6px;
      padding: 0 14px 12px;
      display: flex;
      flex-direction: column;
      min-height: 0;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-avatar-stage {
      width: 128px;
      height: 128px;
      margin: 0 auto 4px;
      filter: drop-shadow(0 12px 28px rgba(0, 0, 0, 0.32));
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-avatar-btn {
      width: 120px;
      height: 120px;
      font-size: 32px;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-name {
      font-size: 24px;
      line-height: 1.1;
      text-align: center;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 26px;
    }

    #profileViewerModal.profile-ui-v21 #profileNitroRep {
      flex: 1 1 auto;
      min-height: 0;
      margin-top: 4px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-card {
      min-height: 188px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-body {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 14px 18px;
      align-items: start;
      padding: 0 2px 4px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-donut {
      width: 168px !important;
      height: 168px !important;
      padding: 7px !important;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-hole {
      min-height: 0;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-hole .profile-nitro-reputation-ring-score,
    #profileViewerModal.profile-ui-v21 .profile-v21-rep-hole .profile-nitro-reputation-ring-score-label {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side {
      display: flex;
      flex-direction: column;
      gap: 6px;
      padding-top: 10px;
      min-width: 0;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-score {
      font-size: 42px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.04em;
      color: #86efac;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side.is-negative .profile-v21-rep-score {
      color: #fca5a5;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side.is-neutral .profile-v21-rep-score {
      color: #fbbf24;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side.is-seed .profile-v21-rep-score {
      color: color-mix(in srgb, #c4b5fd 92%, var(--text));
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-status {
      font-size: 14px;
      font-weight: 700;
      color: #86efac;
      margin-bottom: 4px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side.is-negative .profile-v21-rep-status {
      color: #fca5a5;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side.is-neutral .profile-v21-rep-status {
      color: #fbbf24;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-side.is-seed .profile-v21-rep-status {
      color: color-mix(in srgb, #c4b5fd 88%, var(--muted));
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-stat {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 15px;
      font-weight: 650;
      line-height: 1.2;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-rep-stat-ic {
      font-size: 18px;
      line-height: 1;
      width: 22px;
      text-align: center;
    }

    #profileViewerModal.profile-ui-v21 #profileNitroMetrics.profile-v21-social-grid {
      display: grid !important;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
      flex-shrink: 0;
      margin-top: 8px;
      opacity: 1;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-metric {
      min-height: 56px;
      padding: 8px 10px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 36%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 24%, transparent);
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-metric-val {
      font-size: 18px;
      font-weight: 800;
    }

    #profileViewerModal.profile-ui-v21 #profileViewerV2Sections {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-panel,
    #profileViewerModal.profile-ui-v21 .profile-nitro-panels .profile-v2-block {
      padding: 12px 14px 10px;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-panel-title {
      margin-bottom: 8px;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-panel--social-tail {
      padding-top: 8px;
      margin-top: 0;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-social-stack {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 8px;
    }

    #profileViewerModal.profile-ui-v21 .profile-nitro-social-btn {
      padding: 8px 10px;
      font-size: 12px;
    }

    #profileViewerModal.profile-ui-v21 #profileViewerAbout:not(.hidden) {
      order: 1;
    }

    #profileViewerModal.profile-ui-v21 #profileViewerFeaturedProject:not(.hidden) {
      order: 2;
      padding: 0;
      border: none;
      background: transparent;
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v21 #profileViewerChannelsList:not(.hidden) {
      order: 3;
    }

    #profileViewerModal.profile-ui-v21 #profileViewerSocialPills:not(.hidden) {
      order: 4;
    }

    #profileViewerModal.profile-ui-v21 #profileViewerAchievements:not(.hidden) {
      order: 5;
    }

    #profileViewerModal.profile-ui-v21 .profile-v182-featured-hero {
      min-height: 220px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v182-featured-banner {
      min-height: 220px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-channels-grid {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-channels-grid .profile-nitro-project-card {
      min-height: 78px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-card {
      min-height: 58px;
      max-width: none;
      padding: 6px 4px;
      border-radius: 10px;
      border-color: color-mix(in srgb, var(--border) 65%, transparent);
      box-shadow: none;
      gap: 3px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-frame {
      width: 24px;
      height: 24px;
      border-radius: 7px;
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-ic {
      font-size: 12px;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-name {
      font-size: 8px;
      font-weight: 600;
    }

    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v21 .profile-v21-achievements-panel .profile-nitro-showcase-card--mythic {
      border-color: color-mix(in srgb, var(--border) 65%, transparent);
      box-shadow: none;
    }

    /* ===== PROFILE V22 — Flat reference rebuild ===== */

    #profileViewerModal.profile-ui-v22 .modal.modal--profile-viewer {
      width: min(1180px, calc(100vw - 32px));
      max-width: 1180px;
      gap: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 35% 65%;
      gap: 0;
      max-width: 100%;
      width: 100%;
      margin: 0;
      align-items: stretch;
    }

    /* Hide all decorative gaming elements */
    #profileViewerModal.profile-ui-v22 #profileNitroIdentityShowcase,
    #profileViewerModal.profile-ui-v22 .profile-v11-identity-showcase,
    #profileViewerModal.profile-ui-v22 .profile-v12-showcase-frame,
    #profileViewerModal.profile-ui-v22 .profile-v13-showcase-tile,
    #profileViewerModal.profile-ui-v22 .profile-nitro-showcase-rarity,
    #profileViewerModal.profile-ui-v22 #profileViewerMemberSince,
    #profileViewerModal.profile-ui-v22 #profileNitroStatus,
    #profileViewerModal.profile-ui-v22 #profileNitroTags,
    #profileViewerModal.profile-ui-v22 #profileNitroInterestTags,
    #profileViewerModal.profile-ui-v22 #profileNitroBadges,
    #profileViewerModal.profile-ui-v22 #profileNitroMeta,
    #profileViewerModal.profile-ui-v22 .profile-nitro-rep-highlight {
      display: none !important;
    }

    /* Left column: transparent, no card-in-card */
    #profileViewerModal.profile-ui-v22 .profile-nitro-card {
      border: none !important;
      background: none !important;
      background-color: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      padding: 0 !important;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-card::before,
    #profileViewerModal.profile-ui-v22 .profile-nitro-card::after {
      display: none !important;
    }

    /* Right column separator */
    #profileViewerModal.profile-ui-v22 .profile-viewer-right {
      border-left: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
      padding: 24px 28px;
    }

    /* Left column inner spacing */
    #profileViewerModal.profile-ui-v22 .profile-viewer-left {
      border: none !important;
      background: transparent !important;
      box-shadow: none !important;
      padding: 0 !important;
      border-radius: 0 !important;
    }

    #profileViewerModal.profile-ui-v22 #profileNitroCard,
    #profileViewerModal.profile-ui-v22 .profile-viewer-left > * {
      border: none !important;
      background: transparent !important;
      box-shadow: none !important;
    }

    /* NO cover */
    #profileViewerModal.profile-ui-v22 .profile-nitro-cover {
      display: none !important;
    }

    /* Left column body: flat stack */
    #profileViewerModal.profile-ui-v22 .profile-nitro-body {
      margin-top: 0;
      padding: 24px 20px 20px;
      gap: 0;
      display: flex;
      flex-direction: column;
    }

    /* Avatar: centered, modest size, thin ring only */
    #profileViewerModal.profile-ui-v22 .profile-nitro-avatar-stage {
      width: 100px;
      height: 100px;
      margin: 0 auto 12px;
      filter: none;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-avatar-btn {
      width: 90px;
      height: 90px;
      font-size: 26px;
    }

    /* Strip animated rainbow ring — premium gets thin static gold ring */
    #profileViewerModal.profile-ui-v22 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      animation: none;
      inset: -4px;
      padding: 2px;
      background: #c9a227;
      opacity: 0.75;
      filter: none;
    }

    /* Non-premium: no ring */
    #profileViewerModal.profile-ui-v22 .profile-nitro-card:not(.is-premium) .profile-nitro-avatar-ring::before {
      display: none;
    }

    /* Name */
    #profileViewerModal.profile-ui-v22 .profile-nitro-name {
      font-size: 20px;
      font-weight: 700;
      text-align: center;
      line-height: 1.2;
      margin-bottom: 4px;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-card.is-premium .profile-nitro-name {
      color: var(--text);
    }

    /* Premium badge: lowercase feel, reference style */
    #profileViewerModal.profile-ui-v22 .profile-v18-title-badge.is-premium {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.04em;
      text-transform: lowercase;
      padding: 3px 10px;
      border-radius: 999px;
    }

    /* User ID: small, secondary */
    #profileViewerModal.profile-ui-v22 #profileNitroUserId {
      margin-top: 6px;
      margin-bottom: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-v18-user-id-row {
      font-size: 11px;
      opacity: 0.55;
      justify-content: center;
    }

    /* Reputation: flat section, no nested card */
    #profileViewerModal.profile-ui-v22 .profile-v22-rep-host,
    #profileViewerModal.profile-ui-v22 #profileNitroRep {
      flex: none;
      margin-top: 18px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-block {
      padding: 14px 0 12px;
      border-top: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-header {
      display: flex;
      align-items: center;
      justify-content: space-between;
      margin-bottom: 12px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-title {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--muted);
      opacity: 0.7;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-chevron {
      font-size: 16px;
      color: var(--muted);
      opacity: 0.5;
      cursor: pointer;
      line-height: 1;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-body {
      display: flex;
      align-items: center;
      gap: 16px;
      cursor: pointer;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-ring-wrap {
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-donut {
      width: 100px;
      height: 100px;
      border-radius: 50%;
      padding: 7px;
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-hole {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background: var(--modal, #1a1a1f);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-reputation-ring-seed {
      font-size: 18px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-score {
      font-size: 32px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.02em;
      color: #22c55e;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side.is-negative .profile-v22-rep-score { color: #ef4444; }
    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side.is-neutral .profile-v22-rep-score { color: color-mix(in srgb, var(--muted) 90%, transparent); }
    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side.is-seed .profile-v22-rep-score { color: color-mix(in srgb, var(--muted) 70%, transparent); }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-status {
      font-size: 12px;
      font-weight: 600;
      color: #22c55e;
      margin-bottom: 4px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side.is-negative .profile-v22-rep-status { color: #ef4444; }
    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side.is-neutral .profile-v22-rep-status { color: var(--muted); }
    #profileViewerModal.profile-ui-v22 .profile-v22-rep-side.is-seed .profile-v22-rep-status { color: var(--muted); }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-stats {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-stat {
      font-size: 12px;
      color: color-mix(in srgb, var(--text) 70%, var(--muted));
      display: flex;
      align-items: center;
      gap: 5px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-rep-voters {
      font-size: 11px;
      color: var(--muted);
      opacity: 0.75;
    }

    /* Social stats: flat row, no borders */
    #profileViewerModal.profile-ui-v22 .profile-v22-stats-row {
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 0;
      margin-top: 16px;
      padding-top: 14px;
      border-top: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-stat {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      padding: 6px 8px 6px 0;
      gap: 1px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-stat-ic {
      font-size: 13px;
      line-height: 1;
      opacity: 0.55;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-stat-val {
      font-size: 17px;
      font-weight: 700;
      line-height: 1.1;
      color: var(--text);
      letter-spacing: -0.01em;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-stat-lbl {
      font-size: 10px;
      color: var(--muted);
      opacity: 0.7;
    }

    /* RIGHT COLUMN sections: no outer panel borders, spacing only */
    #profileViewerModal.profile-ui-v22 #profileViewerV2Sections {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-panel,
    #profileViewerModal.profile-ui-v22 .profile-nitro-panels .profile-v2-block {
      border: none !important;
      background: transparent !important;
      box-shadow: none !important;
      backdrop-filter: none !important;
      padding: 0 0 20px;
      border-radius: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-panel + .profile-nitro-panel,
    #profileViewerModal.profile-ui-v22 .profile-v2-block + .profile-v2-block,
    #profileViewerModal.profile-ui-v22 section + section {
      border-top: 1px solid color-mix(in srgb, var(--border) 25%, transparent);
      padding-top: 18px;
    }

    #profileViewerModal.profile-ui-v22 #profileViewerAbout:not(.hidden) { order: 1; }
    #profileViewerModal.profile-ui-v22 #profileViewerFeaturedProject:not(.hidden) { order: 2; }
    #profileViewerModal.profile-ui-v22 #profileViewerChannelsList:not(.hidden) { order: 3; }
    #profileViewerModal.profile-ui-v22 #profileViewerAchievements:not(.hidden) { order: 4; }
    #profileViewerModal.profile-ui-v22 #profileViewerSocialPills:not(.hidden) { order: 5; }

    /* Section titles: clean, not uppercase-heavy */
    #profileViewerModal.profile-ui-v22 .profile-nitro-panel-title {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--muted);
      opacity: 0.6;
      margin: 0 0 10px;
    }

    /* About: no decorative quotes */
    #profileViewerModal.profile-ui-v22 .profile-nitro-about-quote::before,
    #profileViewerModal.profile-ui-v22 .profile-nitro-about-quote {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-about-hero-inner {
      padding: 0;
      background: transparent;
      border: none;
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-about-text {
      font-size: 14px;
      line-height: 1.6;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    /* Featured channel: reference style */
    #profileViewerModal.profile-ui-v22 .profile-v22-featured-card {
      display: flex;
      align-items: center;
      gap: 14px;
      width: 100%;
      background: color-mix(in srgb, var(--bubble-in) 35%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 40%, transparent);
      border-radius: 14px;
      padding: 12px;
      cursor: pointer;
      text-align: left;
      transition: background 0.15s;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-card:hover {
      background: color-mix(in srgb, var(--bubble-in) 55%, transparent);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-thumb {
      width: 88px;
      height: 88px;
      border-radius: 10px;
      flex-shrink: 0;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      background: color-mix(in srgb, var(--accent) 40%, #1a1a2e);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-thumb img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-thumb-fallback {
      font-size: 22px;
      font-weight: 800;
      color: rgba(255,255,255,0.7);
      font-family: inherit;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-info {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 3px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-title {
      font-size: 16px;
      font-weight: 700;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-desc {
      font-size: 12px;
      color: var(--muted);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-meta {
      display: flex;
      align-items: center;
      gap: 10px;
      margin-top: 4px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-subs {
      font-size: 12px;
      color: var(--muted);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-status {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-status.is-active { color: #22c55e; }
    #profileViewerModal.profile-ui-v22 .profile-v22-featured-status.is-growing { color: #f59e0b; }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: currentColor;
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-featured-arrow {
      font-size: 18px;
      color: var(--muted);
      opacity: 0.4;
      flex-shrink: 0;
    }

    /* Channels: horizontal row */
    #profileViewerModal.profile-ui-v22 .profile-v22-channels-list {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px 6px;
      border-radius: 10px;
      background: transparent;
      cursor: pointer;
      width: 100%;
      text-align: left;
      transition: background 0.12s;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-row:hover {
      background: color-mix(in srgb, var(--bubble-in) 40%, transparent);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-avatar {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--accent) 35%, #1e1e2e);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 700;
      color: rgba(255,255,255,0.7);
      flex-shrink: 0;
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-body {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 1px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-name {
      font-size: 13px;
      font-weight: 600;
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-meta {
      font-size: 11px;
      color: var(--muted);
      opacity: 0.7;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--muted) 40%, transparent);
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-ch-dot.is-active {
      background: #22c55e;
    }

    /* Achievements: visible but compact */
    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(4, minmax(0, 1fr));
      gap: 8px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-card {
      min-height: 72px;
      max-width: none;
      padding: 10px 6px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 45%, transparent);
      box-shadow: none;
      gap: 5px;
      background: color-mix(in srgb, var(--bubble-in) 30%, transparent);
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-frame {
      width: 28px;
      height: 28px;
      border-radius: 8px;
      box-shadow: none;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-ic {
      font-size: 15px;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-name {
      font-size: 9px;
      font-weight: 600;
      text-align: center;
    }

    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v22 .profile-v22-achievements-panel .profile-nitro-showcase-card--mythic {
      border-color: color-mix(in srgb, var(--border) 45%, transparent);
      box-shadow: none;
    }

    /* Social links: neutral buttons, no brand borders */
    #profileViewerModal.profile-ui-v22 .profile-nitro-social-stack {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn {
      padding: 9px 12px;
      border-color: color-mix(in srgb, var(--border) 55%, transparent) !important;
      font-size: 13px;
    }

    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn--youtube,
    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn--twitch,
    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn--discord,
    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn--telegram,
    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn--github,
    #profileViewerModal.profile-ui-v22 .profile-nitro-social-btn--tiktok {
      border-color: color-mix(in srgb, var(--border) 55%, transparent) !important;
    }

    /* No scroll on modal */
    #profileViewerModal.profile-ui-v22 .modal.modal--profile-viewer {
      overflow: visible;
    }

    #profileViewerModal.profile-ui-v22 .profile-viewer-right {
      overflow-y: auto;
      max-height: calc(95vh - 80px);
    }

    #profileViewerModal.profile-ui-v22 .profile-viewer-left {
      overflow-y: auto;
      max-height: calc(95vh - 80px);
    }

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V23 — Social Passport
       Hierarchy: Who → Trust → Content → Activity → Find
    ═══════════════════════════════════════════════════════════════ */

    /* ── Modal shell ── */
    #profileViewerModal.profile-ui-v23 .modal.modal--profile-viewer {
      width: min(1120px, calc(100vw - 32px));
      max-width: 1120px;
      overflow: visible;
      gap: 0;
    }

    #profileViewerModal.profile-ui-v23 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 300px 1fr;
      gap: 0;
      max-width: 100%;
    }

    /* ── Left column: not a card, just a column ── */
    #profileViewerModal.profile-ui-v23 .profile-viewer-left {
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      padding: 28px 20px 24px;
      overflow-y: auto;
      max-height: calc(95vh - 80px);
      width: 300px;
      min-width: 280px;
      max-width: 320px;
      flex-shrink: 0;
    }

    /* Reset body margin-top that normally overlaps a cover banner */
    #profileViewerModal.profile-ui-v23 .profile-nitro-body {
      margin-top: 0 !important;
      padding: 0 !important;
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
    }

    /* Suppress legacy card wrapper entirely */
    #profileViewerModal.profile-ui-v23 .profile-nitro-card {
      background: transparent !important;
      background-color: transparent !important;
      background-image: none !important;
      border: none !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      padding: 0 !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-card::before,
    #profileViewerModal.profile-ui-v23 .profile-nitro-card::after {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-cover {
      display: none !important;
    }

    /* ── Avatar: gradient fallback, centered, generous ── */
    #profileViewerModal.profile-ui-v23 .profile-nitro-avatar-stage {
      margin: 0 auto 16px;
      width: 100px;
      height: 100px;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-avatar-btn {
      width: 100px !important;
      height: 100px !important;
      font-size: 32px !important;
      font-weight: 700 !important;
      background: linear-gradient(135deg, #1e3a5f 0%, #0f1e3d 55%, #1b1040 100%) !important;
      border-radius: 50% !important;
      letter-spacing: -0.02em;
    }

    /* Premium: thin gold ring, no aurora */
    #profileViewerModal.profile-ui-v23 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      animation: none !important;
      inset: -3px !important;
      padding: 2.5px !important;
      background: linear-gradient(135deg, #f5d98b, #c9a227, #f5d98b) !important;
      opacity: 0.85 !important;
      filter: none !important;
    }

    /* Non-premium: no ring */
    #profileViewerModal.profile-ui-v23 .profile-nitro-card:not(.is-premium) .profile-nitro-avatar-ring::before {
      display: none !important;
    }

    /* ── Name: text anchor, dominant ── */
    #profileViewerModal.profile-ui-v23 .profile-nitro-name {
      font-size: 22px !important;
      font-weight: 700 !important;
      line-height: 1.2 !important;
      text-align: center;
      margin-bottom: 2px !important;
    }

    /* ── User ID: secondary, inline, not a block ── */
    #profileViewerModal.profile-ui-v23 .profile-nitro-nick {
      font-size: 12px !important;
      font-weight: 400 !important;
      opacity: 0.45 !important;
      text-align: center;
      margin-bottom: 6px !important;
      letter-spacing: 0;
    }

    /* ── Premium badge: status feel, not a button ── */
    #profileViewerModal.profile-ui-v23 .profile-v18-title-line {
      display: flex;
      justify-content: center;
      margin-bottom: 20px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v18-title-badge.is-premium {
      background: rgba(212, 160, 23, 0.1) !important;
      border: 1px solid rgba(212, 160, 23, 0.35) !important;
      color: #f5d98b !important;
      font-size: 11px !important;
      font-weight: 600 !important;
      text-transform: lowercase !important;
      letter-spacing: 0.04em;
      padding: 4px 12px !important;
      border-radius: 999px !important;
      box-shadow: none !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-v18-title-badge.is-premium::before {
      content: "✦ ";
      font-size: 9px;
      vertical-align: middle;
      opacity: 0.8;
    }

    /* ── Kill ALL glow sources on reputation ── */
    #profileViewerModal.profile-ui-v23 .profile-nitro-reputation-ring::before {
      display: none !important;
      content: none !important;
    }

    #profileViewerModal.profile-ui-v23 #profileNitroRep,
    #profileViewerModal.profile-ui-v23 #profileNitroRep *,
    #profileViewerModal.profile-ui-v23 .profile-nitro-reputation-ring,
    #profileViewerModal.profile-ui-v23 .profile-nitro-reputation-ring * {
      filter: none !important;
      -webkit-filter: none !important;
      box-shadow: none !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-block {
      margin: 0 0 16px;
      padding: 14px 16px;
      background: color-mix(in srgb, var(--bubble-in) 20%, transparent);
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-row {
      display: flex;
      align-items: center;
      gap: 14px;
      cursor: pointer;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-donut {
      width: 72px;
      height: 72px;
      border-radius: 50%;
      padding: 7px;
      flex-shrink: 0;
      /* NO filter, NO box-shadow, NO glow */
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-hole {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background: var(--modal, #1a1a1f);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-content {
      flex: 1;
      min-width: 0;
    }

    /* Score is the headline — biggest, boldest */
    #profileViewerModal.profile-ui-v23 .profile-v23-rep-score {
      font-size: 38px;
      font-weight: 800;
      line-height: 1;
      letter-spacing: -0.04em;
      color: #22c55e;
      margin-bottom: 2px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-content.is-negative .profile-v23-rep-score {
      color: #ef4444;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-content.is-neutral .profile-v23-rep-score,
    #profileViewerModal.profile-ui-v23 .profile-v23-rep-content.is-seed .profile-v23-rep-score {
      color: color-mix(in srgb, var(--fg) 60%, transparent);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-label {
      font-size: 11px;
      font-weight: 500;
      opacity: 0.55;
      margin-bottom: 6px;
      text-transform: lowercase;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-stats {
      display: flex;
      gap: 8px;
      font-size: 11px;
      opacity: 0.55;
      flex-wrap: wrap;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-rep-voters {
      opacity: 0.45;
    }

    /* ── Activity: single inline text row ── */
    #profileViewerModal.profile-ui-v23 .profile-v23-stats-wrap {
      margin-bottom: 16px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-stats-inline {
      font-size: 12.5px;
      color: color-mix(in srgb, var(--fg) 65%, transparent);
      line-height: 1.5;
      padding: 0 2px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-stat-sep {
      color: color-mix(in srgb, var(--muted) 60%, transparent);
    }

    /* ── Right column ── */
    #profileViewerModal.profile-ui-v23 .profile-viewer-right {
      flex: 1;
      overflow-y: auto;
      max-height: calc(95vh - 80px);
      padding: 28px 24px 24px;
      border-left: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
    }

    /* Section ordering */
    #profileViewerModal.profile-ui-v23 #profileViewerV2Sections {
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    #profileViewerModal.profile-ui-v23 #profileViewerAbout:not(.hidden)          { order: 1; }
    #profileViewerModal.profile-ui-v23 #profileViewerFeaturedProject:not(.hidden) { order: 2; }
    #profileViewerModal.profile-ui-v23 #profileViewerChannelsList:not(.hidden)    { order: 3; }
    #profileViewerModal.profile-ui-v23 #profileViewerAchievements:not(.hidden)    { order: 4; }
    #profileViewerModal.profile-ui-v23 #profileViewerSocialPills:not(.hidden)     { order: 5; }
    #profileViewerModal.profile-ui-v23 #profileViewerActivity { display: none !important; }

    /* Section title: clean, small caps weight */
    #profileViewerModal.profile-ui-v23 .profile-v23-section-title {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      opacity: 0.4;
      margin: 0 0 10px;
    }

    /* Section spacing */
    #profileViewerModal.profile-ui-v23 #profileViewerAbout { padding-bottom: 20px; margin-bottom: 4px; }
    #profileViewerModal.profile-ui-v23 #profileViewerFeaturedProject { padding-bottom: 20px; margin-bottom: 4px; border-top: 1px solid color-mix(in srgb, var(--border) 20%, transparent); padding-top: 20px; }
    #profileViewerModal.profile-ui-v23 #profileViewerChannelsList { padding-bottom: 20px; padding-top: 20px; border-top: 1px solid color-mix(in srgb, var(--border) 20%, transparent); }
    #profileViewerModal.profile-ui-v23 #profileViewerAchievements { padding-bottom: 20px; padding-top: 20px; border-top: 1px solid color-mix(in srgb, var(--border) 20%, transparent); }
    #profileViewerModal.profile-ui-v23 #profileViewerSocialPills { padding-bottom: 8px; padding-top: 20px; border-top: 1px solid color-mix(in srgb, var(--border) 20%, transparent); }

    /* Suppress legacy panel chrome for right column sections */
    #profileViewerModal.profile-ui-v23 .profile-v2-block.profile-nitro-panel {
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      padding: 0 !important;
    }

    /* ── About: plain readable text, no decoration ── */
    #profileViewerModal.profile-ui-v23 .profile-nitro-about-hero-inner {
      padding: 0 !important;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
    }

    /* Strip blockquote decoration; keep the text visible */
    #profileViewerModal.profile-ui-v23 .profile-nitro-about-quote::before,
    #profileViewerModal.profile-ui-v23 .profile-nitro-about-quote::after {
      display: none !important;
      content: none !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-about-quote {
      border: none !important;
      background: transparent !important;
      padding: 0 !important;
      margin: 0 !important;
      font-style: normal !important;
      font-size: 14px !important;
      line-height: 1.65 !important;
      color: color-mix(in srgb, var(--fg) 82%, transparent) !important;
      display: block !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-about-text {
      font-size: 14px;
      line-height: 1.65;
      color: color-mix(in srgb, var(--fg) 82%, transparent);
      margin: 0;
    }

    /* ── Featured channel: visual anchor, large thumbnail ── */
    #profileViewerModal.profile-ui-v23 .profile-v23-featured-card {
      display: flex;
      align-items: center;
      gap: 16px;
      width: 100%;
      padding: 14px;
      background: color-mix(in srgb, var(--bubble-in) 18%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
      border-radius: 14px;
      cursor: pointer;
      text-align: left;
      transition: background 0.15s;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-card:hover {
      background: color-mix(in srgb, var(--bubble-in) 30%, transparent);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-thumb {
      width: 120px;
      height: 120px;
      border-radius: 12px;
      flex-shrink: 0;
      overflow: hidden;
      display: flex;
      align-items: center;
      justify-content: center;
      background: linear-gradient(135deg, #1e3a5f, #0f1e3d, #1b1040);
      font-size: 28px;
      font-weight: 700;
      color: rgba(255,255,255,0.7);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-thumb-fb {
      font-size: 28px;
      font-weight: 700;
      color: rgba(255,255,255,0.65);
      letter-spacing: -0.02em;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-info {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-name {
      font-size: 16px;
      font-weight: 700;
      line-height: 1.2;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-desc {
      font-size: 12.5px;
      line-height: 1.45;
      opacity: 0.6;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-meta {
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-subs {
      font-size: 12px;
      opacity: 0.55;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-status {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 11.5px;
      font-weight: 500;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--muted) 50%, transparent);
      display: inline-block;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-featured-status.is-active .profile-v23-featured-dot { background: #22c55e; }
    #profileViewerModal.profile-ui-v23 .profile-v23-featured-status.is-growing .profile-v23-featured-dot { background: #f59e0b; }

    /* ── Channels: clean rows ── */
    #profileViewerModal.profile-ui-v23 .profile-v23-channels-list {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 9px 10px;
      border-radius: 10px;
      cursor: pointer;
      text-align: left;
      width: 100%;
      background: transparent;
      border: none;
      transition: background 0.1s;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-row:hover {
      background: color-mix(in srgb, var(--bubble-in) 25%, transparent);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-av {
      width: 38px;
      height: 38px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 700;
      color: rgba(255,255,255,0.7);
      background: linear-gradient(135deg, #1e3a5f, #0f1e3d);
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-av img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-body {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 1px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-name {
      font-size: 13.5px;
      font-weight: 600;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-meta {
      font-size: 11.5px;
      opacity: 0.45;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: color-mix(in srgb, var(--muted) 35%, transparent);
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-ch-dot.is-active {
      background: #22c55e;
    }

    /* ── Achievements: readable, real weight ── */
    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 10px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-card {
      min-height: 86px;
      max-width: none;
      padding: 14px 8px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 35%, transparent);
      box-shadow: none !important;
      gap: 7px;
      background: color-mix(in srgb, var(--bubble-in) 20%, transparent);
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-frame {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      box-shadow: none !important;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-ic {
      font-size: 18px;
    }

    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-name {
      font-size: 11px;
      font-weight: 600;
      text-align: center;
      line-height: 1.3;
      opacity: 0.85;
    }

    /* Strip rarity glow/borders */
    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v23 .profile-v23-achievements-panel .profile-nitro-showcase-card--mythic {
      border-color: color-mix(in srgb, var(--border) 35%, transparent) !important;
      box-shadow: none !important;
    }

    /* ── Social links: compact horizontal row ── */
    #profileViewerModal.profile-ui-v23 .profile-nitro-social-stack {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      gap: 8px;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn {
      padding: 7px 12px;
      border-color: color-mix(in srgb, var(--border) 50%, transparent) !important;
      font-size: 12.5px;
      flex: none;
    }

    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn--youtube,
    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn--twitch,
    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn--discord,
    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn--telegram,
    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn--github,
    #profileViewerModal.profile-ui-v23 .profile-nitro-social-btn--tiktok {
      border-color: color-mix(in srgb, var(--border) 50%, transparent) !important;
    }

    /* ── Suppress legacy noise in left column ── */
    /* nitroRepHighlight and legacy rep block */
    #profileViewerModal.profile-ui-v23 #profileNitroRepHighlight { display: none !important; }
    #profileViewerModal.profile-ui-v23 #profileNitroShowcase { display: none !important; }
    #profileViewerModal.profile-ui-v23 .profile-nitro-showcase-area { display: none !important; }

    /* ── END PROFILE V23 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V24 — Banner + Grid
       Top: full-width identity banner [avatar | identity | rep-widget]
       Bottom: 3-column content grid [featured | channels+socials | achievements]
    ═══════════════════════════════════════════════════════════════ */

    /* ── Modal ── */
    #profileViewerModal.profile-ui-v24 .modal.modal--profile-viewer {
      width: min(1120px, calc(100vw - 32px));
      max-width: 1120px;
      overflow: visible;
      gap: 0;
    }

    /* ── Stack left (banner) above right (grid) ── */
    #profileViewerModal.profile-ui-v24 .profile-viewer-layout.profile-nitro-layout {
      display: flex;
      flex-direction: column;
      grid-template-columns: unset;
      gap: 0;
    }

    /* ── BANNER (left column, now full-width) ── */
    #profileViewerModal.profile-ui-v24 .profile-viewer-left {
      width: 100%;
      max-width: 100%;
      min-width: unset;
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      border-bottom: 1px solid color-mix(in srgb, var(--border) 25%, transparent);
      padding: 0;
      overflow: visible;
      max-height: none;
    }

    /* Suppress V24 card chrome */
    #profileViewerModal.profile-ui-v24 .profile-nitro-card {
      background: transparent !important;
      background-color: transparent !important;
      background-image: none !important;
      border: none !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      padding: 0 !important;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-card::before,
    #profileViewerModal.profile-ui-v24 .profile-nitro-card::after {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-cover {
      display: none !important;
    }

    /* ── Banner strip: three zones in a row ── */
    #profileViewerModal.profile-ui-v24 .profile-v24-strip {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 20px;
      padding: 22px 28px;
    }

    /* Zone 1: Avatar (square with optional ring) */
    #profileViewerModal.profile-ui-v24 .profile-v24-av-zone {
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-avatar-stage {
      width: 96px;
      height: 96px;
      margin: 0;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-avatar-btn {
      width: 96px !important;
      height: 96px !important;
      font-size: 28px !important;
      font-weight: 700 !important;
      background: linear-gradient(135deg, #1e3a5f 0%, #0f1e3d 55%, #1b1040 100%) !important;
      border-radius: 18px !important; /* square-ish with rounded corners */
      letter-spacing: -0.02em;
    }

    /* Premium: thin gold border on the button itself */
    #profileViewerModal.profile-ui-v24 .profile-nitro-card.is-premium .profile-nitro-avatar-btn {
      box-shadow: 0 0 0 2.5px #c9a227, 0 0 0 4px rgba(201,162,39,0.18) !important;
    }

    /* Kill aurora/rainbow ring for V24 */
    #profileViewerModal.profile-ui-v24 .profile-nitro-avatar-ring::before {
      display: none !important;
    }

    /* Zone 2: Identity (grows, left-aligned) */
    #profileViewerModal.profile-ui-v24 .profile-v24-id-zone {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 3px;
      align-items: flex-start;
    }

    /* Name: largest text in banner */
    #profileViewerModal.profile-ui-v24 .profile-nitro-name {
      font-size: 26px !important;
      font-weight: 800 !important;
      line-height: 1.15 !important;
      letter-spacing: -0.02em;
      text-align: left;
    }

    /* User ID: muted, small, inline */
    #profileViewerModal.profile-ui-v24 .profile-v18-user-id-host {
      font-size: 11px;
      opacity: 0.38;
      margin-top: 1px;
    }

    /* Premium badge: status pill */
    #profileViewerModal.profile-ui-v24 .profile-v18-title-line {
      margin-top: 5px;
      margin-bottom: 2px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v18-title-badge.is-premium {
      background: rgba(212, 160, 23, 0.1) !important;
      border: 1px solid rgba(212, 160, 23, 0.35) !important;
      color: #f5d98b !important;
      font-size: 11px !important;
      font-weight: 600 !important;
      text-transform: lowercase !important;
      letter-spacing: 0.04em;
      padding: 3px 10px !important;
      border-radius: 999px !important;
      box-shadow: none !important;
    }

    #profileViewerModal.profile-ui-v24 .profile-v18-title-badge.is-premium::before {
      content: "✦ ";
      font-size: 9px;
      opacity: 0.7;
    }

    /* Stats inline */
    #profileViewerModal.profile-ui-v24 .profile-v24-stats-row {
      margin-top: 8px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-stats-inline {
      font-size: 12px;
      color: color-mix(in srgb, var(--fg) 55%, transparent);
      line-height: 1.5;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-stat-sep {
      opacity: 0.4;
    }

    /* Zone 3: Reputation widget (right, fixed width) */
    #profileViewerModal.profile-ui-v24 .profile-v24-rep-zone {
      flex-shrink: 0;
      width: 190px;
    }

    /* Kill ALL glow on V24 rep */
    #profileViewerModal.profile-ui-v24 .profile-nitro-reputation-ring::before {
      display: none !important;
      content: none !important;
    }

    #profileViewerModal.profile-ui-v24 #profileNitroRep,
    #profileViewerModal.profile-ui-v24 #profileNitroRep *,
    #profileViewerModal.profile-ui-v24 .profile-nitro-reputation-ring,
    #profileViewerModal.profile-ui-v24 .profile-nitro-reputation-ring * {
      filter: none !important;
      -webkit-filter: none !important;
      box-shadow: none !important;
    }

    /* Rep widget: vertical card */
    #profileViewerModal.profile-ui-v24 .profile-v24-rep-widget {
      background: color-mix(in srgb, var(--bubble-in) 18%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 30%, transparent);
      border-radius: 16px;
      padding: 16px 14px;
      text-align: center;
      cursor: pointer;
      transition: background 0.15s;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-widget:hover {
      background: color-mix(in srgb, var(--bubble-in) 28%, transparent);
    }

    /* Score: absolutely dominant, top of the widget */
    #profileViewerModal.profile-ui-v24 .profile-v24-rep-score {
      font-size: 44px;
      font-weight: 900;
      line-height: 1;
      letter-spacing: -0.05em;
      color: #22c55e;
      margin-bottom: 2px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-widget.is-negative .profile-v24-rep-score {
      color: #ef4444;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-widget.is-neutral .profile-v24-rep-score,
    #profileViewerModal.profile-ui-v24 .profile-v24-rep-widget.is-seed .profile-v24-rep-score {
      color: color-mix(in srgb, var(--fg) 55%, transparent);
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-sublabel {
      font-size: 11px;
      opacity: 0.5;
      text-transform: lowercase;
      margin-bottom: 10px;
    }

    /* Ring + votes in a horizontal row inside the widget */
    #profileViewerModal.profile-ui-v24 .profile-v24-rep-ring-row {
      display: flex;
      align-items: center;
      gap: 10px;
      justify-content: center;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-ring {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      padding: 5px;
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-hole {
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background: var(--modal, #1a1a1f);
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-votes {
      display: flex;
      flex-direction: column;
      gap: 2px;
      font-size: 11px;
      opacity: 0.55;
      text-align: left;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-rep-voters {
      opacity: 0.4;
      font-size: 10px;
    }

    /* ── CONTENT GRID (right column, now full-width) ── */
    #profileViewerModal.profile-ui-v24 .profile-viewer-right {
      width: 100%;
      border-left: none;
      padding: 0;
      max-height: calc(95vh - 230px);
      overflow-y: auto;
    }

    /* 3-column CSS grid for sections */
    #profileViewerModal.profile-ui-v24 #profileViewerV2Sections {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: auto;
      gap: 0;
    }

    /* Strip ALL legacy panel chrome from sections */
    #profileViewerModal.profile-ui-v24 .profile-v2-block.profile-nitro-panel {
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      padding: 0 !important;
    }

    /* About: full-width, row 1 — brief bio strip */
    #profileViewerModal.profile-ui-v24 #profileViewerAbout:not(.hidden) {
      grid-column: 1 / -1;
      grid-row: 1;
      padding: 16px 28px;
      border-bottom: 1px solid color-mix(in srgb, var(--border) 18%, transparent);
    }

    /* About text */
    #profileViewerModal.profile-ui-v24 .profile-nitro-about-quote::before,
    #profileViewerModal.profile-ui-v24 .profile-nitro-about-quote::after {
      display: none !important;
      content: none !important;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-about-quote {
      border: none !important;
      background: transparent !important;
      padding: 0 !important;
      margin: 0 !important;
      font-style: normal !important;
      font-size: 13.5px !important;
      line-height: 1.6 !important;
      color: color-mix(in srgb, var(--fg) 75%, transparent) !important;
      display: block !important;
    }

    /* Featured: col 1, rows 2–3 (spans channels + socials height) */
    #profileViewerModal.profile-ui-v24 #profileViewerFeaturedProject:not(.hidden) {
      grid-column: 1;
      grid-row: 2 / 4;
      border-right: 1px solid color-mix(in srgb, var(--border) 18%, transparent);
      padding: 20px 20px;
    }

    /* Featured card: stacked (thumb on top, info below) */
    #profileViewerModal.profile-ui-v24 .profile-v23-featured-card {
      flex-direction: column !important;
      gap: 0 !important;
      padding: 0 !important;
      background: color-mix(in srgb, var(--bubble-in) 15%, transparent) !important;
      border-radius: 12px !important;
      overflow: hidden;
      height: 100%;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-thumb {
      width: 100% !important;
      height: 140px !important;
      border-radius: 0 !important;
      flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-info {
      padding: 14px !important;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-name {
      font-size: 15px !important;
    }

    /* Channels: col 2, row 2 */
    #profileViewerModal.profile-ui-v24 #profileViewerChannelsList:not(.hidden) {
      grid-column: 2;
      grid-row: 2;
      border-right: 1px solid color-mix(in srgb, var(--border) 18%, transparent);
      border-bottom: 1px solid color-mix(in srgb, var(--border) 15%, transparent);
      padding: 20px 16px;
    }

    /* Socials: col 2, row 3 */
    #profileViewerModal.profile-ui-v24 #profileViewerSocialPills:not(.hidden) {
      grid-column: 2;
      grid-row: 3;
      border-right: 1px solid color-mix(in srgb, var(--border) 18%, transparent);
      padding: 20px 16px;
    }

    /* Socials: horizontal row (reuse V23 socials CSS) */
    #profileViewerModal.profile-ui-v24 .profile-nitro-social-stack {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn {
      padding: 7px 11px;
      border-color: color-mix(in srgb, var(--border) 45%, transparent) !important;
      font-size: 12px;
    }

    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn--youtube,
    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn--twitch,
    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn--discord,
    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn--telegram,
    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn--github,
    #profileViewerModal.profile-ui-v24 .profile-nitro-social-btn--tiktok {
      border-color: color-mix(in srgb, var(--border) 45%, transparent) !important;
    }

    /* Achievements: col 3, rows 2–3 */
    #profileViewerModal.profile-ui-v24 #profileViewerAchievements:not(.hidden) {
      grid-column: 3;
      grid-row: 2 / 4;
      padding: 20px 16px;
    }

    /* Achievements: 2-column grid for more readable names */
    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 10px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-card {
      min-height: 90px;
      max-width: none;
      padding: 14px 10px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 35%, transparent);
      box-shadow: none !important;
      gap: 8px;
      background: color-mix(in srgb, var(--bubble-in) 18%, transparent);
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-frame {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      box-shadow: none !important;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-ic {
      font-size: 18px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-name {
      font-size: 11.5px;
      font-weight: 600;
      text-align: center;
      line-height: 1.3;
      opacity: 0.85;
    }

    /* Strip rarity glow on achievements */
    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v24 .profile-v24-achievements-panel .profile-nitro-showcase-card--mythic {
      border-color: color-mix(in srgb, var(--border) 35%, transparent) !important;
      box-shadow: none !important;
    }

    /* Section title */
    #profileViewerModal.profile-ui-v24 .profile-v24-section-title {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      opacity: 0.38;
      margin: 0 0 12px;
    }

    /* Suppress legacy elements */
    #profileViewerModal.profile-ui-v24 #profileNitroRepHighlight { display: none !important; }
    #profileViewerModal.profile-ui-v24 #profileNitroShowcase { display: none !important; }
    #profileViewerModal.profile-ui-v24 .profile-nitro-showcase-area { display: none !important; }
    #profileViewerModal.profile-ui-v24 #profileViewerActivity { display: none !important; }
    #profileViewerModal.profile-ui-v24 #profileNitroBadges { display: none !important; }

    /* ── V24: channel rows (re-scope V23 styles for V24 context) ── */
    #profileViewerModal.profile-ui-v24 .profile-v23-channels-list {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-row {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 8px 8px;
      border-radius: 10px;
      cursor: pointer;
      text-align: left;
      width: 100%;
      background: transparent;
      border: none;
      transition: background 0.1s;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-row:hover {
      background: color-mix(in srgb, var(--bubble-in) 25%, transparent);
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-av {
      width: 36px;
      height: 36px;
      border-radius: 50%;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 700;
      color: rgba(255,255,255,0.7);
      background: linear-gradient(135deg, #1e3a5f, #0f1e3d);
      overflow: hidden;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-av img {
      width: 100%; height: 100%; object-fit: cover;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-body {
      flex: 1; min-width: 0;
      display: flex; flex-direction: column; gap: 1px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-name {
      font-size: 13px; font-weight: 600;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-meta {
      font-size: 11px; opacity: 0.45;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-dot {
      width: 7px; height: 7px; border-radius: 50%;
      background: color-mix(in srgb, var(--muted) 35%, transparent); flex-shrink: 0;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-ch-dot.is-active { background: #22c55e; }

    /* ── V24: featured card base styles (V23 re-scope) ── */
    #profileViewerModal.profile-ui-v24 .profile-v23-featured-thumb-fb {
      font-size: 24px; font-weight: 700;
      color: rgba(255,255,255,0.65); letter-spacing: -0.02em;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-info {
      flex: 1; min-width: 0;
      display: flex; flex-direction: column; gap: 6px;
      padding: 14px;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-name {
      font-size: 15px; font-weight: 700; line-height: 1.2;
      overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-desc {
      font-size: 12px; line-height: 1.4; opacity: 0.55;
      display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-meta {
      display: flex; align-items: center; gap: 10px; flex-wrap: wrap;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-subs {
      font-size: 11.5px; opacity: 0.5;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-status {
      display: flex; align-items: center; gap: 5px;
      font-size: 11px; font-weight: 500;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-dot {
      width: 6px; height: 6px; border-radius: 50%;
      background: color-mix(in srgb, var(--muted) 50%, transparent); display: inline-block;
    }

    #profileViewerModal.profile-ui-v24 .profile-v23-featured-status.is-active .profile-v23-featured-dot { background: #22c55e; }

    /* ── V24: Kill About section quote decoration ── */
    #profileViewerModal.profile-ui-v24 .profile-nitro-about-hero-inner {
      padding: 0 !important;
      background: transparent !important;
      border: none !important;
    }

    /* ── END PROFILE V24 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V25 — Human First
       Architecture: V23 (same HTML, same render functions).
       The modal carries BOTH .profile-ui-v23 (for base styles) AND
       .profile-ui-v25 (for overrides via higher specificity).

       Composition goal:
         LEFT:  [avatar | name+status]  ← unified identity block
                [rep: score dominant]
                [inline activity stats]
         RIGHT: [about] → [featured hero] → [channels] → [achievements] → [socials]
    ═══════════════════════════════════════════════════════════════ */

    /* ── Identity header: avatar + name side-by-side ── */

    /* body becomes a wrap-flex row so avatar and identity share row 1 */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-nitro-body {
      flex-direction: row !important;
      flex-wrap: wrap !important;
      align-items: flex-start !important;
      padding: 22px 20px 16px !important;
      gap: 0 !important;
    }

    /* Avatar: compact square, left anchor */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-nitro-avatar-stage {
      flex: 0 0 auto !important;
      width: 72px !important;
      height: 72px !important;
      margin: 0 14px 16px 0 !important;
      align-self: flex-start !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-nitro-avatar-btn {
      width: 72px !important;
      height: 72px !important;
      font-size: 20px !important;
      border-radius: 16px !important;
      background: linear-gradient(135deg, #1e3a5f 0%, #0f1e3d 55%, #1b1040 100%) !important;
    }

    /* Premium: gold ring on the button */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-nitro-card.is-premium .profile-nitro-avatar-btn {
      box-shadow: 0 0 0 2px #c9a227, 0 0 0 4px rgba(201,162,39,0.15) !important;
    }

    /* Identity column: left-aligned, grows to fill row */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-nitro-identity {
      flex: 1 !important;
      min-width: 0 !important;
      align-items: flex-start !important;
      text-align: left !important;
      padding-top: 2px !important;
    }

    /* Name: larger, bold, left-aligned — primary visual anchor */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-nitro-name {
      font-size: 18px !important;
      font-weight: 800 !important;
      text-align: left !important;
      line-height: 1.2 !important;
      letter-spacing: -0.01em !important;
      overflow: hidden !important;
      text-overflow: ellipsis !important;
      white-space: nowrap !important;
    }

    /* User ID: left-aligned, small */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v18-user-id-host {
      text-align: left !important;
    }

    /* Premium badge: left-aligned */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v18-title-line {
      justify-content: flex-start !important;
    }

    /* Rep: full row — sits below avatar+identity block */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 #profileNitroRep {
      flex: 0 0 100% !important;
      width: 100% !important;
      box-sizing: border-box !important;
      margin-top: 4px !important;
    }

    /* Rep score: absolutely dominant number */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-rep-score {
      font-size: 46px !important;
      font-weight: 900 !important;
      letter-spacing: -0.06em !important;
    }

    /* Rep ring: compact — support element, not visual focus */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-rep-donut {
      width: 44px !important;
      height: 44px !important;
    }

    /* Activity stats: full row below rep */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 #profileNitroMetrics {
      flex: 0 0 100% !important;
      width: 100% !important;
      margin-top: 4px !important;
    }

    /* ── Featured Channel: hero of the right column ── */

    /* Card: more visual weight than V23's compact version */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-featured-card {
      gap: 18px !important;
      padding: 16px !important;
      background: color-mix(in srgb, var(--bubble-in) 22%, transparent) !important;
    }

    /* Thumbnail: 150 × 150 — the visual centrepiece */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-featured-thumb {
      width: 150px !important;
      min-width: 150px !important;
      height: 150px !important;
      border-radius: 14px !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-featured-thumb-fb {
      font-size: 34px !important;
    }

    /* Title: larger, more prominent */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-featured-name {
      font-size: 17px !important;
      font-weight: 800 !important;
      white-space: normal !important;
      line-height: 1.3 !important;
    }

    /* Section header for Featured: make it feel like a label, not a widget title */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 #profileViewerFeaturedProject .profile-v23-section-title {
      opacity: 0.55 !important;
    }

    /* ── Dashboard remnant cleanup ── */

    /* Right column: no divider between About and Featured */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 #profileViewerAbout {
      padding-bottom: 12px !important;
    }

    /* Channels list: slightly more air per row */
    #profileViewerModal.profile-ui-v23.profile-ui-v25 .profile-v23-ch-row {
      padding: 10px 8px !important;
    }

    /* ── END PROFILE V25 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V26 — Composition Fix
       Inherits V23 + V25. Adds three targeted layout changes:
         1. Left column: unified hero card (avatar+name+rep as ONE block)
         2. Right column bottom: 3-column grid (channels|achievements|socials)
         3. Featured Channel: wider thumbnail, tighter spacing to About
       Selector: .profile-ui-v23.profile-ui-v25.profile-ui-v26 (highest specificity)
    ═══════════════════════════════════════════════════════════════ */

    /* ── Изменение 1: Unified Hero Header ── */

    /* Give the whole left column a very subtle tint to read as ONE panel */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-viewer-left {
      background: color-mix(in srgb, var(--bubble-in) 7%, transparent) !important;
      border-right: 1px solid color-mix(in srgb, var(--border) 22%, transparent) !important;
    }

    /* Rep block: remove its own card chrome — it's now part of the unified panel */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-v23-rep-block {
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
      padding: 8px 0 4px !important;
    }

    /* Name: make it the dominant text element — first fixation anchor */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-nitro-name {
      font-size: 22px !important;
    }

    /* Tighter gap from identity block to rep */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileNitroRep {
      margin-top: 2px !important;
    }

    /* Stats: tighter to rep */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileNitroMetrics {
      margin-top: 0px !important;
    }

    /* ── Изменение 2 & 3: Featured Channel — closer to bio, wider ── */

    /* Reduce air between About and Featured */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerAbout {
      padding-bottom: 0 !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerFeaturedProject {
      padding-top: 12px !important;
    }

    /* Wider thumbnail */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-v23-featured-thumb {
      width: 200px !important;
      min-width: 200px !important;
      height: 160px !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-v23-featured-thumb-fb {
      font-size: 40px !important;
    }

    /* ── Изменение 4: Bottom sections — 3-column horizontal zone ── */

    /* Make sections container a CSS grid */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerV2Sections {
      display: grid !important;
      grid-template-columns: repeat(3, 1fr) !important;
      grid-template-rows: auto !important;
      gap: 0 !important;
    }

    /* About: full-width, row 1 */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerAbout {
      grid-column: 1 / -1 !important;
      grid-row: 1 !important;
      order: unset !important;
    }

    /* Featured: full-width, row 2 — the hero of the right column */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerFeaturedProject {
      grid-column: 1 / -1 !important;
      grid-row: 2 !important;
      order: unset !important;
      border-bottom: 1px solid color-mix(in srgb, var(--border) 18%, transparent) !important;
    }

    /* Channels + Achievements + Socials: compact horizontal zone, row 3 */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerChannelsList {
      grid-column: 1 !important;
      grid-row: 3 !important;
      order: unset !important;
      padding: 16px 14px !important;
      border-right: 1px solid color-mix(in srgb, var(--border) 15%, transparent) !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerAchievements {
      grid-column: 2 !important;
      grid-row: 3 !important;
      order: unset !important;
      padding: 16px 14px !important;
      border-right: 1px solid color-mix(in srgb, var(--border) 15%, transparent) !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerSocialPills {
      grid-column: 3 !important;
      grid-row: 3 !important;
      order: unset !important;
      padding: 16px 14px !important;
    }

    /* Strip section inner padding overrides from V23 for the grid cells */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerChannelsList .profile-v23-section-title,
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerAchievements .profile-v23-section-title,
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 #profileViewerSocialPills .profile-v23-section-title {
      margin-bottom: 8px !important;
    }

    /* Achievements in col 2: use a 2-col inner grid to fit the narrower space */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-v23-achievements-panel .profile-nitro-showcase {
      grid-template-columns: repeat(2, minmax(0, 1fr)) !important;
      gap: 7px !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-v23-achievements-panel .profile-nitro-showcase-card {
      min-height: 76px !important;
      padding: 10px 8px !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-v23-achievements-panel .profile-nitro-showcase-frame {
      width: 28px !important;
      height: 28px !important;
    }

    /* Socials in col 3: compact vertical list */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-nitro-social-stack {
      gap: 5px !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26 .profile-nitro-social-btn {
      padding: 7px 10px !important;
      font-size: 12px !important;
    }

    /* ── END PROFILE V26 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V27 — Identity First (Finalization Pass)
       RIGHT COLUMN FROZEN.
       Selector: .profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27

       Heatmap goal: 1→Name  2→Avatar  3→+87  4→Featured
       name (26px) > score (24px) — fixed regressions:
         • name nowrap (was 32px wrapping to 2 lines)
         • avatar 68px (was 44px — too compact)
    ═══════════════════════════════════════════════════════════════ */

    /* Left column slightly wider so 26px name fits single-line */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 320px 1fr !important;
    }

    /* Body: flex-row, zero gap */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-body {
      gap: 0 !important;
      padding: 20px 16px 14px !important;
      align-items: flex-start !important;
    }

    /* Avatar: restored to V26 range — avatar + name read as one group */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-avatar-stage {
      width: 68px !important;
      height: 68px !important;
      margin: 2px 12px 0 0 !important;
      align-self: flex-start !important;
      flex-shrink: 0 !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-avatar-btn {
      width: 68px !important;
      height: 68px !important;
      font-size: 20px !important;
      border-radius: 14px !important;
    }

    /* Premium: restore V26 gold ring at 68px */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-card.is-premium .profile-nitro-avatar-btn {
      box-shadow: 0 0 0 2.5px #c9a227, 0 0 0 4px rgba(201,162,39,0.15) !important;
    }

    /* NAME: single line, full display — 22px fits any reasonable nickname */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-name {
      font-size: 22px !important;
      font-weight: 800 !important;
      line-height: 1.1 !important;
      letter-spacing: -0.02em !important;
      text-align: left !important;
      white-space: nowrap !important;
      overflow: visible !important;  /* allow visible overflow — no clipping, no ellipsis */
      text-overflow: clip !important;
    }

    /* Identity column: min-width:0 ensures ellipsis works in flex */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-identity {
      min-width: 0 !important;
      gap: 0 !important;
      padding-top: 0 !important;
      align-items: flex-start !important;
    }

    /* User ID: tight to name */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v18-user-id-host {
      margin-top: 2px !important;
      font-size: 11px !important;
      opacity: 0.35 !important;
    }

    /* Badge: tight to ID */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v18-title-line {
      margin-top: 5px !important;
    }

    /* Rep block: tight below identity group */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 #profileNitroRep {
      margin-top: 10px !important;
    }

    /* Score: secondary — 20px keeps it clearly below the 22px name */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v23-rep-score {
      font-size: 20px !important;
      font-weight: 800 !important;
      letter-spacing: -0.03em !important;
    }

    /* Ring: compact support element */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v23-rep-donut {
      width: 36px !important;
      height: 36px !important;
    }

    /* Rep block: dense, no card chrome */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v23-rep-block {
      padding: 8px 10px !important;
      gap: 10px !important;
    }

    /* Metrics: compact */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 #profileNitroMetrics {
      margin-top: 2px !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v23-stats-inline {
      font-size: 11px !important;
      line-height: 1.5 !important;
    }

    /* ── Task 3: Stats — numbers bold, labels muted ── */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v23-stat-num {
      font-weight: 700 !important;
      opacity: 0.9 !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-v23-stat-lbl {
      font-weight: 400 !important;
      font-size: 0.82em !important;
      opacity: 0.5 !important;
    }

    /* ── Task 2: Bio — flush to top, reads as continuation of identity ── */

    /* Right column: zero top padding so bio text aligns with left column's 20px start */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-viewer-right {
      padding-top: 0 !important;
    }

    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 #profileViewerAbout {
      padding: 20px 20px 10px !important;
    }

    /* Remove inner padding from bio hero — text starts flush */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-about-hero-inner {
      padding: 0 !important;
      background: transparent !important;
      border: none !important;
    }

    /* Bio text: slightly more readable, feels like a first-person note */
    #profileViewerModal.profile-ui-v23.profile-ui-v25.profile-ui-v26.profile-ui-v27 .profile-nitro-about-quote {
      font-size: 14px !important;
      line-height: 1.65 !important;
      opacity: 0.88 !important;
      display: block !important;
    }

    /* ── END PROFILE V27 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V28 — REPUTATION REFACTOR
       Targets: #profileViewerModal.profile-ui-v28
    ═══════════════════════════════════════════════════════════════ */

    /* ── Hide V15 legacy elements we don't want in V28 ── */
    #profileViewerModal.profile-ui-v28 .profile-nitro-trophies-title,
    #profileViewerModal.profile-ui-v28 .profile-nitro-ach-grid,
    #profileViewerModal.profile-ui-v28 #profileNitroIdentityShowcase,
    #profileViewerModal.profile-ui-v28 #profileNitroRepHighlight,
    #profileViewerModal.profile-ui-v28 #profileNitroCommonGround,
    #profileViewerModal.profile-ui-v28 #profileNitroMobileChannel,
    #profileViewerModal.profile-ui-v28 #profileViewerActivity,
    #profileViewerModal.profile-ui-v28 #profileViewerHighlights,
    #profileViewerModal.profile-ui-v28 #profileViewerFeaturedProject,
    #profileViewerModal.profile-ui-v28 #profileViewerFeaturedIdentity,
    #profileViewerModal.profile-ui-v28 #profileViewerActivePresence,
    #profileViewerModal.profile-ui-v28 #profileViewerCommonGround {
      display: none !important;
    }

    /* ── Reputation ring: reset inherited glow/neon from V15 ── */
    #profileViewerModal.profile-ui-v28 #profileNitroRep {
      background: none !important;
      border: none !important;
      padding: 0 !important;
      margin: 0 !important;
      box-shadow: none !important;
      filter: none !important;
      border-radius: 0 !important;
    }
    #profileViewerModal.profile-ui-v28 #profileNitroRep::before,
    #profileViewerModal.profile-ui-v28 #profileNitroRep::after {
      display: none !important;
    }

    /* ── V28 Reputation card (Apple analytics style) ── */
    .profile-v28-rep-card {
      display: flex;
      align-items: center;
      gap: 14px;
      background: rgba(255,255,255,0.03);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 14px;
      padding: 14px 16px;
      width: 100%;
      box-sizing: border-box;
      margin-top: 6px;
    }

    /* SVG ring wrapper */
    .profile-v28-rep-ring-wrap {
      position: relative;
      width: 80px;
      height: 80px;
      flex-shrink: 0;
    }
    .profile-v28-rep-svg {
      width: 80px;
      height: 80px;
    }
    .profile-v28-rep-track {
      stroke: rgba(255,255,255,0.08);
    }
    .profile-v28-rep-arc {
      transition: stroke-dasharray 0.6s ease;
    }
    .profile-v28-rep-ring-inner {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      font-weight: 800;
      letter-spacing: -0.03em;
      line-height: 1;
    }

    /* Content column */
    .profile-v28-rep-content {
      display: flex;
      flex-direction: column;
      gap: 3px;
      min-width: 0;
    }
    .profile-v28-rep-score {
      font-size: 28px;
      font-weight: 800;
      letter-spacing: -0.04em;
      line-height: 1;
    }
    .profile-v28-rep-title {
      font-size: 12px;
      font-weight: 500;
      opacity: 0.55;
      line-height: 1.3;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }
    .profile-v28-rep-votes {
      display: flex;
      gap: 10px;
      margin-top: 4px;
    }
    .profile-v28-rep-vote {
      font-size: 13px;
      opacity: 0.7;
    }
    .profile-v28-rep-vote b {
      font-weight: 700;
      opacity: 1;
    }

    /* ── V28 Streak block ── */
    .profile-v28-streak-host {
      margin-top: 8px !important;
    }
    .profile-v28-streak {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      padding: 10px 0 4px;
    }
    .profile-v28-streak-line {
      font-size: 17px;
      font-weight: 600;
      line-height: 1.2;
    }
    .profile-v28-streak-ic {
      margin-right: 3px;
    }
    .profile-v28-streak-val {
      font-weight: 800;
    }
    .profile-v28-streak-sub {
      font-size: 12px;
      opacity: 0.4;
      font-weight: 400;
    }

    /* ── V28 Section titles ── */
    .profile-v28-section-title {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      opacity: 0.45;
      margin: 0 0 10px;
      padding: 0;
    }

    /* ── V28 Achievements placeholder ── */
    .profile-v28-achievements-placeholder {
      height: 32px;
    }

    /* ── V28 Channels (featured only) ── */
    .profile-v28-channel-card {
      display: flex;
      align-items: center;
      gap: 12px;
      background: rgba(255,255,255,0.03);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 12px;
      padding: 12px 14px;
      cursor: pointer;
      transition: background 0.15s ease, transform 0.15s ease;
    }
    .profile-v28-channel-card:hover {
      background: rgba(255,255,255,0.06);
      transform: translateY(-1px);
    }
    .profile-v28-channel-av {
      width: 44px;
      height: 44px;
      border-radius: 10px;
      background: rgba(255,255,255,0.08);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      font-weight: 700;
      flex-shrink: 0;
      overflow: hidden;
    }
    .profile-v28-channel-av img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }
    .profile-v28-channel-info {
      display: flex;
      flex-direction: column;
      gap: 3px;
      min-width: 0;
    }
    .profile-v28-channel-name {
      font-size: 14px;
      font-weight: 600;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .profile-v28-channel-desc {
      font-size: 12px;
      opacity: 0.5;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      line-height: 1.4;
    }
    .profile-v28-channel-meta {
      display: flex;
      align-items: center;
      gap: 5px;
      font-size: 11px;
      opacity: 0.45;
      margin-top: 2px;
    }
    .profile-v28-ch-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      background: rgba(255,255,255,0.3);
    }
    .profile-v28-ch-dot.is-active {
      background: #22c55e;
    }

    /* ── V28 Social buttons (CTA style) ── */
    .profile-v28-social-stack {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }
    .profile-v28-social-btn {
      display: flex;
      align-items: center;
      gap: 12px;
      height: 52px;
      padding: 0 16px;
      border-radius: 12px;
      background: rgba(255,255,255,0.04);
      border: 1px solid rgba(255,255,255,0.07);
      color: inherit;
      text-decoration: none;
      transition: background 0.15s ease, transform 0.15s ease, border-color 0.15s ease;
      cursor: pointer;
    }
    .profile-v28-social-btn:hover {
      background: rgba(255,255,255,0.07);
      border-color: rgba(255,255,255,0.12);
      transform: translateY(-2px);
    }
    .profile-v28-social-ic {
      width: 22px;
      height: 22px;
      flex-shrink: 0;
      color: var(--social-color, currentColor);
      opacity: 0.85;
    }
    .profile-v28-social-label {
      flex: 1;
      font-size: 14px;
      font-weight: 500;
    }
    .profile-v28-social-arrow {
      width: 16px;
      height: 16px;
      opacity: 0.3;
      flex-shrink: 0;
    }

    /* ── V28 Avatar preview overlay ── */
    #profileAvatarPreviewOverlay {
      position: fixed;
      inset: 0;
      z-index: 9999;
      background: rgba(0,0,0,0.85);
      display: flex;
      align-items: center;
      justify-content: center;
      padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
        max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
      box-sizing: border-box;
      backdrop-filter: blur(6px);
      -webkit-backdrop-filter: blur(6px);
      outline: none;
    }
    #profileAvatarPreviewOverlay.hidden {
      display: none !important;
    }
    #profileAvatarPreviewOverlay #profileAvatarPreviewImg.profile-av-preview-img {
      display: block;
      box-sizing: border-box;
      width: 95vw !important;
      height: 95vh !important;
      max-width: 95vw !important;
      max-height: 95vh !important;
      object-fit: contain !important;
      object-position: center center;
      border-radius: 12px;
      box-shadow: 0 20px 60px rgba(0,0,0,0.6);
      image-rendering: auto;
      transition: opacity 0.12s ease;
    }
    .profile-av-preview-img {
      display: block;
      box-sizing: border-box;
      width: 95vw;
      height: 95vh;
      max-width: 95vw;
      max-height: 95vh;
      object-fit: contain;
      object-position: center center;
      border-radius: 12px;
      box-shadow: 0 20px 60px rgba(0,0,0,0.6);
      image-rendering: auto;
      transition: opacity 0.12s ease;
    }
    .profile-av-preview-img.profile-av-preview-img--loading {
      opacity: 0;
    }
    .profile-av-preview-close {
      position: absolute;
      top: 16px;
      right: 20px;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      background: rgba(255,255,255,0.12);
      border: none;
      color: #fff;
      font-size: 22px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.15s ease;
    }
    .profile-av-preview-close:hover {
      background: rgba(255,255,255,0.2);
    }

    /* ── END PROFILE V28 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V29 — MINIMAL DARK PASSPORT (mockup-aligned)
    ═══════════════════════════════════════════════════════════════ */

    /* Hide legacy blocks (same as V28) */
    #profileViewerModal.profile-ui-v29 .profile-nitro-trophies-title,
    #profileViewerModal.profile-ui-v29 .profile-nitro-ach-grid,
    #profileViewerModal.profile-ui-v29 #profileNitroIdentityShowcase,
    #profileViewerModal.profile-ui-v29 #profileNitroMobilePerson,
    #profileViewerModal.profile-ui-v29 #profileNitroRepHighlight,
    #profileViewerModal.profile-ui-v29 #profileNitroCommonGround,
    #profileViewerModal.profile-ui-v29 #profileNitroMobileChannel,
    #profileViewerModal.profile-ui-v29 #profileViewerActivity,
    #profileViewerModal.profile-ui-v29 #profileViewerHighlights,
    #profileViewerModal.profile-ui-v29 #profileViewerFeaturedProject,
    #profileViewerModal.profile-ui-v29 #profileViewerFeaturedIdentity,
    #profileViewerModal.profile-ui-v29 #profileViewerActivePresence,
    #profileViewerModal.profile-ui-v29 #profileViewerCommonGround {
      display: none !important;
    }

    /* Left card: flat dark surface, no premium glow */
    #profileViewerModal.profile-ui-v29 .profile-nitro-card {
      background: rgba(255,255,255,0.02) !important;
      border: 1px solid rgba(255,255,255,0.06) !important;
      box-shadow: none !important;
      filter: none !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.has-identity-legendary,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.has-identity-mythic,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.has-identity-premium-frame,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.profile-v16-community-legend,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.profile-v16-premium-soft {
      background: rgba(255,255,255,0.02) !important;
      border: 1px solid rgba(255,255,255,0.06) !important;
      box-shadow: none !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-card::before,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card::after,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium::before,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium::after {
      display: none !important;
      content: none !important;
    }

    /* Hide cover banner */
    #profileViewerModal.profile-ui-v29 #profileNitroCover {
      display: none !important;
      height: 0 !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-body {
      margin-top: 0 !important;
      padding: 20px 16px 14px !important;
      gap: 8px !important;
    }

    /* Avatar: large circle, thin border only */
    #profileViewerModal.profile-ui-v29 .profile-nitro-avatar-stage {
      width: 112px !important;
      height: 112px !important;
      filter: none !important;
      margin-bottom: 4px !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-avatar-ambient,
    #profileViewerModal.profile-ui-v29 .profile-nitro-avatar-ring::before,
    #profileViewerModal.profile-ui-v29 .profile-nitro-avatar-ring::after,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      display: none !important;
      content: none !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-avatar-ring {
      box-shadow: none !important;
      filter: none !important;
      background: none !important;
      padding: 0 !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-avatar-btn {
      width: 112px !important;
      height: 112px !important;
      border-radius: 50% !important;
      border: 2px solid rgba(255,255,255,0.12) !important;
      box-shadow: none !important;
      background: rgba(255,255,255,0.06) !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium .profile-nitro-avatar-btn {
      box-shadow: none !important;
      border: 2px solid rgba(255,255,255,0.12) !important;
    }

    /* Nickname */
    #profileViewerModal.profile-ui-v29 .profile-nitro-name {
      font-size: 28px !important;
      font-weight: 700 !important;
      line-height: 1.1 !important;
      letter-spacing: -0.03em !important;
      text-shadow: none !important;
      background: none !important;
      -webkit-text-fill-color: inherit !important;
    }
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 28px !important;
      font-weight: 700 !important;
      text-shadow: none !important;
      background: none !important;
      -webkit-text-fill-color: inherit !important;
    }

    /* Under name: only Premium line */
    #profileViewerModal.profile-ui-v29 .profile-v29-premium-line {
      font-size: 13px;
      font-weight: 500;
      opacity: 0.72;
      margin-top: 2px;
      margin-bottom: 2px;
    }
    #profileViewerModal.profile-ui-v29 #profileNitroUserId,
    #profileViewerModal.profile-ui-v29 #profileNitroTags,
    #profileViewerModal.profile-ui-v29 #profileNitroInterestTags,
    #profileViewerModal.profile-ui-v29 #profileNitroFocus,
    #profileViewerModal.profile-ui-v29 #profileNitroSocial,
    #profileViewerModal.profile-ui-v29 #profileNitroBadges,
    #profileViewerModal.profile-ui-v29 #profileNitroMeta,
    #profileViewerModal.profile-ui-v29 .profile-nitro-card.is-premium .profile-nitro-identity::before {
      display: none !important;
    }

    /* Reputation host reset */
    #profileViewerModal.profile-ui-v29 #profileNitroRep {
      background: none !important;
      border: none !important;
      padding: 0 !important;
      margin: 4px 0 0 !important;
      box-shadow: none !important;
      filter: none !important;
      width: 100%;
    }
    #profileViewerModal.profile-ui-v29 #profileNitroRep::before,
    #profileViewerModal.profile-ui-v29 #profileNitroRep::after {
      display: none !important;
    }

    /* V29 reputation card */
    .profile-v29-rep-card {
      display: flex;
      align-items: center;
      gap: 16px;
      background: rgba(255,255,255,0.03);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 18px;
      padding: 16px 18px;
      width: 100%;
      box-sizing: border-box;
      cursor: pointer;
    }
    .profile-v29-rep-ring-wrap {
      position: relative;
      width: 88px;
      height: 88px;
      flex-shrink: 0;
    }
    .profile-v29-rep-svg {
      display: block;
      width: 88px;
      height: 88px;
    }
    .profile-v29-rep-ring-inner {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      font-weight: 700;
      letter-spacing: -0.03em;
      line-height: 1;
      color: inherit;
    }
    .profile-v29-rep-content {
      display: flex;
      flex-direction: column;
      gap: 4px;
      min-width: 0;
      text-align: left;
    }
    .profile-v29-rep-score {
      font-size: 26px;
      font-weight: 700;
      letter-spacing: -0.03em;
      line-height: 1;
    }
    .profile-v29-rep-title {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      opacity: 0.5;
      line-height: 1.2;
    }
    .profile-v29-rep-votes {
      display: flex;
      gap: 12px;
      margin-top: 2px;
      font-size: 13px;
      opacity: 0.65;
    }

    /* Streak: plain text */
    #profileViewerModal.profile-ui-v29 .profile-v28-streak {
      padding: 12px 0 2px;
      align-items: center;
    }
    #profileViewerModal.profile-ui-v29 .profile-v28-streak-line {
      font-size: 17px;
      font-weight: 600;
    }
    #profileViewerModal.profile-ui-v29 .profile-v28-streak-sub {
      font-size: 12px;
      opacity: 0.4;
    }

    /* Section titles */
    .profile-v29-section-title,
    #profileViewerModal.profile-ui-v29 .profile-v28-section-title {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      opacity: 0.45;
      margin: 0 0 10px;
    }

    /* Social buttons: 56px */
    #profileViewerModal.profile-ui-v29 .profile-v28-social-btn {
      height: 56px;
    }

    /* Achievements empty state */
    .profile-v29-achievements-empty {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 14px 16px;
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 14px;
      font-size: 13px;
      opacity: 0.55;
    }
    .profile-v29-achievements-empty-ic {
      font-size: 18px;
      opacity: 0.6;
    }

    /* Visibility editor: hide removed profile elements */
    #profileViewerModal.profile-ui-v29 label[for="profileVisShareReputation"],
    #profileViewerModal.profile-ui-v29 label[for="profileVisShareFriends"],
    #profileViewerModal.profile-ui-v29 label[for="profileVisShareDialogs"],
    #profileViewerModal.profile-ui-v29 label[for="profileVisShareChannels"] {
      display: none !important;
    }

    /* ── END PROFILE V29 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V30 — VISUAL POLISH PASS (Apple / Linear / Arc style)
    ═══════════════════════════════════════════════════════════════ */

    /* Typography */
    #profileViewerModal.profile-ui-v30 .profile-nitro-name {
      font-size: 32px !important;
      font-weight: 700 !important;
      letter-spacing: -0.04em !important;
    }
    #profileViewerModal.profile-ui-v30 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 32px !important;
      font-weight: 700 !important;
      letter-spacing: -0.04em !important;
    }
    #profileViewerModal.profile-ui-v30 .profile-v29-premium-line {
      font-size: 16px;
      font-weight: 600;
      opacity: 0.78;
    }

    /* Reputation card spacing */
    .profile-v30-rep-card {
      display: flex;
      align-items: center;
      gap: 24px;
      background: rgba(255,255,255,0.03);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 18px;
      padding: 26px;
      width: 100%;
      box-sizing: border-box;
      cursor: pointer;
    }
    .profile-v30-rep-ring-wrap {
      position: relative;
      width: 112px;
      height: 112px;
      flex-shrink: 0;
    }
    .profile-v30-rep-svg {
      display: block;
      width: 112px;
      height: 112px;
    }
    .profile-v30-rep-ring-score {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 42px;
      font-weight: 800;
      letter-spacing: -0.04em;
      line-height: 1;
      color: inherit;
    }
    .profile-v30-rep-content {
      display: flex;
      flex-direction: column;
      gap: 14px;
      min-width: 0;
      text-align: left;
    }
    .profile-v30-rep-title {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      opacity: 0.5;
      line-height: 1.2;
    }
    .profile-v30-rep-votes {
      display: flex;
      gap: 16px;
      align-items: center;
    }
    .profile-v30-rep-vote {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      font-weight: 600;
    }
    .profile-v30-rep-vote--like { color: #6EEB83; }
    .profile-v30-rep-vote--dislike { color: rgba(255,255,255,0.55); }
    .profile-v30-ic {
      width: 22px;
      height: 22px;
      flex-shrink: 0;
      display: block;
    }

    /* Streak block */
    .profile-v30-streak {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 16px 0 6px;
    }
    .profile-v30-streak-main {
      display: flex;
      align-items: center;
      gap: 8px;
      font-size: 30px;
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -0.02em;
    }
    .profile-v30-streak-sub {
      font-size: 14px;
      opacity: 0.6;
      font-weight: 400;
    }
    .profile-v30-ic-fire {
      width: 22px;
      height: 22px;
    }

    /* Section titles */
    .profile-v30-section-title,
    #profileViewerModal.profile-ui-v30 .profile-v28-section-title,
    #profileViewerModal.profile-ui-v30 .profile-v29-section-title {
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase;
      opacity: 0.45;
      margin: 0 0 10px;
    }

    /* Right column breathing room */
    #profileViewerModal.profile-ui-v30 .profile-viewer-right .profile-v2-block,
    #profileViewerModal.profile-ui-v30 .profile-viewer-right .profile-nitro-panel {
      margin-bottom: 24px !important;
    }
    #profileViewerModal.profile-ui-v30 .profile-viewer-right .profile-v2-block:last-child,
    #profileViewerModal.profile-ui-v30 .profile-viewer-right .profile-nitro-panel:last-child {
      margin-bottom: 0 !important;
    }

    /* Social buttons */
    #profileViewerModal.profile-ui-v30 .profile-v28-social-btn {
      height: 64px;
      padding: 0 20px;
      align-items: center;
    }
    #profileViewerModal.profile-ui-v30 .profile-v28-social-btn:hover {
      transform: translateY(-2px);
      background: rgba(255,255,255,0.04);
      border-color: rgba(255,255,255,0.08);
    }
    #profileViewerModal.profile-ui-v30 .profile-v28-social-ic {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    /* Achievements empty */
    .profile-v30-achievements-empty {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 14px 16px;
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 14px;
      font-size: 13px;
      opacity: 0.55;
    }
    .profile-v30-achievements-empty-ic {
      width: 20px;
      height: 20px;
      opacity: 0.6;
      flex-shrink: 0;
    }

    /* Visibility editor (inherit V29 hides) */
    #profileViewerModal.profile-ui-v30 label[for="profileVisShareReputation"],
    #profileViewerModal.profile-ui-v30 label[for="profileVisShareFriends"],
    #profileViewerModal.profile-ui-v30 label[for="profileVisShareDialogs"],
    #profileViewerModal.profile-ui-v30 label[for="profileVisShareChannels"] {
      display: none !important;
    }

    /* ── END PROFILE V30 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V31 — FINAL VISUAL REFINEMENT
    ═══════════════════════════════════════════════════════════════ */

    .profile-v31-rep-card {
      display: flex;
      align-items: center;
      gap: 24px;
      background: rgba(255,255,255,0.03);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 18px;
      padding: 26px;
      width: 100%;
      box-sizing: border-box;
      cursor: pointer;
    }
    .profile-v31-rep-ring-wrap {
      position: relative;
      width: 112px;
      height: 112px;
      flex-shrink: 0;
    }
    .profile-v31-rep-svg {
      display: block;
      width: 112px;
      height: 112px;
    }
    .profile-v31-rep-ring-score {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 42px;
      font-weight: 800;
      letter-spacing: -0.04em;
      line-height: 1;
      color: rgba(255,255,255,0.92);
    }
    .profile-v31-rep-card.is-positive .profile-v31-rep-ring-score { color: #4ADE80; }
    .profile-v31-rep-card.is-negative .profile-v31-rep-ring-score { color: #EF4444; }
    .profile-v31-rep-card.is-neutral .profile-v31-rep-ring-score { color: #9CA3AF; }
    .profile-v31-rep-card.is-positive .profile-v31-rep-status { color: #86EFAC; }
    .profile-v31-rep-card.is-negative .profile-v31-rep-status { color: #FB7185; }
    .profile-v31-rep-card.is-neutral .profile-v31-rep-status { color: rgba(255,255,255,0.72); }
    .profile-v31-rep-content {
      display: flex;
      flex-direction: column;
      gap: 14px;
      min-width: 0;
      text-align: left;
    }
    .profile-v31-rep-heading {
      display: flex;
      flex-direction: column;
      gap: 2px;
    }
    .profile-v31-rep-label {
      font-size: 12px;
      font-weight: 500;
      opacity: 0.45;
      line-height: 1.2;
    }
    .profile-v31-rep-status {
      font-size: 15px;
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: -0.01em;
    }
    .profile-v31-rep-votes {
      display: flex;
      gap: 16px;
      align-items: center;
    }
    .profile-v31-rep-vote {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 14px;
      font-weight: 600;
      color: rgba(255,255,255,0.55);
    }

    /* Streak — larger fire */
    .profile-v31-streak {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 12px 0 4px;
    }
    .profile-v31-streak-main {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 30px;
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -0.02em;
    }
    .profile-v31-streak-sub {
      font-size: 14px;
      opacity: 0.6;
      font-weight: 400;
    }
    .profile-v31-ic-fire {
      width: 28px;
      height: 28px;
      filter: drop-shadow(0 0 14px rgba(255,138,52,0.25));
    }

    /* Compressed right column spacing (~20% tighter than V30) */
    #profileViewerModal.profile-ui-v31 .profile-viewer-right .profile-v2-block,
    #profileViewerModal.profile-ui-v31 .profile-viewer-right .profile-nitro-panel {
      margin-bottom: 18px !important;
    }
    #profileViewerModal.profile-ui-v31 .profile-viewer-right .profile-v2-block:last-child,
    #profileViewerModal.profile-ui-v31 .profile-viewer-right .profile-nitro-panel:last-child {
      margin-bottom: 0 !important;
    }

    /* Social buttons — +4px horizontal padding */
    #profileViewerModal.profile-ui-v31 .profile-v28-social-btn {
      height: 64px;
      padding: 0 24px;
    }

    .profile-v31-section-title,
    #profileViewerModal.profile-ui-v31 .profile-v30-section-title,
    #profileViewerModal.profile-ui-v31 .profile-v28-section-title {
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase;
      opacity: 0.45;
      margin: 0 0 8px;
    }

    .profile-v31-achievements-empty {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 4px 0;
      font-size: 13px;
      opacity: 0.55;
      background: none;
      border: none;
    }
    .profile-v31-achievements-empty-ic {
      width: 22px;
      height: 22px;
      opacity: 0.65;
      flex-shrink: 0;
    }

    /* ── END PROFILE V31 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V32 — PREMIUM REPUTATION ICONS
    ═══════════════════════════════════════════════════════════════ */

    .profile-v32-rep-vote {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      font-size: 14px;
      font-weight: 600;
      color: rgba(255,255,255,0.55);
    }

    .profile-v32-streak {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 12px 0 4px;
    }
    .profile-v32-streak-main {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 30px;
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -0.02em;
    }
    .profile-v32-streak-sub {
      font-size: 14px;
      opacity: 0.6;
      font-weight: 400;
    }
    .profile-v32-ic-fire {
      width: 28px;
      height: 28px;
      filter: drop-shadow(0 0 14px rgba(255,138,52,0.25));
    }

    #profileViewerModal.profile-ui-v32 .profile-v31-rep-votes {
      gap: 18px;
    }

    .profile-v32-section-title,
    #profileViewerModal.profile-ui-v32 .profile-v31-section-title,
    #profileViewerModal.profile-ui-v32 .profile-v30-section-title,
    #profileViewerModal.profile-ui-v32 .profile-v28-section-title {
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase;
      opacity: 0.45;
      margin: 0 0 8px;
    }

    /* ── END PROFILE V32 ─────────────────────────────────────────── */

    /* Reputation vote icons — PNG assets (vverx.png / vniz.png) */
    .profile-reputation-icon {
      width: 24px;
      height: 24px;
      object-fit: contain;
      display: block;
      flex-shrink: 0;
      transition: transform .18s ease, opacity .18s ease, filter .18s ease;
    }
    .profile-reputation-icon:hover {
      transform: scale(1.08);
    }
    .profile-reputation-icon--like-active {
      opacity: 1;
      filter: drop-shadow(0 0 10px rgba(34,197,94,0.25));
    }
    .profile-reputation-icon--dislike-active {
      opacity: 1;
      filter: drop-shadow(0 0 10px rgba(220,38,38,0.25));
    }
    .profile-reputation-icon--inactive {
      opacity: 0.45;
      filter: grayscale(100%);
    }

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V33 — COMPOSITION REBALANCE
    ═══════════════════════════════════════════════════════════════ */

    #profileViewerModal.profile-ui-v33 .profile-nitro-avatar-ambient,
    #profileViewerModal.profile-ui-v33 .profile-nitro-avatar-ring::before,
    #profileViewerModal.profile-ui-v33 .profile-nitro-avatar-ring::after,
    #profileViewerModal.profile-ui-v33 .profile-nitro-card.is-premium .profile-nitro-avatar-ring::before {
      display: none !important;
      content: none !important;
    }
    #profileViewerModal.profile-ui-v33 .profile-nitro-avatar-ring {
      box-shadow: none !important;
      filter: none !important;
      background: none !important;
      padding: 0 !important;
    }

    /* Left column: compact passport, no dead space */
    #profileViewerModal.profile-ui-v33 .profile-nitro-card {
      align-self: flex-start;
      height: auto;
    }
    #profileViewerModal.profile-ui-v33 .profile-nitro-body {
      padding: 18px 16px 10px !important;
      gap: 4px !important;
      margin-top: 0 !important;
    }
    #profileViewerModal.profile-ui-v33 .profile-nitro-identity {
      width: 100%;
    }

    /* Avatar 128px — thin border, no glow */
    #profileViewerModal.profile-ui-v33 .profile-nitro-avatar-stage {
      width: 128px !important;
      height: 128px !important;
      filter: none !important;
      margin-bottom: 6px !important;
    }
    #profileViewerModal.profile-ui-v33 .profile-nitro-avatar-btn {
      width: 128px !important;
      height: 128px !important;
      border: 2px solid rgba(255,255,255,0.14) !important;
      box-shadow: none !important;
    }
    #profileViewerModal.profile-ui-v33 .profile-nitro-card.is-premium .profile-nitro-avatar-btn {
      border: 2px solid rgba(255,255,255,0.14) !important;
      box-shadow: none !important;
    }

    /* Nickname — primary identity anchor */
    #profileViewerModal.profile-ui-v33 .profile-nitro-name,
    #profileViewerModal.profile-ui-v33 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 34px !important;
      font-weight: 700 !important;
      letter-spacing: -0.04em !important;
      line-height: 1.08 !important;
      text-shadow: none !important;
      background: none !important;
      -webkit-text-fill-color: inherit !important;
      margin-bottom: 0 !important;
    }
    #profileViewerModal.profile-ui-v33 .profile-v29-premium-line {
      margin-top: 4px;
      margin-bottom: 6px;
    }

    /* Reputation host + larger card */
    #profileViewerModal.profile-ui-v33 #profileNitroRep {
      margin: 6px 0 0 !important;
      width: 100%;
    }
    .profile-v33-rep-card {
      display: flex;
      align-items: center;
      gap: 28px;
      background: rgba(255,255,255,0.03);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 18px;
      padding: 32px 26px;
      width: 100%;
      box-sizing: border-box;
      cursor: pointer;
    }
    .profile-v33-rep-ring-wrap {
      position: relative;
      width: 140px;
      height: 140px;
      flex-shrink: 0;
    }
    .profile-v33-rep-svg {
      display: block;
      width: 140px;
      height: 140px;
    }
    .profile-v33-rep-ring-score {
      position: absolute;
      inset: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 52px;
      font-weight: 800;
      letter-spacing: -0.04em;
      line-height: 1;
      color: rgba(255,255,255,0.92);
    }
    .profile-v33-rep-card.is-positive .profile-v33-rep-ring-score { color: #4ADE80; }
    .profile-v33-rep-card.is-negative .profile-v33-rep-ring-score { color: #EF4444; }
    .profile-v33-rep-card.is-neutral .profile-v33-rep-ring-score { color: #9CA3AF; }
    .profile-v33-rep-content {
      display: flex;
      flex-direction: column;
      gap: 16px;
      min-width: 0;
      text-align: left;
    }
    .profile-v33-rep-heading {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }
    .profile-v33-rep-label {
      font-size: 13px;
      font-weight: 500;
      opacity: 0.5;
      line-height: 1.2;
    }
    .profile-v33-rep-status {
      font-size: 18px;
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: -0.01em;
    }
    .profile-v33-rep-card.is-positive .profile-v33-rep-status { color: #86EFAC; }
    .profile-v33-rep-card.is-negative .profile-v33-rep-status { color: #FB7185; }
    .profile-v33-rep-card.is-neutral .profile-v33-rep-status { color: rgba(255,255,255,0.78); }
    .profile-v33-rep-votes {
      display: flex;
      gap: 20px;
      align-items: center;
    }
    .profile-v33-rep-vote {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      font-size: 16px;
      font-weight: 600;
      color: rgba(255,255,255,0.62);
    }

    /* Streak — continuation of reputation block */
    #profileViewerModal.profile-ui-v33 #profileNitroMetrics.profile-v33-streak-host {
      display: block !important;
      width: 100%;
      margin: 0 !important;
      padding: 0 !important;
      opacity: 1 !important;
    }
    .profile-v33-streak {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      margin-top: 20px;
      padding: 0 0 2px;
    }
    .profile-v33-streak-fire {
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 0;
    }
    .profile-v33-streak-days {
      font-size: 30px;
      font-weight: 700;
      line-height: 1.1;
      letter-spacing: -0.02em;
    }
    .profile-v33-streak-sub {
      font-size: 14px;
      opacity: 0.6;
      font-weight: 400;
    }
    .profile-v33-streak .profile-v32-ic-fire {
      width: 28px;
      height: 28px;
    }

    /* Right column — tighter section rhythm (~15% less than V31) */
    #profileViewerModal.profile-ui-v33 .profile-viewer-right .profile-v2-block,
    #profileViewerModal.profile-ui-v33 .profile-viewer-right .profile-nitro-panel {
      margin-bottom: 15px !important;
    }
    #profileViewerModal.profile-ui-v33 .profile-viewer-right .profile-v2-block:last-child,
    #profileViewerModal.profile-ui-v33 .profile-viewer-right .profile-nitro-panel:last-child {
      margin-bottom: 0 !important;
    }

    /* Achievements — ~50% lighter visual weight */
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase {
      gap: 8px;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card {
      min-height: 68px;
      max-width: 118px;
      padding: 8px 6px 7px;
      border-color: rgba(255,255,255,0.07) !important;
      background: rgba(255,255,255,0.02) !important;
      box-shadow: none !important;
      opacity: 0.72;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-frame {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      border-color: rgba(255,255,255,0.08) !important;
      box-shadow: none !important;
      background: rgba(255,255,255,0.04) !important;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-ic {
      font-size: 18px;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-rarity {
      font-size: 8px;
      font-weight: 700;
      opacity: 0.55;
      letter-spacing: 0.06em;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-name {
      font-size: 10px;
      font-weight: 600;
      opacity: 0.75;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--legendary,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--epic,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--rare,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--mythic,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--uncommon {
      border-color: rgba(255,255,255,0.08) !important;
      box-shadow: none !important;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--legendary .profile-nitro-showcase-frame,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--epic .profile-nitro-showcase-frame,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--rare .profile-nitro-showcase-frame,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--mythic .profile-nitro-showcase-frame {
      box-shadow: none !important;
      border-color: rgba(255,255,255,0.08) !important;
    }
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--legendary .profile-nitro-showcase-rarity,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--epic .profile-nitro-showcase-rarity,
    #profileViewerModal.profile-ui-v33 #profileViewerAchievements .profile-nitro-showcase-card--rare .profile-nitro-showcase-rarity {
      color: rgba(255,255,255,0.45) !important;
    }

    .profile-v33-section-title,
    #profileViewerModal.profile-ui-v33 .profile-v32-section-title,
    #profileViewerModal.profile-ui-v33 .profile-v31-section-title,
    #profileViewerModal.profile-ui-v33 .profile-v30-section-title,
    #profileViewerModal.profile-ui-v33 .profile-v28-section-title {
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase;
      opacity: 0.45;
      margin: 0 0 8px;
    }

    /* ── END PROFILE V33 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V34 — COMPACT POLISH PASS
    ═══════════════════════════════════════════════════════════════ */

    /* Typography hierarchy */
    #profileViewerModal.profile-ui-v34 .profile-nitro-name,
    #profileViewerModal.profile-ui-v34 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 34px !important;
      font-weight: 700 !important;
    }
    .profile-v34-section-title,
    #profileViewerModal.profile-ui-v34 .profile-v33-section-title,
    #profileViewerModal.profile-ui-v34 .profile-v32-section-title,
    #profileViewerModal.profile-ui-v34 .profile-v31-section-title,
    #profileViewerModal.profile-ui-v34 .profile-v30-section-title,
    #profileViewerModal.profile-ui-v34 .profile-v28-section-title {
      font-size: 12px !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase;
      opacity: 0.65 !important;
      margin: 0 0 6px;
    }

    /* About — tighter block */
    #profileViewerModal.profile-ui-v34 #profileViewerAbout.profile-nitro-panel--about-hero {
      padding: 16px !important;
      box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
    }
    #profileViewerModal.profile-ui-v34 .profile-nitro-about-quote {
      font-size: 15px !important;
      line-height: 1.5 !important;
      font-weight: 450;
    }
    #profileViewerModal.profile-ui-v34 .profile-nitro-panel--about-hero .profile-nitro-about-quote::before {
      font-size: 36px;
      line-height: 0.8;
      margin-bottom: 2px;
    }
    #profileViewerModal.profile-ui-v34 .profile-nitro-about-empty {
      font-size: 15px;
      line-height: 1.45;
      opacity: 0.6;
    }

    /* Channel — denser featured card */
    #profileViewerModal.profile-ui-v34 .profile-v28-channel-card {
      gap: 8px;
      padding: 8px 12px;
      border-radius: 10px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-channel-av {
      width: 36px;
      height: 36px;
      border-radius: 8px;
      font-size: 12px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-channel-info {
      gap: 1px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-channel-name {
      font-size: 15px;
      font-weight: 600;
      line-height: 1.25;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-channel-desc {
      font-size: 13px;
      opacity: 0.6;
      line-height: 1.35;
      -webkit-line-clamp: 1;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-channel-meta {
      font-size: 13px;
      opacity: 0.6;
      margin-top: 0;
      gap: 4px;
    }

    /* Social — compact action buttons */
    #profileViewerModal.profile-ui-v34 .profile-v28-social-stack {
      gap: 6px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-social-btn {
      height: 48px !important;
      padding: 0 16px !important;
      gap: 10px;
      border-radius: 10px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-social-btn:hover {
      transform: translateY(-1px);
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-social-ic {
      width: 20px !important;
      height: 20px !important;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-social-label {
      font-size: 16px !important;
      font-weight: 500;
    }
    #profileViewerModal.profile-ui-v34 .profile-v28-social-arrow {
      width: 14px;
      height: 14px;
    }

    /* Right column — tighter rhythm (~20% less than V33) */
    #profileViewerModal.profile-ui-v34 .profile-viewer-right .profile-v2-block,
    #profileViewerModal.profile-ui-v34 .profile-viewer-right .profile-nitro-panel {
      margin-bottom: 12px !important;
    }
    #profileViewerModal.profile-ui-v34 .profile-viewer-right .profile-v2-block:last-child,
    #profileViewerModal.profile-ui-v34 .profile-viewer-right .profile-nitro-panel:last-child {
      margin-bottom: 0 !important;
    }

    /* Achievements — always empty-state, centered */
    .profile-v34-achievements-empty {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      padding: 16px 12px;
      text-align: center;
      font-size: 13px;
      opacity: 0.6;
      background: none;
      border: none;
    }
    .profile-v34-achievements-empty-ic {
      font-size: 22px;
      line-height: 1;
      opacity: 0.75;
    }

    /* Left column — compact reputation + streak (~12%) */
    #profileViewerModal.profile-ui-v34 .profile-nitro-body {
      padding-bottom: 8px !important;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-card {
      padding: 26px 22px;
      gap: 22px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-ring-wrap,
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-svg {
      width: 120px;
      height: 120px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-ring-score {
      font-size: 44px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-content {
      gap: 12px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-label {
      font-size: 13px;
      opacity: 0.6;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-status {
      font-size: 16px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-rep-vote {
      font-size: 15px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-streak {
      margin-top: 16px;
      gap: 4px;
      padding-bottom: 0;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-streak-days {
      font-size: 26px;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-streak-sub {
      font-size: 13px;
      opacity: 0.6;
    }
    #profileViewerModal.profile-ui-v34 .profile-v33-streak .profile-v32-ic-fire {
      width: 24px;
      height: 24px;
    }

    /* ── END PROFILE V34 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V35 — COMPACT LAYOUT, VOTE BUTTONS, LEFT NOTES
    ═══════════════════════════════════════════════════════════════ */

    .profile-reputation-vote,
    .profile-reputation-vote-btn,
    .profile-reputation-vote-icon-wrapper {
      background: transparent !important;
      border: none !important;
      box-shadow: none !important;
    }

    #profileViewerModal.profile-ui-v35 .profile-reputation-icon,
    #profileViewerModal.profile-ui-v35 .profile-reputation-icon.profile-reputation-icon--fallback {
      width: 28px;
      height: 28px;
      object-fit: contain;
      background: transparent !important;
      background-color: transparent !important;
      border: none !important;
      box-shadow: none !important;
      padding: 0 !important;
      mix-blend-mode: lighten;
    }
    #profileViewerModal.profile-ui-v35 .profile-reputation-vote-icon-wrapper,
    #profileViewerModal.profile-ui-v35 .profile-v33-rep-vote {
      background: transparent !important;
      background-color: transparent !important;
    }

    .profile-v35-streak-icon {
      width: 28px;
      height: 28px;
      object-fit: contain;
      display: block;
      background: transparent !important;
      mix-blend-mode: lighten;
    }

    #profileViewerModal.profile-ui-v35:not(.profile-ui-v37) #profileNitroStatus {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v35 #profileViewerV2Sections {
      display: flex;
      flex-direction: column;
    }
    #profileViewerModal.profile-ui-v35 #profileViewerStatusPanel { order: 1; }
    #profileViewerModal.profile-ui-v35 #profileViewerChannelsList { order: 2; }
    #profileViewerModal.profile-ui-v35 #profileViewerSocialPills { order: 3; }
    #profileViewerModal.profile-ui-v35 #profileViewerAchievements { order: 4; }
    #profileViewerModal.profile-ui-v35 #profileViewerAbout { order: 99; display: none !important; }

    .profile-v35-status-card {
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 14px;
      padding: 14px 16px;
      font-size: 15px;
      line-height: 1.45;
      color: rgba(255,255,255,0.88);
      word-break: break-word;
    }

    .profile-v35-notes-label {
      display: block;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      opacity: 0.55;
      margin: 0 0 8px;
    }
    .profile-v35-notes-input {
      width: 100%;
      box-sizing: border-box;
      min-height: 56px;
      resize: vertical;
      border: none;
      outline: none;
      background: transparent;
      color: rgba(255,255,255,0.88);
      font: inherit;
      font-size: 15px;
      line-height: 1.45;
      padding: 0;
    }
    .profile-v35-notes-input::placeholder {
      color: rgba(255,255,255,0.4);
    }

    #profileViewerModal.profile-ui-v35 .profile-nitro-name,
    #profileViewerModal.profile-ui-v35 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 34px !important;
      font-weight: 700 !important;
      line-height: 1.1 !important;
    }
    #profileViewerModal.profile-ui-v35 .profile-v29-premium-line,
    #profileViewerModal.profile-ui-v35 .profile-nitro-premium {
      font-size: 17px !important;
      font-weight: 500;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-rep-label,
    #profileViewerModal.profile-ui-v35 .profile-v33-rep-status {
      font-size: 15px !important;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-rep-vote,
    #profileViewerModal.profile-ui-v35 .profile-reputation-vote-count {
      font-size: 15px !important;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-streak-sub,
    #profileViewerModal.profile-ui-v35 .profile-v28-channel-desc,
    #profileViewerModal.profile-ui-v35 .profile-v28-channel-meta {
      font-size: 13px !important;
    }

    .profile-reputation-vote-btn {
      display: inline-flex;
      align-items: center;
      gap: 12px;
      padding: 0;
      margin: 0;
      cursor: pointer;
      font: inherit;
      color: rgba(255,255,255,0.62);
    }
    .profile-reputation-vote-btn:disabled {
      cursor: default;
      opacity: 0.7;
    }
    .profile-reputation-vote-btn:not(:disabled):hover .profile-reputation-icon {
      transform: scale(1.08);
    }

    .profile-v35-section-title,
    #profileViewerModal.profile-ui-v35 .profile-v34-section-title,
    #profileViewerModal.profile-ui-v35 .profile-v33-section-title,
    #profileViewerModal.profile-ui-v35 .profile-v32-section-title,
    #profileViewerModal.profile-ui-v35 .profile-v31-section-title,
    #profileViewerModal.profile-ui-v35 .profile-v30-section-title,
    #profileViewerModal.profile-ui-v35 .profile-v28-section-title {
      font-size: 13px !important;
      font-weight: 700 !important;
      letter-spacing: 0.12em !important;
      text-transform: uppercase;
      opacity: 0.65 !important;
      margin: 0 0 4px;
    }

    #profileViewerModal.profile-ui-v35 #profileViewerAbout {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v35 #profileNitroNotes.profile-v35-notes-host {
      display: block;
      width: 100%;
      margin: 10px 0 0;
      padding: 0;
    }

    .profile-v35-notes {
      width: 100%;
      box-sizing: border-box;
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.06);
      border-radius: 16px;
      padding: 16px;
      min-height: 70px;
      font-size: 15px;
      line-height: 1.5;
      color: rgba(255,255,255,0.88);
      word-break: break-word;
    }
    .profile-v35-notes--empty {
      display: flex;
      align-items: center;
      color: rgba(255,255,255,0.55);
      opacity: 0.75;
    }

    .profile-v35-achievements-empty {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-height: 90px;
      padding: 12px;
      text-align: center;
      font-size: 13px;
      opacity: 0.6;
      background: none;
      border: none;
    }
    .profile-v35-achievements-empty-ic {
      font-size: 20px;
      line-height: 1;
      opacity: 0.75;
    }

    #profileViewerModal.profile-ui-v35 .profile-viewer-right .profile-v2-block,
    #profileViewerModal.profile-ui-v35 .profile-viewer-right .profile-nitro-panel {
      margin-bottom: 8px !important;
    }

    #profileViewerModal.profile-ui-v35 .profile-nitro-body {
      padding-bottom: 4px !important;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-rep-card {
      padding: 18px 16px;
      gap: 14px;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-streak {
      margin-top: 10px;
      gap: 2px;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-streak-days {
      font-size: 24px;
    }
    #profileViewerModal.profile-ui-v35 .profile-v33-rep-votes {
      gap: 16px;
    }

    #profileViewerModal.profile-ui-v35 .profile-v28-social-stack {
      gap: 5px;
    }
    #profileViewerModal.profile-ui-v35 .profile-v28-social-btn {
      height: 41px !important;
      padding: 0 14px !important;
    }
    #profileViewerModal.profile-ui-v35 .profile-v28-social-label {
      font-size: 15px !important;
    }

    #profileViewerModal.profile-ui-v35 .profile-v28-channel-card {
      gap: 6px;
      padding: 7px 10px;
    }

    /* ── END PROFILE V35 ─────────────────────────────────────────── */

    /* ═══════════════════════════════════════════════════════════════
       PROFILE V36 — HTML REFERENCE LAYOUT (exact sizes & hierarchy)
    ═══════════════════════════════════════════════════════════════ */

    #profileViewerModal.profile-ui-v36 .modal.modal--profile-viewer {
      width: min(1520px, 95vw);
      padding: 28px;
    }

    #profileViewerModal.profile-ui-v36 .profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 640px 1fr !important;
      gap: 28px !important;
      max-width: none !important;
      align-items: start;
    }

    #profileViewerModal.profile-ui-v36 .profile-nitro-card {
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 22px;
      backdrop-filter: blur(20px);
    }

    #profileViewerModal.profile-ui-v36 .profile-viewer-right {
      display: flex;
      flex-direction: column;
      gap: 18px;
      min-width: 0;
    }

    #profileViewerModal.profile-ui-v36 .profile-nitro-body {
      display: flex;
      flex-direction: column;
      align-items: center;
      text-align: center;
      padding: 34px !important;
      gap: 0;
    }

    #profileViewerModal.profile-ui-v36 .profile-nitro-identity {
      width: 100%;
      display: flex;
      flex-direction: column;
      align-items: center;
    }

    #profileViewerModal.profile-ui-v36 .profile-nitro-avatar-stage {
      margin-bottom: 24px;
    }
    #profileViewerModal.profile-ui-v36 .profile-nitro-avatar-btn {
      width: 190px !important;
      height: 190px !important;
      border-radius: 50% !important;
      border: 4px solid rgba(180,140,255,0.8) !important;
      box-shadow: 0 0 40px rgba(140,90,255,0.3);
    }
    #profileViewerModal.profile-ui-v36 .profile-nitro-avatar-img,
    #profileViewerModal.profile-ui-v36 .profile-nitro-avatar-fallback {
      width: 100% !important;
      height: 100% !important;
    }

    #profileViewerModal.profile-ui-v36 .profile-nitro-name,
    #profileViewerModal.profile-ui-v36 .profile-nitro-card.is-premium .profile-nitro-name {
      font-size: 58px !important;
      font-weight: 800 !important;
      line-height: 1.05 !important;
      letter-spacing: -0.02em !important;
      margin: 0 0 8px;
    }

    #profileViewerModal.profile-ui-v36 .profile-v29-premium-line,
    #profileViewerModal.profile-ui-v36 .profile-nitro-premium {
      font-size: 18px !important;
      font-weight: 600 !important;
      margin: 0 0 32px;
      color: #d4d7df;
    }
    #profileViewerModal.profile-ui-v36 .profile-v29-premium-line .profile-v29-premium-star,
    #profileViewerModal.profile-ui-v36 .profile-nitro-premium .profile-v29-premium-star {
      color: #f4c84c;
    }

    #profileViewerModal.profile-ui-v36 #profileNitroRep {
      width: 100%;
      margin-top: 0 !important;
    }

    #profileViewerModal.profile-ui-v36 .profile-v33-rep-card {
      padding: 28px !important;
      gap: 36px !important;
      border-radius: 22px;
      align-items: center;
      background: rgba(255,255,255,0.015);
      border: 1px solid rgba(255,255,255,0.08);
    }

    #profileViewerModal.profile-ui-v36 .profile-v33-rep-ring-wrap,
    #profileViewerModal.profile-ui-v36 .profile-v33-rep-svg {
      width: 190px !important;
      height: 190px !important;
    }

    #profileViewerModal.profile-ui-v36 .profile-v33-rep-ring-score {
      font-size: 60px !important;
      font-weight: 800 !important;
      color: #32ef79;
    }

    #profileViewerModal.profile-ui-v36 .profile-v33-rep-label {
      font-size: 18px !important;
      color: #aeb4c5;
      opacity: 1;
      margin-bottom: 10px;
    }
    #profileViewerModal.profile-ui-v36 .profile-v33-rep-status {
      font-size: 22px !important;
      font-weight: 700;
      color: #39ef7b;
      margin-bottom: 28px;
    }
    #profileViewerModal.profile-ui-v36 .profile-v33-rep-vote,
    #profileViewerModal.profile-ui-v36 .profile-reputation-vote-count {
      font-size: 18px !important;
      font-weight: 600;
      color: #bfc5d3;
    }

    #profileViewerModal.profile-ui-v36 .profile-reputation-icon,
    #profileViewerModal.profile-ui-v36 .profile-reputation-icon.profile-reputation-icon--fallback {
      width: 28px !important;
      height: 28px !important;
    }

    .profile-v36-streak {
      display: flex;
      align-items: center;
      gap: 22px;
      width: 100%;
      box-sizing: border-box;
      margin: 34px 0;
      padding: 0;
      background: none;
      border: none;
      text-align: left;
    }
    .profile-v36-streak-icon {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      line-height: 0;
      font-size: 68px;
    }
    .profile-v36-streak-icon .profile-v35-streak-icon,
    .profile-v36-streak-icon .profile-v32-ic-fire {
      width: 68px !important;
      height: 68px !important;
    }
    .profile-v36-streak-copy {
      display: flex;
      flex-direction: column;
      gap: 6px;
      min-width: 0;
    }
    .profile-v36-streak-title {
      font-size: 28px;
      font-weight: 700;
      line-height: 1.15;
      margin: 0;
    }
    .profile-v36-streak-sub {
      font-size: 18px;
      font-weight: 400;
      color: #b2b8c7;
      line-height: 1.2;
      margin: 0;
    }

    .profile-v36-note-box {
      width: 100%;
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 20px;
      padding: 18px;
      box-sizing: border-box;
    }
    .profile-v36-note-title {
      color: #9ea5b5;
      margin-bottom: 14px;
      font-size: 18px;
      text-align: left;
    }
    .profile-v36-note-content {
      width: 100%;
      min-height: 86px;
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 16px;
      padding: 20px;
      font-size: 28px;
      line-height: 1.35;
      background: transparent;
      color: inherit;
      resize: vertical;
      box-sizing: border-box;
      font-family: inherit;
    }

    #profileViewerModal.profile-ui-v36 #profileNitroNotes.profile-v35-notes-host {
      margin-top: 0;
      width: 100%;
    }

    #profileViewerModal.profile-ui-v36 #profileViewerV2Sections {
      gap: 18px;
      display: flex;
      flex-direction: column;
    }

    .profile-v36-section-title,
    #profileViewerModal.profile-ui-v36 .profile-v35-section-title,
    #profileViewerModal.profile-ui-v36 .profile-v34-section-title,
    #profileViewerModal.profile-ui-v36 .profile-v28-section-title {
      font-size: 14px !important;
      font-weight: 700 !important;
      letter-spacing: 0.14em !important;
      text-transform: uppercase;
      color: #aab1c0 !important;
      opacity: 1 !important;
      margin: 0 0 16px !important;
    }

    .profile-v36-about-box {
      min-height: 64px;
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 18px;
      padding: 18px 22px;
      display: flex;
      align-items: center;
      font-size: 28px;
      line-height: 1.35;
      word-break: break-word;
    }
    .profile-v36-about-box--empty {
      color: #8e95a7;
      font-size: 18px;
    }

    #profileViewerModal.profile-ui-v36 .profile-viewer-right .profile-v2-block:not(.hidden),
    #profileViewerModal.profile-ui-v36 .profile-viewer-right .profile-nitro-panel:not(.hidden) {
      background: rgba(255,255,255,0.02);
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 22px;
      padding: 26px !important;
      margin-bottom: 0 !important;
    }

    #profileViewerModal.profile-ui-v36 .profile-v28-channel-card {
      padding: 16px;
      border-radius: 18px;
      gap: 18px;
      border: 1px solid rgba(255,255,255,0.08);
      background: transparent;
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-channel-av {
      width: 90px;
      height: 90px;
      border-radius: 18px;
      font-size: 34px;
      font-weight: 800;
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-channel-name {
      font-size: 18px;
      font-weight: 700;
      margin-bottom: 6px;
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-channel-desc {
      font-size: 16px;
      color: #b5bbca;
      line-height: 1.5;
      margin-bottom: 10px;
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-channel-meta {
      font-size: 16px;
      color: #a7afc0;
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-channel-meta .profile-v28-channel-active {
      color: #34eb72;
    }

    #profileViewerModal.profile-ui-v36 .profile-v28-social-stack {
      gap: 12px;
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-social-btn {
      height: 64px !important;
      border-radius: 18px !important;
      padding: 0 22px !important;
      border: 1px solid rgba(255,255,255,0.08);
    }
    #profileViewerModal.profile-ui-v36 .profile-v28-social-label {
      font-size: 18px !important;
      font-weight: 600;
    }

    #profileViewerModal.profile-ui-v36 .profile-v35-achievements-empty {
      min-height: 120px;
      padding: 20px;
      font-size: 16px;
      border: 1px solid rgba(255,255,255,0.08);
      border-radius: 18px;
      color: #aab1c0;
    }

    #profileViewerModal.profile-ui-v36 #profileViewerAbout { order: 1; display: block !important; }
    #profileViewerModal.profile-ui-v36 #profileViewerStatusPanel { order: 99; display: none !important; }
    #profileViewerModal.profile-ui-v36 #profileViewerChannelsList { order: 2; }
    #profileViewerModal.profile-ui-v36 #profileViewerSocialPills { order: 3; }
    #profileViewerModal.profile-ui-v36 #profileViewerAchievements { order: 4; }
    #profileViewerModal.profile-ui-v36 #profileNitroStatus { display: none !important; }

    @media (max-width: 1200px) {
      #profileViewerModal.profile-ui-v36 .profile-viewer-layout.profile-nitro-layout {
        grid-template-columns: 1fr !important;
      }
      #profileViewerModal.profile-ui-v36 .profile-nitro-name,
      #profileViewerModal.profile-ui-v36 .profile-nitro-card.is-premium .profile-nitro-name {
        font-size: 42px !important;
      }
    }

    /* ── END PROFILE V36 ─────────────────────────────────────────── */

        /* ═══════════════════════════════════════════════════════════════
       PROFILE MODAL — 1:1 reference (extracted-App.tsx / profile-modal.html)
    ═══════════════════════════════════════════════════════════════ */

    .profile-modal__body {
      display: flex;
      flex: 1;
      padding: 20px 24px 24px;
      gap: 0;
      overflow: hidden;
      min-height: 0;
    }

    .profile-modal__left {
      width: 360px;
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      padding-right: 28px;
    }

    #profileViewerModal .profile-modal {
      width: 1060px;
      height: 780px;
      border-radius: 18px;
      background: linear-gradient(160deg, #141b2c 0%, #111725 55%, #10161f 100%);
      backdrop-filter: blur(20px);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.05), 0 0 80px rgba(0, 0, 0, 0.6);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      position: relative;
    }

    .profile-modal__highlight {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 1px;
      background: linear-gradient(90deg, transparent 0%, rgba(255, 255, 255, 0.08) 40%, rgba(255, 255, 255, 0.08) 60%, transparent 100%);
      pointer-events: none;
    }

    .profile-modal__header {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 18px 24px 0;
      position: relative;
      flex-shrink: 0;
    }

    .profile-modal__title {
      font-size: 14px;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.4);
      letter-spacing: 0.3px;
    }

    .profile-modal__close-btn {
      position: absolute;
      right: 18px;
      top: 14px;
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 8px;
      width: 28px;
      height: 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      color: #6b7a99;
      padding: 0;
    }

    .profile-modal__avatar-wrap {
      position: relative;
      margin-bottom: 14px;
    }

    .profile-modal__avatar-wrap::before {
      display: none;
    }

    .profile-modal__avatar-glow {
      display: none;
    }

    .profile-modal__avatar-ring {
      position: relative;
      z-index: 1;
      width: 130px;
      height: 130px;
      border-radius: 50%;
      background: linear-gradient(135deg, #7c3aed 0%, #4f1d96 100%);
      padding: 2.5px;
      box-shadow:
        0 0 12px rgba(124, 58, 237, 0.42),
        0 0 24px rgba(124, 58, 237, 0.18);
    }

    .profile-modal__avatar-inner {
      position: relative;
      z-index: 2;
      width: 100%;
      height: 100%;
      border-radius: 50%;
      background: #130d30;
      display: flex;
      align-items: center;
      justify-content: center;
      overflow: hidden;
    }

    .profile-modal__avatar-online {
      position: absolute;
      bottom: 6px;
      right: 6px;
      z-index: 2;
      width: 16px;
      height: 16px;
      border-radius: 50%;
      background: #42e77a;
      border: 2.5px solid #111725;
      box-shadow: 0 0 8px rgba(66, 231, 122, 0.6);
    }

    .profile-modal__nickname {
      font-size: 26px;
      font-weight: 800;
      color: #fff;
      line-height: 1;
      text-align: center;
      margin-bottom: 8px;
      letter-spacing: -0.3px;
    }

    .profile-modal__premium {
      display: inline-flex;
      align-items: center;
      gap: 5px;
      padding: 4px 11px;
      border-radius: 20px;
      background: linear-gradient(90deg, rgba(245, 197, 66, 0.12) 0%, rgba(255, 214, 0, 0.07) 100%);
      border: 1px solid rgba(245, 197, 66, 0.22);
      font-size: 12px;
      font-weight: 600;
      color: #f5c542;
      margin-bottom: 20px;
      letter-spacing: 0.2px;
    }

    .profile-modal__status {
      position: relative;
      z-index: 2;
      width: 100%;
      text-align: center;
      margin: -6px 0 14px;
      opacity: 1;
      filter: none;
      mix-blend-mode: normal;
      pointer-events: none;
    }

    .profile-modal__status.hidden {
      display: none !important;
    }

    #profileViewerModal.profile-ui-v37 #profileNitroStatus:not(.hidden) {
      display: block !important;
      visibility: visible !important;
      opacity: 1 !important;
    }

    #profileViewerModal.profile-ui-v37 #profileNitroStatus .profile-v10-status {
      color: #fff !important;
      -webkit-text-fill-color: #fff !important;
      opacity: 1 !important;
      filter: none !important;
      mix-blend-mode: normal !important;
      background: none !important;
      border: none !important;
      box-shadow: none !important;
      border-radius: 0 !important;
      text-shadow: 0 1px 4px rgba(0, 0, 0, 0.55);
      font-size: 14px;
      line-height: 1.45;
      padding: 0 10px;
    }

    #profileViewerModal .profile-modal .profile-card {
      border-radius: 14px;
      border: 1px solid rgba(255, 255, 255, 0.06);
      background: rgba(255, 255, 255, 0.018);
    }

    .profile-modal__rep-card {
      width: 100%;
      height: 160px;
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0 20px;
      margin-bottom: 10px;
      background: rgba(66, 231, 122, 0.03);
      border: 1px solid rgba(66, 231, 122, 0.1);
    }

    .profile-modal__rep-info {
      display: flex;
      flex-direction: column;
      gap: 3px;
    }

    .profile-modal__rep-label {
      font-size: 11px;
      color: #9ea7ba;
      font-weight: 500;
      letter-spacing: 0.5px;
    }

    .profile-modal__rep-status {
      font-size: 15px;
      font-weight: 700;
      color: #42e77a;
      margin-bottom: 6px;
    }

    .profile-modal__rep-votes {
      display: flex;
      gap: 8px;
    }

    .profile-modal__vote-up {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 13px;
      font-weight: 600;
      color: #42e77a;
      background: rgba(66, 231, 122, 0.1);
      padding: 3px 8px;
      border-radius: 6px;
    }

    .profile-modal__vote-down {
      display: flex;
      align-items: center;
      gap: 4px;
      font-size: 13px;
      font-weight: 600;
      color: #e74242;
      background: rgba(231, 66, 66, 0.1);
      padding: 3px 8px;
      border-radius: 6px;
    }

    .profile-modal__reputation-ring {
      position: relative;
      width: 140px;
      height: 140px;
      flex-shrink: 0;
    }

    .profile-modal__reputation-ring-svg {
      transform: rotate(-90deg);
      position: absolute;
      inset: 0;
    }

    .profile-modal__reputation-ring-center {
      position: absolute;
      inset: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 1px;
    }

    .profile-modal__reputation-ring-value {
      font-size: 28px;
      font-weight: 800;
      color: #fff;
      line-height: 1;
    }

    .profile-modal__reputation-ring-caption {
      font-size: 10px;
      color: #42e77a;
      font-weight: 600;
      letter-spacing: 0.5px;
    }

    .profile-modal__streak-card {
      width: 100%;
      padding: 11px 14px;
      display: flex;
      align-items: center;
      gap: 12px;
      margin-bottom: 10px;
      background: rgba(255, 107, 26, 0.04);
      border: 1px solid rgba(255, 107, 26, 0.14);
    }

    .profile-modal__streak-icon-wrap {
      width: 40px;
      height: 40px;
      border-radius: 12px;
      flex-shrink: 0;
      background: rgba(255, 107, 26, 0.12);
      display: flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0 14px rgba(255, 107, 26, 0.18);
    }

    .profile-modal__streak-copy {
      flex: 1;
    }

    .profile-modal__streak-title {
      font-size: 15px;
      font-weight: 700;
      color: #fff;
      line-height: 1;
    }

    .profile-modal__streak-sub {
      font-size: 11px;
      color: #9ea7ba;
      margin-top: 3px;
    }

    .profile-modal__streak-badge {
      font-size: 11px;
      font-weight: 700;
      color: #ff8c3a;
      background: rgba(255, 107, 26, 0.1);
      padding: 3px 8px;
      border-radius: 6px;
    }

    .profile-modal__note-card {
      width: 100%;
      padding: 10px 14px;
      flex: 1;
    }

    .profile-modal__note-label {
      font-size: 10px;
      color: #6b7a99;
      margin-bottom: 6px;
      letter-spacing: 1.5px;
      text-transform: uppercase;
    }

    .profile-modal__note-text {
      font-size: 12px;
      color: rgba(255, 255, 255, 0.2);
      font-style: italic;
    }

    .profile-modal__member-since {
      width: 100%;
      margin-top: 12px;
      display: flex;
      align-items: center;
      gap: 6px;
      padding-top: 10px;
      border-top: 1px solid rgba(255, 255, 255, 0.05);
    }

    .profile-modal__member-since-text {
      font-size: 11px;
      color: #6b7a99;
    }

    .profile-modal__member-since-date {
      color: #9ea7ba;
    }

    .profile-modal__divider {
      width: 1px;
      align-self: stretch;
      flex-shrink: 0;
      background: linear-gradient(180deg, transparent 0%, rgba(255, 255, 255, 0.07) 15%, rgba(255, 255, 255, 0.07) 85%, transparent 100%);
    }

    .profile-modal__right {
      flex: 1;
      display: flex;
      flex-direction: column;
      gap: 16px;
      overflow: auto;
      padding-left: 28px;
    }

    .profile-modal__section-title {
      font-size: 11px;
      font-weight: 600;
      letter-spacing: 2px;
      color: #9ea7ba;
      text-transform: uppercase;
      margin-bottom: 8px;
    }

    .profile-modal__about-card {
      padding: 12px 14px;
    }

    .profile-modal__about-text {
      font-size: 13px;
      color: rgba(255, 255, 255, 0.3);
      line-height: 1.6;
      margin: 0;
      font-style: italic;
    }

    .profile-modal__channel-card {
      padding: 14px 16px;
    }

    .profile-modal__channel-row {
      display: flex;
      gap: 12px;
      align-items: center;
    }

    .profile-modal__channel-avatar {
      width: 44px;
      height: 44px;
      border-radius: 12px;
      flex-shrink: 0;
      background: linear-gradient(135deg, #1d3f6e 0%, #0f2540 100%);
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      font-weight: 800;
      color: #7eb8f7;
      border: 1px solid rgba(126, 184, 247, 0.18);
      box-shadow: 0 0 16px rgba(126, 184, 247, 0.07);
    }

    .profile-modal__channel-info {
      flex: 1;
      min-width: 0;
    }

    .profile-modal__channel-head {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-bottom: 4px;
    }

    .profile-modal__channel-name {
      font-size: 14px;
      font-weight: 700;
      color: #fff;
    }

    .profile-modal__channel-subs {
      font-size: 10px;
      font-weight: 600;
      color: #42e77a;
      background: rgba(66, 231, 122, 0.1);
      padding: 2px 7px;
      border-radius: 5px;
      letter-spacing: 0.3px;
    }

    .profile-modal__channel-desc {
      font-size: 12px;
      color: #9ea7ba;
      line-height: 1.5;
      margin: 0;
    }

    .profile-modal__social-list {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .profile-modal__social-item {
      height: 44px;
      border-radius: 12px;
      padding: 0 14px;
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      transition: filter 0.15s;
    }

    .profile-modal__social-item:hover {
      filter: brightness(1.18);
    }

    .profile-modal__social-item--youtube {
      border: 1px solid rgba(255, 30, 30, 0.16);
      background: rgba(255, 30, 30, 0.08);
    }

    .profile-modal__social-item--twitch {
      border: 1px solid rgba(145, 70, 255, 0.18);
      background: rgba(145, 70, 255, 0.08);
    }

    .profile-modal__social-item--discord {
      border: 1px solid rgba(88, 101, 242, 0.18);
      background: rgba(88, 101, 242, 0.08);
    }

    .profile-modal__social-item--telegram {
      border: 1px solid rgba(58, 190, 255, 0.18);
      background: rgba(58, 190, 255, 0.08);
    }

    .profile-modal__social-item--telegram:hover {
      background: rgba(58, 190, 255, 0.14);
      filter: none;
    }

    .profile-modal__social-item--github {
      border: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(255, 255, 255, 0.04);
    }

    .profile-modal__social-item--github:hover {
      background: rgba(255, 255, 255, 0.07);
      filter: none;
    }

    .profile-modal__social-item--tiktok {
      border: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(255, 255, 255, 0.03);
    }

    .profile-modal__social-item--tiktok:hover {
      background: rgba(255, 255, 255, 0.06);
      filter: none;
    }

    .profile-modal__social-icon-wrap {
      width: 26px;
      height: 26px;
      border-radius: 7px;
      flex-shrink: 0;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .profile-modal__social-icon-wrap--youtube {
      background: #ff0000;
      box-shadow: 0 2px 8px rgba(255, 0, 0, 0.333);
    }

    .profile-modal__social-icon-wrap--twitch {
      background: #9146ff;
      box-shadow: 0 2px 8px rgba(145, 70, 255, 0.333);
    }

    .profile-modal__social-icon-wrap--discord {
      background: #5865f2;
      box-shadow: 0 2px 8px rgba(88, 101, 242, 0.333);
    }

    .profile-modal__social-label {
      flex: 1;
      font-size: 13px;
      font-weight: 600;
      color: #dce2f0;
    }

    .profile-modal__achievements-card {
      height: 82px;
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
    }

    .profile-modal__achievements-icon-wrap {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.05);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .profile-modal__achievements-title {
      font-size: 13px;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.25);
    }

    .profile-modal__achievements-sub {
      font-size: 11px;
      color: #6b7a99;
      margin-top: 2px;
    }

    .profile-modal__edit-wrap {
      margin-top: auto;
      display: flex;
      justify-content: flex-end;
    }

    .profile-modal__edit-btn {
      display: flex;
      align-items: center;
      gap: 7px;
      padding: 9px 18px;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.1);
      color: #c8ccd6;
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      font-family: "Inter", sans-serif;
      transition: background 0.15s, border-color 0.15s;
    }

    .profile-modal__edit-btn:hover {
      background: rgba(255, 255, 255, 0.1);
      border-color: rgba(255, 255, 255, 0.18);
    }

    #profileViewerModal .profile-modal__left-stack {
      width: 100%;
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      align-items: center;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal.modal--profile-viewer {
      width: 1060px !important;
      height: 780px !important;
      max-width: min(1060px, 94vw) !important;
      max-height: min(780px, 92vh) !important;
      overflow: hidden !important;
      overflow-y: hidden !important;
      gap: 0;
      padding: 0;
      border: none;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__body.profile-viewer-layout.profile-nitro-layout {
      display: grid !important;
      grid-template-columns: 360px 1px minmax(0, 1fr) !important;
      grid-template-rows: minmax(0, 1fr) !important;
      max-width: none !important;
      width: 100% !important;
      margin: 0 !important;
      justify-content: stretch !important;
      align-items: stretch !important;
      align-content: stretch !important;
      gap: 0 !important;
      flex: 1;
      min-height: 0;
      overflow: hidden !important;
      padding: 20px 24px 24px;
    }
    #profileViewerModal.profile-ui-v37 .profile-viewer-layout.profile-nitro-layout.tier-level1-profile {
      grid-template-columns: 360px 1px minmax(0, 1fr) !important;
      max-width: none !important;
      margin: 0 !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__left.profile-viewer-left {
      grid-column: 1;
      grid-row: 1;
      width: 360px !important;
      min-width: 360px !important;
      max-width: 360px !important;
      flex-shrink: 0;
      border: none !important;
      background: transparent !important;
      padding: 0 28px 0 0 !important;
      gap: 0 !important;
      min-height: 0;
      overflow: hidden;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__left-stack,
    #profileViewerModal.profile-ui-v37 #profileNitroCard {
      gap: 0 !important;
      width: 100%;
    }
    #profileViewerModal.profile-ui-v37 #profileNitroRep,
    #profileViewerModal.profile-ui-v37 #profileNitroMetrics {
      width: 100%;
      margin: 0 !important;
      padding: 0 !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__divider {
      grid-column: 2;
      grid-row: 1;
      display: block !important;
      width: 1px;
      height: auto;
      align-self: stretch;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__right.profile-viewer-right {
      grid-column: 3;
      grid-row: 1;
      min-width: 0;
      min-height: 0;
      border: none !important;
      border-radius: 0 !important;
      background: transparent !important;
      box-shadow: none !important;
      padding: 0 0 0 28px !important;
      overflow: hidden !important;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    #profileViewerModal.profile-ui-v37 #profileViewerV2Sections {
      flex: 1;
      min-height: 0;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      gap: 16px;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__edit-wrap.profile-viewer-actions {
      margin-top: auto;
      flex-shrink: 0;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__body.profile-viewer-layout {
      max-width: none;
      align-items: stretch;
      min-height: 0;
    }

    /* V37 profile edit modal — layout shell (visual only; bg/frame pickers later) */
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit.profile-viewer-layout.profile-nitro-layout {
      grid-template-columns: 420px 1px minmax(0, 1fr) !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-modal__left.profile-viewer-left {
      width: 420px !important;
      min-width: 420px !important;
      max-width: 420px !important;
      padding: 0 24px 0 0 !important;
      align-items: stretch !important;
      overflow: hidden;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit #profileEditHero {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 14px;
      width: 100%;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit #profileViewerV2Sections,
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-mobile-nav,
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit [data-profile-edit-only="1"]:not(#profileEditV37Right):not(#profileEditV37Right *),
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-view-note-wrap {
      display: none !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit #profileEditV37Right {
      display: flex;
      flex-direction: column;
      gap: 16px;
      flex: 1;
      min-height: 0;
      overflow: auto;
    }
    #profileViewerModal.profile-ui-v37 #profileEditV37Right {
      display: none;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit #profileEditV37Right {
      display: flex !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-modal__edit-wrap.profile-viewer-actions {
      margin-top: auto;
      padding-top: 8px;
      border-top: none;
      background: transparent;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-actions-btns {
      justify-content: flex-end;
      gap: 10px;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-actions-btns .profile-modal__edit-btn.secondary {
      background: transparent;
      border: none;
      color: rgba(255, 255, 255, 0.55);
      box-shadow: none;
      padding: 10px 14px;
      font-size: 13px;
      font-weight: 500;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-actions-btns .profile-modal__edit-btn.secondary:hover {
      color: rgba(255, 255, 255, 0.85);
      background: rgba(255, 255, 255, 0.04);
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-actions-btns #profileViewerSaveBtn {
      background: linear-gradient(135deg, #7c3aed 0%, #6d28d9 100%);
      border: none;
      border-radius: 10px;
      color: #fff;
      font-size: 13px;
      font-weight: 600;
      padding: 10px 18px;
      box-shadow: 0 4px 16px rgba(124, 58, 237, 0.35);
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-actions-btns #profileViewerSaveBtn svg {
      display: none;
    }
    .profile-edit-v37__preview-card {
      position: relative;
      border-radius: 16px;
      overflow: hidden;
      border: 1px solid rgba(255, 255, 255, 0.045);
      background: rgba(12, 18, 28, 0.62);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.03);
      flex-shrink: 0;
      display: flex;
      flex-direction: column;
      align-items: stretch;
      min-height: 280px;
      --profile-v37-cover-overlay-h: 88px;
      --profile-v37-cover-overlay-radius: 16px;
      --profile-v37-cover-overlay-opacity: 0.5;
      --profile-v37-cover-overlay-blur: 7px;
      --profile-v37-cover-dissolve-bg: #10161f;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-edit-v37__preview-cover.profile-viewer-cover {
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      height: 0;
      min-height: 0;
      margin: 0 !important;
      padding: 0;
      border: none !important;
      border-radius: 0 !important;
      z-index: 1;
      background: transparent !important;
      overflow: visible !important;
    }
    .profile-edit-v37__preview-body {
      position: relative;
      z-index: 2;
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 100%;
      box-sizing: border-box;
      margin-top: 128px;
      padding: 0 16px 16px;
      gap: 6px;
      background: transparent;
    }
    .profile-edit-v37__avatar-wrap {
      position: relative;
      width: 104px;
      height: 104px;
      flex-shrink: 0;
      margin-bottom: 4px;
    }
    .profile-edit-v37__avatar-wrap .profile-viewer-avatar-btn {
      width: 104px;
      height: 104px;
      margin: 0;
      border-radius: 50%;
      overflow: hidden;
    }
    .profile-edit-v37__avatar-wrap .profile-viewer-avatar-img,
    .profile-edit-v37__avatar-wrap .profile-viewer-avatar-btn > span {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 50%;
    }
    .profile-edit-v37__online {
      position: absolute;
      right: 6px;
      bottom: 6px;
      width: 12px;
      height: 12px;
      border-radius: 50%;
      background: #22c55e;
      border: 2px solid #141b2c;
      box-sizing: border-box;
    }
    .profile-edit-v37__online.is-offline {
      background: #64748b;
    }
    .profile-edit-v37__nickname {
      font-size: 19px;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.84);
      text-align: center;
      line-height: 1.2;
      margin-top: 0;
      width: 100%;
    }
    .profile-edit-v37__premium {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      padding: 3px 10px;
      border-radius: 999px;
      background: rgba(245, 197, 66, 0.12);
      border: 1px solid rgba(245, 197, 66, 0.28);
      color: #f5c542;
      font-size: 11px;
      font-weight: 600;
    }
    .profile-edit-v37__premium.hidden {
      display: none !important;
    }
    .profile-edit-v37__tabs {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
      flex-shrink: 0;
    }
    .profile-edit-v37__tabs--single {
      grid-template-columns: 1fr;
    }
    .profile-edit-v37__tab {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      padding: 10px 8px;
      border-radius: 10px;
      border: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(255, 255, 255, 0.03);
      color: rgba(255, 255, 255, 0.55);
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
      transition: background 0.15s, color 0.15s, border-color 0.15s;
    }
    .profile-edit-v37__tab.is-active {
      background: rgba(124, 58, 237, 0.14);
      border-color: rgba(124, 58, 237, 0.45);
      color: #c4b5fd;
    }
    .profile-edit-v37__panel {
      flex: 1;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 10px;
      overflow: hidden;
    }
    .profile-edit-v37__panel.hidden {
      display: none !important;
    }
    .profile-edit-v37__section-title {
      margin: 0;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.38);
    }
    .profile-edit-v37__bg-cats {
      display: flex;
      flex-wrap: wrap;
      gap: 6px;
      flex-shrink: 0;
    }
    .profile-edit-v37__bg-cat {
      padding: 5px 10px;
      border-radius: 999px;
      border: none;
      background: transparent;
      color: rgba(255, 255, 255, 0.45);
      font-size: 11px;
      font-weight: 600;
      cursor: pointer;
    }
    .profile-edit-v37__bg-cat.is-active {
      background: rgba(124, 58, 237, 0.22);
      color: #ddd6fe;
    }
    .profile-edit-v37__bg-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 12px;
      overflow-y: auto;
      min-height: 0;
      padding-right: 2px;
    }
    .profile-edit-v37__bg-thumb {
      aspect-ratio: 128 / 72;
      border-radius: 12px;
      border: 2px solid transparent;
      position: relative;
      cursor: pointer;
      overflow: hidden;
      padding: 0;
      margin: 0;
      font: inherit;
      color: inherit;
      appearance: none;
      -webkit-appearance: none;
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
    }
    .profile-edit-v37__bg-thumb:not(.profile-edit-v37__bg-thumb--none)::after {
      content: "";
      position: absolute;
      inset: 0;
      border-radius: inherit;
      pointer-events: none;
      background: linear-gradient(
        165deg,
        rgba(255, 255, 255, 0.1) 0%,
        transparent 42%,
        rgba(0, 0, 0, 0.18) 100%
      );
      mix-blend-mode: soft-light;
    }
    .profile-edit-v37__bg-thumb.is-selected {
      border-color: #7c3aed;
    }
    .profile-edit-v37__bg-thumb-check {
      position: absolute;
      right: 6px;
      bottom: 6px;
      width: 18px;
      height: 18px;
      border-radius: 50%;
      background: #7c3aed;
      color: #fff;
      font-size: 11px;
      display: none;
      align-items: center;
      justify-content: center;
    }
    .profile-edit-v37__bg-thumb.is-selected .profile-edit-v37__bg-thumb-check {
      display: flex;
    }
    .profile-edit-v37__bg-thumb.is-locked {
      opacity: 0.42;
      cursor: not-allowed;
    }
    .profile-edit-v37__bg-thumb-lock {
      position: absolute;
      top: 6px;
      left: 6px;
      z-index: 1;
      padding: 2px 6px;
      border-radius: 999px;
      background: rgba(0, 0, 0, 0.45);
      border: 1px solid rgba(245, 197, 66, 0.35);
      color: #f5c542;
      font-size: 9px;
      font-weight: 700;
      line-height: 1.2;
      pointer-events: none;
    }
    .profile-edit-v37__bg-thumb--none {
      aspect-ratio: 128 / 72;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 8px;
      background:
        radial-gradient(ellipse 90% 70% at 50% 28%, rgba(124, 58, 237, 0.1), transparent 68%),
        linear-gradient(180deg, rgba(255, 255, 255, 0.04) 0%, rgba(255, 255, 255, 0.015) 100%) !important;
      border: 1px solid rgba(255, 255, 255, 0.1);
      color: rgba(255, 255, 255, 0.62);
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.05);
    }
    .profile-edit-v37__bg-thumb--none.is-selected {
      border-color: rgba(124, 58, 237, 0.75);
      border-style: solid;
      background:
        radial-gradient(ellipse 90% 70% at 50% 28%, rgba(124, 58, 237, 0.18), transparent 68%),
        linear-gradient(180deg, rgba(124, 58, 237, 0.1) 0%, rgba(124, 58, 237, 0.03) 100%) !important;
      color: #e9d5ff;
      box-shadow: 0 0 0 1px rgba(124, 58, 237, 0.25), inset 0 1px 0 rgba(255, 255, 255, 0.08);
    }
    .profile-edit-v37__bg-none-icon {
      width: 32px;
      height: 32px;
      border-radius: 50%;
      border: 1.5px solid currentColor;
      display: flex;
      align-items: center;
      justify-content: center;
      opacity: 0.9;
      background: rgba(0, 0, 0, 0.18);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.06);
    }
    .profile-edit-v37__bg-none-icon svg {
      width: 16px;
      height: 16px;
      stroke: currentColor;
      fill: none;
    }
    .profile-edit-v37__bg-none-label {
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 0.02em;
    }
    .profile-edit-v37__frame-grid {
      display: grid;
      grid-template-columns: repeat(3, 1fr);
      gap: 10px;
      overflow-y: auto;
      min-height: 0;
      padding-right: 2px;
    }
    .profile-edit-v37__frame-option {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 6px;
      padding: 10px 6px;
      border-radius: 12px;
      border: 2px solid transparent;
      background: rgba(255, 255, 255, 0.02);
      cursor: pointer;
      color: rgba(255, 255, 255, 0.72);
      font-size: 10px;
      font-weight: 600;
      text-align: center;
      line-height: 1.25;
    }
    .profile-edit-v37__frame-option:hover:not(:disabled) {
      background: rgba(255, 255, 255, 0.05);
    }
    .profile-edit-v37__frame-option.is-selected {
      border-color: #7c3aed;
      background: rgba(124, 58, 237, 0.1);
      color: #ede9fe;
    }
    .profile-edit-v37__frame-option:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }
    .profile-edit-v37__frame-option .profile-avatar-frame-pick-preview {
      width: 44px;
      height: 44px;
      flex-shrink: 0;
    }
    .profile-edit-v37__frame-label {
      display: block;
      width: 100%;
      word-break: break-word;
    }
    .profile-edit-v37__block {
      display: flex;
      flex-direction: column;
      gap: 10px;
      flex-shrink: 0;
    }
    .profile-edit-v37__block-title {
      margin: 0;
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      color: rgba(255, 255, 255, 0.38);
    }
    .profile-edit-v37__avatar-change-btn {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      width: 100%;
      padding: 11px 14px;
      border-radius: 10px;
      border: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(255, 255, 255, 0.04);
      color: rgba(255, 255, 255, 0.82);
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      transition: background 0.15s, border-color 0.15s;
    }
    .profile-edit-v37__avatar-change-btn:hover:not(:disabled) {
      background: rgba(255, 255, 255, 0.07);
      border-color: rgba(255, 255, 255, 0.12);
    }
    .profile-edit-v37__avatar-change-btn:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }
    .profile-edit-v37__avatar-change-btn.hidden {
      display: none !important;
    }
    .profile-edit-v37__about-wrap {
      position: relative;
    }
    .profile-edit-v37__about-wrap .profile-edit-v37__bio-input {
      width: 100%;
      min-height: 88px;
      resize: vertical;
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(255, 255, 255, 0.04);
      color: rgba(255, 255, 255, 0.88);
      padding: 12px 14px 28px;
      font-size: 14px;
      line-height: 1.45;
      box-sizing: border-box;
    }
    .profile-edit-v37__about-wrap .profile-edit-v37__bio-input:focus {
      outline: none;
      border-color: rgba(124, 58, 237, 0.45);
    }
    .profile-edit-v37__bio-count {
      position: absolute;
      right: 12px;
      bottom: 10px;
      font-size: 11px;
      color: rgba(255, 255, 255, 0.35);
      pointer-events: none;
    }
    .profile-edit-v37__links {
      display: flex;
      flex-direction: column;
      gap: 6px;
    }
    .profile-edit-v37__link-row {
      display: grid;
      grid-template-columns: 32px minmax(0, 1fr) 28px;
      align-items: start;
      gap: 8px;
      padding: 7px 8px;
      border-radius: 11px;
      background: rgba(255, 255, 255, 0.025);
      border: 1px solid rgba(255, 255, 255, 0.05);
      overflow: visible;
    }
    .profile-edit-v37__link-fields {
      display: flex;
      flex-direction: column;
      gap: 5px;
      min-width: 0;
      overflow: visible;
    }
    .profile-edit-v37__platform-dd {
      position: relative;
      width: 100%;
      min-width: 0;
      z-index: 1;
    }
    .profile-edit-v37__platform-dd.is-open {
      z-index: 40;
    }
    .profile-edit-v37__platform-dd-trigger {
      width: 100%;
      height: 40px;
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 0 10px 0 8px;
      border: 1px solid rgba(255, 255, 255, 0.08);
      background: rgba(15, 20, 35, 0.65);
      border-radius: 12px;
      color: rgba(255, 255, 255, 0.88);
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
      transition: border-color 140ms ease;
    }
    .profile-edit-v37__platform-dd-trigger:hover:not(:disabled) {
      border-color: rgba(255, 255, 255, 0.12);
    }
    .profile-edit-v37__platform-dd-trigger:focus-visible {
      outline: none;
      border-color: rgba(139, 92, 246, 0.45);
    }
    .profile-edit-v37__platform-dd-trigger:disabled {
      opacity: 0.45;
      cursor: not-allowed;
    }
    .profile-edit-v37__platform-dd-label {
      flex: 1;
      min-width: 0;
      text-align: left;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .profile-edit-v37__platform-dd-chevron {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      color: rgba(255, 255, 255, 0.4);
      transition: transform 140ms ease;
    }
    .profile-edit-v37__platform-dd.is-open .profile-edit-v37__platform-dd-chevron {
      transform: rotate(180deg);
    }
    .profile-edit-v37__platform-dd-icon,
    .profile-edit-v37__platform-dd-option-icon {
      width: 22px;
      height: 22px;
      border-radius: 6px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      font-size: 12px;
      line-height: 1;
    }
    .profile-edit-v37__platform-dd-icon--generic,
    .profile-edit-v37__platform-dd-option-icon--generic {
      background: rgba(255, 255, 255, 0.06);
      color: rgba(255, 255, 255, 0.35);
    }
    .profile-edit-v37__platform-dd-icon--youtube,
    .profile-edit-v37__platform-dd-option-icon--youtube { background: #ff0000; }
    .profile-edit-v37__platform-dd-icon--twitch,
    .profile-edit-v37__platform-dd-option-icon--twitch { background: #9146ff; }
    .profile-edit-v37__platform-dd-icon--discord,
    .profile-edit-v37__platform-dd-option-icon--discord { background: #5865f2; }
    .profile-edit-v37__platform-dd-icon--telegram,
    .profile-edit-v37__platform-dd-option-icon--telegram,
    .profile-edit-v37__platform-dd-icon--github,
    .profile-edit-v37__platform-dd-option-icon--github,
    .profile-edit-v37__platform-dd-icon--tiktok,
    .profile-edit-v37__platform-dd-option-icon--tiktok {
      background: transparent;
      border: none;
      padding: 0;
      overflow: hidden;
      align-items: stretch;
      justify-content: stretch;
    }
    .profile-edit-v37__platform-dd-icon .profile-social-png-icon,
    .profile-edit-v37__platform-dd-option-icon .profile-social-png-icon {
      width: 100%;
      height: 100%;
      max-width: none;
      max-height: none;
      display: block;
      object-fit: cover;
      border-radius: inherit;
    }
    .profile-edit-v37__platform-dd-icon-empty {
      font-size: 16px;
      line-height: 1;
      color: rgba(255, 255, 255, 0.28);
    }
    .profile-edit-v37__platform-dd-menu {
      position: absolute;
      top: calc(100% + 8px);
      left: 0;
      right: 0;
      z-index: 120;
      background: #111827;
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 14px;
      backdrop-filter: blur(18px);
      -webkit-backdrop-filter: blur(18px);
      box-shadow: 0 12px 40px rgba(0, 0, 0, 0.45);
      padding: 4px;
      max-height: 240px;
      overflow-y: auto;
      opacity: 0;
      visibility: hidden;
      transform: translateY(-6px);
      pointer-events: none;
      transition: opacity 140ms ease, transform 140ms ease, visibility 140ms ease;
    }
    .profile-edit-v37__platform-dd-menu.profile-edit-v37__platform-dd-menu--floating {
      position: fixed;
      top: auto;
      right: auto;
      bottom: auto;
      z-index: 10050;
      max-height: 240px;
      overflow-y: auto;
      overscroll-behavior: contain;
    }
    .profile-edit-v37__platform-dd.dropdown-up .profile-edit-v37__platform-dd-menu {
      top: auto;
      bottom: calc(100% + 8px);
      transform: translateY(6px);
    }
    .profile-edit-v37__platform-dd.is-open .profile-edit-v37__platform-dd-menu,
    .profile-edit-v37__platform-dd-menu.profile-edit-v37__platform-dd-menu--floating.is-open {
      opacity: 1;
      visibility: visible;
      transform: translateY(0);
      pointer-events: auto;
      z-index: 10050;
    }
    .profile-edit-v37__platform-dd-menu.profile-edit-v37__platform-dd-menu--floating.dropdown-up.is-open {
      transform: translateY(0);
    }
    .profile-edit-v37__platform-dd-option {
      width: 100%;
      height: 40px;
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 0 10px;
      border: none;
      border-radius: 10px;
      background: transparent;
      color: rgba(255, 255, 255, 0.82);
      font-size: 12px;
      font-weight: 600;
      cursor: pointer;
      text-align: left;
      transition: background 120ms ease, color 120ms ease;
    }
    .profile-edit-v37__platform-dd-option:hover {
      background: rgba(139, 92, 246, 0.12);
    }
    .profile-edit-v37__platform-dd-option.is-selected {
      background: rgba(139, 92, 246, 0.18);
      color: #fff;
    }
    .profile-edit-v37__platform-dd-option-label {
      min-width: 0;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .profile-edit-v37__link-icon {
      width: 32px;
      height: 32px;
      border-radius: 8px;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin-top: 2px;
      font-size: 13px;
      line-height: 1;
    }
    .profile-edit-v37__link-icon--generic {
      background: rgba(255, 255, 255, 0.06);
      color: rgba(255, 255, 255, 0.45);
    }
    .profile-edit-v37__link-icon--youtube { background: #ff0000; }
    .profile-edit-v37__link-icon--twitch { background: #9146ff; }
    .profile-edit-v37__link-icon--discord { background: #5865f2; }
    .profile-edit-v37__link-icon--telegram,
    .profile-edit-v37__link-icon--github,
    .profile-edit-v37__link-icon--tiktok {
      background: transparent;
      border: none;
      padding: 0;
      overflow: hidden;
      align-items: stretch;
      justify-content: stretch;
    }
    .profile-edit-v37__link-icon .profile-social-png-icon,
    .profile-modal__social-icon-wrap .profile-social-png-icon {
      width: 100%;
      height: 100%;
      max-width: none;
      max-height: none;
      display: block;
      object-fit: cover;
      border-radius: inherit;
    }
    .profile-modal__social-icon-wrap:has(.profile-social-png-icon) {
      padding: 0;
      overflow: hidden;
      background: transparent;
      border: none;
      box-shadow: none;
    }
    .profile-edit-v37__link-label {
      font-size: 12px;
      font-weight: 600;
      color: rgba(255, 255, 255, 0.72);
    }
    .profile-edit-v37__link-input-wrap {
      display: flex;
      align-items: center;
      min-width: 0;
      border-radius: 7px;
      background: rgba(0, 0, 0, 0.18);
      border: 1px solid rgba(255, 255, 255, 0.05);
      overflow: hidden;
    }
    .profile-edit-v37__link-prefix {
      padding: 0 0 0 8px;
      font-size: 10px;
      color: rgba(255, 255, 255, 0.32);
      white-space: nowrap;
      flex-shrink: 0;
      font-variant-numeric: tabular-nums;
    }
    .profile-edit-v37__link-input {
      flex: 1;
      min-width: 0;
      border: none;
      background: transparent;
      color: rgba(255, 255, 255, 0.78);
      font-size: 11px;
      padding: 7px 8px 7px 2px;
    }
    .profile-edit-v37__link-input-wrap--full .profile-edit-v37__link-input {
      padding-left: 10px;
    }
    .profile-edit-v37__link-clear {
      width: 28px;
      height: 28px;
      border: none;
      border-radius: 7px;
      background: transparent;
      color: rgba(255, 255, 255, 0.28);
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      margin-top: 2px;
    }
    .profile-edit-v37__link-clear:hover {
      color: rgba(255, 255, 255, 0.7);
      background: rgba(255, 255, 255, 0.06);
    }
    .profile-edit-v37__add-link {
      align-self: flex-start;
      border: none;
      background: transparent;
      color: #a78bfa;
      font-size: 12px;
      font-weight: 600;
      padding: 4px 0 0;
      cursor: pointer;
    }
    .profile-edit-v37__add-link:disabled {
      opacity: 0.35;
      cursor: not-allowed;
    }
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-identity-text,
    #profileViewerModal.profile-ui-v37 .profile-nitro-edit .profile-viewer-cover-label-layer {
      display: none !important;
    }

    /* V37 layout metrics — reset legacy .profile-card (grid + min-height:180px at ~L20943) */
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card {
      margin: 0 !important;
      gap: 0 !important;
      align-content: unset !important;
      border-radius: 14px;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card.profile-modal__rep-card {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      justify-content: space-between !important;
      width: 100% !important;
      height: 160px !important;
      min-height: 160px !important;
      max-height: 160px !important;
      padding: 0 20px !important;
      margin-bottom: 10px !important;
      box-sizing: border-box !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__rep-info {
      flex: 0 1 auto;
      min-width: 0;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__reputation-ring {
      flex: 0 0 140px;
      width: 140px !important;
      height: 140px !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card.profile-modal__streak-card {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      gap: 12px !important;
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      max-height: none !important;
      padding: 11px 14px !important;
      margin-bottom: 10px !important;
      box-sizing: border-box !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card.profile-modal__note-card {
      display: block !important;
      min-height: 0 !important;
      flex: 1 1 auto;
      padding: 10px 14px !important;
      margin: 0 !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card.profile-modal__about-card {
      display: block !important;
      min-height: 0 !important;
      height: auto !important;
      padding: 12px 14px !important;
      margin: 0 !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card.profile-modal__channel-card {
      display: block !important;
      min-height: 0 !important;
      height: auto !important;
      padding: 14px 16px !important;
      margin: 0 !important;
      box-sizing: border-box !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__channel-row {
      align-items: center;
      gap: 12px;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__channel-head {
      margin-bottom: 4px;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__channel-desc {
      margin: 0;
      line-height: 1.5;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal .profile-card.profile-modal__achievements-card {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      justify-content: center !important;
      gap: 12px !important;
      width: 100% !important;
      height: 82px !important;
      min-height: 82px !important;
      max-height: 82px !important;
      padding: 0 !important;
      margin: 0 !important;
      box-sizing: border-box !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__achievements-card > div:not(.profile-modal__achievements-icon-wrap) {
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-height: 0;
    }

    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-wrap::before,
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-glow {
      display: none !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-ring {
      background: transparent !important;
      padding: 0 !important;
      box-shadow: none !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner:has(.profile-viewer-avatar[class*="frame-"]) {
      background: transparent;
      overflow: visible;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar {
      width: 100%;
      height: 100%;
      margin: 0;
      box-sizing: border-box;
    }

    /* V37 profile cover overlay — shared visual language (modal, sidebar, editor preview) */
    #profileViewerModal.profile-ui-v37 {
      --profile-v37-cover-overlay-h: 88px;
      --profile-v37-cover-overlay-radius: 18px;
      --profile-v37-cover-overlay-opacity: 0.54;
      --profile-v37-cover-overlay-blur: 9px;
      --profile-v37-cover-dissolve-bg: #141b2c;
      --profile-v37-cover-overlay-mask: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.98) 0%,
        rgba(0, 0, 0, 0.88) 22%,
        rgba(0, 0, 0, 0.52) 52%,
        rgba(0, 0, 0, 0.18) 74%,
        transparent 100%
      );
    }
    .col-user {
      --profile-v37-cover-overlay-h: 66px;
      --profile-v37-cover-overlay-radius: 12px;
      --profile-v37-cover-overlay-opacity: 0.48;
      --profile-v37-cover-overlay-blur: 7px;
      --profile-v37-cover-dissolve-bg: #10161f;
      --profile-v37-cover-overlay-mask: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0.96) 0%,
        rgba(0, 0, 0, 0.82) 20%,
        rgba(0, 0, 0, 0.46) 50%,
        rgba(0, 0, 0, 0.14) 72%,
        transparent 100%
      );
    }

    /* V37 profile view — profileCoverStyle overlay on existing hosts (no layout change) */
    #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover,
    .col-user .col-user-profile-v37.profile-viewer-cover {
      position: relative;
      height: auto !important;
      min-height: 0 !important;
      border-radius: 0 !important;
      overflow: visible !important;
    }
    :is(
        #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover,
        .col-user .col-user-profile-v37.profile-viewer-cover,
        #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover
      ) {
      background: transparent !important;
    }
    #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover > *,
    .col-user .col-user-profile-v37.profile-viewer-cover > * {
      position: relative;
      z-index: 1;
    }
    :is(
        #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover:not(.profile-cover-is-photo),
        .col-user .col-user-profile-v37.profile-viewer-cover:not(.profile-cover-is-photo),
        #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover:not(.profile-cover-is-photo)
      )::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 0;
      pointer-events: none;
      height: var(--profile-v37-cover-overlay-h, 88px);
      border-top-left-radius: var(--profile-v37-cover-overlay-radius, 16px);
      border-top-right-radius: var(--profile-v37-cover-overlay-radius, 16px);
      opacity: var(--profile-v37-cover-overlay-opacity, 0.54);
      filter: blur(var(--profile-v37-cover-overlay-blur, 9px)) saturate(1.06) brightness(1.04);
      -webkit-mask-image: var(--profile-v37-cover-overlay-mask);
      mask-image: var(--profile-v37-cover-overlay-mask);
      mix-blend-mode: soft-light;
      transform: translateZ(0);
    }
    :is(
        #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover:not(.profile-cover-is-photo),
        .col-user .col-user-profile-v37.profile-viewer-cover:not(.profile-cover-is-photo),
        #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover:not(.profile-cover-is-photo)
      )::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 0;
      pointer-events: none;
      height: calc(var(--profile-v37-cover-overlay-h, 88px) + 56px);
      border-top-left-radius: var(--profile-v37-cover-overlay-radius, 16px);
      border-top-right-radius: var(--profile-v37-cover-overlay-radius, 16px);
      background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 8%, transparent) 34%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 42%, transparent) 58%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 78%, transparent) 80%,
        var(--profile-v37-cover-dissolve-bg, #141b2c) 100%
      );
    }
    #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover::before {
      --profile-v37-cover-overlay-h: 88px;
      --profile-v37-cover-overlay-radius: 18px;
      --profile-v37-cover-overlay-opacity: 0.58;
      --profile-v37-cover-overlay-blur: 10px;
      filter: blur(var(--profile-v37-cover-overlay-blur, 10px)) saturate(1.1) brightness(1.06);
    }
    #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover::after {
      --profile-v37-cover-dissolve-bg: #141b2c;
      height: calc(var(--profile-v37-cover-overlay-h, 88px) + 64px);
    }
    .col-user .col-user-profile-v37.profile-viewer-cover::before {
      --profile-v37-cover-overlay-h: 66px;
      --profile-v37-cover-overlay-radius: 12px;
    }
    .col-user .col-user-profile-v37.profile-viewer-cover::after {
      --profile-v37-cover-dissolve-bg: #10161f;
      height: calc(var(--profile-v37-cover-overlay-h, 66px) + 48px);
    }

    /* V37 photo/image covers — keep PNG/JPG artwork visible (lighter overlay) */
    :is(
        #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover.profile-cover-is-photo,
        .col-user .col-user-profile-v37.profile-viewer-cover.profile-cover-is-photo,
        #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover.profile-cover-is-photo
      )::before {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 0;
      pointer-events: none;
      height: var(--profile-v37-cover-overlay-h, 152px);
      border-top-left-radius: var(--profile-v37-cover-overlay-radius, 16px);
      border-top-right-radius: var(--profile-v37-cover-overlay-radius, 16px);
      transform: translateZ(0);
      opacity: 1;
      mix-blend-mode: normal;
      --profile-v37-cover-overlay-opacity: 1;
      --profile-v37-cover-overlay-blur: 0;
      filter: saturate(1.1) brightness(1.04);
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
      -webkit-mask-image: var(--profile-v37-cover-overlay-mask);
      mask-image: var(--profile-v37-cover-overlay-mask);
      --profile-v37-cover-overlay-mask: linear-gradient(
        180deg,
        rgba(0, 0, 0, 1) 0%,
        rgba(0, 0, 0, 1) 56%,
        rgba(0, 0, 0, 0.82) 72%,
        rgba(0, 0, 0, 0.34) 88%,
        transparent 100%
      );
    }
    :is(
        #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover.profile-cover-is-photo,
        .col-user .col-user-profile-v37.profile-viewer-cover.profile-cover-is-photo,
        #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover.profile-cover-is-photo
      )::after {
      content: "";
      position: absolute;
      top: 0;
      left: 0;
      right: 0;
      z-index: 0;
      pointer-events: none;
      height: calc(var(--profile-v37-cover-overlay-h, 152px) + 36px);
      border-top-left-radius: var(--profile-v37-cover-overlay-radius, 16px);
      border-top-right-radius: var(--profile-v37-cover-overlay-radius, 16px);
      background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0) 68%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 3%, transparent) 78%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 12%, transparent) 88%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 30%, transparent) 96%,
        var(--profile-v37-cover-dissolve-bg, #141b2c) 100%
      );
    }
    #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover.profile-cover-is-photo::before {
      --profile-v37-cover-overlay-h: 152px;
      --profile-v37-cover-overlay-radius: 18px;
      filter: saturate(1.1) brightness(1.04);
    }
    #profileViewerModal.profile-ui-v37 #profileNitroCard.profile-viewer-cover.profile-cover-is-photo::after {
      --profile-v37-cover-dissolve-bg: #141b2c;
      height: calc(var(--profile-v37-cover-overlay-h, 152px) + 36px);
      background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0) 68%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 2%, transparent) 78%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 10%, transparent) 88%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #141b2c) 28%, transparent) 96%,
        var(--profile-v37-cover-dissolve-bg, #141b2c) 100%
      );
    }
    .col-user .col-user-profile-v37.profile-viewer-cover.profile-cover-is-photo::before {
      --profile-v37-cover-overlay-h: 152px;
      --profile-v37-cover-overlay-radius: 12px;
      filter: saturate(1.1) brightness(1.04);
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }
    .col-user .col-user-profile-v37.profile-viewer-cover.profile-cover-is-photo::after {
      --profile-v37-cover-dissolve-bg: #10161f;
      height: calc(var(--profile-v37-cover-overlay-h, 152px) + 36px);
      background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0) 68%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #10161f) 2%, transparent) 78%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #10161f) 10%, transparent) 88%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #10161f) 28%, transparent) 96%,
        var(--profile-v37-cover-dissolve-bg, #10161f) 100%
      );
    }
    #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover.profile-cover-is-photo::before {
      --profile-v37-cover-overlay-h: 128px;
      --profile-v37-cover-overlay-radius: 16px;
      filter: saturate(1.08) brightness(1.03);
    }
    #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover.profile-viewer-cover.profile-cover-is-photo::after {
      --profile-v37-cover-dissolve-bg: #10161f;
      height: calc(var(--profile-v37-cover-overlay-h, 128px) + 32px);
      background: linear-gradient(
        180deg,
        rgba(0, 0, 0, 0) 0%,
        rgba(0, 0, 0, 0) 68%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #10161f) 2%, transparent) 78%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #10161f) 10%, transparent) 88%,
        color-mix(in srgb, var(--profile-v37-cover-dissolve-bg, #10161f) 28%, transparent) 96%,
        var(--profile-v37-cover-dissolve-bg, #10161f) 100%
      );
    }
    .profile-edit-v37__preview-card:has(.profile-cover-is-photo) {
      --profile-v37-cover-overlay-h: 128px;
    }

    /* Right column section order — restore О СЕБЕ above channel (v35 hides it) */
    #profileViewerModal.profile-ui-v37 #profileViewerAbout {
      display: block !important;
      order: 1 !important;
    }
    #profileViewerModal.profile-ui-v37 #profileViewerChannelsList {
      order: 2 !important;
    }
    #profileViewerModal.profile-ui-v37 #profileViewerSocialPills {
      order: 3 !important;
    }
    #profileViewerModal.profile-ui-v37 #profileViewerAchievements {
      order: 4 !important;
    }
    #profileViewerModal.profile-ui-v37 #profileViewerStatusPanel,
    #profileViewerModal.profile-ui-v37 #profileViewerFeaturedProject {
      display: none !important;
    }

    /* Reputation details modal — premium analytics screen (V37) */
    #reputationDetailsModal.rep-details-v37 {
      --rep-analytics-bg: rgba(255, 255, 255, 0.024);
      --rep-analytics-border: rgba(255, 255, 255, 0.07);
      --rep-analytics-text: #fff;
      --rep-analytics-muted: #9ea7ba;
      --rep-analytics-up: #35d07f;
      --rep-analytics-down: #ff5f5f;
      --rep-analytics-zero: rgba(255, 255, 255, 0.35);
    }
    #reputationDetailsModal.rep-details-v37.modal-backdrop {
      background: rgba(0, 0, 0, 0.65);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
    }
    #reputationDetailsModal.rep-details-v37 .modal--reputation-details {
      position: relative;
      width: 920px;
      min-width: 920px;
      max-width: 920px;
      height: 700px;
      max-height: 700px;
      border-radius: 24px !important;
      border: 1px solid rgba(255, 255, 255, 0.08) !important;
      padding: 32px !important;
      gap: 0 !important;
      overflow: hidden;
      display: flex;
      flex-direction: column;
      box-sizing: border-box;
      background: linear-gradient(180deg, #111b36 0%, #0b1224 100%) !important;
      box-shadow: 0 20px 80px rgba(0, 0, 0, 0.45), 0 0 0 1px rgba(255, 255, 255, 0.02) inset !important;
    }
    #reputationDetailsModal.rep-details-v37 .modal-header-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      padding: 0;
      margin: 0 0 6px;
      flex-shrink: 0;
      gap: 16px;
    }
    #reputationDetailsModal.rep-details-v37 #reputationDetailsModalTitle {
      display: block;
      font-size: 15px;
      font-weight: 600;
      letter-spacing: 0;
      text-transform: none;
      color: rgba(255, 255, 255, 0.88);
      line-height: 1.2;
      margin: 0;
      background: none;
      -webkit-text-fill-color: rgba(255, 255, 255, 0.88);
    }
    #reputationDetailsModal.rep-details-v37 #reputationDetailsModalCloseBtn {
      position: static;
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.08);
      border-radius: 8px;
      width: 40px;
      height: 40px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: #6b7a99;
      padding: 0;
      font-size: 0;
      line-height: 0;
      flex-shrink: 0;
      cursor: pointer;
    }
    #reputationDetailsModal.rep-details-v37 #reputationDetailsModalCloseBtn svg {
      display: block;
      width: 13px;
      height: 13px;
    }
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-body {
      display: flex;
      flex-direction: column;
      flex: 1;
      min-height: 0;
      padding: 0;
      overflow: hidden;
      max-height: none;
    }
    #reputationDetailsModal.rep-details-v37 .profile-rep-details-v37-modal,
    #reputationDetailsModal.rep-details-v37 .rep-analytics-screen {
      display: grid;
      grid-template-rows: auto 248px auto;
      gap: 8px;
      flex: 1;
      min-height: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-hero {
      display: grid;
      grid-template-columns: minmax(0, 1fr) auto;
      gap: 12px;
      align-items: center;
      padding: 12px 14px;
      border-radius: 14px;
      border: 1px solid var(--rep-analytics-border);
      background: rgba(255, 255, 255, 0.022);
      flex-shrink: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-hero-left {
      display: flex;
      flex-direction: column;
      gap: 6px;
      min-width: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-score,
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-score {
      font-size: 56px;
      font-weight: 800;
      color: var(--rep-analytics-text);
      line-height: 0.92;
      letter-spacing: -0.04em;
    }
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-score.profile-v2-rep-tier-green,
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-score.profile-v2-rep-tier-lime,
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-score.profile-v2-rep-tier-muted,
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-score.profile-v2-rep-tier-orange,
    #reputationDetailsModal.rep-details-v37 .profile-v3-rep-details-score.profile-v2-rep-tier-red {
      color: var(--rep-analytics-text);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-trust,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-trust {
      display: inline-flex;
      align-items: center;
      gap: 7px;
      font-size: 13px;
      font-weight: 600;
      color: var(--rep-analytics-muted);
      line-height: 1.25;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-trust-dot,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-trust-dot {
      width: 7px;
      height: 7px;
      border-radius: 50%;
      background: #f5c542;
      box-shadow: 0 0 8px rgba(245, 197, 66, 0.5);
      flex-shrink: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpis {
      display: flex;
      gap: 10px;
      flex-shrink: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi {
      width: 148px;
      height: 64px;
      box-sizing: border-box;
      border-radius: 14px;
      border: 1px solid var(--rep-analytics-border);
      background: rgba(0, 0, 0, 0.16);
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 4px;
      padding: 8px 10px;
      text-align: center;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi-row {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 6px;
      line-height: 1;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi-ic {
      font-size: 15px;
      line-height: 1;
      opacity: 0.9;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi-val {
      font-size: 22px;
      font-weight: 800;
      font-variant-numeric: tabular-nums;
      line-height: 1;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi.is-up .rep-analytics-kpi-val {
      color: var(--rep-analytics-up);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi.is-down .rep-analytics-kpi-val {
      color: var(--rep-analytics-down);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-kpi-lbl {
      font-size: 10px;
      font-weight: 600;
      color: rgba(158, 167, 186, 0.82);
      line-height: 1.1;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart {
      min-height: 0;
      max-height: 248px;
      display: flex;
      flex-direction: column;
      padding: 10px 12px 8px;
      border-radius: 14px;
      border: 1px solid var(--rep-analytics-border);
      background: rgba(255, 255, 255, 0.018);
      overflow: hidden;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-canvas {
      flex: 1;
      min-height: 0;
      max-height: 188px;
      border-radius: 12px;
      border: 1px solid rgba(255, 255, 255, 0.04);
      background: linear-gradient(180deg, rgba(0, 0, 0, 0.14), rgba(0, 0, 0, 0.08));
      padding: 8px 6px 2px;
      box-sizing: border-box;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-svg,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-svg {
      display: block;
      width: 100%;
      height: 100%;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-axis,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-axis {
      fill: rgba(255, 255, 255, 0.32);
      font-size: 10px;
      font-weight: 600;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-grid,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-grid {
      stroke: rgba(255, 255, 255, 0.06);
      stroke-width: 1;
      stroke-dasharray: 3 6;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-zero,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-zero {
      stroke: rgba(255, 255, 255, 0.28);
      stroke-width: 1;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-line-glow,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-line-glow {
      fill: none;
      stroke-linecap: round;
      stroke-linejoin: round;
      opacity: 0.42;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-line,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-line {
      fill: none;
      stroke-width: 3.75;
      stroke-linecap: round;
      stroke-linejoin: round;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-dot-halo,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-dot-halo {
      opacity: 0.32;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-chart-dot,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-dot {
      stroke-width: 2.75;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-legend {
      display: flex;
      align-items: center;
      flex-wrap: wrap;
      gap: 8px 16px;
      margin-top: 8px;
      font-size: 11px;
      font-weight: 600;
      color: var(--rep-analytics-muted);
      flex-shrink: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-score-caption {
      align-self: flex-start;
      margin: 0;
      text-transform: uppercase;
      letter-spacing: 1.2px;
      font-size: 10px;
    }
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-chart-title {
      flex-shrink: 0;
      margin: 0 0 8px;
    }
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-lifetime {
      color: var(--rep-analytics-text);
    }
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-lifetime strong {
      font-weight: 800;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-item {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      flex-shrink: 0;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-dot,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-dot {
      width: 6px;
      height: 6px;
      border-radius: 50%;
      display: inline-block;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-up,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-item.is-up {
      color: var(--rep-analytics-up);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-up .rep-analytics-legend-dot,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-item.is-up .rep-details-v37-legend-dot {
      background: var(--rep-analytics-up);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-down,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-item.is-down {
      color: var(--rep-analytics-down);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-down .rep-analytics-legend-dot,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-item.is-down .rep-details-v37-legend-dot {
      background: var(--rep-analytics-down);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-net strong,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-total strong.is-up {
      color: var(--rep-analytics-up);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-net strong.is-down,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-total strong.is-down {
      color: var(--rep-analytics-down);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-legend-item.is-net strong.is-flat,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-legend-total strong.is-flat {
      color: var(--rep-analytics-muted);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed {
      flex-shrink: 0;
      min-height: 128px;
      padding: 10px 14px 8px;
      border-radius: 14px;
      border: 1px solid var(--rep-analytics-border);
      background: rgba(0, 0, 0, 0.12);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-title {
      font-size: 10px;
      font-weight: 600;
      letter-spacing: 1.4px;
      text-transform: uppercase;
      color: rgba(158, 167, 186, 0.82);
      margin: 0 0 6px;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-list {
      display: flex;
      flex-direction: column;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-row,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      height: 36px;
      min-height: 36px;
      max-height: 36px;
      padding: 0 2px;
      border-bottom: 1px solid rgba(255, 255, 255, 0.06);
      font-size: 13px;
      font-weight: 700;
      box-sizing: border-box;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-row.is-last,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-row.is-last {
      border-bottom: none;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-delta,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-delta {
      font-size: 14px;
      font-variant-numeric: tabular-nums;
      min-width: 32px;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-row.is-up .rep-analytics-feed-delta,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-row.is-up .rep-details-v37-event-delta {
      color: var(--rep-analytics-up);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-row.is-down .rep-analytics-feed-delta,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-row.is-down .rep-details-v37-event-delta {
      color: var(--rep-analytics-down);
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-time,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-time {
      color: rgba(158, 167, 186, 0.92);
      text-align: right;
      font-weight: 600;
      font-size: 12px;
      font-variant-numeric: tabular-nums;
    }
    #reputationDetailsModal.rep-details-v37 .rep-analytics-feed-empty,
    #reputationDetailsModal.rep-details-v37 .rep-details-v37-event-empty {
      color: var(--rep-analytics-muted);
      font-size: 12px;
      font-weight: 600;
      padding: 8px 2px;
    }
    #reputationDetailsModal.rep-details-v37 .profile-v2-rep-empty-title {
      font-size: 15px;
      font-weight: 700;
      color: var(--profile-text-primary);
    }
    #reputationDetailsModal.rep-details-v37 .profile-v2-rep-empty-hint {
      font-size: 12px;
      color: #6b7a99;
    }
    #profileViewerModal .profile-modal__title.delete-title { margin: 0; background: none; -webkit-text-fill-color: rgba(255, 255, 255, 0.4); }
    #profileViewerModal .profile-modal__close-btn.modal-close { font-size: 0; line-height: 0; padding: 0; }
    #profileViewerModal .profile-modal__avatar-inner img { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: block; position: relative; z-index: 1; opacity: 1; mix-blend-mode: normal; filter: none; box-shadow: none; }
    #profileViewerModal .profile-modal__avatar-inner .profile-nitro-avatar-fallback:not(.hidden) { width: 100%; height: 100%; object-fit: cover; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-size: 14px; font-weight: 800; color: #7eb8f7; position: relative; z-index: 1; opacity: 1; mix-blend-mode: normal; filter: none; box-shadow: none; }
    #profileViewerModal .profile-modal__avatar-inner .profile-v37-avatar-placeholder,
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner .profile-v37-avatar-placeholder,
    #profileViewerModal.profile-ui-v37 .profile-edit-v37__avatar-wrap .profile-v37-avatar-placeholder {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 50%;
      display: block;
      flex-shrink: 0;
      mix-blend-mode: normal;
      pointer-events: none;
    }
    #profileViewerModal .profile-modal__avatar-inner .profile-nitro-avatar-fallback:has(.profile-v37-avatar-placeholder),
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner .profile-nitro-avatar-fallback:has(.profile-v37-avatar-placeholder),
    #profileViewerModal.profile-ui-v37 .profile-edit-v37__avatar-wrap .profile-viewer-avatar-btn > span:has(.profile-v37-avatar-placeholder) {
      font-size: 0;
      line-height: 0;
      color: transparent;
      padding: 0;
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      height: 100%;
    }
    #profileViewerModal.profile-ui-v37 .profile-edit-v37__avatar-wrap .profile-viewer-avatar-btn > span {
      display: flex;
      align-items: center;
      justify-content: center;
    }
    #profileViewerModal .profile-modal__avatar-inner .profile-nitro-avatar-btn:not([class*="frame-"]) { width: 100%; height: 100%; border: none; padding: 0; background: transparent; border-radius: 50%; overflow: hidden; cursor: zoom-in; }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar[class*="frame-"] { overflow: visible; }
    #profileViewerModal .profile-modal__avatar-wrap.is-online .profile-modal__avatar-online { display: block; }
    #profileViewerModal .profile-modal__avatar-online { display: none; }
    #profileViewerModal .profile-modal__premium.hidden { display: none !important; }
    #profileViewerModal .profile-modal__rep-card.hidden,
    #profileViewerModal .profile-modal__streak-card.hidden,
    #profileViewerModal .profile-modal__note-card.hidden { display: none !important; }
    #profileViewerModal .profile-modal__section.hidden { display: none !important; }
    #profileViewerModal .profile-viewer-right .profile-v2-block { background: transparent !important; border: none !important; padding: 0 !important; margin: 0 !important; border-radius: 0 !important; box-shadow: none !important; }
    #profileViewerModal .profile-modal__note-content { width: 100%; min-height: 0; border: none; background: transparent; resize: vertical; font: inherit; color: rgba(255, 255, 255, 0.2); padding: 0; outline: none; }
    #profileViewerModal .profile-modal__edit-wrap .secondary,
    #profileViewerModal .profile-modal__edit-wrap button { font-family: Inter, sans-serif; }
    #profileViewerModal .profile-modal__vote-up button,
    #profileViewerModal .profile-modal__vote-down button { all: unset; display: inline-flex; align-items: center; gap: 4px; cursor: pointer; font: inherit; color: inherit; }
    #profileViewerModal .profile-modal__social-item { text-decoration: none; color: inherit; }
    #profileViewerModal .profile-modal__rep-card.is-negative { background: rgba(231, 66, 66, 0.03); border-color: rgba(231, 66, 66, 0.1); }
    #profileViewerModal .profile-modal__rep-card.is-negative .profile-modal__rep-status,
    #profileViewerModal .profile-modal__rep-card.is-negative .profile-modal__reputation-ring-caption { color: #e74242; }
    #profileViewerModal .profile-modal__rep-card.is-neutral,
    #profileViewerModal .profile-modal__rep-card.is-seed { background: rgba(255, 255, 255, 0.018); border-color: rgba(255, 255, 255, 0.06); }
    #profileViewerModal .profile-modal__rep-card.is-neutral .profile-modal__rep-status,
    #profileViewerModal .profile-modal__rep-card.is-neutral .profile-modal__reputation-ring-caption,
    #profileViewerModal .profile-modal__rep-card.is-seed .profile-modal__rep-status,
    #profileViewerModal .profile-modal__rep-card.is-seed .profile-modal__reputation-ring-caption { color: #9ea7ba; }
    #profileViewerModal .profile-viewer-mobile-nav { display: none !important; }
    @media (max-width: 960px) {
      #profileViewerModal:not(.profile-ui-v37) .profile-modal__body { flex-direction: column; }
      #profileViewerModal:not(.profile-ui-v37) .profile-modal__left { width: 100%; padding-right: 0; }
      #profileViewerModal:not(.profile-ui-v37) .profile-modal__right { padding-left: 0; }
      #profileViewerModal:not(.profile-ui-v37) .profile-modal__divider { display: none; }
    }


    /* ── END PROFILE MODAL ─────────────────────────────────────────── */

    /* Messenger sidebar — V37 profile (scoped to .col-user only; modal untouched) */
    .col-user .col-user-panel-head {
      display: none;
    }

    .col-user .col-user-profile-v37 {
      display: flex;
      flex-direction: column;
      align-items: center;
      width: 100%;
      gap: 0;
      padding: 0;
      box-sizing: border-box;
      cursor: pointer;
    }

    .col-user .col-user-profile-v37 > #colUserRep,
    .col-user .col-user-profile-v37 > #colUserStreak {
      width: 100%;
      align-self: stretch;
      margin: 0;
      padding: 0;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-wrap::before,
    .col-user .col-user-profile-v37 .profile-modal__avatar-glow {
      display: none;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-inner img,
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner .profile-nitro-avatar-fallback:not(.hidden) {
      width: 100%;
      height: 100%;
      object-fit: cover;
      border-radius: 50%;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 14px;
      font-weight: 800;
      color: #7eb8f7;
    }
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner img {
      display: block;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-inner .profile-nitro-avatar-btn:not([class*="frame-"]) {
      width: 100%;
      height: 100%;
      border: none;
      padding: 0;
      background: transparent;
      border-radius: 50%;
      overflow: hidden;
      cursor: pointer;
    }
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner .profile-nitro-avatar-btn[class*="frame-"] {
      overflow: visible;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-wrap.is-online .profile-modal__avatar-online {
      display: block;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-online {
      display: none;
    }

    .col-user .col-user-profile-v37 .profile-modal__premium.hidden {
      display: none !important;
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-card.hidden,
    .col-user .col-user-profile-v37 .profile-modal__streak-card.hidden {
      display: none !important;
    }

    /* Reset legacy Messenger .profile-card inside sidebar V37 */
    .col-user .col-user-profile-v37 .profile-card {
      margin: 0 !important;
      gap: 0 !important;
      align-content: unset !important;
      min-height: 0 !important;
      border-radius: 14px;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-ring {
      width: 104px;
      height: 104px;
      background: transparent !important;
      padding: 0 !important;
      box-shadow: none !important;
    }
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner:has(.profile-viewer-avatar[class*="frame-"]) {
      background: transparent;
      overflow: visible;
    }
    .col-user .col-user-profile-v37 .profile-nitro-avatar-btn.profile-viewer-avatar {
      width: 100%;
      height: 100%;
      margin: 0;
      box-sizing: border-box;
      font-size: 24px;
    }

    .col-user .col-user-profile-v37 .profile-modal__avatar-wrap {
      margin-bottom: 10px;
    }

    .col-user .col-user-profile-v37 .profile-modal__nickname {
      font-size: 20px;
      margin-bottom: 6px;
    }

    .col-user .col-user-profile-v37 .profile-modal__premium {
      margin-bottom: 14px;
    }

    .col-user .col-user-profile-v37 .profile-card.profile-modal__rep-card {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      justify-content: space-between !important;
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      max-height: none !important;
      padding: 0 10px !important;
      gap: 8px !important;
      margin-bottom: 10px !important;
      box-sizing: border-box !important;
      background: rgba(66, 231, 122, 0.03);
      border: 1px solid rgba(66, 231, 122, 0.1);
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-info {
      flex: 1 1 0;
      min-width: 0;
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-label {
      font-size: 10px;
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-status {
      font-size: 13px;
    }

    .col-user .col-user-profile-v37 .profile-modal__vote-up,
    .col-user .col-user-profile-v37 .profile-modal__vote-down {
      font-size: 11px;
      padding: 2px 6px;
    }

    .col-user .col-user-profile-v37 .profile-modal__reputation-ring {
      flex: 0 0 72px;
      width: 72px !important;
      height: 72px !important;
    }

    .col-user .col-user-profile-v37 .profile-modal__reputation-ring-svg {
      width: 100%;
      height: 100%;
    }

    .col-user .col-user-profile-v37 .profile-modal__reputation-ring-value {
      font-size: 18px;
    }

    .col-user .col-user-profile-v37 .profile-modal__reputation-ring-caption {
      font-size: 8px;
    }

    .col-user .col-user-profile-v37 .profile-card.profile-modal__streak-card {
      display: flex !important;
      flex-direction: row !important;
      align-items: center !important;
      flex-wrap: nowrap !important;
      gap: 8px !important;
      width: 100% !important;
      height: auto !important;
      min-height: 0 !important;
      max-height: none !important;
      padding: 8px 10px !important;
      margin-bottom: 0 !important;
      box-sizing: border-box !important;
      background: rgba(255, 107, 26, 0.04);
      border: 1px solid rgba(255, 107, 26, 0.14);
    }

    .col-user .col-user-profile-v37 .profile-modal__streak-icon-wrap {
      width: 32px;
      height: 32px;
      flex-shrink: 0;
    }

    .col-user .col-user-profile-v37 .profile-modal__streak-copy {
      flex: 1 1 0;
      min-width: 0;
    }

    .col-user .col-user-profile-v37 .profile-modal__streak-title {
      font-size: 13px;
    }

    .col-user .col-user-profile-v37 .profile-modal__streak-sub {
      font-size: 10px;
    }

    .col-user .col-user-profile-v37 .profile-modal__streak-badge {
      flex-shrink: 0;
      font-size: 10px;
      padding: 2px 6px;
      white-space: nowrap;
    }

    .col-user .col-user-profile-v37 .profile-modal__vote-up button,
    .col-user .col-user-profile-v37 .profile-modal__vote-down button {
      all: unset;
      display: inline-flex;
      align-items: center;
      gap: 4px;
      cursor: pointer;
      font: inherit;
      color: inherit;
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-negative {
      background: rgba(231, 66, 66, 0.03);
      border-color: rgba(231, 66, 66, 0.1);
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-negative .profile-modal__rep-status,
    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-negative .profile-modal__reputation-ring-caption {
      color: #e74242;
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-neutral,
    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-seed {
      background: rgba(255, 255, 255, 0.018);
      border-color: rgba(255, 255, 255, 0.06);
    }

    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-neutral .profile-modal__rep-status,
    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-neutral .profile-modal__reputation-ring-caption,
    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-seed .profile-modal__rep-status,
    .col-user .col-user-profile-v37 .profile-modal__rep-card.is-seed .profile-modal__reputation-ring-caption {
      color: #9ea7ba;
    }



    .profile-nitro-metrics {
      width: 100%;
      display: grid;
      grid-template-columns: repeat(2, minmax(0, 1fr));
      gap: 6px;
      opacity: 0.68;
      margin-top: 0;
      padding-top: 2px;
    }

    .profile-nitro-metric {
      padding: 6px 8px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 32%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 24%, transparent);
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 2px;
      min-height: 50px;
      justify-content: center;
    }

    .profile-nitro-metric-lbl {
      font-size: 8px;
      font-weight: 600;
      letter-spacing: 0.08em;
      text-transform: none;
      color: color-mix(in srgb, var(--muted) 92%, transparent);
      opacity: 0.82;
    }

    .profile-nitro-metric-ic {
      font-size: 14px;
      line-height: 1;
      opacity: 0.72;
    }

    .profile-nitro-metric-val {
      font-size: 17px;
      font-weight: 750;
      letter-spacing: -0.02em;
      color: color-mix(in srgb, var(--text) 82%, var(--muted));
    }

    .profile-nitro-trophies {
      width: 100%;
      margin-top: 2px;
    }

    .profile-nitro-trophies-title {
      font-size: 10px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: var(--muted);
      margin: 0 0 8px;
      text-align: left;
    }

    .profile-nitro-ach-grid {
      display: grid;
      grid-template-columns: repeat(3, minmax(0, 1fr));
      gap: 8px;
    }

    .profile-nitro-trophy {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 4px;
      padding: 8px 4px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 50%, transparent);
      min-height: 72px;
      justify-content: center;
    }

    .profile-nitro-trophy.is-locked {
      opacity: 0.55;
    }

    .profile-nitro-trophy-ic {
      font-size: 20px;
      line-height: 1;
    }

    .profile-nitro-trophy-label {
      font-size: 9px;
      font-weight: 650;
      line-height: 1.2;
      text-align: center;
      color: color-mix(in srgb, var(--text) 80%, var(--muted));
    }

    .profile-nitro-trophy-rarity--legendary { border-color: color-mix(in srgb, #f5c542 45%, transparent); }
    .profile-nitro-trophy-rarity--epic { border-color: color-mix(in srgb, #b07cff 40%, transparent); }
    .profile-nitro-trophy-rarity--rare { border-color: color-mix(in srgb, #5eb8ff 40%, transparent); }

    @media (min-width: 769px) {
      .profile-nitro-cover {
        margin-bottom: -8px;
      }

      .profile-nitro-body {
        gap: 18px;
        padding: 0 22px 22px;
      }

      .profile-nitro-reputation-ring-donut {
        width: 168px;
        height: 168px;
        padding: 8px;
      }

      .profile-nitro-reputation-ring-score {
        font-size: 32px;
      }

      .profile-nitro-reputation-ring-foot {
        margin-top: 6px;
      }

      .profile-nitro-metrics {
        gap: 6px;
      }

      .profile-nitro-metric {
        padding: 8px 6px;
        min-height: 62px;
      }

      .profile-nitro-trophies-title {
        margin: 0 0 5px;
      }

      .profile-nitro-ach-grid {
        gap: 6px;
      }

      .profile-nitro-trophy {
        gap: 3px;
        padding: 6px 4px;
        min-height: 64px;
      }

      .profile-nitro-trophy-ic {
        font-size: 17px;
      }
    }

  #profileEditHero {
      position: relative;
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    #profileEditHero .profile-viewer-cover {
      width: 100%;
      height: 128px;
      margin: 0;
      border-radius: 12px;
    }

    #profileEditHero .profile-viewer-identity-row {
      margin-top: -54px;
      padding: 0 8px;
    }

    .profile-nitro-panels {
      display: flex;
      flex-direction: column;
      gap: 14px;
      min-width: 0;
    }

    .profile-nitro-panels .profile-v2-block,
    .profile-nitro-panel {
      border: 1px solid color-mix(in srgb, var(--border) 52%, transparent);
      border-radius: 20px;
      background: color-mix(in srgb, var(--bubble-in) 42%, transparent);
      padding: 16px 16px 14px;
      min-width: 0;
      box-shadow: 0 1px 0 color-mix(in srgb, #fff 5%, transparent) inset;
      backdrop-filter: blur(10px);
    }

    .profile-nitro-panels .profile-v2-block-title,
    .profile-nitro-panel-title {
      margin: 0 0 12px;
      font-size: 9px;
      font-weight: 750;
      letter-spacing: 0.16em;
      text-transform: uppercase;
      color: color-mix(in srgb, var(--muted) 88%, transparent);
      opacity: 0.78;
    }

    .profile-nitro-panel--about-hero {
      padding: 22px 20px 18px;
      border-color: color-mix(in srgb, #d4a017 22%, var(--border));
      background:
        radial-gradient(ellipse 120% 80% at 0% 0%, rgba(212, 160, 23, 0.1), transparent 55%),
        radial-gradient(ellipse 90% 70% at 100% 100%, rgba(139, 92, 246, 0.06), transparent 58%),
        color-mix(in srgb, var(--bubble-in) 72%, transparent);
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 12px 36px rgba(0, 0, 0, 0.12);
    }

    .profile-nitro-about-hero-inner--empty {
      padding: 8px 4px 4px;
    }

    .profile-nitro-about-quote {
      margin: 0;
      padding: 0;
      border-left: none;
      font-size: 21px;
      line-height: 1.66;
      font-weight: 450;
      color: color-mix(in srgb, var(--text) 96%, var(--muted));
    }

    .profile-nitro-panel--about-hero .profile-nitro-about-quote::before {
      content: "\201C";
      display: block;
      font-size: 52px;
      line-height: 0.85;
      font-weight: 800;
      color: color-mix(in srgb, #d4a017 52%, transparent);
      margin-bottom: 4px;
    }

    .profile-nitro-about-empty {
      font-size: 17px;
      line-height: 1.62;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
      font-style: italic;
      margin: 0;
    }

    .profile-nitro-about-empty::before {
      content: "\201C";
      color: color-mix(in srgb, var(--nitro-accent, #9b7bff) 58%, var(--muted));
      font-size: 32px;
      line-height: 0;
      margin-right: 4px;
      vertical-align: -0.2em;
    }

    .profile-nitro-social-stack {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .profile-nitro-social-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      padding: 10px 12px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
      background: color-mix(in srgb, var(--panel) 60%, transparent);
      color: var(--text);
      text-decoration: none;
      font-size: 13px;
      font-weight: 650;
    }

    .profile-nitro-social-btn--youtube { border-color: color-mix(in srgb, #ff4444 35%, transparent); }
    .profile-nitro-social-btn--twitch { border-color: color-mix(in srgb, #9146ff 35%, transparent); }
    .profile-nitro-social-btn--discord { border-color: color-mix(in srgb, #5865f2 35%, transparent); }
    .profile-nitro-social-btn--telegram { border-color: color-mix(in srgb, #2aabee 35%, transparent); }
    .profile-nitro-social-btn--github { border-color: color-mix(in srgb, #8b949e 35%, transparent); }
    .profile-nitro-social-btn--tiktok { border-color: color-mix(in srgb, #ff0050 30%, transparent); }
    .profile-nitro-social-btn--other { border-color: var(--border); }

    .profile-nitro-activity-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin: 0;
      padding: 0;
      list-style: none;
    }

    .profile-nitro-activity-item {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      font-weight: 550;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      padding: 6px 2px;
    }

    .profile-nitro-channels-empty {
      padding: 14px;
      border-radius: 12px;
      border: 1px dashed color-mix(in srgb, var(--border) 90%, transparent);
      font-size: 13px;
      color: var(--muted);
      line-height: 1.4;
    }

    .profile-nitro-channel-card,
    .profile-nitro-project-card {
      display: flex;
      gap: 12px;
      width: 100%;
      text-align: left;
      padding: 12px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
      background: color-mix(in srgb, var(--panel) 58%, transparent);
      color: inherit;
      font: inherit;
      cursor: pointer;
      transition: border-color 0.2s ease, background 0.2s ease;
    }

    .profile-nitro-project-card:hover {
      border-color: color-mix(in srgb, #7ea2ff 35%, var(--border));
      background: color-mix(in srgb, var(--panel) 72%, transparent);
    }

    .profile-nitro-project-avatar,
    .profile-nitro-channel-avatar {
      width: 48px;
      height: 48px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      font-size: 14px;
      font-weight: 800;
      background: color-mix(in srgb, var(--bubble-in) 80%, transparent);
      flex-shrink: 0;
      overflow: hidden;
      border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
    }

    .profile-nitro-project-body {
      min-width: 0;
      flex: 1;
    }

    .profile-nitro-project-head {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 8px;
    }

    .profile-nitro-project-title,
    .profile-nitro-channel-title {
      font-size: 15px;
      font-weight: 750;
      line-height: 1.25;
    }

    .profile-nitro-project-badge {
      flex-shrink: 0;
      padding: 2px 7px;
      border-radius: 999px;
      font-size: 9px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: #86efac;
      background: color-mix(in srgb, #22c55e 16%, transparent);
      border: 1px solid color-mix(in srgb, #22c55e 32%, transparent);
    }

    .profile-nitro-project-desc,
    .profile-nitro-channel-desc {
      font-size: 12px;
      color: var(--muted);
      margin-top: 4px;
      line-height: 1.4;
      display: -webkit-box;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
    }

    .profile-nitro-project-meta {
      margin-top: 6px;
      font-size: 11px;
      font-weight: 650;
      color: color-mix(in srgb, var(--muted) 90%, var(--text));
    }

    .profile-nitro-channels-list {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .profile-nitro-showcase {
      display: grid;
      grid-template-columns: repeat(3, minmax(120px, 1fr));
      gap: 10px;
    }

    .profile-nitro-showcase-card {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: flex-start;
      gap: 6px;
      min-height: 132px;
      max-width: 140px;
      width: 100%;
      margin: 0 auto;
      padding: 12px 8px 10px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
      background: color-mix(in srgb, var(--panel) 52%, transparent);
      text-align: center;
    }

    .profile-nitro-showcase-frame {
      width: 56px;
      height: 56px;
      border-radius: 14px;
      display: grid;
      place-items: center;
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 65%, transparent);
    }

    .profile-nitro-showcase-ic {
      font-size: 28px;
      line-height: 1;
    }

    .profile-nitro-showcase-rarity {
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .profile-nitro-showcase-name {
      font-size: 11px;
      font-weight: 700;
      line-height: 1.25;
      color: color-mix(in srgb, var(--text) 90%, var(--muted));
    }

    .profile-nitro-showcase-card--legendary {
      border-color: color-mix(in srgb, #f5c542 48%, var(--border));
      box-shadow: 0 0 24px rgba(245, 197, 66, 0.32);
    }

    .profile-nitro-showcase-card--legendary .profile-nitro-showcase-frame {
      border-color: color-mix(in srgb, #f5c542 55%, transparent);
      box-shadow: inset 0 0 18px rgba(245, 197, 66, 0.12);
    }

    .profile-nitro-showcase-card--legendary .profile-nitro-showcase-rarity {
      color: #f5d98b;
    }

    .profile-nitro-showcase-card--epic {
      border-color: color-mix(in srgb, #b07cff 45%, var(--border));
      box-shadow: 0 0 24px rgba(176, 124, 255, 0.28);
    }

    .profile-nitro-showcase-card--epic .profile-nitro-showcase-frame {
      border-color: color-mix(in srgb, #b07cff 50%, transparent);
      box-shadow: inset 0 0 18px rgba(176, 124, 255, 0.12);
    }

    .profile-nitro-showcase-card--epic .profile-nitro-showcase-rarity {
      color: #d8b4fe;
    }

    .profile-nitro-showcase-card--rare {
      border-color: color-mix(in srgb, #5eb8ff 42%, var(--border));
      box-shadow: 0 0 20px rgba(94, 184, 255, 0.22);
    }

    .profile-nitro-showcase-card--rare .profile-nitro-showcase-frame {
      border-color: color-mix(in srgb, #5eb8ff 48%, transparent);
    }

    .profile-nitro-showcase-card--rare .profile-nitro-showcase-rarity {
      color: #93c5fd;
    }

    .profile-nitro-showcase-card--locked {
      opacity: 0.58;
      border-color: color-mix(in srgb, var(--border) 90%, transparent);
      box-shadow: none;
      background: color-mix(in srgb, var(--bubble-in) 40%, transparent);
    }

    .profile-nitro-project-avatar img,
    .profile-nitro-channel-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .profile-nitro-ach-collection {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
      gap: 8px;
    }

    .profile-nitro-ach-card {
      padding: 10px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
      background: color-mix(in srgb, var(--panel) 50%, transparent);
    }

    .profile-nitro-ach-card-top {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 6px;
      margin-bottom: 6px;
    }

    .profile-nitro-ach-ic { font-size: 18px; }
    .profile-nitro-ach-rarity { font-size: 10px; font-weight: 700; color: var(--muted); }
    .profile-nitro-ach-name { font-size: 12px; font-weight: 700; }
    .profile-nitro-ach-date { font-size: 10px; color: var(--muted); margin-top: 4px; }

    .profile-nitro-loading,
    .profile-nitro-error {
      padding: 16px;
      text-align: center;
      font-size: 13px;
      color: var(--muted);
    }

    .profile-nitro-error { color: #f87171; }

    @media (max-width: 860px) {
      .profile-viewer-layout.profile-nitro-layout {
        grid-template-columns: 1fr;
      }
    }
    .profile-viewer-cover {
      height: 128px;
      border-radius: 12px;
      background: linear-gradient(135deg, rgba(90, 145, 255, 0.5), rgba(120, 200, 120, 0.4));
      position: relative;
      overflow: hidden;
    }

    .profile-viewer-cover-label-layer {
      position: absolute;
      inset: 0;
      pointer-events: none;
    }

    .profile-viewer-cover-label-badge {
      position: absolute;
      padding: 0;
      border-radius: 0;
      border: 0;
      background: transparent;
      color: #fff;
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      backdrop-filter: none;
      text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
    }

    .profile-viewer-cover-label-layer.layout-center_big .profile-viewer-cover-label-badge {
      /* Не строго по центру обложки: слева круг аватара (~116px), иначе текст перекрывается */
      left: calc(50% + clamp(18px, 12%, 40px));
      top: 50%;
      transform: translate(-50%, -50%);
      font-size: 16px;
      padding: 7px 14px;
      letter-spacing: 0.12em;
      white-space: nowrap;
      display: inline-flex;
      align-items: center;
      gap: 0.28em;
    }

    .profile-viewer-cover-label-layer.layout-top_band .profile-viewer-cover-label-badge {
      left: 50%;
      top: 8px;
      transform: translateX(-50%);
      font-size: 12px;
      padding: 5px 12px;
      letter-spacing: 0.1em;
      white-space: nowrap;
      display: inline-flex;
      align-items: center;
      gap: 0.28em;
    }

    .profile-viewer-cover-label-layer.layout-diagonal_small .profile-viewer-cover-label-badge {
      font-size: 10px;
      padding: 0;
      letter-spacing: 0.06em;
      opacity: 0.92;
      border: 0;
      background: transparent;
      backdrop-filter: none;
      border-radius: 0;
      transform: rotate(10deg);
      text-shadow: 0 1px 8px rgba(0, 0, 0, 0.45);
    }

    .profile-viewer-cover.cover_default, .profile-cover-pick-preview.cover_default { background: linear-gradient(160deg, #64748b 0%, #94a3b8 48%, #cbd5e1 100%); }
    .profile-viewer-cover.cover_none, .profile-cover-pick-preview.cover_none {
      background: rgba(255, 255, 255, 0.03);
      box-shadow: inset 0 0 0 1px rgba(255, 255, 255, 0.08);
    }
    .profile-viewer-cover.cover_8, .profile-cover-pick-preview.cover_8,
    .profile-viewer-cover.img_mist, .profile-cover-pick-preview.img_mist { background-color: #020208; background-image: url("/assets/profile-covers/abstract-wave.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.cover_9, .profile-cover-pick-preview.cover_9,
    .profile-viewer-cover.img_dawn, .profile-cover-pick-preview.img_dawn { background-color: #020208; background-image: url("/assets/profile-covers/abstract-prism.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_abstract_beams, .profile-cover-pick-preview.img_abstract_beams { background-color: #020208; background-image: url("/assets/profile-covers/abstract-light-beams.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_nature_emerald_forest, .profile-cover-pick-preview.img_nature_emerald_forest { background-color: #020208; background-image: url("/assets/profile-covers/nature-emerald-forest.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_nature_waterfall_valley, .profile-cover-pick-preview.img_nature_waterfall_valley { background-color: #020208; background-image: url("/assets/profile-covers/nature-waterfall-valley.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_nature_cover_3, .profile-cover-pick-preview.img_nature_cover_3 { background-color: #020208; background-image: url("/assets/profile-covers/nature-cover-3.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_space_cosmic_nebula, .profile-cover-pick-preview.img_space_cosmic_nebula { background-color: #020208; background-image: url("/assets/profile-covers/space-cosmic-nebula.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_space_black_hole, .profile-cover-pick-preview.img_space_black_hole { background-color: #020208; background-image: url("/assets/profile-covers/space-black-hole.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_space_cover_3, .profile-cover-pick-preview.img_space_cover_3 { background-color: #020208; background-image: url("/assets/profile-covers/space-cover-3.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_dark_obsidian_geometry, .profile-cover-pick-preview.img_dark_obsidian_geometry { background-color: #020208; background-image: url("/assets/profile-covers/dark-obsidian-geometry.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_dark_premium_material, .profile-cover-pick-preview.img_dark_premium_material { background-color: #020208; background-image: url("/assets/profile-covers/dark-premium-material.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    .profile-viewer-cover.img_dark_cover_3, .profile-cover-pick-preview.img_dark_cover_3 { background-color: #020208; background-image: url("/assets/profile-covers/dark-cover-3.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }

    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.cover_default::before { background: linear-gradient(160deg, #64748b 0%, #94a3b8 48%, #cbd5e1 100%); }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.cover_8::before,
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_mist::before { background-color: #020208; background-image: url("/assets/profile-covers/abstract-wave.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.cover_9::before,
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_dawn::before { background-color: #020208; background-image: url("/assets/profile-covers/abstract-prism.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_abstract_beams::before { background-color: #020208; background-image: url("/assets/profile-covers/abstract-light-beams.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_nature_emerald_forest::before { background-color: #020208; background-image: url("/assets/profile-covers/nature-emerald-forest.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_nature_waterfall_valley::before { background-color: #020208; background-image: url("/assets/profile-covers/nature-waterfall-valley.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_nature_cover_3::before { background-color: #020208; background-image: url("/assets/profile-covers/nature-cover-3.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_space_cosmic_nebula::before { background-color: #020208; background-image: url("/assets/profile-covers/space-cosmic-nebula.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_space_black_hole::before { background-color: #020208; background-image: url("/assets/profile-covers/space-black-hole.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_space_cover_3::before { background-color: #020208; background-image: url("/assets/profile-covers/space-cover-3.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_dark_obsidian_geometry::before { background-color: #020208; background-image: url("/assets/profile-covers/dark-obsidian-geometry.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_dark_premium_material::before { background-color: #020208; background-image: url("/assets/profile-covers/dark-premium-material.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }
    :is(#profileViewerModal.profile-ui-v37 #profileNitroCard, .col-user .col-user-profile-v37, #profileViewerModal.profile-ui-v37 .profile-edit-v37__preview-cover).profile-viewer-cover.img_dark_cover_3::before { background-color: #020208; background-image: url("/assets/profile-covers/dark-cover-3.png"); background-size: cover; background-position: center top; background-repeat: no-repeat; }

    .profile-cover-picker {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .profile-cover-pick {
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 0;
      overflow: hidden;
      background: transparent;
      cursor: pointer;
      height: 54px;
      position: relative;
    }

    .profile-cover-pick.is-active {
      box-shadow: 0 0 0 2px color-mix(in srgb, #7ea2ff 58%, transparent);
      border-color: color-mix(in srgb, #7ea2ff 55%, var(--border));
    }

    .profile-cover-pick-preview {
      position: absolute;
      inset: 0;
    }

    .profile-cover-label-picker {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
    }

    .profile-cover-label-pick {
      border: 1px solid var(--border);
      border-radius: 999px;
      padding: 6px 10px;
      background: color-mix(in srgb, var(--panel) 90%, transparent);
      color: var(--text);
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.04em;
      cursor: pointer;
    }

    .profile-cover-label-pick.is-active {
      border-color: color-mix(in srgb, #7ea2ff 55%, var(--border));
      box-shadow: 0 0 0 1px color-mix(in srgb, #7ea2ff 35%, transparent);
    }

    .profile-avatar-frame-pick {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 1px solid var(--border);
      border-radius: 999px;
      padding: 5px 10px;
      background: color-mix(in srgb, var(--panel) 90%, transparent);
      color: var(--text);
      font-size: 12px;
      font-weight: 700;
      cursor: pointer;
    }

    .profile-avatar-frame-pick-preview {
      width: 20px;
      height: 20px;
      border-radius: 50%;
      border: 2px solid color-mix(in srgb, var(--border) 80%, #fff);
      background: color-mix(in srgb, var(--panel) 84%, transparent);
    }

    .profile-avatar-frame-pick-preview.frame-gold_glow { border-color: #f3c341; box-shadow: 0 0 7px rgba(255, 215, 87, 0.55); }
    .profile-avatar-frame-pick-preview.frame-gold_spin { border-color: #f7cf56; background: conic-gradient(from 0deg, #f7cf56, #fff0b5, #d79a2b, #f7cf56); }
    .profile-avatar-frame-pick-preview.frame-gold_royal { border-color: #f1b937; box-shadow: inset 0 0 0 1px rgba(255, 241, 186, 0.35); }
    .profile-avatar-frame-pick-preview.frame-gold_minimal { border-color: #e7be4a; box-shadow: 0 0 0 1px rgba(231, 190, 74, 0.22); }
    .profile-avatar-frame-pick-preview.frame-silver_edge { border-color: #d7dde8; box-shadow: 0 0 8px rgba(220, 228, 245, 0.35); }
    .profile-avatar-frame-pick-preview.frame-fire_ring { border-color: #ff7a1a; box-shadow: 0 0 8px rgba(255, 103, 25, 0.45); }
    .profile-avatar-frame-pick-preview.frame-neon_cyan { border-color: #00e9ff; box-shadow: 0 0 9px rgba(0, 233, 255, 0.52); }
    .profile-avatar-frame-pick-preview.frame-plasma_pulse { border-color: #8c7bff; box-shadow: 0 0 7px rgba(85, 225, 255, 0.45); }

    .profile-viewer-head {
      display: none;
      align-items: center;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 10px 12px;
      background: color-mix(in srgb, var(--bubble-in) 90%, transparent);
    }

    .profile-viewer-avatar {
      width: 106px;
      height: 106px;
      border-radius: 50%;
      position: relative;
      display: inline-flex;
      align-items: stretch;
      justify-content: stretch;
      font-size: 32px;
      font-weight: 700;
      border: 1px solid color-mix(in srgb, #7ba8ff 45%, var(--border));
      background: linear-gradient(
        165deg,
        color-mix(in srgb, #7ba8ff 28%, transparent),
        color-mix(in srgb, #7ba8ff 10%, transparent)
      );
      color: color-mix(in srgb, var(--text) 90%, #7ba8ff);
      text-transform: uppercase;
      user-select: none;
      overflow: hidden;
      box-sizing: border-box;
      isolation: isolate;
    }

    .profile-viewer-avatar-btn {
      margin-top: -72px;
      margin-left: 10px;
      cursor: pointer;
      position: relative;
      z-index: 3;
    }

    .profile-viewer-avatar-btn > span {
      position: absolute;
      left: 50%;
      top: 50%;
      transform: translate(-50%, -50%);
      pointer-events: none;
      z-index: 2;
      line-height: 1;
      white-space: nowrap;
    }

    .profile-viewer-avatar-img {
      position: absolute;
      inset: 0;
      box-sizing: border-box;
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
      border-radius: 50%;
      display: block;
      z-index: 1;
    }

    .profile-viewer-avatar.frame-gold_glow {
      border: 2px solid #f3c341;
      box-shadow:
        0 0 0 2px rgba(243, 195, 65, 0.28),
        0 0 18px rgba(255, 215, 87, 0.45);
      animation: avatar-gold-glow 2s ease-in-out infinite alternate;
    }

    .profile-viewer-avatar.frame-gold_spin {
      border: 2px solid transparent;
      background:
        linear-gradient(var(--panel), var(--panel)) padding-box,
        conic-gradient(from 0deg, #f7cf56, #fff0b5, #d79a2b, #f7cf56) border-box;
      animation: avatar-gold-spin 2.4s linear infinite;
    }

    .profile-viewer-avatar.frame-gold_royal {
      border: 2px solid #f1b937;
      box-shadow:
        inset 0 0 0 1px rgba(255, 241, 186, 0.4),
        0 0 0 2px rgba(241, 185, 55, 0.26),
        0 0 16px rgba(241, 185, 55, 0.35);
      animation: avatar-royal-pulse 1.9s ease-in-out infinite;
    }

    .profile-viewer-avatar.frame-gold_minimal {
      border: 2px solid #e7be4a;
      box-shadow:
        0 0 0 1px rgba(231, 190, 74, 0.2),
        0 0 10px rgba(255, 223, 117, 0.18);
    }

    .profile-viewer-avatar.frame-silver_edge {
      border: 2px solid #dbe1ec;
      box-shadow:
        0 0 0 2px rgba(219, 225, 236, 0.24),
        0 0 16px rgba(210, 226, 255, 0.34);
      animation: avatar-silver-shimmer 2.2s ease-in-out infinite;
    }

    .profile-viewer-avatar.frame-fire_ring {
      border: 2px solid #ff7a1a;
      box-shadow:
        0 0 0 2px rgba(255, 122, 26, 0.24),
        0 0 18px rgba(255, 80, 24, 0.45);
      animation: avatar-fire-flicker 1.4s ease-in-out infinite;
    }

    .profile-viewer-avatar.frame-neon_cyan {
      border: 2px solid #00e9ff;
      box-shadow:
        0 0 0 2px rgba(0, 233, 255, 0.25),
        0 0 22px rgba(0, 233, 255, 0.45);
      animation: avatar-neon-beat 1.7s ease-in-out infinite;
    }

    .profile-viewer-avatar.frame-plasma_pulse {
      border: 2px solid #8c7bff;
      box-shadow:
        0 0 0 2px rgba(140, 123, 255, 0.24),
        0 0 14px rgba(85, 225, 255, 0.35);
      animation: avatar-plasma-pulse 2.1s ease-in-out infinite;
    }

    /* V37 modal — avatar frames must win over legacy v33 !important avatar reset */
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-gold_glow {
      border: 2px solid #f3c341 !important;
      box-shadow: 0 0 0 2px rgba(243, 195, 65, 0.28), 0 0 18px rgba(255, 215, 87, 0.45) !important;
      animation: avatar-gold-glow 2s ease-in-out infinite alternate;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-gold_spin {
      border: 2px solid transparent !important;
      background: linear-gradient(var(--panel), var(--panel)) padding-box, conic-gradient(from 0deg, #f7cf56, #fff0b5, #d79a2b, #f7cf56) border-box !important;
      animation: avatar-gold-spin 2.4s linear infinite;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-gold_royal {
      border: 2px solid #f1b937 !important;
      box-shadow: inset 0 0 0 1px rgba(255, 241, 186, 0.4), 0 0 0 2px rgba(241, 185, 55, 0.26), 0 0 16px rgba(241, 185, 55, 0.35) !important;
      animation: avatar-royal-pulse 1.9s ease-in-out infinite;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-gold_minimal {
      border: 2px solid #e7be4a !important;
      box-shadow: 0 0 0 1px rgba(231, 190, 74, 0.2), 0 0 10px rgba(255, 223, 117, 0.18) !important;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-silver_edge {
      border: 2px solid #dbe1ec !important;
      box-shadow: 0 0 0 2px rgba(219, 225, 236, 0.24), 0 0 16px rgba(210, 226, 255, 0.34) !important;
      animation: avatar-silver-shimmer 2.2s ease-in-out infinite;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-fire_ring {
      border: 2px solid #ff7a1a !important;
      box-shadow: 0 0 0 2px rgba(255, 122, 26, 0.24), 0 0 18px rgba(255, 80, 24, 0.45) !important;
      animation: avatar-fire-flicker 1.4s ease-in-out infinite;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-neon_cyan {
      border: 2px solid #00e9ff !important;
      box-shadow: 0 0 0 2px rgba(0, 233, 255, 0.25), 0 0 22px rgba(0, 233, 255, 0.45) !important;
      animation: avatar-neon-beat 1.7s ease-in-out infinite;
    }
    #profileViewerModal.profile-ui-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn.profile-viewer-avatar.frame-plasma_pulse {
      border: 2px solid #8c7bff !important;
      box-shadow: 0 0 0 2px rgba(140, 123, 255, 0.24), 0 0 14px rgba(85, 225, 255, 0.35) !important;
      animation: avatar-plasma-pulse 2.1s ease-in-out infinite;
    }

    @keyframes avatar-gold-glow {
      from { box-shadow: 0 0 0 2px rgba(243, 195, 65, 0.2), 0 0 8px rgba(255, 215, 87, 0.25); }
      to { box-shadow: 0 0 0 2px rgba(243, 195, 65, 0.36), 0 0 22px rgba(255, 215, 87, 0.52); }
    }

    @keyframes avatar-gold-spin {
      from { filter: hue-rotate(0deg) brightness(1); }
      to { filter: hue-rotate(20deg) brightness(1.08); }
    }

    @keyframes avatar-royal-pulse {
      0%, 100% { box-shadow: inset 0 0 0 1px rgba(255, 241, 186, 0.35), 0 0 0 2px rgba(241, 185, 55, 0.22), 0 0 10px rgba(241, 185, 55, 0.25); }
      50% { box-shadow: inset 0 0 0 1px rgba(255, 241, 186, 0.55), 0 0 0 2px rgba(241, 185, 55, 0.35), 0 0 20px rgba(241, 185, 55, 0.45); }
    }

    @keyframes avatar-plasma-pulse {
      0%, 100% { box-shadow: 0 0 0 2px rgba(140, 123, 255, 0.2), 0 0 10px rgba(85, 225, 255, 0.2); }
      50% { box-shadow: 0 0 0 2px rgba(140, 123, 255, 0.35), 0 0 20px rgba(85, 225, 255, 0.45); }
    }

    @keyframes avatar-silver-shimmer {
      0%, 100% { filter: brightness(1); box-shadow: 0 0 0 2px rgba(219, 225, 236, 0.2), 0 0 10px rgba(210, 226, 255, 0.25); }
      50% { filter: brightness(1.08); box-shadow: 0 0 0 2px rgba(219, 225, 236, 0.35), 0 0 20px rgba(210, 226, 255, 0.45); }
    }

    @keyframes avatar-fire-flicker {
      0%, 100% { box-shadow: 0 0 0 2px rgba(255, 122, 26, 0.2), 0 0 12px rgba(255, 80, 24, 0.28); }
      50% { box-shadow: 0 0 0 2px rgba(255, 122, 26, 0.35), 0 0 24px rgba(255, 80, 24, 0.55); }
    }

    @keyframes avatar-neon-beat {
      0%, 100% { box-shadow: 0 0 0 2px rgba(0, 233, 255, 0.2), 0 0 12px rgba(0, 233, 255, 0.28); }
      50% { box-shadow: 0 0 0 2px rgba(0, 233, 255, 0.38), 0 0 28px rgba(0, 233, 255, 0.62); }
    }

    .profile-viewer-integrations {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-top: 6px;
      min-height: 72px;
    }

    .profile-viewer-integrations.hidden {
      min-height: 0;
      margin-top: 0;
    }

    .profile-viewer-about {
      display: grid;
      gap: 8px;
      margin-top: 12px;
      padding-top: 4px;
    }

    .profile-viewer-about-text {
      border: 1px solid color-mix(in srgb, var(--border) 88%, transparent);
      border-radius: 12px;
      padding: 14px 16px;
      background: color-mix(in srgb, var(--panel) 88%, transparent);
      color: var(--text);
      min-height: 52px;
      max-height: min(42vh, 260px);
      overflow-x: hidden;
      overflow-y: auto;
      white-space: pre-wrap;
      word-break: break-word;
      line-height: 1.45;
    }

    .profile-avatar-change-btn {
      width: 100%;
    }

    .profile-viewer-left button.profile-avatar-change-btn[data-profile-section="appearance"],
    .profile-viewer-left button.profile-avatar-change-btn[data-profile-section="cover"] {
      margin-top: 16px;
    }

    .profile-viewer-left .profile-editor-label-row[data-profile-section="cover"] + button.profile-avatar-change-btn[data-profile-section="cover"] {
      margin-top: 10px;
    }

    .avatar-crop-canvas {
      width: 100%;
      max-width: min(420px, 92vw);
      aspect-ratio: 1;
      height: auto;
      touch-action: none;
      cursor: grab;
      user-select: none;
      -webkit-user-select: none;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: #000;
      display: block;
    }

    .avatar-crop-canvas:active {
      cursor: grabbing;
    }

    .avatar-crop-hint {
      margin: 6px 0 0;
      font-size: 12px;
      line-height: 1.35;
      color: var(--muted);
    }

    .profile-viewer-integration-link {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      font-size: 13px;
      color: var(--text);
      text-decoration: none;
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 7px 9px;
      background: color-mix(in srgb, var(--panel) 85%, transparent);
    }

    .profile-viewer-integration-icon {
      width: 16px;
      height: 16px;
      display: inline-block;
      flex: 0 0 16px;
    }

    .profile-viewer-integration-icon--youtube {
      color: #ff0033;
    }

    .profile-viewer-integration-icon--discord {
      color: #5865f2;
    }

    .profile-viewer-integration-icon--twitch {
      color: #9146ff;
    }

    .profile-viewer-integration-empty {
      font-size: 12px;
      color: var(--muted);
      border: 1px dashed var(--border);
      border-radius: 10px;
      padding: 8px 10px;
    }

    .profile-viewer-featured-wrap {
      margin-top: 10px;
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .profile-viewer-featured-label {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.05em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .profile-viewer-featured-card {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 8px 10px;
      background: color-mix(in srgb, var(--panel) 85%, transparent);
      cursor: pointer;
      text-align: left;
      width: 100%;
      box-sizing: border-box;
      color: var(--text);
      font: inherit;
    }

    .profile-viewer-featured-card:focus-visible {
      outline: 2px solid color-mix(in srgb, #7ea2ff 70%, transparent);
    }

    .profile-viewer-featured-thumb {
      flex: 0 0 44px;
      width: 44px;
      height: 44px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, #7ba8ff 42%, var(--border));
      background: color-mix(in srgb, var(--panel) 80%, transparent);
      object-fit: cover;
      display: block;
    }

    .profile-viewer-featured-thumb--ph {
      flex: 0 0 44px;
      width: 44px;
      height: 44px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, #7ba8ff 42%, var(--border));
      background: linear-gradient(
        160deg,
        color-mix(in srgb, #7ba8ff 22%, transparent),
        color-mix(in srgb, #7ba8ff 10%, transparent)
      );
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 15px;
      font-weight: 800;
      letter-spacing: 0.04em;
      color: color-mix(in srgb, var(--text) 82%, #7ba8ff);
    }

    .profile-viewer-featured-body {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .profile-viewer-featured-title {
      font-weight: 700;
      font-size: 14px;
      line-height: 1.25;
    }

    .profile-viewer-featured-snippet {
      font-size: 12px;
      color: var(--muted);
      line-height: 1.35;
      display: -webkit-box;
      -webkit-box-orient: vertical;
      -webkit-line-clamp: 2;
      overflow: hidden;
    }

    .rail-avatar.rail-avatar--img-wrap {
      padding: 0;
      overflow: hidden;
      background: color-mix(in srgb, var(--panel) 70%, transparent);
    }

    .dialog-avatar.rail-avatar--img-wrap {
      padding: 0;
      overflow: hidden;
      background: color-mix(in srgb, var(--panel) 70%, transparent);
    }

    .rail-avatar-img:not(.olone-user-avatar-fallback-active) {
      width: 100%;
      height: 100%;
      object-fit: cover;
      object-position: center center;
      display: block;
      filter: contrast(1.03) brightness(1.04);
    }

    .entity-avatar-row {
      display: flex;
      align-items: center;
      gap: 12px;
      margin: 10px 0 14px;
    }

    .entity-avatar-preview {
      width: 64px;
      height: 64px;
      border-radius: 14px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 80%, transparent);
      object-fit: cover;
      flex: 0 0 auto;
      display: block;
    }

    .entity-avatar-preview--ph {
      width: 64px;
      height: 64px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, #7ba8ff 40%, var(--border));
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 20px;
      font-weight: 800;
      letter-spacing: 0.06em;
      color: color-mix(in srgb, var(--text) 80%, #7ba8ff);
      flex: 0 0 auto;
      background: linear-gradient(
        160deg,
        color-mix(in srgb, #7ba8ff 20%, transparent),
        color-mix(in srgb, #7ba8ff 9%, transparent)
      );
    }

    .entity-avatar-preview--ph.channel-icon-host {
      border: none;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0;
      font-weight: normal;
      letter-spacing: 0;
      color: transparent;
      flex: 0 0 auto;
      background: transparent !important;
      background-image: none !important;
      box-shadow: none;
    }

    .entity-avatar-actions {
      display: flex;
      flex-direction: column;
      gap: 6px;
      flex: 1;
      min-width: 0;
    }

    .profile-featured-channel-select {
      width: 100%;
      box-sizing: border-box;
      min-height: 38px;
      border-radius: 10px;
      border: 1px solid var(--border);
      padding: 8px 10px;
      background: color-mix(in srgb, var(--panel) 90%, transparent);
      color: var(--text);
      font: inherit;
    }

    .media-browser-tabs {
      display: flex;
      gap: 8px;
      margin-top: 6px;
    }

    .media-browser-tab-btn.is-active {
      border-color: color-mix(in srgb, #5f87ff 55%, var(--border));
      box-shadow: inset 0 0 0 1px color-mix(in srgb, #5f87ff 35%, transparent);
    }

    .media-browser-grid {
      margin-top: 10px;
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(168px, 1fr));
      gap: 10px;
      max-height: min(56vh, 620px);
      overflow: auto;
      padding-right: 2px;
    }

    .media-browser-item {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: color-mix(in srgb, var(--panel) 88%, transparent);
      overflow: hidden;
      min-width: 0;
    }

    .media-browser-thumb {
      width: 100%;
      aspect-ratio: 1 / 1;
      display: flex;
      align-items: center;
      justify-content: center;
      background: color-mix(in srgb, var(--bg) 70%, #0a1222);
      color: var(--muted);
      font-size: 12px;
      text-align: center;
    }

    .media-browser-thumb img,
    .media-browser-thumb video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .media-browser-meta {
      padding: 8px;
      display: flex;
      flex-direction: column;
      gap: 4px;
      font-size: 12px;
    }

    .media-browser-name {
      color: var(--text);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .media-browser-time {
      color: var(--muted);
      font-size: 11px;
    }

    .media-browser-links {
      margin-top: 10px;
      display: flex;
      flex-direction: column;
      gap: 8px;
      max-height: min(56vh, 620px);
      overflow: auto;
      padding-right: 2px;
    }

    .media-browser-link-row {
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 8px 10px;
      background: color-mix(in srgb, var(--panel) 90%, transparent);
      display: grid;
      gap: 4px;
    }

    .media-browser-link-url {
      color: #7eb7ff;
      text-decoration: none;
      word-break: break-all;
    }

    .profile-viewer-right {
      border: 1px solid color-mix(in srgb, var(--border) 72%, transparent);
      border-radius: 20px;
      background:
        linear-gradient(165deg, color-mix(in srgb, var(--panel) 97%, transparent), color-mix(in srgb, var(--bubble-in) 88%, transparent));
      padding: 14px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      min-width: 0;
      min-height: 0;
      box-shadow:
        0 1px 0 color-mix(in srgb, #fff 8%, transparent) inset,
        0 16px 36px rgba(0, 0, 0, 0.1);
    }

    .profile-viewer-right .channel-edit-post-textarea {
      min-height: 88px;
    }

    .profile-viewer-right .channel-edit-post-textarea:not(.profile-note-textarea) {
      max-height: min(42vh, 260px);
      min-height: 88px;
      overflow-y: auto;
      resize: vertical;
    }

    .profile-viewer-id {
      text-align: center;
      font-size: 20px;
      font-weight: 700;
      line-height: 1.15;
      min-width: 0;
      overflow-wrap: anywhere;
    }

    .profile-viewer-subline {
      text-align: left;
      font-size: 15px;
      font-weight: 600;
      color: var(--muted);
      overflow-wrap: anywhere;
    }

    .profile-view-note-wrap {
      margin-top: 10px;
    }

    .profile-view-note-wrap .profile-editor-label-row {
      margin-bottom: 8px;
      align-items: flex-start;
    }

    .profile-view-note-wrap .profile-editor-save-btn {
      flex-shrink: 0;
      margin-top: 1px;
    }

    .profile-editor-label-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      margin-bottom: 6px;
    }

    .profile-editor-label-actions {
      display: inline-flex;
      align-items: center;
      gap: 6px;
    }

    .profile-bio-emoji-wrap {
      position: absolute;
      top: 8px;
      right: 8px;
      z-index: 6;
    }

    .profile-bio-input-wrap {
      position: relative;
    }

    .profile-bio-emoji-toggle {
      width: 34px;
      height: 30px;
      border-radius: 9px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 85%, transparent);
      color: var(--text);
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 16px;
      line-height: 1;
    }

    .profile-bio-emoji-picker {
      position: absolute;
      top: calc(100% + 6px);
      right: 0;
      z-index: 20;
      width: min(320px, 78vw);
      max-height: 180px;
      overflow: auto;
      padding: 8px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 96%, transparent);
      box-shadow: 0 10px 28px rgba(0, 0, 0, 0.35);
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(34px, 1fr));
      gap: 6px;
    }

    .profile-bio-input-wrap .channel-edit-post-textarea {
      padding-top: 10px;
      padding-left: 10px;
      padding-right: 48px;
    }

    .profile-editor-save-btn {
      padding: 4px 10px;
      font-size: 12px;
      line-height: 1.1;
    }

    .profile-bio-edit-subline {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .profile-note-textarea {
      min-height: 64px;
      resize: vertical;
    }

    .profile-viewer-sep {
      height: 1px;
      background: color-mix(in srgb, var(--border) 85%, transparent);
      margin: 2px 0;
    }

    .profile-viewer-links-row {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px 12px;
    }

    @media (max-width: 560px) {
      .profile-viewer-links-row {
        grid-template-columns: 1fr;
      }
    }

    .profile-integration-block {
      display: flex;
      flex-direction: column;
      gap: 6px;
      min-width: 0;
    }

    .profile-integration-caption {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.03em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .profile-integration-combo {
      display: flex;
      align-items: stretch;
      max-width: 100%;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      overflow: hidden;
    }

    .profile-integration-prefix {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      padding: 8px 2px 8px 10px;
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
      white-space: nowrap;
      user-select: none;
      border-right: 1px solid var(--border);
      background: color-mix(in srgb, var(--text) 7%, transparent);
    }

    .profile-integration-prefix[aria-disabled="true"] {
      cursor: default;
      pointer-events: none;
    }

    .profile-integration-slug-input {
      flex: 1;
      min-width: 0;
      border: none;
      background: transparent;
      color: var(--text);
      font-size: 14px;
      font-family: inherit;
      padding: 8px 10px;
      box-sizing: border-box;
    }

    .profile-integration-slug-input:focus {
      outline: none;
    }

    .profile-integration-slug-input:disabled {
      opacity: 0.65;
      cursor: not-allowed;
    }

    @media (max-width: 860px) {
      .modal.modal--profile-viewer {
        width: min(560px, 96vw);
        max-height: 94vh;
      }
      .profile-viewer-layout {
        grid-template-columns: 1fr;
      }
      .profile-viewer-identity-row {
        margin-top: -54px;
      }
    }

    .friends-list-empty {
      font-size: 13px;
      color: var(--muted);
      text-align: center;
      padding: 10px 6px;
      margin: 0;
    }

    /* Явные стили: иначе <button> без .primary/.secondary получает белый фон ОС и «слепой» текст */
    .friend-row {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
      padding: 11px 12px;
      border-radius: 10px;
      cursor: pointer;
      font-size: 13px;
      font-family: inherit;
      width: 100%;
      text-align: left;
      -webkit-appearance: none;
      appearance: none;
      border: 1px solid var(--border);
      background: var(--bubble-in);
      color: var(--text);
      box-shadow: 0 1px 2px var(--shadow);
      transition: background-color 180ms ease, border-color 180ms ease, box-shadow 180ms ease, transform 120ms ease;
    }

    .friend-row:hover {
      background: var(--panel);
      border-color: var(--muted);
      box-shadow: 0 2px 8px var(--shadow);
    }

    .friend-row:active {
      transform: scale(0.99);
    }

    .friend-row:focus-visible {
      outline: 2px solid var(--muted);
      outline-offset: 2px;
    }

    .friend-row-main {
      min-width: 0;
      flex: 1;
    }

    .friend-row-id {
      font-weight: 600;
      word-break: break-all;
      color: var(--text);
      letter-spacing: 0.01em;
    }

    .friend-row-meta {
      font-size: 11px;
      font-weight: 600;
      color: var(--muted);
      margin-top: 4px;
      text-transform: uppercase;
      letter-spacing: 0.06em;
    }

    .profile-actions {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .profile-action-btn {
      display: flex;
      flex-direction: row;
      align-items: center;
      justify-content: flex-start;
      gap: 10px;
      width: 100%;
      padding: 10px 12px;
      border-radius: 11px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
    }

    .profile-action-btn:hover {
      background: var(--bg);
      border-color: var(--muted);
    }

    .profile-action-icon {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: var(--muted);
    }

    .profile-action-icon svg {
      width: 20px;
      height: 20px;
      display: block;
    }

    .profile-action-btn:hover .profile-action-icon {
      color: var(--text);
    }

    .profile-action-btn--premium {
      position: relative;
      border: 2px solid #c9a227;
      background: linear-gradient(
        165deg,
        rgba(201, 162, 39, 0.18) 0%,
        rgba(201, 162, 39, 0.06) 45%,
        rgba(255, 215, 120, 0.1) 100%
      );
      color: #f4e4a8;
      text-shadow: 0 0 18px rgba(244, 228, 168, 0.35);
      box-shadow:
        0 0 0 1px rgba(201, 162, 39, 0.35) inset,
        0 4px 20px rgba(201, 162, 39, 0.15);
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      font-size: 13px;
      overflow: hidden;
    }

    .profile-action-btn--premium::before {
      content: "";
      position: absolute;
      inset: 0;
      background: linear-gradient(
        110deg,
        transparent 0%,
        rgba(255, 255, 255, 0.12) 45%,
        transparent 70%
      );
      opacity: 0;
      transition: opacity 0.35s ease;
      pointer-events: none;
    }

    .profile-action-btn--premium:hover {
      border-color: #e8d060;
      color: #fff8e6;
      background: linear-gradient(
        165deg,
        rgba(232, 208, 96, 0.28) 0%,
        rgba(201, 162, 39, 0.14) 50%,
        rgba(255, 230, 160, 0.12) 100%
      );
      box-shadow:
        0 0 0 1px rgba(232, 208, 96, 0.45) inset,
        0 6px 28px rgba(201, 162, 39, 0.35);
      transform: translateY(-1px);
    }

    .profile-action-btn--premium:hover::before {
      opacity: 1;
    }

    .profile-action-btn--premium:active {
      transform: translateY(0);
    }

    .profile-action-icon--premium {
      color: #e8c547 !important;
      filter: drop-shadow(0 0 6px rgba(232, 197, 71, 0.65));
    }

    .profile-action-btn--premium:hover .profile-action-icon--premium {
      color: #ffe9a0 !important;
      filter: drop-shadow(0 0 10px rgba(255, 233, 160, 0.85));
    }

    [data-theme="light"] .profile-action-btn--premium {
      border: none;
      background: color-mix(in srgb, #f6efd9 55%, #ffffff);
      color: #6b5200;
      text-shadow: none;
      font-weight: 600;
      letter-spacing: 0.02em;
      box-shadow: none;
    }

    [data-theme="light"] .profile-action-btn--premium:hover {
      border: none;
      background: color-mix(in srgb, #f6efd9 75%, #ffffff);
      color: #5c4600;
      box-shadow: none;
      transform: none;
    }

    [data-theme="light"] .profile-action-btn--premium .profile-action-icon--premium {
      color: #8a6500 !important;
      filter: none;
    }

    [data-theme="light"] .profile-action-btn--premium-owned {
      border: none;
      background: color-mix(in srgb, #f6efd9 40%, #ffffff);
      color: #6b5200;
    }

    .profile-action-icon--premium svg {
      width: 22px;
      height: 22px;
    }

    .theme-icon-sun,
    .theme-icon-moon {
      display: none;
    }

    [data-theme="dark"] .theme-icon-sun {
      display: block;
    }

    [data-theme="light"] .theme-icon-moon {
      display: block;
    }

    .profile-settings-sheet {
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 12px 14px;
      background: var(--bg);
    }

    .profile-settings-title {
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: var(--muted);
      margin-bottom: 10px;
    }

    .profile-settings-option {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      cursor: pointer;
      font-size: 13px;
      color: var(--text);
      line-height: 1.35;
    }

    .profile-settings-option input {
      margin-top: 3px;
      width: auto;
      flex-shrink: 0;
    }

    .privacy-settings-lead,
    .ui-display-settings-lead {
      margin: 0;
      font-size: 13px;
      line-height: 1.45;
      color: var(--muted);
    }

    .privacy-consent-stack {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    .privacy-consent-card {
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 14px 16px;
      background: var(--panel);
    }

    .settings-v37-row--disabled,
    .privacy-consent-card--muted {
      opacity: 0.72;
    }

    .privacy-consent-card__title {
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
    }

    .privacy-consent-card__hint {
      margin: 8px 0 0;
      font-size: 12px;
      line-height: 1.42;
      color: var(--muted);
    }

    .privacy-consent-toggle {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 14px;
      margin-top: 12px;
      cursor: pointer;
      font-size: 13px;
      font-weight: 600;
      color: var(--text);
      user-select: none;
    }

    .privacy-consent-toggle input {
      width: auto;
      flex-shrink: 0;
      margin: 0;
      accent-color: var(--accent, #5a91ff);
    }

    .ui-display-hint-card {
      border: 1px solid var(--border);
      border-radius: 14px;
      padding: 14px 16px;
      background: var(--panel);
      font-size: 13px;
      line-height: 1.45;
      color: var(--text);
    }

    .col-chat {
      display: flex;
      flex-direction: column;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
      background: var(--bg);
    }

    /* Десктоп: колонка «Сообщения» — закреплённый поиск/фильтры, скролл только списка */
    @media (min-width: 921px) {
      .col-dialogs.panel-card {
        overflow: hidden;
      }

      .col-dialogs .dialogs-nav-sticky {
        flex-shrink: 0;
      }

      .col-dialogs .dialogs-scroll-strip {
        flex: 1;
        min-height: 0;
        overflow-x: hidden;
        overflow-y: auto;
      }

      .col-user .settings {
        gap: var(--space-2);
      }
    }

    /* Десктоп: поиск — компактная правая полоса внутри области чата, без отдельной 4-й колонки сетки */
    @media (min-width: 921px) {
      /* ПК: правая колонка поиска отключена */
      .messenger-shell > .col-chat #searchColumn {
        display: none !important;
      }

      /* ПК: убираем «плашку» вокруг кнопок создания, оставляем только аккуратную кнопку */
      #profileTabPanelChannels .create-channel-trigger-wrap,
      #profileTabPanelGroupChats .create-channel-trigger-wrap {
        margin: 10px 0 0;
        padding: 0;
        border: none;
        background: transparent;
      }

      #profileTabPanelChannels .create-channel-open-btn,
      #profileTabPanelGroupChats .create-channel-open-btn {
        width: 100%;
        padding-top: 12px;
        padding-bottom: 12px;
        border-radius: 14px;
      }

      .messenger-shell > .col-chat .col-search.panel-card {
        flex: 0 0 clamp(196px, 22vw, 288px);
        width: clamp(196px, 22vw, 288px);
        max-width: 300px;
        min-width: 180px;
        min-height: 0;
        box-sizing: border-box;
        border-right: none;
        border-left: 1px solid var(--border);
        padding: 8px 6px 10px 10px;
        display: flex;
        flex-direction: column;
        overflow: hidden;
      }

      .messenger-shell > .col-chat .col-search .panel-head {
        display: none !important;
      }

      .messenger-shell > .col-chat .col-search .search-mode-panel:not(.hidden) {
        flex: 1;
        min-height: 0;
        display: flex;
        flex-direction: column;
        overflow: hidden;
      }

      .messenger-shell > .col-chat .col-search .search-mode-panel:not(.hidden) .profile-card-wrap.panel-scroll {
        flex: 1;
        min-height: 0;
      }

      .messenger-shell > .col-chat .col-search #searchPanelChannel:not(.hidden) .channel-search-results {
        flex: 1;
        min-height: 0;
        max-height: none;
      }

      .messenger-shell > .col-chat .col-search .search-row-h {
        padding: 8px 6px 10px;
      }

      .messenger-shell > .col-chat .friend-requests-nav-row {
        padding: 0 6px 10px;
      }
    }

    .col-search .search-row-h {
      flex-shrink: 0;
    }

    .visually-hidden {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    .friend-requests-nav-row {
      flex-shrink: 0;
      margin-top: 6px;
      padding: 0 18px 14px;
    }

    .friend-requests-nav-btn {
      width: 100%;
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      padding: 11px 14px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--invite-accent, #c89f22) 45%, var(--border));
      background: linear-gradient(
        145deg,
        color-mix(in srgb, var(--invite-accent, #c89f22) 12%, var(--panel)),
        color-mix(in srgb, var(--panel) 88%, transparent)
      );
      color: var(--text);
      font: inherit;
      font-size: 13px;
      font-weight: 750;
      letter-spacing: 0.03em;
      cursor: pointer;
      transition: border-color 0.15s ease, box-shadow 0.15s ease, transform 0.08s ease;
      box-shadow: 0 1px 3px color-mix(in srgb, var(--shadow) 85%, transparent);
    }

    .friend-requests-nav-btn:hover {
      border-color: color-mix(in srgb, var(--invite-accent, #c89f22) 72%, var(--border));
      box-shadow: 0 2px 10px color-mix(in srgb, var(--invite-accent, #c89f22) 18%, transparent);
    }

    .friend-requests-nav-label {
      text-align: left;
    }

    .friend-requests-nav-badge {
      min-width: 22px;
      height: 22px;
      padding: 0 7px;
      border-radius: 999px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 12px;
      font-weight: 800;
      color: var(--panel);
      background: linear-gradient(145deg, #6b9fff, color-mix(in srgb, #6b9fff 45%, #4a63d9));
      box-shadow:
        0 0 0 2px color-mix(in srgb, var(--panel) 90%, transparent),
        0 2px 8px rgba(74, 99, 217, 0.35);
    }

    .modal.modal--friend-requests {
      max-width: min(920px, 96vw);
      width: 100%;
      padding: 4px 8px 16px;
      box-sizing: border-box;
    }

    .modal.pwd-flow-modal {
      max-width: min(440px, 94vw);
      width: 100%;
      box-sizing: border-box;
    }

    .modal.modal--friend-requests .modal-header-row {
      padding: 0 8px 4px;
    }

    .friend-requests-modal-strip-wrap {
      padding: 0 12px 12px;
      max-width: 100%;
    }

    .friend-requests-modal-strip {
      display: flex;
      flex-direction: row;
      gap: 12px;
      overflow-x: auto;
      overflow-y: hidden;
      padding: 12px 4px 16px;
      scroll-snap-type: x proximity;
      scrollbar-width: thin;
    }

    .friend-requests-modal-strip::-webkit-scrollbar {
      height: 7px;
    }

    .friend-requests-modal-empty {
      padding: 18px 14px;
      margin: 0;
      text-align: center;
    }

    .friend-req-card {
      flex: 0 0 min(182px, 18vw);
      min-width: 160px;
      max-width: 200px;
      scroll-snap-align: start;
      border-radius: 14px;
      border: 1px solid var(--border);
      background: var(--panel);
      padding: 12px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      box-shadow: 0 8px 22px color-mix(in srgb, var(--shadow) 70%, transparent);
      transition:
        transform 0.42s cubic-bezier(0.4, 0, 0.2, 1),
        opacity 0.38s ease;
    }

    .friend-req-card--out {
      transform: translateX(110%);
      opacity: 0;
    }

    .friend-req-card-avatar {
      width: 52px;
      height: 52px;
      border-radius: 50%;
      align-self: center;
      overflow: hidden;
      display: grid;
      place-items: center;
      font-weight: 800;
      font-size: 18px;
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
      background: color-mix(in srgb, var(--bubble-in) 88%, transparent);
    }

    .friend-req-card-avatar img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .friend-req-card-id {
      font-size: 12px;
      font-weight: 700;
      word-break: break-all;
      text-align: center;
      min-height: 2.6em;
    }

    .friend-req-card-meta {
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 8px;
      flex-wrap: wrap;
      font-size: 11px;
      font-weight: 650;
      color: var(--muted);
    }

    .friend-req-card-meta .lvl-pill {
      padding: 2px 8px;
      border-radius: 999px;
      border: 1px solid var(--border);
      font-size: 10px;
      text-transform: uppercase;
      letter-spacing: 0.06em;
    }

    .friend-req-card-actions {
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 6px;
      margin-top: auto;
    }

    .friend-req-card-actions .primary {
      font-size: 12px;
      padding: 7px 6px;
    }

    .friend-req-card-actions .secondary {
      font-size: 12px;
      padding: 7px 6px;
    }

    .profile-viewer-actions.profile-viewer-actions {
      flex-direction: column;
      align-items: stretch;
    }

    .profile-viewer-friend-status {
      margin: 0 0 4px;
      font-size: 13px;
      line-height: 1.35;
      color: var(--muted);
    }

    .profile-viewer-actions-btns {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      width: 100%;
    }

    .profile-viewer-actions-btns #profileViewerSaveBtn {
      margin-left: auto;
    }

    .profile-card-wrap {
      padding: 10px 12px 12px;
    }

    .brand, .settings, .auth-panel, .chat-header, .composer-inner {
      padding: 14px 16px;
    }

    .brand {
      border-bottom: 1px solid var(--border);
      font-weight: 600;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }

    .theme-btn {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: transparent;
      color: var(--text);
      padding: 6px 10px;
      cursor: pointer;
    }

    .auth-panel {
      border-bottom: 1px solid var(--border);
      display: grid;
      gap: 10px;
      max-width: 700px;
      width: 100%;
      margin: 0 auto;
    }

    .pre-chat-card.authLayout .auth-panel {
      border-bottom: none;
      padding-bottom: 0;
    }

    .pre-chat-card.authLayout #authPanel {
      max-width: none;
      margin: 0;
    }

    .auth-row-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 280px;
      gap: 14px;
      padding: 10px 16px 16px;
      align-items: start;
    }

    .auth-main {
      min-width: 0;
    }

    .auth-layout-row {
      display: grid;
      grid-template-columns: minmax(0, 1fr) 280px;
      gap: 12px;
      padding: 10px 12px 16px;
      align-items: start;
      width: 100%;
    }

    /* ПК: подсказка справа; кнопка «?» только в mobile.css */
    .auth-level-toolbar {
      display: block;
      width: 100%;
    }

    .auth-level-toolbar .auth-help-trigger {
      display: none !important;
    }

    /* Оверлей справки подключается только на узкой ширине (mobile.css) */
    .auth-help-root {
      display: none !important;
    }

    .auth-hint {
      min-width: 0;
      color: var(--muted);
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--panel);
      padding: 12px;
      align-self: start;
    }

    .pre-chat-card.authLayout .auth-panel {
      padding: 0;
    }

    .settings {
      border-bottom: none;
      display: grid;
      gap: 8px;
      font-size: 14px;
      color: var(--muted);
      padding: 14px 16px;
    }

    input, select, button {
      font: inherit;
    }

    input, select {
      width: 100%;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
      border-radius: 10px;
      padding: 10px;
      transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
    }

    button.primary {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--text);
      color: var(--panel);
      padding: 10px;
      cursor: pointer;
      transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
    }

    button.secondary {
      border: 1px solid var(--border);
      border-radius: 10px;
      background: transparent;
      color: var(--text);
      padding: 10px;
      cursor: pointer;
      transition: background-color 240ms ease, color 240ms ease, border-color 240ms ease;
    }

    .dialogs-scroll-strip {
      flex: 1;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      padding: 0 8px 8px 10px;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .dialogs-scroll-strip::-webkit-scrollbar {
      width: 8px;
    }

    .dialogs-scroll-strip::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .dialogs-scroll-strip::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 4px;
    }

    .dialogs-scroll-strip::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .dialogs.dialogs-rail {
      display: flex;
      flex-direction: column;
      flex-wrap: nowrap;
      align-items: stretch;
      gap: 0;
      padding: 0;
      width: 100%;
      box-sizing: border-box;
    }

    .col-dialogs .panel-head.dialogs-col-title {
      border-bottom: none;
      background: transparent;
      padding: 8px 12px 18px;
      font-size: 28px;
      font-weight: 700;
      letter-spacing: -0.03em;
      line-height: 1.1;
      color: color-mix(in srgb, var(--text) 96%, transparent);
    }

    /* Иначе .dialogs.dialogs-rail перебивает глобальный .hidden { display:none } по специфичности — диалоги остаются на экране во вкладке «Каналы». */
    .dialogs.dialogs-rail.hidden {
      display: none;
    }

    #channelsRailWrap.hidden,
    #groupChatsRailWrap.hidden {
      display: none !important;
    }

    .dialogs .status.empty-dlg-hint {
      padding: 12px;
    }

    .dialogs .status.all-rail-filter-empty {
      padding: 10px 12px;
      font-size: 13px;
      color: var(--muted);
      text-align: center;
    }

    .all-rail-search-mark {
      background: color-mix(in srgb, #6f9bff 38%, transparent);
      color: inherit;
      font-weight: inherit;
      padding: 0 1px;
      border-radius: 2px;
    }

    .dialog-item {
      flex: 0 0 auto;
      width: 100%;
      min-height: 60px;
      max-height: 60px;
      border: none;
      border-radius: 0;
      --rail-row-pad-left: 12px;
      padding: 7px 0 7px var(--rail-row-pad-left);
      cursor: pointer;
      background: transparent;
      transition: background-color 140ms ease;
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 10px;
      box-sizing: border-box;
      overflow: hidden;
      position: relative;
      --rail-divider-inset: calc(var(--rail-row-pad-left) + 40px + 10px);
    }

    .dialog-item::after {
      content: "";
      position: absolute;
      left: var(--rail-divider-inset);
      right: 0;
      bottom: 0;
      height: 1px;
      background: rgba(255, 255, 255, 0.06);
      pointer-events: none;
    }

    .dialogs.dialogs-rail .dialog-item:last-child::after {
      display: none;
    }

    .dialog-item:hover {
      background: rgba(255, 255, 255, 0.025);
    }

    .dialog-item:active {
      background: rgba(255, 255, 255, 0.04);
    }

    .rail-comm-avatar-wrap {
      position: relative;
      flex: 0 0 auto;
      width: 40px;
      height: 40px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .dialog-avatar-wrap {
      position: relative;
      flex: 0 0 auto;
      width: 40px;
      height: 40px;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border: none;
      padding: 0;
      margin: 0;
      background: transparent;
      cursor: pointer;
      -webkit-appearance: none;
      appearance: none;
    }

    .dialog-avatar-wrap .friend-online-dot {
      position: absolute;
      left: -1px;
      bottom: -1px;
      z-index: 2;
      box-shadow: 0 0 0 2px var(--panel, #181d24);
    }

    .dialog-avatar {
      width: 40px;
      height: 40px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 13px;
      font-weight: 700;
      letter-spacing: 0.02em;
      color: color-mix(in srgb, var(--text) 86%, #7ba8ff);
      background: linear-gradient(
        160deg,
        color-mix(in srgb, #7ba8ff 22%, transparent),
        color-mix(in srgb, #7ba8ff 8%, transparent)
      );
      border: 1px solid rgba(255, 255, 255, 0.06);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 6%, transparent);
      text-transform: uppercase;
      user-select: none;
      overflow: hidden;
    }

    .dialog-unread-badge {
      position: absolute;
      top: -4px;
      right: -5px;
      min-width: 18px;
      height: 18px;
      padding: 0 5px;
      border-radius: 999px;
      border: 1px solid color-mix(in srgb, #78a9ff 55%, var(--border));
      background: linear-gradient(160deg, #6f9bff, #4f7de8);
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      box-shadow: 0 0 0 2px color-mix(in srgb, var(--panel) 88%, transparent);
      line-height: 1;
      z-index: 3;
    }

    .dialog-item-body {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      justify-content: center;
      gap: 2px;
      overflow: hidden;
    }

    .dialog-peer-line {
      display: flex;
      align-items: center;
      gap: 4px;
      min-width: 0;
      line-height: 1.2;
      overflow: hidden;
    }

    .user-card-details {
      display: inline-flex;
      align-items: center;
      flex: 0 0 auto;
      gap: 4px;
      min-width: 0;
    }

    .all-rail-type-icon {
      width: 14px;
      height: 14px;
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      opacity: 0.58;
      color: color-mix(in srgb, var(--muted) 78%, var(--accent));
    }

    .all-rail-type-icon svg {
      width: 14px;
      height: 14px;
      display: block;
    }

    .dialog-peer-line strong,
    .channel-rail-official-title {
      flex: 1 1 auto;
      min-width: 0;
      font-size: 14px;
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: -0.01em;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .rail-comm-type-badge {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      gap: 2px;
      padding: 1px 6px;
      border-radius: 999px;
      font-size: 10px;
      font-weight: 600;
      line-height: 1.2;
      letter-spacing: 0.01em;
      white-space: nowrap;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      background: color-mix(in srgb, var(--muted) 10%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
    }

    .rail-comm-type-badge--forum {
      color: color-mix(in srgb, #7ba8ff 70%, var(--muted));
      background: color-mix(in srgb, #3b82f6 10%, transparent);
      border-color: color-mix(in srgb, #3b82f6 22%, transparent);
    }

    .rail-comm-type-badge--chat {
      color: color-mix(in srgb, var(--text) 72%, var(--muted));
    }

    .dialog-level {
      font-size: 10px;
      color: var(--muted);
      opacity: 0.9;
      flex-shrink: 0;
    }

    .rail-comm-actions {
      position: relative;
      flex: 0 0 44px;
      width: 44px;
      min-width: 44px;
      align-self: center;
      display: flex;
      align-items: center;
      justify-content: center;
      margin: 0;
    }

    .rail-comm-menu-btn {
      width: 32px;
      min-width: 44px;
      height: 32px;
      min-height: 44px;
      padding: 0;
      margin: 0;
      border: none;
      border-radius: 8px;
      background: transparent;
      color: color-mix(in srgb, var(--muted) 88%, #8c92a1);
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      opacity: 0;
      pointer-events: none;
      transition: opacity 140ms ease, background-color 140ms ease, color 140ms ease;
    }

    .dialog-item:hover .rail-comm-menu-btn,
    .dialog-item:focus-within .rail-comm-menu-btn,
    .dialog-item.rail-comm-menu-open .rail-comm-menu-btn,
    .dialog-item:has(.rail-comm-menu:not(.hidden)) .rail-comm-menu-btn {
      opacity: 1;
      pointer-events: auto;
    }

    .rail-comm-menu-btn:hover {
      background: color-mix(in srgb, var(--muted) 14%, transparent);
      color: var(--text);
    }

    .rail-comm-menu-btn svg {
      width: 18px;
      height: 18px;
      display: block;
      pointer-events: none;
    }

    .rail-comm-menu {
      position: absolute;
      top: calc(100% - 4px);
      right: 0;
      z-index: 40;
      min-width: 168px;
      padding: 4px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, #000 4%);
      box-shadow: 0 10px 28px color-mix(in srgb, #000 28%, transparent);
    }

    .rail-comm-menu.hidden {
      display: none;
    }

    .rail-comm-menu.rail-comm-menu--floating {
      position: fixed;
      top: auto;
      right: auto;
      left: auto;
      bottom: auto;
      z-index: 25000;
    }

    .rail-comm-menu-item {
      display: block;
      width: 100%;
      box-sizing: border-box;
      padding: 9px 12px;
      border: none;
      border-radius: 8px;
      background: transparent;
      color: var(--text);
      font: inherit;
      font-size: 13px;
      text-align: left;
      cursor: pointer;
      transition: background-color 120ms ease;
    }

    .rail-comm-menu-item:hover {
      background: color-mix(in srgb, var(--accent, #5f87ff) 8%, transparent);
    }

    .rail-comm-menu-item--danger {
      color: #e05555;
    }

    .rail-comm-menu-item--danger:hover {
      background: color-mix(in srgb, #e05555 12%, transparent);
    }

    .dialog-item .dlg-preview,
    .channel-rail-official-sub {
      font-size: 12px;
      font-weight: 400;
      color: color-mix(in srgb, var(--muted) 92%, #9ca3af);
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
      min-width: 0;
    }

    .dialog-item.active {
      background: rgba(59, 130, 246, 0.05);
      box-shadow: inset 2px 0 0 #3b82f6;
    }

    .channel-rail-item--official-news {
      background: rgba(59, 130, 246, 0.02);
    }

    .channel-rail-item--official-news::before {
      content: "";
      position: absolute;
      left: 0;
      top: 8px;
      bottom: 8px;
      width: 2px;
      border-radius: 0 1px 1px 0;
      background: linear-gradient(180deg, #7dd3fc, #3b82f6);
      opacity: 0.95;
    }

    .channel-rail-item--official-news:hover {
      background: rgba(59, 130, 246, 0.045);
    }

    .channel-rail-official-avatar {
      color: #e8f4ff;
      border-color: color-mix(in srgb, #38bdf8 40%, rgba(255, 255, 255, 0.1));
      background: linear-gradient(
        145deg,
        color-mix(in srgb, #3b82f6 48%, transparent),
        color-mix(in srgb, #1e3a8a 32%, transparent)
      );
    }

    .channel-rail-item--official-news .channel-rail-official-title {
      flex: 0 1 auto;
      font-size: 14px;
      font-weight: 700;
      letter-spacing: -0.01em;
      color: color-mix(in srgb, #f0f9ff 88%, #7dd3fc);
    }

    .channel-rail-official-verified {
      flex: 0 0 auto;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      color: #38bdf8;
      opacity: 1;
    }

    .channel-rail-official-verified svg {
      display: block;
      width: 14px;
      height: 14px;
    }

    .channel-rail-item--official-news .channel-rail-official-sub {
      color: color-mix(in srgb, var(--muted) 78%, #38bdf8);
    }

    .dialogs .channel-rail-item--official-news.active {
      background: rgba(59, 130, 246, 0.08);
      box-shadow: inset 2px 0 0 #38bdf8;
    }

    .channel-search-row--official-news {
      border-color: color-mix(in srgb, #38bdf8 45%, var(--border));
      background: linear-gradient(
        125deg,
        color-mix(in srgb, #0ea5e9 10%, transparent),
        color-mix(in srgb, #1e3a5f 14%, transparent)
      );
    }
    .channel-search-row--official-news .channel-search-row-meta {
      color: color-mix(in srgb, var(--muted) 80%, #38bdf8);
    }

    .composer {
      position: relative;
      flex-shrink: 0;
      border-top: 1px solid var(--border);
      background: var(--panel);
      display: flex;
      flex-direction: column;
      gap: 0;
      transition: background-color 240ms ease, border-color 240ms ease;
    }

    .composer-row {
      display: flex;
      align-items: center;
      gap: 8px;
      margin: 8px 10px 8px;
      min-width: 0;
    }

    .composer-inner {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 6px;
      flex: 1;
      min-width: 0;
      margin: 0;
      padding: 4px 5px 4px 8px;
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--bg);
      box-sizing: border-box;
    }

    .composer-attach-preview {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin: 6px 10px 0;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      font-size: 13px;
      color: var(--text);
    }

    .composer-attach-preview-row {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .composer-attach-preview-visual {
      display: flex;
      justify-content: center;
      align-items: center;
      max-height: 200px;
      border-radius: 10px;
      overflow: hidden;
      background: color-mix(in srgb, var(--panel) 90%, transparent);
      cursor: zoom-in;
    }

    .composer-attach-preview-visual.hidden {
      display: none;
    }

    .composer-attach-thumb {
      display: block;
      max-width: 100%;
      max-height: 200px;
      width: auto;
      height: auto;
      object-fit: contain;
      border-radius: 8px;
      cursor: zoom-in;
    }

    video.composer-attach-thumb {
      background: #000;
    }

    .composer-attach-preview-name {
      flex: 1;
      min-width: 0;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .composer-attach-clear {
      border: none;
      background: transparent;
      color: var(--muted);
      font-size: 20px;
      line-height: 1;
      cursor: pointer;
      padding: 0 4px;
    }

    .composer-attach-clear:hover {
      color: var(--text);
    }

    .composer-attach-wrap {
      position: relative;
      flex-shrink: 0;
      display: flex;
      align-items: center;
    }

    .composer-plus-btn {
      font-size: 22px;
      font-weight: 300;
      line-height: 1;
    }

    .composer-attach-wrap:hover .composer-attach-menu,
    .composer-attach-wrap.composer-attach-open .composer-attach-menu {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
    }

    .composer-attach-menu {
      position: absolute;
      bottom: calc(100% + 8px);
      left: 0;
      min-width: 210px;
      padding: 6px 0;
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 12px;
      box-shadow: 0 10px 28px var(--shadow);
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transition: opacity 0.14s ease, visibility 0.14s ease;
      z-index: 55;
    }

    .composer-attach-item {
      display: flex;
      align-items: center;
      gap: 10px;
      width: 100%;
      text-align: left;
      padding: 9px 12px 9px 10px;
      border: none;
      background: transparent;
      color: var(--text);
      font: inherit;
      font-size: 14px;
      cursor: pointer;
    }

    .composer-attach-item-icon {
      flex-shrink: 0;
      width: 22px;
      height: 22px;
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--muted);
      opacity: 0.95;
    }

    .composer-attach-item-icon svg {
      width: 20px;
      height: 20px;
      display: block;
    }

    .composer-attach-item:hover .composer-attach-item-icon {
      color: var(--text);
    }

    .composer-attach-item:hover {
      background: var(--border);
    }

    .bubble-media-wrap {
      position: relative;
      margin-bottom: 8px;
      max-width: min(720px, 100%);
      width: fit-content;
      align-self: flex-start;
    }

    .bubble-media-img {
      display: block;
      width: auto;
      max-width: min(420px, 100%);
      max-height: min(380px, 52vh);
      border-radius: 12px;
      object-fit: contain;
      background: color-mix(in srgb, var(--text) 6%, transparent);
      cursor: zoom-in;
    }

    .bubble-media-video-box {
      position: relative;
      display: inline-block;
      max-width: 100%;
    }

    .bubble-media-video {
      display: block;
      width: auto;
      max-width: min(420px, 100%);
      max-height: min(380px, 52vh);
      border-radius: 12px;
      background: #000;
    }

    .bubble-media-slot--loading {
      min-width: 120px;
    }

    .bubble-media-skeleton {
      display: flex;
      flex-direction: column;
      gap: 8px;
      max-width: min(420px, 100%);
    }

    .bubble-media-skeleton__tile {
      width: min(280px, 72vw);
      height: 180px;
      border-radius: 12px;
      background: linear-gradient(
        110deg,
        color-mix(in srgb, var(--text) 8%, transparent) 8%,
        color-mix(in srgb, var(--text) 14%, transparent) 18%,
        color-mix(in srgb, var(--text) 8%, transparent) 33%
      );
      background-size: 200% 100%;
      animation: bubble-media-shimmer 1.2s ease-in-out infinite;
    }

    .bubble-media-skeleton__tile--video {
      aspect-ratio: 16 / 10;
      height: auto;
      min-height: 160px;
    }

    .bubble-media-skeleton__tile--audio {
      width: min(320px, 100%);
      height: 56px;
      border-radius: 10px;
    }

    @keyframes bubble-media-shimmer {
      0% {
        background-position: 100% 0;
      }
      100% {
        background-position: -100% 0;
      }
    }

    .bubble-body--hydrating .bubble-text-shimmer {
      display: inline-block;
      width: min(180px, 60%);
      height: 0.95em;
      border-radius: 6px;
      vertical-align: middle;
      background: linear-gradient(
        110deg,
        color-mix(in srgb, var(--text) 10%, transparent) 8%,
        color-mix(in srgb, var(--text) 18%, transparent) 18%,
        color-mix(in srgb, var(--text) 10%, transparent) 33%
      );
      background-size: 200% 100%;
      animation: bubble-media-shimmer 1.2s ease-in-out infinite;
    }

    .media-lightbox-download {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      margin-top: 12px;
      padding: 10px 18px;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.12);
      color: #fff;
      text-decoration: none;
      font-size: 14px;
      font-weight: 600;
    }

    .media-lightbox-download:hover {
      background: rgba(255, 255, 255, 0.22);
    }

    .bubble-media-expand-btn {
      position: absolute;
      bottom: 8px;
      right: 8px;
      width: 36px;
      height: 36px;
      padding: 0;
      border: none;
      border-radius: 10px;
      background: rgba(0, 0, 0, 0.55);
      color: #fff;
      font-size: 18px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.15s ease;
    }

    .bubble-media-expand-btn:hover {
      background: rgba(0, 0, 0, 0.75);
    }

    .bubble-media-doc {
      display: inline-block;
      padding: 8px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      color: var(--text);
      text-decoration: none;
      font-size: 13px;
    }

    .bubble-media-doc:hover {
      background: var(--border);
    }

    .bubble-file-card {
      display: flex;
      align-items: center;
      gap: 12px;
      width: min(100%, 360px);
      padding: 10px 12px;
      border-radius: 14px;
      border: 1px solid var(--border);
      background: var(--panel, rgba(255, 255, 255, 0.04));
      box-shadow: 0 1px 0 rgba(0, 0, 0, 0.06);
      transition: border-color 0.15s ease, background 0.15s ease, transform 0.12s ease;
    }

    .bubble-file-card:hover {
      border-color: color-mix(in srgb, var(--accent, #5b8def) 45%, var(--border));
      background: color-mix(in srgb, var(--accent, #5b8def) 6%, var(--panel, rgba(255, 255, 255, 0.04)));
      transform: translateY(-1px);
    }

    .bubble-file-card__icon {
      flex: 0 0 44px;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.02em;
      color: #fff;
      user-select: none;
    }

    .bubble-file-card--pdf .bubble-file-card__icon {
      background: linear-gradient(145deg, #e53935, #c62828);
    }

    .bubble-file-card--archive .bubble-file-card__icon {
      background: linear-gradient(145deg, #8d6e63, #6d4c41);
    }

    .bubble-file-card--word .bubble-file-card__icon {
      background: linear-gradient(145deg, #1e88e5, #1565c0);
    }

    .bubble-file-card--sheet .bubble-file-card__icon {
      background: linear-gradient(145deg, #43a047, #2e7d32);
    }

    .bubble-file-card--slide .bubble-file-card__icon {
      background: linear-gradient(145deg, #fb8c00, #ef6c00);
    }

    .bubble-file-card--audio .bubble-file-card__icon {
      background: linear-gradient(145deg, #8e24aa, #6a1b9a);
    }

    .bubble-file-card--video .bubble-file-card__icon {
      background: linear-gradient(145deg, #5e35b1, #4527a0);
    }

    .bubble-file-card--app .bubble-file-card__icon {
      background: linear-gradient(145deg, #546e7a, #37474f);
    }

    .bubble-file-card--text .bubble-file-card__icon,
    .bubble-file-card--design .bubble-file-card__icon,
    .bubble-file-card--generic .bubble-file-card__icon {
      background: linear-gradient(145deg, #607d8b, #455a64);
    }

    .bubble-file-card__body {
      flex: 1 1 auto;
      min-width: 0;
    }

    .bubble-file-card__name {
      font-size: 14px;
      font-weight: 600;
      line-height: 1.25;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      color: var(--text);
    }

    .bubble-file-card__meta {
      display: flex;
      align-items: center;
      gap: 8px;
      margin-top: 4px;
      font-size: 12px;
      color: var(--muted, rgba(255, 255, 255, 0.55));
    }

    .bubble-file-card__ext {
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.04em;
    }

    .bubble-file-card__actions {
      flex: 0 0 auto;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .bubble-file-card__btn {
      font-size: 11px;
      font-weight: 600;
      padding: 5px 10px;
      border-radius: 8px;
      text-decoration: none;
      text-align: center;
      border: 1px solid var(--border);
      color: var(--text);
      background: transparent;
      transition: background 0.12s ease, color 0.12s ease;
      white-space: nowrap;
    }

    .bubble-file-card__btn:hover {
      background: var(--accent, #5b8def);
      border-color: var(--accent, #5b8def);
      color: #fff;
    }

    .bubble-media-stack .bubble-file-card,
    .bubble-media-album .bubble-file-card {
      margin-top: 6px;
    }

    .composer-attach-tile--doc {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 4px;
      padding: 8px;
      text-align: center;
      font-size: 11px;
      line-height: 1.2;
      word-break: break-word;
    }

    .composer-attach-tile--doc     .composer-attach-doc-icon {
      width: 36px;
      height: 36px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 10px;
      font-weight: 700;
      color: #fff;
      background: linear-gradient(145deg, #607d8b, #455a64);
    }

    .composer-attach-doc-icon.bubble-file-card--pdf {
      background: linear-gradient(145deg, #e53935, #c62828);
    }

    .composer-attach-doc-icon.bubble-file-card--archive {
      background: linear-gradient(145deg, #8d6e63, #6d4c41);
    }

    .composer-attach-doc-icon.bubble-file-card--word {
      background: linear-gradient(145deg, #1e88e5, #1565c0);
    }

    .composer-attach-doc-icon.bubble-file-card--sheet {
      background: linear-gradient(145deg, #43a047, #2e7d32);
    }

    .composer-attach-doc-icon.bubble-file-card--slide {
      background: linear-gradient(145deg, #fb8c00, #ef6c00);
    }

    .composer-attach-doc-icon.bubble-file-card--audio {
      background: linear-gradient(145deg, #8e24aa, #6a1b9a);
    }

    .composer-attach-doc-icon.bubble-file-card--video {
      background: linear-gradient(145deg, #5e35b1, #4527a0);
    }

    .composer-attach-doc-icon.bubble-file-card--app {
      background: linear-gradient(145deg, #546e7a, #37474f);
    }

    .composer-attach-tile--uploading .composer-attach-upload-bar {
      position: absolute;
      left: 6px;
      right: 6px;
      bottom: 6px;
      height: 4px;
      border-radius: 2px;
      background: rgba(255, 255, 255, 0.15);
      overflow: hidden;
    }

    .composer-attach-tile--uploading .composer-attach-upload-bar > span {
      display: block;
      height: 100%;
      width: 0%;
      background: var(--accent, #5b8def);
      transition: width 0.15s ease;
    }

    .composer-attach-tile--failed {
      outline: 2px solid #e53935;
    }

    .composer-upload-list {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-bottom: 8px;
      width: 100%;
    }

    .composer-upload-card {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      padding: 10px 12px;
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.06);
      border: 1px solid rgba(255, 255, 255, 0.1);
    }

    .composer-upload-card__icon {
      flex-shrink: 0;
      width: 40px;
      height: 40px;
      border-radius: 10px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 18px;
      background: rgba(91, 141, 239, 0.25);
    }

    .composer-upload-card__body {
      flex: 1;
      min-width: 0;
    }

    .composer-upload-card__name {
      font-size: 13px;
      font-weight: 600;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }

    .composer-upload-card__meta {
      font-size: 11px;
      opacity: 0.75;
      margin-top: 2px;
    }

    .composer-upload-card__phase {
      font-size: 11px;
      margin-top: 4px;
      color: var(--accent, #5b8def);
    }

    .composer-upload-card__bar {
      margin-top: 6px;
      height: 4px;
      border-radius: 2px;
      background: rgba(255, 255, 255, 0.12);
      overflow: hidden;
    }

    .composer-upload-card__bar > span {
      display: block;
      height: 100%;
      width: 0%;
      background: var(--accent, #5b8def);
      transition: width 0.12s ease;
    }

    .composer-upload-card__actions {
      display: flex;
      flex-shrink: 0;
      gap: 6px;
      align-items: center;
    }

    .composer-upload-card__btn {
      border: none;
      background: rgba(255, 255, 255, 0.08);
      color: inherit;
      border-radius: 8px;
      padding: 4px 8px;
      font-size: 11px;
      cursor: pointer;
    }

    .composer-upload-card__btn:hover {
      background: rgba(255, 255, 255, 0.14);
    }

    .composer-upload-card--failed {
      border-color: rgba(229, 57, 53, 0.55);
    }

    .composer-upload-card--ready .composer-upload-card__phase {
      color: #81c784;
    }

    .composer-attach-tile--busy::after {
      content: "";
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.35);
      border-radius: inherit;
      pointer-events: none;
    }

    @media (max-width: 520px) {
      .bubble-file-card {
        flex-wrap: wrap;
        width: 100%;
      }

      .bubble-file-card__actions {
        flex-direction: row;
        width: 100%;
        justify-content: flex-end;
      }
    }

    .channel-post-media-slot {
      position: relative;
      margin-bottom: 10px;
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      width: fit-content;
      max-width: min(560px, 100%);
      min-width: 0;
      align-self: flex-start;
    }

    /* Корень из fillMediaSlot — не растягивать на всю колонку чата */
    .channel-post-media-slot > .bubble-media--mode-stack,
    .channel-post-media-slot > .bubble-media--mode-album {
      width: fit-content;
      max-width: min(520px, 100%);
      min-width: 0;
      align-self: flex-start;
    }

    .channel-post-media-slot .bubble-media-wrap,
    .channel-post-media-slot .bubble-media-stack {
      width: fit-content;
      max-width: min(520px, 100%);
      min-width: 0;
    }

    .channel-post-media-slot .bubble-media-tile {
      width: fit-content;
      max-width: 100%;
    }

    /* Не тянуть картинку на 100% ширины «пустой» полосы — только natural + max */
    .channel-post-media-slot .bubble-media--mode-stack .bubble-media-img {
      display: block;
      width: auto;
      height: auto;
      max-width: min(520px, 100%);
      max-height: min(440px, 58vh);
    }

    .channel-post-media-slot .bubble-media--mode-stack .bubble-media-video {
      display: block;
      width: auto;
      max-width: min(520px, 100%);
      max-height: min(440px, 58vh);
    }

    .channel-post-media-slot .bubble-media-img {
      max-width: min(520px, 100%);
      max-height: min(440px, 58vh);
    }

    .channel-post-media-slot .bubble-media-video {
      max-width: min(520px, 100%);
      max-height: min(440px, 58vh);
    }

    .channel-post-media-slot .bubble-media--mode-album {
      width: fit-content;
      max-width: min(520px, 100%);
      align-self: flex-start;
    }

    .channel-post-media-slot .bubble-media--mode-album .media-album {
      width: min(420px, 100%);
      max-width: 100%;
    }

    .modal--media-layout .media-layout-choice-btns {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin: 14px 0 8px;
    }

    .modal--media-layout .media-layout-pick {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 4px;
      text-align: left;
      padding: 12px 14px;
      border-radius: 12px;
      width: 100%;
      transition: background-color 0.15s ease, color 0.15s ease, border-color 0.15s ease;
    }

    .modal--media-layout .media-layout-pick.media-layout-pick--active.primary {
      box-shadow: 0 0 0 1px color-mix(in srgb, var(--text) 25%, transparent);
    }

    .modal--media-layout .media-layout-hint {
      font-size: 12px;
      font-weight: 400;
      opacity: 0.85;
      line-height: 1.35;
    }

    .composer-media-layout-row {
      display: flex;
      align-items: center;
      justify-content: flex-end;
      gap: 8px;
      margin: 4px 10px 0;
      font-size: 12px;
      color: var(--muted);
    }

    .composer-media-layout-row.hidden {
      display: none;
    }

    .composer-media-layout-btn {
      border: none;
      background: transparent;
      color: var(--text);
      text-decoration: underline;
      text-underline-offset: 3px;
      cursor: pointer;
      font-size: 12px;
      padding: 0;
    }

    .composer-media-layout-btn:hover {
      color: var(--muted);
    }

    .composer-media-spoiler-row {
      display: flex;
      align-items: center;
      justify-content: flex-start;
      padding: 2px 10px 6px;
      margin: 0;
      font-size: 12px;
      color: var(--muted);
      user-select: none;
    }
    .composer-media-spoiler-row.hidden {
      display: none;
    }
    label.media-spoiler-check-label {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      cursor: pointer;
      user-select: none;
      white-space: nowrap;
    }

    label.media-spoiler-check-label input[type="checkbox"] {
      appearance: none;
      -webkit-appearance: none;
      position: relative;
      box-sizing: border-box;
      width: 20px;
      height: 20px;
      flex: 0 0 20px;
      margin: 0;
      border-radius: 6px;
      border: 2px solid color-mix(in srgb, var(--muted) 50%, var(--border));
      background: color-mix(in srgb, var(--panel) 88%, var(--text) 4%);
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--text) 8%, transparent),
        0 1px 2px color-mix(in srgb, #000 18%, transparent);
      cursor: pointer;
      transition:
        border-color 0.15s ease,
        background 0.15s ease,
        box-shadow 0.15s ease;
    }

    label.media-spoiler-check-label input[type="checkbox"]:hover {
      border-color: color-mix(in srgb, #7ea2ff 58%, var(--border));
      background: color-mix(in srgb, var(--panel) 82%, #7ea2ff 10%);
    }

    label.media-spoiler-check-label input[type="checkbox"]:focus-visible {
      outline: none;
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, var(--text) 8%, transparent),
        0 1px 2px color-mix(in srgb, #000 18%, transparent),
        0 0 0 3px color-mix(in srgb, #7ea2ff 38%, transparent);
    }

    label.media-spoiler-check-label input[type="checkbox"]:checked {
      border-color: color-mix(in srgb, #7ea2ff 72%, var(--border));
      background: linear-gradient(
        155deg,
        color-mix(in srgb, #8eb0ff 92%, #5a7fd4),
        color-mix(in srgb, #5a7fd4 88%, #3d5a9e)
      );
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 22%, transparent),
        0 1px 3px color-mix(in srgb, #1a2744 55%, transparent);
    }

    label.media-spoiler-check-label input[type="checkbox"]:checked::after {
      content: "";
      position: absolute;
      left: 50%;
      top: 47%;
      width: 4px;
      height: 8px;
      box-sizing: border-box;
      border: solid rgba(255, 255, 255, 0.96);
      border-width: 0 2px 2px 0;
      transform: translate(-50%, -50%) rotate(45deg);
    }

    label.media-spoiler-check-label .media-spoiler-check-text {
      font-size: 13px;
      font-weight: 800;
      letter-spacing: 0.04em;
      color: color-mix(in srgb, var(--text) 96%, #fff 4%);
      line-height: 1.25;
    }

    #composerAttachGrid.composer-attach-grid--spoiler-preview .composer-attach-tile img,
    #composerAttachGrid.composer-attach-grid--spoiler-preview .composer-attach-tile video {
      filter: blur(11px) contrast(1.12) saturate(0.85);
      transform: scale(1.02);
    }

    .giveaway-compose-spoiler-label {
      margin-top: 8px;
    }

    .msg-spoiler {
      display: inline;
      border-radius: 4px;
      padding: 0 2px;
      cursor: pointer;
      vertical-align: baseline;
    }
    .msg-spoiler-inner {
      display: inline;
      filter: blur(3.5px) contrast(1.45) saturate(0.35) brightness(0.88);
      user-select: none;
      transition: filter 0.18s ease;
    }
    .msg-spoiler--revealed .msg-spoiler-inner {
      filter: none;
      user-select: text;
    }

    .bubble-media-spoiler-host {
      position: relative;
      display: block;
      max-width: 100%;
      border-radius: 12px;
      overflow: hidden;
    }
    .bubble-media-spoiler-host:not(.bubble-media-spoiler-host--revealed)::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 2;
      pointer-events: none;
      opacity: 0.35;
      background-image: repeating-linear-gradient(
          0deg,
          transparent,
          transparent 5px,
          color-mix(in srgb, var(--text) 12%, transparent) 5px,
          color-mix(in srgb, var(--text) 12%, transparent) 6px
        ),
        repeating-linear-gradient(
          90deg,
          transparent,
          transparent 5px,
          color-mix(in srgb, var(--text) 10%, transparent) 5px,
          color-mix(in srgb, var(--text) 10%, transparent) 6px
        );
      mix-blend-mode: soft-light;
    }
    .bubble-media-spoiler-host--revealed::before {
      display: none;
    }
    .bubble-media-spoiler-host:not(.bubble-media-spoiler-host--revealed) .bubble-media-spoiler-visual {
      filter: blur(12px) contrast(1.18) saturate(0.9) brightness(0.94);
      transform: scale(1.02);
      pointer-events: none;
      user-select: none;
      transition: filter 0.22s ease, transform 0.22s ease;
    }
    .bubble-media-spoiler-host--revealed .bubble-media-spoiler-visual {
      filter: none;
      transform: none;
      pointer-events: auto;
    }
    .bubble-media-spoiler-cover {
      position: absolute;
      inset: 0;
      z-index: 3;
      margin: 0;
      border: none;
      border-radius: inherit;
      background: color-mix(in srgb, var(--panel) 62%, rgba(0, 0, 0, 0.35));
      color: var(--text);
      font: 700 13px/1.25 Inter, system-ui, sans-serif;
      letter-spacing: 0.02em;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      text-align: center;
      padding: 12px;
    }
    .bubble-media-spoiler-host--revealed .bubble-media-spoiler-cover {
      display: none;
    }

    .composer-poll-pending {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      margin: 6px 10px 0;
      padding: 8px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--text) 6%, transparent);
      font-size: 13px;
    }

    .composer-poll-pending.hidden {
      display: none;
    }

    .composer-poll-pending-clear {
      border: none;
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      font-size: 18px;
      line-height: 1;
      padding: 0 4px;
    }

    .composer-poll-pending-clear:hover {
      color: var(--text);
    }

    .composer-reply-pending {
      margin: 6px 10px 0;
      font-size: 12px;
    }

    .composer-reply-pending.hidden {
      display: none;
    }

    .composer-reply-pending-inner {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 10px;
      padding: 8px 10px;
      border-radius: 10px;
      background: rgba(255, 255, 255, 0.03);
      border: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
      color: var(--text);
      line-height: 1.35;
      transition: background-color 120ms ease, opacity 120ms ease;
    }

    .composer-reply-pending-main {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .composer-reply-pending-label {
      font-size: 12px;
      font-weight: 600;
      color: color-mix(in srgb, var(--accent) 82%, var(--text));
      line-height: 1.2;
    }

    .composer-reply-pending-quote {
      display: flex;
      align-items: stretch;
      gap: 8px;
      min-width: 0;
    }

    .composer-reply-accent,
    .bubble-reply-accent {
      flex: 0 0 3px;
      width: 3px;
      border-radius: 999px;
      background: var(--accent);
      align-self: stretch;
    }

    .composer-reply-body,
    .bubble-reply-body {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .composer-reply-author,
    .bubble-context--reply .bubble-context-author {
      font-size: 12px;
      font-weight: 600;
      color: color-mix(in srgb, var(--accent) 82%, var(--text));
      line-height: 1.2;
      margin: 0;
      opacity: 1;
    }

    .composer-reply-snippet,
    .bubble-context--reply .bubble-context-snippet {
      font-size: 12px;
      font-weight: 400;
      color: var(--text);
      line-height: 1.2;
      margin: 0;
      opacity: 0.88;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
      max-width: 100%;
    }

    .bubble-context {
      margin-bottom: 4px;
      padding: 8px 10px;
      border-radius: 10px;
      border-left: none;
      background: rgba(255, 255, 255, 0.03);
      font-size: 12px;
      line-height: 1.2;
      max-width: 100%;
      width: auto;
      align-self: flex-start;
      box-sizing: border-box;
      cursor: pointer;
      text-align: left;
      transition: background-color 120ms ease, opacity 120ms ease;
    }

    .bubble-context:hover {
      background: rgba(255, 255, 255, 0.06);
    }

    .bubble-context--reply {
      display: flex;
      align-items: stretch;
      gap: 8px;
      padding: 8px 10px;
      min-height: 40px;
      max-height: 48px;
    }

    .bubble-context--forward {
      border-left: 1px solid color-mix(in srgb, #6eb3ff 65%, var(--border));
      border-top: 1px solid color-mix(in srgb, #6eb3ff 45%, var(--border));
      border-bottom: 1px solid color-mix(in srgb, #6eb3ff 45%, var(--border));
      border-right: 1px solid color-mix(in srgb, #6eb3ff 35%, var(--border));
      padding-top: 3px;
      padding-bottom: 3px;
      display: flex;
      flex-direction: column;
      gap: 1.5em;
      background: color-mix(in srgb, #6eb3ff 8%, var(--panel));
    }

    .bubble-context--forward .bubble-context-label {
      font-size: 13px;
      font-weight: 700;
    }

    .bubble-context-label {
      font-weight: 600;
      font-size: 11px;
      color: var(--muted);
      margin: 0;
      line-height: 1.2;
    }

    .bubble-context-snippet {
      color: var(--text);
      display: block;
      margin: 0;
      white-space: pre-wrap;
      word-break: break-word;
    }

    .bubble-context--forward .bubble-context-snippet {
      margin: 0;
      font-size: 15px;
      line-height: 1.4;
    }

    .bubble-jump-flash {
      animation: bubbleJumpFlash 1.2s ease-out 1;
    }

    @keyframes bubbleJumpFlash {
      0% {
        outline: 2px solid color-mix(in srgb, var(--invite-accent, #8ab4ff) 70%, transparent);
        outline-offset: 2px;
      }
      100% {
        outline: 2px solid transparent;
        outline-offset: 4px;
      }
    }

    .ch-forward-post-btn {
      font-size: 12px;
      padding: 4px 10px;
      margin-left: 8px;
      display: none;
      align-items: center;
      gap: 5px;
    }

    .ch-forward-post-btn .ch-btn-icon {
      flex-shrink: 0;
      opacity: 0.9;
    }

    .forward-post-modal-friends {
      display: flex;
      flex-direction: column;
      gap: 6px;
      max-height: 220px;
      overflow-y: auto;
      margin-top: 12px;
    }

    .forward-post-modal-friends button {
      text-align: left;
    }

    .modal.modal--forward-picker {
      width: min(420px, 94vw);
      max-height: min(88vh, 640px);
      display: flex;
      flex-direction: column;
      min-height: 0;
      overflow: hidden;
      box-sizing: border-box;
    }

    .forward-picker-header {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      flex-shrink: 0;
    }

    .forward-picker-heading {
      min-width: 0;
      flex: 1;
    }

    .forward-picker-heading .delete-help {
      margin-top: 6px;
    }

    .forward-picker-close {
      flex-shrink: 0;
    }

    .forward-picker-search {
      flex-shrink: 0;
      margin-top: 12px;
    }

    .forward-picker-search-input {
      width: 100%;
      box-sizing: border-box;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--panel);
      color: var(--text);
      padding: 10px 12px;
      font-size: 14px;
    }

    .forward-picker-list {
      flex: 1;
      min-height: 0;
      margin-top: 12px;
      max-height: min(52vh, 420px);
      overflow-y: auto;
      overflow-x: hidden;
      -webkit-overflow-scrolling: touch;
    }

    .dialog-item--forward-picker {
      cursor: pointer;
    }

    .dialog-item--forward-picker .forward-picker-chevron {
      flex-shrink: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      align-self: center;
      color: color-mix(in srgb, var(--muted) 78%, var(--text));
      margin-right: 2px;
      transition: color 120ms ease;
    }

    .dialog-item--forward-picker:hover .forward-picker-chevron,
    .dialog-item--forward-picker:focus-within .forward-picker-chevron {
      color: var(--text);
    }

    .modal.modal--poll-compose {
      width: min(440px, 94vw);
      max-height: min(88vh, 640px);
      padding: 0;
      display: flex;
      flex-direction: column;
      min-height: 0;
      overflow: hidden;
      box-sizing: border-box;
    }

    .modal--poll-compose .poll-compose-modal-header {
      flex-shrink: 0;
      padding: 16px 16px 0;
    }

    .modal--poll-compose .poll-compose-modal-header .delete-help {
      margin-top: 6px;
    }

    .poll-compose-modal-scroll {
      flex: 1;
      min-height: 0;
      overflow-y: auto;
      overflow-x: hidden;
      padding: 12px 16px 8px;
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .poll-compose-modal-scroll::-webkit-scrollbar {
      width: 8px;
    }

    .poll-compose-modal-scroll::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .poll-compose-modal-scroll::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 8px;
      border: 2px solid var(--scrollbar-track);
      background-clip: padding-box;
    }

    .poll-compose-option-row .poll-compose-delete {
      flex: 0 0 auto;
      width: 36px;
      height: 36px;
      padding: 0;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--muted);
      font-size: 18px;
      line-height: 1;
      cursor: pointer;
    }

    .poll-compose-option-row .poll-compose-delete:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--text) 25%, var(--border));
    }

    .poll-compose-check-row--indented {
      margin-left: 28px;
      margin-top: 4px;
    }

    .poll-compose-check-row--indented.poll-compose-check-row--disabled {
      opacity: 0.45;
      pointer-events: none;
    }

    .modal--poll-compose .poll-compose-modal-footer {
      flex-shrink: 0;
      padding: 12px 16px 16px;
      margin: 0;
      border-top: 1px solid var(--border);
      gap: 10px;
    }

    .modal--poll-compose .poll-compose-field {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin-bottom: 12px;
    }

    .modal--poll-compose .poll-compose-field label {
      font-size: 13px;
      color: var(--muted);
    }

    .modal--poll-compose input[type="text"] {
      width: 100%;
      box-sizing: border-box;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--text);
      font: inherit;
      font-size: 14px;
    }

    .modal--poll-compose .poll-compose-option-row {
      display: flex;
      gap: 8px;
      align-items: center;
      margin-bottom: 8px;
    }

    .modal--poll-compose .poll-compose-option-row input[type="text"] {
      flex: 1;
      min-width: 0;
      width: auto;
    }

    .modal--poll-compose .poll-compose-add {
      margin: 4px 0 4px;
      width: 100%;
    }

    .modal--poll-compose .poll-compose-checks {
      margin: 12px 0 4px;
      font-size: 14px;
    }

    .modal--poll-compose .poll-compose-checks label.poll-compose-check-row {
      display: flex;
      flex-direction: row;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      line-height: 1.35;
    }

    .modal--poll-compose .poll-compose-checks input[type="checkbox"] {
      width: 18px;
      height: 18px;
      flex: 0 0 18px;
      margin: 0;
      accent-color: color-mix(in srgb, var(--text) 70%, #6b9fff);
    }

    label.poll-compose-check-row {
      display: flex;
      align-items: center;
      gap: 10px;
      cursor: pointer;
      line-height: 1.35;
      margin: 8px 0 4px;
    }

    label.poll-compose-check-row:not(.media-spoiler-check-label) input[type="checkbox"] {
      width: 18px;
      height: 18px;
      flex: 0 0 18px;
      margin: 0;
      accent-color: color-mix(in srgb, var(--text) 70%, #6b9fff);
    }

    .modal--poll-compose .poll-compose-checks .poll-compose-check-text {
      flex: 1;
      min-width: 0;
    }

    .modal--giveaway-compose {
      max-width: min(520px, 96vw);
      width: 100%;
    }

    .modal--giveaway-compose .poll-compose-modal-scroll {
      max-height: min(62vh, 520px);
    }

    .giveaway-compose-row-2 {
      display: grid;
      grid-template-columns: 1fr 120px;
      gap: 12px;
      align-items: end;
    }

    .giveaway-compose-datetime,
    .giveaway-compose-num {
      width: 100%;
      box-sizing: border-box;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--text);
      font: inherit;
      font-size: 14px;
    }

    .giveaway-compose-photo-block {
      margin-top: 10px;
      padding-top: 10px;
      border-top: 1px dashed var(--border);
    }

    .giveaway-compose-photo-label {
      display: block;
      font-size: 13px;
      color: var(--muted);
      margin-bottom: 8px;
    }

    .giveaway-compose-photo-actions {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 10px;
    }

    .channel-post-giveaway-host {
      width: fit-content;
      max-width: min(340px, 100%);
      box-sizing: border-box;
    }

    .bubble-giveaway {
      margin: 10px 0 12px;
      padding: 12px 14px;
      border-radius: 14px;
      background: linear-gradient(
        160deg,
        color-mix(in srgb, #8b5cf6 18%, var(--panel)) 0%,
        color-mix(in srgb, #4f46e5 10%, var(--panel)) 45%,
        color-mix(in srgb, var(--panel) 96%, transparent) 100%
      );
      border: 1px solid color-mix(in srgb, #8b5cf6 40%, var(--border));
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, #ffffff 6%, transparent),
        0 8px 24px color-mix(in srgb, #080b14 26%, transparent);
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
    }

    .bubble-giveaway-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      font-size: 12px;
      font-weight: 800;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: color-mix(in srgb, #8b5cf6 85%, var(--text));
      margin-bottom: 8px;
    }

    .bubble-giveaway-meta-list {
      display: flex;
      flex-direction: column;
      gap: 6px;
      font-size: 12px;
      color: var(--muted);
      margin-bottom: 9px;
      line-height: 1.38;
      max-width: 100%;
    }

    .bubble-giveaway-meta-row {
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      gap: 4px 8px;
      word-break: break-word;
      overflow-wrap: anywhere;
    }

    .bubble-giveaway-meta-k {
      color: var(--muted);
      font-weight: 600;
    }

    .bubble-giveaway-terms {
      font-size: 13px;
      line-height: 1.45;
      margin-bottom: 10px;
      color: var(--text);
    }

    .bubble-giveaway-cta,
    .bubble-giveaway-draw-btn {
      margin-top: 2px;
      padding: 9px 16px;
      border-radius: 11px;
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      border: none;
      background: color-mix(in srgb, #7c3aed 75%, #4f46e5);
      color: #fff;
    }

    .bubble-giveaway-draw-btn {
      background: color-mix(in srgb, #0d9488 80%, #115e59);
    }

    .bubble-giveaway-hint {
      font-size: 12px;
      color: var(--muted);
      margin: 6px 0 0;
    }

    .bubble-giveaway-winners {
      font-size: 13px;
      margin-top: 8px;
      line-height: 1.45;
      word-break: break-word;
      overflow-wrap: anywhere;
    }

    .bubble-giveaway-actions {
      display: flex;
      flex-direction: column;
      align-items: stretch;
      gap: 8px;
      width: 100%;
      margin-top: 2px;
    }

    .bubble-giveaway-actions .bubble-giveaway-cta,
    .bubble-giveaway-actions .bubble-giveaway-draw-btn {
      width: 100%;
      margin-top: 0;
      text-align: center;
    }

    .channel-giveaway-result-card {
      margin: 2px 0 10px;
      padding: 12px 14px;
      border: 1px solid color-mix(in srgb, #22c55e 36%, var(--border));
      border-radius: 14px;
      background: linear-gradient(
        160deg,
        color-mix(in srgb, #22c55e 14%, var(--panel)) 0%,
        color-mix(in srgb, #0ea5e9 10%, var(--panel)) 58%,
        color-mix(in srgb, var(--panel) 96%, transparent) 100%
      );
      box-shadow: inset 0 1px 0 color-mix(in srgb, #ffffff 8%, transparent);
    }

    .channel-giveaway-result-title {
      font-size: 14px;
      font-weight: 800;
      letter-spacing: 0.02em;
      color: color-mix(in srgb, #22c55e 80%, var(--text));
      margin-bottom: 8px;
      text-transform: uppercase;
    }

    .channel-giveaway-result-meta {
      font-size: 12px;
      color: var(--muted);
      margin-bottom: 7px;
      line-height: 1.4;
    }

    .channel-giveaway-result-list {
      margin: 0;
      padding-left: 18px;
      line-height: 1.45;
      font-size: 14px;
      color: var(--text);
    }

    .channel-giveaway-result-empty {
      font-size: 13px;
      color: var(--muted);
      line-height: 1.4;
    }

    .bubble-poll {
      margin-bottom: 8px;
      padding: 8px 10px;
      border-radius: 12px;
      background: color-mix(in srgb, var(--text) 7%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
      box-sizing: border-box;
      width: min(560px, 100%);
      max-width: min(720px, 100%);
      align-self: flex-start;
    }

    .bubble-poll-question {
      font-weight: 600;
      font-size: 15px;
      margin-bottom: 6px;
      line-height: 1.35;
    }

    .bubble-poll-meta {
      font-size: 11px;
      color: var(--muted);
      margin-bottom: 7px;
    }

    .bubble-poll-option {
      position: relative;
      margin-bottom: 5px;
      border-radius: 10px;
      overflow: hidden;
      cursor: default;
    }

    .bubble-poll-option.bubble-poll-option--multi {
      display: flex;
      flex-direction: row;
      align-items: stretch;
      overflow: visible;
      gap: 8px;
    }

    .bubble-poll-option--multi .bubble-poll-checkbox {
      flex: 0 0 18px;
      width: 18px;
      height: 18px;
      margin: 0 0 0 2px;
      accent-color: color-mix(in srgb, var(--text) 65%, #6b9fff);
      cursor: pointer;
      align-self: center;
    }

    .bubble-poll-option-inner {
      position: relative;
      display: flex;
      align-items: center;
      min-height: 32px;
      width: 100%;
      border-radius: 10px;
      overflow: hidden;
    }

    .bubble-poll-option--multi .bubble-poll-option-inner {
      flex: 1;
      min-width: 0;
    }

    .bubble-poll-option--clickable {
      cursor: pointer;
    }

    .bubble-poll-option--clickable:hover .bubble-poll-bar-fill {
      filter: brightness(1.08);
    }

    .bubble-poll-bar {
      position: absolute;
      inset: 0;
      background: color-mix(in srgb, var(--text) 10%, transparent);
      border-radius: 10px;
    }

    .bubble-poll-bar-fill {
      position: absolute;
      inset: 0 auto 0 0;
      width: 0%;
      background: linear-gradient(
        90deg,
        color-mix(in srgb, #6b9fff 55%, var(--bubble-out)),
        color-mix(in srgb, #8ad4ff 40%, var(--bubble-out))
      );
      border-radius: 10px;
      transition: width 0.35s ease;
      min-width: 0;
    }

    .bubble.in .bubble-poll-bar-fill {
      background: linear-gradient(
        90deg,
        color-mix(in srgb, #6b9fff 50%, var(--bubble-in)),
        color-mix(in srgb, #8ad4ff 35%, var(--bubble-in))
      );
    }

    .bubble-poll-option-label {
      position: relative;
      z-index: 1;
      flex: 1;
      min-width: 0;
      padding: 4px 38px 4px 10px;
      font-size: 13px;
      line-height: 1.3;
      color: var(--text);
    }

    .bubble-poll-option--multi .bubble-poll-option-label {
      padding-left: 10px;
    }

    .bubble-poll-count {
      position: absolute;
      right: 9px;
      top: 50%;
      transform: translateY(-50%);
      z-index: 1;
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
      line-height: 1;
    }

    .bubble-poll-option--mine .bubble-poll-bar-fill {
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--text) 35%, transparent);
    }

    .bubble-poll-multi-actions {
      margin-top: 10px;
      display: flex;
      align-items: center;
      gap: 10px;
      flex-wrap: wrap;
    }

    .bubble-poll-multi-actions label {
      display: flex;
      align-items: center;
      gap: 6px;
      font-size: 13px;
      cursor: pointer;
    }

    .bubble-poll-total {
      margin-top: 8px;
      font-size: 12px;
      color: var(--muted);
    }

    /* Крупный режим: почти на всю ширину колонки, сохраняем пропорции */
    .bubble-media--mode-stack .bubble-media-stack,
    .bubble-media--mode-stack.bubble-media-wrap {
      max-width: min(520px, 100%);
    }

    .bubble-media--mode-stack .bubble-media-img {
      width: 100%;
      max-width: min(520px, 100%);
      max-height: min(88vh, 920px);
      height: auto;
      object-fit: contain;
    }

    .bubble-media--mode-stack .bubble-media-video {
      max-width: min(520px, 100%);
      max-height: min(72vh, 720px);
    }

    /* Компактный альбом (как в Telegram) — ширина совпадает с текстом пузыря */
    .bubble-media--mode-album {
      width: 100%;
      min-width: 0;
      align-self: stretch;
    }

    .media-album {
      display: grid;
      gap: 3px;
      border-radius: 12px;
      overflow: hidden;
      width: 100%;
      max-width: 100%;
      box-sizing: border-box;
      background: color-mix(in srgb, var(--text) 8%, transparent);
    }

    .album-cell {
      position: relative;
      min-width: 0;
      min-height: 0;
      overflow: hidden;
      display: flex;
      align-items: stretch;
      justify-content: stretch;
    }

    .album-cell img,
    .album-cell video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
    }

    .album-cell .bubble-media-expand-btn {
      z-index: 1;
    }

    .media-album--n2 {
      grid-template-columns: 1fr 1fr;
      grid-template-rows: minmax(160px, min(48vw, 280px));
      max-height: min(360px, 70vw);
    }

    .media-album--n3 {
      grid-template-columns: 2fr 1fr;
      grid-template-rows: 1fr 1fr;
      aspect-ratio: 16 / 11;
      max-height: 340px;
    }

    .media-album--n3 .album-cell:first-child {
      grid-row: 1 / span 2;
    }

    .media-album--n4 {
      grid-template-columns: 1fr 1fr;
      grid-template-rows: 1fr 1fr;
      aspect-ratio: 1;
      max-height: 360px;
    }

    .media-album--n5 {
      grid-template-columns: repeat(6, 1fr);
      grid-template-rows: 1fr 1fr;
      aspect-ratio: 16 / 11;
      max-height: 340px;
    }

    .media-album--n5 .album-cell:nth-child(-n + 3) {
      grid-column: span 2;
    }

    .media-album--n5 .album-cell:nth-child(4) {
      grid-column: 1 / span 3;
    }

    .media-album--n5 .album-cell:nth-child(5) {
      grid-column: 4 / span 3;
    }

    .media-album--n6 {
      grid-template-columns: repeat(3, minmax(0, 1fr));
      grid-template-rows: repeat(2, minmax(0, 1fr));
      aspect-ratio: 3 / 2;
      max-height: min(340px, 56vw);
    }

    .media-album--n7 {
      grid-template-columns: repeat(3, 1fr);
      grid-auto-rows: minmax(90px, 28vw);
      max-height: 380px;
    }

    .media-album--n8 {
      grid-template-columns: repeat(4, 1fr);
      grid-template-rows: 1fr 1fr;
      aspect-ratio: 2 / 1;
      max-height: 300px;
    }

    .media-album--n9 {
      grid-template-columns: repeat(3, 1fr);
      grid-template-rows: repeat(3, 1fr);
      aspect-ratio: 1;
      max-height: 360px;
    }

    .media-album--n10 {
      grid-template-columns: repeat(5, minmax(0, 1fr));
      grid-template-rows: repeat(2, minmax(0, 1fr));
      aspect-ratio: 5 / 2;
      max-height: min(260px, 48vw);
    }

    .channel-post-media-slot .media-album {
      max-width: 100%;
    }

    /* Полноэкранный просмотр медиа (как в Telegram) */
    .media-lightbox {
      position: fixed;
      inset: 0;
      z-index: 2000;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: max(12px, env(safe-area-inset-top)) max(12px, env(safe-area-inset-right))
        max(12px, env(safe-area-inset-bottom)) max(12px, env(safe-area-inset-left));
      box-sizing: border-box;
    }

    .media-lightbox.hidden {
      display: none !important;
    }

    .media-lightbox-backdrop {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.78);
      backdrop-filter: blur(4px);
    }

    .media-lightbox-stage {
      position: relative;
      z-index: 1;
      max-width: 96vw;
      max-height: 92vh;
      display: flex;
      align-items: center;
      justify-content: center;
      pointer-events: none;
    }

    .media-lightbox-stage > * {
      pointer-events: auto;
    }

    .media-lightbox-inner img.media-lightbox-media,
    .media-lightbox-inner video.media-lightbox-media {
      display: block;
      max-width: min(1200px, 94vw);
      max-height: 88vh;
      width: auto;
      height: auto;
      object-fit: contain;
      border-radius: 10px;
      box-shadow: 0 16px 56px rgba(0, 0, 0, 0.55);
    }

    .media-lightbox-close {
      position: fixed;
      top: max(12px, env(safe-area-inset-top));
      right: max(12px, env(safe-area-inset-right));
      z-index: 2;
      width: 44px;
      height: 44px;
      border: none;
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.12);
      color: #fff;
      font-size: 26px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.15s ease;
    }

    .media-lightbox-close:hover {
      background: rgba(255, 255, 255, 0.22);
    }

    body.media-lightbox-open {
      overflow: hidden;
    }

    .media-lightbox-nav {
      position: fixed;
      top: 50%;
      transform: translateY(-50%);
      z-index: 2;
      width: 48px;
      height: 48px;
      border: none;
      border-radius: 12px;
      background: rgba(255, 255, 255, 0.1);
      color: #fff;
      font-size: 28px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
      transition: background 0.15s ease;
    }

    .media-lightbox-nav:hover {
      background: rgba(255, 255, 255, 0.2);
    }

    .media-lightbox-prev {
      left: max(10px, env(safe-area-inset-left));
    }

    .media-lightbox-next {
      right: max(10px, env(safe-area-inset-right));
    }

    .media-lightbox-nav[hidden] {
      display: none !important;
    }

    .media-lightbox-column {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 10px;
      max-width: min(1200px, 94vw);
      pointer-events: auto;
    }

    .media-lightbox-counter {
      color: rgba(255, 255, 255, 0.92);
      font-size: 15px;
      font-weight: 600;
      letter-spacing: 0.06em;
      min-height: 22px;
      text-shadow: 0 1px 8px rgba(0, 0, 0, 0.6);
    }

    /* Фото профиля на весь экран (как в Telegram; аватар часто 320×320) */
    .media-lightbox--profile-photo {
      padding: 0;
      z-index: 5200;
    }

    .media-lightbox--profile-photo .media-lightbox-backdrop {
      background: rgba(0, 0, 0, 0.92);
      backdrop-filter: none;
    }

    .media-lightbox--profile-photo .media-lightbox-stage {
      width: 100%;
      height: 100%;
      max-width: 100vw;
      max-height: 100vh;
    }

    .media-lightbox--profile-photo .media-lightbox-column {
      width: 100%;
      height: 100%;
      max-width: 100%;
      justify-content: center;
    }

    .media-lightbox--profile-photo .media-lightbox-inner {
      display: flex;
      align-items: center;
      justify-content: center;
      width: 100%;
      flex: 1;
      min-height: 0;
    }

    .media-lightbox--profile-photo .media-lightbox-inner img.media-lightbox-media {
      display: block;
      width: auto;
      height: auto;
      max-width: 95vw;
      max-height: 95vh;
      object-fit: contain;
      object-position: center center;
      border-radius: 0;
      box-shadow: none;
      image-rendering: auto;
    }

    .bubble-media-stack {
      display: flex;
      flex-direction: column;
      gap: 8px;
      margin-bottom: 6px;
      max-width: min(420px, 100%);
    }

    .bubble-media-tile {
      position: relative;
    }

    .composer-attach-grid {
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(76px, 1fr));
      gap: 8px;
      max-height: 220px;
      overflow-y: auto;
    }

    .composer-attach-tile {
      position: relative;
      border-radius: 10px;
      overflow: hidden;
      background: color-mix(in srgb, var(--panel) 85%, transparent);
      aspect-ratio: 1;
      min-height: 0;
    }

    .composer-attach-tile img,
    .composer-attach-tile video {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      cursor: zoom-in;
    }

    .composer-attach-tile--doc {
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      padding: 6px;
      font-size: 11px;
      text-align: center;
      color: var(--muted);
      word-break: break-word;
    }

    .composer-attach-tile-num {
      position: absolute;
      bottom: 6px;
      left: 6px;
      padding: 2px 7px;
      border-radius: 6px;
      background: rgba(0, 0, 0, 0.55);
      color: #fff;
      font-size: 11px;
      font-weight: 700;
      line-height: 1.2;
      pointer-events: none;
    }

    .composer-attach-tile-remove {
      position: absolute;
      top: 4px;
      right: 4px;
      width: 22px;
      height: 22px;
      padding: 0;
      border: none;
      border-radius: 8px;
      background: rgba(0, 0, 0, 0.55);
      color: #fff;
      font-size: 14px;
      line-height: 1;
      cursor: pointer;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .composer-attach-tile-remove:hover {
      background: rgba(0, 0, 0, 0.75);
    }

    .composer-input-wrap {
      flex: 1;
      min-width: 0;
      min-height: 0;
      display: flex;
      align-items: center;
    }

    #messageInput.composer-input {
      display: block;
      width: 100%;
      border: none;
      outline: none;
      background: transparent;
      color: var(--text);
      caret-color: var(--text);
      padding: 6px 4px;
      font-size: 14px;
      line-height: 1.4;
      font-family: inherit;
      box-shadow: none;
      resize: none;
      overflow-y: auto;
      min-height: 36px;
      max-height: 200px;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    #messageInput.composer-input::placeholder {
      color: var(--muted);
      opacity: 1;
    }

    .icon-circle-btn {
      flex-shrink: 0;
      width: 36px;
      height: 36px;
      padding: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      border-radius: 999px;
      border: none;
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      transition: background-color 160ms ease, color 160ms ease;
    }

    .icon-circle-btn:hover {
      background: var(--border);
      color: var(--text);
    }

    .icon-circle-btn svg {
      width: 18px;
      height: 18px;
      display: block;
    }

    .icon-circle-btn.composer-schedule-btn {
      color: color-mix(in srgb, var(--muted) 85%, #87b8ff);
    }

    .icon-circle-btn.composer-schedule-btn.is-armed {
      color: #87b8ff;
      background: color-mix(in srgb, #87b8ff 12%, transparent);
      box-shadow: inset 0 0 0 1px color-mix(in srgb, #87b8ff 55%, var(--border));
    }

    .send-fab {
      background: var(--text);
      color: var(--panel);
    }

    .send-fab:hover {
      background: var(--muted);
      color: var(--panel);
      filter: brightness(1.05);
    }

    .send-fab svg {
      width: 16px;
      height: 16px;
    }

    .emoji-picker {
      position: absolute;
      left: auto;
      right: 8px;
      bottom: 100%;
      width: min(300px, calc(100% - 16px));
      margin-bottom: 8px;
      z-index: 50;
      /* 5 колонок × 4 видимых ряда, дальше — прокрутка */
      display: grid;
      grid-template-columns: repeat(5, minmax(0, 1fr));
      grid-auto-rows: 42px;
      gap: 4px;
      align-content: start;
      max-height: calc(42px * 4 + 4px * 3 + 20px);
      overflow-y: auto;
      overflow-x: hidden;
      padding: 10px;
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 12px;
      box-shadow: 0 8px 28px var(--shadow);
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .emoji-picker::-webkit-scrollbar {
      width: 8px;
    }

    .emoji-picker::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .emoji-picker::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 4px;
    }

    .emoji-picker::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .emoji-pick {
      box-sizing: border-box;
      width: 100%;
      height: 100%;
      min-height: 0;
      margin: 0;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      font-size: 1.4rem;
      line-height: 1;
      padding: 4px;
      border: 1px solid transparent;
      border-radius: 8px;
      background: transparent;
      cursor: pointer;
      transition: background-color 160ms ease, border-color 160ms ease;
    }

    .emoji-pick:hover {
      background: var(--bg);
      border-color: var(--border);
    }

    .chat-main {
      display: grid;
      grid-template-rows: auto minmax(0, 1fr) auto;
      min-width: 0;
      flex: 1;
      min-height: 0;
      overflow: hidden;
      position: relative;
    }

    .chat-drop-overlay {
      position: absolute;
      inset: 0;
      z-index: 24;
      display: none;
      align-items: center;
      justify-content: center;
      padding: 20px;
      box-sizing: border-box;
      pointer-events: none;
      background: color-mix(in srgb, var(--bg) 78%, transparent);
      border: 2px dashed color-mix(in srgb, var(--text) 22%, var(--border));
      border-radius: 12px;
      margin: 8px;
    }

    .chat-main.chat-drop-active .chat-drop-overlay {
      display: flex;
    }

    .chat-drop-overlay-inner {
      padding: 14px 20px;
      border-radius: 12px;
      background: var(--panel);
      border: 1px solid var(--border);
      box-shadow: 0 12px 36px var(--shadow);
      font-size: 14px;
      font-weight: 600;
      color: var(--text);
      text-align: center;
      line-height: 1.4;
    }

    .chat-drop-overlay-hint {
      display: block;
      margin-top: 6px;
      font-size: 12px;
      font-weight: 500;
      color: var(--muted);
    }

    .chat-scroll-bottom-btn {
      position: absolute;
      right: 16px;
      bottom: 84px;
      z-index: 7;
      width: 38px;
      height: 38px;
      border-radius: 999px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      color: var(--text);
      display: inline-flex;
      align-items: center;
      justify-content: center;
      cursor: pointer;
      box-shadow: 0 8px 22px color-mix(in srgb, #000 24%, transparent);
      transition: transform 140ms ease, opacity 140ms ease;
    }

    .chat-scroll-bottom-btn.hidden {
      opacity: 0;
      pointer-events: none;
      transform: translateY(8px);
    }

    .chat-scroll-bottom-btn svg {
      width: 18px;
      height: 18px;
      display: block;
    }

    .chat-header {
      border-bottom: 1px solid var(--border);
      background: var(--panel);
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 8px 12px;
      min-height: 52px;
      flex-shrink: 0;
      transition: background-color 240ms ease, border-color 240ms ease;
    }

    .olone-chat-header__identity {
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 10px;
    }

    .olone-chat-header__idle-mark {
      display: none;
      flex-shrink: 0;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
      background: color-mix(in srgb, var(--muted) 10%, transparent);
      color: color-mix(in srgb, var(--muted) 82%, var(--text));
      align-items: center;
      justify-content: center;
    }

    .olone-chat-header[data-olone-header-mode="idle"] .olone-chat-header__idle-mark {
      display: inline-flex;
    }

    .olone-chat-header[data-olone-header-mode="idle"] .olone-chat-header__avatar {
      display: none;
    }

    .olone-chat-header__avatar {
      flex-shrink: 0;
      width: 40px;
      height: 40px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
      background: color-mix(in srgb, var(--panel) 70%, var(--bg));
      overflow: hidden;
      display: grid;
      place-items: center;
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
      position: relative;
    }

    .olone-chat-header__avatar > img {
      width: 100%;
      height: 100%;
      object-fit: cover;
      display: block;
      position: absolute;
      inset: 0;
    }

    .olone-chat-header__avatar img.hidden {
      display: none !important;
    }

    #chatHeaderAvatarPh {
      position: relative;
      z-index: 0;
      line-height: 0;
      font-size: 0;
      user-select: none;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .olone-chat-header__titles {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 1px;
    }

    .olone-chat-header__title {
      margin: 0;
      font-size: 16px;
      font-weight: 700;
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .olone-chat-header__subtitle {
      margin: 0;
      font-size: 12px;
      line-height: 1.3;
      color: var(--muted);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .olone-chat-header__subtitle.hidden {
      display: none;
    }

    .olone-chat-header__subtitle--typing {
      color: color-mix(in srgb, #6f9bff 72%, var(--muted));
    }

    .olone-chat-header__actions {
      flex-shrink: 0;
      display: flex;
      align-items: center;
      gap: 6px;
      max-width: 52%;
    }

    .olone-chat-header-menu-wrap {
      position: relative;
      flex-shrink: 0;
    }

    .olone-chat-header-menu {
      position: absolute;
      top: calc(100% + 6px);
      right: 0;
      z-index: 90;
      min-width: 180px;
      padding: 6px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--panel);
      box-shadow: 0 12px 32px rgba(0, 0, 0, 0.35);
      display: flex;
      flex-direction: column;
      gap: 2px;
    }

    .olone-chat-header-menu.hidden {
      display: none;
    }

    .olone-chat-header-menu-item {
      display: block;
      width: 100%;
      text-align: left;
      padding: 9px 12px;
      border: none;
      border-radius: 8px;
      background: transparent;
      color: var(--text);
      font-size: 14px;
      cursor: pointer;
    }

    .olone-chat-header-menu-item:hover {
      background: color-mix(in srgb, var(--accent, #5b8def) 12%, transparent);
    }

    .olone-chat-header--selection .olone-chat-header__identity,
    .olone-chat-header--selection .olone-chat-header-menu-wrap,
    .olone-chat-header--selection #groupChatSettingsBtn,
    .olone-chat-header--selection #channelSettingsBtn,
    .olone-chat-header--selection #channelHeaderSubscribe {
      display: none !important;
    }

    .olone-chat-header--selection .msg-tools {
      display: flex !important;
      flex: 1;
      min-width: 0;
      overflow-x: auto;
      -webkit-overflow-scrolling: touch;
    }

    #reportUserBtn {
      display: none !important;
    }

    @media (min-width: 921px) {
      .olone-chat-header--selection .olone-chat-header__identity {
        display: flex !important;
      }

      .olone-chat-header.olone-chat-header--selection {
        gap: 24px;
      }

      .olone-chat-header--selection .olone-chat-header__actions {
        flex: 1;
        min-width: 0;
        max-width: none;
        justify-content: flex-end;
        align-items: center;
        gap: 24px;
      }

      .olone-chat-header--selection .msg-tools {
        flex: 0 0 auto;
        width: auto;
        max-width: none;
        overflow: visible;
        margin-right: 0;
        animation: msgToolsToolbarIn 140ms ease-out;
      }

      @keyframes msgToolsToolbarIn {
        from {
          opacity: 0;
          transform: translateY(-6px);
        }
        to {
          opacity: 1;
          transform: translateY(0);
        }
      }

      .msg-tools {
        align-items: center;
        gap: 6px;
        padding: 3px 4px;
        min-height: 40px;
        max-height: 40px;
        border-radius: 12px;
        border: 1px solid rgba(255, 255, 255, 0.06);
        background: rgba(17, 20, 24, 0.72);
        backdrop-filter: blur(12px);
        -webkit-backdrop-filter: blur(12px);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.2);
      }

      [data-theme="light"] .msg-tools {
        background: rgba(255, 255, 255, 0.82);
        border-color: rgba(0, 0, 0, 0.06);
        box-shadow: 0 8px 24px rgba(0, 0, 0, 0.08);
      }

      .msg-tools__primary,
      .msg-tools__forward {
        display: flex;
        align-items: center;
        gap: 2px;
        min-width: 0;
      }

      .msg-tools__forward {
        display: none;
      }

      .msg-tools--selection .msg-tools__primary {
        display: none;
      }

      .msg-tools--selection .msg-tools__forward {
        display: flex;
      }

      .msg-tools-more {
        position: relative;
        flex-shrink: 0;
      }

      .msg-tools .msg-tools-btn,
      .msg-tools .msg-tools-btn.secondary {
        display: inline-flex;
        flex-direction: row;
        align-items: center;
        justify-content: center;
        gap: 5px;
        min-width: 0;
        height: 34px;
        padding: 8px 10px;
        border: none;
        border-radius: 8px;
        background: transparent;
        color: color-mix(in srgb, var(--text) 90%, var(--muted));
        font-size: 12px;
        font-weight: 500;
        line-height: 1.2;
        white-space: nowrap;
        cursor: pointer;
        transition: background-color 120ms ease, color 120ms ease, opacity 120ms ease;
      }

      /* .msg-tools .msg-tools-btn.secondary перебивает глобальный .hidden по специфичности */
      .msg-tools .msg-tools-btn.hidden,
      .msg-tools .msg-tools-btn.secondary.hidden,
      .msg-tools .msg-tools-btn[hidden] {
        display: none !important;
      }

      .msg-tools-btn__icon {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        width: 18px;
        height: 18px;
        flex-shrink: 0;
        opacity: 0.9;
        transition: opacity 120ms ease, color 120ms ease;
      }

      .msg-tools-btn__icon svg {
        display: block;
      }

      .msg-tools-btn__label {
        white-space: nowrap;
      }

      .msg-tools-btn:hover,
      .msg-tools-btn:focus-visible {
        background: rgba(255, 255, 255, 0.06);
        color: var(--text);
        outline: none;
      }

      .msg-tools-btn:hover .msg-tools-btn__icon,
      .msg-tools-btn:focus-visible .msg-tools-btn__icon {
        opacity: 1;
      }

      [data-theme="light"] .msg-tools-btn:hover,
      [data-theme="light"] .msg-tools-btn:focus-visible {
        background: rgba(0, 0, 0, 0.05);
      }

      .msg-tools-btn--delete {
        color: color-mix(in srgb, var(--text) 90%, var(--muted));
      }

      .msg-tools-btn--delete .msg-tools-btn__icon {
        color: inherit;
        opacity: 0.9;
      }

      .msg-tools-btn--delete:hover,
      .msg-tools-btn--delete:focus-visible {
        background: rgba(255, 70, 70, 0.15);
        color: #ff6b6b;
      }

      .msg-tools-btn--delete:hover .msg-tools-btn__icon,
      .msg-tools-btn--delete:focus-visible .msg-tools-btn__icon {
        color: #ff6b6b;
        opacity: 1;
      }

      .msg-tools-btn--more {
        color: color-mix(in srgb, var(--muted) 70%, var(--text));
        opacity: 0.88;
      }

      .msg-tools-btn--more .msg-tools-btn__icon {
        opacity: 0.72;
      }

      .msg-tools-btn--more:hover,
      .msg-tools-btn--more:focus-visible {
        background: rgba(255, 255, 255, 0.04);
        color: color-mix(in srgb, var(--muted) 52%, var(--text));
        opacity: 1;
      }

      .msg-tools-btn--more:hover .msg-tools-btn__icon,
      .msg-tools-btn--more:focus-visible .msg-tools-btn__icon {
        opacity: 0.88;
      }

      [data-theme="light"] .msg-tools-btn--more:hover,
      [data-theme="light"] .msg-tools-btn--more:focus-visible {
        background: rgba(0, 0, 0, 0.04);
      }

      .msg-tools-btn--more[aria-expanded="true"] {
        background: rgba(255, 255, 255, 0.04);
        opacity: 1;
      }

      [data-theme="light"] .msg-tools-btn--more[aria-expanded="true"] {
        background: rgba(0, 0, 0, 0.04);
      }

      .msg-tools-btn:disabled {
        opacity: 0.45;
        pointer-events: none;
      }

      .msg-tools-more-menu {
        position: fixed;
        top: 0;
        left: 0;
        z-index: 120;
        display: flex;
        flex-direction: column;
        gap: 2px;
        min-width: 188px;
        padding: 6px;
        border-radius: 12px;
        border: 1px solid rgba(255, 255, 255, 0.08);
        background: rgba(22, 25, 30, 0.94);
        backdrop-filter: blur(14px);
        -webkit-backdrop-filter: blur(14px);
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.28);
        opacity: 0;
        transform: scale(0.96) translateY(-4px);
        transform-origin: top right;
        pointer-events: none;
        transition: opacity 120ms ease, transform 120ms ease;
      }

      .msg-tools-more-menu.msg-tools-more-menu--up {
        transform-origin: bottom right;
      }

      .msg-tools-more-menu.hidden {
        display: none !important;
      }

      .msg-tools-more-menu #msgToolsMoreForwardBtn {
        order: 1;
      }

      .msg-tools-more-menu #forwardMultiStartBtn {
        order: 2;
      }

      .msg-tools-more-menu #reportMessageBtn {
        order: 3;
      }

      .msg-tools-more-menu #msgToolsMoreCancelBtn {
        order: 4;
      }

      .msg-tools-more-menu .msg-tools-more-item.hidden {
        display: none !important;
      }

      [data-theme="light"] .msg-tools-more-menu {
        background: rgba(255, 255, 255, 0.96);
        border-color: rgba(0, 0, 0, 0.08);
        box-shadow: 0 12px 32px rgba(0, 0, 0, 0.1);
      }

      .msg-tools-more-menu:not(.hidden) {
        pointer-events: auto;
      }

      .msg-tools-more-menu.is-open {
        opacity: 1;
        transform: scale(1) translateY(0);
      }

      .msg-tools-more-menu .msg-tools-more-item {
        display: flex;
        flex-direction: row;
        align-items: center;
        justify-content: flex-start;
        gap: 10px;
        width: 100%;
        min-width: 0;
        padding: 10px 12px;
        border: none;
        border-radius: 8px;
        background: transparent;
        color: color-mix(in srgb, var(--text) 90%, var(--muted));
        font-size: 12px;
        font-weight: 500;
        line-height: 1.2;
        text-align: left;
        cursor: pointer;
        transition: background-color 120ms ease, color 120ms ease;
      }

      .msg-tools-more-menu .msg-tools-more-item:hover,
      .msg-tools-more-menu .msg-tools-more-item:focus-visible {
        background: rgba(255, 255, 255, 0.06);
        color: var(--text);
        outline: none;
      }

      [data-theme="light"] .msg-tools-more-menu .msg-tools-more-item:hover,
      [data-theme="light"] .msg-tools-more-menu .msg-tools-more-item:focus-visible {
        background: rgba(0, 0, 0, 0.05);
      }

      .msg-tools-more-menu .msg-tools-btn--delete:hover,
      .msg-tools-more-menu .msg-tools-btn--delete:focus-visible {
        background: rgba(255, 70, 70, 0.15);
        color: #ff6b6b;
      }

      .msg-tools--selection {
        gap: 6px;
        padding: 3px 6px;
      }

      @media (min-width: 921px) and (max-width: 1099px) {
        .msg-tools__primary > .msg-tools-btn .msg-tools-btn__label,
        .msg-tools-btn--more .msg-tools-btn__label {
          display: none;
        }

        .msg-tools__primary > .msg-tools-btn,
        .msg-tools-btn--more {
          padding: 8px;
        }
      }

      .msg-tools--selection .msg-tools-count {
        display: inline-flex;
        align-items: center;
        padding: 0 10px 0 4px;
        margin-right: 2px;
        border-right: 1px solid rgba(255, 255, 255, 0.08);
        font-size: 12px;
        font-weight: 600;
        color: var(--text);
        white-space: nowrap;
      }

      [data-theme="light"] .msg-tools--selection .msg-tools-count {
        border-right-color: rgba(0, 0, 0, 0.08);
      }
    }

    @media (min-width: 921px) {
      .olone-chat-header-menu-wrap {
        display: none;
      }
    }

    .header-actions {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .msg-tools {
      display: flex;
      align-items: center;
      gap: 6px;
      margin-right: 6px;
    }

    @media (max-width: 920px) {
      .msg-tools__primary,
      .msg-tools-more,
      .msg-tools__forward {
        display: contents;
      }

      #msgToolsMoreBtn,
      #msgToolsMoreForwardBtn,
      #msgToolsMoreCancelBtn {
        display: none !important;
      }

      #msgToolsMoreMenu {
        display: contents;
      }

      #msgToolsMoreMenu.hidden {
        display: contents !important;
      }

      #replyMessageBtn {
        order: 1;
      }

      #editMessageBtn {
        order: 2;
      }

      #deleteMessageBtn {
        order: 3;
      }

      #reportMessageBtn {
        order: 4;
      }

      #forwardMultiSendBtn {
        order: 5;
      }

      #forwardMultiDeleteBtn {
        order: 6;
      }

      #forwardMultiCancelBtn {
        order: 7;
      }

      #forwardMultiStartBtn {
        order: 8;
      }

      .msg-tools-btn__icon {
        display: none;
      }

      .msg-tools-btn {
        flex-direction: row;
        min-width: 0;
        gap: 0;
      }
    }

    .messages {
      overflow-y: auto;
      overflow-x: hidden;
      padding: 14px 10px 18px 14px;
      display: flex;
      flex-direction: column;
      gap: 12px;
      align-items: flex-start;
      position: relative;
      min-height: 0;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .messages::-webkit-scrollbar {
      width: 8px;
    }

    .messages::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .messages::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 4px;
    }

    .messages::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .bubble.out .meta {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: flex-end;
      gap: 4px 8px;
    }

    .meta-main {
      min-width: 0;
    }

    .msg-receipt {
      font-size: 13px;
      line-height: 1;
      letter-spacing: -0.06em;
      opacity: 1;
      user-select: none;
      flex-shrink: 0;
    }

    .msg-receipt--sent {
      color: var(--muted);
    }

    .msg-receipt--delivered {
      color: var(--muted);
    }

    .msg-receipt--read {
      color: #5eb0ff;
    }

    .friend-online-dot {
      width: 8px;
      height: 8px;
      border-radius: 50%;
      background: #2ecc71;
      box-shadow: 0 0 0 1px rgba(0, 0, 0, 0.35);
      flex-shrink: 0;
    }

    .friend-online-dot.is-offline {
      background: #5a6270;
      opacity: 0.65;
    }

    .friend-row-id {
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .gc-member-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-wrap: wrap;
    }

    .gc-member-main {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .gc-member-remove {
      flex: 0 0 auto;
      width: 32px;
      height: 32px;
      padding: 0;
      border-radius: 8px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--muted);
      font-size: 18px;
      line-height: 1;
      cursor: pointer;
    }

    .gc-member-remove:hover {
      color: var(--text);
      border-color: color-mix(in srgb, var(--text) 22%, var(--border));
    }

    .gc-owner-star {
      color: #e8c547;
      font-size: 14px;
      line-height: 1;
    }

    .panel-scroll::-webkit-scrollbar {
      width: 8px;
    }

    .panel-scroll::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .panel-scroll::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 4px;
    }

    .panel-scroll::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    #messageInput.composer-input::-webkit-scrollbar {
      width: 6px;
    }

    #messageInput.composer-input::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    #messageInput.composer-input::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 3px;
    }

    #messageInput.composer-input::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .bubble {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 0;
      max-width: min(720px, calc(100% - 8px));
      width: fit-content;
      min-width: 0;
      padding: 5px 10px 4px;
      border-radius: 10px;
      border: 1px solid var(--border);
      white-space: pre-wrap;
      word-break: break-word;
      overflow-wrap: anywhere;
      transition: background-color 240ms ease, border-color 240ms ease, color 240ms ease;
      cursor: pointer;
      box-sizing: border-box;
    }

    .msg-link {
      color: color-mix(in srgb, #6eb3ff 78%, var(--text));
      text-decoration: underline;
      text-underline-offset: 2px;
      word-break: break-all;
    }

    .msg-link:hover {
      color: color-mix(in srgb, #8cc2ff 92%, var(--text));
    }

    .text-context-menu {
      position: fixed;
      z-index: 5000;
      min-width: 220px;
      border: 1px solid var(--border);
      border-radius: 10px;
      background: var(--panel);
      box-shadow: 0 10px 26px var(--shadow);
      padding: 6px;
      display: grid;
      gap: 4px;
    }

    .text-context-menu:not(.text-context-menu--no-format) {
      min-width: min(360px, calc(100vw - 24px));
    }

    .text-context-btn {
      border: 1px solid transparent;
      border-radius: 8px;
      background: transparent;
      color: var(--text);
      font: inherit;
      font-size: 13px;
      text-align: left;
      padding: 7px 9px;
      cursor: pointer;
    }

    .text-context-btn:hover {
      background: color-mix(in srgb, var(--text) 8%, transparent);
      border-color: color-mix(in srgb, var(--text) 22%, transparent);
    }

    .text-context-sep {
      height: 1px;
      background: var(--border);
      margin: 2px 0;
    }

    .text-context-menu--no-format .text-context-format-block {
      display: none;
    }

    .text-context-format-row {
      display: flex;
      flex-wrap: nowrap;
      gap: 4px;
      align-items: stretch;
      overflow-x: auto;
      scrollbar-width: thin;
    }

    .text-context-format-row .text-context-btn {
      flex: 1 1 0;
      text-align: center;
      white-space: nowrap;
      font-size: 12px;
      padding: 6px 7px;
      min-width: 0;
    }

    .timeline-day-sep {
      width: 100%;
      display: flex;
      justify-content: center;
      margin: 2px 0 4px;
      pointer-events: none;
    }

    .timeline-day-sep span {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 24px;
      padding: 2px 10px;
      border-radius: 999px;
      font-size: 12px;
      color: var(--muted);
      background: color-mix(in srgb, var(--panel) 86%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
      box-shadow: 0 1px 3px var(--shadow);
      text-transform: lowercase;
    }

    .chat-history-loader {
      width: 100%;
      text-align: center;
      padding: 8px 12px;
      font-size: 12px;
      color: var(--muted);
      pointer-events: none;
    }

    .chat-history-loader.hidden {
      display: none;
    }

    .timeline-floating-day {
      position: absolute;
      top: 8px;
      left: 50%;
      transform: translateX(-50%) translateY(-4px);
      z-index: 4;
      opacity: 0;
      pointer-events: none;
      transition: opacity 160ms ease, transform 160ms ease;
    }

    .timeline-floating-day.is-visible {
      opacity: 1;
      transform: translateX(-50%) translateY(0);
    }

    .timeline-floating-day span {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 24px;
      padding: 2px 10px;
      border-radius: 999px;
      font-size: 12px;
      color: var(--muted);
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
      box-shadow: 0 1px 3px var(--shadow);
      text-transform: lowercase;
      backdrop-filter: blur(3px);
    }

    .bubble.selected {
      outline: 2px solid #7ea2ff;
      background: color-mix(in srgb, var(--bubble-in) 72%, #5b86ff 28%);
      box-shadow: 0 0 0 2px color-mix(in srgb, #7ea2ff 30%, transparent), 0 8px 22px rgba(44, 83, 180, 0.22);
      transform: translateY(-1px);
      transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    }

    .bubble.bubble--forward-selected {
      outline: 2px solid #3b82f6;
      box-shadow: 0 0 0 2px color-mix(in srgb, #3b82f6 22%, transparent);
    }

    .bubble.out {
      align-self: flex-end;
      margin-left: 0;
      background: var(--bubble-out);
    }

    .bubble.in {
      align-self: flex-start;
      margin-right: 0;
      background: var(--bubble-in);
    }

    .bubble.bubble--gc-system {
      align-self: center;
      max-width: min(520px, 94%);
      background: transparent;
      border: none;
      padding: 4px 8px;
      margin: 2px auto 10px;
    }

    .bubble.bubble--gc-system .gc-system-text {
      font-size: 12.5px;
      color: var(--muted);
      text-align: center;
      line-height: 1.4;
      width: 100%;
    }

    .bubble.bubble--has-media {
      max-width: min(548px, calc(100% - 8px));
      padding-left: 8px;
      padding-right: 8px;
    }

    .bubble-body {
      margin: 0;
      padding: 0;
      font-size: 16px;
      line-height: 1.35;
      max-width: 100%;
    }

    .bubble-body--invite {
      padding: 0;
    }

    .gc-invite-card {
      border: 1px solid color-mix(in srgb, #6eb3ff 50%, var(--border));
      background: color-mix(in srgb, #6eb3ff 10%, var(--panel));
      border-radius: 12px;
      padding: 12px 13px 11px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      width: min(430px, 100%);
      box-sizing: border-box;
    }

    .gc-invite-head {
      display: flex;
      align-items: center;
      gap: 8px;
      min-width: 0;
    }

    .gc-invite-icon {
      width: 28px;
      height: 28px;
      border-radius: 50%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      background: color-mix(in srgb, #6eb3ff 22%, transparent);
      color: color-mix(in srgb, #6eb3ff 75%, var(--text));
      flex-shrink: 0;
    }

    .gc-invite-icon svg {
      width: 18px;
      height: 18px;
      display: block;
    }

    .gc-invite-head-text {
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 3px;
    }

    .gc-invite-title {
      font-size: 15px;
      font-weight: 700;
      color: color-mix(in srgb, var(--text) 86%, #6eb3ff);
    }

    .gc-invite-sub {
      font-size: 13px;
      color: var(--muted);
      word-break: break-all;
    }

    .gc-invite-btn {
      align-self: flex-start;
      font-size: 13px;
      padding: 6px 12px;
    }

    .bubble.bubble--invite {
      padding-top: 1px;
      padding-bottom: 0;
    }

    .bubble.bubble--invite .meta {
      margin-top: 0;
    }

    .meta {
      margin: 3px 0 0;
      padding: 0;
      font-size: 12px;
      color: var(--muted);
      line-height: 1.25;
    }

    .reaction-row {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 4px;
      margin-top: 6px;
    }

    .channel-post .reaction-row.channel-reactions {
      max-width: 100%;
      align-self: flex-start;
    }

    .channel-post .channel-comments-bar {
      align-self: flex-start;
      max-width: 100%;
    }

    .reaction-chip {
      display: inline-flex;
      align-items: center;
      gap: 3px;
      font-size: 14px;
      line-height: 1;
      padding: 2px 7px 3px;
      border-radius: 999px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 88%, transparent);
      cursor: default;
    }

    .reaction-chip small {
      font-size: 11px;
      color: var(--muted);
    }

    .reaction-chip.mine {
      border-color: #8aa4ff;
      background: color-mix(in srgb, #8aa4ff 12%, var(--panel));
    }

    .reaction-add {
      width: 26px;
      height: 26px;
      border-radius: 999px;
      border: 1px dashed var(--border);
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      font-size: 16px;
      line-height: 1;
      padding: 0;
    }

    .messages.messages--reaction-add-collapse .bubble:not(.selected) .reaction-add {
      display: none;
    }

    .messages.messages--reaction-add-collapse .channel-post:not(.channel-post--selected) .reaction-add {
      display: none;
    }

    .reaction-add:hover {
      border-style: solid;
      color: var(--text);
    }

    .reaction-pop {
      box-sizing: border-box;
      position: fixed;
      z-index: 80;
      display: grid;
      grid-template-columns: repeat(4, 36px);
      grid-auto-rows: 36px;
      gap: 4px;
      padding: 8px 14px 8px 8px;
      width: fit-content;
      max-width: calc(100vw - 24px);
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--panel);
      box-shadow: 0 8px 28px rgba(0, 0, 0, 0.35);
      overflow-x: hidden;
    }

    /* До 8 смайлов (4×2) — без скролла */
    .reaction-pop--compact {
      overflow-y: hidden;
    }

    /* Больше смайлов — узкая полоска без белого трека */
    .reaction-pop--scroll {
      max-height: min(220px, 42vh);
      overflow-y: auto;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .reaction-pop--scroll::-webkit-scrollbar {
      width: 5px;
    }

    .reaction-pop--scroll::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .reaction-pop--scroll::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 8px;
    }

    .reaction-pop--scroll::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .reaction-pop button {
      font-size: 20px;
      line-height: 1;
      border: none;
      background: transparent;
      cursor: pointer;
      border-radius: 8px;
      padding: 0;
      width: 36px;
      height: 36px;
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .reaction-pop button:hover {
      background: color-mix(in srgb, var(--text) 8%, transparent);
    }

    .channel-post {
      display: inline-flex;
      flex-direction: column;
      align-items: flex-start;
      align-self: flex-start;
      max-width: min(720px, 100%);
      width: fit-content;
      min-width: 0;
      margin: 0 0 12px;
      padding: 10px 12px;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: var(--bubble-in);
      box-sizing: border-box;
    }

    .channel-post.channel-post--system {
      align-self: center;
      max-width: min(520px, 92%);
      text-align: center;
      background: color-mix(in srgb, var(--bubble-in) 88%, transparent);
      border-style: dashed;
      border-color: color-mix(in srgb, var(--border) 70%, transparent);
      padding: 8px 14px;
    }

    .channel-post-system-text {
      font-size: 13px;
      color: var(--muted);
      line-height: 1.45;
    }

    .channel-post.channel-post--selected {
      border-color: color-mix(in srgb, #7ea2ff 62%, var(--border));
      background: color-mix(in srgb, var(--bubble-in) 74%, #5b86ff 26%);
      box-shadow: 0 0 0 2px color-mix(in srgb, #7ea2ff 28%, transparent), 0 10px 24px rgba(44, 83, 180, 0.2);
      transform: translateY(-1px);
      transition: background 0.18s ease, box-shadow 0.18s ease, transform 0.18s ease;
    }

    .channel-post-head {
      font-size: 12px;
      color: var(--muted);
      margin-bottom: 6px;
    }

    .channel-post-head-row {
      display: flex;
      justify-content: flex-start;
      align-items: flex-start;
      flex-wrap: wrap;
      gap: 8px 14px;
      margin-bottom: 6px;
      width: fit-content;
      max-width: 100%;
      box-sizing: border-box;
    }

    .channel-post-head-left {
      flex: 0 1 auto;
      min-width: 0;
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
    }

    .channel-post-head-left .channel-post-head {
      margin-bottom: 0;
    }

    .channel-post-edit-btn {
      font-size: 12px;
      padding: 4px 10px;
      flex-shrink: 0;
      display: none;
      align-items: center;
      gap: 5px;
    }

    .channel-post.channel-post--selected .channel-post-edit-btn,
    .channel-post.channel-post--selected .ch-forward-post-btn {
      display: inline-flex;
    }

    .channel-post-edit-btn .ch-btn-icon {
      flex-shrink: 0;
      opacity: 0.9;
    }

    .channel-post-views {
      display: inline-flex;
      align-items: center;
      gap: 4px;
      font-size: 12px;
      color: var(--muted);
      flex-shrink: 0;
      white-space: nowrap;
      margin-left: auto;
    }

    .channel-post-views svg {
      opacity: 0.85;
    }

    .channel-post-body {
      display: flex;
      flex-direction: column;
      align-items: flex-start;
      gap: 8px;
      font-size: 16px;
      line-height: 1.4;
      max-width: 100%;
    }

    .channel-post-poll-host {
      margin-top: 10px;
    }

    .profile-gc-join-row {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
      margin-top: 12px;
    }

    .profile-gc-invite-input {
      flex: 1;
      min-width: 0;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--text);
      font: inherit;
    }

    .channel-post-text {
      white-space: pre-wrap;
      word-break: break-word;
      max-width: min(560px, 100%);
    }

    .channel-comments-bar {
      margin-top: 12px;
      padding-top: 10px;
      border-top: 1px solid var(--border);
      display: flex;
      justify-content: flex-start;
    }

    .ch-open-comments-btn {
      width: auto;
      display: inline-flex;
      align-items: center;
      gap: 8px;
      justify-content: center;
      font-weight: 600;
      padding: 7px 14px;
      border-radius: 999px;
      font-size: 13px;
    }

    .ch-open-comments-btn .ch-comment-icon {
      flex-shrink: 0;
      opacity: 0.9;
    }

    .channel-settings-access-badge {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      margin: 8px 0 12px;
      padding: 8px 12px;
      border-radius: 12px;
      font-size: 13px;
      font-weight: 600;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      background: color-mix(in srgb, var(--accent, #4a7cff) 8%, var(--panel));
      border: 1px solid color-mix(in srgb, var(--accent, #4a7cff) 16%, transparent);
    }

    .channel-settings-access-badge--private {
      color: color-mix(in srgb, #f59e0b 75%, var(--text));
      background: color-mix(in srgb, #f59e0b 10%, var(--panel));
      border-color: color-mix(in srgb, #f59e0b 22%, transparent);
    }

    .channel-settings-link-block.hidden {
      display: none;
    }

    .channel-settings-link-block {
      margin-top: 4px;
    }

    .channel-settings-link-row-inner {
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
      margin-top: 4px;
    }

    .channel-settings-link-code {
      flex: 1;
      min-width: 0;
      font-size: 12px;
      word-break: break-all;
      color: var(--text);
      background: color-mix(in srgb, var(--text) 6%, transparent);
      padding: 8px 10px;
      border-radius: 8px;
    }

    .channel-settings-copy-link-btn {
      padding: 6px 12px;
      font-size: 12px;
      flex-shrink: 0;
    }

    .chat-settings-sections {
      display: flex;
      gap: 8px;
      margin-bottom: 12px;
      flex-wrap: wrap;
    }

    .chat-settings-section-btn {
      display: inline-flex;
      align-items: center;
      gap: 8px;
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 7px 11px;
      background: var(--bg);
      color: var(--text);
      cursor: pointer;
      font-size: 13px;
      font-weight: 600;
    }

    .chat-settings-section-btn.is-active {
      border-color: color-mix(in srgb, #7c9dff 58%, var(--border));
      box-shadow: inset 0 0 0 1px color-mix(in srgb, #7c9dff 35%, transparent);
      background: color-mix(in srgb, var(--panel) 92%, transparent);
    }

    .chat-settings-sheet {
      display: none;
    }

    .chat-settings-sheet.is-active {
      display: block;
    }

    /* Фиксированный размер окна: не растёт от числа сообщений — скролл только в ленте */
    .modal.channel-comments-modal {
      width: min(520px, 94vw);
      height: min(72vh, 620px);
      max-height: min(72vh, 620px);
      padding: 0;
      display: flex;
      flex-direction: column;
      overflow: hidden;
      gap: 0;
      box-sizing: border-box;
    }

    .channel-comments-modal-header {
      flex-shrink: 0;
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      padding: 14px 14px 10px;
      border-bottom: 1px solid var(--border);
    }

    .channel-comments-modal-post-preview {
      margin-top: 4px;
      font-size: 14px;
      line-height: 1.45;
      color: var(--text);
      max-height: 4.35em;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 3;
      -webkit-box-orient: vertical;
      white-space: pre-wrap;
      word-break: break-word;
    }

    .channel-comments-modal-post-meta {
      margin-top: 6px;
      font-size: 12px;
      color: var(--muted);
    }

    .channel-comments-modal-thread {
      flex: 1 1 0;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      padding: 12px 14px;
      display: flex;
      flex-direction: column;
      gap: 10px;
      align-items: flex-start;
      background: color-mix(in srgb, var(--bg) 88%, transparent);
      -webkit-overflow-scrolling: touch;
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .channel-comments-modal-thread::-webkit-scrollbar {
      width: 8px;
    }

    .channel-comments-modal-thread::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .channel-comments-modal-thread::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 4px;
    }

    .channel-comments-modal-thread::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .channel-comments-modal-thread .bubble {
      cursor: default;
      max-width: min(92%, 420px);
    }

    .channel-comments-modal-thread .bubble.selected {
      outline: none;
    }

    .channel-comments-modal-composer {
      flex-shrink: 0;
      padding: 12px 14px 14px;
      border-top: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      gap: 8px;
      background: var(--panel);
      position: relative;
    }

    .channel-comments-modal-composer textarea {
      width: 100%;
      box-sizing: border-box;
      min-height: 44px;
      max-height: 160px;
      resize: vertical;
      font: inherit;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--bg);
      color: var(--text);
      scrollbar-width: thin;
      scrollbar-color: var(--scrollbar-thumb) var(--scrollbar-track);
    }

    .channel-comments-modal-composer textarea::-webkit-scrollbar {
      width: 6px;
    }

    .channel-comments-modal-composer textarea::-webkit-scrollbar-track {
      background: var(--scrollbar-track);
    }

    .channel-comments-modal-composer textarea::-webkit-scrollbar-thumb {
      background: var(--scrollbar-thumb);
      border-radius: 4px;
    }

    .channel-comments-modal-composer textarea::-webkit-scrollbar-thumb:hover {
      background: var(--scrollbar-thumb-hover);
    }

    .channel-comments-modal-composer-actions {
      display: flex;
      justify-content: flex-end;
      align-items: center;
      gap: 10px;
    }

    .channel-comments-modal-composer-actions .emoji-picker {
      /* В модалке комментариев поповер позиционируем относительно строки действий */
      position: absolute;
      right: 14px;
      bottom: calc(64px + env(safe-area-inset-bottom, 0px));
      z-index: 5;
    }

    .channel-comments-modal-locked {
      flex-shrink: 0;
      padding: 12px 14px 14px;
      border-top: 1px solid var(--border);
    }

    .create-channel-trigger-wrap {
      margin-bottom: 12px;
    }

    /* ПК: «Создать чат/канал» — во всю ширину вкладки */
    @media (min-width: 921px) {
      #profileTabPanelChannels .create-channel-open-btn,
      #profileTabPanelGroupChats .create-channel-open-btn {
        width: 100%;
      }
    }

    .create-channel-open-btn {
      width: 100%;
      justify-content: center;
      font-weight: 600;
    }

    .modal--create-channel {
      width: min(420px, 94vw);
      max-width: 100%;
    }

    .create-channel-modal-body {
      padding: 0 18px 18px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .create-ch-label {
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
      letter-spacing: 0.02em;
    }

    .create-channel-modal-body input[type="text"] {
      font: inherit;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--panel);
      color: var(--text);
      width: 100%;
      box-sizing: border-box;
    }

    .create-ch-toggle {
      display: flex;
      align-items: flex-start;
      gap: 10px;
      cursor: pointer;
      font-size: 14px;
      line-height: 1.45;
      margin-top: 4px;
    }

    .create-ch-toggle input {
      margin-top: 3px;
      flex-shrink: 0;
      width: 18px;
      height: 18px;
      accent-color: var(--invite-accent, #b8860b);
    }

    .create-ch-hint {
      margin: 0;
      font-size: 13px;
    }

    .channel-settings-btn {
      flex-shrink: 0;
    }

    .modal-backdrop--stack-top {
      z-index: 1300;
    }

    .modal-header-row--audit {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 8px;
      flex-wrap: nowrap;
    }

    .modal-header-row--audit .delete-title {
      flex: 1;
      text-align: center;
      min-width: 0;
      font-size: 1rem;
      margin: 0;
    }

    .channel-audit-back-btn {
      flex-shrink: 0;
      font-size: 13px;
      padding: 6px 12px;
    }

    .modal--channel-audit {
      width: min(480px, 96vw);
      max-width: 100%;
    }

    .modal--channel-audit .channel-audit-log {
      max-height: min(360px, 50vh);
    }

    .channel-open-audit-btn {
      width: 100%;
      justify-content: center;
      margin-top: 4px;
    }

    .channel-audit-modal-body {
      padding: 0 18px 18px;
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .channel-delete-wizard {
      margin-top: 16px;
      padding-top: 14px;
      border-top: 1px solid var(--border);
    }

    .channel-delete-start-btn {
      width: 100%;
      justify-content: center;
      border-color: rgba(220, 80, 80, 0.55);
      color: #e07070;
    }

    .channel-delete-warn {
      margin: 0 0 12px;
    }

    .channel-delete-title-hint {
      font-size: 14px;
      margin: 0 0 8px;
      word-break: break-word;
      color: var(--text);
    }

    .channel-delete-confirm-input {
      font: inherit;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--panel);
      color: var(--text);
      width: 100%;
      box-sizing: border-box;
      margin-bottom: 12px;
    }

    .channel-audit-log {
      max-height: min(260px, 42vh);
      overflow-y: auto;
      font-size: 13px;
      line-height: 1.45;
      color: var(--muted);
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--panel);
    }

    .channel-audit-line {
      margin-bottom: 10px;
      padding-bottom: 10px;
      border-bottom: 1px solid var(--border);
    }

    .channel-audit-line:last-child {
      margin-bottom: 0;
      padding-bottom: 0;
      border-bottom: none;
    }

    .channel-audit-line time {
      color: var(--text);
      font-weight: 500;
      display: block;
      margin-bottom: 4px;
    }

    .channel-audit-body {
      color: var(--muted);
    }

    .channel-audit-diff {
      color: var(--text);
      font-weight: 600;
    }

    .channel-edit-post-textarea {
      width: 100%;
      box-sizing: border-box;
      font: inherit;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: var(--panel);
      color: var(--text);
      resize: vertical;
      min-height: 140px;
    }

    .search-row-h {
      display: flex;
      flex-direction: row;
      align-items: stretch;
      gap: 10px;
      padding: 12px 14px;
      border-bottom: 1px solid var(--border);
      flex-wrap: nowrap;
    }

    .search-row-h input {
      flex: 1;
      min-width: 0;
    }

    .search-row-h:not(.olone-search-combo) .secondary {
      flex-shrink: 0;
      white-space: nowrap;
      padding-left: 16px;
      padding-right: 16px;
    }

    /* Поле поиска с лупой внутри (ПК и мобильная версия общая разметка) */
    .search-row-h.olone-search-combo {
      gap: 0;
      border-bottom: none;
    }

    .olone-search-field {
      position: relative;
      flex: 1;
      min-width: 0;
      display: flex;
      align-items: center;
      border-radius: 12px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel, #16181d) 92%, transparent);
      box-sizing: border-box;
      transition:
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        backdrop-filter 0.35s ease,
        background-color 0.2s ease;
    }

    .olone-search-field:focus-within {
      border-color: color-mix(in srgb, var(--muted, #7a8494) 45%, var(--border));
      box-shadow: 0 0 0 1px color-mix(in srgb, var(--muted) 22%, transparent);
    }

    .olone-search-field input[type="text"],
    .olone-search-field input[type="search"] {
      flex: 1;
      min-width: 0;
      margin: 0;
      padding: 10px 12px;
      padding-right: 48px;
      border: none !important;
      border-radius: 11px;
      background: transparent;
      font: inherit;
      font-size: 14px;
      color: var(--text);
      box-sizing: border-box;
    }

    .olone-search-field input[type="search"]::-webkit-search-cancel-button {
      -webkit-appearance: none;
      appearance: none;
      width: 16px;
      height: 16px;
      cursor: pointer;
      opacity: 0.72;
    }

    .olone-search-field:has(.olone-search-submit) input[type="search"]::-webkit-search-cancel-button {
      margin-right: 40px;
    }

    button.olone-search-clear {
      position: absolute;
      right: 14px;
      top: 50%;
      transform: translateY(-50%);
      box-sizing: border-box;
      width: 28px;
      height: 28px;
      min-width: 28px;
      padding: 0;
      margin: 0;
      border: none;
      border-radius: 8px;
      background: transparent;
      color: var(--muted);
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      flex-shrink: 0;
      z-index: 1;
      transition:
        background-color 0.2s ease,
        color 0.2s ease;
    }

    button.olone-search-clear:hover {
      color: var(--text);
      background: color-mix(in srgb, var(--muted) 12%, transparent);
    }

    button.olone-search-clear:active {
      transform: translateY(-50%) scale(0.94);
    }

    button.olone-search-clear.hidden {
      display: none;
    }

    button.olone-search-clear svg {
      width: 16px;
      height: 16px;
      display: block;
      pointer-events: none;
    }

    button.olone-search-submit {
      position: absolute;
      right: 5px;
      top: 50%;
      transform: translateY(-50%);
      box-sizing: border-box;
      width: 38px;
      height: 36px;
      min-width: 38px;
      padding: 0;
      margin: 0;
      border: none !important;
      border-radius: 10px;
      background: transparent;
      color: var(--muted);
      font-size: 0 !important;
      line-height: 0;
      cursor: pointer;
      display: inline-flex;
      align-items: center;
      justify-content: center;
      transition:
        background-color 0.2s ease,
        color 0.2s ease,
        backdrop-filter 0.35s ease;
    }

    button.olone-search-submit:hover {
      color: var(--text);
      background: color-mix(in srgb, var(--muted) 12%, transparent);
    }

    button.olone-search-submit::after {
      content: "";
      display: block;
      width: 20px;
      height: 20px;
      background-repeat: no-repeat;
      background-position: center;
      background-size: 20px;
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7' stroke='%2399a3b8' stroke-width='2'/%3E%3Cpath stroke='%2399a3b8' stroke-width='2' stroke-linecap='round' d='m20 20-4.3-4.3'/%3E%3C/svg%3E");
    }

    html[data-theme="light"] button.olone-search-submit::after {
      background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='none' viewBox='0 0 24 24'%3E%3Ccircle cx='11' cy='11' r='7' stroke='%23475569' stroke-width='2'/%3E%3Cpath stroke='%23475569' stroke-width='2' stroke-linecap='round' d='m20 20-4.3-4.3'/%3E%3C/svg%3E");
    }

    .search-mode-panel.hidden {
      display: none;
    }

    .channel-search-results {
      margin-top: 8px;
      max-height: min(480px, 52vh);
      overflow-y: auto;
      padding-right: 2px;
    }

    .channel-search-row {
      width: 100%;
      text-align: left;
      padding: 10px 12px;
      margin-bottom: 8px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
      cursor: pointer;
      font: inherit;
      box-sizing: border-box;
    }

    .channel-search-row:hover {
      border-color: color-mix(in srgb, var(--text) 35%, var(--border));
    }

    .channel-search-row-title {
      font-weight: 600;
      font-size: 15px;
    }

    .channel-search-row-meta {
      font-size: 12px;
      color: var(--muted);
      margin-top: 4px;
    }

    .channel-search-status {
      padding: 12px 4px;
      color: var(--muted);
      font-size: 14px;
      margin: 0;
    }



    .channel-header-subscribe {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-shrink: 0;
    }

    .channel-header-subscribe.hidden {
      display: none;
    }

    .profile-card-wrap .profile-card {
      margin: 0;
    }

    .profile-card {
      margin: 12px;
      border: 1px solid var(--border);
      border-radius: 12px;
      padding: 12px;
      display: grid;
      gap: 8px;
      align-content: start;
      min-height: 180px;
    }

    .profile-card .profile-actions {
      display: flex;
      flex-direction: row;
      flex-wrap: wrap;
      align-items: center;
      gap: 8px;
    }

    .profile-card.peer-search-card {
      margin: 0;
      min-height: 0;
      padding: 10px 12px;
      display: flex;
      flex-direction: column;
      gap: 0;
      cursor: default;
    }

    .peer-search-card-row {
      display: flex;
      align-items: center;
      gap: 10px;
      min-width: 0;
    }

    .peer-search-card-hit {
      flex: 1 1 auto;
      min-width: 0;
      display: flex;
      align-items: center;
      gap: 12px;
      padding: 4px 6px;
      margin: -4px -6px;
      border: none;
      border-radius: 12px;
      background: transparent;
      color: inherit;
      font: inherit;
      text-align: left;
      cursor: pointer;
      transition: background 0.18s ease, box-shadow 0.18s ease;
    }

    .peer-search-card-hit:hover,
    .peer-search-card-hit:focus-visible {
      background: color-mix(in srgb, var(--text, #e8eaef) 7%, transparent);
      outline: none;
      box-shadow: inset 0 0 0 1px color-mix(in srgb, var(--border, #383c48) 55%, transparent);
    }

    .peer-search-card-avatar {
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      font-weight: 700;
      flex-shrink: 0;
      overflow: hidden;
      background: color-mix(in srgb, var(--panel, #15171c) 70%, var(--bg, #0c0d10));
    }

    .peer-search-card-avatar .rail-avatar-img:not(.olone-user-avatar-fallback-active) {
      width: 100%;
      height: 100%;
      object-fit: cover;
    }

    .peer-search-card-meta {
      min-width: 0;
      flex: 1;
    }

    .peer-search-card-name {
      font-weight: 700;
      font-size: 15px;
      line-height: 1.25;
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .peer-search-card-handle,
    .peer-search-card-id,
    .peer-search-card-sub {
      font-size: 12px;
      color: var(--muted, #7a8494);
      overflow: hidden;
      text-overflow: ellipsis;
      white-space: nowrap;
    }

    .peer-search-card-actions {
      flex: 0 0 auto;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    .peer-search-card-actions .primary,
    .peer-search-card-actions .secondary {
      cursor: pointer;
      transition: background 0.18s ease, border-color 0.18s ease, transform 0.18s ease;
      white-space: nowrap;
    }

    .peer-search-card-actions .primary:hover,
    .peer-search-card-actions .secondary:hover {
      transform: translateY(-1px);
    }

    .peer-search-card-actions .status {
      font-size: 12px;
      color: var(--muted, #7a8494);
      white-space: nowrap;
    }

    .peer-search-card-status {
      margin-top: 8px;
      font-size: 12px;
      color: var(--muted, #7a8494);
    }

    .peer-search-card-state {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-height: 34px;
      padding: 0 12px;
      border-radius: 10px;
      font-size: 13px;
      font-weight: 600;
      white-space: nowrap;
      border: 1px solid color-mix(in srgb, var(--border, #383c48) 80%, transparent);
      background: color-mix(in srgb, var(--panel, #15171c) 55%, transparent);
      color: var(--muted, #7a8494);
    }

    .peer-search-card-state--friend {
      color: var(--text, #e8eaef);
      border-color: color-mix(in srgb, var(--accent, #4a7cff) 35%, var(--border, #383c48));
      background: color-mix(in srgb, var(--accent, #4a7cff) 12%, var(--panel, #15171c));
    }

    .peer-search-card-state--pending {
      cursor: default;
    }

    .peer-search-card--busy .peer-search-card-actions button.is-loading {
      opacity: 0.72;
      pointer-events: none;
    }

    .icon-btn {
      width: 40px;
      height: 36px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: transparent;
      color: var(--text);
      cursor: pointer;
      font-weight: 700;
    }

    .icon-btn.active-mail {
      background: var(--text);
      color: var(--panel);
      border-color: var(--text);
    }

    .icon-btn.inactive-mail {
      background: #2a2f37;
      color: #6d7683;
      border-color: #3a434f;
      cursor: not-allowed;
      opacity: 0.95;
    }

    .empty-chat {
      position: absolute;
      inset: 0;
      display: grid;
      place-items: center;
      color: var(--muted);
      font-size: 18px;
      text-align: center;
      padding: 20px;
    }

    .toast {
      position: fixed;
      left: 50%;
      right: auto;
      bottom: auto;
      top: max(16px, env(safe-area-inset-top, 0px));
      transform: translateX(-50%);
      z-index: 20000;
      min-width: 260px;
      max-width: min(360px, calc(100vw - 32px));
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--panel);
      box-shadow: 0 14px 30px var(--shadow);
      padding: 12px 16px;
      display: grid;
      gap: 8px;
      text-align: center;
      pointer-events: none;
    }

    .toast:not(.hidden) {
      pointer-events: auto;
    }

    #toastActions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      justify-content: center;
    }

    .modal-backdrop {
      position: fixed;
      inset: 0;
      background: rgba(0, 0, 0, 0.45);
      display: grid;
      place-items: center;
      z-index: 1200;
      padding: 20px;
      box-sizing: border-box;
    }

    .modal-backdrop--glass {
      background: rgba(15, 18, 23, 0.42);
      backdrop-filter: blur(14px);
      -webkit-backdrop-filter: blur(14px);
    }

    /* Экран входа (app-guest) перекрывает модалки с z-index:1200 — поднимаем их выше pre-chat-wrap (2500). */
    body.app-guest .modal-backdrop:not(.hidden) {
      z-index: 5100;
    }

    [data-theme="light"] .modal-backdrop--glass {
      background: rgba(54, 66, 82, 0.26);
    }

    .modal {
      width: min(420px, 92vw);
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--panel);
      box-shadow: 0 16px 40px var(--shadow);
      padding: 14px;
      display: grid;
      gap: 10px;
    }

    /* Перекрываем общий .modal: опрос — колонка, без внешних отступов (скролл + футер). */
    .modal.modal--poll-compose {
      padding: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .modal--settings {
      width: min(500px, 94vw);
      max-height: min(640px, 88vh);
      padding: 18px 18px 16px;
      display: flex;
      flex-direction: column;
      min-height: 0;
      overflow: hidden;
      box-sizing: border-box;
    }

    .settings-theme-toggle-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 12px;
      flex-wrap: wrap;
      margin-top: 8px;
    }

    .settings-theme-toggle-label {
      font-size: 14px;
      font-weight: 600;
      color: var(--text);
      line-height: 1.35;
      min-width: 0;
    }

    .premium-messenger-settings {
      padding-top: 0;
      margin-top: 0;
      border-top: none;
    }

    .premium-sheet-lead {
      margin: 0;
      font-size: 13px;
      line-height: 1.5;
      color: var(--muted);
    }

    .premium-sheet-lead strong {
      font-weight: 800;
      color: var(--text);
    }

    .premium-nickname-field {
      display: flex;
      align-items: center;
      gap: 8px;
      padding: 0 14px 0 12px;
      min-height: 48px;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, #c9a227 28%, var(--border));
      background: color-mix(in srgb, var(--bg) 72%, #c9a227 3%);
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent),
        0 1px 0 color-mix(in srgb, #000 10%, transparent);
      transition:
        border-color 0.15s ease,
        box-shadow 0.15s ease;
    }

    .settings-v37-group--premium .premium-nickname-field {
      border-color: color-mix(in srgb, #c9a227 38%, var(--border));
      background:
        linear-gradient(165deg, color-mix(in srgb, #c9a227 6%, var(--bg)), color-mix(in srgb, var(--bg) 90%, transparent));
    }

    .premium-nickname-field:focus-within {
      border-color: color-mix(in srgb, #c9a227 52%, var(--border));
      box-shadow:
        0 0 0 3px color-mix(in srgb, #c9a227 18%, transparent),
        0 1px 0 color-mix(in srgb, #fff 10%, transparent) inset;
    }

    .premium-nickname-at {
      flex-shrink: 0;
      font-size: 17px;
      font-weight: 800;
      color: color-mix(in srgb, #c9a227 92%, var(--muted));
      user-select: none;
      line-height: 1;
      padding-bottom: 1px;
    }

    .premium-nickname-input {
      flex: 1;
      min-width: 0;
      border: none;
      outline: none;
      background: transparent;
      color: var(--text);
      font-size: 15px;
      font-weight: 650;
      line-height: 1.25;
      padding: 12px 0;
      resize: none;
      height: 46px;
      box-sizing: border-box;
    }

    .premium-nickname-count {
      flex-shrink: 0;
      font-size: 11px;
      font-weight: 700;
      font-variant-numeric: tabular-nums;
      letter-spacing: 0.03em;
      color: var(--muted);
      white-space: nowrap;
    }

    .password-settings-lead {
      margin: 0;
      font-size: 13px;
      line-height: 1.48;
      color: var(--muted);
    }

    .password-settings-lead strong {
      font-weight: 800;
      color: var(--text);
    }

    .password-change-card {
      padding: 14px;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
      background: color-mix(in srgb, var(--panel) 95%, transparent);
      display: grid;
      gap: 12px;
    }

    .password-change-field-label {
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: var(--muted);
    }

    .password-change-input {
      width: 100%;
      box-sizing: border-box;
      padding: 11px 12px;
      border-radius: 11px;
      border: 1px solid color-mix(in srgb, var(--border) 85%, transparent);
      background: color-mix(in srgb, var(--bg) 90%, transparent);
      color: var(--text);
      font-size: 14px;
      font-family: inherit;
      outline: none;
      transition:
        border-color 0.12s ease,
        box-shadow 0.12s ease;
    }

    .password-change-input:focus {
      border-color: color-mix(in srgb, #5a91ff 45%, var(--border));
      box-shadow: 0 0 0 3px color-mix(in srgb, #5a91ff 15%, transparent);
    }

    .password-change-submit-wrap .sessions-btn {
      width: 100%;
      margin-top: 2px;
    }

    .sessions-settings-section {
      padding-top: 0;
      margin-top: 0;
      border-top: none;
    }

    .sessions-sheet-lead {
      margin: 0;
      font-size: 13px;
      line-height: 1.45;
      color: var(--muted);
    }

    .sessions-sheet-actions {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .sessions-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      gap: 10px;
      width: 100%;
      border: none;
      border-radius: 12px;
      padding: 11px 14px;
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
      transition: transform 0.06s ease, filter 0.15s ease, box-shadow 0.15s ease;
    }

    .sessions-btn:active {
      transform: translateY(1px);
    }

    .sessions-btn__icon {
      flex-shrink: 0;
      display: grid;
      place-items: center;
      opacity: 0.95;
    }

    .sessions-btn__icon svg {
      width: 20px;
      height: 20px;
      stroke: currentColor;
      fill: none;
      display: block;
    }

    .sessions-btn--primary {
      color: #f4f8ff;
      background: linear-gradient(135deg, #4d6efb 0%, #7ea2ff 48%, #5a91ff 100%);
      box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.12) inset,
        0 10px 28px rgba(70, 110, 255, 0.28);
    }

    .sessions-btn--primary:hover {
      filter: brightness(1.05);
      box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.16) inset,
        0 12px 32px rgba(70, 110, 255, 0.36);
    }

    .sessions-btn--danger-soft {
      color: #ffc9c9;
      background: color-mix(in srgb, #f43f5e 14%, transparent);
      border: 1px solid color-mix(in srgb, #f43f5e 42%, transparent);
      box-shadow: none;
      font-weight: 650;
    }

    .sessions-btn--danger-soft:hover {
      background: color-mix(in srgb, #f43f5e 22%, transparent);
      color: #ffe4e8;
    }

    [data-theme="light"] .sessions-btn--primary {
      color: #fff;
      box-shadow:
        0 0 0 1px rgba(255, 255, 255, 0.35) inset,
        0 8px 22px rgba(70, 110, 255, 0.22);
    }

    [data-theme="light"] .sessions-btn--danger-soft {
      color: #991b1b;
      border-color: color-mix(in srgb, #f43f5e 55%, transparent);
      background: color-mix(in srgb, #fecaca 72%, transparent);
    }

    [data-theme="light"] .sessions-btn--danger-soft:hover {
      background: color-mix(in srgb, #fca5a5 82%, transparent);
      color: #7f1d1d;
    }

    .sessions-detail-stack {
      margin-top: 14px;
      display: grid;
      gap: 12px;
    }

    .sessions-list {
      display: grid;
      gap: 10px;
      margin-top: 0;
      max-height: min(52vh, 320px);
      overflow: auto;
      padding: 10px;
      border-radius: 14px;
      background: color-mix(in srgb, var(--bg) 92%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 65%, transparent);
    }

    [data-theme="light"] .sessions-list {
      background: color-mix(in srgb, var(--panel) 88%, white);
    }

    .sessions-list-state {
      text-align: center;
      padding: 18px 10px;
      font-size: 13px;
      color: var(--muted);
      line-height: 1.45;
    }

    .sessions-list-error {
      color: #ff9f9f;
    }

    [data-theme="light"] .sessions-list-error {
      color: #dc2626;
    }

    .session-card {
      border-radius: 12px;
      padding: 12px;
      background: color-mix(in srgb, var(--panel) 94%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
      display: grid;
      gap: 10px;
      box-shadow: 0 1px 0 color-mix(in srgb, #fff 6%, transparent) inset;
    }

    .session-card--current {
      border-color: color-mix(in srgb, #2cb67d 45%, var(--border));
      box-shadow:
        0 0 0 1px color-mix(in srgb, #2cb67d 22%, transparent) inset,
        0 8px 20px rgba(44, 182, 125, 0.12);
    }

    [data-theme="light"] .session-card--current {
      box-shadow:
        0 0 0 1px color-mix(in srgb, #16a34a 25%, transparent) inset,
        0 6px 16px rgba(22, 163, 74, 0.1);
    }

    .session-card__top {
      display: flex;
      align-items: flex-start;
      gap: 11px;
    }

    .session-card__glyph {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      color: var(--accent-soft, #aeb9ff);
      background: linear-gradient(
        160deg,
        color-mix(in srgb, #5a91ff 24%, transparent),
        color-mix(in srgb, var(--panel) 94%, transparent)
      );
      border: 1px solid color-mix(in srgb, var(--border) 80%, transparent);
    }

    .session-card__glyph svg {
      width: 22px;
      height: 22px;
      stroke: currentColor;
      fill: none;
    }

    .session-card__titles {
      flex: 1;
      min-width: 0;
    }

    .session-card__browser {
      font-size: 14px;
      font-weight: 750;
      color: var(--text);
      letter-spacing: 0.01em;
    }

    .session-card__os {
      margin-top: 2px;
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
    }

    .session-current-chip {
      flex-shrink: 0;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0.04em;
      text-transform: uppercase;
      color: #c8fde3;
      border: none;
      border-radius: 999px;
      padding: 4px 10px;
      white-space: nowrap;
      background: linear-gradient(
        135deg,
        color-mix(in srgb, #059669 82%, transparent),
        color-mix(in srgb, #047857 78%, transparent)
      );
      box-shadow: 0 0 0 1px color-mix(in srgb, #6ee7c5 42%, transparent) inset;
    }

    [data-theme="light"] .session-current-chip {
      color: #fff;
      background: linear-gradient(135deg, #16a34a, #22c55e);
      box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.35) inset;
    }

    .session-card__facts {
      display: grid;
      grid-template-columns: auto minmax(0, 1fr);
      gap: 4px 12px;
      margin: 0;
      padding: 0;
      font-size: 11px;
    }

    .session-card__facts dt {
      margin: 0;
      color: var(--muted);
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 0.05em;
    }

    .session-card__facts dd {
      margin: 0;
      color: var(--text);
      font-weight: 600;
      line-height: 1.35;
      word-break: break-word;
    }

    .session-card__kick {
      margin-top: 2px;
      width: 100%;
    }

    .session-card__kick.settings-btn-plain {
      background: color-mix(in srgb, var(--panel) 92%, transparent);
      border-radius: 10px;
    }

    .settings-section-title {
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.1em;
      text-transform: uppercase;
      color: var(--muted);
      margin: 0 0 10px;
    }

    .settings-section {
      display: grid;
      gap: 12px;
    }

    .settings-subsection-title {
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
      margin: 0 0 6px;
      letter-spacing: 0;
      text-transform: none;
    }

    /* —— Settings V37 unified sheets —— */
    .settings-v37-sheet {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .settings-v37-sheet-header {
      display: flex;
      flex-direction: column;
      gap: 6px;
      margin: 0;
      padding: 0;
    }

    .settings-v37-sheet-header__title {
      margin: 0;
      font-size: 17px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: var(--text);
      line-height: 1.25;
    }

    .settings-v37-sheet-header__lead,
    .ui-display-settings-lead,
    .privacy-settings-lead,
    .sessions-sheet-lead,
    .password-settings-lead,
    .premium-sheet-lead {
      margin: 0;
      font-size: 13px;
      line-height: 1.5;
      color: var(--muted);
    }

    .settings-v37-stack,
    .privacy-consent-stack {
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .settings-v37-group,
    .privacy-consent-card {
      border: 1px solid color-mix(in srgb, var(--border) 82%, transparent);
      border-radius: 14px;
      padding: 0;
      background:
        linear-gradient(165deg, color-mix(in srgb, var(--panel) 96%, #fff 4%), color-mix(in srgb, var(--panel) 88%, var(--bg) 12%));
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 7%, transparent),
        0 1px 0 color-mix(in srgb, #000 12%, transparent);
      overflow: hidden;
    }

    [data-theme="light"] .settings-v37-group,
    [data-theme="light"] .privacy-consent-card {
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.55),
        0 1px 2px color-mix(in srgb, #000 6%, transparent);
    }

    .settings-v37-row {
      display: flex;
      align-items: center;
      justify-content: space-between;
      gap: 16px;
      min-height: 72px;
      padding: 14px 16px;
      border-top: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
    }

    .settings-v37-group > .settings-v37-row:first-child,
    .privacy-consent-card > .settings-v37-row:first-child,
    .privacy-consent-card > .privacy-consent-card__title:first-child {
      border-top: none;
    }

    .settings-v37-row__copy {
      flex: 1 1 auto;
      min-width: 0;
    }

    .settings-v37-row__title,
    .privacy-consent-card__title {
      margin: 0;
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.3;
      display: flex;
      align-items: center;
      flex-wrap: wrap;
    }

    .settings-v37-row__hint,
    .privacy-consent-card__hint {
      margin: 5px 0 0;
      font-size: 12px;
      line-height: 1.42;
      color: var(--muted);
    }

    .settings-v37-row--action {
      min-height: 72px;
    }

    .settings-v37-switch {
      position: relative;
      display: inline-flex;
      flex: 0 0 auto;
      align-items: center;
      width: 46px;
      height: 28px;
      cursor: pointer;
      user-select: none;
    }

    .settings-v37-switch input {
      position: absolute;
      inset: 0;
      width: 100%;
      height: 100%;
      margin: 0;
      opacity: 0;
      cursor: pointer;
      z-index: 1;
    }

    .settings-v37-switch input:disabled {
      cursor: not-allowed;
    }

    .settings-v37-switch__track {
      position: relative;
      display: block;
      width: 46px;
      height: 28px;
      border-radius: 999px;
      background: color-mix(in srgb, var(--muted) 38%, var(--panel));
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
      box-shadow: inset 0 1px 2px color-mix(in srgb, #000 18%, transparent);
      transition:
        background 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease;
      pointer-events: none;
    }

    .settings-v37-switch__track::after {
      content: "";
      position: absolute;
      top: 3px;
      left: 3px;
      width: 22px;
      height: 22px;
      border-radius: 50%;
      background: linear-gradient(180deg, #fff 0%, color-mix(in srgb, #fff 82%, var(--panel) 18%) 100%);
      box-shadow:
        0 1px 3px color-mix(in srgb, #000 28%, transparent),
        0 0 0 1px color-mix(in srgb, #000 8%, transparent);
      transition: transform 0.2s ease;
    }

    .settings-v37-switch:hover .settings-v37-switch__track {
      border-color: color-mix(in srgb, var(--accent) 35%, var(--border));
      background: color-mix(in srgb, var(--muted) 32%, var(--panel));
    }

    .settings-v37-switch input:checked + .settings-v37-switch__track {
      background: color-mix(in srgb, var(--accent) 78%, #1a3a8a 22%);
      border-color: color-mix(in srgb, var(--accent) 55%, transparent);
      box-shadow:
        inset 0 1px 2px color-mix(in srgb, #000 12%, transparent),
        0 0 12px color-mix(in srgb, var(--accent) 28%, transparent);
    }

    .settings-v37-switch input:checked + .settings-v37-switch__track::after {
      transform: translateX(18px);
    }

    .settings-v37-switch input:active:not(:disabled) + .settings-v37-switch__track::after {
      width: 24px;
    }

    .settings-v37-switch input:checked:active:not(:disabled) + .settings-v37-switch__track::after {
      transform: translateX(16px);
    }

    .settings-v37-switch input:disabled + .settings-v37-switch__track {
      opacity: 0.48;
      filter: grayscale(0.15);
    }

    .settings-v37-switch input:focus-visible + .settings-v37-switch__track {
      outline: 2px solid color-mix(in srgb, var(--accent) 55%, transparent);
      outline-offset: 2px;
    }

    .settings-v37-btn,
    .settings-theme-toggle-row .sessions-btn {
      flex: 0 0 auto;
      min-height: 36px;
      padding: 8px 14px;
      border-radius: 10px;
      border: 1px solid color-mix(in srgb, var(--accent) 42%, var(--border));
      background: color-mix(in srgb, var(--accent) 14%, var(--panel));
      color: var(--text);
      font-size: 13px;
      font-weight: 700;
      cursor: pointer;
      transition:
        background 0.18s ease,
        border-color 0.18s ease,
        transform 0.12s ease;
      white-space: nowrap;
    }

    .settings-v37-btn:hover,
    .settings-theme-toggle-row .sessions-btn:hover {
      background: color-mix(in srgb, var(--accent) 22%, var(--panel));
      border-color: color-mix(in srgb, var(--accent) 55%, var(--border));
    }

    .settings-v37-btn:active,
    .settings-theme-toggle-row .sessions-btn:active {
      transform: translateY(0);
    }

    .settings-hub-item-btn:active {
      transform: translateY(0);
    }

    .settings-v37-btn:disabled {
      opacity: 0.5;
      cursor: not-allowed;
    }

    .settings-v37-btn--block {
      width: 100%;
      display: inline-flex;
      align-items: center;
      justify-content: center;
    }

    .settings-v37-btn--primary {
      border-color: color-mix(in srgb, var(--accent) 48%, var(--border));
      background: color-mix(in srgb, var(--accent) 18%, var(--panel));
    }

    .settings-v37-btn--gold {
      border-color: color-mix(in srgb, #c9a227 50%, var(--border));
      background: color-mix(in srgb, #c9a227 16%, var(--panel));
      color: #f0e2b8;
    }

    [data-theme="light"] .settings-v37-btn--gold {
      color: #6b5418;
    }

    .settings-v37-btn--gold:hover {
      background: color-mix(in srgb, #c9a227 24%, var(--panel));
      border-color: color-mix(in srgb, #c9a227 62%, var(--border));
    }

    .settings-v37-btn--danger {
      border-color: color-mix(in srgb, #e85d6c 48%, var(--border));
      background: color-mix(in srgb, #e85d6c 14%, var(--panel));
      color: #ffb8c0;
    }

    [data-theme="light"] .settings-v37-btn--danger {
      color: #8a2430;
    }

    .settings-v37-btn--danger:hover {
      background: color-mix(in srgb, #e85d6c 22%, var(--panel));
    }

    .settings-v37-btn--danger-soft {
      border-color: color-mix(in srgb, #e85d6c 35%, var(--border));
      background: color-mix(in srgb, #e85d6c 8%, var(--panel));
      color: var(--text);
    }

    .settings-v37-actions {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }

    .settings-v37-group--pad {
      padding: 14px 16px;
      display: flex;
      flex-direction: column;
      gap: 10px;
    }

    .settings-v37-group-label {
      margin: 0;
      font-size: 14px;
      font-weight: 700;
      color: var(--text);
      line-height: 1.3;
    }

    .settings-v37-field-label {
      font-size: 12px;
      font-weight: 600;
      color: var(--muted);
      margin: 0;
    }

    .settings-v37-row__chip {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      min-width: 28px;
      height: 22px;
      padding: 0 7px;
      margin-right: 8px;
      border-radius: 7px;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.04em;
      vertical-align: middle;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      background: color-mix(in srgb, var(--muted) 16%, var(--panel));
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    }

    .settings-v37-row__chip--premium {
      color: #e8c96a;
      background: color-mix(in srgb, #c9a227 14%, var(--panel));
      border-color: color-mix(in srgb, #c9a227 35%, transparent);
    }

    .settings-v37-empty--hint {
      text-align: left;
      border-style: solid;
      border-color: color-mix(in srgb, var(--border) 75%, transparent);
      color: var(--text);
      font-size: 13px;
    }

    .settings-v37-empty {
      border: 1px dashed color-mix(in srgb, var(--border) 85%, transparent);
      border-radius: 14px;
      padding: 18px 16px;
      text-align: center;
      font-size: 13px;
      line-height: 1.5;
      color: var(--muted);
      background: color-mix(in srgb, var(--panel) 72%, transparent);
    }

    .settings-v37-empty__icon {
      display: block;
      margin: 0;
      width: 28px;
      height: 28px;
      opacity: 0.85;
      color: currentColor;
    }

    /* —— Settings V38 visual polish —— */
    .settings-v37-theme-state-hint {
      margin-top: 6px;
      font-weight: 600;
      color: var(--text);
    }

    .settings-v37-hint--flush {
      margin: 0;
    }

    .settings-v37-hint--note {
      margin: 0 2px;
    }

    .settings-v37-section {
      display: flex;
      flex-direction: column;
      gap: 8px;
    }

    .settings-v37-section__head {
      display: flex;
      flex-direction: column;
      gap: 4px;
    }

    .settings-v37-group--premium {
      position: relative;
      border-color: color-mix(in srgb, #c9a227 34%, var(--border));
      background:
        radial-gradient(ellipse 120% 80% at 12% -30%, color-mix(in srgb, #c9a227 14%, transparent), transparent 55%),
        linear-gradient(165deg, color-mix(in srgb, var(--panel) 94%, #c9a227 3%), color-mix(in srgb, var(--panel) 88%, var(--bg) 12%));
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 8%, transparent),
        0 1px 0 color-mix(in srgb, #000 10%, transparent),
        0 8px 24px color-mix(in srgb, #c9a227 8%, transparent);
    }

    [data-theme="light"] .settings-v37-group--premium {
      box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.6),
        0 1px 2px color-mix(in srgb, #c9a227 12%, transparent);
    }

    .settings-v37-premium-badge {
      align-self: flex-start;
      display: inline-flex;
      align-items: center;
      min-height: 22px;
      padding: 0 9px;
      border-radius: 999px;
      font-size: 10px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      color: #f0e2b8;
      background: linear-gradient(135deg, color-mix(in srgb, #e8cf4a 88%, #c9a227), color-mix(in srgb, #c9a227 90%, #a67c00));
      border: 1px solid color-mix(in srgb, #fff 22%, #c9a227);
      box-shadow: 0 2px 10px color-mix(in srgb, #c9a227 22%, transparent);
    }

    [data-theme="light"] .settings-v37-premium-badge {
      color: #5c4812;
    }

    .settings-v37-group--danger {
      border-color: color-mix(in srgb, #e85d6c 42%, var(--border));
      background:
        radial-gradient(ellipse 100% 90% at 10% -20%, color-mix(in srgb, #e85d6c 10%, transparent), transparent 58%),
        linear-gradient(165deg, color-mix(in srgb, var(--panel) 92%, #e85d6c 4%), color-mix(in srgb, var(--panel) 86%, var(--bg) 14%));
    }

    .settings-v37-group--account,
    .settings-v37-group--account-logout {
      padding: 14px 16px;
    }

    .settings-v37-group--account-logout {
      border-color: color-mix(in srgb, #e8a86a 32%, var(--border));
      background:
        linear-gradient(165deg, color-mix(in srgb, #e8a86a 5%, var(--panel)), color-mix(in srgb, var(--panel) 90%, var(--bg) 10%));
    }

    .settings-v37-btn--account {
      min-height: 44px;
      font-size: 14px;
      font-weight: 700;
      border-color: color-mix(in srgb, var(--border) 88%, transparent);
      background: color-mix(in srgb, var(--panel) 96%, var(--bg));
      color: var(--text);
    }

    .settings-v37-btn--account:hover {
      background: color-mix(in srgb, var(--panel) 90%, var(--accent) 4%);
      border-color: color-mix(in srgb, var(--border) 94%, var(--accent) 8%);
    }

    .settings-v37-btn--logout {
      min-height: 44px;
      font-size: 14px;
      font-weight: 700;
      border-color: color-mix(in srgb, #e8a86a 48%, var(--border));
      background: color-mix(in srgb, #e8a86a 14%, var(--panel));
      color: #f5dfc0;
    }

    [data-theme="light"] .settings-v37-btn--logout {
      color: #7a4e18;
    }

    .settings-v37-btn--logout:hover {
      background: color-mix(in srgb, #e8a86a 22%, var(--panel));
      border-color: color-mix(in srgb, #e8a86a 58%, var(--border));
    }

    .settings-v37-btn--danger-strong {
      min-height: 44px;
      font-size: 14px;
      font-weight: 800;
      border-color: color-mix(in srgb, #e85d6c 58%, var(--border));
      background: color-mix(in srgb, #e85d6c 20%, var(--panel));
      color: #ffd0d6;
      box-shadow: 0 4px 16px color-mix(in srgb, #e85d6c 14%, transparent);
    }

    [data-theme="light"] .settings-v37-btn--danger-strong {
      color: #8a1f2e;
    }

    .settings-v37-btn--danger-strong:hover {
      background: color-mix(in srgb, #e85d6c 28%, var(--panel));
      border-color: color-mix(in srgb, #e85d6c 68%, var(--border));
    }

    .settings-v37-btn--admin {
      border-color: color-mix(in srgb, #e85d6c 40%, var(--border));
      background: color-mix(in srgb, #e85d6c 10%, var(--panel));
      color: #ffd0d6;
    }

    [data-theme="light"] .settings-v37-btn--admin {
      color: #8a1f2e;
    }

    .settings-v37-btn--admin:hover {
      background: color-mix(in srgb, #e85d6c 16%, var(--panel));
      border-color: color-mix(in srgb, #e85d6c 52%, var(--border));
    }

    .settings-v37-empty--soon {
      position: relative;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      padding: 28px 20px 24px;
      text-align: center;
      border-style: solid;
      border-color: color-mix(in srgb, var(--border) 72%, transparent);
      background:
        radial-gradient(ellipse 90% 70% at 50% 0%, color-mix(in srgb, var(--accent) 8%, transparent), transparent 62%),
        color-mix(in srgb, var(--panel) 78%, transparent);
    }

    .settings-v37-empty__badge {
      position: absolute;
      top: 12px;
      right: 12px;
      font-size: 9px;
      font-weight: 800;
      letter-spacing: 0.08em;
      text-transform: uppercase;
      padding: 4px 8px;
      border-radius: 999px;
      color: color-mix(in srgb, var(--text) 75%, var(--muted));
      background: color-mix(in srgb, var(--muted) 14%, var(--panel));
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    }

    .settings-v37-empty__icon-wrap {
      width: 52px;
      height: 52px;
      border-radius: 14px;
      display: grid;
      place-items: center;
      color: color-mix(in srgb, var(--accent) 82%, var(--muted));
      background: color-mix(in srgb, var(--accent) 10%, var(--panel));
      border: 1px solid color-mix(in srgb, var(--accent) 18%, transparent);
      box-shadow: inset 0 0 16px color-mix(in srgb, var(--accent) 8%, transparent);
      margin-bottom: 4px;
    }

    .settings-v37-empty__title {
      margin: 0;
      font-size: 15px;
      font-weight: 800;
      letter-spacing: -0.01em;
      color: var(--text);
      line-height: 1.3;
    }

    .settings-v37-empty__desc {
      margin: 0;
      max-width: 34ch;
      font-size: 13px;
      line-height: 1.5;
      color: var(--muted);
    }

    .settings-v37-empty__icon-wrap--ui {
      color: #9490f8;
      background: color-mix(in srgb, #9490f8 12%, var(--panel));
      border-color: color-mix(in srgb, #9490f8 22%, transparent);
    }

    .settings-v37-empty__icon-wrap--chats {
      color: #7eb8ff;
      background: color-mix(in srgb, #7eb8ff 12%, var(--panel));
      border-color: color-mix(in srgb, #7eb8ff 22%, transparent);
    }

    .settings-v37-empty__icon-wrap--channels {
      color: #7b92f0;
      background: color-mix(in srgb, #7b92f0 12%, var(--panel));
      border-color: color-mix(in srgb, #7b92f0 22%, transparent);
    }

    .settings-v37-group--premium-dm {
      border-color: color-mix(in srgb, #c9a227 22%, var(--border));
      background: color-mix(in srgb, var(--panel) 94%, #c9a227 2%);
    }

    .settings-v37-group--premium-dm .settings-v37-row:first-child {
      border-top: none;
    }

    .settings-v37-section--premium-dm {
      gap: 10px;
    }

    .settings-v37-actions--premium-save {
      margin-top: 2px;
    }

    .settings-v37-btn--admin.settings-v37-btn--block {
      min-height: 44px;
      font-size: 14px;
      font-weight: 700;
    }

    /* —— Settings V38 final responsive —— */
    @media (max-width: 768px) {
      .modal--settings-hub {
        width: min(100%, calc(100vw - 16px));
        max-height: min(88dvh, calc(100vh - 12px));
      }

      .modal--settings-detail {
        width: min(100%, calc(100vw - 16px));
        max-height: min(88dvh, calc(100vh - 12px));
        padding: 12px;
      }

      .settings-nested-body {
        padding-top: 4px;
        gap: 12px;
      }

      .settings-v37-row,
      .settings-v37-row--action {
        padding: 12px 14px;
        gap: 12px;
        min-height: 72px;
      }

      .settings-v37-row__copy {
        min-width: 0;
      }

      .settings-v37-row__title {
        font-size: 13px;
      }

      .settings-v37-row__hint {
        font-size: 12px;
      }

      .settings-v37-switch {
        flex-shrink: 0;
      }

      .settings-v37-btn {
        max-width: 100%;
      }

      .premium-nickname-field {
        padding: 0 10px 0 10px;
        min-height: 46px;
      }

      .premium-nickname-input {
        font-size: 14px;
        height: 44px;
        padding: 10px 0;
      }

      .settings-v37-empty--soon {
        padding: 24px 16px 20px;
      }

      .settings-v37-empty__desc {
        max-width: none;
      }

      .settings-hub-item-btn {
        min-height: 52px;
      }

      .settings-hub-item-btn--sub {
        min-height: 52px;
      }
    }

    @media (max-width: 412px) {
      .settings-hub-item-icon,
      .settings-hub-sub-icon {
        width: 40px;
        height: 40px;
        padding: 9px;
      }

      .settings-hub-item-icon svg,
      .settings-hub-sub-icon svg {
        width: 20px;
        height: 20px;
      }

      .settings-v37-sheet-header__title {
        font-size: 16px;
      }

      .settings-v37-group--pad {
        padding: 12px 14px;
      }
    }

    @media (max-width: 360px) {
      .modal--settings-hub .modal-header-row,
      .modal--settings-detail .modal-header-row {
        gap: 8px;
      }

      .settings-v37-row {
        flex-wrap: nowrap;
      }

      .settings-v37-btn:not(.settings-v37-btn--block) {
        padding: 8px 10px;
        font-size: 12px;
      }
    }

    .privacy-consent-toggle {
      display: none;
    }

    .settings-theme-toggle-row {
      display: contents;
    }

    .settings-theme-toggle-label {
      display: none;
    }

    .settings-action-row {
      display: flex;
      flex-wrap: wrap;
      gap: 8px;
      align-items: center;
    }

    .settings-btn-plain {
      border: none;
      background: color-mix(in srgb, var(--panel) 88%, transparent);
      color: var(--text);
      padding: 8px 12px;
      border-radius: 10px;
      cursor: pointer;
      font-size: 13px;
      font-weight: 600;
    }

    .settings-btn-plain:hover {
      background: color-mix(in srgb, var(--accent) 14%, var(--panel));
    }

    .modal-backdrop--settings-nested {
      z-index: 1255;
    }

    .modal--settings-hub {
      width: min(620px, 96vw);
      max-height: min(620px, 90vh);
      min-height: 0;
      display: flex;
      flex-direction: column;
      gap: 0;
    }

    .settings-hub-layout {
      display: grid;
      grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
      gap: 12px;
      margin-top: 4px;
      min-height: 300px;
      flex: 1;
      min-height: 0;
    }

    @media (max-width: 560px) {
      .settings-hub-layout {
        grid-template-columns: 1fr;
        min-height: 0;
      }
    }

    .settings-hub-col {
      border: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
      border-radius: 14px;
      padding: 12px;
      background:
        linear-gradient(165deg, color-mix(in srgb, var(--bg) 42%, var(--panel) 58%), color-mix(in srgb, var(--bg) 68%, var(--panel) 32%));
      backdrop-filter: blur(12px);
      -webkit-backdrop-filter: blur(12px);
      box-shadow:
        inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent),
        0 8px 24px color-mix(in srgb, #000 14%, transparent);
      display: flex;
      flex-direction: column;
      gap: 8px;
      min-height: 220px;
    }

    .settings-hub-col-title {
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.09em;
      text-transform: uppercase;
      color: var(--muted);
      margin: 0;
    }

    .settings-hub-btn-stack {
      display: flex;
      flex-direction: column;
      gap: 8px;
      overflow-y: auto;
      flex: 1;
      min-height: 0;
      padding-right: 2px;
    }

    .settings-hub-placeholder {
      margin: 0;
      line-height: 1.45;
      font-size: 13px;
    }

    .settings-hub-item-btn {
      width: 100%;
      text-align: left;
      border: 1px solid color-mix(in srgb, var(--border) 55%, transparent);
      background: color-mix(in srgb, var(--panel) 82%, transparent);
      color: var(--text);
      padding: 10px 12px;
      border-radius: 14px;
      cursor: pointer;
      font-size: 13px;
      font-weight: 600;
      display: flex;
      align-items: center;
      gap: 12px;
      min-height: 56px;
      box-sizing: border-box;
      transition:
        background 0.2s ease,
        border-color 0.2s ease,
        box-shadow 0.2s ease,
        transform 0.2s ease;
    }

    .settings-hub-item-btn--sub {
      padding: 10px 12px;
      gap: 12px;
      min-height: 56px;
      border-radius: 14px;
    }

    .settings-hub-item-btn:hover:not(.is-active) {
      background: color-mix(in srgb, var(--accent) 8%, var(--panel));
      border-color: color-mix(in srgb, var(--accent) 22%, var(--border));
      transform: translateY(-1px);
      box-shadow:
        0 4px 14px color-mix(in srgb, #000 14%, transparent),
        0 0 0 1px color-mix(in srgb, var(--accent) 10%, transparent);
    }

    .settings-hub-item-btn.is-active {
      background: color-mix(in srgb, var(--accent) 10%, var(--panel));
      border-color: color-mix(in srgb, var(--accent) 32%, transparent);
      box-shadow:
        inset 0 0 0 1px color-mix(in srgb, var(--accent) 14%, transparent),
        0 2px 12px color-mix(in srgb, var(--accent) 10%, transparent);
      transform: none;
    }

    .settings-hub-item-btn--sub.is-active {
      background: color-mix(in srgb, var(--accent) 8%, var(--panel));
    }

    .settings-hub-item-btn.is-active .settings-hub-item-icon {
      box-shadow:
        inset 0 0 14px color-mix(in srgb, currentColor 12%, transparent),
        0 0 0 1px color-mix(in srgb, currentColor 10%, transparent);
    }

    .settings-hub-item-label {
      flex: 1;
      min-width: 0;
      line-height: 1.35;
      text-align: left;
    }

    .settings-hub-item-icon {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      display: grid;
      place-items: center;
      border-radius: 12px;
      border: 1px solid color-mix(in srgb, currentColor 20%, transparent);
      box-shadow: inset 0 0 14px color-mix(in srgb, currentColor 8%, transparent);
      padding: 11px;
      box-sizing: border-box;
    }

    .settings-hub-item-icon svg {
      display: block;
      width: 22px;
      height: 22px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    .settings-hub-sub-icon {
      width: 44px;
      height: 44px;
      padding: 11px;
      border-radius: 12px;
    }

    .settings-hub-sub-icon svg {
      width: 22px;
      height: 22px;
    }

    .settings-hub-item-icon[data-tone="ui"] {
      color: #9490f8;
      background: color-mix(in srgb, #9490f8 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="privacy"] {
      color: #72c9a8;
      background: color-mix(in srgb, #72c9a8 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="notify"] {
      color: #e8b86d;
      background: color-mix(in srgb, #e8b86d 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="chats"] {
      color: #7eb8ff;
      background: color-mix(in srgb, #7eb8ff 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="channels"] {
      color: #7b92f0;
      background: color-mix(in srgb, #7b92f0 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="account"] {
      color: #ffcc70;
      background: color-mix(in srgb, #ffcc70 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="extra"] {
      color: #9ca3af;
      background: color-mix(in srgb, #9ca3af 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-eye"],
    .settings-hub-item-icon[data-tone="sub-chat-bg"],
    .settings-hub-item-icon[data-tone="sub-motion"] {
      color: #9490f8;
      background: color-mix(in srgb, #9490f8 12%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-visibility"] {
      color: #72c9a8;
      background: color-mix(in srgb, #72c9a8 12%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-bell"] {
      color: #e8b86d;
      background: color-mix(in srgb, #e8b86d 12%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-devices"],
    .settings-hub-item-icon[data-tone="sub-lock"],
    .settings-hub-item-icon[data-tone="sub-neutral"] {
      color: #a8b0bc;
      background: color-mix(in srgb, #9ca3af 12%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-premium"] {
      color: #ffcc70;
      background: color-mix(in srgb, #ffcc70 12%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-logout"] {
      color: #e8a86a;
      background: color-mix(in srgb, #e8a86a 11%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-danger"] {
      color: #d48892;
      background: color-mix(in srgb, #d48892 11%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-danger-strong"] {
      color: #e85d6c;
      background: color-mix(in srgb, #e85d6c 14%, transparent);
    }

    .settings-hub-item-icon[data-tone="sub-admin"] {
      color: #e85d6c;
      background: color-mix(in srgb, #e85d6c 12%, transparent);
    }

    .settings-hub-admin-area {
      margin-top: 12px;
      padding: 11px 12px;
      border-radius: 12px;
      border: 1px dashed color-mix(in srgb, #e85d6c 28%, var(--border));
      background: color-mix(in srgb, #e85d6c 4%, var(--panel));
      box-shadow: inset 0 0 16px color-mix(in srgb, #e85d6c 4%, transparent);
      display: flex;
      flex-wrap: wrap;
      align-items: center;
      justify-content: space-between;
      gap: 10px;
      flex-shrink: 0;
      opacity: 0.92;
    }

    .settings-hub-admin-area.hidden {
      display: none !important;
      margin: 0 !important;
      padding: 0 !important;
      border: none !important;
      height: 0 !important;
      min-height: 0 !important;
      overflow: hidden !important;
      opacity: 0 !important;
      visibility: hidden !important;
    }

    .settings-hub-admin-left {
      display: flex;
      align-items: center;
      gap: 11px;
      min-width: 0;
      flex: 1;
    }

    .settings-hub-admin-icon {
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      flex-shrink: 0;
      color: #e85d6c;
      background: color-mix(in srgb, #e85d6c 12%, transparent);
      border: 1px solid color-mix(in srgb, #e85d6c 30%, transparent);
      box-shadow: inset 0 0 14px color-mix(in srgb, #e85d6c 10%, transparent);
    }

    .settings-hub-admin-icon svg {
      width: 22px;
      height: 22px;
      stroke: currentColor;
      fill: none;
      stroke-width: 2;
    }

    .settings-hub-admin-meta {
      display: flex;
      align-items: center;
      gap: 8px;
      flex-wrap: wrap;
    }

    .settings-hub-admin-heading {
      font-size: 12px;
      font-weight: 700;
      letter-spacing: 0.03em;
      color: color-mix(in srgb, var(--muted) 88%, var(--text));
      line-height: 1.25;
      text-transform: uppercase;
    }

    .settings-hub-admin-text {
      min-width: 0;
    }

    .settings-hub-admin-action {
      border: 1px solid color-mix(in srgb, #e85d6c 35%, transparent);
      cursor: pointer;
      padding: 8px 12px;
      border-radius: 10px;
      font-size: 12px;
      font-weight: 700;
      color: color-mix(in srgb, #ffd0d6 92%, var(--text));
      background: color-mix(in srgb, #e85d6c 12%, var(--panel));
      box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent);
      flex-shrink: 0;
      transition:
        background 0.18s ease,
        border-color 0.18s ease;
    }

    .settings-hub-admin-action:hover {
      background: color-mix(in srgb, #e85d6c 18%, var(--panel));
      border-color: color-mix(in srgb, #e85d6c 48%, transparent);
    }

    .modal--settings-detail {
      width: min(460px, 94vw);
      max-height: min(620px, 88vh);
      display: flex;
      flex-direction: column;
      min-height: 0;
      padding: 14px;
    }

    .settings-nested-modal-scroll {
      flex: 1;
      min-height: 0;
      margin-top: 2px;
    }

    .settings-nested-modal-scroll.panel-scroll {
      overflow-y: auto;
    }

    .settings-nested-body {
      display: flex;
      flex-direction: column;
      gap: 12px;
      padding-top: 6px;
    }

    .settings-nested-sheet.settings-v37-sheet {
      gap: 14px;
    }

    .settings-nested-sheet {
      display: flex;
      flex-direction: column;
      gap: 14px;
    }

    .settings-nested-sheet.hidden {
      display: none !important;
    }

    .account-delete-sheet__grid,
    .account-delete-confirm__grid {
      display: grid;
      grid-template-columns: minmax(0, 1fr) min(118px, 32%);
      gap: 14px 18px;
      align-items: center;
    }

    @media (max-width: 420px) {
      .account-delete-sheet__grid,
      .account-delete-confirm__grid {
        grid-template-columns: 1fr;
      }

      .account-delete-sheet__art,
      .account-delete-confirm__art {
        order: -1;
        justify-self: center;
        max-width: 140px;
      }
    }

    .account-delete-sheet__lead {
      font-size: 14px;
      font-weight: 600;
      color: var(--text);
      margin: 0 0 6px;
      line-height: 1.35;
    }

    .account-delete-sheet__hint {
      margin: 0 0 12px;
      max-width: 44ch;
    }

    .account-delete-sheet__art,
    .account-delete-confirm__art {
      border-radius: 14px;
      padding: 10px 8px 12px;
      background:
        radial-gradient(ellipse 85% 75% at 50% 28%, color-mix(in srgb, var(--accent) 14%, transparent), transparent 62%),
        color-mix(in srgb, var(--bubble-in) 92%, transparent);
      border: 1px solid color-mix(in srgb, var(--border) 75%, transparent);
      box-shadow: inset 0 1px 0 color-mix(in srgb, #fff 6%, transparent);
      display: flex;
      align-items: center;
      justify-content: center;
    }

    [data-theme="light"] .account-delete-sheet__art,
    [data-theme="light"] .account-delete-confirm__art {
      box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.45);
    }

    .account-delete-sheet__art svg,
    .account-delete-confirm__art svg {
      width: 100%;
      max-width: 108px;
      height: auto;
      display: block;
      color: color-mix(in srgb, var(--text) 28%, var(--muted));
    }

    .settings-sheet-account-delete .settings-action-row {
      margin-top: 2px;
    }

    .settings-sheet-account-delete .btn-logout-danger {
      padding: 8px 14px;
      font-size: 13px;
    }

    .account-delete-confirm-modal {
      max-width: 528px !important;
      width: min(528px, 94vw) !important;
      padding: 16px 18px 18px;
    }

    .account-delete-confirm-modal .modal-header-row {
      margin-bottom: 6px;
    }

    .account-delete-confirm-modal .account-delete-confirm__copy > .modal-text-muted {
      margin-top: 0;
      margin-bottom: 10px;
    }

    .account-delete-confirm-modal .modal-actions--split {
      margin-top: 12px;
    }

    .account-delete-confirm-modal .btn-logout-danger {
      padding: 8px 14px;
      font-size: 13px;
    }

    .modal--premium {
      width: min(460px, 94vw);
      max-height: min(88vh, 640px);
      overflow: hidden;
      padding: 0;
      border: 1px solid rgba(201, 162, 39, 0.5);
      background:
        radial-gradient(ellipse 120% 90% at 50% -20%, rgba(201, 162, 39, 0.28), transparent 55%),
        var(--panel);
      box-shadow:
        0 0 0 1px rgba(255, 230, 160, 0.08) inset,
        0 22px 56px rgba(0, 0, 0, 0.38);
    }

    [data-theme="light"] .modal--premium {
      background:
        radial-gradient(ellipse 120% 90% at 50% -20%, rgba(201, 162, 39, 0.2), transparent 55%),
        var(--panel);
      box-shadow:
        0 0 0 1px rgba(201, 162, 39, 0.15) inset,
        0 18px 44px var(--shadow);
    }

    .premium-modal-top {
      margin: 0;
      padding: 10px 10px 0 14px;
    }

    .premium-modal-body {
      padding: 0 20px 20px;
      display: grid;
      gap: 16px;
      overflow-y: auto;
    }

    .premium-hero {
      text-align: center;
      padding: 4px 8px 0;
      display: grid;
      gap: 10px;
      justify-items: center;
    }

    .premium-crown-wrap {
      width: 72px;
      height: 72px;
      border-radius: 20px;
      display: grid;
      place-items: center;
      background: linear-gradient(155deg, rgba(232, 208, 96, 0.35), rgba(201, 162, 39, 0.12));
      border: 1px solid rgba(201, 162, 39, 0.55);
      box-shadow:
        0 0 24px rgba(201, 162, 39, 0.28),
        inset 0 1px 0 rgba(255, 255, 255, 0.12);
    }

    .premium-crown-wrap svg {
      width: 40px;
      height: 40px;
      color: #e8c547;
      filter: drop-shadow(0 2px 10px rgba(232, 197, 71, 0.55));
    }

    .premium-modal-title {
      margin: 0;
      font-size: 23px;
      font-weight: 800;
      letter-spacing: 0.06em;
      text-transform: uppercase;
      color: #f4e4a8;
      text-shadow: 0 0 24px rgba(244, 228, 168, 0.45);
    }

    [data-theme="light"] .premium-modal-title {
      color: #7a6220;
      text-shadow: none;
    }

    .premium-tagline {
      margin: 0;
      font-size: 15px;
      line-height: 1.55;
      color: var(--muted);
      max-width: 36ch;
    }

    .premium-tagline strong {
      color: var(--text);
      font-weight: 600;
    }

    .premium-features {
      margin: 0;
      padding: 0;
      list-style: none;
      display: grid;
      gap: 12px;
      text-align: left;
    }

    .premium-features li {
      display: grid;
      grid-template-columns: 26px 1fr;
      gap: 10px;
      align-items: start;
      font-size: 14px;
      line-height: 1.5;
      color: var(--text);
    }

    .premium-feature-ico {
      width: 26px;
      height: 26px;
      border-radius: 8px;
      display: grid;
      place-items: center;
      font-size: 14px;
      font-weight: 800;
      color: #1a1508;
      background: linear-gradient(145deg, #f0d478, #c9a227);
      box-shadow: 0 2px 10px rgba(201, 162, 39, 0.35);
    }

    .premium-note {
      margin: 0;
      font-size: 13px;
      line-height: 1.55;
      color: var(--muted);
      text-align: center;
      padding: 14px 16px;
      border-radius: 12px;
      background: rgba(0, 0, 0, 0.18);
      border: 1px dashed rgba(201, 162, 39, 0.35);
    }

    [data-theme="light"] .premium-note {
      background: rgba(201, 162, 39, 0.08);
    }

    .premium-price-row {
      text-align: center;
      display: grid;
      gap: 4px;
    }

    .premium-price-label {
      font-size: 12px;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      font-weight: 700;
      color: #e8c547;
      opacity: 0.95;
    }

    [data-theme="light"] .premium-price-label {
      color: #9a7b1a;
    }

    .premium-price-value {
      font-size: 28px;
      font-weight: 800;
      color: var(--text);
      letter-spacing: 0.02em;
    }

    .premium-price-hint {
      font-size: 13px;
      color: var(--muted);
    }

    .premium-modal-actions {
      display: flex;
      flex-wrap: wrap;
      justify-content: center;
      gap: 10px;
      margin-top: 2px;
    }

    .btn-premium-glow {
      padding: 12px 26px;
      border-radius: 12px;
      border: 1px solid rgba(201, 162, 39, 0.6);
      font-weight: 700;
      font-size: 15px;
      cursor: pointer;
      color: #1a1508;
      background: linear-gradient(165deg, #fcefb8 0%, #e8c547 45%, #b8891f 100%);
      box-shadow: 0 6px 26px rgba(201, 162, 39, 0.42);
      transition: transform 0.18s ease, box-shadow 0.18s ease;
    }

    .btn-premium-glow:hover {
      transform: translateY(-1px);
      box-shadow: 0 10px 32px rgba(201, 162, 39, 0.5);
    }

    .btn-premium-glow:active {
      transform: translateY(0);
    }

    .btn-premium-ghost {
      padding: 12px 20px;
      border-radius: 12px;
      border: 1px solid var(--border);
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      color: var(--muted);
      background: transparent;
      transition: background-color 0.16s ease, color 0.16s ease;
    }

    .btn-premium-ghost:hover {
      background: var(--bg);
      color: var(--text);
    }

    /* Окно «у вас Premium» — шире и с прокручиваемым телом, без обрезания кнопок */
    .modal--premium.modal--premium-member {
      width: min(720px, 96vw);
      max-height: min(92vh, 920px);
      display: flex;
      flex-direction: column;
      overflow: hidden;
      border-color: rgba(232, 208, 96, 0.55);
      background:
        radial-gradient(ellipse 100% 70% at 50% -30%, rgba(255, 215, 120, 0.22), transparent 50%),
        radial-gradient(ellipse 80% 50% at 100% 100%, rgba(201, 162, 39, 0.12), transparent 45%),
        var(--panel);
    }

    .modal--premium.modal--premium-member .premium-modal-top {
      flex-shrink: 0;
    }

    .modal--premium.modal--premium-member .premium-modal-body {
      flex: 1 1 auto;
      min-height: 0;
      overflow-x: hidden;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      padding: 0 24px 24px;
      gap: 14px;
    }

    .modal--premium.modal--premium-member .premium-member-sub,
    .modal--premium.modal--premium-member .premium-gift-lead {
      max-width: none;
    }

    @media (min-width: 700px) {
      .modal--premium.modal--premium-member .premium-member-hero {
        display: grid;
        grid-template-columns: auto 1fr;
        grid-template-rows: auto auto auto;
        column-gap: 20px;
        row-gap: 8px;
        text-align: left;
        align-items: center;
        justify-items: start;
      }
      .modal--premium.modal--premium-member .premium-crown-wrap {
        grid-row: 1 / span 3;
        align-self: center;
      }
      .modal--premium.modal--premium-member .premium-member-pill {
        grid-column: 2;
        grid-row: 1;
        margin-bottom: 0;
      }
      .modal--premium.modal--premium-member .premium-member-title {
        grid-column: 2;
        grid-row: 2;
      }
      .modal--premium.modal--premium-member .premium-member-sub {
        grid-column: 2;
        grid-row: 3;
      }
    }

    .premium-you-have-banner {
      display: flex;
      align-items: flex-start;
      gap: 14px;
      padding: 16px 18px;
      border-radius: 14px;
      border: 1px solid rgba(201, 162, 39, 0.55);
      background: linear-gradient(
        135deg,
        rgba(201, 162, 39, 0.22) 0%,
        rgba(40, 35, 28, 0.65) 50%,
        rgba(201, 162, 39, 0.12) 100%
      );
      box-shadow:
        0 0 0 1px rgba(255, 230, 160, 0.1) inset,
        0 8px 28px rgba(0, 0, 0, 0.25);
    }

    [data-theme="light"] .premium-you-have-banner {
      background: linear-gradient(
        135deg,
        rgba(201, 162, 39, 0.2) 0%,
        rgba(255, 252, 245, 0.95) 45%,
        rgba(201, 162, 39, 0.1) 100%
      );
    }

    .premium-you-have-icon {
      flex-shrink: 0;
      width: 44px;
      height: 44px;
      border-radius: 12px;
      display: grid;
      place-items: center;
      color: #1a1508;
      background: linear-gradient(145deg, #d4f5d4 0%, #7ecf7e 45%, #3d9a3d 100%);
      box-shadow: 0 4px 14px rgba(61, 154, 61, 0.45);
    }

    .premium-you-have-text {
      min-width: 0;
      flex: 1;
    }

    .premium-you-have-kicker {
      font-size: 11px;
      font-weight: 700;
      letter-spacing: 0.12em;
      text-transform: uppercase;
      color: #e8c547;
      margin-bottom: 4px;
    }

    [data-theme="light"] .premium-you-have-kicker {
      color: #9a7b1a;
    }

    .premium-you-have-headline {
      font-size: 19px;
      font-weight: 800;
      line-height: 1.25;
      color: var(--text);
      letter-spacing: 0.01em;
    }

    .premium-you-have-word {
      color: #f4e4a8;
      text-shadow: 0 0 20px rgba(232, 197, 71, 0.35);
    }

    [data-theme="light"] .premium-you-have-word {
      color: #7a6220;
      text-shadow: none;
    }

    .premium-you-have-detail {
      margin: 8px 0 0;
      font-size: 14px;
      line-height: 1.45;
      color: var(--muted);
    }

    .premium-member-hero {
      position: relative;
    }

    .premium-member-pill {
      display: inline-block;
      font-size: 11px;
      font-weight: 800;
      letter-spacing: 0.14em;
      text-transform: uppercase;
      padding: 6px 14px;
      border-radius: 999px;
      color: #1a1508;
      background: linear-gradient(120deg, #fcefb8, #e8c547, #d4a82a);
      box-shadow: 0 4px 20px rgba(201, 162, 39, 0.45);
      margin-bottom: 6px;
    }

    .premium-member-title {
      margin: 0;
      font-size: 22px;
      font-weight: 800;
      letter-spacing: 0.02em;
      color: var(--text);
      line-height: 1.25;
    }

    .premium-member-sub {
      margin: 0;
      font-size: 15px;
      line-height: 1.55;
      color: var(--muted);
    }

    .premium-member-sub strong {
      color: #f0d478;
      font-weight: 600;
    }

    [data-theme="light"] .premium-member-sub strong {
      color: #8a7220;
    }

    .premium-gift-card {
      margin-top: 4px;
      padding: 18px 16px;
      border-radius: 14px;
      border: 1px solid rgba(201, 162, 39, 0.42);
      background: linear-gradient(
        165deg,
        rgba(201, 162, 39, 0.14) 0%,
        rgba(0, 0, 0, 0.12) 100%
      );
      box-shadow: 0 0 0 1px rgba(255, 230, 160, 0.06) inset;
      display: grid;
      gap: 12px;
      text-align: left;
    }

    [data-theme="light"] .premium-gift-card {
      background: linear-gradient(
        165deg,
        rgba(201, 162, 39, 0.12) 0%,
        rgba(255, 255, 255, 0.5) 100%
      );
    }

    .premium-gift-card-title {
      font-size: 16px;
      font-weight: 800;
      color: #f4e4a8;
      letter-spacing: 0.03em;
      display: flex;
      align-items: center;
      gap: 8px;
    }

    [data-theme="light"] .premium-gift-card-title {
      color: #6b5818;
    }

    .premium-gift-card-title .gift-ico {
      font-size: 18px;
      filter: drop-shadow(0 0 8px rgba(232, 197, 71, 0.5));
    }

    .premium-gift-lead {
      margin: 0;
      font-size: 14px;
      line-height: 1.5;
      color: var(--text);
    }

    .premium-gift-input {
      width: 100%;
      box-sizing: border-box;
      padding: 12px 14px;
      border-radius: 12px;
      border: 1px solid rgba(201, 162, 39, 0.45);
      background: var(--bg);
      color: var(--text);
      font-size: 15px;
      font-weight: 600;
      letter-spacing: 0.02em;
      outline: none;
      transition: border-color 0.18s ease, box-shadow 0.18s ease;
    }

    .premium-gift-input:focus {
      border-color: #e8c547;
      box-shadow: 0 0 0 3px rgba(232, 197, 71, 0.25);
    }

    .premium-gift-input::placeholder {
      color: var(--muted);
      font-weight: 500;
    }

    .premium-gift-hint {
      margin: 0;
      font-size: 12px;
      line-height: 1.45;
      color: var(--muted);
    }

    .premium-crown-wrap--pulse {
      animation: premiumCrownPulse 3.2s ease-in-out infinite;
    }

    @keyframes premiumCrownPulse {
      0%,
      100% {
        box-shadow: 0 0 24px rgba(201, 162, 39, 0.28), inset 0 1px 0 rgba(255, 255, 255, 0.12);
      }
      50% {
        box-shadow: 0 0 36px rgba(232, 208, 96, 0.45), inset 0 1px 0 rgba(255, 255, 255, 0.15);
      }
    }

    .modal-header-row {
      display: flex;
      align-items: flex-start;
      justify-content: space-between;
      gap: 12px;
      margin-bottom: 4px;
    }

    .modal-header-row--profile-viewer {
      align-items: center;
    }

    .modal-header-row--profile-viewer .profile-viewer-modal-title-center {
      flex: 1;
      min-width: 0;
      display: flex;
      justify-content: center;
    }

    .modal-header-row--profile-viewer .profile-viewer-modal-title-center .delete-title {
      margin: 0;
    }

    .profile-viewer-back-btn {
      display: none;
      flex-shrink: 0;
      padding: 8px 12px;
      font-size: 13px;
      border-radius: 10px;
    }

    .profile-viewer-identity-row {
      display: flex;
      gap: 12px;
      align-items: flex-end;
      padding: 0 10px;
    }

    .profile-viewer-identity-text {
      flex: 1;
      min-width: 0;
      display: flex;
      flex-direction: column;
      gap: 4px;
      padding-bottom: 4px;
    }

    .profile-viewer-identity-text .profile-viewer-internal-id-line {
      text-align: left;
    }

    .profile-viewer-identity-text .profile-viewer-id {
      text-align: left;
      font-size: 18px;
    }

    /* На узкой ширине — ник/ID над «Уровень» (см. #profileViewerHeroLine); в строке у аватара дубль скрыт в mobile.css */
    .profile-viewer-hero-line {
      display: none;
    }

    .profile-viewer-level-status {
      display: flex;
      flex-direction: column;
      gap: 6px;
      padding: 0 10px 6px;
    }

    .profile-viewer-mobile-nav {
      display: none;
      width: 100%;
      box-sizing: border-box;
      grid-template-columns: 1fr 1fr;
      gap: 8px;
    }

    .profile-viewer-mobile-nav-btn {
      font: inherit;
      border: 1px solid var(--border);
      border-radius: 11px;
      background: color-mix(in srgb, var(--panel) 88%, transparent);
      color: var(--text);
      padding: 10px 8px 12px;
      font-size: 13px;
      font-weight: 600;
      cursor: pointer;
      text-align: center;
      display: flex;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 6px;
      min-height: 72px;
      box-sizing: border-box;
      transition:
        background-color 180ms ease,
        border-color 180ms ease;
    }

    .profile-viewer-mobile-nav-ic {
      display: flex;
      align-items: center;
      justify-content: center;
      color: var(--muted);
      transition: color 180ms ease;
    }

    .profile-viewer-mobile-nav-ic svg {
      width: 22px;
      height: 22px;
      display: block;
    }

    .profile-viewer-mobile-nav-txt {
      font-size: 12px;
      line-height: 1.15;
      font-weight: 650;
    }

    .profile-viewer-mobile-nav-btn:hover {
      border-color: var(--muted);
      background: color-mix(in srgb, var(--text) 6%, transparent);
    }

    .profile-viewer-mobile-nav-btn:hover .profile-viewer-mobile-nav-ic {
      color: var(--text);
    }

    .modal-close {
      flex-shrink: 0;
      width: 36px;
      height: 36px;
      border-radius: 10px;
      border: 1px solid transparent;
      background: transparent;
      color: var(--muted);
      font-size: 22px;
      line-height: 1;
      cursor: pointer;
      display: grid;
      place-items: center;
      transition: background-color 160ms ease, color 160ms ease;
    }

    .modal-close:hover {
      background: var(--bg);
      color: var(--text);
    }

    .modal-text-muted {
      color: var(--muted);
      font-size: 14px;
      line-height: 1.45;
      margin: 0;
    }

    .modal-actions--split {
      display: flex;
      flex-wrap: wrap;
      gap: 10px;
      margin-top: 6px;
    }

    .modal-actions--split .btn-pastel {
      flex: 1 1 120px;
    }

    .modal-actions--split .btn-logout-danger {
      flex: 1 1 120px;
    }

    .btn-pastel {
      padding: 11px 16px;
      border-radius: 11px;
      border: 1px solid var(--border);
      font-weight: 600;
      font-size: 14px;
      cursor: pointer;
      transition: background-color 180ms ease, border-color 180ms ease, color 180ms ease;
      background: rgba(167, 175, 187, 0.14);
      color: var(--muted);
    }

    .btn-pastel:hover {
      background: rgba(167, 175, 187, 0.22);
      color: var(--text);
      border-color: var(--muted);
    }

    .btn-logout-danger {
      padding: 11px 16px;
      border-radius: 11px;
      border: 1px solid rgba(180, 40, 40, 0.45);
      font-weight: 700;
      font-size: 14px;
      cursor: pointer;
      color: #fff;
      background: linear-gradient(165deg, #e85b5b 0%, #c73a3a 55%, #b52e2e 100%);
      box-shadow:
        0 1px 0 rgba(255, 255, 255, 0.12) inset,
        0 6px 18px rgba(180, 45, 45, 0.35);
      transition: filter 160ms ease, transform 120ms ease;
    }

    .btn-logout-danger:hover {
      filter: brightness(1.06);
    }

    .btn-logout-danger:active {
      transform: translateY(1px);
    }

    .settings-modal-body {
      display: flex;
      flex-direction: column;
      gap: 0;
      margin-top: 8px;
    }

    .settings-modal-body .settings-section + .settings-section {
      margin-top: 16px;
      padding-top: 16px;
      border-top: 1px solid color-mix(in srgb, var(--border) 70%, transparent);
    }

    .settings-modal-body .profile-settings-title {
      margin-bottom: 0;
    }

    .delete-title {
      font-size: 15px;
      font-weight: 800;
    }

    .delete-help {
      color: var(--muted);
      font-size: 13px;
      line-height: 1.35;
    }

    .modal-actions {
      display: flex;
      justify-content: flex-end;
      gap: 8px;
    }

    .landingView {
      padding: 28px 22px 26px;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 22px;
      width: 100%;
      box-sizing: border-box;
    }

    .landingLogo {
      font-family: var(--font-brand-rounded);
      font-weight: 800;
      font-size: clamp(2.15rem, 9vw, 3rem);
      letter-spacing: 0.08em;
      line-height: 1.05;
      padding: 8px 12px 4px;
      margin: 0;
      text-align: center;
      width: 100%;
      box-sizing: border-box;
      -webkit-font-smoothing: antialiased;
      background: linear-gradient(
        135deg,
        var(--text),
        color-mix(in srgb, var(--text) 62%, var(--muted))
      );
      -webkit-background-clip: text;
      background-clip: text;
      -webkit-text-fill-color: transparent;
    }

    .olone-seo-tagline {
      margin: 0;
      padding: 0 8px;
      max-width: 36ch;
      text-align: center;
      font-size: 14px;
      line-height: 1.45;
      color: var(--muted);
    }

    .pre-chat-card.authLayout .auth-panel {
      padding-top: 4px;
    }

    .pre-chat-card.authLayout #authHeading {
      font-family: var(--font-brand-rounded);
      letter-spacing: 0.02em;
    }

    .pre-chat-card.authLayout .auth-form input:not([type="checkbox"]) {
      border-radius: 12px;
      min-height: 44px;
      border-color: color-mix(in srgb, var(--border) 88%, var(--text));
      transition: border-color 180ms ease, box-shadow 180ms ease;
    }

    .pre-chat-card.authLayout .auth-form input:not([type="checkbox"]):focus {
      outline: none;
      border-color: color-mix(in srgb, var(--text) 35%, var(--border));
      box-shadow: 0 0 0 3px color-mix(in srgb, var(--text) 8%, transparent);
    }

    .pre-chat-card.authLayout #authSubmit.primary {
      min-height: 46px;
      border-radius: 12px;
      font-weight: 700;
      letter-spacing: 0.02em;
    }

    .landingBtns {
      width: 100%;
      display: grid;
      grid-template-columns: 1fr 1fr;
      gap: 10px;
    }

    .landingBtns .primary,
    .landingBtns .secondary {
      width: 100%;
    }

    .auth-header {
      display: flex;
      justify-content: space-between;
      align-items: flex-start;
      gap: 10px;
      padding: 2px 16px 12px;
    }

    .levelDropdown {
      padding: 0 16px 12px;
      position: relative;
    }

    .levelDropdownBtn {
      width: 100%;
      display: flex;
      justify-content: space-between;
      align-items: center;
      gap: 10px;
    }

    .levelDropdownMenu {
      position: absolute;
      left: 16px;
      right: 16px;
      top: calc(100% + 8px);
      background: var(--panel);
      border: 1px solid var(--border);
      border-radius: 12px;
      box-shadow: 0 16px 34px var(--shadow);
      overflow: hidden;
      z-index: 10;
    }

    .levelDropdownMenu.hidden {
      display: none;
    }

    .levelDropdownMenu .levelMenuItem {
      width: 100%;
      padding: 12px 12px;
      background: transparent;
      border: none;
      color: var(--text);
      cursor: pointer;
      text-align: left;
      font-weight: 600;
      transition: background-color 160ms ease;
    }

    .levelDropdownMenu .levelMenuItem:hover {
      background: var(--border);
    }

    .level-btn {
      flex: 1;
      border: 1px solid var(--border);
      border-radius: 10px;
      padding: 10px;
      cursor: pointer;
      background: transparent;
      color: var(--text);
      font-weight: 600;
      transition: background-color 240ms ease, border-color 240ms ease, color 240ms ease;
    }

    .level-btn.active {
      background: var(--text);
      color: var(--panel);
      border-color: var(--text);
    }

    .auth-grid {
      display: grid;
      grid-template-columns: 1fr;
      gap: 10px;
      padding: 0;
      align-items: start;
    }

    .auth-form {
      display: grid;
      gap: 10px;
      min-width: 0;
    }

    #authCredBlock {
      display: flex;
      flex-direction: column;
      gap: 12px;
    }

    #authCredBlock .password-wrap {
      margin-top: 0;
    }

    #reportUserReasonSelect {
      width: 100%;
      margin-top: 6px;
      padding: 10px 12px;
      border-radius: 10px;
      border: 1px solid var(--border);
      background: color-mix(in srgb, var(--panel) 92%, #0a0a0c);
      color: var(--text);
      color-scheme: dark;
      font-size: 14px;
    }

    #reportUserReasonSelect option {
      background: #1a1b20;
      color: #e6e8ef;
    }

    .password-wrap {
      display: grid;
      grid-template-columns: 1fr auto;
      gap: 8px;
      align-items: center;
    }

    .reg-success {
      border: 1px solid var(--border);
      border-radius: 12px;
      background: var(--panel);
      padding: 14px 14px;
      height: 180px;
      max-height: 180px;
      overflow: auto;
      display: grid;
      align-content: start;
      gap: 10px;
    }

    .reg-success-title {
      font-weight: 800;
      font-size: 16px;
    }

    .reg-success-text {
      color: var(--muted);
      white-space: pre-wrap;
      line-height: 1.35;
      font-size: 13px;
    }

    .hint-title {
      color: var(--text);
      font-weight: 700;
      margin-bottom: 6px;
      font-size: 14px;
    }

    .hint-text {
      white-space: pre-wrap;
      line-height: 1.35;
      font-size: 12px;
    }

    .auth-remember-device-row {
      margin-top: 12px;
      padding-top: 12px;
      border-top: 1px solid var(--border);
      display: flex;
      flex-direction: column;
      gap: 6px;
    }

    .auth-remember-device-main {
      display: flex;
      align-items: center;
      gap: 10px;
      font-size: 13px;
      font-weight: 600;
      color: var(--text);
      cursor: pointer;
      user-select: none;
      line-height: 1.2;
    }

    .auth-remember-device-main input[type="checkbox"] {
      margin: 0;
      flex-shrink: 0;
      width: 17px;
      height: 17px;
      accent-color: var(--accent, #6b9fff);
    }

    .auth-remember-device-sub {
      margin: 0;
      padding-left: 27px;
      font-size: 12px;
      line-height: 1.4;
      color: var(--muted);
    }

    .auth-submit-actions {
      display: flex;
      gap: 10px;
      align-items: stretch;
    }

    .auth-submit-actions > .primary {
      flex: 1 1 auto;
      min-width: 0;
    }

    .auth-forgot-inline {
      flex: 0 0 auto;
      display: flex;
      align-items: stretch;
    }

    .auth-forgot-inline .secondary {
      white-space: nowrap;
      font-size: 12px;
      padding-inline: 10px;
    }

    .hidden { display: none; }

    /* Поле ID не должно оставаться видимым при Level2 (перекрытие специфичности). */
    #authId.hidden,
    #authEmail.hidden {
      display: none !important;
    }
    .status {
      font-size: 12px;
      color: var(--muted);
      white-space: normal;
      overflow-wrap: anywhere;
    }

    #authStatus {
      min-height: 22px;
      margin-top: 2px;
      padding: 6px 8px;
      border: 1px solid #9b3a3a;
      border-radius: 8px;
      background: rgba(155, 58, 58, 0.15);
      color: #ff9d9d;
      font-weight: 600;
      line-height: 1.25;
      display: none;
    }

    .auth-otp-modal-root {
      position: fixed;
      inset: 0;
      z-index: 4800;
      display: flex;
      align-items: center;
      justify-content: center;
      padding: max(16px, env(safe-area-inset-top)) max(16px, env(safe-area-inset-right))
        max(16px, env(safe-area-inset-bottom)) max(16px, env(safe-area-inset-left));
      box-sizing: border-box;
    }

    .auth-otp-modal-root.hidden {
      display: none;
    }

    .auth-otp-modal-backdrop {
      position: absolute;
      inset: 0;
      background: rgba(0, 0, 0, 0.58);
      backdrop-filter: blur(8px);
      -webkit-backdrop-filter: blur(8px);
    }

    .auth-otp-modal-card {
      position: relative;
      z-index: 1;
      width: min(440px, 100%);
      max-height: min(90vh, 560px);
      overflow: auto;
      border-radius: 18px;
      border: 1px solid color-mix(in srgb, var(--border) 85%, #6b8cff 15%);
      background: linear-gradient(
        165deg,
        color-mix(in srgb, var(--panel) 94%, #1a2240 6%),
        color-mix(in srgb, var(--panel) 88%, #0d1224 12%)
      );
      box-shadow:
        0 0 0 1px color-mix(in srgb, #6b8cff 12%, transparent),
        0 24px 48px rgba(0, 0, 0, 0.45);
      padding: 28px 24px 22px;
      text-align: center;
      isolation: isolate;
      transform: translateZ(0);
      -webkit-font-smoothing: subpixel-antialiased;
      -moz-osx-font-smoothing: auto;
      text-rendering: optimizeLegibility;
    }

    .auth-otp-modal-icon {
      width: 56px;
      height: 56px;
      margin: 0 auto 14px;
      border-radius: 16px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 26px;
      line-height: 1;
      background: linear-gradient(145deg, color-mix(in srgb, #6b8cff 35%, transparent), color-mix(in srgb, #4a90d9 22%, transparent));
      border: 1px solid color-mix(in srgb, #8eb4ff 40%, transparent);
      box-shadow: 0 8px 20px rgba(40, 80, 200, 0.2);
    }

    .auth-otp-modal-title {
      margin: 0 0 12px;
      font-size: 22px;
      font-weight: 800;
      letter-spacing: -0.02em;
      color: var(--text);
    }

    .auth-otp-modal-subtitle {
      margin: 0 0 14px;
      font-size: 15px;
      line-height: 1.52;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
      hyphens: none;
      -webkit-hyphens: none;
      overflow-wrap: break-word;
      word-break: normal;
    }

    .auth-otp-modal-subtitle strong.auth-otp-email {
      color: var(--text);
      font-weight: 700;
      word-break: break-all;
      display: inline;
    }

    .auth-otp-modal-subtitle .auth-otp-msg-line {
      display: block;
      margin-top: 8px;
      hyphens: none;
      -webkit-hyphens: none;
      word-break: normal;
      overflow-wrap: normal;
      color: color-mix(in srgb, var(--text) 88%, var(--muted));
    }

    .auth-otp-phrnowrap {
      white-space: nowrap;
    }

    .auth-otp-modal-lead {
      margin: 0 0 16px;
      font-size: 14px;
      color: var(--muted);
      line-height: 1.48;
      hyphens: none;
      -webkit-hyphens: none;
    }

    .auth-otp-digit-row {
      display: grid;
      grid-template-columns: repeat(6, minmax(0, 1fr));
      gap: 10px;
      width: min(340px, 100%);
      margin: 4px auto 0;
    }

    .auth-otp-digit {
      box-sizing: border-box;
      width: 100%;
      aspect-ratio: 1;
      max-height: 56px;
      min-height: 44px;
      padding: 0;
      margin: 0;
      border-radius: 14px;
      border: 1px solid color-mix(in srgb, var(--border) 72%, #6b8cff 28%);
      background: color-mix(in srgb, #070c18 84%, var(--panel) 16%);
      color: var(--text);
      font: inherit;
      font-size: 22px;
      font-weight: 700;
      text-align: center;
      font-variant-numeric: tabular-nums;
      line-height: 1;
      outline: none;
      caret-color: var(--text);
      transition:
        border-color 0.15s ease,
        box-shadow 0.15s ease,
        background 0.15s ease;
      -webkit-font-smoothing: subpixel-antialiased;
    }

    .auth-otp-digit::placeholder {
      color: transparent;
    }

    .auth-otp-digit:focus {
      border-color: color-mix(in srgb, #6b8cff 58%, var(--border));
      box-shadow: 0 0 0 3px color-mix(in srgb, #6b8cff 20%, transparent);
      background: color-mix(in srgb, #0a1224 82%, var(--panel) 18%);
    }

    .auth-otp-modal-error {
      margin-top: 12px;
      padding: 8px 10px;
      border-radius: 10px;
      border: 1px solid #9b3a3a;
      background: rgba(155, 58, 58, 0.15);
      color: #ff9d9d;
      font-size: 13px;
      font-weight: 600;
      line-height: 1.35;
      text-align: left;
      -webkit-font-smoothing: subpixel-antialiased;
    }

    .auth-otp-modal-error.hidden {
      display: none;
    }

    .auth-otp-modal-actions {
      display: flex;
      flex-direction: column;
      gap: 10px;
      margin-top: 20px;
    }

    .auth-otp-modal-actions .primary {
      width: 100%;
      min-height: 46px;
      font-size: 15px;
      font-weight: 700;
      border-radius: 12px;
    }

    .auth-otp-modal-actions .secondary {
      width: 100%;
      min-height: 40px;
      border-radius: 10px;
      font-size: 14px;
    }

    .boot-loading-overlay {
      display: none;
      position: fixed;
      inset: 0;
      z-index: 100000;
      flex-direction: column;
      align-items: center;
      justify-content: center;
      gap: 12px;
      background: #0c0c0f;
      color: rgba(255, 255, 255, 0.78);
      font-size: 15px;
    }
    html[data-boot] .boot-loading-overlay {
      display: flex;
    }
    .boot-loading-overlay__spinner {
      width: 28px;
      height: 28px;
      border: 2px solid rgba(255, 255, 255, 0.14);
      border-top-color: rgba(255, 255, 255, 0.88);
      border-radius: 50%;
      animation: boot-spin 0.85s linear infinite;
    }
    @keyframes boot-spin {
      to {
        transform: rotate(360deg);
      }
    }

    .profile-viewer-avatar.profile-viewer-avatar-btn:has(> .olone-user-avatar-fallback-active),
    .profile-edit-v37__avatar-wrap .profile-viewer-avatar-btn:has(> .olone-user-avatar-fallback-active),
    #profileViewerModal .profile-modal__avatar-inner > .profile-nitro-avatar-btn:has(> .olone-user-avatar-fallback-active),
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner > .profile-nitro-avatar-btn:has(> .olone-user-avatar-fallback-active) {
      display: flex;
      align-items: center;
      justify-content: center;
    }

    .dialog-avatar.olone-avatar-fallback,
    .peer-search-card-avatar.olone-avatar-fallback,
    .rail-avatar.olone-avatar-fallback {
      line-height: 0;
      font-weight: normal;
      letter-spacing: 0;
    }

    .profile-viewer-avatar-img.olone-user-avatar-fallback-active,
    .profile-nitro-avatar-img.olone-user-avatar-fallback-active,
    #profileViewerModal .profile-modal__avatar-inner img.olone-user-avatar-fallback-active,
    .col-user .col-user-profile-v37 .profile-modal__avatar-inner img.olone-user-avatar-fallback-active,
    .profile-edit-v37__avatar-wrap .profile-viewer-avatar-img.olone-user-avatar-fallback-active {
      position: static;
      top: auto;
      left: auto;
      right: auto;
      bottom: auto;
      inset: auto;
      transform: none;
      width: 60%;
      height: 60%;
      max-width: 60%;
      max-height: 60%;
      object-fit: contain;
      object-position: center center;
      border-radius: 0;
      background: transparent;
      display: block;
      z-index: 1;
    }

    .olone-avatar-fallback {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0;
      overflow: hidden;
      font-size: 0;
      font-weight: normal;
      letter-spacing: 0;
      line-height: 0;
    }

    /* Ensure placeholder is always hidden after avatar image loads.
       Overrides .olone-avatar-fallback display:flex rules. */
    .olone-avatar-fallback.hidden,
    #chatHeaderAvatarPh.hidden {
      display: none !important;
    }

    .olone-avatar-fallback .olone-avatar-fallback-icon,
    .olone-avatar-fallback img.olone-user-avatar-fallback-active,
    .olone-avatar-fallback img.rail-avatar-img.olone-user-avatar-fallback-active {
      width: 60%;
      height: 60%;
      max-width: 60%;
      max-height: 60%;
      object-fit: contain;
      object-position: center center;
      border-radius: 0;
      background: transparent;
      display: block;
      margin: 0;
      align-self: center;
      filter: none;
    }

    #chatHeaderAvatarPh.olone-avatar-fallback {
      width: 100%;
      height: 100%;
      font-size: 0;
      line-height: 0;
    }

    #chatHeaderAvatarPh .olone-avatar-fallback-icon {
      position: static;
      inset: auto;
      width: 60%;
      height: 60%;
      object-fit: contain;
      object-position: center center;
      display: block;
    }

    .gc-access-landing {
      padding: 24px 16px 32px;
      max-width: 720px;
      margin: 0 auto;
    }

    .gc-landing-card {
      border: 1px solid rgba(132, 158, 203, 0.16);
      border-radius: 16px;
      padding: 20px;
      background: rgba(255, 255, 255, 0.03);
      margin-bottom: 20px;
    }

    .gc-landing-badge {
      display: inline-block;
      font-size: 12px;
      font-weight: 700;
      padding: 4px 10px;
      border-radius: 999px;
      background: rgba(239, 68, 68, 0.15);
      color: #fca5a5;
      margin-bottom: 10px;
    }

    .gc-landing-badge--public {
      background: rgba(34, 197, 94, 0.12);
      color: #86efac;
    }

    .gc-landing-title {
      margin: 0 0 6px;
      font-size: 22px;
    }

    .gc-landing-slug,
    .gc-landing-desc {
      margin: 0 0 12px;
      color: rgba(154, 171, 197, 0.85);
    }

    .gc-landing-actions {
      display: flex;
      gap: 10px;
      flex-wrap: wrap;
    }

    .gc-preview-msg {
      border-bottom: 1px solid rgba(132, 158, 203, 0.1);
      padding: 10px 0;
      font-size: 14px;
    }

    .gc-preview-msg time {
      display: block;
      font-size: 11px;
      opacity: 0.65;
      margin-bottom: 4px;
    }

    /* ===== CHANNEL MEGAPHONE ICON (final 512px PNG, slot-sized hosts) ===== */

    .channel-icon-host {
      display: flex;
      align-items: center;
      justify-content: center;
      padding: 0 !important;
      margin: 0;
      background: transparent !important;
      background-image: none !important;
      border: 0 !important;
      box-shadow: none !important;
      border-radius: 50% !important;
      overflow: visible !important;
      line-height: 0;
      font-size: 0;
      color: transparent;
      text-transform: none;
      letter-spacing: 0;
      font-weight: normal;
    }

    .dialog-avatar.channel-icon-host,
    .rail-avatar.channel-icon-host,
    .entity-avatar-preview--ph.channel-icon-host,
    .channel-discovery-card-avatar.channel-icon-host,
    .channel-settings-avatar.channel-icon-host,
    #createChannelModalIcon.channel-icon-host,
    #chatHeaderAvatarPh.channel-icon-host,
    #chatMobileBackAvatarPh.channel-icon-host,
    .olone-chat-header__avatar:has(.channel-icon-host) {
      background: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      border: 0 !important;
      border-radius: 50% !important;
    }

    .channel-icon {
      display: block;
      width: 100%;
      height: 100%;
      max-width: none;
      max-height: none;
      object-fit: contain;
      object-position: center;
      padding: 0;
      margin: 0;
      border: 0;
      border-radius: 50%;
      background: transparent !important;
      box-shadow: none !important;
      flex: 0 0 auto;
    }

    .channel-icon-host .channel-icon,
    .channel-icon-host .channel-icon--svg-fallback {
      width: 100% !important;
      height: 100% !important;
      max-width: none !important;
      max-height: none !important;
      object-fit: contain !important;
      background: transparent !important;
      box-shadow: none !important;
      border: 0 !important;
      margin: 0;
      padding: 0;
      filter: none;
    }

    .dialog-avatar.channel-icon-host,
    .rail-avatar.channel-icon-host,
    .profile-v22-ch-avatar.channel-icon-host,
    .profile-v23-ch-av.channel-icon-host,
    .profile-v28-channel-av.channel-icon-host,
    .profile-nitro-project-avatar.channel-icon-host {
      width: 48px;
      height: 48px;
      min-width: 48px;
      min-height: 48px;
      flex-basis: 48px;
      border-radius: 50% !important;
    }

    #chatHeaderAvatarPh.channel-icon-host,
    .olone-chat-header__avatar:has(#chatHeaderAvatarPh.channel-icon-host) {
      width: 48px;
      height: 48px;
      min-width: 48px;
      min-height: 48px;
      border-radius: 50% !important;
    }

    #chatMobileBackAvatarPh.channel-icon-host {
      width: 48px;
      height: 48px;
      min-width: 48px;
      min-height: 48px;
      border-radius: 50% !important;
    }

    .channel-discovery-card-avatar.channel-icon-host,
    .entity-avatar-preview--ph.channel-icon-host[data-channel-icon-slot="discovery"] {
      width: 56px;
      height: 56px;
      min-width: 56px;
      min-height: 56px;
      border-radius: 50% !important;
    }

    .channel-settings-avatar.channel-icon-host,
    #channelSettingsAvatarPlaceholder.channel-icon-host {
      width: 72px;
      height: 72px;
      min-width: 72px;
      min-height: 72px;
      border-radius: 50% !important;
    }

    #createChannelModalIcon.channel-icon-host {
      width: 82px;
      height: 82px;
      min-width: 82px;
      min-height: 82px;
      flex: 0 0 82px;
      border-radius: 50% !important;
      overflow: visible !important;
    }

    @media (max-width: 600px) {
      #createChannelModalIcon.channel-icon-host {
        width: 64px;
        height: 64px;
        min-width: 64px;
        min-height: 64px;
        flex-basis: 64px;
      }
    }

    .channel-icon-host .initials,
    .channel-icon-host .avatar-initials,
    .channel-icon-host [data-initials],
    .channel-icon-host .olone-avatar-fallback-icon {
      display: none !important;
    }

    .channel-icon-host.olone-avatar-fallback {
      background: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      border: none !important;
    }

    .channel-icon--svg-fallback {
      display: flex;
      align-items: center;
      justify-content: center;
      color: #7eb8f7;
      background: transparent !important;
    }

    .channel-icon__svg {
      width: 100%;
      height: 100%;
      display: block;
    }

    .rail-comm-avatar-wrap:has(.channel-icon-host),
    .dialog-avatar-wrap:has(.channel-icon-host) {
      background: transparent !important;
      background-image: none !important;
      box-shadow: none !important;
      border: none !important;
    }

    .dialog-avatar.channel-icon-host > img.channel-icon,
    .rail-avatar.channel-icon-host > img.channel-icon,
    .channel-icon-host > img.channel-icon {
      width: 100% !important;
      height: 100% !important;
      max-width: none !important;
      max-height: none !important;
      transform: none !important;
    }